@trafilea/afrodita-components 6.55.4 → 6.55.6
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/build/index.d.ts +2 -0
- package/build/index.esm.js +16 -14
- package/build/index.esm.js.map +1 -1
- package/build/index.js +16 -14
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.js
CHANGED
|
@@ -14999,7 +14999,9 @@ var transformStyle = function (_a) {
|
|
|
14999
14999
|
return opened
|
|
15000
15000
|
? css(templateObject_3$R || (templateObject_3$R = __makeTemplateObject(["\n transform: ", ";\n top: ", ";\n "], ["\n transform: ", ";\n top: ", ";\n "])), maxFullScreen ? 'translateY(0)' : 'translate(-50%, -50%)', maxFullScreen ? '0' : initialTop ? initialTop : '50%') : css(templateObject_4$G || (templateObject_4$G = __makeTemplateObject(["\n transform: ", ";\n top: ", ";\n "], ["\n transform: ", ";\n top: ", ";\n "])), maxFullScreen ? 'translateY(10%)' : 'translate(-50%, -40%)', maxFullScreen ? '0' : initialTop ? initialTop : '50%');
|
|
15001
15001
|
};
|
|
15002
|
-
var Container$T = newStyled.div(templateObject_6$s || (templateObject_6$s = __makeTemplateObject(["\n border: 1px solid var(--colors-pallete-primary-color);\n border-radius: ", ";\n padding: ", ";\n position: fixed;\n left: ", ";\n top: ", ";\n z-index: var(--zIndex-modal);\n background-color: var(--colors-background-color);\n transition: transform 0.3s, opacity 0.3s;\n overflow-y: auto;\n max-width: ", ";\n max-height: ", ";\n width: ", ";\n height: ", ";\n ", "\n ", "\n ", "\n"], ["\n border: 1px solid var(--colors-pallete-primary-color);\n border-radius: ", ";\n padding: ", ";\n position: fixed;\n left: ", ";\n top: ", ";\n z-index: var(--zIndex-modal);\n background-color: var(--colors-background-color);\n transition: transform 0.3s, opacity 0.3s;\n overflow-y: auto;\n max-width: ", ";\n max-height: ", ";\n width: ", ";\n height: ", ";\n ", "\n ", "\n ", "\n"])), function (props) {
|
|
15002
|
+
var Container$T = newStyled.div(templateObject_6$s || (templateObject_6$s = __makeTemplateObject(["\n border: 1px solid var(--colors-pallete-primary-color);\n border-radius: ", ";\n padding: ", ";\n position: fixed;\n left: ", ";\n top: ", ";\n z-index: var(--zIndex-modal);\n background-color: var(--colors-background-color);\n transition: transform 0.3s, opacity 0.3s;\n overflow-y: auto;\n max-width: ", ";\n max-height: ", ";\n width: ", ";\n height: ", ";\n ", "\n ", "\n ", "\n"], ["\n border: 1px solid var(--colors-pallete-primary-color);\n border-radius: ", ";\n padding: ", ";\n position: fixed;\n left: ", ";\n top: ", ";\n z-index: var(--zIndex-modal);\n background-color: var(--colors-background-color);\n transition: transform 0.3s, opacity 0.3s;\n overflow-y: auto;\n max-width: ", ";\n max-height: ", ";\n width: ", ";\n height: ", ";\n ", "\n ", "\n ", "\n"])), function (props) {
|
|
15003
|
+
return "".concat(props.maxFullScreen || props.countryRedirModalWithCoupon ? '0' : 'var(--radius-regular)');
|
|
15004
|
+
}, function (props) { return "".concat(props.padding ? props.padding : '20px 10px'); }, function (props) { return "".concat(props.maxFullScreen ? '0' : '50%'); }, function (props) { return (props.maxFullScreen ? '0' : props.initialTop ? props.initialTop : '50%'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : '90vw'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : '90vh'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : 'auto'); }, function (props) { return "".concat(props.maxFullScreen ? '100%' : 'inherit'); }, function (_a) {
|
|
15003
15005
|
var width = _a.width;
|
|
15004
15006
|
return width
|
|
15005
15007
|
? css(templateObject_5$x || (templateObject_5$x = __makeTemplateObject(["\n width: ", ";\n "], ["\n width: ", ";\n "])), width) : mediaQueries({
|
|
@@ -15008,15 +15010,15 @@ var Container$T = newStyled.div(templateObject_6$s || (templateObject_6$s = __ma
|
|
|
15008
15010
|
}, visibleStyle, transformStyle);
|
|
15009
15011
|
var Overlay = newStyled.div(templateObject_7$p || (templateObject_7$p = __makeTemplateObject(["\n position: fixed;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.75);\n z-index: var(--zIndex-overlay);\n transition: opacity 0.3s;\n ", "\n"], ["\n position: fixed;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.75);\n z-index: var(--zIndex-overlay);\n transition: opacity 0.3s;\n ", "\n"])), visibleStyle);
|
|
15010
15012
|
var Modal = function (_a) {
|
|
15011
|
-
var id = _a.id, children = _a.children, _b = _a.dismissable, dismissable = _b === void 0 ? true : _b, _c = _a.maxFullScreen, maxFullScreen = _c === void 0 ? false : _c, padding = _a.padding, onClickOverlayHandler = _a.onClickOverlayHandler, width = _a.width, _d = _a.initialTop, initialTop = _d === void 0 ? '50%' : _d;
|
|
15012
|
-
var
|
|
15013
|
+
var id = _a.id, children = _a.children, _b = _a.dismissable, dismissable = _b === void 0 ? true : _b, _c = _a.maxFullScreen, maxFullScreen = _c === void 0 ? false : _c, padding = _a.padding, onClickOverlayHandler = _a.onClickOverlayHandler, width = _a.width, _d = _a.initialTop, initialTop = _d === void 0 ? '50%' : _d, _e = _a.countryRedirModalWithCoupon, countryRedirModalWithCoupon = _e === void 0 ? false : _e;
|
|
15014
|
+
var _f = useModal(id), opened = _f.opened, close = _f.close;
|
|
15013
15015
|
var onDismiss = function () {
|
|
15014
15016
|
if (!dismissable) {
|
|
15015
15017
|
return;
|
|
15016
15018
|
}
|
|
15017
15019
|
close();
|
|
15018
15020
|
};
|
|
15019
|
-
return (jsxs(Portal, __assign$1({ id: id }, { children: [jsx(Container$T, __assign$1({ opened: opened, maxFullScreen: maxFullScreen, padding: padding, width: width, initialTop: initialTop }, { children: children }), void 0), jsx(Overlay, { "data-testid": "modal-overlay", opened: opened, onClick: function () {
|
|
15021
|
+
return (jsxs(Portal, __assign$1({ id: id }, { children: [jsx(Container$T, __assign$1({ opened: opened, maxFullScreen: maxFullScreen, padding: padding, width: width, initialTop: initialTop, countryRedirModalWithCoupon: countryRedirModalWithCoupon }, { children: children }), void 0), jsx(Overlay, { "data-testid": "modal-overlay", opened: opened, onClick: function () {
|
|
15020
15022
|
onClickOverlayHandler === null || onClickOverlayHandler === void 0 ? void 0 : onClickOverlayHandler();
|
|
15021
15023
|
onDismiss();
|
|
15022
15024
|
} }, void 0)] }), void 0));
|
|
@@ -21915,7 +21917,7 @@ var ContentGallery = function (_a) {
|
|
|
21915
21917
|
|
|
21916
21918
|
var NavButtonContainer$1 = newStyled.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n height: 40px;\n width: 40px;\n"], ["\n height: 40px;\n width: 40px;\n"])));
|
|
21917
21919
|
var Button$1 = newStyled.button(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n background: transparent;\n border: none;\n padding: 0.188rem 0.625rem;\n z-index: 5;\n height: 40px !important;\n cursor: pointer;\n"], ["\n background: transparent;\n border: none;\n padding: 0.188rem 0.625rem;\n z-index: 5;\n height: 40px !important;\n cursor: pointer;\n"])));
|
|
21918
|
-
var Container$8 = newStyled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n ", "\n position: relative;\n max-height: calc(100vh -
|
|
21920
|
+
var Container$8 = newStyled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n ", "\n position: relative;\n max-height: calc(100vh - 186px) !important;\n margin: 0 auto;\n max-width: 100%;\n overflow: hidden;\n\n @media screen and (min-width: 480px) {\n margin: 0 auto;\n }\n\n & .slick-dots li.slick-active button:before {\n background-color: ", ";\n }\n\n .iiz {\n max-width: 100%;\n margin: 0;\n position: relative;\n overflow: hidden;\n display: inline-block;\n cursor: -webkit-zoom-in;\n cursor: zoom-in;\n }\n\n .zoomWrapper.iiz {\n max-height: calc(100vh - 86px) !important;\n margin: 0 auto;\n vertical-align: top;\n }\n\n .iiz--drag .iiz__zoom-img--visible {\n cursor: -webkit-grab;\n cursor: grab;\n }\n\n .iiz__img {\n max-width: 100%;\n max-height: calc(100vh - 86px) !important;\n margin: 0 auto;\n display: block;\n pointer-events: none;\n visibility: visible;\n opacity: 1;\n }\n\n .iiz__img--hidden {\n visibility: hidden;\n opacity: 0;\n }\n\n .iiz__img--abs {\n width: 100%;\n max-height: calc(100vh - 86px) !important;\n position: absolute;\n top: 0;\n left: 0;\n display: block;\n }\n\n .iiz__zoom-img {\n width: auto !important;\n max-width: none !important;\n position: absolute;\n visibility: hidden;\n opacity: 0;\n pointer-events: none;\n display: block;\n }\n\n .iiz__zoom-img--visible {\n visibility: visible;\n opacity: 1;\n pointer-events: auto;\n cursor: -webkit-zoom-out;\n cursor: zoom-out;\n -ms-touch-action: none;\n touch-action: none;\n zoom: 1.2;\n }\n\n .iiz__zoom-portal {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 99999;\n }\n\n .iiz__btn {\n background: rgba(255, 255, 255, 0.8);\n max-width: 98px;\n min-width: fit-content;\n height: 32px;\n border: none;\n outline: none;\n padding: 0 8px;\n position: absolute;\n z-index: 5;\n text-decoration: none;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n }\n\n .iiz__btn:before {\n content: ' ';\n background-position: center;\n background-repeat: no-repeat;\n display: block;\n }\n\n .iiz__hint {\n bottom: 10%;\n right: 0;\n pointer-events: none;\n border-radius: 150px 0 0 150px;\n }\n\n .iiz__hint:before {\n content: '+';\n background-image: none;\n width: 17px;\n height: 17px;\n font-size: 19px;\n border-radius: 500px;\n border: 2px solid #292929;\n display: inline-block;\n position: relative;\n text-align: center;\n line-height: 17px;\n font-weight: 600;\n }\n\n .iiz__hint:after {\n content: 'Zoom in';\n font-size: 14px;\n font-weight: 600;\n display: inline-block;\n margin-left: 5px;\n }\n\n .iiz__close {\n border-radius: 150px;\n top: auto;\n right: 0;\n left: 0;\n margin: auto;\n bottom: 20px;\n visibility: hidden;\n opacity: 0;\n color: #292929;\n }\n\n .iiz__close--visible {\n visibility: visible;\n opacity: 1;\n cursor: pointer;\n }\n\n .iiz__close::before {\n content: ' ';\n width: 16px;\n height: 16px;\n background-image: -webkit-gradient(linear, left top, left bottom, from(#222), to(#222)),\n -webkit-gradient(linear, left top, left bottom, from(#222), to(#222));\n background-image: linear-gradient(#222, #222), linear-gradient(#222, #222);\n background-size: 65% 2px, 2px 65%;\n transform: rotate(45deg);\n border-radius: 500px;\n border: 2px solid #292929;\n }\n\n .iiz__close::after {\n content: 'Close';\n font-size: 14px;\n font-weight: 600;\n display: inline-block;\n margin-left: 5px;\n }\n"], ["\n ", "\n position: relative;\n max-height: calc(100vh - 186px) !important;\n margin: 0 auto;\n max-width: 100%;\n overflow: hidden;\n\n @media screen and (min-width: 480px) {\n margin: 0 auto;\n }\n\n & .slick-dots li.slick-active button:before {\n background-color: ", ";\n }\n\n .iiz {\n max-width: 100%;\n margin: 0;\n position: relative;\n overflow: hidden;\n display: inline-block;\n cursor: -webkit-zoom-in;\n cursor: zoom-in;\n }\n\n .zoomWrapper.iiz {\n max-height: calc(100vh - 86px) !important;\n margin: 0 auto;\n vertical-align: top;\n }\n\n .iiz--drag .iiz__zoom-img--visible {\n cursor: -webkit-grab;\n cursor: grab;\n }\n\n .iiz__img {\n max-width: 100%;\n max-height: calc(100vh - 86px) !important;\n margin: 0 auto;\n display: block;\n pointer-events: none;\n visibility: visible;\n opacity: 1;\n }\n\n .iiz__img--hidden {\n visibility: hidden;\n opacity: 0;\n }\n\n .iiz__img--abs {\n width: 100%;\n max-height: calc(100vh - 86px) !important;\n position: absolute;\n top: 0;\n left: 0;\n display: block;\n }\n\n .iiz__zoom-img {\n width: auto !important;\n max-width: none !important;\n position: absolute;\n visibility: hidden;\n opacity: 0;\n pointer-events: none;\n display: block;\n }\n\n .iiz__zoom-img--visible {\n visibility: visible;\n opacity: 1;\n pointer-events: auto;\n cursor: -webkit-zoom-out;\n cursor: zoom-out;\n -ms-touch-action: none;\n touch-action: none;\n zoom: 1.2;\n }\n\n .iiz__zoom-portal {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 99999;\n }\n\n .iiz__btn {\n background: rgba(255, 255, 255, 0.8);\n max-width: 98px;\n min-width: fit-content;\n height: 32px;\n border: none;\n outline: none;\n padding: 0 8px;\n position: absolute;\n z-index: 5;\n text-decoration: none;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n }\n\n .iiz__btn:before {\n content: ' ';\n background-position: center;\n background-repeat: no-repeat;\n display: block;\n }\n\n .iiz__hint {\n bottom: 10%;\n right: 0;\n pointer-events: none;\n border-radius: 150px 0 0 150px;\n }\n\n .iiz__hint:before {\n content: '+';\n background-image: none;\n width: 17px;\n height: 17px;\n font-size: 19px;\n border-radius: 500px;\n border: 2px solid #292929;\n display: inline-block;\n position: relative;\n text-align: center;\n line-height: 17px;\n font-weight: 600;\n }\n\n .iiz__hint:after {\n content: 'Zoom in';\n font-size: 14px;\n font-weight: 600;\n display: inline-block;\n margin-left: 5px;\n }\n\n .iiz__close {\n border-radius: 150px;\n top: auto;\n right: 0;\n left: 0;\n margin: auto;\n bottom: 20px;\n visibility: hidden;\n opacity: 0;\n color: #292929;\n }\n\n .iiz__close--visible {\n visibility: visible;\n opacity: 1;\n cursor: pointer;\n }\n\n .iiz__close::before {\n content: ' ';\n width: 16px;\n height: 16px;\n background-image: -webkit-gradient(linear, left top, left bottom, from(#222), to(#222)),\n -webkit-gradient(linear, left top, left bottom, from(#222), to(#222));\n background-image: linear-gradient(#222, #222), linear-gradient(#222, #222);\n background-size: 65% 2px, 2px 65%;\n transform: rotate(45deg);\n border-radius: 500px;\n border: 2px solid #292929;\n }\n\n .iiz__close::after {\n content: 'Close';\n font-size: 14px;\n font-weight: 600;\n display: inline-block;\n margin-left: 5px;\n }\n"])), function (_a) {
|
|
21919
21921
|
var borderRadiusVariant = _a.borderRadiusVariant;
|
|
21920
21922
|
return borderRadiusVariant &&
|
|
21921
21923
|
"\n border-radius: 40px;\n ";
|
|
@@ -22047,20 +22049,25 @@ var Slider = function (_a) {
|
|
|
22047
22049
|
|
|
22048
22050
|
var Container$6 = newStyled.div({
|
|
22049
22051
|
background: 'var(--truekind-default-secondary, #292929)',
|
|
22050
|
-
height: '
|
|
22052
|
+
height: '100vh',
|
|
22051
22053
|
width: '100vw',
|
|
22052
22054
|
position: 'fixed',
|
|
22053
22055
|
overflowY: 'scroll',
|
|
22054
22056
|
zIndex: '99999999999',
|
|
22055
22057
|
top: 0,
|
|
22056
22058
|
left: 0,
|
|
22059
|
+
bottom: 0,
|
|
22060
|
+
right: 0,
|
|
22057
22061
|
display: 'flex',
|
|
22058
22062
|
flexDirection: 'column',
|
|
22059
22063
|
justifyContent: 'center',
|
|
22064
|
+
alignItems: 'center',
|
|
22060
22065
|
});
|
|
22061
22066
|
var SubContainer = newStyled.div({
|
|
22067
|
+
width: '100%',
|
|
22062
22068
|
maxWidth: '480px',
|
|
22063
|
-
|
|
22069
|
+
maxHeight: '100%',
|
|
22070
|
+
overflow: 'hidden',
|
|
22064
22071
|
'@media screen and (min-width: 480px)': {
|
|
22065
22072
|
margin: '0 auto',
|
|
22066
22073
|
},
|
|
@@ -22070,9 +22077,6 @@ var SubContainer = newStyled.div({
|
|
|
22070
22077
|
'@media screen and (min-height: 740px)': {
|
|
22071
22078
|
marginTop: '0px',
|
|
22072
22079
|
},
|
|
22073
|
-
'@media screen and (-webkit-min-device-pixel-ratio:0)': {
|
|
22074
|
-
marginTop: '40px !important',
|
|
22075
|
-
},
|
|
22076
22080
|
'@media not all and (min-resolution:.001dpcm)': {
|
|
22077
22081
|
'@media': {
|
|
22078
22082
|
marginTop: '140px !important',
|
|
@@ -22090,15 +22094,13 @@ var SubContainer = newStyled.div({
|
|
|
22090
22094
|
},
|
|
22091
22095
|
});
|
|
22092
22096
|
var Header$2 = newStyled.div({
|
|
22097
|
+
margin: '0 0 0 auto',
|
|
22093
22098
|
display: 'flex',
|
|
22094
22099
|
justifyContent: 'end',
|
|
22095
22100
|
alignItems: 'center',
|
|
22096
22101
|
color: 'white',
|
|
22097
|
-
padding: '
|
|
22098
|
-
position: 'absolute',
|
|
22102
|
+
padding: '10px',
|
|
22099
22103
|
zIndex: 4,
|
|
22100
|
-
top: 0,
|
|
22101
|
-
right: 0,
|
|
22102
22104
|
});
|
|
22103
22105
|
var IconContainer = newStyled.div({
|
|
22104
22106
|
backgroundColor: '#E5E5E5',
|