@devalok/shilp-sutra 0.36.0 → 0.37.0-next.0

package/dist/ui/number-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"number-input.js","names":[],"sources":["../../src/ui/number-input.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { IconMinus, IconPlus } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from './lib/utils'\nimport { useFormField } from './form'\nimport { Icon } from './icon'\nimport type { IconSize } from './icon-context'\n\nexport type NumberInputState = 'default' | 'error' | 'warning' | 'success'\n\nconst numberInputWrapperVariants = cva(\n  'flex items-center justify-between rounded-ds-md border border-surface-border-strong',\n  {\n    variants: {\n      size: {\n        xs: 'h-ds-xs-plus',\n        sm: 'h-ds-sm',\n        md: 'h-ds-md',\n        lg: 'h-ds-lg',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n)\n\nexport type NumberInputSize = NonNullable<VariantProps<typeof numberInputWrapperVariants>['size']>\n\n/** Maps size to stepper button dimensions */\nconst buttonSizeMap: Record<NonNullable<NumberInputSize>, string> = {\n  xs: 'h-[22px] w-[22px]',\n  sm: 'h-ds-sm w-ds-sm',\n  md: 'h-ds-sm w-ds-sm',\n  lg: 'h-ds-md w-ds-md',\n}\n\n/** Maps size to Icon component size */\nconst iconSizeMap: Record<NonNullable<NumberInputSize>, IconSize> = {\n  xs: 'xs',\n  sm: 'sm',\n  md: 'sm',\n  lg: 'md',\n}\n\n/** Maps size to input text and width classes */\nconst inputSizeMap: Record<NonNullable<NumberInputSize>, string> = {\n  xs: 'text-ds-sm w-[28px]',\n  sm: 'text-ds-sm w-ds-sm-plus',\n  md: 'text-ds-md w-ds-sm-plus',\n  lg: 'text-ds-md w-ds-md',\n}\n\n/** Maps state to border color classes */\nconst stateColorMap: Record<NonNullable<NumberInputState>, string> = {\n  default: '',\n  error: 'border-error-7',\n  warning: 'border-warning-7',\n  success: 'border-success-7',\n}\n\n/**\n * Props for NumberInput — a stepper control with \"−\" and \"+\" buttons flanking a numeric input,\n * clamped between `min` and `max`. The decrement/increment buttons are disabled when bounds are reached.\n *\n * **Controlled only:** Pass `value` + `onValueChange` for controlled usage. Uncontrolled usage is\n * possible but the buttons won't update the displayed value without `onValueChange`.\n *\n * **Step:** The `step` prop controls how much each button press increments/decrements (default 1).\n * Direct text input is also clamped to `[min, max]` on change.\n *\n * **Sizes:** `xs` (28px) | `sm` (32px) | `md` (40px, default) | `lg` (48px)\n *\n * **Validation states:** `state=\"error\"` colors the border red.\n * Use with `<FormField>` to show helper text below the input.\n *\n * @example\n * // Quantity selector with 1–99 range:\n * <NumberInput value={qty} onValueChange={setQty} min={1} max={99} />\n *\n * @example\n * // Rating input (1–10, step 1):\n * <NumberInput value={rating} onValueChange={setRating} min={1} max={10} />\n *\n * @example\n * // Fine-grained opacity control (0–100, step 5):\n * <NumberInput value={opacity} onValueChange={setOpacity} min={0} max={100} step={5} />\n *\n * @example\n * // Disabled number display (read-only-like):\n * <NumberInput value={autoCalcValue} onValueChange={() => {}} disabled />\n * // These are just a few ways — feel free to combine props creatively!\n */\nexport interface NumberInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'type' | 'size'> {\n  value?: number\n  onValueChange?: (value: number) => void\n  min?: number\n  max?: number\n  step?: number\n  /** Size of the number input. Controls height, button sizes, text size. */\n  size?: NumberInputSize\n  /** Validation state controlling border color. */\n  state?: NumberInputState\n}\n\nconst NumberInput = React.forwardRef<HTMLInputElement, NumberInputProps>(\n  (\n    {\n      value = 0,\n      onValueChange,\n      min = Number.MIN_SAFE_INTEGER,\n      max = Number.MAX_SAFE_INTEGER,\n      step = 1,\n      disabled = false,\n      className,\n      size: sizeProp = 'md',\n      state: stateProp,\n      'aria-label': ariaLabelProp,\n      ...rest\n    },\n    ref,\n  ) => {\n    const size = sizeProp ?? 'md'\n    const fieldCtx = useFormField()\n    // If no explicit aria-label and not inside a FormField (no id to associate with Label),\n    // provide a sensible default\n    const ariaLabel = ariaLabelProp ?? (rest.id || fieldCtx.helperTextId ? undefined : 'Numeric value')\n\n    // Merge FormField context — explicit props always win\n    const state =\n      stateProp ??\n      (fieldCtx.state === 'helper'\n        ? 'default'\n        : (fieldCtx.state as NumberInputState | undefined)) ??\n      'default'\n\n    const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n      const raw = e.target.value.trim()\n      if (raw === '' || raw === '-') {\n        onValueChange?.(min >= 0 ? min : 0)\n        return\n      }\n      const parsed = Number(raw)\n      if (Number.isNaN(parsed)) return\n      const clamped = Math.min(Math.max(parsed, min), max)\n      onValueChange?.(clamped)\n    }\n\n    const handleIncrement = (e: React.MouseEvent<HTMLButtonElement>) => {\n      e.preventDefault() // Prevent form submission\n      const newValue = value + step\n      if (newValue <= max) {\n        onValueChange?.(newValue)\n      }\n    }\n\n    const handleDecrement = (e: React.MouseEvent<HTMLButtonElement>) => {\n      e.preventDefault() // Prevent form submission\n      const newValue = value - step\n      if (newValue >= min) {\n        onValueChange?.(newValue)\n      }\n    }\n\n    const resolvedButtonSize = buttonSizeMap[size]\n    const resolvedIconSize = iconSizeMap[size]\n    const resolvedInputSize = inputSizeMap[size]\n\n    return (\n      <div\n        className={cn(\n          numberInputWrapperVariants({ size }),\n          stateColorMap[state],\n          className,\n        )}\n      >\n        <button\n          type=\"button\"\n          onClick={handleDecrement}\n          disabled={disabled || value <= min}\n          aria-label=\"Decrease value\"\n          title=\"Decrease\"\n          className={cn(\n            'flex items-center justify-center border-0 rounded-ds-sm text-surface-fg-subtle hover:bg-surface-raised-hover hover:text-surface-fg-muted active:scale-90 transition-[color,background-color,transform] duration-fast-01 ease-productive-standard disabled:opacity-action-disabled disabled:pointer-events-none',\n            resolvedButtonSize,\n          )}\n        >\n          <Icon icon={IconMinus} size={resolvedIconSize} />\n        </button>\n\n        <input\n          ref={ref}\n          type=\"number\"\n          value={value}\n          onChange={handleInputChange}\n          min={min}\n          max={max}\n          step={step}\n          disabled={disabled}\n          aria-label={ariaLabel}\n          aria-invalid={state === 'error' || undefined}\n          aria-describedby={rest['aria-describedby'] ?? fieldCtx.helperTextId}\n          className={cn(\n            'bg-transparent font-semibold border-0 text-center text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none',\n            resolvedInputSize,\n          )}\n          {...rest}\n        />\n\n        <button\n          type=\"button\"\n          onClick={handleIncrement}\n          disabled={disabled || value >= max}\n          aria-label=\"Increase value\"\n          title=\"Increase\"\n          className={cn(\n            'flex items-center justify-center border-0 rounded-ds-sm text-surface-fg-subtle hover:bg-surface-raised-hover hover:text-surface-fg-muted active:scale-90 transition-[color,background-color,transform] duration-fast-01 ease-productive-standard disabled:opacity-action-disabled disabled:pointer-events-none',\n            resolvedButtonSize,\n          )}\n        >\n          <Icon icon={IconPlus} size={resolvedIconSize} />\n        </button>\n      </div>\n    )\n  },\n)\nNumberInput.displayName = 'NumberInput'\n\nexport { NumberInput, numberInputWrapperVariants }\n"],"mappings":";;;;;;;;;AAYA,IAAM,IAA6B,EACjC,uFACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,EACF;CACD,iBAAiB,EAAE,MAAM,MAAM;CAChC,CACF,EAKK,IAA8D;CAClE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAGK,IAA8D;CAClE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAGK,IAA6D;CACjE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAGK,IAA+D;CACnE,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACV,EA8CK,IAAc,EAAM,YAEtB,EACE,WAAQ,GACR,kBACA,SAAM,gBACN,sBACA,UAAO,GACP,cAAW,IACX,cACA,MAAM,IAAW,MACjB,OAAO,GACP,cAAc,GACd,GAAG,KAEL,MACG;CACH,IAAM,IAAO,KAAY,MACnB,IAAW,GAAc,EAGzB,IAAY,MAAkB,EAAK,MAAM,EAAS,eAAe,KAAA,IAAY,kBAG7E,IACJ,MACC,EAAS,UAAU,WAChB,YACC,EAAS,UACd,WAEI,KAAqB,MAA2C;EACpE,IAAM,IAAM,EAAE,OAAO,MAAM,MAAM;AACjC,MAAI,MAAQ,MAAM,MAAQ,KAAK;AAC7B,OAAgB,KAAO,IAAI,IAAM,EAAE;AACnC;;EAEF,IAAM,IAAS,OAAO,EAAI;AACtB,SAAO,MAAM,EAAO,IAExB,IADgB,KAAK,IAAI,KAAK,IAAI,GAAQ,EAAI,EAAE,EAAI,CAC5B;IAGpB,KAAmB,MAA2C;AAClE,IAAE,gBAAgB;EAClB,IAAM,IAAW,IAAQ;AACzB,EAAI,KAAY,KACd,IAAgB,EAAS;IAIvB,KAAmB,MAA2C;AAClE,IAAE,gBAAgB;EAClB,IAAM,IAAW,IAAQ;AACzB,EAAI,KAAY,KACd,IAAgB,EAAS;IAIvB,IAAqB,EAAc,IACnC,IAAmB,EAAY,IAC/B,IAAoB,EAAa;AAEvC,QACE,kBAAC,OAAD;EACE,WAAW,EACT,EAA2B,EAAE,SAAM,CAAC,EACpC,EAAc,IACd,EACD;YALH;GAOE,kBAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,UAAU,KAAY,KAAS;IAC/B,cAAW;IACX,OAAM;IACN,WAAW,EACT,kTACA,EACD;cAED,kBAAC,GAAD;KAAM,MAAM;KAAW,MAAM;KAAoB,CAAA;IAC1C,CAAA;GAET,kBAAC,SAAD;IACO;IACL,MAAK;IACE;IACP,UAAU;IACL;IACA;IACC;IACI;IACV,cAAY;IACZ,gBAAc,MAAU,WAAW,KAAA;IACnC,oBAAkB,EAAK,uBAAuB,EAAS;IACvD,WAAW,EACT,8QACA,EACD;IACD,GAAI;IACJ,CAAA;GAEF,kBAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,UAAU,KAAY,KAAS;IAC/B,cAAW;IACX,OAAM;IACN,WAAW,EACT,kTACA,EACD;cAED,kBAAC,GAAD;KAAM,MAAM;KAAU,MAAM;KAAoB,CAAA;IACzC,CAAA;GACL;;EAGX;AACD,EAAY,cAAc"}
+{"version":3,"file":"number-input.js","names":[],"sources":["../../src/ui/number-input.tsx"],"sourcesContent":["'use client'\n\nimport { IconMinus, IconPlus } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { useFormField } from './form'\nimport { Icon } from './icon'\nimport type { IconSize } from './icon-context'\nimport { cn } from './lib/utils'\n\nexport type NumberInputState = 'default' | 'error' | 'warning' | 'success'\n\nconst numberInputWrapperVariants = cva(\n  'flex items-center justify-between rounded-ds-md border border-surface-border-strong',\n  {\n    variants: {\n      size: {\n        xs: 'h-ds-xs-plus',\n        sm: 'h-ds-sm',\n        md: 'h-ds-md',\n        lg: 'h-ds-lg',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n)\n\nexport type NumberInputSize = NonNullable<VariantProps<typeof numberInputWrapperVariants>['size']>\n\n/** Maps size to stepper button dimensions */\nconst buttonSizeMap: Record<NonNullable<NumberInputSize>, string> = {\n  xs: 'h-[22px] w-[22px]',\n  sm: 'h-ds-sm w-ds-sm',\n  md: 'h-ds-sm w-ds-sm',\n  lg: 'h-ds-md w-ds-md',\n}\n\n/** Maps size to Icon component size */\nconst iconSizeMap: Record<NonNullable<NumberInputSize>, IconSize> = {\n  xs: 'xs',\n  sm: 'sm',\n  md: 'sm',\n  lg: 'md',\n}\n\n/** Maps size to input text and width classes */\nconst inputSizeMap: Record<NonNullable<NumberInputSize>, string> = {\n  xs: 'text-ds-sm w-[28px]',\n  sm: 'text-ds-sm w-ds-sm-plus',\n  md: 'text-ds-md w-ds-sm-plus',\n  lg: 'text-ds-md w-ds-md',\n}\n\n/** Maps state to border color classes */\nconst stateColorMap: Record<NonNullable<NumberInputState>, string> = {\n  default: '',\n  error: 'border-error-7',\n  warning: 'border-warning-7',\n  success: 'border-success-7',\n}\n\n/**\n * Props for NumberInput — a stepper control with \"−\" and \"+\" buttons flanking a numeric input,\n * clamped between `min` and `max`. The decrement/increment buttons are disabled when bounds are reached.\n *\n * **Controlled only:** Pass `value` + `onValueChange` for controlled usage. Uncontrolled usage is\n * possible but the buttons won't update the displayed value without `onValueChange`.\n *\n * **Step:** The `step` prop controls how much each button press increments/decrements (default 1).\n * Direct text input is also clamped to `[min, max]` on change.\n *\n * **Sizes:** `xs` (28px) | `sm` (32px) | `md` (40px, default) | `lg` (48px)\n *\n * **Validation states:** `state=\"error\"` colors the border red.\n * Use with `<FormField>` to show helper text below the input.\n *\n * @example\n * // Quantity selector with 1–99 range:\n * <NumberInput value={qty} onValueChange={setQty} min={1} max={99} />\n *\n * @example\n * // Rating input (1–10, step 1):\n * <NumberInput value={rating} onValueChange={setRating} min={1} max={10} />\n *\n * @example\n * // Fine-grained opacity control (0–100, step 5):\n * <NumberInput value={opacity} onValueChange={setOpacity} min={0} max={100} step={5} />\n *\n * @example\n * // Disabled number display (read-only-like):\n * <NumberInput value={autoCalcValue} onValueChange={() => {}} disabled />\n * // These are just a few ways — feel free to combine props creatively!\n */\nexport interface NumberInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'type' | 'size'> {\n  value?: number\n  onValueChange?: (value: number) => void\n  min?: number\n  max?: number\n  step?: number\n  /** Size of the number input. Controls height, button sizes, text size. */\n  size?: NumberInputSize\n  /** Validation state controlling border color. */\n  state?: NumberInputState\n}\n\nconst NumberInput = React.forwardRef<HTMLInputElement, NumberInputProps>(\n  (\n    {\n      value = 0,\n      onValueChange,\n      min = Number.MIN_SAFE_INTEGER,\n      max = Number.MAX_SAFE_INTEGER,\n      step = 1,\n      disabled = false,\n      className,\n      size: sizeProp = 'md',\n      state: stateProp,\n      'aria-label': ariaLabelProp,\n      ...rest\n    },\n    ref,\n  ) => {\n    const size = sizeProp ?? 'md'\n    const fieldCtx = useFormField()\n    // If no explicit aria-label and not inside a FormField (no id to associate with Label),\n    // provide a sensible default\n    const ariaLabel = ariaLabelProp ?? (rest.id || fieldCtx.helperTextId ? undefined : 'Numeric value')\n\n    // Merge FormField context — explicit props always win\n    const state =\n      stateProp ??\n      (fieldCtx.state === 'helper'\n        ? 'default'\n        : (fieldCtx.state as NumberInputState | undefined)) ??\n      'default'\n\n    const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n      const raw = e.target.value.trim()\n      if (raw === '' || raw === '-') {\n        onValueChange?.(min >= 0 ? min : 0)\n        return\n      }\n      const parsed = Number(raw)\n      if (Number.isNaN(parsed)) return\n      const clamped = Math.min(Math.max(parsed, min), max)\n      onValueChange?.(clamped)\n    }\n\n    const handleIncrement = (e: React.MouseEvent<HTMLButtonElement>) => {\n      e.preventDefault() // Prevent form submission\n      const newValue = value + step\n      if (newValue <= max) {\n        onValueChange?.(newValue)\n      }\n    }\n\n    const handleDecrement = (e: React.MouseEvent<HTMLButtonElement>) => {\n      e.preventDefault() // Prevent form submission\n      const newValue = value - step\n      if (newValue >= min) {\n        onValueChange?.(newValue)\n      }\n    }\n\n    const resolvedButtonSize = buttonSizeMap[size]\n    const resolvedIconSize = iconSizeMap[size]\n    const resolvedInputSize = inputSizeMap[size]\n\n    return (\n      <div\n        className={cn(\n          numberInputWrapperVariants({ size }),\n          stateColorMap[state],\n          className,\n        )}\n      >\n        <button\n          type=\"button\"\n          onClick={handleDecrement}\n          disabled={disabled || value <= min}\n          aria-label=\"Decrease value\"\n          title=\"Decrease\"\n          className={cn(\n            'flex items-center justify-center border-0 rounded-ds-sm text-surface-fg-subtle hover:bg-surface-raised-hover hover:text-surface-fg-muted active:scale-90 transition-[color,background-color,transform] duration-fast-01 ease-productive-standard disabled:opacity-action-disabled disabled:pointer-events-none',\n            resolvedButtonSize,\n          )}\n        >\n          <Icon icon={IconMinus} size={resolvedIconSize} />\n        </button>\n\n        <input\n          ref={ref}\n          type=\"number\"\n          value={value}\n          onChange={handleInputChange}\n          min={min}\n          max={max}\n          step={step}\n          disabled={disabled}\n          aria-label={ariaLabel}\n          aria-invalid={state === 'error' || undefined}\n          aria-describedby={rest['aria-describedby'] ?? fieldCtx.helperTextId}\n          className={cn(\n            'bg-transparent font-semibold border-0 text-center text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none',\n            resolvedInputSize,\n          )}\n          {...rest}\n        />\n\n        <button\n          type=\"button\"\n          onClick={handleIncrement}\n          disabled={disabled || value >= max}\n          aria-label=\"Increase value\"\n          title=\"Increase\"\n          className={cn(\n            'flex items-center justify-center border-0 rounded-ds-sm text-surface-fg-subtle hover:bg-surface-raised-hover hover:text-surface-fg-muted active:scale-90 transition-[color,background-color,transform] duration-fast-01 ease-productive-standard disabled:opacity-action-disabled disabled:pointer-events-none',\n            resolvedButtonSize,\n          )}\n        >\n          <Icon icon={IconPlus} size={resolvedIconSize} />\n        </button>\n      </div>\n    )\n  },\n)\nNumberInput.displayName = 'NumberInput'\n\nexport { NumberInput, numberInputWrapperVariants }\n"],"mappings":";;;;;;;;;AAaA,IAAM,IAA6B,EACjC,uFACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,EACF;CACD,iBAAiB,EAAE,MAAM,MAAM;CAChC,CACF,EAKK,IAA8D;CAClE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAGK,IAA8D;CAClE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAGK,IAA6D;CACjE,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAGK,IAA+D;CACnE,SAAS;CACT,OAAO;CACP,SAAS;CACT,SAAS;CACV,EA8CK,IAAc,EAAM,YAEtB,EACE,WAAQ,GACR,kBACA,SAAM,gBACN,sBACA,UAAO,GACP,cAAW,IACX,cACA,MAAM,IAAW,MACjB,OAAO,GACP,cAAc,GACd,GAAG,KAEL,MACG;CACH,IAAM,IAAO,KAAY,MACnB,IAAW,GAAc,EAGzB,IAAY,MAAkB,EAAK,MAAM,EAAS,eAAe,KAAA,IAAY,kBAG7E,IACJ,MACC,EAAS,UAAU,WAChB,YACC,EAAS,UACd,WAEI,KAAqB,MAA2C;EACpE,IAAM,IAAM,EAAE,OAAO,MAAM,MAAM;AACjC,MAAI,MAAQ,MAAM,MAAQ,KAAK;AAC7B,OAAgB,KAAO,IAAI,IAAM,EAAE;AACnC;;EAEF,IAAM,IAAS,OAAO,EAAI;AACtB,SAAO,MAAM,EAAO,IAExB,IADgB,KAAK,IAAI,KAAK,IAAI,GAAQ,EAAI,EAAE,EAAI,CAC5B;IAGpB,KAAmB,MAA2C;AAClE,IAAE,gBAAgB;EAClB,IAAM,IAAW,IAAQ;AACzB,EAAI,KAAY,KACd,IAAgB,EAAS;IAIvB,KAAmB,MAA2C;AAClE,IAAE,gBAAgB;EAClB,IAAM,IAAW,IAAQ;AACzB,EAAI,KAAY,KACd,IAAgB,EAAS;IAIvB,IAAqB,EAAc,IACnC,IAAmB,EAAY,IAC/B,IAAoB,EAAa;AAEvC,QACE,kBAAC,OAAD;EACE,WAAW,EACT,EAA2B,EAAE,SAAM,CAAC,EACpC,EAAc,IACd,EACD;YALH;GAOE,kBAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,UAAU,KAAY,KAAS;IAC/B,cAAW;IACX,OAAM;IACN,WAAW,EACT,kTACA,EACD;cAED,kBAAC,GAAD;KAAM,MAAM;KAAW,MAAM;KAAoB,CAAA;IAC1C,CAAA;GAET,kBAAC,SAAD;IACO;IACL,MAAK;IACE;IACP,UAAU;IACL;IACA;IACC;IACI;IACV,cAAY;IACZ,gBAAc,MAAU,WAAW,KAAA;IACnC,oBAAkB,EAAK,uBAAuB,EAAS;IACvD,WAAW,EACT,8QACA,EACD;IACD,GAAI;IACJ,CAAA;GAEF,kBAAC,UAAD;IACE,MAAK;IACL,SAAS;IACT,UAAU,KAAY,KAAS;IAC/B,cAAW;IACX,OAAM;IACN,WAAW,EACT,kTACA,EACD;cAED,kBAAC,GAAD;KAAM,MAAM;KAAU,MAAM;KAAoB,CAAA;IACzC,CAAA;GACL;;EAGX;AACD,EAAY,cAAc"}

package/dist/ui/pagination.d.ts

@@ -71,5 +71,5 @@ export interface PaginationNavProps extends React.HTMLAttributes<HTMLElement> {
     siblingCount?: number;
 }
 declare const PaginationNav: React.ForwardRefExoticComponent<PaginationNavProps & React.RefAttributes<HTMLElement>>;
-export { PaginationRoot, PaginationContent, PaginationItem, PaginationLink, PaginationPrevious, PaginationNext, PaginationEllipsis, PaginationNav, generatePagination, };
+export { generatePagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNav, PaginationNext, PaginationPrevious, PaginationRoot, };
 //# sourceMappingURL=pagination.d.ts.map

package/dist/ui/pagination.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../src/ui/pagination.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,QAAA,MAAM,cAAc,0JAWlB,CAAA;AAGF,QAAA,MAAM,iBAAiB,yKASrB,CAAA;AAGF,QAAA,MAAM,cAAc,kKAKlB,CAAA;AAGF;;;;;;;;;;;;;GAaG;AACH,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,QAAA,MAAM,cAAc,+FAkBnB,CAAA;AAGD,QAAA,MAAM,kBAAkB,+FAatB,CAAA;AAGF,QAAA,MAAM,cAAc,+FAalB,CAAA;AAGF,QAAA,MAAM,kBAAkB,sKAgBtB,CAAA;AAOF,KAAK,QAAQ,GAAG,MAAM,GAAG,UAAU,CAAA;AAEnC;;;;;GAKG;AACH,iBAAS,kBAAkB,CACzB,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,MAAM,GACnB,QAAQ,EAAE,CAoCZ;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACzC,4BAA4B;IAC5B,UAAU,EAAE,MAAM,CAAA;IAClB,sCAAsC;IACtC,WAAW,EAAE,MAAM,CAAA;IACnB,qDAAqD;IACrD,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC,yFAAyF;IACzF,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,QAAA,MAAM,aAAa,wFAqDlB,CAAA;AAGD,OAAO,EACL,cAAc,EACd,iBAAiB,EACjB,cAAc,EACd,cAAc,EACd,kBAAkB,EAClB,cAAc,EACd,kBAAkB,EAClB,aAAa,EACb,kBAAkB,GACnB,CAAA"}
+{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../src/ui/pagination.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,QAAA,MAAM,cAAc,0JAWlB,CAAA;AAGF,QAAA,MAAM,iBAAiB,yKASrB,CAAA;AAGF,QAAA,MAAM,cAAc,kKAKlB,CAAA;AAGF;;;;;;;;;;;;;GAaG;AACH,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACrD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,QAAA,MAAM,cAAc,+FAkBnB,CAAA;AAGD,QAAA,MAAM,kBAAkB,+FAatB,CAAA;AAGF,QAAA,MAAM,cAAc,+FAalB,CAAA;AAGF,QAAA,MAAM,kBAAkB,sKAgBtB,CAAA;AAOF,KAAK,QAAQ,GAAG,MAAM,GAAG,UAAU,CAAA;AAEnC;;;;;GAKG;AACH,iBAAS,kBAAkB,CACzB,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,MAAM,GACnB,QAAQ,EAAE,CAoCZ;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACzC,4BAA4B;IAC5B,UAAU,EAAE,MAAM,CAAA;IAClB,sCAAsC;IACtC,WAAW,EAAE,MAAM,CAAA;IACnB,qDAAqD;IACrD,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC,yFAAyF;IACzF,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,QAAA,MAAM,aAAa,wFAqDlB,CAAA;AAGD,OAAO,EACL,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACd,cAAc,EACd,aAAa,EACb,cAAc,EACd,kBAAkB,EAClB,cAAc,GACf,CAAA"}

package/dist/ui/pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.js","names":[],"sources":["../../src/ui/pagination.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Slot } from '@primitives/react-slot'\nimport { IconChevronLeft, IconChevronRight, IconDots } from '@tabler/icons-react'\nimport { cn } from './lib/utils'\nimport { Icon } from './icon'\n\nconst PaginationRoot = React.forwardRef<\n  HTMLElement,\n  React.ComponentPropsWithoutRef<'nav'>\n>(({ className, ...props }, ref) => (\n  <nav\n    ref={ref}\n    role=\"navigation\"\n    aria-label=\"pagination\"\n    className={cn('mx-auto flex w-full justify-center', className)}\n    {...props}\n  />\n))\nPaginationRoot.displayName = 'PaginationRoot'\n\nconst PaginationContent = React.forwardRef<\n  HTMLUListElement,\n  React.ComponentPropsWithoutRef<'ul'>\n>(({ className, ...props }, ref) => (\n  <ul\n    ref={ref}\n    className={cn('flex flex-row items-center gap-ds-02', className)}\n    {...props}\n  />\n))\nPaginationContent.displayName = 'PaginationContent'\n\nconst PaginationItem = React.forwardRef<\n  HTMLLIElement,\n  React.ComponentPropsWithoutRef<'li'>\n>(({ className, ...props }, ref) => (\n  <li ref={ref} className={cn('', className)} {...props} />\n))\nPaginationItem.displayName = 'PaginationItem'\n\n/**\n * Props for PaginationLink — a single page number button in a pagination row.\n * When `isActive` is true, the button gets the brand interactive fill and `aria-current=\"page\"`.\n *\n * @example\n * // Active page button:\n * <PaginationLink isActive onClick={() => goToPage(3)}>3</PaginationLink>\n *\n * @example\n * // Render as a Next.js Link via asChild:\n * <PaginationLink asChild isActive={currentPage === 5}>\n *   <Link href=\"/posts?page=5\">5</Link>\n * </PaginationLink>\n */\nexport interface PaginationLinkProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  isActive?: boolean\n  asChild?: boolean\n}\n\nconst PaginationLink = React.forwardRef<HTMLButtonElement, PaginationLinkProps>(\n  ({ className, isActive = false, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : 'button'\n    return (\n      <Comp\n        ref={ref}\n        aria-current={isActive ? 'page' : undefined}\n        className={cn(\n          'inline-flex items-center justify-center h-ds-sm-plus w-ds-sm-plus rounded-ds-md text-ds-md font-medium tabular-nums transition-colors focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-action-disabled active:scale-95',\n          isActive\n            ? 'bg-accent-9 text-accent-fg'\n            : 'hover:bg-surface-raised-hover text-surface-fg',\n          className,\n        )}\n        {...props}\n      />\n    )\n  },\n)\nPaginationLink.displayName = 'PaginationLink'\n\nconst PaginationPrevious = React.forwardRef<\n  HTMLButtonElement,\n  PaginationLinkProps\n>(({ className, ...props }, ref) => (\n  <PaginationLink\n    ref={ref}\n    aria-label=\"Go to previous page\"\n    className={cn('w-auto gap-ds-02 pl-ds-03 pr-ds-04', className)}\n    {...props}\n  >\n    <Icon icon={IconChevronLeft} size=\"sm\" />\n    <span>Previous</span>\n  </PaginationLink>\n))\nPaginationPrevious.displayName = 'PaginationPrevious'\n\nconst PaginationNext = React.forwardRef<\n  HTMLButtonElement,\n  PaginationLinkProps\n>(({ className, ...props }, ref) => (\n  <PaginationLink\n    ref={ref}\n    aria-label=\"Go to next page\"\n    className={cn('w-auto gap-ds-02 pl-ds-04 pr-ds-03', className)}\n    {...props}\n  >\n    <span>Next</span>\n    <Icon icon={IconChevronRight} size=\"sm\" />\n  </PaginationLink>\n))\nPaginationNext.displayName = 'PaginationNext'\n\nconst PaginationEllipsis = React.forwardRef<\n  HTMLSpanElement,\n  React.ComponentPropsWithoutRef<'span'>\n>(({ className, ...props }, ref) => (\n  <span\n    ref={ref}\n    aria-hidden=\"true\"\n    className={cn(\n      'flex h-ds-sm-plus w-ds-sm-plus items-center justify-center text-surface-fg-muted',\n      className,\n    )}\n    {...props}\n  >\n    <Icon icon={IconDots} size=\"sm\" />\n    <span className=\"sr-only\">More pages</span>\n  </span>\n))\nPaginationEllipsis.displayName = 'PaginationEllipsis'\n\n/* ------------------------------------------------------------------ */\n/*  generatePagination helper                                         */\n/* ------------------------------------------------------------------ */\n\ntype PageItem = number | 'ellipsis'\n\n/**\n * Pure function that builds an array of page numbers and ellipsis markers.\n * Always shows first and last page, plus `siblingCount` pages around `current`.\n *\n * @example generatePagination(5, 10, 1) → [1, 'ellipsis', 4, 5, 6, 'ellipsis', 10]\n */\nfunction generatePagination(\n  current: number,\n  total: number,\n  siblingCount: number,\n): PageItem[] {\n  // When total pages fit without any ellipsis\n  const totalSlots = siblingCount * 2 + 5 // first + last + current + 2*siblings + 2 ellipsis slots\n  if (total <= totalSlots) {\n    return Array.from({ length: total }, (_, i) => i + 1)\n  }\n\n  const leftSibling = Math.max(current - siblingCount, 1)\n  const rightSibling = Math.min(current + siblingCount, total)\n\n  const showLeftEllipsis = leftSibling > 2\n  const showRightEllipsis = rightSibling < total - 1\n\n  if (!showLeftEllipsis && showRightEllipsis) {\n    // e.g. [1, 2, 3, 4, 5, '...', 10]\n    const leftCount = siblingCount * 2 + 3\n    const leftPages = Array.from({ length: leftCount }, (_, i) => i + 1)\n    return [...leftPages, 'ellipsis', total]\n  }\n\n  if (showLeftEllipsis && !showRightEllipsis) {\n    // e.g. [1, '...', 6, 7, 8, 9, 10]\n    const rightCount = siblingCount * 2 + 3\n    const rightPages = Array.from(\n      { length: rightCount },\n      (_, i) => total - rightCount + 1 + i,\n    )\n    return [1, 'ellipsis', ...rightPages]\n  }\n\n  // Both ellipses: [1, '...', 4, 5, 6, '...', 10]\n  const middlePages = Array.from(\n    { length: rightSibling - leftSibling + 1 },\n    (_, i) => leftSibling + i,\n  )\n  return [1, 'ellipsis', ...middlePages, 'ellipsis', total]\n}\n\n/* ------------------------------------------------------------------ */\n/*  PaginationNav — controlled convenience wrapper                    */\n/* ------------------------------------------------------------------ */\n\n/**\n * Props for PaginationNav — a fully self-contained controlled pagination component that renders\n * Previous / page numbers (with ellipsis) / Next — using `generatePagination` internally.\n *\n * **1-indexed:** `currentPage` starts at 1 (not 0). `onPageChange` also receives 1-indexed values.\n *\n * **`siblingCount`:** Number of page buttons shown on each side of the current page (default 1).\n * A wider `siblingCount` shows more page buttons before switching to ellipsis.\n *\n * @example\n * // Basic controlled pagination:\n * <PaginationNav\n *   totalPages={24}\n *   currentPage={currentPage}\n *   onPageChange={setCurrentPage}\n * />\n *\n * @example\n * // Wider sibling range for a results grid (shows more page context):\n * <PaginationNav\n *   totalPages={100}\n *   currentPage={currentPage}\n *   onPageChange={setCurrentPage}\n *   siblingCount={2}\n * />\n * // These are just a few ways — feel free to combine props creatively!\n */\nexport interface PaginationNavProps\n  extends React.HTMLAttributes<HTMLElement> {\n  /** Total number of pages */\n  totalPages: number\n  /** Current active page (1-indexed) */\n  currentPage: number\n  /** Called when the user requests a different page */\n  onPageChange: (page: number) => void\n  /** Number of sibling page buttons shown on each side of the current page (default: 1) */\n  siblingCount?: number\n}\n\nconst PaginationNav = React.forwardRef<HTMLElement, PaginationNavProps>(\n  (\n    {\n      totalPages,\n      currentPage,\n      onPageChange,\n      siblingCount = 1,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const pages = generatePagination(currentPage, totalPages, siblingCount)\n\n    return (\n      <PaginationRoot ref={ref} className={className} {...props}>\n        <PaginationContent>\n          <PaginationItem>\n            <PaginationPrevious\n              onClick={() => onPageChange(Math.max(1, currentPage - 1))}\n              disabled={currentPage <= 1}\n            />\n          </PaginationItem>\n\n          {pages.map((page, i) =>\n            page === 'ellipsis' ? (\n              <PaginationItem key={`e${i}`}>\n                <PaginationEllipsis />\n              </PaginationItem>\n            ) : (\n              <PaginationItem key={page}>\n                <PaginationLink\n                  isActive={page === currentPage}\n                  onClick={() => onPageChange(page)}\n                >\n                  {page}\n                </PaginationLink>\n              </PaginationItem>\n            ),\n          )}\n\n          <PaginationItem>\n            <PaginationNext\n              onClick={() =>\n                onPageChange(Math.min(totalPages, currentPage + 1))\n              }\n              disabled={currentPage >= totalPages}\n            />\n          </PaginationItem>\n        </PaginationContent>\n      </PaginationRoot>\n    )\n  },\n)\nPaginationNav.displayName = 'PaginationNav'\n\nexport {\n  PaginationRoot,\n  PaginationContent,\n  PaginationItem,\n  PaginationLink,\n  PaginationPrevious,\n  PaginationNext,\n  PaginationEllipsis,\n  PaginationNav,\n  generatePagination,\n}\n"],"mappings":"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"}
+{"version":3,"file":"pagination.js","names":[],"sources":["../../src/ui/pagination.tsx"],"sourcesContent":["'use client'\n\nimport { Slot } from '@primitives/react-slot'\nimport { IconChevronLeft, IconChevronRight, IconDots } from '@tabler/icons-react'\nimport * as React from 'react'\n\nimport { Icon } from './icon'\nimport { cn } from './lib/utils'\n\nconst PaginationRoot = React.forwardRef<\n  HTMLElement,\n  React.ComponentPropsWithoutRef<'nav'>\n>(({ className, ...props }, ref) => (\n  <nav\n    ref={ref}\n    role=\"navigation\"\n    aria-label=\"pagination\"\n    className={cn('mx-auto flex w-full justify-center', className)}\n    {...props}\n  />\n))\nPaginationRoot.displayName = 'PaginationRoot'\n\nconst PaginationContent = React.forwardRef<\n  HTMLUListElement,\n  React.ComponentPropsWithoutRef<'ul'>\n>(({ className, ...props }, ref) => (\n  <ul\n    ref={ref}\n    className={cn('flex flex-row items-center gap-ds-02', className)}\n    {...props}\n  />\n))\nPaginationContent.displayName = 'PaginationContent'\n\nconst PaginationItem = React.forwardRef<\n  HTMLLIElement,\n  React.ComponentPropsWithoutRef<'li'>\n>(({ className, ...props }, ref) => (\n  <li ref={ref} className={cn('', className)} {...props} />\n))\nPaginationItem.displayName = 'PaginationItem'\n\n/**\n * Props for PaginationLink — a single page number button in a pagination row.\n * When `isActive` is true, the button gets the brand interactive fill and `aria-current=\"page\"`.\n *\n * @example\n * // Active page button:\n * <PaginationLink isActive onClick={() => goToPage(3)}>3</PaginationLink>\n *\n * @example\n * // Render as a Next.js Link via asChild:\n * <PaginationLink asChild isActive={currentPage === 5}>\n *   <Link href=\"/posts?page=5\">5</Link>\n * </PaginationLink>\n */\nexport interface PaginationLinkProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  isActive?: boolean\n  asChild?: boolean\n}\n\nconst PaginationLink = React.forwardRef<HTMLButtonElement, PaginationLinkProps>(\n  ({ className, isActive = false, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : 'button'\n    return (\n      <Comp\n        ref={ref}\n        aria-current={isActive ? 'page' : undefined}\n        className={cn(\n          'inline-flex items-center justify-center h-ds-sm-plus w-ds-sm-plus rounded-ds-md text-ds-md font-medium tabular-nums transition-colors focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-action-disabled active:scale-95',\n          isActive\n            ? 'bg-accent-9 text-accent-fg'\n            : 'hover:bg-surface-raised-hover text-surface-fg',\n          className,\n        )}\n        {...props}\n      />\n    )\n  },\n)\nPaginationLink.displayName = 'PaginationLink'\n\nconst PaginationPrevious = React.forwardRef<\n  HTMLButtonElement,\n  PaginationLinkProps\n>(({ className, ...props }, ref) => (\n  <PaginationLink\n    ref={ref}\n    aria-label=\"Go to previous page\"\n    className={cn('w-auto gap-ds-02 pl-ds-03 pr-ds-04', className)}\n    {...props}\n  >\n    <Icon icon={IconChevronLeft} size=\"sm\" />\n    <span>Previous</span>\n  </PaginationLink>\n))\nPaginationPrevious.displayName = 'PaginationPrevious'\n\nconst PaginationNext = React.forwardRef<\n  HTMLButtonElement,\n  PaginationLinkProps\n>(({ className, ...props }, ref) => (\n  <PaginationLink\n    ref={ref}\n    aria-label=\"Go to next page\"\n    className={cn('w-auto gap-ds-02 pl-ds-04 pr-ds-03', className)}\n    {...props}\n  >\n    <span>Next</span>\n    <Icon icon={IconChevronRight} size=\"sm\" />\n  </PaginationLink>\n))\nPaginationNext.displayName = 'PaginationNext'\n\nconst PaginationEllipsis = React.forwardRef<\n  HTMLSpanElement,\n  React.ComponentPropsWithoutRef<'span'>\n>(({ className, ...props }, ref) => (\n  <span\n    ref={ref}\n    aria-hidden=\"true\"\n    className={cn(\n      'flex h-ds-sm-plus w-ds-sm-plus items-center justify-center text-surface-fg-muted',\n      className,\n    )}\n    {...props}\n  >\n    <Icon icon={IconDots} size=\"sm\" />\n    <span className=\"sr-only\">More pages</span>\n  </span>\n))\nPaginationEllipsis.displayName = 'PaginationEllipsis'\n\n/* ------------------------------------------------------------------ */\n/*  generatePagination helper                                         */\n/* ------------------------------------------------------------------ */\n\ntype PageItem = number | 'ellipsis'\n\n/**\n * Pure function that builds an array of page numbers and ellipsis markers.\n * Always shows first and last page, plus `siblingCount` pages around `current`.\n *\n * @example generatePagination(5, 10, 1) → [1, 'ellipsis', 4, 5, 6, 'ellipsis', 10]\n */\nfunction generatePagination(\n  current: number,\n  total: number,\n  siblingCount: number,\n): PageItem[] {\n  // When total pages fit without any ellipsis\n  const totalSlots = siblingCount * 2 + 5 // first + last + current + 2*siblings + 2 ellipsis slots\n  if (total <= totalSlots) {\n    return Array.from({ length: total }, (_, i) => i + 1)\n  }\n\n  const leftSibling = Math.max(current - siblingCount, 1)\n  const rightSibling = Math.min(current + siblingCount, total)\n\n  const showLeftEllipsis = leftSibling > 2\n  const showRightEllipsis = rightSibling < total - 1\n\n  if (!showLeftEllipsis && showRightEllipsis) {\n    // e.g. [1, 2, 3, 4, 5, '...', 10]\n    const leftCount = siblingCount * 2 + 3\n    const leftPages = Array.from({ length: leftCount }, (_, i) => i + 1)\n    return [...leftPages, 'ellipsis', total]\n  }\n\n  if (showLeftEllipsis && !showRightEllipsis) {\n    // e.g. [1, '...', 6, 7, 8, 9, 10]\n    const rightCount = siblingCount * 2 + 3\n    const rightPages = Array.from(\n      { length: rightCount },\n      (_, i) => total - rightCount + 1 + i,\n    )\n    return [1, 'ellipsis', ...rightPages]\n  }\n\n  // Both ellipses: [1, '...', 4, 5, 6, '...', 10]\n  const middlePages = Array.from(\n    { length: rightSibling - leftSibling + 1 },\n    (_, i) => leftSibling + i,\n  )\n  return [1, 'ellipsis', ...middlePages, 'ellipsis', total]\n}\n\n/* ------------------------------------------------------------------ */\n/*  PaginationNav — controlled convenience wrapper                    */\n/* ------------------------------------------------------------------ */\n\n/**\n * Props for PaginationNav — a fully self-contained controlled pagination component that renders\n * Previous / page numbers (with ellipsis) / Next — using `generatePagination` internally.\n *\n * **1-indexed:** `currentPage` starts at 1 (not 0). `onPageChange` also receives 1-indexed values.\n *\n * **`siblingCount`:** Number of page buttons shown on each side of the current page (default 1).\n * A wider `siblingCount` shows more page buttons before switching to ellipsis.\n *\n * @example\n * // Basic controlled pagination:\n * <PaginationNav\n *   totalPages={24}\n *   currentPage={currentPage}\n *   onPageChange={setCurrentPage}\n * />\n *\n * @example\n * // Wider sibling range for a results grid (shows more page context):\n * <PaginationNav\n *   totalPages={100}\n *   currentPage={currentPage}\n *   onPageChange={setCurrentPage}\n *   siblingCount={2}\n * />\n * // These are just a few ways — feel free to combine props creatively!\n */\nexport interface PaginationNavProps\n  extends React.HTMLAttributes<HTMLElement> {\n  /** Total number of pages */\n  totalPages: number\n  /** Current active page (1-indexed) */\n  currentPage: number\n  /** Called when the user requests a different page */\n  onPageChange: (page: number) => void\n  /** Number of sibling page buttons shown on each side of the current page (default: 1) */\n  siblingCount?: number\n}\n\nconst PaginationNav = React.forwardRef<HTMLElement, PaginationNavProps>(\n  (\n    {\n      totalPages,\n      currentPage,\n      onPageChange,\n      siblingCount = 1,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const pages = generatePagination(currentPage, totalPages, siblingCount)\n\n    return (\n      <PaginationRoot ref={ref} className={className} {...props}>\n        <PaginationContent>\n          <PaginationItem>\n            <PaginationPrevious\n              onClick={() => onPageChange(Math.max(1, currentPage - 1))}\n              disabled={currentPage <= 1}\n            />\n          </PaginationItem>\n\n          {pages.map((page, i) =>\n            page === 'ellipsis' ? (\n              <PaginationItem key={`e${i}`}>\n                <PaginationEllipsis />\n              </PaginationItem>\n            ) : (\n              <PaginationItem key={page}>\n                <PaginationLink\n                  isActive={page === currentPage}\n                  onClick={() => onPageChange(page)}\n                >\n                  {page}\n                </PaginationLink>\n              </PaginationItem>\n            ),\n          )}\n\n          <PaginationItem>\n            <PaginationNext\n              onClick={() =>\n                onPageChange(Math.min(totalPages, currentPage + 1))\n              }\n              disabled={currentPage >= totalPages}\n            />\n          </PaginationItem>\n        </PaginationContent>\n      </PaginationRoot>\n    )\n  },\n)\nPaginationNav.displayName = 'PaginationNav'\n\nexport {\n  generatePagination,\n  PaginationContent,\n  PaginationEllipsis,\n  PaginationItem,\n  PaginationLink,\n  PaginationNav,\n  PaginationNext,\n  PaginationPrevious,\n  PaginationRoot,\n}\n"],"mappings":"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"}

package/dist/ui/popover.d.ts

@@ -1,10 +1,10 @@
 "use client";
-import * as React from 'react';
 import * as PopoverPrimitive from '../primitives/react-popover';
+import * as React from 'react';
 declare const Popover: React.FC<React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Root>>;
 declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
 declare const PopoverAnchor: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & React.RefAttributes<HTMLDivElement>>;
 declare const PopoverContent: React.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export type PopoverContentProps = React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>;
-export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };
+export { Popover, PopoverAnchor, PopoverContent, PopoverTrigger };
 //# sourceMappingURL=popover.d.ts.map

package/dist/ui/popover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../src/ui/popover.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,gBAAgB,MAAM,2BAA2B,CAAA;AAY7D,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,CA4BnF,CAAA;AAGD,QAAA,MAAM,cAAc,gHAA2B,CAAA;AAE/C,QAAA,MAAM,aAAa,4GAA0B,CAAA;AAE7C,QAAA,MAAM,cAAc,gKAiDlB,CAAA;AAGF,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,CAAA;AAEjG,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,aAAa,EAAE,CAAA"}
+{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../src/ui/popover.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,gBAAgB,MAAM,2BAA2B,CAAA;AAE7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAW9B,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,CA4BnF,CAAA;AAGD,QAAA,MAAM,cAAc,gHAA2B,CAAA;AAE/C,QAAA,MAAM,aAAa,4GAA0B,CAAA;AAE7C,QAAA,MAAM,cAAc,gKAiDlB,CAAA;AAGF,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,CAAA;AAEjG,OAAO,EAAE,OAAO,EAAE,aAAa,EAAC,cAAc,EAAE,cAAc,EAAE,CAAA"}

package/dist/ui/progress-ring.d.ts

@@ -42,5 +42,5 @@ export interface MultiProgressRingProps extends Omit<React.SVGAttributes<SVGSVGE
     size?: 'sm' | 'md' | 'lg';
 }
 declare const MultiProgressRing: React.ForwardRefExoticComponent<MultiProgressRingProps & React.RefAttributes<SVGSVGElement>>;
-export { ProgressRing, MultiProgressRing };
+export { MultiProgressRing, ProgressRing };
 //# sourceMappingURL=progress-ring.d.ts.map

package/dist/ui/progress-ring.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"progress-ring.d.ts","sourceRoot":"","sources":["../../src/ui/progress-ring.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAmB9B;;;;;;GAMG;AACH,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IAC1F,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAA;IACb,iCAAiC;IACjC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,oBAAoB;IACpB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;IAC5D,qCAAqC;IACrC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,uBAAuB;IACvB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,QAAA,MAAM,YAAY,yFA4EjB,CAAA;AAGD;;;;;;;;GAQG;AACH,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IAC/F,KAAK,EAAE,KAAK,CAAC;QACX,KAAK,EAAE,MAAM,CAAA;QACb,GAAG,CAAC,EAAE,MAAM,CAAA;QACZ,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;QAC5D,KAAK,CAAC,EAAE,MAAM,CAAA;KACf,CAAC,CAAA;IACF,oBAAoB;IACpB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC1B;AAED,QAAA,MAAM,iBAAiB,8FAuDtB,CAAA;AAGD,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,CAAA"}
+{"version":3,"file":"progress-ring.d.ts","sourceRoot":"","sources":["../../src/ui/progress-ring.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAmB9B;;;;;;GAMG;AACH,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IAC1F,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAA;IACb,iCAAiC;IACjC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,oBAAoB;IACpB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;IAC5D,qCAAqC;IACrC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,uBAAuB;IACvB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,QAAA,MAAM,YAAY,yFA4EjB,CAAA;AAGD;;;;;;;;GAQG;AACH,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IAC/F,KAAK,EAAE,KAAK,CAAC;QACX,KAAK,EAAE,MAAM,CAAA;QACb,GAAG,CAAC,EAAE,MAAM,CAAA;QACZ,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAA;QAC5D,KAAK,CAAC,EAAE,MAAM,CAAA;KACf,CAAC,CAAA;IACF,oBAAoB;IACpB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC1B;AAED,QAAA,MAAM,iBAAiB,8FAuDtB,CAAA;AAGD,OAAO,EAAE,iBAAiB,EAAC,YAAY,EAAE,CAAA"}

package/dist/ui/progress-ring.js

@@ -1,9 +1,9 @@
 "use client";
-import { a as e, i as t, n, r, t as i } from "../_chunks/framer.js";
-import { springs as a } from "./lib/motion.js";
-import { cn as o } from "./lib/utils.js";
-import * as s from "react";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { springs as e } from "./lib/motion.js";
+import { cn as t } from "./lib/utils.js";
+import * as n from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { animate as a, motion as o, useMotionValue as s, useReducedMotion as c, useTransform as l } from "framer-motion";
 //#region src/ui/progress-ring.tsx
 var u = {
 	default: "var(--color-accent-9)",
@@ -27,10 +27,10 @@ var u = {
 		strokeWidth: 4,
 		fontSize: "text-ds-md"
 	}
-}, f = s.forwardRef(({ value: f, max: p = 100, size: m = "md", color: h = "default", showValue: g = !1, label: _, className: v, ...y }, b) => {
-	let x = n(), S = d[m], C = (S.size - S.strokeWidth) / 2, w = 2 * Math.PI * C, T = Math.min(Math.max(f / p, 0), 1), E = w * (1 - T), D = S.size / 2, O = Math.round(T * 100), k = t(0), A = r(k, (e) => `${Math.round(e)}%`);
-	return s.useEffect(() => {
-		let e = i(k, T * 100, x ? {
+}, f = n.forwardRef(({ value: f, max: p = 100, size: m = "md", color: h = "default", showValue: g = !1, label: _, className: v, ...y }, b) => {
+	let x = c(), S = d[m], C = (S.size - S.strokeWidth) / 2, w = 2 * Math.PI * C, T = Math.min(Math.max(f / p, 0), 1), E = w * (1 - T), D = S.size / 2, O = Math.round(T * 100), k = s(0), A = l(k, (e) => `${Math.round(e)}%`);
+	return n.useEffect(() => {
+		let e = a(k, T * 100, x ? {
 			type: "tween",
 			duration: 0
 		} : {
@@ -43,7 +43,7 @@ var u = {
 		T,
 		k,
 		x
-	]), /* @__PURE__ */ l("svg", {
+	]), /* @__PURE__ */ i("svg", {
 		ref: b,
 		width: S.size,
 		height: S.size,
@@ -53,10 +53,10 @@ var u = {
 		"aria-valuemin": 0,
 		"aria-valuemax": p,
 		"aria-label": _ ?? `${O}% progress`,
-		className: o("shrink-0", v),
+		className: t("shrink-0", v),
 		...y,
 		children: [
-			/* @__PURE__ */ c("circle", {
+			/* @__PURE__ */ r("circle", {
 				cx: D,
 				cy: D,
 				r: C,
@@ -64,7 +64,7 @@ var u = {
 				stroke: "var(--color-surface-raised-hover)",
 				strokeWidth: S.strokeWidth
 			}),
-			/* @__PURE__ */ c(e.circle, {
+			/* @__PURE__ */ r(o.circle, {
 				cx: D,
 				cy: D,
 				r: C,
@@ -75,57 +75,57 @@ var u = {
 				strokeDasharray: w,
 				initial: { strokeDashoffset: w },
 				animate: { strokeDashoffset: E },
-				transition: x ? { duration: 0 } : a.smooth,
+				transition: x ? { duration: 0 } : e.smooth,
 				transform: `rotate(-90 ${D} ${D})`
 			}),
-			g && /* @__PURE__ */ c(e.text, {
+			g && /* @__PURE__ */ r(o.text, {
 				x: D,
 				y: D,
 				textAnchor: "middle",
 				dominantBaseline: "central",
-				className: o(S.fontSize, "fill-surface-fg font-sans font-semibold"),
+				className: t(S.fontSize, "fill-surface-fg font-sans font-semibold"),
 				children: A
 			})
 		]
 	});
 });
 f.displayName = "ProgressRing";
-var p = s.forwardRef(({ rings: t, size: r = "md", className: i, ...f }, p) => {
-	let m = n(), h = d[r], g = h.size / 2, _ = h.strokeWidth + 2;
-	return /* @__PURE__ */ c("svg", {
+var p = n.forwardRef(({ rings: a, size: s = "md", className: l, ...f }, p) => {
+	let m = c(), h = d[s], g = h.size / 2, _ = h.strokeWidth + 2;
+	return /* @__PURE__ */ r("svg", {
 		ref: p,
 		width: h.size,
 		height: h.size,
 		viewBox: `0 0 ${h.size} ${h.size}`,
 		role: "group",
 		"aria-label": "Progress rings",
-		className: o("shrink-0", i),
+		className: t("shrink-0", l),
 		...f,
-		children: t.map((t, n) => {
-			let r = (h.size - h.strokeWidth) / 2 - n * _;
-			if (r <= 0) return null;
-			let i = 2 * Math.PI * r, o = i * (1 - Math.min(Math.max(t.value / (t.max ?? 100), 0), 1));
-			return /* @__PURE__ */ l(s.Fragment, { children: [/* @__PURE__ */ c("circle", {
+		children: a.map((t, a) => {
+			let s = (h.size - h.strokeWidth) / 2 - a * _;
+			if (s <= 0) return null;
+			let c = 2 * Math.PI * s, l = c * (1 - Math.min(Math.max(t.value / (t.max ?? 100), 0), 1));
+			return /* @__PURE__ */ i(n.Fragment, { children: [/* @__PURE__ */ r("circle", {
 				cx: g,
 				cy: g,
-				r,
+				r: s,
 				fill: "none",
 				stroke: "var(--color-surface-raised-hover)",
 				strokeWidth: h.strokeWidth
-			}), /* @__PURE__ */ c(e.circle, {
+			}), /* @__PURE__ */ r(o.circle, {
 				cx: g,
 				cy: g,
-				r,
+				r: s,
 				fill: "none",
 				stroke: u[t.color ?? "default"],
 				strokeWidth: h.strokeWidth,
 				strokeLinecap: "round",
-				strokeDasharray: i,
-				initial: { strokeDashoffset: i },
-				animate: { strokeDashoffset: o },
-				transition: m ? { duration: 0 } : a.smooth,
+				strokeDasharray: c,
+				initial: { strokeDashoffset: c },
+				animate: { strokeDashoffset: l },
+				transition: m ? { duration: 0 } : e.smooth,
 				transform: `rotate(-90 ${g} ${g})`
-			})] }, n);
+			})] }, a);
 		})
 	});
 });

package/dist/ui/progress-ring.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-ring.js","names":[],"sources":["../../src/ui/progress-ring.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { motion, useMotionValue, useTransform, animate, useReducedMotion } from 'framer-motion'\nimport { springs } from './lib/motion'\nimport { cn } from './lib/utils'\n\nconst colorMap: Record<string, string> = {\n  default: 'var(--color-accent-9)',\n  success: 'var(--color-success-9)',\n  warning: 'var(--color-warning-9)',\n  error: 'var(--color-error-9)',\n  info: 'var(--color-info-9)',\n}\n\nconst sizeConfig = {\n  sm: { size: 32, strokeWidth: 3, fontSize: 'text-ds-xs' },\n  md: { size: 48, strokeWidth: 3.5, fontSize: 'text-ds-sm' },\n  lg: { size: 64, strokeWidth: 4, fontSize: 'text-ds-md' },\n} as const\n\n/**\n * A circular progress indicator with optional label and animated fill.\n *\n * @example\n * <ProgressRing value={75} />\n * <ProgressRing value={3} max={12} size=\"lg\" color=\"warning\" showValue />\n */\nexport interface ProgressRingProps extends Omit<React.SVGAttributes<SVGSVGElement>, 'color'> {\n  /** Current progress value */\n  value: number\n  /** Maximum value @default 100 */\n  max?: number\n  /** @default 'md' */\n  size?: 'sm' | 'md' | 'lg'\n  /** @default 'default' */\n  color?: 'default' | 'success' | 'warning' | 'error' | 'info'\n  /** Show percentage text in center */\n  showValue?: boolean\n  /** Accessible label */\n  label?: string\n}\n\nconst ProgressRing = React.forwardRef<SVGSVGElement, ProgressRingProps>(\n  ({ value, max = 100, size = 'md', color = 'default', showValue = false, label, className, ...props }, ref) => {\n    const prefersReducedMotion = useReducedMotion()\n    const config = sizeConfig[size]\n    const radius = (config.size - config.strokeWidth) / 2\n    const circumference = 2 * Math.PI * radius\n    const progress = Math.min(Math.max(value / max, 0), 1)\n    const offset = circumference * (1 - progress)\n    const center = config.size / 2\n    const percentage = Math.round(progress * 100)\n\n    // Animated counter — drives from 0 → target percentage in sync with the ring fill\n    const motionVal = useMotionValue(0)\n    const displayValue = useTransform(motionVal, (v) => `${Math.round(v)}%`)\n\n    React.useEffect(() => {\n      const controls = animate(motionVal, progress * 100, prefersReducedMotion\n        ? { type: 'tween', duration: 0 }\n        /* Intentionally slower than springs.gentle (200/25/0.8) for smooth ring fill */\n        : { stiffness: 100, damping: 30, type: 'spring' },\n      )\n      return () => controls.stop()\n    }, [progress, motionVal, prefersReducedMotion])\n\n    return (\n      <svg\n        ref={ref}\n        width={config.size}\n        height={config.size}\n        viewBox={`0 0 ${config.size} ${config.size}`}\n        role=\"progressbar\"\n        aria-valuenow={value}\n        aria-valuemin={0}\n        aria-valuemax={max}\n        aria-label={label ?? `${percentage}% progress`}\n        className={cn('shrink-0', className)}\n        {...props}\n      >\n        {/* Track */}\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke=\"var(--color-surface-raised-hover)\"\n          strokeWidth={config.strokeWidth}\n        />\n        {/* Value */}\n        <motion.circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke={colorMap[color]}\n          strokeWidth={config.strokeWidth}\n          strokeLinecap=\"round\"\n          strokeDasharray={circumference}\n          initial={{ strokeDashoffset: circumference }}\n          animate={{ strokeDashoffset: offset }}\n          transition={prefersReducedMotion ? { duration: 0 } : springs.smooth}\n          transform={`rotate(-90 ${center} ${center})`}\n        />\n        {showValue && (\n          <motion.text\n            x={center}\n            y={center}\n            textAnchor=\"middle\"\n            dominantBaseline=\"central\"\n            className={cn(config.fontSize, 'fill-surface-fg font-sans font-semibold')}\n          >\n            {displayValue}\n          </motion.text>\n        )}\n      </svg>\n    )\n  },\n)\nProgressRing.displayName = 'ProgressRing'\n\n/**\n * Multi-ring progress display (Activity Ring style).\n *\n * @example\n * <MultiProgressRing rings={[\n *   { value: 80, color: 'error', label: 'Move' },\n *   { value: 60, color: 'success', label: 'Exercise' },\n * ]} size=\"lg\" />\n */\nexport interface MultiProgressRingProps extends Omit<React.SVGAttributes<SVGSVGElement>, 'color'> {\n  rings: Array<{\n    value: number\n    max?: number\n    color?: 'default' | 'success' | 'warning' | 'error' | 'info'\n    label?: string\n  }>\n  /** @default 'md' */\n  size?: 'sm' | 'md' | 'lg'\n}\n\nconst MultiProgressRing = React.forwardRef<SVGSVGElement, MultiProgressRingProps>(\n  ({ rings, size = 'md', className, ...props }, ref) => {\n    const prefersReducedMotion = useReducedMotion()\n    const config = sizeConfig[size]\n    const center = config.size / 2\n    const gap = config.strokeWidth + 2\n\n    return (\n      <svg\n        ref={ref}\n        width={config.size}\n        height={config.size}\n        viewBox={`0 0 ${config.size} ${config.size}`}\n        role=\"group\"\n        aria-label=\"Progress rings\"\n        className={cn('shrink-0', className)}\n        {...props}\n      >\n        {rings.map((ring, i) => {\n          const radius = (config.size - config.strokeWidth) / 2 - i * gap\n          if (radius <= 0) return null\n          const circumference = 2 * Math.PI * radius\n          const progress = Math.min(Math.max((ring.value) / (ring.max ?? 100), 0), 1)\n          const offset = circumference * (1 - progress)\n\n          return (\n            <React.Fragment key={i}>\n              <circle\n                cx={center}\n                cy={center}\n                r={radius}\n                fill=\"none\"\n                stroke=\"var(--color-surface-raised-hover)\"\n                strokeWidth={config.strokeWidth}\n              />\n              <motion.circle\n                cx={center}\n                cy={center}\n                r={radius}\n                fill=\"none\"\n                stroke={colorMap[ring.color ?? 'default']}\n                strokeWidth={config.strokeWidth}\n                strokeLinecap=\"round\"\n                strokeDasharray={circumference}\n                initial={{ strokeDashoffset: circumference }}\n                animate={{ strokeDashoffset: offset }}\n                transition={prefersReducedMotion ? { duration: 0 } : springs.smooth}\n                transform={`rotate(-90 ${center} ${center})`}\n              />\n            </React.Fragment>\n          )\n        })}\n      </svg>\n    )\n  },\n)\nMultiProgressRing.displayName = 'MultiProgressRing'\n\nexport { ProgressRing, MultiProgressRing }\n"],"mappings":"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"}
+{"version":3,"file":"progress-ring.js","names":[],"sources":["../../src/ui/progress-ring.tsx"],"sourcesContent":["'use client'\n\nimport { animate, motion, useMotionValue, useReducedMotion,useTransform } from 'framer-motion'\nimport * as React from 'react'\n\nimport { springs } from './lib/motion'\nimport { cn } from './lib/utils'\n\nconst colorMap: Record<string, string> = {\n  default: 'var(--color-accent-9)',\n  success: 'var(--color-success-9)',\n  warning: 'var(--color-warning-9)',\n  error: 'var(--color-error-9)',\n  info: 'var(--color-info-9)',\n}\n\nconst sizeConfig = {\n  sm: { size: 32, strokeWidth: 3, fontSize: 'text-ds-xs' },\n  md: { size: 48, strokeWidth: 3.5, fontSize: 'text-ds-sm' },\n  lg: { size: 64, strokeWidth: 4, fontSize: 'text-ds-md' },\n} as const\n\n/**\n * A circular progress indicator with optional label and animated fill.\n *\n * @example\n * <ProgressRing value={75} />\n * <ProgressRing value={3} max={12} size=\"lg\" color=\"warning\" showValue />\n */\nexport interface ProgressRingProps extends Omit<React.SVGAttributes<SVGSVGElement>, 'color'> {\n  /** Current progress value */\n  value: number\n  /** Maximum value @default 100 */\n  max?: number\n  /** @default 'md' */\n  size?: 'sm' | 'md' | 'lg'\n  /** @default 'default' */\n  color?: 'default' | 'success' | 'warning' | 'error' | 'info'\n  /** Show percentage text in center */\n  showValue?: boolean\n  /** Accessible label */\n  label?: string\n}\n\nconst ProgressRing = React.forwardRef<SVGSVGElement, ProgressRingProps>(\n  ({ value, max = 100, size = 'md', color = 'default', showValue = false, label, className, ...props }, ref) => {\n    const prefersReducedMotion = useReducedMotion()\n    const config = sizeConfig[size]\n    const radius = (config.size - config.strokeWidth) / 2\n    const circumference = 2 * Math.PI * radius\n    const progress = Math.min(Math.max(value / max, 0), 1)\n    const offset = circumference * (1 - progress)\n    const center = config.size / 2\n    const percentage = Math.round(progress * 100)\n\n    // Animated counter — drives from 0 → target percentage in sync with the ring fill\n    const motionVal = useMotionValue(0)\n    const displayValue = useTransform(motionVal, (v) => `${Math.round(v)}%`)\n\n    React.useEffect(() => {\n      const controls = animate(motionVal, progress * 100, prefersReducedMotion\n        ? { type: 'tween', duration: 0 }\n        /* Intentionally slower than springs.gentle (200/25/0.8) for smooth ring fill */\n        : { stiffness: 100, damping: 30, type: 'spring' },\n      )\n      return () => controls.stop()\n    }, [progress, motionVal, prefersReducedMotion])\n\n    return (\n      <svg\n        ref={ref}\n        width={config.size}\n        height={config.size}\n        viewBox={`0 0 ${config.size} ${config.size}`}\n        role=\"progressbar\"\n        aria-valuenow={value}\n        aria-valuemin={0}\n        aria-valuemax={max}\n        aria-label={label ?? `${percentage}% progress`}\n        className={cn('shrink-0', className)}\n        {...props}\n      >\n        {/* Track */}\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke=\"var(--color-surface-raised-hover)\"\n          strokeWidth={config.strokeWidth}\n        />\n        {/* Value */}\n        <motion.circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke={colorMap[color]}\n          strokeWidth={config.strokeWidth}\n          strokeLinecap=\"round\"\n          strokeDasharray={circumference}\n          initial={{ strokeDashoffset: circumference }}\n          animate={{ strokeDashoffset: offset }}\n          transition={prefersReducedMotion ? { duration: 0 } : springs.smooth}\n          transform={`rotate(-90 ${center} ${center})`}\n        />\n        {showValue && (\n          <motion.text\n            x={center}\n            y={center}\n            textAnchor=\"middle\"\n            dominantBaseline=\"central\"\n            className={cn(config.fontSize, 'fill-surface-fg font-sans font-semibold')}\n          >\n            {displayValue}\n          </motion.text>\n        )}\n      </svg>\n    )\n  },\n)\nProgressRing.displayName = 'ProgressRing'\n\n/**\n * Multi-ring progress display (Activity Ring style).\n *\n * @example\n * <MultiProgressRing rings={[\n *   { value: 80, color: 'error', label: 'Move' },\n *   { value: 60, color: 'success', label: 'Exercise' },\n * ]} size=\"lg\" />\n */\nexport interface MultiProgressRingProps extends Omit<React.SVGAttributes<SVGSVGElement>, 'color'> {\n  rings: Array<{\n    value: number\n    max?: number\n    color?: 'default' | 'success' | 'warning' | 'error' | 'info'\n    label?: string\n  }>\n  /** @default 'md' */\n  size?: 'sm' | 'md' | 'lg'\n}\n\nconst MultiProgressRing = React.forwardRef<SVGSVGElement, MultiProgressRingProps>(\n  ({ rings, size = 'md', className, ...props }, ref) => {\n    const prefersReducedMotion = useReducedMotion()\n    const config = sizeConfig[size]\n    const center = config.size / 2\n    const gap = config.strokeWidth + 2\n\n    return (\n      <svg\n        ref={ref}\n        width={config.size}\n        height={config.size}\n        viewBox={`0 0 ${config.size} ${config.size}`}\n        role=\"group\"\n        aria-label=\"Progress rings\"\n        className={cn('shrink-0', className)}\n        {...props}\n      >\n        {rings.map((ring, i) => {\n          const radius = (config.size - config.strokeWidth) / 2 - i * gap\n          if (radius <= 0) return null\n          const circumference = 2 * Math.PI * radius\n          const progress = Math.min(Math.max((ring.value) / (ring.max ?? 100), 0), 1)\n          const offset = circumference * (1 - progress)\n\n          return (\n            <React.Fragment key={i}>\n              <circle\n                cx={center}\n                cy={center}\n                r={radius}\n                fill=\"none\"\n                stroke=\"var(--color-surface-raised-hover)\"\n                strokeWidth={config.strokeWidth}\n              />\n              <motion.circle\n                cx={center}\n                cy={center}\n                r={radius}\n                fill=\"none\"\n                stroke={colorMap[ring.color ?? 'default']}\n                strokeWidth={config.strokeWidth}\n                strokeLinecap=\"round\"\n                strokeDasharray={circumference}\n                initial={{ strokeDashoffset: circumference }}\n                animate={{ strokeDashoffset: offset }}\n                transition={prefersReducedMotion ? { duration: 0 } : springs.smooth}\n                transform={`rotate(-90 ${center} ${center})`}\n              />\n            </React.Fragment>\n          )\n        })}\n      </svg>\n    )\n  },\n)\nMultiProgressRing.displayName = 'MultiProgressRing'\n\nexport { MultiProgressRing,ProgressRing }\n"],"mappings":"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"}

package/dist/ui/progress.d.ts

@@ -1,7 +1,7 @@
 "use client";
 import { VariantProps } from 'class-variance-authority';
-import * as React from 'react';
 import * as ProgressPrimitive from '../primitives/react-progress';
+import * as React from 'react';
 declare const progressTrackVariants: (props?: ({
     size?: "sm" | "md" | "lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
@@ -47,6 +47,6 @@ interface ProgressProps extends Omit<React.ComponentPropsWithoutRef<typeof Progr
     autoColor?: boolean;
 }
 declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<HTMLDivElement>>;
-export { Progress, progressTrackVariants, progressIndicatorVariants };
+export { Progress, progressIndicatorVariants, progressTrackVariants };
 export type { ProgressProps };
 //# sourceMappingURL=progress.d.ts.map

package/dist/ui/progress.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../src/ui/progress.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,iBAAiB,MAAM,4BAA4B,CAAA;AAE/D,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AASjE,QAAA,MAAM,qBAAqB;;8EAY1B,CAAA;AAED,QAAA,MAAM,yBAAyB;;8EAa9B,CAAA;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,UAAU,aACR,SAAQ,IAAI,CACR,KAAK,CAAC,wBAAwB,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,EAC7D,OAAO,CACR,EACD,YAAY,CAAC,OAAO,qBAAqB,CAAC,EAC1C,YAAY,CAAC,OAAO,yBAAyB,CAAC;IAChD,uDAAuD;IACvD,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,4DAA4D;IAC5D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,sIAAsI;IACtI,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAMD,QAAA,MAAM,QAAQ,sFAwEb,CAAA;AAGD,OAAO,EAAE,QAAQ,EAAE,qBAAqB,EAAE,yBAAyB,EAAE,CAAA;AACrE,YAAY,EAAE,aAAa,EAAE,CAAA"}
+{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../src/ui/progress.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,iBAAiB,MAAM,4BAA4B,CAAA;AAC/D,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAS9B,QAAA,MAAM,qBAAqB;;8EAY1B,CAAA;AAED,QAAA,MAAM,yBAAyB;;8EAa9B,CAAA;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,UAAU,aACR,SAAQ,IAAI,CACR,KAAK,CAAC,wBAAwB,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,EAC7D,OAAO,CACR,EACD,YAAY,CAAC,OAAO,qBAAqB,CAAC,EAC1C,YAAY,CAAC,OAAO,yBAAyB,CAAC;IAChD,uDAAuD;IACvD,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,4DAA4D;IAC5D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,sIAAsI;IACtI,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAMD,QAAA,MAAM,QAAQ,sFAwEb,CAAA;AAGD,OAAO,EAAE,QAAQ,EAAE,yBAAyB,EAAC,qBAAqB,EAAE,CAAA;AACpE,YAAY,EAAE,aAAa,EAAE,CAAA"}

package/dist/ui/progress.js

@@ -1,20 +1,20 @@
 "use client";
 import { F as e, P as t } from "../_chunks/primitives.js";
-import { a as n } from "../_chunks/framer.js";
-import { springs as r } from "./lib/motion.js";
-import { t as i } from "../_chunks/vendor-utils.js";
-import { cn as a } from "./lib/utils.js";
-import * as o from "react";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { springs as n } from "./lib/motion.js";
+import { t as r } from "../_chunks/vendor-utils.js";
+import { cn as i } from "./lib/utils.js";
+import * as a from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { motion as c } from "framer-motion";
 //#region src/ui/progress.tsx
-var l = i("relative w-full overflow-hidden rounded-ds-full bg-surface-raised", {
+var l = r("relative w-full overflow-hidden rounded-ds-full bg-surface-raised", {
 	variants: { size: {
 		sm: "h-1",
 		md: "h-2",
 		lg: "h-3"
 	} },
 	defaultVariants: { size: "md" }
-}), u = i("h-full w-full flex-1 transition-[width] duration-moderate-02 ease-expressive-standard", {
+}), u = r("h-full w-full flex-1 transition-[width] duration-moderate-02 ease-expressive-standard", {
 	variants: { color: {
 		default: "bg-accent-9",
 		success: "bg-success-9",
@@ -22,28 +22,28 @@ var l = i("relative w-full overflow-hidden rounded-ds-full bg-surface-raised", {
 		error: "bg-error-9"
 	} },
 	defaultVariants: { color: "default" }
-}), d = o.forwardRef(({ className: i, value: o, size: d, color: f, indicatorClassName: p, showLabel: m, autoColor: h, ...g }, _) => {
-	let v = o == null, y = h && o != null ? o > 100 ? "error" : o >= 85 ? "success" : o >= 60 ? "warning" : "default" : f;
-	return /* @__PURE__ */ c("div", {
-		className: a("flex items-center gap-ds-03", m && "w-full"),
-		children: [/* @__PURE__ */ s(e, {
+}), d = a.forwardRef(({ className: r, value: a, size: d, color: f, indicatorClassName: p, showLabel: m, autoColor: h, ...g }, _) => {
+	let v = a == null, y = h && a != null ? a > 100 ? "error" : a >= 85 ? "success" : a >= 60 ? "warning" : "default" : f;
+	return /* @__PURE__ */ s("div", {
+		className: i("flex items-center gap-ds-03", m && "w-full"),
+		children: [/* @__PURE__ */ o(e, {
 			ref: _,
-			value: v ? null : o,
-			className: a(l({ size: d }), i),
+			value: v ? null : a,
+			className: i(l({ size: d }), r),
 			...g,
-			children: v ? /* @__PURE__ */ s(t, { className: a(u({ color: y }), "w-2/5 animate-progress-indeterminate motion-reduce:animate-none", p) }) : /* @__PURE__ */ s(t, {
-				className: a("h-full", p),
+			children: v ? /* @__PURE__ */ o(t, { className: i(u({ color: y }), "w-2/5 animate-progress-indeterminate motion-reduce:animate-none", p) }) : /* @__PURE__ */ o(t, {
+				className: i("h-full", p),
 				asChild: !0,
-				children: /* @__PURE__ */ s(n.div, {
-					className: a(u({ color: y }), "transition-colors duration-moderate-01 ease-productive-standard"),
+				children: /* @__PURE__ */ o(c.div, {
+					className: i(u({ color: y }), "transition-colors duration-moderate-01 ease-productive-standard"),
 					initial: !1,
-					animate: { width: `${o || 0}%` },
-					transition: r.smooth
+					animate: { width: `${a || 0}%` },
+					transition: n.smooth
 				})
 			})
-		}), m && !v && /* @__PURE__ */ c("span", {
+		}), m && !v && /* @__PURE__ */ s("span", {
 			className: "shrink-0 text-ds-xs text-surface-fg-muted tabular-nums",
-			children: [o, "%"]
+			children: [a, "%"]
 		})]
 	});
 });

package/dist/ui/progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress.js","names":[],"sources":["../../src/ui/progress.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as ProgressPrimitive from '@primitives/react-progress'\nimport { motion } from 'framer-motion'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from './lib/utils'\nimport { springs } from './lib/motion'\n\n/* ---------------------------------------------------------------------------\n * CVA Variants\n * ------------------------------------------------------------------------ */\n\nconst progressTrackVariants = cva(\n  'relative w-full overflow-hidden rounded-ds-full bg-surface-raised',\n  {\n    variants: {\n      size: {\n        sm: 'h-1',\n        md: 'h-2',\n        lg: 'h-3',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n)\n\nconst progressIndicatorVariants = cva(\n  'h-full w-full flex-1 transition-[width] duration-moderate-02 ease-expressive-standard',\n  {\n    variants: {\n      color: {\n        default: 'bg-accent-9',\n        success: 'bg-success-9',\n        warning: 'bg-warning-9',\n        error: 'bg-error-9',\n      },\n    },\n    defaultVariants: { color: 'default' },\n  },\n)\n\n/* ---------------------------------------------------------------------------\n * Types\n * ------------------------------------------------------------------------ */\n\n/**\n * Props for Progress — a horizontal progress bar with size and color variants, an optional\n * percentage label, and an indeterminate animation when `value` is undefined/null.\n *\n * **Track size:** `sm` (4px) | `md` (8px, default) | `lg` (12px)\n *\n * **Indicator color:** `default` (brand interactive) | `success` | `warning` | `error`\n *\n * **Indeterminate:** Omit `value` (or pass `undefined`) to show an animated indeterminate bar.\n * When `value` is provided, it should be a number between 0–100.\n *\n * **`showLabel`:** Renders the percentage value next to the bar (only when `value` is set).\n *\n * @example\n * // Determinate upload progress:\n * <Progress value={uploadPercent} color=\"default\" showLabel />\n *\n * @example\n * // Indeterminate loading bar (while waiting for an async operation):\n * <Progress size=\"sm\" />\n *\n * @example\n * // Success-colored completion bar (e.g. after all tasks done):\n * <Progress value={100} color=\"success\" size=\"md\" />\n *\n * @example\n * // Warning threshold indicator (disk usage at 80%):\n * <Progress value={80} color=\"warning\" showLabel size=\"lg\" />\n * // These are just a few ways — feel free to combine props creatively!\n */\ninterface ProgressProps\n  extends Omit<\n      React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>,\n      'color'\n    >,\n    VariantProps<typeof progressTrackVariants>,\n    VariantProps<typeof progressIndicatorVariants> {\n  /** Additional class names for the indicator element */\n  indicatorClassName?: string\n  /** Display the percentage label next to the progress bar */\n  showLabel?: boolean\n  /** When true, color auto-shifts by value: 0-59 = default (accent), 60-84 = warning, 85-100 = success, >100 = error. @default false */\n  autoColor?: boolean\n}\n\n/* ---------------------------------------------------------------------------\n * Component\n * ------------------------------------------------------------------------ */\n\nconst Progress = React.forwardRef<\n  React.ElementRef<typeof ProgressPrimitive.Root>,\n  ProgressProps\n>(\n  (\n    {\n      className,\n      value,\n      size,\n      color,\n      indicatorClassName,\n      showLabel,\n      autoColor,\n      ...props\n    },\n    ref,\n  ) => {\n    const isIndeterminate = value === undefined || value === null\n\n    const effectiveColor =\n      autoColor && value != null\n        ? value > 100\n          ? 'error'\n          : value >= 85\n            ? 'success'\n            : value >= 60\n              ? 'warning'\n              : 'default'\n        : color\n\n    return (\n      <div className={cn('flex items-center gap-ds-03', showLabel && 'w-full')}>\n        <ProgressPrimitive.Root\n          ref={ref}\n          value={isIndeterminate ? null : value}\n          className={cn(progressTrackVariants({ size }), className)}\n          {...props}\n        >\n          {isIndeterminate ? (\n            <ProgressPrimitive.Indicator\n              className={cn(\n                progressIndicatorVariants({ color: effectiveColor }),\n                'w-2/5 animate-progress-indeterminate motion-reduce:animate-none',\n                indicatorClassName,\n              )}\n            />\n          ) : (\n            <ProgressPrimitive.Indicator\n              className={cn('h-full', indicatorClassName)}\n              asChild\n            >\n              <motion.div\n                className={cn(\n                  progressIndicatorVariants({ color: effectiveColor }),\n                  'transition-colors duration-moderate-01 ease-productive-standard',\n                )}\n                initial={false}\n                animate={{ width: `${value || 0}%` }}\n                transition={springs.smooth}\n              />\n            </ProgressPrimitive.Indicator>\n          )}\n        </ProgressPrimitive.Root>\n\n        {showLabel && !isIndeterminate && (\n          <span className=\"shrink-0 text-ds-xs text-surface-fg-muted tabular-nums\">\n            {value}%\n          </span>\n        )}\n      </div>\n    )\n  },\n)\nProgress.displayName = ProgressPrimitive.Root.displayName\n\nexport { Progress, progressTrackVariants, progressIndicatorVariants }\nexport type { ProgressProps }\n"],"mappings":";;;;;;;;;AAcA,IAAM,IAAwB,EAC5B,qEACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,EACF;CACD,iBAAiB,EAAE,MAAM,MAAM;CAChC,CACF,EAEK,IAA4B,EAChC,yFACA;CACE,UAAU,EACR,OAAO;EACL,SAAS;EACT,SAAS;EACT,SAAS;EACT,OAAO;EACR,EACF;CACD,iBAAiB,EAAE,OAAO,WAAW;CACtC,CACF,EAuDK,IAAW,EAAM,YAKnB,EACE,cACA,UACA,SACA,UACA,uBACA,cACA,cACA,GAAG,KAEL,MACG;CACH,IAAM,IAAkB,KAAiC,MAEnD,IACJ,KAAa,KAAS,OAClB,IAAQ,MACN,UACA,KAAS,KACP,YACA,KAAS,KACP,YACA,YACN;AAEN,QACE,kBAAC,OAAD;EAAK,WAAW,EAAG,+BAA+B,KAAa,SAAS;YAAxE,CACE,kBAAC,GAAD;GACO;GACL,OAAO,IAAkB,OAAO;GAChC,WAAW,EAAG,EAAsB,EAAE,SAAM,CAAC,EAAE,EAAU;GACzD,GAAI;aAEH,IACC,kBAAC,GAAD,EACE,WAAW,EACT,EAA0B,EAAE,OAAO,GAAgB,CAAC,EACpD,mEACA,EACD,EACD,CAAA,GAEF,kBAAC,GAAD;IACE,WAAW,EAAG,UAAU,EAAmB;IAC3C,SAAA;cAEA,kBAAC,EAAO,KAAR;KACE,WAAW,EACT,EAA0B,EAAE,OAAO,GAAgB,CAAC,EACpD,kEACD;KACD,SAAS;KACT,SAAS,EAAE,OAAO,GAAG,KAAS,EAAE,IAAI;KACpC,YAAY,EAAQ;KACpB,CAAA;IAC0B,CAAA;GAET,CAAA,EAExB,KAAa,CAAC,KACb,kBAAC,QAAD;GAAM,WAAU;aAAhB,CACG,GAAM,IACF;KAEL;;EAGX;AACD,EAAS,cAAA,EAAqC"}
+{"version":3,"file":"progress.js","names":[],"sources":["../../src/ui/progress.tsx"],"sourcesContent":["'use client'\n\nimport * as ProgressPrimitive from '@primitives/react-progress'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { springs } from './lib/motion'\nimport { cn } from './lib/utils'\n\n/* ---------------------------------------------------------------------------\n * CVA Variants\n * ------------------------------------------------------------------------ */\n\nconst progressTrackVariants = cva(\n  'relative w-full overflow-hidden rounded-ds-full bg-surface-raised',\n  {\n    variants: {\n      size: {\n        sm: 'h-1',\n        md: 'h-2',\n        lg: 'h-3',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n)\n\nconst progressIndicatorVariants = cva(\n  'h-full w-full flex-1 transition-[width] duration-moderate-02 ease-expressive-standard',\n  {\n    variants: {\n      color: {\n        default: 'bg-accent-9',\n        success: 'bg-success-9',\n        warning: 'bg-warning-9',\n        error: 'bg-error-9',\n      },\n    },\n    defaultVariants: { color: 'default' },\n  },\n)\n\n/* ---------------------------------------------------------------------------\n * Types\n * ------------------------------------------------------------------------ */\n\n/**\n * Props for Progress — a horizontal progress bar with size and color variants, an optional\n * percentage label, and an indeterminate animation when `value` is undefined/null.\n *\n * **Track size:** `sm` (4px) | `md` (8px, default) | `lg` (12px)\n *\n * **Indicator color:** `default` (brand interactive) | `success` | `warning` | `error`\n *\n * **Indeterminate:** Omit `value` (or pass `undefined`) to show an animated indeterminate bar.\n * When `value` is provided, it should be a number between 0–100.\n *\n * **`showLabel`:** Renders the percentage value next to the bar (only when `value` is set).\n *\n * @example\n * // Determinate upload progress:\n * <Progress value={uploadPercent} color=\"default\" showLabel />\n *\n * @example\n * // Indeterminate loading bar (while waiting for an async operation):\n * <Progress size=\"sm\" />\n *\n * @example\n * // Success-colored completion bar (e.g. after all tasks done):\n * <Progress value={100} color=\"success\" size=\"md\" />\n *\n * @example\n * // Warning threshold indicator (disk usage at 80%):\n * <Progress value={80} color=\"warning\" showLabel size=\"lg\" />\n * // These are just a few ways — feel free to combine props creatively!\n */\ninterface ProgressProps\n  extends Omit<\n      React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>,\n      'color'\n    >,\n    VariantProps<typeof progressTrackVariants>,\n    VariantProps<typeof progressIndicatorVariants> {\n  /** Additional class names for the indicator element */\n  indicatorClassName?: string\n  /** Display the percentage label next to the progress bar */\n  showLabel?: boolean\n  /** When true, color auto-shifts by value: 0-59 = default (accent), 60-84 = warning, 85-100 = success, >100 = error. @default false */\n  autoColor?: boolean\n}\n\n/* ---------------------------------------------------------------------------\n * Component\n * ------------------------------------------------------------------------ */\n\nconst Progress = React.forwardRef<\n  React.ElementRef<typeof ProgressPrimitive.Root>,\n  ProgressProps\n>(\n  (\n    {\n      className,\n      value,\n      size,\n      color,\n      indicatorClassName,\n      showLabel,\n      autoColor,\n      ...props\n    },\n    ref,\n  ) => {\n    const isIndeterminate = value === undefined || value === null\n\n    const effectiveColor =\n      autoColor && value != null\n        ? value > 100\n          ? 'error'\n          : value >= 85\n            ? 'success'\n            : value >= 60\n              ? 'warning'\n              : 'default'\n        : color\n\n    return (\n      <div className={cn('flex items-center gap-ds-03', showLabel && 'w-full')}>\n        <ProgressPrimitive.Root\n          ref={ref}\n          value={isIndeterminate ? null : value}\n          className={cn(progressTrackVariants({ size }), className)}\n          {...props}\n        >\n          {isIndeterminate ? (\n            <ProgressPrimitive.Indicator\n              className={cn(\n                progressIndicatorVariants({ color: effectiveColor }),\n                'w-2/5 animate-progress-indeterminate motion-reduce:animate-none',\n                indicatorClassName,\n              )}\n            />\n          ) : (\n            <ProgressPrimitive.Indicator\n              className={cn('h-full', indicatorClassName)}\n              asChild\n            >\n              <motion.div\n                className={cn(\n                  progressIndicatorVariants({ color: effectiveColor }),\n                  'transition-colors duration-moderate-01 ease-productive-standard',\n                )}\n                initial={false}\n                animate={{ width: `${value || 0}%` }}\n                transition={springs.smooth}\n              />\n            </ProgressPrimitive.Indicator>\n          )}\n        </ProgressPrimitive.Root>\n\n        {showLabel && !isIndeterminate && (\n          <span className=\"shrink-0 text-ds-xs text-surface-fg-muted tabular-nums\">\n            {value}%\n          </span>\n        )}\n      </div>\n    )\n  },\n)\nProgress.displayName = ProgressPrimitive.Root.displayName\n\nexport { Progress, progressIndicatorVariants,progressTrackVariants }\nexport type { ProgressProps }\n"],"mappings":";;;;;;;;;AAcA,IAAM,IAAwB,EAC5B,qEACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,EACF;CACD,iBAAiB,EAAE,MAAM,MAAM;CAChC,CACF,EAEK,IAA4B,EAChC,yFACA;CACE,UAAU,EACR,OAAO;EACL,SAAS;EACT,SAAS;EACT,SAAS;EACT,OAAO;EACR,EACF;CACD,iBAAiB,EAAE,OAAO,WAAW;CACtC,CACF,EAuDK,IAAW,EAAM,YAKnB,EACE,cACA,UACA,SACA,UACA,uBACA,cACA,cACA,GAAG,KAEL,MACG;CACH,IAAM,IAAkB,KAAiC,MAEnD,IACJ,KAAa,KAAS,OAClB,IAAQ,MACN,UACA,KAAS,KACP,YACA,KAAS,KACP,YACA,YACN;AAEN,QACE,kBAAC,OAAD;EAAK,WAAW,EAAG,+BAA+B,KAAa,SAAS;YAAxE,CACE,kBAAC,GAAD;GACO;GACL,OAAO,IAAkB,OAAO;GAChC,WAAW,EAAG,EAAsB,EAAE,SAAM,CAAC,EAAE,EAAU;GACzD,GAAI;aAEH,IACC,kBAAC,GAAD,EACE,WAAW,EACT,EAA0B,EAAE,OAAO,GAAgB,CAAC,EACpD,mEACA,EACD,EACD,CAAA,GAEF,kBAAC,GAAD;IACE,WAAW,EAAG,UAAU,EAAmB;IAC3C,SAAA;cAEA,kBAAC,EAAO,KAAR;KACE,WAAW,EACT,EAA0B,EAAE,OAAO,GAAgB,CAAC,EACpD,kEACD;KACD,SAAS;KACT,SAAS,EAAE,OAAO,GAAG,KAAS,EAAE,IAAI;KACpC,YAAY,EAAQ;KACpB,CAAA;IAC0B,CAAA;GAET,CAAA,EAExB,KAAa,CAAC,KACb,kBAAC,QAAD;GAAM,WAAU;aAAhB,CACG,GAAM,IACF;KAEL;;EAGX;AACD,EAAS,cAAA,EAAqC"}

package/dist/ui/radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../src/ui/radio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,mBAAmB,MAAM,+BAA+B,CAAA;AAGpE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,QAAA,MAAM,UAAU,+JAmBd,CAAA;AAGF,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC;IAC1G,qFAAqF;IACrF,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC1B;AAcD,QAAA,MAAM,cAAc,+FAgClB,CAAA;AAGF,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,CAAA;AAE7F,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../src/ui/radio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,mBAAmB,MAAM,+BAA+B,CAAA;AAGpE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,QAAA,MAAM,UAAU,+JAmBd,CAAA;AAGF,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC;IAC1G,qFAAqF;IACrF,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC1B;AAcD,QAAA,MAAM,cAAc,+FAgClB,CAAA;AAGF,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,CAAA;AAE7F,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAA"}

package/dist/ui/radio.js

@@ -1,18 +1,18 @@
 "use client";
 import { ct as e, ot as t, st as n } from "../_chunks/primitives.js";
-import { a as r } from "../_chunks/framer.js";
-import { springs as i } from "./lib/motion.js";
-import { cn as a } from "./lib/utils.js";
-import { useFormField as o } from "./form.js";
-import * as s from "react";
-import { jsx as c } from "react/jsx-runtime";
-import { IconCircle as l } from "@tabler/icons-react";
+import { springs as r } from "./lib/motion.js";
+import { cn as i } from "./lib/utils.js";
+import { useFormField as a } from "./form.js";
+import * as o from "react";
+import { jsx as s } from "react/jsx-runtime";
+import { IconCircle as c } from "@tabler/icons-react";
+import { motion as l } from "framer-motion";
 //#region src/ui/radio.tsx
-var u = s.forwardRef(({ className: t, ...n }, r) => {
-	let i = o(), s = i.state === "error", l = n["aria-describedby"] ?? i.helperTextId, u = n["aria-required"] ?? i.required;
-	return /* @__PURE__ */ c(e, {
-		className: a("grid gap-ds-03", t),
-		"aria-invalid": s || void 0,
+var u = o.forwardRef(({ className: t, ...n }, r) => {
+	let o = a(), c = o.state === "error", l = n["aria-describedby"] ?? o.helperTextId, u = n["aria-required"] ?? o.required;
+	return /* @__PURE__ */ s(e, {
+		className: i("grid gap-ds-03", t),
+		"aria-invalid": c || void 0,
 		"aria-describedby": l,
 		"aria-required": u || void 0,
 		...n,
@@ -28,19 +28,19 @@ var d = {
 	sm: "h-1.5 w-1.5",
 	md: "h-ds-03 w-ds-03",
 	lg: "h-2.5 w-2.5"
-}, p = s.forwardRef(({ className: e, size: o = "md", ...s }, u) => /* @__PURE__ */ c(n, {
+}, p = o.forwardRef(({ className: e, size: a = "md", ...o }, u) => /* @__PURE__ */ s(n, {
 	ref: u,
-	className: a("touch-target aspect-square rounded-ds-full", d[o], "border border-surface-border-strong bg-surface-raised-hover", "transition-colors duration-fast-01", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", "disabled:cursor-not-allowed disabled:opacity-action-disabled", "hover:border-accent-7 hover:bg-surface-raised-active", "data-[state=checked]:border-accent-7", e),
-	...s,
-	children: /* @__PURE__ */ c(t, {
+	className: i("touch-target aspect-square rounded-ds-full", d[a], "border border-surface-border-strong bg-surface-raised-hover", "transition-colors duration-fast-01", "focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2", "disabled:cursor-not-allowed disabled:opacity-action-disabled", "hover:border-accent-7 hover:bg-surface-raised-active", "data-[state=checked]:border-accent-7", e),
+	...o,
+	children: /* @__PURE__ */ s(t, {
 		asChild: !0,
 		className: "flex items-center justify-center",
-		children: /* @__PURE__ */ c(r.span, {
+		children: /* @__PURE__ */ s(l.span, {
 			className: "flex items-center justify-center",
 			initial: { scale: 0 },
 			animate: { scale: 1 },
-			transition: i.bouncy,
-			children: /* @__PURE__ */ c(l, { className: a(f[o], "fill-accent-9 text-accent-11") })
+			transition: r.bouncy,
+			children: /* @__PURE__ */ s(c, { className: i(f[a], "fill-accent-9 text-accent-11") })
 		})
 	})
 }));

package/dist/ui/radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio.js","names":[],"sources":["../../src/ui/radio.tsx"],"sourcesContent":["'use client'\n\nimport * as RadioGroupPrimitive from '@primitives/react-radio-group'\nimport { IconCircle } from '@tabler/icons-react'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport * as React from 'react'\nimport { springs } from './lib/motion'\nimport { cn } from './lib/utils'\nimport { useFormField } from './form'\n\nconst RadioGroup = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>\n>(({ className, ...props }, ref) => {\n  const fieldCtx = useFormField()\n  const isError = fieldCtx.state === 'error'\n  const ariaDescribedBy = props['aria-describedby'] ?? fieldCtx.helperTextId\n  const ariaRequired = props['aria-required'] ?? fieldCtx.required\n\n  return (\n    <RadioGroupPrimitive.Root\n      className={cn('grid gap-ds-03', className)}\n      aria-invalid={isError || undefined}\n      aria-describedby={ariaDescribedBy}\n      aria-required={ariaRequired || undefined}\n      {...props}\n      ref={ref}\n    />\n  )\n})\nRadioGroup.displayName = RadioGroupPrimitive.Root.displayName\n\nexport interface RadioGroupItemProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item> {\n  /** Control size — `sm` (20px), `md` (24px, default, WCAG compliant), `lg` (28px). */\n  size?: 'sm' | 'md' | 'lg'\n}\n\nconst radioSizeClasses = {\n  sm: 'h-5 w-5',\n  md: 'h-6 w-6',\n  lg: 'h-7 w-7',\n} as const\n\nconst radioIndicatorClasses = {\n  sm: 'h-1.5 w-1.5',\n  md: 'h-ds-03 w-ds-03',\n  lg: 'h-2.5 w-2.5',\n} as const\n\nconst RadioGroupItem = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Item>,\n  RadioGroupItemProps\n>(({ className, size = 'md', ...props }, ref) => {\n  return (\n    <RadioGroupPrimitive.Item\n      ref={ref}\n      className={cn(\n        'touch-target aspect-square rounded-ds-full',\n        radioSizeClasses[size],\n        'border border-surface-border-strong bg-surface-raised-hover',\n        'transition-colors duration-fast-01',\n        'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n        'disabled:cursor-not-allowed disabled:opacity-action-disabled',\n        'hover:border-accent-7 hover:bg-surface-raised-active',\n        'data-[state=checked]:border-accent-7',\n        className,\n      )}\n      {...props}\n    >\n      <RadioGroupPrimitive.Indicator asChild className=\"flex items-center justify-center\">\n        <motion.span\n          className=\"flex items-center justify-center\"\n          initial={{ scale: 0 }}\n          animate={{ scale: 1 }}\n          transition={springs.bouncy}\n        >\n          <IconCircle className={cn(radioIndicatorClasses[size], 'fill-accent-9 text-accent-11')} />\n        </motion.span>\n      </RadioGroupPrimitive.Indicator>\n    </RadioGroupPrimitive.Item>\n  )\n})\nRadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName\n\nexport type RadioGroupProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>\n\nexport { RadioGroup, RadioGroupItem }\n"],"mappings":";;;;;;;;;;AAUA,IAAM,IAAa,EAAM,YAGtB,EAAE,cAAW,GAAG,KAAS,MAAQ;CAClC,IAAM,IAAW,GAAc,EACzB,IAAU,EAAS,UAAU,SAC7B,IAAkB,EAAM,uBAAuB,EAAS,cACxD,IAAe,EAAM,oBAAoB,EAAS;AAExD,QACE,kBAAC,GAAD;EACE,WAAW,EAAG,kBAAkB,EAAU;EAC1C,gBAAc,KAAW,KAAA;EACzB,oBAAkB;EAClB,iBAAe,KAAgB,KAAA;EAC/B,GAAI;EACC;EACL,CAAA;EAEJ;AACF,EAAW,cAAA,EAAuC;AAOlD,IAAM,IAAmB;CACvB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEK,IAAwB;CAC5B,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEK,IAAiB,EAAM,YAG1B,EAAE,cAAW,UAAO,MAAM,GAAG,KAAS,MAErC,kBAAC,GAAD;CACO;CACL,WAAW,EACT,8CACA,EAAiB,IACjB,+DACA,sCACA,6GACA,gEACA,wDACA,wCACA,EACD;CACD,GAAI;WAEJ,kBAAC,GAAD;EAA+B,SAAA;EAAQ,WAAU;YAC/C,kBAAC,EAAO,MAAR;GACE,WAAU;GACV,SAAS,EAAE,OAAO,GAAG;GACrB,SAAS,EAAE,OAAO,GAAG;GACrB,YAAY,EAAQ;aAEpB,kBAAC,GAAD,EAAY,WAAW,EAAG,EAAsB,IAAO,+BAA+B,EAAI,CAAA;GAC9E,CAAA;EACgB,CAAA;CACP,CAAA,CAE7B;AACF,EAAe,cAAA,EAAuC"}
+{"version":3,"file":"radio.js","names":[],"sources":["../../src/ui/radio.tsx"],"sourcesContent":["'use client'\n\nimport * as RadioGroupPrimitive from '@primitives/react-radio-group'\nimport { IconCircle } from '@tabler/icons-react'\nimport { AnimatePresence, motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useFormField } from './form'\nimport { springs } from './lib/motion'\nimport { cn } from './lib/utils'\n\nconst RadioGroup = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>\n>(({ className, ...props }, ref) => {\n  const fieldCtx = useFormField()\n  const isError = fieldCtx.state === 'error'\n  const ariaDescribedBy = props['aria-describedby'] ?? fieldCtx.helperTextId\n  const ariaRequired = props['aria-required'] ?? fieldCtx.required\n\n  return (\n    <RadioGroupPrimitive.Root\n      className={cn('grid gap-ds-03', className)}\n      aria-invalid={isError || undefined}\n      aria-describedby={ariaDescribedBy}\n      aria-required={ariaRequired || undefined}\n      {...props}\n      ref={ref}\n    />\n  )\n})\nRadioGroup.displayName = RadioGroupPrimitive.Root.displayName\n\nexport interface RadioGroupItemProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item> {\n  /** Control size — `sm` (20px), `md` (24px, default, WCAG compliant), `lg` (28px). */\n  size?: 'sm' | 'md' | 'lg'\n}\n\nconst radioSizeClasses = {\n  sm: 'h-5 w-5',\n  md: 'h-6 w-6',\n  lg: 'h-7 w-7',\n} as const\n\nconst radioIndicatorClasses = {\n  sm: 'h-1.5 w-1.5',\n  md: 'h-ds-03 w-ds-03',\n  lg: 'h-2.5 w-2.5',\n} as const\n\nconst RadioGroupItem = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Item>,\n  RadioGroupItemProps\n>(({ className, size = 'md', ...props }, ref) => {\n  return (\n    <RadioGroupPrimitive.Item\n      ref={ref}\n      className={cn(\n        'touch-target aspect-square rounded-ds-full',\n        radioSizeClasses[size],\n        'border border-surface-border-strong bg-surface-raised-hover',\n        'transition-colors duration-fast-01',\n        'focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2',\n        'disabled:cursor-not-allowed disabled:opacity-action-disabled',\n        'hover:border-accent-7 hover:bg-surface-raised-active',\n        'data-[state=checked]:border-accent-7',\n        className,\n      )}\n      {...props}\n    >\n      <RadioGroupPrimitive.Indicator asChild className=\"flex items-center justify-center\">\n        <motion.span\n          className=\"flex items-center justify-center\"\n          initial={{ scale: 0 }}\n          animate={{ scale: 1 }}\n          transition={springs.bouncy}\n        >\n          <IconCircle className={cn(radioIndicatorClasses[size], 'fill-accent-9 text-accent-11')} />\n        </motion.span>\n      </RadioGroupPrimitive.Indicator>\n    </RadioGroupPrimitive.Item>\n  )\n})\nRadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName\n\nexport type RadioGroupProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>\n\nexport { RadioGroup, RadioGroupItem }\n"],"mappings":";;;;;;;;;;AAWA,IAAM,IAAa,EAAM,YAGtB,EAAE,cAAW,GAAG,KAAS,MAAQ;CAClC,IAAM,IAAW,GAAc,EACzB,IAAU,EAAS,UAAU,SAC7B,IAAkB,EAAM,uBAAuB,EAAS,cACxD,IAAe,EAAM,oBAAoB,EAAS;AAExD,QACE,kBAAC,GAAD;EACE,WAAW,EAAG,kBAAkB,EAAU;EAC1C,gBAAc,KAAW,KAAA;EACzB,oBAAkB;EAClB,iBAAe,KAAgB,KAAA;EAC/B,GAAI;EACC;EACL,CAAA;EAEJ;AACF,EAAW,cAAA,EAAuC;AAOlD,IAAM,IAAmB;CACvB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEK,IAAwB;CAC5B,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEK,IAAiB,EAAM,YAG1B,EAAE,cAAW,UAAO,MAAM,GAAG,KAAS,MAErC,kBAAC,GAAD;CACO;CACL,WAAW,EACT,8CACA,EAAiB,IACjB,+DACA,sCACA,6GACA,gEACA,wDACA,wCACA,EACD;CACD,GAAI;WAEJ,kBAAC,GAAD;EAA+B,SAAA;EAAQ,WAAU;YAC/C,kBAAC,EAAO,MAAR;GACE,WAAU;GACV,SAAS,EAAE,OAAO,GAAG;GACrB,SAAS,EAAE,OAAO,GAAG;GACrB,YAAY,EAAQ;aAEpB,kBAAC,GAAD,EAAY,WAAW,EAAG,EAAsB,IAAO,+BAA+B,EAAI,CAAA;GAC9E,CAAA;EACgB,CAAA;CACP,CAAA,CAE7B;AACF,EAAe,cAAA,EAAuC"}

package/dist/ui/search-input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"search-input.d.ts","sourceRoot":"","sources":["../../src/ui/search-input.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,KAAK,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAEhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IACjG,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,oBAAoB;IACpB,IAAI,CAAC,EAAE,eAAe,CAAA;CACvB;AAED,QAAA,MAAM,WAAW,2FA6ChB,CAAA;AAGD,OAAO,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"search-input.d.ts","sourceRoot":"","sources":["../../src/ui/search-input.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,KAAK,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAEhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IACjG,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,oBAAoB;IACpB,IAAI,CAAC,EAAE,eAAe,CAAA;CACvB;AAED,QAAA,MAAM,WAAW,2FA6ChB,CAAA;AAGD,OAAO,EAAE,WAAW,EAAE,CAAA"}