@uselets/ui 1.2.2 → 1.3.0

package/README.md

@@ -244,7 +244,8 @@ You can import from the package root (`@uselets/ui`) or by subpath (`@uselets/ui
 | `dropdown-menu` | `DropdownMenu`, `DropdownMenuTrigger`, `DropdownMenuContent`, `DropdownMenuItem`, `DropdownMenuCheckboxItem`, `DropdownMenuRadioGroup`, `DropdownMenuRadioItem`, `DropdownMenuSub`, `DropdownMenuSubTrigger`, `DropdownMenuSubContent`, `DropdownMenuSeparator`, `DropdownMenuShortcut` | `DropdownMenuContent` supports `side`, `sideOffset`, `align`, `alignOffset`; items support `inset`, and `DropdownMenuItem` supports `variant: 'default' \| 'destructive'`. |
 | `empty` | `Empty`, `EmptyHeader`, `EmptyMedia`, `EmptyTitle`, `EmptyDescription`, `EmptyContent` | `EmptyMedia` supports `variant: 'default' \| 'icon'` (default: `default`). |
 | `field` | `FieldSet`, `FieldLegend`, `FieldGroup`, `Field`, `FieldContent`, `FieldLabel`, `FieldTitle`, `FieldDescription`, `FieldSeparator`, `FieldError`, `useFieldControlId` | `Field.orientation: 'vertical' \| 'horizontal' \| 'responsive'` (default: `vertical`); `FieldLegend.variant: 'legend' \| 'label'`; `FieldError.errors` accepts an array of error objects. When a labelable control is rendered inside `Field` without an explicit `id`, `Field` provides a generated id and `FieldLabel` uses it automatically. |
-| `grid` | `Grid`, `GridItem` | `Grid` is a 12-column CSS grid by default and supports `gap`, `rowGap`, `columnGap`, `templateRows`, and `templateColumns`. `GridItem` defaults to `colSpan={12}` and supports numeric `colSpan` and `rowSpan`; use `useBreakpointValue` when spans or templates need responsive values. |
+| `flex` | `Flex`, `flexVariants` | Flexbox layout primitive with `direction: 'row' \| 'row-reverse' \| 'column' \| 'column-reverse'` (default: `row`), `align: 'start' \| 'end' \| 'center' \| 'baseline' \| 'stretch'`, `justify: 'start' \| 'end' \| 'center' \| 'between' \| 'around' \| 'evenly'`, `wrap?: boolean`, and `gap: 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl'` (`4/8/16/24/32px`). |
+| `grid` | `Grid`, `GridItem` | `Grid` is a 12-column CSS grid by default and supports `gap`, `rowGap`, `columnGap`, `templateRows`, and `templateColumns`; spacing uses the `xs` to `xl` scale (`4/8/16/24/32px`). `GridItem` defaults to `colSpan={12}` and supports numeric `colSpan` and `rowSpan`; use `useBreakpointValue` when spans or templates need responsive values. |
 | `heading` | `Heading`, `headingVariants` | Heading primitive with `size: 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl'` (default: `md`) and `asChild`. |
 | `input` | `Input` | Wrapper for Base UI Input with all native `<input>` props. |
 | `input-otp` | `InputOTP`, `InputOTPGroup`, `InputOTPSlot`, `InputOTPSeparator`, `REGEXP_ONLY_CHARS`, `REGEXP_ONLY_DIGITS`, `REGEXP_ONLY_DIGITS_AND_CHARS` | `InputOTP` supports all `input-otp` props plus `containerClassName`; use `maxLength` and `pattern` for validation. |
@@ -256,7 +257,7 @@ You can import from the package root (`@uselets/ui`) or by subpath (`@uselets/ui
 | `radio-group` | `RadioGroup`, `RadioGroupItem` | `RadioGroup` supports `color: UIColor` (default: `primary`) for the group. `RadioGroupItem` supports `size: 'sm' \| 'md' \| 'lg'` (default: `md`), optional `color: UIColor` item overrides, `label?: React.ReactNode`, and `labelProps` for the composed `Label`. When `label` is provided without `id`, it generates an id and wires `htmlFor` automatically. Label text follows item size: `sm` 12px, `md` 14px, `lg` 20px. |
 | `select` | `Select`, `SelectTrigger`, `SelectValue`, `SelectContent`, `SelectGroup`, `SelectItem`, `SelectLabel`, `SelectSeparator`, `SelectScrollUpButton`, `SelectScrollDownButton` | `SelectTrigger.size: 'sm' \| 'md'`; `SelectContent` supports positioning props (`side`, `sideOffset`, `align`, `alignOffset`, `alignItemWithTrigger`). |
 | `separator` | `Separator` | `orientation: 'horizontal' \| 'vertical'` (default: `horizontal`). |
-| `simple-grid` | `SimpleGrid` | Simple grid with `cols`, `gap`, `rowGap`, and `columnGap`. `cols` accepts a number; spacing uses the `xs` to `xl` scale. Use `useBreakpointValue` when column count needs responsive values. |
+| `simple-grid` | `SimpleGrid` | Simple grid with `cols`, `gap`, `rowGap`, and `columnGap`. `cols` accepts a number; spacing uses the `xs` to `xl` scale (`4/8/16/24/32px`). Use `useBreakpointValue` when column count needs responsive values. |
 | `skeleton` | `Skeleton` | Generic loading placeholder block. Supports `visible?: boolean` (default: `true`) and can wrap `children` to reserve their size while the placeholder is shown. |
 | `spinner` | `Spinner` | Loader icon (`role="status"`), accepts SVG props and supports `size: 'sm' \| 'md' \| 'lg'` (default: `md`). |
 | `switch` | `Switch` | `Switch` supports `size: 'sm' \| 'md' \| 'lg'` (default: `md`), `color: UIColor` (default: `green`), `label?: React.ReactNode`, and `labelProps` for the composed `Label`. When `label` is provided without `id`, it generates an id and wires `htmlFor` automatically. Track size is `sm` 34x16px, `md` 42x20px, and `lg` 48x22px; the thumb and internal indicator scale with the switch. Label text follows switch size: `sm` 12px, `md` 14px, `lg` 20px. |
@@ -271,14 +272,14 @@ You can import from the package root (`@uselets/ui`) or by subpath (`@uselets/ui
 
 The package also exports the following modules through the root entrypoint and subpaths:
 
-- Layout and disclosure: `Accordion`, `Carousel`, `Center`, `Collapsible`, `Container`, `Group`, `Resizable`, `ScrollArea`, `Sidebar`, `Stack`, `Tabs`
+- Layout and disclosure: `Accordion`, `Carousel`, `Center`, `Collapsible`, `Container`, `Flex`, `Group`, `Resizable`, `ScrollArea`, `Sidebar`, `Stack`, `Tabs`
 - Inputs and selection: `Calendar`, `DateRangePicker`, `InputGroup`, `RadioGroup`, `Slider`, `Switch`, `Textarea`, `Toggle`, `ToggleGroup`
 - Navigation and feedback: `AlertDialog`, `Breadcrumb`, `NavigationMenu`, `Pagination`, `Progress`
 - Data display and utilities: `Badge`, `ButtonGroup`, `Chart`, `Command`, `HoverCard`, `Table`, `ThemeProvider`, `useTheme`, `ModeToggle`
 
-Each module exports its public composition parts and prop types from the same import path, for example `@uselets/ui/accordion` or `@uselets/ui`.
+Each module exports its public composition parts and prop types from the same import path, for example `@uselets/ui/accordion` or `@uselets/ui`. `Carousel` includes the composed `CarouselIndicators` subcomponent for opt-in slide indicators.
 
-Layout primitives follow the same pattern: `Stack` and `Group` support `gap: 'xs' | 'sm' | 'md' | 'lg' | 'xl'`; `Group` also supports `wrap`; `Center` supports `size: 'xs' | 'sm' | 'md' | 'lg' | 'xl'` and `direction: 'horizontal' | 'vertical'`; and `Container` supports `size: 'sm' | 'md' | 'lg' | 'full'`. `SimpleGrid`, `Grid`, and `GridItem` accept direct layout values; use `useBreakpointValue` to derive responsive values when needed. `HiddenFrom` and `VisibleFrom` provide breakpoint-based visibility wrappers.
+Layout primitives follow the same pattern: `Stack`, `Group`, and `Flex` support `gap: 'xs' | 'sm' | 'md' | 'lg' | 'xl'`, mapping to `4/8/16/24/32px`; `Group` also supports `wrap`; `Flex` additionally supports typed `direction`, `align`, `justify`, and `wrap` props; `Center` supports `size: 'xs' | 'sm' | 'md' | 'lg' | 'xl'` and `direction: 'horizontal' | 'vertical'`; and `Container` supports `size: 'sm' | 'md' | 'lg' | 'full'`. `SimpleGrid`, `Grid`, and `GridItem` accept direct layout values; use `useBreakpointValue` to derive responsive values when needed. `HiddenFrom` and `VisibleFrom` provide breakpoint-based visibility wrappers.
 
 Public hooks are exported from the package root and from the `@uselets/ui/hooks/*` namespace:
 

package/dist/components/carousel.d.ts

@@ -19,13 +19,19 @@ type CarouselContentProps = React.ComponentProps<'div'>;
 type CarouselItemProps = React.ComponentProps<'div'>;
 type CarouselPreviousProps = React.ComponentProps<typeof Button>;
 type CarouselNextProps = React.ComponentProps<typeof Button>;
+type CarouselIndicatorsProps = React.ComponentProps<'div'> & {
+  getIndicatorProps?: (index: number) => React.ComponentProps<'button'>;
+};
 type CarouselContextProps = {
   carouselRef: ReturnType<typeof useEmblaCarousel>[0];
   api: ReturnType<typeof useEmblaCarousel>[1];
   scrollPrev: () => void;
   scrollNext: () => void;
+  scrollTo: (index: number) => void;
   canScrollPrev: boolean;
   canScrollNext: boolean;
+  selectedIndex: number;
+  scrollSnaps: number[];
 } & CarouselProps;
 declare function useCarousel(): CarouselContextProps;
 declare function Carousel({
@@ -59,6 +65,11 @@ declare function CarouselNext({
   color,
   ...props
 }: CarouselNextProps): _$react_jsx_runtime0.JSX.Element;
+declare function CarouselIndicators({
+  className,
+  getIndicatorProps,
+  ...props
+}: CarouselIndicatorsProps): _$react_jsx_runtime0.JSX.Element | null;
 //#endregion
-export { Carousel, CarouselApi, CarouselContent, CarouselContentProps, CarouselItem, CarouselItemProps, CarouselNext, CarouselNextProps, CarouselPrevious, CarouselPreviousProps, CarouselProps, useCarousel };
+export { Carousel, CarouselApi, CarouselContent, CarouselContentProps, CarouselIndicators, CarouselIndicatorsProps, CarouselItem, CarouselItemProps, CarouselNext, CarouselNextProps, CarouselPrevious, CarouselPreviousProps, CarouselProps, useCarousel };
 //# sourceMappingURL=carousel.d.ts.map

package/dist/components/carousel.js

@@ -1,2 +1,2 @@
-import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{Button as t}from"./button.js";import{IconChevronLeft as n,IconChevronRight as r}from"@tabler/icons-react";import{jsx as i,jsxs as a}from"react/jsx-runtime";import*as o from"react";import s from"embla-carousel-react";const c=o.createContext(null);function useCarousel(){let e=o.useContext(c);if(!e)throw Error(`useCarousel must be used within a <Carousel />`);return e}function Carousel({orientation:t=`horizontal`,opts:n,setApi:r,plugins:a,className:l,children:u,...d}){let[f,p]=s({...n,axis:t===`horizontal`?`x`:`y`},a),[m,h]=o.useState(!1),[g,_]=o.useState(!1),v=o.useCallback(e=>{e&&(h(e.canScrollPrev()),_(e.canScrollNext()))},[]),y=o.useCallback(()=>{p?.scrollPrev()},[p]),b=o.useCallback(()=>{p?.scrollNext()},[p]),x=o.useCallback(e=>{e.key===`ArrowLeft`?(e.preventDefault(),y()):e.key===`ArrowRight`&&(e.preventDefault(),b())},[y,b]);return o.useEffect(()=>{!p||!r||r(p)},[p,r]),o.useEffect(()=>{if(p)return v(p),p.on(`reInit`,v),p.on(`select`,v),()=>{p?.off(`select`,v)}},[p,v]),i(c.Provider,{value:{carouselRef:f,api:p,opts:n,orientation:t||(n?.axis===`y`?`vertical`:`horizontal`),scrollPrev:y,scrollNext:b,canScrollPrev:m,canScrollNext:g},children:i(`section`,{onKeyDownCapture:x,className:e(`relative`,l),"data-slot":`carousel`,...d,children:u})})}function CarouselContent({className:t,...n}){let{carouselRef:r,orientation:a}=useCarousel();return i(`div`,{ref:r,className:`overflow-hidden`,"data-slot":`carousel-content`,children:i(`div`,{className:e(`flex`,a===`horizontal`?`-ml-4`:`-mt-4 flex-col`,t),...n})})}function CarouselItem({className:t,...n}){let{orientation:r}=useCarousel();return i(`div`,{"data-slot":`carousel-item`,className:e(`min-w-0 shrink-0 grow-0 basis-full`,r===`horizontal`?`pl-4`:`pt-4`,t),...n})}function CarouselPrevious({className:r,variant:o=`outline`,size:s=`icon-sm`,color:c=`zinc`,...l}){let{orientation:u,scrollPrev:d,canScrollPrev:f}=useCarousel();return a(t,{"data-slot":`carousel-previous`,color:c,variant:o,size:s,className:e(`absolute touch-manipulation rounded-full`,u===`horizontal`?`top-1/2 -left-12 -translate-y-1/2`:`-top-12 left-1/2 -translate-x-1/2 rotate-90`,r),disabled:!f,onClick:d,...l,children:[i(n,{}),i(`span`,{className:`sr-only`,children:`Previous slide`})]})}function CarouselNext({className:n,variant:o=`outline`,size:s=`icon-sm`,color:c=`zinc`,...l}){let{orientation:u,scrollNext:d,canScrollNext:f}=useCarousel();return a(t,{"data-slot":`carousel-next`,color:c,variant:o,size:s,className:e(`absolute touch-manipulation rounded-full`,u===`horizontal`?`top-1/2 -right-12 -translate-y-1/2`:`-bottom-12 left-1/2 -translate-x-1/2 rotate-90`,n),disabled:!f,onClick:d,...l,children:[i(r,{}),i(`span`,{className:`sr-only`,children:`Next slide`})]})}export{Carousel,CarouselContent,CarouselItem,CarouselNext,CarouselPrevious,useCarousel};
+import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{Button as t}from"./button.js";import{IconChevronLeft as n,IconChevronRight as r}from"@tabler/icons-react";import{jsx as i,jsxs as a}from"react/jsx-runtime";import*as o from"react";import s from"embla-carousel-react";const c=o.createContext(null);function useCarousel(){let e=o.useContext(c);if(!e)throw Error(`useCarousel must be used within a <Carousel />`);return e}function Carousel({orientation:t=`horizontal`,opts:n,setApi:r,plugins:a,className:l,children:u,...d}){let[f,p]=s({...n,axis:t===`horizontal`?`x`:`y`},a),[m,h]=o.useState(!1),[g,_]=o.useState(!1),[v,y]=o.useState(0),[b,x]=o.useState([]),S=o.useCallback(e=>{e&&(h(e.canScrollPrev()),_(e.canScrollNext()),y(e.selectedScrollSnap()),x(e.scrollSnapList()))},[]),C=o.useCallback(()=>{p?.scrollPrev()},[p]),w=o.useCallback(()=>{p?.scrollNext()},[p]),T=o.useCallback(e=>{p?.scrollTo(e)},[p]),E=o.useCallback(e=>{e.key===`ArrowLeft`?(e.preventDefault(),C()):e.key===`ArrowRight`&&(e.preventDefault(),w())},[C,w]);return o.useEffect(()=>{!p||!r||r(p)},[p,r]),o.useEffect(()=>{if(p)return S(p),p.on(`reInit`,S),p.on(`select`,S),()=>{p?.off(`reInit`,S),p?.off(`select`,S)}},[p,S]),i(c.Provider,{value:{carouselRef:f,api:p,opts:n,orientation:t||(n?.axis===`y`?`vertical`:`horizontal`),scrollPrev:C,scrollNext:w,scrollTo:T,canScrollPrev:m,canScrollNext:g,selectedIndex:v,scrollSnaps:b},children:i(`section`,{onKeyDownCapture:E,className:e(`relative`,l),"data-slot":`carousel`,...d,children:u})})}function CarouselContent({className:t,...n}){let{carouselRef:r,orientation:a}=useCarousel();return i(`div`,{ref:r,className:`overflow-hidden`,"data-slot":`carousel-content`,children:i(`div`,{className:e(`flex`,a===`horizontal`?`-ml-4`:`-mt-4 flex-col`,t),...n})})}function CarouselItem({className:t,...n}){let{orientation:r}=useCarousel();return i(`div`,{"data-slot":`carousel-item`,className:e(`min-w-0 shrink-0 grow-0 basis-full`,r===`horizontal`?`pl-4`:`pt-4`,t),...n})}function CarouselPrevious({className:r,variant:o=`outline`,size:s=`icon-sm`,color:c=`zinc`,...l}){let{orientation:u,scrollPrev:d,canScrollPrev:f}=useCarousel();return a(t,{"data-slot":`carousel-previous`,color:c,variant:o,size:s,className:e(`absolute touch-manipulation rounded-full`,u===`horizontal`?`top-1/2 -left-12 -translate-y-1/2`:`-top-12 left-1/2 -translate-x-1/2 rotate-90`,r),disabled:!f,onClick:d,...l,children:[i(n,{}),i(`span`,{className:`sr-only`,children:`Previous slide`})]})}function CarouselNext({className:n,variant:o=`outline`,size:s=`icon-sm`,color:c=`zinc`,...l}){let{orientation:u,scrollNext:d,canScrollNext:f}=useCarousel();return a(t,{"data-slot":`carousel-next`,color:c,variant:o,size:s,className:e(`absolute touch-manipulation rounded-full`,u===`horizontal`?`top-1/2 -right-12 -translate-y-1/2`:`-bottom-12 left-1/2 -translate-x-1/2 rotate-90`,n),disabled:!f,onClick:d,...l,children:[i(r,{}),i(`span`,{className:`sr-only`,children:`Next slide`})]})}function CarouselIndicators({className:t,getIndicatorProps:n,...r}){let{orientation:a,scrollSnaps:o,selectedIndex:s,scrollTo:c}=useCarousel();return o.length===0?null:i(`div`,{"data-slot":`carousel-indicators`,className:e(`pointer-events-none absolute flex justify-center gap-2`,a===`horizontal`?`inset-x-0 bottom-4 flex-row`:`inset-y-0 right-4 flex-col items-center`,t),...r,children:o.map((t,r)=>{let{className:a,onClick:o,...l}=n?.(r)??{};return i(`button`,{...l,type:`button`,"data-slot":`carousel-indicator`,"data-active":s===r?!0:void 0,"aria-label":`Go to slide ${r+1}`,className:e(`pointer-events-auto cursor-pointer size-2.5 touch-manipulation rounded-full bg-background opacity-60 shadow-sm ring-1 ring-border transition-opacity hover:opacity-100 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-3 focus-visible:outline-none data-[active=true]:opacity-100`,a),onClick:e=>{c(r),o?.(e)}},t)})})}export{Carousel,CarouselContent,CarouselIndicators,CarouselItem,CarouselNext,CarouselPrevious,useCarousel};
 //# sourceMappingURL=carousel.js.map

package/dist/components/carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"carousel.js","names":[],"sources":["../../src/components/carousel.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { IconChevronLeft, IconChevronRight } from '@tabler/icons-react'\nimport useEmblaCarousel, { type UseEmblaCarouselType } from 'embla-carousel-react'\n\nimport { cn } from '../lib/utils'\nimport { Button } from './button'\n\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>\ntype CarouselOptions = UseCarouselParameters[0]\ntype CarouselPlugin = UseCarouselParameters[1]\n\nexport type CarouselApi = UseEmblaCarouselType[1]\n\nexport type CarouselProps = React.ComponentProps<'div'> & {\n  opts?: CarouselOptions\n  plugins?: CarouselPlugin\n  orientation?: 'horizontal' | 'vertical'\n  setApi?: (api: CarouselApi) => void\n}\n\nexport type CarouselContentProps = React.ComponentProps<'div'>\n\nexport type CarouselItemProps = React.ComponentProps<'div'>\n\nexport type CarouselPreviousProps = React.ComponentProps<typeof Button>\n\nexport type CarouselNextProps = React.ComponentProps<typeof Button>\n\ntype CarouselContextProps = {\n  carouselRef: ReturnType<typeof useEmblaCarousel>[0]\n  api: ReturnType<typeof useEmblaCarousel>[1]\n  scrollPrev: () => void\n  scrollNext: () => void\n  canScrollPrev: boolean\n  canScrollNext: boolean\n} & CarouselProps\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null)\n\nfunction useCarousel() {\n  const context = React.useContext(CarouselContext)\n\n  if (!context) {\n    throw new Error('useCarousel must be used within a <Carousel />')\n  }\n\n  return context\n}\n\nfunction Carousel({ orientation = 'horizontal', opts, setApi, plugins, className, children, ...props }: CarouselProps) {\n  const [carouselRef, api] = useEmblaCarousel(\n    {\n      ...opts,\n      axis: orientation === 'horizontal' ? 'x' : 'y'\n    },\n    plugins\n  )\n  const [canScrollPrev, setCanScrollPrev] = React.useState(false)\n  const [canScrollNext, setCanScrollNext] = React.useState(false)\n\n  const onSelect = React.useCallback((api: CarouselApi) => {\n    if (!api) return\n    setCanScrollPrev(api.canScrollPrev())\n    setCanScrollNext(api.canScrollNext())\n  }, [])\n\n  const scrollPrev = React.useCallback(() => {\n    api?.scrollPrev()\n  }, [api])\n\n  const scrollNext = React.useCallback(() => {\n    api?.scrollNext()\n  }, [api])\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (event.key === 'ArrowLeft') {\n        event.preventDefault()\n        scrollPrev()\n      } else if (event.key === 'ArrowRight') {\n        event.preventDefault()\n        scrollNext()\n      }\n    },\n    [scrollPrev, scrollNext]\n  )\n\n  React.useEffect(() => {\n    if (!api || !setApi) return\n    setApi(api)\n  }, [api, setApi])\n\n  React.useEffect(() => {\n    if (!api) return\n    onSelect(api)\n    api.on('reInit', onSelect)\n    api.on('select', onSelect)\n\n    return () => {\n      api?.off('select', onSelect)\n    }\n  }, [api, onSelect])\n\n  return (\n    <CarouselContext.Provider\n      value={{\n        carouselRef,\n        api: api,\n        opts,\n        orientation: orientation || (opts?.axis === 'y' ? 'vertical' : 'horizontal'),\n        scrollPrev,\n        scrollNext,\n        canScrollPrev,\n        canScrollNext\n      }}\n    >\n      <section onKeyDownCapture={handleKeyDown} className={cn('relative', className)} data-slot=\"carousel\" {...props}>\n        {children}\n      </section>\n    </CarouselContext.Provider>\n  )\n}\n\nfunction CarouselContent({ className, ...props }: CarouselContentProps) {\n  const { carouselRef, orientation } = useCarousel()\n\n  return (\n    <div ref={carouselRef} className=\"overflow-hidden\" data-slot=\"carousel-content\">\n      <div className={cn('flex', orientation === 'horizontal' ? '-ml-4' : '-mt-4 flex-col', className)} {...props} />\n    </div>\n  )\n}\n\nfunction CarouselItem({ className, ...props }: CarouselItemProps) {\n  const { orientation } = useCarousel()\n\n  return (\n    <div\n      data-slot=\"carousel-item\"\n      className={cn('min-w-0 shrink-0 grow-0 basis-full', orientation === 'horizontal' ? 'pl-4' : 'pt-4', className)}\n      {...props}\n    />\n  )\n}\n\nfunction CarouselPrevious({\n  className,\n  variant = 'outline',\n  size = 'icon-sm',\n  color = 'zinc',\n  ...props\n}: CarouselPreviousProps) {\n  const { orientation, scrollPrev, canScrollPrev } = useCarousel()\n\n  return (\n    <Button\n      data-slot=\"carousel-previous\"\n      color={color}\n      variant={variant}\n      size={size}\n      className={cn(\n        'absolute touch-manipulation rounded-full',\n        orientation === 'horizontal'\n          ? 'top-1/2 -left-12 -translate-y-1/2'\n          : '-top-12 left-1/2 -translate-x-1/2 rotate-90',\n        className\n      )}\n      disabled={!canScrollPrev}\n      onClick={scrollPrev}\n      {...props}\n    >\n      <IconChevronLeft />\n      <span className=\"sr-only\">Previous slide</span>\n    </Button>\n  )\n}\n\nfunction CarouselNext({\n  className,\n  variant = 'outline',\n  size = 'icon-sm',\n  color = 'zinc',\n  ...props\n}: CarouselNextProps) {\n  const { orientation, scrollNext, canScrollNext } = useCarousel()\n\n  return (\n    <Button\n      data-slot=\"carousel-next\"\n      color={color}\n      variant={variant}\n      size={size}\n      className={cn(\n        'absolute touch-manipulation rounded-full',\n        orientation === 'horizontal'\n          ? 'top-1/2 -right-12 -translate-y-1/2'\n          : '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',\n        className\n      )}\n      disabled={!canScrollNext}\n      onClick={scrollNext}\n      {...props}\n    >\n      <IconChevronRight />\n      <span className=\"sr-only\">Next slide</span>\n    </Button>\n  )\n}\n\nexport { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, useCarousel }\n"],"mappings":"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"}
+{"version":3,"file":"carousel.js","names":[],"sources":["../../src/components/carousel.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { IconChevronLeft, IconChevronRight } from '@tabler/icons-react'\nimport useEmblaCarousel, { type UseEmblaCarouselType } from 'embla-carousel-react'\n\nimport { cn } from '../lib/utils'\nimport { Button } from './button'\n\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>\ntype CarouselOptions = UseCarouselParameters[0]\ntype CarouselPlugin = UseCarouselParameters[1]\n\nexport type CarouselApi = UseEmblaCarouselType[1]\n\nexport type CarouselProps = React.ComponentProps<'div'> & {\n  opts?: CarouselOptions\n  plugins?: CarouselPlugin\n  orientation?: 'horizontal' | 'vertical'\n  setApi?: (api: CarouselApi) => void\n}\n\nexport type CarouselContentProps = React.ComponentProps<'div'>\n\nexport type CarouselItemProps = React.ComponentProps<'div'>\n\nexport type CarouselPreviousProps = React.ComponentProps<typeof Button>\n\nexport type CarouselNextProps = React.ComponentProps<typeof Button>\n\nexport type CarouselIndicatorsProps = React.ComponentProps<'div'> & {\n  getIndicatorProps?: (index: number) => React.ComponentProps<'button'>\n}\n\ntype CarouselContextProps = {\n  carouselRef: ReturnType<typeof useEmblaCarousel>[0]\n  api: ReturnType<typeof useEmblaCarousel>[1]\n  scrollPrev: () => void\n  scrollNext: () => void\n  scrollTo: (index: number) => void\n  canScrollPrev: boolean\n  canScrollNext: boolean\n  selectedIndex: number\n  scrollSnaps: number[]\n} & CarouselProps\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null)\n\nfunction useCarousel() {\n  const context = React.useContext(CarouselContext)\n\n  if (!context) {\n    throw new Error('useCarousel must be used within a <Carousel />')\n  }\n\n  return context\n}\n\nfunction Carousel({ orientation = 'horizontal', opts, setApi, plugins, className, children, ...props }: CarouselProps) {\n  const [carouselRef, api] = useEmblaCarousel(\n    {\n      ...opts,\n      axis: orientation === 'horizontal' ? 'x' : 'y'\n    },\n    plugins\n  )\n  const [canScrollPrev, setCanScrollPrev] = React.useState(false)\n  const [canScrollNext, setCanScrollNext] = React.useState(false)\n  const [selectedIndex, setSelectedIndex] = React.useState(0)\n  const [scrollSnaps, setScrollSnaps] = React.useState<number[]>([])\n\n  const onSelect = React.useCallback((api: CarouselApi) => {\n    if (!api) return\n    setCanScrollPrev(api.canScrollPrev())\n    setCanScrollNext(api.canScrollNext())\n    setSelectedIndex(api.selectedScrollSnap())\n    setScrollSnaps(api.scrollSnapList())\n  }, [])\n\n  const scrollPrev = React.useCallback(() => {\n    api?.scrollPrev()\n  }, [api])\n\n  const scrollNext = React.useCallback(() => {\n    api?.scrollNext()\n  }, [api])\n\n  const scrollTo = React.useCallback(\n    (index: number) => {\n      api?.scrollTo(index)\n    },\n    [api]\n  )\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (event.key === 'ArrowLeft') {\n        event.preventDefault()\n        scrollPrev()\n      } else if (event.key === 'ArrowRight') {\n        event.preventDefault()\n        scrollNext()\n      }\n    },\n    [scrollPrev, scrollNext]\n  )\n\n  React.useEffect(() => {\n    if (!api || !setApi) return\n    setApi(api)\n  }, [api, setApi])\n\n  React.useEffect(() => {\n    if (!api) return\n    onSelect(api)\n    api.on('reInit', onSelect)\n    api.on('select', onSelect)\n\n    return () => {\n      api?.off('reInit', onSelect)\n      api?.off('select', onSelect)\n    }\n  }, [api, onSelect])\n\n  return (\n    <CarouselContext.Provider\n      value={{\n        carouselRef,\n        api: api,\n        opts,\n        orientation: orientation || (opts?.axis === 'y' ? 'vertical' : 'horizontal'),\n        scrollPrev,\n        scrollNext,\n        scrollTo,\n        canScrollPrev,\n        canScrollNext,\n        selectedIndex,\n        scrollSnaps\n      }}\n    >\n      <section onKeyDownCapture={handleKeyDown} className={cn('relative', className)} data-slot=\"carousel\" {...props}>\n        {children}\n      </section>\n    </CarouselContext.Provider>\n  )\n}\n\nfunction CarouselContent({ className, ...props }: CarouselContentProps) {\n  const { carouselRef, orientation } = useCarousel()\n\n  return (\n    <div ref={carouselRef} className=\"overflow-hidden\" data-slot=\"carousel-content\">\n      <div className={cn('flex', orientation === 'horizontal' ? '-ml-4' : '-mt-4 flex-col', className)} {...props} />\n    </div>\n  )\n}\n\nfunction CarouselItem({ className, ...props }: CarouselItemProps) {\n  const { orientation } = useCarousel()\n\n  return (\n    <div\n      data-slot=\"carousel-item\"\n      className={cn('min-w-0 shrink-0 grow-0 basis-full', orientation === 'horizontal' ? 'pl-4' : 'pt-4', className)}\n      {...props}\n    />\n  )\n}\n\nfunction CarouselPrevious({\n  className,\n  variant = 'outline',\n  size = 'icon-sm',\n  color = 'zinc',\n  ...props\n}: CarouselPreviousProps) {\n  const { orientation, scrollPrev, canScrollPrev } = useCarousel()\n\n  return (\n    <Button\n      data-slot=\"carousel-previous\"\n      color={color}\n      variant={variant}\n      size={size}\n      className={cn(\n        'absolute touch-manipulation rounded-full',\n        orientation === 'horizontal'\n          ? 'top-1/2 -left-12 -translate-y-1/2'\n          : '-top-12 left-1/2 -translate-x-1/2 rotate-90',\n        className\n      )}\n      disabled={!canScrollPrev}\n      onClick={scrollPrev}\n      {...props}\n    >\n      <IconChevronLeft />\n      <span className=\"sr-only\">Previous slide</span>\n    </Button>\n  )\n}\n\nfunction CarouselNext({\n  className,\n  variant = 'outline',\n  size = 'icon-sm',\n  color = 'zinc',\n  ...props\n}: CarouselNextProps) {\n  const { orientation, scrollNext, canScrollNext } = useCarousel()\n\n  return (\n    <Button\n      data-slot=\"carousel-next\"\n      color={color}\n      variant={variant}\n      size={size}\n      className={cn(\n        'absolute touch-manipulation rounded-full',\n        orientation === 'horizontal'\n          ? 'top-1/2 -right-12 -translate-y-1/2'\n          : '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',\n        className\n      )}\n      disabled={!canScrollNext}\n      onClick={scrollNext}\n      {...props}\n    >\n      <IconChevronRight />\n      <span className=\"sr-only\">Next slide</span>\n    </Button>\n  )\n}\n\nfunction CarouselIndicators({ className, getIndicatorProps, ...props }: CarouselIndicatorsProps) {\n  const { orientation, scrollSnaps, selectedIndex, scrollTo } = useCarousel()\n\n  if (scrollSnaps.length === 0) {\n    return null\n  }\n\n  return (\n    <div\n      data-slot=\"carousel-indicators\"\n      className={cn(\n        'pointer-events-none absolute flex justify-center gap-2',\n        orientation === 'horizontal' ? 'inset-x-0 bottom-4 flex-row' : 'inset-y-0 right-4 flex-col items-center',\n        className\n      )}\n      {...props}\n    >\n      {scrollSnaps.map((snap, index) => {\n        const { className: indicatorClassName, onClick, ...indicatorProps } = getIndicatorProps?.(index) ?? {}\n\n        return (\n          <button\n            key={snap}\n            {...indicatorProps}\n            type=\"button\"\n            data-slot=\"carousel-indicator\"\n            data-active={selectedIndex === index ? true : undefined}\n            aria-label={`Go to slide ${index + 1}`}\n            className={cn(\n              'pointer-events-auto cursor-pointer size-2.5 touch-manipulation rounded-full bg-background opacity-60 shadow-sm ring-1 ring-border transition-opacity hover:opacity-100 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-3 focus-visible:outline-none data-[active=true]:opacity-100',\n              indicatorClassName\n            )}\n            onClick={(event) => {\n              scrollTo(index)\n              onClick?.(event)\n            }}\n          />\n        )\n      })}\n    </div>\n  )\n}\n\nexport { Carousel, CarouselContent, CarouselIndicators, CarouselItem, CarouselNext, CarouselPrevious, useCarousel }\n"],"mappings":"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"}

package/dist/components/carousel.spec.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/components/carousel.spec.js

@@ -0,0 +1,2 @@
+import"../chunk-CHh1Zzun.js";import{Carousel as e,CarouselContent as t,CarouselIndicators as n,CarouselItem as r}from"./carousel.js";import{a as i,n as a,r as o}from"../react.esm-D_dNEsWM.js";import{n as s}from"../dist-QvsLCO1I.js";import{jsx as c,jsxs as l}from"react/jsx-runtime";const u=s.hoisted(()=>({api:{canScrollPrev:s.fn(),canScrollNext:s.fn(),selectedScrollSnap:s.fn(),scrollSnapList:s.fn(),scrollPrev:s.fn(),scrollNext:s.fn(),scrollTo:s.fn(),on:s.fn(),off:s.fn()}}));s.mock(`embla-carousel-react`,()=>({default:s.fn(()=>[s.fn(),u.api])}));function renderCarousel(){return o(l(e,{children:[l(t,{children:[c(r,{children:`First`}),c(r,{children:`Second`}),c(r,{children:`Third`})]}),c(n,{})]}))}describe(`CarouselIndicators`,()=>{beforeEach(()=>{u.api.canScrollPrev.mockReturnValue(!0),u.api.canScrollNext.mockReturnValue(!0),u.api.selectedScrollSnap.mockReturnValue(1),u.api.scrollSnapList.mockReturnValue([0,1,2])}),it(`renders one indicator button per scroll snap`,async()=>{renderCarousel(),expect(await i.findAllByRole(`button`)).toHaveLength(3)}),it(`marks the selected indicator as active`,async()=>{renderCarousel();let e=await i.findByRole(`button`,{name:`Go to slide 2`});expect(e.getAttribute(`data-active`)).toBe(`true`),expect(i.getByRole(`button`,{name:`Go to slide 1`}).getAttribute(`data-active`)).toBeNull()}),it(`scrolls to the indicator index when clicked`,async()=>{renderCarousel(),a.click(await i.findByRole(`button`,{name:`Go to slide 3`})),expect(u.api.scrollTo).toHaveBeenCalledWith(2)}),it(`does not render indicators when there are no scroll snaps`,()=>{u.api.scrollSnapList.mockReturnValue([]);let{container:e}=renderCarousel();expect(e.querySelector(`[data-slot="carousel-indicators"]`)).toBeNull()})});
+//# sourceMappingURL=carousel.spec.js.map

package/dist/components/carousel.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.spec.js","names":[],"sources":["../../src/components/carousel.spec.tsx"],"sourcesContent":["import { fireEvent, render, screen } from '@testing-library/react'\nimport { vi } from 'vitest'\n\nconst emblaMock = vi.hoisted(() => {\n  return {\n    api: {\n      canScrollPrev: vi.fn(),\n      canScrollNext: vi.fn(),\n      selectedScrollSnap: vi.fn(),\n      scrollSnapList: vi.fn(),\n      scrollPrev: vi.fn(),\n      scrollNext: vi.fn(),\n      scrollTo: vi.fn(),\n      on: vi.fn(),\n      off: vi.fn()\n    }\n  }\n})\n\nvi.mock('embla-carousel-react', () => ({\n  default: vi.fn(() => [vi.fn(), emblaMock.api])\n}))\n\nimport { Carousel, CarouselContent, CarouselIndicators, CarouselItem } from './carousel'\n\nfunction renderCarousel() {\n  return render(\n    <Carousel>\n      <CarouselContent>\n        <CarouselItem>First</CarouselItem>\n        <CarouselItem>Second</CarouselItem>\n        <CarouselItem>Third</CarouselItem>\n      </CarouselContent>\n      <CarouselIndicators />\n    </Carousel>\n  )\n}\n\ndescribe('CarouselIndicators', () => {\n  beforeEach(() => {\n    emblaMock.api.canScrollPrev.mockReturnValue(true)\n    emblaMock.api.canScrollNext.mockReturnValue(true)\n    emblaMock.api.selectedScrollSnap.mockReturnValue(1)\n    emblaMock.api.scrollSnapList.mockReturnValue([0, 1, 2])\n  })\n\n  it('renders one indicator button per scroll snap', async () => {\n    renderCarousel()\n\n    expect(await screen.findAllByRole('button')).toHaveLength(3)\n  })\n\n  it('marks the selected indicator as active', async () => {\n    renderCarousel()\n\n    const selectedIndicator = await screen.findByRole('button', { name: 'Go to slide 2' })\n\n    expect(selectedIndicator.getAttribute('data-active')).toBe('true')\n    expect(screen.getByRole('button', { name: 'Go to slide 1' }).getAttribute('data-active')).toBeNull()\n  })\n\n  it('scrolls to the indicator index when clicked', async () => {\n    renderCarousel()\n\n    fireEvent.click(await screen.findByRole('button', { name: 'Go to slide 3' }))\n\n    expect(emblaMock.api.scrollTo).toHaveBeenCalledWith(2)\n  })\n\n  it('does not render indicators when there are no scroll snaps', () => {\n    emblaMock.api.scrollSnapList.mockReturnValue([])\n\n    const { container } = renderCarousel()\n\n    expect(container.querySelector('[data-slot=\"carousel-indicators\"]')).toBeNull()\n  })\n})\n"],"mappings":"0RAGA,MAAM,EAAY,EAAG,aACZ,CACL,IAAK,CACH,cAAe,EAAG,IAAI,CACtB,cAAe,EAAG,IAAI,CACtB,mBAAoB,EAAG,IAAI,CAC3B,eAAgB,EAAG,IAAI,CACvB,WAAY,EAAG,IAAI,CACnB,WAAY,EAAG,IAAI,CACnB,SAAU,EAAG,IAAI,CACjB,GAAI,EAAG,IAAI,CACX,IAAK,EAAG,IAAI,CACb,CACF,EACD,CAEF,EAAG,KAAK,4BAA+B,CACrC,QAAS,EAAG,OAAS,CAAC,EAAG,IAAI,CAAE,EAAU,IAAI,CAAC,CAC/C,EAAE,CAIH,SAAS,gBAAiB,CACxB,OAAO,EACL,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAA,SAAc,QAAoB,CAAA,CAClC,EAAC,EAAD,CAAA,SAAc,SAAqB,CAAA,CACnC,EAAC,EAAD,CAAA,SAAc,QAAoB,CAAA,CAClB,CAAA,CAAA,CAClB,EAAC,EAAD,EAAsB,CAAA,CACb,CAAA,CAAA,CACZ,CAGH,SAAS,yBAA4B,CACnC,eAAiB,CACf,EAAU,IAAI,cAAc,gBAAgB,GAAK,CACjD,EAAU,IAAI,cAAc,gBAAgB,GAAK,CACjD,EAAU,IAAI,mBAAmB,gBAAgB,EAAE,CACnD,EAAU,IAAI,eAAe,gBAAgB,CAAC,EAAG,EAAG,EAAE,CAAC,EACvD,CAEF,GAAG,+CAAgD,SAAY,CAC7D,gBAAgB,CAEhB,OAAO,MAAM,EAAO,cAAc,SAAS,CAAC,CAAC,aAAa,EAAE,EAC5D,CAEF,GAAG,yCAA0C,SAAY,CACvD,gBAAgB,CAEhB,IAAM,EAAoB,MAAM,EAAO,WAAW,SAAU,CAAE,KAAM,gBAAiB,CAAC,CAEtF,OAAO,EAAkB,aAAa,cAAc,CAAC,CAAC,KAAK,OAAO,CAClE,OAAO,EAAO,UAAU,SAAU,CAAE,KAAM,gBAAiB,CAAC,CAAC,aAAa,cAAc,CAAC,CAAC,UAAU,EACpG,CAEF,GAAG,8CAA+C,SAAY,CAC5D,gBAAgB,CAEhB,EAAU,MAAM,MAAM,EAAO,WAAW,SAAU,CAAE,KAAM,gBAAiB,CAAC,CAAC,CAE7E,OAAO,EAAU,IAAI,SAAS,CAAC,qBAAqB,EAAE,EACtD,CAEF,GAAG,gEAAmE,CACpE,EAAU,IAAI,eAAe,gBAAgB,EAAE,CAAC,CAEhD,GAAM,CAAE,aAAc,gBAAgB,CAEtC,OAAO,EAAU,cAAc,oCAAoC,CAAC,CAAC,UAAU,EAC/E,EACF"}

package/dist/components/field.spec.js

@@ -1,2 +1,2 @@
-import"../chunk-CHh1Zzun.js";import{Field as e,FieldLabel as t}from"./field.js";import{Checkbox as n}from"./checkbox.js";import{Input as r}from"./input.js";import{Textarea as i}from"./textarea.js";import{NativeSelect as a,NativeSelectOption as o}from"./native-select.js";import{Select as s,SelectTrigger as c,SelectValue as l}from"./select.js";import{i as u,n as d}from"../react.esm-B3a5z6DL.js";import{Fragment as f,jsx as p,jsxs as m}from"react/jsx-runtime";describe(`Field automatic control ids`,()=>{it(`wires FieldLabel and Input with a generated id when ids are omitted`,()=>{d(m(e,{children:[p(t,{children:`Email`}),p(r,{})]}));let n=u.getByLabelText(`Email`),i=u.getByText(`Email`);expect(n.getAttribute(`id`)).toBeTruthy(),expect(i.getAttribute(`for`)).toBe(n.getAttribute(`id`))}),it(`preserves explicit input ids and label htmlFor values`,()=>{d(m(e,{children:[p(t,{htmlFor:`explicit-label-target`,children:`Email`}),p(r,{id:`explicit-input`})]})),expect(u.getByText(`Email`).getAttribute(`for`)).toBe(`explicit-label-target`),expect(document.getElementById(`explicit-input`)).not.toBeNull()}),it(`does not assign ids or throw outside Field`,()=>{let{container:e}=d(m(f,{children:[p(t,{children:`Email`}),p(r,{})]}));expect(e.querySelector(`[data-slot="field-label"]`)?.getAttribute(`for`)).toBeNull(),expect(e.querySelector(`[data-slot="input"]`)?.getAttribute(`id`)).toBeNull()}),it(`wires representative controls to the generated Field id`,()=>{d(m(f,{children:[m(e,{children:[p(t,{children:`Message`}),p(i,{})]}),m(e,{children:[p(t,{children:`Framework`}),p(a,{children:p(o,{value:`react`,children:`React`})})]}),m(e,{children:[p(t,{children:`Category`}),p(s,{children:p(c,{children:p(l,{placeholder:`Select a category`})})})]}),m(e,{children:[p(t,{children:`Terms`}),p(n,{})]})]}));for(let e of[`Message`,`Framework`,`Category`,`Terms`]){let t=u.getByText(e).getAttribute(`for`);expect(t).toBeTruthy(),expect(document.getElementById(t??``)).not.toBeNull()}})});
+import"../chunk-CHh1Zzun.js";import{Field as e,FieldLabel as t}from"./field.js";import{Checkbox as n}from"./checkbox.js";import{Input as r}from"./input.js";import{Textarea as i}from"./textarea.js";import{NativeSelect as a,NativeSelectOption as o}from"./native-select.js";import{Select as s,SelectTrigger as c,SelectValue as l}from"./select.js";import{a as u,r as d}from"../react.esm-D_dNEsWM.js";import{Fragment as f,jsx as p,jsxs as m}from"react/jsx-runtime";describe(`Field automatic control ids`,()=>{it(`wires FieldLabel and Input with a generated id when ids are omitted`,()=>{d(m(e,{children:[p(t,{children:`Email`}),p(r,{})]}));let n=u.getByLabelText(`Email`),i=u.getByText(`Email`);expect(n.getAttribute(`id`)).toBeTruthy(),expect(i.getAttribute(`for`)).toBe(n.getAttribute(`id`))}),it(`preserves explicit input ids and label htmlFor values`,()=>{d(m(e,{children:[p(t,{htmlFor:`explicit-label-target`,children:`Email`}),p(r,{id:`explicit-input`})]})),expect(u.getByText(`Email`).getAttribute(`for`)).toBe(`explicit-label-target`),expect(document.getElementById(`explicit-input`)).not.toBeNull()}),it(`does not assign ids or throw outside Field`,()=>{let{container:e}=d(m(f,{children:[p(t,{children:`Email`}),p(r,{})]}));expect(e.querySelector(`[data-slot="field-label"]`)?.getAttribute(`for`)).toBeNull(),expect(e.querySelector(`[data-slot="input"]`)?.getAttribute(`id`)).toBeNull()}),it(`wires representative controls to the generated Field id`,()=>{d(m(f,{children:[m(e,{children:[p(t,{children:`Message`}),p(i,{})]}),m(e,{children:[p(t,{children:`Framework`}),p(a,{children:p(o,{value:`react`,children:`React`})})]}),m(e,{children:[p(t,{children:`Category`}),p(s,{children:p(c,{children:p(l,{placeholder:`Select a category`})})})]}),m(e,{children:[p(t,{children:`Terms`}),p(n,{})]})]}));for(let e of[`Message`,`Framework`,`Category`,`Terms`]){let t=u.getByText(e).getAttribute(`for`);expect(t).toBeTruthy(),expect(document.getElementById(t??``)).not.toBeNull()}})});
 //# sourceMappingURL=field.spec.js.map

package/dist/components/flex.d.ts

@@ -0,0 +1,27 @@
+import { n as __name } from "../chunk-CHh1Zzun.js";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import * as React from "react";
+import * as _$class_variance_authority_types0 from "class-variance-authority/types";
+
+//#region src/components/flex.d.ts
+declare const flexVariants: (props?: ({
+  direction?: "row" | "row-reverse" | "column" | "column-reverse" | null | undefined;
+  align?: "center" | "start" | "end" | "baseline" | "stretch" | null | undefined;
+  justify?: "center" | "start" | "end" | "between" | "around" | "evenly" | null | undefined;
+  wrap?: boolean | null | undefined;
+  gap?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
+} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
+type FlexProps = React.ComponentProps<'div'> & VariantProps<typeof flexVariants>;
+declare function Flex({
+  className,
+  direction,
+  align,
+  justify,
+  wrap,
+  gap,
+  ...props
+}: FlexProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Flex, FlexProps, flexVariants };
+//# sourceMappingURL=flex.d.ts.map

package/dist/components/flex.js

@@ -0,0 +1,2 @@
+import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";import{cva as n}from"class-variance-authority";const r=n(`flex min-w-0`,{variants:{direction:{row:`flex-row`,"row-reverse":`flex-row-reverse`,column:`flex-col`,"column-reverse":`flex-col-reverse`},align:{start:`items-start`,end:`items-end`,center:`items-center`,baseline:`items-baseline`,stretch:`items-stretch`},justify:{start:`justify-start`,end:`justify-end`,center:`justify-center`,between:`justify-between`,around:`justify-around`,evenly:`justify-evenly`},wrap:{true:`flex-wrap`,false:`flex-nowrap`},gap:{xs:`gap-1`,sm:`gap-2`,md:`gap-4`,lg:`gap-6`,xl:`gap-8`}},defaultVariants:{direction:`row`,wrap:!1}});function Flex({className:n,direction:i=`row`,align:a,justify:o,wrap:s=!1,gap:c,...l}){return t(`div`,{"data-slot":`flex`,"data-direction":i,"data-align":a,"data-justify":o,"data-wrap":s?`true`:`false`,"data-gap":c,className:e(r({direction:i,align:a,justify:o,wrap:s,gap:c}),n),...l})}export{Flex,r as flexVariants};
+//# sourceMappingURL=flex.js.map

package/dist/components/flex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flex.js","names":[],"sources":["../../src/components/flex.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst flexVariants = cva('flex min-w-0', {\n  variants: {\n    direction: {\n      row: 'flex-row',\n      'row-reverse': 'flex-row-reverse',\n      column: 'flex-col',\n      'column-reverse': 'flex-col-reverse'\n    },\n    align: {\n      start: 'items-start',\n      end: 'items-end',\n      center: 'items-center',\n      baseline: 'items-baseline',\n      stretch: 'items-stretch'\n    },\n    justify: {\n      start: 'justify-start',\n      end: 'justify-end',\n      center: 'justify-center',\n      between: 'justify-between',\n      around: 'justify-around',\n      evenly: 'justify-evenly'\n    },\n    wrap: {\n      true: 'flex-wrap',\n      false: 'flex-nowrap'\n    },\n    gap: {\n      xs: 'gap-1',\n      sm: 'gap-2',\n      md: 'gap-4',\n      lg: 'gap-6',\n      xl: 'gap-8'\n    }\n  },\n  defaultVariants: {\n    direction: 'row',\n    wrap: false\n  }\n})\n\nexport type FlexProps = React.ComponentProps<'div'> & VariantProps<typeof flexVariants>\n\nfunction Flex({ className, direction = 'row', align, justify, wrap = false, gap, ...props }: FlexProps) {\n  return (\n    <div\n      data-slot=\"flex\"\n      data-direction={direction}\n      data-align={align}\n      data-justify={justify}\n      data-wrap={wrap ? 'true' : 'false'}\n      data-gap={gap}\n      className={cn(flexVariants({ direction, align, justify, wrap, gap }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Flex, flexVariants }\n"],"mappings":"yJAMA,MAAM,EAAe,EAAI,eAAgB,CACvC,SAAU,CACR,UAAW,CACT,IAAK,WACL,cAAe,mBACf,OAAQ,WACR,iBAAkB,mBACnB,CACD,MAAO,CACL,MAAO,cACP,IAAK,YACL,OAAQ,eACR,SAAU,iBACV,QAAS,gBACV,CACD,QAAS,CACP,MAAO,gBACP,IAAK,cACL,OAAQ,iBACR,QAAS,kBACT,OAAQ,iBACR,OAAQ,iBACT,CACD,KAAM,CACJ,KAAM,YACN,MAAO,cACR,CACD,IAAK,CACH,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACL,CACF,CACD,gBAAiB,CACf,UAAW,MACX,KAAM,GACP,CACF,CAAC,CAIF,SAAS,KAAK,CAAE,YAAW,YAAY,MAAO,QAAO,UAAS,OAAO,GAAO,MAAK,GAAG,GAAoB,CACtG,OACE,EAAC,MAAD,CACE,YAAU,OACV,iBAAgB,EAChB,aAAY,EACZ,eAAc,EACd,YAAW,EAAO,OAAS,QAC3B,WAAU,EACV,UAAW,EAAG,EAAa,CAAE,YAAW,QAAO,UAAS,OAAM,MAAK,CAAC,CAAE,EAAU,CAChF,GAAI,EACJ,CAAA"}

package/dist/components/grid.js

@@ -1,2 +1,2 @@
-import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";const n={xs:1,sm:2,md:3,lg:4,xl:6};function toSpacingValue(e){return`calc(var(--spacing) * ${n[e]})`}function Grid({className:n,gap:r,rowGap:i,columnGap:a,templateRows:o,templateColumns:s=`repeat(12, minmax(0, 1fr))`,style:c,...l}){return t(`div`,{"data-slot":`grid`,className:e(`grid min-w-0`,`grid-cols-(--grid-template-columns) grid-rows-(--grid-template-rows)`,`gap-(--grid-gap) gap-y-(--grid-row-gap) gap-x-(--grid-column-gap)`,n),style:{"--grid-template-columns":s,"--grid-template-rows":o,"--grid-gap":r?toSpacingValue(r):`0px`,"--grid-row-gap":i?toSpacingValue(i):`var(--grid-gap)`,"--grid-column-gap":a?toSpacingValue(a):`var(--grid-gap)`,...c},...l})}function GridItem({className:n,rowSpan:r,colSpan:i=12,style:a,...o}){return t(`div`,{"data-slot":`grid-item`,className:e(`min-w-0`,`col-[span_var(--grid-item-col-span)/span_var(--grid-item-col-span)]`,`row-[span_var(--grid-item-row-span)/span_var(--grid-item-row-span)]`,n),style:{"--grid-item-col-span":i,"--grid-item-row-span":r,...a},...o})}export{Grid,GridItem};
+import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";const n={xs:1,sm:2,md:4,lg:6,xl:8};function toSpacingValue(e){return`calc(var(--spacing) * ${n[e]})`}function Grid({className:n,gap:r,rowGap:i,columnGap:a,templateRows:o,templateColumns:s=`repeat(12, minmax(0, 1fr))`,style:c,...l}){return t(`div`,{"data-slot":`grid`,className:e(`grid min-w-0`,`grid-cols-(--grid-template-columns) grid-rows-(--grid-template-rows)`,`gap-(--grid-gap) gap-y-(--grid-row-gap) gap-x-(--grid-column-gap)`,n),style:{"--grid-template-columns":s,"--grid-template-rows":o,"--grid-gap":r?toSpacingValue(r):`0px`,"--grid-row-gap":i?toSpacingValue(i):`var(--grid-gap)`,"--grid-column-gap":a?toSpacingValue(a):`var(--grid-gap)`,...c},...l})}function GridItem({className:n,rowSpan:r,colSpan:i=12,style:a,...o}){return t(`div`,{"data-slot":`grid-item`,className:e(`min-w-0`,`col-[span_var(--grid-item-col-span)/span_var(--grid-item-col-span)]`,`row-[span_var(--grid-item-row-span)/span_var(--grid-item-row-span)]`,n),style:{"--grid-item-col-span":i,"--grid-item-row-span":r,...a},...o})}export{Grid,GridItem};
 //# sourceMappingURL=grid.js.map

package/dist/components/grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid.js","names":[],"sources":["../../src/components/grid.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\ntype GridSpacing = 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n\nconst spacingScale: Record<GridSpacing, number> = {\n  xs: 1,\n  sm: 2,\n  md: 3,\n  lg: 4,\n  xl: 6\n}\n\nfunction toSpacingValue(spacing: GridSpacing) {\n  return `calc(var(--spacing) * ${spacingScale[spacing]})`\n}\n\nexport type GridProps = React.ComponentProps<'div'> & {\n  gap?: GridSpacing\n  rowGap?: GridSpacing\n  columnGap?: GridSpacing\n  templateRows?: string\n  templateColumns?: string\n}\n\nfunction Grid({\n  className,\n  gap,\n  rowGap,\n  columnGap,\n  templateRows,\n  templateColumns = 'repeat(12, minmax(0, 1fr))',\n  style,\n  ...props\n}: GridProps) {\n  return (\n    <div\n      data-slot=\"grid\"\n      className={cn(\n        'grid min-w-0',\n        'grid-cols-(--grid-template-columns) grid-rows-(--grid-template-rows)',\n        'gap-(--grid-gap) gap-y-(--grid-row-gap) gap-x-(--grid-column-gap)',\n        className\n      )}\n      style={\n        {\n          '--grid-template-columns': templateColumns,\n          '--grid-template-rows': templateRows,\n          '--grid-gap': gap ? toSpacingValue(gap) : '0px',\n          '--grid-row-gap': rowGap ? toSpacingValue(rowGap) : 'var(--grid-gap)',\n          '--grid-column-gap': columnGap ? toSpacingValue(columnGap) : 'var(--grid-gap)',\n          ...style\n        } as React.CSSProperties\n      }\n      {...props}\n    />\n  )\n}\n\nexport type GridItemProps = React.ComponentProps<'div'> & {\n  rowSpan?: number\n  colSpan?: number\n}\n\nfunction GridItem({ className, rowSpan, colSpan = 12, style, ...props }: GridItemProps) {\n  return (\n    <div\n      data-slot=\"grid-item\"\n      className={cn(\n        'min-w-0',\n        'col-[span_var(--grid-item-col-span)/span_var(--grid-item-col-span)]',\n        'row-[span_var(--grid-item-row-span)/span_var(--grid-item-row-span)]',\n        className\n      )}\n      style={\n        {\n          '--grid-item-col-span': colSpan,\n          '--grid-item-row-span': rowSpan,\n          ...style\n        } as React.CSSProperties\n      }\n      {...props}\n    />\n  )\n}\n\nexport { Grid, GridItem }\n"],"mappings":"0GAMA,MAAM,EAA4C,CAChD,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,EACL,CAED,SAAS,eAAe,EAAsB,CAC5C,MAAO,yBAAyB,EAAa,GAAS,GAWxD,SAAS,KAAK,CACZ,YACA,MACA,SACA,YACA,eACA,kBAAkB,6BAClB,QACA,GAAG,GACS,CACZ,OACE,EAAC,MAAD,CACE,YAAU,OACV,UAAW,EACT,eACA,uEACA,oEACA,EACD,CACD,MACE,CACE,0BAA2B,EAC3B,uBAAwB,EACxB,aAAc,EAAM,eAAe,EAAI,CAAG,MAC1C,iBAAkB,EAAS,eAAe,EAAO,CAAG,kBACpD,oBAAqB,EAAY,eAAe,EAAU,CAAG,kBAC7D,GAAG,EACJ,CAEH,GAAI,EACJ,CAAA,CASN,SAAS,SAAS,CAAE,YAAW,UAAS,UAAU,GAAI,QAAO,GAAG,GAAwB,CACtF,OACE,EAAC,MAAD,CACE,YAAU,YACV,UAAW,EACT,UACA,sEACA,sEACA,EACD,CACD,MACE,CACE,uBAAwB,EACxB,uBAAwB,EACxB,GAAG,EACJ,CAEH,GAAI,EACJ,CAAA"}
+{"version":3,"file":"grid.js","names":[],"sources":["../../src/components/grid.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\ntype GridSpacing = 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n\nconst spacingScale: Record<GridSpacing, number> = {\n  xs: 1,\n  sm: 2,\n  md: 4,\n  lg: 6,\n  xl: 8\n}\n\nfunction toSpacingValue(spacing: GridSpacing) {\n  return `calc(var(--spacing) * ${spacingScale[spacing]})`\n}\n\nexport type GridProps = React.ComponentProps<'div'> & {\n  gap?: GridSpacing\n  rowGap?: GridSpacing\n  columnGap?: GridSpacing\n  templateRows?: string\n  templateColumns?: string\n}\n\nfunction Grid({\n  className,\n  gap,\n  rowGap,\n  columnGap,\n  templateRows,\n  templateColumns = 'repeat(12, minmax(0, 1fr))',\n  style,\n  ...props\n}: GridProps) {\n  return (\n    <div\n      data-slot=\"grid\"\n      className={cn(\n        'grid min-w-0',\n        'grid-cols-(--grid-template-columns) grid-rows-(--grid-template-rows)',\n        'gap-(--grid-gap) gap-y-(--grid-row-gap) gap-x-(--grid-column-gap)',\n        className\n      )}\n      style={\n        {\n          '--grid-template-columns': templateColumns,\n          '--grid-template-rows': templateRows,\n          '--grid-gap': gap ? toSpacingValue(gap) : '0px',\n          '--grid-row-gap': rowGap ? toSpacingValue(rowGap) : 'var(--grid-gap)',\n          '--grid-column-gap': columnGap ? toSpacingValue(columnGap) : 'var(--grid-gap)',\n          ...style\n        } as React.CSSProperties\n      }\n      {...props}\n    />\n  )\n}\n\nexport type GridItemProps = React.ComponentProps<'div'> & {\n  rowSpan?: number\n  colSpan?: number\n}\n\nfunction GridItem({ className, rowSpan, colSpan = 12, style, ...props }: GridItemProps) {\n  return (\n    <div\n      data-slot=\"grid-item\"\n      className={cn(\n        'min-w-0',\n        'col-[span_var(--grid-item-col-span)/span_var(--grid-item-col-span)]',\n        'row-[span_var(--grid-item-row-span)/span_var(--grid-item-row-span)]',\n        className\n      )}\n      style={\n        {\n          '--grid-item-col-span': colSpan,\n          '--grid-item-row-span': rowSpan,\n          ...style\n        } as React.CSSProperties\n      }\n      {...props}\n    />\n  )\n}\n\nexport { Grid, GridItem }\n"],"mappings":"0GAMA,MAAM,EAA4C,CAChD,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,EACL,CAED,SAAS,eAAe,EAAsB,CAC5C,MAAO,yBAAyB,EAAa,GAAS,GAWxD,SAAS,KAAK,CACZ,YACA,MACA,SACA,YACA,eACA,kBAAkB,6BAClB,QACA,GAAG,GACS,CACZ,OACE,EAAC,MAAD,CACE,YAAU,OACV,UAAW,EACT,eACA,uEACA,oEACA,EACD,CACD,MACE,CACE,0BAA2B,EAC3B,uBAAwB,EACxB,aAAc,EAAM,eAAe,EAAI,CAAG,MAC1C,iBAAkB,EAAS,eAAe,EAAO,CAAG,kBACpD,oBAAqB,EAAY,eAAe,EAAU,CAAG,kBAC7D,GAAG,EACJ,CAEH,GAAI,EACJ,CAAA,CASN,SAAS,SAAS,CAAE,YAAW,UAAS,UAAU,GAAI,QAAO,GAAG,GAAwB,CACtF,OACE,EAAC,MAAD,CACE,YAAU,YACV,UAAW,EACT,UACA,sEACA,sEACA,EACD,CACD,MACE,CACE,uBAAwB,EACxB,uBAAwB,EACxB,GAAG,EACJ,CAEH,GAAI,EACJ,CAAA"}

package/dist/components/group.js

@@ -1,2 +1,2 @@
-import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";import{cva as n}from"class-variance-authority";const r=n(`flex flex-row items-center`,{variants:{gap:{xs:`gap-1`,sm:`gap-2`,md:`gap-3`,lg:`gap-4`,xl:`gap-6`},wrap:{true:`flex-wrap`,false:`flex-nowrap`}},defaultVariants:{gap:`md`,wrap:!1}});function Group({className:n,gap:i=`md`,wrap:a=!1,...o}){return t(`div`,{"data-slot":`group`,"data-gap":i,"data-wrap":a?`true`:`false`,className:e(r({gap:i,wrap:a}),n),...o})}export{Group,r as groupVariants};
+import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";import{cva as n}from"class-variance-authority";const r=n(`flex flex-row items-center`,{variants:{gap:{xs:`gap-1`,sm:`gap-2`,md:`gap-4`,lg:`gap-6`,xl:`gap-8`},wrap:{true:`flex-wrap`,false:`flex-nowrap`}},defaultVariants:{gap:`md`,wrap:!1}});function Group({className:n,gap:i=`md`,wrap:a=!1,...o}){return t(`div`,{"data-slot":`group`,"data-gap":i,"data-wrap":a?`true`:`false`,className:e(r({gap:i,wrap:a}),n),...o})}export{Group,r as groupVariants};
 //# sourceMappingURL=group.js.map

package/dist/components/group.js.map

@@ -1 +1 @@
-{"version":3,"file":"group.js","names":[],"sources":["../../src/components/group.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst groupVariants = cva('flex flex-row items-center', {\n  variants: {\n    gap: {\n      xs: 'gap-1',\n      sm: 'gap-2',\n      md: 'gap-3',\n      lg: 'gap-4',\n      xl: 'gap-6'\n    },\n    wrap: {\n      true: 'flex-wrap',\n      false: 'flex-nowrap'\n    }\n  },\n  defaultVariants: {\n    gap: 'md',\n    wrap: false\n  }\n})\n\nexport type GroupProps = React.ComponentProps<'div'> & VariantProps<typeof groupVariants>\n\nfunction Group({ className, gap = 'md', wrap = false, ...props }: GroupProps) {\n  return (\n    <div\n      data-slot=\"group\"\n      data-gap={gap}\n      data-wrap={wrap ? 'true' : 'false'}\n      className={cn(groupVariants({ gap, wrap }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Group, groupVariants }\n"],"mappings":"yJAMA,MAAM,EAAgB,EAAI,6BAA8B,CACtD,SAAU,CACR,IAAK,CACH,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACL,CACD,KAAM,CACJ,KAAM,YACN,MAAO,cACR,CACF,CACD,gBAAiB,CACf,IAAK,KACL,KAAM,GACP,CACF,CAAC,CAIF,SAAS,MAAM,CAAE,YAAW,MAAM,KAAM,OAAO,GAAO,GAAG,GAAqB,CAC5E,OACE,EAAC,MAAD,CACE,YAAU,QACV,WAAU,EACV,YAAW,EAAO,OAAS,QAC3B,UAAW,EAAG,EAAc,CAAE,MAAK,OAAM,CAAC,CAAE,EAAU,CACtD,GAAI,EACJ,CAAA"}
+{"version":3,"file":"group.js","names":[],"sources":["../../src/components/group.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst groupVariants = cva('flex flex-row items-center', {\n  variants: {\n    gap: {\n      xs: 'gap-1',\n      sm: 'gap-2',\n      md: 'gap-4',\n      lg: 'gap-6',\n      xl: 'gap-8'\n    },\n    wrap: {\n      true: 'flex-wrap',\n      false: 'flex-nowrap'\n    }\n  },\n  defaultVariants: {\n    gap: 'md',\n    wrap: false\n  }\n})\n\nexport type GroupProps = React.ComponentProps<'div'> & VariantProps<typeof groupVariants>\n\nfunction Group({ className, gap = 'md', wrap = false, ...props }: GroupProps) {\n  return (\n    <div\n      data-slot=\"group\"\n      data-gap={gap}\n      data-wrap={wrap ? 'true' : 'false'}\n      className={cn(groupVariants({ gap, wrap }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Group, groupVariants }\n"],"mappings":"yJAMA,MAAM,EAAgB,EAAI,6BAA8B,CACtD,SAAU,CACR,IAAK,CACH,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACL,CACD,KAAM,CACJ,KAAM,YACN,MAAO,cACR,CACF,CACD,gBAAiB,CACf,IAAK,KACL,KAAM,GACP,CACF,CAAC,CAIF,SAAS,MAAM,CAAE,YAAW,MAAM,KAAM,OAAO,GAAO,GAAG,GAAqB,CAC5E,OACE,EAAC,MAAD,CACE,YAAU,QACV,WAAU,EACV,YAAW,EAAO,OAAS,QAC3B,UAAW,EAAG,EAAc,CAAE,MAAK,OAAM,CAAC,CAAE,EAAU,CACtD,GAAI,EACJ,CAAA"}

package/dist/components/simple-grid.js

@@ -1,2 +1,2 @@
-import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";const n={xs:1,sm:2,md:3,lg:4,xl:6};function toSpacingValue(e){return`calc(var(--spacing) * ${n[e]})`}function SimpleGrid({className:n,cols:r=1,gap:i,rowGap:a,columnGap:o,style:s,...c}){return t(`div`,{"data-slot":`simple-grid`,className:e(`grid min-w-0`,`[grid-template-columns:repeat(var(--simple-grid-cols),minmax(0,1fr))]`,`gap-[var(--simple-grid-gap)] gap-y-[var(--simple-grid-row-gap)] gap-x-[var(--simple-grid-column-gap)]`,n),style:{"--simple-grid-cols":r,"--simple-grid-gap":i?toSpacingValue(i):`0px`,"--simple-grid-row-gap":a?toSpacingValue(a):`var(--simple-grid-gap)`,"--simple-grid-column-gap":o?toSpacingValue(o):`var(--simple-grid-gap)`,...s},...c})}export{SimpleGrid};
+import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";const n={xs:1,sm:2,md:4,lg:6,xl:8};function toSpacingValue(e){return`calc(var(--spacing) * ${n[e]})`}function SimpleGrid({className:n,cols:r=1,gap:i,rowGap:a,columnGap:o,style:s,...c}){return t(`div`,{"data-slot":`simple-grid`,className:e(`grid min-w-0`,`[grid-template-columns:repeat(var(--simple-grid-cols),minmax(0,1fr))]`,`gap-[var(--simple-grid-gap)] gap-y-[var(--simple-grid-row-gap)] gap-x-[var(--simple-grid-column-gap)]`,n),style:{"--simple-grid-cols":r,"--simple-grid-gap":i?toSpacingValue(i):`0px`,"--simple-grid-row-gap":a?toSpacingValue(a):`var(--simple-grid-gap)`,"--simple-grid-column-gap":o?toSpacingValue(o):`var(--simple-grid-gap)`,...s},...c})}export{SimpleGrid};
 //# sourceMappingURL=simple-grid.js.map

package/dist/components/simple-grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"simple-grid.js","names":[],"sources":["../../src/components/simple-grid.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\ntype SimpleGridSpacing = 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n\nconst spacingScale: Record<SimpleGridSpacing, number> = {\n  xs: 1,\n  sm: 2,\n  md: 3,\n  lg: 4,\n  xl: 6\n}\n\nfunction toSpacingValue(spacing: SimpleGridSpacing) {\n  return `calc(var(--spacing) * ${spacingScale[spacing]})`\n}\n\nexport type SimpleGridProps = React.ComponentProps<'div'> & {\n  cols?: number\n  gap?: SimpleGridSpacing\n  rowGap?: SimpleGridSpacing\n  columnGap?: SimpleGridSpacing\n}\n\nfunction SimpleGrid({ className, cols = 1, gap, rowGap, columnGap, style, ...props }: SimpleGridProps) {\n  return (\n    <div\n      data-slot=\"simple-grid\"\n      className={cn(\n        'grid min-w-0',\n        '[grid-template-columns:repeat(var(--simple-grid-cols),minmax(0,1fr))]',\n        'gap-[var(--simple-grid-gap)] gap-y-[var(--simple-grid-row-gap)] gap-x-[var(--simple-grid-column-gap)]',\n        className\n      )}\n      style={\n        {\n          '--simple-grid-cols': cols,\n          '--simple-grid-gap': gap ? toSpacingValue(gap) : '0px',\n          '--simple-grid-row-gap': rowGap ? toSpacingValue(rowGap) : 'var(--simple-grid-gap)',\n          '--simple-grid-column-gap': columnGap ? toSpacingValue(columnGap) : 'var(--simple-grid-gap)',\n          ...style\n        } as React.CSSProperties\n      }\n      {...props}\n    />\n  )\n}\n\nexport { SimpleGrid }\n"],"mappings":"0GAMA,MAAM,EAAkD,CACtD,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,EACL,CAED,SAAS,eAAe,EAA4B,CAClD,MAAO,yBAAyB,EAAa,GAAS,GAUxD,SAAS,WAAW,CAAE,YAAW,OAAO,EAAG,MAAK,SAAQ,YAAW,QAAO,GAAG,GAA0B,CACrG,OACE,EAAC,MAAD,CACE,YAAU,cACV,UAAW,EACT,eACA,wEACA,wGACA,EACD,CACD,MACE,CACE,qBAAsB,EACtB,oBAAqB,EAAM,eAAe,EAAI,CAAG,MACjD,wBAAyB,EAAS,eAAe,EAAO,CAAG,yBAC3D,2BAA4B,EAAY,eAAe,EAAU,CAAG,yBACpE,GAAG,EACJ,CAEH,GAAI,EACJ,CAAA"}
+{"version":3,"file":"simple-grid.js","names":[],"sources":["../../src/components/simple-grid.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\ntype SimpleGridSpacing = 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n\nconst spacingScale: Record<SimpleGridSpacing, number> = {\n  xs: 1,\n  sm: 2,\n  md: 4,\n  lg: 6,\n  xl: 8\n}\n\nfunction toSpacingValue(spacing: SimpleGridSpacing) {\n  return `calc(var(--spacing) * ${spacingScale[spacing]})`\n}\n\nexport type SimpleGridProps = React.ComponentProps<'div'> & {\n  cols?: number\n  gap?: SimpleGridSpacing\n  rowGap?: SimpleGridSpacing\n  columnGap?: SimpleGridSpacing\n}\n\nfunction SimpleGrid({ className, cols = 1, gap, rowGap, columnGap, style, ...props }: SimpleGridProps) {\n  return (\n    <div\n      data-slot=\"simple-grid\"\n      className={cn(\n        'grid min-w-0',\n        '[grid-template-columns:repeat(var(--simple-grid-cols),minmax(0,1fr))]',\n        'gap-[var(--simple-grid-gap)] gap-y-[var(--simple-grid-row-gap)] gap-x-[var(--simple-grid-column-gap)]',\n        className\n      )}\n      style={\n        {\n          '--simple-grid-cols': cols,\n          '--simple-grid-gap': gap ? toSpacingValue(gap) : '0px',\n          '--simple-grid-row-gap': rowGap ? toSpacingValue(rowGap) : 'var(--simple-grid-gap)',\n          '--simple-grid-column-gap': columnGap ? toSpacingValue(columnGap) : 'var(--simple-grid-gap)',\n          ...style\n        } as React.CSSProperties\n      }\n      {...props}\n    />\n  )\n}\n\nexport { SimpleGrid }\n"],"mappings":"0GAMA,MAAM,EAAkD,CACtD,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,EACL,CAED,SAAS,eAAe,EAA4B,CAClD,MAAO,yBAAyB,EAAa,GAAS,GAUxD,SAAS,WAAW,CAAE,YAAW,OAAO,EAAG,MAAK,SAAQ,YAAW,QAAO,GAAG,GAA0B,CACrG,OACE,EAAC,MAAD,CACE,YAAU,cACV,UAAW,EACT,eACA,wEACA,wGACA,EACD,CACD,MACE,CACE,qBAAsB,EACtB,oBAAqB,EAAM,eAAe,EAAI,CAAG,MACjD,wBAAyB,EAAS,eAAe,EAAO,CAAG,yBAC3D,2BAA4B,EAAY,eAAe,EAAU,CAAG,yBACpE,GAAG,EACJ,CAEH,GAAI,EACJ,CAAA"}

package/dist/components/skeleton.spec.js

@@ -1,2 +1,2 @@
-import"../chunk-CHh1Zzun.js";import{Skeleton as e}from"./skeleton.js";import{i as t,n}from"../react.esm-B3a5z6DL.js";import{jsx as r}from"react/jsx-runtime";describe(`Skeleton`,()=>{it(`renders the legacy placeholder when children are not provided`,()=>{let{container:t}=n(r(e,{className:`h-4 w-48`})),i=t.querySelector(`[data-slot="skeleton"]`);expect(i).not.toBeNull(),expect(i?.className).toContain(`bg-muted`),expect(i?.className).toContain(`animate-pulse`),expect(i?.className).toContain(`h-4`),expect(t.querySelector(`[data-slot="skeleton-overlay"]`)).toBeNull()}),it(`keeps children in the DOM and renders an overlay when visible`,()=>{let{container:i}=n(r(e,{visible:!0,children:r(`button`,{type:`button`,children:`Save changes`})})),a=i.querySelector(`[data-slot="skeleton-content"]`),o=i.querySelector(`[data-slot="skeleton-overlay"]`);expect(t.getByRole(`button`,{hidden:!0,name:`Save changes`})).not.toBeNull(),expect(a?.className).toContain(`invisible`),expect(a?.getAttribute(`aria-hidden`)).toBe(`true`),expect(o).not.toBeNull(),expect(o?.className).toContain(`absolute`),expect(o?.className).toContain(`inset-0`)}),it(`shows children and does not render an overlay when hidden`,()=>{let{container:i}=n(r(e,{visible:!1,children:r(`button`,{type:`button`,children:`Save changes`})})),a=i.querySelector(`[data-slot="skeleton-content"]`);expect(t.getByRole(`button`,{name:`Save changes`})).not.toBeNull(),expect(a?.className).not.toContain(`invisible`),expect(a?.getAttribute(`aria-hidden`)).toBeNull(),expect(i.querySelector(`[data-slot="skeleton-overlay"]`)).toBeNull()})});
+import"../chunk-CHh1Zzun.js";import{Skeleton as e}from"./skeleton.js";import{a as t,r as n}from"../react.esm-D_dNEsWM.js";import{jsx as r}from"react/jsx-runtime";describe(`Skeleton`,()=>{it(`renders the legacy placeholder when children are not provided`,()=>{let{container:t}=n(r(e,{className:`h-4 w-48`})),i=t.querySelector(`[data-slot="skeleton"]`);expect(i).not.toBeNull(),expect(i?.className).toContain(`bg-muted`),expect(i?.className).toContain(`animate-pulse`),expect(i?.className).toContain(`h-4`),expect(t.querySelector(`[data-slot="skeleton-overlay"]`)).toBeNull()}),it(`keeps children in the DOM and renders an overlay when visible`,()=>{let{container:i}=n(r(e,{visible:!0,children:r(`button`,{type:`button`,children:`Save changes`})})),a=i.querySelector(`[data-slot="skeleton-content"]`),o=i.querySelector(`[data-slot="skeleton-overlay"]`);expect(t.getByRole(`button`,{hidden:!0,name:`Save changes`})).not.toBeNull(),expect(a?.className).toContain(`invisible`),expect(a?.getAttribute(`aria-hidden`)).toBe(`true`),expect(o).not.toBeNull(),expect(o?.className).toContain(`absolute`),expect(o?.className).toContain(`inset-0`)}),it(`shows children and does not render an overlay when hidden`,()=>{let{container:i}=n(r(e,{visible:!1,children:r(`button`,{type:`button`,children:`Save changes`})})),a=i.querySelector(`[data-slot="skeleton-content"]`);expect(t.getByRole(`button`,{name:`Save changes`})).not.toBeNull(),expect(a?.className).not.toContain(`invisible`),expect(a?.getAttribute(`aria-hidden`)).toBeNull(),expect(i.querySelector(`[data-slot="skeleton-overlay"]`)).toBeNull()})});
 //# sourceMappingURL=skeleton.spec.js.map

package/dist/components/skeleton.spec.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.spec.js","names":[],"sources":["../../src/components/skeleton.spec.tsx"],"sourcesContent":["import { render, screen } from '@testing-library/react'\n\nimport { Skeleton } from './skeleton'\n\ndescribe('Skeleton', () => {\n  it('renders the legacy placeholder when children are not provided', () => {\n    const { container } = render(<Skeleton className=\"h-4 w-48\" />)\n\n    const skeleton = container.querySelector('[data-slot=\"skeleton\"]')\n\n    expect(skeleton).not.toBeNull()\n    expect(skeleton?.className).toContain('bg-muted')\n    expect(skeleton?.className).toContain('animate-pulse')\n    expect(skeleton?.className).toContain('h-4')\n    expect(container.querySelector('[data-slot=\"skeleton-overlay\"]')).toBeNull()\n  })\n\n  it('keeps children in the DOM and renders an overlay when visible', () => {\n    const { container } = render(\n      <Skeleton visible>\n        <button type=\"button\">Save changes</button>\n      </Skeleton>\n    )\n\n    const content = container.querySelector('[data-slot=\"skeleton-content\"]')\n    const overlay = container.querySelector('[data-slot=\"skeleton-overlay\"]')\n\n    expect(screen.getByRole('button', { hidden: true, name: 'Save changes' })).not.toBeNull()\n    expect(content?.className).toContain('invisible')\n    expect(content?.getAttribute('aria-hidden')).toBe('true')\n    expect(overlay).not.toBeNull()\n    expect(overlay?.className).toContain('absolute')\n    expect(overlay?.className).toContain('inset-0')\n  })\n\n  it('shows children and does not render an overlay when hidden', () => {\n    const { container } = render(\n      <Skeleton visible={false}>\n        <button type=\"button\">Save changes</button>\n      </Skeleton>\n    )\n\n    const content = container.querySelector('[data-slot=\"skeleton-content\"]')\n\n    expect(screen.getByRole('button', { name: 'Save changes' })).not.toBeNull()\n    expect(content?.className).not.toContain('invisible')\n    expect(content?.getAttribute('aria-hidden')).toBeNull()\n    expect(container.querySelector('[data-slot=\"skeleton-overlay\"]')).toBeNull()\n  })\n})\n"],"mappings":"6JAIA,SAAS,eAAkB,CACzB,GAAG,oEAAuE,CACxE,GAAM,CAAE,aAAc,EAAO,EAAC,EAAD,CAAU,UAAU,WAAa,CAAA,CAAC,CAEzD,EAAW,EAAU,cAAc,yBAAyB,CAElE,OAAO,EAAS,CAAC,IAAI,UAAU,CAC/B,OAAO,GAAU,UAAU,CAAC,UAAU,WAAW,CACjD,OAAO,GAAU,UAAU,CAAC,UAAU,gBAAgB,CACtD,OAAO,GAAU,UAAU,CAAC,UAAU,MAAM,CAC5C,OAAO,EAAU,cAAc,iCAAiC,CAAC,CAAC,UAAU,EAC5E,CAEF,GAAG,oEAAuE,CACxE,GAAM,CAAE,aAAc,EACpB,EAAC,EAAD,CAAU,QAAA,YACR,EAAC,SAAD,CAAQ,KAAK,kBAAS,eAAqB,CAAA,CAClC,CAAA,CACZ,CAEK,EAAU,EAAU,cAAc,iCAAiC,CACnE,EAAU,EAAU,cAAc,iCAAiC,CAEzE,OAAO,EAAO,UAAU,SAAU,CAAE,OAAQ,GAAM,KAAM,eAAgB,CAAC,CAAC,CAAC,IAAI,UAAU,CACzF,OAAO,GAAS,UAAU,CAAC,UAAU,YAAY,CACjD,OAAO,GAAS,aAAa,cAAc,CAAC,CAAC,KAAK,OAAO,CACzD,OAAO,EAAQ,CAAC,IAAI,UAAU,CAC9B,OAAO,GAAS,UAAU,CAAC,UAAU,WAAW,CAChD,OAAO,GAAS,UAAU,CAAC,UAAU,UAAU,EAC/C,CAEF,GAAG,gEAAmE,CACpE,GAAM,CAAE,aAAc,EACpB,EAAC,EAAD,CAAU,QAAS,YACjB,EAAC,SAAD,CAAQ,KAAK,kBAAS,eAAqB,CAAA,CAClC,CAAA,CACZ,CAEK,EAAU,EAAU,cAAc,iCAAiC,CAEzE,OAAO,EAAO,UAAU,SAAU,CAAE,KAAM,eAAgB,CAAC,CAAC,CAAC,IAAI,UAAU,CAC3E,OAAO,GAAS,UAAU,CAAC,IAAI,UAAU,YAAY,CACrD,OAAO,GAAS,aAAa,cAAc,CAAC,CAAC,UAAU,CACvD,OAAO,EAAU,cAAc,iCAAiC,CAAC,CAAC,UAAU,EAC5E,EACF"}
+{"version":3,"file":"skeleton.spec.js","names":[],"sources":["../../src/components/skeleton.spec.tsx"],"sourcesContent":["import { render, screen } from '@testing-library/react'\n\nimport { Skeleton } from './skeleton'\n\ndescribe('Skeleton', () => {\n  it('renders the legacy placeholder when children are not provided', () => {\n    const { container } = render(<Skeleton className=\"h-4 w-48\" />)\n\n    const skeleton = container.querySelector('[data-slot=\"skeleton\"]')\n\n    expect(skeleton).not.toBeNull()\n    expect(skeleton?.className).toContain('bg-muted')\n    expect(skeleton?.className).toContain('animate-pulse')\n    expect(skeleton?.className).toContain('h-4')\n    expect(container.querySelector('[data-slot=\"skeleton-overlay\"]')).toBeNull()\n  })\n\n  it('keeps children in the DOM and renders an overlay when visible', () => {\n    const { container } = render(\n      <Skeleton visible>\n        <button type=\"button\">Save changes</button>\n      </Skeleton>\n    )\n\n    const content = container.querySelector('[data-slot=\"skeleton-content\"]')\n    const overlay = container.querySelector('[data-slot=\"skeleton-overlay\"]')\n\n    expect(screen.getByRole('button', { hidden: true, name: 'Save changes' })).not.toBeNull()\n    expect(content?.className).toContain('invisible')\n    expect(content?.getAttribute('aria-hidden')).toBe('true')\n    expect(overlay).not.toBeNull()\n    expect(overlay?.className).toContain('absolute')\n    expect(overlay?.className).toContain('inset-0')\n  })\n\n  it('shows children and does not render an overlay when hidden', () => {\n    const { container } = render(\n      <Skeleton visible={false}>\n        <button type=\"button\">Save changes</button>\n      </Skeleton>\n    )\n\n    const content = container.querySelector('[data-slot=\"skeleton-content\"]')\n\n    expect(screen.getByRole('button', { name: 'Save changes' })).not.toBeNull()\n    expect(content?.className).not.toContain('invisible')\n    expect(content?.getAttribute('aria-hidden')).toBeNull()\n    expect(container.querySelector('[data-slot=\"skeleton-overlay\"]')).toBeNull()\n  })\n})\n"],"mappings":"kKAIA,SAAS,eAAkB,CACzB,GAAG,oEAAuE,CACxE,GAAM,CAAE,aAAc,EAAO,EAAC,EAAD,CAAU,UAAU,WAAa,CAAA,CAAC,CAEzD,EAAW,EAAU,cAAc,yBAAyB,CAElE,OAAO,EAAS,CAAC,IAAI,UAAU,CAC/B,OAAO,GAAU,UAAU,CAAC,UAAU,WAAW,CACjD,OAAO,GAAU,UAAU,CAAC,UAAU,gBAAgB,CACtD,OAAO,GAAU,UAAU,CAAC,UAAU,MAAM,CAC5C,OAAO,EAAU,cAAc,iCAAiC,CAAC,CAAC,UAAU,EAC5E,CAEF,GAAG,oEAAuE,CACxE,GAAM,CAAE,aAAc,EACpB,EAAC,EAAD,CAAU,QAAA,YACR,EAAC,SAAD,CAAQ,KAAK,kBAAS,eAAqB,CAAA,CAClC,CAAA,CACZ,CAEK,EAAU,EAAU,cAAc,iCAAiC,CACnE,EAAU,EAAU,cAAc,iCAAiC,CAEzE,OAAO,EAAO,UAAU,SAAU,CAAE,OAAQ,GAAM,KAAM,eAAgB,CAAC,CAAC,CAAC,IAAI,UAAU,CACzF,OAAO,GAAS,UAAU,CAAC,UAAU,YAAY,CACjD,OAAO,GAAS,aAAa,cAAc,CAAC,CAAC,KAAK,OAAO,CACzD,OAAO,EAAQ,CAAC,IAAI,UAAU,CAC9B,OAAO,GAAS,UAAU,CAAC,UAAU,WAAW,CAChD,OAAO,GAAS,UAAU,CAAC,UAAU,UAAU,EAC/C,CAEF,GAAG,gEAAmE,CACpE,GAAM,CAAE,aAAc,EACpB,EAAC,EAAD,CAAU,QAAS,YACjB,EAAC,SAAD,CAAQ,KAAK,kBAAS,eAAqB,CAAA,CAClC,CAAA,CACZ,CAEK,EAAU,EAAU,cAAc,iCAAiC,CAEzE,OAAO,EAAO,UAAU,SAAU,CAAE,KAAM,eAAgB,CAAC,CAAC,CAAC,IAAI,UAAU,CAC3E,OAAO,GAAS,UAAU,CAAC,IAAI,UAAU,YAAY,CACrD,OAAO,GAAS,aAAa,cAAc,CAAC,CAAC,UAAU,CACvD,OAAO,EAAU,cAAc,iCAAiC,CAAC,CAAC,UAAU,EAC5E,EACF"}

package/dist/components/stack.js

@@ -1,2 +1,2 @@
-import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";import{cva as n}from"class-variance-authority";const r=n(`flex flex-col`,{variants:{gap:{xs:`gap-1`,sm:`gap-2`,md:`gap-3`,lg:`gap-4`,xl:`gap-6`}},defaultVariants:{gap:`md`}});function Stack({className:n,gap:i=`md`,...a}){return t(`div`,{"data-slot":`stack`,"data-gap":i,className:e(r({gap:i}),n),...a})}export{Stack,r as stackVariants};
+import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";import{cva as n}from"class-variance-authority";const r=n(`flex flex-col`,{variants:{gap:{xs:`gap-1`,sm:`gap-2`,md:`gap-4`,lg:`gap-6`,xl:`gap-8`}},defaultVariants:{gap:`md`}});function Stack({className:n,gap:i=`md`,...a}){return t(`div`,{"data-slot":`stack`,"data-gap":i,className:e(r({gap:i}),n),...a})}export{Stack,r as stackVariants};
 //# sourceMappingURL=stack.js.map

package/dist/components/stack.js.map

@@ -1 +1 @@
-{"version":3,"file":"stack.js","names":[],"sources":["../../src/components/stack.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst stackVariants = cva('flex flex-col', {\n  variants: {\n    gap: {\n      xs: 'gap-1',\n      sm: 'gap-2',\n      md: 'gap-3',\n      lg: 'gap-4',\n      xl: 'gap-6'\n    }\n  },\n  defaultVariants: {\n    gap: 'md'\n  }\n})\n\nexport type StackProps = React.ComponentProps<'div'> & VariantProps<typeof stackVariants>\n\nfunction Stack({ className, gap = 'md', ...props }: StackProps) {\n  return <div data-slot=\"stack\" data-gap={gap} className={cn(stackVariants({ gap }), className)} {...props} />\n}\n\nexport { Stack, stackVariants }\n"],"mappings":"yJAMA,MAAM,EAAgB,EAAI,gBAAiB,CACzC,SAAU,CACR,IAAK,CACH,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACL,CACF,CACD,gBAAiB,CACf,IAAK,KACN,CACF,CAAC,CAIF,SAAS,MAAM,CAAE,YAAW,MAAM,KAAM,GAAG,GAAqB,CAC9D,OAAO,EAAC,MAAD,CAAK,YAAU,QAAQ,WAAU,EAAK,UAAW,EAAG,EAAc,CAAE,MAAK,CAAC,CAAE,EAAU,CAAE,GAAI,EAAS,CAAA"}
+{"version":3,"file":"stack.js","names":[],"sources":["../../src/components/stack.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst stackVariants = cva('flex flex-col', {\n  variants: {\n    gap: {\n      xs: 'gap-1',\n      sm: 'gap-2',\n      md: 'gap-4',\n      lg: 'gap-6',\n      xl: 'gap-8'\n    }\n  },\n  defaultVariants: {\n    gap: 'md'\n  }\n})\n\nexport type StackProps = React.ComponentProps<'div'> & VariantProps<typeof stackVariants>\n\nfunction Stack({ className, gap = 'md', ...props }: StackProps) {\n  return <div data-slot=\"stack\" data-gap={gap} className={cn(stackVariants({ gap }), className)} {...props} />\n}\n\nexport { Stack, stackVariants }\n"],"mappings":"yJAMA,MAAM,EAAgB,EAAI,gBAAiB,CACzC,SAAU,CACR,IAAK,CACH,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACL,CACF,CACD,gBAAiB,CACf,IAAK,KACN,CACF,CAAC,CAIF,SAAS,MAAM,CAAE,YAAW,MAAM,KAAM,GAAG,GAAqB,CAC9D,OAAO,EAAC,MAAD,CAAK,YAAU,QAAQ,WAAU,EAAK,UAAW,EAAG,EAAc,CAAE,MAAK,CAAC,CAAE,EAAU,CAAE,GAAI,EAAS,CAAA"}

package/dist/components/theme.js

@@ -1,2 +1,2 @@
-import"../chunk-CHh1Zzun.js";import{Button as e}from"./button.js";import{DropdownMenu as t,DropdownMenuContent as n,DropdownMenuItem as r,DropdownMenuTrigger as i}from"./dropdown-menu.js";import{IconMoon as a,IconSun as o}from"@tabler/icons-react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{createContext as l,use as u,useEffect as d,useState as f}from"react";const p=l({});function ThemeProvider({children:e,defaultTheme:t=`system`,storageKey:n=`vite-ui-theme`,...r}){let[i,a]=f(()=>localStorage.getItem(n)||t);d(()=>{let e=window.document.documentElement;if(e.classList.remove(`light`,`dark`),i===`system`){let t=window.matchMedia(`(prefers-color-scheme: dark)`).matches?`dark`:`light`;e.classList.add(t);return}e.classList.add(i)},[i]);let o={theme:i,setTheme:e=>{localStorage.setItem(n,e),a(e)}};return s(p.Provider,{...r,value:o,children:e})}const useTheme=()=>{let e=u(p);if(e===void 0||Object.keys(e).length===0)throw Error(`useTheme must be used within a ThemeProvider`);return e};function ModeToggle(l){let{setTheme:u}=useTheme();return c(t,{children:[s(i,{children:c(e,{variant:`outline`,size:`icon`,...l,children:[s(o,{className:`h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90`}),s(a,{className:`absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0`}),s(`span`,{className:`sr-only`,children:`Toggle theme`})]})}),c(n,{align:`end`,children:[s(r,{onClick:()=>u(`light`),children:`Light`}),s(r,{onClick:()=>u(`dark`),children:`Dark`}),s(r,{onClick:()=>u(`system`),children:`System`})]})]})}export{ModeToggle,ThemeProvider,useTheme};
+import"../chunk-CHh1Zzun.js";import{Button as e}from"./button.js";import{DropdownMenu as t,DropdownMenuContent as n,DropdownMenuItem as r,DropdownMenuTrigger as i}from"./dropdown-menu.js";import{IconMoon as a,IconSun as o}from"@tabler/icons-react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{createContext as l,use as u,useEffect as d,useState as f}from"react";const p=l({});function ThemeProvider({children:e,defaultTheme:t=`system`,storageKey:n=`vite-ui-theme`,...r}){let[i,a]=f(()=>localStorage.getItem(n)||t);d(()=>{let e=window.document.documentElement;if(e.classList.remove(`light`,`dark`),i===`system`){let t=window.matchMedia(`(prefers-color-scheme: dark)`).matches?`dark`:`light`;e.classList.add(t);return}e.classList.add(i)},[i]);let o={theme:i,setTheme:e=>{localStorage.setItem(n,e),a(e)}};return s(p.Provider,{...r,value:o,children:e})}const useTheme=()=>{let e=u(p);if(e===void 0||Object.keys(e).length===0)throw Error(`useTheme must be used within a ThemeProvider`);return e};function ModeToggle(l){let{setTheme:u}=useTheme();return c(t,{children:[s(i,{asChild:!0,children:c(e,{variant:`outline`,size:`icon`,...l,children:[s(o,{className:`h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90`}),s(a,{className:`absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0`}),s(`span`,{className:`sr-only`,children:`Toggle theme`})]})}),c(n,{align:`end`,children:[s(r,{onClick:()=>u(`light`),children:`Light`}),s(r,{onClick:()=>u(`dark`),children:`Dark`}),s(r,{onClick:()=>u(`system`),children:`System`})]})]})}export{ModeToggle,ThemeProvider,useTheme};
 //# sourceMappingURL=theme.js.map

package/dist/components/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","names":[],"sources":["../../src/components/theme.tsx"],"sourcesContent":["import type * as React from 'react'\nimport { createContext, use, useEffect, useState } from 'react'\n\nimport { IconMoon, IconSun } from '@tabler/icons-react'\n\nimport { Button } from './button'\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from './dropdown-menu'\n\nexport type Theme = 'dark' | 'light' | 'system'\n\nexport type ThemeProviderProps = {\n  children: React.ReactNode\n  defaultTheme?: Theme\n  storageKey?: string\n}\n\nexport type ThemeProviderState = {\n  theme: Theme\n  setTheme: (theme: Theme) => void\n}\n\nexport type ModeToggleProps = React.ComponentProps<typeof Button>\n\nconst ThemeProviderContext = createContext({} as ThemeProviderState)\n\nexport function ThemeProvider({\n  children,\n  defaultTheme = 'system',\n  storageKey = 'vite-ui-theme',\n  ...props\n}: ThemeProviderProps) {\n  const [theme, setTheme] = useState<Theme>(() => (localStorage.getItem(storageKey) as Theme) || defaultTheme)\n\n  useEffect(() => {\n    const root = window.document.documentElement\n\n    root.classList.remove('light', 'dark')\n\n    if (theme === 'system') {\n      const systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n\n      root.classList.add(systemTheme)\n      return\n    }\n\n    root.classList.add(theme)\n  }, [theme])\n\n  const value = {\n    theme,\n    setTheme: (theme: Theme) => {\n      localStorage.setItem(storageKey, theme)\n      setTheme(theme)\n    }\n  }\n\n  return (\n    <ThemeProviderContext.Provider {...props} value={value}>\n      {children}\n    </ThemeProviderContext.Provider>\n  )\n}\n\nexport const useTheme = () => {\n  const context = use(ThemeProviderContext)\n\n  if (context === undefined || Object.keys(context).length === 0) {\n    throw new Error('useTheme must be used within a ThemeProvider')\n  }\n\n  return context\n}\n\nexport function ModeToggle(props: ModeToggleProps) {\n  const { setTheme } = useTheme()\n\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger>\n        <Button variant=\"outline\" size=\"icon\" {...props}>\n          <IconSun className=\"h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90\" />\n          <IconMoon className=\"absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0\" />\n          <span className=\"sr-only\">Toggle theme</span>\n        </Button>\n      </DropdownMenuTrigger>\n      <DropdownMenuContent align=\"end\">\n        <DropdownMenuItem onClick={() => setTheme('light')}>Light</DropdownMenuItem>\n        <DropdownMenuItem onClick={() => setTheme('dark')}>Dark</DropdownMenuItem>\n        <DropdownMenuItem onClick={() => setTheme('system')}>System</DropdownMenuItem>\n      </DropdownMenuContent>\n    </DropdownMenu>\n  )\n}\n"],"mappings":"sXAuBA,MAAM,EAAuB,EAAc,EAAE,CAAuB,CAEpE,SAAgB,cAAc,CAC5B,WACA,eAAe,SACf,aAAa,gBACb,GAAG,GACkB,CACrB,GAAM,CAAC,EAAO,GAAY,MAAuB,aAAa,QAAQ,EAAW,EAAc,EAAa,CAE5G,MAAgB,CACd,IAAM,EAAO,OAAO,SAAS,gBAI7B,GAFA,EAAK,UAAU,OAAO,QAAS,OAAO,CAElC,IAAU,SAAU,CACtB,IAAM,EAAc,OAAO,WAAW,+BAA+B,CAAC,QAAU,OAAS,QAEzF,EAAK,UAAU,IAAI,EAAY,CAC/B,OAGF,EAAK,UAAU,IAAI,EAAM,EACxB,CAAC,EAAM,CAAC,CAEX,IAAM,EAAQ,CACZ,QACA,SAAW,GAAiB,CAC1B,aAAa,QAAQ,EAAY,EAAM,CACvC,EAAS,EAAM,EAElB,CAED,OACE,EAAC,EAAqB,SAAtB,CAA+B,GAAI,EAAc,QAC9C,WAC6B,CAAA,CAIpC,MAAa,aAAiB,CAC5B,IAAM,EAAU,EAAI,EAAqB,CAEzC,GAAI,IAAY,IAAA,IAAa,OAAO,KAAK,EAAQ,CAAC,SAAW,EAC3D,MAAU,MAAM,+CAA+C,CAGjE,OAAO,GAGT,SAAgB,WAAW,EAAwB,CACjD,GAAM,CAAE,YAAa,UAAU,CAE/B,OACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAQ,QAAQ,UAAU,KAAK,OAAO,GAAI,WAA1C,CACE,EAAC,EAAD,CAAS,UAAU,uFAAyF,CAAA,CAC5G,EAAC,EAAD,CAAU,UAAU,+FAAiG,CAAA,CACrH,EAAC,OAAD,CAAM,UAAU,mBAAU,eAAmB,CAAA,CACtC,GACW,CAAA,CACtB,EAAC,EAAD,CAAqB,MAAM,eAA3B,CACE,EAAC,EAAD,CAAkB,YAAe,EAAS,QAAQ,UAAE,QAAwB,CAAA,CAC5E,EAAC,EAAD,CAAkB,YAAe,EAAS,OAAO,UAAE,OAAuB,CAAA,CAC1E,EAAC,EAAD,CAAkB,YAAe,EAAS,SAAS,UAAE,SAAyB,CAAA,CAC1D,GACT,CAAA,CAAA"}
+{"version":3,"file":"theme.js","names":[],"sources":["../../src/components/theme.tsx"],"sourcesContent":["import type * as React from 'react'\nimport { createContext, use, useEffect, useState } from 'react'\n\nimport { IconMoon, IconSun } from '@tabler/icons-react'\n\nimport { Button } from './button'\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from './dropdown-menu'\n\nexport type Theme = 'dark' | 'light' | 'system'\n\nexport type ThemeProviderProps = {\n  children: React.ReactNode\n  defaultTheme?: Theme\n  storageKey?: string\n}\n\nexport type ThemeProviderState = {\n  theme: Theme\n  setTheme: (theme: Theme) => void\n}\n\nexport type ModeToggleProps = React.ComponentProps<typeof Button>\n\nconst ThemeProviderContext = createContext({} as ThemeProviderState)\n\nexport function ThemeProvider({\n  children,\n  defaultTheme = 'system',\n  storageKey = 'vite-ui-theme',\n  ...props\n}: ThemeProviderProps) {\n  const [theme, setTheme] = useState<Theme>(() => (localStorage.getItem(storageKey) as Theme) || defaultTheme)\n\n  useEffect(() => {\n    const root = window.document.documentElement\n\n    root.classList.remove('light', 'dark')\n\n    if (theme === 'system') {\n      const systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n\n      root.classList.add(systemTheme)\n      return\n    }\n\n    root.classList.add(theme)\n  }, [theme])\n\n  const value = {\n    theme,\n    setTheme: (theme: Theme) => {\n      localStorage.setItem(storageKey, theme)\n      setTheme(theme)\n    }\n  }\n\n  return (\n    <ThemeProviderContext.Provider {...props} value={value}>\n      {children}\n    </ThemeProviderContext.Provider>\n  )\n}\n\nexport const useTheme = () => {\n  const context = use(ThemeProviderContext)\n\n  if (context === undefined || Object.keys(context).length === 0) {\n    throw new Error('useTheme must be used within a ThemeProvider')\n  }\n\n  return context\n}\n\nexport function ModeToggle(props: ModeToggleProps) {\n  const { setTheme } = useTheme()\n\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger asChild>\n        <Button variant=\"outline\" size=\"icon\" {...props}>\n          <IconSun className=\"h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90\" />\n          <IconMoon className=\"absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0\" />\n          <span className=\"sr-only\">Toggle theme</span>\n        </Button>\n      </DropdownMenuTrigger>\n      <DropdownMenuContent align=\"end\">\n        <DropdownMenuItem onClick={() => setTheme('light')}>Light</DropdownMenuItem>\n        <DropdownMenuItem onClick={() => setTheme('dark')}>Dark</DropdownMenuItem>\n        <DropdownMenuItem onClick={() => setTheme('system')}>System</DropdownMenuItem>\n      </DropdownMenuContent>\n    </DropdownMenu>\n  )\n}\n"],"mappings":"sXAuBA,MAAM,EAAuB,EAAc,EAAE,CAAuB,CAEpE,SAAgB,cAAc,CAC5B,WACA,eAAe,SACf,aAAa,gBACb,GAAG,GACkB,CACrB,GAAM,CAAC,EAAO,GAAY,MAAuB,aAAa,QAAQ,EAAW,EAAc,EAAa,CAE5G,MAAgB,CACd,IAAM,EAAO,OAAO,SAAS,gBAI7B,GAFA,EAAK,UAAU,OAAO,QAAS,OAAO,CAElC,IAAU,SAAU,CACtB,IAAM,EAAc,OAAO,WAAW,+BAA+B,CAAC,QAAU,OAAS,QAEzF,EAAK,UAAU,IAAI,EAAY,CAC/B,OAGF,EAAK,UAAU,IAAI,EAAM,EACxB,CAAC,EAAM,CAAC,CAEX,IAAM,EAAQ,CACZ,QACA,SAAW,GAAiB,CAC1B,aAAa,QAAQ,EAAY,EAAM,CACvC,EAAS,EAAM,EAElB,CAED,OACE,EAAC,EAAqB,SAAtB,CAA+B,GAAI,EAAc,QAC9C,WAC6B,CAAA,CAIpC,MAAa,aAAiB,CAC5B,IAAM,EAAU,EAAI,EAAqB,CAEzC,GAAI,IAAY,IAAA,IAAa,OAAO,KAAK,EAAQ,CAAC,SAAW,EAC3D,MAAU,MAAM,+CAA+C,CAGjE,OAAO,GAGT,SAAgB,WAAW,EAAwB,CACjD,GAAM,CAAE,YAAa,UAAU,CAE/B,OACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAqB,QAAA,YACnB,EAAC,EAAD,CAAQ,QAAQ,UAAU,KAAK,OAAO,GAAI,WAA1C,CACE,EAAC,EAAD,CAAS,UAAU,uFAAyF,CAAA,CAC5G,EAAC,EAAD,CAAU,UAAU,+FAAiG,CAAA,CACrH,EAAC,OAAD,CAAM,UAAU,mBAAU,eAAmB,CAAA,CACtC,GACW,CAAA,CACtB,EAAC,EAAD,CAAqB,MAAM,eAA3B,CACE,EAAC,EAAD,CAAkB,YAAe,EAAS,QAAQ,UAAE,QAAwB,CAAA,CAC5E,EAAC,EAAD,CAAkB,YAAe,EAAS,OAAO,UAAE,OAAuB,CAAA,CAC1E,EAAC,EAAD,CAAkB,YAAe,EAAS,SAAS,UAAE,SAAyB,CAAA,CAC1D,GACT,CAAA,CAAA"}

package/dist/components/timeline.d.ts

@@ -8,7 +8,7 @@ declare const timelineVariants: (props?: ({
   size?: "sm" | "md" | "lg" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 declare const timelineConnectorVariants: (props?: ({
-  status?: "pending" | "completed" | "in-progress" | null | undefined;
+  status?: "completed" | "in-progress" | "pending" | null | undefined;
   color?: "destructive" | "secondary" | "primary" | "muted" | "accent" | "gradient" | null | undefined;
 } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
 declare const timelineIconVariants: (props?: ({