@fuf-stack/uniform 1.16.0 → 1.16.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 (153) hide show
  1. package/dist/Checkboxes/index.d.cts +1 -1
  2. package/dist/Checkboxes/index.d.ts +1 -1
  3. package/dist/FieldArray/index.d.cts +1 -1
  4. package/dist/FieldArray/index.d.ts +1 -1
  5. package/dist/FieldCard/index.cjs +1 -1
  6. package/dist/FieldCard/index.d.cts +1 -1
  7. package/dist/FieldCard/index.d.ts +1 -1
  8. package/dist/FieldCard/index.js +1 -1
  9. package/dist/{FieldCard-DcMORXZR.cjs → FieldCard-BMmp6vcn.cjs} +21 -8
  10. package/dist/FieldCard-BMmp6vcn.cjs.map +1 -0
  11. package/dist/{FieldCard-DZSiMFoO.js → FieldCard-DAtdvKrE.js} +21 -8
  12. package/dist/FieldCard-DAtdvKrE.js.map +1 -0
  13. package/dist/Form/index.d.cts +1 -1
  14. package/dist/Form/index.d.ts +1 -1
  15. package/dist/Grid/index.d.cts +1 -1
  16. package/dist/Grid/index.d.ts +1 -1
  17. package/dist/Input/index.d.cts +1 -1
  18. package/dist/Input/index.d.ts +1 -1
  19. package/dist/RadioBoxes/index.d.cts +1 -1
  20. package/dist/RadioBoxes/index.d.ts +1 -1
  21. package/dist/RadioTabs/index.d.cts +1 -1
  22. package/dist/RadioTabs/index.d.ts +1 -1
  23. package/dist/Radios/index.d.cts +1 -1
  24. package/dist/Radios/index.d.ts +1 -1
  25. package/dist/Select/index.d.cts +1 -1
  26. package/dist/Select/index.d.ts +1 -1
  27. package/dist/Slider/index.d.cts +1 -1
  28. package/dist/Slider/index.d.ts +1 -1
  29. package/dist/SubmitButton/index.d.cts +1 -1
  30. package/dist/SubmitButton/index.d.ts +1 -1
  31. package/dist/Switch/index.d.cts +1 -1
  32. package/dist/Switch/index.d.ts +1 -1
  33. package/dist/SwitchBox/index.d.cts +1 -1
  34. package/dist/SwitchBox/index.d.ts +1 -1
  35. package/dist/TextArea/index.d.cts +1 -1
  36. package/dist/TextArea/index.d.ts +1 -1
  37. package/dist/hooks/useClientValidation/index.d.cts +1 -1
  38. package/dist/hooks/useClientValidation/index.d.ts +1 -1
  39. package/dist/hooks/useFormContext/index.d.cts +1 -1
  40. package/dist/hooks/useFormContext/index.d.ts +1 -1
  41. package/dist/hooks/useUniformField/index.d.cts +1 -1
  42. package/dist/hooks/useUniformField/index.d.ts +2 -2
  43. package/dist/hooks/useUniformFieldArray/index.d.cts +1 -1
  44. package/dist/hooks/useUniformFieldArray/index.d.ts +21 -21
  45. package/dist/{index-CdXOAPMb.d.ts → index-5SxIjw6Y.d.cts} +48 -48
  46. package/dist/index-5SxIjw6Y.d.cts.map +1 -0
  47. package/dist/{index-BKCiuwim.d.cts → index-B5oUKlIo.d.ts} +48 -48
  48. package/dist/index-B5oUKlIo.d.ts.map +1 -0
  49. package/dist/{index-CVY05bZf.d.ts → index-BL0DnIzh.d.ts} +3 -3
  50. package/dist/{index-CVY05bZf.d.ts.map → index-BL0DnIzh.d.ts.map} +1 -1
  51. package/dist/{index-D-ucmG60.d.ts → index-BPupl-39.d.ts} +21 -21
  52. package/dist/index-BPupl-39.d.ts.map +1 -0
  53. package/dist/index-BTr_gid3.d.cts.map +1 -1
  54. package/dist/{index-noH6pESQ.d.ts → index-BXm2Nvuc.d.ts} +34 -34
  55. package/dist/{index-noH6pESQ.d.ts.map → index-BXm2Nvuc.d.ts.map} +1 -1
  56. package/dist/{index-DaBgwR1t.d.cts → index-BYag2YM-.d.cts} +21 -21
  57. package/dist/{index-DaBgwR1t.d.cts.map → index-BYag2YM-.d.cts.map} +1 -1
  58. package/dist/{index-DYErnCVV.d.cts → index-BbWEFpRz.d.cts} +36 -36
  59. package/dist/{index-DYErnCVV.d.cts.map → index-BbWEFpRz.d.cts.map} +1 -1
  60. package/dist/{index-CPcJGZVS.d.ts → index-BlK4-QN0.d.cts} +1 -1
  61. package/dist/{index-B2IL9Zt7.d.cts.map → index-BlK4-QN0.d.cts.map} +1 -1
  62. package/dist/{index-hacHTzh4.d.cts → index-BtRhfPlX.d.cts} +35 -35
  63. package/dist/{index-hacHTzh4.d.cts.map → index-BtRhfPlX.d.cts.map} +1 -1
  64. package/dist/{index-CCeHSmIe.d.ts → index-ByDAUZR8.d.cts} +3 -3
  65. package/dist/{index-BbA9HcNa.d.cts.map → index-ByDAUZR8.d.cts.map} +1 -1
  66. package/dist/{index-CJ90vm9t.d.ts → index-C-t8ET2t.d.ts} +6 -6
  67. package/dist/{index-CJ90vm9t.d.ts.map → index-C-t8ET2t.d.ts.map} +1 -1
  68. package/dist/{index-DubKudrE.d.ts → index-C6YO7fVN.d.ts} +6 -6
  69. package/dist/index-C6YO7fVN.d.ts.map +1 -0
  70. package/dist/{index-CZ5EIIjq.d.cts → index-C8e2kOHz.d.cts} +6 -6
  71. package/dist/index-C8e2kOHz.d.cts.map +1 -0
  72. package/dist/{index-B2IL9Zt7.d.cts → index-CEB_3pH3.d.ts} +1 -1
  73. package/dist/{index-CPcJGZVS.d.ts.map → index-CEB_3pH3.d.ts.map} +1 -1
  74. package/dist/{index-Djc5tmi3.d.ts → index-CGnr_e53.d.ts} +34 -34
  75. package/dist/index-CGnr_e53.d.ts.map +1 -0
  76. package/dist/{index-DW1uBiAf.d.cts → index-CK4iUXtY.d.cts} +18 -6
  77. package/dist/index-CK4iUXtY.d.cts.map +1 -0
  78. package/dist/{index-aHcGnXHf.d.ts → index-CMQe-K8d.d.cts} +4 -4
  79. package/dist/{index-Bo79xzb4.d.cts.map → index-CMQe-K8d.d.cts.map} +1 -1
  80. package/dist/{index-PU5WNOH9.d.cts → index-CYfagyef.d.ts} +3 -3
  81. package/dist/{index-lot50R9R.d.ts.map → index-CYfagyef.d.ts.map} +1 -1
  82. package/dist/{index-CpVfOXNv.d.cts → index-ChtlWBjc.d.cts} +3 -3
  83. package/dist/{index-CpVfOXNv.d.cts.map → index-ChtlWBjc.d.cts.map} +1 -1
  84. package/dist/{index-BuX42Bbd.d.ts → index-Ct6a8Dxz.d.ts} +18 -6
  85. package/dist/index-Ct6a8Dxz.d.ts.map +1 -0
  86. package/dist/{index-tIGuHSXb.d.ts → index-CuACo6jI.d.ts} +4 -4
  87. package/dist/{index-tIGuHSXb.d.ts.map → index-CuACo6jI.d.ts.map} +1 -1
  88. package/dist/{index-BDvr4eaz.d.ts → index-D4S6YQwi.d.cts} +21 -21
  89. package/dist/{index-2SVlCM0Y.d.cts.map → index-D4S6YQwi.d.cts.map} +1 -1
  90. package/dist/{index-Bo79xzb4.d.cts → index-D4jPNNjM.d.ts} +5 -5
  91. package/dist/{index-aHcGnXHf.d.ts.map → index-D4jPNNjM.d.ts.map} +1 -1
  92. package/dist/{index-2SVlCM0Y.d.cts → index-DJyRJr0I.d.ts} +21 -21
  93. package/dist/{index-BDvr4eaz.d.ts.map → index-DJyRJr0I.d.ts.map} +1 -1
  94. package/dist/index-D_VcH_gn.d.ts +278 -0
  95. package/dist/{index-CRYEKT3o.d.ts.map → index-D_VcH_gn.d.ts.map} +1 -1
  96. package/dist/{index-lot50R9R.d.ts → index-Db46CiKm.d.cts} +3 -3
  97. package/dist/{index-PU5WNOH9.d.cts.map → index-Db46CiKm.d.cts.map} +1 -1
  98. package/dist/index-Dbn5MHgv.d.cts +278 -0
  99. package/dist/{index-D5rTKWm9.d.cts.map → index-Dbn5MHgv.d.cts.map} +1 -1
  100. package/dist/{index-DymdaDrj.d.cts → index-DmMenZfj.d.ts} +6 -6
  101. package/dist/{index-DS4AP9pV.d.ts.map → index-DmMenZfj.d.ts.map} +1 -1
  102. package/dist/{index-BbA9HcNa.d.cts → index-DzGaqagC.d.ts} +3 -3
  103. package/dist/{index-CCeHSmIe.d.ts.map → index-DzGaqagC.d.ts.map} +1 -1
  104. package/dist/{index-DS4AP9pV.d.ts → index-Nrdyx_72.d.cts} +5 -5
  105. package/dist/{index-DymdaDrj.d.cts.map → index-Nrdyx_72.d.cts.map} +1 -1
  106. package/dist/{index-Cj5CLBt2.d.cts → index-PdZaOKs9.d.cts} +4 -4
  107. package/dist/{index-Cj5CLBt2.d.cts.map → index-PdZaOKs9.d.cts.map} +1 -1
  108. package/dist/{index-FHPC_VE1.d.ts → index-WKgD5_vg.d.ts} +35 -35
  109. package/dist/{index-FHPC_VE1.d.ts.map → index-WKgD5_vg.d.ts.map} +1 -1
  110. package/dist/{index-BZrLB2p0.d.cts → index-dhcztpfB.d.cts} +34 -34
  111. package/dist/index-dhcztpfB.d.cts.map +1 -0
  112. package/dist/{index-Ct2YYfiU.d.cts → index-uLhUKJjx.d.cts} +6 -6
  113. package/dist/{index-Ct2YYfiU.d.cts.map → index-uLhUKJjx.d.cts.map} +1 -1
  114. package/dist/index.cjs +1 -1
  115. package/dist/index.d.cts +21 -21
  116. package/dist/index.d.ts +21 -21
  117. package/dist/index.js +1 -1
  118. package/dist/partials/FieldCopyTestIdButton/index.d.cts +1 -1
  119. package/dist/partials/FieldCopyTestIdButton/index.d.ts +1 -1
  120. package/dist/partials/FieldValidationError/index.d.cts +1 -1
  121. package/dist/partials/FieldValidationError/index.d.ts +1 -1
  122. package/dist/{useClientValidation-Bv0yxTyV.d.ts → useClientValidation-CeHOxxj1.d.ts} +3 -3
  123. package/dist/{useClientValidation-Bv0yxTyV.d.ts.map → useClientValidation-CeHOxxj1.d.ts.map} +1 -1
  124. package/dist/{useClientValidation-DSMw7f-t.d.cts → useClientValidation-DG1xPiN5.d.cts} +3 -3
  125. package/dist/{useClientValidation-DSMw7f-t.d.cts.map → useClientValidation-DG1xPiN5.d.cts.map} +1 -1
  126. package/dist/{useFormContext-oEivkWtB.d.cts → useFormContext-B083Y-kw.d.cts} +3 -3
  127. package/dist/useFormContext-B083Y-kw.d.cts.map +1 -0
  128. package/dist/{useFormContext-DDx8LD8e.d.ts → useFormContext-B2TS6xq0.d.ts} +3 -3
  129. package/dist/useFormContext-B2TS6xq0.d.ts.map +1 -0
  130. package/dist/{useUniformField-q3GCAV85.d.ts → useUniformField-B-hszxep.d.ts} +2 -2
  131. package/dist/{useUniformField-q3GCAV85.d.ts.map → useUniformField-B-hszxep.d.ts.map} +1 -1
  132. package/dist/{useUniformField-DFXQO9dw.d.cts → useUniformField-BlqMUaQk.d.cts} +2 -2
  133. package/dist/{useUniformField-DFXQO9dw.d.cts.map → useUniformField-BlqMUaQk.d.cts.map} +1 -1
  134. package/dist/{useUniformFieldArray-B3smveBW.d.cts → useUniformFieldArray-BMMpIjre.d.cts} +3 -3
  135. package/dist/{useUniformFieldArray-B3smveBW.d.cts.map → useUniformFieldArray-BMMpIjre.d.cts.map} +1 -1
  136. package/dist/{useUniformFieldArray-CmACueEO.d.ts → useUniformFieldArray-KOP2kbMC.d.ts} +3 -3
  137. package/dist/{useUniformFieldArray-CmACueEO.d.ts.map → useUniformFieldArray-KOP2kbMC.d.ts.map} +1 -1
  138. package/package.json +2 -2
  139. package/dist/FieldCard-DZSiMFoO.js.map +0 -1
  140. package/dist/FieldCard-DcMORXZR.cjs.map +0 -1
  141. package/dist/index-BKCiuwim.d.cts.map +0 -1
  142. package/dist/index-BZrLB2p0.d.cts.map +0 -1
  143. package/dist/index-BuX42Bbd.d.ts.map +0 -1
  144. package/dist/index-CRYEKT3o.d.ts +0 -278
  145. package/dist/index-CZ5EIIjq.d.cts.map +0 -1
  146. package/dist/index-CdXOAPMb.d.ts.map +0 -1
  147. package/dist/index-D-ucmG60.d.ts.map +0 -1
  148. package/dist/index-D5rTKWm9.d.cts +0 -278
  149. package/dist/index-DW1uBiAf.d.cts.map +0 -1
  150. package/dist/index-Djc5tmi3.d.ts.map +0 -1
  151. package/dist/index-DubKudrE.d.ts.map +0 -1
  152. package/dist/useFormContext-DDx8LD8e.d.ts.map +0 -1
  153. package/dist/useFormContext-oEivkWtB.d.cts.map +0 -1
@@ -1,2 +1,2 @@
1
- import { n as Checkboxes, r as CheckboxesProps, t as CheckboxOption } from "../index-CZ5EIIjq.cjs";
1
+ import { n as Checkboxes, r as CheckboxesProps, t as CheckboxOption } from "../index-C8e2kOHz.cjs";
2
2
  export { CheckboxOption, Checkboxes, Checkboxes as default, CheckboxesProps };
@@ -1,2 +1,2 @@
1
- import { n as Checkboxes, r as CheckboxesProps, t as CheckboxOption } from "../index-DubKudrE.js";
1
+ import { n as Checkboxes, r as CheckboxesProps, t as CheckboxOption } from "../index-C6YO7fVN.js";
2
2
  export { CheckboxOption, Checkboxes, Checkboxes as default, CheckboxesProps };
@@ -1,2 +1,2 @@
1
- import { i as FieldArrayProps, n as FieldArrayChildrenRenderFn, r as FieldArrayFeatures, t as FieldArray } from "../index-Ct2YYfiU.cjs";
1
+ import { i as FieldArrayProps, n as FieldArrayChildrenRenderFn, r as FieldArrayFeatures, t as FieldArray } from "../index-uLhUKJjx.cjs";
2
2
  export { FieldArray, FieldArray as default, FieldArrayChildrenRenderFn, FieldArrayFeatures, FieldArrayProps };
@@ -1,2 +1,2 @@
1
- import { i as FieldArrayProps, n as FieldArrayChildrenRenderFn, r as FieldArrayFeatures, t as FieldArray } from "../index-CJ90vm9t.js";
1
+ import { i as FieldArrayProps, n as FieldArrayChildrenRenderFn, r as FieldArrayFeatures, t as FieldArray } from "../index-C-t8ET2t.js";
2
2
  export { FieldArray, FieldArray as default, FieldArrayChildrenRenderFn, FieldArrayFeatures, FieldArrayProps };
@@ -1,4 +1,4 @@
1
- const require_FieldCard = require('../FieldCard-DcMORXZR.cjs');
1
+ const require_FieldCard = require('../FieldCard-BMmp6vcn.cjs');
2
2
 
3
3
  exports.FieldCard = require_FieldCard.FieldCard_default;
4
4
  exports.fieldCardVariants = require_FieldCard.fieldCardVariants;
@@ -1,2 +1,2 @@
1
- import { n as FieldCardProps, r as fieldCardVariants, t as FieldCard } from "../index-DW1uBiAf.cjs";
1
+ import { n as FieldCardProps, r as fieldCardVariants, t as FieldCard } from "../index-CK4iUXtY.cjs";
2
2
  export { FieldCard, FieldCardProps, fieldCardVariants };
@@ -1,2 +1,2 @@
1
- import { n as FieldCardProps, r as fieldCardVariants, t as FieldCard } from "../index-BuX42Bbd.js";
1
+ import { n as FieldCardProps, r as fieldCardVariants, t as FieldCard } from "../index-Ct6a8Dxz.js";
2
2
  export { FieldCard, FieldCardProps, fieldCardVariants };
@@ -1,3 +1,3 @@
1
- import { n as fieldCardVariants, t as FieldCard_default } from "../FieldCard-DZSiMFoO.js";
1
+ import { n as fieldCardVariants, t as FieldCard_default } from "../FieldCard-DAtdvKrE.js";
2
2
 
3
3
  export { FieldCard_default as FieldCard, fieldCardVariants };
@@ -12,9 +12,13 @@ let _fuf_stack_pixel_motion = require("@fuf-stack/pixel-motion");
12
12
  *
13
13
  * This component handles displaying field-level validation errors with proper
14
14
  * accessibility attributes and animates them in/out using Framer Motion.
15
+ *
16
+ * Note: Object-level errors (_errors) are always shown when they exist,
17
+ * but the danger styling is controlled by the parent FieldCard based on
18
+ * whether child fields have been touched.
15
19
  */
16
- const FieldCardValidationError = ({ className = void 0, name }) => {
17
- const { error, getErrorMessageProps, getHelperWrapperProps, testId } = require_useUniformField.useUniformField({ name });
20
+ const FieldCardValidationError = ({ className = void 0, error = void 0, errorTextClassName = void 0, name }) => {
21
+ const { getErrorMessageProps, getHelperWrapperProps, testId } = require_useUniformField.useUniformField({ name });
18
22
  const disableAnimation = (0, _fuf_stack_pixel_motion.useReducedMotion)();
19
23
  const hasErrors = !!error?._errors;
20
24
  return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_fuf_stack_pixel_motion.AnimatePresence, {
@@ -42,6 +46,7 @@ const FieldCardValidationError = ({ className = void 0, name }) => {
42
46
  className: (0, _fuf_stack_pixel_utils.cn)(getHelperWrapperProps()?.className, className),
43
47
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
44
48
  ...getErrorMessageProps(),
49
+ className: (0, _fuf_stack_pixel_utils.cn)(getErrorMessageProps()?.className, errorTextClassName),
45
50
  children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_FieldValidationError.FieldValidationError_default$1, {
46
51
  error: error._errors,
47
52
  testId
@@ -86,18 +91,21 @@ const fieldCardVariants = (0, _fuf_stack_pixel_utils.tv)({
86
91
  "border-t",
87
92
  "block px-3 pb-2 pt-1",
88
93
  "transition-colors duration-150 motion-reduce:transition-none"
89
- ]
94
+ ],
95
+ errorText: []
90
96
  },
91
97
  variants: { invalid: {
92
98
  true: {
93
99
  base: "border-danger-200",
94
100
  label: "border-danger-200 text-danger",
95
- errorFooter: "border-danger-200"
101
+ errorFooter: "border-danger-200",
102
+ errorText: "!text-danger text-tiny"
96
103
  },
97
104
  false: {
98
105
  base: "border-divider",
99
106
  label: "border-divider text-foreground",
100
- errorFooter: "border-divider"
107
+ errorFooter: "border-divider",
108
+ errorText: "!text-foreground-500 text-tiny"
101
109
  }
102
110
  } },
103
111
  defaultVariants: { invalid: false }
@@ -143,8 +151,11 @@ const FieldCard = ({ children, className: _className = void 0, name, ...uniformF
143
151
  };
144
152
  const fieldTouched = getNestedValue(touchedFields, name);
145
153
  const hasObjectErrors = !!error?._errors;
146
- const hasChildErrors = submitCount > 0 || hasVisibleChildErrors(error, fieldTouched);
147
- const className = (0, _fuf_stack_pixel_utils.variantsToClassNames)(fieldCardVariants({ invalid: hasObjectErrors || hasChildErrors }), _className, "base");
154
+ const hasAnyChildTouched = fieldTouched && Object.keys(fieldTouched).some((key) => {
155
+ return key !== "_errors";
156
+ });
157
+ const hasVisibleChildren = submitCount > 0 || hasVisibleChildErrors(error, fieldTouched);
158
+ const className = (0, _fuf_stack_pixel_utils.variantsToClassNames)(fieldCardVariants({ invalid: hasObjectErrors && (submitCount > 0 || !!hasAnyChildTouched) || hasVisibleChildren }), _className, "base");
148
159
  return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
149
160
  className: className.base,
150
161
  children: [
@@ -165,6 +176,8 @@ const FieldCard = ({ children, className: _className = void 0, name, ...uniformF
165
176
  }),
166
177
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldCardValidationError_default, {
167
178
  className: className.errorFooter,
179
+ error,
180
+ errorTextClassName: className.errorText,
168
181
  name
169
182
  })
170
183
  ]
@@ -185,4 +198,4 @@ Object.defineProperty(exports, 'fieldCardVariants', {
185
198
  return fieldCardVariants;
186
199
  }
187
200
  });
188
- //# sourceMappingURL=FieldCard-DcMORXZR.cjs.map
201
+ //# sourceMappingURL=FieldCard-BMmp6vcn.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FieldCard-BMmp6vcn.cjs","names":["useUniformField","AnimatePresence","motion","FieldValidationError","useUniformField","useFormContext","checkFieldIsRequired","FieldCardValidationError"],"sources":["../src/FieldCard/subcomponents/FieldCardValidationError.tsx","../src/FieldCard/FieldCard.tsx"],"sourcesContent":["import type { FieldError } from 'react-hook-form';\n\nimport {\n AnimatePresence,\n motion,\n useReducedMotion,\n} from '@fuf-stack/pixel-motion';\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../../hooks/useUniformField';\nimport FieldValidationError from '../../partials/FieldValidationError/FieldValidationError';\n\nexport interface FieldCardValidationErrorProps {\n /** CSS class name for the error footer wrapper */\n className?: string;\n /** Error object from parent FieldCard (passed directly to avoid duplicate hook calls) */\n error?: FieldError[] | undefined;\n /** CSS class name for the error text (controls color based on invalid state) */\n errorTextClassName?: string;\n /** Field name */\n name: string;\n}\n\n/**\n * Renders validation errors in the footer of a FieldCard component.\n *\n * This component handles displaying field-level validation errors with proper\n * accessibility attributes and animates them in/out using Framer Motion.\n *\n * Note: Object-level errors (_errors) are always shown when they exist,\n * but the danger styling is controlled by the parent FieldCard based on\n * whether child fields have been touched.\n */\nconst FieldCardValidationError = ({\n className = undefined,\n error = undefined,\n errorTextClassName = undefined,\n name,\n}: FieldCardValidationErrorProps) => {\n const { getErrorMessageProps, getHelperWrapperProps, testId } =\n useUniformField({\n name,\n });\n\n // disable all animation if user prefers reduced motion\n const disableAnimation = useReducedMotion();\n\n // Always show object-level errors (_errors) when they exist\n // @ts-expect-error - error._errors exists but not typed\n const hasErrors = !!error?._errors;\n\n return (\n <AnimatePresence initial={!disableAnimation}>\n {hasErrors ? (\n <motion.div\n key=\"field-card-errors\"\n exit={disableAnimation ? undefined : { opacity: 0, height: 0 }}\n initial={disableAnimation ? false : { height: 0, opacity: 0 }}\n style={{ overflow: 'hidden' }}\n transition={{ duration: 0.4, ease: 'circOut' }}\n animate={\n disableAnimation ? undefined : { opacity: 1, height: 'auto' }\n }\n >\n <div\n {...getHelperWrapperProps()}\n className={cn(getHelperWrapperProps()?.className, className)}\n >\n <div\n {...getErrorMessageProps()}\n className={cn(\n getErrorMessageProps()?.className,\n errorTextClassName,\n )}\n >\n <FieldValidationError\n // @ts-expect-error - error._errors exists but not typed\n error={error._errors}\n testId={testId}\n />\n </div>\n </div>\n </motion.div>\n ) : null}\n </AnimatePresence>\n );\n};\n\nexport default FieldCardValidationError;\n","import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { checkFieldIsRequired, useFormContext } from '../hooks/useFormContext';\nimport { useUniformField } from '../hooks/useUniformField';\nimport FieldCardValidationError from './subcomponents/FieldCardValidationError';\n\n/**\n * Recursively checks if any child field with an error is also touched.\n * Returns true if at least one touched child has an error.\n */\nexport const hasVisibleChildErrors = (\n errors: Record<string, unknown> | undefined,\n touched: Record<string, unknown> | undefined,\n): boolean => {\n if (!errors || !touched) {\n return false;\n }\n\n return Object.keys(errors)\n .filter((key) => {\n // Skip object-level errors (_errors) - those are handled separately\n return key !== '_errors';\n })\n .some((key) => {\n const errorValue = errors[key];\n const touchedValue = touched[key];\n\n // If this key doesn't exist in both errors and touched, skip\n if (errorValue === undefined || touchedValue === undefined) {\n return false;\n }\n\n // If errorValue is an array, it's a leaf field error\n if (Array.isArray(errorValue)) {\n // touchedValue being truthy means the field is touched\n return !!touchedValue;\n }\n\n // Recursively check nested objects\n if (typeof errorValue === 'object' && errorValue !== null) {\n return hasVisibleChildErrors(\n errorValue as Record<string, unknown>,\n touchedValue as Record<string, unknown>,\n );\n }\n\n return false;\n });\n};\n\nexport const fieldCardVariants = tv({\n slots: {\n /** base class for the field card wrapper */\n base: [\n // base styles\n 'overflow-hidden rounded-small border bg-content1',\n // animate border color change, respect reduced motion\n 'transition-colors duration-150 motion-reduce:transition-none',\n ],\n /** class for the label/header */\n label: [\n // override HeroUI label positioning and display\n 'pointer-events-auto! static! z-auto! block! w-full!',\n // reset any transforms or translations\n 'translate-x-0! translate-y-0! transform-none!',\n // card header styling - use text-medium (16px) for proper header size\n 'rounded-t-small border-b p-3 font-semibold text-medium',\n // animate border and text color change, respect reduced motion\n 'transition-colors duration-150 motion-reduce:transition-none',\n ],\n /** class for the content */\n content: [\n // same as p-3 of Card component\n 'p-3',\n // default grid for form components (see Grid component)\n 'grid gap-4',\n ],\n /** class for the error footer wrapper */\n errorFooter: [\n 'border-t',\n // force helper to be visible and add padding (pt-1 to compensate for inner content's top padding)\n 'block px-3 pb-2 pt-1',\n // animate border color change, respect reduced motion\n 'transition-colors duration-150 motion-reduce:transition-none',\n ],\n /** class for the error text (empty base, color controlled by variant) */\n errorText: [],\n },\n variants: {\n invalid: {\n true: {\n base: 'border-danger-200',\n label: 'border-danger-200 text-danger',\n errorFooter: 'border-danger-200',\n errorText: '!text-danger text-tiny',\n },\n false: {\n base: 'border-divider',\n label: 'border-divider text-foreground',\n errorFooter: 'border-divider',\n errorText: '!text-foreground-500 text-tiny',\n },\n },\n },\n defaultVariants: {\n invalid: false,\n },\n});\n\ntype ClassName = TVClassName<typeof fieldCardVariants>;\n\nexport interface FieldCardProps {\n /** Content to render inside the card */\n children: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** Label content for the card header */\n label: ReactNode;\n /** Field name for validation */\n name: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * FieldCard component - A card-styled container with label header and error footer\n *\n * Displays form field content in a card layout with:\n * - Label/title in the header\n * - Content in the body\n * - Validation errors in the footer\n * - Danger outline when validation errors exist\n */\nconst FieldCard = ({\n children,\n className: _className = undefined,\n name,\n ...uniformFieldProps\n}: FieldCardProps) => {\n const { error, getLabelProps, label } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n const {\n control,\n formState: { touchedFields, submitCount },\n validation,\n } = useFormContext();\n\n // Check if any registered child field is required\n const validationInstance = validation?.baseInstance ?? validation?.instance;\n const registeredFields: string[] = Array.from(\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (control as any)._names?.mount ?? [],\n );\n const childFieldPrefix = `${name}.`;\n const isRequired = validationInstance\n ? registeredFields\n .filter((f) => {\n return f.startsWith(childFieldPrefix);\n })\n .some((f) => {\n return checkFieldIsRequired(\n validationInstance,\n f.split('.').filter((k) => {\n return k !== '';\n }),\n );\n })\n : false;\n\n // Get touched state for this field's children by traversing the path\n const getNestedValue = (\n obj: Record<string, unknown> | undefined,\n path: string,\n ): Record<string, unknown> | undefined => {\n if (!obj) {\n return undefined;\n }\n const keys = path.split('.');\n let current: unknown = obj;\n keys.every((key) => {\n if (current && typeof current === 'object') {\n current = (current as Record<string, unknown>)[key];\n return true;\n }\n current = undefined;\n return false;\n });\n return current as Record<string, unknown> | undefined;\n };\n\n const fieldTouched = getNestedValue(\n touchedFields as Record<string, unknown>,\n name,\n );\n\n // Check for object-level errors (_errors)\n // @ts-expect-error - error._errors exists but not typed\n const hasObjectErrors = !!error?._errors;\n\n // Check if any child field is touched\n const hasAnyChildTouched =\n fieldTouched &&\n Object.keys(fieldTouched).some((key) => {\n return key !== '_errors';\n });\n\n // Check if any child field with an error is also touched\n const hasVisibleChildren =\n submitCount > 0 ||\n hasVisibleChildErrors(\n error as unknown as Record<string, unknown>,\n fieldTouched,\n );\n\n // Show invalid styling (red border/header) only when:\n // - Object errors exist AND at least one child field is touched, OR\n // - Child field errors are visible (touched with errors)\n const showInvalid =\n (hasObjectErrors && (submitCount > 0 || !!hasAnyChildTouched)) ||\n hasVisibleChildren;\n\n // className from slots\n const variants = fieldCardVariants({ invalid: showInvalid });\n const className = variantsToClassNames(variants, _className, 'base');\n\n return (\n <div className={className.base}>\n {/* card header with label */}\n {label ? (\n <div\n {...getLabelProps()}\n aria-level={3}\n // Override getLabelProps className to use our own invalid styling based on hasErrors,\n // not HeroUI's which is based on any child field being invalid\n className={className.label}\n role=\"heading\"\n >\n {label}\n {/* Manual asterisk: getLabelProps uses schema-required for the object itself,\n but FieldCard needs asterisk based on whether any CHILD field is required */}\n {isRequired ? (\n <span aria-hidden=\"true\" className=\"ml-0.5 text-danger\">\n *\n </span>\n ) : null}\n </div>\n ) : null}\n\n {/* card content */}\n <div className={className.content}>{children}</div>\n\n {/* card footer with validation errors - always show _errors, but danger styling controlled by showInvalid */}\n <FieldCardValidationError\n className={className.errorFooter}\n error={error}\n errorTextClassName={className.errorText}\n name={name}\n />\n </div>\n );\n};\n\nexport default FieldCard;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAiCA,MAAM,4BAA4B,EAChC,YAAY,QACZ,QAAQ,QACR,qBAAqB,QACrB,WACmC;CACnC,MAAM,EAAE,sBAAsB,uBAAuB,WACnDA,wCAAgB,EACd,MACD,CAAC;CAGJ,MAAM,kEAAqC;CAI3C,MAAM,YAAY,CAAC,CAAC,OAAO;AAE3B,QACE,2CAACC;EAAgB,SAAS,CAAC;YACxB,YACC,2CAACC,+BAAO;GAEN,MAAM,mBAAmB,SAAY;IAAE,SAAS;IAAG,QAAQ;IAAG;GAC9D,SAAS,mBAAmB,QAAQ;IAAE,QAAQ;IAAG,SAAS;IAAG;GAC7D,OAAO,EAAE,UAAU,UAAU;GAC7B,YAAY;IAAE,UAAU;IAAK,MAAM;IAAW;GAC9C,SACE,mBAAmB,SAAY;IAAE,SAAS;IAAG,QAAQ;IAAQ;aAG/D,2CAAC;IACC,GAAI,uBAAuB;IAC3B,0CAAc,uBAAuB,EAAE,WAAW,UAAU;cAE5D,2CAAC;KACC,GAAI,sBAAsB;KAC1B,0CACE,sBAAsB,EAAE,WACxB,mBACD;eAED,2CAACC;MAEC,OAAO,MAAM;MACL;OACR;MACE;KACF;KA1BF,oBA2BO,GACX;GACY;;AAItB,uCAAe;;;;;;;;AC3Ef,MAAa,yBACX,QACA,YACY;AACZ,KAAI,CAAC,UAAU,CAAC,QACd,QAAO;AAGT,QAAO,OAAO,KAAK,OAAO,CACvB,QAAQ,QAAQ;AAEf,SAAO,QAAQ;GACf,CACD,MAAM,QAAQ;EACb,MAAM,aAAa,OAAO;EAC1B,MAAM,eAAe,QAAQ;AAG7B,MAAI,eAAe,UAAa,iBAAiB,OAC/C,QAAO;AAIT,MAAI,MAAM,QAAQ,WAAW,CAE3B,QAAO,CAAC,CAAC;AAIX,MAAI,OAAO,eAAe,YAAY,eAAe,KACnD,QAAO,sBACL,YACA,aACD;AAGH,SAAO;GACP;;AAGN,MAAa,mDAAuB;CAClC,OAAO;EAEL,MAAM,CAEJ,oDAEA,+DACD;EAED,OAAO;GAEL;GAEA;GAEA;GAEA;GACD;EAED,SAAS,CAEP,OAEA,aACD;EAED,aAAa;GACX;GAEA;GAEA;GACD;EAED,WAAW,EAAE;EACd;CACD,UAAU,EACR,SAAS;EACP,MAAM;GACJ,MAAM;GACN,OAAO;GACP,aAAa;GACb,WAAW;GACZ;EACD,OAAO;GACL,MAAM;GACN,OAAO;GACP,aAAa;GACb,WAAW;GACZ;EACF,EACF;CACD,iBAAiB,EACf,SAAS,OACV;CACF,CAAC;;;;;;;;;;AA0BF,MAAM,aAAa,EACjB,UACA,WAAW,aAAa,QACxB,MACA,GAAG,wBACiB;CACpB,MAAM,EAAE,OAAO,eAAe,UAAUC,wCAAgB;EACtD;EACA,GAAG;EACJ,CAAC;CAEF,MAAM,EACJ,SACA,WAAW,EAAE,eAAe,eAC5B,eACEC,uCAAgB;CAGpB,MAAM,qBAAqB,YAAY,gBAAgB,YAAY;CACnE,MAAM,mBAA6B,MAAM,KAEtC,QAAgB,QAAQ,SAAS,EAAE,CACrC;CACD,MAAM,mBAAmB,GAAG,KAAK;CACjC,MAAM,aAAa,qBACf,iBACG,QAAQ,MAAM;AACb,SAAO,EAAE,WAAW,iBAAiB;GACrC,CACD,MAAM,MAAM;AACX,SAAOC,4CACL,oBACA,EAAE,MAAM,IAAI,CAAC,QAAQ,MAAM;AACzB,UAAO,MAAM;IACb,CACH;GACD,GACJ;CAGJ,MAAM,kBACJ,KACA,SACwC;AACxC,MAAI,CAAC,IACH;EAEF,MAAM,OAAO,KAAK,MAAM,IAAI;EAC5B,IAAI,UAAmB;AACvB,OAAK,OAAO,QAAQ;AAClB,OAAI,WAAW,OAAO,YAAY,UAAU;AAC1C,cAAW,QAAoC;AAC/C,WAAO;;AAET,aAAU;AACV,UAAO;IACP;AACF,SAAO;;CAGT,MAAM,eAAe,eACnB,eACA,KACD;CAID,MAAM,kBAAkB,CAAC,CAAC,OAAO;CAGjC,MAAM,qBACJ,gBACA,OAAO,KAAK,aAAa,CAAC,MAAM,QAAQ;AACtC,SAAO,QAAQ;GACf;CAGJ,MAAM,qBACJ,cAAc,KACd,sBACE,OACA,aACD;CAWH,MAAM,6DADW,kBAAkB,EAAE,SAJlC,oBAAoB,cAAc,KAAK,CAAC,CAAC,uBAC1C,oBAGyD,CAAC,EACX,YAAY,OAAO;AAEpE,QACE,4CAAC;EAAI,WAAW,UAAU;;GAEvB,QACC,4CAAC;IACC,GAAI,eAAe;IACnB,cAAY;IAGZ,WAAW,UAAU;IACrB,MAAK;eAEJ,OAGA,aACC,2CAAC;KAAK,eAAY;KAAO,WAAU;eAAqB;MAEjD,GACL;KACA,GACJ;GAGJ,2CAAC;IAAI,WAAW,UAAU;IAAU;KAAe;GAGnD,2CAACC;IACC,WAAW,UAAU;IACd;IACP,oBAAoB,UAAU;IACxB;KACN;;GACE;;AAIV,wBAAe"}
@@ -11,9 +11,13 @@ import { AnimatePresence, motion, useReducedMotion } from "@fuf-stack/pixel-moti
11
11
  *
12
12
  * This component handles displaying field-level validation errors with proper
13
13
  * accessibility attributes and animates them in/out using Framer Motion.
14
+ *
15
+ * Note: Object-level errors (_errors) are always shown when they exist,
16
+ * but the danger styling is controlled by the parent FieldCard based on
17
+ * whether child fields have been touched.
14
18
  */
15
- const FieldCardValidationError = ({ className = void 0, name }) => {
16
- const { error, getErrorMessageProps, getHelperWrapperProps, testId } = useUniformField({ name });
19
+ const FieldCardValidationError = ({ className = void 0, error = void 0, errorTextClassName = void 0, name }) => {
20
+ const { getErrorMessageProps, getHelperWrapperProps, testId } = useUniformField({ name });
17
21
  const disableAnimation = useReducedMotion();
18
22
  const hasErrors = !!error?._errors;
19
23
  return /* @__PURE__ */ jsx(AnimatePresence, {
@@ -41,6 +45,7 @@ const FieldCardValidationError = ({ className = void 0, name }) => {
41
45
  className: cn(getHelperWrapperProps()?.className, className),
42
46
  children: /* @__PURE__ */ jsx("div", {
43
47
  ...getErrorMessageProps(),
48
+ className: cn(getErrorMessageProps()?.className, errorTextClassName),
44
49
  children: /* @__PURE__ */ jsx(FieldValidationError_default, {
45
50
  error: error._errors,
46
51
  testId
@@ -85,18 +90,21 @@ const fieldCardVariants = tv({
85
90
  "border-t",
86
91
  "block px-3 pb-2 pt-1",
87
92
  "transition-colors duration-150 motion-reduce:transition-none"
88
- ]
93
+ ],
94
+ errorText: []
89
95
  },
90
96
  variants: { invalid: {
91
97
  true: {
92
98
  base: "border-danger-200",
93
99
  label: "border-danger-200 text-danger",
94
- errorFooter: "border-danger-200"
100
+ errorFooter: "border-danger-200",
101
+ errorText: "!text-danger text-tiny"
95
102
  },
96
103
  false: {
97
104
  base: "border-divider",
98
105
  label: "border-divider text-foreground",
99
- errorFooter: "border-divider"
106
+ errorFooter: "border-divider",
107
+ errorText: "!text-foreground-500 text-tiny"
100
108
  }
101
109
  } },
102
110
  defaultVariants: { invalid: false }
@@ -142,8 +150,11 @@ const FieldCard = ({ children, className: _className = void 0, name, ...uniformF
142
150
  };
143
151
  const fieldTouched = getNestedValue(touchedFields, name);
144
152
  const hasObjectErrors = !!error?._errors;
145
- const hasChildErrors = submitCount > 0 || hasVisibleChildErrors(error, fieldTouched);
146
- const className = variantsToClassNames(fieldCardVariants({ invalid: hasObjectErrors || hasChildErrors }), _className, "base");
153
+ const hasAnyChildTouched = fieldTouched && Object.keys(fieldTouched).some((key) => {
154
+ return key !== "_errors";
155
+ });
156
+ const hasVisibleChildren = submitCount > 0 || hasVisibleChildErrors(error, fieldTouched);
157
+ const className = variantsToClassNames(fieldCardVariants({ invalid: hasObjectErrors && (submitCount > 0 || !!hasAnyChildTouched) || hasVisibleChildren }), _className, "base");
147
158
  return /* @__PURE__ */ jsxs("div", {
148
159
  className: className.base,
149
160
  children: [
@@ -164,6 +175,8 @@ const FieldCard = ({ children, className: _className = void 0, name, ...uniformF
164
175
  }),
165
176
  /* @__PURE__ */ jsx(FieldCardValidationError_default, {
166
177
  className: className.errorFooter,
178
+ error,
179
+ errorTextClassName: className.errorText,
167
180
  name
168
181
  })
169
182
  ]
@@ -173,4 +186,4 @@ var FieldCard_default = FieldCard;
173
186
 
174
187
  //#endregion
175
188
  export { fieldCardVariants as n, FieldCard_default as t };
176
- //# sourceMappingURL=FieldCard-DZSiMFoO.js.map
189
+ //# sourceMappingURL=FieldCard-DAtdvKrE.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FieldCard-DAtdvKrE.js","names":["FieldValidationError","FieldCardValidationError"],"sources":["../src/FieldCard/subcomponents/FieldCardValidationError.tsx","../src/FieldCard/FieldCard.tsx"],"sourcesContent":["import type { FieldError } from 'react-hook-form';\n\nimport {\n AnimatePresence,\n motion,\n useReducedMotion,\n} from '@fuf-stack/pixel-motion';\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../../hooks/useUniformField';\nimport FieldValidationError from '../../partials/FieldValidationError/FieldValidationError';\n\nexport interface FieldCardValidationErrorProps {\n /** CSS class name for the error footer wrapper */\n className?: string;\n /** Error object from parent FieldCard (passed directly to avoid duplicate hook calls) */\n error?: FieldError[] | undefined;\n /** CSS class name for the error text (controls color based on invalid state) */\n errorTextClassName?: string;\n /** Field name */\n name: string;\n}\n\n/**\n * Renders validation errors in the footer of a FieldCard component.\n *\n * This component handles displaying field-level validation errors with proper\n * accessibility attributes and animates them in/out using Framer Motion.\n *\n * Note: Object-level errors (_errors) are always shown when they exist,\n * but the danger styling is controlled by the parent FieldCard based on\n * whether child fields have been touched.\n */\nconst FieldCardValidationError = ({\n className = undefined,\n error = undefined,\n errorTextClassName = undefined,\n name,\n}: FieldCardValidationErrorProps) => {\n const { getErrorMessageProps, getHelperWrapperProps, testId } =\n useUniformField({\n name,\n });\n\n // disable all animation if user prefers reduced motion\n const disableAnimation = useReducedMotion();\n\n // Always show object-level errors (_errors) when they exist\n // @ts-expect-error - error._errors exists but not typed\n const hasErrors = !!error?._errors;\n\n return (\n <AnimatePresence initial={!disableAnimation}>\n {hasErrors ? (\n <motion.div\n key=\"field-card-errors\"\n exit={disableAnimation ? undefined : { opacity: 0, height: 0 }}\n initial={disableAnimation ? false : { height: 0, opacity: 0 }}\n style={{ overflow: 'hidden' }}\n transition={{ duration: 0.4, ease: 'circOut' }}\n animate={\n disableAnimation ? undefined : { opacity: 1, height: 'auto' }\n }\n >\n <div\n {...getHelperWrapperProps()}\n className={cn(getHelperWrapperProps()?.className, className)}\n >\n <div\n {...getErrorMessageProps()}\n className={cn(\n getErrorMessageProps()?.className,\n errorTextClassName,\n )}\n >\n <FieldValidationError\n // @ts-expect-error - error._errors exists but not typed\n error={error._errors}\n testId={testId}\n />\n </div>\n </div>\n </motion.div>\n ) : null}\n </AnimatePresence>\n );\n};\n\nexport default FieldCardValidationError;\n","import type { TVClassName } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { checkFieldIsRequired, useFormContext } from '../hooks/useFormContext';\nimport { useUniformField } from '../hooks/useUniformField';\nimport FieldCardValidationError from './subcomponents/FieldCardValidationError';\n\n/**\n * Recursively checks if any child field with an error is also touched.\n * Returns true if at least one touched child has an error.\n */\nexport const hasVisibleChildErrors = (\n errors: Record<string, unknown> | undefined,\n touched: Record<string, unknown> | undefined,\n): boolean => {\n if (!errors || !touched) {\n return false;\n }\n\n return Object.keys(errors)\n .filter((key) => {\n // Skip object-level errors (_errors) - those are handled separately\n return key !== '_errors';\n })\n .some((key) => {\n const errorValue = errors[key];\n const touchedValue = touched[key];\n\n // If this key doesn't exist in both errors and touched, skip\n if (errorValue === undefined || touchedValue === undefined) {\n return false;\n }\n\n // If errorValue is an array, it's a leaf field error\n if (Array.isArray(errorValue)) {\n // touchedValue being truthy means the field is touched\n return !!touchedValue;\n }\n\n // Recursively check nested objects\n if (typeof errorValue === 'object' && errorValue !== null) {\n return hasVisibleChildErrors(\n errorValue as Record<string, unknown>,\n touchedValue as Record<string, unknown>,\n );\n }\n\n return false;\n });\n};\n\nexport const fieldCardVariants = tv({\n slots: {\n /** base class for the field card wrapper */\n base: [\n // base styles\n 'overflow-hidden rounded-small border bg-content1',\n // animate border color change, respect reduced motion\n 'transition-colors duration-150 motion-reduce:transition-none',\n ],\n /** class for the label/header */\n label: [\n // override HeroUI label positioning and display\n 'pointer-events-auto! static! z-auto! block! w-full!',\n // reset any transforms or translations\n 'translate-x-0! translate-y-0! transform-none!',\n // card header styling - use text-medium (16px) for proper header size\n 'rounded-t-small border-b p-3 font-semibold text-medium',\n // animate border and text color change, respect reduced motion\n 'transition-colors duration-150 motion-reduce:transition-none',\n ],\n /** class for the content */\n content: [\n // same as p-3 of Card component\n 'p-3',\n // default grid for form components (see Grid component)\n 'grid gap-4',\n ],\n /** class for the error footer wrapper */\n errorFooter: [\n 'border-t',\n // force helper to be visible and add padding (pt-1 to compensate for inner content's top padding)\n 'block px-3 pb-2 pt-1',\n // animate border color change, respect reduced motion\n 'transition-colors duration-150 motion-reduce:transition-none',\n ],\n /** class for the error text (empty base, color controlled by variant) */\n errorText: [],\n },\n variants: {\n invalid: {\n true: {\n base: 'border-danger-200',\n label: 'border-danger-200 text-danger',\n errorFooter: 'border-danger-200',\n errorText: '!text-danger text-tiny',\n },\n false: {\n base: 'border-divider',\n label: 'border-divider text-foreground',\n errorFooter: 'border-divider',\n errorText: '!text-foreground-500 text-tiny',\n },\n },\n },\n defaultVariants: {\n invalid: false,\n },\n});\n\ntype ClassName = TVClassName<typeof fieldCardVariants>;\n\nexport interface FieldCardProps {\n /** Content to render inside the card */\n children: ReactNode;\n /** CSS class name */\n className?: ClassName;\n /** Label content for the card header */\n label: ReactNode;\n /** Field name for validation */\n name: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * FieldCard component - A card-styled container with label header and error footer\n *\n * Displays form field content in a card layout with:\n * - Label/title in the header\n * - Content in the body\n * - Validation errors in the footer\n * - Danger outline when validation errors exist\n */\nconst FieldCard = ({\n children,\n className: _className = undefined,\n name,\n ...uniformFieldProps\n}: FieldCardProps) => {\n const { error, getLabelProps, label } = useUniformField({\n name,\n ...uniformFieldProps,\n });\n\n const {\n control,\n formState: { touchedFields, submitCount },\n validation,\n } = useFormContext();\n\n // Check if any registered child field is required\n const validationInstance = validation?.baseInstance ?? validation?.instance;\n const registeredFields: string[] = Array.from(\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (control as any)._names?.mount ?? [],\n );\n const childFieldPrefix = `${name}.`;\n const isRequired = validationInstance\n ? registeredFields\n .filter((f) => {\n return f.startsWith(childFieldPrefix);\n })\n .some((f) => {\n return checkFieldIsRequired(\n validationInstance,\n f.split('.').filter((k) => {\n return k !== '';\n }),\n );\n })\n : false;\n\n // Get touched state for this field's children by traversing the path\n const getNestedValue = (\n obj: Record<string, unknown> | undefined,\n path: string,\n ): Record<string, unknown> | undefined => {\n if (!obj) {\n return undefined;\n }\n const keys = path.split('.');\n let current: unknown = obj;\n keys.every((key) => {\n if (current && typeof current === 'object') {\n current = (current as Record<string, unknown>)[key];\n return true;\n }\n current = undefined;\n return false;\n });\n return current as Record<string, unknown> | undefined;\n };\n\n const fieldTouched = getNestedValue(\n touchedFields as Record<string, unknown>,\n name,\n );\n\n // Check for object-level errors (_errors)\n // @ts-expect-error - error._errors exists but not typed\n const hasObjectErrors = !!error?._errors;\n\n // Check if any child field is touched\n const hasAnyChildTouched =\n fieldTouched &&\n Object.keys(fieldTouched).some((key) => {\n return key !== '_errors';\n });\n\n // Check if any child field with an error is also touched\n const hasVisibleChildren =\n submitCount > 0 ||\n hasVisibleChildErrors(\n error as unknown as Record<string, unknown>,\n fieldTouched,\n );\n\n // Show invalid styling (red border/header) only when:\n // - Object errors exist AND at least one child field is touched, OR\n // - Child field errors are visible (touched with errors)\n const showInvalid =\n (hasObjectErrors && (submitCount > 0 || !!hasAnyChildTouched)) ||\n hasVisibleChildren;\n\n // className from slots\n const variants = fieldCardVariants({ invalid: showInvalid });\n const className = variantsToClassNames(variants, _className, 'base');\n\n return (\n <div className={className.base}>\n {/* card header with label */}\n {label ? (\n <div\n {...getLabelProps()}\n aria-level={3}\n // Override getLabelProps className to use our own invalid styling based on hasErrors,\n // not HeroUI's which is based on any child field being invalid\n className={className.label}\n role=\"heading\"\n >\n {label}\n {/* Manual asterisk: getLabelProps uses schema-required for the object itself,\n but FieldCard needs asterisk based on whether any CHILD field is required */}\n {isRequired ? (\n <span aria-hidden=\"true\" className=\"ml-0.5 text-danger\">\n *\n </span>\n ) : null}\n </div>\n ) : null}\n\n {/* card content */}\n <div className={className.content}>{children}</div>\n\n {/* card footer with validation errors - always show _errors, but danger styling controlled by showInvalid */}\n <FieldCardValidationError\n className={className.errorFooter}\n error={error}\n errorTextClassName={className.errorText}\n name={name}\n />\n </div>\n );\n};\n\nexport default FieldCard;\n"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import { n as FormProps, t as Form } from "../index-Bo79xzb4.cjs";
1
+ import { n as FormProps, t as Form } from "../index-CMQe-K8d.cjs";
2
2
  export { Form, Form as default, FormProps };
@@ -1,3 +1,3 @@
1
1
  import "../FormContext-C2_WMi_v.js";
2
- import { n as FormProps, t as Form } from "../index-aHcGnXHf.js";
2
+ import { n as FormProps, t as Form } from "../index-D4jPNNjM.js";
3
3
  export { Form, Form as default, FormProps };
@@ -1,2 +1,2 @@
1
- import { n as GridProps, t as Grid } from "../index-BbA9HcNa.cjs";
1
+ import { n as GridProps, t as Grid } from "../index-ByDAUZR8.cjs";
2
2
  export { Grid, Grid as default, GridProps };
@@ -1,2 +1,2 @@
1
- import { n as GridProps, t as Grid } from "../index-CCeHSmIe.js";
1
+ import { n as GridProps, t as Grid } from "../index-DzGaqagC.js";
2
2
  export { Grid, Grid as default, GridProps };
@@ -1,2 +1,2 @@
1
- import { n as InputProps, t as Input } from "../index-DaBgwR1t.cjs";
1
+ import { n as InputProps, t as Input } from "../index-BYag2YM-.cjs";
2
2
  export { Input, Input as default, InputProps };
@@ -1,2 +1,2 @@
1
- import { n as InputProps, t as Input } from "../index-D-ucmG60.js";
1
+ import { n as InputProps, t as Input } from "../index-BPupl-39.js";
2
2
  export { Input, Input as default, InputProps };
@@ -1,2 +1,2 @@
1
- import { n as RadioBoxes, r as RadioBoxesProps, t as radioBoxVariants } from "../index-hacHTzh4.cjs";
1
+ import { n as RadioBoxes, r as RadioBoxesProps, t as radioBoxVariants } from "../index-BtRhfPlX.cjs";
2
2
  export { RadioBoxes, RadioBoxes as default, RadioBoxesProps, radioBoxVariants };
@@ -1,2 +1,2 @@
1
- import { n as RadioBoxes, r as RadioBoxesProps, t as radioBoxVariants } from "../index-FHPC_VE1.js";
1
+ import { n as RadioBoxes, r as RadioBoxesProps, t as radioBoxVariants } from "../index-WKgD5_vg.js";
2
2
  export { RadioBoxes, RadioBoxes as default, RadioBoxesProps, radioBoxVariants };
@@ -1,2 +1,2 @@
1
- import { n as RadioTabsProps, t as RadioTabs } from "../index-Cj5CLBt2.cjs";
1
+ import { n as RadioTabsProps, t as RadioTabs } from "../index-PdZaOKs9.cjs";
2
2
  export { RadioTabs, RadioTabs as default, RadioTabsProps };
@@ -1,2 +1,2 @@
1
- import { n as RadioTabsProps, t as RadioTabs } from "../index-tIGuHSXb.js";
1
+ import { n as RadioTabsProps, t as RadioTabs } from "../index-CuACo6jI.js";
2
2
  export { RadioTabs, RadioTabs as default, RadioTabsProps };
@@ -1,2 +1,2 @@
1
- import { n as RadiosProps, t as Radios } from "../index-BZrLB2p0.cjs";
1
+ import { n as RadiosProps, t as Radios } from "../index-dhcztpfB.cjs";
2
2
  export { Radios, Radios as default, RadiosProps };
@@ -1,2 +1,2 @@
1
- import { n as RadiosProps, t as Radios } from "../index-noH6pESQ.js";
1
+ import { n as RadiosProps, t as Radios } from "../index-BXm2Nvuc.js";
2
2
  export { Radios, Radios as default, RadiosProps };
@@ -1,2 +1,2 @@
1
- import { n as SelectProps, t as Select } from "../index-D5rTKWm9.cjs";
1
+ import { n as SelectProps, t as Select } from "../index-Dbn5MHgv.cjs";
2
2
  export { Select, Select as default, SelectProps };
@@ -1,2 +1,2 @@
1
- import { n as SelectProps, t as Select } from "../index-CRYEKT3o.js";
1
+ import { n as SelectProps, t as Select } from "../index-D_VcH_gn.js";
2
2
  export { Select, Select as default, SelectProps };
@@ -1,2 +1,2 @@
1
- import { n as SliderProps, t as Slider } from "../index-BKCiuwim.cjs";
1
+ import { n as SliderProps, t as Slider } from "../index-5SxIjw6Y.cjs";
2
2
  export { Slider, Slider as default, SliderProps };
@@ -1,2 +1,2 @@
1
- import { n as SliderProps, t as Slider } from "../index-CdXOAPMb.js";
1
+ import { n as SliderProps, t as Slider } from "../index-B5oUKlIo.js";
2
2
  export { Slider, Slider as default, SliderProps };
@@ -1,2 +1,2 @@
1
- import { n as SubmitButtonProps, t as SubmitButton } from "../index-CpVfOXNv.cjs";
1
+ import { n as SubmitButtonProps, t as SubmitButton } from "../index-ChtlWBjc.cjs";
2
2
  export { SubmitButton, SubmitButton as default, SubmitButtonProps };
@@ -1,2 +1,2 @@
1
- import { n as SubmitButtonProps, t as SubmitButton } from "../index-CVY05bZf.js";
1
+ import { n as SubmitButtonProps, t as SubmitButton } from "../index-BL0DnIzh.js";
2
2
  export { SubmitButton, SubmitButton as default, SubmitButtonProps };
@@ -1,2 +1,2 @@
1
- import { n as SwitchProps, t as Switch } from "../index-DYErnCVV.cjs";
1
+ import { n as SwitchProps, t as Switch } from "../index-BbWEFpRz.cjs";
2
2
  export { Switch, Switch as default, SwitchProps };
@@ -1,2 +1,2 @@
1
- import { n as SwitchProps, t as Switch } from "../index-Djc5tmi3.js";
1
+ import { n as SwitchProps, t as Switch } from "../index-CGnr_e53.js";
2
2
  export { Switch, Switch as default, SwitchProps };
@@ -1,2 +1,2 @@
1
- import { n as SwitchBoxProps, r as switchBoxVariants, t as SwitchBox } from "../index-DymdaDrj.cjs";
1
+ import { n as SwitchBoxProps, r as switchBoxVariants, t as SwitchBox } from "../index-Nrdyx_72.cjs";
2
2
  export { SwitchBox, SwitchBox as default, SwitchBoxProps, switchBoxVariants };
@@ -1,2 +1,2 @@
1
- import { n as SwitchBoxProps, r as switchBoxVariants, t as SwitchBox } from "../index-DS4AP9pV.js";
1
+ import { n as SwitchBoxProps, r as switchBoxVariants, t as SwitchBox } from "../index-DmMenZfj.js";
2
2
  export { SwitchBox, SwitchBox as default, SwitchBoxProps, switchBoxVariants };
@@ -1,2 +1,2 @@
1
- import { n as TextAreaProps, t as TextArea } from "../index-2SVlCM0Y.cjs";
1
+ import { n as TextAreaProps, t as TextArea } from "../index-D4S6YQwi.cjs";
2
2
  export { TextArea, TextArea as default, TextAreaProps };
@@ -1,2 +1,2 @@
1
- import { n as TextAreaProps, t as TextArea } from "../index-BDvr4eaz.js";
1
+ import { n as TextAreaProps, t as TextArea } from "../index-DJyRJr0I.js";
2
2
  export { TextArea, TextArea as default, TextAreaProps };
@@ -1,2 +1,2 @@
1
- import { n as useClientValidation, t as clientValidationSchemaByName } from "../../useClientValidation-DSMw7f-t.cjs";
1
+ import { n as useClientValidation, t as clientValidationSchemaByName } from "../../useClientValidation-DG1xPiN5.cjs";
2
2
  export { clientValidationSchemaByName, useClientValidation };
@@ -1,2 +1,2 @@
1
- import { n as useClientValidation, t as clientValidationSchemaByName } from "../../useClientValidation-Bv0yxTyV.js";
1
+ import { n as useClientValidation, t as clientValidationSchemaByName } from "../../useClientValidation-CeHOxxj1.js";
2
2
  export { clientValidationSchemaByName, useClientValidation };
@@ -1,2 +1,2 @@
1
- import { n as useFormContext, t as checkFieldIsRequired } from "../../useFormContext-oEivkWtB.cjs";
1
+ import { n as useFormContext, t as checkFieldIsRequired } from "../../useFormContext-B083Y-kw.cjs";
2
2
  export { checkFieldIsRequired, useFormContext };
@@ -1,4 +1,4 @@
1
1
  import "../../FormContext-C2_WMi_v.js";
2
- import { n as useFormContext, t as checkFieldIsRequired } from "../../useFormContext-DDx8LD8e.js";
2
+ import { n as useFormContext, t as checkFieldIsRequired } from "../../useFormContext-B2TS6xq0.js";
3
3
  import "../../index-BRLjimYW.js";
4
4
  export { checkFieldIsRequired, useFormContext };
@@ -1,2 +1,2 @@
1
- import { n as UseUniformFieldReturn, r as useUniformField, t as UseUniformFieldParams } from "../../useUniformField-DFXQO9dw.cjs";
1
+ import { n as UseUniformFieldReturn, r as useUniformField, t as UseUniformFieldParams } from "../../useUniformField-BlqMUaQk.cjs";
2
2
  export { UseUniformFieldParams, UseUniformFieldReturn, useUniformField };
@@ -1,6 +1,6 @@
1
1
  import "../../FormContext-C2_WMi_v.js";
2
2
  import "../../useController-Co8wbo-Y.js";
3
- import "../../useFormContext-DDx8LD8e.js";
3
+ import "../../useFormContext-B2TS6xq0.js";
4
4
  import "../../useInput-BCdeYOOg.js";
5
- import { n as UseUniformFieldReturn, r as useUniformField, t as UseUniformFieldParams } from "../../useUniformField-q3GCAV85.js";
5
+ import { n as UseUniformFieldReturn, r as useUniformField, t as UseUniformFieldParams } from "../../useUniformField-B-hszxep.js";
6
6
  export { UseUniformFieldParams, UseUniformFieldReturn, useUniformField };
@@ -1,2 +1,2 @@
1
- import { n as useUniformFieldArray, t as UseUniformFieldArrayProps } from "../../useUniformFieldArray-B3smveBW.cjs";
1
+ import { n as useUniformFieldArray, t as UseUniformFieldArrayProps } from "../../useUniformFieldArray-BMMpIjre.cjs";
2
2
  export { UseUniformFieldArrayProps, useUniformFieldArray };
@@ -1,27 +1,27 @@
1
- import "../../index-DubKudrE.js";
2
- import "../../index-CJ90vm9t.js";
3
- import "../../index-BuX42Bbd.js";
1
+ import "../../index-C6YO7fVN.js";
2
+ import "../../index-C-t8ET2t.js";
3
+ import "../../index-Ct6a8Dxz.js";
4
4
  import "../../FormContext-C2_WMi_v.js";
5
- import "../../index-aHcGnXHf.js";
6
- import "../../index-CCeHSmIe.js";
7
- import "../../index-D-ucmG60.js";
8
- import "../../index-FHPC_VE1.js";
9
- import "../../index-tIGuHSXb.js";
10
- import "../../index-noH6pESQ.js";
11
- import "../../index-CRYEKT3o.js";
12
- import "../../index-CdXOAPMb.js";
13
- import "../../index-CVY05bZf.js";
14
- import "../../index-Djc5tmi3.js";
15
- import "../../index-DS4AP9pV.js";
16
- import "../../index-BDvr4eaz.js";
17
- import "../../useClientValidation-Bv0yxTyV.js";
5
+ import "../../index-D4jPNNjM.js";
6
+ import "../../index-DzGaqagC.js";
7
+ import "../../index-BPupl-39.js";
8
+ import "../../index-WKgD5_vg.js";
9
+ import "../../index-CuACo6jI.js";
10
+ import "../../index-BXm2Nvuc.js";
11
+ import "../../index-D_VcH_gn.js";
12
+ import "../../index-B5oUKlIo.js";
13
+ import "../../index-BL0DnIzh.js";
14
+ import "../../index-CGnr_e53.js";
15
+ import "../../index-DmMenZfj.js";
16
+ import "../../index-DJyRJr0I.js";
17
+ import "../../useClientValidation-CeHOxxj1.js";
18
18
  import "../../useController-Co8wbo-Y.js";
19
- import "../../useFormContext-DDx8LD8e.js";
19
+ import "../../useFormContext-B2TS6xq0.js";
20
20
  import "../../index-BRLjimYW.js";
21
21
  import "../../useInput-BCdeYOOg.js";
22
- import "../../useUniformField-q3GCAV85.js";
23
- import "../../index-lot50R9R.js";
24
- import "../../index-CPcJGZVS.js";
22
+ import "../../useUniformField-B-hszxep.js";
23
+ import "../../index-CYfagyef.js";
24
+ import "../../index-CEB_3pH3.js";
25
25
  import "../../useWatchUserChange-JMU-vN92.js";
26
- import { n as useUniformFieldArray, t as UseUniformFieldArrayProps } from "../../useUniformFieldArray-CmACueEO.js";
26
+ import { n as useUniformFieldArray, t as UseUniformFieldArrayProps } from "../../useUniformFieldArray-KOP2kbMC.js";
27
27
  export { UseUniformFieldArrayProps, useUniformFieldArray };