# @colletdev/react — Collet API index

Collet 0.6.1 provides 60 accessible UI components from one Rust source. GA targets: Custom Elements, React, Vue, Svelte, Angular, React Native WebView (`@colletdev/react-native-webview`), and Iced (native Rust). Experimental pre-release targets — not production-ready: iOS (SwiftUI), Android (Jetpack Compose), React Native true-native (`@colletdev/react-native`), Slint, and GPUI.

Use [llms-full.txt](./llms-full.txt) for exact props, events, slots, methods, defaults, and copyable examples. Structured object/array values are framework properties; do not stringify them. HTML attributes are kebab-case and wrapper props are camelCase. Every DOM event is a typed `CustomEvent<NamedDetail>`.

Booleans: an absent attribute means "use the default" (22 fields default to TRUE, so absent is NOT false); the literal `attr="false"` is the only spelling of false; any other present value is true.

Slot projection: to put a live element (with working event handlers) inside a component, name a slot in the config — `TableCell.slot`, `TableRow.detail_slot`, `TabItem.content_slot`, `AccordionItem.panel_slot` — and give a DIRECT child of the host a matching `slot="NAME"` attribute. Passing HTML strings instead silently discards every listener. Field names are snake_case.

Localization: `setStrings({ 'date_picker.previous_month': '…' })` or `init({ strings })`; read valid keys from `stringKeys()`.

- [Accordion](./llms-full.txt#accordion-cxaccordion) — `<cx-accordion>`
- [ActivityGroup](./llms-full.txt#activitygroup-cxactivitygroup) — `<cx-activity-group>`
- [Alert](./llms-full.txt#alert-cxalert) — `<cx-alert>`
- [Autocomplete](./llms-full.txt#autocomplete-cxautocomplete) — `<cx-autocomplete>`
- [Avatar](./llms-full.txt#avatar-cxavatar) — `<cx-avatar>`
- [Backdrop](./llms-full.txt#backdrop-cxbackdrop) — `<cx-backdrop>`
- [Badge](./llms-full.txt#badge-cxbadge) — `<cx-badge>`
- [Breadcrumb](./llms-full.txt#breadcrumb-cxbreadcrumb) — `<cx-breadcrumb>`
- [Button](./llms-full.txt#button-cxbutton) — `<cx-button>`
- [Card](./llms-full.txt#card-cxcard) — `<cx-card>`
- [Carousel](./llms-full.txt#carousel-cxcarousel) — `<cx-carousel>`
- [Chat](./llms-full.txt#chat-cxchat) — `<cx-chat>`
- [ChatInput](./llms-full.txt#chatinput-cxchatinput) — `<cx-chat-input>`
- [Checkbox](./llms-full.txt#checkbox-cxcheckbox) — `<cx-checkbox>`
- [CodeBlock](./llms-full.txt#codeblock-cxcodeblock) — `<cx-code-block>`
- [Collapsible](./llms-full.txt#collapsible-cxcollapsible) — `<cx-collapsible>`
- [CommandPalette](./llms-full.txt#commandpalette-cxcommandpalette) — `<cx-command-palette>`
- [DatePicker](./llms-full.txt#datepicker-cxdatepicker) — `<cx-date-picker>`
- [Dialog](./llms-full.txt#dialog-cxdialog) — `<cx-dialog>`
- [Drawer](./llms-full.txt#drawer-cxdrawer) — `<cx-drawer>`
- [Fab](./llms-full.txt#fab-cxfab) — `<cx-fab>`
- [FileUpload](./llms-full.txt#fileupload-cxfileupload) — `<cx-file-upload>`
- [Flavour](./llms-full.txt#flavour-cxflavour) — `<cx-flavour>`
- [Label](./llms-full.txt#label-cxlabel) — `<cx-label>`
- [Listbox](./llms-full.txt#listbox-cxlistbox) — `<cx-listbox>`
- [Menu](./llms-full.txt#menu-cxmenu) — `<cx-menu>`
- [MessageBubble](./llms-full.txt#messagebubble-cxmessagebubble) — `<cx-message-bubble>`
- [MessageGroup](./llms-full.txt#messagegroup-cxmessagegroup) — `<cx-message-group>`
- [MessagePart](./llms-full.txt#messagepart-cxmessagepart) — `<cx-message-part>`
- [MessageTimeline](./llms-full.txt#messagetimeline-cxmessagetimeline) — `<cx-message-timeline>`
- [Pagination](./llms-full.txt#pagination-cxpagination) — `<cx-pagination>`
- [Popover](./llms-full.txt#popover-cxpopover) — `<cx-popover>`
- [ProfileMenu](./llms-full.txt#profilemenu-cxprofilemenu) — `<cx-profile-menu>`
- [Progress](./llms-full.txt#progress-cxprogress) — `<cx-progress>`
- [RadioGroup](./llms-full.txt#radiogroup-cxradiogroup) — `<cx-radio-group>`
- [ScrollArea](./llms-full.txt#scrollarea-cxscrollarea) — `<cx-scroll-area>`
- [Scrollbar](./llms-full.txt#scrollbar-cxscrollbar) — `<cx-scrollbar>`
- [SearchBar](./llms-full.txt#searchbar-cxsearchbar) — `<cx-search-bar>`
- [Select](./llms-full.txt#select-cxselect) — `<cx-select>`
- [Separator](./llms-full.txt#separator-cxseparator) — `<cx-separator>`
- [Sidebar](./llms-full.txt#sidebar-cxsidebar) — `<cx-sidebar>`
- [Skeleton](./llms-full.txt#skeleton-cxskeleton) — `<cx-skeleton>`
- [Slider](./llms-full.txt#slider-cxslider) — `<cx-slider>`
- [SpeedDial](./llms-full.txt#speeddial-cxspeeddial) — `<cx-speed-dial>`
- [Spinner](./llms-full.txt#spinner-cxspinner) — `<cx-spinner>`
- [SplitButton](./llms-full.txt#splitbutton-cxsplitbutton) — `<cx-split-button>`
- [Stepper](./llms-full.txt#stepper-cxstepper) — `<cx-stepper>`
- [Switch](./llms-full.txt#switch-cxswitch) — `<cx-switch>`
- [Table](./llms-full.txt#table-cxtable) — `<cx-table>`
- [Tabs](./llms-full.txt#tabs-cxtabs) — `<cx-tabs>`
- [TagInput](./llms-full.txt#taginput-cxtaginput) — `<cx-tag-input>`
- [Text](./llms-full.txt#text-cxtext) — `<cx-text>`
- [TextInput](./llms-full.txt#textinput-cxtextinput) — `<cx-text-input>`
- [Thinking](./llms-full.txt#thinking-cxthinking) — `<cx-thinking>`
- [Toast](./llms-full.txt#toast-cxtoast) — `<cx-toast>`
- [ToggleGroup](./llms-full.txt#togglegroup-cxtogglegroup) — `<cx-toggle-group>`
- [Tooltip](./llms-full.txt#tooltip-cxtooltip) — `<cx-tooltip>`
- [TopBar](./llms-full.txt#topbar-cxtopbar) — `<cx-top-bar>`
- [TreeView](./llms-full.txt#treeview-cxtreeview) — `<cx-tree-view>`
- [Treemap](./llms-full.txt#treemap-cxtreemap) — `<cx-treemap>`