@digigov/form 2.0.0-2177f152 → 2.0.0-2271444d

package/Field/ErrorGroup.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { ErrorOption } from 'react-hook-form';
+import type { FieldLabelProps } from './types.js';
+import type { Breakpoints } from '@digigov/ui/utils/hooks/useScreen';
+export interface ErrorGroupContextType {
+    setError: (name?: string, label?: FieldLabelProps, error?: ErrorOption) => void;
+}
+export declare const ErrorGroupContext: React.Context<ErrorGroupContextType | null>;
+export interface ErrorGroupProps {
+    children: React.ReactNode;
+    screenSize?: Breakpoints | undefined;
+    fieldOrder?: any[];
+}
+export declare const ErrorGroup: React.FC<ErrorGroupProps>;
+export default ErrorGroup;

package/Field/ErrorGroup.js

@@ -0,0 +1,53 @@
+import react, { createContext, useEffect, useState } from "react";
+import { List, ListItem } from "@digigov/ui/content/List/index.js";
+import { ErrorSummary } from "@digigov/ui/feedback/ErrorSummary/index.js";
+import { useTranslation } from "@digigov/ui/i18n/index.js";
+import { Link } from "@digigov/ui/navigation/Link/index.js";
+import { Heading } from "@digigov/ui/typography/Heading/index.js";
+import { Base } from "@digigov/ui/utils/Base/index.js";
+const ErrorGroupContext = /*#__PURE__*/ createContext(null);
+const ErrorGroup = ({ children, screenSize, fieldOrder })=>{
+    const [errors, setErrors] = useState({});
+    const { t } = useTranslation();
+    const setError = (name, label, error)=>{
+        if (errors[name] !== error && errors[name]?.message !== error?.message) if (error?.message) setErrors({
+            ...errors,
+            [name]: {
+                ...error,
+                label: label.primary
+            }
+        });
+        else {
+            const updatedErrors = {
+                ...errors
+            };
+            delete updatedErrors[name];
+            setErrors(updatedErrors);
+        }
+    };
+    useEffect(()=>{
+        setErrors({});
+    }, [
+        screenSize
+    ]);
+    return /*#__PURE__*/ react.createElement(ErrorGroupContext.Provider, {
+        value: {
+            setError
+        }
+    }, 0 !== Object.keys(errors).length && /*#__PURE__*/ react.createElement(ErrorSummary, {
+        variant: "error-group"
+    }, /*#__PURE__*/ react.createElement(Heading, {
+        size: "sm"
+    }, "Τα παρακάτω πεδία της φόρμας ειναι λάθος.", ' '), /*#__PURE__*/ react.createElement(List, {
+        listStyle: "bullet"
+    }, (fieldOrder || Object.keys(errors).reverse()).filter((fieldName)=>errors[fieldName]).map((fieldName, index)=>/*#__PURE__*/ react.createElement(ListItem, {
+            key: index,
+            id: `${fieldName}-error`
+        }, /*#__PURE__*/ react.createElement(Base, {
+            as: "b"
+        }, t(errors[fieldName]?.label), ":"), ' ', /*#__PURE__*/ react.createElement(Link, {
+            href: `#${fieldName}`
+        }, t(errors[fieldName]?.message)))))), children);
+};
+const Field_ErrorGroup = ErrorGroup;
+export { ErrorGroup, ErrorGroupContext, Field_ErrorGroup as default };

package/Field/FieldBase.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-import { FieldBaseProps } from '@digigov/form/Field/types';
+import type { FieldBaseProps } from './types.js';
 export declare const FieldBase: React.FC<FieldBaseProps>;

package/Field/FieldBase.js

@@ -0,0 +1,77 @@
+import react, { useContext, useEffect } from "react";
+import { Controller } from "react-hook-form";
+import { ErrorGroupContext } from "./ErrorGroup.js";
+import FieldBaseContainer from "./FieldBaseContainer.js";
+const FieldBase = ({ required, name, component: Component, wrapper, control, type, controlled = false, enabled = true, editable, defaultValue, label, extra = {}, layout, error, trim, register, ...componentProps })=>{
+    const errorGroupContext = useContext(ErrorGroupContext);
+    useEffect(()=>{
+        if (errorGroupContext) errorGroupContext.setError(name, label, error);
+    }, [
+        error,
+        name,
+        errorGroupContext?.setError
+    ]);
+    if (!enabled) return null;
+    if (controlled) return /*#__PURE__*/ react.createElement(FieldBaseContainer, {
+        label: label,
+        layout: layout,
+        register: register,
+        error: errorGroupContext ? void 0 : error,
+        hasError: !!error,
+        wrapper: wrapper,
+        name: name,
+        controlled: controlled
+    }, /*#__PURE__*/ react.createElement(Controller, {
+        control: control,
+        name: name,
+        render: ({ field })=>/*#__PURE__*/ react.createElement(Component, {
+                ...field,
+                control: control,
+                defaultValue: defaultValue ?? field.value,
+                extra: extra,
+                error: !!error,
+                type: type,
+                "aria-required": !!required,
+                "aria-describedby": error && `${name}-error`,
+                required: required,
+                disabled: false === editable,
+                trim: trim,
+                ...componentProps
+            })
+    }));
+    return /*#__PURE__*/ react.createElement(FieldBaseContainer, {
+        label: label,
+        layout: layout,
+        register: register,
+        error: errorGroupContext ? void 0 : error,
+        hasError: !!error,
+        wrapper: wrapper,
+        name: name
+    }, Component?.render ? /*#__PURE__*/ react.createElement(Component, {
+        ...register(name),
+        control: control,
+        error: !!error,
+        extra: extra,
+        type: type,
+        "aria-required": !!required,
+        "aria-describedby": error && `${name}-error`,
+        required: required,
+        disabled: false === editable,
+        defaultValue: defaultValue,
+        ...componentProps
+    }) : /*#__PURE__*/ react.createElement(Component, {
+        ...register(name),
+        register: register,
+        control: control,
+        error: !!error,
+        extra: extra,
+        type: type,
+        defaultValue: defaultValue,
+        "aria-required": !!required,
+        "aria-describedby": error && `${name}-error`,
+        required: required,
+        disabled: false === editable,
+        ...componentProps
+    }));
+};
+export { FieldBase };

package/Field/FieldBaseContainer.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { FieldContainerProps } from '@digigov/form/Field/types';
-export declare const FieldBaseContainer: React.FC<FieldContainerProps>;
+import type { FieldContainerProps } from './types.js';
+export declare const FieldBaseContainer: React.ForwardRefExoticComponent<FieldContainerProps & React.RefAttributes<HTMLFieldSetElement>>;
 export default FieldBaseContainer;

package/Field/FieldBaseContainer.js

@@ -0,0 +1,43 @@
+import react from "react";
+import Label from "../inputs/Label/index.js";
+import { ErrorMessage } from "@digigov/react-core/ErrorMessage/index.js";
+import FieldContainer from "@digigov/react-core/FieldContainer/index.js";
+import Fieldset from "@digigov/react-core/Fieldset/index.js";
+import FieldsetLegend from "@digigov/react-core/FieldsetLegend/index.js";
+import LabelContainer from "@digigov/react-core/LabelContainer/index.js";
+import { useTranslation } from "@digigov/ui/i18n/index.js";
+import { Hint } from "@digigov/ui/typography/Hint/index.js";
+const FieldBaseContainer_FieldBaseContainer = /*#__PURE__*/ react.forwardRef(({ name, wrapper, label, children, error, hasError, layout, controlled, labelSize = 'sm' }, ref)=>{
+    const { t } = useTranslation();
+    const errorMessage = error?.message.key ? error.message.key : error?.message || '';
+    const errorContext = error?.message.context || {};
+    if ('fieldset' === wrapper) return /*#__PURE__*/ react.createElement(FieldContainer, {
+        error: hasError,
+        ...layout
+    }, /*#__PURE__*/ react.createElement(Fieldset, {
+        ref: ref,
+        className: "outline-none",
+        ...controlled && {
+            tabIndex: -1
+        }
+    }, /*#__PURE__*/ react.createElement(FieldsetLegend, {
+        size: labelSize
+    }, label && label.primary), label && label.secondary && /*#__PURE__*/ react.createElement(Hint, null, t(label.secondary)), error && /*#__PURE__*/ react.createElement(ErrorMessage, {
+        id: `${name}-error`
+    }, t(errorMessage, errorContext)), children, label && label.hint && /*#__PURE__*/ react.createElement(Hint, {
+        size: "sm"
+    }, label.hint)));
+    return /*#__PURE__*/ react.createElement(FieldContainer, {
+        error: hasError,
+        ...layout
+    }, /*#__PURE__*/ react.createElement(LabelContainer, null, label && /*#__PURE__*/ react.createElement(Label, {
+        label: label
+    }), error && /*#__PURE__*/ react.createElement(ErrorMessage, {
+        id: `${name}-error`
+    }, t(errorMessage, errorContext)), children, label && label.hint && /*#__PURE__*/ react.createElement(Hint, {
+        size: "sm"
+    }, label.hint)));
+});
+FieldBaseContainer_FieldBaseContainer.displayName = 'FieldBaseContainer';
+const FieldBaseContainer = FieldBaseContainer_FieldBaseContainer;
+export { FieldBaseContainer_FieldBaseContainer as FieldBaseContainer, FieldBaseContainer as default };

package/Field/FieldConditional.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { FieldConditionalProps } from '@digigov/form/Field/types';
+import type { FieldConditionalProps } from './types.js';
 export declare const FieldConditional: React.FC<FieldConditionalProps>;
 export default FieldConditional;

package/Field/FieldConditional.js

@@ -0,0 +1,45 @@
+import react from "react";
+import { useWatch } from "react-hook-form";
+import { FieldBase } from "./FieldBase.js";
+import { evaluateFieldWithConditions } from "./utils/evaluateFieldWithConditions.js";
+const ChildFieldMemo = /*#__PURE__*/ react.memo(function({ dependencies, field, control, reset, resetField, register, error, Field }) {
+    const newField = evaluateFieldWithConditions(field, dependencies);
+    return /*#__PURE__*/ react.createElement(FieldBase, {
+        ...newField,
+        Field: Field,
+        name: newField.key,
+        reset: reset,
+        resetField: resetField,
+        control: control,
+        register: register,
+        error: error
+    });
+}, (prev, next)=>{
+    if (!prev || !prev.dependencies) return false;
+    if (prev.error !== next.error) return false;
+    for(const dep in next.dependencies)if (next.dependencies[dep] !== prev.dependencies[dep]) return false;
+    return true;
+});
+const FieldConditional_FieldConditional = ({ control, field, register, reset, resetField, error, Field })=>{
+    const dependencyKeys = Object.keys(field.condition);
+    const dependencyValues = useWatch({
+        name: dependencyKeys,
+        control
+    });
+    const variables = dependencyKeys.reduce((data, fieldKey, index)=>({
+            ...data,
+            [fieldKey]: dependencyValues[index]
+        }), {});
+    return /*#__PURE__*/ react.createElement(ChildFieldMemo, {
+        dependencies: variables,
+        field: field,
+        control: control,
+        register: register,
+        reset: reset,
+        resetField: resetField,
+        error: error,
+        Field: Field
+    });
+};
+const FieldConditional = FieldConditional_FieldConditional;
+export { FieldConditional_FieldConditional as FieldConditional, FieldConditional as default };

package/Field/index.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { FieldProps } from '@digigov/form/Field/types';
+import type { FieldProps } from './types.js';
 export declare const Field: React.FC<FieldProps>;
 export default Field;

package/Field/index.js

@@ -1,109 +1,72 @@
-import React, { useMemo } from "react";
-import { FieldBase } from "@digigov/form/Field/FieldBase";
-import FieldConditional from "@digigov/form/Field/FieldConditional";
-import {
-  FIELD_COMPONENTS,
-  ALTERNATIVE_COMPONENTS
-} from "@digigov/form/Field/utils";
-import { calculateField } from "@digigov/form/Field/utils/calculateField";
-import { useField } from "@digigov/form/Field/utils/useField";
-import FieldArray from "@digigov/form/FieldArray";
-import Multiplicity from "@digigov/form/MultiplicityField";
-const Field = ({
-  name,
-  disabled,
-  children,
-  ...customField
-}) => {
-  const {
-    field,
-    control,
-    register,
-    reset,
-    error,
-    componentRegistry,
-    formState,
-    setValue,
-    getValues,
-    unregister,
-    trigger,
-    clearErrors
-  } = useField(name, customField?.type ? customField : null);
-  const calculatedField = useMemo(
-    () => calculateField(
-      children,
-      field,
-      {
-        ...FIELD_COMPONENTS,
-        ...componentRegistry
-      },
-      ALTERNATIVE_COMPONENTS
-    ),
-    [field]
-  );
-  if (calculatedField.condition) {
-    return /* @__PURE__ */ React.createElement(
-      FieldConditional,
-      {
-        control,
-        reset,
-        register,
-        field: calculatedField,
-        error,
-        Field
-      }
-    );
-  }
-  if (calculatedField.type === "array" && !calculatedField.multiplicity) {
-    calculatedField.name = name;
-    return /* @__PURE__ */ React.createElement(
-      FieldArray,
-      {
-        control,
-        register,
-        error,
-        formState,
-        Field,
-        ...calculatedField
-      }
-    );
-  }
-  if (calculatedField.type === "array" && calculatedField.multiplicity === true) {
-    calculatedField.name = name;
-    return /* @__PURE__ */ React.createElement(
-      Multiplicity,
-      {
-        control,
-        register,
-        trigger,
-        clearErrors,
-        error,
-        formState,
-        setValue,
-        getValues,
-        unregister,
-        Field,
-        ...calculatedField
-      }
-    );
-  }
-  return /* @__PURE__ */ React.createElement(
-    FieldBase,
-    {
-      ...calculatedField,
-      name,
-      disabled,
-      control,
-      register,
-      reset,
-      error,
-      Field
+import react, { useMemo } from "react";
+import { FieldBase } from "./FieldBase.js";
+import FieldConditional from "./FieldConditional.js";
+import { resolveField } from "./utils/resolveField.js";
+import { useField } from "./utils/useField.js";
+import FieldArray from "../FieldArray/index.js";
+import MultiplicityField from "../MultiplicityField/index.js";
+const Field_Field = ({ name, children, ...customField })=>{
+    const { field, control, register, reset, resetField, error, componentRegistry, formState, setValue, getValues, unregister, trigger, clearErrors, registerFieldFocus } = useField(name, customField?.type ? customField : null);
+    const resolvedField = useMemo(()=>resolveField(children, field, componentRegistry), [
+        field
+    ]);
+    if (resolvedField.condition) return /*#__PURE__*/ react.createElement(FieldConditional, {
+        control: control,
+        reset: reset,
+        resetField: resetField,
+        register: register,
+        field: resolvedField,
+        error: error,
+        Field: Field_Field
+    });
+    if ('array' === resolvedField.type && !resolvedField.multiplicity) {
+        resolvedField.name = name;
+        return /*#__PURE__*/ react.createElement(FieldArray, {
+            control: control,
+            trigger: trigger,
+            register: register,
+            clearErrors: clearErrors,
+            error: error,
+            getValues: getValues,
+            setValue: setValue,
+            formState: formState,
+            Field: Field_Field,
+            reset: reset,
+            resetField: resetField,
+            registerFieldFocus: registerFieldFocus,
+            ...resolvedField
+        });
     }
-  );
-};
-var Field_default = Field;
-export {
-  Field,
-  Field_default as default
+    if ('array' === resolvedField.type && true === resolvedField.multiplicity) {
+        resolvedField.name = name;
+        return /*#__PURE__*/ react.createElement(MultiplicityField, {
+            control: control,
+            register: register,
+            trigger: trigger,
+            clearErrors: clearErrors,
+            error: error,
+            formState: formState,
+            setValue: setValue,
+            getValues: getValues,
+            unregister: unregister,
+            resetField: resetField,
+            Field: Field_Field,
+            ...resolvedField
+        });
+    }
+    const editable = false !== customField.editable && true !== customField.disabled;
+    const customError = error ? error : formState?.errors[name];
+    return /*#__PURE__*/ react.createElement(FieldBase, {
+        ...resolvedField,
+        editable: editable,
+        name: name,
+        control: control,
+        register: register,
+        reset: reset,
+        error: customError,
+        resetField: resetField,
+        Field: Field_Field
+    });
 };
-//# sourceMappingURL=index.js.map
+const Field = Field_Field;
+export { Field_Field as Field, Field as default };

package/Field/types.d.ts

@@ -1,22 +1,29 @@
-import React from 'react';
-import { ErrorOption, UseFormReturn, UseFormProps } from 'react-hook-form';
-import { ValidatorSchema } from '@digigov/form/validators/types';
-import { GridProps } from '@digigov/ui/layouts/Grid';
+import type React from 'react';
+import type { ErrorOption, UseFormReturn, UseFormProps } from 'react-hook-form';
+import type { FieldComponentRegistry } from '../inputs/registry.js';
+import type { registerFieldFocus } from '../types.js';
+import type { ValidatorSchema } from '../validators/types.js';
+import type { FieldsetLegendProps } from '@digigov/ui/form/FieldContainer';
+import type { GridProps } from '@digigov/ui/layouts/Grid';
 export interface FieldLabelProps {
     primary?: string;
     secondary?: string;
+    hint?: string;
 }
 export interface FieldSpec {
     key: string;
-    type?: 'int' | 'string' | 'text' | 'boolean' | 'email' | 'uuid4' | 'choice:multiple' | 'choice:single' | 'mobile_phone' | 'date' | 'otp' | 'afm' | 'iban' | 'file' | 'image' | 'postal_code' | 'phone_number' | 'array' | 'object';
+    type?: 'int' | 'string' | 'text' | 'boolean' | 'email' | 'uuid4' | 'choice:multiple' | 'choice:single' | 'mobile_phone' | 'date' | 'datetime' | 'otp' | 'afm' | 'amka' | 'iban' | 'file' | 'rate' | 'image' | 'postal_code' | 'phone_number' | 'array' | 'object';
+    trim?: boolean;
     component?: any;
     autoComplete?: string;
+    placeholder?: string;
     maxLength?: number;
     condition?: Record<string, FieldCondition>;
     controlled?: boolean;
     label?: FieldLabelProps;
     extra?: Record<string, any>;
     editable?: boolean;
+    variant?: 'inline' | 'dialog';
     required?: boolean;
     enabled?: boolean;
     disabled?: boolean;
@@ -26,6 +33,8 @@ export interface FieldSpec {
     maxWidth?: string;
     maxHeight?: string;
     width?: string;
+    min?: number;
+    max?: number;
 }
 export interface FieldCondition {
     is: string | string[] | number | number[] | boolean | boolean[];
@@ -36,7 +45,7 @@ export interface ChildFieldMemoProps extends FieldConditionalProps {
     dependencies: FormData;
 }
 export type FormData = UseFormProps['defaultValues'];
-export interface FieldWithCondition extends Omit<CalculatedField, 'condition'> {
+export interface FieldWithCondition extends Omit<ResolvedField, 'condition'> {
     condition: Record<string, FieldCondition>;
 }
 export interface FieldConditionalProps {
@@ -44,6 +53,7 @@ export interface FieldConditionalProps {
     control: UseFormReturn['control'];
     register: UseFormReturn['register'];
     reset: UseFormReturn['reset'];
+    resetField?: UseFormReturn['resetField'];
     error?: ErrorOption;
     Field: React.FC<FieldProps>;
 }
@@ -54,14 +64,16 @@ export interface FieldComponentItem {
 }
 export interface FieldContainerProps {
     name?: FieldSpec['key'];
+    register: FieldBaseProps['register'];
     layout?: FieldSpec['layout'];
     label?: FieldSpec['label'];
     error?: ErrorOption | Record<string, any>;
+    hasError?: boolean;
     children?: React.ReactNode;
+    controlled?: boolean;
     wrapper?: FieldSpec['wrapper'];
+    labelSize?: FieldsetLegendProps['size'];
 }
-export type FieldComponentRegistry = Record<string, FieldComponentItem>;
-export type OmittedFieldSpec = Omit<FieldSpec, 'component'>;
 export type UnknownValue = never | never[];
 export interface ControlledFieldProps {
     type?: string;
@@ -73,7 +85,7 @@ export interface ControlledFieldProps {
     error?: boolean;
     name?: string;
     disabled?: boolean;
-    Field: React.FC<FieldProps>;
+    Field?: React.FC<FieldProps>;
 }
 export interface UncontrolledFieldProps {
     name: string;
@@ -85,7 +97,7 @@ export interface UncontrolledFieldProps {
     disabled?: boolean;
     Field: React.FC<FieldProps>;
 }
-export interface CalculatedField extends OmittedFieldSpec {
+export interface ResolvedField extends Omit<FieldSpec, 'component'> {
     name: string;
     component: any;
     defaultValue?: never;
@@ -93,11 +105,12 @@ export interface CalculatedField extends OmittedFieldSpec {
     wrapper?: FieldComponentItem['wrapper'];
     multiplicity?: boolean;
 }
-export interface FieldBaseProps extends CalculatedField {
+export interface FieldBaseProps extends ResolvedField {
     control: UseFormReturn['control'];
     register: UseFormReturn['register'];
     reset: UseFormReturn['reset'];
-    Field: React.FC<FieldProps>;
+    resetField?: UseFormReturn['resetField'];
+    Field?: React.FC<FieldProps>;
 }
 export interface FieldProps extends FieldSpec {
     name: string;
@@ -108,6 +121,7 @@ export interface UseFieldProps {
     control: FieldBaseProps['control'];
     register: FieldBaseProps['register'];
     reset: FieldBaseProps['reset'];
+    resetField: FieldBaseProps['resetField'];
     watch: UseFormReturn['watch'];
     formState: UseFormReturn['formState'];
     getFieldState: UseFormReturn['getFieldState'];
@@ -117,5 +131,6 @@ export interface UseFieldProps {
     trigger: UseFormReturn['trigger'];
     clearErrors: UseFormReturn['clearErrors'];
     error?: ErrorOption;
+    registerFieldFocus: registerFieldFocus;
     componentRegistry?: FieldComponentRegistry;
 }

package/Field/utils/evaluateFieldWithConditions.d.ts

@@ -1,2 +1,2 @@
-import { FieldWithCondition, CalculatedField } from '@digigov/form/Field/types';
-export declare function evaluateFieldWithConditions(field: FieldWithCondition, variables: FormData): CalculatedField;
+import type { FieldWithCondition, ResolvedField } from '../types.js';
+export declare function evaluateFieldWithConditions(field: FieldWithCondition, variables: FormData): ResolvedField;

package/Field/utils/evaluateFieldWithConditions.js

@@ -0,0 +1,19 @@
+function evaluateFieldWithConditions(field, variables) {
+    const newField = {
+        ...field
+    };
+    if (variables) {
+        for(const key in variables)if (field.condition[key] && field.condition[key].is) {
+            const is = field.condition[key].is;
+            if (is === variables[key] || Array.isArray(variables[key]) && variables[key].includes(is)) {
+                const then = field.condition[key].then || {};
+                for(const attr in then)newField[attr] = then[attr];
+            }
+        } else if (field.condition[key]) {
+            const otherwise = field.condition[key].else || {};
+            for(const attr in otherwise)newField[attr] = otherwise[attr];
+        }
+    }
+    return newField;
+}
+export { evaluateFieldWithConditions };

package/Field/utils/resolveField.d.ts

@@ -0,0 +1,3 @@
+import type { FieldProps, FieldSpec, ResolvedField } from '../types.js';
+import { type FieldComponentRegistry } from '../../inputs/registry.js';
+export declare function resolveField(children: FieldProps['children'], field: FieldSpec, customComponentRegistry?: FieldComponentRegistry): ResolvedField;

package/Field/utils/resolveField.js

@@ -0,0 +1,32 @@
+import { ALTERNATIVE_COMPONENTS, FIELD_COMPONENTS } from "../../inputs/registry.js";
+function resolveField(children, field, customComponentRegistry) {
+    const fieldComponentRegistry = {
+        ...FIELD_COMPONENTS,
+        ...customComponentRegistry ?? {}
+    };
+    const resolvedField = {
+        ...field
+    };
+    if (children) {
+        resolvedField.component = children;
+        resolvedField.controlled = true;
+    } else if ('function' == typeof field.component) ;
+    else if (field.component || field.type) if ('string' == typeof field?.extra?.component && ALTERNATIVE_COMPONENTS[field.extra.component]) {
+        resolvedField.controlled = ALTERNATIVE_COMPONENTS[field.extra.component]?.controlled || false;
+        resolvedField.component = ALTERNATIVE_COMPONENTS[field.extra.component].component;
+        resolvedField.wrapper = ALTERNATIVE_COMPONENTS[field.extra.component].wrapper;
+    } else if (!field.component && field.type && fieldComponentRegistry[field.type]) {
+        resolvedField.component = fieldComponentRegistry[field.type].component;
+        resolvedField.wrapper = fieldComponentRegistry[field.type].wrapper;
+        resolvedField.controlled = fieldComponentRegistry[field.type]?.controlled || false;
+    } else {
+        resolvedField.component = fieldComponentRegistry.string.component;
+        resolvedField.controlled = fieldComponentRegistry.string?.controlled || false;
+    }
+    else {
+        resolvedField.component = fieldComponentRegistry.string.component;
+        resolvedField.controlled = fieldComponentRegistry.string?.controlled || false;
+    }
+    return resolvedField;
+}
+export { resolveField };

package/Field/utils/useField.d.ts

@@ -1,2 +1,2 @@
-import { FieldSpec, UseFieldProps } from '@digigov/form/Field/types';
+import type { FieldSpec, UseFieldProps } from '../types.js';
 export declare const useField: (name: string, customField: FieldSpec | null) => UseFieldProps;