@fuf-stack/uniform 0.0.3 → 0.0.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 (41) hide show
  1. package/dist/Form/index.cjs +5 -143
  2. package/dist/Form/index.cjs.map +1 -1
  3. package/dist/Form/index.d.cts +8 -27
  4. package/dist/Form/index.d.ts +8 -27
  5. package/dist/Form/index.js +6 -144
  6. package/dist/Form/index.js.map +1 -1
  7. package/dist/Form-Bv0R3QNk.d.cts +29 -0
  8. package/dist/Form-Bv0R3QNk.d.ts +29 -0
  9. package/dist/Grid/index.cjs +5 -14
  10. package/dist/Grid/index.cjs.map +1 -1
  11. package/dist/Grid/index.d.cts +6 -15
  12. package/dist/Grid/index.d.ts +6 -15
  13. package/dist/Grid/index.js +5 -14
  14. package/dist/Grid/index.js.map +1 -1
  15. package/dist/Grid-DF3L9NF3.d.cts +17 -0
  16. package/dist/Grid-DF3L9NF3.d.ts +17 -0
  17. package/dist/SubmitButton/index.cjs +4 -3
  18. package/dist/SubmitButton/index.cjs.map +1 -1
  19. package/dist/SubmitButton/index.d.cts +2 -2
  20. package/dist/SubmitButton/index.d.ts +2 -2
  21. package/dist/SubmitButton/index.js +2 -1
  22. package/dist/SubmitButton/index.js.map +1 -1
  23. package/dist/chunk-4BELEHDQ.cjs +159 -0
  24. package/dist/chunk-4BELEHDQ.cjs.map +1 -0
  25. package/dist/chunk-4MEKDDB2.js +20 -0
  26. package/dist/chunk-4MEKDDB2.js.map +1 -0
  27. package/dist/chunk-6XKDXQ4A.js +159 -0
  28. package/dist/chunk-6XKDXQ4A.js.map +1 -0
  29. package/dist/chunk-ZPFKVKGV.cjs +20 -0
  30. package/dist/chunk-ZPFKVKGV.cjs.map +1 -0
  31. package/dist/index.cjs +13 -0
  32. package/dist/index.cjs.map +1 -0
  33. package/dist/index.d.cts +6 -0
  34. package/dist/index.d.ts +6 -0
  35. package/dist/index.js +13 -0
  36. package/dist/index.js.map +1 -0
  37. package/dist/partials/FieldCopyTestIdButton/index.cjs +3 -4
  38. package/dist/partials/FieldCopyTestIdButton/index.cjs.map +1 -1
  39. package/dist/partials/FieldCopyTestIdButton/index.js +1 -2
  40. package/dist/partials/FieldCopyTestIdButton/index.js.map +1 -1
  41. package/package.json +20 -9
@@ -7,7 +7,7 @@ var _chunkBBB4FEY6cjs = require('../chunk-BBB4FEY6.cjs');
7
7
 
8
8
  // src/SubmitButton/SubmitButton.tsx
9
9
  var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
10
- var _Button = require('@fuf-stack/pixels/Button'); var _Button2 = _interopRequireDefault(_Button);
10
+ var _pixels = require('@fuf-stack/pixels');
11
11
  var _jsxruntime = require('react/jsx-runtime');
12
12
  var SubmitButton = ({
13
13
  children = "Submit",
@@ -21,7 +21,7 @@ var SubmitButton = ({
21
21
  formState: { isValid, isSubmitting, isValidating }
22
22
  } = _chunkWQRM7G4Ccjs.useFormContext.call(void 0, );
23
23
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
24
- _Button2.default,
24
+ _pixels.Button,
25
25
  {
26
26
  className: _classnames2.default.call(void 0, className),
27
27
  color,
@@ -40,5 +40,6 @@ var SubmitButton_default = SubmitButton;
40
40
  var SubmitButton_default2 = SubmitButton_default;
41
41
 
42
42
 
43
- exports.default = SubmitButton_default2;
43
+
44
+ exports.SubmitButton = SubmitButton_default; exports.default = SubmitButton_default2;
44
45
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/SubmitButton/SubmitButton.tsx","../../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":";;;;;;;;AAGA,OAAO,QAAQ;AAEf,OAAO,YAAY;AAoCf;AAbJ,IAAM,eAAe,CAAC;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AACX,MAAyB;AACvB,QAAM;AAAA,IACJ,WAAW,EAAE,SAAS,cAAc,aAAa;AAAA,EACnD,IAAI,eAAe;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,SAAS;AAAA,MACvB;AAAA,MACA,QAAQ,QAAQ,MAAM;AAAA,MACtB,UAAU,CAAC,WAAW,gBAAgB;AAAA,MACtC;AAAA,MACA;AAAA,MACA,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;;;ACrDf,IAAOA,wBAAQ","sourcesContent":["import type { ButtonProps } from '@fuf-stack/pixels/Button';\nimport type { ReactNode } from 'react';\n\nimport cn from 'classnames';\n\nimport Button from '@fuf-stack/pixels/Button';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\n\ninterface SubmitButtonProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string | string[];\n /** color of the button */\n color?: ButtonProps['color'];\n /** If set loading animation is shown */\n loading?: boolean;\n /** function called when the button is pressed. */\n onClick?: ButtonProps['onClick'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n children = 'Submit',\n className = undefined,\n color = 'success',\n loading = false,\n onClick = undefined,\n testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n const {\n formState: { isValid, isSubmitting, isValidating },\n } = useFormContext();\n\n return (\n <Button\n className={cn(className)}\n color={color}\n testId={slugify(testId)}\n disabled={!isValid || isSubmitting || isValidating}\n loading={loading}\n onClick={onClick}\n type=\"submit\"\n >\n {children}\n </Button>\n );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport default SubmitButton;\n"]}
1
+ {"version":3,"sources":["../../src/SubmitButton/SubmitButton.tsx","../../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":";;;;;;;;AAGA,OAAO,QAAQ;AAEf,SAAS,cAAc;AAoCnB;AAbJ,IAAM,eAAe,CAAC;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AACX,MAAyB;AACvB,QAAM;AAAA,IACJ,WAAW,EAAE,SAAS,cAAc,aAAa;AAAA,EACnD,IAAI,eAAe;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,SAAS;AAAA,MACvB;AAAA,MACA,QAAQ,QAAQ,MAAM;AAAA,MACtB,UAAU,CAAC,WAAW,gBAAgB;AAAA,MACtC;AAAA,MACA;AAAA,MACA,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;;;ACjDf,IAAOA,wBAAQ","sourcesContent":["import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport cn from 'classnames';\n\nimport { Button } from '@fuf-stack/pixels';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\n\nexport interface SubmitButtonProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string | string[];\n /** color of the button */\n color?: ButtonProps['color'];\n /** If set loading animation is shown */\n loading?: boolean;\n /** function called when the button is pressed. */\n onClick?: ButtonProps['onClick'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n children = 'Submit',\n className = undefined,\n color = 'success',\n loading = false,\n onClick = undefined,\n testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n const {\n formState: { isValid, isSubmitting, isValidating },\n } = useFormContext();\n\n return (\n <Button\n className={cn(className)}\n color={color}\n testId={slugify(testId)}\n disabled={!isValid || isSubmitting || isValidating}\n loading={loading}\n onClick={onClick}\n type=\"submit\"\n >\n {children}\n </Button>\n );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"]}
@@ -1,5 +1,5 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { ButtonProps } from '@fuf-stack/pixels/Button';
2
+ import { ButtonProps } from '@fuf-stack/pixels';
3
3
  import { ReactNode } from 'react';
4
4
 
5
5
  interface SubmitButtonProps {
@@ -21,4 +21,4 @@ interface SubmitButtonProps {
21
21
  */
22
22
  declare const SubmitButton: ({ children, className, color, loading, onClick, testId, }: SubmitButtonProps) => react_jsx_runtime.JSX.Element;
23
23
 
24
- export { SubmitButton as default };
24
+ export { SubmitButton, type SubmitButtonProps, SubmitButton as default };
@@ -1,5 +1,5 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { ButtonProps } from '@fuf-stack/pixels/Button';
2
+ import { ButtonProps } from '@fuf-stack/pixels';
3
3
  import { ReactNode } from 'react';
4
4
 
5
5
  interface SubmitButtonProps {
@@ -21,4 +21,4 @@ interface SubmitButtonProps {
21
21
  */
22
22
  declare const SubmitButton: ({ children, className, color, loading, onClick, testId, }: SubmitButtonProps) => react_jsx_runtime.JSX.Element;
23
23
 
24
- export { SubmitButton as default };
24
+ export { SubmitButton, type SubmitButtonProps, SubmitButton as default };
@@ -7,7 +7,7 @@ import {
7
7
 
8
8
  // src/SubmitButton/SubmitButton.tsx
9
9
  import cn from "classnames";
10
- import Button from "@fuf-stack/pixels/Button";
10
+ import { Button } from "@fuf-stack/pixels";
11
11
  import { jsx } from "react/jsx-runtime";
12
12
  var SubmitButton = ({
13
13
  children = "Submit",
@@ -39,6 +39,7 @@ var SubmitButton_default = SubmitButton;
39
39
  // src/SubmitButton/index.ts
40
40
  var SubmitButton_default2 = SubmitButton_default;
41
41
  export {
42
+ SubmitButton_default as SubmitButton,
42
43
  SubmitButton_default2 as default
43
44
  };
44
45
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/SubmitButton/SubmitButton.tsx","../../src/SubmitButton/index.ts"],"sourcesContent":["import type { ButtonProps } from '@fuf-stack/pixels/Button';\nimport type { ReactNode } from 'react';\n\nimport cn from 'classnames';\n\nimport Button from '@fuf-stack/pixels/Button';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\n\ninterface SubmitButtonProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string | string[];\n /** color of the button */\n color?: ButtonProps['color'];\n /** If set loading animation is shown */\n loading?: boolean;\n /** function called when the button is pressed. */\n onClick?: ButtonProps['onClick'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n children = 'Submit',\n className = undefined,\n color = 'success',\n loading = false,\n onClick = undefined,\n testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n const {\n formState: { isValid, isSubmitting, isValidating },\n } = useFormContext();\n\n return (\n <Button\n className={cn(className)}\n color={color}\n testId={slugify(testId)}\n disabled={!isValid || isSubmitting || isValidating}\n loading={loading}\n onClick={onClick}\n type=\"submit\"\n >\n {children}\n </Button>\n );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport default SubmitButton;\n"],"mappings":";;;;;;;;AAGA,OAAO,QAAQ;AAEf,OAAO,YAAY;AAoCf;AAbJ,IAAM,eAAe,CAAC;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AACX,MAAyB;AACvB,QAAM;AAAA,IACJ,WAAW,EAAE,SAAS,cAAc,aAAa;AAAA,EACnD,IAAI,eAAe;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,SAAS;AAAA,MACvB;AAAA,MACA,QAAQ,QAAQ,MAAM;AAAA,MACtB,UAAU,CAAC,WAAW,gBAAgB;AAAA,MACtC;AAAA,MACA;AAAA,MACA,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;;;ACrDf,IAAOA,wBAAQ;","names":["SubmitButton_default"]}
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 from 'classnames';\n\nimport { Button } from '@fuf-stack/pixels';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\n\nexport interface SubmitButtonProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string | string[];\n /** color of the button */\n color?: ButtonProps['color'];\n /** If set loading animation is shown */\n loading?: boolean;\n /** function called when the button is pressed. */\n onClick?: ButtonProps['onClick'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n children = 'Submit',\n className = undefined,\n color = 'success',\n loading = false,\n onClick = undefined,\n testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n const {\n formState: { isValid, isSubmitting, isValidating },\n } = useFormContext();\n\n return (\n <Button\n className={cn(className)}\n color={color}\n testId={slugify(testId)}\n disabled={!isValid || isSubmitting || isValidating}\n loading={loading}\n onClick={onClick}\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,OAAO,QAAQ;AAEf,SAAS,cAAc;AAoCnB;AAbJ,IAAM,eAAe,CAAC;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AACX,MAAyB;AACvB,QAAM;AAAA,IACJ,WAAW,EAAE,SAAS,cAAc,aAAa;AAAA,EACnD,IAAI,eAAe;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,SAAS;AAAA,MACvB;AAAA,MACA,QAAQ,QAAQ,MAAM;AAAA,MACtB,UAAU,CAAC,WAAW,gBAAgB;AAAA,MACtC;AAAA,MACA;AAAA,MACA,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;;;ACjDf,IAAOA,wBAAQ;","names":["SubmitButton_default"]}
@@ -0,0 +1,159 @@
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 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
+
3
+
4
+ var _chunkWQRM7G4Ccjs = require('./chunk-WQRM7G4C.cjs');
5
+
6
+
7
+ var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
8
+
9
+ // src/Form/Form.tsx
10
+ var _react = require('react');
11
+ var _reacthookform = require('react-hook-form');
12
+ var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
13
+
14
+ // src/Form/subcomponents/FormDebugViewer.tsx
15
+
16
+ var _fa = require('react-icons/fa');
17
+ var _fa6 = require('react-icons/fa6');
18
+
19
+ var _pixels = require('@fuf-stack/pixels');
20
+ var _jsxruntime = require('react/jsx-runtime');
21
+ var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
22
+ var FormDebugViewer = ({ className = void 0 }) => {
23
+ const {
24
+ watch,
25
+ formState: { dirtyFields, isValid, isSubmitting },
26
+ validation
27
+ } = _chunkWQRM7G4Ccjs.useFormContext.call(void 0, );
28
+ const [debug, setDebug] = _pixels.useLocalStorage.call(void 0, LOCALSTORAGE_DEBUG_KEY, false);
29
+ const [validationErrors, setValidationErrors] = _react.useState.call(void 0, null);
30
+ const formValues = watch();
31
+ _react.useEffect.call(void 0,
32
+ () => {
33
+ const updateValidationErrors = async () => {
34
+ if (validation) {
35
+ const validateResult = await _optionalChain([validation, 'optionalAccess', _ => _.validateAsync, 'call', _2 => _2(formValues)]);
36
+ setValidationErrors(_optionalChain([validateResult, 'optionalAccess', _3 => _3.errors]));
37
+ }
38
+ };
39
+ updateValidationErrors();
40
+ },
41
+ // eslint-disable-next-line react-hooks/exhaustive-deps
42
+ [JSON.stringify(formValues)]
43
+ );
44
+ if (!debug) {
45
+ return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
46
+ _pixels.Button,
47
+ {
48
+ ariaLabel: "Enable form debug mode",
49
+ onClick: () => setDebug(!debug),
50
+ className: "absolute bottom-2.5 right-2.5 w-5 text-default-400",
51
+ variant: "light",
52
+ icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa6.FaBug, {})
53
+ }
54
+ );
55
+ }
56
+ return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
57
+ _pixels.Card,
58
+ {
59
+ className: _classnames2.default.call(void 0, className),
60
+ header: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full flex-row justify-between", children: [
61
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-lg", children: "Debug Mode" }),
62
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
63
+ _pixels.Button,
64
+ {
65
+ icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa.FaTimes, { className: "text-danger" }),
66
+ onClick: () => setDebug(false),
67
+ size: "sm",
68
+ variant: "flat"
69
+ }
70
+ )
71
+ ] }),
72
+ children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
73
+ _pixels.Json,
74
+ {
75
+ value: {
76
+ values: formValues,
77
+ errors: validationErrors,
78
+ dirtyFields,
79
+ isValid,
80
+ isSubmitting
81
+ }
82
+ }
83
+ )
84
+ }
85
+ );
86
+ };
87
+ var FormDebugViewer_default = FormDebugViewer;
88
+
89
+ // src/Form/Form.tsx
90
+
91
+ var removeNullishFields = (obj) => {
92
+ return JSON.parse(
93
+ JSON.stringify(obj, (_key, value) => {
94
+ return value === null ? void 0 : value;
95
+ })
96
+ );
97
+ };
98
+ var Form = ({
99
+ children,
100
+ className = void 0,
101
+ initialValues = void 0,
102
+ name = void 0,
103
+ onSubmit,
104
+ testId = void 0,
105
+ validation = void 0,
106
+ validationTrigger = "all"
107
+ }) => {
108
+ const methods = _reacthookform.useForm.call(void 0,
109
+ validation ? {
110
+ defaultValues: initialValues,
111
+ resolver: async (values) => {
112
+ const { data, errors, ...rest } = await validation.validateAsync(
113
+ removeNullishFields(values)
114
+ );
115
+ return { values: data || {}, errors: errors || {}, ...rest };
116
+ },
117
+ // set rhf mode
118
+ // see: https://react-hook-form.com/docs/useform#mode
119
+ mode: validationTrigger === "all-instant" ? "all" : validationTrigger
120
+ } : {
121
+ defaultValues: initialValues
122
+ }
123
+ );
124
+ _react.useEffect.call(void 0,
125
+ () => {
126
+ if (validationTrigger === "all-instant") {
127
+ methods.trigger();
128
+ }
129
+ },
130
+ // eslint-disable-next-line react-hooks/exhaustive-deps
131
+ [validationTrigger]
132
+ );
133
+ return (
134
+ // eslint-disable-next-line react/jsx-props-no-spreading
135
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWQRM7G4Ccjs.FormContext_default, { ...methods, validation, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full flex-row justify-between gap-6", children: [
136
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
137
+ "form",
138
+ {
139
+ className: _classnames2.default.call(void 0, "flex-grow", className),
140
+ "data-testid": _chunkBBB4FEY6cjs.slugify.call(void 0, testId || name || ""),
141
+ name,
142
+ onSubmit: methods.handleSubmit(onSubmit),
143
+ children
144
+ }
145
+ ),
146
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FormDebugViewer_default, { className: "w-96 flex-shrink" })
147
+ ] }) })
148
+ );
149
+ };
150
+ var Form_default = Form;
151
+
152
+ // src/Form/index.ts
153
+ var Form_default2 = Form_default;
154
+
155
+
156
+
157
+
158
+ exports.Form_default = Form_default; exports.Form_default2 = Form_default2;
159
+ //# sourceMappingURL=chunk-4BELEHDQ.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Form/Form.tsx","../src/Form/subcomponents/FormDebugViewer.tsx","../src/Form/index.ts"],"names":["useEffect","cn","jsx","jsxs","Form_default"],"mappings":"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","sourcesContent":["import type { VetoInstance } from '@fuf-stack/veto';\nimport type { ReactNode } from 'react';\nimport type { FieldValues, SubmitHandler } from 'react-hook-form';\n\nimport { useEffect } from 'react';\nimport { useForm } from 'react-hook-form';\n\nimport cn from 'classnames';\n\nimport { slugify } from '../helpers';\nimport FormProvider from './subcomponents/FormContext';\nimport FormDebugViewer from './subcomponents/FormDebugViewer';\n\n/**\n * recursively removes all fields that are null or undefined before\n * the form data is passed to the veto validation function\n */\nexport const removeNullishFields = (obj: Record<string, unknown>) => {\n return JSON.parse(\n JSON.stringify(obj, (_key, value) => {\n return value === null ? undefined : value;\n }),\n );\n};\n\nexport interface FormProps {\n /** form children */\n children: ReactNode | ReactNode[];\n /** CSS class name */\n className?: string | string[];\n /** initial form values */\n initialValues?: FieldValues;\n /** name of the form */\n name?: string;\n /** form submit handler */\n onSubmit: SubmitHandler<FieldValues>;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** veto validation schema */\n validation?: VetoInstance;\n /** when the validation should be triggered */\n validationTrigger?:\n | 'onChange'\n | 'onBlur'\n | 'onSubmit'\n | 'onTouched'\n | 'all'\n | 'all-instant';\n}\n\n/**\n * Form component that has to wrap every uniform\n */\nconst Form = ({\n children,\n className = undefined,\n initialValues = undefined,\n name = undefined,\n onSubmit,\n testId = undefined,\n validation = undefined,\n validationTrigger = 'all',\n}: FormProps) => {\n const methods = useForm(\n validation\n ? {\n defaultValues: initialValues,\n resolver: async (values) => {\n const { data, errors, ...rest } = await validation.validateAsync(\n removeNullishFields(values),\n );\n // https://github.com/react-hook-form/resolvers/blob/master/zod/src/zod.ts\n return { values: data || {}, errors: errors || {}, ...rest };\n },\n // set rhf mode\n // see: https://react-hook-form.com/docs/useform#mode\n mode: validationTrigger === 'all-instant' ? 'all' : validationTrigger,\n }\n : {\n defaultValues: initialValues,\n },\n );\n\n useEffect(\n () => {\n if (validationTrigger === 'all-instant') {\n methods.trigger();\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [validationTrigger],\n );\n\n return (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <FormProvider {...methods} validation={validation}>\n <div className=\"flex w-full flex-row justify-between gap-6\">\n <form\n className={cn('flex-grow', className)}\n data-testid={slugify(testId || name || '')}\n name={name}\n onSubmit={methods.handleSubmit(onSubmit)}\n >\n {children}\n </form>\n <FormDebugViewer className=\"w-96 flex-shrink\" />\n </div>\n </FormProvider>\n );\n};\n\nexport default Form;\n","import type { VetoError } from '@fuf-stack/veto';\n\nimport { useEffect, useState } from 'react';\nimport { FaTimes } from 'react-icons/fa';\nimport { FaBug } from 'react-icons/fa6';\n\nimport cn from 'classnames';\n\nimport { Button, Card, Json, useLocalStorage } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../../hooks';\n\ninterface FormDebugViewerProps {\n /** CSS class name */\n className?: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\n/** Renders a form debug panel with information about the current form state */\nconst FormDebugViewer = ({ className = undefined }: FormDebugViewerProps) => {\n const {\n watch,\n formState: { dirtyFields, isValid, isSubmitting },\n validation,\n } = useFormContext();\n\n const [debug, setDebug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);\n\n const [validationErrors, setValidationErrors] = useState<\n VetoError['errors'] | null\n >(null);\n\n const formValues = watch();\n\n useEffect(\n () => {\n const updateValidationErrors = async () => {\n if (validation) {\n const validateResult = await validation?.validateAsync(formValues);\n setValidationErrors(validateResult?.errors);\n }\n };\n updateValidationErrors();\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [JSON.stringify(formValues)],\n );\n\n if (!debug) {\n return (\n <Button\n ariaLabel=\"Enable form debug mode\"\n onClick={() => setDebug(!debug)}\n className=\"absolute bottom-2.5 right-2.5 w-5 text-default-400\"\n variant=\"light\"\n icon={<FaBug />}\n />\n );\n }\n\n return (\n <Card\n className={cn(className)}\n header={\n <div className=\"flex w-full flex-row justify-between\">\n <span className=\"text-lg\">Debug Mode</span>\n <Button\n icon={<FaTimes className=\"text-danger\" />}\n onClick={() => setDebug(false)}\n size=\"sm\"\n variant=\"flat\"\n />\n </div>\n }\n >\n <Json\n value={{\n values: formValues,\n errors: validationErrors,\n dirtyFields,\n isValid,\n isSubmitting,\n }}\n />\n </Card>\n );\n};\nexport default FormDebugViewer;\n","import Form from './Form';\n\nexport type { FormProps } from './Form';\n\nexport { Form };\n\nexport default Form;\n"]}
@@ -0,0 +1,20 @@
1
+ // src/Grid/Grid.tsx
2
+ import cn from "classnames";
3
+ import { jsx } from "react/jsx-runtime";
4
+ var Grid = ({
5
+ children = null,
6
+ className = void 0,
7
+ testId = void 0
8
+ }) => {
9
+ return /* @__PURE__ */ jsx("div", { className: cn("grid gap-6", className), "data-testid": testId, children });
10
+ };
11
+ var Grid_default = Grid;
12
+
13
+ // src/Grid/index.ts
14
+ var Grid_default2 = Grid_default;
15
+
16
+ export {
17
+ Grid_default,
18
+ Grid_default2
19
+ };
20
+ //# sourceMappingURL=chunk-4MEKDDB2.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Grid/Grid.tsx","../src/Grid/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport cn from 'classnames';\n\nexport interface GridProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Defines the default grid for form components\n */\nconst Grid = ({\n children = null,\n className = undefined,\n testId = undefined,\n}: GridProps) => {\n return (\n <div className={cn('grid gap-6', className)} data-testid={testId}>\n {children}\n </div>\n );\n};\n\nexport default Grid;\n","import Grid from './Grid';\n\nexport type { GridProps } from './Grid';\n\nexport { Grid };\n\nexport default Grid;\n"],"mappings":";AAEA,OAAO,QAAQ;AAoBX;AANJ,IAAM,OAAO,CAAC;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,SAAS;AACX,MAAiB;AACf,SACE,oBAAC,SAAI,WAAW,GAAG,cAAc,SAAS,GAAG,eAAa,QACvD,UACH;AAEJ;AAEA,IAAO,eAAQ;;;ACtBf,IAAOA,gBAAQ;","names":["Grid_default"]}
@@ -0,0 +1,159 @@
1
+ import {
2
+ FormContext_default,
3
+ useFormContext
4
+ } from "./chunk-BCMPSLSG.js";
5
+ import {
6
+ slugify
7
+ } from "./chunk-V46BHM2U.js";
8
+
9
+ // src/Form/Form.tsx
10
+ import { useEffect as useEffect2 } from "react";
11
+ import { useForm } from "react-hook-form";
12
+ import cn2 from "classnames";
13
+
14
+ // src/Form/subcomponents/FormDebugViewer.tsx
15
+ import { useEffect, useState } from "react";
16
+ import { FaTimes } from "react-icons/fa";
17
+ import { FaBug } from "react-icons/fa6";
18
+ import cn from "classnames";
19
+ import { Button, Card, Json, useLocalStorage } from "@fuf-stack/pixels";
20
+ import { jsx, jsxs } from "react/jsx-runtime";
21
+ var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
22
+ var FormDebugViewer = ({ className = void 0 }) => {
23
+ const {
24
+ watch,
25
+ formState: { dirtyFields, isValid, isSubmitting },
26
+ validation
27
+ } = useFormContext();
28
+ const [debug, setDebug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);
29
+ const [validationErrors, setValidationErrors] = useState(null);
30
+ const formValues = watch();
31
+ useEffect(
32
+ () => {
33
+ const updateValidationErrors = async () => {
34
+ if (validation) {
35
+ const validateResult = await validation?.validateAsync(formValues);
36
+ setValidationErrors(validateResult?.errors);
37
+ }
38
+ };
39
+ updateValidationErrors();
40
+ },
41
+ // eslint-disable-next-line react-hooks/exhaustive-deps
42
+ [JSON.stringify(formValues)]
43
+ );
44
+ if (!debug) {
45
+ return /* @__PURE__ */ jsx(
46
+ Button,
47
+ {
48
+ ariaLabel: "Enable form debug mode",
49
+ onClick: () => setDebug(!debug),
50
+ className: "absolute bottom-2.5 right-2.5 w-5 text-default-400",
51
+ variant: "light",
52
+ icon: /* @__PURE__ */ jsx(FaBug, {})
53
+ }
54
+ );
55
+ }
56
+ return /* @__PURE__ */ jsx(
57
+ Card,
58
+ {
59
+ className: cn(className),
60
+ header: /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-row justify-between", children: [
61
+ /* @__PURE__ */ jsx("span", { className: "text-lg", children: "Debug Mode" }),
62
+ /* @__PURE__ */ jsx(
63
+ Button,
64
+ {
65
+ icon: /* @__PURE__ */ jsx(FaTimes, { className: "text-danger" }),
66
+ onClick: () => setDebug(false),
67
+ size: "sm",
68
+ variant: "flat"
69
+ }
70
+ )
71
+ ] }),
72
+ children: /* @__PURE__ */ jsx(
73
+ Json,
74
+ {
75
+ value: {
76
+ values: formValues,
77
+ errors: validationErrors,
78
+ dirtyFields,
79
+ isValid,
80
+ isSubmitting
81
+ }
82
+ }
83
+ )
84
+ }
85
+ );
86
+ };
87
+ var FormDebugViewer_default = FormDebugViewer;
88
+
89
+ // src/Form/Form.tsx
90
+ import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
91
+ var removeNullishFields = (obj) => {
92
+ return JSON.parse(
93
+ JSON.stringify(obj, (_key, value) => {
94
+ return value === null ? void 0 : value;
95
+ })
96
+ );
97
+ };
98
+ var Form = ({
99
+ children,
100
+ className = void 0,
101
+ initialValues = void 0,
102
+ name = void 0,
103
+ onSubmit,
104
+ testId = void 0,
105
+ validation = void 0,
106
+ validationTrigger = "all"
107
+ }) => {
108
+ const methods = useForm(
109
+ validation ? {
110
+ defaultValues: initialValues,
111
+ resolver: async (values) => {
112
+ const { data, errors, ...rest } = await validation.validateAsync(
113
+ removeNullishFields(values)
114
+ );
115
+ return { values: data || {}, errors: errors || {}, ...rest };
116
+ },
117
+ // set rhf mode
118
+ // see: https://react-hook-form.com/docs/useform#mode
119
+ mode: validationTrigger === "all-instant" ? "all" : validationTrigger
120
+ } : {
121
+ defaultValues: initialValues
122
+ }
123
+ );
124
+ useEffect2(
125
+ () => {
126
+ if (validationTrigger === "all-instant") {
127
+ methods.trigger();
128
+ }
129
+ },
130
+ // eslint-disable-next-line react-hooks/exhaustive-deps
131
+ [validationTrigger]
132
+ );
133
+ return (
134
+ // eslint-disable-next-line react/jsx-props-no-spreading
135
+ /* @__PURE__ */ jsx2(FormContext_default, { ...methods, validation, children: /* @__PURE__ */ jsxs2("div", { className: "flex w-full flex-row justify-between gap-6", children: [
136
+ /* @__PURE__ */ jsx2(
137
+ "form",
138
+ {
139
+ className: cn2("flex-grow", className),
140
+ "data-testid": slugify(testId || name || ""),
141
+ name,
142
+ onSubmit: methods.handleSubmit(onSubmit),
143
+ children
144
+ }
145
+ ),
146
+ /* @__PURE__ */ jsx2(FormDebugViewer_default, { className: "w-96 flex-shrink" })
147
+ ] }) })
148
+ );
149
+ };
150
+ var Form_default = Form;
151
+
152
+ // src/Form/index.ts
153
+ var Form_default2 = Form_default;
154
+
155
+ export {
156
+ Form_default,
157
+ Form_default2
158
+ };
159
+ //# sourceMappingURL=chunk-6XKDXQ4A.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Form/Form.tsx","../src/Form/subcomponents/FormDebugViewer.tsx","../src/Form/index.ts"],"sourcesContent":["import type { VetoInstance } from '@fuf-stack/veto';\nimport type { ReactNode } from 'react';\nimport type { FieldValues, SubmitHandler } from 'react-hook-form';\n\nimport { useEffect } from 'react';\nimport { useForm } from 'react-hook-form';\n\nimport cn from 'classnames';\n\nimport { slugify } from '../helpers';\nimport FormProvider from './subcomponents/FormContext';\nimport FormDebugViewer from './subcomponents/FormDebugViewer';\n\n/**\n * recursively removes all fields that are null or undefined before\n * the form data is passed to the veto validation function\n */\nexport const removeNullishFields = (obj: Record<string, unknown>) => {\n return JSON.parse(\n JSON.stringify(obj, (_key, value) => {\n return value === null ? undefined : value;\n }),\n );\n};\n\nexport interface FormProps {\n /** form children */\n children: ReactNode | ReactNode[];\n /** CSS class name */\n className?: string | string[];\n /** initial form values */\n initialValues?: FieldValues;\n /** name of the form */\n name?: string;\n /** form submit handler */\n onSubmit: SubmitHandler<FieldValues>;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** veto validation schema */\n validation?: VetoInstance;\n /** when the validation should be triggered */\n validationTrigger?:\n | 'onChange'\n | 'onBlur'\n | 'onSubmit'\n | 'onTouched'\n | 'all'\n | 'all-instant';\n}\n\n/**\n * Form component that has to wrap every uniform\n */\nconst Form = ({\n children,\n className = undefined,\n initialValues = undefined,\n name = undefined,\n onSubmit,\n testId = undefined,\n validation = undefined,\n validationTrigger = 'all',\n}: FormProps) => {\n const methods = useForm(\n validation\n ? {\n defaultValues: initialValues,\n resolver: async (values) => {\n const { data, errors, ...rest } = await validation.validateAsync(\n removeNullishFields(values),\n );\n // https://github.com/react-hook-form/resolvers/blob/master/zod/src/zod.ts\n return { values: data || {}, errors: errors || {}, ...rest };\n },\n // set rhf mode\n // see: https://react-hook-form.com/docs/useform#mode\n mode: validationTrigger === 'all-instant' ? 'all' : validationTrigger,\n }\n : {\n defaultValues: initialValues,\n },\n );\n\n useEffect(\n () => {\n if (validationTrigger === 'all-instant') {\n methods.trigger();\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [validationTrigger],\n );\n\n return (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <FormProvider {...methods} validation={validation}>\n <div className=\"flex w-full flex-row justify-between gap-6\">\n <form\n className={cn('flex-grow', className)}\n data-testid={slugify(testId || name || '')}\n name={name}\n onSubmit={methods.handleSubmit(onSubmit)}\n >\n {children}\n </form>\n <FormDebugViewer className=\"w-96 flex-shrink\" />\n </div>\n </FormProvider>\n );\n};\n\nexport default Form;\n","import type { VetoError } from '@fuf-stack/veto';\n\nimport { useEffect, useState } from 'react';\nimport { FaTimes } from 'react-icons/fa';\nimport { FaBug } from 'react-icons/fa6';\n\nimport cn from 'classnames';\n\nimport { Button, Card, Json, useLocalStorage } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../../hooks';\n\ninterface FormDebugViewerProps {\n /** CSS class name */\n className?: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\n/** Renders a form debug panel with information about the current form state */\nconst FormDebugViewer = ({ className = undefined }: FormDebugViewerProps) => {\n const {\n watch,\n formState: { dirtyFields, isValid, isSubmitting },\n validation,\n } = useFormContext();\n\n const [debug, setDebug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);\n\n const [validationErrors, setValidationErrors] = useState<\n VetoError['errors'] | null\n >(null);\n\n const formValues = watch();\n\n useEffect(\n () => {\n const updateValidationErrors = async () => {\n if (validation) {\n const validateResult = await validation?.validateAsync(formValues);\n setValidationErrors(validateResult?.errors);\n }\n };\n updateValidationErrors();\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [JSON.stringify(formValues)],\n );\n\n if (!debug) {\n return (\n <Button\n ariaLabel=\"Enable form debug mode\"\n onClick={() => setDebug(!debug)}\n className=\"absolute bottom-2.5 right-2.5 w-5 text-default-400\"\n variant=\"light\"\n icon={<FaBug />}\n />\n );\n }\n\n return (\n <Card\n className={cn(className)}\n header={\n <div className=\"flex w-full flex-row justify-between\">\n <span className=\"text-lg\">Debug Mode</span>\n <Button\n icon={<FaTimes className=\"text-danger\" />}\n onClick={() => setDebug(false)}\n size=\"sm\"\n variant=\"flat\"\n />\n </div>\n }\n >\n <Json\n value={{\n values: formValues,\n errors: validationErrors,\n dirtyFields,\n isValid,\n isSubmitting,\n }}\n />\n </Card>\n );\n};\nexport default FormDebugViewer;\n","import Form from './Form';\n\nexport type { FormProps } from './Form';\n\nexport { Form };\n\nexport default Form;\n"],"mappings":";;;;;;;;;AAIA,SAAS,aAAAA,kBAAiB;AAC1B,SAAS,eAAe;AAExB,OAAOC,SAAQ;;;ACLf,SAAS,WAAW,gBAAgB;AACpC,SAAS,eAAe;AACxB,SAAS,aAAa;AAEtB,OAAO,QAAQ;AAEf,SAAS,QAAQ,MAAM,MAAM,uBAAuB;AAgDtC,cASN,YATM;AAvCd,IAAM,yBAAyB;AAG/B,IAAM,kBAAkB,CAAC,EAAE,YAAY,OAAU,MAA4B;AAC3E,QAAM;AAAA,IACJ;AAAA,IACA,WAAW,EAAE,aAAa,SAAS,aAAa;AAAA,IAChD;AAAA,EACF,IAAI,eAAe;AAEnB,QAAM,CAAC,OAAO,QAAQ,IAAI,gBAAgB,wBAAwB,KAAK;AAEvE,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAE9C,IAAI;AAEN,QAAM,aAAa,MAAM;AAEzB;AAAA,IACE,MAAM;AACJ,YAAM,yBAAyB,YAAY;AACzC,YAAI,YAAY;AACd,gBAAM,iBAAiB,MAAM,YAAY,cAAc,UAAU;AACjE,8BAAoB,gBAAgB,MAAM;AAAA,QAC5C;AAAA,MACF;AACA,6BAAuB;AAAA,IACzB;AAAA;AAAA,IAEA,CAAC,KAAK,UAAU,UAAU,CAAC;AAAA,EAC7B;AAEA,MAAI,CAAC,OAAO;AACV,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,SAAS,MAAM,SAAS,CAAC,KAAK;AAAA,QAC9B,WAAU;AAAA,QACV,SAAQ;AAAA,QACR,MAAM,oBAAC,SAAM;AAAA;AAAA,IACf;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,SAAS;AAAA,MACvB,QACE,qBAAC,SAAI,WAAU,wCACb;AAAA,4BAAC,UAAK,WAAU,WAAU,wBAAU;AAAA,QACpC;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,oBAAC,WAAQ,WAAU,eAAc;AAAA,YACvC,SAAS,MAAM,SAAS,KAAK;AAAA,YAC7B,MAAK;AAAA,YACL,SAAQ;AAAA;AAAA,QACV;AAAA,SACF;AAAA,MAGF;AAAA,QAAC;AAAA;AAAA,UACC,OAAO;AAAA,YACL,QAAQ;AAAA,YACR,QAAQ;AAAA,YACR;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AACA,IAAO,0BAAQ;;;ADQT,SACE,OAAAC,MADF,QAAAC,aAAA;AA/EC,IAAM,sBAAsB,CAAC,QAAiC;AACnE,SAAO,KAAK;AAAA,IACV,KAAK,UAAU,KAAK,CAAC,MAAM,UAAU;AACnC,aAAO,UAAU,OAAO,SAAY;AAAA,IACtC,CAAC;AAAA,EACH;AACF;AA8BA,IAAM,OAAO,CAAC;AAAA,EACZ;AAAA,EACA,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,OAAO;AAAA,EACP;AAAA,EACA,SAAS;AAAA,EACT,aAAa;AAAA,EACb,oBAAoB;AACtB,MAAiB;AACf,QAAM,UAAU;AAAA,IACd,aACI;AAAA,MACE,eAAe;AAAA,MACf,UAAU,OAAO,WAAW;AAC1B,cAAM,EAAE,MAAM,QAAQ,GAAG,KAAK,IAAI,MAAM,WAAW;AAAA,UACjD,oBAAoB,MAAM;AAAA,QAC9B;AAEE,eAAO,EAAE,QAAQ,QAAQ,CAAC,GAAG,QAAQ,UAAU,CAAC,GAAG,GAAG,KAAK;AAAA,MAC7D;AAAA;AAAA;AAAA,MAGA,MAAM,sBAAsB,gBAAgB,QAAQ;AAAA,IACtD,IACA;AAAA,MACE,eAAe;AAAA,IACjB;AAAA,EACN;AAEA,EAAAC;AAAA,IACE,MAAM;AACJ,UAAI,sBAAsB,eAAe;AACvC,gBAAQ,QAAQ;AAAA,MAClB;AAAA,IACF;AAAA;AAAA,IAEA,CAAC,iBAAiB;AAAA,EACpB;AAEA;AAAA;AAAA,IAEE,gBAAAF,KAAC,uBAAc,GAAG,SAAS,YACzB,0BAAAC,MAAC,SAAI,WAAU,8CACb;AAAA,sBAAAD;AAAA,QAAC;AAAA;AAAA,UACC,WAAWG,IAAG,aAAa,SAAS;AAAA,UACpC,eAAa,QAAQ,UAAU,QAAQ,EAAE;AAAA,UACzC;AAAA,UACA,UAAU,QAAQ,aAAa,QAAQ;AAAA,UAEtC;AAAA;AAAA,MACH;AAAA,MACA,gBAAAH,KAAC,2BAAgB,WAAU,oBAAmB;AAAA,OAChD,GACF;AAAA;AAEJ;AAEA,IAAO,eAAQ;;;AEzGf,IAAOI,gBAAQ;","names":["useEffect","cn","jsx","jsxs","useEffect","cn","Form_default"]}
@@ -0,0 +1,20 @@
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }// src/Grid/Grid.tsx
2
+ var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
3
+ var _jsxruntime = require('react/jsx-runtime');
4
+ var Grid = ({
5
+ children = null,
6
+ className = void 0,
7
+ testId = void 0
8
+ }) => {
9
+ return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _classnames2.default.call(void 0, "grid gap-6", className), "data-testid": testId, children });
10
+ };
11
+ var Grid_default = Grid;
12
+
13
+ // src/Grid/index.ts
14
+ var Grid_default2 = Grid_default;
15
+
16
+
17
+
18
+
19
+ exports.Grid_default = Grid_default; exports.Grid_default2 = Grid_default2;
20
+ //# sourceMappingURL=chunk-ZPFKVKGV.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Grid/Grid.tsx","../src/Grid/index.ts"],"names":["Grid_default"],"mappings":";AAEA,OAAO,QAAQ;AAoBX;AANJ,IAAM,OAAO,CAAC;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,SAAS;AACX,MAAiB;AACf,SACE,oBAAC,SAAI,WAAW,GAAG,cAAc,SAAS,GAAG,eAAa,QACvD,UACH;AAEJ;AAEA,IAAO,eAAQ;;;ACtBf,IAAOA,gBAAQ","sourcesContent":["import type { ReactNode } from 'react';\n\nimport cn from 'classnames';\n\nexport interface GridProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Defines the default grid for form components\n */\nconst Grid = ({\n children = null,\n className = undefined,\n testId = undefined,\n}: GridProps) => {\n return (\n <div className={cn('grid gap-6', className)} data-testid={testId}>\n {children}\n </div>\n );\n};\n\nexport default Grid;\n","import Grid from './Grid';\n\nexport type { GridProps } from './Grid';\n\nexport { Grid };\n\nexport default Grid;\n"]}
package/dist/index.cjs ADDED
@@ -0,0 +1,13 @@
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
+
3
+ var _chunk4BELEHDQcjs = require('./chunk-4BELEHDQ.cjs');
4
+
5
+
6
+ var _chunkZPFKVKGVcjs = require('./chunk-ZPFKVKGV.cjs');
7
+ require('./chunk-WQRM7G4C.cjs');
8
+ require('./chunk-BBB4FEY6.cjs');
9
+
10
+
11
+
12
+ exports.Form = _chunk4BELEHDQcjs.Form_default; exports.Grid = _chunkZPFKVKGVcjs.Grid_default;
13
+ //# sourceMappingURL=index.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":""}
@@ -0,0 +1,6 @@
1
+ export { F as Form, a as FormProps } from './Form-Bv0R3QNk.cjs';
2
+ export { G as Grid, a as GridProps } from './Grid-DF3L9NF3.cjs';
3
+ import 'react/jsx-runtime';
4
+ import '@fuf-stack/veto';
5
+ import 'react';
6
+ import 'react-hook-form';
@@ -0,0 +1,6 @@
1
+ export { F as Form, a as FormProps } from './Form-Bv0R3QNk.js';
2
+ export { G as Grid, a as GridProps } from './Grid-DF3L9NF3.js';
3
+ import 'react/jsx-runtime';
4
+ import '@fuf-stack/veto';
5
+ import 'react';
6
+ import 'react-hook-form';
package/dist/index.js ADDED
@@ -0,0 +1,13 @@
1
+ import {
2
+ Form_default
3
+ } from "./chunk-6XKDXQ4A.js";
4
+ import {
5
+ Grid_default
6
+ } from "./chunk-4MEKDDB2.js";
7
+ import "./chunk-BCMPSLSG.js";
8
+ import "./chunk-V46BHM2U.js";
9
+ export {
10
+ Form_default as Form,
11
+ Grid_default as Grid
12
+ };
13
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
@@ -1,12 +1,11 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }// src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx
2
2
  var _fa6 = require('react-icons/fa6');
3
3
  var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
4
- var _Button = require('@fuf-stack/pixels/Button'); var _Button2 = _interopRequireDefault(_Button);
5
- var _useLocalStorage = require('@fuf-stack/pixels/hooks/useLocalStorage'); var _useLocalStorage2 = _interopRequireDefault(_useLocalStorage);
4
+ var _pixels = require('@fuf-stack/pixels');
6
5
  var _jsxruntime = require('react/jsx-runtime');
7
6
  var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
8
7
  var TestIdDebug = ({ className = void 0, testId }) => {
9
- const [debug] = _useLocalStorage2.default.call(void 0, LOCALSTORAGE_DEBUG_KEY, false);
8
+ const [debug] = _pixels.useLocalStorage.call(void 0, LOCALSTORAGE_DEBUG_KEY, false);
10
9
  const copyToClipboard = () => {
11
10
  navigator.clipboard.writeText(testId).catch((err) => {
12
11
  console.error("Error copying TestId to clipboard", err);
@@ -16,7 +15,7 @@ var TestIdDebug = ({ className = void 0, testId }) => {
16
15
  return null;
17
16
  }
18
17
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
19
- _Button2.default,
18
+ _pixels.Button,
20
19
  {
21
20
  className: _classnames2.default.call(void 0, className, "pointer-events-auto"),
22
21
  variant: "light",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx","../../../src/partials/FieldCopyTestIdButton/index.ts"],"names":["FieldCopyTestIdButton_default"],"mappings":";AAAA,SAAS,kBAAkB;AAE3B,OAAO,QAAQ;AAEf,OAAO,YAAY;AACnB,OAAO,qBAAqB;AA2BhB;AApBZ,IAAM,yBAAyB;AAE/B,IAAM,cAAc,CAAC,EAAE,YAAY,QAAW,OAAO,MAAsB;AACzE,QAAM,CAAC,KAAK,IAAI,gBAAgB,wBAAwB,KAAK;AAE7D,QAAM,kBAAkB,MAAM;AAC5B,cAAU,UAAU,UAAU,MAAM,EAAE,MAAM,CAAC,QAAQ;AACnD,cAAQ,MAAM,qCAAqC,GAAG;AAAA,IACxD,CAAC;AAAA,EACH;AAEA,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,WAAW,qBAAqB;AAAA,MAC9C,SAAQ;AAAA,MACR,SAAS;AAAA,MACT,MAAM,oBAAC,cAAW;AAAA,MAClB,MAAK;AAAA;AAAA,EACP;AAEJ;AACA,IAAO,gCAAQ;;;ACnCf,IAAOA,iCAAQ","sourcesContent":["import { FaBullseye } from 'react-icons/fa6';\n\nimport cn from 'classnames';\n\nimport Button from '@fuf-stack/pixels/Button';\nimport useLocalStorage from '@fuf-stack/pixels/hooks/useLocalStorage';\n\ninterface FormDebugProps {\n className?: string;\n testId: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\nconst TestIdDebug = ({ className = undefined, testId }: FormDebugProps) => {\n const [debug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);\n\n const copyToClipboard = () => {\n navigator.clipboard.writeText(testId).catch((err) => {\n console.error('Error copying TestId to clipboard', err);\n });\n };\n\n if (!debug) {\n return null;\n }\n\n return (\n <Button\n className={cn(className, 'pointer-events-auto')}\n variant=\"light\"\n onClick={copyToClipboard}\n icon={<FaBullseye />}\n size=\"sm\"\n />\n );\n};\nexport default TestIdDebug;\n","import FieldCopyTestIdButton from './FieldCopyTestIdButton';\n\nexport default FieldCopyTestIdButton;\n"]}
1
+ {"version":3,"sources":["../../../src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx","../../../src/partials/FieldCopyTestIdButton/index.ts"],"names":["FieldCopyTestIdButton_default"],"mappings":";AAAA,SAAS,kBAAkB;AAE3B,OAAO,QAAQ;AAEf,SAAS,QAAQ,uBAAuB;AA2B5B;AApBZ,IAAM,yBAAyB;AAE/B,IAAM,cAAc,CAAC,EAAE,YAAY,QAAW,OAAO,MAAsB;AACzE,QAAM,CAAC,KAAK,IAAI,gBAAgB,wBAAwB,KAAK;AAE7D,QAAM,kBAAkB,MAAM;AAC5B,cAAU,UAAU,UAAU,MAAM,EAAE,MAAM,CAAC,QAAQ;AACnD,cAAQ,MAAM,qCAAqC,GAAG;AAAA,IACxD,CAAC;AAAA,EACH;AAEA,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,WAAW,qBAAqB;AAAA,MAC9C,SAAQ;AAAA,MACR,SAAS;AAAA,MACT,MAAM,oBAAC,cAAW;AAAA,MAClB,MAAK;AAAA;AAAA,EACP;AAEJ;AACA,IAAO,gCAAQ;;;AClCf,IAAOA,iCAAQ","sourcesContent":["import { FaBullseye } from 'react-icons/fa6';\n\nimport cn from 'classnames';\n\nimport { Button, useLocalStorage } from '@fuf-stack/pixels';\n\ninterface FormDebugProps {\n className?: string;\n testId: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\nconst TestIdDebug = ({ className = undefined, testId }: FormDebugProps) => {\n const [debug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);\n\n const copyToClipboard = () => {\n navigator.clipboard.writeText(testId).catch((err) => {\n console.error('Error copying TestId to clipboard', err);\n });\n };\n\n if (!debug) {\n return null;\n }\n\n return (\n <Button\n className={cn(className, 'pointer-events-auto')}\n variant=\"light\"\n onClick={copyToClipboard}\n icon={<FaBullseye />}\n size=\"sm\"\n />\n );\n};\nexport default TestIdDebug;\n","import FieldCopyTestIdButton from './FieldCopyTestIdButton';\n\nexport default FieldCopyTestIdButton;\n"]}
@@ -1,8 +1,7 @@
1
1
  // src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx
2
2
  import { FaBullseye } from "react-icons/fa6";
3
3
  import cn from "classnames";
4
- import Button from "@fuf-stack/pixels/Button";
5
- import useLocalStorage from "@fuf-stack/pixels/hooks/useLocalStorage";
4
+ import { Button, useLocalStorage } from "@fuf-stack/pixels";
6
5
  import { jsx } from "react/jsx-runtime";
7
6
  var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
8
7
  var TestIdDebug = ({ className = void 0, testId }) => {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx","../../../src/partials/FieldCopyTestIdButton/index.ts"],"sourcesContent":["import { FaBullseye } from 'react-icons/fa6';\n\nimport cn from 'classnames';\n\nimport Button from '@fuf-stack/pixels/Button';\nimport useLocalStorage from '@fuf-stack/pixels/hooks/useLocalStorage';\n\ninterface FormDebugProps {\n className?: string;\n testId: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\nconst TestIdDebug = ({ className = undefined, testId }: FormDebugProps) => {\n const [debug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);\n\n const copyToClipboard = () => {\n navigator.clipboard.writeText(testId).catch((err) => {\n console.error('Error copying TestId to clipboard', err);\n });\n };\n\n if (!debug) {\n return null;\n }\n\n return (\n <Button\n className={cn(className, 'pointer-events-auto')}\n variant=\"light\"\n onClick={copyToClipboard}\n icon={<FaBullseye />}\n size=\"sm\"\n />\n );\n};\nexport default TestIdDebug;\n","import FieldCopyTestIdButton from './FieldCopyTestIdButton';\n\nexport default FieldCopyTestIdButton;\n"],"mappings":";AAAA,SAAS,kBAAkB;AAE3B,OAAO,QAAQ;AAEf,OAAO,YAAY;AACnB,OAAO,qBAAqB;AA2BhB;AApBZ,IAAM,yBAAyB;AAE/B,IAAM,cAAc,CAAC,EAAE,YAAY,QAAW,OAAO,MAAsB;AACzE,QAAM,CAAC,KAAK,IAAI,gBAAgB,wBAAwB,KAAK;AAE7D,QAAM,kBAAkB,MAAM;AAC5B,cAAU,UAAU,UAAU,MAAM,EAAE,MAAM,CAAC,QAAQ;AACnD,cAAQ,MAAM,qCAAqC,GAAG;AAAA,IACxD,CAAC;AAAA,EACH;AAEA,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,WAAW,qBAAqB;AAAA,MAC9C,SAAQ;AAAA,MACR,SAAS;AAAA,MACT,MAAM,oBAAC,cAAW;AAAA,MAClB,MAAK;AAAA;AAAA,EACP;AAEJ;AACA,IAAO,gCAAQ;;;ACnCf,IAAOA,iCAAQ;","names":["FieldCopyTestIdButton_default"]}
1
+ {"version":3,"sources":["../../../src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx","../../../src/partials/FieldCopyTestIdButton/index.ts"],"sourcesContent":["import { FaBullseye } from 'react-icons/fa6';\n\nimport cn from 'classnames';\n\nimport { Button, useLocalStorage } from '@fuf-stack/pixels';\n\ninterface FormDebugProps {\n className?: string;\n testId: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\nconst TestIdDebug = ({ className = undefined, testId }: FormDebugProps) => {\n const [debug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);\n\n const copyToClipboard = () => {\n navigator.clipboard.writeText(testId).catch((err) => {\n console.error('Error copying TestId to clipboard', err);\n });\n };\n\n if (!debug) {\n return null;\n }\n\n return (\n <Button\n className={cn(className, 'pointer-events-auto')}\n variant=\"light\"\n onClick={copyToClipboard}\n icon={<FaBullseye />}\n size=\"sm\"\n />\n );\n};\nexport default TestIdDebug;\n","import FieldCopyTestIdButton from './FieldCopyTestIdButton';\n\nexport default FieldCopyTestIdButton;\n"],"mappings":";AAAA,SAAS,kBAAkB;AAE3B,OAAO,QAAQ;AAEf,SAAS,QAAQ,uBAAuB;AA2B5B;AApBZ,IAAM,yBAAyB;AAE/B,IAAM,cAAc,CAAC,EAAE,YAAY,QAAW,OAAO,MAAsB;AACzE,QAAM,CAAC,KAAK,IAAI,gBAAgB,wBAAwB,KAAK;AAE7D,QAAM,kBAAkB,MAAM;AAC5B,cAAU,UAAU,UAAU,MAAM,EAAE,MAAM,CAAC,QAAQ;AACnD,cAAQ,MAAM,qCAAqC,GAAG;AAAA,IACxD,CAAC;AAAA,EACH;AAEA,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,WAAW,qBAAqB;AAAA,MAC9C,SAAQ;AAAA,MACR,SAAS;AAAA,MACT,MAAM,oBAAC,cAAW;AAAA,MAClB,MAAK;AAAA;AAAA,EACP;AAEJ;AACA,IAAO,gCAAQ;;;AClCf,IAAOA,iCAAQ;","names":["FieldCopyTestIdButton_default"]}