@fuf-stack/uniform 0.7.0 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- 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/Form/index.cjs +3 -3
- package/dist/Form/index.js +2 -2
- 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-ZVBX5EKB.cjs → chunk-3ROKDX67.cjs} +6 -6
- package/dist/{chunk-ZVBX5EKB.cjs.map → chunk-3ROKDX67.cjs.map} +1 -1
- package/dist/{chunk-R7XP72I5.js → chunk-5I5DGCXC.js} +5 -5
- package/dist/{chunk-XJ3JTLXZ.cjs → chunk-7HXB2552.cjs} +3 -3
- package/dist/{chunk-XJ3JTLXZ.cjs.map → chunk-7HXB2552.cjs.map} +1 -1
- package/dist/{chunk-QD6IQL6U.js → chunk-7ZIHJMDO.js} +2 -2
- package/dist/{chunk-2BQWUW2F.cjs → chunk-AASC67WZ.cjs} +5 -5
- package/dist/{chunk-2BQWUW2F.cjs.map → chunk-AASC67WZ.cjs.map} +1 -1
- package/dist/{chunk-BCMPSLSG.js → chunk-BNJP47R7.js} +58 -17
- package/dist/chunk-BNJP47R7.js.map +1 -0
- package/dist/{chunk-JFCOC5TW.cjs → chunk-C33YNBBZ.cjs} +23 -41
- package/dist/chunk-C33YNBBZ.cjs.map +1 -0
- package/dist/{chunk-G7FQPNDQ.cjs → chunk-DBJCKVYN.cjs} +5 -5
- package/dist/{chunk-G7FQPNDQ.cjs.map → chunk-DBJCKVYN.cjs.map} +1 -1
- package/dist/{chunk-VXVDNHDV.cjs → chunk-DS4ALUMK.cjs} +5 -5
- package/dist/{chunk-VXVDNHDV.cjs.map → chunk-DS4ALUMK.cjs.map} +1 -1
- package/dist/{chunk-OFKYZAVG.cjs → chunk-DVWR5KIG.cjs} +5 -5
- package/dist/{chunk-OFKYZAVG.cjs.map → chunk-DVWR5KIG.cjs.map} +1 -1
- package/dist/{chunk-MV4JFCOJ.cjs → chunk-EWFS7ZAG.cjs} +5 -5
- package/dist/{chunk-MV4JFCOJ.cjs.map → chunk-EWFS7ZAG.cjs.map} +1 -1
- package/dist/{chunk-Y5JGQJI7.js → chunk-GYD46GIR.js} +5 -5
- package/dist/chunk-J5IMU4UG.cjs +128 -0
- package/dist/chunk-J5IMU4UG.cjs.map +1 -0
- package/dist/{chunk-UDRSTJBU.js → chunk-PHFPS7PC.js} +5 -5
- package/dist/{chunk-EHPYBNHC.js → chunk-QTDKBHZP.js} +5 -5
- package/dist/{chunk-Y4CFVCUN.js → chunk-TFDWXKS6.js} +22 -40
- package/dist/chunk-TFDWXKS6.js.map +1 -0
- package/dist/{chunk-6NDSWWW7.cjs → chunk-UAPCZKBD.cjs} +5 -5
- package/dist/{chunk-6NDSWWW7.cjs.map → chunk-UAPCZKBD.cjs.map} +1 -1
- package/dist/{chunk-LIKSUWSM.js → chunk-UPMPPGVK.js} +5 -5
- package/dist/{chunk-36F7BWKL.js → chunk-XEX4SQAM.js} +5 -5
- package/dist/{chunk-KGHLS6DM.js → chunk-ZCHYXHBI.js} +5 -5
- package/dist/hooks/index.cjs +2 -2
- package/dist/hooks/index.d.cts +10 -9
- package/dist/hooks/index.d.ts +10 -9
- package/dist/hooks/index.js +1 -1
- package/dist/index.cjs +12 -12
- package/dist/index.d.cts +0 -1
- package/dist/index.d.ts +0 -1
- package/dist/index.js +15 -15
- package/package.json +7 -7
- package/dist/chunk-BCMPSLSG.js.map +0 -1
- package/dist/chunk-JFCOC5TW.cjs.map +0 -1
- package/dist/chunk-WQRM7G4C.cjs +0 -87
- package/dist/chunk-WQRM7G4C.cjs.map +0 -1
- package/dist/chunk-Y4CFVCUN.js.map +0 -1
- /package/dist/{chunk-R7XP72I5.js.map → chunk-5I5DGCXC.js.map} +0 -0
- /package/dist/{chunk-QD6IQL6U.js.map → chunk-7ZIHJMDO.js.map} +0 -0
- /package/dist/{chunk-Y5JGQJI7.js.map → chunk-GYD46GIR.js.map} +0 -0
- /package/dist/{chunk-UDRSTJBU.js.map → chunk-PHFPS7PC.js.map} +0 -0
- /package/dist/{chunk-EHPYBNHC.js.map → chunk-QTDKBHZP.js.map} +0 -0
- /package/dist/{chunk-LIKSUWSM.js.map → chunk-UPMPPGVK.js.map} +0 -0
- /package/dist/{chunk-36F7BWKL.js.map → chunk-XEX4SQAM.js.map} +0 -0
- /package/dist/{chunk-KGHLS6DM.js.map → chunk-ZCHYXHBI.js.map} +0 -0
|
@@ -7,26 +7,66 @@ import { useContext } from "react";
|
|
|
7
7
|
import { useFormContext as useHookFormContext } from "react-hook-form";
|
|
8
8
|
|
|
9
9
|
// src/Form/subcomponents/FormContext.tsx
|
|
10
|
-
import React from "react";
|
|
11
|
-
import { FormProvider as HookFormProvider } from "react-hook-form";
|
|
10
|
+
import React, { useMemo, useState } from "react";
|
|
11
|
+
import { FormProvider as HookFormProvider, useForm } from "react-hook-form";
|
|
12
12
|
import { jsx } from "react/jsx-runtime";
|
|
13
|
-
var
|
|
13
|
+
var removeNullishFields = (obj) => {
|
|
14
|
+
return JSON.parse(
|
|
15
|
+
JSON.stringify(obj, (_key, value) => {
|
|
16
|
+
return value === null ? void 0 : value;
|
|
17
|
+
})
|
|
18
|
+
);
|
|
19
|
+
};
|
|
20
|
+
var UniformContext = React.createContext(void 0);
|
|
14
21
|
var FormProvider = ({
|
|
15
22
|
children,
|
|
23
|
+
initialValues = void 0,
|
|
24
|
+
onSubmit,
|
|
16
25
|
validation = void 0,
|
|
17
|
-
|
|
26
|
+
validationTrigger
|
|
18
27
|
}) => {
|
|
19
|
-
|
|
28
|
+
const [canSubmit, setCanSubmit] = useState(true);
|
|
29
|
+
const contextValue = useMemo(
|
|
30
|
+
() => ({ canSubmit, setCanSubmit, validation }),
|
|
31
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
32
|
+
[canSubmit]
|
|
33
|
+
);
|
|
34
|
+
const methods = useForm({
|
|
35
|
+
defaultValues: initialValues,
|
|
36
|
+
// add validation config when validation schema provided
|
|
37
|
+
...validation ? {
|
|
38
|
+
// set rhf mode
|
|
39
|
+
// see: https://react-hook-form.com/docs/useform#mode
|
|
40
|
+
mode: validationTrigger,
|
|
41
|
+
resolver: async (values) => {
|
|
42
|
+
const { data, errors, ...rest } = await validation.validateAsync(
|
|
43
|
+
removeNullishFields(values)
|
|
44
|
+
);
|
|
45
|
+
return { values: data || {}, errors: errors || {}, ...rest };
|
|
46
|
+
}
|
|
47
|
+
} : {}
|
|
48
|
+
});
|
|
49
|
+
const handleSubmit = async (e) => {
|
|
50
|
+
if (!canSubmit) {
|
|
51
|
+
console.warn(
|
|
52
|
+
"[FormProvider] form submit was canceled canSubmit is false..."
|
|
53
|
+
);
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
await methods.handleSubmit(onSubmit)(e);
|
|
57
|
+
};
|
|
58
|
+
return /* @__PURE__ */ jsx(UniformContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(HookFormProvider, { ...methods, children: children({ handleSubmit }) }) });
|
|
20
59
|
};
|
|
21
60
|
var FormContext_default = FormProvider;
|
|
22
61
|
|
|
23
62
|
// src/hooks/useFormContext/useFormContext.ts
|
|
24
63
|
var recursiveSearchInnerType = (schema) => {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
64
|
+
let currentSchema = schema;
|
|
65
|
+
while (currentSchema?._def?.innerType) {
|
|
66
|
+
currentSchema = currentSchema._def.innerType;
|
|
67
|
+
if (currentSchema?._def?.typeName === "ZodOptional") {
|
|
68
|
+
return false;
|
|
28
69
|
}
|
|
29
|
-
return recursiveSearchInnerType(schema?._def?.innerType);
|
|
30
70
|
}
|
|
31
71
|
return true;
|
|
32
72
|
};
|
|
@@ -35,8 +75,9 @@ var recursiveFieldKeySearch = (schema, path) => {
|
|
|
35
75
|
let currentSchema = schema;
|
|
36
76
|
if (schema?._def?.typeName === "ZodOptional") {
|
|
37
77
|
currentSchema = schema.unwrap();
|
|
38
|
-
}
|
|
39
|
-
|
|
78
|
+
}
|
|
79
|
+
if (schema?._def?.typeName === "ZodEffects") {
|
|
80
|
+
return recursiveFieldKeySearch(schema._def.schema, path);
|
|
40
81
|
}
|
|
41
82
|
if (currentSchema?._def?.typeName === "ZodIntersection") {
|
|
42
83
|
return (currentSchema._def.left?.schema ? recursiveFieldKeySearch(currentSchema._def.left.schema, path) : recursiveFieldKeySearch(currentSchema._def.left, path)) || (currentSchema._def.right?.schema ? recursiveFieldKeySearch(currentSchema._def.right.schema, path) : recursiveFieldKeySearch(currentSchema._def.right, path));
|
|
@@ -52,29 +93,29 @@ var recursiveFieldKeySearch = (schema, path) => {
|
|
|
52
93
|
};
|
|
53
94
|
var useFormContext = () => {
|
|
54
95
|
const {
|
|
96
|
+
formState,
|
|
55
97
|
// https://react-hook-form.com/docs/useform/getfieldstate
|
|
56
98
|
// for getFieldState a subscription to formState properties is needed!
|
|
57
|
-
formState,
|
|
58
99
|
getFieldState: getFieldStateOrig,
|
|
59
100
|
...otherMethods
|
|
60
101
|
} = useHookFormContext();
|
|
61
|
-
const
|
|
102
|
+
const uniformContext = useContext(UniformContext);
|
|
62
103
|
const getFieldState = (name, testId) => {
|
|
63
104
|
const fieldPath = typeof name === "string" ? name.replace(/\[\d+\]/g, "").split(".") : name;
|
|
64
|
-
const required = validation && recursiveFieldKeySearch(validation.schema, fieldPath) || false;
|
|
105
|
+
const required = uniformContext?.validation && recursiveFieldKeySearch(uniformContext.validation.schema, fieldPath) || false;
|
|
65
106
|
const { error, ...rest } = getFieldStateOrig(name, formState);
|
|
66
107
|
return {
|
|
67
108
|
...rest,
|
|
68
109
|
error,
|
|
69
|
-
//
|
|
110
|
+
// Ensure correct type for error
|
|
70
111
|
required,
|
|
71
112
|
testId: slugify(testId || name)
|
|
72
113
|
};
|
|
73
114
|
};
|
|
74
115
|
return {
|
|
75
116
|
...otherMethods,
|
|
117
|
+
...uniformContext,
|
|
76
118
|
getFieldState,
|
|
77
|
-
validation,
|
|
78
119
|
formState
|
|
79
120
|
};
|
|
80
121
|
};
|
|
@@ -84,4 +125,4 @@ export {
|
|
|
84
125
|
recursiveFieldKeySearch,
|
|
85
126
|
useFormContext
|
|
86
127
|
};
|
|
87
|
-
//# sourceMappingURL=chunk-
|
|
128
|
+
//# sourceMappingURL=chunk-BNJP47R7.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/hooks/useFormContext/useFormContext.ts","../src/Form/subcomponents/FormContext.tsx"],"sourcesContent":["import type { VetoSchema } from '@fuf-stack/veto';\nimport type { FieldError } from 'react-hook-form';\n\nimport { useContext } from 'react';\nimport { useFormContext as useHookFormContext } from 'react-hook-form';\n\nimport { UniformContext } from '../../Form/subcomponents/FormContext';\nimport { slugify } from '../../helpers';\n\n/** Checks whether the field is an optional type by recursively checking inner types */\nconst recursiveSearchInnerType = (schema: VetoSchema): boolean => {\n let currentSchema = schema;\n\n // Loop through inner types to find the root type\n while (currentSchema?._def?.innerType) {\n currentSchema = currentSchema._def.innerType;\n if (currentSchema?._def?.typeName === 'ZodOptional') {\n // Stop recursion if optional is found\n return false;\n }\n }\n // If no optional was found, assume it's required\n return true;\n};\n\n/** Recursive search to check whether a field is required or optional */\nexport const recursiveFieldKeySearch = (\n schema: VetoSchema,\n path: string[],\n): boolean | null => {\n const [current, ...rest] = path;\n\n let currentSchema = schema;\n\n // Handle ZodOptional schema: unwrap and continue searching\n if (schema?._def?.typeName === 'ZodOptional') {\n // @ts-expect-error not sure here\n currentSchema = schema.unwrap();\n }\n\n // Handle ZodEffects (transformations or validation effects)\n if (schema?._def?.typeName === 'ZodEffects') {\n // Unwrap and continue\n return recursiveFieldKeySearch(schema._def.schema, path);\n }\n\n // Handle ZodIntersection (intersection types)\n if (currentSchema?._def?.typeName === 'ZodIntersection') {\n return (\n (currentSchema._def.left?.schema\n ? recursiveFieldKeySearch(currentSchema._def.left.schema, path)\n : recursiveFieldKeySearch(currentSchema._def.left, path)) ||\n (currentSchema._def.right?.schema\n ? recursiveFieldKeySearch(currentSchema._def.right.schema, path)\n : recursiveFieldKeySearch(currentSchema._def.right, path))\n );\n }\n\n // Get the shape of an object or elements of an array schema\n // @ts-expect-error not sure here\n const shape = currentSchema?.shape ?? currentSchema?.element?.shape;\n\n if (shape && shape[current]) {\n if (rest.length === 0) {\n // At the end of the path, check if the field is optional\n return (\n shape[current]?._def?.typeName !== 'ZodOptional' &&\n recursiveSearchInnerType(shape[current])\n );\n }\n return recursiveFieldKeySearch(shape[current], rest);\n }\n // Return null if field not found\n return null;\n};\n\n/**\n * Custom hook that extends react-hook-form's useFormContext to add validation and state management.\n */\nexport const useFormContext = () => {\n const {\n formState,\n // https://react-hook-form.com/docs/useform/getfieldstate\n // for getFieldState a subscription to formState properties is needed!\n getFieldState: getFieldStateOrig,\n ...otherMethods\n } = useHookFormContext();\n\n const uniformContext = useContext(UniformContext);\n\n /**\n * Updated getFieldState method which returns:\n * - Whether the field is required by checking the validation schema\n * - Existing field state information (errors, etc.)\n */\n const getFieldState = (name: string, testId?: string) => {\n const fieldPath =\n typeof name === 'string' ? name.replace(/\\[\\d+\\]/g, '').split('.') : name;\n\n // Check if the field is required using the validation schema\n const required =\n (uniformContext?.validation &&\n recursiveFieldKeySearch(uniformContext.validation.schema, fieldPath)) ||\n false;\n\n // Get the original field state (errors, etc.) from react-hook-form\n const { error, ...rest } = getFieldStateOrig(name, formState);\n\n return {\n ...rest,\n error: error as FieldError[] | undefined, // Ensure correct type for error\n required,\n testId: slugify(testId || name),\n };\n };\n\n return {\n ...otherMethods,\n ...uniformContext,\n getFieldState,\n formState,\n };\n};\n","import type { VetoInstance } from '@fuf-stack/veto';\nimport type { ReactNode } from 'react';\nimport type { FieldValues, SubmitHandler } from 'react-hook-form';\n\nimport React, { useMemo, useState } from 'react';\nimport { FormProvider as HookFormProvider, useForm } from 'react-hook-form';\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\n/**\n * The `UniformContext` provides the form submission state (`canSubmit`) and the ability to control\n * submission behavior (`setCanSubmit`). Additionally, it may provide an optional `validation` schema\n * (from Veto) for form validation purposes.\n *\n * This context is used by components that need to control or be aware of the form submission state,\n * or that require access to the validation schema for managing validation logic.\n *\n * The context's default value is `undefined` until provided by the `FormProvider` component.\n */\nexport const UniformContext = React.createContext<\n | {\n /** Whether the form can be submitted */\n canSubmit: boolean;\n /** Function to update the form's submission state (enabled/disabled) */\n setCanSubmit: React.Dispatch<React.SetStateAction<boolean>>;\n /** Optional Veto validation schema instance for form validation */\n validation?: VetoInstance;\n }\n | undefined\n>(undefined);\n\n// Define props for the FormProvider component, extending HookForm's props\ninterface FormProviderProps {\n /** children form render function */\n children: (childProps: {\n handleSubmit: (e?: React.BaseSyntheticEvent) => Promise<void>;\n }) => ReactNode;\n /** initial form values */\n initialValues?: FieldValues;\n /** form submit handler */\n onSubmit: SubmitHandler<FieldValues>;\n /** Veto validation schema instance */\n validation?: VetoInstance;\n /** when the validation should be triggered */\n validationTrigger: 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';\n}\n\n/**\n * FormProvider component provides both:\n * 1. The veto validation schema context\n * 2. The form submission control context\n */\nconst FormProvider: React.FC<FormProviderProps> = ({\n children,\n initialValues = undefined,\n onSubmit,\n validation = undefined,\n validationTrigger,\n}) => {\n // Local state to control if form can be submitted\n const [canSubmit, setCanSubmit] = useState(true);\n\n // Memoize the context value to prevent re-renders\n const contextValue = useMemo(\n () => ({ canSubmit, setCanSubmit, validation }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [canSubmit],\n );\n\n // Initialize react hook form\n const methods = useForm({\n defaultValues: initialValues,\n // add validation config when validation schema provided\n ...(validation\n ? {\n // set rhf mode\n // see: https://react-hook-form.com/docs/useform#mode\n mode: validationTrigger,\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 }\n : {}),\n });\n\n // Create submit handler\n const handleSubmit = async (e?: React.BaseSyntheticEvent) => {\n if (!canSubmit) {\n console.warn(\n '[FormProvider] form submit was canceled canSubmit is false...',\n );\n return;\n }\n await methods.handleSubmit(onSubmit)(e);\n };\n\n return (\n <UniformContext.Provider value={contextValue}>\n {/* Spread all hook form props into HookFormProvider */}\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <HookFormProvider {...methods}>\n {children({ handleSubmit })}\n </HookFormProvider>\n </UniformContext.Provider>\n );\n};\n\nexport default FormProvider;\n"],"mappings":"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","names":[]}
|
|
@@ -1,13 +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
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunkJ5IMU4UGcjs = require('./chunk-J5IMU4UG.cjs');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
8
8
|
|
|
9
9
|
// src/Form/Form.tsx
|
|
10
|
-
var _reacthookform = require('react-hook-form');
|
|
11
10
|
var _pixelutils = require('@fuf-stack/pixel-utils');
|
|
12
11
|
|
|
13
12
|
// src/Form/subcomponents/FormDebugViewer.tsx
|
|
@@ -24,7 +23,7 @@ var FormDebugViewer = ({ className = void 0 }) => {
|
|
|
24
23
|
watch,
|
|
25
24
|
formState: { dirtyFields, isValid, isSubmitting },
|
|
26
25
|
validation
|
|
27
|
-
} =
|
|
26
|
+
} = _chunkJ5IMU4UGcjs.useFormContext.call(void 0, );
|
|
28
27
|
const [debug, setDebug] = _pixels.useLocalStorage.call(void 0, LOCALSTORAGE_DEBUG_KEY, false);
|
|
29
28
|
const [copyTestId, setCopyTestId] = _pixels.useLocalStorage.call(void 0,
|
|
30
29
|
LOCALSTORAGE_COPY_TEST_ID_KEY,
|
|
@@ -104,13 +103,6 @@ var FormDebugViewer_default = FormDebugViewer;
|
|
|
104
103
|
|
|
105
104
|
// src/Form/Form.tsx
|
|
106
105
|
|
|
107
|
-
var removeNullishFields = (obj) => {
|
|
108
|
-
return JSON.parse(
|
|
109
|
-
JSON.stringify(obj, (_key, value) => {
|
|
110
|
-
return value === null ? void 0 : value;
|
|
111
|
-
})
|
|
112
|
-
);
|
|
113
|
-
};
|
|
114
106
|
var Form = ({
|
|
115
107
|
children,
|
|
116
108
|
className = void 0,
|
|
@@ -121,38 +113,28 @@ var Form = ({
|
|
|
121
113
|
validation = void 0,
|
|
122
114
|
validationTrigger = "all"
|
|
123
115
|
}) => {
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
116
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
117
|
+
_chunkJ5IMU4UGcjs.FormContext_default,
|
|
118
|
+
{
|
|
119
|
+
initialValues,
|
|
120
|
+
onSubmit,
|
|
121
|
+
validation,
|
|
122
|
+
validationTrigger,
|
|
123
|
+
children: ({ handleSubmit }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full flex-row justify-between gap-6", children: [
|
|
124
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
125
|
+
"form",
|
|
126
|
+
{
|
|
127
|
+
className: _pixelutils.cn.call(void 0, "flex-grow", className),
|
|
128
|
+
"data-testid": _chunkBBB4FEY6cjs.slugify.call(void 0, testId || name || ""),
|
|
129
|
+
name,
|
|
130
|
+
onSubmit: handleSubmit,
|
|
131
|
+
children
|
|
132
|
+
}
|
|
133
|
+
),
|
|
134
|
+
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, FormDebugViewer_default, { className: "w-96 flex-shrink" })
|
|
135
|
+
] })
|
|
138
136
|
}
|
|
139
137
|
);
|
|
140
|
-
return (
|
|
141
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
142
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWQRM7G4Ccjs.FormContext_default, { ...methods, validation, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-full flex-row justify-between gap-6", children: [
|
|
143
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
144
|
-
"form",
|
|
145
|
-
{
|
|
146
|
-
className: _pixelutils.cn.call(void 0, "flex-grow", className),
|
|
147
|
-
"data-testid": _chunkBBB4FEY6cjs.slugify.call(void 0, testId || name || ""),
|
|
148
|
-
name,
|
|
149
|
-
onSubmit: methods.handleSubmit(onSubmit),
|
|
150
|
-
children
|
|
151
|
-
}
|
|
152
|
-
),
|
|
153
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, FormDebugViewer_default, { className: "w-96 flex-shrink" })
|
|
154
|
-
] }) })
|
|
155
|
-
);
|
|
156
138
|
};
|
|
157
139
|
var Form_default = Form;
|
|
158
140
|
|
|
@@ -163,4 +145,4 @@ var Form_default2 = Form_default;
|
|
|
163
145
|
|
|
164
146
|
|
|
165
147
|
exports.Form_default = Form_default; exports.Form_default2 = Form_default2;
|
|
166
|
-
//# sourceMappingURL=chunk-
|
|
148
|
+
//# sourceMappingURL=chunk-C33YNBBZ.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-C33YNBBZ.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-C33YNBBZ.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 /** 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 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 <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, 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';\nconst LOCALSTORAGE_COPY_TEST_ID_KEY = 'uniform:form-debug-copy-test-id-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 const [copyTestId, setCopyTestId] = useLocalStorage(\n LOCALSTORAGE_COPY_TEST_ID_KEY,\n false,\n );\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 <Button\n variant={copyTestId ? 'solid' : 'light'}\n icon={<FaBullseye />}\n className=\"mb-4 ml-auto mr-auto\"\n onClick={() => setCopyTestId(!copyTestId)}\n >\n {copyTestId ? '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"]}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } 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 _chunkKMMS4G7Acjs = require('./chunk-KMMS4G7A.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkJ5IMU4UGcjs = require('./chunk-J5IMU4UG.cjs');
|
|
10
10
|
|
|
11
11
|
// src/Select/Select.tsx
|
|
12
12
|
var _reacthookform = require('react-hook-form');
|
|
@@ -87,7 +87,7 @@ var Select = ({
|
|
|
87
87
|
placeholder = void 0,
|
|
88
88
|
testId: _testId = void 0
|
|
89
89
|
}) => {
|
|
90
|
-
const { control, getFieldState } =
|
|
90
|
+
const { control, getFieldState } = _chunkJ5IMU4UGcjs.useFormContext.call(void 0, );
|
|
91
91
|
const { error, invalid, required, testId } = getFieldState(name, _testId);
|
|
92
92
|
const {
|
|
93
93
|
label,
|
|
@@ -236,4 +236,4 @@ var Select_default2 = Select_default;
|
|
|
236
236
|
|
|
237
237
|
|
|
238
238
|
exports.Select_default = Select_default; exports.Select_default2 = Select_default2;
|
|
239
|
-
//# sourceMappingURL=chunk-
|
|
239
|
+
//# sourceMappingURL=chunk-DBJCKVYN.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-G7FQPNDQ.cjs","../src/Select/Select.tsx","../src/Select/index.ts"],"names":["Select_default"],"mappings":"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","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-G7FQPNDQ.cjs","sourcesContent":[null,"import type { Props } from 'react-select';\n\nimport { Controller } from 'react-hook-form';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@nextui-org/select';\n\nimport { cn, tv } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\ntype SelectOption = {\n /** option label */\n label?: React.ReactNode;\n /** option value */\n value: string;\n};\n\nexport interface SelectProps {\n /** CSS class name */\n className?: string; // string;\n /** Determine if the */\n clearable?: boolean;\n /** Set the select to disabled state. */\n disabled?: boolean;\n\n filterOption?:\n | undefined\n | ((option?: SelectOption, inputValue?: string) => boolean);\n /** The value of the search input */\n inputValue?: string;\n /** Label that should be associated with the select. */\n label?: React.ReactNode;\n /** Set the select to a loading state. */\n loading?: boolean;\n /** switch between single and multi select mode. */\n multiSelect?: boolean;\n /** The name for the Select component, used by react-hook-form */\n name: string;\n /** Placeholder that is displayed when nothing is selected */\n placeholder?: string;\n /** The options for the Select component */\n options: SelectOption[];\n /** Handle change events on the input */\n onInputChange?: Props['onInputChange'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_input`;\n // eslint-disable-next-line react/jsx-props-no-spreading\n return <components.Input data-testid={testId} {...props} />;\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_option_${props?.data?.testId ?? props?.data?.value}`;\n return (\n <div data-testid={testId}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.Option {...props} />\n </div>\n );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n props,\n) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types\n const testId = props?.selectProps['data-testid'] as string;\n return (\n <div data-testid={`${testId}_dropdown`}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.DropdownIndicator {...props} />\n </div>\n );\n};\n\nexport const selectVariants = tv({\n slots: {\n clearIndicator:\n 'rounded-md p-1 text-neutral-500 hover:cursor-pointer hover:bg-gray-200 hover:text-neutral-800 hover:dark:bg-default-200 hover:dark:text-default-500',\n control:\n 'rounded-lg border-2 border-gray-200 shadow-sm !duration-150 transition-background hover:border-gray-400 motion-reduce:transition-none dark:border-default-200 hover:dark:border-default-400 focus:dark:border-default-400',\n crossIcon: '',\n downChevron: '',\n dropdownIndicator:\n 'rounded-md p-1 text-neutral-500 hover:cursor-pointer hover:bg-gray-200 hover:text-black hover:dark:bg-default-200 hover:dark:text-default-500',\n group: '',\n groupHeading: 'mb-1 ml-3 mt-2 text-sm text-neutral-500',\n indicatorsContainer: 'gap-1 p-1',\n indicatorSeparator: 'bg-gray-300 dark:bg-default-300',\n input: 'py-0.5 pl-1',\n loadingIndicator: '',\n loadingMessage: '',\n menu: 'mt-2 rounded-xl border border-gray-200 bg-default-50 p-1 shadow-sm dark:border-gray-900 dark:bg-default-50',\n menuList: '',\n // ensure menu has same z-index as modal so it is visible when rendered in modal\n // see: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n menuPortal: '!z-50',\n multiValue:\n 'items-center gap-1.5 rounded bg-gray-100 py-0.5 pl-2 pr-1 dark:bg-default-100',\n multiValueContainer: '',\n multiValueLabel: 'py-0.5 leading-6',\n multiValueRemove:\n 'rounded text-neutral-500 hover:cursor-pointer hover:border-gray-300 hover:text-neutral-800 hover:dark:bg-default-200 hover:dark:text-default-500',\n noOptionsMessage:\n 'rounded-sm bg-gray-50 p-2 text-neutral-500 dark:bg-default-100',\n option: 'rounded px-3 py-2 hover:cursor-pointer',\n placeholder: 'py-0.5 pl-1 text-neutral-500',\n selectContainer: '',\n singleValue: '!ml-1 !leading-7',\n valueContainer: 'gap-1 p-1',\n },\n variants: {\n invalid: {\n true: {\n control:\n 'border-danger hover:border-danger dark:border-danger hover:dark:border-danger',\n },\n },\n focused: {\n true: {\n option:\n 'bg-gray-100 active:bg-gray-200 dark:bg-default-100 dark:active:bg-default-200',\n },\n },\n optionSelected: {\n true: { option: 'bg-gray-300 dark:bg-default-300' },\n },\n },\n});\n\n/** Select component based on [NextUI Select](https://nextui.org/docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n className = undefined,\n clearable = true,\n disabled = false,\n filterOption = undefined,\n inputValue = undefined,\n label: _label = undefined,\n loading = false,\n multiSelect = false,\n name,\n onInputChange = undefined,\n options,\n placeholder = undefined,\n testId: _testId = undefined,\n}: SelectProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const {\n label,\n getLabelProps,\n getTriggerProps,\n getValueProps,\n getHelperWrapperProps,\n getErrorMessageProps,\n } = useSelect({\n isLoading: loading,\n isInvalid: invalid,\n isRequired: required,\n isDisabled: disabled,\n errorMessage: JSON.stringify(error),\n label: _label,\n labelPlacement: 'outside',\n children: [],\n });\n\n const {\n clearIndicator: clearIndicatorSlot,\n control: controlSlot,\n dropdownIndicator: dropdownIndicatorSlot,\n groupHeading: groupHeadingSlot,\n indicatorsContainer: indicatorContainerSlot,\n indicatorSeparator: indicatorSeparatorSlot,\n input: inputSlot,\n menu: menuSlot,\n menuPortal: menuPortalSlot,\n multiValue: multiValueSlot,\n multiValueLabel: multiValueLabelSlot,\n multiValueRemove: multiValueRemoveSlot,\n noOptionsMessage: noOptionsMessageSlot,\n option: optionSlot,\n placeholder: placeholderSlot,\n singleValue: singleValueSlot,\n valueContainer: valueContainerSlot,\n } = selectVariants({ invalid });\n\n return (\n <Controller\n control={control}\n name={name}\n render={({\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n field: { onChange, value, ref, onBlur },\n }) => (\n <div className={cn(className, 'mt-2')} data-testid={`${testId}_select`}>\n {label && (\n <label\n htmlFor={`react-select-${name}-input`} // {getTriggerProps().id}\n className={`${getLabelProps().className} !pointer-events-auto !static -mb-1 ml-1`}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </label>\n )}\n <ReactSelect\n aria-errormessage=\"\"\n aria-invalid={invalid}\n // Does not affect the testId of the select, but is needed to pass it to sub-components\n data-testid={`${testId}_select`}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/naming-convention\n const { className: _className, ...rest } = getTriggerProps();\n return rest;\n }}\n aria-labelledby={\n getTriggerProps()['aria-labelledby']?.split(' ')[1]\n }\n classNames={{\n control: ({ isFocused }) =>\n // border focus style\n controlSlot({\n className: !invalid && isFocused && '!border-primary',\n }),\n placeholder: () => placeholderSlot(),\n input: () => inputSlot(),\n valueContainer: () => valueContainerSlot(),\n singleValue: () =>\n singleValueSlot({\n className: `${getValueProps().className}`,\n }),\n multiValue: () => multiValueSlot(),\n multiValueLabel: () =>\n multiValueLabelSlot({\n className: `${getValueProps().className}`,\n }),\n multiValueRemove: () => multiValueRemoveSlot(),\n indicatorsContainer: () => indicatorContainerSlot(),\n clearIndicator: () => clearIndicatorSlot(),\n indicatorSeparator: () => indicatorSeparatorSlot(),\n dropdownIndicator: () => dropdownIndicatorSlot(),\n menu: () => menuSlot(),\n groupHeading: () => groupHeadingSlot(),\n option: ({ isFocused, isSelected }) =>\n optionSlot({\n focused: isFocused,\n optionSelected: isSelected,\n }),\n noOptionsMessage: () => noOptionsMessageSlot(),\n menuPortal: () => menuPortalSlot(),\n }}\n components={{\n Input: InputComponent,\n Option: OptionComponent,\n DropdownIndicator: DropdownIndicatorComponent,\n }}\n filterOption={filterOption}\n instanceId={name}\n inputValue={inputValue}\n isClearable={clearable}\n isDisabled={disabled}\n isLoading={loading}\n isMulti={multiSelect}\n options={options}\n placeholder={placeholder}\n unstyled\n onChange={(option) => {\n if (multiSelect) {\n const transformedOptions: string[] = [];\n // @ts-expect-error in this case option is an array.\n option?.forEach((o: { value: string }) => {\n transformedOptions.push(o.value);\n });\n onChange(transformedOptions);\n } else {\n // @ts-expect-error in this case option is of type SelectOption and has the property value.\n onChange(option && option.value);\n }\n }}\n onInputChange={onInputChange}\n // attach menu modal or body so it works in card and modal\n menuPortalTarget={\n (document.getElementById('modal_body')?.parentNode\n ?.parentNode as HTMLElement) || document.body\n }\n value={options.find((option) => option.value === value)}\n onBlur={onBlur}\n name={name}\n ref={ref}\n />\n {error && (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <div {...getHelperWrapperProps()}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <div {...getErrorMessageProps()}>\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"]}
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-DBJCKVYN.cjs","../src/Select/Select.tsx","../src/Select/index.ts"],"names":["Select_default"],"mappings":"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","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-DBJCKVYN.cjs","sourcesContent":[null,"import type { Props } from 'react-select';\n\nimport { Controller } from 'react-hook-form';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@nextui-org/select';\n\nimport { cn, tv } from '@fuf-stack/pixel-utils';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\ntype SelectOption = {\n /** option label */\n label?: React.ReactNode;\n /** option value */\n value: string;\n};\n\nexport interface SelectProps {\n /** CSS class name */\n className?: string; // string;\n /** Determine if the */\n clearable?: boolean;\n /** Set the select to disabled state. */\n disabled?: boolean;\n\n filterOption?:\n | undefined\n | ((option?: SelectOption, inputValue?: string) => boolean);\n /** The value of the search input */\n inputValue?: string;\n /** Label that should be associated with the select. */\n label?: React.ReactNode;\n /** Set the select to a loading state. */\n loading?: boolean;\n /** switch between single and multi select mode. */\n multiSelect?: boolean;\n /** The name for the Select component, used by react-hook-form */\n name: string;\n /** Placeholder that is displayed when nothing is selected */\n placeholder?: string;\n /** The options for the Select component */\n options: SelectOption[];\n /** Handle change events on the input */\n onInputChange?: Props['onInputChange'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_input`;\n // eslint-disable-next-line react/jsx-props-no-spreading\n return <components.Input data-testid={testId} {...props} />;\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n const testId = `${props.selectProps['data-testid']}_option_${props?.data?.testId ?? props?.data?.value}`;\n return (\n <div data-testid={testId}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.Option {...props} />\n </div>\n );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n props,\n) => {\n // @ts-expect-error data-testid is not a default prop\n // eslint-disable-next-line react/prop-types\n const testId = props?.selectProps['data-testid'] as string;\n return (\n <div data-testid={`${testId}_dropdown`}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <components.DropdownIndicator {...props} />\n </div>\n );\n};\n\nexport const selectVariants = tv({\n slots: {\n clearIndicator:\n 'rounded-md p-1 text-neutral-500 hover:cursor-pointer hover:bg-gray-200 hover:text-neutral-800 hover:dark:bg-default-200 hover:dark:text-default-500',\n control:\n 'rounded-lg border-2 border-gray-200 shadow-sm !duration-150 transition-background hover:border-gray-400 motion-reduce:transition-none dark:border-default-200 hover:dark:border-default-400 focus:dark:border-default-400',\n crossIcon: '',\n downChevron: '',\n dropdownIndicator:\n 'rounded-md p-1 text-neutral-500 hover:cursor-pointer hover:bg-gray-200 hover:text-black hover:dark:bg-default-200 hover:dark:text-default-500',\n group: '',\n groupHeading: 'mb-1 ml-3 mt-2 text-sm text-neutral-500',\n indicatorsContainer: 'gap-1 p-1',\n indicatorSeparator: 'bg-gray-300 dark:bg-default-300',\n input: 'py-0.5 pl-1',\n loadingIndicator: '',\n loadingMessage: '',\n menu: 'mt-2 rounded-xl border border-gray-200 bg-default-50 p-1 shadow-sm dark:border-gray-900 dark:bg-default-50',\n menuList: '',\n // ensure menu has same z-index as modal so it is visible when rendered in modal\n // see: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n menuPortal: '!z-50',\n multiValue:\n 'items-center gap-1.5 rounded bg-gray-100 py-0.5 pl-2 pr-1 dark:bg-default-100',\n multiValueContainer: '',\n multiValueLabel: 'py-0.5 leading-6',\n multiValueRemove:\n 'rounded text-neutral-500 hover:cursor-pointer hover:border-gray-300 hover:text-neutral-800 hover:dark:bg-default-200 hover:dark:text-default-500',\n noOptionsMessage:\n 'rounded-sm bg-gray-50 p-2 text-neutral-500 dark:bg-default-100',\n option: 'rounded px-3 py-2 hover:cursor-pointer',\n placeholder: 'py-0.5 pl-1 text-neutral-500',\n selectContainer: '',\n singleValue: '!ml-1 !leading-7',\n valueContainer: 'gap-1 p-1',\n },\n variants: {\n invalid: {\n true: {\n control:\n 'border-danger hover:border-danger dark:border-danger hover:dark:border-danger',\n },\n },\n focused: {\n true: {\n option:\n 'bg-gray-100 active:bg-gray-200 dark:bg-default-100 dark:active:bg-default-200',\n },\n },\n optionSelected: {\n true: { option: 'bg-gray-300 dark:bg-default-300' },\n },\n },\n});\n\n/** Select component based on [NextUI Select](https://nextui.org/docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n className = undefined,\n clearable = true,\n disabled = false,\n filterOption = undefined,\n inputValue = undefined,\n label: _label = undefined,\n loading = false,\n multiSelect = false,\n name,\n onInputChange = undefined,\n options,\n placeholder = undefined,\n testId: _testId = undefined,\n}: SelectProps) => {\n const { control, getFieldState } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n const {\n label,\n getLabelProps,\n getTriggerProps,\n getValueProps,\n getHelperWrapperProps,\n getErrorMessageProps,\n } = useSelect({\n isLoading: loading,\n isInvalid: invalid,\n isRequired: required,\n isDisabled: disabled,\n errorMessage: JSON.stringify(error),\n label: _label,\n labelPlacement: 'outside',\n children: [],\n });\n\n const {\n clearIndicator: clearIndicatorSlot,\n control: controlSlot,\n dropdownIndicator: dropdownIndicatorSlot,\n groupHeading: groupHeadingSlot,\n indicatorsContainer: indicatorContainerSlot,\n indicatorSeparator: indicatorSeparatorSlot,\n input: inputSlot,\n menu: menuSlot,\n menuPortal: menuPortalSlot,\n multiValue: multiValueSlot,\n multiValueLabel: multiValueLabelSlot,\n multiValueRemove: multiValueRemoveSlot,\n noOptionsMessage: noOptionsMessageSlot,\n option: optionSlot,\n placeholder: placeholderSlot,\n singleValue: singleValueSlot,\n valueContainer: valueContainerSlot,\n } = selectVariants({ invalid });\n\n return (\n <Controller\n control={control}\n name={name}\n render={({\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n field: { onChange, value, ref, onBlur },\n }) => (\n <div className={cn(className, 'mt-2')} data-testid={`${testId}_select`}>\n {label && (\n <label\n htmlFor={`react-select-${name}-input`} // {getTriggerProps().id}\n className={`${getLabelProps().className} !pointer-events-auto !static -mb-1 ml-1`}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </label>\n )}\n <ReactSelect\n aria-errormessage=\"\"\n aria-invalid={invalid}\n // Does not affect the testId of the select, but is needed to pass it to sub-components\n data-testid={`${testId}_select`}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...() => {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/naming-convention\n const { className: _className, ...rest } = getTriggerProps();\n return rest;\n }}\n aria-labelledby={\n getTriggerProps()['aria-labelledby']?.split(' ')[1]\n }\n classNames={{\n control: ({ isFocused }) =>\n // border focus style\n controlSlot({\n className: !invalid && isFocused && '!border-primary',\n }),\n placeholder: () => placeholderSlot(),\n input: () => inputSlot(),\n valueContainer: () => valueContainerSlot(),\n singleValue: () =>\n singleValueSlot({\n className: `${getValueProps().className}`,\n }),\n multiValue: () => multiValueSlot(),\n multiValueLabel: () =>\n multiValueLabelSlot({\n className: `${getValueProps().className}`,\n }),\n multiValueRemove: () => multiValueRemoveSlot(),\n indicatorsContainer: () => indicatorContainerSlot(),\n clearIndicator: () => clearIndicatorSlot(),\n indicatorSeparator: () => indicatorSeparatorSlot(),\n dropdownIndicator: () => dropdownIndicatorSlot(),\n menu: () => menuSlot(),\n groupHeading: () => groupHeadingSlot(),\n option: ({ isFocused, isSelected }) =>\n optionSlot({\n focused: isFocused,\n optionSelected: isSelected,\n }),\n noOptionsMessage: () => noOptionsMessageSlot(),\n menuPortal: () => menuPortalSlot(),\n }}\n components={{\n Input: InputComponent,\n Option: OptionComponent,\n DropdownIndicator: DropdownIndicatorComponent,\n }}\n filterOption={filterOption}\n instanceId={name}\n inputValue={inputValue}\n isClearable={clearable}\n isDisabled={disabled}\n isLoading={loading}\n isMulti={multiSelect}\n options={options}\n placeholder={placeholder}\n unstyled\n onChange={(option) => {\n if (multiSelect) {\n const transformedOptions: string[] = [];\n // @ts-expect-error in this case option is an array.\n option?.forEach((o: { value: string }) => {\n transformedOptions.push(o.value);\n });\n onChange(transformedOptions);\n } else {\n // @ts-expect-error in this case option is of type SelectOption and has the property value.\n onChange(option && option.value);\n }\n }}\n onInputChange={onInputChange}\n // attach menu modal or body so it works in card and modal\n menuPortalTarget={\n (document.getElementById('modal_body')?.parentNode\n ?.parentNode as HTMLElement) || document.body\n }\n value={options.find((option) => option.value === value)}\n onBlur={onBlur}\n name={name}\n ref={ref}\n />\n {error && (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <div {...getHelperWrapperProps()}>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <div {...getErrorMessageProps()}>\n <FieldValidationError error={error} />\n </div>\n </div>\n )}\n </div>\n )}\n />\n );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"]}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunkKMMS4G7Acjs = require('./chunk-KMMS4G7A.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkJ5IMU4UGcjs = require('./chunk-J5IMU4UG.cjs');
|
|
10
10
|
|
|
11
11
|
// src/TextArea/TextArea.tsx
|
|
12
12
|
var _reacthookform = require('react-hook-form');
|
|
@@ -22,7 +22,7 @@ var TextArea = ({
|
|
|
22
22
|
placeholder = " ",
|
|
23
23
|
testId: _testId = void 0
|
|
24
24
|
}) => {
|
|
25
|
-
const { control, getFieldState } =
|
|
25
|
+
const { control, getFieldState } = _chunkJ5IMU4UGcjs.useFormContext.call(void 0, );
|
|
26
26
|
const { error, invalid, required, testId } = getFieldState(name, _testId);
|
|
27
27
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
28
28
|
_reacthookform.Controller,
|
|
@@ -73,4 +73,4 @@ var TextArea_default2 = TextArea_default;
|
|
|
73
73
|
|
|
74
74
|
|
|
75
75
|
exports.TextArea_default = TextArea_default; exports.TextArea_default2 = TextArea_default2;
|
|
76
|
-
//# sourceMappingURL=chunk-
|
|
76
|
+
//# sourceMappingURL=chunk-DS4ALUMK.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-DS4ALUMK.cjs","../src/TextArea/TextArea.tsx","../src/TextArea/index.ts"],"names":["TextArea_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACRA,gDAA2B;AAE3B,0CAAyC;AAEzC,oDAAmB;AAqDgB,+CAAA;AA3BnC,IAAM,SAAA,EAAW,CAAC;AAAA,EAChB,SAAA,EAAW,IAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,SAAA,EAAW,KAAA;AAAA,EACX,MAAA,EAAQ,KAAA,CAAA;AAAA,EACR,IAAA;AAAA,EACA,YAAA,EAAc,GAAA;AAAA,EACd,MAAA,EAAQ,QAAA,EAAU,KAAA;AACpB,CAAA,EAAA,GAAqB;AACnB,EAAA,MAAM,EAAE,OAAA,EAAS,cAAc,EAAA,EAAI,8CAAA,CAAe;AAClD,EAAA,MAAM,EAAE,KAAA,EAAO,OAAA,EAAS,QAAA,EAAU,OAAO,EAAA,EAAI,aAAA,CAAc,IAAA,EAAM,OAAO,CAAA;AAExE,EAAA,uBACE,6BAAA;AAAA,IAAC,yBAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA;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,eAAA;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,YAAA,EAAc,MAAA,mBAAS,6BAAA,8CAAC,EAAA,EAAqB,MAAA,CAAc,CAAA;AAAA,YAC3D,UAAA;AAAA,YACA,UAAA,EAAY,QAAA;AAAA,YACZ,SAAA,EAAW,OAAA;AAAA,YACX,KAAA,kBACE,8BAAA,oBAAA,EAAA,EACG,QAAA,EAAA;AAAA,cAAA,KAAA;AAAA,8BACD,6BAAA,+CAAC,EAAA,EAAsB,OAAA,CAAgB;AAAA,YAAA,EAAA,CACzC,CAAA;AAAA,YAEF,cAAA,EAAe,SAAA;AAAA,YACf,WAAA;AAAA,YACA,IAAA;AAAA,YACA,KAAA;AAAA,YACA,QAAA;AAAA,YACA,MAAA;AAAA,YACA,GAAA;AAAA,YACA,OAAA,EAAQ,UAAA;AAAA,YAEP;AAAA,UAAA;AAAA,QACH,CAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACF,CAAA;AAEJ,CAAA;AAEA,IAAO,iBAAA,EAAQ,QAAA;ADnBf;AACA;AE9DA,IAAOA,kBAAAA,EAAQ,gBAAA;AFgEf;AACA;AACE;AACA;AACF,2FAAC","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-DS4ALUMK.cjs","sourcesContent":[null,"import type { ReactNode } from 'react';\n\nimport { Controller } from 'react-hook-form';\n\nimport { Textarea as NextTextArea } 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 TextAreaProps {\n /** Child components. The content of the textarea. */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** Determines if the TextArea is disabled or not. */\n disabled?: boolean;\n /** Label displayed above the TextArea. */\n label?: ReactNode;\n /** Name the TextArea is registered at in HTML forms (react-hook-form). */\n name: string;\n /** placeholder for the textArea content. */\n placeholder?: string;\n /** Id to grab element in internal tests. */\n testId?: string;\n}\n\n/**\n * TextArea component based on [NextUI TextArea](https://nextui.org/docs/components/textarea)\n */\nconst TextArea = ({\n children = null,\n className = undefined,\n disabled = false,\n label = undefined,\n name,\n placeholder = ' ',\n testId: _testId = undefined,\n}: TextAreaProps) => {\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 disabled={disabled}\n render={({\n field: { disabled: isDisabled, onChange, onBlur, value, ref },\n }) => {\n return (\n <NextTextArea\n className={cn(className)}\n classNames={{\n inputWrapper: 'group-data-[focus=true]:border-primary',\n }}\n data-testid={testId}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isRequired={required}\n isInvalid={invalid}\n label={\n <>\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </>\n }\n labelPlacement=\"outside\"\n placeholder={placeholder}\n name={name}\n value={value}\n onChange={onChange}\n onBlur={onBlur}\n ref={ref}\n variant=\"bordered\"\n >\n {children}\n </NextTextArea>\n );\n }}\n />\n );\n};\n\nexport default TextArea;\n","import TextArea from './TextArea';\n\nexport type { TextAreaProps } from './TextArea';\n\nexport { TextArea };\n\nexport default TextArea;\n"]}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunkKMMS4G7Acjs = require('./chunk-KMMS4G7A.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkJ5IMU4UGcjs = require('./chunk-J5IMU4UG.cjs');
|
|
10
10
|
|
|
11
11
|
|
|
12
12
|
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
@@ -103,7 +103,7 @@ var RadioGroup = ({
|
|
|
103
103
|
testId: _testId = void 0,
|
|
104
104
|
variant = "default"
|
|
105
105
|
}) => {
|
|
106
|
-
const { control, getFieldState, getValues } =
|
|
106
|
+
const { control, getFieldState, getValues } = _chunkJ5IMU4UGcjs.useFormContext.call(void 0, );
|
|
107
107
|
const { error, invalid, required, testId } = getFieldState(name, _testId);
|
|
108
108
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
109
109
|
_reacthookform.Controller,
|
|
@@ -202,4 +202,4 @@ var RadioGroup_default2 = RadioGroup_default;
|
|
|
202
202
|
|
|
203
203
|
|
|
204
204
|
exports.RadioGroup_default = RadioGroup_default; exports.RadioGroup_default2 = RadioGroup_default2;
|
|
205
|
-
//# sourceMappingURL=chunk-
|
|
205
|
+
//# sourceMappingURL=chunk-DVWR5KIG.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-OFKYZAVG.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-OFKYZAVG.cjs","sourcesContent":[null,"import type { ReactElement, ReactNode } from 'react';\n\nimport { Controller } from 'react-hook-form';\n\nimport { ButtonGroup as NextButtonGroup } from '@nextui-org/button';\nimport { RadioGroup as NextRadioGroup, Radio } from '@nextui-org/radio';\n\nimport { cn } from '@fuf-stack/pixel-utils';\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 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 {\n /** CSS class name */\n className?: string;\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, getFieldState, getValues } = useFormContext();\n\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={({ field: { onChange, disabled: isDisabled, onBlur, ref } }) => {\n let RadioComponents: ReactNode;\n switch (variant) {\n case 'radioBox':\n RadioComponents = options.map((option) => (\n <RadioBox\n key={option.value}\n data-testid={slugify(\n `${testId}_option_${option.testId || option.value}`,\n )}\n isDisabled={isDisabled || option.disabled}\n value={option.value}\n onChange={onChange}\n description={option.description}\n icon={option.icon}\n >\n {option.label ? option.label : option.value}\n </RadioBox>\n ));\n break;\n case 'radioButton':\n RadioComponents = options.map((option) => (\n <RadioButton\n key={option.value}\n data-testid={slugify(\n `${testId}_option_${option.testId || option.value}`,\n )}\n isDisabled={isDisabled || option.disabled}\n value={option.value}\n onChange={onChange}\n // TODO: how to do the classNames properly (make selected option darker with same color)\n className={cn(\n `${getValues()[name] !== option.value ? 'bg-opacity-50' : ''}`,\n )}\n >\n {option.label ? option.label : option.value}\n </RadioButton>\n ));\n break;\n default:\n RadioComponents = options.map((option) => (\n <Radio\n key={option.value}\n data-testid={slugify(\n `${testId}_option_${option.testId || option.value}`,\n )}\n isDisabled={isDisabled || option.disabled}\n value={option.value}\n onChange={onChange}\n >\n {option.label ? option.label : option.value}\n </Radio>\n ));\n }\n\n return (\n <NextRadioGroup\n className={className}\n data-testid={testId}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n label && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label className={`${invalid ? 'text-danger' : ''}`}>\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </label>\n )\n }\n orientation={inline ? 'horizontal' : 'vertical'}\n onBlur={onBlur}\n onChange={onChange}\n name={name}\n ref={ref}\n >\n {variant === 'radioButton' ? (\n // TODO: NextButtonGroup uses ref to modify Button style, but we wrap it, so it does not work at the moment.\n <NextButtonGroup>{RadioComponents}</NextButtonGroup>\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-primary',\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 /** 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 className = undefined,\n value,\n isDisabled = false,\n onChange,\n children,\n}: RadioButtonProps) => {\n return (\n <Button\n key={`index_${value}`}\n className={cn(className)}\n disabled={isDisabled}\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
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-DVWR5KIG.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-DVWR5KIG.cjs","sourcesContent":[null,"import type { ReactElement, ReactNode } from 'react';\n\nimport { Controller } from 'react-hook-form';\n\nimport { ButtonGroup as NextButtonGroup } from '@nextui-org/button';\nimport { RadioGroup as NextRadioGroup, Radio } from '@nextui-org/radio';\n\nimport { cn } from '@fuf-stack/pixel-utils';\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 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 {\n /** CSS class name */\n className?: string;\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, getFieldState, getValues } = useFormContext();\n\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={({ field: { onChange, disabled: isDisabled, onBlur, ref } }) => {\n let RadioComponents: ReactNode;\n switch (variant) {\n case 'radioBox':\n RadioComponents = options.map((option) => (\n <RadioBox\n key={option.value}\n data-testid={slugify(\n `${testId}_option_${option.testId || option.value}`,\n )}\n isDisabled={isDisabled || option.disabled}\n value={option.value}\n onChange={onChange}\n description={option.description}\n icon={option.icon}\n >\n {option.label ? option.label : option.value}\n </RadioBox>\n ));\n break;\n case 'radioButton':\n RadioComponents = options.map((option) => (\n <RadioButton\n key={option.value}\n data-testid={slugify(\n `${testId}_option_${option.testId || option.value}`,\n )}\n isDisabled={isDisabled || option.disabled}\n value={option.value}\n onChange={onChange}\n // TODO: how to do the classNames properly (make selected option darker with same color)\n className={cn(\n `${getValues()[name] !== option.value ? 'bg-opacity-50' : ''}`,\n )}\n >\n {option.label ? option.label : option.value}\n </RadioButton>\n ));\n break;\n default:\n RadioComponents = options.map((option) => (\n <Radio\n key={option.value}\n data-testid={slugify(\n `${testId}_option_${option.testId || option.value}`,\n )}\n isDisabled={isDisabled || option.disabled}\n value={option.value}\n onChange={onChange}\n >\n {option.label ? option.label : option.value}\n </Radio>\n ));\n }\n\n return (\n <NextRadioGroup\n className={className}\n data-testid={testId}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={isDisabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n label && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label className={`${invalid ? 'text-danger' : ''}`}>\n {label}\n <FieldCopyTestIdButton testId={testId} />\n </label>\n )\n }\n orientation={inline ? 'horizontal' : 'vertical'}\n onBlur={onBlur}\n onChange={onChange}\n name={name}\n ref={ref}\n >\n {variant === 'radioButton' ? (\n // TODO: NextButtonGroup uses ref to modify Button style, but we wrap it, so it does not work at the moment.\n <NextButtonGroup>{RadioComponents}</NextButtonGroup>\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-primary',\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 /** 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 className = undefined,\n value,\n isDisabled = false,\n onChange,\n children,\n}: RadioButtonProps) => {\n return (\n <Button\n key={`index_${value}`}\n className={cn(className)}\n disabled={isDisabled}\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 _chunkKMMS4G7Acjs = require('./chunk-KMMS4G7A.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkJ5IMU4UGcjs = require('./chunk-J5IMU4UG.cjs');
|
|
10
10
|
|
|
11
11
|
|
|
12
12
|
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
@@ -26,7 +26,7 @@ var CheckboxGroup = ({
|
|
|
26
26
|
name,
|
|
27
27
|
testId: _testId = void 0
|
|
28
28
|
}) => {
|
|
29
|
-
const { getFieldState, control } =
|
|
29
|
+
const { getFieldState, control } = _chunkJ5IMU4UGcjs.useFormContext.call(void 0, );
|
|
30
30
|
const { error, invalid, required, testId } = getFieldState(name, _testId);
|
|
31
31
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
32
32
|
_reacthookform.Controller,
|
|
@@ -93,4 +93,4 @@ var CheckboxGroup_default2 = CheckboxGroup_default;
|
|
|
93
93
|
|
|
94
94
|
|
|
95
95
|
exports.CheckboxGroup_default = CheckboxGroup_default; exports.CheckboxGroup_default2 = CheckboxGroup_default2;
|
|
96
|
-
//# sourceMappingURL=chunk-
|
|
96
|
+
//# sourceMappingURL=chunk-EWFS7ZAG.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-EWFS7ZAG.cjs","../src/CheckboxGroup/CheckboxGroup.tsx","../src/CheckboxGroup/index.ts"],"names":[],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACbA,gDAA2B;AAE3B;AACE;AACA;AAAiB,gDACZ;AAyD4B,+CAAA;AArBnC,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,aAAA,EAAe,QAAQ,EAAA,EAAI,8CAAA,CAAe;AAClD,EAAA,MAAM,EAAE,KAAA,EAAO,OAAA,EAAS,QAAA,EAAU,OAAO,EAAA,EAAI,aAAA,CAAc,IAAA,EAAM,OAAO,CAAA;AAExE,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,SAAA;AAAA,YACA,aAAA,EAAa,MAAA;AAAA,YACb,YAAA,EAAc,MAAA,mBAAS,6BAAA,8CAAC,EAAA,EAAqB,MAAA,CAAc,CAAA;AAAA,YAC3D,UAAA,EAAY,QAAA;AAAA,YACZ,SAAA,EAAW,OAAA;AAAA,YACX,UAAA,EAAY,QAAA;AAAA,YACZ,KAAA,EACE,MAAA;AAAA,4BAEE,8BAAA;AAAA,cAAC,OAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAW,CAAA,mCAAA,EAAsC,QAAA,EAAU,cAAA,EAAgB,qBAAqB,CAAA,CAAA;AAE/F,gBAAA;AAAA,kBAAA;AACsC,kCAAA;AAAA,gBAAA;AAAA,cAAA;AACzC,YAAA;AAKA,YAAA;AAC8C,cAAA;AACY,cAAA;AAE1D,YAAA;AACE,cAAA;AACA,cAAA;AACF,YAAA;AACJ,YAAA;AACA,YAAA;AAE0B,YAAA;AAEtB,cAAA;AAAC,gBAAA;AAAA,gBAAA;AAEgC,kBAAA;AAChB,kBAAA;AACF,kBAAA;AACwC,oBAAA;AACrD,kBAAA;AAES,kBAAA;AAAA,gBAAA;AAPiB,gBAAA;AAQ5B,cAAA;AAEH,YAAA;AAAA,UAAA;AACH,QAAA;AAEJ,MAAA;AAAA,IAAA;AACF,EAAA;AAEJ;AAEe;ADxBkG;AACA;AElFlG;AFoFkG;AACA;AACA;AACA;AACA","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-EWFS7ZAG.cjs","sourcesContent":[null,"import { Controller } from 'react-hook-form';\n\nimport {\n Checkbox,\n CheckboxGroup as NextCheckboxGroup,\n} from '@nextui-org/checkbox';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\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 {\n /** CSS class name. ClassName: string | { buttons?: string | { base?: string; active?: string }; base?: string;} */\n className?: string;\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 { getFieldState, control } = useFormContext();\n const { error, invalid, required, testId } = getFieldState(name, _testId);\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 className={className}\n data-testid={testId}\n errorMessage={error && <FieldValidationError error={error} />}\n isDisabled={disabled}\n isInvalid={invalid}\n isRequired={required}\n label={\n label && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label\n className={`text-bold text-ellipsis text-small ${invalid ? 'text-danger' : 'text-foreground-500'}`}\n >\n {label}\n <FieldCopyTestIdButton testId={testId} />\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 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"]}
|