@homefile/components-v2 2.8.37 → 2.8.39

package/dist/components/forms/dynamicForm/ItemFormPanel/ItemFormFooter.d.ts

@@ -1,2 +1,2 @@
 import { FormFooterI } from '../../../../interfaces';
-export declare const ItemFormFooter: ({ onSave, onCancel }: FormFooterI) => import("react/jsx-runtime").JSX.Element;
+export declare const ItemFormFooter: ({ onSave, onCancel, onClearForm, onDuplicate }: FormFooterI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/forms/dynamicForm/ItemFormPanel/ItemFormFooter.js

@@ -1,13 +1,23 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { t } from 'i18next';
 import { FooterButtons } from '../../..';
-export const ItemFormFooter = ({ onSave, onCancel }) => {
+export const ItemFormFooter = ({ onSave, onCancel, onClearForm, onDuplicate }) => {
     const buttonsFooter = {
         button1: {
             buttonStyle: 'primaryFooter',
             label: t('buttons.save'),
             onClick: onSave,
         },
+        button2: (onDuplicate == undefined) ? undefined : {
+            buttonStyle: 'secondaryFooter',
+            label: t('Duplicate'),
+            onClick: onDuplicate,
+        },
+        button3: (onClearForm == undefined) ? undefined : {
+            buttonStyle: 'secondaryFooter',
+            label: t('Add Another'),
+            onClick: onClearForm,
+        },
     };
-    return _jsx(FooterButtons, { button1: buttonsFooter.button1 });
+    return _jsx(FooterButtons, { button1: buttonsFooter.button1, button2: buttonsFooter.button2, button3: buttonsFooter.button3 });
 };

package/dist/components/forms/dynamicForm/ItemFormPanel/ItemFormPanel.d.ts

@@ -1,3 +1,3 @@
 import { PropsWithChildren } from 'react';
 import { ItemFormPanelI } from '../../../../interfaces';
-export declare const ItemFormPanel: ({ children, onClose, onSubmitForm, panelIcon, panelTitle, showOverlay, }: PropsWithChildren<ItemFormPanelI>) => import("react/jsx-runtime").JSX.Element;
+export declare const ItemFormPanel: ({ children, onClose, onSubmitForm, panelIcon, panelTitle, showOverlay, onClearForm, onDuplicate }: PropsWithChildren<ItemFormPanelI>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/forms/dynamicForm/ItemFormPanel/ItemFormPanel.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { useMemo } from 'react';
 import { DrawerBody, DrawerHeader, DrawerFooter, Box, } from '@chakra-ui/react';
 import { PanelHeader, FooterDrawer, ItemFormFooter, Overlay, Loading } from '../../..';
-export const ItemFormPanel = ({ children, onClose, onSubmitForm, panelIcon, panelTitle, showOverlay = false, }) => {
+export const ItemFormPanel = ({ children, onClose, onSubmitForm, panelIcon, panelTitle, showOverlay = false, onClearForm, onDuplicate }) => {
     const { firstChild, otherChildren } = useMemo(() => {
         let firstChild = null;
         let otherChildren = children;
@@ -15,5 +15,5 @@ export const ItemFormPanel = ({ children, onClose, onSubmitForm, panelIcon, pane
         }
         return { firstChild, otherChildren };
     }, [children]);
-    return (_jsxs(_Fragment, { children: [_jsx(DrawerHeader, { p: "0", children: _jsx(PanelHeader, { handleCloseButton: onClose, icon: panelIcon, title: panelTitle }) }), _jsx(DrawerBody, { p: "0", overflowX: "hidden", bg: "lightBlue.1", children: firstChild ? (_jsxs(_Fragment, { children: [firstChild, _jsxs(Box, { position: "relative", mb: "200px", children: [_jsx(Overlay, { showOverlay: showOverlay, position: "absolute", w: "inherit", h: "inherit", zIndex: "9" }), otherChildren] })] })) : (_jsx(Loading, {})) }), _jsx(FooterDrawer, { isOpen: !showOverlay, children: _jsx(DrawerFooter, { w: "100%", py: "0", children: _jsx(ItemFormFooter, { onSave: onSubmitForm, onCancel: onClose }) }) })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(DrawerHeader, { p: "0", children: _jsx(PanelHeader, { handleCloseButton: onClose, icon: panelIcon, title: panelTitle }) }), _jsx(DrawerBody, { p: "0", overflowX: "hidden", bg: "lightBlue.1", children: firstChild ? (_jsxs(_Fragment, { children: [firstChild, _jsxs(Box, { position: "relative", mb: "200px", children: [_jsx(Overlay, { showOverlay: showOverlay, position: "absolute", w: "inherit", h: "inherit", zIndex: "9" }), otherChildren] })] })) : (_jsx(Loading, {})) }), _jsx(FooterDrawer, { isOpen: !showOverlay, children: _jsx(DrawerFooter, { w: "100%", py: "0", children: _jsx(ItemFormFooter, { onClearForm: onClearForm, onDuplicate: onDuplicate, onSave: onSubmitForm, onCancel: onClose }) }) })] }));
 };

package/dist/components/forms/readOnly/fields/ReadOnlyGrid.js

@@ -17,7 +17,6 @@ export const ReadOnlyGrid = (_a) => {
     var { children, onClick } = _a, props = __rest(_a, ["children", "onClick"]);
     return (_jsx(Flex, Object.assign({ align: "stretch", gap: "base", borderBottom: "1px dashed", borderColor: "lightBlue.6", p: "base" }, props, { children: children === null || children === void 0 ? void 0 : children.map(({ children, id, name, value, type, icon }) => {
             const baseProps = {
-                key: `${id}-${name}-${value}-${type}`,
                 id,
                 value,
                 icon: icon && fieldIcons[icon],
@@ -31,9 +30,9 @@ export const ReadOnlyGrid = (_a) => {
                 case 'select':
                 case 'string':
                 case 'currency':
-                    return (_jsx(ReadOnlyInput, Object.assign({}, baseProps, { border: "none", flex: "auto", p: "0" })));
+                    return (_jsx(ReadOnlyInput, Object.assign({}, baseProps, { border: "none", flex: "auto", p: "0" }), `${id}-${name}-${value}-${type}`));
                 case 'date':
-                    return _jsx(ReadOnlyDate, Object.assign({}, baseProps, { name: name, p: "0" }));
+                    return _jsx(ReadOnlyDate, Object.assign({}, baseProps, { name: name, p: "0" }), `${id}-${name}-${value}-${type}`);
                 case 'guidelines':
                     return (_jsx(ReadOnlyGuidelines, { name: name, children: children, onClick: onClick }, id));
                 case 'item-related':

package/dist/components/forms/readOnly/fields/ReadOnlyGroup.js

@@ -5,7 +5,6 @@ import { fieldIcons } from '../../../../helpers';
 export const ReadOnlyGroup = ({ children }) => {
     return (_jsx(Stack, { align: "stretch", spacing: "base", p: "base", borderBottom: "1px dashed", borderColor: "lightBlue.6", children: children === null || children === void 0 ? void 0 : children.map(({ children, id, name, value, type, icon }) => {
             const baseProps = {
-                key: `${id}-${name}-${value}-${type}`,
                 id,
                 value,
                 icon: icon && fieldIcons[icon],
@@ -19,7 +18,7 @@ export const ReadOnlyGroup = ({ children }) => {
                 case 'select':
                 case 'string':
                 case 'currency':
-                    return (_jsx(ReadOnlyInput, Object.assign({}, baseProps, { border: "none", flex: "auto", p: "0" })));
+                    return (_jsx(ReadOnlyInput, Object.assign({}, baseProps, { border: "none", flex: "auto", p: "0" }), `${id}-${name}-${value}-${type}`));
                 case 'date':
                     return _jsx(ReadOnlyDate, Object.assign({}, baseProps, { name: name }));
                 case 'grid':

package/dist/interfaces/forms/ItemFormPanel/ItemFormFooter.interface.d.ts

@@ -1,4 +1,6 @@
 export interface FormFooterI {
     onSave: () => void;
     onCancel: () => void;
+    onClearForm?: () => void;
+    onDuplicate?: () => void;
 }

package/dist/interfaces/forms/ItemFormPanel/ItemFormPanel.interface.d.ts

@@ -4,4 +4,6 @@ export interface ItemFormPanelI {
     panelIcon: string;
     panelTitle: string;
     showOverlay?: boolean;
+    onClearForm?: () => void;
+    onDuplicate?: () => void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homefile/components-v2",
-  "version": "2.8.37",
+  "version": "2.8.39",
   "author": "Homefile",
   "license": "UNLICENSED",
   "typings": "dist/index.d.ts",

package/src/components/forms/dynamicForm/ItemFormPanel/ItemFormFooter.tsx

@@ -2,14 +2,24 @@ import { t } from 'i18next'
 import { FooterButtons } from '@/components'
 import { FormFooterI } from '@/interfaces'
 
-export const ItemFormFooter = ({ onSave, onCancel }: FormFooterI) => {
+export const ItemFormFooter = ({ onSave, onCancel, onClearForm, onDuplicate }: FormFooterI) => {
   const buttonsFooter = {
     button1: {
       buttonStyle: 'primaryFooter',
       label: t('buttons.save'),
       onClick: onSave,
     },
+    button2: (onDuplicate == undefined) ? undefined : {
+      buttonStyle: 'secondaryFooter',
+      label: t('Duplicate'),
+      onClick: onDuplicate,
+  },
+      button3: (onClearForm == undefined) ? undefined : {
+      buttonStyle: 'secondaryFooter',
+      label: t('Add Another'),
+      onClick: onClearForm,
+  },
   }
 
-  return <FooterButtons button1={buttonsFooter.button1} />
+  return <FooterButtons button1={buttonsFooter.button1} button2={buttonsFooter.button2} button3={buttonsFooter.button3} />
 }

package/src/components/forms/dynamicForm/ItemFormPanel/ItemFormPanel.tsx

@@ -21,6 +21,8 @@ export const ItemFormPanel = ({
   panelIcon,
   panelTitle,
   showOverlay = false,
+  onClearForm,
+  onDuplicate
 }: PropsWithChildren<ItemFormPanelI>) => {
 
   const { firstChild, otherChildren } = useMemo(() => {
@@ -71,7 +73,7 @@ export const ItemFormPanel = ({
       </DrawerBody>
       <FooterDrawer isOpen={!showOverlay}>
         <DrawerFooter w="100%" py="0">
-          <ItemFormFooter onSave={onSubmitForm} onCancel={onClose} />
+          <ItemFormFooter onClearForm={onClearForm} onDuplicate={onDuplicate} onSave={onSubmitForm} onCancel={onClose} />
         </DrawerFooter>
       </FooterDrawer>
     </>

package/src/components/forms/readOnly/fields/ReadOnlyGrid.tsx

@@ -24,7 +24,6 @@ export const ReadOnlyGrid = ({
     >
       {children?.map(({ children, id, name, value, type, icon }) => {
         const baseProps = {
-          key: `${id}-${name}-${value}-${type}`,
           id,
           value,
           icon: icon && (fieldIcons[icon] as IconTypes),
@@ -39,10 +38,10 @@ export const ReadOnlyGrid = ({
           case 'string':
           case 'currency':
             return (
-              <ReadOnlyInput {...baseProps} border="none" flex="auto" p="0" />
+              <ReadOnlyInput key={`${id}-${name}-${value}-${type}`} {...baseProps} border="none" flex="auto" p="0" />
             )
           case 'date':
-            return <ReadOnlyDate {...baseProps} name={name} p="0" />
+            return <ReadOnlyDate key={`${id}-${name}-${value}-${type}`} {...baseProps} name={name} p="0" />
 
           case 'guidelines':
             return (

package/src/components/forms/readOnly/fields/ReadOnlyGroup.tsx

@@ -3,7 +3,7 @@ import { IconTypes, ReportI } from '@/interfaces'
 import { ReadOnlyDate, ReadOnlyGrid, ReadOnlyInput } from '@/components'
 import { fieldIcons } from '@/helpers'
 
-export const ReadOnlyGroup = ({ children }: Pick<ReportI, 'children'>) => {
+export const ReadOnlyGroup = ({ children}: Pick<ReportI, 'children'>) => {
   return (
     <Stack
       align="stretch"
@@ -14,7 +14,6 @@ export const ReadOnlyGroup = ({ children }: Pick<ReportI, 'children'>) => {
     >
       {children?.map(({ children, id, name, value, type, icon }) => {
         const baseProps = {
-          key: `${id}-${name}-${value}-${type}`,
           id,
           value,
           icon: icon && (fieldIcons[icon] as IconTypes),
@@ -29,7 +28,7 @@ export const ReadOnlyGroup = ({ children }: Pick<ReportI, 'children'>) => {
           case 'string':
           case 'currency':
             return (
-              <ReadOnlyInput {...baseProps} border="none" flex="auto" p="0" />
+              <ReadOnlyInput key={`${id}-${name}-${value}-${type}`} {...baseProps} border="none" flex="auto" p="0" />
             )
           case 'date':
             return <ReadOnlyDate {...baseProps} name={name} />

package/src/interfaces/forms/ItemFormPanel/ItemFormFooter.interface.ts

@@ -1,4 +1,6 @@
 export interface FormFooterI {
   onSave: () => void
   onCancel: () => void
+  onClearForm?: () => void
+  onDuplicate?: () => void
 }

package/src/interfaces/forms/ItemFormPanel/ItemFormPanel.interface.ts

@@ -4,4 +4,6 @@ export interface ItemFormPanelI {
   panelIcon: string
   panelTitle: string
   showOverlay?: boolean
+  onClearForm?: () => void
+  onDuplicate?: () => void
 }