@fuf-stack/uniform 0.19.3 → 0.20.1

package/dist/{chunk-EHTJ2BYB.cjs.map → chunk-DIVINFK2.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-EHTJ2BYB.cjs","../src/Switch/Switch.tsx","../src/Switch/index.ts"],"names":["Switch_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACA;ACdA,wCAAqC;AAErC,oDAAyC;AAuEnC,+CAAA;AAjEC,IAAM,eAAA,EAAiB,4BAAA;AAAG,EAC/B,KAAA,EAAO;AAAA,IACL,IAAA,EAAM,EAAA;AAAA,IACN,UAAA,EAAY,EAAA;AAAA,IACZ,YAAA,EAAc,WAAA;AAAA;AAAA;AAAA,IAGd,KAAA,EACE,yNAAA;AAAA,IACF,YAAA,EAAc,sBAAA;AAAA,IACd,YAAA,EAAc,EAAA;AAAA,IACd,KAAA,EAAO,EAAA;AAAA,IACP,SAAA,EAAW,EAAA;AAAA,IACX,OAAA,EAAS;AAAA,EACX;AACF,CAAC,CAAA;AAqBD,IAAM,OAAA,EAAS,CAAC;AAAA,EACd,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,SAAA,EAAW,KAAA;AAAA,EACX,KAAA,EAAO,OAAA,EAAS,KAAA,CAAA;AAAA,EAChB,IAAA;AAAA,EACA,MAAA,EAAQ,QAAA,EAAU,KAAA;AACpB,CAAA,EAAA,GAAmB;AACjB,EAAA,MAAM,EAAE,OAAA,EAAS,SAAA,EAAW,cAAc,EAAA,EAAI,8CAAA,CAAe;AAC7D,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,MAAA,EAAQ,QAAQ,EAAA,EAAI,aAAA,CAAc,IAAA,EAAM,OAAO,CAAA;AAExE,EAAA,MAAM,EAAE,MAAM,EAAA,EAAI,6CAAA,EAAgB,IAAA,EAAM,OAAA,EAAS,SAAS,CAAC,CAAA;AAC3D,EAAA,MAAM,EAAE,QAAA,EAAU,UAAA,EAAY,KAAA,EAAO,GAAA,EAAK,MAAA,EAAQ,SAAS,EAAA,EAAI,KAAA;AAE/D,EAAA,MAAM,EAAE,KAAA,EAAO,aAAA,EAAe,qBAAqB,EAAA,EAAI,wCAAA;AAAS,IAC9D,YAAA,EAAc,IAAA,CAAK,SAAA,CAAU,KAAK,CAAA;AAAA,IAClC,SAAA,EAAW,OAAA;AAAA,IACX,UAAA,EAAY,QAAA;AAAA,IACZ,KAAA,EAAO,MAAA;AAAA,IACP,cAAA,EAAgB,SAAA;AAAA,IAChB,WAAA,EAAa;AAAA,EACf,CAAC,CAAA;AAED,EAAA,MAAM,SAAA,EAAW,cAAA,CAAe,CAAA;AAChC,EAAA,MAAM,WAAA,EAAa,8CAAA,QAAqB,EAAU,SAAA,EAAW,cAAc,CAAA;AAE3E,EAAA,MAAM,qBAAA,EAAuB,UAAA,IAAc,eAAA;AAE3C,EAAA,uBACE,8BAAA,KAAC,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,YAAA,EACzB,QAAA,EAAA;AAAA,oBAAA,8BAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACC,kBAAA,EAAkB,aAAA,CAAc,CAAA,CAAE,kBAAkB,CAAA;AAAA,QACpD,UAAA;AAAA,QAGA,cAAA,EAAc,OAAA;AAAA,QACd,eAAA,EAAe,QAAA;AAAA,QACf,aAAA,EAAa,MAAA;AAAA,QACb,UAAA;AAAA,QACA,UAAA,EAAY,CAAC,CAAC,KAAA;AAAA,QACd,IAAA;AAAA,QACA,MAAA;AAAA,QACA,aAAA,EAAe,QAAA;AAAA,QACf,GAAA;AAAA,QACA,QAAA;AAAA,QACA,KAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,KAAA;AAAA,UACA,qBAAA,mBAAwB,6BAAA,+CAAC,EAAA,EAAsB,OAAA,CAAgB;AAAA,QAAA;AAAA,MAAA;AAAA,IAClE,CAAA;AAAA,IACC,MAAA,mBACC,6BAAA,KAAC,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,YAAA,EACzB,QAAA,kBAAA,6BAAA;AAAA,MAAC,KAAA;AAAA,MAAA,6CAAA,8CAAA,CAAA,CAAA,EAEK,oBAAA,CAAqB,CAAA,CAAA,EAF1B;AAAA,QAIC,QAAA,kBAAA,6BAAA,8CAAC,EAAA,EAAqB,KAAA,EAAc,OAAA,CAAgB;AAAA,MAAA,CAAA;AAAA,IACtD,EAAA,CACF;AAAA,EAAA,EAAA,CAEJ,CAAA;AAEJ,CAAA;AAEA,IAAO,eAAA,EAAQ,MAAA;ADpBf;AACA;AEpFA,IAAOA,gBAAAA,EAAQ,cAAA;AFsFf;AACA;AACE;AACA;AACF,mFAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-EHTJ2BYB.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\n\nimport { Switch as HeroSwitch } from '@heroui/switch';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useController, useFormContext, useInput } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\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  /** CSS class name */\n  className?: ClassName;\n  /** whether the select should be disabled */\n  disabled?: boolean;\n  /** component displayed next to the switch. */\n  label?: React.ReactNode;\n  /** name the field is registered under */\n  name: string;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n *  Switch component based on [HeroUI Switch](https://www.heroui.com//docs/components/switch)\n */\nconst Switch = ({\n  className = undefined,\n  disabled = false,\n  label: _label = undefined,\n  name,\n  testId: _testId = undefined,\n}: SwitchProps) => {\n  const { control, debugMode, getFieldState } = useFormContext();\n  const { error, required, testId, invalid } = getFieldState(name, _testId);\n\n  const { field } = useController({ name, control, disabled });\n  const { disabled: isDisabled, value, ref, onBlur, onChange } = field;\n\n  const { label, getInputProps, getErrorMessageProps } = useInput({\n    errorMessage: JSON.stringify(error),\n    isInvalid: invalid,\n    isRequired: required,\n    label: _label,\n    labelPlacement: 'outside',\n    placeholder: ' ',\n  });\n\n  const variants = switchVariants();\n  const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n\n  return (\n    <div className={classNames.outerWrapper}>\n      <HeroSwitch\n        aria-describedby={getInputProps()['aria-describedby']}\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        isDisabled={isDisabled}\n        isSelected={!!value}\n        name={name}\n        onBlur={onBlur}\n        onValueChange={onChange}\n        ref={ref}\n        required={required}\n        value={value}\n      >\n        {label}\n        {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n      </HeroSwitch>\n      {error && (\n        <div className={classNames.errorMessage}>\n          <div\n            /* eslint-disable-next-line react/jsx-props-no-spreading */\n            {...getErrorMessageProps()}\n          >\n            <FieldValidationError error={error} testId={testId} />\n          </div>\n        </div>\n      )}\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"]}
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-DIVINFK2.cjs","../src/Switch/Switch.tsx","../src/Switch/index.ts"],"names":["Switch_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACA;ACdA,wCAAqC;AAErC,oDAAyC;AAuEnC,+CAAA;AAjEC,IAAM,eAAA,EAAiB,4BAAA;AAAG,EAC/B,KAAA,EAAO;AAAA,IACL,IAAA,EAAM,EAAA;AAAA,IACN,UAAA,EAAY,EAAA;AAAA,IACZ,YAAA,EAAc,WAAA;AAAA;AAAA;AAAA,IAGd,KAAA,EACE,yNAAA;AAAA,IACF,YAAA,EAAc,sBAAA;AAAA,IACd,YAAA,EAAc,EAAA;AAAA,IACd,KAAA,EAAO,EAAA;AAAA,IACP,SAAA,EAAW,EAAA;AAAA,IACX,OAAA,EAAS;AAAA,EACX;AACF,CAAC,CAAA;AAqBD,IAAM,OAAA,EAAS,CAAC;AAAA,EACd,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,SAAA,EAAW,KAAA;AAAA,EACX,KAAA,EAAO,OAAA,EAAS,KAAA,CAAA;AAAA,EAChB,IAAA;AAAA,EACA,MAAA,EAAQ,QAAA,EAAU,KAAA;AACpB,CAAA,EAAA,GAAmB;AACjB,EAAA,MAAM,EAAE,OAAA,EAAS,SAAA,EAAW,cAAc,EAAA,EAAI,8CAAA,CAAe;AAC7D,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,MAAA,EAAQ,QAAQ,EAAA,EAAI,aAAA,CAAc,IAAA,EAAM,OAAO,CAAA;AAExE,EAAA,MAAM,EAAE,MAAM,EAAA,EAAI,6CAAA,EAAgB,IAAA,EAAM,OAAA,EAAS,SAAS,CAAC,CAAA;AAC3D,EAAA,MAAM,EAAE,QAAA,EAAU,UAAA,EAAY,KAAA,EAAO,GAAA,EAAK,MAAA,EAAQ,SAAS,EAAA,EAAI,KAAA;AAE/D,EAAA,MAAM,EAAE,KAAA,EAAO,aAAA,EAAe,qBAAqB,EAAA,EAAI,wCAAA;AAAS,IAC9D,YAAA,EAAc,IAAA,CAAK,SAAA,CAAU,KAAK,CAAA;AAAA,IAClC,SAAA,EAAW,OAAA;AAAA,IACX,UAAA,EAAY,QAAA;AAAA,IACZ,KAAA,EAAO,MAAA;AAAA,IACP,cAAA,EAAgB,SAAA;AAAA,IAChB,WAAA,EAAa;AAAA,EACf,CAAC,CAAA;AAED,EAAA,MAAM,SAAA,EAAW,cAAA,CAAe,CAAA;AAChC,EAAA,MAAM,WAAA,EAAa,8CAAA,QAAqB,EAAU,SAAA,EAAW,cAAc,CAAA;AAE3E,EAAA,MAAM,qBAAA,EAAuB,UAAA,IAAc,eAAA;AAE3C,EAAA,uBACE,8BAAA,KAAC,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,YAAA,EACzB,QAAA,EAAA;AAAA,oBAAA,8BAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACC,kBAAA,EAAkB,aAAA,CAAc,CAAA,CAAE,kBAAkB,CAAA;AAAA,QACpD,UAAA;AAAA,QAGA,cAAA,EAAc,OAAA;AAAA,QACd,eAAA,EAAe,QAAA;AAAA,QACf,aAAA,EAAa,MAAA;AAAA,QACb,UAAA;AAAA,QACA,UAAA,EAAY,CAAC,CAAC,KAAA;AAAA,QACd,IAAA;AAAA,QACA,MAAA;AAAA,QACA,aAAA,EAAe,QAAA;AAAA,QACf,GAAA;AAAA,QACA,QAAA;AAAA,QACA,KAAA;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,KAAA;AAAA,UACA,qBAAA,mBAAwB,6BAAA,+CAAC,EAAA,EAAsB,OAAA,CAAgB;AAAA,QAAA;AAAA,MAAA;AAAA,IAClE,CAAA;AAAA,IACC,MAAA,mBACC,6BAAA,KAAC,EAAA,EAAI,SAAA,EAAW,UAAA,CAAW,YAAA,EACzB,QAAA,kBAAA,6BAAA;AAAA,MAAC,KAAA;AAAA,MAAA,6CAAA,8CAAA,CAAA,CAAA,EAEK,oBAAA,CAAqB,CAAA,CAAA,EAF1B;AAAA,QAIC,QAAA,kBAAA,6BAAA,8CAAC,EAAA,EAAqB,KAAA,EAAc,OAAA,CAAgB;AAAA,MAAA,CAAA;AAAA,IACtD,EAAA,CACF;AAAA,EAAA,EAAA,CAEJ,CAAA;AAEJ,CAAA;AAEA,IAAO,eAAA,EAAQ,MAAA;ADpBf;AACA;AEpFA,IAAOA,gBAAAA,EAAQ,cAAA;AFsFf;AACA;AACE;AACA;AACF,mFAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-DIVINFK2.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\n\nimport { Switch as HeroSwitch } from '@heroui/switch';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useController, useFormContext, useInput } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\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  /** CSS class name */\n  className?: ClassName;\n  /** whether the select should be disabled */\n  disabled?: boolean;\n  /** component displayed next to the switch. */\n  label?: React.ReactNode;\n  /** name the field is registered under */\n  name: string;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n *  Switch component based on [HeroUI Switch](https://www.heroui.com//docs/components/switch)\n */\nconst Switch = ({\n  className = undefined,\n  disabled = false,\n  label: _label = undefined,\n  name,\n  testId: _testId = undefined,\n}: SwitchProps) => {\n  const { control, debugMode, getFieldState } = useFormContext();\n  const { error, required, testId, invalid } = getFieldState(name, _testId);\n\n  const { field } = useController({ name, control, disabled });\n  const { disabled: isDisabled, value, ref, onBlur, onChange } = field;\n\n  const { label, getInputProps, getErrorMessageProps } = useInput({\n    errorMessage: JSON.stringify(error),\n    isInvalid: invalid,\n    isRequired: required,\n    label: _label,\n    labelPlacement: 'outside',\n    placeholder: ' ',\n  });\n\n  const variants = switchVariants();\n  const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n\n  return (\n    <div className={classNames.outerWrapper}>\n      <HeroSwitch\n        aria-describedby={getInputProps()['aria-describedby']}\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        isDisabled={isDisabled}\n        isSelected={!!value}\n        name={name}\n        onBlur={onBlur}\n        onValueChange={onChange}\n        ref={ref}\n        required={required}\n        value={value}\n      >\n        {label}\n        {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n      </HeroSwitch>\n      {error && (\n        <div className={classNames.errorMessage}>\n          <div\n            /* eslint-disable-next-line react/jsx-props-no-spreading */\n            {...getErrorMessageProps()}\n          >\n            <FieldValidationError error={error} testId={testId} />\n          </div>\n        </div>\n      )}\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"]}

package/dist/{chunk-Q5KXDJU7.cjs → chunk-EBMEIX2P.cjs}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkF4VYFBYCcjs = require('./chunk-F4VYFBYC.cjs');
+var _chunkGDNP6OU3cjs = require('./chunk-GDNP6OU3.cjs');
 
 // src/SubmitButton/SubmitButton.tsx
 var _pixelutils = require('@fuf-stack/pixel-utils');
@@ -17,13 +17,13 @@ var SubmitButton = ({
   const {
     formState: { isSubmitting },
     triggerSubmit
-  } = _chunkF4VYFBYCcjs.useFormContext.call(void 0, );
+  } = _chunkGDNP6OU3cjs.useFormContext.call(void 0, );
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     _pixels.Button,
     {
       className: _pixelutils.cn.call(void 0, className),
       color,
-      testId: _pixelutils.slugify.call(void 0, testId),
+      testId: _pixelutils.slugify.call(void 0, testId, { replaceDots: true }),
       disabled: isSubmitting,
       loading: loading || isSubmitting,
       onClick: triggerSubmit,
@@ -42,4 +42,4 @@ var SubmitButton_default2 = SubmitButton_default;
 
 
 exports.SubmitButton_default = SubmitButton_default; exports.SubmitButton_default2 = SubmitButton_default2;
-//# sourceMappingURL=chunk-Q5KXDJU7.cjs.map
+//# sourceMappingURL=chunk-EBMEIX2P.cjs.map

package/dist/chunk-EBMEIX2P.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-EBMEIX2P.cjs","../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACA;ACDA,oDAA4B;AAC5B,2CAAuB;AAoCnB,+CAAA;AAdJ,IAAM,aAAA,EAAe,CAAC;AAAA,EACpB,SAAA,EAAW,QAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,MAAA,EAAQ,SAAA;AAAA,EACR,QAAA,EAAU,KAAA;AAAA,EACV,KAAA,EAAO,IAAA;AAAA,EACP,OAAA,EAAS;AACX,CAAA,EAAA,GAAyB;AACvB,EAAA,MAAM;AAAA,IACJ,SAAA,EAAW,EAAE,aAAa,CAAA;AAAA,IAC1B;AAAA,EACF,EAAA,EAAI,8CAAA,CAAe;AAEnB,EAAA,uBACE,6BAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,4BAAA,SAAY,CAAA;AAAA,MACvB,KAAA;AAAA,MACA,MAAA,EAAQ,iCAAA,MAAQ,EAAQ,EAAE,WAAA,EAAa,KAAK,CAAC,CAAA;AAAA,MAC7C,QAAA,EAAU,YAAA;AAAA,MACV,OAAA,EAAS,QAAA,GAAW,YAAA;AAAA,MAIpB,OAAA,EAAS,aAAA;AAAA,MACT,IAAA;AAAA,MACA,IAAA,EAAK,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACH,CAAA;AAEJ,CAAA;AAEA,IAAO,qBAAA,EAAQ,YAAA;ADtBf;AACA;AE/BA,IAAOA,sBAAAA,EAAQ,oBAAA;AFiCf;AACA;AACE;AACA;AACF,2GAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-EBMEIX2P.cjs","sourcesContent":[null,"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';\n\nexport interface SubmitButtonProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** color of the button */\n  color?: ButtonProps['color'];\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** size of the 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  children = 'Submit',\n  className = undefined,\n  color = 'success',\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      className={cn(className)}\n      color={color}\n      testId={slugify(testId, { replaceDots: true })}\n      disabled={isSubmitting}\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      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"]}

package/dist/{chunk-F4VYFBYC.cjs → chunk-GDNP6OU3.cjs}

@@ -258,7 +258,7 @@ var useFormContext = () => {
       error,
       // Ensure correct type for error
       required,
-      testId: _pixelutils.slugify.call(void 0, testId || name)
+      testId: _pixelutils.slugify.call(void 0, testId || name, { replaceDots: true })
     });
   };
   return _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, otherMethods), uniformContext), {
@@ -279,4 +279,4 @@ var _input = require('@heroui/input');
 
 
 exports.FormContext_default = FormContext_default; exports.useClientValidation = useClientValidation; exports.useController = useController; exports.useFieldArray = _reacthookform.useFieldArray; exports.checkFieldIsRequired = checkFieldIsRequired; exports.useFormContext = useFormContext; exports.useInput = _input.useInput;
-//# sourceMappingURL=chunk-F4VYFBYC.cjs.map
+//# sourceMappingURL=chunk-GDNP6OU3.cjs.map

package/dist/chunk-GDNP6OU3.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-GDNP6OU3.cjs","../src/hooks/useClientValidation/useClientValidation.ts","../src/Form/subcomponents/FormContext.tsx","../src/Form/subcomponents/FormResolver.ts","../src/hooks/useController/useController.ts","../src/hooks/useFieldArray/useFieldArray.ts","../src/hooks/useFormContext/useFormContext.ts","../src/hooks/useInput/useInput.ts"],"names":["useState","useMemo","useContext","_a"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-GDNP6OU3.cjs","sourcesContent":[null,"/* eslint-disable import/prefer-default-export */\n\nimport type { VetoTypeAny } from '@fuf-stack/veto';\n\nimport { useContext, useEffect, useId } from 'react';\n\nimport { UniformContext } from '../../Form/subcomponents/FormContext';\n\n/**\n * Hook for adding dynamic client-side validation to forms.\n *\n * Automatically manages validation schema lifecycle: sets schema when data is provided,\n * clears schema when data is null/undefined, and cleans up on unmount.\n *\n * @param data - Data to create validation schema from (or null/undefined to clear validation)\n * @param schemaFactory - Function that creates a validation schema from the data.\n */\nexport const useClientValidation = <TData = unknown>(\n  data: TData | null | undefined,\n  schemaFactory: (data: TData) => VetoTypeAny,\n): void => {\n  const {\n    validation: { setClientValidationSchema },\n  } = useContext(UniformContext);\n  const key = useId(); // Auto-generate unique key\n\n  // Use data hash instead of object reference to avoid unnecessary re-runs\n  // when data object reference changes but data remains the same\n  const dataHash = JSON.stringify(data);\n\n  // Single effect to manage validation schema lifecycle\n  useEffect(() => {\n    // Set validation schema when data is available\n    if (data != null) {\n      const validationSchema = schemaFactory(data);\n      setClientValidationSchema(key, validationSchema);\n    } else {\n      // Clear validation schema when no data\n      setClientValidationSchema(key, null);\n    }\n\n    // Cleanup on unmount or when dependencies change\n    return () => setClientValidationSchema(key, null);\n    // Only re-run when data (dataHash) or key changes\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [dataHash, key]);\n};\n","import type {\n  VetoFormattedError,\n  VetoInstance,\n  VetoTypeAny,\n} from '@fuf-stack/veto';\nimport type { BaseSyntheticEvent, ReactNode } from 'react';\nimport type { FieldValues, SubmitHandler } from 'react-hook-form';\n\nimport React, { useMemo, useState } from 'react';\nimport { FormProvider as HookFormProvider, useForm } from 'react-hook-form';\n\nimport { useLocalStorage } from '@fuf-stack/pixels';\n\nimport { useExtendedValidation, useFormResolver } from './FormResolver';\n\ntype DebugMode = 'debug' | 'debug-testids' | 'off' | 'disabled';\n\nexport type DebugModeSettings = {\n  /** disable form debug completely */\n  disable?: boolean;\n  /** custom localStorage key to save debug mode state */\n  localStorageKey?: string;\n};\n\nconst DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT = 'uniform:debug-mode';\n\n/**\n * The `UniformContext` provides control over the form's submission behavior and may optionally include\n * a Veto validation schema for form validation.\n *\n * Specifically, this context offers:\n * 1. **Form Submission Control**: The `preventSubmit` function allows components to enable or disable\n *    form submissions.\n * 2. **Optional Validation Schema**: The `validation` property may hold a Veto validation schema instance\n *    that can be used to validate form fields and handle validation logic.\n * 3. **Client Validation**: The `setClientValidationSchema` function allows setting dynamic client-side\n *    validation schemas that complement the base Veto validation.\n *\n * This context is useful for components that need to interact with or control the form submission state,\n * or access the validation schema for managing form validation logic.\n */\nexport const UniformContext = React.createContext<{\n  /** Form debug mode enabled or not */\n  debugMode: DebugMode;\n  /** settings for from debug mode */\n  debugModeSettings?: DebugModeSettings;\n  /** Function to update if the form can currently be submitted */\n  preventSubmit: (prevent: boolean) => void;\n  /** Setter to enable or disable form debug mode */\n  setDebugMode: (debugMode: DebugMode) => void;\n  /** Function to trigger form submit programmatically */\n  triggerSubmit: (e?: BaseSyntheticEvent) => Promise<void> | void;\n  /** Form validation configuration */\n  validation: {\n    /** Veto validation schema instance for form validation */\n    instance?: VetoInstance;\n    /** Current validation errors in form */\n    errors?: VetoFormattedError;\n    /** Function to set client validation schema for a specific key */\n    setClientValidationSchema: (\n      key: string,\n      schema: VetoTypeAny | null,\n    ) => void;\n  };\n}>({\n  debugMode: 'off',\n  preventSubmit: () => undefined,\n  setDebugMode: () => undefined,\n  triggerSubmit: () => undefined,\n  validation: {\n    setClientValidationSchema: () => undefined,\n  },\n});\n\n// Define props for the FormProvider component, extending HookForm's props\ninterface FormProviderProps {\n  /** children form render function */\n  children: (childProps: {\n    handleSubmit: (e?: BaseSyntheticEvent) => Promise<void>;\n  }) => ReactNode;\n  /** settings for from debug mode */\n  debugModeSettings?: DebugModeSettings;\n  /** initial form values */\n  initialValues?: FieldValues;\n  /** form submit handler */\n  onSubmit: SubmitHandler<FieldValues>;\n  /** Veto validation schema instance */\n  validation?: VetoInstance;\n  /** when the validation should be triggered */\n  validationTrigger: 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';\n}\n\n/**\n * FormProvider component provides:\n * - Veto validation schema context\n * - Client validation schema management\n * - Submit handler creation and submission control with preventSubmit\n * - Form Debug Mode state\n * - React Hook Form context\n */\nconst FormProvider: React.FC<FormProviderProps> = ({\n  children,\n  debugModeSettings = undefined,\n  initialValues = undefined,\n  onSubmit,\n  validation: baseValidation = undefined,\n  validationTrigger,\n}) => {\n  // Form Debug mode state is handled in the form context\n  const [debugMode, setDebugMode] = useLocalStorage<DebugMode>(\n    debugModeSettings?.localStorageKey || DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT,\n    'off',\n  );\n\n  // Create extended validation combining base + client validations\n  const { extendedValidation, setClientValidationSchema } =\n    useExtendedValidation(baseValidation);\n\n  // Create resolver from extended validation + get current validation errors\n  const { resolver, validationErrors, validationErrorsHash } =\n    useFormResolver(extendedValidation);\n\n  // Initialize react hook form with the resolver\n  const methods = useForm({\n    defaultValues: initialValues,\n    // set rhf mode\n    // see: https://react-hook-form.com/docs/useform#mode\n    mode: validationTrigger,\n    resolver,\n  });\n\n  // Control if the form can currently be submitted\n  const [preventSubmit, setPreventSubmit] = useState(false);\n\n  // Create submit handler\n  // eslint-disable-next-line consistent-return\n  const handleSubmit = async (e?: React.BaseSyntheticEvent) => {\n    // only prevent submit when form state is valid, because otherwise\n    // submit will only trigger validation and add errors / focus invalid fields\n    if (methods.formState.isValid && preventSubmit) {\n      console.warn(\n        '[FormProvider] form submit was prevented because preventSubmit is true...',\n      );\n      e?.preventDefault();\n      return Promise.resolve();\n    }\n    await methods.handleSubmit(onSubmit)(e);\n  };\n\n  // Memoize the context value to prevent re-renders\n  const contextValue = useMemo(\n    () => ({\n      // set debugMode to disabled when debugModeSettings.disable is true\n      // otherwise use current debug mode from localStorage\n      debugMode: debugModeSettings?.disable ? 'disabled' : debugMode,\n      preventSubmit: (prevent: boolean) => {\n        setPreventSubmit(prevent);\n      },\n      setClientValidationSchema,\n      setDebugMode,\n      triggerSubmit: handleSubmit,\n      validation: {\n        instance: extendedValidation,\n        errors: validationErrors,\n        setClientValidationSchema,\n      },\n    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [debugMode, debugModeSettings?.disable, validationErrorsHash],\n  );\n\n  return (\n    <UniformContext.Provider value={contextValue}>\n      {/* Spread all hook form props into HookFormProvider */}\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n      <HookFormProvider {...methods}>\n        {children({ handleSubmit })}\n      </HookFormProvider>\n    </UniformContext.Provider>\n  );\n};\n\nexport default FormProvider;\n","/* eslint-disable import/prefer-default-export */\n\nimport type {\n  VetoFormattedError,\n  VetoInstance,\n  VetoTypeAny,\n} from '@fuf-stack/veto';\nimport type { FieldValues } from 'react-hook-form';\n\nimport { useMemo, useRef, useState } from 'react';\n\nimport { and, serializeSchema, veto } from '@fuf-stack/veto';\n\n/**\n * Hook that manages client validation schemas state.\n *\n * Provides a centralized way to add/remove dynamic validation schemas\n * that can be combined with base form validation.\n *\n * @returns Object with client validation state and memoized setter function\n */\nexport const useClientValidationManager = () => {\n  // Client validation schemas state\n  const [clientValidationSchemas, setClientValidationSchemas] = useState<\n    Record<string, VetoTypeAny>\n  >({});\n\n  // Memoized function to set/clear client validation schema\n  const setClientValidationSchema = useMemo(\n    () => {\n      return (key: string, schema: VetoTypeAny | null) => {\n        // if no schema and no client validation schemas, do nothing\n        if (!clientValidationSchemas[key] && !schema) {\n          return;\n        }\n        // update client validation schemas\n        setClientValidationSchemas((prev) => {\n          if (!schema) {\n            const { [key]: _removed, ...rest } = prev;\n            return rest;\n          }\n          return { ...prev, [key]: schema };\n        });\n      };\n    },\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  return {\n    clientValidationSchemas,\n    setClientValidationSchema,\n  };\n};\n\n/**\n * Hook that creates an extended validation instance combining base Veto validation with dynamic client validation.\n *\n * @param baseValidation - Optional base Veto validation schema\n * @returns Combined validation instance and client schema setter\n */\nexport const useExtendedValidation = (baseValidation?: VetoInstance) => {\n  // Setup client validation schemas\n  const { clientValidationSchemas, setClientValidationSchema } =\n    useClientValidationManager();\n\n  // Create client schema hash for optimized memoization\n  const clientValidationSchemasHash = JSON.stringify(\n    Object.values(clientValidationSchemas).map((schema) =>\n      serializeSchema(schema),\n    ),\n  );\n\n  // Create a stable dependency array from the client validation schemas\n  const clientSchemaValues = useMemo(\n    () => {\n      const keys = Object.keys(clientValidationSchemas).sort();\n      return keys.map((key) => clientValidationSchemas[key]).filter(Boolean);\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [clientValidationSchemasHash],\n  );\n\n  // Memoized extended validation instance\n  const extendedValidation = useMemo(\n    () => {\n      const hasBaseValidation = !!baseValidation;\n      const hasClientSchemas = clientSchemaValues.length > 0;\n\n      // If no base validation and no client schemas, return undefined\n      if (!hasBaseValidation && !hasClientSchemas) {\n        return undefined;\n      }\n\n      // If no client schemas, return base validation\n      if (!hasClientSchemas) {\n        return baseValidation;\n      }\n\n      // Combine client validation schemas\n      const clientSchemasCombined = clientSchemaValues.reduce(\n        (combined, clientSchema) => {\n          return combined ? and(combined, clientSchema) : clientSchema;\n        },\n        null,\n      );\n\n      // return combined validation\n      if (hasBaseValidation && clientSchemasCombined) {\n        return veto(\n          and((baseValidation as VetoInstance).schema, clientSchemasCombined),\n        );\n      }\n\n      // If we only have client schemas, return them as a veto instance\n      if (clientSchemasCombined) {\n        return veto(clientSchemasCombined);\n      }\n\n      // This should not happen due to the conditions above, but just in case\n      return baseValidation;\n    },\n    // Using hash-based dependency to optimize performance\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [clientValidationSchemasHash],\n  );\n\n  return {\n    extendedValidation,\n    setClientValidationSchema,\n  };\n};\n\n/**\n * Hook that creates a React Hook Form resolver from an extended validation instance.\n *\n * @param extendedValidation - Extended validation instance from useExtendedValidation\n * @returns Object containing resolver function, current validation errors, and optimization hash\n */\nexport const useFormResolver = (extendedValidation?: VetoInstance) => {\n  // Use ref to store validation errors without triggering re-renders\n  const validationErrors = useRef<VetoFormattedError>(undefined);\n\n  // Memoized resolver function for React Hook Form\n  const resolver = useMemo(() => {\n    if (!extendedValidation) {\n      return undefined;\n    }\n\n    return async (values: FieldValues) => {\n      const result = await extendedValidation.validateAsync(values);\n      validationErrors.current = result.errors;\n      return result;\n    };\n  }, [extendedValidation]);\n\n  // Hash for memo dependency optimization in consuming components\n  const validationErrorsHash = JSON.stringify(validationErrors.current);\n\n  return {\n    resolver,\n    validationErrors: validationErrors.current,\n    validationErrorsHash,\n  };\n};\n","/* eslint-disable import/prefer-default-export */\n\nimport type {\n  ControllerFieldState,\n  ControllerRenderProps,\n  UseControllerProps as RHFUseControllerProps,\n  UseFormStateReturn,\n} from 'react-hook-form';\n\nimport { useController as useRHFController } from 'react-hook-form';\n\nimport { fromNullishString, toNullishString } from '../../helpers';\n\nexport type UseControllerProps<TFieldValues extends object = object> =\n  RHFUseControllerProps<TFieldValues>;\n\nexport type UseControllerReturn<TFieldValues extends object = object> = {\n  field: Omit<ControllerRenderProps<TFieldValues>, 'onChange' | 'value'> & {\n    // Using any[] to support both direct value changes and React synthetic events\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    onChange: (...event: any[]) => void;\n    value: string;\n  };\n  formState: UseFormStateReturn<TFieldValues>;\n  fieldState: ControllerFieldState;\n};\n\n/**\n * A wrapper around react-hook-form's useController that transparently handles nullish string conversions.\n *\n * Key features:\n * 1. Empty strings ('') in the UI are stored as null in form state\n * 2. Null/undefined values in form state are displayed as empty strings in the UI\n * 3. Handles both direct value changes and React synthetic events\n * 4. Maintains the same API as react-hook-form's useController\n *\n * This enables consistent handling of empty/null values while keeping a clean API\n * for form inputs that expect string values.\n *\n * @see https://react-hook-form.com/docs/usecontroller\n */\nexport const useController = <TFieldValues extends object = object>(\n  props: UseControllerProps<TFieldValues>,\n): UseControllerReturn<TFieldValues> => {\n  const { field, formState, fieldState } = useRHFController(props);\n\n  return {\n    field: {\n      ...field,\n      // Handles both direct values (onChange(\"value\")) and events (onChange(event))\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      onChange: (...event: any[]) => {\n        const value = event[0]?.target?.value ?? event[0];\n        field.onChange(toNullishString(value));\n      },\n      // Convert null/undefined to empty string for UI display\n      value: fromNullishString(field.value) as string,\n    },\n    formState,\n    fieldState,\n  };\n};\n","/* eslint-disable import/prefer-default-export */\n\n/** @see https://react-hook-form.com/docs/usefieldarray */\nexport { useFieldArray } from 'react-hook-form';\n","import type { VetoInstance } from '@fuf-stack/veto';\nimport type { FieldError } from 'react-hook-form';\n\nimport { useContext } from 'react';\nimport { useFormContext as useHookFormContext } from 'react-hook-form';\n\nimport { slugify } from '@fuf-stack/pixel-utils';\n\nimport { UniformContext } from '../../Form/subcomponents/FormContext';\n\n/** Schema check whether a field is required or optional */\nexport const checkFieldIsRequired = (\n  validation: VetoInstance,\n  path: string[],\n): boolean => {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const checkRequired = (schema: any) => {\n    // arrays with minLength are required\n    if (schema.type === 'array' && schema?.minLength) {\n      return true;\n    }\n    // all other fields are required if they are\n    // not optional and not nullable\n    return !schema.isOptional && !schema.isNullable;\n  };\n\n  return validation.checkSchemaPath(checkRequired, path);\n};\n\n/**\n * Custom hook that extends react-hook-form's useFormContext to add validation and state management.\n */\nexport const useFormContext = () => {\n  const {\n    formState,\n    // https://react-hook-form.com/docs/useform/getfieldstate\n    // for getFieldState a subscription to formState properties is needed!\n    getFieldState: getFieldStateOrig,\n    ...otherMethods\n  } = useHookFormContext();\n\n  const uniformContext = useContext(UniformContext);\n\n  /**\n   * Updated getFieldState method which returns:\n   * - Whether the field is required by checking the validation schema\n   * - Existing field state information (errors, etc.)\n   */\n  const getFieldState = (name: string, testId?: string) => {\n    const fieldPath =\n      typeof name === 'string' ? name.replace(/\\[\\d+\\]/g, '').split('.') : name;\n\n    // Check if the field is required using the validation schema\n    const required = uniformContext?.validation.instance\n      ? checkFieldIsRequired(uniformContext.validation.instance, fieldPath)\n      : false;\n\n    // Get the original field state (errors, etc.) from react-hook-form\n    const { error, ...rest } = getFieldStateOrig(name, formState);\n\n    return {\n      ...rest,\n      error: error as FieldError[] | undefined, // Ensure correct type for error\n      required,\n      testId: slugify(testId || name, { replaceDots: true }),\n    };\n  };\n\n  return {\n    ...otherMethods,\n    ...uniformContext,\n    getFieldState,\n    formState,\n  };\n};\n","/* eslint-disable import/prefer-default-export */\nexport { useInput } from '@heroui/input';\n"]}

package/dist/{chunk-RKZQKPRJ.cjs → chunk-H5JXWAGH.cjs}

@@ -7,7 +7,7 @@ var _chunkPA2DQCBYcjs = require('./chunk-PA2DQCBY.cjs');
 
 
 
-var _chunkF4VYFBYCcjs = require('./chunk-F4VYFBYC.cjs');
+var _chunkGDNP6OU3cjs = require('./chunk-GDNP6OU3.cjs');
 
 
 
@@ -67,7 +67,7 @@ var ControlComponent = (props) => {
 };
 var OptionComponent = (props) => {
   var _a, _b, _c;
-  const testId = `${props.selectProps["data-testid"]}_select_option_${_pixelutils.slugify.call(void 0, (_c = (_a = props == null ? void 0 : props.data) == null ? void 0 : _a.testId) != null ? _c : (_b = props == null ? void 0 : props.data) == null ? void 0 : _b.value)}`;
+  const testId = `${props.selectProps["data-testid"]}_select_option_${_pixelutils.slugify.call(void 0, (_c = (_a = props == null ? void 0 : props.data) == null ? void 0 : _a.testId) != null ? _c : (_b = props == null ? void 0 : props.data) == null ? void 0 : _b.value, { replaceDots: true })}`;
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { "data-testid": testId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactselect.components.Option, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, props)) });
 };
 var DropdownIndicatorComponent = (props) => {
@@ -91,9 +91,9 @@ var Select = ({
   testId: _testId = void 0
 }) => {
   var _a;
-  const { control, debugMode, getFieldState } = _chunkF4VYFBYCcjs.useFormContext.call(void 0, );
+  const { control, debugMode, getFieldState } = _chunkGDNP6OU3cjs.useFormContext.call(void 0, );
   const { error, invalid, required, testId } = getFieldState(name, _testId);
-  const { field } = _chunkF4VYFBYCcjs.useController.call(void 0, { control, disabled, name });
+  const { field } = _chunkGDNP6OU3cjs.useController.call(void 0, { control, disabled, name });
   const { onChange, value, ref, onBlur } = field;
   const [isFocused, setIsFocused] = _react.useState.call(void 0, false);
   const variants = selectVariants();
@@ -233,4 +233,4 @@ var Select_default2 = Select_default;
 
 
 exports.Select_default = Select_default; exports.Select_default2 = Select_default2;
-//# sourceMappingURL=chunk-RKZQKPRJ.cjs.map
+//# sourceMappingURL=chunk-H5JXWAGH.cjs.map

package/dist/{chunk-RKZQKPRJ.cjs.map → chunk-H5JXWAGH.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-RKZQKPRJ.cjs","../src/Select/Select.tsx","../src/Select/index.ts"],"names":["Select_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-RKZQKPRJ.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\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 { useController, useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\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      'rounded-lg border-2 border-default-200 !duration-150 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 text-small 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    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\ntype SelectOption = {\n  /** option label */\n  label?: React.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  /** 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?: React.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/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}`;\n  // eslint-disable-next-line react/jsx-props-no-spreading\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/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}_select`;\n  return (\n    <div data-testid={testId}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\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/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}_select_option_${slugify(props?.data?.testId ?? props?.data?.value)}`;\n  return (\n    <div data-testid={testId}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\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  // eslint-disable-next-line react/prop-types\n  const testId = props?.selectProps['data-testid'] as string;\n  return (\n    <div data-testid={`${testId}_select_dropdown`}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\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  disabled = false,\n  filterOption = undefined,\n  renderOptionLabel = undefined,\n  inputValue = undefined,\n  label: _label = undefined,\n  loading = false,\n  multiSelect = false,\n  name,\n  onInputChange = undefined,\n  options,\n  placeholder = undefined,\n  testId: _testId = undefined,\n}: SelectProps) => {\n  const { control, debugMode, getFieldState } = useFormContext();\n  const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n  const { field } = useController({ control, disabled, name });\n  const { onChange, value, ref, onBlur } = field;\n\n  const [isFocused, setIsFocused] = useState(false);\n\n  const variants = selectVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  const {\n    getBaseProps,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    getLabelProps,\n    getTriggerProps,\n    getValueProps,\n    label,\n  } = useSelect({\n    children: [],\n    classNames,\n    errorMessage: JSON.stringify(error),\n    isDisabled: disabled,\n    isInvalid: invalid,\n    isLoading: loading,\n    isRequired: required,\n    label: _label,\n    labelPlacement: 'outside',\n    placeholder: ' ',\n  });\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  return (\n    <div\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...getBaseProps()}\n      className={cn(classNames.base)}\n      data-testid={`${testId}_wrapper`}\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    >\n      {showLabel && (\n        <label\n          className={classNames.label}\n          data-slot=\"label\"\n          htmlFor={`react-select-${name}-input`}\n          id={getLabelProps().id}\n        >\n          {label}\n          {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n        </label>\n      )}\n      <ReactSelect\n        aria-errormessage=\"\"\n        aria-labelledby={getTriggerProps()['aria-labelledby']?.split(' ')[1]}\n        aria-invalid={invalid}\n        classNames={{\n          control: () =>\n            cn(classNames.control, {\n              [classNames.control_focused]: isFocused && !invalid,\n            }),\n          clearIndicator: () => classNames.clearIndicator,\n          dropdownIndicator: () => classNames.dropdownIndicator,\n          groupHeading: () => classNames.groupHeading,\n          indicatorsContainer: () => classNames.indicatorsContainer,\n          indicatorSeparator: () => classNames.indicatorSeparator,\n          loadingIndicator: () => classNames.loadingIndicator,\n          loadingMessage: () => classNames.loadingMessage,\n          input: () => classNames.input,\n          menu: () => classNames.menu,\n          menuList: () => classNames.menuList,\n          menuPortal: () => classNames.menuPortal,\n          multiValue: () => classNames.multiValue,\n          multiValueLabel: () =>\n            cn(classNames.multiValueLabel, `${getValueProps().className}`),\n          multiValueRemove: () => classNames.multiValueRemove,\n          noOptionsMessage: () => classNames.noOptionsMessage,\n          option: ({\n            isFocused: optionIsFocused,\n            isSelected: optionIsSelected,\n          }) =>\n            cn(classNames.option, {\n              [classNames.option_focused]: optionIsFocused,\n              [classNames.option_selected]: optionIsSelected,\n            }),\n          placeholder: () => classNames.placeholder,\n          singleValue: () =>\n            cn(classNames.singleValue, `${getValueProps().className}`),\n          valueContainer: () => classNames.valueContainer,\n        }}\n        components={{\n          Input: InputComponent,\n          Option: OptionComponent,\n          DropdownIndicator: DropdownIndicatorComponent,\n          Control: ControlComponent,\n        }}\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        name={name}\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        menuShouldBlockScroll\n        options={options}\n        placeholder={placeholder}\n        onBlur={(_e) => {\n          setIsFocused(false);\n          return onBlur();\n        }}\n        onChange={(option) => {\n          if (multiSelect) {\n            onChange(\n              (option as SelectOption[])?.map((_option) => _option.value),\n            );\n          } else {\n            onChange((option as SelectOption)?.value);\n          }\n        }}\n        onFocus={(_e) => {\n          setIsFocused(true);\n        }}\n        onInputChange={onInputChange}\n        ref={ref}\n        // set complete option as value by current field value\n        value={options.find((option) => option.value === value)}\n        unstyled\n      />\n      {error && (\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        <div {...getHelperWrapperProps()}>\n          {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n          <div {...getErrorMessageProps()}>\n            <FieldValidationError error={error} testId={testId} />\n          </div>\n        </div>\n      )}\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"]}
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-H5JXWAGH.cjs","../src/Select/Select.tsx","../src/Select/index.ts"],"names":["Select_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-H5JXWAGH.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\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 { useController, useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\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      'rounded-lg border-2 border-default-200 !duration-150 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 text-small 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    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\ntype SelectOption = {\n  /** option label */\n  label?: React.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  /** 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?: React.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/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}`;\n  // eslint-disable-next-line react/jsx-props-no-spreading\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/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}_select`;\n  return (\n    <div data-testid={testId}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\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/prop-types, 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      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\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  // eslint-disable-next-line react/prop-types\n  const testId = props?.selectProps['data-testid'] as string;\n  return (\n    <div data-testid={`${testId}_select_dropdown`}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\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  disabled = false,\n  filterOption = undefined,\n  renderOptionLabel = undefined,\n  inputValue = undefined,\n  label: _label = undefined,\n  loading = false,\n  multiSelect = false,\n  name,\n  onInputChange = undefined,\n  options,\n  placeholder = undefined,\n  testId: _testId = undefined,\n}: SelectProps) => {\n  const { control, debugMode, getFieldState } = useFormContext();\n  const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n  const { field } = useController({ control, disabled, name });\n  const { onChange, value, ref, onBlur } = field;\n\n  const [isFocused, setIsFocused] = useState(false);\n\n  const variants = selectVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  const {\n    getBaseProps,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    getLabelProps,\n    getTriggerProps,\n    getValueProps,\n    label,\n  } = useSelect({\n    children: [],\n    classNames,\n    errorMessage: JSON.stringify(error),\n    isDisabled: disabled,\n    isInvalid: invalid,\n    isLoading: loading,\n    isRequired: required,\n    label: _label,\n    labelPlacement: 'outside',\n    placeholder: ' ',\n  });\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  return (\n    <div\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...getBaseProps()}\n      className={cn(classNames.base)}\n      data-testid={`${testId}_wrapper`}\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    >\n      {showLabel && (\n        <label\n          className={classNames.label}\n          data-slot=\"label\"\n          htmlFor={`react-select-${name}-input`}\n          id={getLabelProps().id}\n        >\n          {label}\n          {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n        </label>\n      )}\n      <ReactSelect\n        aria-errormessage=\"\"\n        aria-labelledby={getTriggerProps()['aria-labelledby']?.split(' ')[1]}\n        aria-invalid={invalid}\n        classNames={{\n          control: () =>\n            cn(classNames.control, {\n              [classNames.control_focused]: isFocused && !invalid,\n            }),\n          clearIndicator: () => classNames.clearIndicator,\n          dropdownIndicator: () => classNames.dropdownIndicator,\n          groupHeading: () => classNames.groupHeading,\n          indicatorsContainer: () => classNames.indicatorsContainer,\n          indicatorSeparator: () => classNames.indicatorSeparator,\n          loadingIndicator: () => classNames.loadingIndicator,\n          loadingMessage: () => classNames.loadingMessage,\n          input: () => classNames.input,\n          menu: () => classNames.menu,\n          menuList: () => classNames.menuList,\n          menuPortal: () => classNames.menuPortal,\n          multiValue: () => classNames.multiValue,\n          multiValueLabel: () =>\n            cn(classNames.multiValueLabel, `${getValueProps().className}`),\n          multiValueRemove: () => classNames.multiValueRemove,\n          noOptionsMessage: () => classNames.noOptionsMessage,\n          option: ({\n            isFocused: optionIsFocused,\n            isSelected: optionIsSelected,\n          }) =>\n            cn(classNames.option, {\n              [classNames.option_focused]: optionIsFocused,\n              [classNames.option_selected]: optionIsSelected,\n            }),\n          placeholder: () => classNames.placeholder,\n          singleValue: () =>\n            cn(classNames.singleValue, `${getValueProps().className}`),\n          valueContainer: () => classNames.valueContainer,\n        }}\n        components={{\n          Input: InputComponent,\n          Option: OptionComponent,\n          DropdownIndicator: DropdownIndicatorComponent,\n          Control: ControlComponent,\n        }}\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        name={name}\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        menuShouldBlockScroll\n        options={options}\n        placeholder={placeholder}\n        onBlur={(_e) => {\n          setIsFocused(false);\n          return onBlur();\n        }}\n        onChange={(option) => {\n          if (multiSelect) {\n            onChange(\n              (option as SelectOption[])?.map((_option) => _option.value),\n            );\n          } else {\n            onChange((option as SelectOption)?.value);\n          }\n        }}\n        onFocus={(_e) => {\n          setIsFocused(true);\n        }}\n        onInputChange={onInputChange}\n        ref={ref}\n        // set complete option as value by current field value\n        value={options.find((option) => option.value === value)}\n        unstyled\n      />\n      {error && (\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        <div {...getHelperWrapperProps()}>\n          {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n          <div {...getErrorMessageProps()}>\n            <FieldValidationError error={error} testId={testId} />\n          </div>\n        </div>\n      )}\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"]}

package/dist/{chunk-BC6ZP7TF.js → chunk-H7JL3BPU.js}

@@ -7,14 +7,18 @@ import {
 import {
   useController,
   useFormContext
-} from "./chunk-5R7ZPSN2.js";
+} from "./chunk-NXTFRKYX.js";
 import {
   __spreadProps,
   __spreadValues
 } from "./chunk-K2V4ULA2.js";
 
 // src/CheckboxGroup/CheckboxGroup.tsx
-import { Checkbox, CheckboxGroup as HeroCheckboxGroup } from "@heroui/checkbox";
+import {
+  Checkbox as HeroCheckbox,
+  CheckboxGroup as HeroCheckboxGroup
+} from "@heroui/checkbox";
+import { checkbox as heroCheckboxVariants } from "@heroui/theme";
 import { slugify, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
 import { jsx, jsxs } from "react/jsx-runtime";
 var checkboxGroupVariants = tv({
@@ -22,20 +26,40 @@ var checkboxGroupVariants = tv({
     base: "group",
     // Needs group for group-data condition
     errorMessage: "text-tiny",
-    itemBase: "",
-    itemIcon: "",
-    itemLabel: "text-sm",
-    itemWrapper: "",
     // 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",
+    optionBase: "",
+    optionIcon: "",
+    optionLabel: "",
+    optionLabelSubline: "!text-small text-foreground-400",
+    optionWrapper: "",
     wrapper: ""
+  },
+  variants: {
+    // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/checkbox.ts
+    color: __spreadValues({
+      info: {
+        wrapper: "text-info-foreground after:bg-info after:text-info-foreground"
+      }
+    }, heroCheckboxVariants.variants.color),
+    lineThrough: {
+      true: {
+        optionLabel: [
+          ...heroCheckboxVariants.variants.lineThrough.true.label,
+          // fix stroke position when used with subline and enable animation
+          "relative before:transition-all before:duration-200"
+        ]
+      }
+    }
   }
 });
 var CheckboxGroup = ({
   className = void 0,
+  color = "primary",
   inline = false,
   label = void 0,
+  lineThrough = false,
   options,
   disabled = false,
   name,
@@ -52,18 +76,17 @@ var CheckboxGroup = ({
   const { onChange, value = [], ref, onBlur } = field;
   const showTestIdCopyButton = debugMode === "debug-testids";
   const showLabel = label || showTestIdCopyButton;
-  const variants = checkboxGroupVariants();
+  const variants = checkboxGroupVariants({ lineThrough });
   const classNames = variantsToClassNames(variants, className, "base");
-  const itemClassName = {
-    base: classNames.itemBase,
-    wrapper: classNames.itemWrapper,
-    icon: classNames.itemIcon,
-    label: classNames.itemLabel
-  };
-  const itemGroupClassName = {
+  const heroCheckboxGroupClassNames = {
     base: classNames.base,
-    wrapper: classNames.wrapper,
-    label: classNames.label
+    label: classNames.label,
+    wrapper: classNames.wrapper
+  };
+  const heroCheckboxClassNames = {
+    base: classNames.optionBase,
+    icon: classNames.optionIcon,
+    wrapper: classNames.optionWrapper
   };
   const errorFlat = _error && Object.values(
     _error
@@ -79,7 +102,7 @@ var CheckboxGroup = ({
   };
   const singleCheckboxProps = {
     value: getCheckboxValue(value),
-    onChange: (newValue) => onChange(newValue && newValue[0])
+    onChange: (newValue) => onChange(newValue == null ? void 0 : newValue[0])
   };
   const multipleCheckboxProps = {
     onChange,
@@ -89,11 +112,11 @@ var CheckboxGroup = ({
   return /* @__PURE__ */ jsx(
     HeroCheckboxGroup,
     __spreadProps(__spreadValues({
-      name,
-      classNames: itemGroupClassName,
-      "data-testid": testId,
+      classNames: heroCheckboxGroupClassNames,
+      color: color === "info" ? "primary" : color,
       "data-invalid": invalid,
-      errorMessage: errorFlat.length && /* @__PURE__ */ jsx(
+      "data-testid": testId,
+      errorMessage: errorFlat.length > 0 && /* @__PURE__ */ jsx(
         FieldValidationError_default,
         {
           className: classNames.errorMessage,
@@ -109,23 +132,30 @@ var CheckboxGroup = ({
         label,
         showTestIdCopyButton && /* @__PURE__ */ jsx(FieldCopyTestIdButton_default, { testId })
       ] }),
+      name,
       onBlur,
       orientation: inline ? "horizontal" : "vertical",
       ref
     }, checkboxGroupProps), {
       children: options == null ? void 0 : options.map((option) => {
         const optionTestId = slugify(
-          `${testId}_option_${(option == null ? void 0 : option.testId) || (option == null ? void 0 : option.value)}`
+          `${testId}_option_${(option == null ? void 0 : option.testId) || (option == null ? void 0 : option.value)}`,
+          { replaceDots: true }
         );
+        const labelContent = option.labelSubline ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start", children: [
+          /* @__PURE__ */ jsx("span", { className: classNames.optionLabel, children: option.label }),
+          /* @__PURE__ */ jsx("span", { className: `${classNames.optionLabelSubline}`, children: option.labelSubline })
+        ] }) : /* @__PURE__ */ jsx("span", { className: classNames.optionLabel, children: option.label });
         return /* @__PURE__ */ jsx(
-          Checkbox,
+          HeroCheckbox,
           {
+            "aria-label": typeof option.label === "string" ? option.label : option.value,
+            classNames: heroCheckboxClassNames,
             "data-invalid": invalid,
-            classNames: itemClassName,
+            "data-testid": optionTestId,
             isDisabled: disabled || option.disabled,
             value: option == null ? void 0 : option.value,
-            "data-testid": optionTestId,
-            children: option == null ? void 0 : option.label
+            children: labelContent
           },
           `index_${option.value}`
         );
@@ -142,4 +172,4 @@ export {
   CheckboxGroup_default,
   CheckboxGroup_default2
 };
-//# sourceMappingURL=chunk-BC6ZP7TF.js.map
+//# sourceMappingURL=chunk-H7JL3BPU.js.map

package/dist/chunk-H7JL3BPU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/CheckboxGroup/CheckboxGroup.tsx","../src/CheckboxGroup/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\nimport type { FieldError } from 'react-hook-form';\n\nimport {\n  Checkbox as HeroCheckbox,\n  CheckboxGroup as HeroCheckboxGroup,\n} from '@heroui/checkbox';\nimport { checkbox as heroCheckboxVariants } from '@heroui/theme';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useController, useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const checkboxGroupVariants = tv({\n  slots: {\n    base: 'group', // Needs group for group-data condition\n    errorMessage: 'text-tiny',\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',\n    optionBase: '',\n    optionIcon: '',\n    optionLabel: '',\n    optionLabelSubline: '!text-small text-foreground-400',\n    optionWrapper: '',\n    wrapper: '',\n  },\n  variants: {\n    // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/checkbox.ts\n    color: {\n      info: {\n        wrapper:\n          'text-info-foreground after:bg-info after:text-info-foreground',\n      },\n      ...heroCheckboxVariants.variants.color,\n    } as const,\n    lineThrough: {\n      true: {\n        optionLabel: [\n          ...heroCheckboxVariants.variants.lineThrough.true.label,\n          // fix stroke position when used with subline and enable animation\n          'relative before:transition-all before:duration-200',\n        ],\n      },\n    },\n  },\n});\n\ntype VariantProps = TVProps<typeof checkboxGroupVariants>;\ntype ClassName = TVClassName<typeof checkboxGroupVariants>;\n\nexport type CheckboxGroupOption = {\n  /** option label */\n  label?: ReactNode;\n  /** subline displayed below the label */\n  labelSubline?: ReactNode;\n  /** option value */\n  value: string;\n  /** disables the option */\n  disabled?: boolean;\n  /** HTML data-testid attribute of the option */\n  testId?: string;\n};\n\nexport interface CheckboxGroupProps extends VariantProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** Color scheme of the checkboxes */\n  color?: VariantProps['color'];\n  /** Sets all checkboxes disabled */\n  disabled?: boolean;\n  /** Orientation of the checkboxes */\n  inline?: boolean;\n  /** Label displayed above the checkboxes */\n  label?: ReactNode;\n  /** Whether the checkboxes label should be crossed out */\n  lineThrough?: boolean;\n  /** Name the Field is registered on the form */\n  name: string;\n  /** Checkboxes that should be displayed. */\n  options: CheckboxGroupOption[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * CheckboxGroup component based on [HeroUI CheckboxGroup](https://www.heroui.com//docs/components/checkbox-group)\n */\nconst CheckboxGroup = ({\n  className = undefined,\n  color = 'primary',\n  inline = false,\n  label = undefined,\n  lineThrough = false,\n  options,\n  disabled = false,\n  name,\n  testId: _testId = undefined,\n}: CheckboxGroupProps) => {\n  const { control, debugMode, getFieldState } = useFormContext();\n  const {\n    error: _error,\n    invalid,\n    required,\n    testId,\n  } = getFieldState(name, _testId);\n\n  const { field } = useController({ control, name, disabled });\n  const { onChange, value = [], ref, onBlur } = field;\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  const variants = checkboxGroupVariants({ lineThrough });\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  // map slots to HeroUI class names\n  const heroCheckboxGroupClassNames = {\n    base: classNames.base,\n    label: classNames.label,\n    wrapper: classNames.wrapper,\n  };\n  const heroCheckboxClassNames = {\n    base: classNames.optionBase,\n    icon: classNames.optionIcon,\n    wrapper: classNames.optionWrapper,\n  };\n\n  // Convert React Hook Form's nested error object structure to a flat array\n  // RHF errors can be nested like: checkboxField.0 (individual checkbox errors)\n  // and checkboxField._error (global field errors) - this flattens all\n  // error values into a single array for rendering with FieldValidationError\n  const errorFlat: FieldError[] =\n    (_error &&\n      Object.values(\n        _error as unknown as Record<string, FieldError[]>,\n      ).flat()) ||\n    [];\n\n  /**\n   * Handles the checkbox group value changes based on the number of options:\n   * 1. For single checkbox (options.length === 1):\n   *    - Converts undefined/empty array to [] for consistent controlled behavior\n   *    - Extracts single value from array for onChange\n   *\n   *    Example: undefined → []\n   *            [value] → value\n   *\n   * 2. For multiple checkboxes:\n   *    - Uses raw value array with fallback to empty array\n   *    - Passes through onChange directly\n   *\n   *    Example: undefined → []\n   *            ['value1', 'value2'] → ['value1', 'value2']\n   */\n  const getCheckboxValue = (inputValue: unknown): string[] => {\n    if (Array.isArray(inputValue)) {\n      return inputValue;\n    }\n    if (inputValue) {\n      return [inputValue as string];\n    }\n    return [];\n  };\n\n  const singleCheckboxProps = {\n    value: getCheckboxValue(value),\n    onChange: (newValue: string[]) => onChange(newValue?.[0]),\n  };\n\n  const multipleCheckboxProps = {\n    onChange,\n    value: getCheckboxValue(value),\n  };\n\n  const checkboxGroupProps =\n    options.length === 1 ? singleCheckboxProps : multipleCheckboxProps;\n\n  return (\n    <HeroCheckboxGroup\n      classNames={heroCheckboxGroupClassNames}\n      color={color === 'info' ? 'primary' : color}\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-testid={testId}\n      errorMessage={\n        errorFlat.length > 0 && (\n          <FieldValidationError\n            className={classNames.errorMessage}\n            error={errorFlat}\n            testId={testId}\n          />\n        )\n      }\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={\n        showLabel && (\n          // eslint-disable-next-line jsx-a11y/label-has-associated-control\n          <label>\n            {label}\n            {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n          </label>\n        )\n      }\n      name={name}\n      onBlur={onBlur}\n      orientation={inline ? 'horizontal' : 'vertical'}\n      ref={ref}\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...checkboxGroupProps}\n    >\n      {options?.map((option) => {\n        const optionTestId = slugify(\n          `${testId}_option_${option?.testId || option?.value}`,\n          { replaceDots: true },\n        );\n\n        const labelContent = option.labelSubline ? (\n          <div className=\"flex flex-col items-start\">\n            <span className={classNames.optionLabel}>{option.label}</span>\n            <span className={`${classNames.optionLabelSubline}`}>\n              {option.labelSubline}\n            </span>\n          </div>\n        ) : (\n          <span className={classNames.optionLabel}>{option.label}</span>\n        );\n\n        return (\n          <HeroCheckbox\n            aria-label={\n              typeof option.label === 'string' ? option.label : option.value\n            }\n            classNames={heroCheckboxClassNames}\n            data-invalid={invalid}\n            data-testid={optionTestId}\n            isDisabled={disabled || option.disabled}\n            key={`index_${option.value}`}\n            value={option?.value}\n          >\n            {labelContent}\n          </HeroCheckbox>\n        );\n      })}\n    </HeroCheckboxGroup>\n  );\n};\n\nexport default CheckboxGroup;\n","import CheckboxGroup from './CheckboxGroup';\n\nexport type { CheckboxGroupProps, CheckboxGroupOption } from './CheckboxGroup';\n\nexport { CheckboxGroup };\n\nexport default CheckboxGroup;\n"],"mappings":";;;;;;;;;;;;;;;;AAIA;AAAA,EACE,YAAY;AAAA,EACZ,iBAAiB;AAAA,OACZ;AACP,SAAS,YAAY,4BAA4B;AAEjD,SAAS,SAAS,IAAI,4BAA4B;AAsLxC,cAaA,YAbA;AAhLH,IAAM,wBAAwB,GAAG;AAAA,EACtC,OAAO;AAAA,IACL,MAAM;AAAA;AAAA,IACN,cAAc;AAAA;AAAA;AAAA,IAGd,OACE;AAAA,IACF,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,aAAa;AAAA,IACb,oBAAoB;AAAA,IACpB,eAAe;AAAA,IACf,SAAS;AAAA,EACX;AAAA,EACA,UAAU;AAAA;AAAA,IAER,OAAO;AAAA,MACL,MAAM;AAAA,QACJ,SACE;AAAA,MACJ;AAAA,OACG,qBAAqB,SAAS;AAAA,IAEnC,aAAa;AAAA,MACX,MAAM;AAAA,QACJ,aAAa;AAAA,UACX,GAAG,qBAAqB,SAAS,YAAY,KAAK;AAAA;AAAA,UAElD;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF,CAAC;AA0CD,IAAM,gBAAgB,CAAC;AAAA,EACrB,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,cAAc;AAAA,EACd;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA,QAAQ,UAAU;AACpB,MAA0B;AACxB,QAAM,EAAE,SAAS,WAAW,cAAc,IAAI,eAAe;AAC7D,QAAM;AAAA,IACJ,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,cAAc,MAAM,OAAO;AAE/B,QAAM,EAAE,MAAM,IAAI,cAAc,EAAE,SAAS,MAAM,SAAS,CAAC;AAC3D,QAAM,EAAE,UAAU,QAAQ,CAAC,GAAG,KAAK,OAAO,IAAI;AAE9C,QAAM,uBAAuB,cAAc;AAC3C,QAAM,YAAY,SAAS;AAE3B,QAAM,WAAW,sBAAsB,EAAE,YAAY,CAAC;AACtD,QAAM,aAAa,qBAAqB,UAAU,WAAW,MAAM;AAGnE,QAAM,8BAA8B;AAAA,IAClC,MAAM,WAAW;AAAA,IACjB,OAAO,WAAW;AAAA,IAClB,SAAS,WAAW;AAAA,EACtB;AACA,QAAM,yBAAyB;AAAA,IAC7B,MAAM,WAAW;AAAA,IACjB,MAAM,WAAW;AAAA,IACjB,SAAS,WAAW;AAAA,EACtB;AAMA,QAAM,YACH,UACC,OAAO;AAAA,IACL;AAAA,EACF,EAAE,KAAK,KACT,CAAC;AAkBH,QAAM,mBAAmB,CAAC,eAAkC;AAC1D,QAAI,MAAM,QAAQ,UAAU,GAAG;AAC7B,aAAO;AAAA,IACT;AACA,QAAI,YAAY;AACd,aAAO,CAAC,UAAoB;AAAA,IAC9B;AACA,WAAO,CAAC;AAAA,EACV;AAEA,QAAM,sBAAsB;AAAA,IAC1B,OAAO,iBAAiB,KAAK;AAAA,IAC7B,UAAU,CAAC,aAAuB,SAAS,qCAAW,EAAE;AAAA,EAC1D;AAEA,QAAM,wBAAwB;AAAA,IAC5B;AAAA,IACA,OAAO,iBAAiB,KAAK;AAAA,EAC/B;AAEA,QAAM,qBACJ,QAAQ,WAAW,IAAI,sBAAsB;AAE/C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YAAY;AAAA,MACZ,OAAO,UAAU,SAAS,YAAY;AAAA,MAGtC,gBAAc;AAAA,MACd,eAAa;AAAA,MACb,cACE,UAAU,SAAS,KACjB;AAAA,QAAC;AAAA;AAAA,UACC,WAAW,WAAW;AAAA,UACtB,OAAO;AAAA,UACP;AAAA;AAAA,MACF;AAAA,MAGJ,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,YAAY;AAAA,MACZ,OACE;AAAA,MAEE,qBAAC,WACE;AAAA;AAAA,QACA,wBAAwB,oBAAC,iCAAsB,QAAgB;AAAA,SAClE;AAAA,MAGJ;AAAA,MACA;AAAA,MACA,aAAa,SAAS,eAAe;AAAA,MACrC;AAAA,OAEI,qBAjCL;AAAA,MAmCE,6CAAS,IAAI,CAAC,WAAW;AACxB,cAAM,eAAe;AAAA,UACnB,GAAG,MAAM,YAAW,iCAAQ,YAAU,iCAAQ,MAAK;AAAA,UACnD,EAAE,aAAa,KAAK;AAAA,QACtB;AAEA,cAAM,eAAe,OAAO,eAC1B,qBAAC,SAAI,WAAU,6BACb;AAAA,8BAAC,UAAK,WAAW,WAAW,aAAc,iBAAO,OAAM;AAAA,UACvD,oBAAC,UAAK,WAAW,GAAG,WAAW,kBAAkB,IAC9C,iBAAO,cACV;AAAA,WACF,IAEA,oBAAC,UAAK,WAAW,WAAW,aAAc,iBAAO,OAAM;AAGzD,eACE;AAAA,UAAC;AAAA;AAAA,YACC,cACE,OAAO,OAAO,UAAU,WAAW,OAAO,QAAQ,OAAO;AAAA,YAE3D,YAAY;AAAA,YACZ,gBAAc;AAAA,YACd,eAAa;AAAA,YACb,YAAY,YAAY,OAAO;AAAA,YAE/B,OAAO,iCAAQ;AAAA,YAEd;AAAA;AAAA,UAHI,SAAS,OAAO,KAAK;AAAA,QAI5B;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,wBAAQ;;;ACzPf,IAAOA,yBAAQ;","names":["CheckboxGroup_default"]}

package/dist/{chunk-LBFJL6IA.js → chunk-HGEOXAH4.js}

@@ -7,7 +7,7 @@ import {
 import {
   useController,
   useFormContext
-} from "./chunk-5R7ZPSN2.js";
+} from "./chunk-NXTFRKYX.js";
 import {
   __objRest,
   __spreadProps,
@@ -133,13 +133,15 @@ var RadioBoxes = ({
       ref,
       children: options.map((option) => {
         if ("value" in option) {
+          const optionTestId = slugify(
+            `${testId}_option_${option.testId || option.value}`,
+            { replaceDots: true }
+          );
           return /* @__PURE__ */ jsx2(
             RadioBox,
             {
               classNames: itemClassNames,
-              "data-testid": slugify(
-                `${testId}_option_${option.testId || option.value}`
-              ),
+              "data-testid": optionTestId,
               description: option.description,
               icon: option.icon,
               isDisabled: isDisabled || option.disabled,
@@ -164,4 +166,4 @@ export {
   RadioBoxes_default,
   RadioBoxes_default2
 };
-//# sourceMappingURL=chunk-LBFJL6IA.js.map
+//# sourceMappingURL=chunk-HGEOXAH4.js.map

package/dist/chunk-HGEOXAH4.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 { ReactElement, ReactNode } from 'react';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useController, useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\nimport { RadioBox } from './RadioBox';\n\nexport const radioBoxesVariants = tv({\n  slots: {\n    base: 'group', // Needs group for group-data condition\n    itemBase: '',\n    itemControl: 'bg-focus group-data-[invalid=true]:bg-danger',\n    itemDescription: '',\n    itemLabel: 'text-sm',\n    itemLabelWrapper: '',\n    itemWrapper:\n      'group-data-[invalid=true]:!border-danger [&:not(group-data-[invalid=\"true\"]):not(group-data-[selected=\"false\"])]:border-focus', // TODO: get rid of !.\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',\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  /** 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  disabled = false,\n  inline = false,\n  label = undefined,\n  name,\n  options,\n  testId: _testId = undefined,\n}: RadioBoxesProps): ReactElement => {\n  const { control, debugMode, getFieldState, getValues } = useFormContext();\n\n  const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n  const { field } = useController({ control, disabled, name });\n  const { onChange, disabled: isDisabled, onBlur, ref } = field;\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  const variants = radioBoxesVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  const itemClassNames = {\n    base: classNames.itemBase,\n    control: classNames.itemControl,\n    description: classNames.itemDescription,\n    label: classNames.itemLabel,\n    labelWrapper: classNames.itemLabelWrapper,\n    wrapper: classNames.itemWrapper,\n  };\n\n  return (\n    <HeroRadioGroup\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={getValues()[name]}\n      errorMessage={\n        error && <FieldValidationError error={error} testId={testId} />\n      }\n      isDisabled={isDisabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={\n        showLabel && (\n          // eslint-disable-next-line jsx-a11y/label-has-associated-control\n          <label>\n            {label}\n            {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n          </label>\n        )\n      }\n      name={name}\n      orientation={inline ? 'horizontal' : 'vertical'}\n      onBlur={onBlur}\n      ref={ref}\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              classNames={itemClassNames}\n              data-testid={optionTestId}\n              description={option.description}\n              icon={option.icon}\n              isDisabled={isDisabled || option.disabled}\n              key={option.value}\n              onChange={onChange}\n              value={option.value}\n            >\n              {option.label ? option.label : option.value}\n            </RadioBox>\n          );\n        }\n        return null;\n      })}\n    </HeroRadioGroup>\n  );\n};\n\nexport default RadioBoxes;\n","import 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 } from '@fuf-stack/pixel-utils';\n\ninterface RadioProps extends HeroRadioProps {\n  /** icon for the option */\n  icon?: ReactNode;\n}\n\nexport const RadioBox = ({ icon = undefined, ...props }: RadioProps) => {\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);\n\n  return (\n    <Component\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...getBaseProps()}\n      className={cn(\n        '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        {\n          // disabled styles\n          'pointer-events-none opacity-disabled': isDisabled,\n        },\n      )}\n    >\n      <VisuallyHidden>\n        {/* eslint-disable-next-line react/jsx-props-no-spreading  */}\n        <input {...getInputProps()} />\n      </VisuallyHidden>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading  */}\n      <span {...getWrapperProps()}>\n        {/* eslint-disable-next-line react/jsx-props-no-spreading  */}\n        <span {...getControlProps()} />\n      </span>\n      {icon}\n      <div\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...getLabelWrapperProps()}\n        className={cn(getLabelWrapperProps().className, 'grow')}\n      >\n        {/* eslint-disable-next-line react/jsx-props-no-spreading  */}\n        {children && <span {...getLabelProps()}>{children}</span>}\n        {description && (\n          <span className=\"text-small text-foreground opacity-70\">\n            {description}\n          </span>\n        )}\n      </div>\n    </Component>\n  );\n};\n\nexport default RadioBox;\n","import RadioBoxes from './RadioBoxes';\n\nexport type { RadioBoxesProps } from './RadioBoxes';\n\nexport { RadioBoxes };\n\nexport default RadioBoxes;\n"],"mappings":"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","names":["jsx","jsxs","RadioBoxes_default"]}

package/dist/{chunk-M7CZ526K.js → chunk-K4E35FS6.js}

@@ -1,6 +1,6 @@
 import {
   useFormContext
-} from "./chunk-5R7ZPSN2.js";
+} from "./chunk-NXTFRKYX.js";
 
 // src/SubmitButton/SubmitButton.tsx
 import { cn, slugify } from "@fuf-stack/pixel-utils";
@@ -23,7 +23,7 @@ var SubmitButton = ({
     {
       className: cn(className),
       color,
-      testId: slugify(testId),
+      testId: slugify(testId, { replaceDots: true }),
       disabled: isSubmitting,
       loading: loading || isSubmitting,
       onClick: triggerSubmit,
@@ -42,4 +42,4 @@ export {
   SubmitButton_default,
   SubmitButton_default2
 };
-//# sourceMappingURL=chunk-M7CZ526K.js.map
+//# sourceMappingURL=chunk-K4E35FS6.js.map

package/dist/chunk-K4E35FS6.js.map

@@ -0,0 +1 @@
+{"version":3,"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';\n\nexport interface SubmitButtonProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** color of the button */\n  color?: ButtonProps['color'];\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** size of the 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  children = 'Submit',\n  className = undefined,\n  color = 'success',\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      className={cn(className)}\n      color={color}\n      testId={slugify(testId, { replaceDots: true })}\n      disabled={isSubmitting}\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      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":";;;;;AAGA,SAAS,IAAI,eAAe;AAC5B,SAAS,cAAc;AAoCnB;AAdJ,IAAM,eAAe,CAAC;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AACX,MAAyB;AACvB,QAAM;AAAA,IACJ,WAAW,EAAE,aAAa;AAAA,IAC1B;AAAA,EACF,IAAI,eAAe;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,SAAS;AAAA,MACvB;AAAA,MACA,QAAQ,QAAQ,QAAQ,EAAE,aAAa,KAAK,CAAC;AAAA,MAC7C,UAAU;AAAA,MACV,SAAS,WAAW;AAAA,MAIpB,SAAS;AAAA,MACT;AAAA,MACA,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;;;ACpDf,IAAOA,wBAAQ;","names":["SubmitButton_default"]}

package/dist/{chunk-3PAVDSMW.js → chunk-KJYR5Q6G.js}

@@ -8,7 +8,7 @@ import {
   useController,
   useFormContext,
   useInput
-} from "./chunk-5R7ZPSN2.js";
+} from "./chunk-NXTFRKYX.js";
 import {
   __spreadProps,
   __spreadValues
@@ -95,4 +95,4 @@ export {
   Switch_default,
   Switch_default2
 };
-//# sourceMappingURL=chunk-3PAVDSMW.js.map
+//# sourceMappingURL=chunk-KJYR5Q6G.js.map

package/dist/{chunk-5R7ZPSN2.js → chunk-NXTFRKYX.js}

@@ -258,7 +258,7 @@ var useFormContext = () => {
       error,
       // Ensure correct type for error
       required,
-      testId: slugify(testId || name)
+      testId: slugify(testId || name, { replaceDots: true })
     });
   };
   return __spreadProps(__spreadValues(__spreadValues({}, otherMethods), uniformContext), {
@@ -279,4 +279,4 @@ export {
   useFormContext,
   useInput
 };
-//# sourceMappingURL=chunk-5R7ZPSN2.js.map
+//# sourceMappingURL=chunk-NXTFRKYX.js.map