@fuf-stack/uniform 1.7.0 → 1.8.0

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.
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunk2E4Q6OHCcjs = require('../chunk-2E4Q6OHC.cjs');
4
+ var _chunkZLTMRO6Xcjs = require('../chunk-ZLTMRO6X.cjs');
5
5
  require('../chunk-KWJMKX5J.cjs');
6
6
  require('../chunk-NTOYCWCJ.cjs');
7
7
  require('../chunk-IFBKJ5UZ.cjs');
@@ -20,5 +20,5 @@ require('../chunk-555JRYCS.cjs');
20
20
 
21
21
 
22
22
 
23
- exports.Input = _chunk2E4Q6OHCcjs.Input_default; exports.default = _chunk2E4Q6OHCcjs.Input_default2;
23
+ exports.Input = _chunkZLTMRO6Xcjs.Input_default; exports.default = _chunkZLTMRO6Xcjs.Input_default2;
24
24
  //# sourceMappingURL=index.cjs.map
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  Input_default,
3
3
  Input_default2
4
- } from "../chunk-WHV55VFM.js";
4
+ } from "../chunk-GEJUMUTH.js";
5
5
  import "../chunk-V3GDAELU.js";
6
6
  import "../chunk-ZJDU5EPE.js";
7
7
  import "../chunk-FND5Z5BW.js";
@@ -6,11 +6,13 @@ import {
6
6
  } from "./chunk-EGFB5WEK.js";
7
7
  import {
8
8
  __objRest,
9
+ __spreadProps,
9
10
  __spreadValues
10
11
  } from "./chunk-K2V4ULA2.js";
11
12
 
12
13
  // src/Input/Input.tsx
13
14
  import { Input as HeroInput } from "@heroui/input";
15
+ import { NumberInput as HeroNumberInput } from "@heroui/number-input";
14
16
  import { tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
15
17
  import { jsx } from "react/jsx-runtime";
16
18
  var inputVariants = tv({
@@ -81,39 +83,55 @@ var Input = (_a) => {
81
83
  } : {};
82
84
  const variants = inputVariants();
83
85
  const classNames = variantsToClassNames(variants, _className, "base");
84
- return /* @__PURE__ */ jsx(
85
- HeroInput,
86
- __spreadValues({
87
- ref,
88
- "data-testid": testId,
89
- endContent,
90
- errorMessage,
91
- id: testId,
92
- isDisabled: disabled,
93
- isInvalid: invalid,
94
- isRequired: required,
95
- label,
96
- labelPlacement: "outside",
97
- name,
98
- onBlur,
99
- onChange,
100
- placeholder,
101
- radius: "sm",
102
- size,
103
- startContent,
104
- type,
105
- value,
106
- variant: "bordered",
107
- classNames: {
108
- base: classNames.base,
109
- clearButton: classNames.clearButton,
110
- // set padding to 0 for error message exit animation
111
- helperWrapper: "p-0",
112
- input: classNames.input,
113
- inputWrapper: classNames.inputWrapper
114
- }
115
- }, clearableProps)
116
- );
86
+ const commonProps = __spreadValues({
87
+ ref,
88
+ classNames: {
89
+ base: classNames.base,
90
+ clearButton: classNames.clearButton,
91
+ // set padding to 0 for error message exit animation
92
+ helperWrapper: "p-0",
93
+ input: classNames.input,
94
+ inputWrapper: classNames.inputWrapper
95
+ },
96
+ "data-testid": testId,
97
+ endContent,
98
+ errorMessage,
99
+ id: testId,
100
+ isDisabled: disabled,
101
+ isInvalid: invalid,
102
+ isRequired: required,
103
+ label,
104
+ labelPlacement: "outside",
105
+ name,
106
+ onBlur,
107
+ placeholder,
108
+ radius: "sm",
109
+ size,
110
+ startContent,
111
+ variant: "bordered"
112
+ }, clearableProps);
113
+ if (type === "number") {
114
+ const numberValue = value !== "" && value != null && !Number.isNaN(Number(value)) ? Number(value) : void 0;
115
+ return /* @__PURE__ */ jsx(
116
+ HeroNumberInput,
117
+ __spreadProps(__spreadValues({}, commonProps), {
118
+ value: numberValue,
119
+ formatOptions: {
120
+ useGrouping: false
121
+ },
122
+ onChange: (e) => {
123
+ if (typeof e === "number") {
124
+ onChange({
125
+ target: { value: String(e) }
126
+ });
127
+ } else {
128
+ onChange(e);
129
+ }
130
+ }
131
+ })
132
+ );
133
+ }
134
+ return /* @__PURE__ */ jsx(HeroInput, __spreadProps(__spreadValues({}, commonProps), { onChange, type, value }));
117
135
  };
118
136
  var Input_default = Input;
119
137
 
@@ -124,4 +142,4 @@ export {
124
142
  Input_default,
125
143
  Input_default2
126
144
  };
127
- //# sourceMappingURL=chunk-WHV55VFM.js.map
145
+ //# sourceMappingURL=chunk-GEJUMUTH.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Input/Input.tsx","../src/Input/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { InputProps as HeroInputProps } from '@heroui/input';\nimport type { ReactNode } from 'react';\nimport type { InputValueTransform } from '../hooks';\n\nimport { Input as HeroInput } from '@heroui/input';\n// eslint-disable-next-line import-x/no-unresolved\nimport { NumberInput as HeroNumberInput } from '@heroui/number-input';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useInputValueDebounce, useUniformField } from '../hooks';\n\n// input variants\nexport const inputVariants = tv({\n slots: {\n /** wrapper around the whole input */\n base: '',\n /** clear button */\n clearButton: '',\n /** actual input element */\n input: '',\n /** inner wrapper (HeroUI inputWrapper slot) */\n inputWrapper: 'bg-content1 group-data-[focus=true]:border-focus',\n },\n});\n\ntype VariantProps = TVProps<typeof inputVariants>;\ntype ClassName = TVClassName<typeof inputVariants>;\n\nexport interface InputProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** shows clear button when input has value */\n clearable?: boolean;\n /** debounce delay in milliseconds for form state updates (default: 300ms) */\n debounceDelay?: number;\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 /** callback that is fired when the value is cleared */\n onClear?: () => void;\n /** form field placeholder */\n placeholder?: string;\n /** size of the input */\n size?: 'sm' | 'md' | 'lg';\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 transform?: InputValueTransform<string>;\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [HeroUI Input](https://www.heroui.com//docs/components/input)\n */\nconst Input = ({\n className: _className = undefined,\n clearable = false,\n debounceDelay = 300,\n endContent = undefined,\n name,\n onClear = undefined,\n placeholder = ' ',\n size = undefined,\n startContent = undefined,\n type = undefined,\n ...uniformFieldProps\n}: InputProps) => {\n const {\n disabled,\n field: {\n onChange: fieldOnChange,\n onBlur: fieldOnBlur,\n value: fieldValue,\n ref,\n },\n errorMessage,\n invalid,\n label,\n required,\n testId,\n resetField,\n } = useUniformField({ name, type, ...uniformFieldProps });\n\n // Use hook that provides debounced onChange and enhanced blur handling\n const { onChange, onBlur, value } = useInputValueDebounce({\n debounceDelay,\n onBlur: fieldOnBlur,\n onChange: fieldOnChange,\n value: fieldValue,\n });\n\n // If input is clearable add props for clearing input value\n const clearableProps: Pick<HeroInputProps, 'isClearable' | 'onClear'> =\n clearable\n ? {\n isClearable: true,\n onClear: () => {\n // if field had initial value we do not reset it\n // to that value, but clear it instead\n resetField(name, { defaultValue: null });\n // if onClear cb provided we call it\n if (onClear) {\n onClear();\n }\n },\n }\n : {};\n\n // classNames from slots\n const variants = inputVariants();\n const classNames = variantsToClassNames(variants, _className, 'base');\n\n // Common props for both Input and NumberInput\n const commonProps = {\n ref,\n classNames: {\n base: classNames.base,\n clearButton: classNames.clearButton,\n // set padding to 0 for error message exit animation\n helperWrapper: 'p-0',\n input: classNames.input,\n inputWrapper: classNames.inputWrapper,\n },\n 'data-testid': testId,\n endContent,\n errorMessage,\n id: testId,\n isDisabled: disabled,\n isInvalid: invalid,\n isRequired: required,\n label,\n labelPlacement: 'outside' as const,\n name,\n onBlur,\n placeholder,\n radius: 'sm' as const,\n size,\n startContent,\n variant: 'bordered' as const,\n ...clearableProps,\n };\n\n // Render NumberInput for number type\n if (type === 'number') {\n // Parse the string value to number - use undefined for empty/cleared state\n const numberValue =\n value !== '' && value != null && !Number.isNaN(Number(value))\n ? Number(value)\n : undefined;\n\n return (\n <HeroNumberInput\n {...commonProps}\n value={numberValue}\n // Disable thousands separator to avoid parsing issues\n formatOptions={{\n useGrouping: false,\n }}\n // NumberInput onChange receives either an event or a number\n onChange={(e: React.ChangeEvent<HTMLInputElement> | number) => {\n if (typeof e === 'number') {\n // Convert number to synthetic event and pass through debounced onChange\n onChange({\n target: { value: String(e) },\n } as React.ChangeEvent<HTMLInputElement>);\n } else {\n // Pass event through debounced onChange\n onChange(e);\n }\n }}\n />\n );\n }\n\n // Render regular Input for text/password\n return (\n <HeroInput {...commonProps} onChange={onChange} type={type} value={value} />\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":";;;;;;;;;;;;;AAKA,SAAS,SAAS,iBAAiB;AAEnC,SAAS,eAAe,uBAAuB;AAE/C,SAAS,IAAI,4BAA4B;AAwJnC;AAnJC,IAAM,gBAAgB,GAAG;AAAA,EAC9B,OAAO;AAAA;AAAA,IAEL,MAAM;AAAA;AAAA,IAEN,aAAa;AAAA;AAAA,IAEb,OAAO;AAAA;AAAA,IAEP,cAAc;AAAA,EAChB;AACF,CAAC;AAuCD,IAAM,QAAQ,CAAC,OAYG;AAZH,eACb;AAAA,eAAW,aAAa;AAAA,IACxB,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,aAAa;AAAA,IACb;AAAA,IACA,UAAU;AAAA,IACV,cAAc;AAAA,IACd,OAAO;AAAA,IACP,eAAe;AAAA,IACf,OAAO;AAAA,EA1ET,IAgEe,IAWV,8BAXU,IAWV;AAAA,IAVH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,MACL,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,gBAAgB,iBAAE,MAAM,QAAS,kBAAmB;AAGxD,QAAM,EAAE,UAAU,QAAQ,MAAM,IAAI,sBAAsB;AAAA,IACxD;AAAA,IACA,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,OAAO;AAAA,EACT,CAAC;AAGD,QAAM,iBACJ,YACI;AAAA,IACE,aAAa;AAAA,IACb,SAAS,MAAM;AAGb,iBAAW,MAAM,EAAE,cAAc,KAAK,CAAC;AAEvC,UAAI,SAAS;AACX,gBAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF,IACA,CAAC;AAGP,QAAM,WAAW,cAAc;AAC/B,QAAM,aAAa,qBAAqB,UAAU,YAAY,MAAM;AAGpE,QAAM,cAAc;AAAA,IAClB;AAAA,IACA,YAAY;AAAA,MACV,MAAM,WAAW;AAAA,MACjB,aAAa,WAAW;AAAA;AAAA,MAExB,eAAe;AAAA,MACf,OAAO,WAAW;AAAA,MAClB,cAAc,WAAW;AAAA,IAC3B;AAAA,IACA,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA,IAAI;AAAA,IACJ,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,YAAY;AAAA,IACZ;AAAA,IACA,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA,SAAS;AAAA,KACN;AAIL,MAAI,SAAS,UAAU;AAErB,UAAM,cACJ,UAAU,MAAM,SAAS,QAAQ,CAAC,OAAO,MAAM,OAAO,KAAK,CAAC,IACxD,OAAO,KAAK,IACZ;AAEN,WACE;AAAA,MAAC;AAAA,uCACK,cADL;AAAA,QAEC,OAAO;AAAA,QAEP,eAAe;AAAA,UACb,aAAa;AAAA,QACf;AAAA,QAEA,UAAU,CAAC,MAAoD;AAC7D,cAAI,OAAO,MAAM,UAAU;AAEzB,qBAAS;AAAA,cACP,QAAQ,EAAE,OAAO,OAAO,CAAC,EAAE;AAAA,YAC7B,CAAwC;AAAA,UAC1C,OAAO;AAEL,qBAAS,CAAC;AAAA,UACZ;AAAA,QACF;AAAA;AAAA,IACF;AAAA,EAEJ;AAGA,SACE,oBAAC,4CAAc,cAAd,EAA2B,UAAoB,MAAY,QAAc;AAE9E;AAEA,IAAO,gBAAQ;;;ACxLf,IAAOA,iBAAQ;","names":["Input_default"]}
@@ -7,10 +7,12 @@ var _chunkOQUTHTOKcjs = require('./chunk-OQUTHTOK.cjs');
7
7
 
8
8
 
9
9
 
10
+
10
11
  var _chunk555JRYCScjs = require('./chunk-555JRYCS.cjs');
11
12
 
12
13
  // src/Input/Input.tsx
13
14
  var _input = require('@heroui/input');
15
+ var _numberinput = require('@heroui/number-input');
14
16
  var _pixelutils = require('@fuf-stack/pixel-utils');
15
17
  var _jsxruntime = require('react/jsx-runtime');
16
18
  var inputVariants = _pixelutils.tv.call(void 0, {
@@ -81,39 +83,55 @@ var Input = (_a) => {
81
83
  } : {};
82
84
  const variants = inputVariants();
83
85
  const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, _className, "base");
84
- return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
85
- _input.Input,
86
- _chunk555JRYCScjs.__spreadValues.call(void 0, {
87
- ref,
88
- "data-testid": testId,
89
- endContent,
90
- errorMessage,
91
- id: testId,
92
- isDisabled: disabled,
93
- isInvalid: invalid,
94
- isRequired: required,
95
- label,
96
- labelPlacement: "outside",
97
- name,
98
- onBlur,
99
- onChange,
100
- placeholder,
101
- radius: "sm",
102
- size,
103
- startContent,
104
- type,
105
- value,
106
- variant: "bordered",
107
- classNames: {
108
- base: classNames.base,
109
- clearButton: classNames.clearButton,
110
- // set padding to 0 for error message exit animation
111
- helperWrapper: "p-0",
112
- input: classNames.input,
113
- inputWrapper: classNames.inputWrapper
114
- }
115
- }, clearableProps)
116
- );
86
+ const commonProps = _chunk555JRYCScjs.__spreadValues.call(void 0, {
87
+ ref,
88
+ classNames: {
89
+ base: classNames.base,
90
+ clearButton: classNames.clearButton,
91
+ // set padding to 0 for error message exit animation
92
+ helperWrapper: "p-0",
93
+ input: classNames.input,
94
+ inputWrapper: classNames.inputWrapper
95
+ },
96
+ "data-testid": testId,
97
+ endContent,
98
+ errorMessage,
99
+ id: testId,
100
+ isDisabled: disabled,
101
+ isInvalid: invalid,
102
+ isRequired: required,
103
+ label,
104
+ labelPlacement: "outside",
105
+ name,
106
+ onBlur,
107
+ placeholder,
108
+ radius: "sm",
109
+ size,
110
+ startContent,
111
+ variant: "bordered"
112
+ }, clearableProps);
113
+ if (type === "number") {
114
+ const numberValue = value !== "" && value != null && !Number.isNaN(Number(value)) ? Number(value) : void 0;
115
+ return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
116
+ _numberinput.NumberInput,
117
+ _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, commonProps), {
118
+ value: numberValue,
119
+ formatOptions: {
120
+ useGrouping: false
121
+ },
122
+ onChange: (e) => {
123
+ if (typeof e === "number") {
124
+ onChange({
125
+ target: { value: String(e) }
126
+ });
127
+ } else {
128
+ onChange(e);
129
+ }
130
+ }
131
+ })
132
+ );
133
+ }
134
+ return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _input.Input, _chunk555JRYCScjs.__spreadProps.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, {}, commonProps), { onChange, type, value }));
117
135
  };
118
136
  var Input_default = Input;
119
137
 
@@ -124,4 +142,4 @@ var Input_default2 = Input_default;
124
142
 
125
143
 
126
144
  exports.Input_default = Input_default; exports.Input_default2 = Input_default2;
127
- //# sourceMappingURL=chunk-2E4Q6OHC.cjs.map
145
+ //# sourceMappingURL=chunk-ZLTMRO6X.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-ZLTMRO6X.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-ZLTMRO6X.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { InputProps as HeroInputProps } from '@heroui/input';\nimport type { ReactNode } from 'react';\nimport type { InputValueTransform } from '../hooks';\n\nimport { Input as HeroInput } from '@heroui/input';\n// eslint-disable-next-line import-x/no-unresolved\nimport { NumberInput as HeroNumberInput } from '@heroui/number-input';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useInputValueDebounce, useUniformField } from '../hooks';\n\n// input variants\nexport const inputVariants = tv({\n slots: {\n /** wrapper around the whole input */\n base: '',\n /** clear button */\n clearButton: '',\n /** actual input element */\n input: '',\n /** inner wrapper (HeroUI inputWrapper slot) */\n inputWrapper: 'bg-content1 group-data-[focus=true]:border-focus',\n },\n});\n\ntype VariantProps = TVProps<typeof inputVariants>;\ntype ClassName = TVClassName<typeof inputVariants>;\n\nexport interface InputProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** shows clear button when input has value */\n clearable?: boolean;\n /** debounce delay in milliseconds for form state updates (default: 300ms) */\n debounceDelay?: number;\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 /** callback that is fired when the value is cleared */\n onClear?: () => void;\n /** form field placeholder */\n placeholder?: string;\n /** size of the input */\n size?: 'sm' | 'md' | 'lg';\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 transform?: InputValueTransform<string>;\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [HeroUI Input](https://www.heroui.com//docs/components/input)\n */\nconst Input = ({\n className: _className = undefined,\n clearable = false,\n debounceDelay = 300,\n endContent = undefined,\n name,\n onClear = undefined,\n placeholder = ' ',\n size = undefined,\n startContent = undefined,\n type = undefined,\n ...uniformFieldProps\n}: InputProps) => {\n const {\n disabled,\n field: {\n onChange: fieldOnChange,\n onBlur: fieldOnBlur,\n value: fieldValue,\n ref,\n },\n errorMessage,\n invalid,\n label,\n required,\n testId,\n resetField,\n } = useUniformField({ name, type, ...uniformFieldProps });\n\n // Use hook that provides debounced onChange and enhanced blur handling\n const { onChange, onBlur, value } = useInputValueDebounce({\n debounceDelay,\n onBlur: fieldOnBlur,\n onChange: fieldOnChange,\n value: fieldValue,\n });\n\n // If input is clearable add props for clearing input value\n const clearableProps: Pick<HeroInputProps, 'isClearable' | 'onClear'> =\n clearable\n ? {\n isClearable: true,\n onClear: () => {\n // if field had initial value we do not reset it\n // to that value, but clear it instead\n resetField(name, { defaultValue: null });\n // if onClear cb provided we call it\n if (onClear) {\n onClear();\n }\n },\n }\n : {};\n\n // classNames from slots\n const variants = inputVariants();\n const classNames = variantsToClassNames(variants, _className, 'base');\n\n // Common props for both Input and NumberInput\n const commonProps = {\n ref,\n classNames: {\n base: classNames.base,\n clearButton: classNames.clearButton,\n // set padding to 0 for error message exit animation\n helperWrapper: 'p-0',\n input: classNames.input,\n inputWrapper: classNames.inputWrapper,\n },\n 'data-testid': testId,\n endContent,\n errorMessage,\n id: testId,\n isDisabled: disabled,\n isInvalid: invalid,\n isRequired: required,\n label,\n labelPlacement: 'outside' as const,\n name,\n onBlur,\n placeholder,\n radius: 'sm' as const,\n size,\n startContent,\n variant: 'bordered' as const,\n ...clearableProps,\n };\n\n // Render NumberInput for number type\n if (type === 'number') {\n // Parse the string value to number - use undefined for empty/cleared state\n const numberValue =\n value !== '' && value != null && !Number.isNaN(Number(value))\n ? Number(value)\n : undefined;\n\n return (\n <HeroNumberInput\n {...commonProps}\n value={numberValue}\n // Disable thousands separator to avoid parsing issues\n formatOptions={{\n useGrouping: false,\n }}\n // NumberInput onChange receives either an event or a number\n onChange={(e: React.ChangeEvent<HTMLInputElement> | number) => {\n if (typeof e === 'number') {\n // Convert number to synthetic event and pass through debounced onChange\n onChange({\n target: { value: String(e) },\n } as React.ChangeEvent<HTMLInputElement>);\n } else {\n // Pass event through debounced onChange\n onChange(e);\n }\n }}\n />\n );\n }\n\n // Render regular Input for text/password\n return (\n <HeroInput {...commonProps} onChange={onChange} type={type} value={value} />\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"]}
package/dist/index.cjs CHANGED
@@ -27,7 +27,7 @@ var _chunkEB3RNELTcjs = require('./chunk-EB3RNELT.cjs');
27
27
  var _chunkTTD3KL6Ecjs = require('./chunk-TTD3KL6E.cjs');
28
28
 
29
29
 
30
- var _chunk2E4Q6OHCcjs = require('./chunk-2E4Q6OHC.cjs');
30
+ var _chunkZLTMRO6Xcjs = require('./chunk-ZLTMRO6X.cjs');
31
31
 
32
32
 
33
33
  var _chunkS3H432Z2cjs = require('./chunk-S3H432Z2.cjs');
@@ -110,5 +110,5 @@ require('./chunk-555JRYCS.cjs');
110
110
 
111
111
 
112
112
 
113
- exports.Checkboxes = _chunkZFZK6EM2cjs.Checkboxes_default; exports.FieldArray = _chunkUT6VUGFPcjs.FieldArray_default; exports.FieldCopyTestIdButton = _chunkOE5BOGGXcjs.FieldCopyTestIdButton_default; exports.FieldValidationError = _chunkNHEZXA4Hcjs.FieldValidationError_default; exports.Form = _chunkEB3RNELTcjs.Form_default; exports.Grid = _chunkTTD3KL6Ecjs.Grid_default; exports.Input = _chunk2E4Q6OHCcjs.Input_default; exports.RadioBoxes = _chunkS3H432Z2cjs.RadioBoxes_default; exports.RadioTabs = _chunk6F5EZ6QNcjs.RadioTabs_default; exports.Radios = _chunkOJGPW4Z6cjs.Radios_default; exports.Select = _chunkFFGFPXNEcjs.Select_default; exports.SubmitButton = _chunkZEJ45LLMcjs.SubmitButton_default; exports.Switch = _chunkTJY5FK4Bcjs.Switch_default; exports.TextArea = _chunk4CWB5XBWcjs.TextArea_default; exports.checkFieldIsRequired = _chunk6LQ2O6SCcjs.checkFieldIsRequired; exports.clientValidationSchemaByName = _chunkEUTTXFWAcjs.clientValidationSchemaByName; exports.flatArrayKey = _chunkZ353BLWIcjs.flatArrayKey; exports.fromNullishString = _chunkZ353BLWIcjs.fromNullishString; exports.toFormFormat = _chunkZ353BLWIcjs.toFormFormat; exports.toNullishString = _chunkZ353BLWIcjs.toNullishString; exports.toValidationFormat = _chunkZ353BLWIcjs.toValidationFormat; exports.useClientValidation = _chunkEUTTXFWAcjs.useClientValidation; exports.useController = _chunk7KEUEGRCcjs.useController; exports.useFormContext = _chunk6LQ2O6SCcjs.useFormContext; exports.useInput = _chunkPCTYJUY7cjs.useInput; exports.useInputValueDebounce = _chunkNTOYCWCJcjs.useInputValueDebounce; exports.useInputValueTransform = _chunk56TQOKG7cjs.useInputValueTransform; exports.useUniformField = _chunkOQUTHTOKcjs.useUniformField; exports.useUniformFieldArray = _chunkIFBKJ5UZcjs.useUniformFieldArray; exports.useWatchUserChange = _chunk4F45XA7Ycjs.useWatchUserChange;
113
+ exports.Checkboxes = _chunkZFZK6EM2cjs.Checkboxes_default; exports.FieldArray = _chunkUT6VUGFPcjs.FieldArray_default; exports.FieldCopyTestIdButton = _chunkOE5BOGGXcjs.FieldCopyTestIdButton_default; exports.FieldValidationError = _chunkNHEZXA4Hcjs.FieldValidationError_default; exports.Form = _chunkEB3RNELTcjs.Form_default; exports.Grid = _chunkTTD3KL6Ecjs.Grid_default; exports.Input = _chunkZLTMRO6Xcjs.Input_default; exports.RadioBoxes = _chunkS3H432Z2cjs.RadioBoxes_default; exports.RadioTabs = _chunk6F5EZ6QNcjs.RadioTabs_default; exports.Radios = _chunkOJGPW4Z6cjs.Radios_default; exports.Select = _chunkFFGFPXNEcjs.Select_default; exports.SubmitButton = _chunkZEJ45LLMcjs.SubmitButton_default; exports.Switch = _chunkTJY5FK4Bcjs.Switch_default; exports.TextArea = _chunk4CWB5XBWcjs.TextArea_default; exports.checkFieldIsRequired = _chunk6LQ2O6SCcjs.checkFieldIsRequired; exports.clientValidationSchemaByName = _chunkEUTTXFWAcjs.clientValidationSchemaByName; exports.flatArrayKey = _chunkZ353BLWIcjs.flatArrayKey; exports.fromNullishString = _chunkZ353BLWIcjs.fromNullishString; exports.toFormFormat = _chunkZ353BLWIcjs.toFormFormat; exports.toNullishString = _chunkZ353BLWIcjs.toNullishString; exports.toValidationFormat = _chunkZ353BLWIcjs.toValidationFormat; exports.useClientValidation = _chunkEUTTXFWAcjs.useClientValidation; exports.useController = _chunk7KEUEGRCcjs.useController; exports.useFormContext = _chunk6LQ2O6SCcjs.useFormContext; exports.useInput = _chunkPCTYJUY7cjs.useInput; exports.useInputValueDebounce = _chunkNTOYCWCJcjs.useInputValueDebounce; exports.useInputValueTransform = _chunk56TQOKG7cjs.useInputValueTransform; exports.useUniformField = _chunkOQUTHTOKcjs.useUniformField; exports.useUniformFieldArray = _chunkIFBKJ5UZcjs.useUniformFieldArray; exports.useWatchUserChange = _chunk4F45XA7Ycjs.useWatchUserChange;
114
114
  //# sourceMappingURL=index.cjs.map
package/dist/index.js CHANGED
@@ -27,7 +27,7 @@ import {
27
27
  } from "./chunk-B62HKKMS.js";
28
28
  import {
29
29
  Input_default
30
- } from "./chunk-WHV55VFM.js";
30
+ } from "./chunk-GEJUMUTH.js";
31
31
  import {
32
32
  RadioBoxes_default
33
33
  } from "./chunk-WWGKXYZB.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fuf-stack/uniform",
3
- "version": "1.7.0",
3
+ "version": "1.8.0",
4
4
  "description": "fuf react form library",
5
5
  "author": "Fröhlich ∧ Frei",
6
6
  "homepage": "https://github.com/fuf-stack/pixels#readme",
@@ -168,6 +168,7 @@
168
168
  "@heroui/button": "2.2.24",
169
169
  "@heroui/checkbox": "2.3.24",
170
170
  "@heroui/input": "2.4.25",
171
+ "@heroui/number-input": "2.0.18",
171
172
  "@heroui/radio": "2.3.24",
172
173
  "@heroui/select": "2.4.25",
173
174
  "@heroui/switch": "2.2.22",
@@ -178,10 +179,10 @@
178
179
  "react-icons": "5.5.0",
179
180
  "react-hook-form": "7.55.0",
180
181
  "react-select": "5.10.2",
181
- "@fuf-stack/pixel-utils": "1.0.5",
182
- "@fuf-stack/veto": "0.12.6",
183
182
  "@fuf-stack/pixel-motion": "1.0.26",
184
- "@fuf-stack/pixels": "1.3.8"
183
+ "@fuf-stack/pixel-utils": "1.0.5",
184
+ "@fuf-stack/pixels": "1.3.8",
185
+ "@fuf-stack/veto": "0.12.6"
185
186
  },
186
187
  "devDependencies": {
187
188
  "@types/debug": "4.1.12",
@@ -1 +0,0 @@
1
- {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-2E4Q6OHC.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-2E4Q6OHC.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { InputProps as HeroInputProps } from '@heroui/input';\nimport type { ReactNode } from 'react';\nimport type { InputValueTransform } from '../hooks';\n\nimport { Input as HeroInput } from '@heroui/input';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useInputValueDebounce, useUniformField } from '../hooks';\n\n// input variants\nexport const inputVariants = tv({\n slots: {\n /** wrapper around the whole input */\n base: '',\n /** clear button */\n clearButton: '',\n /** actual input element */\n input: '',\n /** inner wrapper (HeroUI inputWrapper slot) */\n inputWrapper: 'bg-content1 group-data-[focus=true]:border-focus',\n },\n});\n\ntype VariantProps = TVProps<typeof inputVariants>;\ntype ClassName = TVClassName<typeof inputVariants>;\n\nexport interface InputProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** shows clear button when input has value */\n clearable?: boolean;\n /** debounce delay in milliseconds for form state updates (default: 300ms) */\n debounceDelay?: number;\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 /** callback that is fired when the value is cleared */\n onClear?: () => void;\n /** form field placeholder */\n placeholder?: string;\n /** size of the input */\n size?: 'sm' | 'md' | 'lg';\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 transform?: InputValueTransform<string>;\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [HeroUI Input](https://www.heroui.com//docs/components/input)\n */\nconst Input = ({\n className: _className = undefined,\n clearable = false,\n debounceDelay = 300,\n endContent = undefined,\n name,\n onClear = undefined,\n placeholder = ' ',\n size = undefined,\n startContent = undefined,\n type = undefined,\n ...uniformFieldProps\n}: InputProps) => {\n const {\n disabled,\n field: {\n onChange: fieldOnChange,\n onBlur: fieldOnBlur,\n value: fieldValue,\n ref,\n },\n errorMessage,\n invalid,\n label,\n required,\n testId,\n resetField,\n } = useUniformField({ name, type, ...uniformFieldProps });\n\n // Use hook that provides debounced onChange and enhanced blur handling\n const { onChange, onBlur, value } = useInputValueDebounce({\n debounceDelay,\n onBlur: fieldOnBlur,\n onChange: fieldOnChange,\n value: fieldValue,\n });\n\n // If input is clearable add props for clearing input value\n const clearableProps: Pick<HeroInputProps, 'isClearable' | 'onClear'> =\n clearable\n ? {\n isClearable: true,\n onClear: () => {\n // if field had initial value we do not reset it\n // to that value, but clear it instead\n resetField(name, { defaultValue: null });\n // if onClear cb provided we call it\n if (onClear) {\n onClear();\n }\n },\n }\n : {};\n\n // classNames from slots\n const variants = inputVariants();\n const classNames = variantsToClassNames(variants, _className, 'base');\n\n return (\n <HeroInput\n ref={ref}\n data-testid={testId}\n endContent={endContent}\n errorMessage={errorMessage}\n id={testId}\n isDisabled={disabled}\n isInvalid={invalid}\n isRequired={required}\n label={label}\n labelPlacement=\"outside\"\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n placeholder={placeholder}\n radius=\"sm\"\n size={size}\n startContent={startContent}\n type={type}\n value={value}\n variant=\"bordered\"\n classNames={{\n base: classNames.base,\n clearButton: classNames.clearButton,\n // set padding to 0 for error message exit animation\n helperWrapper: 'p-0',\n input: classNames.input,\n inputWrapper: classNames.inputWrapper,\n }}\n {...clearableProps}\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"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/Input/Input.tsx","../src/Input/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { InputProps as HeroInputProps } from '@heroui/input';\nimport type { ReactNode } from 'react';\nimport type { InputValueTransform } from '../hooks';\n\nimport { Input as HeroInput } from '@heroui/input';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useInputValueDebounce, useUniformField } from '../hooks';\n\n// input variants\nexport const inputVariants = tv({\n slots: {\n /** wrapper around the whole input */\n base: '',\n /** clear button */\n clearButton: '',\n /** actual input element */\n input: '',\n /** inner wrapper (HeroUI inputWrapper slot) */\n inputWrapper: 'bg-content1 group-data-[focus=true]:border-focus',\n },\n});\n\ntype VariantProps = TVProps<typeof inputVariants>;\ntype ClassName = TVClassName<typeof inputVariants>;\n\nexport interface InputProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** shows clear button when input has value */\n clearable?: boolean;\n /** debounce delay in milliseconds for form state updates (default: 300ms) */\n debounceDelay?: number;\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 /** callback that is fired when the value is cleared */\n onClear?: () => void;\n /** form field placeholder */\n placeholder?: string;\n /** size of the input */\n size?: 'sm' | 'md' | 'lg';\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 transform?: InputValueTransform<string>;\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [HeroUI Input](https://www.heroui.com//docs/components/input)\n */\nconst Input = ({\n className: _className = undefined,\n clearable = false,\n debounceDelay = 300,\n endContent = undefined,\n name,\n onClear = undefined,\n placeholder = ' ',\n size = undefined,\n startContent = undefined,\n type = undefined,\n ...uniformFieldProps\n}: InputProps) => {\n const {\n disabled,\n field: {\n onChange: fieldOnChange,\n onBlur: fieldOnBlur,\n value: fieldValue,\n ref,\n },\n errorMessage,\n invalid,\n label,\n required,\n testId,\n resetField,\n } = useUniformField({ name, type, ...uniformFieldProps });\n\n // Use hook that provides debounced onChange and enhanced blur handling\n const { onChange, onBlur, value } = useInputValueDebounce({\n debounceDelay,\n onBlur: fieldOnBlur,\n onChange: fieldOnChange,\n value: fieldValue,\n });\n\n // If input is clearable add props for clearing input value\n const clearableProps: Pick<HeroInputProps, 'isClearable' | 'onClear'> =\n clearable\n ? {\n isClearable: true,\n onClear: () => {\n // if field had initial value we do not reset it\n // to that value, but clear it instead\n resetField(name, { defaultValue: null });\n // if onClear cb provided we call it\n if (onClear) {\n onClear();\n }\n },\n }\n : {};\n\n // classNames from slots\n const variants = inputVariants();\n const classNames = variantsToClassNames(variants, _className, 'base');\n\n return (\n <HeroInput\n ref={ref}\n data-testid={testId}\n endContent={endContent}\n errorMessage={errorMessage}\n id={testId}\n isDisabled={disabled}\n isInvalid={invalid}\n isRequired={required}\n label={label}\n labelPlacement=\"outside\"\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n placeholder={placeholder}\n radius=\"sm\"\n size={size}\n startContent={startContent}\n type={type}\n value={value}\n variant=\"bordered\"\n classNames={{\n base: classNames.base,\n clearButton: classNames.clearButton,\n // set padding to 0 for error message exit animation\n helperWrapper: 'p-0',\n input: classNames.input,\n inputWrapper: classNames.inputWrapper,\n }}\n {...clearableProps}\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":";;;;;;;;;;;;AAKA,SAAS,SAAS,iBAAiB;AAEnC,SAAS,IAAI,4BAA4B;AAkHrC;AA7GG,IAAM,gBAAgB,GAAG;AAAA,EAC9B,OAAO;AAAA;AAAA,IAEL,MAAM;AAAA;AAAA,IAEN,aAAa;AAAA;AAAA,IAEb,OAAO;AAAA;AAAA,IAEP,cAAc;AAAA,EAChB;AACF,CAAC;AAuCD,IAAM,QAAQ,CAAC,OAYG;AAZH,eACb;AAAA,eAAW,aAAa;AAAA,IACxB,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,aAAa;AAAA,IACb;AAAA,IACA,UAAU;AAAA,IACV,cAAc;AAAA,IACd,OAAO;AAAA,IACP,eAAe;AAAA,IACf,OAAO;AAAA,EAxET,IA8De,IAWV,8BAXU,IAWV;AAAA,IAVH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,MACL,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,gBAAgB,iBAAE,MAAM,QAAS,kBAAmB;AAGxD,QAAM,EAAE,UAAU,QAAQ,MAAM,IAAI,sBAAsB;AAAA,IACxD;AAAA,IACA,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,OAAO;AAAA,EACT,CAAC;AAGD,QAAM,iBACJ,YACI;AAAA,IACE,aAAa;AAAA,IACb,SAAS,MAAM;AAGb,iBAAW,MAAM,EAAE,cAAc,KAAK,CAAC;AAEvC,UAAI,SAAS;AACX,gBAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF,IACA,CAAC;AAGP,QAAM,WAAW,cAAc;AAC/B,QAAM,aAAa,qBAAqB,UAAU,YAAY,MAAM;AAEpE,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,eAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA,IAAI;AAAA,MACJ,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,YAAY;AAAA,MACZ;AAAA,MACA,gBAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAQ;AAAA,MACR,YAAY;AAAA,QACV,MAAM,WAAW;AAAA,QACjB,aAAa,WAAW;AAAA;AAAA,QAExB,eAAe;AAAA,QACf,OAAO,WAAW;AAAA,QAClB,cAAc,WAAW;AAAA,MAC3B;AAAA,OACI;AAAA,EACN;AAEJ;AAEA,IAAO,gBAAQ;;;ACrJf,IAAOA,iBAAQ;","names":["Input_default"]}