@kbgarcia8/react-dynamic-form 1.1.26 → 1.1.27

package/dist/components/molecules/NestedEditableOption/NestedEditableOption.d.ts

@@ -1,4 +1,4 @@
 import type { NestedEditableOptionProps } from "../../../type/propTypes";
-declare const NestedEditableOption: ({ legend, idx, editableInformation, onChangeOfEditableOption, onClickSaveEdit, onClickCancelEdit, onClickDeleteEntry }: NestedEditableOptionProps) => import("react/jsx-runtime").JSX.Element;
+declare const NestedEditableOption: ({ legend, fieldsetIndex, idx, editableInformation, onChangeOfEditableOption, onClickSaveEdit, onClickCancelEdit, onClickDeleteEntry }: NestedEditableOptionProps) => import("react/jsx-runtime").JSX.Element;
 export default NestedEditableOption;
 //# sourceMappingURL=NestedEditableOption.d.ts.map

package/dist/components/molecules/NestedEditableOption/NestedEditableOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NestedEditableOption.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/NestedEditableOption/NestedEditableOption.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AAGzE,QAAA,MAAM,oBAAoB,GAAI,wHAQ5B,yBAAyB,4CA6B1B,CAAA;AAED,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"NestedEditableOption.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/NestedEditableOption/NestedEditableOption.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AAGzE,QAAA,MAAM,oBAAoB,GAAI,uIAS5B,yBAAyB,4CA6B1B,CAAA;AAED,eAAe,oBAAoB,CAAC"}

package/dist/components/organisms/DynamicForm/DynamicForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicForm.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/DynamicForm/DynamicForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAgB,gBAAgB,EAA+D,MAAM,yBAAyB,CAAC;AAE3I,QAAA,MAAM,WAAW,GAAI,mTAuBnB,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,4CAkJ1C,CAAA;AAGD,eAAe,WAAW,CAAC"}
+{"version":3,"file":"DynamicForm.d.ts","sourceRoot":"","sources":["../../../../src/components/organisms/DynamicForm/DynamicForm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,KAAK,EAAgB,gBAAgB,EAA+D,MAAM,yBAAyB,CAAC;AAE3I,QAAA,MAAM,WAAW,GAAI,mTAuBnB,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,4CAmJ1C,CAAA;AAGD,eAAe,WAAW,CAAC"}

package/dist/react-dynamic-form.cjs.js

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),F=require("react"),r=require("styled-components"),t={fonts:{secondary:"Raleway",tertiary:"Lato",fallback:"system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif"},fontWeight:{light:300,medium:500,bold:700,bolder:900},fontSize:{xsmall:"0.75rem"},spacing:{xxxsmall:"0.25rem",xxsmall:"0.375rem",xsmall:"0.5rem",small:"0.75rem",medium:"1.25rem"},borderRadius:{xsmall:"0.125rem",small:"0.25rem",xlarge:"2rem"},borderThickness:{thin:"0.0625rem",light:"0.125rem"}},J=r.button`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),F=require("react"),c=require("styled-components"),t={fonts:{secondary:"Raleway",tertiary:"Lato",fallback:"system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif"},fontWeight:{light:300,medium:500,bold:700,bolder:900},fontSize:{xsmall:"0.75rem"},spacing:{xxxsmall:"0.25rem",xxsmall:"0.375rem",xsmall:"0.5rem",small:"0.75rem",medium:"1.25rem"},borderRadius:{xsmall:"0.125rem",small:"0.25rem",xlarge:"2rem"},borderThickness:{thin:"0.0625rem",light:"0.125rem"}},J=c.button`
     display: flex;
     align-items: center;
     justify-content: center;
-    background-color: ${({theme:n})=>n.colors.blue||"blue"};
-    color: ${({theme:n})=>n.colors.bg||"white"};
-    border: ${t.borderThickness.light} solid ${({theme:n})=>n.colors.text||"black"};
+    background-color: ${({theme:a})=>a.colors.blue||"blue"};
+    color: ${({theme:a})=>a.colors.bg||"white"};
+    border: ${t.borderThickness.light} solid ${({theme:a})=>a.colors.text||"black"};
     border-radius: ${t.borderRadius.xlarge};
     padding: ${t.spacing.xxxsmall} ${t.spacing.small};
     margin: 0.125rem;
@@ -24,38 +24,38 @@
     & .button-icon-text-space svg {
         max-width: 100%;
     }
-`,K=r.div`
+`,K=c.div`
     width: 100%;
     display: flex;
     flex-direction: row;
     align-items: center;
     justify-content: center;
-`,Q=r.img`
+`,Q=c.img`
     maxwidth: 100%;
-`,V=r.span`
+`,V=c.span`
     font-size: ${t.fontSize.xsmall};
     font-weight: ${t.fontWeight.medium};
     font-family: ${t.fonts.tertiary}, ${t.fonts.fallback};
     display: flex;
     align-items: center;
     justify-content: center;
-`,f=({onClick:n,id:s,buttonType:l,source:o,svg:x,alt:d="alt-button-icon",text:m="",className:c="",dataAttributes:h={}})=>e.jsx(J,{onClick:n,id:s,type:l,className:c,...h,children:e.jsxs(K,{className:"button-icon-text-space",children:[o?e.jsx(Q,{src:o,alt:d}):x||"",m&&e.jsx(V,{id:s,children:m})]})}),X=r.div`
+`,f=({onClick:a,id:l,buttonType:s,source:o,svg:m,alt:r="alt-button-icon",text:d="",className:b="",dataAttributes:h={}})=>e.jsx(J,{onClick:a,id:l,type:s,className:b,...h,children:e.jsxs(K,{className:"button-icon-text-space",children:[o?e.jsx(Q,{src:o,alt:r}):m||"",d&&e.jsx(V,{id:l,children:d})]})}),X=c.div`
     display: flex;
     flex-direction: column;
     align-items: left;
     width: 100%;
     margin-bottom: ${t.spacing.small};
-`,Y=r.div`
+`,Y=c.div`
     display: flex;
     gap: ${t.spacing.xsmall};
     width: auto;
     height: auto;
-`,Z=r.label`
+`,Z=c.label`
     display: flex;
     align-items: center;
     justify-content:center;
     height: auto;
-    flex-direction:  ${n=>n.$labelFlexDirection||"column"};
+    flex-direction:  ${a=>a.$labelFlexDirection||"column"};
     font-family: ${t.fonts.secondary}, ${t.fonts.fallback};
     font-size: ${t.fontSize.xsmall};
     font-weight: ${t.fontWeight.bold};
@@ -67,21 +67,21 @@
         height: auto;
         object-fit: contain;
     }
-`,_=r.div`
+`,_=c.div`
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: ${t.spacing.xxxsmall};
-`,ee=r.span`
+`,ee=c.span`
     font-weight: ${t.fontWeight.bolder};
-`,te=r.div`
+`,te=c.div`
     max-width: 100%;
     display: flex;
     align-items: center;
-`,ne=r.span`
+`,ae=c.span`
     font-weight: ${t.fontWeight.light};
-`,R=({htmlFor:n,textLabel:s,additionalInfo:l,$labelFlexDirection:o,source:x,svg:d,className:m,children:c})=>e.jsxs(Z,{htmlFor:n,className:m,$labelFlexDirection:o,children:[(x||d)&&e.jsx(te,{className:"label-icon-container",children:x?e.jsx("img",{src:x,alt:`${n}-label-icon`}):d||""}),e.jsxs(_,{className:"label-text-container",children:[e.jsx(ee,{className:"main-label",children:s}),l&&e.jsx(ne,{className:"additional-info",children:l})]}),c]}),B=r.input`
+`,R=({htmlFor:a,textLabel:l,additionalInfo:s,$labelFlexDirection:o,source:m,svg:r,className:d,children:b})=>e.jsxs(Z,{htmlFor:a,className:d,$labelFlexDirection:o,children:[(m||r)&&e.jsx(te,{className:"label-icon-container",children:m?e.jsx("img",{src:m,alt:`${a}-label-icon`}):r||""}),e.jsxs(_,{className:"label-text-container",children:[e.jsx(ee,{className:"main-label",children:l}),s&&e.jsx(ae,{className:"additional-info",children:s})]}),b]}),B=c.input`
     display: flex;
     place-content: center;
     font-family: ${t.fonts.secondary}, ${t.fonts.fallback};
@@ -96,12 +96,12 @@
     border-radius: ${t.borderRadius.xsmall};
 
     &:focus{
-        border: ${t.borderThickness.thin} solid ${({theme:n})=>n.colors.teal};
+        border: ${t.borderThickness.thin} solid ${({theme:a})=>a.colors.teal};
     }
-`,ae=r.textarea`
+`,ne=c.textarea`
     display: flex;
     place-content: center;
-    border: ${t.borderThickness.light} solid ${({theme:n})=>n.colors.text};
+    border: ${t.borderThickness.light} solid ${({theme:a})=>a.colors.text};
     border-radius: ${t.borderRadius.small};
     outline: none;
     line-height: ${t.spacing.small};
@@ -111,46 +111,46 @@
     max-width: 100%;
     resize: none;
     overflow-y: auto;
-`,A=F.forwardRef((n,s)=>{const{type:l,id:o,onChange:x,isRequired:d,dataAttributes:m,disabled:c,className:h}=n;if(l==="textarea"){const{rows:y=5,cols:N=30,value:E,...v}=n;return e.jsx(ae,{id:o,onChange:x,value:E,rows:y,cols:N,...m,className:h,ref:s,disabled:c,required:d})}if(l==="radio"||l==="checkbox"){const{checked:y,...N}=n;return e.jsx(B,{ref:s,type:"checkbox",id:o,checked:y,onChange:x,disabled:c,className:h,...m})}const g=n,{value:j,pattern:$,placeholderText:k,...C}=g;return e.jsx(B,{id:o,name:o,placeholder:k,onChange:x,value:j,type:l,required:d,...m,className:h,ref:s,disabled:c,pattern:$})}),w=n=>{const{className:s,type:l,id:o,textLabel:x,additionalInfo:d,$labelFlexDirection:m,svg:c,labelClass:h,onChange:g,isRequired:j,dataAttributes:$,inputClass:k,ref:C,disabled:y,isEditable:N,editIcon:E,onClickEdit:v,deleteIcon:D,onClickDelete:S,idx:T,children:q}=n;return e.jsxs(X,{className:`${s} ${o.replace("#","")}-label-input-container`,children:[l!=="radio"&&l!=="checkbox"&&e.jsx(R,{htmlFor:o,textLabel:x,additionalInfo:d,$labelFlexDirection:m,svg:c,className:h}),l!=="radio"&&l!=="checkbox"&&l==="textarea"&&(()=>{const{rows:a=5,cols:u=30,value:i,...p}=n;return e.jsx(A,{id:o,name:o,type:"textarea",isRequired:j,onChange:g,value:i,rows:a,cols:u,dataAttributes:$,className:k,ref:C,disabled:y})})(),l!=="radio"&&l!=="checkbox"&&l!=="textarea"&&(()=>{const a=n,{value:u,pattern:i,placeholderText:p,...z}=a;return e.jsx(A,{id:o,name:o,placeholderText:p,onChange:g,value:u,type:l,isRequired:j,dataAttributes:$,className:k,ref:C,disabled:y,pattern:i})})(),(l==="radio"||l==="checkbox")&&(()=>{const{checked:a,...u}=n;return e.jsxs(e.Fragment,{children:[e.jsx(A,{ref:C,type:"checkbox",name:o,id:o,isRequired:j,checked:a,onChange:g,disabled:y,className:k,dataAttributes:$}),e.jsx(R,{htmlFor:o,textLabel:x,additionalInfo:d,$labelFlexDirection:m,svg:c,className:h})]})})(),N&&e.jsxs(Y,{className:"input-edit-buttons",children:[e.jsx(f,{id:`editable-${o}-edit-btn`,svg:E,buttonType:"button",onClick:v,className:`edit-radio-${T}`,dataAttributes:$}),e.jsx(f,{id:`editable-${o}-delete-btn`,svg:D,buttonType:"button",onClick:S,className:`delete-radio-${T}`,dataAttributes:$})]}),q]})},se=r.fieldset`
+`,A=F.forwardRef((a,l)=>{const{type:s,id:o,onChange:m,isRequired:r,dataAttributes:d,disabled:b,className:h}=a;if(s==="textarea"){const{rows:y=5,cols:N=30,value:E,...v}=a;return e.jsx(ne,{id:o,onChange:m,value:E,rows:y,cols:N,...d,className:h,ref:l,disabled:b,required:r})}if(s==="radio"||s==="checkbox"){const{checked:y,...N}=a;return e.jsx(B,{ref:l,type:"checkbox",id:o,checked:y,onChange:m,disabled:b,className:h,...d})}const u=a,{value:j,pattern:$,placeholderText:k,...C}=u;return e.jsx(B,{id:o,name:o,placeholder:k,onChange:m,value:j,type:s,required:r,...d,className:h,ref:l,disabled:b,pattern:$})}),w=a=>{const{className:l,type:s,id:o,textLabel:m,additionalInfo:r,$labelFlexDirection:d,svg:b,labelClass:h,onChange:u,isRequired:j,dataAttributes:$,inputClass:k,ref:C,disabled:y,isEditable:N,editIcon:E,onClickEdit:v,deleteIcon:D,onClickDelete:S,idx:T,children:q}=a;return e.jsxs(X,{className:`${l} ${o.replace("#","")}-label-input-container`,children:[s!=="radio"&&s!=="checkbox"&&e.jsx(R,{htmlFor:o,textLabel:m,additionalInfo:r,$labelFlexDirection:d,svg:b,className:h}),s!=="radio"&&s!=="checkbox"&&s==="textarea"&&(()=>{const{rows:n=5,cols:g=30,value:i,...p}=a;return e.jsx(A,{id:o,name:o,type:"textarea",isRequired:j,onChange:u,value:i,rows:n,cols:g,dataAttributes:$,className:k,ref:C,disabled:y})})(),s!=="radio"&&s!=="checkbox"&&s!=="textarea"&&(()=>{const n=a,{value:g,pattern:i,placeholderText:p,...z}=n;return e.jsx(A,{id:o,name:o,placeholderText:p,onChange:u,value:g,type:s,isRequired:j,dataAttributes:$,className:k,ref:C,disabled:y,pattern:i})})(),(s==="radio"||s==="checkbox")&&(()=>{const{checked:n,...g}=a;return e.jsxs(e.Fragment,{children:[e.jsx(A,{ref:C,type:"checkbox",name:o,id:o,isRequired:j,checked:n,onChange:u,disabled:y,className:k,dataAttributes:$}),e.jsx(R,{htmlFor:o,textLabel:m,additionalInfo:r,$labelFlexDirection:d,svg:b,className:h})]})})(),N&&e.jsxs(Y,{className:"input-edit-buttons",children:[e.jsx(f,{id:`editable-${o}-edit-btn`,svg:E,buttonType:"button",onClick:v,className:`edit-radio-${T}`,dataAttributes:$}),e.jsx(f,{id:`editable-${o}-delete-btn`,svg:D,buttonType:"button",onClick:S,className:`delete-radio-${T}`,dataAttributes:$})]}),q]})},se=c.fieldset`
     padding: 0;
     height: auto;
     width: 100%;
-`,oe=r.legend`
+`,oe=c.legend`
     font-size: ${t.spacing.medium};
     font-weight: 500;
     margin: 0 auto ${t.spacing.small} auto;
     text-align: center;
     font-family: ${t.fonts.secondary}, ${t.fonts.fallback};
-`,le=r.div`
+`,le=c.div`
     display: flex;
     flex-direction: column;
     align-items: flex-start;
     width: 100%;
     margin-bottom: ${t.spacing.small};
-`,ie=r.div`
+`,ie=c.div`
     display: flex;
     justify-content: space-between;
     width: 100%;
-`,P=({legend:n,idx:s,editableInformation:l,onChangeOfEditableOption:o,onClickSaveEdit:x,onClickCancelEdit:d,onClickDeleteEntry:m})=>e.jsxs(se,{className:"editable-option-fieldset",children:[e.jsx(oe,{children:`${n} ${s+1}`}),l?.map((c,h)=>e.jsx(le,{className:"editable-option-container",children:e.jsx(A,{id:`editable-option-${h}`,name:`editable-option-${h}`,placeholderText:c.name.charAt(0).toUpperCase()+c.name.slice(1),onChange:o,value:c.info,type:c.type,isRequired:!0,className:"editable-option",dataAttributes:{"data-index":h,"data-key":c.info}})},`${c.name}-${h}`)),e.jsxs(ie,{className:"editable-option-button-space",children:[e.jsx(f,{id:`editable-option-${s}-submit`,buttonType:"button",text:"Save",onClick:x,className:"editable-option-btn",dataAttributes:{"data-index":s}}),e.jsx(f,{id:`editable-option-${s}-cancel`,buttonType:"button",text:"Cancel",onClick:d,className:"editable-option-btn",dataAttributes:{"data-index":s}}),e.jsx(f,{id:`editable-option-${s}-delete`,buttonType:"button",text:"Delete",onClick:m,className:"editable-option-btn",dataAttributes:{"data-index":s}})]})]}),ce=r.div`
+`,P=({legend:a,fieldsetIndex:l=null,idx:s,editableInformation:o,onChangeOfEditableOption:m,onClickSaveEdit:r,onClickCancelEdit:d,onClickDeleteEntry:b})=>e.jsxs(se,{className:"editable-option-fieldset",children:[e.jsx(oe,{children:`${a} ${s+1}`}),o?.map((h,u)=>e.jsx(le,{className:"editable-option-container",children:e.jsx(A,{id:`editable-option-${u}`,name:`editable-option-${u}`,placeholderText:h.name.charAt(0).toUpperCase()+h.name.slice(1),onChange:m,value:h.info,type:h.type,isRequired:!0,className:"editable-option",dataAttributes:{"data-index":u,"data-key":h.info}})},`${h.name}-${u}`)),e.jsxs(ie,{className:"editable-option-button-space",children:[e.jsx(f,{id:`editable-option-${s}-submit`,buttonType:"button",text:"Save",onClick:r,className:"editable-option-btn",dataAttributes:{"data-index":s,"data-fieldsetIndex":l}}),e.jsx(f,{id:`editable-option-${s}-cancel`,buttonType:"button",text:"Cancel",onClick:d,className:"editable-option-btn",dataAttributes:{"data-index":s,"data-fieldsetIndex":l}}),e.jsx(f,{id:`editable-option-${s}-delete`,buttonType:"button",text:"Delete",onClick:b,className:"editable-option-btn",dataAttributes:{"data-index":s,"data-fieldsetIndex":l}})]})]}),ce=c.div`
     display: flex;
     justify-content: space-between;
     max-width: 100%;
-`,re=({id:n,hasSubmit:s,submitText:l,handleSubmit:o,hasReset:x,resetText:d,handleReset:m,hasCancel:c,cancelText:h,handleCancel:g})=>e.jsxs(ce,{className:"form-main-button-container",children:[s&&e.jsx(f,{id:`form-${n}-submit`,buttonType:"submit",text:l??"Submit",onClick:o,className:"submit-form-btn"}),x&&e.jsx(f,{id:`form-${n}-edit`,buttonType:"button",text:d??"Reset",onClick:m,className:"reset-form-btn"}),c&&e.jsx(f,{id:`form-${n}-cancel`,buttonType:"button",text:h??"Cancel",onClick:g,className:"cancel-form-btn"})]}),W=r.legend`
+`,re=({id:a,hasSubmit:l,submitText:s,handleSubmit:o,hasReset:m,resetText:r,handleReset:d,hasCancel:b,cancelText:h,handleCancel:u})=>e.jsxs(ce,{className:"form-main-button-container",children:[l&&e.jsx(f,{id:`form-${a}-submit`,buttonType:"submit",text:s??"Submit",onClick:o,className:"submit-form-btn"}),m&&e.jsx(f,{id:`form-${a}-edit`,buttonType:"button",text:r??"Reset",onClick:d,className:"reset-form-btn"}),b&&e.jsx(f,{id:`form-${a}-cancel`,buttonType:"button",text:h??"Cancel",onClick:u,className:"cancel-form-btn"})]}),W=c.legend`
     font-size: ${t.spacing.medium};
     font-weight: 500;
     margin-bottom: ${t.spacing.small};
     width: auto;
     text-align: center;
     font-family: ${t.fonts.secondary}, ${t.fonts.fallback};
-`,M=r.fieldset`
+`,M=c.fieldset`
     padding: 0;
     height: auto;
     width: 100%;
-`,U=r.div`
+`,U=c.div`
     padding: ${t.spacing.small};
     height: auto;
     width: 100%;
-`,O=r.div`
+`,O=c.div`
     display: flex;
     justify-content: center;
     align-items: center;
@@ -159,19 +159,19 @@
     font-family: ${t.fonts.tertiary}, ${t.fonts.fallback};
     font-size: ${t.fontSize.xsmall};
     font-weight: ${t.fontWeight.bold};
-`,de=r.form`
+`,de=c.form`
     display: flex;
     flex-direction: column;
     align-items: center;
     width: 100%;
-`,H=r.div`
+`,H=c.div`
     display: flex;
     justify-content: space-between;
     width: 100%;
-`,me=r.div`
+`,me=c.div`
     width: 100%;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
-`,xe=({fieldsets:n=null,legendText:s,isExpandable:l,id:o,formInputs:x,labelAndInputContainerClass:d,labelClass:m,inputClass:c,onChangeOfEditableOption:h,handleAddingInputEntry:g,hasSubmit:j=!1,submitText:$,handleSubmit:k,hasReset:C=!1,resetText:y,handleReset:N,hasCancel:E=!1,cancelText:v,handleCancel:D,handleSubmitForm:S,className:T,children:q})=>e.jsxs(de,{id:`${o}-form`,className:T,onSubmit:S,children:[n?n.map((a,u)=>e.jsxs(U,{className:`${o}-fieldset-wrapper`,children:[e.jsxs(M,{id:`${o}-form-fieldset-${u}`,className:`${a.legend}-fieldset`,children:[a.legend&&e.jsx(W,{className:`${a.legend}-legend`,children:a.legend}),a.inputs.length!==0?a.inputs.map((i,p)=>e.jsxs(F.Fragment,{children:[i.type==="textarea"&&e.jsx(w,{...i,id:i.id??`${a.legend}-input`,labelClass:m,inputClass:c,idx:p,className:`${d} ${i?.uniqueClass}`}),i.type!=="textarea"&&i.type!=="radio"&&i.type!=="checkbox"&&e.jsx(w,{...i,id:i.id??`${a.legend}-input`,labelClass:m,inputClass:c,idx:p,className:`${d} ${i?.uniqueClass}`}),(i.type==="radio"||i.type==="checkbox")&&e.jsxs(e.Fragment,{children:[e.jsx(w,{...i,id:i.id??`${a.legend}-input`,labelClass:m,inputClass:c,idx:p,className:`${d} ${i?.uniqueClass}`}),i.editing&&i.isEditable&&e.jsx(P,{legend:`${a.legend}`,idx:p,editableInformation:i?.editableInformation||[],onChangeOfEditableOption:h,onClickSaveEdit:i?.onClickSave||(z=>{}),onClickCancelEdit:i?.onClickCancel||(z=>{}),onClickDeleteEntry:i?.onClickDelete||(z=>{})})]})]},`form-${o}-${p}`)):a.isExpandable?e.jsx(O,{children:`No entry yet on ${a.legend}. Click "+" button to add entry.`}):""]}),a.isExpandable&&e.jsx(H,{className:"add-input-button-space",children:e.jsx(f,{id:`expand-${a.legend}-inputs`,buttonType:"button",text:"+",onClick:g,className:"add-input-entry"})})]},`${a.legend}-${u}`)):e.jsxs(U,{className:`${o}-fieldset-wrapper`,children:[e.jsxs(M,{id:`${o}-form-fieldset`,className:`${s}-fieldset`,children:[s&&e.jsx(W,{className:`${s}-legend`,children:s}),!n&&x&&x.length!==0?x.map((a,u)=>e.jsxs(F.Fragment,{children:[a.type==="textarea"&&e.jsx(w,{...a,id:a.id??`${s}-input`,labelClass:m,inputClass:c,idx:u,className:`${d} ${a?.uniqueClass}`}),a.type!=="textarea"&&a.type!=="radio"&&a.type!=="checkbox"&&e.jsx(w,{...a,id:a.id??`${s}-input`,labelClass:m,inputClass:c,idx:u,className:`${d} ${a?.uniqueClass}`}),(a.type==="radio"||a.type==="checkbox")&&e.jsxs(e.Fragment,{children:[e.jsx(w,{...a,id:a.id??`${s}-input`,labelClass:m,inputClass:c,idx:u,className:`${d} ${a?.uniqueClass}`}),a.editing&&a.isEditable&&e.jsx(P,{legend:`${s}`,idx:u,editableInformation:a?.editableInformation,onChangeOfEditableOption:h,onClickSaveEdit:a?.onClickSave||(i=>{}),onClickCancelEdit:a?.onClickCancel||(i=>{}),onClickDeleteEntry:a?.onClickDelete||(i=>{})})]})]},`form-${o}-${u}`)):l?e.jsx(O,{children:`No entry yet on ${s}. Please click "+" button to add`}):""]}),l&&e.jsx(H,{className:"add-input-button-space",children:e.jsx(f,{id:`expand-${s}-inputs`,buttonType:"button",text:"+",onClick:g,className:"add-input-entry"})})]}),e.jsx(re,{id:o,hasSubmit:j,submitText:$,handleSubmit:k,hasReset:C,resetText:y,handleReset:N,hasCancel:E,cancelText:v,handleCancel:D}),e.jsx(me,{className:"children-container",children:q})]}),be=n=>{const s=/^#([0-9A-Fa-f]{3}){1,2}$/,l=/^rgb(a)?\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}(?:\s*,\s*(0|1|0?\.\d+))?\s*\)$/;return s.test(n)||l.test(n)||CSS.supports("color",n)},b=n=>{if(!be(n))throw new Error(`Invalid color: ${n}`);return n},he={mobile:"320px",tablet:"768px",desktop:"992px",largeDesktop:"1200px",largerDesktop:"1400px"},I={name:"light",colors:{text:b("#333446"),bg:b("#EEEEEE"),blue:b("#7F8CAA"),blue2:b("#80A6FF"),teal:b("#5b8280ff"),teal2:b("#AEEAE7"),gray:b("#AEAEAE"),information:b("#202234"),success:b("#123524"),warning:b("#F2C265"),error:b("#990000")}},G={name:"dark",colors:{bg:b("#333446"),text:b("#EEEEEE"),blue:b("#80A6FF"),blue2:b("#7F8CAA"),teal:b("#AEEAE7"),teal2:b("#5b8280ff"),gray:b("#D0D0DD"),information:b("#C9E6F0"),success:b("#9EDF9C"),warning:b("#FCFFC1"),error:b("#FAD4D4")}},L=F.createContext({}),ue=({children:n,initialTheme:s=I,secondTheme:l=G})=>{const[o,x]=F.useState(s),d=()=>{x(m=>m===s?l:s)};return e.jsx(L.Provider,{value:{currentTheme:o,toggleTheme:d},children:e.jsx(r.ThemeProvider,{theme:o,children:n})})},ge=()=>F.useContext(L);exports.DynamicForm=xe;exports.ThemeContext=L;exports.ThemeContextProvider=ue;exports.breakpoints=he;exports.darkTheme=G;exports.lightTheme=I;exports.useTheme=ge;
+`,xe=({fieldsets:a=null,legendText:l,isExpandable:s,id:o,formInputs:m,labelAndInputContainerClass:r,labelClass:d,inputClass:b,onChangeOfEditableOption:h,handleAddingInputEntry:u,hasSubmit:j=!1,submitText:$,handleSubmit:k,hasReset:C=!1,resetText:y,handleReset:N,hasCancel:E=!1,cancelText:v,handleCancel:D,handleSubmitForm:S,className:T,children:q})=>e.jsxs(de,{id:`${o}-form`,className:T,onSubmit:S,children:[a?a.map((n,g)=>e.jsxs(U,{className:`${o}-fieldset-wrapper`,children:[e.jsxs(M,{id:`${o}-form-fieldset-${g}`,className:`${n.legend}-fieldset`,children:[n.legend&&e.jsx(W,{className:`${n.legend}-legend`,children:n.legend}),n.inputs.length!==0?n.inputs.map((i,p)=>e.jsxs(F.Fragment,{children:[i.type==="textarea"&&e.jsx(w,{...i,id:i.id??`${n.legend}-input`,labelClass:d,inputClass:b,idx:p,className:`${r} ${i?.uniqueClass}`}),i.type!=="textarea"&&i.type!=="radio"&&i.type!=="checkbox"&&e.jsx(w,{...i,id:i.id??`${n.legend}-input`,labelClass:d,inputClass:b,idx:p,className:`${r} ${i?.uniqueClass}`}),(i.type==="radio"||i.type==="checkbox")&&e.jsxs(e.Fragment,{children:[e.jsx(w,{...i,id:i.id??`${n.legend}-input`,labelClass:d,inputClass:b,idx:p,className:`${r} ${i?.uniqueClass}`}),i.editing&&i.isEditable&&e.jsx(P,{legend:`${n.legend}`,fieldsetIndex:g,idx:p,editableInformation:i?.editableInformation||[],onChangeOfEditableOption:h,onClickSaveEdit:i?.onClickSave||(z=>{}),onClickCancelEdit:i?.onClickCancel||(z=>{}),onClickDeleteEntry:i?.onClickDelete||(z=>{})})]})]},`form-${o}-${p}`)):n.isExpandable?e.jsx(O,{children:`No entry yet on ${n.legend}. Click "+" button to add entry.`}):""]}),n.isExpandable&&e.jsx(H,{className:"add-input-button-space",children:e.jsx(f,{id:`expand-${n.legend}-inputs`,buttonType:"button",text:"+",onClick:u,className:"add-input-entry",dataAttributes:{"data-fieldsetidx":g}})})]},`${n.legend}-${g}`)):e.jsxs(U,{className:`${o}-fieldset-wrapper`,children:[e.jsxs(M,{id:`${o}-form-fieldset`,className:`${l}-fieldset`,children:[l&&e.jsx(W,{className:`${l}-legend`,children:l}),!a&&m&&m.length!==0?m.map((n,g)=>e.jsxs(F.Fragment,{children:[n.type==="textarea"&&e.jsx(w,{...n,id:n.id??`${l}-input`,labelClass:d,inputClass:b,idx:g,className:`${r} ${n?.uniqueClass}`}),n.type!=="textarea"&&n.type!=="radio"&&n.type!=="checkbox"&&e.jsx(w,{...n,id:n.id??`${l}-input`,labelClass:d,inputClass:b,idx:g,className:`${r} ${n?.uniqueClass}`}),(n.type==="radio"||n.type==="checkbox")&&e.jsxs(e.Fragment,{children:[e.jsx(w,{...n,id:n.id??`${l}-input`,labelClass:d,inputClass:b,idx:g,className:`${r} ${n?.uniqueClass}`}),n.editing&&n.isEditable&&e.jsx(P,{legend:`${l}`,idx:g,editableInformation:n?.editableInformation,onChangeOfEditableOption:h,onClickSaveEdit:n?.onClickSave||(i=>{}),onClickCancelEdit:n?.onClickCancel||(i=>{}),onClickDeleteEntry:n?.onClickDelete||(i=>{})})]})]},`form-${o}-${g}`)):s?e.jsx(O,{children:`No entry yet on ${l}. Please click "+" button to add`}):""]}),s&&e.jsx(H,{className:"add-input-button-space",children:e.jsx(f,{id:`expand-${l}-inputs`,buttonType:"button",text:"+",onClick:u,className:"add-input-entry"})})]}),e.jsx(re,{id:o,hasSubmit:j,submitText:$,handleSubmit:k,hasReset:C,resetText:y,handleReset:N,hasCancel:E,cancelText:v,handleCancel:D}),e.jsx(me,{className:"children-container",children:q})]}),be=a=>{const l=/^#([0-9A-Fa-f]{3}){1,2}$/,s=/^rgb(a)?\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}(?:\s*,\s*(0|1|0?\.\d+))?\s*\)$/;return l.test(a)||s.test(a)||CSS.supports("color",a)},x=a=>{if(!be(a))throw new Error(`Invalid color: ${a}`);return a},he={mobile:"320px",tablet:"768px",desktop:"992px",largeDesktop:"1200px",largerDesktop:"1400px"},I={name:"light",colors:{text:x("#333446"),bg:x("#EEEEEE"),blue:x("#7F8CAA"),blue2:x("#80A6FF"),teal:x("#5b8280ff"),teal2:x("#AEEAE7"),gray:x("#AEAEAE"),information:x("#202234"),success:x("#123524"),warning:x("#F2C265"),error:x("#990000")}},G={name:"dark",colors:{bg:x("#333446"),text:x("#EEEEEE"),blue:x("#80A6FF"),blue2:x("#7F8CAA"),teal:x("#AEEAE7"),teal2:x("#5b8280ff"),gray:x("#D0D0DD"),information:x("#C9E6F0"),success:x("#9EDF9C"),warning:x("#FCFFC1"),error:x("#FAD4D4")}},L=F.createContext({}),ue=({children:a,initialTheme:l=I,secondTheme:s=G})=>{const[o,m]=F.useState(l),r=()=>{m(d=>d===l?s:l)};return e.jsx(L.Provider,{value:{currentTheme:o,toggleTheme:r},children:e.jsx(c.ThemeProvider,{theme:o,children:a})})},ge=()=>F.useContext(L);exports.DynamicForm=xe;exports.ThemeContext=L;exports.ThemeContextProvider=ue;exports.breakpoints=he;exports.darkTheme=G;exports.lightTheme=I;exports.useTheme=ge;

package/dist/react-dynamic-form.es.js

@@ -1,6 +1,6 @@
-import { jsx as a, jsxs as g, Fragment as R } from "react/jsx-runtime";
+import { jsx as a, jsxs as u, Fragment as R } from "react/jsx-runtime";
 import q, { forwardRef as J, createContext as K, useState as Q, useContext as V } from "react";
-import r, { ThemeProvider as X } from "styled-components";
+import c, { ThemeProvider as X } from "styled-components";
 const e = {
   fonts: {
     secondary: "Raleway",
@@ -32,7 +32,7 @@ const e = {
     thin: "0.0625rem",
     light: "0.125rem"
   }
-}, Y = r.button`
+}, Y = c.button`
     display: flex;
     align-items: center;
     justify-content: center;
@@ -58,15 +58,15 @@ const e = {
     & .button-icon-text-space svg {
         max-width: 100%;
     }
-`, Z = r.div`
+`, Z = c.div`
     width: 100%;
     display: flex;
     flex-direction: row;
     align-items: center;
     justify-content: center;
-`, _ = r.img`
+`, _ = c.img`
     maxwidth: 100%;
-`, ee = r.span`
+`, ee = c.span`
     font-size: ${e.fontSize.xsmall};
     font-weight: ${e.fontWeight.medium};
     font-family: ${e.fonts.tertiary}, ${e.fonts.fallback};
@@ -75,39 +75,39 @@ const e = {
     justify-content: center;
 `, x = ({
   onClick: t,
-  id: o,
-  buttonType: i,
+  id: i,
+  buttonType: o,
   source: l,
-  svg: b,
-  alt: d = "alt-button-icon",
-  text: m = "",
-  className: c = "",
+  svg: m,
+  alt: r = "alt-button-icon",
+  text: d = "",
+  className: h = "",
   dataAttributes: f = {}
 }) => /* @__PURE__ */ a(
   Y,
   {
     onClick: t,
-    id: o,
-    type: i,
-    className: c,
+    id: i,
+    type: o,
+    className: h,
     ...f,
-    children: /* @__PURE__ */ g(Z, { className: "button-icon-text-space", children: [
-      l ? /* @__PURE__ */ a(_, { src: l, alt: d }) : b || "",
-      m && /* @__PURE__ */ a(ee, { id: o, children: m })
+    children: /* @__PURE__ */ u(Z, { className: "button-icon-text-space", children: [
+      l ? /* @__PURE__ */ a(_, { src: l, alt: r }) : m || "",
+      d && /* @__PURE__ */ a(ee, { id: i, children: d })
     ] })
   }
-), te = r.div`
+), te = c.div`
     display: flex;
     flex-direction: column;
     align-items: left;
     width: 100%;
     margin-bottom: ${e.spacing.small};
-`, ae = r.div`
+`, ae = c.div`
     display: flex;
     gap: ${e.spacing.xsmall};
     width: auto;
     height: auto;
-`, ne = r.label`
+`, ne = c.label`
     display: flex;
     align-items: center;
     justify-content:center;
@@ -124,37 +124,37 @@ const e = {
         height: auto;
         object-fit: contain;
     }
-`, oe = r.div`
+`, oe = c.div`
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: ${e.spacing.xxxsmall};
-`, le = r.span`
+`, le = c.span`
     font-weight: ${e.fontWeight.bolder};
-`, ie = r.div`
+`, ie = c.div`
     max-width: 100%;
     display: flex;
     align-items: center;
-`, se = r.span`
+`, se = c.span`
     font-weight: ${e.fontWeight.light};
 `, B = ({
   htmlFor: t,
-  textLabel: o,
-  additionalInfo: i,
+  textLabel: i,
+  additionalInfo: o,
   $labelFlexDirection: l,
-  source: b,
-  svg: d,
-  className: m,
-  children: c
-}) => /* @__PURE__ */ g(ne, { htmlFor: t, className: m, $labelFlexDirection: l, children: [
-  (b || d) && /* @__PURE__ */ a(ie, { className: "label-icon-container", children: b ? /* @__PURE__ */ a("img", { src: b, alt: `${t}-label-icon` }) : d || "" }),
-  /* @__PURE__ */ g(oe, { className: "label-text-container", children: [
-    /* @__PURE__ */ a(le, { className: "main-label", children: o }),
-    i && /* @__PURE__ */ a(se, { className: "additional-info", children: i })
+  source: m,
+  svg: r,
+  className: d,
+  children: h
+}) => /* @__PURE__ */ u(ne, { htmlFor: t, className: d, $labelFlexDirection: l, children: [
+  (m || r) && /* @__PURE__ */ a(ie, { className: "label-icon-container", children: m ? /* @__PURE__ */ a("img", { src: m, alt: `${t}-label-icon` }) : r || "" }),
+  /* @__PURE__ */ u(oe, { className: "label-text-container", children: [
+    /* @__PURE__ */ a(le, { className: "main-label", children: i }),
+    o && /* @__PURE__ */ a(se, { className: "additional-info", children: o })
   ] }),
-  c
-] }), W = r.input`
+  h
+] }), W = c.input`
     display: flex;
     place-content: center;
     font-family: ${e.fonts.secondary}, ${e.fonts.fallback};
@@ -171,7 +171,7 @@ const e = {
     &:focus{
         border: ${e.borderThickness.thin} solid ${({ theme: t }) => t.colors.teal};
     }
-`, ce = r.textarea`
+`, ce = c.textarea`
     display: flex;
     place-content: center;
     border: ${e.borderThickness.light} solid ${({ theme: t }) => t.colors.text};
@@ -184,71 +184,71 @@ const e = {
     max-width: 100%;
     resize: none;
     overflow-y: auto;
-`, D = J((t, o) => {
-  const { type: i, id: l, onChange: b, isRequired: d, dataAttributes: m, disabled: c, className: f } = t;
-  if (i === "textarea") {
+`, D = J((t, i) => {
+  const { type: o, id: l, onChange: m, isRequired: r, dataAttributes: d, disabled: h, className: f } = t;
+  if (o === "textarea") {
     const { rows: y = 5, cols: F = 30, value: v, ...A } = t;
     return /* @__PURE__ */ a(
       ce,
       {
         id: l,
-        onChange: b,
+        onChange: m,
         value: v,
         rows: y,
         cols: F,
-        ...m,
+        ...d,
         className: f,
-        ref: o,
-        disabled: c,
-        required: d
+        ref: i,
+        disabled: h,
+        required: r
       }
     );
   }
-  if (i === "radio" || i === "checkbox") {
+  if (o === "radio" || o === "checkbox") {
     const { checked: y, ...F } = t;
     return /* @__PURE__ */ a(
       W,
       {
-        ref: o,
+        ref: i,
         type: "checkbox",
         id: l,
         checked: y,
-        onChange: b,
-        disabled: c,
+        onChange: m,
+        disabled: h,
         className: f,
-        ...m
+        ...d
       }
     );
   }
-  const $ = t, { value: N, pattern: p, placeholderText: C, ...w } = $;
+  const g = t, { value: N, pattern: p, placeholderText: C, ...w } = g;
   return /* @__PURE__ */ a(
     W,
     {
       id: l,
       name: l,
       placeholder: C,
-      onChange: b,
+      onChange: m,
       value: N,
-      type: i,
-      required: d,
-      ...m,
+      type: o,
+      required: r,
+      ...d,
       className: f,
-      ref: o,
-      disabled: c,
+      ref: i,
+      disabled: h,
       pattern: p
     }
   );
 }), E = (t) => {
   const {
-    className: o,
-    type: i,
+    className: i,
+    type: o,
     id: l,
-    textLabel: b,
-    additionalInfo: d,
-    $labelFlexDirection: m,
-    svg: c,
+    textLabel: m,
+    additionalInfo: r,
+    $labelFlexDirection: d,
+    svg: h,
     labelClass: f,
-    onChange: $,
+    onChange: g,
     isRequired: N,
     dataAttributes: p,
     inputClass: C,
@@ -262,10 +262,10 @@ const e = {
     idx: T,
     children: j
   } = t;
-  return /* @__PURE__ */ g(te, { className: `${o} ${l.replace("#", "")}-label-input-container`, children: [
-    i !== "radio" && i !== "checkbox" && /* @__PURE__ */ a(B, { htmlFor: l, textLabel: b, additionalInfo: d, $labelFlexDirection: m, svg: c, className: f }),
-    i !== "radio" && i !== "checkbox" && i === "textarea" && (() => {
-      const { rows: n = 5, cols: u = 30, value: s, ...k } = t;
+  return /* @__PURE__ */ u(te, { className: `${i} ${l.replace("#", "")}-label-input-container`, children: [
+    o !== "radio" && o !== "checkbox" && /* @__PURE__ */ a(B, { htmlFor: l, textLabel: m, additionalInfo: r, $labelFlexDirection: d, svg: h, className: f }),
+    o !== "radio" && o !== "checkbox" && o === "textarea" && (() => {
+      const { rows: n = 5, cols: $ = 30, value: s, ...k } = t;
       return /* @__PURE__ */ a(
         D,
         {
@@ -273,10 +273,10 @@ const e = {
           name: l,
           type: "textarea",
           isRequired: N,
-          onChange: $,
+          onChange: g,
           value: s,
           rows: n,
-          cols: u,
+          cols: $,
           dataAttributes: p,
           className: C,
           ref: w,
@@ -284,17 +284,17 @@ const e = {
         }
       );
     })(),
-    i !== "radio" && i !== "checkbox" && i !== "textarea" && (() => {
-      const n = t, { value: u, pattern: s, placeholderText: k, ...L } = n;
+    o !== "radio" && o !== "checkbox" && o !== "textarea" && (() => {
+      const n = t, { value: $, pattern: s, placeholderText: k, ...L } = n;
       return /* @__PURE__ */ a(
         D,
         {
           id: l,
           name: l,
           placeholderText: k,
-          onChange: $,
-          value: u,
-          type: i,
+          onChange: g,
+          value: $,
+          type: o,
           isRequired: N,
           dataAttributes: p,
           className: C,
@@ -304,9 +304,9 @@ const e = {
         }
       );
     })(),
-    (i === "radio" || i === "checkbox") && (() => {
-      const { checked: n, ...u } = t;
-      return /* @__PURE__ */ g(R, { children: [
+    (o === "radio" || o === "checkbox") && (() => {
+      const { checked: n, ...$ } = t;
+      return /* @__PURE__ */ u(R, { children: [
         /* @__PURE__ */ a(
           D,
           {
@@ -316,108 +316,109 @@ const e = {
             id: l,
             isRequired: N,
             checked: n,
-            onChange: $,
+            onChange: g,
             disabled: y,
             className: C,
             dataAttributes: p
           }
         ),
-        /* @__PURE__ */ a(B, { htmlFor: l, textLabel: b, additionalInfo: d, $labelFlexDirection: m, svg: c, className: f })
+        /* @__PURE__ */ a(B, { htmlFor: l, textLabel: m, additionalInfo: r, $labelFlexDirection: d, svg: h, className: f })
       ] });
     })(),
-    F && /* @__PURE__ */ g(ae, { className: "input-edit-buttons", children: [
+    F && /* @__PURE__ */ u(ae, { className: "input-edit-buttons", children: [
       /* @__PURE__ */ a(x, { id: `editable-${l}-edit-btn`, svg: v, buttonType: "button", onClick: A, className: `edit-radio-${T}`, dataAttributes: p }),
       /* @__PURE__ */ a(x, { id: `editable-${l}-delete-btn`, svg: S, buttonType: "button", onClick: z, className: `delete-radio-${T}`, dataAttributes: p })
     ] }),
     j
   ] });
-}, re = r.fieldset`
+}, re = c.fieldset`
     padding: 0;
     height: auto;
     width: 100%;
-`, de = r.legend`
+`, de = c.legend`
     font-size: ${e.spacing.medium};
     font-weight: 500;
     margin: 0 auto ${e.spacing.small} auto;
     text-align: center;
     font-family: ${e.fonts.secondary}, ${e.fonts.fallback};
-`, me = r.div`
+`, me = c.div`
     display: flex;
     flex-direction: column;
     align-items: flex-start;
     width: 100%;
     margin-bottom: ${e.spacing.small};
-`, be = r.div`
+`, be = c.div`
     display: flex;
     justify-content: space-between;
     width: 100%;
 `, P = ({
   legend: t,
+  fieldsetIndex: i = null,
   idx: o,
-  editableInformation: i,
-  onChangeOfEditableOption: l,
-  onClickSaveEdit: b,
+  editableInformation: l,
+  onChangeOfEditableOption: m,
+  onClickSaveEdit: r,
   onClickCancelEdit: d,
-  onClickDeleteEntry: m
-}) => /* @__PURE__ */ g(re, { className: "editable-option-fieldset", children: [
+  onClickDeleteEntry: h
+}) => /* @__PURE__ */ u(re, { className: "editable-option-fieldset", children: [
   /* @__PURE__ */ a(de, { children: `${t} ${o + 1}` }),
-  i?.map((c, f) => /* @__PURE__ */ a(me, { className: "editable-option-container", children: /* @__PURE__ */ a(
+  l?.map((f, g) => /* @__PURE__ */ a(me, { className: "editable-option-container", children: /* @__PURE__ */ a(
     D,
     {
-      id: `editable-option-${f}`,
-      name: `editable-option-${f}`,
-      placeholderText: c.name.charAt(0).toUpperCase() + c.name.slice(1),
-      onChange: l,
-      value: c.info,
-      type: c.type,
+      id: `editable-option-${g}`,
+      name: `editable-option-${g}`,
+      placeholderText: f.name.charAt(0).toUpperCase() + f.name.slice(1),
+      onChange: m,
+      value: f.info,
+      type: f.type,
       isRequired: !0,
       className: "editable-option",
       dataAttributes: {
-        "data-index": f,
-        "data-key": c.info
+        "data-index": g,
+        "data-key": f.info
       }
     }
-  ) }, `${c.name}-${f}`)),
-  /* @__PURE__ */ g(be, { className: "editable-option-button-space", children: [
-    /* @__PURE__ */ a(x, { id: `editable-option-${o}-submit`, buttonType: "button", text: "Save", onClick: b, className: "editable-option-btn", dataAttributes: { "data-index": o } }),
-    /* @__PURE__ */ a(x, { id: `editable-option-${o}-cancel`, buttonType: "button", text: "Cancel", onClick: d, className: "editable-option-btn", dataAttributes: { "data-index": o } }),
-    /* @__PURE__ */ a(x, { id: `editable-option-${o}-delete`, buttonType: "button", text: "Delete", onClick: m, className: "editable-option-btn", dataAttributes: { "data-index": o } })
+  ) }, `${f.name}-${g}`)),
+  /* @__PURE__ */ u(be, { className: "editable-option-button-space", children: [
+    /* @__PURE__ */ a(x, { id: `editable-option-${o}-submit`, buttonType: "button", text: "Save", onClick: r, className: "editable-option-btn", dataAttributes: { "data-index": o, "data-fieldsetIndex": i } }),
+    /* @__PURE__ */ a(x, { id: `editable-option-${o}-cancel`, buttonType: "button", text: "Cancel", onClick: d, className: "editable-option-btn", dataAttributes: { "data-index": o, "data-fieldsetIndex": i } }),
+    /* @__PURE__ */ a(x, { id: `editable-option-${o}-delete`, buttonType: "button", text: "Delete", onClick: h, className: "editable-option-btn", dataAttributes: { "data-index": o, "data-fieldsetIndex": i } })
   ] })
-] }), he = r.div`
+] }), he = c.div`
     display: flex;
     justify-content: space-between;
     max-width: 100%;
 `, fe = ({
   id: t,
-  hasSubmit: o,
-  submitText: i,
+  hasSubmit: i,
+  submitText: o,
   handleSubmit: l,
-  hasReset: b,
-  resetText: d,
-  handleReset: m,
-  hasCancel: c,
+  hasReset: m,
+  resetText: r,
+  handleReset: d,
+  hasCancel: h,
   cancelText: f,
-  handleCancel: $
-}) => /* @__PURE__ */ g(he, { className: "form-main-button-container", children: [
-  o && /* @__PURE__ */ a(x, { id: `form-${t}-submit`, buttonType: "submit", text: i ?? "Submit", onClick: l, className: "submit-form-btn" }),
-  b && /* @__PURE__ */ a(x, { id: `form-${t}-edit`, buttonType: "button", text: d ?? "Reset", onClick: m, className: "reset-form-btn" }),
-  c && /* @__PURE__ */ a(x, { id: `form-${t}-cancel`, buttonType: "button", text: f ?? "Cancel", onClick: $, className: "cancel-form-btn" })
-] }), M = r.legend`
+  handleCancel: g
+}) => /* @__PURE__ */ u(he, { className: "form-main-button-container", children: [
+  i && /* @__PURE__ */ a(x, { id: `form-${t}-submit`, buttonType: "submit", text: o ?? "Submit", onClick: l, className: "submit-form-btn" }),
+  m && /* @__PURE__ */ a(x, { id: `form-${t}-edit`, buttonType: "button", text: r ?? "Reset", onClick: d, className: "reset-form-btn" }),
+  h && /* @__PURE__ */ a(x, { id: `form-${t}-cancel`, buttonType: "button", text: f ?? "Cancel", onClick: g, className: "cancel-form-btn" })
+] }), M = c.legend`
     font-size: ${e.spacing.medium};
     font-weight: 500;
     margin-bottom: ${e.spacing.small};
     width: auto;
     text-align: center;
     font-family: ${e.fonts.secondary}, ${e.fonts.fallback};
-`, U = r.fieldset`
+`, U = c.fieldset`
     padding: 0;
     height: auto;
     width: 100%;
-`, H = r.div`
+`, H = c.div`
     padding: ${e.spacing.small};
     height: auto;
     width: 100%;
-`, I = r.div`
+`, I = c.div`
     display: flex;
     justify-content: center;
     align-items: center;
@@ -426,16 +427,16 @@ const e = {
     font-family: ${e.fonts.tertiary}, ${e.fonts.fallback};
     font-size: ${e.fontSize.xsmall};
     font-weight: ${e.fontWeight.bold};
-`, ge = r.form`
+`, ue = c.form`
     display: flex;
     flex-direction: column;
     align-items: center;
     width: 100%;
-`, O = r.div`
+`, O = c.div`
     display: flex;
     justify-content: space-between;
     width: 100%;
-`, ue = r.div`
+`, ge = c.div`
     width: 100%;
     display: flex;
     flex-direction: column;
@@ -443,15 +444,15 @@ const e = {
     justify-content: center;
 `, Ce = ({
   fieldsets: t = null,
-  legendText: o,
-  isExpandable: i,
+  legendText: i,
+  isExpandable: o,
   id: l,
-  formInputs: b,
-  labelAndInputContainerClass: d,
-  labelClass: m,
-  inputClass: c,
+  formInputs: m,
+  labelAndInputContainerClass: r,
+  labelClass: d,
+  inputClass: h,
   onChangeOfEditableOption: f,
-  handleAddingInputEntry: $,
+  handleAddingInputEntry: g,
   hasSubmit: N = !1,
   submitText: p,
   handleSubmit: C,
@@ -464,20 +465,20 @@ const e = {
   handleSubmitForm: z,
   className: T,
   children: j
-}) => /* @__PURE__ */ g(ge, { id: `${l}-form`, className: T, onSubmit: z, children: [
-  t ? t.map((n, u) => /* @__PURE__ */ g(H, { className: `${l}-fieldset-wrapper`, children: [
-    /* @__PURE__ */ g(U, { id: `${l}-form-fieldset-${u}`, className: `${n.legend}-fieldset`, children: [
+}) => /* @__PURE__ */ u(ue, { id: `${l}-form`, className: T, onSubmit: z, children: [
+  t ? t.map((n, $) => /* @__PURE__ */ u(H, { className: `${l}-fieldset-wrapper`, children: [
+    /* @__PURE__ */ u(U, { id: `${l}-form-fieldset-${$}`, className: `${n.legend}-fieldset`, children: [
       n.legend && /* @__PURE__ */ a(M, { className: `${n.legend}-legend`, children: n.legend }),
-      n.inputs.length !== 0 ? n.inputs.map((s, k) => /* @__PURE__ */ g(q.Fragment, { children: [
+      n.inputs.length !== 0 ? n.inputs.map((s, k) => /* @__PURE__ */ u(q.Fragment, { children: [
         s.type === "textarea" && /* @__PURE__ */ a(
           E,
           {
             ...s,
             id: s.id ?? `${n.legend}-input`,
-            labelClass: m,
-            inputClass: c,
+            labelClass: d,
+            inputClass: h,
             idx: k,
-            className: `${d} ${s?.uniqueClass}`
+            className: `${r} ${s?.uniqueClass}`
           }
         ),
         s.type !== "textarea" && s.type !== "radio" && s.type !== "checkbox" && /* @__PURE__ */ a(
@@ -485,28 +486,29 @@ const e = {
           {
             ...s,
             id: s.id ?? `${n.legend}-input`,
-            labelClass: m,
-            inputClass: c,
+            labelClass: d,
+            inputClass: h,
             idx: k,
-            className: `${d} ${s?.uniqueClass}`
+            className: `${r} ${s?.uniqueClass}`
           }
         ),
-        (s.type === "radio" || s.type === "checkbox") && /* @__PURE__ */ g(R, { children: [
+        (s.type === "radio" || s.type === "checkbox") && /* @__PURE__ */ u(R, { children: [
           /* @__PURE__ */ a(
             E,
             {
               ...s,
               id: s.id ?? `${n.legend}-input`,
-              labelClass: m,
-              inputClass: c,
+              labelClass: d,
+              inputClass: h,
               idx: k,
-              className: `${d} ${s?.uniqueClass}`
+              className: `${r} ${s?.uniqueClass}`
             }
           ),
           s.editing && s.isEditable && /* @__PURE__ */ a(
             P,
             {
               legend: `${n.legend}`,
+              fieldsetIndex: $,
               idx: k,
               editableInformation: s?.editableInformation || [],
               onChangeOfEditableOption: f,
@@ -521,50 +523,50 @@ const e = {
         ] })
       ] }, `form-${l}-${k}`)) : n.isExpandable ? /* @__PURE__ */ a(I, { children: `No entry yet on ${n.legend}. Click "+" button to add entry.` }) : ""
     ] }),
-    n.isExpandable && /* @__PURE__ */ a(O, { className: "add-input-button-space", children: /* @__PURE__ */ a(x, { id: `expand-${n.legend}-inputs`, buttonType: "button", text: "+", onClick: $, className: "add-input-entry" }) })
-  ] }, `${n.legend}-${u}`)) : /* @__PURE__ */ g(H, { className: `${l}-fieldset-wrapper`, children: [
-    /* @__PURE__ */ g(U, { id: `${l}-form-fieldset`, className: `${o}-fieldset`, children: [
-      o && /* @__PURE__ */ a(M, { className: `${o}-legend`, children: o }),
-      !t && b && b.length !== 0 ? b.map((n, u) => /* @__PURE__ */ g(q.Fragment, { children: [
+    n.isExpandable && /* @__PURE__ */ a(O, { className: "add-input-button-space", children: /* @__PURE__ */ a(x, { id: `expand-${n.legend}-inputs`, buttonType: "button", text: "+", onClick: g, className: "add-input-entry", dataAttributes: { "data-fieldsetidx": $ } }) })
+  ] }, `${n.legend}-${$}`)) : /* @__PURE__ */ u(H, { className: `${l}-fieldset-wrapper`, children: [
+    /* @__PURE__ */ u(U, { id: `${l}-form-fieldset`, className: `${i}-fieldset`, children: [
+      i && /* @__PURE__ */ a(M, { className: `${i}-legend`, children: i }),
+      !t && m && m.length !== 0 ? m.map((n, $) => /* @__PURE__ */ u(q.Fragment, { children: [
         n.type === "textarea" && /* @__PURE__ */ a(
           E,
           {
             ...n,
-            id: n.id ?? `${o}-input`,
-            labelClass: m,
-            inputClass: c,
-            idx: u,
-            className: `${d} ${n?.uniqueClass}`
+            id: n.id ?? `${i}-input`,
+            labelClass: d,
+            inputClass: h,
+            idx: $,
+            className: `${r} ${n?.uniqueClass}`
           }
         ),
         n.type !== "textarea" && n.type !== "radio" && n.type !== "checkbox" && /* @__PURE__ */ a(
           E,
           {
             ...n,
-            id: n.id ?? `${o}-input`,
-            labelClass: m,
-            inputClass: c,
-            idx: u,
-            className: `${d} ${n?.uniqueClass}`
+            id: n.id ?? `${i}-input`,
+            labelClass: d,
+            inputClass: h,
+            idx: $,
+            className: `${r} ${n?.uniqueClass}`
           }
         ),
-        (n.type === "radio" || n.type === "checkbox") && /* @__PURE__ */ g(R, { children: [
+        (n.type === "radio" || n.type === "checkbox") && /* @__PURE__ */ u(R, { children: [
           /* @__PURE__ */ a(
             E,
             {
               ...n,
-              id: n.id ?? `${o}-input`,
-              labelClass: m,
-              inputClass: c,
-              idx: u,
-              className: `${d} ${n?.uniqueClass}`
+              id: n.id ?? `${i}-input`,
+              labelClass: d,
+              inputClass: h,
+              idx: $,
+              className: `${r} ${n?.uniqueClass}`
             }
           ),
           n.editing && n.isEditable && /* @__PURE__ */ a(
             P,
             {
-              legend: `${o}`,
-              idx: u,
+              legend: `${i}`,
+              idx: $,
               editableInformation: n?.editableInformation,
               onChangeOfEditableOption: f,
               onClickSaveEdit: n?.onClickSave || ((s) => {
@@ -576,9 +578,9 @@ const e = {
             }
           )
         ] })
-      ] }, `form-${l}-${u}`)) : i ? /* @__PURE__ */ a(I, { children: `No entry yet on ${o}. Please click "+" button to add` }) : ""
+      ] }, `form-${l}-${$}`)) : o ? /* @__PURE__ */ a(I, { children: `No entry yet on ${i}. Please click "+" button to add` }) : ""
     ] }),
-    i && /* @__PURE__ */ a(O, { className: "add-input-button-space", children: /* @__PURE__ */ a(x, { id: `expand-${o}-inputs`, buttonType: "button", text: "+", onClick: $, className: "add-input-entry" }) })
+    o && /* @__PURE__ */ a(O, { className: "add-input-button-space", children: /* @__PURE__ */ a(x, { id: `expand-${i}-inputs`, buttonType: "button", text: "+", onClick: g, className: "add-input-entry" }) })
   ] }),
   /* @__PURE__ */ a(
     fe,
@@ -595,11 +597,11 @@ const e = {
       handleCancel: S
     }
   ),
-  /* @__PURE__ */ a(ue, { className: "children-container", children: j })
+  /* @__PURE__ */ a(ge, { className: "children-container", children: j })
 ] }), $e = (t) => {
-  const o = /^#([0-9A-Fa-f]{3}){1,2}$/, i = /^rgb(a)?\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}(?:\s*,\s*(0|1|0?\.\d+))?\s*\)$/;
-  return o.test(t) || i.test(t) || CSS.supports("color", t);
-}, h = (t) => {
+  const i = /^#([0-9A-Fa-f]{3}){1,2}$/, o = /^rgb(a)?\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}(?:\s*,\s*(0|1|0?\.\d+))?\s*\)$/;
+  return i.test(t) || o.test(t) || CSS.supports("color", t);
+}, b = (t) => {
   if (!$e(t)) throw new Error(`Invalid color: ${t}`);
   return t;
 }, we = {
@@ -614,42 +616,42 @@ const e = {
 }, xe = {
   name: "light",
   colors: {
-    text: h("#333446"),
-    bg: h("#EEEEEE"),
-    blue: h("#7F8CAA"),
-    blue2: h("#80A6FF"),
-    teal: h("#5b8280ff"),
-    teal2: h("#AEEAE7"),
-    gray: h("#AEAEAE"),
-    information: h("#202234"),
-    success: h("#123524"),
-    warning: h("#F2C265"),
-    error: h("#990000")
+    text: b("#333446"),
+    bg: b("#EEEEEE"),
+    blue: b("#7F8CAA"),
+    blue2: b("#80A6FF"),
+    teal: b("#5b8280ff"),
+    teal2: b("#AEEAE7"),
+    gray: b("#AEAEAE"),
+    information: b("#202234"),
+    success: b("#123524"),
+    warning: b("#F2C265"),
+    error: b("#990000")
   }
 }, pe = {
   name: "dark",
   colors: {
-    bg: h("#333446"),
-    text: h("#EEEEEE"),
-    blue: h("#80A6FF"),
-    blue2: h("#7F8CAA"),
-    teal: h("#AEEAE7"),
-    teal2: h("#5b8280ff"),
-    gray: h("#D0D0DD"),
-    information: h("#C9E6F0"),
-    success: h("#9EDF9C"),
-    warning: h("#FCFFC1"),
-    error: h("#FAD4D4")
+    bg: b("#333446"),
+    text: b("#EEEEEE"),
+    blue: b("#80A6FF"),
+    blue2: b("#7F8CAA"),
+    teal: b("#AEEAE7"),
+    teal2: b("#5b8280ff"),
+    gray: b("#D0D0DD"),
+    information: b("#C9E6F0"),
+    success: b("#9EDF9C"),
+    warning: b("#FCFFC1"),
+    error: b("#FAD4D4")
   }
 }, G = K({}), Fe = ({
   children: t,
-  initialTheme: o = xe,
-  secondTheme: i = pe
+  initialTheme: i = xe,
+  secondTheme: o = pe
 }) => {
-  const [l, b] = Q(o), d = () => {
-    b((m) => m === o ? i : o);
+  const [l, m] = Q(i), r = () => {
+    m((d) => d === i ? o : i);
   };
-  return /* @__PURE__ */ a(G.Provider, { value: { currentTheme: l, toggleTheme: d }, children: /* @__PURE__ */ a(X, { theme: l, children: t }) });
+  return /* @__PURE__ */ a(G.Provider, { value: { currentTheme: l, toggleTheme: r }, children: /* @__PURE__ */ a(X, { theme: l, children: t }) });
 }, Ee = () => V(G);
 export {
   Ce as DynamicForm,

package/dist/type/propTypes.d.ts

@@ -8,7 +8,7 @@ export type ChildrenProp = {
     children: React.ReactNode;
 };
 type stringType = string | undefined;
-type dataAttributesType = Record<string, string | number | boolean> | undefined;
+type dataAttributesType = Record<string, string | number | boolean | null> | undefined;
 type ButtonType = 'button' | 'submit';
 export interface ButtonProps {
     onClick: React.MouseEventHandler<HTMLButtonElement> | undefined;
@@ -56,7 +56,7 @@ export type InputProps = GeneralInput | TextAreaInput | CheckedInput;
 export interface LabelProps {
     htmlFor?: string;
     textLabel?: string | undefined;
-    additionalInfo: string;
+    additionalInfo?: string | undefined;
     $labelFlexDirection?: React.CSSProperties['flexDirection'];
     source?: string;
     svg?: React.ReactNode;
@@ -94,6 +94,7 @@ export interface EditableInformation {
 }
 export interface NestedEditableOptionProps {
     legend?: string;
+    fieldsetIndex?: number | null;
     idx: number;
     editableInformation: EditableInformation[];
     onChangeOfEditableOption: React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement> | undefined;

package/dist/type/propTypes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"propTypes.d.ts","sourceRoot":"","sources":["../../src/type/propTypes.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"propTypes.d.ts","sourceRoot":"","sources":["../../src/type/propTypes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,MAAM,WAAW,iBAAiB;IAC9B,YAAY,EAAE,KAAK,CAAC;IACpB,WAAW,EAAE,MAAM,IAAI,CAAC;CAC3B;AACD,MAAM,MAAM,YAAY,GAAG;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B,CAAC;AACF,KAAK,UAAU,GAAG,MAAM,GAAG,SAAS,CAAC;AACrC,KAAK,kBAAkB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC;AACvF,KAAK,UAAU,GAAG,QAAQ,GAAG,QAAQ,CAAC;AACtC,MAAM,WAAW,WAAW;IACxB,OAAO,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,SAAS,CAAC;IAChE,EAAE,EAAE,MAAM,CAAC;IACX,UAAU,EAAE,UAAU,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACtC,cAAc,CAAC,EAAE,kBAAkB,CAAC;CACvC;AACD,OAAO,CAAC,MAAM,UAAU,EAAE,SAAS,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;AAC7H,MAAM,WAAW,SAAS;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,GAAG,SAAS,CAAC;IACxF,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,IAAI,EAAE,MAAM,CAAC;CAChB;AACD,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC5C,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CAChB;AACD,MAAM,WAAW,YAAa,SAAQ,SAAS;IAC3C,IAAI,EAAE,OAAO,GAAG,UAAU,CAAC;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,CAAC,EAAE,KAAK,CAAC;CAC3B;AACD,MAAM,WAAW,YAAa,SAAQ,SAAS;IAC3C,IAAI,EAAE,OAAO,CAAC,OAAO,UAAU,CAAC,MAAM,CAAC,EAAE,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC,CAAC;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,UAAU,CAAC;IACrB,eAAe,CAAC,EAAE,UAAU,CAAC;IAC7B,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,KAAK,CAAC;CAChB;AACD,MAAM,MAAM,UAAU,GAAG,YAAY,GAAG,aAAa,GAAG,YAAY,CAAC;AACrE,MAAM,WAAW,UAAU;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC,mBAAmB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;IAC3D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,SAAS,CAAC,EAAE,UAAU,CAAC;CAC1B;AACD,MAAM,MAAM,kBAAkB,GAAG;IAC7B,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACzD,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,aAAa,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC3D,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,CAAC;CAC3D,CAAC;AACF,MAAM,MAAM,sBAAsB,GAAG,UAAU,GAAG,YAAY,GAAG,kBAAkB,CAAC;AACpF,MAAM,MAAM,eAAe,GAAG,CAAC,UAAU,GAAG,aAAa,GAAG,kBAAkB,CAAC,GAAG,CAAC,UAAU,GAAG,YAAY,GAAG,kBAAkB,CAAC,CAAC;AACnI,MAAM,WAAW,sBAAsB;IACnC,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACzD,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACxD,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CAC5D;AACD,MAAM,WAAW,mBAAmB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,OAAO,UAAU,CAAC,MAAM,CAAC,CAAC;CACnC;AACD,MAAM,WAAW,yBAAyB;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,mBAAmB,EAAE,mBAAmB,EAAE,CAAC;IAC3C,wBAAwB,EAAE,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,GAAG,SAAS,CAAC;IACvG,eAAe,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC7D,iBAAiB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/D,kBAAkB,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CACnE;AACD,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,OAAO,EAAE,CAAC,SAAS,sBAAsB,GAAG,eAAe,IAAI,CAAC,GAAG;IACrG,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,CAAC,CAAC;CACjB,GAAG,CAAC,CAAC,SAAS,IAAI,GAAG,CAAC,SAAS,sBAAsB,GAAG;IACrD,mBAAmB,EAAE,mBAAmB,EAAE,CAAC;IAC3C,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACzD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,aAAa,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC3D,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,WAAW,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACzD,aAAa,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CAC9D,GAAG;IACA,mBAAmB,CAAC,EAAE,KAAK,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,aAAa,CAAC,EAAE,KAAK,CAAC;CACzB,GAAG;IACA,mBAAmB,CAAC,EAAE,KAAK,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,aAAa,CAAC,EAAE,KAAK,CAAC;CACzB,CAAC,CAAC;AACH,MAAM,WAAW,aAAa;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,KAAK,CAAC,eAAe,CAAC,IAAI,EAAE,sBAAsB,GAAG,eAAe,CAAC,GAAG,eAAe,CAAC,KAAK,EAAE,sBAAsB,GAAG,eAAe,CAAC,CAAC,CAAC;IAClJ,YAAY,EAAE,OAAO,CAAC;CACzB;AACD,KAAK,mBAAmB,CAAC,CAAC,IAAI,CAAC,SAAS,KAAK,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,SAAS;IACrE,UAAU,EAAE,IAAI,CAAC;CACpB,GAAG;IACA,wBAAwB,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,CAAC;CAC/F,GAAG;IACA,wBAAwB,CAAC,EAAE,KAAK,CAAC;CACpC,GAAG;IACA,wBAAwB,CAAC,EAAE,KAAK,CAAC;CACpC,CAAC;AACF,MAAM,MAAM,gBAAgB,GAAG,sBAAsB,GAAG,CAAC,CAAC;IACtD,SAAS,EAAE,aAAa,EAAE,CAAC;IAC3B,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,UAAU,CAAC,EAAE,KAAK,CAAC;CACtB,GAAG,mBAAmB,CAAC,KAAK,CAAC,eAAe,CAAC,IAAI,EAAE,sBAAsB,GAAG,eAAe,CAAC,GAAG,eAAe,CAAC,KAAK,EAAE,sBAAsB,GAAG,eAAe,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IACnK,SAAS,EAAE,IAAI,CAAC;IAChB,UAAU,EAAE,KAAK,CAAC,eAAe,CAAC,IAAI,EAAE,sBAAsB,GAAG,eAAe,CAAC,GAAG,eAAe,CAAC,KAAK,EAAE,sBAAsB,GAAG,eAAe,CAAC,CAAC,CAAC;IACtJ,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,2BAA2B,CAAC,EAAE,MAAM,CAAC;CACxC,GAAG,mBAAmB,CAAC,KAAK,CAAC,eAAe,CAAC,IAAI,EAAE,sBAAsB,GAAG,eAAe,CAAC,GAAG,eAAe,CAAC,KAAK,EAAE,sBAAsB,GAAG,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IACpK,YAAY,EAAE,IAAI,CAAC;IACnB,sBAAsB,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CACtE,GAAG;IACA,YAAY,EAAE,KAAK,CAAC;IACpB,sBAAsB,CAAC,EAAE,KAAK,CAAC;CAClC,CAAC,GAAG;IACD,EAAE,EAAE,MAAM,CAAC;IACX,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,2BAA2B,CAAC,EAAE,MAAM,CAAC;CACxC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kbgarcia8/react-dynamic-form",
-  "version": "1.1.26",
+  "version": "1.1.27",
   "description": "A form that can be nested with editable, expandable and flexible input-forms",
   "keywords": [
     "form",