@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.d.ts
CHANGED
|
@@ -3219,6 +3219,7 @@ declare type ModalProps = {
|
|
|
3219
3219
|
children: react__default.ReactNode;
|
|
3220
3220
|
width?: string;
|
|
3221
3221
|
initialTop?: string;
|
|
3222
|
+
countryRedirModalWithCoupon?: boolean;
|
|
3222
3223
|
};
|
|
3223
3224
|
interface ContainerProps {
|
|
3224
3225
|
maxFullScreen: boolean;
|
|
@@ -3226,6 +3227,7 @@ interface ContainerProps {
|
|
|
3226
3227
|
padding?: string;
|
|
3227
3228
|
width?: string;
|
|
3228
3229
|
initialTop?: string;
|
|
3230
|
+
countryRedirModalWithCoupon?: boolean;
|
|
3229
3231
|
}
|
|
3230
3232
|
declare const Overlay: _emotion_styled.StyledComponent<{
|
|
3231
3233
|
theme?: _emotion_react.Theme | undefined;
|
package/build/index.esm.js
CHANGED
|
@@ -14973,7 +14973,9 @@ var transformStyle = function (_a) {
|
|
|
14973
14973
|
return opened
|
|
14974
14974
|
? 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%');
|
|
14975
14975
|
};
|
|
14976
|
-
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) {
|
|
14976
|
+
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) {
|
|
14977
|
+
return "".concat(props.maxFullScreen || props.countryRedirModalWithCoupon ? '0' : 'var(--radius-regular)');
|
|
14978
|
+
}, 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) {
|
|
14977
14979
|
var width = _a.width;
|
|
14978
14980
|
return width
|
|
14979
14981
|
? css(templateObject_5$x || (templateObject_5$x = __makeTemplateObject(["\n width: ", ";\n "], ["\n width: ", ";\n "])), width) : mediaQueries({
|
|
@@ -14982,15 +14984,15 @@ var Container$T = newStyled.div(templateObject_6$s || (templateObject_6$s = __ma
|
|
|
14982
14984
|
}, visibleStyle, transformStyle);
|
|
14983
14985
|
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);
|
|
14984
14986
|
var Modal = function (_a) {
|
|
14985
|
-
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;
|
|
14986
|
-
var
|
|
14987
|
+
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;
|
|
14988
|
+
var _f = useModal(id), opened = _f.opened, close = _f.close;
|
|
14987
14989
|
var onDismiss = function () {
|
|
14988
14990
|
if (!dismissable) {
|
|
14989
14991
|
return;
|
|
14990
14992
|
}
|
|
14991
14993
|
close();
|
|
14992
14994
|
};
|
|
14993
|
-
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 () {
|
|
14995
|
+
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 () {
|
|
14994
14996
|
onClickOverlayHandler === null || onClickOverlayHandler === void 0 ? void 0 : onClickOverlayHandler();
|
|
14995
14997
|
onDismiss();
|
|
14996
14998
|
} }, void 0)] }), void 0));
|
|
@@ -21889,7 +21891,7 @@ var ContentGallery = function (_a) {
|
|
|
21889
21891
|
|
|
21890
21892
|
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"])));
|
|
21891
21893
|
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"])));
|
|
21892
|
-
var Container$8 = newStyled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n ", "\n position: relative;\n max-height: calc(100vh -
|
|
21894
|
+
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) {
|
|
21893
21895
|
var borderRadiusVariant = _a.borderRadiusVariant;
|
|
21894
21896
|
return borderRadiusVariant &&
|
|
21895
21897
|
"\n border-radius: 40px;\n ";
|
|
@@ -22021,20 +22023,25 @@ var Slider = function (_a) {
|
|
|
22021
22023
|
|
|
22022
22024
|
var Container$6 = newStyled.div({
|
|
22023
22025
|
background: 'var(--truekind-default-secondary, #292929)',
|
|
22024
|
-
height: '
|
|
22026
|
+
height: '100vh',
|
|
22025
22027
|
width: '100vw',
|
|
22026
22028
|
position: 'fixed',
|
|
22027
22029
|
overflowY: 'scroll',
|
|
22028
22030
|
zIndex: '99999999999',
|
|
22029
22031
|
top: 0,
|
|
22030
22032
|
left: 0,
|
|
22033
|
+
bottom: 0,
|
|
22034
|
+
right: 0,
|
|
22031
22035
|
display: 'flex',
|
|
22032
22036
|
flexDirection: 'column',
|
|
22033
22037
|
justifyContent: 'center',
|
|
22038
|
+
alignItems: 'center',
|
|
22034
22039
|
});
|
|
22035
22040
|
var SubContainer = newStyled.div({
|
|
22041
|
+
width: '100%',
|
|
22036
22042
|
maxWidth: '480px',
|
|
22037
|
-
|
|
22043
|
+
maxHeight: '100%',
|
|
22044
|
+
overflow: 'hidden',
|
|
22038
22045
|
'@media screen and (min-width: 480px)': {
|
|
22039
22046
|
margin: '0 auto',
|
|
22040
22047
|
},
|
|
@@ -22044,9 +22051,6 @@ var SubContainer = newStyled.div({
|
|
|
22044
22051
|
'@media screen and (min-height: 740px)': {
|
|
22045
22052
|
marginTop: '0px',
|
|
22046
22053
|
},
|
|
22047
|
-
'@media screen and (-webkit-min-device-pixel-ratio:0)': {
|
|
22048
|
-
marginTop: '40px !important',
|
|
22049
|
-
},
|
|
22050
22054
|
'@media not all and (min-resolution:.001dpcm)': {
|
|
22051
22055
|
'@media': {
|
|
22052
22056
|
marginTop: '140px !important',
|
|
@@ -22064,15 +22068,13 @@ var SubContainer = newStyled.div({
|
|
|
22064
22068
|
},
|
|
22065
22069
|
});
|
|
22066
22070
|
var Header$2 = newStyled.div({
|
|
22071
|
+
margin: '0 0 0 auto',
|
|
22067
22072
|
display: 'flex',
|
|
22068
22073
|
justifyContent: 'end',
|
|
22069
22074
|
alignItems: 'center',
|
|
22070
22075
|
color: 'white',
|
|
22071
|
-
padding: '
|
|
22072
|
-
position: 'absolute',
|
|
22076
|
+
padding: '10px',
|
|
22073
22077
|
zIndex: 4,
|
|
22074
|
-
top: 0,
|
|
22075
|
-
right: 0,
|
|
22076
22078
|
});
|
|
22077
22079
|
var IconContainer = newStyled.div({
|
|
22078
22080
|
backgroundColor: '#E5E5E5',
|