@7onic-ui/react 0.2.1 → 0.2.3
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.
- package/README.md +20 -9
- package/dist/index.d.mts +190 -1
- package/dist/index.d.ts +190 -1
- package/dist/index.js +905 -10
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +888 -10
- package/dist/index.mjs.map +1 -1
- package/llms.txt +277 -11
- package/package.json +2 -3
package/README.md
CHANGED
|
@@ -24,7 +24,8 @@
|
|
|
24
24
|
|:---:|---|---|
|
|
25
25
|
| **🎯** | **Zero design-code drift** | Design and code from a single vision. No handoff, no drift — every component is pixel-verified against Figma. |
|
|
26
26
|
| **📦** | **One JSON, every format** | `figma-tokens.json` auto-generates CSS, Tailwind v3, Tailwind v4, JS/TS, and JSON — all in sync. |
|
|
27
|
-
| **🧩** | **shadcn freedom + MUI convenience** |
|
|
27
|
+
| **🧩** | **shadcn freedom + MUI convenience** | shadcn's customization with none of its missing features. MUI's built-in power with none of its styling constraints. Both, by design. |
|
|
28
|
+
| **⚡** | **npm or CLI — your choice** | `npm install` for packages, `npx 7onic add` for local copy. Same components, two workflows. |
|
|
28
29
|
| **🔀** | **Only Tailwind v3+v4 dual support** | The ecosystem's only design system supporting both Tailwind versions. Same tokens, same DX. |
|
|
29
30
|
| **🎮** | **Built-in playground** | Interactive props editor + live code generation in docs. No Storybook setup needed. |
|
|
30
31
|
| **🌗** | **Dark mode, zero config** | Light/dark themes built into tokens. System preference detection out of the box. |
|
|
@@ -37,10 +38,19 @@
|
|
|
37
38
|
|
|
38
39
|
## Get Started
|
|
39
40
|
|
|
41
|
+
**Option A — npm package**
|
|
42
|
+
|
|
40
43
|
```bash
|
|
41
44
|
npm install @7onic-ui/react @7onic-ui/tokens
|
|
42
45
|
```
|
|
43
46
|
|
|
47
|
+
**Option B — CLI (local file copy)**
|
|
48
|
+
|
|
49
|
+
```bash
|
|
50
|
+
npx 7onic init
|
|
51
|
+
npx 7onic add button card input
|
|
52
|
+
```
|
|
53
|
+
|
|
44
54
|
<details>
|
|
45
55
|
<summary><strong>Tailwind v4</strong></summary>
|
|
46
56
|
|
|
@@ -55,10 +65,10 @@ npm install @7onic-ui/react @7onic-ui/tokens
|
|
|
55
65
|
<summary><strong>Tailwind v3</strong></summary>
|
|
56
66
|
|
|
57
67
|
```css
|
|
68
|
+
@import '@7onic-ui/tokens/css/all.css';
|
|
58
69
|
@tailwind base;
|
|
59
70
|
@tailwind components;
|
|
60
71
|
@tailwind utilities;
|
|
61
|
-
@import '@7onic-ui/tokens/css/all.css';
|
|
62
72
|
```
|
|
63
73
|
|
|
64
74
|
```js
|
|
@@ -112,15 +122,16 @@ import { Chart, type ChartConfig } from '@7onic-ui/react/chart' // charts: sepa
|
|
|
112
122
|
|
|
113
123
|
| Category | Components | Count |
|
|
114
124
|
|----------|-----------|:-----:|
|
|
115
|
-
| **Forms** | Button, IconButton, ButtonGroup, Input, Textarea, Select, Dropdown, Checkbox,
|
|
125
|
+
| **Forms** | Button, IconButton, ButtonGroup, Input, Textarea, Select, Dropdown, Checkbox, RadioGroup, Switch, Toggle, ToggleGroup, Segmented, Slider | 14 |
|
|
116
126
|
| **Data Display** | Avatar, Badge, Card, Table | 4 |
|
|
117
127
|
| **Charts** | BarChart, LineChart, AreaChart, PieChart, MetricCard | 5 |
|
|
118
128
|
| **Layout** | Tabs, Accordion, Divider | 3 |
|
|
119
129
|
| **Overlay** | Modal, Drawer, Tooltip, Popover | 4 |
|
|
120
130
|
| **Feedback** | Alert, Toast, Progress, Spinner, Skeleton | 5 |
|
|
121
131
|
| **Navigation** | Breadcrumb, NavigationMenu, Pagination | 3 |
|
|
132
|
+
| **AI** | TypingIndicator, QuickReply, ChatInput, ChatMessage | 4 |
|
|
122
133
|
|
|
123
|
-
**
|
|
134
|
+
**42 components** — all with CVA variants, controlled + uncontrolled modes, `forwardRef`, namespace exports (`Card.Header`) + named exports (`CardHeader`).
|
|
124
135
|
|
|
125
136
|
---
|
|
126
137
|
|
|
@@ -130,7 +141,7 @@ import { Chart, type ChartConfig } from '@7onic-ui/react/chart' // charts: sepa
|
|
|
130
141
|
|-------|--------|-------------|
|
|
131
142
|
| **Colors** | Semantic system | Brand, status, text, background, border |
|
|
132
143
|
| **Typography** | 11 sizes (11–72px) | CJK-optimized: `md`(14px) for UI, `base`(16px) for body |
|
|
133
|
-
| **Spacing** |
|
|
144
|
+
| **Spacing** | 19 values (0–96px) | 2px steps (0–14px), 4px steps (16px+) |
|
|
134
145
|
| **Radius** | 9 values | `none` through `full` |
|
|
135
146
|
| **Shadows** | 6 primitives | `xs` through `xl` + `primary-glow` |
|
|
136
147
|
| **Duration** | 8 values | `instant` through `spin` |
|
|
@@ -245,16 +256,16 @@ Works with Claude Code, Cursor, GitHub Copilot, ChatGPT, and any AI tool that re
|
|
|
245
256
|
- [x] Token sync script with breaking change detection
|
|
246
257
|
- [x] Tailwind v3/v4 dual preset + RGB channel opacity support
|
|
247
258
|
- [x] Light/dark theme with OS auto-detection
|
|
248
|
-
- [x]
|
|
259
|
+
- [x] 42 components with namespace compound exports
|
|
249
260
|
- [x] Documentation site with interactive playgrounds
|
|
250
261
|
- [x] Chart components included (Bar, Line, Area, Pie, MetricCard)
|
|
251
262
|
- [x] Automated doc verification (8 checks, AST-powered, blocks publish on error)
|
|
252
263
|
- [x] Automated component verification (7 checks — hardcoded colors, tokens, dark mode, dead code)
|
|
253
264
|
- [x] Multilingual documentation — English, Japanese, Korean (powered by next-intl)
|
|
254
|
-
- [x] npm package distribution — `@7onic-ui/react` + `@7onic-ui/tokens` v0.2.
|
|
265
|
+
- [x] npm package distribution — `@7onic-ui/react` + `@7onic-ui/tokens` v0.2.3
|
|
255
266
|
- [x] AI integration — `llms.txt` standard, setup guides for Claude Code / Cursor / Copilot / ChatGPT
|
|
256
|
-
- [ ] Theme Customizer (live color preview)
|
|
257
267
|
- [x] `npx 7onic add` CLI (shadcn-style) — source copy with dependency resolution
|
|
268
|
+
- [ ] Theme Customizer (live color preview)
|
|
258
269
|
- [ ] Figma UI Kit
|
|
259
270
|
- [ ] Dashboard / landing templates
|
|
260
271
|
|
|
@@ -269,5 +280,5 @@ MIT
|
|
|
269
280
|
<p align="center">
|
|
270
281
|
<strong>One JSON, every format — from Figma to production.</strong><br>
|
|
271
282
|
Independently built.<br>
|
|
272
|
-
<sub>Last updated: 2026-04-
|
|
283
|
+
<sub>Last updated: 2026-04-11</sub>
|
|
273
284
|
</p>
|
package/dist/index.d.mts
CHANGED
|
@@ -1633,4 +1633,193 @@ interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement>, VariantPro
|
|
|
1633
1633
|
}
|
|
1634
1634
|
declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;
|
|
1635
1635
|
|
|
1636
|
-
|
|
1636
|
+
declare const typingIndicatorVariants: (props?: ({
|
|
1637
|
+
size?: "default" | "sm" | "lg" | null | undefined;
|
|
1638
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1639
|
+
interface TypingIndicatorProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof typingIndicatorVariants> {
|
|
1640
|
+
/** Animation style */
|
|
1641
|
+
variant?: 'dots' | 'cursor';
|
|
1642
|
+
/** Indicator color */
|
|
1643
|
+
color?: 'default' | 'primary' | 'muted';
|
|
1644
|
+
/** Animation speed */
|
|
1645
|
+
speed?: 'slow' | 'default' | 'fast';
|
|
1646
|
+
/** Accessible label (also shown as visual text when showLabel is true) */
|
|
1647
|
+
label?: string;
|
|
1648
|
+
/** Render label text alongside the indicator */
|
|
1649
|
+
showLabel?: boolean;
|
|
1650
|
+
}
|
|
1651
|
+
declare const TypingIndicator: React.ForwardRefExoticComponent<TypingIndicatorProps & React.RefAttributes<HTMLDivElement>>;
|
|
1652
|
+
|
|
1653
|
+
declare const quickReplyRootVariants: (props?: ({
|
|
1654
|
+
layout?: "scroll" | "wrap" | null | undefined;
|
|
1655
|
+
gap?: "default" | "sm" | "lg" | null | undefined;
|
|
1656
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1657
|
+
declare const quickReplyItemVariants: (props?: ({
|
|
1658
|
+
size?: "default" | "sm" | "lg" | null | undefined;
|
|
1659
|
+
radius?: "lg" | "md" | "full" | null | undefined;
|
|
1660
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1661
|
+
type QuickReplyLayout = 'scroll' | 'wrap';
|
|
1662
|
+
type QuickReplyVariant = 'outline' | 'filled' | 'ghost';
|
|
1663
|
+
type QuickReplyColor = 'default' | 'primary';
|
|
1664
|
+
type QuickReplySize = 'sm' | 'default' | 'lg';
|
|
1665
|
+
type QuickReplyRadius = 'md' | 'lg' | 'full';
|
|
1666
|
+
type QuickReplyGap = 'sm' | 'default' | 'lg';
|
|
1667
|
+
interface QuickReplyRootProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof quickReplyRootVariants> {
|
|
1668
|
+
/** Layout mode: horizontal scroll or wrap to multiple rows */
|
|
1669
|
+
layout?: QuickReplyLayout;
|
|
1670
|
+
/** Visual style applied to all child Items */
|
|
1671
|
+
variant?: QuickReplyVariant;
|
|
1672
|
+
/** Color theme applied to all child Items */
|
|
1673
|
+
color?: QuickReplyColor;
|
|
1674
|
+
/** Chip size applied to all child Items */
|
|
1675
|
+
size?: QuickReplySize;
|
|
1676
|
+
/** Border radius applied to all child Items */
|
|
1677
|
+
radius?: QuickReplyRadius;
|
|
1678
|
+
/** Gap between Items */
|
|
1679
|
+
gap?: QuickReplyGap;
|
|
1680
|
+
}
|
|
1681
|
+
interface QuickReplyItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
1682
|
+
/** Leading icon (SVG or ReactNode) */
|
|
1683
|
+
icon?: React.ReactNode;
|
|
1684
|
+
/** Render as child element (Slot pattern) */
|
|
1685
|
+
asChild?: boolean;
|
|
1686
|
+
}
|
|
1687
|
+
declare const QuickReplyRoot: React.ForwardRefExoticComponent<QuickReplyRootProps & React.RefAttributes<HTMLDivElement>>;
|
|
1688
|
+
declare const QuickReplyItem: React.ForwardRefExoticComponent<QuickReplyItemProps & React.RefAttributes<HTMLButtonElement>>;
|
|
1689
|
+
declare const QuickReply: React.ForwardRefExoticComponent<QuickReplyRootProps & React.RefAttributes<HTMLDivElement>> & {
|
|
1690
|
+
Item: React.ForwardRefExoticComponent<QuickReplyItemProps & React.RefAttributes<HTMLButtonElement>>;
|
|
1691
|
+
};
|
|
1692
|
+
declare namespace QuickReply {
|
|
1693
|
+
type RootProps = QuickReplyRootProps;
|
|
1694
|
+
type ItemProps = QuickReplyItemProps;
|
|
1695
|
+
}
|
|
1696
|
+
|
|
1697
|
+
declare const chatInputVariants: (props?: ({
|
|
1698
|
+
variant?: "outline" | "filled" | null | undefined;
|
|
1699
|
+
radius?: "sm" | "lg" | "md" | "xl" | "2xl" | "full" | null | undefined;
|
|
1700
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1701
|
+
type ChatInputSize = 'sm' | 'default' | 'lg';
|
|
1702
|
+
type ChatInputVariant = 'outline' | 'filled';
|
|
1703
|
+
type ChatInputRadius = 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full';
|
|
1704
|
+
type ChatInputColor = 'default' | 'primary';
|
|
1705
|
+
type ChatInputLayout = 'default' | 'inline';
|
|
1706
|
+
interface ChatInputRootProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSubmit'>, VariantProps<typeof chatInputVariants> {
|
|
1707
|
+
/** Visual style of the container */
|
|
1708
|
+
variant?: ChatInputVariant;
|
|
1709
|
+
/** Corner radius */
|
|
1710
|
+
radius?: ChatInputRadius;
|
|
1711
|
+
/** Size scale */
|
|
1712
|
+
size?: ChatInputSize;
|
|
1713
|
+
/** Submit button color — default (dark) or primary (brand) */
|
|
1714
|
+
color?: ChatInputColor;
|
|
1715
|
+
/** Layout direction — default (stacked) or inline (field + button side by side) */
|
|
1716
|
+
layout?: ChatInputLayout;
|
|
1717
|
+
/** Disable all interaction */
|
|
1718
|
+
disabled?: boolean;
|
|
1719
|
+
/** Called when the user submits (Enter key or Submit button) — receives current field value */
|
|
1720
|
+
onSubmit?: (value: string) => void;
|
|
1721
|
+
}
|
|
1722
|
+
interface ChatInputFieldProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'children'> {
|
|
1723
|
+
/** Maximum visible rows before the field scrolls */
|
|
1724
|
+
maxRows?: number;
|
|
1725
|
+
/** Show character counter — requires maxLength to be set */
|
|
1726
|
+
showCount?: boolean;
|
|
1727
|
+
}
|
|
1728
|
+
interface ChatInputSubmitProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
1729
|
+
/** Show loading/stop state — keeps button enabled so user can stop generation */
|
|
1730
|
+
loading?: boolean;
|
|
1731
|
+
/** Called when clicked during loading state (e.g., stop generation) */
|
|
1732
|
+
onStop?: () => void;
|
|
1733
|
+
/** Override the auto-calculated button radius */
|
|
1734
|
+
buttonRadius?: ChatInputRadius;
|
|
1735
|
+
}
|
|
1736
|
+
declare const ChatInputRoot: React.ForwardRefExoticComponent<ChatInputRootProps & React.RefAttributes<HTMLDivElement>>;
|
|
1737
|
+
declare const ChatInputField: React.ForwardRefExoticComponent<ChatInputFieldProps & React.RefAttributes<HTMLTextAreaElement>>;
|
|
1738
|
+
declare const ChatInputSubmit: React.ForwardRefExoticComponent<ChatInputSubmitProps & React.RefAttributes<HTMLButtonElement>>;
|
|
1739
|
+
declare const ChatInput: React.ForwardRefExoticComponent<ChatInputRootProps & React.RefAttributes<HTMLDivElement>> & {
|
|
1740
|
+
Field: React.ForwardRefExoticComponent<ChatInputFieldProps & React.RefAttributes<HTMLTextAreaElement>>;
|
|
1741
|
+
Submit: React.ForwardRefExoticComponent<ChatInputSubmitProps & React.RefAttributes<HTMLButtonElement>>;
|
|
1742
|
+
};
|
|
1743
|
+
declare namespace ChatInput {
|
|
1744
|
+
type RootProps = ChatInputRootProps;
|
|
1745
|
+
type FieldProps = ChatInputFieldProps;
|
|
1746
|
+
type SubmitProps = ChatInputSubmitProps;
|
|
1747
|
+
type Layout = ChatInputLayout;
|
|
1748
|
+
}
|
|
1749
|
+
|
|
1750
|
+
type ChatMessageRole = 'user' | 'assistant';
|
|
1751
|
+
type ChatMessageVariant = 'bubble' | 'flat';
|
|
1752
|
+
type ChatMessageColor = 'default' | 'muted' | 'primary' | 'dark';
|
|
1753
|
+
type ChatMessageSize = 'sm' | 'default' | 'lg';
|
|
1754
|
+
type ChatMessageRadius = 'md' | 'lg' | 'xl' | '2xl';
|
|
1755
|
+
type ChatMessageAvatarSize = 'sm' | 'md' | 'lg';
|
|
1756
|
+
/** Built-in status presets (pass as string to Footer.status for auto-rendering) */
|
|
1757
|
+
type ChatMessageStatus = 'sending' | 'sent' | 'read' | 'error';
|
|
1758
|
+
interface ChatMessageRootProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
1759
|
+
/** Sender role — controls alignment (left=assistant, right=user) */
|
|
1760
|
+
role?: ChatMessageRole;
|
|
1761
|
+
/** Bubble visual style */
|
|
1762
|
+
variant?: ChatMessageVariant;
|
|
1763
|
+
/** Bubble background color */
|
|
1764
|
+
color?: ChatMessageColor;
|
|
1765
|
+
/** Size scale — affects text and padding */
|
|
1766
|
+
size?: ChatMessageSize;
|
|
1767
|
+
/** Bubble corner radius */
|
|
1768
|
+
radius?: ChatMessageRadius;
|
|
1769
|
+
/** Asymmetric tail corner (radius=0 on the avatar side) */
|
|
1770
|
+
tail?: boolean;
|
|
1771
|
+
/** Show typing indicator inside Content. Pass true for defaults, or TypingIndicatorProps for custom. */
|
|
1772
|
+
typing?: boolean | Omit<TypingIndicatorProps, 'className'>;
|
|
1773
|
+
/** Avatar size — overrides default gap between avatar and bubble */
|
|
1774
|
+
avatarSize?: ChatMessageAvatarSize;
|
|
1775
|
+
/** Action buttons revealed on hover */
|
|
1776
|
+
actions?: React.ReactNode;
|
|
1777
|
+
}
|
|
1778
|
+
interface ChatMessageAvatarProps {
|
|
1779
|
+
/** Avatar size: sm(24px), md(28px), lg(32px) */
|
|
1780
|
+
size?: ChatMessageAvatarSize;
|
|
1781
|
+
/** Image URL */
|
|
1782
|
+
src?: string;
|
|
1783
|
+
/** Alt text for avatar image */
|
|
1784
|
+
alt?: string;
|
|
1785
|
+
/** Initials to display when no image (1–2 characters) */
|
|
1786
|
+
initials?: string;
|
|
1787
|
+
/** Custom icon or ReactNode to render inside the avatar */
|
|
1788
|
+
icon?: React.ReactNode;
|
|
1789
|
+
/** Additional CSS classes */
|
|
1790
|
+
className?: string;
|
|
1791
|
+
}
|
|
1792
|
+
interface ChatMessageContentProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
1793
|
+
}
|
|
1794
|
+
interface ChatMessageFooterProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
1795
|
+
/** Pre-formatted timestamp string (e.g. "12:34 PM") */
|
|
1796
|
+
timestamp?: string;
|
|
1797
|
+
/** Status: built-in preset ('sending' | 'sent' | 'read' | 'error') or custom ReactNode */
|
|
1798
|
+
status?: React.ReactNode;
|
|
1799
|
+
/** Size override (defaults to context value from ChatMessage root) */
|
|
1800
|
+
size?: ChatMessageSize;
|
|
1801
|
+
}
|
|
1802
|
+
declare const ChatMessageRoot: React.ForwardRefExoticComponent<ChatMessageRootProps & React.RefAttributes<HTMLDivElement>>;
|
|
1803
|
+
declare const ChatMessageAvatar: React.ForwardRefExoticComponent<ChatMessageAvatarProps & React.RefAttributes<HTMLSpanElement>>;
|
|
1804
|
+
declare const ChatMessageContent: React.ForwardRefExoticComponent<ChatMessageContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
1805
|
+
declare const ChatMessageFooter: React.ForwardRefExoticComponent<ChatMessageFooterProps & React.RefAttributes<HTMLDivElement>>;
|
|
1806
|
+
declare const ChatMessage: React.ForwardRefExoticComponent<ChatMessageRootProps & React.RefAttributes<HTMLDivElement>> & {
|
|
1807
|
+
Avatar: React.ForwardRefExoticComponent<ChatMessageAvatarProps & React.RefAttributes<HTMLSpanElement>>;
|
|
1808
|
+
Content: React.ForwardRefExoticComponent<ChatMessageContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
1809
|
+
Footer: React.ForwardRefExoticComponent<ChatMessageFooterProps & React.RefAttributes<HTMLDivElement>>;
|
|
1810
|
+
};
|
|
1811
|
+
declare namespace ChatMessage {
|
|
1812
|
+
type RootProps = ChatMessageRootProps;
|
|
1813
|
+
type AvatarProps = ChatMessageAvatarProps;
|
|
1814
|
+
type ContentProps = ChatMessageContentProps;
|
|
1815
|
+
type FooterProps = ChatMessageFooterProps;
|
|
1816
|
+
type Role = ChatMessageRole;
|
|
1817
|
+
type Variant = ChatMessageVariant;
|
|
1818
|
+
type Color = ChatMessageColor;
|
|
1819
|
+
type Size = ChatMessageSize;
|
|
1820
|
+
type Radius = ChatMessageRadius;
|
|
1821
|
+
type Status = ChatMessageStatus;
|
|
1822
|
+
type AvatarSize = ChatMessageAvatarSize;
|
|
1823
|
+
}
|
|
1824
|
+
|
|
1825
|
+
export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, Alert, type AlertColor, AlertDescription, type AlertDescriptionProps, AlertModal, AlertModalAction, AlertModalBody, AlertModalCancel, AlertModalContent, type AlertModalContentProps, AlertModalDescription, AlertModalFooter, AlertModalHeader, AlertModalOverlay, AlertModalPortal, AlertModalTitle, AlertModalTrigger, AlertRoot, type AlertRootProps, type AlertSize, AlertTitle, type AlertTitleProps, type AlertVariant, Avatar, type AvatarColorVariant, AvatarFallback, type AvatarFallbackProps, AvatarGroup, type AvatarGroupProps, AvatarImage, type AvatarImageProps, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Badge, type BadgeColor, type BadgeProps, type BadgeRadius, type BadgeSize, type BadgeVariant, Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbList, BreadcrumbPage, type BreadcrumbProps, BreadcrumbSeparator, Button, type ButtonColor, ButtonGroup, type ButtonGroupProps, type ButtonProps, Card, CardAction, type CardActionProps, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, CardImage, type CardImageProps, type CardProps, type CardRadius, CardTitle, type CardTitleProps, type CardVariant, ChatInput, type ChatInputColor, ChatInputField, type ChatInputFieldProps, type ChatInputLayout, type ChatInputRadius, ChatInputRoot, type ChatInputRootProps, type ChatInputSize, ChatInputSubmit, type ChatInputSubmitProps, type ChatInputVariant, ChatMessage, ChatMessageAvatar, type ChatMessageAvatarProps, type ChatMessageAvatarSize, type ChatMessageColor, ChatMessageContent, type ChatMessageContentProps, ChatMessageFooter, type ChatMessageFooterProps, type ChatMessageRadius, type ChatMessageRole, ChatMessageRoot, type ChatMessageRootProps, type ChatMessageSize, type ChatMessageStatus, type ChatMessageVariant, Checkbox, type CheckboxColor, type CheckboxProps, Divider, type DividerProps, Drawer, DrawerBody, DrawerClose, DrawerContent, type DrawerContentProps, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerRoot, type DrawerSide, type DrawerSize, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, type DropdownMenuRadius, DropdownMenuSeparator, DropdownMenuShortcut, type DropdownMenuSize, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Field, FieldCharCount, FieldError, FieldLabel, type FieldLabelProps, type FieldProps, IconButton, type IconButtonProps, Input, type InputProps, MetricCard, MetricCardDescription, type MetricCardDescriptionProps, MetricCardHeader, type MetricCardHeaderProps, type MetricCardProps, type MetricCardRadius, type MetricCardSize, MetricCardSymbol, type MetricCardSymbolProps, MetricCardTitle, type MetricCardTitleProps, MetricCardTrend, type MetricCardTrendDirection, type MetricCardTrendProps, MetricCardValue, type MetricCardValueProps, type MetricCardVariant, Modal, ModalBody, ModalClose, ModalContent, type ModalContentProps, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, NavigationMenu, NavigationMenuContent, type NavigationMenuContentProps, NavigationMenuGroup, type NavigationMenuGroupProps, NavigationMenuIndicator, type NavigationMenuIndicatorProps, NavigationMenuItem, type NavigationMenuItemProps, NavigationMenuLink, type NavigationMenuLinkProps, NavigationMenuList, type NavigationMenuListProps, type NavigationMenuProps, type NavigationMenuRadius, NavigationMenuTrigger, type NavigationMenuTriggerProps, NavigationMenuViewport, type NavigationMenuViewportProps, type OrbitStyle, Pagination, type PaginationColor, PaginationContent, PaginationEllipsis, PaginationFirst, type PaginationFirstProps, PaginationItem, PaginationItems, PaginationLast, type PaginationLastProps, PaginationLink, type PaginationLinkProps, PaginationNext, type PaginationNextProps, PaginationPrevious, type PaginationPreviousProps, type PaginationProps, type PaginationRadius, type PaginationRange, type PaginationSize, type PaginationVariant, Popover, PopoverAnchor, PopoverArrow, PopoverClose, PopoverContent, type PopoverContentProps, PopoverPortal, PopoverRoot, type PopoverRootProps, type PopoverSide, PopoverTrigger, Progress, type ProgressProps, type PromiseOptions, QuickReply, type QuickReplyColor, type QuickReplyGap, QuickReplyItem, type QuickReplyItemProps, type QuickReplyLayout, type QuickReplyRadius, QuickReplyRoot, type QuickReplyRootProps, type QuickReplySize, type QuickReplyVariant, type RadioColor, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, Segmented, SegmentedItem, type SegmentedItemProps, type SegmentedProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, type SelectRadius, SelectSeparator, type SelectSize, SelectTrigger, SelectValue, Skeleton, type SkeletonProps, Slider, type SliderColor, type SliderProps, type SortDirection, type SortIconSet, Spinner, type SpinnerProps, Switch, type SwitchColor, type SwitchLabelPosition, type SwitchProps, Table, TableBody, TableCaption, TableCell, type TableCellProps, TableFooter, TableHead, type TableHeadProps, TableHeader, type TableProps, TableRow, type TableRowProps, type TableSize, type TableVariant, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, type ToastAction, type ToastData, type ToastOptions, type ToastPosition, type ToastSize, type ToastType, Toaster, type ToasterProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipArrow, TooltipContent, type TooltipContentProps, TooltipPortal, TooltipProvider, TooltipRoot, type TooltipRootProps, type TooltipSide, TooltipTrigger, TypingIndicator, type TypingIndicatorProps, type UsePaginationProps, accordionTriggerVariants, accordionVariants, alertModalContentVariants, alertVariants, avatarColors, avatarVariants, badgeVariants, breadcrumbSizeMap, buttonVariants, cardVariants, chatInputVariants, checkboxVariants, dividerVariants, drawerSizeHorizontal, drawerSizeVertical, getAvatarColor, getAvatarInitials, iconButtonVariants, inputVariants, linearTrackVariants, metricCardVariants, modalContentVariants, navigationMenuSizeMap, paginationItemVariants, paginationSizeMap, popoverContentVariants, quickReplyItemVariants, quickReplyRootVariants, radioGroupVariants, radioItemVariants, segmentedItemVariants, segmentedVariants, skeletonVariants, sliderVariants, spinnerVariants, switchVariants, tabsListVariants, tabsTriggerVariants, textareaVariants, toast, toastVariants, toggleGroupItemVariants, toggleGroupVariants, toggleVariants, tooltipContentVariants, typingIndicatorVariants, useButtonGroup, useFieldContext, usePagination };
|
package/dist/index.d.ts
CHANGED
|
@@ -1633,4 +1633,193 @@ interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement>, VariantPro
|
|
|
1633
1633
|
}
|
|
1634
1634
|
declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;
|
|
1635
1635
|
|
|
1636
|
-
|
|
1636
|
+
declare const typingIndicatorVariants: (props?: ({
|
|
1637
|
+
size?: "default" | "sm" | "lg" | null | undefined;
|
|
1638
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1639
|
+
interface TypingIndicatorProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof typingIndicatorVariants> {
|
|
1640
|
+
/** Animation style */
|
|
1641
|
+
variant?: 'dots' | 'cursor';
|
|
1642
|
+
/** Indicator color */
|
|
1643
|
+
color?: 'default' | 'primary' | 'muted';
|
|
1644
|
+
/** Animation speed */
|
|
1645
|
+
speed?: 'slow' | 'default' | 'fast';
|
|
1646
|
+
/** Accessible label (also shown as visual text when showLabel is true) */
|
|
1647
|
+
label?: string;
|
|
1648
|
+
/** Render label text alongside the indicator */
|
|
1649
|
+
showLabel?: boolean;
|
|
1650
|
+
}
|
|
1651
|
+
declare const TypingIndicator: React.ForwardRefExoticComponent<TypingIndicatorProps & React.RefAttributes<HTMLDivElement>>;
|
|
1652
|
+
|
|
1653
|
+
declare const quickReplyRootVariants: (props?: ({
|
|
1654
|
+
layout?: "scroll" | "wrap" | null | undefined;
|
|
1655
|
+
gap?: "default" | "sm" | "lg" | null | undefined;
|
|
1656
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1657
|
+
declare const quickReplyItemVariants: (props?: ({
|
|
1658
|
+
size?: "default" | "sm" | "lg" | null | undefined;
|
|
1659
|
+
radius?: "lg" | "md" | "full" | null | undefined;
|
|
1660
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1661
|
+
type QuickReplyLayout = 'scroll' | 'wrap';
|
|
1662
|
+
type QuickReplyVariant = 'outline' | 'filled' | 'ghost';
|
|
1663
|
+
type QuickReplyColor = 'default' | 'primary';
|
|
1664
|
+
type QuickReplySize = 'sm' | 'default' | 'lg';
|
|
1665
|
+
type QuickReplyRadius = 'md' | 'lg' | 'full';
|
|
1666
|
+
type QuickReplyGap = 'sm' | 'default' | 'lg';
|
|
1667
|
+
interface QuickReplyRootProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof quickReplyRootVariants> {
|
|
1668
|
+
/** Layout mode: horizontal scroll or wrap to multiple rows */
|
|
1669
|
+
layout?: QuickReplyLayout;
|
|
1670
|
+
/** Visual style applied to all child Items */
|
|
1671
|
+
variant?: QuickReplyVariant;
|
|
1672
|
+
/** Color theme applied to all child Items */
|
|
1673
|
+
color?: QuickReplyColor;
|
|
1674
|
+
/** Chip size applied to all child Items */
|
|
1675
|
+
size?: QuickReplySize;
|
|
1676
|
+
/** Border radius applied to all child Items */
|
|
1677
|
+
radius?: QuickReplyRadius;
|
|
1678
|
+
/** Gap between Items */
|
|
1679
|
+
gap?: QuickReplyGap;
|
|
1680
|
+
}
|
|
1681
|
+
interface QuickReplyItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
1682
|
+
/** Leading icon (SVG or ReactNode) */
|
|
1683
|
+
icon?: React.ReactNode;
|
|
1684
|
+
/** Render as child element (Slot pattern) */
|
|
1685
|
+
asChild?: boolean;
|
|
1686
|
+
}
|
|
1687
|
+
declare const QuickReplyRoot: React.ForwardRefExoticComponent<QuickReplyRootProps & React.RefAttributes<HTMLDivElement>>;
|
|
1688
|
+
declare const QuickReplyItem: React.ForwardRefExoticComponent<QuickReplyItemProps & React.RefAttributes<HTMLButtonElement>>;
|
|
1689
|
+
declare const QuickReply: React.ForwardRefExoticComponent<QuickReplyRootProps & React.RefAttributes<HTMLDivElement>> & {
|
|
1690
|
+
Item: React.ForwardRefExoticComponent<QuickReplyItemProps & React.RefAttributes<HTMLButtonElement>>;
|
|
1691
|
+
};
|
|
1692
|
+
declare namespace QuickReply {
|
|
1693
|
+
type RootProps = QuickReplyRootProps;
|
|
1694
|
+
type ItemProps = QuickReplyItemProps;
|
|
1695
|
+
}
|
|
1696
|
+
|
|
1697
|
+
declare const chatInputVariants: (props?: ({
|
|
1698
|
+
variant?: "outline" | "filled" | null | undefined;
|
|
1699
|
+
radius?: "sm" | "lg" | "md" | "xl" | "2xl" | "full" | null | undefined;
|
|
1700
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1701
|
+
type ChatInputSize = 'sm' | 'default' | 'lg';
|
|
1702
|
+
type ChatInputVariant = 'outline' | 'filled';
|
|
1703
|
+
type ChatInputRadius = 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full';
|
|
1704
|
+
type ChatInputColor = 'default' | 'primary';
|
|
1705
|
+
type ChatInputLayout = 'default' | 'inline';
|
|
1706
|
+
interface ChatInputRootProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSubmit'>, VariantProps<typeof chatInputVariants> {
|
|
1707
|
+
/** Visual style of the container */
|
|
1708
|
+
variant?: ChatInputVariant;
|
|
1709
|
+
/** Corner radius */
|
|
1710
|
+
radius?: ChatInputRadius;
|
|
1711
|
+
/** Size scale */
|
|
1712
|
+
size?: ChatInputSize;
|
|
1713
|
+
/** Submit button color — default (dark) or primary (brand) */
|
|
1714
|
+
color?: ChatInputColor;
|
|
1715
|
+
/** Layout direction — default (stacked) or inline (field + button side by side) */
|
|
1716
|
+
layout?: ChatInputLayout;
|
|
1717
|
+
/** Disable all interaction */
|
|
1718
|
+
disabled?: boolean;
|
|
1719
|
+
/** Called when the user submits (Enter key or Submit button) — receives current field value */
|
|
1720
|
+
onSubmit?: (value: string) => void;
|
|
1721
|
+
}
|
|
1722
|
+
interface ChatInputFieldProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'children'> {
|
|
1723
|
+
/** Maximum visible rows before the field scrolls */
|
|
1724
|
+
maxRows?: number;
|
|
1725
|
+
/** Show character counter — requires maxLength to be set */
|
|
1726
|
+
showCount?: boolean;
|
|
1727
|
+
}
|
|
1728
|
+
interface ChatInputSubmitProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
1729
|
+
/** Show loading/stop state — keeps button enabled so user can stop generation */
|
|
1730
|
+
loading?: boolean;
|
|
1731
|
+
/** Called when clicked during loading state (e.g., stop generation) */
|
|
1732
|
+
onStop?: () => void;
|
|
1733
|
+
/** Override the auto-calculated button radius */
|
|
1734
|
+
buttonRadius?: ChatInputRadius;
|
|
1735
|
+
}
|
|
1736
|
+
declare const ChatInputRoot: React.ForwardRefExoticComponent<ChatInputRootProps & React.RefAttributes<HTMLDivElement>>;
|
|
1737
|
+
declare const ChatInputField: React.ForwardRefExoticComponent<ChatInputFieldProps & React.RefAttributes<HTMLTextAreaElement>>;
|
|
1738
|
+
declare const ChatInputSubmit: React.ForwardRefExoticComponent<ChatInputSubmitProps & React.RefAttributes<HTMLButtonElement>>;
|
|
1739
|
+
declare const ChatInput: React.ForwardRefExoticComponent<ChatInputRootProps & React.RefAttributes<HTMLDivElement>> & {
|
|
1740
|
+
Field: React.ForwardRefExoticComponent<ChatInputFieldProps & React.RefAttributes<HTMLTextAreaElement>>;
|
|
1741
|
+
Submit: React.ForwardRefExoticComponent<ChatInputSubmitProps & React.RefAttributes<HTMLButtonElement>>;
|
|
1742
|
+
};
|
|
1743
|
+
declare namespace ChatInput {
|
|
1744
|
+
type RootProps = ChatInputRootProps;
|
|
1745
|
+
type FieldProps = ChatInputFieldProps;
|
|
1746
|
+
type SubmitProps = ChatInputSubmitProps;
|
|
1747
|
+
type Layout = ChatInputLayout;
|
|
1748
|
+
}
|
|
1749
|
+
|
|
1750
|
+
type ChatMessageRole = 'user' | 'assistant';
|
|
1751
|
+
type ChatMessageVariant = 'bubble' | 'flat';
|
|
1752
|
+
type ChatMessageColor = 'default' | 'muted' | 'primary' | 'dark';
|
|
1753
|
+
type ChatMessageSize = 'sm' | 'default' | 'lg';
|
|
1754
|
+
type ChatMessageRadius = 'md' | 'lg' | 'xl' | '2xl';
|
|
1755
|
+
type ChatMessageAvatarSize = 'sm' | 'md' | 'lg';
|
|
1756
|
+
/** Built-in status presets (pass as string to Footer.status for auto-rendering) */
|
|
1757
|
+
type ChatMessageStatus = 'sending' | 'sent' | 'read' | 'error';
|
|
1758
|
+
interface ChatMessageRootProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
1759
|
+
/** Sender role — controls alignment (left=assistant, right=user) */
|
|
1760
|
+
role?: ChatMessageRole;
|
|
1761
|
+
/** Bubble visual style */
|
|
1762
|
+
variant?: ChatMessageVariant;
|
|
1763
|
+
/** Bubble background color */
|
|
1764
|
+
color?: ChatMessageColor;
|
|
1765
|
+
/** Size scale — affects text and padding */
|
|
1766
|
+
size?: ChatMessageSize;
|
|
1767
|
+
/** Bubble corner radius */
|
|
1768
|
+
radius?: ChatMessageRadius;
|
|
1769
|
+
/** Asymmetric tail corner (radius=0 on the avatar side) */
|
|
1770
|
+
tail?: boolean;
|
|
1771
|
+
/** Show typing indicator inside Content. Pass true for defaults, or TypingIndicatorProps for custom. */
|
|
1772
|
+
typing?: boolean | Omit<TypingIndicatorProps, 'className'>;
|
|
1773
|
+
/** Avatar size — overrides default gap between avatar and bubble */
|
|
1774
|
+
avatarSize?: ChatMessageAvatarSize;
|
|
1775
|
+
/** Action buttons revealed on hover */
|
|
1776
|
+
actions?: React.ReactNode;
|
|
1777
|
+
}
|
|
1778
|
+
interface ChatMessageAvatarProps {
|
|
1779
|
+
/** Avatar size: sm(24px), md(28px), lg(32px) */
|
|
1780
|
+
size?: ChatMessageAvatarSize;
|
|
1781
|
+
/** Image URL */
|
|
1782
|
+
src?: string;
|
|
1783
|
+
/** Alt text for avatar image */
|
|
1784
|
+
alt?: string;
|
|
1785
|
+
/** Initials to display when no image (1–2 characters) */
|
|
1786
|
+
initials?: string;
|
|
1787
|
+
/** Custom icon or ReactNode to render inside the avatar */
|
|
1788
|
+
icon?: React.ReactNode;
|
|
1789
|
+
/** Additional CSS classes */
|
|
1790
|
+
className?: string;
|
|
1791
|
+
}
|
|
1792
|
+
interface ChatMessageContentProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
1793
|
+
}
|
|
1794
|
+
interface ChatMessageFooterProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
1795
|
+
/** Pre-formatted timestamp string (e.g. "12:34 PM") */
|
|
1796
|
+
timestamp?: string;
|
|
1797
|
+
/** Status: built-in preset ('sending' | 'sent' | 'read' | 'error') or custom ReactNode */
|
|
1798
|
+
status?: React.ReactNode;
|
|
1799
|
+
/** Size override (defaults to context value from ChatMessage root) */
|
|
1800
|
+
size?: ChatMessageSize;
|
|
1801
|
+
}
|
|
1802
|
+
declare const ChatMessageRoot: React.ForwardRefExoticComponent<ChatMessageRootProps & React.RefAttributes<HTMLDivElement>>;
|
|
1803
|
+
declare const ChatMessageAvatar: React.ForwardRefExoticComponent<ChatMessageAvatarProps & React.RefAttributes<HTMLSpanElement>>;
|
|
1804
|
+
declare const ChatMessageContent: React.ForwardRefExoticComponent<ChatMessageContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
1805
|
+
declare const ChatMessageFooter: React.ForwardRefExoticComponent<ChatMessageFooterProps & React.RefAttributes<HTMLDivElement>>;
|
|
1806
|
+
declare const ChatMessage: React.ForwardRefExoticComponent<ChatMessageRootProps & React.RefAttributes<HTMLDivElement>> & {
|
|
1807
|
+
Avatar: React.ForwardRefExoticComponent<ChatMessageAvatarProps & React.RefAttributes<HTMLSpanElement>>;
|
|
1808
|
+
Content: React.ForwardRefExoticComponent<ChatMessageContentProps & React.RefAttributes<HTMLDivElement>>;
|
|
1809
|
+
Footer: React.ForwardRefExoticComponent<ChatMessageFooterProps & React.RefAttributes<HTMLDivElement>>;
|
|
1810
|
+
};
|
|
1811
|
+
declare namespace ChatMessage {
|
|
1812
|
+
type RootProps = ChatMessageRootProps;
|
|
1813
|
+
type AvatarProps = ChatMessageAvatarProps;
|
|
1814
|
+
type ContentProps = ChatMessageContentProps;
|
|
1815
|
+
type FooterProps = ChatMessageFooterProps;
|
|
1816
|
+
type Role = ChatMessageRole;
|
|
1817
|
+
type Variant = ChatMessageVariant;
|
|
1818
|
+
type Color = ChatMessageColor;
|
|
1819
|
+
type Size = ChatMessageSize;
|
|
1820
|
+
type Radius = ChatMessageRadius;
|
|
1821
|
+
type Status = ChatMessageStatus;
|
|
1822
|
+
type AvatarSize = ChatMessageAvatarSize;
|
|
1823
|
+
}
|
|
1824
|
+
|
|
1825
|
+
export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, Alert, type AlertColor, AlertDescription, type AlertDescriptionProps, AlertModal, AlertModalAction, AlertModalBody, AlertModalCancel, AlertModalContent, type AlertModalContentProps, AlertModalDescription, AlertModalFooter, AlertModalHeader, AlertModalOverlay, AlertModalPortal, AlertModalTitle, AlertModalTrigger, AlertRoot, type AlertRootProps, type AlertSize, AlertTitle, type AlertTitleProps, type AlertVariant, Avatar, type AvatarColorVariant, AvatarFallback, type AvatarFallbackProps, AvatarGroup, type AvatarGroupProps, AvatarImage, type AvatarImageProps, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarStatus, Badge, type BadgeColor, type BadgeProps, type BadgeRadius, type BadgeSize, type BadgeVariant, Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbList, BreadcrumbPage, type BreadcrumbProps, BreadcrumbSeparator, Button, type ButtonColor, ButtonGroup, type ButtonGroupProps, type ButtonProps, Card, CardAction, type CardActionProps, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, CardImage, type CardImageProps, type CardProps, type CardRadius, CardTitle, type CardTitleProps, type CardVariant, ChatInput, type ChatInputColor, ChatInputField, type ChatInputFieldProps, type ChatInputLayout, type ChatInputRadius, ChatInputRoot, type ChatInputRootProps, type ChatInputSize, ChatInputSubmit, type ChatInputSubmitProps, type ChatInputVariant, ChatMessage, ChatMessageAvatar, type ChatMessageAvatarProps, type ChatMessageAvatarSize, type ChatMessageColor, ChatMessageContent, type ChatMessageContentProps, ChatMessageFooter, type ChatMessageFooterProps, type ChatMessageRadius, type ChatMessageRole, ChatMessageRoot, type ChatMessageRootProps, type ChatMessageSize, type ChatMessageStatus, type ChatMessageVariant, Checkbox, type CheckboxColor, type CheckboxProps, Divider, type DividerProps, Drawer, DrawerBody, DrawerClose, DrawerContent, type DrawerContentProps, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerRoot, type DrawerSide, type DrawerSize, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, type DropdownMenuRadius, DropdownMenuSeparator, DropdownMenuShortcut, type DropdownMenuSize, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Field, FieldCharCount, FieldError, FieldLabel, type FieldLabelProps, type FieldProps, IconButton, type IconButtonProps, Input, type InputProps, MetricCard, MetricCardDescription, type MetricCardDescriptionProps, MetricCardHeader, type MetricCardHeaderProps, type MetricCardProps, type MetricCardRadius, type MetricCardSize, MetricCardSymbol, type MetricCardSymbolProps, MetricCardTitle, type MetricCardTitleProps, MetricCardTrend, type MetricCardTrendDirection, type MetricCardTrendProps, MetricCardValue, type MetricCardValueProps, type MetricCardVariant, Modal, ModalBody, ModalClose, ModalContent, type ModalContentProps, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, NavigationMenu, NavigationMenuContent, type NavigationMenuContentProps, NavigationMenuGroup, type NavigationMenuGroupProps, NavigationMenuIndicator, type NavigationMenuIndicatorProps, NavigationMenuItem, type NavigationMenuItemProps, NavigationMenuLink, type NavigationMenuLinkProps, NavigationMenuList, type NavigationMenuListProps, type NavigationMenuProps, type NavigationMenuRadius, NavigationMenuTrigger, type NavigationMenuTriggerProps, NavigationMenuViewport, type NavigationMenuViewportProps, type OrbitStyle, Pagination, type PaginationColor, PaginationContent, PaginationEllipsis, PaginationFirst, type PaginationFirstProps, PaginationItem, PaginationItems, PaginationLast, type PaginationLastProps, PaginationLink, type PaginationLinkProps, PaginationNext, type PaginationNextProps, PaginationPrevious, type PaginationPreviousProps, type PaginationProps, type PaginationRadius, type PaginationRange, type PaginationSize, type PaginationVariant, Popover, PopoverAnchor, PopoverArrow, PopoverClose, PopoverContent, type PopoverContentProps, PopoverPortal, PopoverRoot, type PopoverRootProps, type PopoverSide, PopoverTrigger, Progress, type ProgressProps, type PromiseOptions, QuickReply, type QuickReplyColor, type QuickReplyGap, QuickReplyItem, type QuickReplyItemProps, type QuickReplyLayout, type QuickReplyRadius, QuickReplyRoot, type QuickReplyRootProps, type QuickReplySize, type QuickReplyVariant, type RadioColor, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, Segmented, SegmentedItem, type SegmentedItemProps, type SegmentedProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, type SelectRadius, SelectSeparator, type SelectSize, SelectTrigger, SelectValue, Skeleton, type SkeletonProps, Slider, type SliderColor, type SliderProps, type SortDirection, type SortIconSet, Spinner, type SpinnerProps, Switch, type SwitchColor, type SwitchLabelPosition, type SwitchProps, Table, TableBody, TableCaption, TableCell, type TableCellProps, TableFooter, TableHead, type TableHeadProps, TableHeader, type TableProps, TableRow, type TableRowProps, type TableSize, type TableVariant, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, type ToastAction, type ToastData, type ToastOptions, type ToastPosition, type ToastSize, type ToastType, Toaster, type ToasterProps, Toggle, ToggleGroup, ToggleGroupItem, type ToggleGroupItemProps, type ToggleGroupProps, type ToggleProps, Tooltip, TooltipArrow, TooltipContent, type TooltipContentProps, TooltipPortal, TooltipProvider, TooltipRoot, type TooltipRootProps, type TooltipSide, TooltipTrigger, TypingIndicator, type TypingIndicatorProps, type UsePaginationProps, accordionTriggerVariants, accordionVariants, alertModalContentVariants, alertVariants, avatarColors, avatarVariants, badgeVariants, breadcrumbSizeMap, buttonVariants, cardVariants, chatInputVariants, checkboxVariants, dividerVariants, drawerSizeHorizontal, drawerSizeVertical, getAvatarColor, getAvatarInitials, iconButtonVariants, inputVariants, linearTrackVariants, metricCardVariants, modalContentVariants, navigationMenuSizeMap, paginationItemVariants, paginationSizeMap, popoverContentVariants, quickReplyItemVariants, quickReplyRootVariants, radioGroupVariants, radioItemVariants, segmentedItemVariants, segmentedVariants, skeletonVariants, sliderVariants, spinnerVariants, switchVariants, tabsListVariants, tabsTriggerVariants, textareaVariants, toast, toastVariants, toggleGroupItemVariants, toggleGroupVariants, toggleVariants, tooltipContentVariants, typingIndicatorVariants, useButtonGroup, useFieldContext, usePagination };
|