@fuf-stack/uniform 0.3.2 → 0.4.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.
- package/dist/Form/index.cjs +2 -2
- package/dist/Form/index.js +1 -1
- package/dist/Grid/index.cjs +2 -2
- package/dist/Grid/index.js +1 -1
- package/dist/Input/index.cjs +3 -3
- package/dist/Input/index.d.cts +2 -2
- package/dist/Input/index.d.ts +2 -2
- package/dist/Input/index.js +2 -2
- package/dist/{Input-B_rP1h4X.d.cts → Input-B6dNQiiD.d.cts} +3 -1
- package/dist/{Input-B_rP1h4X.d.ts → Input-B6dNQiiD.d.ts} +3 -1
- package/dist/SubmitButton/index.cjs +2 -2
- package/dist/SubmitButton/index.js +1 -1
- package/dist/{chunk-2O53LMR3.cjs → chunk-2CKPLOCK.cjs} +9 -7
- package/dist/chunk-2CKPLOCK.cjs.map +1 -0
- package/dist/{chunk-TEJGV6NC.js → chunk-5FMJUJ7H.js} +2 -2
- package/dist/chunk-5FMJUJ7H.js.map +1 -0
- package/dist/{chunk-ZPFKVKGV.cjs → chunk-6GN255GP.cjs} +4 -4
- package/dist/chunk-6GN255GP.cjs.map +1 -0
- package/dist/{chunk-XUKBLFTR.cjs → chunk-AGAYQTFD.cjs} +4 -4
- package/dist/chunk-AGAYQTFD.cjs.map +1 -0
- package/dist/{chunk-4BELEHDQ.cjs → chunk-BNTEIMNY.cjs} +5 -5
- package/dist/chunk-BNTEIMNY.cjs.map +1 -0
- package/dist/{chunk-22AA557I.cjs → chunk-HT3LKDHX.cjs} +4 -4
- package/dist/chunk-HT3LKDHX.cjs.map +1 -0
- package/dist/{chunk-6XKDXQ4A.js → chunk-KFRKKWZT.js} +3 -3
- package/dist/chunk-KFRKKWZT.js.map +1 -0
- package/dist/{chunk-FNVT6LS4.js → chunk-OV5RMSYD.js} +2 -2
- package/dist/{chunk-22AA557I.cjs.map → chunk-OV5RMSYD.js.map} +1 -1
- package/dist/{chunk-3DMR7T4D.js → chunk-OYXZQOGU.js} +7 -5
- package/dist/chunk-OYXZQOGU.js.map +1 -0
- package/dist/{chunk-4MEKDDB2.js → chunk-PDCEKC3G.js} +2 -2
- package/dist/chunk-PDCEKC3G.js.map +1 -0
- package/dist/index.cjs +6 -6
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +5 -5
- package/dist/partials/FieldCopyTestIdButton/index.cjs +2 -2
- package/dist/partials/FieldCopyTestIdButton/index.js +1 -1
- package/package.json +15 -16
- package/dist/chunk-2O53LMR3.cjs.map +0 -1
- package/dist/chunk-3DMR7T4D.js.map +0 -1
- package/dist/chunk-4BELEHDQ.cjs.map +0 -1
- package/dist/chunk-4MEKDDB2.js.map +0 -1
- package/dist/chunk-6XKDXQ4A.js.map +0 -1
- package/dist/chunk-FNVT6LS4.js.map +0 -1
- package/dist/chunk-TEJGV6NC.js.map +0 -1
- package/dist/chunk-XUKBLFTR.cjs.map +0 -1
- package/dist/chunk-ZPFKVKGV.cjs.map +0 -1
package/dist/Form/index.cjs
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunkBNTEIMNYcjs = require('../chunk-BNTEIMNY.cjs');
|
|
5
5
|
require('../chunk-WQRM7G4C.cjs');
|
|
6
6
|
require('../chunk-BBB4FEY6.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
exports.Form =
|
|
10
|
+
exports.Form = _chunkBNTEIMNYcjs.Form_default; exports.default = _chunkBNTEIMNYcjs.Form_default2;
|
|
11
11
|
//# sourceMappingURL=index.cjs.map
|
package/dist/Form/index.js
CHANGED
package/dist/Grid/index.cjs
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunk6GN255GPcjs = require('../chunk-6GN255GP.cjs');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
|
|
8
|
-
exports.Grid =
|
|
8
|
+
exports.Grid = _chunk6GN255GPcjs.Grid_default; exports.default = _chunk6GN255GPcjs.Grid_default2;
|
|
9
9
|
//# sourceMappingURL=index.cjs.map
|
package/dist/Grid/index.js
CHANGED
package/dist/Input/index.cjs
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunk2CKPLOCKcjs = require('../chunk-2CKPLOCK.cjs');
|
|
5
5
|
require('../chunk-QTL5FREE.cjs');
|
|
6
6
|
require('../chunk-WQRM7G4C.cjs');
|
|
7
7
|
require('../chunk-BBB4FEY6.cjs');
|
|
8
|
-
require('../chunk-
|
|
8
|
+
require('../chunk-HT3LKDHX.cjs');
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
|
|
12
|
-
exports.Input =
|
|
12
|
+
exports.Input = _chunk2CKPLOCKcjs.Input_default; exports.default = _chunk2CKPLOCKcjs.Input_default2;
|
|
13
13
|
//# sourceMappingURL=index.cjs.map
|
package/dist/Input/index.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { I as Input } from '../Input-
|
|
2
|
-
export { a as InputProps } from '../Input-
|
|
1
|
+
import { I as Input } from '../Input-B6dNQiiD.cjs';
|
|
2
|
+
export { a as InputProps } from '../Input-B6dNQiiD.cjs';
|
|
3
3
|
import 'react/jsx-runtime';
|
|
4
4
|
import 'react';
|
|
5
5
|
|
package/dist/Input/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { I as Input } from '../Input-
|
|
2
|
-
export { a as InputProps } from '../Input-
|
|
1
|
+
import { I as Input } from '../Input-B6dNQiiD.js';
|
|
2
|
+
export { a as InputProps } from '../Input-B6dNQiiD.js';
|
|
3
3
|
import 'react/jsx-runtime';
|
|
4
4
|
import 'react';
|
|
5
5
|
|
package/dist/Input/index.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import {
|
|
2
2
|
Input_default,
|
|
3
3
|
Input_default2
|
|
4
|
-
} from "../chunk-
|
|
4
|
+
} from "../chunk-OYXZQOGU.js";
|
|
5
5
|
import "../chunk-DBLODROX.js";
|
|
6
6
|
import "../chunk-BCMPSLSG.js";
|
|
7
7
|
import "../chunk-V46BHM2U.js";
|
|
8
|
-
import "../chunk-
|
|
8
|
+
import "../chunk-OV5RMSYD.js";
|
|
9
9
|
export {
|
|
10
10
|
Input_default as Input,
|
|
11
11
|
Input_default2 as default
|
|
@@ -4,6 +4,8 @@ import { ReactNode } from 'react';
|
|
|
4
4
|
interface InputProps {
|
|
5
5
|
/** CSS class name */
|
|
6
6
|
className?: string;
|
|
7
|
+
/** input field is disabled */
|
|
8
|
+
disabled?: boolean;
|
|
7
9
|
/** added content to the end of the input Field. */
|
|
8
10
|
endContent?: ReactNode;
|
|
9
11
|
/** form field label (set to false to disable label) */
|
|
@@ -22,6 +24,6 @@ interface InputProps {
|
|
|
22
24
|
/**
|
|
23
25
|
* Input component based on [NextUI Input](https://nextui.org/docs/components/input)
|
|
24
26
|
*/
|
|
25
|
-
declare const Input: ({ className, endContent, label, name, placeholder, startContent, testId: _testId, type, }: InputProps) => react_jsx_runtime.JSX.Element;
|
|
27
|
+
declare const Input: ({ className, disabled, endContent, label, name, placeholder, startContent, testId: _testId, type, }: InputProps) => react_jsx_runtime.JSX.Element;
|
|
26
28
|
|
|
27
29
|
export { Input as I, type InputProps as a };
|
|
@@ -4,6 +4,8 @@ import { ReactNode } from 'react';
|
|
|
4
4
|
interface InputProps {
|
|
5
5
|
/** CSS class name */
|
|
6
6
|
className?: string;
|
|
7
|
+
/** input field is disabled */
|
|
8
|
+
disabled?: boolean;
|
|
7
9
|
/** added content to the end of the input Field. */
|
|
8
10
|
endContent?: ReactNode;
|
|
9
11
|
/** form field label (set to false to disable label) */
|
|
@@ -22,6 +24,6 @@ interface InputProps {
|
|
|
22
24
|
/**
|
|
23
25
|
* Input component based on [NextUI Input](https://nextui.org/docs/components/input)
|
|
24
26
|
*/
|
|
25
|
-
declare const Input: ({ className, endContent, label, name, placeholder, startContent, testId: _testId, type, }: InputProps) => react_jsx_runtime.JSX.Element;
|
|
27
|
+
declare const Input: ({ className, disabled, endContent, label, name, placeholder, startContent, testId: _testId, type, }: InputProps) => react_jsx_runtime.JSX.Element;
|
|
26
28
|
|
|
27
29
|
export { Input as I, type InputProps as a };
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunkAGAYQTFDcjs = require('../chunk-AGAYQTFD.cjs');
|
|
5
5
|
require('../chunk-WQRM7G4C.cjs');
|
|
6
6
|
require('../chunk-BBB4FEY6.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
exports.SubmitButton =
|
|
10
|
+
exports.SubmitButton = _chunkAGAYQTFDcjs.SubmitButton_default; exports.default = _chunkAGAYQTFDcjs.SubmitButton_default2;
|
|
11
11
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
4
4
|
|
|
@@ -6,15 +6,16 @@ var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
|
6
6
|
var _chunkWQRM7G4Ccjs = require('./chunk-WQRM7G4C.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkHT3LKDHXcjs = require('./chunk-HT3LKDHX.cjs');
|
|
10
10
|
|
|
11
11
|
// src/Input/Input.tsx
|
|
12
12
|
var _reacthookform = require('react-hook-form');
|
|
13
13
|
var _input = require('@nextui-org/input');
|
|
14
|
-
var
|
|
14
|
+
var _pixelutils = require('@fuf-stack/pixel-utils');
|
|
15
15
|
var _jsxruntime = require('react/jsx-runtime');
|
|
16
16
|
var Input = ({
|
|
17
17
|
className = void 0,
|
|
18
|
+
disabled = false,
|
|
18
19
|
endContent = void 0,
|
|
19
20
|
label = void 0,
|
|
20
21
|
name,
|
|
@@ -29,6 +30,7 @@ var Input = ({
|
|
|
29
30
|
_reacthookform.Controller,
|
|
30
31
|
{
|
|
31
32
|
control,
|
|
33
|
+
disabled,
|
|
32
34
|
name,
|
|
33
35
|
render: ({
|
|
34
36
|
field: { disabled: isDisabled, onChange, onBlur, value, ref }
|
|
@@ -36,19 +38,19 @@ var Input = ({
|
|
|
36
38
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
37
39
|
_input.Input,
|
|
38
40
|
{
|
|
39
|
-
className:
|
|
41
|
+
className: _pixelutils.cn.call(void 0, className),
|
|
40
42
|
classNames: {
|
|
41
43
|
inputWrapper: "group-data-[focus=true]:border-primary"
|
|
42
44
|
},
|
|
43
45
|
"data-testid": testId,
|
|
44
46
|
endContent,
|
|
45
|
-
errorMessage: error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkQTL5FREEcjs.
|
|
47
|
+
errorMessage: error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkQTL5FREEcjs.FieldValidationError_default, { error }),
|
|
46
48
|
isDisabled,
|
|
47
49
|
isInvalid: invalid,
|
|
48
50
|
isRequired: required,
|
|
49
51
|
label: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
|
|
50
52
|
label,
|
|
51
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
53
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHT3LKDHXcjs.FieldCopyTestIdButton_default, { testId })
|
|
52
54
|
] }),
|
|
53
55
|
labelPlacement: "outside",
|
|
54
56
|
name,
|
|
@@ -76,4 +78,4 @@ var Input_default2 = Input_default;
|
|
|
76
78
|
|
|
77
79
|
|
|
78
80
|
exports.Input_default = Input_default; exports.Input_default2 = Input_default2;
|
|
79
|
-
//# sourceMappingURL=chunk-
|
|
81
|
+
//# sourceMappingURL=chunk-2CKPLOCK.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Input/Input.tsx","../src/Input/index.ts"],"names":["Input_default"],"mappings":";;;;;;;;;;;AAEA,SAAS,kBAAkB;AAE3B,SAAS,SAAS,iBAAiB;AAEnC,SAAS,UAAU;AA4DgB,SAKrB,UALqB,KAKrB,YALqB;AA9BnC,IAAM,QAAQ,CAAC;AAAA,EACb,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,aAAa;AAAA,EACb,QAAQ;AAAA,EACR;AAAA,EACA,cAAc;AAAA,EACd,eAAe;AAAA,EACf,QAAQ,UAAU;AAAA,EAClB,OAAO;AACT,MAAkB;AAChB,QAAM,EAAE,SAAS,cAAc,IAAI,eAAe;AAClD,QAAM,EAAE,OAAO,SAAS,UAAU,OAAO,IAAI,cAAc,MAAM,OAAO;AAExE,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,CAAC;AAAA,QACP,OAAO,EAAE,UAAU,YAAY,UAAU,QAAQ,OAAO,IAAI;AAAA,MAC9D,MAAM;AACJ,eACE;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,GAAG,SAAS;AAAA,YACvB,YAAY;AAAA,cACV,cAAc;AAAA,YAChB;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA,cAAc,SAAS,oBAAC,gCAAqB,OAAc;AAAA,YAC3D;AAAA,YACA,WAAW;AAAA,YACX,YAAY;AAAA,YACZ,OACE,iCACG;AAAA;AAAA,cACD,oBAAC,iCAAsB,QAAgB;AAAA,eACzC;AAAA,YAEF,gBAAe;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,QAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAQ;AAAA;AAAA,QACV;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;;;ACxFf,IAAOA,iBAAQ","sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Controller } from 'react-hook-form';\n\nimport { Input as NextInput } from '@nextui-org/input';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport interface InputProps {\n /** CSS class name */\n className?: string;\n /** input field is disabled */\n disabled?: boolean;\n /** added content to the end of the input Field. */\n endContent?: ReactNode;\n /** form field label (set to false to disable label) */\n label?: string | false;\n /** form field name */\n name: string;\n /** form field placeholder */\n placeholder?: string;\n /** content added to the start of the input field */\n startContent?: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [NextUI Input](https://nextui.org/docs/components/input)\n */\nconst Input = ({\n className = undefined,\n disabled = false,\n endContent = undefined,\n label = undefined,\n name,\n placeholder = ' ',\n startContent = undefined,\n testId: _testId = undefined,\n type = undefined,\n}: InputProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n return (\n <Controller\n control={control}\n disabled={disabled}\n name={name}\n render={({\n field: { disabled: isDisabled, onChange, onBlur, value, ref },\n }) => {\n return (\n <NextInput\n className={cn(className)}\n classNames={{\n inputWrapper: 'group-data-[focus=true]:border-primary',\n }}\n data-testid={testId}\n endContent={endContent}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n <>\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </>\n }\n labelPlacement=\"outside\"\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n placeholder={placeholder}\n radius=\"sm\"\n ref={ref}\n startContent={startContent}\n type={type}\n value={value}\n variant=\"bordered\"\n />\n );\n }}\n />\n );\n};\n\nexport default Input;\n","import Input from './Input';\n\nexport type { InputProps } from './Input';\n\nexport { Input };\n\nexport default Input;\n"]}
|
|
@@ -6,7 +6,7 @@ import {
|
|
|
6
6
|
} from "./chunk-V46BHM2U.js";
|
|
7
7
|
|
|
8
8
|
// src/SubmitButton/SubmitButton.tsx
|
|
9
|
-
import cn from "
|
|
9
|
+
import { cn } from "@fuf-stack/pixel-utils";
|
|
10
10
|
import { Button } from "@fuf-stack/pixels";
|
|
11
11
|
import { jsx } from "react/jsx-runtime";
|
|
12
12
|
var SubmitButton = ({
|
|
@@ -45,4 +45,4 @@ export {
|
|
|
45
45
|
SubmitButton_default,
|
|
46
46
|
SubmitButton_default2
|
|
47
47
|
};
|
|
48
|
-
//# sourceMappingURL=chunk-
|
|
48
|
+
//# sourceMappingURL=chunk-5FMJUJ7H.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 } from '@fuf-stack/pixel-utils';\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;\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 /** size of the 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 children = 'Submit',\n className = undefined,\n color = 'success',\n loading = false,\n onClick = undefined,\n size = 'md',\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 size={size}\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,UAAU;AACnB,SAAS,cAAc;AAuCnB;AAdJ,IAAM,eAAe,CAAC;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AAAA,EACV,OAAO;AAAA,EACP,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;AAAA,MACA,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;;;ACpDf,IAAOA,wBAAQ;","names":["SubmitButton_default"]}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true})
|
|
2
|
-
var
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/Grid/Grid.tsx
|
|
2
|
+
var _pixelutils = require('@fuf-stack/pixel-utils');
|
|
3
3
|
var _jsxruntime = require('react/jsx-runtime');
|
|
4
4
|
var Grid = ({
|
|
5
5
|
children = null,
|
|
6
6
|
className = void 0,
|
|
7
7
|
testId = void 0
|
|
8
8
|
}) => {
|
|
9
|
-
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className:
|
|
9
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _pixelutils.cn.call(void 0, "grid gap-6", className), "data-testid": testId, children });
|
|
10
10
|
};
|
|
11
11
|
var Grid_default = Grid;
|
|
12
12
|
|
|
@@ -17,4 +17,4 @@ var Grid_default2 = Grid_default;
|
|
|
17
17
|
|
|
18
18
|
|
|
19
19
|
exports.Grid_default = Grid_default; exports.Grid_default2 = Grid_default2;
|
|
20
|
-
//# sourceMappingURL=chunk-
|
|
20
|
+
//# sourceMappingURL=chunk-6GN255GP.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Grid/Grid.tsx","../src/Grid/index.ts"],"names":["Grid_default"],"mappings":";AAEA,SAAS,UAAU;AAoBf;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 '@fuf-stack/pixel-utils';\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"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
var _chunkWQRM7G4Ccjs = require('./chunk-WQRM7G4C.cjs');
|
|
4
4
|
|
|
@@ -6,7 +6,7 @@ var _chunkWQRM7G4Ccjs = require('./chunk-WQRM7G4C.cjs');
|
|
|
6
6
|
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
7
7
|
|
|
8
8
|
// src/SubmitButton/SubmitButton.tsx
|
|
9
|
-
var
|
|
9
|
+
var _pixelutils = require('@fuf-stack/pixel-utils');
|
|
10
10
|
var _pixels = require('@fuf-stack/pixels');
|
|
11
11
|
var _jsxruntime = require('react/jsx-runtime');
|
|
12
12
|
var SubmitButton = ({
|
|
@@ -24,7 +24,7 @@ var SubmitButton = ({
|
|
|
24
24
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
25
25
|
_pixels.Button,
|
|
26
26
|
{
|
|
27
|
-
className:
|
|
27
|
+
className: _pixelutils.cn.call(void 0, className),
|
|
28
28
|
color,
|
|
29
29
|
testId: _chunkBBB4FEY6cjs.slugify.call(void 0, testId),
|
|
30
30
|
disabled: !isValid || isSubmitting || isValidating,
|
|
@@ -45,4 +45,4 @@ var SubmitButton_default2 = SubmitButton_default;
|
|
|
45
45
|
|
|
46
46
|
|
|
47
47
|
exports.SubmitButton_default = SubmitButton_default; exports.SubmitButton_default2 = SubmitButton_default2;
|
|
48
|
-
//# sourceMappingURL=chunk-
|
|
48
|
+
//# sourceMappingURL=chunk-AGAYQTFD.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":";;;;;;;;AAGA,SAAS,UAAU;AACnB,SAAS,cAAc;AAuCnB;AAdJ,IAAM,eAAe,CAAC;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AAAA,EACV,OAAO;AAAA,EACP,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;AAAA,MACA,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;;;ACpDf,IAAOA,wBAAQ","sourcesContent":["import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn } from '@fuf-stack/pixel-utils';\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;\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 /** size of the 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 children = 'Submit',\n className = undefined,\n color = 'success',\n loading = false,\n onClick = undefined,\n size = 'md',\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 size={size}\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,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
var _chunkWQRM7G4Ccjs = require('./chunk-WQRM7G4C.cjs');
|
|
@@ -9,7 +9,7 @@ var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
|
9
9
|
// src/Form/Form.tsx
|
|
10
10
|
var _react = require('react');
|
|
11
11
|
var _reacthookform = require('react-hook-form');
|
|
12
|
-
var
|
|
12
|
+
var _pixelutils = require('@fuf-stack/pixel-utils');
|
|
13
13
|
|
|
14
14
|
// src/Form/subcomponents/FormDebugViewer.tsx
|
|
15
15
|
|
|
@@ -56,7 +56,7 @@ var FormDebugViewer = ({ className = void 0 }) => {
|
|
|
56
56
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
57
57
|
_pixels.Card,
|
|
58
58
|
{
|
|
59
|
-
className:
|
|
59
|
+
className: _pixelutils.cn.call(void 0, className),
|
|
60
60
|
header: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full flex-row justify-between", children: [
|
|
61
61
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-lg", children: "Debug Mode" }),
|
|
62
62
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
@@ -136,7 +136,7 @@ var Form = ({
|
|
|
136
136
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
137
137
|
"form",
|
|
138
138
|
{
|
|
139
|
-
className:
|
|
139
|
+
className: _pixelutils.cn.call(void 0, "flex-grow", className),
|
|
140
140
|
"data-testid": _chunkBBB4FEY6cjs.slugify.call(void 0, testId || name || ""),
|
|
141
141
|
name,
|
|
142
142
|
onSubmit: methods.handleSubmit(onSubmit),
|
|
@@ -156,4 +156,4 @@ var Form_default2 = Form_default;
|
|
|
156
156
|
|
|
157
157
|
|
|
158
158
|
exports.Form_default = Form_default; exports.Form_default2 = Form_default2;
|
|
159
|
-
//# sourceMappingURL=chunk-
|
|
159
|
+
//# sourceMappingURL=chunk-BNTEIMNY.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 '@fuf-stack/pixel-utils';\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 '@fuf-stack/pixel-utils';\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"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true})
|
|
1
|
+
"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx
|
|
2
2
|
var _fa6 = require('react-icons/fa6');
|
|
3
|
-
var
|
|
3
|
+
var _pixelutils = require('@fuf-stack/pixel-utils');
|
|
4
4
|
var _pixels = require('@fuf-stack/pixels');
|
|
5
5
|
var _jsxruntime = require('react/jsx-runtime');
|
|
6
6
|
var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
|
|
@@ -20,7 +20,7 @@ var FieldCopyTestIdButton = ({
|
|
|
20
20
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
21
21
|
_pixels.Button,
|
|
22
22
|
{
|
|
23
|
-
className:
|
|
23
|
+
className: _pixelutils.cn.call(void 0, className, "pointer-events-auto"),
|
|
24
24
|
variant: "light",
|
|
25
25
|
onClick: copyToClipboard,
|
|
26
26
|
icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa6.FaBullseye, {}),
|
|
@@ -37,4 +37,4 @@ var FieldCopyTestIdButton_default2 = FieldCopyTestIdButton_default;
|
|
|
37
37
|
|
|
38
38
|
|
|
39
39
|
exports.FieldCopyTestIdButton_default = FieldCopyTestIdButton_default; exports.FieldCopyTestIdButton_default2 = FieldCopyTestIdButton_default2;
|
|
40
|
-
//# sourceMappingURL=chunk-
|
|
40
|
+
//# sourceMappingURL=chunk-HT3LKDHX.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx","../src/partials/FieldCopyTestIdButton/index.ts"],"names":["FieldCopyTestIdButton_default"],"mappings":";AAAA,SAAS,kBAAkB;AAE3B,SAAS,UAAU;AACnB,SAAS,QAAQ,uBAAuB;AA8B5B;AAvBZ,IAAM,yBAAyB;AAE/B,IAAM,wBAAwB,CAAC;AAAA,EAC7B,YAAY;AAAA,EACZ;AACF,MAAkC;AAChC,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;;;AChCf,IAAOA,iCAAQ","sourcesContent":["import { FaBullseye } from 'react-icons/fa6';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button, useLocalStorage } from '@fuf-stack/pixels';\n\nexport interface FieldCopyTestIdButtonProps {\n className?: string;\n testId: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\nconst FieldCopyTestIdButton = ({\n className = undefined,\n testId,\n}: FieldCopyTestIdButtonProps) => {\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 FieldCopyTestIdButton;\n","import FieldCopyTestIdButton from './FieldCopyTestIdButton';\n\nexport type { FieldCopyTestIdButtonProps } from './FieldCopyTestIdButton';\n\nexport { FieldCopyTestIdButton };\n\nexport default FieldCopyTestIdButton;\n"]}
|
|
@@ -9,13 +9,13 @@ import {
|
|
|
9
9
|
// src/Form/Form.tsx
|
|
10
10
|
import { useEffect as useEffect2 } from "react";
|
|
11
11
|
import { useForm } from "react-hook-form";
|
|
12
|
-
import cn2 from "
|
|
12
|
+
import { cn as cn2 } from "@fuf-stack/pixel-utils";
|
|
13
13
|
|
|
14
14
|
// src/Form/subcomponents/FormDebugViewer.tsx
|
|
15
15
|
import { useEffect, useState } from "react";
|
|
16
16
|
import { FaTimes } from "react-icons/fa";
|
|
17
17
|
import { FaBug } from "react-icons/fa6";
|
|
18
|
-
import cn from "
|
|
18
|
+
import { cn } from "@fuf-stack/pixel-utils";
|
|
19
19
|
import { Button, Card, Json, useLocalStorage } from "@fuf-stack/pixels";
|
|
20
20
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
21
21
|
var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
|
|
@@ -156,4 +156,4 @@ export {
|
|
|
156
156
|
Form_default,
|
|
157
157
|
Form_default2
|
|
158
158
|
};
|
|
159
|
-
//# sourceMappingURL=chunk-
|
|
159
|
+
//# sourceMappingURL=chunk-KFRKKWZT.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 '@fuf-stack/pixel-utils';\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 '@fuf-stack/pixel-utils';\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,SAAS,MAAAC,WAAU;;;ACLnB,SAAS,WAAW,gBAAgB;AACpC,SAAS,eAAe;AACxB,SAAS,aAAa;AAEtB,SAAS,UAAU;AACnB,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;;;ADST,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,QAC5B;AAEA,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"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
// src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx
|
|
2
2
|
import { FaBullseye } from "react-icons/fa6";
|
|
3
|
-
import cn from "
|
|
3
|
+
import { cn } from "@fuf-stack/pixel-utils";
|
|
4
4
|
import { Button, useLocalStorage } from "@fuf-stack/pixels";
|
|
5
5
|
import { jsx } from "react/jsx-runtime";
|
|
6
6
|
var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
|
|
@@ -37,4 +37,4 @@ export {
|
|
|
37
37
|
FieldCopyTestIdButton_default,
|
|
38
38
|
FieldCopyTestIdButton_default2
|
|
39
39
|
};
|
|
40
|
-
//# sourceMappingURL=chunk-
|
|
40
|
+
//# sourceMappingURL=chunk-OV5RMSYD.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx","../src/partials/FieldCopyTestIdButton/index.ts"],"
|
|
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 '@fuf-stack/pixel-utils';\nimport { Button, useLocalStorage } from '@fuf-stack/pixels';\n\nexport interface FieldCopyTestIdButtonProps {\n className?: string;\n testId: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\nconst FieldCopyTestIdButton = ({\n className = undefined,\n testId,\n}: FieldCopyTestIdButtonProps) => {\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 FieldCopyTestIdButton;\n","import FieldCopyTestIdButton from './FieldCopyTestIdButton';\n\nexport type { FieldCopyTestIdButtonProps } from './FieldCopyTestIdButton';\n\nexport { FieldCopyTestIdButton };\n\nexport default FieldCopyTestIdButton;\n"],"mappings":";AAAA,SAAS,kBAAkB;AAE3B,SAAS,UAAU;AACnB,SAAS,QAAQ,uBAAuB;AA8B5B;AAvBZ,IAAM,yBAAyB;AAE/B,IAAM,wBAAwB,CAAC;AAAA,EAC7B,YAAY;AAAA,EACZ;AACF,MAAkC;AAChC,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;;;AChCf,IAAOA,iCAAQ;","names":["FieldCopyTestIdButton_default"]}
|
|
@@ -1,20 +1,21 @@
|
|
|
1
1
|
import {
|
|
2
|
-
|
|
2
|
+
FieldValidationError_default
|
|
3
3
|
} from "./chunk-DBLODROX.js";
|
|
4
4
|
import {
|
|
5
5
|
useFormContext
|
|
6
6
|
} from "./chunk-BCMPSLSG.js";
|
|
7
7
|
import {
|
|
8
|
-
|
|
9
|
-
} from "./chunk-
|
|
8
|
+
FieldCopyTestIdButton_default
|
|
9
|
+
} from "./chunk-OV5RMSYD.js";
|
|
10
10
|
|
|
11
11
|
// src/Input/Input.tsx
|
|
12
12
|
import { Controller } from "react-hook-form";
|
|
13
13
|
import { Input as NextInput } from "@nextui-org/input";
|
|
14
|
-
import cn from "
|
|
14
|
+
import { cn } from "@fuf-stack/pixel-utils";
|
|
15
15
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
16
16
|
var Input = ({
|
|
17
17
|
className = void 0,
|
|
18
|
+
disabled = false,
|
|
18
19
|
endContent = void 0,
|
|
19
20
|
label = void 0,
|
|
20
21
|
name,
|
|
@@ -29,6 +30,7 @@ var Input = ({
|
|
|
29
30
|
Controller,
|
|
30
31
|
{
|
|
31
32
|
control,
|
|
33
|
+
disabled,
|
|
32
34
|
name,
|
|
33
35
|
render: ({
|
|
34
36
|
field: { disabled: isDisabled, onChange, onBlur, value, ref }
|
|
@@ -76,4 +78,4 @@ export {
|
|
|
76
78
|
Input_default,
|
|
77
79
|
Input_default2
|
|
78
80
|
};
|
|
79
|
-
//# sourceMappingURL=chunk-
|
|
81
|
+
//# sourceMappingURL=chunk-OYXZQOGU.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Input/Input.tsx","../src/Input/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Controller } from 'react-hook-form';\n\nimport { Input as NextInput } from '@nextui-org/input';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport interface InputProps {\n /** CSS class name */\n className?: string;\n /** input field is disabled */\n disabled?: boolean;\n /** added content to the end of the input Field. */\n endContent?: ReactNode;\n /** form field label (set to false to disable label) */\n label?: string | false;\n /** form field name */\n name: string;\n /** form field placeholder */\n placeholder?: string;\n /** content added to the start of the input field */\n startContent?: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [NextUI Input](https://nextui.org/docs/components/input)\n */\nconst Input = ({\n className = undefined,\n disabled = false,\n endContent = undefined,\n label = undefined,\n name,\n placeholder = ' ',\n startContent = undefined,\n testId: _testId = undefined,\n type = undefined,\n}: InputProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n return (\n <Controller\n control={control}\n disabled={disabled}\n name={name}\n render={({\n field: { disabled: isDisabled, onChange, onBlur, value, ref },\n }) => {\n return (\n <NextInput\n className={cn(className)}\n classNames={{\n inputWrapper: 'group-data-[focus=true]:border-primary',\n }}\n data-testid={testId}\n endContent={endContent}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n <>\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </>\n }\n labelPlacement=\"outside\"\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n placeholder={placeholder}\n radius=\"sm\"\n ref={ref}\n startContent={startContent}\n type={type}\n value={value}\n variant=\"bordered\"\n />\n );\n }}\n />\n );\n};\n\nexport default Input;\n","import Input from './Input';\n\nexport type { InputProps } from './Input';\n\nexport { Input };\n\nexport default Input;\n"],"mappings":";;;;;;;;;;;AAEA,SAAS,kBAAkB;AAE3B,SAAS,SAAS,iBAAiB;AAEnC,SAAS,UAAU;AA4DgB,SAKrB,UALqB,KAKrB,YALqB;AA9BnC,IAAM,QAAQ,CAAC;AAAA,EACb,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,aAAa;AAAA,EACb,QAAQ;AAAA,EACR;AAAA,EACA,cAAc;AAAA,EACd,eAAe;AAAA,EACf,QAAQ,UAAU;AAAA,EAClB,OAAO;AACT,MAAkB;AAChB,QAAM,EAAE,SAAS,cAAc,IAAI,eAAe;AAClD,QAAM,EAAE,OAAO,SAAS,UAAU,OAAO,IAAI,cAAc,MAAM,OAAO;AAExE,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,CAAC;AAAA,QACP,OAAO,EAAE,UAAU,YAAY,UAAU,QAAQ,OAAO,IAAI;AAAA,MAC9D,MAAM;AACJ,eACE;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,GAAG,SAAS;AAAA,YACvB,YAAY;AAAA,cACV,cAAc;AAAA,YAChB;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA,cAAc,SAAS,oBAAC,gCAAqB,OAAc;AAAA,YAC3D;AAAA,YACA,WAAW;AAAA,YACX,YAAY;AAAA,YACZ,OACE,iCACG;AAAA;AAAA,cACD,oBAAC,iCAAsB,QAAgB;AAAA,eACzC;AAAA,YAEF,gBAAe;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,QAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAQ;AAAA;AAAA,QACV;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;;;ACxFf,IAAOA,iBAAQ;","names":["Input_default"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// src/Grid/Grid.tsx
|
|
2
|
-
import cn from "
|
|
2
|
+
import { cn } from "@fuf-stack/pixel-utils";
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
var Grid = ({
|
|
5
5
|
children = null,
|
|
@@ -17,4 +17,4 @@ export {
|
|
|
17
17
|
Grid_default,
|
|
18
18
|
Grid_default2
|
|
19
19
|
};
|
|
20
|
-
//# sourceMappingURL=chunk-
|
|
20
|
+
//# sourceMappingURL=chunk-PDCEKC3G.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 '@fuf-stack/pixel-utils';\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,SAAS,UAAU;AAoBf;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"]}
|
package/dist/index.cjs
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunkBNTEIMNYcjs = require('./chunk-BNTEIMNY.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var _chunk6GN255GPcjs = require('./chunk-6GN255GP.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunk2CKPLOCKcjs = require('./chunk-2CKPLOCK.cjs');
|
|
10
10
|
|
|
11
11
|
|
|
12
12
|
var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
13
13
|
|
|
14
14
|
|
|
15
|
-
var
|
|
15
|
+
var _chunkAGAYQTFDcjs = require('./chunk-AGAYQTFD.cjs');
|
|
16
16
|
|
|
17
17
|
|
|
18
18
|
|
|
@@ -22,7 +22,7 @@ var _chunkWQRM7G4Ccjs = require('./chunk-WQRM7G4C.cjs');
|
|
|
22
22
|
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
23
23
|
|
|
24
24
|
|
|
25
|
-
var
|
|
25
|
+
var _chunkHT3LKDHXcjs = require('./chunk-HT3LKDHX.cjs');
|
|
26
26
|
|
|
27
27
|
|
|
28
28
|
|
|
@@ -33,5 +33,5 @@ var _chunk22AA557Icjs = require('./chunk-22AA557I.cjs');
|
|
|
33
33
|
|
|
34
34
|
|
|
35
35
|
|
|
36
|
-
exports.FieldCopyTestIdButton =
|
|
36
|
+
exports.FieldCopyTestIdButton = _chunkHT3LKDHXcjs.FieldCopyTestIdButton_default; exports.FieldValidationError = _chunkQTL5FREEcjs.FieldValidationError_default; exports.Form = _chunkBNTEIMNYcjs.Form_default; exports.Grid = _chunk6GN255GPcjs.Grid_default; exports.Input = _chunk2CKPLOCKcjs.Input_default; exports.SubmitButton = _chunkAGAYQTFDcjs.SubmitButton_default; exports.recursiveFieldKeySearch = _chunkWQRM7G4Ccjs.recursiveFieldKeySearch; exports.slugify = _chunkBBB4FEY6cjs.slugify; exports.useFormContext = _chunkWQRM7G4Ccjs.useFormContext;
|
|
37
37
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.d.cts
CHANGED
|
@@ -2,7 +2,7 @@ export { F as Form, a as FormProps } from './Form-Bv0R3QNk.cjs';
|
|
|
2
2
|
export { G as Grid, a as GridProps } from './Grid-DF3L9NF3.cjs';
|
|
3
3
|
export { slugify } from './helpers/index.cjs';
|
|
4
4
|
export { recursiveFieldKeySearch, useFormContext } from './hooks/index.cjs';
|
|
5
|
-
export { I as Input, a as InputProps } from './Input-
|
|
5
|
+
export { I as Input, a as InputProps } from './Input-B6dNQiiD.cjs';
|
|
6
6
|
export { F as FieldCopyTestIdButton, a as FieldCopyTestIdButtonProps } from './FieldCopyTestIdButton-D-z1usqE.cjs';
|
|
7
7
|
export { F as FieldValidationError, a as FieldValidationErrorProps } from './FieldValidationError-BSXedjCA.cjs';
|
|
8
8
|
export { S as SubmitButton, a as SubmitButtonProps } from './SubmitButton-BEp_zzwf.cjs';
|
package/dist/index.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ export { F as Form, a as FormProps } from './Form-Bv0R3QNk.js';
|
|
|
2
2
|
export { G as Grid, a as GridProps } from './Grid-DF3L9NF3.js';
|
|
3
3
|
export { slugify } from './helpers/index.js';
|
|
4
4
|
export { recursiveFieldKeySearch, useFormContext } from './hooks/index.js';
|
|
5
|
-
export { I as Input, a as InputProps } from './Input-
|
|
5
|
+
export { I as Input, a as InputProps } from './Input-B6dNQiiD.js';
|
|
6
6
|
export { F as FieldCopyTestIdButton, a as FieldCopyTestIdButtonProps } from './FieldCopyTestIdButton-D-z1usqE.js';
|
|
7
7
|
export { F as FieldValidationError, a as FieldValidationErrorProps } from './FieldValidationError-BSXedjCA.js';
|
|
8
8
|
export { S as SubmitButton, a as SubmitButtonProps } from './SubmitButton-BEp_zzwf.js';
|
package/dist/index.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import {
|
|
2
2
|
Form_default
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-KFRKKWZT.js";
|
|
4
4
|
import {
|
|
5
5
|
Grid_default
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-PDCEKC3G.js";
|
|
7
7
|
import {
|
|
8
8
|
Input_default
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-OYXZQOGU.js";
|
|
10
10
|
import {
|
|
11
11
|
FieldValidationError_default
|
|
12
12
|
} from "./chunk-DBLODROX.js";
|
|
13
13
|
import {
|
|
14
14
|
SubmitButton_default
|
|
15
|
-
} from "./chunk-
|
|
15
|
+
} from "./chunk-5FMJUJ7H.js";
|
|
16
16
|
import {
|
|
17
17
|
recursiveFieldKeySearch,
|
|
18
18
|
useFormContext
|
|
@@ -22,7 +22,7 @@ import {
|
|
|
22
22
|
} from "./chunk-V46BHM2U.js";
|
|
23
23
|
import {
|
|
24
24
|
FieldCopyTestIdButton_default
|
|
25
|
-
} from "./chunk-
|
|
25
|
+
} from "./chunk-OV5RMSYD.js";
|
|
26
26
|
export {
|
|
27
27
|
FieldCopyTestIdButton_default as FieldCopyTestIdButton,
|
|
28
28
|
FieldValidationError_default as FieldValidationError,
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunkHT3LKDHXcjs = require('../../chunk-HT3LKDHX.cjs');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
|
|
8
|
-
exports.FieldCopyTestIdButton =
|
|
8
|
+
exports.FieldCopyTestIdButton = _chunkHT3LKDHXcjs.FieldCopyTestIdButton_default; exports.default = _chunkHT3LKDHXcjs.FieldCopyTestIdButton_default2;
|
|
9
9
|
//# sourceMappingURL=index.cjs.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fuf-stack/uniform",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.4.0",
|
|
4
4
|
"description": "fuf react form library",
|
|
5
5
|
"author": "Hannes Tiede",
|
|
6
6
|
"homepage": "https://github.com/fuf-stack/uniform#readme",
|
|
@@ -80,23 +80,22 @@
|
|
|
80
80
|
"@dnd-kit/modifiers": "7.0.0",
|
|
81
81
|
"@dnd-kit/sortable": "8.0.0",
|
|
82
82
|
"@dnd-kit/utilities": "3.2.2",
|
|
83
|
-
"@nextui-org/button": "2.0.
|
|
84
|
-
"@nextui-org/checkbox": "2.
|
|
85
|
-
"@nextui-org/input": "2.1
|
|
86
|
-
"@nextui-org/radio": "2.
|
|
87
|
-
"@nextui-org/select": "2.1
|
|
88
|
-
"@nextui-org/switch": "2.0.
|
|
89
|
-
"@nextui-org/system": "2.1
|
|
90
|
-
"@nextui-org/theme": "2.2.
|
|
83
|
+
"@nextui-org/button": "2.0.33",
|
|
84
|
+
"@nextui-org/checkbox": "2.1.1",
|
|
85
|
+
"@nextui-org/input": "2.2.1",
|
|
86
|
+
"@nextui-org/radio": "2.1.1",
|
|
87
|
+
"@nextui-org/select": "2.2.1",
|
|
88
|
+
"@nextui-org/switch": "2.0.30",
|
|
89
|
+
"@nextui-org/system": "2.2.1",
|
|
90
|
+
"@nextui-org/theme": "2.2.5",
|
|
91
91
|
"@react-aria/visually-hidden": "3.8.12",
|
|
92
92
|
"react-icons": "5.2.1",
|
|
93
|
-
"classnames": "2.5.1",
|
|
94
93
|
"react-hook-form": "7.51.5",
|
|
95
94
|
"react-select": "5.8.0",
|
|
96
95
|
"slug": "9.1.0",
|
|
97
|
-
"
|
|
98
|
-
"@fuf-stack/
|
|
99
|
-
"@fuf-stack/
|
|
96
|
+
"@fuf-stack/pixels": "0.10.0",
|
|
97
|
+
"@fuf-stack/veto": "0.4.0",
|
|
98
|
+
"@fuf-stack/pixel-utils": "0.0.1"
|
|
100
99
|
},
|
|
101
100
|
"devDependencies": {
|
|
102
101
|
"@types/debug": "4.1.12",
|
|
@@ -105,10 +104,10 @@
|
|
|
105
104
|
"@types/slug": "5.0.8",
|
|
106
105
|
"react": "18.3.1",
|
|
107
106
|
"react-dom": "18.3.1",
|
|
108
|
-
"@repo/storybook-config": "0.0.1",
|
|
109
107
|
"@repo/tailwind-config": "0.0.1",
|
|
110
|
-
"@repo/
|
|
111
|
-
"@repo/tsup-config": "0.0.1"
|
|
108
|
+
"@repo/storybook-config": "0.0.1",
|
|
109
|
+
"@repo/tsup-config": "0.0.1",
|
|
110
|
+
"@repo/vite-config": "0.0.1"
|
|
112
111
|
},
|
|
113
112
|
"scripts": {
|
|
114
113
|
"build": "tsup --config node_modules/@repo/tsup-config/config.ts",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Input/Input.tsx","../src/Input/index.ts"],"names":["Input_default"],"mappings":";;;;;;;;;;;AAEA,SAAS,kBAAkB;AAE3B,SAAS,SAAS,iBAAiB;AACnC,OAAO,QAAQ;AAwDoB,SAKrB,UALqB,KAKrB,YALqB;AA5BnC,IAAM,QAAQ,CAAC;AAAA,EACb,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,QAAQ;AAAA,EACR;AAAA,EACA,cAAc;AAAA,EACd,eAAe;AAAA,EACf,QAAQ,UAAU;AAAA,EAClB,OAAO;AACT,MAAkB;AAChB,QAAM,EAAE,SAAS,cAAc,IAAI,eAAe;AAClD,QAAM,EAAE,OAAO,SAAS,UAAU,OAAO,IAAI,cAAc,MAAM,OAAO;AAExE,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ,CAAC;AAAA,QACP,OAAO,EAAE,UAAU,YAAY,UAAU,QAAQ,OAAO,IAAI;AAAA,MAC9D,MAAM;AACJ,eACE;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,GAAG,SAAS;AAAA,YACvB,YAAY;AAAA,cACV,cAAc;AAAA,YAChB;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA,cAAc,SAAS,oBAAC,gCAAqB,OAAc;AAAA,YAC3D;AAAA,YACA,WAAW;AAAA,YACX,YAAY;AAAA,YACZ,OACE,iCACG;AAAA;AAAA,cACD,oBAAC,iCAAsB,QAAgB;AAAA,eACzC;AAAA,YAEF,gBAAe;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,QAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAQ;AAAA;AAAA,QACV;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;;;ACnFf,IAAOA,iBAAQ","sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Controller } from 'react-hook-form';\n\nimport { Input as NextInput } from '@nextui-org/input';\nimport cn from 'classnames';\n\nimport { useFormContext } from '../hooks';\nimport FieldCopyTestIdButton from '../partials/FieldCopyTestIdButton';\nimport FieldValidationError from '../partials/FieldValidationError';\n\nexport interface InputProps {\n /** CSS class name */\n className?: string;\n /** added content to the end of the input Field. */\n endContent?: ReactNode;\n /** form field label (set to false to disable label) */\n label?: string | false;\n /** form field name */\n name: string;\n /** form field placeholder */\n placeholder?: string;\n /** content added to the start of the input field */\n startContent?: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [NextUI Input](https://nextui.org/docs/components/input)\n */\nconst Input = ({\n className = undefined,\n endContent = undefined,\n label = undefined,\n name,\n placeholder = ' ',\n startContent = undefined,\n testId: _testId = undefined,\n type = undefined,\n}: InputProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n return (\n <Controller\n control={control}\n name={name}\n render={({\n field: { disabled: isDisabled, onChange, onBlur, value, ref },\n }) => {\n return (\n <NextInput\n className={cn(className)}\n classNames={{\n inputWrapper: 'group-data-[focus=true]:border-primary',\n }}\n data-testid={testId}\n endContent={endContent}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n <>\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </>\n }\n labelPlacement=\"outside\"\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n placeholder={placeholder}\n radius=\"sm\"\n ref={ref}\n startContent={startContent}\n type={type}\n value={value}\n variant=\"bordered\"\n />\n );\n }}\n />\n );\n};\n\nexport default Input;\n","import Input from './Input';\n\nexport type { InputProps } from './Input';\n\nexport { Input };\n\nexport default Input;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Input/Input.tsx","../src/Input/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Controller } from 'react-hook-form';\n\nimport { Input as NextInput } from '@nextui-org/input';\nimport cn from 'classnames';\n\nimport { useFormContext } from '../hooks';\nimport FieldCopyTestIdButton from '../partials/FieldCopyTestIdButton';\nimport FieldValidationError from '../partials/FieldValidationError';\n\nexport interface InputProps {\n /** CSS class name */\n className?: string;\n /** added content to the end of the input Field. */\n endContent?: ReactNode;\n /** form field label (set to false to disable label) */\n label?: string | false;\n /** form field name */\n name: string;\n /** form field placeholder */\n placeholder?: string;\n /** content added to the start of the input field */\n startContent?: ReactNode;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n /** input type */\n type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [NextUI Input](https://nextui.org/docs/components/input)\n */\nconst Input = ({\n className = undefined,\n endContent = undefined,\n label = undefined,\n name,\n placeholder = ' ',\n startContent = undefined,\n testId: _testId = undefined,\n type = undefined,\n}: InputProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n return (\n <Controller\n control={control}\n name={name}\n render={({\n field: { disabled: isDisabled, onChange, onBlur, value, ref },\n }) => {\n return (\n <NextInput\n className={cn(className)}\n classNames={{\n inputWrapper: 'group-data-[focus=true]:border-primary',\n }}\n data-testid={testId}\n endContent={endContent}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n <>\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </>\n }\n labelPlacement=\"outside\"\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n placeholder={placeholder}\n radius=\"sm\"\n ref={ref}\n startContent={startContent}\n type={type}\n value={value}\n variant=\"bordered\"\n />\n );\n }}\n />\n );\n};\n\nexport default Input;\n","import Input from './Input';\n\nexport type { InputProps } from './Input';\n\nexport { Input };\n\nexport default Input;\n"],"mappings":";;;;;;;;;;;AAEA,SAAS,kBAAkB;AAE3B,SAAS,SAAS,iBAAiB;AACnC,OAAO,QAAQ;AAwDoB,SAKrB,UALqB,KAKrB,YALqB;AA5BnC,IAAM,QAAQ,CAAC;AAAA,EACb,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,QAAQ;AAAA,EACR;AAAA,EACA,cAAc;AAAA,EACd,eAAe;AAAA,EACf,QAAQ,UAAU;AAAA,EAClB,OAAO;AACT,MAAkB;AAChB,QAAM,EAAE,SAAS,cAAc,IAAI,eAAe;AAClD,QAAM,EAAE,OAAO,SAAS,UAAU,OAAO,IAAI,cAAc,MAAM,OAAO;AAExE,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,QAAQ,CAAC;AAAA,QACP,OAAO,EAAE,UAAU,YAAY,UAAU,QAAQ,OAAO,IAAI;AAAA,MAC9D,MAAM;AACJ,eACE;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,GAAG,SAAS;AAAA,YACvB,YAAY;AAAA,cACV,cAAc;AAAA,YAChB;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA,cAAc,SAAS,oBAAC,gCAAqB,OAAc;AAAA,YAC3D;AAAA,YACA,WAAW;AAAA,YACX,YAAY;AAAA,YACZ,OACE,iCACG;AAAA;AAAA,cACD,oBAAC,iCAAsB,QAAgB;AAAA,eACzC;AAAA,YAEF,gBAAe;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,QAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAQ;AAAA;AAAA,QACV;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,gBAAQ;;;ACnFf,IAAOA,iBAAQ;","names":["Input_default"]}
|
|
@@ -1 +0,0 @@
|
|
|
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":";;;;;;;;;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,EAAAH;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,gBAAAE,KAAC,uBAAc,GAAG,SAAS,YACzB,0BAAAC,MAAC,SAAI,WAAU,8CACb;AAAA,sBAAAD;AAAA,QAAC;AAAA;AAAA,UACC,WAAWD,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,gBAAAC,KAAC,2BAAgB,WAAU,oBAAmB;AAAA,OAChD,GACF;AAAA;AAEJ;AAEA,IAAO,eAAQ;;;AEzGf,IAAOE,gBAAQ","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"]}
|
|
@@ -1 +0,0 @@
|
|
|
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"]}
|
|
@@ -1 +0,0 @@
|
|
|
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":"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","names":["useEffect","cn","jsx","jsxs","useEffect","cn","Form_default"]}
|
|
@@ -1 +0,0 @@
|
|
|
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\nexport interface FieldCopyTestIdButtonProps {\n className?: string;\n testId: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\nconst FieldCopyTestIdButton = ({\n className = undefined,\n testId,\n}: FieldCopyTestIdButtonProps) => {\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 FieldCopyTestIdButton;\n","import FieldCopyTestIdButton from './FieldCopyTestIdButton';\n\nexport type { FieldCopyTestIdButtonProps } from './FieldCopyTestIdButton';\n\nexport { FieldCopyTestIdButton };\n\nexport default FieldCopyTestIdButton;\n"],"mappings":";AAAA,SAAS,kBAAkB;AAE3B,OAAO,QAAQ;AAEf,SAAS,QAAQ,uBAAuB;AA8B5B;AAvBZ,IAAM,yBAAyB;AAE/B,IAAM,wBAAwB,CAAC;AAAA,EAC7B,YAAY;AAAA,EACZ;AACF,MAAkC;AAChC,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;;;ACjCf,IAAOA,iCAAQ;","names":["FieldCopyTestIdButton_default"]}
|
|
@@ -1 +0,0 @@
|
|
|
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;\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 /** size of the 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 children = 'Submit',\n className = undefined,\n color = 'success',\n loading = false,\n onClick = undefined,\n size = 'md',\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 size={size}\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;AAuCnB;AAdJ,IAAM,eAAe,CAAC;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AAAA,EACV,OAAO;AAAA,EACP,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;AAAA,MACA,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;;;ACrDf,IAAOA,wBAAQ;","names":["SubmitButton_default"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":";;;;;;;;AAGA,OAAO,QAAQ;AAEf,SAAS,cAAc;AAuCnB;AAdJ,IAAM,eAAe,CAAC;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AAAA,EACV,OAAO;AAAA,EACP,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;AAAA,MACA,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;;;ACrDf,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;\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 /** size of the 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 children = 'Submit',\n className = undefined,\n color = 'success',\n loading = false,\n onClick = undefined,\n size = 'md',\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 size={size}\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 +0,0 @@
|
|
|
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"]}
|