@fuf-stack/uniform 1.10.0 → 1.10.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (148) hide show
  1. package/dist/Checkboxes/index.cjs +7 -7
  2. package/dist/Checkboxes/index.js +6 -6
  3. package/dist/FieldArray/index.cjs +8 -8
  4. package/dist/FieldArray/index.js +7 -7
  5. package/dist/FieldCard/index.cjs +7 -7
  6. package/dist/FieldCard/index.js +6 -6
  7. package/dist/Form/index.cjs +5 -5
  8. package/dist/Form/index.js +4 -4
  9. package/dist/Input/index.cjs +7 -7
  10. package/dist/Input/index.js +6 -6
  11. package/dist/RadioBoxes/index.cjs +7 -7
  12. package/dist/RadioBoxes/index.js +6 -6
  13. package/dist/RadioTabs/index.cjs +7 -7
  14. package/dist/RadioTabs/index.js +6 -6
  15. package/dist/Radios/index.cjs +7 -7
  16. package/dist/Radios/index.js +6 -6
  17. package/dist/Select/index.cjs +7 -7
  18. package/dist/Select/index.js +6 -6
  19. package/dist/Slider/index.cjs +7 -7
  20. package/dist/Slider/index.js +6 -6
  21. package/dist/SubmitButton/index.cjs +5 -5
  22. package/dist/SubmitButton/index.js +4 -4
  23. package/dist/Switch/index.cjs +7 -7
  24. package/dist/Switch/index.js +6 -6
  25. package/dist/SwitchBox/index.cjs +7 -7
  26. package/dist/SwitchBox/index.js +6 -6
  27. package/dist/TextArea/index.cjs +7 -7
  28. package/dist/TextArea/index.js +6 -6
  29. package/dist/{chunk-XSVEW3KN.js → chunk-264VRHMT.js} +2 -2
  30. package/dist/{chunk-WWRIMXSN.js → chunk-26VE4IGU.js} +3 -3
  31. package/dist/{chunk-5UGCZ7OA.js → chunk-2HDXHQOC.js} +2 -2
  32. package/dist/{chunk-6RZT2BKH.cjs → chunk-2UQCRQEJ.cjs} +5 -5
  33. package/dist/{chunk-6RZT2BKH.cjs.map → chunk-2UQCRQEJ.cjs.map} +1 -1
  34. package/dist/{chunk-MODH7W2M.js → chunk-4CQWTUQR.js} +3 -3
  35. package/dist/{chunk-6UORUDZV.cjs → chunk-55VJM3KD.cjs} +3 -3
  36. package/dist/{chunk-6UORUDZV.cjs.map → chunk-55VJM3KD.cjs.map} +1 -1
  37. package/dist/{chunk-GE7HUIAK.js → chunk-5MTIQ6WD.js} +3 -3
  38. package/dist/{chunk-NV4YVZYX.cjs → chunk-6AWHOBNL.cjs} +6 -6
  39. package/dist/{chunk-NV4YVZYX.cjs.map → chunk-6AWHOBNL.cjs.map} +1 -1
  40. package/dist/{chunk-XSS4REAS.cjs → chunk-6GN62PBG.cjs} +4 -3
  41. package/dist/chunk-6GN62PBG.cjs.map +1 -0
  42. package/dist/{chunk-BUFKWZNC.js → chunk-7MOAXLQZ.js} +4 -4
  43. package/dist/{chunk-QPKHR6WH.js → chunk-7OMJ26AT.js} +2 -2
  44. package/dist/{chunk-MVFEXRWQ.cjs → chunk-7ZE7IZ5R.cjs} +7 -7
  45. package/dist/{chunk-MVFEXRWQ.cjs.map → chunk-7ZE7IZ5R.cjs.map} +1 -1
  46. package/dist/{chunk-UBLASN6D.cjs → chunk-AQJLKHAE.cjs} +5 -5
  47. package/dist/{chunk-UBLASN6D.cjs.map → chunk-AQJLKHAE.cjs.map} +1 -1
  48. package/dist/{chunk-M5IL7INR.js → chunk-C6WYP35Z.js} +2 -2
  49. package/dist/{chunk-IZ5SPNVQ.cjs → chunk-ECUVOZGQ.cjs} +3 -3
  50. package/dist/{chunk-IZ5SPNVQ.cjs.map → chunk-ECUVOZGQ.cjs.map} +1 -1
  51. package/dist/{chunk-O5KAFUBE.js → chunk-EVASKP6Q.js} +2 -2
  52. package/dist/{chunk-UUGUQGMX.cjs → chunk-FYN7ZWLW.cjs} +10 -10
  53. package/dist/{chunk-UUGUQGMX.cjs.map → chunk-FYN7ZWLW.cjs.map} +1 -1
  54. package/dist/{chunk-4KEI3VRK.js → chunk-GEC75GNL.js} +4 -6
  55. package/dist/chunk-GEC75GNL.js.map +1 -0
  56. package/dist/{chunk-NKIZA3ZO.cjs → chunk-HEPNEBRF.cjs} +3 -3
  57. package/dist/{chunk-NKIZA3ZO.cjs.map → chunk-HEPNEBRF.cjs.map} +1 -1
  58. package/dist/{chunk-TUIK3MER.js → chunk-IV45K4WU.js} +2 -2
  59. package/dist/{chunk-2EQEKXG2.js → chunk-KBKMMDLM.js} +2 -2
  60. package/dist/{chunk-V45YAJT4.cjs → chunk-KDNO5YO5.cjs} +3 -3
  61. package/dist/{chunk-V45YAJT4.cjs.map → chunk-KDNO5YO5.cjs.map} +1 -1
  62. package/dist/{chunk-IKOYYA75.js → chunk-LO7UKHOS.js} +2 -2
  63. package/dist/{chunk-JRE5KEX3.cjs → chunk-LWPZZ2AW.cjs} +5 -5
  64. package/dist/{chunk-JRE5KEX3.cjs.map → chunk-LWPZZ2AW.cjs.map} +1 -1
  65. package/dist/{chunk-GQF5HVA4.js → chunk-NG3CJ3UE.js} +4 -4
  66. package/dist/{chunk-FQDOJIQF.cjs → chunk-NXBYGCPL.cjs} +4 -4
  67. package/dist/{chunk-FQDOJIQF.cjs.map → chunk-NXBYGCPL.cjs.map} +1 -1
  68. package/dist/{chunk-BOCYHTFE.js → chunk-O2XJNQQK.js} +1 -7
  69. package/dist/chunk-O2XJNQQK.js.map +1 -0
  70. package/dist/{chunk-TKICOKNS.cjs → chunk-OKJWLH7T.cjs} +3 -9
  71. package/dist/chunk-OKJWLH7T.cjs.map +1 -0
  72. package/dist/{chunk-BZ2PD2JG.js → chunk-OORASWXL.js} +2 -2
  73. package/dist/{chunk-7TUWJWLN.js → chunk-PRUIH5LI.js} +3 -3
  74. package/dist/chunk-PRUIH5LI.js.map +1 -0
  75. package/dist/{chunk-FHYUMBE3.js → chunk-QLNJZDVF.js} +3 -2
  76. package/dist/chunk-QLNJZDVF.js.map +1 -0
  77. package/dist/{chunk-YMXUVBQ3.js → chunk-RHARCEQE.js} +30 -15
  78. package/dist/chunk-RHARCEQE.js.map +1 -0
  79. package/dist/{chunk-MSJP25N4.cjs → chunk-RVBTLB5G.cjs} +4 -4
  80. package/dist/chunk-RVBTLB5G.cjs.map +1 -0
  81. package/dist/{chunk-ZZW7JZ2U.js → chunk-SJWL6EMI.js} +3 -3
  82. package/dist/{chunk-OIKPQMQ2.cjs → chunk-SW3NGBCE.cjs} +3 -3
  83. package/dist/{chunk-OIKPQMQ2.cjs.map → chunk-SW3NGBCE.cjs.map} +1 -1
  84. package/dist/{chunk-WRKONOOV.cjs → chunk-THDHNYP7.cjs} +3 -3
  85. package/dist/{chunk-WRKONOOV.cjs.map → chunk-THDHNYP7.cjs.map} +1 -1
  86. package/dist/{chunk-P2TT7HU5.js → chunk-UB7CSOZU.js} +3 -3
  87. package/dist/{chunk-OED4DYBD.cjs → chunk-V3M7HL26.cjs} +7 -9
  88. package/dist/{chunk-4KEI3VRK.js.map → chunk-V3M7HL26.cjs.map} +1 -1
  89. package/dist/{chunk-PTCZOUQX.cjs → chunk-WXSISX5Y.cjs} +3 -3
  90. package/dist/{chunk-PTCZOUQX.cjs.map → chunk-WXSISX5Y.cjs.map} +1 -1
  91. package/dist/{chunk-4LLSZ6GN.cjs → chunk-WYM6IAIJ.cjs} +5 -5
  92. package/dist/{chunk-4LLSZ6GN.cjs.map → chunk-WYM6IAIJ.cjs.map} +1 -1
  93. package/dist/{chunk-KOV7U4QA.cjs → chunk-XPFJZAG7.cjs} +30 -15
  94. package/dist/chunk-XPFJZAG7.cjs.map +1 -0
  95. package/dist/{chunk-CM2LLV5N.cjs → chunk-YYR23V5P.cjs} +3 -3
  96. package/dist/{chunk-CM2LLV5N.cjs.map → chunk-YYR23V5P.cjs.map} +1 -1
  97. package/dist/{chunk-HYOALQIV.cjs → chunk-Z6QACVK7.cjs} +9 -9
  98. package/dist/{chunk-HYOALQIV.cjs.map → chunk-Z6QACVK7.cjs.map} +1 -1
  99. package/dist/{chunk-7WBYC3BC.js → chunk-ZIMWVUMQ.js} +2 -2
  100. package/dist/helpers/index.cjs +2 -4
  101. package/dist/helpers/index.cjs.map +1 -1
  102. package/dist/helpers/index.d.cts +1 -25
  103. package/dist/helpers/index.d.ts +1 -25
  104. package/dist/helpers/index.js +1 -3
  105. package/dist/hooks/useClientValidation/index.cjs +5 -5
  106. package/dist/hooks/useClientValidation/index.js +4 -4
  107. package/dist/hooks/useController/index.cjs +4 -4
  108. package/dist/hooks/useController/index.js +3 -3
  109. package/dist/hooks/useFormContext/index.cjs +4 -4
  110. package/dist/hooks/useFormContext/index.js +3 -3
  111. package/dist/hooks/useUniformField/index.cjs +6 -6
  112. package/dist/hooks/useUniformField/index.js +5 -5
  113. package/dist/hooks/useUniformFieldArray/index.cjs +7 -7
  114. package/dist/hooks/useUniformFieldArray/index.js +6 -6
  115. package/dist/hooks/useWatchUserChange/index.cjs +5 -5
  116. package/dist/hooks/useWatchUserChange/index.js +4 -4
  117. package/dist/index.cjs +24 -26
  118. package/dist/index.cjs.map +1 -1
  119. package/dist/index.d.cts +1 -1
  120. package/dist/index.d.ts +1 -1
  121. package/dist/index.js +25 -27
  122. package/package.json +4 -4
  123. package/dist/chunk-7TUWJWLN.js.map +0 -1
  124. package/dist/chunk-BOCYHTFE.js.map +0 -1
  125. package/dist/chunk-FHYUMBE3.js.map +0 -1
  126. package/dist/chunk-KOV7U4QA.cjs.map +0 -1
  127. package/dist/chunk-MSJP25N4.cjs.map +0 -1
  128. package/dist/chunk-OED4DYBD.cjs.map +0 -1
  129. package/dist/chunk-TKICOKNS.cjs.map +0 -1
  130. package/dist/chunk-XSS4REAS.cjs.map +0 -1
  131. package/dist/chunk-YMXUVBQ3.js.map +0 -1
  132. /package/dist/{chunk-XSVEW3KN.js.map → chunk-264VRHMT.js.map} +0 -0
  133. /package/dist/{chunk-WWRIMXSN.js.map → chunk-26VE4IGU.js.map} +0 -0
  134. /package/dist/{chunk-5UGCZ7OA.js.map → chunk-2HDXHQOC.js.map} +0 -0
  135. /package/dist/{chunk-MODH7W2M.js.map → chunk-4CQWTUQR.js.map} +0 -0
  136. /package/dist/{chunk-GE7HUIAK.js.map → chunk-5MTIQ6WD.js.map} +0 -0
  137. /package/dist/{chunk-BUFKWZNC.js.map → chunk-7MOAXLQZ.js.map} +0 -0
  138. /package/dist/{chunk-QPKHR6WH.js.map → chunk-7OMJ26AT.js.map} +0 -0
  139. /package/dist/{chunk-M5IL7INR.js.map → chunk-C6WYP35Z.js.map} +0 -0
  140. /package/dist/{chunk-O5KAFUBE.js.map → chunk-EVASKP6Q.js.map} +0 -0
  141. /package/dist/{chunk-TUIK3MER.js.map → chunk-IV45K4WU.js.map} +0 -0
  142. /package/dist/{chunk-2EQEKXG2.js.map → chunk-KBKMMDLM.js.map} +0 -0
  143. /package/dist/{chunk-IKOYYA75.js.map → chunk-LO7UKHOS.js.map} +0 -0
  144. /package/dist/{chunk-GQF5HVA4.js.map → chunk-NG3CJ3UE.js.map} +0 -0
  145. /package/dist/{chunk-BZ2PD2JG.js.map → chunk-OORASWXL.js.map} +0 -0
  146. /package/dist/{chunk-ZZW7JZ2U.js.map → chunk-SJWL6EMI.js.map} +0 -0
  147. /package/dist/{chunk-P2TT7HU5.js.map → chunk-UB7CSOZU.js.map} +0 -0
  148. /package/dist/{chunk-7WBYC3BC.js.map → chunk-ZIMWVUMQ.js.map} +0 -0
@@ -1,6 +1,6 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
- var _chunkOED4DYBDcjs = require('./chunk-OED4DYBD.cjs');
3
+ var _chunkV3M7HL26cjs = require('./chunk-V3M7HL26.cjs');
4
4
 
5
5
 
6
6
 
@@ -60,7 +60,7 @@ var Switch = (_a) => {
60
60
  ref,
61
61
  required,
62
62
  testId
63
- } = _chunkOED4DYBDcjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
63
+ } = _chunkV3M7HL26cjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
64
64
  name
65
65
  }, uniformFieldProps));
66
66
  const visualSwitchRef = _react.useRef.call(void 0, null);
@@ -71,7 +71,7 @@ var Switch = (_a) => {
71
71
  "input",
72
72
  {
73
73
  ref,
74
- "aria-label": typeof label === "string" ? label : name,
74
+ "aria-label": ariaLabel,
75
75
  checked: !!field.value,
76
76
  name,
77
77
  onBlur,
@@ -128,4 +128,4 @@ var Switch_default2 = Switch_default;
128
128
 
129
129
 
130
130
  exports.Switch_default = Switch_default; exports.Switch_default2 = Switch_default2;
131
- //# sourceMappingURL=chunk-MSJP25N4.cjs.map
131
+ //# sourceMappingURL=chunk-RVBTLB5G.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-RVBTLB5G.cjs","../src/Switch/Switch.tsx","../src/Switch/index.ts"],"names":["_a","Switch_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-RVBTLB5G.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { Switch as HeroSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchVariants = tv({\n slots: {\n base: '',\n endContent: '',\n errorMessage: 'ml-1 mt-1',\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n outerWrapper: 'place-content-center',\n startContent: '',\n thumb: '',\n thumbIcon: '',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof switchVariants>;\ntype ClassName = TVClassName<typeof switchVariants>;\n\nexport interface SwitchProps extends VariantProps {\n /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n ariaLabel?: string;\n /** CSS class name */\n className?: ClassName;\n /** whether the select should be disabled */\n disabled?: boolean;\n /** Icon to be displayed at the end of the switch (when enabled) */\n endContent?: ReactNode;\n /** component displayed next to the switch */\n label?: ReactNode;\n /** name the field is registered under */\n name: string;\n /* Size of the switch */\n size?: 'sm' | 'md' | 'lg';\n /** Icon to be displayed at the start of the switch (when disabled) */\n startContent?: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** Icon to be displayed inside the thumb */\n thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n * Switch component based on [HeroUI Switch](https://www.heroui.com//docs/components/switch)\n */\nconst Switch = ({\n className = undefined,\n endContent = undefined,\n name,\n size = undefined,\n startContent = undefined,\n thumbIcon = undefined,\n ...uniformFieldProps\n}: SwitchProps) => {\n const {\n ariaLabel,\n defaultValue,\n disabled,\n errorMessage,\n field,\n getErrorMessageProps,\n getHelperWrapperProps,\n invalid,\n label,\n onBlur,\n onChange,\n ref,\n required,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Ref for the visual switch to forward focus\n const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n // classNames from slots\n const variants = switchVariants();\n const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n return (\n <div className={classNames.outerWrapper}>\n {/* Visually hidden input for form accessibility and focus management */}\n <VisuallyHidden>\n <input\n ref={ref}\n aria-label={ariaLabel}\n checked={!!field.value}\n name={name}\n onBlur={onBlur}\n type=\"checkbox\"\n onChange={(e) => {\n onChange(e.target.checked);\n }}\n onFocus={() => {\n // When RHF focuses this hidden input (e.g., on validation error),\n // forward focus to the visual switch to show focus ring\n visualSwitchRef.current?.focus();\n }}\n />\n </VisuallyHidden>\n {/* Visual HeroSwitch component */}\n <HeroSwitch\n ref={visualSwitchRef}\n aria-label={ariaLabel}\n classNames={classNames}\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n defaultSelected={!!defaultValue}\n endContent={endContent}\n isDisabled={disabled}\n isSelected={!!field.value}\n name={`${name}_switch`}\n onValueChange={onChange}\n size={size}\n startContent={startContent}\n thumbIcon={thumbIcon}\n >\n {label}\n </HeroSwitch>\n {invalid ? (\n <div\n {...getHelperWrapperProps()}\n className={cn(\n getHelperWrapperProps()?.className,\n // force helper to be visible (for some reason it's hidden by default) and remove margin\n 'ml-0 block',\n )}\n >\n <div {...getErrorMessageProps()}>{errorMessage}</div>\n </div>\n ) : null}\n </div>\n );\n};\n\nexport default Switch;\n","import Switch from './Switch';\n\nexport type { SwitchProps } from './Switch';\n\nexport { Switch };\n\nexport default Switch;\n"]}
@@ -1,11 +1,11 @@
1
1
  import {
2
2
  UniformContext
3
- } from "./chunk-TUIK3MER.js";
3
+ } from "./chunk-IV45K4WU.js";
4
4
  import {
5
5
  flatArrayKey,
6
6
  nameToTestId,
7
7
  toValidationFormat
8
- } from "./chunk-BOCYHTFE.js";
8
+ } from "./chunk-O2XJNQQK.js";
9
9
  import {
10
10
  __objRest,
11
11
  __spreadProps,
@@ -112,4 +112,4 @@ export {
112
112
  checkFieldIsRequired,
113
113
  useFormContext
114
114
  };
115
- //# sourceMappingURL=chunk-ZZW7JZ2U.js.map
115
+ //# sourceMappingURL=chunk-SJWL6EMI.js.map
@@ -1,6 +1,6 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
- var _chunkOED4DYBDcjs = require('./chunk-OED4DYBD.cjs');
3
+ var _chunkV3M7HL26cjs = require('./chunk-V3M7HL26.cjs');
4
4
 
5
5
 
6
6
 
@@ -88,7 +88,7 @@ var SwitchBox = (_a) => {
88
88
  ref,
89
89
  required,
90
90
  testId
91
- } = _chunkOED4DYBDcjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
91
+ } = _chunkV3M7HL26cjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
92
92
  name
93
93
  }, uniformFieldProps));
94
94
  const visualSwitchRef = _react.useRef.call(void 0, null);
@@ -212,4 +212,4 @@ var SwitchBox_default2 = SwitchBox_default;
212
212
 
213
213
 
214
214
  exports.switchBoxVariants = switchBoxVariants; exports.SwitchBox_default = SwitchBox_default; exports.SwitchBox_default2 = SwitchBox_default2;
215
- //# sourceMappingURL=chunk-OIKPQMQ2.cjs.map
215
+ //# sourceMappingURL=chunk-SW3NGBCE.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-OIKPQMQ2.cjs","../src/SwitchBox/SwitchBox.tsx","../src/SwitchBox/index.ts"],"names":["_a","SwitchBox_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACA;AACF,wDAA6B;AAC7B;AACA;ACLA,8BAAuB;AAEvB,wCAA0B;AAC1B,6DAA+B;AAE/B,oDAA6C;AAgJrC,+CAAA;AA5ID,IAAM,kBAAA,EAAoB,4BAAA;AAAG,EAClC,KAAA,EAAO;AAAA,IACL,GAAA,EAAK,6JAAA;AAAA,IACL,WAAA,EAAa,4BAAA;AAAA,IACb,IAAA,EAAM,EAAA;AAAA,IACN,KAAA,EACE,iKAAA;AAAA,IACF,OAAA,EAAS,EAAA;AAAA,IACT,KAAA,EAAO,EAAA;AAAA,IACP,SAAA,EAAW;AAAA,EACb,CAAA;AAAA,EACA,QAAA,EAAU;AAAA,IACR,UAAA,EAAY;AAAA,MACV,IAAA,EAAM;AAAA,QACJ,GAAA,EAAK;AAAA,MACP;AAAA,IACF,CAAA;AAAA,IACA,SAAA,EAAW;AAAA,MACT,IAAA,EAAM;AAAA,QACJ,GAAA,EAAK,gBAAA;AAAA,QACL,KAAA,EAAO;AAAA,MACT;AAAA,IACF,CAAA;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI;AAAA,QACF,GAAA,EAAK,WAAA;AAAA,QACL,WAAA,EAAa,SAAA;AAAA,QACb,KAAA,EAAO;AAAA,MACT,CAAA;AAAA,MACA,EAAA,EAAI;AAAA,QACF,GAAA,EAAK,WAAA;AAAA,QACL,WAAA,EAAa,YAAA;AAAA,QACb,KAAA,EAAO;AAAA,MACT,CAAA;AAAA,MACA,EAAA,EAAI;AAAA,QACF,GAAA,EAAK,WAAA;AAAA,QACL,WAAA,EAAa,YAAA;AAAA,QACb,KAAA,EAAO;AAAA,MACT;AAAA,IACF;AAAA,EACF,CAAA;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA,EACR;AACF,CAAC,CAAA;AA8BD,IAAM,UAAA,EAAY,CAAC,EAAA,EAAA,GAQG;AARH,EAAA,IAAA,GAAA,EAAA,EAAA,EACjB;AAAA,IAAA,UAAA,EAAY,KAAA,CAAA;AAAA,IACZ,YAAA,EAAc,KAAA,CAAA;AAAA,IACd,KAAA,EAAO,KAAA,CAAA;AAAA,IACP,IAAA;AAAA,IACA,KAAA,EAAO,KAAA,CAAA;AAAA,IACP,UAAA,EAAY,KAAA;AAAA,EA7Fd,EAAA,EAuFmB,EAAA,EAOd,kBAAA,EAAA,yCAAA,EAPc,EAOd;AAAA,IANH,WAAA;AAAA,IACA,aAAA;AAAA,IACA,MAAA;AAAA,IACA,MAAA;AAAA,IACA,MAAA;AAAA,IACA;AAAA,EAAA,CAAA,CAAA;AA7FF,EAAA,IAAAA,GAAAA;AAgGE,EAAA,MAAM;AAAA,IACJ,YAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,KAAA;AAAA,IACA,oBAAA;AAAA,IACA,qBAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA,GAAA;AAAA,IACA,QAAA;AAAA,IACA;AAAA,EACF,EAAA,EAAI,+CAAA,8CAAgB;AAAA,IAClB;AAAA,EAAA,CAAA,EACG,iBAAA,CACJ,CAAA;AAGD,EAAA,MAAM,gBAAA,EAAkB,2BAAA,IAA6B,CAAA;AAGrD,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,KAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,aAAA;AAAA,IACA;AAAA,EACF,EAAA,EAAI,+BAAA;AAAU,IACZ,eAAA,EAAiB,CAAC,CAAC,YAAA;AAAA,IACnB,UAAA,EAAY,QAAA;AAAA,IACZ,UAAA,EAAY,CAAC,CAAC,KAAA,CAAM,KAAA;AAAA,IACpB,IAAA,EAAM,CAAA,EAAA;AACN,IAAA;AACA,IAAA;AACA,IAAA;AACD,EAAA;AAGK,EAAA;AACJ,IAAA;AACA,IAAA;AACA,IAAA;AACD,EAAA;AACK,EAAA;AAGJ,EAAA;AACE,oBAAA;AAAC,MAAA;AAAA,MAAA;AAEC,QAAA;AACA,QAAA;AACA,QAAA;AACA,QAAA;AAEA,QAAA;AAAA,0BAAA;AACE,4BAAA;AAAA,cAAA;AAAC,cAAA;AAAA,gBAAA;AACC,gBAAA;AACgD,gBAAA;AAC/B,gBAAA;AACjB,gBAAA;AACU,gBAAA;AACL,gBAAA;AAEH,kBAAA;AAAyB,gBAAA;AAC3B,gBAAA;AAnKZ,kBAAA;AAuKc,kBAAA;AAAyB,gBAAA;AAC3B,cAAA;AAAA,YAAA;AACF,4BAAA;AAEA,cAAA;AAAC,cAAA;AAAA,gBAAA;AACM,cAAA;AADN,gBAAA;AA3KX,kBAAA;AAgLc,kBAAA;AAEA,kBAAA;AAAO,gBAAA;AACT,cAAA;AAAA,YAAA;AACF,UAAA;AAEA,UAAA;AACA,YAAA;AAAC,YAAA;AAAA,cAAA;AAE8D,cAAA;AAI7C,gBAAA;AACM,gBAAA;AAC4C,gBAAA;AACnD,gBAAA;AACC,gBAAA;AAC8B,cAAA;AAG9C,YAAA;AACF,UAAA;AAED,UAAA;AACD,0BAAA;AACG,YAAA;AAA0D,YAAA;AAGvD,UAAA;AAEL,UAAA;AACC,YAAA;AAAC,YAAA;AAAA,cAAA;AAE8D,cAAA;AAI7C,gBAAA;AACM,gBAAA;AAC4C,gBAAA;AACnD,gBAAA;AACC,gBAAA;AAC8B,cAAA;AAG9C,YAAA;AACF,UAAA;AACE,QAAA;AAAA,MAAA;AACN,IAAA;AACC,IAAA;AACE,MAAA;AAAA,MAAA;AAEC,QAAA;AACEA,UAAAA;AAAyB;AAEzB,UAAA;AACF,QAAA;AAEA,QAAA;AAA+C,MAAA;AAE/C,IAAA;AACN,EAAA;AAEJ;AAEO;ADrCI;AACA;AEvMJC;AFyMI;AACA;AACA;AACA;AACA;AACA","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-OIKPQMQ2.cjs","sourcesContent":[null,"import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { useSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchBoxVariants = tv({\n slots: {\n box: 'group inline-flex w-full cursor-pointer items-center justify-between rounded-lg border-2 border-default hover:bg-content2 data-[selected=true]:border-focus',\n description: 'text-foreground opacity-70',\n icon: '',\n label:\n 'font-medium text-foreground group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n wrapper: '',\n thumb: '',\n thumbIcon: '',\n },\n variants: {\n isDisabled: {\n true: {\n box: 'pointer-events-none opacity-disabled',\n },\n },\n isInvalid: {\n true: {\n box: '!border-danger',\n label: '!text-danger',\n },\n },\n size: {\n sm: {\n box: 'gap-2 p-3',\n description: 'text-xs',\n label: 'text-xs',\n },\n md: {\n box: 'gap-4 p-4',\n description: 'text-small',\n label: 'text-sm',\n },\n lg: {\n box: 'gap-4 p-5',\n description: 'text-small',\n label: 'text-base',\n },\n },\n },\n defaultVariants: {\n size: 'md',\n },\n});\n\ntype ClassName = TVClassName<typeof switchBoxVariants>;\n\nexport interface SwitchBoxProps {\n /** CSS class name */\n className?: ClassName;\n /** Description text displayed below the label */\n description?: ReactNode;\n /** whether the switch should be disabled */\n disabled?: boolean;\n /** Icon to be displayed in the box */\n icon?: ReactNode;\n /** component displayed as the label */\n label?: ReactNode;\n /** name the field is registered under */\n name: string;\n /** whether the field is required */\n required?: boolean;\n /* Size of the switch */\n size?: 'sm' | 'md' | 'lg';\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** Icon to be displayed inside the thumb */\n thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n * SwitchBox component - A card-like box with a switch control\n */\nconst SwitchBox = ({\n className = undefined,\n description = undefined,\n icon = undefined,\n name,\n size = undefined,\n thumbIcon = undefined,\n ...uniformFieldProps\n}: SwitchBoxProps) => {\n const {\n defaultValue,\n disabled,\n errorMessage,\n field,\n getErrorMessageProps,\n getHelperWrapperProps,\n invalid,\n label,\n onBlur,\n onChange,\n ref,\n required,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Ref for the visual switch to forward focus\n const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n // Use the useSwitch hook to get access to all the necessary props\n const {\n Component,\n slots,\n isSelected,\n getBaseProps,\n getInputProps,\n getWrapperProps,\n } = useSwitch({\n defaultSelected: !!defaultValue,\n isDisabled: disabled,\n isSelected: !!field.value,\n name: `${name}_switch`,\n onValueChange: onChange,\n size,\n thumbIcon,\n });\n\n // classNames from slots\n const variants = switchBoxVariants({\n isDisabled: disabled,\n isInvalid: invalid,\n size,\n });\n const classNames = variantsToClassNames(variants, className, 'box');\n\n return (\n <div>\n <Component\n {...getBaseProps()}\n className={classNames.box}\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n >\n <VisuallyHidden>\n <input\n ref={ref}\n aria-label={typeof label === 'string' ? label : name}\n checked={!!field.value}\n name={name}\n tabIndex={-1}\n type=\"checkbox\"\n onChange={(e) => {\n onChange(e.target.checked);\n }}\n onFocus={() => {\n // When RHF focuses this hidden input (e.g., on validation error),\n // forward focus to the visual switch to show focus ring\n visualSwitchRef.current?.focus();\n }}\n />\n {/* Visual switch input for focus ring */}\n <input\n ref={visualSwitchRef}\n {...getInputProps()}\n onBlur={(e) => {\n // Call HeroUI's internal onBlur to clear focus state and remove focus ring\n getInputProps().onBlur?.(e);\n // Then call RHF's onBlur to mark field as touched\n onBlur();\n }}\n />\n </VisuallyHidden>\n {!icon ? (\n <span\n {...getWrapperProps()}\n className={cn(getWrapperProps().className, classNames.wrapper)}\n >\n <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n {thumbIcon && typeof thumbIcon === 'function'\n ? thumbIcon({\n isSelected: !!isSelected,\n className: slots.thumbIcon({ class: classNames.thumbIcon }),\n width: '1em',\n height: '1em',\n 'data-checked': isSelected ? 'true' : 'false',\n })\n : thumbIcon}\n </span>\n </span>\n ) : null}\n {icon ? <div className={classNames.icon}>{icon}</div> : null}\n <div className=\"grow\">\n {label ? <div className={classNames.label}>{label}</div> : null}\n {description ? (\n <div className={classNames.description}>{description}</div>\n ) : null}\n </div>\n {icon ? (\n <span\n {...getWrapperProps()}\n className={cn(getWrapperProps().className, classNames.wrapper)}\n >\n <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n {thumbIcon && typeof thumbIcon === 'function'\n ? thumbIcon({\n isSelected: !!isSelected,\n className: slots.thumbIcon({ class: classNames.thumbIcon }),\n width: '1em',\n height: '1em',\n 'data-checked': isSelected ? 'true' : 'false',\n })\n : thumbIcon}\n </span>\n </span>\n ) : null}\n </Component>\n {invalid ? (\n <div\n {...getHelperWrapperProps()}\n className={cn(\n getHelperWrapperProps()?.className,\n // force helper to be visible (for some reason it's hidden by default) and remove margin\n 'ml-0 block',\n )}\n >\n <div {...getErrorMessageProps()}>{errorMessage}</div>\n </div>\n ) : null}\n </div>\n );\n};\n\nexport default SwitchBox;\n","import SwitchBox from './SwitchBox';\n\nexport type { SwitchBoxProps } from './SwitchBox';\n\nexport { switchBoxVariants } from './SwitchBox';\nexport { SwitchBox };\n\nexport default SwitchBox;\n"]}
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-SW3NGBCE.cjs","../src/SwitchBox/SwitchBox.tsx","../src/SwitchBox/index.ts"],"names":["_a","SwitchBox_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-SW3NGBCE.cjs","sourcesContent":[null,"import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { SwitchProps as HeroSwitchProps } from '@heroui/switch';\nimport type { ReactNode } from 'react';\n\nimport { useRef } from 'react';\n\nimport { useSwitch } from '@heroui/switch';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const switchBoxVariants = tv({\n slots: {\n box: 'group inline-flex w-full cursor-pointer items-center justify-between rounded-lg border-2 border-default hover:bg-content2 data-[selected=true]:border-focus',\n description: 'text-foreground opacity-70',\n icon: '',\n label:\n 'font-medium text-foreground group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n wrapper: '',\n thumb: '',\n thumbIcon: '',\n },\n variants: {\n isDisabled: {\n true: {\n box: 'pointer-events-none opacity-disabled',\n },\n },\n isInvalid: {\n true: {\n box: '!border-danger',\n label: '!text-danger',\n },\n },\n size: {\n sm: {\n box: 'gap-2 p-3',\n description: 'text-xs',\n label: 'text-xs',\n },\n md: {\n box: 'gap-4 p-4',\n description: 'text-small',\n label: 'text-sm',\n },\n lg: {\n box: 'gap-4 p-5',\n description: 'text-small',\n label: 'text-base',\n },\n },\n },\n defaultVariants: {\n size: 'md',\n },\n});\n\ntype ClassName = TVClassName<typeof switchBoxVariants>;\n\nexport interface SwitchBoxProps {\n /** CSS class name */\n className?: ClassName;\n /** Description text displayed below the label */\n description?: ReactNode;\n /** whether the switch should be disabled */\n disabled?: boolean;\n /** Icon to be displayed in the box */\n icon?: ReactNode;\n /** component displayed as the label */\n label?: ReactNode;\n /** name the field is registered under */\n name: string;\n /** whether the field is required */\n required?: boolean;\n /* Size of the switch */\n size?: 'sm' | 'md' | 'lg';\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** Icon to be displayed inside the thumb */\n thumbIcon?: HeroSwitchProps['thumbIcon'];\n}\n\n/**\n * SwitchBox component - A card-like box with a switch control\n */\nconst SwitchBox = ({\n className = undefined,\n description = undefined,\n icon = undefined,\n name,\n size = undefined,\n thumbIcon = undefined,\n ...uniformFieldProps\n}: SwitchBoxProps) => {\n const {\n defaultValue,\n disabled,\n errorMessage,\n field,\n getErrorMessageProps,\n getHelperWrapperProps,\n invalid,\n label,\n onBlur,\n onChange,\n ref,\n required,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Ref for the visual switch to forward focus\n const visualSwitchRef = useRef<HTMLInputElement>(null);\n\n // Use the useSwitch hook to get access to all the necessary props\n const {\n Component,\n slots,\n isSelected,\n getBaseProps,\n getInputProps,\n getWrapperProps,\n } = useSwitch({\n defaultSelected: !!defaultValue,\n isDisabled: disabled,\n isSelected: !!field.value,\n name: `${name}_switch`,\n onValueChange: onChange,\n size,\n thumbIcon,\n });\n\n // classNames from slots\n const variants = switchBoxVariants({\n isDisabled: disabled,\n isInvalid: invalid,\n size,\n });\n const classNames = variantsToClassNames(variants, className, 'box');\n\n return (\n <div>\n <Component\n {...getBaseProps()}\n className={classNames.box}\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n >\n <VisuallyHidden>\n <input\n ref={ref}\n aria-label={typeof label === 'string' ? label : name}\n checked={!!field.value}\n name={name}\n tabIndex={-1}\n type=\"checkbox\"\n onChange={(e) => {\n onChange(e.target.checked);\n }}\n onFocus={() => {\n // When RHF focuses this hidden input (e.g., on validation error),\n // forward focus to the visual switch to show focus ring\n visualSwitchRef.current?.focus();\n }}\n />\n {/* Visual switch input for focus ring */}\n <input\n ref={visualSwitchRef}\n {...getInputProps()}\n onBlur={(e) => {\n // Call HeroUI's internal onBlur to clear focus state and remove focus ring\n getInputProps().onBlur?.(e);\n // Then call RHF's onBlur to mark field as touched\n onBlur();\n }}\n />\n </VisuallyHidden>\n {!icon ? (\n <span\n {...getWrapperProps()}\n className={cn(getWrapperProps().className, classNames.wrapper)}\n >\n <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n {thumbIcon && typeof thumbIcon === 'function'\n ? thumbIcon({\n isSelected: !!isSelected,\n className: slots.thumbIcon({ class: classNames.thumbIcon }),\n width: '1em',\n height: '1em',\n 'data-checked': isSelected ? 'true' : 'false',\n })\n : thumbIcon}\n </span>\n </span>\n ) : null}\n {icon ? <div className={classNames.icon}>{icon}</div> : null}\n <div className=\"grow\">\n {label ? <div className={classNames.label}>{label}</div> : null}\n {description ? (\n <div className={classNames.description}>{description}</div>\n ) : null}\n </div>\n {icon ? (\n <span\n {...getWrapperProps()}\n className={cn(getWrapperProps().className, classNames.wrapper)}\n >\n <span className={cn(slots.thumb({ class: classNames.thumb }))}>\n {thumbIcon && typeof thumbIcon === 'function'\n ? thumbIcon({\n isSelected: !!isSelected,\n className: slots.thumbIcon({ class: classNames.thumbIcon }),\n width: '1em',\n height: '1em',\n 'data-checked': isSelected ? 'true' : 'false',\n })\n : thumbIcon}\n </span>\n </span>\n ) : null}\n </Component>\n {invalid ? (\n <div\n {...getHelperWrapperProps()}\n className={cn(\n getHelperWrapperProps()?.className,\n // force helper to be visible (for some reason it's hidden by default) and remove margin\n 'ml-0 block',\n )}\n >\n <div {...getErrorMessageProps()}>{errorMessage}</div>\n </div>\n ) : null}\n </div>\n );\n};\n\nexport default SwitchBox;\n","import SwitchBox from './SwitchBox';\n\nexport type { SwitchBoxProps } from './SwitchBox';\n\nexport { switchBoxVariants } from './SwitchBox';\nexport { SwitchBox };\n\nexport default SwitchBox;\n"]}
@@ -1,6 +1,6 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
- var _chunkOED4DYBDcjs = require('./chunk-OED4DYBD.cjs');
3
+ var _chunkV3M7HL26cjs = require('./chunk-V3M7HL26.cjs');
4
4
 
5
5
 
6
6
 
@@ -148,7 +148,7 @@ var RadioBoxes = (_a) => {
148
148
  ref,
149
149
  required,
150
150
  testId
151
- } = _chunkOED4DYBDcjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
151
+ } = _chunkV3M7HL26cjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
152
152
  name
153
153
  }, uniformFieldProps));
154
154
  const variants = radioBoxesVariants();
@@ -216,4 +216,4 @@ var RadioBoxes_default2 = RadioBoxes_default;
216
216
 
217
217
 
218
218
  exports.radioBoxVariants = radioBoxVariants; exports.RadioBoxes_default = RadioBoxes_default; exports.RadioBoxes_default2 = RadioBoxes_default2;
219
- //# sourceMappingURL=chunk-WRKONOOV.cjs.map
219
+ //# sourceMappingURL=chunk-THDHNYP7.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-WRKONOOV.cjs","../src/RadioBoxes/RadioBoxes.tsx","../src/RadioBoxes/RadioBox.tsx","../src/RadioBoxes/index.ts"],"names":["tv","variantsToClassNames","jsx","_a","_b","RadioBoxes_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-WRKONOOV.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n//\nimport type { RadioBoxProps } from './RadioBox';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\nimport { RadioBox } from './RadioBox';\n\nexport const radioBoxesVariants = tv({\n slots: {\n base: 'group gap-0', // Needs group for group-data condition\n boxBase: '',\n boxControl: '',\n boxDescription: '',\n boxLabel: '',\n boxLabelWrapper: '',\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof radioBoxesVariants>;\ntype ClassName = TVClassName<typeof radioBoxesVariants>;\n\nexport interface RadioBoxesOption {\n /** Description of the value. Works with variant radioBox. */\n description?: ReactNode;\n /** disables the option */\n disabled?: boolean;\n /** option label */\n label?: ReactNode;\n /** option icon */\n icon?: ReactNode;\n /** HTML data-testid attribute of the option */\n testId?: string;\n /** option value */\n value: string;\n}\n\nexport interface RadioBoxesProps extends VariantProps {\n /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n ariaLabel?: string;\n /** CSS class name */\n className?: ClassName;\n /** Determines if the Buttons are disabled or not. */\n disabled?: boolean;\n /** determines orientation of the Buttons. */\n inline?: boolean;\n /** Label displayed next to the RadioButton. */\n label?: ReactNode;\n /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n name: string;\n /** Radio button configuration. */\n options: RadioBoxesOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n}\n\n/**\n * RadioBoxes component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n */\nconst RadioBoxes = ({\n className = undefined,\n inline = false,\n name,\n options,\n ...uniformFieldProps\n}: RadioBoxesProps) => {\n const {\n ariaLabel,\n defaultValue,\n errorMessage,\n invalid,\n disabled,\n label,\n onBlur,\n onChange,\n ref,\n required,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // classNames from slots\n const variants = radioBoxesVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n const boxClassNames: RadioBoxProps['classNames'] = {\n base: classNames.boxBase,\n control: classNames.boxControl,\n description: classNames.boxDescription,\n label: classNames.boxLabel,\n labelWrapper: classNames.boxLabelWrapper,\n };\n\n return (\n <HeroRadioGroup\n ref={ref}\n aria-label={ariaLabel}\n classNames={classNames}\n // see HeroUI styles for group-data condition (data-invalid),\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n defaultValue={defaultValue as string | undefined}\n errorMessage={errorMessage}\n isDisabled={disabled}\n isInvalid={invalid}\n isRequired={required}\n label={label ? <legend>{label}</legend> : null}\n name={name}\n onBlur={onBlur}\n onValueChange={onChange}\n orientation={inline ? 'horizontal' : 'vertical'}\n >\n {options.map((option) => {\n if ('value' in option) {\n const optionTestId = slugify(\n `${testId}_option_${option.testId ?? option.value}`,\n { replaceDots: true },\n );\n return (\n <RadioBox\n key={option.value}\n classNames={boxClassNames}\n data-testid={optionTestId}\n description={option.description}\n icon={option.icon}\n isDisabled={!!disabled || option.disabled}\n isInvalid={invalid}\n value={option.value}\n >\n {option.label ?? option.value}\n </RadioBox>\n );\n }\n return null;\n })}\n </HeroRadioGroup>\n );\n};\n\nexport default RadioBoxes;\n","import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { RadioProps as HeroRadioProps } from '@heroui/radio';\nimport type { ReactNode } from 'react';\n\nimport { useRadio } from '@heroui/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nexport const radioBoxVariants = tv({\n slots: {\n base: 'group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus',\n control: '',\n description: 'text-foreground opacity-70 text-small',\n icon: '',\n label: '',\n labelWrapper: 'grow',\n },\n variants: {\n isDisabled: {\n true: {\n base: 'pointer-events-none opacity-disabled',\n },\n },\n isInvalid: {\n true: {\n base: '!border-danger',\n },\n },\n },\n});\n\ntype ClassName = TVClassName<typeof radioBoxVariants>;\n\nexport interface RadioBoxProps extends Omit<HeroRadioProps, 'className'> {\n /** CSS class name */\n className?: ClassName;\n /** icon for the option */\n icon?: ReactNode;\n /** whether the radio is invalid */\n isInvalid?: boolean;\n}\n\nexport const RadioBox = ({\n classNames: _classNames = undefined,\n icon = undefined,\n isInvalid = false,\n ...props\n}: RadioBoxProps) => {\n const {\n children,\n Component,\n description,\n getBaseProps,\n getControlProps,\n getInputProps,\n getLabelProps,\n getLabelWrapperProps,\n getWrapperProps,\n isDisabled,\n } = useRadio(props as HeroRadioProps);\n\n // classNames from slots\n const variants = radioBoxVariants({\n isDisabled,\n isInvalid,\n });\n const classNames = variantsToClassNames(\n variants,\n // @ts-expect-error not sure here, but it works\n _classNames,\n 'base',\n );\n\n return (\n <Component {...getBaseProps()} className={classNames.base}>\n <VisuallyHidden>\n <input {...getInputProps()} />\n </VisuallyHidden>\n {!icon ? (\n <span {...getWrapperProps()}>\n <span\n {...getControlProps()}\n className={cn(getControlProps().className, classNames.control)}\n />\n </span>\n ) : null}\n {icon ? <div className={classNames.icon}>{icon}</div> : null}\n <div\n {...getLabelWrapperProps()}\n className={cn(\n getLabelWrapperProps().className,\n classNames.labelWrapper,\n )}\n >\n {children ? (\n <span\n {...getLabelProps()}\n className={cn(getLabelProps().className, classNames.label)}\n >\n {children}\n </span>\n ) : null}\n {description ? (\n <div className={classNames.description}>{description}</div>\n ) : null}\n </div>\n {icon ? (\n <span {...getWrapperProps()}>\n <span\n {...getControlProps()}\n className={cn(getControlProps().className, classNames.control)}\n />\n </span>\n ) : null}\n </Component>\n );\n};\n\nexport default RadioBox;\n","import RadioBoxes from './RadioBoxes';\n\nexport type { RadioBoxesProps } from './RadioBoxes';\nexport { radioBoxVariants } from './RadioBox';\n\nexport { RadioBoxes };\n\nexport default RadioBoxes;\n"]}
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-THDHNYP7.cjs","../src/RadioBoxes/RadioBoxes.tsx","../src/RadioBoxes/RadioBox.tsx","../src/RadioBoxes/index.ts"],"names":["tv","variantsToClassNames","jsx","_a","_b","RadioBoxes_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-THDHNYP7.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n//\nimport type { RadioBoxProps } from './RadioBox';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\nimport { RadioBox } from './RadioBox';\n\nexport const radioBoxesVariants = tv({\n slots: {\n base: 'group gap-0', // Needs group for group-data condition\n boxBase: '',\n boxControl: '',\n boxDescription: '',\n boxLabel: '',\n boxLabelWrapper: '',\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'mb-2 inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof radioBoxesVariants>;\ntype ClassName = TVClassName<typeof radioBoxesVariants>;\n\nexport interface RadioBoxesOption {\n /** Description of the value. Works with variant radioBox. */\n description?: ReactNode;\n /** disables the option */\n disabled?: boolean;\n /** option label */\n label?: ReactNode;\n /** option icon */\n icon?: ReactNode;\n /** HTML data-testid attribute of the option */\n testId?: string;\n /** option value */\n value: string;\n}\n\nexport interface RadioBoxesProps extends VariantProps {\n /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n ariaLabel?: string;\n /** CSS class name */\n className?: ClassName;\n /** Determines if the Buttons are disabled or not. */\n disabled?: boolean;\n /** determines orientation of the Buttons. */\n inline?: boolean;\n /** Label displayed next to the RadioButton. */\n label?: ReactNode;\n /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n name: string;\n /** Radio button configuration. */\n options: RadioBoxesOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n}\n\n/**\n * RadioBoxes component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n */\nconst RadioBoxes = ({\n className = undefined,\n inline = false,\n name,\n options,\n ...uniformFieldProps\n}: RadioBoxesProps) => {\n const {\n ariaLabel,\n defaultValue,\n errorMessage,\n invalid,\n disabled,\n label,\n onBlur,\n onChange,\n ref,\n required,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // classNames from slots\n const variants = radioBoxesVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n const boxClassNames: RadioBoxProps['classNames'] = {\n base: classNames.boxBase,\n control: classNames.boxControl,\n description: classNames.boxDescription,\n label: classNames.boxLabel,\n labelWrapper: classNames.boxLabelWrapper,\n };\n\n return (\n <HeroRadioGroup\n ref={ref}\n aria-label={ariaLabel}\n classNames={classNames}\n // see HeroUI styles for group-data condition (data-invalid),\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n defaultValue={defaultValue as string | undefined}\n errorMessage={errorMessage}\n isDisabled={disabled}\n isInvalid={invalid}\n isRequired={required}\n label={label ? <legend>{label}</legend> : null}\n name={name}\n onBlur={onBlur}\n onValueChange={onChange}\n orientation={inline ? 'horizontal' : 'vertical'}\n >\n {options.map((option) => {\n if ('value' in option) {\n const optionTestId = slugify(\n `${testId}_option_${option.testId ?? option.value}`,\n { replaceDots: true },\n );\n return (\n <RadioBox\n key={option.value}\n classNames={boxClassNames}\n data-testid={optionTestId}\n description={option.description}\n icon={option.icon}\n isDisabled={!!disabled || option.disabled}\n isInvalid={invalid}\n value={option.value}\n >\n {option.label ?? option.value}\n </RadioBox>\n );\n }\n return null;\n })}\n </HeroRadioGroup>\n );\n};\n\nexport default RadioBoxes;\n","import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { RadioProps as HeroRadioProps } from '@heroui/radio';\nimport type { ReactNode } from 'react';\n\nimport { useRadio } from '@heroui/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nexport const radioBoxVariants = tv({\n slots: {\n base: 'group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus',\n control: '',\n description: 'text-foreground opacity-70 text-small',\n icon: '',\n label: '',\n labelWrapper: 'grow',\n },\n variants: {\n isDisabled: {\n true: {\n base: 'pointer-events-none opacity-disabled',\n },\n },\n isInvalid: {\n true: {\n base: '!border-danger',\n },\n },\n },\n});\n\ntype ClassName = TVClassName<typeof radioBoxVariants>;\n\nexport interface RadioBoxProps extends Omit<HeroRadioProps, 'className'> {\n /** CSS class name */\n className?: ClassName;\n /** icon for the option */\n icon?: ReactNode;\n /** whether the radio is invalid */\n isInvalid?: boolean;\n}\n\nexport const RadioBox = ({\n classNames: _classNames = undefined,\n icon = undefined,\n isInvalid = false,\n ...props\n}: RadioBoxProps) => {\n const {\n children,\n Component,\n description,\n getBaseProps,\n getControlProps,\n getInputProps,\n getLabelProps,\n getLabelWrapperProps,\n getWrapperProps,\n isDisabled,\n } = useRadio(props as HeroRadioProps);\n\n // classNames from slots\n const variants = radioBoxVariants({\n isDisabled,\n isInvalid,\n });\n const classNames = variantsToClassNames(\n variants,\n // @ts-expect-error not sure here, but it works\n _classNames,\n 'base',\n );\n\n return (\n <Component {...getBaseProps()} className={classNames.base}>\n <VisuallyHidden>\n <input {...getInputProps()} />\n </VisuallyHidden>\n {!icon ? (\n <span {...getWrapperProps()}>\n <span\n {...getControlProps()}\n className={cn(getControlProps().className, classNames.control)}\n />\n </span>\n ) : null}\n {icon ? <div className={classNames.icon}>{icon}</div> : null}\n <div\n {...getLabelWrapperProps()}\n className={cn(\n getLabelWrapperProps().className,\n classNames.labelWrapper,\n )}\n >\n {children ? (\n <span\n {...getLabelProps()}\n className={cn(getLabelProps().className, classNames.label)}\n >\n {children}\n </span>\n ) : null}\n {description ? (\n <div className={classNames.description}>{description}</div>\n ) : null}\n </div>\n {icon ? (\n <span {...getWrapperProps()}>\n <span\n {...getControlProps()}\n className={cn(getControlProps().className, classNames.control)}\n />\n </span>\n ) : null}\n </Component>\n );\n};\n\nexport default RadioBox;\n","import RadioBoxes from './RadioBoxes';\n\nexport type { RadioBoxesProps } from './RadioBoxes';\nexport { radioBoxVariants } from './RadioBox';\n\nexport { RadioBoxes };\n\nexport default RadioBoxes;\n"]}
@@ -1,9 +1,9 @@
1
1
  import {
2
2
  useFormContext
3
- } from "./chunk-ZZW7JZ2U.js";
3
+ } from "./chunk-SJWL6EMI.js";
4
4
  import {
5
5
  FormContext_default
6
- } from "./chunk-TUIK3MER.js";
6
+ } from "./chunk-IV45K4WU.js";
7
7
 
8
8
  // src/Form/Form.tsx
9
9
  import { cn as cn2, slugify } from "@fuf-stack/pixel-utils";
@@ -169,4 +169,4 @@ export {
169
169
  Form_default,
170
170
  Form_default2
171
171
  };
172
- //# sourceMappingURL=chunk-P2TT7HU5.js.map
172
+ //# sourceMappingURL=chunk-UB7CSOZU.js.map
@@ -6,7 +6,7 @@ var _chunkOE5BOGGXcjs = require('./chunk-OE5BOGGX.cjs');
6
6
  var _chunkNHEZXA4Hcjs = require('./chunk-NHEZXA4H.cjs');
7
7
 
8
8
 
9
- var _chunkNV4YVZYXcjs = require('./chunk-NV4YVZYX.cjs');
9
+ var _chunk6AWHOBNLcjs = require('./chunk-6AWHOBNL.cjs');
10
10
 
11
11
 
12
12
  var _chunkPCTYJUY7cjs = require('./chunk-PCTYJUY7.cjs');
@@ -15,21 +15,19 @@ var _chunkPCTYJUY7cjs = require('./chunk-PCTYJUY7.cjs');
15
15
  var _chunk56TQOKG7cjs = require('./chunk-56TQOKG7.cjs');
16
16
 
17
17
 
18
- var _chunkUUGUQGMXcjs = require('./chunk-UUGUQGMX.cjs');
19
-
20
-
21
- var _chunkTKICOKNScjs = require('./chunk-TKICOKNS.cjs');
18
+ var _chunkFYN7ZWLWcjs = require('./chunk-FYN7ZWLW.cjs');
22
19
 
23
20
 
24
21
 
25
22
  var _chunk555JRYCScjs = require('./chunk-555JRYCS.cjs');
26
23
 
27
24
  // src/hooks/useUniformField/useUniformField.tsx
25
+ var _pixelutils = require('@fuf-stack/pixel-utils');
28
26
  var _pixels = require('@fuf-stack/pixels');
29
27
  var _jsxruntime = require('react/jsx-runtime');
30
28
  var useDebouncedInvalid = (invalid, delayMs) => {
31
29
  const debouncedInvalid = _pixels.useDebounce.call(void 0, invalid, delayMs);
32
- if (_chunkTKICOKNScjs.isTestEnvironment.call(void 0, )) {
30
+ if (_pixelutils.isTestEnvironment.call(void 0, )) {
33
31
  return invalid;
34
32
  }
35
33
  return debouncedInvalid;
@@ -52,7 +50,7 @@ var useUniformField = (params) => {
52
50
  getFieldState,
53
51
  getValues,
54
52
  resetField
55
- } = _chunkUUGUQGMXcjs.useFormContext.call(void 0, );
53
+ } = _chunkFYN7ZWLWcjs.useFormContext.call(void 0, );
56
54
  const {
57
55
  error,
58
56
  invalid: rawInvalid,
@@ -61,7 +59,7 @@ var useUniformField = (params) => {
61
59
  required,
62
60
  testId
63
61
  } = getFieldState(name, explicitTestId);
64
- const { field } = _chunkNV4YVZYXcjs.useController.call(void 0, {
62
+ const { field } = _chunk6AWHOBNLcjs.useController.call(void 0, {
65
63
  control,
66
64
  disabled,
67
65
  name
@@ -136,4 +134,4 @@ var useUniformField = (params) => {
136
134
 
137
135
 
138
136
  exports.useUniformField = useUniformField;
139
- //# sourceMappingURL=chunk-OED4DYBD.cjs.map
137
+ //# sourceMappingURL=chunk-V3M7HL26.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/hooks/useUniformField/useUniformField.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { FieldError, FieldValues, Path } from 'react-hook-form';\nimport type { InputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\nimport React from 'react';\n\nimport { useDebounce } from '@fuf-stack/pixels';\n\nimport { isTestEnvironment } from '../../helpers';\nimport { FieldCopyTestIdButton } from '../../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../../partials/FieldValidationError';\nimport { useController } from '../useController/useController';\nimport { useFormContext } from '../useFormContext/useFormContext';\nimport { useInput } from '../useInput/useInput';\nimport { useInputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\n/**\n * Debounce invalid state changes to prevent UI flicker on rapid changes.\n *\n * Primary purpose: Reduce UI flicker when validation state changes rapidly\n * (e.g., during fast typing). Without debouncing, error messages would flash\n * in/out rapidly, creating a poor UX.\n *\n * Secondary benefit: When animations are enabled (default), gives time for\n * enter/exit animations to complete smoothly.\n *\n * Behavior:\n * - Debounces both true → false and false → true transitions by `delayMs`\n * - Disabled in test environments for immediate snapshots\n */\nconst useDebouncedInvalid = (invalid: boolean, delayMs: number) => {\n const debouncedInvalid = useDebounce(invalid, delayMs);\n\n // Disable debouncing in test environments for immediate snapshots\n if (isTestEnvironment()) {\n return invalid;\n }\n\n return debouncedInvalid;\n};\n\nexport interface UseUniformFieldParams<\n TFieldValues extends FieldValues = FieldValues,\n TDisplay = unknown,\n> {\n /** Form field name */\n name: Path<TFieldValues> & string;\n /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n ariaLabel?: string;\n /** Disable the field */\n disabled?: boolean;\n /** Optional label content */\n label?: ReactNode;\n /** Optional explicit test id used to build stable test ids */\n testId?: string;\n /** Optional value transformation between form and display values */\n transform?: InputValueTransform<TDisplay>;\n /** Input type for special number handling */\n type?: 'text' | 'number' | 'password';\n}\n\nexport interface UseUniformFieldReturn<\n TFieldValues extends FieldValues = FieldValues,\n> {\n /** Computed aria-label fallback (field name) when no visible label exists. Components can override based on their accessibility needs (e.g., if placeholder provides sufficient context) */\n ariaLabel: string | undefined;\n /** react-hook-form control instance for advanced integrations */\n control: ReturnType<typeof useFormContext<TFieldValues>>['control'];\n /** Debug mode from Uniform provider */\n debugMode: ReturnType<typeof useFormContext<TFieldValues>>['debugMode'];\n /** Current value used to initialize uncontrolled components */\n defaultValue: unknown;\n /** Whether the field is currently disabled (from RHF) */\n disabled: boolean | undefined;\n /** Validation error(s) for the field */\n error: FieldError[] | undefined;\n /** Pre-built errorMessage node to plug into components */\n errorMessage: ReactNode | null;\n /** RHF controller field with transformed value/onChange (use this for simple components) */\n field: ReturnType<typeof useController<TFieldValues>>['field'];\n /** Helper to spread standardized error message props to underlying components */\n getErrorMessageProps: ReturnType<typeof useInput>['getErrorMessageProps'];\n /** Helper to spread standardized helper wrapper props (for spacing/animation) */\n getHelperWrapperProps: ReturnType<typeof useInput>['getHelperWrapperProps'];\n /** Helper to spread standardized label props to underlying components */\n getLabelProps: ReturnType<typeof useInput>['getLabelProps'];\n /** Access current form values (converted to validation-friendly format) */\n getValues: ReturnType<typeof useFormContext<TFieldValues>>['getValues'];\n /** Whether the field should show invalid state (debounced for smooth animations). True when field is invalid AND (dirty OR touched OR submitted) */\n invalid: boolean;\n /** Computed label node including optional test id copy button */\n label: ReactNode | null;\n /** onBlur handler from controller */\n onBlur: ReturnType<typeof useController<TFieldValues>>['field']['onBlur'];\n /** onChange handler from controller (with transform applied) */\n onChange: ReturnType<typeof useController<TFieldValues>>['field']['onChange'];\n /** Ref to forward to underlying control */\n ref: ReturnType<typeof useController<TFieldValues>>['field']['ref'];\n /** Whether the field is required according to validation schema */\n required: boolean;\n /** Reset a specific field in the form */\n resetField: ReturnType<typeof useFormContext<TFieldValues>>['resetField'];\n /** Generated HTML data-testid for the field */\n testId: string;\n}\n\n/**\n * Combines frequently used form field logic into a single hook.\n *\n * Provides:\n * - Enhanced form context (validation-aware state, `testId`, value transforms)\n * - Controller field with nullish conversion handling\n * - Value transformation via `transform` prop:\n * • Allows disentangled display and form values (e.g., string ↔ object, boolean ↔ array)\n * • Automatically applies `toDisplayValue` to field value for components\n * • Automatically applies `toFormValue` to display value when onChange is called\n * • Works with `type` prop for automatic number/string conversion\n * • Examples: storing objects while displaying strings, storing booleans as arrays, enriching values with metadata\n * - Debounced `invalid` state with smart timing:\n * • `true` (field becomes invalid): applies immediately so errors show right away\n * • `false` (field becomes valid): delayed 200ms to allow smooth exit animations\n * • Respects `prefers-reduced-motion` by skipping delays when user prefers reduced motion\n * - Smart `invalid` visibility (via `showInvalid`):\n * • Shows errors when field is dirty OR touched OR form has been submitted\n * • Prevents showing errors on pristine/untouched fields for better UX\n * • Works well for all field types (text inputs, checkboxes, radios, arrays)\n * - Prebuilt `errorMessage` React node using `FieldValidationError`\n * - Computed `label` node which appends a `FieldCopyTestIdButton` in\n * `debug-testids` mode\n * - `defaultValue` for uncontrolled defaults and all usual field handlers\n * - Access to form utilities: `control`, `getValues`, `resetField`\n * - Presentation helpers: `getLabelProps`, `getErrorMessageProps`,\n * `getHelperWrapperProps` for consistent wiring to underlying UI components\n */\nexport const useUniformField = <\n TFieldValues extends FieldValues = FieldValues,\n TDisplay = unknown,\n>(\n params: UseUniformFieldParams<TFieldValues, TDisplay>,\n): UseUniformFieldReturn<TFieldValues> => {\n const {\n name,\n ariaLabel: customAriaLabel,\n disabled = false,\n testId: explicitTestId,\n label,\n type,\n transform,\n } = params;\n\n const {\n control,\n debugMode,\n formState: { submitCount },\n getFieldState,\n getValues,\n resetField,\n } = useFormContext<TFieldValues>();\n\n const {\n error,\n invalid: rawInvalid,\n isDirty,\n isTouched,\n required,\n testId,\n } = getFieldState(name, explicitTestId);\n\n const { field } = useController<TFieldValues>({\n control,\n disabled,\n name,\n });\n const {\n onChange: fieldOnChange,\n value: fieldValue,\n disabled: isDisabled,\n onBlur,\n ref,\n } = field;\n\n // Get transform utilities (but don't apply them automatically)\n // Components can choose how to use them (directly or via useInputValueDebounce)\n const { toDisplayValue, toFormValue } = useInputValueTransform<TDisplay>({\n type,\n transform,\n });\n\n // For components without special needs: apply transform to value and onChange\n const transformedValue = toDisplayValue(fieldValue);\n const transformedOnChange = (eventOrValue: TDisplay | React.ChangeEvent) => {\n // Extract value from event or use value directly\n const displayValue =\n (eventOrValue as React.ChangeEvent<HTMLInputElement>)?.target?.value ??\n eventOrValue;\n const formValue = toFormValue(displayValue as TDisplay);\n fieldOnChange(formValue as typeof fieldValue);\n };\n\n const defaultValue = (getValues() as Record<string, unknown>)?.[\n name as string\n ];\n\n /**\n * Determine when to show the invalid state to the user.\n *\n * Show errors when the field is invalid AND any of these conditions are met:\n * - Field is dirty (value changed from initial) - good for checkboxes/radios/arrays\n * - Field is touched (focused and blurred) - good for text inputs\n * - Form has been submitted - shows all errors after submit attempt\n *\n * This prevents showing errors on pristine/untouched fields for better UX.\n * Examples:\n * - Text input: User loads form with empty required field → no error shown yet\n * - Text input: User focuses and blurs → error shows (via isTouched)\n * - Checkbox group: User clicks first checkbox → error shows immediately (via isDirty)\n * - Any field: User submits form → all errors show (via submitCount)\n *\n * The entire condition is debounced to prevent flickering and allow smooth animations\n * when any of the states (invalid, isDirty, isTouched, submitCount) change.\n */\n const showInvalid = rawInvalid && (isDirty || isTouched || submitCount > 0);\n const invalid = useDebouncedInvalid(showInvalid, 200);\n\n // Build a label node that:\n // - shows the provided label (unless explicitly set to false)\n // - appends a copy-to-clipboard button for the test id in `debug-testids` mode\n // Consumers can pass this directly to component `label` props\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const labelNode: ReactNode | null =\n !!label || showTestIdCopyButton ? (\n <>\n {label !== false ? label : null}\n {showTestIdCopyButton ? (\n <FieldCopyTestIdButton testId={testId} />\n ) : null}\n </>\n ) : null;\n\n // Ready-to-render error message; consumers can drop this into their\n // component `errorMessage` prop without repeating mapping/markup\n const errorMessage = <FieldValidationError error={error} testId={testId} />;\n\n // Generate standardized props for label, helper wrapper and error message\n // so consumers can spread them directly into UI components (e.g. HeroUI),\n // keeping animations/spacing consistent across fields\n const { getErrorMessageProps, getLabelProps, getHelperWrapperProps } =\n useInput({\n ref,\n classNames: {\n // set padding to 0 for error message exit animation\n helperWrapper: 'p-0',\n },\n errorMessage: JSON.stringify(error),\n isInvalid: invalid,\n isRequired: required,\n label,\n labelPlacement: 'outside',\n });\n\n // Compute aria-label: prefer custom prop, then use string label if available, otherwise field name\n // Components can further override this based on their specific accessibility needs\n // (e.g., Input/TextArea may skip this if they have a meaningful placeholder)\n const ariaLabel =\n customAriaLabel ?? (typeof label === 'string' ? label : name);\n\n return {\n ariaLabel,\n control,\n debugMode,\n defaultValue,\n disabled: isDisabled,\n error,\n errorMessage,\n field: {\n ...field,\n value: transformedValue as typeof field.value,\n onChange: transformedOnChange as typeof field.onChange,\n },\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n getValues,\n invalid,\n label: labelNode,\n onBlur,\n onChange: transformedOnChange as typeof field.onChange,\n ref,\n required,\n resetField,\n testId,\n };\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,SAAS,mBAAmB;AAiOtB,mBAGI,KAHJ;AAzMN,IAAM,sBAAsB,CAAC,SAAkB,YAAoB;AACjE,QAAM,mBAAmB,YAAY,SAAS,OAAO;AAGrD,MAAI,kBAAkB,GAAG;AACvB,WAAO;AAAA,EACT;AAEA,SAAO;AACT;AA+FO,IAAM,kBAAkB,CAI7B,WACwC;AA3I1C;AA4IE,QAAM;AAAA,IACJ;AAAA,IACA,WAAW;AAAA,IACX,WAAW;AAAA,IACX,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,WAAW,EAAE,YAAY;AAAA,IACzB;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,eAA6B;AAEjC,QAAM;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,cAAc,MAAM,cAAc;AAEtC,QAAM,EAAE,MAAM,IAAI,cAA4B;AAAA,IAC5C;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM;AAAA,IACJ,UAAU;AAAA,IACV,OAAO;AAAA,IACP,UAAU;AAAA,IACV;AAAA,IACA;AAAA,EACF,IAAI;AAIJ,QAAM,EAAE,gBAAgB,YAAY,IAAI,uBAAiC;AAAA,IACvE;AAAA,IACA;AAAA,EACF,CAAC;AAGD,QAAM,mBAAmB,eAAe,UAAU;AAClD,QAAM,sBAAsB,CAAC,iBAA+C;AA9L9E,QAAAA,KAAA;AAgMI,UAAM,gBACH,MAAAA,MAAA,6CAAsD,WAAtD,gBAAAA,IAA8D,UAA9D,YACD;AACF,UAAM,YAAY,YAAY,YAAwB;AACtD,kBAAc,SAA8B;AAAA,EAC9C;AAEA,QAAM,gBAAgB,eAAU,MAAV,mBACpB;AAqBF,QAAM,cAAc,eAAe,WAAW,aAAa,cAAc;AACzE,QAAM,UAAU,oBAAoB,aAAa,GAAG;AAMpD,QAAM,uBAAuB,cAAc;AAC3C,QAAM,YACJ,CAAC,CAAC,SAAS,uBACT,iCACG;AAAA,cAAU,QAAQ,QAAQ;AAAA,IAC1B,uBACC,oBAAC,iCAAsB,QAAgB,IACrC;AAAA,KACN,IACE;AAIN,QAAM,eAAe,oBAAC,gCAAqB,OAAc,QAAgB;AAKzE,QAAM,EAAE,sBAAsB,eAAe,sBAAsB,IACjE,SAAS;AAAA,IACP;AAAA,IACA,YAAY;AAAA;AAAA,MAEV,eAAe;AAAA,IACjB;AAAA,IACA,cAAc,KAAK,UAAU,KAAK;AAAA,IAClC,WAAW;AAAA,IACX,YAAY;AAAA,IACZ;AAAA,IACA,gBAAgB;AAAA,EAClB,CAAC;AAKH,QAAM,YACJ,4CAAoB,OAAO,UAAU,WAAW,QAAQ;AAE1D,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,OAAO,iCACF,QADE;AAAA,MAEL,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":["_a"]}
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-V3M7HL26.cjs","../src/hooks/useUniformField/useUniformField.tsx"],"names":["_a"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-V3M7HL26.cjs","sourcesContent":[null,"import type { ReactNode } from 'react';\nimport type { FieldError, FieldValues, Path } from 'react-hook-form';\nimport type { InputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\nimport React from 'react';\n\nimport { isTestEnvironment } from '@fuf-stack/pixel-utils';\nimport { useDebounce } from '@fuf-stack/pixels';\n\nimport { FieldCopyTestIdButton } from '../../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../../partials/FieldValidationError';\nimport { useController } from '../useController/useController';\nimport { useFormContext } from '../useFormContext/useFormContext';\nimport { useInput } from '../useInput/useInput';\nimport { useInputValueTransform } from '../useInputValueTransform/useInputValueTransform';\n\n/**\n * Debounce invalid state changes to prevent UI flicker on rapid changes.\n *\n * Primary purpose: Reduce UI flicker when validation state changes rapidly\n * (e.g., during fast typing). Without debouncing, error messages would flash\n * in/out rapidly, creating a poor UX.\n *\n * Secondary benefit: When animations are enabled (default), gives time for\n * enter/exit animations to complete smoothly.\n *\n * Behavior:\n * - Debounces both true → false and false → true transitions by `delayMs`\n * - Disabled in test environments for immediate snapshots\n */\nconst useDebouncedInvalid = (invalid: boolean, delayMs: number) => {\n const debouncedInvalid = useDebounce(invalid, delayMs);\n\n // Disable debouncing in test environments for immediate snapshots\n if (isTestEnvironment()) {\n return invalid;\n }\n\n return debouncedInvalid;\n};\n\nexport interface UseUniformFieldParams<\n TFieldValues extends FieldValues = FieldValues,\n TDisplay = unknown,\n> {\n /** Form field name */\n name: Path<TFieldValues> & string;\n /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n ariaLabel?: string;\n /** Disable the field */\n disabled?: boolean;\n /** Optional label content */\n label?: ReactNode;\n /** Optional explicit test id used to build stable test ids */\n testId?: string;\n /** Optional value transformation between form and display values */\n transform?: InputValueTransform<TDisplay>;\n /** Input type for special number handling */\n type?: 'text' | 'number' | 'password';\n}\n\nexport interface UseUniformFieldReturn<\n TFieldValues extends FieldValues = FieldValues,\n> {\n /** Computed aria-label fallback (field name) when no visible label exists. Components can override based on their accessibility needs (e.g., if placeholder provides sufficient context) */\n ariaLabel: string | undefined;\n /** react-hook-form control instance for advanced integrations */\n control: ReturnType<typeof useFormContext<TFieldValues>>['control'];\n /** Debug mode from Uniform provider */\n debugMode: ReturnType<typeof useFormContext<TFieldValues>>['debugMode'];\n /** Current value used to initialize uncontrolled components */\n defaultValue: unknown;\n /** Whether the field is currently disabled (from RHF) */\n disabled: boolean | undefined;\n /** Validation error(s) for the field */\n error: FieldError[] | undefined;\n /** Pre-built errorMessage node to plug into components */\n errorMessage: ReactNode | null;\n /** RHF controller field with transformed value/onChange (use this for simple components) */\n field: ReturnType<typeof useController<TFieldValues>>['field'];\n /** Helper to spread standardized error message props to underlying components */\n getErrorMessageProps: ReturnType<typeof useInput>['getErrorMessageProps'];\n /** Helper to spread standardized helper wrapper props (for spacing/animation) */\n getHelperWrapperProps: ReturnType<typeof useInput>['getHelperWrapperProps'];\n /** Helper to spread standardized label props to underlying components */\n getLabelProps: ReturnType<typeof useInput>['getLabelProps'];\n /** Access current form values (converted to validation-friendly format) */\n getValues: ReturnType<typeof useFormContext<TFieldValues>>['getValues'];\n /** Whether the field should show invalid state (debounced for smooth animations). True when field is invalid AND (dirty OR touched OR submitted) */\n invalid: boolean;\n /** Computed label node including optional test id copy button */\n label: ReactNode | null;\n /** onBlur handler from controller */\n onBlur: ReturnType<typeof useController<TFieldValues>>['field']['onBlur'];\n /** onChange handler from controller (with transform applied) */\n onChange: ReturnType<typeof useController<TFieldValues>>['field']['onChange'];\n /** Ref to forward to underlying control */\n ref: ReturnType<typeof useController<TFieldValues>>['field']['ref'];\n /** Whether the field is required according to validation schema */\n required: boolean;\n /** Reset a specific field in the form */\n resetField: ReturnType<typeof useFormContext<TFieldValues>>['resetField'];\n /** Generated HTML data-testid for the field */\n testId: string;\n}\n\n/**\n * Combines frequently used form field logic into a single hook.\n *\n * Provides:\n * - Enhanced form context (validation-aware state, `testId`, value transforms)\n * - Controller field with nullish conversion handling\n * - Value transformation via `transform` prop:\n * • Allows disentangled display and form values (e.g., string ↔ object, boolean ↔ array)\n * • Automatically applies `toDisplayValue` to field value for components\n * • Automatically applies `toFormValue` to display value when onChange is called\n * • Works with `type` prop for automatic number/string conversion\n * • Examples: storing objects while displaying strings, storing booleans as arrays, enriching values with metadata\n * - Debounced `invalid` state with smart timing:\n * • `true` (field becomes invalid): applies immediately so errors show right away\n * • `false` (field becomes valid): delayed 200ms to allow smooth exit animations\n * • Respects `prefers-reduced-motion` by skipping delays when user prefers reduced motion\n * - Smart `invalid` visibility (via `showInvalid`):\n * • Shows errors when field is dirty OR touched OR form has been submitted\n * • Prevents showing errors on pristine/untouched fields for better UX\n * • Works well for all field types (text inputs, checkboxes, radios, arrays)\n * - Prebuilt `errorMessage` React node using `FieldValidationError`\n * - Computed `label` node which appends a `FieldCopyTestIdButton` in\n * `debug-testids` mode\n * - `defaultValue` for uncontrolled defaults and all usual field handlers\n * - Access to form utilities: `control`, `getValues`, `resetField`\n * - Presentation helpers: `getLabelProps`, `getErrorMessageProps`,\n * `getHelperWrapperProps` for consistent wiring to underlying UI components\n */\nexport const useUniformField = <\n TFieldValues extends FieldValues = FieldValues,\n TDisplay = unknown,\n>(\n params: UseUniformFieldParams<TFieldValues, TDisplay>,\n): UseUniformFieldReturn<TFieldValues> => {\n const {\n name,\n ariaLabel: customAriaLabel,\n disabled = false,\n testId: explicitTestId,\n label,\n type,\n transform,\n } = params;\n\n const {\n control,\n debugMode,\n formState: { submitCount },\n getFieldState,\n getValues,\n resetField,\n } = useFormContext<TFieldValues>();\n\n const {\n error,\n invalid: rawInvalid,\n isDirty,\n isTouched,\n required,\n testId,\n } = getFieldState(name, explicitTestId);\n\n const { field } = useController<TFieldValues>({\n control,\n disabled,\n name,\n });\n const {\n onChange: fieldOnChange,\n value: fieldValue,\n disabled: isDisabled,\n onBlur,\n ref,\n } = field;\n\n // Get transform utilities (but don't apply them automatically)\n // Components can choose how to use them (directly or via useInputValueDebounce)\n const { toDisplayValue, toFormValue } = useInputValueTransform<TDisplay>({\n type,\n transform,\n });\n\n // For components without special needs: apply transform to value and onChange\n const transformedValue = toDisplayValue(fieldValue);\n const transformedOnChange = (eventOrValue: TDisplay | React.ChangeEvent) => {\n // Extract value from event or use value directly\n const displayValue =\n (eventOrValue as React.ChangeEvent<HTMLInputElement>)?.target?.value ??\n eventOrValue;\n const formValue = toFormValue(displayValue as TDisplay);\n fieldOnChange(formValue as typeof fieldValue);\n };\n\n const defaultValue = (getValues() as Record<string, unknown>)?.[\n name as string\n ];\n\n /**\n * Determine when to show the invalid state to the user.\n *\n * Show errors when the field is invalid AND any of these conditions are met:\n * - Field is dirty (value changed from initial) - good for checkboxes/radios/arrays\n * - Field is touched (focused and blurred) - good for text inputs\n * - Form has been submitted - shows all errors after submit attempt\n *\n * This prevents showing errors on pristine/untouched fields for better UX.\n * Examples:\n * - Text input: User loads form with empty required field → no error shown yet\n * - Text input: User focuses and blurs → error shows (via isTouched)\n * - Checkbox group: User clicks first checkbox → error shows immediately (via isDirty)\n * - Any field: User submits form → all errors show (via submitCount)\n *\n * The entire condition is debounced to prevent flickering and allow smooth animations\n * when any of the states (invalid, isDirty, isTouched, submitCount) change.\n */\n const showInvalid = rawInvalid && (isDirty || isTouched || submitCount > 0);\n const invalid = useDebouncedInvalid(showInvalid, 200);\n\n // Build a label node that:\n // - shows the provided label (unless explicitly set to false)\n // - appends a copy-to-clipboard button for the test id in `debug-testids` mode\n // Consumers can pass this directly to component `label` props\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const labelNode: ReactNode | null =\n !!label || showTestIdCopyButton ? (\n <>\n {label !== false ? label : null}\n {showTestIdCopyButton ? (\n <FieldCopyTestIdButton testId={testId} />\n ) : null}\n </>\n ) : null;\n\n // Ready-to-render error message; consumers can drop this into their\n // component `errorMessage` prop without repeating mapping/markup\n const errorMessage = <FieldValidationError error={error} testId={testId} />;\n\n // Generate standardized props for label, helper wrapper and error message\n // so consumers can spread them directly into UI components (e.g. HeroUI),\n // keeping animations/spacing consistent across fields\n const { getErrorMessageProps, getLabelProps, getHelperWrapperProps } =\n useInput({\n ref,\n classNames: {\n // set padding to 0 for error message exit animation\n helperWrapper: 'p-0',\n },\n errorMessage: JSON.stringify(error),\n isInvalid: invalid,\n isRequired: required,\n label,\n labelPlacement: 'outside',\n });\n\n // Compute aria-label: prefer custom prop, then use string label if available, otherwise field name\n // Components can further override this based on their specific accessibility needs\n // (e.g., Input/TextArea may skip this if they have a meaningful placeholder)\n const ariaLabel =\n customAriaLabel ?? (typeof label === 'string' ? label : name);\n\n return {\n ariaLabel,\n control,\n debugMode,\n defaultValue,\n disabled: isDisabled,\n error,\n errorMessage,\n field: {\n ...field,\n value: transformedValue as typeof field.value,\n onChange: transformedOnChange as typeof field.onChange,\n },\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n getValues,\n invalid,\n label: labelNode,\n onBlur,\n onChange: transformedOnChange as typeof field.onChange,\n ref,\n required,\n resetField,\n testId,\n };\n};\n"]}
@@ -1,6 +1,6 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
- var _chunkUUGUQGMXcjs = require('./chunk-UUGUQGMX.cjs');
3
+ var _chunkFYN7ZWLWcjs = require('./chunk-FYN7ZWLW.cjs');
4
4
 
5
5
  // src/SubmitButton/SubmitButton.tsx
6
6
  var _pixelutils = require('@fuf-stack/pixel-utils');
@@ -19,7 +19,7 @@ var SubmitButton = ({
19
19
  const {
20
20
  formState: { isSubmitting },
21
21
  triggerSubmit
22
- } = _chunkUUGUQGMXcjs.useFormContext.call(void 0, );
22
+ } = _chunkFYN7ZWLWcjs.useFormContext.call(void 0, );
23
23
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
24
24
  _pixels.Button,
25
25
  {
@@ -46,4 +46,4 @@ var SubmitButton_default2 = SubmitButton_default;
46
46
 
47
47
 
48
48
  exports.SubmitButton_default = SubmitButton_default; exports.SubmitButton_default2 = SubmitButton_default2;
49
- //# sourceMappingURL=chunk-PTCZOUQX.cjs.map
49
+ //# sourceMappingURL=chunk-WXSISX5Y.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-PTCZOUQX.cjs","../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACA;ACDA,oDAA4B;AAC5B,2CAAuB;AA0CnB,+CAAA;AAhBJ,IAAM,aAAA,EAAe,CAAC;AAAA,EACpB,UAAA,EAAY,aAAA;AAAA,EACZ,SAAA,EAAW,QAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,MAAA,EAAQ,SAAA;AAAA,EACR,KAAA,EAAO,KAAA,CAAA;AAAA,EACP,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;AAAA,MACA,SAAA,EAAW,4BAAA,SAAY,CAAA;AAAA,MACvB,KAAA;AAAA,MACA,QAAA,EAAU,YAAA;AAAA,MACV,IAAA;AAAA,MACA,OAAA,EAAS,QAAA,GAAW,YAAA;AAAA,MAIpB,OAAA,EAAS,aAAA;AAAA,MACT,IAAA;AAAA,MACA,MAAA,EAAQ,iCAAA,MAAQ,EAAQ,EAAE,WAAA,EAAa,KAAK,CAAC,CAAA;AAAA,MAC7C,IAAA,EAAK,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACH,CAAA;AAEJ,CAAA;AAEA,IAAO,qBAAA,EAAQ,YAAA;AD1Bf;AACA;AEnCA,IAAOA,sBAAAA,EAAQ,oBAAA;AFqCf;AACA;AACE;AACA;AACF,2GAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-PTCZOUQX.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/useFormContext';\n\nexport interface SubmitButtonProps {\n /** sets HTML aria-label attribute */\n ariaLabel?: string;\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** color of the submit button */\n color?: ButtonProps['color'];\n /** icon of the submit button */\n icon?: ButtonProps['icon'];\n /** If set loading animation is shown */\n loading?: boolean;\n /** size of the submit button */\n size?: ButtonProps['size'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n ariaLabel = 'Submit form',\n children = 'Submit',\n className = undefined,\n color = 'success',\n icon = undefined,\n loading = false,\n size = 'md',\n testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n const {\n formState: { isSubmitting },\n triggerSubmit,\n } = useFormContext();\n\n return (\n <Button\n ariaLabel={ariaLabel}\n className={cn(className)}\n color={color}\n disabled={isSubmitting}\n icon={icon}\n loading={loading || isSubmitting}\n // @ts-expect-error we use form context triggerSubmit\n // here so that submit button also works in special\n // scenarios (e.g. when used in modal)\n onClick={triggerSubmit}\n size={size}\n testId={slugify(testId, { replaceDots: true })}\n type=\"submit\"\n >\n {children}\n </Button>\n );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"]}
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-WXSISX5Y.cjs","../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACA;ACDA,oDAA4B;AAC5B,2CAAuB;AA0CnB,+CAAA;AAhBJ,IAAM,aAAA,EAAe,CAAC;AAAA,EACpB,UAAA,EAAY,aAAA;AAAA,EACZ,SAAA,EAAW,QAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,MAAA,EAAQ,SAAA;AAAA,EACR,KAAA,EAAO,KAAA,CAAA;AAAA,EACP,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;AAAA,MACA,SAAA,EAAW,4BAAA,SAAY,CAAA;AAAA,MACvB,KAAA;AAAA,MACA,QAAA,EAAU,YAAA;AAAA,MACV,IAAA;AAAA,MACA,OAAA,EAAS,QAAA,GAAW,YAAA;AAAA,MAIpB,OAAA,EAAS,aAAA;AAAA,MACT,IAAA;AAAA,MACA,MAAA,EAAQ,iCAAA,MAAQ,EAAQ,EAAE,WAAA,EAAa,KAAK,CAAC,CAAA;AAAA,MAC7C,IAAA,EAAK,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACH,CAAA;AAEJ,CAAA;AAEA,IAAO,qBAAA,EAAQ,YAAA;AD1Bf;AACA;AEnCA,IAAOA,sBAAAA,EAAQ,oBAAA;AFqCf;AACA;AACE;AACA;AACF,2GAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-WXSISX5Y.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/useFormContext';\n\nexport interface SubmitButtonProps {\n /** sets HTML aria-label attribute */\n ariaLabel?: string;\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** color of the submit button */\n color?: ButtonProps['color'];\n /** icon of the submit button */\n icon?: ButtonProps['icon'];\n /** If set loading animation is shown */\n loading?: boolean;\n /** size of the submit button */\n size?: ButtonProps['size'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n ariaLabel = 'Submit form',\n children = 'Submit',\n className = undefined,\n color = 'success',\n icon = undefined,\n loading = false,\n size = 'md',\n testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n const {\n formState: { isSubmitting },\n triggerSubmit,\n } = useFormContext();\n\n return (\n <Button\n ariaLabel={ariaLabel}\n className={cn(className)}\n color={color}\n disabled={isSubmitting}\n icon={icon}\n loading={loading || isSubmitting}\n // @ts-expect-error we use form context triggerSubmit\n // here so that submit button also works in special\n // scenarios (e.g. when used in modal)\n onClick={triggerSubmit}\n size={size}\n testId={slugify(testId, { replaceDots: true })}\n type=\"submit\"\n >\n {children}\n </Button>\n );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"]}
@@ -1,9 +1,9 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
2
2
 
3
- var _chunkOED4DYBDcjs = require('./chunk-OED4DYBD.cjs');
3
+ var _chunkV3M7HL26cjs = require('./chunk-V3M7HL26.cjs');
4
4
 
5
5
 
6
- var _chunkUUGUQGMXcjs = require('./chunk-UUGUQGMX.cjs');
6
+ var _chunkFYN7ZWLWcjs = require('./chunk-FYN7ZWLW.cjs');
7
7
 
8
8
 
9
9
 
@@ -110,10 +110,10 @@ var Select = (_a) => {
110
110
  label,
111
111
  required,
112
112
  testId
113
- } = _chunkOED4DYBDcjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
113
+ } = _chunkV3M7HL26cjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {
114
114
  name
115
115
  }, uniformFieldProps));
116
- const { getFieldState } = _chunkUUGUQGMXcjs.useFormContext.call(void 0, );
116
+ const { getFieldState } = _chunkFYN7ZWLWcjs.useFormContext.call(void 0, );
117
117
  const [isFocused, setIsFocused] = _react.useState.call(void 0, false);
118
118
  const variants = selectVariants();
119
119
  const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
@@ -289,4 +289,4 @@ var Select_default2 = Select_default;
289
289
 
290
290
 
291
291
  exports.Select_default = Select_default; exports.Select_default2 = Select_default2;
292
- //# sourceMappingURL=chunk-4LLSZ6GN.cjs.map
292
+ //# sourceMappingURL=chunk-WYM6IAIJ.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-4LLSZ6GN.cjs","../src/Select/Select.tsx","../src/Select/index.ts"],"names":["_a","Select_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-4LLSZ6GN.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\nimport type { Props } from 'react-select';\n\nimport { useState } from 'react';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@heroui/select';\n\nimport { cn, slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks/useFormContext';\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const selectVariants = tv({\n slots: {\n base: 'group leading-normal',\n clearIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n control:\n 'duration-150! rounded-lg border-2 border-default-200 bg-content1 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n control_focused: 'border-focus',\n crossIcon: '',\n downChevron: '',\n dropdownIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n group: '',\n groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n indicatorsContainer: 'gap-1 p-1',\n indicatorSeparator: 'bg-default-300',\n input: 'py-0.5 pl-1',\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'pointer-events-auto relative bottom-1.5 ml-1 subpixel-antialiased text-small group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n loadingIndicator: '',\n loadingMessage: 'rounded-sm p-2 text-foreground-500',\n menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n menuList: '',\n // ensure menu has same z-index as modal so it is visible when rendered in modal\n // see: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n menuPortal: 'z-50!',\n multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n multiValueContainer: '',\n multiValueLabel: 'py-0.5 leading-6',\n multiValueRemove:\n 'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n option_focused: 'bg-default-100 active:bg-default-200',\n option_selected: 'bg-default-300',\n option: 'rounded px-3 py-2 hover:cursor-pointer',\n placeholder: 'ml-1 py-0.5 pl-1 text-sm text-foreground-500',\n selectContainer: '',\n singleValue: 'ml-1! leading-7!',\n valueContainer: 'gap-1 p-1',\n },\n});\n\ninterface SelectOption {\n /** option label */\n label?: ReactNode;\n /** option value */\n value: string;\n}\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps extends VariantProps {\n /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n ariaLabel?: string;\n /** CSS class name */\n className?: ClassName; // string;\n /** Determine if the */\n clearable?: boolean;\n /** Set the select to disabled state. */\n disabled?: boolean;\n /** Filter Select Options */\n filterOption?:\n | undefined\n | ((option?: SelectOption, inputValue?: string) => boolean);\n /** Format the label of the option */\n renderOptionLabel?: undefined | Props['formatOptionLabel'];\n /** The value of the search input */\n inputValue?: string;\n /** Label that should be associated with the select. */\n label?: ReactNode;\n /** Set the select to a loading state. */\n loading?: boolean;\n /** switch between single and multi select mode. */\n multiSelect?: boolean;\n /** The name for the Select component, used by react-hook-form */\n name: string;\n /** Placeholder that is displayed when nothing is selected */\n placeholder?: string;\n /** The options for the Select component */\n options: SelectOption[];\n /** Handle change events on the input */\n onInputChange?: Props['onInputChange'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}`;\n\n return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select`;\n return (\n <div data-testid={testId}>\n {}\n <components.Control {...props} />\n </div>\n );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select_option_${slugify(props?.data?.testId ?? props?.data?.value, { replaceDots: true })}`;\n return (\n <div data-testid={testId}>\n {}\n <components.Option {...props} />\n </div>\n );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n props,\n) => {\n // @ts-expect-error data-testid is not a default prop\n\n const testId = props?.selectProps['data-testid'] as string;\n return (\n <div data-testid={`${testId}_select_dropdown`}>\n {}\n <components.DropdownIndicator {...props} />\n </div>\n );\n};\n\n/** Select component based on [HeroUI Select](https://www.heroui.com//docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n className = undefined,\n clearable = true,\n filterOption = undefined,\n renderOptionLabel = undefined,\n inputValue = undefined,\n loading = false,\n multiSelect = false,\n name,\n onInputChange = undefined,\n options,\n placeholder = undefined,\n ...uniformFieldProps\n}: SelectProps) => {\n const {\n ariaLabel,\n disabled,\n errorMessage,\n field: { onBlur, onChange, ref, value },\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n invalid,\n label,\n required,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Get getFieldState to check isTouched in onChange callback\n const { getFieldState } = useFormContext();\n\n // Track if the select is focused\n const [isFocused, setIsFocused] = useState(false);\n\n // classNames from slots\n const variants = selectVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const { getBaseProps, getTriggerProps, getValueProps } = useSelect({\n children: [],\n classNames,\n errorMessage,\n isDisabled: disabled,\n isInvalid: invalid,\n isLoading: loading,\n isRequired: required,\n label,\n labelPlacement: 'outside',\n });\n\n return (\n <div\n {...getBaseProps()}\n className={cn(classNames.base)}\n // see HeroUI styles for group-data condition (data-invalid),\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n data-required={required}\n data-testid={`${testId}_wrapper`}\n >\n {label ? (\n <label\n className={classNames.label}\n data-slot=\"label\"\n htmlFor={`react-select-${name}-input`}\n id={getLabelProps().id}\n >\n {label}\n </label>\n ) : null}\n <ReactSelect\n ref={ref}\n menuShouldBlockScroll\n unstyled\n aria-errormessage=\"\"\n aria-invalid={invalid}\n aria-label={ariaLabel}\n // Does not affect the testId of the select, but is needed to pass it to sub-components\n data-testid={testId}\n filterOption={filterOption}\n formatOptionLabel={renderOptionLabel}\n inputValue={inputValue}\n instanceId={name}\n isClearable={clearable}\n isDisabled={disabled}\n isLoading={loading}\n isMulti={multiSelect}\n // set menuPosition to fixed so that menu can be rendered\n // inside Card / Modal components, menuShouldBlockScroll\n // prevents container scroll when menu is open\n menuPosition=\"fixed\"\n name={name}\n onInputChange={onInputChange}\n options={options}\n placeholder={placeholder}\n // set aria-labelledby to the label id so that the select is accessible\n aria-labelledby={\n label\n ? getTriggerProps()['aria-labelledby']?.split(' ')[1]\n : undefined\n }\n classNames={{\n control: () => {\n return cn(classNames.control, {\n [classNames.control_focused]: isFocused && !invalid,\n });\n },\n clearIndicator: () => {\n return classNames.clearIndicator;\n },\n dropdownIndicator: () => {\n return classNames.dropdownIndicator;\n },\n groupHeading: () => {\n return classNames.groupHeading;\n },\n indicatorsContainer: () => {\n return classNames.indicatorsContainer;\n },\n indicatorSeparator: () => {\n return classNames.indicatorSeparator;\n },\n loadingIndicator: () => {\n return classNames.loadingIndicator;\n },\n loadingMessage: () => {\n return classNames.loadingMessage;\n },\n input: () => {\n return classNames.input;\n },\n menu: () => {\n return classNames.menu;\n },\n menuList: () => {\n return classNames.menuList;\n },\n menuPortal: () => {\n return classNames.menuPortal;\n },\n multiValue: () => {\n return classNames.multiValue;\n },\n multiValueLabel: () => {\n return cn(\n classNames.multiValueLabel,\n `${getValueProps().className}`,\n );\n },\n multiValueRemove: () => {\n return classNames.multiValueRemove;\n },\n noOptionsMessage: () => {\n return classNames.noOptionsMessage;\n },\n option: ({\n isFocused: optionIsFocused,\n isSelected: optionIsSelected,\n }) => {\n return cn(classNames.option, {\n [classNames.option_focused]: optionIsFocused,\n [classNames.option_selected]: optionIsSelected,\n });\n },\n placeholder: () => {\n return classNames.placeholder;\n },\n singleValue: () => {\n return cn(classNames.singleValue, `${getValueProps().className}`);\n },\n valueContainer: () => {\n return classNames.valueContainer;\n },\n }}\n components={{\n Input: InputComponent,\n Option: OptionComponent,\n DropdownIndicator: DropdownIndicatorComponent,\n Control: ControlComponent,\n }}\n onBlur={(_e) => {\n setIsFocused(false);\n onBlur();\n }}\n onChange={(option) => {\n if (multiSelect) {\n onChange(\n (option as SelectOption[])?.map((_option) => {\n return _option.value;\n }),\n );\n } else {\n onChange((option as SelectOption)?.value);\n }\n // Mark field as touched immediately when a selection is made if not already touched\n // This ensures validation errors show right away (isTouched becomes true)\n // For Select components, selecting an option is a complete user action\n // (unlike text inputs where typing is ongoing), so we mark as touched immediately\n const { isTouched: currentIsTouched } = getFieldState(name, testId);\n if (!currentIsTouched) {\n onBlur();\n }\n }}\n onFocus={(_e) => {\n setIsFocused(true);\n }}\n // set complete option as value by current field value\n value={options.find((option) => {\n return option.value === value;\n })}\n />\n {invalid ? (\n <div {...getHelperWrapperProps()}>\n <div {...getErrorMessageProps()}>{errorMessage}</div>\n </div>\n ) : null}\n </div>\n );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"]}
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-WYM6IAIJ.cjs","../src/Select/Select.tsx","../src/Select/index.ts"],"names":["_a","Select_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-WYM6IAIJ.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\nimport type { Props } from 'react-select';\n\nimport { useState } from 'react';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@heroui/select';\n\nimport { cn, slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks/useFormContext';\nimport { useUniformField } from '../hooks/useUniformField';\n\nexport const selectVariants = tv({\n slots: {\n base: 'group leading-normal',\n clearIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n control:\n 'duration-150! rounded-lg border-2 border-default-200 bg-content1 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n control_focused: 'border-focus',\n crossIcon: '',\n downChevron: '',\n dropdownIndicator:\n 'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n group: '',\n groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n indicatorsContainer: 'gap-1 p-1',\n indicatorSeparator: 'bg-default-300',\n input: 'py-0.5 pl-1',\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'pointer-events-auto relative bottom-1.5 ml-1 subpixel-antialiased text-small group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n loadingIndicator: '',\n loadingMessage: 'rounded-sm p-2 text-foreground-500',\n menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n menuList: '',\n // ensure menu has same z-index as modal so it is visible when rendered in modal\n // see: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n menuPortal: 'z-50!',\n multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n multiValueContainer: '',\n multiValueLabel: 'py-0.5 leading-6',\n multiValueRemove:\n 'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n option_focused: 'bg-default-100 active:bg-default-200',\n option_selected: 'bg-default-300',\n option: 'rounded px-3 py-2 hover:cursor-pointer',\n placeholder: 'ml-1 py-0.5 pl-1 text-sm text-foreground-500',\n selectContainer: '',\n singleValue: 'ml-1! leading-7!',\n valueContainer: 'gap-1 p-1',\n },\n});\n\ninterface SelectOption {\n /** option label */\n label?: ReactNode;\n /** option value */\n value: string;\n}\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps extends VariantProps {\n /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n ariaLabel?: string;\n /** CSS class name */\n className?: ClassName; // string;\n /** Determine if the */\n clearable?: boolean;\n /** Set the select to disabled state. */\n disabled?: boolean;\n /** Filter Select Options */\n filterOption?:\n | undefined\n | ((option?: SelectOption, inputValue?: string) => boolean);\n /** Format the label of the option */\n renderOptionLabel?: undefined | Props['formatOptionLabel'];\n /** The value of the search input */\n inputValue?: string;\n /** Label that should be associated with the select. */\n label?: ReactNode;\n /** Set the select to a loading state. */\n loading?: boolean;\n /** switch between single and multi select mode. */\n multiSelect?: boolean;\n /** The name for the Select component, used by react-hook-form */\n name: string;\n /** Placeholder that is displayed when nothing is selected */\n placeholder?: string;\n /** The options for the Select component */\n options: SelectOption[];\n /** Handle change events on the input */\n onInputChange?: Props['onInputChange'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}`;\n\n return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select`;\n return (\n <div data-testid={testId}>\n {}\n <components.Control {...props} />\n </div>\n );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_select_option_${slugify(props?.data?.testId ?? props?.data?.value, { replaceDots: true })}`;\n return (\n <div data-testid={testId}>\n {}\n <components.Option {...props} />\n </div>\n );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n props,\n) => {\n // @ts-expect-error data-testid is not a default prop\n\n const testId = props?.selectProps['data-testid'] as string;\n return (\n <div data-testid={`${testId}_select_dropdown`}>\n {}\n <components.DropdownIndicator {...props} />\n </div>\n );\n};\n\n/** Select component based on [HeroUI Select](https://www.heroui.com//docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n className = undefined,\n clearable = true,\n filterOption = undefined,\n renderOptionLabel = undefined,\n inputValue = undefined,\n loading = false,\n multiSelect = false,\n name,\n onInputChange = undefined,\n options,\n placeholder = undefined,\n ...uniformFieldProps\n}: SelectProps) => {\n const {\n ariaLabel,\n disabled,\n errorMessage,\n field: { onBlur, onChange, ref, value },\n getErrorMessageProps,\n getHelperWrapperProps,\n getLabelProps,\n invalid,\n label,\n required,\n testId,\n } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n // Get getFieldState to check isTouched in onChange callback\n const { getFieldState } = useFormContext();\n\n // Track if the select is focused\n const [isFocused, setIsFocused] = useState(false);\n\n // classNames from slots\n const variants = selectVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const { getBaseProps, getTriggerProps, getValueProps } = useSelect({\n children: [],\n classNames,\n errorMessage,\n isDisabled: disabled,\n isInvalid: invalid,\n isLoading: loading,\n isRequired: required,\n label,\n labelPlacement: 'outside',\n });\n\n return (\n <div\n {...getBaseProps()}\n className={cn(classNames.base)}\n // see HeroUI styles for group-data condition (data-invalid),\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n data-required={required}\n data-testid={`${testId}_wrapper`}\n >\n {label ? (\n <label\n className={classNames.label}\n data-slot=\"label\"\n htmlFor={`react-select-${name}-input`}\n id={getLabelProps().id}\n >\n {label}\n </label>\n ) : null}\n <ReactSelect\n ref={ref}\n menuShouldBlockScroll\n unstyled\n aria-errormessage=\"\"\n aria-invalid={invalid}\n aria-label={ariaLabel}\n // Does not affect the testId of the select, but is needed to pass it to sub-components\n data-testid={testId}\n filterOption={filterOption}\n formatOptionLabel={renderOptionLabel}\n inputValue={inputValue}\n instanceId={name}\n isClearable={clearable}\n isDisabled={disabled}\n isLoading={loading}\n isMulti={multiSelect}\n // set menuPosition to fixed so that menu can be rendered\n // inside Card / Modal components, menuShouldBlockScroll\n // prevents container scroll when menu is open\n menuPosition=\"fixed\"\n name={name}\n onInputChange={onInputChange}\n options={options}\n placeholder={placeholder}\n // set aria-labelledby to the label id so that the select is accessible\n aria-labelledby={\n label\n ? getTriggerProps()['aria-labelledby']?.split(' ')[1]\n : undefined\n }\n classNames={{\n control: () => {\n return cn(classNames.control, {\n [classNames.control_focused]: isFocused && !invalid,\n });\n },\n clearIndicator: () => {\n return classNames.clearIndicator;\n },\n dropdownIndicator: () => {\n return classNames.dropdownIndicator;\n },\n groupHeading: () => {\n return classNames.groupHeading;\n },\n indicatorsContainer: () => {\n return classNames.indicatorsContainer;\n },\n indicatorSeparator: () => {\n return classNames.indicatorSeparator;\n },\n loadingIndicator: () => {\n return classNames.loadingIndicator;\n },\n loadingMessage: () => {\n return classNames.loadingMessage;\n },\n input: () => {\n return classNames.input;\n },\n menu: () => {\n return classNames.menu;\n },\n menuList: () => {\n return classNames.menuList;\n },\n menuPortal: () => {\n return classNames.menuPortal;\n },\n multiValue: () => {\n return classNames.multiValue;\n },\n multiValueLabel: () => {\n return cn(\n classNames.multiValueLabel,\n `${getValueProps().className}`,\n );\n },\n multiValueRemove: () => {\n return classNames.multiValueRemove;\n },\n noOptionsMessage: () => {\n return classNames.noOptionsMessage;\n },\n option: ({\n isFocused: optionIsFocused,\n isSelected: optionIsSelected,\n }) => {\n return cn(classNames.option, {\n [classNames.option_focused]: optionIsFocused,\n [classNames.option_selected]: optionIsSelected,\n });\n },\n placeholder: () => {\n return classNames.placeholder;\n },\n singleValue: () => {\n return cn(classNames.singleValue, `${getValueProps().className}`);\n },\n valueContainer: () => {\n return classNames.valueContainer;\n },\n }}\n components={{\n Input: InputComponent,\n Option: OptionComponent,\n DropdownIndicator: DropdownIndicatorComponent,\n Control: ControlComponent,\n }}\n onBlur={(_e) => {\n setIsFocused(false);\n onBlur();\n }}\n onChange={(option) => {\n if (multiSelect) {\n onChange(\n (option as SelectOption[])?.map((_option) => {\n return _option.value;\n }),\n );\n } else {\n onChange((option as SelectOption)?.value);\n }\n // Mark field as touched immediately when a selection is made if not already touched\n // This ensures validation errors show right away (isTouched becomes true)\n // For Select components, selecting an option is a complete user action\n // (unlike text inputs where typing is ongoing), so we mark as touched immediately\n const { isTouched: currentIsTouched } = getFieldState(name, testId);\n if (!currentIsTouched) {\n onBlur();\n }\n }}\n onFocus={(_e) => {\n setIsFocused(true);\n }}\n // set complete option as value by current field value\n value={options.find((option) => {\n return option.value === value;\n })}\n />\n {invalid ? (\n <div {...getHelperWrapperProps()}>\n <div {...getErrorMessageProps()}>{errorMessage}</div>\n </div>\n ) : null}\n </div>\n );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"]}