@fuf-stack/uniform 0.14.3 → 0.14.5

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 (60) hide show
  1. package/dist/CheckboxGroup/index.cjs +2 -2
  2. package/dist/CheckboxGroup/index.d.cts +2 -2
  3. package/dist/CheckboxGroup/index.d.ts +2 -2
  4. package/dist/CheckboxGroup/index.js +1 -1
  5. package/dist/FieldArray/index.cjs +2 -2
  6. package/dist/FieldArray/index.d.cts +2 -2
  7. package/dist/FieldArray/index.d.ts +2 -2
  8. package/dist/FieldArray/index.js +1 -1
  9. package/dist/{FieldArray-CAVDQ51R.d.cts → FieldArray-DD9z-xZ3.d.cts} +3 -2
  10. package/dist/{FieldArray-CAVDQ51R.d.ts → FieldArray-DD9z-xZ3.d.ts} +3 -2
  11. package/dist/Input/index.cjs +2 -2
  12. package/dist/Input/index.js +1 -1
  13. package/dist/RadioGroup/index.d.cts +2 -2
  14. package/dist/RadioGroup/index.d.ts +2 -2
  15. package/dist/Select/index.d.cts +2 -2
  16. package/dist/Select/index.d.ts +2 -2
  17. package/dist/Switch/index.d.cts +2 -2
  18. package/dist/Switch/index.d.ts +2 -2
  19. package/dist/TextArea/index.cjs +2 -2
  20. package/dist/TextArea/index.js +1 -1
  21. package/dist/{chunk-XJGJ5ZNM.js → chunk-BYKOCVCK.js} +21 -9
  22. package/dist/chunk-BYKOCVCK.js.map +1 -0
  23. package/dist/{chunk-P3APABJJ.cjs → chunk-HOETR36J.cjs} +7 -6
  24. package/dist/chunk-HOETR36J.cjs.map +1 -0
  25. package/dist/{chunk-AQHKELUR.js → chunk-QCVTB2NI.js} +4 -3
  26. package/dist/chunk-QCVTB2NI.js.map +1 -0
  27. package/dist/{chunk-TR2J3OKH.js → chunk-QW44EUAH.js} +15 -8
  28. package/dist/chunk-QW44EUAH.js.map +1 -0
  29. package/dist/{chunk-U6VUNJZG.cjs → chunk-RBIX6EWU.cjs} +16 -9
  30. package/dist/chunk-RBIX6EWU.cjs.map +1 -0
  31. package/dist/{chunk-RY4F5YDS.cjs → chunk-XCZKNTFT.cjs} +21 -9
  32. package/dist/chunk-XCZKNTFT.cjs.map +1 -0
  33. package/dist/{chunk-25LLM544.cjs → chunk-Y3SFF6RN.cjs} +5 -4
  34. package/dist/chunk-Y3SFF6RN.cjs.map +1 -0
  35. package/dist/{chunk-EEOOSLP2.js → chunk-Y53IHK6B.js} +7 -6
  36. package/dist/chunk-Y53IHK6B.js.map +1 -0
  37. package/dist/hooks/index.d.cts +2 -2
  38. package/dist/hooks/index.d.ts +2 -2
  39. package/dist/index.cjs +8 -8
  40. package/dist/index.cjs.map +1 -1
  41. package/dist/index.d.cts +5 -5
  42. package/dist/index.d.ts +5 -5
  43. package/dist/index.js +7 -7
  44. package/package.json +7 -7
  45. package/dist/chunk-25LLM544.cjs.map +0 -1
  46. package/dist/chunk-AQHKELUR.js.map +0 -1
  47. package/dist/chunk-EEOOSLP2.js.map +0 -1
  48. package/dist/chunk-P3APABJJ.cjs.map +0 -1
  49. package/dist/chunk-RY4F5YDS.cjs.map +0 -1
  50. package/dist/chunk-TR2J3OKH.js.map +0 -1
  51. package/dist/chunk-U6VUNJZG.cjs.map +0 -1
  52. package/dist/chunk-XJGJ5ZNM.js.map +0 -1
  53. package/dist/{CheckboxGroup-DYxaS51b.d.cts → CheckboxGroup-o-qWkWe1.d.cts} +5 -5
  54. package/dist/{CheckboxGroup-DYxaS51b.d.ts → CheckboxGroup-o-qWkWe1.d.ts} +5 -5
  55. package/dist/{RadioGroup-DEwUwnRi.d.cts → RadioGroup-1J39ASHa.d.cts} +5 -5
  56. package/dist/{RadioGroup-DEwUwnRi.d.ts → RadioGroup-1J39ASHa.d.ts} +5 -5
  57. package/dist/{Select-Da_AtPOX.d.cts → Select-BhS4z0Pj.d.cts} +15 -15
  58. package/dist/{Select-Da_AtPOX.d.ts → Select-BhS4z0Pj.d.ts} +15 -15
  59. package/dist/{Switch-Coq_VhBW.d.cts → Switch-Fdldj8LV.d.cts} +5 -5
  60. package/dist/{Switch-Coq_VhBW.d.ts → Switch-Fdldj8LV.d.ts} +5 -5
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunkRY4F5YDScjs = require('../chunk-RY4F5YDS.cjs');
4
+ var _chunkXCZKNTFTcjs = require('../chunk-XCZKNTFT.cjs');
5
5
  require('../chunk-VQWKXSHW.cjs');
6
6
  require('../chunk-JU5RT22Y.cjs');
7
7
  require('../chunk-OHJYXA6R.cjs');
@@ -10,5 +10,5 @@ require('../chunk-BBB4FEY6.cjs');
10
10
 
11
11
 
12
12
 
13
- exports.CheckboxGroup = _chunkRY4F5YDScjs.CheckboxGroup_default; exports.default = _chunkRY4F5YDScjs.CheckboxGroup_default2;
13
+ exports.CheckboxGroup = _chunkXCZKNTFTcjs.CheckboxGroup_default; exports.default = _chunkXCZKNTFTcjs.CheckboxGroup_default2;
14
14
  //# sourceMappingURL=index.cjs.map
@@ -1,5 +1,5 @@
1
- import { C as CheckboxGroup } from '../CheckboxGroup-DYxaS51b.cjs';
2
- export { b as CheckboxGroupOption, a as CheckboxGroupProps } from '../CheckboxGroup-DYxaS51b.cjs';
1
+ import { C as CheckboxGroup } from '../CheckboxGroup-o-qWkWe1.cjs';
2
+ export { b as CheckboxGroupOption, a as CheckboxGroupProps } from '../CheckboxGroup-o-qWkWe1.cjs';
3
3
  import 'react/jsx-runtime';
4
4
  import 'tailwind-variants/dist/config.js';
5
5
  import 'tailwind-variants';
@@ -1,5 +1,5 @@
1
- import { C as CheckboxGroup } from '../CheckboxGroup-DYxaS51b.js';
2
- export { b as CheckboxGroupOption, a as CheckboxGroupProps } from '../CheckboxGroup-DYxaS51b.js';
1
+ import { C as CheckboxGroup } from '../CheckboxGroup-o-qWkWe1.js';
2
+ export { b as CheckboxGroupOption, a as CheckboxGroupProps } from '../CheckboxGroup-o-qWkWe1.js';
3
3
  import 'react/jsx-runtime';
4
4
  import 'tailwind-variants/dist/config.js';
5
5
  import 'tailwind-variants';
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  CheckboxGroup_default,
3
3
  CheckboxGroup_default2
4
- } from "../chunk-XJGJ5ZNM.js";
4
+ } from "../chunk-BYKOCVCK.js";
5
5
  import "../chunk-KOKIM2ND.js";
6
6
  import "../chunk-2CRY7VDQ.js";
7
7
  import "../chunk-WKM2D7LF.js";
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunkP3APABJJcjs = require('../chunk-P3APABJJ.cjs');
4
+ var _chunkHOETR36Jcjs = require('../chunk-HOETR36J.cjs');
5
5
  require('../chunk-JU5RT22Y.cjs');
6
6
  require('../chunk-OHJYXA6R.cjs');
7
7
  require('../chunk-XJWEUCV3.cjs');
@@ -9,5 +9,5 @@ require('../chunk-BBB4FEY6.cjs');
9
9
 
10
10
 
11
11
 
12
- exports.FieldArray = _chunkP3APABJJcjs.FieldArray_default; exports.default = _chunkP3APABJJcjs.FieldArray_default2;
12
+ exports.FieldArray = _chunkHOETR36Jcjs.FieldArray_default; exports.default = _chunkHOETR36Jcjs.FieldArray_default2;
13
13
  //# sourceMappingURL=index.cjs.map
@@ -1,5 +1,5 @@
1
- import { F as FieldArray } from '../FieldArray-CAVDQ51R.cjs';
2
- export { c as FieldArrayFieldChildren, b as FieldArrayHideOption, a as FieldArrayProps } from '../FieldArray-CAVDQ51R.cjs';
1
+ import { F as FieldArray } from '../FieldArray-DD9z-xZ3.cjs';
2
+ export { c as FieldArrayFieldChildren, b as FieldArrayHideOption, a as FieldArrayProps } from '../FieldArray-DD9z-xZ3.cjs';
3
3
  import 'react/jsx-runtime';
4
4
  import 'react';
5
5
  import 'react-hook-form';
@@ -1,5 +1,5 @@
1
- import { F as FieldArray } from '../FieldArray-CAVDQ51R.js';
2
- export { c as FieldArrayFieldChildren, b as FieldArrayHideOption, a as FieldArrayProps } from '../FieldArray-CAVDQ51R.js';
1
+ import { F as FieldArray } from '../FieldArray-DD9z-xZ3.js';
2
+ export { c as FieldArrayFieldChildren, b as FieldArrayHideOption, a as FieldArrayProps } from '../FieldArray-DD9z-xZ3.js';
3
3
  import 'react/jsx-runtime';
4
4
  import 'react';
5
5
  import 'react-hook-form';
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  FieldArray_default,
3
3
  FieldArray_default2
4
- } from "../chunk-EEOOSLP2.js";
4
+ } from "../chunk-Y53IHK6B.js";
5
5
  import "../chunk-2CRY7VDQ.js";
6
6
  import "../chunk-WKM2D7LF.js";
7
7
  import "../chunk-BZAPTLMC.js";
@@ -16,12 +16,13 @@ type MoveField = 'drag-drop' | 'button';
16
16
  interface FieldArrayProps {
17
17
  /** function that renders the children with provided Properties. */
18
18
  children: FieldArrayFieldChildren;
19
+ elementInitialValue?: unknown;
19
20
  /** Hide a set of buttons. */
20
21
  hideButtons?: FieldArrayHideOption[];
21
22
  /** label of the FieldArray. */
22
23
  label?: React.ReactNode;
23
24
  /** stops user from deleting all items. */
24
- lastNotDeletable?: boolean;
25
+ lastElementNotDeletable?: boolean;
25
26
  /** name the FieldArray is registered in RHF */
26
27
  name: string;
27
28
  /** ID for test purposes. */
@@ -31,6 +32,6 @@ interface FieldArrayProps {
31
32
  /**
32
33
  * FieldArray component using react-hook-form
33
34
  */
34
- declare const FieldArray: ({ children, hideButtons, label: _label, lastNotDeletable, name, testId: _testId, moveField, }: FieldArrayProps) => react_jsx_runtime.JSX.Element;
35
+ declare const FieldArray: ({ children, elementInitialValue, hideButtons, label: _label, lastElementNotDeletable, name, testId: _testId, moveField, }: FieldArrayProps) => react_jsx_runtime.JSX.Element;
35
36
 
36
37
  export { FieldArray as F, type FieldArrayProps as a, type FieldArrayHideOption as b, type FieldArrayFieldChildren as c };
@@ -16,12 +16,13 @@ type MoveField = 'drag-drop' | 'button';
16
16
  interface FieldArrayProps {
17
17
  /** function that renders the children with provided Properties. */
18
18
  children: FieldArrayFieldChildren;
19
+ elementInitialValue?: unknown;
19
20
  /** Hide a set of buttons. */
20
21
  hideButtons?: FieldArrayHideOption[];
21
22
  /** label of the FieldArray. */
22
23
  label?: React.ReactNode;
23
24
  /** stops user from deleting all items. */
24
- lastNotDeletable?: boolean;
25
+ lastElementNotDeletable?: boolean;
25
26
  /** name the FieldArray is registered in RHF */
26
27
  name: string;
27
28
  /** ID for test purposes. */
@@ -31,6 +32,6 @@ interface FieldArrayProps {
31
32
  /**
32
33
  * FieldArray component using react-hook-form
33
34
  */
34
- declare const FieldArray: ({ children, hideButtons, label: _label, lastNotDeletable, name, testId: _testId, moveField, }: FieldArrayProps) => react_jsx_runtime.JSX.Element;
35
+ declare const FieldArray: ({ children, elementInitialValue, hideButtons, label: _label, lastElementNotDeletable, name, testId: _testId, moveField, }: FieldArrayProps) => react_jsx_runtime.JSX.Element;
35
36
 
36
37
  export { FieldArray as F, type FieldArrayProps as a, type FieldArrayHideOption as b, type FieldArrayFieldChildren as c };
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunkU6VUNJZGcjs = require('../chunk-U6VUNJZG.cjs');
4
+ var _chunkRBIX6EWUcjs = require('../chunk-RBIX6EWU.cjs');
5
5
  require('../chunk-VQWKXSHW.cjs');
6
6
  require('../chunk-JU5RT22Y.cjs');
7
7
  require('../chunk-OHJYXA6R.cjs');
@@ -10,5 +10,5 @@ require('../chunk-BBB4FEY6.cjs');
10
10
 
11
11
 
12
12
 
13
- exports.Input = _chunkU6VUNJZGcjs.Input_default; exports.default = _chunkU6VUNJZGcjs.Input_default2;
13
+ exports.Input = _chunkRBIX6EWUcjs.Input_default; exports.default = _chunkRBIX6EWUcjs.Input_default2;
14
14
  //# sourceMappingURL=index.cjs.map
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  Input_default,
3
3
  Input_default2
4
- } from "../chunk-TR2J3OKH.js";
4
+ } from "../chunk-QW44EUAH.js";
5
5
  import "../chunk-KOKIM2ND.js";
6
6
  import "../chunk-2CRY7VDQ.js";
7
7
  import "../chunk-WKM2D7LF.js";
@@ -1,5 +1,5 @@
1
- import { R as RadioGroup } from '../RadioGroup-DEwUwnRi.cjs';
2
- export { a as RadioGroupProps } from '../RadioGroup-DEwUwnRi.cjs';
1
+ import { R as RadioGroup } from '../RadioGroup-1J39ASHa.cjs';
2
+ export { a as RadioGroupProps } from '../RadioGroup-1J39ASHa.cjs';
3
3
  import 'tailwind-variants/dist/config.js';
4
4
  import 'tailwind-variants';
5
5
  import '@fuf-stack/pixel-utils';
@@ -1,5 +1,5 @@
1
- import { R as RadioGroup } from '../RadioGroup-DEwUwnRi.js';
2
- export { a as RadioGroupProps } from '../RadioGroup-DEwUwnRi.js';
1
+ import { R as RadioGroup } from '../RadioGroup-1J39ASHa.js';
2
+ export { a as RadioGroupProps } from '../RadioGroup-1J39ASHa.js';
3
3
  import 'tailwind-variants/dist/config.js';
4
4
  import 'tailwind-variants';
5
5
  import '@fuf-stack/pixel-utils';
@@ -1,5 +1,5 @@
1
- import { S as Select } from '../Select-Da_AtPOX.cjs';
2
- export { a as SelectProps } from '../Select-Da_AtPOX.cjs';
1
+ import { S as Select } from '../Select-BhS4z0Pj.cjs';
2
+ export { a as SelectProps } from '../Select-BhS4z0Pj.cjs';
3
3
  import 'react/jsx-runtime';
4
4
  import 'tailwind-variants/dist/config.js';
5
5
  import 'tailwind-variants';
@@ -1,5 +1,5 @@
1
- import { S as Select } from '../Select-Da_AtPOX.js';
2
- export { a as SelectProps } from '../Select-Da_AtPOX.js';
1
+ import { S as Select } from '../Select-BhS4z0Pj.js';
2
+ export { a as SelectProps } from '../Select-BhS4z0Pj.js';
3
3
  import 'react/jsx-runtime';
4
4
  import 'tailwind-variants/dist/config.js';
5
5
  import 'tailwind-variants';
@@ -1,5 +1,5 @@
1
- import { S as Switch } from '../Switch-Coq_VhBW.cjs';
2
- export { a as SwitchProps } from '../Switch-Coq_VhBW.cjs';
1
+ import { S as Switch } from '../Switch-Fdldj8LV.cjs';
2
+ export { a as SwitchProps } from '../Switch-Fdldj8LV.cjs';
3
3
  import 'react/jsx-runtime';
4
4
  import 'tailwind-variants/dist/config.js';
5
5
  import 'tailwind-variants';
@@ -1,5 +1,5 @@
1
- import { S as Switch } from '../Switch-Coq_VhBW.js';
2
- export { a as SwitchProps } from '../Switch-Coq_VhBW.js';
1
+ import { S as Switch } from '../Switch-Fdldj8LV.js';
2
+ export { a as SwitchProps } from '../Switch-Fdldj8LV.js';
3
3
  import 'react/jsx-runtime';
4
4
  import 'tailwind-variants/dist/config.js';
5
5
  import 'tailwind-variants';
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunk25LLM544cjs = require('../chunk-25LLM544.cjs');
4
+ var _chunkY3SFF6RNcjs = require('../chunk-Y3SFF6RN.cjs');
5
5
  require('../chunk-VQWKXSHW.cjs');
6
6
  require('../chunk-JU5RT22Y.cjs');
7
7
  require('../chunk-OHJYXA6R.cjs');
@@ -10,5 +10,5 @@ require('../chunk-BBB4FEY6.cjs');
10
10
 
11
11
 
12
12
 
13
- exports.TextArea = _chunk25LLM544cjs.TextArea_default; exports.default = _chunk25LLM544cjs.TextArea_default2;
13
+ exports.TextArea = _chunkY3SFF6RNcjs.TextArea_default; exports.default = _chunkY3SFF6RNcjs.TextArea_default2;
14
14
  //# sourceMappingURL=index.cjs.map
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  TextArea_default,
3
3
  TextArea_default2
4
- } from "../chunk-AQHKELUR.js";
4
+ } from "../chunk-QCVTB2NI.js";
5
5
  import "../chunk-KOKIM2ND.js";
6
6
  import "../chunk-2CRY7VDQ.js";
7
7
  import "../chunk-WKM2D7LF.js";
@@ -66,7 +66,25 @@ var CheckboxGroup = ({
66
66
  control,
67
67
  name,
68
68
  disabled,
69
- render: ({ field: { onChange, value, ref, onBlur } }) => {
69
+ render: ({ field: { onChange, value = [], ref, onBlur } }) => {
70
+ const getCheckboxValue = (inputValue) => {
71
+ if (Array.isArray(inputValue)) {
72
+ return inputValue;
73
+ }
74
+ if (inputValue) {
75
+ return [inputValue];
76
+ }
77
+ return [];
78
+ };
79
+ const singleCheckboxProps = {
80
+ value: getCheckboxValue(value),
81
+ onChange: (newValue) => onChange(newValue && newValue[0])
82
+ };
83
+ const multipleCheckboxProps = {
84
+ onChange,
85
+ value: getCheckboxValue(value)
86
+ };
87
+ const checkboxGroupProps = options.length === 1 ? singleCheckboxProps : multipleCheckboxProps;
70
88
  return /* @__PURE__ */ jsx(
71
89
  NextCheckboxGroup,
72
90
  {
@@ -89,15 +107,9 @@ var CheckboxGroup = ({
89
107
  label,
90
108
  showTestIdCopyButton && /* @__PURE__ */ jsx(FieldCopyTestIdButton_default, { testId })
91
109
  ] }),
92
- ...options.length === 1 ? {
93
- value: [value].filter((v) => v !== void 0),
94
- onChange: (newValue) => onChange(newValue && newValue[0])
95
- } : {
96
- onChange,
97
- value
98
- },
99
110
  onBlur,
100
111
  ref,
112
+ ...checkboxGroupProps,
101
113
  children: options?.map((option) => {
102
114
  return /* @__PURE__ */ jsx(
103
115
  Checkbox,
@@ -129,4 +141,4 @@ export {
129
141
  CheckboxGroup_default,
130
142
  CheckboxGroup_default2
131
143
  };
132
- //# sourceMappingURL=chunk-XJGJ5ZNM.js.map
144
+ //# sourceMappingURL=chunk-BYKOCVCK.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/CheckboxGroup/CheckboxGroup.tsx","../src/CheckboxGroup/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\n\nimport {\n Checkbox,\n CheckboxGroup as NextCheckboxGroup,\n} from '@nextui-org/checkbox';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from '../Controller';\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const checkboxGroupVariants = tv({\n slots: {\n base: 'group', // Needs group for group-data condition\n errorMessage: 'text-tiny',\n itemBase: '',\n itemIcon: '',\n itemLabel: 'text-sm',\n itemWrapper: '',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof checkboxGroupVariants>;\ntype ClassName = TVClassName<typeof checkboxGroupVariants>;\n\nexport type CheckboxGroupOption = {\n /** option label */\n label?: React.ReactNode;\n /** option value */\n value: string;\n /** disables the option */\n disabled?: boolean;\n /** HTML data-testid attribute of the option */\n testId?: string;\n};\n\nexport interface CheckboxGroupProps extends VariantProps {\n /** CSS class name. ClassName: string | { buttons?: string | { base?: string; active?: string }; base?: string;} */\n className?: ClassName;\n /** label displayed above the Checkboxes */\n label?: React.ReactNode;\n /** Name the Field is registered on the form. */\n name: string;\n /** Checkboxes that should be displayed. */\n options: CheckboxGroupOption[];\n /** sets all buttons disabled */\n disabled?: boolean;\n /** id for internal testing. */\n testId?: string;\n}\n\n/**\n * CheckboxGroup component based on [NextUI CheckboxGroup](https://nextui.org/docs/components/checkbox-group)\n */\nconst CheckboxGroup = ({\n className = undefined,\n label = undefined,\n options,\n disabled = false,\n name,\n testId: _testId = undefined,\n}: CheckboxGroupProps) => {\n const { control, debugMode, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label || showTestIdCopyButton;\n\n const variants = checkboxGroupVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const itemClassName = {\n base: classNames.itemBase,\n wrapper: classNames.itemWrapper,\n icon: classNames.itemIcon,\n label: classNames.itemLabel,\n };\n const itemGroupClassName = {\n base: classNames.base,\n wrapper: classNames.wrapper,\n label: classNames.label,\n };\n\n return (\n <Controller\n control={control}\n name={name}\n disabled={disabled}\n render={({ field: { onChange, value = [], ref, onBlur } }) => {\n /**\n * Handles the checkbox group value changes based on the number of options:\n * 1. For single checkbox (options.length === 1):\n * - Converts undefined/empty array to [] for consistent controlled behavior\n * - Extracts single value from array for onChange\n *\n * Example: undefined → []\n * [value] → value\n *\n * 2. For multiple checkboxes:\n * - Uses raw value array with fallback to empty array\n * - Passes through onChange directly\n *\n * Example: undefined → []\n * ['value1', 'value2'] → ['value1', 'value2']\n */\n const getCheckboxValue = (inputValue: unknown): string[] => {\n if (Array.isArray(inputValue)) {\n return inputValue;\n }\n if (inputValue) {\n return [inputValue as string];\n }\n return [];\n };\n\n const singleCheckboxProps = {\n value: getCheckboxValue(value),\n onChange: (newValue: string[]) => onChange(newValue && newValue[0]),\n };\n\n const multipleCheckboxProps = {\n onChange,\n value: getCheckboxValue(value),\n };\n\n const checkboxGroupProps =\n options.length === 1 ? singleCheckboxProps : multipleCheckboxProps;\n\n return (\n <NextCheckboxGroup\n name={name}\n classNames={itemGroupClassName}\n data-testid={testId}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n errorMessage={\n error && (\n <FieldValidationError\n error={error}\n className={classNames.errorMessage}\n />\n )\n }\n isDisabled={disabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n showLabel && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label>\n {label}\n {showTestIdCopyButton && (\n <FieldCopyTestIdButton testId={testId} />\n )}\n </label>\n )\n }\n onBlur={onBlur}\n ref={ref}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...checkboxGroupProps}\n >\n {options?.map((option) => {\n return (\n <Checkbox\n data-invalid={invalid}\n classNames={itemClassName}\n key={`index_${option.value}`}\n isDisabled={disabled || option.disabled}\n value={option?.value}\n data-testid={slugify(\n `${testId}_option_${option?.testId || option?.value}`,\n )}\n >\n {option?.label}\n </Checkbox>\n );\n })}\n </NextCheckboxGroup>\n );\n }}\n />\n );\n};\n\nexport default CheckboxGroup;\n","import CheckboxGroup from './CheckboxGroup';\n\nexport type { CheckboxGroupProps, CheckboxGroupOption } from './CheckboxGroup';\n\nexport { CheckboxGroup };\n\nexport default CheckboxGroup;\n"],"mappings":"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","names":["CheckboxGroup_default"]}
@@ -166,9 +166,10 @@ var FieldArrayField_default = FieldArrayField;
166
166
 
167
167
  var FieldArray = ({
168
168
  children,
169
+ elementInitialValue = void 0,
169
170
  hideButtons = [],
170
171
  label: _label = void 0,
171
- lastNotDeletable = true,
172
+ lastElementNotDeletable = true,
172
173
  name,
173
174
  testId: _testId = void 0,
174
175
  moveField = ["button"]
@@ -195,8 +196,8 @@ var FieldArray = ({
195
196
  placeholder: " ",
196
197
  classNames: { helperWrapper: "block" }
197
198
  });
198
- if (lastNotDeletable && fields.length === 0) {
199
- append(void 0);
199
+ if (lastElementNotDeletable && fields.length === 0) {
200
+ append(elementInitialValue);
200
201
  }
201
202
  const sensors = _core.useSensors.call(void 0,
202
203
  _core.useSensor.call(void 0, _core.PointerSensor),
@@ -250,7 +251,7 @@ var FieldArray = ({
250
251
  id: field.id,
251
252
  index,
252
253
  insert,
253
- lastNotDeletable,
254
+ lastNotDeletable: lastElementNotDeletable,
254
255
  move,
255
256
  moveField,
256
257
  name,
@@ -274,7 +275,7 @@ var FieldArray = ({
274
275
  {
275
276
  testId: `${testId}_append`,
276
277
  size: "sm",
277
- onClick: () => append(void 0),
278
+ onClick: () => append(elementInitialValue),
278
279
  children: "Add"
279
280
  }
280
281
  ),
@@ -295,4 +296,4 @@ var FieldArray_default2 = FieldArray_default;
295
296
 
296
297
 
297
298
  exports.FieldArray_default = FieldArray_default; exports.FieldArray_default2 = FieldArray_default2;
298
- //# sourceMappingURL=chunk-P3APABJJ.cjs.map
299
+ //# sourceMappingURL=chunk-HOETR36J.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-HOETR36J.cjs","../src/FieldArray/FieldArray.tsx","../src/FieldArray/FieldArrayField.tsx","../src/FieldArray/index.ts"],"names":["jsx","Button"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-HOETR36J.cjs","sourcesContent":[null,"import type { DragEndEvent } from '@dnd-kit/core';\nimport type { JSX } from 'react';\nimport type {\n FieldValues,\n UseFieldArrayInsert,\n UseFieldArrayMove,\n UseFieldArrayRemove,\n} from 'react-hook-form';\n\nimport {\n closestCenter,\n DndContext,\n KeyboardSensor,\n PointerSensor,\n useSensor,\n useSensors,\n} from '@dnd-kit/core';\nimport {\n restrictToVerticalAxis,\n restrictToWindowEdges,\n} from '@dnd-kit/modifiers';\nimport {\n SortableContext,\n verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\nimport { useInput } from '@nextui-org/input';\n\nimport { Button } from '@fuf-stack/pixels';\n\nimport { useFieldArray, useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\nimport FieldArrayField from './FieldArrayField';\n\nexport type FieldArrayHideOption = 'add' | 'remove' | 'move' | 'insert' | 'all';\nexport type FieldArrayFieldChildren = (args: {\n duplicate: (i: number) => void;\n index: number;\n insert: UseFieldArrayInsert<FieldValues, string>;\n length: number;\n move: UseFieldArrayMove;\n name: string;\n remove: UseFieldArrayRemove;\n}) => JSX.Element;\n\nexport type MoveField = 'drag-drop' | 'button';\n\nexport interface FieldArrayProps {\n /** function that renders the children with provided Properties. */\n children: FieldArrayFieldChildren;\n /* The initial value of a filed that is created in the array */\n elementInitialValue?: unknown;\n /** Hide a set of buttons. */\n hideButtons?: FieldArrayHideOption[];\n /** label of the FieldArray. */\n label?: React.ReactNode;\n /** stops user from deleting all items. */\n lastElementNotDeletable?: boolean;\n /** name the FieldArray is registered in RHF */\n name: string;\n /** ID for test purposes. */\n testId?: string;\n /* how the fields can be moved */\n moveField?: MoveField[];\n}\n\n/**\n * FieldArray component using react-hook-form\n */\nconst FieldArray = ({\n children,\n elementInitialValue = undefined,\n hideButtons = [],\n label: _label = undefined,\n lastElementNotDeletable = true,\n name,\n testId: _testId = undefined,\n moveField = ['button'],\n}: FieldArrayProps) => {\n const {\n control,\n debugMode,\n getValues,\n getFieldState,\n trigger,\n // watch\n } = useFormContext();\n\n const { fields, append, remove, insert, move } = useFieldArray({\n control,\n name,\n });\n\n const { error, testId, invalid, required } = getFieldState(name, _testId);\n\n // TODO: what about input props?\n const { label, getLabelProps, getHelperWrapperProps, getErrorMessageProps } =\n useInput({\n isInvalid: invalid,\n isRequired: required,\n errorMessage: JSON.stringify(error),\n label: _label,\n labelPlacement: 'inside',\n placeholder: ' ',\n classNames: { helperWrapper: 'block' },\n });\n\n if (lastElementNotDeletable && fields.length === 0) {\n append(elementInitialValue); // TODO: Check if this breaks something\n }\n\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor),\n );\n\n const handleDragEnd = (event: DragEndEvent) => {\n const { active, over } = event;\n\n if (active.id !== over?.id) {\n const oldIndex = fields.findIndex((field) => field.id === active.id);\n const newIndex = fields.findIndex((field) => field.id === over?.id);\n move(oldIndex, newIndex);\n }\n };\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label || showTestIdCopyButton;\n\n return (\n <DndContext\n sensors={sensors}\n collisionDetection={closestCenter}\n onDragEnd={handleDragEnd}\n modifiers={[restrictToVerticalAxis, restrictToWindowEdges]}\n >\n <SortableContext\n items={fields.map((field) => field.id)}\n strategy={verticalListSortingStrategy}\n >\n <ul data-testid={testId} onBlur={() => trigger(`${name}`)}>\n {showLabel && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...getLabelProps()}\n className={`${getLabelProps().className} !pointer-events-auto !static !z-0 -mb-1 ml-1 !inline-block`}\n >\n {label}\n </label>\n )}\n {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n\n {fields.map((field, index) => {\n const duplicate = (i: number) => {\n const values = getValues(name);\n insert(i + 1, { ...values[i], id: null });\n };\n\n return (\n <FieldArrayField\n className=\"mb-3 mt-5 flex flex-row items-center\"\n field={field}\n fields={fields}\n hideButtons={hideButtons}\n id={field.id}\n index={index}\n insert={insert}\n key={field.id}\n lastNotDeletable={lastElementNotDeletable}\n move={move}\n moveField={moveField}\n name={name}\n remove={remove}\n testId={`${testId}_${index}`}\n >\n {children({\n duplicate,\n index,\n insert,\n length: fields.length,\n move,\n name: `${name}.${index}`,\n remove,\n })}\n </FieldArrayField>\n );\n })}\n\n {!hideButtons.includes('add') && !hideButtons.includes('all') && (\n <Button\n testId={`${testId}_append`}\n size=\"sm\"\n onClick={() => append(elementInitialValue)} // TODO: Check if this breaks something\n >\n Add\n </Button>\n )}\n {/* @ts-expect-error rhf incompatibility */}\n {error?._errors && (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <div {...getHelperWrapperProps()}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <div {...getErrorMessageProps()}>\n {/* @ts-expect-error rhf incompatibility */}\n <FieldValidationError error={error?._errors} />\n </div>\n </div>\n )}\n </ul>\n </SortableContext>\n </DndContext>\n );\n};\n\nexport default FieldArray;\n","import type {\n FieldValues,\n UseFieldArrayInsert,\n UseFieldArrayMove,\n UseFieldArrayRemove,\n} from 'react-hook-form';\nimport type { FieldArrayHideOption, MoveField } from './FieldArray';\n\n// import { useEffect } from 'react';\nimport { FaAngleDown, FaAngleUp, FaGripLines } from 'react-icons/fa';\n\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { useInput } from '@nextui-org/input';\n\nimport { Button } from '@fuf-stack/pixels';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\ninterface FieldArrayFieldProps {\n children: React.ReactNode;\n className?: string;\n field: Record<'id', string>;\n fields: Record<'id', string>[];\n hideButtons?: FieldArrayHideOption[];\n id: string | number;\n index: number;\n insert: UseFieldArrayInsert<FieldValues, string>;\n lastNotDeletable?: boolean;\n move: UseFieldArrayMove;\n moveField: MoveField[];\n testId?: string;\n name: string;\n remove: UseFieldArrayRemove;\n}\n\n/**\n * FieldArrayField component using react-hook-form\n */\nconst FieldArrayField = ({\n children,\n className = undefined,\n field,\n fields,\n hideButtons = [],\n id,\n index,\n insert,\n lastNotDeletable = true,\n move,\n moveField,\n name,\n remove,\n testId = undefined,\n}: FieldArrayFieldProps) => {\n const { attributes, listeners, setNodeRef, transform, transition } =\n useSortable({ id });\n\n const style = {\n transform: CSS.Translate.toString(transform),\n transition,\n };\n\n const { getFieldState, trigger } = useFormContext();\n const { error, invalid } = getFieldState(`${name}`, undefined);\n\n // TODO: what about input props? and label props? Do we need a label?\n const { getHelperWrapperProps, getErrorMessageProps } = useInput({\n isInvalid: invalid,\n errorMessage: JSON.stringify(error),\n labelPlacement: 'inside',\n placeholder: ' ',\n classNames: { helperWrapper: 'block' },\n });\n\n return (\n <>\n <li\n ref={setNodeRef}\n style={style}\n className={className}\n onBlur={() => trigger(`${name}.${index}`)}\n >\n {/** Start Button up/down */}\n {!hideButtons.includes('move') && !hideButtons.includes('all') && (\n <div className=\"mr-6 flex flex-row items-center\">\n {moveField.includes('drag-drop') && (\n <div\n className=\"mr-2 text-base text-xl\"\n data-testid={slugify(`${name}_${index}_movebutton`)}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...attributes}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...listeners}\n >\n <FaGripLines />\n </div>\n )}\n {moveField.includes('button') && (\n <div className=\"flex flex-col\">\n <Button\n testId={`${name}.${index}.up`}\n disabled={index === 0}\n onClick={() => move(index, index - 1)}\n className=\"flex rounded-b-none rounded-t-md border border-gray-300 px-2 py-2 shadow-sm\"\n >\n <FaAngleUp />\n </Button>\n <Button\n testId={`${name}.${index}.down`}\n disabled={index === fields.length - 1}\n onClick={() => move(index, index + 1)}\n className=\"flex rounded-b-md rounded-t-none border border-gray-300 px-2 py-2 shadow-sm\"\n >\n <FaAngleDown />\n </Button>\n </div>\n )}\n </div>\n )}\n {/** End Button up/down */}\n <div key={`rest-${field.id}`} className=\"w-full\">\n <div className=\"mb-2 flex items-center\">\n {/** RENDER CHILDREN */}\n <div className=\"flex-grow\" data-testid={testId}>\n {children}\n </div>\n {!hideButtons.includes('remove') &&\n !hideButtons.includes('all') &&\n (lastNotDeletable && fields.length === 1 ? null : (\n <Button onClick={() => remove(index)} className=\"ml-1\">\n <svg\n className=\"h-4 w-4\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path\n fillRule=\"evenodd\"\n d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n clipRule=\"evenodd\"\n />\n </svg>\n </Button>\n ))}\n </div>\n\n {!hideButtons.includes('insert') &&\n !hideButtons.includes('all') &&\n index !== fields.length - 1 ? (\n <Button\n className=\"text-xs font-medium\"\n testId={`add-harbor-button-${index}`}\n onClick={() => {\n insert(index + 1, {});\n }}\n >\n insert\n </Button>\n ) : null}\n </div>\n </li>\n {error && typeof error[index] !== 'undefined' && (\n // // @ts-expect-error rhf incompatibility\n // error[Number(index)]?._errors && ( // TODO: was String(). Check if Number is correct. (same below in FieldValidationError)\n // eslint-disable-next-line react/jsx-props-no-spreading\n <div {...getHelperWrapperProps()}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <div {...getErrorMessageProps()}>\n <FieldValidationError\n /* @ts-expect-error rhf incompatibility */\n error={error[Number(index)]?._errors}\n />\n </div>\n </div>\n )}\n </>\n );\n};\nexport default FieldArrayField;\n","import FieldArray from './FieldArray';\n\nexport type {\n FieldArrayProps,\n FieldArrayHideOption,\n FieldArrayFieldChildren,\n} from './FieldArray';\n\nexport { FieldArray };\n\nexport default FieldArray;\n"]}
@@ -35,8 +35,9 @@ var TextArea = ({
35
35
  name,
36
36
  disabled,
37
37
  render: ({
38
- field: { disabled: isDisabled, onChange, onBlur, value, ref }
38
+ field: { disabled: isDisabled, onChange, onBlur, value = "", ref }
39
39
  }) => {
40
+ const displayValue = value?.toString() ?? "";
40
41
  return /* @__PURE__ */ jsx(
41
42
  NextTextArea,
42
43
  {
@@ -56,7 +57,7 @@ var TextArea = ({
56
57
  labelPlacement: "outside",
57
58
  placeholder,
58
59
  name,
59
- value,
60
+ value: displayValue,
60
61
  onChange,
61
62
  onBlur,
62
63
  ref,
@@ -77,4 +78,4 @@ export {
77
78
  TextArea_default,
78
79
  TextArea_default2
79
80
  };
80
- //# sourceMappingURL=chunk-AQHKELUR.js.map
81
+ //# sourceMappingURL=chunk-QCVTB2NI.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/TextArea/TextArea.tsx","../src/TextArea/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Textarea as NextTextArea } from '@nextui-org/input';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from '../Controller';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport interface TextAreaProps {\n /** Child components. The content of the textarea. */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** Determines if the TextArea is disabled or not. */\n disabled?: boolean;\n /** Label displayed above the TextArea. */\n label?: ReactNode;\n /** Name the TextArea is registered at in HTML forms (react-hook-form). */\n name: string;\n /** placeholder for the textArea content. */\n placeholder?: string;\n /** Id to grab element in internal tests. */\n testId?: string;\n}\n\n/**\n * TextArea component based on [NextUI TextArea](https://nextui.org/docs/components/textarea)\n */\nconst TextArea = ({\n children = null,\n className = undefined,\n disabled = false,\n label = undefined,\n name,\n placeholder = ' ',\n testId: _testId = undefined,\n}: TextAreaProps) => {\n const { control, debugMode, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label || showTestIdCopyButton;\n\n return (\n <Controller\n control={control}\n name={name}\n disabled={disabled}\n render={({\n field: { disabled: isDisabled, onChange, onBlur, value = '', ref },\n }) => {\n /**\n * Ensures the textarea always has a defined string value to prevent uncontrolled to\n * controlled component warnings:\n *\n * 1. Warning Prevention:\n * - Sets default value to '' in field destructuring\n * - Guarantees the value prop is never undefined/null\n * - Prevents React warning: \"A component is changing from uncontrolled to controlled\"\n *\n * 2. Value Handling:\n * - Converts undefined/null to empty string\n * - Converts non-string values to strings\n * - Maintains existing string values\n *\n * Examples:\n * - undefined → \"\" (prevents uncontrolled warning)\n * - null → \"\" (prevents uncontrolled warning)\n * - \"hello\" → \"hello\" (maintains string value)\n * - 123 → \"123\" (converts to string)\n *\n * Without this handling, the textarea could switch between controlled/uncontrolled\n * states when the form value changes from undefined to defined, causing React warnings\n * and potential rendering issues.\n */\n const displayValue = value?.toString() ?? '';\n\n return (\n <NextTextArea\n className={cn(className)}\n classNames={{\n inputWrapper: 'group-data-[focus=true]:border-focus',\n }}\n data-testid={testId}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isRequired={required}\n isInvalid={invalid}\n label={\n showLabel && (\n <>\n {label}\n {showTestIdCopyButton && (\n <FieldCopyTestIdButton testId={testId} />\n )}\n </>\n )\n }\n labelPlacement=\"outside\"\n placeholder={placeholder}\n name={name}\n value={displayValue}\n onChange={onChange}\n onBlur={onBlur}\n ref={ref}\n variant=\"bordered\"\n >\n {children}\n </NextTextArea>\n );\n }}\n />\n );\n};\n\nexport default TextArea;\n","import TextArea from './TextArea';\n\nexport type { TextAreaProps } from './TextArea';\n\nexport { TextArea };\n\nexport default TextArea;\n"],"mappings":";;;;;;;;;;;;;;AAEA,SAAS,YAAY,oBAAoB;AAEzC,SAAS,UAAU;AAmFgB,SAMnB,UANmB,KAMnB,YANmB;AAxDnC,IAAM,WAAW,CAAC;AAAA,EAChB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,QAAQ;AAAA,EACR;AAAA,EACA,cAAc;AAAA,EACd,QAAQ,UAAU;AACpB,MAAqB;AACnB,QAAM,EAAE,SAAS,WAAW,cAAc,IAAI,eAAe;AAC7D,QAAM,EAAE,OAAO,SAAS,UAAU,OAAO,IAAI,cAAc,MAAM,OAAO;AAExE,QAAM,uBAAuB,cAAc;AAC3C,QAAM,YAAY,SAAS;AAE3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,CAAC;AAAA,QACP,OAAO,EAAE,UAAU,YAAY,UAAU,QAAQ,QAAQ,IAAI,IAAI;AAAA,MACnE,MAAM;AAyBJ,cAAM,eAAe,OAAO,SAAS,KAAK;AAE1C,eACE;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,GAAG,SAAS;AAAA,YACvB,YAAY;AAAA,cACV,cAAc;AAAA,YAChB;AAAA,YACA,eAAa;AAAA,YACb,cAAc,SAAS,oBAAC,gCAAqB,OAAc;AAAA,YAC3D;AAAA,YACA,YAAY;AAAA,YACZ,WAAW;AAAA,YACX,OACE,aACE,iCACG;AAAA;AAAA,cACA,wBACC,oBAAC,iCAAsB,QAAgB;AAAA,eAE3C;AAAA,YAGJ,gBAAe;AAAA,YACf;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAQ;AAAA,YAEP;AAAA;AAAA,QACH;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,mBAAQ;;;AChHf,IAAOA,oBAAQ;","names":["TextArea_default"]}
@@ -38,8 +38,19 @@ var Input = ({
38
38
  disabled,
39
39
  name,
40
40
  render: ({
41
- field: { disabled: isDisabled, onChange, onBlur, value, ref }
41
+ field: { disabled: isDisabled, onChange, onBlur, value = "", ref }
42
42
  }) => {
43
+ const displayValue = transformValue?.displayValue ? transformValue.displayValue(value ?? "") : value ?? "";
44
+ const handleChange = (e) => {
45
+ const inputValue = e.target.value;
46
+ if (type === "number") {
47
+ onChange(inputValue === "" ? "" : Number(inputValue));
48
+ } else {
49
+ onChange(
50
+ transformValue?.formValue ? transformValue.formValue(inputValue) : inputValue
51
+ );
52
+ }
53
+ };
43
54
  return /* @__PURE__ */ jsx(
44
55
  NextInput,
45
56
  {
@@ -60,17 +71,13 @@ var Input = ({
60
71
  labelPlacement: "outside",
61
72
  name,
62
73
  onBlur,
63
- onChange: type === "number" ? (e) => {
64
- onChange(Number(e.target.value));
65
- } : (e) => onChange(
66
- transformValue && transformValue.formValue ? transformValue.formValue(e.target.value) : e.target.value
67
- ),
74
+ onChange: handleChange,
68
75
  placeholder,
69
76
  radius: "sm",
70
77
  ref,
71
78
  startContent,
72
79
  type,
73
- value: transformValue && transformValue.displayValue ? transformValue.displayValue(value) : value,
80
+ value: displayValue,
74
81
  variant: "bordered"
75
82
  }
76
83
  );
@@ -87,4 +94,4 @@ export {
87
94
  Input_default,
88
95
  Input_default2
89
96
  };
90
- //# sourceMappingURL=chunk-TR2J3OKH.js.map
97
+ //# sourceMappingURL=chunk-QW44EUAH.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Input/Input.tsx","../src/Input/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Input as NextInput } from '@nextui-org/input';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from '../Controller';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport interface InputProps {\n /** CSS class name */\n className?: string;\n /** input field is disabled */\n disabled?: boolean;\n /** added content to the end of the input Field. */\n endContent?: ReactNode;\n /** form field label (set to false to disable label) */\n label?: string | false;\n /** form field name */\n name: string;\n /** form field placeholder */\n placeholder?: string;\n /** content added to the start of the input field */\n startContent?: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** allows disentangled display and form values for a field */\n transformValue?: {\n /** transforms the formValue of the field to the display value of the field */\n displayValue: (value: string | number) => string | number;\n /** transforms the displayValue of the field to the form value of the field */\n formValue: (value: string) => string | number;\n };\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [NextUI Input](https://nextui.org/docs/components/input)\n */\nconst Input = ({\n className = undefined,\n disabled = false,\n endContent = undefined,\n label = undefined,\n name,\n placeholder = ' ',\n startContent = undefined,\n testId: _testId = undefined,\n transformValue = undefined,\n type = undefined,\n}: InputProps) => {\n const { control, debugMode, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label || showTestIdCopyButton;\n\n return (\n <Controller\n control={control}\n disabled={disabled}\n name={name}\n render={({\n field: { disabled: isDisabled, onChange, onBlur, value = '', ref },\n }) => {\n /**\n * Determines the display value for the input field:\n * 1. If transformValue.displayValue is provided, applies the transform to the current value\n * (useful for formatting like adding currency symbols, date formatting, etc.)\n * 2. Falls back to the raw value if no transform is provided\n * 3. Ensures a defined value by using empty string as fallback (prevents uncontrolled input warnings)\n *\n * Examples:\n * - With transform: value \"1000\" → displayValue \"$1,000\"\n * - Without transform: value \"1000\" → displayValue \"1000\"\n * - Undefined value: value undefined → displayValue \"\"\n */\n const displayValue = transformValue?.displayValue\n ? transformValue.displayValue(value ?? '')\n : (value ?? '');\n\n /**\n * Handles input value changes with special processing:\n * 1. For number inputs:\n * - Preserves empty string (prevents NaN in the form state)\n * - Converts non-empty values to numbers\n * Example: \"\" → \"\" (empty stays empty)\n * \"42\" → 42 (converts to number)\n *\n * 2. For text inputs with transformValue.formValue:\n * - Applies custom transform before updating form state\n * - Useful for converting display format to storage format\n * Example: \"$1,000\" → \"1000\" (strips formatting)\n *\n * 3. For regular text inputs:\n * - Passes through the raw input value\n * Example: \"hello\" → \"hello\" (no transformation)\n *\n * @param e The input change event\n */\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const inputValue = e.target.value;\n if (type === 'number') {\n onChange(inputValue === '' ? '' : Number(inputValue));\n } else {\n onChange(\n transformValue?.formValue\n ? transformValue.formValue(inputValue)\n : inputValue,\n );\n }\n };\n\n return (\n <NextInput\n className={cn(className)}\n classNames={{\n inputWrapper: 'group-data-[focus=true]:border-focus',\n }}\n data-testid={testId}\n endContent={endContent}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n showLabel && (\n <>\n {label}\n {showTestIdCopyButton && (\n <FieldCopyTestIdButton testId={testId} />\n )}\n </>\n )\n }\n labelPlacement=\"outside\"\n name={name}\n onBlur={onBlur}\n onChange={handleChange}\n placeholder={placeholder}\n radius=\"sm\"\n ref={ref}\n startContent={startContent}\n type={type}\n value={displayValue}\n variant=\"bordered\"\n />\n );\n }}\n />\n );\n};\n\nexport default Input;\n","import Input from './Input';\n\nexport type { InputProps } from './Input';\n\nexport { Input };\n\nexport default Input;\n"],"mappings":";;;;;;;;;;;;;;AAEA,SAAS,SAAS,iBAAiB;AAEnC,SAAS,UAAU;AAwHgB,SAMnB,UANmB,KAMnB,YANmB;AAlFnC,IAAM,QAAQ,CAAC;AAAA,EACb,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,aAAa;AAAA,EACb,QAAQ;AAAA,EACR;AAAA,EACA,cAAc;AAAA,EACd,eAAe;AAAA,EACf,QAAQ,UAAU;AAAA,EAClB,iBAAiB;AAAA,EACjB,OAAO;AACT,MAAkB;AAChB,QAAM,EAAE,SAAS,WAAW,cAAc,IAAI,eAAe;AAC7D,QAAM,EAAE,OAAO,SAAS,UAAU,OAAO,IAAI,cAAc,MAAM,OAAO;AAExE,QAAM,uBAAuB,cAAc;AAC3C,QAAM,YAAY,SAAS;AAE3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,CAAC;AAAA,QACP,OAAO,EAAE,UAAU,YAAY,UAAU,QAAQ,QAAQ,IAAI,IAAI;AAAA,MACnE,MAAM;AAaJ,cAAM,eAAe,gBAAgB,eACjC,eAAe,aAAa,SAAS,EAAE,IACtC,SAAS;AAqBd,cAAM,eAAe,CAAC,MAA2C;AAC/D,gBAAM,aAAa,EAAE,OAAO;AAC5B,cAAI,SAAS,UAAU;AACrB,qBAAS,eAAe,KAAK,KAAK,OAAO,UAAU,CAAC;AAAA,UACtD,OAAO;AACL;AAAA,cACE,gBAAgB,YACZ,eAAe,UAAU,UAAU,IACnC;AAAA,YACN;AAAA,UACF;AAAA,QACF;AAEA,eACE;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,GAAG,SAAS;AAAA,YACvB,YAAY;AAAA,cACV,cAAc;AAAA,YAChB;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA,cAAc,SAAS,oBAAC,gCAAqB,OAAc;AAAA,YAC3D;AAAA,YACA,WAAW;AAAA,YACX,YAAY;AAAA,YACZ,OACE,aACE,iCACG;AAAA;AAAA,cACA,wBACC,oBAAC,iCAAsB,QAAgB;AAAA,eAE3C;AAAA,YAGJ,gBAAe;AAAA,YACf;AAAA,YACA;AAAA,YACA,UAAU;AAAA,YACV;AAAA,YACA,QAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACP,SAAQ;AAAA;AAAA,QACV;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;;;ACtJf,IAAOA,iBAAQ;","names":["Input_default"]}
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports, "__esModule", {value: true});
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
2
2
 
3
3
  var _chunkVQWKXSHWcjs = require('./chunk-VQWKXSHW.cjs');
4
4
 
@@ -38,8 +38,19 @@ var Input = ({
38
38
  disabled,
39
39
  name,
40
40
  render: ({
41
- field: { disabled: isDisabled, onChange, onBlur, value, ref }
41
+ field: { disabled: isDisabled, onChange, onBlur, value = "", ref }
42
42
  }) => {
43
+ const displayValue = _optionalChain([transformValue, 'optionalAccess', _ => _.displayValue]) ? transformValue.displayValue(_nullishCoalesce(value, () => ( ""))) : _nullishCoalesce(value, () => ( ""));
44
+ const handleChange = (e) => {
45
+ const inputValue = e.target.value;
46
+ if (type === "number") {
47
+ onChange(inputValue === "" ? "" : Number(inputValue));
48
+ } else {
49
+ onChange(
50
+ _optionalChain([transformValue, 'optionalAccess', _2 => _2.formValue]) ? transformValue.formValue(inputValue) : inputValue
51
+ );
52
+ }
53
+ };
43
54
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
44
55
  _input.Input,
45
56
  {
@@ -60,17 +71,13 @@ var Input = ({
60
71
  labelPlacement: "outside",
61
72
  name,
62
73
  onBlur,
63
- onChange: type === "number" ? (e) => {
64
- onChange(Number(e.target.value));
65
- } : (e) => onChange(
66
- transformValue && transformValue.formValue ? transformValue.formValue(e.target.value) : e.target.value
67
- ),
74
+ onChange: handleChange,
68
75
  placeholder,
69
76
  radius: "sm",
70
77
  ref,
71
78
  startContent,
72
79
  type,
73
- value: transformValue && transformValue.displayValue ? transformValue.displayValue(value) : value,
80
+ value: displayValue,
74
81
  variant: "bordered"
75
82
  }
76
83
  );
@@ -87,4 +94,4 @@ var Input_default2 = Input_default;
87
94
 
88
95
 
89
96
  exports.Input_default = Input_default; exports.Input_default2 = Input_default2;
90
- //# sourceMappingURL=chunk-U6VUNJZG.cjs.map
97
+ //# sourceMappingURL=chunk-RBIX6EWU.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-RBIX6EWU.cjs","../src/Input/Input.tsx","../src/Input/index.ts"],"names":["Input_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-RBIX6EWU.cjs","sourcesContent":[null,"import type { ReactNode } from 'react';\n\nimport { Input as NextInput } from '@nextui-org/input';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from '../Controller';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport interface InputProps {\n /** CSS class name */\n className?: string;\n /** input field is disabled */\n disabled?: boolean;\n /** added content to the end of the input Field. */\n endContent?: ReactNode;\n /** form field label (set to false to disable label) */\n label?: string | false;\n /** form field name */\n name: string;\n /** form field placeholder */\n placeholder?: string;\n /** content added to the start of the input field */\n startContent?: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** allows disentangled display and form values for a field */\n transformValue?: {\n /** transforms the formValue of the field to the display value of the field */\n displayValue: (value: string | number) => string | number;\n /** transforms the displayValue of the field to the form value of the field */\n formValue: (value: string) => string | number;\n };\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [NextUI Input](https://nextui.org/docs/components/input)\n */\nconst Input = ({\n className = undefined,\n disabled = false,\n endContent = undefined,\n label = undefined,\n name,\n placeholder = ' ',\n startContent = undefined,\n testId: _testId = undefined,\n transformValue = undefined,\n type = undefined,\n}: InputProps) => {\n const { control, debugMode, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label || showTestIdCopyButton;\n\n return (\n <Controller\n control={control}\n disabled={disabled}\n name={name}\n render={({\n field: { disabled: isDisabled, onChange, onBlur, value = '', ref },\n }) => {\n /**\n * Determines the display value for the input field:\n * 1. If transformValue.displayValue is provided, applies the transform to the current value\n * (useful for formatting like adding currency symbols, date formatting, etc.)\n * 2. Falls back to the raw value if no transform is provided\n * 3. Ensures a defined value by using empty string as fallback (prevents uncontrolled input warnings)\n *\n * Examples:\n * - With transform: value \"1000\" → displayValue \"$1,000\"\n * - Without transform: value \"1000\" → displayValue \"1000\"\n * - Undefined value: value undefined → displayValue \"\"\n */\n const displayValue = transformValue?.displayValue\n ? transformValue.displayValue(value ?? '')\n : (value ?? '');\n\n /**\n * Handles input value changes with special processing:\n * 1. For number inputs:\n * - Preserves empty string (prevents NaN in the form state)\n * - Converts non-empty values to numbers\n * Example: \"\" → \"\" (empty stays empty)\n * \"42\" → 42 (converts to number)\n *\n * 2. For text inputs with transformValue.formValue:\n * - Applies custom transform before updating form state\n * - Useful for converting display format to storage format\n * Example: \"$1,000\" → \"1000\" (strips formatting)\n *\n * 3. For regular text inputs:\n * - Passes through the raw input value\n * Example: \"hello\" → \"hello\" (no transformation)\n *\n * @param e The input change event\n */\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const inputValue = e.target.value;\n if (type === 'number') {\n onChange(inputValue === '' ? '' : Number(inputValue));\n } else {\n onChange(\n transformValue?.formValue\n ? transformValue.formValue(inputValue)\n : inputValue,\n );\n }\n };\n\n return (\n <NextInput\n className={cn(className)}\n classNames={{\n inputWrapper: 'group-data-[focus=true]:border-focus',\n }}\n data-testid={testId}\n endContent={endContent}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n showLabel && (\n <>\n {label}\n {showTestIdCopyButton && (\n <FieldCopyTestIdButton testId={testId} />\n )}\n </>\n )\n }\n labelPlacement=\"outside\"\n name={name}\n onBlur={onBlur}\n onChange={handleChange}\n placeholder={placeholder}\n radius=\"sm\"\n ref={ref}\n startContent={startContent}\n type={type}\n value={displayValue}\n variant=\"bordered\"\n />\n );\n }}\n />\n );\n};\n\nexport default Input;\n","import Input from './Input';\n\nexport type { InputProps } from './Input';\n\nexport { Input };\n\nexport default Input;\n"]}