@walidsj/react-ui 0.2.0 → 0.3.0

package/README.md

@@ -26,7 +26,7 @@ Requires React 19. The package is ESM-only.
 ## Usage
 
 Import the compiled stylesheet once, then use components from the package
-root. `InputGroup` and `InputGroupAddon` place optional prefix/suffix content
+root. `InputGroup` and `InputGroup.Addon` place optional prefix/suffix content
 beside an `Input`; unlabeled addons are decorative. `Container` centers content
 within a responsive maximum width:
 
@@ -64,8 +64,8 @@ import { Textarea } from "@walidsj/react-ui/components/textarea";
 ### Label, Badge, Card, and Separator
 
 The package also exports `Label`, `Badge`, `Separator`, and composable card
-parts: `Card`, `CardHeader`, `CardTitle`, `CardDescription`, `CardContent`,
-and `CardFooter`. Badge variants are `default`, `secondary`, `outline`,
+parts: `Card`, `Card.Header`, `Card.Title`, `Card.Description`, `Card.Content`,
+and `Card.Footer`. Badge variants are `default`, `secondary`, `outline`,
 `accent`, `success`, `warning`, and `danger`. `Separator` uses Base UI's
 separator primitive and accepts `horizontal` or `vertical` orientation.
 
@@ -75,56 +75,56 @@ These components use Base UI for keyboard and focus behavior. Compose their
 parts as needed:
 
 ``` tsx
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@walidsj/react-ui";
+import { Tabs } from "@walidsj/react-ui";
 
 <Tabs defaultValue="account">
-  <TabsList>
-    <TabsTrigger value="account">Account</TabsTrigger>
-    <TabsTrigger value="security">Security</TabsTrigger>
-  </TabsList>
-  <TabsContent value="account">Account settings</TabsContent>
-  <TabsContent value="security">Security settings</TabsContent>
+  <Tabs.List>
+    <Tabs.Trigger value="account">Account</Tabs.Trigger>
+    <Tabs.Trigger value="security">Security</Tabs.Trigger>
+  </Tabs.List>
+  <Tabs.Content value="account">Account settings</Tabs.Content>
+  <Tabs.Content value="security">Security settings</Tabs.Content>
 </Tabs>
 ```
 
-`DialogContent` should include a `DialogTitle` for an accessible name.
-`Tooltip` instances should be wrapped in `TooltipProvider`.
+`Dialog.Content` should include a `Dialog.Title` for an accessible name.
+`Tooltip` instances should be wrapped in `Tooltip.Provider`.
 
 ### More controls and layout components
 
 `Switch` and `Checkbox` are Base UI-backed controls. `Select` is composed
-from `Select`, `SelectTrigger`, `SelectValue`, `SelectContent`, and
-`SelectItem`. `Accordion` is composed from `AccordionItem`,
-`AccordionTrigger`, and `AccordionContent`. `Avatar` supports `AvatarImage`
-and should always include an `AvatarFallback`. `AvatarGroup` overlaps avatars
-and can include `AvatarGroupCount` to indicate additional members.
+from `Select`, `Select.Trigger`, `Select.Value`, `Select.Content`, and
+`Select.Item`. `Accordion` is composed from `Accordion.Item`,
+`Accordion.Trigger`, and `Accordion.Content`. `Avatar` supports `Avatar.Image`
+and should always include an `Avatar.Fallback`. `AvatarGroup` overlaps avatars
+and can include `AvatarGroup.Count` to indicate additional members.
 
 For data and feedback, the package exports composable semantic table parts
-(`Table`, `TableHeader`, `TableBody`, `TableRow`, `TableHead`, `TableCell`,
-`TableFooter`, and `TableCaption`), Base UI-backed `Progress`, `Skeleton`
+(`Table`, `Table.Header`, `Table.Body`, `Table.Row`, `Table.Head`, `Table.Cell`,
+`Table.Footer`, and `Table.Caption`), Base UI-backed `Progress`, `Skeleton`
 for loading placeholders, and `Alert` with `default`, `danger`, `success`,
 and `warning` variants.
 
 Additional navigation and choice components include `Popover`,
-`RadioGroup`/`RadioGroupItem`, `ToggleGroup`/`ToggleGroupItem`, and semantic
-breadcrumb parts (`Breadcrumb`, `BreadcrumbList`, `BreadcrumbItem`,
-`BreadcrumbLink`, `BreadcrumbPage`, and `BreadcrumbSeparator`).
+`RadioGroup`/`RadioGroup.Item`, `ToggleGroup`/`ToggleGroup.Item`, and semantic
+breadcrumb parts (`Breadcrumb`, `Breadcrumb.List`, `Breadcrumb.Item`,
+`Breadcrumb.Link`, `Breadcrumb.Page`, and `Breadcrumb.Separator`).
 
-Form composition also includes Base UI `Field` parts (`FieldLabel`,
-`FieldDescription`, and `FieldError`), `Slider`, `NumberField` with its group,
+Form composition also includes Base UI `Field` parts (`Field.Label`,
+`Field.Description`, and `Field.Error`), `Slider`, `NumberField` with its group,
 input and increment/decrement controls, and `Collapsible` with trigger and
 content parts.
 
 `Combobox` provides a searchable selection built on Base UI. Pass an `items`
-collection to the root, then compose `ComboboxInputGroup`, `ComboboxInput`,
-`ComboboxContent`, and `ComboboxItem`. `Meter` is a non-interactive value
+collection to the root, then compose `Combobox.InputGroup`, `Combobox.Input`,
+`Combobox.Content`, and `Combobox.Item`. `Meter` is a non-interactive value
 display with `primary`, `success`, `warning`, and `danger` variants. `Toolbar`
 provides keyboard-navigable action groups, while `ContextMenu` provides
-right-click actions. `OTPField` composes one `OTPFieldInput` per code slot and
+right-click actions. `OTPField` composes one `OTPField.Input` per code slot and
 supports Base UI's native paste and keyboard behavior.
 
 The OTP root requires `length` (the number of code slots); use
-`OTPFieldSeparator` only for visual grouping and do not count it as a slot.
+`OTPField.Separator` only for visual grouping and do not count it as a slot.
 
 `Autocomplete` suggests matching values while allowing free-form input. Its
 object values can provide `label` and `value`; otherwise configure
@@ -135,7 +135,7 @@ content panels. Both use Base UI keyboard and focus behavior.
 
 `CheckboxGroup` shares selected values across a set of native-style checkboxes.
 `PreviewCard` reveals link context on hover or keyboard focus. `Drawer` is a
-swipe-dismissible bottom panel; use `DrawerTitle` and `DrawerDescription` to
+swipe-dismissible bottom panel; use `Drawer.Title` and `Drawer.Description` to
 provide its accessible name and description.
 
 `Toggle` is a standalone two-state button. `Form` wraps Base UI's native form
@@ -146,7 +146,7 @@ several radio options share one value and keyboard navigation context.
 `AspectRatio` reserves a stable content frame (16:9 by default) for images,
 video, and other responsive media.
 `Kbd` styles the native `<kbd>` element for semantic keyboard shortcut labels.
-`Empty`, `EmptyTitle`, and `EmptyDescription` compose a clear no-content
+`Empty`, `Empty.Title`, and `Empty.Description` compose a clear no-content
 message; place an action such as a `Button` inside `Empty` when users can
 create or recover content.
 `InlineCode` styles short code fragments within prose; use a preformatted
@@ -159,22 +159,22 @@ supports horizontal (default) or vertical orientation.
 `focusable` for content such as a keyboard-revealed skip link.
 `Sidebar` provides composable navigation layout parts. The mobile overlay,
 collapse state, and route selection remain under application control; use
-`aria-current="page"` on the active `SidebarMenuButton` link.
+`aria-current="page"` on the active `Sidebar.MenuButton` link.
 `IconButton` reuses the standard button variants with square sizing and
 requires an `aria-label` for its icon-only content.
 `Link` styles a native anchor and preserves browser navigation behavior; use
 your router's link component when client-side routing is required.
-`DescriptionList`, `DescriptionTerm`, and `DescriptionDetails` provide
+`DescriptionList`, `DescriptionList.Term`, and `DescriptionList.Details` provide
 semantic label/value pairs for record details and summaries.
 `StatusIndicator` pairs a colored dot with a visible label using `default`,
 `success`, `warning`, or `danger` variants.
 
-Overlays include `AlertDialog` (with `AlertDialogHeader`, `AlertDialogFooter`,
-`AlertDialogCancel`, and `AlertDialogAction`) and `Sheet` with `right`, `left`,
+Overlays include `AlertDialog` (with `AlertDialog.Header`, `AlertDialog.Footer`,
+`AlertDialog.Cancel`, and `AlertDialog.Action`) and `Sheet` with `right`, `left`,
 `top`, and `bottom` sides. `ScrollArea` adds themed scrollbars around a native
-scroll container. `Pagination` is composed from `PaginationContent`,
-`PaginationItem`, `PaginationLink`, `PaginationPrevious`, `PaginationNext`, and
-`PaginationEllipsis`.
+scroll container. `Pagination` is composed from `Pagination.Content`,
+`Pagination.Item`, `Pagination.Link`, `Pagination.Previous`, `Pagination.Next`, and
+`Pagination.Ellipsis`.
 
 Notifications use Base UI toast primitives. Wrap the application in
 `ToastProvider`, render `Toaster` once, and call `useToastManager` from a
@@ -280,6 +280,21 @@ buttons, pagination arrows, numeric steppers, accordion chevrons) use
 `@tabler/icons-react`, which ships as a runtime dependency of this package.
 Consumers do not need to install it separately.
 
+## Migration
+
+Compound parts moved from flat exports (`CardTitle`) to object namespaces
+(`Card.Title`). Import only the namespace root, then use its properties:
+
+``` tsx
+// Before (removed)
+import { Card, CardTitle } from "@walidsj/react-ui";
+<Card><CardTitle>Account</CardTitle></Card>
+
+// After
+import { Card } from "@walidsj/react-ui";
+<Card><Card.Title>Account</Card.Title></Card>
+```
+
 ## Styling
 
 The package ships a precompiled stylesheet at

package/dist/{accordion-Da0Y5c3W.js → accordion-nzbtc3_2.js}

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { IconChevronDown } from "@tabler/icons-react";
 import { Accordion } from "@base-ui/react/accordion";
 // src/components/accordion/accordion.tsx
-var Accordion$1 = Accordion.Root;
+var AccordionRoot = Accordion.Root;
 function AccordionItem({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Accordion.Item, {
 		...props,
@@ -30,6 +30,11 @@ function AccordionContent({ className, ...props }) {
 		className: cn("text-muted-foreground overflow-hidden pb-4 text-sm", className)
 	});
 }
-export { AccordionTrigger as i, AccordionContent as n, AccordionItem as r, Accordion$1 as t };
+var Accordion$1 = Object.assign(AccordionRoot, {
+	Item: AccordionItem,
+	Trigger: AccordionTrigger,
+	Content: AccordionContent
+});
+export { Accordion$1 as t };
 
-//# sourceMappingURL=accordion-Da0Y5c3W.js.map
+//# sourceMappingURL=accordion-nzbtc3_2.js.map

package/dist/accordion-nzbtc3_2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion-nzbtc3_2.js","names":["BaseAccordion","Accordion"],"sources":["../src/components/accordion/accordion.tsx"],"sourcesContent":["import { Accordion as BaseAccordion } from \"@base-ui/react/accordion\";\nimport { IconChevronDown } from \"@tabler/icons-react\";\nimport type { ComponentProps } from \"react\";\nimport { cn } from \"../../lib/cn\";\n\nconst AccordionRoot = BaseAccordion.Root;\n\nfunction AccordionItem({ className, ...props }: ComponentProps<typeof BaseAccordion.Item>) {\n  return <BaseAccordion.Item {...props} className={cn(\"border-border border-b\", className)} />;\n}\n\nfunction AccordionTrigger({ className, children, ...props }: ComponentProps<typeof BaseAccordion.Trigger>) {\n  return <BaseAccordion.Header className=\"flex\"><BaseAccordion.Trigger {...props} className={cn(\"text-foreground focus-visible:ring-ring flex flex-1 items-center justify-between py-4 text-left text-sm font-medium outline-none focus-visible:ring-2\", className)}>{children}<span className=\"text-muted-foreground ml-3 flex transition-transform data-[panel-open]:rotate-180\" aria-hidden=\"true\"><IconChevronDown size={16} /></span></BaseAccordion.Trigger></BaseAccordion.Header>;\n}\n\nfunction AccordionContent({ className, ...props }: ComponentProps<typeof BaseAccordion.Panel>) {\n  return <BaseAccordion.Panel {...props} className={cn(\"text-muted-foreground overflow-hidden pb-4 text-sm\", className)} />;\n}\n\nexport const Accordion = Object.assign(AccordionRoot, {\n  Item: AccordionItem,\n  Trigger: AccordionTrigger,\n  Content: AccordionContent,\n});\n"],"mappings":";;;;;AAKA,IAAM,gBAAgBA,UAAc;AAEpC,SAAS,cAAc,EAAE,WAAW,GAAG,SAAoD;CACzF,OAAO,oBAACA,UAAc,MAAf;EAAoB,GAAI;EAAO,WAAW,GAAG,0BAA0B,SAAS;CAAI,CAAA;AAC7F;AAEA,SAAS,iBAAiB,EAAE,WAAW,UAAU,GAAG,SAAuD;CACzG,OAAO,oBAACA,UAAc,QAAf;EAAsB,WAAU;EAAO,UAAA,qBAACA,UAAc,SAAf;GAAuB,GAAI;GAAO,WAAW,GAAG,yJAAyJ,SAAS;GAAlN,UAAA,CAAsN,UAAS,oBAAC,QAAD;IAAM,WAAU;IAAoF,eAAY;IAAO,UAAA,oBAAC,iBAAD,EAAiB,MAAM,GAAK,CAAA;GAAO,CAAA,CAAwB;;CAAuB,CAAA;AACxd;AAEA,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAqD;CAC7F,OAAO,oBAACA,UAAc,OAAf;EAAqB,GAAI;EAAO,WAAW,GAAG,sDAAsD,SAAS;CAAI,CAAA;AAC1H;AAEA,IAAaC,cAAY,OAAO,OAAO,eAAe;CACpD,MAAM;CACN,SAAS;CACT,SAAS;AACX,CAAC"}

package/dist/{alert-D7lYqDGZ.js → alert-BQzMceKI.js}

@@ -12,7 +12,7 @@ var alertVariants = cva("rounded-ui-lg border p-4 text-sm", {
 	} },
 	defaultVariants: { variant: "default" }
 });
-var Alert = forwardRef(function Alert({ className, variant = "default", ...props }, ref) {
+var AlertRoot = forwardRef(function AlertRoot({ className, variant = "default", ...props }, ref) {
 	return /* @__PURE__ */ jsx("div", {
 		...props,
 		ref,
@@ -34,6 +34,10 @@ var AlertDescription = forwardRef(function AlertDescription({ className, ...prop
 		className: cn("text-sm opacity-90 [&_p]:leading-relaxed", className)
 	});
 });
-export { AlertDescription as n, AlertTitle as r, Alert as t };
+var Alert = Object.assign(AlertRoot, {
+	Title: AlertTitle,
+	Description: AlertDescription
+});
+export { Alert as t };
 
-//# sourceMappingURL=alert-D7lYqDGZ.js.map
+//# sourceMappingURL=alert-BQzMceKI.js.map

package/dist/alert-BQzMceKI.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-BQzMceKI.js","names":[],"sources":["../src/components/alert/alert.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\nimport { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { cn } from \"../../lib/cn\";\n\nconst alertVariants = cva(\"rounded-ui-lg border p-4 text-sm\", {\n  variants: {\n    variant: {\n      default: \"border-border bg-background text-foreground\",\n      danger: \"border-danger/40 bg-danger/10 text-foreground [&>svg]:text-danger\",\n      success: \"border-success-foreground/30 bg-success text-success-foreground\",\n      warning: \"border-warning-foreground/30 bg-warning text-warning-foreground\",\n    },\n  },\n  defaultVariants: { variant: \"default\" },\n});\n\nexport interface AlertProps extends ComponentPropsWithoutRef<\"div\">, VariantProps<typeof alertVariants> {}\n\nconst AlertRoot = forwardRef<HTMLDivElement, AlertProps>(function AlertRoot(\n  { className, variant = \"default\", ...props }, ref,\n) {\n  return <div {...props} ref={ref} role=\"alert\" className={cn(alertVariants({ variant }), className)} />;\n});\n\nconst AlertTitle = forwardRef<HTMLHeadingElement, ComponentPropsWithoutRef<\"h5\">>(\n  function AlertTitle({ className, ...props }, ref) {\n    return <h5 {...props} ref={ref} className={cn(\"mb-1 font-medium leading-none tracking-tight\", className)} />;\n  },\n);\n\nconst AlertDescription = forwardRef<HTMLParagraphElement, ComponentPropsWithoutRef<\"div\">>(\n  function AlertDescription({ className, ...props }, ref) {\n    return <div {...props} ref={ref} className={cn(\"text-sm opacity-90 [&_p]:leading-relaxed\", className)} />;\n  },\n);\n\nexport const Alert = Object.assign(AlertRoot, {\n  Title: AlertTitle,\n  Description: AlertDescription,\n});\n"],"mappings":";;;;;AAIA,IAAM,gBAAgB,IAAI,oCAAoC;CAC5D,UAAU,EACR,SAAS;EACP,SAAS;EACT,QAAQ;EACR,SAAS;EACT,SAAS;CACX,EACF;CACA,iBAAiB,EAAE,SAAS,UAAU;AACxC,CAAC;AAID,IAAM,YAAY,WAAuC,SAAS,UAChE,EAAE,WAAW,UAAU,WAAW,GAAG,SAAS,KAC9C;CACA,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAY;EAAK,MAAK;EAAQ,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;CAAI,CAAA;AACvG,CAAC;AAED,IAAM,aAAa,WACjB,SAAS,WAAW,EAAE,WAAW,GAAG,SAAS,KAAK;CAChD,OAAO,oBAAC,MAAD;EAAI,GAAI;EAAY;EAAK,WAAW,GAAG,gDAAgD,SAAS;CAAI,CAAA;AAC7G,CACF;AAEA,IAAM,mBAAmB,WACvB,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAS,KAAK;CACtD,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAY;EAAK,WAAW,GAAG,4CAA4C,SAAS;CAAI,CAAA;AAC1G,CACF;AAEA,IAAa,QAAQ,OAAO,OAAO,WAAW;CAC5C,OAAO;CACP,aAAa;AACf,CAAC"}

package/dist/{alert-dialog-BSyPkfNR.js → alert-dialog-_E4de7AY.js}

@@ -4,7 +4,7 @@ import { forwardRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { AlertDialog } from "@base-ui/react/alert-dialog";
 // src/components/alert-dialog/alert-dialog.tsx
-var AlertDialog$1 = AlertDialog.Root;
+var AlertDialogRoot = AlertDialog.Root;
 var AlertDialogTrigger = AlertDialog.Trigger;
 function AlertDialogContent({ className, children, ...props }) {
 	return /* @__PURE__ */ jsxs(AlertDialog.Portal, { children: [/* @__PURE__ */ jsx(AlertDialog.Backdrop, { className: "fixed inset-0 z-40 bg-black/45 transition-opacity data-ending-style:opacity-0 data-starting-style:opacity-0" }), /* @__PURE__ */ jsx(AlertDialog.Viewport, {
@@ -60,6 +60,16 @@ function AlertDialogCancel({ className, ...props }) {
 		}), className)
 	});
 }
-export { AlertDialogDescription as a, AlertDialogTitle as c, AlertDialogContent as i, AlertDialogTrigger as l, AlertDialogAction as n, AlertDialogFooter as o, AlertDialogCancel as r, AlertDialogHeader as s, AlertDialog$1 as t };
+var AlertDialog$1 = Object.assign(AlertDialogRoot, {
+	Trigger: AlertDialogTrigger,
+	Action: AlertDialogAction,
+	Cancel: AlertDialogCancel,
+	Content: AlertDialogContent,
+	Description: AlertDialogDescription,
+	Footer: AlertDialogFooter,
+	Header: AlertDialogHeader,
+	Title: AlertDialogTitle
+});
+export { AlertDialog$1 as t };
 
-//# sourceMappingURL=alert-dialog-BSyPkfNR.js.map
+//# sourceMappingURL=alert-dialog-_E4de7AY.js.map

package/dist/alert-dialog-_E4de7AY.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"alert-dialog-_E4de7AY.js","names":["BaseAlertDialog","AlertDialog"],"sources":["../src/components/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import { AlertDialog as BaseAlertDialog } from \"@base-ui/react/alert-dialog\";\nimport { type ComponentProps, type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { buttonVariants } from \"../button/button\";\nimport { cn } from \"../../lib/cn\";\n\nconst AlertDialogRoot = BaseAlertDialog.Root;\nconst AlertDialogTrigger = BaseAlertDialog.Trigger;\n\nfunction AlertDialogContent({ className, children, ...props }: ComponentProps<typeof BaseAlertDialog.Popup>) {\n  return (\n    <BaseAlertDialog.Portal>\n      <BaseAlertDialog.Backdrop className=\"fixed inset-0 z-40 bg-black/45 transition-opacity data-ending-style:opacity-0 data-starting-style:opacity-0\" />\n      <BaseAlertDialog.Viewport className=\"fixed inset-0 z-50 grid place-items-center overflow-y-auto p-4\">\n        <BaseAlertDialog.Popup\n          {...props}\n          className={cn(\n            \"rounded-ui-lg border-border bg-background text-foreground w-full max-w-md border p-6 shadow-[0_8px_30px_rgb(0,0,0,0.12)] outline-none transition-[transform,opacity] data-ending-style:scale-[0.98] data-ending-style:opacity-0 data-starting-style:scale-[0.98] data-starting-style:opacity-0\",\n            className,\n          )}\n        >\n          {children}\n        </BaseAlertDialog.Popup>\n      </BaseAlertDialog.Viewport>\n    </BaseAlertDialog.Portal>\n  );\n}\n\nfunction AlertDialogTitle({ className, ...props }: ComponentProps<typeof BaseAlertDialog.Title>) {\n  return <BaseAlertDialog.Title {...props} className={cn(\"text-foreground text-lg font-semibold tracking-tight\", className)} />;\n}\n\nfunction AlertDialogDescription({ className, ...props }: ComponentProps<typeof BaseAlertDialog.Description>) {\n  return <BaseAlertDialog.Description {...props} className={cn(\"text-muted-foreground mt-2 text-sm\", className)} />;\n}\n\nconst AlertDialogHeader = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<\"div\">>(\n  function AlertDialogHeader({ className, ...props }, ref) {\n    return <div {...props} ref={ref} className={cn(\"flex flex-col\", className)} />;\n  },\n);\n\nconst AlertDialogFooter = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<\"div\">>(\n  function AlertDialogFooter({ className, ...props }, ref) {\n    return <div {...props} ref={ref} className={cn(\"mt-6 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end\", className)} />;\n  },\n);\n\nexport interface AlertDialogActionProps extends ComponentProps<typeof BaseAlertDialog.Close> {\n  variant?: \"primary\" | \"danger\";\n}\n\nfunction AlertDialogAction({ className, variant = \"primary\", ...props }: AlertDialogActionProps) {\n  return <BaseAlertDialog.Close {...props} className={cn(buttonVariants({ variant, size: \"md\" }), className)} />;\n}\n\nfunction AlertDialogCancel({ className, ...props }: ComponentProps<typeof BaseAlertDialog.Close>) {\n  return <BaseAlertDialog.Close {...props} className={cn(buttonVariants({ variant: \"outline\", size: \"md\" }), className)} />;\n}\n\nexport const AlertDialog = Object.assign(AlertDialogRoot, {\n  Trigger: AlertDialogTrigger,\n  Action: AlertDialogAction,\n  Cancel: AlertDialogCancel,\n  Content: AlertDialogContent,\n  Description: AlertDialogDescription,\n  Footer: AlertDialogFooter,\n  Header: AlertDialogHeader,\n  Title: AlertDialogTitle,\n});\n"],"mappings":";;;;;;AAKA,IAAM,kBAAkBA,YAAgB;AACxC,IAAM,qBAAqBA,YAAgB;AAE3C,SAAS,mBAAmB,EAAE,WAAW,UAAU,GAAG,SAAuD;CAC3G,OACE,qBAACA,YAAgB,QAAjB,EAAA,UAAA,CACE,oBAACA,YAAgB,UAAjB,EAA0B,WAAU,8GAA+G,CAAA,GACnJ,oBAACA,YAAgB,UAAjB;EAA0B,WAAU;EAClC,UAAA,oBAACA,YAAgB,OAAjB;GACE,GAAI;GACJ,WAAW,GACT,kSACA,SACF;GAEC;EACoB,CAAA;CACC,CAAA,CACJ,EAAA,CAAA;AAE5B;AAEA,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAuD;CAC/F,OAAO,oBAACA,YAAgB,OAAjB;EAAuB,GAAI;EAAO,WAAW,GAAG,wDAAwD,SAAS;CAAI,CAAA;AAC9H;AAEA,SAAS,uBAAuB,EAAE,WAAW,GAAG,SAA6D;CAC3G,OAAO,oBAACA,YAAgB,aAAjB;EAA6B,GAAI;EAAO,WAAW,GAAG,sCAAsC,SAAS;CAAI,CAAA;AAClH;AAEA,IAAM,oBAAoB,WACxB,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAS,KAAK;CACvD,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAY;EAAK,WAAW,GAAG,iBAAiB,SAAS;CAAI,CAAA;AAC/E,CACF;AAEA,IAAM,oBAAoB,WACxB,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAS,KAAK;CACvD,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAY;EAAK,WAAW,GAAG,+DAA+D,SAAS;CAAI,CAAA;AAC7H,CACF;AAMA,SAAS,kBAAkB,EAAE,WAAW,UAAU,WAAW,GAAG,SAAiC;CAC/F,OAAO,oBAACA,YAAgB,OAAjB;EAAuB,GAAI;EAAO,WAAW,GAAG,eAAe;GAAE;GAAS,MAAM;EAAK,CAAC,GAAG,SAAS;CAAI,CAAA;AAC/G;AAEA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAuD;CAChG,OAAO,oBAACA,YAAgB,OAAjB;EAAuB,GAAI;EAAO,WAAW,GAAG,eAAe;GAAE,SAAS;GAAW,MAAM;EAAK,CAAC,GAAG,SAAS;CAAI,CAAA;AAC1H;AAEA,IAAaC,gBAAc,OAAO,OAAO,iBAAiB;CACxD,SAAS;CACT,QAAQ;CACR,QAAQ;CACR,SAAS;CACT,aAAa;CACb,QAAQ;CACR,QAAQ;CACR,OAAO;AACT,CAAC"}

package/dist/{autocomplete-D_OafKFC.js → autocomplete-CVD8GTVR.js}

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { IconX } from "@tabler/icons-react";
 import { Autocomplete } from "@base-ui/react/autocomplete";
 // src/components/autocomplete/autocomplete.tsx
-var Autocomplete$1 = Autocomplete.Root;
+var AutocompleteRoot = Autocomplete.Root;
 function AutocompleteInputGroup({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Autocomplete.InputGroup, {
 		...props,
@@ -50,6 +50,13 @@ function AutocompleteItem({ className, ...props }) {
 		className: cn("data-highlighted:bg-muted rounded-ui-sm flex cursor-default items-center px-2 py-1.5 text-sm outline-none select-none data-disabled:opacity-50", className)
 	});
 }
-export { AutocompleteInputGroup as a, AutocompleteInput as i, AutocompleteClear as n, AutocompleteItem as o, AutocompleteContent as r, Autocomplete$1 as t };
+var Autocomplete$1 = Object.assign(AutocompleteRoot, {
+	InputGroup: AutocompleteInputGroup,
+	Input: AutocompleteInput,
+	Content: AutocompleteContent,
+	Item: AutocompleteItem,
+	Clear: AutocompleteClear
+});
+export { Autocomplete$1 as t };
 
-//# sourceMappingURL=autocomplete-D_OafKFC.js.map
+//# sourceMappingURL=autocomplete-CVD8GTVR.js.map

package/dist/autocomplete-CVD8GTVR.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete-CVD8GTVR.js","names":["BaseAutocomplete","Autocomplete"],"sources":["../src/components/autocomplete/autocomplete.tsx"],"sourcesContent":["import { Autocomplete as BaseAutocomplete } from \"@base-ui/react/autocomplete\";\nimport { IconX } from \"@tabler/icons-react\";\nimport type { ComponentProps } from \"react\";\nimport { cn } from \"../../lib/cn\";\n\nconst AutocompleteRoot = BaseAutocomplete.Root;\n\nfunction AutocompleteInputGroup({ className, ...props }: ComponentProps<typeof BaseAutocomplete.InputGroup>) {\n  return <BaseAutocomplete.InputGroup {...props} className={cn(\"rounded-ui-md border-border bg-background focus-within:border-ring focus-within:ring-ring/40 relative flex h-10 w-full items-center border focus-within:ring-2\", className)} />;\n}\n\nfunction AutocompleteInput({ className, ...props }: ComponentProps<typeof BaseAutocomplete.Input>) {\n  return <BaseAutocomplete.Input {...props} className={cn(\"text-foreground placeholder:text-muted-foreground h-full min-w-0 flex-1 bg-transparent px-3 text-sm outline-none\", className)} />;\n}\n\nfunction AutocompleteClear({ className, ...props }: ComponentProps<typeof BaseAutocomplete.Clear>) {\n  return <BaseAutocomplete.Clear {...props} aria-label=\"Clear input\" className={cn(\"text-muted-foreground hover:text-foreground flex h-full w-8 items-center justify-center text-sm\", className)}><IconX size={16} aria-hidden=\"true\" /></BaseAutocomplete.Clear>;\n}\n\nfunction AutocompleteContent({ className, children, ...props }: ComponentProps<typeof BaseAutocomplete.Popup>) {\n  return (\n    <BaseAutocomplete.Portal>\n      <BaseAutocomplete.Positioner sideOffset={4} className=\"z-50 outline-none\">\n        <BaseAutocomplete.Popup {...props} className={cn(\"rounded-ui-lg border-border bg-background text-foreground min-w-[var(--anchor-width)] overflow-hidden border p-1 shadow-[0_8px_30px_rgb(0,0,0,0.12)] outline-none\", className)}>\n          <BaseAutocomplete.Empty className=\"text-muted-foreground px-2 py-3 text-sm\">No results found.</BaseAutocomplete.Empty>\n          <BaseAutocomplete.List className=\"max-h-64 overflow-y-auto overscroll-contain outline-none data-empty:p-0\">{children}</BaseAutocomplete.List>\n        </BaseAutocomplete.Popup>\n      </BaseAutocomplete.Positioner>\n    </BaseAutocomplete.Portal>\n  );\n}\n\nfunction AutocompleteItem({ className, ...props }: ComponentProps<typeof BaseAutocomplete.Item>) {\n  return <BaseAutocomplete.Item {...props} className={cn(\"data-highlighted:bg-muted rounded-ui-sm flex cursor-default items-center px-2 py-1.5 text-sm outline-none select-none data-disabled:opacity-50\", className)} />;\n}\n\nexport const Autocomplete = Object.assign(AutocompleteRoot, {\n  InputGroup: AutocompleteInputGroup,\n  Input: AutocompleteInput,\n  Content: AutocompleteContent,\n  Item: AutocompleteItem,\n  Clear: AutocompleteClear,\n});\n"],"mappings":";;;;;AAKA,IAAM,mBAAmBA,aAAiB;AAE1C,SAAS,uBAAuB,EAAE,WAAW,GAAG,SAA6D;CAC3G,OAAO,oBAACA,aAAiB,YAAlB;EAA6B,GAAI;EAAO,WAAW,GAAG,kKAAkK,SAAS;CAAI,CAAA;AAC9O;AAEA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAwD;CACjG,OAAO,oBAACA,aAAiB,OAAlB;EAAwB,GAAI;EAAO,WAAW,GAAG,oHAAoH,SAAS;CAAI,CAAA;AAC3L;AAEA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAwD;CACjG,OAAO,oBAACA,aAAiB,OAAlB;EAAwB,GAAI;EAAO,cAAW;EAAc,WAAW,GAAG,mGAAmG,SAAS;EAAG,UAAA,oBAAC,OAAD;GAAO,MAAM;GAAI,eAAY;EAAQ,CAAA;CAAyB,CAAA;AAChQ;AAEA,SAAS,oBAAoB,EAAE,WAAW,UAAU,GAAG,SAAwD;CAC7G,OACE,oBAACA,aAAiB,QAAlB,EAAA,UACE,oBAACA,aAAiB,YAAlB;EAA6B,YAAY;EAAG,WAAU;EACpD,UAAA,qBAACA,aAAiB,OAAlB;GAAwB,GAAI;GAAO,WAAW,GAAG,qKAAqK,SAAS;GAA/N,UAAA,CACE,oBAACA,aAAiB,OAAlB;IAAwB,WAAU;IAA0C,UAAA;GAAyC,CAAA,GACrH,oBAACA,aAAiB,MAAlB;IAAuB,WAAU;IAA2E;GAAgC,CAAA,CACtH;;CACG,CAAA,EACN,CAAA;AAE7B;AAEA,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAuD;CAC/F,OAAO,oBAACA,aAAiB,MAAlB;EAAuB,GAAI;EAAO,WAAW,GAAG,kJAAkJ,SAAS;CAAI,CAAA;AACxN;AAEA,IAAaC,iBAAe,OAAO,OAAO,kBAAkB;CAC1D,YAAY;CACZ,OAAO;CACP,SAAS;CACT,MAAM;CACN,OAAO;AACT,CAAC"}

package/dist/{avatar-CgtyIpnX.js → avatar-1d_t2tas.js}

@@ -3,7 +3,7 @@ import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 import { Avatar } from "@base-ui/react/avatar";
 // src/components/avatar/avatar.tsx
-var Avatar$1 = Avatar.Root;
+var AvatarRoot = Avatar.Root;
 function AvatarImage({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Avatar.Image, {
 		...props,
@@ -16,8 +16,12 @@ function AvatarFallback({ className, ...props }) {
 		className: cn("bg-muted text-muted-foreground flex size-full items-center justify-center rounded-full text-xs font-medium", className)
 	});
 }
+var Avatar$1 = Object.assign(AvatarRoot, {
+	Fallback: AvatarFallback,
+	Image: AvatarImage
+});
 // src/components/avatar/avatar-group.tsx
-var AvatarGroup = forwardRef(function AvatarGroup({ className, role = "group", ...props }, ref) {
+var AvatarGroupRoot = forwardRef(function AvatarGroupRoot({ className, role = "group", ...props }, ref) {
 	return /* @__PURE__ */ jsx("div", {
 		...props,
 		ref,
@@ -32,6 +36,7 @@ var AvatarGroupCount = forwardRef(function AvatarGroupCount({ className, ...prop
 		className: cn("bg-muted text-muted-foreground inline-flex size-10 shrink-0 items-center justify-center rounded-full text-xs font-medium", className)
 	});
 });
-export { AvatarImage as a, AvatarFallback as i, AvatarGroupCount as n, Avatar$1 as r, AvatarGroup as t };
+var AvatarGroup = Object.assign(AvatarGroupRoot, { Count: AvatarGroupCount });
+export { Avatar$1 as n, AvatarGroup as t };
 
-//# sourceMappingURL=avatar-CgtyIpnX.js.map
+//# sourceMappingURL=avatar-1d_t2tas.js.map

package/dist/avatar-1d_t2tas.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatar-1d_t2tas.js","names":["BaseAvatar","Avatar"],"sources":["../src/components/avatar/avatar.tsx","../src/components/avatar/avatar-group.tsx"],"sourcesContent":["import { Avatar as BaseAvatar } from \"@base-ui/react/avatar\";\nimport type { ComponentProps } from \"react\";\nimport { cn } from \"../../lib/cn\";\n\nconst AvatarRoot = BaseAvatar.Root;\n\nfunction AvatarImage({ className, ...props }: ComponentProps<typeof BaseAvatar.Image>) {\n  return <BaseAvatar.Image {...props} className={cn(\"aspect-square size-full object-cover\", className)} />;\n}\n\nfunction AvatarFallback({ className, ...props }: ComponentProps<typeof BaseAvatar.Fallback>) {\n  return <BaseAvatar.Fallback {...props} className={cn(\"bg-muted text-muted-foreground flex size-full items-center justify-center rounded-full text-xs font-medium\", className)} />;\n}\n\nexport const Avatar = Object.assign(AvatarRoot, { Fallback: AvatarFallback, Image: AvatarImage });\n","import { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { cn } from \"../../lib/cn\";\n\nconst AvatarGroupRoot = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<\"div\">>(\n  function AvatarGroupRoot({ className, role = \"group\", ...props }, ref) {\n    return (\n      <div\n        {...props}\n        ref={ref}\n        role={role}\n        className={cn(\"flex w-fit items-center -space-x-3 [&>*]:ring-2 [&>*]:ring-background\", className)}\n      />\n    );\n  },\n);\n\nconst AvatarGroupCount = forwardRef<HTMLSpanElement, ComponentPropsWithoutRef<\"span\">>(\n  function AvatarGroupCount({ className, ...props }, ref) {\n    return (\n      <span\n        {...props}\n        ref={ref}\n        className={cn(\"bg-muted text-muted-foreground inline-flex size-10 shrink-0 items-center justify-center rounded-full text-xs font-medium\", className)}\n      />\n    );\n  },\n);\n\nexport const AvatarGroup = Object.assign(AvatarGroupRoot, { Count: AvatarGroupCount });\n"],"mappings":";;;;;AAIA,IAAM,aAAaA,OAAW;AAE9B,SAAS,YAAY,EAAE,WAAW,GAAG,SAAkD;CACrF,OAAO,oBAACA,OAAW,OAAZ;EAAkB,GAAI;EAAO,WAAW,GAAG,wCAAwC,SAAS;CAAI,CAAA;AACzG;AAEA,SAAS,eAAe,EAAE,WAAW,GAAG,SAAqD;CAC3F,OAAO,oBAACA,OAAW,UAAZ;EAAqB,GAAI;EAAO,WAAW,GAAG,8GAA8G,SAAS;CAAI,CAAA;AAClL;AAEA,IAAaC,WAAS,OAAO,OAAO,YAAY;CAAE,UAAU;CAAgB,OAAO;AAAY,CAAC;;ACXhG,IAAM,kBAAkB,WACtB,SAAS,gBAAgB,EAAE,WAAW,OAAO,SAAS,GAAG,SAAS,KAAK;CACrE,OACE,oBAAC,OAAD;EACE,GAAI;EACC;EACC;EACN,WAAW,GAAG,yEAAyE,SAAS;CACjG,CAAA;AAEL,CACF;AAEA,IAAM,mBAAmB,WACvB,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAS,KAAK;CACtD,OACE,oBAAC,QAAD;EACE,GAAI;EACC;EACL,WAAW,GAAG,4HAA4H,SAAS;CACpJ,CAAA;AAEL,CACF;AAEA,IAAa,cAAc,OAAO,OAAO,iBAAiB,EAAE,OAAO,iBAAiB,CAAC"}

package/dist/{breadcrumb-ieuPHz2w.js → breadcrumb-BGVDD5TT.js}

@@ -2,7 +2,7 @@ import { t as cn } from "./cn-Ccwc28Yd.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 // src/components/breadcrumb/breadcrumb.tsx
-function Breadcrumb({ ...props }) {
+function BreadcrumbRoot({ ...props }) {
 	return /* @__PURE__ */ jsx("nav", {
 		"aria-label": "breadcrumb",
 		...props
@@ -45,6 +45,13 @@ function BreadcrumbSeparator({ className, children = "/", ...props }) {
 		children
 	});
 }
-export { BreadcrumbPage as a, BreadcrumbList as i, BreadcrumbItem as n, BreadcrumbSeparator as o, BreadcrumbLink as r, Breadcrumb as t };
+var Breadcrumb = Object.assign(BreadcrumbRoot, {
+	Item: BreadcrumbItem,
+	Link: BreadcrumbLink,
+	List: BreadcrumbList,
+	Page: BreadcrumbPage,
+	Separator: BreadcrumbSeparator
+});
+export { Breadcrumb as t };
 
-//# sourceMappingURL=breadcrumb-ieuPHz2w.js.map
+//# sourceMappingURL=breadcrumb-BGVDD5TT.js.map

package/dist/breadcrumb-BGVDD5TT.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb-BGVDD5TT.js","names":[],"sources":["../src/components/breadcrumb/breadcrumb.tsx"],"sourcesContent":["import { type ComponentPropsWithoutRef, forwardRef } from \"react\";\nimport { cn } from \"../../lib/cn\";\n\nfunction BreadcrumbRoot({ ...props }: ComponentPropsWithoutRef<\"nav\">) {\n  return <nav aria-label=\"breadcrumb\" {...props} />;\n}\n\nconst BreadcrumbList = forwardRef<HTMLOListElement, ComponentPropsWithoutRef<\"ol\">>(\n  function BreadcrumbList({ className, ...props }, ref) {\n    return <ol {...props} ref={ref} className={cn(\"text-muted-foreground flex flex-wrap items-center gap-2 text-sm\", className)} />;\n  },\n);\n\nconst BreadcrumbItem = forwardRef<HTMLLIElement, ComponentPropsWithoutRef<\"li\">>(\n  function BreadcrumbItem({ className, ...props }, ref) {\n    return <li {...props} ref={ref} className={cn(\"inline-flex items-center gap-2\", className)} />;\n  },\n);\n\nconst BreadcrumbLink = forwardRef<HTMLAnchorElement, ComponentPropsWithoutRef<\"a\">>(\n  function BreadcrumbLink({ className, ...props }, ref) {\n    return <a {...props} ref={ref} className={cn(\"hover:text-foreground transition-colors\", className)} />;\n  },\n);\n\nconst BreadcrumbPage = forwardRef<HTMLSpanElement, ComponentPropsWithoutRef<\"span\">>(\n  function BreadcrumbPage({ className, ...props }, ref) {\n    return <span {...props} ref={ref} aria-current=\"page\" className={cn(\"text-foreground font-normal\", className)} />;\n  },\n);\n\nfunction BreadcrumbSeparator({ className, children = \"/\", ...props }: ComponentPropsWithoutRef<\"li\">) {\n  return <li {...props} aria-hidden=\"true\" className={cn(\"text-muted-foreground [&>svg]:size-3.5\", className)}>{children}</li>;\n}\n\nexport const Breadcrumb = Object.assign(BreadcrumbRoot, {\n  Item: BreadcrumbItem,\n  Link: BreadcrumbLink,\n  List: BreadcrumbList,\n  Page: BreadcrumbPage,\n  Separator: BreadcrumbSeparator,\n});\n"],"mappings":";;;;AAGA,SAAS,eAAe,EAAE,GAAG,SAA0C;CACrE,OAAO,oBAAC,OAAD;EAAK,cAAW;EAAa,GAAI;CAAQ,CAAA;AAClD;AAEA,IAAM,iBAAiB,WACrB,SAAS,eAAe,EAAE,WAAW,GAAG,SAAS,KAAK;CACpD,OAAO,oBAAC,MAAD;EAAI,GAAI;EAAY;EAAK,WAAW,GAAG,mEAAmE,SAAS;CAAI,CAAA;AAChI,CACF;AAEA,IAAM,iBAAiB,WACrB,SAAS,eAAe,EAAE,WAAW,GAAG,SAAS,KAAK;CACpD,OAAO,oBAAC,MAAD;EAAI,GAAI;EAAY;EAAK,WAAW,GAAG,kCAAkC,SAAS;CAAI,CAAA;AAC/F,CACF;AAEA,IAAM,iBAAiB,WACrB,SAAS,eAAe,EAAE,WAAW,GAAG,SAAS,KAAK;CACpD,OAAO,oBAAC,KAAD;EAAG,GAAI;EAAY;EAAK,WAAW,GAAG,2CAA2C,SAAS;CAAI,CAAA;AACvG,CACF;AAEA,IAAM,iBAAiB,WACrB,SAAS,eAAe,EAAE,WAAW,GAAG,SAAS,KAAK;CACpD,OAAO,oBAAC,QAAD;EAAM,GAAI;EAAY;EAAK,gBAAa;EAAO,WAAW,GAAG,+BAA+B,SAAS;CAAI,CAAA;AAClH,CACF;AAEA,SAAS,oBAAoB,EAAE,WAAW,WAAW,KAAK,GAAG,SAAyC;CACpG,OAAO,oBAAC,MAAD;EAAI,GAAI;EAAO,eAAY;EAAO,WAAW,GAAG,0CAA0C,SAAS;EAAI;CAAa,CAAA;AAC7H;AAEA,IAAa,aAAa,OAAO,OAAO,gBAAgB;CACtD,MAAM;CACN,MAAM;CACN,MAAM;CACN,MAAM;CACN,WAAW;AACb,CAAC"}

package/dist/{collapsible-CaAEi_w7.js → collapsible-odw6ynaJ.js}

@@ -2,7 +2,7 @@ import { t as cn } from "./cn-Ccwc28Yd.js";
 import { jsx } from "react/jsx-runtime";
 import { Collapsible } from "@base-ui/react/collapsible";
 // src/components/collapsible/collapsible.tsx
-var Collapsible$1 = Collapsible.Root;
+var CollapsibleRoot = Collapsible.Root;
 function CollapsibleTrigger({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Collapsible.Trigger, {
 		...props,
@@ -15,6 +15,10 @@ function CollapsibleContent({ className, ...props }) {
 		className: cn("overflow-hidden", className)
 	});
 }
-export { CollapsibleContent as n, CollapsibleTrigger as r, Collapsible$1 as t };
+var Collapsible$1 = Object.assign(CollapsibleRoot, {
+	Trigger: CollapsibleTrigger,
+	Content: CollapsibleContent
+});
+export { Collapsible$1 as t };
 
-//# sourceMappingURL=collapsible-CaAEi_w7.js.map
+//# sourceMappingURL=collapsible-odw6ynaJ.js.map

package/dist/collapsible-odw6ynaJ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible-odw6ynaJ.js","names":["BaseCollapsible","Collapsible"],"sources":["../src/components/collapsible/collapsible.tsx"],"sourcesContent":["import { Collapsible as BaseCollapsible } from \"@base-ui/react/collapsible\";\nimport type { ComponentProps } from \"react\";\nimport { cn } from \"../../lib/cn\";\n\nconst CollapsibleRoot = BaseCollapsible.Root;\n\nfunction CollapsibleTrigger({ className, ...props }: ComponentProps<typeof BaseCollapsible.Trigger>) {\n  return <BaseCollapsible.Trigger {...props} className={cn(\"text-foreground focus-visible:ring-ring inline-flex items-center gap-2 text-sm font-medium outline-none focus-visible:ring-2\", className)} />;\n}\n\nfunction CollapsibleContent({ className, ...props }: ComponentProps<typeof BaseCollapsible.Panel>) {\n  return <BaseCollapsible.Panel {...props} className={cn(\"overflow-hidden\", className)} />;\n}\n\nexport const Collapsible = Object.assign(CollapsibleRoot, {\n  Trigger: CollapsibleTrigger,\n  Content: CollapsibleContent,\n});\n"],"mappings":";;;;AAIA,IAAM,kBAAkBA,YAAgB;AAExC,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAyD;CACnG,OAAO,oBAACA,YAAgB,SAAjB;EAAyB,GAAI;EAAO,WAAW,GAAG,gIAAgI,SAAS;CAAI,CAAA;AACxM;AAEA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAuD;CACjG,OAAO,oBAACA,YAAgB,OAAjB;EAAuB,GAAI;EAAO,WAAW,GAAG,mBAAmB,SAAS;CAAI,CAAA;AACzF;AAEA,IAAaC,gBAAc,OAAO,OAAO,iBAAiB;CACxD,SAAS;CACT,SAAS;AACX,CAAC"}

package/dist/{combobox-CDRnBR2S.js → combobox-BjSMdUz_.js}

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { IconCheck, IconChevronDown, IconX } from "@tabler/icons-react";
 import { Combobox } from "@base-ui/react/combobox";
 // src/components/combobox/combobox.tsx
-var Combobox$1 = Combobox.Root;
+var ComboboxRoot = Combobox.Root;
 var ComboboxLabel = Combobox.Label;
 var ComboboxValue = Combobox.Value;
 var ComboboxGroup = Combobox.Group;
@@ -79,6 +79,20 @@ function ComboboxItem({ className, children, ...props }) {
 		})]
 	});
 }
-export { ComboboxGroupLabel as a, ComboboxItem as c, ComboboxSeparator as d, ComboboxTrigger as f, ComboboxGroup as i, ComboboxItemIndicator as l, ComboboxClear as n, ComboboxInput as o, ComboboxValue as p, ComboboxContent as r, ComboboxInputGroup as s, Combobox$1 as t, ComboboxLabel as u };
+var Combobox$1 = Object.assign(ComboboxRoot, {
+	Trigger: ComboboxTrigger,
+	Value: ComboboxValue,
+	Input: ComboboxInput,
+	InputGroup: ComboboxInputGroup,
+	Content: ComboboxContent,
+	Group: ComboboxGroup,
+	GroupLabel: ComboboxGroupLabel,
+	Item: ComboboxItem,
+	ItemIndicator: ComboboxItemIndicator,
+	Label: ComboboxLabel,
+	Separator: ComboboxSeparator,
+	Clear: ComboboxClear
+});
+export { Combobox$1 as t };
 
-//# sourceMappingURL=combobox-CDRnBR2S.js.map
+//# sourceMappingURL=combobox-BjSMdUz_.js.map

package/dist/combobox-BjSMdUz_.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-BjSMdUz_.js","names":["BaseCombobox","Combobox"],"sources":["../src/components/combobox/combobox.tsx"],"sourcesContent":["import { Combobox as BaseCombobox } from \"@base-ui/react/combobox\";\nimport { IconCheck, IconChevronDown, IconX } from \"@tabler/icons-react\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { cn } from \"../../lib/cn\";\n\nconst ComboboxRoot = BaseCombobox.Root;\nconst ComboboxLabel = BaseCombobox.Label;\nconst ComboboxValue = BaseCombobox.Value;\nconst ComboboxGroup = BaseCombobox.Group;\nconst ComboboxItemIndicator = BaseCombobox.ItemIndicator;\nconst ComboboxSeparator = BaseCombobox.Separator;\n\nfunction ComboboxInputGroup({ className, ...props }: ComponentProps<typeof BaseCombobox.InputGroup>) {\n  return (\n    <BaseCombobox.InputGroup\n      {...props}\n      className={cn(\n        \"rounded-ui-md border-border bg-background focus-within:border-ring focus-within:ring-ring/40 relative flex h-10 w-full items-center border outline-none focus-within:ring-2\",\n        className,\n      )}\n    />\n  );\n}\n\nfunction ComboboxInput({ className, ...props }: ComponentProps<typeof BaseCombobox.Input>) {\n  return (\n    <BaseCombobox.Input\n      {...props}\n      className={cn(\"text-foreground placeholder:text-muted-foreground h-full min-w-0 flex-1 bg-transparent px-3 text-sm outline-none\", className)}\n    />\n  );\n}\n\nfunction ComboboxClear({ className, ...props }: ComponentProps<typeof BaseCombobox.Clear>) {\n  return (\n    <BaseCombobox.Clear\n      {...props}\n      aria-label=\"Clear selection\"\n      className={cn(\"text-muted-foreground hover:text-foreground flex h-full w-8 shrink-0 items-center justify-center text-sm outline-none\", className)}\n    >\n      <IconX size={16} aria-hidden=\"true\" />\n    </BaseCombobox.Clear>\n  );\n}\n\nfunction ComboboxTrigger({ className, ...props }: ComponentProps<typeof BaseCombobox.Trigger>) {\n  return (\n    <BaseCombobox.Trigger\n      {...props}\n      aria-label=\"Open options\"\n      className={cn(\"text-muted-foreground hover:text-foreground flex h-full w-8 shrink-0 items-center justify-center text-sm outline-none\", className)}\n    >\n      <IconChevronDown size={16} aria-hidden=\"true\" />\n    </BaseCombobox.Trigger>\n  );\n}\n\nexport interface ComboboxContentProps extends Omit<ComponentProps<typeof BaseCombobox.Popup>, \"children\"> {\n  children?: ComponentProps<typeof BaseCombobox.List>[\"children\"];\n  empty?: ReactNode;\n  listClassName?: string;\n}\n\nfunction ComboboxContent({ className, children, empty = \"No results found.\", listClassName, ...props }: ComboboxContentProps) {\n  return (\n    <BaseCombobox.Portal>\n      <BaseCombobox.Positioner sideOffset={4} className=\"outline-none\">\n        <BaseCombobox.Popup\n          {...props}\n          className={cn(\n            \"rounded-ui-lg border-border bg-background text-foreground max-h-72 min-w-[var(--anchor-width)] overflow-hidden border p-1 shadow-[0_8px_30px_rgb(0,0,0,0.12)] outline-none data-ending-style:scale-[0.98] data-ending-style:opacity-0 data-starting-style:scale-[0.98] data-starting-style:opacity-0\",\n            className,\n          )}\n        >\n          <BaseCombobox.Empty className=\"text-muted-foreground px-2 py-3 text-sm\">{empty}</BaseCombobox.Empty>\n          <BaseCombobox.List className={cn(\"max-h-64 overflow-y-auto overscroll-contain outline-none data-empty:p-0\", listClassName)}>\n            {children}\n          </BaseCombobox.List>\n        </BaseCombobox.Popup>\n      </BaseCombobox.Positioner>\n    </BaseCombobox.Portal>\n  );\n}\n\nfunction ComboboxGroupLabel({ className, ...props }: ComponentProps<typeof BaseCombobox.GroupLabel>) {\n  return <BaseCombobox.GroupLabel {...props} className={cn(\"text-muted-foreground px-2 py-1.5 text-xs font-medium\", className)} />;\n}\n\nfunction ComboboxItem({ className, children, ...props }: ComponentProps<typeof BaseCombobox.Item>) {\n  return (\n    <BaseCombobox.Item\n      {...props}\n      className={cn(\n        \"data-highlighted:bg-muted rounded-ui-sm relative flex cursor-default items-center gap-2 py-1.5 pr-8 pl-2 text-sm outline-none select-none data-disabled:pointer-events-none data-disabled:opacity-50\",\n        className,\n      )}\n    >\n      {children}\n      <BaseCombobox.ItemIndicator className=\"absolute right-2 flex\"><IconCheck size={16} aria-hidden=\"true\" /></BaseCombobox.ItemIndicator>\n    </BaseCombobox.Item>\n  );\n}\n\nexport const Combobox = Object.assign(ComboboxRoot, {\n  Trigger: ComboboxTrigger,\n  Value: ComboboxValue,\n  Input: ComboboxInput,\n  InputGroup: ComboboxInputGroup,\n  Content: ComboboxContent,\n  Group: ComboboxGroup,\n  GroupLabel: ComboboxGroupLabel,\n  Item: ComboboxItem,\n  ItemIndicator: ComboboxItemIndicator,\n  Label: ComboboxLabel,\n  Separator: ComboboxSeparator,\n  Clear: ComboboxClear,\n});\n"],"mappings":";;;;;AAKA,IAAM,eAAeA,SAAa;AAClC,IAAM,gBAAgBA,SAAa;AACnC,IAAM,gBAAgBA,SAAa;AACnC,IAAM,gBAAgBA,SAAa;AACnC,IAAM,wBAAwBA,SAAa;AAC3C,IAAM,oBAAoBA,SAAa;AAEvC,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAyD;CACnG,OACE,oBAACA,SAAa,YAAd;EACE,GAAI;EACJ,WAAW,GACT,+KACA,SACF;CACD,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAoD;CACzF,OACE,oBAACA,SAAa,OAAd;EACE,GAAI;EACJ,WAAW,GAAG,oHAAoH,SAAS;CAC5I,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAoD;CACzF,OACE,oBAACA,SAAa,OAAd;EACE,GAAI;EACJ,cAAW;EACX,WAAW,GAAG,yHAAyH,SAAS;EAEhJ,UAAA,oBAAC,OAAD;GAAO,MAAM;GAAI,eAAY;EAAQ,CAAA;CACnB,CAAA;AAExB;AAEA,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAsD;CAC7F,OACE,oBAACA,SAAa,SAAd;EACE,GAAI;EACJ,cAAW;EACX,WAAW,GAAG,yHAAyH,SAAS;EAEhJ,UAAA,oBAAC,iBAAD;GAAiB,MAAM;GAAI,eAAY;EAAQ,CAAA;CAC3B,CAAA;AAE1B;AAQA,SAAS,gBAAgB,EAAE,WAAW,UAAU,QAAQ,qBAAqB,eAAe,GAAG,SAA+B;CAC5H,OACE,oBAACA,SAAa,QAAd,EAAA,UACE,oBAACA,SAAa,YAAd;EAAyB,YAAY;EAAG,WAAU;EAChD,UAAA,qBAACA,SAAa,OAAd;GACE,GAAI;GACJ,WAAW,GACT,wSACA,SACF;GALF,UAAA,CAOE,oBAACA,SAAa,OAAd;IAAoB,WAAU;IAA2C,UAAA;GAA0B,CAAA,GACnG,oBAACA,SAAa,MAAd;IAAmB,WAAW,GAAG,2EAA2E,aAAa;IACtH;GACgB,CAAA,CACD;;CACG,CAAA,EACN,CAAA;AAEzB;AAEA,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAyD;CACnG,OAAO,oBAACA,SAAa,YAAd;EAAyB,GAAI;EAAO,WAAW,GAAG,yDAAyD,SAAS;CAAI,CAAA;AACjI;AAEA,SAAS,aAAa,EAAE,WAAW,UAAU,GAAG,SAAmD;CACjG,OACE,qBAACA,SAAa,MAAd;EACE,GAAI;EACJ,WAAW,GACT,wMACA,SACF;EALF,UAAA,CAOG,UACD,oBAACA,SAAa,eAAd;GAA4B,WAAU;GAAwB,UAAA,oBAAC,WAAD;IAAW,MAAM;IAAI,eAAY;GAAQ,CAAA;EAA6B,CAAA,CACnH;;AAEvB;AAEA,IAAaC,aAAW,OAAO,OAAO,cAAc;CAClD,SAAS;CACT,OAAO;CACP,OAAO;CACP,YAAY;CACZ,SAAS;CACT,OAAO;CACP,YAAY;CACZ,MAAM;CACN,eAAe;CACf,OAAO;CACP,WAAW;CACX,OAAO;AACT,CAAC"}

package/dist/components/accordion/accordion.d.ts

@@ -1,6 +1,11 @@
 import { Accordion as BaseAccordion } from '@base-ui/react/accordion';
 import { ComponentProps } from 'react';
-export declare const Accordion: <Value = any>(props: BaseAccordion.Root.Props<Value>) => React.JSX.Element;
-export declare function AccordionItem({ className, ...props }: ComponentProps<typeof BaseAccordion.Item>): import('react').JSX.Element;
-export declare function AccordionTrigger({ className, children, ...props }: ComponentProps<typeof BaseAccordion.Trigger>): import('react').JSX.Element;
-export declare function AccordionContent({ className, ...props }: ComponentProps<typeof BaseAccordion.Panel>): import('react').JSX.Element;
+declare function AccordionItem({ className, ...props }: ComponentProps<typeof BaseAccordion.Item>): import('react').JSX.Element;
+declare function AccordionTrigger({ className, children, ...props }: ComponentProps<typeof BaseAccordion.Trigger>): import('react').JSX.Element;
+declare function AccordionContent({ className, ...props }: ComponentProps<typeof BaseAccordion.Panel>): import('react').JSX.Element;
+export declare const Accordion: (<Value = any>(props: BaseAccordion.Root.Props<Value>) => React.JSX.Element) & {
+    Item: typeof AccordionItem;
+    Trigger: typeof AccordionTrigger;
+    Content: typeof AccordionContent;
+};
+export {};

package/dist/components/accordion/index.d.ts

@@ -1 +1 @@
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from './accordion';
+export { Accordion } from './accordion';

package/dist/components/accordion/index.js

@@ -1 +1 @@
-export { t as Accordion, n as AccordionContent, r as AccordionItem, i as AccordionTrigger } from "../../accordion-Da0Y5c3W.js";
+export { t as Accordion } from "../../accordion-nzbtc3_2.js";

package/dist/components/alert/alert.d.ts

@@ -5,7 +5,8 @@ declare const alertVariants: (props?: ({
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface AlertProps extends ComponentPropsWithoutRef<"div">, VariantProps<typeof alertVariants> {
 }
-export declare const Alert: import('react').ForwardRefExoticComponent<AlertProps & import('react').RefAttributes<HTMLDivElement>>;
-export declare const AlertTitle: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & import('react').RefAttributes<HTMLHeadingElement>>;
-export declare const AlertDescription: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLParagraphElement>>;
+export declare const Alert: import('react').ForwardRefExoticComponent<AlertProps & import('react').RefAttributes<HTMLDivElement>> & {
+    Title: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & import('react').RefAttributes<HTMLHeadingElement>>;
+    Description: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLParagraphElement>>;
+};
 export {};

package/dist/components/alert/index.d.ts

@@ -1,2 +1,2 @@
 export type { AlertProps } from './alert';
-export { Alert, AlertDescription, AlertTitle } from './alert';
+export { Alert } from './alert';

package/dist/components/alert/index.js

@@ -1 +1 @@
-export { t as Alert, n as AlertDescription, r as AlertTitle } from "../../alert-D7lYqDGZ.js";
+export { t as Alert } from "../../alert-BQzMceKI.js";

package/dist/components/alert-dialog/alert-dialog.d.ts

@@ -1,14 +1,21 @@
 import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';
 import { ComponentProps } from 'react';
-export declare const AlertDialog: typeof BaseAlertDialog.Root;
-export declare const AlertDialogTrigger: BaseAlertDialog.Trigger;
-export declare function AlertDialogContent({ className, children, ...props }: ComponentProps<typeof BaseAlertDialog.Popup>): import('react').JSX.Element;
-export declare function AlertDialogTitle({ className, ...props }: ComponentProps<typeof BaseAlertDialog.Title>): import('react').JSX.Element;
-export declare function AlertDialogDescription({ className, ...props }: ComponentProps<typeof BaseAlertDialog.Description>): import('react').JSX.Element;
-export declare const AlertDialogHeader: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-export declare const AlertDialogFooter: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+declare function AlertDialogContent({ className, children, ...props }: ComponentProps<typeof BaseAlertDialog.Popup>): import('react').JSX.Element;
+declare function AlertDialogTitle({ className, ...props }: ComponentProps<typeof BaseAlertDialog.Title>): import('react').JSX.Element;
+declare function AlertDialogDescription({ className, ...props }: ComponentProps<typeof BaseAlertDialog.Description>): import('react').JSX.Element;
 export interface AlertDialogActionProps extends ComponentProps<typeof BaseAlertDialog.Close> {
     variant?: "primary" | "danger";
 }
-export declare function AlertDialogAction({ className, variant, ...props }: AlertDialogActionProps): import('react').JSX.Element;
-export declare function AlertDialogCancel({ className, ...props }: ComponentProps<typeof BaseAlertDialog.Close>): import('react').JSX.Element;
+declare function AlertDialogAction({ className, variant, ...props }: AlertDialogActionProps): import('react').JSX.Element;
+declare function AlertDialogCancel({ className, ...props }: ComponentProps<typeof BaseAlertDialog.Close>): import('react').JSX.Element;
+export declare const AlertDialog: typeof BaseAlertDialog.Root & {
+    Trigger: BaseAlertDialog.Trigger;
+    Action: typeof AlertDialogAction;
+    Cancel: typeof AlertDialogCancel;
+    Content: typeof AlertDialogContent;
+    Description: typeof AlertDialogDescription;
+    Footer: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    Header: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+    Title: typeof AlertDialogTitle;
+};
+export {};

package/dist/components/alert-dialog/index.d.ts

@@ -1,2 +1,2 @@
-export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, } from './alert-dialog';
+export { AlertDialog } from './alert-dialog';
 export type { AlertDialogActionProps } from './alert-dialog';

package/dist/components/alert-dialog/index.js

@@ -1 +1 @@
-export { t as AlertDialog, n as AlertDialogAction, r as AlertDialogCancel, i as AlertDialogContent, a as AlertDialogDescription, o as AlertDialogFooter, s as AlertDialogHeader, c as AlertDialogTitle, l as AlertDialogTrigger } from "../../alert-dialog-BSyPkfNR.js";
+export { t as AlertDialog } from "../../alert-dialog-_E4de7AY.js";

package/dist/components/autocomplete/autocomplete.d.ts

@@ -1,8 +1,15 @@
 import { Autocomplete as BaseAutocomplete } from '@base-ui/react/autocomplete';
 import { ComponentProps } from 'react';
-export declare const Autocomplete: typeof BaseAutocomplete.Root;
-export declare function AutocompleteInputGroup({ className, ...props }: ComponentProps<typeof BaseAutocomplete.InputGroup>): import('react').JSX.Element;
-export declare function AutocompleteInput({ className, ...props }: ComponentProps<typeof BaseAutocomplete.Input>): import('react').JSX.Element;
-export declare function AutocompleteClear({ className, ...props }: ComponentProps<typeof BaseAutocomplete.Clear>): import('react').JSX.Element;
-export declare function AutocompleteContent({ className, children, ...props }: ComponentProps<typeof BaseAutocomplete.Popup>): import('react').JSX.Element;
-export declare function AutocompleteItem({ className, ...props }: ComponentProps<typeof BaseAutocomplete.Item>): import('react').JSX.Element;
+declare function AutocompleteInputGroup({ className, ...props }: ComponentProps<typeof BaseAutocomplete.InputGroup>): import('react').JSX.Element;
+declare function AutocompleteInput({ className, ...props }: ComponentProps<typeof BaseAutocomplete.Input>): import('react').JSX.Element;
+declare function AutocompleteClear({ className, ...props }: ComponentProps<typeof BaseAutocomplete.Clear>): import('react').JSX.Element;
+declare function AutocompleteContent({ className, children, ...props }: ComponentProps<typeof BaseAutocomplete.Popup>): import('react').JSX.Element;
+declare function AutocompleteItem({ className, ...props }: ComponentProps<typeof BaseAutocomplete.Item>): import('react').JSX.Element;
+export declare const Autocomplete: typeof BaseAutocomplete.Root & {
+    InputGroup: typeof AutocompleteInputGroup;
+    Input: typeof AutocompleteInput;
+    Content: typeof AutocompleteContent;
+    Item: typeof AutocompleteItem;
+    Clear: typeof AutocompleteClear;
+};
+export {};

package/dist/components/autocomplete/index.d.ts

@@ -1 +1 @@
-export { Autocomplete, AutocompleteClear, AutocompleteContent, AutocompleteInput, AutocompleteInputGroup, AutocompleteItem } from './autocomplete';
+export { Autocomplete } from './autocomplete';

package/dist/components/autocomplete/index.js

@@ -1 +1 @@
-export { t as Autocomplete, n as AutocompleteClear, r as AutocompleteContent, i as AutocompleteInput, a as AutocompleteInputGroup, o as AutocompleteItem } from "../../autocomplete-D_OafKFC.js";
+export { t as Autocomplete } from "../../autocomplete-CVD8GTVR.js";

package/dist/components/avatar/avatar-group.d.ts

@@ -1,2 +1,3 @@
-export declare const AvatarGroup: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-export declare const AvatarGroupCount: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import('react').RefAttributes<HTMLSpanElement>>;
+export declare const AvatarGroup: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>> & {
+    Count: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import('react').RefAttributes<HTMLSpanElement>>;
+};