@digigov/form 2.0.0-555d1027 → 2.0.0-5701c39b

package/inputs/OtpInput/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/inputs/OtpInput/index.tsx"],
-  "sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport SingleCharacterInputs, {\n  SingleCharacterInput,\n} from '@digigov/ui/form/SingleCharacterInputs';\n\nexport const RE_DIGIT = new RegExp(/^\\d+$/);\nexport const REMOVE_SPACES = new RegExp(/\\s+/g);\n\nexport function useOtp(onChange, maxLength) {\n  const [otpValues, setOtpValues] = useState(Array<string>(maxLength).fill(''));\n  const handleChange = useCallback(\n    (otp: string[]) => {\n      setOtpValues(otp);\n      const otpValue = otp.join('');\n      onChange(otpValue);\n    },\n    [onChange]\n  );\n\n  const setOtp = (item: string, idx) => {\n    const updatedOTPValues = [...otpValues];\n    if (item.length === 1 || item.length === 0) {\n      updatedOTPValues[idx] = item[0] || '';\n      handleChange(updatedOTPValues);\n    } else if (item.length === maxLength) {\n      const valueArray = item.split('').slice(0, maxLength);\n      handleChange(valueArray);\n    }\n  };\n\n  const setSelectionRange = useCallback((target) => {\n    return target.setSelectionRange(0, target.value.length);\n  }, []);\n\n  const focusToNextInput = useCallback((target: HTMLElement) => {\n    const nextElement = target.nextElementSibling as HTMLInputElement | null;\n    if (nextElement) {\n      nextElement.focus();\n    }\n  }, []);\n\n  const focusToPrevInput = useCallback((target: HTMLElement) => {\n    const previousElement =\n      target.previousElementSibling as HTMLInputElement | null;\n    if (previousElement) {\n      previousElement.focus();\n    }\n  }, []);\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>, idx: number) => {\n      const { key } = e;\n      const target = e.target as HTMLInputElement;\n      let targetValue = target.value;\n      setSelectionRange(target);\n      if (key === 'ArrowRight' || key === 'ArrowDown') {\n        e.preventDefault();\n        return focusToNextInput(target);\n      }\n      if (key === 'ArrowLeft' || key === 'ArrowUp') {\n        e.preventDefault();\n        return focusToPrevInput(target);\n      }\n      if (e.key === 'Backspace' || e.key === 'Delete') {\n        if (targetValue !== '') {\n          targetValue = '';\n        } else {\n          focusToPrevInput(target);\n        }\n        setOtp(targetValue, idx);\n        return e.preventDefault();\n      }\n    },\n    [setOtp, focusToPrevInput, focusToNextInput]\n  );\n\n  const handleFocus = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      const { target } = e;\n      setSelectionRange(target);\n    },\n    [setSelectionRange]\n  );\n  const handleOtpChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>, idx: number) => {\n      const target = e.target;\n      const targetValue = target.value;\n      const isTargetValueDigit = RE_DIGIT.test(targetValue);\n      // We want to pass the empty string when the value is deleted\n      // emptry string replaces the deleted value\n      if (isTargetValueDigit || targetValue === '') {\n        setOtp(targetValue, idx);\n        if (target.value.length > 1) {\n          target.blur();\n        }\n        focusToNextInput(target);\n      }\n    },\n    [setOtp, handleKeyDown, handleFocus]\n  );\n\n  const handlePaste = useCallback(\n    (e: React.ClipboardEvent<HTMLInputElement>) => {\n      e.preventDefault();\n      const pastedData = e.clipboardData\n        .getData('text/plain')\n        .replace(REMOVE_SPACES, '');\n      if (pastedData) {\n        setOtp(pastedData, 0);\n      }\n    },\n    []\n  );\n  return {\n    otpValues,\n    handleOtpChange,\n    handleKeyDown,\n    handleFocus,\n    handlePaste,\n  };\n}\n\nconst SingleCharacterInputPart = ({ ...props }) => {\n  return <SingleCharacterInput {...props} />;\n};\n\nexport const OtpInput = ({ name, maxLength = 6, ...props }) => {\n  const otp = useOtp(props.onChange, maxLength);\n  return (\n    <SingleCharacterInputs>\n      {otp.otpValues.map((digit, idx) => (\n        <SingleCharacterInputPart\n          name={`${name}-${idx}`}\n          id={`${name}-${idx}`}\n          type=\"text\"\n          key={idx}\n          autoComplete=\"one-time-code\"\n          pattern=\"\\d{1}\"\n          maxLength={maxLength}\n          value={digit}\n          disabled={props.disabled}\n          aria-required={props['aria-required']}\n          onChange={(e) => otp.handleOtpChange(e, idx)}\n          onInput={(e) => {\n            if (e.target.value === digit) {\n              otp.handleOtpChange(e, idx);\n            }\n          }}\n          onKeyDown={(e) => otp.handleKeyDown(e, idx)}\n          onFocus={otp.handleFocus}\n          onPaste={otp.handlePaste}\n          error={!digit ? props.error : false}\n        />\n      ))}\n    </SingleCharacterInputs>\n  );\n};\n\nexport default OtpInput;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport SingleCharacterInputs, {\n  SingleCharacterInput,\n} from '@digigov/ui/form/SingleCharacterInputs';\n\nexport const RE_DIGIT = new RegExp(/^\\d+$/);\nexport const REMOVE_SPACES = new RegExp(/\\s+/g);\n\nexport function useOtp(onChange, maxLength) {\n  const [otpValues, setOtpValues] = useState(Array<string>(maxLength).fill(''));\n  const handleChange = useCallback(\n    (otp: string[]) => {\n      setOtpValues(otp);\n      const otpValue = otp.join('');\n      onChange(otpValue);\n    },\n    [onChange]\n  );\n\n  const setOtp = (item: string, idx) => {\n    const updatedOTPValues = [...otpValues];\n    if (item.length === 1 || item.length === 0) {\n      updatedOTPValues[idx] = item[0] || '';\n      handleChange(updatedOTPValues);\n    } else if (item.length === maxLength) {\n      const valueArray = item.split('').slice(0, maxLength);\n      handleChange(valueArray);\n    }\n  };\n\n  const setSelectionRange = useCallback((target) => {\n    return target.setSelectionRange(0, target.value.length);\n  }, []);\n\n  const focusToNextInput = useCallback((target: HTMLElement) => {\n    const nextElement = target.nextElementSibling as HTMLInputElement | null;\n    if (nextElement) {\n      nextElement.focus();\n    }\n  }, []);\n\n  const focusToPrevInput = useCallback((target: HTMLElement) => {\n    const previousElement =\n      target.previousElementSibling as HTMLInputElement | null;\n    if (previousElement) {\n      previousElement.focus();\n    }\n  }, []);\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>, idx: number) => {\n      const { key } = e;\n      const target = e.target as HTMLInputElement;\n      let targetValue = target.value;\n      setSelectionRange(target);\n      if (key === 'ArrowRight' || key === 'ArrowDown') {\n        e.preventDefault();\n        return focusToNextInput(target);\n      }\n      if (key === 'ArrowLeft' || key === 'ArrowUp') {\n        e.preventDefault();\n        return focusToPrevInput(target);\n      }\n      if (e.key === 'Backspace' || e.key === 'Delete') {\n        if (targetValue !== '') {\n          targetValue = '';\n        } else {\n          focusToPrevInput(target);\n        }\n        setOtp(targetValue, idx);\n        return e.preventDefault();\n      }\n    },\n    [setOtp, focusToPrevInput, focusToNextInput]\n  );\n\n  const handleFocus = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      const { target } = e;\n      setSelectionRange(target);\n    },\n    [setSelectionRange]\n  );\n  const handleOtpChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>, idx: number) => {\n      const target = e.target;\n      const targetValue = target.value;\n      const isTargetValueDigit = RE_DIGIT.test(targetValue);\n      // We want to pass the empty string when the value is deleted\n      // emptry string replaces the deleted value\n      if (isTargetValueDigit || targetValue === '') {\n        setOtp(targetValue, idx);\n        if (target.value.length > 1) {\n          target.blur();\n        }\n        focusToNextInput(target);\n      }\n    },\n    [setOtp, handleKeyDown, handleFocus]\n  );\n\n  const handlePaste = useCallback(\n    (e: React.ClipboardEvent<HTMLInputElement>) => {\n      e.preventDefault();\n      const pastedData = e.clipboardData\n        .getData('text/plain')\n        .replace(REMOVE_SPACES, '');\n      if (pastedData) {\n        setOtp(pastedData, 0);\n      }\n    },\n    []\n  );\n  return {\n    otpValues,\n    handleOtpChange,\n    handleKeyDown,\n    handleFocus,\n    handlePaste,\n  };\n}\n\nconst SingleCharacterInputPart = React.forwardRef<\n  HTMLInputElement,\n  Record<string, any>\n>(({ ...props }, ref) => {\n  return <SingleCharacterInput {...props} ref={ref} />;\n});\nSingleCharacterInputPart.displayName = 'SingleCharacterInputPart';\n\nexport const OtpInput = React.forwardRef<HTMLInputElement, Record<string, any>>(\n  ({ name, maxLength = 6, ...props }, ref) => {\n    const otp = useOtp(props.onChange, maxLength);\n    return (\n      <SingleCharacterInputs>\n        {otp.otpValues.map((digit, idx) => (\n          <SingleCharacterInputPart\n            ref={idx === 0 ? ref : null}\n            name={`${name}-${idx}`}\n            id={`${name}-${idx}`}\n            type=\"text\"\n            key={idx}\n            autoComplete=\"one-time-code\"\n            pattern=\"\\d{1}\"\n            maxLength={maxLength}\n            value={digit}\n            disabled={props.disabled}\n            aria-required={props['aria-required']}\n            onChange={(e) => otp.handleOtpChange(e, idx)}\n            onInput={(e) => {\n              if (e.target.value === digit) {\n                otp.handleOtpChange(e, idx);\n              }\n            }}\n            onKeyDown={(e) => otp.handleKeyDown(e, idx)}\n            onFocus={otp.handleFocus}\n            onPaste={otp.handlePaste}\n            error={!digit ? props.error : false}\n          />\n        ))}\n      </SingleCharacterInputs>\n    );\n  }\n);\n\nOtpInput.displayName = 'OtpInput';\n\nexport default OtpInput;\n"],
+  "mappings": "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",
   "names": []
 }

package/inputs/Radio/index.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
-import { UncontrolledFieldProps } from '@digigov/form/Field/types';
-import { FieldOptionProps } from '@digigov/form/inputs/Label';
+import type { UseFormReturn } from 'react-hook-form';
+import type { UncontrolledFieldProps } from '@digigov/form/Field/types';
+import type { FieldOptionProps } from '@digigov/form/inputs/Label';
 export interface RadioButtonsGroupProps extends Omit<UncontrolledFieldProps, 'extra'> {
     extra: {
         className?: string;
@@ -8,10 +9,11 @@ export interface RadioButtonsGroupProps extends Omit<UncontrolledFieldProps, 'ex
         dense?: boolean;
     };
     fieldComponent?: React.FC<Omit<UncontrolledFieldProps, 'register'>>;
+    resetField: UseFormReturn['resetField'];
 }
 export declare const RadioButtonsGroup: React.FC<RadioButtonsGroupProps>;
-export declare const ControlledRadioButtonsGroup: React.FC<RadioButtonsGroupProps & {
+export declare const ControlledRadioButtonsGroup: React.ForwardRefExoticComponent<RadioButtonsGroupProps & {
     onChange: (e: any) => void;
     value: any;
-}>;
+} & React.RefAttributes<HTMLInputElement>>;
 export default RadioButtonsGroup;

package/inputs/Radio/index.js

@@ -1,5 +1,6 @@
 import React from "react";
 import { useWatch } from "react-hook-form";
+import { omit } from "@digigov/form/utils";
 import {
   RadioContainer,
   RadioItem,
@@ -36,7 +37,7 @@ const RadioButtonsGroup = ({
         disabled: disabled || optionDisabled,
         ...option,
         ...{
-          ...props,
+          ...omit(props, ["resetField"]),
           reset: void 0,
           required: void 0,
           error: void 0,
@@ -49,7 +50,7 @@ const RadioButtonsGroup = ({
     ), selected && selected(), currentValue === v && show && Field && /* @__PURE__ */ React.createElement(RadioConditional, null, show.map((fieldName) => /* @__PURE__ */ React.createElement(Field, { name: fieldName, key: fieldName }))))
   ));
 };
-const ControlledRadioButtonsGroup = ({
+const ControlledRadioButtonsGroup = React.forwardRef(function ControlledRadioButtonsGroup2({
   name,
   extra: { options, className },
   disabled,
@@ -57,7 +58,7 @@ const ControlledRadioButtonsGroup = ({
   value,
   Field,
   ...props
-}) => {
+}, ref) {
   const currentValue = value;
   const { t } = useTranslation();
   return /* @__PURE__ */ React.createElement(RadioContainer, { className, id: name }, options.map(
@@ -68,9 +69,10 @@ const ControlledRadioButtonsGroup = ({
       disabled: optionDisabled,
       selected,
       ...option
-    }) => /* @__PURE__ */ React.createElement(React.Fragment, { key: `${name}.${v}` }, /* @__PURE__ */ React.createElement(
+    }, index) => /* @__PURE__ */ React.createElement(React.Fragment, { key: `${name}.${v}` }, /* @__PURE__ */ React.createElement(
       RadioItem,
       {
+        ref: index === 0 ? ref : void 0,
         onChange: (e) => {
           console.log(e);
           onChange(e);
@@ -94,7 +96,7 @@ const ControlledRadioButtonsGroup = ({
       label && label.secondary && /* @__PURE__ */ React.createElement(Hint, null, t(label.secondary))
     ), selected && selected(), currentValue === v && show && /* @__PURE__ */ React.createElement(RadioConditional, null, show.map((fieldName) => /* @__PURE__ */ React.createElement(Field, { name: fieldName, key: fieldName }))))
   ));
-};
+});
 var Radio_default = RadioButtonsGroup;
 export {
   ControlledRadioButtonsGroup,

package/inputs/Radio/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/inputs/Radio/index.tsx"],
-  "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: 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                Field: 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"],
-  "mappings": "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",
-  "names": []
+  "sourcesContent": ["import React from 'react';\nimport type { UseFormReturn } from 'react-hook-form';\nimport { useWatch } from 'react-hook-form';\nimport type { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport type { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport { omit } from '@digigov/form/utils';\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: FieldOptionProps[];\n    dense?: boolean;\n  };\n  fieldComponent?: React.FC<Omit<UncontrolledFieldProps, 'register'>>;\n  resetField: UseFormReturn['resetField'];\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                ...omit(props, ['resetField']),\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.forwardRef<\n  HTMLInputElement,\n  RadioButtonsGroupProps & { onChange: (e: any) => void; value: any }\n>(function ControlledRadioButtonsGroup(\n  {\n    name,\n    extra: { options, className },\n    disabled,\n    onChange,\n    value,\n    Field,\n    ...props\n  },\n  ref\n) {\n  const currentValue: string | undefined = value;\n  const { t } = useTranslation();\n  return (\n    <RadioContainer className={className} id={name}>\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={`${name}.${v}`}>\n            <RadioItem\n              ref={index === 0 ? ref : undefined}\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                Field: 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"],
+  "mappings": "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",
+  "names": ["ControlledRadioButtonsGroup"]
 }

package/inputs/Select/index.d.ts

@@ -1,12 +1,14 @@
 import React from 'react';
-import { UncontrolledFieldProps } from '@digigov/form/Field/types';
-import { FieldOptionProps } from '@digigov/form/inputs/Label';
+import type { UseFormReturn } from 'react-hook-form';
+import type { UncontrolledFieldProps } from '@digigov/form/Field/types';
+import type { FieldOptionProps } from '@digigov/form/inputs/Label';
 export interface SelectProps extends Omit<UncontrolledFieldProps, 'extra' | 'Field'> {
     extra: {
         className?: string;
         options: FieldOptionProps[];
     };
     Field?: UncontrolledFieldProps['Field'];
+    resetField: UseFormReturn['resetField'];
 }
 export declare const Select: React.ExoticComponent<SelectProps>;
 export default Select;

package/inputs/Select/index.js

@@ -1,11 +1,11 @@
 import React from "react";
+import { omit } from "@digigov/form/utils";
 import {
   SelectContainer,
   SelectOption
 } from "@digigov/ui/form/SelectContainer";
 const Select = React.forwardRef(
   function WrappedSelect({ name, extra: { options, className }, disabled, ...props }, ref) {
-    delete props.Field;
     return /* @__PURE__ */ React.createElement(
       SelectContainer,
       {
@@ -15,7 +15,7 @@ const Select = React.forwardRef(
         id: name,
         disabled,
         ...{
-          ...props,
+          ...omit(props, ["Field", "resetField"]),
           reset: void 0,
           error: void 0,
           required: void 0

package/inputs/Select/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/inputs/Select/index.tsx"],
-  "sourcesContent": ["import React from 'react';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport {\n  SelectContainer,\n  SelectOption,\n} from '@digigov/ui/form/SelectContainer';\n\nexport interface SelectProps\n  extends Omit<UncontrolledFieldProps, 'extra' | 'Field'> {\n  extra: {\n    className?: string;\n    options: FieldOptionProps[];\n  };\n  Field?: UncontrolledFieldProps['Field'];\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    delete props.Field;\n    return (\n      <SelectContainer\n        className={className}\n        ref={ref}\n        name={name}\n        id={name}\n        disabled={disabled}\n        {...{\n          ...props,\n          reset: undefined,\n          error: undefined,\n          required: undefined,\n        }}\n      >\n        {options.map(({ value, label }, index) => (\n          <SelectOption key={index} value={value}>\n            {label && label.primary ? label.primary : value}\n          </SelectOption>\n        ))}\n      </SelectContainer>\n    );\n  }\n);\n\nexport default Select;\n"],
-  "mappings": "AAAA,OAAO,WAAW;AAGlB;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAWA,MAAM,SAA6C,MAAM;AAAA,EAC9D,SAAS,cACP,EAAE,MAAM,OAAO,EAAE,SAAS,UAAU,GAAG,UAAU,GAAG,MAAM,GAC1D,KACA;AACA,WAAO,MAAM;AACb,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,IAAI;AAAA,QACJ;AAAA,QACC,GAAG;AAAA,UACF,GAAG;AAAA,UACH,OAAO;AAAA,UACP,OAAO;AAAA,UACP,UAAU;AAAA,QACZ;AAAA;AAAA,MAEC,QAAQ,IAAI,CAAC,EAAE,OAAO,MAAM,GAAG,UAC9B,oCAAC,gBAAa,KAAK,OAAO,SACvB,SAAS,MAAM,UAAU,MAAM,UAAU,KAC5C,CACD;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAO,iBAAQ;",
+  "sourcesContent": ["import React from 'react';\nimport type { UseFormReturn } from 'react-hook-form';\nimport type { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport type { FieldOptionProps } from '@digigov/form/inputs/Label';\nimport { omit } from '@digigov/form/utils';\nimport {\n  SelectContainer,\n  SelectOption,\n} from '@digigov/ui/form/SelectContainer';\n\nexport interface SelectProps\n  extends Omit<UncontrolledFieldProps, 'extra' | 'Field'> {\n  extra: {\n    className?: string;\n    options: FieldOptionProps[];\n  };\n  Field?: UncontrolledFieldProps['Field'];\n  resetField: UseFormReturn['resetField'];\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        id={name}\n        disabled={disabled}\n        {...{\n          ...omit(props, ['Field', 'resetField']),\n          reset: undefined,\n          error: undefined,\n          required: undefined,\n        }}\n      >\n        {options.map(({ value, label }, index) => (\n          <SelectOption key={index} value={value}>\n            {label && label.primary ? label.primary : value}\n          </SelectOption>\n        ))}\n      </SelectContainer>\n    );\n  }\n);\n\nexport default Select;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAIlB,SAAS,YAAY;AACrB;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAYA,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,IAAI;AAAA,QACJ;AAAA,QACC,GAAG;AAAA,UACF,GAAG,KAAK,OAAO,CAAC,SAAS,YAAY,CAAC;AAAA,UACtC,OAAO;AAAA,UACP,OAAO;AAAA,UACP,UAAU;AAAA,QACZ;AAAA;AAAA,MAEC,QAAQ,IAAI,CAAC,EAAE,OAAO,MAAM,GAAG,UAC9B,oCAAC,gBAAa,KAAK,OAAO,SACvB,SAAS,MAAM,UAAU,MAAM,UAAU,KAC5C,CACD;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAO,iBAAQ;",
   "names": []
 }

package/{Field/utils → inputs/registry}/index.js

@@ -83,4 +83,4 @@ export {
   CONTROLLED_FIELD_COMPONENTS,
   FIELD_COMPONENTS
 };
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=registry.js.map

package/{locales/el → inputs/registry}/package.json

@@ -2,5 +2,5 @@
   "sideEffects": false,
   "module": "./index.js",
   "types": "./index.d.ts",
-  "main": "../../cjs/locales/el/index.js"
+  "main": "../../cjs/inputs/registry/index.js"
 }

package/{Field/utils/index.d.ts → inputs/registry.d.ts}

@@ -1,4 +1,5 @@
-import { FieldComponentRegistry } from '@digigov/form/Field/types';
+import { type FieldComponentItem } from '@digigov/form/Field/types';
+export type FieldComponentRegistry = Record<string, FieldComponentItem>;
 export declare const FIELD_COMPONENTS: FieldComponentRegistry;
 export declare const ALTERNATIVE_COMPONENTS: FieldComponentRegistry;
 export declare const CONTROLLED_FIELD_COMPONENTS: FieldComponentRegistry;

package/inputs/registry.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/inputs/registry.ts"],
+  "sourcesContent": ["import { type FieldComponentItem } from '@digigov/form/Field/types';\nimport AutoCompleteInput from '@digigov/form/inputs/AutoCompleteInput';\nimport Checkboxes from '@digigov/form/inputs/Checkboxes';\nimport DateInput from '@digigov/form/inputs/DateInput';\nimport DateTimeInput from '@digigov/form/inputs/DateTimeInput';\nimport FileInput from '@digigov/form/inputs/FileInput';\nimport ImageInput from '@digigov/form/inputs/ImageInput';\nimport Input from '@digigov/form/inputs/Input';\nimport OtpInput from '@digigov/form/inputs/OtpInput';\nimport Radio, { ControlledRadioButtonsGroup } from '@digigov/form/inputs/Radio';\nimport Select from '@digigov/form/inputs/Select';\n\nexport type FieldComponentRegistry = Record<string, FieldComponentItem>;\n\nexport const FIELD_COMPONENTS: FieldComponentRegistry = {\n  text: {\n    component: Input,\n  },\n  string: {\n    component: Input,\n  },\n  file: {\n    wrapper: 'fieldset',\n    component: FileInput,\n    // controlled: true,\n  },\n  image: {\n    wrapper: 'fieldset',\n    component: ImageInput,\n    controlled: true,\n  },\n  date: {\n    wrapper: 'fieldset',\n    controlled: true,\n    component: DateInput,\n  },\n  datetime: {\n    wrapper: 'fieldset',\n    controlled: true,\n    component: DateTimeInput,\n  },\n  otp: {\n    wrapper: 'fieldset',\n    controlled: true,\n    component: OtpInput,\n  },\n  'choice:multiple': {\n    wrapper: 'fieldset',\n    controlled: true,\n    component: Checkboxes,\n  },\n  'choice:single': {\n    wrapper: 'fieldset',\n    controlled: false,\n    component: Radio,\n  },\n};\n\nexport const ALTERNATIVE_COMPONENTS: FieldComponentRegistry = {\n  Select: {\n    component: Select,\n    controlled: false,\n  },\n  AutoComplete: {\n    component: AutoCompleteInput,\n    controlled: true,\n    wrapper: 'fieldset',\n  },\n};\n\nexport const CONTROLLED_FIELD_COMPONENTS: FieldComponentRegistry = {\n  ...FIELD_COMPONENTS,\n  'choice:single': {\n    wrapper: 'fieldset',\n    controlled: true,\n    component: ControlledRadioButtonsGroup,\n  },\n  text: {\n    component: Input,\n    controlled: true,\n  },\n  string: {\n    component: Input,\n    controlled: true,\n  },\n};\n"],
+  "mappings": "AACA,OAAO,uBAAuB;AAC9B,OAAO,gBAAgB;AACvB,OAAO,eAAe;AACtB,OAAO,mBAAmB;AAC1B,OAAO,eAAe;AACtB,OAAO,gBAAgB;AACvB,OAAO,WAAW;AAClB,OAAO,cAAc;AACrB,OAAO,SAAS,mCAAmC;AACnD,OAAO,YAAY;AAIZ,MAAM,mBAA2C;AAAA,EACtD,MAAM;AAAA,IACJ,WAAW;AAAA,EACb;AAAA,EACA,QAAQ;AAAA,IACN,WAAW;AAAA,EACb;AAAA,EACA,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,WAAW;AAAA;AAAA,EAEb;AAAA,EACA,OAAO;AAAA,IACL,SAAS;AAAA,IACT,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AAAA,EACA,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,EACb;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,EACb;AAAA,EACA,KAAK;AAAA,IACH,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,EACb;AAAA,EACA,mBAAmB;AAAA,IACjB,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,EACb;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,EACb;AACF;AAEO,MAAM,yBAAiD;AAAA,EAC5D,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AAAA,EACA,cAAc;AAAA,IACZ,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,SAAS;AAAA,EACX;AACF;AAEO,MAAM,8BAAsD;AAAA,EACjE,GAAG;AAAA,EACH,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,WAAW;AAAA,EACb;AAAA,EACA,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AAAA,EACA,QAAQ;AAAA,IACN,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AACF;",
+  "names": []
+}

package/lazy/index.js

@@ -9,10 +9,7 @@ export default {
   'FieldBase': lazy(() => import('@digigov/form/Field/FieldBase').then((module) => ({ default: module['FieldBase'] }))),
   'FieldBaseContainer': lazy(() => import('@digigov/form/Field/FieldBaseContainer').then((module) => ({ default: module['FieldBaseContainer'] }))),
   'FieldConditional': lazy(() => import('@digigov/form/Field/FieldConditional').then((module) => ({ default: module['FieldConditional'] }))),
-  'FormDialog': lazy(() => import('@digigov/form/FieldArray/FormDialog').then((module) => ({ default: module['FormDialog'] }))),
-  'ArrayItemModal': lazy(() => import('@digigov/form/FieldArray/FormDialog').then((module) => ({ default: module['ArrayItemModal'] }))),
-  'ArrayItemHeader': lazy(() => import('@digigov/form/FieldArray/FormDialog').then((module) => ({ default: module['ArrayItemHeader'] }))),
-  'ArrayItemDisplay': lazy(() => import('@digigov/form/FieldArray/FormDialog').then((module) => ({ default: module['ArrayItemDisplay'] }))),
+  'BaseFieldArray': lazy(() => import('@digigov/form/FieldArray/BaseFieldArray').then((module) => ({ default: module['BaseFieldArray'] }))),
   'FieldArray': lazy(() => import('@digigov/form/FieldArray').then((module) => ({ default: module['FieldArray'] }))),
   'FieldObject': lazy(() => import('@digigov/form/FieldObject').then((module) => ({ default: module['FieldObject'] }))),
   'FieldsetWithContext': lazy(() => import('@digigov/form/Fieldset/FieldsetWithContext').then((module) => ({ default: module['FieldsetWithContext'] }))),
@@ -45,10 +42,11 @@ export default {
   'Input': lazy(() => import('@digigov/form/inputs/Input').then((module) => ({ default: module['Input'] }))),
   'Radio': lazy(() => import('@digigov/form/inputs').then((module) => ({ default: module['Radio'] }))),
   'Select': lazy(() => import('@digigov/form/inputs/Select').then((module) => ({ default: module['Select'] }))),
-  'INPUTS_FIELDS': lazy(() => import('@digigov/form/inputs/inputsScenarios').then((module) => ({ default: module['INPUTS_FIELDS'] }))),
-  'FIELD_COMPONENTS': lazy(() => import('@digigov/form/Field/utils').then((module) => ({ default: module['FIELD_COMPONENTS'] }))),
-  'ALTERNATIVE_COMPONENTS': lazy(() => import('@digigov/form/Field/utils').then((module) => ({ default: module['ALTERNATIVE_COMPONENTS'] }))),
-  'CONTROLLED_FIELD_COMPONENTS': lazy(() => import('@digigov/form/Field/utils').then((module) => ({ default: module['CONTROLLED_FIELD_COMPONENTS'] }))),
+  'FIELD_COMPONENTS': lazy(() => import('@digigov/form/inputs/registry').then((module) => ({ default: module['FIELD_COMPONENTS'] }))),
+  'ALTERNATIVE_COMPONENTS': lazy(() => import('@digigov/form/inputs/registry').then((module) => ({ default: module['ALTERNATIVE_COMPONENTS'] }))),
+  'CONTROLLED_FIELD_COMPONENTS': lazy(() => import('@digigov/form/inputs/registry').then((module) => ({ default: module['CONTROLLED_FIELD_COMPONENTS'] }))),
+  'ArrayEditModal': lazy(() => import('@digigov/form/FieldArray/FormDialog/ArrayEditModal').then((module) => ({ default: module['ArrayEditModal'] }))),
+  'FormDialog': lazy(() => import('@digigov/form/FieldArray/FormDialog').then((module) => ({ default: module['FormDialog'] }))),
   'AutoCompleteInput': lazy(() => import('@digigov/form/inputs/AutoCompleteInput').then((module) => ({ default: module['AutoCompleteInput'] }))),
   'DateTimeInput': lazy(() => import('@digigov/form/inputs/DateTimeInput').then((module) => ({ default: module['DateTimeInput'] }))),
   'Image': lazy(() => import('@digigov/form/inputs/ImageInput').then((module) => ({ default: module['Image'] }))),
@@ -64,6 +62,7 @@ export default {
   'LATER_THAN_DATETIME_VALIDATOR': lazy(() => import('@digigov/form/validators/utils').then((module) => ({ default: module['LATER_THAN_DATETIME_VALIDATOR'] }))),
   'EARLIER_THAN_DATETIME_VALIDATOR': lazy(() => import('@digigov/form/validators/utils').then((module) => ({ default: module['EARLIER_THAN_DATETIME_VALIDATOR'] }))),
   'DATETIME_VALIDATOR': lazy(() => import('@digigov/form/validators/utils').then((module) => ({ default: module['DATETIME_VALIDATOR'] }))),
+  'EMAIL_VALIDATOR': lazy(() => import('@digigov/form/validators/utils/email').then((module) => ({ default: module['EMAIL_VALIDATOR'] }))),
   'FILE_MAX_SIZE_VALIDATOR': lazy(() => import('@digigov/form/validators/utils').then((module) => ({ default: module['FILE_MAX_SIZE_VALIDATOR'] }))),
   'IBAN_VALIDATOR': lazy(() => import('@digigov/form/validators/utils').then((module) => ({ default: module['IBAN_VALIDATOR'] }))),
   'IMAGE_DIMENSION_VALIDATOR': lazy(() => import('@digigov/form/validators/utils').then((module) => ({ default: module['IMAGE_DIMENSION_VALIDATOR'] }))),
@@ -74,5 +73,9 @@ export default {
   'UUID4_VALIDATOR': lazy(() => import('@digigov/form/validators/utils/uuid4').then((module) => ({ default: module['UUID4_VALIDATOR'] }))),
   'TEXT_LIMIT_VALIDATOR': lazy(() => import('@digigov/form/validators/utils/text_limit').then((module) => ({ default: module['TEXT_LIMIT_VALIDATOR'] }))),
   'INT_VALIDATOR': lazy(() => import('@digigov/form/validators/utils/int').then((module) => ({ default: module['INT_VALIDATOR'] }))),
-  'NUMBER_VALIDATOR': lazy(() => import('@digigov/form/validators/utils/number').then((module) => ({ default: module['NUMBER_VALIDATOR'] })))
+  'NUMBER_VALIDATOR': lazy(() => import('@digigov/form/validators/utils/number').then((module) => ({ default: module['NUMBER_VALIDATOR'] }))),
+  'ArrayContainerDisplay': lazy(() => import('@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayContainerDisplay').then((module) => ({ default: module['ArrayContainerDisplay'] }))),
+  'ArrayItemDisplay': lazy(() => import('@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay').then((module) => ({ default: module['ArrayItemDisplay'] }))),
+  'ArrayItemHeader': lazy(() => import('@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader').then((module) => ({ default: module['ArrayItemHeader'] }))),
+  'ArrayDisplay': lazy(() => import('@digigov/form/FieldArray/FormDialog/ArrayDisplay').then((module) => ({ default: module['ArrayDisplay'] })))
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digigov/form",
-  "version": "2.0.0-555d1027",
+  "version": "2.0.0-5701c39b",
   "description": "@digigov form builder",
   "author": "GRNET Developers <devs@lists.grnet.gr>",
   "license": "BSD-2-Clause",
@@ -14,11 +14,11 @@
     "yup": "0.32.11",
     "dayjs": "1.10.4",
     "@hookform/resolvers": "5.0.1",
-    "@digigov/react-icons": "2.0.0-555d1027"
+    "@digigov/react-icons": "2.0.0-5701c39b"
   },
   "peerDependencies": {
-    "@digigov/ui": "2.0.0-555d1027",
-    "@digigov/react-core": "2.0.0-555d1027",
+    "@digigov/ui": "2.0.0-5701c39b",
+    "@digigov/react-core": "2.0.0-5701c39b",
     "clsx": "1.1.1",
     "react": "^18.3.0 || ^19.1.0",
     "react-dom": "^18.3.0 || ^19.1.0"

package/registry/index.js

@@ -10,7 +10,7 @@ import * as _digigov_form_Field_FieldBaseContainer from "@digigov/form/Field/Fie
 import * as _digigov_form_Field_FieldConditional from "@digigov/form/Field/FieldConditional";
 import * as _digigov_form_Field from "@digigov/form/Field";
 import * as _digigov_form_Field_types from "@digigov/form/Field/types";
-import * as _digigov_form_FieldArray_FormDialog from "@digigov/form/FieldArray/FormDialog";
+import * as _digigov_form_FieldArray_BaseFieldArray from "@digigov/form/FieldArray/BaseFieldArray";
 import * as _digigov_form_FieldArray from "@digigov/form/FieldArray";
 import * as _digigov_form_FieldObject from "@digigov/form/FieldObject";
 import * as _digigov_form_Fieldset_FieldsetWithContext from "@digigov/form/Fieldset/FieldsetWithContext";
@@ -25,15 +25,17 @@ import * as _digigov_form_Questions_QuestionsContext from "@digigov/form/Questio
 import * as _digigov_form_Questions_getNextStep from "@digigov/form/Questions/getNextStep";
 import * as _digigov_form_Questions from "@digigov/form/Questions";
 import * as _digigov_form_Questions_types from "@digigov/form/Questions/types";
+import * as _digigov_form_hooks_useFieldFocusManager from "@digigov/form/hooks/useFieldFocusManager";
+import * as _digigov_form_hooks_utils from "@digigov/form/hooks/utils";
 import * as _digigov_form_inputs from "@digigov/form/inputs";
-import * as _digigov_form_inputs_inputsScenarios from "@digigov/form/inputs/inputsScenarios";
-import * as _digigov_form_locales_el from "@digigov/form/locales/el";
+import * as _digigov_form_inputs_registry from "@digigov/form/inputs/registry";
 import * as _digigov_form_validators from "@digigov/form/validators";
 import * as _digigov_form_validators_types from "@digigov/form/validators/types";
-import * as _digigov_form_Field_utils_calculateField from "@digigov/form/Field/utils/calculateField";
 import * as _digigov_form_Field_utils_evaluateFieldWithConditions from "@digigov/form/Field/utils/evaluateFieldWithConditions";
-import * as _digigov_form_Field_utils from "@digigov/form/Field/utils";
+import * as _digigov_form_Field_utils_resolveField from "@digigov/form/Field/utils/resolveField";
 import * as _digigov_form_Field_utils_useField from "@digigov/form/Field/utils/useField";
+import * as _digigov_form_FieldArray_FormDialog_ArrayEditModal from "@digigov/form/FieldArray/FormDialog/ArrayEditModal";
+import * as _digigov_form_FieldArray_FormDialog from "@digigov/form/FieldArray/FormDialog";
 import * as _digigov_form_Questions_Step_ReviewStep from "@digigov/form/Questions/Step/ReviewStep";
 import * as _digigov_form_Questions_Step_Step from "@digigov/form/Questions/Step/Step";
 import * as _digigov_form_Questions_Step_StepArrayReview from "@digigov/form/Questions/Step/StepArrayReview";
@@ -60,6 +62,7 @@ import * as _digigov_form_validators_utils_afm from "@digigov/form/validators/ut
 import * as _digigov_form_validators_utils_amka from "@digigov/form/validators/utils/amka";
 import * as _digigov_form_validators_utils_date from "@digigov/form/validators/utils/date";
 import * as _digigov_form_validators_utils_datetime from "@digigov/form/validators/utils/datetime";
+import * as _digigov_form_validators_utils_email from "@digigov/form/validators/utils/email";
 import * as _digigov_form_validators_utils_file from "@digigov/form/validators/utils/file";
 import * as _digigov_form_validators_utils_iban from "@digigov/form/validators/utils/iban";
 import * as _digigov_form_validators_utils_image from "@digigov/form/validators/utils/image";
@@ -71,6 +74,10 @@ import * as _digigov_form_validators_utils_phone from "@digigov/form/validators/
 import * as _digigov_form_validators_utils_postal_code from "@digigov/form/validators/utils/postal_code";
 import * as _digigov_form_validators_utils_text_limit from "@digigov/form/validators/utils/text_limit";
 import * as _digigov_form_validators_utils_uuid4 from "@digigov/form/validators/utils/uuid4";
+import * as _digigov_form_FieldArray_FormDialog_ArrayDisplay_ArrayContainerDisplay from "@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayContainerDisplay";
+import * as _digigov_form_FieldArray_FormDialog_ArrayDisplay_ArrayItemDisplay from "@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay";
+import * as _digigov_form_FieldArray_FormDialog_ArrayDisplay_ArrayItemHeader from "@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader";
+import * as _digigov_form_FieldArray_FormDialog_ArrayDisplay from "@digigov/form/FieldArray/FormDialog/ArrayDisplay";
 function lazyImport(pkgImport) {
   return new Proxy(
     {},
@@ -101,7 +108,7 @@ export default {
   '@digigov/form/Field/FieldConditional': lazyImport(_digigov_form_Field_FieldConditional),
   '@digigov/form/Field': lazyImport(_digigov_form_Field),
   '@digigov/form/Field/types': lazyImport(_digigov_form_Field_types),
-  '@digigov/form/FieldArray/FormDialog': lazyImport(_digigov_form_FieldArray_FormDialog),
+  '@digigov/form/FieldArray/BaseFieldArray': lazyImport(_digigov_form_FieldArray_BaseFieldArray),
   '@digigov/form/FieldArray': lazyImport(_digigov_form_FieldArray),
   '@digigov/form/FieldObject': lazyImport(_digigov_form_FieldObject),
   '@digigov/form/Fieldset/FieldsetWithContext': lazyImport(_digigov_form_Fieldset_FieldsetWithContext),
@@ -116,15 +123,17 @@ export default {
   '@digigov/form/Questions/getNextStep': lazyImport(_digigov_form_Questions_getNextStep),
   '@digigov/form/Questions': lazyImport(_digigov_form_Questions),
   '@digigov/form/Questions/types': lazyImport(_digigov_form_Questions_types),
+  '@digigov/form/hooks/useFieldFocusManager': lazyImport(_digigov_form_hooks_useFieldFocusManager),
+  '@digigov/form/hooks/utils': lazyImport(_digigov_form_hooks_utils),
   '@digigov/form/inputs': lazyImport(_digigov_form_inputs),
-  '@digigov/form/inputs/inputsScenarios': lazyImport(_digigov_form_inputs_inputsScenarios),
-  '@digigov/form/locales/el': lazyImport(_digigov_form_locales_el),
+  '@digigov/form/inputs/registry': lazyImport(_digigov_form_inputs_registry),
   '@digigov/form/validators': lazyImport(_digigov_form_validators),
   '@digigov/form/validators/types': lazyImport(_digigov_form_validators_types),
-  '@digigov/form/Field/utils/calculateField': lazyImport(_digigov_form_Field_utils_calculateField),
   '@digigov/form/Field/utils/evaluateFieldWithConditions': lazyImport(_digigov_form_Field_utils_evaluateFieldWithConditions),
-  '@digigov/form/Field/utils': lazyImport(_digigov_form_Field_utils),
+  '@digigov/form/Field/utils/resolveField': lazyImport(_digigov_form_Field_utils_resolveField),
   '@digigov/form/Field/utils/useField': lazyImport(_digigov_form_Field_utils_useField),
+  '@digigov/form/FieldArray/FormDialog/ArrayEditModal': lazyImport(_digigov_form_FieldArray_FormDialog_ArrayEditModal),
+  '@digigov/form/FieldArray/FormDialog': lazyImport(_digigov_form_FieldArray_FormDialog),
   '@digigov/form/Questions/Step/ReviewStep': lazyImport(_digigov_form_Questions_Step_ReviewStep),
   '@digigov/form/Questions/Step/Step': lazyImport(_digigov_form_Questions_Step_Step),
   '@digigov/form/Questions/Step/StepArrayReview': lazyImport(_digigov_form_Questions_Step_StepArrayReview),
@@ -151,6 +160,7 @@ export default {
   '@digigov/form/validators/utils/amka': lazyImport(_digigov_form_validators_utils_amka),
   '@digigov/form/validators/utils/date': lazyImport(_digigov_form_validators_utils_date),
   '@digigov/form/validators/utils/datetime': lazyImport(_digigov_form_validators_utils_datetime),
+  '@digigov/form/validators/utils/email': lazyImport(_digigov_form_validators_utils_email),
   '@digigov/form/validators/utils/file': lazyImport(_digigov_form_validators_utils_file),
   '@digigov/form/validators/utils/iban': lazyImport(_digigov_form_validators_utils_iban),
   '@digigov/form/validators/utils/image': lazyImport(_digigov_form_validators_utils_image),
@@ -161,5 +171,9 @@ export default {
   '@digigov/form/validators/utils/phone': lazyImport(_digigov_form_validators_utils_phone),
   '@digigov/form/validators/utils/postal_code': lazyImport(_digigov_form_validators_utils_postal_code),
   '@digigov/form/validators/utils/text_limit': lazyImport(_digigov_form_validators_utils_text_limit),
-  '@digigov/form/validators/utils/uuid4': lazyImport(_digigov_form_validators_utils_uuid4)
+  '@digigov/form/validators/utils/uuid4': lazyImport(_digigov_form_validators_utils_uuid4),
+  '@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayContainerDisplay': lazyImport(_digigov_form_FieldArray_FormDialog_ArrayDisplay_ArrayContainerDisplay),
+  '@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayItemDisplay': lazyImport(_digigov_form_FieldArray_FormDialog_ArrayDisplay_ArrayItemDisplay),
+  '@digigov/form/FieldArray/FormDialog/ArrayDisplay/ArrayItemHeader': lazyImport(_digigov_form_FieldArray_FormDialog_ArrayDisplay_ArrayItemHeader),
+  '@digigov/form/FieldArray/FormDialog/ArrayDisplay': lazyImport(_digigov_form_FieldArray_FormDialog_ArrayDisplay)
 };

package/src/Field/ErrorGroup.tsx

@@ -1,13 +1,13 @@
 import React, { createContext, useEffect, useState } from 'react';
-import { ErrorOption } from 'react-hook-form';
-import { FieldLabelProps } from '@digigov/form/Field/types';
+import type { ErrorOption } from 'react-hook-form';
+import type { FieldLabelProps } from '@digigov/form/Field/types';
 import { List, ListItem } from '@digigov/ui/content/List';
 import { ErrorSummary } from '@digigov/ui/feedback/ErrorSummary';
 import { useTranslation } from '@digigov/ui/i18n';
 import { Link } from '@digigov/ui/navigation/Link';
 import { Heading } from '@digigov/ui/typography/Heading';
 import { Base } from '@digigov/ui/utils/Base';
-import { Breakpoints } from '@digigov/ui/utils/hooks/useScreen';
+import type { Breakpoints } from '@digigov/ui/utils/hooks/useScreen';
 interface ErrorGroupContextType {
   setError: (
     name?: string,

package/src/Field/FieldBase.tsx

@@ -2,7 +2,7 @@ import React, { useContext, useEffect } from 'react';
 import { Controller } from 'react-hook-form';
 import { ErrorGroupContext } from '@digigov/form/Field/ErrorGroup';
 import FieldBaseContainer from '@digigov/form/Field/FieldBaseContainer';
-import { FieldBaseProps } from '@digigov/form/Field/types';
+import type { FieldBaseProps } from '@digigov/form/Field/types';
 
 export const FieldBase: React.FC<FieldBaseProps> = ({
   required,
@@ -19,6 +19,7 @@ export const FieldBase: React.FC<FieldBaseProps> = ({
   extra = {},
   layout,
   error,
+  trim,
   register,
   ...componentProps
 }) => {
@@ -54,7 +55,6 @@ export const FieldBase: React.FC<FieldBaseProps> = ({
               <Component
                 {...field}
                 control={control}
-                ref={undefined}
                 defaultValue={defaultValue ?? field.value}
                 extra={extra}
                 error={!!error}
@@ -63,6 +63,7 @@ export const FieldBase: React.FC<FieldBaseProps> = ({
                 aria-describedby={error && `${name}-error`}
                 required={required}
                 disabled={editable === false}
+                trim={trim}
                 {...componentProps}
               />
             );