@digigov/form 2.0.0-rc.21 → 2.0.0-rc.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Field/FieldBaseContainer/index.js +1 -1
- package/Field/FieldBaseContainer.js.map +2 -2
- package/FieldArray/index.js +4 -4
- package/FieldArray/index.js.map +2 -2
- package/FieldObject/index.js +2 -2
- package/FieldObject/index.js.map +2 -2
- package/Fieldset/index.d.ts +1 -1
- package/Fieldset/index.js +5 -5
- package/Fieldset/index.js.map +2 -2
- package/Fieldset/types.d.ts +2 -2
- package/FormBuilder/index.js +3 -3
- package/FormBuilder/index.js.map +2 -2
- package/MultiplicityField/add-objects/index.js +4 -4
- package/MultiplicityField/add-objects.js.map +2 -2
- package/MultiplicityField/index.js +12 -10
- package/MultiplicityField/index.js.map +2 -2
- package/Questions/Step/StepTitle/index.js +4 -3
- package/Questions/Step/StepTitle.d.ts +1 -1
- package/Questions/Step/StepTitle.js.map +2 -2
- package/cjs/Field/FieldBaseContainer/index.js +2 -2
- package/cjs/Field/FieldBaseContainer.js.map +3 -3
- package/cjs/FieldArray/index.js +6 -6
- package/cjs/FieldArray/index.js.map +3 -3
- package/cjs/FieldObject/index.js +3 -3
- package/cjs/FieldObject/index.js.map +3 -3
- package/cjs/Fieldset/index.js +10 -10
- package/cjs/Fieldset/index.js.map +3 -3
- package/cjs/Fieldset/types.js.map +1 -1
- package/cjs/FormBuilder/index.js +5 -5
- package/cjs/FormBuilder/index.js.map +3 -3
- package/cjs/MultiplicityField/add-objects/index.js +8 -8
- package/cjs/MultiplicityField/add-objects.js.map +3 -3
- package/cjs/MultiplicityField/index.js +11 -14
- package/cjs/MultiplicityField/index.js.map +3 -3
- package/cjs/Questions/Step/StepTitle/index.js +5 -5
- package/cjs/Questions/Step/StepTitle.js.map +3 -3
- package/cjs/inputs/AutoCompleteInput/index.js +4 -4
- package/cjs/inputs/AutoCompleteInput/index.js.map +3 -3
- package/cjs/inputs/Checkboxes/index.js +6 -8
- package/cjs/inputs/Checkboxes/index.js.map +3 -3
- package/cjs/inputs/DateInput/index.js +3 -4
- package/cjs/inputs/DateInput/index.js.map +3 -3
- package/cjs/inputs/FileInput/index.js +7 -8
- package/cjs/inputs/FileInput/index.js.map +3 -3
- package/cjs/inputs/ImageInput/__stories__/WithInvalidImageDimension/index.js +2 -1
- package/cjs/inputs/ImageInput/__stories__/WithInvalidImageDimension.js.map +2 -2
- package/cjs/inputs/ImageInput/index.js +7 -8
- package/cjs/inputs/ImageInput/index.js.map +3 -3
- package/cjs/inputs/Input/index.js +4 -4
- package/cjs/inputs/Input/index.js.map +2 -2
- package/cjs/inputs/Label/index.js +3 -3
- package/cjs/inputs/Label/index.js.map +3 -3
- package/cjs/inputs/Radio/index.js +11 -13
- package/cjs/inputs/Radio/index.js.map +3 -3
- package/cjs/inputs/Select/index.js +3 -4
- package/cjs/inputs/Select/index.js.map +3 -3
- package/cjs/lazy/index.js +3 -0
- package/cjs/lazy.js.map +2 -2
- package/cjs/registry/index.js +2 -0
- package/cjs/registry.js.map +2 -2
- package/cjs/validators/index.js +6 -65
- package/cjs/validators/index.js.map +3 -3
- package/cjs/validators/utils/date/index.js +138 -0
- package/cjs/validators/utils/date.js.map +7 -0
- package/cjs/validators/utils/index.js +3 -1
- package/cjs/validators/utils/index.js.map +2 -2
- package/index.js +1 -1
- package/inputs/AutoCompleteInput/index.js +6 -4
- package/inputs/AutoCompleteInput/index.js.map +2 -2
- package/inputs/Checkboxes/index.js +7 -5
- package/inputs/Checkboxes/index.js.map +2 -2
- package/inputs/DateInput/index.js +5 -3
- package/inputs/DateInput/index.js.map +2 -2
- package/inputs/FileInput/index.js +5 -6
- package/inputs/FileInput/index.js.map +2 -2
- package/inputs/ImageInput/__stories__/WithInvalidImageDimension/index.js +2 -1
- package/inputs/ImageInput/__stories__/WithInvalidImageDimension.js.map +2 -2
- package/inputs/ImageInput/index.js +6 -7
- package/inputs/ImageInput/index.js.map +2 -2
- package/inputs/Input/index.js +4 -4
- package/inputs/Input/index.js.map +2 -2
- package/inputs/Label/index.js +2 -2
- package/inputs/Label/index.js.map +2 -2
- package/inputs/Radio/index.js +7 -5
- package/inputs/Radio/index.js.map +2 -2
- package/inputs/Select/index.js +1 -2
- package/inputs/Select/index.js.map +2 -2
- package/lazy/index.js +3 -0
- package/lazy.d.ts +3 -0
- package/lazy.js.map +2 -2
- package/package.json +4 -4
- package/registry/index.js +2 -0
- package/registry.d.ts +1 -0
- package/registry.js.map +2 -2
- package/src/Field/FieldBaseContainer.tsx +1 -1
- package/src/FieldArray/index.tsx +9 -8
- package/src/FieldObject/index.tsx +2 -2
- package/src/Fieldset/index.tsx +5 -5
- package/src/Fieldset/types.tsx +2 -2
- package/src/FormBuilder/{FormBuilder.mdx → doc.mdx} +20 -33
- package/src/FormBuilder/index.tsx +3 -3
- package/src/MultiplicityField/add-objects.tsx +5 -6
- package/src/MultiplicityField/{MultiplicityField.mdx → doc.mdx} +12 -16
- package/src/MultiplicityField/index.tsx +13 -12
- package/src/Questions/Step/StepTitle.tsx +4 -3
- package/src/Questions/__snapshots__/index.spec.tsx.snap +8 -4
- package/src/Questions/{index.mdx → doc.mdx} +9 -12
- package/src/create-simple-form.mdx +2 -6
- package/src/{index.mdx → doc.mdx} +4 -8
- package/src/inputs/AutoCompleteInput/{index.mdx → doc.mdx} +2 -13
- package/src/inputs/AutoCompleteInput/index.tsx +31 -26
- package/src/inputs/Checkboxes/{index.mdx → doc.mdx} +5 -15
- package/src/inputs/Checkboxes/index.tsx +29 -27
- package/src/inputs/DateInput/{index.mdx → doc.mdx} +1 -8
- package/src/inputs/DateInput/index.tsx +5 -3
- package/src/inputs/FileInput/{index.mdx → doc.mdx} +1 -5
- package/src/inputs/FileInput/index.tsx +5 -6
- package/src/inputs/ImageInput/__stories__/WithInvalidImageDimension.tsx +2 -0
- package/src/inputs/ImageInput/doc.mdx +23 -0
- package/src/inputs/ImageInput/index.tsx +9 -11
- package/src/inputs/Input/doc.mdx +56 -0
- package/src/inputs/Input/index.tsx +19 -11
- package/src/inputs/Label/doc.mdx +14 -0
- package/src/inputs/Label/index.tsx +2 -3
- package/src/inputs/OtpInput/{index.mdx → doc.mdx} +1 -8
- package/src/inputs/Radio/{index.mdx → doc.mdx} +5 -15
- package/src/inputs/Radio/index.tsx +57 -55
- package/src/inputs/Select/{index.mdx → doc.mdx} +1 -5
- package/src/inputs/Select/index.tsx +1 -2
- package/src/installation.mdx +2 -5
- package/src/lazy.js +3 -0
- package/src/registry.js +2 -0
- package/src/validators/index.ts +10 -70
- package/src/validators/utils/date.ts +107 -0
- package/src/validators/utils/index.ts +1 -0
- package/validators/index.js +10 -66
- package/validators/index.js.map +2 -2
- package/validators/utils/date/index.js +103 -0
- package/validators/utils/date/package.json +6 -0
- package/validators/utils/date.d.ts +9 -0
- package/validators/utils/date.js.map +7 -0
- package/validators/utils/index.d.ts +1 -0
- package/validators/utils/index.js +1 -0
- package/validators/utils/index.js.map +2 -2
- package/src/inputs/ImageInput/index.mdx +0 -19
- package/src/inputs/Input/index.mdx +0 -95
- package/src/inputs/Label/index.mdx +0 -0
- /package/src/Field/{index.mdx → doc.mdx} +0 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/inputs/AutoCompleteInput/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import React, { useCallback } from 'react';\nimport { ControlledFieldProps } from '@digigov/form/Field/types';\nimport { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport {
|
|
5
|
-
"mappings": "AAAA,OAAO,SAAS,mBAAmB;AAGnC,SAAS,YAAY;AACrB,
|
|
4
|
+
"sourcesContent": ["import React, { useCallback } from 'react';\nimport { ControlledFieldProps } from '@digigov/form/Field/types';\nimport { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport {\n AutoComplete,\n AutoCompleteProps as UIAutoCompleteProps,\n} from '@digigov/ui/form/AutoComplete';\nimport { Hint } from '@digigov/ui/typography/Hint';\nimport { Base } from '@digigov/ui/utils/Base';\nexport interface AutoCompleteInputExtra\n extends Omit<\n UIAutoCompleteProps,\n | 'source'\n | 'id'\n | 'templates'\n | 'defaultValue'\n | 'onConfirm'\n | 'dropdownArrow'\n > {\n options: Array<FieldOptionProps>;\n}\n\nexport interface AutoCompleteInputProps\n extends Omit<ControlledFieldProps, 'value' | 'onChange' | 'extra'> {\n extra: AutoCompleteInputExtra;\n value: string;\n onChange: (v: string | string[] | undefined) => void;\n}\n\nexport const AutoCompleteInput: React.FC<AutoCompleteInputProps> = ({\n name,\n type,\n extra: { options },\n onChange,\n value,\n error,\n ...props\n}) => {\n const suggest = useCallback(\n function suggest(\n query: string,\n syncResults: (options: any[]) => void\n ): void {\n syncResults(\n query\n ? options.filter(function (option) {\n return (\n `${option.value} ${option.label?.primary || ''} ${\n option.label?.secondary || ''\n }`\n .toLowerCase()\n .indexOf(query.toLowerCase()) !== -1\n );\n })\n : options\n );\n },\n [options]\n );\n\n return (\n <AutoComplete\n multiple={type === 'choice:multiple' ? true : false}\n source={suggest}\n onConfirm={(value) => {\n if (Array.isArray(value)) {\n const selectedValues = value.map((item) => item.value);\n selectedValues.length > 0\n ? onChange(selectedValues)\n : onChange(undefined);\n } else {\n onChange(value.value);\n }\n }}\n templates={{\n suggestion({ label, value }) {\n return (\n <Base as=\"div\">\n {(label && label.primary && label.primary) || value}\n {label && label.secondary && <Hint>{label.secondary}</Hint>}\n </Base>\n );\n },\n inputValue: (option) => {\n if (!option) {\n return '';\n }\n return option.label.primary || option.value;\n },\n }}\n {...{\n ...props,\n reset: undefined,\n required: undefined,\n }}\n name={name}\n id={`${name}-id`}\n defaultValue={value}\n />\n );\n};\n\nexport default AutoCompleteInput;\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,SAAS,mBAAmB;AAGnC;AAAA,EACE;AAAA,OAEK;AACP,SAAS,YAAY;AACrB,SAAS,YAAY;AAqBd,MAAM,oBAAsD,CAAC;AAAA,EAClE;AAAA,EACA;AAAA,EACA,OAAO,EAAE,QAAQ;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,UAAU;AAAA,IACd,SAASA,SACP,OACA,aACM;AACN;AAAA,QACE,QACI,QAAQ,OAAO,SAAU,QAAQ;AAC/B,iBACE,GAAG,OAAO,KAAK,IAAI,OAAO,OAAO,WAAW,EAAE,IAC5C,OAAO,OAAO,aAAa,EAC7B,GACG,YAAY,EACZ,QAAQ,MAAM,YAAY,CAAC,MAAM;AAAA,QAExC,CAAC,IACD;AAAA,MACN;AAAA,IACF;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,SAAS,oBAAoB,OAAO;AAAA,MAC9C,QAAQ;AAAA,MACR,WAAW,CAACC,WAAU;AACpB,YAAI,MAAM,QAAQA,MAAK,GAAG;AACxB,gBAAM,iBAAiBA,OAAM,IAAI,CAAC,SAAS,KAAK,KAAK;AACrD,yBAAe,SAAS,IACpB,SAAS,cAAc,IACvB,SAAS,MAAS;AAAA,QACxB,OAAO;AACL,mBAASA,OAAM,KAAK;AAAA,QACtB;AAAA,MACF;AAAA,MACA,WAAW;AAAA,QACT,WAAW,EAAE,OAAO,OAAAA,OAAM,GAAG;AAC3B,iBACE,oCAAC,QAAK,IAAG,SACL,SAAS,MAAM,WAAW,MAAM,WAAYA,QAC7C,SAAS,MAAM,aAAa,oCAAC,YAAM,MAAM,SAAU,CACtD;AAAA,QAEJ;AAAA,QACA,YAAY,CAAC,WAAW;AACtB,cAAI,CAAC,QAAQ;AACX,mBAAO;AAAA,UACT;AACA,iBAAO,OAAO,MAAM,WAAW,OAAO;AAAA,QACxC;AAAA,MACF;AAAA,MACC,GAAG;AAAA,QACF,GAAG;AAAA,QACH,OAAO;AAAA,QACP,UAAU;AAAA,MACZ;AAAA,MACA;AAAA,MACA,IAAI,GAAG,IAAI;AAAA,MACX,cAAc;AAAA;AAAA,EAChB;AAEJ;AAEA,IAAO,4BAAQ;",
|
|
6
6
|
"names": ["suggest", "value"]
|
|
7
7
|
}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import React, { useState } from "react";
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
import {
|
|
3
|
+
Checkbox,
|
|
4
|
+
CheckboxItem,
|
|
5
|
+
CheckboxConditional
|
|
6
|
+
} from "@digigov/ui/form/Checkbox";
|
|
6
7
|
import { useTranslation } from "@digigov/ui/i18n";
|
|
8
|
+
import { Hint } from "@digigov/ui/typography/Hint";
|
|
7
9
|
const Checkboxes = ({
|
|
8
10
|
name,
|
|
9
11
|
onChange,
|
|
@@ -33,7 +35,7 @@ const Checkboxes = ({
|
|
|
33
35
|
const [checked, setChecked] = useState(
|
|
34
36
|
Array(options.length).fill(false)
|
|
35
37
|
);
|
|
36
|
-
return /* @__PURE__ */ React.createElement(
|
|
38
|
+
return /* @__PURE__ */ React.createElement(Checkbox, { className }, options.map(
|
|
37
39
|
({
|
|
38
40
|
label,
|
|
39
41
|
value: v,
|
|
@@ -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
|
|
5
|
-
"mappings": "AAAA,OAAO,SAAS,gBAAgB;AAGhC,
|
|
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: Array<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 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 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,OAAO,SAAS,gBAAgB;AAGhC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,sBAAsB;AAC/B,SAAS,YAAY;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,IAAI,eAAe;AAC7B,QAAM,CAAC,SAAS,UAAU,IAAI;AAAA,IAC5B,MAAe,QAAQ,MAAM,EAAE,KAAK,KAAK;AAAA,EAC3C;AACA,SACE,oCAAC,YAAS,aACP,QAAQ;AAAA,IACP,CACE;AAAA,MACE;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,UAAU;AAAA,MACV;AAAA,MACA,GAAG;AAAA,IACL,GACA,UAEA,oCAAC,MAAM,UAAN,EAAe,KAAK,SACnB;AAAA,MAAC;AAAA;AAAA,QACC,KAAK,GAAG,IAAI,IAAI,KAAK;AAAA,QACrB,MAAM,GAAG,IAAI,IAAI,CAAC;AAAA,QAClB,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,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,oCAAC,YAAM,EAAE,MAAM,SAAS,CAAE;AAAA,IACzD,GAEC,CAAC,CAAC,QAAQ,KAAK,KAAK,QAAQ,SAC3B,oCAAC,2BACE,KAAK,IAAI,CAAC,cACT,oCAAC,SAAM,MAAM,WAAW,KAAK,WAAW,CACzC,CACH,GAED,YAAY,SAAS,CACxB;AAAA,EAEJ,CACF;AAEJ;AAEA,IAAO,qBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React, { useMemo, useState } from "react";
|
|
2
2
|
import dayjs from "dayjs";
|
|
3
3
|
import customParseFormat from "dayjs/plugin/customParseFormat";
|
|
4
|
-
import
|
|
5
|
-
|
|
4
|
+
import {
|
|
5
|
+
DateInputContainer,
|
|
6
|
+
DateInputItem
|
|
7
|
+
} from "@digigov/ui/form/DateInputContainer";
|
|
6
8
|
import { useTranslation } from "@digigov/ui/i18n";
|
|
7
9
|
dayjs.extend(customParseFormat);
|
|
8
10
|
function useDate(value, onChange) {
|
|
@@ -58,7 +60,7 @@ const makeDate = (val) => {
|
|
|
58
60
|
return "";
|
|
59
61
|
};
|
|
60
62
|
const DatePart = ({ label, ...props }) => {
|
|
61
|
-
return /* @__PURE__ */ React.createElement(
|
|
63
|
+
return /* @__PURE__ */ React.createElement(DateInputItem, { ...props }, label);
|
|
62
64
|
};
|
|
63
65
|
const DateInput = ({ name, type, ...props }) => {
|
|
64
66
|
const { t } = useTranslation();
|
|
@@ -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 DateInputContainer from '@digigov/
|
|
5
|
-
"mappings": "AAAA,OAAO,SAAS,SAAS,gBAAgB;AACzC,OAAO,WAAW;AAClB,OAAO,uBAAuB;AAE9B,
|
|
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 {\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(value, onChange) {\n const [year, month, day] = useMemo(() => {\n if (!value || value.length === 0) {\n onChange('');\n return ['', '', ''];\n }\n const [day, month, year] = value.split('/');\n return [year, month, day];\n }, [value]);\n\n function set(year, month, day) {\n const value = `${day || ''}/${month || ''}/${year || ''}`;\n if (!year && !month && !day) {\n onChange(null);\n } else {\n onChange(value);\n }\n }\n\n function setYear(evt) {\n const val = evt.target.value;\n set(val, month, day);\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);\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);\n }\n\n return {\n day,\n month,\n year,\n setYear,\n setMonth,\n setDay,\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, type, ...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 date = useDate(value || makeDate(props.defaultValue), props.onChange);\n\n return (\n <DateInputContainer>\n <DatePart\n label={t('form.label.day')}\n onChange={date.setDay}\n onBlur={(e) => date.setDay(e, true)}\n value={date.day}\n width={2}\n name={`${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) => date.setMonth(e, true)}\n value={date.month}\n width={2}\n name={`${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 value={date.year}\n width={4}\n name={`${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": ["day", "month", "year", "value"]
|
|
7
7
|
}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import React, { useState } from "react";
|
|
2
|
-
import
|
|
3
|
-
import FileUploadContainer from "@digigov/
|
|
4
|
-
import CoreHint from "@digigov/react-core/Hint";
|
|
5
|
-
import Button from "@digigov/ui/form/Button";
|
|
2
|
+
import { Button } from "@digigov/ui/form/Button";
|
|
3
|
+
import { FileUpload, FileUploadContainer } from "@digigov/ui/form/FileUpload";
|
|
6
4
|
import { useTranslation } from "@digigov/ui/i18n";
|
|
7
|
-
import
|
|
5
|
+
import { Hint } from "@digigov/ui/typography/Hint";
|
|
6
|
+
import { Paragraph } from "@digigov/ui/typography/Paragraph";
|
|
8
7
|
const FileInput = React.forwardRef(function FileInput2({ name, extra = {}, disabled, reset, onChange, ...props }, ref) {
|
|
9
8
|
const { t } = useTranslation();
|
|
10
9
|
const [files, setFiles] = useState([]);
|
|
@@ -16,7 +15,7 @@ const FileInput = React.forwardRef(function FileInput2({ name, extra = {}, disab
|
|
|
16
15
|
setFiles(selectedFiles);
|
|
17
16
|
onChange(e);
|
|
18
17
|
};
|
|
19
|
-
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(FileUploadContainer, { hasFiles: files && files.length > 0 }, files?.length ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Paragraph, null, /* @__PURE__ */ React.createElement("b", null, t("upload.file"), ":"), " ", `${files.join(", ")}`)) : /* @__PURE__ */ React.createElement(
|
|
18
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(FileUploadContainer, { hasFiles: files && files.length > 0 }, files?.length ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Paragraph, null, /* @__PURE__ */ React.createElement("b", null, t("upload.file"), ":"), " ", `${files.join(", ")}`)) : /* @__PURE__ */ React.createElement(Hint, null, t("upload.no_file")), /* @__PURE__ */ React.createElement(
|
|
20
19
|
FileUpload,
|
|
21
20
|
{
|
|
22
21
|
ref,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/inputs/FileInput/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import React, { useState } from 'react';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport
|
|
5
|
-
"mappings": "AAAA,OAAO,SAAS,gBAAgB;AAEhC,
|
|
4
|
+
"sourcesContent": ["import React, { useState } from 'react';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { Button } from '@digigov/ui/form/Button';\nimport { FileUpload, FileUploadContainer } 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';\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 };\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const FileInput: React.FC<any> = React.forwardRef(function FileInput(\n { name, extra = {}, disabled, reset, onChange, ...props },\n ref: any\n) {\n const { t } = useTranslation();\n const [files, setFiles] = useState<Array<string> | undefined>([]);\n const handleChange = (e) => {\n const target = e.target as HTMLInputElement;\n const selectedFiles = Array.from(\n target.files as ArrayLike<{ name: string }>\n ).map(({ name }) => name);\n setFiles(selectedFiles);\n // proceed calling the onChange provided\n // by react-hook-form\n onChange(e);\n };\n return (\n <>\n <FileUploadContainer hasFiles={files && files.length > 0}>\n {files?.length ? (\n <>\n <Paragraph>\n <b>{t('upload.file')}:</b> {`${files.join(', ')}`}\n </Paragraph>\n </>\n ) : (\n <Hint>{t('upload.no_file')}</Hint>\n )}\n <FileUpload\n ref={ref}\n hasFiles={!!files?.length}\n name={name}\n disabled={disabled}\n onChange={handleChange}\n {...{ ...props, required: undefined }}\n >\n {files?.length ? t('upload.change_file') : t('upload.choose_file')}\n </FileUpload>\n {files !== undefined && files.length > 0 && (\n <>\n <Button\n variant=\"link\"\n onClick={(event) => {\n event.preventDefault();\n reset({ [name]: '' });\n setFiles(undefined);\n }}\n >\n {t('upload.reset_file')}\n </Button>\n </>\n )}\n </FileUploadContainer>\n </>\n );\n});\n\nexport default FileInput;\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,SAAS,gBAAgB;AAEhC,SAAS,cAAc;AACvB,SAAS,YAAY,2BAA2B;AAChD,SAAS,sBAAsB;AAC/B,SAAS,YAAY;AACrB,SAAS,iBAAiB;AAanB,MAAM,YAA2B,MAAM,WAAW,SAASA,WAChE,EAAE,MAAM,QAAQ,CAAC,GAAG,UAAU,OAAO,UAAU,GAAG,MAAM,GACxD,KACA;AACA,QAAM,EAAE,EAAE,IAAI,eAAe;AAC7B,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAoC,CAAC,CAAC;AAChE,QAAM,eAAe,CAAC,MAAM;AAC1B,UAAM,SAAS,EAAE;AACjB,UAAM,gBAAgB,MAAM;AAAA,MAC1B,OAAO;AAAA,IACT,EAAE,IAAI,CAAC,EAAE,MAAAC,MAAK,MAAMA,KAAI;AACxB,aAAS,aAAa;AAGtB,aAAS,CAAC;AAAA,EACZ;AACA,SACE,0DACE,oCAAC,uBAAoB,UAAU,SAAS,MAAM,SAAS,KACpD,OAAO,SACN,0DACE,oCAAC,iBACC,oCAAC,WAAG,EAAE,aAAa,GAAE,GAAC,GAAI,KAAE,GAAG,MAAM,KAAK,IAAI,CAAC,EACjD,CACF,IAEA,oCAAC,YAAM,EAAE,gBAAgB,CAAE,GAE7B;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,UAAU,CAAC,CAAC,OAAO;AAAA,MACnB;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACT,GAAG,EAAE,GAAG,OAAO,UAAU,OAAU;AAAA;AAAA,IAEnC,OAAO,SAAS,EAAE,oBAAoB,IAAI,EAAE,oBAAoB;AAAA,EACnE,GACC,UAAU,UAAa,MAAM,SAAS,KACrC,0DACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,SAAS,CAAC,UAAU;AAClB,cAAM,eAAe;AACrB,cAAM,EAAE,CAAC,IAAI,GAAG,GAAG,CAAC;AACpB,iBAAS,MAAS;AAAA,MACpB;AAAA;AAAA,IAEC,EAAE,mBAAmB;AAAA,EACxB,CACF,CAEJ,CACF;AAEJ,CAAC;AAED,IAAO,oBAAQ;",
|
|
6
6
|
"names": ["FileInput", "name"]
|
|
7
7
|
}
|
|
@@ -7,7 +7,8 @@ const FIELDS = [
|
|
|
7
7
|
type: "image",
|
|
8
8
|
required: true,
|
|
9
9
|
label: {
|
|
10
|
-
primary: "\u0391\u03BD\u03AD\u03B2\u03B1\u03C3\u03BC\u03B1 \u03C6\u03C9\u03C4\u03BF\u03B3\u03C1\u03B1\u03C6\u03AF\u03B1\u03C2"
|
|
10
|
+
primary: "\u0391\u03BD\u03AD\u03B2\u03B1\u03C3\u03BC\u03B1 \u03C6\u03C9\u03C4\u03BF\u03B3\u03C1\u03B1\u03C6\u03AF\u03B1\u03C2",
|
|
11
|
+
secondary: "\u039F\u03B9 \u03B5\u03C0\u03B9\u03C4\u03C1\u03B5\u03C0\u03CC\u03BC\u03B5\u03BD\u03B5\u03C2 \u03B4\u03B9\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u03B5\u03AF\u03BD\u03B1\u03B9 \u03B3\u03B9\u03B1 \u03C4\u03BF \u03CD\u03C8\u03BF\u03C2 \u03B1\u03C0\u03CC 100 \u03BC\u03AD\u03C7\u03C1\u03B9 400 \u03BA\u03B1\u03B9 \u03B3\u03B9\u03B1 \u03C4\u03BF \u03C0\u03BB\u03AC\u03C4\u03BF\u03C2 \u03B1\u03C0\u03CC 100 \u03BC\u03AD\u03C7\u03C1\u03B9 400."
|
|
11
12
|
},
|
|
12
13
|
extra: {
|
|
13
14
|
limit: {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/inputs/ImageInput/__stories__/WithInvalidImageDimension.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport FormBuilder, { Field, Fieldset } from '@digigov/form';\nimport { FieldSpec } from '@digigov/form/types';\nimport { Button } from '@digigov/ui/form/Button';\nconst FIELDS: FieldSpec[] = [\n {\n key: 'image',\n type: 'image',\n required: true,\n label: {\n primary: '\u0391\u03BD\u03AD\u03B2\u03B1\u03C3\u03BC\u03B1 \u03C6\u03C9\u03C4\u03BF\u03B3\u03C1\u03B1\u03C6\u03AF\u03B1\u03C2',\n },\n extra: {\n limit: {\n maxHeight: 400,\n maxWidth: 400,\n minHeight: 100,\n minWidth: 100,\n },\n },\n },\n];\n\nexport const WithInvalidImageDimension = () => (\n <FormBuilder\n fields={FIELDS}\n onSubmit={(data) => {\n console.log(data);\n }}\n >\n <Fieldset>\n {FIELDS.map((field) => (\n <Field key={field.key} name={field.key} />\n ))}\n </Fieldset>\n <Button type=\"submit\">\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1</Button>\n </FormBuilder>\n);\nexport default WithInvalidImageDimension;\n"],
|
|
5
|
-
"mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,eAAe,OAAO,gBAAgB;AAE7C,SAAS,cAAc;AACvB,MAAM,SAAsB;AAAA,EAC1B;AAAA,IACE,KAAK;AAAA,IACL,MAAM;AAAA,IACN,UAAU;AAAA,IACV,OAAO;AAAA,MACL,SAAS;AAAA,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport FormBuilder, { Field, Fieldset } from '@digigov/form';\nimport { FieldSpec } from '@digigov/form/types';\nimport { Button } from '@digigov/ui/form/Button';\nconst FIELDS: FieldSpec[] = [\n {\n key: 'image',\n type: 'image',\n required: true,\n label: {\n primary: '\u0391\u03BD\u03AD\u03B2\u03B1\u03C3\u03BC\u03B1 \u03C6\u03C9\u03C4\u03BF\u03B3\u03C1\u03B1\u03C6\u03AF\u03B1\u03C2',\n secondary:\n '\u039F\u03B9 \u03B5\u03C0\u03B9\u03C4\u03C1\u03B5\u03C0\u03CC\u03BC\u03B5\u03BD\u03B5\u03C2 \u03B4\u03B9\u03B1\u03C3\u03C4\u03AC\u03C3\u03B5\u03B9\u03C2 \u03B5\u03AF\u03BD\u03B1\u03B9 \u03B3\u03B9\u03B1 \u03C4\u03BF \u03CD\u03C8\u03BF\u03C2 \u03B1\u03C0\u03CC 100 \u03BC\u03AD\u03C7\u03C1\u03B9 400 \u03BA\u03B1\u03B9 \u03B3\u03B9\u03B1 \u03C4\u03BF \u03C0\u03BB\u03AC\u03C4\u03BF\u03C2 \u03B1\u03C0\u03CC 100 \u03BC\u03AD\u03C7\u03C1\u03B9 400.',\n },\n extra: {\n limit: {\n maxHeight: 400,\n maxWidth: 400,\n minHeight: 100,\n minWidth: 100,\n },\n },\n },\n];\n\nexport const WithInvalidImageDimension = () => (\n <FormBuilder\n fields={FIELDS}\n onSubmit={(data) => {\n console.log(data);\n }}\n >\n <Fieldset>\n {FIELDS.map((field) => (\n <Field key={field.key} name={field.key} />\n ))}\n </Fieldset>\n <Button type=\"submit\">\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1</Button>\n </FormBuilder>\n);\nexport default WithInvalidImageDimension;\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,eAAe,OAAO,gBAAgB;AAE7C,SAAS,cAAc;AACvB,MAAM,SAAsB;AAAA,EAC1B;AAAA,IACE,KAAK;AAAA,IACL,MAAM;AAAA,IACN,UAAU;AAAA,IACV,OAAO;AAAA,MACL,SAAS;AAAA,MACT,WACE;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,MACL,OAAO;AAAA,QACL,WAAW;AAAA,QACX,UAAU;AAAA,QACV,WAAW;AAAA,QACX,UAAU;AAAA,MACZ;AAAA,IACF;AAAA,EACF;AACF;AAEO,MAAM,4BAA4B,MACvC;AAAA,EAAC;AAAA;AAAA,IACC,QAAQ;AAAA,IACR,UAAU,CAAC,SAAS;AAClB,cAAQ,IAAI,IAAI;AAAA,IAClB;AAAA;AAAA,EAEA,oCAAC,gBACE,OAAO,IAAI,CAAC,UACX,oCAAC,SAAM,KAAK,MAAM,KAAK,MAAM,MAAM,KAAK,CACzC,CACH;AAAA,EACA,oCAAC,UAAO,MAAK,YAAS,kDAAQ;AAChC;AAEF,IAAO,oCAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import React, { useState, useCallback } from "react";
|
|
2
|
-
import
|
|
3
|
-
import FileUploadContainer from "@digigov/
|
|
4
|
-
import CoreHint from "@digigov/react-core/Hint";
|
|
5
|
-
import Button, { ButtonGroup } from "@digigov/ui/form/Button";
|
|
2
|
+
import { Button, ButtonGroup } from "@digigov/ui/form/Button";
|
|
3
|
+
import { FileUpload, FileUploadContainer } from "@digigov/ui/form/FileUpload";
|
|
6
4
|
import { useTranslation } from "@digigov/ui/i18n";
|
|
7
|
-
import
|
|
8
|
-
import {
|
|
5
|
+
import { Hint } from "@digigov/ui/typography/Hint";
|
|
6
|
+
import { Paragraph } from "@digigov/ui/typography/Paragraph";
|
|
7
|
+
import { Base } from "@digigov/ui/utils/Base";
|
|
9
8
|
const Image = React.memo(function Image2({ src }) {
|
|
10
9
|
return /* @__PURE__ */ React.createElement(Base, { as: "img", src, className: "ds-image--ratio" });
|
|
11
10
|
});
|
|
@@ -36,7 +35,7 @@ const ImageInput = React.forwardRef(
|
|
|
36
35
|
},
|
|
37
36
|
[selectedImage]
|
|
38
37
|
);
|
|
39
|
-
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(FileUploadContainer, null, selectedImage !== null ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Paragraph, null, /* @__PURE__ */ React.createElement(Base, { as: "b" }, t("upload.image"), ":"), " ", `${selectedImage?.name}`)) : /* @__PURE__ */ React.createElement(
|
|
38
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(FileUploadContainer, null, selectedImage !== null ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Paragraph, null, /* @__PURE__ */ React.createElement(Base, { as: "b" }, t("upload.image"), ":"), " ", `${selectedImage?.name}`)) : /* @__PURE__ */ React.createElement(Hint, { className: "ds-dashed--border" }, t("upload.no_image")), /* @__PURE__ */ React.createElement(React.Fragment, null, selectedImage !== null && /* @__PURE__ */ React.createElement(Image, { src: imageUrl }), /* @__PURE__ */ React.createElement(ButtonGroup, { marginTop: 2 }, selectedImage !== null && /* @__PURE__ */ React.createElement(Button, { variant: "link", onClick: handleDeleteImage }, t("upload.reset_file")), /* @__PURE__ */ React.createElement(
|
|
40
39
|
FileUpload,
|
|
41
40
|
{
|
|
42
41
|
ref,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/inputs/ImageInput/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport
|
|
5
|
-
"mappings": "AAAA,OAAO,SAAS,UAAU,mBAAmB;AAE7C,
|
|
4
|
+
"sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { Button, ButtonGroup } from '@digigov/ui/form/Button';\nimport { FileUpload, FileUploadContainer } 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';\nimport { Base } from '@digigov/ui/utils/Base';\nexport interface ImageProps {\n src?: any;\n}\n\nexport interface Limit {\n maxSize?: number;\n maxWidth?: number;\n maxHeight?: number;\n minWidth?: number;\n minHeight?: number;\n}\n\nexport const Image: React.FC<ImageProps> = React.memo(function Image({ src }) {\n return <Base as=\"img\" src={src} className=\"ds-image--ratio\" />;\n});\nexport interface ImageInputProps extends Omit<UncontrolledFieldProps, 'extra'> {\n extra?: {\n className?: string;\n multiple?: boolean;\n accept?: string;\n limit?: Limit;\n };\n reset: (values?: any) => void;\n onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n}\n\nexport const ImageInput: React.FC<ImageInputProps> = React.forwardRef(\n function ImageInput(\n { name, extra = {}, disabled, onChange, reset, ...props },\n ref: any\n ) {\n const { t } = useTranslation();\n const [selectedImage, setSelectedImage] = useState<File | null>(null);\n const [imageUrl, setImageUrl] = useState<string | null>(null);\n const handleImageChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n e.preventDefault();\n const target = e.target as HTMLInputElement;\n const selectedFile = target.files?.[0];\n\n if (selectedFile) {\n setSelectedImage(selectedFile);\n setImageUrl(URL.createObjectURL(selectedFile));\n }\n onChange(e);\n },\n [selectedImage]\n );\n\n const handleDeleteImage = useCallback(\n (event) => {\n event.preventDefault();\n reset({ [name]: '' });\n setSelectedImage(null);\n setImageUrl('');\n },\n [selectedImage]\n );\n\n return (\n <>\n <FileUploadContainer>\n {selectedImage !== null ? (\n <>\n <Paragraph>\n <Base as=\"b\">{t('upload.image')}:</Base>{' '}\n {`${selectedImage?.name}`}\n </Paragraph>\n </>\n ) : (\n <Hint className=\"ds-dashed--border\">{t('upload.no_image')}</Hint>\n )}\n <>\n {selectedImage !== null && <Image src={imageUrl} />}\n <ButtonGroup marginTop={2}>\n {selectedImage !== null && (\n <Button variant=\"link\" onClick={handleDeleteImage}>\n {t('upload.reset_file')}\n </Button>\n )}\n <FileUpload\n ref={ref}\n hasFiles={selectedImage !== null}\n name={name}\n disabled={disabled}\n accept=\"image/*\"\n onChange={handleImageChange}\n {...{ ...props, required: undefined, type: 'file' }}\n >\n {t('upload.choose_image')}\n </FileUpload>\n </ButtonGroup>\n </>\n </FileUploadContainer>\n </>\n );\n }\n);\n\nexport default ImageInput;\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,SAAS,UAAU,mBAAmB;AAE7C,SAAS,QAAQ,mBAAmB;AACpC,SAAS,YAAY,2BAA2B;AAChD,SAAS,sBAAsB;AAC/B,SAAS,YAAY;AACrB,SAAS,iBAAiB;AAC1B,SAAS,YAAY;AAad,MAAM,QAA8B,MAAM,KAAK,SAASA,OAAM,EAAE,IAAI,GAAG;AAC5E,SAAO,oCAAC,QAAK,IAAG,OAAM,KAAU,WAAU,mBAAkB;AAC9D,CAAC;AAYM,MAAM,aAAwC,MAAM;AAAA,EACzD,SAASC,YACP,EAAE,MAAM,QAAQ,CAAC,GAAG,UAAU,UAAU,OAAO,GAAG,MAAM,GACxD,KACA;AACA,UAAM,EAAE,EAAE,IAAI,eAAe;AAC7B,UAAM,CAAC,eAAe,gBAAgB,IAAI,SAAsB,IAAI;AACpE,UAAM,CAAC,UAAU,WAAW,IAAI,SAAwB,IAAI;AAC5D,UAAM,oBAAoB;AAAA,MACxB,CAAC,MAA2C;AAC1C,UAAE,eAAe;AACjB,cAAM,SAAS,EAAE;AACjB,cAAM,eAAe,OAAO,QAAQ,CAAC;AAErC,YAAI,cAAc;AAChB,2BAAiB,YAAY;AAC7B,sBAAY,IAAI,gBAAgB,YAAY,CAAC;AAAA,QAC/C;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,aAAa;AAAA,IAChB;AAEA,UAAM,oBAAoB;AAAA,MACxB,CAAC,UAAU;AACT,cAAM,eAAe;AACrB,cAAM,EAAE,CAAC,IAAI,GAAG,GAAG,CAAC;AACpB,yBAAiB,IAAI;AACrB,oBAAY,EAAE;AAAA,MAChB;AAAA,MACA,CAAC,aAAa;AAAA,IAChB;AAEA,WACE,0DACE,oCAAC,2BACE,kBAAkB,OACjB,0DACE,oCAAC,iBACC,oCAAC,QAAK,IAAG,OAAK,EAAE,cAAc,GAAE,GAAC,GAAQ,KACxC,GAAG,eAAe,IAAI,EACzB,CACF,IAEA,oCAAC,QAAK,WAAU,uBAAqB,EAAE,iBAAiB,CAAE,GAE5D,0DACG,kBAAkB,QAAQ,oCAAC,SAAM,KAAK,UAAU,GACjD,oCAAC,eAAY,WAAW,KACrB,kBAAkB,QACjB,oCAAC,UAAO,SAAQ,QAAO,SAAS,qBAC7B,EAAE,mBAAmB,CACxB,GAEF;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,UAAU,kBAAkB;AAAA,QAC5B;AAAA,QACA;AAAA,QACA,QAAO;AAAA,QACP,UAAU;AAAA,QACT,GAAG,EAAE,GAAG,OAAO,UAAU,QAAW,MAAM,OAAO;AAAA;AAAA,MAEjD,EAAE,qBAAqB;AAAA,IAC1B,CACF,CACF,CACF,CACF;AAAA,EAEJ;AACF;AAEA,IAAO,qBAAQ;",
|
|
6
6
|
"names": ["Image", "ImageInput"]
|
|
7
7
|
}
|
package/inputs/Input/index.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { useWatch } from "react-hook-form";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import { TextInput } from "@digigov/react-core/TextInput";
|
|
3
|
+
import { TextArea } from "@digigov/ui/form/TextArea";
|
|
4
|
+
import { TextInput } from "@digigov/ui/form/TextInput";
|
|
6
5
|
import { useTranslation } from "@digigov/ui/i18n";
|
|
6
|
+
import { Hint } from "@digigov/ui/typography/Hint";
|
|
7
7
|
const TYPES_MAP = {
|
|
8
8
|
string: "text",
|
|
9
9
|
int: "text",
|
|
@@ -11,7 +11,7 @@ const TYPES_MAP = {
|
|
|
11
11
|
date: "date"
|
|
12
12
|
};
|
|
13
13
|
const Input = React.forwardRef(
|
|
14
|
-
function WrappedInput({ name, control, type, extra, ...props }, ref) {
|
|
14
|
+
function WrappedInput({ name, control, type, extra, Field, ...props }, ref) {
|
|
15
15
|
let { multiline = false, rows, limit } = extra || {};
|
|
16
16
|
const { className } = extra || {};
|
|
17
17
|
multiline = multiline === true || type === "text";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/inputs/Input/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { useWatch } from 'react-hook-form';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport {
|
|
5
|
-
"mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,gBAAgB;AAEzB,SAAS,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { useWatch } from 'react-hook-form';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { TextArea } from '@digigov/ui/form/TextArea';\nimport { TextInput } from '@digigov/ui/form/TextInput';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nconst TYPES_MAP = {\n string: 'text',\n int: 'text',\n text: 'text',\n date: 'date',\n};\n\nexport interface InputProps extends Omit<UncontrolledFieldProps, 'extra'> {\n extra?: {\n fullWidth?: boolean;\n multiline?: boolean;\n className?: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n rows?: any;\n limit: {\n min?: number;\n max?: number;\n };\n };\n}\n\nexport const Input: React.ExoticComponent<InputProps> = React.forwardRef(\n function WrappedInput({ name, control, type, extra, Field, ...props }, ref: never) {\n // eslint-disable-next-line prefer-const\n let { multiline = false, rows, limit } = extra || {};\n const { className } = extra || {};\n // if enforced to multiline use true. Derive from type otherwise.\n multiline = multiline === true || type === 'text';\n // use explicit rows value if set. Derive from multiline otherwise.\n rows = rows || (multiline ? 4 : 1);\n // translate dilosi type to HTML Input type\n const fieldType = TYPES_MAP[type || 'text'] || 'text';\n const { t } = useTranslation();\n const currentValue: string | '' = useWatch({ control, name });\n\n const getRemainingChars = (currentValue, limit) => {\n if (currentValue) {\n return limit?.max - currentValue.length;\n }\n return limit?.max;\n };\n\n const constructRemainingText = (currentValue, limit) => {\n const remainingChars = getRemainingChars(currentValue, limit);\n let remainingText =\n Math.abs(remainingChars) === 1\n ? t('form.info.text.character')\n : t('form.info.text.characters');\n remainingText +=\n remainingChars > 0\n ? ` ${t('form.info.text.remaining')}.`\n : ` ${t('form.info.text.too_many')}.`;\n return remainingText;\n };\n\n if (multiline === true) {\n return (\n <>\n <TextArea\n name={name}\n className={className}\n rows={rows}\n ref={ref}\n {...{\n ...props,\n reset: undefined,\n required: undefined,\n type: fieldType,\n }}\n />\n {limit?.max && (\n <Hint display={'flex'}>\n {t('form.info.text.you_have')}\n <Hint fontWeight=\"bold\">\n {`${Math.abs(getRemainingChars(currentValue, limit))}`}\n \n </Hint>\n {constructRemainingText(currentValue, limit)}\n </Hint>\n )}\n </>\n );\n } else {\n return (\n <TextInput\n name={name}\n type={fieldType}\n data-type={type}\n className={className}\n ref={ref}\n {...{ ...props, reset: undefined, required: undefined }}\n />\n );\n }\n }\n);\n\nexport default Input;\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,gBAAgB;AAEzB,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,sBAAsB;AAC/B,SAAS,YAAY;AAErB,MAAM,YAAY;AAAA,EAChB,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AACR;AAgBO,MAAM,QAA2C,MAAM;AAAA,EAC5D,SAAS,aAAa,EAAE,MAAM,SAAS,MAAM,OAAO,OAAO,GAAG,MAAM,GAAG,KAAY;AAEjF,QAAI,EAAE,YAAY,OAAO,MAAM,MAAM,IAAI,SAAS,CAAC;AACnD,UAAM,EAAE,UAAU,IAAI,SAAS,CAAC;AAEhC,gBAAY,cAAc,QAAQ,SAAS;AAE3C,WAAO,SAAS,YAAY,IAAI;AAEhC,UAAM,YAAY,UAAU,QAAQ,MAAM,KAAK;AAC/C,UAAM,EAAE,EAAE,IAAI,eAAe;AAC7B,UAAM,eAA4B,SAAS,EAAE,SAAS,KAAK,CAAC;AAE5D,UAAM,oBAAoB,CAACA,eAAcC,WAAU;AACjD,UAAID,eAAc;AAChB,eAAOC,QAAO,MAAMD,cAAa;AAAA,MACnC;AACA,aAAOC,QAAO;AAAA,IAChB;AAEA,UAAM,yBAAyB,CAACD,eAAcC,WAAU;AACtD,YAAM,iBAAiB,kBAAkBD,eAAcC,MAAK;AAC5D,UAAI,gBACF,KAAK,IAAI,cAAc,MAAM,IACzB,EAAE,0BAA0B,IAC5B,EAAE,2BAA2B;AACnC,uBACE,iBAAiB,IACb,IAAI,EAAE,0BAA0B,CAAC,MACjC,IAAI,EAAE,yBAAyB,CAAC;AACtC,aAAO;AAAA,IACT;AAEA,QAAI,cAAc,MAAM;AACtB,aACE,0DACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACC,GAAG;AAAA,YACF,GAAG;AAAA,YACH,OAAO;AAAA,YACP,UAAU;AAAA,YACV,MAAM;AAAA,UACR;AAAA;AAAA,MACF,GACC,OAAO,OACN,oCAAC,QAAK,SAAS,UACZ,EAAE,yBAAyB,GAC5B,oCAAC,QAAK,YAAW,UAAO,QACf,GAAG,KAAK,IAAI,kBAAkB,cAAc,KAAK,CAAC,CAAC,IAAG,MAE/D,GACC,uBAAuB,cAAc,KAAK,CAC7C,CAEJ;AAAA,IAEJ,OAAO;AACL,aACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,MAAM;AAAA,UACN,aAAW;AAAA,UACX;AAAA,UACA;AAAA,UACC,GAAG,EAAE,GAAG,OAAO,OAAO,QAAW,UAAU,OAAU;AAAA;AAAA,MACxD;AAAA,IAEJ;AAAA,EACF;AACF;AAEA,IAAO,gBAAQ;",
|
|
6
6
|
"names": ["currentValue", "limit"]
|
|
7
7
|
}
|
package/inputs/Label/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import
|
|
3
|
-
import LabelTitle from "@digigov/react-core/LabelTitle";
|
|
2
|
+
import { LabelTitle } from "@digigov/ui/form/LabelContainer";
|
|
4
3
|
import { useTranslation } from "@digigov/ui/i18n";
|
|
4
|
+
import { Hint } from "@digigov/ui/typography/Hint";
|
|
5
5
|
const Label = ({ className, label, value }) => {
|
|
6
6
|
const { t } = useTranslation();
|
|
7
7
|
if ((!label || label && !label.primary && !label.secondary) && !value) {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/inputs/Label/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { FieldLabelProps } from '@digigov/form/types';\nimport
|
|
5
|
-
"mappings": "AAAA,OAAO,WAAW;AAElB,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { FieldLabelProps } from '@digigov/form/types';\nimport { LabelTitle } from '@digigov/ui/form/LabelContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\n\nexport interface FieldOptionProps {\n label?: FieldLabelProps;\n value: string;\n show?: string[];\n disabled?: boolean;\n selected?: () => React.ReactNode;\n divider?: string;\n}\n\nexport interface LabelProps {\n primary?: string;\n secondary?: string;\n}\n\nexport interface LabelProps {\n className?: string;\n value?: string;\n label?: FieldLabelProps;\n}\n\nexport const Label: React.FC<LabelProps> = ({ className, label, value }) => {\n const { t } = useTranslation();\n if ((!label || (label && !label.primary && !label.secondary)) && !value) {\n return null;\n }\n return (\n <>\n <LabelTitle className={className} size=\"sm\">\n {(label && label.primary && t(label.primary)) || value}\n </LabelTitle>\n {label && label.secondary && <Hint>{t(label.secondary)}</Hint>}\n </>\n );\n};\n\nexport default Label;\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,WAAW;AAElB,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAC/B,SAAS,YAAY;AAsBd,MAAM,QAA8B,CAAC,EAAE,WAAW,OAAO,MAAM,MAAM;AAC1E,QAAM,EAAE,EAAE,IAAI,eAAe;AAC7B,OAAK,CAAC,SAAU,SAAS,CAAC,MAAM,WAAW,CAAC,MAAM,cAAe,CAAC,OAAO;AACvE,WAAO;AAAA,EACT;AACA,SACE,0DACE,oCAAC,cAAW,WAAsB,MAAK,QACnC,SAAS,MAAM,WAAW,EAAE,MAAM,OAAO,KAAM,KACnD,GACC,SAAS,MAAM,aAAa,oCAAC,YAAM,EAAE,MAAM,SAAS,CAAE,CACzD;AAEJ;AAEA,IAAO,gBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/inputs/Radio/index.js
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { useWatch } from "react-hook-form";
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
3
|
+
import {
|
|
4
|
+
RadioContainer,
|
|
5
|
+
RadioItem,
|
|
6
|
+
RadioConditional
|
|
7
|
+
} from "@digigov/ui/form/RadioContainer";
|
|
8
8
|
import { useTranslation } from "@digigov/ui/i18n";
|
|
9
|
+
import { Hint } from "@digigov/ui/typography/Hint";
|
|
10
|
+
import { Base } from "@digigov/ui/utils/Base";
|
|
9
11
|
const RadioButtonsGroup = ({
|
|
10
12
|
name,
|
|
11
13
|
control,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/inputs/Radio/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { useWatch } from 'react-hook-form';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport {
|
|
5
|
-
"mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,gBAAgB;AAGzB,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { useWatch } from 'react-hook-form';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport {\n RadioContainer,\n RadioItem,\n RadioConditional,\n} from '@digigov/ui/form/RadioContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\nimport { Hint } from '@digigov/ui/typography/Hint';\nimport { Base } from '@digigov/ui/utils/Base';\n\nexport interface RadioButtonsGroupProps\n extends Omit<UncontrolledFieldProps, 'extra'> {\n extra: {\n className?: string;\n options: Array<FieldOptionProps>;\n dense?: boolean;\n };\n fieldComponent?: React.FC<Omit<UncontrolledFieldProps, 'register'>>;\n}\n\nexport const RadioButtonsGroup: React.FC<RadioButtonsGroupProps> = ({\n name,\n control,\n register,\n extra: { options, className },\n disabled,\n Field,\n ...props\n}) => {\n const currentValue: string | undefined = useWatch({ control, name });\n const { t } = useTranslation();\n return (\n <RadioContainer className={className} id={name}>\n {options.map(\n ({\n label,\n value: v,\n show,\n disabled: optionDisabled,\n selected,\n ...option\n }) => (\n <Base as=\"div\" key={`${name}.${v}`}>\n <RadioItem\n {...register(name)}\n id={`${name}.${v}`}\n value={v}\n disabled={disabled || optionDisabled}\n {...option}\n {...{\n ...props,\n reset: undefined,\n required: undefined,\n error: undefined,\n 'aria-describedby': undefined,\n type: 'radio',\n }}\n >\n {label && label.primary && (\n <Base as=\"span\">{t(label.primary) || v}</Base>\n )}\n {label && label.secondary && <Hint>{t(label.secondary)}</Hint>}\n </RadioItem>\n {selected && selected()}\n {currentValue === v && show && Field && (\n <RadioConditional>\n {show.map((fieldName) => (\n <Field name={fieldName} key={fieldName} />\n ))}\n </RadioConditional>\n )}\n </Base>\n )\n )}\n </RadioContainer>\n );\n};\nexport const ControlledRadioButtonsGroup: React.FC<\n RadioButtonsGroupProps & { onChange: (e: any) => void; value: any }\n> = ({\n name,\n extra: { options, className },\n disabled,\n onChange,\n value,\n Field,\n ...props\n}) => {\n const currentValue: string | undefined = value;\n const { t } = useTranslation();\n return (\n <RadioContainer className={className} id={name}>\n {options.map(\n ({\n label,\n value: v,\n show,\n disabled: optionDisabled,\n selected,\n ...option\n }) => (\n <React.Fragment key={`${name}.${v}`}>\n <RadioItem\n onChange={(e) => {\n console.log(e);\n onChange(e);\n }}\n id={`${name}.${v}`}\n value={v}\n checked={currentValue === v}\n disabled={disabled || optionDisabled}\n {...option}\n {...{\n ...props,\n reset: undefined,\n required: undefined,\n error: undefined,\n 'aria-describedby': undefined,\n type: 'radio',\n }}\n >\n {(label && label.primary && t(label.primary)) || v}\n {label && label.secondary && <Hint>{t(label.secondary)}</Hint>}\n </RadioItem>\n {selected && selected()}\n {currentValue === v && show && (\n <RadioConditional>\n {show.map((fieldName) => (\n <Field name={fieldName} key={fieldName} />\n ))}\n </RadioConditional>\n )}\n </React.Fragment>\n )\n )}\n </RadioContainer>\n );\n};\n\nexport default RadioButtonsGroup;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/inputs/Select/index.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import SelectContainer from "@digigov/
|
|
3
|
-
import SelectOption from "@digigov/react-core/SelectOption";
|
|
2
|
+
import { SelectContainer, SelectOption } from "@digigov/ui/form/SelectContainer";
|
|
4
3
|
const Select = React.forwardRef(
|
|
5
4
|
function WrappedSelect({ name, extra: { options, className }, disabled, ...props }, ref) {
|
|
6
5
|
return /* @__PURE__ */ React.createElement(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/inputs/Select/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport
|
|
5
|
-
"mappings": "AAAA,OAAO,WAAW;AAGlB,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport { SelectContainer, SelectOption } from '@digigov/ui/form/SelectContainer';\n\nexport interface SelectProps extends Omit<UncontrolledFieldProps, 'extra'> {\n extra: {\n className?: string;\n options: Array<FieldOptionProps>;\n };\n}\n\nexport const Select: React.ExoticComponent<SelectProps> = React.forwardRef(\n function WrappedSelect(\n { name, extra: { options, className }, disabled, ...props },\n ref: never\n ) {\n return (\n <SelectContainer\n className={className}\n ref={ref}\n name={name}\n disabled={disabled}\n {...{ ...props, reset: undefined, required: undefined }}\n >\n {options.map(({ value, label }) => (\n <SelectOption key={value} value={value}>\n {label && label.primary ? label.primary : value}\n </SelectOption>\n ))}\n </SelectContainer>\n );\n }\n);\n\nexport default Select;\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,WAAW;AAGlB,SAAS,iBAAiB,oBAAoB;AASvC,MAAM,SAA6C,MAAM;AAAA,EAC9D,SAAS,cACP,EAAE,MAAM,OAAO,EAAE,SAAS,UAAU,GAAG,UAAU,GAAG,MAAM,GAC1D,KACA;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACC,GAAG,EAAE,GAAG,OAAO,OAAO,QAAW,UAAU,OAAU;AAAA;AAAA,MAErD,QAAQ,IAAI,CAAC,EAAE,OAAO,MAAM,MAC3B,oCAAC,gBAAa,KAAK,OAAO,SACvB,SAAS,MAAM,UAAU,MAAM,UAAU,KAC5C,CACD;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAO,iBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/lazy/index.js
CHANGED
|
@@ -50,6 +50,9 @@ var lazy_default = {
|
|
|
50
50
|
"Questions": lazy(() => import("@digigov/form/Questions/Questions").then((module) => ({ default: module["Questions"] }))),
|
|
51
51
|
"QuestionsContext": lazy(() => import("@digigov/form/Questions/QuestionsContext").then((module) => ({ default: module["QuestionsContext"] }))),
|
|
52
52
|
"AFM_VALIDATOR": lazy(() => import("@digigov/form/validators/utils/afm").then((module) => ({ default: module["AFM_VALIDATOR"] }))),
|
|
53
|
+
"DATE_VALIDATOR": lazy(() => import("@digigov/form/validators/utils/date").then((module) => ({ default: module["DATE_VALIDATOR"] }))),
|
|
54
|
+
"EARLIER_THAN_VALIDATOR": lazy(() => import("@digigov/form/validators/utils/date").then((module) => ({ default: module["EARLIER_THAN_VALIDATOR"] }))),
|
|
55
|
+
"LATER_THAN_VALIDATOR": lazy(() => import("@digigov/form/validators/utils/date").then((module) => ({ default: module["LATER_THAN_VALIDATOR"] }))),
|
|
53
56
|
"FILE_MAX_SIZE_VALIDATOR": lazy(() => import("@digigov/form/validators/utils/file").then((module) => ({ default: module["FILE_MAX_SIZE_VALIDATOR"] }))),
|
|
54
57
|
"IBAN_VALIDATOR": lazy(() => import("@digigov/form/validators/utils/iban").then((module) => ({ default: module["IBAN_VALIDATOR"] }))),
|
|
55
58
|
"IMAGE_DIMENSION_VALIDATOR": lazy(() => import("@digigov/form/validators/utils/image").then((module) => ({ default: module["IMAGE_DIMENSION_VALIDATOR"] }))),
|
package/lazy.d.ts
CHANGED
|
@@ -62,6 +62,9 @@ declare namespace _default {
|
|
|
62
62
|
let Questions: import("react").LazyExoticComponent<import("react").FC<import("./Questions/types").QuestionsInterface>>;
|
|
63
63
|
let QuestionsContext: import("react").LazyExoticComponent<import("react").ComponentType<any>>;
|
|
64
64
|
let AFM_VALIDATOR: import("react").LazyExoticComponent<import("react").ComponentType<any>>;
|
|
65
|
+
let DATE_VALIDATOR: import("react").LazyExoticComponent<import("react").ComponentType<any>>;
|
|
66
|
+
let EARLIER_THAN_VALIDATOR: import("react").LazyExoticComponent<import("react").ComponentType<any>>;
|
|
67
|
+
let LATER_THAN_VALIDATOR: import("react").LazyExoticComponent<import("react").ComponentType<any>>;
|
|
65
68
|
let FILE_MAX_SIZE_VALIDATOR: import("react").LazyExoticComponent<import("react").ComponentType<any>>;
|
|
66
69
|
let IBAN_VALIDATOR: import("react").LazyExoticComponent<import("react").ComponentType<any>>;
|
|
67
70
|
let IMAGE_DIMENSION_VALIDATOR: import("react").LazyExoticComponent<import("react").ComponentType<any>>;
|