@fuf-stack/uniform 0.14.4 → 0.15.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 +7 -6
- package/dist/CheckboxGroup/index.cjs.map +1 -1
- package/dist/CheckboxGroup/index.js +6 -5
- package/dist/Controller/index.cjs +4 -2
- package/dist/Controller/index.cjs.map +1 -1
- package/dist/Controller/index.d.cts +7 -3
- package/dist/Controller/index.d.ts +7 -3
- package/dist/Controller/index.js +7 -5
- package/dist/Controller-8Nqugui5.d.cts +37 -0
- package/dist/Controller-8Nqugui5.d.ts +37 -0
- package/dist/FieldArray/index.cjs +6 -5
- package/dist/FieldArray/index.cjs.map +1 -1
- package/dist/FieldArray/index.d.cts +5 -3
- package/dist/FieldArray/index.d.ts +5 -3
- package/dist/FieldArray/index.js +5 -4
- package/dist/FieldArray-AqM2XKIh.d.cts +151 -0
- package/dist/FieldArray-AqM2XKIh.d.ts +151 -0
- package/dist/Form/index.cjs +5 -4
- package/dist/Form/index.cjs.map +1 -1
- package/dist/Form/index.js +4 -3
- package/dist/Grid/index.cjs +1 -0
- package/dist/Grid/index.cjs.map +1 -1
- package/dist/Grid/index.js +1 -0
- package/dist/Input/index.cjs +7 -6
- package/dist/Input/index.cjs.map +1 -1
- package/dist/Input/index.js +6 -5
- package/dist/RadioGroup/index.cjs +7 -6
- package/dist/RadioGroup/index.cjs.map +1 -1
- package/dist/RadioGroup/index.js +6 -5
- package/dist/Select/index.cjs +7 -6
- package/dist/Select/index.cjs.map +1 -1
- package/dist/Select/index.js +6 -5
- package/dist/SubmitButton/index.cjs +5 -4
- package/dist/SubmitButton/index.cjs.map +1 -1
- package/dist/SubmitButton/index.js +4 -3
- package/dist/Switch/index.cjs +7 -6
- package/dist/Switch/index.cjs.map +1 -1
- package/dist/Switch/index.js +6 -5
- package/dist/TextArea/index.cjs +7 -6
- package/dist/TextArea/index.cjs.map +1 -1
- package/dist/TextArea/index.js +6 -5
- package/dist/{chunk-DDZMDOSG.js → chunk-2LAPLELO.js} +21 -17
- package/dist/{chunk-DDZMDOSG.js.map → chunk-2LAPLELO.js.map} +1 -1
- package/dist/chunk-2NSCPLAA.cjs +133 -0
- package/dist/chunk-2NSCPLAA.cjs.map +1 -0
- package/dist/{chunk-TR2J3OKH.js → chunk-3Q37222E.js} +20 -13
- package/dist/chunk-3Q37222E.js.map +1 -0
- package/dist/chunk-4AXNPSXG.cjs +82 -0
- package/dist/chunk-4AXNPSXG.cjs.map +1 -0
- package/dist/chunk-4DAZAO6Y.cjs +59 -0
- package/dist/chunk-4DAZAO6Y.cjs.map +1 -0
- package/dist/chunk-4EJS5FXY.js +51 -0
- package/dist/chunk-4EJS5FXY.js.map +1 -0
- package/dist/chunk-4EP3IGSK.cjs +372 -0
- package/dist/chunk-4EP3IGSK.cjs.map +1 -0
- package/dist/{chunk-25LLM544.cjs → chunk-4M6F2O2K.cjs} +11 -9
- package/dist/chunk-4M6F2O2K.cjs.map +1 -0
- package/dist/{chunk-XJGJ5ZNM.js → chunk-7HK64PN5.js} +38 -22
- package/dist/chunk-7HK64PN5.js.map +1 -0
- package/dist/{chunk-OHJYXA6R.cjs → chunk-C4RM2JSD.cjs} +3 -3
- package/dist/{chunk-OHJYXA6R.cjs.map → chunk-C4RM2JSD.cjs.map} +1 -1
- package/dist/chunk-CRTRMMJ7.js +59 -0
- package/dist/chunk-CRTRMMJ7.js.map +1 -0
- package/dist/{chunk-EKE5URXQ.cjs → chunk-F6KTQXWG.cjs} +15 -12
- package/dist/chunk-F6KTQXWG.cjs.map +1 -0
- package/dist/{chunk-RY4F5YDS.cjs → chunk-FLX6VIO7.cjs} +42 -26
- package/dist/chunk-FLX6VIO7.cjs.map +1 -0
- package/dist/chunk-IEF2GJ22.js +82 -0
- package/dist/chunk-IEF2GJ22.js.map +1 -0
- package/dist/chunk-K43U2JVG.cjs +248 -0
- package/dist/chunk-K43U2JVG.cjs.map +1 -0
- package/dist/{chunk-XJZAS7NG.cjs → chunk-MF4JB3YT.cjs} +25 -21
- package/dist/chunk-MF4JB3YT.cjs.map +1 -0
- package/dist/{chunk-BZAPTLMC.js → chunk-MRXNKY72.js} +49 -49
- package/dist/chunk-MRXNKY72.js.map +1 -0
- package/dist/chunk-OBQDQ4RX.js +372 -0
- package/dist/chunk-OBQDQ4RX.js.map +1 -0
- package/dist/{chunk-VP7WDLJM.js → chunk-P4PRVNCH.js} +17 -13
- package/dist/chunk-P4PRVNCH.js.map +1 -0
- package/dist/{chunk-PZ4LZQI4.cjs → chunk-QLQR44AD.cjs} +19 -15
- package/dist/chunk-QLQR44AD.cjs.map +1 -0
- package/dist/{chunk-AQHKELUR.js → chunk-U26GTLKF.js} +10 -8
- package/dist/chunk-U26GTLKF.js.map +1 -0
- package/dist/{chunk-GN5NJ6ZU.js → chunk-UJYXA5AD.js} +3 -3
- package/dist/chunk-V5HTEMWZ.cjs +51 -0
- package/dist/chunk-V5HTEMWZ.cjs.map +1 -0
- package/dist/{chunk-VZ5MMFIF.cjs → chunk-V7LRZ5GK.cjs} +5 -5
- package/dist/{chunk-VZ5MMFIF.cjs.map → chunk-V7LRZ5GK.cjs.map} +1 -1
- package/dist/{chunk-WKM2D7LF.js → chunk-VX76MJAI.js} +2 -2
- package/dist/chunk-W66BVPTB.js +248 -0
- package/dist/{chunk-IUNDGVMC.js.map → chunk-W66BVPTB.js.map} +1 -1
- package/dist/{chunk-BS52M4SZ.js → chunk-WAXJ64P7.js} +14 -11
- package/dist/chunk-WAXJ64P7.js.map +1 -0
- package/dist/{chunk-U6VUNJZG.cjs → chunk-Y4AUJ2YA.cjs} +21 -14
- package/dist/chunk-Y4AUJ2YA.cjs.map +1 -0
- package/dist/helpers/index.cjs +11 -2
- package/dist/helpers/index.cjs.map +1 -1
- package/dist/helpers/index.d.cts +68 -1
- package/dist/helpers/index.d.ts +68 -1
- package/dist/helpers/index.js +12 -3
- package/dist/hooks/index.cjs +6 -3
- package/dist/hooks/index.cjs.map +1 -1
- package/dist/hooks/index.d.cts +3 -2
- package/dist/hooks/index.d.ts +3 -2
- package/dist/hooks/index.js +7 -4
- package/dist/index.cjs +25 -14
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +5 -3
- package/dist/index.d.ts +5 -3
- package/dist/index.js +33 -22
- package/dist/partials/FieldCopyTestIdButton/index.cjs +1 -0
- package/dist/partials/FieldCopyTestIdButton/index.cjs.map +1 -1
- package/dist/partials/FieldCopyTestIdButton/index.js +1 -0
- package/dist/partials/FieldValidationError/index.cjs +4 -3
- package/dist/partials/FieldValidationError/index.cjs.map +1 -1
- package/dist/partials/FieldValidationError/index.js +3 -2
- package/package.json +18 -18
- package/dist/FieldArray-DD9z-xZ3.d.cts +0 -37
- package/dist/FieldArray-DD9z-xZ3.d.ts +0 -37
- package/dist/chunk-25LLM544.cjs.map +0 -1
- package/dist/chunk-AQHKELUR.js.map +0 -1
- package/dist/chunk-BBB4FEY6.cjs +0 -22
- package/dist/chunk-BBB4FEY6.cjs.map +0 -1
- package/dist/chunk-BS52M4SZ.js.map +0 -1
- package/dist/chunk-BZAPTLMC.js.map +0 -1
- package/dist/chunk-EKE5URXQ.cjs.map +0 -1
- package/dist/chunk-HOETR36J.cjs +0 -299
- package/dist/chunk-HOETR36J.cjs.map +0 -1
- package/dist/chunk-HZP3EXGR.cjs +0 -241
- package/dist/chunk-HZP3EXGR.cjs.map +0 -1
- package/dist/chunk-IUNDGVMC.js +0 -241
- package/dist/chunk-KOKIM2ND.js +0 -9
- package/dist/chunk-KOKIM2ND.js.map +0 -1
- package/dist/chunk-PZ4LZQI4.cjs.map +0 -1
- package/dist/chunk-RY4F5YDS.cjs.map +0 -1
- package/dist/chunk-TR2J3OKH.js.map +0 -1
- package/dist/chunk-U6VUNJZG.cjs.map +0 -1
- package/dist/chunk-V46BHM2U.js +0 -22
- package/dist/chunk-V46BHM2U.js.map +0 -1
- package/dist/chunk-VP7WDLJM.js.map +0 -1
- package/dist/chunk-VQWKXSHW.cjs +0 -9
- package/dist/chunk-VQWKXSHW.cjs.map +0 -1
- package/dist/chunk-XJGJ5ZNM.js.map +0 -1
- package/dist/chunk-XJWEUCV3.cjs +0 -133
- package/dist/chunk-XJWEUCV3.cjs.map +0 -1
- package/dist/chunk-XJZAS7NG.cjs.map +0 -1
- package/dist/chunk-Y53IHK6B.js +0 -299
- package/dist/chunk-Y53IHK6B.js.map +0 -1
- /package/dist/{chunk-GN5NJ6ZU.js.map → chunk-UJYXA5AD.js.map} +0 -0
- /package/dist/{chunk-WKM2D7LF.js.map → chunk-VX76MJAI.js.map} +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-U6VUNJZG.cjs","../src/Input/Input.tsx","../src/Input/index.ts"],"names":["Input_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-U6VUNJZG.cjs","sourcesContent":[null,"import type { ReactNode } from 'react';\n\nimport { Input as NextInput } from '@nextui-org/input';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from '../Controller';\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 /** allows disentangled display and form values for a field */\n transformValue?: {\n /** transforms the formValue of the field to the display value of the field */\n displayValue: (value: string | number) => string | number;\n /** transforms the displayValue of the field to the form value of the field */\n formValue: (value: string) => string | number;\n };\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 transformValue = 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 : (e) =>\n onChange(\n transformValue && transformValue.formValue\n ? transformValue.formValue(e.target.value)\n : e.target.value,\n )\n }\n placeholder={placeholder}\n radius=\"sm\"\n ref={ref}\n startContent={startContent}\n type={type}\n value={\n transformValue && transformValue.displayValue\n ? transformValue.displayValue(value)\n : value\n }\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"]}
|
package/dist/chunk-V46BHM2U.js
DELETED
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
// src/helpers/slugify/slugify.ts
|
|
2
|
-
import slug from "slug";
|
|
3
|
-
var slugify = (string, options) => {
|
|
4
|
-
const replacement = options?.replacement || "_";
|
|
5
|
-
return slug(string, {
|
|
6
|
-
...slug.defaults.modes.rfc3986,
|
|
7
|
-
charmap: {
|
|
8
|
-
...slug.defaults.modes.rfc3986.charmap,
|
|
9
|
-
// allow dots by default
|
|
10
|
-
".": ".",
|
|
11
|
-
// convert hyphens to underscores (when replacement is not hyphen)
|
|
12
|
-
...replacement !== "-" ? { "-": "_" } : {}
|
|
13
|
-
},
|
|
14
|
-
replacement,
|
|
15
|
-
...options || {}
|
|
16
|
-
});
|
|
17
|
-
};
|
|
18
|
-
|
|
19
|
-
export {
|
|
20
|
-
slugify
|
|
21
|
-
};
|
|
22
|
-
//# sourceMappingURL=chunk-V46BHM2U.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/helpers/slugify/slugify.ts"],"sourcesContent":["/* eslint-disable import/prefer-default-export */\n\nimport type { Options as SlugOptions } from 'slug';\n\nimport slug from 'slug';\n\nexport const slugify = (string: string, options?: SlugOptions) => {\n const replacement = options?.replacement || '_';\n return slug(string, {\n ...slug.defaults.modes.rfc3986,\n charmap: {\n ...slug.defaults.modes.rfc3986.charmap,\n // allow dots by default\n '.': '.',\n // convert hyphens to underscores (when replacement is not hyphen)\n ...(replacement !== '-' ? { '-': '_' } : {}),\n },\n replacement,\n ...(options || {}),\n });\n};\n"],"mappings":";AAIA,OAAO,UAAU;AAEV,IAAM,UAAU,CAAC,QAAgB,YAA0B;AAChE,QAAM,cAAc,SAAS,eAAe;AAC5C,SAAO,KAAK,QAAQ;AAAA,IAClB,GAAG,KAAK,SAAS,MAAM;AAAA,IACvB,SAAS;AAAA,MACP,GAAG,KAAK,SAAS,MAAM,QAAQ;AAAA;AAAA,MAE/B,KAAK;AAAA;AAAA,MAEL,GAAI,gBAAgB,MAAM,EAAE,KAAK,IAAI,IAAI,CAAC;AAAA,IAC5C;AAAA,IACA;AAAA,IACA,GAAI,WAAW,CAAC;AAAA,EAClB,CAAC;AACH;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Form/Form.tsx","../src/Form/subcomponents/FormDebugViewer.tsx","../src/Form/index.ts"],"sourcesContent":["import type { VetoInstance } from '@fuf-stack/veto';\nimport type { ReactNode } from 'react';\nimport type { FieldValues, SubmitHandler } from 'react-hook-form';\nimport type { DebugModeSettings } from './subcomponents/FormContext';\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 /** settings for from debug mode */\n debug?: DebugModeSettings;\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 debug = 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 debugModeSettings={debug}\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 {!debug?.disable && <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';\nimport { removeNullishFields } from './FormContext';\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 = removeNullishFields(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=\"fixed 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"]}
|
package/dist/chunk-VQWKXSHW.cjs
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/Controller/index.ts
|
|
2
|
-
var _reacthookform = require('react-hook-form');
|
|
3
|
-
var Controller_default = _reacthookform.Controller;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
exports.Controller = _reacthookform.Controller; exports.Controller_default = Controller_default;
|
|
9
|
-
//# sourceMappingURL=chunk-VQWKXSHW.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-VQWKXSHW.cjs","../src/Controller/index.ts"],"names":[],"mappings":"AAAA;ACEA,gDAA2B;AAM3B,IAAO,mBAAA,EAAQ,yBAAA;ADLf;AACA;AACE;AACA;AACF,gGAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-VQWKXSHW.cjs","sourcesContent":[null,"/** @see https://react-hook-form.com/docs/usecontroller/controller */\n\nimport { Controller } from 'react-hook-form';\n\nexport type { ControllerProps } from 'react-hook-form';\n\nexport { Controller };\n\nexport default Controller;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/CheckboxGroup/CheckboxGroup.tsx","../src/CheckboxGroup/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\n\nimport {\n Checkbox,\n CheckboxGroup as NextCheckboxGroup,\n} from '@nextui-org/checkbox';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from '../Controller';\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"],"mappings":";;;;;;;;;;;;;;;;;AAEA;AAAA,EACE;AAAA,EACA,iBAAiB;AAAA,OACZ;AAEP,SAAS,IAAI,4BAA4B;AAmGzB,cAYA,YAZA;AA3FT,IAAM,wBAAwB,GAAG;AAAA,EACtC,OAAO;AAAA,IACL,MAAM;AAAA;AAAA,IACN,cAAc;AAAA,IACd,UAAU;AAAA,IACV,UAAU;AAAA,IACV,WAAW;AAAA,IACX,aAAa;AAAA;AAAA,IAEb,OACE;AAAA,IACF,SAAS;AAAA,EACX;AACF,CAAC;AAkCD,IAAM,gBAAgB,CAAC;AAAA,EACrB,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA,QAAQ,UAAU;AACpB,MAA0B;AACxB,QAAM,EAAE,SAAS,WAAW,cAAc,IAAI,eAAe;AAC7D,QAAM,EAAE,OAAO,SAAS,UAAU,OAAO,IAAI,cAAc,MAAM,OAAO;AAExE,QAAM,uBAAuB,cAAc;AAC3C,QAAM,YAAY,SAAS;AAE3B,QAAM,WAAW,sBAAsB;AACvC,QAAM,aAAa,qBAAqB,UAAU,WAAW,MAAM;AAEnE,QAAM,gBAAgB;AAAA,IACpB,MAAM,WAAW;AAAA,IACjB,SAAS,WAAW;AAAA,IACpB,MAAM,WAAW;AAAA,IACjB,OAAO,WAAW;AAAA,EACpB;AACA,QAAM,qBAAqB;AAAA,IACzB,MAAM,WAAW;AAAA,IACjB,SAAS,WAAW;AAAA,IACpB,OAAO,WAAW;AAAA,EACpB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAU,OAAO,KAAK,OAAO,EAAE,MAAM;AACvD,eACE;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,YAAY;AAAA,YACZ,eAAa;AAAA,YAEb,gBAAc;AAAA,YACd,cACE,SACE;AAAA,cAAC;AAAA;AAAA,gBACC;AAAA,gBACA,WAAW,WAAW;AAAA;AAAA,YACxB;AAAA,YAGJ,YAAY;AAAA,YACZ,WAAW;AAAA,YACX,YAAY;AAAA,YACZ,OACE;AAAA,YAEE,qBAAC,WACE;AAAA;AAAA,cACA,wBACC,oBAAC,iCAAsB,QAAgB;AAAA,eAE3C;AAAA,YAIH,GAAI,QAAQ,WAAW,IACpB;AAAA,cACE,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,MAAM,MAAS;AAAA,cAC5C,UAAU,CAAC,aAAa,SAAS,YAAY,SAAS,CAAC,CAAC;AAAA,YAC1D,IACA;AAAA,cACE;AAAA,cACA;AAAA,YACF;AAAA,YACJ;AAAA,YACA;AAAA,YAEC,mBAAS,IAAI,CAAC,WAAW;AACxB,qBACE;AAAA,gBAAC;AAAA;AAAA,kBACC,gBAAc;AAAA,kBACd,YAAY;AAAA,kBAEZ,YAAY,YAAY,OAAO;AAAA,kBAC/B,OAAO,QAAQ;AAAA,kBACf,eAAa;AAAA,oBACX,GAAG,MAAM,WAAW,QAAQ,UAAU,QAAQ,KAAK;AAAA,kBACrD;AAAA,kBAEC,kBAAQ;AAAA;AAAA,gBAPJ,SAAS,OAAO,KAAK;AAAA,cAQ5B;AAAA,YAEJ,CAAC;AAAA;AAAA,QACH;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,wBAAQ;;;AC5Jf,IAAOA,yBAAQ;","names":["CheckboxGroup_default"]}
|
package/dist/chunk-XJWEUCV3.cjs
DELETED
|
@@ -1,133 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
|
-
|
|
3
|
-
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
4
|
-
|
|
5
|
-
// src/hooks/useFieldArray/useFieldArray.ts
|
|
6
|
-
var _reacthookform = require('react-hook-form');
|
|
7
|
-
|
|
8
|
-
// src/hooks/useFormContext/useFormContext.ts
|
|
9
|
-
var _react = require('react'); var _react2 = _interopRequireDefault(_react);
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
// src/Form/subcomponents/FormContext.tsx
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
var _pixels = require('@fuf-stack/pixels');
|
|
16
|
-
var _jsxruntime = require('react/jsx-runtime');
|
|
17
|
-
var removeNullishFields = (obj) => {
|
|
18
|
-
return JSON.parse(
|
|
19
|
-
JSON.stringify(obj, (_key, value) => {
|
|
20
|
-
return value === "" || value === null ? void 0 : value;
|
|
21
|
-
})
|
|
22
|
-
);
|
|
23
|
-
};
|
|
24
|
-
var DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT = "uniform:debug-mode";
|
|
25
|
-
var UniformContext = _react2.default.createContext({
|
|
26
|
-
debugMode: "off",
|
|
27
|
-
preventSubmit: () => void 0,
|
|
28
|
-
setDebugMode: () => void 0,
|
|
29
|
-
validation: void 0
|
|
30
|
-
});
|
|
31
|
-
var FormProvider = ({
|
|
32
|
-
children,
|
|
33
|
-
debugModeSettings = void 0,
|
|
34
|
-
initialValues = void 0,
|
|
35
|
-
onSubmit,
|
|
36
|
-
validation = void 0,
|
|
37
|
-
validationTrigger
|
|
38
|
-
}) => {
|
|
39
|
-
const [preventSubmit, setPreventSubmit] = _react.useState.call(void 0, false);
|
|
40
|
-
const [debugMode, setDebugMode] = _pixels.useLocalStorage.call(void 0,
|
|
41
|
-
_optionalChain([debugModeSettings, 'optionalAccess', _ => _.localStorageKey]) || DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT,
|
|
42
|
-
"off"
|
|
43
|
-
);
|
|
44
|
-
const contextValue = _react.useMemo.call(void 0,
|
|
45
|
-
() => ({
|
|
46
|
-
// set debugMode to disabled when debugModeSettings.disable is true
|
|
47
|
-
// otherwise use current debug mode from localStorage
|
|
48
|
-
debugMode: _optionalChain([debugModeSettings, 'optionalAccess', _2 => _2.disable]) ? "disabled" : debugMode,
|
|
49
|
-
preventSubmit: (prevent) => {
|
|
50
|
-
setPreventSubmit(prevent);
|
|
51
|
-
},
|
|
52
|
-
setDebugMode,
|
|
53
|
-
validation
|
|
54
|
-
}),
|
|
55
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
56
|
-
[debugMode, _optionalChain([debugModeSettings, 'optionalAccess', _3 => _3.disable])]
|
|
57
|
-
);
|
|
58
|
-
const methods = _reacthookform.useForm.call(void 0, {
|
|
59
|
-
defaultValues: initialValues,
|
|
60
|
-
// add validation config when validation schema provided
|
|
61
|
-
...validation ? {
|
|
62
|
-
// set rhf mode
|
|
63
|
-
// see: https://react-hook-form.com/docs/useform#mode
|
|
64
|
-
mode: validationTrigger,
|
|
65
|
-
resolver: async (values) => {
|
|
66
|
-
const { data, errors, ...rest } = await validation.validateAsync(
|
|
67
|
-
removeNullishFields(values)
|
|
68
|
-
);
|
|
69
|
-
return { values: data || {}, errors: errors || {}, ...rest };
|
|
70
|
-
}
|
|
71
|
-
} : {}
|
|
72
|
-
});
|
|
73
|
-
const handleSubmit = async (e) => {
|
|
74
|
-
if (methods.formState.isValid && preventSubmit) {
|
|
75
|
-
console.warn(
|
|
76
|
-
"[FormProvider] form submit was prevented because preventSubmit is true..."
|
|
77
|
-
);
|
|
78
|
-
_optionalChain([e, 'optionalAccess', _4 => _4.preventDefault, 'call', _5 => _5()]);
|
|
79
|
-
return Promise.resolve();
|
|
80
|
-
}
|
|
81
|
-
await methods.handleSubmit(onSubmit)(e);
|
|
82
|
-
};
|
|
83
|
-
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, UniformContext.Provider, { value: contextValue, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reacthookform.FormProvider, { ...methods, children: children({ handleSubmit }) }) });
|
|
84
|
-
};
|
|
85
|
-
var FormContext_default = FormProvider;
|
|
86
|
-
|
|
87
|
-
// src/hooks/useFormContext/useFormContext.ts
|
|
88
|
-
var checkFieldIsRequired = (validation, path) => {
|
|
89
|
-
const checkRequired = (schema) => {
|
|
90
|
-
if (schema.type === "array" && _optionalChain([schema, 'optionalAccess', _6 => _6.minLength])) {
|
|
91
|
-
return true;
|
|
92
|
-
}
|
|
93
|
-
return !schema.isOptional && !schema.isNullable;
|
|
94
|
-
};
|
|
95
|
-
return validation.checkSchemaPath(checkRequired, path);
|
|
96
|
-
};
|
|
97
|
-
var useFormContext = () => {
|
|
98
|
-
const {
|
|
99
|
-
formState,
|
|
100
|
-
// https://react-hook-form.com/docs/useform/getfieldstate
|
|
101
|
-
// for getFieldState a subscription to formState properties is needed!
|
|
102
|
-
getFieldState: getFieldStateOrig,
|
|
103
|
-
...otherMethods
|
|
104
|
-
} = _reacthookform.useFormContext.call(void 0, );
|
|
105
|
-
const uniformContext = _react.useContext.call(void 0, UniformContext);
|
|
106
|
-
const getFieldState = (name, testId) => {
|
|
107
|
-
const fieldPath = typeof name === "string" ? name.replace(/\[\d+\]/g, "").split(".") : name;
|
|
108
|
-
const required = _optionalChain([uniformContext, 'optionalAccess', _7 => _7.validation]) ? checkFieldIsRequired(uniformContext.validation, fieldPath) : false;
|
|
109
|
-
const { error, ...rest } = getFieldStateOrig(name, formState);
|
|
110
|
-
return {
|
|
111
|
-
...rest,
|
|
112
|
-
error,
|
|
113
|
-
// Ensure correct type for error
|
|
114
|
-
required,
|
|
115
|
-
testId: _chunkBBB4FEY6cjs.slugify.call(void 0, testId || name)
|
|
116
|
-
};
|
|
117
|
-
};
|
|
118
|
-
return {
|
|
119
|
-
...otherMethods,
|
|
120
|
-
...uniformContext,
|
|
121
|
-
getFieldState,
|
|
122
|
-
formState
|
|
123
|
-
};
|
|
124
|
-
};
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
exports.useFieldArray = _reacthookform.useFieldArray; exports.removeNullishFields = removeNullishFields; exports.FormContext_default = FormContext_default; exports.checkFieldIsRequired = checkFieldIsRequired; exports.useFormContext = useFormContext;
|
|
133
|
-
//# sourceMappingURL=chunk-XJWEUCV3.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-XJWEUCV3.cjs","../src/hooks/useFieldArray/useFieldArray.ts","../src/hooks/useFormContext/useFormContext.ts","../src/Form/subcomponents/FormContext.tsx"],"names":[],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-XJWEUCV3.cjs","sourcesContent":[null,"/* eslint-disable import/prefer-default-export */\n\n/** @see https://react-hook-form.com/docs/usefieldarray */\nexport { useFieldArray } from 'react-hook-form';\n","import type { VetoInstance } 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/** Schema check whether a field is required or optional */\nexport const checkFieldIsRequired = (\n validation: VetoInstance,\n path: string[],\n): boolean => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const checkRequired = (schema: any) => {\n // arrays with minLength are required\n if (schema.type === 'array' && schema?.minLength) {\n return true;\n }\n // all other fields are required if they are\n // not optional and not nullable\n return !schema.isOptional && !schema.isNullable;\n };\n\n return validation.checkSchemaPath(checkRequired, path);\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 = uniformContext?.validation\n ? checkFieldIsRequired(uniformContext.validation, 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\nimport { useLocalStorage } from '@fuf-stack/pixels';\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 === '' || value === null ? undefined : value;\n }),\n );\n};\n\ntype DebugMode = 'debug' | 'debug-testids' | 'off' | 'disabled';\n\nexport type DebugModeSettings = {\n /** disable form debug completely */\n disable?: boolean;\n /** custom localStorage key to save debug mode state */\n localStorageKey?: string;\n};\n\nconst DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT = 'uniform:debug-mode';\n\n/**\n * The `UniformContext` provides control over the form's submission behavior and may optionally include\n * a Veto validation schema for form validation.\n *\n * Specifically, this context offers:\n * 1. **Form Submission Control**: The `preventSubmit` function allows components to enable or disable\n * form submissions.\n * 2. **Optional Validation Schema**: The `validation` property may hold a Veto validation schema instance\n * that can be used to validate form fields and handle validation logic.\n *\n * This context is useful for components that need to interact with or control the form submission state,\n * or access the validation schema for managing form validation logic.\n */\nexport const UniformContext = React.createContext<{\n /** Form debug mode enabled or not */\n debugMode: DebugMode;\n /** settings for from debug mode */\n debugModeSettings?: DebugModeSettings;\n /** Function to update if the form can currently be submitted */\n preventSubmit: (prevent: boolean) => void;\n /** Setter to enable or disable form debug mode */\n setDebugMode: (debugMode: DebugMode) => void;\n /** Optional Veto validation schema instance for form validation */\n validation?: VetoInstance;\n}>({\n debugMode: 'off',\n preventSubmit: () => undefined,\n setDebugMode: () => undefined,\n validation: undefined,\n});\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 /** settings for from debug mode */\n debugModeSettings?: DebugModeSettings;\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:\n * - The veto validation schema context\n * - Submit handler creation and submission control with preventSubmit\n * - Form Debug Mode state\n * - React Hook Form context\n */\nconst FormProvider: React.FC<FormProviderProps> = ({\n children,\n debugModeSettings = undefined,\n initialValues = undefined,\n onSubmit,\n validation = undefined,\n validationTrigger,\n}) => {\n // Control if the form can currently be submitted\n const [preventSubmit, setPreventSubmit] = useState(false);\n\n // Form Debug mode state is handled in the form context\n const [debugMode, setDebugMode] = useLocalStorage<DebugMode>(\n debugModeSettings?.localStorageKey || DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT,\n 'off',\n );\n\n // Memoize the context value to prevent re-renders\n const contextValue = useMemo(\n () => ({\n // set debugMode to disabled when debugModeSettings.disable is true\n // otherwise use current debug mode from localStorage\n debugMode: debugModeSettings?.disable ? 'disabled' : debugMode,\n preventSubmit: (prevent: boolean) => {\n setPreventSubmit(prevent);\n },\n setDebugMode,\n validation,\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [debugMode, debugModeSettings?.disable],\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 // eslint-disable-next-line consistent-return\n const handleSubmit = async (e?: React.BaseSyntheticEvent) => {\n // only prevent submit when form state is valid, because otherwise\n // submit will only trigger validation and add errors / focus invalid fields\n if (methods.formState.isValid && preventSubmit) {\n console.warn(\n '[FormProvider] form submit was prevented because preventSubmit is true...',\n );\n e?.preventDefault();\n return Promise.resolve();\n }\n await methods.handleSubmit(onSubmit)(e); // TODO: removeNullishFields here? @Hannes\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"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-XJZAS7NG.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/pixels/pixels/packages/uniform/dist/chunk-XJZAS7NG.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { TabProps } from '@fuf-stack/pixels/Tabs';\nimport type { ReactElement, ReactNode } from 'react';\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';\nimport Tabs from '@fuf-stack/pixels/Tabs';\n\nimport { Controller } from '../Controller';\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: 'bg-focus group-data-[invalid=true]:bg-danger',\n itemDescription: '',\n itemLabel: 'text-sm',\n itemLabelWrapper: '',\n itemWrapper:\n 'group-data-[invalid=true]:!border-danger [&:not(group-data-[invalid=\"true\"]):not(group-data-[selected=\"false\"])]:border-focus', // TODO: get rid of !.\n // See 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 // Tabs\n tabList: '',\n tab: '',\n tabContent: '',\n cursor: '',\n panel: '',\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<\n V extends 'default' | 'radioBox' | 'radioButton' | 'tabs',\n> 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: V extends 'default' | 'radioBox' | 'radioButton'\n ? RadioGroupOption[]\n : TabProps[];\n /** Id to grab element in internal tests. */\n testId?: string;\n /** How the RadioGroup should look like. */\n variant?: V;\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<\n 'default' | 'radioBox' | 'radioButton' | 'tabs'\n>): 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 tabList: classNames.tabList,\n tab: classNames.tab,\n tabContent: classNames.tabContent,\n cursor: classNames.cursor,\n panel: classNames.panel,\n };\n\n switch (variant) {\n case 'radioBox':\n RadioComponents = options.map((option) => {\n if ('value' in option) {\n return (\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 }\n return null;\n });\n break;\n case 'radioButton':\n RadioComponents = options.map((option) => {\n if ('value' in option) {\n return (\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 }\n return null;\n });\n break;\n\n case 'tabs':\n RadioComponents = (\n <Tabs\n fullWidth={false}\n tabs={options as TabProps[]}\n onSelectionChange={onChange}\n />\n );\n break;\n default:\n RadioComponents = options.map((option) => {\n if ('value' in option) {\n return (\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 return null;\n });\n }\n\n return (\n <NextRadioGroup\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"]}
|
package/dist/chunk-Y53IHK6B.js
DELETED
|
@@ -1,299 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
FieldCopyTestIdButton_default
|
|
3
|
-
} from "./chunk-2CRY7VDQ.js";
|
|
4
|
-
import {
|
|
5
|
-
FieldValidationError_default
|
|
6
|
-
} from "./chunk-WKM2D7LF.js";
|
|
7
|
-
import {
|
|
8
|
-
useFieldArray,
|
|
9
|
-
useFormContext
|
|
10
|
-
} from "./chunk-BZAPTLMC.js";
|
|
11
|
-
import {
|
|
12
|
-
slugify
|
|
13
|
-
} from "./chunk-V46BHM2U.js";
|
|
14
|
-
|
|
15
|
-
// src/FieldArray/FieldArray.tsx
|
|
16
|
-
import {
|
|
17
|
-
closestCenter,
|
|
18
|
-
DndContext,
|
|
19
|
-
KeyboardSensor,
|
|
20
|
-
PointerSensor,
|
|
21
|
-
useSensor,
|
|
22
|
-
useSensors
|
|
23
|
-
} from "@dnd-kit/core";
|
|
24
|
-
import {
|
|
25
|
-
restrictToVerticalAxis,
|
|
26
|
-
restrictToWindowEdges
|
|
27
|
-
} from "@dnd-kit/modifiers";
|
|
28
|
-
import {
|
|
29
|
-
SortableContext,
|
|
30
|
-
verticalListSortingStrategy
|
|
31
|
-
} from "@dnd-kit/sortable";
|
|
32
|
-
import { useInput as useInput2 } from "@nextui-org/input";
|
|
33
|
-
import { Button as Button2 } from "@fuf-stack/pixels";
|
|
34
|
-
|
|
35
|
-
// src/FieldArray/FieldArrayField.tsx
|
|
36
|
-
import { FaAngleDown, FaAngleUp, FaGripLines } from "react-icons/fa";
|
|
37
|
-
import { useSortable } from "@dnd-kit/sortable";
|
|
38
|
-
import { CSS } from "@dnd-kit/utilities";
|
|
39
|
-
import { useInput } from "@nextui-org/input";
|
|
40
|
-
import { Button } from "@fuf-stack/pixels";
|
|
41
|
-
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
42
|
-
var FieldArrayField = ({
|
|
43
|
-
children,
|
|
44
|
-
className = void 0,
|
|
45
|
-
field,
|
|
46
|
-
fields,
|
|
47
|
-
hideButtons = [],
|
|
48
|
-
id,
|
|
49
|
-
index,
|
|
50
|
-
insert,
|
|
51
|
-
lastNotDeletable = true,
|
|
52
|
-
move,
|
|
53
|
-
moveField,
|
|
54
|
-
name,
|
|
55
|
-
remove,
|
|
56
|
-
testId = void 0
|
|
57
|
-
}) => {
|
|
58
|
-
const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id });
|
|
59
|
-
const style = {
|
|
60
|
-
transform: CSS.Translate.toString(transform),
|
|
61
|
-
transition
|
|
62
|
-
};
|
|
63
|
-
const { getFieldState, trigger } = useFormContext();
|
|
64
|
-
const { error, invalid } = getFieldState(`${name}`, void 0);
|
|
65
|
-
const { getHelperWrapperProps, getErrorMessageProps } = useInput({
|
|
66
|
-
isInvalid: invalid,
|
|
67
|
-
errorMessage: JSON.stringify(error),
|
|
68
|
-
labelPlacement: "inside",
|
|
69
|
-
placeholder: " ",
|
|
70
|
-
classNames: { helperWrapper: "block" }
|
|
71
|
-
});
|
|
72
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
73
|
-
/* @__PURE__ */ jsxs(
|
|
74
|
-
"li",
|
|
75
|
-
{
|
|
76
|
-
ref: setNodeRef,
|
|
77
|
-
style,
|
|
78
|
-
className,
|
|
79
|
-
onBlur: () => trigger(`${name}.${index}`),
|
|
80
|
-
children: [
|
|
81
|
-
!hideButtons.includes("move") && !hideButtons.includes("all") && /* @__PURE__ */ jsxs("div", { className: "mr-6 flex flex-row items-center", children: [
|
|
82
|
-
moveField.includes("drag-drop") && /* @__PURE__ */ jsx(
|
|
83
|
-
"div",
|
|
84
|
-
{
|
|
85
|
-
className: "mr-2 text-base text-xl",
|
|
86
|
-
"data-testid": slugify(`${name}_${index}_movebutton`),
|
|
87
|
-
...attributes,
|
|
88
|
-
...listeners,
|
|
89
|
-
children: /* @__PURE__ */ jsx(FaGripLines, {})
|
|
90
|
-
}
|
|
91
|
-
),
|
|
92
|
-
moveField.includes("button") && /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
|
|
93
|
-
/* @__PURE__ */ jsx(
|
|
94
|
-
Button,
|
|
95
|
-
{
|
|
96
|
-
testId: `${name}.${index}.up`,
|
|
97
|
-
disabled: index === 0,
|
|
98
|
-
onClick: () => move(index, index - 1),
|
|
99
|
-
className: "flex rounded-b-none rounded-t-md border border-gray-300 px-2 py-2 shadow-sm",
|
|
100
|
-
children: /* @__PURE__ */ jsx(FaAngleUp, {})
|
|
101
|
-
}
|
|
102
|
-
),
|
|
103
|
-
/* @__PURE__ */ jsx(
|
|
104
|
-
Button,
|
|
105
|
-
{
|
|
106
|
-
testId: `${name}.${index}.down`,
|
|
107
|
-
disabled: index === fields.length - 1,
|
|
108
|
-
onClick: () => move(index, index + 1),
|
|
109
|
-
className: "flex rounded-b-md rounded-t-none border border-gray-300 px-2 py-2 shadow-sm",
|
|
110
|
-
children: /* @__PURE__ */ jsx(FaAngleDown, {})
|
|
111
|
-
}
|
|
112
|
-
)
|
|
113
|
-
] })
|
|
114
|
-
] }),
|
|
115
|
-
/* @__PURE__ */ jsxs("div", { className: "w-full", children: [
|
|
116
|
-
/* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center", children: [
|
|
117
|
-
/* @__PURE__ */ jsx("div", { className: "flex-grow", "data-testid": testId, children }),
|
|
118
|
-
!hideButtons.includes("remove") && !hideButtons.includes("all") && (lastNotDeletable && fields.length === 1 ? null : /* @__PURE__ */ jsx(Button, { onClick: () => remove(index), className: "ml-1", children: /* @__PURE__ */ jsx(
|
|
119
|
-
"svg",
|
|
120
|
-
{
|
|
121
|
-
className: "h-4 w-4",
|
|
122
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
123
|
-
viewBox: "0 0 20 20",
|
|
124
|
-
fill: "currentColor",
|
|
125
|
-
"aria-hidden": "true",
|
|
126
|
-
children: /* @__PURE__ */ jsx(
|
|
127
|
-
"path",
|
|
128
|
-
{
|
|
129
|
-
fillRule: "evenodd",
|
|
130
|
-
d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
|
|
131
|
-
clipRule: "evenodd"
|
|
132
|
-
}
|
|
133
|
-
)
|
|
134
|
-
}
|
|
135
|
-
) }))
|
|
136
|
-
] }),
|
|
137
|
-
!hideButtons.includes("insert") && !hideButtons.includes("all") && index !== fields.length - 1 ? /* @__PURE__ */ jsx(
|
|
138
|
-
Button,
|
|
139
|
-
{
|
|
140
|
-
className: "text-xs font-medium",
|
|
141
|
-
testId: `add-harbor-button-${index}`,
|
|
142
|
-
onClick: () => {
|
|
143
|
-
insert(index + 1, {});
|
|
144
|
-
},
|
|
145
|
-
children: "insert"
|
|
146
|
-
}
|
|
147
|
-
) : null
|
|
148
|
-
] }, `rest-${field.id}`)
|
|
149
|
-
]
|
|
150
|
-
}
|
|
151
|
-
),
|
|
152
|
-
error && typeof error[index] !== "undefined" && // // @ts-expect-error rhf incompatibility
|
|
153
|
-
// error[Number(index)]?._errors && ( // TODO: was String(). Check if Number is correct. (same below in FieldValidationError)
|
|
154
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
155
|
-
/* @__PURE__ */ jsx("div", { ...getHelperWrapperProps(), children: /* @__PURE__ */ jsx("div", { ...getErrorMessageProps(), children: /* @__PURE__ */ jsx(
|
|
156
|
-
FieldValidationError_default,
|
|
157
|
-
{
|
|
158
|
-
error: error[Number(index)]?._errors
|
|
159
|
-
}
|
|
160
|
-
) }) })
|
|
161
|
-
] });
|
|
162
|
-
};
|
|
163
|
-
var FieldArrayField_default = FieldArrayField;
|
|
164
|
-
|
|
165
|
-
// src/FieldArray/FieldArray.tsx
|
|
166
|
-
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
167
|
-
var FieldArray = ({
|
|
168
|
-
children,
|
|
169
|
-
elementInitialValue = void 0,
|
|
170
|
-
hideButtons = [],
|
|
171
|
-
label: _label = void 0,
|
|
172
|
-
lastElementNotDeletable = true,
|
|
173
|
-
name,
|
|
174
|
-
testId: _testId = void 0,
|
|
175
|
-
moveField = ["button"]
|
|
176
|
-
}) => {
|
|
177
|
-
const {
|
|
178
|
-
control,
|
|
179
|
-
debugMode,
|
|
180
|
-
getValues,
|
|
181
|
-
getFieldState,
|
|
182
|
-
trigger
|
|
183
|
-
// watch
|
|
184
|
-
} = useFormContext();
|
|
185
|
-
const { fields, append, remove, insert, move } = useFieldArray({
|
|
186
|
-
control,
|
|
187
|
-
name
|
|
188
|
-
});
|
|
189
|
-
const { error, testId, invalid, required } = getFieldState(name, _testId);
|
|
190
|
-
const { label, getLabelProps, getHelperWrapperProps, getErrorMessageProps } = useInput2({
|
|
191
|
-
isInvalid: invalid,
|
|
192
|
-
isRequired: required,
|
|
193
|
-
errorMessage: JSON.stringify(error),
|
|
194
|
-
label: _label,
|
|
195
|
-
labelPlacement: "inside",
|
|
196
|
-
placeholder: " ",
|
|
197
|
-
classNames: { helperWrapper: "block" }
|
|
198
|
-
});
|
|
199
|
-
if (lastElementNotDeletable && fields.length === 0) {
|
|
200
|
-
append(elementInitialValue);
|
|
201
|
-
}
|
|
202
|
-
const sensors = useSensors(
|
|
203
|
-
useSensor(PointerSensor),
|
|
204
|
-
useSensor(KeyboardSensor)
|
|
205
|
-
);
|
|
206
|
-
const handleDragEnd = (event) => {
|
|
207
|
-
const { active, over } = event;
|
|
208
|
-
if (active.id !== over?.id) {
|
|
209
|
-
const oldIndex = fields.findIndex((field) => field.id === active.id);
|
|
210
|
-
const newIndex = fields.findIndex((field) => field.id === over?.id);
|
|
211
|
-
move(oldIndex, newIndex);
|
|
212
|
-
}
|
|
213
|
-
};
|
|
214
|
-
const showTestIdCopyButton = debugMode === "debug-testids";
|
|
215
|
-
const showLabel = label || showTestIdCopyButton;
|
|
216
|
-
return /* @__PURE__ */ jsx2(
|
|
217
|
-
DndContext,
|
|
218
|
-
{
|
|
219
|
-
sensors,
|
|
220
|
-
collisionDetection: closestCenter,
|
|
221
|
-
onDragEnd: handleDragEnd,
|
|
222
|
-
modifiers: [restrictToVerticalAxis, restrictToWindowEdges],
|
|
223
|
-
children: /* @__PURE__ */ jsx2(
|
|
224
|
-
SortableContext,
|
|
225
|
-
{
|
|
226
|
-
items: fields.map((field) => field.id),
|
|
227
|
-
strategy: verticalListSortingStrategy,
|
|
228
|
-
children: /* @__PURE__ */ jsxs2("ul", { "data-testid": testId, onBlur: () => trigger(`${name}`), children: [
|
|
229
|
-
showLabel && // eslint-disable-next-line jsx-a11y/label-has-associated-control
|
|
230
|
-
/* @__PURE__ */ jsx2(
|
|
231
|
-
"label",
|
|
232
|
-
{
|
|
233
|
-
...getLabelProps(),
|
|
234
|
-
className: `${getLabelProps().className} !pointer-events-auto !static !z-0 -mb-1 ml-1 !inline-block`,
|
|
235
|
-
children: label
|
|
236
|
-
}
|
|
237
|
-
),
|
|
238
|
-
showTestIdCopyButton && /* @__PURE__ */ jsx2(FieldCopyTestIdButton_default, { testId }),
|
|
239
|
-
fields.map((field, index) => {
|
|
240
|
-
const duplicate = (i) => {
|
|
241
|
-
const values = getValues(name);
|
|
242
|
-
insert(i + 1, { ...values[i], id: null });
|
|
243
|
-
};
|
|
244
|
-
return /* @__PURE__ */ jsx2(
|
|
245
|
-
FieldArrayField_default,
|
|
246
|
-
{
|
|
247
|
-
className: "mb-3 mt-5 flex flex-row items-center",
|
|
248
|
-
field,
|
|
249
|
-
fields,
|
|
250
|
-
hideButtons,
|
|
251
|
-
id: field.id,
|
|
252
|
-
index,
|
|
253
|
-
insert,
|
|
254
|
-
lastNotDeletable: lastElementNotDeletable,
|
|
255
|
-
move,
|
|
256
|
-
moveField,
|
|
257
|
-
name,
|
|
258
|
-
remove,
|
|
259
|
-
testId: `${testId}_${index}`,
|
|
260
|
-
children: children({
|
|
261
|
-
duplicate,
|
|
262
|
-
index,
|
|
263
|
-
insert,
|
|
264
|
-
length: fields.length,
|
|
265
|
-
move,
|
|
266
|
-
name: `${name}.${index}`,
|
|
267
|
-
remove
|
|
268
|
-
})
|
|
269
|
-
},
|
|
270
|
-
field.id
|
|
271
|
-
);
|
|
272
|
-
}),
|
|
273
|
-
!hideButtons.includes("add") && !hideButtons.includes("all") && /* @__PURE__ */ jsx2(
|
|
274
|
-
Button2,
|
|
275
|
-
{
|
|
276
|
-
testId: `${testId}_append`,
|
|
277
|
-
size: "sm",
|
|
278
|
-
onClick: () => append(elementInitialValue),
|
|
279
|
-
children: "Add"
|
|
280
|
-
}
|
|
281
|
-
),
|
|
282
|
-
error?._errors && // eslint-disable-next-line react/jsx-props-no-spreading
|
|
283
|
-
/* @__PURE__ */ jsx2("div", { ...getHelperWrapperProps(), children: /* @__PURE__ */ jsx2("div", { ...getErrorMessageProps(), children: /* @__PURE__ */ jsx2(FieldValidationError_default, { error: error?._errors }) }) })
|
|
284
|
-
] })
|
|
285
|
-
}
|
|
286
|
-
)
|
|
287
|
-
}
|
|
288
|
-
);
|
|
289
|
-
};
|
|
290
|
-
var FieldArray_default = FieldArray;
|
|
291
|
-
|
|
292
|
-
// src/FieldArray/index.ts
|
|
293
|
-
var FieldArray_default2 = FieldArray_default;
|
|
294
|
-
|
|
295
|
-
export {
|
|
296
|
-
FieldArray_default,
|
|
297
|
-
FieldArray_default2
|
|
298
|
-
};
|
|
299
|
-
//# sourceMappingURL=chunk-Y53IHK6B.js.map
|