@fuf-stack/uniform 0.10.0 → 0.10.2
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/CheckboxGroup/index.cjs +4 -4
- package/dist/CheckboxGroup/index.js +3 -3
- package/dist/FieldArray/index.cjs +4 -4
- package/dist/FieldArray/index.js +3 -3
- package/dist/{FieldCopyTestIdButton-D-z1usqE.d.cts → FieldCopyTestIdButton-DnbovhMk.d.cts} +1 -1
- package/dist/{FieldCopyTestIdButton-D-z1usqE.d.ts → FieldCopyTestIdButton-DnbovhMk.d.ts} +1 -1
- package/dist/Form/index.cjs +3 -3
- package/dist/Form/index.d.cts +2 -2
- package/dist/Form/index.d.ts +2 -2
- package/dist/Form/index.js +2 -2
- package/dist/{Form-nJbG1hNH.d.cts → Form-Dav2xhog.d.cts} +3 -1
- package/dist/{Form-nJbG1hNH.d.ts → Form-Dav2xhog.d.ts} +3 -1
- package/dist/Input/index.cjs +4 -4
- package/dist/Input/index.js +3 -3
- package/dist/RadioGroup/index.cjs +4 -4
- package/dist/RadioGroup/index.js +3 -3
- package/dist/Select/index.cjs +4 -4
- package/dist/Select/index.js +3 -3
- package/dist/SubmitButton/index.cjs +3 -3
- package/dist/SubmitButton/index.js +2 -2
- package/dist/Switch/index.cjs +4 -4
- package/dist/Switch/index.js +3 -3
- package/dist/TextArea/index.cjs +4 -4
- package/dist/TextArea/index.js +3 -3
- package/dist/{chunk-T3CCNJHK.js → chunk-2CRY7VDQ.js} +2 -9
- package/dist/chunk-2CRY7VDQ.js.map +1 -0
- package/dist/{chunk-66Q6RBEH.cjs → chunk-3KT6EELT.cjs} +6 -5
- package/dist/chunk-3KT6EELT.cjs.map +1 -0
- package/dist/{chunk-5KT2DABR.js → chunk-4YV5S72F.js} +8 -6
- package/dist/chunk-4YV5S72F.js.map +1 -0
- package/dist/{chunk-BLE4OMIE.js → chunk-6LIAYPMV.js} +8 -6
- package/dist/chunk-6LIAYPMV.js.map +1 -0
- package/dist/{chunk-ZEABU72A.js → chunk-7XOJIVJG.js} +6 -5
- package/dist/chunk-7XOJIVJG.js.map +1 -0
- package/dist/{chunk-NOQAV5ZC.cjs → chunk-DW5HZXZO.cjs} +8 -6
- package/dist/chunk-DW5HZXZO.cjs.map +1 -0
- package/dist/{chunk-DF77NLWL.js → chunk-EG3EFTJN.js} +16 -19
- package/dist/chunk-EG3EFTJN.js.map +1 -0
- package/dist/{chunk-KMMS4G7A.cjs → chunk-JU5RT22Y.cjs} +1 -8
- package/dist/chunk-JU5RT22Y.cjs.map +1 -0
- package/dist/{chunk-SO5IM3SF.cjs → chunk-K6PIOPQN.cjs} +8 -6
- package/dist/chunk-K6PIOPQN.cjs.map +1 -0
- package/dist/{chunk-HFMFDBEV.cjs → chunk-KVJNGHAP.cjs} +8 -6
- package/dist/chunk-KVJNGHAP.cjs.map +1 -0
- package/dist/{chunk-QYZV7ZUY.cjs → chunk-LCLUJFBW.cjs} +17 -20
- package/dist/chunk-LCLUJFBW.cjs.map +1 -0
- package/dist/{chunk-JDRMKZ35.cjs → chunk-MK2PLALW.cjs} +17 -7
- package/dist/chunk-MK2PLALW.cjs.map +1 -0
- package/dist/{chunk-HWDQZO7X.js → chunk-NAGQKQ7C.js} +12 -2
- package/dist/chunk-NAGQKQ7C.js.map +1 -0
- package/dist/{chunk-JG5VQZ4V.js → chunk-ORFZIRSW.js} +8 -6
- package/dist/chunk-ORFZIRSW.js.map +1 -0
- package/dist/{chunk-MKM7ZYRN.cjs → chunk-PTJDXWBN.cjs} +3 -3
- package/dist/{chunk-MKM7ZYRN.cjs.map → chunk-PTJDXWBN.cjs.map} +1 -1
- package/dist/{chunk-JLUF7DUK.cjs → chunk-R3IBN7K6.cjs} +8 -6
- package/dist/chunk-R3IBN7K6.cjs.map +1 -0
- package/dist/{chunk-RL4X2SBO.cjs → chunk-R4SIKN2S.cjs} +8 -6
- package/dist/chunk-R4SIKN2S.cjs.map +1 -0
- package/dist/{chunk-LDCRR7FP.cjs → chunk-S4GIEBID.cjs} +12 -2
- package/dist/chunk-S4GIEBID.cjs.map +1 -0
- package/dist/{chunk-HSPC7ZZX.js → chunk-TPQE3IFL.js} +8 -6
- package/dist/chunk-TPQE3IFL.js.map +1 -0
- package/dist/{chunk-2OIYYWTC.js → chunk-VBDGQ5T3.js} +8 -6
- package/dist/chunk-VBDGQ5T3.js.map +1 -0
- package/dist/{chunk-F7GG67YU.js → chunk-ZFF2GFNX.js} +16 -6
- package/dist/chunk-ZFF2GFNX.js.map +1 -0
- package/dist/{chunk-4GVPJYZW.js → chunk-ZNVGXKHS.js} +2 -2
- package/dist/hooks/index.cjs +2 -2
- package/dist/hooks/index.d.cts +2 -0
- package/dist/hooks/index.d.ts +2 -0
- package/dist/hooks/index.js +1 -1
- package/dist/index.cjs +12 -12
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +13 -13
- package/dist/partials/FieldCopyTestIdButton/index.cjs +2 -2
- package/dist/partials/FieldCopyTestIdButton/index.d.cts +2 -2
- package/dist/partials/FieldCopyTestIdButton/index.d.ts +2 -2
- package/dist/partials/FieldCopyTestIdButton/index.js +1 -1
- package/package.json +6 -6
- package/dist/chunk-2OIYYWTC.js.map +0 -1
- package/dist/chunk-5KT2DABR.js.map +0 -1
- package/dist/chunk-66Q6RBEH.cjs.map +0 -1
- package/dist/chunk-BLE4OMIE.js.map +0 -1
- package/dist/chunk-DF77NLWL.js.map +0 -1
- package/dist/chunk-F7GG67YU.js.map +0 -1
- package/dist/chunk-HFMFDBEV.cjs.map +0 -1
- package/dist/chunk-HSPC7ZZX.js.map +0 -1
- package/dist/chunk-HWDQZO7X.js.map +0 -1
- package/dist/chunk-JDRMKZ35.cjs.map +0 -1
- package/dist/chunk-JG5VQZ4V.js.map +0 -1
- package/dist/chunk-JLUF7DUK.cjs.map +0 -1
- package/dist/chunk-KMMS4G7A.cjs.map +0 -1
- package/dist/chunk-LDCRR7FP.cjs.map +0 -1
- package/dist/chunk-NOQAV5ZC.cjs.map +0 -1
- package/dist/chunk-QYZV7ZUY.cjs.map +0 -1
- package/dist/chunk-RL4X2SBO.cjs.map +0 -1
- package/dist/chunk-SO5IM3SF.cjs.map +0 -1
- package/dist/chunk-T3CCNJHK.js.map +0 -1
- package/dist/chunk-ZEABU72A.js.map +0 -1
- /package/dist/{chunk-4GVPJYZW.js.map → chunk-ZNVGXKHS.js.map} +0 -0
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import {
|
|
2
2
|
FieldCopyTestIdButton_default
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-2CRY7VDQ.js";
|
|
4
4
|
import {
|
|
5
5
|
FieldValidationError_default
|
|
6
6
|
} from "./chunk-WKM2D7LF.js";
|
|
7
7
|
import {
|
|
8
8
|
useFormContext
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-NAGQKQ7C.js";
|
|
10
10
|
|
|
11
11
|
// src/Switch/Switch.tsx
|
|
12
12
|
import { Controller } from "react-hook-form";
|
|
@@ -35,7 +35,7 @@ var Switch = ({
|
|
|
35
35
|
name,
|
|
36
36
|
testId: _testId = void 0
|
|
37
37
|
}) => {
|
|
38
|
-
const { control, getFieldState } = useFormContext();
|
|
38
|
+
const { control, debugMode, getFieldState } = useFormContext();
|
|
39
39
|
const { error, required, testId, invalid } = getFieldState(name, _testId);
|
|
40
40
|
const { label, getInputProps, getErrorMessageProps } = useInput({
|
|
41
41
|
errorMessage: JSON.stringify(error),
|
|
@@ -47,6 +47,7 @@ var Switch = ({
|
|
|
47
47
|
});
|
|
48
48
|
const variants = switchVariants();
|
|
49
49
|
const classNames = variantsToClassNames(variants, className, "outerWrapper");
|
|
50
|
+
const showTestIdCopyButton = debugMode === "debug-testids";
|
|
50
51
|
return /* @__PURE__ */ jsx(
|
|
51
52
|
Controller,
|
|
52
53
|
{
|
|
@@ -74,7 +75,7 @@ var Switch = ({
|
|
|
74
75
|
value,
|
|
75
76
|
children: [
|
|
76
77
|
label,
|
|
77
|
-
/* @__PURE__ */ jsx(FieldCopyTestIdButton_default, { testId })
|
|
78
|
+
showTestIdCopyButton && /* @__PURE__ */ jsx(FieldCopyTestIdButton_default, { testId })
|
|
78
79
|
]
|
|
79
80
|
}
|
|
80
81
|
),
|
|
@@ -98,4 +99,4 @@ export {
|
|
|
98
99
|
Switch_default,
|
|
99
100
|
Switch_default2
|
|
100
101
|
};
|
|
101
|
-
//# sourceMappingURL=chunk-
|
|
102
|
+
//# sourceMappingURL=chunk-7XOJIVJG.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Switch/Switch.tsx","../src/Switch/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from 'react-hook-form';\n\nimport { useInput } from '@nextui-org/input';\nimport { Switch as NextSwitch } from '@nextui-org/switch';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const switchVariants = tv({\n slots: {\n base: '',\n endContent: '',\n errorMessage: 'ml-1 mt-1',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n outerWrapper: 'place-content-center',\n startContent: '',\n thumb: '',\n thumbIcon: '',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof switchVariants>;\ntype ClassName = TVClassName<typeof switchVariants>;\n\nexport interface SwitchProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** whether the select should be disabled */\n disabled?: boolean;\n /** component displayed next to the switch. */\n label?: React.ReactNode;\n /** name the field is registered under */\n name: string;\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * Switch component based on [NextUI Switch](https://nextui.org/docs/components/switch)\n */\nconst Switch = ({\n className = undefined,\n disabled = false,\n label: _label = undefined,\n name,\n testId: _testId = undefined,\n}: SwitchProps) => {\n const { control, debugMode, getFieldState } = useFormContext();\n const { error, required, testId, invalid } = getFieldState(name, _testId);\n\n const { label, getInputProps, getErrorMessageProps } = useInput({\n errorMessage: JSON.stringify(error),\n isInvalid: invalid,\n isRequired: required,\n label: _label,\n labelPlacement: 'outside',\n placeholder: ' ',\n });\n\n const variants = switchVariants();\n const classNames = variantsToClassNames(variants, className, 'outerWrapper');\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n\n return (\n <Controller\n name={name}\n control={control}\n disabled={disabled}\n render={({\n field: { disabled: isDisabled, value, ref, onBlur, onChange },\n }) => (\n <div className={classNames.outerWrapper}>\n <NextSwitch\n aria-describedby={getInputProps()['aria-describedby']}\n classNames={classNames}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n isDisabled={isDisabled}\n isSelected={!!value}\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n ref={ref}\n required={required}\n value={value}\n >\n {label}\n {showTestIdCopyButton && <FieldCopyTestIdButton testId={testId} />}\n </NextSwitch>\n {error && (\n <div className={classNames.errorMessage}>\n <div\n /* eslint-disable-next-line react/jsx-props-no-spreading */\n {...getErrorMessageProps()}\n >\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Switch;\n","import Switch from './Switch';\n\nexport type { SwitchProps } from './Switch';\n\nexport { Switch };\n\nexport default Switch;\n"],"mappings":";;;;;;;;;;;AAEA,SAAS,kBAAkB;AAE3B,SAAS,gBAAgB;AACzB,SAAS,UAAU,kBAAkB;AAErC,SAAS,IAAI,4BAA4B;AA0E/B,SAiB2B,KAjB3B;AApEH,IAAM,iBAAiB,GAAG;AAAA,EAC/B,OAAO;AAAA,IACL,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,cAAc;AAAA;AAAA,IAEd,OACE;AAAA,IACF,cAAc;AAAA,IACd,cAAc;AAAA,IACd,OAAO;AAAA,IACP,WAAW;AAAA,IACX,SAAS;AAAA,EACX;AACF,CAAC;AAqBD,IAAM,SAAS,CAAC;AAAA,EACd,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,OAAO,SAAS;AAAA,EAChB;AAAA,EACA,QAAQ,UAAU;AACpB,MAAmB;AACjB,QAAM,EAAE,SAAS,WAAW,cAAc,IAAI,eAAe;AAC7D,QAAM,EAAE,OAAO,UAAU,QAAQ,QAAQ,IAAI,cAAc,MAAM,OAAO;AAExE,QAAM,EAAE,OAAO,eAAe,qBAAqB,IAAI,SAAS;AAAA,IAC9D,cAAc,KAAK,UAAU,KAAK;AAAA,IAClC,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,gBAAgB;AAAA,IAChB,aAAa;AAAA,EACf,CAAC;AAED,QAAM,WAAW,eAAe;AAChC,QAAM,aAAa,qBAAqB,UAAU,WAAW,cAAc;AAE3E,QAAM,uBAAuB,cAAc;AAE3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,CAAC;AAAA,QACP,OAAO,EAAE,UAAU,YAAY,OAAO,KAAK,QAAQ,SAAS;AAAA,MAC9D,MACE,qBAAC,SAAI,WAAW,WAAW,cACzB;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,oBAAkB,cAAc,EAAE,kBAAkB;AAAA,YACpD;AAAA,YAEA,gBAAc;AAAA,YACd,iBAAe;AAAA,YACf,eAAa;AAAA,YACb;AAAA,YACA,YAAY,CAAC,CAAC;AAAA,YACd;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YAEC;AAAA;AAAA,cACA,wBAAwB,oBAAC,iCAAsB,QAAgB;AAAA;AAAA;AAAA,QAClE;AAAA,QACC,SACC,oBAAC,SAAI,WAAW,WAAW,cACzB;AAAA,UAAC;AAAA;AAAA,YAEE,GAAG,qBAAqB;AAAA,YAEzB,8BAAC,gCAAqB,OAAc;AAAA;AAAA,QACtC,GACF;AAAA,SAEJ;AAAA;AAAA,EAEJ;AAEJ;AAEA,IAAO,iBAAQ;;;AC9Gf,IAAOA,kBAAQ;","names":["Switch_default"]}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunkJU5RT22Ycjs = require('./chunk-JU5RT22Y.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
var _chunkOHJYXA6Rcjs = require('./chunk-OHJYXA6R.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkS4GIEBIDcjs = require('./chunk-S4GIEBID.cjs');
|
|
10
10
|
|
|
11
11
|
// src/Input/Input.tsx
|
|
12
12
|
var _reacthookform = require('react-hook-form');
|
|
@@ -24,8 +24,10 @@ var Input = ({
|
|
|
24
24
|
testId: _testId = void 0,
|
|
25
25
|
type = void 0
|
|
26
26
|
}) => {
|
|
27
|
-
const { control, getFieldState } =
|
|
27
|
+
const { control, debugMode, getFieldState } = _chunkS4GIEBIDcjs.useFormContext.call(void 0, );
|
|
28
28
|
const { error, invalid, required, testId } = getFieldState(name, _testId);
|
|
29
|
+
const showTestIdCopyButton = debugMode === "debug-testids";
|
|
30
|
+
const showLabel = label || showTestIdCopyButton;
|
|
29
31
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
30
32
|
_reacthookform.Controller,
|
|
31
33
|
{
|
|
@@ -48,9 +50,9 @@ var Input = ({
|
|
|
48
50
|
isDisabled,
|
|
49
51
|
isInvalid: invalid,
|
|
50
52
|
isRequired: required,
|
|
51
|
-
label: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
|
|
53
|
+
label: showLabel && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
|
|
52
54
|
label,
|
|
53
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
55
|
+
showTestIdCopyButton && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJU5RT22Ycjs.FieldCopyTestIdButton_default, { testId })
|
|
54
56
|
] }),
|
|
55
57
|
labelPlacement: "outside",
|
|
56
58
|
name,
|
|
@@ -80,4 +82,4 @@ var Input_default2 = Input_default;
|
|
|
80
82
|
|
|
81
83
|
|
|
82
84
|
exports.Input_default = Input_default; exports.Input_default2 = Input_default2;
|
|
83
|
-
//# sourceMappingURL=chunk-
|
|
85
|
+
//# sourceMappingURL=chunk-DW5HZXZO.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-DW5HZXZO.cjs","../src/Input/Input.tsx","../src/Input/index.ts"],"names":["Input_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACRA,gDAA2B;AAE3B,0CAAmC;AAEnC,oDAAmB;AA+DgB,+CAAA;AAjCnC,IAAM,MAAA,EAAQ,CAAC;AAAA,EACb,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,SAAA,EAAW,KAAA;AAAA,EACX,WAAA,EAAa,KAAA,CAAA;AAAA,EACb,MAAA,EAAQ,KAAA,CAAA;AAAA,EACR,IAAA;AAAA,EACA,YAAA,EAAc,GAAA;AAAA,EACd,aAAA,EAAe,KAAA,CAAA;AAAA,EACf,MAAA,EAAQ,QAAA,EAAU,KAAA,CAAA;AAAA,EAClB,KAAA,EAAO,KAAA;AACT,CAAA,EAAA,GAAkB;AAChB,EAAA,MAAM,EAAE,OAAA,EAAS,SAAA,EAAW,cAAc,EAAA,EAAI,8CAAA,CAAe;AAC7D,EAAA,MAAM,EAAE,KAAA,EAAO,OAAA,EAAS,QAAA,EAAU,OAAO,EAAA,EAAI,aAAA,CAAc,IAAA,EAAM,OAAO,CAAA;AAExE,EAAA,MAAM,qBAAA,EAAuB,UAAA,IAAc,eAAA;AAC3C,EAAA,MAAM,UAAA,EAAY,MAAA,GAAS,oBAAA;AAE3B,EAAA,uBACE,6BAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,QAAA;AAAA,MACA,IAAA;AAAA,MACA,MAAA,EAAQ,CAAC;AAAA,QACP,KAAA,EAAO,EAAE,QAAA,EAAU,UAAA,EAAY,QAAA,EAAU,MAAA,EAAQ,KAAA,EAAO,IAAI;AAAA,MAC9D,CAAA,EAAA,GAAM;AACJ,QAAA,uBACE,6BAAA;AAAA,UAAC,YAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,4BAAA,SAAY,CAAA;AAAA,YACvB,UAAA,EAAY;AAAA,cACV,YAAA,EAAc;AAAA,YAChB,CAAA;AAAA,YACA,aAAA,EAAa,MAAA;AAAA,YACb,UAAA;AAAA,YACA,YAAA,EAAc,MAAA,mBAAS,6BAAA,8CAAC,EAAA,EAAqB,MAAA,CAAc,CAAA;AAAA,YAC3D,UAAA;AAAA,YACA,SAAA,EAAW,OAAA;AAAA,YACX,UAAA,EAAY,QAAA;AAAA,YACZ,KAAA,EACE,UAAA,mBACE,8BAAA,oBAAA,EAAA,EACG,QAAA,EAAA;AAAA,cAAA,KAAA;AAAA,cACA,qBAAA,mBACC,6BAAA,+CAAC,EAAA,EAAsB,OAAA,CAAgB;AAAA,YAAA,EAAA,CAE3C,CAAA;AAAA,YAGJ,cAAA,EAAe,SAAA;AAAA,YACf,IAAA;AAAA,YACA,MAAA;AAAA,YACA,QAAA,EACE,KAAA,IAAS,SAAA,EACL,CAAC,CAAA,EAAA,GAAM;AACL,cAAA,QAAA,CAAS,MAAA,CAAO,CAAA,CAAE,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,YACjC,EAAA,EACA,QAAA;AAAA,YAEN,WAAA;AAAA,YACA,MAAA,EAAO,IAAA;AAAA,YACP,GAAA;AAAA,YACA,YAAA;AAAA,YACA,IAAA;AAAA,YACA,KAAA;AAAA,YACA,OAAA,EAAQ;AAAA,UAAA;AAAA,QACV,CAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACF,CAAA;AAEJ,CAAA;AAEA,IAAO,cAAA,EAAQ,KAAA;AD/Bf;AACA;AEvEA,IAAOA,eAAAA,EAAQ,aAAA;AFyEf;AACA;AACE;AACA;AACF,+EAAC","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-DW5HZXZO.cjs","sourcesContent":[null,"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, debugMode, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label || showTestIdCopyButton;\n\n return (\n <Controller\n control={control}\n disabled={disabled}\n name={name}\n render={({\n field: { disabled: isDisabled, onChange, onBlur, value, ref },\n }) => {\n return (\n <NextInput\n className={cn(className)}\n classNames={{\n inputWrapper: 'group-data-[focus=true]:border-focus',\n }}\n data-testid={testId}\n endContent={endContent}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n showLabel && (\n <>\n {label}\n {showTestIdCopyButton && (\n <FieldCopyTestIdButton testId={testId} />\n )}\n </>\n )\n }\n labelPlacement=\"outside\"\n name={name}\n onBlur={onBlur}\n onChange={\n type === 'number'\n ? (e) => {\n onChange(Number(e.target.value));\n }\n : onChange\n }\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,7 +1,7 @@
|
|
|
1
1
|
import {
|
|
2
2
|
FormContext_default,
|
|
3
3
|
useFormContext
|
|
4
|
-
} from "./chunk-
|
|
4
|
+
} from "./chunk-NAGQKQ7C.js";
|
|
5
5
|
import {
|
|
6
6
|
slugify
|
|
7
7
|
} from "./chunk-V46BHM2U.js";
|
|
@@ -14,23 +14,19 @@ import { useEffect, useState } from "react";
|
|
|
14
14
|
import { FaTimes } from "react-icons/fa";
|
|
15
15
|
import { FaBug, FaBullseye } from "react-icons/fa6";
|
|
16
16
|
import { cn } from "@fuf-stack/pixel-utils";
|
|
17
|
-
import { Button, Card, Json
|
|
17
|
+
import { Button, Card, Json } from "@fuf-stack/pixels";
|
|
18
18
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
19
|
-
var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
|
|
20
|
-
var LOCALSTORAGE_COPY_TEST_ID_KEY = "uniform:form-debug-copy-test-id-enabled";
|
|
21
19
|
var FormDebugViewer = ({ className = void 0 }) => {
|
|
22
20
|
const {
|
|
23
|
-
|
|
21
|
+
debugMode,
|
|
24
22
|
formState: { dirtyFields, isValid, isSubmitting },
|
|
25
|
-
|
|
23
|
+
setDebugMode,
|
|
24
|
+
validation,
|
|
25
|
+
watch
|
|
26
26
|
} = useFormContext();
|
|
27
|
-
const [debug, setDebug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);
|
|
28
|
-
const [copyTestId, setCopyTestId] = useLocalStorage(
|
|
29
|
-
LOCALSTORAGE_COPY_TEST_ID_KEY,
|
|
30
|
-
false
|
|
31
|
-
);
|
|
32
27
|
const [validationErrors, setValidationErrors] = useState(null);
|
|
33
28
|
const formValues = watch();
|
|
29
|
+
const debugTestIdsEnabled = debugMode === "debug-testids";
|
|
34
30
|
useEffect(
|
|
35
31
|
() => {
|
|
36
32
|
const updateValidationErrors = async () => {
|
|
@@ -44,12 +40,12 @@ var FormDebugViewer = ({ className = void 0 }) => {
|
|
|
44
40
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
45
41
|
[JSON.stringify(formValues)]
|
|
46
42
|
);
|
|
47
|
-
if (!
|
|
43
|
+
if (!debugMode || debugMode === "off") {
|
|
48
44
|
return /* @__PURE__ */ jsx(
|
|
49
45
|
Button,
|
|
50
46
|
{
|
|
51
47
|
ariaLabel: "Enable form debug mode",
|
|
52
|
-
onClick: () =>
|
|
48
|
+
onClick: () => setDebugMode("debug"),
|
|
53
49
|
className: "absolute bottom-2.5 right-2.5 w-5 text-default-400",
|
|
54
50
|
variant: "light",
|
|
55
51
|
icon: /* @__PURE__ */ jsx(FaBug, {})
|
|
@@ -66,7 +62,7 @@ var FormDebugViewer = ({ className = void 0 }) => {
|
|
|
66
62
|
Button,
|
|
67
63
|
{
|
|
68
64
|
icon: /* @__PURE__ */ jsx(FaTimes, { className: "text-danger" }),
|
|
69
|
-
onClick: () =>
|
|
65
|
+
onClick: () => setDebugMode("off"),
|
|
70
66
|
size: "sm",
|
|
71
67
|
variant: "flat"
|
|
72
68
|
}
|
|
@@ -76,11 +72,11 @@ var FormDebugViewer = ({ className = void 0 }) => {
|
|
|
76
72
|
/* @__PURE__ */ jsx(
|
|
77
73
|
Button,
|
|
78
74
|
{
|
|
79
|
-
variant:
|
|
75
|
+
variant: debugTestIdsEnabled ? "solid" : "light",
|
|
80
76
|
icon: /* @__PURE__ */ jsx(FaBullseye, {}),
|
|
81
77
|
className: "mb-4 ml-auto mr-auto",
|
|
82
|
-
onClick: () =>
|
|
83
|
-
children:
|
|
78
|
+
onClick: () => setDebugMode(debugMode === "debug" ? "debug-testids" : "debug"),
|
|
79
|
+
children: debugTestIdsEnabled ? "Hide CopyButton" : "Show CopyButton"
|
|
84
80
|
}
|
|
85
81
|
),
|
|
86
82
|
/* @__PURE__ */ jsx(
|
|
@@ -106,6 +102,7 @@ import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
|
106
102
|
var Form = ({
|
|
107
103
|
children,
|
|
108
104
|
className = void 0,
|
|
105
|
+
disableDebug = false,
|
|
109
106
|
initialValues = void 0,
|
|
110
107
|
name = void 0,
|
|
111
108
|
onSubmit,
|
|
@@ -131,7 +128,7 @@ var Form = ({
|
|
|
131
128
|
children
|
|
132
129
|
}
|
|
133
130
|
),
|
|
134
|
-
/* @__PURE__ */ jsx2(FormDebugViewer_default, { className: "w-96 flex-shrink" })
|
|
131
|
+
!disableDebug && /* @__PURE__ */ jsx2(FormDebugViewer_default, { className: "w-96 flex-shrink" })
|
|
135
132
|
] })
|
|
136
133
|
}
|
|
137
134
|
);
|
|
@@ -145,4 +142,4 @@ export {
|
|
|
145
142
|
Form_default,
|
|
146
143
|
Form_default2
|
|
147
144
|
};
|
|
148
|
-
//# sourceMappingURL=chunk-
|
|
145
|
+
//# sourceMappingURL=chunk-EG3EFTJN.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 { cn } from '@fuf-stack/pixel-utils';\n\nimport { slugify } from '../helpers';\nimport FormProvider from './subcomponents/FormContext';\nimport FormDebugViewer from './subcomponents/FormDebugViewer';\n\nexport interface FormProps {\n /** form children */\n children: ReactNode | ReactNode[];\n /** CSS class name */\n className?: string | string[];\n /** disable form debug completely */\n disableDebug?: boolean;\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?: 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';\n}\n\n/**\n * Form component that has to wrap every uniform\n */\nconst Form = ({\n children,\n className = undefined,\n disableDebug = false,\n initialValues = undefined,\n name = undefined,\n onSubmit,\n testId = undefined,\n validation = undefined,\n validationTrigger = 'all',\n}: FormProps) => {\n return (\n <FormProvider\n initialValues={initialValues}\n onSubmit={onSubmit}\n validation={validation}\n validationTrigger={validationTrigger}\n >\n {({ handleSubmit }) => (\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={handleSubmit}\n >\n {children}\n </form>\n {!disableDebug && <FormDebugViewer className=\"w-96 flex-shrink\" />}\n </div>\n )}\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, FaBullseye } from 'react-icons/fa6';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button, Card, Json } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../../hooks';\n\ninterface FormDebugViewerProps {\n /** CSS class name */\n className?: string;\n}\n\n/** Renders a form debug panel with information about the current form state */\nconst FormDebugViewer = ({ className = undefined }: FormDebugViewerProps) => {\n const {\n debugMode,\n formState: { dirtyFields, isValid, isSubmitting },\n setDebugMode,\n validation,\n watch,\n } = useFormContext();\n\n const [validationErrors, setValidationErrors] = useState<\n VetoError['errors'] | null\n >(null);\n\n const formValues = watch();\n const debugTestIdsEnabled = debugMode === 'debug-testids';\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 (!debugMode || debugMode === 'off') {\n return (\n <Button\n ariaLabel=\"Enable form debug mode\"\n onClick={() => setDebugMode('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={() => setDebugMode('off')}\n size=\"sm\"\n variant=\"flat\"\n />\n </div>\n }\n >\n <Button\n variant={debugTestIdsEnabled ? 'solid' : 'light'}\n icon={<FaBullseye />}\n className=\"mb-4 ml-auto mr-auto\"\n onClick={() =>\n setDebugMode(debugMode === 'debug' ? 'debug-testids' : 'debug')\n }\n >\n {debugTestIdsEnabled ? 'Hide CopyButton' : 'Show CopyButton'}\n </Button>\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":["cn","jsx","jsxs","cn","Form_default"]}
|
|
@@ -3,22 +3,15 @@ var _fa6 = require('react-icons/fa6');
|
|
|
3
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
|
-
var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
|
|
7
|
-
var LOCALSTORAGE_COPY_TEST_ID_KEY = "uniform:form-debug-copy-test-id-enabled";
|
|
8
6
|
var FieldCopyTestIdButton = ({
|
|
9
7
|
className = void 0,
|
|
10
8
|
testId
|
|
11
9
|
}) => {
|
|
12
|
-
const [debug] = _pixels.useLocalStorage.call(void 0, LOCALSTORAGE_DEBUG_KEY, false);
|
|
13
|
-
const [copyTestId] = _pixels.useLocalStorage.call(void 0, LOCALSTORAGE_COPY_TEST_ID_KEY, false);
|
|
14
10
|
const copyToClipboard = () => {
|
|
15
11
|
navigator.clipboard.writeText(testId).catch((err) => {
|
|
16
12
|
console.error("Error copying TestId to clipboard", err);
|
|
17
13
|
});
|
|
18
14
|
};
|
|
19
|
-
if (!debug || !copyTestId) {
|
|
20
|
-
return null;
|
|
21
|
-
}
|
|
22
15
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
23
16
|
_pixels.Button,
|
|
24
17
|
{
|
|
@@ -39,4 +32,4 @@ var FieldCopyTestIdButton_default2 = FieldCopyTestIdButton_default;
|
|
|
39
32
|
|
|
40
33
|
|
|
41
34
|
exports.FieldCopyTestIdButton_default = FieldCopyTestIdButton_default; exports.FieldCopyTestIdButton_default2 = FieldCopyTestIdButton_default2;
|
|
42
|
-
//# sourceMappingURL=chunk-
|
|
35
|
+
//# sourceMappingURL=chunk-JU5RT22Y.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-JU5RT22Y.cjs","../src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx","../src/partials/FieldCopyTestIdButton/index.ts"],"names":["FieldCopyTestIdButton_default"],"mappings":"AAAA;ACAA,sCAA2B;AAE3B,oDAAmB;AACnB,2CAAuB;AAsBX,+CAAA;AAfZ,IAAM,sBAAA,EAAwB,CAAC;AAAA,EAC7B,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ;AACF,CAAA,EAAA,GAAkC;AAChC,EAAA,MAAM,gBAAA,EAAkB,CAAA,EAAA,GAAM;AAC5B,IAAA,SAAA,CAAU,SAAA,CAAU,SAAA,CAAU,MAAM,CAAA,CAAE,KAAA,CAAM,CAAC,GAAA,EAAA,GAAQ;AACnD,MAAA,OAAA,CAAQ,KAAA,CAAM,mCAAA,EAAqC,GAAG,CAAA;AAAA,IACxD,CAAC,CAAA;AAAA,EACH,CAAA;AAEA,EAAA,uBACE,6BAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,4BAAA,SAAG,EAAW,qBAAqB,CAAA;AAAA,MAC9C,OAAA,EAAQ,OAAA;AAAA,MACR,OAAA,EAAS,eAAA;AAAA,MACT,IAAA,kBAAM,6BAAA,eAAC,EAAA,CAAA,CAAW,CAAA;AAAA,MAClB,IAAA,EAAK;AAAA,IAAA;AAAA,EACP,CAAA;AAEJ,CAAA;AACA,IAAO,8BAAA,EAAQ,qBAAA;ADJf;AACA;AErBA,IAAOA,+BAAAA,EAAQ,6BAAA;AFuBf;AACA;AACE;AACA;AACF,+IAAC","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-JU5RT22Y.cjs","sourcesContent":[null,"import { FaBullseye } from 'react-icons/fa6';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nexport interface FieldCopyTestIdButtonProps {\n className?: string;\n testId: string;\n}\n\nconst FieldCopyTestIdButton = ({\n className = undefined,\n testId,\n}: FieldCopyTestIdButtonProps) => {\n const copyToClipboard = () => {\n navigator.clipboard.writeText(testId).catch((err) => {\n console.error('Error copying TestId to clipboard', err);\n });\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"]}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunkJU5RT22Ycjs = require('./chunk-JU5RT22Y.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
var _chunkOHJYXA6Rcjs = require('./chunk-OHJYXA6R.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkS4GIEBIDcjs = require('./chunk-S4GIEBID.cjs');
|
|
10
10
|
|
|
11
11
|
|
|
12
12
|
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
@@ -124,8 +124,10 @@ var RadioGroup = ({
|
|
|
124
124
|
testId: _testId = void 0,
|
|
125
125
|
variant = "default"
|
|
126
126
|
}) => {
|
|
127
|
-
const { control, getFieldState, getValues } =
|
|
127
|
+
const { control, debugMode, getFieldState, getValues } = _chunkS4GIEBIDcjs.useFormContext.call(void 0, );
|
|
128
128
|
const { error, invalid, required, testId } = getFieldState(name, _testId);
|
|
129
|
+
const showTestIdCopyButton = debugMode === "debug-testids";
|
|
130
|
+
const showLabel = label || showTestIdCopyButton;
|
|
129
131
|
const variants = radioGroupVariants();
|
|
130
132
|
const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
|
|
131
133
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
@@ -208,10 +210,10 @@ var RadioGroup = ({
|
|
|
208
210
|
isDisabled,
|
|
209
211
|
isInvalid: invalid,
|
|
210
212
|
isRequired: required,
|
|
211
|
-
label:
|
|
213
|
+
label: showLabel && // eslint-disable-next-line jsx-a11y/label-has-associated-control
|
|
212
214
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "label", { children: [
|
|
213
215
|
label,
|
|
214
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
216
|
+
showTestIdCopyButton && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJU5RT22Ycjs.FieldCopyTestIdButton_default, { testId })
|
|
215
217
|
] }),
|
|
216
218
|
name,
|
|
217
219
|
orientation: inline ? "horizontal" : "vertical",
|
|
@@ -234,4 +236,4 @@ var RadioGroup_default2 = RadioGroup_default;
|
|
|
234
236
|
|
|
235
237
|
|
|
236
238
|
exports.RadioGroup_default = RadioGroup_default; exports.RadioGroup_default2 = RadioGroup_default2;
|
|
237
|
-
//# sourceMappingURL=chunk-
|
|
239
|
+
//# sourceMappingURL=chunk-K6PIOPQN.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-K6PIOPQN.cjs","../src/RadioGroup/RadioGroup.tsx","../src/RadioGroup/Variants/RadioBox.tsx","../src/RadioGroup/Variants/RadioButton.tsx","../src/RadioGroup/index.ts"],"names":["jsx","cn"],"mappings":"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","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-K6PIOPQN.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { Controller } from 'react-hook-form';\n\nimport { RadioGroup as NextRadioGroup, Radio } from '@nextui-org/radio';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\nimport { ButtonGroup } from '@fuf-stack/pixels';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\nimport { RadioBox } from './Variants/RadioBox';\nimport { RadioButton } from './Variants/RadioButton';\n\nexport const radioGroupVariants = tv({\n slots: {\n base: 'group', // Needs group for group-data condition\n buttonGroup:\n 'rounded-xl group-data-[invalid=true]:border group-data-[invalid=true]:border-danger', // optional if a button group is used\n itemBase: '',\n itemBaseActive: 'bg-opacity-50', // optional if a button group is used\n itemControl: '',\n itemDescription: '',\n itemLabel: 'text-sm',\n itemLabelWrapper: '',\n itemWrapper: '',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof radioGroupVariants>;\ntype ClassName = TVClassName<typeof radioGroupVariants>;\n\nexport interface RadioGroupOption {\n /** Description of the value. Works with variant radioBox. */\n description?: React.ReactNode;\n /** disables the option */\n disabled?: boolean;\n /** option label */\n label?: React.ReactNode;\n /** option icon */\n icon?: ReactNode;\n /** HTML data-testid attribute of the option */\n testId?: string;\n /** option value */\n value: string;\n}\n\nexport interface RadioGroupProps extends VariantProps {\n /** CSS class name */\n className?: ClassName;\n /** Determines if the Buttons are disabled or not. */\n disabled?: boolean;\n /** determines orientation of the Buttons. */\n inline?: boolean;\n /** Label displayed next to the RadioButton. */\n label?: ReactNode;\n /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n name: string;\n /** Radio button configuration. */\n options: RadioGroupOption[];\n /** Id to grab element in internal tests. */\n testId?: string;\n /** How the RadioGroup should look like. */\n variant?: 'default' | 'radioBox' | 'radioButton';\n}\n\n/**\n * RadioGroup component based on [NextUI RadioGroup](https://nextui.org/docs/components/radio-group)\n */\nconst RadioGroup = ({\n className = undefined,\n disabled = false,\n inline = false,\n label = undefined,\n name,\n options,\n testId: _testId = undefined,\n variant = 'default',\n}: RadioGroupProps): ReactElement => {\n const { control, debugMode, getFieldState, getValues } = useFormContext();\n\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label || showTestIdCopyButton;\n\n const variants = radioGroupVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n return (\n <Controller\n control={control}\n disabled={disabled}\n name={name}\n render={({ field: { onChange, disabled: isDisabled, onBlur, ref } }) => {\n let RadioComponents: ReactNode;\n\n const itemClassNames = {\n base: classNames.itemBase,\n control: classNames.itemControl,\n description: classNames.itemDescription,\n label: classNames.itemLabel,\n labelWrapper: classNames.itemLabelWrapper,\n wrapper: classNames.itemWrapper,\n };\n\n switch (variant) {\n case 'radioBox':\n RadioComponents = options.map((option) => (\n <RadioBox\n classNames={itemClassNames}\n data-testid={slugify(\n `${testId}_option_${option.testId || option.value}`,\n )}\n description={option.description}\n icon={option.icon}\n isDisabled={isDisabled || option.disabled}\n key={option.value}\n onChange={onChange}\n value={option.value}\n >\n {option.label ? option.label : option.value}\n </RadioBox>\n ));\n break;\n case 'radioButton':\n RadioComponents = options.map((option) => (\n <RadioButton\n className={cn(classNames.itemBase, {\n [classNames.itemBaseActive]:\n getValues()[name] !== option.value,\n })}\n isDisabled={isDisabled || option.disabled}\n key={option.value}\n testID={slugify(\n `${testId}_option_${option.testId || option.value}`,\n )}\n onChange={onChange}\n value={option.value}\n // TODO: how to do the classNames properly (make selected option darker with same color)\n >\n {option.label ? option.label : option.value}\n </RadioButton>\n ));\n break;\n default:\n RadioComponents = options.map((option) => (\n <Radio\n classNames={itemClassNames}\n data-testid={slugify(\n `${testId}_option_${option.testId || option.value}`,\n )}\n isDisabled={isDisabled || option.disabled}\n key={option.value}\n onChange={onChange}\n value={option.value}\n >\n {option.label ? option.label : option.value}\n </Radio>\n ));\n }\n\n return (\n <NextRadioGroup\n // className={className}\n classNames={classNames}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n data-required={required}\n data-testid={testId}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n showLabel && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label>\n {label}\n {showTestIdCopyButton && (\n <FieldCopyTestIdButton testId={testId} />\n )}\n </label>\n )\n }\n name={name}\n orientation={inline ? 'horizontal' : 'vertical'}\n onBlur={onBlur}\n onChange={onChange}\n ref={ref}\n >\n {variant === 'radioButton' ? (\n <ButtonGroup className={classNames.buttonGroup}>\n {RadioComponents}\n </ButtonGroup>\n ) : (\n RadioComponents\n )}\n </NextRadioGroup>\n );\n }}\n />\n );\n};\n\nexport default RadioGroup;\n","import type { RadioProps as NextRadioProps } from '@nextui-org/radio';\nimport type { ReactNode } from 'react';\n\nimport { useRadio } from '@nextui-org/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\ninterface RadioProps extends NextRadioProps {\n /** icon for the option */\n icon?: ReactNode;\n}\n\nexport const RadioBox = ({ icon = undefined, ...props }: RadioProps) => {\n const {\n children,\n Component,\n description,\n getBaseProps,\n getControlProps,\n getInputProps,\n getLabelProps,\n getLabelWrapperProps,\n getWrapperProps,\n isDisabled,\n } = useRadio(props);\n\n return (\n <Component\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...getBaseProps()}\n className={cn(\n 'group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus',\n {\n // disabled styles\n 'pointer-events-none opacity-disabled': isDisabled,\n },\n )}\n >\n <VisuallyHidden>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <input {...getInputProps()} />\n </VisuallyHidden>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <span {...getWrapperProps()}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <span {...getControlProps()} />\n </span>\n {icon}\n <div\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...getLabelWrapperProps()}\n className={cn(getLabelWrapperProps().className, 'grow')}\n >\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n {children && <span {...getLabelProps()}>{children}</span>}\n {description && (\n <span className=\"text-small text-foreground opacity-70\">\n {description}\n </span>\n )}\n </div>\n </Component>\n );\n};\n\nexport default RadioBox;\n","import { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\ninterface RadioButtonProps {\n /** label of the value. */\n children: React.ReactNode;\n /** CSS class name */\n className?: string;\n /** disables the option */\n isDisabled?: boolean;\n /** HTML data-testid attribute of the option */\n testID?: string;\n /** Callback function. Executed if the option is clicked. */\n onChange: (...event: unknown[]) => void;\n /** value of the option. */\n value: string;\n}\n\nexport const RadioButton = ({\n children,\n className = undefined,\n isDisabled = false,\n onChange,\n testID = undefined,\n value,\n}: RadioButtonProps) => {\n return (\n <Button\n className={cn(className)}\n testId={testID}\n disabled={isDisabled}\n key={`index_${value}`}\n onClick={() => {\n return onChange(value);\n }}\n >\n {children}\n </Button>\n );\n};\n\nexport default RadioButton;\n","import RadioGroup from './RadioGroup';\n\nexport type { RadioGroupProps } from './RadioGroup';\n\nexport { RadioGroup };\n\nexport default RadioGroup;\n"]}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
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
|
-
var
|
|
3
|
+
var _chunkJU5RT22Ycjs = require('./chunk-JU5RT22Y.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
var _chunkOHJYXA6Rcjs = require('./chunk-OHJYXA6R.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkS4GIEBIDcjs = require('./chunk-S4GIEBID.cjs');
|
|
10
10
|
|
|
11
11
|
|
|
12
12
|
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
@@ -41,8 +41,10 @@ var CheckboxGroup = ({
|
|
|
41
41
|
name,
|
|
42
42
|
testId: _testId = void 0
|
|
43
43
|
}) => {
|
|
44
|
-
const {
|
|
44
|
+
const { control, debugMode, getFieldState } = _chunkS4GIEBIDcjs.useFormContext.call(void 0, );
|
|
45
45
|
const { error, invalid, required, testId } = getFieldState(name, _testId);
|
|
46
|
+
const showTestIdCopyButton = debugMode === "debug-testids";
|
|
47
|
+
const showLabel = label || showTestIdCopyButton;
|
|
46
48
|
const variants = checkboxGroupVariants();
|
|
47
49
|
const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
|
|
48
50
|
const itemClassName = {
|
|
@@ -80,10 +82,10 @@ var CheckboxGroup = ({
|
|
|
80
82
|
isDisabled: disabled,
|
|
81
83
|
isInvalid: invalid,
|
|
82
84
|
isRequired: required,
|
|
83
|
-
label:
|
|
85
|
+
label: showLabel && // eslint-disable-next-line jsx-a11y/label-has-associated-control
|
|
84
86
|
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "label", { children: [
|
|
85
87
|
label,
|
|
86
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
88
|
+
showTestIdCopyButton && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJU5RT22Ycjs.FieldCopyTestIdButton_default, { testId })
|
|
87
89
|
] }),
|
|
88
90
|
...options.length === 1 ? {
|
|
89
91
|
value: [value].filter((v) => v !== void 0),
|
|
@@ -125,4 +127,4 @@ var CheckboxGroup_default2 = CheckboxGroup_default;
|
|
|
125
127
|
|
|
126
128
|
|
|
127
129
|
exports.CheckboxGroup_default = CheckboxGroup_default; exports.CheckboxGroup_default2 = CheckboxGroup_default2;
|
|
128
|
-
//# sourceMappingURL=chunk-
|
|
130
|
+
//# sourceMappingURL=chunk-KVJNGHAP.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-KVJNGHAP.cjs","../src/CheckboxGroup/CheckboxGroup.tsx","../src/CheckboxGroup/index.ts"],"names":["CheckboxGroup_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACXA,gDAA2B;AAE3B;AACE;AACA;AAAiB,gDACZ;AAEP,oDAAyC;AAkGzB,+CAAA;AA3FT,IAAM,sBAAA,EAAwB,4BAAA;AAAG,EACtC,KAAA,EAAO;AAAA,IACL,IAAA,EAAM,OAAA;AAAA;AAAA,IACN,YAAA,EAAc,WAAA;AAAA,IACd,QAAA,EAAU,EAAA;AAAA,IACV,QAAA,EAAU,EAAA;AAAA,IACV,SAAA,EAAW,SAAA;AAAA,IACX,WAAA,EAAa,EAAA;AAAA;AAAA,IAEb,KAAA,EACE,qFAAA;AAAA,IACF,OAAA,EAAS;AAAA,EACX;AACF,CAAC,CAAA;AAkCD,IAAM,cAAA,EAAgB,CAAC;AAAA,EACrB,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,MAAA,EAAQ,KAAA,CAAA;AAAA,EACR,OAAA;AAAA,EACA,SAAA,EAAW,KAAA;AAAA,EACX,IAAA;AAAA,EACA,MAAA,EAAQ,QAAA,EAAU,KAAA;AACpB,CAAA,EAAA,GAA0B;AACxB,EAAA,MAAM,EAAE,OAAA,EAAS,SAAA,EAAW,cAAc,EAAA,EAAI,8CAAA,CAAe;AAC7D,EAAA,MAAM,EAAE,KAAA,EAAO,OAAA,EAAS,QAAA,EAAU,OAAO,EAAA,EAAI,aAAA,CAAc,IAAA,EAAM,OAAO,CAAA;AAExE,EAAA,MAAM,qBAAA,EAAuB,UAAA,IAAc,eAAA;AAC3C,EAAA,MAAM,UAAA,EAAY,MAAA,GAAS,oBAAA;AAE3B,EAAA,MAAM,SAAA,EAAW,qBAAA,CAAsB,CAAA;AACvC,EAAA,MAAM,WAAA,EAAa,8CAAA,QAAqB,EAAU,SAAA,EAAW,MAAM,CAAA;AAEnE,EAAA,MAAM,cAAA,EAAgB;AAAA,IACpB,IAAA,EAAM,UAAA,CAAW,QAAA;AAAA,IACjB,OAAA,EAAS,UAAA,CAAW,WAAA;AAAA,IACpB,IAAA,EAAM,UAAA,CAAW,QAAA;AAAA,IACjB,KAAA,EAAO,UAAA,CAAW;AAAA,EACpB,CAAA;AACA,EAAA,MAAM,mBAAA,EAAqB;AAAA,IACzB,IAAA,EAAM,UAAA,CAAW,IAAA;AAAA,IACjB,OAAA,EAAS,UAAA,CAAW,OAAA;AAAA,IACpB,KAAA,EAAO,UAAA,CAAW;AAAA,EACpB,CAAA;AAEA,EAAA,uBACE,6BAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA;AAAA,MACA,MAAA,EAAQ,CAAC,EAAE,KAAA,EAAO,EAAE,QAAA,EAAU,KAAA,EAAO,GAAA,EAAK,OAAO,EAAE,CAAA,EAAA,GAAM;AACvD,QAAA,uBACE,6BAAA;AAAA,UAAC,uBAAA;AAAA,UAAA;AAAA,YACC,IAAA;AAAA,YACA,UAAA,EAAY,kBAAA;AAAA,YACZ,aAAA,EAAa,MAAA;AAAA,YAEb,cAAA,EAAc,OAAA;AAAA,YACd,YAAA,EACE,MAAA,mBACE,6BAAA;AAAA,cAAC,8CAAA;AAAA,cAAA;AAAA,gBACC,KAAA;AAAA,gBACA,SAAA,EAAW,UAAA,CAAW;AAAA,cAAA;AAAA,YACxB,CAAA;AAAA,YAGJ,UAAA,EAAY,QAAA;AAAA,YACZ,SAAA,EAAW,OAAA;AAAA,YACX,UAAA,EAAY,QAAA;AAAA,YACZ,KAAA,EACE,UAAA;AAAA,4BAEE,8BAAA,OAAC,EAAA,EACE,QAAA,EAAA;AAAA,cAAA,KAAA;AAAA,cACA,qBAAA,mBACC,6BAAA,+CAAC,EAAA,EAAsB,OAAA,CAAgB;AAAA,YAAA,EAAA,CAE3C,CAAA;AAAA,YAIH,GAAI,OAAA,CAAQ,OAAA,IAAW,EAAA,EACpB;AAAA,cACE,KAAA,EAAO,CAAC,KAAK,CAAA,CAAE,MAAA,CAAO,CAAC,CAAA,EAAA,GAAM,EAAA,IAAM,KAAA,CAAS,CAAA;AAAA,cAC5C,QAAA,EAAU,CAAC,QAAA,EAAA,GAAa,QAAA,CAAS,SAAA,GAAY,QAAA,CAAS,CAAC,CAAC;AAAA,YAC1D,EAAA,EACA;AAAA,cACE,QAAA;AAAA,cACA;AAAA,YACF,CAAA;AAAA,YACJ,MAAA;AAAA,YACA,GAAA;AAAA,YAEC,QAAA,kBAAA,OAAA,2BAAS,GAAA,mBAAI,CAAC,MAAA,EAAA,GAAW;AACxB,cAAA,uBACE,6BAAA;AAAA,gBAAC,kBAAA;AAAA,gBAAA;AAAA,kBACC,cAAA,EAAc,OAAA;AAAA,kBACd,UAAA,EAAY,aAAA;AAAA,kBAEZ,UAAA,EAAY,SAAA,GAAY,MAAA,CAAO,QAAA;AAAA,kBAC/B,KAAA,kBAAO,MAAA,6BAAQ,OAAA;AAAA,kBACf,aAAA,EAAa,uCAAA;AAAA,oBACX,CAAA,EAAA;AACF,kBAAA;AAEC,kBAAA;AAAQ,gBAAA;AAPJ,gBAAA;AAQP,cAAA;AAEH,YAAA;AAAA,UAAA;AACH,QAAA;AAEJ,MAAA;AAAA,IAAA;AACF,EAAA;AAEJ;AAEO;AD1Cc;AACA;AEpHdA;AFsHc;AACA;AACA;AACA;AACA","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-KVJNGHAP.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from 'react-hook-form';\n\nimport {\n Checkbox,\n CheckboxGroup as NextCheckboxGroup,\n} from '@nextui-org/checkbox';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const checkboxGroupVariants = tv({\n slots: {\n base: 'group', // Needs group for group-data condition\n errorMessage: 'text-tiny',\n itemBase: '',\n itemIcon: '',\n itemLabel: 'text-sm',\n itemWrapper: '',\n // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n label:\n 'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger',\n wrapper: '',\n },\n});\n\ntype VariantProps = TVProps<typeof checkboxGroupVariants>;\ntype ClassName = TVClassName<typeof checkboxGroupVariants>;\n\nexport type CheckboxGroupOption = {\n /** option label */\n label?: React.ReactNode;\n /** option value */\n value: string;\n /** disables the option */\n disabled?: boolean;\n /** HTML data-testid attribute of the option */\n testId?: string;\n};\n\nexport interface CheckboxGroupProps extends VariantProps {\n /** CSS class name. ClassName: string | { buttons?: string | { base?: string; active?: string }; base?: string;} */\n className?: ClassName;\n /** label displayed above the Checkboxes */\n label?: React.ReactNode;\n /** Name the Field is registered on the form. */\n name: string;\n /** Checkboxes that should be displayed. */\n options: CheckboxGroupOption[];\n /** sets all buttons disabled */\n disabled?: boolean;\n /** id for internal testing. */\n testId?: string;\n}\n\n/**\n * CheckboxGroup component based on [NextUI CheckboxGroup](https://nextui.org/docs/components/checkbox-group)\n */\nconst CheckboxGroup = ({\n className = undefined,\n label = undefined,\n options,\n disabled = false,\n name,\n testId: _testId = undefined,\n}: CheckboxGroupProps) => {\n const { control, debugMode, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const showTestIdCopyButton = debugMode === 'debug-testids';\n const showLabel = label || showTestIdCopyButton;\n\n const variants = checkboxGroupVariants();\n const classNames = variantsToClassNames(variants, className, 'base');\n\n const itemClassName = {\n base: classNames.itemBase,\n wrapper: classNames.itemWrapper,\n icon: classNames.itemIcon,\n label: classNames.itemLabel,\n };\n const itemGroupClassName = {\n base: classNames.base,\n wrapper: classNames.wrapper,\n label: classNames.label,\n };\n\n return (\n <Controller\n control={control}\n name={name}\n disabled={disabled}\n render={({ field: { onChange, value, ref, onBlur } }) => {\n return (\n <NextCheckboxGroup\n name={name}\n classNames={itemGroupClassName}\n data-testid={testId}\n // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n data-invalid={invalid}\n errorMessage={\n error && (\n <FieldValidationError\n error={error}\n className={classNames.errorMessage}\n />\n )\n }\n isDisabled={disabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n showLabel && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label>\n {label}\n {showTestIdCopyButton && (\n <FieldCopyTestIdButton testId={testId} />\n )}\n </label>\n )\n }\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...(options.length === 1\n ? {\n value: [value].filter((v) => v !== undefined),\n onChange: (newValue) => onChange(newValue && newValue[0]),\n }\n : {\n onChange,\n value,\n })}\n onBlur={onBlur}\n ref={ref}\n >\n {options?.map((option) => {\n return (\n <Checkbox\n data-invalid={invalid}\n classNames={itemClassName}\n key={`index_${option.value}`}\n isDisabled={disabled || option.disabled}\n value={option?.value}\n data-testid={slugify(\n `${testId}_option_${option?.testId || option?.value}`,\n )}\n >\n {option?.label}\n </Checkbox>\n );\n })}\n </NextCheckboxGroup>\n );\n }}\n />\n );\n};\n\nexport default CheckboxGroup;\n","import CheckboxGroup from './CheckboxGroup';\n\nexport type { CheckboxGroupProps, CheckboxGroupOption } from './CheckboxGroup';\n\nexport { CheckboxGroup };\n\nexport default CheckboxGroup;\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
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
|
-
var
|
|
4
|
+
var _chunkS4GIEBIDcjs = require('./chunk-S4GIEBID.cjs');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
@@ -16,21 +16,17 @@ var _fa6 = require('react-icons/fa6');
|
|
|
16
16
|
|
|
17
17
|
var _pixels = require('@fuf-stack/pixels');
|
|
18
18
|
var _jsxruntime = require('react/jsx-runtime');
|
|
19
|
-
var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
|
|
20
|
-
var LOCALSTORAGE_COPY_TEST_ID_KEY = "uniform:form-debug-copy-test-id-enabled";
|
|
21
19
|
var FormDebugViewer = ({ className = void 0 }) => {
|
|
22
20
|
const {
|
|
23
|
-
|
|
21
|
+
debugMode,
|
|
24
22
|
formState: { dirtyFields, isValid, isSubmitting },
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
LOCALSTORAGE_COPY_TEST_ID_KEY,
|
|
30
|
-
false
|
|
31
|
-
);
|
|
23
|
+
setDebugMode,
|
|
24
|
+
validation,
|
|
25
|
+
watch
|
|
26
|
+
} = _chunkS4GIEBIDcjs.useFormContext.call(void 0, );
|
|
32
27
|
const [validationErrors, setValidationErrors] = _react.useState.call(void 0, null);
|
|
33
28
|
const formValues = watch();
|
|
29
|
+
const debugTestIdsEnabled = debugMode === "debug-testids";
|
|
34
30
|
_react.useEffect.call(void 0,
|
|
35
31
|
() => {
|
|
36
32
|
const updateValidationErrors = async () => {
|
|
@@ -44,12 +40,12 @@ var FormDebugViewer = ({ className = void 0 }) => {
|
|
|
44
40
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
45
41
|
[JSON.stringify(formValues)]
|
|
46
42
|
);
|
|
47
|
-
if (!
|
|
43
|
+
if (!debugMode || debugMode === "off") {
|
|
48
44
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
49
45
|
_pixels.Button,
|
|
50
46
|
{
|
|
51
47
|
ariaLabel: "Enable form debug mode",
|
|
52
|
-
onClick: () =>
|
|
48
|
+
onClick: () => setDebugMode("debug"),
|
|
53
49
|
className: "absolute bottom-2.5 right-2.5 w-5 text-default-400",
|
|
54
50
|
variant: "light",
|
|
55
51
|
icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa6.FaBug, {})
|
|
@@ -66,7 +62,7 @@ var FormDebugViewer = ({ className = void 0 }) => {
|
|
|
66
62
|
_pixels.Button,
|
|
67
63
|
{
|
|
68
64
|
icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa.FaTimes, { className: "text-danger" }),
|
|
69
|
-
onClick: () =>
|
|
65
|
+
onClick: () => setDebugMode("off"),
|
|
70
66
|
size: "sm",
|
|
71
67
|
variant: "flat"
|
|
72
68
|
}
|
|
@@ -76,11 +72,11 @@ var FormDebugViewer = ({ className = void 0 }) => {
|
|
|
76
72
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
77
73
|
_pixels.Button,
|
|
78
74
|
{
|
|
79
|
-
variant:
|
|
75
|
+
variant: debugTestIdsEnabled ? "solid" : "light",
|
|
80
76
|
icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _fa6.FaBullseye, {}),
|
|
81
77
|
className: "mb-4 ml-auto mr-auto",
|
|
82
|
-
onClick: () =>
|
|
83
|
-
children:
|
|
78
|
+
onClick: () => setDebugMode(debugMode === "debug" ? "debug-testids" : "debug"),
|
|
79
|
+
children: debugTestIdsEnabled ? "Hide CopyButton" : "Show CopyButton"
|
|
84
80
|
}
|
|
85
81
|
),
|
|
86
82
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
@@ -106,6 +102,7 @@ var FormDebugViewer_default = FormDebugViewer;
|
|
|
106
102
|
var Form = ({
|
|
107
103
|
children,
|
|
108
104
|
className = void 0,
|
|
105
|
+
disableDebug = false,
|
|
109
106
|
initialValues = void 0,
|
|
110
107
|
name = void 0,
|
|
111
108
|
onSubmit,
|
|
@@ -114,7 +111,7 @@ var Form = ({
|
|
|
114
111
|
validationTrigger = "all"
|
|
115
112
|
}) => {
|
|
116
113
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
117
|
-
|
|
114
|
+
_chunkS4GIEBIDcjs.FormContext_default,
|
|
118
115
|
{
|
|
119
116
|
initialValues,
|
|
120
117
|
onSubmit,
|
|
@@ -131,7 +128,7 @@ var Form = ({
|
|
|
131
128
|
children
|
|
132
129
|
}
|
|
133
130
|
),
|
|
134
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, FormDebugViewer_default, { className: "w-96 flex-shrink" })
|
|
131
|
+
!disableDebug && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FormDebugViewer_default, { className: "w-96 flex-shrink" })
|
|
135
132
|
] })
|
|
136
133
|
}
|
|
137
134
|
);
|
|
@@ -145,4 +142,4 @@ var Form_default2 = Form_default;
|
|
|
145
142
|
|
|
146
143
|
|
|
147
144
|
exports.Form_default = Form_default; exports.Form_default2 = Form_default2;
|
|
148
|
-
//# sourceMappingURL=chunk-
|
|
145
|
+
//# sourceMappingURL=chunk-LCLUJFBW.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-LCLUJFBW.cjs","../src/Form/Form.tsx","../src/Form/subcomponents/FormDebugViewer.tsx","../src/Form/index.ts"],"names":["jsx","jsxs","cn","Form_default"],"mappings":"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","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-LCLUJFBW.cjs","sourcesContent":[null,"import type { VetoInstance } from '@fuf-stack/veto';\nimport type { ReactNode } from 'react';\nimport type { FieldValues, SubmitHandler } 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\nexport interface FormProps {\n /** form children */\n children: ReactNode | ReactNode[];\n /** CSS class name */\n className?: string | string[];\n /** disable form debug completely */\n disableDebug?: boolean;\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?: 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';\n}\n\n/**\n * Form component that has to wrap every uniform\n */\nconst Form = ({\n children,\n className = undefined,\n disableDebug = false,\n initialValues = undefined,\n name = undefined,\n onSubmit,\n testId = undefined,\n validation = undefined,\n validationTrigger = 'all',\n}: FormProps) => {\n return (\n <FormProvider\n initialValues={initialValues}\n onSubmit={onSubmit}\n validation={validation}\n validationTrigger={validationTrigger}\n >\n {({ handleSubmit }) => (\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={handleSubmit}\n >\n {children}\n </form>\n {!disableDebug && <FormDebugViewer className=\"w-96 flex-shrink\" />}\n </div>\n )}\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, FaBullseye } from 'react-icons/fa6';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button, Card, Json } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../../hooks';\n\ninterface FormDebugViewerProps {\n /** CSS class name */\n className?: string;\n}\n\n/** Renders a form debug panel with information about the current form state */\nconst FormDebugViewer = ({ className = undefined }: FormDebugViewerProps) => {\n const {\n debugMode,\n formState: { dirtyFields, isValid, isSubmitting },\n setDebugMode,\n validation,\n watch,\n } = useFormContext();\n\n const [validationErrors, setValidationErrors] = useState<\n VetoError['errors'] | null\n >(null);\n\n const formValues = watch();\n const debugTestIdsEnabled = debugMode === 'debug-testids';\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 (!debugMode || debugMode === 'off') {\n return (\n <Button\n ariaLabel=\"Enable form debug mode\"\n onClick={() => setDebugMode('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={() => setDebugMode('off')}\n size=\"sm\"\n variant=\"flat\"\n />\n </div>\n }\n >\n <Button\n variant={debugTestIdsEnabled ? 'solid' : 'light'}\n icon={<FaBullseye />}\n className=\"mb-4 ml-auto mr-auto\"\n onClick={() =>\n setDebugMode(debugMode === 'debug' ? 'debug-testids' : 'debug')\n }\n >\n {debugTestIdsEnabled ? 'Hide CopyButton' : 'Show CopyButton'}\n </Button>\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"]}
|