@digigov/form 2.0.0-555d1027 → 2.0.0-5e7a6790
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/ErrorGroup.d.ts +3 -3
- package/Field/ErrorGroup.js.map +1 -1
- package/Field/FieldBase/index.js +0 -1
- package/Field/FieldBase.d.ts +1 -1
- package/Field/FieldBase.js.map +2 -2
- package/Field/FieldBaseContainer/index.js +36 -34
- package/Field/FieldBaseContainer.d.ts +2 -2
- package/Field/FieldBaseContainer.js.map +2 -2
- package/Field/FieldConditional.d.ts +1 -1
- package/Field/FieldConditional.js.map +1 -1
- package/Field/index.d.ts +1 -1
- package/Field/index.js +15 -25
- package/Field/index.js.map +2 -2
- package/Field/types.d.ts +11 -10
- package/Field/utils/evaluateFieldWithConditions.d.ts +2 -2
- package/Field/utils/evaluateFieldWithConditions.js.map +2 -2
- package/Field/utils/resolveField/index.js +35 -0
- package/Field/utils/{calculateField → resolveField}/package.json +1 -1
- package/Field/utils/resolveField.d.ts +3 -0
- package/Field/utils/resolveField.js.map +7 -0
- package/Field/utils/useField/index.js +4 -2
- package/Field/utils/useField.d.ts +1 -1
- package/Field/utils/useField.js.map +2 -2
- package/FieldArray/BaseFieldArray/index.js +76 -0
- package/{inputs/inputsScenarios → FieldArray/BaseFieldArray}/package.json +1 -1
- package/FieldArray/BaseFieldArray.d.ts +5 -0
- package/FieldArray/BaseFieldArray.js.map +7 -0
- package/FieldArray/FormDialog/ArrayDisplay/ArrayDisplay.stories.d.ts +10 -0
- package/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay/index.js +97 -0
- package/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay/package.json +6 -0
- package/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay.d.ts +22 -0
- package/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay.js.map +7 -0
- package/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader/index.js +11 -0
- package/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader/package.json +6 -0
- package/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader.d.ts +5 -0
- package/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader.js.map +7 -0
- package/FieldArray/FormDialog/ArrayDisplay/__stories__/Default.d.ts +2 -0
- package/FieldArray/FormDialog/ArrayDisplay/__stories__/ReadOnly.d.ts +2 -0
- package/FieldArray/FormDialog/ArrayDisplay/__stories__/Sortable.d.ts +2 -0
- package/FieldArray/FormDialog/ArrayDisplay/index.d.ts +14 -0
- package/FieldArray/FormDialog/ArrayDisplay/index.js +51 -0
- package/FieldArray/FormDialog/ArrayDisplay/index.js.map +7 -0
- package/FieldArray/FormDialog/ArrayDisplay/package.json +6 -0
- package/FieldArray/FormDialog/ArrayEditModal/index.js +149 -0
- package/FieldArray/FormDialog/ArrayEditModal/package.json +6 -0
- package/FieldArray/FormDialog/ArrayEditModal.d.ts +26 -0
- package/FieldArray/FormDialog/ArrayEditModal.js.map +7 -0
- package/FieldArray/FormDialog/index.d.ts +19 -0
- package/FieldArray/FormDialog/index.js +139 -348
- package/FieldArray/FormDialog/index.js.map +7 -0
- package/FieldArray/index.d.ts +4 -2
- package/FieldArray/index.js +28 -54
- package/FieldArray/index.js.map +2 -2
- package/FieldObject/index.d.ts +4 -4
- package/FieldObject/index.js +5 -12
- package/FieldObject/index.js.map +2 -2
- package/Fieldset/FieldsetWithContext.js.map +1 -1
- package/Fieldset/index.d.ts +1 -1
- package/Fieldset/index.js.map +1 -1
- package/Fieldset/types.d.ts +2 -2
- package/FormBuilder/index.d.ts +1 -1
- package/FormBuilder/index.js +155 -130
- package/FormBuilder/index.js.map +2 -2
- package/FormContext.d.ts +2 -2
- package/FormContext.js.map +2 -2
- package/MultiplicityField/add-objects/index.js +10 -19
- package/MultiplicityField/add-objects.d.ts +1 -1
- package/MultiplicityField/add-objects.js.map +2 -2
- package/MultiplicityField/index.d.ts +2 -2
- package/MultiplicityField/index.js.map +2 -2
- package/MultiplicityField/types.d.ts +2 -2
- package/Questions/Questions.d.ts +1 -1
- package/Questions/Questions.js.map +1 -1
- package/Questions/QuestionsContext.d.ts +1 -1
- package/Questions/QuestionsContext.js.map +1 -1
- package/Questions/Step/Step.d.ts +1 -1
- package/Questions/Step/Step.js.map +1 -1
- package/Questions/Step/StepArrayReview.d.ts +1 -1
- package/Questions/Step/StepArrayReview.js.map +1 -1
- package/Questions/Step/StepContext.d.ts +1 -1
- package/Questions/Step/StepContext.js.map +1 -1
- package/Questions/Step/StepDescription.d.ts +1 -1
- package/Questions/Step/StepDescription.js.map +2 -2
- package/Questions/Step/StepForm.d.ts +2 -2
- package/Questions/Step/StepForm.js.map +1 -1
- package/Questions/Step/StepQuote.d.ts +1 -1
- package/Questions/Step/StepQuote.js.map +2 -2
- package/Questions/Step/StepTitle.d.ts +1 -1
- package/Questions/Step/StepTitle.js.map +2 -2
- package/Questions/Step/getAddMoreFields.d.ts +2 -2
- package/Questions/Step/getAddMoreFields.js.map +1 -1
- package/Questions/Step/types.d.ts +1 -1
- package/Questions/getNextStep.d.ts +1 -1
- package/Questions/getNextStep.js.map +1 -1
- package/Questions/types.d.ts +1 -1
- package/cjs/Field/ErrorGroup.js.map +1 -1
- package/cjs/Field/FieldBase/index.js +0 -1
- package/cjs/Field/FieldBase.js.map +2 -2
- package/cjs/Field/FieldBaseContainer/index.js +36 -34
- package/cjs/Field/FieldBaseContainer.js.map +2 -2
- package/cjs/Field/FieldConditional.js.map +1 -1
- package/cjs/Field/index.js +15 -22
- package/cjs/Field/index.js.map +2 -2
- package/cjs/Field/types.js.map +1 -1
- package/cjs/Field/utils/evaluateFieldWithConditions.js.map +2 -2
- package/cjs/Field/utils/resolveField/index.js +55 -0
- package/cjs/Field/utils/resolveField.js.map +7 -0
- package/cjs/Field/utils/useField/index.js +4 -2
- package/cjs/Field/utils/useField.js.map +2 -2
- package/cjs/FieldArray/BaseFieldArray/index.js +109 -0
- package/cjs/FieldArray/BaseFieldArray.js.map +7 -0
- package/cjs/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay/index.js +130 -0
- package/cjs/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay.js.map +7 -0
- package/cjs/{locales/el → FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader}/index.js +16 -7
- package/cjs/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader.js.map +7 -0
- package/cjs/FieldArray/FormDialog/ArrayDisplay/index.js +84 -0
- package/cjs/FieldArray/FormDialog/ArrayDisplay/index.js.map +7 -0
- package/cjs/FieldArray/FormDialog/ArrayEditModal/index.js +177 -0
- package/cjs/FieldArray/FormDialog/ArrayEditModal.js.map +7 -0
- package/cjs/FieldArray/FormDialog/index.js +130 -331
- package/cjs/FieldArray/FormDialog/index.js.map +7 -0
- package/cjs/FieldArray/index.js +27 -53
- package/cjs/FieldArray/index.js.map +3 -3
- package/cjs/FieldObject/index.js +5 -9
- package/cjs/FieldObject/index.js.map +2 -2
- package/cjs/Fieldset/FieldsetWithContext.js.map +1 -1
- package/cjs/Fieldset/index.js.map +1 -1
- package/cjs/Fieldset/types.js.map +1 -1
- package/cjs/FormBuilder/index.js +156 -131
- package/cjs/FormBuilder/index.js.map +3 -3
- package/cjs/FormContext.js.map +2 -2
- package/cjs/MultiplicityField/add-objects/index.js +9 -13
- package/cjs/MultiplicityField/add-objects.js.map +2 -2
- package/cjs/MultiplicityField/index.js.map +2 -2
- package/cjs/MultiplicityField/types.js.map +1 -1
- package/cjs/Questions/Questions.js.map +1 -1
- package/cjs/Questions/QuestionsContext.js.map +1 -1
- package/cjs/Questions/Step/Step.js.map +1 -1
- package/cjs/Questions/Step/StepArrayReview.js.map +1 -1
- package/cjs/Questions/Step/StepContext.js.map +1 -1
- package/cjs/Questions/Step/StepDescription.js.map +2 -2
- package/cjs/Questions/Step/StepForm.js.map +1 -1
- package/cjs/Questions/Step/StepQuote.js.map +2 -2
- package/cjs/Questions/Step/StepTitle.js.map +2 -2
- package/cjs/Questions/Step/getAddMoreFields.js.map +1 -1
- package/cjs/Questions/Step/types.js.map +1 -1
- package/cjs/Questions/getNextStep.js.map +1 -1
- package/cjs/Questions/types.js.map +1 -1
- package/cjs/hooks/useFieldFocusManager/index.js +135 -0
- package/cjs/hooks/useFieldFocusManager.js.map +7 -0
- package/cjs/hooks/utils/index.js +98 -0
- package/cjs/hooks/utils.js.map +7 -0
- package/cjs/inputs/AutoCompleteInput/index.js.map +2 -2
- package/cjs/inputs/Checkboxes/index.js +67 -63
- package/cjs/inputs/Checkboxes/index.js.map +2 -2
- package/cjs/inputs/DateInput/index.js +10 -5
- package/cjs/inputs/DateInput/index.js.map +2 -2
- package/cjs/inputs/DateTimeInput/index.js +10 -5
- package/cjs/inputs/DateTimeInput/index.js.map +2 -2
- package/cjs/inputs/FileInput/index.js.map +2 -2
- package/cjs/inputs/ImageInput/index.js.map +1 -1
- package/cjs/inputs/Input/index.js +54 -56
- package/cjs/inputs/Input/index.js.map +2 -2
- package/cjs/inputs/Label/index.js.map +1 -1
- package/cjs/inputs/OtpInput/index.js +36 -31
- package/cjs/inputs/OtpInput/index.js.map +2 -2
- package/cjs/inputs/Radio/index.js +5 -4
- package/cjs/inputs/Radio/index.js.map +3 -3
- package/cjs/inputs/Select/index.js.map +1 -1
- package/cjs/{Field/utils → inputs/registry}/index.js +4 -4
- package/cjs/inputs/registry.js.map +7 -0
- package/cjs/{lazy/index.js → lazy.js} +10 -9
- package/cjs/lazy.js.map +2 -2
- package/cjs/{registry/index.js → registry.js} +23 -13
- package/cjs/registry.js.map +2 -2
- package/cjs/types.js.map +1 -1
- package/cjs/utils.js.map +2 -2
- package/cjs/validators/index.js.map +2 -2
- package/cjs/validators/types.js.map +1 -1
- 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/cjs/validators/utils/file.js.map +1 -1
- package/cjs/validators/utils/iban.js.map +1 -1
- package/cjs/validators/utils/image.js.map +1 -1
- package/cjs/validators/utils/index.js.map +1 -1
- package/cjs/validators/utils/int.js.map +1 -1
- package/cjs/validators/utils/number.js.map +1 -1
- package/cjs/validators/utils/otp.js.map +1 -1
- package/cjs/validators/utils/phone.js.map +1 -1
- package/cjs/validators/utils/postal_code.js.map +1 -1
- package/cjs/validators/utils/text_limit.js.map +1 -1
- package/hooks/useFieldFocusManager/index.js +116 -0
- package/hooks/useFieldFocusManager/package.json +6 -0
- package/hooks/useFieldFocusManager.d.ts +25 -0
- package/hooks/useFieldFocusManager.js.map +7 -0
- package/hooks/utils/index.js +73 -0
- package/{Field → hooks}/utils/package.json +1 -1
- package/hooks/utils.d.ts +18 -0
- package/hooks/utils.js.map +7 -0
- package/index.js +1 -1
- package/inputs/AutoCompleteInput/index.d.ts +3 -3
- package/inputs/AutoCompleteInput/index.js +1 -3
- package/inputs/AutoCompleteInput/index.js.map +2 -2
- package/inputs/Checkboxes/index.d.ts +3 -3
- package/inputs/Checkboxes/index.js +67 -63
- package/inputs/Checkboxes/index.js.map +2 -2
- package/inputs/DateInput/index.d.ts +2 -5
- package/inputs/DateInput/index.js +10 -5
- package/inputs/DateInput/index.js.map +2 -2
- package/inputs/DateTimeInput/index.d.ts +2 -5
- package/inputs/DateTimeInput/index.js +10 -5
- package/inputs/DateTimeInput/index.js.map +2 -2
- package/inputs/FileInput/index.d.ts +4 -4
- package/inputs/FileInput/index.js +1 -4
- package/inputs/FileInput/index.js.map +2 -2
- package/inputs/ImageInput/index.d.ts +2 -2
- package/inputs/ImageInput/index.js.map +1 -1
- package/inputs/Input/index.d.ts +2 -2
- package/inputs/Input/index.js +54 -56
- package/inputs/Input/index.js.map +2 -2
- package/inputs/Label/index.d.ts +1 -1
- package/inputs/Label/index.js.map +1 -1
- package/inputs/OtpInput/index.d.ts +1 -5
- package/inputs/OtpInput/index.js +36 -31
- package/inputs/OtpInput/index.js.map +2 -2
- package/inputs/Radio/index.d.ts +4 -4
- package/inputs/Radio/index.js +5 -4
- package/inputs/Radio/index.js.map +3 -3
- package/inputs/Select/index.d.ts +2 -2
- package/inputs/Select/index.js.map +1 -1
- package/{Field/utils → inputs/registry}/index.js +1 -1
- package/{locales/el → inputs/registry}/package.json +1 -1
- package/{Field/utils/index.d.ts → inputs/registry.d.ts} +2 -1
- package/inputs/registry.js.map +7 -0
- package/lazy/index.js +10 -9
- package/package.json +4 -4
- package/registry/index.js +23 -13
- package/src/Field/ErrorGroup.tsx +3 -3
- package/src/Field/FieldBase.tsx +1 -2
- package/src/Field/FieldBaseContainer.tsx +68 -58
- package/src/Field/FieldConditional.tsx +1 -1
- package/src/Field/index.tsx +15 -33
- package/src/Field/types.tsx +11 -12
- package/src/Field/utils/evaluateFieldWithConditions.ts +5 -2
- package/src/Field/utils/resolveField.ts +58 -0
- package/src/Field/utils/useField.ts +3 -1
- package/src/FieldArray/BaseFieldArray.tsx +97 -0
- package/src/FieldArray/FormDialog/ArrayDisplay/ArrayDisplay.stories.js +11 -0
- package/src/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay.tsx +165 -0
- package/src/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader.tsx +15 -0
- package/src/FieldArray/FormDialog/ArrayDisplay/__stories__/Default.tsx +93 -0
- package/src/FieldArray/FormDialog/ArrayDisplay/__stories__/ReadOnly.tsx +79 -0
- package/src/FieldArray/FormDialog/ArrayDisplay/__stories__/Sortable.tsx +93 -0
- package/src/FieldArray/FormDialog/ArrayDisplay/index.tsx +75 -0
- package/src/FieldArray/FormDialog/ArrayEditModal.tsx +233 -0
- package/src/FieldArray/FormDialog/index.tsx +247 -0
- package/src/FieldArray/__tests__/fieldset-multiplicity.spec.tsx +271 -0
- package/src/FieldArray/__tests__/multiplicity-attachment.spec.tsx +280 -0
- package/src/FieldArray/__tests__/multiplicity-required.spec.tsx +131 -0
- package/src/FieldArray/__tests__/nested-fieldset-multiplicity.spec.tsx +627 -0
- package/src/FieldArray/__tests__/preference-multiple-choice.spec.tsx +222 -0
- package/src/FieldArray/index.spec.tsx +355 -0
- package/src/FieldArray/index.tsx +34 -61
- package/src/FieldObject/index.tsx +9 -17
- package/src/Fieldset/FieldsetWithContext.tsx +1 -1
- package/src/Fieldset/index.tsx +1 -1
- package/src/Fieldset/types.tsx +2 -2
- package/src/FormBuilder/index.tsx +188 -142
- package/src/FormBuilder/scenarios.test.tsx +759 -1
- package/src/FormContext.tsx +3 -2
- package/src/MultiplicityField/add-objects.tsx +12 -21
- package/src/MultiplicityField/index.tsx +3 -2
- package/src/MultiplicityField/types.ts +5 -2
- package/src/Questions/Questions.tsx +2 -2
- package/src/Questions/QuestionsContext.tsx +1 -1
- package/src/Questions/Step/Step.tsx +1 -1
- package/src/Questions/Step/StepArrayReview.tsx +2 -2
- package/src/Questions/Step/StepContext.tsx +1 -1
- package/src/Questions/Step/StepDescription.tsx +2 -1
- package/src/Questions/Step/StepForm.tsx +2 -2
- package/src/Questions/Step/StepQuote.tsx +2 -1
- package/src/Questions/Step/StepTitle.tsx +2 -1
- package/src/Questions/Step/getAddMoreFields.tsx +2 -2
- package/src/Questions/Step/types.tsx +1 -1
- package/src/Questions/getNextStep.tsx +1 -1
- package/src/Questions/types.tsx +1 -1
- package/src/hooks/__tests__/useFieldFocusManager.spec.tsx +1079 -0
- package/src/hooks/__tests__/utils.spec.ts +568 -0
- package/src/hooks/useFieldFocusManager.ts +162 -0
- package/src/hooks/utils.ts +122 -0
- package/src/inputs/AutoCompleteInput/index.tsx +4 -6
- package/src/inputs/Checkboxes/index.tsx +95 -87
- package/src/inputs/DateInput/index.tsx +19 -6
- package/src/inputs/DateTimeInput/index.tsx +19 -6
- package/src/inputs/FileInput/index.tsx +9 -7
- package/src/inputs/ImageInput/index.tsx +2 -2
- package/src/inputs/Input/index.tsx +72 -71
- package/src/inputs/Label/index.tsx +1 -1
- package/src/inputs/OtpInput/index.tsx +43 -34
- package/src/inputs/Radio/index.tsx +29 -21
- package/src/inputs/Select/index.tsx +2 -2
- package/src/{Field/utils/index.ts → inputs/registry.ts} +3 -1
- package/src/lazy.js +10 -9
- package/src/registry.js +23 -13
- package/src/types.tsx +12 -5
- package/src/utils.ts +3 -2
- package/src/validators/index.ts +10 -9
- package/src/validators/types.ts +1 -1
- package/src/validators/utils/date.ts +8 -3
- package/src/validators/utils/datetime.ts +8 -3
- package/src/validators/utils/file.ts +2 -2
- package/src/validators/utils/iban.ts +2 -2
- package/src/validators/utils/image.ts +2 -2
- package/src/validators/utils/index.ts +2 -2
- package/src/validators/utils/int.ts +1 -1
- package/src/validators/utils/number.ts +1 -1
- package/src/validators/utils/otp.ts +2 -2
- package/src/validators/utils/phone.ts +2 -2
- package/src/validators/utils/postal_code.ts +2 -2
- package/src/validators/utils/text_limit.ts +2 -2
- package/types.d.ts +8 -4
- package/types.js.map +1 -1
- package/utils.d.ts +1 -1
- package/utils.js.map +2 -2
- package/validators/index.d.ts +5 -5
- package/validators/index.js.map +2 -2
- package/validators/types.d.ts +1 -1
- package/validators/utils/date/index.js +6 -1
- package/validators/utils/date.d.ts +2 -2
- package/validators/utils/date.js.map +2 -2
- package/validators/utils/datetime/index.js +6 -1
- package/validators/utils/datetime.d.ts +2 -2
- package/validators/utils/datetime.js.map +2 -2
- package/validators/utils/file.d.ts +2 -2
- package/validators/utils/file.js.map +1 -1
- package/validators/utils/iban.d.ts +2 -2
- package/validators/utils/iban.js.map +1 -1
- package/validators/utils/image.d.ts +2 -2
- package/validators/utils/image.js.map +1 -1
- package/validators/utils/index.d.ts +2 -2
- package/validators/utils/index.js.map +1 -1
- package/validators/utils/int.d.ts +1 -1
- package/validators/utils/int.js.map +1 -1
- package/validators/utils/number.d.ts +1 -1
- package/validators/utils/number.js.map +1 -1
- package/validators/utils/otp.d.ts +2 -2
- package/validators/utils/otp.js.map +1 -1
- package/validators/utils/phone.d.ts +2 -2
- package/validators/utils/phone.js.map +1 -1
- package/validators/utils/postal_code.d.ts +2 -2
- package/validators/utils/postal_code.js.map +1 -1
- package/validators/utils/text_limit.d.ts +2 -2
- package/validators/utils/text_limit.js.map +1 -1
- package/Field/utils/calculateField/index.js +0 -27
- package/Field/utils/calculateField.d.ts +0 -2
- package/Field/utils/calculateField.js.map +0 -7
- package/Field/utils/index.js.map +0 -7
- package/FieldArray/FormDialog.d.ts +0 -67
- package/FieldArray/FormDialog.js.map +0 -7
- package/FormBuilder/index.test.d.ts +0 -1
- package/FormBuilder/interaction.test.d.ts +0 -1
- package/FormBuilder/scenarios.test.d.ts +0 -88
- package/MultiplicityField/index.test.d.ts +0 -1
- package/Questions/index.spec.d.ts +0 -1
- package/Questions/index.test.d.ts +0 -1
- package/cjs/Field/utils/calculateField/index.js +0 -50
- package/cjs/Field/utils/calculateField.js.map +0 -7
- package/cjs/Field/utils/index.js.map +0 -7
- package/cjs/FieldArray/FormDialog.js.map +0 -7
- package/cjs/inputs/inputsScenarios/index.js +0 -533
- package/cjs/inputs/inputsScenarios.js.map +0 -7
- package/cjs/locales/el.js.map +0 -7
- package/inputs/AutoCompleteInput/index.test.d.ts +0 -1
- package/inputs/Checkboxes/index.test.d.ts +0 -1
- package/inputs/DateInput/index.test.d.ts +0 -1
- package/inputs/DateTimeInput/index.test.d.ts +0 -1
- package/inputs/FileInput/index.test.d.ts +0 -1
- package/inputs/ImageInput/index.test.d.ts +0 -1
- package/inputs/Input/index.test.d.ts +0 -1
- package/inputs/Label/index.test.d.ts +0 -1
- package/inputs/OtpInput/index.test.d.ts +0 -1
- package/inputs/Radio/index.test.d.ts +0 -1
- package/inputs/Select/index.test.d.ts +0 -1
- package/inputs/inputsScenarios/index.js +0 -499
- package/inputs/inputsScenarios.d.ts +0 -296
- package/inputs/inputsScenarios.js.map +0 -7
- package/locales/el/index.js +0 -6
- package/locales/el.d.ts +0 -2
- package/locales/el.js.map +0 -7
- package/src/Field/utils/calculateField.ts +0 -49
- package/src/FieldArray/FormDialog.tsx +0 -568
- package/src/inputs/inputsScenarios.ts +0 -496
- package/src/locales/el.ts +0 -3
- /package/{FieldArray/index.test.d.ts → hooks/__tests__/utils.spec.d.ts} +0 -0
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { useFieldArray } from "react-hook-form";
|
|
3
|
+
import { FieldObject } from "@digigov/form/FieldObject";
|
|
4
|
+
import { FieldsetLabel, Fieldset } from "@digigov/form/Fieldset";
|
|
5
|
+
import { Card } from "@digigov/ui/content/Card";
|
|
6
|
+
import { Button } from "@digigov/ui/form/Button";
|
|
7
|
+
const BaseFieldArray = React.forwardRef(
|
|
8
|
+
({
|
|
9
|
+
name,
|
|
10
|
+
register,
|
|
11
|
+
control,
|
|
12
|
+
formState,
|
|
13
|
+
error,
|
|
14
|
+
getValues,
|
|
15
|
+
Field,
|
|
16
|
+
...customField
|
|
17
|
+
}, ref) => {
|
|
18
|
+
const { append, remove } = useFieldArray({
|
|
19
|
+
control,
|
|
20
|
+
name
|
|
21
|
+
});
|
|
22
|
+
const fields = getValues(name) || [];
|
|
23
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, fields.map((field, index) => /* @__PURE__ */ React.createElement(
|
|
24
|
+
Card,
|
|
25
|
+
{
|
|
26
|
+
variant: customField.extra?.border ? "border" : "divider",
|
|
27
|
+
key: field.id || index
|
|
28
|
+
},
|
|
29
|
+
/* @__PURE__ */ React.createElement(Fieldset, null, /* @__PURE__ */ React.createElement(FieldsetLabel, null, `${customField.extra?.label.object.title}${!customField.extra?.noIndex ? " " + String(index + 1) : ""}`), /* @__PURE__ */ React.createElement(
|
|
30
|
+
FieldObject,
|
|
31
|
+
{
|
|
32
|
+
name: `${name}.${index}`,
|
|
33
|
+
error: Array.isArray(error) && error[index],
|
|
34
|
+
formState,
|
|
35
|
+
register,
|
|
36
|
+
control,
|
|
37
|
+
...customField.extra?.of,
|
|
38
|
+
Field
|
|
39
|
+
}
|
|
40
|
+
), /* @__PURE__ */ React.createElement(
|
|
41
|
+
Button,
|
|
42
|
+
{
|
|
43
|
+
name: `${name}-object-remove`,
|
|
44
|
+
variant: customField.extra?.label.object?.deleteButtonVariant,
|
|
45
|
+
type: "button",
|
|
46
|
+
color: "warning",
|
|
47
|
+
onClick: () => remove(index),
|
|
48
|
+
disabled: !customField?.editable
|
|
49
|
+
},
|
|
50
|
+
customField.extra?.label.object?.delete
|
|
51
|
+
))
|
|
52
|
+
)), customField.editable && /* @__PURE__ */ React.createElement(
|
|
53
|
+
Button,
|
|
54
|
+
{
|
|
55
|
+
ref,
|
|
56
|
+
type: "button",
|
|
57
|
+
name: `${name}-add-object`,
|
|
58
|
+
color: "secondary",
|
|
59
|
+
variant: customField.extra?.label.object?.addButtonVariant,
|
|
60
|
+
onClick: (ev) => {
|
|
61
|
+
ev.preventDefault();
|
|
62
|
+
append({});
|
|
63
|
+
},
|
|
64
|
+
disabled: !customField?.editable
|
|
65
|
+
},
|
|
66
|
+
customField.extra?.label.object?.add
|
|
67
|
+
));
|
|
68
|
+
}
|
|
69
|
+
);
|
|
70
|
+
BaseFieldArray.displayName = "BaseFieldArray";
|
|
71
|
+
var BaseFieldArray_default = BaseFieldArray;
|
|
72
|
+
export {
|
|
73
|
+
BaseFieldArray,
|
|
74
|
+
BaseFieldArray_default as default
|
|
75
|
+
};
|
|
76
|
+
//# sourceMappingURL=BaseFieldArray.js.map
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { FieldArrayProps } from '@digigov/form/FieldArray';
|
|
3
|
+
type BaseFieldArrayProps = Omit<FieldArrayProps, 'registerFieldFocus' | 'trigger' | 'clearErrors' | 'setValue' | 'reset' | 'resetField'>;
|
|
4
|
+
export declare const BaseFieldArray: React.ForwardRefExoticComponent<BaseFieldArrayProps & React.RefAttributes<HTMLButtonElement>>;
|
|
5
|
+
export default BaseFieldArray;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/FieldArray/BaseFieldArray.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { useFieldArray } from 'react-hook-form';\nimport type { FieldArrayProps } from '@digigov/form/FieldArray';\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\ntype BaseFieldArrayProps = Omit<\n FieldArrayProps,\n | 'registerFieldFocus'\n | 'trigger'\n | 'clearErrors'\n | 'setValue'\n | 'reset'\n | 'resetField'\n>;\nexport const BaseFieldArray = React.forwardRef<\n HTMLButtonElement,\n BaseFieldArrayProps\n>(\n (\n {\n name,\n register,\n control,\n formState,\n error,\n getValues,\n Field,\n ...customField\n },\n ref\n ) => {\n const { append, remove } = useFieldArray({\n control,\n name,\n });\n const fields = getValues(name) || [];\n\n return (\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}${!customField.extra?.noIndex ? ' ' + String(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 ref={ref}\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 }\n);\n\nBaseFieldArray.displayName = 'BaseFieldArray';\n\nexport default BaseFieldArray;\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,qBAAqB;AAE9B,SAAS,mBAAmB;AAC5B,SAAS,eAAe,gBAAgB;AACxC,SAAS,YAAY;AACrB,SAAS,cAAc;AAWhB,MAAM,iBAAiB,MAAM;AAAA,EAIlC,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,EAAE,QAAQ,OAAO,IAAI,cAAc;AAAA,MACvC;AAAA,MACA;AAAA,IACF,CAAC;AACD,UAAM,SAAS,UAAU,IAAI,KAAK,CAAC;AAEnC,WACE,0DACG,OAAO,IAAI,CAAC,OAAO,UAClB;AAAA,MAAC;AAAA;AAAA,QACC,SAAS,YAAY,OAAO,SAAS,WAAW;AAAA,QAChD,KAAK,MAAM,MAAM;AAAA;AAAA,MAEjB,oCAAC,gBACC,oCAAC,qBACE,GAAG,YAAY,OAAO,MAAM,OAAO,KAAK,GAAG,CAAC,YAAY,OAAO,UAAU,MAAM,OAAO,QAAQ,CAAC,IAAI,EAAE,EACxG,GACA;AAAA,QAAC;AAAA;AAAA,UACC,MAAM,GAAG,IAAI,IAAI,KAAK;AAAA,UACtB,OAAO,MAAM,QAAQ,KAAK,KAAK,MAAM,KAAK;AAAA,UAC1C;AAAA,UACA;AAAA,UACA;AAAA,UACC,GAAG,YAAY,OAAO;AAAA,UACvB;AAAA;AAAA,MACF,GACA;AAAA,QAAC;AAAA;AAAA,UACC,MAAM,GAAG,IAAI;AAAA,UACb,SAAS,YAAY,OAAO,MAAM,QAAQ;AAAA,UAC1C,MAAK;AAAA,UACL,OAAM;AAAA,UACN,SAAS,MAAM,OAAO,KAAK;AAAA,UAC3B,UAAU,CAAC,aAAa;AAAA;AAAA,QAEvB,YAAY,OAAO,MAAM,QAAQ;AAAA,MACpC,CACF;AAAA,IACF,CACD,GACA,YAAY,YACX;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,MAAM,GAAG,IAAI;AAAA,QACb,OAAM;AAAA,QACN,SAAS,YAAY,OAAO,MAAM,QAAQ;AAAA,QAC1C,SAAS,CAAC,OAAO;AACf,aAAG,eAAe;AAClB,iBAAO,CAAC,CAAC;AAAA,QACX;AAAA,QACA,UAAU,CAAC,aAAa;AAAA;AAAA,MAEvB,YAAY,OAAO,MAAM,QAAQ;AAAA,IACpC,CAEJ;AAAA,EAEJ;AACF;AAEA,eAAe,cAAc;AAE7B,IAAO,yBAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
declare namespace _default {
|
|
2
|
+
export let title: string;
|
|
3
|
+
export { ArrayDisplay as component };
|
|
4
|
+
export let displayName: string;
|
|
5
|
+
}
|
|
6
|
+
export default _default;
|
|
7
|
+
export { Default } from "@digigov/form/FieldArray/FormDialog/ArrayDisplay/__stories__/Default";
|
|
8
|
+
export { Sortable } from "@digigov/form/FieldArray/FormDialog/ArrayDisplay/__stories__/Sortable";
|
|
9
|
+
export { ReadOnly } from "@digigov/form/FieldArray/FormDialog/ArrayDisplay/__stories__/ReadOnly";
|
|
10
|
+
import ArrayDisplay from '@digigov/form/FieldArray/FormDialog/ArrayDisplay';
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { TableDataCell, TableRow } from "@digigov/ui/content";
|
|
3
|
+
import { Button } from "@digigov/ui/form/Button";
|
|
4
|
+
import { Grid, Stack } from "@digigov/ui/layouts";
|
|
5
|
+
import Heading from "@digigov/ui/typography/Heading";
|
|
6
|
+
const ArrayItemDisplay = ({
|
|
7
|
+
name,
|
|
8
|
+
data,
|
|
9
|
+
edit,
|
|
10
|
+
remove,
|
|
11
|
+
disabledEdit,
|
|
12
|
+
disabledDelete,
|
|
13
|
+
disabled,
|
|
14
|
+
sortable,
|
|
15
|
+
index,
|
|
16
|
+
isFirst,
|
|
17
|
+
isLast,
|
|
18
|
+
move,
|
|
19
|
+
valueDisplay,
|
|
20
|
+
border = true,
|
|
21
|
+
wordBreak = "break-all",
|
|
22
|
+
stackProps = {
|
|
23
|
+
spacing: 4,
|
|
24
|
+
alignItems: "flex-end",
|
|
25
|
+
justifyContent: "flex-end",
|
|
26
|
+
direction: "column"
|
|
27
|
+
}
|
|
28
|
+
}) => {
|
|
29
|
+
if (data === void 0 || data === null) {
|
|
30
|
+
return null;
|
|
31
|
+
}
|
|
32
|
+
if (Object.keys(data).length === 0 || Object.keys(data).length === 1 && data.id) {
|
|
33
|
+
return null;
|
|
34
|
+
}
|
|
35
|
+
delete data.id;
|
|
36
|
+
const values = typeof data === "string" ? [data] : Object.values(data || {});
|
|
37
|
+
const borderVariant = border === false || sortable ? "none" : "border";
|
|
38
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TableRow, null, values?.map?.((value, valueIndex) => {
|
|
39
|
+
return /* @__PURE__ */ React.createElement(
|
|
40
|
+
TableDataCell,
|
|
41
|
+
{
|
|
42
|
+
key: valueIndex,
|
|
43
|
+
variant: borderVariant,
|
|
44
|
+
wordBreak,
|
|
45
|
+
pb: sortable ? 0 : void 0,
|
|
46
|
+
pt: sortable ? 4 : void 0
|
|
47
|
+
},
|
|
48
|
+
sortable && valueIndex === 0 && /* @__PURE__ */ React.createElement(Heading, { size: "sm", className: "mb-2" }, "\u0395\u03C0\u03B9\u03BB\u03BF\u03B3\u03AE #", index + 1),
|
|
49
|
+
value?.name || (Array.isArray(value) ? value.join("\n") : valueDisplay ? valueDisplay(value) : value) || ""
|
|
50
|
+
);
|
|
51
|
+
}), disabled === true || disabledEdit === true && disabledDelete === true ? null : /* @__PURE__ */ React.createElement(TableDataCell, { variant: borderVariant }, /* @__PURE__ */ React.createElement(Stack, { ...stackProps }, disabledEdit !== true && /* @__PURE__ */ React.createElement(
|
|
52
|
+
Button,
|
|
53
|
+
{
|
|
54
|
+
variant: "link",
|
|
55
|
+
type: "button",
|
|
56
|
+
onClick: () => {
|
|
57
|
+
edit(name);
|
|
58
|
+
}
|
|
59
|
+
},
|
|
60
|
+
"\u0395\u03C0\u03B5\u03BE\u03B5\u03C1\u03B3\u03B1\u03C3\u03AF\u03B1"
|
|
61
|
+
), disabledDelete !== true && /* @__PURE__ */ React.createElement(
|
|
62
|
+
Button,
|
|
63
|
+
{
|
|
64
|
+
variant: "link",
|
|
65
|
+
type: "button",
|
|
66
|
+
onClick: () => remove(name)
|
|
67
|
+
},
|
|
68
|
+
"\u0394\u03B9\u03B1\u03B3\u03C1\u03B1\u03C6\u03AE"
|
|
69
|
+
)))), sortable && /* @__PURE__ */ React.createElement(TableRow, null, /* @__PURE__ */ React.createElement(
|
|
70
|
+
TableDataCell,
|
|
71
|
+
{
|
|
72
|
+
variant: isLast ? "none" : "border",
|
|
73
|
+
colSpan: disabled === true || disabledEdit === true && disabledDelete === true ? values.length : values.length + 1
|
|
74
|
+
},
|
|
75
|
+
sortable && !disabled && !(isFirst && isLast) && /* @__PURE__ */ React.createElement(Grid, { xs: 12, mt: 2 }, "\u039C\u03B5\u03C4\u03B1\u03BA\u03AF\u03BD\u03B7\u03C3\u03B7", " ", !isFirst && /* @__PURE__ */ React.createElement(React.Fragment, null, "\u03C0\u03C1\u03BF\u03C2 \u03C4\u03B1", " ", /* @__PURE__ */ React.createElement(
|
|
76
|
+
Button,
|
|
77
|
+
{
|
|
78
|
+
type: "button",
|
|
79
|
+
variant: "link",
|
|
80
|
+
onClick: () => move(index, index - 1)
|
|
81
|
+
},
|
|
82
|
+
"\u03C0\u03AC\u03BD\u03C9"
|
|
83
|
+
)), !isFirst && !isLast && " \u03AE ", !isLast && /* @__PURE__ */ React.createElement(React.Fragment, null, "\u03C0\u03C1\u03BF\u03C2 \u03C4\u03B1", " ", /* @__PURE__ */ React.createElement(
|
|
84
|
+
Button,
|
|
85
|
+
{
|
|
86
|
+
type: "button",
|
|
87
|
+
variant: "link",
|
|
88
|
+
onClick: () => move(index, index + 1)
|
|
89
|
+
},
|
|
90
|
+
"\u03BA\u03AC\u03C4\u03C9"
|
|
91
|
+
)))
|
|
92
|
+
)));
|
|
93
|
+
};
|
|
94
|
+
export {
|
|
95
|
+
ArrayItemDisplay
|
|
96
|
+
};
|
|
97
|
+
//# sourceMappingURL=ArrayItemDisplay.js.map
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { UseFieldArrayMove } from 'react-hook-form';
|
|
3
|
+
import type { StackProps } from '@digigov/ui/layouts';
|
|
4
|
+
export interface ArrayItemDisplayProps {
|
|
5
|
+
data: any;
|
|
6
|
+
name: string;
|
|
7
|
+
edit: (name: string) => void;
|
|
8
|
+
remove: (name: string) => void;
|
|
9
|
+
disabledEdit?: boolean;
|
|
10
|
+
disabledDelete?: boolean;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
sortable: boolean;
|
|
13
|
+
index: number;
|
|
14
|
+
isFirst: boolean;
|
|
15
|
+
isLast: boolean;
|
|
16
|
+
move: UseFieldArrayMove;
|
|
17
|
+
valueDisplay?: (value: any) => React.ReactNode;
|
|
18
|
+
border: boolean;
|
|
19
|
+
wordBreak?: 'break-all' | 'none';
|
|
20
|
+
stackProps?: StackProps;
|
|
21
|
+
}
|
|
22
|
+
export declare const ArrayItemDisplay: ({ name, data, edit, remove, disabledEdit, disabledDelete, disabled, sortable, index, isFirst, isLast, move, valueDisplay, border, wordBreak, stackProps, }: ArrayItemDisplayProps) => React.JSX.Element | null;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport type { UseFieldArrayMove } from 'react-hook-form';\nimport { TableDataCell, TableRow } from '@digigov/ui/content';\nimport { Button } from '@digigov/ui/form/Button';\nimport type { StackProps } from '@digigov/ui/layouts';\nimport { Grid, Stack } from '@digigov/ui/layouts';\nimport Heading from '@digigov/ui/typography/Heading';\n\nexport interface ArrayItemDisplayProps {\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\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}: ArrayItemDisplayProps) => {\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"],
|
|
5
|
+
"mappings": "AAAA,OAAO,WAAW;AAElB,SAAS,eAAe,gBAAgB;AACxC,SAAS,cAAc;AAEvB,SAAS,MAAM,aAAa;AAC5B,OAAO,aAAa;AAqBb,MAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,aAAa;AAAA,IACX,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACb;AACF,MAA6B;AAC3B,MAAI,SAAS,UAAa,SAAS,MAAM;AACvC,WAAO;AAAA,EACT;AACA,MACE,OAAO,KAAK,IAAI,EAAE,WAAW,KAC5B,OAAO,KAAK,IAAI,EAAE,WAAW,KAAK,KAAK,IACxC;AACA,WAAO;AAAA,EACT;AACA,SAAO,KAAK;AACZ,QAAM,SACJ,OAAO,SAAS,WAAW,CAAC,IAAI,IAAI,OAAO,OAAO,QAAQ,CAAC,CAAC;AAC9D,QAAM,gBAAgB,WAAW,SAAS,WAAW,SAAS;AAC9D,SACE,0DACE,oCAAC,gBACE,QAAQ,MAAM,CAAC,OAAO,eAAe;AACpC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,SAAS;AAAA,QACT;AAAA,QACA,IAAI,WAAW,IAAI;AAAA,QACnB,IAAI,WAAW,IAAI;AAAA;AAAA,MAElB,YAAY,eAAe,KAC1B,oCAAC,WAAQ,MAAK,MAAK,WAAU,UAAO,gDACxB,QAAQ,CACpB;AAAA,MAEA,OAA+B,SAC9B,MAAM,QAAQ,KAAK,IAChB,MAAM,KAAK,IAAI,IACf,eACE,aAAa,KAAK,IAClB,UACN;AAAA,IACJ;AAAA,EAEJ,CAAC,GACA,aAAa,QACb,iBAAiB,QAAQ,mBAAmB,OAAQ,OACnD,oCAAC,iBAAc,SAAS,iBACtB,oCAAC,SAAO,GAAG,cACR,iBAAiB,QAChB;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,SAAS,MAAM;AACb,aAAK,IAAI;AAAA,MACX;AAAA;AAAA,IACD;AAAA,EAED,GAED,mBAAmB,QAClB;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,SAAS,MAAM,OAAO,IAAI;AAAA;AAAA,IAC3B;AAAA,EAED,CAEJ,CACF,CAEJ,GACC,YACC,oCAAC,gBACC;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,SAAS,SAAS;AAAA,MAC3B,SACE,aAAa,QACZ,iBAAiB,QAAQ,mBAAmB,OACzC,OAAO,SACP,OAAO,SAAS;AAAA;AAAA,IAGrB,YAAY,CAAC,YAAY,EAAE,WAAW,WACrC,oCAAC,QAAK,IAAI,IAAI,IAAI,KAAG,gEACR,KACV,CAAC,WACA,0DAAE,yCACQ,KACR;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,SAAS,MAAM,KAAK,OAAO,QAAQ,CAAC;AAAA;AAAA,MACrC;AAAA,IAED,CACF,GAED,CAAC,WAAW,CAAC,UAAU,YACvB,CAAC,UACA,0DAAE,yCACQ,KACR;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,SAAS,MAAM,KAAK,OAAO,QAAQ,CAAC;AAAA;AAAA,MACrC;AAAA,IAED,CACF,CAEJ;AAAA,EAEJ,CACF,CAEJ;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { TableHead, TableHeadCell, TableRow } from "@digigov/ui/content";
|
|
3
|
+
const ArrayItemHeader = ({ labels, disabled }) => {
|
|
4
|
+
return /* @__PURE__ */ React.createElement(TableHead, null, /* @__PURE__ */ React.createElement(TableRow, null, labels.map((label, index) => {
|
|
5
|
+
return /* @__PURE__ */ React.createElement(TableHeadCell, { key: index }, label);
|
|
6
|
+
}), !disabled && /* @__PURE__ */ React.createElement(TableHeadCell, null, "\u0395\u03BD\u03AD\u03C1\u03B3\u03B5\u03B9\u03B5\u03C2")));
|
|
7
|
+
};
|
|
8
|
+
export {
|
|
9
|
+
ArrayItemHeader
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=ArrayItemHeader.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { TableHead, TableHeadCell, TableRow } from '@digigov/ui/content';\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"],
|
|
5
|
+
"mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,WAAW,eAAe,gBAAgB;AAE5C,MAAM,kBAAkB,CAAC,EAAE,QAAQ,SAAS,MAAM;AACvD,SACE,oCAAC,iBACC,oCAAC,gBACE,OAAO,IAAI,CAAC,OAAO,UAAU;AAC5B,WAAO,oCAAC,iBAAc,KAAK,SAAQ,KAAM;AAAA,EAC3C,CAAC,GACA,CAAC,YAAY,oCAAC,qBAAc,wDAAS,CACxC,CACF;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { UseFieldArrayMove } from 'react-hook-form';
|
|
3
|
+
export interface ArrayDisplayProps {
|
|
4
|
+
fieldArrayName: string;
|
|
5
|
+
fieldArrayValues: any[];
|
|
6
|
+
ofField: any;
|
|
7
|
+
customField: any;
|
|
8
|
+
onEdit: (index: number) => void;
|
|
9
|
+
onRemove: (index: number) => void;
|
|
10
|
+
move: UseFieldArrayMove;
|
|
11
|
+
sortable: boolean;
|
|
12
|
+
}
|
|
13
|
+
export declare const ArrayDisplay: ({ fieldArrayName, fieldArrayValues, ofField, customField, onEdit, onRemove, move, sortable, }: ArrayDisplayProps) => React.JSX.Element;
|
|
14
|
+
export default ArrayDisplay;
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { ArrayItemDisplay } from "@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay";
|
|
3
|
+
import { ArrayItemHeader } from "@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader";
|
|
4
|
+
import { Table, TableBody, TableContainer } from "@digigov/ui/content";
|
|
5
|
+
const ArrayDisplay = ({
|
|
6
|
+
fieldArrayName,
|
|
7
|
+
fieldArrayValues,
|
|
8
|
+
ofField,
|
|
9
|
+
customField,
|
|
10
|
+
onEdit,
|
|
11
|
+
onRemove,
|
|
12
|
+
move,
|
|
13
|
+
sortable
|
|
14
|
+
}) => {
|
|
15
|
+
return /* @__PURE__ */ React.createElement(TableContainer, { ...customField.extra?.tableContainer }, /* @__PURE__ */ React.createElement(Table, { verticalAlign: customField.extra?.verticalAlign }, !customField.extra?.noHeader && ofField?.extra && fieldArrayValues?.length > 0 && /* @__PURE__ */ React.createElement(
|
|
16
|
+
ArrayItemHeader,
|
|
17
|
+
{
|
|
18
|
+
labels: ofField.type === "object" ? ofField.extra.fields.map(({ label }) => label.primary) : [ofField.label.primary],
|
|
19
|
+
disabled: customField?.editable === false
|
|
20
|
+
}
|
|
21
|
+
), /* @__PURE__ */ React.createElement(TableBody, null, fieldArrayValues?.map?.((field, index) => {
|
|
22
|
+
return /* @__PURE__ */ React.createElement(
|
|
23
|
+
ArrayItemDisplay,
|
|
24
|
+
{
|
|
25
|
+
key: index,
|
|
26
|
+
name: `${fieldArrayName}.${index}`,
|
|
27
|
+
index,
|
|
28
|
+
isFirst: index === 0,
|
|
29
|
+
isLast: index === fieldArrayValues.length - 1,
|
|
30
|
+
data: field,
|
|
31
|
+
edit: () => onEdit(index),
|
|
32
|
+
stackProps: customField?.extra?.stackProps,
|
|
33
|
+
wordBreak: customField?.extra?.wordBreak,
|
|
34
|
+
valueDisplay: customField?.extra?.valueDisplay,
|
|
35
|
+
remove: () => onRemove(index),
|
|
36
|
+
border: customField.extra?.border,
|
|
37
|
+
move,
|
|
38
|
+
sortable,
|
|
39
|
+
disabledEdit: sortable ? true : customField.extra?.noEdit ?? false,
|
|
40
|
+
disabledDelete: customField.extra?.noDelete ?? false,
|
|
41
|
+
disabled: customField?.editable === false
|
|
42
|
+
}
|
|
43
|
+
);
|
|
44
|
+
}))));
|
|
45
|
+
};
|
|
46
|
+
var ArrayDisplay_default = ArrayDisplay;
|
|
47
|
+
export {
|
|
48
|
+
ArrayDisplay,
|
|
49
|
+
ArrayDisplay_default as default
|
|
50
|
+
};
|
|
51
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/FieldArray/FormDialog/ArrayDisplay/index.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport type { UseFieldArrayMove } from 'react-hook-form';\nimport { ArrayItemDisplay } from '@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay';\nimport { ArrayItemHeader } from '@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader';\nimport { Table, TableBody, TableContainer } from '@digigov/ui/content';\n\nexport interface ArrayDisplayProps {\n fieldArrayName: string;\n fieldArrayValues: any[];\n ofField: any;\n customField: any;\n onEdit: (index: number) => void;\n onRemove: (index: number) => void;\n move: UseFieldArrayMove;\n sortable: boolean;\n}\n\nexport const ArrayDisplay = ({\n fieldArrayName,\n fieldArrayValues,\n ofField,\n customField,\n onEdit,\n onRemove,\n move,\n sortable,\n}: ArrayDisplayProps) => {\n return (\n <TableContainer {...customField.extra?.tableContainer}>\n <Table verticalAlign={customField.extra?.verticalAlign}>\n {!customField.extra?.noHeader &&\n ofField?.extra &&\n fieldArrayValues?.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 {fieldArrayValues?.map?.((field, index) => {\n return (\n <ArrayItemDisplay\n key={index}\n name={`${fieldArrayName}.${index}`}\n index={index}\n isFirst={index === 0}\n isLast={index === fieldArrayValues.length - 1}\n data={field}\n edit={() => onEdit(index)}\n stackProps={customField?.extra?.stackProps}\n wordBreak={customField?.extra?.wordBreak}\n valueDisplay={customField?.extra?.valueDisplay}\n remove={() => onRemove(index)}\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};\n\nexport default ArrayDisplay;\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,WAAW;AAElB,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,OAAO,WAAW,sBAAsB;AAa1C,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAyB;AACvB,SACE,oCAAC,kBAAgB,GAAG,YAAY,OAAO,kBACrC,oCAAC,SAAM,eAAe,YAAY,OAAO,iBACtC,CAAC,YAAY,OAAO,YACnB,SAAS,SACT,kBAAkB,SAAS,KACzB;AAAA,IAAC;AAAA;AAAA,MACC,QACE,QAAQ,SAAS,WACb,QAAQ,MAAM,OAAO,IAAI,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,IACrD,CAAC,QAAQ,MAAM,OAAO;AAAA,MAE5B,UAAU,aAAa,aAAa;AAAA;AAAA,EACtC,GAEJ,oCAAC,iBACE,kBAAkB,MAAM,CAAC,OAAO,UAAU;AACzC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,MAAM,GAAG,cAAc,IAAI,KAAK;AAAA,QAChC;AAAA,QACA,SAAS,UAAU;AAAA,QACnB,QAAQ,UAAU,iBAAiB,SAAS;AAAA,QAC5C,MAAM;AAAA,QACN,MAAM,MAAM,OAAO,KAAK;AAAA,QACxB,YAAY,aAAa,OAAO;AAAA,QAChC,WAAW,aAAa,OAAO;AAAA,QAC/B,cAAc,aAAa,OAAO;AAAA,QAClC,QAAQ,MAAM,SAAS,KAAK;AAAA,QAC5B,QAAQ,YAAY,OAAO;AAAA,QAC3B;AAAA,QACA;AAAA,QACA,cACE,WAAW,OAAQ,YAAY,OAAO,UAAU;AAAA,QAElD,gBAAgB,YAAY,OAAO,YAAY;AAAA,QAC/C,UAAU,aAAa,aAAa;AAAA;AAAA,IACtC;AAAA,EAEJ,CAAC,CACH,CACF,CACF;AAEJ;AAEA,IAAO,uBAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,149 @@
|
|
|
1
|
+
import React, { useCallback, useEffect, useMemo, useRef } from "react";
|
|
2
|
+
import { createPortal } from "react-dom";
|
|
3
|
+
import { useForm } from "react-hook-form";
|
|
4
|
+
import { FieldObject } from "@digigov/form/FieldObject";
|
|
5
|
+
import { Fieldset } from "@digigov/form/Fieldset";
|
|
6
|
+
import { FormContext, useFormContext } from "@digigov/form/FormContext";
|
|
7
|
+
import { yupResolver } from "@digigov/form/utils";
|
|
8
|
+
import { useValidationSchema } from "@digigov/form/validators";
|
|
9
|
+
import {
|
|
10
|
+
Modal,
|
|
11
|
+
ModalAction,
|
|
12
|
+
ModalContent,
|
|
13
|
+
ModalHeading
|
|
14
|
+
} from "@digigov/ui/app/Modal";
|
|
15
|
+
import { Button } from "@digigov/ui/form/Button";
|
|
16
|
+
import { Hint } from "@digigov/ui/typography/Hint";
|
|
17
|
+
const ArrayEditModal = React.forwardRef(function ArrayEditModal2({
|
|
18
|
+
type,
|
|
19
|
+
title,
|
|
20
|
+
hint,
|
|
21
|
+
defaultValue,
|
|
22
|
+
editOrAppend,
|
|
23
|
+
cancel,
|
|
24
|
+
addTitle,
|
|
25
|
+
editLabel,
|
|
26
|
+
editProps,
|
|
27
|
+
appendLabel,
|
|
28
|
+
appendProps,
|
|
29
|
+
cancelLabel,
|
|
30
|
+
cancelProps,
|
|
31
|
+
ofField,
|
|
32
|
+
error,
|
|
33
|
+
Field,
|
|
34
|
+
currentIndex,
|
|
35
|
+
...modalProps
|
|
36
|
+
}, ref) {
|
|
37
|
+
const parentCtx = useFormContext();
|
|
38
|
+
const schema = useValidationSchema(
|
|
39
|
+
ofField.type === "object" && ofField.extra.fields ? Object.values(ofField.extra.fields) : [ofField]
|
|
40
|
+
);
|
|
41
|
+
const resolver = useMemo(() => {
|
|
42
|
+
if (!schema) return;
|
|
43
|
+
return yupResolver(schema);
|
|
44
|
+
}, [schema]);
|
|
45
|
+
const form = useForm({
|
|
46
|
+
resolver,
|
|
47
|
+
mode: "onSubmit",
|
|
48
|
+
reValidateMode: "onSubmit",
|
|
49
|
+
shouldFocusError: true,
|
|
50
|
+
criteriaMode: "all"
|
|
51
|
+
});
|
|
52
|
+
const { reset, setValue } = form;
|
|
53
|
+
useEffect(() => {
|
|
54
|
+
if (modalProps.open) {
|
|
55
|
+
reset(void 0);
|
|
56
|
+
if (defaultValue) {
|
|
57
|
+
Object.entries(defaultValue).forEach(([key, value]) => {
|
|
58
|
+
setValue(key, value);
|
|
59
|
+
});
|
|
60
|
+
}
|
|
61
|
+
if (type === "append" && ofField?.type === "object" && ofField.extra?.fields) {
|
|
62
|
+
ofField.extra.fields.forEach((field) => {
|
|
63
|
+
if (defaultValue && defaultValue[field.key] !== void 0) return;
|
|
64
|
+
switch (field.type) {
|
|
65
|
+
case "array":
|
|
66
|
+
setValue(field.key, []);
|
|
67
|
+
break;
|
|
68
|
+
case "object":
|
|
69
|
+
setValue(field.key, {});
|
|
70
|
+
break;
|
|
71
|
+
default:
|
|
72
|
+
setValue(field.key, "");
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
}, [modalProps.open, defaultValue, reset, setValue, type, ofField]);
|
|
78
|
+
const onSubmit = useCallback(
|
|
79
|
+
(data) => {
|
|
80
|
+
editOrAppend(data);
|
|
81
|
+
},
|
|
82
|
+
[editOrAppend]
|
|
83
|
+
);
|
|
84
|
+
const handleSubmitWithoutPropagation = (e) => {
|
|
85
|
+
e.preventDefault();
|
|
86
|
+
e.stopPropagation();
|
|
87
|
+
return form.handleSubmit(onSubmit)(e);
|
|
88
|
+
};
|
|
89
|
+
const formRef = useRef(null);
|
|
90
|
+
const ctx = {
|
|
91
|
+
...parentCtx,
|
|
92
|
+
control: form.control,
|
|
93
|
+
register: form.register,
|
|
94
|
+
watch: form.watch,
|
|
95
|
+
resetField: form.resetField,
|
|
96
|
+
registerField: () => {
|
|
97
|
+
},
|
|
98
|
+
// If we use parent registerField, validation breaks
|
|
99
|
+
registerFieldFocus: () => {
|
|
100
|
+
return () => {
|
|
101
|
+
};
|
|
102
|
+
},
|
|
103
|
+
errors: form.formState.errors,
|
|
104
|
+
formState: form.formState,
|
|
105
|
+
reset: form.reset,
|
|
106
|
+
trigger: form.trigger,
|
|
107
|
+
getFieldState: form.getFieldState,
|
|
108
|
+
setValue: form.setValue,
|
|
109
|
+
clearErrors: form.clearErrors,
|
|
110
|
+
getValues: form.getValues,
|
|
111
|
+
getValuesFromParentForm: parentCtx.getValues,
|
|
112
|
+
unregister: form.unregister,
|
|
113
|
+
setError: form.setError,
|
|
114
|
+
formRef,
|
|
115
|
+
submit: form.handleSubmit(onSubmit)
|
|
116
|
+
};
|
|
117
|
+
return /* @__PURE__ */ React.createElement(ModalPortal, { ...modalProps, ref, "aria-labelledby": "modal-label" }, /* @__PURE__ */ React.createElement(FormContext.Provider, { value: ctx }, /* @__PURE__ */ React.createElement("form", { onSubmit: handleSubmitWithoutPropagation, ref: formRef }, /* @__PURE__ */ React.createElement(ModalHeading, { id: "modal-label" }, title ? title : type === "edit" ? "\u0395\u03C0\u03B5\u03BE\u03B5\u03C1\u03B3\u03B1\u03C3\u03AF\u03B1" : addTitle || "\u03A0\u03C1\u03BF\u03C3\u03B8\u03AE\u03BA\u03B7"), /* @__PURE__ */ React.createElement(ModalContent, null, hint && /* @__PURE__ */ React.createElement(Hint, null, hint), /* @__PURE__ */ React.createElement(Fieldset, null, ofField?.type === "object" ? /* @__PURE__ */ React.createElement(
|
|
118
|
+
FieldObject,
|
|
119
|
+
{
|
|
120
|
+
...ofField,
|
|
121
|
+
defaultValue: defaultValue || void 0,
|
|
122
|
+
error: error && error[currentIndex],
|
|
123
|
+
formState: form.formState,
|
|
124
|
+
register: form.register,
|
|
125
|
+
control: form.control,
|
|
126
|
+
name: void 0,
|
|
127
|
+
Field
|
|
128
|
+
}
|
|
129
|
+
) : /* @__PURE__ */ React.createElement(Field, { error: error && error[currentIndex], ...ofField }))), /* @__PURE__ */ React.createElement(ModalAction, null, type === "edit" ? /* @__PURE__ */ React.createElement(Button, { color: "secondary", ...editProps, type: "submit" }, editLabel || "\u0391\u03C0\u03BF\u03B8\u03AE\u03BA\u03B5\u03C5\u03C3\u03B7") : /* @__PURE__ */ React.createElement(Button, { color: "primary", ...appendProps, type: "submit" }, appendLabel || "\u03A0\u03C1\u03BF\u03C3\u03B8\u03AE\u03BA\u03B7"), /* @__PURE__ */ React.createElement(
|
|
130
|
+
Button,
|
|
131
|
+
{
|
|
132
|
+
variant: "link",
|
|
133
|
+
type: "button",
|
|
134
|
+
...cancelProps,
|
|
135
|
+
onClick: (e) => {
|
|
136
|
+
e.preventDefault();
|
|
137
|
+
cancel();
|
|
138
|
+
}
|
|
139
|
+
},
|
|
140
|
+
cancelLabel || "\u0391\u03BA\u03CD\u03C1\u03C9\u03C3\u03B7"
|
|
141
|
+
)))));
|
|
142
|
+
});
|
|
143
|
+
const ModalPortal = (props) => {
|
|
144
|
+
return createPortal(/* @__PURE__ */ React.createElement(Modal, { ...props }), document.body);
|
|
145
|
+
};
|
|
146
|
+
export {
|
|
147
|
+
ArrayEditModal
|
|
148
|
+
};
|
|
149
|
+
//# sourceMappingURL=ArrayEditModal.js.map
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ErrorOption } from 'react-hook-form';
|
|
3
|
+
import type { FieldProps, FormData } from '@digigov/form/Field/types';
|
|
4
|
+
import type { ModalProps } from '@digigov/ui/app/Modal';
|
|
5
|
+
export interface ArrayEditModalProps extends Omit<ModalProps, 'children'> {
|
|
6
|
+
type: 'append' | 'edit';
|
|
7
|
+
name: string;
|
|
8
|
+
title?: string;
|
|
9
|
+
hint?: string;
|
|
10
|
+
editOrAppend: (data: FormData) => void;
|
|
11
|
+
cancel: () => void;
|
|
12
|
+
addTitle?: string;
|
|
13
|
+
editLabel?: string;
|
|
14
|
+
editProps?: any;
|
|
15
|
+
appendLabel?: string;
|
|
16
|
+
appendProps?: any;
|
|
17
|
+
cancelLabel?: string;
|
|
18
|
+
cancelProps?: any;
|
|
19
|
+
ofField?: any;
|
|
20
|
+
arrayItemName: string;
|
|
21
|
+
defaultValue?: any;
|
|
22
|
+
Field: React.FC<FieldProps>;
|
|
23
|
+
error?: ErrorOption;
|
|
24
|
+
currentIndex: number;
|
|
25
|
+
}
|
|
26
|
+
export declare const ArrayEditModal: React.ForwardRefExoticComponent<Omit<ArrayEditModalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/FieldArray/FormDialog/ArrayEditModal.tsx"],
|
|
4
|
+
"sourcesContent": ["import React, { useCallback, useEffect, useMemo, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport type { ErrorOption, UseFormProps } from 'react-hook-form';\nimport { useForm } from 'react-hook-form';\nimport type {\n FieldProps,\n FieldSpec,\n FormData,\n} from '@digigov/form/Field/types';\nimport { FieldObject } from '@digigov/form/FieldObject';\nimport { Fieldset } from '@digigov/form/Fieldset';\nimport { FormContext, useFormContext } from '@digigov/form/FormContext';\nimport { yupResolver } from '@digigov/form/utils';\nimport { useValidationSchema } from '@digigov/form/validators';\nimport type { ModalProps } from '@digigov/ui/app/Modal';\nimport {\n Modal,\n ModalAction,\n ModalContent,\n ModalHeading,\n} from '@digigov/ui/app/Modal';\nimport { Button } from '@digigov/ui/form/Button';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nexport interface ArrayEditModalProps extends Omit<ModalProps, 'children'> {\n type: 'append' | 'edit';\n name: string;\n title?: string;\n hint?: string;\n editOrAppend: (data: FormData) => 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 ofField?: any;\n arrayItemName: string;\n defaultValue?: any;\n Field: React.FC<FieldProps>;\n error?: ErrorOption;\n currentIndex: number;\n}\n\nexport const ArrayEditModal = React.forwardRef<\n HTMLDivElement,\n ArrayEditModalProps\n>(function ArrayEditModal(\n {\n type,\n title,\n hint,\n defaultValue,\n editOrAppend,\n cancel,\n addTitle,\n editLabel,\n editProps,\n appendLabel,\n appendProps,\n cancelLabel,\n cancelProps,\n ofField,\n error,\n Field,\n currentIndex,\n ...modalProps\n },\n ref\n) {\n const parentCtx = useFormContext();\n const schema = useValidationSchema(\n ofField.type === 'object' && ofField.extra.fields\n ? Object.values(ofField.extra.fields)\n : [ofField]\n );\n\n const resolver: UseFormProps['resolver'] = useMemo(() => {\n if (!schema) return;\n\n return yupResolver(schema);\n }, [schema]);\n\n const form = useForm({\n resolver,\n mode: 'onSubmit',\n reValidateMode: 'onSubmit',\n shouldFocusError: true,\n criteriaMode: 'all',\n });\n\n const { reset, setValue } = form;\n\n // Reset form and set default values when modal opens\n useEffect(() => {\n if (modalProps.open) {\n // Reset form first to clear any previous values\n reset(undefined);\n\n // Set default values if they exist\n if (defaultValue) {\n Object.entries(defaultValue).forEach(([key, value]) => {\n setValue(key, value);\n });\n }\n\n if (\n type === 'append' &&\n ofField?.type === 'object' &&\n ofField.extra?.fields\n ) {\n // For append mode, set empty values for all fields in case no defaultValue is provided\n ofField.extra.fields.forEach((field: FieldSpec) => {\n if (defaultValue && defaultValue[field.key] !== undefined) return;\n switch (field.type) {\n case 'array':\n setValue(field.key, []);\n break;\n case 'object':\n setValue(field.key, {});\n break;\n default:\n // TODO: This replicates legacy behaviour. Maybe reconsider this?\n setValue(field.key, '');\n }\n });\n }\n }\n }, [modalProps.open, defaultValue, reset, setValue, type, ofField]);\n\n const onSubmit = useCallback(\n (data: FormData): void => {\n editOrAppend(data);\n },\n [editOrAppend]\n );\n\n const handleSubmitWithoutPropagation = (e: React.FormEvent) => {\n e.preventDefault();\n e.stopPropagation();\n return form.handleSubmit(onSubmit)(e);\n };\n\n const formRef = useRef(null);\n\n const ctx = {\n ...parentCtx,\n control: form.control,\n register: form.register,\n watch: form.watch,\n resetField: form.resetField,\n registerField: () => {}, // If we use parent registerField, validation breaks\n registerFieldFocus: () => {\n return () => {};\n },\n errors: form.formState.errors,\n formState: form.formState,\n reset: form.reset,\n trigger: form.trigger,\n getFieldState: form.getFieldState,\n setValue: form.setValue,\n clearErrors: form.clearErrors,\n getValues: form.getValues,\n getValuesFromParentForm: parentCtx.getValues,\n unregister: form.unregister,\n setError: form.setError,\n formRef,\n submit: form.handleSubmit(onSubmit),\n };\n\n return (\n <ModalPortal {...modalProps} ref={ref} aria-labelledby=\"modal-label\">\n <FormContext.Provider value={ctx}>\n <form onSubmit={handleSubmitWithoutPropagation} ref={formRef}>\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 <Fieldset>\n {ofField?.type === 'object' ? (\n <FieldObject\n {...ofField}\n defaultValue={defaultValue || undefined}\n error={error && error[currentIndex]}\n formState={form.formState}\n register={form.register}\n control={form.control}\n name={undefined}\n Field={Field}\n />\n ) : (\n <Field error={error && error[currentIndex]} {...ofField} />\n )}\n </Fieldset>\n </ModalContent>\n <ModalAction>\n {type === 'edit' ? (\n <Button color=\"secondary\" {...editProps} type=\"submit\">\n {editLabel || '\u0391\u03C0\u03BF\u03B8\u03AE\u03BA\u03B5\u03C5\u03C3\u03B7'}\n </Button>\n ) : (\n <Button color=\"primary\" {...appendProps} type=\"submit\">\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 </form>\n </FormContext.Provider>\n </ModalPortal>\n );\n});\n\nconst ModalPortal = (props: ModalProps) => {\n return createPortal(<Modal {...props} />, document.body);\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["ArrayEditModal"]
|
|
7
|
+
}
|