[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fchatwoot\u002Fcomponents":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":29,"examples":48,"showcases":201,"links":202,"dates":221},"\u002Fexamples\u002Fapps\u002Fchatwoot\u002Fcomponents","detail","components",true,{"title":9,"description":10,"og_image":11},"Chatwoot UI components examples - Nicelydone","Browse Chatwoot UI component design examples. Preview individual interface elements and explore related component categories. The modern customer support…","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fbf387a5b-8bb7-41a8-94af-12342536b7ea.png",[13,16,19,22],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":21},"Chatwoot design examples","\u002Fexamples\u002Fapps\u002Fchatwoot",{"label":23,"to":4},"Chatwoot UI components examples",{"title":23,"eyebrow":25,"description":26,"sections":27,"body":28},"SaaS app examples","Browse Chatwoot UI component design examples. Preview individual interface elements and explore related component categories. The modern customer support tool for your business",[],[],{"title":30,"slug":31,"description":32,"logo":33,"url":34,"categories":35},"Chatwoot","chatwoot","The modern customer support tool for your business","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F8a760d18-89b8-4b6e-bb53-ab1e430b5b73.png","https:\u002F\u002Fchatwoot.com",[36,40,44],{"id":37,"title":38,"slug":39},22,"Knowledge Management","knowledge-management",{"id":41,"title":42,"slug":43},45,"Open Source","open-source",{"id":45,"title":46,"slug":47},47,"Customer Service","customer-service",[49,64,77,90,103,116,129,142,155,168,178,188],{"uuid":50,"title":51,"description":52,"canonical_path":4,"image":11,"width":53,"height":54,"image_alt":55,"kind":56,"categories":57,"app":62},"7d8e9f57-2327-471e-9dd9-910d4a73e987","Chatwoot UI component","A user settings and navigation menu within an application interface.",709,994,"UI component from Chatwoot","component",[58],{"id":59,"title":60,"slug":61},190,"Dropdown menu","dropdown-menu",{"slug":31,"title":30,"logo":33,"categories":63},[],{"uuid":65,"title":51,"description":66,"canonical_path":4,"image":67,"width":68,"height":69,"image_alt":55,"kind":56,"categories":70,"app":75},"e33797d0-ec6c-4e53-9426-3c4eb3a81623","A modal dialog for selecting a date range using a calendar and preset options.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F1af4bd2a-d0d6-4521-8090-439e96433766.png",1895,1154,[71],{"id":72,"title":73,"slug":74},184,"Datepicker","datepicker",{"slug":31,"title":30,"logo":33,"categories":76},[],{"uuid":78,"title":51,"description":79,"canonical_path":4,"image":80,"width":81,"height":82,"image_alt":55,"kind":56,"categories":83,"app":88},"80170759-da7e-440a-86b7-337737ee9278","A message composition modal with fields for recipient, sender, and a rich text editor.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ff82d30ed-551b-4895-a7d1-fb27e4ef4f22.png",1511,1029,[84],{"id":85,"title":86,"slug":87},221,"Rich text editor","rich-text-editor",{"slug":31,"title":30,"logo":33,"categories":89},[],{"uuid":91,"title":51,"description":92,"canonical_path":4,"image":93,"width":94,"height":95,"image_alt":55,"kind":56,"categories":96,"app":101},"22e6113b-d4c9-465c-bc2e-de8b38397355","A contact management interface displaying a list of contacts and an empty state message with a call to action to add new contacts.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F09658e07-176e-4c96-ab09-300dcf7c1d55.png",2319,1445,[97],{"id":98,"title":99,"slug":100},302,"Empty state","emptystate",{"slug":31,"title":30,"logo":33,"categories":102},[],{"uuid":104,"title":51,"description":105,"canonical_path":4,"image":106,"width":107,"height":108,"image_alt":55,"kind":56,"categories":109,"app":114},"afbb53fa-fc33-48b0-94e8-253817bc6f51","A modal window prompting the user to upgrade their plan to access a premium AI feature.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Ff4c0cd91-90ca-40f1-a1c2-01b9e1660aae.png",1152,718,[110],{"id":111,"title":112,"slug":113},255,"Upgrade your plan","upgrade-your-plan",{"slug":31,"title":30,"logo":33,"categories":115},[],{"uuid":117,"title":51,"description":118,"canonical_path":4,"image":119,"width":120,"height":121,"image_alt":55,"kind":56,"categories":122,"app":127},"747b9be9-4f67-4977-a18d-715db6ed9307","A settings page displaying channel preferences with toggle switches for various communication features.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fa1b9a521-3a1b-4fe4-95c9-79beaa3a83ae.png",1600,1042,[123],{"id":124,"title":125,"slug":126},236,"Toggle\u002FSwitch","toggle-switch",{"slug":31,"title":30,"logo":33,"categories":128},[],{"uuid":130,"title":51,"description":131,"canonical_path":4,"image":132,"width":133,"height":134,"image_alt":55,"kind":56,"categories":135,"app":140},"f75215e4-b4cc-4553-8f91-477a70035976","User interface for configuring sender name options for business communication.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F51bab8c7-c115-4666-b5b5-b614d2a7574f.png",1604,654,[136],{"id":137,"title":138,"slug":139},216,"Radio button","radio-button",{"slug":31,"title":30,"logo":33,"categories":141},[],{"uuid":143,"title":51,"description":144,"canonical_path":4,"image":145,"width":146,"height":147,"image_alt":55,"kind":56,"categories":148,"app":153},"50e1d6cf-f5a9-4b4e-b7c7-1ab157bef592","An interface for selecting agents with a search input, a selected chip, and a 'no results found' message.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fed49b638-12bf-4044-8051-0959d29513b8.png",2003,499,[149],{"id":150,"title":151,"slug":152},252,"Input tag","input-tag",{"slug":31,"title":30,"logo":33,"categories":154},[],{"uuid":156,"title":51,"description":157,"canonical_path":4,"image":158,"width":159,"height":160,"image_alt":55,"kind":56,"categories":161,"app":166},"32e67630-c1d1-4896-bacb-9cfd18a23a54","A vertical stepper component guiding the user through a four-step integration and setup process for a communication platform.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F01d8c017-7321-4c0e-80a2-46db7e8d089a.png",738,1104,[162],{"id":163,"title":164,"slug":165},227,"Stepper","stepper",{"slug":31,"title":30,"logo":33,"categories":167},[],{"uuid":169,"title":51,"description":170,"canonical_path":4,"image":171,"width":172,"height":173,"image_alt":55,"kind":56,"categories":174,"app":176},"5c13daf2-0799-4fe9-bfbe-0472338c596c","A modal dialog for filtering conversations within a dark-themed application interface.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002Fa9f9fad5-1330-4c26-932e-376f2b012308.png",1648,509,[175],{"id":59,"title":60,"slug":61},{"slug":31,"title":30,"logo":33,"categories":177},[],{"uuid":179,"title":51,"description":180,"canonical_path":4,"image":181,"width":182,"height":183,"image_alt":55,"kind":56,"categories":184,"app":186},"bed4c942-7c57-42ee-8391-7a080573d148","A filter and sort popover with a status selection dropdown menu.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F30dc8c15-d462-427f-8708-bcf2d105c093.png",959,485,[185],{"id":59,"title":60,"slug":61},{"slug":31,"title":30,"logo":33,"categories":187},[],{"uuid":189,"title":51,"description":190,"canonical_path":4,"image":191,"width":192,"height":193,"image_alt":55,"kind":56,"categories":194,"app":199},"19082657-b04c-44ce-b5f1-f1a408fd2ff6","A modal window displaying a list of keyboard shortcuts for an application.","https:\u002F\u002Fassets.nicelydone.club\u002Felements\u002Ffull\u002F5ddfb1d0-de16-4ac2-8424-cac7c368b13a.png",2026,1250,[195],{"id":196,"title":197,"slug":198},284,"Modal","modal",{"slug":31,"title":30,"logo":33,"categories":200},[],[],[203,206,209,212,215,218],{"label":204,"to":205},"Chatwoot product screens","\u002Fexamples\u002Fapps\u002Fchatwoot\u002Fscreens",{"label":207,"to":208},"Chatwoot marketing pages","\u002Fexamples\u002Fapps\u002Fchatwoot\u002Fmarketing",{"label":210,"to":211},"Chatwoot user flows","\u002Fexamples\u002Fapps\u002Fchatwoot\u002Fflows",{"label":213,"to":214},"Knowledge Management app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fknowledge-management",{"label":216,"to":217},"Open Source app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fopen-source",{"label":219,"to":220},"Customer Service app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fcustomer-service",{"published_at":222,"updated_at":223},"2026-04-03T17:59:52.000Z","2026-09-13T13:02:39.000Z"]