@trafilea/afrodita-components 5.0.0-beta.63 → 5.0.0-beta.66

package/build/index.d.ts

@@ -1917,6 +1917,15 @@ interface IconList {
 }
 declare const IconsWithTitle: ({ iconName, iconTitle, backgroundColor, iconColor }: IconList) => JSX.Element | null;
 
+interface NoteProps {
+    accentColor: string;
+    color: string;
+    backgroundColor: string;
+    importantNoteText: string;
+    text: string;
+}
+declare const Note: ({ accentColor, color, backgroundColor, importantNoteText, text, }: NoteProps) => JSX.Element;
+
 declare global {
     interface Events {
         modal: {
@@ -1956,4 +1965,4 @@ declare const formatPrice: (value: number, { locale, currency }?: {
     currency?: string | undefined;
 }) => string;
 
-export { Accordion, AmazonButton, AssetsProvider, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, ButtonType, CTAProps, _default as Card, CardSectionType, CartProductItem, CategoryTag, Checkbox, Collection, ColorPickerOption, ComponentPosition, ComponentSize, index_d as CrossSell, DeliveryDetails, DiscountTag, Drawer, DropdownListIcons, DropdownListIconsItem, DropdownListIconsSubItem, DropdownOption, Filter, FilterChange, FilteringDropdown, Tags as FilteringTags, Filters, FitPredictor, Icon, IconButton, IconProps, IconWithOpacityProps, IconsWithTitle, Image, ImageType, Input, InputValidationType, Modal, MultiColorPicker, OfferBanner, OrderBar, Overlay, PackSelector, Pagination, Pattern, PaymentMethod, PaypalButton, Portal, PriceLabel, ProductGallery, ProductGalleryMobile, ProgressBar, QuantityPicker, RadioGroupInput, RadioGroupOption, RadioInput, Rating, Review, ScrollToTop, SearchBar, SearchBarOptionItem, SearchNavigation, SeasonOfferTag, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeFitGuide, SizeOption, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, Tab, Tabs, Text, TextButton, Theme, ThemeAssets, ThemeBasicPallete, ThemeBreakpoints, ThemeColorPallete, ThemeColors, ThemeComponent, ThemeFonts, ThemeProvider, ThemeTypography, ThemeVariables, Timer, Tooltip, Totals, WithTestId, decimalFormat, formatPrice, isEmail, isEmpty, isNumber, isPhoneNumber, isValidDate, modalEvent, simulateMouseClick, sliceString, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
+export { Accordion, AmazonButton, AssetsProvider, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, ButtonType, CTAProps, _default as Card, CardSectionType, CartProductItem, CategoryTag, Checkbox, Collection, ColorPickerOption, ComponentPosition, ComponentSize, index_d as CrossSell, DeliveryDetails, DiscountTag, Drawer, DropdownListIcons, DropdownListIconsItem, DropdownListIconsSubItem, DropdownOption, Filter, FilterChange, FilteringDropdown, Tags as FilteringTags, Filters, FitPredictor, Icon, IconButton, IconProps, IconWithOpacityProps, IconsWithTitle, Image, ImageType, Input, InputValidationType, Modal, MultiColorPicker, Note, OfferBanner, OrderBar, Overlay, PackSelector, Pagination, Pattern, PaymentMethod, PaypalButton, Portal, PriceLabel, ProductGallery, ProductGalleryMobile, ProgressBar, QuantityPicker, RadioGroupInput, RadioGroupOption, RadioInput, Rating, Review, ScrollToTop, SearchBar, SearchBarOptionItem, SearchNavigation, SeasonOfferTag, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeFitGuide, SizeOption, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, Tab, Tabs, Text, TextButton, Theme, ThemeAssets, ThemeBasicPallete, ThemeBreakpoints, ThemeColorPallete, ThemeColors, ThemeComponent, ThemeFonts, ThemeProvider, ThemeTypography, ThemeVariables, Timer, Tooltip, Totals, WithTestId, decimalFormat, formatPrice, isEmail, isEmpty, isNumber, isPhoneNumber, isValidDate, modalEvent, simulateMouseClick, sliceString, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };

package/build/index.esm.js

@@ -11676,7 +11676,7 @@ var BasePlusButton = function (_a) {
     if (success) {
         return (jsx$1(Success, __assign$1({ successText: successText, size: rest.size }, { children: jsx$1(ButtonContainer, __assign$1({ status: status, type: "secondary", theme: theme }, { children: jsx$1(ButtonSecondaryOutline, { text: editText, onClick: onClickEdit, disabled: rest.disabled }, void 0) }), void 0) }), void 0));
     }
-    return (jsx$1(BaseInput, __assign$1({}, rest, { onValidation: setStatus, onChange: onChangeInput }, { children: jsx$1(ButtonContainer, __assign$1({ status: status, type: "primary", theme: theme }, { children: jsx$1(ButtonSecondary, { text: text, onClick: function () { return onClick(inputValue); }, disabled: rest.disabled || status === InputValidationType.Error }, void 0) }), void 0) }), void 0));
+    return (jsx$1(BaseInput, __assign$1({ onValidation: setStatus, onChange: onChangeInput }, rest, { children: jsx$1(ButtonContainer, __assign$1({ status: status, type: "primary", theme: theme }, { children: jsx$1(ButtonSecondary, { text: text, onClick: function () { return onClick(inputValue); }, disabled: rest.disabled || status === InputValidationType.Error }, void 0) }), void 0) }), void 0));
 };
 var templateObject_1$H;
 
@@ -11778,7 +11778,7 @@ var Text$3 = newStyled.p(templateObject_3$j || (templateObject_3$j = __makeTempl
 var Details = newStyled.span(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n  color: ", ";\n  font-weight: 700;\n"], ["\n  color: ", ";\n  font-weight: 700;\n"])), function (props) { return props.color; });
 var Note = function (_a) {
     var accentColor = _a.accentColor, color = _a.color, backgroundColor = _a.backgroundColor, importantNoteText = _a.importantNoteText, text = _a.text;
-    return (jsxs$1(Container$m, __assign$1({ color: backgroundColor, "data-testid": "Container" }, { children: [jsx$1(IconContainer$3, { children: jsx$1(Icon.Actions.LightExclamation, { fill: accentColor }, void 0) }, void 0), jsx$1("div", { children: jsxs$1(Text$3, __assign$1({ color: color }, { children: [jsxs$1(Details, __assign$1({ color: accentColor }, { children: [importantNoteText, ":"] }), void 0), " ", text] }), void 0) }, void 0)] }), void 0));
+    return (jsxs$1(Container$m, __assign$1({ color: backgroundColor, "data-testid": "Container" }, { children: [jsx$1(IconContainer$3, { children: jsx$1(Icon.Actions.LightExclamation, { fill: accentColor }, void 0) }, void 0), jsx$1("div", { children: jsxs$1(Text$3, __assign$1({ color: color }, { children: [importantNoteText && jsxs$1(Details, __assign$1({ color: accentColor }, { children: [importantNoteText, ":"] }), void 0), " ", text] }), void 0) }, void 0)] }), void 0));
 };
 var templateObject_1$B, templateObject_2$n, templateObject_3$j, templateObject_4$e;
 
@@ -17053,7 +17053,7 @@ var Tabs = function (_a) {
 };
 var templateObject_1$1, templateObject_2, templateObject_3, templateObject_4;
 
-var Container = newStyled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 150px;\n  height: auto;\n  text-align: center;\n"], ["\n  width: 150px;\n  height: auto;\n  text-align: center;\n"])));
+var Container = newStyled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: auto;\n  text-align: center;\n"], ["\n  height: auto;\n  text-align: center;\n"])));
 var IconWrapper = newStyled.div(function (props) { return ({
     borderRadius: '500px',
     width: '120px',
@@ -17063,17 +17063,22 @@ var IconWrapper = newStyled.div(function (props) { return ({
     alignItems: 'center',
     justifyContent: 'center',
     backgroundColor: props.backgroundColor,
+    '@media (max-width: 767px)': {
+        width: '80px',
+        height: '80px',
+    },
 }); });
 var IconsWithTitle = function (_a) {
     var _b;
     var iconName = _a.iconName, iconTitle = _a.iconTitle, backgroundColor = _a.backgroundColor, iconColor = _a.iconColor;
+    var isMobile = useWindowDimensions({ mobile: 0, desktop: 768 }).isMobile;
     // @ts-ignore
     var IconComponent = (_b = Icon['MyAccount'][iconName]) !== null && _b !== void 0 ? _b : (function () { return 'Not found'; });
     if (IconComponent == null) {
         console.error('Icon', iconName, 'not found');
         return null;
     }
-    return (jsx$1(Fragment$1, { children: jsxs$1(Container, { children: [jsx$1(IconWrapper, __assign$1({ backgroundColor: backgroundColor }, { children: jsx$1(IconComponent, { width: 4, height: 4, fill: iconColor }, void 0) }), void 0), jsx$1(Text$5, __assign$1({ variant: "heading6", style: {
+    return (jsx$1(Fragment$1, { children: jsxs$1(Container, { children: [jsx$1(IconWrapper, __assign$1({ backgroundColor: backgroundColor }, { children: jsx$1(IconComponent, { width: isMobile ? 3 : 4, height: isMobile ? 3 : 4, fill: iconColor }, void 0) }), void 0), jsx$1(Text$5, __assign$1({ variant: "heading6", style: {
                         fontSize: '14px',
                         textTransform: 'uppercase',
                         textAlign: 'center',
@@ -17082,5 +17087,5 @@ var IconsWithTitle = function (_a) {
 };
 var templateObject_1;
 
-export { Accordion$1 as Accordion, AmazonButton, AssetsProvider, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, Card$2 as Card, CardSectionType, CartProductItem, CategoryTag, Checkbox, Collection, ComponentPosition, ComponentSize, index as CrossSell, DeliveryDetails, DiscountTag, Drawer, DropdownListIcons, FilteringDropdown, Tags as FilteringTags, Filters, FitPredictor, Icon, IconButton, IconsWithTitle, Image, Input$1 as Input, InputValidationType, Modal, MultiColorPicker, OfferBanner, OrderBar, Overlay, PackSelector, Pagination, PaymentMethod, PaypalButton, Portal, PriceLabel, ProductGallery, ProductGalleryMobile, ProgressBar, QuantityPicker, RadioGroupInput, RadioInput, Rating, Review, ScrollToTop, SearchBar, SearchNavigation, SeasonOfferTag, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeFitGuide, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, Tab, Tabs, Text$5 as Text, TextButton, ThemeProvider, ThemeVariables, Timer, Tooltip, Totals, decimalFormat, formatPrice, isEmail, isEmpty, isNumber$1 as isNumber, isPhoneNumber, isValidDate, modalEvent, simulateMouseClick, sliceString, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
+export { Accordion$1 as Accordion, AmazonButton, AssetsProvider, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, Card$2 as Card, CardSectionType, CartProductItem, CategoryTag, Checkbox, Collection, ComponentPosition, ComponentSize, index as CrossSell, DeliveryDetails, DiscountTag, Drawer, DropdownListIcons, FilteringDropdown, Tags as FilteringTags, Filters, FitPredictor, Icon, IconButton, IconsWithTitle, Image, Input$1 as Input, InputValidationType, Modal, MultiColorPicker, Note, OfferBanner, OrderBar, Overlay, PackSelector, Pagination, PaymentMethod, PaypalButton, Portal, PriceLabel, ProductGallery, ProductGalleryMobile, ProgressBar, QuantityPicker, RadioGroupInput, RadioInput, Rating, Review, ScrollToTop, SearchBar, SearchNavigation, SeasonOfferTag, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeFitGuide, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, Tab, Tabs, Text$5 as Text, TextButton, ThemeProvider, ThemeVariables, Timer, Tooltip, Totals, decimalFormat, formatPrice, isEmail, isEmpty, isNumber$1 as isNumber, isPhoneNumber, isValidDate, modalEvent, simulateMouseClick, sliceString, useModal, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
 //# sourceMappingURL=index.esm.js.map