@weareconceptstudio/account 0.0.6 → 0.0.8

package/dist/{components → modules/address}/AddressWrap/index.js

@@ -1,24 +1,24 @@
 import React from 'react';
 import classNames from 'classnames';
+import { useAddressContext } from '../AddressProvider';
 import { Text, useUi } from '@weareconceptstudio/core';
-import AccountButton from '../ui/AccountButton';
+import AccountButton from '../../../components/ui/AccountButton';
 import EmptyAddress from '../EmptyAddress';
 import AddressItem from '../AddressItem';
 import AddressForm from '../AddressForm';
-const AddressWrap = ({ title = 'addresses', addresses = [], className }) => {
+const AddressWrap = ({ title = 'addresses', addNewText = 'addNewAdd', type, className }) => {
     const { openPopup } = useUi();
+    const { formFields, createAddress, updateAddress, addresses } = useAddressContext();
     const classString = classNames('address-wrap', {
         [className]: className,
     });
     const handleAddNewAddressPopup = () => {
-        openPopup(React.createElement(AddressForm, null));
+        openPopup(React.createElement(AddressForm, { type: type, title: 'addNewAddress', formFields: formFields, createAddress: createAddress, updateAddress: updateAddress }));
     };
     return (React.createElement("div", { className: classString },
         React.createElement("div", { className: `address-title-container` },
             React.createElement(Text, { className: `account-p account-p1 account-font-bold account-primary-color1`, text: title }),
-            React.createElement(AccountButton, { text: `addNewAdd`, btnType: `purple-text`, onClick: handleAddNewAddressPopup })),
-        addresses.length > 0 ? (React.createElement("div", { className: `flex-wrapper` }, addresses.map((item, index) => {
-            return (React.createElement(AddressItem, { key: index, data: item }));
-        }))) : (React.createElement(EmptyAddress, null))));
+            React.createElement(AccountButton, { text: addNewText, btnType: `purple-text`, onClick: handleAddNewAddressPopup })),
+        addresses.length > 0 ? (React.createElement("div", { className: `flex-wrapper` }, addresses.map((item, index) => (React.createElement(AddressItem, { key: index, type: type, data: item }))))) : (React.createElement(EmptyAddress, null))));
 };
 export default AddressWrap;

package/dist/modules/address/AddressesTemplate/index.d.ts

@@ -0,0 +1,3 @@
+export default AddressesTemplate;
+declare function AddressesTemplate(): React.JSX.Element;
+import React from 'react';

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

@@ -0,0 +1,11 @@
+import React from 'react';
+import { useAddressContext } from '../AddressProvider';
+import AddressWrap from '../AddressWrap';
+import AddressesTemplateStyle from './style';
+const AddressesTemplate = () => {
+    const { hasAddressType } = useAddressContext();
+    return (React.createElement(AddressesTemplateStyle, null, hasAddressType ? (React.createElement(React.Fragment, null,
+        React.createElement(AddressWrap, { type: 'shipping', title: 'shippingAddress', addNewText: 'addNewShippingAddress' }),
+        React.createElement(AddressWrap, { type: 'billing', title: 'billingAddress', addNewText: 'addNewBillingAddress' }))) : (React.createElement(AddressWrap, null))));
+};
+export default AddressesTemplate;

package/dist/modules/address/SelectAddress/index.d.ts

@@ -0,0 +1,6 @@
+export default SelectAddress;
+declare function SelectAddress({ type, title }: {
+    type: any;
+    title: any;
+}): React.JSX.Element;
+import React from 'react';

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

@@ -0,0 +1,22 @@
+import React, { useState } from 'react';
+import { useAddressContext } from '../AddressProvider';
+import { Text, useUi } from '@weareconceptstudio/core';
+import AddressForm from '../AddressForm';
+import AddressItem from '../AddressItem';
+import AccountButton from '../../../components/ui/AccountButton';
+import SelectAddressStyle from './style';
+const SelectAddress = ({ type, title }) => {
+    const { openPopup } = useUi();
+    const { addresses, formFields, hasAddressType, createAddress } = useAddressContext();
+    const handleNewAddressPopup = () => {
+        openPopup(React.createElement(AddressForm, { title: `addNewShippingAddress`, formFields: formFields, createAddress: createAddress, selected: { value: false, type: 'shipping' } }));
+    };
+    return (React.createElement(SelectAddressStyle, null,
+        React.createElement("div", { className: `select-address-wrap` },
+            React.createElement(Text, { tag: `h6`, className: hasAddressType ? `account-h6 account-font-bold account-primary-color1` : 'account-p account-p2 account-font-bold account-primary-color1', text: title }),
+            React.createElement(AccountButton, { onClick: handleNewAddressPopup, text: `addNewAdd`, btnType: hasAddressType ? `purple-text` : 'green-small-text' })),
+        addresses?.length > 0 ? (React.createElement("div", { className: `flex-wrapper` }, addresses.map((item, index) => {
+            return (React.createElement(AddressItem, { id: item.id, type: type, data: item, key: index, select_address: true, checkout_review: false }));
+        }))) : null));
+};
+export default SelectAddress;

package/dist/modules/address/SelectAddress/style.d.ts

@@ -0,0 +1,2 @@
+export default SelectAddressStyle;
+declare const SelectAddressStyle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/modules/address/SelectAddress/style.js

@@ -0,0 +1,68 @@
+import styled from 'styled-components';
+const SelectAddressStyle = styled.div `
+	--account_selectAddressWrapMBot: var(--sp5x);
+	--account_itemDistance: var(--sp3x);
+
+	.select-address-wrap {
+		display: flex;
+		flex-wrap: wrap;
+		justify-content: space-between;
+		align-items: center;
+		margin-bottom: var(--account_selectAddressWrapMBot);
+	}
+
+	.flex-wrapper {
+		display: flex;
+		flex-wrap: wrap;
+		margin-left: calc(-1 * calc(var(--account_itemDistance) / 2));
+		margin-right: calc(-1 * calc(var(--account_itemDistance) / 2));
+
+		.item-container {
+			&:not(:nth-child(1), :nth-child(2)) {
+				margin-top: var(--account_itemDistance) !important;
+			}
+		}
+	}
+
+	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeXLMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeL}) {
+		--account_selectAddressWrapMBot: var(--sp4x);
+		--account_itemDistance: var(--sp3x);
+	}
+
+	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeLMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeM}) {
+		--account_selectAddressWrapMBot: var(--sp3x);
+		--account_itemDistance: var(--sp2x);
+	}
+
+	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeMMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeS}) {
+		--account_selectAddressWrapMBot: var(--sp3x);
+		--account_itemDistance: var(--sp2x);
+	}
+
+	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeSMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeXS}) {
+		--account_selectAddressWrapMBot: var(--sp3x);
+		--account_itemDistance: var(--sp2x);
+	}
+
+	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeXSMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_TabletSize}) {
+		--account_selectAddressWrapMBot: var(--sp3x);
+		--account_itemDistance: var(--sp2x);
+	}
+
+	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_TabletSizeMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_TabletSizeS}) {
+		--account_selectAddressWrapMBot: var(--sp3x);
+		--account_itemDistance: var(--sp2x);
+	}
+
+	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_TabletSizeSMin}) {
+		--account_selectAddressWrapMBot: var(--sp3x);
+		--account_itemDistance: var(--sp2x);
+
+		.select-address-wrap {
+			.btn-wrap {
+				margin-top: var(--sp1x);
+			}
+		}
+	}
+`;
+export default SelectAddressStyle;

package/dist/modules/address/SelectShippingBilling/index.d.ts

@@ -0,0 +1,3 @@
+export default SelectShippingBilling;
+declare function SelectShippingBilling(): React.JSX.Element;
+import React from 'react';

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

@@ -0,0 +1,29 @@
+import React, { useCallback } from 'react';
+import { useUi } from '@weareconceptstudio/core';
+import { useAddressContext, AddressProvider } from '../AddressProvider';
+import SelectShippingBillingPopup from '../SelectShippingBillingPopup';
+import AddressItem from '../AddressItem';
+const SelectShippingBilling = () => {
+    const { openPopup } = useUi();
+    const addressContext = useAddressContext();
+    const { selectedAddresses, setSelectedAddresses, addresses } = addressContext;
+    //! Handle Popups
+    const handleAddNewShippingAddressPopup = useCallback(() => {
+        openPopup(React.createElement(AddressForm, { title: `addNewShippingAddress`, selected: { value: false, type: 'shipping' } }));
+    }, []);
+    const handleAddNewBillingAddressPopup = useCallback(() => {
+        openPopup(React.createElement(AddressForm, { title: `addNewBillingAddress`, selected: { value: false, type: 'billing' } }));
+    }, []);
+    const handleShippingChangePopup = useCallback(() => {
+        openPopup(React.createElement(AddressProvider, { ...addressContext },
+            React.createElement(SelectShippingBillingPopup, { type: 'shipping', data: addresses, title: 'selectShippingAddress', selectedAddresses: selectedAddresses, setSelectedAddresses: setSelectedAddresses, handleClick: handleAddNewShippingAddressPopup })));
+    }, [addresses, selectedAddresses]);
+    const handleBillingChangePopup = useCallback(() => {
+        openPopup(React.createElement(AddressProvider, { ...addressContext },
+            React.createElement(SelectShippingBillingPopup, { type: 'billing', data: addresses, title: 'selectBillingAddress', selectedAddresses: selectedAddresses, setSelectedAddresses: setSelectedAddresses, handleClick: handleAddNewBillingAddressPopup })));
+    }, [addresses, selectedAddresses]);
+    return (React.createElement("div", { style: { marginTop: 50 }, className: 'shipping-billing-change-wrapper' },
+        React.createElement(AddressItem, { checkout_review: true, type: 'shipping', select_address: false, title: 'shippingAddress', data: selectedAddresses.shipping, onClick: handleShippingChangePopup, setSelectedAddresses: setSelectedAddresses }),
+        React.createElement(AddressItem, { checkout_review: true, type: 'billing', select_address: false, title: 'billingAddress', data: selectedAddresses.billing, onClick: handleBillingChangePopup, setSelectedAddresses: setSelectedAddresses })));
+};
+export default SelectShippingBilling;

package/dist/modules/address/SelectShippingBillingPopup/index.d.ts

@@ -0,0 +1,3 @@
+export default SelectShippingBillingPopup;
+declare const SelectShippingBillingPopup: React.NamedExoticComponent<object>;
+import React from 'react';

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

@@ -0,0 +1,25 @@
+import React, { memo as Memo, useState, useCallback } from 'react';
+import { Text, useUi } from '@weareconceptstudio/core';
+import { useTheme } from 'styled-components';
+import theme from '../../../styles/theme';
+//* Components
+import SelectAddress from '../SelectAddress';
+import AccountButton from '../../../components/ui/AccountButton';
+//* Style
+import SelectShippingBillingStyle from './style';
+const SelectShippingBillingPopup = Memo(({ title, type }) => {
+    const { closePopup } = useUi();
+    const globalTheme = useTheme();
+    // const handleAddressChangeSubmit = useCallback(() => {
+    // 	let findItem = data.find((item) => item.id === checkedId);
+    // 	setSelectedAddresses({ ...selectedAddresses, [findItem?.type]: { ...findItem } });
+    // 	// getCart({ addressId: checkedId });
+    // 	closePopup();
+    // }, [data, selectedAddresses, checkedId]);
+    return (React.createElement(SelectShippingBillingStyle, { theme: theme(globalTheme) },
+        React.createElement(SelectAddress, { type: type, title: title }),
+        React.createElement("div", { className: `cancel-and-save-wrap` },
+            React.createElement(AccountButton, { btnType: `green-large-text`, text: `cancel`, onClick: closePopup }),
+            React.createElement(AccountButton, { btnType: `full-width`, text: `saveAndApply` }))));
+});
+export default SelectShippingBillingPopup;

package/dist/{components/SelectShippingBilling → modules/address/SelectShippingBillingPopup}/style.js

@@ -1,31 +1,8 @@
 import styled from 'styled-components';
 const SelectShippingBillingAddressStyle = styled.section `
-	--account_selectAddressWrapMBot: var(--sp5x);
-	--account_itemDistance: var(--sp3x);
 	--account_cancelAndSaveWrapMTop: var(--sp5x);
 	--account_cancelDistance: var(--sp5x);
 
-	.select-address-wrap {
-		display: flex;
-		flex-wrap: wrap;
-		justify-content: space-between;
-		align-items: center;
-		margin-bottom: var(--account_selectAddressWrapMBot);
-	}
-
-	.flex-wrapper {
-		display: flex;
-		flex-wrap: wrap;
-		margin-left: calc(-1 * calc(var(--account_itemDistance) / 2));
-		margin-right: calc(-1 * calc(var(--account_itemDistance) / 2));
-
-		.item-container {
-			&:not(:nth-child(1), :nth-child(2)) {
-				margin-top: var(--account_itemDistance) !important;
-			}
-		}
-	}
-
 	.cancel-and-save-wrap {
 		display: flex;
 		justify-content: flex-end;
@@ -40,50 +17,36 @@ const SelectShippingBillingAddressStyle = styled.section `
 	}
 
 	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeXLMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeL}) {
-		--account_selectAddressWrapMBot: var(--sp4x);
-		--account_itemDistance: var(--sp3x);
 		--account_cancelAndSaveWrapMTop: var(--sp4x);
 		--account_cancelDistance: var(--sp3x);
 	}
 
 	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeLMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeM}) {
-		--account_selectAddressWrapMBot: var(--sp3x);
-		--account_itemDistance: var(--sp2x);
 		--account_cancelAndSaveWrapMTop: var(--sp3x);
 		--account_cancelDistance: var(--sp3x);
 	}
 
 	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeMMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeS}) {
-		--account_selectAddressWrapMBot: var(--sp3x);
-		--account_itemDistance: var(--sp2x);
 		--account_cancelAndSaveWrapMTop: var(--sp3x);
 		--account_cancelDistance: var(--sp3x);
 	}
 
 	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeSMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeXS}) {
-		--account_selectAddressWrapMBot: var(--sp3x);
-		--account_itemDistance: var(--sp2x);
 		--account_cancelAndSaveWrapMTop: var(--sp3x);
 		--account_cancelDistance: var(--sp2-5x);
 	}
 
 	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_DesktopSizeXSMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_TabletSize}) {
-		--account_selectAddressWrapMBot: var(--sp3x);
-		--account_itemDistance: var(--sp2x);
 		--account_cancelAndSaveWrapMTop: var(--sp3x);
 		--account_cancelDistance: var(--sp2-5x);
 	}
 
 	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_TabletSizeMin}) and (min-width: ${(props) => props.theme.account.mediaQuery.account_TabletSizeS}) {
-		--account_selectAddressWrapMBot: var(--sp3x);
-		--account_itemDistance: var(--sp2x);
 		--account_cancelAndSaveWrapMTop: var(--sp3x);
 		--account_cancelDistance: var(--sp2-5x);
 	}
 
 	@media only screen and (max-width: ${(props) => props.theme.account.mediaQuery.account_TabletSizeSMin}) {
-		--account_selectAddressWrapMBot: var(--sp3x);
-		--account_itemDistance: var(--sp2x);
 		--account_cancelAndSaveWrapMTop: var(--sp3x);
 		--account_cancelDistance: var(--sp2x);
 
@@ -101,12 +64,6 @@ const SelectShippingBillingAddressStyle = styled.section `
 				}
 			}
 		}
-
-		.select-address-wrap {
-			.btn-wrap {
-				margin-top: var(--sp1x);
-			}
-		}
 	}
 `;
 export default SelectShippingBillingAddressStyle;

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

@@ -0,0 +1,15 @@
+import React, { memo as Memo } from 'react';
+import { useAddressContext } from '../AddressProvider';
+import { Text } from '@weareconceptstudio/core';
+import { FormBuilder } from '@weareconceptstudio/form';
+//* Style
+import ShippingBillingFormStyle from './style';
+const ShippingBillingForm = Memo(({ firstStepFormRef, title, className }) => {
+    const { createAddress, formFields } = useAddressContext();
+    return (React.createElement(ShippingBillingFormStyle, { className: className || '' },
+        React.createElement(Text, { text: title, className: `account-p account-p2 account-font-bold account-primary-color1 title` }),
+        React.createElement(FormBuilder, { formOptions: {
+                ref: firstStepFormRef,
+            }, onSubmit: createAddress, fields: formFields, className: 'form-wrapper' })));
+});
+export default ShippingBillingForm;

package/dist/modules/address/index.d.ts

@@ -0,0 +1,9 @@
+export * from "./AddressProvider";
+export { default as AddressesTemplate } from "./AddressesTemplate";
+export { default as AddressWrap } from "./AddressWrap";
+export { default as AddressForm } from "./AddressForm";
+export { default as AddressItem } from "./AddressItem";
+export { default as ShippingBillingInfo } from "./ShippingBillingInfo";
+export { default as ShippingBillingForm } from "./ShippingBillingForm";
+export { default as SelectShippingBilling } from "./SelectShippingBilling";
+export { default as SelectShippingBillingPopup } from "./SelectShippingBillingPopup";

package/dist/modules/address/index.js

@@ -0,0 +1,9 @@
+export * from './AddressProvider';
+export { default as AddressesTemplate } from './AddressesTemplate';
+export { default as AddressWrap } from './AddressWrap';
+export { default as AddressForm } from './AddressForm';
+export { default as AddressItem } from './AddressItem';
+export { default as ShippingBillingInfo } from './ShippingBillingInfo';
+export { default as ShippingBillingForm } from './ShippingBillingForm';
+export { default as SelectShippingBilling } from './SelectShippingBilling';
+export { default as SelectShippingBillingPopup } from './SelectShippingBillingPopup';

package/dist/modules/index.d.ts

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

package/dist/modules/index.js

@@ -0,0 +1 @@
+export * from './address';

package/dist/templates/AccountSettingsTemplate/AccountInfo/index.js

@@ -10,7 +10,7 @@ const AccountInfo = ({ user, onAccountUpdate, displayFields = defaultDisplayFiel
     const [edit, setEdit] = useState(false);
     //! Handle Popup
     const handleSuccessPopup = useCallback(() => {
-        openPopup(React.createElement(WarningMessageForPopup, { title: 'Testing success message title', description: 'Testing success message description' }), { className: 'messagePopup' });
+        openPopup(React.createElement(WarningMessageForPopup, { title: 'yourSettingsHaveBeenSaved', description: 'yourSettingsHaveBeenSaved' }), { className: 'messagePopup' });
     }, []);
     //! On Finish
     const onFinish = useCallback((values) => {

package/dist/templates/AccountTemplate/style.js

@@ -60,7 +60,7 @@ const AccountStyle = styled.section `
 
 					.sidebar-item {
 						color: var(--account_primaryColor3);
-						transition: color var(--account_trTime);
+						transition: color var(--account_trTime) ease-out;
 					}
 
 					@media (hover: hover) {

package/dist/templates/CartTemplate/index.d.ts

@@ -1,11 +1,10 @@
 export default CartTemplate;
-declare function CartTemplate({ items, itemsCount, shippingCost, loading, children, shoppingUrl, subtotal, total, actions, btnDisabled, checkoutUrl }: {
+declare function CartTemplate({ items, itemsCount, shippingCost, loading, children, subtotal, total, actions, btnDisabled, checkoutUrl }: {
     items: any;
     itemsCount: any;
     shippingCost: any;
     loading: any;
     children: any;
-    shoppingUrl: any;
     subtotal: any;
     total: any;
     actions: any;

package/dist/templates/CartTemplate/index.js

@@ -2,7 +2,9 @@ import React from 'react';
 import { Container, Page } from '@weareconceptstudio/core';
 import { EmptyCart, TotalCheckout, AccountButton, SimpleCartItems } from '../../components';
 import CartTemplateStyle from './style';
-const CartTemplate = ({ items, itemsCount, shippingCost, loading, children, shoppingUrl, subtotal, total, actions, btnDisabled, checkoutUrl = '/checkout/' }) => {
+import { useAccountContext } from '../../AccountProvider';
+const CartTemplate = ({ items, itemsCount, shippingCost, loading, children, subtotal, total, actions, btnDisabled, checkoutUrl = '/checkout/' }) => {
+    const { shopUrl } = useAccountContext();
     return (React.createElement(Page, { className: 'cart use-account' },
         React.createElement(Container, null,
             React.createElement(CartTemplateStyle, null,
@@ -11,14 +13,13 @@ const CartTemplate = ({ items, itemsCount, shippingCost, loading, children, shop
                         text: 'proceedToCheckout',
                         disabled: btnDisabled,
                     } }, itemsCount > 0 ? (React.createElement(React.Fragment, null,
-                    React.createElement(SimpleCartItems, { data: items, smallFontSize: true, title: 'myCart', favorites: [], className: `cart-st-wrap`, additionalParameters: {
-                            edit: { item: true, list: false },
-                            favorite: true,
+                    React.createElement(SimpleCartItems, { data: items, smallFontSize: true, title: 'myCart', className: `cart-st-wrap`, additionalParameters: {
+                            edit: { list: false },
                             remove: true,
                             horizontalLine: true,
                             select: true,
                         }, actions: actions }),
-                    shoppingUrl ? (React.createElement(AccountButton, { btnType: `purple-text`, text: `continueShopping`, className: `continue-shop-text`, url: shoppingUrl })) : null)) : (!loading && (React.createElement(EmptyCart, { data: items, shoppingUrl: shoppingUrl })))),
+                    shopUrl ? (React.createElement(AccountButton, { btnType: `purple-text`, text: `continueShopping`, className: `continue-shop-text`, url: shopUrl })) : null)) : (!loading && (React.createElement(EmptyCart, { data: items, shoppingUrl: shopUrl })))),
                 children))));
 };
 export default CartTemplate;

package/dist/templates/CheckoutTemplate/StepReview/index.d.ts

@@ -0,0 +1,3 @@
+export default StepReview;
+declare function StepReview(): React.JSX.Element;
+import React from 'react';

package/dist/templates/CheckoutTemplate/StepReview/index.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import { SelectShippingBilling, useAddressContext } from '../../../modules';
+import SelectAddress from '../../../modules/address/SelectAddress';
+const StepReview = () => {
+    const { hasAddressType } = useAddressContext();
+    return React.createElement("div", { className: 'step-review' }, hasAddressType ? React.createElement(SelectShippingBilling, null) : React.createElement(SelectAddress, { title: 'addresses' }));
+};
+export default StepReview;

package/dist/templates/CheckoutTemplate/StepShipping/index.d.ts

@@ -0,0 +1,5 @@
+export default StepShipping;
+declare function StepShipping({ firstStepFormRef }: {
+    firstStepFormRef: any;
+}): React.JSX.Element;
+import React from 'react';

package/dist/templates/CheckoutTemplate/StepShipping/index.js

@@ -0,0 +1,9 @@
+import React, { useState } from 'react';
+import { AddressItem, ShippingBillingForm, useAddressContext } from '../../../modules';
+import { CustomCheckbox } from '../../../components';
+const StepShipping = ({ firstStepFormRef }) => {
+    const [hide, setHide] = useState();
+    const { hasAddressType } = useAddressContext();
+    return (React.createElement("div", { className: `billing-shipping-form-wrap` }, hasAddressType ? (React.createElement(React.Fragment, null)) : (React.createElement(ShippingBillingForm, { firstStepFormRef: firstStepFormRef, title: 'address' }))));
+};
+export default StepShipping;

package/dist/templates/CheckoutTemplate/index.d.ts

@@ -1,6 +1,6 @@
 export default CheckoutTemplate;
-declare function CheckoutTemplate({ items, total, subtotal, shippingCost, currency }: {
-    items: any;
+declare function CheckoutTemplate({ itemsCount, total, subtotal, shippingCost, currency }: {
+    itemsCount: any;
     total: any;
     subtotal: any;
     shippingCost: any;