@fuf-stack/uniform 1.11.3 → 1.13.0

package/dist/Slider/index.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const require_Slider = require('../Slider-DwfyCQDM.cjs');
+const require_Slider = require('../Slider-CK9n0ryX.cjs');
 
 exports.Slider = require_Slider.Slider_default$1;
 exports.default = require_Slider.Slider_default;

package/dist/Slider/index.d.cts

@@ -1,2 +1,2 @@
-import { n as SliderProps, t as Slider } from "../index-DcYFLiul.cjs";
+import { n as SliderProps, t as Slider } from "../index-DMVoX5pj.cjs";
 export { Slider, Slider as default, SliderProps };

package/dist/Slider/index.d.ts

@@ -1,2 +1,2 @@
-import { n as SliderProps, t as Slider } from "../index-DNFUttM8.js";
+import { n as SliderProps, t as Slider } from "../index-DMojDmML.js";
 export { Slider, Slider as default, SliderProps };

package/dist/Slider/index.js

@@ -1,3 +1,3 @@
-import { n as Slider_default, t as Slider_default$1 } from "../Slider-meuLEC2k.js";
+import { n as Slider_default, t as Slider_default$1 } from "../Slider-Cy5vz5as.js";
 
 export { Slider_default as Slider, Slider_default$1 as default };

package/dist/{Slider-DwfyCQDM.cjs → Slider-CK9n0ryX.cjs}

@@ -1,5 +1,5 @@
-const require_FormContext = require('./FormContext-Lw4YL4-B.cjs');
-const require_useUniformField = require('./useUniformField-D6fwSjrH.cjs');
+const require_FormContext = require('./FormContext-CeFKQmVH.cjs');
+const require_useUniformField = require('./useUniformField-CGiibqg4.cjs');
 let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -120,4 +120,4 @@ Object.defineProperty(exports, 'Slider_default$1', {
     return Slider_default$1;
   }
 });
-//# sourceMappingURL=Slider-DwfyCQDM.cjs.map
+//# sourceMappingURL=Slider-CK9n0ryX.cjs.map

package/dist/{Slider-DwfyCQDM.cjs.map → Slider-CK9n0ryX.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"Slider-DwfyCQDM.cjs","names":["useUniformField","VisuallyHidden","HeroUISlider","Slider"],"sources":["../src/Slider/Slider.tsx","../src/Slider/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Slider as HeroUISlider } from '@heroui/slider';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const sliderVariants = tv({\n  slots: {\n    base: 'group',\n    endContent: '',\n    errorMessage: 'ml-1 mt-1',\n    filler: '',\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    labelWrapper: '',\n    mark: '',\n    startContent: '',\n    step: '',\n    thumb: '',\n    track: '',\n    trackWrapper: '',\n    value: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof sliderVariants>;\ntype ClassName = TVClassName<typeof sliderVariants>;\n\nexport interface SliderProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** CSS class name */\n  className?: ClassName;\n  /** input field is disabled */\n  disabled?: boolean;\n  /** Content to display at the end of the slider */\n  endContent?: ReactNode;\n  /** The offset from where the fill should start */\n  fillOffset?: number;\n  /** form field label */\n  label?: string;\n  /** form field name */\n  name: string;\n  /**\n   * Whether to show step dots on the slider\n   * @default false\n   */\n  showSteps?: boolean;\n  /**\n   * The size of the slider\n   * @default \"md\"\n   */\n  size?: 'sm' | 'md' | 'lg';\n  /** Content to display at the start of the slider */\n  startContent?: ReactNode;\n  /**\n   * The step value of the slider\n   * @default 1\n   */\n  step?: number;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /**\n   * The minimum value of the slider\n   * @default 0\n   */\n  minValue?: number;\n  /**\n   * The maximum value of the slider\n   * @default 100\n   */\n  maxValue?: number;\n}\n\n/**\n * Slider component based on [HeroUI Slider](https://www.heroui.com//docs/components/slider)\n */\nconst Slider = ({\n  className = undefined,\n  endContent = undefined,\n  fillOffset = undefined,\n  name,\n  showSteps = false,\n  size = 'md',\n  startContent = undefined,\n  step = 1,\n  minValue = 0,\n  maxValue = 100,\n  ...uniformFieldProps\n}: SliderProps) => {\n  const {\n    ariaLabel,\n    disabled,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    errorMessage,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual slider to forward focus\n  const visualSliderRef = useRef<HTMLDivElement>(null);\n\n  // classNames from slots\n  const variants = sliderVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  // Get the current value, defaulting to minValue if null/undefined\n  const currentValue = field.value != null ? Number(field.value) : minValue;\n\n  return (\n    <div\n      className={classNames.base}\n      data-invalid={invalid}\n      data-required={required}\n      data-testid={testId}\n    >\n      {/* Visually hidden input for form accessibility and focus management */}\n      <VisuallyHidden>\n        <input\n          ref={ref}\n          aria-label={ariaLabel}\n          disabled={disabled}\n          max={maxValue}\n          min={minValue}\n          name={name}\n          onBlur={onBlur}\n          step={step}\n          tabIndex={-1}\n          type=\"range\"\n          value={currentValue}\n          onChange={(e) => {\n            onChange(Number(e.target.value));\n          }}\n          onFocus={() => {\n            // When RHF focuses this hidden input (e.g., on validation error),\n            // forward focus to the visual slider to show focus ring\n            visualSliderRef.current?.focus();\n          }}\n        />\n      </VisuallyHidden>\n      {/* Visual HeroUISlider component */}\n      <HeroUISlider\n        ref={visualSliderRef}\n        aria-label={ariaLabel}\n        color={invalid ? 'danger' : 'primary'}\n        endContent={endContent}\n        fillOffset={fillOffset}\n        isDisabled={disabled}\n        label={label}\n        maxValue={maxValue}\n        minValue={minValue}\n        name={`${name}_slider`}\n        onBlur={onBlur}\n        onChange={onChange}\n        showSteps={showSteps}\n        size={size}\n        startContent={startContent}\n        step={step}\n        value={currentValue}\n        classNames={{\n          endContent: classNames.endContent,\n          filler: classNames.filler,\n          label: classNames.label,\n          labelWrapper: classNames.labelWrapper,\n          mark: classNames.mark,\n          startContent: classNames.startContent,\n          step: classNames.step,\n          thumb: classNames.thumb,\n          track: classNames.track,\n          trackWrapper: classNames.trackWrapper,\n          value: classNames.value,\n        }}\n      />\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default Slider;\n","import Slider from './Slider';\n\nexport type { SliderProps } from './Slider';\n\nexport { Slider };\n\nexport default Slider;\n"],"mappings":";;;;;;;;;AAYA,MAAa,gDAAoB,EAC/B,OAAO;CACL,MAAM;CACN,YAAY;CACZ,cAAc;CACd,QAAQ;CAGR,OACE;CACF,cAAc;CACd,MAAM;CACN,cAAc;CACd,MAAM;CACN,OAAO;CACP,OAAO;CACP,cAAc;CACd,OAAO;CACR,EACF,CAAC;;;;AAsDF,MAAM,UAAU,EACd,YAAY,QACZ,aAAa,QACb,aAAa,QACb,MACA,YAAY,OACZ,OAAO,MACP,eAAe,QACf,OAAO,GACP,WAAW,GACX,WAAW,KACX,GAAG,wBACc;CACjB,MAAM,EACJ,WACA,UACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,cACA,WACEA,wCAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,oCAAyC,KAAK;CAIpD,MAAM,8DADW,gBAAgB,EACiB,WAAW,OAAO;CAGpE,MAAM,eAAe,MAAM,SAAS,OAAO,OAAO,MAAM,MAAM,GAAG;AAEjE,QACE,4CAAC;EACC,WAAW,WAAW;EACtB,gBAAc;EACd,iBAAe;EACf,eAAa;;GAGb,2CAACC,wDACC,2CAAC;IACM;IACL,cAAY;IACF;IACV,KAAK;IACL,KAAK;IACC;IACE;IACF;IACN,UAAU;IACV,MAAK;IACL,OAAO;IACP,WAAW,MAAM;AACf,cAAS,OAAO,EAAE,OAAO,MAAM,CAAC;;IAElC,eAAe;AAGb,qBAAgB,SAAS,OAAO;;KAElC,GACa;GAEjB,2CAACC;IACC,KAAK;IACL,cAAY;IACZ,OAAO,UAAU,WAAW;IAChB;IACA;IACZ,YAAY;IACL;IACG;IACA;IACV,MAAM,GAAG,KAAK;IACN;IACE;IACC;IACL;IACQ;IACR;IACN,OAAO;IACP,YAAY;KACV,YAAY,WAAW;KACvB,QAAQ,WAAW;KACnB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,OAAO,WAAW;KAClB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,OAAO,WAAW;KACnB;KACD;GACD,UACC,2CAAC;IACC,GAAI,uBAAuB;IAC3B,0CACE,uBAAuB,EAAE,WAEzB,aACD;cAED,2CAAC;KAAI,GAAI,sBAAsB;eAAG;MAAmB;KACjD,GACJ;;GACA;;AAIV,uBAAe;;;;ACzMf,qBAAeC"}
+{"version":3,"file":"Slider-CK9n0ryX.cjs","names":["useUniformField","VisuallyHidden","HeroUISlider","Slider"],"sources":["../src/Slider/Slider.tsx","../src/Slider/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Slider as HeroUISlider } from '@heroui/slider';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const sliderVariants = tv({\n  slots: {\n    base: 'group',\n    endContent: '',\n    errorMessage: 'ml-1 mt-1',\n    filler: '',\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    labelWrapper: '',\n    mark: '',\n    startContent: '',\n    step: '',\n    thumb: '',\n    track: '',\n    trackWrapper: '',\n    value: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof sliderVariants>;\ntype ClassName = TVClassName<typeof sliderVariants>;\n\nexport interface SliderProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** CSS class name */\n  className?: ClassName;\n  /** input field is disabled */\n  disabled?: boolean;\n  /** Content to display at the end of the slider */\n  endContent?: ReactNode;\n  /** The offset from where the fill should start */\n  fillOffset?: number;\n  /** form field label */\n  label?: string;\n  /** form field name */\n  name: string;\n  /**\n   * Whether to show step dots on the slider\n   * @default false\n   */\n  showSteps?: boolean;\n  /**\n   * The size of the slider\n   * @default \"md\"\n   */\n  size?: 'sm' | 'md' | 'lg';\n  /** Content to display at the start of the slider */\n  startContent?: ReactNode;\n  /**\n   * The step value of the slider\n   * @default 1\n   */\n  step?: number;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /**\n   * The minimum value of the slider\n   * @default 0\n   */\n  minValue?: number;\n  /**\n   * The maximum value of the slider\n   * @default 100\n   */\n  maxValue?: number;\n}\n\n/**\n * Slider component based on [HeroUI Slider](https://www.heroui.com//docs/components/slider)\n */\nconst Slider = ({\n  className = undefined,\n  endContent = undefined,\n  fillOffset = undefined,\n  name,\n  showSteps = false,\n  size = 'md',\n  startContent = undefined,\n  step = 1,\n  minValue = 0,\n  maxValue = 100,\n  ...uniformFieldProps\n}: SliderProps) => {\n  const {\n    ariaLabel,\n    disabled,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    errorMessage,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual slider to forward focus\n  const visualSliderRef = useRef<HTMLDivElement>(null);\n\n  // classNames from slots\n  const variants = sliderVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  // Get the current value, defaulting to minValue if null/undefined\n  const currentValue = field.value != null ? Number(field.value) : minValue;\n\n  return (\n    <div\n      className={classNames.base}\n      data-invalid={invalid}\n      data-required={required}\n      data-testid={testId}\n    >\n      {/* Visually hidden input for form accessibility and focus management */}\n      <VisuallyHidden>\n        <input\n          ref={ref}\n          aria-label={ariaLabel}\n          disabled={disabled}\n          max={maxValue}\n          min={minValue}\n          name={name}\n          onBlur={onBlur}\n          step={step}\n          tabIndex={-1}\n          type=\"range\"\n          value={currentValue}\n          onChange={(e) => {\n            onChange(Number(e.target.value));\n          }}\n          onFocus={() => {\n            // When RHF focuses this hidden input (e.g., on validation error),\n            // forward focus to the visual slider to show focus ring\n            visualSliderRef.current?.focus();\n          }}\n        />\n      </VisuallyHidden>\n      {/* Visual HeroUISlider component */}\n      <HeroUISlider\n        ref={visualSliderRef}\n        aria-label={ariaLabel}\n        color={invalid ? 'danger' : 'primary'}\n        endContent={endContent}\n        fillOffset={fillOffset}\n        isDisabled={disabled}\n        label={label}\n        maxValue={maxValue}\n        minValue={minValue}\n        name={`${name}_slider`}\n        onBlur={onBlur}\n        onChange={onChange}\n        showSteps={showSteps}\n        size={size}\n        startContent={startContent}\n        step={step}\n        value={currentValue}\n        classNames={{\n          endContent: classNames.endContent,\n          filler: classNames.filler,\n          label: classNames.label,\n          labelWrapper: classNames.labelWrapper,\n          mark: classNames.mark,\n          startContent: classNames.startContent,\n          step: classNames.step,\n          thumb: classNames.thumb,\n          track: classNames.track,\n          trackWrapper: classNames.trackWrapper,\n          value: classNames.value,\n        }}\n      />\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default Slider;\n","import Slider from './Slider';\n\nexport type { SliderProps } from './Slider';\n\nexport { Slider };\n\nexport default Slider;\n"],"mappings":";;;;;;;;;AAYA,MAAa,gDAAoB,EAC/B,OAAO;CACL,MAAM;CACN,YAAY;CACZ,cAAc;CACd,QAAQ;CAGR,OACE;CACF,cAAc;CACd,MAAM;CACN,cAAc;CACd,MAAM;CACN,OAAO;CACP,OAAO;CACP,cAAc;CACd,OAAO;CACR,EACF,CAAC;;;;AAsDF,MAAM,UAAU,EACd,YAAY,QACZ,aAAa,QACb,aAAa,QACb,MACA,YAAY,OACZ,OAAO,MACP,eAAe,QACf,OAAO,GACP,WAAW,GACX,WAAW,KACX,GAAG,wBACc;CACjB,MAAM,EACJ,WACA,UACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,cACA,WACEA,wCAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,oCAAyC,KAAK;CAIpD,MAAM,8DADW,gBAAgB,EACiB,WAAW,OAAO;CAGpE,MAAM,eAAe,MAAM,SAAS,OAAO,OAAO,MAAM,MAAM,GAAG;AAEjE,QACE,4CAAC;EACC,WAAW,WAAW;EACtB,gBAAc;EACd,iBAAe;EACf,eAAa;;GAGb,2CAACC,wDACC,2CAAC;IACM;IACL,cAAY;IACF;IACV,KAAK;IACL,KAAK;IACC;IACE;IACF;IACN,UAAU;IACV,MAAK;IACL,OAAO;IACP,WAAW,MAAM;AACf,cAAS,OAAO,EAAE,OAAO,MAAM,CAAC;;IAElC,eAAe;AAGb,qBAAgB,SAAS,OAAO;;KAElC,GACa;GAEjB,2CAACC;IACC,KAAK;IACL,cAAY;IACZ,OAAO,UAAU,WAAW;IAChB;IACA;IACZ,YAAY;IACL;IACG;IACA;IACV,MAAM,GAAG,KAAK;IACN;IACE;IACC;IACL;IACQ;IACR;IACN,OAAO;IACP,YAAY;KACV,YAAY,WAAW;KACvB,QAAQ,WAAW;KACnB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,OAAO,WAAW;KAClB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,OAAO,WAAW;KACnB;KACD;GACD,UACC,2CAAC;IACC,GAAI,uBAAuB;IAC3B,0CACE,uBAAuB,EAAE,WAEzB,aACD;cAED,2CAAC;KAAI,GAAI,sBAAsB;eAAG;MAAmB;KACjD,GACJ;;GACA;;AAIV,uBAAe;;;;ACzMf,qBAAeC"}

package/dist/{Slider-meuLEC2k.js → Slider-Cy5vz5as.js}

@@ -1,4 +1,4 @@
-import { t as useUniformField } from "./useUniformField-BKVVns0E.js";
+import { t as useUniformField } from "./useUniformField-D2NgevBI.js";
 import { cn, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
 import { useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -108,4 +108,4 @@ var Slider_default = Slider_default$1;
 
 //#endregion
 export { Slider_default$1 as n, Slider_default as t };
-//# sourceMappingURL=Slider-meuLEC2k.js.map
+//# sourceMappingURL=Slider-Cy5vz5as.js.map

package/dist/{Slider-meuLEC2k.js.map → Slider-Cy5vz5as.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Slider-meuLEC2k.js","names":["Slider","HeroUISlider","Slider"],"sources":["../src/Slider/Slider.tsx","../src/Slider/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Slider as HeroUISlider } from '@heroui/slider';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const sliderVariants = tv({\n  slots: {\n    base: 'group',\n    endContent: '',\n    errorMessage: 'ml-1 mt-1',\n    filler: '',\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    labelWrapper: '',\n    mark: '',\n    startContent: '',\n    step: '',\n    thumb: '',\n    track: '',\n    trackWrapper: '',\n    value: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof sliderVariants>;\ntype ClassName = TVClassName<typeof sliderVariants>;\n\nexport interface SliderProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** CSS class name */\n  className?: ClassName;\n  /** input field is disabled */\n  disabled?: boolean;\n  /** Content to display at the end of the slider */\n  endContent?: ReactNode;\n  /** The offset from where the fill should start */\n  fillOffset?: number;\n  /** form field label */\n  label?: string;\n  /** form field name */\n  name: string;\n  /**\n   * Whether to show step dots on the slider\n   * @default false\n   */\n  showSteps?: boolean;\n  /**\n   * The size of the slider\n   * @default \"md\"\n   */\n  size?: 'sm' | 'md' | 'lg';\n  /** Content to display at the start of the slider */\n  startContent?: ReactNode;\n  /**\n   * The step value of the slider\n   * @default 1\n   */\n  step?: number;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /**\n   * The minimum value of the slider\n   * @default 0\n   */\n  minValue?: number;\n  /**\n   * The maximum value of the slider\n   * @default 100\n   */\n  maxValue?: number;\n}\n\n/**\n * Slider component based on [HeroUI Slider](https://www.heroui.com//docs/components/slider)\n */\nconst Slider = ({\n  className = undefined,\n  endContent = undefined,\n  fillOffset = undefined,\n  name,\n  showSteps = false,\n  size = 'md',\n  startContent = undefined,\n  step = 1,\n  minValue = 0,\n  maxValue = 100,\n  ...uniformFieldProps\n}: SliderProps) => {\n  const {\n    ariaLabel,\n    disabled,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    errorMessage,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual slider to forward focus\n  const visualSliderRef = useRef<HTMLDivElement>(null);\n\n  // classNames from slots\n  const variants = sliderVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  // Get the current value, defaulting to minValue if null/undefined\n  const currentValue = field.value != null ? Number(field.value) : minValue;\n\n  return (\n    <div\n      className={classNames.base}\n      data-invalid={invalid}\n      data-required={required}\n      data-testid={testId}\n    >\n      {/* Visually hidden input for form accessibility and focus management */}\n      <VisuallyHidden>\n        <input\n          ref={ref}\n          aria-label={ariaLabel}\n          disabled={disabled}\n          max={maxValue}\n          min={minValue}\n          name={name}\n          onBlur={onBlur}\n          step={step}\n          tabIndex={-1}\n          type=\"range\"\n          value={currentValue}\n          onChange={(e) => {\n            onChange(Number(e.target.value));\n          }}\n          onFocus={() => {\n            // When RHF focuses this hidden input (e.g., on validation error),\n            // forward focus to the visual slider to show focus ring\n            visualSliderRef.current?.focus();\n          }}\n        />\n      </VisuallyHidden>\n      {/* Visual HeroUISlider component */}\n      <HeroUISlider\n        ref={visualSliderRef}\n        aria-label={ariaLabel}\n        color={invalid ? 'danger' : 'primary'}\n        endContent={endContent}\n        fillOffset={fillOffset}\n        isDisabled={disabled}\n        label={label}\n        maxValue={maxValue}\n        minValue={minValue}\n        name={`${name}_slider`}\n        onBlur={onBlur}\n        onChange={onChange}\n        showSteps={showSteps}\n        size={size}\n        startContent={startContent}\n        step={step}\n        value={currentValue}\n        classNames={{\n          endContent: classNames.endContent,\n          filler: classNames.filler,\n          label: classNames.label,\n          labelWrapper: classNames.labelWrapper,\n          mark: classNames.mark,\n          startContent: classNames.startContent,\n          step: classNames.step,\n          thumb: classNames.thumb,\n          track: classNames.track,\n          trackWrapper: classNames.trackWrapper,\n          value: classNames.value,\n        }}\n      />\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default Slider;\n","import Slider from './Slider';\n\nexport type { SliderProps } from './Slider';\n\nexport { Slider };\n\nexport default Slider;\n"],"mappings":";;;;;;;;AAYA,MAAa,iBAAiB,GAAG,EAC/B,OAAO;CACL,MAAM;CACN,YAAY;CACZ,cAAc;CACd,QAAQ;CAGR,OACE;CACF,cAAc;CACd,MAAM;CACN,cAAc;CACd,MAAM;CACN,OAAO;CACP,OAAO;CACP,cAAc;CACd,OAAO;CACR,EACF,CAAC;;;;AAsDF,MAAMA,YAAU,EACd,YAAY,QACZ,aAAa,QACb,aAAa,QACb,MACA,YAAY,OACZ,OAAO,MACP,eAAe,QACf,OAAO,GACP,WAAW,GACX,WAAW,KACX,GAAG,wBACc;CACjB,MAAM,EACJ,WACA,UACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,cACA,WACE,gBAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,kBAAkB,OAAuB,KAAK;CAIpD,MAAM,aAAa,qBADF,gBAAgB,EACiB,WAAW,OAAO;CAGpE,MAAM,eAAe,MAAM,SAAS,OAAO,OAAO,MAAM,MAAM,GAAG;AAEjE,QACE,qBAAC;EACC,WAAW,WAAW;EACtB,gBAAc;EACd,iBAAe;EACf,eAAa;;GAGb,oBAAC,4BACC,oBAAC;IACM;IACL,cAAY;IACF;IACV,KAAK;IACL,KAAK;IACC;IACE;IACF;IACN,UAAU;IACV,MAAK;IACL,OAAO;IACP,WAAW,MAAM;AACf,cAAS,OAAO,EAAE,OAAO,MAAM,CAAC;;IAElC,eAAe;AAGb,qBAAgB,SAAS,OAAO;;KAElC,GACa;GAEjB,oBAACC;IACC,KAAK;IACL,cAAY;IACZ,OAAO,UAAU,WAAW;IAChB;IACA;IACZ,YAAY;IACL;IACG;IACA;IACV,MAAM,GAAG,KAAK;IACN;IACE;IACC;IACL;IACQ;IACR;IACN,OAAO;IACP,YAAY;KACV,YAAY,WAAW;KACvB,QAAQ,WAAW;KACnB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,OAAO,WAAW;KAClB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,OAAO,WAAW;KACnB;KACD;GACD,UACC,oBAAC;IACC,GAAI,uBAAuB;IAC3B,WAAW,GACT,uBAAuB,EAAE,WAEzB,aACD;cAED,oBAAC;KAAI,GAAI,sBAAsB;eAAG;MAAmB;KACjD,GACJ;;GACA;;AAIV,uBAAeD;;;;ACzMf,qBAAeE"}
+{"version":3,"file":"Slider-Cy5vz5as.js","names":["Slider","HeroUISlider","Slider"],"sources":["../src/Slider/Slider.tsx","../src/Slider/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Slider as HeroUISlider } from '@heroui/slider';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const sliderVariants = tv({\n  slots: {\n    base: 'group',\n    endContent: '',\n    errorMessage: 'ml-1 mt-1',\n    filler: '',\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    labelWrapper: '',\n    mark: '',\n    startContent: '',\n    step: '',\n    thumb: '',\n    track: '',\n    trackWrapper: '',\n    value: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof sliderVariants>;\ntype ClassName = TVClassName<typeof sliderVariants>;\n\nexport interface SliderProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** CSS class name */\n  className?: ClassName;\n  /** input field is disabled */\n  disabled?: boolean;\n  /** Content to display at the end of the slider */\n  endContent?: ReactNode;\n  /** The offset from where the fill should start */\n  fillOffset?: number;\n  /** form field label */\n  label?: string;\n  /** form field name */\n  name: string;\n  /**\n   * Whether to show step dots on the slider\n   * @default false\n   */\n  showSteps?: boolean;\n  /**\n   * The size of the slider\n   * @default \"md\"\n   */\n  size?: 'sm' | 'md' | 'lg';\n  /** Content to display at the start of the slider */\n  startContent?: ReactNode;\n  /**\n   * The step value of the slider\n   * @default 1\n   */\n  step?: number;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /**\n   * The minimum value of the slider\n   * @default 0\n   */\n  minValue?: number;\n  /**\n   * The maximum value of the slider\n   * @default 100\n   */\n  maxValue?: number;\n}\n\n/**\n * Slider component based on [HeroUI Slider](https://www.heroui.com//docs/components/slider)\n */\nconst Slider = ({\n  className = undefined,\n  endContent = undefined,\n  fillOffset = undefined,\n  name,\n  showSteps = false,\n  size = 'md',\n  startContent = undefined,\n  step = 1,\n  minValue = 0,\n  maxValue = 100,\n  ...uniformFieldProps\n}: SliderProps) => {\n  const {\n    ariaLabel,\n    disabled,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    errorMessage,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual slider to forward focus\n  const visualSliderRef = useRef<HTMLDivElement>(null);\n\n  // classNames from slots\n  const variants = sliderVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  // Get the current value, defaulting to minValue if null/undefined\n  const currentValue = field.value != null ? Number(field.value) : minValue;\n\n  return (\n    <div\n      className={classNames.base}\n      data-invalid={invalid}\n      data-required={required}\n      data-testid={testId}\n    >\n      {/* Visually hidden input for form accessibility and focus management */}\n      <VisuallyHidden>\n        <input\n          ref={ref}\n          aria-label={ariaLabel}\n          disabled={disabled}\n          max={maxValue}\n          min={minValue}\n          name={name}\n          onBlur={onBlur}\n          step={step}\n          tabIndex={-1}\n          type=\"range\"\n          value={currentValue}\n          onChange={(e) => {\n            onChange(Number(e.target.value));\n          }}\n          onFocus={() => {\n            // When RHF focuses this hidden input (e.g., on validation error),\n            // forward focus to the visual slider to show focus ring\n            visualSliderRef.current?.focus();\n          }}\n        />\n      </VisuallyHidden>\n      {/* Visual HeroUISlider component */}\n      <HeroUISlider\n        ref={visualSliderRef}\n        aria-label={ariaLabel}\n        color={invalid ? 'danger' : 'primary'}\n        endContent={endContent}\n        fillOffset={fillOffset}\n        isDisabled={disabled}\n        label={label}\n        maxValue={maxValue}\n        minValue={minValue}\n        name={`${name}_slider`}\n        onBlur={onBlur}\n        onChange={onChange}\n        showSteps={showSteps}\n        size={size}\n        startContent={startContent}\n        step={step}\n        value={currentValue}\n        classNames={{\n          endContent: classNames.endContent,\n          filler: classNames.filler,\n          label: classNames.label,\n          labelWrapper: classNames.labelWrapper,\n          mark: classNames.mark,\n          startContent: classNames.startContent,\n          step: classNames.step,\n          thumb: classNames.thumb,\n          track: classNames.track,\n          trackWrapper: classNames.trackWrapper,\n          value: classNames.value,\n        }}\n      />\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default Slider;\n","import Slider from './Slider';\n\nexport type { SliderProps } from './Slider';\n\nexport { Slider };\n\nexport default Slider;\n"],"mappings":";;;;;;;;AAYA,MAAa,iBAAiB,GAAG,EAC/B,OAAO;CACL,MAAM;CACN,YAAY;CACZ,cAAc;CACd,QAAQ;CAGR,OACE;CACF,cAAc;CACd,MAAM;CACN,cAAc;CACd,MAAM;CACN,OAAO;CACP,OAAO;CACP,cAAc;CACd,OAAO;CACR,EACF,CAAC;;;;AAsDF,MAAMA,YAAU,EACd,YAAY,QACZ,aAAa,QACb,aAAa,QACb,MACA,YAAY,OACZ,OAAO,MACP,eAAe,QACf,OAAO,GACP,WAAW,GACX,WAAW,KACX,GAAG,wBACc;CACjB,MAAM,EACJ,WACA,UACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,cACA,WACE,gBAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,kBAAkB,OAAuB,KAAK;CAIpD,MAAM,aAAa,qBADF,gBAAgB,EACiB,WAAW,OAAO;CAGpE,MAAM,eAAe,MAAM,SAAS,OAAO,OAAO,MAAM,MAAM,GAAG;AAEjE,QACE,qBAAC;EACC,WAAW,WAAW;EACtB,gBAAc;EACd,iBAAe;EACf,eAAa;;GAGb,oBAAC,4BACC,oBAAC;IACM;IACL,cAAY;IACF;IACV,KAAK;IACL,KAAK;IACC;IACE;IACF;IACN,UAAU;IACV,MAAK;IACL,OAAO;IACP,WAAW,MAAM;AACf,cAAS,OAAO,EAAE,OAAO,MAAM,CAAC;;IAElC,eAAe;AAGb,qBAAgB,SAAS,OAAO;;KAElC,GACa;GAEjB,oBAACC;IACC,KAAK;IACL,cAAY;IACZ,OAAO,UAAU,WAAW;IAChB;IACA;IACZ,YAAY;IACL;IACG;IACA;IACV,MAAM,GAAG,KAAK;IACN;IACE;IACC;IACL;IACQ;IACR;IACN,OAAO;IACP,YAAY;KACV,YAAY,WAAW;KACvB,QAAQ,WAAW;KACnB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,cAAc,WAAW;KACzB,MAAM,WAAW;KACjB,OAAO,WAAW;KAClB,OAAO,WAAW;KAClB,cAAc,WAAW;KACzB,OAAO,WAAW;KACnB;KACD;GACD,UACC,oBAAC;IACC,GAAI,uBAAuB;IAC3B,WAAW,GACT,uBAAuB,EAAE,WAEzB,aACD;cAED,oBAAC;KAAI,GAAI,sBAAsB;eAAG;MAAmB;KACjD,GACJ;;GACA;;AAIV,uBAAeD;;;;ACzMf,qBAAeE"}

package/dist/SubmitButton/index.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const require_SubmitButton = require('../SubmitButton-B0kvUqkd.cjs');
+const require_SubmitButton = require('../SubmitButton-C6sgPR8K.cjs');
 
 exports.SubmitButton = require_SubmitButton.SubmitButton_default$1;
 exports.default = require_SubmitButton.SubmitButton_default;

package/dist/SubmitButton/index.d.cts

@@ -1,2 +1,2 @@
-import { n as SubmitButtonProps, t as SubmitButton } from "../index-cadUZZIY.cjs";
+import { n as SubmitButtonProps, t as SubmitButton } from "../index-Bd7H1tdb.cjs";
 export { SubmitButton, SubmitButton as default, SubmitButtonProps };

package/dist/SubmitButton/index.d.ts

@@ -1,2 +1,2 @@
-import { n as SubmitButtonProps, t as SubmitButton } from "../index-CHXv_rNR.js";
+import { n as SubmitButtonProps, t as SubmitButton } from "../index-CVY05bZf.js";
 export { SubmitButton, SubmitButton as default, SubmitButtonProps };

package/dist/SubmitButton/index.js

@@ -1,3 +1,3 @@
-import { n as SubmitButton_default, t as SubmitButton_default$1 } from "../SubmitButton-BHP9J9ml.js";
+import { n as SubmitButton_default, t as SubmitButton_default$1 } from "../SubmitButton-BrbHJcb4.js";
 
 export { SubmitButton_default as SubmitButton, SubmitButton_default$1 as default };

package/dist/{SubmitButton-BHP9J9ml.js → SubmitButton-BrbHJcb4.js}

@@ -1,4 +1,4 @@
-import { n as useFormContext } from "./useFormContext-BFoXZNkp.js";
+import { n as useFormContext } from "./useFormContext-UFBqUfOr.js";
 import { cn, slugify } from "@fuf-stack/pixel-utils";
 import { Button } from "@fuf-stack/pixels";
 import { jsx } from "react/jsx-runtime";
@@ -31,4 +31,4 @@ var SubmitButton_default = SubmitButton_default$1;
 
 //#endregion
 export { SubmitButton_default$1 as n, SubmitButton_default as t };
-//# sourceMappingURL=SubmitButton-BHP9J9ml.js.map
+//# sourceMappingURL=SubmitButton-BrbHJcb4.js.map

package/dist/{SubmitButton-BHP9J9ml.js.map → SubmitButton-BrbHJcb4.js.map}

@@ -1 +1 @@
-{"version":3,"file":"SubmitButton-BHP9J9ml.js","names":["SubmitButton"],"sources":["../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"sourcesContent":["import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn, slugify } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../hooks/useFormContext';\n\nexport interface SubmitButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** color of the submit button */\n  color?: ButtonProps['color'];\n  /** icon of the submit button */\n  icon?: ButtonProps['icon'];\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** size of the submit button */\n  size?: ButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n  ariaLabel = 'Submit form',\n  children = 'Submit',\n  className = undefined,\n  color = 'success',\n  icon = undefined,\n  loading = false,\n  size = 'md',\n  testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n  const {\n    formState: { isSubmitting },\n    triggerSubmit,\n  } = useFormContext();\n\n  return (\n    <Button\n      ariaLabel={ariaLabel}\n      className={cn(className)}\n      color={color}\n      disabled={isSubmitting}\n      icon={icon}\n      loading={loading || isSubmitting}\n      // @ts-expect-error we use form context triggerSubmit\n      // here so that submit button also works in special\n      // scenarios (e.g. when used in modal)\n      onClick={triggerSubmit}\n      size={size}\n      testId={slugify(testId, { replaceDots: true })}\n      type=\"submit\"\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"],"mappings":";;;;;;;;;AA8BA,MAAM,gBAAgB,EACpB,YAAY,eACZ,WAAW,UACX,YAAY,QACZ,QAAQ,WACR,OAAO,QACP,UAAU,OACV,OAAO,MACP,SAAS,2BACc;CACvB,MAAM,EACJ,WAAW,EAAE,gBACb,kBACE,gBAAgB;AAEpB,QACE,oBAAC;EACY;EACX,WAAW,GAAG,UAAU;EACjB;EACP,UAAU;EACJ;EACN,SAAS,WAAW;EAIpB,SAAS;EACH;EACN,QAAQ,QAAQ,QAAQ,EAAE,aAAa,MAAM,CAAC;EAC9C,MAAK;EAEJ;GACM;;AAIb,6BAAe;;;;AC5Df,2BAAeA"}
+{"version":3,"file":"SubmitButton-BrbHJcb4.js","names":["SubmitButton"],"sources":["../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"sourcesContent":["import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn, slugify } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../hooks/useFormContext';\n\nexport interface SubmitButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** color of the submit button */\n  color?: ButtonProps['color'];\n  /** icon of the submit button */\n  icon?: ButtonProps['icon'];\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** size of the submit button */\n  size?: ButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n  ariaLabel = 'Submit form',\n  children = 'Submit',\n  className = undefined,\n  color = 'success',\n  icon = undefined,\n  loading = false,\n  size = 'md',\n  testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n  const {\n    formState: { isSubmitting },\n    triggerSubmit,\n  } = useFormContext();\n\n  return (\n    <Button\n      ariaLabel={ariaLabel}\n      className={cn(className)}\n      color={color}\n      disabled={isSubmitting}\n      icon={icon}\n      loading={loading || isSubmitting}\n      // @ts-expect-error we use form context triggerSubmit\n      // here so that submit button also works in special\n      // scenarios (e.g. when used in modal)\n      onClick={triggerSubmit}\n      size={size}\n      testId={slugify(testId, { replaceDots: true })}\n      type=\"submit\"\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"],"mappings":";;;;;;;;;AA8BA,MAAM,gBAAgB,EACpB,YAAY,eACZ,WAAW,UACX,YAAY,QACZ,QAAQ,WACR,OAAO,QACP,UAAU,OACV,OAAO,MACP,SAAS,2BACc;CACvB,MAAM,EACJ,WAAW,EAAE,gBACb,kBACE,gBAAgB;AAEpB,QACE,oBAAC;EACY;EACX,WAAW,GAAG,UAAU;EACjB;EACP,UAAU;EACJ;EACN,SAAS,WAAW;EAIpB,SAAS;EACH;EACN,QAAQ,QAAQ,QAAQ,EAAE,aAAa,MAAM,CAAC;EAC9C,MAAK;EAEJ;GACM;;AAIb,6BAAe;;;;AC5Df,2BAAeA"}

package/dist/{SubmitButton-B0kvUqkd.cjs → SubmitButton-C6sgPR8K.cjs}

@@ -1,5 +1,5 @@
-const require_FormContext = require('./FormContext-Lw4YL4-B.cjs');
-const require_useFormContext = require('./useFormContext-CEr3zcL6.cjs');
+const require_FormContext = require('./FormContext-CeFKQmVH.cjs');
+const require_useFormContext = require('./useFormContext-DJiJlfGJ.cjs');
 let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
 let _fuf_stack_pixels = require("@fuf-stack/pixels");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -43,4 +43,4 @@ Object.defineProperty(exports, 'SubmitButton_default$1', {
     return SubmitButton_default$1;
   }
 });
-//# sourceMappingURL=SubmitButton-B0kvUqkd.cjs.map
+//# sourceMappingURL=SubmitButton-C6sgPR8K.cjs.map

package/dist/{SubmitButton-B0kvUqkd.cjs.map → SubmitButton-C6sgPR8K.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"SubmitButton-B0kvUqkd.cjs","names":["useFormContext","Button","SubmitButton"],"sources":["../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"sourcesContent":["import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn, slugify } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../hooks/useFormContext';\n\nexport interface SubmitButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** color of the submit button */\n  color?: ButtonProps['color'];\n  /** icon of the submit button */\n  icon?: ButtonProps['icon'];\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** size of the submit button */\n  size?: ButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n  ariaLabel = 'Submit form',\n  children = 'Submit',\n  className = undefined,\n  color = 'success',\n  icon = undefined,\n  loading = false,\n  size = 'md',\n  testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n  const {\n    formState: { isSubmitting },\n    triggerSubmit,\n  } = useFormContext();\n\n  return (\n    <Button\n      ariaLabel={ariaLabel}\n      className={cn(className)}\n      color={color}\n      disabled={isSubmitting}\n      icon={icon}\n      loading={loading || isSubmitting}\n      // @ts-expect-error we use form context triggerSubmit\n      // here so that submit button also works in special\n      // scenarios (e.g. when used in modal)\n      onClick={triggerSubmit}\n      size={size}\n      testId={slugify(testId, { replaceDots: true })}\n      type=\"submit\"\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"],"mappings":";;;;;;;;;;AA8BA,MAAM,gBAAgB,EACpB,YAAY,eACZ,WAAW,UACX,YAAY,QACZ,QAAQ,WACR,OAAO,QACP,UAAU,OACV,OAAO,MACP,SAAS,2BACc;CACvB,MAAM,EACJ,WAAW,EAAE,gBACb,kBACEA,uCAAgB;AAEpB,QACE,2CAACC;EACY;EACX,0CAAc,UAAU;EACjB;EACP,UAAU;EACJ;EACN,SAAS,WAAW;EAIpB,SAAS;EACH;EACN,4CAAgB,QAAQ,EAAE,aAAa,MAAM,CAAC;EAC9C,MAAK;EAEJ;GACM;;AAIb,6BAAe;;;;AC5Df,2BAAeC"}
+{"version":3,"file":"SubmitButton-C6sgPR8K.cjs","names":["useFormContext","Button","SubmitButton"],"sources":["../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"sourcesContent":["import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn, slugify } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../hooks/useFormContext';\n\nexport interface SubmitButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** color of the submit button */\n  color?: ButtonProps['color'];\n  /** icon of the submit button */\n  icon?: ButtonProps['icon'];\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** size of the submit button */\n  size?: ButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n  ariaLabel = 'Submit form',\n  children = 'Submit',\n  className = undefined,\n  color = 'success',\n  icon = undefined,\n  loading = false,\n  size = 'md',\n  testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n  const {\n    formState: { isSubmitting },\n    triggerSubmit,\n  } = useFormContext();\n\n  return (\n    <Button\n      ariaLabel={ariaLabel}\n      className={cn(className)}\n      color={color}\n      disabled={isSubmitting}\n      icon={icon}\n      loading={loading || isSubmitting}\n      // @ts-expect-error we use form context triggerSubmit\n      // here so that submit button also works in special\n      // scenarios (e.g. when used in modal)\n      onClick={triggerSubmit}\n      size={size}\n      testId={slugify(testId, { replaceDots: true })}\n      type=\"submit\"\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"],"mappings":";;;;;;;;;;AA8BA,MAAM,gBAAgB,EACpB,YAAY,eACZ,WAAW,UACX,YAAY,QACZ,QAAQ,WACR,OAAO,QACP,UAAU,OACV,OAAO,MACP,SAAS,2BACc;CACvB,MAAM,EACJ,WAAW,EAAE,gBACb,kBACEA,uCAAgB;AAEpB,QACE,2CAACC;EACY;EACX,0CAAc,UAAU;EACjB;EACP,UAAU;EACJ;EACN,SAAS,WAAW;EAIpB,SAAS;EACH;EACN,4CAAgB,QAAQ,EAAE,aAAa,MAAM,CAAC;EAC9C,MAAK;EAEJ;GACM;;AAIb,6BAAe;;;;AC5Df,2BAAeC"}

package/dist/Switch/index.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const require_Switch = require('../Switch-Ds0gDzjR.cjs');
+const require_Switch = require('../Switch-BBhxgBHh.cjs');
 
 exports.Switch = require_Switch.Switch_default$1;
 exports.default = require_Switch.Switch_default;

package/dist/Switch/index.d.cts

@@ -1,2 +1,2 @@
-import { n as SwitchProps, t as Switch } from "../index-CqGabrzW.cjs";
+import { n as SwitchProps, t as Switch } from "../index-DCZwOjSs.cjs";
 export { Switch, Switch as default, SwitchProps };

package/dist/Switch/index.d.ts

@@ -1,2 +1,2 @@
-import { n as SwitchProps, t as Switch } from "../index-yVkU2v6b.js";
+import { n as SwitchProps, t as Switch } from "../index-D3o2YTBb.js";
 export { Switch, Switch as default, SwitchProps };

package/dist/Switch/index.js

@@ -1,3 +1,3 @@
-import { n as Switch_default, t as Switch_default$1 } from "../Switch-DkciIYnD.js";
+import { n as Switch_default, t as Switch_default$1 } from "../Switch-s64WUP5i.js";
 
 export { Switch_default as Switch, Switch_default$1 as default };

package/dist/{Switch-Ds0gDzjR.cjs → Switch-BBhxgBHh.cjs}

@@ -1,5 +1,5 @@
-const require_FormContext = require('./FormContext-Lw4YL4-B.cjs');
-const require_useUniformField = require('./useUniformField-D6fwSjrH.cjs');
+const require_FormContext = require('./FormContext-CeFKQmVH.cjs');
+const require_useUniformField = require('./useUniformField-CGiibqg4.cjs');
 let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -93,4 +93,4 @@ Object.defineProperty(exports, 'Switch_default$1', {
     return Switch_default$1;
   }
 });
-//# sourceMappingURL=Switch-Ds0gDzjR.cjs.map
+//# sourceMappingURL=Switch-BBhxgBHh.cjs.map

package/dist/{Switch-Ds0gDzjR.cjs.map → Switch-BBhxgBHh.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"Switch-Ds0gDzjR.cjs","names":["useUniformField","VisuallyHidden","HeroSwitch","Switch"],"sources":["../src/Switch/Switch.tsx","../src/Switch/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Switch as HeroSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchVariants = tv({\n  slots: {\n    base: '',\n    endContent: '',\n    errorMessage: 'ml-1 mt-1',\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    outerWrapper: 'place-content-center',\n    startContent: '',\n    thumb: '',\n    thumbIcon: '',\n    wrapper: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof switchVariants>;\ntype ClassName = TVClassName<typeof switchVariants>;\n\nexport interface SwitchProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** CSS class name */\n  className?: ClassName;\n  /** whether the select should be disabled */\n  disabled?: boolean;\n  /** Icon to be displayed at the end of the switch (when enabled) */\n  endContent?: ReactNode;\n  /** component displayed next to the switch */\n  label?: ReactNode;\n  /** name the field is registered under */\n  name: string;\n  /* Size of the switch */\n  size?: 'sm' | 'md' | 'lg';\n  /** Icon to be displayed at the start of the switch (when disabled) */\n  startContent?: ReactNode;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** Icon to be displayed inside the thumb */\n  thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n *  Switch component based on [HeroUI Switch](https://www.heroui.com//docs/components/switch)\n */\nconst Switch = ({\n  className = undefined,\n  endContent = undefined,\n  name,\n  size = undefined,\n  startContent = undefined,\n  thumbIcon = undefined,\n  ...uniformFieldProps\n}: SwitchProps) => {\n  const {\n    ariaLabel,\n    defaultValue,\n    disabled,\n    errorMessage,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual switch to forward focus\n  const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n  // classNames from slots\n  const variants = switchVariants();\n  const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n  return (\n    <div className={classNames.outerWrapper}>\n      {/* Visually hidden input for form accessibility and focus management */}\n      <VisuallyHidden>\n        <input\n          ref={ref}\n          aria-label={ariaLabel}\n          checked={!!field.value}\n          name={name}\n          onBlur={onBlur}\n          type=\"checkbox\"\n          onChange={(e) => {\n            onChange(e.target.checked);\n          }}\n          onFocus={() => {\n            // When RHF focuses this hidden input (e.g., on validation error),\n            // forward focus to the visual switch to show focus ring\n            visualSwitchRef.current?.focus();\n          }}\n        />\n      </VisuallyHidden>\n      {/* Visual HeroSwitch component */}\n      <HeroSwitch\n        ref={visualSwitchRef}\n        aria-label={ariaLabel}\n        classNames={classNames}\n        data-invalid={invalid}\n        data-required={required}\n        data-testid={testId}\n        defaultSelected={!!defaultValue}\n        endContent={endContent}\n        isDisabled={disabled}\n        isSelected={!!field.value}\n        name={`${name}_switch`}\n        onValueChange={onChange}\n        size={size}\n        startContent={startContent}\n        thumbIcon={thumbIcon}\n      >\n        {label}\n      </HeroSwitch>\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default Switch;\n","import Switch from './Switch';\n\nexport type { SwitchProps } from './Switch';\n\nexport { Switch };\n\nexport default Switch;\n"],"mappings":";;;;;;;;;AAaA,MAAa,gDAAoB,EAC/B,OAAO;CACL,MAAM;CACN,YAAY;CACZ,cAAc;CAGd,OACE;CACF,cAAc;CACd,cAAc;CACd,OAAO;CACP,WAAW;CACX,SAAS;CACV,EACF,CAAC;;;;AA+BF,MAAM,UAAU,EACd,YAAY,QACZ,aAAa,QACb,MACA,OAAO,QACP,eAAe,QACf,YAAY,QACZ,GAAG,wBACc;CACjB,MAAM,EACJ,WACA,cACA,UACA,cACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,WACEA,wCAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,oCAA2C,KAAK;CAItD,MAAM,8DADW,gBAAgB,EACiB,WAAW,eAAe;AAE5E,QACE,4CAAC;EAAI,WAAW,WAAW;;GAEzB,2CAACC,wDACC,2CAAC;IACM;IACL,cAAY;IACZ,SAAS,CAAC,CAAC,MAAM;IACX;IACE;IACR,MAAK;IACL,WAAW,MAAM;AACf,cAAS,EAAE,OAAO,QAAQ;;IAE5B,eAAe;AAGb,qBAAgB,SAAS,OAAO;;KAElC,GACa;GAEjB,2CAACC;IACC,KAAK;IACL,cAAY;IACA;IACZ,gBAAc;IACd,iBAAe;IACf,eAAa;IACb,iBAAiB,CAAC,CAAC;IACP;IACZ,YAAY;IACZ,YAAY,CAAC,CAAC,MAAM;IACpB,MAAM,GAAG,KAAK;IACd,eAAe;IACT;IACQ;IACH;cAEV;KACU;GACZ,UACC,2CAAC;IACC,GAAI,uBAAuB;IAC3B,0CACE,uBAAuB,EAAE,WAEzB,aACD;cAED,2CAAC;KAAI,GAAI,sBAAsB;eAAG;MAAmB;KACjD,GACJ;;GACA;;AAIV,uBAAe;;;;AClJf,qBAAeC"}
+{"version":3,"file":"Switch-BBhxgBHh.cjs","names":["useUniformField","VisuallyHidden","HeroSwitch","Switch"],"sources":["../src/Switch/Switch.tsx","../src/Switch/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Switch as HeroSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchVariants = tv({\n  slots: {\n    base: '',\n    endContent: '',\n    errorMessage: 'ml-1 mt-1',\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    outerWrapper: 'place-content-center',\n    startContent: '',\n    thumb: '',\n    thumbIcon: '',\n    wrapper: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof switchVariants>;\ntype ClassName = TVClassName<typeof switchVariants>;\n\nexport interface SwitchProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** CSS class name */\n  className?: ClassName;\n  /** whether the select should be disabled */\n  disabled?: boolean;\n  /** Icon to be displayed at the end of the switch (when enabled) */\n  endContent?: ReactNode;\n  /** component displayed next to the switch */\n  label?: ReactNode;\n  /** name the field is registered under */\n  name: string;\n  /* Size of the switch */\n  size?: 'sm' | 'md' | 'lg';\n  /** Icon to be displayed at the start of the switch (when disabled) */\n  startContent?: ReactNode;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** Icon to be displayed inside the thumb */\n  thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n *  Switch component based on [HeroUI Switch](https://www.heroui.com//docs/components/switch)\n */\nconst Switch = ({\n  className = undefined,\n  endContent = undefined,\n  name,\n  size = undefined,\n  startContent = undefined,\n  thumbIcon = undefined,\n  ...uniformFieldProps\n}: SwitchProps) => {\n  const {\n    ariaLabel,\n    defaultValue,\n    disabled,\n    errorMessage,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual switch to forward focus\n  const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n  // classNames from slots\n  const variants = switchVariants();\n  const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n  return (\n    <div className={classNames.outerWrapper}>\n      {/* Visually hidden input for form accessibility and focus management */}\n      <VisuallyHidden>\n        <input\n          ref={ref}\n          aria-label={ariaLabel}\n          checked={!!field.value}\n          name={name}\n          onBlur={onBlur}\n          type=\"checkbox\"\n          onChange={(e) => {\n            onChange(e.target.checked);\n          }}\n          onFocus={() => {\n            // When RHF focuses this hidden input (e.g., on validation error),\n            // forward focus to the visual switch to show focus ring\n            visualSwitchRef.current?.focus();\n          }}\n        />\n      </VisuallyHidden>\n      {/* Visual HeroSwitch component */}\n      <HeroSwitch\n        ref={visualSwitchRef}\n        aria-label={ariaLabel}\n        classNames={classNames}\n        data-invalid={invalid}\n        data-required={required}\n        data-testid={testId}\n        defaultSelected={!!defaultValue}\n        endContent={endContent}\n        isDisabled={disabled}\n        isSelected={!!field.value}\n        name={`${name}_switch`}\n        onValueChange={onChange}\n        size={size}\n        startContent={startContent}\n        thumbIcon={thumbIcon}\n      >\n        {label}\n      </HeroSwitch>\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default Switch;\n","import Switch from './Switch';\n\nexport type { SwitchProps } from './Switch';\n\nexport { Switch };\n\nexport default Switch;\n"],"mappings":";;;;;;;;;AAaA,MAAa,gDAAoB,EAC/B,OAAO;CACL,MAAM;CACN,YAAY;CACZ,cAAc;CAGd,OACE;CACF,cAAc;CACd,cAAc;CACd,OAAO;CACP,WAAW;CACX,SAAS;CACV,EACF,CAAC;;;;AA+BF,MAAM,UAAU,EACd,YAAY,QACZ,aAAa,QACb,MACA,OAAO,QACP,eAAe,QACf,YAAY,QACZ,GAAG,wBACc;CACjB,MAAM,EACJ,WACA,cACA,UACA,cACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,WACEA,wCAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,oCAA2C,KAAK;CAItD,MAAM,8DADW,gBAAgB,EACiB,WAAW,eAAe;AAE5E,QACE,4CAAC;EAAI,WAAW,WAAW;;GAEzB,2CAACC,wDACC,2CAAC;IACM;IACL,cAAY;IACZ,SAAS,CAAC,CAAC,MAAM;IACX;IACE;IACR,MAAK;IACL,WAAW,MAAM;AACf,cAAS,EAAE,OAAO,QAAQ;;IAE5B,eAAe;AAGb,qBAAgB,SAAS,OAAO;;KAElC,GACa;GAEjB,2CAACC;IACC,KAAK;IACL,cAAY;IACA;IACZ,gBAAc;IACd,iBAAe;IACf,eAAa;IACb,iBAAiB,CAAC,CAAC;IACP;IACZ,YAAY;IACZ,YAAY,CAAC,CAAC,MAAM;IACpB,MAAM,GAAG,KAAK;IACd,eAAe;IACT;IACQ;IACH;cAEV;KACU;GACZ,UACC,2CAAC;IACC,GAAI,uBAAuB;IAC3B,0CACE,uBAAuB,EAAE,WAEzB,aACD;cAED,2CAAC;KAAI,GAAI,sBAAsB;eAAG;MAAmB;KACjD,GACJ;;GACA;;AAIV,uBAAe;;;;AClJf,qBAAeC"}

package/dist/{Switch-DkciIYnD.js → Switch-s64WUP5i.js}

@@ -1,4 +1,4 @@
-import { t as useUniformField } from "./useUniformField-BKVVns0E.js";
+import { t as useUniformField } from "./useUniformField-D2NgevBI.js";
 import { cn, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
 import { useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -81,4 +81,4 @@ var Switch_default = Switch_default$1;
 
 //#endregion
 export { Switch_default$1 as n, Switch_default as t };
-//# sourceMappingURL=Switch-DkciIYnD.js.map
+//# sourceMappingURL=Switch-s64WUP5i.js.map

package/dist/{Switch-DkciIYnD.js.map → Switch-s64WUP5i.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Switch-DkciIYnD.js","names":["Switch","HeroSwitch","Switch"],"sources":["../src/Switch/Switch.tsx","../src/Switch/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Switch as HeroSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchVariants = tv({\n  slots: {\n    base: '',\n    endContent: '',\n    errorMessage: 'ml-1 mt-1',\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    outerWrapper: 'place-content-center',\n    startContent: '',\n    thumb: '',\n    thumbIcon: '',\n    wrapper: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof switchVariants>;\ntype ClassName = TVClassName<typeof switchVariants>;\n\nexport interface SwitchProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** CSS class name */\n  className?: ClassName;\n  /** whether the select should be disabled */\n  disabled?: boolean;\n  /** Icon to be displayed at the end of the switch (when enabled) */\n  endContent?: ReactNode;\n  /** component displayed next to the switch */\n  label?: ReactNode;\n  /** name the field is registered under */\n  name: string;\n  /* Size of the switch */\n  size?: 'sm' | 'md' | 'lg';\n  /** Icon to be displayed at the start of the switch (when disabled) */\n  startContent?: ReactNode;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** Icon to be displayed inside the thumb */\n  thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n *  Switch component based on [HeroUI Switch](https://www.heroui.com//docs/components/switch)\n */\nconst Switch = ({\n  className = undefined,\n  endContent = undefined,\n  name,\n  size = undefined,\n  startContent = undefined,\n  thumbIcon = undefined,\n  ...uniformFieldProps\n}: SwitchProps) => {\n  const {\n    ariaLabel,\n    defaultValue,\n    disabled,\n    errorMessage,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual switch to forward focus\n  const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n  // classNames from slots\n  const variants = switchVariants();\n  const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n  return (\n    <div className={classNames.outerWrapper}>\n      {/* Visually hidden input for form accessibility and focus management */}\n      <VisuallyHidden>\n        <input\n          ref={ref}\n          aria-label={ariaLabel}\n          checked={!!field.value}\n          name={name}\n          onBlur={onBlur}\n          type=\"checkbox\"\n          onChange={(e) => {\n            onChange(e.target.checked);\n          }}\n          onFocus={() => {\n            // When RHF focuses this hidden input (e.g., on validation error),\n            // forward focus to the visual switch to show focus ring\n            visualSwitchRef.current?.focus();\n          }}\n        />\n      </VisuallyHidden>\n      {/* Visual HeroSwitch component */}\n      <HeroSwitch\n        ref={visualSwitchRef}\n        aria-label={ariaLabel}\n        classNames={classNames}\n        data-invalid={invalid}\n        data-required={required}\n        data-testid={testId}\n        defaultSelected={!!defaultValue}\n        endContent={endContent}\n        isDisabled={disabled}\n        isSelected={!!field.value}\n        name={`${name}_switch`}\n        onValueChange={onChange}\n        size={size}\n        startContent={startContent}\n        thumbIcon={thumbIcon}\n      >\n        {label}\n      </HeroSwitch>\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default Switch;\n","import Switch from './Switch';\n\nexport type { SwitchProps } from './Switch';\n\nexport { Switch };\n\nexport default Switch;\n"],"mappings":";;;;;;;;AAaA,MAAa,iBAAiB,GAAG,EAC/B,OAAO;CACL,MAAM;CACN,YAAY;CACZ,cAAc;CAGd,OACE;CACF,cAAc;CACd,cAAc;CACd,OAAO;CACP,WAAW;CACX,SAAS;CACV,EACF,CAAC;;;;AA+BF,MAAMA,YAAU,EACd,YAAY,QACZ,aAAa,QACb,MACA,OAAO,QACP,eAAe,QACf,YAAY,QACZ,GAAG,wBACc;CACjB,MAAM,EACJ,WACA,cACA,UACA,cACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,WACE,gBAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,kBAAkB,OAAyB,KAAK;CAItD,MAAM,aAAa,qBADF,gBAAgB,EACiB,WAAW,eAAe;AAE5E,QACE,qBAAC;EAAI,WAAW,WAAW;;GAEzB,oBAAC,4BACC,oBAAC;IACM;IACL,cAAY;IACZ,SAAS,CAAC,CAAC,MAAM;IACX;IACE;IACR,MAAK;IACL,WAAW,MAAM;AACf,cAAS,EAAE,OAAO,QAAQ;;IAE5B,eAAe;AAGb,qBAAgB,SAAS,OAAO;;KAElC,GACa;GAEjB,oBAACC;IACC,KAAK;IACL,cAAY;IACA;IACZ,gBAAc;IACd,iBAAe;IACf,eAAa;IACb,iBAAiB,CAAC,CAAC;IACP;IACZ,YAAY;IACZ,YAAY,CAAC,CAAC,MAAM;IACpB,MAAM,GAAG,KAAK;IACd,eAAe;IACT;IACQ;IACH;cAEV;KACU;GACZ,UACC,oBAAC;IACC,GAAI,uBAAuB;IAC3B,WAAW,GACT,uBAAuB,EAAE,WAEzB,aACD;cAED,oBAAC;KAAI,GAAI,sBAAsB;eAAG;MAAmB;KACjD,GACJ;;GACA;;AAIV,uBAAeD;;;;AClJf,qBAAeE"}
+{"version":3,"file":"Switch-s64WUP5i.js","names":["Switch","HeroSwitch","Switch"],"sources":["../src/Switch/Switch.tsx","../src/Switch/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Switch as HeroSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchVariants = tv({\n  slots: {\n    base: '',\n    endContent: '',\n    errorMessage: 'ml-1 mt-1',\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    outerWrapper: 'place-content-center',\n    startContent: '',\n    thumb: '',\n    thumbIcon: '',\n    wrapper: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof switchVariants>;\ntype ClassName = TVClassName<typeof switchVariants>;\n\nexport interface SwitchProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** CSS class name */\n  className?: ClassName;\n  /** whether the select should be disabled */\n  disabled?: boolean;\n  /** Icon to be displayed at the end of the switch (when enabled) */\n  endContent?: ReactNode;\n  /** component displayed next to the switch */\n  label?: ReactNode;\n  /** name the field is registered under */\n  name: string;\n  /* Size of the switch */\n  size?: 'sm' | 'md' | 'lg';\n  /** Icon to be displayed at the start of the switch (when disabled) */\n  startContent?: ReactNode;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** Icon to be displayed inside the thumb */\n  thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n *  Switch component based on [HeroUI Switch](https://www.heroui.com//docs/components/switch)\n */\nconst Switch = ({\n  className = undefined,\n  endContent = undefined,\n  name,\n  size = undefined,\n  startContent = undefined,\n  thumbIcon = undefined,\n  ...uniformFieldProps\n}: SwitchProps) => {\n  const {\n    ariaLabel,\n    defaultValue,\n    disabled,\n    errorMessage,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual switch to forward focus\n  const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n  // classNames from slots\n  const variants = switchVariants();\n  const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n  return (\n    <div className={classNames.outerWrapper}>\n      {/* Visually hidden input for form accessibility and focus management */}\n      <VisuallyHidden>\n        <input\n          ref={ref}\n          aria-label={ariaLabel}\n          checked={!!field.value}\n          name={name}\n          onBlur={onBlur}\n          type=\"checkbox\"\n          onChange={(e) => {\n            onChange(e.target.checked);\n          }}\n          onFocus={() => {\n            // When RHF focuses this hidden input (e.g., on validation error),\n            // forward focus to the visual switch to show focus ring\n            visualSwitchRef.current?.focus();\n          }}\n        />\n      </VisuallyHidden>\n      {/* Visual HeroSwitch component */}\n      <HeroSwitch\n        ref={visualSwitchRef}\n        aria-label={ariaLabel}\n        classNames={classNames}\n        data-invalid={invalid}\n        data-required={required}\n        data-testid={testId}\n        defaultSelected={!!defaultValue}\n        endContent={endContent}\n        isDisabled={disabled}\n        isSelected={!!field.value}\n        name={`${name}_switch`}\n        onValueChange={onChange}\n        size={size}\n        startContent={startContent}\n        thumbIcon={thumbIcon}\n      >\n        {label}\n      </HeroSwitch>\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default Switch;\n","import Switch from './Switch';\n\nexport type { SwitchProps } from './Switch';\n\nexport { Switch };\n\nexport default Switch;\n"],"mappings":";;;;;;;;AAaA,MAAa,iBAAiB,GAAG,EAC/B,OAAO;CACL,MAAM;CACN,YAAY;CACZ,cAAc;CAGd,OACE;CACF,cAAc;CACd,cAAc;CACd,OAAO;CACP,WAAW;CACX,SAAS;CACV,EACF,CAAC;;;;AA+BF,MAAMA,YAAU,EACd,YAAY,QACZ,aAAa,QACb,MACA,OAAO,QACP,eAAe,QACf,YAAY,QACZ,GAAG,wBACc;CACjB,MAAM,EACJ,WACA,cACA,UACA,cACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,WACE,gBAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,kBAAkB,OAAyB,KAAK;CAItD,MAAM,aAAa,qBADF,gBAAgB,EACiB,WAAW,eAAe;AAE5E,QACE,qBAAC;EAAI,WAAW,WAAW;;GAEzB,oBAAC,4BACC,oBAAC;IACM;IACL,cAAY;IACZ,SAAS,CAAC,CAAC,MAAM;IACX;IACE;IACR,MAAK;IACL,WAAW,MAAM;AACf,cAAS,EAAE,OAAO,QAAQ;;IAE5B,eAAe;AAGb,qBAAgB,SAAS,OAAO;;KAElC,GACa;GAEjB,oBAACC;IACC,KAAK;IACL,cAAY;IACA;IACZ,gBAAc;IACd,iBAAe;IACf,eAAa;IACb,iBAAiB,CAAC,CAAC;IACP;IACZ,YAAY;IACZ,YAAY,CAAC,CAAC,MAAM;IACpB,MAAM,GAAG,KAAK;IACd,eAAe;IACT;IACQ;IACH;cAEV;KACU;GACZ,UACC,oBAAC;IACC,GAAI,uBAAuB;IAC3B,WAAW,GACT,uBAAuB,EAAE,WAEzB,aACD;cAED,oBAAC;KAAI,GAAI,sBAAsB;eAAG;MAAmB;KACjD,GACJ;;GACA;;AAIV,uBAAeD;;;;AClJf,qBAAeE"}

package/dist/SwitchBox/index.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const require_SwitchBox = require('../SwitchBox-B9JqwDtN.cjs');
+const require_SwitchBox = require('../SwitchBox-BwdvgHpG.cjs');
 
 exports.SwitchBox = require_SwitchBox.SwitchBox_default$1;
 exports.default = require_SwitchBox.SwitchBox_default;

package/dist/SwitchBox/index.d.cts

@@ -1,2 +1,2 @@
-import { n as SwitchBoxProps, r as switchBoxVariants, t as SwitchBox } from "../index-CHNp5R5N.cjs";
+import { n as SwitchBoxProps, r as switchBoxVariants, t as SwitchBox } from "../index-CrpdF1Xw.cjs";
 export { SwitchBox, SwitchBox as default, SwitchBoxProps, switchBoxVariants };

package/dist/SwitchBox/index.d.ts

@@ -1,2 +1,2 @@
-import { n as SwitchBoxProps, r as switchBoxVariants, t as SwitchBox } from "../index-3v_vja2i.js";
+import { n as SwitchBoxProps, r as switchBoxVariants, t as SwitchBox } from "../index-JdksqsGh.js";
 export { SwitchBox, SwitchBox as default, SwitchBoxProps, switchBoxVariants };

package/dist/SwitchBox/index.js

@@ -1,3 +1,3 @@
-import { n as SwitchBox_default, r as switchBoxVariants, t as SwitchBox_default$1 } from "../SwitchBox-B6Z4rtWt.js";
+import { n as SwitchBox_default, r as switchBoxVariants, t as SwitchBox_default$1 } from "../SwitchBox-CMw1MGJ0.js";
 
 export { SwitchBox_default as SwitchBox, SwitchBox_default$1 as default, switchBoxVariants };

package/dist/{SwitchBox-B9JqwDtN.cjs → SwitchBox-BwdvgHpG.cjs}

@@ -1,5 +1,5 @@
-const require_FormContext = require('./FormContext-Lw4YL4-B.cjs');
-const require_useUniformField = require('./useUniformField-D6fwSjrH.cjs');
+const require_FormContext = require('./FormContext-CeFKQmVH.cjs');
+const require_useUniformField = require('./useUniformField-CGiibqg4.cjs');
 let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -171,4 +171,4 @@ Object.defineProperty(exports, 'switchBoxVariants', {
     return switchBoxVariants;
   }
 });
-//# sourceMappingURL=SwitchBox-B9JqwDtN.cjs.map
+//# sourceMappingURL=SwitchBox-BwdvgHpG.cjs.map

package/dist/{SwitchBox-B9JqwDtN.cjs.map → SwitchBox-BwdvgHpG.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"SwitchBox-B9JqwDtN.cjs","names":["useUniformField","VisuallyHidden","SwitchBox"],"sources":["../src/SwitchBox/SwitchBox.tsx","../src/SwitchBox/index.ts"],"sourcesContent":["import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { useSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchBoxVariants = tv({\n  slots: {\n    box: 'group inline-flex w-full cursor-pointer items-center justify-between rounded-lg border-2 border-default hover:bg-content2 data-[selected=true]:border-focus',\n    description: 'text-foreground opacity-70',\n    icon: '',\n    label:\n      'font-medium text-foreground group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    wrapper: '',\n    thumb: '',\n    thumbIcon: '',\n  },\n  variants: {\n    isDisabled: {\n      true: {\n        box: 'pointer-events-none opacity-disabled',\n      },\n    },\n    isInvalid: {\n      true: {\n        box: '!border-danger',\n        label: '!text-danger',\n      },\n    },\n    size: {\n      sm: {\n        box: 'gap-2 p-3',\n        description: 'text-xs',\n        label: 'text-xs',\n      },\n      md: {\n        box: 'gap-4 p-4',\n        description: 'text-small',\n        label: 'text-sm',\n      },\n      lg: {\n        box: 'gap-4 p-5',\n        description: 'text-small',\n        label: 'text-base',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\ntype ClassName = TVClassName<typeof switchBoxVariants>;\n\nexport interface SwitchBoxProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** Description text displayed below the label */\n  description?: ReactNode;\n  /** whether the switch should be disabled */\n  disabled?: boolean;\n  /** Icon to be displayed in the box */\n  icon?: ReactNode;\n  /** component displayed as the label */\n  label?: ReactNode;\n  /** name the field is registered under */\n  name: string;\n  /** whether the field is required */\n  required?: boolean;\n  /* Size of the switch */\n  size?: 'sm' | 'md' | 'lg';\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** Icon to be displayed inside the thumb */\n  thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n * SwitchBox component - A card-like box with a switch control\n */\nconst SwitchBox = ({\n  className = undefined,\n  description = undefined,\n  icon = undefined,\n  name,\n  size = undefined,\n  thumbIcon = undefined,\n  ...uniformFieldProps\n}: SwitchBoxProps) => {\n  const {\n    defaultValue,\n    disabled,\n    errorMessage,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual switch to forward focus\n  const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n  // Use the useSwitch hook to get access to all the necessary props\n  const {\n    Component,\n    slots,\n    isSelected,\n    getBaseProps,\n    getInputProps,\n    getWrapperProps,\n  } = useSwitch({\n    defaultSelected: !!defaultValue,\n    isDisabled: disabled,\n    isSelected: !!field.value,\n    name: `${name}_switch`,\n    onValueChange: onChange,\n    size,\n    thumbIcon,\n  });\n\n  // classNames from slots\n  const variants = switchBoxVariants({\n    isDisabled: disabled,\n    isInvalid: invalid,\n    size,\n  });\n  const classNames = variantsToClassNames(variants, className, 'box');\n\n  return (\n    <div>\n      <Component\n        {...getBaseProps()}\n        className={classNames.box}\n        data-invalid={invalid}\n        data-required={required}\n        data-testid={testId}\n      >\n        <VisuallyHidden>\n          <input\n            ref={ref}\n            aria-label={typeof label === 'string' ? label : name}\n            checked={!!field.value}\n            name={name}\n            tabIndex={-1}\n            type=\"checkbox\"\n            onChange={(e) => {\n              onChange(e.target.checked);\n            }}\n            onFocus={() => {\n              // When RHF focuses this hidden input (e.g., on validation error),\n              // forward focus to the visual switch to show focus ring\n              visualSwitchRef.current?.focus();\n            }}\n          />\n          {/* Visual switch input for focus ring */}\n          <input\n            ref={visualSwitchRef}\n            {...getInputProps()}\n            onBlur={(e) => {\n              // Call HeroUI's internal onBlur to clear focus state and remove focus ring\n              getInputProps().onBlur?.(e);\n              // Then call RHF's onBlur to mark field as touched\n              onBlur();\n            }}\n          />\n        </VisuallyHidden>\n        {!icon ? (\n          <span\n            {...getWrapperProps()}\n            className={cn(getWrapperProps().className, classNames.wrapper)}\n          >\n            <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n              {thumbIcon && typeof thumbIcon === 'function'\n                ? thumbIcon({\n                    isSelected: !!isSelected,\n                    className: slots.thumbIcon({ class: classNames.thumbIcon }),\n                    width: '1em',\n                    height: '1em',\n                    'data-checked': isSelected ? 'true' : 'false',\n                  })\n                : thumbIcon}\n            </span>\n          </span>\n        ) : null}\n        {icon ? <div className={classNames.icon}>{icon}</div> : null}\n        <div className=\"grow\">\n          {label ? <div className={classNames.label}>{label}</div> : null}\n          {description ? (\n            <div className={classNames.description}>{description}</div>\n          ) : null}\n        </div>\n        {icon ? (\n          <span\n            {...getWrapperProps()}\n            className={cn(getWrapperProps().className, classNames.wrapper)}\n          >\n            <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n              {thumbIcon && typeof thumbIcon === 'function'\n                ? thumbIcon({\n                    isSelected: !!isSelected,\n                    className: slots.thumbIcon({ class: classNames.thumbIcon }),\n                    width: '1em',\n                    height: '1em',\n                    'data-checked': isSelected ? 'true' : 'false',\n                  })\n                : thumbIcon}\n            </span>\n          </span>\n        ) : null}\n      </Component>\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default SwitchBox;\n","import SwitchBox from './SwitchBox';\n\nexport type { SwitchBoxProps } from './SwitchBox';\n\nexport { switchBoxVariants } from './SwitchBox';\nexport { SwitchBox };\n\nexport default SwitchBox;\n"],"mappings":"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"}
+{"version":3,"file":"SwitchBox-BwdvgHpG.cjs","names":["useUniformField","VisuallyHidden","SwitchBox"],"sources":["../src/SwitchBox/SwitchBox.tsx","../src/SwitchBox/index.ts"],"sourcesContent":["import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { useSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchBoxVariants = tv({\n  slots: {\n    box: 'group inline-flex w-full cursor-pointer items-center justify-between rounded-lg border-2 border-default hover:bg-content2 data-[selected=true]:border-focus',\n    description: 'text-foreground opacity-70',\n    icon: '',\n    label:\n      'font-medium text-foreground group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    wrapper: '',\n    thumb: '',\n    thumbIcon: '',\n  },\n  variants: {\n    isDisabled: {\n      true: {\n        box: 'pointer-events-none opacity-disabled',\n      },\n    },\n    isInvalid: {\n      true: {\n        box: '!border-danger',\n        label: '!text-danger',\n      },\n    },\n    size: {\n      sm: {\n        box: 'gap-2 p-3',\n        description: 'text-xs',\n        label: 'text-xs',\n      },\n      md: {\n        box: 'gap-4 p-4',\n        description: 'text-small',\n        label: 'text-sm',\n      },\n      lg: {\n        box: 'gap-4 p-5',\n        description: 'text-small',\n        label: 'text-base',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\ntype ClassName = TVClassName<typeof switchBoxVariants>;\n\nexport interface SwitchBoxProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** Description text displayed below the label */\n  description?: ReactNode;\n  /** whether the switch should be disabled */\n  disabled?: boolean;\n  /** Icon to be displayed in the box */\n  icon?: ReactNode;\n  /** component displayed as the label */\n  label?: ReactNode;\n  /** name the field is registered under */\n  name: string;\n  /** whether the field is required */\n  required?: boolean;\n  /* Size of the switch */\n  size?: 'sm' | 'md' | 'lg';\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** Icon to be displayed inside the thumb */\n  thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n * SwitchBox component - A card-like box with a switch control\n */\nconst SwitchBox = ({\n  className = undefined,\n  description = undefined,\n  icon = undefined,\n  name,\n  size = undefined,\n  thumbIcon = undefined,\n  ...uniformFieldProps\n}: SwitchBoxProps) => {\n  const {\n    defaultValue,\n    disabled,\n    errorMessage,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual switch to forward focus\n  const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n  // Use the useSwitch hook to get access to all the necessary props\n  const {\n    Component,\n    slots,\n    isSelected,\n    getBaseProps,\n    getInputProps,\n    getWrapperProps,\n  } = useSwitch({\n    defaultSelected: !!defaultValue,\n    isDisabled: disabled,\n    isSelected: !!field.value,\n    name: `${name}_switch`,\n    onValueChange: onChange,\n    size,\n    thumbIcon,\n  });\n\n  // classNames from slots\n  const variants = switchBoxVariants({\n    isDisabled: disabled,\n    isInvalid: invalid,\n    size,\n  });\n  const classNames = variantsToClassNames(variants, className, 'box');\n\n  return (\n    <div>\n      <Component\n        {...getBaseProps()}\n        className={classNames.box}\n        data-invalid={invalid}\n        data-required={required}\n        data-testid={testId}\n      >\n        <VisuallyHidden>\n          <input\n            ref={ref}\n            aria-label={typeof label === 'string' ? label : name}\n            checked={!!field.value}\n            name={name}\n            tabIndex={-1}\n            type=\"checkbox\"\n            onChange={(e) => {\n              onChange(e.target.checked);\n            }}\n            onFocus={() => {\n              // When RHF focuses this hidden input (e.g., on validation error),\n              // forward focus to the visual switch to show focus ring\n              visualSwitchRef.current?.focus();\n            }}\n          />\n          {/* Visual switch input for focus ring */}\n          <input\n            ref={visualSwitchRef}\n            {...getInputProps()}\n            onBlur={(e) => {\n              // Call HeroUI's internal onBlur to clear focus state and remove focus ring\n              getInputProps().onBlur?.(e);\n              // Then call RHF's onBlur to mark field as touched\n              onBlur();\n            }}\n          />\n        </VisuallyHidden>\n        {!icon ? (\n          <span\n            {...getWrapperProps()}\n            className={cn(getWrapperProps().className, classNames.wrapper)}\n          >\n            <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n              {thumbIcon && typeof thumbIcon === 'function'\n                ? thumbIcon({\n                    isSelected: !!isSelected,\n                    className: slots.thumbIcon({ class: classNames.thumbIcon }),\n                    width: '1em',\n                    height: '1em',\n                    'data-checked': isSelected ? 'true' : 'false',\n                  })\n                : thumbIcon}\n            </span>\n          </span>\n        ) : null}\n        {icon ? <div className={classNames.icon}>{icon}</div> : null}\n        <div className=\"grow\">\n          {label ? <div className={classNames.label}>{label}</div> : null}\n          {description ? (\n            <div className={classNames.description}>{description}</div>\n          ) : null}\n        </div>\n        {icon ? (\n          <span\n            {...getWrapperProps()}\n            className={cn(getWrapperProps().className, classNames.wrapper)}\n          >\n            <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n              {thumbIcon && typeof thumbIcon === 'function'\n                ? thumbIcon({\n                    isSelected: !!isSelected,\n                    className: slots.thumbIcon({ class: classNames.thumbIcon }),\n                    width: '1em',\n                    height: '1em',\n                    'data-checked': isSelected ? 'true' : 'false',\n                  })\n                : thumbIcon}\n            </span>\n          </span>\n        ) : null}\n      </Component>\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default SwitchBox;\n","import SwitchBox from './SwitchBox';\n\nexport type { SwitchBoxProps } from './SwitchBox';\n\nexport { switchBoxVariants } from './SwitchBox';\nexport { SwitchBox };\n\nexport default SwitchBox;\n"],"mappings":"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"}

package/dist/{SwitchBox-B6Z4rtWt.js → SwitchBox-CMw1MGJ0.js}

@@ -1,4 +1,4 @@
-import { t as useUniformField } from "./useUniformField-BKVVns0E.js";
+import { t as useUniformField } from "./useUniformField-D2NgevBI.js";
 import { cn, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
 import { useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -153,4 +153,4 @@ var SwitchBox_default = SwitchBox_default$1;
 
 //#endregion
 export { SwitchBox_default$1 as n, switchBoxVariants as r, SwitchBox_default as t };
-//# sourceMappingURL=SwitchBox-B6Z4rtWt.js.map
+//# sourceMappingURL=SwitchBox-CMw1MGJ0.js.map

package/dist/{SwitchBox-B6Z4rtWt.js.map → SwitchBox-CMw1MGJ0.js.map}

@@ -1 +1 @@
-{"version":3,"file":"SwitchBox-B6Z4rtWt.js","names":["SwitchBox"],"sources":["../src/SwitchBox/SwitchBox.tsx","../src/SwitchBox/index.ts"],"sourcesContent":["import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { useSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchBoxVariants = tv({\n  slots: {\n    box: 'group inline-flex w-full cursor-pointer items-center justify-between rounded-lg border-2 border-default hover:bg-content2 data-[selected=true]:border-focus',\n    description: 'text-foreground opacity-70',\n    icon: '',\n    label:\n      'font-medium text-foreground group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    wrapper: '',\n    thumb: '',\n    thumbIcon: '',\n  },\n  variants: {\n    isDisabled: {\n      true: {\n        box: 'pointer-events-none opacity-disabled',\n      },\n    },\n    isInvalid: {\n      true: {\n        box: '!border-danger',\n        label: '!text-danger',\n      },\n    },\n    size: {\n      sm: {\n        box: 'gap-2 p-3',\n        description: 'text-xs',\n        label: 'text-xs',\n      },\n      md: {\n        box: 'gap-4 p-4',\n        description: 'text-small',\n        label: 'text-sm',\n      },\n      lg: {\n        box: 'gap-4 p-5',\n        description: 'text-small',\n        label: 'text-base',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\ntype ClassName = TVClassName<typeof switchBoxVariants>;\n\nexport interface SwitchBoxProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** Description text displayed below the label */\n  description?: ReactNode;\n  /** whether the switch should be disabled */\n  disabled?: boolean;\n  /** Icon to be displayed in the box */\n  icon?: ReactNode;\n  /** component displayed as the label */\n  label?: ReactNode;\n  /** name the field is registered under */\n  name: string;\n  /** whether the field is required */\n  required?: boolean;\n  /* Size of the switch */\n  size?: 'sm' | 'md' | 'lg';\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** Icon to be displayed inside the thumb */\n  thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n * SwitchBox component - A card-like box with a switch control\n */\nconst SwitchBox = ({\n  className = undefined,\n  description = undefined,\n  icon = undefined,\n  name,\n  size = undefined,\n  thumbIcon = undefined,\n  ...uniformFieldProps\n}: SwitchBoxProps) => {\n  const {\n    defaultValue,\n    disabled,\n    errorMessage,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual switch to forward focus\n  const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n  // Use the useSwitch hook to get access to all the necessary props\n  const {\n    Component,\n    slots,\n    isSelected,\n    getBaseProps,\n    getInputProps,\n    getWrapperProps,\n  } = useSwitch({\n    defaultSelected: !!defaultValue,\n    isDisabled: disabled,\n    isSelected: !!field.value,\n    name: `${name}_switch`,\n    onValueChange: onChange,\n    size,\n    thumbIcon,\n  });\n\n  // classNames from slots\n  const variants = switchBoxVariants({\n    isDisabled: disabled,\n    isInvalid: invalid,\n    size,\n  });\n  const classNames = variantsToClassNames(variants, className, 'box');\n\n  return (\n    <div>\n      <Component\n        {...getBaseProps()}\n        className={classNames.box}\n        data-invalid={invalid}\n        data-required={required}\n        data-testid={testId}\n      >\n        <VisuallyHidden>\n          <input\n            ref={ref}\n            aria-label={typeof label === 'string' ? label : name}\n            checked={!!field.value}\n            name={name}\n            tabIndex={-1}\n            type=\"checkbox\"\n            onChange={(e) => {\n              onChange(e.target.checked);\n            }}\n            onFocus={() => {\n              // When RHF focuses this hidden input (e.g., on validation error),\n              // forward focus to the visual switch to show focus ring\n              visualSwitchRef.current?.focus();\n            }}\n          />\n          {/* Visual switch input for focus ring */}\n          <input\n            ref={visualSwitchRef}\n            {...getInputProps()}\n            onBlur={(e) => {\n              // Call HeroUI's internal onBlur to clear focus state and remove focus ring\n              getInputProps().onBlur?.(e);\n              // Then call RHF's onBlur to mark field as touched\n              onBlur();\n            }}\n          />\n        </VisuallyHidden>\n        {!icon ? (\n          <span\n            {...getWrapperProps()}\n            className={cn(getWrapperProps().className, classNames.wrapper)}\n          >\n            <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n              {thumbIcon && typeof thumbIcon === 'function'\n                ? thumbIcon({\n                    isSelected: !!isSelected,\n                    className: slots.thumbIcon({ class: classNames.thumbIcon }),\n                    width: '1em',\n                    height: '1em',\n                    'data-checked': isSelected ? 'true' : 'false',\n                  })\n                : thumbIcon}\n            </span>\n          </span>\n        ) : null}\n        {icon ? <div className={classNames.icon}>{icon}</div> : null}\n        <div className=\"grow\">\n          {label ? <div className={classNames.label}>{label}</div> : null}\n          {description ? (\n            <div className={classNames.description}>{description}</div>\n          ) : null}\n        </div>\n        {icon ? (\n          <span\n            {...getWrapperProps()}\n            className={cn(getWrapperProps().className, classNames.wrapper)}\n          >\n            <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n              {thumbIcon && typeof thumbIcon === 'function'\n                ? thumbIcon({\n                    isSelected: !!isSelected,\n                    className: slots.thumbIcon({ class: classNames.thumbIcon }),\n                    width: '1em',\n                    height: '1em',\n                    'data-checked': isSelected ? 'true' : 'false',\n                  })\n                : thumbIcon}\n            </span>\n          </span>\n        ) : null}\n      </Component>\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default SwitchBox;\n","import SwitchBox from './SwitchBox';\n\nexport type { SwitchBoxProps } from './SwitchBox';\n\nexport { switchBoxVariants } from './SwitchBox';\nexport { SwitchBox };\n\nexport default SwitchBox;\n"],"mappings":";;;;;;;;AAaA,MAAa,oBAAoB,GAAG;CAClC,OAAO;EACL,KAAK;EACL,aAAa;EACb,MAAM;EACN,OACE;EACF,SAAS;EACT,OAAO;EACP,WAAW;EACZ;CACD,UAAU;EACR,YAAY,EACV,MAAM,EACJ,KAAK,wCACN,EACF;EACD,WAAW,EACT,MAAM;GACJ,KAAK;GACL,OAAO;GACR,EACF;EACD,MAAM;GACJ,IAAI;IACF,KAAK;IACL,aAAa;IACb,OAAO;IACR;GACD,IAAI;IACF,KAAK;IACL,aAAa;IACb,OAAO;IACR;GACD,IAAI;IACF,KAAK;IACL,aAAa;IACb,OAAO;IACR;GACF;EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,CAAC;;;;AA8BF,MAAM,aAAa,EACjB,YAAY,QACZ,cAAc,QACd,OAAO,QACP,MACA,OAAO,QACP,YAAY,QACZ,GAAG,wBACiB;CACpB,MAAM,EACJ,cACA,UACA,cACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,WACE,gBAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,kBAAkB,OAAyB,KAAK;CAGtD,MAAM,EACJ,WACA,OACA,YACA,cACA,eACA,oBACE,UAAU;EACZ,iBAAiB,CAAC,CAAC;EACnB,YAAY;EACZ,YAAY,CAAC,CAAC,MAAM;EACpB,MAAM,GAAG,KAAK;EACd,eAAe;EACf;EACA;EACD,CAAC;CAQF,MAAM,aAAa,qBALF,kBAAkB;EACjC,YAAY;EACZ,WAAW;EACX;EACD,CAAC,EACgD,WAAW,MAAM;AAEnE,QACE,qBAAC,oBACC,qBAAC;EACC,GAAI,cAAc;EAClB,WAAW,WAAW;EACtB,gBAAc;EACd,iBAAe;EACf,eAAa;;GAEb,qBAAC,6BACC,oBAAC;IACM;IACL,cAAY,OAAO,UAAU,WAAW,QAAQ;IAChD,SAAS,CAAC,CAAC,MAAM;IACX;IACN,UAAU;IACV,MAAK;IACL,WAAW,MAAM;AACf,cAAS,EAAE,OAAO,QAAQ;;IAE5B,eAAe;AAGb,qBAAgB,SAAS,OAAO;;KAElC,EAEF,oBAAC;IACC,KAAK;IACL,GAAI,eAAe;IACnB,SAAS,MAAM;AAEb,oBAAe,CAAC,SAAS,EAAE;AAE3B,aAAQ;;KAEV,IACa;GAChB,CAAC,OACA,oBAAC;IACC,GAAI,iBAAiB;IACrB,WAAW,GAAG,iBAAiB,CAAC,WAAW,WAAW,QAAQ;cAE9D,oBAAC;KAAK,WAAW,GAAG,MAAM,MAAM,EAAE,OAAO,WAAW,OAAO,CAAC,CAAC;eAC1D,aAAa,OAAO,cAAc,aAC/B,UAAU;MACR,YAAY,CAAC,CAAC;MACd,WAAW,MAAM,UAAU,EAAE,OAAO,WAAW,WAAW,CAAC;MAC3D,OAAO;MACP,QAAQ;MACR,gBAAgB,aAAa,SAAS;MACvC,CAAC,GACF;MACC;KACF,GACL;GACH,OAAO,oBAAC;IAAI,WAAW,WAAW;cAAO;KAAW,GAAG;GACxD,qBAAC;IAAI,WAAU;eACZ,QAAQ,oBAAC;KAAI,WAAW,WAAW;eAAQ;MAAY,GAAG,MAC1D,cACC,oBAAC;KAAI,WAAW,WAAW;eAAc;MAAkB,GACzD;KACA;GACL,OACC,oBAAC;IACC,GAAI,iBAAiB;IACrB,WAAW,GAAG,iBAAiB,CAAC,WAAW,WAAW,QAAQ;cAE9D,oBAAC;KAAK,WAAW,GAAG,MAAM,MAAM,EAAE,OAAO,WAAW,OAAO,CAAC,CAAC;eAC1D,aAAa,OAAO,cAAc,aAC/B,UAAU;MACR,YAAY,CAAC,CAAC;MACd,WAAW,MAAM,UAAU,EAAE,OAAO,WAAW,WAAW,CAAC;MAC3D,OAAO;MACP,QAAQ;MACR,gBAAgB,aAAa,SAAS;MACvC,CAAC,GACF;MACC;KACF,GACL;;GACM,EACX,UACC,oBAAC;EACC,GAAI,uBAAuB;EAC3B,WAAW,GACT,uBAAuB,EAAE,WAEzB,aACD;YAED,oBAAC;GAAI,GAAI,sBAAsB;aAAG;IAAmB;GACjD,GACJ,QACA;;AAIV,0BAAe;;;;AC3Of,wBAAeA"}
+{"version":3,"file":"SwitchBox-CMw1MGJ0.js","names":["SwitchBox"],"sources":["../src/SwitchBox/SwitchBox.tsx","../src/SwitchBox/index.ts"],"sourcesContent":["import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { useSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchBoxVariants = tv({\n  slots: {\n    box: 'group inline-flex w-full cursor-pointer items-center justify-between rounded-lg border-2 border-default hover:bg-content2 data-[selected=true]:border-focus',\n    description: 'text-foreground opacity-70',\n    icon: '',\n    label:\n      'font-medium text-foreground group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    wrapper: '',\n    thumb: '',\n    thumbIcon: '',\n  },\n  variants: {\n    isDisabled: {\n      true: {\n        box: 'pointer-events-none opacity-disabled',\n      },\n    },\n    isInvalid: {\n      true: {\n        box: '!border-danger',\n        label: '!text-danger',\n      },\n    },\n    size: {\n      sm: {\n        box: 'gap-2 p-3',\n        description: 'text-xs',\n        label: 'text-xs',\n      },\n      md: {\n        box: 'gap-4 p-4',\n        description: 'text-small',\n        label: 'text-sm',\n      },\n      lg: {\n        box: 'gap-4 p-5',\n        description: 'text-small',\n        label: 'text-base',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\ntype ClassName = TVClassName<typeof switchBoxVariants>;\n\nexport interface SwitchBoxProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** Description text displayed below the label */\n  description?: ReactNode;\n  /** whether the switch should be disabled */\n  disabled?: boolean;\n  /** Icon to be displayed in the box */\n  icon?: ReactNode;\n  /** component displayed as the label */\n  label?: ReactNode;\n  /** name the field is registered under */\n  name: string;\n  /** whether the field is required */\n  required?: boolean;\n  /* Size of the switch */\n  size?: 'sm' | 'md' | 'lg';\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** Icon to be displayed inside the thumb */\n  thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n * SwitchBox component - A card-like box with a switch control\n */\nconst SwitchBox = ({\n  className = undefined,\n  description = undefined,\n  icon = undefined,\n  name,\n  size = undefined,\n  thumbIcon = undefined,\n  ...uniformFieldProps\n}: SwitchBoxProps) => {\n  const {\n    defaultValue,\n    disabled,\n    errorMessage,\n    field,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    invalid,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ref for the visual switch to forward focus\n  const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n  // Use the useSwitch hook to get access to all the necessary props\n  const {\n    Component,\n    slots,\n    isSelected,\n    getBaseProps,\n    getInputProps,\n    getWrapperProps,\n  } = useSwitch({\n    defaultSelected: !!defaultValue,\n    isDisabled: disabled,\n    isSelected: !!field.value,\n    name: `${name}_switch`,\n    onValueChange: onChange,\n    size,\n    thumbIcon,\n  });\n\n  // classNames from slots\n  const variants = switchBoxVariants({\n    isDisabled: disabled,\n    isInvalid: invalid,\n    size,\n  });\n  const classNames = variantsToClassNames(variants, className, 'box');\n\n  return (\n    <div>\n      <Component\n        {...getBaseProps()}\n        className={classNames.box}\n        data-invalid={invalid}\n        data-required={required}\n        data-testid={testId}\n      >\n        <VisuallyHidden>\n          <input\n            ref={ref}\n            aria-label={typeof label === 'string' ? label : name}\n            checked={!!field.value}\n            name={name}\n            tabIndex={-1}\n            type=\"checkbox\"\n            onChange={(e) => {\n              onChange(e.target.checked);\n            }}\n            onFocus={() => {\n              // When RHF focuses this hidden input (e.g., on validation error),\n              // forward focus to the visual switch to show focus ring\n              visualSwitchRef.current?.focus();\n            }}\n          />\n          {/* Visual switch input for focus ring */}\n          <input\n            ref={visualSwitchRef}\n            {...getInputProps()}\n            onBlur={(e) => {\n              // Call HeroUI's internal onBlur to clear focus state and remove focus ring\n              getInputProps().onBlur?.(e);\n              // Then call RHF's onBlur to mark field as touched\n              onBlur();\n            }}\n          />\n        </VisuallyHidden>\n        {!icon ? (\n          <span\n            {...getWrapperProps()}\n            className={cn(getWrapperProps().className, classNames.wrapper)}\n          >\n            <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n              {thumbIcon && typeof thumbIcon === 'function'\n                ? thumbIcon({\n                    isSelected: !!isSelected,\n                    className: slots.thumbIcon({ class: classNames.thumbIcon }),\n                    width: '1em',\n                    height: '1em',\n                    'data-checked': isSelected ? 'true' : 'false',\n                  })\n                : thumbIcon}\n            </span>\n          </span>\n        ) : null}\n        {icon ? <div className={classNames.icon}>{icon}</div> : null}\n        <div className=\"grow\">\n          {label ? <div className={classNames.label}>{label}</div> : null}\n          {description ? (\n            <div className={classNames.description}>{description}</div>\n          ) : null}\n        </div>\n        {icon ? (\n          <span\n            {...getWrapperProps()}\n            className={cn(getWrapperProps().className, classNames.wrapper)}\n          >\n            <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n              {thumbIcon && typeof thumbIcon === 'function'\n                ? thumbIcon({\n                    isSelected: !!isSelected,\n                    className: slots.thumbIcon({ class: classNames.thumbIcon }),\n                    width: '1em',\n                    height: '1em',\n                    'data-checked': isSelected ? 'true' : 'false',\n                  })\n                : thumbIcon}\n            </span>\n          </span>\n        ) : null}\n      </Component>\n      {invalid ? (\n        <div\n          {...getHelperWrapperProps()}\n          className={cn(\n            getHelperWrapperProps()?.className,\n            // force helper to be visible (for some reason it's hidden by default) and remove margin\n            'ml-0 block',\n          )}\n        >\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default SwitchBox;\n","import SwitchBox from './SwitchBox';\n\nexport type { SwitchBoxProps } from './SwitchBox';\n\nexport { switchBoxVariants } from './SwitchBox';\nexport { SwitchBox };\n\nexport default SwitchBox;\n"],"mappings":";;;;;;;;AAaA,MAAa,oBAAoB,GAAG;CAClC,OAAO;EACL,KAAK;EACL,aAAa;EACb,MAAM;EACN,OACE;EACF,SAAS;EACT,OAAO;EACP,WAAW;EACZ;CACD,UAAU;EACR,YAAY,EACV,MAAM,EACJ,KAAK,wCACN,EACF;EACD,WAAW,EACT,MAAM;GACJ,KAAK;GACL,OAAO;GACR,EACF;EACD,MAAM;GACJ,IAAI;IACF,KAAK;IACL,aAAa;IACb,OAAO;IACR;GACD,IAAI;IACF,KAAK;IACL,aAAa;IACb,OAAO;IACR;GACD,IAAI;IACF,KAAK;IACL,aAAa;IACb,OAAO;IACR;GACF;EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,CAAC;;;;AA8BF,MAAM,aAAa,EACjB,YAAY,QACZ,cAAc,QACd,OAAO,QACP,MACA,OAAO,QACP,YAAY,QACZ,GAAG,wBACiB;CACpB,MAAM,EACJ,cACA,UACA,cACA,OACA,sBACA,uBACA,SACA,OACA,QACA,UACA,KACA,UACA,WACE,gBAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,kBAAkB,OAAyB,KAAK;CAGtD,MAAM,EACJ,WACA,OACA,YACA,cACA,eACA,oBACE,UAAU;EACZ,iBAAiB,CAAC,CAAC;EACnB,YAAY;EACZ,YAAY,CAAC,CAAC,MAAM;EACpB,MAAM,GAAG,KAAK;EACd,eAAe;EACf;EACA;EACD,CAAC;CAQF,MAAM,aAAa,qBALF,kBAAkB;EACjC,YAAY;EACZ,WAAW;EACX;EACD,CAAC,EACgD,WAAW,MAAM;AAEnE,QACE,qBAAC,oBACC,qBAAC;EACC,GAAI,cAAc;EAClB,WAAW,WAAW;EACtB,gBAAc;EACd,iBAAe;EACf,eAAa;;GAEb,qBAAC,6BACC,oBAAC;IACM;IACL,cAAY,OAAO,UAAU,WAAW,QAAQ;IAChD,SAAS,CAAC,CAAC,MAAM;IACX;IACN,UAAU;IACV,MAAK;IACL,WAAW,MAAM;AACf,cAAS,EAAE,OAAO,QAAQ;;IAE5B,eAAe;AAGb,qBAAgB,SAAS,OAAO;;KAElC,EAEF,oBAAC;IACC,KAAK;IACL,GAAI,eAAe;IACnB,SAAS,MAAM;AAEb,oBAAe,CAAC,SAAS,EAAE;AAE3B,aAAQ;;KAEV,IACa;GAChB,CAAC,OACA,oBAAC;IACC,GAAI,iBAAiB;IACrB,WAAW,GAAG,iBAAiB,CAAC,WAAW,WAAW,QAAQ;cAE9D,oBAAC;KAAK,WAAW,GAAG,MAAM,MAAM,EAAE,OAAO,WAAW,OAAO,CAAC,CAAC;eAC1D,aAAa,OAAO,cAAc,aAC/B,UAAU;MACR,YAAY,CAAC,CAAC;MACd,WAAW,MAAM,UAAU,EAAE,OAAO,WAAW,WAAW,CAAC;MAC3D,OAAO;MACP,QAAQ;MACR,gBAAgB,aAAa,SAAS;MACvC,CAAC,GACF;MACC;KACF,GACL;GACH,OAAO,oBAAC;IAAI,WAAW,WAAW;cAAO;KAAW,GAAG;GACxD,qBAAC;IAAI,WAAU;eACZ,QAAQ,oBAAC;KAAI,WAAW,WAAW;eAAQ;MAAY,GAAG,MAC1D,cACC,oBAAC;KAAI,WAAW,WAAW;eAAc;MAAkB,GACzD;KACA;GACL,OACC,oBAAC;IACC,GAAI,iBAAiB;IACrB,WAAW,GAAG,iBAAiB,CAAC,WAAW,WAAW,QAAQ;cAE9D,oBAAC;KAAK,WAAW,GAAG,MAAM,MAAM,EAAE,OAAO,WAAW,OAAO,CAAC,CAAC;eAC1D,aAAa,OAAO,cAAc,aAC/B,UAAU;MACR,YAAY,CAAC,CAAC;MACd,WAAW,MAAM,UAAU,EAAE,OAAO,WAAW,WAAW,CAAC;MAC3D,OAAO;MACP,QAAQ;MACR,gBAAgB,aAAa,SAAS;MACvC,CAAC,GACF;MACC;KACF,GACL;;GACM,EACX,UACC,oBAAC;EACC,GAAI,uBAAuB;EAC3B,WAAW,GACT,uBAAuB,EAAE,WAEzB,aACD;YAED,oBAAC;GAAI,GAAI,sBAAsB;aAAG;IAAmB;GACjD,GACJ,QACA;;AAIV,0BAAe;;;;AC3Of,wBAAeA"}

package/dist/TextArea/index.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const require_TextArea = require('../TextArea-BqQtlPSV.cjs');
+const require_TextArea = require('../TextArea-COe8XP7f.cjs');
 
 exports.TextArea = require_TextArea.TextArea_default$1;
 exports.default = require_TextArea.TextArea_default;

package/dist/TextArea/index.d.cts

@@ -1,2 +1,2 @@
-import { n as TextAreaProps, t as TextArea } from "../index-C2A_i57R.cjs";
+import { n as TextAreaProps, t as TextArea } from "../index-CASoDHjE.cjs";
 export { TextArea, TextArea as default, TextAreaProps };

package/dist/TextArea/index.d.ts

@@ -1,2 +1,2 @@
-import { n as TextAreaProps, t as TextArea } from "../index-DnzC0GCS.js";
+import { n as TextAreaProps, t as TextArea } from "../index-CPbrUN5A.js";
 export { TextArea, TextArea as default, TextAreaProps };

package/dist/TextArea/index.js

@@ -1,3 +1,3 @@
-import { n as TextArea_default, t as TextArea_default$1 } from "../TextArea-DAx49KI6.js";
+import { n as TextArea_default, t as TextArea_default$1 } from "../TextArea-DTkDJr6g.js";
 
 export { TextArea_default as TextArea, TextArea_default$1 as default };

package/dist/{TextArea-BqQtlPSV.cjs → TextArea-COe8XP7f.cjs}

@@ -1,6 +1,6 @@
-const require_FormContext = require('./FormContext-Lw4YL4-B.cjs');
-const require_useUniformField = require('./useUniformField-D6fwSjrH.cjs');
-const require_useInputValueDebounce = require('./useInputValueDebounce-TiNR4jtG.cjs');
+const require_FormContext = require('./FormContext-CeFKQmVH.cjs');
+const require_useUniformField = require('./useUniformField-CGiibqg4.cjs');
+const require_useInputValueDebounce = require('./useInputValueDebounce-KIKsvSLm.cjs');
 let _fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
 let react_jsx_runtime = require("react/jsx-runtime");
 let _heroui_input = require("@heroui/input");
@@ -74,4 +74,4 @@ Object.defineProperty(exports, 'TextArea_default$1', {
     return TextArea_default$1;
   }
 });
-//# sourceMappingURL=TextArea-BqQtlPSV.cjs.map
+//# sourceMappingURL=TextArea-COe8XP7f.cjs.map

package/dist/{TextArea-BqQtlPSV.cjs.map → TextArea-COe8XP7f.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"TextArea-BqQtlPSV.cjs","names":["useUniformField","useInputValueDebounce","HeroTextArea","TextArea"],"sources":["../src/TextArea/TextArea.tsx","../src/TextArea/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { Textarea as HeroTextArea } from '@heroui/input';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useInputValueDebounce } from '../hooks/useInputValueDebounce';\nimport { useUniformField } from '../hooks/useUniformField';\n\n// input variants\nexport const textAreaVariants = tv({\n  slots: {\n    /** wrapper around the whole input */\n    base: '',\n    /** clear button */\n    clearButton: '',\n    /** actual input element */\n    input: '',\n    /** inner wrapper (HeroUI inputWrapper slot) */\n    inputWrapper: 'bg-content1 group-data-[focus=true]:border-focus',\n  },\n});\n\ntype VariantProps = TVProps<typeof textAreaVariants>;\ntype ClassName = TVClassName<typeof textAreaVariants>;\n\nexport interface TextAreaProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** Child components. The content of the textarea. */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: ClassName;\n  /** debounce delay in milliseconds for form state updates (default: 300ms) */\n  debounceDelay?: number;\n  /** Determines if the TextArea is disabled or not. */\n  disabled?: boolean;\n  /** Label displayed above the TextArea. */\n  label?: ReactNode;\n  /** Name the TextArea is registered at in HTML forms (react-hook-form). */\n  name: string;\n  /** placeholder for the textArea content. */\n  placeholder?: string;\n  /** Id to grab element in internal tests. */\n  testId?: string;\n}\n\n/**\n * TextArea component based on [HeroUI TextArea](https://www.heroui.com//docs/components/textarea)\n */\nconst TextArea = ({\n  children = null,\n  className: _className = undefined,\n  debounceDelay = 300,\n  name,\n  placeholder = ' ',\n  ...uniformFieldProps\n}: TextAreaProps) => {\n  const {\n    ariaLabel,\n    disabled,\n    errorMessage,\n    field: {\n      onChange: fieldOnChange,\n      onBlur: fieldOnBlur,\n      value: fieldValue,\n      ref,\n    },\n    invalid,\n    label,\n    required,\n    testId,\n  } = useUniformField({ name, ...uniformFieldProps });\n\n  // Use debounced handlers for form updates\n  const { onChange, onBlur, value } = useInputValueDebounce({\n    debounceDelay,\n    name,\n    onBlur: fieldOnBlur,\n    onChange: fieldOnChange,\n    value: fieldValue,\n  });\n\n  // classNames from slots\n  const variants = textAreaVariants();\n  const classNames = variantsToClassNames(variants, _className, 'base');\n\n  return (\n    <HeroTextArea\n      ref={ref}\n      data-testid={testId}\n      errorMessage={errorMessage}\n      id={testId}\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={label}\n      labelPlacement=\"outside\"\n      name={name}\n      onBlur={onBlur}\n      onChange={onChange}\n      placeholder={placeholder}\n      value={value}\n      variant=\"bordered\"\n      // Only add aria-label if there's no meaningful placeholder (HeroUI uses placeholder as aria-label)\n      aria-label={\n        !placeholder || placeholder.trim() === '' ? ariaLabel : undefined\n      }\n      classNames={{\n        base: classNames.base,\n        clearButton: classNames.clearButton,\n        // set padding to 0 for error message exit animation\n        helperWrapper: 'p-0',\n        input: classNames.input,\n        inputWrapper: classNames.inputWrapper,\n      }}\n    >\n      {children}\n    </HeroTextArea>\n  );\n};\n\nexport default TextArea;\n","import TextArea from './TextArea';\n\nexport type { TextAreaProps } from './TextArea';\n\nexport { TextArea };\n\nexport default TextArea;\n"],"mappings":";;;;;;;;AAWA,MAAa,kDAAsB,EACjC,OAAO;CAEL,MAAM;CAEN,aAAa;CAEb,OAAO;CAEP,cAAc;CACf,EACF,CAAC;;;;AA6BF,MAAM,YAAY,EAChB,WAAW,MACX,WAAW,aAAa,QACxB,gBAAgB,KAChB,MACA,cAAc,KACd,GAAG,wBACgB;CACnB,MAAM,EACJ,WACA,UACA,cACA,OAAO,EACL,UAAU,eACV,QAAQ,aACR,OAAO,YACP,OAEF,SACA,OACA,UACA,WACEA,wCAAgB;EAAE;EAAM,GAAG;EAAmB,CAAC;CAGnD,MAAM,EAAE,UAAU,QAAQ,UAAUC,oDAAsB;EACxD;EACA;EACA,QAAQ;EACR,UAAU;EACV,OAAO;EACR,CAAC;CAIF,MAAM,8DADW,kBAAkB,EACe,YAAY,OAAO;AAErE,QACE,2CAACC;EACM;EACL,eAAa;EACC;EACd,IAAI;EACJ,YAAY;EACZ,WAAW;EACX,YAAY;EACL;EACP,gBAAe;EACT;EACE;EACE;EACG;EACN;EACP,SAAQ;EAER,cACE,CAAC,eAAe,YAAY,MAAM,KAAK,KAAK,YAAY;EAE1D,YAAY;GACV,MAAM,WAAW;GACjB,aAAa,WAAW;GAExB,eAAe;GACf,OAAO,WAAW;GAClB,cAAc,WAAW;GAC1B;EAEA;GACY;;AAInB,yBAAe;;;;ACrHf,uBAAeC"}
+{"version":3,"file":"TextArea-COe8XP7f.cjs","names":["useUniformField","useInputValueDebounce","HeroTextArea","TextArea"],"sources":["../src/TextArea/TextArea.tsx","../src/TextArea/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { Textarea as HeroTextArea } from '@heroui/input';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useInputValueDebounce } from '../hooks/useInputValueDebounce';\nimport { useUniformField } from '../hooks/useUniformField';\n\n// input variants\nexport const textAreaVariants = tv({\n  slots: {\n    /** wrapper around the whole input */\n    base: '',\n    /** clear button */\n    clearButton: '',\n    /** actual input element */\n    input: '',\n    /** inner wrapper (HeroUI inputWrapper slot) */\n    inputWrapper: 'bg-content1 group-data-[focus=true]:border-focus',\n  },\n});\n\ntype VariantProps = TVProps<typeof textAreaVariants>;\ntype ClassName = TVClassName<typeof textAreaVariants>;\n\nexport interface TextAreaProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** Child components. The content of the textarea. */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: ClassName;\n  /** debounce delay in milliseconds for form state updates (default: 300ms) */\n  debounceDelay?: number;\n  /** Determines if the TextArea is disabled or not. */\n  disabled?: boolean;\n  /** Label displayed above the TextArea. */\n  label?: ReactNode;\n  /** Name the TextArea is registered at in HTML forms (react-hook-form). */\n  name: string;\n  /** placeholder for the textArea content. */\n  placeholder?: string;\n  /** Id to grab element in internal tests. */\n  testId?: string;\n}\n\n/**\n * TextArea component based on [HeroUI TextArea](https://www.heroui.com//docs/components/textarea)\n */\nconst TextArea = ({\n  children = null,\n  className: _className = undefined,\n  debounceDelay = 300,\n  name,\n  placeholder = ' ',\n  ...uniformFieldProps\n}: TextAreaProps) => {\n  const {\n    ariaLabel,\n    disabled,\n    errorMessage,\n    field: {\n      onChange: fieldOnChange,\n      onBlur: fieldOnBlur,\n      value: fieldValue,\n      ref,\n    },\n    invalid,\n    label,\n    required,\n    testId,\n  } = useUniformField({ name, ...uniformFieldProps });\n\n  // Use debounced handlers for form updates\n  const { onChange, onBlur, value } = useInputValueDebounce({\n    debounceDelay,\n    name,\n    onBlur: fieldOnBlur,\n    onChange: fieldOnChange,\n    value: fieldValue,\n  });\n\n  // classNames from slots\n  const variants = textAreaVariants();\n  const classNames = variantsToClassNames(variants, _className, 'base');\n\n  return (\n    <HeroTextArea\n      ref={ref}\n      data-testid={testId}\n      errorMessage={errorMessage}\n      id={testId}\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={label}\n      labelPlacement=\"outside\"\n      name={name}\n      onBlur={onBlur}\n      onChange={onChange}\n      placeholder={placeholder}\n      value={value}\n      variant=\"bordered\"\n      // Only add aria-label if there's no meaningful placeholder (HeroUI uses placeholder as aria-label)\n      aria-label={\n        !placeholder || placeholder.trim() === '' ? ariaLabel : undefined\n      }\n      classNames={{\n        base: classNames.base,\n        clearButton: classNames.clearButton,\n        // set padding to 0 for error message exit animation\n        helperWrapper: 'p-0',\n        input: classNames.input,\n        inputWrapper: classNames.inputWrapper,\n      }}\n    >\n      {children}\n    </HeroTextArea>\n  );\n};\n\nexport default TextArea;\n","import TextArea from './TextArea';\n\nexport type { TextAreaProps } from './TextArea';\n\nexport { TextArea };\n\nexport default TextArea;\n"],"mappings":";;;;;;;;AAWA,MAAa,kDAAsB,EACjC,OAAO;CAEL,MAAM;CAEN,aAAa;CAEb,OAAO;CAEP,cAAc;CACf,EACF,CAAC;;;;AA6BF,MAAM,YAAY,EAChB,WAAW,MACX,WAAW,aAAa,QACxB,gBAAgB,KAChB,MACA,cAAc,KACd,GAAG,wBACgB;CACnB,MAAM,EACJ,WACA,UACA,cACA,OAAO,EACL,UAAU,eACV,QAAQ,aACR,OAAO,YACP,OAEF,SACA,OACA,UACA,WACEA,wCAAgB;EAAE;EAAM,GAAG;EAAmB,CAAC;CAGnD,MAAM,EAAE,UAAU,QAAQ,UAAUC,oDAAsB;EACxD;EACA;EACA,QAAQ;EACR,UAAU;EACV,OAAO;EACR,CAAC;CAIF,MAAM,8DADW,kBAAkB,EACe,YAAY,OAAO;AAErE,QACE,2CAACC;EACM;EACL,eAAa;EACC;EACd,IAAI;EACJ,YAAY;EACZ,WAAW;EACX,YAAY;EACL;EACP,gBAAe;EACT;EACE;EACE;EACG;EACN;EACP,SAAQ;EAER,cACE,CAAC,eAAe,YAAY,MAAM,KAAK,KAAK,YAAY;EAE1D,YAAY;GACV,MAAM,WAAW;GACjB,aAAa,WAAW;GAExB,eAAe;GACf,OAAO,WAAW;GAClB,cAAc,WAAW;GAC1B;EAEA;GACY;;AAInB,yBAAe;;;;ACrHf,uBAAeC"}