@prokodo/ui 0.0.26 → 0.0.28

package/dist/components/post-widget-carousel/PostWidgetCarousel.js

@@ -1,147 +1,153 @@
-import { jsx as a, jsxs as l } from "react/jsx-runtime";
-import { memo as b, useRef as v, useState as w, useLayoutEffect as C, Fragment as u } from "react";
-import { create as P } from "../../helpers/bem.js";
-import z from "./PostWidgetCarousel.module.scss.js";
-import { Carousel as L } from "../carousel/Carousel.js";
-import { Card as W } from "../card/Card.js";
-import { Headline as h } from "../headline/Headline.js";
-import { Link as _ } from "../link/Link.js";
-import { Image as k } from "../image/Image.js";
-import { Button as p } from "../button/Button.js";
-const r = P(z, "PostWidgetCarousel"), x = b(
-  ({ autoplay: N, className: g, title: o, items: i = [], ...f }) => {
-    const s = v(null), [y, d] = w(0);
-    return C(() => {
-      var c, n;
-      const e = ((n = (c = s == null ? void 0 : s.current) == null ? void 0 : c.carouselContainer) == null ? void 0 : n.offsetWidth) ?? 0;
-      d(e);
-      const t = () => {
-        d(e);
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+import { jsx, jsxs } from "react/jsx-runtime";
+import { memo, useRef, useState, useLayoutEffect, Fragment } from "react";
+import { create } from "../../helpers/bem.js";
+import styles from "./PostWidgetCarousel.module.scss.js";
+import { Carousel } from "../carousel/Carousel.js";
+import { Button } from "../button/Button.js";
+import { Card } from "../card/Card.js";
+import { Headline } from "../headline/Headline.server.js";
+import { Link } from "../link/Link.js";
+import { Image } from "../image/Image.js";
+const bem = create(styles, "PostWidgetCarousel");
+const PostWidgetCarousel = memo(
+  ({ autoplay, className, title, items = [], ...props }) => {
+    const ref = useRef(null);
+    const [carouselWidth, setCarouselWidth] = useState(0);
+    useLayoutEffect(() => {
+      var _a, _b;
+      const containerWidth = ((_b = (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.carouselContainer) == null ? void 0 : _b.offsetWidth) ?? 0;
+      setCarouselWidth(containerWidth);
+      const handleResize = /* @__PURE__ */ __name(() => {
+        setCarouselWidth(containerWidth);
+      }, "handleResize");
+      window.addEventListener("resize", handleResize);
+      return () => {
+        window.removeEventListener("resize", handleResize);
       };
-      return window.addEventListener("resize", t), () => {
-        window.removeEventListener("resize", t);
-      };
-    }, [s]), /* @__PURE__ */ a(
+    }, [ref]);
+    return /* @__PURE__ */ jsx(
       "section",
       {
-        itemScope: !0,
-        className: r(void 0, void 0, g),
+        itemScope: true,
+        className: bem(void 0, void 0, className),
         itemType: "https://schema.org/ItemList",
-        children: /* @__PURE__ */ l(
-          W,
+        children: /* @__PURE__ */ jsxs(
+          Card,
           {
-            animated: !0,
-            enableShadow: !0,
-            ...f,
-            className: r("card__container"),
-            contentClassName: r("card"),
+            animated: true,
+            enableShadow: true,
+            ...props,
+            className: bem("card__container"),
+            contentClassName: bem("card"),
             variant: "white",
             children: [
-              o && /* @__PURE__ */ a(
-                h,
+              title && /* @__PURE__ */ jsx(
+                Headline,
                 {
-                  highlight: !0,
+                  highlight: true,
                   size: "md",
                   type: "h2",
-                  ...o,
-                  className: r("title", o == null ? void 0 : o.className),
+                  ...title,
+                  className: bem("title", title == null ? void 0 : title.className),
                   itemProp: "headline",
                   variant: "secondary",
-                  children: o == null ? void 0 : o.content
+                  children: title == null ? void 0 : title.content
                 }
               ),
-              i.length > 0 && /* @__PURE__ */ l(u, { children: [
-                /* @__PURE__ */ a(
-                  L,
+              items.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(
+                  Carousel,
                   {
-                    ref: s,
-                    autoplay: N,
-                    className: r("carousel"),
-                    classNameDots: r("carousel__dots"),
-                    classNameItem: r("carousel__item"),
+                    ref,
+                    autoplay,
+                    className: bem("carousel"),
+                    classNameDots: bem("carousel__dots"),
+                    classNameItem: bem("carousel__item"),
                     itemsToShow: 1,
-                    children: i.map((e) => {
-                      var c, n, m;
-                      const t = `carousel-item-${e.title}`;
-                      return /* @__PURE__ */ l(u, { children: [
-                        (e == null ? void 0 : e.image) && /* @__PURE__ */ a(
-                          _,
+                    children: items.map((item) => {
+                      var _a, _b, _c;
+                      const key = `carousel-item-${item.title}`;
+                      return /* @__PURE__ */ jsxs(Fragment, { children: [
+                        (item == null ? void 0 : item.image) && /* @__PURE__ */ jsx(
+                          Link,
                           {
-                            "aria-label": `Read more about ${e.title.content}`,
-                            ...e == null ? void 0 : e.redirect,
-                            className: r(
+                            "aria-label": `Read more about ${item.title.content}`,
+                            ...item == null ? void 0 : item.redirect,
+                            className: bem(
                               "carousel__item__image__link",
                               void 0,
-                              (c = e == null ? void 0 : e.redirect) == null ? void 0 : c.className
+                              (_a = item == null ? void 0 : item.redirect) == null ? void 0 : _a.className
                             ),
                             style: {
-                              width: y
+                              width: carouselWidth
                             },
-                            children: /* @__PURE__ */ a(
-                              k,
+                            children: /* @__PURE__ */ jsx(
+                              Image,
                               {
-                                className: r("carousel__item__image"),
-                                ...e.image
+                                className: bem("carousel__item__image"),
+                                ...item.image
                               },
-                              t
+                              key
                             )
                           }
                         ),
-                        /* @__PURE__ */ a(
-                          _,
+                        /* @__PURE__ */ jsx(
+                          Link,
                           {
-                            ...e == null ? void 0 : e.redirect,
-                            "aria-label": `Read more about ${e.title.content}`,
-                            className: r("carousel__item__link"),
-                            children: /* @__PURE__ */ a(
-                              h,
+                            ...item == null ? void 0 : item.redirect,
+                            "aria-label": `Read more about ${item.title.content}`,
+                            className: bem("carousel__item__link"),
+                            children: /* @__PURE__ */ jsx(
+                              Headline,
                               {
                                 size: "md",
                                 type: "h3",
-                                ...e.title,
-                                className: r("headline", (n = e.title) == null ? void 0 : n.className),
+                                ...item.title,
+                                className: bem("headline", (_b = item.title) == null ? void 0 : _b.className),
                                 itemProp: "headline",
                                 variant: "inherit",
-                                children: (m = e.title) == null ? void 0 : m.content
+                                children: (_c = item.title) == null ? void 0 : _c.content
                               }
                             )
                           }
                         )
-                      ] }, t);
+                      ] }, key);
                     })
                   }
                 ),
-                /* @__PURE__ */ l("div", { className: r("carousel__buttons"), children: [
-                  /* @__PURE__ */ a(
-                    p,
+                /* @__PURE__ */ jsxs("div", { className: bem("carousel__buttons"), children: [
+                  /* @__PURE__ */ jsx(
+                    Button,
                     {
                       "aria-label": "Last category",
-                      className: r("carousel__button"),
+                      className: bem("carousel__button"),
                       color: "primary",
                       iconProps: {
                         name: "ArrowLeft01Icon",
                         size: "sm"
                       },
-                      onClick: () => {
-                        var e;
-                        return (e = s.current) == null ? void 0 : e.slidePrev();
-                      }
+                      onClick: /* @__PURE__ */ __name(() => {
+                        var _a;
+                        return (_a = ref.current) == null ? void 0 : _a.slidePrev();
+                      }, "onClick")
                     }
                   ),
-                  /* @__PURE__ */ a(
-                    p,
+                  /* @__PURE__ */ jsx(
+                    Button,
                     {
                       "aria-label": "Next category",
-                      className: r("carousel__button"),
+                      className: bem("carousel__button"),
                       color: "primary",
                       iconProps: {
                         name: "ArrowRight01Icon",
                         size: "sm"
                       },
-                      onClick: () => {
-                        var e;
-                        return (e = s.current) == null ? void 0 : e.slideNext();
-                      }
+                      onClick: /* @__PURE__ */ __name(() => {
+                        var _a;
+                        return (_a = ref.current) == null ? void 0 : _a.slideNext();
+                      }, "onClick")
                     }
                   )
                 ] })
@@ -153,7 +159,7 @@ const r = P(z, "PostWidgetCarousel"), x = b(
     );
   }
 );
-x.displayName = "PostWidgetCarousel";
+PostWidgetCarousel.displayName = "PostWidgetCarousel";
 export {
-  x as PostWidgetCarousel
+  PostWidgetCarousel
 };

package/dist/components/post-widget-carousel/PostWidgetCarousel.module.scss.js

@@ -1,4 +1,6 @@
-const o = "gradientMove", e = "fadeInKeyframe", _ = {
+const gradientMove = "gradientMove";
+const fadeInKeyframe = "fadeInKeyframe";
+const styles = {
   "prokodo-PostWidgetCarousel__carousel": "prokodo-PostWidgetCarousel__carousel",
   "prokodo-PostWidgetCarousel__carousel__item__image__link": "prokodo-PostWidgetCarousel__carousel__item__image__link",
   "prokodo-PostWidgetCarousel__carousel__item__image": "prokodo-PostWidgetCarousel__carousel__item__image",
@@ -6,11 +8,11 @@ const o = "gradientMove", e = "fadeInKeyframe", _ = {
   "prokodo-PostWidgetCarousel__carousel__dots": "prokodo-PostWidgetCarousel__carousel__dots",
   "prokodo-PostWidgetCarousel__carousel__buttons": "prokodo-PostWidgetCarousel__carousel__buttons",
   "prokodo-PostWidgetCarousel__headline": "prokodo-PostWidgetCarousel__headline",
-  gradientMove: o,
-  fadeInKeyframe: e
+  gradientMove,
+  fadeInKeyframe
 };
 export {
-  _ as default,
-  e as fadeInKeyframe,
-  o as gradientMove
+  styles as default,
+  fadeInKeyframe,
+  gradientMove
 };

package/dist/components/post-widget-carousel/index.js

@@ -1,4 +1,4 @@
-import { PostWidgetCarousel as r } from "./PostWidgetCarousel.js";
+import { PostWidgetCarousel } from "./PostWidgetCarousel.js";
 export {
-  r as PostWidgetCarousel
+  PostWidgetCarousel
 };

package/dist/components/quote/Quote.js

@@ -1,76 +1,77 @@
-import { jsxs as n, jsx as o } from "react/jsx-runtime";
-import { memo as p } from "react";
-import { create as d } from "../../helpers/bem.js";
-import { isString as h } from "../../helpers/validations.js";
-import l from "./Quote.module.scss.js";
-import { Headline as r } from "../headline/Headline.js";
-import { Card as _ } from "../card/Card.js";
-import { RichText as N } from "../rich-text/RichText.js";
-import { Avatar as f } from "../avatar/Avatar.js";
-const e = d(l, "Quote"), v = p(
-  ({ className: t, variant: c = "primary", title: i, subTitle: m, content: s, author: a }) => /* @__PURE__ */ n(
+import { jsxs, jsx } from "react/jsx-runtime";
+import { memo } from "react";
+import { create } from "../../helpers/bem.js";
+import { isString } from "../../helpers/validations.js";
+import styles from "./Quote.module.scss.js";
+import { Headline } from "../headline/Headline.server.js";
+import { Card } from "../card/Card.js";
+import { RichText } from "../rich-text/RichText.js";
+import { Avatar } from "../avatar/Avatar.js";
+const bem = create(styles, "Quote");
+const Quote = memo(
+  ({ className, variant = "primary", title, subTitle, content, author }) => /* @__PURE__ */ jsxs(
     "figure",
     {
-      itemScope: !0,
-      className: e(void 0, void 0, t),
+      itemScope: true,
+      className: bem(void 0, void 0, className),
       itemType: "https://schema.org/Quotation",
       children: [
-        m && /* @__PURE__ */ o(
-          r,
+        subTitle && /* @__PURE__ */ jsx(
+          Headline,
           {
-            highlight: !0,
-            className: e("sub_headline", void 0, m == null ? void 0 : m.className),
+            highlight: true,
+            className: bem("sub_headline", void 0, subTitle == null ? void 0 : subTitle.className),
             size: "sm",
             type: "h3",
-            ...m,
-            variant: m.variant ?? c,
-            children: m == null ? void 0 : m.content
+            ...subTitle,
+            variant: subTitle.variant ?? variant,
+            children: subTitle == null ? void 0 : subTitle.content
           }
         ),
-        i && /* @__PURE__ */ o(
-          r,
+        title && /* @__PURE__ */ jsx(
+          Headline,
           {
-            className: e("headline", void 0, i == null ? void 0 : i.className),
+            className: bem("headline", void 0, title == null ? void 0 : title.className),
             size: "lg",
             type: "h2",
-            ...i,
-            children: i.content
+            ...title,
+            children: title.content
           }
         ),
-        /* @__PURE__ */ n(
-          _,
+        /* @__PURE__ */ jsxs(
+          Card,
           {
-            animated: !0,
-            highlight: !0,
-            className: e("card__container"),
-            contentClassName: e("card"),
+            animated: true,
+            highlight: true,
+            className: bem("card__container"),
+            contentClassName: bem("card"),
             customAnimation: "left-right",
             variant: "white",
             children: [
-              /* @__PURE__ */ o("blockquote", { className: e("quote"), children: /* @__PURE__ */ o(N, { className: e("quote__content"), itemProp: "text", children: s }) }),
-              a && /* @__PURE__ */ o("figcaption", { children: /* @__PURE__ */ n(
+              /* @__PURE__ */ jsx("blockquote", { className: bem("quote"), children: /* @__PURE__ */ jsx(RichText, { className: bem("quote__content"), itemProp: "text", children: content }) }),
+              author && /* @__PURE__ */ jsx("figcaption", { children: /* @__PURE__ */ jsxs(
                 "div",
                 {
-                  itemScope: !0,
-                  className: e("caption"),
+                  itemScope: true,
+                  className: bem("caption"),
                   itemType: "https://schema.org/Person",
                   children: [
-                    (a == null ? void 0 : a.avatar) && /* @__PURE__ */ o(
-                      f,
+                    (author == null ? void 0 : author.avatar) && /* @__PURE__ */ jsx(
+                      Avatar,
                       {
-                        className: e("caption__avatar"),
-                        ...a.avatar,
-                        variant: c
+                        className: bem("caption__avatar"),
+                        ...author.avatar,
+                        variant
                       }
                     ),
-                    /* @__PURE__ */ n("div", { className: e("caption__author"), children: [
-                      /* @__PURE__ */ o("span", { className: e("caption__author__name"), itemProp: "name", children: a.name }),
-                      h(a == null ? void 0 : a.position) && /* @__PURE__ */ o(
+                    /* @__PURE__ */ jsxs("div", { className: bem("caption__author"), children: [
+                      /* @__PURE__ */ jsx("span", { className: bem("caption__author__name"), itemProp: "name", children: author.name }),
+                      isString(author == null ? void 0 : author.position) && /* @__PURE__ */ jsx(
                         "span",
                         {
-                          className: e("caption__author__position"),
+                          className: bem("caption__author__position"),
                           itemProp: "jobTitle",
-                          children: a.position
+                          children: author.position
                         }
                       )
                     ] })
@@ -84,7 +85,7 @@ const e = d(l, "Quote"), v = p(
     }
   )
 );
-v.displayName = "Quote";
+Quote.displayName = "Quote";
 export {
-  v as Quote
+  Quote
 };

package/dist/components/quote/Quote.module.scss.js

@@ -1,4 +1,6 @@
-const o = "gradientMove", _ = "fadeInKeyframe", t = {
+const gradientMove = "gradientMove";
+const fadeInKeyframe = "fadeInKeyframe";
+const styles = {
   "prokodo-Quote": "prokodo-Quote",
   "prokodo-Quote__headline": "prokodo-Quote__headline",
   "prokodo-Quote__quote": "prokodo-Quote__quote",
@@ -8,11 +10,11 @@ const o = "gradientMove", _ = "fadeInKeyframe", t = {
   "prokodo-Quote__caption__author": "prokodo-Quote__caption__author",
   "prokodo-Quote__caption__author__name": "prokodo-Quote__caption__author__name",
   "prokodo-Quote__caption__author__position": "prokodo-Quote__caption__author__position",
-  gradientMove: o,
-  fadeInKeyframe: _
+  gradientMove,
+  fadeInKeyframe
 };
 export {
-  t as default,
-  _ as fadeInKeyframe,
-  o as gradientMove
+  styles as default,
+  fadeInKeyframe,
+  gradientMove
 };

package/dist/components/quote/index.js

@@ -1,4 +1,4 @@
-import { Quote as r } from "./Quote.js";
+import { Quote } from "./Quote.js";
 export {
-  r as Quote
+  Quote
 };