@homefile/components-v2 2.24.22 → 2.24.24

package/dist/components/receipts/AssignableReceiptCard.js

@@ -6,7 +6,7 @@ import { formatCurrency, formatDateWithAt } from '../../utils';
 export const AssignableReceiptCard = ({ isChecked, itemQuantity = 1, onChange, purchaseDate = new Date(), origin = '', total = '0', }) => {
     const date = formatDateWithAt({ date: purchaseDate });
     const totalFormatted = formatCurrency({ value: total });
-    const totalItems = itemQuantity > 1
+    const totalItems = Number(itemQuantity) > 1
         ? `${itemQuantity} ${t('receipts.items')}`
         : `${itemQuantity} ${t('receipts.item')}`;
     return (_jsxs(Flex, { bg: "lightBlue.2", gap: "4", borderTop: "1px solid", borderColor: "lightBlue.2", children: [_jsx(Checkbox, { isChecked: isChecked, onChange: onChange }), _jsx(Stack, { w: "100%", p: "base", bg: isChecked ? 'lightGreen.1' : 'neutral.white', spacing: "1", children: _jsxs(Flex, { align: "center", gap: "base", children: [_jsx(Image, { src: getReceiptOrigin(origin), w: "auto", h: ["40px", "69px"], fit: "contain" }), _jsxs(Stack, { w: "100%", spacing: "1", children: [_jsx(Text, { fontSize: "xxs", children: date }), _jsx(Text, { textTransform: "capitalize", children: `${origin} ${t('receipts.receipt')}` }), _jsxs(Flex, { align: "baseline", justify: "flex-end", gap: "4", children: [_jsx(Text, { fontSize: "xs", fontFamily: "secondary", textTransform: "uppercase", children: totalItems }), _jsx(Text, { children: totalFormatted })] })] })] }) })] }));

package/dist/components/receipts/receipt/ReceiptItemAssigned.d.ts

@@ -1,2 +1,2 @@
 import { ReceiptItemI } from '../../../interfaces';
-export declare const ReceiptItemAssigned: ({ icon, isChecked, itemPrice, onChange, onSelectedChange, onRoomClick, total, quantity, roomId, roomType, sku, title, variant, }: ReceiptItemI) => import("react/jsx-runtime").JSX.Element;
+export declare const ReceiptItemAssigned: ({ icon, isChecked, itemPrice, onChange, onSelectedChange, onRoomClick, onEditClick, total, quantity, roomId, roomType, sku, title, variant, }: ReceiptItemI) => import("react/jsx-runtime").JSX.Element;

package/dist/components/receipts/receipt/ReceiptItemAssigned.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Flex, Stack } from '@chakra-ui/react';
+import { Flex, Stack, IconButton } from '@chakra-ui/react';
 import { Price } from '../../../assets/images';
-import { Overlay, ReceiptItemBody, ReceiptItemContainer, ReceiptItemHeader, ReceiptRoom, } from '../..';
-export const ReceiptItemAssigned = ({ icon = Price, isChecked, itemPrice, onChange, onSelectedChange = () => { }, onRoomClick = () => { }, total, quantity, roomId = '', roomType, sku, title, variant = 'secondary', }) => {
-    return (_jsx(ReceiptItemContainer, { isChecked: isChecked, onChange: onChange, children: _jsxs(Flex, { flex: "auto", children: [roomType && (_jsx(ReceiptRoom, { roomType: roomType, roomId: roomId, onClick: onRoomClick })), _jsxs(Stack, { p: "base", bg: "lightGreen.1", spacing: "1", justify: "space-between", position: "relative", flex: "1", children: [!isChecked && (_jsx(Overlay, { position: "absolute", w: "inherit", h: "inherit", bg: "#F0F8F080" })), _jsx(ReceiptItemHeader, { icon: icon, sku: sku, onSelectedChange: onSelectedChange, variant: variant }), _jsx(ReceiptItemBody, { isTitleItalic: !isChecked, itemPrice: itemPrice, quantity: quantity, title: title, total: total })] })] }) }));
+import { t } from 'i18next';
+import { Overlay, ReceiptItemBody, ReceiptItemContainer, ReceiptItemHeader, ReceiptRoom, Edit } from '../..';
+export const ReceiptItemAssigned = ({ icon = Price, isChecked, itemPrice, onChange, onSelectedChange = () => { }, onRoomClick = () => { }, onEditClick, total, quantity, roomId = '', roomType, sku, title, variant = 'secondary', }) => {
+    return (_jsx(ReceiptItemContainer, { isChecked: isChecked, onChange: onChange, children: _jsxs(Flex, { flex: "auto", children: [roomType && (_jsx(ReceiptRoom, { roomType: roomType, roomId: roomId, onClick: onRoomClick })), _jsxs(Stack, { p: "base", bg: "lightGreen.1", spacing: "1", justify: "space-between", position: "relative", flex: "1", children: [!isChecked && (_jsx(Overlay, { position: "absolute", w: "inherit", h: "inherit", bg: "#F0F8F080" })), _jsxs(Flex, { align: "center", justify: "space-between", children: [_jsx(ReceiptItemHeader, { icon: icon, sku: sku, onSelectedChange: onSelectedChange, variant: variant }), onEditClick && (_jsx(IconButton, { variant: "menuIconWithShadow", maxW: "fit-content", "aria-label": t('ariaLabels.edit'), p: "1", icon: _jsx(Edit, {}), onClick: onEditClick }))] }), _jsx(ReceiptItemBody, { isTitleItalic: !isChecked, itemPrice: itemPrice, quantity: quantity, title: title, total: total })] })] }) }));
 };

package/dist/components/receipts/receipt/ReceiptItems.js

@@ -10,6 +10,6 @@ export const ReceiptItems = ({ isSelectDisabled = true, leftOptions = [], onItem
     });
     return (_jsxs(Box, { mb: "10rem", children: [_jsxs(Stack, { bg: "lightBlue.2", px: "4", pb: "base", pt: "2", children: [_jsx(Text, { textTransform: "uppercase", variant: "home", children: title }), _jsxs(Flex, { gap: "base", align: "center", children: [_jsx(Checkbox, { onChange: handleSelectAll }), _jsx(DoubleSelects, { isSelectDisabled: isSelectDisabled, leftOptions: leftOptions, rightOptions: rightOptions, onLeftSelectChange: onLeftSelectChange, onRightSelectChange: onRightSelectChange })] })] }), receipts.map((receipt) => {
                 const hasRoomType = !!(receipt === null || receipt === void 0 ? void 0 : receipt.roomType);
-                return (_jsxs(Box, { children: [!hasRoomType && (_jsx(ReceiptItem, Object.assign({ onChange: () => handleItemSelect(receipt._id), isChecked: isItemSelected(receipt._id), onSelectedChange: onReceiptSelectedChange, onEditClick: () => onEditReceipt === null || onEditReceipt === void 0 ? void 0 : onEditReceipt(receipt._id), selectItems: receiptOptions, variant: variant }, receipt))), hasRoomType && (_jsx(ReceiptItemAssigned, Object.assign({ onChange: () => handleItemSelect(receipt._id), onRoomClick: onRoomClick, isChecked: isItemSelected(receipt._id), onSelectedChange: onReceiptSelectedChange, initialSelectValue: receiptOptions === null || receiptOptions === void 0 ? void 0 : receiptOptions[1], selectItems: receiptOptions, variant: variant }, receipt)))] }, receipt._id));
+                return (_jsxs(Box, { children: [!hasRoomType && (_jsx(ReceiptItem, Object.assign({ onChange: () => handleItemSelect(receipt._id), isChecked: isItemSelected(receipt._id), onSelectedChange: onReceiptSelectedChange, onEditClick: () => onEditReceipt === null || onEditReceipt === void 0 ? void 0 : onEditReceipt(receipt._id), selectItems: receiptOptions, variant: variant }, receipt))), hasRoomType && (_jsx(ReceiptItemAssigned, Object.assign({ onChange: () => handleItemSelect(receipt._id), onRoomClick: onRoomClick, isChecked: isItemSelected(receipt._id), onSelectedChange: onReceiptSelectedChange, onEditClick: () => onEditReceipt === null || onEditReceipt === void 0 ? void 0 : onEditReceipt(receipt._id), initialSelectValue: receiptOptions === null || receiptOptions === void 0 ? void 0 : receiptOptions[1], selectItems: receiptOptions, variant: variant }, receipt)))] }, receipt._id));
             })] }));
 };

package/dist/hooks/receipts/useDisplayReceipts.d.ts

@@ -11,7 +11,7 @@ export declare const useDisplayReceipts: ({ receipts }: UseDisplayReceiptsI) =>
         cashier?: string;
         createAt?: Date;
         home?: string | null;
-        itemQuantity: number;
+        itemQuantity: number | string;
         name?: string;
         paymentMethod: string;
         purchaseDate?: Date;

package/dist/interfaces/receipts/receipt/ReceiptDetails.interface.d.ts

@@ -14,7 +14,7 @@ export interface ReceiptDetailsDBI {
     cashier?: string;
     createAt?: Date;
     home?: string | null;
-    itemQuantity: number;
+    itemQuantity: number | string;
     name?: string;
     paymentMethod: string;
     purchaseDate?: Date;

package/dist/stories/receipts/displayReceipts/GridReceipt.stories.d.ts

@@ -11,7 +11,7 @@ export declare const GridReceiptComponent: {
         cashier?: string;
         createAt?: Date;
         home?: string | null;
-        itemQuantity: number;
+        itemQuantity: number | string;
         name?: string;
         paymentMethod: string;
         purchaseDate?: Date;

package/dist/stories/receipts/displayReceipts/ItemReceipt.stories.d.ts

@@ -11,7 +11,7 @@ export declare const ItemReceiptComponent: {
         cashier?: string;
         createAt?: Date;
         home?: string | null;
-        itemQuantity: number;
+        itemQuantity: number | string;
         name?: string;
         paymentMethod: string;
         purchaseDate?: Date;

package/dist/stories/receipts/displayReceipts/ListReceipt.stories.d.ts

@@ -11,7 +11,7 @@ export declare const ListReceiptComponent: {
         cashier?: string;
         createAt?: Date;
         home?: string | null;
-        itemQuantity: number;
+        itemQuantity: number | string;
         name?: string;
         paymentMethod: string;
         purchaseDate?: Date;

package/package.json

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

package/src/components/receipts/AssignableReceiptCard.tsx

@@ -15,7 +15,7 @@ export const AssignableReceiptCard = ({
   const date = formatDateWithAt({ date: purchaseDate })
   const totalFormatted = formatCurrency({ value: total })
   const totalItems =
-    itemQuantity > 1
+    Number(itemQuantity) > 1
       ? `${itemQuantity} ${t('receipts.items')}`
       : `${itemQuantity} ${t('receipts.item')}`
   return (

package/src/components/receipts/receipt/ReceiptItemAssigned.tsx

@@ -1,12 +1,14 @@
-import { Flex, Stack } from '@chakra-ui/react'
+import { Flex, Stack, IconButton } from '@chakra-ui/react'
 import { ReceiptItemI } from '@/interfaces'
 import { Price } from '@/assets/images'
+import { t } from 'i18next'
 import {
   Overlay,
   ReceiptItemBody,
   ReceiptItemContainer,
   ReceiptItemHeader,
   ReceiptRoom,
+  Edit
 } from '@/components'
 
 export const ReceiptItemAssigned = ({
@@ -16,6 +18,7 @@ export const ReceiptItemAssigned = ({
   onChange,
   onSelectedChange = () => {},
   onRoomClick = () => {},
+  onEditClick,
   total,
   quantity,
   roomId = '',
@@ -50,12 +53,24 @@ export const ReceiptItemAssigned = ({
               bg="#F0F8F080"
             />
           )}
-          <ReceiptItemHeader
-            icon={icon}
-            sku={sku}
-            onSelectedChange={onSelectedChange}
-            variant={variant}
-          />
+          <Flex align="center" justify="space-between">
+            <ReceiptItemHeader
+              icon={icon}
+              sku={sku}
+              onSelectedChange={onSelectedChange}
+              variant={variant}
+            />
+            {onEditClick && (
+              <IconButton
+                variant="menuIconWithShadow"
+                maxW="fit-content"
+                aria-label={t('ariaLabels.edit')}
+                p="1"
+                icon={<Edit />}
+                onClick={onEditClick}
+              />
+            )}
+          </Flex>
           <ReceiptItemBody
             isTitleItalic={!isChecked}
             itemPrice={itemPrice}

package/src/components/receipts/receipt/ReceiptItems.tsx

@@ -63,6 +63,7 @@ export const ReceiptItems = ({
                 onRoomClick={onRoomClick}
                 isChecked={isItemSelected(receipt._id)}
                 onSelectedChange={onReceiptSelectedChange}
+                onEditClick={() => onEditReceipt?.(receipt._id)}
                 initialSelectValue={receiptOptions?.[1]}
                 selectItems={receiptOptions}
                 variant={variant}

package/src/interfaces/receipts/receipt/ReceiptDetails.interface.ts

@@ -17,7 +17,7 @@ export interface ReceiptDetailsDBI {
   cashier?: string
   createAt?: Date
   home?: string | null
-  itemQuantity: number
+  itemQuantity: number | string
   name?: string
   paymentMethod: string
   purchaseDate?: Date