@salesgenterp/ui-components 0.2.21 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -58,7 +58,8 @@ var CartDrawerProductCard = function CartDrawerProductCard(_ref) {
58
58
  handleIncrementDecrement = _ref.handleIncrementDecrement,
59
59
  handleRemoveProduct = _ref.handleRemoveProduct,
60
60
  handleRedirect = _ref.handleRedirect,
61
- imgnotfoundUrl = _ref.imgnotfoundUrl;
61
+ imgnotfoundUrl = _ref.imgnotfoundUrl,
62
+ loading = _ref.loading;
62
63
  var imgnotfoundUrlcommon = '/images/imgnotfound.jpeg';
63
64
  if (imgnotfoundUrl && imgnotfoundUrl !== 'null') imgnotfoundUrlcommon = imgnotfoundUrl;
64
65
  return /*#__PURE__*/React__default.createElement(CartDrawerProduct, {
@@ -88,16 +89,19 @@ var CartDrawerProductCard = function CartDrawerProductCard(_ref) {
88
89
  }, /*#__PURE__*/React__default.createElement(ri.RiDeleteBin5Line, {
89
90
  className: "icon",
90
91
  onClick: function onClick() {
92
+ if (loading) return;
91
93
  handleRemoveProduct(product);
92
94
  }
93
95
  }), /*#__PURE__*/React__default.createElement(CartDrawerQtBox, null, /*#__PURE__*/React__default.createElement("span", {
94
96
  onClick: function onClick() {
97
+ if (loading) return;
95
98
  handleIncrementDecrement('decrement', product);
96
99
  }
97
100
  }, ' ', /*#__PURE__*/React__default.createElement(ai.AiOutlineMinus, null)), ' ', /*#__PURE__*/React__default.createElement("span", {
98
101
  className: 'qt'
99
102
  }, product === null || product === void 0 ? void 0 : product.quantity), /*#__PURE__*/React__default.createElement("span", {
100
103
  onClick: function onClick() {
104
+ if (loading) return;
101
105
  handleIncrementDecrement('increment', product);
102
106
  }
103
107
  }, /*#__PURE__*/React__default.createElement(ai.AiOutlinePlus, null)))));
@@ -134,7 +138,8 @@ var CartDrawer = function CartDrawer(_ref) {
134
138
  handleRemoveProduct: handleRemoveProduct,
135
139
  color: color,
136
140
  key: i,
137
- imgnotfoundUrl: imgnotfoundUrl
141
+ imgnotfoundUrl: imgnotfoundUrl,
142
+ loading: loading
138
143
  }));
139
144
  })) : /*#__PURE__*/React__default.createElement(CartDrawerEmptyCart, {
140
145
  color: color
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/components/CartDrawer/cartDrawer.styles.js","../src/components/CartDrawer/CartDrawerCard/CartDrawerProduct.styles.js","../src/components/CartDrawer/CartDrawerCard/CartDrawerCard.jsx","../src/components/CartDrawer/CartDrawer.jsx","../src/constants/Breakpoint.js","../src/constants/Variant.js","../src/utils/debounce.js","../src/hooks/useWindowSize.jsx","../src/hooks/useGridSize.jsx"],"sourcesContent":["import styled from 'styled-components';\nexport const CartDrawerContainer = styled.div`\n width: 100%;\n max-width: ${(props) => props.maxWidth || '650px'};\n height: 100%;\n font-family: ${(props) => props.fontFamily};\n /* padding: 1em;\n padding-top: 0rem; */\n position: relative;\n /* min-width: 100%; */\n min-height: 100vh;\n max-height: 100vh;\n overflow-y: auto;\n /* background-color: grey; */\n /* border: 1px solid; */\n`;\n\nexport const CartDrawerBar = styled.div`\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n position: sticky;\n box-sizing: border-box;\n top: 0;\n left: -1em;\n padding: 1em;\n height: 4.6rem;\n font-size: 1.6rem;\n background-color: white;\n font-weight: bold;\n padding-left: 1rem;\n z-index: 2;\n .icon {\n cursor: pointer;\n font-size: 22px;\n }\n @media only screen and (max-width: 640px) {\n font-size: 1.2rem;\n height: 4rem;\n }\n`;\n\nexport const CartDrawerProductContainer = styled.div`\n width: 100%;\n height: max-content;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n position: relative;\n /* height: 900px; */\n padding: 1rem;\n min-height: 74vh;\n opacity: ${(props) => props.opacity};\n @media only screen and (max-width: 748px) {\n min-height: 75vh;\n }\n /* background-color: red; */\n`;\n\nexport const CartDrawerBottomSection = styled.div`\n width: 100%;\n /* height: 8rem; */\n background-color: white;\n box-shadow: 3px -2px 10px #b1b1b1;\n display: flex;\n flex-direction: column;\n min-height: 7rem;\n position: sticky;\n bottom: 0;\n /* padding-bottom: 0.5rem; */\n\n /* left: 0; */\n align-items: center;\n .row {\n width: 100%;\n padding: 0rem 1rem;\n padding-top: 1rem;\n /* padding-left: 1rem; */\n h5 {\n font-weight: bold;\n font-size: 1.1rem;\n span {\n font-weight: 400;\n padding-left: 0.5rem;\n }\n }\n }\n @media only screen and (max-width: 340px) {\n min-height: 6rem;\n .row h5 {\n font-size: 0.8rem;\n }\n }\n`;\n\nexport const CartDrawerOutlinedButton = styled.button`\n width: 90%;\n height: 3.55rem;\n border: 2px solid;\n border-radius: 1rem;\n display: grid;\n place-items: center;\n font-weight: 500;\n font-size: 1rem;\n transition: 0.5s;\n outline: none;\n text-transform: capitalize;\n border-color: ${(props) => props.color || 'black'};\n color: ${(props) => props.color || 'black'};\n text-transform: capitalize;\n margin: 0.6rem 0;\n cursor: pointer;\n background: white;\n &:hover,\n &:focus {\n opacity: 0.8;\n letter-spacing: 1px;\n outline: none;\n }\n @media only screen and (max-width: 640px) {\n height: 2.9rem;\n }\n @media only screen and (max-width: 340px) {\n height: 2.2rem;\n margin: 0.3rem 0;\n }\n`;\n\nexport const CartDrawerFilledButton = styled(CartDrawerOutlinedButton)`\n background: ${(props) => props.color || 'black'};\n color: white;\n position: relative;\n margin-bottom: 1rem;\n .icon {\n position: absolute;\n right: 2rem;\n margin: auto 0;\n }\n`;\n\nexport const CartDrawerEmptyCart = styled.div`\n width: 100%;\n height: calc(100vh - 4.6rem);\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n h6 {\n font-size: 1.8rem;\n font-weight: bold;\n text-transform: uppercase;\n margin: 0;\n margin-top: 1rem;\n color: ${(props) => props.color || 'red'};\n }\n p {\n font-size: 1.1rem;\n text-transform: capitalize;\n font-weight: 500;\n /* color: darkgrey; */\n /* color: orange; */\n }\n .icon {\n font-size: 9.5rem;\n color: darkgrey;\n /* color: orange; */\n }\n`;\n","import styled from 'styled-components';\nexport const CartDrawerProduct = styled.div`\n width: 100%;\n display: flex;\n flex-direction: row;\n height: 100px;\n justify-content: space-around;\n align-items: center;\n overflow: hidden;\n margin-bottom: 2rem;\n img {\n width: 20%;\n max-height: 100%;\n /* aspect-ratio: 1; */\n object-fit: cover;\n }\n .middleSection {\n width: 60%;\n padding-left: 0.8rem;\n height: 100%;\n h6 {\n font-size: 1.1rem;\n font-weight: bold;\n margin: 0;\n\n span {\n font-size: 0.8rem;\n color: grey;\n text-decoration: line-through;\n margin-right: 0.5rem;\n }\n }\n .name {\n font-size: 0.9rem;\n line-height: 1.2rem;\n max-height: 2.45rem;\n width: 100%;\n word-wrap: break-word;\n overflow: hidden;\n text-overflow: ellipsis;\n transition: 0.3s;\n cursor: pointer;\n &:hover {\n color: ${(props) => props.color || 'grey'};\n }\n }\n }\n .endSection {\n width: 20%;\n height: 100%;\n .icon {\n cursor: pointer;\n transition: 0.4s;\n &:hover {\n color: red;\n /* opacity: 0.7; */\n }\n }\n }\n @media only screen and (max-width: 340px) {\n height: 80px;\n .middleSection {\n h6 {\n font-size: 0.9rem;\n }\n .name {\n font-size: 0.7rem;\n height: 1.45rem;\n }\n }\n }\n`;\n\nexport const CartDrawerQtBox = styled.div`\n height: 34px;\n width: 82px;\n border: 1px solid rgb(211, 210, 210);\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 13.5px;\n color: #333;\n padding: 0 0.5rem;\n border-radius: 5px;\n max-width: 100%;\n\n span {\n cursor: pointer;\n height: 100%;\n display: grid;\n place-items: center;\n }\n .qt {\n font-size: 12px;\n color: black;\n font-weight: 500;\n cursor: auto;\n }\n @media only screen and (max-width: 640px) {\n min-width: 55px;\n aspect-ratio: 1/2;\n /* min-height: 28px; */\n font-size: 10px;\n }\n @media only screen and (max-width: 340px) {\n min-width: 50px;\n aspect-ratio: 1/2;\n height: 22px;\n font-size: 8px;\n }\n`;\nexport const CartDrawerLoader = styled.div`\n position: absolute;\n top: 30%;\n width: 100px;\n height: 100px;\n display: grid;\n place-items: center;\n`;\n","import React from 'react';\nimport { Stack, Tooltip } from '@mui/material';\nimport { RiDeleteBin5Line } from 'react-icons/ri';\nimport { AiOutlinePlus, AiOutlineMinus } from 'react-icons/ai';\n// import imgnotfound from '../../../assets/imgnotfound.jpeg';\n////////\nimport { CartDrawerProduct, CartDrawerQtBox } from './CartDrawerProduct.styles';\nconst CartDrawerProductCard = ({\n product,\n color,\n handleIncrementDecrement,\n handleRemoveProduct,\n handleRedirect,\n imgnotfoundUrl,\n}) => {\n let imgnotfoundUrlcommon = '/images/imgnotfound.jpeg';\n if (imgnotfoundUrl && imgnotfoundUrl !== 'null')\n imgnotfoundUrlcommon = imgnotfoundUrl;\n\n return (\n <CartDrawerProduct color={color}>\n <img\n src={\n product.imageUrl && product.imageUrl !== 'null'\n ? product.imageUrl\n : imgnotfoundUrlcommon\n }\n alt={'no product image available'}\n />\n <Stack\n flexDirection=\"column\"\n justifyContent=\"space-between\"\n alignItems=\"flex-start\"\n className=\"middleSection\"\n >\n <Tooltip title={product?.productName} placement=\"top\" arrow>\n <h6 className=\"name\" onClick={() => handleRedirect(product)}>\n {product?.productName}\n </h6>\n </Tooltip>\n\n <h6>\n {product?.standardPrice === product?.cartStandardPrice ? (\n `$${product?.standardPrice}`\n ) : (\n <React.Fragment>\n <span>${product?.cartStandardPrice?.toFixed(2)}</span>$\n {product?.standardPrice?.toFixed(2)}\n </React.Fragment>\n )}\n </h6>\n </Stack>\n <Stack\n flexDirection=\"column\"\n justifyContent=\"space-between\"\n alignItems=\"flex-end\"\n className=\"endSection\"\n >\n <RiDeleteBin5Line\n className=\"icon\"\n onClick={() => {\n handleRemoveProduct(product);\n }}\n />\n <CartDrawerQtBox>\n <span\n onClick={() => {\n handleIncrementDecrement('decrement', product);\n }}\n >\n {' '}\n <AiOutlineMinus />\n </span>{' '}\n <span className={'qt'}>{product?.quantity}</span>\n <span\n onClick={() => {\n handleIncrementDecrement('increment', product);\n }}\n >\n <AiOutlinePlus />\n </span>\n </CartDrawerQtBox>\n </Stack>\n </CartDrawerProduct>\n );\n};\n\nexport default CartDrawerProductCard;\n","import { Stack } from '@mui/material';\nimport React from 'react';\nimport { GrClose } from 'react-icons/gr';\nimport { GiShoppingCart } from 'react-icons/gi';\nimport { BsCartX } from 'react-icons/bs';\n//////\nimport {\n CartDrawerBar,\n CartDrawerBottomSection,\n CartDrawerContainer,\n CartDrawerOutlinedButton,\n CartDrawerFilledButton,\n CartDrawerProductContainer,\n CartDrawerEmptyCart,\n} from './cartDrawer.styles';\nimport CartDrawerProductCard from './CartDrawerCard/CartDrawerCard';\nimport { CartDrawerLoader } from './CartDrawerCard/CartDrawerProduct.styles';\nimport { PuffLoader } from 'react-spinners';\n\nconst CartDrawer = ({\n cartData,\n maxWidth,\n color,\n handleRedirect,\n handleIncrementDecrement,\n handleRemoveProduct,\n handleClose,\n loading,\n imgnotfoundUrl,\n}) => {\n return (\n <React.Fragment>\n <CartDrawerContainer maxWidth={maxWidth}>\n <CartDrawerBar>\n <h2>Your Cart</h2>\n <GrClose\n className=\"icon\"\n onClick={() => {\n handleClose();\n }}\n />\n </CartDrawerBar>\n {cartData && cartData?.totalCartQuantity > 0 ? (\n <CartDrawerProductContainer opacity={loading ? '.4' : '1'}>\n {cartData?.cartLineItemDtoList?.map((product, i) => (\n <React.Fragment>\n {loading && (\n <CartDrawerLoader>\n <PuffLoader color=\"black\" />\n </CartDrawerLoader>\n )}\n\n <CartDrawerProductCard\n product={product}\n handleRedirect={handleRedirect}\n handleIncrementDecrement={handleIncrementDecrement}\n handleRemoveProduct={handleRemoveProduct}\n color={color}\n key={i}\n imgnotfoundUrl={imgnotfoundUrl}\n />\n </React.Fragment>\n ))}\n </CartDrawerProductContainer>\n ) : (\n <CartDrawerEmptyCart color={color}>\n <BsCartX className=\"icon\" />\n <h6>OOps!</h6>\n <p>your cart is empty</p>\n </CartDrawerEmptyCart>\n )}\n {cartData && cartData?.totalCartQuantity > 0 && (\n <CartDrawerBottomSection>\n <Stack\n flexDirection=\"row\"\n justifyContent=\"space-between\"\n alignItems=\"center\"\n className=\"row\"\n >\n <h5>\n Subtotal<span>({cartData?.totalCartQuantity} items)</span>\n </h5>\n <h5>${cartData?.totalCartPrice?.toFixed(2)}</h5>\n </Stack>\n <CartDrawerOutlinedButton\n color={color}\n onClick={() => handleRedirect('cart')}\n >\n view cart\n </CartDrawerOutlinedButton>\n <CartDrawerFilledButton\n color={color}\n onClick={() => handleRedirect('checkout')}\n >\n continue to checkout\n </CartDrawerFilledButton>\n </CartDrawerBottomSection>\n )}\n </CartDrawerContainer>\n </React.Fragment>\n );\n};\n\nexport default CartDrawer;\n","class Breakpoint {\n static xs = 'xs';\n static sm = 'sm';\n static md = 'md';\n static lg = 'lg';\n static xl = 'xl';\n static xxl = 'xxl';\n}\n\nexport default Breakpoint;\n","class Variant {\n static ONE = 'one';\n static TWO = 'two';\n static THREE = 'three';\n}\n\nexport default Variant;\n","export default function debounce(func, wait, immediate) {\n let timeout;\n return function (...args) {\n clearTimeout(timeout);\n timeout = setTimeout(() => {\n timeout = null;\n if (!immediate) func.apply(this, args);\n }, wait);\n if (immediate && !timeout) func.apply(this, [...args]);\n };\n}\n","import { useEffect, useState } from 'react';\nimport debounce from '../utils/debounce';\n\nfunction useWindowSize() {\n const isWindow = typeof window !== 'undefined';\n const [windowSize, setWindowSize] = useState({\n width: isWindow ? window.innerWidth : 1200,\n height: isWindow ? window.innerHeight : 800,\n });\n\n useEffect(() => {\n const onWindowResize = () => {\n setWindowSize({\n width: window.innerWidth,\n height: window.innerHeight,\n });\n };\n\n const onResize = debounce(onWindowResize, 100);\n\n window.addEventListener('resize', onResize);\n onWindowResize();\n\n return () => {\n window.removeEventListener('resize', onResize);\n };\n }, []);\n\n return windowSize;\n}\n\nexport default useWindowSize;\n","import { useEffect, useState } from 'react';\nimport useWindowSize from './useWindowSize';\nimport { Breakpoint } from '../constants';\n\n/*\n The breakpoints of responsive grid follow Google chrome media queries rules\n*/\nconst getBreakpoint = ({ width: screen }) => {\n let breakpoint = '';\n\n if (screen <= 320) {\n breakpoint = Breakpoint.xs;\n }\n if (screen >= 375) {\n breakpoint = Breakpoint.sm;\n }\n if (screen >= 768) {\n breakpoint = Breakpoint.md;\n }\n if (screen >= 992) {\n breakpoint = Breakpoint.lg;\n }\n if (screen >= 1200) {\n breakpoint = Breakpoint.xl;\n }\n if (screen >= 1600) {\n breakpoint = Breakpoint.xxl;\n }\n\n return breakpoint;\n};\n\nfunction useGridSize() {\n const windowSize = useWindowSize();\n const [layout, setLayout] = useState(Breakpoint.md);\n\n useEffect(() => {\n setLayout(getBreakpoint(windowSize));\n }, [windowSize]);\n return layout;\n}\n\nexport default useGridSize;\n"],"names":["CartDrawerContainer","styled","div","props","maxWidth","fontFamily","CartDrawerBar","CartDrawerProductContainer","opacity","CartDrawerBottomSection","CartDrawerOutlinedButton","button","color","CartDrawerFilledButton","CartDrawerEmptyCart","CartDrawerProduct","CartDrawerQtBox","CartDrawerLoader","CartDrawerProductCard","product","handleIncrementDecrement","handleRemoveProduct","handleRedirect","imgnotfoundUrl","imgnotfoundUrlcommon","React","imageUrl","Stack","Tooltip","productName","standardPrice","cartStandardPrice","toFixed","RiDeleteBin5Line","AiOutlineMinus","quantity","AiOutlinePlus","CartDrawer","cartData","handleClose","loading","GrClose","totalCartQuantity","cartLineItemDtoList","map","i","PuffLoader","BsCartX","totalCartPrice","Breakpoint","xs","sm","md","lg","xl","xxl","Variant","ONE","TWO","THREE","debounce","func","wait","immediate","timeout","args","clearTimeout","setTimeout","apply","useWindowSize","isWindow","window","useState","width","innerWidth","height","innerHeight","windowSize","setWindowSize","useEffect","onWindowResize","onResize","addEventListener","removeEventListener","getBreakpoint","screen","breakpoint","useGridSize","layout","setLayout"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../src/components/CartDrawer/cartDrawer.styles.js","../src/components/CartDrawer/CartDrawerCard/CartDrawerProduct.styles.js","../src/components/CartDrawer/CartDrawerCard/CartDrawerCard.jsx","../src/components/CartDrawer/CartDrawer.jsx","../src/constants/Breakpoint.js","../src/constants/Variant.js","../src/utils/debounce.js","../src/hooks/useWindowSize.jsx","../src/hooks/useGridSize.jsx"],"sourcesContent":["import styled from 'styled-components';\nexport const CartDrawerContainer = styled.div`\n width: 100%;\n max-width: ${(props) => props.maxWidth || '650px'};\n height: 100%;\n font-family: ${(props) => props.fontFamily};\n /* padding: 1em;\n padding-top: 0rem; */\n position: relative;\n /* min-width: 100%; */\n min-height: 100vh;\n max-height: 100vh;\n overflow-y: auto;\n /* background-color: grey; */\n /* border: 1px solid; */\n`;\n\nexport const CartDrawerBar = styled.div`\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n position: sticky;\n box-sizing: border-box;\n top: 0;\n left: -1em;\n padding: 1em;\n height: 4.6rem;\n font-size: 1.6rem;\n background-color: white;\n font-weight: bold;\n padding-left: 1rem;\n z-index: 2;\n .icon {\n cursor: pointer;\n font-size: 22px;\n }\n @media only screen and (max-width: 640px) {\n font-size: 1.2rem;\n height: 4rem;\n }\n`;\n\nexport const CartDrawerProductContainer = styled.div`\n width: 100%;\n height: max-content;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n position: relative;\n /* height: 900px; */\n padding: 1rem;\n min-height: 74vh;\n opacity: ${(props) => props.opacity};\n @media only screen and (max-width: 748px) {\n min-height: 75vh;\n }\n /* background-color: red; */\n`;\n\nexport const CartDrawerBottomSection = styled.div`\n width: 100%;\n /* height: 8rem; */\n background-color: white;\n box-shadow: 3px -2px 10px #b1b1b1;\n display: flex;\n flex-direction: column;\n min-height: 7rem;\n position: sticky;\n bottom: 0;\n /* padding-bottom: 0.5rem; */\n\n /* left: 0; */\n align-items: center;\n .row {\n width: 100%;\n padding: 0rem 1rem;\n padding-top: 1rem;\n /* padding-left: 1rem; */\n h5 {\n font-weight: bold;\n font-size: 1.1rem;\n span {\n font-weight: 400;\n padding-left: 0.5rem;\n }\n }\n }\n @media only screen and (max-width: 340px) {\n min-height: 6rem;\n .row h5 {\n font-size: 0.8rem;\n }\n }\n`;\n\nexport const CartDrawerOutlinedButton = styled.button`\n width: 90%;\n height: 3.55rem;\n border: 2px solid;\n border-radius: 1rem;\n display: grid;\n place-items: center;\n font-weight: 500;\n font-size: 1rem;\n transition: 0.5s;\n outline: none;\n text-transform: capitalize;\n border-color: ${(props) => props.color || 'black'};\n color: ${(props) => props.color || 'black'};\n text-transform: capitalize;\n margin: 0.6rem 0;\n cursor: pointer;\n background: white;\n &:hover,\n &:focus {\n opacity: 0.8;\n letter-spacing: 1px;\n outline: none;\n }\n @media only screen and (max-width: 640px) {\n height: 2.9rem;\n }\n @media only screen and (max-width: 340px) {\n height: 2.2rem;\n margin: 0.3rem 0;\n }\n`;\n\nexport const CartDrawerFilledButton = styled(CartDrawerOutlinedButton)`\n background: ${(props) => props.color || 'black'};\n color: white;\n position: relative;\n margin-bottom: 1rem;\n .icon {\n position: absolute;\n right: 2rem;\n margin: auto 0;\n }\n`;\n\nexport const CartDrawerEmptyCart = styled.div`\n width: 100%;\n height: calc(100vh - 4.6rem);\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n h6 {\n font-size: 1.8rem;\n font-weight: bold;\n text-transform: uppercase;\n margin: 0;\n margin-top: 1rem;\n color: ${(props) => props.color || 'red'};\n }\n p {\n font-size: 1.1rem;\n text-transform: capitalize;\n font-weight: 500;\n /* color: darkgrey; */\n /* color: orange; */\n }\n .icon {\n font-size: 9.5rem;\n color: darkgrey;\n /* color: orange; */\n }\n`;\n","import styled from 'styled-components';\nexport const CartDrawerProduct = styled.div`\n width: 100%;\n display: flex;\n flex-direction: row;\n height: 100px;\n justify-content: space-around;\n align-items: center;\n overflow: hidden;\n margin-bottom: 2rem;\n img {\n width: 20%;\n max-height: 100%;\n /* aspect-ratio: 1; */\n object-fit: cover;\n }\n .middleSection {\n width: 60%;\n padding-left: 0.8rem;\n height: 100%;\n h6 {\n font-size: 1.1rem;\n font-weight: bold;\n margin: 0;\n\n span {\n font-size: 0.8rem;\n color: grey;\n text-decoration: line-through;\n margin-right: 0.5rem;\n }\n }\n .name {\n font-size: 0.9rem;\n line-height: 1.2rem;\n max-height: 2.45rem;\n width: 100%;\n word-wrap: break-word;\n overflow: hidden;\n text-overflow: ellipsis;\n transition: 0.3s;\n cursor: pointer;\n &:hover {\n color: ${(props) => props.color || 'grey'};\n }\n }\n }\n .endSection {\n width: 20%;\n height: 100%;\n .icon {\n cursor: pointer;\n transition: 0.4s;\n &:hover {\n color: red;\n /* opacity: 0.7; */\n }\n }\n }\n @media only screen and (max-width: 340px) {\n height: 80px;\n .middleSection {\n h6 {\n font-size: 0.9rem;\n }\n .name {\n font-size: 0.7rem;\n height: 1.45rem;\n }\n }\n }\n`;\n\nexport const CartDrawerQtBox = styled.div`\n height: 34px;\n width: 82px;\n border: 1px solid rgb(211, 210, 210);\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 13.5px;\n color: #333;\n padding: 0 0.5rem;\n border-radius: 5px;\n max-width: 100%;\n\n span {\n cursor: pointer;\n height: 100%;\n display: grid;\n place-items: center;\n }\n .qt {\n font-size: 12px;\n color: black;\n font-weight: 500;\n cursor: auto;\n }\n @media only screen and (max-width: 640px) {\n min-width: 55px;\n aspect-ratio: 1/2;\n /* min-height: 28px; */\n font-size: 10px;\n }\n @media only screen and (max-width: 340px) {\n min-width: 50px;\n aspect-ratio: 1/2;\n height: 22px;\n font-size: 8px;\n }\n`;\nexport const CartDrawerLoader = styled.div`\n position: absolute;\n top: 30%;\n width: 100px;\n height: 100px;\n display: grid;\n place-items: center;\n`;\n","import React from 'react';\nimport { Stack, Tooltip } from '@mui/material';\nimport { RiDeleteBin5Line } from 'react-icons/ri';\nimport { AiOutlinePlus, AiOutlineMinus } from 'react-icons/ai';\n// import imgnotfound from '../../../assets/imgnotfound.jpeg';\n////////\nimport { CartDrawerProduct, CartDrawerQtBox } from './CartDrawerProduct.styles';\nconst CartDrawerProductCard = ({\n product,\n color,\n handleIncrementDecrement,\n handleRemoveProduct,\n handleRedirect,\n imgnotfoundUrl,\n loading,\n}) => {\n let imgnotfoundUrlcommon = '/images/imgnotfound.jpeg';\n if (imgnotfoundUrl && imgnotfoundUrl !== 'null')\n imgnotfoundUrlcommon = imgnotfoundUrl;\n\n return (\n <CartDrawerProduct color={color}>\n <img\n src={\n product.imageUrl && product.imageUrl !== 'null'\n ? product.imageUrl\n : imgnotfoundUrlcommon\n }\n alt={'no product image available'}\n />\n <Stack\n flexDirection=\"column\"\n justifyContent=\"space-between\"\n alignItems=\"flex-start\"\n className=\"middleSection\"\n >\n <Tooltip title={product?.productName} placement=\"top\" arrow>\n <h6 className=\"name\" onClick={() => handleRedirect(product)}>\n {product?.productName}\n </h6>\n </Tooltip>\n\n <h6>\n {product?.standardPrice === product?.cartStandardPrice ? (\n `$${product?.standardPrice}`\n ) : (\n <React.Fragment>\n <span>${product?.cartStandardPrice?.toFixed(2)}</span>$\n {product?.standardPrice?.toFixed(2)}\n </React.Fragment>\n )}\n </h6>\n </Stack>\n <Stack\n flexDirection=\"column\"\n justifyContent=\"space-between\"\n alignItems=\"flex-end\"\n className=\"endSection\"\n >\n <RiDeleteBin5Line\n className=\"icon\"\n onClick={() => {\n if (loading) return;\n handleRemoveProduct(product);\n }}\n />\n <CartDrawerQtBox>\n <span\n onClick={() => {\n if (loading) return;\n handleIncrementDecrement('decrement', product);\n }}\n >\n {' '}\n <AiOutlineMinus />\n </span>{' '}\n <span className={'qt'}>{product?.quantity}</span>\n <span\n onClick={() => {\n if (loading) return;\n handleIncrementDecrement('increment', product);\n }}\n >\n <AiOutlinePlus />\n </span>\n </CartDrawerQtBox>\n </Stack>\n </CartDrawerProduct>\n );\n};\n\nexport default CartDrawerProductCard;\n","import { Stack } from '@mui/material';\nimport React from 'react';\nimport { GrClose } from 'react-icons/gr';\nimport { GiShoppingCart } from 'react-icons/gi';\nimport { BsCartX } from 'react-icons/bs';\n//////\nimport {\n CartDrawerBar,\n CartDrawerBottomSection,\n CartDrawerContainer,\n CartDrawerOutlinedButton,\n CartDrawerFilledButton,\n CartDrawerProductContainer,\n CartDrawerEmptyCart,\n} from './cartDrawer.styles';\nimport CartDrawerProductCard from './CartDrawerCard/CartDrawerCard';\nimport { CartDrawerLoader } from './CartDrawerCard/CartDrawerProduct.styles';\nimport { PuffLoader } from 'react-spinners';\n\nconst CartDrawer = ({\n cartData,\n maxWidth,\n color,\n handleRedirect,\n handleIncrementDecrement,\n handleRemoveProduct,\n handleClose,\n loading,\n imgnotfoundUrl,\n}) => {\n return (\n <React.Fragment>\n <CartDrawerContainer maxWidth={maxWidth}>\n <CartDrawerBar>\n <h2>Your Cart</h2>\n <GrClose\n className=\"icon\"\n onClick={() => {\n handleClose();\n }}\n />\n </CartDrawerBar>\n {cartData && cartData?.totalCartQuantity > 0 ? (\n <CartDrawerProductContainer opacity={loading ? '.4' : '1'}>\n {cartData?.cartLineItemDtoList?.map((product, i) => (\n <React.Fragment>\n {loading && (\n <CartDrawerLoader>\n <PuffLoader color=\"black\" />\n </CartDrawerLoader>\n )}\n\n <CartDrawerProductCard\n product={product}\n handleRedirect={handleRedirect}\n handleIncrementDecrement={handleIncrementDecrement}\n handleRemoveProduct={handleRemoveProduct}\n color={color}\n key={i}\n imgnotfoundUrl={imgnotfoundUrl}\n loading={loading}\n />\n </React.Fragment>\n ))}\n </CartDrawerProductContainer>\n ) : (\n <CartDrawerEmptyCart color={color}>\n <BsCartX className=\"icon\" />\n <h6>OOps!</h6>\n <p>your cart is empty</p>\n </CartDrawerEmptyCart>\n )}\n {cartData && cartData?.totalCartQuantity > 0 && (\n <CartDrawerBottomSection>\n <Stack\n flexDirection=\"row\"\n justifyContent=\"space-between\"\n alignItems=\"center\"\n className=\"row\"\n >\n <h5>\n Subtotal<span>({cartData?.totalCartQuantity} items)</span>\n </h5>\n <h5>${cartData?.totalCartPrice?.toFixed(2)}</h5>\n </Stack>\n <CartDrawerOutlinedButton\n color={color}\n onClick={() => handleRedirect('cart')}\n >\n view cart\n </CartDrawerOutlinedButton>\n <CartDrawerFilledButton\n color={color}\n onClick={() => handleRedirect('checkout')}\n >\n continue to checkout\n </CartDrawerFilledButton>\n </CartDrawerBottomSection>\n )}\n </CartDrawerContainer>\n </React.Fragment>\n );\n};\n\nexport default CartDrawer;\n","class Breakpoint {\n static xs = 'xs';\n static sm = 'sm';\n static md = 'md';\n static lg = 'lg';\n static xl = 'xl';\n static xxl = 'xxl';\n}\n\nexport default Breakpoint;\n","class Variant {\n static ONE = 'one';\n static TWO = 'two';\n static THREE = 'three';\n}\n\nexport default Variant;\n","export default function debounce(func, wait, immediate) {\n let timeout;\n return function (...args) {\n clearTimeout(timeout);\n timeout = setTimeout(() => {\n timeout = null;\n if (!immediate) func.apply(this, args);\n }, wait);\n if (immediate && !timeout) func.apply(this, [...args]);\n };\n}\n","import { useEffect, useState } from 'react';\nimport debounce from '../utils/debounce';\n\nfunction useWindowSize() {\n const isWindow = typeof window !== 'undefined';\n const [windowSize, setWindowSize] = useState({\n width: isWindow ? window.innerWidth : 1200,\n height: isWindow ? window.innerHeight : 800,\n });\n\n useEffect(() => {\n const onWindowResize = () => {\n setWindowSize({\n width: window.innerWidth,\n height: window.innerHeight,\n });\n };\n\n const onResize = debounce(onWindowResize, 100);\n\n window.addEventListener('resize', onResize);\n onWindowResize();\n\n return () => {\n window.removeEventListener('resize', onResize);\n };\n }, []);\n\n return windowSize;\n}\n\nexport default useWindowSize;\n","import { useEffect, useState } from 'react';\nimport useWindowSize from './useWindowSize';\nimport { Breakpoint } from '../constants';\n\n/*\n The breakpoints of responsive grid follow Google chrome media queries rules\n*/\nconst getBreakpoint = ({ width: screen }) => {\n let breakpoint = '';\n\n if (screen <= 320) {\n breakpoint = Breakpoint.xs;\n }\n if (screen >= 375) {\n breakpoint = Breakpoint.sm;\n }\n if (screen >= 768) {\n breakpoint = Breakpoint.md;\n }\n if (screen >= 992) {\n breakpoint = Breakpoint.lg;\n }\n if (screen >= 1200) {\n breakpoint = Breakpoint.xl;\n }\n if (screen >= 1600) {\n breakpoint = Breakpoint.xxl;\n }\n\n return breakpoint;\n};\n\nfunction useGridSize() {\n const windowSize = useWindowSize();\n const [layout, setLayout] = useState(Breakpoint.md);\n\n useEffect(() => {\n setLayout(getBreakpoint(windowSize));\n }, [windowSize]);\n return layout;\n}\n\nexport default useGridSize;\n"],"names":["CartDrawerContainer","styled","div","props","maxWidth","fontFamily","CartDrawerBar","CartDrawerProductContainer","opacity","CartDrawerBottomSection","CartDrawerOutlinedButton","button","color","CartDrawerFilledButton","CartDrawerEmptyCart","CartDrawerProduct","CartDrawerQtBox","CartDrawerLoader","CartDrawerProductCard","product","handleIncrementDecrement","handleRemoveProduct","handleRedirect","imgnotfoundUrl","loading","imgnotfoundUrlcommon","React","imageUrl","Stack","Tooltip","productName","standardPrice","cartStandardPrice","toFixed","RiDeleteBin5Line","AiOutlineMinus","quantity","AiOutlinePlus","CartDrawer","cartData","handleClose","GrClose","totalCartQuantity","cartLineItemDtoList","map","i","PuffLoader","BsCartX","totalCartPrice","Breakpoint","xs","sm","md","lg","xl","xxl","Variant","ONE","TWO","THREE","debounce","func","wait","immediate","timeout","args","clearTimeout","setTimeout","apply","useWindowSize","isWindow","window","useState","width","innerWidth","height","innerHeight","windowSize","setWindowSize","useEffect","onWindowResize","onResize","addEventListener","removeEventListener","getBreakpoint","screen","breakpoint","useGridSize","layout","setLayout"],"mappings":"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"}
@@ -55,7 +55,8 @@ var CartDrawerProductCard = function CartDrawerProductCard(_ref) {
55
55
  handleIncrementDecrement = _ref.handleIncrementDecrement,
56
56
  handleRemoveProduct = _ref.handleRemoveProduct,
57
57
  handleRedirect = _ref.handleRedirect,
58
- imgnotfoundUrl = _ref.imgnotfoundUrl;
58
+ imgnotfoundUrl = _ref.imgnotfoundUrl,
59
+ loading = _ref.loading;
59
60
  var imgnotfoundUrlcommon = '/images/imgnotfound.jpeg';
60
61
  if (imgnotfoundUrl && imgnotfoundUrl !== 'null') imgnotfoundUrlcommon = imgnotfoundUrl;
61
62
  return /*#__PURE__*/React.createElement(CartDrawerProduct, {
@@ -85,16 +86,19 @@ var CartDrawerProductCard = function CartDrawerProductCard(_ref) {
85
86
  }, /*#__PURE__*/React.createElement(RiDeleteBin5Line, {
86
87
  className: "icon",
87
88
  onClick: function onClick() {
89
+ if (loading) return;
88
90
  handleRemoveProduct(product);
89
91
  }
90
92
  }), /*#__PURE__*/React.createElement(CartDrawerQtBox, null, /*#__PURE__*/React.createElement("span", {
91
93
  onClick: function onClick() {
94
+ if (loading) return;
92
95
  handleIncrementDecrement('decrement', product);
93
96
  }
94
97
  }, ' ', /*#__PURE__*/React.createElement(AiOutlineMinus, null)), ' ', /*#__PURE__*/React.createElement("span", {
95
98
  className: 'qt'
96
99
  }, product === null || product === void 0 ? void 0 : product.quantity), /*#__PURE__*/React.createElement("span", {
97
100
  onClick: function onClick() {
101
+ if (loading) return;
98
102
  handleIncrementDecrement('increment', product);
99
103
  }
100
104
  }, /*#__PURE__*/React.createElement(AiOutlinePlus, null)))));
@@ -131,7 +135,8 @@ var CartDrawer = function CartDrawer(_ref) {
131
135
  handleRemoveProduct: handleRemoveProduct,
132
136
  color: color,
133
137
  key: i,
134
- imgnotfoundUrl: imgnotfoundUrl
138
+ imgnotfoundUrl: imgnotfoundUrl,
139
+ loading: loading
135
140
  }));
136
141
  })) : /*#__PURE__*/React.createElement(CartDrawerEmptyCart, {
137
142
  color: color
@@ -1 +1 @@
1
- {"version":3,"file":"index.modern.js","sources":["../src/components/CartDrawer/cartDrawer.styles.js","../src/components/CartDrawer/CartDrawerCard/CartDrawerProduct.styles.js","../src/components/CartDrawer/CartDrawerCard/CartDrawerCard.jsx","../src/components/CartDrawer/CartDrawer.jsx","../src/constants/Breakpoint.js","../src/constants/Variant.js","../src/utils/debounce.js","../src/hooks/useWindowSize.jsx","../src/hooks/useGridSize.jsx"],"sourcesContent":["import styled from 'styled-components';\nexport const CartDrawerContainer = styled.div`\n width: 100%;\n max-width: ${(props) => props.maxWidth || '650px'};\n height: 100%;\n font-family: ${(props) => props.fontFamily};\n /* padding: 1em;\n padding-top: 0rem; */\n position: relative;\n /* min-width: 100%; */\n min-height: 100vh;\n max-height: 100vh;\n overflow-y: auto;\n /* background-color: grey; */\n /* border: 1px solid; */\n`;\n\nexport const CartDrawerBar = styled.div`\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n position: sticky;\n box-sizing: border-box;\n top: 0;\n left: -1em;\n padding: 1em;\n height: 4.6rem;\n font-size: 1.6rem;\n background-color: white;\n font-weight: bold;\n padding-left: 1rem;\n z-index: 2;\n .icon {\n cursor: pointer;\n font-size: 22px;\n }\n @media only screen and (max-width: 640px) {\n font-size: 1.2rem;\n height: 4rem;\n }\n`;\n\nexport const CartDrawerProductContainer = styled.div`\n width: 100%;\n height: max-content;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n position: relative;\n /* height: 900px; */\n padding: 1rem;\n min-height: 74vh;\n opacity: ${(props) => props.opacity};\n @media only screen and (max-width: 748px) {\n min-height: 75vh;\n }\n /* background-color: red; */\n`;\n\nexport const CartDrawerBottomSection = styled.div`\n width: 100%;\n /* height: 8rem; */\n background-color: white;\n box-shadow: 3px -2px 10px #b1b1b1;\n display: flex;\n flex-direction: column;\n min-height: 7rem;\n position: sticky;\n bottom: 0;\n /* padding-bottom: 0.5rem; */\n\n /* left: 0; */\n align-items: center;\n .row {\n width: 100%;\n padding: 0rem 1rem;\n padding-top: 1rem;\n /* padding-left: 1rem; */\n h5 {\n font-weight: bold;\n font-size: 1.1rem;\n span {\n font-weight: 400;\n padding-left: 0.5rem;\n }\n }\n }\n @media only screen and (max-width: 340px) {\n min-height: 6rem;\n .row h5 {\n font-size: 0.8rem;\n }\n }\n`;\n\nexport const CartDrawerOutlinedButton = styled.button`\n width: 90%;\n height: 3.55rem;\n border: 2px solid;\n border-radius: 1rem;\n display: grid;\n place-items: center;\n font-weight: 500;\n font-size: 1rem;\n transition: 0.5s;\n outline: none;\n text-transform: capitalize;\n border-color: ${(props) => props.color || 'black'};\n color: ${(props) => props.color || 'black'};\n text-transform: capitalize;\n margin: 0.6rem 0;\n cursor: pointer;\n background: white;\n &:hover,\n &:focus {\n opacity: 0.8;\n letter-spacing: 1px;\n outline: none;\n }\n @media only screen and (max-width: 640px) {\n height: 2.9rem;\n }\n @media only screen and (max-width: 340px) {\n height: 2.2rem;\n margin: 0.3rem 0;\n }\n`;\n\nexport const CartDrawerFilledButton = styled(CartDrawerOutlinedButton)`\n background: ${(props) => props.color || 'black'};\n color: white;\n position: relative;\n margin-bottom: 1rem;\n .icon {\n position: absolute;\n right: 2rem;\n margin: auto 0;\n }\n`;\n\nexport const CartDrawerEmptyCart = styled.div`\n width: 100%;\n height: calc(100vh - 4.6rem);\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n h6 {\n font-size: 1.8rem;\n font-weight: bold;\n text-transform: uppercase;\n margin: 0;\n margin-top: 1rem;\n color: ${(props) => props.color || 'red'};\n }\n p {\n font-size: 1.1rem;\n text-transform: capitalize;\n font-weight: 500;\n /* color: darkgrey; */\n /* color: orange; */\n }\n .icon {\n font-size: 9.5rem;\n color: darkgrey;\n /* color: orange; */\n }\n`;\n","import styled from 'styled-components';\nexport const CartDrawerProduct = styled.div`\n width: 100%;\n display: flex;\n flex-direction: row;\n height: 100px;\n justify-content: space-around;\n align-items: center;\n overflow: hidden;\n margin-bottom: 2rem;\n img {\n width: 20%;\n max-height: 100%;\n /* aspect-ratio: 1; */\n object-fit: cover;\n }\n .middleSection {\n width: 60%;\n padding-left: 0.8rem;\n height: 100%;\n h6 {\n font-size: 1.1rem;\n font-weight: bold;\n margin: 0;\n\n span {\n font-size: 0.8rem;\n color: grey;\n text-decoration: line-through;\n margin-right: 0.5rem;\n }\n }\n .name {\n font-size: 0.9rem;\n line-height: 1.2rem;\n max-height: 2.45rem;\n width: 100%;\n word-wrap: break-word;\n overflow: hidden;\n text-overflow: ellipsis;\n transition: 0.3s;\n cursor: pointer;\n &:hover {\n color: ${(props) => props.color || 'grey'};\n }\n }\n }\n .endSection {\n width: 20%;\n height: 100%;\n .icon {\n cursor: pointer;\n transition: 0.4s;\n &:hover {\n color: red;\n /* opacity: 0.7; */\n }\n }\n }\n @media only screen and (max-width: 340px) {\n height: 80px;\n .middleSection {\n h6 {\n font-size: 0.9rem;\n }\n .name {\n font-size: 0.7rem;\n height: 1.45rem;\n }\n }\n }\n`;\n\nexport const CartDrawerQtBox = styled.div`\n height: 34px;\n width: 82px;\n border: 1px solid rgb(211, 210, 210);\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 13.5px;\n color: #333;\n padding: 0 0.5rem;\n border-radius: 5px;\n max-width: 100%;\n\n span {\n cursor: pointer;\n height: 100%;\n display: grid;\n place-items: center;\n }\n .qt {\n font-size: 12px;\n color: black;\n font-weight: 500;\n cursor: auto;\n }\n @media only screen and (max-width: 640px) {\n min-width: 55px;\n aspect-ratio: 1/2;\n /* min-height: 28px; */\n font-size: 10px;\n }\n @media only screen and (max-width: 340px) {\n min-width: 50px;\n aspect-ratio: 1/2;\n height: 22px;\n font-size: 8px;\n }\n`;\nexport const CartDrawerLoader = styled.div`\n position: absolute;\n top: 30%;\n width: 100px;\n height: 100px;\n display: grid;\n place-items: center;\n`;\n","import React from 'react';\nimport { Stack, Tooltip } from '@mui/material';\nimport { RiDeleteBin5Line } from 'react-icons/ri';\nimport { AiOutlinePlus, AiOutlineMinus } from 'react-icons/ai';\n// import imgnotfound from '../../../assets/imgnotfound.jpeg';\n////////\nimport { CartDrawerProduct, CartDrawerQtBox } from './CartDrawerProduct.styles';\nconst CartDrawerProductCard = ({\n product,\n color,\n handleIncrementDecrement,\n handleRemoveProduct,\n handleRedirect,\n imgnotfoundUrl,\n}) => {\n let imgnotfoundUrlcommon = '/images/imgnotfound.jpeg';\n if (imgnotfoundUrl && imgnotfoundUrl !== 'null')\n imgnotfoundUrlcommon = imgnotfoundUrl;\n\n return (\n <CartDrawerProduct color={color}>\n <img\n src={\n product.imageUrl && product.imageUrl !== 'null'\n ? product.imageUrl\n : imgnotfoundUrlcommon\n }\n alt={'no product image available'}\n />\n <Stack\n flexDirection=\"column\"\n justifyContent=\"space-between\"\n alignItems=\"flex-start\"\n className=\"middleSection\"\n >\n <Tooltip title={product?.productName} placement=\"top\" arrow>\n <h6 className=\"name\" onClick={() => handleRedirect(product)}>\n {product?.productName}\n </h6>\n </Tooltip>\n\n <h6>\n {product?.standardPrice === product?.cartStandardPrice ? (\n `$${product?.standardPrice}`\n ) : (\n <React.Fragment>\n <span>${product?.cartStandardPrice?.toFixed(2)}</span>$\n {product?.standardPrice?.toFixed(2)}\n </React.Fragment>\n )}\n </h6>\n </Stack>\n <Stack\n flexDirection=\"column\"\n justifyContent=\"space-between\"\n alignItems=\"flex-end\"\n className=\"endSection\"\n >\n <RiDeleteBin5Line\n className=\"icon\"\n onClick={() => {\n handleRemoveProduct(product);\n }}\n />\n <CartDrawerQtBox>\n <span\n onClick={() => {\n handleIncrementDecrement('decrement', product);\n }}\n >\n {' '}\n <AiOutlineMinus />\n </span>{' '}\n <span className={'qt'}>{product?.quantity}</span>\n <span\n onClick={() => {\n handleIncrementDecrement('increment', product);\n }}\n >\n <AiOutlinePlus />\n </span>\n </CartDrawerQtBox>\n </Stack>\n </CartDrawerProduct>\n );\n};\n\nexport default CartDrawerProductCard;\n","import { Stack } from '@mui/material';\nimport React from 'react';\nimport { GrClose } from 'react-icons/gr';\nimport { GiShoppingCart } from 'react-icons/gi';\nimport { BsCartX } from 'react-icons/bs';\n//////\nimport {\n CartDrawerBar,\n CartDrawerBottomSection,\n CartDrawerContainer,\n CartDrawerOutlinedButton,\n CartDrawerFilledButton,\n CartDrawerProductContainer,\n CartDrawerEmptyCart,\n} from './cartDrawer.styles';\nimport CartDrawerProductCard from './CartDrawerCard/CartDrawerCard';\nimport { CartDrawerLoader } from './CartDrawerCard/CartDrawerProduct.styles';\nimport { PuffLoader } from 'react-spinners';\n\nconst CartDrawer = ({\n cartData,\n maxWidth,\n color,\n handleRedirect,\n handleIncrementDecrement,\n handleRemoveProduct,\n handleClose,\n loading,\n imgnotfoundUrl,\n}) => {\n return (\n <React.Fragment>\n <CartDrawerContainer maxWidth={maxWidth}>\n <CartDrawerBar>\n <h2>Your Cart</h2>\n <GrClose\n className=\"icon\"\n onClick={() => {\n handleClose();\n }}\n />\n </CartDrawerBar>\n {cartData && cartData?.totalCartQuantity > 0 ? (\n <CartDrawerProductContainer opacity={loading ? '.4' : '1'}>\n {cartData?.cartLineItemDtoList?.map((product, i) => (\n <React.Fragment>\n {loading && (\n <CartDrawerLoader>\n <PuffLoader color=\"black\" />\n </CartDrawerLoader>\n )}\n\n <CartDrawerProductCard\n product={product}\n handleRedirect={handleRedirect}\n handleIncrementDecrement={handleIncrementDecrement}\n handleRemoveProduct={handleRemoveProduct}\n color={color}\n key={i}\n imgnotfoundUrl={imgnotfoundUrl}\n />\n </React.Fragment>\n ))}\n </CartDrawerProductContainer>\n ) : (\n <CartDrawerEmptyCart color={color}>\n <BsCartX className=\"icon\" />\n <h6>OOps!</h6>\n <p>your cart is empty</p>\n </CartDrawerEmptyCart>\n )}\n {cartData && cartData?.totalCartQuantity > 0 && (\n <CartDrawerBottomSection>\n <Stack\n flexDirection=\"row\"\n justifyContent=\"space-between\"\n alignItems=\"center\"\n className=\"row\"\n >\n <h5>\n Subtotal<span>({cartData?.totalCartQuantity} items)</span>\n </h5>\n <h5>${cartData?.totalCartPrice?.toFixed(2)}</h5>\n </Stack>\n <CartDrawerOutlinedButton\n color={color}\n onClick={() => handleRedirect('cart')}\n >\n view cart\n </CartDrawerOutlinedButton>\n <CartDrawerFilledButton\n color={color}\n onClick={() => handleRedirect('checkout')}\n >\n continue to checkout\n </CartDrawerFilledButton>\n </CartDrawerBottomSection>\n )}\n </CartDrawerContainer>\n </React.Fragment>\n );\n};\n\nexport default CartDrawer;\n","class Breakpoint {\n static xs = 'xs';\n static sm = 'sm';\n static md = 'md';\n static lg = 'lg';\n static xl = 'xl';\n static xxl = 'xxl';\n}\n\nexport default Breakpoint;\n","class Variant {\n static ONE = 'one';\n static TWO = 'two';\n static THREE = 'three';\n}\n\nexport default Variant;\n","export default function debounce(func, wait, immediate) {\n let timeout;\n return function (...args) {\n clearTimeout(timeout);\n timeout = setTimeout(() => {\n timeout = null;\n if (!immediate) func.apply(this, args);\n }, wait);\n if (immediate && !timeout) func.apply(this, [...args]);\n };\n}\n","import { useEffect, useState } from 'react';\nimport debounce from '../utils/debounce';\n\nfunction useWindowSize() {\n const isWindow = typeof window !== 'undefined';\n const [windowSize, setWindowSize] = useState({\n width: isWindow ? window.innerWidth : 1200,\n height: isWindow ? window.innerHeight : 800,\n });\n\n useEffect(() => {\n const onWindowResize = () => {\n setWindowSize({\n width: window.innerWidth,\n height: window.innerHeight,\n });\n };\n\n const onResize = debounce(onWindowResize, 100);\n\n window.addEventListener('resize', onResize);\n onWindowResize();\n\n return () => {\n window.removeEventListener('resize', onResize);\n };\n }, []);\n\n return windowSize;\n}\n\nexport default useWindowSize;\n","import { useEffect, useState } from 'react';\nimport useWindowSize from './useWindowSize';\nimport { Breakpoint } from '../constants';\n\n/*\n The breakpoints of responsive grid follow Google chrome media queries rules\n*/\nconst getBreakpoint = ({ width: screen }) => {\n let breakpoint = '';\n\n if (screen <= 320) {\n breakpoint = Breakpoint.xs;\n }\n if (screen >= 375) {\n breakpoint = Breakpoint.sm;\n }\n if (screen >= 768) {\n breakpoint = Breakpoint.md;\n }\n if (screen >= 992) {\n breakpoint = Breakpoint.lg;\n }\n if (screen >= 1200) {\n breakpoint = Breakpoint.xl;\n }\n if (screen >= 1600) {\n breakpoint = Breakpoint.xxl;\n }\n\n return breakpoint;\n};\n\nfunction useGridSize() {\n const windowSize = useWindowSize();\n const [layout, setLayout] = useState(Breakpoint.md);\n\n useEffect(() => {\n setLayout(getBreakpoint(windowSize));\n }, [windowSize]);\n return layout;\n}\n\nexport default useGridSize;\n"],"names":["CartDrawerContainer","styled","div","props","maxWidth","fontFamily","CartDrawerBar","CartDrawerProductContainer","opacity","CartDrawerBottomSection","CartDrawerOutlinedButton","button","color","CartDrawerFilledButton","CartDrawerEmptyCart","CartDrawerProduct","CartDrawerQtBox","CartDrawerLoader","CartDrawerProductCard","product","handleIncrementDecrement","handleRemoveProduct","handleRedirect","imgnotfoundUrl","imgnotfoundUrlcommon","imageUrl","productName","standardPrice","cartStandardPrice","toFixed","quantity","CartDrawer","cartData","handleClose","loading","totalCartQuantity","cartLineItemDtoList","map","i","totalCartPrice","Breakpoint","xs","sm","md","lg","xl","xxl","Variant","ONE","TWO","THREE","debounce","func","wait","immediate","timeout","args","clearTimeout","setTimeout","apply","useWindowSize","isWindow","window","useState","width","innerWidth","height","innerHeight","windowSize","setWindowSize","useEffect","onWindowResize","onResize","addEventListener","removeEventListener","getBreakpoint","screen","breakpoint","useGridSize","layout","setLayout"],"mappings":"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"}
1
+ {"version":3,"file":"index.modern.js","sources":["../src/components/CartDrawer/cartDrawer.styles.js","../src/components/CartDrawer/CartDrawerCard/CartDrawerProduct.styles.js","../src/components/CartDrawer/CartDrawerCard/CartDrawerCard.jsx","../src/components/CartDrawer/CartDrawer.jsx","../src/constants/Breakpoint.js","../src/constants/Variant.js","../src/utils/debounce.js","../src/hooks/useWindowSize.jsx","../src/hooks/useGridSize.jsx"],"sourcesContent":["import styled from 'styled-components';\nexport const CartDrawerContainer = styled.div`\n width: 100%;\n max-width: ${(props) => props.maxWidth || '650px'};\n height: 100%;\n font-family: ${(props) => props.fontFamily};\n /* padding: 1em;\n padding-top: 0rem; */\n position: relative;\n /* min-width: 100%; */\n min-height: 100vh;\n max-height: 100vh;\n overflow-y: auto;\n /* background-color: grey; */\n /* border: 1px solid; */\n`;\n\nexport const CartDrawerBar = styled.div`\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n position: sticky;\n box-sizing: border-box;\n top: 0;\n left: -1em;\n padding: 1em;\n height: 4.6rem;\n font-size: 1.6rem;\n background-color: white;\n font-weight: bold;\n padding-left: 1rem;\n z-index: 2;\n .icon {\n cursor: pointer;\n font-size: 22px;\n }\n @media only screen and (max-width: 640px) {\n font-size: 1.2rem;\n height: 4rem;\n }\n`;\n\nexport const CartDrawerProductContainer = styled.div`\n width: 100%;\n height: max-content;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n position: relative;\n /* height: 900px; */\n padding: 1rem;\n min-height: 74vh;\n opacity: ${(props) => props.opacity};\n @media only screen and (max-width: 748px) {\n min-height: 75vh;\n }\n /* background-color: red; */\n`;\n\nexport const CartDrawerBottomSection = styled.div`\n width: 100%;\n /* height: 8rem; */\n background-color: white;\n box-shadow: 3px -2px 10px #b1b1b1;\n display: flex;\n flex-direction: column;\n min-height: 7rem;\n position: sticky;\n bottom: 0;\n /* padding-bottom: 0.5rem; */\n\n /* left: 0; */\n align-items: center;\n .row {\n width: 100%;\n padding: 0rem 1rem;\n padding-top: 1rem;\n /* padding-left: 1rem; */\n h5 {\n font-weight: bold;\n font-size: 1.1rem;\n span {\n font-weight: 400;\n padding-left: 0.5rem;\n }\n }\n }\n @media only screen and (max-width: 340px) {\n min-height: 6rem;\n .row h5 {\n font-size: 0.8rem;\n }\n }\n`;\n\nexport const CartDrawerOutlinedButton = styled.button`\n width: 90%;\n height: 3.55rem;\n border: 2px solid;\n border-radius: 1rem;\n display: grid;\n place-items: center;\n font-weight: 500;\n font-size: 1rem;\n transition: 0.5s;\n outline: none;\n text-transform: capitalize;\n border-color: ${(props) => props.color || 'black'};\n color: ${(props) => props.color || 'black'};\n text-transform: capitalize;\n margin: 0.6rem 0;\n cursor: pointer;\n background: white;\n &:hover,\n &:focus {\n opacity: 0.8;\n letter-spacing: 1px;\n outline: none;\n }\n @media only screen and (max-width: 640px) {\n height: 2.9rem;\n }\n @media only screen and (max-width: 340px) {\n height: 2.2rem;\n margin: 0.3rem 0;\n }\n`;\n\nexport const CartDrawerFilledButton = styled(CartDrawerOutlinedButton)`\n background: ${(props) => props.color || 'black'};\n color: white;\n position: relative;\n margin-bottom: 1rem;\n .icon {\n position: absolute;\n right: 2rem;\n margin: auto 0;\n }\n`;\n\nexport const CartDrawerEmptyCart = styled.div`\n width: 100%;\n height: calc(100vh - 4.6rem);\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n h6 {\n font-size: 1.8rem;\n font-weight: bold;\n text-transform: uppercase;\n margin: 0;\n margin-top: 1rem;\n color: ${(props) => props.color || 'red'};\n }\n p {\n font-size: 1.1rem;\n text-transform: capitalize;\n font-weight: 500;\n /* color: darkgrey; */\n /* color: orange; */\n }\n .icon {\n font-size: 9.5rem;\n color: darkgrey;\n /* color: orange; */\n }\n`;\n","import styled from 'styled-components';\nexport const CartDrawerProduct = styled.div`\n width: 100%;\n display: flex;\n flex-direction: row;\n height: 100px;\n justify-content: space-around;\n align-items: center;\n overflow: hidden;\n margin-bottom: 2rem;\n img {\n width: 20%;\n max-height: 100%;\n /* aspect-ratio: 1; */\n object-fit: cover;\n }\n .middleSection {\n width: 60%;\n padding-left: 0.8rem;\n height: 100%;\n h6 {\n font-size: 1.1rem;\n font-weight: bold;\n margin: 0;\n\n span {\n font-size: 0.8rem;\n color: grey;\n text-decoration: line-through;\n margin-right: 0.5rem;\n }\n }\n .name {\n font-size: 0.9rem;\n line-height: 1.2rem;\n max-height: 2.45rem;\n width: 100%;\n word-wrap: break-word;\n overflow: hidden;\n text-overflow: ellipsis;\n transition: 0.3s;\n cursor: pointer;\n &:hover {\n color: ${(props) => props.color || 'grey'};\n }\n }\n }\n .endSection {\n width: 20%;\n height: 100%;\n .icon {\n cursor: pointer;\n transition: 0.4s;\n &:hover {\n color: red;\n /* opacity: 0.7; */\n }\n }\n }\n @media only screen and (max-width: 340px) {\n height: 80px;\n .middleSection {\n h6 {\n font-size: 0.9rem;\n }\n .name {\n font-size: 0.7rem;\n height: 1.45rem;\n }\n }\n }\n`;\n\nexport const CartDrawerQtBox = styled.div`\n height: 34px;\n width: 82px;\n border: 1px solid rgb(211, 210, 210);\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 13.5px;\n color: #333;\n padding: 0 0.5rem;\n border-radius: 5px;\n max-width: 100%;\n\n span {\n cursor: pointer;\n height: 100%;\n display: grid;\n place-items: center;\n }\n .qt {\n font-size: 12px;\n color: black;\n font-weight: 500;\n cursor: auto;\n }\n @media only screen and (max-width: 640px) {\n min-width: 55px;\n aspect-ratio: 1/2;\n /* min-height: 28px; */\n font-size: 10px;\n }\n @media only screen and (max-width: 340px) {\n min-width: 50px;\n aspect-ratio: 1/2;\n height: 22px;\n font-size: 8px;\n }\n`;\nexport const CartDrawerLoader = styled.div`\n position: absolute;\n top: 30%;\n width: 100px;\n height: 100px;\n display: grid;\n place-items: center;\n`;\n","import React from 'react';\nimport { Stack, Tooltip } from '@mui/material';\nimport { RiDeleteBin5Line } from 'react-icons/ri';\nimport { AiOutlinePlus, AiOutlineMinus } from 'react-icons/ai';\n// import imgnotfound from '../../../assets/imgnotfound.jpeg';\n////////\nimport { CartDrawerProduct, CartDrawerQtBox } from './CartDrawerProduct.styles';\nconst CartDrawerProductCard = ({\n product,\n color,\n handleIncrementDecrement,\n handleRemoveProduct,\n handleRedirect,\n imgnotfoundUrl,\n loading,\n}) => {\n let imgnotfoundUrlcommon = '/images/imgnotfound.jpeg';\n if (imgnotfoundUrl && imgnotfoundUrl !== 'null')\n imgnotfoundUrlcommon = imgnotfoundUrl;\n\n return (\n <CartDrawerProduct color={color}>\n <img\n src={\n product.imageUrl && product.imageUrl !== 'null'\n ? product.imageUrl\n : imgnotfoundUrlcommon\n }\n alt={'no product image available'}\n />\n <Stack\n flexDirection=\"column\"\n justifyContent=\"space-between\"\n alignItems=\"flex-start\"\n className=\"middleSection\"\n >\n <Tooltip title={product?.productName} placement=\"top\" arrow>\n <h6 className=\"name\" onClick={() => handleRedirect(product)}>\n {product?.productName}\n </h6>\n </Tooltip>\n\n <h6>\n {product?.standardPrice === product?.cartStandardPrice ? (\n `$${product?.standardPrice}`\n ) : (\n <React.Fragment>\n <span>${product?.cartStandardPrice?.toFixed(2)}</span>$\n {product?.standardPrice?.toFixed(2)}\n </React.Fragment>\n )}\n </h6>\n </Stack>\n <Stack\n flexDirection=\"column\"\n justifyContent=\"space-between\"\n alignItems=\"flex-end\"\n className=\"endSection\"\n >\n <RiDeleteBin5Line\n className=\"icon\"\n onClick={() => {\n if (loading) return;\n handleRemoveProduct(product);\n }}\n />\n <CartDrawerQtBox>\n <span\n onClick={() => {\n if (loading) return;\n handleIncrementDecrement('decrement', product);\n }}\n >\n {' '}\n <AiOutlineMinus />\n </span>{' '}\n <span className={'qt'}>{product?.quantity}</span>\n <span\n onClick={() => {\n if (loading) return;\n handleIncrementDecrement('increment', product);\n }}\n >\n <AiOutlinePlus />\n </span>\n </CartDrawerQtBox>\n </Stack>\n </CartDrawerProduct>\n );\n};\n\nexport default CartDrawerProductCard;\n","import { Stack } from '@mui/material';\nimport React from 'react';\nimport { GrClose } from 'react-icons/gr';\nimport { GiShoppingCart } from 'react-icons/gi';\nimport { BsCartX } from 'react-icons/bs';\n//////\nimport {\n CartDrawerBar,\n CartDrawerBottomSection,\n CartDrawerContainer,\n CartDrawerOutlinedButton,\n CartDrawerFilledButton,\n CartDrawerProductContainer,\n CartDrawerEmptyCart,\n} from './cartDrawer.styles';\nimport CartDrawerProductCard from './CartDrawerCard/CartDrawerCard';\nimport { CartDrawerLoader } from './CartDrawerCard/CartDrawerProduct.styles';\nimport { PuffLoader } from 'react-spinners';\n\nconst CartDrawer = ({\n cartData,\n maxWidth,\n color,\n handleRedirect,\n handleIncrementDecrement,\n handleRemoveProduct,\n handleClose,\n loading,\n imgnotfoundUrl,\n}) => {\n return (\n <React.Fragment>\n <CartDrawerContainer maxWidth={maxWidth}>\n <CartDrawerBar>\n <h2>Your Cart</h2>\n <GrClose\n className=\"icon\"\n onClick={() => {\n handleClose();\n }}\n />\n </CartDrawerBar>\n {cartData && cartData?.totalCartQuantity > 0 ? (\n <CartDrawerProductContainer opacity={loading ? '.4' : '1'}>\n {cartData?.cartLineItemDtoList?.map((product, i) => (\n <React.Fragment>\n {loading && (\n <CartDrawerLoader>\n <PuffLoader color=\"black\" />\n </CartDrawerLoader>\n )}\n\n <CartDrawerProductCard\n product={product}\n handleRedirect={handleRedirect}\n handleIncrementDecrement={handleIncrementDecrement}\n handleRemoveProduct={handleRemoveProduct}\n color={color}\n key={i}\n imgnotfoundUrl={imgnotfoundUrl}\n loading={loading}\n />\n </React.Fragment>\n ))}\n </CartDrawerProductContainer>\n ) : (\n <CartDrawerEmptyCart color={color}>\n <BsCartX className=\"icon\" />\n <h6>OOps!</h6>\n <p>your cart is empty</p>\n </CartDrawerEmptyCart>\n )}\n {cartData && cartData?.totalCartQuantity > 0 && (\n <CartDrawerBottomSection>\n <Stack\n flexDirection=\"row\"\n justifyContent=\"space-between\"\n alignItems=\"center\"\n className=\"row\"\n >\n <h5>\n Subtotal<span>({cartData?.totalCartQuantity} items)</span>\n </h5>\n <h5>${cartData?.totalCartPrice?.toFixed(2)}</h5>\n </Stack>\n <CartDrawerOutlinedButton\n color={color}\n onClick={() => handleRedirect('cart')}\n >\n view cart\n </CartDrawerOutlinedButton>\n <CartDrawerFilledButton\n color={color}\n onClick={() => handleRedirect('checkout')}\n >\n continue to checkout\n </CartDrawerFilledButton>\n </CartDrawerBottomSection>\n )}\n </CartDrawerContainer>\n </React.Fragment>\n );\n};\n\nexport default CartDrawer;\n","class Breakpoint {\n static xs = 'xs';\n static sm = 'sm';\n static md = 'md';\n static lg = 'lg';\n static xl = 'xl';\n static xxl = 'xxl';\n}\n\nexport default Breakpoint;\n","class Variant {\n static ONE = 'one';\n static TWO = 'two';\n static THREE = 'three';\n}\n\nexport default Variant;\n","export default function debounce(func, wait, immediate) {\n let timeout;\n return function (...args) {\n clearTimeout(timeout);\n timeout = setTimeout(() => {\n timeout = null;\n if (!immediate) func.apply(this, args);\n }, wait);\n if (immediate && !timeout) func.apply(this, [...args]);\n };\n}\n","import { useEffect, useState } from 'react';\nimport debounce from '../utils/debounce';\n\nfunction useWindowSize() {\n const isWindow = typeof window !== 'undefined';\n const [windowSize, setWindowSize] = useState({\n width: isWindow ? window.innerWidth : 1200,\n height: isWindow ? window.innerHeight : 800,\n });\n\n useEffect(() => {\n const onWindowResize = () => {\n setWindowSize({\n width: window.innerWidth,\n height: window.innerHeight,\n });\n };\n\n const onResize = debounce(onWindowResize, 100);\n\n window.addEventListener('resize', onResize);\n onWindowResize();\n\n return () => {\n window.removeEventListener('resize', onResize);\n };\n }, []);\n\n return windowSize;\n}\n\nexport default useWindowSize;\n","import { useEffect, useState } from 'react';\nimport useWindowSize from './useWindowSize';\nimport { Breakpoint } from '../constants';\n\n/*\n The breakpoints of responsive grid follow Google chrome media queries rules\n*/\nconst getBreakpoint = ({ width: screen }) => {\n let breakpoint = '';\n\n if (screen <= 320) {\n breakpoint = Breakpoint.xs;\n }\n if (screen >= 375) {\n breakpoint = Breakpoint.sm;\n }\n if (screen >= 768) {\n breakpoint = Breakpoint.md;\n }\n if (screen >= 992) {\n breakpoint = Breakpoint.lg;\n }\n if (screen >= 1200) {\n breakpoint = Breakpoint.xl;\n }\n if (screen >= 1600) {\n breakpoint = Breakpoint.xxl;\n }\n\n return breakpoint;\n};\n\nfunction useGridSize() {\n const windowSize = useWindowSize();\n const [layout, setLayout] = useState(Breakpoint.md);\n\n useEffect(() => {\n setLayout(getBreakpoint(windowSize));\n }, [windowSize]);\n return layout;\n}\n\nexport default useGridSize;\n"],"names":["CartDrawerContainer","styled","div","props","maxWidth","fontFamily","CartDrawerBar","CartDrawerProductContainer","opacity","CartDrawerBottomSection","CartDrawerOutlinedButton","button","color","CartDrawerFilledButton","CartDrawerEmptyCart","CartDrawerProduct","CartDrawerQtBox","CartDrawerLoader","CartDrawerProductCard","product","handleIncrementDecrement","handleRemoveProduct","handleRedirect","imgnotfoundUrl","loading","imgnotfoundUrlcommon","imageUrl","productName","standardPrice","cartStandardPrice","toFixed","quantity","CartDrawer","cartData","handleClose","totalCartQuantity","cartLineItemDtoList","map","i","totalCartPrice","Breakpoint","xs","sm","md","lg","xl","xxl","Variant","ONE","TWO","THREE","debounce","func","wait","immediate","timeout","args","clearTimeout","setTimeout","apply","useWindowSize","isWindow","window","useState","width","innerWidth","height","innerHeight","windowSize","setWindowSize","useEffect","onWindowResize","onResize","addEventListener","removeEventListener","getBreakpoint","screen","breakpoint","useGridSize","layout","setLayout"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salesgenterp/ui-components",
3
- "version": "0.2.21",
3
+ "version": "0.3.0",
4
4
  "description": "Made with create-react-library",
5
5
  "author": "",
6
6
  "license": "MIT",
@@ -42,7 +42,8 @@
42
42
  "styled-components": "^5.3.5"
43
43
  },
44
44
  "dependencies": {
45
- "react-spinners": "^0.13.4"
45
+ "react-spinners": "^0.13.4",
46
+ "storybook-addon-state": "^1.0.3"
46
47
  },
47
48
  "devDependencies": {
48
49
  "@babel/core": "^7.12.10",