@trafilea/afrodita-components 6.44.1 → 6.45.0

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 CHANGED
@@ -3984,7 +3984,7 @@ declare type SizeOptionProps = {
3984
3984
  value: string;
3985
3985
  disabled: boolean;
3986
3986
  };
3987
- declare type OfferAtCartProps = {
3987
+ declare type OfferAtCartPropsBase = {
3988
3988
  className?: string;
3989
3989
  title: {
3990
3990
  content: string | ReactElement | {
@@ -3992,14 +3992,21 @@ declare type OfferAtCartProps = {
3992
3992
  };
3993
3993
  bold?: boolean;
3994
3994
  };
3995
- image: ImageProps;
3995
+ image?: ImageProps;
3996
3996
  benefits: OfferAtCartBenefitProps[];
3997
- sizeOptions: SizeOptionProps[];
3998
- onAddToCart: (size: string, color?: string) => void;
3999
3997
  ctaText?: string;
4000
3998
  rating?: number;
4001
3999
  bottomCopy?: string;
4002
- };
4000
+ };
4001
+ declare type OfferAtCartWithSizeOptions = OfferAtCartPropsBase & {
4002
+ sizeOptions: SizeOptionProps[];
4003
+ onAddToCart: (size: string, color?: string) => void;
4004
+ };
4005
+ declare type OfferAtCartWithoutSizeOptions = OfferAtCartPropsBase & {
4006
+ sizeOptions?: never;
4007
+ onAddToCart: () => void;
4008
+ };
4009
+ declare type OfferAtCartProps = OfferAtCartWithSizeOptions | OfferAtCartWithoutSizeOptions;
4003
4010
 
4004
4011
  declare const OfferAtCart: FC<OfferAtCartProps>;
4005
4012
 
@@ -4311,6 +4318,7 @@ declare const isDangerouslySetInnerHTML: (content: any) => content is {
4311
4318
  declare const title: JSX.Element;
4312
4319
  declare const benefits: (size: 'xsmall' | 'small' | 'regular') => OfferAtCartBenefitProps[];
4313
4320
  declare const benefitsRawHtml: OfferAtCartBenefitProps[];
4321
+ declare const benefitsRawHtmlV2: OfferAtCartBenefitProps[];
4314
4322
  declare const sizeOptions: SizeOptionProps[];
4315
4323
 
4316
- export { AbsorbencyLevel, Accordion, AccordionOptions, AmazonButton, AssetsProvider, Autoship, AutoshipFrequency, AutoshipFrequencyDropdown, AutoshipOfferCard, AutoshipOfferCardCta, AutoshipV2, BasicAccordion, BeforeAfterCard, BeforeAfterVariant, BenefitsList, BenefitsListProps, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, ButtonType, BuyNowPayLater, CTAProps, CancellationFlowAccordionContentPerPartner, _default as Card, CardSectionType, CartItemCard, CartProductItem, CategorySquareTag, CategoryTag, Checkbox, ClubOfferSelector, ClubOfferTag, ClubPriceMemberLabel, ClubRadioGroupInput, Collection, ColorPickerOption, ColorPickerWithTooltip, ColorsState, CommonProps, 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, HorizontalDivider, HorizontalDividerProps, HurryUp, HurryUpProps, ISubscriptionFrequencyDropdown, Icon, IconButton, IconName, IconProps, IconWithOpacityProps, IconsWithTitle, Image, ImageCardWithDescription, ImageProps, Input, InputValidationType, JoinClubCard, Icon$1 as LibIcon, IconProps$1 as LibIconProps, LikeButton, LikeButtonColors, LikeButtonProps, Modal, MotivatorProgressBar, MultiColorPicker, Note, OfferAtCart, OfferAtCartBenefitProps, OfferAtCartProps, OfferAtCartV2, OfferBanner, OrderBar, Overlay, PackSelector, PackSelectorV2, Pagination, PaginatorBlog, Partner, PartnerContent, Pattern, PaymentMethod, PaypalButton, Portal, PriceLabel, PriceLabelV2, PriceLabelV3, PriceType, ProductCard, ProductCardV2, ProductCardV3, ProductGallery, ProductGalleryMobile, ProductGalleryMobileV2, ProductGalleryMobileV3, ProductGalleryMobileV4, ProductGalleryMobileV5, ProgressBar, QuantityPicker, RadioConfig, RadioGroupInput, RadioGroupOption, RadioInput, RadioPrimary, RadiosConfig, Rating, Review, Review$1 as ReviewDetail, ReviewsHeader, ScrollToTop, SearchBar, SearchBarOptionItem, SearchNavigation, SeasonOfferTag, SelectorOnChangeProps, ShortBanner, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeChartTable, SizeChartTableV2, SizeChartTableV3, SizeDropdown, SizeFitGuide, SizeOption, SizeOptionProps, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, SpinnerProps, StarList, StrengthBars, SubscriptionPlanSelector, SubscriptionPlanSelectorProps, SubscriptionPlanSelectorRadios, Tab, Tabs, Text, TextButton, TextWithImage, Theme, ThemeAssets, ThemeBasicPallete, ThemeBreakpoints, ThemeColorPallete, ThemeColors, ThemeComponent, ThemeFonts, ThemeProvider, ThemeProviderProps, ThemeTypography, ThemeVariables, Timer, Toast, ToggleComponent, Tooltip, TooltipContent, TooltipHeader, TooltipType, Totals, TrackingProgress, TrackingProgressV2, Video, VideoProps, WithBenefits, WithChildren, WithTestId, benefits, benefitsRawHtml, buildImageUrl, componentSizeMapper, decimalFormat, formatPrice, getSrcSet, imageVideoProps, isDangerouslySetInnerHTML, isEmail, isEmpty, isNumber, isPhoneNumber, isValidDate, mediaQueries, modalEvent, SeasonOfferRoundedTag as seasonOfferRoundedTag, simulateMouseClick, sizeOptions, sliceString, title, useDeviceType, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
4324
+ export { AbsorbencyLevel, Accordion, AccordionOptions, AmazonButton, AssetsProvider, Autoship, AutoshipFrequency, AutoshipFrequencyDropdown, AutoshipOfferCard, AutoshipOfferCardCta, AutoshipV2, BasicAccordion, BeforeAfterCard, BeforeAfterVariant, BenefitsList, BenefitsListProps, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, ButtonType, BuyNowPayLater, CTAProps, CancellationFlowAccordionContentPerPartner, _default as Card, CardSectionType, CartItemCard, CartProductItem, CategorySquareTag, CategoryTag, Checkbox, ClubOfferSelector, ClubOfferTag, ClubPriceMemberLabel, ClubRadioGroupInput, Collection, ColorPickerOption, ColorPickerWithTooltip, ColorsState, CommonProps, 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, HorizontalDivider, HorizontalDividerProps, HurryUp, HurryUpProps, ISubscriptionFrequencyDropdown, Icon, IconButton, IconName, IconProps, IconWithOpacityProps, IconsWithTitle, Image, ImageCardWithDescription, ImageProps, Input, InputValidationType, JoinClubCard, Icon$1 as LibIcon, IconProps$1 as LibIconProps, LikeButton, LikeButtonColors, LikeButtonProps, Modal, MotivatorProgressBar, MultiColorPicker, Note, OfferAtCart, OfferAtCartBenefitProps, OfferAtCartProps, OfferAtCartV2, OfferBanner, OrderBar, Overlay, PackSelector, PackSelectorV2, Pagination, PaginatorBlog, Partner, PartnerContent, Pattern, PaymentMethod, PaypalButton, Portal, PriceLabel, PriceLabelV2, PriceLabelV3, PriceType, ProductCard, ProductCardV2, ProductCardV3, ProductGallery, ProductGalleryMobile, ProductGalleryMobileV2, ProductGalleryMobileV3, ProductGalleryMobileV4, ProductGalleryMobileV5, ProgressBar, QuantityPicker, RadioConfig, RadioGroupInput, RadioGroupOption, RadioInput, RadioPrimary, RadiosConfig, Rating, Review, Review$1 as ReviewDetail, ReviewsHeader, ScrollToTop, SearchBar, SearchBarOptionItem, SearchNavigation, SeasonOfferTag, SelectorOnChangeProps, ShortBanner, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeChartTable, SizeChartTableV2, SizeChartTableV3, SizeDropdown, SizeFitGuide, SizeOption, SizeOptionProps, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, SpinnerProps, StarList, StrengthBars, SubscriptionPlanSelector, SubscriptionPlanSelectorProps, SubscriptionPlanSelectorRadios, Tab, Tabs, Text, TextButton, TextWithImage, Theme, ThemeAssets, ThemeBasicPallete, ThemeBreakpoints, ThemeColorPallete, ThemeColors, ThemeComponent, ThemeFonts, ThemeProvider, ThemeProviderProps, ThemeTypography, ThemeVariables, Timer, Toast, ToggleComponent, Tooltip, TooltipContent, TooltipHeader, TooltipType, Totals, TrackingProgress, TrackingProgressV2, Video, VideoProps, WithBenefits, WithChildren, WithTestId, benefits, benefitsRawHtml, benefitsRawHtmlV2, buildImageUrl, componentSizeMapper, decimalFormat, formatPrice, getSrcSet, imageVideoProps, isDangerouslySetInnerHTML, isEmail, isEmpty, isNumber, isPhoneNumber, isValidDate, mediaQueries, modalEvent, SeasonOfferRoundedTag as seasonOfferRoundedTag, simulateMouseClick, sizeOptions, sliceString, title, useDeviceType, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
@@ -5370,6 +5370,14 @@ var benefitsRawHtml = [
5370
5370
  text: 'Receive it every 3 months. Cancel anytime',
5371
5371
  },
5372
5372
  ];
5373
+ var benefitsRawHtmlV2 = [
5374
+ benefitsRawHtml[0],
5375
+ benefitsRawHtml[2],
5376
+ {
5377
+ icon: __assign$1({ name: 'pdp/shipping_empty' }, commonIconProps),
5378
+ text: "<div>\n <span style=line-height:22px>Club: Free \n <span style=font-weight:600>priority shipping</span> \n always\n </span> \n <small style=display:block;line-height:18px>Free for 30 days. Only $4.99/month after.\n </small>\n </div>",
5379
+ },
5380
+ ];
5373
5381
  var sizeOptions = [
5374
5382
  {
5375
5383
  key: 'S',
@@ -6779,7 +6787,7 @@ var Rating = function (_a) {
6779
6787
  return (jsxs$1(Container$14, __assign$1({ as: reviewsContainerId ? 'a' : 'div' }, containerAttributes, { "data-testid": "Container", onClick: handleAnchorClick }, { children: [showRatingText && (jsx$1(RatingLabel, __assign$1({ color: theme.colors.shades['700'].color, "data-testid": "RatingLabel" }, { children: rating }), void 0)), jsx$1(StarList, { rating: rating, size: size, starsNumber: STARTS_NUMBER, fill: theme.component.stars.element.color }, void 0), jsxs$1(CustomLabel, __assign$1({ theme: theme, size: size, wrapWithParenthesis: wrapWithParenthesis, underline: underline, "data-testid": "CustomLabel" }, { children: [reviews ? reviews : '', " ", reviewsText ? reviewsText : ''] }), void 0)] }), void 0));
6780
6788
  };
6781
6789
 
6782
- var ImageWrapper$4 = newStyled.div(templateObject_1$1F || (templateObject_1$1F = __makeTemplateObject(["\n position: relative;\n display: flex;\n width: ", ";\n justify-content: center;\n align-items: center;\n border-radius: 8px;\n"], ["\n position: relative;\n display: flex;\n width: ", ";\n justify-content: center;\n align-items: center;\n border-radius: 8px;\n"])), function (_a) {
6790
+ var ImageWrapper$4 = newStyled.div(templateObject_1$1F || (templateObject_1$1F = __makeTemplateObject(["\n position: relative;\n display: flex;\n flex-shrink: 0;\n width: ", ";\n justify-content: center;\n align-items: center;\n border-radius: 8px;\n"], ["\n position: relative;\n display: flex;\n flex-shrink: 0;\n width: ", ";\n justify-content: center;\n align-items: center;\n border-radius: 8px;\n"])), function (_a) {
6783
6791
  var width = _a.width;
6784
6792
  return width;
6785
6793
  });
@@ -20506,17 +20514,17 @@ var JoinClubCard = function (_a) {
20506
20514
  var templateObject_1$l;
20507
20515
 
20508
20516
  var Container$i = newStyled.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n width: 100%;\n padding: 12px;\n border: 1px solid #e5e5e5;\n border-radius: 8px;\n gap: 14px;\n margin: auto;\n"], ["\n display: flex;\n flex-direction: column;\n width: 100%;\n padding: 12px;\n border: 1px solid #e5e5e5;\n border-radius: 8px;\n gap: 14px;\n margin: auto;\n"])));
20509
- var Body = newStyled.div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n display: flex;\n gap: 8px;\n width: 100%;\n height: ", ";\n"], ["\n display: flex;\n gap: 8px;\n width: 100%;\n height: ", ";\n"])), function (_a) {
20517
+ var Body = newStyled.div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n display: flex;\n gap: 8px;\n width: 100%;\n height: ", ";\n margin-bottom: 1%;\n"], ["\n display: flex;\n gap: 8px;\n width: 100%;\n height: ", ";\n margin-bottom: 1%;\n"])), function (_a) {
20510
20518
  var height = _a.height;
20511
20519
  return height;
20512
20520
  });
20513
- var RightContent = newStyled.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 8px;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 8px;\n height: 100%;\n"])));
20514
- var Benefits = newStyled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 8px;\n height: ", ";\n padding: 6px 10px;\n border-radius: 8px;\n background-color: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n gap: 8px;\n height: ", ";\n padding: 6px 10px;\n border-radius: 8px;\n background-color: ", ";\n"])), function (_a) {
20521
+ var RightContent = newStyled.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 8px;\n height: 100%;\n width: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: 8px;\n height: 100%;\n width: 100%;\n"])));
20522
+ var Benefits = newStyled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n gap: 8px;\n height: ", ";\n padding: 6px 10px;\n border-radius: 8px;\n background-color: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n justify-content: space-around;\n gap: 8px;\n height: ", ";\n padding: 6px 10px;\n border-radius: 8px;\n background-color: ", ";\n"])), function (_a) {
20515
20523
  var height = _a.height;
20516
- return height;
20524
+ return height !== null && height !== void 0 ? height : '100%';
20517
20525
  }, function (_a) {
20518
- var theme = _a.theme;
20519
- return theme.colors.shades['10'].color;
20526
+ var theme = _a.theme, backgroundColor = _a.backgroundColor;
20527
+ return backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : theme.colors.shades['10'].color;
20520
20528
  });
20521
20529
  var Actions = newStyled.div(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n display: flex;\n width: 100%;\n gap: 8px;\n"], ["\n display: flex;\n width: 100%;\n gap: 8px;\n"])));
20522
20530
  var templateObject_1$k, templateObject_2$e, templateObject_3$e, templateObject_4$b, templateObject_5$9;
@@ -20533,26 +20541,32 @@ var getTitleProps = function (_a) {
20533
20541
  return { content: titleContent };
20534
20542
  }
20535
20543
  };
20536
- var OfferAtCart = function (_a) {
20537
- var className = _a.className, _b = _a.title, titleContent = _b.content, bold = _b.bold, _c = _a.image, src = _c.src, alt = _c.alt, benefits = _a.benefits, _d = _a.ctaText, ctaText = _d === void 0 ? 'Yes, I want this offer' : _d, sizeOptions = _a.sizeOptions, rating = _a.rating, onAddToCart = _a.onAddToCart;
20544
+ var OfferAtCart = function (props) {
20545
+ var className = props.className, _a = props.title, titleContent = _a.content, bold = _a.bold, image = props.image, benefits = props.benefits, _b = props.ctaText, ctaText = _b === void 0 ? 'Yes, I want this offer' : _b, sizeOptions = props.sizeOptions, rating = props.rating, bottomCopy = props.bottomCopy;
20538
20546
  var theme = useTheme();
20539
20547
  var isMobile = useDeviceType() === 'mobile';
20540
- var _e = useState(), selectedSize = _e[0], setSelectedSize = _e[1];
20541
- var _f = useState(false), showErrorMessage = _f[0], setShowErrorMessage = _f[1];
20542
- var ActionsSection = (jsxs$1(Actions, { children: [jsx$1(SimpleDropdown, { placeHolder: "Size", options: sizeOptions, onChange: function (sizeOption) {
20548
+ var _c = useState(), selectedSize = _c[0], setSelectedSize = _c[1];
20549
+ var _d = useState(false), showErrorMessage = _d[0], setShowErrorMessage = _d[1];
20550
+ var handleOnClick = function () {
20551
+ if ('sizeOptions' in props && props.sizeOptions) {
20552
+ if (selectedSize) {
20553
+ setShowErrorMessage(false);
20554
+ props.onAddToCart(selectedSize.key);
20555
+ }
20556
+ else {
20557
+ setShowErrorMessage(true);
20558
+ }
20559
+ }
20560
+ else {
20561
+ props.onAddToCart();
20562
+ }
20563
+ };
20564
+ var ActionsSection = (jsxs$1(Actions, { children: [sizeOptions && (jsx$1(SimpleDropdown, { placeHolder: "Size", options: sizeOptions, onChange: function (sizeOption) {
20543
20565
  setShowErrorMessage(false);
20544
20566
  setSelectedSize(sizeOption);
20545
- } }, void 0), jsx$1(ButtonSecondary, { wide: true, text: ctaText, size: ComponentSize.Small, onClick: function () {
20546
- if (selectedSize) {
20547
- setShowErrorMessage(false);
20548
- onAddToCart(selectedSize.key);
20549
- }
20550
- else {
20551
- setShowErrorMessage(true);
20552
- }
20553
- } }, void 0)] }, void 0));
20554
- var ErrorMessage = showErrorMessage ? (jsx$1(Text$7, __assign$1({ variant: "body", weight: "demi", size: "small", color: theme.colors.semantic.urgent.color }, { children: "Please select a size first" }), void 0)) : null;
20555
- return (jsxs$1(Container$i, __assign$1({ className: className }, { children: [jsx$1(OfferAtCartTitle, __assign$1({}, getTitleProps({ content: titleContent, bold: bold })), void 0), jsxs$1(Body, __assign$1({ height: isMobile ? '120px' : '162px' }, { children: [jsx$1(OfferAtCartImage, { isMobile: isMobile, src: src, alt: alt, rating: rating }, void 0), jsxs$1(RightContent, { children: [jsx$1(Benefits, __assign$1({ height: isMobile ? '100%' : '65%' }, { children: jsx$1(OfferAtCartBenefits, { benefits: benefits }, void 0) }), void 0), !isMobile && ActionsSection, !isMobile && ErrorMessage] }, void 0)] }), void 0), isMobile && ActionsSection, isMobile && ErrorMessage] }), void 0));
20567
+ } }, void 0)), jsx$1(ButtonSecondary, { wide: true, text: ctaText, size: ComponentSize.Small, onClick: handleOnClick }, void 0)] }, void 0));
20568
+ var ErrorMessage = (jsx$1(Text$7, __assign$1({ variant: "body", weight: "demi", size: "small", color: theme.colors.semantic.urgent.color }, { children: "Please select a size first" }), void 0));
20569
+ return (jsxs$1(Container$i, __assign$1({ className: className }, { children: [jsx$1(OfferAtCartTitle, __assign$1({}, getTitleProps({ content: titleContent, bold: bold })), void 0), jsxs$1(Body, __assign$1({ height: isMobile ? '120px' : '162px' }, { children: [image && (jsx$1(OfferAtCartImage, { isMobile: isMobile, src: image.src, alt: image.alt, rating: rating }, void 0)), jsxs$1(RightContent, { children: [jsx$1(Benefits, __assign$1({ id: "benefits" }, { children: jsx$1(OfferAtCartBenefits, { benefits: benefits }, void 0) }), void 0), !isMobile && ActionsSection, !isMobile && showErrorMessage && ErrorMessage] }, void 0)] }), void 0), isMobile && ActionsSection, isMobile && showErrorMessage && ErrorMessage, bottomCopy && jsx$1("span", { dangerouslySetInnerHTML: { __html: bottomCopy } }, void 0)] }), void 0));
20556
20570
  };
20557
20571
 
20558
20572
  var renderBottomCopy = function (text) {
@@ -20584,13 +20598,14 @@ var SizeOptions = function (_a) {
20584
20598
  };
20585
20599
 
20586
20600
  var OfferAtCartV2 = function (_a) {
20587
- var className = _a.className, _b = _a.title, titleContent = _b.content, bold = _b.bold, _c = _a.image, src = _c.src, alt = _c.alt, benefits = _a.benefits, _d = _a.ctaText, ctaText = _d === void 0 ? 'Yes, I want this offer' : _d, sizeOptions = _a.sizeOptions, rating = _a.rating, onAddToCart = _a.onAddToCart, bottomCopy = _a.bottomCopy;
20601
+ var className = _a.className, _b = _a.title, titleContent = _b.content, bold = _b.bold, image = _a.image, benefits = _a.benefits, _c = _a.ctaText, ctaText = _c === void 0 ? 'Yes, I want this offer' : _c, sizeOptions = _a.sizeOptions, rating = _a.rating, onAddToCart = _a.onAddToCart, bottomCopy = _a.bottomCopy;
20588
20602
  var isMobile = useDeviceType() === 'mobile';
20589
- var _e = useState(true), showButton = _e[0], setShowButton = _e[1];
20603
+ var _d = useState(true), showButton = _d[0], setShowButton = _d[1];
20604
+ var _e = image !== null && image !== void 0 ? image : {}, src = _e.src, alt = _e.alt;
20590
20605
  var ActionsSection = (jsx$1(ActionsV2, { children: showButton ? (jsx$1(ButtonSecondary, { wide: true, text: ctaText, size: ComponentSize.Small, onClick: function () {
20591
20606
  setShowButton(false);
20592
- } }, void 0)) : (jsx$1(SizeOptions, { sizeOptions: sizeOptions, onAddToCart: onAddToCart }, void 0)) }, void 0));
20593
- return (jsxs$1(ContainerV2, __assign$1({ className: className, variant: bottomCopy ? VariantType.V2 : VariantType.V1 }, { children: [jsx$1(OfferAtCartTitle, __assign$1({}, getTitleProps({ content: titleContent, bold: bold })), void 0), jsxs$1(Body, __assign$1({ height: isMobile ? '120px' : '162px' }, { children: [jsx$1(OfferAtCartImage, { isMobile: isMobile, src: src, alt: alt, rating: rating }, void 0), jsx$1(RightContent, { children: jsx$1(Benefits, __assign$1({ height: isMobile ? '100%' : '65%' }, { children: jsx$1(OfferAtCartBenefits, { benefits: benefits }, void 0) }), void 0) }, void 0)] }), void 0), jsx$1("div", { children: !isMobile && ActionsSection }, void 0), isMobile && ActionsSection, bottomCopy && renderBottomCopy(bottomCopy)] }), void 0));
20607
+ } }, void 0)) : (sizeOptions && jsx$1(SizeOptions, { sizeOptions: sizeOptions, onAddToCart: onAddToCart }, void 0)) }, void 0));
20608
+ return (jsxs$1(ContainerV2, __assign$1({ className: className, variant: bottomCopy ? VariantType.V2 : VariantType.V1 }, { children: [jsx$1(OfferAtCartTitle, __assign$1({}, getTitleProps({ content: titleContent, bold: bold })), void 0), jsxs$1(Body, __assign$1({ height: isMobile ? '120px' : '162px' }, { children: [src && alt && jsx$1(OfferAtCartImage, { isMobile: isMobile, src: src, alt: alt, rating: rating }, void 0), jsx$1(RightContent, { children: jsx$1(Benefits, __assign$1({ height: isMobile ? '100%' : '65%' }, { children: jsx$1(OfferAtCartBenefits, { benefits: benefits }, void 0) }), void 0) }, void 0)] }), void 0), jsx$1("div", { children: !isMobile && ActionsSection }, void 0), isMobile && ActionsSection, bottomCopy && renderBottomCopy(bottomCopy)] }), void 0));
20594
20609
  };
20595
20610
 
20596
20611
  var ImageContainer$1 = newStyled.div(function (_a) {
@@ -22184,5 +22199,5 @@ var SubscriptionPlanSelector = function (_a) {
22184
22199
  }, useV2Style: true, checked: !radiosStatuses.oneTime.disabled && radiosStatuses.oneTime.checked, disabled: radiosStatuses.oneTime.disabled }, void 0), jsx$1(StyledPrice, { testId: "single-purchase", finalPrice: "$".concat(decimalFormat(Number(discountedPrice))), disabled: radiosStatuses.oneTime.disabled, highlighted: !radiosStatuses.oneTime.disabled && radiosStatuses.oneTime.highlighted, size: ComponentSize.Large, originalPrice: "$".concat(decimalFormat(Number(listPrice))) }, void 0)] }), void 0)] }), void 0));
22185
22200
  };
22186
22201
 
22187
- export { AbsorbencyLevel, Accordion$1 as Accordion, AccordionOptions, AmazonButton, AssetsProvider, Autoship, AutoshipFrequencyDropdown, AutoshipOfferCard, AutoshipOfferCardCta, AutoshipV2, BasicAccordion, BeforeAfterCard, BeforeAfterVariant, BenefitsList, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, BuyNowPayLater, CacheProvider, CancellationFlowAccordionContentPerPartner, Card$3 as Card, CardSectionType, CartItemCard, CartProductItem, CategorySquareTag, CategoryTag, Checkbox, ClubOfferSelector, ClubOfferTag, ClubPriceMemberLabel, ClubRadioGroupInput, Collection, ColorPickerWithTooltip, ComponentPosition, ComponentSize, CouponCard, index$1 as CrossSell, DeliveryDetails, DiscountTag$3 as DiscountTag, Drawer, DropdownDialog, DropdownListIcons, FilteringDropdown, Tags as FilteringTags, Filters, FitGuarantee, FitPredictor, Global, HorizontalDivider, HurryUp, Icon, IconButton, IconsWithTitle, Image$3 as Image, ImageCardWithDescription, Input$3 as Input, InputValidationType, JoinClubCard, Icon$1 as LibIcon, LikeButton, Modal, MotivatorProgressBar, MultiColorPicker, Note, OfferAtCart, OfferAtCartV2, 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, ProductGalleryMobileV5, ProgressBar, QuantityPicker, RadioGroupInput, RadioInput, RadioPrimary, Rating, Review, Review$1 as ReviewDetail, ReviewsHeader, ScrollToTop, SearchBar, SearchNavigation, SeasonOfferTag, ShortBanner, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeChartTable, SizeChartTableV2, SizeChartTableV3, SizeDropdown, SizeFitGuide, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, StrengthBars, SubscriptionPlanSelector, Tab, Tabs, Text$7 as Text, TextButton, TextWithImage, ThemeProvider, ThemeVariables, Timer, Toast, ToggleComponent, Tooltip, Totals, TrackingProgress, TrackingProgressV2, Video$1 as Video, benefits, benefitsRawHtml, buildImageUrl, componentSizeMapper, createCache, css, decimalFormat, formatPrice, getSrcSet, isDangerouslySetInnerHTML, isEmail, isEmpty, isNumber$1 as isNumber, isPhoneNumber, isValidDate, mediaQueries, modalEvent, SeasonOfferRoundedTag as seasonOfferRoundedTag, simulateMouseClick, sizeOptions, sliceString, newStyled as styled, title, useDeviceType, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
22202
+ export { AbsorbencyLevel, Accordion$1 as Accordion, AccordionOptions, AmazonButton, AssetsProvider, Autoship, AutoshipFrequencyDropdown, AutoshipOfferCard, AutoshipOfferCardCta, AutoshipV2, BasicAccordion, BeforeAfterCard, BeforeAfterVariant, BenefitsList, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, BuyNowPayLater, CacheProvider, CancellationFlowAccordionContentPerPartner, Card$3 as Card, CardSectionType, CartItemCard, CartProductItem, CategorySquareTag, CategoryTag, Checkbox, ClubOfferSelector, ClubOfferTag, ClubPriceMemberLabel, ClubRadioGroupInput, Collection, ColorPickerWithTooltip, ComponentPosition, ComponentSize, CouponCard, index$1 as CrossSell, DeliveryDetails, DiscountTag$3 as DiscountTag, Drawer, DropdownDialog, DropdownListIcons, FilteringDropdown, Tags as FilteringTags, Filters, FitGuarantee, FitPredictor, Global, HorizontalDivider, HurryUp, Icon, IconButton, IconsWithTitle, Image$3 as Image, ImageCardWithDescription, Input$3 as Input, InputValidationType, JoinClubCard, Icon$1 as LibIcon, LikeButton, Modal, MotivatorProgressBar, MultiColorPicker, Note, OfferAtCart, OfferAtCartV2, 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, ProductGalleryMobileV5, ProgressBar, QuantityPicker, RadioGroupInput, RadioInput, RadioPrimary, Rating, Review, Review$1 as ReviewDetail, ReviewsHeader, ScrollToTop, SearchBar, SearchNavigation, SeasonOfferTag, ShortBanner, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeChartTable, SizeChartTableV2, SizeChartTableV3, SizeDropdown, SizeFitGuide, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, StrengthBars, SubscriptionPlanSelector, Tab, Tabs, Text$7 as Text, TextButton, TextWithImage, ThemeProvider, ThemeVariables, Timer, Toast, ToggleComponent, Tooltip, Totals, TrackingProgress, TrackingProgressV2, Video$1 as Video, benefits, benefitsRawHtml, benefitsRawHtmlV2, buildImageUrl, componentSizeMapper, createCache, css, decimalFormat, formatPrice, getSrcSet, isDangerouslySetInnerHTML, isEmail, isEmpty, isNumber$1 as isNumber, isPhoneNumber, isValidDate, mediaQueries, modalEvent, SeasonOfferRoundedTag as seasonOfferRoundedTag, simulateMouseClick, sizeOptions, sliceString, newStyled as styled, title, useDeviceType, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
22188
22203
  //# sourceMappingURL=index.esm.js.map