@digigov/form 2.0.0-a402a664 → 2.0.0-abd768eb

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.
Files changed (88) hide show
  1. package/Field/FieldBase/index.js +1 -1
  2. package/Field/FieldBase.js.map +2 -2
  3. package/Field/FieldBaseContainer/index.js +36 -19
  4. package/Field/FieldBaseContainer.d.ts +1 -1
  5. package/Field/FieldBaseContainer.js.map +2 -2
  6. package/FieldArray/index.js +20 -1
  7. package/FieldArray/index.js.map +2 -2
  8. package/FormBuilder/index.js +0 -1
  9. package/FormBuilder/index.js.map +2 -2
  10. package/cjs/Field/FieldBase/index.js +1 -1
  11. package/cjs/Field/FieldBase.js.map +2 -2
  12. package/cjs/Field/FieldBaseContainer/index.js +36 -19
  13. package/cjs/Field/FieldBaseContainer.js.map +2 -2
  14. package/cjs/FieldArray/index.js +19 -0
  15. package/cjs/FieldArray/index.js.map +2 -2
  16. package/cjs/FormBuilder/index.js +0 -1
  17. package/cjs/FormBuilder/index.js.map +2 -2
  18. package/cjs/inputs/Checkboxes/index.js +1 -1
  19. package/cjs/inputs/Checkboxes/index.js.map +2 -2
  20. package/cjs/inputs/DateInput/index.js +26 -11
  21. package/cjs/inputs/DateInput/index.js.map +2 -2
  22. package/cjs/inputs/DateTimeInput/index.js +54 -33
  23. package/cjs/inputs/DateTimeInput/index.js.map +2 -2
  24. package/cjs/inputs/FileInput/index.js +42 -24
  25. package/cjs/inputs/FileInput/index.js.map +2 -2
  26. package/cjs/registry/index.js +4 -4
  27. package/cjs/registry.js.map +2 -2
  28. package/cjs/validators/index.js +1 -1
  29. package/cjs/validators/index.js.map +2 -2
  30. package/cjs/validators/utils/date/index.js +26 -3
  31. package/cjs/validators/utils/date.js.map +2 -2
  32. package/cjs/validators/utils/datetime/index.js +118 -24
  33. package/cjs/validators/utils/datetime.js.map +2 -2
  34. package/index.js +1 -1
  35. package/inputs/Checkboxes/index.js +1 -1
  36. package/inputs/Checkboxes/index.js.map +2 -2
  37. package/inputs/DateInput/DateInput.stories.d.ts +4 -0
  38. package/inputs/DateInput/__stories__/WithDefaultValue.d.ts +3 -0
  39. package/inputs/DateInput/__stories__/WithInitialValue.d.ts +3 -0
  40. package/inputs/DateInput/__stories__/WithWrongDefaultValue.d.ts +3 -0
  41. package/inputs/DateInput/__stories__/WithWrongInitialValue.d.ts +3 -0
  42. package/inputs/DateInput/index.js +27 -12
  43. package/inputs/DateInput/index.js.map +2 -2
  44. package/inputs/DateTimeInput/DateTimeInput.stories.d.ts +8 -3
  45. package/inputs/DateTimeInput/__stories__/WithDefaultValue.d.ts +3 -0
  46. package/inputs/DateTimeInput/__stories__/WithInitialValue.d.ts +3 -0
  47. package/inputs/DateTimeInput/__stories__/WithWrongDefaultValue.d.ts +3 -0
  48. package/inputs/DateTimeInput/__stories__/WithWrongInitialValue.d.ts +3 -0
  49. package/inputs/DateTimeInput/index.js +55 -34
  50. package/inputs/DateTimeInput/index.js.map +2 -2
  51. package/inputs/FileInput/index.d.ts +5 -1
  52. package/inputs/FileInput/index.js +43 -25
  53. package/inputs/FileInput/index.js.map +2 -2
  54. package/package.json +4 -4
  55. package/registry/index.js +4 -4
  56. package/src/Field/FieldBase.tsx +1 -1
  57. package/src/Field/FieldBaseContainer.tsx +67 -51
  58. package/src/FieldArray/index.tsx +28 -1
  59. package/src/FormBuilder/index.tsx +0 -1
  60. package/src/FormBuilder/scenarios.test.tsx +759 -1
  61. package/src/inputs/Checkboxes/index.tsx +1 -5
  62. package/src/inputs/DateInput/DateInput.stories.js +4 -0
  63. package/src/inputs/DateInput/__stories__/WithDefaultValue.tsx +26 -0
  64. package/src/inputs/DateInput/__stories__/WithInitialValue.tsx +28 -0
  65. package/src/inputs/DateInput/__stories__/WithWrongDefaultValue.tsx +26 -0
  66. package/src/inputs/DateInput/__stories__/WithWrongInitialValue.tsx +28 -0
  67. package/src/inputs/DateInput/index.test.tsx +16 -0
  68. package/src/inputs/DateInput/index.tsx +30 -12
  69. package/src/inputs/DateTimeInput/DateTimeInput.stories.js +9 -6
  70. package/src/inputs/DateTimeInput/__stories__/WithDefaultValue.tsx +26 -0
  71. package/src/inputs/DateTimeInput/__stories__/WithInitialValue.tsx +28 -0
  72. package/src/inputs/DateTimeInput/__stories__/WithWrongDefaultValue.tsx +26 -0
  73. package/src/inputs/DateTimeInput/__stories__/WithWrongInitialValue.tsx +28 -0
  74. package/src/inputs/DateTimeInput/index.test.tsx +16 -0
  75. package/src/inputs/DateTimeInput/index.tsx +58 -34
  76. package/src/inputs/FileInput/index.tsx +70 -39
  77. package/src/registry.js +4 -4
  78. package/src/validators/index.ts +1 -1
  79. package/src/validators/utils/date.ts +28 -4
  80. package/src/validators/utils/datetime.ts +121 -29
  81. package/validators/index.js +1 -1
  82. package/validators/index.js.map +2 -2
  83. package/validators/utils/date/index.js +26 -3
  84. package/validators/utils/date.d.ts +1 -1
  85. package/validators/utils/date.js.map +2 -2
  86. package/validators/utils/datetime/index.js +118 -24
  87. package/validators/utils/datetime.d.ts +1 -1
  88. package/validators/utils/datetime.js.map +2 -2
@@ -46,7 +46,7 @@ const Checkboxes = ({
46
46
  }) => {
47
47
  if (!value) value = [];
48
48
  const handleChange = (optionValue, idx, show) => (evt) => {
49
- let newValue;
49
+ let newValue = [];
50
50
  if (evt.currentTarget.checked) {
51
51
  newValue = value.concat([optionValue]);
52
52
  } else {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/inputs/Checkboxes/index.tsx"],
4
- "sourcesContent": ["import React, { useState } from 'react';\nimport { ControlledFieldProps } from '@digigov/form/Field/types';\nimport { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport {\n Checkbox,\n CheckboxItem,\n CheckboxConditional,\n} from '@digigov/ui/form/Checkbox';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nexport interface CheckboxesProps\n extends Omit<ControlledFieldProps, 'extra' | 'value'> {\n value?: string[];\n extra: {\n className?: string;\n options: FieldOptionProps[];\n };\n fieldComponent: React.FC<Omit<ControlledFieldProps, 'value' | 'onChange'>>;\n}\n\nexport const Checkboxes: React.FC<CheckboxesProps> = ({\n name,\n onChange,\n value,\n extra: { options, className },\n disabled,\n Field,\n ...props\n}) => {\n if (!value) value = [];\n const handleChange =\n (optionValue, idx, show) =>\n (evt): void => {\n let newValue;\n if (evt.currentTarget.checked) {\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n newValue = value.concat([optionValue]);\n } else {\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n newValue = value.filter((val) => val !== optionValue);\n }\n if (show && show.length > 0) {\n setChecked((items) =>\n items.map((item, index) => (index === idx ? !item : item))\n );\n }\n\n // reset value to undefined instead of an empty array\n // so the error state mechanism can throw validation errors\n if (newValue.length === 0) newValue = undefined;\n onChange(newValue);\n };\n const { t } = useTranslation();\n const [checked, setChecked] = useState(\n Array<boolean>(options.length).fill(false)\n );\n return (\n <Checkbox className={className}>\n {options.map(\n (\n {\n label,\n value: v,\n show,\n disabled: optionDisabled,\n selected,\n ...option\n },\n index\n ) => (\n <React.Fragment key={index}>\n <CheckboxItem\n key={`${name}.${index}`}\n name={`${name}.${v}`}\n id={`${name}.${v}`}\n value={v}\n disabled={disabled || optionDisabled}\n checked={value?.includes(v)}\n onChange={handleChange(v, index, show)}\n {...option}\n {...{\n ...props,\n reset: undefined,\n defaultValue: undefined,\n error: undefined,\n onBlur: undefined,\n required: undefined,\n 'aria-describedby': undefined,\n type: 'checkbox',\n }}\n >\n {(label && label.primary && t(label.primary)) || value}\n {label && label.secondary && <Hint>{t(label.secondary)}</Hint>}\n </CheckboxItem>\n\n {!!checked[index] && show && Field && (\n <CheckboxConditional>\n {show.map((fieldName) => (\n <Field name={fieldName} key={fieldName} />\n ))}\n </CheckboxConditional>\n )}\n {selected && selected()}\n </React.Fragment>\n )\n )}\n </Checkbox>\n );\n};\n\nexport default Checkboxes;\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgC;AAGhC,sBAIO;AACP,kBAA+B;AAC/B,kBAAqB;AAYd,MAAM,aAAwC,CAAC;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO,EAAE,SAAS,UAAU;AAAA,EAC5B;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,MAAI,CAAC,MAAO,SAAQ,CAAC;AACrB,QAAM,eACJ,CAAC,aAAa,KAAK,SACnB,CAAC,QAAc;AACb,QAAI;AACJ,QAAI,IAAI,cAAc,SAAS;AAG7B,iBAAW,MAAM,OAAO,CAAC,WAAW,CAAC;AAAA,IACvC,OAAO;AAGL,iBAAW,MAAM,OAAO,CAAC,QAAQ,QAAQ,WAAW;AAAA,IACtD;AACA,QAAI,QAAQ,KAAK,SAAS,GAAG;AAC3B;AAAA,QAAW,CAAC,UACV,MAAM,IAAI,CAAC,MAAM,UAAW,UAAU,MAAM,CAAC,OAAO,IAAK;AAAA,MAC3D;AAAA,IACF;AAIA,QAAI,SAAS,WAAW,EAAG,YAAW;AACtC,aAAS,QAAQ;AAAA,EACnB;AACF,QAAM,EAAE,EAAE,QAAI,4BAAe;AAC7B,QAAM,CAAC,SAAS,UAAU,QAAI;AAAA,IAC5B,MAAe,QAAQ,MAAM,EAAE,KAAK,KAAK;AAAA,EAC3C;AACA,SACE,6BAAAA,QAAA,cAAC,4BAAS,aACP,QAAQ;AAAA,IACP,CACE;AAAA,MACE;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,UAAU;AAAA,MACV;AAAA,MACA,GAAG;AAAA,IACL,GACA,UAEA,6BAAAA,QAAA,cAAC,aAAAA,QAAM,UAAN,EAAe,KAAK,SACnB,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,KAAK,GAAG,IAAI,IAAI,KAAK;AAAA,QACrB,MAAM,GAAG,IAAI,IAAI,CAAC;AAAA,QAClB,IAAI,GAAG,IAAI,IAAI,CAAC;AAAA,QAChB,OAAO;AAAA,QACP,UAAU,YAAY;AAAA,QACtB,SAAS,OAAO,SAAS,CAAC;AAAA,QAC1B,UAAU,aAAa,GAAG,OAAO,IAAI;AAAA,QACpC,GAAG;AAAA,QACH,GAAG;AAAA,UACF,GAAG;AAAA,UACH,OAAO;AAAA,UACP,cAAc;AAAA,UACd,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,oBAAoB;AAAA,UACpB,MAAM;AAAA,QACR;AAAA;AAAA,MAEE,SAAS,MAAM,WAAW,EAAE,MAAM,OAAO,KAAM;AAAA,MAChD,SAAS,MAAM,aAAa,6BAAAA,QAAA,cAAC,wBAAM,EAAE,MAAM,SAAS,CAAE;AAAA,IACzD,GAEC,CAAC,CAAC,QAAQ,KAAK,KAAK,QAAQ,SAC3B,6BAAAA,QAAA,cAAC,2CACE,KAAK,IAAI,CAAC,cACT,6BAAAA,QAAA,cAAC,SAAM,MAAM,WAAW,KAAK,WAAW,CACzC,CACH,GAED,YAAY,SAAS,CACxB;AAAA,EAEJ,CACF;AAEJ;AAEA,IAAO,qBAAQ;",
4
+ "sourcesContent": ["import React, { useState } from 'react';\nimport { ControlledFieldProps } from '@digigov/form/Field/types';\nimport { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport {\n Checkbox,\n CheckboxItem,\n CheckboxConditional,\n} from '@digigov/ui/form/Checkbox';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nexport interface CheckboxesProps\n extends Omit<ControlledFieldProps, 'extra' | 'value'> {\n value?: string[];\n extra: {\n className?: string;\n options: FieldOptionProps[];\n };\n fieldComponent: React.FC<Omit<ControlledFieldProps, 'value' | 'onChange'>>;\n}\n\nexport const Checkboxes: React.FC<CheckboxesProps> = ({\n name,\n onChange,\n value,\n extra: { options, className },\n disabled,\n Field,\n ...props\n}) => {\n if (!value) value = [];\n const handleChange =\n (optionValue, idx, show) =>\n (evt): void => {\n let newValue: any = [];\n if (evt.currentTarget.checked) {\n newValue = value.concat([optionValue]);\n } else {\n newValue = value.filter((val) => val !== optionValue);\n }\n if (show && show.length > 0) {\n setChecked((items) =>\n items.map((item, index) => (index === idx ? !item : item))\n );\n }\n\n // reset value to undefined instead of an empty array\n // so the error state mechanism can throw validation errors\n if (newValue.length === 0) newValue = undefined;\n onChange(newValue);\n };\n const { t } = useTranslation();\n const [checked, setChecked] = useState(\n Array<boolean>(options.length).fill(false)\n );\n return (\n <Checkbox className={className}>\n {options.map(\n (\n {\n label,\n value: v,\n show,\n disabled: optionDisabled,\n selected,\n ...option\n },\n index\n ) => (\n <React.Fragment key={index}>\n <CheckboxItem\n key={`${name}.${index}`}\n name={`${name}.${v}`}\n id={`${name}.${v}`}\n value={v}\n disabled={disabled || optionDisabled}\n checked={value?.includes(v)}\n onChange={handleChange(v, index, show)}\n {...option}\n {...{\n ...props,\n reset: undefined,\n defaultValue: undefined,\n error: undefined,\n onBlur: undefined,\n required: undefined,\n 'aria-describedby': undefined,\n type: 'checkbox',\n }}\n >\n {(label && label.primary && t(label.primary)) || value}\n {label && label.secondary && <Hint>{t(label.secondary)}</Hint>}\n </CheckboxItem>\n\n {!!checked[index] && show && Field && (\n <CheckboxConditional>\n {show.map((fieldName) => (\n <Field name={fieldName} key={fieldName} />\n ))}\n </CheckboxConditional>\n )}\n {selected && selected()}\n </React.Fragment>\n )\n )}\n </Checkbox>\n );\n};\n\nexport default Checkboxes;\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgC;AAGhC,sBAIO;AACP,kBAA+B;AAC/B,kBAAqB;AAYd,MAAM,aAAwC,CAAC;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO,EAAE,SAAS,UAAU;AAAA,EAC5B;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,MAAI,CAAC,MAAO,SAAQ,CAAC;AACrB,QAAM,eACJ,CAAC,aAAa,KAAK,SACnB,CAAC,QAAc;AACb,QAAI,WAAgB,CAAC;AACrB,QAAI,IAAI,cAAc,SAAS;AAC7B,iBAAW,MAAM,OAAO,CAAC,WAAW,CAAC;AAAA,IACvC,OAAO;AACL,iBAAW,MAAM,OAAO,CAAC,QAAQ,QAAQ,WAAW;AAAA,IACtD;AACA,QAAI,QAAQ,KAAK,SAAS,GAAG;AAC3B;AAAA,QAAW,CAAC,UACV,MAAM,IAAI,CAAC,MAAM,UAAW,UAAU,MAAM,CAAC,OAAO,IAAK;AAAA,MAC3D;AAAA,IACF;AAIA,QAAI,SAAS,WAAW,EAAG,YAAW;AACtC,aAAS,QAAQ;AAAA,EACnB;AACF,QAAM,EAAE,EAAE,QAAI,4BAAe;AAC7B,QAAM,CAAC,SAAS,UAAU,QAAI;AAAA,IAC5B,MAAe,QAAQ,MAAM,EAAE,KAAK,KAAK;AAAA,EAC3C;AACA,SACE,6BAAAA,QAAA,cAAC,4BAAS,aACP,QAAQ;AAAA,IACP,CACE;AAAA,MACE;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,UAAU;AAAA,MACV;AAAA,MACA,GAAG;AAAA,IACL,GACA,UAEA,6BAAAA,QAAA,cAAC,aAAAA,QAAM,UAAN,EAAe,KAAK,SACnB,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,KAAK,GAAG,IAAI,IAAI,KAAK;AAAA,QACrB,MAAM,GAAG,IAAI,IAAI,CAAC;AAAA,QAClB,IAAI,GAAG,IAAI,IAAI,CAAC;AAAA,QAChB,OAAO;AAAA,QACP,UAAU,YAAY;AAAA,QACtB,SAAS,OAAO,SAAS,CAAC;AAAA,QAC1B,UAAU,aAAa,GAAG,OAAO,IAAI;AAAA,QACpC,GAAG;AAAA,QACH,GAAG;AAAA,UACF,GAAG;AAAA,UACH,OAAO;AAAA,UACP,cAAc;AAAA,UACd,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,oBAAoB;AAAA,UACpB,MAAM;AAAA,QACR;AAAA;AAAA,MAEE,SAAS,MAAM,WAAW,EAAE,MAAM,OAAO,KAAM;AAAA,MAChD,SAAS,MAAM,aAAa,6BAAAA,QAAA,cAAC,wBAAM,EAAE,MAAM,SAAS,CAAE;AAAA,IACzD,GAEC,CAAC,CAAC,QAAQ,KAAK,KAAK,QAAQ,SAC3B,6BAAAA,QAAA,cAAC,2CACE,KAAK,IAAI,CAAC,cACT,6BAAAA,QAAA,cAAC,SAAM,MAAM,WAAW,KAAK,WAAW,CACzC,CACH,GAED,YAAY,SAAS,CACxB;AAAA,EAEJ,CACF;AAEJ;AAEA,IAAO,qBAAQ;",
6
6
  "names": ["React"]
7
7
  }
@@ -41,7 +41,6 @@ import_dayjs.default.extend(import_customParseFormat.default);
41
41
  function useDate(name, value, form) {
42
42
  const [year, month, day] = (0, import_react.useMemo)(() => {
43
43
  if (!value || value.length === 0) {
44
- update("");
45
44
  return ["", "", ""];
46
45
  }
47
46
  const [day2, month2, year2] = value.split("/");
@@ -104,21 +103,32 @@ const DatePart = ({ label, ...props }) => {
104
103
  };
105
104
  const DateInput = ({ name, ...props }) => {
106
105
  const { t } = (0, import_i18n.useTranslation)();
107
- const [initial] = (0, import_react.useState)(props.value);
108
- const value = (0, import_react.useMemo)(() => {
109
- if (initial === props.value) {
110
- return makeDate(props.value);
111
- }
112
- return props.value;
113
- }, [props.value, initial]);
114
106
  const form = (0, import_FormContext.useFormContext)();
115
- const date = useDate(name, value || makeDate(props.defaultValue), form);
107
+ (0, import_react.useEffect)(() => {
108
+ const initialValue = form.getValues(name);
109
+ if (initialValue === void 0 && props.defaultValue) {
110
+ form.setValue(name, makeDate(props.defaultValue), {
111
+ shouldValidate: false
112
+ });
113
+ } else {
114
+ form.setValue(name, makeDate(initialValue), {
115
+ shouldValidate: false
116
+ });
117
+ }
118
+ }, []);
119
+ const value = form.getValues(name);
120
+ const date = useDate(name, value, form);
116
121
  return /* @__PURE__ */ import_react.default.createElement(import_DateInputContainer.DateInputContainer, null, /* @__PURE__ */ import_react.default.createElement(
117
122
  DatePart,
118
123
  {
119
124
  label: t("form.label.day"),
120
125
  onChange: date.setDay,
121
- onBlur: date.trigger,
126
+ onBlur: (e) => {
127
+ if (date.day && date.day.length === 1) {
128
+ date.setDay(e, true);
129
+ }
130
+ date.trigger();
131
+ },
122
132
  value: date.day,
123
133
  width: 2,
124
134
  name: `${name}-day`,
@@ -133,7 +143,12 @@ const DateInput = ({ name, ...props }) => {
133
143
  {
134
144
  label: t("form.label.month"),
135
145
  onChange: date.setMonth,
136
- onBlur: date.trigger,
146
+ onBlur: (e) => {
147
+ if (date.month && date.month.length === 1) {
148
+ date.setMonth(e, true);
149
+ }
150
+ date.trigger();
151
+ },
137
152
  value: date.month,
138
153
  width: 2,
139
154
  name: `${name}-month`,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/inputs/DateInput/index.tsx"],
4
- "sourcesContent": ["import React, { useMemo, useState } from 'react';\nimport dayjs from 'dayjs';\nimport customParseFormat from 'dayjs/plugin/customParseFormat';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { useFormContext } from '@digigov/form/FormContext';\nimport {\n DateInputContainer,\n DateInputItem,\n} from '@digigov/ui/form/DateInputContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\ndayjs.extend(customParseFormat);\n\nexport interface DateInputProps extends Omit<UncontrolledFieldProps, 'extra'> {\n extra?: {\n max?: string;\n min?: string;\n };\n}\n\nfunction useDate(name, value, form) {\n const [year, month, day] = useMemo(() => {\n if (!value || value.length === 0) {\n update('');\n return ['', '', ''];\n }\n const [day, month, year] = value.split('/');\n return [year, month, day];\n }, [value]);\n\n function update(value) {\n form.setValue(name, value, { shouldValidate: false });\n }\n\n function set(year, month, day) {\n const value = `${day || ''}/${month || ''}/${year || ''}`;\n if (!year && !month && !day) {\n update('');\n } else {\n update(value);\n }\n }\n\n function setYear(evt) {\n const val = evt.target.value.trim();\n set(val, month, day);\n }\n\n function setMonth(evt, cast) {\n let val = evt.target.value.trim();\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, val, day);\n }\n\n function setDay(evt, cast) {\n let val = evt.target.value.trim();\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, month, val);\n }\n\n function trigger() {\n if (form.formState.isSubmitted) {\n form.trigger(name);\n }\n }\n\n return {\n day,\n month,\n year,\n setYear,\n setMonth,\n setDay,\n trigger,\n };\n}\n\nconst VALID_FORMATS = ['DD/MM/YYYY'];\n\nconst makeDate = (val) => {\n const date = dayjs(val, VALID_FORMATS, true);\n if (date.isValid()) {\n return date.format('DD/MM/YYYY');\n }\n return '';\n};\n\nconst DatePart = ({ label, ...props }) => {\n return <DateInputItem {...props}>{label}</DateInputItem>;\n};\n\nexport const DateInput = ({ name, ...props }) => {\n const { t } = useTranslation();\n const [initial] = useState(props.value);\n const value = useMemo(() => {\n if (initial === props.value) {\n return makeDate(props.value);\n }\n return props.value;\n }, [props.value, initial]);\n\n const form = useFormContext();\n const date = useDate(name, value || makeDate(props.defaultValue), form);\n\n return (\n <DateInputContainer>\n <DatePart\n label={t('form.label.day')}\n onChange={date.setDay}\n onBlur={date.trigger}\n value={date.day}\n width={2}\n name={`${name}-day`}\n id={`${name}-day`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!date.day ? props.error : false}\n />\n <DatePart\n label={t('form.label.month')}\n onChange={date.setMonth}\n onBlur={date.trigger}\n value={date.month}\n width={2}\n name={`${name}-month`}\n id={`${name}-month`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!date.month ? props.error : false}\n />\n <DatePart\n label={t('form.label.year')}\n onChange={date.setYear}\n onBlur={date.trigger}\n value={date.year}\n width={4}\n name={`${name}-year`}\n id={`${name}-year`}\n maxLength=\"4\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!date.year ? props.error : false}\n />\n </DateInputContainer>\n );\n};\n\nexport default DateInput;\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import React, { useMemo, useEffect } from 'react';\nimport dayjs from 'dayjs';\nimport customParseFormat from 'dayjs/plugin/customParseFormat';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { useFormContext } from '@digigov/form/FormContext';\nimport {\n DateInputContainer,\n DateInputItem,\n} from '@digigov/ui/form/DateInputContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\ndayjs.extend(customParseFormat);\n\nexport interface DateInputProps extends Omit<UncontrolledFieldProps, 'extra'> {\n extra?: {\n max?: string;\n min?: string;\n };\n}\n\nfunction useDate(name, value, form) {\n const [year, month, day] = useMemo(() => {\n if (!value || value.length === 0) {\n return ['', '', ''];\n }\n const [day, month, year] = value.split('/');\n return [year, month, day];\n }, [value]);\n\n function update(value) {\n form.setValue(name, value, { shouldValidate: false });\n }\n\n function set(year, month, day) {\n const value = `${day || ''}/${month || ''}/${year || ''}`;\n if (!year && !month && !day) {\n update('');\n } else {\n update(value);\n }\n }\n\n function setYear(evt) {\n const val = evt.target.value.trim();\n set(val, month, day);\n }\n\n function setMonth(evt, cast) {\n let val = evt.target.value.trim();\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, val, day);\n }\n\n function setDay(evt, cast) {\n let val = evt.target.value.trim();\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, month, val);\n }\n\n function trigger() {\n if (form.formState.isSubmitted) {\n form.trigger(name);\n }\n }\n\n return {\n day,\n month,\n year,\n setYear,\n setMonth,\n setDay,\n trigger,\n };\n}\n\nconst VALID_FORMATS = ['DD/MM/YYYY'];\n\nconst makeDate = (val) => {\n const date = dayjs(val, VALID_FORMATS, true);\n if (date.isValid()) {\n return date.format('DD/MM/YYYY');\n }\n return '';\n};\n\nconst DatePart = ({ label, ...props }) => {\n return <DateInputItem {...props}>{label}</DateInputItem>;\n};\n\nexport const DateInput = ({ name, ...props }) => {\n const { t } = useTranslation();\n const form = useFormContext();\n\n useEffect(() => {\n const initialValue = form.getValues(name);\n // checks if the initial value is undefined and if the default value is valid date\n if (initialValue === undefined && props.defaultValue) {\n form.setValue(name, makeDate(props.defaultValue), {\n shouldValidate: false,\n });\n } else {\n // checks if the initial value is a valid date\n form.setValue(name, makeDate(initialValue), {\n shouldValidate: false,\n });\n }\n }, []);\n\n const value = form.getValues(name);\n const date = useDate(name, value, form);\n\n return (\n <DateInputContainer>\n <DatePart\n label={t('form.label.day')}\n onChange={date.setDay}\n onBlur={(e) => {\n if (date.day && date.day.length === 1) {\n date.setDay(e, true);\n }\n date.trigger();\n }}\n value={date.day}\n width={2}\n name={`${name}-day`}\n id={`${name}-day`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!date.day ? props.error : false}\n />\n <DatePart\n label={t('form.label.month')}\n onChange={date.setMonth}\n onBlur={(e) => {\n if (date.month && date.month.length === 1) {\n date.setMonth(e, true);\n }\n date.trigger();\n }}\n value={date.month}\n width={2}\n name={`${name}-month`}\n id={`${name}-month`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!date.month ? props.error : false}\n />\n <DatePart\n label={t('form.label.year')}\n onChange={date.setYear}\n onBlur={date.trigger}\n value={date.year}\n width={4}\n name={`${name}-year`}\n id={`${name}-year`}\n maxLength=\"4\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!date.year ? props.error : false}\n />\n </DateInputContainer>\n );\n};\n\nexport default DateInput;\n"],
5
+ "mappings": "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",
6
6
  "names": ["dayjs", "customParseFormat", "day", "month", "year", "value", "React"]
7
7
  }
@@ -41,7 +41,6 @@ import_dayjs.default.extend(import_customParseFormat.default);
41
41
  function useDateTime(name, value, form) {
42
42
  const [year, month, day, hours, minutes] = (0, import_react.useMemo)(() => {
43
43
  if (!value || value.length === 0) {
44
- update("");
45
44
  return ["", "", "", "", ""];
46
45
  }
47
46
  const [datePart, timePart] = value.split(" ");
@@ -126,93 +125,115 @@ const DateTimePart = ({ label, ...props }) => {
126
125
  };
127
126
  const DateTimeInput = ({ name, ...props }) => {
128
127
  const { t } = (0, import_i18n.useTranslation)();
129
- const [initial] = (0, import_react.useState)(props.value);
130
- const value = (0, import_react.useMemo)(() => {
131
- if (initial === props.value) {
132
- return makeDateTime(props.value);
133
- }
134
- return props.value;
135
- }, [props.value, initial]);
136
128
  const form = (0, import_FormContext.useFormContext)();
137
- const datetime = useDateTime(
138
- name,
139
- value || makeDateTime(props.defaultValue),
140
- form
141
- );
129
+ (0, import_react.useEffect)(() => {
130
+ const initialValue = form.getValues(name);
131
+ if (initialValue === void 0 && props.defaultValue) {
132
+ form.setValue(name, makeDateTime(props.defaultValue), {
133
+ shouldValidate: false
134
+ });
135
+ } else {
136
+ form.setValue(name, makeDateTime(initialValue), {
137
+ shouldValidate: false
138
+ });
139
+ }
140
+ }, []);
141
+ const value = form.getValues(name);
142
+ const dateTime = useDateTime(name, value, form);
142
143
  return /* @__PURE__ */ import_react.default.createElement(import_DateInputContainer.DateInputContainer, null, /* @__PURE__ */ import_react.default.createElement(
143
144
  DateTimePart,
144
145
  {
145
146
  label: t("form.label.day"),
146
- onChange: datetime.setDay,
147
- onBlur: datetime.trigger,
148
- value: datetime.day,
147
+ onChange: dateTime.setDay,
148
+ onBlur: (e) => {
149
+ if (dateTime.day && dateTime.day.length === 1) {
150
+ dateTime.setDay(e, true);
151
+ }
152
+ dateTime.trigger();
153
+ },
154
+ value: dateTime.day,
149
155
  width: 2,
150
156
  name: `${name}-day`,
151
157
  maxLength: "2",
152
158
  disabled: props.disabled,
153
159
  "aria-required": props["aria-required"],
154
- error: !datetime.day ? props.error : false,
160
+ error: !dateTime.day ? props.error : false,
155
161
  id: `${name}-day`
156
162
  }
157
163
  ), /* @__PURE__ */ import_react.default.createElement(
158
164
  DateTimePart,
159
165
  {
160
166
  label: t("form.label.month"),
161
- onChange: datetime.setMonth,
162
- onBlur: datetime.trigger,
163
- value: datetime.month,
167
+ onChange: dateTime.setMonth,
168
+ onBlur: (e) => {
169
+ if (dateTime.month && dateTime.month.length === 1) {
170
+ dateTime.setMonth(e, true);
171
+ }
172
+ dateTime.trigger();
173
+ },
174
+ value: dateTime.month,
164
175
  width: 2,
165
176
  name: `${name}-month`,
166
177
  id: `${name}-month`,
167
178
  maxLength: "2",
168
179
  disabled: props.disabled,
169
180
  "aria-required": props["aria-required"],
170
- error: !datetime.month ? props.error : false
181
+ error: !dateTime.month ? props.error : false
171
182
  }
172
183
  ), /* @__PURE__ */ import_react.default.createElement(
173
184
  DateTimePart,
174
185
  {
175
186
  label: t("form.label.year"),
176
- onChange: datetime.setYear,
177
- onBlur: datetime.trigger,
178
- value: datetime.year,
187
+ onChange: dateTime.setYear,
188
+ onBlur: dateTime.trigger,
189
+ value: dateTime.year,
179
190
  width: 4,
180
191
  name: `${name}-year`,
181
192
  id: `${name}-year`,
182
193
  maxLength: "4",
183
194
  disabled: props.disabled,
184
195
  "aria-required": props["aria-required"],
185
- error: !datetime.year ? props.error : false
196
+ error: !dateTime.year ? props.error : false
186
197
  }
187
198
  ), /* @__PURE__ */ import_react.default.createElement(
188
199
  DateTimePart,
189
200
  {
190
201
  label: t("form.label.hours"),
191
- onChange: datetime.setHours,
192
- onBlur: datetime.trigger,
193
- value: datetime.hours,
202
+ onChange: dateTime.setHours,
203
+ onBlur: (e) => {
204
+ if (dateTime.hours && dateTime.hours.length === 1) {
205
+ dateTime.setHours(e, true);
206
+ }
207
+ dateTime.trigger();
208
+ },
209
+ value: dateTime.hours,
194
210
  width: 2,
195
211
  name: `${name}-hours`,
196
212
  id: `${name}-hours`,
197
213
  maxLength: "2",
198
214
  disabled: props.disabled,
199
215
  "aria-required": props["aria-required"],
200
- error: !datetime.hours ? props.error : false
216
+ error: !dateTime.hours ? props.error : false
201
217
  }
202
218
  ), /* @__PURE__ */ import_react.default.createElement(
203
219
  DateTimePart,
204
220
  {
205
221
  label: t("form.label.minutes"),
206
- onChange: datetime.setMinutes,
207
- onBlur: datetime.trigger,
208
- value: datetime.minutes,
222
+ onChange: dateTime.setMinutes,
223
+ onBlur: (e) => {
224
+ if (dateTime.minutes && dateTime.minutes.length === 1) {
225
+ dateTime.setMinutes(e, true);
226
+ }
227
+ dateTime.trigger();
228
+ },
229
+ value: dateTime.minutes,
209
230
  width: 2,
210
231
  name: `${name}-minutes`,
211
232
  id: `${name}-minutes`,
212
233
  maxLength: "2",
213
234
  disabled: props.disabled,
214
235
  "aria-required": props["aria-required"],
215
- error: !datetime.minutes ? props.error : false
236
+ error: !dateTime.minutes ? props.error : false
216
237
  }
217
238
  ));
218
239
  };
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/inputs/DateTimeInput/index.tsx"],
4
- "sourcesContent": ["import React, { useMemo, useState } from 'react';\nimport dayjs from 'dayjs';\nimport customParseFormat from 'dayjs/plugin/customParseFormat';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { useFormContext } from '@digigov/form/FormContext';\nimport {\n DateInputContainer,\n DateInputItem,\n} from '@digigov/ui/form/DateInputContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\ndayjs.extend(customParseFormat);\n\nexport interface DateTimeInputProps\n extends Omit<UncontrolledFieldProps, 'extra'> {\n extra?: {\n max?: string;\n min?: string;\n };\n}\n\nfunction useDateTime(name, value, form) {\n const [year, month, day, hours, minutes] = useMemo(() => {\n if (!value || value.length === 0) {\n update('');\n return ['', '', '', '', ''];\n }\n const [datePart, timePart] = value.split(' ');\n const [day, month, year] = datePart.split('/');\n const [hours, minutes] = timePart ? timePart.split(':') : ['', ''];\n return [year, month, day, hours, minutes];\n }, [value]);\n\n function update(value) {\n form.setValue(name, value, { shouldValidate: false });\n }\n\n function set(year, month, day, hours, minutes) {\n const datePart = `${day || ''}/${month || ''}/${year || ''}`;\n const timePart = hours || minutes ? `${hours || ''}:${minutes || ''}` : '';\n const value = timePart ? `${datePart} ${timePart}` : datePart;\n\n if (!year && !month && !day && !hours && !minutes) {\n update('');\n } else {\n update(value);\n }\n }\n\n function setYear(evt) {\n const val = evt.target.value;\n set(val, month, day, hours, minutes);\n }\n\n function setMonth(evt, cast) {\n let val = evt.target.value;\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, val, day, hours, minutes);\n }\n\n function setDay(evt, cast) {\n let val = evt.target.value;\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, month, val, hours, minutes);\n }\n\n function setHours(evt, cast) {\n let val = evt.target.value;\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, month, day, val, minutes);\n }\n\n function setMinutes(evt, cast) {\n let val = evt.target.value;\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, month, day, hours, val);\n }\n\n function trigger() {\n if (form.formState.isSubmitted) {\n form.trigger(name);\n }\n }\n\n return {\n day,\n month,\n year,\n hours,\n minutes,\n setYear,\n setMonth,\n setDay,\n setHours,\n setMinutes,\n trigger,\n };\n}\n\nconst VALID_FORMATS = ['DD/MM/YYYY HH:mm', 'DD/MM/YYYY'];\n\nconst makeDateTime = (val) => {\n const date = dayjs(val, VALID_FORMATS, true);\n if (date.isValid()) {\n return date.format('DD/MM/YYYY HH:mm');\n }\n return '';\n};\n\nconst DateTimePart = ({ label, ...props }) => {\n return <DateInputItem {...props}>{label}</DateInputItem>;\n};\n\nexport const DateTimeInput = ({ name, ...props }) => {\n const { t } = useTranslation();\n const [initial] = useState(props.value);\n const value = useMemo(() => {\n if (initial === props.value) {\n return makeDateTime(props.value);\n }\n return props.value;\n }, [props.value, initial]);\n\n const form = useFormContext();\n const datetime = useDateTime(\n name,\n value || makeDateTime(props.defaultValue),\n form\n );\n\n return (\n <DateInputContainer>\n <DateTimePart\n label={t('form.label.day')}\n onChange={datetime.setDay}\n onBlur={datetime.trigger}\n value={datetime.day}\n width={2}\n name={`${name}-day`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!datetime.day ? props.error : false}\n id={`${name}-day`}\n />\n <DateTimePart\n label={t('form.label.month')}\n onChange={datetime.setMonth}\n onBlur={datetime.trigger}\n value={datetime.month}\n width={2}\n name={`${name}-month`}\n id={`${name}-month`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!datetime.month ? props.error : false}\n />\n <DateTimePart\n label={t('form.label.year')}\n onChange={datetime.setYear}\n onBlur={datetime.trigger}\n value={datetime.year}\n width={4}\n name={`${name}-year`}\n id={`${name}-year`}\n maxLength=\"4\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!datetime.year ? props.error : false}\n />\n <DateTimePart\n label={t('form.label.hours')}\n onChange={datetime.setHours}\n onBlur={datetime.trigger}\n value={datetime.hours}\n width={2}\n name={`${name}-hours`}\n id={`${name}-hours`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!datetime.hours ? props.error : false}\n />\n <DateTimePart\n label={t('form.label.minutes')}\n onChange={datetime.setMinutes}\n onBlur={datetime.trigger}\n value={datetime.minutes}\n width={2}\n name={`${name}-minutes`}\n id={`${name}-minutes`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!datetime.minutes ? props.error : false}\n />\n </DateInputContainer>\n );\n};\n\nexport default DateTimeInput;\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import React, { useMemo, useEffect } from 'react';\nimport dayjs from 'dayjs';\nimport customParseFormat from 'dayjs/plugin/customParseFormat';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { useFormContext } from '@digigov/form/FormContext';\nimport {\n DateInputContainer,\n DateInputItem,\n} from '@digigov/ui/form/DateInputContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\ndayjs.extend(customParseFormat);\n\nexport interface DateTimeInputProps\n extends Omit<UncontrolledFieldProps, 'extra'> {\n extra?: {\n max?: string;\n min?: string;\n };\n}\n\nfunction useDateTime(name, value, form) {\n const [year, month, day, hours, minutes] = useMemo(() => {\n if (!value || value.length === 0) {\n return ['', '', '', '', ''];\n }\n const [datePart, timePart] = value.split(' ');\n const [day, month, year] = datePart.split('/');\n const [hours, minutes] = timePart ? timePart.split(':') : ['', ''];\n return [year, month, day, hours, minutes];\n }, [value]);\n\n function update(value) {\n form.setValue(name, value, { shouldValidate: false });\n }\n\n function set(year, month, day, hours, minutes) {\n const datePart = `${day || ''}/${month || ''}/${year || ''}`;\n const timePart = hours || minutes ? `${hours || ''}:${minutes || ''}` : '';\n const value = timePart ? `${datePart} ${timePart}` : datePart;\n\n if (!year && !month && !day && !hours && !minutes) {\n update('');\n } else {\n update(value);\n }\n }\n\n function setYear(evt) {\n const val = evt.target.value;\n set(val, month, day, hours, minutes);\n }\n\n function setMonth(evt, cast) {\n let val = evt.target.value;\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, val, day, hours, minutes);\n }\n\n function setDay(evt, cast) {\n let val = evt.target.value;\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, month, val, hours, minutes);\n }\n\n function setHours(evt, cast) {\n let val = evt.target.value;\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, month, day, val, minutes);\n }\n\n function setMinutes(evt, cast) {\n let val = evt.target.value;\n if (cast && val && val.length === 1) {\n val = '0' + val;\n }\n set(year, month, day, hours, val);\n }\n\n function trigger() {\n if (form.formState.isSubmitted) {\n form.trigger(name);\n }\n }\n\n return {\n day,\n month,\n year,\n hours,\n minutes,\n setYear,\n setMonth,\n setDay,\n setHours,\n setMinutes,\n trigger,\n };\n}\n\nconst VALID_FORMATS = ['DD/MM/YYYY HH:mm', 'DD/MM/YYYY'];\n\nconst makeDateTime = (val) => {\n const date = dayjs(val, VALID_FORMATS, true);\n if (date.isValid()) {\n return date.format('DD/MM/YYYY HH:mm');\n }\n return '';\n};\n\nconst DateTimePart = ({ label, ...props }) => {\n return <DateInputItem {...props}>{label}</DateInputItem>;\n};\n\nexport const DateTimeInput = ({ name, ...props }) => {\n const { t } = useTranslation();\n const form = useFormContext();\n\n useEffect(() => {\n const initialValue = form.getValues(name);\n // checks if the initial value is undefined and if the default value is valid date\n if (initialValue === undefined && props.defaultValue) {\n form.setValue(name, makeDateTime(props.defaultValue), {\n shouldValidate: false,\n });\n } else {\n // checks if the initial value is a valid date\n form.setValue(name, makeDateTime(initialValue), {\n shouldValidate: false,\n });\n }\n }, []);\n\n const value = form.getValues(name);\n const dateTime = useDateTime(name, value, form);\n\n return (\n <DateInputContainer>\n <DateTimePart\n label={t('form.label.day')}\n onChange={dateTime.setDay}\n onBlur={(e) => {\n if (dateTime.day && dateTime.day.length === 1) {\n dateTime.setDay(e, true);\n }\n dateTime.trigger();\n }}\n value={dateTime.day}\n width={2}\n name={`${name}-day`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!dateTime.day ? props.error : false}\n id={`${name}-day`}\n />\n <DateTimePart\n label={t('form.label.month')}\n onChange={dateTime.setMonth}\n onBlur={(e) => {\n if (dateTime.month && dateTime.month.length === 1) {\n dateTime.setMonth(e, true);\n }\n dateTime.trigger();\n }}\n value={dateTime.month}\n width={2}\n name={`${name}-month`}\n id={`${name}-month`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!dateTime.month ? props.error : false}\n />\n <DateTimePart\n label={t('form.label.year')}\n onChange={dateTime.setYear}\n onBlur={dateTime.trigger}\n value={dateTime.year}\n width={4}\n name={`${name}-year`}\n id={`${name}-year`}\n maxLength=\"4\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!dateTime.year ? props.error : false}\n />\n <DateTimePart\n label={t('form.label.hours')}\n onChange={dateTime.setHours}\n onBlur={(e) => {\n if (dateTime.hours && dateTime.hours.length === 1) {\n dateTime.setHours(e, true);\n }\n dateTime.trigger();\n }}\n value={dateTime.hours}\n width={2}\n name={`${name}-hours`}\n id={`${name}-hours`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!dateTime.hours ? props.error : false}\n />\n <DateTimePart\n label={t('form.label.minutes')}\n onChange={dateTime.setMinutes}\n onBlur={(e) => {\n if (dateTime.minutes && dateTime.minutes.length === 1) {\n dateTime.setMinutes(e, true);\n }\n dateTime.trigger();\n }}\n value={dateTime.minutes}\n width={2}\n name={`${name}-minutes`}\n id={`${name}-minutes`}\n maxLength=\"2\"\n disabled={props.disabled}\n aria-required={props['aria-required']}\n error={!dateTime.minutes ? props.error : false}\n />\n </DateInputContainer>\n );\n};\n\nexport default DateTimeInput;\n"],
5
+ "mappings": "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",
6
6
  "names": ["dayjs", "customParseFormat", "day", "month", "year", "hours", "minutes", "value", "React"]
7
7
  }
@@ -38,54 +38,72 @@ var import_FileUpload = require("@digigov/ui/form/FileUpload");
38
38
  var import_i18n = require("@digigov/ui/i18n");
39
39
  var import_Hint = require("@digigov/ui/typography/Hint");
40
40
  var import_Paragraph = require("@digigov/ui/typography/Paragraph");
41
- const FileInput = import_react.default.forwardRef(function FileInput2({ name, disabled, resetField, extra, control, onChange, ...props }, ref) {
42
- delete props.Field;
43
- delete props.reset;
41
+ const FileInput = import_react.default.forwardRef(function FileInput2({
42
+ name,
43
+ disabled,
44
+ resetField,
45
+ extra,
46
+ control,
47
+ onChange,
48
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
49
+ Field,
50
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
51
+ reset,
52
+ ...props
53
+ }, ref) {
44
54
  const { t } = (0, import_i18n.useTranslation)();
45
55
  const value = (0, import_react_hook_form.useWatch)({ control, name });
46
- const [files, setFiles] = (0, import_react.useState)(
47
- Object.values(value || {})?.map?.(({ name: name2 }) => name2) || []
56
+ const [filenames, setFilenames] = (0, import_react.useState)(
57
+ Object.values(value || {}).map(({ name: name2 }) => name2) || []
48
58
  );
49
59
  (0, import_react.useEffect)(() => {
50
- setFiles(Object.values(value || {})?.map?.(({ name: name2 }) => name2));
60
+ setFilenames(Object.values(value || {}).map(({ name: name2 }) => name2));
51
61
  }, [value]);
62
+ const handleChange = (0, import_react.useCallback)(
63
+ (event) => {
64
+ event.preventDefault();
65
+ const target = event.target;
66
+ if (target.files && target.files.length > 0) {
67
+ setFilenames(Object.values(target.files).map(({ name: name2 }) => name2));
68
+ }
69
+ onChange(event);
70
+ },
71
+ [onChange]
72
+ );
73
+ const handleReset = (0, import_react.useCallback)(
74
+ (event) => {
75
+ event.preventDefault();
76
+ resetField(name);
77
+ setFilenames(void 0);
78
+ },
79
+ [name, resetField]
80
+ );
52
81
  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
53
82
  import_FileUpload.FileUploadContainer,
54
83
  {
55
84
  variant: extra?.containerProps?.variant || "default",
56
- hasFiles: files && files.length > 0
85
+ hasFiles: filenames && filenames.length > 0
57
86
  },
58
- files?.length ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_Paragraph.Paragraph, null, /* @__PURE__ */ import_react.default.createElement("b", null, t("upload.file"), ":"), " ", `${files.join(", ")}`)) : /* @__PURE__ */ import_react.default.createElement(import_Hint.Hint, null, /* @__PURE__ */ import_react.default.createElement("b", null, t("upload.file"), ": "), t("upload.no_file")),
87
+ filenames?.length ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_Paragraph.Paragraph, null, /* @__PURE__ */ import_react.default.createElement("b", null, t("upload.file"), ":"), " ", `${filenames.join(", ")}`)) : /* @__PURE__ */ import_react.default.createElement(import_Hint.Hint, null, /* @__PURE__ */ import_react.default.createElement("b", null, t("upload.file"), ": "), t("upload.no_file")),
59
88
  /* @__PURE__ */ import_react.default.createElement(
60
89
  import_FileUpload.FileUpload,
61
90
  {
62
91
  ref,
63
- hasFiles: !!files?.length,
92
+ hasFiles: !!filenames?.length,
64
93
  name,
65
94
  variant: extra?.uploadButtonProps?.variant,
66
95
  disabled,
67
96
  id: name,
68
- onChange: (event) => {
69
- event.preventDefault();
70
- const target = event?.target;
71
- if (target?.files && target?.files.length > 0) {
72
- setFiles(Object.values(target?.files)?.map?.(({ name: name2 }) => name2));
73
- }
74
- onChange(event);
75
- },
97
+ onChange: handleChange,
76
98
  ...{ ...props, required: void 0 }
77
99
  },
78
- files?.length ? t("upload.change_file") : t("upload.choose_file")
100
+ filenames?.length ? t("upload.change_file") : t("upload.choose_file")
79
101
  ),
80
- files !== void 0 && files?.length > 0 && !extra?.noResetButton && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
102
+ filenames !== void 0 && filenames?.length > 0 && !extra?.noResetButton && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
81
103
  import_Button.Button,
82
104
  {
83
105
  variant: extra?.resetButtonProps?.variant || "link",
84
- onClick: (event) => {
85
- event.preventDefault();
86
- resetField(name);
87
- setFiles(void 0);
88
- },
106
+ onClick: handleReset,
89
107
  color: extra?.resetButtonProps?.color || "secondary"
90
108
  },
91
109
  t("upload.reset_file")
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/inputs/FileInput/index.tsx"],
4
- "sourcesContent": ["import React, { useEffect, useState } from 'react';\nimport { useWatch } from 'react-hook-form';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { Button, ButtonProps } from '@digigov/ui/form/Button';\nimport {\n FileUpload,\n FileUploadContainer,\n FileUploadContainerProps,\n FileUploadProps,\n} from '@digigov/ui/form/FileUpload';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\nimport { Paragraph } from '@digigov/ui/typography/Paragraph';\n\nexport interface FileInputProps extends Omit<UncontrolledFieldProps, 'extra'> {\n extra?: {\n className?: string;\n multiple?: boolean;\n accept?: string;\n limit: {\n maxSize?: number;\n };\n containerProps?: FileUploadContainerProps;\n uploadButtonProps?: FileUploadProps;\n noResetButton?: boolean;\n resetButtonProps?: ButtonProps;\n locales?: {\n file?: string;\n chooseFile?: string;\n changeFile?: string;\n resetFile?: string;\n };\n };\n}\n\nexport const FileInput: React.FC<any> = React.forwardRef(function FileInput(\n { name, disabled, resetField, extra, control, onChange, ...props },\n ref: any\n) {\n delete props.Field;\n delete props.reset;\n const { t } = useTranslation();\n const value: any = useWatch({ control, name });\n\n const [files, setFiles] = useState<string[] | undefined>(\n Object.values(value || {})?.map?.(({ name }) => name) || []\n );\n useEffect(() => {\n setFiles(Object.values(value || {})?.map?.(({ name }) => name));\n }, [value]);\n\n return (\n <>\n <FileUploadContainer\n variant={extra?.containerProps?.variant || 'default'}\n hasFiles={files && files.length > 0}\n >\n {files?.length ? (\n <>\n <Paragraph>\n <b>{t('upload.file')}:</b> {`${files.join(', ')}`}\n </Paragraph>\n </>\n ) : (\n <Hint>\n <b>\n {t('upload.file')}\n {': '}\n </b>\n {t('upload.no_file')}\n </Hint>\n )}\n <FileUpload\n ref={ref}\n hasFiles={!!files?.length}\n name={name}\n variant={extra?.uploadButtonProps?.variant}\n disabled={disabled}\n id={name}\n onChange={(event) => {\n event.preventDefault();\n const target = event?.target as HTMLInputElement;\n if (target?.files && target?.files.length > 0) {\n setFiles(Object.values(target?.files)?.map?.(({ name }) => name));\n }\n onChange(event);\n }}\n {...{ ...props, required: undefined }}\n >\n {files?.length ? t('upload.change_file') : t('upload.choose_file')}\n </FileUpload>\n {files !== undefined && files?.length > 0 && !extra?.noResetButton && (\n <>\n <Button\n variant={extra?.resetButtonProps?.variant || 'link'}\n onClick={(event) => {\n event.preventDefault();\n resetField(name);\n setFiles(undefined);\n }}\n color={extra?.resetButtonProps?.color || 'secondary'}\n >\n {t('upload.reset_file')}\n </Button>\n </>\n )}\n </FileUploadContainer>\n </>\n );\n});\n\nexport default FileInput;\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA2C;AAC3C,6BAAyB;AAEzB,oBAAoC;AACpC,wBAKO;AACP,kBAA+B;AAC/B,kBAAqB;AACrB,uBAA0B;AAuBnB,MAAM,YAA2B,aAAAA,QAAM,WAAW,SAASC,WAChE,EAAE,MAAM,UAAU,YAAY,OAAO,SAAS,UAAU,GAAG,MAAM,GACjE,KACA;AACA,SAAO,MAAM;AACb,SAAO,MAAM;AACb,QAAM,EAAE,EAAE,QAAI,4BAAe;AAC7B,QAAM,YAAa,iCAAS,EAAE,SAAS,KAAK,CAAC;AAE7C,QAAM,CAAC,OAAO,QAAQ,QAAI;AAAA,IACxB,OAAO,OAAO,SAAS,CAAC,CAAC,GAAG,MAAM,CAAC,EAAE,MAAAC,MAAK,MAAMA,KAAI,KAAK,CAAC;AAAA,EAC5D;AACA,8BAAU,MAAM;AACd,aAAS,OAAO,OAAO,SAAS,CAAC,CAAC,GAAG,MAAM,CAAC,EAAE,MAAAA,MAAK,MAAMA,KAAI,CAAC;AAAA,EAChE,GAAG,CAAC,KAAK,CAAC;AAEV,SACE,6BAAAF,QAAA,2BAAAA,QAAA,gBACE,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,OAAO,gBAAgB,WAAW;AAAA,MAC3C,UAAU,SAAS,MAAM,SAAS;AAAA;AAAA,IAEjC,OAAO,SACN,6BAAAA,QAAA,2BAAAA,QAAA,gBACE,6BAAAA,QAAA,cAAC,kCACC,6BAAAA,QAAA,cAAC,WAAG,EAAE,aAAa,GAAE,GAAC,GAAI,KAAE,GAAG,MAAM,KAAK,IAAI,CAAC,EACjD,CACF,IAEA,6BAAAA,QAAA,cAAC,wBACC,6BAAAA,QAAA,cAAC,WACE,EAAE,aAAa,GACf,IACH,GACC,EAAE,gBAAgB,CACrB;AAAA,IAEF,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,UAAU,CAAC,CAAC,OAAO;AAAA,QACnB;AAAA,QACA,SAAS,OAAO,mBAAmB;AAAA,QACnC;AAAA,QACA,IAAI;AAAA,QACJ,UAAU,CAAC,UAAU;AACnB,gBAAM,eAAe;AACrB,gBAAM,SAAS,OAAO;AACtB,cAAI,QAAQ,SAAS,QAAQ,MAAM,SAAS,GAAG;AAC7C,qBAAS,OAAO,OAAO,QAAQ,KAAK,GAAG,MAAM,CAAC,EAAE,MAAAE,MAAK,MAAMA,KAAI,CAAC;AAAA,UAClE;AACA,mBAAS,KAAK;AAAA,QAChB;AAAA,QACC,GAAG,EAAE,GAAG,OAAO,UAAU,OAAU;AAAA;AAAA,MAEnC,OAAO,SAAS,EAAE,oBAAoB,IAAI,EAAE,oBAAoB;AAAA,IACnE;AAAA,IACC,UAAU,UAAa,OAAO,SAAS,KAAK,CAAC,OAAO,iBACnD,6BAAAF,QAAA,2BAAAA,QAAA,gBACE,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,SAAS,OAAO,kBAAkB,WAAW;AAAA,QAC7C,SAAS,CAAC,UAAU;AAClB,gBAAM,eAAe;AACrB,qBAAW,IAAI;AACf,mBAAS,MAAS;AAAA,QACpB;AAAA,QACA,OAAO,OAAO,kBAAkB,SAAS;AAAA;AAAA,MAExC,EAAE,mBAAmB;AAAA,IACxB,CACF;AAAA,EAEJ,CACF;AAEJ,CAAC;AAED,IAAO,oBAAQ;",
4
+ "sourcesContent": ["import React, { ComponentRef, useCallback, useEffect, useState } from 'react';\nimport { UseFormReturn, useWatch } from 'react-hook-form';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { Button, ButtonProps } from '@digigov/ui/form/Button';\nimport {\n FileUpload,\n FileUploadContainer,\n FileUploadContainerProps,\n FileUploadProps,\n} from '@digigov/ui/form/FileUpload';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\nimport { Paragraph } from '@digigov/ui/typography/Paragraph';\n\nexport interface FileInputProps extends Omit<UncontrolledFieldProps, 'extra'> {\n extra?: {\n className?: string;\n multiple?: boolean;\n accept?: string;\n limit: {\n maxSize?: number;\n };\n containerProps?: FileUploadContainerProps;\n uploadButtonProps?: FileUploadProps;\n noResetButton?: boolean;\n resetButtonProps?: ButtonProps;\n locales?: {\n file?: string;\n chooseFile?: string;\n changeFile?: string;\n resetFile?: string;\n };\n };\n reset: (values?: FileList) => void;\n resetField: UseFormReturn['resetField'];\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n}\n\nexport const FileInput = React.forwardRef<\n ComponentRef<typeof FileUpload>,\n FileInputProps\n>(function FileInput(\n {\n name,\n disabled,\n resetField,\n extra,\n control,\n onChange,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Field,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n reset,\n ...props\n },\n ref\n) {\n const { t } = useTranslation();\n const value: FileList = useWatch({ control, name });\n\n const [filenames, setFilenames] = useState<string[] | undefined>(\n Object.values(value || {}).map(({ name }) => name) || []\n );\n\n useEffect(() => {\n setFilenames(Object.values(value || {}).map(({ name }) => name));\n }, [value]);\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n event.preventDefault();\n const target = event.target;\n if (target.files && target.files.length > 0) {\n setFilenames(Object.values(target.files).map(({ name }) => name));\n }\n onChange(event);\n },\n [onChange]\n );\n\n const handleReset = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault();\n resetField(name);\n setFilenames(undefined);\n },\n [name, resetField]\n );\n\n return (\n <>\n <FileUploadContainer\n variant={extra?.containerProps?.variant || 'default'}\n hasFiles={filenames && filenames.length > 0}\n >\n {filenames?.length ? (\n <>\n <Paragraph>\n <b>{t('upload.file')}:</b> {`${filenames.join(', ')}`}\n </Paragraph>\n </>\n ) : (\n <Hint>\n <b>\n {t('upload.file')}\n {': '}\n </b>\n {t('upload.no_file')}\n </Hint>\n )}\n <FileUpload\n ref={ref}\n hasFiles={!!filenames?.length}\n name={name}\n variant={extra?.uploadButtonProps?.variant}\n disabled={disabled}\n id={name}\n onChange={handleChange}\n {...{ ...props, required: undefined }}\n >\n {filenames?.length\n ? t('upload.change_file')\n : t('upload.choose_file')}\n </FileUpload>\n {filenames !== undefined &&\n filenames?.length > 0 &&\n !extra?.noResetButton && (\n <>\n <Button\n variant={extra?.resetButtonProps?.variant || 'link'}\n onClick={handleReset}\n color={extra?.resetButtonProps?.color || 'secondary'}\n >\n {t('upload.reset_file')}\n </Button>\n </>\n )}\n </FileUploadContainer>\n </>\n );\n});\n\nexport default FileInput;\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAsE;AACtE,6BAAwC;AAExC,oBAAoC;AACpC,wBAKO;AACP,kBAA+B;AAC/B,kBAAqB;AACrB,uBAA0B;AA0BnB,MAAM,YAAY,aAAAA,QAAM,WAG7B,SAASC,WACT;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA,EACA,GAAG;AACL,GACA,KACA;AACA,QAAM,EAAE,EAAE,QAAI,4BAAe;AAC7B,QAAM,YAAkB,iCAAS,EAAE,SAAS,KAAK,CAAC;AAElD,QAAM,CAAC,WAAW,YAAY,QAAI;AAAA,IAChC,OAAO,OAAO,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,MAAAC,MAAK,MAAMA,KAAI,KAAK,CAAC;AAAA,EACzD;AAEA,8BAAU,MAAM;AACd,iBAAa,OAAO,OAAO,SAAS,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,MAAAA,MAAK,MAAMA,KAAI,CAAC;AAAA,EACjE,GAAG,CAAC,KAAK,CAAC;AAEV,QAAM,mBAAe;AAAA,IACnB,CAAC,UAA+C;AAC9C,YAAM,eAAe;AACrB,YAAM,SAAS,MAAM;AACrB,UAAI,OAAO,SAAS,OAAO,MAAM,SAAS,GAAG;AAC3C,qBAAa,OAAO,OAAO,OAAO,KAAK,EAAE,IAAI,CAAC,EAAE,MAAAA,MAAK,MAAMA,KAAI,CAAC;AAAA,MAClE;AACA,eAAS,KAAK;AAAA,IAChB;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,kBAAc;AAAA,IAClB,CAAC,UAA+C;AAC9C,YAAM,eAAe;AACrB,iBAAW,IAAI;AACf,mBAAa,MAAS;AAAA,IACxB;AAAA,IACA,CAAC,MAAM,UAAU;AAAA,EACnB;AAEA,SACE,6BAAAF,QAAA,2BAAAA,QAAA,gBACE,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,OAAO,gBAAgB,WAAW;AAAA,MAC3C,UAAU,aAAa,UAAU,SAAS;AAAA;AAAA,IAEzC,WAAW,SACV,6BAAAA,QAAA,2BAAAA,QAAA,gBACE,6BAAAA,QAAA,cAAC,kCACC,6BAAAA,QAAA,cAAC,WAAG,EAAE,aAAa,GAAE,GAAC,GAAI,KAAE,GAAG,UAAU,KAAK,IAAI,CAAC,EACrD,CACF,IAEA,6BAAAA,QAAA,cAAC,wBACC,6BAAAA,QAAA,cAAC,WACE,EAAE,aAAa,GACf,IACH,GACC,EAAE,gBAAgB,CACrB;AAAA,IAEF,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,UAAU,CAAC,CAAC,WAAW;AAAA,QACvB;AAAA,QACA,SAAS,OAAO,mBAAmB;AAAA,QACnC;AAAA,QACA,IAAI;AAAA,QACJ,UAAU;AAAA,QACT,GAAG,EAAE,GAAG,OAAO,UAAU,OAAU;AAAA;AAAA,MAEnC,WAAW,SACR,EAAE,oBAAoB,IACtB,EAAE,oBAAoB;AAAA,IAC5B;AAAA,IACC,cAAc,UACb,WAAW,SAAS,KACpB,CAAC,OAAO,iBACN,6BAAAA,QAAA,2BAAAA,QAAA,gBACE,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,SAAS,OAAO,kBAAkB,WAAW;AAAA,QAC7C,SAAS;AAAA,QACT,OAAO,OAAO,kBAAkB,SAAS;AAAA;AAAA,MAExC,EAAE,mBAAmB;AAAA,IACxB,CACF;AAAA,EAEN,CACF;AAEJ,CAAC;AAED,IAAO,oBAAQ;",
6
6
  "names": ["React", "FileInput", "name"]
7
7
  }
@@ -76,11 +76,11 @@ var _digigov_form_Questions_Step_StepTitle = __toESM(require("@digigov/form/Ques
76
76
  var _digigov_form_Questions_Step_getAddMoreFields = __toESM(require("@digigov/form/Questions/Step/getAddMoreFields"));
77
77
  var _digigov_form_Questions_Step = __toESM(require("@digigov/form/Questions/Step"));
78
78
  var _digigov_form_Questions_Step_types = __toESM(require("@digigov/form/Questions/Step/types"));
79
- var _digigov_form_inputs_Checkboxes = __toESM(require("@digigov/form/inputs/Checkboxes"));
80
79
  var _digigov_form_inputs_AutoCompleteInput = __toESM(require("@digigov/form/inputs/AutoCompleteInput"));
80
+ var _digigov_form_inputs_Checkboxes = __toESM(require("@digigov/form/inputs/Checkboxes"));
81
81
  var _digigov_form_inputs_DateInput = __toESM(require("@digigov/form/inputs/DateInput"));
82
- var _digigov_form_inputs_DateTimeInput = __toESM(require("@digigov/form/inputs/DateTimeInput"));
83
82
  var _digigov_form_inputs_FileInput = __toESM(require("@digigov/form/inputs/FileInput"));
83
+ var _digigov_form_inputs_DateTimeInput = __toESM(require("@digigov/form/inputs/DateTimeInput"));
84
84
  var _digigov_form_inputs_ImageInput = __toESM(require("@digigov/form/inputs/ImageInput"));
85
85
  var _digigov_form_inputs_Input = __toESM(require("@digigov/form/inputs/Input"));
86
86
  var _digigov_form_inputs_Label = __toESM(require("@digigov/form/inputs/Label"));
@@ -165,11 +165,11 @@ var registry_default = {
165
165
  "@digigov/form/Questions/Step/getAddMoreFields": lazyImport(_digigov_form_Questions_Step_getAddMoreFields),
166
166
  "@digigov/form/Questions/Step": lazyImport(_digigov_form_Questions_Step),
167
167
  "@digigov/form/Questions/Step/types": lazyImport(_digigov_form_Questions_Step_types),
168
- "@digigov/form/inputs/Checkboxes": lazyImport(_digigov_form_inputs_Checkboxes),
169
168
  "@digigov/form/inputs/AutoCompleteInput": lazyImport(_digigov_form_inputs_AutoCompleteInput),
169
+ "@digigov/form/inputs/Checkboxes": lazyImport(_digigov_form_inputs_Checkboxes),
170
170
  "@digigov/form/inputs/DateInput": lazyImport(_digigov_form_inputs_DateInput),
171
- "@digigov/form/inputs/DateTimeInput": lazyImport(_digigov_form_inputs_DateTimeInput),
172
171
  "@digigov/form/inputs/FileInput": lazyImport(_digigov_form_inputs_FileInput),
172
+ "@digigov/form/inputs/DateTimeInput": lazyImport(_digigov_form_inputs_DateTimeInput),
173
173
  "@digigov/form/inputs/ImageInput": lazyImport(_digigov_form_inputs_ImageInput),
174
174
  "@digigov/form/inputs/Input": lazyImport(_digigov_form_inputs_Input),
175
175
  "@digigov/form/inputs/Label": lazyImport(_digigov_form_inputs_Label),