@fuf-stack/uniform 1.2.2 → 1.3.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.
Files changed (44) hide show
  1. package/dist/Input/index.cjs +2 -2
  2. package/dist/Input/index.d.cts +4 -2
  3. package/dist/Input/index.d.ts +4 -2
  4. package/dist/Input/index.js +1 -1
  5. package/dist/Input-BQkZtJx8.d.cts +99 -0
  6. package/dist/Input-C6ujfEkn.d.ts +99 -0
  7. package/dist/RadioBoxes/index.cjs +2 -2
  8. package/dist/RadioBoxes/index.js +1 -1
  9. package/dist/RadioTabs/index.cjs +2 -2
  10. package/dist/RadioTabs/index.js +1 -1
  11. package/dist/SubmitButton/index.cjs +2 -2
  12. package/dist/SubmitButton/index.d.cts +2 -2
  13. package/dist/SubmitButton/index.d.ts +2 -2
  14. package/dist/SubmitButton/index.js +1 -1
  15. package/dist/{SubmitButton-dyil1SRk.d.cts → SubmitButton-DqaxyVpp.d.cts} +3 -1
  16. package/dist/{SubmitButton-dyil1SRk.d.ts → SubmitButton-DqaxyVpp.d.ts} +3 -1
  17. package/dist/{chunk-CVZSGNBJ.js → chunk-2AJ5JPL4.js} +1 -1
  18. package/dist/{chunk-CVZSGNBJ.js.map → chunk-2AJ5JPL4.js.map} +1 -1
  19. package/dist/{chunk-N7BZIGW7.cjs → chunk-6GE4JIPL.cjs} +14 -11
  20. package/dist/chunk-6GE4JIPL.cjs.map +1 -0
  21. package/dist/{chunk-TIN5YJ4B.js → chunk-DR7PZZFE.js} +3 -1
  22. package/dist/chunk-DR7PZZFE.js.map +1 -0
  23. package/dist/{chunk-Q3M6DUGC.js → chunk-G3Y7AH3F.js} +21 -5
  24. package/dist/chunk-G3Y7AH3F.js.map +1 -0
  25. package/dist/{chunk-ZPCFZYUF.cjs → chunk-HHRR2SHB.cjs} +3 -1
  26. package/dist/chunk-HHRR2SHB.cjs.map +1 -0
  27. package/dist/{chunk-XHWBXZO5.cjs → chunk-RJGJUDWO.cjs} +1 -1
  28. package/dist/{chunk-XHWBXZO5.cjs.map → chunk-RJGJUDWO.cjs.map} +1 -1
  29. package/dist/{chunk-VIJSEE2I.js → chunk-VDBXQA6G.js} +14 -11
  30. package/dist/{chunk-VIJSEE2I.js.map → chunk-VDBXQA6G.js.map} +1 -1
  31. package/dist/{chunk-APBOTAMH.cjs → chunk-ZM72W2XV.cjs} +20 -4
  32. package/dist/chunk-ZM72W2XV.cjs.map +1 -0
  33. package/dist/index.cjs +7 -7
  34. package/dist/index.d.cts +2 -2
  35. package/dist/index.d.ts +2 -2
  36. package/dist/index.js +7 -7
  37. package/package.json +4 -4
  38. package/dist/Input-BFe2jP93.d.cts +0 -40
  39. package/dist/Input-CGjbbXSQ.d.ts +0 -40
  40. package/dist/chunk-APBOTAMH.cjs.map +0 -1
  41. package/dist/chunk-N7BZIGW7.cjs.map +0 -1
  42. package/dist/chunk-Q3M6DUGC.js.map +0 -1
  43. package/dist/chunk-TIN5YJ4B.js.map +0 -1
  44. package/dist/chunk-ZPCFZYUF.cjs.map +0 -1
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunkAPBOTAMHcjs = require('../chunk-APBOTAMH.cjs');
4
+ var _chunkZM72W2XVcjs = require('../chunk-ZM72W2XV.cjs');
5
5
  require('../chunk-OE5BOGGX.cjs');
6
6
  require('../chunk-Y3AB4GV6.cjs');
7
7
  require('../chunk-MAABMY3P.cjs');
@@ -12,5 +12,5 @@ require('../chunk-555JRYCS.cjs');
12
12
 
13
13
 
14
14
 
15
- exports.Input = _chunkAPBOTAMHcjs.Input_default; exports.default = _chunkAPBOTAMHcjs.Input_default2;
15
+ exports.Input = _chunkZM72W2XVcjs.Input_default; exports.default = _chunkZM72W2XVcjs.Input_default2;
16
16
  //# sourceMappingURL=index.cjs.map
@@ -1,6 +1,8 @@
1
- import { I as Input } from '../Input-BFe2jP93.cjs';
2
- export { a as InputProps } from '../Input-BFe2jP93.cjs';
1
+ import { I as Input } from '../Input-BQkZtJx8.cjs';
2
+ export { a as InputProps } from '../Input-BQkZtJx8.cjs';
3
3
  import 'react/jsx-runtime';
4
+ import 'tailwind-variants';
5
+ import '@fuf-stack/pixel-utils';
4
6
  import 'react';
5
7
  import '../hooks/useInputValueTransform/index.cjs';
6
8
 
@@ -1,6 +1,8 @@
1
- import { I as Input } from '../Input-CGjbbXSQ.js';
2
- export { a as InputProps } from '../Input-CGjbbXSQ.js';
1
+ import { I as Input } from '../Input-C6ujfEkn.js';
2
+ export { a as InputProps } from '../Input-C6ujfEkn.js';
3
3
  import 'react/jsx-runtime';
4
+ import 'tailwind-variants';
5
+ import '@fuf-stack/pixel-utils';
4
6
  import 'react';
5
7
  import '../hooks/useInputValueTransform/index.js';
6
8
 
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  Input_default,
3
3
  Input_default2
4
- } from "../chunk-Q3M6DUGC.js";
4
+ } from "../chunk-G3Y7AH3F.js";
5
5
  import "../chunk-NTDKZW4E.js";
6
6
  import "../chunk-CQWA2DFV.js";
7
7
  import "../chunk-2Q3ZW3QG.js";
@@ -0,0 +1,99 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import * as tailwind_variants from 'tailwind-variants';
3
+ import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
4
+ import { ReactNode } from 'react';
5
+ import { InputValueTransform } from './hooks/useInputValueTransform/index.cjs';
6
+
7
+ declare const inputVariants: tailwind_variants.TVReturnType<{
8
+ [key: string]: {
9
+ [key: string]: tailwind_variants.ClassValue | {
10
+ base?: tailwind_variants.ClassValue;
11
+ input?: tailwind_variants.ClassValue;
12
+ inputWrapper?: tailwind_variants.ClassValue;
13
+ clearButton?: tailwind_variants.ClassValue;
14
+ };
15
+ };
16
+ } | {
17
+ [x: string]: {
18
+ [x: string]: tailwind_variants.ClassValue | {
19
+ base?: tailwind_variants.ClassValue;
20
+ input?: tailwind_variants.ClassValue;
21
+ inputWrapper?: tailwind_variants.ClassValue;
22
+ clearButton?: tailwind_variants.ClassValue;
23
+ };
24
+ };
25
+ } | {}, {
26
+ /** wrapper around the whole input */
27
+ base: string;
28
+ /** clear button */
29
+ clearButton: string;
30
+ /** actual input element */
31
+ input: string;
32
+ /** inner wrapper (HeroUI inputWrapper slot) */
33
+ inputWrapper: string;
34
+ }, undefined, {
35
+ [key: string]: {
36
+ [key: string]: tailwind_variants.ClassValue | {
37
+ base?: tailwind_variants.ClassValue;
38
+ input?: tailwind_variants.ClassValue;
39
+ inputWrapper?: tailwind_variants.ClassValue;
40
+ clearButton?: tailwind_variants.ClassValue;
41
+ };
42
+ };
43
+ } | {}, {
44
+ /** wrapper around the whole input */
45
+ base: string;
46
+ /** clear button */
47
+ clearButton: string;
48
+ /** actual input element */
49
+ input: string;
50
+ /** inner wrapper (HeroUI inputWrapper slot) */
51
+ inputWrapper: string;
52
+ }, tailwind_variants.TVReturnType<unknown, {
53
+ /** wrapper around the whole input */
54
+ base: string;
55
+ /** clear button */
56
+ clearButton: string;
57
+ /** actual input element */
58
+ input: string;
59
+ /** inner wrapper (HeroUI inputWrapper slot) */
60
+ inputWrapper: string;
61
+ }, undefined, unknown, unknown, undefined>>;
62
+ type VariantProps = TVProps<typeof inputVariants>;
63
+ type ClassName = TVClassName<typeof inputVariants>;
64
+ interface InputProps extends VariantProps {
65
+ /** CSS class name */
66
+ className?: ClassName;
67
+ /** shows clear button when input has value */
68
+ clearable?: boolean;
69
+ /** debounce delay in milliseconds for form state updates (default: 300ms) */
70
+ debounceDelay?: number;
71
+ /** input field is disabled */
72
+ disabled?: boolean;
73
+ /** added content to the end of the input Field. */
74
+ endContent?: ReactNode;
75
+ /** form field label (set to false to disable label) */
76
+ label?: string | false;
77
+ /** form field name */
78
+ name: string;
79
+ /** callback that is fired when the value is cleared */
80
+ onClear?: () => void;
81
+ /** form field placeholder */
82
+ placeholder?: string;
83
+ /** size of the input */
84
+ size?: 'sm' | 'md' | 'lg';
85
+ /** content added to the start of the input field */
86
+ startContent?: ReactNode;
87
+ /** HTML data-testid attribute used in e2e tests */
88
+ testId?: string;
89
+ /** allows disentangled display and form values for a field */
90
+ transform?: InputValueTransform;
91
+ /** input type */
92
+ type?: 'number' | 'password';
93
+ }
94
+ /**
95
+ * Input component based on [HeroUI Input](https://www.heroui.com//docs/components/input)
96
+ */
97
+ declare const Input: ({ className: _className, clearable, debounceDelay, disabled, endContent, label, name, onClear, placeholder, size, startContent, testId: _testId, transform, type, }: InputProps) => react_jsx_runtime.JSX.Element;
98
+
99
+ export { Input as I, type InputProps as a };
@@ -0,0 +1,99 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import * as tailwind_variants from 'tailwind-variants';
3
+ import { TVProps, TVClassName } from '@fuf-stack/pixel-utils';
4
+ import { ReactNode } from 'react';
5
+ import { InputValueTransform } from './hooks/useInputValueTransform/index.js';
6
+
7
+ declare const inputVariants: tailwind_variants.TVReturnType<{
8
+ [key: string]: {
9
+ [key: string]: tailwind_variants.ClassValue | {
10
+ base?: tailwind_variants.ClassValue;
11
+ input?: tailwind_variants.ClassValue;
12
+ inputWrapper?: tailwind_variants.ClassValue;
13
+ clearButton?: tailwind_variants.ClassValue;
14
+ };
15
+ };
16
+ } | {
17
+ [x: string]: {
18
+ [x: string]: tailwind_variants.ClassValue | {
19
+ base?: tailwind_variants.ClassValue;
20
+ input?: tailwind_variants.ClassValue;
21
+ inputWrapper?: tailwind_variants.ClassValue;
22
+ clearButton?: tailwind_variants.ClassValue;
23
+ };
24
+ };
25
+ } | {}, {
26
+ /** wrapper around the whole input */
27
+ base: string;
28
+ /** clear button */
29
+ clearButton: string;
30
+ /** actual input element */
31
+ input: string;
32
+ /** inner wrapper (HeroUI inputWrapper slot) */
33
+ inputWrapper: string;
34
+ }, undefined, {
35
+ [key: string]: {
36
+ [key: string]: tailwind_variants.ClassValue | {
37
+ base?: tailwind_variants.ClassValue;
38
+ input?: tailwind_variants.ClassValue;
39
+ inputWrapper?: tailwind_variants.ClassValue;
40
+ clearButton?: tailwind_variants.ClassValue;
41
+ };
42
+ };
43
+ } | {}, {
44
+ /** wrapper around the whole input */
45
+ base: string;
46
+ /** clear button */
47
+ clearButton: string;
48
+ /** actual input element */
49
+ input: string;
50
+ /** inner wrapper (HeroUI inputWrapper slot) */
51
+ inputWrapper: string;
52
+ }, tailwind_variants.TVReturnType<unknown, {
53
+ /** wrapper around the whole input */
54
+ base: string;
55
+ /** clear button */
56
+ clearButton: string;
57
+ /** actual input element */
58
+ input: string;
59
+ /** inner wrapper (HeroUI inputWrapper slot) */
60
+ inputWrapper: string;
61
+ }, undefined, unknown, unknown, undefined>>;
62
+ type VariantProps = TVProps<typeof inputVariants>;
63
+ type ClassName = TVClassName<typeof inputVariants>;
64
+ interface InputProps extends VariantProps {
65
+ /** CSS class name */
66
+ className?: ClassName;
67
+ /** shows clear button when input has value */
68
+ clearable?: boolean;
69
+ /** debounce delay in milliseconds for form state updates (default: 300ms) */
70
+ debounceDelay?: number;
71
+ /** input field is disabled */
72
+ disabled?: boolean;
73
+ /** added content to the end of the input Field. */
74
+ endContent?: ReactNode;
75
+ /** form field label (set to false to disable label) */
76
+ label?: string | false;
77
+ /** form field name */
78
+ name: string;
79
+ /** callback that is fired when the value is cleared */
80
+ onClear?: () => void;
81
+ /** form field placeholder */
82
+ placeholder?: string;
83
+ /** size of the input */
84
+ size?: 'sm' | 'md' | 'lg';
85
+ /** content added to the start of the input field */
86
+ startContent?: ReactNode;
87
+ /** HTML data-testid attribute used in e2e tests */
88
+ testId?: string;
89
+ /** allows disentangled display and form values for a field */
90
+ transform?: InputValueTransform;
91
+ /** input type */
92
+ type?: 'number' | 'password';
93
+ }
94
+ /**
95
+ * Input component based on [HeroUI Input](https://www.heroui.com//docs/components/input)
96
+ */
97
+ declare const Input: ({ className: _className, clearable, debounceDelay, disabled, endContent, label, name, onClear, placeholder, size, startContent, testId: _testId, transform, type, }: InputProps) => react_jsx_runtime.JSX.Element;
98
+
99
+ export { Input as I, type InputProps as a };
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunkXHWBXZO5cjs = require('../chunk-XHWBXZO5.cjs');
4
+ var _chunkRJGJUDWOcjs = require('../chunk-RJGJUDWO.cjs');
5
5
  require('../chunk-OE5BOGGX.cjs');
6
6
  require('../chunk-Y3AB4GV6.cjs');
7
7
  require('../chunk-MAABMY3P.cjs');
@@ -12,5 +12,5 @@ require('../chunk-555JRYCS.cjs');
12
12
 
13
13
 
14
14
 
15
- exports.RadioBoxes = _chunkXHWBXZO5cjs.RadioBoxes_default; exports.default = _chunkXHWBXZO5cjs.RadioBoxes_default2;
15
+ exports.RadioBoxes = _chunkRJGJUDWOcjs.RadioBoxes_default; exports.default = _chunkRJGJUDWOcjs.RadioBoxes_default2;
16
16
  //# sourceMappingURL=index.cjs.map
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  RadioBoxes_default,
3
3
  RadioBoxes_default2
4
- } from "../chunk-CVZSGNBJ.js";
4
+ } from "../chunk-2AJ5JPL4.js";
5
5
  import "../chunk-NTDKZW4E.js";
6
6
  import "../chunk-CQWA2DFV.js";
7
7
  import "../chunk-2Q3ZW3QG.js";
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunkN7BZIGW7cjs = require('../chunk-N7BZIGW7.cjs');
4
+ var _chunk6GE4JIPLcjs = require('../chunk-6GE4JIPL.cjs');
5
5
  require('../chunk-OE5BOGGX.cjs');
6
6
  require('../chunk-Y3AB4GV6.cjs');
7
7
  require('../chunk-MAABMY3P.cjs');
@@ -12,5 +12,5 @@ require('../chunk-555JRYCS.cjs');
12
12
 
13
13
 
14
14
 
15
- exports.RadioTabs = _chunkN7BZIGW7cjs.RadioTabs_default; exports.default = _chunkN7BZIGW7cjs.RadioTabs_default2;
15
+ exports.RadioTabs = _chunk6GE4JIPLcjs.RadioTabs_default; exports.default = _chunk6GE4JIPLcjs.RadioTabs_default2;
16
16
  //# sourceMappingURL=index.cjs.map
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  RadioTabs_default,
3
3
  RadioTabs_default2
4
- } from "../chunk-VIJSEE2I.js";
4
+ } from "../chunk-VDBXQA6G.js";
5
5
  import "../chunk-NTDKZW4E.js";
6
6
  import "../chunk-CQWA2DFV.js";
7
7
  import "../chunk-2Q3ZW3QG.js";
@@ -1,7 +1,7 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
3
 
4
- var _chunkZPCFZYUFcjs = require('../chunk-ZPCFZYUF.cjs');
4
+ var _chunkHHRR2SHBcjs = require('../chunk-HHRR2SHB.cjs');
5
5
  require('../chunk-MAABMY3P.cjs');
6
6
  require('../chunk-YGNY6CKU.cjs');
7
7
  require('../chunk-FLK6OPFY.cjs');
@@ -10,5 +10,5 @@ require('../chunk-555JRYCS.cjs');
10
10
 
11
11
 
12
12
 
13
- exports.SubmitButton = _chunkZPCFZYUFcjs.SubmitButton_default; exports.default = _chunkZPCFZYUFcjs.SubmitButton_default2;
13
+ exports.SubmitButton = _chunkHHRR2SHBcjs.SubmitButton_default; exports.default = _chunkHHRR2SHBcjs.SubmitButton_default2;
14
14
  //# sourceMappingURL=index.cjs.map
@@ -1,5 +1,5 @@
1
- import { S as SubmitButton } from '../SubmitButton-dyil1SRk.cjs';
2
- export { a as SubmitButtonProps } from '../SubmitButton-dyil1SRk.cjs';
1
+ import { S as SubmitButton } from '../SubmitButton-DqaxyVpp.cjs';
2
+ export { a as SubmitButtonProps } from '../SubmitButton-DqaxyVpp.cjs';
3
3
  import 'react/jsx-runtime';
4
4
  import '@fuf-stack/pixels';
5
5
  import 'react';
@@ -1,5 +1,5 @@
1
- import { S as SubmitButton } from '../SubmitButton-dyil1SRk.js';
2
- export { a as SubmitButtonProps } from '../SubmitButton-dyil1SRk.js';
1
+ import { S as SubmitButton } from '../SubmitButton-DqaxyVpp.js';
2
+ export { a as SubmitButtonProps } from '../SubmitButton-DqaxyVpp.js';
3
3
  import 'react/jsx-runtime';
4
4
  import '@fuf-stack/pixels';
5
5
  import 'react';
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  SubmitButton_default,
3
3
  SubmitButton_default2
4
- } from "../chunk-TIN5YJ4B.js";
4
+ } from "../chunk-DR7PZZFE.js";
5
5
  import "../chunk-2Q3ZW3QG.js";
6
6
  import "../chunk-KQN55PEW.js";
7
7
  import "../chunk-6IU7IYYB.js";
@@ -3,6 +3,8 @@ import { ButtonProps } from '@fuf-stack/pixels';
3
3
  import { ReactNode } from 'react';
4
4
 
5
5
  interface SubmitButtonProps {
6
+ /** sets HTML aria-label attribute */
7
+ ariaLabel?: string;
6
8
  /** child components */
7
9
  children?: ReactNode;
8
10
  /** CSS class name */
@@ -21,6 +23,6 @@ interface SubmitButtonProps {
21
23
  /**
22
24
  * From SubmitButton
23
25
  */
24
- declare const SubmitButton: ({ children, className, color, icon, loading, size, testId, }: SubmitButtonProps) => react_jsx_runtime.JSX.Element;
26
+ declare const SubmitButton: ({ ariaLabel, children, className, color, icon, loading, size, testId, }: SubmitButtonProps) => react_jsx_runtime.JSX.Element;
25
27
 
26
28
  export { SubmitButton as S, type SubmitButtonProps as a };
@@ -3,6 +3,8 @@ import { ButtonProps } from '@fuf-stack/pixels';
3
3
  import { ReactNode } from 'react';
4
4
 
5
5
  interface SubmitButtonProps {
6
+ /** sets HTML aria-label attribute */
7
+ ariaLabel?: string;
6
8
  /** child components */
7
9
  children?: ReactNode;
8
10
  /** CSS class name */
@@ -21,6 +23,6 @@ interface SubmitButtonProps {
21
23
  /**
22
24
  * From SubmitButton
23
25
  */
24
- declare const SubmitButton: ({ children, className, color, icon, loading, size, testId, }: SubmitButtonProps) => react_jsx_runtime.JSX.Element;
26
+ declare const SubmitButton: ({ ariaLabel, children, className, color, icon, loading, size, testId, }: SubmitButtonProps) => react_jsx_runtime.JSX.Element;
25
27
 
26
28
  export { SubmitButton as S, type SubmitButtonProps as a };
@@ -166,4 +166,4 @@ export {
166
166
  RadioBoxes_default,
167
167
  RadioBoxes_default2
168
168
  };
169
- //# sourceMappingURL=chunk-CVZSGNBJ.js.map
169
+ //# sourceMappingURL=chunk-2AJ5JPL4.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/RadioBoxes/RadioBoxes.tsx","../src/RadioBoxes/RadioBox.tsx","../src/RadioBoxes/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useController, useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\nimport { RadioBox } from './RadioBox';\n\nexport const radioBoxesVariants = tv({\n slots: {\n base: 'group', // Needs group for group-data condition\n itemBase: '',\n itemControl: 'bg-focus group-data-[invalid=true]:bg-danger',\n itemDescription: '',\n itemLabel: 'text-sm',\n itemLabelWrapper: '',\n itemWrapper:\n 'group-data-[invalid=true]:!border-danger [&:not(group-data-[invalid=\"true\"]):not(group-data-[selected=\"false\"])]:border-focus', // TODO: get rid of !.\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-foreground group-data-[invalid=true]:text-danger text-sm subpixel-antialiased',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof radioBoxesVariants>;\ntype ClassName = TVClassName<typeof radioBoxesVariants>;\n\nexport interface RadioBoxesOption {\n /** Description of the value. Works with variant radioBox. */\n description?: ReactNode;\n /** disables the option */\n disabled?: boolean;\n /** option label */\n label?: ReactNode;\n /** option icon */\n icon?: ReactNode;\n /** HTML data-testid attribute of the option */\n testId?: string;\n /** option value */\n value: string;\n}\n\nexport interface RadioBoxesProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** Determines if the Buttons are disabled or not. */\n disabled?: boolean;\n /** determines orientation of the Buttons. */\n inline?: boolean;\n /** Label displayed next to the RadioButton. */\n label?: ReactNode;\n /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n name: string;\n /** Radio button configuration. */\n options: RadioBoxesOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n}\n\n/**\n * RadioBoxes component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n */\nconst RadioBoxes = ({\n className = undefined,\n disabled = false,\n inline = false,\n label = undefined,\n name,\n options,\n testId: _testId = undefined,\n}: RadioBoxesProps): ReactElement => {\n const { control, debugMode, getFieldState, getValues } = useFormContext();\n\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const { field } = useController({ control, disabled, name });\n const { onChange, disabled: isDisabled, onBlur, ref } = field;\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label || showTestIdCopyButton;\n\n const variants = radioBoxesVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const itemClassNames = {\n base: classNames.itemBase,\n control: classNames.itemControl,\n description: classNames.itemDescription,\n label: classNames.itemLabel,\n labelWrapper: classNames.itemLabelWrapper,\n wrapper: classNames.itemWrapper,\n };\n\n return (\n <HeroRadioGroup\n classNames={classNames}\n // see HeroUI styles for group-data condition (data-invalid),\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n ref={ref}\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n defaultValue={getValues()[name]}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n name={name}\n onBlur={onBlur}\n orientation={inline ? 'horizontal' : 'vertical'}\n errorMessage={\n error && <FieldValidationError error={error} testId={testId} />\n }\n label={\n showLabel && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label>\n {label}\n {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n </label>\n )\n }\n >\n {options.map((option) => {\n if ('value' in option) {\n const optionTestId = slugify(\n `${testId}_option_${option.testId || option.value}`,\n { replaceDots: true },\n );\n return (\n <RadioBox\n key={option.value}\n classNames={itemClassNames}\n data-testid={optionTestId}\n description={option.description}\n icon={option.icon}\n isDisabled={isDisabled || option.disabled}\n onChange={onChange}\n value={option.value}\n >\n {option.label ? option.label : option.value}\n </RadioBox>\n );\n }\n return null;\n })}\n </HeroRadioGroup>\n );\n};\n\nexport default RadioBoxes;\n","import type { RadioProps as HeroRadioProps } from '@heroui/radio';\nimport type { ReactNode } from 'react';\n\nimport { useRadio } from '@heroui/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\ninterface RadioProps extends HeroRadioProps {\n /** icon for the option */\n icon?: ReactNode;\n}\n\nexport const RadioBox = ({ icon = undefined, ...props }: RadioProps) => {\n const {\n children,\n Component,\n description,\n getBaseProps,\n getControlProps,\n getInputProps,\n getLabelProps,\n getLabelWrapperProps,\n getWrapperProps,\n isDisabled,\n } = useRadio(props);\n\n return (\n <Component\n {...getBaseProps()}\n className={cn(\n 'group border-default hover:bg-content2 data-[selected=true]:border-focus inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 p-4',\n {\n // disabled styles\n 'opacity-disabled pointer-events-none': isDisabled,\n },\n )}\n >\n <VisuallyHidden>\n {}\n <input {...getInputProps()} />\n </VisuallyHidden>\n {}\n <span {...getWrapperProps()}>\n {}\n <span {...getControlProps()} />\n </span>\n {icon}\n <div\n {...getLabelWrapperProps()}\n className={cn(getLabelWrapperProps().className, 'grow')}\n >\n {}\n {children ? <span {...getLabelProps()}>{children}</span> : null}\n {description ? (\n <span className=\"text-small text-foreground opacity-70\">\n {description}\n </span>\n ) : null}\n </div>\n </Component>\n );\n};\n\nexport default RadioBox;\n","import RadioBoxes from './RadioBoxes';\n\nexport type { RadioBoxesProps } from './RadioBoxes';\n\nexport { RadioBoxes };\n\nexport default RadioBoxes;\n"],"mappings":"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","names":["jsx","jsxs","RadioBoxes_default"]}
1
+ {"version":3,"sources":["../src/RadioBoxes/RadioBoxes.tsx","../src/RadioBoxes/RadioBox.tsx","../src/RadioBoxes/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useController, useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\nimport { RadioBox } from './RadioBox';\n\nexport const radioBoxesVariants = tv({\n slots: {\n base: 'group', // Needs group for group-data condition\n itemBase: '',\n itemControl: 'bg-focus group-data-[invalid=true]:bg-danger',\n itemDescription: '',\n itemLabel: 'text-sm',\n itemLabelWrapper: '',\n itemWrapper:\n 'group-data-[invalid=true]:!border-danger [&:not(group-data-[invalid=\"true\"]):not(group-data-[selected=\"false\"])]:border-focus', // TODO: get rid of !.\n // see HeroUI styles for group-data condition,\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-foreground group-data-[invalid=true]:text-danger text-sm subpixel-antialiased',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof radioBoxesVariants>;\ntype ClassName = TVClassName<typeof radioBoxesVariants>;\n\nexport interface RadioBoxesOption {\n /** Description of the value. Works with variant radioBox. */\n description?: ReactNode;\n /** disables the option */\n disabled?: boolean;\n /** option label */\n label?: ReactNode;\n /** option icon */\n icon?: ReactNode;\n /** HTML data-testid attribute of the option */\n testId?: string;\n /** option value */\n value: string;\n}\n\nexport interface RadioBoxesProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** Determines if the Buttons are disabled or not. */\n disabled?: boolean;\n /** determines orientation of the Buttons. */\n inline?: boolean;\n /** Label displayed next to the RadioButton. */\n label?: ReactNode;\n /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n name: string;\n /** Radio button configuration. */\n options: RadioBoxesOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n}\n\n/**\n * RadioBoxes component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n */\nconst RadioBoxes = ({\n className = undefined,\n disabled = false,\n inline = false,\n label = undefined,\n name,\n options,\n testId: _testId = undefined,\n}: RadioBoxesProps): ReactElement => {\n const { control, debugMode, getFieldState, getValues } = useFormContext();\n\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const { field } = useController({ control, disabled, name });\n const { onChange, disabled: isDisabled, onBlur, ref } = field;\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label || showTestIdCopyButton;\n\n const variants = radioBoxesVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const itemClassNames = {\n base: classNames.itemBase,\n control: classNames.itemControl,\n description: classNames.itemDescription,\n label: classNames.itemLabel,\n labelWrapper: classNames.itemLabelWrapper,\n wrapper: classNames.itemWrapper,\n };\n\n return (\n <HeroRadioGroup\n classNames={classNames}\n // see HeroUI styles for group-data condition (data-invalid),\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n ref={ref}\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n defaultValue={getValues()[name]}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n name={name}\n onBlur={onBlur}\n orientation={inline ? 'horizontal' : 'vertical'}\n errorMessage={\n error && <FieldValidationError error={error} testId={testId} />\n }\n label={\n showLabel && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label>\n {label}\n {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n </label>\n )\n }\n >\n {options.map((option) => {\n if ('value' in option) {\n const optionTestId = slugify(\n `${testId}_option_${option.testId || option.value}`,\n { replaceDots: true },\n );\n return (\n <RadioBox\n key={option.value}\n classNames={itemClassNames}\n data-testid={optionTestId}\n description={option.description}\n icon={option.icon}\n isDisabled={isDisabled || option.disabled}\n onChange={onChange}\n value={option.value}\n >\n {option.label ? option.label : option.value}\n </RadioBox>\n );\n }\n return null;\n })}\n </HeroRadioGroup>\n );\n};\n\nexport default RadioBoxes;\n","import type { RadioProps as HeroRadioProps } from '@heroui/radio';\nimport type { ReactNode } from 'react';\n\nimport { useRadio } from '@heroui/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\ninterface RadioProps extends HeroRadioProps {\n /** icon for the option */\n icon?: ReactNode;\n}\n\nexport const RadioBox = ({ icon = undefined, ...props }: RadioProps) => {\n const {\n children,\n Component,\n description,\n getBaseProps,\n getControlProps,\n getInputProps,\n getLabelProps,\n getLabelWrapperProps,\n getWrapperProps,\n isDisabled,\n } = useRadio(props);\n\n return (\n <Component\n {...getBaseProps()}\n className={cn(\n 'group border-default hover:bg-content2 data-[selected=true]:border-focus inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 p-4',\n {\n // disabled styles\n 'opacity-disabled pointer-events-none': isDisabled,\n },\n )}\n >\n <VisuallyHidden>\n <input {...getInputProps()} />\n </VisuallyHidden>\n <span {...getWrapperProps()}>\n <span {...getControlProps()} />\n </span>\n {icon}\n <div\n {...getLabelWrapperProps()}\n className={cn(getLabelWrapperProps().className, 'grow')}\n >\n {children ? <span {...getLabelProps()}>{children}</span> : null}\n {description ? (\n <span className=\"text-small text-foreground opacity-70\">\n {description}\n </span>\n ) : null}\n </div>\n </Component>\n );\n};\n\nexport default RadioBox;\n","import RadioBoxes from './RadioBoxes';\n\nexport type { RadioBoxesProps } from './RadioBoxes';\n\nexport { RadioBoxes };\n\nexport default RadioBoxes;\n"],"mappings":"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","names":["jsx","jsxs","RadioBoxes_default"]}
@@ -42,16 +42,17 @@ var RadioTabs = ({
42
42
  const { field } = _chunkMAABMY3Pcjs.useController.call(void 0, { control, disabled, name });
43
43
  const { disabled: isDisabled, onBlur, onChange, ref, value } = field;
44
44
  const showTestIdCopyButton = debugMode === "debug-testids";
45
- const showLabel = label || showTestIdCopyButton;
45
+ const showLabel = label != null ? label : showTestIdCopyButton;
46
46
  const variants = radioTabsVariants();
47
47
  const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
48
48
  const tabOptions = options.map((option) => {
49
+ var _a, _b;
49
50
  return {
50
51
  content: option == null ? void 0 : option.content,
51
52
  disabled: option == null ? void 0 : option.disabled,
52
53
  key: option.value,
53
- label: (option == null ? void 0 : option.label) || (option == null ? void 0 : option.value),
54
- testId: _pixelutils.slugify.call(void 0, `option_${(option == null ? void 0 : option.testId) || (option == null ? void 0 : option.value)}`, {
54
+ label: (_a = option == null ? void 0 : option.label) != null ? _a : option == null ? void 0 : option.value,
55
+ testId: _pixelutils.slugify.call(void 0, `option_${(_b = option == null ? void 0 : option.testId) != null ? _b : option == null ? void 0 : option.value}`, {
55
56
  replaceDots: true
56
57
  })
57
58
  };
@@ -62,8 +63,8 @@ var RadioTabs = ({
62
63
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
63
64
  _radio.RadioGroup,
64
65
  {
65
- classNames,
66
66
  ref,
67
+ classNames,
67
68
  "data-invalid": invalid,
68
69
  "data-required": required,
69
70
  "data-testid": testId,
@@ -73,12 +74,14 @@ var RadioTabs = ({
73
74
  name,
74
75
  onBlur,
75
76
  orientation: inline ? "horizontal" : "vertical",
76
- errorMessage: error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkY3AB4GV6cjs.FieldValidationError_default, { error, testId }),
77
- label: showLabel && // eslint-disable-next-line jsx-a11y/label-has-associated-control
78
- /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "label", { children: [
79
- label,
80
- showTestIdCopyButton && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkOE5BOGGXcjs.FieldCopyTestIdButton_default, { testId })
81
- ] }),
77
+ errorMessage: error ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkY3AB4GV6cjs.FieldValidationError_default, { error, testId }) : void 0,
78
+ label: showLabel ? (
79
+ // eslint-disable-next-line jsx-a11y/label-has-associated-control
80
+ /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "label", { children: [
81
+ label,
82
+ showTestIdCopyButton ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkOE5BOGGXcjs.FieldCopyTestIdButton_default, { testId }) : null
83
+ ] })
84
+ ) : void 0,
82
85
  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
83
86
  _Tabs2.default,
84
87
  {
@@ -103,4 +106,4 @@ var RadioTabs_default2 = RadioTabs_default;
103
106
 
104
107
 
105
108
  exports.RadioTabs_default = RadioTabs_default; exports.RadioTabs_default2 = RadioTabs_default2;
106
- //# sourceMappingURL=chunk-N7BZIGW7.cjs.map
109
+ //# sourceMappingURL=chunk-6GE4JIPL.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-6GE4JIPL.cjs","../src/RadioTabs/RadioTabs.tsx","../src/RadioTabs/index.ts"],"names":[],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-6GE4JIPL.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { TabsProps } from '@fuf-stack/pixels';\nimport type { TabProps } from '@fuf-stack/pixels/Tabs';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\nimport Tabs from '@fuf-stack/pixels/Tabs';\n\nimport { useController, useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const radioTabsVariants = tv({\n slots: {\n base: 'group', // Needs group for group-data condition\n label:\n 'text-foreground group-data-[invalid=true]:text-danger text-sm subpixel-antialiased',\n wrapper: '',\n tabList: '',\n tab: '',\n tabContent: '',\n cursor: '',\n panel: '',\n },\n});\n\ntype VariantProps = TVProps<typeof radioTabsVariants>;\ntype ClassName = TVClassName<typeof radioTabsVariants>;\n\nexport interface RadioTabsOption {\n /** Optional content inside of the tab */\n content?: ReactNode;\n /** disables the option */\n disabled?: boolean;\n /** option label */\n label?: React.ReactNode;\n /** option icon */\n icon?: ReactNode;\n /** HTML data-testid attribute of the option */\n testId?: string;\n /** option value */\n value: string;\n}\n\nexport interface RadioTabsProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** Determines if the Buttons are disabled or not. */\n disabled?: boolean;\n /** determines orientation of the Buttons. */\n inline?: boolean;\n /** Label displayed next to the RadioButton. */\n label?: ReactNode;\n /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n name: string;\n /** Radio button configuration. */\n options: RadioTabsOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n /** How the RadioTabs should look like. */\n variant?: TabsProps['variant'];\n}\n\n/**\n * RadioTabs component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n * and [HeroUI Tabs](https://www.heroui.com//docs/components/tabs)\n */\nconst RadioTabs = ({\n className = undefined,\n disabled = false,\n inline = false,\n label = undefined,\n name,\n options,\n testId: _testId = undefined,\n variant = undefined,\n}: RadioTabsProps): ReactElement => {\n const { control, debugMode, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const { field } = useController({ control, disabled, name });\n const { disabled: isDisabled, onBlur, onChange, ref, value } = field;\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label ?? showTestIdCopyButton;\n\n const variants = radioTabsVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const tabOptions = options.map<TabProps>((option) => {\n return {\n content: option?.content,\n disabled: option?.disabled,\n key: option.value,\n label: option?.label ?? option?.value,\n testId: slugify(`option_${option?.testId ?? option?.value}`, {\n replaceDots: true,\n }),\n };\n });\n\n const disabledAllKeys: string[] | undefined = tabOptions?.map((option) => {\n return option.key as string;\n });\n\n return (\n <HeroRadioGroup\n ref={ref}\n classNames={classNames}\n // see HeroUI styles for group-data condition (data-invalid),\n // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n name={name}\n onBlur={onBlur}\n orientation={inline ? 'horizontal' : 'vertical'}\n errorMessage={\n error ? (\n <FieldValidationError error={error} testId={testId} />\n ) : undefined\n }\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 ) : null}\n </label>\n ) : undefined\n }\n >\n <Tabs\n disabledKeys={disabled ? disabledAllKeys : undefined}\n fullWidth={false}\n onSelectionChange={onChange}\n // make sure component is controlled\n selectedKey={value ?? ''}\n tabs={tabOptions}\n testId={testId}\n variant={variant}\n />\n </HeroRadioGroup>\n );\n};\n\nexport default RadioTabs;\n","import RadioTabs from './RadioTabs';\n\nexport type { RadioTabsProps } from './RadioTabs';\n\nexport { RadioTabs };\n\nexport default RadioTabs;\n"]}
@@ -7,6 +7,7 @@ import { cn, slugify } from "@fuf-stack/pixel-utils";
7
7
  import { Button } from "@fuf-stack/pixels";
8
8
  import { jsx } from "react/jsx-runtime";
9
9
  var SubmitButton = ({
10
+ ariaLabel = "Submit form",
10
11
  children = "Submit",
11
12
  className = void 0,
12
13
  color = "success",
@@ -22,6 +23,7 @@ var SubmitButton = ({
22
23
  return /* @__PURE__ */ jsx(
23
24
  Button,
24
25
  {
26
+ ariaLabel,
25
27
  className: cn(className),
26
28
  color,
27
29
  disabled: isSubmitting,
@@ -44,4 +46,4 @@ export {
44
46
  SubmitButton_default,
45
47
  SubmitButton_default2
46
48
  };
47
- //# sourceMappingURL=chunk-TIN5YJ4B.js.map
49
+ //# sourceMappingURL=chunk-DR7PZZFE.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"sourcesContent":["import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn, slugify } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../hooks';\n\nexport interface SubmitButtonProps {\n /** sets HTML aria-label attribute */\n ariaLabel?: string;\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** color of the submit button */\n color?: ButtonProps['color'];\n /** icon of the submit button */\n icon?: ButtonProps['icon'];\n /** If set loading animation is shown */\n loading?: boolean;\n /** size of the submit button */\n size?: ButtonProps['size'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n ariaLabel = 'Submit form',\n children = 'Submit',\n className = undefined,\n color = 'success',\n icon = undefined,\n loading = false,\n size = 'md',\n testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n const {\n formState: { isSubmitting },\n triggerSubmit,\n } = useFormContext();\n\n return (\n <Button\n ariaLabel={ariaLabel}\n className={cn(className)}\n color={color}\n disabled={isSubmitting}\n icon={icon}\n loading={loading || isSubmitting}\n // @ts-expect-error we use form context triggerSubmit\n // here so that submit button also works in special\n // scenarios (e.g. when used in modal)\n onClick={triggerSubmit}\n size={size}\n testId={slugify(testId, { replaceDots: true })}\n type=\"submit\"\n >\n {children}\n </Button>\n );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"],"mappings":";;;;;AAGA,SAAS,IAAI,eAAe;AAC5B,SAAS,cAAc;AA0CnB;AAhBJ,IAAM,eAAe,CAAC;AAAA,EACpB,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AACX,MAAyB;AACvB,QAAM;AAAA,IACJ,WAAW,EAAE,aAAa;AAAA,IAC1B;AAAA,EACF,IAAI,eAAe;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,SAAS;AAAA,MACvB;AAAA,MACA,UAAU;AAAA,MACV;AAAA,MACA,SAAS,WAAW;AAAA,MAIpB,SAAS;AAAA,MACT;AAAA,MACA,QAAQ,QAAQ,QAAQ,EAAE,aAAa,KAAK,CAAC;AAAA,MAC7C,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;;;AC5Df,IAAOA,wBAAQ;","names":["SubmitButton_default"]}
@@ -17,10 +17,22 @@ import {
17
17
 
18
18
  // src/Input/Input.tsx
19
19
  import { Input as HeroInput } from "@heroui/input";
20
- import { cn } from "@fuf-stack/pixel-utils";
20
+ import { tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
21
21
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
22
+ var inputVariants = tv({
23
+ slots: {
24
+ /** wrapper around the whole input */
25
+ base: "",
26
+ /** clear button */
27
+ clearButton: "",
28
+ /** actual input element */
29
+ input: "",
30
+ /** inner wrapper (HeroUI inputWrapper slot) */
31
+ inputWrapper: "bg-content1 group-data-[focus=true]:border-focus"
32
+ }
33
+ });
22
34
  var Input = ({
23
- className = void 0,
35
+ className: _className = void 0,
24
36
  clearable = false,
25
37
  debounceDelay = 300,
26
38
  disabled = false,
@@ -68,11 +80,12 @@ var Input = ({
68
80
  } : {};
69
81
  const showTestIdCopyButton = debugMode === "debug-testids";
70
82
  const showLabel = label != null ? label : showTestIdCopyButton;
83
+ const variants = inputVariants();
84
+ const classNames = variantsToClassNames(variants, _className, "base");
71
85
  return /* @__PURE__ */ jsx(
72
86
  HeroInput,
73
87
  __spreadValues({
74
88
  ref,
75
- className: cn(className),
76
89
  "data-testid": testId,
77
90
  endContent,
78
91
  isDisabled,
@@ -90,7 +103,10 @@ var Input = ({
90
103
  value,
91
104
  variant: "bordered",
92
105
  classNames: {
93
- inputWrapper: "bg-content1 group-data-[focus=true]:border-focus"
106
+ base: classNames.base,
107
+ clearButton: classNames.clearButton,
108
+ input: classNames.input,
109
+ inputWrapper: classNames.inputWrapper
94
110
  },
95
111
  errorMessage: error ? /* @__PURE__ */ jsx(FieldValidationError_default, { error, testId }) : null,
96
112
  label: showLabel ? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -109,4 +125,4 @@ export {
109
125
  Input_default,
110
126
  Input_default2
111
127
  };
112
- //# sourceMappingURL=chunk-Q3M6DUGC.js.map
128
+ //# sourceMappingURL=chunk-G3Y7AH3F.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\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useController, useFormContext, useInputValueDebounce } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\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;\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 disabled = false,\n endContent = undefined,\n label = undefined,\n name,\n onClear = undefined,\n placeholder = ' ',\n size = undefined,\n startContent = undefined,\n testId: _testId = undefined,\n transform = undefined,\n type = undefined,\n}: InputProps) => {\n const { control, debugMode, getFieldState, resetField } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const { field } = useController({\n control,\n disabled,\n name,\n });\n\n const {\n disabled: isDisabled,\n onChange: fieldOnChange,\n onBlur: fieldOnBlur,\n value: fieldValue,\n ref,\n } = field;\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 transform,\n type,\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 const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label ?? showTestIdCopyButton;\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 isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\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 // @ts-expect-error can be number for input type number\n value={value}\n variant=\"bordered\"\n classNames={{\n base: classNames.base,\n clearButton: classNames.clearButton,\n input: classNames.input,\n inputWrapper: classNames.inputWrapper,\n }}\n errorMessage={\n error ? <FieldValidationError error={error} testId={testId} /> : null\n }\n label={\n showLabel ? (\n <>\n {label}\n {showTestIdCopyButton ?? <FieldCopyTestIdButton testId={testId} />}\n </>\n ) : null\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;AAuJzB,SAIN,UAJM,KAIN,YAJM;AAhJT,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;AAAA,EACb,WAAW,aAAa;AAAA,EACxB,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,WAAW;AAAA,EACX,aAAa;AAAA,EACb,QAAQ;AAAA,EACR;AAAA,EACA,UAAU;AAAA,EACV,cAAc;AAAA,EACd,OAAO;AAAA,EACP,eAAe;AAAA,EACf,QAAQ,UAAU;AAAA,EAClB,YAAY;AAAA,EACZ,OAAO;AACT,MAAkB;AAChB,QAAM,EAAE,SAAS,WAAW,eAAe,WAAW,IAAI,eAAe;AACzE,QAAM,EAAE,OAAO,SAAS,UAAU,OAAO,IAAI,cAAc,MAAM,OAAO;AAExE,QAAM,EAAE,MAAM,IAAI,cAAc;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM;AAAA,IACJ,UAAU;AAAA,IACV,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,OAAO;AAAA,IACP;AAAA,EACF,IAAI;AAGJ,QAAM,EAAE,UAAU,QAAQ,MAAM,IAAI,sBAAsB;AAAA,IACxD;AAAA,IACA,QAAQ;AAAA,IACR,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,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;AAEP,QAAM,uBAAuB,cAAc;AAC3C,QAAM,YAAY,wBAAS;AAG3B,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,WAAW;AAAA,MACX,YAAY;AAAA,MACZ,gBAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA,MACA,SAAQ;AAAA,MACR,YAAY;AAAA,QACV,MAAM,WAAW;AAAA,QACjB,aAAa,WAAW;AAAA,QACxB,OAAO,WAAW;AAAA,QAClB,cAAc,WAAW;AAAA,MAC3B;AAAA,MACA,cACE,QAAQ,oBAAC,gCAAqB,OAAc,QAAgB,IAAK;AAAA,MAEnE,OACE,YACE,iCACG;AAAA;AAAA,QACA,sDAAwB,oBAAC,iCAAsB,QAAgB;AAAA,SAClE,IACE;AAAA,OAEF;AAAA,EACN;AAEJ;AAEA,IAAO,gBAAQ;;;ACvKf,IAAOA,iBAAQ;","names":["Input_default"]}