@digigov/form 2.0.0-e7d30530 → 2.0.0-eaf330f5

package/lazy/index.js

@@ -4,21 +4,21 @@ export default {
   'Field': lazy(() => import('@digigov/form/Field').then((module) => ({ default: module['Field'] }))),
   'Fieldset': lazy(() => import('@digigov/form/Fieldset').then((module) => ({ default: module['Fieldset'] }))),
   'Label': lazy(() => import('@digigov/form/inputs/Label').then((module) => ({ default: module['Label'] }))),
-  'ErrorGroupContext': lazy(() => import('@digigov/form/Field/ErrorGroup').then((module) => ({ default: module['ErrorGroupContext'] }))),
-  'ErrorGroup': lazy(() => import('@digigov/form/Field/ErrorGroup').then((module) => ({ default: module['ErrorGroup'] }))),
-  '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'] }))),
   'FieldArray': lazy(() => import('@digigov/form/FieldArray').then((module) => ({ default: module['FieldArray'] }))),
-  'FieldObject': lazy(() => import('@digigov/form/FieldObject').then((module) => ({ default: module['FieldObject'] }))),
+  'ErrorGroupContext': lazy(() => import('@digigov/form/Field/ErrorGroup').then((module) => ({ default: module['ErrorGroupContext'] }))),
+  'ErrorGroup': lazy(() => import('@digigov/form/Field/ErrorGroup').then((module) => ({ default: module['ErrorGroup'] }))),
+  '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'] }))),
   'FieldsetWithContext': lazy(() => import('@digigov/form/Fieldset/FieldsetWithContext').then((module) => ({ default: module['FieldsetWithContext'] }))),
   'FieldsetLabel': lazy(() => import('@digigov/form/Fieldset').then((module) => ({ default: module['FieldsetLabel'] }))),
   'FieldsetCaption': lazy(() => import('@digigov/form/Fieldset').then((module) => ({ default: module['FieldsetCaption'] }))),
   'FieldsetBody': lazy(() => import('@digigov/form/Fieldset').then((module) => ({ default: module['FieldsetBody'] }))),
+  'FieldObject': lazy(() => import('@digigov/form/FieldObject').then((module) => ({ default: module['FieldObject'] }))),
   'ControlledFormBuilder': lazy(() => import('@digigov/form/FormBuilder').then((module) => ({ default: module['ControlledFormBuilder'] }))),
   'FormBase': lazy(() => import('@digigov/form/FormBuilder').then((module) => ({ default: module['FormBase'] }))),
   'AddObjects': lazy(() => import('@digigov/form/MultiplicityField/add-objects').then((module) => ({ default: module['AddObjects'] }))),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digigov/form",
-  "version": "2.0.0-e7d30530",
+  "version": "2.0.0-eaf330f5",
   "description": "@digigov form builder",
   "author": "GRNET Developers <devs@lists.grnet.gr>",
   "license": "BSD-2-Clause",
@@ -10,18 +10,18 @@
     "access": "public"
   },
   "dependencies": {
-    "react-hook-form": "7.56.1",
+    "react-hook-form": "7.33.1",
     "yup": "0.32.11",
     "dayjs": "1.10.4",
-    "@hookform/resolvers": "5.0.1",
-    "@digigov/react-icons": "2.0.0-e7d30530"
+    "@hookform/resolvers": "4.1.3",
+    "@digigov/react-icons": "2.0.0-eaf330f5"
   },
   "peerDependencies": {
-    "@digigov/ui": "2.0.0-e7d30530",
-    "@digigov/react-core": "2.0.0-e7d30530",
+    "@digigov/ui": "2.0.0-eaf330f5",
+    "@digigov/react-core": "2.0.0-eaf330f5",
     "clsx": "1.1.1",
-    "react": "^18.3.0 || ^19.1.0",
-    "react-dom": "^18.3.0 || ^19.1.0"
+    "react": ">=16.8.0 <19.0.0",
+    "react-dom": ">=16.8.0 <19.0.0"
   },
   "gitHead": "c903a46306f77f55ad7fc4d2e274006f39a6c871",
   "private": false,

package/registry/index.js

@@ -4,18 +4,18 @@ import * as _digigov_form from "@digigov/form";
 import * as _digigov_form_internal from "@digigov/form/internal";
 import * as _digigov_form_types from "@digigov/form/types";
 import * as _digigov_form_utils from "@digigov/form/utils";
+import * as _digigov_form_FieldArray_FormDialog from "@digigov/form/FieldArray/FormDialog";
+import * as _digigov_form_FieldArray from "@digigov/form/FieldArray";
 import * as _digigov_form_Field_ErrorGroup from "@digigov/form/Field/ErrorGroup";
 import * as _digigov_form_Field_FieldBase from "@digigov/form/Field/FieldBase";
 import * as _digigov_form_Field_FieldBaseContainer from "@digigov/form/Field/FieldBaseContainer";
 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 from "@digigov/form/FieldArray";
-import * as _digigov_form_FieldObject from "@digigov/form/FieldObject";
 import * as _digigov_form_Fieldset_FieldsetWithContext from "@digigov/form/Fieldset/FieldsetWithContext";
 import * as _digigov_form_Fieldset from "@digigov/form/Fieldset";
 import * as _digigov_form_Fieldset_types from "@digigov/form/Fieldset/types";
+import * as _digigov_form_FieldObject from "@digigov/form/FieldObject";
 import * as _digigov_form_FormBuilder from "@digigov/form/FormBuilder";
 import * as _digigov_form_MultiplicityField_add_objects from "@digigov/form/MultiplicityField/add-objects";
 import * as _digigov_form_MultiplicityField from "@digigov/form/MultiplicityField";
@@ -52,8 +52,9 @@ import * as _digigov_form_inputs_DateTimeInput from "@digigov/form/inputs/DateTi
 import * as _digigov_form_inputs_FileInput from "@digigov/form/inputs/FileInput";
 import * as _digigov_form_inputs_ImageInput from "@digigov/form/inputs/ImageInput";
 import * as _digigov_form_inputs_Input from "@digigov/form/inputs/Input";
-import * as _digigov_form_inputs_OtpInput from "@digigov/form/inputs/OtpInput";
+import * as _digigov_form_inputs_Input_inputsInputScenarios from "@digigov/form/inputs/Input/inputsInputScenarios";
 import * as _digigov_form_inputs_Label from "@digigov/form/inputs/Label";
+import * as _digigov_form_inputs_OtpInput from "@digigov/form/inputs/OtpInput";
 import * as _digigov_form_inputs_Radio from "@digigov/form/inputs/Radio";
 import * as _digigov_form_inputs_Select from "@digigov/form/inputs/Select";
 import * as _digigov_form_validators_utils_afm from "@digigov/form/validators/utils/afm";
@@ -95,18 +96,18 @@ export default {
   '@digigov/form/internal': lazyImport(_digigov_form_internal),
   '@digigov/form/types': lazyImport(_digigov_form_types),
   '@digigov/form/utils': lazyImport(_digigov_form_utils),
+  '@digigov/form/FieldArray/FormDialog': lazyImport(_digigov_form_FieldArray_FormDialog),
+  '@digigov/form/FieldArray': lazyImport(_digigov_form_FieldArray),
   '@digigov/form/Field/ErrorGroup': lazyImport(_digigov_form_Field_ErrorGroup),
   '@digigov/form/Field/FieldBase': lazyImport(_digigov_form_Field_FieldBase),
   '@digigov/form/Field/FieldBaseContainer': lazyImport(_digigov_form_Field_FieldBaseContainer),
   '@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': lazyImport(_digigov_form_FieldArray),
-  '@digigov/form/FieldObject': lazyImport(_digigov_form_FieldObject),
   '@digigov/form/Fieldset/FieldsetWithContext': lazyImport(_digigov_form_Fieldset_FieldsetWithContext),
   '@digigov/form/Fieldset': lazyImport(_digigov_form_Fieldset),
   '@digigov/form/Fieldset/types': lazyImport(_digigov_form_Fieldset_types),
+  '@digigov/form/FieldObject': lazyImport(_digigov_form_FieldObject),
   '@digigov/form/FormBuilder': lazyImport(_digigov_form_FormBuilder),
   '@digigov/form/MultiplicityField/add-objects': lazyImport(_digigov_form_MultiplicityField_add_objects),
   '@digigov/form/MultiplicityField': lazyImport(_digigov_form_MultiplicityField),
@@ -143,8 +144,9 @@ export default {
   '@digigov/form/inputs/FileInput': lazyImport(_digigov_form_inputs_FileInput),
   '@digigov/form/inputs/ImageInput': lazyImport(_digigov_form_inputs_ImageInput),
   '@digigov/form/inputs/Input': lazyImport(_digigov_form_inputs_Input),
-  '@digigov/form/inputs/OtpInput': lazyImport(_digigov_form_inputs_OtpInput),
+  '@digigov/form/inputs/Input/inputsInputScenarios': lazyImport(_digigov_form_inputs_Input_inputsInputScenarios),
   '@digigov/form/inputs/Label': lazyImport(_digigov_form_inputs_Label),
+  '@digigov/form/inputs/OtpInput': lazyImport(_digigov_form_inputs_OtpInput),
   '@digigov/form/inputs/Radio': lazyImport(_digigov_form_inputs_Radio),
   '@digigov/form/inputs/Select': lazyImport(_digigov_form_inputs_Select),
   '@digigov/form/validators/utils/afm': lazyImport(_digigov_form_validators_utils_afm),

package/src/Field/FieldBase.tsx

@@ -51,20 +51,23 @@ export const FieldBase: React.FC<FieldBaseProps> = ({
           name={name}
           render={({ field }) => {
             return (
-              <Component
-                {...field}
-                control={control}
-                ref={undefined}
-                defaultValue={defaultValue ?? field.value}
-                extra={extra}
-                error={!!error}
-                type={type}
-                aria-required={!!required}
-                aria-describedby={error && `${name}-error`}
-                required={required}
-                disabled={editable === false}
-                {...componentProps}
-              />
+              <>
+                <div tabIndex={-1} ref={field.ref} />
+                <Component
+                  {...field}
+                  control={control}
+                  ref={undefined}
+                  defaultValue={defaultValue}
+                  extra={extra}
+                  error={!!error}
+                  type={type}
+                  aria-required={!!required}
+                  aria-describedby={error && `${name}-error`}
+                  required={required}
+                  disabled={editable === false}
+                  {...componentProps}
+                />
+              </>
             );
           }}
         />
@@ -109,6 +112,7 @@ export const FieldBase: React.FC<FieldBaseProps> = ({
           aria-describedby={error && `${name}-error`}
           required={required}
           disabled={editable === false}
+          ref={undefined}
           {...componentProps}
         />
       )}

package/src/Field/FieldBaseContainer.tsx

@@ -1,80 +1,63 @@
-import React, { ComponentRef } from 'react';
+import React from 'react';
 import { FieldContainerProps } from '@digigov/form/Field/types';
 import Label from '@digigov/form/inputs/Label';
 import { ErrorMessage } from '@digigov/react-core/ErrorMessage';
 import FieldContainer from '@digigov/react-core/FieldContainer';
-import Fieldset from '@digigov/react-core/Fieldset';
+import CoreFieldset from '@digigov/react-core/Fieldset';
 import FieldsetLegend from '@digigov/react-core/FieldsetLegend';
 import LabelContainer from '@digigov/react-core/LabelContainer';
 import { useTranslation } from '@digigov/ui/i18n';
 import { Hint } from '@digigov/ui/typography/Hint';
 
-export const FieldBaseContainer = React.forwardRef<
-  ComponentRef<typeof Fieldset>,
-  FieldContainerProps
->(
-  (
-    {
-      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 (wrapper === 'fieldset') {
-      return (
-        <FieldContainer error={hasError} {...layout}>
-          <Fieldset
-            ref={ref}
-            className="outline-none"
-            {...(controlled && {
-              tabIndex: -1,
-            })}
-          >
-            <FieldsetLegend size={labelSize}>
-              {label && label.primary}
-            </FieldsetLegend>
-            {label && label.secondary && <Hint>{t(label.secondary)}</Hint>}
-            {error && (
-              <ErrorMessage id={`${name}-error`}>
-                {t(errorMessage, errorContext)}
-              </ErrorMessage>
-            )}
-            {children}
-            {label && label.hint && <Hint size="sm">{label.hint}</Hint>}
-          </Fieldset>
-        </FieldContainer>
-      );
-    } else {
-      return (
-        <FieldContainer error={hasError} {...layout}>
-          <LabelContainer>
-            {label && <Label label={label} />}
-            {error && (
-              <ErrorMessage id={`${name}-error`}>
-                {t(errorMessage, errorContext)}
-              </ErrorMessage>
-            )}
-            {children}
-            {label && label.hint && <Hint size="sm">{label.hint}</Hint>}
-          </LabelContainer>
-        </FieldContainer>
-      );
-    }
+export const FieldBaseContainer: React.FC<FieldContainerProps> = ({
+  name,
+  wrapper,
+  label,
+  children,
+  error,
+  hasError,
+  layout,
+  labelSize = 'sm',
+}) => {
+  const { t } = useTranslation();
+  const errorMessage = error?.message.key
+    ? error.message.key
+    : error?.message || '';
+  const errorContext = error?.message.context || {};
+  if (wrapper === 'fieldset') {
+    return (
+      <FieldContainer error={hasError} {...layout}>
+        <CoreFieldset>
+          <FieldsetLegend size={labelSize}>
+            {label && label.primary}
+          </FieldsetLegend>
+          {label && label.secondary && <Hint mb={0}>{t(label.secondary)}</Hint>}
+          {error && (
+            <ErrorMessage id={`${name}-error`} mb={0}>
+              {t(errorMessage, errorContext)}
+            </ErrorMessage>
+          )}
+          {children}
+          {label && label.hint && <Hint size="sm">{label.hint}</Hint>}
+        </CoreFieldset>
+      </FieldContainer>
+    );
+  } else {
+    return (
+      <FieldContainer error={hasError} {...layout}>
+        <LabelContainer>
+          {label && <Label label={label} />}
+          {error && (
+            <ErrorMessage id={`${name}-error`}>
+              {t(errorMessage, errorContext)}
+            </ErrorMessage>
+          )}
+          {children}
+          {label && label.hint && <Hint size="sm">{label.hint}</Hint>}
+        </LabelContainer>
+      </FieldContainer>
+    );
   }
-);
-
-FieldBaseContainer.displayName = 'FieldBaseContainer';
+};
 
 export default FieldBaseContainer;

package/src/Field/FieldConditional.tsx

@@ -78,8 +78,8 @@ export const FieldConditional: React.FC<FieldConditionalProps> = ({
       field={field}
       control={control}
       register={register}
-      reset={reset}
       resetField={resetField}
+      reset={reset}
       error={error}
       Field={Field}
     />

package/src/Field/index.tsx

@@ -97,7 +97,6 @@ export const Field: React.FC<FieldProps> = ({
         setValue={setValue}
         getValues={getValues}
         unregister={unregister}
-        resetField={resetField}
         Field={Field}
         {...calculatedField}
       />
@@ -116,8 +115,8 @@ export const Field: React.FC<FieldProps> = ({
       control={control}
       register={register}
       reset={reset}
-      error={customError}
       resetField={resetField}
+      error={customError}
       Field={Field}
     />
   );

package/src/Field/types.tsx

@@ -82,7 +82,7 @@ export interface FieldConditionalProps {
   control: UseFormReturn['control'];
   register: UseFormReturn['register'];
   reset: UseFormReturn['reset'];
-  resetField?: UseFormReturn['resetField'];
+  resetField: UseFormReturn['resetField'];
   error?: ErrorOption;
   Field: React.FC<FieldProps>;
 }
@@ -151,7 +151,7 @@ export interface FieldBaseProps extends CalculatedField {
   control: UseFormReturn['control'];
   register: UseFormReturn['register'];
   reset: UseFormReturn['reset'];
-  resetField?: UseFormReturn['resetField'];
+  resetField: UseFormReturn['resetField'];
   Field?: React.FC<FieldProps>;
 }
 

package/src/Field/utils/index.ts

@@ -20,12 +20,11 @@ export const FIELD_COMPONENTS: FieldComponentRegistry = {
   file: {
     wrapper: 'fieldset',
     component: FileInput,
-    // controlled: true,
+    controlled: true,
   },
   image: {
     wrapper: 'fieldset',
     component: ImageInput,
-    controlled: true,
   },
   date: {
     wrapper: 'fieldset',

package/src/FieldArray/FormDialog.tsx

@@ -40,7 +40,7 @@ export interface FormDialogProps extends FieldProps {
   getValues: UseFormReturn['getValues'];
   setValue: UseFormReturn['setValue'];
   reset: UseFormReturn['reset'];
-  resetField?: UseFormReturn['resetField'];
+  resetField: UseFormReturn['resetField'];
   sortable: boolean;
   Field: React.FC<FieldProps>;
 }
@@ -206,6 +206,9 @@ export const FormDialog: React.FC<FormDialogProps> = React.forwardRef(
                 ofField?.extra &&
                 values?.length > 0 && (
                   <ArrayItemHeader
+                    tableCellActionsLabel={
+                      customField.extra?.tableCellActionsLabel
+                    }
                     labels={
                       ofField.type === 'object'
                         ? ofField.extra.fields.map(({ label }) => label.primary)
@@ -393,14 +396,20 @@ export const ArrayItemModal = React.forwardRef(function ArrayItemModal(
   );
 });
 
-export const ArrayItemHeader = ({ labels, disabled }) => {
+export const ArrayItemHeader = ({
+  labels,
+  disabled,
+  tableCellActionsLabel,
+}) => {
   return (
     <TableHead>
       <TableRow>
         {labels.map((label, index) => {
           return <TableHeadCell key={index}>{label}</TableHeadCell>;
         })}
-        {!disabled && <TableHeadCell>Ενέργειες</TableHeadCell>}
+        {!disabled && (
+          <TableHeadCell>{tableCellActionsLabel ?? `Ενέργειες`}</TableHeadCell>
+        )}
       </TableRow>
     </TableHead>
   );

package/src/FieldArray/__stories__/Default.tsx

@@ -81,7 +81,7 @@ const fields = [
   },
 ] as FieldSpec[];
 
-export const Default = (_: any) => (
+export const Default = () => (
   <FormBuilder
     onSubmit={(data) => {
       console.log(data);

package/src/FieldArray/__stories__/WithExactLength.tsx

@@ -81,7 +81,7 @@ const fields = [
   },
 ] as FieldSpec[];
 
-export const WithExactLength = (_: any) => (
+export const WithExactLength = () => (
   <FormBuilder
     onSubmit={(data) => {
       console.log(data);

package/src/FieldArray/__stories__/WithModal.tsx

@@ -147,7 +147,7 @@ const fields = [
   },
 ] as FieldSpec[];
 
-export const WithModal = (_: any) => (
+export const WithModal = () => (
   <FormBuilder
     onSubmit={(data) => {
       console.log(data);