@fuf-stack/uniform 1.8.10 → 1.10.0

package/dist/chunk-KOV7U4QA.cjs

@@ -0,0 +1,165 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkOED4DYBDcjs = require('./chunk-OED4DYBD.cjs');
+
+
+
+
+var _chunk555JRYCScjs = require('./chunk-555JRYCS.cjs');
+
+// src/Slider/Slider.tsx
+var _react = require('react');
+var _slider = require('@heroui/slider');
+var _visuallyhidden = require('@react-aria/visually-hidden');
+var _pixelutils = require('@fuf-stack/pixel-utils');
+var _jsxruntime = require('react/jsx-runtime');
+var sliderVariants = _pixelutils.tv.call(void 0, {
+  slots: {
+    base: "group",
+    endContent: "",
+    errorMessage: "ml-1 mt-1",
+    filler: "",
+    // see HeroUI styles for group-data condition,
+    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts
+    label: '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-["*"]',
+    labelWrapper: "",
+    mark: "",
+    startContent: "",
+    step: "",
+    thumb: "",
+    track: "",
+    trackWrapper: "",
+    value: ""
+  }
+});
+var Slider = (_a) => {
+  var _b = _a, {
+    className = void 0,
+    endContent = void 0,
+    fillOffset = void 0,
+    name,
+    showSteps = false,
+    size = "md",
+    startContent = void 0,
+    step = 1,
+    minValue = 0,
+    maxValue = 100
+  } = _b, uniformFieldProps = _chunk555JRYCScjs.__objRest.call(void 0, _b, [
+    "className",
+    "endContent",
+    "fillOffset",
+    "name",
+    "showSteps",
+    "size",
+    "startContent",
+    "step",
+    "minValue",
+    "maxValue"
+  ]);
+  const {
+    ariaLabel,
+    disabled,
+    field,
+    getErrorMessageProps,
+    getHelperWrapperProps,
+    invalid,
+    label,
+    onBlur,
+    onChange,
+    ref,
+    required,
+    errorMessage,
+    testId
+  } = _chunkOED4DYBDcjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
+    name
+  }, uniformFieldProps));
+  const visualSliderRef = _react.useRef.call(void 0, null);
+  const variants = sliderVariants();
+  const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
+  const currentValue = field.value != null ? Number(field.value) : minValue;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "div",
+    {
+      className: classNames.base,
+      "data-invalid": invalid,
+      "data-required": required,
+      "data-testid": testId,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _visuallyhidden.VisuallyHidden, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "input",
+          {
+            ref,
+            "aria-label": typeof label === "string" ? label : name,
+            disabled,
+            max: maxValue,
+            min: minValue,
+            name,
+            onBlur,
+            step,
+            tabIndex: -1,
+            type: "range",
+            value: currentValue,
+            onChange: (e) => {
+              onChange(Number(e.target.value));
+            },
+            onFocus: () => {
+              var _a2;
+              (_a2 = visualSliderRef.current) == null ? void 0 : _a2.focus();
+            }
+          }
+        ) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _slider.Slider,
+          {
+            ref: visualSliderRef,
+            "aria-label": ariaLabel,
+            color: invalid ? "danger" : "primary",
+            endContent,
+            fillOffset,
+            isDisabled: disabled,
+            label,
+            maxValue,
+            minValue,
+            name: `${name}_slider`,
+            onBlur,
+            showSteps,
+            size,
+            startContent,
+            step,
+            value: currentValue,
+            classNames: {
+              endContent: classNames.endContent,
+              filler: classNames.filler,
+              label: classNames.label,
+              labelWrapper: classNames.labelWrapper,
+              mark: classNames.mark,
+              startContent: classNames.startContent,
+              step: classNames.step,
+              thumb: classNames.thumb,
+              track: classNames.track,
+              trackWrapper: classNames.trackWrapper,
+              value: classNames.value
+            },
+            onChange: (value) => {
+              onChange(value);
+            },
+            onChangeEnd: (_value) => {
+              onBlur();
+            }
+          }
+        ),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, getHelperWrapperProps()), { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, getErrorMessageProps()), { children: errorMessage })) }))
+      ]
+    }
+  );
+};
+var Slider_default = Slider;
+
+// src/Slider/index.ts
+var Slider_default2 = Slider_default;
+
+
+
+
+exports.Slider_default = Slider_default; exports.Slider_default2 = Slider_default2;
+//# sourceMappingURL=chunk-KOV7U4QA.cjs.map

package/dist/chunk-KOV7U4QA.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-KOV7U4QA.cjs","../src/Slider/Slider.tsx","../src/Slider/index.ts"],"names":["_a","Slider_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-KOV7U4QA.cjs","sourcesContent":[null,"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 { 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={typeof label === 'string' ? label : name}\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        // Mark field as touched when tabbing away (keyboard navigation)\n        onBlur={onBlur}\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        onChange={(value) => {\n          onChange(value);\n        }}\n        // Mark field as touched when drag interaction ends (mouse/touch)\n        onChangeEnd={(_value) => {\n          onBlur();\n        }}\n      />\n      <div {...getHelperWrapperProps()}>\n        <div {...getErrorMessageProps()}>{errorMessage}</div>\n      </div>\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"]}

package/dist/{chunk-ZJDU5EPE.js → chunk-LEMQGDFE.js}

@@ -64,4 +64,4 @@ var useInputValueDebounce = ({
 export {
   useInputValueDebounce
 };
-//# sourceMappingURL=chunk-ZJDU5EPE.js.map
+//# sourceMappingURL=chunk-LEMQGDFE.js.map

package/dist/chunk-M5IL7INR.js

@@ -0,0 +1,219 @@
+import {
+  useUniformField
+} from "./chunk-4KEI3VRK.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-K2V4ULA2.js";
+
+// src/RadioBoxes/RadioBoxes.tsx
+import { RadioGroup as HeroRadioGroup } from "@heroui/radio";
+import { slugify, tv as tv2, variantsToClassNames as variantsToClassNames2 } from "@fuf-stack/pixel-utils";
+
+// src/RadioBoxes/RadioBox.tsx
+import { useRadio } from "@heroui/radio";
+import { VisuallyHidden } from "@react-aria/visually-hidden";
+import { cn, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+var radioBoxVariants = tv({
+  slots: {
+    base: "group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus",
+    control: "",
+    description: "text-foreground opacity-70 text-small",
+    icon: "",
+    label: "",
+    labelWrapper: "grow"
+  },
+  variants: {
+    isDisabled: {
+      true: {
+        base: "pointer-events-none opacity-disabled"
+      }
+    },
+    isInvalid: {
+      true: {
+        base: "!border-danger"
+      }
+    }
+  }
+});
+var RadioBox = (_a) => {
+  var _b = _a, {
+    classNames: _classNames = void 0,
+    icon = void 0,
+    isInvalid = false
+  } = _b, props = __objRest(_b, [
+    "classNames",
+    "icon",
+    "isInvalid"
+  ]);
+  const {
+    children,
+    Component,
+    description,
+    getBaseProps,
+    getControlProps,
+    getInputProps,
+    getLabelProps,
+    getLabelWrapperProps,
+    getWrapperProps,
+    isDisabled
+  } = useRadio(props);
+  const variants = radioBoxVariants({
+    isDisabled,
+    isInvalid
+  });
+  const classNames = variantsToClassNames(
+    variants,
+    // @ts-expect-error not sure here, but it works
+    _classNames,
+    "base"
+  );
+  return /* @__PURE__ */ jsxs(Component, __spreadProps(__spreadValues({}, getBaseProps()), { className: classNames.base, children: [
+    /* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx("input", __spreadValues({}, getInputProps())) }),
+    !icon ? /* @__PURE__ */ jsx("span", __spreadProps(__spreadValues({}, getWrapperProps()), { children: /* @__PURE__ */ jsx(
+      "span",
+      __spreadProps(__spreadValues({}, getControlProps()), {
+        className: cn(getControlProps().className, classNames.control)
+      })
+    ) })) : null,
+    icon ? /* @__PURE__ */ jsx("div", { className: classNames.icon, children: icon }) : null,
+    /* @__PURE__ */ jsxs(
+      "div",
+      __spreadProps(__spreadValues({}, getLabelWrapperProps()), {
+        className: cn(
+          getLabelWrapperProps().className,
+          classNames.labelWrapper
+        ),
+        children: [
+          children ? /* @__PURE__ */ jsx(
+            "span",
+            __spreadProps(__spreadValues({}, getLabelProps()), {
+              className: cn(getLabelProps().className, classNames.label),
+              children
+            })
+          ) : null,
+          description ? /* @__PURE__ */ jsx("div", { className: classNames.description, children: description }) : null
+        ]
+      })
+    ),
+    icon ? /* @__PURE__ */ jsx("span", __spreadProps(__spreadValues({}, getWrapperProps()), { children: /* @__PURE__ */ jsx(
+      "span",
+      __spreadProps(__spreadValues({}, getControlProps()), {
+        className: cn(getControlProps().className, classNames.control)
+      })
+    ) })) : null
+  ] }));
+};
+
+// src/RadioBoxes/RadioBoxes.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var radioBoxesVariants = tv2({
+  slots: {
+    base: "group gap-0",
+    // Needs group for group-data condition
+    boxBase: "",
+    boxControl: "",
+    boxDescription: "",
+    boxLabel: "",
+    boxLabelWrapper: "",
+    // see HeroUI styles for group-data condition,
+    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts
+    label: "mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger",
+    wrapper: ""
+  }
+});
+var RadioBoxes = (_a) => {
+  var _b = _a, {
+    className = void 0,
+    inline = false,
+    name,
+    options
+  } = _b, uniformFieldProps = __objRest(_b, [
+    "className",
+    "inline",
+    "name",
+    "options"
+  ]);
+  const {
+    ariaLabel,
+    defaultValue,
+    errorMessage,
+    invalid,
+    disabled,
+    label,
+    onBlur,
+    onChange,
+    ref,
+    required,
+    testId
+  } = useUniformField(__spreadValues({
+    name
+  }, uniformFieldProps));
+  const variants = radioBoxesVariants();
+  const classNames = variantsToClassNames2(variants, className, "base");
+  const boxClassNames = {
+    base: classNames.boxBase,
+    control: classNames.boxControl,
+    description: classNames.boxDescription,
+    label: classNames.boxLabel,
+    labelWrapper: classNames.boxLabelWrapper
+  };
+  return /* @__PURE__ */ jsx2(
+    HeroRadioGroup,
+    {
+      ref,
+      "aria-label": ariaLabel,
+      classNames,
+      "data-invalid": invalid,
+      "data-required": required,
+      "data-testid": testId,
+      defaultValue,
+      errorMessage,
+      isDisabled: disabled,
+      isInvalid: invalid,
+      isRequired: required,
+      label: label ? /* @__PURE__ */ jsx2("legend", { children: label }) : null,
+      name,
+      onBlur,
+      onValueChange: onChange,
+      orientation: inline ? "horizontal" : "vertical",
+      children: options.map((option) => {
+        var _a2, _b2;
+        if ("value" in option) {
+          const optionTestId = slugify(
+            `${testId}_option_${(_a2 = option.testId) != null ? _a2 : option.value}`,
+            { replaceDots: true }
+          );
+          return /* @__PURE__ */ jsx2(
+            RadioBox,
+            {
+              classNames: boxClassNames,
+              "data-testid": optionTestId,
+              description: option.description,
+              icon: option.icon,
+              isDisabled: !!disabled || option.disabled,
+              isInvalid: invalid,
+              value: option.value,
+              children: (_b2 = option.label) != null ? _b2 : option.value
+            },
+            option.value
+          );
+        }
+        return null;
+      })
+    }
+  );
+};
+var RadioBoxes_default = RadioBoxes;
+
+// src/RadioBoxes/index.ts
+var RadioBoxes_default2 = RadioBoxes_default;
+
+export {
+  radioBoxVariants,
+  RadioBoxes_default,
+  RadioBoxes_default2
+};
+//# sourceMappingURL=chunk-M5IL7INR.js.map

package/dist/chunk-M5IL7INR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/RadioBoxes/RadioBoxes.tsx","../src/RadioBoxes/RadioBox.tsx","../src/RadioBoxes/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n//\nimport type { RadioBoxProps } from './RadioBox';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\nimport { RadioBox } from './RadioBox';\n\nexport const radioBoxesVariants = tv({\n  slots: {\n    base: 'group gap-0', // Needs group for group-data condition\n    boxBase: '',\n    boxControl: '',\n    boxDescription: '',\n    boxLabel: '',\n    boxLabelWrapper: '',\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      'mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger',\n    wrapper: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof radioBoxesVariants>;\ntype ClassName = TVClassName<typeof radioBoxesVariants>;\n\nexport interface RadioBoxesOption {\n  /** Description of the value. Works with variant radioBox. */\n  description?: ReactNode;\n  /** disables the option */\n  disabled?: boolean;\n  /** option label */\n  label?: ReactNode;\n  /** option icon */\n  icon?: ReactNode;\n  /** HTML data-testid attribute of the option */\n  testId?: string;\n  /** option value */\n  value: string;\n}\n\nexport interface RadioBoxesProps 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  /** Determines if the Buttons are disabled or not. */\n  disabled?: boolean;\n  /** determines orientation of the Buttons. */\n  inline?: boolean;\n  /** Label displayed next to the RadioButton. */\n  label?: ReactNode;\n  /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n  name: string;\n  /** Radio button configuration. */\n  options: RadioBoxesOption[];\n  /** Id to grab element in internal tests. */\n  testId?: string;\n}\n\n/**\n * RadioBoxes component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n */\nconst RadioBoxes = ({\n  className = undefined,\n  inline = false,\n  name,\n  options,\n  ...uniformFieldProps\n}: RadioBoxesProps) => {\n  const {\n    ariaLabel,\n    defaultValue,\n    errorMessage,\n    invalid,\n    disabled,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // classNames from slots\n  const variants = radioBoxesVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n  const boxClassNames: RadioBoxProps['classNames'] = {\n    base: classNames.boxBase,\n    control: classNames.boxControl,\n    description: classNames.boxDescription,\n    label: classNames.boxLabel,\n    labelWrapper: classNames.boxLabelWrapper,\n  };\n\n  return (\n    <HeroRadioGroup\n      ref={ref}\n      aria-label={ariaLabel}\n      classNames={classNames}\n      // see HeroUI styles for group-data condition (data-invalid),\n      // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n      data-invalid={invalid}\n      data-required={required}\n      data-testid={testId}\n      defaultValue={defaultValue as string | undefined}\n      errorMessage={errorMessage}\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={label ? <legend>{label}</legend> : null}\n      name={name}\n      onBlur={onBlur}\n      onValueChange={onChange}\n      orientation={inline ? 'horizontal' : 'vertical'}\n    >\n      {options.map((option) => {\n        if ('value' in option) {\n          const optionTestId = slugify(\n            `${testId}_option_${option.testId ?? option.value}`,\n            { replaceDots: true },\n          );\n          return (\n            <RadioBox\n              key={option.value}\n              classNames={boxClassNames}\n              data-testid={optionTestId}\n              description={option.description}\n              icon={option.icon}\n              isDisabled={!!disabled || option.disabled}\n              isInvalid={invalid}\n              value={option.value}\n            >\n              {option.label ?? option.value}\n            </RadioBox>\n          );\n        }\n        return null;\n      })}\n    </HeroRadioGroup>\n  );\n};\n\nexport default RadioBoxes;\n","import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { RadioProps as HeroRadioProps } from '@heroui/radio';\nimport type { ReactNode } from 'react';\n\nimport { useRadio } from '@heroui/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nexport const radioBoxVariants = tv({\n  slots: {\n    base: 'group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus',\n    control: '',\n    description: 'text-foreground opacity-70 text-small',\n    icon: '',\n    label: '',\n    labelWrapper: 'grow',\n  },\n  variants: {\n    isDisabled: {\n      true: {\n        base: 'pointer-events-none opacity-disabled',\n      },\n    },\n    isInvalid: {\n      true: {\n        base: '!border-danger',\n      },\n    },\n  },\n});\n\ntype ClassName = TVClassName<typeof radioBoxVariants>;\n\nexport interface RadioBoxProps extends Omit<HeroRadioProps, 'className'> {\n  /** CSS class name */\n  className?: ClassName;\n  /** icon for the option */\n  icon?: ReactNode;\n  /** whether the radio is invalid */\n  isInvalid?: boolean;\n}\n\nexport const RadioBox = ({\n  classNames: _classNames = undefined,\n  icon = undefined,\n  isInvalid = false,\n  ...props\n}: RadioBoxProps) => {\n  const {\n    children,\n    Component,\n    description,\n    getBaseProps,\n    getControlProps,\n    getInputProps,\n    getLabelProps,\n    getLabelWrapperProps,\n    getWrapperProps,\n    isDisabled,\n  } = useRadio(props as HeroRadioProps);\n\n  // classNames from slots\n  const variants = radioBoxVariants({\n    isDisabled,\n    isInvalid,\n  });\n  const classNames = variantsToClassNames(\n    variants,\n    // @ts-expect-error not sure here, but it works\n    _classNames,\n    'base',\n  );\n\n  return (\n    <Component {...getBaseProps()} className={classNames.base}>\n      <VisuallyHidden>\n        <input {...getInputProps()} />\n      </VisuallyHidden>\n      {!icon ? (\n        <span {...getWrapperProps()}>\n          <span\n            {...getControlProps()}\n            className={cn(getControlProps().className, classNames.control)}\n          />\n        </span>\n      ) : null}\n      {icon ? <div className={classNames.icon}>{icon}</div> : null}\n      <div\n        {...getLabelWrapperProps()}\n        className={cn(\n          getLabelWrapperProps().className,\n          classNames.labelWrapper,\n        )}\n      >\n        {children ? (\n          <span\n            {...getLabelProps()}\n            className={cn(getLabelProps().className, classNames.label)}\n          >\n            {children}\n          </span>\n        ) : null}\n        {description ? (\n          <div className={classNames.description}>{description}</div>\n        ) : null}\n      </div>\n      {icon ? (\n        <span {...getWrapperProps()}>\n          <span\n            {...getControlProps()}\n            className={cn(getControlProps().className, classNames.control)}\n          />\n        </span>\n      ) : null}\n    </Component>\n  );\n};\n\nexport default RadioBox;\n","import RadioBoxes from './RadioBoxes';\n\nexport type { RadioBoxesProps } from './RadioBoxes';\nexport { radioBoxVariants } from './RadioBox';\n\nexport { RadioBoxes };\n\nexport default RadioBoxes;\n"],"mappings":";;;;;;;;;;AAKA,SAAS,cAAc,sBAAsB;AAE7C,SAAS,SAAS,MAAAA,KAAI,wBAAAC,6BAA4B;;;ACHlD,SAAS,gBAAgB;AACzB,SAAS,sBAAsB;AAE/B,SAAS,IAAI,IAAI,4BAA4B;AAsErC,cAWF,YAXE;AApED,IAAM,mBAAmB,GAAG;AAAA,EACjC,OAAO;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA,IACT,aAAa;AAAA,IACb,MAAM;AAAA,IACN,OAAO;AAAA,IACP,cAAc;AAAA,EAChB;AAAA,EACA,UAAU;AAAA,IACR,YAAY;AAAA,MACV,MAAM;AAAA,QACJ,MAAM;AAAA,MACR;AAAA,IACF;AAAA,IACA,WAAW;AAAA,MACT,MAAM;AAAA,QACJ,MAAM;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACF,CAAC;AAaM,IAAM,WAAW,CAAC,OAKJ;AALI,eACvB;AAAA,gBAAY,cAAc;AAAA,IAC1B,OAAO;AAAA,IACP,YAAY;AAAA,EA9Cd,IA2CyB,IAIpB,kBAJoB,IAIpB;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,SAAS,KAAuB;AAGpC,QAAM,WAAW,iBAAiB;AAAA,IAChC;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,aAAa;AAAA,IACjB;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,EACF;AAEA,SACE,qBAAC,4CAAc,aAAa,IAA3B,EAA8B,WAAW,WAAW,MACnD;AAAA,wBAAC,kBACC,8BAAC,4BAAU,cAAc,EAAG,GAC9B;AAAA,IACC,CAAC,OACA,oBAAC,yCAAS,gBAAgB,IAAzB,EACC;AAAA,MAAC;AAAA,uCACK,gBAAgB,IADrB;AAAA,QAEC,WAAW,GAAG,gBAAgB,EAAE,WAAW,WAAW,OAAO;AAAA;AAAA,IAC/D,IACF,IACE;AAAA,IACH,OAAO,oBAAC,SAAI,WAAW,WAAW,MAAO,gBAAK,IAAS;AAAA,IACxD;AAAA,MAAC;AAAA,uCACK,qBAAqB,IAD1B;AAAA,QAEC,WAAW;AAAA,UACT,qBAAqB,EAAE;AAAA,UACvB,WAAW;AAAA,QACb;AAAA,QAEC;AAAA,qBACC;AAAA,YAAC;AAAA,6CACK,cAAc,IADnB;AAAA,cAEC,WAAW,GAAG,cAAc,EAAE,WAAW,WAAW,KAAK;AAAA,cAExD;AAAA;AAAA,UACH,IACE;AAAA,UACH,cACC,oBAAC,SAAI,WAAW,WAAW,aAAc,uBAAY,IACnD;AAAA;AAAA;AAAA,IACN;AAAA,IACC,OACC,oBAAC,yCAAS,gBAAgB,IAAzB,EACC;AAAA,MAAC;AAAA,uCACK,gBAAgB,IADrB;AAAA,QAEC,WAAW,GAAG,gBAAgB,EAAE,WAAW,WAAW,OAAO;AAAA;AAAA,IAC/D,IACF,IACE;AAAA,MACN;AAEJ;;;ADCqB,gBAAAC,YAAA;AA1Gd,IAAM,qBAAqBC,IAAG;AAAA,EACnC,OAAO;AAAA,IACL,MAAM;AAAA;AAAA,IACN,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,UAAU;AAAA,IACV,iBAAiB;AAAA;AAAA;AAAA,IAGjB,OACE;AAAA,IACF,SAAS;AAAA,EACX;AACF,CAAC;AA0CD,IAAM,aAAa,CAAC,OAMG;AANH,eAClB;AAAA,gBAAY;AAAA,IACZ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,EAxEF,IAoEoB,IAKf,8BALe,IAKf;AAAA,IAJH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,gBAAgB;AAAA,IAClB;AAAA,KACG,kBACJ;AAGD,QAAM,WAAW,mBAAmB;AACpC,QAAM,aAAaC,sBAAqB,UAAU,WAAW,MAAM;AACnE,QAAM,gBAA6C;AAAA,IACjD,MAAM,WAAW;AAAA,IACjB,SAAS,WAAW;AAAA,IACpB,aAAa,WAAW;AAAA,IACxB,OAAO,WAAW;AAAA,IAClB,cAAc,WAAW;AAAA,EAC3B;AAEA,SACE,gBAAAF;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,cAAY;AAAA,MACZ;AAAA,MAGA,gBAAc;AAAA,MACd,iBAAe;AAAA,MACf,eAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,YAAY;AAAA,MACZ,OAAO,QAAQ,gBAAAA,KAAC,YAAQ,iBAAM,IAAY;AAAA,MAC1C;AAAA,MACA;AAAA,MACA,eAAe;AAAA,MACf,aAAa,SAAS,eAAe;AAAA,MAEpC,kBAAQ,IAAI,CAAC,WAAW;AA5H/B,YAAAG,KAAAC;AA6HQ,YAAI,WAAW,QAAQ;AACrB,gBAAM,eAAe;AAAA,YACnB,GAAG,MAAM,YAAWD,MAAA,OAAO,WAAP,OAAAA,MAAiB,OAAO,KAAK;AAAA,YACjD,EAAE,aAAa,KAAK;AAAA,UACtB;AACA,iBACE,gBAAAH;AAAA,YAAC;AAAA;AAAA,cAEC,YAAY;AAAA,cACZ,eAAa;AAAA,cACb,aAAa,OAAO;AAAA,cACpB,MAAM,OAAO;AAAA,cACb,YAAY,CAAC,CAAC,YAAY,OAAO;AAAA,cACjC,WAAW;AAAA,cACX,OAAO,OAAO;AAAA,cAEb,WAAAI,MAAA,OAAO,UAAP,OAAAA,MAAgB,OAAO;AAAA;AAAA,YATnB,OAAO;AAAA,UAUd;AAAA,QAEJ;AACA,eAAO;AAAA,MACT,CAAC;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,qBAAQ;;;AEhJf,IAAOC,sBAAQ;","names":["tv","variantsToClassNames","jsx","tv","variantsToClassNames","_a","_b","RadioBoxes_default"]}

package/dist/{chunk-R5AOS4DQ.js → chunk-MODH7W2M.js}

@@ -1,6 +1,6 @@
 import {
   useUniformField
-} from "./chunk-BIC7IWER.js";
+} from "./chunk-4KEI3VRK.js";
 import {
   useFormContext
 } from "./chunk-ZZW7JZ2U.js";
@@ -99,6 +99,7 @@ var Select = (_a) => {
   ]);
   var _a2;
   const {
+    ariaLabel,
     disabled,
     errorMessage,
     field: { onBlur, onChange, ref, value },
@@ -152,7 +153,7 @@ var Select = (_a) => {
             unstyled: true,
             "aria-errormessage": "",
             "aria-invalid": invalid,
-            "aria-labelledby": (_a2 = getTriggerProps()["aria-labelledby"]) == null ? void 0 : _a2.split(" ")[1],
+            "aria-label": ariaLabel,
             "data-testid": testId,
             filterOption,
             formatOptionLabel: renderOptionLabel,
@@ -167,6 +168,7 @@ var Select = (_a) => {
             onInputChange,
             options,
             placeholder,
+            "aria-labelledby": label ? (_a2 = getTriggerProps()["aria-labelledby"]) == null ? void 0 : _a2.split(" ")[1] : void 0,
             classNames: {
               control: () => {
                 return cn(classNames.control, {
@@ -287,4 +289,4 @@ export {
   Select_default,
   Select_default2
 };
-//# sourceMappingURL=chunk-R5AOS4DQ.js.map
+//# sourceMappingURL=chunk-MODH7W2M.js.map

package/dist/chunk-MODH7W2M.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Select/Select.tsx","../src/Select/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\nimport type { Props } from 'react-select';\n\nimport { useState } from 'react';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@heroui/select';\n\nimport { cn, slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks/useFormContext';\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const selectVariants = tv({\n  slots: {\n    base: 'group leading-normal',\n    clearIndicator:\n      'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n    control:\n      'duration-150! rounded-lg border-2 border-default-200 bg-content1 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n    control_focused: 'border-focus',\n    crossIcon: '',\n    downChevron: '',\n    dropdownIndicator:\n      'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n    group: '',\n    groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n    indicatorsContainer: 'gap-1 p-1',\n    indicatorSeparator: 'bg-default-300',\n    input: 'py-0.5 pl-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      'pointer-events-auto relative bottom-1.5 ml-1 subpixel-antialiased text-small 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    loadingIndicator: '',\n    loadingMessage: 'rounded-sm p-2 text-foreground-500',\n    menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n    menuList: '',\n    // ensure menu has same z-index as modal so it is visible when rendered in modal\n    // see: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n    menuPortal: 'z-50!',\n    multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n    multiValueContainer: '',\n    multiValueLabel: 'py-0.5 leading-6',\n    multiValueRemove:\n      'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n    noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n    option_focused: 'bg-default-100 active:bg-default-200',\n    option_selected: 'bg-default-300',\n    option: 'rounded px-3 py-2 hover:cursor-pointer',\n    placeholder: 'ml-1 py-0.5 pl-1 text-sm text-foreground-500',\n    selectContainer: '',\n    singleValue: 'ml-1! leading-7!',\n    valueContainer: 'gap-1 p-1',\n  },\n});\n\ninterface SelectOption {\n  /** option label */\n  label?: ReactNode;\n  /** option value */\n  value: string;\n}\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps 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; // string;\n  /** Determine if the  */\n  clearable?: boolean;\n  /** Set the select to disabled state. */\n  disabled?: boolean;\n  /** Filter Select Options */\n  filterOption?:\n    | undefined\n    | ((option?: SelectOption, inputValue?: string) => boolean);\n  /** Format the label of the option */\n  renderOptionLabel?: undefined | Props['formatOptionLabel'];\n  /** The value of the search input */\n  inputValue?: string;\n  /** Label that should be associated with the select. */\n  label?: ReactNode;\n  /** Set the select to a loading state. */\n  loading?: boolean;\n  /** switch between single and multi select mode. */\n  multiSelect?: boolean;\n  /** The name for the Select component, used by react-hook-form */\n  name: string;\n  /** Placeholder that is displayed when nothing is selected */\n  placeholder?: string;\n  /** The options for the Select component */\n  options: SelectOption[];\n  /** Handle change events on the input */\n  onInputChange?: Props['onInputChange'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}`;\n\n  return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}_select`;\n  return (\n    <div data-testid={testId}>\n      {}\n      <components.Control {...props} />\n    </div>\n  );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}_select_option_${slugify(props?.data?.testId ?? props?.data?.value, { replaceDots: true })}`;\n  return (\n    <div data-testid={testId}>\n      {}\n      <components.Option {...props} />\n    </div>\n  );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n  props,\n) => {\n  // @ts-expect-error data-testid is not a default prop\n\n  const testId = props?.selectProps['data-testid'] as string;\n  return (\n    <div data-testid={`${testId}_select_dropdown`}>\n      {}\n      <components.DropdownIndicator {...props} />\n    </div>\n  );\n};\n\n/** Select component based on [HeroUI Select](https://www.heroui.com//docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n  className = undefined,\n  clearable = true,\n  filterOption = undefined,\n  renderOptionLabel = undefined,\n  inputValue = undefined,\n  loading = false,\n  multiSelect = false,\n  name,\n  onInputChange = undefined,\n  options,\n  placeholder = undefined,\n  ...uniformFieldProps\n}: SelectProps) => {\n  const {\n    ariaLabel,\n    disabled,\n    errorMessage,\n    field: { onBlur, onChange, ref, value },\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    getLabelProps,\n    invalid,\n    label,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Get getFieldState to check isTouched in onChange callback\n  const { getFieldState } = useFormContext();\n\n  // Track if the select is focused\n  const [isFocused, setIsFocused] = useState(false);\n\n  // classNames from slots\n  const variants = selectVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  const { getBaseProps, getTriggerProps, getValueProps } = useSelect({\n    children: [],\n    classNames,\n    errorMessage,\n    isDisabled: disabled,\n    isInvalid: invalid,\n    isLoading: loading,\n    isRequired: required,\n    label,\n    labelPlacement: 'outside',\n  });\n\n  return (\n    <div\n      {...getBaseProps()}\n      className={cn(classNames.base)}\n      // see HeroUI styles for group-data condition (data-invalid),\n      // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n      data-required={required}\n      data-testid={`${testId}_wrapper`}\n    >\n      {label ? (\n        <label\n          className={classNames.label}\n          data-slot=\"label\"\n          htmlFor={`react-select-${name}-input`}\n          id={getLabelProps().id}\n        >\n          {label}\n        </label>\n      ) : null}\n      <ReactSelect\n        ref={ref}\n        menuShouldBlockScroll\n        unstyled\n        aria-errormessage=\"\"\n        aria-invalid={invalid}\n        aria-label={ariaLabel}\n        // Does not affect the testId of the select, but is needed to pass it to sub-components\n        data-testid={testId}\n        filterOption={filterOption}\n        formatOptionLabel={renderOptionLabel}\n        inputValue={inputValue}\n        instanceId={name}\n        isClearable={clearable}\n        isDisabled={disabled}\n        isLoading={loading}\n        isMulti={multiSelect}\n        // set menuPosition to fixed so that menu can be rendered\n        // inside Card / Modal components, menuShouldBlockScroll\n        // prevents container scroll when menu is open\n        menuPosition=\"fixed\"\n        name={name}\n        onInputChange={onInputChange}\n        options={options}\n        placeholder={placeholder}\n        // set aria-labelledby to the label id so that the select is accessible\n        aria-labelledby={\n          label\n            ? getTriggerProps()['aria-labelledby']?.split(' ')[1]\n            : undefined\n        }\n        classNames={{\n          control: () => {\n            return cn(classNames.control, {\n              [classNames.control_focused]: isFocused && !invalid,\n            });\n          },\n          clearIndicator: () => {\n            return classNames.clearIndicator;\n          },\n          dropdownIndicator: () => {\n            return classNames.dropdownIndicator;\n          },\n          groupHeading: () => {\n            return classNames.groupHeading;\n          },\n          indicatorsContainer: () => {\n            return classNames.indicatorsContainer;\n          },\n          indicatorSeparator: () => {\n            return classNames.indicatorSeparator;\n          },\n          loadingIndicator: () => {\n            return classNames.loadingIndicator;\n          },\n          loadingMessage: () => {\n            return classNames.loadingMessage;\n          },\n          input: () => {\n            return classNames.input;\n          },\n          menu: () => {\n            return classNames.menu;\n          },\n          menuList: () => {\n            return classNames.menuList;\n          },\n          menuPortal: () => {\n            return classNames.menuPortal;\n          },\n          multiValue: () => {\n            return classNames.multiValue;\n          },\n          multiValueLabel: () => {\n            return cn(\n              classNames.multiValueLabel,\n              `${getValueProps().className}`,\n            );\n          },\n          multiValueRemove: () => {\n            return classNames.multiValueRemove;\n          },\n          noOptionsMessage: () => {\n            return classNames.noOptionsMessage;\n          },\n          option: ({\n            isFocused: optionIsFocused,\n            isSelected: optionIsSelected,\n          }) => {\n            return cn(classNames.option, {\n              [classNames.option_focused]: optionIsFocused,\n              [classNames.option_selected]: optionIsSelected,\n            });\n          },\n          placeholder: () => {\n            return classNames.placeholder;\n          },\n          singleValue: () => {\n            return cn(classNames.singleValue, `${getValueProps().className}`);\n          },\n          valueContainer: () => {\n            return classNames.valueContainer;\n          },\n        }}\n        components={{\n          Input: InputComponent,\n          Option: OptionComponent,\n          DropdownIndicator: DropdownIndicatorComponent,\n          Control: ControlComponent,\n        }}\n        onBlur={(_e) => {\n          setIsFocused(false);\n          onBlur();\n        }}\n        onChange={(option) => {\n          if (multiSelect) {\n            onChange(\n              (option as SelectOption[])?.map((_option) => {\n                return _option.value;\n              }),\n            );\n          } else {\n            onChange((option as SelectOption)?.value);\n          }\n          // Mark field as touched immediately when a selection is made if not already touched\n          // This ensures validation errors show right away (isTouched becomes true)\n          // For Select components, selecting an option is a complete user action\n          // (unlike text inputs where typing is ongoing), so we mark as touched immediately\n          const { isTouched: currentIsTouched } = getFieldState(name, testId);\n          if (!currentIsTouched) {\n            onBlur();\n          }\n        }}\n        onFocus={(_e) => {\n          setIsFocused(true);\n        }}\n        // set complete option as value by current field value\n        value={options.find((option) => {\n          return option.value === value;\n        })}\n      />\n      {invalid ? (\n        <div {...getHelperWrapperProps()}>\n          <div {...getErrorMessageProps()}>{errorMessage}</div>\n        </div>\n      ) : null}\n    </div>\n  );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"],"mappings":"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","names":["_a","Select_default"]}

package/dist/chunk-MSJP25N4.cjs

@@ -0,0 +1,131 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkOED4DYBDcjs = require('./chunk-OED4DYBD.cjs');
+
+
+
+
+var _chunk555JRYCScjs = require('./chunk-555JRYCS.cjs');
+
+// src/Switch/Switch.tsx
+var _react = require('react');
+var _switch = require('@heroui/switch');
+var _visuallyhidden = require('@react-aria/visually-hidden');
+var _pixelutils = require('@fuf-stack/pixel-utils');
+var _jsxruntime = require('react/jsx-runtime');
+var switchVariants = _pixelutils.tv.call(void 0, {
+  slots: {
+    base: "",
+    endContent: "",
+    errorMessage: "ml-1 mt-1",
+    // see HeroUI styles for group-data condition,
+    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts
+    label: '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-["*"]',
+    outerWrapper: "place-content-center",
+    startContent: "",
+    thumb: "",
+    thumbIcon: "",
+    wrapper: ""
+  }
+});
+var Switch = (_a) => {
+  var _b = _a, {
+    className = void 0,
+    endContent = void 0,
+    name,
+    size = void 0,
+    startContent = void 0,
+    thumbIcon = void 0
+  } = _b, uniformFieldProps = _chunk555JRYCScjs.__objRest.call(void 0, _b, [
+    "className",
+    "endContent",
+    "name",
+    "size",
+    "startContent",
+    "thumbIcon"
+  ]);
+  var _a2;
+  const {
+    ariaLabel,
+    defaultValue,
+    disabled,
+    errorMessage,
+    field,
+    getErrorMessageProps,
+    getHelperWrapperProps,
+    invalid,
+    label,
+    onBlur,
+    onChange,
+    ref,
+    required,
+    testId
+  } = _chunkOED4DYBDcjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
+    name
+  }, uniformFieldProps));
+  const visualSwitchRef = _react.useRef.call(void 0, null);
+  const variants = switchVariants();
+  const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "outerWrapper");
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: classNames.outerWrapper, children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _visuallyhidden.VisuallyHidden, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "input",
+      {
+        ref,
+        "aria-label": typeof label === "string" ? label : name,
+        checked: !!field.value,
+        name,
+        onBlur,
+        type: "checkbox",
+        onChange: (e) => {
+          onChange(e.target.checked);
+        },
+        onFocus: () => {
+          var _a3;
+          (_a3 = visualSwitchRef.current) == null ? void 0 : _a3.focus();
+        }
+      }
+    ) }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _switch.Switch,
+      {
+        ref: visualSwitchRef,
+        "aria-label": ariaLabel,
+        classNames,
+        "data-invalid": invalid,
+        "data-required": required,
+        "data-testid": testId,
+        defaultSelected: !!defaultValue,
+        endContent,
+        isDisabled: disabled,
+        isSelected: !!field.value,
+        name: `${name}_switch`,
+        onValueChange: onChange,
+        size,
+        startContent,
+        thumbIcon,
+        children: label
+      }
+    ),
+    invalid ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "div",
+      _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, getHelperWrapperProps()), {
+        className: _pixelutils.cn.call(void 0, 
+          (_a2 = getHelperWrapperProps()) == null ? void 0 : _a2.className,
+          // force helper to be visible (for some reason it's hidden by default) and remove margin
+          "ml-0 block"
+        ),
+        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, getErrorMessageProps()), { children: errorMessage }))
+      })
+    ) : null
+  ] });
+};
+var Switch_default = Switch;
+
+// src/Switch/index.ts
+var Switch_default2 = Switch_default;
+
+
+
+
+exports.Switch_default = Switch_default; exports.Switch_default2 = Switch_default2;
+//# sourceMappingURL=chunk-MSJP25N4.cjs.map