@trafilea/afrodita-components 5.0.0-beta.42 → 5.0.0-beta.45

package/build/index.d.ts

@@ -356,7 +356,7 @@ interface IconWrapperProps {
     fill?: string;
 }
 
-declare const Mail: ({ height, width }: IconWrapperProps) => JSX.Element;
+declare const Mail: ({ height, width, }: Pick<IconWrapperProps, 'width' | 'height'>) => JSX.Element;
 
 declare const Messaging_QuestionCircle: typeof QuestionCircle;
 declare const Messaging_Messenger: typeof Messenger;
@@ -1634,6 +1634,8 @@ declare const RadioInput: ({ name, value, id, label, checked, disabled, onChange
 declare type PortalProps = {
     id: string;
     className?: string;
+    overflow?: boolean;
+    style?: CSSProperties;
 };
 declare const Portal: FC<PortalProps>;
 

package/build/index.esm.js

@@ -10607,13 +10607,22 @@ var CustomLabel = newStyled.div(function (_a) {
 var starsNumber = 5;
 var Rating = function (_a) {
     var _b = _a.size, size = _b === void 0 ? ComponentSize.Medium : _b, reviews = _a.reviews, reviewsText = _a.reviewsText, rating = _a.rating, _c = _a.wrapWithParenthesis, wrapWithParenthesis = _c === void 0 ? false : _c, _d = _a.underline, underline = _d === void 0 ? false : _d, reviewsContainerId = _a.reviewsContainerId;
+    function handleAnchorClick(e) {
+        var _a;
+        e.preventDefault();
+        if (reviewsContainerId) {
+            (_a = document.querySelector(reviewsContainerId)) === null || _a === void 0 ? void 0 : _a.scrollIntoView({
+                behavior: 'smooth',
+            });
+        }
+    }
     var theme = useTheme();
     var containerAttributes = reviewsContainerId
         ? {
             href: reviewsContainerId,
         }
         : {};
-    return (jsxs$1(Container$x, __assign$1({ as: reviewsContainerId ? 'a' : 'div' }, containerAttributes, { "data-testid": "Container" }, { children: [jsx$1(StarList, { rating: rating, size: size, starsNumber: starsNumber, 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, " ", reviewsText] }), void 0)] }), void 0));
+    return (jsxs$1(Container$x, __assign$1({ as: reviewsContainerId ? 'a' : 'div' }, containerAttributes, { "data-testid": "Container", onClick: handleAnchorClick }, { children: [jsx$1(StarList, { rating: rating, size: size, starsNumber: starsNumber, 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, " ", reviewsText] }), void 0)] }), void 0));
 };
 
 var Container$w = newStyled.div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  font-size: 0.88rem;\n"], ["\n  display: flex;\n  align-items: center;\n  font-size: 0.88rem;\n"])));
@@ -11830,13 +11839,13 @@ var ImageContainer = newStyled.div(function (_a) {
     });
 });
 var Container$f = newStyled.a(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: min-content;\n  text-decoration: none;\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: min-content;\n  text-decoration: none;\n"])));
-var H1 = newStyled.h1(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n  font-size: 0.875rem;\n  font-weight: normal;\n  line-height: 1.375rem;\n  min-height: 2.75rem;\n  text-align: center;\n  color: ", ";\n  margin: 0.25rem 0;\n  text-align: ", ";\n"], ["\n  font-size: 0.875rem;\n  font-weight: normal;\n  line-height: 1.375rem;\n  min-height: 2.75rem;\n  text-align: center;\n  color: ", ";\n  margin: 0.25rem 0;\n  text-align: ", ";\n"])), function (props) { return props.theme.colors.pallete.secondary.color; }, function (props) { return props.align; });
+var H1 = newStyled.h1(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n  font-size: 0.83rem;\n  font-weight: normal;\n  line-height: 1.375rem;\n  min-height: 2.75rem;\n  text-align: center;\n  color: ", ";\n  margin: 0.25rem 0;\n  text-align: ", ";\n"], ["\n  font-size: 0.83rem;\n  font-weight: normal;\n  line-height: 1.375rem;\n  min-height: 2.75rem;\n  text-align: center;\n  color: ", ";\n  margin: 0.25rem 0;\n  text-align: ", ";\n"])), function (props) { return props.theme.colors.pallete.secondary.color; }, function (props) { return props.align; });
 var getStylesBySize = function (size) {
     switch (size) {
         case ComponentSize.Medium:
             return {
-                width: '12.1rem',
-                height: '15.8rem',
+                width: '205px',
+                height: '274px',
             };
         case ComponentSize.Small:
             return {
@@ -11851,8 +11860,8 @@ var getStylesBySize = function (size) {
         /* istanbul ignore next */
         default:
             return {
-                width: '12.1rem',
-                height: '15.8rem',
+                width: '205px',
+                height: '274px',
             };
     }
 };
@@ -12599,7 +12608,7 @@ var ProductGalleryMobile = function (_a) {
 var templateObject_1$a;
 
 var Portal = function (_a) {
-    var id = _a.id, className = _a.className, children = _a.children;
+    var id = _a.id, className = _a.className, children = _a.children, overflow = _a.overflow, style = _a.style;
     var _b = useState(false), mounted = _b[0], setMounted = _b[1];
     var container = useRef(null);
     useEffect(function () {
@@ -12613,10 +12622,19 @@ var Portal = function (_a) {
             throw new Error("Unable to find/create container (".concat(id, ")"));
         }
         element.dataset.testId = id;
-        element.style.overflow = 'hidden';
         setMounted(true);
         container.current = element;
     }, [id]);
+    useEffect(function () {
+        if (!mounted) {
+            return;
+        }
+        container.current.style.overflow = overflow ? 'visible' : 'hidden';
+        for (var key in style) {
+            // @ts-ignore
+            container.current.style[key] = style[key];
+        }
+    }, [style, overflow, mounted]);
     useEffect(function () {
         if (mounted) {
             container.current.className = className !== null && className !== void 0 ? className : '';