@fuf-stack/uniform 0.8.2 → 0.8.4
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 +3 -3
- package/dist/CheckboxGroup/index.js +2 -2
- package/dist/FieldArray/index.cjs +3 -3
- package/dist/FieldArray/index.js +2 -2
- package/dist/Form/index.cjs +3 -3
- package/dist/Form/index.js +2 -2
- package/dist/Input/index.cjs +3 -3
- package/dist/Input/index.js +2 -2
- package/dist/RadioGroup/index.cjs +3 -3
- package/dist/RadioGroup/index.js +2 -2
- package/dist/Select/index.cjs +3 -3
- package/dist/Select/index.js +2 -2
- package/dist/SubmitButton/index.cjs +3 -3
- package/dist/SubmitButton/index.js +2 -2
- package/dist/Switch/index.cjs +3 -3
- package/dist/Switch/index.js +2 -2
- package/dist/TextArea/index.cjs +3 -3
- package/dist/TextArea/index.js +2 -2
- package/dist/{chunk-6SBXKABS.js → chunk-4GVPJYZW.js} +2 -2
- package/dist/{chunk-62BDESS6.js → chunk-5JL3CSIG.js} +2 -2
- package/dist/{chunk-P65LPFQR.js → chunk-B66Y2VRJ.js} +2 -2
- package/dist/{chunk-PY4BNTSG.cjs → chunk-DDFRDNJI.cjs} +3 -3
- package/dist/{chunk-PY4BNTSG.cjs.map → chunk-DDFRDNJI.cjs.map} +1 -1
- package/dist/{chunk-ZJSZH2M6.js → chunk-DF77NLWL.js} +2 -2
- package/dist/{chunk-7SECN274.cjs → chunk-FN3CIRK3.cjs} +3 -3
- package/dist/{chunk-7SECN274.cjs.map → chunk-FN3CIRK3.cjs.map} +1 -1
- package/dist/{chunk-7LPWP66H.js → chunk-HWDQZO7X.js} +5 -5
- package/dist/chunk-HWDQZO7X.js.map +1 -0
- package/dist/{chunk-TTR4MHYS.js → chunk-HXQGV5OE.js} +2 -2
- package/dist/{chunk-75DRYT5H.cjs → chunk-KTJKGBIZ.cjs} +4 -4
- package/dist/{chunk-75DRYT5H.cjs.map → chunk-KTJKGBIZ.cjs.map} +1 -1
- package/dist/{chunk-3IRZN73M.cjs → chunk-LDCRR7FP.cjs} +4 -4
- package/dist/chunk-LDCRR7FP.cjs.map +1 -0
- package/dist/{chunk-WS7CCWFF.cjs → chunk-MKM7ZYRN.cjs} +3 -3
- package/dist/{chunk-WS7CCWFF.cjs.map → chunk-MKM7ZYRN.cjs.map} +1 -1
- package/dist/{chunk-I33DLA2M.js → chunk-NBJOPQRL.js} +2 -2
- package/dist/{chunk-VZ2HCN6I.cjs → chunk-P64DHQUM.cjs} +3 -3
- package/dist/{chunk-VZ2HCN6I.cjs.map → chunk-P64DHQUM.cjs.map} +1 -1
- package/dist/{chunk-PQYNCJQH.js → chunk-PCDWLXBW.js} +2 -2
- package/dist/{chunk-AAPGNWMO.js → chunk-QBBA5D74.js} +2 -2
- package/dist/{chunk-TLTHAEG6.cjs → chunk-QYZV7ZUY.cjs} +4 -4
- package/dist/{chunk-TLTHAEG6.cjs.map → chunk-QYZV7ZUY.cjs.map} +1 -1
- package/dist/{chunk-UQZQHW2Z.js → chunk-UHFP4AL2.js} +2 -2
- package/dist/{chunk-K3YZUYTX.cjs → chunk-VRHQDF4R.cjs} +3 -3
- package/dist/{chunk-K3YZUYTX.cjs.map → chunk-VRHQDF4R.cjs.map} +1 -1
- package/dist/{chunk-GZ6L6KQK.cjs → chunk-VRW5DWWE.cjs} +3 -3
- package/dist/{chunk-GZ6L6KQK.cjs.map → chunk-VRW5DWWE.cjs.map} +1 -1
- package/dist/{chunk-PCR7IVZT.cjs → chunk-ZOEG3CQL.cjs} +3 -3
- package/dist/{chunk-PCR7IVZT.cjs.map → chunk-ZOEG3CQL.cjs.map} +1 -1
- package/dist/hooks/index.cjs +2 -2
- package/dist/hooks/index.js +1 -1
- package/dist/index.cjs +12 -12
- package/dist/index.js +12 -12
- package/package.json +5 -5
- package/dist/chunk-3IRZN73M.cjs.map +0 -1
- package/dist/chunk-7LPWP66H.js.map +0 -1
- /package/dist/{chunk-6SBXKABS.js.map → chunk-4GVPJYZW.js.map} +0 -0
- /package/dist/{chunk-62BDESS6.js.map → chunk-5JL3CSIG.js.map} +0 -0
- /package/dist/{chunk-P65LPFQR.js.map → chunk-B66Y2VRJ.js.map} +0 -0
- /package/dist/{chunk-ZJSZH2M6.js.map → chunk-DF77NLWL.js.map} +0 -0
- /package/dist/{chunk-TTR4MHYS.js.map → chunk-HXQGV5OE.js.map} +0 -0
- /package/dist/{chunk-I33DLA2M.js.map → chunk-NBJOPQRL.js.map} +0 -0
- /package/dist/{chunk-PQYNCJQH.js.map → chunk-PCDWLXBW.js.map} +0 -0
- /package/dist/{chunk-AAPGNWMO.js.map → chunk-QBBA5D74.js.map} +0 -0
- /package/dist/{chunk-UQZQHW2Z.js.map → chunk-UHFP4AL2.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-75DRYT5H.cjs","../src/FieldArray/FieldArray.tsx","../src/FieldArray/FieldArrayField.tsx","../src/FieldArray/index.ts"],"names":["jsx","Button"],"mappings":"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","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-75DRYT5H.cjs","sourcesContent":[null,"import type { DragEndEvent } from '@dnd-kit/core';\nimport type {\n FieldValues,\n UseFieldArrayInsert,\n UseFieldArrayMove,\n UseFieldArrayRemove,\n} from 'react-hook-form';\n\nimport { useEffect } from 'react';\nimport { useFieldArray } from 'react-hook-form';\n\nimport {\n closestCenter,\n DndContext,\n KeyboardSensor,\n PointerSensor,\n useSensor,\n useSensors,\n} from '@dnd-kit/core';\nimport {\n restrictToVerticalAxis,\n restrictToWindowEdges,\n} from '@dnd-kit/modifiers';\nimport {\n SortableContext,\n verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\nimport { useInput } from '@nextui-org/input';\n\nimport { Button } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\nimport FieldArrayField from './FieldArrayField';\n\nexport type FieldArrayHideOption = 'add' | 'remove' | 'move' | 'insert' | 'all';\nexport type FieldArrayFieldChildren = (\n name: string,\n index: number,\n length: number,\n move: UseFieldArrayMove,\n insert: UseFieldArrayInsert<FieldValues, string>,\n remove: UseFieldArrayRemove,\n duplicate: (i: number) => void,\n) => JSX.Element;\n\nexport type MoveField = 'drag-drop' | 'button';\n\nexport interface FieldArrayProps {\n /** function that renders the children with provided Properties. */\n children: FieldArrayFieldChildren;\n /** Hide a set of buttons. */\n hideButtons?: FieldArrayHideOption[];\n /** label of the FieldArray. */\n label?: React.ReactNode;\n /** stops user from deleting all items. */\n lastNotDeletable?: boolean;\n /** name the FieldArray is registered in RHF */\n name: string;\n /** ID for test purposes. */\n testId?: string;\n /* how the fields can be moved */\n moveField: MoveField[];\n}\n\n/**\n * FieldArray component using react-hook-form\n */\nconst FieldArray = ({\n children,\n hideButtons = [],\n label: _label = undefined,\n lastNotDeletable = true,\n name,\n testId: _testId = undefined,\n moveField = ['button'],\n}: FieldArrayProps) => {\n const { control, getValues, getFieldState, register, trigger, watch } =\n useFormContext();\n\n const { fields, append, remove, insert, move } = useFieldArray({\n control,\n name,\n });\n\n const { error, testId, invalid, required } = getFieldState(name, _testId);\n\n register(`${name}._errors`);\n\n const formValues = watch();\n\n useEffect(() => {\n trigger(`${name}._errors`);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [JSON.stringify(formValues)]);\n\n // TODO: what about input props?\n const { label, getLabelProps, getHelperWrapperProps, getErrorMessageProps } =\n useInput({\n isInvalid: invalid,\n isRequired: required,\n errorMessage: JSON.stringify(error),\n label: _label,\n labelPlacement: 'inside',\n placeholder: ' ',\n classNames: { helperWrapper: 'block' },\n });\n\n if (lastNotDeletable && fields.length === 0) {\n append({});\n }\n\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor),\n );\n\n const handleDragEnd = (event: DragEndEvent) => {\n const { active, over } = event;\n\n if (active.id !== over?.id) {\n const oldIndex = fields.findIndex((field) => field.id === active.id);\n const newIndex = fields.findIndex((field) => field.id === over?.id);\n move(oldIndex, newIndex);\n }\n };\n return (\n <DndContext\n sensors={sensors}\n collisionDetection={closestCenter}\n onDragEnd={handleDragEnd}\n modifiers={[restrictToVerticalAxis, restrictToWindowEdges]}\n >\n <SortableContext\n items={fields.map((field) => field.id)}\n strategy={verticalListSortingStrategy}\n >\n <ul data-testid={testId}>\n {label && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...getLabelProps()}\n className={`${getLabelProps().className} !pointer-events-auto !static !z-0 -mb-1 ml-1 !inline-block`}\n >\n {label}\n </label>\n )}\n <FieldCopyTestIdButton testId={testId} />\n\n {fields.map((field, index) => {\n const duplicate = (i: number) => {\n const values = getValues(name);\n insert(i + 1, { ...values[i], id: null });\n };\n\n return (\n <FieldArrayField\n id={field.id}\n key={field.id}\n testId={`${testId}_${index}`}\n className=\"mb-3 mt-5 flex flex-row items-center\"\n field={field}\n fields={fields}\n hideButtons={hideButtons}\n index={index}\n insert={insert}\n lastNotDeletable={lastNotDeletable}\n move={move}\n moveField={moveField}\n name={name}\n remove={remove}\n >\n {children(\n `${name}[${index}]`,\n index,\n fields.length,\n move,\n insert,\n remove,\n duplicate,\n )}\n </FieldArrayField>\n );\n })}\n\n {!hideButtons.includes('add') && !hideButtons.includes('all') && (\n <Button\n testId={`${testId}_append`}\n size=\"sm\"\n onClick={() => append({})}\n >\n Add\n </Button>\n )}\n {/* @ts-expect-error rhf incompatibility */}\n {error?._errors && (\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 {/* @ts-expect-error rhf incompatibility */}\n <FieldValidationError error={error?._errors} />\n </div>\n </div>\n )}\n </ul>\n </SortableContext>\n </DndContext>\n );\n};\n\nexport default FieldArray;\n","import type {\n FieldValues,\n UseFieldArrayInsert,\n UseFieldArrayMove,\n UseFieldArrayRemove,\n} from 'react-hook-form';\nimport type { FieldArrayHideOption, MoveField } from './FieldArray';\n\nimport { useEffect } from 'react';\nimport { FaAngleDown, FaAngleUp, FaGripLines } from 'react-icons/fa';\n\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { useInput } from '@nextui-org/input';\n\nimport { Button } from '@fuf-stack/pixels';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\ninterface FieldArrayFieldProps {\n children: React.ReactNode;\n className?: string;\n field: Record<'id', string>;\n fields: Record<'id', string>[];\n hideButtons?: FieldArrayHideOption[];\n id: string | number;\n index: number;\n insert: UseFieldArrayInsert<FieldValues, string>;\n lastNotDeletable?: boolean;\n move: UseFieldArrayMove;\n moveField: MoveField[];\n testId?: string;\n name: string;\n remove: UseFieldArrayRemove;\n}\n\n/**\n * FieldArrayField component using react-hook-form\n */\nconst FieldArrayField = ({\n children,\n className = undefined,\n field,\n fields,\n hideButtons = [],\n id,\n index,\n insert,\n lastNotDeletable = true,\n move,\n moveField,\n name,\n remove,\n testId = undefined,\n}: FieldArrayFieldProps) => {\n const { attributes, listeners, setNodeRef, transform, transition } =\n useSortable({ id });\n\n const style = {\n transform: CSS.Translate.toString(transform),\n transition,\n };\n\n const { getFieldState, register, watch, trigger } = useFormContext();\n const { error, invalid } = getFieldState(`${name}`, undefined);\n\n // TODO: what about input props? and label props? Do we need a label?\n const { getHelperWrapperProps, getErrorMessageProps } = useInput({\n isInvalid: invalid,\n errorMessage: JSON.stringify(error),\n labelPlacement: 'inside',\n placeholder: ' ',\n classNames: { helperWrapper: 'block' },\n });\n\n // TODO: Check if this is a current issue: _error gets kicked out of the formValidation if no other errors exist. validationError exists, but the structure changes.\n register(`${name}.${index}._errors`);\n\n const formValues = watch();\n useEffect(() => {\n trigger(`${name}.${index}._errors`);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [JSON.stringify(formValues)]);\n\n return (\n <>\n <li ref={setNodeRef} style={style} className={className}>\n {/** Start Button up/down */}\n {!hideButtons.includes('move') && !hideButtons.includes('all') && (\n <div className=\"mr-6 flex flex-row items-center\">\n {moveField.includes('drag-drop') && (\n <div\n className=\"mr-2 text-base text-xl\"\n data-testid={slugify(`${name}_${index}_movebutton`)}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...attributes}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...listeners}\n >\n <FaGripLines />\n </div>\n )}\n {moveField.includes('button') && (\n <div className=\"flex flex-col\">\n <Button\n testId={`${name}.${index}.up`}\n disabled={index === 0}\n onClick={() => move(index, index - 1)}\n className=\"flex rounded-b-none rounded-t-md border border-gray-300 px-2 py-2 shadow-sm\"\n >\n <FaAngleUp />\n </Button>\n <Button\n testId={`${name}.${index}.down`}\n disabled={index === fields.length - 1}\n onClick={() => move(index, index + 1)}\n className=\"flex rounded-b-md rounded-t-none border border-gray-300 px-2 py-2 shadow-sm\"\n >\n <FaAngleDown />\n </Button>\n </div>\n )}\n </div>\n )}\n {/** End Button up/down */}\n <div key={`rest-${field.id}`} className=\"w-full\">\n <div className=\"mb-2 flex items-center\">\n {/** RENDER CHILDREN */}\n <div className=\"flex-grow\" data-testid={testId}>\n {children}\n </div>\n {!hideButtons.includes('remove') &&\n !hideButtons.includes('all') &&\n (lastNotDeletable && fields.length === 1 ? null : (\n <Button onClick={() => remove(index)} className=\"ml-1\">\n <svg\n className=\"h-4 w-4\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path\n fillRule=\"evenodd\"\n 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\"\n clipRule=\"evenodd\"\n />\n </svg>\n </Button>\n ))}\n </div>\n\n {!hideButtons.includes('insert') &&\n !hideButtons.includes('all') &&\n index !== fields.length - 1 ? (\n <Button\n className=\"text-xs font-medium\"\n testId={`add-harbor-button-${index}`}\n onClick={() => {\n insert(index + 1, {});\n }}\n >\n insert\n </Button>\n ) : null}\n </div>\n </li>\n {error &&\n typeof error[index] !== 'undefined' &&\n // @ts-expect-error rhf incompatibility\n error[Number(index)]?._errors && ( // TODO: was String(). Check if Number is correct. (same below in FieldValidationError)\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 {/* @ts-expect-error rhf incompatibility */}\n <FieldValidationError error={error[Number(index)]?._errors} />\n </div>\n </div>\n )}\n </>\n );\n};\nexport default FieldArrayField;\n","import FieldArray from './FieldArray';\n\nexport type {\n FieldArrayProps,\n FieldArrayHideOption,\n FieldArrayFieldChildren,\n} from './FieldArray';\n\nexport { FieldArray };\n\nexport default FieldArray;\n"]}
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-KTJKGBIZ.cjs","../src/FieldArray/FieldArray.tsx","../src/FieldArray/FieldArrayField.tsx","../src/FieldArray/index.ts"],"names":["jsx","Button"],"mappings":"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","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-KTJKGBIZ.cjs","sourcesContent":[null,"import type { DragEndEvent } from '@dnd-kit/core';\nimport type {\n FieldValues,\n UseFieldArrayInsert,\n UseFieldArrayMove,\n UseFieldArrayRemove,\n} from 'react-hook-form';\n\nimport { useEffect } from 'react';\nimport { useFieldArray } from 'react-hook-form';\n\nimport {\n closestCenter,\n DndContext,\n KeyboardSensor,\n PointerSensor,\n useSensor,\n useSensors,\n} from '@dnd-kit/core';\nimport {\n restrictToVerticalAxis,\n restrictToWindowEdges,\n} from '@dnd-kit/modifiers';\nimport {\n SortableContext,\n verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\nimport { useInput } from '@nextui-org/input';\n\nimport { Button } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\nimport FieldArrayField from './FieldArrayField';\n\nexport type FieldArrayHideOption = 'add' | 'remove' | 'move' | 'insert' | 'all';\nexport type FieldArrayFieldChildren = (\n name: string,\n index: number,\n length: number,\n move: UseFieldArrayMove,\n insert: UseFieldArrayInsert<FieldValues, string>,\n remove: UseFieldArrayRemove,\n duplicate: (i: number) => void,\n) => JSX.Element;\n\nexport type MoveField = 'drag-drop' | 'button';\n\nexport interface FieldArrayProps {\n /** function that renders the children with provided Properties. */\n children: FieldArrayFieldChildren;\n /** Hide a set of buttons. */\n hideButtons?: FieldArrayHideOption[];\n /** label of the FieldArray. */\n label?: React.ReactNode;\n /** stops user from deleting all items. */\n lastNotDeletable?: boolean;\n /** name the FieldArray is registered in RHF */\n name: string;\n /** ID for test purposes. */\n testId?: string;\n /* how the fields can be moved */\n moveField: MoveField[];\n}\n\n/**\n * FieldArray component using react-hook-form\n */\nconst FieldArray = ({\n children,\n hideButtons = [],\n label: _label = undefined,\n lastNotDeletable = true,\n name,\n testId: _testId = undefined,\n moveField = ['button'],\n}: FieldArrayProps) => {\n const { control, getValues, getFieldState, register, trigger, watch } =\n useFormContext();\n\n const { fields, append, remove, insert, move } = useFieldArray({\n control,\n name,\n });\n\n const { error, testId, invalid, required } = getFieldState(name, _testId);\n\n register(`${name}._errors`);\n\n const formValues = watch();\n\n useEffect(() => {\n trigger(`${name}._errors`);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [JSON.stringify(formValues)]);\n\n // TODO: what about input props?\n const { label, getLabelProps, getHelperWrapperProps, getErrorMessageProps } =\n useInput({\n isInvalid: invalid,\n isRequired: required,\n errorMessage: JSON.stringify(error),\n label: _label,\n labelPlacement: 'inside',\n placeholder: ' ',\n classNames: { helperWrapper: 'block' },\n });\n\n if (lastNotDeletable && fields.length === 0) {\n append({});\n }\n\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor),\n );\n\n const handleDragEnd = (event: DragEndEvent) => {\n const { active, over } = event;\n\n if (active.id !== over?.id) {\n const oldIndex = fields.findIndex((field) => field.id === active.id);\n const newIndex = fields.findIndex((field) => field.id === over?.id);\n move(oldIndex, newIndex);\n }\n };\n return (\n <DndContext\n sensors={sensors}\n collisionDetection={closestCenter}\n onDragEnd={handleDragEnd}\n modifiers={[restrictToVerticalAxis, restrictToWindowEdges]}\n >\n <SortableContext\n items={fields.map((field) => field.id)}\n strategy={verticalListSortingStrategy}\n >\n <ul data-testid={testId}>\n {label && (\n // eslint-disable-next-line jsx-a11y/label-has-associated-control\n <label\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...getLabelProps()}\n className={`${getLabelProps().className} !pointer-events-auto !static !z-0 -mb-1 ml-1 !inline-block`}\n >\n {label}\n </label>\n )}\n <FieldCopyTestIdButton testId={testId} />\n\n {fields.map((field, index) => {\n const duplicate = (i: number) => {\n const values = getValues(name);\n insert(i + 1, { ...values[i], id: null });\n };\n\n return (\n <FieldArrayField\n id={field.id}\n key={field.id}\n testId={`${testId}_${index}`}\n className=\"mb-3 mt-5 flex flex-row items-center\"\n field={field}\n fields={fields}\n hideButtons={hideButtons}\n index={index}\n insert={insert}\n lastNotDeletable={lastNotDeletable}\n move={move}\n moveField={moveField}\n name={name}\n remove={remove}\n >\n {children(\n `${name}[${index}]`,\n index,\n fields.length,\n move,\n insert,\n remove,\n duplicate,\n )}\n </FieldArrayField>\n );\n })}\n\n {!hideButtons.includes('add') && !hideButtons.includes('all') && (\n <Button\n testId={`${testId}_append`}\n size=\"sm\"\n onClick={() => append({})}\n >\n Add\n </Button>\n )}\n {/* @ts-expect-error rhf incompatibility */}\n {error?._errors && (\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 {/* @ts-expect-error rhf incompatibility */}\n <FieldValidationError error={error?._errors} />\n </div>\n </div>\n )}\n </ul>\n </SortableContext>\n </DndContext>\n );\n};\n\nexport default FieldArray;\n","import type {\n FieldValues,\n UseFieldArrayInsert,\n UseFieldArrayMove,\n UseFieldArrayRemove,\n} from 'react-hook-form';\nimport type { FieldArrayHideOption, MoveField } from './FieldArray';\n\nimport { useEffect } from 'react';\nimport { FaAngleDown, FaAngleUp, FaGripLines } from 'react-icons/fa';\n\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { useInput } from '@nextui-org/input';\n\nimport { Button } from '@fuf-stack/pixels';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\ninterface FieldArrayFieldProps {\n children: React.ReactNode;\n className?: string;\n field: Record<'id', string>;\n fields: Record<'id', string>[];\n hideButtons?: FieldArrayHideOption[];\n id: string | number;\n index: number;\n insert: UseFieldArrayInsert<FieldValues, string>;\n lastNotDeletable?: boolean;\n move: UseFieldArrayMove;\n moveField: MoveField[];\n testId?: string;\n name: string;\n remove: UseFieldArrayRemove;\n}\n\n/**\n * FieldArrayField component using react-hook-form\n */\nconst FieldArrayField = ({\n children,\n className = undefined,\n field,\n fields,\n hideButtons = [],\n id,\n index,\n insert,\n lastNotDeletable = true,\n move,\n moveField,\n name,\n remove,\n testId = undefined,\n}: FieldArrayFieldProps) => {\n const { attributes, listeners, setNodeRef, transform, transition } =\n useSortable({ id });\n\n const style = {\n transform: CSS.Translate.toString(transform),\n transition,\n };\n\n const { getFieldState, register, watch, trigger } = useFormContext();\n const { error, invalid } = getFieldState(`${name}`, undefined);\n\n // TODO: what about input props? and label props? Do we need a label?\n const { getHelperWrapperProps, getErrorMessageProps } = useInput({\n isInvalid: invalid,\n errorMessage: JSON.stringify(error),\n labelPlacement: 'inside',\n placeholder: ' ',\n classNames: { helperWrapper: 'block' },\n });\n\n // TODO: Check if this is a current issue: _error gets kicked out of the formValidation if no other errors exist. validationError exists, but the structure changes.\n register(`${name}.${index}._errors`);\n\n const formValues = watch();\n useEffect(() => {\n trigger(`${name}.${index}._errors`);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [JSON.stringify(formValues)]);\n\n return (\n <>\n <li ref={setNodeRef} style={style} className={className}>\n {/** Start Button up/down */}\n {!hideButtons.includes('move') && !hideButtons.includes('all') && (\n <div className=\"mr-6 flex flex-row items-center\">\n {moveField.includes('drag-drop') && (\n <div\n className=\"mr-2 text-base text-xl\"\n data-testid={slugify(`${name}_${index}_movebutton`)}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...attributes}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...listeners}\n >\n <FaGripLines />\n </div>\n )}\n {moveField.includes('button') && (\n <div className=\"flex flex-col\">\n <Button\n testId={`${name}.${index}.up`}\n disabled={index === 0}\n onClick={() => move(index, index - 1)}\n className=\"flex rounded-b-none rounded-t-md border border-gray-300 px-2 py-2 shadow-sm\"\n >\n <FaAngleUp />\n </Button>\n <Button\n testId={`${name}.${index}.down`}\n disabled={index === fields.length - 1}\n onClick={() => move(index, index + 1)}\n className=\"flex rounded-b-md rounded-t-none border border-gray-300 px-2 py-2 shadow-sm\"\n >\n <FaAngleDown />\n </Button>\n </div>\n )}\n </div>\n )}\n {/** End Button up/down */}\n <div key={`rest-${field.id}`} className=\"w-full\">\n <div className=\"mb-2 flex items-center\">\n {/** RENDER CHILDREN */}\n <div className=\"flex-grow\" data-testid={testId}>\n {children}\n </div>\n {!hideButtons.includes('remove') &&\n !hideButtons.includes('all') &&\n (lastNotDeletable && fields.length === 1 ? null : (\n <Button onClick={() => remove(index)} className=\"ml-1\">\n <svg\n className=\"h-4 w-4\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 20 20\"\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path\n fillRule=\"evenodd\"\n 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\"\n clipRule=\"evenodd\"\n />\n </svg>\n </Button>\n ))}\n </div>\n\n {!hideButtons.includes('insert') &&\n !hideButtons.includes('all') &&\n index !== fields.length - 1 ? (\n <Button\n className=\"text-xs font-medium\"\n testId={`add-harbor-button-${index}`}\n onClick={() => {\n insert(index + 1, {});\n }}\n >\n insert\n </Button>\n ) : null}\n </div>\n </li>\n {error &&\n typeof error[index] !== 'undefined' &&\n // @ts-expect-error rhf incompatibility\n error[Number(index)]?._errors && ( // TODO: was String(). Check if Number is correct. (same below in FieldValidationError)\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 {/* @ts-expect-error rhf incompatibility */}\n <FieldValidationError error={error[Number(index)]?._errors} />\n </div>\n </div>\n )}\n </>\n );\n};\nexport default FieldArrayField;\n","import FieldArray from './FieldArray';\n\nexport type {\n FieldArrayProps,\n FieldArrayHideOption,\n FieldArrayFieldChildren,\n} from './FieldArray';\n\nexport { FieldArray };\n\nexport default FieldArray;\n"]}
|
|
@@ -28,11 +28,11 @@ var FormProvider = ({
|
|
|
28
28
|
validation = void 0,
|
|
29
29
|
validationTrigger
|
|
30
30
|
}) => {
|
|
31
|
-
const preventSubmit = _react.
|
|
31
|
+
const [preventSubmit, setPreventSubmit] = _react.useState.call(void 0, false);
|
|
32
32
|
const contextValue = _react.useMemo.call(void 0,
|
|
33
33
|
() => ({
|
|
34
34
|
preventSubmit: (prevent) => {
|
|
35
|
-
|
|
35
|
+
setPreventSubmit(prevent);
|
|
36
36
|
},
|
|
37
37
|
validation
|
|
38
38
|
}),
|
|
@@ -55,7 +55,7 @@ var FormProvider = ({
|
|
|
55
55
|
} : {}
|
|
56
56
|
});
|
|
57
57
|
const handleSubmit = async (e) => {
|
|
58
|
-
if (preventSubmit
|
|
58
|
+
if (methods.formState.isValid && preventSubmit) {
|
|
59
59
|
console.warn(
|
|
60
60
|
"[FormProvider] form submit was prevented because preventSubmit is true..."
|
|
61
61
|
);
|
|
@@ -134,4 +134,4 @@ var useFormContext = () => {
|
|
|
134
134
|
|
|
135
135
|
|
|
136
136
|
exports.FormContext_default = FormContext_default; exports.recursiveFieldKeySearch = recursiveFieldKeySearch; exports.useFormContext = useFormContext;
|
|
137
|
-
//# sourceMappingURL=chunk-
|
|
137
|
+
//# sourceMappingURL=chunk-LDCRR7FP.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-LDCRR7FP.cjs","../src/hooks/useFormContext/useFormContext.ts","../src/Form/subcomponents/FormContext.tsx"],"names":[],"mappings":"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","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-LDCRR7FP.cjs","sourcesContent":[null,"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 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 /** Function to update if the form can currently be submitted */\n preventSubmit: (prevent: boolean) => void;\n /** Optional Veto validation schema instance for form validation */\n validation?: VetoInstance;\n}>({\n preventSubmit: () => 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 /** 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 * - React Hook Form context\n */\nconst FormProvider: React.FC<FormProviderProps> = ({\n children,\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 // Memoize the context value to prevent re-renders\n const contextValue = useMemo(\n () => ({\n preventSubmit: (prevent: boolean) => {\n setPreventSubmit(prevent);\n },\n validation,\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [],\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);\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,6 +1,6 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true});
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunkLDCRR7FPcjs = require('./chunk-LDCRR7FP.cjs');
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
@@ -20,7 +20,7 @@ var SubmitButton = ({
|
|
|
20
20
|
}) => {
|
|
21
21
|
const {
|
|
22
22
|
formState: { isSubmitting, isValidating }
|
|
23
|
-
} =
|
|
23
|
+
} = _chunkLDCRR7FPcjs.useFormContext.call(void 0, );
|
|
24
24
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
25
25
|
_pixels.Button,
|
|
26
26
|
{
|
|
@@ -45,4 +45,4 @@ var SubmitButton_default2 = SubmitButton_default;
|
|
|
45
45
|
|
|
46
46
|
|
|
47
47
|
exports.SubmitButton_default = SubmitButton_default; exports.SubmitButton_default2 = SubmitButton_default2;
|
|
48
|
-
//# sourceMappingURL=chunk-
|
|
48
|
+
//# sourceMappingURL=chunk-MKM7ZYRN.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-MKM7ZYRN.cjs","../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACJA,oDAAmB;AACnB,2CAAuB;AAsCnB,+CAAA;AAbJ,IAAM,aAAA,EAAe,CAAC;AAAA,EACpB,SAAA,EAAW,QAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,MAAA,EAAQ,SAAA;AAAA,EACR,QAAA,EAAU,KAAA;AAAA,EACV,QAAA,EAAU,KAAA,CAAA;AAAA,EACV,KAAA,EAAO,IAAA;AAAA,EACP,OAAA,EAAS;AACX,CAAA,EAAA,GAAyB;AACvB,EAAA,MAAM;AAAA,IACJ,SAAA,EAAW,EAAE,YAAA,EAAc,aAAa;AAAA,EAC1C,EAAA,EAAI,8CAAA,CAAe;AACnB,EAAA,uBACE,6BAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,4BAAA,SAAY,CAAA;AAAA,MACvB,KAAA;AAAA,MACA,MAAA,EAAQ,uCAAA,MAAc,CAAA;AAAA,MACtB,QAAA,EAAU,aAAA,GAAgB,YAAA;AAAA,MAC1B,OAAA;AAAA,MACA,OAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA,EAAK,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACH,CAAA;AAEJ,CAAA;AAEA,IAAO,qBAAA,EAAQ,YAAA;ADlBf;AACA;AElCA,IAAOA,sBAAAA,EAAQ,oBAAA;AFoCf;AACA;AACE;AACA;AACF,2GAAC","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-MKM7ZYRN.cjs","sourcesContent":[null,"import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\n\nexport interface SubmitButtonProps {\n /** child components */\n children?: ReactNode;\n /** CSS class name */\n className?: string;\n /** color of the button */\n color?: ButtonProps['color'];\n /** If set loading animation is shown */\n loading?: boolean;\n /** function called when the button is pressed. */\n onClick?: ButtonProps['onClick'];\n /** size of the button */\n size?: ButtonProps['size'];\n /** HTML data-testid attribute used in e2e tests */\n testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n children = 'Submit',\n className = undefined,\n color = 'success',\n loading = false,\n onClick = undefined,\n size = 'md',\n testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n const {\n formState: { isSubmitting, isValidating },\n } = useFormContext();\n return (\n <Button\n className={cn(className)}\n color={color}\n testId={slugify(testId)}\n disabled={isSubmitting || isValidating}\n loading={loading}\n onClick={onClick}\n size={size}\n type=\"submit\"\n >\n {children}\n </Button>\n );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"]}
|
|
@@ -6,7 +6,7 @@ import {
|
|
|
6
6
|
} from "./chunk-T3CCNJHK.js";
|
|
7
7
|
import {
|
|
8
8
|
useFormContext
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-HWDQZO7X.js";
|
|
10
10
|
|
|
11
11
|
// src/TextArea/TextArea.tsx
|
|
12
12
|
import { Controller } from "react-hook-form";
|
|
@@ -73,4 +73,4 @@ export {
|
|
|
73
73
|
TextArea_default,
|
|
74
74
|
TextArea_default2
|
|
75
75
|
};
|
|
76
|
-
//# sourceMappingURL=chunk-
|
|
76
|
+
//# sourceMappingURL=chunk-NBJOPQRL.js.map
|
|
@@ -6,7 +6,7 @@ var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
|
6
6
|
var _chunkKMMS4G7Acjs = require('./chunk-KMMS4G7A.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkLDCRR7FPcjs = require('./chunk-LDCRR7FP.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 } = _chunkLDCRR7FPcjs.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-P64DHQUM.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-P64DHQUM.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-P64DHQUM.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"]}
|
|
@@ -6,7 +6,7 @@ import {
|
|
|
6
6
|
} from "./chunk-T3CCNJHK.js";
|
|
7
7
|
import {
|
|
8
8
|
useFormContext
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-HWDQZO7X.js";
|
|
10
10
|
|
|
11
11
|
// src/Input/Input.tsx
|
|
12
12
|
import { Controller } from "react-hook-form";
|
|
@@ -78,4 +78,4 @@ export {
|
|
|
78
78
|
Input_default,
|
|
79
79
|
Input_default2
|
|
80
80
|
};
|
|
81
|
-
//# sourceMappingURL=chunk-
|
|
81
|
+
//# sourceMappingURL=chunk-PCDWLXBW.js.map
|
|
@@ -6,7 +6,7 @@ import {
|
|
|
6
6
|
} from "./chunk-T3CCNJHK.js";
|
|
7
7
|
import {
|
|
8
8
|
useFormContext
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-HWDQZO7X.js";
|
|
10
10
|
import {
|
|
11
11
|
slugify
|
|
12
12
|
} from "./chunk-V46BHM2U.js";
|
|
@@ -202,4 +202,4 @@ export {
|
|
|
202
202
|
RadioGroup_default,
|
|
203
203
|
RadioGroup_default2
|
|
204
204
|
};
|
|
205
|
-
//# sourceMappingURL=chunk-
|
|
205
|
+
//# sourceMappingURL=chunk-QBBA5D74.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunkLDCRR7FPcjs = require('./chunk-LDCRR7FP.cjs');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
|
|
@@ -23,7 +23,7 @@ var FormDebugViewer = ({ className = void 0 }) => {
|
|
|
23
23
|
watch,
|
|
24
24
|
formState: { dirtyFields, isValid, isSubmitting },
|
|
25
25
|
validation
|
|
26
|
-
} =
|
|
26
|
+
} = _chunkLDCRR7FPcjs.useFormContext.call(void 0, );
|
|
27
27
|
const [debug, setDebug] = _pixels.useLocalStorage.call(void 0, LOCALSTORAGE_DEBUG_KEY, false);
|
|
28
28
|
const [copyTestId, setCopyTestId] = _pixels.useLocalStorage.call(void 0,
|
|
29
29
|
LOCALSTORAGE_COPY_TEST_ID_KEY,
|
|
@@ -114,7 +114,7 @@ var Form = ({
|
|
|
114
114
|
validationTrigger = "all"
|
|
115
115
|
}) => {
|
|
116
116
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
117
|
-
|
|
117
|
+
_chunkLDCRR7FPcjs.FormContext_default,
|
|
118
118
|
{
|
|
119
119
|
initialValues,
|
|
120
120
|
onSubmit,
|
|
@@ -145,4 +145,4 @@ var Form_default2 = Form_default;
|
|
|
145
145
|
|
|
146
146
|
|
|
147
147
|
exports.Form_default = Form_default; exports.Form_default2 = Form_default2;
|
|
148
|
-
//# sourceMappingURL=chunk-
|
|
148
|
+
//# sourceMappingURL=chunk-QYZV7ZUY.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-QYZV7ZUY.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-QYZV7ZUY.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"]}
|
|
@@ -6,7 +6,7 @@ import {
|
|
|
6
6
|
} from "./chunk-T3CCNJHK.js";
|
|
7
7
|
import {
|
|
8
8
|
useFormContext
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-HWDQZO7X.js";
|
|
10
10
|
import {
|
|
11
11
|
slugify
|
|
12
12
|
} from "./chunk-V46BHM2U.js";
|
|
@@ -284,4 +284,4 @@ export {
|
|
|
284
284
|
FieldArray_default,
|
|
285
285
|
FieldArray_default2
|
|
286
286
|
};
|
|
287
|
-
//# sourceMappingURL=chunk-
|
|
287
|
+
//# sourceMappingURL=chunk-UHFP4AL2.js.map
|
|
@@ -6,7 +6,7 @@ var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
|
6
6
|
var _chunkKMMS4G7Acjs = require('./chunk-KMMS4G7A.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkLDCRR7FPcjs = require('./chunk-LDCRR7FP.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 } = _chunkLDCRR7FPcjs.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-VRHQDF4R.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-K3YZUYTX.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-K3YZUYTX.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-VRHQDF4R.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-VRHQDF4R.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"]}
|
|
@@ -6,7 +6,7 @@ var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
|
6
6
|
var _chunkKMMS4G7Acjs = require('./chunk-KMMS4G7A.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkLDCRR7FPcjs = require('./chunk-LDCRR7FP.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 } = _chunkLDCRR7FPcjs.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-VRW5DWWE.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-GZ6L6KQK.cjs","../src/Select/Select.tsx","../src/Select/index.ts"],"names":["Select_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACRA,gDAA2B;AAC3B,qGAAwC;AAExC,4CAA0B;AAE1B,oDAAuB;AAiDd,+CAAA;AALT,IAAM,eAAA,EAA0C,CAAC,KAAA,EAAA,GAAU;AAGzD,EAAA,MAAM,OAAA,EAAS,CAAA,EAAA;AAER,EAAA;AACT;AAEM;AAGW,EAAA;AAEb,EAAA;AAKJ;AAEM;AAKW,EAAA;AAEb,EAAA;AAKJ;AAEa;AACJ,EAAA;AACL,IAAA;AAGE,IAAA;AACS,IAAA;AACE,IAAA;AACb,IAAA;AAEO,IAAA;AACO,IAAA;AACd,IAAA;AACA,IAAA;AACO,IAAA;AACP,IAAA;AACA,IAAA;AACM,IAAA;AACI,IAAA;AAAA;AAAA;AAGE,IAAA;AAEV,IAAA;AACF,IAAA;AACA,IAAA;AACA,IAAA;AAEA,IAAA;AAEQ,IAAA;AACK,IAAA;AACb,IAAA;AACa,IAAA;AACb,IAAA;AACF,EAAA;AACU,EAAA;AACC,IAAA;AACD,MAAA;AAEF,QAAA;AACJ,MAAA;AACF,IAAA;AACS,IAAA;AACD,MAAA;AAEF,QAAA;AACJ,MAAA;AACF,IAAA;AACA,IAAA;AACU,MAAA;AACV,IAAA;AACF,EAAA;AACD;AAGe;AACF,EAAA;AACA,EAAA;AACD,EAAA;AACI,EAAA;AACF,EAAA;AACG,EAAA;AACN,EAAA;AACI,EAAA;AACd,EAAA;AACgB,EAAA;AAChB,EAAA;AACc,EAAA;AACN,EAAA;AACS;AACT,EAAA;AACO,EAAA;AAET,EAAA;AACJ,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACY,EAAA;AACD,IAAA;AACA,IAAA;AACC,IAAA;AACA,IAAA;AACE,IAAA;AACP,IAAA;AACP,IAAA;AACW,IAAA;AACZ,EAAA;AAEK,EAAA;AACJ,IAAA;AACS,IAAA;AACT,IAAA;AACc,IAAA;AACd,IAAA;AACA,IAAA;AACO,IAAA;AACD,IAAA;AACM,IAAA;AACA,IAAA;AACZ,IAAA;AACA,IAAA;AACA,IAAA;AACQ,IAAA;AACK,IAAA;AACA,IAAA;AACb,IAAA;AACE,EAAA;AAGF,EAAA;AAAC,IAAA;AAAA,IAAA;AACC,MAAA;AACA,MAAA;AACS,MAAA;AAAA;AAEE,QAAA;AAET,MAAA;AAEI,QAAA;AAAC,UAAA;AAAA,UAAA;AACC,YAAA;AACA,YAAA;AAEC,YAAA;AAAA,cAAA;AACD,8BAAA;AAAuC,YAAA;AAAA,UAAA;AACzC,QAAA;AAEF,wBAAA;AAAC,UAAA;AAAA,UAAA;AACC,YAAA;AACA,YAAA;AAEA,YAAA;AAEI,YAAA;AAEF,cAAA;AACA,cAAA;AACF,YAAA;AACA,YAAA;AAGA,YAAA;AACE,cAAA;AAAsB;AAEpB,gBAAA;AACE,kBAAA;AACD,gBAAA;AAAA,cAAA;AACH,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AAEI,gBAAA;AACD,cAAA;AACH,cAAA;AACA,cAAA;AAEI,gBAAA;AACD,cAAA;AACH,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AAEI,gBAAA;AACA,gBAAA;AACD,cAAA;AACH,cAAA;AACA,cAAA;AACF,YAAA;AACA,YAAA;AACE,cAAA;AACA,cAAA;AACA,cAAA;AACF,YAAA;AACA,YAAA;AACA,YAAA;AACA,YAAA;AACA,YAAA;AACA,YAAA;AACA,YAAA;AACA,YAAA;AACA,YAAA;AACA,YAAA;AACA,YAAA;AACA,YAAA;AACM,cAAA;AACF,gBAAA;AAEA,gCAAA;AACE,kBAAA;AACD,gBAAA;AACD,gBAAA;AACF,cAAA;AAEE,gBAAA;AACF,cAAA;AACF,YAAA;AACA,YAAA;AAEA,YAAA;AAIA,YAAA;AACA,YAAA;AACA,YAAA;AACA,YAAA;AAAA,UAAA;AACF,QAAA;AACC,QAAA;AAEC,wBAAA;AAOJ,MAAA;AAAA,IAAA;AAEJ,EAAA;AAEJ;AAEO;ADtFW;AACA;AEjOXA;AFmOW;AACA;AACA;AACA;AACA","file":"/home/runner/work/uniform/uniform/packages/uniform/dist/chunk-GZ6L6KQK.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-VRW5DWWE.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-VRW5DWWE.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"]}
|
|
@@ -6,7 +6,7 @@ var _chunkQTL5FREEcjs = require('./chunk-QTL5FREE.cjs');
|
|
|
6
6
|
var _chunkKMMS4G7Acjs = require('./chunk-KMMS4G7A.cjs');
|
|
7
7
|
|
|
8
8
|
|
|
9
|
-
var
|
|
9
|
+
var _chunkLDCRR7FPcjs = require('./chunk-LDCRR7FP.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 } = _chunkLDCRR7FPcjs.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-ZOEG3CQL.cjs.map
|