@neynar/ui 0.2.1 → 0.3.1

package/.llm/spinner.llm.md

@@ -0,0 +1,182 @@
+# Spinner
+
+**Type**: component
+
+Spinner - Loading indicator with animated rotation A circular loading spinner built on the Lucide React Loader2 icon with smooth rotation animation. Provides visual feedback to users during asynchronous operations such as data fetching, form submissions, or content loading. The spinner is highly customizable through CSS classes and supports all standard SVG props for size, color, and styling.
+
+## JSX Usage
+
+```jsx
+import { Spinner } from '@neynar/ui';
+
+<Spinner
+  className="value"
+  color="value"
+  size={value}
+  strokeWidth={value}
+  "aria-label"="value"
+  role="value"
+  "aria-hidden"={value}
+  "aria-describedby"="value"
+  "aria-live"={value}
+  "aria-busy"={true}
+  style={value}
+/>
+```
+
+## Component Props
+
+### className
+- **Type**: `string`
+- **Required**: No
+- **Description**: No description available
+
+### color
+- **Type**: `string`
+- **Required**: No
+- **Description**: No description available
+
+### size
+- **Type**: `number | string`
+- **Required**: No
+- **Description**: No description available
+
+### strokeWidth
+- **Type**: `number | string`
+- **Required**: No
+- **Description**: No description available
+
+### "aria-label"
+- **Type**: `string`
+- **Required**: No
+- **Description**: No description available
+
+### role
+- **Type**: `string`
+- **Required**: No
+- **Description**: No description available
+
+### "aria-hidden"
+- **Type**: `boolean | "false" | "true"`
+- **Required**: No
+- **Description**: No description available
+
+### "aria-describedby"
+- **Type**: `string`
+- **Required**: No
+- **Description**: No description available
+
+### "aria-live"
+- **Type**: `"off" | "polite" | "assertive"`
+- **Required**: No
+- **Description**: No description available
+
+### "aria-busy"
+- **Type**: `boolean`
+- **Required**: No
+- **Description**: No description available
+
+### style
+- **Type**: `React.CSSProperties`
+- **Required**: No
+- **Description**: No description available
+
+## Examples
+
+### Example 1
+```tsx
+// Basic loading spinner with default size (16px)
+<Spinner />
+// Custom size using Tailwind size utilities
+<Spinner className="size-6" />
+<Spinner className="size-8" />
+<Spinner className="size-12" />
+// Custom color using text color classes
+<Spinner className="text-primary" />
+<Spinner className="text-destructive" />
+<Spinner className="text-muted-foreground" />
+```
+### Example 2
+```tsx
+// In loading buttons
+import { Button } from "./button";
+<Button disabled>
+  <Spinner className="mr-2 size-4" />
+  Loading...
+</Button>
+<Button variant="outline" disabled>
+  <Spinner className="mr-2 size-4" />
+  Processing
+</Button>
+// Icon-only loading button
+<Button size="icon" disabled aria-label="Loading">
+  <Spinner className="size-4" />
+</Button>
+```
+### Example 3
+```tsx
+// Full-page loading state
+<div className="flex min-h-screen items-center justify-center">
+  <div className="text-center space-y-4">
+    <Spinner className="size-12 mx-auto" />
+    <p className="text-muted-foreground">Loading your dashboard...</p>
+  </div>
+</div>
+// Card loading state
+<div className="border rounded-lg p-8 flex flex-col items-center gap-3">
+  <Spinner className="size-8" />
+  <p className="text-sm text-muted-foreground">Fetching data...</p>
+</div>
+// Inline loading with text
+<p className="flex items-center gap-2 text-sm">
+  <Spinner className="size-4" />
+  Syncing your data...
+</p>
+```
+### Example 4
+```tsx
+// Custom animation speed
+// Slow rotation
+<Spinner className="animate-[spin_2s_linear_infinite]" />
+// Fast rotation
+<Spinner className="animate-[spin_0.5s_linear_infinite]" />
+// Custom size and color combination
+<Spinner
+  className="size-6 text-blue-500"
+  strokeWidth={3}
+/>
+// With background overlay
+<div className="relative">
+  <div className="absolute inset-0 bg-background/50 backdrop-blur-sm flex items-center justify-center rounded-lg">
+    <Spinner className="size-8" />
+  </div>
+  <div>Your content here</div>
+</div>
+```
+### Example 5
+```tsx
+// Conditional rendering with loading state
+function DataDisplay() {
+  const [isLoading, setIsLoading] = React.useState(true);
+  return (
+    <div className="space-y-4">
+      {isLoading ? (
+        <div className="flex justify-center p-8">
+          <Spinner className="size-6" />
+        </div>
+      ) : (
+        <div>Loaded content here</div>
+      )}
+    </div>
+  );
+}
+// With aria-live region for screen reader announcements
+<div aria-live="polite" aria-atomic="true">
+  {isLoading && (
+    <div className="flex items-center gap-2">
+      <Spinner className="size-4" />
+      <span>Loading content, please wait...</span>
+    </div>
+  )}
+</div>
+```

package/{llm-docs → .llm}/strong.llm.md

@@ -30,12 +30,7 @@ import { Strong } from '@neynar/ui';
 ## Component Props
 
 ### color
-- **Type**: `| "default"
-    | "muted"
-    | "accent"
-    | "destructive"
-    | "success"
-    | "warning"`
+- **Type**: `TypographyColor`
 - **Required**: No
 - **Description**: No description available
 

package/{llm-docs → .llm}/typography.llm.md

@@ -32,26 +32,12 @@ import { Typography } from '@neynar/ui';
 ## Component Props
 
 ### variant
-- **Type**: `| "heading"
-    | "subheading"
-    | "body"
-    | "bodyEmphasized"
-    | "details"
-    | "field"
-    | "code"
-    | "microcopy"
-    | "tableCell"
-    | "tableHeader"`
+- **Type**: `TypographyVariant`
 - **Required**: No
 - **Description**: No description available
 
 ### color
-- **Type**: `| "default"
-    | "muted"
-    | "accent"
-    | "destructive"
-    | "success"
-    | "warning"`
+- **Type**: `TypographyColor`
 - **Required**: No
 - **Description**: No description available
 

package/dist/components/ui/button-group.d.ts

@@ -0,0 +1,448 @@
+import { type VariantProps } from "class-variance-authority";
+import { Separator } from "@/components/ui/separator";
+/**
+ * Button group variant configuration using class-variance-authority
+ *
+ * Defines layout orientations and styling for the ButtonGroup container.
+ * Manages button borders, border-radius, and spacing to create seamless
+ * button group appearances where buttons visually connect together.
+ *
+ * @variant horizontal - Buttons arranged side-by-side with connected left/right borders
+ * @variant vertical - Buttons stacked vertically with connected top/bottom borders
+ *
+ * @see {@link https://cva.style/docs} CVA documentation
+ * @see {@link https://ui.shadcn.com/docs/components/button-group} shadcn/ui button-group documentation
+ * @since 1.0.0
+ */
+declare const buttonGroupVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/**
+ * Props for ButtonGroup component (Documentation only - NOT used in component implementation)
+ * These types are for documentation generation and should not replace CVA inferred types
+ */
+type ButtonGroupDocsProps = {
+    /**
+     * Layout orientation of the button group
+     *
+     * - "horizontal": Buttons arranged side-by-side with connected borders (default)
+     * - "vertical": Buttons stacked vertically with connected borders
+     *
+     * @default "horizontal"
+     */
+    orientation?: "horizontal" | "vertical";
+    /** Additional CSS classes to apply to the button group container */
+    className?: string;
+    /** Button components to group together (typically Button components) */
+    children?: React.ReactNode;
+    /** Accessible label describing the button group's purpose (recommended for screen readers) */
+    "aria-label"?: string;
+    /** ID of element that labels this button group */
+    "aria-labelledby"?: string;
+    /** ID of element that describes this button group */
+    "aria-describedby"?: string;
+} & React.HTMLAttributes<HTMLDivElement>;
+/**
+ * Props for ButtonGroupText component (Documentation only - NOT used in component implementation)
+ * These types are for documentation generation and should not replace Radix inferred types
+ */
+type ButtonGroupTextDocsProps = {
+    /**
+     * Render as a different element instead of a div
+     *
+     * When true, renders the text container as its child element via Radix UI Slot.
+     * Useful for semantic HTML or custom component composition.
+     *
+     * @default false
+     */
+    asChild?: boolean;
+    /** Additional CSS classes to apply to the text container */
+    className?: string;
+    /** Text content or React nodes to display in the group */
+    children?: React.ReactNode;
+} & React.HTMLAttributes<HTMLDivElement>;
+/**
+ * Props for ButtonGroupSeparator component (Documentation only - NOT used in component implementation)
+ * These types are for documentation generation and should not replace Separator inferred types
+ */
+type ButtonGroupSeparatorDocsProps = {
+    /**
+     * Orientation of the separator line
+     *
+     * - "vertical": Vertical separator for horizontal button groups (default)
+     * - "horizontal": Horizontal separator for vertical button groups
+     *
+     * Note: Typically use vertical separators in horizontal groups and horizontal separators in vertical groups
+     *
+     * @default "vertical"
+     */
+    orientation?: "horizontal" | "vertical";
+    /** Additional CSS classes to apply to the separator */
+    className?: string;
+    /**
+     * Whether the separator is purely decorative
+     *
+     * When true, separator is hidden from assistive technologies
+     *
+     * @default true
+     */
+    decorative?: boolean;
+} & React.ComponentProps<typeof Separator>;
+/**
+ * ButtonGroup - Container for grouping related buttons with consistent styling
+ *
+ * A flexible container component that groups related action buttons together with seamless
+ * visual connection. Built for toolbars, pagination controls, action menus, and navigation
+ * interfaces. Supports both horizontal and vertical layouts with intelligent border and
+ * border-radius management to create cohesive button groups.
+ *
+ * The component automatically handles:
+ * - Border collapsing between adjacent buttons for seamless appearance
+ * - Focus state z-index management to ensure proper focus ring visibility
+ * - Integration with Button, Input, and Select components
+ * - Nested button group support for complex layouts
+ * - Responsive sizing that adapts to button content
+ *
+ * @example
+ * ```tsx
+ * // Basic horizontal button group (most common usage)
+ * import { Button, ButtonGroup } from "@neynar/ui"
+ *
+ * <ButtonGroup>
+ *   <Button variant="outline">Copy</Button>
+ *   <Button variant="outline">Paste</Button>
+ *   <Button variant="outline">Cut</Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Vertical button group for navigation menus
+ * import { Button, ButtonGroup } from "@neynar/ui"
+ *
+ * <ButtonGroup orientation="vertical" aria-label="Navigation menu">
+ *   <Button variant="outline" className="justify-start">Dashboard</Button>
+ *   <Button variant="outline" className="justify-start">Projects</Button>
+ *   <Button variant="outline" className="justify-start">Team</Button>
+ *   <Button variant="outline" className="justify-start">Settings</Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Button group with icons and separators
+ * import { Copy, Download, Share2 } from "lucide-react"
+ * import { Button, ButtonGroup, ButtonGroupSeparator } from "@neynar/ui"
+ *
+ * <ButtonGroup aria-label="Content actions">
+ *   <Button variant="outline">
+ *     <Copy className="size-4" />
+ *     Copy
+ *   </Button>
+ *   <ButtonGroupSeparator />
+ *   <Button variant="outline">
+ *     <Download className="size-4" />
+ *     Download
+ *   </Button>
+ *   <ButtonGroupSeparator />
+ *   <Button variant="outline">
+ *     <Share2 className="size-4" />
+ *     Share
+ *   </Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Pagination controls with text element
+ * import { Button, ButtonGroup, ButtonGroupText } from "@neynar/ui"
+ *
+ * <ButtonGroup aria-label="Pagination controls">
+ *   <Button variant="outline" disabled={currentPage === 1}>
+ *     Previous
+ *   </Button>
+ *   <ButtonGroupText>Page {currentPage} of {totalPages}</ButtonGroupText>
+ *   <Button variant="outline" disabled={currentPage === totalPages}>
+ *     Next
+ *   </Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Toolbar with multiple grouped sections
+ * import { Button, ButtonGroup, ButtonGroupSeparator } from "@neynar/ui"
+ *
+ * <div className="flex gap-2" role="toolbar" aria-label="Editor toolbar">
+ *   <ButtonGroup>
+ *     <Button variant="outline" size="sm">Bold</Button>
+ *     <Button variant="outline" size="sm">Italic</Button>
+ *     <Button variant="outline" size="sm">Underline</Button>
+ *   </ButtonGroup>
+ *
+ *   <ButtonGroupSeparator orientation="vertical" className="h-8" />
+ *
+ *   <ButtonGroup>
+ *     <Button variant="outline" size="sm">Left</Button>
+ *     <Button variant="outline" size="sm">Center</Button>
+ *     <Button variant="outline" size="sm">Right</Button>
+ *   </ButtonGroup>
+ * </div>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Different button sizes in groups
+ * import { Button, ButtonGroup } from "@neynar/ui"
+ *
+ * // Small buttons for compact interfaces
+ * <ButtonGroup>
+ *   <Button variant="outline" size="sm">Small</Button>
+ *   <Button variant="outline" size="sm">Size</Button>
+ *   <Button variant="outline" size="sm">Buttons</Button>
+ * </ButtonGroup>
+ *
+ * // Large buttons for prominent actions
+ * <ButtonGroup>
+ *   <Button variant="outline" size="lg">Large</Button>
+ *   <Button variant="outline" size="lg">Size</Button>
+ *   <Button variant="outline" size="lg">Buttons</Button>
+ * </ButtonGroup>
+ *
+ * // Icon buttons in group
+ * <ButtonGroup>
+ *   <Button variant="outline" size="icon" aria-label="Bold">
+ *     <Bold className="size-4" />
+ *   </Button>
+ *   <Button variant="outline" size="icon" aria-label="Italic">
+ *     <Italic className="size-4" />
+ *   </Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @accessibility
+ * - Container has role="group" for semantic grouping
+ * - Use Tab key to navigate between buttons in the group
+ * - Each button maintains full keyboard support (Enter/Space activation)
+ * - Focus states properly layered with z-index management
+ * - Add aria-label to describe the button group's purpose
+ * - Icon-only buttons in groups require individual aria-label attributes
+ * - Use ButtonGroupText for informative text that shouldn't be actionable
+ * - For toolbar layouts, wrap ButtonGroup in element with role="toolbar"
+ * - When used for navigation, consider aria-label="Navigation menu"
+ *
+ * @variant horizontal - Buttons arranged side-by-side with connected left/right borders
+ * @variant vertical - Buttons stacked vertically with connected top/bottom borders
+ *
+ * @see {@link Button} Base button component used within groups
+ * @see {@link ButtonGroupSeparator} Visual separator between grouped buttons
+ * @see {@link ButtonGroupText} Text element for labels and info within groups
+ * @see {@link https://ui.shadcn.com/docs/components/button-group} shadcn/ui button-group documentation
+ * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/toolbar/} WAI-ARIA Toolbar Pattern
+ * @since 1.0.0
+ */
+declare function ButtonGroup({ className, orientation, ...props }: React.ComponentProps<"div"> & VariantProps<typeof buttonGroupVariants>): import("react/jsx-runtime").JSX.Element;
+/**
+ * ButtonGroupText - Text display element for labels and information within button groups
+ *
+ * A styled text container designed to display non-interactive content within button groups,
+ * such as labels, pagination information, or contextual text. Maintains visual consistency
+ * with grouped buttons through matching height, border, and styling while being clearly
+ * non-interactive with a muted background.
+ *
+ * Common use cases:
+ * - Pagination counters ("Page 1 of 10")
+ * - Section labels ("Actions:", "Tools:")
+ * - Status indicators or counts
+ * - Contextual information between action buttons
+ *
+ * The component automatically:
+ * - Matches button group styling with appropriate borders and spacing
+ * - Sizes icons consistently at 16px (size-4)
+ * - Maintains visual hierarchy with muted background
+ * - Prevents pointer events on icons to avoid interaction confusion
+ *
+ * @example
+ * ```tsx
+ * // Pagination with page count display
+ * import { Button, ButtonGroup, ButtonGroupText } from "@neynar/ui"
+ *
+ * <ButtonGroup aria-label="Pagination">
+ *   <Button variant="outline" onClick={goToPrevious}>
+ *     Previous
+ *   </Button>
+ *   <ButtonGroupText>
+ *     Page {currentPage} of {totalPages}
+ *   </ButtonGroupText>
+ *   <Button variant="outline" onClick={goToNext}>
+ *     Next
+ *   </Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Section label with action buttons
+ * import { Copy, Download } from "lucide-react"
+ * import { Button, ButtonGroup, ButtonGroupText, ButtonGroupSeparator } from "@neynar/ui"
+ *
+ * <ButtonGroup>
+ *   <ButtonGroupText>Actions:</ButtonGroupText>
+ *   <ButtonGroupSeparator />
+ *   <Button variant="outline">
+ *     <Copy className="size-4" />
+ *     Copy
+ *   </Button>
+ *   <Button variant="outline">
+ *     <Download className="size-4" />
+ *     Download
+ *   </Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Status indicator with icon
+ * import { CheckCircle2 } from "lucide-react"
+ * import { ButtonGroup, ButtonGroupText } from "@neynar/ui"
+ *
+ * <ButtonGroup>
+ *   <ButtonGroupText>
+ *     <CheckCircle2 className="text-green-500" />
+ *     3 items selected
+ *   </ButtonGroupText>
+ *   <Button variant="outline" onClick={clearSelection}>
+ *     Clear
+ *   </Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Custom composition with asChild
+ * import { ButtonGroup, ButtonGroupText } from "@neynar/ui"
+ *
+ * <ButtonGroup>
+ *   <Button variant="outline">Action 1</Button>
+ *   <ButtonGroupText asChild>
+ *     <span role="status" aria-live="polite">
+ *       Processing: {progress}%
+ *     </span>
+ *   </ButtonGroupText>
+ *   <Button variant="outline">Action 2</Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @accessibility
+ * - Not focusable or interactive (use Button for clickable elements)
+ * - Text content automatically accessible to screen readers
+ * - Use semantic HTML with asChild for status indicators (role="status", aria-live)
+ * - Icons are decorative by default (pointer-events-none)
+ * - Maintains sufficient color contrast in muted background
+ * - For dynamic content like pagination, consider aria-live regions
+ *
+ * @see {@link ButtonGroup} Parent container for button groups
+ * @see {@link ButtonGroupSeparator} Visual divider between group elements
+ * @see {@link Button} Interactive button component for actions
+ * @see {@link https://ui.shadcn.com/docs/components/button-group} shadcn/ui button-group documentation
+ * @since 1.0.0
+ */
+declare function ButtonGroupText({ className, asChild, ...props }: React.ComponentProps<"div"> & {
+    asChild?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * ButtonGroupSeparator - Visual divider for buttons within a button group
+ *
+ * A specialized separator component that creates visual divisions between buttons or elements
+ * within a ButtonGroup. Built on the Separator primitive with automatic sizing and styling
+ * to match button group layouts. The separator orientation typically matches the button group
+ * orientation (vertical separators in horizontal groups, horizontal separators in vertical groups).
+ *
+ * Key behaviors:
+ * - Self-stretches to match parent height/width automatically
+ * - Uses input border color for subtle visual division
+ * - Removes margins for seamless integration
+ * - Decorative by default (hidden from screen readers)
+ *
+ * Note: Separators are typically unnecessary for outline variant buttons since they
+ * already have visible borders. Use separators with ghost, default, or other variants
+ * where the visual separation is needed.
+ *
+ * @example
+ * ```tsx
+ * // Horizontal button group with vertical separators
+ * import { Button, ButtonGroup, ButtonGroupSeparator } from "@neynar/ui"
+ *
+ * <ButtonGroup>
+ *   <Button variant="outline">Copy</Button>
+ *   <ButtonGroupSeparator />
+ *   <Button variant="outline">Paste</Button>
+ *   <ButtonGroupSeparator />
+ *   <Button variant="outline">Cut</Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Vertical button group with horizontal separators
+ * import { Button, ButtonGroup, ButtonGroupSeparator } from "@neynar/ui"
+ *
+ * <ButtonGroup orientation="vertical">
+ *   <Button variant="outline">Item 1</Button>
+ *   <ButtonGroupSeparator orientation="horizontal" />
+ *   <Button variant="outline">Item 2</Button>
+ *   <ButtonGroupSeparator orientation="horizontal" />
+ *   <Button variant="outline">Item 3</Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Separating button group sections in toolbar
+ * import { Button, ButtonGroup, ButtonGroupSeparator } from "@neynar/ui"
+ *
+ * <div className="flex gap-2" role="toolbar">
+ *   <ButtonGroup>
+ *     <Button variant="outline" size="sm">Bold</Button>
+ *     <Button variant="outline" size="sm">Italic</Button>
+ *   </ButtonGroup>
+ *
+ *   <ButtonGroupSeparator orientation="vertical" className="h-8" />
+ *
+ *   <ButtonGroup>
+ *     <Button variant="outline" size="sm">Left</Button>
+ *     <Button variant="outline" size="sm">Center</Button>
+ *     <Button variant="outline" size="sm">Right</Button>
+ *   </ButtonGroup>
+ * </div>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Separator with custom height for specific layouts
+ * import { Button, ButtonGroup, ButtonGroupSeparator } from "@neynar/ui"
+ *
+ * <ButtonGroup>
+ *   <Button variant="ghost">Action 1</Button>
+ *   <ButtonGroupSeparator className="h-6" />
+ *   <Button variant="ghost">Action 2</Button>
+ * </ButtonGroup>
+ * ```
+ *
+ * @accessibility
+ * - Purely decorative by default (hidden from assistive technologies)
+ * - Does not receive keyboard focus
+ * - Provides visual separation only
+ * - No ARIA attributes needed for typical button group usage
+ * - Screen reader users navigate between buttons using Tab key
+ *
+ * @see {@link ButtonGroup} Parent container for button groups
+ * @see {@link ButtonGroupText} Text display element within groups
+ * @see {@link Separator} Base separator primitive component
+ * @see {@link https://ui.shadcn.com/docs/components/button-group} shadcn/ui button-group documentation
+ * @see {@link https://www.radix-ui.com/primitives/docs/components/separator} Radix UI Separator primitive
+ * @since 1.0.0
+ */
+declare function ButtonGroupSeparator({ className, orientation, ...props }: React.ComponentProps<typeof Separator>): import("react/jsx-runtime").JSX.Element;
+export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText, buttonGroupVariants, type ButtonGroupDocsProps, type ButtonGroupSeparatorDocsProps, type ButtonGroupTextDocsProps, };
+//# sourceMappingURL=button-group.d.ts.map

package/dist/components/ui/button-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-group.d.ts","sourceRoot":"","sources":["../../../src/components/ui/button-group.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAErD;;;;;;;;;;;;;GAaG;AACH,QAAA,MAAM,mBAAmB;;8EAexB,CAAA;AAED;;;GAGG;AACH,KAAK,oBAAoB,GAAG;IAC1B;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,oEAAoE;IACpE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,wEAAwE;IACxE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,8FAA8F;IAC9F,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,kDAAkD;IAClD,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,qDAAqD;IACrD,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAExC;;;GAGG;AACH,KAAK,wBAAwB,GAAG;IAC9B;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,4DAA4D;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAExC;;;GAGG;AACH,KAAK,6BAA6B,GAAG;IACnC;;;;;;;;;OASG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,CAAA;AAE1C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwJG;AACH,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,WAAW,EACX,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,2CAUxE;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwGG;AACH,iBAAS,eAAe,CAAC,EACvB,SAAS,EACT,OAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,2CAYA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4FG;AACH,iBAAS,oBAAoB,CAAC,EAC5B,SAAS,EACT,WAAwB,EACxB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,2CAYxC;AAED,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,eAAe,EACf,mBAAmB,EACnB,KAAK,oBAAoB,EACzB,KAAK,6BAA6B,EAClC,KAAK,wBAAwB,GAC9B,CAAA"}

package/dist/components/ui/button.d.ts

@@ -75,7 +75,7 @@ type ButtonDocsProps = {
     /** Indicates invalid state for form validation */
     "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling";
     /** Indicates expanded state for disclosure buttons */
-    "aria-expanded"?: React.AriaAttributes['aria-expanded'];
+    "aria-expanded"?: React.AriaAttributes["aria-expanded"];
     /** Associates button with elements it controls */
     "aria-controls"?: string;
     /** Indicates pressed state for toggle buttons */