@digigov/form 2.0.0-32ae417f → 2.0.0-385c7994

package/src/FormBuilder/scenarios.test.tsx

@@ -433,7 +433,7 @@ const fillActionPerType = {
   iban: fillSimpleInput,
   postal_code: fillSimpleInput,
   phone_number: fillSimpleInput,
-
+  rate: fillSimpleInput,
   date: fillDateInput,
   datetime: fillDateTimeInput,
   otp: fillOtpInput,
@@ -656,6 +656,7 @@ const generateScenarios = (
       fields: scenarioFields,
       fill: scenarioFill,
       expect: scenarioExpect,
+      delay: ['multiplicity', 'fieldArray'].includes(fieldKey) ? 500 : 0,
     });
   }
   return generatedScenarios;
@@ -698,14 +699,14 @@ const el = {
       date: {
         invalid: 'Η ημερομηνία πρέπει να είναι έγκυρη.',
         invalid_month_year:
-          'Η ημερομηνία πρέπει να συμπεριλαμβάνει τον μήνα και το έτος.',
+          'Η ημερομηνία πρέπει να περιλαμβάνει τον μήνα και το έτος.',
         invalid_day_year:
-          'Η ημερομηνία πρέπει να συμπεριλαμβάνει την ημέρα και το έτος.',
+          'Η ημερομηνία πρέπει να περιλαμβάνει την ημέρα και το έτος.',
         invalid_day_month:
-          'Η ημερομηνία πρέπει να συμπεριλαμβάνει την ημέρα και τον μήνα.',
-        invalid_day: 'Η ημερομηνία πρέπει να συμπεριλαμβάνει την ημέρα',
-        invalid_month: 'Η ημερομηνία πρέπει να συμπεριλαμβάνει τον μήνα.',
-        invalid_year: 'Η ημερομηνία πρέπει να συμπεριλαμβάνει το ετος.',
+          'Η ημερομηνία πρέπει να περιλαμβάνει την ημέρα και τον μήνα.',
+        invalid_day: 'Η ημερομηνία πρέπει να περιλαμβάνει την ημέρα.',
+        invalid_month: 'Η ημερομηνία πρέπει να περιλαμβάνει τον μήνα.',
+        invalid_year: 'Η ημερομηνία πρέπει να περιλαμβάνει το ετος.',
         earlier_than: 'Συμπληρώστε μια ημερομηνία προγενέστερη της {{maxDate}}',
         later_than: 'Συμπληρώστε μια ημερομηνία μεταγενέστερη της {{minDate}}',
         invalid_day_range: 'Η ήμέρα πρέπει να είναι μεταξύ 1 και {{maxDay}}.',
@@ -791,6 +792,10 @@ const el = {
         more_than: 'Έχετε υπερβεί το όριο των {{max}} χαρακτήρων.',
         less_than: 'Χρειάζονται τουλάχιστον {{min}} χαρακτήρες.',
       },
+      rate: {
+        rate_percent:
+          'Συμπληρώστε ένα έγκυρο ακέραιο ποσοστό από το {{min}} έως το {{max}}',
+      },
     },
   },
 };
@@ -2049,6 +2054,16 @@ const INPUTS_INPUT_FIELDS = [
     extra: { countries: ['GR'] },
     required: true,
   },
+  {
+    key: 'rate',
+    type: 'rate',
+    min: 0,
+    max: 100,
+    label: {
+      primary: 'Συμπληρώστε το ποσοστό παραχώρησης',
+    },
+    required: true,
+  },
 ];
 
 const ERROR_GROUPING_FIELDS = [
@@ -2153,6 +2168,10 @@ const inputsInputScenarios = [
         fieldKey: 'uuid4',
         value: '1e805d00-ea67-478a-ab8b-d13ff8b38fa3',
       },
+      {
+        fieldKey: 'rate',
+        value: '90',
+      },
     ],
     expect: [
       {
@@ -2215,6 +2234,11 @@ const inputsInputScenarios = [
         fieldKey: 'uuid4',
         text: el.form.error.required,
       },
+      {
+        type: 'success',
+        fieldKey: 'rate',
+        text: el.form.error.required,
+      },
     ],
   },
   {
@@ -2309,6 +2333,11 @@ const inputsInputScenarios = [
         text: el.form.error.required,
         textAssertion: 'toContainText',
       },
+      {
+        type: 'error',
+        fieldKey: 'rate',
+        text: el.form.error.required,
+      },
     ],
   },
   {
@@ -2326,7 +2355,7 @@ const inputsInputScenarios = [
       },
       {
         fieldKey: 'location',
-        value: '23232',
+        value: '',
       },
       {
         fieldKey: 'postal-code',
@@ -2368,6 +2397,10 @@ const inputsInputScenarios = [
         fieldKey: 'postal_code',
         value: 'aaaaa',
       },
+      {
+        fieldKey: 'rate',
+        value: '120',
+      },
     ],
     expect: [
       {
@@ -2381,9 +2414,9 @@ const inputsInputScenarios = [
         text: el.form.error.email,
       },
       {
-        type: 'success',
+        type: 'error',
         fieldKey: 'location',
-        text: el.form.error.string,
+        text: el.form.error.required,
       },
       {
         type: 'error',
@@ -2437,6 +2470,12 @@ const inputsInputScenarios = [
         text: el.form.error.postalCode,
         textAssertion: 'toContainText',
       },
+      {
+        type: 'error',
+        fieldKey: 'rate',
+        text: el.form.error.rate.rate_percent,
+        args: { min: 0, max: 100 },
+      },
     ],
   },
 ];

package/src/FormContext.tsx

@@ -1,5 +1,6 @@
-import React, { createContext, useContext } from 'react';
-import { FormContextProps } from '@digigov/form/types';
+import type React from 'react';
+import { createContext, useContext } from 'react';
+import type { FormContextProps } from '@digigov/form/types';
 
 export const FormContext: React.Context<FormContextProps> = createContext({
   fieldsMap: {},

package/src/MultiplicityField/__stories__/PreviewDisplay.tsx

@@ -76,9 +76,7 @@ export const PreviewDisplay = (_: any) => (
         <HeadingCaption>Ψηφιακή βεβαίωση ιδιωτικού συμφωνητικού</HeadingCaption>
         <Heading>Προεπισκόπηση</Heading>
         <Paragraph>
-          <Paragraph>
-            Παρακάτω εμφανίζονται οι συνυπογράφοντες του ιδιωτικού συμφωνητικού
-          </Paragraph>
+          Παρακάτω εμφανίζονται οι συνυπογράφοντες του ιδιωτικού συμφωνητικού
         </Paragraph>
         <Card variant="border" borderColor="dark">
           <CardHeading>Συνυπογράφοντας 1</CardHeading>

package/src/MultiplicityField/add-objects.tsx

@@ -1,17 +1,12 @@
 import React, { useEffect, useMemo } from 'react';
-import {
+import type {
   ErrorOption,
   FieldArrayWithId,
   UseFieldArrayReturn,
-  useWatch,
 } from 'react-hook-form';
+import { useWatch } from 'react-hook-form';
 import { FieldBase } from '@digigov/form/Field/FieldBase';
-import { CalculatedField } from '@digigov/form/Field/types';
-import {
-  FIELD_COMPONENTS,
-  ALTERNATIVE_COMPONENTS,
-} from '@digigov/form/Field/utils';
-import { calculateField } from '@digigov/form/Field/utils/calculateField';
+import { resolveField } from '@digigov/form/Field/utils/resolveField';
 import { useField } from '@digigov/form/Field/utils/useField';
 import { FieldObject } from '@digigov/form/FieldObject';
 import { Fieldset } from '@digigov/form/Fieldset';
@@ -19,7 +14,7 @@ import type {
   MultiplicityProps,
   StashedObject,
 } from '@digigov/form/MultiplicityField/types';
-import { FieldSpec } from '@digigov/form/types';
+import type { FieldSpec } from '@digigov/form/types';
 import { Button } from '@digigov/ui/form/Button';
 import { RadioConditional } from '@digigov/ui/form/RadioContainer';
 
@@ -137,11 +132,7 @@ export const AddObjects: React.FC<AddObjectsProps> = ({
     error: needsMoreError,
   } = useField(radioField.key, radioField?.type ? radioField : null);
 
-  const calculatedField: CalculatedField = useMemo(
-    () =>
-      calculateField(children, field, FIELD_COMPONENTS, ALTERNATIVE_COMPONENTS),
-    [field]
-  );
+  const resolvedField = useMemo(() => resolveField(children, field), [field]);
   const needsMore = useWatch({ name: field.key, control });
 
   useEffect(() => {
@@ -156,25 +147,25 @@ export const AddObjects: React.FC<AddObjectsProps> = ({
 
   // TODO: Refactor types so that label is always required, the following
   // assignment is a temp fix for typescript build to run
-  calculatedField.label = calculatedField.label || {};
+  resolvedField.label = resolvedField.label || {};
   if (extra?.length) {
-    calculatedField.label.secondary = `Έχετε προσθέσει ${
+    resolvedField.label.secondary = `Έχετε προσθέσει ${
       stashedObjects.length
     } εγγραφές και σας απομένουν ακόμα ${
       extra.length - stashedObjects.length
     } εγγραφές.`;
   } else if (extra?.min && extra?.max) {
-    calculatedField.label.secondary = `Το πεδίο πρέπει να έχει ακόμα ${
+    resolvedField.label.secondary = `Το πεδίο πρέπει να έχει ακόμα ${
       extra?.min - stashedObjects.length
     } και το μέγιστο ${
       extra?.max
     } εγγραφές. Προσθέστε μια ακόμα επιλέγοντας την απάντηση «Ναι» στην επόμενη ερώτηση.`;
   } else if (extra?.min) {
-    calculatedField.label.secondary = `Το πεδίο πρέπει να έχει ακόμα ${
+    resolvedField.label.secondary = `Το πεδίο πρέπει να έχει ακόμα ${
       extra?.min - stashedObjects.length
     } εγγραφές. Προσθέστε μια ακόμα επιλέγοντας την απάντηση «Ναι» στην επόμενη ερώτηση.`;
   } else if (extra?.max) {
-    calculatedField.label.secondary = ` Έχετε προσθέσει ${
+    resolvedField.label.secondary = ` Έχετε προσθέσει ${
       stashedObjects.length
     } εγγραφές και σας απομένουν ${
       extra.max - stashedObjects.length
@@ -183,8 +174,8 @@ export const AddObjects: React.FC<AddObjectsProps> = ({
   return (
     <Fieldset>
       <FieldBase
-        {...calculatedField}
-        name={calculatedField.key}
+        {...resolvedField}
+        name={resolvedField.key}
         control={control}
         register={register}
         reset={reset}

package/src/MultiplicityField/index.tsx

@@ -1,9 +1,10 @@
 import React, { useState } from 'react';
-import { useFieldArray, UseFormReturn } from 'react-hook-form';
+import type { UseFormReturn } from 'react-hook-form';
+import { useFieldArray } from 'react-hook-form';
 import { FieldBaseContainer } from '@digigov/form/Field/FieldBaseContainer';
 import { FieldObject } from '@digigov/form/FieldObject';
 import { AddObjects } from '@digigov/form/MultiplicityField/add-objects';
-import {
+import type {
   MultiplicityProps,
   StashedObject,
 } from '@digigov/form/MultiplicityField/types';

package/src/MultiplicityField/types.ts

@@ -1,5 +1,8 @@
-import { ErrorOption, UseFormReturn } from 'react-hook-form';
-import { FieldSpec, ControlledFieldProps } from '@digigov/form/Field/types';
+import type { ErrorOption, UseFormReturn } from 'react-hook-form';
+import type {
+  FieldSpec,
+  ControlledFieldProps,
+} from '@digigov/form/Field/types';
 
 export interface MultiplicityProps
   extends Omit<ControlledFieldProps, 'value' | 'onChange' | 'error' | 'extra'> {

package/src/Questions/Questions.tsx

@@ -1,8 +1,8 @@
 import React, { useState, useEffect } from 'react';
 import { getNextStep } from '@digigov/form/Questions/getNextStep';
 import { QuestionsContext } from '@digigov/form/Questions/QuestionsContext';
-import { StepInterface } from '@digigov/form/Questions/Step/types';
-import { QuestionsInterface } from '@digigov/form/Questions/types';
+import type { StepInterface } from '@digigov/form/Questions/Step/types';
+import type { QuestionsInterface } from '@digigov/form/Questions/types';
 
 const isBrowser = typeof window !== 'undefined';
 

package/src/Questions/QuestionsContext.tsx

@@ -1,5 +1,5 @@
 import { createContext } from 'react';
-import { QuestionsContextInterface } from '@digigov/form/Questions/types';
+import type { QuestionsContextInterface } from '@digigov/form/Questions/types';
 
 const defaultStep = { name: '' };
 export const QuestionsContext = createContext<QuestionsContextInterface>({

package/src/Questions/Step/Step.tsx

@@ -2,7 +2,7 @@ import React, { useContext, useState } from 'react';
 import { QuestionsContext } from '@digigov/form/Questions/QuestionsContext';
 import { StepArrayReview } from '@digigov/form/Questions/Step/StepArrayReview';
 import { StepContext } from '@digigov/form/Questions/Step/StepContext';
-import { StepInterface } from '@digigov/form/Questions/Step/types';
+import type { StepInterface } from '@digigov/form/Questions/Step/types';
 
 /**
  * The Step component accepts Step data as props

package/src/Questions/Step/StepArrayReview.tsx

@@ -5,8 +5,8 @@ import FormBuilder from '@digigov/form/FormBuilder';
 import Label from '@digigov/form/inputs/Label';
 import { QuestionsContext } from '@digigov/form/Questions/QuestionsContext';
 import { getAddMoreFields } from '@digigov/form/Questions/Step/getAddMoreFields';
-import { StepArrayReviewInterface } from '@digigov/form/Questions/Step/types';
-import { FieldSpec } from '@digigov/form/types';
+import type { StepArrayReviewInterface } from '@digigov/form/Questions/Step/types';
+import type { FieldSpec } from '@digigov/form/types';
 import PageTitleContainer, {
   PageTitleHeading,
 } from '@digigov/ui/app/PageTitleContainer';

package/src/Questions/Step/StepContext.tsx

@@ -1,5 +1,5 @@
 import { createContext } from 'react';
-import { StepInterface } from '@digigov/form/Questions/Step/types';
+import type { StepInterface } from '@digigov/form/Questions/Step/types';
 
 export const StepContext = createContext<StepInterface>({
   name: '',

package/src/Questions/Step/StepDescription.tsx

@@ -1,7 +1,8 @@
 import React, { useContext } from 'react';
 import { StepContext } from '@digigov/form/Questions/Step/StepContext';
 import { useTranslation } from '@digigov/ui/i18n';
-import Paragraph, { ParagraphProps } from '@digigov/ui/typography/Paragraph';
+import type { ParagraphProps } from '@digigov/ui/typography/Paragraph';
+import Paragraph from '@digigov/ui/typography/Paragraph';
 
 export interface StepDescriptionInterface extends ParagraphProps {
   description?: string;

package/src/Questions/Step/StepForm.tsx

@@ -1,10 +1,10 @@
 import React, { useContext } from 'react';
 import Field from '@digigov/form/Field';
-import { FieldProps } from '@digigov/form/Field/types';
+import type { FieldProps } from '@digigov/form/Field/types';
 import Fieldset from '@digigov/form/Fieldset';
 import FormBuilder from '@digigov/form/FormBuilder';
 import { StepContext } from '@digigov/form/Questions/Step/StepContext';
-import { FormBuilderProps } from '@digigov/form/types';
+import type { FormBuilderProps } from '@digigov/form/types';
 import Button from '@digigov/ui/form/Button';
 import { useTranslation } from '@digigov/ui/i18n';
 

package/src/Questions/Step/StepQuote.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import Paragraph, { ParagraphProps } from '@digigov/ui/typography/Paragraph';
+import type { ParagraphProps } from '@digigov/ui/typography/Paragraph';
+import Paragraph from '@digigov/ui/typography/Paragraph';
 
 export const StepQuote: React.FC<ParagraphProps> = ({ children, ...props }) => {
   return <Paragraph {...props}>{children}</Paragraph>;

package/src/Questions/Step/StepTitle.tsx

@@ -6,7 +6,8 @@ import {
 } from '@digigov/ui/app/PageTitleContainer';
 import { useTranslation } from '@digigov/ui/i18n';
 import { BackLink } from '@digigov/ui/navigation/BackLink';
-import { Heading, HeadingProps } from '@digigov/ui/typography/Heading';
+import type { HeadingProps } from '@digigov/ui/typography/Heading';
+import { Heading } from '@digigov/ui/typography/Heading';
 import { HeadingCaption } from '@digigov/ui/typography/HeadingCaption';
 
 export interface StepTitleInterface {

package/src/Questions/Step/getAddMoreFields.tsx

@@ -1,5 +1,5 @@
-import { StepInterface } from '@digigov/form/Questions/Step/types';
-import { FieldSpec } from '@digigov/form/types';
+import type { StepInterface } from '@digigov/form/Questions/Step/types';
+import type { FieldSpec } from '@digigov/form/types';
 
 export const getAddMoreFields = (currentStep: StepInterface): FieldSpec[] => {
   return [

package/src/Questions/Step/types.tsx

@@ -1,4 +1,4 @@
-import { LabelProps } from '@digigov/form/inputs/Label';
+import type { LabelProps } from '@digigov/form/inputs/Label';
 
 export type StepType = 'object' | 'array';
 export type StepReviewAnswersType = 'positive' | 'negative';

package/src/Questions/getNextStep.tsx

@@ -1,4 +1,4 @@
-import { StepInterface } from '@digigov/form/Questions/Step/types';
+import type { StepInterface } from '@digigov/form/Questions/Step/types';
 
 export function getNextStep(
   currentStep: any,

package/src/Questions/types.tsx

@@ -1,4 +1,4 @@
-import { StepInterface } from '@digigov/form/Questions/Step/types';
+import type { StepInterface } from '@digigov/form/Questions/Step/types';
 
 export interface QuestionsInterface {
   name: string;