@digigov/form 2.0.0-555d1027 → 2.0.0-599965f0
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/Field/FieldBaseContainer/index.js +36 -34
- package/Field/FieldBaseContainer.d.ts +1 -1
- package/Field/FieldBaseContainer.js.map +2 -2
- package/FieldArray/FormDialog/index.js +1 -3
- package/FieldArray/FormDialog.d.ts +1 -2
- package/FieldArray/FormDialog.js.map +2 -2
- package/FieldArray/index.js +20 -1
- package/FieldArray/index.js.map +2 -2
- package/cjs/Field/FieldBaseContainer/index.js +36 -34
- package/cjs/Field/FieldBaseContainer.js.map +2 -2
- package/cjs/FieldArray/FormDialog/index.js +1 -3
- package/cjs/FieldArray/FormDialog.js.map +2 -2
- package/cjs/FieldArray/index.js +19 -0
- package/cjs/FieldArray/index.js.map +2 -2
- package/cjs/validators/utils/date/index.js +6 -1
- package/cjs/validators/utils/date.js.map +2 -2
- package/cjs/validators/utils/datetime/index.js +6 -1
- package/cjs/validators/utils/datetime.js.map +2 -2
- package/index.js +1 -1
- package/package.json +4 -4
- package/src/Field/FieldBaseContainer.tsx +67 -58
- package/src/FieldArray/FormDialog.tsx +1 -4
- package/src/FieldArray/index.tsx +28 -1
- package/src/FormBuilder/scenarios.test.tsx +759 -1
- package/src/validators/utils/date.ts +6 -1
- package/src/validators/utils/datetime.ts +6 -1
- package/validators/utils/date/index.js +6 -1
- package/validators/utils/date.js.map +2 -2
- package/validators/utils/datetime/index.js +6 -1
- package/validators/utils/datetime.js.map +2 -2
|
@@ -7,41 +7,43 @@ import FieldsetLegend from "@digigov/react-core/FieldsetLegend";
|
|
|
7
7
|
import LabelContainer from "@digigov/react-core/LabelContainer";
|
|
8
8
|
import { useTranslation } from "@digigov/ui/i18n";
|
|
9
9
|
import { Hint } from "@digigov/ui/typography/Hint";
|
|
10
|
-
const FieldBaseContainer = (
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
}) => {
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
10
|
+
const FieldBaseContainer = React.forwardRef(
|
|
11
|
+
({
|
|
12
|
+
name,
|
|
13
|
+
wrapper,
|
|
14
|
+
label,
|
|
15
|
+
children,
|
|
16
|
+
error,
|
|
17
|
+
hasError,
|
|
18
|
+
layout,
|
|
19
|
+
controlled,
|
|
20
|
+
labelSize = "sm"
|
|
21
|
+
}, ref) => {
|
|
22
|
+
const { t } = useTranslation();
|
|
23
|
+
const errorMessage = error?.message.key ? error.message.key : error?.message || "";
|
|
24
|
+
const errorContext = error?.message.context || {};
|
|
25
|
+
if (wrapper === "fieldset") {
|
|
26
|
+
return /* @__PURE__ */ React.createElement(FieldContainer, { error: hasError, ...layout }, /* @__PURE__ */ React.createElement(
|
|
27
|
+
Fieldset,
|
|
28
|
+
{
|
|
29
|
+
ref,
|
|
30
|
+
className: "outline-none",
|
|
31
|
+
...controlled && {
|
|
32
|
+
tabIndex: -1
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
/* @__PURE__ */ React.createElement(FieldsetLegend, { size: labelSize }, label && label.primary),
|
|
36
|
+
label && label.secondary && /* @__PURE__ */ React.createElement(Hint, null, t(label.secondary)),
|
|
37
|
+
error && /* @__PURE__ */ React.createElement(ErrorMessage, { id: `${name}-error` }, t(errorMessage, errorContext)),
|
|
38
|
+
children,
|
|
39
|
+
label && label.hint && /* @__PURE__ */ React.createElement(Hint, { size: "sm" }, label.hint)
|
|
40
|
+
));
|
|
41
|
+
} else {
|
|
42
|
+
return /* @__PURE__ */ React.createElement(FieldContainer, { error: hasError, ...layout }, /* @__PURE__ */ React.createElement(LabelContainer, null, label && /* @__PURE__ */ React.createElement(Label, { label }), error && /* @__PURE__ */ React.createElement(ErrorMessage, { id: `${name}-error` }, t(errorMessage, errorContext)), children, label && label.hint && /* @__PURE__ */ React.createElement(Hint, { size: "sm" }, label.hint)));
|
|
43
|
+
}
|
|
43
44
|
}
|
|
44
|
-
|
|
45
|
+
);
|
|
46
|
+
FieldBaseContainer.displayName = "FieldBaseContainer";
|
|
45
47
|
var FieldBaseContainer_default = FieldBaseContainer;
|
|
46
48
|
export {
|
|
47
49
|
FieldBaseContainer,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FieldContainerProps } from '@digigov/form/Field/types';
|
|
3
|
-
export declare const FieldBaseContainer: React.
|
|
3
|
+
export declare const FieldBaseContainer: React.ForwardRefExoticComponent<FieldContainerProps & React.RefAttributes<HTMLFieldSetElement>>;
|
|
4
4
|
export default FieldBaseContainer;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Field/FieldBaseContainer.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { FieldContainerProps } from '@digigov/form/Field/types';\nimport Label from '@digigov/form/inputs/Label';\nimport { ErrorMessage } from '@digigov/react-core/ErrorMessage';\nimport FieldContainer from '@digigov/react-core/FieldContainer';\nimport Fieldset from '@digigov/react-core/Fieldset';\nimport FieldsetLegend from '@digigov/react-core/FieldsetLegend';\nimport LabelContainer from '@digigov/react-core/LabelContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nexport const FieldBaseContainer
|
|
5
|
-
"mappings": "AAAA,OAAO,
|
|
4
|
+
"sourcesContent": ["import React, { ComponentRef } from 'react';\nimport { FieldContainerProps } from '@digigov/form/Field/types';\nimport Label from '@digigov/form/inputs/Label';\nimport { ErrorMessage } from '@digigov/react-core/ErrorMessage';\nimport FieldContainer from '@digigov/react-core/FieldContainer';\nimport Fieldset from '@digigov/react-core/Fieldset';\nimport FieldsetLegend from '@digigov/react-core/FieldsetLegend';\nimport LabelContainer from '@digigov/react-core/LabelContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nexport const FieldBaseContainer = React.forwardRef<\n ComponentRef<typeof Fieldset>,\n FieldContainerProps\n>(\n (\n {\n name,\n wrapper,\n label,\n children,\n error,\n hasError,\n layout,\n controlled,\n labelSize = 'sm',\n },\n ref\n ) => {\n const { t } = useTranslation();\n const errorMessage = error?.message.key\n ? error.message.key\n : error?.message || '';\n const errorContext = error?.message.context || {};\n if (wrapper === 'fieldset') {\n return (\n <FieldContainer error={hasError} {...layout}>\n <Fieldset\n ref={ref}\n className=\"outline-none\"\n {...(controlled && {\n tabIndex: -1,\n })}\n >\n <FieldsetLegend size={labelSize}>\n {label && label.primary}\n </FieldsetLegend>\n {label && label.secondary && <Hint>{t(label.secondary)}</Hint>}\n {error && (\n <ErrorMessage id={`${name}-error`}>\n {t(errorMessage, errorContext)}\n </ErrorMessage>\n )}\n {children}\n {label && label.hint && <Hint size=\"sm\">{label.hint}</Hint>}\n </Fieldset>\n </FieldContainer>\n );\n } else {\n return (\n <FieldContainer error={hasError} {...layout}>\n <LabelContainer>\n {label && <Label label={label} />}\n {error && (\n <ErrorMessage id={`${name}-error`}>\n {t(errorMessage, errorContext)}\n </ErrorMessage>\n )}\n {children}\n {label && label.hint && <Hint size=\"sm\">{label.hint}</Hint>}\n </LabelContainer>\n </FieldContainer>\n );\n }\n }\n);\n\nFieldBaseContainer.displayName = 'FieldBaseContainer';\n\nexport default FieldBaseContainer;\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,WAA6B;AAEpC,OAAO,WAAW;AAClB,SAAS,oBAAoB;AAC7B,OAAO,oBAAoB;AAC3B,OAAO,cAAc;AACrB,OAAO,oBAAoB;AAC3B,OAAO,oBAAoB;AAC3B,SAAS,sBAAsB;AAC/B,SAAS,YAAY;AAEd,MAAM,qBAAqB,MAAM;AAAA,EAItC,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACd,GACA,QACG;AACH,UAAM,EAAE,EAAE,IAAI,eAAe;AAC7B,UAAM,eAAe,OAAO,QAAQ,MAChC,MAAM,QAAQ,MACd,OAAO,WAAW;AACtB,UAAM,eAAe,OAAO,QAAQ,WAAW,CAAC;AAChD,QAAI,YAAY,YAAY;AAC1B,aACE,oCAAC,kBAAe,OAAO,UAAW,GAAG,UACnC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,WAAU;AAAA,UACT,GAAI,cAAc;AAAA,YACjB,UAAU;AAAA,UACZ;AAAA;AAAA,QAEA,oCAAC,kBAAe,MAAM,aACnB,SAAS,MAAM,OAClB;AAAA,QACC,SAAS,MAAM,aAAa,oCAAC,YAAM,EAAE,MAAM,SAAS,CAAE;AAAA,QACtD,SACC,oCAAC,gBAAa,IAAI,GAAG,IAAI,YACtB,EAAE,cAAc,YAAY,CAC/B;AAAA,QAED;AAAA,QACA,SAAS,MAAM,QAAQ,oCAAC,QAAK,MAAK,QAAM,MAAM,IAAK;AAAA,MACtD,CACF;AAAA,IAEJ,OAAO;AACL,aACE,oCAAC,kBAAe,OAAO,UAAW,GAAG,UACnC,oCAAC,sBACE,SAAS,oCAAC,SAAM,OAAc,GAC9B,SACC,oCAAC,gBAAa,IAAI,GAAG,IAAI,YACtB,EAAE,cAAc,YAAY,CAC/B,GAED,UACA,SAAS,MAAM,QAAQ,oCAAC,QAAK,MAAK,QAAM,MAAM,IAAK,CACtD,CACF;AAAA,IAEJ;AAAA,EACF;AACF;AAEA,mBAAmB,cAAc;AAEjC,IAAO,6BAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -166,7 +166,6 @@ const FormDialog = React.forwardRef(
|
|
|
166
166
|
{
|
|
167
167
|
key: index,
|
|
168
168
|
name: `${name}.${index}`,
|
|
169
|
-
register,
|
|
170
169
|
index,
|
|
171
170
|
isFirst: index === 0,
|
|
172
171
|
isLast: index === values.length - 1,
|
|
@@ -302,7 +301,6 @@ const ArrayItemHeader = ({ labels, disabled }) => {
|
|
|
302
301
|
const ArrayItemDisplay = ({
|
|
303
302
|
name,
|
|
304
303
|
data,
|
|
305
|
-
register,
|
|
306
304
|
edit,
|
|
307
305
|
remove,
|
|
308
306
|
disabledEdit,
|
|
@@ -332,7 +330,7 @@ const ArrayItemDisplay = ({
|
|
|
332
330
|
delete data.id;
|
|
333
331
|
const values = typeof data === "string" ? [data] : Object.values(data || {});
|
|
334
332
|
const borderVariant = border === false || sortable ? "none" : "border";
|
|
335
|
-
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TableRow,
|
|
333
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TableRow, null, values?.map?.((value, valueIndex) => {
|
|
336
334
|
return /* @__PURE__ */ React.createElement(
|
|
337
335
|
TableDataCell,
|
|
338
336
|
{
|
|
@@ -45,12 +45,11 @@ export declare const ArrayItemHeader: ({ labels, disabled }: {
|
|
|
45
45
|
labels: any;
|
|
46
46
|
disabled: any;
|
|
47
47
|
}) => React.JSX.Element;
|
|
48
|
-
export declare const ArrayItemDisplay: ({ name, data,
|
|
48
|
+
export declare const ArrayItemDisplay: ({ name, data, edit, remove, disabledEdit, disabledDelete, disabled, sortable, index, isFirst, isLast, move, valueDisplay, border, wordBreak, stackProps, }: {
|
|
49
49
|
data: any;
|
|
50
50
|
name: string;
|
|
51
51
|
edit: (name: string) => void;
|
|
52
52
|
remove: (name: string) => void;
|
|
53
|
-
register: (name: string) => void;
|
|
54
53
|
disabledEdit?: boolean;
|
|
55
54
|
disabledDelete?: boolean;
|
|
56
55
|
disabled?: boolean;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/FieldArray/FormDialog.tsx"],
|
|
4
|
-
"sourcesContent": ["import React, { LegacyRef, useEffect, useRef, useState } from 'react';\nimport {\n ErrorOption,\n useFieldArray,\n UseFieldArrayMove,\n UseFormReturn,\n useWatch,\n} from 'react-hook-form';\nimport { FieldProps } from '@digigov/form/Field/types';\nimport { FieldObject } from '@digigov/form/FieldObject';\nimport { Fieldset } from '@digigov/form/Fieldset';\nimport {\n Modal,\n ModalAction,\n ModalContent,\n ModalHeading,\n useModal,\n} from '@digigov/ui/app/Modal';\nimport {\n Table,\n TableBody,\n TableContainer,\n TableDataCell,\n TableHead,\n TableHeadCell,\n TableRow,\n} from '@digigov/ui/content';\nimport { Button } from '@digigov/ui/form/Button';\nimport { StackProps, Grid, Stack } from '@digigov/ui/layouts';\nimport Heading from '@digigov/ui/typography/Heading';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nexport interface FormDialogProps extends FieldProps {\n control: UseFormReturn['control'];\n trigger: UseFormReturn['trigger'];\n register: UseFormReturn['register'];\n clearErrors: UseFormReturn['clearErrors'];\n formState: UseFormReturn['formState'];\n error?: ErrorOption;\n getValues: UseFormReturn['getValues'];\n setValue: UseFormReturn['setValue'];\n reset: UseFormReturn['reset'];\n resetField?: UseFormReturn['resetField'];\n sortable: boolean;\n Field: React.FC<FieldProps>;\n}\n\nexport interface DialogProps {\n name: string;\n heading: string;\n actions: React.ReactNode;\n children: React.ReactNode;\n registerModal: (any) => {};\n}\n\nexport const FormDialog: React.FC<FormDialogProps> = React.forwardRef(\n function FormDialog(\n {\n name,\n trigger,\n register,\n control,\n formState,\n error,\n getValues,\n Field,\n reset,\n sortable,\n ...customField\n },\n ref\n ) {\n const [isAppending, setIsAppending] = useState(false);\n const [currentIndex, setCurrentIndex] = useState(0);\n const { fields, append, remove, update, move } = useFieldArray({\n control,\n name,\n });\n const { open, close, registerModal } = useModal();\n const currentLength = fields.length > 0 ? fields.length - 1 : fields.length;\n const currentName = isAppending\n ? `${name}.${currentLength}`\n : `${name}.${currentIndex}`;\n useEffect(() => {\n if (isAppending) {\n setCurrentIndex(currentLength);\n open(`modal-${name}`);\n }\n }, [isAppending]);\n\n const valuesRef = useRef(null);\n if (!error) {\n const values = getValues(currentName);\n if (typeof values === 'object') {\n valuesRef.current = { ...values };\n } else {\n valuesRef.current = values;\n }\n }\n const values = getValues(name);\n const ofField = {\n ...customField.extra?.of,\n name: currentName,\n };\n const defaultValue = getValues(currentName) || ofField.defaultValue;\n const noValuesCommitted =\n fields.length === 0 || (fields.length === 1 && isAppending);\n const titleNumber = customField.extra?.label.object.titleNumbering\n ? `${currentLength + 1}`\n : '';\n return (\n <>\n {noValuesCommitted && (\n <Hint {...customField.extra?.label.object?.nothing_added_props}>\n {customField.extra?.label.object?.nothing_added}\n </Hint>\n )}\n <ArrayItemModal\n title={\n customField.extra?.label.object.title &&\n `${customField.extra?.label.object.title} ${titleNumber}`\n }\n hint={customField.label?.secondary}\n name={name}\n defaultValue={defaultValue}\n currentName={currentName}\n editOrAppend={async () => {\n const hasNoErrors = await trigger(\n ofField.type === 'object'\n ? ofField.extra.fields.map(({ key }) => `${currentName}.${key}`)\n : currentName\n );\n if (!hasNoErrors) {\n update(currentIndex, valuesRef.current);\n }\n if (hasNoErrors) {\n const newValues = getValues(currentName);\n if (isAppending) {\n setIsAppending(false);\n }\n if (newValues === '') {\n remove(currentIndex);\n } else {\n update(currentIndex, newValues);\n }\n close();\n }\n }}\n cancel={() => {\n if (isAppending) {\n setIsAppending(false);\n remove(currentIndex);\n close();\n return;\n }\n update(currentIndex, valuesRef.current);\n reset(undefined, {\n keepTouched: true,\n keepDefaultValues: true,\n keepIsValid: true,\n keepIsSubmitted: true,\n keepValues: true,\n });\n close();\n }}\n type={isAppending ? 'append' : 'edit'}\n appendLabel={customField.extra?.label.object.append.label}\n appendProps={customField.extra?.label.object.append.props}\n editLabel={customField.extra?.label.object.edit.label}\n editProps={customField.extra?.label.object.edit.props}\n cancelLabel={customField.extra?.label.object.cancel.label}\n cancelProps={customField.extra?.label.object.cancel.props}\n control={control}\n {...registerModal(`modal-${name}`)}\n >\n <Fieldset>\n {ofField?.type === 'object' ? (\n <FieldObject\n defaultValue={defaultValue || undefined}\n error={error && error[currentIndex]}\n formState={formState}\n register={register}\n control={control}\n {...ofField}\n key={currentName}\n Field={Field}\n />\n ) : (\n <Field\n name={currentName}\n {...ofField}\n error={error && error[currentIndex]}\n key={currentName}\n />\n )}\n </Fieldset>\n </ArrayItemModal>\n {!noValuesCommitted && (\n <TableContainer {...customField.extra?.tableContainer}>\n <Table\n ref={ref as LegacyRef<HTMLTableElement>}\n verticalAlign={customField.extra?.verticalAlign}\n >\n {!customField.extra?.noHeader &&\n !noValuesCommitted &&\n ofField?.extra &&\n values?.length > 0 && (\n <ArrayItemHeader\n labels={\n ofField.type === 'object'\n ? ofField.extra.fields.map(({ label }) => label.primary)\n : [ofField.label.primary]\n }\n disabled={customField?.editable === false}\n />\n )}\n <TableBody>\n {!noValuesCommitted &&\n values?.map?.((field, index) => {\n return (\n <ArrayItemDisplay\n key={index}\n name={`${name}.${index}`}\n register={register}\n index={index}\n isFirst={index === 0}\n isLast={index === values.length - 1}\n data={field}\n edit={() => {\n setCurrentIndex(index);\n open(`modal-${name}`);\n }}\n stackProps={customField?.extra?.stackProps}\n wordBreak={customField?.extra?.wordBreak}\n valueDisplay={customField?.extra?.valueDisplay}\n remove={() => {\n remove(index);\n }}\n border={customField.extra?.border}\n move={move}\n sortable={sortable}\n disabledEdit={\n sortable ? true : (customField.extra?.noEdit ?? false)\n }\n disabledDelete={customField.extra?.noDelete ?? false}\n disabled={customField?.editable === false}\n />\n );\n })}\n </TableBody>\n </Table>\n </TableContainer>\n )}\n {customField.extra?.editVariant !== 'display' && (\n <div\n className={\n customField.extra?.label.object?.addButtonVariant === 'link'\n ? 'px-2 py-2 bg-gray-200 border-t border-b border-gray-400'\n : ''\n }\n >\n <Button\n type=\"button\"\n name={`${name}-add-object`}\n color=\"secondary\"\n variant={customField.extra?.label.object?.addButtonVariant}\n onClick={(ev) => {\n ev.preventDefault();\n if (customField?.extra?.of?.type === 'object') {\n append({});\n } else {\n append('');\n }\n setCurrentIndex(currentLength + 1);\n setIsAppending(true);\n }}\n disabled={\n customField?.editable === false ||\n customField.extra?.editVariant === 'noinput' ||\n fields.length >= (customField.extra?.max ?? Number.MAX_VALUE)\n }\n >\n {customField.extra?.label.object?.add}\n </Button>\n </div>\n )}\n </>\n );\n }\n);\n\nexport const ArrayItemModal = React.forwardRef(function ArrayItemModal(\n {\n type,\n currentName,\n title,\n hint,\n defaultValue,\n editOrAppend,\n cancel,\n control,\n addTitle,\n editLabel,\n editProps,\n appendLabel,\n appendProps,\n cancelLabel,\n cancelProps,\n children,\n ...props\n }: {\n type: 'append' | 'edit';\n name: string;\n title?: string;\n hint?: string;\n editOrAppend: () => void;\n cancel: () => void;\n addTitle?: string;\n editLabel?: string;\n editProps?: any;\n appendLabel?: string;\n appendProps?: any;\n cancelLabel?: string;\n cancelProps?: any;\n children: React.ReactNode;\n [key: string]: any;\n },\n ref\n) {\n const value = useWatch({\n control,\n name: currentName,\n defaultValue: defaultValue,\n });\n const disabled = value === undefined || value === null || value === '';\n return (\n <Modal\n {...props}\n ref={ref as LegacyRef<HTMLDivElement>}\n aria-labelledby=\"modal-label\"\n >\n <ModalHeading id=\"modal-label\">\n {title\n ? title\n : type === 'edit'\n ? '\u0395\u03C0\u03B5\u03BE\u03B5\u03C1\u03B3\u03B1\u03C3\u03AF\u03B1'\n : addTitle || '\u03A0\u03C1\u03BF\u03C3\u03B8\u03AE\u03BA\u03B7'}\n </ModalHeading>\n <ModalContent>\n {hint && <Hint>{hint}</Hint>}\n {children}\n </ModalContent>\n <ModalAction>\n {type === 'edit' ? (\n <Button\n color=\"secondary\"\n {...editProps}\n type=\"button\"\n onClick={(e) => {\n e.preventDefault();\n editOrAppend();\n }}\n disabled={disabled}\n >\n {editLabel || '\u0391\u03C0\u03BF\u03B8\u03AE\u03BA\u03B5\u03C5\u03C3\u03B7'}\n </Button>\n ) : (\n <Button\n color=\"primary\"\n {...appendProps}\n type=\"button\"\n onClick={(e) => {\n e.preventDefault();\n editOrAppend();\n }}\n disabled={disabled}\n >\n {appendLabel || '\u03A0\u03C1\u03BF\u03C3\u03B8\u03AE\u03BA\u03B7'}\n </Button>\n )}\n <Button\n variant=\"link\"\n type=\"button\"\n {...cancelProps}\n onClick={(e) => {\n e.preventDefault();\n cancel();\n }}\n >\n {cancelLabel || '\u0391\u03BA\u03CD\u03C1\u03C9\u03C3\u03B7'}\n </Button>\n </ModalAction>\n </Modal>\n );\n});\n\nexport const ArrayItemHeader = ({ labels, disabled }) => {\n return (\n <TableHead>\n <TableRow>\n {labels.map((label, index) => {\n return <TableHeadCell key={index}>{label}</TableHeadCell>;\n })}\n {!disabled && <TableHeadCell>\u0395\u03BD\u03AD\u03C1\u03B3\u03B5\u03B9\u03B5\u03C2</TableHeadCell>}\n </TableRow>\n </TableHead>\n );\n};\n\nexport const ArrayItemDisplay = ({\n name,\n data,\n register,\n edit,\n remove,\n disabledEdit,\n disabledDelete,\n disabled,\n sortable,\n index,\n isFirst,\n isLast,\n move,\n valueDisplay,\n border = true,\n wordBreak = 'break-all',\n stackProps = {\n spacing: 4,\n alignItems: 'flex-end',\n justifyContent: 'flex-end',\n direction: 'column',\n },\n}: {\n data: any;\n name: string;\n edit: (name: string) => void;\n remove: (name: string) => void;\n register: (name: string) => void;\n disabledEdit?: boolean;\n disabledDelete?: boolean;\n disabled?: boolean;\n sortable: boolean;\n index: number;\n isFirst: boolean;\n isLast: boolean;\n move: UseFieldArrayMove;\n valueDisplay?: (value) => React.ReactNode;\n border: boolean;\n wordBreak?: 'break-all' | 'none';\n stackProps?: StackProps;\n}) => {\n if (data === undefined || data === null) {\n return null;\n }\n if (\n Object.keys(data).length === 0 ||\n (Object.keys(data).length === 1 && data.id)\n ) {\n return null;\n }\n delete data.id;\n const values: (string | Record<string, any>)[] =\n typeof data === 'string' ? [data] : Object.values(data || {});\n const borderVariant = border === false || sortable ? 'none' : 'border';\n return (\n <>\n <TableRow {...(register(name) as any)}>\n {values?.map?.((value, valueIndex) => {\n return (\n <TableDataCell\n key={valueIndex}\n variant={borderVariant}\n wordBreak={wordBreak}\n pb={sortable ? 0 : undefined}\n pt={sortable ? 4 : undefined}\n >\n {sortable && valueIndex === 0 && (\n <Heading size=\"sm\" className=\"mb-2\">\n \u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE #{index + 1}\n </Heading>\n )}\n {(value as Record<string, any>)?.name ||\n (Array.isArray(value)\n ? value.join('\\n')\n : valueDisplay\n ? valueDisplay(value)\n : value) ||\n ''}\n </TableDataCell>\n );\n })}\n {disabled === true ||\n (disabledEdit === true && disabledDelete === true) ? null : (\n <TableDataCell variant={borderVariant}>\n <Stack {...stackProps}>\n {disabledEdit !== true && (\n <Button\n variant=\"link\"\n type=\"button\"\n onClick={() => {\n edit(name);\n }}\n >\n \u0395\u03C0\u03B5\u03BE\u03B5\u03C1\u03B3\u03B1\u03C3\u03AF\u03B1\n </Button>\n )}\n {disabledDelete !== true && (\n <Button\n variant=\"link\"\n type=\"button\"\n onClick={() => remove(name)}\n >\n \u0394\u03B9\u03B1\u03B3\u03C1\u03B1\u03C6\u03AE\n </Button>\n )}\n </Stack>\n </TableDataCell>\n )}\n </TableRow>\n {sortable && (\n <TableRow>\n <TableDataCell\n variant={isLast ? 'none' : 'border'}\n colSpan={\n disabled === true ||\n (disabledEdit === true && disabledDelete === true)\n ? values.length\n : values.length + 1\n }\n >\n {sortable && !disabled && !(isFirst && isLast) && (\n <Grid xs={12} mt={2}>\n \u039C\u03B5\u03C4\u03B1\u03BA\u03AF\u03BD\u03B7\u03C3\u03B7{' '}\n {!isFirst && (\n <>\n \u03C0\u03C1\u03BF\u03C2 \u03C4\u03B1{' '}\n <Button\n type=\"button\"\n variant=\"link\"\n onClick={() => move(index, index - 1)}\n >\n \u03C0\u03AC\u03BD\u03C9\n </Button>\n </>\n )}\n {!isFirst && !isLast && ' \u03AE '}\n {!isLast && (\n <>\n \u03C0\u03C1\u03BF\u03C2 \u03C4\u03B1{' '}\n <Button\n type=\"button\"\n variant=\"link\"\n onClick={() => move(index, index + 1)}\n >\n \u03BA\u03AC\u03C4\u03C9\n </Button>\n </>\n )}\n </Grid>\n )}\n </TableDataCell>\n </TableRow>\n )}\n </>\n );\n};\n\nexport default FormDialog;\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import React, { LegacyRef, useEffect, useRef, useState } from 'react';\nimport {\n ErrorOption,\n useFieldArray,\n UseFieldArrayMove,\n UseFormReturn,\n useWatch,\n} from 'react-hook-form';\nimport { FieldProps } from '@digigov/form/Field/types';\nimport { FieldObject } from '@digigov/form/FieldObject';\nimport { Fieldset } from '@digigov/form/Fieldset';\nimport {\n Modal,\n ModalAction,\n ModalContent,\n ModalHeading,\n useModal,\n} from '@digigov/ui/app/Modal';\nimport {\n Table,\n TableBody,\n TableContainer,\n TableDataCell,\n TableHead,\n TableHeadCell,\n TableRow,\n} from '@digigov/ui/content';\nimport { Button } from '@digigov/ui/form/Button';\nimport { StackProps, Grid, Stack } from '@digigov/ui/layouts';\nimport Heading from '@digigov/ui/typography/Heading';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nexport interface FormDialogProps extends FieldProps {\n control: UseFormReturn['control'];\n trigger: UseFormReturn['trigger'];\n register: UseFormReturn['register'];\n clearErrors: UseFormReturn['clearErrors'];\n formState: UseFormReturn['formState'];\n error?: ErrorOption;\n getValues: UseFormReturn['getValues'];\n setValue: UseFormReturn['setValue'];\n reset: UseFormReturn['reset'];\n resetField?: UseFormReturn['resetField'];\n sortable: boolean;\n Field: React.FC<FieldProps>;\n}\n\nexport interface DialogProps {\n name: string;\n heading: string;\n actions: React.ReactNode;\n children: React.ReactNode;\n registerModal: (any) => {};\n}\n\nexport const FormDialog: React.FC<FormDialogProps> = React.forwardRef(\n function FormDialog(\n {\n name,\n trigger,\n register,\n control,\n formState,\n error,\n getValues,\n Field,\n reset,\n sortable,\n ...customField\n },\n ref\n ) {\n const [isAppending, setIsAppending] = useState(false);\n const [currentIndex, setCurrentIndex] = useState(0);\n const { fields, append, remove, update, move } = useFieldArray({\n control,\n name,\n });\n const { open, close, registerModal } = useModal();\n const currentLength = fields.length > 0 ? fields.length - 1 : fields.length;\n const currentName = isAppending\n ? `${name}.${currentLength}`\n : `${name}.${currentIndex}`;\n useEffect(() => {\n if (isAppending) {\n setCurrentIndex(currentLength);\n open(`modal-${name}`);\n }\n }, [isAppending]);\n\n const valuesRef = useRef(null);\n if (!error) {\n const values = getValues(currentName);\n if (typeof values === 'object') {\n valuesRef.current = { ...values };\n } else {\n valuesRef.current = values;\n }\n }\n const values = getValues(name);\n const ofField = {\n ...customField.extra?.of,\n name: currentName,\n };\n const defaultValue = getValues(currentName) || ofField.defaultValue;\n const noValuesCommitted =\n fields.length === 0 || (fields.length === 1 && isAppending);\n const titleNumber = customField.extra?.label.object.titleNumbering\n ? `${currentLength + 1}`\n : '';\n return (\n <>\n {noValuesCommitted && (\n <Hint {...customField.extra?.label.object?.nothing_added_props}>\n {customField.extra?.label.object?.nothing_added}\n </Hint>\n )}\n <ArrayItemModal\n title={\n customField.extra?.label.object.title &&\n `${customField.extra?.label.object.title} ${titleNumber}`\n }\n hint={customField.label?.secondary}\n name={name}\n defaultValue={defaultValue}\n currentName={currentName}\n editOrAppend={async () => {\n const hasNoErrors = await trigger(\n ofField.type === 'object'\n ? ofField.extra.fields.map(({ key }) => `${currentName}.${key}`)\n : currentName\n );\n if (!hasNoErrors) {\n update(currentIndex, valuesRef.current);\n }\n if (hasNoErrors) {\n const newValues = getValues(currentName);\n if (isAppending) {\n setIsAppending(false);\n }\n if (newValues === '') {\n remove(currentIndex);\n } else {\n update(currentIndex, newValues);\n }\n close();\n }\n }}\n cancel={() => {\n if (isAppending) {\n setIsAppending(false);\n remove(currentIndex);\n close();\n return;\n }\n update(currentIndex, valuesRef.current);\n reset(undefined, {\n keepTouched: true,\n keepDefaultValues: true,\n keepIsValid: true,\n keepIsSubmitted: true,\n keepValues: true,\n });\n close();\n }}\n type={isAppending ? 'append' : 'edit'}\n appendLabel={customField.extra?.label.object.append.label}\n appendProps={customField.extra?.label.object.append.props}\n editLabel={customField.extra?.label.object.edit.label}\n editProps={customField.extra?.label.object.edit.props}\n cancelLabel={customField.extra?.label.object.cancel.label}\n cancelProps={customField.extra?.label.object.cancel.props}\n control={control}\n {...registerModal(`modal-${name}`)}\n >\n <Fieldset>\n {ofField?.type === 'object' ? (\n <FieldObject\n defaultValue={defaultValue || undefined}\n error={error && error[currentIndex]}\n formState={formState}\n register={register}\n control={control}\n {...ofField}\n key={currentName}\n Field={Field}\n />\n ) : (\n <Field\n name={currentName}\n {...ofField}\n error={error && error[currentIndex]}\n key={currentName}\n />\n )}\n </Fieldset>\n </ArrayItemModal>\n {!noValuesCommitted && (\n <TableContainer {...customField.extra?.tableContainer}>\n <Table\n ref={ref as LegacyRef<HTMLTableElement>}\n verticalAlign={customField.extra?.verticalAlign}\n >\n {!customField.extra?.noHeader &&\n !noValuesCommitted &&\n ofField?.extra &&\n values?.length > 0 && (\n <ArrayItemHeader\n labels={\n ofField.type === 'object'\n ? ofField.extra.fields.map(({ label }) => label.primary)\n : [ofField.label.primary]\n }\n disabled={customField?.editable === false}\n />\n )}\n <TableBody>\n {!noValuesCommitted &&\n values?.map?.((field, index) => {\n return (\n <ArrayItemDisplay\n key={index}\n name={`${name}.${index}`}\n index={index}\n isFirst={index === 0}\n isLast={index === values.length - 1}\n data={field}\n edit={() => {\n setCurrentIndex(index);\n open(`modal-${name}`);\n }}\n stackProps={customField?.extra?.stackProps}\n wordBreak={customField?.extra?.wordBreak}\n valueDisplay={customField?.extra?.valueDisplay}\n remove={() => {\n remove(index);\n }}\n border={customField.extra?.border}\n move={move}\n sortable={sortable}\n disabledEdit={\n sortable ? true : (customField.extra?.noEdit ?? false)\n }\n disabledDelete={customField.extra?.noDelete ?? false}\n disabled={customField?.editable === false}\n />\n );\n })}\n </TableBody>\n </Table>\n </TableContainer>\n )}\n {customField.extra?.editVariant !== 'display' && (\n <div\n className={\n customField.extra?.label.object?.addButtonVariant === 'link'\n ? 'px-2 py-2 bg-gray-200 border-t border-b border-gray-400'\n : ''\n }\n >\n <Button\n type=\"button\"\n name={`${name}-add-object`}\n color=\"secondary\"\n variant={customField.extra?.label.object?.addButtonVariant}\n onClick={(ev) => {\n ev.preventDefault();\n if (customField?.extra?.of?.type === 'object') {\n append({});\n } else {\n append('');\n }\n setCurrentIndex(currentLength + 1);\n setIsAppending(true);\n }}\n disabled={\n customField?.editable === false ||\n customField.extra?.editVariant === 'noinput' ||\n fields.length >= (customField.extra?.max ?? Number.MAX_VALUE)\n }\n >\n {customField.extra?.label.object?.add}\n </Button>\n </div>\n )}\n </>\n );\n }\n);\n\nexport const ArrayItemModal = React.forwardRef(function ArrayItemModal(\n {\n type,\n currentName,\n title,\n hint,\n defaultValue,\n editOrAppend,\n cancel,\n control,\n addTitle,\n editLabel,\n editProps,\n appendLabel,\n appendProps,\n cancelLabel,\n cancelProps,\n children,\n ...props\n }: {\n type: 'append' | 'edit';\n name: string;\n title?: string;\n hint?: string;\n editOrAppend: () => void;\n cancel: () => void;\n addTitle?: string;\n editLabel?: string;\n editProps?: any;\n appendLabel?: string;\n appendProps?: any;\n cancelLabel?: string;\n cancelProps?: any;\n children: React.ReactNode;\n [key: string]: any;\n },\n ref\n) {\n const value = useWatch({\n control,\n name: currentName,\n defaultValue: defaultValue,\n });\n const disabled = value === undefined || value === null || value === '';\n return (\n <Modal\n {...props}\n ref={ref as LegacyRef<HTMLDivElement>}\n aria-labelledby=\"modal-label\"\n >\n <ModalHeading id=\"modal-label\">\n {title\n ? title\n : type === 'edit'\n ? '\u0395\u03C0\u03B5\u03BE\u03B5\u03C1\u03B3\u03B1\u03C3\u03AF\u03B1'\n : addTitle || '\u03A0\u03C1\u03BF\u03C3\u03B8\u03AE\u03BA\u03B7'}\n </ModalHeading>\n <ModalContent>\n {hint && <Hint>{hint}</Hint>}\n {children}\n </ModalContent>\n <ModalAction>\n {type === 'edit' ? (\n <Button\n color=\"secondary\"\n {...editProps}\n type=\"button\"\n onClick={(e) => {\n e.preventDefault();\n editOrAppend();\n }}\n disabled={disabled}\n >\n {editLabel || '\u0391\u03C0\u03BF\u03B8\u03AE\u03BA\u03B5\u03C5\u03C3\u03B7'}\n </Button>\n ) : (\n <Button\n color=\"primary\"\n {...appendProps}\n type=\"button\"\n onClick={(e) => {\n e.preventDefault();\n editOrAppend();\n }}\n disabled={disabled}\n >\n {appendLabel || '\u03A0\u03C1\u03BF\u03C3\u03B8\u03AE\u03BA\u03B7'}\n </Button>\n )}\n <Button\n variant=\"link\"\n type=\"button\"\n {...cancelProps}\n onClick={(e) => {\n e.preventDefault();\n cancel();\n }}\n >\n {cancelLabel || '\u0391\u03BA\u03CD\u03C1\u03C9\u03C3\u03B7'}\n </Button>\n </ModalAction>\n </Modal>\n );\n});\n\nexport const ArrayItemHeader = ({ labels, disabled }) => {\n return (\n <TableHead>\n <TableRow>\n {labels.map((label, index) => {\n return <TableHeadCell key={index}>{label}</TableHeadCell>;\n })}\n {!disabled && <TableHeadCell>\u0395\u03BD\u03AD\u03C1\u03B3\u03B5\u03B9\u03B5\u03C2</TableHeadCell>}\n </TableRow>\n </TableHead>\n );\n};\n\nexport const ArrayItemDisplay = ({\n name,\n data,\n edit,\n remove,\n disabledEdit,\n disabledDelete,\n disabled,\n sortable,\n index,\n isFirst,\n isLast,\n move,\n valueDisplay,\n border = true,\n wordBreak = 'break-all',\n stackProps = {\n spacing: 4,\n alignItems: 'flex-end',\n justifyContent: 'flex-end',\n direction: 'column',\n },\n}: {\n data: any;\n name: string;\n edit: (name: string) => void;\n remove: (name: string) => void;\n disabledEdit?: boolean;\n disabledDelete?: boolean;\n disabled?: boolean;\n sortable: boolean;\n index: number;\n isFirst: boolean;\n isLast: boolean;\n move: UseFieldArrayMove;\n valueDisplay?: (value) => React.ReactNode;\n border: boolean;\n wordBreak?: 'break-all' | 'none';\n stackProps?: StackProps;\n}) => {\n if (data === undefined || data === null) {\n return null;\n }\n if (\n Object.keys(data).length === 0 ||\n (Object.keys(data).length === 1 && data.id)\n ) {\n return null;\n }\n delete data.id;\n const values: (string | Record<string, any>)[] =\n typeof data === 'string' ? [data] : Object.values(data || {});\n const borderVariant = border === false || sortable ? 'none' : 'border';\n return (\n <>\n <TableRow>\n {values?.map?.((value, valueIndex) => {\n return (\n <TableDataCell\n key={valueIndex}\n variant={borderVariant}\n wordBreak={wordBreak}\n pb={sortable ? 0 : undefined}\n pt={sortable ? 4 : undefined}\n >\n {sortable && valueIndex === 0 && (\n <Heading size=\"sm\" className=\"mb-2\">\n \u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE #{index + 1}\n </Heading>\n )}\n {(value as Record<string, any>)?.name ||\n (Array.isArray(value)\n ? value.join('\\n')\n : valueDisplay\n ? valueDisplay(value)\n : value) ||\n ''}\n </TableDataCell>\n );\n })}\n {disabled === true ||\n (disabledEdit === true && disabledDelete === true) ? null : (\n <TableDataCell variant={borderVariant}>\n <Stack {...stackProps}>\n {disabledEdit !== true && (\n <Button\n variant=\"link\"\n type=\"button\"\n onClick={() => {\n edit(name);\n }}\n >\n \u0395\u03C0\u03B5\u03BE\u03B5\u03C1\u03B3\u03B1\u03C3\u03AF\u03B1\n </Button>\n )}\n {disabledDelete !== true && (\n <Button\n variant=\"link\"\n type=\"button\"\n onClick={() => remove(name)}\n >\n \u0394\u03B9\u03B1\u03B3\u03C1\u03B1\u03C6\u03AE\n </Button>\n )}\n </Stack>\n </TableDataCell>\n )}\n </TableRow>\n {sortable && (\n <TableRow>\n <TableDataCell\n variant={isLast ? 'none' : 'border'}\n colSpan={\n disabled === true ||\n (disabledEdit === true && disabledDelete === true)\n ? values.length\n : values.length + 1\n }\n >\n {sortable && !disabled && !(isFirst && isLast) && (\n <Grid xs={12} mt={2}>\n \u039C\u03B5\u03C4\u03B1\u03BA\u03AF\u03BD\u03B7\u03C3\u03B7{' '}\n {!isFirst && (\n <>\n \u03C0\u03C1\u03BF\u03C2 \u03C4\u03B1{' '}\n <Button\n type=\"button\"\n variant=\"link\"\n onClick={() => move(index, index - 1)}\n >\n \u03C0\u03AC\u03BD\u03C9\n </Button>\n </>\n )}\n {!isFirst && !isLast && ' \u03AE '}\n {!isLast && (\n <>\n \u03C0\u03C1\u03BF\u03C2 \u03C4\u03B1{' '}\n <Button\n type=\"button\"\n variant=\"link\"\n onClick={() => move(index, index + 1)}\n >\n \u03BA\u03AC\u03C4\u03C9\n </Button>\n </>\n )}\n </Grid>\n )}\n </TableDataCell>\n </TableRow>\n )}\n </>\n );\n};\n\nexport default FormDialog;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["FormDialog", "values", "ArrayItemModal"]
|
|
7
7
|
}
|
package/FieldArray/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from "react";
|
|
1
|
+
import React, { useEffect, useRef } from "react";
|
|
2
2
|
import { useFieldArray } from "react-hook-form";
|
|
3
3
|
import { FieldBaseContainer } from "@digigov/form/Field/FieldBaseContainer";
|
|
4
4
|
import { FormDialog } from "@digigov/form/FieldArray/FormDialog";
|
|
@@ -28,12 +28,31 @@ const FieldArray = ({
|
|
|
28
28
|
name
|
|
29
29
|
});
|
|
30
30
|
const fields = getValues(name) || [];
|
|
31
|
+
const containerRef = useRef(null);
|
|
32
|
+
const { errors } = formState;
|
|
33
|
+
useEffect(() => {
|
|
34
|
+
if (!containerRef.current) return;
|
|
35
|
+
const fieldErrors = Object.keys(errors);
|
|
36
|
+
if (!fieldErrors.length) return;
|
|
37
|
+
if (
|
|
38
|
+
// Check if there are errors related to the current field array
|
|
39
|
+
fieldErrors.some((key) => {
|
|
40
|
+
const fieldArrayName = key.split(".")[0];
|
|
41
|
+
return fieldArrayName === name;
|
|
42
|
+
})
|
|
43
|
+
) {
|
|
44
|
+
if (containerRef.current && errors[name]) {
|
|
45
|
+
containerRef.current.focus();
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
}, [errors, name]);
|
|
31
49
|
return /* @__PURE__ */ React.createElement(
|
|
32
50
|
FieldBaseContainer,
|
|
33
51
|
{
|
|
34
52
|
label,
|
|
35
53
|
layout,
|
|
36
54
|
register,
|
|
55
|
+
ref: containerRef,
|
|
37
56
|
error: error?.message && error ? error : void 0,
|
|
38
57
|
hasError: formState.isSubmitted && !formState.isSubmitting && !!error,
|
|
39
58
|
wrapper: "fieldset",
|
package/FieldArray/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/FieldArray/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { ErrorOption, useFieldArray, UseFormReturn } from 'react-hook-form';\nimport { FieldBaseContainer } from '@digigov/form/Field/FieldBaseContainer';\nimport { FieldProps } from '@digigov/form/Field/types';\nimport { FormDialog } from '@digigov/form/FieldArray/FormDialog';\nimport { FieldObject } from '@digigov/form/FieldObject';\nimport { FieldsetLabel, Fieldset } from '@digigov/form/Fieldset';\nimport { Card } from '@digigov/ui/content/Card';\nimport { Button } from '@digigov/ui/form/Button';\n\nexport interface FieldArrayProps extends FieldProps {\n control: UseFormReturn['control'];\n trigger: UseFormReturn['trigger'];\n register: UseFormReturn['register'];\n clearErrors: UseFormReturn['clearErrors'];\n formState: UseFormReturn['formState'];\n error?: ErrorOption;\n getValues: UseFormReturn['getValues'];\n setValue: UseFormReturn['setValue'];\n reset: UseFormReturn['reset'];\n resetField?: UseFormReturn['resetField'];\n Field: React.FC<FieldProps>;\n}\nexport const FieldArray: React.FC<FieldArrayProps> = ({\n name,\n trigger,\n register,\n clearErrors,\n control,\n formState,\n error,\n getValues,\n setValue,\n layout,\n reset,\n resetField,\n label,\n Field,\n ...customField\n}) => {\n const { append, remove } = useFieldArray({\n control,\n name,\n });\n const fields = getValues(name) || [];\n return (\n <FieldBaseContainer\n label={label}\n layout={layout}\n register={register}\n error={error?.message && error ? error : undefined}\n hasError={formState.isSubmitted && !formState.isSubmitting && !!error}\n wrapper=\"fieldset\"\n name={name}\n labelSize={customField.extra?.labelSize}\n controlled={true}\n >\n {customField.extra?.variant === 'dialog' ? (\n <FormDialog\n name={name}\n trigger={trigger}\n register={register}\n clearErrors={clearErrors}\n control={control}\n formState={formState}\n error={error}\n getValues={getValues}\n setValue={setValue}\n layout={layout}\n label={label}\n Field={Field}\n reset={reset}\n resetField={resetField}\n sortable={customField.extra.sortable}\n {...customField}\n />\n ) : (\n <>\n {fields.map((field, index) => (\n <Card\n variant={customField.extra?.border ? 'border' : 'divider'}\n key={field.id || index}\n >\n <Fieldset>\n <FieldsetLabel>\n {customField.extra?.label.object.title}{' '}\n {!customField.extra?.noIndex && index + 1}\n </FieldsetLabel>\n <FieldObject\n name={`${name}.${index}`}\n error={Array.isArray(error) && error[index]}\n formState={formState}\n register={register}\n control={control}\n {...customField.extra?.of}\n Field={Field}\n />\n <Button\n name={`${name}-object-remove`}\n variant={customField.extra?.label.object?.deleteButtonVariant}\n type=\"button\"\n color=\"warning\"\n onClick={() => remove(index)}\n disabled={!customField?.editable}\n >\n {customField.extra?.label.object?.delete}\n </Button>\n </Fieldset>\n </Card>\n ))}\n {customField.editable && (\n <Button\n type=\"button\"\n name={`${name}-add-object`}\n color=\"secondary\"\n variant={customField.extra?.label.object?.addButtonVariant}\n onClick={(ev) => {\n ev.preventDefault();\n append({});\n }}\n disabled={!customField?.editable}\n >\n {customField.extra?.label.object?.add}\n </Button>\n )}\n </>\n )}\n </FieldBaseContainer>\n );\n};\n\nexport default FieldArray;\n"],
|
|
5
|
-
"mappings": "AAAA,OAAO,WAAW;
|
|
4
|
+
"sourcesContent": ["import React, { useEffect, useRef } from 'react';\nimport { ErrorOption, useFieldArray, UseFormReturn } from 'react-hook-form';\nimport { FieldBaseContainer } from '@digigov/form/Field/FieldBaseContainer';\nimport { FieldProps } from '@digigov/form/Field/types';\nimport { FormDialog } from '@digigov/form/FieldArray/FormDialog';\nimport { FieldObject } from '@digigov/form/FieldObject';\nimport { FieldsetLabel, Fieldset } from '@digigov/form/Fieldset';\nimport { Card } from '@digigov/ui/content/Card';\nimport { Button } from '@digigov/ui/form/Button';\n\nexport interface FieldArrayProps extends FieldProps {\n control: UseFormReturn['control'];\n trigger: UseFormReturn['trigger'];\n register: UseFormReturn['register'];\n clearErrors: UseFormReturn['clearErrors'];\n formState: UseFormReturn['formState'];\n error?: ErrorOption;\n getValues: UseFormReturn['getValues'];\n setValue: UseFormReturn['setValue'];\n reset: UseFormReturn['reset'];\n resetField?: UseFormReturn['resetField'];\n Field: React.FC<FieldProps>;\n}\nexport const FieldArray: React.FC<FieldArrayProps> = ({\n name,\n trigger,\n register,\n clearErrors,\n control,\n formState,\n error,\n getValues,\n setValue,\n layout,\n reset,\n resetField,\n label,\n Field,\n ...customField\n}) => {\n const { append, remove } = useFieldArray({\n control,\n name,\n });\n const fields = getValues(name) || [];\n\n /** The ref of the FieldBaseContainer. */\n const containerRef = useRef<HTMLFieldSetElement | null>(null);\n\n const { errors } = formState;\n\n // Focus the fieldset when there are errors related to this field array\n useEffect(() => {\n if (!containerRef.current) return;\n const fieldErrors = Object.keys(errors);\n // no errors\n if (!fieldErrors.length) return;\n\n if (\n // Check if there are errors related to the current field array\n fieldErrors.some((key) => {\n const fieldArrayName = key.split('.')[0];\n return fieldArrayName === name;\n })\n ) {\n if (containerRef.current && errors[name]) {\n containerRef.current.focus();\n }\n }\n }, [errors, name]);\n\n return (\n <FieldBaseContainer\n label={label}\n layout={layout}\n register={register}\n ref={containerRef}\n error={error?.message && error ? error : undefined}\n hasError={formState.isSubmitted && !formState.isSubmitting && !!error}\n wrapper=\"fieldset\"\n name={name}\n labelSize={customField.extra?.labelSize}\n controlled={true}\n >\n {customField.extra?.variant === 'dialog' ? (\n <FormDialog\n name={name}\n trigger={trigger}\n register={register}\n clearErrors={clearErrors}\n control={control}\n formState={formState}\n error={error}\n getValues={getValues}\n setValue={setValue}\n layout={layout}\n label={label}\n Field={Field}\n reset={reset}\n resetField={resetField}\n sortable={customField.extra.sortable}\n {...customField}\n />\n ) : (\n <>\n {fields.map((field, index) => (\n <Card\n variant={customField.extra?.border ? 'border' : 'divider'}\n key={field.id || index}\n >\n <Fieldset>\n <FieldsetLabel>\n {customField.extra?.label.object.title}{' '}\n {!customField.extra?.noIndex && index + 1}\n </FieldsetLabel>\n <FieldObject\n name={`${name}.${index}`}\n error={Array.isArray(error) && error[index]}\n formState={formState}\n register={register}\n control={control}\n {...customField.extra?.of}\n Field={Field}\n />\n <Button\n name={`${name}-object-remove`}\n variant={customField.extra?.label.object?.deleteButtonVariant}\n type=\"button\"\n color=\"warning\"\n onClick={() => remove(index)}\n disabled={!customField?.editable}\n >\n {customField.extra?.label.object?.delete}\n </Button>\n </Fieldset>\n </Card>\n ))}\n {customField.editable && (\n <Button\n type=\"button\"\n name={`${name}-add-object`}\n color=\"secondary\"\n variant={customField.extra?.label.object?.addButtonVariant}\n onClick={(ev) => {\n ev.preventDefault();\n append({});\n }}\n disabled={!customField?.editable}\n >\n {customField.extra?.label.object?.add}\n </Button>\n )}\n </>\n )}\n </FieldBaseContainer>\n );\n};\n\nexport default FieldArray;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -40,41 +40,43 @@ var import_FieldsetLegend = __toESM(require("@digigov/react-core/FieldsetLegend"
|
|
|
40
40
|
var import_LabelContainer = __toESM(require("@digigov/react-core/LabelContainer"));
|
|
41
41
|
var import_i18n = require("@digigov/ui/i18n");
|
|
42
42
|
var import_Hint = require("@digigov/ui/typography/Hint");
|
|
43
|
-
const FieldBaseContainer = (
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
}) => {
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
43
|
+
const FieldBaseContainer = import_react.default.forwardRef(
|
|
44
|
+
({
|
|
45
|
+
name,
|
|
46
|
+
wrapper,
|
|
47
|
+
label,
|
|
48
|
+
children,
|
|
49
|
+
error,
|
|
50
|
+
hasError,
|
|
51
|
+
layout,
|
|
52
|
+
controlled,
|
|
53
|
+
labelSize = "sm"
|
|
54
|
+
}, ref) => {
|
|
55
|
+
const { t } = (0, import_i18n.useTranslation)();
|
|
56
|
+
const errorMessage = error?.message.key ? error.message.key : error?.message || "";
|
|
57
|
+
const errorContext = error?.message.context || {};
|
|
58
|
+
if (wrapper === "fieldset") {
|
|
59
|
+
return /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.default, { error: hasError, ...layout }, /* @__PURE__ */ import_react.default.createElement(
|
|
60
|
+
import_Fieldset.default,
|
|
61
|
+
{
|
|
62
|
+
ref,
|
|
63
|
+
className: "outline-none",
|
|
64
|
+
...controlled && {
|
|
65
|
+
tabIndex: -1
|
|
66
|
+
}
|
|
67
|
+
},
|
|
68
|
+
/* @__PURE__ */ import_react.default.createElement(import_FieldsetLegend.default, { size: labelSize }, label && label.primary),
|
|
69
|
+
label && label.secondary && /* @__PURE__ */ import_react.default.createElement(import_Hint.Hint, null, t(label.secondary)),
|
|
70
|
+
error && /* @__PURE__ */ import_react.default.createElement(import_ErrorMessage.ErrorMessage, { id: `${name}-error` }, t(errorMessage, errorContext)),
|
|
71
|
+
children,
|
|
72
|
+
label && label.hint && /* @__PURE__ */ import_react.default.createElement(import_Hint.Hint, { size: "sm" }, label.hint)
|
|
73
|
+
));
|
|
74
|
+
} else {
|
|
75
|
+
return /* @__PURE__ */ import_react.default.createElement(import_FieldContainer.default, { error: hasError, ...layout }, /* @__PURE__ */ import_react.default.createElement(import_LabelContainer.default, null, label && /* @__PURE__ */ import_react.default.createElement(import_Label.default, { label }), error && /* @__PURE__ */ import_react.default.createElement(import_ErrorMessage.ErrorMessage, { id: `${name}-error` }, t(errorMessage, errorContext)), children, label && label.hint && /* @__PURE__ */ import_react.default.createElement(import_Hint.Hint, { size: "sm" }, label.hint)));
|
|
76
|
+
}
|
|
76
77
|
}
|
|
77
|
-
|
|
78
|
+
);
|
|
79
|
+
FieldBaseContainer.displayName = "FieldBaseContainer";
|
|
78
80
|
var FieldBaseContainer_default = FieldBaseContainer;
|
|
79
81
|
// Annotate the CommonJS export names for ESM import in node:
|
|
80
82
|
0 && (module.exports = {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/Field/FieldBaseContainer.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { FieldContainerProps } from '@digigov/form/Field/types';\nimport Label from '@digigov/form/inputs/Label';\nimport { ErrorMessage } from '@digigov/react-core/ErrorMessage';\nimport FieldContainer from '@digigov/react-core/FieldContainer';\nimport Fieldset from '@digigov/react-core/Fieldset';\nimport FieldsetLegend from '@digigov/react-core/FieldsetLegend';\nimport LabelContainer from '@digigov/react-core/LabelContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nexport const FieldBaseContainer
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["import React, { ComponentRef } from 'react';\nimport { FieldContainerProps } from '@digigov/form/Field/types';\nimport Label from '@digigov/form/inputs/Label';\nimport { ErrorMessage } from '@digigov/react-core/ErrorMessage';\nimport FieldContainer from '@digigov/react-core/FieldContainer';\nimport Fieldset from '@digigov/react-core/Fieldset';\nimport FieldsetLegend from '@digigov/react-core/FieldsetLegend';\nimport LabelContainer from '@digigov/react-core/LabelContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nexport const FieldBaseContainer = React.forwardRef<\n ComponentRef<typeof Fieldset>,\n FieldContainerProps\n>(\n (\n {\n name,\n wrapper,\n label,\n children,\n error,\n hasError,\n layout,\n controlled,\n labelSize = 'sm',\n },\n ref\n ) => {\n const { t } = useTranslation();\n const errorMessage = error?.message.key\n ? error.message.key\n : error?.message || '';\n const errorContext = error?.message.context || {};\n if (wrapper === 'fieldset') {\n return (\n <FieldContainer error={hasError} {...layout}>\n <Fieldset\n ref={ref}\n className=\"outline-none\"\n {...(controlled && {\n tabIndex: -1,\n })}\n >\n <FieldsetLegend size={labelSize}>\n {label && label.primary}\n </FieldsetLegend>\n {label && label.secondary && <Hint>{t(label.secondary)}</Hint>}\n {error && (\n <ErrorMessage id={`${name}-error`}>\n {t(errorMessage, errorContext)}\n </ErrorMessage>\n )}\n {children}\n {label && label.hint && <Hint size=\"sm\">{label.hint}</Hint>}\n </Fieldset>\n </FieldContainer>\n );\n } else {\n return (\n <FieldContainer error={hasError} {...layout}>\n <LabelContainer>\n {label && <Label label={label} />}\n {error && (\n <ErrorMessage id={`${name}-error`}>\n {t(errorMessage, errorContext)}\n </ErrorMessage>\n )}\n {children}\n {label && label.hint && <Hint size=\"sm\">{label.hint}</Hint>}\n </LabelContainer>\n </FieldContainer>\n );\n }\n }\n);\n\nFieldBaseContainer.displayName = 'FieldBaseContainer';\n\nexport default FieldBaseContainer;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAoC;AAEpC,mBAAkB;AAClB,0BAA6B;AAC7B,4BAA2B;AAC3B,sBAAqB;AACrB,4BAA2B;AAC3B,4BAA2B;AAC3B,kBAA+B;AAC/B,kBAAqB;AAEd,MAAM,qBAAqB,aAAAA,QAAM;AAAA,EAItC,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACd,GACA,QACG;AACH,UAAM,EAAE,EAAE,QAAI,4BAAe;AAC7B,UAAM,eAAe,OAAO,QAAQ,MAChC,MAAM,QAAQ,MACd,OAAO,WAAW;AACtB,UAAM,eAAe,OAAO,QAAQ,WAAW,CAAC;AAChD,QAAI,YAAY,YAAY;AAC1B,aACE,6BAAAA,QAAA,cAAC,sBAAAC,SAAA,EAAe,OAAO,UAAW,GAAG,UACnC,6BAAAD,QAAA;AAAA,QAAC,gBAAAE;AAAA,QAAA;AAAA,UACC;AAAA,UACA,WAAU;AAAA,UACT,GAAI,cAAc;AAAA,YACjB,UAAU;AAAA,UACZ;AAAA;AAAA,QAEA,6BAAAF,QAAA,cAAC,sBAAAG,SAAA,EAAe,MAAM,aACnB,SAAS,MAAM,OAClB;AAAA,QACC,SAAS,MAAM,aAAa,6BAAAH,QAAA,cAAC,wBAAM,EAAE,MAAM,SAAS,CAAE;AAAA,QACtD,SACC,6BAAAA,QAAA,cAAC,oCAAa,IAAI,GAAG,IAAI,YACtB,EAAE,cAAc,YAAY,CAC/B;AAAA,QAED;AAAA,QACA,SAAS,MAAM,QAAQ,6BAAAA,QAAA,cAAC,oBAAK,MAAK,QAAM,MAAM,IAAK;AAAA,MACtD,CACF;AAAA,IAEJ,OAAO;AACL,aACE,6BAAAA,QAAA,cAAC,sBAAAC,SAAA,EAAe,OAAO,UAAW,GAAG,UACnC,6BAAAD,QAAA,cAAC,sBAAAI,SAAA,MACE,SAAS,6BAAAJ,QAAA,cAAC,aAAAK,SAAA,EAAM,OAAc,GAC9B,SACC,6BAAAL,QAAA,cAAC,oCAAa,IAAI,GAAG,IAAI,YACtB,EAAE,cAAc,YAAY,CAC/B,GAED,UACA,SAAS,MAAM,QAAQ,6BAAAA,QAAA,cAAC,oBAAK,MAAK,QAAM,MAAM,IAAK,CACtD,CACF;AAAA,IAEJ;AAAA,EACF;AACF;AAEA,mBAAmB,cAAc;AAEjC,IAAO,6BAAQ;",
|
|
6
6
|
"names": ["React", "FieldContainer", "Fieldset", "FieldsetLegend", "LabelContainer", "Label"]
|
|
7
7
|
}
|
|
@@ -185,7 +185,6 @@ const FormDialog = import_react.default.forwardRef(
|
|
|
185
185
|
{
|
|
186
186
|
key: index,
|
|
187
187
|
name: `${name}.${index}`,
|
|
188
|
-
register,
|
|
189
188
|
index,
|
|
190
189
|
isFirst: index === 0,
|
|
191
190
|
isLast: index === values.length - 1,
|
|
@@ -321,7 +320,6 @@ const ArrayItemHeader = ({ labels, disabled }) => {
|
|
|
321
320
|
const ArrayItemDisplay = ({
|
|
322
321
|
name,
|
|
323
322
|
data,
|
|
324
|
-
register,
|
|
325
323
|
edit,
|
|
326
324
|
remove,
|
|
327
325
|
disabledEdit,
|
|
@@ -351,7 +349,7 @@ const ArrayItemDisplay = ({
|
|
|
351
349
|
delete data.id;
|
|
352
350
|
const values = typeof data === "string" ? [data] : Object.values(data || {});
|
|
353
351
|
const borderVariant = border === false || sortable ? "none" : "border";
|
|
354
|
-
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_content.TableRow,
|
|
352
|
+
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_content.TableRow, null, values?.map?.((value, valueIndex) => {
|
|
355
353
|
return /* @__PURE__ */ import_react.default.createElement(
|
|
356
354
|
import_content.TableDataCell,
|
|
357
355
|
{
|