@urbicon-ui/design-content 6.1.8 → 6.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/content/blocks/components/calendar/llm.txt +1 -1
  2. package/content/blocks/components/command-palette/llm.txt +1 -4
  3. package/content/blocks/components/composition-bar/llm.txt +1 -4
  4. package/content/blocks/components/empty-state/llm.txt +1 -1
  5. package/content/blocks/components/file-upload/llm.txt +1 -1
  6. package/content/blocks/components/guide/llm.txt +1 -4
  7. package/content/blocks/components/guide-article/llm.txt +1 -4
  8. package/content/blocks/components/guide-beacon/llm.txt +1 -4
  9. package/content/blocks/components/guide-hint/llm.txt +1 -4
  10. package/content/blocks/components/guide-marker/llm.txt +1 -4
  11. package/content/blocks/components/guide-mention/llm.txt +1 -4
  12. package/content/blocks/components/guide-panel/llm.txt +1 -4
  13. package/content/blocks/components/planner/llm.txt +1 -1
  14. package/content/blocks/components/sankey/llm.txt +1 -4
  15. package/content/blocks/components/theme-switcher/llm.txt +5 -6
  16. package/content/blocks/primitives/accordion/llm.txt +2 -5
  17. package/content/blocks/primitives/alert/llm.txt +1 -4
  18. package/content/blocks/primitives/avatar/llm.txt +1 -4
  19. package/content/blocks/primitives/badge/llm.txt +1 -4
  20. package/content/blocks/primitives/breadcrumb/llm.txt +1 -4
  21. package/content/blocks/primitives/button/llm.txt +1 -4
  22. package/content/blocks/primitives/button-group/llm.txt +1 -4
  23. package/content/blocks/primitives/card/llm.txt +1 -4
  24. package/content/blocks/primitives/checkbox/llm.txt +1 -4
  25. package/content/blocks/primitives/collapsible/llm.txt +1 -4
  26. package/content/blocks/primitives/combobox/llm.txt +1 -4
  27. package/content/blocks/primitives/dialog/llm.txt +1 -4
  28. package/content/blocks/primitives/drawer/llm.txt +1 -4
  29. package/content/blocks/primitives/input/llm.txt +1 -4
  30. package/content/blocks/primitives/pagination/llm.txt +1 -4
  31. package/content/blocks/primitives/progress/llm.txt +1 -4
  32. package/content/blocks/primitives/radio-group/llm.txt +1 -4
  33. package/content/blocks/primitives/segment-group/llm.txt +1 -4
  34. package/content/blocks/primitives/select/llm.txt +1 -4
  35. package/content/blocks/primitives/sidebar/llm.txt +1 -4
  36. package/content/blocks/primitives/skeleton/llm.txt +1 -4
  37. package/content/blocks/primitives/slider/llm.txt +1 -4
  38. package/content/blocks/primitives/spinner/llm.txt +1 -4
  39. package/content/blocks/primitives/stepper/llm.txt +1 -4
  40. package/content/blocks/primitives/tab/llm.txt +1 -4
  41. package/content/blocks/primitives/textarea/llm.txt +1 -4
  42. package/content/blocks/primitives/toast/llm.txt +1 -4
  43. package/content/blocks/primitives/toggle/llm.txt +1 -4
  44. package/content/blocks/primitives/toolbar/llm.txt +1 -4
  45. package/content/blocks/primitives/tooltip/llm.txt +1 -4
  46. package/content/component-catalog.json +43 -355
  47. package/content/design-system/principles.md +2 -1
  48. package/content/guides/llms-full-template.md +24 -9
  49. package/content/meta.json +3 -3
  50. package/package.json +1 -1
@@ -88,7 +88,7 @@ buckets your own domain content (meals, shifts, bookings) per day, use `Planner`
88
88
  | showViewSwitcher | `boolean` | no | true | Show the view switcher in the header. |
89
89
  | showWeekNumbers | `boolean` | no | false | Show ISO week numbers in the left margin. |
90
90
  | size | `'sm' | 'md' | 'lg'` | no | 'md' | Size variant that controls dimensions and spacing of the Calendar |
91
- | slotClasses | `Partial<Record<CalendarSlotName, string>>` | no | | Per-slot class overrides. |
91
+ | slotClasses | `Partial<Record<CalendarSlots, string>>` | no | | Per-slot class overrides. |
92
92
  | swipeable | `boolean` | no | true | Enable swipe gestures for touch navigation. |
93
93
  | timeGridEndHour | `number` | no | 20 | Last visible hour in time grid (exclusive). |
94
94
  | timeGridInterval | `30 | 60` | no | 60 | Time slot interval in minutes. |
@@ -53,8 +53,5 @@ Open via bind:open or the built-in Cmd+K shortcut.
53
53
  | shortcut | `string | false` | no | 'mod+k' (Cmd+K / Ctrl+K) | Register a global keyboard shortcut that toggles the palette. Set to `false` to disable. |
54
54
  | showFooter | `boolean` | no | true | Show keyboard-shortcut hints in the footer. |
55
55
  | size | `CommandPaletteVariants['size']` | no | 'md' | Maximum width of the palette panel. |
56
- | slotClasses | `Partial<Record<'wrapper' | 'input' | 'inputIcon' | 'clearButton' | 'list' | 'group' | 'groupLabel' | 'item' | 'itemHighlighted' | 'itemDefault' | 'itemDisabled' | 'itemIcon' | 'itemLabel' | 'itemShortcut' | 'empty' | 'footer' | 'kbd', string>>` | no | | Per-slot class overrides. |
56
+ | slotClasses | `Partial<Record<CommandPaletteSlots, string>>` | no | | Per-slot class overrides. |
57
57
  | unstyled | `boolean` | no | false | Strip all default styles. |
58
-
59
- ### Slots (slotClasses keys)
60
- `wrapper`, `input`, `inputIcon`, `clearButton`, `list`, `group`, `groupLabel`, `item`, `itemHighlighted`, `itemDefault`, `itemDisabled`, `itemIcon`, `itemLabel`, `itemShortcut`, `empty`, `footer`, `kbd`
@@ -52,7 +52,7 @@ sync. Tooltip content is fully overridable via the `tooltip` snippet.
52
52
  | showPercentages | `boolean` | no | true | Show percentages in legend and tooltip. |
53
53
  | showTotal | `boolean` | no | false | Render the total value after the legend. |
54
54
  | showValues | `boolean` | no | false | Render the value directly inside the bar segment (in addition to the legend). Narrow segments are skipped automatically to prevent overflow — only segments with sufficient width (≥ 8% or ~40 px) show their value. Useful for print, PDF attachments, or dense dashboards where hover tooltips are not enough. |
55
- | slotClasses | `Partial<Record<'wrapper' | 'barWrapper' | 'bar' | 'segment' | 'segmentRest' | 'tooltip' | 'tooltipLabel' | 'tooltipDetail' | 'legend' | 'legendItem' | 'legendDot' | 'legendLabel' | 'legendValue' | 'total' | 'totalLabel', string>>` | no | | Per-slot class overrides. |
55
+ | slotClasses | `Partial<Record<CompositionBarSlots, string>>` | no | | Per-slot class overrides. |
56
56
  | tooltip | `Snippet<[item: CompositionItem, percent: number]>` | no | | Custom tooltip content. Replaces the default layout (label, value, percent). |
57
57
  | total | `number` | no | | Optional fixed total value. Default: Σ items.value. If the explicit total exceeds the sum, the remaining area is rendered neutrally ("unaccounted share"). If it is below the sum, segments are scaled to 100% and a console warning is emitted. |
58
58
  | totalLabel | `string` | no | | Label rendered before the total. Defaults to the localized "Total" label from the blocks i18n bundle. |
@@ -64,6 +64,3 @@ sync. Tooltip content is fully overridable via the `tooltip` snippet.
64
64
  Inherited from:
65
65
  - Omit<CompositionBarVariants, 'isHovered'> (omit-pattern)
66
66
  - Omit<HTMLAttributes<HTMLDivElement>, 'children'> (omit-pattern)
67
-
68
- ### Slots (slotClasses keys)
69
- `wrapper`, `barWrapper`, `bar`, `segment`, `segmentRest`, `tooltip`, `tooltipLabel`, `tooltipDetail`, `legend`, `legendItem`, `legendDot`, `legendLabel`, `legendValue`, `total`, `totalLabel`
@@ -36,7 +36,7 @@ optional call-to-action slot.
36
36
  | description | `string` | no | | Supporting paragraph below the title. |
37
37
  | icon | `Component<IconProps>` | no | | Icon component rendered above the title. Pass any icon from `@urbicon-ui/blocks/icons` (or a compatible stroke icon). |
38
38
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ EmptyState: {...} }}>`. Prefer this over `class` overrides when the same look should be reused across the project. |
39
- | slotClasses | `Partial<Record<EmptyStateSlot, string>>` | no | | Per-slot class overrides. |
39
+ | slotClasses | `Partial<Record<EmptyStateSlots, string>>` | no | | Per-slot class overrides. Slots: base | iconWrapper | title | description | children | cta |
40
40
  | unstyled | `boolean` | no | | Remove all default tv classes. |
41
41
 
42
42
  Inherited from:
@@ -64,7 +64,7 @@ Drag-and-drop file upload with validation, image previews, progress tracking, an
64
64
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ FileUpload: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
65
65
  | preventDocumentDrop | `boolean` | no | true | Prevent browser navigation when files are dropped outside the zone. |
66
66
  | required | `boolean` | no | | Mark as required for form validation. |
67
- | slotClasses | `Partial<Record<FileUploadSlotName, string>>` | no | | Per-slot class overrides. |
67
+ | slotClasses | `Partial<Record<FileUploadSlots, string>>` | no | | Per-slot class overrides. |
68
68
  | title | `string` | no | | Dropzone title text. |
69
69
  | unstyled | `boolean` | no | | Strip all default styles. |
70
70
  | validate | `(file: File) => FileUploadError[] | null` | no | | Custom validation function. Return errors array or null. |
@@ -42,8 +42,5 @@ renders centered over a full scrim. Renders inert without a `GuideProvider`.
42
42
  | placement | `Placement` | no | 'bottom' | Preferred bubble placement when a step omits its own `placement`. |
43
43
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Guide: {...} }}>`. |
44
44
  | radius | `number` | no | | Spotlight hole corner radius in px. When omitted, it follows the target's own border-radius (plus `padding`), clamped to the hole size. Set a number to force it. |
45
- | slotClasses | `Partial<Record<'container' | 'scrim' | 'bubble' | 'arrow' | 'title' | 'body' | 'progress' | 'dots' | 'dot' | 'dotActive' | 'stepText' | 'footer' | 'spacer' | 'skip' | 'prev' | 'next', string>>` | no | | Per-slot class overrides. |
45
+ | slotClasses | `Partial<Record<GuideTourSlots | 'skip' | 'prev' | 'next', string>>` | no | | Per-slot class overrides. Beyond the tour's own `tv()` slots, `skip` / `prev` / `next` forward to the footer's nested `<Button>`s (which own their internal markup). |
46
46
  | unstyled | `boolean` | no | false | Strip all default styles. |
47
-
48
- ### Slots (slotClasses keys)
49
- `container`, `scrim`, `bubble`, `arrow`, `title`, `body`, `progress`, `dots`, `dot`, `dotActive`, `stepText`, `footer`, `spacer`, `skip`, `prev`, `next`
@@ -23,8 +23,5 @@ list (by `title`) and renders its content only when it is the active article
23
23
  | children | `Snippet` | no | | Content to render inside the GuideArticle component |
24
24
  | class | `string` | no | | Additional classes on the article root. |
25
25
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ GuideArticle: {...} }}>`. |
26
- | slotClasses | `Partial<Record<'article', string>>` | no | | Per-slot class overrides. |
26
+ | slotClasses | `Partial<Record<GuideArticleSlots, string>>` | no | | Per-slot class overrides. |
27
27
  | unstyled | `boolean` | no | false | Strip all default styles. |
28
-
29
- ### Slots (slotClasses keys)
30
- `article`
@@ -30,9 +30,6 @@ halts under `prefers-reduced-motion` (static dot). Renders inert without a `Guid
30
30
  | once | `boolean` | no | true | Hide the beacon once its `tour` has been seen (and while that tour is running). Needs `tour`. |
31
31
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ GuideBeacon: {...} }}>`. |
32
32
  | size | `GuideBeaconVariants['size']` | no | 'md' | Visual size of the hotspot. |
33
- | slotClasses | `Partial<Record<'beacon' | 'ping' | 'dot', string>>` | no | | Per-slot class overrides. |
33
+ | slotClasses | `Partial<Record<GuideBeaconSlots, string>>` | no | | Per-slot class overrides. |
34
34
  | tour | `GuideTour` | no | | The tour to start when the beacon is activated. When set, the beacon also hides itself once the tour has been seen (subject to `once`). Omit to drive everything from `onActivate`. |
35
35
  | unstyled | `boolean` | no | false | Strip all default styles. |
36
-
37
- ### Slots (slotClasses keys)
38
- `beacon`, `ping`, `dot`
@@ -32,10 +32,7 @@ tour is open. Dismissable; announces itself via `aria-live`. Renders inert witho
32
32
  | placement | `Placement` | no | 'bottom' | Preferred placement relative to the target. |
33
33
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ GuideHint: {...} }}>`. |
34
34
  | seenId | `string` | no | the `for` id | Persistence key for the "seen once" state, decoupled from the anchor (this is *not* a DOM id — the popover gets none). Override only to track two hints on one element independently, or to keep a stable key across a renamed anchor. |
35
- | slotClasses | `Partial<Record<'hint' | 'title' | 'body' | 'dismiss' | 'arrow', string>>` | no | | Per-slot class overrides. |
35
+ | slotClasses | `Partial<Record<GuideHintSlots, string>>` | no | | Per-slot class overrides. |
36
36
  | title | `string` | no | | Optional bold heading above the body. |
37
37
  | trigger | `'mount' | 'manual'` | no | 'mount' | When the hint may appear: `'mount'` shows it as soon as it mounts; `'manual'` waits for `open` to become `true` (the consumer's route/condition logic). |
38
38
  | unstyled | `boolean` | no | false | Strip all default styles. |
39
-
40
- ### Slots (slotClasses keys)
41
- `hint`, `title`, `body`, `dismiss`, `arrow`
@@ -29,8 +29,5 @@ or when the topic's direction excludes UI→Guide (`'to-ui'`).
29
29
  | label | `string` | no | i18n `guide.infoAbout` (with the topic's label) or `guide.info` | Accessible label for the icon button. |
30
30
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ GuideMarker: {...} }}>`. |
31
31
  | size | `GuideMarkerVariants['size']` | no | 'md' | Size variant that controls dimensions and spacing of the GuideMarker |
32
- | slotClasses | `Partial<Record<'marker' | 'icon', string>>` | no | | Per-slot class overrides. |
32
+ | slotClasses | `Partial<Record<GuideMarkerSlots, string>>` | no | | Per-slot class overrides. |
33
33
  | unstyled | `boolean` | no | false | Strip all default styles. |
34
-
35
- ### Slots (slotClasses keys)
36
- `marker`, `icon`
@@ -24,8 +24,5 @@ view (reduced-motion-aware). A real `<button>`; degrades to plain inline text wi
24
24
  | direction | `GuideDirection` | no | the topic's `direction`, or `'both'` | Override the topic's link direction. The mention is interactive unless this resolves to `'to-guide'`. |
25
25
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ GuideMention: {...} }}>`. |
26
26
  | scroll | `boolean` | no | true | Scroll the target into view on click (reduced-motion-aware). |
27
- | slotClasses | `Partial<Record<'mention', string>>` | no | | Per-slot class overrides. |
27
+ | slotClasses | `Partial<Record<GuideMentionSlots, string>>` | no | | Per-slot class overrides. |
28
28
  | unstyled | `boolean` | no | false | Strip all default styles. |
29
-
30
- ### Slots (slotClasses keys)
31
- `mention`
@@ -34,9 +34,6 @@ inside: the panel shows a list of them, or the active article's content with a b
34
34
  | placement | `GuidePanelVariants['placement']` | no | 'right' | Side the panel docks to. |
35
35
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ GuidePanel: {...} }}>`. |
36
36
  | size | `GuidePanelVariants['size']` | no | 'md' | Size variant that controls dimensions and spacing of the GuidePanel |
37
- | slotClasses | `Partial<Record<'panel' | 'header' | 'backButton' | 'title' | 'closeButton' | 'body' | 'list' | 'listItem' | 'footer', string>>` | no | | Per-slot class overrides. |
37
+ | slotClasses | `Partial<Record<GuidePanelSlots, string>>` | no | | Per-slot class overrides. |
38
38
  | title | `string` | no | i18n `guide.openHelp` | Heading shown when no article is open. |
39
39
  | unstyled | `boolean` | no | false | Strip all default styles. |
40
-
41
- ### Slots (slotClasses keys)
42
- `panel`, `header`, `backButton`, `title`, `closeButton`, `body`, `list`, `listItem`, `footer`
@@ -54,7 +54,7 @@ bind:value={referenceDate} onNavigate={(_, range) => loadWeek(range.start)}>
54
54
  | selectedDate | `Date` | no | | The active highlighted day. Supports `bind:selectedDate`. |
55
55
  | showWeekNumber | `boolean` | no | false | Show the ISO week-number column on the left. |
56
56
  | size | `'sm' | 'md' | 'lg'` | no | 'md' | Density of the grid and header. |
57
- | slotClasses | `Partial<Record<PlannerSlotName, string>>` | no | | Per-slot class overrides merged with tv() styles. |
57
+ | slotClasses | `Partial<Record<PlannerSlots, string>>` | no | | Per-slot class overrides merged with tv() styles. Slots: base | header | headerTitle | nav | navButton | grid | weekdayHeader | weekday | weekNumber | week | cell | cellHeader | cellWeekday | cellDate | cellItems | empty |
58
58
  | sort | `(a: T, b: T) => number` | no | | Comparator for items within a day cell (e.g. by meal type or start label). |
59
59
  | swipeable | `boolean` | no | true | Enable horizontal swipe-to-navigate on touch. |
60
60
  | unstyled | `boolean` | no | false | Remove all default tv() classes — only user-provided classes apply. |
@@ -59,7 +59,7 @@ sr-only table provides a screen-reader fallback with source/target/value.
59
59
  | onNodeClick | `(node: SankeyLaidOutNodeWithMeta) => void` | no | | Click callback for a node. |
60
60
  | preset | `string` | no | | Preset property for the Sankey component |
61
61
  | showValues | `boolean` | no | false | Persistently display values next to node labels (instead of only in the hover tooltip). Useful for print, PDF attachments, static screenshots, or tenant- and client-facing statements where hovering is not possible. Uses `formatValue` for formatting. |
62
- | slotClasses | `Partial<Record<'wrapper' | 'svg' | 'node' | 'nodeRect' | 'nodeLabel' | 'nodeValue' | 'link' | 'tooltip' | 'tooltipLabel' | 'tooltipDetail', string>>` | no | | Per-slot class overrides. |
62
+ | slotClasses | `Partial<Record<SankeySlots, string>>` | no | | Per-slot class overrides. |
63
63
  | tooltip | `Snippet<[datum: SankeyLaidOutNodeWithMeta | SankeyLaidOutLinkWithMeta, kind: 'node' | 'link']>` | no | | Custom tooltip content for node or path. |
64
64
  | unstyled | `boolean` | no | | Remove default classes. |
65
65
  | width | `number` | no | | Optional fixed width. Default: derived from the container via ResizeObserver. Set a value only if you need SSR-stable layouts and are willing to give up responsiveness. |
@@ -67,6 +67,3 @@ sr-only table provides a screen-reader fallback with source/target/value.
67
67
  Inherited from:
68
68
  - Omit<SankeyVariants, never> (omit-pattern)
69
69
  - Omit<HTMLAttributes<HTMLDivElement>, 'children'> (omit-pattern)
70
-
71
- ### Slots (slotClasses keys)
72
- `wrapper`, `svg`, `node`, `nodeRect`, `nodeLabel`, `nodeValue`, `link`, `tooltip`, `tooltipLabel`, `tooltipDetail`
@@ -2,8 +2,10 @@
2
2
  ---
3
3
 
4
4
  ## ThemeSwitcher
5
- Cycles between light, dark, and system color schemes.
6
- Applies light/dark classes on the html element and persists to localStorage.
5
+ Cycles between light, dark, and system color schemes. Sets a
6
+ `light`/`dark` class on the `<html>` element for explicit choices and clears
7
+ it in system mode (so the CSS `light-dark()` function follows the OS natively).
8
+ Persists the choice to localStorage.
7
9
 
8
10
  **Import:** `import { ThemeSwitcher } from '@urbicon-ui/blocks';`
9
11
 
@@ -29,12 +31,9 @@ Applies light/dark classes on the html element and persists to localStorage.
29
31
  | onThemeChange | `(theme: Theme) => void` | no | | Called after the theme changes. |
30
32
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ ThemeSwitcher: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
31
33
  | size | `ThemeSwitcherVariants['size']` | no | 'md' | Size variant that controls dimensions and spacing of the ThemeSwitcher |
32
- | slotClasses | `Partial<Record<'button' | 'icon', string>>` | no | | Per-slot class overrides. |
34
+ | slotClasses | `Partial<Record<ThemeSwitcherSlots, string>>` | no | | Per-slot class overrides. |
33
35
  | storageKey | `string | false` | no | 'urbicon-theme' | `localStorage` key for persistence. Set to `false` to disable. |
34
36
  | strategy | `'cycle' | 'toggle'` | no | 'cycle' | Interaction mode. - `'cycle'` — single button cycling light → dark → system (default) - `'toggle'` — single button toggling light ↔ dark (no system option) |
35
37
  | theme | `Theme` | no | 'system' | Current theme. Supports `bind:theme`. |
36
38
  | unstyled | `boolean` | no | false | Strip all default styles. |
37
39
  | variant | `ThemeSwitcherVariants['variant']` | no | 'ghost' | Visual style of the button. |
38
-
39
- ### Slots (slotClasses keys)
40
- `button`, `icon`
@@ -14,7 +14,7 @@ Supports single or multiple open items, keyboard navigation, and ARIA accordion
14
14
  A Svelte 5 component library with built-in i18n and design tokens.
15
15
  </AccordionItem>
16
16
  <AccordionItem value="faq-2" title="How does dark mode work?">
17
- Semantic tokens automatically handle light/dark via prefers-color-scheme.
17
+ Semantic tokens automatically handle light/dark via the CSS light-dark() function.
18
18
  </AccordionItem>
19
19
  </Accordion>
20
20
  ```
@@ -43,7 +43,7 @@ Supports single or multiple open items, keyboard navigation, and ARIA accordion
43
43
  | onValueChange | `(value: string | string[]) => void` | no | | Callback when open items change |
44
44
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Accordion: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
45
45
  | size | `'sm' | 'md' | 'lg'` | no | 'md' | Size variant that controls dimensions and spacing of the Accordion |
46
- | slotClasses | `Partial<Record<'base' | 'item' | 'trigger' | 'chevron' | 'content' | 'contentInner', string>>` | no | | Per-slot class overrides |
46
+ | slotClasses | `Partial<Record<AccordionSlots, string>>` | no | | Per-slot class overrides. Slots: base | item | trigger | chevron | content | contentInner |
47
47
  | type | `'single' | 'multiple'` | no | 'single' | Allow single or multiple items open at once |
48
48
  | unstyled | `boolean` | no | | Remove default styles |
49
49
  | value | `string | string[]` | no | | Controlled open item(s) – string for single, string[] for multiple |
@@ -52,6 +52,3 @@ Supports single or multiple open items, keyboard navigation, and ARIA accordion
52
52
  Inherited from:
53
53
  - AccordionVariants (external)
54
54
  - Omit<HTMLAttributes<HTMLDivElement>, 'children'> (omit-pattern)
55
-
56
- ### Slots (slotClasses keys)
57
- `base`, `item`, `trigger`, `chevron`, `content`, `contentInner`
@@ -41,7 +41,7 @@ or informational messages. Supports icons, titles, descriptions, actions, and di
41
41
  | onDismiss | `() => void` | no | | Callback when dismissed |
42
42
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Alert: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
43
43
  | size | `'sm' | 'md' | 'lg'` | no | 'md' | Size variant that controls dimensions and spacing of the Alert |
44
- | slotClasses | `Partial<Record<'base' | 'icon' | 'content' | 'title' | 'description' | 'actions' | 'dismissButton', string>>` | no | | Per-slot class overrides |
44
+ | slotClasses | `Partial<Record<AlertSlots, string>>` | no | | Per-slot class overrides. Slots: base | icon | content | title | description | actions | dismissButton |
45
45
  | title | `string` | no | | Alert title (bold header text) |
46
46
  | unstyled | `boolean` | no | | Remove default styles |
47
47
  | variant | `'soft' | 'inline' | 'filled'` | no | 'soft' | Visual style variant for the Alert component |
@@ -49,6 +49,3 @@ or informational messages. Supports icons, titles, descriptions, actions, and di
49
49
  Inherited from:
50
50
  - AlertVariants (external)
51
51
  - Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'children'> (omit-pattern)
52
-
53
- ### Slots (slotClasses keys)
54
- `base`, `icon`, `content`, `title`, `description`, `actions`, `dismissButton`
@@ -41,7 +41,7 @@ User profile image component with fallback initials, multiple sizes, and interac
41
41
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Avatar: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
42
42
  | randomColor | `boolean` | no | | Derive a deterministic background color from `name`. The same name always produces the same color, making it easy to visually distinguish users without images. Overrides `intent`. |
43
43
  | ringColor | `string` | no | | Custom ring color (CSS value). Overrides `ringIntent` when set. |
44
- | slotClasses | `Partial<Record<'base' | 'image' | 'fallback' | 'status', string>>` | no | | Per-slot class overrides merged with tv styles. |
44
+ | slotClasses | `Partial<Record<AvatarSlots, string>>` | no | | Per-slot class overrides merged with tv styles. Slots: base | image | fallback | status |
45
45
  | src | `string` | no | | Image URL. Falls back to initials or `children` when empty or on load error. |
46
46
  | unstyled | `boolean` | no | | Remove all default tv classes. |
47
47
  | intent | `'danger' | 'neutral' | 'primary' | 'secondary' | 'success' | 'warning'` | no | neutral | Controls the color theme and semantic meaning of the Avatar. Affects the overall appearance and user perception. Available options: danger, neutral, primary, and 3 more. |
@@ -56,6 +56,3 @@ User profile image component with fallback initials, multiple sizes, and interac
56
56
  Inherited from:
57
57
  - AvatarVariants (external)
58
58
  - Omit<HTMLAttributes<HTMLDivElement>, 'children'> (omit-pattern)
59
-
60
- ### Slots (slotClasses keys)
61
- `base`, `image`, `fallback`, `status`
@@ -49,12 +49,9 @@ Compact label for status, categories, counters, and notifications.
49
49
  | pulse | `boolean` | no | | Add a pulsing animation to draw attention (e.g. for live indicators). |
50
50
  | removable | `boolean` | no | | Show a remove (×) button. |
51
51
  | role | `'status' | 'alert' | 'badge'` | no | | ARIA role. Defaults to `"status"`. Use `"alert"` for time-sensitive notifications. |
52
- | slotClasses | `Partial<Record<'base' | 'content' | 'removeButton' | 'removeIcon', string>>` | no | | Per-slot class overrides merged with tv styles. |
52
+ | slotClasses | `Partial<Record<BadgeSlots, string>>` | no | | Per-slot class overrides merged with tv styles. |
53
53
  | unstyled | `boolean` | no | | Remove all default tv classes. |
54
54
  | variant | `'dot' | 'filled' | 'outlined' | 'soft'` | no | 'filled' | Visual variant. `dot` renders a pure indicator (content hidden); the label variants accept the full surface. |
55
55
  | intent | `'danger' | 'neutral' | 'primary' | 'secondary' | 'success' | 'warning'` | no | primary | Controls the color theme and semantic meaning of the Badge. Affects the overall appearance and user perception. Available options: danger, neutral, primary, and 3 more. |
56
56
  | size | `'lg' | 'md' | 'sm' | 'xs'` | no | md | Controls the dimensions, padding, and text size of the Badge. Affects the component's physical footprint. Available options: lg, md, sm, xs. |
57
57
  | tier | `'commit' | 'modify'` | no | commit | Controls the tier behavior and appearance of the Badge component. Available options: commit, modify. |
58
-
59
- ### Slots (slotClasses keys)
60
- `base`, `content`, `removeButton`, `removeIcon`
@@ -36,12 +36,9 @@ Renders an accessible nav with structured items and customizable separators.
36
36
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Breadcrumb: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
37
37
  | separator | `Snippet` | no | | Custom separator snippet (default: "/") |
38
38
  | size | `'sm' | 'md' | 'lg'` | no | 'md' | Size variant that controls dimensions and spacing of the Breadcrumb |
39
- | slotClasses | `Partial<Record<'nav' | 'list' | 'item' | 'link' | 'currentPage' | 'separator', string>>` | no | | Per-slot class overrides |
39
+ | slotClasses | `Partial<Record<BreadcrumbSlots, string>>` | no | | Per-slot class overrides |
40
40
  | unstyled | `boolean` | no | | Remove default styles |
41
41
 
42
42
  Inherited from:
43
43
  - BreadcrumbVariants (external)
44
44
  - Omit<HTMLAttributes<HTMLElement>, 'children'> (omit-pattern)
45
-
46
- ### Slots (slotClasses keys)
47
- `nav`, `list`, `item`, `link`, `currentPage`, `separator`
@@ -63,7 +63,7 @@ slotClasses: {
63
63
  | onclick | `(event: MouseEvent) => void` | no | | Onclick property for the Button component |
64
64
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Button: {...} }}>`. Prefer this over `class="bg-…!"` overrides when the requested look is outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
65
65
  | pressed | `boolean` | no | false | Whether the button is pressed (for toggle buttons) |
66
- | slotClasses | `Partial<Record<'base' | 'content' | 'spinner', string>>` | no | | Per-slot class overrides merged with tv styles: base | content | spinner |
66
+ | slotClasses | `Partial<Record<ButtonSlots, string>>` | no | | Per-slot class overrides merged with tv styles. Slots: base | content | spinner |
67
67
  | unstyled | `boolean` | no | | Remove default tailwind-variants classes. Only user classes apply. |
68
68
  | value | `string` | no | | The value associated with the button (useful in ButtonGroups) |
69
69
  | intent | `'danger' | 'neutral' | 'primary' | 'secondary' | 'success' | 'warning'` | no | neutral | Controls the color theme and semantic meaning of the Button. Affects the overall appearance and user perception. Available options: danger, neutral, primary, and 3 more. |
@@ -75,6 +75,3 @@ slotClasses: {
75
75
  Inherited from:
76
76
  - ButtonVariants (external)
77
77
  - Omit<HTMLButtonAttributes, 'children'> (omit-pattern)
78
-
79
- ### Slots (slotClasses keys)
80
- `base`, `content`, `spinner`
@@ -52,7 +52,7 @@ Supports single-select (radio), multi-select (checkbox), or no selection.
52
52
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ ButtonGroup: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
53
53
  | selection | `ButtonGroupSelection` | no | | Selection mode. `"single"` = radio-group, `"multiple"` = checkbox-group, `"none"` = no selection. |
54
54
  | size | `ComponentSize` | no | | Size propagated to child Buttons (unless a Button sets its own). |
55
- | slotClasses | `Partial<Record<'base', string>>` | no | | Per-slot class overrides. |
55
+ | slotClasses | `Partial<Record<ButtonGroupSlots, string>>` | no | | Per-slot class overrides. Slots: base |
56
56
  | tier | `InteractiveTier` | no | | Semantic radius tier propagated to child Buttons. `commit` (default) → pill caps for the group; `modify` → soft caps. Inherits from a wrapping Toolbar via TierContext when not set explicitly. |
57
57
  | unstyled | `boolean` | no | | Remove all default tv classes. |
58
58
  | value | `ButtonGroupValue` | no | | Current selection value. Bind with `bind:value` for two-way sync. String for single, string[] for multiple. |
@@ -60,6 +60,3 @@ Supports single-select (radio), multi-select (checkbox), or no selection.
60
60
 
61
61
  Inherited from:
62
62
  - Omit<HTMLAttributes<HTMLDivElement>, 'children'> (omit-pattern)
63
-
64
- ### Slots (slotClasses keys)
65
- `base`
@@ -53,7 +53,7 @@ and interactive states. Renders as div, button, or anchor depending on the provi
53
53
  | onclick | `(event: MouseEvent) => void` | no | | Click handler. When provided, the card renders as `<button>` and gains interactive styles. |
54
54
  | onHover | `(hovered: boolean) => void` | no | | Called when hover state changes. Receives `true` on mouse-enter, `false` on mouse-leave. |
55
55
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Card: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
56
- | slotClasses | `Partial<Record<'base' | 'header' | 'content' | 'footer', string>>` | no | | Per-slot class overrides. |
56
+ | slotClasses | `Partial<Record<CardSlots, string>>` | no | | Per-slot class overrides. Slots: base | header | content | footer |
57
57
  | unstyled | `boolean` | no | | Remove all default tv classes. |
58
58
  | variant | `'elevated' | 'floating' | 'outlined' | 'quiet'` | no | quiet | Controls the visual style and presentation of the Card. Determines the component's visual treatment. Available options: elevated, floating, outlined, quiet. |
59
59
  | disabled | `'true'` | no | false | Controls the disabled behavior and appearance of the Card component. Available options: true. |
@@ -63,6 +63,3 @@ and interactive states. Renders as div, button, or anchor depending on the provi
63
63
  Inherited from:
64
64
  - Omit<CardVariants, 'elementType' | 'interactive'> (omit-pattern)
65
65
  - Omit<HTMLAttributes<HTMLElement>, 'children'> (omit-pattern)
66
-
67
- ### Slots (slotClasses keys)
68
- `base`, `header`, `content`, `footer`
@@ -45,7 +45,7 @@ Uses a hidden native input for correct form behavior and ARIA semantics.
45
45
  | onCheckedChange | `(checked: boolean) => void` | no | | Fired after the checked state changes. Receives the new `checked` value. |
46
46
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Checkbox: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
47
47
  | required | `boolean` | no | | Mark the native input as required for form validation. |
48
- | slotClasses | `Partial<Record<'wrapper' | 'control' | 'box' | 'icon' | 'label' | 'message', string>>` | no | | Per-slot class overrides merged with (or replacing, when `unstyled`) the default styles. |
48
+ | slotClasses | `Partial<Record<CheckboxSlots, string>>` | no | | Per-slot class overrides merged with (or replacing, when `unstyled`) the default styles. Slots: wrapper (root — what `class` also targets) | control | box | icon | label | message. |
49
49
  | tier | `InteractiveTier` | no | | Semantic radius tier. Default `modify` — checkbox is an input-tap surface. Inherited from TierContext when omitted; falls back to `modify` outside of any tier-aware container. |
50
50
  | unstyled | `boolean` | no | | Strip all default tailwind-variants classes. Use with `slotClasses` for a fully custom look. The box exposes `data-state` for conditional styling. |
51
51
  | value | `string` | no | | The value submitted when checked. Defaults to `'on'`. |
@@ -56,6 +56,3 @@ Uses a hidden native input for correct form behavior and ARIA semantics.
56
56
  Inherited from:
57
57
  - Omit<CheckboxVariants, 'error' | 'checked' | 'indeterminate'> (omit-pattern)
58
58
  - Omit<HTMLInputAttributes, 'type' | 'size' | 'checked' | 'class' | 'children'> (omit-pattern)
59
-
60
- ### Slots (slotClasses keys)
61
- `wrapper`, `control`, `box`, `icon`, `label`, `message`
@@ -43,7 +43,7 @@ components like Accordion.
43
43
  | onOpenChange | `(open: boolean) => void` | no | | Callback fired when open state changes |
44
44
  | open | `boolean` | no | | Whether the content is visible. Supports bind:open. |
45
45
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Collapsible: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
46
- | slotClasses | `Partial<Record<'base' | 'trigger' | 'chevron' | 'content' | 'contentInner', string>>` | no | | Per-slot class overrides |
46
+ | slotClasses | `Partial<Record<CollapsibleSlots, string>>` | no | | Per-slot class overrides. Slots: base | trigger | chevron | content | contentInner |
47
47
  | title | `string` | no | | Trigger label text (used by the default trigger) |
48
48
  | trigger | `Snippet<[
49
49
  {
@@ -61,6 +61,3 @@ components like Accordion.
61
61
  Inherited from:
62
62
  - CollapsibleVariants (external)
63
63
  - Omit<HTMLAttributes<HTMLDivElement>, 'children'> (omit-pattern)
64
-
65
- ### Slots (slotClasses keys)
66
- `base`, `trigger`, `chevron`, `content`, `contentInner`
@@ -72,7 +72,7 @@ bind:value={tenantId}
72
72
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Combobox: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
73
73
  | query | `string` | no | | Current search query text. Supports `bind:query` for external control (e.g. server-side filtering). |
74
74
  | required | `boolean` | no | false | Marks the field as required. Adds the asterisk on the label. |
75
- | slotClasses | `Partial<Record<'base' | 'label' | 'requiredMark' | 'inputWrapper' | 'input' | 'message' | 'hint' | 'listbox' | 'option' | 'optionActive' | 'optionSelected' | 'noResults' | 'clear' | 'chevron', string>>` | no | | Per-slot class overrides merged with tv() styles. |
75
+ | slotClasses | `Partial<Record<ComboboxSlots, string>>` | no | | Per-slot class overrides merged with tv() styles. Slots: base | label | requiredMark | inputWrapper | input | message | hint | listbox | option | optionActive | optionSelected | noResults | clear | chevron |
76
76
  | unstyled | `boolean` | no | false | Remove all default tv() classes — only user-provided classes apply. |
77
77
  | value | `T | null` | no | | Currently selected value. Supports `bind:value` for two-way binding. |
78
78
  | size | `'lg' | 'md' | 'sm'` | no | md | Controls the dimensions, padding, and text size of the Combobox. Affects the component's physical footprint. Available options: lg, md, sm. |
@@ -81,6 +81,3 @@ bind:value={tenantId}
81
81
  Inherited from:
82
82
  - ComboboxVariants (external)
83
83
  - Omit<HTMLAttributes<HTMLDivElement>, 'children'> (omit-pattern)
84
-
85
- ### Slots (slotClasses keys)
86
- `base`, `label`, `requiredMark`, `inputWrapper`, `input`, `message`, `hint`, `listbox`, `option`, `optionActive`, `optionSelected`, `noResults`, `clear`, `chevron`
@@ -46,7 +46,7 @@ content-agnostic overlay or as a structured dialog with title, footer, and inten
46
46
  | placement | `DialogVariants['placement']` | no | 'center' | Vertical placement within the viewport. Use 'top' for command-palette style positioning. |
47
47
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Dialog: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
48
48
  | size | `DialogVariants['size']` | no | 'sm' | Controls the maximum width of the dialog panel. |
49
- | slotClasses | `Partial<Record<'dialog' | 'backdrop' | 'panel' | 'content' | 'header' | 'title' | 'body' | 'footer', string>>` | no | | Per-slot class overrides merged with variant styles. |
49
+ | slotClasses | `Partial<Record<DialogSlots, string>>` | no | | Per-slot class overrides merged with variant styles. |
50
50
  | title | `string` | no | | Heading displayed in a header bar. Enables the structured header/body/footer layout. |
51
51
  | transitionDuration | `number` | no | | Override the enter/exit animation duration in milliseconds. Defaults to the overlay token `--blocks-overlay-enter-duration` / `--blocks-overlay-exit-duration` (200ms / 180ms). Set globally via the CSS custom properties or per-instance via this prop. Respects `prefers-reduced-motion`. |
52
52
  | transitionEasing | `(t: number) => number` | no | | Override the enter/exit easing function. Defaults to the overlay token easing (`quintOut`). |
@@ -54,6 +54,3 @@ content-agnostic overlay or as a structured dialog with title, footer, and inten
54
54
 
55
55
  Inherited from:
56
56
  - Omit<HTMLDialogAttributes, 'children' | 'open'> (omit-pattern)
57
-
58
- ### Slots (slotClasses keys)
59
- `dialog`, `backdrop`, `panel`, `content`, `header`, `title`, `body`, `footer`
@@ -41,7 +41,7 @@ Uses native dialog with focus trap, backdrop click dismiss, and Escape key suppo
41
41
  | placement | `DrawerVariants['placement']` | no | 'right' | Edge of the viewport from which the drawer slides in. |
42
42
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Drawer: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
43
43
  | size | `DrawerVariants['size']` | no | 'md' | Width (for left/right) or height (for top/bottom) of the drawer panel. |
44
- | slotClasses | `Partial<Record<'dialog' | 'backdrop' | 'panel' | 'header' | 'title' | 'body' | 'footer', string>>` | no | | Per-slot class overrides merged with variant styles. |
44
+ | slotClasses | `Partial<Record<DrawerSlots, string>>` | no | | Per-slot class overrides merged with variant styles. |
45
45
  | title | `string` | no | | Heading displayed in the drawer header. |
46
46
  | transitionDuration | `number` | no | | Override the enter/exit animation duration in milliseconds. Defaults to the overlay token `--blocks-overlay-enter-duration` / `--blocks-overlay-exit-duration` (200ms / 180ms). Respects `prefers-reduced-motion`. |
47
47
  | transitionEasing | `(t: number) => number` | no | | Override the enter/exit easing function. Defaults to the overlay token easing (`quintOut`). |
@@ -49,6 +49,3 @@ Uses native dialog with focus trap, backdrop click dismiss, and Escape key suppo
49
49
 
50
50
  Inherited from:
51
51
  - Omit<HTMLDialogAttributes, 'children' | 'open'> (omit-pattern)
52
-
53
- ### Slots (slotClasses keys)
54
- `dialog`, `backdrop`, `panel`, `header`, `title`, `body`, `footer`
@@ -54,7 +54,7 @@ Supports outlined, filled, and ghost visual variants with automatic ARIA linking
54
54
  | required | `boolean` | no | false | Adds a required asterisk to the label and sets the native `required` attribute. |
55
55
  | rightIcon | `Snippet` | no | | Icon snippet rendered on the right side of the input field. |
56
56
  | rightIconAriaLabel | `string` | no | | Accessible label for the clickable right icon button. Required when `onRightIconClick` is set so screen-reader users hear a name for the button (icons inside are `aria-hidden`). |
57
- | slotClasses | `Partial<Record<'wrapper' | 'container' | 'base' | 'label' | 'message' | 'iconContainer', string>>` | no | | Per-slot class overrides merged with tv() styles. |
57
+ | slotClasses | `Partial<Record<InputSlots, string>>` | no | | Per-slot class overrides merged with tv() styles. Slots: wrapper (root — what `class` also targets) | container | base (the `<input>` element) | label | message | iconContainer | iconButton | iconDecoration. |
58
58
  | unstyled | `boolean` | no | | Remove all default tv() classes — only user-provided classes apply. |
59
59
  | intent | `'danger' | 'default' | 'success' | 'warning'` | no | default | Controls the color theme and semantic meaning of the Input. Affects the overall appearance and user perception. Available options: danger, default, success, warning. |
60
60
  | variant | `'filled' | 'ghost' | 'outlined' | 'underline'` | no | outlined | Controls the visual style and presentation of the Input. Determines the component's visual treatment. Available options: filled, ghost, outlined, underline. |
@@ -68,6 +68,3 @@ Supports outlined, filled, and ghost visual variants with automatic ARIA linking
68
68
  Inherited from:
69
69
  - Omit<InputVariants, 'error'> (omit-pattern)
70
70
  - Omit<HTMLInputAttributes, 'size' | 'class' | 'disabled' | 'readonly' | 'children'> (omit-pattern)
71
-
72
- ### Slots (slotClasses keys)
73
- `wrapper`, `container`, `base`, `label`, `message`, `iconContainer`
@@ -51,7 +51,7 @@ Supports multiple layouts, intents, button variants, and configurable ellipsis b
51
51
  | showNumbers | `boolean` | no | | Show numbered page buttons. Set to false for a compact prev/next-only bar. |
52
52
  | showPreviousNext | `boolean` | no | | Show "Previous" / "Next" navigation buttons. |
53
53
  | size | `'sm' | 'md' | 'lg'` | no | | Button dimensions. Affects page numbers, prev/next, and first/last. |
54
- | slotClasses | `Partial<Record<'base' | 'info' | 'controls' | 'ellipsis', string>>` | no | | Per-slot class overrides merged with (or replacing, when unstyled) tv styles. Slots: base, info, controls, ellipsis. |
54
+ | slotClasses | `Partial<Record<PaginationSlots, string>>` | no | | Per-slot class overrides merged with (or replacing, when unstyled) tv styles. Slots: base, info, controls, ellipsis. |
55
55
  | startItem | `number` | no | | Override the calculated start item number for the info text. |
56
56
  | tier | `InteractiveTier` | no | | Semantic radius tier forwarded to pagination buttons. |
57
57
  | totalItems | `number` | no | | Total number of items across all pages. Used by the table layout info text. |
@@ -63,6 +63,3 @@ Supports multiple layouts, intents, button variants, and configurable ellipsis b
63
63
  Inherited from:
64
64
  - Omit<PaginationVariants, 'disabled' | 'loading'> (omit-pattern)
65
65
  - Omit<HTMLAttributes<HTMLElement>, 'class'> (omit-pattern)
66
-
67
- ### Slots (slotClasses keys)
68
- `base`, `info`, `controls`, `ellipsis`
@@ -38,7 +38,7 @@ Supports linear bar and circular ring variants with semantic intents and animati
38
38
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Progress: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
39
39
  | shape | `'linear' | 'circular'` | no | 'linear' | Shape of the progress indicator. |
40
40
  | showValue | `boolean` | no | false | Show the numeric value (percentage or absolute) next to the label. |
41
- | slotClasses | `Partial<Record<'wrapper' | 'header' | 'label' | 'valueText' | 'track' | 'fill' | 'circularWrapper' | 'circularTrack' | 'circularFill' | 'circularLabel', string>>` | no | | Per-slot class overrides merged with tv() styles. |
41
+ | slotClasses | `Partial<Record<ProgressSlots, string>>` | no | | Per-slot class overrides merged with tv() styles. Slots: wrapper (linear root — what `class` targets in linear shape) | header | label | valueText | track | fill | circularWrapper (circular root what `class` targets in circular shape) | circularTrack | circularFill | circularLabel. |
42
42
  | striped | `boolean` | no | false | Display striped pattern on the fill. |
43
43
  | strokeWidth | `number` | no | 6 | Stroke width of the circular indicator in pixels. |
44
44
  | unstyled | `boolean` | no | | Remove all default tv() classes. |
@@ -50,6 +50,3 @@ Supports linear bar and circular ring variants with semantic intents and animati
50
50
  Inherited from:
51
51
  - ProgressVariants (external)
52
52
  - Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'class'> (omit-pattern)
53
-
54
- ### Slots (slotClasses keys)
55
- `wrapper`, `header`, `label`, `valueText`, `track`, `fill`, `circularWrapper`, `circularTrack`, `circularFill`, `circularLabel`
@@ -40,7 +40,7 @@ Uses native radio inputs for correct form behavior and ARIA semantics with keybo
40
40
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ RadioGroup: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
41
41
  | required | `boolean` | no | | Mark the group as required for form validation. Adds an asterisk to the label. |
42
42
  | size | `RadioItemVariants['size']` | no | 'md' | Visual size propagated to all child RadioItems. |
43
- | slotClasses | `Partial<Record<'root' | 'group' | 'label' | 'message', string>>` | no | | Per-slot class overrides merged with tv() styles. |
43
+ | slotClasses | `Partial<Record<RadioGroupSlots, string>>` | no | | Per-slot class overrides merged with tv() styles. |
44
44
  | tier | `InteractiveTier` | no | 'commit' | Semantic radius tier propagated to every RadioItem. Default `commit` — radio indicators read as identity circles. Set to `modify` (or inherit via TierContext from a wrapping `<Toolbar tier="modify">`) for inline-toolbar contexts where a circle feels oversized. |
45
45
  | unstyled | `boolean` | no | | Remove all default tv() classes. Only user-provided classes apply. |
46
46
  | value | `string` | no | | Currently selected value. Supports two-way binding via `bind:value`. |
@@ -48,6 +48,3 @@ Uses native radio inputs for correct form behavior and ARIA semantics with keybo
48
48
 
49
49
  Inherited from:
50
50
  - Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'class'> (omit-pattern)
51
-
52
- ### Slots (slotClasses keys)
53
- `root`, `group`, `label`, `message`
@@ -35,7 +35,7 @@ Compact mode/view switcher with smooth animation.
35
35
  | mint | `MintProp` | no | 'none' | Micro-interaction effect applied to each segment item (per-item, not the container). Accepts a preset name, an array of names, or configured mint objects. |
36
36
  | onValueChange | `(value: string) => void` | no | | Fires after the selected value changes. Receives the new value. |
37
37
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ SegmentGroup: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
38
- | slotClasses | `Partial<Record<'base' | 'indicator' | 'item', string>>` | no | | Per-slot class overrides merged with tv() styles. |
38
+ | slotClasses | `Partial<Record<SegmentGroupSlots, string>>` | no | | Per-slot class overrides merged with tv() styles. |
39
39
  | unstyled | `boolean` | no | | Remove all default tv() classes. |
40
40
  | value | `string` | no | | Currently selected value. Supports `bind:value` for two-way binding. |
41
41
  | size | `'lg' | 'md' | 'sm'` | no | md | Controls the dimensions, padding, and text size of the SegmentGroup. Affects the component's physical footprint. Available options: lg, md, sm. |
@@ -46,6 +46,3 @@ Compact mode/view switcher with smooth animation.
46
46
  Inherited from:
47
47
  - SegmentGroupVariants (external)
48
48
  - Omit<HTMLAttributes<HTMLDivElement>, 'children'> (omit-pattern)
49
-
50
- ### Slots (slotClasses keys)
51
- `base`, `indicator`, `item`
@@ -115,7 +115,7 @@ binds to `T[]`, `<Select bind:value>` binds to `T | null`. See
115
115
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Select: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
116
116
  | required | `boolean` | no | false | Adds a required asterisk to the label. |
117
117
  | selectionIndicator | `'checkmark' | 'none'` | no | | Selection indicator rendered next to each option. - `'checkmark'` — trailing check icon (default) - `'none'` — no indicator (typical when using `customItem`) |
118
- | slotClasses | `Partial<Record<'wrapper' | 'base' | 'trigger' | 'triggerText' | 'placeholder' | 'chevron' | 'clear' | 'listbox' | 'option' | 'optionCheck' | 'optionCheckbox' | 'group' | 'groupLabel' | 'label' | 'message', string>>` | no | | Per-slot class overrides merged with tv() styles. |
118
+ | slotClasses | `Partial<Record<SelectSlots, string>>` | no | | Per-slot class overrides merged with tv() styles. Slots: wrapper (root — what `class` also targets) | base | trigger | triggerText | placeholder | chevron | clear | listbox | option | optionLabel | optionCheck | optionCheckbox | group | groupLabel | label | message. |
119
119
  | syncWidth | `boolean` | no | true | Whether the listbox matches the trigger's width. Set `false` for icon-only or compact triggers where the listbox should size to its content instead. |
120
120
  | unstyled | `boolean` | no | | Remove all default tv() classes. |
121
121
  | usePortal | `boolean` | no | true | When true, the listbox is rendered into the browser top layer via the native `popover` API, so it cannot be clipped by `overflow: auto` ancestors. When false, the listbox stays in the regular DOM flow — useful inside other popovers/portals to avoid double-portaling. |
@@ -125,6 +125,3 @@ binds to `T[]`, `<Select bind:value>` binds to `T | null`. See
125
125
  | messageType | `'error' | 'helper'` | no | helper | Controls the messageType behavior and appearance of the Select component. Available options: error, helper. |
126
126
  | selected | `'true'` | no | false | Controls the selected behavior and appearance of the Select component. Available options: true. |
127
127
  | tier | `'commit' | 'modify'` | no | modify | Controls the tier behavior and appearance of the Select component. Available options: commit, modify. |
128
-
129
- ### Slots (slotClasses keys)
130
- `wrapper`, `base`, `trigger`, `triggerText`, `placeholder`, `chevron`, `clear`, `listbox`, `option`, `optionCheck`, `optionCheckbox`, `group`, `groupLabel`, `label`, `message`
@@ -68,12 +68,9 @@ let detailOpen = $state(false);
68
68
  | open | `boolean` | no | | Controls sidebar visibility. In `responsive` mode (default) this only affects the mobile overlay — on desktop the sidebar is always visible. In `collapsible` mode this controls visibility at all viewports. Supports bind:open. |
69
69
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Sidebar: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
70
70
  | side | `SidebarVariants['side']` | no | 'left' | Which edge the sidebar attaches to. |
71
- | slotClasses | `Partial<Record<'backdrop' | 'panel' | 'header' | 'content' | 'footer', string>>` | no | | Per-slot class overrides merged with variant styles. |
71
+ | slotClasses | `Partial<Record<SidebarSlots, string>>` | no | | Per-slot class overrides merged with variant styles. |
72
72
  | unstyled | `boolean` | no | | Strip all default styles. Combine with slotClasses for custom appearance. |
73
73
  | width | `string` | no | '16rem' | CSS width of the sidebar panel. Also exposed as `--sidebar-width` (constant) and `--sidebar-effective-width` (0px when collapsed) CSS variables on the `<aside>`. These inherit only inside the sidebar's own subtree — for the main content offset use `<SidebarLayout>`. |
74
74
 
75
75
  Inherited from:
76
76
  - Omit<HTMLAttributes<HTMLElement>, 'children'> (omit-pattern)
77
-
78
- ### Slots (slotClasses keys)
79
- `backdrop`, `panel`, `header`, `content`, `footer`
@@ -41,7 +41,7 @@ Use to reduce perceived loading time and prevent layout shift.
41
41
  | height | `string` | no | | Custom height (CSS value, e.g. `"48px"`). Overrides the size preset height. |
42
42
  | preset | `string` | no | | Apply a named preset registered via `<BlocksProvider presets={{ Skeleton: {...} }}>`. Prefer this over `class` overrides when the requested look falls outside the semantic intent palette — presets keep hover/active/dark-mode logic coherent and make the custom look reusable across the project. |
43
43
  | size | `SkeletonVariants['size']` | no | | Physical dimensions following the Standard size scale (xs–xl). Dimensions vary per variant — text heights range from h-3 (xs) to h-6 (xl), circular from 24 px to 64 px. |
44
- | slotClasses | `Partial<Record<'base' | 'wrapper', string>>` | no | | Per-slot class overrides merged with (or replacing, when `unstyled`) tv() output. |
44
+ | slotClasses | `Partial<Record<SkeletonSlots, string>>` | no | | Per-slot class overrides merged with (or replacing, when `unstyled`) tv() output. Slots: base | wrapper |
45
45
  | unstyled | `boolean` | no | | Strip all default tv() classes. Combine with `slotClasses` for full control. |
46
46
  | variant | `SkeletonVariants['variant']` | no | | Shape preset. `text` is a slim bar, `circular` for avatars/icons, `rectangular` for images/cards, `rounded` like rectangular with softer corners. |
47
47
  | width | `string` | no | | Custom width (CSS value, e.g. `"200px"` or `"100%"`). Overrides the size preset width. |
@@ -49,6 +49,3 @@ Use to reduce perceived loading time and prevent layout shift.
49
49
  Inherited from:
50
50
  - SkeletonVariants (external)
51
51
  - HTMLAttributes (html-attributes)
52
-
53
- ### Slots (slotClasses keys)
54
- `base`, `wrapper`