@bonlineza/luxity-lib 2.40.1 → 2.40.2
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/GraphQLDropdownSelector.js +4 -19
- package/LuxityGraphQLDropdownSelector.js +4 -19
- package/MaterialSelector.js +4 -19
- package/ModelSelector.js +4 -19
- package/build/bundle.css +1 -1
- package/build/bundle.js +4 -458
- package/package.json +1 -1
|
@@ -12245,32 +12245,17 @@
|
|
|
12245
12245
|
var FooterPaymentImage = styled__default.img(_templateObject15$2 || (_templateObject15$2 = _taggedTemplateLiteral(["\n {\n width: 100px;\n height: 30px;\n }\n"])));
|
|
12246
12246
|
var FooterConnectContainer = styled__default.div(_templateObject16$2 || (_templateObject16$2 = _taggedTemplateLiteral(["\n {\n display: flex;\n flex-direction: column;\n }\n"])));
|
|
12247
12247
|
|
|
12248
|
-
var _templateObject$V
|
|
12249
|
-
var
|
|
12250
|
-
var Options = styled__default.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteral(["\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n flex-basis: 60%;\n"])));
|
|
12251
|
-
|
|
12252
|
-
var _templateObject$W, _templateObject2$h;
|
|
12253
|
-
var SectionContainer = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n border-top: flex 1px solid ", ";\n border-top-width: calc(100% - 50px);\n padding: 5px 10px;\n"])), function (props) {
|
|
12254
|
-
return props.theme.colors.primary;
|
|
12255
|
-
});
|
|
12256
|
-
var SectionHeading = styled__default.div(_templateObject2$h || (_templateObject2$h = _taggedTemplateLiteral(["\n padding: 5px 10px;\n"])));
|
|
12257
|
-
|
|
12258
|
-
var _templateObject$X, _templateObject2$i, _templateObject3$9;
|
|
12259
|
-
var CommunicationPreferenceContainer = styled__default.div(_templateObject$X || (_templateObject$X = _taggedTemplateLiteral(["\n border: solid 1px #d1d5dbff;\n margin-bottom: 40px;\n"])));
|
|
12260
|
-
var EditButtonRow = styled__default.div(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteral(["\n display: flex;\n justify-content: end;\n padding: 10px 5px;\n margin-right: 16px;\n"])));
|
|
12261
|
-
var SubmitButton = styled__default.input(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteral(["\n flex-basis: 15%;\n margin-right: 5px;\n"])));
|
|
12262
|
-
|
|
12263
|
-
var _templateObject$Y;
|
|
12264
|
-
var FooterWrapper$1 = styled__default.div(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n }\n"])), function (props) {
|
|
12248
|
+
var _templateObject$V;
|
|
12249
|
+
var FooterWrapper$1 = styled__default.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n }\n"])), function (props) {
|
|
12265
12250
|
return props.theme.colors.gray;
|
|
12266
12251
|
});
|
|
12267
12252
|
|
|
12268
|
-
var _templateObject$
|
|
12253
|
+
var _templateObject$W;
|
|
12269
12254
|
var ALL_ITEM$1 = {
|
|
12270
12255
|
label: 'ALL',
|
|
12271
12256
|
value: 'ALL'
|
|
12272
12257
|
};
|
|
12273
|
-
var StyledMultiselector$1 = styled__default.div(_templateObject$
|
|
12258
|
+
var StyledMultiselector$1 = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n .multiselector__selected-items,\n .multiselector__selectable-items {\n display: flex;\n flex-flow: no-wrap;\n margin-bottom: 40px;\n .dropdown-select-container {\n width: 100%;\n .dropdown-select {\n &__control {\n border-color: ", ";\n border-radius: 0px;\n background-color: ", ";\n color: ", ";\n }\n &__multi-value {\n background-color: ", ";\n }\n &__multi-value__label {\n color: ", ";\n font-size: 100%;\n }\n &__multi-value__remove {\n svg {\n fill: ", ";\n }\n }\n }\n }\n }\n"])), function (props) {
|
|
12274
12259
|
return props.theme.colors.primary;
|
|
12275
12260
|
}, function (props) {
|
|
12276
12261
|
return props.theme.colors.ntrlMin;
|
|
@@ -12245,32 +12245,17 @@
|
|
|
12245
12245
|
var FooterPaymentImage = styled__default.img(_templateObject15$2 || (_templateObject15$2 = _taggedTemplateLiteral(["\n {\n width: 100px;\n height: 30px;\n }\n"])));
|
|
12246
12246
|
var FooterConnectContainer = styled__default.div(_templateObject16$2 || (_templateObject16$2 = _taggedTemplateLiteral(["\n {\n display: flex;\n flex-direction: column;\n }\n"])));
|
|
12247
12247
|
|
|
12248
|
-
var _templateObject$V
|
|
12249
|
-
var
|
|
12250
|
-
var Options = styled__default.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteral(["\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n flex-basis: 60%;\n"])));
|
|
12251
|
-
|
|
12252
|
-
var _templateObject$W, _templateObject2$h;
|
|
12253
|
-
var SectionContainer = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n border-top: flex 1px solid ", ";\n border-top-width: calc(100% - 50px);\n padding: 5px 10px;\n"])), function (props) {
|
|
12254
|
-
return props.theme.colors.primary;
|
|
12255
|
-
});
|
|
12256
|
-
var SectionHeading = styled__default.div(_templateObject2$h || (_templateObject2$h = _taggedTemplateLiteral(["\n padding: 5px 10px;\n"])));
|
|
12257
|
-
|
|
12258
|
-
var _templateObject$X, _templateObject2$i, _templateObject3$9;
|
|
12259
|
-
var CommunicationPreferenceContainer = styled__default.div(_templateObject$X || (_templateObject$X = _taggedTemplateLiteral(["\n border: solid 1px #d1d5dbff;\n margin-bottom: 40px;\n"])));
|
|
12260
|
-
var EditButtonRow = styled__default.div(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteral(["\n display: flex;\n justify-content: end;\n padding: 10px 5px;\n margin-right: 16px;\n"])));
|
|
12261
|
-
var SubmitButton = styled__default.input(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteral(["\n flex-basis: 15%;\n margin-right: 5px;\n"])));
|
|
12262
|
-
|
|
12263
|
-
var _templateObject$Y;
|
|
12264
|
-
var FooterWrapper$1 = styled__default.div(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n }\n"])), function (props) {
|
|
12248
|
+
var _templateObject$V;
|
|
12249
|
+
var FooterWrapper$1 = styled__default.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n }\n"])), function (props) {
|
|
12265
12250
|
return props.theme.colors.gray;
|
|
12266
12251
|
});
|
|
12267
12252
|
|
|
12268
|
-
var _templateObject$
|
|
12253
|
+
var _templateObject$W;
|
|
12269
12254
|
var ALL_ITEM$1 = {
|
|
12270
12255
|
label: 'ALL',
|
|
12271
12256
|
value: 'ALL'
|
|
12272
12257
|
};
|
|
12273
|
-
var StyledMultiselector$1 = styled__default.div(_templateObject$
|
|
12258
|
+
var StyledMultiselector$1 = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n .multiselector__selected-items,\n .multiselector__selectable-items {\n display: flex;\n flex-flow: no-wrap;\n margin-bottom: 40px;\n .dropdown-select-container {\n width: 100%;\n .dropdown-select {\n &__control {\n border-color: ", ";\n border-radius: 0px;\n background-color: ", ";\n color: ", ";\n }\n &__multi-value {\n background-color: ", ";\n }\n &__multi-value__label {\n color: ", ";\n font-size: 100%;\n }\n &__multi-value__remove {\n svg {\n fill: ", ";\n }\n }\n }\n }\n }\n"])), function (props) {
|
|
12274
12259
|
return props.theme.colors.primary;
|
|
12275
12260
|
}, function (props) {
|
|
12276
12261
|
return props.theme.colors.ntrlMin;
|
package/MaterialSelector.js
CHANGED
|
@@ -12245,32 +12245,17 @@
|
|
|
12245
12245
|
var FooterPaymentImage = styled__default.img(_templateObject15$2 || (_templateObject15$2 = _taggedTemplateLiteral(["\n {\n width: 100px;\n height: 30px;\n }\n"])));
|
|
12246
12246
|
var FooterConnectContainer = styled__default.div(_templateObject16$2 || (_templateObject16$2 = _taggedTemplateLiteral(["\n {\n display: flex;\n flex-direction: column;\n }\n"])));
|
|
12247
12247
|
|
|
12248
|
-
var _templateObject$V
|
|
12249
|
-
var
|
|
12250
|
-
var Options = styled__default.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteral(["\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n flex-basis: 60%;\n"])));
|
|
12251
|
-
|
|
12252
|
-
var _templateObject$W, _templateObject2$h;
|
|
12253
|
-
var SectionContainer = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n border-top: flex 1px solid ", ";\n border-top-width: calc(100% - 50px);\n padding: 5px 10px;\n"])), function (props) {
|
|
12254
|
-
return props.theme.colors.primary;
|
|
12255
|
-
});
|
|
12256
|
-
var SectionHeading = styled__default.div(_templateObject2$h || (_templateObject2$h = _taggedTemplateLiteral(["\n padding: 5px 10px;\n"])));
|
|
12257
|
-
|
|
12258
|
-
var _templateObject$X, _templateObject2$i, _templateObject3$9;
|
|
12259
|
-
var CommunicationPreferenceContainer = styled__default.div(_templateObject$X || (_templateObject$X = _taggedTemplateLiteral(["\n border: solid 1px #d1d5dbff;\n margin-bottom: 40px;\n"])));
|
|
12260
|
-
var EditButtonRow = styled__default.div(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteral(["\n display: flex;\n justify-content: end;\n padding: 10px 5px;\n margin-right: 16px;\n"])));
|
|
12261
|
-
var SubmitButton = styled__default.input(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteral(["\n flex-basis: 15%;\n margin-right: 5px;\n"])));
|
|
12262
|
-
|
|
12263
|
-
var _templateObject$Y;
|
|
12264
|
-
var FooterWrapper$1 = styled__default.div(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n }\n"])), function (props) {
|
|
12248
|
+
var _templateObject$V;
|
|
12249
|
+
var FooterWrapper$1 = styled__default.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n }\n"])), function (props) {
|
|
12265
12250
|
return props.theme.colors.gray;
|
|
12266
12251
|
});
|
|
12267
12252
|
|
|
12268
|
-
var _templateObject$
|
|
12253
|
+
var _templateObject$W;
|
|
12269
12254
|
var ALL_ITEM$1 = {
|
|
12270
12255
|
label: 'ALL',
|
|
12271
12256
|
value: 'ALL'
|
|
12272
12257
|
};
|
|
12273
|
-
var StyledMultiselector$1 = styled__default.div(_templateObject$
|
|
12258
|
+
var StyledMultiselector$1 = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n .multiselector__selected-items,\n .multiselector__selectable-items {\n display: flex;\n flex-flow: no-wrap;\n margin-bottom: 40px;\n .dropdown-select-container {\n width: 100%;\n .dropdown-select {\n &__control {\n border-color: ", ";\n border-radius: 0px;\n background-color: ", ";\n color: ", ";\n }\n &__multi-value {\n background-color: ", ";\n }\n &__multi-value__label {\n color: ", ";\n font-size: 100%;\n }\n &__multi-value__remove {\n svg {\n fill: ", ";\n }\n }\n }\n }\n }\n"])), function (props) {
|
|
12274
12259
|
return props.theme.colors.primary;
|
|
12275
12260
|
}, function (props) {
|
|
12276
12261
|
return props.theme.colors.ntrlMin;
|
package/ModelSelector.js
CHANGED
|
@@ -12245,32 +12245,17 @@
|
|
|
12245
12245
|
var FooterPaymentImage = styled__default.img(_templateObject15$2 || (_templateObject15$2 = _taggedTemplateLiteral(["\n {\n width: 100px;\n height: 30px;\n }\n"])));
|
|
12246
12246
|
var FooterConnectContainer = styled__default.div(_templateObject16$2 || (_templateObject16$2 = _taggedTemplateLiteral(["\n {\n display: flex;\n flex-direction: column;\n }\n"])));
|
|
12247
12247
|
|
|
12248
|
-
var _templateObject$V
|
|
12249
|
-
var
|
|
12250
|
-
var Options = styled__default.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteral(["\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n flex-basis: 60%;\n"])));
|
|
12251
|
-
|
|
12252
|
-
var _templateObject$W, _templateObject2$h;
|
|
12253
|
-
var SectionContainer = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n border-top: flex 1px solid ", ";\n border-top-width: calc(100% - 50px);\n padding: 5px 10px;\n"])), function (props) {
|
|
12254
|
-
return props.theme.colors.primary;
|
|
12255
|
-
});
|
|
12256
|
-
var SectionHeading = styled__default.div(_templateObject2$h || (_templateObject2$h = _taggedTemplateLiteral(["\n padding: 5px 10px;\n"])));
|
|
12257
|
-
|
|
12258
|
-
var _templateObject$X, _templateObject2$i, _templateObject3$9;
|
|
12259
|
-
var CommunicationPreferenceContainer = styled__default.div(_templateObject$X || (_templateObject$X = _taggedTemplateLiteral(["\n border: solid 1px #d1d5dbff;\n margin-bottom: 40px;\n"])));
|
|
12260
|
-
var EditButtonRow = styled__default.div(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteral(["\n display: flex;\n justify-content: end;\n padding: 10px 5px;\n margin-right: 16px;\n"])));
|
|
12261
|
-
var SubmitButton = styled__default.input(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteral(["\n flex-basis: 15%;\n margin-right: 5px;\n"])));
|
|
12262
|
-
|
|
12263
|
-
var _templateObject$Y;
|
|
12264
|
-
var FooterWrapper$1 = styled__default.div(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n }\n"])), function (props) {
|
|
12248
|
+
var _templateObject$V;
|
|
12249
|
+
var FooterWrapper$1 = styled__default.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n }\n"])), function (props) {
|
|
12265
12250
|
return props.theme.colors.gray;
|
|
12266
12251
|
});
|
|
12267
12252
|
|
|
12268
|
-
var _templateObject$
|
|
12253
|
+
var _templateObject$W;
|
|
12269
12254
|
var ALL_ITEM$1 = {
|
|
12270
12255
|
label: 'ALL',
|
|
12271
12256
|
value: 'ALL'
|
|
12272
12257
|
};
|
|
12273
|
-
var StyledMultiselector$1 = styled__default.div(_templateObject$
|
|
12258
|
+
var StyledMultiselector$1 = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n .multiselector__selected-items,\n .multiselector__selectable-items {\n display: flex;\n flex-flow: no-wrap;\n margin-bottom: 40px;\n .dropdown-select-container {\n width: 100%;\n .dropdown-select {\n &__control {\n border-color: ", ";\n border-radius: 0px;\n background-color: ", ";\n color: ", ";\n }\n &__multi-value {\n background-color: ", ";\n }\n &__multi-value__label {\n color: ", ";\n font-size: 100%;\n }\n &__multi-value__remove {\n svg {\n fill: ", ";\n }\n }\n }\n }\n }\n"])), function (props) {
|
|
12274
12259
|
return props.theme.colors.primary;
|
|
12275
12260
|
}, function (props) {
|
|
12276
12261
|
return props.theme.colors.ntrlMin;
|
package/build/bundle.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.interests__add-button{display:flex;flex-direction:row;gap:10px;width:100%}@media only screen and (max-width:879px){.interests__add-button{flex-direction:column}}.interests__section-wrapper{display:flex;flex-direction:column;width:100%}.interests__select-option{display:flex;flex-direction:column;margin-bottom:15px}.interests__title{font-family:El Messiri;font-size:16px;margin-bottom:10px}.navbar{box-shadow:2px 2px 10px #dfdede;display:flex;padding-bottom:10px;padding-top:20px;position:relative}@media only screen and (max-width:879px){.navbar{padding-top:12px}}.navbar__link-item--desktop{align-items:center;display:flex;height:35px;margin:auto 0;padding-top:5px}.navbar__mobile-wrapper{align-items:center;display:flex;flex-direction:column;padding-left:16px;padding-right:16px}.navbar__container{display:flex;margin:0 auto;max-width:1280px;padding-left:12px;padding-right:12px;width:100%}.navbar__body{flex-basis:60%}.navbar__wrapper{align-items:center;display:flex;gap:10px;justify-content:flex-start;width:100%}@media only screen and (max-width:879px){.navbar__wrapper .navbar__menu-icon-wrapper{margin-right:10px}.navbar__wrapper .navbar__logo{margin-left:0;margin-right:auto}.navbar__wrapper .navbar__icons-wrapper{align-items:center;display:flex;gap:20px;margin-left:auto}.navbar__wrapper .navbar__icons{align-items:center;display:flex;gap:20px;margin:0}.navbar__wrapper .navbar__icon{margin:0}}.navbar__product-search-wrapper{align-items:center;display:flex;justify-content:center;padding:0 20%;width:100%}@media only screen and (max-width:879px){.navbar__product-search-wrapper{padding:0}}.navbar__search-container{width:100%}.navbar__input-close-icon{height:auto;margin-bottom:10px;margin-left:10px;width:20px}@media only screen and (max-width:879px){.navbar__input-close-icon{margin-bottom:0;margin-left:0;width:15px}}.navbar__menu-icon{width:20px}.navbar__product-search{align-items:center;display:flex;max-width:545px;width:100%}.navbar__logo-wrapper{margin-right:18px;width:200px}.navbar__logo{width:200px}@media only screen and (max-width:879px){.navbar__logo{margin-left:10px;margin-top:5px;width:150px}}.navbar__form-input{align-items:center;background:transparent;border:none;display:flex;font-size:13px;outline:none;padding:8px;width:100%}.navbar__product-search{border:1px solid #dfdede;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__product-search{border:none;border-bottom:1px solid #dfdede;margin-bottom:0;margin-right:10px;margin-top:10px}}.navbar__section{align-items:flex-start;display:flex;flex-direction:row;justify-content:space-between;width:100%}.navbar__link{display:inline-block;font-family:Martel Sans;font-size:14px;font-weight:700;margin-right:10px;overflow:hidden;text-transform:uppercase;transition:.3s ease-in-out}.navbar__link:after{background-color:#000;content:"";display:block;height:2px;transition:width .25s ease-out;width:0}.navbar__link:hover:after{width:100%}.navbar__link:hover .navbar__dropdown{animation:fadeInDropdown .3s ease-in-out;display:block}.navbar__dropdown{background-color:#fff;box-shadow:5px 5px 5px #dfdede;display:none;left:0;position:absolute;width:100%;z-index:999}@keyframes fadeInDropdown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.navbar__company-link{font-size:13px;font-weight:400;list-style:none;margin-left:18px;text-decoration:none}.navbar__company-block{align-items:center;background-color:#000;color:#fff;display:flex;font-weight:700;height:33px;justify-content:center;margin-right:0;padding:0 18px;text-transform:uppercase}.navbar__input-search-icon{height:auto;margin-left:1.125rem;margin-right:.375rem;width:15px}.navbar__nav-links{align-items:center;display:flex}.navbar__nav-links--wrap{flex-wrap:wrap}.navbar__icons{align-items:center;display:flex;height:40px;justify-content:flex-end;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__icons{display:block;height:20px;margin-bottom:0}}.navbar__icon{cursor:pointer;height:auto;margin-right:18px;width:20px}.navbar__icon.navbar__cart-icon{margin-right:0}.navbar__icon--app{cursor:pointer;height:auto;margin-left:12px;width:20px}@media only screen and (max-width:879px){.navbar__icon--app{margin-right:0}}.navbar__loyalty-icon{height:18px;position:absolute;right:-14px;top:-6px;width:18px}.navbar__cart-icon{position:relative}.navbar__cart-count{bottom:50%;font-size:13px;height:20px;left:60%;position:absolute;width:20px}.navbar__account-initials,.navbar__cart-count{align-items:center;background-color:#f2eeeb;border-radius:50%;color:#000;display:flex;justify-content:center}.navbar__account-initials{font-size:11px;font-weight:500;height:24px;text-transform:uppercase;width:24px}@keyframes navbar-heart-glisten{0%{transform:translateX(-160%) skewX(-20deg)}55%,to{transform:translateX(260%) skewX(-20deg)}}.navbar__interest-heart{background-color:#010101;display:inline-block;height:20px;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;position:relative;width:20px}.navbar__interest-heart:after{animation:navbar-heart-glisten 2.4s ease-in-out infinite;background:linear-gradient(115deg,transparent,hsla(0,0%,100%,.95) 50%,transparent);content:"";height:100%;left:0;pointer-events:none;position:absolute;top:0;transform:translateX(-160%) skewX(-20deg);width:55%}@media (prefers-reduced-motion:reduce){.navbar__interest-heart:after{animation:none}}.footer__newsletter-section{align-items:center;background-color:#000;color:#fff;display:flex;justify-content:space-between;padding:2.265rem 0}@media only screen and (max-width:879px){.footer__newsletter-section{flex-direction:column}}.footer__newsletter-wrapper{align-items:center;display:flex;justify-content:space-between;margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__newsletter-wrapper{flex-direction:column}.footer__link-container{flex-basis:50%}}.footer__newsletter-icon{height:30px;position:absolute;right:0;top:0;width:32px}.footer__newsletter-form{flex-basis:50%;max-width:250px;position:relative}@media only screen and (max-width:879px){.footer__newsletter-form{display:block;margin-top:20px;max-width:100%;width:100%}}.footer__newsletter-title{font-family:Martel Sans,sans-serif;font-size:14px;font-weight:700;letter-spacing:3px;margin-bottom:1.125rem;text-transform:uppercase}.footer__newsletter-text{font-size:14px}.footer__form-input{background-color:#000;border:none;border-bottom:1px solid #fff;color:#fff;height:30px;outline:none;width:100%}.footer__form-input::-moz-placeholder{color:#fff;font-weight:400}.footer__form-input::placeholder{color:#fff;font-weight:400}.footer__form-errors{color:#fff;margin-top:5px}.footer__main-section{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:50px;margin-top:80px}.footer__link-title{font-family:El Messiri;font-size:16px;font-weight:700;margin-bottom:20px;text-transform:uppercase}@media only screen and (max-width:879px){.footer__link-title{margin-bottom:10px}}.footer__link-child{margin-top:25px}.footer__links{display:flex;flex-direction:column}.footer__link{color:#939393;cursor:pointer;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:7px;text-align:left;text-decoration:none}.footer__link:hover{color:#000;text-decoration:underline}@media only screen and (max-width:879px){.footer__link{margin-bottom:10px}}.footer__link-wrapper{align-items:center;display:flex;gap:5px}.footer__link-icon{height:30px;margin-bottom:18px}.footer__text{color:#939393;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:15px;text-align:left;text-decoration:none}.footer__store-hours{margin-top:35px}.footer__copyrights-section{border-top:1px solid;display:flex;justify-content:space-between;padding-bottom:20px;padding-top:20px}.footer__logo{height:30px;width:135px}.footer__payment-icons{align-items:center;display:flex;gap:8px}.footer__wrapper{margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__wrapper{padding:32px 0 0 24px}}.footer__wrapper--desktop{display:block}@media only screen and (max-width:879px){.footer__wrapper--desktop{display:none}}.footer__wrapper--mobile{display:none}@media only screen and (max-width:879px){.footer__wrapper--mobile{display:block;padding-top:30px}}.footer__copyright{font-size:10px;line-height:22px}.footer__copyright--mobile{display:none}@media only screen and (max-width:879px){.footer__copyright--mobile{display:block;padding:30px 10px 30px 0;text-align:center}}.footer__section-row{display:flex;gap:50%}@media only screen and (max-width:879px){.footer__section-row{gap:unset}}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{align-items:center;display:flex;font-size:14px;font-weight:700;justify-content:center;line-height:20px;text-transform:uppercase}.side-nav__menu-icon{display:flex;height:25px;margin-right:10px;width:25px}.side-nav__menu-divider{margin-bottom:40px}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;justify-content:space-between;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{font-size:14px;font-weight:700;line-height:20px;text-transform:uppercase}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}@charset "UTF-8";.currency-select-container{align-items:center;display:flex;margin-right:18px;position:relative}.currency-select-container .currency-flag{margin-right:5px}.currency-select-container .currency-flag img{height:15px;-o-object-fit:cover;object-fit:cover;width:20px}.currency-select-container .currency-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:transparent;border:none;color:#000;cursor:pointer;font-family:inherit;font-size:14px;margin:0;outline:none;padding:5px 15px 5px 5px}.currency-select-container .currency-select::-ms-expand{display:none}.currency-select-container .currency-select:focus{box-shadow:none;outline:none}.currency-select-container .currency-select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}.currency-select-container:after{color:#000;content:"▼";font-size:10px;pointer-events:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}@media only screen and (max-width:879px){.currency-select-container .currency-select{appearance:menulist;-webkit-appearance:menulist;-moz-appearance:menulist;padding-right:0}.currency-select-container:after{display:none}}.currency-select-container.disabled{cursor:not-allowed;opacity:.7}.currency-select-container.disabled .currency-select{pointer-events:none}.stores-dropdown{align-items:flex-start;display:flex;font-family:Martel Sans;gap:20px;margin-left:auto;margin-right:auto;max-width:1280px;overflow-x:auto;padding:20px 15px}.stores-dropdown__image{height:200px;-o-object-fit:cover;object-fit:cover;width:100%}.stores-dropdown__store-details{flex-basis:20%}.stores-dropdown__title{font-family:El Messiri}.stores-dropdown__main-title,.stores-dropdown__title{font-size:16px;font-weight:400;letter-spacing:3px;margin-top:20px}.stores-dropdown__main-title{font-weight:700;margin-bottom:10px}.stores-dropdown__open-days{font-size:12px;font-weight:700;line-height:20px}.stores-dropdown__open-hours{font-size:12px;font-weight:400;line-height:20px}.stores-dropdown__queries-title{font-family:El Messiri;font-size:16px;font-weight:400;letter-spacing:3px}.stores-dropdown__contact-details{font-size:16px;font-weight:700}.stores-dropdown__view-more{cursor:pointer;font-size:14px;font-weight:400;margin-top:10px;text-transform:capitalize}@keyframes shimmer{0%{background-position:-468px 0}to{background-position:468px 0}}.shimmer{animation:shimmer 1.2s ease-in-out infinite;background:linear-gradient(90deg,#f4f4f4 0,#dfdede 20%,#f4f4f4 40%,#f4f4f4);background-size:800px 104px}@media only screen and (max-width:1052px){.shimmer{background-size:600px 104px}}.search-results{background:#fff;border:1px solid #dfdede;border-radius:2px;box-shadow:0 2px 8px rgba(0,0,0,.08);display:flex;position:absolute;width:770px;z-index:50}@media only screen and (max-width:1052px){.search-results{border:none;box-shadow:none;flex-direction:column;left:0;right:0;top:100%;width:100%}}.search-results__section:first-child{border-right:1px solid #dfdede;flex:1;min-width:240px}.search-results__section:last-child{display:flex;flex:2;flex-direction:column}.search-results__section-header{align-items:center;display:flex;justify-content:space-between}.search-results__header{color:#000;font-family:Martel Sans;font-size:14px;font-weight:600;margin-bottom:0;padding:16px 20px;text-transform:uppercase}@media only screen and (max-width:1052px){.search-results__header{font-size:13px;padding:12px 16px}}.search-results__view-all-link{display:none}@media only screen and (max-width:879px){.search-results__view-all-link{color:#000;display:block;font-family:Martel Sans;font-size:14px;margin-right:20px}}.search-results__list{display:flex;flex-direction:column}.search-results__item{color:grey;font-family:Martel Sans;font-size:14px;padding:8px 20px;text-decoration:none}.search-results__product-list{display:flex;flex-direction:column;overflow-y:auto}.product-card{color:inherit;display:flex;padding:12px 20px;text-decoration:none;transition:background-color .15s ease}.product-card:hover{background-color:#f4f4f4}.product-card__image-container{border-radius:2px;flex-shrink:0;height:90px;margin-right:16px;overflow:hidden;width:90px}.product-card__image{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.product-card__details{display:flex;flex:1;flex-direction:column}.product-card__name{color:#000;font-family:Martel Sans;font-size:14px;line-height:1.4;margin-bottom:24px}.product-card__brand-name{font-weight:600}.product-card__info-row{align-items:flex-end;display:flex;justify-content:space-between}@media only screen and (max-width:879px){.product-card__info-row{align-items:flex-start;flex-direction:column}}.product-card__price-group{display:flex;flex-direction:column;gap:4px}.product-card__price{font-family:Martel Sans;font-size:14px;font-weight:600;line-height:1}.product-card__price--promotion{color:#000}.product-card__price--original{color:#939393;font-weight:400;text-decoration:line-through}.product-card__price-with-promotion{display:flex;flex-direction:column;gap:2px}.product-card__retail-price{color:#939393;font-family:Martel Sans;font-size:14px;text-decoration:line-through}.product-card__condition{color:#000;font-family:Martel Sans;font-size:13px;margin-right:20px;text-align:right}.product-card__condition-label{color:#939393;margin-right:4px}.search-results__view-all-button{background-color:#f2eeeb!important;border:none;color:#000;cursor:pointer;font-family:Martel Sans;font-size:13px;font-weight:400;padding:16px;text-align:center}@media only screen and (max-width:879px){.search-results__view-all-button{display:none}}.search-results__no-results{display:flex;flex-direction:column;width:100%}.search-results__no-results-content{align-items:flex-start;display:flex;gap:20px;padding:20px}@media only screen and (max-width:879px){.search-results__no-results-content{gap:16px;padding:16px}}@media only screen and (max-width:1052px){.search-results__no-results-content{align-items:flex-start;gap:12px;padding:16px 12px}}.search-results__no-results-image{border-radius:4px;flex-shrink:0;height:180px;overflow:hidden;width:180px}@media only screen and (max-width:879px){.search-results__no-results-image{height:120px;width:120px}}@media only screen and (max-width:1052px){.search-results__no-results-image{height:100px;width:100px}}.search-results__no-results-image img{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.search-results__no-results-text{display:flex;flex:1;flex-direction:column;gap:12px;text-align:left}@media only screen and (max-width:1052px){.search-results__no-results-text{gap:8px}}.search-results__no-results-title{color:#000;font-family:Martel Sans;font-size:16px;font-weight:600;line-height:1.4;margin:0}@media only screen and (max-width:879px){.search-results__no-results-title{font-size:14px}}@media only screen and (max-width:1052px){.search-results__no-results-title{font-size:14px;line-height:1.3}}.search-results__no-results-description{color:#939393;font-family:Martel Sans;font-size:14px;line-height:1.5;margin:0}@media only screen and (max-width:879px){.search-results__no-results-description{font-size:13px}}@media only screen and (max-width:1052px){.search-results__no-results-description{font-size:12px;line-height:1.4}}.search-results__create-interest-button{background-color:#f2eeeb!important;border:none;color:#000;cursor:pointer;font-family:Martel Sans;font-size:13px;font-weight:400;padding:16px;text-align:center;width:100%}@media only screen and (max-width:879px){.search-results__create-interest-button{display:block}}@media only screen and (max-width:1052px){.search-results__create-interest-button{font-size:13px;margin-top:8px;padding:14px 16px}}.brand-skeleton{display:flex;flex-direction:column;width:100%}.brand-skeleton__item{background-color:#f4f4f4;border-radius:4px;height:32px;margin:8px 20px}.brand-skeleton__item:first-child{margin-top:0}@media only screen and (max-width:1052px){.brand-skeleton__item{height:28px;margin:6px 16px}}.product-skeleton{display:flex;gap:16px;padding:12px 20px}@media only screen and (max-width:1052px){.product-skeleton{gap:12px;padding:10px 16px}}.product-skeleton__image{background-color:#f4f4f4;border-radius:2px;flex-shrink:0;height:90px;width:90px}@media only screen and (max-width:1052px){.product-skeleton__image{height:70px;width:70px}}.product-skeleton__content{display:flex;flex:1;flex-direction:column;gap:12px}@media only screen and (max-width:1052px){.product-skeleton__content{gap:8px}}.product-skeleton__title{background-color:#f4f4f4;border-radius:4px;height:16px;width:100%}@media only screen and (max-width:1052px){.product-skeleton__title{height:14px}}.product-skeleton__subtitle{background-color:#f4f4f4;border-radius:4px;height:14px;width:80%}@media only screen and (max-width:1052px){.product-skeleton__subtitle{height:12px;width:70%}}.product-skeleton__price{background-color:#f4f4f4;border-radius:4px;height:14px;margin-top:auto;width:60%}@media only screen and (max-width:1052px){.product-skeleton__price{height:12px;width:50%}}.dropdown{display:flex;justify-content:space-between;margin-left:auto;margin-right:auto;max-width:1280px;min-height:500px;overflow-x:auto;padding:20px 0}.dropdown__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center;min-height:300px}.dropdown__column{flex:1;padding-left:12px}.dropdown__column:nth-child(2){flex:2}.dropdown__title{font-family:El Messiri;font-size:16px;font-weight:700;letter-spacing:3px;line-height:1;margin-bottom:20px;text-transform:uppercase}.dropdown__elements{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));max-height:800px;overflow-y:auto}.dropdown__brand-elements{-moz-column-count:3;column-count:3;max-height:800px}.dropdown__brand-element{cursor:pointer;margin-bottom:10px}.dropdown__element{flex-basis:33.33%;font-family:Martel Sans;font-size:14px;font-weight:400;margin-bottom:10px;text-transform:capitalize}.cover-spinner{align-items:center;background-color:hsla(0,0%,100%,.7);display:flex;height:100%;justify-content:center;min-height:400px;position:relative;top:50%;width:100%;z-index:9999}.cover-spinner:after{animation:spin 1.5s linear infinite;border:4px dotted #000;border-radius:50%;border-top-color:transparent;content:"";display:block;height:40px;position:absolute;width:40px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
|
|
1
|
+
.interests__add-button{display:flex;flex-direction:row;gap:10px;width:100%}@media only screen and (max-width:879px){.interests__add-button{flex-direction:column}}.interests__section-wrapper{display:flex;flex-direction:column;width:100%}.interests__select-option{display:flex;flex-direction:column;margin-bottom:15px}.interests__title{font-family:El Messiri;font-size:16px;margin-bottom:10px}.navbar{box-shadow:2px 2px 10px #dfdede;display:flex;padding-bottom:10px;padding-top:20px;position:relative}@media only screen and (max-width:879px){.navbar{padding-top:12px}}.navbar__link-item--desktop{align-items:center;display:flex;height:35px;margin:auto 0;padding-top:5px}.navbar__mobile-wrapper{align-items:center;display:flex;flex-direction:column;padding-left:16px;padding-right:16px}.navbar__container{display:flex;margin:0 auto;max-width:1280px;padding-left:12px;padding-right:12px;width:100%}.navbar__body{flex-basis:60%}.navbar__wrapper{align-items:center;display:flex;gap:10px;justify-content:flex-start;width:100%}@media only screen and (max-width:879px){.navbar__wrapper .navbar__menu-icon-wrapper{margin-right:10px}.navbar__wrapper .navbar__logo{margin-left:0;margin-right:auto}.navbar__wrapper .navbar__icons-wrapper{align-items:center;display:flex;gap:20px;margin-left:auto}.navbar__wrapper .navbar__icons{align-items:center;display:flex;gap:20px;margin:0}.navbar__wrapper .navbar__icon{margin:0}}.navbar__product-search-wrapper{align-items:center;display:flex;justify-content:center;padding:0 20%;width:100%}@media only screen and (max-width:879px){.navbar__product-search-wrapper{padding:0}}.navbar__search-container{width:100%}.navbar__input-close-icon{height:auto;margin-bottom:10px;margin-left:10px;width:20px}@media only screen and (max-width:879px){.navbar__input-close-icon{margin-bottom:0;margin-left:0;width:15px}}.navbar__menu-icon{width:20px}.navbar__product-search{align-items:center;display:flex;max-width:545px;width:100%}.navbar__logo-wrapper{margin-right:18px;width:200px}.navbar__logo{width:200px}@media only screen and (max-width:879px){.navbar__logo{margin-left:10px;margin-top:5px;width:150px}}.navbar__form-input{align-items:center;background:transparent;border:none;display:flex;font-size:13px;outline:none;padding:8px;width:100%}.navbar__product-search{border:1px solid #dfdede;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__product-search{border:none;border-bottom:1px solid #dfdede;margin-bottom:0;margin-right:10px;margin-top:10px}}.navbar__section{align-items:flex-start;display:flex;flex-direction:row;justify-content:space-between;width:100%}.navbar__link{display:inline-block;font-family:Martel Sans;font-size:14px;font-weight:700;margin-right:10px;overflow:hidden;text-transform:uppercase;transition:.3s ease-in-out}.navbar__link:after{background-color:#000;content:"";display:block;height:2px;transition:width .25s ease-out;width:0}.navbar__link:hover:after{width:100%}.navbar__link:hover .navbar__dropdown{animation:fadeInDropdown .3s ease-in-out;display:block}.navbar__dropdown{background-color:#fff;box-shadow:5px 5px 5px #dfdede;display:none;left:0;position:absolute;width:100%;z-index:999}@keyframes fadeInDropdown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.navbar__company-link{font-size:13px;font-weight:400;list-style:none;margin-left:18px;text-decoration:none}.navbar__company-block{align-items:center;background-color:#000;color:#fff;display:flex;font-weight:700;height:33px;justify-content:center;margin-right:0;padding:0 18px;text-transform:uppercase}.navbar__input-search-icon{height:auto;margin-left:1.125rem;margin-right:.375rem;width:15px}.navbar__nav-links{align-items:center;display:flex}.navbar__nav-links--wrap{flex-wrap:wrap}.navbar__icons{align-items:center;display:flex;height:40px;justify-content:flex-end;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__icons{display:block;height:20px;margin-bottom:0}}.navbar__icon{cursor:pointer;height:auto;margin-right:18px;width:20px}.navbar__icon.navbar__cart-icon{margin-right:0}.navbar__icon--app{cursor:pointer;height:auto;margin-left:12px;width:20px}@media only screen and (max-width:879px){.navbar__icon--app{margin-right:0}}.navbar__loyalty-icon{height:18px;position:absolute;right:-14px;top:-6px;width:18px}.navbar__cart-icon{position:relative}.navbar__cart-count{bottom:50%;font-size:13px;height:20px;left:60%;position:absolute;width:20px}.navbar__account-initials,.navbar__cart-count{align-items:center;background-color:#f2eeeb;border-radius:50%;color:#000;display:flex;justify-content:center}.navbar__account-initials{font-size:11px;font-weight:500;height:24px;text-transform:uppercase;width:24px}@keyframes navbar-heart-glisten{0%{transform:translateX(-160%) skewX(-20deg)}55%,to{transform:translateX(260%) skewX(-20deg)}}.navbar__interest-heart{background-color:#010101;display:inline-block;height:20px;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;position:relative;width:20px}.navbar__interest-heart:after{animation:navbar-heart-glisten 2.4s ease-in-out infinite;background:linear-gradient(115deg,transparent,hsla(0,0%,100%,.95) 50%,transparent);content:"";height:100%;left:0;pointer-events:none;position:absolute;top:0;transform:translateX(-160%) skewX(-20deg);width:55%}@media (prefers-reduced-motion:reduce){.navbar__interest-heart:after{animation:none}}.footer__newsletter-section{align-items:center;background-color:#000;color:#fff;display:flex;justify-content:space-between;padding:2.265rem 0}@media only screen and (max-width:879px){.footer__newsletter-section{flex-direction:column}}.footer__newsletter-wrapper{align-items:center;display:flex;justify-content:space-between;margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__newsletter-wrapper{flex-direction:column}.footer__link-container{flex-basis:50%}}.footer__newsletter-icon{height:30px;position:absolute;right:0;top:0;width:32px}.footer__newsletter-form{flex-basis:50%;max-width:250px;position:relative}@media only screen and (max-width:879px){.footer__newsletter-form{display:block;margin-top:20px;max-width:100%;width:100%}}.footer__newsletter-title{font-family:Martel Sans,sans-serif;font-size:14px;font-weight:700;letter-spacing:3px;margin-bottom:1.125rem;text-transform:uppercase}.footer__newsletter-text{font-size:14px}.footer__form-input{background-color:#000;border:none;border-bottom:1px solid #fff;color:#fff;height:30px;outline:none;width:100%}.footer__form-input::-moz-placeholder{color:#fff;font-weight:400}.footer__form-input::placeholder{color:#fff;font-weight:400}.footer__form-errors{color:#fff;margin-top:5px}.footer__main-section{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:50px;margin-top:80px}.footer__link-title{font-family:El Messiri;font-size:16px;font-weight:700;margin-bottom:20px;text-transform:uppercase}@media only screen and (max-width:879px){.footer__link-title{margin-bottom:10px}}.footer__link-child{margin-top:25px}.footer__links{display:flex;flex-direction:column}.footer__link{color:#939393;cursor:pointer;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:7px;text-align:left;text-decoration:none}.footer__link:hover{color:#000;text-decoration:underline}@media only screen and (max-width:879px){.footer__link{margin-bottom:10px}}.footer__link-wrapper{align-items:center;display:flex;gap:5px}.footer__link-icon{height:30px;margin-bottom:18px}.footer__text{color:#939393;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:15px;text-align:left;text-decoration:none}.footer__store-hours{margin-top:35px}.footer__copyrights-section{border-top:1px solid;display:flex;justify-content:space-between;padding-bottom:20px;padding-top:20px}.footer__logo{height:30px;width:135px}.footer__payment-icons{align-items:center;display:flex;gap:8px}.footer__wrapper{margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__wrapper{padding:32px 0 0 24px}}.footer__wrapper--desktop{display:block}@media only screen and (max-width:879px){.footer__wrapper--desktop{display:none}}.footer__wrapper--mobile{display:none}@media only screen and (max-width:879px){.footer__wrapper--mobile{display:block;padding-top:30px}}.footer__copyright{font-size:10px;line-height:22px}.footer__copyright--mobile{display:none}@media only screen and (max-width:879px){.footer__copyright--mobile{display:block;padding:30px 10px 30px 0;text-align:center}}.footer__section-row{display:flex;gap:50%}@media only screen and (max-width:879px){.footer__section-row{gap:unset}}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{align-items:center;display:flex;font-size:14px;font-weight:700;justify-content:center;line-height:20px;text-transform:uppercase}.side-nav__menu-icon{display:flex;height:25px;margin-right:10px;width:25px}.side-nav__menu-divider{margin-bottom:40px}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}@charset "UTF-8";.currency-select-container{align-items:center;display:flex;margin-right:18px;position:relative}.currency-select-container .currency-flag{margin-right:5px}.currency-select-container .currency-flag img{height:15px;-o-object-fit:cover;object-fit:cover;width:20px}.currency-select-container .currency-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:transparent;border:none;color:#000;cursor:pointer;font-family:inherit;font-size:14px;margin:0;outline:none;padding:5px 15px 5px 5px}.currency-select-container .currency-select::-ms-expand{display:none}.currency-select-container .currency-select:focus{box-shadow:none;outline:none}.currency-select-container .currency-select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}.currency-select-container:after{color:#000;content:"▼";font-size:10px;pointer-events:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}@media only screen and (max-width:879px){.currency-select-container .currency-select{appearance:menulist;-webkit-appearance:menulist;-moz-appearance:menulist;padding-right:0}.currency-select-container:after{display:none}}.currency-select-container.disabled{cursor:not-allowed;opacity:.7}.currency-select-container.disabled .currency-select{pointer-events:none}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;justify-content:space-between;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{font-size:14px;font-weight:700;line-height:20px;text-transform:uppercase}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}@keyframes shimmer{0%{background-position:-468px 0}to{background-position:468px 0}}.shimmer{animation:shimmer 1.2s ease-in-out infinite;background:linear-gradient(90deg,#f4f4f4 0,#dfdede 20%,#f4f4f4 40%,#f4f4f4);background-size:800px 104px}@media only screen and (max-width:1052px){.shimmer{background-size:600px 104px}}.search-results{background:#fff;border:1px solid #dfdede;border-radius:2px;box-shadow:0 2px 8px rgba(0,0,0,.08);display:flex;position:absolute;width:770px;z-index:50}@media only screen and (max-width:1052px){.search-results{border:none;box-shadow:none;flex-direction:column;left:0;right:0;top:100%;width:100%}}.search-results__section:first-child{border-right:1px solid #dfdede;flex:1;min-width:240px}.search-results__section:last-child{display:flex;flex:2;flex-direction:column}.search-results__section-header{align-items:center;display:flex;justify-content:space-between}.search-results__header{color:#000;font-family:Martel Sans;font-size:14px;font-weight:600;margin-bottom:0;padding:16px 20px;text-transform:uppercase}@media only screen and (max-width:1052px){.search-results__header{font-size:13px;padding:12px 16px}}.search-results__view-all-link{display:none}@media only screen and (max-width:879px){.search-results__view-all-link{color:#000;display:block;font-family:Martel Sans;font-size:14px;margin-right:20px}}.search-results__list{display:flex;flex-direction:column}.search-results__item{color:grey;font-family:Martel Sans;font-size:14px;padding:8px 20px;text-decoration:none}.search-results__product-list{display:flex;flex-direction:column;overflow-y:auto}.product-card{color:inherit;display:flex;padding:12px 20px;text-decoration:none;transition:background-color .15s ease}.product-card:hover{background-color:#f4f4f4}.product-card__image-container{border-radius:2px;flex-shrink:0;height:90px;margin-right:16px;overflow:hidden;width:90px}.product-card__image{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.product-card__details{display:flex;flex:1;flex-direction:column}.product-card__name{color:#000;font-family:Martel Sans;font-size:14px;line-height:1.4;margin-bottom:24px}.product-card__brand-name{font-weight:600}.product-card__info-row{align-items:flex-end;display:flex;justify-content:space-between}@media only screen and (max-width:879px){.product-card__info-row{align-items:flex-start;flex-direction:column}}.product-card__price-group{display:flex;flex-direction:column;gap:4px}.product-card__price{font-family:Martel Sans;font-size:14px;font-weight:600;line-height:1}.product-card__price--promotion{color:#000}.product-card__price--original{color:#939393;font-weight:400;text-decoration:line-through}.product-card__price-with-promotion{display:flex;flex-direction:column;gap:2px}.product-card__retail-price{color:#939393;font-family:Martel Sans;font-size:14px;text-decoration:line-through}.product-card__condition{color:#000;font-family:Martel Sans;font-size:13px;margin-right:20px;text-align:right}.product-card__condition-label{color:#939393;margin-right:4px}.search-results__view-all-button{background-color:#f2eeeb!important;border:none;color:#000;cursor:pointer;font-family:Martel Sans;font-size:13px;font-weight:400;padding:16px;text-align:center}@media only screen and (max-width:879px){.search-results__view-all-button{display:none}}.search-results__no-results{display:flex;flex-direction:column;width:100%}.search-results__no-results-content{align-items:flex-start;display:flex;gap:20px;padding:20px}@media only screen and (max-width:879px){.search-results__no-results-content{gap:16px;padding:16px}}@media only screen and (max-width:1052px){.search-results__no-results-content{align-items:flex-start;gap:12px;padding:16px 12px}}.search-results__no-results-image{border-radius:4px;flex-shrink:0;height:180px;overflow:hidden;width:180px}@media only screen and (max-width:879px){.search-results__no-results-image{height:120px;width:120px}}@media only screen and (max-width:1052px){.search-results__no-results-image{height:100px;width:100px}}.search-results__no-results-image img{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.search-results__no-results-text{display:flex;flex:1;flex-direction:column;gap:12px;text-align:left}@media only screen and (max-width:1052px){.search-results__no-results-text{gap:8px}}.search-results__no-results-title{color:#000;font-family:Martel Sans;font-size:16px;font-weight:600;line-height:1.4;margin:0}@media only screen and (max-width:879px){.search-results__no-results-title{font-size:14px}}@media only screen and (max-width:1052px){.search-results__no-results-title{font-size:14px;line-height:1.3}}.search-results__no-results-description{color:#939393;font-family:Martel Sans;font-size:14px;line-height:1.5;margin:0}@media only screen and (max-width:879px){.search-results__no-results-description{font-size:13px}}@media only screen and (max-width:1052px){.search-results__no-results-description{font-size:12px;line-height:1.4}}.search-results__create-interest-button{background-color:#f2eeeb!important;border:none;color:#000;cursor:pointer;font-family:Martel Sans;font-size:13px;font-weight:400;padding:16px;text-align:center;width:100%}@media only screen and (max-width:879px){.search-results__create-interest-button{display:block}}@media only screen and (max-width:1052px){.search-results__create-interest-button{font-size:13px;margin-top:8px;padding:14px 16px}}.brand-skeleton{display:flex;flex-direction:column;width:100%}.brand-skeleton__item{background-color:#f4f4f4;border-radius:4px;height:32px;margin:8px 20px}.brand-skeleton__item:first-child{margin-top:0}@media only screen and (max-width:1052px){.brand-skeleton__item{height:28px;margin:6px 16px}}.product-skeleton{display:flex;gap:16px;padding:12px 20px}@media only screen and (max-width:1052px){.product-skeleton{gap:12px;padding:10px 16px}}.product-skeleton__image{background-color:#f4f4f4;border-radius:2px;flex-shrink:0;height:90px;width:90px}@media only screen and (max-width:1052px){.product-skeleton__image{height:70px;width:70px}}.product-skeleton__content{display:flex;flex:1;flex-direction:column;gap:12px}@media only screen and (max-width:1052px){.product-skeleton__content{gap:8px}}.product-skeleton__title{background-color:#f4f4f4;border-radius:4px;height:16px;width:100%}@media only screen and (max-width:1052px){.product-skeleton__title{height:14px}}.product-skeleton__subtitle{background-color:#f4f4f4;border-radius:4px;height:14px;width:80%}@media only screen and (max-width:1052px){.product-skeleton__subtitle{height:12px;width:70%}}.product-skeleton__price{background-color:#f4f4f4;border-radius:4px;height:14px;margin-top:auto;width:60%}@media only screen and (max-width:1052px){.product-skeleton__price{height:12px;width:50%}}.stores-dropdown{align-items:flex-start;display:flex;font-family:Martel Sans;gap:20px;margin-left:auto;margin-right:auto;max-width:1280px;overflow-x:auto;padding:20px 15px}.stores-dropdown__image{height:200px;-o-object-fit:cover;object-fit:cover;width:100%}.stores-dropdown__store-details{flex-basis:20%}.stores-dropdown__title{font-family:El Messiri}.stores-dropdown__main-title,.stores-dropdown__title{font-size:16px;font-weight:400;letter-spacing:3px;margin-top:20px}.stores-dropdown__main-title{font-weight:700;margin-bottom:10px}.stores-dropdown__open-days{font-size:12px;font-weight:700;line-height:20px}.stores-dropdown__open-hours{font-size:12px;font-weight:400;line-height:20px}.stores-dropdown__queries-title{font-family:El Messiri;font-size:16px;font-weight:400;letter-spacing:3px}.stores-dropdown__contact-details{font-size:16px;font-weight:700}.stores-dropdown__view-more{cursor:pointer;font-size:14px;font-weight:400;margin-top:10px;text-transform:capitalize}.dropdown{display:flex;justify-content:space-between;margin-left:auto;margin-right:auto;max-width:1280px;min-height:500px;overflow-x:auto;padding:20px 0}.dropdown__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center;min-height:300px}.dropdown__column{flex:1;padding-left:12px}.dropdown__column:nth-child(2){flex:2}.dropdown__title{font-family:El Messiri;font-size:16px;font-weight:700;letter-spacing:3px;line-height:1;margin-bottom:20px;text-transform:uppercase}.dropdown__elements{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));max-height:800px;overflow-y:auto}.dropdown__brand-elements{-moz-column-count:3;column-count:3;max-height:800px}.dropdown__brand-element{cursor:pointer;margin-bottom:10px}.dropdown__element{flex-basis:33.33%;font-family:Martel Sans;font-size:14px;font-weight:400;margin-bottom:10px;text-transform:capitalize}.cover-spinner{align-items:center;background-color:hsla(0,0%,100%,.7);display:flex;height:100%;justify-content:center;min-height:400px;position:relative;top:50%;width:100%;z-index:9999}.cover-spinner:after{animation:spin 1.5s linear infinite;border:4px dotted #000;border-radius:50%;border-top-color:transparent;content:"";display:block;height:40px;position:absolute;width:40px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
|
package/build/bundle.js
CHANGED
|
@@ -13382,37 +13382,6 @@
|
|
|
13382
13382
|
};
|
|
13383
13383
|
|
|
13384
13384
|
const HookFormContext = React__default.createContext(null);
|
|
13385
|
-
/**
|
|
13386
|
-
* This custom hook allows you to access the form context. useFormContext is intended to be used in deeply nested structures, where it would become inconvenient to pass the context as a prop. To be used with {@link FormProvider}.
|
|
13387
|
-
*
|
|
13388
|
-
* @remarks
|
|
13389
|
-
* [API](https://react-hook-form.com/docs/useformcontext) • [Demo](https://codesandbox.io/s/react-hook-form-v7-form-context-ytudi)
|
|
13390
|
-
*
|
|
13391
|
-
* @returns return all useForm methods
|
|
13392
|
-
*
|
|
13393
|
-
* @example
|
|
13394
|
-
* ```tsx
|
|
13395
|
-
* function App() {
|
|
13396
|
-
* const methods = useForm();
|
|
13397
|
-
* const onSubmit = data => console.log(data);
|
|
13398
|
-
*
|
|
13399
|
-
* return (
|
|
13400
|
-
* <FormProvider {...methods} >
|
|
13401
|
-
* <form onSubmit={methods.handleSubmit(onSubmit)}>
|
|
13402
|
-
* <NestedInput />
|
|
13403
|
-
* <input type="submit" />
|
|
13404
|
-
* </form>
|
|
13405
|
-
* </FormProvider>
|
|
13406
|
-
* );
|
|
13407
|
-
* }
|
|
13408
|
-
*
|
|
13409
|
-
* function NestedInput() {
|
|
13410
|
-
* const { register } = useFormContext(); // retrieve all hook methods
|
|
13411
|
-
* return <input {...register("test")} />;
|
|
13412
|
-
* }
|
|
13413
|
-
* ```
|
|
13414
|
-
*/
|
|
13415
|
-
const useFormContext = () => React__default.useContext(HookFormContext);
|
|
13416
13385
|
|
|
13417
13386
|
var getProxyFormState = (formState, control, localProxyFormState, isRoot = true) => {
|
|
13418
13387
|
const result = {
|
|
@@ -13446,17 +13415,6 @@
|
|
|
13446
13415
|
|
|
13447
13416
|
var convertToArrayPayload = (value) => (Array.isArray(value) ? value : [value]);
|
|
13448
13417
|
|
|
13449
|
-
var shouldSubscribeByName = (name, signalName, exact) => exact && signalName
|
|
13450
|
-
? name === signalName ||
|
|
13451
|
-
(Array.isArray(name) &&
|
|
13452
|
-
name.some((currentName) => currentName && exact && currentName === signalName))
|
|
13453
|
-
: !name ||
|
|
13454
|
-
!signalName ||
|
|
13455
|
-
name === signalName ||
|
|
13456
|
-
convertToArrayPayload(name).some((currentName) => currentName &&
|
|
13457
|
-
(currentName.startsWith(signalName) ||
|
|
13458
|
-
signalName.startsWith(currentName)));
|
|
13459
|
-
|
|
13460
13418
|
function useSubscribe(props) {
|
|
13461
13419
|
const _props = React__default.useRef(props);
|
|
13462
13420
|
_props.current = props;
|
|
@@ -13472,73 +13430,6 @@
|
|
|
13472
13430
|
}, [props.disabled]);
|
|
13473
13431
|
}
|
|
13474
13432
|
|
|
13475
|
-
/**
|
|
13476
|
-
* This custom hook allows you to subscribe to each form state, and isolate the re-render at the custom hook level. It has its scope in terms of form state subscription, so it would not affect other useFormState and useForm. Using this hook can reduce the re-render impact on large and complex form application.
|
|
13477
|
-
*
|
|
13478
|
-
* @remarks
|
|
13479
|
-
* [API](https://react-hook-form.com/docs/useformstate) • [Demo](https://codesandbox.io/s/useformstate-75xly)
|
|
13480
|
-
*
|
|
13481
|
-
* @param props - include options on specify fields to subscribe. {@link UseFormStateReturn}
|
|
13482
|
-
*
|
|
13483
|
-
* @example
|
|
13484
|
-
* ```tsx
|
|
13485
|
-
* function App() {
|
|
13486
|
-
* const { register, handleSubmit, control } = useForm({
|
|
13487
|
-
* defaultValues: {
|
|
13488
|
-
* firstName: "firstName"
|
|
13489
|
-
* }});
|
|
13490
|
-
* const { dirtyFields } = useFormState({
|
|
13491
|
-
* control
|
|
13492
|
-
* });
|
|
13493
|
-
* const onSubmit = (data) => console.log(data);
|
|
13494
|
-
*
|
|
13495
|
-
* return (
|
|
13496
|
-
* <form onSubmit={handleSubmit(onSubmit)}>
|
|
13497
|
-
* <input {...register("firstName")} placeholder="First Name" />
|
|
13498
|
-
* {dirtyFields.firstName && <p>Field is dirty.</p>}
|
|
13499
|
-
* <input type="submit" />
|
|
13500
|
-
* </form>
|
|
13501
|
-
* );
|
|
13502
|
-
* }
|
|
13503
|
-
* ```
|
|
13504
|
-
*/
|
|
13505
|
-
function useFormState(props) {
|
|
13506
|
-
const methods = useFormContext();
|
|
13507
|
-
const { control = methods.control, disabled, name, exact } = props || {};
|
|
13508
|
-
const [formState, updateFormState] = React__default.useState(control._formState);
|
|
13509
|
-
const _mounted = React__default.useRef(true);
|
|
13510
|
-
const _localProxyFormState = React__default.useRef({
|
|
13511
|
-
isDirty: false,
|
|
13512
|
-
isLoading: false,
|
|
13513
|
-
dirtyFields: false,
|
|
13514
|
-
touchedFields: false,
|
|
13515
|
-
isValidating: false,
|
|
13516
|
-
isValid: false,
|
|
13517
|
-
errors: false,
|
|
13518
|
-
});
|
|
13519
|
-
const _name = React__default.useRef(name);
|
|
13520
|
-
_name.current = name;
|
|
13521
|
-
useSubscribe({
|
|
13522
|
-
disabled,
|
|
13523
|
-
next: (value) => _mounted.current &&
|
|
13524
|
-
shouldSubscribeByName(_name.current, value.name, exact) &&
|
|
13525
|
-
shouldRenderFormState(value, _localProxyFormState.current, control._updateFormState) &&
|
|
13526
|
-
updateFormState({
|
|
13527
|
-
...control._formState,
|
|
13528
|
-
...value,
|
|
13529
|
-
}),
|
|
13530
|
-
subject: control._subjects.state,
|
|
13531
|
-
});
|
|
13532
|
-
React__default.useEffect(() => {
|
|
13533
|
-
_mounted.current = true;
|
|
13534
|
-
_localProxyFormState.current.isValid && control._updateValid(true);
|
|
13535
|
-
return () => {
|
|
13536
|
-
_mounted.current = false;
|
|
13537
|
-
};
|
|
13538
|
-
}, [control]);
|
|
13539
|
-
return getProxyFormState(formState, control, _localProxyFormState.current, false);
|
|
13540
|
-
}
|
|
13541
|
-
|
|
13542
13433
|
var isString = (value) => typeof value === 'string';
|
|
13543
13434
|
|
|
13544
13435
|
var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) => {
|
|
@@ -13553,41 +13444,6 @@
|
|
|
13553
13444
|
return formValues;
|
|
13554
13445
|
};
|
|
13555
13446
|
|
|
13556
|
-
/**
|
|
13557
|
-
* Custom hook to subscribe to field change and isolate re-rendering at the component level.
|
|
13558
|
-
*
|
|
13559
|
-
* @remarks
|
|
13560
|
-
*
|
|
13561
|
-
* [API](https://react-hook-form.com/docs/usewatch) • [Demo](https://codesandbox.io/s/react-hook-form-v7-ts-usewatch-h9i5e)
|
|
13562
|
-
*
|
|
13563
|
-
* @example
|
|
13564
|
-
* ```tsx
|
|
13565
|
-
* const { watch } = useForm();
|
|
13566
|
-
* const values = useWatch({
|
|
13567
|
-
* name: "fieldName"
|
|
13568
|
-
* control,
|
|
13569
|
-
* })
|
|
13570
|
-
* ```
|
|
13571
|
-
*/
|
|
13572
|
-
function useWatch(props) {
|
|
13573
|
-
const methods = useFormContext();
|
|
13574
|
-
const { control = methods.control, name, defaultValue, disabled, exact, } = props || {};
|
|
13575
|
-
const _name = React__default.useRef(name);
|
|
13576
|
-
_name.current = name;
|
|
13577
|
-
useSubscribe({
|
|
13578
|
-
disabled,
|
|
13579
|
-
subject: control._subjects.values,
|
|
13580
|
-
next: (formState) => {
|
|
13581
|
-
if (shouldSubscribeByName(_name.current, formState.name, exact)) {
|
|
13582
|
-
updateValue(cloneObject(generateWatchOutput(_name.current, control._names, formState.values || control._formValues, false, defaultValue)));
|
|
13583
|
-
}
|
|
13584
|
-
},
|
|
13585
|
-
});
|
|
13586
|
-
const [value, updateValue] = React__default.useState(control._getWatch(name, defaultValue));
|
|
13587
|
-
React__default.useEffect(() => control._removeUnmounted());
|
|
13588
|
-
return value;
|
|
13589
|
-
}
|
|
13590
|
-
|
|
13591
13447
|
var isKey = (value) => /^\w*$/.test(value);
|
|
13592
13448
|
|
|
13593
13449
|
var stringToPath = (input) => compact(input.replace(/["|']|\]/g, '').split(/\.|\[/));
|
|
@@ -13615,133 +13471,6 @@
|
|
|
13615
13471
|
return object;
|
|
13616
13472
|
}
|
|
13617
13473
|
|
|
13618
|
-
/**
|
|
13619
|
-
* Custom hook to work with controlled component, this function provide you with both form and field level state. Re-render is isolated at the hook level.
|
|
13620
|
-
*
|
|
13621
|
-
* @remarks
|
|
13622
|
-
* [API](https://react-hook-form.com/docs/usecontroller) • [Demo](https://codesandbox.io/s/usecontroller-0o8px)
|
|
13623
|
-
*
|
|
13624
|
-
* @param props - the path name to the form field value, and validation rules.
|
|
13625
|
-
*
|
|
13626
|
-
* @returns field properties, field and form state. {@link UseControllerReturn}
|
|
13627
|
-
*
|
|
13628
|
-
* @example
|
|
13629
|
-
* ```tsx
|
|
13630
|
-
* function Input(props) {
|
|
13631
|
-
* const { field, fieldState, formState } = useController(props);
|
|
13632
|
-
* return (
|
|
13633
|
-
* <div>
|
|
13634
|
-
* <input {...field} placeholder={props.name} />
|
|
13635
|
-
* <p>{fieldState.isTouched && "Touched"}</p>
|
|
13636
|
-
* <p>{formState.isSubmitted ? "submitted" : ""}</p>
|
|
13637
|
-
* </div>
|
|
13638
|
-
* );
|
|
13639
|
-
* }
|
|
13640
|
-
* ```
|
|
13641
|
-
*/
|
|
13642
|
-
function useController(props) {
|
|
13643
|
-
const methods = useFormContext();
|
|
13644
|
-
const { name, disabled, control = methods.control, shouldUnregister } = props;
|
|
13645
|
-
const isArrayField = isNameInFieldArray(control._names.array, name);
|
|
13646
|
-
const value = useWatch({
|
|
13647
|
-
control,
|
|
13648
|
-
name,
|
|
13649
|
-
defaultValue: get(control._formValues, name, get(control._defaultValues, name, props.defaultValue)),
|
|
13650
|
-
exact: true,
|
|
13651
|
-
});
|
|
13652
|
-
const formState = useFormState({
|
|
13653
|
-
control,
|
|
13654
|
-
name,
|
|
13655
|
-
});
|
|
13656
|
-
const _registerProps = React__default.useRef(control.register(name, {
|
|
13657
|
-
...props.rules,
|
|
13658
|
-
value,
|
|
13659
|
-
}));
|
|
13660
|
-
_registerProps.current = control.register(name, props.rules);
|
|
13661
|
-
React__default.useEffect(() => {
|
|
13662
|
-
const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
|
|
13663
|
-
const updateMounted = (name, value) => {
|
|
13664
|
-
const field = get(control._fields, name);
|
|
13665
|
-
if (field) {
|
|
13666
|
-
field._f.mount = value;
|
|
13667
|
-
}
|
|
13668
|
-
};
|
|
13669
|
-
updateMounted(name, true);
|
|
13670
|
-
if (_shouldUnregisterField) {
|
|
13671
|
-
const value = cloneObject(get(control._options.defaultValues, name));
|
|
13672
|
-
set(control._defaultValues, name, value);
|
|
13673
|
-
if (isUndefined(get(control._formValues, name))) {
|
|
13674
|
-
set(control._formValues, name, value);
|
|
13675
|
-
}
|
|
13676
|
-
}
|
|
13677
|
-
return () => {
|
|
13678
|
-
(isArrayField
|
|
13679
|
-
? _shouldUnregisterField && !control._state.action
|
|
13680
|
-
: _shouldUnregisterField)
|
|
13681
|
-
? control.unregister(name)
|
|
13682
|
-
: updateMounted(name, false);
|
|
13683
|
-
};
|
|
13684
|
-
}, [name, control, isArrayField, shouldUnregister]);
|
|
13685
|
-
React__default.useEffect(() => {
|
|
13686
|
-
control._updateDisabledField({
|
|
13687
|
-
disabled,
|
|
13688
|
-
fields: control._fields,
|
|
13689
|
-
name,
|
|
13690
|
-
});
|
|
13691
|
-
}, [disabled, name, control]);
|
|
13692
|
-
return {
|
|
13693
|
-
field: {
|
|
13694
|
-
name,
|
|
13695
|
-
value,
|
|
13696
|
-
disabled,
|
|
13697
|
-
onChange: React__default.useCallback((event) => _registerProps.current.onChange({
|
|
13698
|
-
target: {
|
|
13699
|
-
value: getEventValue(event),
|
|
13700
|
-
name: name,
|
|
13701
|
-
},
|
|
13702
|
-
type: EVENTS.CHANGE,
|
|
13703
|
-
}), [name]),
|
|
13704
|
-
onBlur: React__default.useCallback(() => _registerProps.current.onBlur({
|
|
13705
|
-
target: {
|
|
13706
|
-
value: get(control._formValues, name),
|
|
13707
|
-
name: name,
|
|
13708
|
-
},
|
|
13709
|
-
type: EVENTS.BLUR,
|
|
13710
|
-
}), [name, control]),
|
|
13711
|
-
ref: (elm) => {
|
|
13712
|
-
const field = get(control._fields, name);
|
|
13713
|
-
if (field && elm) {
|
|
13714
|
-
field._f.ref = {
|
|
13715
|
-
focus: () => elm.focus(),
|
|
13716
|
-
select: () => elm.select(),
|
|
13717
|
-
setCustomValidity: (message) => elm.setCustomValidity(message),
|
|
13718
|
-
reportValidity: () => elm.reportValidity(),
|
|
13719
|
-
};
|
|
13720
|
-
}
|
|
13721
|
-
},
|
|
13722
|
-
},
|
|
13723
|
-
formState,
|
|
13724
|
-
fieldState: Object.defineProperties({}, {
|
|
13725
|
-
invalid: {
|
|
13726
|
-
enumerable: true,
|
|
13727
|
-
get: () => !!get(formState.errors, name),
|
|
13728
|
-
},
|
|
13729
|
-
isDirty: {
|
|
13730
|
-
enumerable: true,
|
|
13731
|
-
get: () => !!get(formState.dirtyFields, name),
|
|
13732
|
-
},
|
|
13733
|
-
isTouched: {
|
|
13734
|
-
enumerable: true,
|
|
13735
|
-
get: () => !!get(formState.touchedFields, name),
|
|
13736
|
-
},
|
|
13737
|
-
error: {
|
|
13738
|
-
enumerable: true,
|
|
13739
|
-
get: () => get(formState.errors, name),
|
|
13740
|
-
},
|
|
13741
|
-
}),
|
|
13742
|
-
};
|
|
13743
|
-
}
|
|
13744
|
-
|
|
13745
13474
|
var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => validateAllFieldCriteria
|
|
13746
13475
|
? {
|
|
13747
13476
|
...errors[name],
|
|
@@ -15283,190 +15012,8 @@
|
|
|
15283
15012
|
return _formControl.current;
|
|
15284
15013
|
}
|
|
15285
15014
|
|
|
15286
|
-
var
|
|
15287
|
-
|
|
15288
|
-
var _templateObject$V, _templateObject2$g;
|
|
15289
|
-
var OptionsRow = styled__default.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n"])));
|
|
15290
|
-
var Options = styled__default.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteral(["\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n flex-basis: 60%;\n"])));
|
|
15291
|
-
|
|
15292
|
-
var CommunicationPreferenceOptionsRenderer = function CommunicationPreferenceOptionsRenderer(_ref) {
|
|
15293
|
-
var control = _ref.control,
|
|
15294
|
-
name = _ref.name,
|
|
15295
|
-
isDisabled = _ref.isDisabled,
|
|
15296
|
-
options = _ref.options,
|
|
15297
|
-
defaultValue = _ref.defaultValue,
|
|
15298
|
-
setValue = _ref.setValue;
|
|
15299
|
-
|
|
15300
|
-
var _useController = useController({
|
|
15301
|
-
name: name,
|
|
15302
|
-
control: control,
|
|
15303
|
-
defaultValue: defaultValue
|
|
15304
|
-
}),
|
|
15305
|
-
_useController$field = _useController.field,
|
|
15306
|
-
ref = _useController$field.ref,
|
|
15307
|
-
inputProps = _objectWithoutProperties(_useController$field, _excluded$9),
|
|
15308
|
-
_useController$fieldS = _useController.fieldState,
|
|
15309
|
-
invalid = _useController$fieldS.invalid,
|
|
15310
|
-
error = _useController$fieldS.error;
|
|
15311
|
-
|
|
15312
|
-
React.useEffect(function () {
|
|
15313
|
-
if (defaultValue) {
|
|
15314
|
-
setValue(name, defaultValue);
|
|
15315
|
-
}
|
|
15316
|
-
}, [defaultValue, name, setValue]);
|
|
15317
|
-
return /*#__PURE__*/React__default.createElement(OptionsRow, null, /*#__PURE__*/React__default.createElement(Options, null, options.map(function (option) {
|
|
15318
|
-
return /*#__PURE__*/React__default.createElement(RadioButtonLabel, {
|
|
15319
|
-
key: option.value,
|
|
15320
|
-
htmlFor: option.value
|
|
15321
|
-
}, /*#__PURE__*/React__default.createElement(RadioButtonInput, _extends({
|
|
15322
|
-
id: option.value,
|
|
15323
|
-
ref: ref,
|
|
15324
|
-
type: "radio",
|
|
15325
|
-
name: name,
|
|
15326
|
-
defaultChecked: inputProps.value === option.value.toString()
|
|
15327
|
-
}, inputProps, {
|
|
15328
|
-
disabled: isDisabled,
|
|
15329
|
-
value: option.value
|
|
15330
|
-
})), /*#__PURE__*/React__default.createElement(RadioButtonCircle, null, /*#__PURE__*/React__default.createElement(RadioButtonCircleInner, null)), /*#__PURE__*/React__default.createElement(RadioButtonText, null, option.label));
|
|
15331
|
-
})), invalid && /*#__PURE__*/React__default.createElement("span", {
|
|
15332
|
-
className: "form__error"
|
|
15333
|
-
}, error === null || error === void 0 ? void 0 : error.message));
|
|
15334
|
-
};
|
|
15335
|
-
|
|
15336
|
-
var _templateObject$W, _templateObject2$h;
|
|
15337
|
-
var SectionContainer = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n border-top: flex 1px solid ", ";\n border-top-width: calc(100% - 50px);\n padding: 5px 10px;\n"])), function (props) {
|
|
15338
|
-
return props.theme.colors.primary;
|
|
15339
|
-
});
|
|
15340
|
-
var SectionHeading = styled__default.div(_templateObject2$h || (_templateObject2$h = _taggedTemplateLiteral(["\n padding: 5px 10px;\n"])));
|
|
15341
|
-
|
|
15342
|
-
var CommunicationPreferenceSection = function CommunicationPreferenceSection(_ref) {
|
|
15343
|
-
var section_heading = _ref.section_heading,
|
|
15344
|
-
description = _ref.description,
|
|
15345
|
-
control = _ref.control,
|
|
15346
|
-
name = _ref.name,
|
|
15347
|
-
isDisabled = _ref.isDisabled,
|
|
15348
|
-
options = _ref.options,
|
|
15349
|
-
defaultValue = _ref.defaultValue,
|
|
15350
|
-
setValue = _ref.setValue;
|
|
15351
|
-
return /*#__PURE__*/React__default.createElement(SectionContainer, null, /*#__PURE__*/React__default.createElement(SectionHeading, null, section_heading), /*#__PURE__*/React__default.createElement(CommunicationPreferenceOptionsRenderer, {
|
|
15352
|
-
description: description,
|
|
15353
|
-
control: control,
|
|
15354
|
-
name: name,
|
|
15355
|
-
isDisabled: isDisabled,
|
|
15356
|
-
options: options,
|
|
15357
|
-
defaultValue: defaultValue,
|
|
15358
|
-
setValue: setValue
|
|
15359
|
-
}));
|
|
15360
|
-
};
|
|
15361
|
-
|
|
15362
|
-
var CommunicationPreferenceSection$1 = themed(CommunicationPreferenceSection);
|
|
15363
|
-
|
|
15364
|
-
var _templateObject$X, _templateObject2$i, _templateObject3$9;
|
|
15365
|
-
var CommunicationPreferenceContainer = styled__default.div(_templateObject$X || (_templateObject$X = _taggedTemplateLiteral(["\n border: solid 1px #d1d5dbff;\n margin-bottom: 40px;\n"])));
|
|
15366
|
-
var EditButtonRow = styled__default.div(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteral(["\n display: flex;\n justify-content: end;\n padding: 10px 5px;\n margin-right: 16px;\n"])));
|
|
15367
|
-
var SubmitButton = styled__default.input(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteral(["\n flex-basis: 15%;\n margin-right: 5px;\n"])));
|
|
15368
|
-
var BaseRequest = {
|
|
15369
|
-
loading: false,
|
|
15370
|
-
success: false,
|
|
15371
|
-
failed: false
|
|
15372
|
-
};
|
|
15373
|
-
|
|
15374
|
-
var CommunicationPreferences = function CommunicationPreferences(_ref) {
|
|
15375
|
-
var header = _ref.header,
|
|
15376
|
-
requestInstance = _ref.requestInstance,
|
|
15377
|
-
updateNotificationsApi = _ref.updateNotificationsApi,
|
|
15378
|
-
preferenceData = _ref.preferenceData,
|
|
15379
|
-
btnClassName = _ref.btnClassName;
|
|
15380
|
-
|
|
15381
|
-
var _useForm = useForm(),
|
|
15382
|
-
handleSubmit = _useForm.handleSubmit,
|
|
15383
|
-
control = _useForm.control,
|
|
15384
|
-
setValue = _useForm.setValue;
|
|
15385
|
-
|
|
15386
|
-
var _useState = React.useState(_objectSpread2({}, BaseRequest)),
|
|
15387
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
15388
|
-
requestState = _useState2[0],
|
|
15389
|
-
setRequestState = _useState2[1];
|
|
15390
|
-
|
|
15391
|
-
var _useState3 = React.useState(false),
|
|
15392
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
15393
|
-
isEditing = _useState4[0],
|
|
15394
|
-
setIsEditing = _useState4[1]; //
|
|
15395
|
-
|
|
15396
|
-
|
|
15397
|
-
var communicationOptions = [{
|
|
15398
|
-
label: 'WhatsApp',
|
|
15399
|
-
value: 'WHATSAPP'
|
|
15400
|
-
}, {
|
|
15401
|
-
label: 'Email',
|
|
15402
|
-
value: 'EMAIL'
|
|
15403
|
-
}];
|
|
15404
|
-
|
|
15405
|
-
var updateRequestState = function updateRequestState(obj) {
|
|
15406
|
-
setRequestState(_objectSpread2(_objectSpread2({}, BaseRequest), obj));
|
|
15407
|
-
};
|
|
15408
|
-
|
|
15409
|
-
var onSubmit = function onSubmit(form_data) {
|
|
15410
|
-
updateRequestState({
|
|
15411
|
-
loading: true
|
|
15412
|
-
});
|
|
15413
|
-
simpleRequest(requestInstance, updateNotificationsApi, method.POST, form_data, function () {
|
|
15414
|
-
updateRequestState({
|
|
15415
|
-
success: true,
|
|
15416
|
-
loading: false
|
|
15417
|
-
});
|
|
15418
|
-
success('Communication Preferences Updated.');
|
|
15419
|
-
setTimeout(function () {
|
|
15420
|
-
window.location.reload();
|
|
15421
|
-
}, 2000);
|
|
15422
|
-
}, function (data) {
|
|
15423
|
-
updateRequestState({
|
|
15424
|
-
failed: true,
|
|
15425
|
-
loading: false
|
|
15426
|
-
});
|
|
15427
|
-
var errorMessages = Object.keys(data).map(function (key) {
|
|
15428
|
-
return data[key];
|
|
15429
|
-
}).flat();
|
|
15430
|
-
error(errorMessages.map(function (message, key) {
|
|
15431
|
-
return /*#__PURE__*/React__default.createElement("div", {
|
|
15432
|
-
key: "error-".concat(key)
|
|
15433
|
-
}, message);
|
|
15434
|
-
}));
|
|
15435
|
-
});
|
|
15436
|
-
};
|
|
15437
|
-
|
|
15438
|
-
return /*#__PURE__*/React__default.createElement(React.Fragment, null, requestState.loading && /*#__PURE__*/React__default.createElement(EllipsisLoader, null), header, /*#__PURE__*/React__default.createElement(CommunicationPreferenceContainer, null, /*#__PURE__*/React__default.createElement("form", {
|
|
15439
|
-
onSubmit: handleSubmit(onSubmit)
|
|
15440
|
-
}, /*#__PURE__*/React__default.createElement(CommunicationPreferenceSection$1, {
|
|
15441
|
-
control: control,
|
|
15442
|
-
name: "default_communication",
|
|
15443
|
-
options: communicationOptions,
|
|
15444
|
-
isDisabled: !isEditing,
|
|
15445
|
-
defaultValue: preferenceData.default_communication,
|
|
15446
|
-
setValue: setValue
|
|
15447
|
-
}), isEditing ? /*#__PURE__*/React__default.createElement(EditButtonRow, null, /*#__PURE__*/React__default.createElement(SubmitButton, {
|
|
15448
|
-
type: "submit",
|
|
15449
|
-
value: "Save",
|
|
15450
|
-
className: "".concat(btnClassName !== null && btnClassName !== void 0 ? btnClassName : 'btn--luxity')
|
|
15451
|
-
}), /*#__PURE__*/React__default.createElement("button", {
|
|
15452
|
-
type: "button",
|
|
15453
|
-
className: "".concat(btnClassName !== null && btnClassName !== void 0 ? btnClassName : 'btn--luxity'),
|
|
15454
|
-
onClick: function onClick() {
|
|
15455
|
-
setIsEditing(!isEditing);
|
|
15456
|
-
}
|
|
15457
|
-
}, "Cancel")) : /*#__PURE__*/React__default.createElement(EditButtonRow, null, /*#__PURE__*/React__default.createElement("button", {
|
|
15458
|
-
type: "button",
|
|
15459
|
-
className: "".concat(btnClassName !== null && btnClassName !== void 0 ? btnClassName : 'btn--luxity'),
|
|
15460
|
-
onClick: function onClick() {
|
|
15461
|
-
setIsEditing(!isEditing);
|
|
15462
|
-
}
|
|
15463
|
-
}, "Edit")))));
|
|
15464
|
-
};
|
|
15465
|
-
|
|
15466
|
-
var index$5 = themed(CommunicationPreferences);
|
|
15467
|
-
|
|
15468
|
-
var _templateObject$Y;
|
|
15469
|
-
var FooterWrapper$1 = styled__default.div(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n }\n"])), function (props) {
|
|
15015
|
+
var _templateObject$V;
|
|
15016
|
+
var FooterWrapper$1 = styled__default.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n {\n background-color: ", ";\n }\n"])), function (props) {
|
|
15470
15017
|
return props.theme.colors.gray;
|
|
15471
15018
|
});
|
|
15472
15019
|
|
|
@@ -15787,7 +15334,7 @@
|
|
|
15787
15334
|
}, "Copyright ", currentYear, " | Luxity (Pty) LTD | All Rights Reserved")));
|
|
15788
15335
|
};
|
|
15789
15336
|
|
|
15790
|
-
var index$
|
|
15337
|
+
var index$5 = themed(LuxityFooter);
|
|
15791
15338
|
|
|
15792
15339
|
var Dropdown$1 = function Dropdown(_ref) {
|
|
15793
15340
|
var title = _ref.title,
|
|
@@ -17937,7 +17484,6 @@
|
|
|
17937
17484
|
exports.Accordion = index;
|
|
17938
17485
|
exports.Checkbox = LuxityCheckbox;
|
|
17939
17486
|
exports.CheckboxFormWrapper = FormWrapper;
|
|
17940
|
-
exports.CommunicationPreferences = index$5;
|
|
17941
17487
|
exports.CountryCodeSelect = CountryCodeSelect;
|
|
17942
17488
|
exports.CurrencyInputFormatter = CurrencyInputFormatter;
|
|
17943
17489
|
exports.CurrencySelect = CurrencySelect;
|
|
@@ -17947,7 +17493,7 @@
|
|
|
17947
17493
|
exports.InvertedTextButton = InvertedTextButton$1;
|
|
17948
17494
|
exports.LuxityAppSideNav = LuxityAppSideNav;
|
|
17949
17495
|
exports.LuxityDesktopHeader = LuxityDesktopHeader;
|
|
17950
|
-
exports.LuxityFooter = index$
|
|
17496
|
+
exports.LuxityFooter = index$5;
|
|
17951
17497
|
exports.LuxityMobileHeader = LuxityMobileHeader;
|
|
17952
17498
|
exports.LuxityPageReady = LuxityPageReady;
|
|
17953
17499
|
exports.LuxitySideNav = LuxitySideNav;
|