@salesgenterp/ui-components 0.3.52 → 0.3.54
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 +65 -55
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +65 -55
- package/dist/index.modern.js.map +1 -1
- package/package.json +10 -10
package/dist/index.modern.js
CHANGED
|
@@ -184,17 +184,17 @@ var CartDrawer = function CartDrawer(_ref) {
|
|
|
184
184
|
};
|
|
185
185
|
|
|
186
186
|
var _templateObject$2, _templateObject2$2, _templateObject3$2, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1, _templateObject8;
|
|
187
|
-
var CartPageSection = styled.section(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n max-width: 100%;\n width: fit-content;\n background: ", ";\n overflow: hidden;\n"])), function (props) {
|
|
187
|
+
var CartPageSection = styled.section(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteralLoose(["\n background: ", ";\n max-width: 100%;\n width: fit-content;\n background: ", ";\n overflow: hidden;\n font-family: 'karla-fonts';\n"])), function (props) {
|
|
188
188
|
return props.bg;
|
|
189
189
|
}, function (props) {
|
|
190
190
|
return props.bg || '#FAE8E5';
|
|
191
191
|
});
|
|
192
|
-
var CartPageContainer = styled.div(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: ", ";\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n border-radius: 28px 28px 28px 14px;\n
|
|
192
|
+
var CartPageContainer = styled.div(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: ", ";\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n border-radius: 28px 28px 28px 14px;\n padding: 3em 2em;\n border-radius: 28px;\n opacity: ", ";\n .scrollDiv {\n width: 68%;\n height: 630px;\n max-height: 630px;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n border: 2px solid;\n border-color: #fae8e5;\n /* border-color: ", "; */\n }\n /* box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05); */\n }\n @media only screen and (max-width: 1340px) {\n flex-direction: column;\n align-items: center;\n padding: 0.5em;\n .scrollDiv {\n width: 100%;\n margin: 0;\n margin-bottom: 2em;\n padding: 0 0.4em;\n }\n }\n"])), function (props) {
|
|
193
193
|
return props.maxWidth || '1450px';
|
|
194
194
|
}, function (props) {
|
|
195
195
|
return props.loading ? '0.7' : 1;
|
|
196
196
|
}, function (props) {
|
|
197
|
-
return props.retail ? '12px' : '
|
|
197
|
+
return props.retail ? '12px' : '10px';
|
|
198
198
|
}, function (props) {
|
|
199
199
|
return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
|
|
200
200
|
}, function (props) {
|
|
@@ -205,12 +205,12 @@ var CartPageContainer = styled.div(_templateObject2$2 || (_templateObject2$2 = _
|
|
|
205
205
|
var CardsBox = styled.div(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteralLoose(["\n width: 100%;\n /* min-height: 1000px; */\n position: relative;\n max-width: 860px;\n margin-right: auto;\n padding: 1em 2em;\n display: ", ";\n grid-template-columns: 1fr 1fr;\n flex-direction: column;\n align-items: flex-start;\n grid-gap: 1em;\n justify-content: flex-start;\n align-items: center;\n border-radius: 20px;\n @media only screen and (max-width: 960px) {\n display: flex;\n }\n @media only screen and (max-width: 640px) {\n padding: 1em 0.2em;\n }\n"])), function (props) {
|
|
206
206
|
return props.retail ? 'grid' : 'flex';
|
|
207
207
|
});
|
|
208
|
-
var Loader = styled.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 40%;\n left: 47%;\n display: grid;\n place-items: center;\n z-index:
|
|
209
|
-
var CartTableCell = styled(TableCell)(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n padding-bottom: 1em !important;\n
|
|
210
|
-
return props.bg
|
|
208
|
+
var Loader = styled.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 40%;\n left: 47%;\n display: grid;\n place-items: center;\n z-index: 3;\n"])));
|
|
209
|
+
var CartTableCell = styled(TableCell)(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n && {\n padding-bottom: 1em !important;\n border: none !important;\n font-size: 0.75rem;\n background: ", ";\n }\n"])), function (props) {
|
|
210
|
+
return "" + props.bg;
|
|
211
211
|
});
|
|
212
|
-
var CartTableContainer = styled(TableContainer)(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n max-height: 580px;\n padding-right:
|
|
213
|
-
return props.retail ? '12px' : '
|
|
212
|
+
var CartTableContainer = styled(TableContainer)(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n max-height: 580px;\n min-height: 400px;\n padding-right: 1.5em;\n\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n background: ", ";\n border-radius: 16px;\n width: 100%;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n border-radius: 16px;\n margin: 5px 2px;\n background: ", ";\n border: 3px solid;\n border-color: #fae8e5;\n }\n @media screen and (max-width: 750px) {\n padding: 0;\n }\n"])), function (props) {
|
|
213
|
+
return props.retail ? '12px' : '10px';
|
|
214
214
|
}, function (props) {
|
|
215
215
|
return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
|
|
216
216
|
}, function (props) {
|
|
@@ -218,12 +218,12 @@ var CartTableContainer = styled(TableContainer)(_templateObject6$1 || (_template
|
|
|
218
218
|
}, function (props) {
|
|
219
219
|
return props.color || '#ef9687';
|
|
220
220
|
});
|
|
221
|
-
var CartButtonsRow = styled.div(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-items: center;\n button {\n background: ", ";\n color: ", ";\n padding: 0.5em 1em;\n margin-right:
|
|
221
|
+
var CartButtonsRow = styled.div(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-items: center;\n button {\n background: ", ";\n color: ", ";\n padding: 0.5em 1em;\n margin-right: 2em;\n font-size: 0.85em;\n text-transform: uppercase;\n border: none;\n cursor: pointer;\n transition: 0.4s;\n &:hover {\n transform: scale(0.9);\n }\n }\n"])), function (props) {
|
|
222
222
|
return props.bg || 'rgba(253, 0, 21, 1)';
|
|
223
223
|
}, function (props) {
|
|
224
224
|
return props.color || 'white';
|
|
225
225
|
});
|
|
226
|
-
var CartPageBox = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n width: 1000px;\n max-width: 100%;\n margin-right: 2em;\n position: relative;\n @media only screen and (max-width: 740px) {\n margin-right: 0;\n .CartnoBelowSm {\n display: none;\n }\n }\n"])));
|
|
226
|
+
var CartPageBox = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n width: 1000px;\n max-width: 100%;\n margin-right: 2em;\n min-height: 30rem;\n position: relative;\n @media only screen and (max-width: 740px) {\n margin-right: 0;\n .CartnoBelowSm {\n display: none;\n }\n }\n"])));
|
|
227
227
|
|
|
228
228
|
function createCommonjsModule(fn, module) {
|
|
229
229
|
return module = { exports: {} }, fn(module, module.exports), module.exports;
|
|
@@ -239,7 +239,7 @@ function createCommonjsModule(fn, module) {
|
|
|
239
239
|
*/
|
|
240
240
|
var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?
|
|
241
241
|
Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
|
|
242
|
-
function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}var AsyncMode=l;var ConcurrentMode=m;var ContextConsumer=k;var ContextProvider=h;var Element=c;var ForwardRef=n;var Fragment=e;var Lazy=t;var Memo=r;var Portal=d;
|
|
242
|
+
function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}var AsyncMode=l;var ConcurrentMode=m;var ContextConsumer=k;var ContextProvider=h;var Element=c;var ForwardRef=n;var Fragment$1=e;var Lazy=t;var Memo=r;var Portal=d;
|
|
243
243
|
var Profiler=g;var StrictMode=f;var Suspense=p;var isAsyncMode=function(a){return A(a)||z(a)===l};var isConcurrentMode=A;var isContextConsumer=function(a){return z(a)===k};var isContextProvider=function(a){return z(a)===h};var isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};var isForwardRef=function(a){return z(a)===n};var isFragment=function(a){return z(a)===e};var isLazy=function(a){return z(a)===t};
|
|
244
244
|
var isMemo=function(a){return z(a)===r};var isPortal=function(a){return z(a)===d};var isProfiler=function(a){return z(a)===g};var isStrictMode=function(a){return z(a)===f};var isSuspense=function(a){return z(a)===p};
|
|
245
245
|
var isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};var typeOf=z;
|
|
@@ -251,7 +251,7 @@ var reactIs_production_min = {
|
|
|
251
251
|
ContextProvider: ContextProvider,
|
|
252
252
|
Element: Element,
|
|
253
253
|
ForwardRef: ForwardRef,
|
|
254
|
-
Fragment: Fragment,
|
|
254
|
+
Fragment: Fragment$1,
|
|
255
255
|
Lazy: Lazy,
|
|
256
256
|
Memo: Memo,
|
|
257
257
|
Portal: Portal,
|
|
@@ -1326,14 +1326,22 @@ if (process.env.NODE_ENV !== 'production') {
|
|
|
1326
1326
|
|
|
1327
1327
|
var _templateObject$3, _templateObject2$3, _templateObject3$3, _templateObject4$2, _templateObject5$2, _templateObject6$2;
|
|
1328
1328
|
var ProductImage = styled.img(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteralLoose(["\n min-width: 50px;\n min-height: 58px;\n @media only screen and (max-width: 640px) {\n margin: 0.5em 0;\n padding-right: 0.5em;\n }\n"])));
|
|
1329
|
-
var ProductName = styled.h6(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n font-size:
|
|
1330
|
-
|
|
1329
|
+
var ProductName = styled.h6(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n font-size: ", ";\n padding: 0.5rem 0;\n line-height: 1.5em;\n max-height: ", ";\n height: ", ";\n overflow: hidden;\n text-overflow: ellipsis;\n"])), function (props) {
|
|
1330
|
+
return props.size || '1rem';
|
|
1331
|
+
}, function (props) {
|
|
1332
|
+
return props.maxHeight ? props.maxHeight + "em" : '3.45em';
|
|
1333
|
+
}, function (props) {
|
|
1334
|
+
return props.maxHeight ? props.maxHeight + "em" : '3.45em';
|
|
1335
|
+
});
|
|
1336
|
+
var CartTableRow = styled(TableRow)(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteralLoose(["\n position: relative;\n transition: 0.3s;\n background: white;\n .outOfStock {\n font-size: 0.75em;\n color: red;\n text-transform: uppercase;\n font-weight: 500;\n }\n .price {\n font-size: ", ";\n font-weight: bold;\n color: #323232;\n }\n .borderLeft {\n height: 100%;\n width: 0;\n background: #fd0015;\n transition: 0.2s;\n width: 0px;\n position: absolute;\n left: 0;\n top: 0;\n border-top-left-radius: 10px;\n display: none;\n border-bottom-left-radius: 10px;\n }\n &:hover {\n background: white !important;\n box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);\n border-radius: 10px;\n /* opacity: 1;\n box-shadow: 1px 2px 6px 2px rgba(0, 0, 0, 0.2); */\n z-index: 2;\n /* border-radius: 20px; */\n .borderLeft {\n width: 13px;\n display: inline-block;\n }\n }\n @media only screen and (max-width: 640px) {\n .CartnoPaddingSm {\n padding: 0 !important;\n }\n .price {\n font-size: 0.8em;\n }\n margin: 0.5em 0;\n .cartCheckBox {\n .css-i4bv87-MuiSvgIcon-root {\n font-size: 10px !important;\n }\n }\n }\n"])), function (props) {
|
|
1337
|
+
return props.size || '1.19rem';
|
|
1338
|
+
});
|
|
1331
1339
|
var CartTableCell$1 = styled(TableCell)(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteralLoose(["\n border: none !important;\n"])));
|
|
1332
|
-
var QuantityBox = styled.div(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n height:
|
|
1340
|
+
var QuantityBox = styled.div(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n height: 2.05em;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n div {\n /* width:30px; */\n min-height: 100%;\n aspect-ratio: 1.05/1;\n display: grid;\n place-items: center;\n font-size: 0.75em;\n color: white;\n background-color: #323232;\n cursor: pointer;\n }\n .price {\n background: transparent;\n cursor: auto;\n background: #ffffff;\n border: 1px solid #ebebeb;\n p {\n color: #5e5c5c;\n font-size: 0.685em;\n font-weight: 500;\n }\n }\n .add {\n background-color: #ebebeb;\n color: #323232;\n }\n"])));
|
|
1333
1341
|
var DeleteBtn = styled.div(_templateObject6$2 || (_templateObject6$2 = _taggedTemplateLiteralLoose(["\n display: grid;\n place-items: center;\n cursor: pointer;\n border-radius: 50%;\n width: 20px;\n height: 20px;\n background: #eef1f4;\n color: #393f48;\n font-size: 0.75em;\n transition: 0.4s;\n &:hover {\n background: red;\n color: white;\n }\n"])));
|
|
1334
1342
|
|
|
1335
1343
|
var CardRow = function CardRow(_ref) {
|
|
1336
|
-
var _styles$Btn, _row$standardPrice, _row$subtotal;
|
|
1344
|
+
var _styles$price, _styles$Btn, _styles$name, _styles$name2, _row$standardPrice, _row$subtotal;
|
|
1337
1345
|
|
|
1338
1346
|
var row = _ref.row,
|
|
1339
1347
|
isItemSelected = _ref.isItemSelected,
|
|
@@ -1347,15 +1355,14 @@ var CardRow = function CardRow(_ref) {
|
|
|
1347
1355
|
var imgnotfoundUrlcommon = '/images/imgnotfound.jpeg';
|
|
1348
1356
|
if (imgnotfoundUrl && imgnotfoundUrl !== 'null') imgnotfoundUrlcommon = imgnotfoundUrl;
|
|
1349
1357
|
return /*#__PURE__*/React__default.createElement(CartTableRow, {
|
|
1350
|
-
hover: true,
|
|
1351
1358
|
onClick: function onClick(event) {
|
|
1352
|
-
return handleClick(event, row
|
|
1359
|
+
return handleClick(event, row);
|
|
1353
1360
|
},
|
|
1354
1361
|
role: "checkbox",
|
|
1355
1362
|
"aria-checked": isItemSelected,
|
|
1356
1363
|
tabIndex: -1,
|
|
1357
1364
|
key: row.ProductId,
|
|
1358
|
-
|
|
1365
|
+
size: styles === null || styles === void 0 ? void 0 : (_styles$price = styles.price) === null || _styles$price === void 0 ? void 0 : _styles$price.size
|
|
1359
1366
|
}, /*#__PURE__*/React__default.createElement(CartTableCell$1, {
|
|
1360
1367
|
padding: "checkbox"
|
|
1361
1368
|
}, /*#__PURE__*/React__default.createElement("span", {
|
|
@@ -1382,11 +1389,10 @@ var CardRow = function CardRow(_ref) {
|
|
|
1382
1389
|
id: row === null || row === void 0 ? void 0 : row.labelId,
|
|
1383
1390
|
scope: "row",
|
|
1384
1391
|
padding: "none"
|
|
1385
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
1386
|
-
|
|
1387
|
-
|
|
1388
|
-
|
|
1389
|
-
}, /*#__PURE__*/React__default.createElement(ProductName, null, row.productName)), row.quantity > row.availableQuantity && /*#__PURE__*/React__default.createElement("p", {
|
|
1392
|
+
}, /*#__PURE__*/React__default.createElement(ProductName, {
|
|
1393
|
+
maxHeight: styles.name && (styles === null || styles === void 0 ? void 0 : (_styles$name = styles.name) === null || _styles$name === void 0 ? void 0 : _styles$name.lines) * 1.7,
|
|
1394
|
+
size: styles === null || styles === void 0 ? void 0 : (_styles$name2 = styles.name) === null || _styles$name2 === void 0 ? void 0 : _styles$name2.size
|
|
1395
|
+
}, row.productName), row.quantity > row.availableQuantity && /*#__PURE__*/React__default.createElement("p", {
|
|
1390
1396
|
className: "outOfStock"
|
|
1391
1397
|
}, "out of stock")), /*#__PURE__*/React__default.createElement(CartTableCell$1, {
|
|
1392
1398
|
align: "center",
|
|
@@ -1401,7 +1407,7 @@ var CardRow = function CardRow(_ref) {
|
|
|
1401
1407
|
if (loading) return;
|
|
1402
1408
|
handleIncrementDecrement('decrement', row);
|
|
1403
1409
|
}
|
|
1404
|
-
},
|
|
1410
|
+
}, /*#__PURE__*/React__default.createElement(AiOutlineMinus, null)), /*#__PURE__*/React__default.createElement("div", {
|
|
1405
1411
|
className: "price"
|
|
1406
1412
|
}, /*#__PURE__*/React__default.createElement("p", null, row === null || row === void 0 ? void 0 : row.quantity)), /*#__PURE__*/React__default.createElement("div", {
|
|
1407
1413
|
className: "add",
|
|
@@ -1410,7 +1416,7 @@ var CardRow = function CardRow(_ref) {
|
|
|
1410
1416
|
if (loading) return;
|
|
1411
1417
|
handleIncrementDecrement('increment', row);
|
|
1412
1418
|
}
|
|
1413
|
-
},
|
|
1419
|
+
}, /*#__PURE__*/React__default.createElement(AiOutlinePlus, null)))), /*#__PURE__*/React__default.createElement(CartTableCell$1, {
|
|
1414
1420
|
alig: "center",
|
|
1415
1421
|
className: "CartnoPaddingSm"
|
|
1416
1422
|
}, /*#__PURE__*/React__default.createElement("p", {
|
|
@@ -1424,7 +1430,7 @@ var CardRow = function CardRow(_ref) {
|
|
|
1424
1430
|
if (loading) return;
|
|
1425
1431
|
handleRemoveProduct(row);
|
|
1426
1432
|
}
|
|
1427
|
-
},
|
|
1433
|
+
}, /*#__PURE__*/React__default.createElement(AiOutlineClose, null))));
|
|
1428
1434
|
};
|
|
1429
1435
|
|
|
1430
1436
|
var headCells = [{
|
|
@@ -1483,11 +1489,11 @@ function EnhancedTableHead(props) {
|
|
|
1483
1489
|
};
|
|
1484
1490
|
|
|
1485
1491
|
return /*#__PURE__*/createElement(TableHead, {
|
|
1486
|
-
className: "CartnoBelowSm"
|
|
1487
|
-
sx: {
|
|
1488
|
-
zIndex: '2'
|
|
1489
|
-
}
|
|
1492
|
+
className: "CartnoBelowSm"
|
|
1490
1493
|
}, /*#__PURE__*/createElement(TableRow$1, null, /*#__PURE__*/createElement(CartTableCell, {
|
|
1494
|
+
sx: {
|
|
1495
|
+
zIndex: '3 !important'
|
|
1496
|
+
},
|
|
1491
1497
|
padding: "checkbox",
|
|
1492
1498
|
bg: styles.bg
|
|
1493
1499
|
}, /*#__PURE__*/createElement(Checkbox, {
|
|
@@ -1505,15 +1511,17 @@ function EnhancedTableHead(props) {
|
|
|
1505
1511
|
padding: headCell.disablePadding ? 'none' : 'normal',
|
|
1506
1512
|
sortDirection: orderBy === headCell.id ? order : false,
|
|
1507
1513
|
sx: {
|
|
1508
|
-
textTransform: 'uppercase'
|
|
1514
|
+
textTransform: 'uppercase',
|
|
1515
|
+
zIndex: '3 !important'
|
|
1509
1516
|
},
|
|
1510
1517
|
className: (headCell === null || headCell === void 0 ? void 0 : headCell.noBelowSm) && 'CartnoBelowSm',
|
|
1511
1518
|
bg: styles.bg
|
|
1512
1519
|
}, headCell.filter ? /*#__PURE__*/createElement(TableSortLabel, {
|
|
1513
1520
|
active: orderBy === headCell.id,
|
|
1514
1521
|
direction: orderBy === headCell.id ? order : 'asc',
|
|
1522
|
+
hideSortIcon: false,
|
|
1515
1523
|
onClick: createSortHandler(headCell.id)
|
|
1516
|
-
}, headCell.label) : headCell.label);
|
|
1524
|
+
}, /*#__PURE__*/createElement(Fragment, null, headCell.label)) : headCell.label);
|
|
1517
1525
|
})));
|
|
1518
1526
|
}
|
|
1519
1527
|
|
|
@@ -1533,6 +1541,7 @@ function EnhancedTable(_ref) {
|
|
|
1533
1541
|
imgnotfoundUrl = _ref.imgnotfoundUrl,
|
|
1534
1542
|
handleIncrementDecrement = _ref.handleIncrementDecrement,
|
|
1535
1543
|
handleRemoveProduct = _ref.handleRemoveProduct,
|
|
1544
|
+
handleRemoveAll = _ref.handleRemoveAll,
|
|
1536
1545
|
styles = _ref.styles;
|
|
1537
1546
|
var cartList = cartData === null || cartData === void 0 ? void 0 : cartData.cartLineItemDtoList.map(function (li) {
|
|
1538
1547
|
return _extends({}, li, {
|
|
@@ -1557,7 +1566,6 @@ function EnhancedTable(_ref) {
|
|
|
1557
1566
|
setCartArray = _React$useState4[1];
|
|
1558
1567
|
|
|
1559
1568
|
var Sort = function Sort() {
|
|
1560
|
-
console.log(orderBy, order);
|
|
1561
1569
|
var newArray = cartArray || [];
|
|
1562
1570
|
var li = orderBy;
|
|
1563
1571
|
|
|
@@ -1585,15 +1593,10 @@ function EnhancedTable(_ref) {
|
|
|
1585
1593
|
};
|
|
1586
1594
|
|
|
1587
1595
|
var handleSelectAllClick = function handleSelectAllClick(event) {
|
|
1588
|
-
console.log(event.target.checked, 'checked');
|
|
1589
|
-
|
|
1590
1596
|
if (selected.length < (cartArray === null || cartArray === void 0 ? void 0 : cartArray.length)) {
|
|
1591
1597
|
var newSelected = [];
|
|
1592
1598
|
cartArray === null || cartArray === void 0 ? void 0 : cartArray.map(function (n) {
|
|
1593
|
-
return newSelected.push(n
|
|
1594
|
-
});
|
|
1595
|
-
console.log({
|
|
1596
|
-
newSelected: newSelected
|
|
1599
|
+
return newSelected.push(n);
|
|
1597
1600
|
});
|
|
1598
1601
|
setSelected(newSelected);
|
|
1599
1602
|
return;
|
|
@@ -1602,20 +1605,19 @@ function EnhancedTable(_ref) {
|
|
|
1602
1605
|
setSelected([]);
|
|
1603
1606
|
};
|
|
1604
1607
|
|
|
1605
|
-
var handleClick = function handleClick(event,
|
|
1606
|
-
|
|
1607
|
-
var includes = selected.includes(id);
|
|
1608
|
+
var handleClick = function handleClick(event, product) {
|
|
1609
|
+
var includes = selected.includes(product);
|
|
1608
1610
|
|
|
1609
1611
|
if (includes) {
|
|
1610
|
-
var removedId = selected.filter(function (
|
|
1611
|
-
return
|
|
1612
|
+
var removedId = selected.filter(function (item) {
|
|
1613
|
+
return item.productId !== (product === null || product === void 0 ? void 0 : product.productId);
|
|
1612
1614
|
});
|
|
1613
1615
|
console.log({
|
|
1614
1616
|
removedId: removedId
|
|
1615
1617
|
});
|
|
1616
1618
|
setSelected(removedId);
|
|
1617
1619
|
} else {
|
|
1618
|
-
setSelected([].concat(selected, [
|
|
1620
|
+
setSelected([].concat(selected, [product]));
|
|
1619
1621
|
}
|
|
1620
1622
|
};
|
|
1621
1623
|
|
|
@@ -1626,6 +1628,7 @@ function EnhancedTable(_ref) {
|
|
|
1626
1628
|
useEffect(function () {
|
|
1627
1629
|
setCartArray(cartList);
|
|
1628
1630
|
}, [cartData]);
|
|
1631
|
+
console.log(selected);
|
|
1629
1632
|
return /*#__PURE__*/createElement(CartPageBox, null, loading && /*#__PURE__*/createElement(Loader, null, /*#__PURE__*/createElement(BounceLoader, {
|
|
1630
1633
|
size: 40,
|
|
1631
1634
|
color: styles.Btn.background,
|
|
@@ -1651,7 +1654,7 @@ function EnhancedTable(_ref) {
|
|
|
1651
1654
|
rowCount: cartArray === null || cartArray === void 0 ? void 0 : cartArray.length,
|
|
1652
1655
|
styles: styles
|
|
1653
1656
|
}), /*#__PURE__*/createElement(TableBody, null, cartArray === null || cartArray === void 0 ? void 0 : cartArray.map(function (row, index) {
|
|
1654
|
-
var isItemSelected = isSelected(row
|
|
1657
|
+
var isItemSelected = isSelected(row);
|
|
1655
1658
|
return /*#__PURE__*/createElement(CardRow, {
|
|
1656
1659
|
row: row,
|
|
1657
1660
|
isItemSelected: isItemSelected,
|
|
@@ -1663,18 +1666,23 @@ function EnhancedTable(_ref) {
|
|
|
1663
1666
|
handleIncrementDecrement: handleIncrementDecrement,
|
|
1664
1667
|
handleRemoveProduct: handleRemoveProduct
|
|
1665
1668
|
});
|
|
1666
|
-
}))))), /*#__PURE__*/createElement(CartButtonsRow, null, /*#__PURE__*/createElement("button",
|
|
1669
|
+
}))))), /*#__PURE__*/createElement(CartButtonsRow, null, /*#__PURE__*/createElement("button", {
|
|
1670
|
+
onClick: function onClick() {
|
|
1671
|
+
if (loading) return;
|
|
1672
|
+
handleRemoveAll(selected);
|
|
1673
|
+
}
|
|
1674
|
+
}, "remove selected"), /*#__PURE__*/createElement("button", null, "updated cart")));
|
|
1667
1675
|
}
|
|
1668
1676
|
|
|
1669
1677
|
var _templateObject$4, _templateObject2$4, _templateObject3$4, _templateObject4$3, _templateObject5$3, _templateObject6$3, _templateObject7$2;
|
|
1670
|
-
var CartPageCard = styled.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n width: min(97%, 485px);\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n padding:
|
|
1678
|
+
var CartPageCard = styled.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n width: min(97%, 485px);\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n padding: 1em;\n background: #ffffff;\n box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05);\n border-radius: 20px;\n position: relative;\n"])));
|
|
1671
1679
|
var CartPageImg = styled.img(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n /* width: 95px; */\n width: ", ";\n height: ", ";\n position: relative;\n margin-right: 1em;\n"])), function (props) {
|
|
1672
1680
|
return props.width || 'auto';
|
|
1673
1681
|
}, function (props) {
|
|
1674
1682
|
return props.height || '81px';
|
|
1675
1683
|
});
|
|
1676
1684
|
var NameAndQtBox = styled.div(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n width: 90%;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: space-between;\n position: relative;\n"])));
|
|
1677
|
-
var CartPageCardName = styled.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n width: 90%;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-bottom: 0.6em;\n h6 {\n color: #323232;\n font-size: 0.9em;\n margin-bottom: 0.6em;\n line-height: 1.
|
|
1685
|
+
var CartPageCardName = styled.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: flex-start;\n width: 90%;\n overflow: hidden;\n text-overflow: ellipsis;\n margin-bottom: 0.6em;\n h6 {\n color: #323232;\n font-size: 0.9em;\n margin-bottom: 0.6em;\n line-height: 1.3em;\n max-height: 1.4em;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n p {\n font-size: 1.1em;\n color: #c3c6c9;\n }\n"])));
|
|
1678
1686
|
var QtAndPriceBox = styled.div(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 100%;\n .subtotal {\n color: #323232;\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.85em;\n }\n"])));
|
|
1679
1687
|
var CartPageQtBox = styled.div(_templateObject6$3 || (_templateObject6$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n max-width: 80px;\n min-width: 80px;\n height: 22px;\n .icon {\n width: 20.5px;\n height: 20.5px;\n display: grid;\n place-items: center;\n font-size: 10px;\n background: #eef1f4;\n cursor: pointer;\n }\n .qt {\n font-size: 18px;\n font-weight: 500;\n display: grid;\n place-items: center;\n color: #c3c6c9;\n }\n"])));
|
|
1680
1688
|
var CloseBtn = styled.div(_templateObject7$2 || (_templateObject7$2 = _taggedTemplateLiteralLoose(["\n width: 25px;\n height: 25px;\n display: grid;\n place-items: center;\n position: absolute;\n top: 1em;\n right: 1em;\n cursor: pointer;\n border-radius: 50%;\n background: #eef1f4;\n font-size: 12px;\n"])));
|
|
@@ -1754,8 +1762,8 @@ var CartPageMainRetail = function CartPageMainRetail(_ref) {
|
|
|
1754
1762
|
};
|
|
1755
1763
|
|
|
1756
1764
|
var _templateObject$5, _templateObject2$5, _templateObject3$5, _templateObject4$4, _templateObject5$4, _templateObject6$4;
|
|
1757
|
-
var CartSummaryContainer = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n width: min(95%, 28.75em);\n max-width: ", ";\n display: flex;\n flex-direction: column;\n background: ", ";\n color: ", ";\n border-radius:
|
|
1758
|
-
return props.maxWidth || '
|
|
1765
|
+
var CartSummaryContainer = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n width: min(95%, 28.75em);\n max-width: ", ";\n display: flex;\n flex-direction: column;\n background: ", ";\n color: ", ";\n border-radius: 28px;\n padding: 2em 1em;\n align-items: center;\n margin-top: 3em;\n p {\n font-size: 0.89em;\n font-weight: 300;\n align-self: flex-start;\n color: inherit;\n margin: 0;\n padding: 0;\n }\n .continueShopping {\n font-size: 0.75em;\n color: inherit;\n text-transform: capitalize;\n height: 20px;\n border-bottom: 1px solid;\n border-color: ", ";\n font-weight: 300;\n cursor: pointer;\n }\n"])), function (props) {
|
|
1766
|
+
return props.maxWidth || '28.75em';
|
|
1759
1767
|
}, function (props) {
|
|
1760
1768
|
return props.background || '#667080';
|
|
1761
1769
|
}, function (props) {
|
|
@@ -1771,12 +1779,12 @@ var CartSummaryRow = styled.div(_templateObject2$5 || (_templateObject2$5 = _tag
|
|
|
1771
1779
|
var CartSummaryHr = styled.span(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteralLoose(["\n border: none;\n width: 100%;\n height: 1px;\n background-color: ", ";\n margin: 1em 0;\n"])), function (props) {
|
|
1772
1780
|
return props.color || 'rgba(255, 255, 255, 0.5)';
|
|
1773
1781
|
});
|
|
1774
|
-
var CartSummaryInputBox = styled.form(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding-bottom: ", ";\n input {\n width: 10.81rem;\n height: 2.44rem;\n padding: 0.
|
|
1782
|
+
var CartSummaryInputBox = styled.form(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding-bottom: ", ";\n\n input {\n width: 10.81rem;\n height: 2.44rem;\n padding: 0.2rem 0.8rem;\n text-transform: capitalize;\n font-size: 0.89rem;\n border-radius: ", ";\n margin-right: ", ";\n border: none;\n outline: none;\n background: ", ";\n color: ", ";\n &::placeholder {\n color: ", ";\n }\n }\n button {\n width: 7.75rem;\n height: 2.44rem;\n background: ", ";\n border-radius: ", ";\n display: grid;\n color: ", ";\n place-items: center;\n border: none;\n outline: none;\n text-transform: uppercase;\n cursor: pointer;\n font-size: 0.75em;\n transition: 0.3s;\n &:hover {\n letter-spacing: 1px;\n }\n }\n"])), function (props) {
|
|
1775
1783
|
return props.paddingBottom ? '2em' : '0';
|
|
1776
1784
|
}, function (props) {
|
|
1777
1785
|
return props.retail ? '1.19rem' : '0';
|
|
1778
1786
|
}, function (props) {
|
|
1779
|
-
return props.retail ? '
|
|
1787
|
+
return props.retail ? '1rem' : '0';
|
|
1780
1788
|
}, function (props) {
|
|
1781
1789
|
return props.background || '#bfc3ca';
|
|
1782
1790
|
}, function (props) {
|
|
@@ -1896,6 +1904,7 @@ var CartPageComponent = function CartPageComponent(_ref) {
|
|
|
1896
1904
|
cartData = _ref.cartData,
|
|
1897
1905
|
handleIncrementDecrement = _ref.handleIncrementDecrement,
|
|
1898
1906
|
handleRemoveProduct = _ref.handleRemoveProduct,
|
|
1907
|
+
handleRemoveAll = _ref.handleRemoveAll,
|
|
1899
1908
|
loading = _ref.loading,
|
|
1900
1909
|
imgnotfoundUrl = _ref.imgnotfoundUrl,
|
|
1901
1910
|
styles = _ref.styles;
|
|
@@ -1920,7 +1929,8 @@ var CartPageComponent = function CartPageComponent(_ref) {
|
|
|
1920
1929
|
imgnotfoundUrl: imgnotfoundUrl,
|
|
1921
1930
|
styles: styles,
|
|
1922
1931
|
handleIncrementDecrement: handleIncrementDecrement,
|
|
1923
|
-
handleRemoveProduct: handleRemoveProduct
|
|
1932
|
+
handleRemoveProduct: handleRemoveProduct,
|
|
1933
|
+
handleRemoveAll: handleRemoveAll
|
|
1924
1934
|
}), /*#__PURE__*/React__default.createElement(CartSummary, {
|
|
1925
1935
|
retail: retail,
|
|
1926
1936
|
shippingData: shippingData,
|