@uselets/ui 1.20.4 → 2.0.1

package/dist/components/slider.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-BhWHdk3m.js";import{cn as e}from"../lib/utils.js";import{useFieldControlId as t}from"./field.js";import{Slider as n}from"radix-ui";import{jsx as r,jsxs as i}from"react/jsx-runtime";import*as a from"react";function Slider({className:o,defaultValue:s,id:c,value:l,min:u=0,max:d=100,...f}){let p=t(c),m=a.useMemo(()=>Array.isArray(l)?l:Array.isArray(s)?s:[u,d],[l,s,u,d]);return/* @__PURE__ */ i(n.Root,{id:p,"data-slot":`slider`,defaultValue:s,value:l,min:u,max:d,className:e(`relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col`,o),...f,children:[/* @__PURE__ */ r(n.Track,{"data-slot":`slider-track`,className:e(`relative grow overflow-hidden rounded-full bg-muted`,`data-horizontal:h-1 data-horizontal:w-full`,`data-vertical:h-full data-vertical:w-1`),children:/* @__PURE__ */ r(n.Range,{"data-slot":`slider-range`,className:`absolute bg-primary select-none data-horizontal:h-full data-vertical:w-full`})}),m.map((t,i)=>/* @__PURE__ */ r(n.Thumb,{"data-slot":`slider-thumb`,className:e(`relative block size-3 shrink-0 rounded-full border border-ring bg-white dark:bg-primary ring-ring/50`,`transition-[color,box-shadow] select-none after:absolute after:-inset-2`,`hover:ring-3 focus-visible:ring-3 focus-visible:outline-hidden active:ring-3`,`disabled:pointer-events-none disabled:opacity-50`)},String(i)))]})}export{Slider};
+import"../rolldown-runtime-BhWHdk3m.js";import{cn as e}from"../lib/utils.js";import{t}from"../resolve-class-name-BurP8ngI.js";import{useFieldControlId as n,useFieldLabelId as r}from"./field.js";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{Slider as o}from"@base-ui/react/slider";function Slider({className:s,defaultValue:c,id:l,value:u,min:d=0,max:f=100,...p}){let m=n(l),h=r(),g=u??c,_=Array.isArray(g)?g.length:1;return/* @__PURE__ */ i(o.Root,{id:m,"aria-labelledby":h,"data-slot":`slider`,defaultValue:c,value:u,min:d,max:f,thumbAlignment:`edge`,className:n=>e(`data-horizontal:w-full data-vertical:h-full`,t(s,n)),...p,children:/* @__PURE__ */ a(o.Control,{"data-slot":`slider-control`,className:e(`relative flex w-full touch-none items-center select-none data-disabled:opacity-50`,`data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col`),children:[/* @__PURE__ */ i(o.Track,{"data-slot":`slider-track`,className:e(`relative grow overflow-hidden rounded-full bg-muted select-none`,`data-horizontal:h-1 data-horizontal:w-full`,`data-vertical:h-full data-vertical:w-1`),children:/* @__PURE__ */ i(o.Indicator,{"data-slot":`slider-range`,className:`bg-primary select-none data-horizontal:h-full data-vertical:w-full`})}),Array.from({length:_},(t,n)=>/* @__PURE__ */ i(o.Thumb,{"data-slot":`slider-thumb`,index:n,className:e(`relative block size-3 shrink-0 rounded-full border border-ring bg-white dark:bg-primary ring-ring/50`,`transition-[color,box-shadow] select-none after:absolute after:-inset-2`,`hover:ring-3 focus-visible:ring-3 focus-visible:outline-hidden active:ring-3 has-focus-visible:ring-3`,`data-disabled:pointer-events-none data-disabled:opacity-50`)},String(n)))]})})}export{Slider};
 //# sourceMappingURL=slider.js.map

package/dist/components/slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider.js","names":["SliderPrimitive","Slider$1","React","props","fieldControlId","useFieldControlId","id","values","value","defaultValue","min","max","cn","className","index"],"sources":["../../src/components/slider.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Slider as SliderPrimitive } from 'radix-ui'\n\nimport { cn } from '../lib/utils'\nimport { useFieldControlId } from './field'\n\nexport type SliderProps = React.ComponentProps<typeof SliderPrimitive.Root>\n\nfunction Slider({ className, defaultValue, id, value, min = 0, max = 100, ...props }: SliderProps) {\n  const fieldControlId = useFieldControlId(id)\n  const values = React.useMemo(\n    () => (Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max]),\n    [value, defaultValue, min, max]\n  )\n\n  return (\n    <SliderPrimitive.Root\n      id={fieldControlId}\n      data-slot=\"slider\"\n      defaultValue={defaultValue}\n      value={value}\n      min={min}\n      max={max}\n      className={cn(\n        'relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col',\n        className\n      )}\n      {...props}\n    >\n      <SliderPrimitive.Track\n        data-slot=\"slider-track\"\n        className={cn(\n          'relative grow overflow-hidden rounded-full bg-muted',\n          'data-horizontal:h-1 data-horizontal:w-full',\n          'data-vertical:h-full data-vertical:w-1'\n        )}\n      >\n        <SliderPrimitive.Range\n          data-slot=\"slider-range\"\n          className=\"absolute bg-primary select-none data-horizontal:h-full data-vertical:w-full\"\n        />\n      </SliderPrimitive.Track>\n      {values.map((_, index) => (\n        <SliderPrimitive.Thumb\n          data-slot=\"slider-thumb\"\n          key={String(index)}\n          className={cn(\n            'relative block size-3 shrink-0 rounded-full border border-ring bg-white dark:bg-primary ring-ring/50',\n            'transition-[color,box-shadow] select-none after:absolute after:-inset-2',\n            'hover:ring-3 focus-visible:ring-3 focus-visible:outline-hidden active:ring-3',\n            'disabled:pointer-events-none disabled:opacity-50'\n          )}\n        />\n      ))}\n    </SliderPrimitive.Root>\n  )\n}\n\nexport { Slider }\n"],"mappings":"wOASA,SAAS,OAAO,CAAE,YAAW,eAAc,KAAI,QAAO,MAAM,EAAG,MAAM,IAAK,GAAGG,GAAsB,CACjG,IAAMC,EAAiBC,EAAkBC,CAAE,EACrCC,EAASL,EAAM,YACZ,MAAM,QAAQM,CAAK,EAAIA,EAAQ,MAAM,QAAQC,CAAY,EAAIA,EAAe,CAACC,EAAKC,CAAG,EAC5F,CAACH,EAAOC,EAAcC,EAAKC,CAAG,CAChC,EAEA,MACE,kBAACX,EAAgB,KAAjB,CACE,GAAII,EACJ,YAAU,SACI,eACP,QACF,MACA,MACL,UAAWQ,EACT,4KACAC,CACF,EACA,GAAIV,EAXN,SAAA,CAaE,kBAACH,EAAgB,MAAjB,CACE,YAAU,eACV,UAAWY,EACT,sDACA,6CACA,wCACF,EAEA,SAAA,kBAACZ,EAAgB,MAAjB,CACE,YAAU,eACV,UAAU,6EACX,CAAA,CACoB,CAAA,EACtBO,EAAO,KAAK,EAAG,IACd,kBAACP,EAAgB,MAAjB,CACE,YAAU,eAEV,UAAWY,EACT,uGACA,0EACA,+EACA,kDACF,CACD,EAPM,OAAOE,CAAK,CAOlB,CACF,CACmB,GAE1B"}
+{"version":3,"file":"slider.js","names":["SliderPrimitive","Slider$1","props","fieldControlId","useFieldControlId","id","fieldLabelId","useFieldLabelId","currentValue","value","defaultValue","thumbCount","cn","resolveClassName","className","state","index"],"sources":["../../src/components/slider.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { Slider as SliderPrimitive } from '@base-ui/react/slider'\n\nimport { cn } from '../lib/utils'\nimport { resolveClassName } from '../utils/resolve-class-name'\nimport { useFieldControlId, useFieldLabelId } from './field'\n\nexport type SliderProps = Omit<React.ComponentProps<typeof SliderPrimitive.Root>, 'render'>\n\nfunction Slider({ className, defaultValue, id, value, min = 0, max = 100, ...props }: SliderProps) {\n  const fieldControlId = useFieldControlId(id)\n  const fieldLabelId = useFieldLabelId()\n  // One thumb per value: a single number (or no value, which defaults to `min`) is a one-thumb slider.\n  const currentValue = value ?? defaultValue\n  const thumbCount = Array.isArray(currentValue) ? currentValue.length : 1\n\n  return (\n    <SliderPrimitive.Root\n      id={fieldControlId}\n      aria-labelledby={fieldLabelId}\n      data-slot=\"slider\"\n      defaultValue={defaultValue}\n      value={value}\n      min={min}\n      max={max}\n      thumbAlignment=\"edge\"\n      className={(state) => cn('data-horizontal:w-full data-vertical:h-full', resolveClassName(className, state))}\n      {...props}\n    >\n      <SliderPrimitive.Control\n        data-slot=\"slider-control\"\n        className={cn(\n          'relative flex w-full touch-none items-center select-none data-disabled:opacity-50',\n          'data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col'\n        )}\n      >\n        <SliderPrimitive.Track\n          data-slot=\"slider-track\"\n          className={cn(\n            'relative grow overflow-hidden rounded-full bg-muted select-none',\n            'data-horizontal:h-1 data-horizontal:w-full',\n            'data-vertical:h-full data-vertical:w-1'\n          )}\n        >\n          <SliderPrimitive.Indicator\n            data-slot=\"slider-range\"\n            className=\"bg-primary select-none data-horizontal:h-full data-vertical:w-full\"\n          />\n        </SliderPrimitive.Track>\n        {Array.from({ length: thumbCount }, (_, index) => (\n          <SliderPrimitive.Thumb\n            data-slot=\"slider-thumb\"\n            key={String(index)}\n            index={index}\n            className={cn(\n              'relative block size-3 shrink-0 rounded-full border border-ring bg-white dark:bg-primary ring-ring/50',\n              'transition-[color,box-shadow] select-none after:absolute after:-inset-2',\n              'hover:ring-3 focus-visible:ring-3 focus-visible:outline-hidden active:ring-3 has-focus-visible:ring-3',\n              'data-disabled:pointer-events-none data-disabled:opacity-50'\n            )}\n          />\n        ))}\n      </SliderPrimitive.Control>\n    </SliderPrimitive.Root>\n  )\n}\n\nexport { Slider }\n"],"mappings":"mSAUA,SAAS,OAAO,CAAE,YAAW,eAAc,KAAI,QAAO,MAAM,EAAG,MAAM,IAAK,GAAGE,GAAsB,CACjG,IAAMC,EAAiBC,EAAkBC,CAAE,EACrCC,EAAeC,EAAgB,EAE/BC,EAAeC,GAASC,EACxBC,EAAa,MAAM,QAAQH,CAAY,EAAIA,EAAa,OAAS,EAEvE,MACE,kBAACR,EAAgB,KAAjB,CACE,GAAIG,EACJ,kBAAiBG,EACjB,YAAU,SACI,eACP,QACF,MACA,MACL,eAAe,OACf,UAAY,GAAUM,EAAG,8CAA+CC,EAAiBC,EAAWC,CAAK,CAAC,EAC1G,GAAIb,EAEJ,SAAA,kBAACF,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAWY,EACT,oFACA,yFACF,EALF,SAAA,CAOE,kBAACZ,EAAgB,MAAjB,CACE,YAAU,eACV,UAAWY,EACT,kEACA,6CACA,wCACF,EAEA,SAAA,kBAACZ,EAAgB,UAAjB,CACE,YAAU,eACV,UAAU,oEACX,CAAA,CACoB,CAAA,EACtB,MAAM,KAAK,CAAE,OAAQW,CAAW,GAAI,EAAG,IACtC,kBAACX,EAAgB,MAAjB,CACE,YAAU,eAEH,QACP,UAAWY,EACT,uGACA,0EACA,wGACA,4DACF,CACD,EARM,OAAOI,CAAK,CAQlB,CACF,CACsB,GACL,CAAA,CAE1B"}

package/dist/components/spinner.d.ts

@@ -1,6 +1,6 @@
 import { t as __name } from "../rolldown-runtime-BhWHdk3m.js";
-import { VariantProps } from "class-variance-authority";
 import * as React from "react";
+import { VariantProps } from "class-variance-authority";
 //#region src/components/spinner.d.ts
 declare const spinnerVariants: (props?: ({
   size?: "lg" | "md" | "sm" | null | undefined;

package/dist/components/stack.d.ts

@@ -1,6 +1,6 @@
 import { t as __name } from "../rolldown-runtime-BhWHdk3m.js";
-import { VariantProps } from "class-variance-authority";
 import * as React from "react";
+import { VariantProps } from "class-variance-authority";
 //#region src/components/stack.d.ts
 declare const stackVariants: (props?: ({
   align?: "baseline" | "center" | "end" | "start" | "stretch" | null | undefined;

package/dist/components/stepper.d.ts

@@ -1,5 +1,6 @@
 import { t as __name } from "../rolldown-runtime-BhWHdk3m.js";
-import { HTMLAttributes } from "react";
+import { n as AsChildProps } from "../as-child-Dxg3Xo1G.js";
+import { ReactElement } from "react";
 //#region src/components/stepper.d.ts
 type StepperOrientation = 'horizontal' | 'vertical';
 type StepState = 'active' | 'completed' | 'inactive' | 'loading';
@@ -14,13 +15,9 @@ interface StepperContextValue {
   setActiveStep: (step: number) => void;
   stepsCount: number;
   orientation: StepperOrientation;
-  registerTrigger: (node: HTMLButtonElement | null) => void;
-  triggerNodes: HTMLButtonElement[];
-  focusNext: (currentIdx: number) => void;
-  focusPrev: (currentIdx: number) => void;
-  focusFirst: () => void;
-  focusLast: () => void;
   indicators: StepIndicators;
+  getTriggerId: (step: number) => string;
+  getContentId: (step: number) => string;
 }
 interface StepItemContextValue {
   step: number;
@@ -30,42 +27,66 @@ interface StepItemContextValue {
 }
 declare function useStepper(): StepperContextValue;
 declare function useStepItem(): StepItemContextValue;
-interface StepperProps extends HTMLAttributes<HTMLDivElement> {
+export type StepperProps = Omit<React.ComponentProps<'div'>, 'defaultValue'> & {
+  /**
+   * Initial step (uncontrolled), starting at `1`.
+   * @default 1
+   */
   defaultValue?: number;
+  /** Current step (controlled). */
   value?: number;
+  /** Called with the new step when the user moves to it. */
   onValueChange?: (value: number) => void;
+  /**
+   * Layout of the steps.
+   * @default 'horizontal'
+   */
   orientation?: StepperOrientation;
+  /** Custom indicator content per state: `active`, `completed`, `inactive`, `loading`. */
   indicators?: StepIndicators;
-}
+};
 declare function Stepper({ defaultValue, value, onValueChange, orientation, className, children, indicators, ...props }: StepperProps): import("react").JSX.Element;
-interface StepperItemProps extends React.HTMLAttributes<HTMLDivElement> {
+export type StepperItemProps = React.ComponentProps<'div'> & {
+  /** Number of this step, starting at `1`. */
   step: number;
+  /**
+   * Marks the step as completed.
+   * @default false
+   */
   completed?: boolean;
+  /**
+   * Prevents navigating to this step.
+   * @default false
+   */
   disabled?: boolean;
+  /**
+   * Shows the loading indicator for this step.
+   * @default false
+   */
   loading?: boolean;
-}
+};
 declare function StepperItem({ step, completed, disabled, loading, className, children, ...props }: StepperItemProps): import("react").JSX.Element;
-interface StepperTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-  asChild?: boolean;
-}
-declare function StepperTrigger({ asChild, className, children, tabIndex, ...props }: StepperTriggerProps): import("react").JSX.Element;
+export type StepperTriggerProps = AsChildProps<'button'>;
+declare function StepperTrigger({ asChild, className, children, tabIndex, onClick, onKeyDown, ...props }: StepperTriggerProps): ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 export type StepperIndicatorProps = React.ComponentProps<'div'>;
-declare function StepperIndicator({ children, className }: StepperIndicatorProps): import("react").JSX.Element;
+declare function StepperIndicator({ children, className, ...props }: StepperIndicatorProps): import("react").JSX.Element;
 export type StepperSeparatorProps = React.ComponentProps<'div'>;
-declare function StepperSeparator({ className }: StepperSeparatorProps): import("react").JSX.Element;
+declare function StepperSeparator({ className, ...props }: StepperSeparatorProps): import("react").JSX.Element;
 export type StepperTitleProps = React.ComponentProps<'h3'>;
-declare function StepperTitle({ children, className }: StepperTitleProps): import("react").JSX.Element;
+declare function StepperTitle({ children, className, ...props }: StepperTitleProps): import("react").JSX.Element;
 export type StepperDescriptionProps = React.ComponentProps<'div'>;
-declare function StepperDescription({ children, className }: StepperDescriptionProps): import("react").JSX.Element;
+declare function StepperDescription({ children, className, ...props }: StepperDescriptionProps): import("react").JSX.Element;
 export type StepperNavProps = React.ComponentProps<'nav'>;
-declare function StepperNav({ children, className }: StepperNavProps): import("react").JSX.Element;
+declare function StepperNav({ children, className, ...props }: StepperNavProps): import("react").JSX.Element;
 export type StepperPanelProps = React.ComponentProps<'div'>;
-declare function StepperPanel({ children, className }: StepperPanelProps): import("react").JSX.Element;
-interface StepperContentProps extends React.ComponentProps<'div'> {
+declare function StepperPanel({ children, className, ...props }: StepperPanelProps): import("react").JSX.Element;
+export type StepperContentProps = React.ComponentProps<'div'> & {
+  /** Step this content belongs to. */
   value: number;
+  /** Keeps the content mounted when its step isn’t active. */
   forceMount?: boolean;
-}
-declare function StepperContent({ value, forceMount, children, className }: StepperContentProps): import("react").JSX.Element | null;
+};
+declare function StepperContent({ value, forceMount, children, className, ...props }: StepperContentProps): import("react").JSX.Element | null;
 //#endregion
-export { Stepper, StepperContent, type StepperContentProps, StepperDescription, StepperIndicator, StepperItem, type StepperItemProps, StepperNav, StepperPanel, type StepperProps, StepperSeparator, StepperTitle, StepperTrigger, type StepperTriggerProps, useStepItem, useStepper };
+export { Stepper, StepperContent, StepperDescription, StepperIndicator, StepperItem, StepperNav, StepperPanel, StepperSeparator, StepperTitle, StepperTrigger, useStepItem, useStepper };
 //# sourceMappingURL=stepper.d.ts.map

package/dist/components/stepper.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-BhWHdk3m.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";import{Children as n,createContext as r,isValidElement as i,useCallback as a,useContext as o,useEffect as s,useMemo as c,useRef as l,useState as u}from"react";const d=r(void 0),f=r(void 0);function useStepper(){let e=o(d);if(!e)throw Error(`useStepper must be used within a Stepper`);return e}function useStepItem(){let e=o(f);if(!e)throw Error(`useStepItem must be used within a StepperItem`);return e}function Stepper({defaultValue:r=1,value:o,onValueChange:s,orientation:l=`horizontal`,className:f,children:p,indicators:m={},...h}){let[g,_]=u(r),[v,y]=u([]),b=a(e=>{y(t=>e&&!t.includes(e)?[...t,e]:!e&&t.includes(e)?t.filter(t=>t!==e):t)},[]),x=a(e=>{o===void 0&&_(e),s?.(e)},[o,s]),S=o??g,C=a(e=>{v[e]&&v[e].focus()},[v]),w=a(e=>C((e+1)%v.length),[C,v]),T=a(e=>C((e-1+v.length)%v.length),[C,v]),E=a(()=>C(0),[C]),D=a(()=>C(v.length-1),[C,v]),O=c(()=>({activeStep:S,setActiveStep:x,stepsCount:n.toArray(p).filter(e=>i(e)&&e.type.displayName===`StepperItem`).length,orientation:l,registerTrigger:b,focusNext:w,focusPrev:T,focusFirst:E,focusLast:D,triggerNodes:v,indicators:m}),[S,x,p,l,b,v,E,D,w,T,m]);return/* @__PURE__ */ t(d.Provider,{value:O,children:/* @__PURE__ */ t(`div`,{role:`tablist`,"aria-orientation":l,"data-slot":`stepper`,className:e(`w-full`,f),"data-orientation":l,...h,children:p})})}function StepperItem({step:n,completed:r=!1,disabled:i=!1,loading:a=!1,className:o,children:s,...c}){let{activeStep:l}=useStepper(),u=r||n<l?`completed`:l===n?`active`:`inactive`,d=a&&n===l;return/* @__PURE__ */ t(f.Provider,{value:{step:n,state:u,isDisabled:i,isLoading:d},children:/* @__PURE__ */ t(`div`,{"data-slot":`stepper-item`,className:e(`group/step flex items-center justify-center not-last:flex-1 group-data-[orientation=horizontal]/stepper-nav:flex-row group-data-[orientation=vertical]/stepper-nav:flex-col`,o),"data-state":u,...d?{"data-loading":!0}:{},...c,children:s})})}function StepperTrigger({asChild:n=!1,className:r,children:i,tabIndex:a,...o}){let{state:u,isLoading:d}=useStepItem(),{setActiveStep:f,activeStep:p,registerTrigger:m,triggerNodes:h,focusNext:g,focusPrev:_,focusFirst:v,focusLast:y}=useStepper(),{step:b,isDisabled:x}=useStepItem(),S=p===b,C=`stepper-tab-${b}`,w=`stepper-panel-${b}`,T=l(null);s(()=>{T.current&&m(T.current)},[m]);let E=c(()=>h.findIndex(e=>e===T.current),[h]),handleKeyDown=e=>{switch(e.key){case`ArrowRight`:case`ArrowDown`:e.preventDefault(),E!==-1&&g&&g(E);break;case`ArrowLeft`:case`ArrowUp`:e.preventDefault(),E!==-1&&_&&_(E);break;case`Home`:e.preventDefault(),v&&v();break;case`End`:e.preventDefault(),y&&y();break;case`Enter`:case` `:e.preventDefault(),f(b)}};return n?/* @__PURE__ */ t(`span`,{"data-slot":`stepper-trigger`,"data-state":u,className:r,children:i}):/* @__PURE__ */ t(`button`,{ref:T,role:`tab`,id:C,"aria-selected":S,"aria-controls":w,tabIndex:typeof a==`number`?a:S?0:-1,"data-slot":`stepper-trigger`,"data-state":u,"data-loading":d,className:e(`focus-visible:border-ring focus-visible:ring-ring/50 inline-flex cursor-pointer items-center outline-none focus-visible:z-10 focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-60`,`gap-2.5 rounded-full`,r),onClick:()=>f(b),onKeyDown:handleKeyDown,disabled:x,...o,children:i})}function StepperIndicator({children:n,className:r}){let{state:i,isLoading:a}=useStepItem(),{indicators:o}=useStepper();return/* @__PURE__ */ t(`div`,{"data-slot":`stepper-indicator`,"data-state":i,className:e(`border-background bg-accent text-accent-foreground data-[state=completed]:bg-primary data-[state=completed]:text-primary-foreground data-[state=active]:bg-primary data-[state=active]:text-primary-foreground relative flex size-6 shrink-0 items-center justify-center overflow-hidden`,`rounded-full text-xs`,r),children:/* @__PURE__ */ t(`div`,{className:`absolute`,children:o&&(a&&o.loading||i===`completed`&&o.completed||i===`active`&&o.active||i===`inactive`&&o.inactive)?a&&o.loading||i===`completed`&&o.completed||i===`active`&&o.active||i===`inactive`&&o.inactive:n})})}function StepperSeparator({className:n}){let{state:r}=useStepItem();return/* @__PURE__ */ t(`div`,{"data-slot":`stepper-separator`,"data-state":r,className:e(`bg-muted rounded-sm group-data-[orientation=horizontal]/stepper-nav:h-0.5 group-data-[orientation=vertical]/stepper-nav:h-12 group-data-[orientation=vertical]/stepper-nav:w-0.5 m-0.5 group-data-[orientation=horizontal]/stepper-nav:flex-1`,n)})}function StepperTitle({children:n,className:r}){let{state:i}=useStepItem();return/* @__PURE__ */ t(`h3`,{"data-slot":`stepper-title`,"data-state":i,className:e(`text-sm leading-none font-medium`,r),children:n})}function StepperDescription({children:n,className:r}){let{state:i}=useStepItem();return/* @__PURE__ */ t(`div`,{"data-slot":`stepper-description`,"data-state":i,className:e(`text-muted-foreground text-sm`,r),children:n})}function StepperNav({children:n,className:r}){let{activeStep:i,orientation:a}=useStepper();return/* @__PURE__ */ t(`nav`,{"data-slot":`stepper-nav`,"data-state":i,"data-orientation":a,className:e(`group/stepper-nav inline-flex data-[orientation=horizontal]:w-full data-[orientation=horizontal]:flex-row data-[orientation=vertical]:flex-col`,r),children:n})}function StepperPanel({children:n,className:r}){let{activeStep:i}=useStepper();return/* @__PURE__ */ t(`div`,{"data-slot":`stepper-panel`,"data-state":i,className:e(`w-full`,r),children:n})}function StepperContent({value:n,forceMount:r,children:i,className:a}){let{activeStep:o}=useStepper(),s=n===o;return!r&&!s?null:/* @__PURE__ */ t(`div`,{"data-slot":`stepper-content`,"data-state":o,className:e(`w-full`,a,!s&&r&&`hidden`),hidden:!s&&r,children:i})}export{Stepper,StepperContent,StepperDescription,StepperIndicator,StepperItem,StepperNav,StepperPanel,StepperSeparator,StepperTitle,StepperTrigger,useStepItem,useStepper};
+import"../rolldown-runtime-BhWHdk3m.js";import{useAsChild as e}from"../lib/as-child.js";import{cn as t}from"../lib/utils.js";import{Children as n,createContext as r,isValidElement as i,useCallback as a,useContext as o,useId as s,useMemo as c,useState as l}from"react";import{jsx as u}from"react/jsx-runtime";const d=r(void 0),f=r(void 0);function useStepper(){let e=o(d);if(!e)throw Error(`useStepper must be used within a Stepper`);return e}function useStepItem(){let e=o(f);if(!e)throw Error(`useStepItem must be used within a StepperItem`);return e}function Stepper({defaultValue:e=1,value:r,onValueChange:o,orientation:f=`horizontal`,className:p,children:m,indicators:h={},...g}){let[_,v]=l(e),y=s(),b=a(e=>{r===void 0&&v(e),o?.(e)},[r,o]),x=r??_,S=a(e=>`${y}-tab-${e}`,[y]),C=a(e=>`${y}-panel-${e}`,[y]),w=c(()=>({activeStep:x,setActiveStep:b,stepsCount:n.toArray(m).filter(e=>i(e)&&e.type.displayName===`StepperItem`).length,orientation:f,indicators:h,getTriggerId:S,getContentId:C}),[x,b,m,f,h,S,C]);return/* @__PURE__ */ u(d.Provider,{value:w,children:/* @__PURE__ */ u(`div`,{role:`tablist`,"aria-orientation":f,"data-slot":`stepper`,className:t(`w-full`,p),"data-orientation":f,...g,children:m})})}function StepperItem({step:e,completed:n=!1,disabled:r=!1,loading:i=!1,className:a,children:o,...s}){let{activeStep:c}=useStepper(),l=n||e<c?`completed`:c===e?`active`:`inactive`,d=i&&e===c;return/* @__PURE__ */ u(f.Provider,{value:{step:e,state:l,isDisabled:r,isLoading:d},children:/* @__PURE__ */ u(`div`,{"data-slot":`stepper-item`,className:t(`group/step flex items-center justify-center not-last:flex-1 group-data-[orientation=horizontal]/stepper-nav:flex-row group-data-[orientation=vertical]/stepper-nav:flex-col`,a),"data-state":l,...d?{"data-loading":!0}:{},...s,children:o})})}function getStepperTriggers(e){let t=e.closest(`[data-slot="stepper"]`);return t?Array.from(t.querySelectorAll(`[data-slot="stepper-trigger"]`)).filter(e=>e.closest(`[data-slot="stepper"]`)===t&&!e.matches(`:disabled, [aria-disabled="true"]`)):[]}function StepperTrigger({asChild:n=!1,className:r,children:i,tabIndex:a,onClick:o,onKeyDown:s,...c}){let{setActiveStep:l,activeStep:u,getTriggerId:d,getContentId:f}=useStepper(),{step:p,state:m,isDisabled:h,isLoading:g}=useStepItem(),_=u===p,v=n&&h,handleClick=e=>{o?.(e),!(e.defaultPrevented||h)&&l(p)},handleKeyDown=e=>{if(s?.(e),e.defaultPrevented)return;let t=getStepperTriggers(e.currentTarget),n=t.indexOf(e.currentTarget),r;switch(e.key){case`ArrowRight`:case`ArrowDown`:r=n===-1?void 0:t[(n+1)%t.length];break;case`ArrowLeft`:case`ArrowUp`:r=n===-1?void 0:t[(n-1+t.length)%t.length];break;case`Home`:r=t[0];break;case`End`:r=t[t.length-1];break;case`Enter`:case` `:e.preventDefault(),h||l(p);return;default:return}e.preventDefault(),r?.focus()};return e(`button`,{asChild:n,type:n?void 0:`button`,role:`tab`,id:d(p),"aria-selected":_,"aria-controls":f(p),"aria-disabled":v?!0:void 0,tabIndex:typeof a==`number`?a:_?0:-1,"data-slot":`stepper-trigger`,"data-state":m,"data-loading":g,disabled:n?void 0:h,className:t(`focus-visible:border-ring focus-visible:ring-ring/50 inline-flex cursor-pointer items-center outline-none focus-visible:z-10 focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-60 aria-disabled:pointer-events-none aria-disabled:opacity-60`,`gap-2.5 rounded-full`,r),onClick:handleClick,onKeyDown:handleKeyDown,...c,children:i})}function StepperIndicator({children:e,className:n,...r}){let{state:i,isLoading:a}=useStepItem(),{indicators:o}=useStepper();return/* @__PURE__ */ u(`div`,{"data-slot":`stepper-indicator`,"data-state":i,className:t(`border-background bg-accent text-accent-foreground data-[state=completed]:bg-primary data-[state=completed]:text-primary-foreground data-[state=active]:bg-primary data-[state=active]:text-primary-foreground relative flex size-6 shrink-0 items-center justify-center overflow-hidden`,`rounded-full text-xs`,n),...r,children:/* @__PURE__ */ u(`div`,{className:`absolute`,children:o&&(a&&o.loading||i===`completed`&&o.completed||i===`active`&&o.active||i===`inactive`&&o.inactive)?a&&o.loading||i===`completed`&&o.completed||i===`active`&&o.active||i===`inactive`&&o.inactive:e})})}function StepperSeparator({className:e,...n}){let{state:r}=useStepItem();return/* @__PURE__ */ u(`div`,{"data-slot":`stepper-separator`,"data-state":r,className:t(`bg-muted rounded-sm group-data-[orientation=horizontal]/stepper-nav:h-0.5 group-data-[orientation=vertical]/stepper-nav:h-12 group-data-[orientation=vertical]/stepper-nav:w-0.5 m-0.5 group-data-[orientation=horizontal]/stepper-nav:flex-1`,e),...n})}function StepperTitle({children:e,className:n,...r}){let{state:i}=useStepItem();return/* @__PURE__ */ u(`h3`,{"data-slot":`stepper-title`,"data-state":i,className:t(`text-sm leading-none font-medium`,n),...r,children:e})}function StepperDescription({children:e,className:n,...r}){let{state:i}=useStepItem();return/* @__PURE__ */ u(`div`,{"data-slot":`stepper-description`,"data-state":i,className:t(`text-muted-foreground text-sm`,n),...r,children:e})}function StepperNav({children:e,className:n,...r}){let{activeStep:i,orientation:a}=useStepper();return/* @__PURE__ */ u(`nav`,{"data-slot":`stepper-nav`,"data-state":i,"data-orientation":a,className:t(`group/stepper-nav inline-flex data-[orientation=horizontal]:w-full data-[orientation=horizontal]:flex-row data-[orientation=vertical]:flex-col`,n),...r,children:e})}function StepperPanel({children:e,className:n,...r}){let{activeStep:i}=useStepper();return/* @__PURE__ */ u(`div`,{"data-slot":`stepper-panel`,"data-state":i,className:t(`w-full`,n),...r,children:e})}function StepperContent({value:e,forceMount:n,children:r,className:i,...a}){let{activeStep:o,getTriggerId:s,getContentId:c}=useStepper(),l=e===o;return!n&&!l?null:/* @__PURE__ */ u(`div`,{role:`tabpanel`,id:c(e),"aria-labelledby":s(e),"data-slot":`stepper-content`,"data-state":o,className:t(`w-full`,i,!l&&n&&`hidden`),hidden:!l&&n,...a,children:r})}export{Stepper,StepperContent,StepperDescription,StepperIndicator,StepperItem,StepperNav,StepperPanel,StepperSeparator,StepperTitle,StepperTrigger,useStepItem,useStepper};
 //# sourceMappingURL=stepper.js.map

package/dist/components/stepper.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.js","names":["StepperContext","createContext","StepItemContext","ctx","useContext","props","activeStep","setActiveStep","useState","defaultValue","triggerNodes","setTriggerNodes","registerTrigger","useCallback","node","prev","n","handleSetActiveStep","value","step","onValueChange","currentStep","focusTrigger","idx","focusNext","currentIdx","focusPrev","focusFirst","focusLast","contextValue","useMemo","Children","children","isValidElement","child","orientation","indicators","cn","className","state","completed","isLoading","loading","disabled","isSelected","id","panelId","btnRef","useRef","useEffect","myIdx","asChild","tabIndex","isDisabled","isActive","forceMount"],"sources":["../../src/components/stepper.tsx"],"sourcesContent":["import {\n  Children,\n  createContext,\n  type HTMLAttributes,\n  isValidElement,\n  type ReactElement,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState\n} from 'react'\n\nimport { cn } from '../lib/utils'\n\n// Types\ntype StepperOrientation = 'horizontal' | 'vertical'\ntype StepState = 'active' | 'completed' | 'inactive' | 'loading'\ntype StepIndicators = {\n  active?: React.ReactNode\n  completed?: React.ReactNode\n  inactive?: React.ReactNode\n  loading?: React.ReactNode\n}\n\ninterface StepperContextValue {\n  activeStep: number\n  setActiveStep: (step: number) => void\n  stepsCount: number\n  orientation: StepperOrientation\n  registerTrigger: (node: HTMLButtonElement | null) => void\n  triggerNodes: HTMLButtonElement[]\n  focusNext: (currentIdx: number) => void\n  focusPrev: (currentIdx: number) => void\n  focusFirst: () => void\n  focusLast: () => void\n  indicators: StepIndicators\n}\n\ninterface StepItemContextValue {\n  step: number\n  state: StepState\n  isDisabled: boolean\n  isLoading: boolean\n}\n\nconst StepperContext = createContext<StepperContextValue | undefined>(undefined)\nconst StepItemContext = createContext<StepItemContextValue | undefined>(undefined)\n\nfunction useStepper() {\n  const ctx = useContext(StepperContext)\n  if (!ctx) throw new Error('useStepper must be used within a Stepper')\n  return ctx\n}\n\nfunction useStepItem() {\n  const ctx = useContext(StepItemContext)\n  if (!ctx) throw new Error('useStepItem must be used within a StepperItem')\n  return ctx\n}\n\ninterface StepperProps extends HTMLAttributes<HTMLDivElement> {\n  defaultValue?: number\n  value?: number\n  onValueChange?: (value: number) => void\n  orientation?: StepperOrientation\n  indicators?: StepIndicators\n}\n\nfunction Stepper({\n  defaultValue = 1,\n  value,\n  onValueChange,\n  orientation = 'horizontal',\n  className,\n  children,\n  indicators = {},\n  ...props\n}: StepperProps) {\n  const [activeStep, setActiveStep] = useState(defaultValue)\n  const [triggerNodes, setTriggerNodes] = useState<HTMLButtonElement[]>([])\n\n  // Register/unregister triggers\n  const registerTrigger = useCallback((node: HTMLButtonElement | null) => {\n    setTriggerNodes((prev) => {\n      if (node && !prev.includes(node)) {\n        return [...prev, node]\n      } else if (!node && prev.includes(node!)) {\n        return prev.filter((n) => n !== node)\n      } else {\n        return prev\n      }\n    })\n  }, [])\n\n  const handleSetActiveStep = useCallback(\n    (step: number) => {\n      if (value === undefined) {\n        setActiveStep(step)\n      }\n      onValueChange?.(step)\n    },\n    [value, onValueChange]\n  )\n\n  const currentStep = value ?? activeStep\n\n  // Keyboard navigation logic\n  const focusTrigger = useCallback(\n    (idx: number) => {\n      if (triggerNodes[idx]) triggerNodes[idx].focus()\n    },\n    [triggerNodes]\n  )\n  const focusNext = useCallback(\n    (currentIdx: number) => focusTrigger((currentIdx + 1) % triggerNodes.length),\n    [focusTrigger, triggerNodes]\n  )\n  const focusPrev = useCallback(\n    (currentIdx: number) => focusTrigger((currentIdx - 1 + triggerNodes.length) % triggerNodes.length),\n    [focusTrigger, triggerNodes]\n  )\n  const focusFirst = useCallback(() => focusTrigger(0), [focusTrigger])\n  const focusLast = useCallback(() => focusTrigger(triggerNodes.length - 1), [focusTrigger, triggerNodes])\n\n  // Context value\n  const contextValue = useMemo<StepperContextValue>(\n    () => ({\n      activeStep: currentStep,\n      setActiveStep: handleSetActiveStep,\n      stepsCount: Children.toArray(children).filter(\n        (child): child is ReactElement =>\n          isValidElement(child) && (child.type as { displayName?: string }).displayName === 'StepperItem'\n      ).length,\n      orientation,\n      registerTrigger,\n      focusNext,\n      focusPrev,\n      focusFirst,\n      focusLast,\n      triggerNodes,\n      indicators\n    }),\n    [\n      currentStep,\n      handleSetActiveStep,\n      children,\n      orientation,\n      registerTrigger,\n      triggerNodes,\n      focusFirst,\n      focusLast,\n      focusNext,\n      focusPrev,\n      indicators\n    ]\n  )\n\n  return (\n    <StepperContext.Provider value={contextValue}>\n      <div\n        role=\"tablist\"\n        aria-orientation={orientation}\n        data-slot=\"stepper\"\n        className={cn('w-full', className)}\n        data-orientation={orientation}\n        {...props}\n      >\n        {children}\n      </div>\n    </StepperContext.Provider>\n  )\n}\n\ninterface StepperItemProps extends React.HTMLAttributes<HTMLDivElement> {\n  step: number\n  completed?: boolean\n  disabled?: boolean\n  loading?: boolean\n}\n\nfunction StepperItem({\n  step,\n  completed = false,\n  disabled = false,\n  loading = false,\n  className,\n  children,\n  ...props\n}: StepperItemProps) {\n  const { activeStep } = useStepper()\n\n  const state: StepState = completed || step < activeStep ? 'completed' : activeStep === step ? 'active' : 'inactive'\n\n  const isLoading = loading && step === activeStep\n\n  return (\n    <StepItemContext.Provider value={{ step, state, isDisabled: disabled, isLoading }}>\n      <div\n        data-slot=\"stepper-item\"\n        className={cn(\n          'group/step flex items-center justify-center not-last:flex-1 group-data-[orientation=horizontal]/stepper-nav:flex-row group-data-[orientation=vertical]/stepper-nav:flex-col',\n          className\n        )}\n        data-state={state}\n        {...(isLoading ? { 'data-loading': true } : {})}\n        {...props}\n      >\n        {children}\n      </div>\n    </StepItemContext.Provider>\n  )\n}\n\ninterface StepperTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  asChild?: boolean\n}\n\nfunction StepperTrigger({ asChild = false, className, children, tabIndex, ...props }: StepperTriggerProps) {\n  const { state, isLoading } = useStepItem()\n  const stepperCtx = useStepper()\n  const { setActiveStep, activeStep, registerTrigger, triggerNodes, focusNext, focusPrev, focusFirst, focusLast } =\n    stepperCtx\n  const { step, isDisabled } = useStepItem()\n  const isSelected = activeStep === step\n  const id = `stepper-tab-${step}`\n  const panelId = `stepper-panel-${step}`\n\n  // Register this trigger for keyboard navigation\n  const btnRef = useRef<HTMLButtonElement>(null)\n  useEffect(() => {\n    if (btnRef.current) {\n      registerTrigger(btnRef.current)\n    }\n  }, [registerTrigger])\n\n  // Find our index among triggers for navigation\n  const myIdx = useMemo(() => triggerNodes.findIndex((n: HTMLButtonElement) => n === btnRef.current), [triggerNodes])\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n    switch (e.key) {\n      case 'ArrowRight':\n      case 'ArrowDown':\n        e.preventDefault()\n        if (myIdx !== -1 && focusNext) focusNext(myIdx)\n        break\n      case 'ArrowLeft':\n      case 'ArrowUp':\n        e.preventDefault()\n        if (myIdx !== -1 && focusPrev) focusPrev(myIdx)\n        break\n      case 'Home':\n        e.preventDefault()\n        if (focusFirst) focusFirst()\n        break\n      case 'End':\n        e.preventDefault()\n        if (focusLast) focusLast()\n        break\n      case 'Enter':\n      case ' ':\n        e.preventDefault()\n        setActiveStep(step)\n        break\n    }\n  }\n\n  if (asChild) {\n    return (\n      <span data-slot=\"stepper-trigger\" data-state={state} className={className}>\n        {children}\n      </span>\n    )\n  }\n\n  return (\n    <button\n      ref={btnRef}\n      role=\"tab\"\n      id={id}\n      aria-selected={isSelected}\n      aria-controls={panelId}\n      tabIndex={typeof tabIndex === 'number' ? tabIndex : isSelected ? 0 : -1}\n      data-slot=\"stepper-trigger\"\n      data-state={state}\n      data-loading={isLoading}\n      className={cn(\n        'focus-visible:border-ring focus-visible:ring-ring/50 inline-flex cursor-pointer items-center outline-none focus-visible:z-10 focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-60',\n        'gap-2.5 rounded-full',\n        className\n      )}\n      onClick={() => setActiveStep(step)}\n      onKeyDown={handleKeyDown}\n      disabled={isDisabled}\n      {...props}\n    >\n      {children}\n    </button>\n  )\n}\n\nexport type StepperIndicatorProps = React.ComponentProps<'div'>\n\nfunction StepperIndicator({ children, className }: StepperIndicatorProps) {\n  const { state, isLoading } = useStepItem()\n  const { indicators } = useStepper()\n\n  return (\n    <div\n      data-slot=\"stepper-indicator\"\n      data-state={state}\n      className={cn(\n        'border-background bg-accent text-accent-foreground data-[state=completed]:bg-primary data-[state=completed]:text-primary-foreground data-[state=active]:bg-primary data-[state=active]:text-primary-foreground relative flex size-6 shrink-0 items-center justify-center overflow-hidden',\n        'rounded-full text-xs',\n        className\n      )}\n    >\n      <div className=\"absolute\">\n        {indicators &&\n        ((isLoading && indicators.loading) ||\n          (state === 'completed' && indicators.completed) ||\n          (state === 'active' && indicators.active) ||\n          (state === 'inactive' && indicators.inactive))\n          ? (isLoading && indicators.loading) ||\n            (state === 'completed' && indicators.completed) ||\n            (state === 'active' && indicators.active) ||\n            (state === 'inactive' && indicators.inactive)\n          : children}\n      </div>\n    </div>\n  )\n}\n\nexport type StepperSeparatorProps = React.ComponentProps<'div'>\n\nfunction StepperSeparator({ className }: StepperSeparatorProps) {\n  const { state } = useStepItem()\n\n  return (\n    <div\n      data-slot=\"stepper-separator\"\n      data-state={state}\n      className={cn(\n        'bg-muted rounded-sm group-data-[orientation=horizontal]/stepper-nav:h-0.5 group-data-[orientation=vertical]/stepper-nav:h-12 group-data-[orientation=vertical]/stepper-nav:w-0.5 m-0.5 group-data-[orientation=horizontal]/stepper-nav:flex-1',\n        className\n      )}\n    />\n  )\n}\n\nexport type StepperTitleProps = React.ComponentProps<'h3'>\n\nfunction StepperTitle({ children, className }: StepperTitleProps) {\n  const { state } = useStepItem()\n\n  return (\n    <h3 data-slot=\"stepper-title\" data-state={state} className={cn('text-sm leading-none font-medium', className)}>\n      {children}\n    </h3>\n  )\n}\n\nexport type StepperDescriptionProps = React.ComponentProps<'div'>\n\nfunction StepperDescription({ children, className }: StepperDescriptionProps) {\n  const { state } = useStepItem()\n\n  return (\n    <div data-slot=\"stepper-description\" data-state={state} className={cn('text-muted-foreground text-sm', className)}>\n      {children}\n    </div>\n  )\n}\n\nexport type StepperNavProps = React.ComponentProps<'nav'>\n\nfunction StepperNav({ children, className }: StepperNavProps) {\n  const { activeStep, orientation } = useStepper()\n\n  return (\n    <nav\n      data-slot=\"stepper-nav\"\n      data-state={activeStep}\n      data-orientation={orientation}\n      className={cn(\n        'group/stepper-nav inline-flex data-[orientation=horizontal]:w-full data-[orientation=horizontal]:flex-row data-[orientation=vertical]:flex-col',\n        className\n      )}\n    >\n      {children}\n    </nav>\n  )\n}\n\nexport type StepperPanelProps = React.ComponentProps<'div'>\n\nfunction StepperPanel({ children, className }: StepperPanelProps) {\n  const { activeStep } = useStepper()\n\n  return (\n    <div data-slot=\"stepper-panel\" data-state={activeStep} className={cn('w-full', className)}>\n      {children}\n    </div>\n  )\n}\n\ninterface StepperContentProps extends React.ComponentProps<'div'> {\n  value: number\n  forceMount?: boolean\n}\n\nfunction StepperContent({ value, forceMount, children, className }: StepperContentProps) {\n  const { activeStep } = useStepper()\n  const isActive = value === activeStep\n\n  if (!forceMount && !isActive) {\n    return null\n  }\n\n  return (\n    <div\n      data-slot=\"stepper-content\"\n      data-state={activeStep}\n      className={cn('w-full', className, !isActive && forceMount && 'hidden')}\n      hidden={!isActive && forceMount}\n    >\n      {children}\n    </div>\n  )\n}\n\nexport {\n  Stepper,\n  StepperContent,\n  type StepperContentProps,\n  StepperDescription,\n  StepperIndicator,\n  StepperItem,\n  type StepperItemProps,\n  StepperNav,\n  StepperPanel,\n  type StepperProps,\n  StepperSeparator,\n  StepperTitle,\n  StepperTrigger,\n  type StepperTriggerProps,\n  useStepItem,\n  useStepper\n}\n"],"mappings":"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"}
+{"version":3,"file":"stepper.js","names":["StepperContext","createContext","StepItemContext","ctx","useContext","props","activeStep","setActiveStep","useState","defaultValue","baseId","useId","handleSetActiveStep","useCallback","value","step","onValueChange","currentStep","getTriggerId","getContentId","contextValue","useMemo","Children","children","isValidElement","child","orientation","indicators","cn","className","state","completed","isLoading","loading","disabled","root","trigger","node","isSelected","isAriaDisabled","asChild","isDisabled","onClick","event","onKeyDown","triggers","index","target","useAsChild","tabIndex","isActive","forceMount"],"sources":["../../src/components/stepper.tsx"],"sourcesContent":["import {\n  Children,\n  createContext,\n  isValidElement,\n  type ReactElement,\n  useCallback,\n  useContext,\n  useId,\n  useMemo,\n  useState\n} from 'react'\n\nimport { type AsChildProps, useAsChild } from '../lib/as-child'\nimport { cn } from '../lib/utils'\n\n// Types\ntype StepperOrientation = 'horizontal' | 'vertical'\ntype StepState = 'active' | 'completed' | 'inactive' | 'loading'\ntype StepIndicators = {\n  active?: React.ReactNode\n  completed?: React.ReactNode\n  inactive?: React.ReactNode\n  loading?: React.ReactNode\n}\n\ninterface StepperContextValue {\n  activeStep: number\n  setActiveStep: (step: number) => void\n  stepsCount: number\n  orientation: StepperOrientation\n  indicators: StepIndicators\n  getTriggerId: (step: number) => string\n  getContentId: (step: number) => string\n}\n\ninterface StepItemContextValue {\n  step: number\n  state: StepState\n  isDisabled: boolean\n  isLoading: boolean\n}\n\nconst StepperContext = createContext<StepperContextValue | undefined>(undefined)\nconst StepItemContext = createContext<StepItemContextValue | undefined>(undefined)\n\nfunction useStepper() {\n  const ctx = useContext(StepperContext)\n  if (!ctx) throw new Error('useStepper must be used within a Stepper')\n  return ctx\n}\n\nfunction useStepItem() {\n  const ctx = useContext(StepItemContext)\n  if (!ctx) throw new Error('useStepItem must be used within a StepperItem')\n  return ctx\n}\n\nexport type StepperProps = Omit<React.ComponentProps<'div'>, 'defaultValue'> & {\n  /**\n   * Initial step (uncontrolled), starting at `1`.\n   * @default 1\n   */\n  defaultValue?: number\n  /** Current step (controlled). */\n  value?: number\n  /** Called with the new step when the user moves to it. */\n  onValueChange?: (value: number) => void\n  /**\n   * Layout of the steps.\n   * @default 'horizontal'\n   */\n  orientation?: StepperOrientation\n  /** Custom indicator content per state: `active`, `completed`, `inactive`, `loading`. */\n  indicators?: StepIndicators\n}\n\nfunction Stepper({\n  defaultValue = 1,\n  value,\n  onValueChange,\n  orientation = 'horizontal',\n  className,\n  children,\n  indicators = {},\n  ...props\n}: StepperProps) {\n  const [activeStep, setActiveStep] = useState(defaultValue)\n  const baseId = useId()\n\n  const handleSetActiveStep = useCallback(\n    (step: number) => {\n      if (value === undefined) {\n        setActiveStep(step)\n      }\n      onValueChange?.(step)\n    },\n    [value, onValueChange]\n  )\n\n  const currentStep = value ?? activeStep\n\n  const getTriggerId = useCallback((step: number) => `${baseId}-tab-${step}`, [baseId])\n  const getContentId = useCallback((step: number) => `${baseId}-panel-${step}`, [baseId])\n\n  // Context value\n  const contextValue = useMemo<StepperContextValue>(\n    () => ({\n      activeStep: currentStep,\n      setActiveStep: handleSetActiveStep,\n      stepsCount: Children.toArray(children).filter(\n        (child): child is ReactElement =>\n          isValidElement(child) && (child.type as { displayName?: string }).displayName === 'StepperItem'\n      ).length,\n      orientation,\n      indicators,\n      getTriggerId,\n      getContentId\n    }),\n    [currentStep, handleSetActiveStep, children, orientation, indicators, getTriggerId, getContentId]\n  )\n\n  return (\n    <StepperContext.Provider value={contextValue}>\n      <div\n        role=\"tablist\"\n        aria-orientation={orientation}\n        data-slot=\"stepper\"\n        className={cn('w-full', className)}\n        data-orientation={orientation}\n        {...props}\n      >\n        {children}\n      </div>\n    </StepperContext.Provider>\n  )\n}\n\nexport type StepperItemProps = React.ComponentProps<'div'> & {\n  /** Number of this step, starting at `1`. */\n  step: number\n  /**\n   * Marks the step as completed.\n   * @default false\n   */\n  completed?: boolean\n  /**\n   * Prevents navigating to this step.\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * Shows the loading indicator for this step.\n   * @default false\n   */\n  loading?: boolean\n}\n\nfunction StepperItem({\n  step,\n  completed = false,\n  disabled = false,\n  loading = false,\n  className,\n  children,\n  ...props\n}: StepperItemProps) {\n  const { activeStep } = useStepper()\n\n  const state: StepState = completed || step < activeStep ? 'completed' : activeStep === step ? 'active' : 'inactive'\n\n  const isLoading = loading && step === activeStep\n\n  return (\n    <StepItemContext.Provider value={{ step, state, isDisabled: disabled, isLoading }}>\n      <div\n        data-slot=\"stepper-item\"\n        className={cn(\n          'group/step flex items-center justify-center not-last:flex-1 group-data-[orientation=horizontal]/stepper-nav:flex-row group-data-[orientation=vertical]/stepper-nav:flex-col',\n          className\n        )}\n        data-state={state}\n        {...(isLoading ? { 'data-loading': true } : {})}\n        {...props}\n      >\n        {children}\n      </div>\n    </StepItemContext.Provider>\n  )\n}\n\nexport type StepperTriggerProps = AsChildProps<'button'>\n\n// Enabled triggers of the closest Stepper, in DOM order (nested steppers excluded).\nfunction getStepperTriggers(trigger: HTMLElement) {\n  const root = trigger.closest('[data-slot=\"stepper\"]')\n  if (!root) return []\n\n  return Array.from(root.querySelectorAll<HTMLElement>('[data-slot=\"stepper-trigger\"]')).filter(\n    (node) => node.closest('[data-slot=\"stepper\"]') === root && !node.matches(':disabled, [aria-disabled=\"true\"]')\n  )\n}\n\nfunction StepperTrigger({\n  asChild = false,\n  className,\n  children,\n  tabIndex,\n  onClick,\n  onKeyDown,\n  ...props\n}: StepperTriggerProps) {\n  const { setActiveStep, activeStep, getTriggerId, getContentId } = useStepper()\n  const { step, state, isDisabled, isLoading } = useStepItem()\n  const isSelected = activeStep === step\n  // A non-button child can't be natively disabled, so it gets `aria-disabled` instead.\n  const isAriaDisabled = asChild && isDisabled\n\n  const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    onClick?.(event)\n    if (event.defaultPrevented || isDisabled) return\n    setActiveStep(step)\n  }\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>) => {\n    onKeyDown?.(event)\n    if (event.defaultPrevented) return\n\n    const triggers = getStepperTriggers(event.currentTarget)\n    const index = triggers.indexOf(event.currentTarget)\n    let target: HTMLElement | undefined\n\n    switch (event.key) {\n      case 'ArrowRight':\n      case 'ArrowDown':\n        target = index === -1 ? undefined : triggers[(index + 1) % triggers.length]\n        break\n      case 'ArrowLeft':\n      case 'ArrowUp':\n        target = index === -1 ? undefined : triggers[(index - 1 + triggers.length) % triggers.length]\n        break\n      case 'Home':\n        target = triggers[0]\n        break\n      case 'End':\n        target = triggers[triggers.length - 1]\n        break\n      case 'Enter':\n      case ' ':\n        event.preventDefault()\n        if (!isDisabled) setActiveStep(step)\n        return\n      default:\n        return\n    }\n\n    event.preventDefault()\n    target?.focus()\n  }\n\n  return useAsChild('button', {\n    asChild,\n    type: !asChild ? 'button' : undefined,\n    role: 'tab',\n    id: getTriggerId(step),\n    'aria-selected': isSelected,\n    'aria-controls': getContentId(step),\n    'aria-disabled': isAriaDisabled ? true : undefined,\n    tabIndex: typeof tabIndex === 'number' ? tabIndex : isSelected ? 0 : -1,\n    'data-slot': 'stepper-trigger',\n    'data-state': state,\n    'data-loading': isLoading,\n    disabled: asChild ? undefined : isDisabled,\n    className: cn(\n      'focus-visible:border-ring focus-visible:ring-ring/50 inline-flex cursor-pointer items-center outline-none focus-visible:z-10 focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-60 aria-disabled:pointer-events-none aria-disabled:opacity-60',\n      'gap-2.5 rounded-full',\n      className\n    ),\n    onClick: handleClick,\n    onKeyDown: handleKeyDown,\n    ...props,\n    children\n  })\n}\n\nexport type StepperIndicatorProps = React.ComponentProps<'div'>\n\nfunction StepperIndicator({ children, className, ...props }: StepperIndicatorProps) {\n  const { state, isLoading } = useStepItem()\n  const { indicators } = useStepper()\n\n  return (\n    <div\n      data-slot=\"stepper-indicator\"\n      data-state={state}\n      className={cn(\n        'border-background bg-accent text-accent-foreground data-[state=completed]:bg-primary data-[state=completed]:text-primary-foreground data-[state=active]:bg-primary data-[state=active]:text-primary-foreground relative flex size-6 shrink-0 items-center justify-center overflow-hidden',\n        'rounded-full text-xs',\n        className\n      )}\n      {...props}\n    >\n      <div className=\"absolute\">\n        {indicators &&\n        ((isLoading && indicators.loading) ||\n          (state === 'completed' && indicators.completed) ||\n          (state === 'active' && indicators.active) ||\n          (state === 'inactive' && indicators.inactive))\n          ? (isLoading && indicators.loading) ||\n            (state === 'completed' && indicators.completed) ||\n            (state === 'active' && indicators.active) ||\n            (state === 'inactive' && indicators.inactive)\n          : children}\n      </div>\n    </div>\n  )\n}\n\nexport type StepperSeparatorProps = React.ComponentProps<'div'>\n\nfunction StepperSeparator({ className, ...props }: StepperSeparatorProps) {\n  const { state } = useStepItem()\n\n  return (\n    <div\n      data-slot=\"stepper-separator\"\n      data-state={state}\n      className={cn(\n        'bg-muted rounded-sm group-data-[orientation=horizontal]/stepper-nav:h-0.5 group-data-[orientation=vertical]/stepper-nav:h-12 group-data-[orientation=vertical]/stepper-nav:w-0.5 m-0.5 group-data-[orientation=horizontal]/stepper-nav:flex-1',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport type StepperTitleProps = React.ComponentProps<'h3'>\n\nfunction StepperTitle({ children, className, ...props }: StepperTitleProps) {\n  const { state } = useStepItem()\n\n  return (\n    <h3\n      data-slot=\"stepper-title\"\n      data-state={state}\n      className={cn('text-sm leading-none font-medium', className)}\n      {...props}\n    >\n      {children}\n    </h3>\n  )\n}\n\nexport type StepperDescriptionProps = React.ComponentProps<'div'>\n\nfunction StepperDescription({ children, className, ...props }: StepperDescriptionProps) {\n  const { state } = useStepItem()\n\n  return (\n    <div\n      data-slot=\"stepper-description\"\n      data-state={state}\n      className={cn('text-muted-foreground text-sm', className)}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n\nexport type StepperNavProps = React.ComponentProps<'nav'>\n\nfunction StepperNav({ children, className, ...props }: StepperNavProps) {\n  const { activeStep, orientation } = useStepper()\n\n  return (\n    <nav\n      data-slot=\"stepper-nav\"\n      data-state={activeStep}\n      data-orientation={orientation}\n      className={cn(\n        'group/stepper-nav inline-flex data-[orientation=horizontal]:w-full data-[orientation=horizontal]:flex-row data-[orientation=vertical]:flex-col',\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </nav>\n  )\n}\n\nexport type StepperPanelProps = React.ComponentProps<'div'>\n\nfunction StepperPanel({ children, className, ...props }: StepperPanelProps) {\n  const { activeStep } = useStepper()\n\n  return (\n    <div data-slot=\"stepper-panel\" data-state={activeStep} className={cn('w-full', className)} {...props}>\n      {children}\n    </div>\n  )\n}\n\nexport type StepperContentProps = React.ComponentProps<'div'> & {\n  /** Step this content belongs to. */\n  value: number\n  /** Keeps the content mounted when its step isn’t active. */\n  forceMount?: boolean\n}\n\nfunction StepperContent({ value, forceMount, children, className, ...props }: StepperContentProps) {\n  const { activeStep, getTriggerId, getContentId } = useStepper()\n  const isActive = value === activeStep\n\n  if (!forceMount && !isActive) {\n    return null\n  }\n\n  return (\n    <div\n      role=\"tabpanel\"\n      id={getContentId(value)}\n      aria-labelledby={getTriggerId(value)}\n      data-slot=\"stepper-content\"\n      data-state={activeStep}\n      className={cn('w-full', className, !isActive && forceMount && 'hidden')}\n      hidden={!isActive && forceMount}\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n\nexport {\n  Stepper,\n  StepperContent,\n  StepperDescription,\n  StepperIndicator,\n  StepperItem,\n  StepperNav,\n  StepperPanel,\n  StepperSeparator,\n  StepperTitle,\n  StepperTrigger,\n  useStepItem,\n  useStepper\n}\n"],"mappings":"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"}

package/dist/components/switch.d.ts

@@ -1,17 +1,31 @@
 import { t as __name } from "../rolldown-runtime-BhWHdk3m.js";
 import { UIColor } from "../lib/color.js";
 import { LabelProps } from "./label.js";
-import { Switch as Switch$1 } from "radix-ui";
 import * as React from "react";
 import { ReactNode } from "react";
+import { Switch as Switch$1 } from "@base-ui/react/switch";
 //#region src/components/switch.d.ts
-export type SwitchProps = React.ComponentProps<typeof Switch$1.Root> & {
+export type SwitchProps = Omit<React.ComponentProps<typeof Switch$1.Root>, 'render'> & {
+  /**
+   * Palette family used when on.
+   * @default 'green'
+   */
   color?: UIColor;
+  /** Label rendered next to the switch and linked to it. */
   label?: ReactNode;
+  /** Props for the rendered label. */
   labelProps?: Omit<LabelProps, 'children' | 'htmlFor'>;
+  /** Helper text rendered below the label. */
+  description?: ReactNode;
+  /** Props for the rendered description. */
+  descriptionProps?: Omit<React.ComponentProps<'p'>, 'children'>;
+  /**
+   * Size of the switch and its label.
+   * @default 'md'
+   */
   size?: 'sm' | 'md' | 'lg';
 };
-declare function Switch({ className, color, id, label, labelProps, size, ...props }: SwitchProps): React.JSX.Element;
+declare function Switch({ className, color, id, label, labelProps, description, descriptionProps, size, 'aria-invalid': ariaInvalid, ...props }: SwitchProps): React.JSX.Element;
 //#endregion
 export { Switch };
 //# sourceMappingURL=switch.d.ts.map

package/dist/components/switch.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-BhWHdk3m.js";import{cn as e}from"../lib/utils.js";import{Label as t}from"./label.js";import{useFieldControlId as n}from"./field.js";import{Switch as r}from"radix-ui";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{cva as o}from"class-variance-authority";import{useId as s}from"react";const c={primary:`[--switch-checked:var(--primary)]`,brand:`[--switch-checked:var(--brand)]`,gray:`[--switch-checked:var(--gray)]`,zinc:`[--switch-checked:var(--zinc)]`,red:`[--switch-checked:var(--red)]`,yellow:`[--switch-checked:var(--yellow)]`,blue:`[--switch-checked:var(--blue)]`,indigo:`[--switch-checked:var(--indigo)]`,pink:`[--switch-checked:var(--pink)]`,green:`[--switch-checked:var(--green)]`},l=o(``,{variants:{size:{sm:`text-sm`,md:`text-base`,lg:`text-lg`}},defaultVariants:{size:`md`}});function Switch({className:o,color:u=`green`,id:d,label:f,labelProps:p,size:m=`md`,...h}){let g=s(),_=n(d),v=f!==void 0,y=_??(v?g:void 0),{className:b,...x}=p??{},S=/* @__PURE__ */ i(r.Root,{"data-slot":`switch`,"data-color":u,"data-size":m,id:y,className:e(`peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none`,`after:absolute after:-inset-x-3 after:-inset-y-2`,`focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50`,`aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20`,`data-[size=lg]:h-5.5 data-[size=lg]:w-12 data-[size=md]:h-5 data-[size=md]:w-10.5 data-[size=sm]:h-4 data-[size=sm]:w-8.5`,`dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40`,`data-checked:bg-(--switch-checked) data-unchecked:bg-input dark:data-unchecked:bg-input/80`,`data-disabled:cursor-not-allowed data-disabled:opacity-50`,c[u],o),...h,children:/* @__PURE__ */ i(r.Thumb,{"data-slot":`switch-thumb`,className:e(`pointer-events-none flex items-center justify-center rounded-full bg-background ring-0 transition-transform`,`group-data-[size=lg]/switch:size-4.5 group-data-[size=md]/switch:size-4 group-data-[size=sm]/switch:size-3`,`group-data-[size=lg]/switch:data-checked:translate-x-7`,`group-data-[size=md]/switch:data-checked:translate-x-6`,`group-data-[size=sm]/switch:data-checked:translate-x-5`,`group-data-[size=lg]/switch:data-unchecked:translate-x-0.5`,`group-data-[size=md]/switch:data-unchecked:translate-x-0.5`,`group-data-[size=sm]/switch:data-unchecked:translate-x-0.5`,`dark:data-checked:bg-primary-foreground dark:data-unchecked:bg-foreground`),children:/* @__PURE__ */ i(`span`,{"data-slot":`switch-thumb-indicator`,className:e(`rounded-full transition-colors`,`group-data-[size=lg]/switch:size-2.5 group-data-[size=md]/switch:size-2 group-data-[size=sm]/switch:size-1.5`,`group-data-checked/switch:bg-(--switch-checked) group-data-unchecked/switch:bg-input`,`group-data-unchecked/switch:dark:bg-input/80`)})})});return v?/* @__PURE__ */ a(`div`,{"data-slot":`switch-field`,className:`flex items-center gap-2`,children:[S,/* @__PURE__ */ i(t,{...x,htmlFor:y,className:e(l({size:m}),b),children:f})]}):S}export{Switch};
+import"../rolldown-runtime-BhWHdk3m.js";import{cn as e}from"../lib/utils.js";import{t}from"../resolve-class-name-BurP8ngI.js";import{Label as n}from"./label.js";import{useFieldControlId as r,useFieldInvalid as i}from"./field.js";import{useId as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";import{cva as c}from"class-variance-authority";import{Switch as l}from"@base-ui/react/switch";const u={primary:`[--switch-checked:var(--primary)]`,brand:`[--switch-checked:var(--brand)]`,gray:`[--switch-checked:var(--gray)]`,zinc:`[--switch-checked:var(--zinc)]`,red:`[--switch-checked:var(--red)]`,yellow:`[--switch-checked:var(--yellow)]`,blue:`[--switch-checked:var(--blue)]`,indigo:`[--switch-checked:var(--indigo)]`,pink:`[--switch-checked:var(--pink)]`,green:`[--switch-checked:var(--green)]`},d=c(``,{variants:{size:{sm:`text-xs`,md:`text-sm`,lg:`text-lg`}},defaultVariants:{size:`md`}}),f=c(`text-muted-foreground text-left leading-normal font-normal [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary`,{variants:{size:{sm:`text-xs`,md:`text-xs`,lg:`text-sm`}},defaultVariants:{size:`md`}});function Switch({className:c,color:p=`green`,id:m,label:h,labelProps:g,description:_,descriptionProps:v,size:y=`md`,"aria-invalid":b,...x}){let S=a(),C=r(m),w=i(b),T=h!==void 0,E=C??(T?S:void 0),{className:D,...O}=g??{},k=a(),A=_!==void 0,{className:j,...M}=v??{},N=A?M.id??k:void 0,P=/* @__PURE__ */ o(l.Root,{"data-slot":`switch`,"data-color":p,"data-size":y,id:E,"aria-describedby":N,"aria-invalid":w,className:n=>e(`peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none`,`after:absolute after:-inset-x-3 after:-inset-y-2`,`focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50`,`data-[size=lg]:h-5 data-[size=lg]:w-10.5 data-[size=md]:h-4 data-[size=md]:w-8.5 data-[size=sm]:h-3.5 data-[size=sm]:w-7.5`,`data-checked:bg-(--switch-checked) data-unchecked:bg-input dark:data-unchecked:bg-input/80`,`data-disabled:cursor-not-allowed data-disabled:opacity-50`,u[p],t(c,n)),...x,children:/* @__PURE__ */ o(l.Thumb,{"data-slot":`switch-thumb`,className:e(`pointer-events-none flex items-center justify-center rounded-full bg-background ring-0 transition-transform`,`group-data-[size=lg]/switch:size-4 group-data-[size=md]/switch:size-3 group-data-[size=sm]/switch:size-2.5`,`group-data-[size=lg]/switch:data-checked:translate-x-6`,`group-data-[size=md]/switch:data-checked:translate-x-5`,`group-data-[size=sm]/switch:data-checked:translate-x-4.5`,`group-data-[size=lg]/switch:data-unchecked:translate-x-0.5`,`group-data-[size=md]/switch:data-unchecked:translate-x-0.5`,`group-data-[size=sm]/switch:data-unchecked:translate-x-0.5`,`dark:data-checked:bg-primary-foreground dark:data-unchecked:bg-foreground`),children:/* @__PURE__ */ o(`span`,{"data-slot":`switch-thumb-indicator`,className:e(`rounded-full transition-colors`,`group-data-[size=lg]/switch:size-2 group-data-[size=md]/switch:size-1.5 group-data-[size=sm]/switch:size-1`,`group-data-checked/switch:bg-(--switch-checked) group-data-unchecked/switch:bg-input`,`group-data-unchecked/switch:dark:bg-input/80`)})})});return!T&&!A?P:/* @__PURE__ */ s(`div`,{"data-slot":`switch-field`,className:`grid grid-cols-[auto_1fr] items-center justify-items-start gap-x-2 gap-y-0.5`,children:[P,T&&/* @__PURE__ */ o(n,{...O,htmlFor:E,className:e(d({size:y}),D),children:h}),A&&/* @__PURE__ */ o(`p`,{"data-slot":`switch-description`,...M,id:N,className:e(`col-start-2`,f({size:y}),j),children:_})]})}export{Switch};
 //# sourceMappingURL=switch.js.map

package/dist/components/switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.js","names":["SwitchPrimitive","Label","Label$1","Switch$1","switchColorVariants","switchLabelVariants","cva","props","generatedId","useId","fieldControlId","useFieldControlId","id","hasLabel","label","resolvedId","labelClassName","labelRootProps","labelProps","switchControl","color","size","cn","className"],"sources":["../../src/components/switch.tsx"],"sourcesContent":["import type * as React from 'react'\nimport { type ReactNode, useId } from 'react'\n\nimport { cva } from 'class-variance-authority'\nimport { Switch as SwitchPrimitive } from 'radix-ui'\n\nimport type { UIColor } from '../lib/color'\nimport { cn } from '../lib/utils'\nimport { useFieldControlId } from './field'\nimport { Label, type LabelProps } from './label'\n\nexport type SwitchProps = React.ComponentProps<typeof SwitchPrimitive.Root> & {\n  color?: UIColor\n  label?: ReactNode\n  labelProps?: Omit<LabelProps, 'children' | 'htmlFor'>\n  size?: 'sm' | 'md' | 'lg'\n}\n\nconst switchColorVariants: Record<UIColor, string> = {\n  primary: '[--switch-checked:var(--primary)]',\n  brand: '[--switch-checked:var(--brand)]',\n  gray: '[--switch-checked:var(--gray)]',\n  zinc: '[--switch-checked:var(--zinc)]',\n  red: '[--switch-checked:var(--red)]',\n  yellow: '[--switch-checked:var(--yellow)]',\n  blue: '[--switch-checked:var(--blue)]',\n  indigo: '[--switch-checked:var(--indigo)]',\n  pink: '[--switch-checked:var(--pink)]',\n  green: '[--switch-checked:var(--green)]'\n}\n\nconst switchLabelVariants = cva('', {\n  variants: {\n    size: {\n      sm: 'text-sm',\n      md: 'text-base',\n      lg: 'text-lg'\n    }\n  },\n  defaultVariants: {\n    size: 'md'\n  }\n})\n\nfunction Switch({ className, color = 'green', id, label, labelProps, size = 'md', ...props }: SwitchProps) {\n  const generatedId = useId()\n  const fieldControlId = useFieldControlId(id)\n  const hasLabel = label !== undefined\n  const resolvedId = fieldControlId ?? (hasLabel ? generatedId : undefined)\n  const { className: labelClassName, ...labelRootProps } = labelProps ?? {}\n\n  const switchControl = (\n    <SwitchPrimitive.Root\n      data-slot=\"switch\"\n      data-color={color}\n      data-size={size}\n      id={resolvedId}\n      className={cn(\n        'peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none',\n        'after:absolute after:-inset-x-3 after:-inset-y-2',\n        'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50',\n        'aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20',\n        'data-[size=lg]:h-5.5 data-[size=lg]:w-12 data-[size=md]:h-5 data-[size=md]:w-10.5 data-[size=sm]:h-4 data-[size=sm]:w-8.5',\n        'dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40',\n        'data-checked:bg-(--switch-checked) data-unchecked:bg-input dark:data-unchecked:bg-input/80',\n        'data-disabled:cursor-not-allowed data-disabled:opacity-50',\n        switchColorVariants[color],\n        className\n      )}\n      {...props}\n    >\n      <SwitchPrimitive.Thumb\n        data-slot=\"switch-thumb\"\n        className={cn(\n          'pointer-events-none flex items-center justify-center rounded-full bg-background ring-0 transition-transform',\n          'group-data-[size=lg]/switch:size-4.5 group-data-[size=md]/switch:size-4 group-data-[size=sm]/switch:size-3',\n          'group-data-[size=lg]/switch:data-checked:translate-x-7',\n          'group-data-[size=md]/switch:data-checked:translate-x-6',\n          'group-data-[size=sm]/switch:data-checked:translate-x-5',\n          'group-data-[size=lg]/switch:data-unchecked:translate-x-0.5',\n          'group-data-[size=md]/switch:data-unchecked:translate-x-0.5',\n          'group-data-[size=sm]/switch:data-unchecked:translate-x-0.5',\n          'dark:data-checked:bg-primary-foreground dark:data-unchecked:bg-foreground'\n        )}\n      >\n        <span\n          data-slot=\"switch-thumb-indicator\"\n          className={cn(\n            'rounded-full transition-colors',\n            'group-data-[size=lg]/switch:size-2.5 group-data-[size=md]/switch:size-2 group-data-[size=sm]/switch:size-1.5',\n            'group-data-checked/switch:bg-(--switch-checked) group-data-unchecked/switch:bg-input',\n            'group-data-unchecked/switch:dark:bg-input/80'\n          )}\n        />\n      </SwitchPrimitive.Thumb>\n    </SwitchPrimitive.Root>\n  )\n\n  if (!hasLabel) {\n    return switchControl\n  }\n\n  return (\n    <div data-slot=\"switch-field\" className=\"flex items-center gap-2\">\n      {switchControl}\n      <Label {...labelRootProps} htmlFor={resolvedId} className={cn(switchLabelVariants({ size }), labelClassName)}>\n        {label}\n      </Label>\n    </div>\n  )\n}\n\nexport { Switch }\n"],"mappings":"gUAkBA,MAAMI,EAA+C,CACnD,QAAS,oCACT,MAAO,kCACP,KAAM,iCACN,KAAM,iCACN,IAAK,gCACL,OAAQ,mCACR,KAAM,iCACN,OAAQ,mCACR,KAAM,iCACN,MAAO,iCACT,EAEMC,EAAsBC,EAAI,GAAI,CAClC,SAAU,CACR,KAAM,CACJ,GAAI,UACJ,GAAI,YACJ,GAAI,SACN,CACF,EACA,gBAAiB,CACf,KAAM,IACR,CACF,CAAC,EAED,SAAS,OAAO,CAAE,YAAW,QAAQ,QAAS,KAAI,QAAO,aAAY,OAAO,KAAM,GAAGC,GAAsB,CACzG,IAAMC,EAAcC,EAAM,EACpBC,EAAiBC,EAAkBC,CAAE,EACrCC,EAAWC,IAAU,IAAA,GACrBC,EAAaL,IAAmBG,EAAWL,EAAc,IAAA,IACzD,CAAE,UAAWQ,EAAgB,GAAGC,GAAmBC,GAAc,CAAC,EAElEC,EACJ,kBAACnB,EAAgB,KAAjB,CACE,YAAU,SACV,aAAYoB,EACZ,YAAWC,EACX,GAAIN,EACJ,UAAWO,EACT,kIACA,mDACA,4EACA,uFACA,4HACA,gFACA,6FACA,4DACAlB,EAAoBgB,GACpBG,CACF,EACA,GAAIhB,EAEJ,SAAA,kBAACP,EAAgB,MAAjB,CACE,YAAU,eACV,UAAWsB,EACT,8GACA,6GACA,yDACA,yDACA,yDACA,6DACA,6DACA,6DACA,2EACF,EAEA,SAAA,kBAAC,OAAD,CACE,YAAU,yBACV,UAAWA,EACT,iCACA,+GACA,uFACA,8CACF,CACD,CAAA,CACoB,CAAA,CACH,CAAA,EAOxB,OAJKT,EAKH,kBAAC,MAAD,CAAK,YAAU,eAAe,UAAU,0BAAxC,SAAA,CACGM,EACD,kBAAClB,EAAD,CAAO,GAAIgB,EAAgB,QAASF,EAAY,UAAWO,EAAGjB,EAAoB,CAAE,MAAK,CAAC,EAAGW,CAAc,EACxG,SAAAF,CACI,CAAA,CACJ,IATEK,CAWX"}
+{"version":3,"file":"switch.js","names":["SwitchPrimitive","Switch$1","switchColorVariants","switchLabelVariants","cva","switchDescriptionVariants","ariaInvalid","props","generatedId","useId","fieldControlId","useFieldControlId","id","invalid","useFieldInvalid","hasLabel","label","resolvedId","labelClassName","labelRootProps","labelProps","descriptionId","hasDescription","description","descriptionClassName","descriptionRootProps","descriptionProps","resolvedDescriptionId","switchControl","color","size","cn","resolveClassName","className","state","Label"],"sources":["../../src/components/switch.tsx"],"sourcesContent":["import type * as React from 'react'\nimport { type ReactNode, useId } from 'react'\n\nimport { Switch as SwitchPrimitive } from '@base-ui/react/switch'\nimport { cva } from 'class-variance-authority'\n\nimport type { UIColor } from '../lib/color'\nimport { cn } from '../lib/utils'\nimport { resolveClassName } from '../utils/resolve-class-name'\nimport { useFieldControlId, useFieldInvalid } from './field'\nimport { Label, type LabelProps } from './label'\n\nexport type SwitchProps = Omit<React.ComponentProps<typeof SwitchPrimitive.Root>, 'render'> & {\n  /**\n   * Palette family used when on.\n   * @default 'green'\n   */\n  color?: UIColor\n  /** Label rendered next to the switch and linked to it. */\n  label?: ReactNode\n  /** Props for the rendered label. */\n  labelProps?: Omit<LabelProps, 'children' | 'htmlFor'>\n  /** Helper text rendered below the label. */\n  description?: ReactNode\n  /** Props for the rendered description. */\n  descriptionProps?: Omit<React.ComponentProps<'p'>, 'children'>\n  /**\n   * Size of the switch and its label.\n   * @default 'md'\n   */\n  size?: 'sm' | 'md' | 'lg'\n}\n\nconst switchColorVariants: Record<UIColor, string> = {\n  primary: '[--switch-checked:var(--primary)]',\n  brand: '[--switch-checked:var(--brand)]',\n  gray: '[--switch-checked:var(--gray)]',\n  zinc: '[--switch-checked:var(--zinc)]',\n  red: '[--switch-checked:var(--red)]',\n  yellow: '[--switch-checked:var(--yellow)]',\n  blue: '[--switch-checked:var(--blue)]',\n  indigo: '[--switch-checked:var(--indigo)]',\n  pink: '[--switch-checked:var(--pink)]',\n  green: '[--switch-checked:var(--green)]'\n}\n\nconst switchLabelVariants = cva('', {\n  variants: {\n    size: {\n      sm: 'text-xs',\n      md: 'text-sm',\n      lg: 'text-lg'\n    }\n  },\n  defaultVariants: {\n    size: 'md'\n  }\n})\n\nconst switchDescriptionVariants = cva(\n  'text-muted-foreground text-left leading-normal font-normal [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary',\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        md: 'text-xs',\n        lg: 'text-sm'\n      }\n    },\n    defaultVariants: {\n      size: 'md'\n    }\n  }\n)\n\nfunction Switch({\n  className,\n  color = 'green',\n  id,\n  label,\n  labelProps,\n  description,\n  descriptionProps,\n  size = 'md',\n  'aria-invalid': ariaInvalid,\n  ...props\n}: SwitchProps) {\n  const generatedId = useId()\n  const fieldControlId = useFieldControlId(id)\n  const invalid = useFieldInvalid(ariaInvalid)\n  const hasLabel = label !== undefined\n  const resolvedId = fieldControlId ?? (hasLabel ? generatedId : undefined)\n  const { className: labelClassName, ...labelRootProps } = labelProps ?? {}\n  const descriptionId = useId()\n  const hasDescription = description !== undefined\n  const { className: descriptionClassName, ...descriptionRootProps } = descriptionProps ?? {}\n  const resolvedDescriptionId = hasDescription ? (descriptionRootProps.id ?? descriptionId) : undefined\n\n  const switchControl = (\n    <SwitchPrimitive.Root\n      data-slot=\"switch\"\n      data-color={color}\n      data-size={size}\n      id={resolvedId}\n      aria-describedby={resolvedDescriptionId}\n      aria-invalid={invalid}\n      className={(state) =>\n        cn(\n          'peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none',\n          'after:absolute after:-inset-x-3 after:-inset-y-2',\n          'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50',\n          'data-[size=lg]:h-5 data-[size=lg]:w-10.5 data-[size=md]:h-4 data-[size=md]:w-8.5 data-[size=sm]:h-3.5 data-[size=sm]:w-7.5',\n          'data-checked:bg-(--switch-checked) data-unchecked:bg-input dark:data-unchecked:bg-input/80',\n          'data-disabled:cursor-not-allowed data-disabled:opacity-50',\n          switchColorVariants[color],\n          resolveClassName(className, state)\n        )\n      }\n      {...props}\n    >\n      <SwitchPrimitive.Thumb\n        data-slot=\"switch-thumb\"\n        className={cn(\n          'pointer-events-none flex items-center justify-center rounded-full bg-background ring-0 transition-transform',\n          'group-data-[size=lg]/switch:size-4 group-data-[size=md]/switch:size-3 group-data-[size=sm]/switch:size-2.5',\n          'group-data-[size=lg]/switch:data-checked:translate-x-6',\n          'group-data-[size=md]/switch:data-checked:translate-x-5',\n          'group-data-[size=sm]/switch:data-checked:translate-x-4.5',\n          'group-data-[size=lg]/switch:data-unchecked:translate-x-0.5',\n          'group-data-[size=md]/switch:data-unchecked:translate-x-0.5',\n          'group-data-[size=sm]/switch:data-unchecked:translate-x-0.5',\n          'dark:data-checked:bg-primary-foreground dark:data-unchecked:bg-foreground'\n        )}\n      >\n        <span\n          data-slot=\"switch-thumb-indicator\"\n          className={cn(\n            'rounded-full transition-colors',\n            'group-data-[size=lg]/switch:size-2 group-data-[size=md]/switch:size-1.5 group-data-[size=sm]/switch:size-1',\n            'group-data-checked/switch:bg-(--switch-checked) group-data-unchecked/switch:bg-input',\n            'group-data-unchecked/switch:dark:bg-input/80'\n          )}\n        />\n      </SwitchPrimitive.Thumb>\n    </SwitchPrimitive.Root>\n  )\n\n  if (!hasLabel && !hasDescription) {\n    return switchControl\n  }\n\n  return (\n    <div\n      data-slot=\"switch-field\"\n      className=\"grid grid-cols-[auto_1fr] items-center justify-items-start gap-x-2 gap-y-0.5\"\n    >\n      {switchControl}\n      {hasLabel && (\n        <Label {...labelRootProps} htmlFor={resolvedId} className={cn(switchLabelVariants({ size }), labelClassName)}>\n          {label}\n        </Label>\n      )}\n      {hasDescription && (\n        <p\n          data-slot=\"switch-description\"\n          {...descriptionRootProps}\n          id={resolvedDescriptionId}\n          className={cn('col-start-2', switchDescriptionVariants({ size }), descriptionClassName)}\n        >\n          {description}\n        </p>\n      )}\n    </div>\n  )\n}\n\nexport { Switch }\n"],"mappings":"mZAiCA,MAAME,EAA+C,CACnD,QAAS,oCACT,MAAO,kCACP,KAAM,iCACN,KAAM,iCACN,IAAK,gCACL,OAAQ,mCACR,KAAM,iCACN,OAAQ,mCACR,KAAM,iCACN,MAAO,iCACT,EAEMC,EAAsBC,EAAI,GAAI,CAClC,SAAU,CACR,KAAM,CACJ,GAAI,UACJ,GAAI,UACJ,GAAI,SACN,CACF,EACA,gBAAiB,CACf,KAAM,IACR,CACF,CAAC,EAEKC,EAA4BD,EAChC,+HACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,UACJ,GAAI,UACJ,GAAI,SACN,CACF,EACA,gBAAiB,CACf,KAAM,IACR,CACF,CACF,EAEA,SAAS,OAAO,CACd,YACA,QAAQ,QACR,KACA,QACA,aACA,cACA,mBACA,OAAO,KACP,eAAgBE,EAChB,GAAGC,GACW,CACd,IAAMC,EAAcC,EAAM,EACpBC,EAAiBC,EAAkBC,CAAE,EACrCC,EAAUC,EAAgBR,CAAW,EACrCS,EAAWC,IAAU,IAAA,GACrBC,EAAaP,IAAmBK,EAAWP,EAAc,IAAA,IACzD,CAAE,UAAWU,EAAgB,GAAGC,GAAmBC,GAAc,CAAC,EAClEC,EAAgBZ,EAAM,EACtBa,EAAiBC,IAAgB,IAAA,GACjC,CAAE,UAAWC,EAAsB,GAAGC,GAAyBC,GAAoB,CAAC,EACpFC,EAAwBL,EAAkBG,EAAqB,IAAMJ,EAAiB,IAAA,GAEtFO,EACJ,kBAAC5B,EAAgB,KAAjB,CACE,YAAU,SACV,aAAY6B,EACZ,YAAWC,EACX,GAAIb,EACJ,mBAAkBU,EAClB,eAAcd,EACd,UAAY,GACVkB,EACE,kIACA,mDACA,4EACA,6HACA,6FACA,4DACA7B,EAAoB2B,GACpBG,EAAiBC,EAAWC,CAAK,CACnC,EAEF,GAAI3B,EAEJ,SAAA,kBAACP,EAAgB,MAAjB,CACE,YAAU,eACV,UAAW+B,EACT,8GACA,6GACA,yDACA,yDACA,2DACA,6DACA,6DACA,6DACA,2EACF,EAEA,SAAA,kBAAC,OAAD,CACE,YAAU,yBACV,UAAWA,EACT,iCACA,6GACA,uFACA,8CACF,CACD,CAAA,CACoB,CAAA,CACH,CAAA,EAOxB,MAJI,CAAChB,GAAY,CAACO,EACTM,EAIP,kBAAC,MAAD,CACE,YAAU,eACV,UAAU,+EAFZ,SAAA,CAIGA,EACAb,GACC,kBAACoB,EAAD,CAAO,GAAIhB,EAAgB,QAASF,EAAY,UAAWc,EAAG5B,EAAoB,CAAE,MAAK,CAAC,EAAGe,CAAc,EACxG,SAAAF,CACI,CAAA,EAERM,GACC,kBAAC,IAAD,CACE,YAAU,qBACV,GAAIG,EACJ,GAAIE,EACJ,UAAWI,EAAG,cAAe1B,EAA0B,CAAE,MAAK,CAAC,EAAGmB,CAAoB,EAErF,SAAAD,CACA,CAAA,CAEF,GAET"}

package/dist/components/table.d.ts

@@ -1,15 +1,24 @@
 import { t as __name } from "../rolldown-runtime-BhWHdk3m.js";
-import { VariantProps } from "class-variance-authority";
 import * as React from "react";
+import { VariantProps } from "class-variance-authority";
 //#region src/components/table.d.ts
 export type TableContainerProps = React.ComponentProps<'div'> & {
+  /** Minimum table width (px number or CSS length); the container scrolls horizontally below it. */
   minWidth?: number | string;
 };
 declare const tableVariants: (props?: ({
   variant?: "line" | "outline" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export type TableProps = React.ComponentProps<'table'> & VariantProps<typeof tableVariants> & {
+  /**
+   * Alternates the row background.
+   * @default true
+   */
   striped?: boolean;
+  /**
+   * Keeps the header at the top while the body scrolls inside a `TableContainer`.
+   * @default false
+   */
   stickyHeader?: boolean;
 };
 export type TableHeaderProps = React.ComponentProps<'thead'>;

package/dist/components/table.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-BhWHdk3m.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(`w-full caption-bottom text-sm`,{variants:{variant:{line:``,outline:e(`rounded-lg border border-separate border-spacing-0`,`[&_thead_th]:border-b`,`[&_tbody_tr:not(:last-child)>td]:border-b`)}},defaultVariants:{variant:`line`}});function TableContainer({className:n,minWidth:r,style:i,...a}){return/* @__PURE__ */ t(`div`,{"data-slot":`table-container`,className:e(`relative w-full overflow-x-auto`,`has-[>table[data-variant=outline]]:rounded-lg has-[>table[data-variant=outline]]:border`,`[&>table[data-variant=outline]]:rounded-none [&>table[data-variant=outline]]:border-0`,n),style:r===void 0?i:{minWidth:r,...i},...a})}function Table({className:n,variant:i=`line`,striped:a=!0,stickyHeader:o=!1,...s}){return/* @__PURE__ */ t(`table`,{"data-slot":`table`,"data-variant":i,"data-striped":a?`true`:`false`,"data-sticky-header":o?`true`:`false`,className:e(r({variant:i}),`data-[striped=true]:[&_tbody_tr:nth-child(even):not([data-state=selected]):not(:hover)]:bg-muted/50`,`data-[sticky-header=true]:[&_thead]:sticky data-[sticky-header=true]:[&_thead]:top-0 data-[sticky-header=true]:[&_thead]:z-10 data-[sticky-header=true]:[&_thead]:bg-background`,n),...s})}function TableHeader({className:n,...r}){return/* @__PURE__ */ t(`thead`,{"data-slot":`table-header`,className:e(`[&_tr]:border-b`,n),...r})}function TableBody({className:n,...r}){return/* @__PURE__ */ t(`tbody`,{"data-slot":`table-body`,className:e(`[&_tr:last-child]:border-0`,n),...r})}function TableFooter({className:n,...r}){return/* @__PURE__ */ t(`tfoot`,{"data-slot":`table-footer`,className:e(`border-t bg-muted/50 font-medium [&>tr]:last:border-b-0`,n),...r})}function TableRow({className:n,...r}){return/* @__PURE__ */ t(`tr`,{"data-slot":`table-row`,className:e(`border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted`,n),...r})}function TableHead({className:n,...r}){return/* @__PURE__ */ t(`th`,{"data-slot":`table-head`,className:e(`h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground has-[[role=checkbox]]:pr-0`,n),...r})}function TableCell({className:n,...r}){return/* @__PURE__ */ t(`td`,{"data-slot":`table-cell`,className:e(`p-2 align-middle whitespace-nowrap has-[[role=checkbox]]:pr-0`,n),...r})}function TableCaption({className:n,...r}){return/* @__PURE__ */ t(`caption`,{"data-slot":`table-caption`,className:e(`mt-4 text-sm text-muted-foreground`,n),...r})}export{Table,TableBody,TableCaption,TableCell,TableContainer,TableFooter,TableHead,TableHeader,TableRow,r as tableVariants};
+import"../rolldown-runtime-BhWHdk3m.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(`w-full caption-bottom text-sm`,{variants:{variant:{line:``,outline:e(`rounded-lg border border-separate border-spacing-0`,`[&_thead_th]:border-b`,`[&_tbody_tr:not(:last-child)>td]:border-b`)}},defaultVariants:{variant:`line`}});function TableContainer({className:n,minWidth:r,style:i,...a}){return/* @__PURE__ */ t(`div`,{"data-slot":`table-container`,className:e(`relative w-full overflow-x-auto`,`has-[>table[data-variant=outline]]:rounded-lg has-[>table[data-variant=outline]]:border`,`[&>table[data-variant=outline]]:rounded-none [&>table[data-variant=outline]]:border-0`,`[&>table]:min-w-(--table-min-width)`,n),style:r===void 0?i:{"--table-min-width":typeof r==`number`?`${r}px`:r,...i},...a})}function Table({className:n,variant:i=`line`,striped:a=!0,stickyHeader:o=!1,...s}){return/* @__PURE__ */ t(`table`,{"data-slot":`table`,"data-variant":i,"data-striped":a?`true`:`false`,"data-sticky-header":o?`true`:`false`,className:e(r({variant:i}),`data-[striped=true]:[&_tbody_tr:nth-child(even):not([data-state=selected]):not(:hover)]:bg-muted/50`,`data-[sticky-header=true]:[&_thead]:sticky data-[sticky-header=true]:[&_thead]:top-0 data-[sticky-header=true]:[&_thead]:z-10 data-[sticky-header=true]:[&_thead]:bg-background`,n),...s})}function TableHeader({className:n,...r}){return/* @__PURE__ */ t(`thead`,{"data-slot":`table-header`,className:e(`[&_tr]:border-b`,n),...r})}function TableBody({className:n,...r}){return/* @__PURE__ */ t(`tbody`,{"data-slot":`table-body`,className:e(`[&_tr:last-child]:border-0`,n),...r})}function TableFooter({className:n,...r}){return/* @__PURE__ */ t(`tfoot`,{"data-slot":`table-footer`,className:e(`border-t bg-muted/50 font-medium [&>tr]:last:border-b-0`,n),...r})}function TableRow({className:n,...r}){return/* @__PURE__ */ t(`tr`,{"data-slot":`table-row`,className:e(`border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted`,n),...r})}function TableHead({className:n,...r}){return/* @__PURE__ */ t(`th`,{"data-slot":`table-head`,className:e(`h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground has-[[role=checkbox]]:pr-0`,n),...r})}function TableCell({className:n,...r}){return/* @__PURE__ */ t(`td`,{"data-slot":`table-cell`,className:e(`p-2 align-middle whitespace-nowrap has-[[role=checkbox]]:pr-0`,n),...r})}function TableCaption({className:n,...r}){return/* @__PURE__ */ t(`caption`,{"data-slot":`table-caption`,className:e(`mt-4 text-sm text-muted-foreground`,n),...r})}export{Table,TableBody,TableCaption,TableCell,TableContainer,TableFooter,TableHead,TableHeader,TableRow,r as tableVariants};
 //# sourceMappingURL=table.js.map

package/dist/components/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","names":["tableVariants","cva","cn","props","className","minWidth","style","variant","striped","stickyHeader"],"sources":["../../src/components/table.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nexport type TableContainerProps = React.ComponentProps<'div'> & {\n  minWidth?: number | string\n}\n\nconst tableVariants = cva('w-full caption-bottom text-sm', {\n  variants: {\n    variant: {\n      line: '',\n      outline: cn(\n        'rounded-lg border border-separate border-spacing-0',\n        '[&_thead_th]:border-b',\n        '[&_tbody_tr:not(:last-child)>td]:border-b'\n      )\n    }\n  },\n  defaultVariants: {\n    variant: 'line'\n  }\n})\n\nexport type TableProps = React.ComponentProps<'table'> &\n  VariantProps<typeof tableVariants> & {\n    striped?: boolean\n    stickyHeader?: boolean\n  }\n\nexport type TableHeaderProps = React.ComponentProps<'thead'>\n\nexport type TableBodyProps = React.ComponentProps<'tbody'>\n\nexport type TableFooterProps = React.ComponentProps<'tfoot'>\n\nexport type TableRowProps = React.ComponentProps<'tr'>\n\nexport type TableHeadProps = React.ComponentProps<'th'>\n\nexport type TableCellProps = React.ComponentProps<'td'>\n\nexport type TableCaptionProps = React.ComponentProps<'caption'>\n\nfunction TableContainer({ className, minWidth, style, ...props }: TableContainerProps) {\n  return (\n    <div\n      data-slot=\"table-container\"\n      className={cn(\n        'relative w-full overflow-x-auto',\n        'has-[>table[data-variant=outline]]:rounded-lg has-[>table[data-variant=outline]]:border',\n        '[&>table[data-variant=outline]]:rounded-none [&>table[data-variant=outline]]:border-0',\n        className\n      )}\n      style={minWidth !== undefined ? { minWidth, ...style } : style}\n      {...props}\n    />\n  )\n}\n\nfunction Table({ className, variant = 'line', striped = true, stickyHeader = false, ...props }: TableProps) {\n  return (\n    <table\n      data-slot=\"table\"\n      data-variant={variant}\n      data-striped={striped ? 'true' : 'false'}\n      data-sticky-header={stickyHeader ? 'true' : 'false'}\n      className={cn(\n        tableVariants({ variant }),\n        'data-[striped=true]:[&_tbody_tr:nth-child(even):not([data-state=selected]):not(:hover)]:bg-muted/50',\n        'data-[sticky-header=true]:[&_thead]:sticky data-[sticky-header=true]:[&_thead]:top-0 data-[sticky-header=true]:[&_thead]:z-10 data-[sticky-header=true]:[&_thead]:bg-background',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TableHeader({ className, ...props }: TableHeaderProps) {\n  return <thead data-slot=\"table-header\" className={cn('[&_tr]:border-b', className)} {...props} />\n}\n\nfunction TableBody({ className, ...props }: TableBodyProps) {\n  return <tbody data-slot=\"table-body\" className={cn('[&_tr:last-child]:border-0', className)} {...props} />\n}\n\nfunction TableFooter({ className, ...props }: TableFooterProps) {\n  return (\n    <tfoot\n      data-slot=\"table-footer\"\n      className={cn('border-t bg-muted/50 font-medium [&>tr]:last:border-b-0', className)}\n      {...props}\n    />\n  )\n}\n\nfunction TableRow({ className, ...props }: TableRowProps) {\n  return (\n    <tr\n      data-slot=\"table-row\"\n      className={cn('border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted', className)}\n      {...props}\n    />\n  )\n}\n\nfunction TableHead({ className, ...props }: TableHeadProps) {\n  return (\n    <th\n      data-slot=\"table-head\"\n      className={cn(\n        'h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground has-[[role=checkbox]]:pr-0',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TableCell({ className, ...props }: TableCellProps) {\n  return (\n    <td\n      data-slot=\"table-cell\"\n      className={cn('p-2 align-middle whitespace-nowrap has-[[role=checkbox]]:pr-0', className)}\n      {...props}\n    />\n  )\n}\n\nfunction TableCaption({ className, ...props }: TableCaptionProps) {\n  return (\n    <caption data-slot=\"table-caption\" className={cn('mt-4 text-sm text-muted-foreground', className)} {...props} />\n  )\n}\n\nexport {\n  Table,\n  TableBody,\n  TableCaption,\n  TableCell,\n  TableContainer,\n  TableFooter,\n  TableHead,\n  TableHeader,\n  TableRow,\n  tableVariants\n}\n"],"mappings":"oKAUA,MAAMA,EAAgBC,EAAI,gCAAiC,CACzD,SAAU,CACR,QAAS,CACP,KAAM,GACN,QAASC,EACP,qDACA,wBACA,2CACF,CACF,CACF,EACA,gBAAiB,CACf,QAAS,MACX,CACF,CAAC,EAsBD,SAAS,eAAe,CAAE,YAAW,WAAU,QAAO,GAAGC,GAA8B,CACrF,MACE,kBAAC,MAAD,CACE,YAAU,kBACV,UAAWD,EACT,kCACA,0FACA,wFACAE,CACF,EACA,MAAOC,IAAa,IAAA,GAAqCC,EAAzB,CAAE,WAAU,GAAGA,CAAM,EACrD,GAAIH,CACL,CAAA,CAEL,CAEA,SAAS,MAAM,CAAE,YAAW,UAAU,OAAQ,UAAU,GAAM,eAAe,GAAO,GAAGA,GAAqB,CAC1G,MACE,kBAAC,QAAD,CACE,YAAU,QACV,eAAcI,EACd,eAAcC,EAAU,OAAS,QACjC,qBAAoBC,EAAe,OAAS,QAC5C,UAAWP,EACTF,EAAc,CAAE,SAAQ,CAAC,EACzB,sGACA,kLACAI,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAEA,SAAS,YAAY,CAAE,YAAW,GAAGA,GAA2B,CAC9D,MAAO,kBAAC,QAAD,CAAO,YAAU,eAAe,UAAWD,EAAG,kBAAmBE,CAAS,EAAG,GAAID,CAAQ,CAAA,CAClG,CAEA,SAAS,UAAU,CAAE,YAAW,GAAGA,GAAyB,CAC1D,MAAO,kBAAC,QAAD,CAAO,YAAU,aAAa,UAAWD,EAAG,6BAA8BE,CAAS,EAAG,GAAID,CAAQ,CAAA,CAC3G,CAEA,SAAS,YAAY,CAAE,YAAW,GAAGA,GAA2B,CAC9D,MACE,kBAAC,QAAD,CACE,YAAU,eACV,UAAWD,EAAG,0DAA2DE,CAAS,EAClF,GAAID,CACL,CAAA,CAEL,CAEA,SAAS,SAAS,CAAE,YAAW,GAAGA,GAAwB,CACxD,MACE,kBAAC,KAAD,CACE,YAAU,YACV,UAAWD,EAAG,8EAA+EE,CAAS,EACtG,GAAID,CACL,CAAA,CAEL,CAEA,SAAS,UAAU,CAAE,YAAW,GAAGA,GAAyB,CAC1D,MACE,kBAAC,KAAD,CACE,YAAU,aACV,UAAWD,EACT,4GACAE,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAEA,SAAS,UAAU,CAAE,YAAW,GAAGA,GAAyB,CAC1D,MACE,kBAAC,KAAD,CACE,YAAU,aACV,UAAWD,EAAG,gEAAiEE,CAAS,EACxF,GAAID,CACL,CAAA,CAEL,CAEA,SAAS,aAAa,CAAE,YAAW,GAAGA,GAA4B,CAChE,MACE,kBAAC,UAAD,CAAS,YAAU,gBAAgB,UAAWD,EAAG,qCAAsCE,CAAS,EAAG,GAAID,CAAQ,CAAA,CAEnH"}
+{"version":3,"file":"table.js","names":["tableVariants","cva","cn","props","className","minWidth","style","variant","striped","stickyHeader"],"sources":["../../src/components/table.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nexport type TableContainerProps = React.ComponentProps<'div'> & {\n  /** Minimum table width (px number or CSS length); the container scrolls horizontally below it. */\n  minWidth?: number | string\n}\n\nconst tableVariants = cva('w-full caption-bottom text-sm', {\n  variants: {\n    variant: {\n      line: '',\n      outline: cn(\n        'rounded-lg border border-separate border-spacing-0',\n        '[&_thead_th]:border-b',\n        '[&_tbody_tr:not(:last-child)>td]:border-b'\n      )\n    }\n  },\n  defaultVariants: {\n    variant: 'line'\n  }\n})\n\nexport type TableProps = React.ComponentProps<'table'> &\n  VariantProps<typeof tableVariants> & {\n    /**\n     * Alternates the row background.\n     * @default true\n     */\n    striped?: boolean\n    /**\n     * Keeps the header at the top while the body scrolls inside a `TableContainer`.\n     * @default false\n     */\n    stickyHeader?: boolean\n  }\n\nexport type TableHeaderProps = React.ComponentProps<'thead'>\n\nexport type TableBodyProps = React.ComponentProps<'tbody'>\n\nexport type TableFooterProps = React.ComponentProps<'tfoot'>\n\nexport type TableRowProps = React.ComponentProps<'tr'>\n\nexport type TableHeadProps = React.ComponentProps<'th'>\n\nexport type TableCellProps = React.ComponentProps<'td'>\n\nexport type TableCaptionProps = React.ComponentProps<'caption'>\n\nfunction TableContainer({ className, minWidth, style, ...props }: TableContainerProps) {\n  return (\n    <div\n      data-slot=\"table-container\"\n      className={cn(\n        'relative w-full overflow-x-auto',\n        'has-[>table[data-variant=outline]]:rounded-lg has-[>table[data-variant=outline]]:border',\n        '[&>table[data-variant=outline]]:rounded-none [&>table[data-variant=outline]]:border-0',\n        '[&>table]:min-w-(--table-min-width)',\n        className\n      )}\n      style={\n        minWidth !== undefined\n          ? ({\n              '--table-min-width': typeof minWidth === 'number' ? `${minWidth}px` : minWidth,\n              ...style\n            } as React.CSSProperties)\n          : style\n      }\n      {...props}\n    />\n  )\n}\n\nfunction Table({ className, variant = 'line', striped = true, stickyHeader = false, ...props }: TableProps) {\n  return (\n    <table\n      data-slot=\"table\"\n      data-variant={variant}\n      data-striped={striped ? 'true' : 'false'}\n      data-sticky-header={stickyHeader ? 'true' : 'false'}\n      className={cn(\n        tableVariants({ variant }),\n        'data-[striped=true]:[&_tbody_tr:nth-child(even):not([data-state=selected]):not(:hover)]:bg-muted/50',\n        'data-[sticky-header=true]:[&_thead]:sticky data-[sticky-header=true]:[&_thead]:top-0 data-[sticky-header=true]:[&_thead]:z-10 data-[sticky-header=true]:[&_thead]:bg-background',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TableHeader({ className, ...props }: TableHeaderProps) {\n  return <thead data-slot=\"table-header\" className={cn('[&_tr]:border-b', className)} {...props} />\n}\n\nfunction TableBody({ className, ...props }: TableBodyProps) {\n  return <tbody data-slot=\"table-body\" className={cn('[&_tr:last-child]:border-0', className)} {...props} />\n}\n\nfunction TableFooter({ className, ...props }: TableFooterProps) {\n  return (\n    <tfoot\n      data-slot=\"table-footer\"\n      className={cn('border-t bg-muted/50 font-medium [&>tr]:last:border-b-0', className)}\n      {...props}\n    />\n  )\n}\n\nfunction TableRow({ className, ...props }: TableRowProps) {\n  return (\n    <tr\n      data-slot=\"table-row\"\n      className={cn('border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted', className)}\n      {...props}\n    />\n  )\n}\n\nfunction TableHead({ className, ...props }: TableHeadProps) {\n  return (\n    <th\n      data-slot=\"table-head\"\n      className={cn(\n        'h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground has-[[role=checkbox]]:pr-0',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TableCell({ className, ...props }: TableCellProps) {\n  return (\n    <td\n      data-slot=\"table-cell\"\n      className={cn('p-2 align-middle whitespace-nowrap has-[[role=checkbox]]:pr-0', className)}\n      {...props}\n    />\n  )\n}\n\nfunction TableCaption({ className, ...props }: TableCaptionProps) {\n  return (\n    <caption data-slot=\"table-caption\" className={cn('mt-4 text-sm text-muted-foreground', className)} {...props} />\n  )\n}\n\nexport {\n  Table,\n  TableBody,\n  TableCaption,\n  TableCell,\n  TableContainer,\n  TableFooter,\n  TableHead,\n  TableHeader,\n  TableRow,\n  tableVariants\n}\n"],"mappings":"oKAWA,MAAMA,EAAgBC,EAAI,gCAAiC,CACzD,SAAU,CACR,QAAS,CACP,KAAM,GACN,QAASC,EACP,qDACA,wBACA,2CACF,CACF,CACF,EACA,gBAAiB,CACf,QAAS,MACX,CACF,CAAC,EA8BD,SAAS,eAAe,CAAE,YAAW,WAAU,QAAO,GAAGC,GAA8B,CACrF,MACE,kBAAC,MAAD,CACE,YAAU,kBACV,UAAWD,EACT,kCACA,0FACA,wFACA,sCACAE,CACF,EACA,MACEC,IAAa,IAAA,GAKTC,EAJC,CACC,oBAAqB,OAAOD,GAAa,SAAW,GAAGA,EAAS,IAAMA,EACtE,GAAGC,CACL,EAGN,GAAIH,CACL,CAAA,CAEL,CAEA,SAAS,MAAM,CAAE,YAAW,UAAU,OAAQ,UAAU,GAAM,eAAe,GAAO,GAAGA,GAAqB,CAC1G,MACE,kBAAC,QAAD,CACE,YAAU,QACV,eAAcI,EACd,eAAcC,EAAU,OAAS,QACjC,qBAAoBC,EAAe,OAAS,QAC5C,UAAWP,EACTF,EAAc,CAAE,SAAQ,CAAC,EACzB,sGACA,kLACAI,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAEA,SAAS,YAAY,CAAE,YAAW,GAAGA,GAA2B,CAC9D,MAAO,kBAAC,QAAD,CAAO,YAAU,eAAe,UAAWD,EAAG,kBAAmBE,CAAS,EAAG,GAAID,CAAQ,CAAA,CAClG,CAEA,SAAS,UAAU,CAAE,YAAW,GAAGA,GAAyB,CAC1D,MAAO,kBAAC,QAAD,CAAO,YAAU,aAAa,UAAWD,EAAG,6BAA8BE,CAAS,EAAG,GAAID,CAAQ,CAAA,CAC3G,CAEA,SAAS,YAAY,CAAE,YAAW,GAAGA,GAA2B,CAC9D,MACE,kBAAC,QAAD,CACE,YAAU,eACV,UAAWD,EAAG,0DAA2DE,CAAS,EAClF,GAAID,CACL,CAAA,CAEL,CAEA,SAAS,SAAS,CAAE,YAAW,GAAGA,GAAwB,CACxD,MACE,kBAAC,KAAD,CACE,YAAU,YACV,UAAWD,EAAG,8EAA+EE,CAAS,EACtG,GAAID,CACL,CAAA,CAEL,CAEA,SAAS,UAAU,CAAE,YAAW,GAAGA,GAAyB,CAC1D,MACE,kBAAC,KAAD,CACE,YAAU,aACV,UAAWD,EACT,4GACAE,CACF,EACA,GAAID,CACL,CAAA,CAEL,CAEA,SAAS,UAAU,CAAE,YAAW,GAAGA,GAAyB,CAC1D,MACE,kBAAC,KAAD,CACE,YAAU,aACV,UAAWD,EAAG,gEAAiEE,CAAS,EACxF,GAAID,CACL,CAAA,CAEL,CAEA,SAAS,aAAa,CAAE,YAAW,GAAGA,GAA4B,CAChE,MACE,kBAAC,UAAD,CAAS,YAAU,gBAAgB,UAAWD,EAAG,qCAAsCE,CAAS,EAAG,GAAID,CAAQ,CAAA,CAEnH"}

package/dist/components/tabs.d.ts

@@ -1,21 +1,25 @@
 import { t as __name } from "../rolldown-runtime-BhWHdk3m.js";
-import { Tabs as Tabs$1 } from "radix-ui";
+import { t as AsChildPrimitiveProps } from "../as-child-Dxg3Xo1G.js";
 import { VariantProps } from "class-variance-authority";
-import * as React from "react";
+import { Tabs as Tabs$1 } from "@base-ui/react/tabs";
 //#region src/components/tabs.d.ts
-export type TabsProps = React.ComponentProps<typeof Tabs$1.Root>;
-declare function Tabs({ className, orientation, ...props }: TabsProps): React.JSX.Element;
+export type TabsProps = AsChildPrimitiveProps<typeof Tabs$1.Root>;
+declare function Tabs({ className, orientation, asChild, children, ...props }: TabsProps): import("react").JSX.Element;
 declare const tabsListVariants: (props?: ({
   variant?: "enclosed" | "line" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-export type TabsListProps = React.ComponentProps<typeof Tabs$1.List> & VariantProps<typeof tabsListVariants> & {
+export type TabsListProps = AsChildPrimitiveProps<typeof Tabs$1.List> & VariantProps<typeof tabsListVariants> & {
+  /**
+   * Makes horizontal tabs share the available width equally.
+   * @default false
+   */
   grow?: boolean;
 };
-export type TabsTriggerProps = React.ComponentProps<typeof Tabs$1.Trigger>;
-export type TabsContentProps = React.ComponentProps<typeof Tabs$1.Content>;
-declare function TabsList({ className, variant, grow, ...props }: TabsListProps): React.JSX.Element;
-declare function TabsTrigger({ className, ...props }: TabsTriggerProps): React.JSX.Element;
-declare function TabsContent({ className, ...props }: TabsContentProps): React.JSX.Element;
+export type TabsTriggerProps = AsChildPrimitiveProps<typeof Tabs$1.Tab>;
+export type TabsContentProps = AsChildPrimitiveProps<typeof Tabs$1.Panel>;
+declare function TabsList({ className, variant, grow, asChild, children, ...props }: TabsListProps): import("react").JSX.Element;
+declare function TabsTrigger({ className, asChild, children, ...props }: TabsTriggerProps): import("react").JSX.Element;
+declare function TabsContent({ className, asChild, children, ...props }: TabsContentProps): import("react").JSX.Element;
 //#endregion
 export { Tabs, TabsContent, TabsList, TabsTrigger, tabsListVariants };
 //# sourceMappingURL=tabs.d.ts.map

package/dist/components/tabs.js

@@ -1,2 +1,2 @@
-import"../rolldown-runtime-BhWHdk3m.js";import{cn as e}from"../lib/utils.js";import{Tabs as t}from"radix-ui";import{jsx as n}from"react/jsx-runtime";import{cva as r}from"class-variance-authority";function Tabs({className:r,orientation:i=`horizontal`,...a}){return/* @__PURE__ */ n(t.Root,{"data-slot":`tabs`,"data-orientation":i,className:e(`group/tabs flex gap-2 data-horizontal:flex-col`,r),...a})}const i=r(`group/tabs-list inline-flex items-center justify-start rounded-lg h-fit group-data-horizontal/tabs:flex-wrap group-data-horizontal/tabs:w-full group-data-vertical/tabs:w-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none`,{variants:{variant:{enclosed:`bg-muted p-0.75`,line:`gap-1 bg-transparent group-data-horizontal/tabs:border-b group-data-horizontal/tabs:border-b-border group-data-vertical/tabs:border-r group-data-vertical/tabs:border-r-border`}},defaultVariants:{variant:`line`}});function TabsList({className:r,variant:a=`line`,grow:o=!1,...s}){return/* @__PURE__ */ n(t.List,{"data-slot":`tabs-list`,"data-variant":a,"data-grow":o,className:e(i({variant:a}),r),...s})}function TabsTrigger({className:r,...i}){return/* @__PURE__ */ n(t.Trigger,{"data-slot":`tabs-trigger`,className:e(`relative inline-flex items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-normal whitespace-nowrap text-foreground transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:bg-muted focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 group-data-[variant=enclosed]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,`group-data-horizontal/tabs:group-data-[grow=true]/tabs-list:flex-1`,`group-data-[variant=line]/tabs-list:bg-transparent group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:rounded-t-[8px] group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:rounded-b-none group-data-vertical/tabs:group-data-[variant=line]/tabs-list:rounded-l-[8px] group-data-vertical/tabs:group-data-[variant=line]/tabs-list:rounded-r-none`,`group-data-[variant=line]/tabs-list:h-8 group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:data-active:border-b-primary-500 group-data-vertical/tabs:group-data-[variant=line]/tabs-list:data-active:border-r-primary-500`,`group-data-[variant=enclosed]/tabs-list:h-[calc(100%-1px)] group-data-[variant=enclosed]/tabs-list:data-active:bg-background group-data-[variant=enclosed]/tabs-list:data-active:hover:bg-muted dark:group-data-[variant=enclosed]/tabs-list:data-active:border-input dark:group-data-[variant=enclosed]/tabs-list:data-active:bg-input/30`,r),...i})}function TabsContent({className:r,...i}){return/* @__PURE__ */ n(t.Content,{"data-slot":`tabs-content`,className:e(`flex-1 text-sm outline-none`,r),...i})}export{Tabs,TabsContent,TabsList,TabsTrigger,i as tabsListVariants};
+import"../rolldown-runtime-BhWHdk3m.js";import{toAsChildRenderProps as e}from"../lib/as-child.js";import{cn as t}from"../lib/utils.js";import{t as n}from"../resolve-class-name-BurP8ngI.js";import{jsx as r}from"react/jsx-runtime";import{cva as i}from"class-variance-authority";import{Tabs as a}from"@base-ui/react/tabs";function Tabs({className:i,orientation:o=`horizontal`,asChild:s,children:c,...l}){return/* @__PURE__ */ r(a.Root,{"data-slot":`tabs`,orientation:o,className:e=>t(`group/tabs flex gap-2 data-horizontal:flex-col`,n(i,e)),...l,...e(s,c)})}const o=i(`group/tabs-list inline-flex items-center justify-start rounded-lg h-fit group-data-horizontal/tabs:flex-wrap group-data-horizontal/tabs:w-full group-data-vertical/tabs:w-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none`,{variants:{variant:{enclosed:`bg-muted p-0.75`,line:`gap-1 bg-transparent group-data-horizontal/tabs:border-b group-data-horizontal/tabs:border-b-border group-data-vertical/tabs:border-r group-data-vertical/tabs:border-r-border`}},defaultVariants:{variant:`line`}});function TabsList({className:i,variant:s=`line`,grow:c=!1,asChild:l,children:u,...d}){return/* @__PURE__ */ r(a.List,{"data-slot":`tabs-list`,"data-variant":s,"data-grow":c,className:e=>t(o({variant:s}),n(i,e)),...d,...e(l,u)})}function TabsTrigger({className:i,asChild:o,children:s,...c}){return/* @__PURE__ */ r(a.Tab,{"data-slot":`tabs-trigger`,className:e=>t(`relative inline-flex items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-normal whitespace-nowrap text-foreground transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:bg-muted focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 group-data-[variant=enclosed]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,`group-data-horizontal/tabs:group-data-[grow=true]/tabs-list:flex-1`,`group-data-[variant=line]/tabs-list:bg-transparent group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:rounded-t-[8px] group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:rounded-b-none group-data-vertical/tabs:group-data-[variant=line]/tabs-list:rounded-l-[8px] group-data-vertical/tabs:group-data-[variant=line]/tabs-list:rounded-r-none`,`group-data-[variant=line]/tabs-list:h-8 group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:data-active:border-b-primary-500 group-data-vertical/tabs:group-data-[variant=line]/tabs-list:data-active:border-r-primary-500`,`group-data-[variant=enclosed]/tabs-list:h-[calc(100%-1px)] group-data-[variant=enclosed]/tabs-list:data-active:bg-background group-data-[variant=enclosed]/tabs-list:data-active:hover:bg-muted dark:group-data-[variant=enclosed]/tabs-list:data-active:border-input dark:group-data-[variant=enclosed]/tabs-list:data-active:bg-input/30`,n(i,e)),...c,...e(o,s)})}function TabsContent({className:i,asChild:o,children:s,...c}){return/* @__PURE__ */ r(a.Panel,{"data-slot":`tabs-content`,className:e=>t(`flex-1 text-sm outline-none`,n(i,e)),...c,...e(o,s)})}export{Tabs,TabsContent,TabsList,TabsTrigger,o as tabsListVariants};
 //# sourceMappingURL=tabs.js.map

package/dist/components/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","names":["TabsPrimitive","Tabs$1","props","orientation","cn","className","tabsListVariants","cva","variant","grow"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { Tabs as TabsPrimitive } from 'radix-ui'\n\nimport { cn } from '../lib/utils'\n\nexport type TabsProps = React.ComponentProps<typeof TabsPrimitive.Root>\n\nfunction Tabs({ className, orientation = 'horizontal', ...props }: TabsProps) {\n  return (\n    <TabsPrimitive.Root\n      data-slot=\"tabs\"\n      data-orientation={orientation}\n      className={cn('group/tabs flex gap-2 data-horizontal:flex-col', className)}\n      {...props}\n    />\n  )\n}\n\nconst tabsListVariants = cva(\n  'group/tabs-list inline-flex items-center justify-start rounded-lg h-fit group-data-horizontal/tabs:flex-wrap group-data-horizontal/tabs:w-full group-data-vertical/tabs:w-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none',\n  {\n    variants: {\n      variant: {\n        enclosed: 'bg-muted p-0.75',\n        line: 'gap-1 bg-transparent group-data-horizontal/tabs:border-b group-data-horizontal/tabs:border-b-border group-data-vertical/tabs:border-r group-data-vertical/tabs:border-r-border'\n      }\n    },\n    defaultVariants: {\n      variant: 'line'\n    }\n  }\n)\n\nexport type TabsListProps = React.ComponentProps<typeof TabsPrimitive.List> &\n  VariantProps<typeof tabsListVariants> & {\n    grow?: boolean\n  }\n\nexport type TabsTriggerProps = React.ComponentProps<typeof TabsPrimitive.Trigger>\n\nexport type TabsContentProps = React.ComponentProps<typeof TabsPrimitive.Content>\n\nfunction TabsList({ className, variant = 'line', grow = false, ...props }: TabsListProps) {\n  return (\n    <TabsPrimitive.List\n      data-slot=\"tabs-list\"\n      data-variant={variant}\n      data-grow={grow}\n      className={cn(tabsListVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction TabsTrigger({ className, ...props }: TabsTriggerProps) {\n  return (\n    <TabsPrimitive.Trigger\n      data-slot=\"tabs-trigger\"\n      className={cn(\n        \"relative inline-flex items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-normal whitespace-nowrap text-foreground transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:bg-muted focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 group-data-[variant=enclosed]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n        'group-data-horizontal/tabs:group-data-[grow=true]/tabs-list:flex-1',\n        'group-data-[variant=line]/tabs-list:bg-transparent group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:rounded-t-[8px] group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:rounded-b-none group-data-vertical/tabs:group-data-[variant=line]/tabs-list:rounded-l-[8px] group-data-vertical/tabs:group-data-[variant=line]/tabs-list:rounded-r-none',\n        'group-data-[variant=line]/tabs-list:h-8 group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:data-active:border-b-primary-500 group-data-vertical/tabs:group-data-[variant=line]/tabs-list:data-active:border-r-primary-500',\n        'group-data-[variant=enclosed]/tabs-list:h-[calc(100%-1px)] group-data-[variant=enclosed]/tabs-list:data-active:bg-background group-data-[variant=enclosed]/tabs-list:data-active:hover:bg-muted dark:group-data-[variant=enclosed]/tabs-list:data-active:border-input dark:group-data-[variant=enclosed]/tabs-list:data-active:bg-input/30',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TabsContent({ className, ...props }: TabsContentProps) {\n  return (\n    <TabsPrimitive.Content\n      data-slot=\"tabs-content\"\n      className={cn('flex-1 text-sm outline-none', className)}\n      {...props}\n    />\n  )\n}\n\nexport { Tabs, TabsContent, TabsList, TabsTrigger, tabsListVariants }\n"],"mappings":"oMASA,SAAS,KAAK,CAAE,YAAW,cAAc,aAAc,GAAGE,GAAoB,CAC5E,MACE,kBAACF,EAAc,KAAf,CACE,YAAU,OACV,mBAAkBG,EAClB,UAAWC,EAAG,iDAAkDC,CAAS,EACzE,GAAIH,CACL,CAAA,CAEL,CAEA,MAAMI,EAAmBC,EACvB,mPACA,CACE,SAAU,CACR,QAAS,CACP,SAAU,kBACV,KAAM,gLACR,CACF,EACA,gBAAiB,CACf,QAAS,MACX,CACF,CACF,EAWA,SAAS,SAAS,CAAE,YAAW,UAAU,OAAQ,OAAO,GAAO,GAAGL,GAAwB,CACxF,MACE,kBAACF,EAAc,KAAf,CACE,YAAU,YACV,eAAcQ,EACd,YAAWC,EACX,UAAWL,EAAGE,EAAiB,CAAE,SAAQ,CAAC,EAAGD,CAAS,EACtD,GAAIH,CACL,CAAA,CAEL,CAEA,SAAS,YAAY,CAAE,YAAW,GAAGA,GAA2B,CAC9D,MACE,kBAACF,EAAc,QAAf,CACE,YAAU,eACV,UAAWI,EACT,uoBACA,qEACA,2WACA,wOACA,6UACAC,CACF,EACA,GAAIH,CACL,CAAA,CAEL,CAEA,SAAS,YAAY,CAAE,YAAW,GAAGA,GAA2B,CAC9D,MACE,kBAACF,EAAc,QAAf,CACE,YAAU,eACV,UAAWI,EAAG,8BAA+BC,CAAS,EACtD,GAAIH,CACL,CAAA,CAEL"}
+{"version":3,"file":"tabs.js","names":["TabsPrimitive","resolveClassName","Tabs$1","props","cn","className","state","toAsChildRenderProps","asChild","children","tabsListVariants","cva","variant","grow"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["import { Tabs as TabsPrimitive } from '@base-ui/react/tabs'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { type AsChildPrimitiveProps, toAsChildRenderProps } from '../lib/as-child'\nimport { cn } from '../lib/utils'\nimport { resolveClassName } from '../utils/resolve-class-name'\n\nexport type TabsProps = AsChildPrimitiveProps<typeof TabsPrimitive.Root>\n\nfunction Tabs({ className, orientation = 'horizontal', asChild, children, ...props }: TabsProps) {\n  return (\n    <TabsPrimitive.Root\n      data-slot=\"tabs\"\n      orientation={orientation}\n      className={(state) => cn('group/tabs flex gap-2 data-horizontal:flex-col', resolveClassName(className, state))}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nconst tabsListVariants = cva(\n  'group/tabs-list inline-flex items-center justify-start rounded-lg h-fit group-data-horizontal/tabs:flex-wrap group-data-horizontal/tabs:w-full group-data-vertical/tabs:w-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none',\n  {\n    variants: {\n      variant: {\n        enclosed: 'bg-muted p-0.75',\n        line: 'gap-1 bg-transparent group-data-horizontal/tabs:border-b group-data-horizontal/tabs:border-b-border group-data-vertical/tabs:border-r group-data-vertical/tabs:border-r-border'\n      }\n    },\n    defaultVariants: {\n      variant: 'line'\n    }\n  }\n)\n\nexport type TabsListProps = AsChildPrimitiveProps<typeof TabsPrimitive.List> &\n  VariantProps<typeof tabsListVariants> & {\n    /**\n     * Makes horizontal tabs share the available width equally.\n     * @default false\n     */\n    grow?: boolean\n  }\n\nexport type TabsTriggerProps = AsChildPrimitiveProps<typeof TabsPrimitive.Tab>\n\nexport type TabsContentProps = AsChildPrimitiveProps<typeof TabsPrimitive.Panel>\n\nfunction TabsList({ className, variant = 'line', grow = false, asChild, children, ...props }: TabsListProps) {\n  return (\n    <TabsPrimitive.List\n      data-slot=\"tabs-list\"\n      data-variant={variant}\n      data-grow={grow}\n      className={(state) => cn(tabsListVariants({ variant }), resolveClassName(className, state))}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction TabsTrigger({ className, asChild, children, ...props }: TabsTriggerProps) {\n  return (\n    <TabsPrimitive.Tab\n      data-slot=\"tabs-trigger\"\n      className={(state) =>\n        cn(\n          \"relative inline-flex items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-normal whitespace-nowrap text-foreground transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:bg-muted focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 group-data-[variant=enclosed]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n          'group-data-horizontal/tabs:group-data-[grow=true]/tabs-list:flex-1',\n          'group-data-[variant=line]/tabs-list:bg-transparent group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:rounded-t-[8px] group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:rounded-b-none group-data-vertical/tabs:group-data-[variant=line]/tabs-list:rounded-l-[8px] group-data-vertical/tabs:group-data-[variant=line]/tabs-list:rounded-r-none',\n          'group-data-[variant=line]/tabs-list:h-8 group-data-horizontal/tabs:group-data-[variant=line]/tabs-list:data-active:border-b-primary-500 group-data-vertical/tabs:group-data-[variant=line]/tabs-list:data-active:border-r-primary-500',\n          'group-data-[variant=enclosed]/tabs-list:h-[calc(100%-1px)] group-data-[variant=enclosed]/tabs-list:data-active:bg-background group-data-[variant=enclosed]/tabs-list:data-active:hover:bg-muted dark:group-data-[variant=enclosed]/tabs-list:data-active:border-input dark:group-data-[variant=enclosed]/tabs-list:data-active:bg-input/30',\n          resolveClassName(className, state)\n        )\n      }\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nfunction TabsContent({ className, asChild, children, ...props }: TabsContentProps) {\n  return (\n    <TabsPrimitive.Panel\n      data-slot=\"tabs-content\"\n      className={(state) => cn('flex-1 text-sm outline-none', resolveClassName(className, state))}\n      {...props}\n      {...toAsChildRenderProps(asChild, children)}\n    />\n  )\n}\n\nexport { Tabs, TabsContent, TabsList, TabsTrigger, tabsListVariants }\n"],"mappings":"+TASA,SAAS,KAAK,CAAE,YAAW,cAAc,aAAc,UAAS,WAAU,GAAGG,GAAoB,CAC/F,MACE,kBAACH,EAAc,KAAf,CACE,YAAU,OACG,cACb,UAAY,GAAUI,EAAG,iDAAkDH,EAAiBI,EAAWC,CAAK,CAAC,EAC7G,GAAIH,EACJ,GAAII,EAAqBC,EAASC,CAAQ,CAC3C,CAAA,CAEL,CAEA,MAAMC,EAAmBC,EACvB,mPACA,CACE,SAAU,CACR,QAAS,CACP,SAAU,kBACV,KAAM,gLACR,CACF,EACA,gBAAiB,CACf,QAAS,MACX,CACF,CACF,EAeA,SAAS,SAAS,CAAE,YAAW,UAAU,OAAQ,OAAO,GAAO,UAAS,WAAU,GAAGR,GAAwB,CAC3G,MACE,kBAACH,EAAc,KAAf,CACE,YAAU,YACV,eAAcY,EACd,YAAWC,EACX,UAAY,GAAUT,EAAGM,EAAiB,CAAE,SAAQ,CAAC,EAAGT,EAAiBI,EAAWC,CAAK,CAAC,EAC1F,GAAIH,EACJ,GAAII,EAAqBC,EAASC,CAAQ,CAC3C,CAAA,CAEL,CAEA,SAAS,YAAY,CAAE,YAAW,UAAS,WAAU,GAAGN,GAA2B,CACjF,MACE,kBAACH,EAAc,IAAf,CACE,YAAU,eACV,UAAY,GACVI,EACE,ksBACA,qEACA,2WACA,wOACA,6UACAH,EAAiBI,EAAWC,CAAK,CACnC,EAEF,GAAIH,EACJ,GAAII,EAAqBC,EAASC,CAAQ,CAC3C,CAAA,CAEL,CAEA,SAAS,YAAY,CAAE,YAAW,UAAS,WAAU,GAAGN,GAA2B,CACjF,MACE,kBAACH,EAAc,MAAf,CACE,YAAU,eACV,UAAY,GAAUI,EAAG,8BAA+BH,EAAiBI,EAAWC,CAAK,CAAC,EAC1F,GAAIH,EACJ,GAAII,EAAqBC,EAASC,CAAQ,CAC3C,CAAA,CAEL"}