@trafilea/afrodita-components 6.28.5 → 6.28.7
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 +32 -14
- package/build/index.esm.js +67 -67
- package/build/index.js +67 -66
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.d.ts
CHANGED
|
@@ -122,6 +122,22 @@ declare type Props$1 = PriceLabelProps & {
|
|
|
122
122
|
};
|
|
123
123
|
declare const PriceLabelV3: React__default.FC<Props$1>;
|
|
124
124
|
|
|
125
|
+
declare type PriceLabelPropsV1 = PriceLabelProps & {
|
|
126
|
+
savingsDisplay?: boolean;
|
|
127
|
+
pricePerItem?: string;
|
|
128
|
+
hasRoundedSavings?: boolean;
|
|
129
|
+
isClubOffer?: boolean;
|
|
130
|
+
};
|
|
131
|
+
|
|
132
|
+
declare type ClubPriceLabelProps = PriceLabelPropsV1 & {
|
|
133
|
+
isClub: boolean;
|
|
134
|
+
isPDP?: boolean;
|
|
135
|
+
icon?: JSX.Element;
|
|
136
|
+
isCollections?: boolean;
|
|
137
|
+
};
|
|
138
|
+
|
|
139
|
+
declare function ClubPriceMemberLabel({ isClub, isPDP, icon, isCollections, ...rest }: ClubPriceLabelProps): JSX.Element;
|
|
140
|
+
|
|
125
141
|
declare type StyledIconProps = {
|
|
126
142
|
backgroundColor?: string;
|
|
127
143
|
opacity?: number | string;
|
|
@@ -2928,12 +2944,14 @@ declare type ModalProps = {
|
|
|
2928
2944
|
onClickOverlayHandler?: () => void;
|
|
2929
2945
|
children: React__default.ReactNode;
|
|
2930
2946
|
width?: string;
|
|
2947
|
+
initialTop?: string;
|
|
2931
2948
|
};
|
|
2932
2949
|
interface ContainerProps {
|
|
2933
2950
|
maxFullScreen: boolean;
|
|
2934
2951
|
opened?: boolean;
|
|
2935
2952
|
padding?: string;
|
|
2936
2953
|
width?: string;
|
|
2954
|
+
initialTop?: string;
|
|
2937
2955
|
}
|
|
2938
2956
|
declare const Overlay: _emotion_styled.StyledComponent<{
|
|
2939
2957
|
theme?: _emotion_react.Theme | undefined;
|
|
@@ -3599,6 +3617,19 @@ declare type TimerProps = Partial<TimeProps> & {
|
|
|
3599
3617
|
};
|
|
3600
3618
|
declare const Timer: React.FC<TimerProps>;
|
|
3601
3619
|
|
|
3620
|
+
interface ToastProps {
|
|
3621
|
+
severity: 'success' | 'error';
|
|
3622
|
+
summary: string;
|
|
3623
|
+
life?: number;
|
|
3624
|
+
withCloseIcon?: boolean;
|
|
3625
|
+
distanceFromTop?: string;
|
|
3626
|
+
ref: React__default.RefObject<HTMLElement>;
|
|
3627
|
+
}
|
|
3628
|
+
declare type ShowToast = {
|
|
3629
|
+
show: () => void;
|
|
3630
|
+
};
|
|
3631
|
+
declare const Toast: React__default.ForwardRefExoticComponent<Pick<ToastProps, "summary" | "severity" | "life" | "withCloseIcon" | "distanceFromTop"> & React__default.RefAttributes<ShowToast>>;
|
|
3632
|
+
|
|
3602
3633
|
interface TooltipProps {
|
|
3603
3634
|
children: React__default.ReactNode;
|
|
3604
3635
|
position: ComponentPosition;
|
|
@@ -3659,19 +3690,6 @@ declare const Totals: {
|
|
|
3659
3690
|
Subtotal: ({ subtotal, shipping, taxes, coupon, highlightColor, }: SubtotalProps) => JSX.Element;
|
|
3660
3691
|
};
|
|
3661
3692
|
|
|
3662
|
-
interface ToastProps {
|
|
3663
|
-
severity: 'success' | 'error';
|
|
3664
|
-
summary: string;
|
|
3665
|
-
life?: number;
|
|
3666
|
-
withCloseIcon?: boolean;
|
|
3667
|
-
distanceFromTop?: string;
|
|
3668
|
-
ref: React__default.RefObject<HTMLElement>;
|
|
3669
|
-
}
|
|
3670
|
-
declare type ShowToast = {
|
|
3671
|
-
show: () => void;
|
|
3672
|
-
};
|
|
3673
|
-
declare const Toast: React__default.ForwardRefExoticComponent<Pick<ToastProps, "summary" | "severity" | "life" | "withCloseIcon" | "distanceFromTop"> & React__default.RefAttributes<ShowToast>>;
|
|
3674
|
-
|
|
3675
3693
|
interface Checkpoint$1 {
|
|
3676
3694
|
day: string;
|
|
3677
3695
|
date: string;
|
|
@@ -3931,4 +3949,4 @@ declare type Partner = 'RevelBeauty' | 'TheSpaDr' | 'TheBodCon';
|
|
|
3931
3949
|
declare type PartnerContent = 'RevelBeauty-1' | 'RevelBeauty-2' | 'TheSpaDr-1' | 'TheSpaDr-2' | 'TheBodCon';
|
|
3932
3950
|
declare const CancellationFlowAccordionContentPerPartner: Record<Partner, JSX.Element[]>;
|
|
3933
3951
|
|
|
3934
|
-
export { AbsorbencyLevel, Accordion, AccordionOptions, AmazonButton, AssetsProvider, Autoship, AutoshipV2, BasicAccordion, BeforeAfterCard, BeforeAfterVariant, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, ButtonType, BuyNowPayLater, CTAProps, CancellationFlowAccordionContentPerPartner, _default as Card, CardSectionType, CartProductItem, CategorySquareTag, CategoryTag, Checkbox, ClubOfferSelector, ClubOfferTag, ClubRadioGroupInput, Collection, ColorPickerOption, ComponentPosition, ComponentSize, ContentType, CouponCard, index_d as CrossSell, DeliveryDetails, DeviceType, DiscountTag, Drawer, DropdownDialog, DropdownListIcons, DropdownListIconsItem, DropdownListIconsSubItem, DropdownOption, Filter, FilterChange, FilteringDropdown, Tags as FilteringTags, Filters, FitGuarantee, FitPredictor, HurryUp, HurryUpProps, Icon, IconButton, IconProps, IconWithOpacityProps, IconsWithTitle, Image, ImageCardWithDescription, ImageProps, Input, InputValidationType, JoinClubCard, Icon$1 as LibIcon, IconProps$1 as LibIconProps, Modal, MotivatorProgressBar, MultiColorPicker, Note, OfferBanner, OrderBar, Overlay, PackSelector, PackSelectorV2, Pagination, PaginatorBlog, Partner, PartnerContent, Pattern, PaymentMethod, PaypalButton, Portal, PriceLabel, PriceLabelV2, PriceLabelV3, ProductCard, ProductCardV2, ProductCardV3, ProductGallery, ProductGalleryMobile, ProductGalleryMobileV2, ProductGalleryMobileV3, ProductGalleryMobileV4, ProgressBar, QuantityPicker, RadioGroupInput, RadioGroupOption, RadioInput, RadioPrimary, Rating, Review, Review$1 as ReviewDetail, ReviewsHeader, ScrollToTop, SearchBar, SearchBarOptionItem, SearchNavigation, SeasonOfferTag, ShortBanner, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeChartTable, SizeChartTableV2, SizeDropdown, SizeFitGuide, SizeOption, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, SpinnerProps, StarList, StrengthBars, Tab, Tabs, Text, TextButton, TextWithImage, Theme, ThemeAssets, ThemeBasicPallete, ThemeBreakpoints, ThemeColorPallete, ThemeColors, ThemeComponent, ThemeFonts, ThemeProvider, ThemeProviderProps, ThemeTypography, ThemeVariables, Timer, Toast, Tooltip, Totals, TrackingProgress, TrackingProgressV2, Video, VideoProps, WithTestId, buildImageUrl, componentSizeMapper, decimalFormat, formatPrice, getSrcSet, imageVideoProps, isEmail, isEmpty, isNumber, isPhoneNumber, isValidDate, mediaQueries, modalEvent, SeasonOfferRoundedTag as seasonOfferRoundedTag, simulateMouseClick, sliceString, useDeviceType, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
|
|
3952
|
+
export { AbsorbencyLevel, Accordion, AccordionOptions, AmazonButton, AssetsProvider, Autoship, AutoshipV2, BasicAccordion, BeforeAfterCard, BeforeAfterVariant, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, ButtonType, BuyNowPayLater, CTAProps, CancellationFlowAccordionContentPerPartner, _default as Card, CardSectionType, CartProductItem, CategorySquareTag, CategoryTag, Checkbox, ClubOfferSelector, ClubOfferTag, ClubPriceMemberLabel, ClubRadioGroupInput, Collection, ColorPickerOption, ComponentPosition, ComponentSize, ContentType, CouponCard, index_d as CrossSell, DeliveryDetails, DeviceType, DiscountTag, Drawer, DropdownDialog, DropdownListIcons, DropdownListIconsItem, DropdownListIconsSubItem, DropdownOption, Filter, FilterChange, FilteringDropdown, Tags as FilteringTags, Filters, FitGuarantee, FitPredictor, HurryUp, HurryUpProps, Icon, IconButton, IconProps, IconWithOpacityProps, IconsWithTitle, Image, ImageCardWithDescription, ImageProps, Input, InputValidationType, JoinClubCard, Icon$1 as LibIcon, IconProps$1 as LibIconProps, Modal, MotivatorProgressBar, MultiColorPicker, Note, OfferBanner, OrderBar, Overlay, PackSelector, PackSelectorV2, Pagination, PaginatorBlog, Partner, PartnerContent, Pattern, PaymentMethod, PaypalButton, Portal, PriceLabel, PriceLabelV2, PriceLabelV3, ProductCard, ProductCardV2, ProductCardV3, ProductGallery, ProductGalleryMobile, ProductGalleryMobileV2, ProductGalleryMobileV3, ProductGalleryMobileV4, ProgressBar, QuantityPicker, RadioGroupInput, RadioGroupOption, RadioInput, RadioPrimary, Rating, Review, Review$1 as ReviewDetail, ReviewsHeader, ScrollToTop, SearchBar, SearchBarOptionItem, SearchNavigation, SeasonOfferTag, ShortBanner, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeChartTable, SizeChartTableV2, SizeDropdown, SizeFitGuide, SizeOption, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, SpinnerProps, StarList, StrengthBars, Tab, Tabs, Text, TextButton, TextWithImage, Theme, ThemeAssets, ThemeBasicPallete, ThemeBreakpoints, ThemeColorPallete, ThemeColors, ThemeComponent, ThemeFonts, ThemeProvider, ThemeProviderProps, ThemeTypography, ThemeVariables, Timer, Toast, Tooltip, Totals, TrackingProgress, TrackingProgressV2, Video, VideoProps, WithTestId, buildImageUrl, componentSizeMapper, decimalFormat, formatPrice, getSrcSet, imageVideoProps, isEmail, isEmpty, isNumber, isPhoneNumber, isValidDate, mediaQueries, modalEvent, SeasonOfferRoundedTag as seasonOfferRoundedTag, simulateMouseClick, sliceString, useDeviceType, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
|
package/build/index.esm.js
CHANGED
|
@@ -14811,28 +14811,28 @@ var visibleStyle = function (_a) {
|
|
|
14811
14811
|
? css(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n opacity: 1;\n pointer-events: all;\n "], ["\n opacity: 1;\n pointer-events: all;\n "]))) : css(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n opacity: 0;\n pointer-events: none;\n "], ["\n opacity: 0;\n pointer-events: none;\n "])));
|
|
14812
14812
|
};
|
|
14813
14813
|
var transformStyle = function (_a) {
|
|
14814
|
-
var opened = _a.opened, maxFullScreen = _a.maxFullScreen;
|
|
14814
|
+
var opened = _a.opened, maxFullScreen = _a.maxFullScreen, initialTop = _a.initialTop;
|
|
14815
14815
|
return opened
|
|
14816
|
-
? css(templateObject_3$v || (templateObject_3$v = __makeTemplateObject(["\n transform: ", ";\n "], ["\n transform: ", ";\n "])), maxFullScreen ? 'translateY(0)' : 'translate(-50%, -50%)') : css(templateObject_4$p || (templateObject_4$p = __makeTemplateObject(["\n transform: ", ";\n "], ["\n transform: ", ";\n "])), maxFullScreen ? 'translateY(10%)' : 'translate(-50%, -40%)');
|
|
14816
|
+
? css(templateObject_3$v || (templateObject_3$v = __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$p || (templateObject_4$p = __makeTemplateObject(["\n transform: ", ";\n top: ", ";\n "], ["\n transform: ", ";\n top: ", ";\n "])), maxFullScreen ? 'translateY(10%)' : 'translate(-50%, -40%)', maxFullScreen ? '0' : initialTop ? initialTop : '50%');
|
|
14817
14817
|
};
|
|
14818
|
-
var Container$z = newStyled.div(templateObject_6$g || (templateObject_6$g = __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) { return "".concat(props.maxFullScreen ? '0' : 'var(--radius-regular)'); }, function (props) { return "".concat(props.padding ? props.padding : '20px 10px'); }, function (props) { return "".concat(props.maxFullScreen ? '0' : '50%'); }, function (props) { return
|
|
14818
|
+
var Container$z = newStyled.div(templateObject_6$g || (templateObject_6$g = __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) { return "".concat(props.maxFullScreen ? '0' : 'var(--radius-regular)'); }, 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) {
|
|
14819
14819
|
var width = _a.width;
|
|
14820
14820
|
return width
|
|
14821
14821
|
? css(templateObject_5$i || (templateObject_5$i = __makeTemplateObject(["\n width: ", ";\n "], ["\n width: ", ";\n "])), width) : mediaQueries({
|
|
14822
14822
|
minWidth: ['90%', 'var(--component-modal-minWidth)'],
|
|
14823
14823
|
});
|
|
14824
14824
|
}, visibleStyle, transformStyle);
|
|
14825
|
-
var Overlay = newStyled.div(templateObject_7$e || (templateObject_7$e = __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
|
|
14825
|
+
var Overlay = newStyled.div(templateObject_7$e || (templateObject_7$e = __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);
|
|
14826
14826
|
var Modal = function (_a) {
|
|
14827
|
-
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;
|
|
14828
|
-
var
|
|
14827
|
+
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;
|
|
14828
|
+
var _e = useModal(id), opened = _e.opened, close = _e.close;
|
|
14829
14829
|
var onDismiss = function () {
|
|
14830
14830
|
if (!dismissable) {
|
|
14831
14831
|
return;
|
|
14832
14832
|
}
|
|
14833
14833
|
close();
|
|
14834
14834
|
};
|
|
14835
|
-
return (jsxs(Portal, __assign$1({ id: id }, { children: [jsx(Container$z, __assign$1({ opened: opened, maxFullScreen: maxFullScreen, padding: padding, width: width }, { children: children }), void 0), jsx(Overlay, { opened: opened, onClick: function () {
|
|
14835
|
+
return (jsxs(Portal, __assign$1({ id: id }, { children: [jsx(Container$z, __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 () {
|
|
14836
14836
|
onClickOverlayHandler === null || onClickOverlayHandler === void 0 ? void 0 : onClickOverlayHandler();
|
|
14837
14837
|
onDismiss();
|
|
14838
14838
|
} }, void 0)] }), void 0));
|
|
@@ -20067,9 +20067,56 @@ var Timer = function (_a) {
|
|
|
20067
20067
|
return (jsxs$1(TimerContainer$1, __assign$1({ "data-testid": "Time", timerColor: timerColor }, { children: [showHours && (hours || displayZeroValues) && "".concat(hours, "h "), (minutes || displayZeroValues) && "".concat(minutes, "m "), showSeconds && "".concat(seconds, "s")] }), void 0));
|
|
20068
20068
|
};
|
|
20069
20069
|
|
|
20070
|
-
var
|
|
20071
|
-
|
|
20072
|
-
|
|
20070
|
+
var slideInAnimation = function (distanceFromTop) {
|
|
20071
|
+
if (distanceFromTop === void 0) { distanceFromTop = '124px'; }
|
|
20072
|
+
return keyframes(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"], ["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"])), distanceFromTop);
|
|
20073
|
+
};
|
|
20074
|
+
var mobileSlideInAnimation = function (distanceFromTop) {
|
|
20075
|
+
if (distanceFromTop === void 0) { distanceFromTop = '85px'; }
|
|
20076
|
+
return keyframes(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"], ["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"])), distanceFromTop);
|
|
20077
|
+
};
|
|
20078
|
+
var ToastContainer = newStyled.div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n"], ["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n"])));
|
|
20079
|
+
var ToastContent = newStyled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n position: fixed;\n top: ", "; \n display: flex;\n align-items: center;\n gap: 10px;\n padding: 12px;\n border-radius: 8px;\n background: #fff;\n box-shadow: 0 6px 24px -6px rgba(0, 0, 0, 0.2);\n width: 730px;\n animation: ", " 0.5s ease;\n\n @media (max-width: 768px) {\n width: calc(100vw - 32px);\n top: ", ";\n min-width: auto;\n animation: ", " 0.5s ease;\n }\n"], ["\n position: fixed;\n top: ", "; \n display: flex;\n align-items: center;\n gap: 10px;\n padding: 12px;\n border-radius: 8px;\n background: #fff;\n box-shadow: 0 6px 24px -6px rgba(0, 0, 0, 0.2);\n width: 730px;\n animation: ", " 0.5s ease;\n\n @media (max-width: 768px) {\n width: calc(100vw - 32px);\n top: ", ";\n min-width: auto;\n animation: ", " 0.5s ease;\n }\n"])), function (_a) {
|
|
20080
|
+
var distanceFromTop = _a.distanceFromTop;
|
|
20081
|
+
return distanceFromTop || '124px';
|
|
20082
|
+
}, function (_a) {
|
|
20083
|
+
var distanceFromTop = _a.distanceFromTop;
|
|
20084
|
+
return slideInAnimation(distanceFromTop);
|
|
20085
|
+
}, function (_a) {
|
|
20086
|
+
var distanceFromTop = _a.distanceFromTop;
|
|
20087
|
+
return distanceFromTop || '85px';
|
|
20088
|
+
}, function (_a) {
|
|
20089
|
+
var distanceFromTop = _a.distanceFromTop;
|
|
20090
|
+
return mobileSlideInAnimation(distanceFromTop);
|
|
20091
|
+
});
|
|
20092
|
+
var ToastText = newStyled.p(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 500;\n line-height: 24px;\n margin: 0;\n color: ", ";\n\n @media (max-width: 768px) {\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n }\n"], ["\n font-size: 14px;\n font-weight: 500;\n line-height: 24px;\n margin: 0;\n color: ", ";\n\n @media (max-width: 768px) {\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n }\n"])), function (_a) {
|
|
20093
|
+
var severity = _a.severity;
|
|
20094
|
+
return severity === 'error' ? '#C64844' : '#292929';
|
|
20095
|
+
});
|
|
20096
|
+
var CloseIcon = newStyled.div(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n margin-inline-start: auto;\n cursor: pointer;\n"], ["\n margin-inline-start: auto;\n cursor: pointer;\n"])));
|
|
20097
|
+
var templateObject_1$e, templateObject_2$c, templateObject_3$b, templateObject_4$b, templateObject_5$a, templateObject_6$9;
|
|
20098
|
+
|
|
20099
|
+
var Toast = React__default.forwardRef(function (_a, ref) {
|
|
20100
|
+
var severity = _a.severity, summary = _a.summary, life = _a.life, _b = _a.withCloseIcon, withCloseIcon = _b === void 0 ? true : _b, distanceFromTop = _a.distanceFromTop;
|
|
20101
|
+
var _c = useState(false), isVisible = _c[0], setIsVisible = _c[1];
|
|
20102
|
+
useEffect(function () {
|
|
20103
|
+
if (isVisible) {
|
|
20104
|
+
var timeout_1 = setTimeout(function () {
|
|
20105
|
+
setIsVisible(false);
|
|
20106
|
+
}, life || 3000);
|
|
20107
|
+
return function () { return clearTimeout(timeout_1); };
|
|
20108
|
+
}
|
|
20109
|
+
}, [isVisible, life]);
|
|
20110
|
+
useImperativeHandle(ref, function () { return ({
|
|
20111
|
+
show: function () { return setIsVisible(true); },
|
|
20112
|
+
}); });
|
|
20113
|
+
return (jsx$1(ToastContainer, __assign$1({ "data-testid": "toast-container" }, { children: isVisible && (jsxs$1(ToastContent, __assign$1({ "data-testid": "toast-content", distanceFromTop: distanceFromTop }, { children: [severity === 'success' && (jsx$1(Icon.Actions.CircleSolidCheck, { height: "1.5rem", width: "1.5rem", fill: "#4CBEA4" }, void 0)), severity === 'error' && (jsx$1(Icon.Actions.CircleSolidWarning, { height: "1.5rem", width: "1.5rem", fill: "#C64844" }, void 0)), jsx$1(ToastText, __assign$1({ severity: severity }, { children: summary }), void 0), withCloseIcon && (jsx$1(CloseIcon, __assign$1({ role: "button", onClick: function () { return setIsVisible(false); }, "data-testid": "close-icon" }, { children: jsx$1(Icon.Actions.Close, { height: "1.1rem", width: "1.1rem", fill: "#5A5A5A" }, void 0) }), void 0))] }), void 0)) }), void 0));
|
|
20114
|
+
});
|
|
20115
|
+
Toast.displayName = 'Toast';
|
|
20116
|
+
|
|
20117
|
+
var Wrapper$1 = newStyled.div(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n"])));
|
|
20118
|
+
var GrandTotal = newStyled.h1(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n margin: 0;\n font-size: 1.5rem;\n line-height: 2rem;\n font-weight: 700;\n color: ", ";\n display: block;\n align-items: center;\n"], ["\n margin: 0;\n font-size: 1.5rem;\n line-height: 2rem;\n font-weight: 700;\n color: ", ";\n display: block;\n align-items: center;\n"])), function (props) { return props.color; });
|
|
20119
|
+
var Currency = newStyled.span(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n margin: 0;\n margin-right: 0.625rem;\n font-weight: 600;\n color: ", ";\n font-size: ", ";\n line-height: ", ";\n align-self: ", ";\n"], ["\n margin: 0;\n margin-right: 0.625rem;\n font-weight: 600;\n color: ", ";\n font-size: ", ";\n line-height: ", ";\n align-self: ", ";\n"])), function (_a) {
|
|
20073
20120
|
var theme = _a.theme;
|
|
20074
20121
|
return theme.component.total.basicTotal.currency.color;
|
|
20075
20122
|
}, function (_a) {
|
|
@@ -20082,21 +20129,21 @@ var Currency = newStyled.span(templateObject_3$b || (templateObject_3$b = __make
|
|
|
20082
20129
|
var theme = _a.theme;
|
|
20083
20130
|
return theme.component.total.basicTotal.currency.alignSelf;
|
|
20084
20131
|
});
|
|
20085
|
-
var Container$9 = newStyled.div(templateObject_4$
|
|
20132
|
+
var Container$9 = newStyled.div(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n width: 100%;\n margin-top: 0.625rem;\n color: ", ";\n align-items: center;\n"], ["\n display: flex;\n justify-content: space-between;\n width: 100%;\n margin-top: 0.625rem;\n color: ", ";\n align-items: center;\n"])), function (_a) {
|
|
20086
20133
|
var highlightColor = _a.highlightColor;
|
|
20087
20134
|
return highlightColor;
|
|
20088
20135
|
});
|
|
20089
|
-
var TotalContainer = newStyled(Container$9)(templateObject_5$
|
|
20136
|
+
var TotalContainer = newStyled(Container$9)(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n justify-content: ", ";\n margin-top: 0;\n"], ["\n justify-content: ", ";\n margin-top: 0;\n"])), function (_a) {
|
|
20090
20137
|
var showTotalLabel = _a.showTotalLabel;
|
|
20091
20138
|
return (showTotalLabel ? 'space-between' : 'flex-end');
|
|
20092
20139
|
});
|
|
20093
|
-
var DiscountText = newStyled.h3(templateObject_6$
|
|
20140
|
+
var DiscountText = newStyled.h3(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n margin: 0;\n font-size: 14px;\n line-height: 22px;\n font-weight: 600;\n"], ["\n margin: 0;\n font-size: 14px;\n line-height: 22px;\n font-weight: 600;\n"])));
|
|
20094
20141
|
var DiscountAmount = newStyled.h3(templateObject_7$8 || (templateObject_7$8 = __makeTemplateObject(["\n margin: 0;\n font-size: 18px;\n line-height: 28px;\n font-weight: ", ";\n"], ["\n margin: 0;\n font-size: 18px;\n line-height: 28px;\n font-weight: ", ";\n"])), function (_a) {
|
|
20095
20142
|
var theme = _a.theme;
|
|
20096
20143
|
return theme.component.total.basicTotal.savings.amountFontWeight;
|
|
20097
20144
|
});
|
|
20098
20145
|
var TotalLabel = newStyled(Text$7)(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n font-size: 20px;\n"], ["\n font-size: 20px;\n"])));
|
|
20099
|
-
var templateObject_1$
|
|
20146
|
+
var templateObject_1$d, templateObject_2$b, templateObject_3$a, templateObject_4$a, templateObject_5$9, templateObject_6$8, templateObject_7$8, templateObject_8$6;
|
|
20100
20147
|
|
|
20101
20148
|
var Total = function (_a) {
|
|
20102
20149
|
var total = _a.total, currency = _a.currency, saving = _a.saving, _b = _a.highlightColor, highlightColor = _b === void 0 ? '#2f806a' : _b, _c = _a.showTotalLabel, showTotalLabel = _c === void 0 ? false : _c;
|
|
@@ -20104,19 +20151,19 @@ var Total = function (_a) {
|
|
|
20104
20151
|
return (jsxs$1(Wrapper$1, __assign$1({ "data-testid": "total-wrapper" }, { children: [jsxs$1(TotalContainer, __assign$1({ showTotalLabel: showTotalLabel }, { children: [showTotalLabel && (jsx$1(TotalLabel, __assign$1({ variant: "heading6", size: "regular", weight: "bold" }, { children: "Total" }), void 0)), jsxs$1(GrandTotal, __assign$1({ color: theme.component.total.basicTotal.amount.color, "data-testid": "total-price" }, { children: [jsx$1(Currency, { children: currency }, void 0), total] }), void 0)] }), void 0), saving && (jsxs$1(Container$9, __assign$1({ "data-testid": "subtotal-container", highlightColor: highlightColor }, { children: [jsx$1(DiscountText, __assign$1({ "data-testid": "saving-title" }, { children: saving.savingText }), void 0), jsx$1(DiscountAmount, __assign$1({ "data-testid": "saving-price" }, { children: saving.amount }), void 0)] }), void 0))] }), void 0));
|
|
20105
20152
|
};
|
|
20106
20153
|
|
|
20107
|
-
var Wrapper = newStyled.div(templateObject_1$
|
|
20154
|
+
var Wrapper = newStyled.div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
|
|
20108
20155
|
var color = _a.color;
|
|
20109
20156
|
return color;
|
|
20110
20157
|
});
|
|
20111
|
-
var ItemContainer = newStyled.div(templateObject_2$
|
|
20112
|
-
var Item = newStyled.h4(templateObject_3$
|
|
20158
|
+
var ItemContainer = newStyled.div(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n margin-bottom: 0.625rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-bottom: 0.625rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"])));
|
|
20159
|
+
var Item = newStyled.h4(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n margin: 0;\n font-size: 0.875rem;\n line-height: ", ";\n font-weight: ", ";\n"], ["\n margin: 0;\n font-size: 0.875rem;\n line-height: ", ";\n font-weight: ", ";\n"])), function (_a) {
|
|
20113
20160
|
var theme = _a.theme;
|
|
20114
20161
|
return theme.component.subTotal.basicSubTotal.lineHeight;
|
|
20115
20162
|
}, function (_a) {
|
|
20116
20163
|
var theme = _a.theme;
|
|
20117
20164
|
return theme.component.subTotal.basicSubTotal.weight;
|
|
20118
20165
|
});
|
|
20119
|
-
var CouponItem = newStyled(Item)(templateObject_4$
|
|
20166
|
+
var CouponItem = newStyled(Item)(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
|
|
20120
20167
|
var color = _a.color;
|
|
20121
20168
|
return color;
|
|
20122
20169
|
});
|
|
@@ -20129,60 +20176,13 @@ var Subtotal = function (_a) {
|
|
|
20129
20176
|
return (jsxs$1(ItemContainer, { children: [jsxs$1(CouponItem, __assign$1({ color: highlightColor, "data-testid": "discount-title" }, { children: [coupon.couponText, " ", code, " ", coupon.appliedText] }), void 0), jsx$1(CouponItem, __assign$1({ color: highlightColor, "data-testid": "discount-price" }, { children: amount }), void 0)] }, code));
|
|
20130
20177
|
})] }), void 0));
|
|
20131
20178
|
};
|
|
20132
|
-
var templateObject_1$
|
|
20179
|
+
var templateObject_1$c, templateObject_2$a, templateObject_3$9, templateObject_4$9;
|
|
20133
20180
|
|
|
20134
20181
|
var Totals = {
|
|
20135
20182
|
Total: Total,
|
|
20136
20183
|
Subtotal: Subtotal,
|
|
20137
20184
|
};
|
|
20138
20185
|
|
|
20139
|
-
var slideInAnimation = function (distanceFromTop) {
|
|
20140
|
-
if (distanceFromTop === void 0) { distanceFromTop = '124px'; }
|
|
20141
|
-
return keyframes(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"], ["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"])), distanceFromTop);
|
|
20142
|
-
};
|
|
20143
|
-
var mobileSlideInAnimation = function (distanceFromTop) {
|
|
20144
|
-
if (distanceFromTop === void 0) { distanceFromTop = '85px'; }
|
|
20145
|
-
return keyframes(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"], ["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"])), distanceFromTop);
|
|
20146
|
-
};
|
|
20147
|
-
var ToastContainer = newStyled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n"], ["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n"])));
|
|
20148
|
-
var ToastContent = newStyled.div(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n position: fixed;\n top: ", "; \n display: flex;\n align-items: center;\n gap: 10px;\n padding: 12px;\n border-radius: 8px;\n background: #fff;\n box-shadow: 0 6px 24px -6px rgba(0, 0, 0, 0.2);\n width: 730px;\n animation: ", " 0.5s ease;\n\n @media (max-width: 768px) {\n width: calc(100vw - 32px);\n top: ", ";\n min-width: auto;\n animation: ", " 0.5s ease;\n }\n"], ["\n position: fixed;\n top: ", "; \n display: flex;\n align-items: center;\n gap: 10px;\n padding: 12px;\n border-radius: 8px;\n background: #fff;\n box-shadow: 0 6px 24px -6px rgba(0, 0, 0, 0.2);\n width: 730px;\n animation: ", " 0.5s ease;\n\n @media (max-width: 768px) {\n width: calc(100vw - 32px);\n top: ", ";\n min-width: auto;\n animation: ", " 0.5s ease;\n }\n"])), function (_a) {
|
|
20149
|
-
var distanceFromTop = _a.distanceFromTop;
|
|
20150
|
-
return distanceFromTop || '124px';
|
|
20151
|
-
}, function (_a) {
|
|
20152
|
-
var distanceFromTop = _a.distanceFromTop;
|
|
20153
|
-
return slideInAnimation(distanceFromTop);
|
|
20154
|
-
}, function (_a) {
|
|
20155
|
-
var distanceFromTop = _a.distanceFromTop;
|
|
20156
|
-
return distanceFromTop || '85px';
|
|
20157
|
-
}, function (_a) {
|
|
20158
|
-
var distanceFromTop = _a.distanceFromTop;
|
|
20159
|
-
return mobileSlideInAnimation(distanceFromTop);
|
|
20160
|
-
});
|
|
20161
|
-
var ToastText = newStyled.p(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 500;\n line-height: 24px;\n margin: 0;\n color: ", ";\n\n @media (max-width: 768px) {\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n }\n"], ["\n font-size: 14px;\n font-weight: 500;\n line-height: 24px;\n margin: 0;\n color: ", ";\n\n @media (max-width: 768px) {\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n }\n"])), function (_a) {
|
|
20162
|
-
var severity = _a.severity;
|
|
20163
|
-
return severity === 'error' ? '#C64844' : '#292929';
|
|
20164
|
-
});
|
|
20165
|
-
var CloseIcon = newStyled.div(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n margin-inline-start: auto;\n cursor: pointer;\n"], ["\n margin-inline-start: auto;\n cursor: pointer;\n"])));
|
|
20166
|
-
var templateObject_1$c, templateObject_2$a, templateObject_3$9, templateObject_4$9, templateObject_5$9, templateObject_6$8;
|
|
20167
|
-
|
|
20168
|
-
var Toast = React__default.forwardRef(function (_a, ref) {
|
|
20169
|
-
var severity = _a.severity, summary = _a.summary, life = _a.life, _b = _a.withCloseIcon, withCloseIcon = _b === void 0 ? true : _b, distanceFromTop = _a.distanceFromTop;
|
|
20170
|
-
var _c = useState(false), isVisible = _c[0], setIsVisible = _c[1];
|
|
20171
|
-
useEffect(function () {
|
|
20172
|
-
if (isVisible) {
|
|
20173
|
-
var timeout_1 = setTimeout(function () {
|
|
20174
|
-
setIsVisible(false);
|
|
20175
|
-
}, life || 3000);
|
|
20176
|
-
return function () { return clearTimeout(timeout_1); };
|
|
20177
|
-
}
|
|
20178
|
-
}, [isVisible, life]);
|
|
20179
|
-
useImperativeHandle(ref, function () { return ({
|
|
20180
|
-
show: function () { return setIsVisible(true); },
|
|
20181
|
-
}); });
|
|
20182
|
-
return (jsx$1(ToastContainer, __assign$1({ "data-testid": "toast-container" }, { children: isVisible && (jsxs$1(ToastContent, __assign$1({ "data-testid": "toast-content", distanceFromTop: distanceFromTop }, { children: [severity === 'success' && (jsx$1(Icon.Actions.CircleSolidCheck, { height: "1.5rem", width: "1.5rem", fill: "#4CBEA4" }, void 0)), severity === 'error' && (jsx$1(Icon.Actions.CircleSolidWarning, { height: "1.5rem", width: "1.5rem", fill: "#C64844" }, void 0)), jsx$1(ToastText, __assign$1({ severity: severity }, { children: summary }), void 0), withCloseIcon && (jsx$1(CloseIcon, __assign$1({ role: "button", onClick: function () { return setIsVisible(false); }, "data-testid": "close-icon" }, { children: jsx$1(Icon.Actions.Close, { height: "1.1rem", width: "1.1rem", fill: "#5A5A5A" }, void 0) }), void 0))] }), void 0)) }), void 0));
|
|
20183
|
-
});
|
|
20184
|
-
Toast.displayName = 'Toast';
|
|
20185
|
-
|
|
20186
20186
|
var Container$8 = newStyled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
20187
20187
|
var CheckpointContainer$1 = newStyled.div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
20188
20188
|
var CheckpointDate$1 = newStyled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n display: flex;\n justify-content: flex-start;\n flex-direction: column;\n padding-bottom: ", ";\n width: 60px;\n min-width: 60px;\n margin-right: 10px;\n"], ["\n display: flex;\n justify-content: flex-start;\n flex-direction: column;\n padding-bottom: ", ";\n width: 60px;\n min-width: 60px;\n margin-right: 10px;\n"])), function (props) { return props.currentSpace; });
|
|
@@ -20903,5 +20903,5 @@ var SizeChartTableV2 = function (_a) {
|
|
|
20903
20903
|
}, borderColor: theme.colors.shades['100'].color }, { children: cell }), index)); }) }, index)); }) }, void 0)) : (jsx$1("tbody", { children: tableContent === null || tableContent === void 0 ? void 0 : tableContent.map(function (row, index) { return (jsx$1(TableRow, __assign$1({ className: getIsOdd(index) ? 'background' : '', backgroundColor: theme.colors.shades['10'].color }, { children: row === null || row === void 0 ? void 0 : row.map(function (cell, index) { return (jsx$1(TableCell, __assign$1({ borderColor: theme.colors.shades['100'].color }, { children: cell }), index)); }) }), index)); }) }, void 0))] }), void 0) }, void 0)] }, void 0)] }, void 0));
|
|
20904
20904
|
};
|
|
20905
20905
|
|
|
20906
|
-
export { AbsorbencyLevel, Accordion$1 as Accordion, AccordionOptions, AmazonButton, AssetsProvider, Autoship, AutoshipV2, BasicAccordion, BeforeAfterCard, BeforeAfterVariant, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, BuyNowPayLater, CancellationFlowAccordionContentPerPartner, Card$3 as Card, CardSectionType, CartProductItem, CategorySquareTag, CategoryTag, Checkbox, ClubOfferSelector, ClubOfferTag, ClubRadioGroupInput, Collection, ComponentPosition, ComponentSize, CouponCard, index$1 as CrossSell, DeliveryDetails, DiscountTag$2 as DiscountTag, Drawer, DropdownDialog, DropdownListIcons, FilteringDropdown, Tags as FilteringTags, Filters, FitGuarantee, FitPredictor, Global, HurryUp, Icon, IconButton, IconsWithTitle, Image$3 as Image, ImageCardWithDescription, Input$3 as Input, InputValidationType, JoinClubCard, Icon$1 as LibIcon, Modal, MotivatorProgressBar, MultiColorPicker, Note, OfferBanner, OrderBar, Overlay, PackSelector, PackSelectorV2, Pagination, PaginatorBlog, PaymentMethod, PaypalButton, Portal, PriceLabel$1 as PriceLabel, PriceLabelV2$1 as PriceLabelV2, PriceLabelV3, ProductCard, ProductCardV2, ProductCardV3, ProductGallery, ProductGalleryMobile, ProductGalleryMobileV2, ProductGalleryMobileV3, ProductGalleryMobileV4, ProgressBar, QuantityPicker, RadioGroupInput, RadioInput, RadioPrimary, Rating, Review, Review$1 as ReviewDetail, ReviewsHeader, ScrollToTop, SearchBar, SearchNavigation, SeasonOfferTag, ShortBanner, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeChartTable, SizeChartTableV2, SizeDropdown, SizeFitGuide, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, StrengthBars, Tab, Tabs, Text$7 as Text, TextButton, TextWithImage, ThemeProvider, ThemeVariables, Timer, Toast, Tooltip, Totals, TrackingProgress, TrackingProgressV2, Video$1 as Video, buildImageUrl, componentSizeMapper, css, decimalFormat, formatPrice, getSrcSet, isEmail, isEmpty, isNumber$1 as isNumber, isPhoneNumber, isValidDate, mediaQueries, modalEvent, SeasonOfferRoundedTag as seasonOfferRoundedTag, simulateMouseClick, sliceString, newStyled as styled, useDeviceType, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
|
|
20906
|
+
export { AbsorbencyLevel, Accordion$1 as Accordion, AccordionOptions, AmazonButton, AssetsProvider, Autoship, AutoshipV2, BasicAccordion, BeforeAfterCard, BeforeAfterVariant, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, BuyNowPayLater, CancellationFlowAccordionContentPerPartner, Card$3 as Card, CardSectionType, CartProductItem, CategorySquareTag, CategoryTag, Checkbox, ClubOfferSelector, ClubOfferTag, ClubPriceMemberLabel, ClubRadioGroupInput, Collection, ComponentPosition, ComponentSize, CouponCard, index$1 as CrossSell, DeliveryDetails, DiscountTag$2 as DiscountTag, Drawer, DropdownDialog, DropdownListIcons, FilteringDropdown, Tags as FilteringTags, Filters, FitGuarantee, FitPredictor, Global, HurryUp, Icon, IconButton, IconsWithTitle, Image$3 as Image, ImageCardWithDescription, Input$3 as Input, InputValidationType, JoinClubCard, Icon$1 as LibIcon, Modal, MotivatorProgressBar, MultiColorPicker, Note, OfferBanner, OrderBar, Overlay, PackSelector, PackSelectorV2, Pagination, PaginatorBlog, PaymentMethod, PaypalButton, Portal, PriceLabel$1 as PriceLabel, PriceLabelV2$1 as PriceLabelV2, PriceLabelV3, ProductCard, ProductCardV2, ProductCardV3, ProductGallery, ProductGalleryMobile, ProductGalleryMobileV2, ProductGalleryMobileV3, ProductGalleryMobileV4, ProgressBar, QuantityPicker, RadioGroupInput, RadioInput, RadioPrimary, Rating, Review, Review$1 as ReviewDetail, ReviewsHeader, ScrollToTop, SearchBar, SearchNavigation, SeasonOfferTag, ShortBanner, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeChartTable, SizeChartTableV2, SizeDropdown, SizeFitGuide, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, StrengthBars, Tab, Tabs, Text$7 as Text, TextButton, TextWithImage, ThemeProvider, ThemeVariables, Timer, Toast, Tooltip, Totals, TrackingProgress, TrackingProgressV2, Video$1 as Video, buildImageUrl, componentSizeMapper, css, decimalFormat, formatPrice, getSrcSet, isEmail, isEmpty, isNumber$1 as isNumber, isPhoneNumber, isValidDate, mediaQueries, modalEvent, SeasonOfferRoundedTag as seasonOfferRoundedTag, simulateMouseClick, sliceString, newStyled as styled, useDeviceType, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
|
|
20907
20907
|
//# sourceMappingURL=index.esm.js.map
|
package/build/index.js
CHANGED
|
@@ -14837,28 +14837,28 @@ var visibleStyle = function (_a) {
|
|
|
14837
14837
|
? css(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n opacity: 1;\n pointer-events: all;\n "], ["\n opacity: 1;\n pointer-events: all;\n "]))) : css(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n opacity: 0;\n pointer-events: none;\n "], ["\n opacity: 0;\n pointer-events: none;\n "])));
|
|
14838
14838
|
};
|
|
14839
14839
|
var transformStyle = function (_a) {
|
|
14840
|
-
var opened = _a.opened, maxFullScreen = _a.maxFullScreen;
|
|
14840
|
+
var opened = _a.opened, maxFullScreen = _a.maxFullScreen, initialTop = _a.initialTop;
|
|
14841
14841
|
return opened
|
|
14842
|
-
? css(templateObject_3$v || (templateObject_3$v = __makeTemplateObject(["\n transform: ", ";\n "], ["\n transform: ", ";\n "])), maxFullScreen ? 'translateY(0)' : 'translate(-50%, -50%)') : css(templateObject_4$p || (templateObject_4$p = __makeTemplateObject(["\n transform: ", ";\n "], ["\n transform: ", ";\n "])), maxFullScreen ? 'translateY(10%)' : 'translate(-50%, -40%)');
|
|
14842
|
+
? css(templateObject_3$v || (templateObject_3$v = __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$p || (templateObject_4$p = __makeTemplateObject(["\n transform: ", ";\n top: ", ";\n "], ["\n transform: ", ";\n top: ", ";\n "])), maxFullScreen ? 'translateY(10%)' : 'translate(-50%, -40%)', maxFullScreen ? '0' : initialTop ? initialTop : '50%');
|
|
14843
14843
|
};
|
|
14844
|
-
var Container$z = newStyled.div(templateObject_6$g || (templateObject_6$g = __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) { return "".concat(props.maxFullScreen ? '0' : 'var(--radius-regular)'); }, function (props) { return "".concat(props.padding ? props.padding : '20px 10px'); }, function (props) { return "".concat(props.maxFullScreen ? '0' : '50%'); }, function (props) { return
|
|
14844
|
+
var Container$z = newStyled.div(templateObject_6$g || (templateObject_6$g = __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) { return "".concat(props.maxFullScreen ? '0' : 'var(--radius-regular)'); }, 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) {
|
|
14845
14845
|
var width = _a.width;
|
|
14846
14846
|
return width
|
|
14847
14847
|
? css(templateObject_5$i || (templateObject_5$i = __makeTemplateObject(["\n width: ", ";\n "], ["\n width: ", ";\n "])), width) : mediaQueries({
|
|
14848
14848
|
minWidth: ['90%', 'var(--component-modal-minWidth)'],
|
|
14849
14849
|
});
|
|
14850
14850
|
}, visibleStyle, transformStyle);
|
|
14851
|
-
var Overlay = newStyled.div(templateObject_7$e || (templateObject_7$e = __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
|
|
14851
|
+
var Overlay = newStyled.div(templateObject_7$e || (templateObject_7$e = __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);
|
|
14852
14852
|
var Modal = function (_a) {
|
|
14853
|
-
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;
|
|
14854
|
-
var
|
|
14853
|
+
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;
|
|
14854
|
+
var _e = useModal(id), opened = _e.opened, close = _e.close;
|
|
14855
14855
|
var onDismiss = function () {
|
|
14856
14856
|
if (!dismissable) {
|
|
14857
14857
|
return;
|
|
14858
14858
|
}
|
|
14859
14859
|
close();
|
|
14860
14860
|
};
|
|
14861
|
-
return (jsxs(Portal, __assign$1({ id: id }, { children: [jsx(Container$z, __assign$1({ opened: opened, maxFullScreen: maxFullScreen, padding: padding, width: width }, { children: children }), void 0), jsx(Overlay, { opened: opened, onClick: function () {
|
|
14861
|
+
return (jsxs(Portal, __assign$1({ id: id }, { children: [jsx(Container$z, __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 () {
|
|
14862
14862
|
onClickOverlayHandler === null || onClickOverlayHandler === void 0 ? void 0 : onClickOverlayHandler();
|
|
14863
14863
|
onDismiss();
|
|
14864
14864
|
} }, void 0)] }), void 0));
|
|
@@ -20093,9 +20093,56 @@ var Timer = function (_a) {
|
|
|
20093
20093
|
return (jsxRuntime.jsxs(TimerContainer$1, __assign$1({ "data-testid": "Time", timerColor: timerColor }, { children: [showHours && (hours || displayZeroValues) && "".concat(hours, "h "), (minutes || displayZeroValues) && "".concat(minutes, "m "), showSeconds && "".concat(seconds, "s")] }), void 0));
|
|
20094
20094
|
};
|
|
20095
20095
|
|
|
20096
|
-
var
|
|
20097
|
-
|
|
20098
|
-
|
|
20096
|
+
var slideInAnimation = function (distanceFromTop) {
|
|
20097
|
+
if (distanceFromTop === void 0) { distanceFromTop = '124px'; }
|
|
20098
|
+
return keyframes(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"], ["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"])), distanceFromTop);
|
|
20099
|
+
};
|
|
20100
|
+
var mobileSlideInAnimation = function (distanceFromTop) {
|
|
20101
|
+
if (distanceFromTop === void 0) { distanceFromTop = '85px'; }
|
|
20102
|
+
return keyframes(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"], ["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"])), distanceFromTop);
|
|
20103
|
+
};
|
|
20104
|
+
var ToastContainer = newStyled.div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n"], ["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n"])));
|
|
20105
|
+
var ToastContent = newStyled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n position: fixed;\n top: ", "; \n display: flex;\n align-items: center;\n gap: 10px;\n padding: 12px;\n border-radius: 8px;\n background: #fff;\n box-shadow: 0 6px 24px -6px rgba(0, 0, 0, 0.2);\n width: 730px;\n animation: ", " 0.5s ease;\n\n @media (max-width: 768px) {\n width: calc(100vw - 32px);\n top: ", ";\n min-width: auto;\n animation: ", " 0.5s ease;\n }\n"], ["\n position: fixed;\n top: ", "; \n display: flex;\n align-items: center;\n gap: 10px;\n padding: 12px;\n border-radius: 8px;\n background: #fff;\n box-shadow: 0 6px 24px -6px rgba(0, 0, 0, 0.2);\n width: 730px;\n animation: ", " 0.5s ease;\n\n @media (max-width: 768px) {\n width: calc(100vw - 32px);\n top: ", ";\n min-width: auto;\n animation: ", " 0.5s ease;\n }\n"])), function (_a) {
|
|
20106
|
+
var distanceFromTop = _a.distanceFromTop;
|
|
20107
|
+
return distanceFromTop || '124px';
|
|
20108
|
+
}, function (_a) {
|
|
20109
|
+
var distanceFromTop = _a.distanceFromTop;
|
|
20110
|
+
return slideInAnimation(distanceFromTop);
|
|
20111
|
+
}, function (_a) {
|
|
20112
|
+
var distanceFromTop = _a.distanceFromTop;
|
|
20113
|
+
return distanceFromTop || '85px';
|
|
20114
|
+
}, function (_a) {
|
|
20115
|
+
var distanceFromTop = _a.distanceFromTop;
|
|
20116
|
+
return mobileSlideInAnimation(distanceFromTop);
|
|
20117
|
+
});
|
|
20118
|
+
var ToastText = newStyled.p(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 500;\n line-height: 24px;\n margin: 0;\n color: ", ";\n\n @media (max-width: 768px) {\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n }\n"], ["\n font-size: 14px;\n font-weight: 500;\n line-height: 24px;\n margin: 0;\n color: ", ";\n\n @media (max-width: 768px) {\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n }\n"])), function (_a) {
|
|
20119
|
+
var severity = _a.severity;
|
|
20120
|
+
return severity === 'error' ? '#C64844' : '#292929';
|
|
20121
|
+
});
|
|
20122
|
+
var CloseIcon = newStyled.div(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n margin-inline-start: auto;\n cursor: pointer;\n"], ["\n margin-inline-start: auto;\n cursor: pointer;\n"])));
|
|
20123
|
+
var templateObject_1$e, templateObject_2$c, templateObject_3$b, templateObject_4$b, templateObject_5$a, templateObject_6$9;
|
|
20124
|
+
|
|
20125
|
+
var Toast = React__default["default"].forwardRef(function (_a, ref) {
|
|
20126
|
+
var severity = _a.severity, summary = _a.summary, life = _a.life, _b = _a.withCloseIcon, withCloseIcon = _b === void 0 ? true : _b, distanceFromTop = _a.distanceFromTop;
|
|
20127
|
+
var _c = React$2.useState(false), isVisible = _c[0], setIsVisible = _c[1];
|
|
20128
|
+
React$2.useEffect(function () {
|
|
20129
|
+
if (isVisible) {
|
|
20130
|
+
var timeout_1 = setTimeout(function () {
|
|
20131
|
+
setIsVisible(false);
|
|
20132
|
+
}, life || 3000);
|
|
20133
|
+
return function () { return clearTimeout(timeout_1); };
|
|
20134
|
+
}
|
|
20135
|
+
}, [isVisible, life]);
|
|
20136
|
+
React$2.useImperativeHandle(ref, function () { return ({
|
|
20137
|
+
show: function () { return setIsVisible(true); },
|
|
20138
|
+
}); });
|
|
20139
|
+
return (jsxRuntime.jsx(ToastContainer, __assign$1({ "data-testid": "toast-container" }, { children: isVisible && (jsxRuntime.jsxs(ToastContent, __assign$1({ "data-testid": "toast-content", distanceFromTop: distanceFromTop }, { children: [severity === 'success' && (jsxRuntime.jsx(Icon.Actions.CircleSolidCheck, { height: "1.5rem", width: "1.5rem", fill: "#4CBEA4" }, void 0)), severity === 'error' && (jsxRuntime.jsx(Icon.Actions.CircleSolidWarning, { height: "1.5rem", width: "1.5rem", fill: "#C64844" }, void 0)), jsxRuntime.jsx(ToastText, __assign$1({ severity: severity }, { children: summary }), void 0), withCloseIcon && (jsxRuntime.jsx(CloseIcon, __assign$1({ role: "button", onClick: function () { return setIsVisible(false); }, "data-testid": "close-icon" }, { children: jsxRuntime.jsx(Icon.Actions.Close, { height: "1.1rem", width: "1.1rem", fill: "#5A5A5A" }, void 0) }), void 0))] }), void 0)) }), void 0));
|
|
20140
|
+
});
|
|
20141
|
+
Toast.displayName = 'Toast';
|
|
20142
|
+
|
|
20143
|
+
var Wrapper$1 = newStyled.div(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n"])));
|
|
20144
|
+
var GrandTotal = newStyled.h1(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n margin: 0;\n font-size: 1.5rem;\n line-height: 2rem;\n font-weight: 700;\n color: ", ";\n display: block;\n align-items: center;\n"], ["\n margin: 0;\n font-size: 1.5rem;\n line-height: 2rem;\n font-weight: 700;\n color: ", ";\n display: block;\n align-items: center;\n"])), function (props) { return props.color; });
|
|
20145
|
+
var Currency = newStyled.span(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n margin: 0;\n margin-right: 0.625rem;\n font-weight: 600;\n color: ", ";\n font-size: ", ";\n line-height: ", ";\n align-self: ", ";\n"], ["\n margin: 0;\n margin-right: 0.625rem;\n font-weight: 600;\n color: ", ";\n font-size: ", ";\n line-height: ", ";\n align-self: ", ";\n"])), function (_a) {
|
|
20099
20146
|
var theme = _a.theme;
|
|
20100
20147
|
return theme.component.total.basicTotal.currency.color;
|
|
20101
20148
|
}, function (_a) {
|
|
@@ -20108,21 +20155,21 @@ var Currency = newStyled.span(templateObject_3$b || (templateObject_3$b = __make
|
|
|
20108
20155
|
var theme = _a.theme;
|
|
20109
20156
|
return theme.component.total.basicTotal.currency.alignSelf;
|
|
20110
20157
|
});
|
|
20111
|
-
var Container$9 = newStyled.div(templateObject_4$
|
|
20158
|
+
var Container$9 = newStyled.div(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n width: 100%;\n margin-top: 0.625rem;\n color: ", ";\n align-items: center;\n"], ["\n display: flex;\n justify-content: space-between;\n width: 100%;\n margin-top: 0.625rem;\n color: ", ";\n align-items: center;\n"])), function (_a) {
|
|
20112
20159
|
var highlightColor = _a.highlightColor;
|
|
20113
20160
|
return highlightColor;
|
|
20114
20161
|
});
|
|
20115
|
-
var TotalContainer = newStyled(Container$9)(templateObject_5$
|
|
20162
|
+
var TotalContainer = newStyled(Container$9)(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n justify-content: ", ";\n margin-top: 0;\n"], ["\n justify-content: ", ";\n margin-top: 0;\n"])), function (_a) {
|
|
20116
20163
|
var showTotalLabel = _a.showTotalLabel;
|
|
20117
20164
|
return (showTotalLabel ? 'space-between' : 'flex-end');
|
|
20118
20165
|
});
|
|
20119
|
-
var DiscountText = newStyled.h3(templateObject_6$
|
|
20166
|
+
var DiscountText = newStyled.h3(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n margin: 0;\n font-size: 14px;\n line-height: 22px;\n font-weight: 600;\n"], ["\n margin: 0;\n font-size: 14px;\n line-height: 22px;\n font-weight: 600;\n"])));
|
|
20120
20167
|
var DiscountAmount = newStyled.h3(templateObject_7$8 || (templateObject_7$8 = __makeTemplateObject(["\n margin: 0;\n font-size: 18px;\n line-height: 28px;\n font-weight: ", ";\n"], ["\n margin: 0;\n font-size: 18px;\n line-height: 28px;\n font-weight: ", ";\n"])), function (_a) {
|
|
20121
20168
|
var theme = _a.theme;
|
|
20122
20169
|
return theme.component.total.basicTotal.savings.amountFontWeight;
|
|
20123
20170
|
});
|
|
20124
20171
|
var TotalLabel = newStyled(Text$7)(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n font-size: 20px;\n"], ["\n font-size: 20px;\n"])));
|
|
20125
|
-
var templateObject_1$
|
|
20172
|
+
var templateObject_1$d, templateObject_2$b, templateObject_3$a, templateObject_4$a, templateObject_5$9, templateObject_6$8, templateObject_7$8, templateObject_8$6;
|
|
20126
20173
|
|
|
20127
20174
|
var Total = function (_a) {
|
|
20128
20175
|
var total = _a.total, currency = _a.currency, saving = _a.saving, _b = _a.highlightColor, highlightColor = _b === void 0 ? '#2f806a' : _b, _c = _a.showTotalLabel, showTotalLabel = _c === void 0 ? false : _c;
|
|
@@ -20130,19 +20177,19 @@ var Total = function (_a) {
|
|
|
20130
20177
|
return (jsxRuntime.jsxs(Wrapper$1, __assign$1({ "data-testid": "total-wrapper" }, { children: [jsxRuntime.jsxs(TotalContainer, __assign$1({ showTotalLabel: showTotalLabel }, { children: [showTotalLabel && (jsxRuntime.jsx(TotalLabel, __assign$1({ variant: "heading6", size: "regular", weight: "bold" }, { children: "Total" }), void 0)), jsxRuntime.jsxs(GrandTotal, __assign$1({ color: theme.component.total.basicTotal.amount.color, "data-testid": "total-price" }, { children: [jsxRuntime.jsx(Currency, { children: currency }, void 0), total] }), void 0)] }), void 0), saving && (jsxRuntime.jsxs(Container$9, __assign$1({ "data-testid": "subtotal-container", highlightColor: highlightColor }, { children: [jsxRuntime.jsx(DiscountText, __assign$1({ "data-testid": "saving-title" }, { children: saving.savingText }), void 0), jsxRuntime.jsx(DiscountAmount, __assign$1({ "data-testid": "saving-price" }, { children: saving.amount }), void 0)] }), void 0))] }), void 0));
|
|
20131
20178
|
};
|
|
20132
20179
|
|
|
20133
|
-
var Wrapper = newStyled.div(templateObject_1$
|
|
20180
|
+
var Wrapper = newStyled.div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
|
|
20134
20181
|
var color = _a.color;
|
|
20135
20182
|
return color;
|
|
20136
20183
|
});
|
|
20137
|
-
var ItemContainer = newStyled.div(templateObject_2$
|
|
20138
|
-
var Item = newStyled.h4(templateObject_3$
|
|
20184
|
+
var ItemContainer = newStyled.div(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n margin-bottom: 0.625rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-bottom: 0.625rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n"])));
|
|
20185
|
+
var Item = newStyled.h4(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n margin: 0;\n font-size: 0.875rem;\n line-height: ", ";\n font-weight: ", ";\n"], ["\n margin: 0;\n font-size: 0.875rem;\n line-height: ", ";\n font-weight: ", ";\n"])), function (_a) {
|
|
20139
20186
|
var theme = _a.theme;
|
|
20140
20187
|
return theme.component.subTotal.basicSubTotal.lineHeight;
|
|
20141
20188
|
}, function (_a) {
|
|
20142
20189
|
var theme = _a.theme;
|
|
20143
20190
|
return theme.component.subTotal.basicSubTotal.weight;
|
|
20144
20191
|
});
|
|
20145
|
-
var CouponItem = newStyled(Item)(templateObject_4$
|
|
20192
|
+
var CouponItem = newStyled(Item)(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
|
|
20146
20193
|
var color = _a.color;
|
|
20147
20194
|
return color;
|
|
20148
20195
|
});
|
|
@@ -20155,60 +20202,13 @@ var Subtotal = function (_a) {
|
|
|
20155
20202
|
return (jsxRuntime.jsxs(ItemContainer, { children: [jsxRuntime.jsxs(CouponItem, __assign$1({ color: highlightColor, "data-testid": "discount-title" }, { children: [coupon.couponText, " ", code, " ", coupon.appliedText] }), void 0), jsxRuntime.jsx(CouponItem, __assign$1({ color: highlightColor, "data-testid": "discount-price" }, { children: amount }), void 0)] }, code));
|
|
20156
20203
|
})] }), void 0));
|
|
20157
20204
|
};
|
|
20158
|
-
var templateObject_1$
|
|
20205
|
+
var templateObject_1$c, templateObject_2$a, templateObject_3$9, templateObject_4$9;
|
|
20159
20206
|
|
|
20160
20207
|
var Totals = {
|
|
20161
20208
|
Total: Total,
|
|
20162
20209
|
Subtotal: Subtotal,
|
|
20163
20210
|
};
|
|
20164
20211
|
|
|
20165
|
-
var slideInAnimation = function (distanceFromTop) {
|
|
20166
|
-
if (distanceFromTop === void 0) { distanceFromTop = '124px'; }
|
|
20167
|
-
return keyframes(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"], ["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"])), distanceFromTop);
|
|
20168
|
-
};
|
|
20169
|
-
var mobileSlideInAnimation = function (distanceFromTop) {
|
|
20170
|
-
if (distanceFromTop === void 0) { distanceFromTop = '85px'; }
|
|
20171
|
-
return keyframes(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"], ["\n from {\n top: 0;\n }\n to {\n top: ", ";\n }\n"])), distanceFromTop);
|
|
20172
|
-
};
|
|
20173
|
-
var ToastContainer = newStyled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n"], ["\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n"])));
|
|
20174
|
-
var ToastContent = newStyled.div(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n position: fixed;\n top: ", "; \n display: flex;\n align-items: center;\n gap: 10px;\n padding: 12px;\n border-radius: 8px;\n background: #fff;\n box-shadow: 0 6px 24px -6px rgba(0, 0, 0, 0.2);\n width: 730px;\n animation: ", " 0.5s ease;\n\n @media (max-width: 768px) {\n width: calc(100vw - 32px);\n top: ", ";\n min-width: auto;\n animation: ", " 0.5s ease;\n }\n"], ["\n position: fixed;\n top: ", "; \n display: flex;\n align-items: center;\n gap: 10px;\n padding: 12px;\n border-radius: 8px;\n background: #fff;\n box-shadow: 0 6px 24px -6px rgba(0, 0, 0, 0.2);\n width: 730px;\n animation: ", " 0.5s ease;\n\n @media (max-width: 768px) {\n width: calc(100vw - 32px);\n top: ", ";\n min-width: auto;\n animation: ", " 0.5s ease;\n }\n"])), function (_a) {
|
|
20175
|
-
var distanceFromTop = _a.distanceFromTop;
|
|
20176
|
-
return distanceFromTop || '124px';
|
|
20177
|
-
}, function (_a) {
|
|
20178
|
-
var distanceFromTop = _a.distanceFromTop;
|
|
20179
|
-
return slideInAnimation(distanceFromTop);
|
|
20180
|
-
}, function (_a) {
|
|
20181
|
-
var distanceFromTop = _a.distanceFromTop;
|
|
20182
|
-
return distanceFromTop || '85px';
|
|
20183
|
-
}, function (_a) {
|
|
20184
|
-
var distanceFromTop = _a.distanceFromTop;
|
|
20185
|
-
return mobileSlideInAnimation(distanceFromTop);
|
|
20186
|
-
});
|
|
20187
|
-
var ToastText = newStyled.p(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 500;\n line-height: 24px;\n margin: 0;\n color: ", ";\n\n @media (max-width: 768px) {\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n }\n"], ["\n font-size: 14px;\n font-weight: 500;\n line-height: 24px;\n margin: 0;\n color: ", ";\n\n @media (max-width: 768px) {\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n }\n"])), function (_a) {
|
|
20188
|
-
var severity = _a.severity;
|
|
20189
|
-
return severity === 'error' ? '#C64844' : '#292929';
|
|
20190
|
-
});
|
|
20191
|
-
var CloseIcon = newStyled.div(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n margin-inline-start: auto;\n cursor: pointer;\n"], ["\n margin-inline-start: auto;\n cursor: pointer;\n"])));
|
|
20192
|
-
var templateObject_1$c, templateObject_2$a, templateObject_3$9, templateObject_4$9, templateObject_5$9, templateObject_6$8;
|
|
20193
|
-
|
|
20194
|
-
var Toast = React__default["default"].forwardRef(function (_a, ref) {
|
|
20195
|
-
var severity = _a.severity, summary = _a.summary, life = _a.life, _b = _a.withCloseIcon, withCloseIcon = _b === void 0 ? true : _b, distanceFromTop = _a.distanceFromTop;
|
|
20196
|
-
var _c = React$2.useState(false), isVisible = _c[0], setIsVisible = _c[1];
|
|
20197
|
-
React$2.useEffect(function () {
|
|
20198
|
-
if (isVisible) {
|
|
20199
|
-
var timeout_1 = setTimeout(function () {
|
|
20200
|
-
setIsVisible(false);
|
|
20201
|
-
}, life || 3000);
|
|
20202
|
-
return function () { return clearTimeout(timeout_1); };
|
|
20203
|
-
}
|
|
20204
|
-
}, [isVisible, life]);
|
|
20205
|
-
React$2.useImperativeHandle(ref, function () { return ({
|
|
20206
|
-
show: function () { return setIsVisible(true); },
|
|
20207
|
-
}); });
|
|
20208
|
-
return (jsxRuntime.jsx(ToastContainer, __assign$1({ "data-testid": "toast-container" }, { children: isVisible && (jsxRuntime.jsxs(ToastContent, __assign$1({ "data-testid": "toast-content", distanceFromTop: distanceFromTop }, { children: [severity === 'success' && (jsxRuntime.jsx(Icon.Actions.CircleSolidCheck, { height: "1.5rem", width: "1.5rem", fill: "#4CBEA4" }, void 0)), severity === 'error' && (jsxRuntime.jsx(Icon.Actions.CircleSolidWarning, { height: "1.5rem", width: "1.5rem", fill: "#C64844" }, void 0)), jsxRuntime.jsx(ToastText, __assign$1({ severity: severity }, { children: summary }), void 0), withCloseIcon && (jsxRuntime.jsx(CloseIcon, __assign$1({ role: "button", onClick: function () { return setIsVisible(false); }, "data-testid": "close-icon" }, { children: jsxRuntime.jsx(Icon.Actions.Close, { height: "1.1rem", width: "1.1rem", fill: "#5A5A5A" }, void 0) }), void 0))] }), void 0)) }), void 0));
|
|
20209
|
-
});
|
|
20210
|
-
Toast.displayName = 'Toast';
|
|
20211
|
-
|
|
20212
20212
|
var Container$8 = newStyled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
20213
20213
|
var CheckpointContainer$1 = newStyled.div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
20214
20214
|
var CheckpointDate$1 = newStyled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n display: flex;\n justify-content: flex-start;\n flex-direction: column;\n padding-bottom: ", ";\n width: 60px;\n min-width: 60px;\n margin-right: 10px;\n"], ["\n display: flex;\n justify-content: flex-start;\n flex-direction: column;\n padding-bottom: ", ";\n width: 60px;\n min-width: 60px;\n margin-right: 10px;\n"])), function (props) { return props.currentSpace; });
|
|
@@ -20951,6 +20951,7 @@ exports.CategoryTag = CategoryTag;
|
|
|
20951
20951
|
exports.Checkbox = Checkbox;
|
|
20952
20952
|
exports.ClubOfferSelector = ClubOfferSelector;
|
|
20953
20953
|
exports.ClubOfferTag = ClubOfferTag;
|
|
20954
|
+
exports.ClubPriceMemberLabel = ClubPriceMemberLabel;
|
|
20954
20955
|
exports.ClubRadioGroupInput = ClubRadioGroupInput;
|
|
20955
20956
|
exports.Collection = Collection;
|
|
20956
20957
|
exports.CouponCard = CouponCard;
|