@weareconceptstudio/account 0.5.9 → 0.6.0

package/dist/AccountProvider.d.ts

@@ -1,5 +1,5 @@
 export function useAccountContext(): any;
-export function AccountProvider({ fontFamily, shopUrl, children, maxQty, currency, addressType, addressFormFields, useUser, useCart, productPopup, productUrlPrefix }: {
+export function AccountProvider({ fontFamily, shopUrl, children, maxQty, currency, addressType, addressFormFields, useUser, productPopup, productUrlPrefix }: {
     fontFamily?: string;
     shopUrl?: string;
     children: any;
@@ -8,7 +8,6 @@ export function AccountProvider({ fontFamily, shopUrl, children, maxQty, currenc
     addressType: any;
     addressFormFields: any;
     useUser: any;
-    useCart: any;
     productPopup: any;
     productUrlPrefix: any;
 }): React.JSX.Element;

package/dist/AccountProvider.js

@@ -2,7 +2,7 @@ import React, { createContext, useCallback, useContext, useEffect } from 'react'
 import { useTranslation, useUi } from '@weareconceptstudio/core';
 import { ThemeProvider } from 'styled-components';
 import { AddressProvider } from './modules/address/AddressProvider';
-import { CheckoutProvider } from './modules/checkout/CheckoutProvider';
+import { CartProvider } from './modules/cart/CartProvider';
 //* Translations
 import translations from './translations';
 //* Styles
@@ -15,7 +15,7 @@ export const useAccountContext = () => {
     const context = useContext(AccountContext);
     return context;
 };
-export const AccountProvider = ({ fontFamily = 'core_Font', shopUrl = '/', children, maxQty = 99, currency, addressType, addressFormFields, useUser, useCart, productPopup, productUrlPrefix }) => {
+export const AccountProvider = ({ fontFamily = 'core_Font', shopUrl = '/', children, maxQty = 99, currency, addressType, addressFormFields, useUser, productPopup, productUrlPrefix }) => {
     const { addTranslation } = useTranslation();
     const { openPopup } = useUi();
     const paymentOptions = [
@@ -51,9 +51,9 @@ export const AccountProvider = ({ fontFamily = 'core_Font', shopUrl = '/', child
             openPopup(productPopup, { ...product, className: 'popup-product-block' });
         }
     }, [productUrlPrefix, productPopup]);
-    return (React.createElement(AccountContext.Provider, { value: { currency, maxQty, shopUrl, useUser, useCart, handleProductClick, paymentOptions } },
-        React.createElement(CheckoutProvider, null,
-            React.createElement(AddressProvider, { useUser: useUser, useCart: useCart, addressType: addressType, addressFormFields: addressFormFields },
+    return (React.createElement(AccountContext.Provider, { value: { currency, maxQty, shopUrl, useUser, handleProductClick, paymentOptions } },
+        React.createElement(CartProvider, { useUser: useUser },
+            React.createElement(AddressProvider, { useUser: useUser, addressType: addressType, addressFormFields: addressFormFields },
                 React.createElement(ThemeProvider, { theme: theme },
                     React.createElement(AccountVariables, { fontFamily: fontFamily }),
                     React.createElement(AccountHelperClass, null),

package/dist/components/AccountCounter/index.js

@@ -1,13 +1,10 @@
 import React, { useState, useCallback, useEffect } from 'react';
 import { Text, debounce } from '@weareconceptstudio/core';
-import { useAccountContext } from '../../AccountProvider';
-import { useCheckoutContext } from '../../modules';
+import { useCart } from '../../modules';
 //* Style
 import AccountCounterStyle from './style';
 const AccountCounter = ({ productId, qty = 1, isGift, maxQty, promotionId }) => {
-    const { useCart } = useAccountContext();
-    const { toggleCartItem, items } = useCart();
-    const { setCheckGift } = useCheckoutContext();
+    const { toggleCartItem, items, setCheckGift } = useCart();
     //! State
     const [count, setCount] = useState(qty);
     useEffect(() => {

package/dist/components/TotalCheckout/BalanceComp/index.js

@@ -2,16 +2,15 @@ import React from 'react';
 import { Text, CollapseItem, handlePriceCheckFunc, useTranslation } from '@weareconceptstudio/core';
 import { FormBuilder } from '@weareconceptstudio/form';
 import { useAccountContext } from '../../../AccountProvider';
-import { useCheckoutContext } from '../../../modules';
+import { useCart } from '../../../modules';
 import AccountButton from '../../AccountButton';
 import { balanceFields } from './utils';
 //* Style
 import BalanceCompStyle from './style';
 const BalanceComp = () => {
     const { translate } = useTranslation();
-    const { useCart, useUser } = useAccountContext();
-    const { currency, itemsCount, useBalance } = useCart();
-    const { fillCart } = useCheckoutContext();
+    const { useUser } = useAccountContext();
+    const { currency, itemsCount, useBalance, fillCart } = useCart();
     const { user } = useUser();
     const balance = user?.balance || 0;
     const handleBalance = (amount) => {

package/dist/components/TotalCheckout/CommentComp/index.js

@@ -1,10 +1,10 @@
 import React from 'react';
 import { CollapseContainer, CollapseItem, Text } from '@weareconceptstudio/core';
 import { Input } from '@weareconceptstudio/form';
-import { useCheckoutContext } from '../../../modules';
+import { useCart } from '../../../modules';
 import CommentCompStyle from './style';
 const CommentComp = ({ isShipping }) => {
-    const { fillCheckoutData, isCheckoutPage } = useCheckoutContext();
+    const { fillCheckoutData, isCheckoutPage } = useCart();
     return isCheckoutPage && typeof isShipping === 'boolean' && !isShipping ? (React.createElement(CommentCompStyle, { className: 'collapse-distance' },
         React.createElement(CollapseContainer, null,
             React.createElement(CollapseItem, { status: 'open', title: React.createElement(React.Fragment, null,

package/dist/components/TotalCheckout/FreeShippingComp/index.js

@@ -1,13 +1,11 @@
 import React, { useEffect, useState } from 'react';
 import { handlePriceCheckFunc, useTranslation } from '@weareconceptstudio/core';
-import { useAccountContext } from '../../../AccountProvider';
-import { useCheckoutContext } from '../../../modules';
+import { useCart } from '../../../modules';
 //* Style
 import FreeShippingCompStyle from './style';
 const FreeShippingComp = () => {
     const { translate } = useTranslation();
-    const { useCart } = useAccountContext();
-    const { isCheckoutPage } = useCheckoutContext();
+    const { isCheckoutPage } = useCart();
     const { shippingCostValue, freeShippingRange, shippingCost, items, currency } = useCart();
     const [freeShow, setFreeShow] = useState(items?.length);
     useEffect(() => {

package/dist/components/TotalCheckout/GiftComp/index.js

@@ -1,14 +1,11 @@
 import React, { useEffect, useState } from 'react';
-import { useCheckoutContext } from '../../../modules';
-import { useAccountContext } from '../../../AccountProvider';
 import { handlePriceCheckFunc, useTranslation } from '@weareconceptstudio/core';
+import { useCart } from '../../../modules';
 //* Style
 import GiftCompStyle from './style';
 const GiftComp = () => {
     const { translate } = useTranslation();
-    const { useCart } = useAccountContext();
-    const { hasFreeGift, giftThresholdRemaining, currency } = useCart();
-    const { isCheckoutPage } = useCheckoutContext();
+    const { hasFreeGift, giftThresholdRemaining, currency, isCheckoutPage } = useCart();
     const [show, setShow] = useState(true);
     useEffect(() => {
         if (hasFreeGift) {

package/dist/components/TotalCheckout/PromoCodeComp/index.js

@@ -1,17 +1,14 @@
 import React, { useMemo } from 'react';
 import { Text, CollapseItem } from '@weareconceptstudio/core';
 import { FormBuilder } from '@weareconceptstudio/form';
-import { useAccountContext } from '../../../AccountProvider';
-import { useCheckoutContext } from '../../../modules';
+import { useCart } from '../../../modules';
 import AccountButton from '../../AccountButton';
 import AppliedPromotion from './AppliedPromotion';
 import { promoCodeFields } from './utils';
 //* Style
 import PromoCodeCompStyle from './style';
 const PromoCodeComp = () => {
-    const { useCart } = useAccountContext();
-    const { itemsCount, usePromotion, appliedPromotions } = useCart();
-    const { fillCart } = useCheckoutContext();
+    const { itemsCount, usePromotion, appliedPromotions, fillCart } = useCart();
     const handlePromotion = (promotion) => {
         fillCart('usePromotion', promotion);
     };

package/dist/components/TotalCheckout/index.js

@@ -1,7 +1,6 @@
 import React, { memo } from 'react';
 import { Text, CollapseContainer, handlePriceCheckFunc, numToLocalString } from '@weareconceptstudio/core';
-import { useAccountContext } from '../../AccountProvider';
-import { useCheckoutContext } from '../../modules';
+import { useCart } from '../../modules';
 import AccountButton from '../AccountButton';
 import FreeShippingComp from './FreeShippingComp';
 import PromoCodeComp from './PromoCodeComp';
@@ -13,9 +12,7 @@ import TotalCheckoutStyle from './style';
 //* Skeleton
 import SkeletonTotalCheckout from './Skeleton';
 const TotalCheckout = memo(({ isShipping, children, confirmation, buttonProps }) => {
-    const { useCart } = useAccountContext();
-    const { checkoutBtnDisabled } = useCheckoutContext();
-    const { itemsCount, shippingCost, total, subtotal, useBalance, discount, currency, loading } = useCart();
+    const { itemsCount, shippingCost, total, subtotal, useBalance, discount, currency, loading, checkoutBtnDisabled } = useCart();
     return (React.createElement(TotalCheckoutStyle, null,
         React.createElement("div", { className: `cart-main-wrap` },
             React.createElement("div", { className: `left-panel-wrap panel` }, children),

package/dist/modules/address/AddressForm/index.js

@@ -2,7 +2,7 @@ import React, { memo as Memo, useState, useCallback, useMemo } from 'react';
 import { useUi, Text } from '@weareconceptstudio/core';
 import { FormBuilder } from '@weareconceptstudio/form';
 import { useAddressContext } from '../AddressProvider';
-import { useCheckoutContext } from '../../checkout';
+import { useCart } from '../../cart';
 import AccountButton from '../../../components/AccountButton';
 //* Icons
 import { CheckboxIcon, CheckboxCheckedIcon } from '../../../utils/icons';
@@ -10,7 +10,7 @@ import { CheckboxIcon, CheckboxCheckedIcon } from '../../../utils/icons';
 import AddressFormStyle from './style';
 const AddressForm = Memo(({ title, data, type }) => {
     const { formFields, createAddress, updateAddress } = useAddressContext();
-    const { isCheckoutPage } = useCheckoutContext();
+    const { isCheckoutPage } = useCart();
     const { closePopup } = useUi();
     //! States
     const [isChecked, setIsChecked] = useState(data?.is_default || false);

package/dist/modules/address/AddressProvider.js

@@ -1,6 +1,6 @@
-import React, { createContext, useCallback, useContext, useEffect, useMemo, useState } from 'react';
+import React, { createContext, useContext, useEffect, useMemo, useState } from 'react';
 import { api } from '@weareconceptstudio/core';
-import { useCheckoutContext } from '../checkout';
+import { useCart } from '../cart';
 const AddressContext = createContext(null);
 export const useAddressContext = () => {
     const context = useContext(AddressContext);
@@ -8,7 +8,7 @@ export const useAddressContext = () => {
 };
 export const AddressProvider = ({ addressType, addressFormFields = [], useUser, children }) => {
     const { isLoggedIn } = useUser();
-    const { fillCheckoutData, fillCart, isCheckoutPage } = useCheckoutContext();
+    const { fillCheckoutData, fillCart, isCheckoutPage } = useCart();
     const [addressLoading, setAddressLoading] = useState(false);
     const [addresses, setAddresses] = useState(addressType ? { billing: [], shipping: [] } : []);
     const [selectedAddresses, setSelectedAddresses] = useState(addressType ? { billing: {}, shipping: {} } : {});

package/dist/modules/cart/CartItems/Item/index.js

@@ -1,14 +1,14 @@
-import React, { memo, useCallback, useEffect } from 'react';
+import React, { memo } from 'react';
 import { handlePriceCheckFunc, Image, Text, useTranslation } from '@weareconceptstudio/core';
 import { AccountButton, AccountCounter } from '../../../../components';
 import { useAccountContext } from '../../../../AccountProvider';
-import { useCheckoutContext } from '../../../checkout';
+import { useCart } from '../../CartProvider';
 import { defaultIconGift } from '../util';
-const Item = memo(({ data, remove, select, isLast, actions }) => {
-    const { checkoutData, setCheckGift } = useCheckoutContext();
+const Item = memo(({ data, remove, select, isLast, actions, isCheckout }) => {
+    const { checkoutData, setCheckGift } = useCart();
     const { currency, handleProductClick } = useAccountContext();
     const { translate } = useTranslation();
-    return (React.createElement("div", { className: `item-wrap user-select-none` },
+    return !isCheckout || checkoutData.checkGift.find((item) => item.promotionId == data.appliedPromotion?.id && item.id == data.product.id)?.qty !== 0 ? (React.createElement("div", { className: `item-wrap user-select-none` },
         React.createElement("div", { className: 'line' }),
         React.createElement("div", { className: `item-inner-wrapper` },
             React.createElement("div", { className: `col-item tl-col-1 col-item-1` },
@@ -27,42 +27,37 @@ const Item = memo(({ data, remove, select, isLast, actions }) => {
                         "\u00A0",
                         React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: data.size }))) : data.product.short_info_2 ? (React.createElement("div", { className: `right-second-item-wrap` },
                         React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1`, text: data.product.short_info_2 }))) : null)),
-            React.createElement("div", { className: `col-item tl-col-2` }, select && !data.is_gift ? (React.createElement("div", { className: `select-and-out-of-stock-wrap` }, !data.product.out_of_stock ? (React.createElement(AccountCounter, { productId: data.product.id })) : (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: 'account.general_actions.outOfStock' })))) : data.is_gift ? (React.createElement("div", { className: 'wrapper-gift-button' }, checkoutData.checkGift.find((item) => item.promotionId == data.appliedPromotion.id && item.id == data.product.id)?.qty !== 0 ? (React.createElement(React.Fragment, null,
+            React.createElement("div", { className: `col-item tl-col-2` }, select && !data.is_gift ? (React.createElement("div", { className: `select-and-out-of-stock-wrap` }, !data.product.out_of_stock ? (React.createElement(AccountCounter, { productId: data.product.id })) : (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: 'account.general_actions.outOfStock' })))) : data.is_gift && !isCheckout ? (React.createElement("div", { className: 'wrapper-gift-button' }, checkoutData.checkGift.find((item) => item.promotionId == data.appliedPromotion.id && item.id == data.product.id)?.qty !== 0 ? (React.createElement(React.Fragment, null,
                 React.createElement(AccountCounter, { maxQty: data?.qty, productId: data.product.id, promotionId: data.appliedPromotion.id, isGift: data.is_gift, qty: checkoutData.checkGift.find((item) => item.promotionId == data.appliedPromotion.id && item.id == data.product.id)?.qty }))) : (React.createElement(React.Fragment, null,
                 React.createElement(AccountButton, { className: `button-gift`, text: 'account.general_actions.restore', onClick: () => {
                         setCheckGift({ promotionId: data.appliedPromotion.id, productId: data.product.id, qty: data?.qty });
                     } }))))) : (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: data?.qty }))),
-            React.createElement("div", { className: `col-item tl-col-3 col-item-3 nowrap` }, data.product.sale_price && !data.is_gift ? (React.createElement("div", null,
+            React.createElement("div", { className: `col-item tl-col-3 col-item-3 nowrap` }, (data.product.sale_price || data.product.discount) && !data.is_gift ? (React.createElement("div", null,
                 React.createElement(Text, { className: `account-p account-p3 account-font-bold account-secondary-color2 align-right cart-sale-price`, text: handlePriceCheckFunc(data.product.sale_price, currency) }),
                 React.createElement("div", { className: 'wrapper-discount' },
                     data.product.discount ? (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color2 discount-text` },
-                        data.product.discount,
-                        data.product.discount_type === 'percentage' ? '%' : ` ${currency}`,
+                        data.product.discount.value,
+                        data.product.discount.type === 'percentage' ? '%' : ` ${currency}`,
                         "\u00A0",
                         React.createElement("span", { className: 'lowercase' }, translate('account.order_balance.discount')))) : null,
                     React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through value align-right cart-price1`, text: handlePriceCheckFunc(data.product.price, currency) })))) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 align-right cart-price2` }, data.is_gift ? (React.createElement(React.Fragment, null,
                 handlePriceCheckFunc(0, currency),
-                React.createElement(Text, { className: 'gift-name-text' }, data.appliedPromotion.name))) : (handlePriceCheckFunc(data.product.price, currency))))),
+                React.createElement("span", { className: 'gift-name-text' }, data.appliedPromotion.name))) : (handlePriceCheckFunc(data.product.price, currency))))),
             React.createElement("div", { className: `col-item tl-col-4 col-item-4 nowrap` },
                 React.createElement("div", { className: `col-item-inner-wrap` },
-                    React.createElement("div", { className: `flex-end-wrap` }, data.sale_total && !data.is_gift ? (React.createElement("div", null,
+                    React.createElement("div", { className: `flex-end-wrap` }, (data.sale_total || data.product.discount) && !data.is_gift ? (React.createElement("div", null,
                         React.createElement(Text, { className: `account-p account-p3 account-font-bold account-secondary-color2 align-right cart-sale-total`, text: handlePriceCheckFunc(data.sale_total, currency) }),
                         React.createElement("div", { className: 'wrapper-discount' },
                             data.product.discount ? (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color2 discount-text` },
-                                data.product.discount,
-                                data.product.discount_type === 'percentage' ? '%' : ` ${currency}`,
+                                data.product.discount.value,
+                                data.product.discount.type === 'percentage' ? '%' : ` ${currency}`,
                                 "\u00A0",
                                 React.createElement("span", { className: 'lowercase' }, translate('account.order_balance.discount')))) : null,
-                            React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through value align-right cart-total1`, text: handlePriceCheckFunc(data.total, currency) })))) : (
-                    // <Text
-                    // 	className={`account-p account-p3 account-font-bold account-primary-color1 align-right cart-total2`}
-                    // 	text={handlePriceCheckFunc(data.is_gift ? 0 : data.total, currency)}
-                    // />
-                    React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 align-right cart-total2` }, data.is_gift ? (React.createElement(React.Fragment, null,
+                            React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through value align-right cart-total1`, text: handlePriceCheckFunc(data.total, currency) })))) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 align-right cart-total2` }, data.is_gift ? (React.createElement(React.Fragment, null,
                         handlePriceCheckFunc(0, currency),
-                        React.createElement(Text, { className: 'gift-name-text' }, data.appliedPromotion.name))) : (handlePriceCheckFunc(data.total, currency))))),
+                        React.createElement("span", { className: 'gift-name-text' }, data.appliedPromotion.name))) : (handlePriceCheckFunc(data.total, currency))))),
                     React.createElement("div", { className: `favorite-and-remove-wrap` }, remove && !data.is_gift && (React.createElement("div", { className: `remove-btn-wrap` },
                         React.createElement(AccountButton, { btnType: `green-small-text`, className: 'cart-remove-btn', text: 'account.general_actions.remove', onClick: () => actions.delete({ productId: data.product.id }) }))))))),
-        isLast ? React.createElement("div", { className: 'line' }) : null));
+        isLast ? React.createElement("div", { className: 'line' }) : null)) : null;
 });
 export default Item;

package/dist/modules/cart/CartItems/ItemMobile/index.js

@@ -2,13 +2,13 @@ import React, { memo } from 'react';
 import { handlePriceCheckFunc, Image, Text, useTranslation } from '@weareconceptstudio/core';
 import { AccountButton, AccountCounter } from '../../../../components';
 import { useAccountContext } from '../../../../AccountProvider';
-import { useCheckoutContext } from '../../../checkout';
+import { useCart } from '../../CartProvider';
 import { defaultIconGift } from '../util';
-const ItemMobile = memo(({ data, select }) => {
+const ItemMobile = memo(({ data, select, isCheckout }) => {
     const { handleProductClick, currency } = useAccountContext();
     const { translate } = useTranslation();
-    const { checkoutData, setCheckGift } = useCheckoutContext();
-    return (React.createElement(React.Fragment, null,
+    const { checkoutData, setCheckGift } = useCart();
+    return !isCheckout || checkoutData.checkGift.find((item) => item.promotionId == data.appliedPromotion?.id && item.id == data.product.id)?.qty !== 0 ? (React.createElement(React.Fragment, null,
         React.createElement("div", { className: `mobile-cart-item-wrap user-select-none` },
             React.createElement("div", { className: `mobile-cart-item-inner-wrap` },
                 React.createElement("div", { className: `mobile-image-wrap` },
@@ -27,19 +27,19 @@ const ItemMobile = memo(({ data, select }) => {
                         React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color1`, text: data.size }))) : data.product.short_info_2 ? (React.createElement("div", { className: 'mobile-info-item' },
                         React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1 mobile-short-info2`, text: data.product.short_info_2 }))) : null,
                     React.createElement("div", { className: `mobile-total-price-wrap flex-box` },
-                        data.sale_total && !data.is_gift ? (React.createElement("div", { className: 'mobile-total-price-flex-block' },
+                        (data.sale_total || data.product.discount) && !data.is_gift ? (React.createElement("div", { className: 'mobile-total-price-flex-block' },
                             React.createElement(Text, { className: `account-p account-p3 account-font-medium account-secondary-color2 mobile-total-discounted-price`, text: handlePriceCheckFunc(data.sale_total, currency) }),
                             React.createElement("div", { className: 'wrapper-discount' },
                                 data.product.discount ? (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color2 discount-text` },
-                                    data.product.discount,
-                                    data.product.discount_type === 'percentage' ? '%' : ` ${currency}`,
+                                    data.product.discount.value,
+                                    data.product.discount.type === 'percentage' ? '%' : ` ${currency}`,
                                     "\u00A0",
                                     React.createElement("span", { className: 'lowercase' }, translate('account.order_balance.discount')))) : null,
                                 React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through mobile-total-price price-discount`, text: handlePriceCheckFunc(data.total, currency) })))) : (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1 mobile-total-price2` }, data.is_gift ? (React.createElement(React.Fragment, null,
                             handlePriceCheckFunc(0, currency),
-                            React.createElement(Text, { className: 'gift-name-text' }, data.appliedPromotion.name))) : (handlePriceCheckFunc(data.total, currency)))),
+                            React.createElement("span", { className: 'gift-name-text' }, data.appliedPromotion.name))) : (handlePriceCheckFunc(data.total, currency)))),
                         select && !data.is_gift ? (React.createElement("div", { className: `inner-container` }, !data.product.out_of_stock ? (React.createElement(AccountCounter, { productId: data.product.id })) : (React.createElement("div", { className: `in-block` },
-                            React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: 'account.general_actions.outOfStock' }))))) : data.is_gift ? (React.createElement("div", { className: 'wrapper-gift-button' }, checkoutData.checkGift.find((item) => item.promotionId == data.appliedPromotion.id && item.id == data.product.id)?.qty !== 0 ? (React.createElement(AccountCounter, { maxQty: data?.qty, productId: data.product.id, promotionId: data.appliedPromotion.id, isGift: data.is_gift, qty: checkoutData.checkGift.find((item) => item.promotionId == data.appliedPromotion.id && item.id == data.product.id)?.qty })) : (React.createElement(AccountButton, { className: `capitalize button-gift`, text: 'account.general_actions.restore', onClick: () => {
+                            React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: 'account.general_actions.outOfStock' }))))) : data.is_gift && !isCheckout ? (React.createElement("div", { className: 'wrapper-gift-button' }, checkoutData.checkGift.find((item) => item.promotionId == data.appliedPromotion.id && item.id == data.product.id)?.qty !== 0 ? (React.createElement(AccountCounter, { maxQty: data?.qty, productId: data.product.id, promotionId: data.appliedPromotion.id, isGift: data.is_gift, qty: checkoutData.checkGift.find((item) => item.promotionId == data.appliedPromotion.id && item.id == data.product.id)?.qty })) : (React.createElement(AccountButton, { className: `capitalize button-gift`, text: 'account.general_actions.restore', onClick: () => {
                                 setCheckGift({ promotionId: data.appliedPromotion.id, productId: data.product.id, qty: data?.qty });
                             } })))) : (React.createElement("div", { className: `in-block` },
                             React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1 mobile-quantity-with-symbol2` },
@@ -47,6 +47,6 @@ const ItemMobile = memo(({ data, select }) => {
                                 ":"),
                             "\u00A0",
                             React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1 mobile-quantity2`, text: data?.qty }))))))),
-        React.createElement("div", { className: 'line' })));
+        React.createElement("div", { className: 'line' }))) : null;
 });
 export default ItemMobile;

package/dist/modules/cart/CartItems/index.js

@@ -1,15 +1,14 @@
 import React, { memo, useMemo } from 'react';
 import { Text, useUi } from '@weareconceptstudio/core';
+import { useCart } from '../CartProvider';
 //* Components
 import Item from './Item';
 import ItemMobile from './ItemMobile';
 import { AccountButton } from '../../../components';
-import { useAccountContext } from '../../../AccountProvider';
 //* Style
 import CartItemsStyle from './style';
-const CartItems = memo(({ className, title, smallFontSize, additionalParameters, actions }) => {
+const CartItems = memo(({ className, title, smallFontSize, additionalParameters, actions, isCheckout = false }) => {
     const { winWidth } = useUi();
-    const { useCart } = useAccountContext();
     const { items } = useCart();
     //! Store
     const itemsStore = useMemo(() => {
@@ -25,11 +24,11 @@ const CartItems = memo(({ className, title, smallFontSize, additionalParameters,
                     React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 nowrap align-right`, text: `account.order_balance.total` }))),
             React.createElement("div", { className: `items-wrap` }, items?.length > 0
                 ? items.map((item, index) => {
-                    return (React.createElement(Item, { key: index, data: item, actions: actions, isLast: items.length - 1 == index, select: additionalParameters.select, remove: additionalParameters.remove }));
+                    return (React.createElement(Item, { key: index, data: item, actions: actions, isCheckout: isCheckout, isLast: items.length - 1 == index, select: additionalParameters.select, remove: additionalParameters.remove }));
                 })
                 : null))) : (React.createElement("div", { className: `mobile-cart-items-table-wrap` }, items?.length > 0
             ? items.map((item, index) => {
-                return (React.createElement(ItemMobile, { key: index, data: item, select: additionalParameters.select }));
+                return (React.createElement(ItemMobile, { key: index, data: item, isCheckout: isCheckout, select: additionalParameters.select }));
             })
             : null));
     }, [winWidth, items, additionalParameters, actions]);

package/dist/modules/cart/CartItems/style.js

@@ -294,6 +294,7 @@ const CartItemsStyle = styled.section `
 	}
 
 	.gift-name-text {
+		display: block;
 		color: var(--pink1000);
 		white-space: pre-wrap;
 	}

package/dist/modules/cart/CartProvider.d.ts

@@ -0,0 +1,67 @@
+import React, { ReactNode } from 'react';
+interface CartItem {
+    productId: number;
+    qty: number;
+}
+interface CheckoutData {
+    addressId: number | null;
+    useBalance: boolean | null;
+    note: string;
+    paymentType: string;
+    checkGift: {
+        id: number;
+        qty: number;
+        promotionId: number;
+    }[];
+    card_id: number | null;
+}
+interface CartState {
+    itemsCount: number;
+    items: any[];
+    subtotal: number;
+    total: number;
+    loading: boolean;
+    currency: string;
+    shippingCost: string;
+    freeShippingRange: number | null;
+    shippingCostValue: number | null;
+    hasFreeGift: boolean | null;
+    giftThresholdRemaining: number | null;
+    useBalance: boolean | null;
+    discount: number | null;
+    usePromotion?: string | null;
+    appliedPromotions: any[];
+}
+interface CartContextType extends CartState {
+    getCart: (params?: Record<string, any>) => Promise<void>;
+    setCartState: (data: Partial<CartState>) => void;
+    toggleCartItem: ({ productId, qty }: CartItem) => Promise<void>;
+    deleteCartItem: ({ productId }: {
+        productId: number;
+    }) => Promise<void>;
+    clearCart: () => Promise<void>;
+    reorder: (orderId: number) => Promise<void>;
+    mergeCart: () => Promise<void>;
+    checkoutData: CheckoutData;
+    setCheckoutData: React.Dispatch<React.SetStateAction<CheckoutData>>;
+    fillCheckoutData: (key: string, value: any) => void;
+    handleCheckout: () => Promise<void>;
+    fillCart: (key: string, value: any) => void;
+    setCheckGift: ({ promotionId, qty, productId }: {
+        promotionId: number;
+        qty: number;
+        productId: number;
+    }) => void;
+    checkoutBtnDisabled: boolean;
+    isCheckoutPage: boolean;
+}
+export declare const useCart: () => CartContextType;
+interface CartProviderProps {
+    useUser: () => {
+        user: any;
+        isLoggedIn: boolean;
+    };
+    children: ReactNode;
+}
+export declare const CartProvider: React.FC<CartProviderProps>;
+export {};