@nvs-dynamic-form/react-core 2.3.0 → 2.4.0

package/dist/esm/nvs-dynamic-form/components/arrayField/_template.js

@@ -1,39 +1,35 @@
 import * as lodash from "lodash";
 import { ArrayFieldAddButton, ArrayFieldRemoveButton, LabelOptions, } from "../../../types";
 import { FieldArray } from "formik";
-import React, { useState } from "react";
-import { GenerateFormContentUtils } from "../../services/generateFormContentUtils";
+import React, { useCallback, useState } from "react";
+import { Elements } from "../elements";
 import { List } from "../list/_template";
 export const ArrayField = ({ field: arrayField, formElements, containerComponent, containerVisible, useContainersOutsideGroup, useGroupContainer, buttonComponent: ButtonComponent, addButtonDefaultOptions, removeButtonDefaultOptions, labelDefaultOptions, }) => {
+    const createArrayItem = useCallback((index) => {
+        return lodash.cloneDeep(arrayField.fields).map((field) => {
+            field.id = `${arrayField.id}[${index}].${field.id}`;
+            return field;
+        });
+    }, [arrayField.fields]);
     const [addButtonOptions] = useState(new ArrayFieldAddButton(lodash.merge(addButtonDefaultOptions ?? {}, arrayField.addButtonOptions ?? {})));
     const [removeButtonOptions] = useState(new ArrayFieldRemoveButton(lodash.merge(removeButtonDefaultOptions ?? {}, arrayField.removeButtonOptions ?? {})));
     const [labelOptions] = useState(new LabelOptions(lodash.merge(labelDefaultOptions ?? {}, arrayField.labelOptions ?? {})));
-    const generateFormContentUtils = new GenerateFormContentUtils({
-        containerComponent,
-        formElements,
-        useContainersOutsideGroup,
-        useGroupContainer,
-        containerVisible: containerVisible,
-        fields: arrayField.fields,
-        fieldArrayAddButtonDefaultOptions: addButtonDefaultOptions,
-        fieldArrayRemoveButtonDefaultOptions: removeButtonDefaultOptions,
-    });
-    const createArrayItem = (name, index) => {
-        return arrayField.fields.map((field) => ({
-            ...field,
-            id: `${name}[${index}].${field.id}`,
-        }));
+    const ContentContainer = ({ children }) => {
+        return (React.createElement("div", { className: "nvs-container-fluid" },
+            React.createElement("div", { className: "nvs-row" }, children)));
     };
     const getDefaultItem = () => {
         return arrayField.fields.reduce((acc, field) => {
-            acc[field.id] = field.defaultValue;
+            if ("defaultValue" in field)
+                acc[field.id] = field.defaultValue;
             return acc;
         }, {});
     };
     const createArrayFields = (index) => {
         return (React.createElement("div", { className: "df-array-field-content" },
             React.createElement("div", { className: "nvs-container-fluid" },
-                React.createElement("div", { className: "nvs-row" }, generateFormContentUtils.createFormElements(createArrayItem(arrayField.id, index))))));
+                React.createElement("div", { className: "nvs-row" },
+                    React.createElement(Elements, { fields: createArrayItem(index), formElements: formElements, containerComponent: containerComponent, useContainersOutsideGroup: useContainersOutsideGroup, useGroupContainer: useGroupContainer, containerVisible: containerVisible, buttonComponent: ButtonComponent, fieldArrayAddButtonDefaultOptions: addButtonDefaultOptions, fieldArrayRemoveButtonDefaultOptions: removeButtonDefaultOptions, labelDefaultOptions: labelDefaultOptions })))));
     };
     const createRemoveButton = (onRemoveItem) => {
         return (React.createElement("div", { className: "nvs-col-12" },
@@ -42,7 +38,8 @@ export const ArrayField = ({ field: arrayField, formElements, containerComponent
                 }, type: "button", ...removeButtonOptions.options }, removeButtonOptions.label)));
     };
     const createArrayItemRemoveButton = (onRemoveItem) => {
-        return (React.createElement("div", { className: "df-array-field-remove-button" }, generateFormContentUtils.createContentContainer(createRemoveButton(onRemoveItem))));
+        return (React.createElement("div", { className: "df-array-field-remove-button" },
+            React.createElement(ContentContainer, null, createRemoveButton(onRemoveItem))));
     };
     const createFieldArrayContent = (onRemoveItem, index) => {
         return (React.createElement("div", { className: `df-array-field remove-button-${removeButtonOptions.position}`, key: index },
@@ -55,17 +52,18 @@ export const ArrayField = ({ field: arrayField, formElements, containerComponent
             React.createElement(ButtonComponent, { onClick: () => onAddItem(getDefaultItem()), type: "button", ...addButtonOptions.options }, addButtonOptions.label)));
     };
     const createArrayItemAddButton = (onAddItem) => {
-        return generateFormContentUtils.createContentContainer(createAddButton(onAddItem));
+        return React.createElement(ContentContainer, null, createAddButton(onAddItem));
     };
     const createArrayFieldLabel = () => {
-        return generateFormContentUtils.createContentContainer(React.createElement("div", { className: "nvs-col-12" },
-            React.createElement("label", { className: `df-array-field-label ${labelOptions.class}` }, arrayField.label)));
+        return (React.createElement(ContentContainer, null,
+            React.createElement("div", { className: "nvs-col-12" },
+                React.createElement("label", { className: `df-array-field-label ${labelOptions.class}` }, arrayField.label))));
     };
     const checkFieldArrayMaxSize = (length) => {
         const maxSize = arrayField
             .validate.describe()
             .tests.find((test) => test.name === "max")?.params.max;
-        return maxSize && length < maxSize;
+        return !(maxSize && length == maxSize);
     };
     const getArrayFieldErrorMessage = (form) => {
         let error = form.errors[arrayField.id];
@@ -81,9 +79,10 @@ export const ArrayField = ({ field: arrayField, formElements, containerComponent
     };
     return (React.createElement(FieldArray, { name: arrayField.id }, ({ push, remove, form }) => (React.createElement(React.Fragment, null,
         arrayField.label && createArrayFieldLabel(),
-        form.values[arrayField.id]?.map((_, index) => createFieldArrayContent(remove, index)),
-        checkFieldArrayMaxSize(form.values[arrayField.id].length) &&
-            createArrayItemAddButton(push),
+        lodash
+            .get(form.values, arrayField.id)
+            ?.map((_, index) => createFieldArrayContent(remove, index)),
+        checkFieldArrayMaxSize(lodash.get(form.values, arrayField.id)?.length) && createArrayItemAddButton(push),
         createErrorList(form)))));
 };
 //# sourceMappingURL=_template.js.map

package/dist/esm/nvs-dynamic-form/components/arrayField/_template.js.map

@@ -1 +1 @@
-{"version":3,"file":"_template.js","sourceRoot":"","sources":["../../../../../lib/nvs-dynamic-form/components/arrayField/_template.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"_template.js","sourceRoot":"","sources":["../../../../../lib/nvs-dynamic-form/components/arrayField/_template.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,MAAM,QAAQ,CAAC;AAEjC,OAAO,EACL,mBAAmB,EACnB,sBAAsB,EACtB,YAAY,GACb,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,UAAU,EAAe,MAAM,QAAQ,CAAC;AACjD,OAAO,KAAK,EAAE,EAAa,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAEzC,MAAM,CAAC,MAAM,UAAU,GAA0B,CAAC,EAChD,KAAK,EAAE,UAAU,EACjB,YAAY,EACZ,kBAAkB,EAClB,gBAAgB,EAChB,yBAAyB,EACzB,iBAAiB,EACjB,eAAe,EAAE,eAAe,EAChC,uBAAuB,EACvB,0BAA0B,EAC1B,mBAAmB,GACP,EAAE,EAAE;IAChB,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,KAAa,EAAE,EAAE;QAChB,OAAO,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;YACvD,KAAK,CAAC,EAAE,GAAG,GAAG,UAAU,CAAC,EAAE,IAAI,KAAK,KAAK,KAAK,CAAC,EAAE,EAAE,CAAC;YACpD,OAAO,KAAK,CAAC;QACf,CAAC,CAAC,CAAC;IACL,CAAC,EACD,CAAC,UAAU,CAAC,MAAM,CAAC,CACpB,CAAC;IAEF,MAAM,CAAC,gBAAgB,CAAC,GAAG,QAAQ,CACjC,IAAI,mBAAmB,CACrB,MAAM,CAAC,KAAK,CACV,uBAAuB,IAAI,EAAE,EAC7B,UAAU,CAAC,gBAAgB,IAAI,EAAE,CAClC,CACF,CACF,CAAC;IACF,MAAM,CAAC,mBAAmB,CAAC,GAAG,QAAQ,CACpC,IAAI,sBAAsB,CACxB,MAAM,CAAC,KAAK,CACV,0BAA0B,IAAI,EAAE,EAChC,UAAU,CAAC,mBAAmB,IAAI,EAAE,CACrC,CACF,CACF,CAAC;IACF,MAAM,CAAC,YAAY,CAAC,GAAG,QAAQ,CAC7B,IAAI,YAAY,CACd,MAAM,CAAC,KAAK,CAAC,mBAAmB,IAAI,EAAE,EAAE,UAAU,CAAC,YAAY,IAAI,EAAE,CAAC,CACvE,CACF,CAAC;IAEF,MAAM,gBAAgB,GAAG,CAAC,EAAE,QAAQ,EAA2B,EAAE,EAAE;QACjE,OAAO,CACL,6BAAK,SAAS,EAAC,qBAAqB;YAClC,6BAAK,SAAS,EAAC,SAAS,IAAE,QAAQ,CAAO,CACrC,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,OAAO,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,GAA2B,EAAE,KAAK,EAAE,EAAE;YACrE,IAAI,cAAc,IAAI,KAAK;gBAAE,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC;YAChE,OAAO,GAAG,CAAC;QACb,CAAC,EAAE,EAAE,CAAC,CAAC;IACT,CAAC,CAAC;IAEF,MAAM,iBAAiB,GAAG,CAAC,KAAa,EAAE,EAAE;QAC1C,OAAO,CACL,6BAAK,SAAS,EAAC,wBAAwB;YACrC,6BAAK,SAAS,EAAC,qBAAqB;gBAClC,6BAAK,SAAS,EAAC,SAAS;oBACtB,oBAAC,QAAQ,IACP,MAAM,EAAE,eAAe,CAAC,KAAK,CAAC,EAC9B,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,kBAAkB,EACtC,yBAAyB,EAAE,yBAAyB,EACpD,iBAAiB,EAAE,iBAAiB,EACpC,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,eAAe,EAChC,iCAAiC,EAAE,uBAAuB,EAC1D,oCAAoC,EAAE,0BAA0B,EAChE,mBAAmB,EAAE,mBAAmB,GACxC,CACE,CACF,CACF,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,YAAsB,EAAE,EAAE;QACpD,OAAO,CACL,6BAAK,SAAS,EAAC,YAAY;YACzB,oBAAC,eAAe,IACd,OAAO,EAAE,GAAG,EAAE;oBACZ,YAAY,EAAE,CAAC;gBACjB,CAAC,EACD,IAAI,EAAC,QAAQ,KACT,mBAAmB,CAAC,OAAO,IAE9B,mBAAmB,CAAC,KAAK,CACV,CACd,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,2BAA2B,GAAG,CAAC,YAAsB,EAAE,EAAE;QAC7D,OAAO,CACL,6BAAK,SAAS,EAAC,8BAA8B;YAC3C,oBAAC,gBAAgB,QAAE,kBAAkB,CAAC,YAAY,CAAC,CAAoB,CACnE,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,CAAC,YAAsB,EAAE,KAAa,EAAE,EAAE;QACxE,OAAO,CACL,6BACE,SAAS,EAAE,gCAAgC,mBAAmB,CAAC,QAAQ,EAAE,EACzE,GAAG,EAAE,KAAK;YAET,iBAAiB,CAAC,KAAK,CAAC;YACxB,mBAAmB,CAAC,OAAO;gBAC1B,2BAA2B,CAAC,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CACpD,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,SAAmB,EAAE,EAAE;QAC9C,OAAO,CACL,6BAAK,SAAS,EAAC,2BAA2B;YACxC,oBAAC,eAAe,IACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,cAAc,EAAE,CAAC,EAC1C,IAAI,EAAC,QAAQ,KACT,gBAAgB,CAAC,OAAO,IAE3B,gBAAgB,CAAC,KAAK,CACP,CACd,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,wBAAwB,GAAG,CAAC,SAAmB,EAAE,EAAE;QACvD,OAAO,oBAAC,gBAAgB,QAAE,eAAe,CAAC,SAAS,CAAC,CAAoB,CAAC;IAC3E,CAAC,CAAC;IAEF,MAAM,qBAAqB,GAAG,GAAG,EAAE;QACjC,OAAO,CACL,oBAAC,gBAAgB;YACf,6BAAK,SAAS,EAAC,YAAY;gBACzB,+BAAO,SAAS,EAAE,wBAAwB,YAAY,CAAC,KAAK,EAAE,IAC3D,UAAU,CAAC,KAAK,CACX,CACJ,CACW,CACpB,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,sBAAsB,GAAG,CAAC,MAAc,EAAE,EAAE;QAChD,MAAM,OAAO,GAAG,UAAU;aACvB,QAAS,CAAC,QAAQ,EAAE;aACpB,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,KAAK,KAAK,CAAC,EAAE,MAAO,CAAC,GAAa,CAAC;QAEpE,OAAO,CAAC,CAAC,OAAO,IAAI,MAAM,IAAI,OAAO,CAAC,CAAC;IACzC,CAAC,CAAC;IAEF,MAAM,yBAAyB,GAAG,CAChC,IAAsB,EACF,EAAE;QACtB,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;QACvC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;YAAE,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;QAC/C,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC;YAAE,KAAK,GAAG,SAAS,CAAC;QAC/C,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,IAAsB,EAAE,EAAE;QACjD,MAAM,KAAK,GAAG,yBAAyB,CAAC,IAAI,CAAC,CAAC;QAC9C,OAAO,KAAK,IAAI,oBAAC,IAAI,IAAC,KAAK,EAAE,CAAC,KAAK,CAAC,GAAI,CAAC;IAC3C,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,UAAU,IAAC,IAAI,EAAE,UAAU,CAAC,EAAE,IAC5B,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAC3B;QACG,UAAU,CAAC,KAAK,IAAI,qBAAqB,EAAE;QAC3C,MAAM;aACJ,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,UAAU,CAAC,EAAE,CAAC;YAChC,EAAE,GAAG,CAAC,CAAC,CAAM,EAAE,KAAa,EAAE,EAAE,CAC9B,uBAAuB,CAAC,MAAM,EAAE,KAAK,CAAC,CACvC;QACF,sBAAsB,CACrB,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,UAAU,CAAC,EAAE,CAAC,EAAE,MAAM,CAC/C,IAAI,wBAAwB,CAAC,IAAI,CAAC;QAClC,eAAe,CAAC,IAAI,CAAC,CACrB,CACJ,CACU,CACd,CAAC;AACJ,CAAC,CAAC"}

package/dist/esm/nvs-dynamic-form/components/elements/_template.d.ts

@@ -0,0 +1,16 @@
+import { ArrayFieldAddButton, LabelOptions } from "../../../types";
+import { IFormElement } from "../field";
+import React from "react";
+import { FieldType } from "../../_type";
+export declare const Elements: ({ fields, formElements, containerComponent, useContainersOutsideGroup, useGroupContainer, containerVisible, buttonComponent, fieldArrayAddButtonDefaultOptions, fieldArrayRemoveButtonDefaultOptions, labelDefaultOptions, }: {
+    fields: Array<FieldType>;
+    formElements: IFormElement;
+    containerComponent: React.FC<any>;
+    useContainersOutsideGroup: boolean;
+    useGroupContainer: boolean;
+    containerVisible: boolean;
+    buttonComponent?: React.FC<any>;
+    fieldArrayAddButtonDefaultOptions?: ArrayFieldAddButton;
+    fieldArrayRemoveButtonDefaultOptions?: ArrayFieldAddButton;
+    labelDefaultOptions?: LabelOptions;
+}) => React.JSX.Element | JSX.Element[];

package/dist/esm/nvs-dynamic-form/components/elements/_template.js

@@ -0,0 +1,35 @@
+import { ArrayField, GroupField, } from "../../../types";
+import { Field } from "../field";
+import React, { useEffect, useState } from "react";
+import { ArrayField as ArrayFieldElement } from "../arrayField";
+import { GroupField as GroupFieldElement } from "../groupField";
+export const Elements = ({ fields, formElements, containerComponent, useContainersOutsideGroup, useGroupContainer, containerVisible, buttonComponent, fieldArrayAddButtonDefaultOptions = {}, fieldArrayRemoveButtonDefaultOptions = {}, labelDefaultOptions = {}, }) => {
+    const [fieldsElements, setFieldsElements] = useState([]);
+    const createFormElements = () => {
+        const fieldsElements = [];
+        for (const field of fields) {
+            if (field instanceof GroupField)
+                fieldsElements.push(createGroupFieldElement(field));
+            else if (field instanceof ArrayField)
+                fieldsElements.push(createArrayFieldElement(field));
+            else
+                fieldsElements.push(createSingleFieldElement(field));
+        }
+        return fieldsElements;
+    };
+    const createSingleFieldElement = (field) => {
+        return React.createElement(Field, { key: field.id, formElements: formElements, field: field });
+    };
+    const createGroupFieldElement = (field) => {
+        return (React.createElement(GroupFieldElement, { key: field.id, formElements: formElements, field: field, containerComponent: containerComponent, useContainersOutsideGroup: useContainersOutsideGroup, useGroupContainer: useGroupContainer, containerVisible: containerVisible, buttonComponent: buttonComponent }));
+    };
+    const createArrayFieldElement = (field) => {
+        return (React.createElement(ArrayFieldElement, { key: field.id, formElements: formElements, field: field, containerComponent: containerComponent, useContainersOutsideGroup: useContainersOutsideGroup, useGroupContainer: useGroupContainer, containerVisible: containerVisible, buttonComponent: buttonComponent, addButtonDefaultOptions: fieldArrayAddButtonDefaultOptions, removeButtonDefaultOptions: fieldArrayRemoveButtonDefaultOptions, labelDefaultOptions: labelDefaultOptions }));
+    };
+    useEffect(() => {
+        if (fields.length > 0)
+            setFieldsElements(createFormElements());
+    }, [fields]);
+    return fieldsElements.length > 0 ? fieldsElements : React.createElement(React.Fragment, null);
+};
+//# sourceMappingURL=_template.js.map

package/dist/esm/nvs-dynamic-form/components/elements/_template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"_template.js","sourceRoot":"","sources":["../../../../../lib/nvs-dynamic-form/components/elements/_template.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EAEV,UAAU,GAEX,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,KAAK,EAAgB,MAAM,UAAU,CAAC;AAC/C,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,UAAU,IAAI,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAGhE,OAAO,EAAE,UAAU,IAAI,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAEhE,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EACvB,MAAM,EACN,YAAY,EACZ,kBAAkB,EAClB,yBAAyB,EACzB,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,EACf,iCAAiC,GAAG,EAAE,EACtC,oCAAoC,GAAG,EAAE,EACzC,mBAAmB,GAAG,EAAE,GAYzB,EAAE,EAAE;IACH,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAgB,EAAE,CAAC,CAAC;IAExE,MAAM,kBAAkB,GAAG,GAAkB,EAAE;QAC7C,MAAM,cAAc,GAAG,EAAE,CAAC;QAC1B,KAAK,MAAM,KAAK,IAAI,MAAM,EAAE,CAAC;YAC3B,IAAI,KAAK,YAAY,UAAU;gBAC7B,cAAc,CAAC,IAAI,CAAC,uBAAuB,CAAC,KAAK,CAAC,CAAC,CAAC;iBACjD,IAAI,KAAK,YAAY,UAAU;gBAClC,cAAc,CAAC,IAAI,CAAC,uBAAuB,CAAC,KAAK,CAAC,CAAC,CAAC;;gBACjD,cAAc,CAAC,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,CAAC;QAC5D,CAAC;QACD,OAAO,cAAc,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,wBAAwB,GAAG,CAAC,KAAyB,EAAE,EAAE;QAC7D,OAAO,oBAAC,KAAK,IAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,YAAY,EAAE,YAAY,EAAE,KAAK,EAAE,KAAK,GAAI,CAAC;IAC5E,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,CAAC,KAAiB,EAAE,EAAE;QACpD,OAAO,CACL,oBAAC,iBAAiB,IAChB,GAAG,EAAE,KAAK,CAAC,EAAE,EACb,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,KAAK,EACZ,kBAAkB,EAAE,kBAAkB,EACtC,yBAAyB,EAAE,yBAAyB,EACpD,iBAAiB,EAAE,iBAAiB,EACpC,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,eAAgB,GACjC,CACH,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,CAAC,KAAiB,EAAE,EAAE;QACpD,OAAO,CACL,oBAAC,iBAAiB,IAChB,GAAG,EAAE,KAAK,CAAC,EAAE,EACb,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,KAAK,EACZ,kBAAkB,EAAE,kBAAkB,EACtC,yBAAyB,EAAE,yBAAyB,EACpD,iBAAiB,EAAE,iBAAiB,EACpC,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,eAAgB,EACjC,uBAAuB,EAAE,iCAAiC,EAC1D,0BAA0B,EAAE,oCAAoC,EAChE,mBAAmB,EAAE,mBAAmB,GACxC,CACH,CAAC;IACJ,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC;YAAE,iBAAiB,CAAC,kBAAkB,EAAE,CAAC,CAAC;IACjE,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,OAAO,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,yCAAK,CAAC;AAC5D,CAAC,CAAC"}

package/dist/esm/nvs-dynamic-form/components/elements/index.d.ts

@@ -0,0 +1 @@
+export * from "./_template";

package/dist/esm/nvs-dynamic-form/components/elements/index.js

@@ -0,0 +1,2 @@
+export * from "./_template";
+//# sourceMappingURL=index.js.map

package/dist/esm/nvs-dynamic-form/components/elements/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../lib/nvs-dynamic-form/components/elements/index.tsx"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}

package/dist/esm/nvs-dynamic-form/components/formBuilder/_template.d.ts

@@ -0,0 +1,20 @@
+import React from "react";
+import { LabelOptions } from "../../../types";
+import { IFormElement } from "../field";
+import { FieldType } from "../../_type";
+import { ArrayFieldAddButton } from "../../../types";
+export declare const FormBuilder: ({ containerComponent, formElements, useContainersOutsideGroup, useGroupContainer, containerVisible, fields, containerOptions, buttonComponent, fieldArrayAddButtonDefaultOptions, fieldArrayRemoveButtonDefaultOptions, labelDefaultOptions, }: {
+    containerComponent: React.FC<any>;
+    formElements: IFormElement;
+    useContainersOutsideGroup: boolean;
+    useGroupContainer: boolean;
+    containerVisible: boolean;
+    fields: Array<FieldType>;
+    buttonComponent?: React.FC<any>;
+    containerOptions?: {
+        [key: string]: any;
+    };
+    fieldArrayAddButtonDefaultOptions?: ArrayFieldAddButton;
+    fieldArrayRemoveButtonDefaultOptions?: ArrayFieldAddButton;
+    labelDefaultOptions?: LabelOptions;
+}) => React.JSX.Element;

package/dist/esm/nvs-dynamic-form/components/formBuilder/_template.js

@@ -0,0 +1,57 @@
+import React, { useEffect, useState } from "react";
+import { ArrayField, GroupField } from "../../../types";
+import { Container } from "../container";
+import { Elements } from "../elements";
+export const FormBuilder = ({ containerComponent, formElements, useContainersOutsideGroup, useGroupContainer, containerVisible, fields, containerOptions = {}, buttonComponent, fieldArrayAddButtonDefaultOptions, fieldArrayRemoveButtonDefaultOptions, labelDefaultOptions, }) => {
+    const [formContent, setFormContent] = useState();
+    const createFormContent = () => {
+        const singleFields = createSingleFieldsElements();
+        const groupFields = createGroupFieldsElements();
+        let formContent;
+        if (containerVisible && useContainersOutsideGroup && singleFields)
+            formContent = (React.createElement(React.Fragment, null,
+                createContainer(singleFields, containerOptions),
+                groupFields));
+        else
+            formContent = createFormGroup(React.createElement(React.Fragment, null,
+                singleFields,
+                groupFields));
+        return formContent;
+    };
+    const createContentContainer = (formElements) => {
+        return (React.createElement("div", { className: "nvs-container-fluid" },
+            React.createElement("div", { className: "nvs-row" }, formElements)));
+    };
+    const createSingleFieldsElements = () => {
+        const singleFields = getSingleFields();
+        return (singleFields.length > 0 &&
+            createContentContainer(React.createElement(Elements, { fields: singleFields, formElements: formElements, containerComponent: containerComponent, useContainersOutsideGroup: useContainersOutsideGroup, useGroupContainer: useGroupContainer, containerVisible: containerVisible, buttonComponent: buttonComponent, fieldArrayAddButtonDefaultOptions: fieldArrayAddButtonDefaultOptions, fieldArrayRemoveButtonDefaultOptions: fieldArrayRemoveButtonDefaultOptions, labelDefaultOptions: labelDefaultOptions })));
+    };
+    const createGroupFieldsElements = () => {
+        const groupFields = getGroupFields();
+        return (groupFields.length > 0 && (React.createElement(Elements, { fields: groupFields, formElements: formElements, containerComponent: containerComponent, useContainersOutsideGroup: useContainersOutsideGroup, useGroupContainer: useGroupContainer, containerVisible: containerVisible, buttonComponent: buttonComponent, fieldArrayAddButtonDefaultOptions: fieldArrayAddButtonDefaultOptions, fieldArrayRemoveButtonDefaultOptions: fieldArrayRemoveButtonDefaultOptions, labelDefaultOptions: labelDefaultOptions })));
+    };
+    const isSingleField = (field) => {
+        return !((field instanceof GroupField || field instanceof ArrayField) &&
+            field.containerVisible &&
+            useGroupContainer &&
+            containerVisible);
+    };
+    const getSingleFields = () => {
+        return fields.filter((field) => isSingleField(field));
+    };
+    const getGroupFields = () => {
+        return fields.filter((field) => !isSingleField(field));
+    };
+    const createContainer = (content, containerProps) => {
+        return (React.createElement(Container, { containerComponent: containerComponent, options: containerProps }, content));
+    };
+    const createFormGroup = (formContent) => {
+        return React.createElement("div", { className: "df-form-group" }, formContent);
+    };
+    useEffect(() => {
+        setFormContent(createFormContent());
+    }, [fields]);
+    return React.createElement(React.Fragment, null, formContent);
+};
+//# sourceMappingURL=_template.js.map

package/dist/esm/nvs-dynamic-form/components/formBuilder/_template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"_template.js","sourceRoot":"","sources":["../../../../../lib/nvs-dynamic-form/components/formBuilder/_template.tsx"],"names":[],"mappings":"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"}

package/dist/esm/nvs-dynamic-form/components/formBuilder/index.d.ts

@@ -0,0 +1 @@
+export * from "./_template";

package/dist/esm/nvs-dynamic-form/components/formBuilder/index.js

@@ -0,0 +1,2 @@
+export * from "./_template";
+//# sourceMappingURL=index.js.map

package/dist/esm/nvs-dynamic-form/components/formBuilder/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../lib/nvs-dynamic-form/components/formBuilder/index.tsx"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}

package/dist/esm/nvs-dynamic-form/components/groupField/_template.d.ts

@@ -1,2 +1,3 @@
+import React from "react";
 import { IGroupField } from "./_type";
-export declare const GroupField: ({ field: groupField, formElements, containerComponent, containerVisible, useContainersOutsideGroup, useGroupContainer, }: IGroupField) => import("react").JSX.Element | JSX.Element[];
+export declare const GroupField: ({ field: groupField, formElements, containerComponent, containerVisible, useContainersOutsideGroup, useGroupContainer, buttonComponent, }: IGroupField) => React.JSX.Element;

package/dist/esm/nvs-dynamic-form/components/groupField/_template.js

@@ -1,22 +1,15 @@
-import { GenerateFormContentUtils } from "../../services/generateFormContentUtils";
-export const GroupField = ({ field: groupField, formElements, containerComponent, containerVisible, useContainersOutsideGroup, useGroupContainer, }) => {
-    const generateFormContentUtils = new GenerateFormContentUtils({
-        containerComponent,
-        formElements,
-        useContainersOutsideGroup,
-        useGroupContainer,
-        containerOptions: groupField.containerOptions,
-        containerVisible: containerVisible && groupField.containerVisible,
-        fields: groupField.fields.map((field) => {
-            field.id = `${groupField.id}.${field.id}`;
-            return field;
-        }),
-    });
+import React, { useState } from "react";
+import { Elements } from "../elements";
+import { FormBuilder } from "../formBuilder";
+export const GroupField = ({ field: groupField, formElements, containerComponent, containerVisible, useContainersOutsideGroup, useGroupContainer, buttonComponent, }) => {
+    const [fields, _] = useState(groupField.fields.map((field) => {
+        field.id = `${groupField.id}.${field.id}`;
+        return field;
+    }));
     const isContainerVisible = () => {
         return groupField.containerVisible && useGroupContainer && containerVisible;
     };
-    return isContainerVisible()
-        ? generateFormContentUtils.createFormContent()
-        : generateFormContentUtils.createFormElements(groupField.fields);
+    return (fields &&
+        (isContainerVisible() ? (React.createElement(FormBuilder, { containerComponent: containerComponent, formElements: formElements, useContainersOutsideGroup: useContainersOutsideGroup, useGroupContainer: useGroupContainer, containerOptions: groupField.containerOptions, containerVisible: containerVisible, fields: fields, buttonComponent: buttonComponent })) : (React.createElement(Elements, { fields: fields, containerComponent: containerComponent, formElements: formElements, useContainersOutsideGroup: useContainersOutsideGroup, useGroupContainer: useGroupContainer, containerVisible: containerVisible, buttonComponent: buttonComponent }))));
 };
 //# sourceMappingURL=_template.js.map

package/dist/esm/nvs-dynamic-form/components/groupField/_template.js.map

@@ -1 +1 @@
-{"version":3,"file":"_template.js","sourceRoot":"","sources":["../../../../../lib/nvs-dynamic-form/components/groupField/_template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,yCAAyC,CAAC;AAGnF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,KAAK,EAAE,UAAU,EACjB,YAAY,EACZ,kBAAkB,EAClB,gBAAgB,EAChB,yBAAyB,EACzB,iBAAiB,GACL,EAAE,EAAE;IAChB,MAAM,wBAAwB,GAAG,IAAI,wBAAwB,CAAC;QAC5D,kBAAkB;QAClB,YAAY;QACZ,yBAAyB;QACzB,iBAAiB;QACjB,gBAAgB,EAAE,UAAU,CAAC,gBAAgB;QAC7C,gBAAgB,EAAE,gBAAgB,IAAI,UAAU,CAAC,gBAAiB;QAClE,MAAM,EAAE,UAAU,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;YACtC,KAAK,CAAC,EAAE,GAAG,GAAG,UAAU,CAAC,EAAE,IAAI,KAAK,CAAC,EAAE,EAAE,CAAC;YAC1C,OAAO,KAAK,CAAC;QACf,CAAC,CAAC;KACH,CAAC,CAAC;IAEH,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,OAAO,UAAU,CAAC,gBAAgB,IAAI,iBAAiB,IAAI,gBAAgB,CAAC;IAC9E,CAAC,CAAC;IAEF,OAAO,kBAAkB,EAAE;QACzB,CAAC,CAAC,wBAAwB,CAAC,iBAAiB,EAAE;QAC9C,CAAC,CAAC,wBAAwB,CAAC,kBAAkB,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;AACrE,CAAC,CAAC"}
+{"version":3,"file":"_template.js","sourceRoot":"","sources":["../../../../../lib/nvs-dynamic-form/components/groupField/_template.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAG7C,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,KAAK,EAAE,UAAU,EACjB,YAAY,EACZ,kBAAkB,EAClB,gBAAgB,EAChB,yBAAyB,EACzB,iBAAiB,EACjB,eAAe,GACH,EAAE,EAAE;IAChB,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC,GAAG,QAAQ,CAC1B,UAAU,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;QAC9B,KAAK,CAAC,EAAE,GAAG,GAAG,UAAU,CAAC,EAAE,IAAI,KAAK,CAAC,EAAE,EAAE,CAAC;QAC1C,OAAO,KAAK,CAAC;IACf,CAAC,CAAC,CACH,CAAC;IAEF,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,OAAO,UAAU,CAAC,gBAAgB,IAAI,iBAAiB,IAAI,gBAAgB,CAAC;IAC9E,CAAC,CAAC;IAEF,OAAO,CACL,MAAM;QACN,CAAC,kBAAkB,EAAE,CAAC,CAAC,CAAC,CACtB,oBAAC,WAAW,IACV,kBAAkB,EAAE,kBAAkB,EACtC,YAAY,EAAE,YAAY,EAC1B,yBAAyB,EAAE,yBAAyB,EACpD,iBAAiB,EAAE,iBAAiB,EACpC,gBAAgB,EAAE,UAAU,CAAC,gBAAgB,EAC7C,gBAAgB,EAAE,gBAAgB,EAClC,MAAM,EAAE,MAAM,EACd,eAAe,EAAE,eAAe,GAChC,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,QAAQ,IACP,MAAM,EAAE,MAAM,EACd,kBAAkB,EAAE,kBAAkB,EACtC,YAAY,EAAE,YAAY,EAC1B,yBAAyB,EAAE,yBAAyB,EACpD,iBAAiB,EAAE,iBAAiB,EACpC,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,eAAe,GAChC,CACH,CAAC,CACH,CAAC;AACJ,CAAC,CAAC"}

package/dist/esm/nvs-dynamic-form/components/groupField/_type.d.ts

@@ -6,4 +6,5 @@ export interface IGroupField extends IField {
     containerVisible: boolean;
     useContainersOutsideGroup: boolean;
     useGroupContainer: boolean;
+    buttonComponent?: React.FC<any>;
 }

package/dist/esm/types/array-field.type.d.ts

@@ -1,18 +1,20 @@
 import * as Yup from "yup";
 import { ArrayFieldAddButton, ArrayFieldRemoveButton } from "./array-field-action-button.type";
-import { FieldBase } from "./field-base.type";
+import { FieldType } from "../nvs-dynamic-form";
 import { LabelOptions } from "./label-options.type";
 export declare class ArrayField<ValueType = {
     [key: string]: any;
 }> {
     fieldType?: string;
     id: string;
-    fields: Array<FieldBase<any>>;
+    fields: Array<FieldType>;
     addButtonOptions?: ArrayFieldAddButton;
     removeButtonOptions?: ArrayFieldRemoveButton;
     defaultValues?: Array<ValueType>;
     label?: string;
     labelOptions?: LabelOptions;
     validate?: Yup.ArraySchema<any, any>;
+    containerVisible?: boolean;
+    containerOptions?: Record<string, any>;
     constructor(options: ArrayField<ValueType>);
 }

package/dist/esm/types/array-field.type.js

@@ -10,6 +10,8 @@ export class ArrayField {
         this.label = options.label;
         this.labelOptions = options.labelOptions ?? {};
         this.validate = options.validate ?? Yup.array();
+        this.containerVisible = options.containerVisible ?? false;
+        this.containerOptions = options.containerOptions ?? {};
     }
 }
 //# sourceMappingURL=array-field.type.js.map

package/dist/esm/types/array-field.type.js.map

@@ -1 +1 @@
-{"version":3,"file":"array-field.type.js","sourceRoot":"","sources":["../../../lib/types/array-field.type.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,GAAG,MAAM,KAAK,CAAC;AAU3B,MAAM,OAAO,UAAU;IAWrB,YAAY,OAA8B;QAV1C,cAAS,GAAY,YAAY,CAAC;QAWhC,IAAI,CAAC,EAAE,GAAG,OAAO,CAAC,EAAE,CAAC;QACrB,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC,MAAM,IAAI,EAAE,CAAC;QACnC,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC,gBAAgB,IAAI,EAAE,CAAC;QACvD,IAAI,CAAC,mBAAmB,GAAG,OAAO,CAAC,mBAAmB,IAAI,EAAE,CAAC;QAC7D,IAAI,CAAC,aAAa,GAAG,OAAO,CAAC,aAAa,IAAI,EAAE,CAAC;QACjD,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC;QAC3B,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,IAAI,EAAE,CAAC;QAC/C,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC,QAAQ,IAAI,GAAG,CAAC,KAAK,EAAE,CAAC;IAClD,CAAC;CACF"}
+{"version":3,"file":"array-field.type.js","sourceRoot":"","sources":["../../../lib/types/array-field.type.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,GAAG,MAAM,KAAK,CAAC;AAU3B,MAAM,OAAO,UAAU;IAarB,YAAY,OAA8B;QAZ1C,cAAS,GAAY,YAAY,CAAC;QAahC,IAAI,CAAC,EAAE,GAAG,OAAO,CAAC,EAAE,CAAC;QACrB,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC,MAAM,IAAI,EAAE,CAAC;QACnC,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC,gBAAgB,IAAI,EAAE,CAAC;QACvD,IAAI,CAAC,mBAAmB,GAAG,OAAO,CAAC,mBAAmB,IAAI,EAAE,CAAC;QAC7D,IAAI,CAAC,aAAa,GAAG,OAAO,CAAC,aAAa,IAAI,EAAE,CAAC;QACjD,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC;QAC3B,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,IAAI,EAAE,CAAC;QAC/C,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC,QAAQ,IAAI,GAAG,CAAC,KAAK,EAAE,CAAC;QAChD,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC,gBAAgB,IAAI,KAAK,CAAC;QAC1D,IAAI,CAAC,gBAAgB,GAAG,OAAO,CAAC,gBAAgB,IAAI,EAAE,CAAC;IACzD,CAAC;CACF"}

package/dist/esm/types/group-field.type.d.ts

@@ -1,10 +1,8 @@
-import { FieldBase } from "./field-base.type";
+import { FieldType } from "../nvs-dynamic-form";
 export declare class GroupField {
     id: string;
-    fields: Array<FieldBase<unknown>>;
+    fields: Array<FieldType>;
     containerVisible?: boolean;
-    containerOptions?: {
-        [key: string]: any;
-    };
+    containerOptions?: Record<string, any>;
     constructor(options: GroupField);
 }

package/lib/nvs-dynamic-form/_template.tsx

@@ -3,9 +3,10 @@ import "./_style.css";
 
 import { Button } from "./components/button";
 import { FormikForm } from "./formikForm";
-import { GenerateFormContentUtils } from "./services/generateFormContentUtils";
 import { INvsDynamicForm } from "./_type";
 import React from "react";
+import { FormBuilder } from "./components/formBuilder";
+import { Container } from "./components/container";
 
 export const NvsDynamicForm = ({
   onSubmit,
@@ -27,22 +28,20 @@ export const NvsDynamicForm = ({
   addButtonDefaultOptions,
   removeButtonDefaultOptions,
 }: INvsDynamicForm) => {
-  const generateFormContentUtils = new GenerateFormContentUtils({
-    containerComponent: container,
-    formElements,
-    useContainersOutsideGroup,
-    useGroupContainer,
-    containerVisible,
-    fields,
-    containerOptions,
-    buttonComponent,
-    fieldArrayAddButtonDefaultOptions: addButtonDefaultOptions,
-    fieldArrayRemoveButtonDefaultOptions: removeButtonDefaultOptions,
-  });
-
   const formikForm = (
     <FormikForm onSubmit={onSubmit} fields={fields} formClass={formClass}>
-      {generateFormContentUtils.createFormContent()}
+      <FormBuilder
+        containerComponent={container}
+        formElements={formElements}
+        useContainersOutsideGroup={useContainersOutsideGroup}
+        useGroupContainer={useGroupContainer}
+        containerVisible={containerVisible}
+        fields={fields}
+        buttonComponent={buttonComponent}
+        containerOptions={containerOptions}
+        fieldArrayAddButtonDefaultOptions={addButtonDefaultOptions}
+        fieldArrayRemoveButtonDefaultOptions={removeButtonDefaultOptions}
+      />
       <Button
         buttonComponent={buttonComponent}
         visible={submitButtonVisible}
@@ -54,7 +53,11 @@ export const NvsDynamicForm = ({
     </FormikForm>
   );
 
-  return containerVisible && !useContainersOutsideGroup
-    ? generateFormContentUtils.createContainer(formikForm, containerOptions)
-    : formikForm;
+  return containerVisible && !useContainersOutsideGroup ? (
+    <Container containerComponent={container} options={containerOptions}>
+      {formikForm}
+    </Container>
+  ) : (
+    formikForm
+  );
 };

package/lib/nvs-dynamic-form/components/arrayField/_template.tsx

@@ -6,9 +6,9 @@ import {
   LabelOptions,
 } from "../../../types";
 import { FieldArray, FormikProps } from "formik";
-import React, { useState } from "react";
+import React, { ReactNode, useCallback, useState } from "react";
 
-import { GenerateFormContentUtils } from "../../services/generateFormContentUtils";
+import { Elements } from "../elements";
 import { IArrayField } from "./_type";
 import { List } from "../list/_template";
 
@@ -24,6 +24,16 @@ export const ArrayField: React.FC<IArrayField> = ({
   removeButtonDefaultOptions,
   labelDefaultOptions,
 }: IArrayField) => {
+  const createArrayItem = useCallback(
+    (index: number) => {
+      return lodash.cloneDeep(arrayField.fields).map((field) => {
+        field.id = `${arrayField.id}[${index}].${field.id}`;
+        return field;
+      });
+    },
+    [arrayField.fields],
+  );
+
   const [addButtonOptions] = useState(
     new ArrayFieldAddButton(
       lodash.merge(
@@ -45,27 +55,18 @@ export const ArrayField: React.FC<IArrayField> = ({
       lodash.merge(labelDefaultOptions ?? {}, arrayField.labelOptions ?? {}),
     ),
   );
-  const generateFormContentUtils = new GenerateFormContentUtils({
-    containerComponent,
-    formElements,
-    useContainersOutsideGroup,
-    useGroupContainer,
-    containerVisible: containerVisible,
-    fields: arrayField.fields,
-    fieldArrayAddButtonDefaultOptions: addButtonDefaultOptions,
-    fieldArrayRemoveButtonDefaultOptions: removeButtonDefaultOptions,
-  });
-
-  const createArrayItem = (name: string, index: number) => {
-    return arrayField.fields.map((field) => ({
-      ...field,
-      id: `${name}[${index}].${field.id}`,
-    }));
+
+  const ContentContainer = ({ children }: { children: ReactNode }) => {
+    return (
+      <div className="nvs-container-fluid">
+        <div className="nvs-row">{children}</div>
+      </div>
+    );
   };
 
   const getDefaultItem = () => {
     return arrayField.fields.reduce((acc: { [key: string]: any }, field) => {
-      acc[field.id] = field.defaultValue;
+      if ("defaultValue" in field) acc[field.id] = field.defaultValue;
       return acc;
     }, {});
   };
@@ -75,9 +76,18 @@ export const ArrayField: React.FC<IArrayField> = ({
       <div className="df-array-field-content">
         <div className="nvs-container-fluid">
           <div className="nvs-row">
-            {generateFormContentUtils.createFormElements(
-              createArrayItem(arrayField.id, index),
-            )}
+            <Elements
+              fields={createArrayItem(index)}
+              formElements={formElements}
+              containerComponent={containerComponent}
+              useContainersOutsideGroup={useContainersOutsideGroup}
+              useGroupContainer={useGroupContainer}
+              containerVisible={containerVisible}
+              buttonComponent={ButtonComponent}
+              fieldArrayAddButtonDefaultOptions={addButtonDefaultOptions}
+              fieldArrayRemoveButtonDefaultOptions={removeButtonDefaultOptions}
+              labelDefaultOptions={labelDefaultOptions}
+            />
           </div>
         </div>
       </div>
@@ -103,9 +113,7 @@ export const ArrayField: React.FC<IArrayField> = ({
   const createArrayItemRemoveButton = (onRemoveItem: Function) => {
     return (
       <div className="df-array-field-remove-button">
-        {generateFormContentUtils.createContentContainer(
-          createRemoveButton(onRemoveItem),
-        )}
+        <ContentContainer>{createRemoveButton(onRemoveItem)}</ContentContainer>
       </div>
     );
   };
@@ -138,18 +146,18 @@ export const ArrayField: React.FC<IArrayField> = ({
   };
 
   const createArrayItemAddButton = (onAddItem: Function) => {
-    return generateFormContentUtils.createContentContainer(
-      createAddButton(onAddItem),
-    );
+    return <ContentContainer>{createAddButton(onAddItem)}</ContentContainer>;
   };
 
   const createArrayFieldLabel = () => {
-    return generateFormContentUtils.createContentContainer(
-      <div className="nvs-col-12">
-        <label className={`df-array-field-label ${labelOptions.class}`}>
-          {arrayField.label}
-        </label>
-      </div>,
+    return (
+      <ContentContainer>
+        <div className="nvs-col-12">
+          <label className={`df-array-field-label ${labelOptions.class}`}>
+            {arrayField.label}
+          </label>
+        </div>
+      </ContentContainer>
     );
   };
 
@@ -158,7 +166,7 @@ export const ArrayField: React.FC<IArrayField> = ({
       .validate!.describe()
       .tests.find((test) => test.name === "max")?.params!.max as number;
 
-    return maxSize && length < maxSize;
+    return !(maxSize && length == maxSize);
   };
 
   const getArrayFieldErrorMessage = (
@@ -180,11 +188,14 @@ export const ArrayField: React.FC<IArrayField> = ({
       {({ push, remove, form }) => (
         <>
           {arrayField.label && createArrayFieldLabel()}
-          {form.values[arrayField.id]?.map((_: any, index: number) =>
-            createFieldArrayContent(remove, index),
-          )}
-          {checkFieldArrayMaxSize(form.values[arrayField.id].length) &&
-            createArrayItemAddButton(push)}
+          {lodash
+            .get(form.values, arrayField.id)
+            ?.map((_: any, index: number) =>
+              createFieldArrayContent(remove, index),
+            )}
+          {checkFieldArrayMaxSize(
+            lodash.get(form.values, arrayField.id)?.length,
+          ) && createArrayItemAddButton(push)}
           {createErrorList(form)}
         </>
       )}