@salesgenterp/ui-components 0.4.230 → 0.4.231
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 +45 -45
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +45 -45
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -4212,7 +4212,7 @@ var CartPageSection = styled__default.section(_templateObject$o || (_templateObj
|
|
|
4212
4212
|
}, function (props) {
|
|
4213
4213
|
return props.bg || '#FAE8E5';
|
|
4214
4214
|
});
|
|
4215
|
-
var CartPageContainer = styled__default.div(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteralLoose(["\n max-width: ", ";\n 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: 2em 2.5em;\n padding-bottom: 3em;\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\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n
|
|
4215
|
+
var CartPageContainer = styled__default.div(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteralLoose(["\n max-width: ", ";\n 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: 2em 2.5em;\n padding-bottom: 3em;\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\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n }\n /* box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05); */\n }\n table {\n border-collapse: separate;\n border-spacing: 0 4px;\n row-gap: 4px;\n }\n\n td {\n /* border: solid 1px #000; */\n border-style: none solid solid none;\n /* padding: 10px; */\n /* margin-bottom:5px; */\n }\n\n tr:first-child td:first-child {\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-top-right-radius: 10px;\n border-bottom-right-radius: 10px;\n }\n\n tr td:first-child {\n border-bottom-left-radius: 10px;\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n tr td {\n border-top-style: solid;\n }\n tr td:first-child {\n border-left-style: solid;\n }\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) {
|
|
4216
4216
|
return props.maxWidth || '1620px';
|
|
4217
4217
|
}, function (props) {
|
|
4218
4218
|
return "min(" + (props.maxWidth || '1620px') + ",100%)";
|
|
@@ -4223,9 +4223,7 @@ var CartPageContainer = styled__default.div(_templateObject2$f || (_templateObje
|
|
|
4223
4223
|
}, function (props) {
|
|
4224
4224
|
return props.ScrollBg || 'rgba(102, 112, 128, 0.5)';
|
|
4225
4225
|
}, function (props) {
|
|
4226
|
-
return props.
|
|
4227
|
-
}, function (props) {
|
|
4228
|
-
return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
|
|
4226
|
+
return props.color || '#BFC3CA';
|
|
4229
4227
|
});
|
|
4230
4228
|
var CardsBox = styled__default.div(_templateObject3$a || (_templateObject3$a = _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) {
|
|
4231
4229
|
return props.retail ? 'grid' : 'flex';
|
|
@@ -4236,7 +4234,7 @@ var CartHeading = styled__default.div(_templateObject4$7 || (_templateObject4$7
|
|
|
4236
4234
|
return props.h1 || 'inherit';
|
|
4237
4235
|
});
|
|
4238
4236
|
var Loader$1 = styled__default.div(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 40%;\n left: 47%;\n display: grid;\n place-items: center;\n z-index: 3;\n"])));
|
|
4239
|
-
var CartTableCell = styled__default(material.TableCell)(_templateObject6$4 || (_templateObject6$4 = _taggedTemplateLiteralLoose(["\n && {\n padding-bottom: 1em !important;\n border: none !important;\n /* font-size: 0.75em; */\n font-size: 1em;\n color: rgba(98, 95, 95, 1);\n background: ", ";\n color: ", ";\n font-family: 'karla-fonts';\n }\n &.bg-transparent {\n // background-color: transparent !important;\n text-transform: uppercase;\n z-index: 3 !important;\n span {\n font-size: 0.75em;\n font-weight: 600;\n }\n svg {\n color: ", ";\n }\n .MuiTableSortLabel-root {\n color: ", "!important;\n }\n }\n"])), function (props) {
|
|
4237
|
+
var CartTableCell = styled__default(material.TableCell)(_templateObject6$4 || (_templateObject6$4 = _taggedTemplateLiteralLoose(["\n && {\n padding-bottom: 1em !important;\n // border: none !important;\n /* font-size: 0.75em; */\n font-size: 1em;\n color: rgba(98, 95, 95, 1);\n // background: ", ";\n color: ", ";\n font-family: 'karla-fonts';\n }\n &.bg-transparent {\n // background-color: transparent !important;\n text-transform: uppercase;\n z-index: 3 !important;\n span {\n font-size: 0.75em;\n font-weight: 600;\n }\n svg {\n color: ", ";\n }\n .MuiTableSortLabel-root {\n color: ", "!important;\n }\n }\n"])), function (props) {
|
|
4240
4238
|
return "" + props.bg;
|
|
4241
4239
|
}, function (props) {
|
|
4242
4240
|
return "" + props.color || 'inherit';
|
|
@@ -4245,14 +4243,12 @@ var CartTableCell = styled__default(material.TableCell)(_templateObject6$4 || (_
|
|
|
4245
4243
|
}, function (props) {
|
|
4246
4244
|
return "" + props.color || 'inherit';
|
|
4247
4245
|
});
|
|
4248
|
-
var CartTableContainer = styled__default(material.TableContainer)(_templateObject7$3 || (_templateObject7$3 = _taggedTemplateLiteralLoose(["\n max-height: 580px;\n min-height: 460px;\n padding-right: 1.5em;\n\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n
|
|
4246
|
+
var CartTableContainer = styled__default(material.TableContainer)(_templateObject7$3 || (_templateObject7$3 = _taggedTemplateLiteralLoose(["\n max-height: 580px;\n min-height: 460px;\n padding-right: 1.5em;\n\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\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 }\n @media screen and (max-width: 750px) {\n padding: 0;\n }\n"])), function (props) {
|
|
4249
4247
|
return props.retail ? '12px' : '10px';
|
|
4250
4248
|
}, function (props) {
|
|
4251
|
-
return
|
|
4249
|
+
return 'rgba(102, 112, 128, 0.5)';
|
|
4252
4250
|
}, function (props) {
|
|
4253
|
-
return props.
|
|
4254
|
-
}, function (props) {
|
|
4255
|
-
return props.color || '#ef9687';
|
|
4251
|
+
return props.color;
|
|
4256
4252
|
});
|
|
4257
4253
|
var CartButtonsRow = styled__default.div(_templateObject8$2 || (_templateObject8$2 = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-items: center;\n padding-right: 1.85em;\n button {\n background: ", ";\n color: ", ";\n padding: 0.5em 1em;\n margin-left: 1em;\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) {
|
|
4258
4254
|
return props.bg || 'rgba(253, 0, 21, 1)';
|
|
@@ -5495,7 +5491,7 @@ var headCells = [{
|
|
|
5495
5491
|
}, {
|
|
5496
5492
|
id: 'name',
|
|
5497
5493
|
numeric: false,
|
|
5498
|
-
disablePadding:
|
|
5494
|
+
disablePadding: false,
|
|
5499
5495
|
label: 'Name',
|
|
5500
5496
|
filter: false
|
|
5501
5497
|
}, {
|
|
@@ -6039,6 +6035,7 @@ var CartSummary = function CartSummary(_ref) {
|
|
|
6039
6035
|
};
|
|
6040
6036
|
|
|
6041
6037
|
var CartPageComponent = function CartPageComponent(_ref) {
|
|
6038
|
+
var _styles$input;
|
|
6042
6039
|
var apiEndPoint = _ref.apiEndPoint,
|
|
6043
6040
|
token = _ref.token,
|
|
6044
6041
|
retail = _ref.retail,
|
|
@@ -6089,7 +6086,8 @@ var CartPageComponent = function CartPageComponent(_ref) {
|
|
|
6089
6086
|
h1: styles === null || styles === void 0 ? void 0 : styles.h1
|
|
6090
6087
|
}, /*#__PURE__*/React__default.createElement("h1", null, "Shopping Cart"), /*#__PURE__*/React__default.createElement("p", null, "You have ", cartData === null || cartData === void 0 ? void 0 : cartData.totalCartQuantity, " items in your cart")), /*#__PURE__*/React__default.createElement(CartPageContainer, {
|
|
6091
6088
|
retail: retail,
|
|
6092
|
-
loading: loading
|
|
6089
|
+
loading: loading,
|
|
6090
|
+
color: styles === null || styles === void 0 ? void 0 : (_styles$input = styles.input) === null || _styles$input === void 0 ? void 0 : _styles$input.color
|
|
6093
6091
|
}, retail ? /*#__PURE__*/React__default.createElement(CartPageMainRetail, {
|
|
6094
6092
|
retail: retail,
|
|
6095
6093
|
cartData: cartData,
|
|
@@ -6753,7 +6751,7 @@ var CartPageSection$1 = styled__default.section(_templateObject$v || (_templateO
|
|
|
6753
6751
|
}, function (props) {
|
|
6754
6752
|
return props.bg || '#FAE8E5';
|
|
6755
6753
|
});
|
|
6756
|
-
var CartPageContainer$1 = styled__default.div(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteralLoose(["\n max-width: ", ";\n 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: 2em 2.5em;\n padding-bottom: 3em;\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\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n border: 2px solid;\n
|
|
6754
|
+
var CartPageContainer$1 = styled__default.div(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteralLoose(["\n max-width: ", ";\n 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: 2em 2.5em;\n padding-bottom: 3em;\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\n margin-right: 0.3em;\n &::-webkit-scrollbar {\n width: ", ";\n }\n\n /* Track */\n &::-webkit-scrollbar-track {\n background: ", ";\n\n border-radius: 16px;\n }\n\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: ", ";\n border-radius: 16px;\n border: 2px solid;\n }\n /* box-shadow: 0px 20px 35px rgba(0, 0, 0, 0.05); */\n }\n table {\n border-collapse: separate;\n border-spacing: 0 4px;\n row-gap: 4px;\n }\n\n td {\n /* border: solid 1px #000; */\n border-style: none solid solid none;\n /* padding: 10px; */\n /* margin-bottom:5px; */\n }\n\n tr:first-child td:first-child {\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-top-right-radius: 10px;\n border-bottom-right-radius: 10px;\n }\n\n tr td:first-child {\n border-bottom-left-radius: 10px;\n border-top-left-radius: 10px;\n }\n tr td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n tr td {\n border-top-style: solid;\n }\n tr td:first-child {\n border-left-style: solid;\n }\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) {
|
|
6757
6755
|
return props.maxWidth || '1620px';
|
|
6758
6756
|
}, function (props) {
|
|
6759
6757
|
return "min(" + (props.maxWidth || '1620px') + ",100%)";
|
|
@@ -6764,9 +6762,7 @@ var CartPageContainer$1 = styled__default.div(_templateObject2$k || (_templateOb
|
|
|
6764
6762
|
}, function (props) {
|
|
6765
6763
|
return props.ScrollBg || 'rgba(102, 112, 128, 0.5)';
|
|
6766
6764
|
}, function (props) {
|
|
6767
|
-
return props.
|
|
6768
|
-
}, function (props) {
|
|
6769
|
-
return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
|
|
6765
|
+
return props.color || '#BFC3CA';
|
|
6770
6766
|
});
|
|
6771
6767
|
var CardsBox$1 = styled__default.div(_templateObject3$f || (_templateObject3$f = _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) {
|
|
6772
6768
|
return props.retail ? 'grid' : 'flex';
|
|
@@ -6777,7 +6773,7 @@ var CartHeading$1 = styled__default.div(_templateObject4$c || (_templateObject4$
|
|
|
6777
6773
|
return props.h1 || 'inherit';
|
|
6778
6774
|
});
|
|
6779
6775
|
var Loader$2 = styled__default.div(_templateObject5$a || (_templateObject5$a = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 40%;\n left: 47%;\n display: grid;\n place-items: center;\n z-index: 3;\n"])));
|
|
6780
|
-
var CartTableCell$3 = styled__default(material.TableCell)(_templateObject6$9 || (_templateObject6$9 = _taggedTemplateLiteralLoose(["\n && {\n padding-bottom: 1em !important;\n border: none !important;\n /* font-size: 0.75em; */\n font-size: 1em;\n color: rgba(98, 95, 95, 1);\n background: ", ";\n color: ", ";\n font-family: 'karla-fonts';\n }\n &.bg-transparent {\n // background-color: transparent !important;\n text-transform: uppercase;\n span {\n font-size: 0.75em;\n font-weight: 600;\n }\n svg {\n color: ", ";\n }\n .MuiTableSortLabel-root {\n color: ", "!important;\n }\n }\n"])), function (props) {
|
|
6776
|
+
var CartTableCell$3 = styled__default(material.TableCell)(_templateObject6$9 || (_templateObject6$9 = _taggedTemplateLiteralLoose(["\n && {\n padding-bottom: 1em !important;\n // border: none !important;\n /* font-size: 0.75em; */\n font-size: 1em;\n color: rgba(98, 95, 95, 1);\n // background: ", ";\n color: ", ";\n font-family: 'karla-fonts';\n }\n &.bg-transparent {\n // background-color: transparent !important;\n text-transform: uppercase;\n span {\n font-size: 0.75em;\n font-weight: 600;\n }\n svg {\n color: ", ";\n }\n .MuiTableSortLabel-root {\n color: ", "!important;\n }\n }\n"])), function (props) {
|
|
6781
6777
|
return "" + props.bg;
|
|
6782
6778
|
}, function (props) {
|
|
6783
6779
|
return "" + props.color || 'inherit';
|
|
@@ -6786,14 +6782,14 @@ var CartTableCell$3 = styled__default(material.TableCell)(_templateObject6$9 ||
|
|
|
6786
6782
|
}, function (props) {
|
|
6787
6783
|
return "" + props.color || 'inherit';
|
|
6788
6784
|
});
|
|
6789
|
-
var CartTableContainer$1 = styled__default(material.TableContainer)(_templateObject7$6 || (_templateObject7$6 = _taggedTemplateLiteralLoose(["\n max-height: 580px;\n padding-right: 1.5em;\n overflow: inherit !important;\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
|
|
6785
|
+
var CartTableContainer$1 = styled__default(material.TableContainer)(_templateObject7$6 || (_templateObject7$6 = _taggedTemplateLiteralLoose(["\n max-height: 580px;\n padding-right: 1.5em;\n overflow: inherit !important;\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 }\n @media screen and (max-width: 750px) {\n padding: 0;\n }\n"])), function (props) {
|
|
6790
6786
|
return props.retail ? '12px' : '10px';
|
|
6791
6787
|
}, function (props) {
|
|
6792
6788
|
return props.retail ? '#667080' : 'rgba(102, 112, 128, 0.5)';
|
|
6793
6789
|
}, function (props) {
|
|
6794
6790
|
return props.bg || '#fdccc480';
|
|
6795
6791
|
}, function (props) {
|
|
6796
|
-
return props.color || '
|
|
6792
|
+
return props.color || 'red';
|
|
6797
6793
|
});
|
|
6798
6794
|
var CartButtonsRow$1 = styled__default.div(_templateObject8$4 || (_templateObject8$4 = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n padding-right: 1.85em;\n button {\n display: flex;\n align-items: center;\n background: ", ";\n color: ", ";\n padding: 0.5em 1em;\n margin-left: 1em;\n font-size: 0.85em;\n text-transform: uppercase;\n border: none;\n cursor: pointer;\n transition: 0.4s;\n font-size: 1rem;\n font-weight: 600;\n svg {\n margin-right: 0.4rem;\n }\n &:hover {\n transform: scale(0.95);\n }\n }\n"])), function (props) {
|
|
6799
6795
|
return props.bg || 'rgba(253, 0, 21, 1)';
|
|
@@ -6811,7 +6807,7 @@ var headCells$1 = [{
|
|
|
6811
6807
|
}, {
|
|
6812
6808
|
id: 'name',
|
|
6813
6809
|
numeric: false,
|
|
6814
|
-
disablePadding:
|
|
6810
|
+
disablePadding: false,
|
|
6815
6811
|
label: 'Name',
|
|
6816
6812
|
filter: false
|
|
6817
6813
|
}, {
|
|
@@ -7439,14 +7435,12 @@ var CheckoutPageContainer = styled__default.div(_templateObject$A || (_templateO
|
|
|
7439
7435
|
});
|
|
7440
7436
|
var Row = styled__default.div(_templateObject2$n || (_templateObject2$n = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n"])));
|
|
7441
7437
|
var CheckoutMainWithHeader = styled__default(material.Stack)(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteralLoose([""])));
|
|
7442
|
-
var CheckoutMain = styled__default.div(_templateObject4$d || (_templateObject4$d = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: 1008px;\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n margin-right: 2em;\n max-height: 65vh;\n padding-right: 2em;\n overflow-y: auto;\n position: relative;\n padding-top: 2em;\n padding-bottom: 3em;\n /* width */\n ::-webkit-scrollbar {\n width: 10px;\n background: ", ";\n border-radius: 16px;\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
|
|
7443
|
-
return props.bg || 'rgba(
|
|
7444
|
-
}, function (props) {
|
|
7445
|
-
return props.bg || 'rgba(245, 197, 189, 0.5)';
|
|
7438
|
+
var CheckoutMain = styled__default.div(_templateObject4$d || (_templateObject4$d = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: 1008px;\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n margin-right: 2em;\n max-height: 65vh;\n padding-right: 2em;\n overflow-y: auto;\n position: relative;\n padding-top: 2em;\n padding-bottom: 3em;\n /* width */\n ::-webkit-scrollbar {\n width: 10px;\n background: ", ";\n border-radius: 16px;\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 }\n @media only screen and (max-width: 1488px) {\n margin-bottom: 3em;\n min-height: max-content;\n max-height: max-content;\n margin-right: 0;\n overflow: visible;\n }\n @media only screen and (max-width: 788px) {\n max-width: 100vw;\n padding-right: 0;\n width: 98vw;\n min-width: 90vw;\n padding-top: 1em;\n }\n /* overflow: hidden; */\n"])), function (props) {
|
|
7439
|
+
return props.bg || 'rgba(102,112,128,0.5)';
|
|
7446
7440
|
}, function (props) {
|
|
7447
|
-
return props.
|
|
7441
|
+
return props.bg || 'rgba(102,112,128,0.5)';
|
|
7448
7442
|
}, function (props) {
|
|
7449
|
-
return props.
|
|
7443
|
+
return props.color;
|
|
7450
7444
|
});
|
|
7451
7445
|
var CheckoutHeading = styled__default.div(_templateObject5$b || (_templateObject5$b = _taggedTemplateLiteralLoose(["\n margin-left: 2.5em;\n margin-bottom: 2em;\n h5 {\n font-size: 2.3em;\n font-weight: 600;\n text-transform: capitalize;\n }\n p {\n font-size: 0.875em;\n font-weight: 300;\n margin-top: 0.5em;\n }\n @media only screen and (max-width: 788px) {\n margin-left: 0;\n padding-left: 1em;\n }\n"])));
|
|
7452
7446
|
var CheckoutHeader = styled__default(Row)(_templateObject6$a || (_templateObject6$a = _taggedTemplateLiteralLoose(["\n justify-content: space-around;\n display: flex;\n flex-direction: row;\n align-items: center;\n position: sticky;\n top: 0;\n background-color: white;\n z-index: 1;\n justify-content: flex-start;\n min-height: 4.18em;\n max-height: 4.1875em;\n max-width: 57.43em;\n width: 98%;\n background: #ffffff;\n border-radius: 20px;\n margin-bottom: 1em;\n margin-right: 0.35em;\n color: #7d7b7b;\n padding: 0 2em;\n margin-right: 5em;\n .row {\n display: flex;\n color: inherit;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n text-transform: capitalize;\n margin-right: 2.4%;\n .icon {\n font-size: 14px;\n font-weight: 400;\n display: grid;\n place-items: center;\n margin-right: 6px;\n color: inherit;\n }\n p,\n span {\n font-size: 0.95em;\n color: inherit;\n font-weight: 300;\n }\n }\n .checked {\n p,\n span {\n color: #323232;\n }\n .icon {\n color: #249937;\n }\n }\n @media only screen and (max-width: 1508px) {\n margin-right: 2em;\n }\n @media only screen and (max-width: 788px) {\n width: 100%;\n padding: 2em 1em;\n margin: 1.4em 0;\n .row {\n margin-right: 4.5%;\n p {\n font-size: 12px;\n }\n span {\n display: none;\n }\n }\n }\n"])));
|
|
@@ -7458,7 +7452,7 @@ var CheckoutSummaryContainer = styled__default.div(_templateObject$B || (_templa
|
|
|
7458
7452
|
}, function (props) {
|
|
7459
7453
|
return props.color || ' rgba(50, 50, 50, 1)';
|
|
7460
7454
|
});
|
|
7461
|
-
var TextRow = styled__default.div(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n max-width: 90%;\n margin-bottom: 1em;\n padding-bottom: 1em;\n width: 90%;\n border-bottom: 1px solid
|
|
7455
|
+
var TextRow = styled__default.div(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n max-width: 90%;\n margin-bottom: 1em;\n padding-bottom: 1em;\n width: 90%;\n border-bottom: 1px solid #f7f7f7;\n .text {\n font-size: 1.1em;\n font-weight: 300;\n text-transform: capitalize;\n }\n .total {\n font-size: 1.65em;\n font-weight: 800;\n }\n"])));
|
|
7462
7456
|
var FilledInfo = styled__default.div(_templateObject3$h || (_templateObject3$h = _taggedTemplateLiteralLoose(["\n margin-bottom: 2em;\n .heading {\n font-size: 1.25em;\n font-weight: 800;\n margin-bottom: 0.8em;\n }\n\n p {\n font-size: 0.875em;\n font-weight: 300;\n text-transform: capitalize;\n max-width: 60%;\n }\n .bold {\n font-weight: 700;\n margin-bottom: 0.8em;\n max-width: 300px;\n width: fit-content;\n }\n .payment {\n width: 70px;\n height: 48px;\n background: #ffffff;\n border-radius: 15.875px;\n display: grid;\n place-items: center;\n overflow: hidden;\n }\n .blank {\n padding-bottom: 2em;\n opacity: 0;\n }\n"])));
|
|
7463
7457
|
|
|
7464
7458
|
var CheckoutSummary = function CheckoutSummary(_ref) {
|
|
@@ -7515,10 +7509,12 @@ var CheckoutSummary = function CheckoutSummary(_ref) {
|
|
|
7515
7509
|
|
|
7516
7510
|
var _templateObject$C, _templateObject2$p, _templateObject3$i, _templateObject4$e, _templateObject5$c, _templateObject6$b, _templateObject7$8, _templateObject8$5, _templateObject9$4, _templateObject10$2, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1;
|
|
7517
7511
|
var StepContainer = styled__default.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n width: 100%;\n min-width: 57.43em;\n max-width: 57.43em;\n background: white;\n padding: 1em 2em;\n background: #ffffff;\n border-radius: 20px;\n margin-left: 2em;\n margin-top: -2em;\n margin-bottom: 1em;\n @media screen and (max-width: 1305px) {\n width: 80vw;\n min-width: 0;\n }\n @media screen and (max-width: 768px) {\n width: 96%;\n margin-left: 1em;\n padding: 0.8em;\n }\n @media screen and (max-width: 540px) {\n width: 94%;\n margin-left: 1.2em;\n }\n"])));
|
|
7518
|
-
var StepsContent = styled__default.div(_templateObject2$p || (_templateObject2$p = _taggedTemplateLiteralLoose(["\n padding-left: 1.565em;\n min-height: max-content;\n .MuiOutlinedInput-root {\n background: ", ";\n }\n\n p {\n font-size: 0.75em;\n }\n .bold {\n text-transform: uppercase;\n word-spacing: 5px;\n margin-top: 0.95em;\n span {\n font-weight: 600;\n cursor: pointer;\n font-size: 0.94rem;\n }\n .red {\n color:
|
|
7519
|
-
return
|
|
7512
|
+
var StepsContent = styled__default.div(_templateObject2$p || (_templateObject2$p = _taggedTemplateLiteralLoose(["\n padding-left: 1.565em;\n min-height: max-content;\n .MuiOutlinedInput-root {\n background: ", ";\n }\n\n p {\n font-size: 0.75em;\n }\n .bold {\n text-transform: uppercase;\n word-spacing: 5px;\n margin-top: 0.95em;\n span {\n font-weight: 600;\n cursor: pointer;\n font-size: 0.94rem;\n }\n .red {\n color: ", ";\n }\n }\n @media screen and (max-width: 768px) {\n padding: 0;\n width: 100%;\n }\n"])), function (props) {
|
|
7513
|
+
return 'transparent' + '!important';
|
|
7514
|
+
}, function (props) {
|
|
7515
|
+
return props.bg || 'red';
|
|
7520
7516
|
});
|
|
7521
|
-
var StepsHeaderContainer = styled__default.div(_templateObject3$i || (_templateObject3$i = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n font-family: 'karla-fonts';\n color: #323232;\n /* padding: ", "; */\n margin-bottom: ", ";\n margin-top: ", ";\n margin-left: ", ";\n /* color: grey; */\n border-bottom: 1px solid #
|
|
7517
|
+
var StepsHeaderContainer = styled__default.div(_templateObject3$i || (_templateObject3$i = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n font-family: 'karla-fonts';\n color: #323232;\n /* padding: ", "; */\n margin-bottom: ", ";\n margin-top: ", ";\n margin-left: ", ";\n /* color: grey; */\n border-bottom: 1px solid #f6f6f6;\n background: #ffffff;\n border-radius: 20px;\n max-width: 900px;\n\n min-height: 4.35em;\n max-height: 4.35em;\n padding: ", ";\n h5 {\n font-size: 16px;\n font-weight: 600;\n text-transform: capitalize;\n margin-left: 0.6em;\n }\n .icon {\n font-size: 1.3em;\n margin-right: 8px;\n }\n .dropIcon {\n font-size: 1.4em;\n cursor: pointer;\n transform: rotate(-90deg);\n transition: 0.3s;\n color: rgba(50, 50, 50, 0.75);\n cursor: ", ";\n }\n .red {\n font-weight: 600;\n color: #fd0015;\n font-size: inherit;\n }\n @media screen and (max-width: 768px) {\n max-width: 97%;\n margin-left: 0.5em;\n padding-right: 1em;\n h5 {\n font-size: 12px;\n }\n }\n"])), function (props) {
|
|
7522
7518
|
return props.single ? '1.8em 2em' : '1em 0';
|
|
7523
7519
|
}, function (props) {
|
|
7524
7520
|
return props.single ? '-1.56em' : '1em';
|
|
@@ -7532,7 +7528,7 @@ var StepsHeaderContainer = styled__default.div(_templateObject3$i || (_templateO
|
|
|
7532
7528
|
return props.username ? 'not-allowed' : 'pointer';
|
|
7533
7529
|
});
|
|
7534
7530
|
var TextFeildContainer = styled__default.div(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteralLoose(["\n && {\n input {\n font-size: 0.875em !important;\n\n color: rgba(107, 106, 106, 1);\n color: black;\n &::placeholder {\n font-size: 0.975em !important;\n }\n }\n .icon {\n color: black;\n font-size: 1em;\n }\n }\n"])));
|
|
7535
|
-
var CommonCheckoutBtn = styled__default.button(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n border: none;\n outline: none;\n width: ", ";\n height: ", ";\n
|
|
7531
|
+
var CommonCheckoutBtn = styled__default.button(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n border: none;\n outline: none;\n width: ", ";\n height: ", ";\n background: ", ";\n display: grid;\n place-items: center;\n color: white;\n margin: 0 1em;\n font-weight: 500;\n letter-spacing: 1px;\n text-transform: ", ";\n transition: 0.4s;\n cursor: ", ";\n &:hover,\n &:focus {\n opacity: 0.7;\n }\n"])), function (props) {
|
|
7536
7532
|
return props.width || '8.05em';
|
|
7537
7533
|
}, function (props) {
|
|
7538
7534
|
return props.height || '2.25em';
|
|
@@ -7548,7 +7544,7 @@ var Select = styled__default.div.attrs({
|
|
|
7548
7544
|
})(_templateObject6$b || (_templateObject6$b = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 54px;\n border-radius: 10px;\n background: ", ";\n outline: none;\n border: none;\n padding: 0 1em;\n cursor: pointer;\n select {\n width: 100%;\n height: 100%;\n border: none;\n outline: none;\n padding: 0.5em 0;\n color: rgba(107, 106, 106, 0.6);\n background: ", ";\n }\n"])), function (props) {
|
|
7549
7545
|
return props.bg || 'transparent';
|
|
7550
7546
|
}, function (props) {
|
|
7551
|
-
return
|
|
7547
|
+
return 'transparent';
|
|
7552
7548
|
});
|
|
7553
7549
|
var SaveButton = styled__default.button.attrs({
|
|
7554
7550
|
className: 'checkout-btn'
|
|
@@ -7587,15 +7583,15 @@ var DeliveryOptionContainer = styled__default.div(_templateObject12$1 || (_templ
|
|
|
7587
7583
|
var DeliveryOption = styled__default.div(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-start;\n max-width: 691px;\n height: 40px;\n padding: 0 1em;\n border: 1px solid transparent;\n transition: 0.3s;\n cursor: pointer;\n background-color: ", ";\n border: ", ";\n border-bottom: ", ";\n border-radius: 5px;\n &:last-child {\n border-bottom: ", ";\n }\n &:hover {\n background-color: ", ";\n border: ", ";\n border-radius: 5px;\n }\n p {\n font-weight: 500;\n color: black;\n font-size: 0.95em;\n text-transform: capitalize;\n }\n .circle {\n border-radius: 50%;\n display: grid;\n place-items: center;\n background: linear-gradient(345.48deg, #3c332a -131.29%, #ffffff 124.82%);\n margin-right: 1em;\n width: 14px;\n height: 14px;\n min-width: 14px;\n min-height: 14px;\n cursor: pointer;\n .inner {\n width: 10px;\n height: 10px;\n border-radius: 50%;\n display: grid;\n place-items: center;\n background: linear-gradient(\n 326.37deg,\n rgba(67, 58, 42, 0.9) -219.66%,\n rgba(255, 255, 255, 0.9) 90.45%\n );\n box-shadow: inset -1px -1px 1px rgba(255, 255, 255, 0.45),\n inset 0px 0px 10px rgba(0, 0, 0, 0.2);\n }\n .fill {\n width: 6px;\n height: 6px;\n background: radial-gradient(\n 15.79% 15.79% at 36.84% 31.58%,\n #ffffff 0%,\n rgba(255, 255, 255, 0) 100%\n )\n /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */,\n linear-gradient(\n 358.85deg,\n rgba(157, 18, 30, 0.2) -19.81%,\n rgba(12, 96, 157, 0) 64.74%\n ),\n radial-gradient(50% 50% at 50% 50%, #fab0b6 0%, #fd0015 100%), #fd0015;\n background-blend-mode: normal, multiply, normal, normal;\n box-shadow: 0px 0.5px 0px rgba(253, 0, 21, 0.25),\n 0px 1px 1px rgba(253, 0, 21, 0.2);\n border-radius: 50%;\n background: ", ";\n }\n }\n .amount {\n margin-left: auto;\n color: ", ";\n font-weight: ", ";\n font-size: 0.95em;\n }\n"])), function (props) {
|
|
7588
7584
|
return props.hovered ? props.bg : '';
|
|
7589
7585
|
}, function (props) {
|
|
7590
|
-
return props.hovered ? "1px solid " + props.border :
|
|
7586
|
+
return props.hovered ? "1px solid " + props.border : "1px solid" + props.bg;
|
|
7591
7587
|
}, function (props) {
|
|
7592
7588
|
return !props.hovered && "none";
|
|
7593
7589
|
}, function (props) {
|
|
7594
|
-
return props.hovered ? "1px solid " + props.border :
|
|
7590
|
+
return props.hovered ? "1px solid " + props.border : "1px solid" + props.bg;
|
|
7595
7591
|
}, function (props) {
|
|
7596
7592
|
return props.bg || '#fff0ec';
|
|
7597
7593
|
}, function (props) {
|
|
7598
|
-
return props.border ? "1px solid " + props.border :
|
|
7594
|
+
return props.border ? "1px solid " + props.border : "1px solid" + props.bg;
|
|
7599
7595
|
}, function (props) {
|
|
7600
7596
|
return props.color || '#fd0015';
|
|
7601
7597
|
}, function (props) {
|
|
@@ -7737,10 +7733,12 @@ var StepsHeaderComponent = function StepsHeaderComponent(_ref) {
|
|
|
7737
7733
|
};
|
|
7738
7734
|
|
|
7739
7735
|
var Step0 = function Step0(_ref) {
|
|
7736
|
+
var _styles$button, _styles$button2;
|
|
7740
7737
|
var loading = _ref.loading,
|
|
7741
7738
|
userName = _ref.userName,
|
|
7742
7739
|
handleLogin = _ref.handleLogin,
|
|
7743
|
-
clickRedirect = _ref.clickRedirect
|
|
7740
|
+
clickRedirect = _ref.clickRedirect,
|
|
7741
|
+
styles = _ref.styles;
|
|
7744
7742
|
var _useForm = reactHookForm.useForm(),
|
|
7745
7743
|
control = _useForm.control,
|
|
7746
7744
|
handleSubmit = _useForm.handleSubmit;
|
|
@@ -7751,7 +7749,9 @@ var Step0 = function Step0(_ref) {
|
|
|
7751
7749
|
text: 'welcome',
|
|
7752
7750
|
username: userName,
|
|
7753
7751
|
icon: 1
|
|
7754
|
-
}), /*#__PURE__*/React__default.createElement(StepsContent,
|
|
7752
|
+
}), /*#__PURE__*/React__default.createElement(StepsContent, {
|
|
7753
|
+
bg: styles === null || styles === void 0 ? void 0 : (_styles$button = styles.button) === null || _styles$button === void 0 ? void 0 : _styles$button.bg
|
|
7754
|
+
}, /*#__PURE__*/React__default.createElement("p", null, "Please choose how you want to proceed"), /*#__PURE__*/React__default.createElement("p", {
|
|
7755
7755
|
className: "bold"
|
|
7756
7756
|
}, /*#__PURE__*/React__default.createElement("span", {
|
|
7757
7757
|
onClick: function onClick() {
|
|
@@ -7806,7 +7806,8 @@ var Step0 = function Step0(_ref) {
|
|
|
7806
7806
|
padding: ".8em 3em",
|
|
7807
7807
|
uppercase: true,
|
|
7808
7808
|
type: "submit",
|
|
7809
|
-
className: "primaryBgColor"
|
|
7809
|
+
className: "primaryBgColor",
|
|
7810
|
+
color: styles === null || styles === void 0 ? void 0 : (_styles$button2 = styles.button) === null || _styles$button2 === void 0 ? void 0 : _styles$button2.bg
|
|
7810
7811
|
}, loading ? /*#__PURE__*/React__default.createElement(material.CircularProgress, {
|
|
7811
7812
|
color: "inherit",
|
|
7812
7813
|
size: 15
|
|
@@ -9371,7 +9372,7 @@ var steps = [{
|
|
|
9371
9372
|
}
|
|
9372
9373
|
}];
|
|
9373
9374
|
var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
|
|
9374
|
-
var _styles$
|
|
9375
|
+
var _styles$input, _styles$checkoutSumma, _styles$checkoutSumma2;
|
|
9375
9376
|
var apiEndPoint = _ref.apiEndPoint,
|
|
9376
9377
|
token = _ref.token,
|
|
9377
9378
|
authoriseDotNet = _ref.authoriseDotNet,
|
|
@@ -9433,8 +9434,8 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
|
|
|
9433
9434
|
className: "icon"
|
|
9434
9435
|
}, /*#__PURE__*/React__default.createElement(ai.AiOutlineCheckCircle, null)), ' ', /*#__PURE__*/React__default.createElement("p", null, words[0], " ", /*#__PURE__*/React__default.createElement("span", null, words[1])));
|
|
9435
9436
|
})), /*#__PURE__*/React__default.createElement(CheckoutMain, {
|
|
9436
|
-
color: styles === null || styles === void 0 ? void 0 :
|
|
9437
|
-
bg: styles === null || styles === void 0 ? void 0 : (_styles$
|
|
9437
|
+
color: styles === null || styles === void 0 ? void 0 : styles.primaryColor,
|
|
9438
|
+
bg: styles === null || styles === void 0 ? void 0 : (_styles$input = styles.input) === null || _styles$input === void 0 ? void 0 : _styles$input.bg
|
|
9438
9439
|
}, /*#__PURE__*/React__default.createElement(material.Stepper, {
|
|
9439
9440
|
activeStep: currStep,
|
|
9440
9441
|
orientation: "vertical",
|
|
@@ -9455,18 +9456,16 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
|
|
|
9455
9456
|
color: 'white',
|
|
9456
9457
|
padding: 0
|
|
9457
9458
|
} : {
|
|
9458
|
-
background:
|
|
9459
|
+
background: styles === null || styles === void 0 ? void 0 : (_styles$stepperIcon2 = styles.stepperIcon) === null || _styles$stepperIcon2 === void 0 ? void 0 : _styles$stepperIcon2.opened,
|
|
9459
9460
|
color: 'inherit',
|
|
9460
9461
|
padding: 0
|
|
9461
9462
|
}
|
|
9462
9463
|
}, /*#__PURE__*/React__default.createElement("div", {
|
|
9463
9464
|
className: "circle",
|
|
9464
9465
|
style: currStep >= index ? {
|
|
9465
|
-
background: styles === null || styles === void 0 ? void 0 : styles.primaryColor,
|
|
9466
9466
|
color: 'white',
|
|
9467
9467
|
padding: 0
|
|
9468
9468
|
} : {
|
|
9469
|
-
background: styles === null || styles === void 0 ? void 0 : (_styles$stepperIcon2 = styles.stepperIcon) === null || _styles$stepperIcon2 === void 0 ? void 0 : _styles$stepperIcon2.opened,
|
|
9470
9469
|
color: 'inherit',
|
|
9471
9470
|
padding: 0
|
|
9472
9471
|
}
|
|
@@ -9497,7 +9496,8 @@ var CheckoutPageComponent = function CheckoutPageComponent(_ref) {
|
|
|
9497
9496
|
handleBack: handleBack,
|
|
9498
9497
|
handleNext: handleNext,
|
|
9499
9498
|
handleLogin: handleLogin,
|
|
9500
|
-
clickRedirect: clickRedirect
|
|
9499
|
+
clickRedirect: clickRedirect,
|
|
9500
|
+
styles: styles
|
|
9501
9501
|
})), index === 1 && /*#__PURE__*/React__default.createElement(material.StepContent, {
|
|
9502
9502
|
sx: {
|
|
9503
9503
|
padding: 0
|