@lanaco/lnc-react-ui 4.0.225 → 4.0.227

package/dist/BlogListSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),a=require("react"),W=require("./Icon.cjs"),f=require("./IconButton.cjs"),c=require("./utils-CITgSxXe.cjs"),G=require("./index-DsINTjQk.cjs"),I=require("./style-DC05rdyx.cjs"),R=require("./emotion-styled.browser.esm-BtEseadx.cjs"),$=require("./breakpoints-CcVm-gVm.cjs"),n=require("./style-BAcV7F53.cjs"),T=R.styled.a`
+"use strict";const e=require("react/jsx-runtime"),a=require("react"),I=require("./Icon.cjs"),b=require("./IconButton.cjs"),d=require("./utils-CITgSxXe.cjs"),x=require("./index-DsINTjQk.cjs"),L=require("./style-Boz6dk5s.cjs"),$=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),T=require("./breakpoints-CcVm-gVm.cjs"),o=require("./style-CQdEALKR.cjs"),F=$.styled.a`
   text-decoration: none;
   color: var(--gray-950);
   display: flex;
@@ -67,7 +67,7 @@
         font-weight: 600;
         line-height: 1.5rem;
         letter-spacing: 0.1px;
-        ${c.truncateTextInRows(3)}
+        ${d.truncateTextInRows(3)}
       }
 
       & .wrapper__tags {
@@ -117,7 +117,7 @@
     }
   }
 
-  @media ${$.down("S")} {
+  @media ${T.down("S")} {
     flex-direction: column;
     padding: 0;
     background: transparent;
@@ -168,7 +168,7 @@
       }
     }
   }
-`,z=a.forwardRef(({blogUuid:i,title:l,imageUrl:m,options:o,publishedAt:h,timeToReadText:k="{0} min read",timeToRead:_=0,numberOfLikes:b=0,numberOfComments:S=0,isBookmarked:g=!1,onSelectCard:y=()=>{},onBookmark:v=()=>{},onShare:u=()=>{},bookmarkComponent:d=e.jsx(e.Fragment,{}),metadata:s,titleSlug:j,LinkComponent:r,hasShare:w=!0,hasDelete:p=!1,onDelete:x=()=>{}},P)=>{const q=r||"a",C=()=>c.isDefined(d)?a.cloneElement(d,{key:`bookmark_blog__${i}__${g}`,isBookmarked:g,blogUuid:i,onBookmark:(L,B)=>v(L,B),ref:P,componentName:"ExploreBlogSectionCard"}):e.jsx(e.Fragment,{}),N=a.useRef();return e.jsxs(T,{ref:N,name:s==null?void 0:s.name,"data-accessor":s==null?void 0:s.accessor,onClick:t=>y(t,N),className:"blog-card-item",as:q,...r?{to:`/blog/${j}`}:{href:`/blog/${j}`},children:[e.jsxs("div",{className:"image-container",children:[p&&e.jsx("div",{className:"action mobile-only",onClick:t=>{t==null||t.preventDefault(),t==null||t.stopPropagation()},children:e.jsx(f,{icon:" mng-lnc-close",borderRadius:"curved",type:"button",btnType:"filled",color:"neutral",size:"medium",onClick:()=>{x()}})}),e.jsx(G.ProductImageWrapper,{src:m,className:"wrapper__image"})]}),e.jsxs("div",{className:"wrapper__content",children:[e.jsxs("div",{className:"wrapper__subcontent",children:[e.jsxs("div",{className:"wrapper__info",children:[e.jsx("div",{className:"wrapper__title",children:l}),p&&e.jsx("div",{className:"action desktop-only",onClick:t=>{t==null||t.preventDefault(),t==null||t.stopPropagation()},children:e.jsx(f,{icon:" mng-lnc-close",borderRadius:"curved",btnType:"basic",color:"neutral",onClick:()=>{x()}})})]}),e.jsxs("div",{className:"wrapper__tags-action",children:[e.jsx("div",{className:"wrapper__tags",children:o&&(o==null?void 0:o.map((t,L)=>e.jsx(I.BlogTag,{color:t==null?void 0:t.color,children:t==null?void 0:t.name},`blog-card-sponsored-option__${L+1}`)))}),e.jsxs("div",{className:"info__content mobile-only",onClick:t=>{t.stopPropagation(),t.preventDefault()},children:[e.jsx(C,{}),w&&e.jsx(f,{icon:" mng-lnc-share",borderRadius:"curved",btnType:"basic",color:"neutral",onClick:()=>{u()}})]})]})]}),e.jsxs("div",{className:"wrapper__info",children:[e.jsxs("div",{className:"info__content",children:[e.jsx("div",{className:"info__text",children:`${c.formatLocaleDateString(h)} • ${c.formatString(k,_)}`}),e.jsxs("div",{className:"info__text",children:[e.jsxs("div",{children:[e.jsx(W,{icon:" mng-lnc-thumbs-up--filled",sizeInUnits:"1rem"}),c.getRoundedNumber(b)]}),e.jsxs("div",{children:[e.jsx(W,{icon:" mng-lnc-messages-filled",sizeInUnits:"1rem"}),c.getRoundedNumber(S)]})]})]}),e.jsxs("div",{className:"info__content desktop-only",onClick:t=>{t==null||t.preventDefault(),t==null||t.stopPropagation()},children:[e.jsx(C,{}),w&&e.jsx(f,{icon:" mng-lnc-share",borderRadius:"curved",btnType:"basic",color:"neutral",onClick:()=>{u()}})]})]})]})]})}),F=R.styled.div`
+`,O=a.forwardRef(({blogUuid:s,title:t,imageUrl:m,options:i,publishedAt:p,timeToReadText:w="{0} min read",timeToRead:j=0,numberOfLikes:y=0,numberOfComments:k=0,isBookmarked:u=!1,onSelectCard:v=()=>{},onBookmark:C=()=>{},onShare:f=()=>{},bookmarkComponent:c=e.jsx(e.Fragment,{}),metadata:l,titleSlug:h,LinkComponent:r,hasShare:_=!0,hasDelete:g=!1,onDelete:N=()=>{}},R)=>{const z=r||"a",B=()=>d.isDefined(c)?a.cloneElement(c,{key:`bookmark_blog__${s}__${u}`,isBookmarked:u,blogUuid:s,onBookmark:(S,P)=>C(S,P),ref:R,componentName:"ExploreBlogSectionCard"}):e.jsx(e.Fragment,{}),q=a.useRef();return e.jsxs(F,{ref:q,name:l==null?void 0:l.name,"data-accessor":l==null?void 0:l.accessor,onClick:n=>v(n,q),className:"blog-card-item",as:z,...r?{to:`/blog/${h}`}:{href:`/blog/${h}`},children:[e.jsxs("div",{className:"image-container",children:[g&&e.jsx("div",{className:"action mobile-only",onClick:n=>{n==null||n.preventDefault(),n==null||n.stopPropagation()},children:e.jsx(b,{icon:" mng-lnc-close",borderRadius:"curved",type:"button",btnType:"filled",color:"neutral",size:"medium",onClick:()=>{N()}})}),e.jsx(x.ProductImageWrapper,{src:m,className:"wrapper__image"})]}),e.jsxs("div",{className:"wrapper__content",children:[e.jsxs("div",{className:"wrapper__subcontent",children:[e.jsxs("div",{className:"wrapper__info",children:[e.jsx("div",{className:"wrapper__title",children:t}),g&&e.jsx("div",{className:"action desktop-only",onClick:n=>{n==null||n.preventDefault(),n==null||n.stopPropagation()},children:e.jsx(b,{icon:" mng-lnc-close",borderRadius:"curved",btnType:"basic",color:"neutral",onClick:()=>{N()}})})]}),e.jsxs("div",{className:"wrapper__tags-action",children:[e.jsx("div",{className:"wrapper__tags",children:i&&(i==null?void 0:i.map((n,S)=>e.jsx(L.BlogTag,{color:n==null?void 0:n.color,children:n==null?void 0:n.name},`blog-card-sponsored-option__${S+1}`)))}),e.jsxs("div",{className:"info__content mobile-only",onClick:n=>{n.stopPropagation(),n.preventDefault()},children:[e.jsx(B,{}),_&&e.jsx(b,{icon:" mng-lnc-share",borderRadius:"curved",btnType:"basic",color:"neutral",onClick:()=>{f()}})]})]})]}),e.jsxs("div",{className:"wrapper__info",children:[e.jsxs("div",{className:"info__content",children:[e.jsx("div",{className:"info__text",children:`${d.formatLocaleDateString(p)} • ${d.formatString(w,j)}`}),e.jsxs("div",{className:"info__text",children:[e.jsxs("div",{children:[e.jsx(I,{icon:" mng-lnc-thumbs-up--filled",sizeInUnits:"1rem"}),d.getRoundedNumber(y)]}),e.jsxs("div",{children:[e.jsx(I,{icon:" mng-lnc-messages-filled",sizeInUnits:"1rem"}),d.getRoundedNumber(k)]})]})]}),e.jsxs("div",{className:"info__content desktop-only",onClick:n=>{n==null||n.preventDefault(),n==null||n.stopPropagation()},children:[e.jsx(B,{}),_&&e.jsx(b,{icon:" mng-lnc-share",borderRadius:"curved",btnType:"basic",color:"neutral",onClick:()=>{f()}})]})]})]})]})}),U=$.styled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -192,10 +192,10 @@
       bottom: -1.25rem;
     }
   }
-`,O=R.styled(n.SkeletonColumnWrapper)`
-  @media ${$.down("S")} {
+`,A=$.styled(o.SkeletonAnimationColumnContainer)`
+  @media ${T.down("S")} {
     & > div {
       flex-direction: column;
     }
   }
-`,U=({keyPrefix:i})=>e.jsxs(O,{children:[e.jsxs(n.SkeletonRowWrapper,{children:[e.jsx(n.SkeletonSquarePlaceholder,{height:"9.5rem",width:"17.75rem"}),e.jsxs(n.SkeletonColumnWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem"}),e.jsxs(n.SkeletonRowWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"})]})]})]},`${i}-1`),e.jsxs(n.SkeletonRowWrapper,{children:[e.jsx(n.SkeletonSquarePlaceholder,{height:"9.5rem",width:"17.75rem"}),e.jsxs(n.SkeletonColumnWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem"}),e.jsxs(n.SkeletonRowWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"})]})]})]},`${i}-2`),e.jsxs(n.SkeletonRowWrapper,{children:[e.jsx(n.SkeletonSquarePlaceholder,{height:"9.5rem",width:"17.75rem"}),e.jsxs(n.SkeletonColumnWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem"}),e.jsxs(n.SkeletonRowWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"})]})]})]},`${i}-3`),e.jsxs(n.SkeletonRowWrapper,{children:[e.jsx(n.SkeletonSquarePlaceholder,{height:"9.5rem",width:"17.75rem"}),e.jsxs(n.SkeletonColumnWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem"}),e.jsxs(n.SkeletonRowWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"})]})]})]},`${i}-4`),e.jsxs(n.SkeletonRowWrapper,{children:[e.jsx(n.SkeletonSquarePlaceholder,{height:"9.5rem",width:"17.75rem"}),e.jsxs(n.SkeletonColumnWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem"}),e.jsxs(n.SkeletonRowWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"}),e.jsx(n.SkeletonLinePlaceholder,{width:"5rem",height:"1.25rem"})]})]})]},`${i}-5`)]}),A=({keyPrefix:i,isLoading:l=!1,fallbackComponent:m=e.jsx(e.Fragment,{}),children:o})=>e.jsx(a.Suspense,{fallbackComponent:m,children:l===!0?e.jsx(U,{keyPrefix:i}):o}),E=a.memo(z),M=a.forwardRef(({timeToReadText:i="{0} min read",items:l,isLoading:m=!1,onSelectCard:o=()=>{},onShare:h=()=>{},onBookmark:k=()=>{},getImage:_=()=>{},isSeparated:b=!0,bookmarkComponent:S=e.jsx(e.Fragment,{}),componentName:g,LinkComponent:y,hasShare:v=!0,hasDelete:u=!1,onDelete:d=()=>{}},s)=>{const j=a.useMemo(()=>l==null?void 0:l.map((r,w)=>{var p;return e.jsx(E,{blogUuid:r==null?void 0:r.uuid,title:r==null?void 0:r.title,titleSlug:r==null?void 0:r.titleSlug,options:r==null?void 0:r.options,publishedAt:r==null?void 0:r.publishedAt,timeToReadText:i,timeToRead:r==null?void 0:r.timeToRead,numberOfLikes:r==null?void 0:r.numberOfLikes,numberOfComments:r==null?void 0:r.numberOfComments,isSponsored:r==null?void 0:r.isSponsored,isBookmarked:r==null?void 0:r.isBookmarked,onSelectCard:(x,P)=>o==null?void 0:o(r,P),hasShare:v,hasDelete:u,onDelete:()=>d==null?void 0:d(r),onShare:()=>h==null?void 0:h(r),onBookmark:k,imageUrl:_(r==null?void 0:r.imageUrl,r==null?void 0:r.uuid)||null,bookmarkComponent:S,metadata:{name:g,accessor:r==null?void 0:r.accessor},LinkComponent:y},`blog-card-item__${w+1}__${(p=r==null?void 0:r.isBookmarked)==null?void 0:p.toString()}`)}),[l]);return e.jsx(A,{isLoading:m,keyPrefix:"blog-list-skeleton",children:e.jsx(F,{ref:s,className:b?"separated":"",children:j})})});module.exports=M;
+`,W=({keyPrefix:s})=>e.jsx(A,{children:[1,2,3,4,5].map(t=>e.jsxs(o.SkeletonContainer,{children:[e.jsx(o.SkeletonRect,{height:"9.5rem",width:"17.75rem"}),e.jsxs(o.SkeletonColumnContainer,{children:[e.jsx(o.SkeletonRect,{height:"1.5rem",width:"100%"}),e.jsxs(o.SkeletonContainer,{children:[e.jsx(o.SkeletonRect,{width:"5rem",height:"1.25rem"}),e.jsx(o.SkeletonRect,{width:"5rem",height:"1.25rem"}),e.jsx(o.SkeletonRect,{width:"5rem",height:"1.25rem"}),e.jsx(o.SkeletonRect,{width:"5rem",height:"1.25rem"})]})]})]},`${s}-${t}`))}),E=({keyPrefix:s,isLoading:t=!1,fallbackComponent:m=e.jsx(e.Fragment,{}),children:i})=>e.jsx(a.Suspense,{fallbackComponent:m,children:t===!0?e.jsx(W,{keyPrefix:s}):i}),M=a.memo(O),D=a.forwardRef(({timeToReadText:s="{0} min read",items:t,isLoading:m=!1,onSelectCard:i=()=>{},onShare:p=()=>{},onBookmark:w=()=>{},getImage:j=()=>{},isSeparated:y=!0,bookmarkComponent:k=e.jsx(e.Fragment,{}),componentName:u,LinkComponent:v,hasShare:C=!0,hasDelete:f=!1,onDelete:c=()=>{}},l)=>{const h=a.useMemo(()=>t==null?void 0:t.map((r,_)=>{var g;return e.jsx(M,{blogUuid:r==null?void 0:r.uuid,title:r==null?void 0:r.title,titleSlug:r==null?void 0:r.titleSlug,options:r==null?void 0:r.options,publishedAt:r==null?void 0:r.publishedAt,timeToReadText:s,timeToRead:r==null?void 0:r.timeToRead,numberOfLikes:r==null?void 0:r.numberOfLikes,numberOfComments:r==null?void 0:r.numberOfComments,isSponsored:r==null?void 0:r.isSponsored,isBookmarked:r==null?void 0:r.isBookmarked,onSelectCard:(N,R)=>i==null?void 0:i(r,R),hasShare:C,hasDelete:f,onDelete:()=>c==null?void 0:c(r),onShare:()=>p==null?void 0:p(r),onBookmark:w,imageUrl:j(r==null?void 0:r.imageUrl,r==null?void 0:r.uuid)||null,bookmarkComponent:k,metadata:{name:u,accessor:r==null?void 0:r.accessor},LinkComponent:v},`blog-card-item__${_+1}__${(g=r==null?void 0:r.isBookmarked)==null?void 0:g.toString()}`)}),[t]);return e.jsx(E,{isLoading:m,keyPrefix:"blog-list-skeleton",children:e.jsx(U,{ref:l,className:y?"separated":"",children:h})})});module.exports=D;

package/dist/BlogListSection.js

@@ -1,14 +1,14 @@
-import { jsxs as t, jsx as e, Fragment as y } from "react/jsx-runtime";
-import { forwardRef as W, useRef as A, cloneElement as E, Suspense as M, memo as D, useMemo as F } from "react";
-import L from "./Icon.js";
-import v from "./IconButton.js";
-import { n as H, q as J, s as K, v as P, m as Q } from "./utils-B2fsQ6PS.js";
-import { P as V } from "./index-BvMY2TbK.js";
-import { B as X } from "./style-BUyFad_y.js";
-import { s as T } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { d as O } from "./breakpoints-ff0SIcV3.js";
-import { b as c, S as l, c as f, a as n } from "./style-BwQ4djFC.js";
-const Y = T.a`
+import { jsxs as n, jsx as i, Fragment as b } from "react/jsx-runtime";
+import { forwardRef as L, useRef as W, cloneElement as E, Suspense as M, memo as q, useMemo as D } from "react";
+import z from "./Icon.js";
+import _ from "./IconButton.js";
+import { n as F, q as G, s as H, v as I, m as J } from "./utils-MoGhNMmj.js";
+import { P as K } from "./index-DEypPQRI.js";
+import { B as Q } from "./style-D54KOzZj.js";
+import { s as S } from "./emotion-styled.browser.esm-DfbrHHed.js";
+import { d as O } from "./breakpoints-BubDitvo.js";
+import { b as V, c as P, a as c, e as X } from "./style-BFPpppS9.js";
+const Y = S.a`
   text-decoration: none;
   color: var(--gray-950);
   display: flex;
@@ -77,7 +77,7 @@ const Y = T.a`
         font-weight: 600;
         line-height: 1.5rem;
         letter-spacing: 0.1px;
-        ${H(3)}
+        ${F(3)}
       }
 
       & .wrapper__tags {
@@ -178,62 +178,62 @@ const Y = T.a`
       }
     }
   }
-`, Z = W(
+`, Z = L(
   ({
-    blogUuid: o,
-    title: m,
-    imageUrl: h,
-    options: a,
-    publishedAt: p,
-    timeToReadText: k = "{0} min read",
-    timeToRead: N = 0,
-    numberOfLikes: $ = 0,
-    numberOfComments: C = 0,
-    isBookmarked: u = !1,
-    onSelectCard: B = () => {
+    blogUuid: a,
+    title: t,
+    imageUrl: m,
+    options: o,
+    publishedAt: d,
+    timeToReadText: w = "{0} min read",
+    timeToRead: y = 0,
+    numberOfLikes: v = 0,
+    numberOfComments: k = 0,
+    isBookmarked: g = !1,
+    onSelectCard: C = () => {
     },
-    onBookmark: R = () => {
+    onBookmark: N = () => {
     },
-    onShare: w = () => {
+    onShare: f = () => {
     },
-    bookmarkComponent: s = /* @__PURE__ */ e(y, {}),
-    metadata: d,
-    titleSlug: _,
-    LinkComponent: r,
-    hasShare: b = !0,
-    hasDelete: g = !1,
-    onDelete: S = () => {
+    bookmarkComponent: s = /* @__PURE__ */ i(b, {}),
+    metadata: l,
+    titleSlug: h,
+    LinkComponent: e,
+    hasShare: u = !0,
+    hasDelete: p = !1,
+    onDelete: $ = () => {
     }
-  }, G) => {
-    const U = r || "a", z = () => Q(s) ? E(s, {
-      key: `bookmark_blog__${o}__${u}`,
-      isBookmarked: u,
-      blogUuid: o,
-      onBookmark: (j, q) => R(j, q),
-      ref: G,
+  }, B) => {
+    const U = e || "a", j = () => J(s) ? E(s, {
+      key: `bookmark_blog__${a}__${g}`,
+      isBookmarked: g,
+      blogUuid: a,
+      onBookmark: (R, A) => N(R, A),
+      ref: B,
       componentName: "ExploreBlogSectionCard"
-    }) : /* @__PURE__ */ e(y, {}), I = A();
-    return /* @__PURE__ */ t(
+    }) : /* @__PURE__ */ i(b, {}), T = W();
+    return /* @__PURE__ */ n(
       Y,
       {
-        ref: I,
-        name: d == null ? void 0 : d.name,
-        "data-accessor": d == null ? void 0 : d.accessor,
-        onClick: (i) => B(i, I),
+        ref: T,
+        name: l == null ? void 0 : l.name,
+        "data-accessor": l == null ? void 0 : l.accessor,
+        onClick: (r) => C(r, T),
         className: "blog-card-item",
         as: U,
-        ...r ? { to: `/blog/${_}` } : { href: `/blog/${_}` },
+        ...e ? { to: `/blog/${h}` } : { href: `/blog/${h}` },
         children: [
-          /* @__PURE__ */ t("div", { className: "image-container", children: [
-            g && /* @__PURE__ */ e(
+          /* @__PURE__ */ n("div", { className: "image-container", children: [
+            p && /* @__PURE__ */ i(
               "div",
               {
                 className: "action mobile-only",
-                onClick: (i) => {
-                  i == null || i.preventDefault(), i == null || i.stopPropagation();
+                onClick: (r) => {
+                  r == null || r.preventDefault(), r == null || r.stopPropagation();
                 },
-                children: /* @__PURE__ */ e(
-                  v,
+                children: /* @__PURE__ */ i(
+                  _,
                   {
                     icon: " mng-lnc-close",
                     borderRadius: "curved",
@@ -242,67 +242,67 @@ const Y = T.a`
                     color: "neutral",
                     size: "medium",
                     onClick: () => {
-                      S();
+                      $();
                     }
                   }
                 )
               }
             ),
-            /* @__PURE__ */ e(V, { src: h, className: "wrapper__image" })
+            /* @__PURE__ */ i(K, { src: m, className: "wrapper__image" })
           ] }),
-          /* @__PURE__ */ t("div", { className: "wrapper__content", children: [
-            /* @__PURE__ */ t("div", { className: "wrapper__subcontent", children: [
-              /* @__PURE__ */ t("div", { className: "wrapper__info", children: [
-                /* @__PURE__ */ e("div", { className: "wrapper__title", children: m }),
-                g && /* @__PURE__ */ e(
+          /* @__PURE__ */ n("div", { className: "wrapper__content", children: [
+            /* @__PURE__ */ n("div", { className: "wrapper__subcontent", children: [
+              /* @__PURE__ */ n("div", { className: "wrapper__info", children: [
+                /* @__PURE__ */ i("div", { className: "wrapper__title", children: t }),
+                p && /* @__PURE__ */ i(
                   "div",
                   {
                     className: "action desktop-only",
-                    onClick: (i) => {
-                      i == null || i.preventDefault(), i == null || i.stopPropagation();
+                    onClick: (r) => {
+                      r == null || r.preventDefault(), r == null || r.stopPropagation();
                     },
-                    children: /* @__PURE__ */ e(
-                      v,
+                    children: /* @__PURE__ */ i(
+                      _,
                       {
                         icon: " mng-lnc-close",
                         borderRadius: "curved",
                         btnType: "basic",
                         color: "neutral",
                         onClick: () => {
-                          S();
+                          $();
                         }
                       }
                     )
                   }
                 )
               ] }),
-              /* @__PURE__ */ t("div", { className: "wrapper__tags-action", children: [
-                /* @__PURE__ */ e("div", { className: "wrapper__tags", children: a && (a == null ? void 0 : a.map((i, j) => /* @__PURE__ */ e(
-                  X,
+              /* @__PURE__ */ n("div", { className: "wrapper__tags-action", children: [
+                /* @__PURE__ */ i("div", { className: "wrapper__tags", children: o && (o == null ? void 0 : o.map((r, R) => /* @__PURE__ */ i(
+                  Q,
                   {
-                    color: i == null ? void 0 : i.color,
-                    children: i == null ? void 0 : i.name
+                    color: r == null ? void 0 : r.color,
+                    children: r == null ? void 0 : r.name
                   },
-                  `blog-card-sponsored-option__${j + 1}`
+                  `blog-card-sponsored-option__${R + 1}`
                 ))) }),
-                /* @__PURE__ */ t(
+                /* @__PURE__ */ n(
                   "div",
                   {
                     className: "info__content mobile-only",
-                    onClick: (i) => {
-                      i.stopPropagation(), i.preventDefault();
+                    onClick: (r) => {
+                      r.stopPropagation(), r.preventDefault();
                     },
                     children: [
-                      /* @__PURE__ */ e(z, {}),
-                      b && /* @__PURE__ */ e(
-                        v,
+                      /* @__PURE__ */ i(j, {}),
+                      u && /* @__PURE__ */ i(
+                        _,
                         {
                           icon: " mng-lnc-share",
                           borderRadius: "curved",
                           btnType: "basic",
                           color: "neutral",
                           onClick: () => {
-                            w();
+                            f();
                           }
                         }
                       )
@@ -311,40 +311,40 @@ const Y = T.a`
                 )
               ] })
             ] }),
-            /* @__PURE__ */ t("div", { className: "wrapper__info", children: [
-              /* @__PURE__ */ t("div", { className: "info__content", children: [
-                /* @__PURE__ */ e("div", { className: "info__text", children: `${J(
-                  p
-                )} • ${K(k, N)}` }),
-                /* @__PURE__ */ t("div", { className: "info__text", children: [
-                  /* @__PURE__ */ t("div", { children: [
-                    /* @__PURE__ */ e(L, { icon: " mng-lnc-thumbs-up--filled", sizeInUnits: "1rem" }),
-                    P($)
+            /* @__PURE__ */ n("div", { className: "wrapper__info", children: [
+              /* @__PURE__ */ n("div", { className: "info__content", children: [
+                /* @__PURE__ */ i("div", { className: "info__text", children: `${G(
+                  d
+                )} • ${H(w, y)}` }),
+                /* @__PURE__ */ n("div", { className: "info__text", children: [
+                  /* @__PURE__ */ n("div", { children: [
+                    /* @__PURE__ */ i(z, { icon: " mng-lnc-thumbs-up--filled", sizeInUnits: "1rem" }),
+                    I(v)
                   ] }),
-                  /* @__PURE__ */ t("div", { children: [
-                    /* @__PURE__ */ e(L, { icon: " mng-lnc-messages-filled", sizeInUnits: "1rem" }),
-                    P(C)
+                  /* @__PURE__ */ n("div", { children: [
+                    /* @__PURE__ */ i(z, { icon: " mng-lnc-messages-filled", sizeInUnits: "1rem" }),
+                    I(k)
                   ] })
                 ] })
               ] }),
-              /* @__PURE__ */ t(
+              /* @__PURE__ */ n(
                 "div",
                 {
                   className: "info__content desktop-only",
-                  onClick: (i) => {
-                    i == null || i.preventDefault(), i == null || i.stopPropagation();
+                  onClick: (r) => {
+                    r == null || r.preventDefault(), r == null || r.stopPropagation();
                   },
                   children: [
-                    /* @__PURE__ */ e(z, {}),
-                    b && /* @__PURE__ */ e(
-                      v,
+                    /* @__PURE__ */ i(j, {}),
+                    u && /* @__PURE__ */ i(
+                      _,
                       {
                         icon: " mng-lnc-share",
                         borderRadius: "curved",
                         btnType: "basic",
                         color: "neutral",
                         onClick: () => {
-                          w();
+                          f();
                         }
                       }
                     )
@@ -357,7 +357,7 @@ const Y = T.a`
       }
     );
   }
-), x = T.div`
+), x = S.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -381,133 +381,83 @@ const Y = T.a`
       bottom: -1.25rem;
     }
   }
-`, ee = T(c)`
+`, ee = S(V)`
   @media ${O("S")} {
     & > div {
       flex-direction: column;
     }
   }
-`, re = ({ keyPrefix: o }) => /* @__PURE__ */ t(ee, { children: [
-  /* @__PURE__ */ t(l, { children: [
-    /* @__PURE__ */ e(f, { height: "9.5rem", width: "17.75rem" }),
-    /* @__PURE__ */ t(c, { noGradient: !0, children: [
-      /* @__PURE__ */ e(n, { height: "1.5rem" }),
-      /* @__PURE__ */ t(l, { noGradient: !0, children: [
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" })
-      ] })
+`, re = ({ keyPrefix: a }) => /* @__PURE__ */ i(ee, { children: [1, 2, 3, 4, 5].map((t) => /* @__PURE__ */ n(P, { children: [
+  /* @__PURE__ */ i(c, { height: "9.5rem", width: "17.75rem" }),
+  /* @__PURE__ */ n(X, { children: [
+    /* @__PURE__ */ i(c, { height: "1.5rem", width: "100%" }),
+    /* @__PURE__ */ n(P, { children: [
+      /* @__PURE__ */ i(c, { width: "5rem", height: "1.25rem" }),
+      /* @__PURE__ */ i(c, { width: "5rem", height: "1.25rem" }),
+      /* @__PURE__ */ i(c, { width: "5rem", height: "1.25rem" }),
+      /* @__PURE__ */ i(c, { width: "5rem", height: "1.25rem" })
     ] })
-  ] }, `${o}-1`),
-  /* @__PURE__ */ t(l, { children: [
-    /* @__PURE__ */ e(f, { height: "9.5rem", width: "17.75rem" }),
-    /* @__PURE__ */ t(c, { noGradient: !0, children: [
-      /* @__PURE__ */ e(n, { height: "1.5rem" }),
-      /* @__PURE__ */ t(l, { noGradient: !0, children: [
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" })
-      ] })
-    ] })
-  ] }, `${o}-2`),
-  /* @__PURE__ */ t(l, { children: [
-    /* @__PURE__ */ e(f, { height: "9.5rem", width: "17.75rem" }),
-    /* @__PURE__ */ t(c, { noGradient: !0, children: [
-      /* @__PURE__ */ e(n, { height: "1.5rem" }),
-      /* @__PURE__ */ t(l, { noGradient: !0, children: [
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" })
-      ] })
-    ] })
-  ] }, `${o}-3`),
-  /* @__PURE__ */ t(l, { children: [
-    /* @__PURE__ */ e(f, { height: "9.5rem", width: "17.75rem" }),
-    /* @__PURE__ */ t(c, { noGradient: !0, children: [
-      /* @__PURE__ */ e(n, { height: "1.5rem" }),
-      /* @__PURE__ */ t(l, { noGradient: !0, children: [
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" })
-      ] })
-    ] })
-  ] }, `${o}-4`),
-  /* @__PURE__ */ t(l, { children: [
-    /* @__PURE__ */ e(f, { height: "9.5rem", width: "17.75rem" }),
-    /* @__PURE__ */ t(c, { noGradient: !0, children: [
-      /* @__PURE__ */ e(n, { height: "1.5rem" }),
-      /* @__PURE__ */ t(l, { noGradient: !0, children: [
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" }),
-        /* @__PURE__ */ e(n, { width: "5rem", height: "1.25rem" })
-      ] })
-    ] })
-  ] }, `${o}-5`)
-] }), ie = ({
-  keyPrefix: o,
-  isLoading: m = !1,
-  fallbackComponent: h = /* @__PURE__ */ e(y, {}),
-  children: a
-}) => /* @__PURE__ */ e(M, { fallbackComponent: h, children: m === !0 ? /* @__PURE__ */ e(re, { keyPrefix: o }) : a }), te = D(Z), ge = W(
+  ] })
+] }, `${a}-${t}`)) }), ie = ({
+  keyPrefix: a,
+  isLoading: t = !1,
+  fallbackComponent: m = /* @__PURE__ */ i(b, {}),
+  children: o
+}) => /* @__PURE__ */ i(M, { fallbackComponent: m, children: t === !0 ? /* @__PURE__ */ i(re, { keyPrefix: a }) : o }), ne = q(Z), fe = L(
   ({
-    timeToReadText: o = "{0} min read",
-    items: m,
-    isLoading: h = !1,
-    onSelectCard: a = () => {
+    timeToReadText: a = "{0} min read",
+    items: t,
+    isLoading: m = !1,
+    onSelectCard: o = () => {
     },
-    onShare: p = () => {
+    onShare: d = () => {
     },
-    onBookmark: k = () => {
+    onBookmark: w = () => {
     },
-    getImage: N = () => {
+    getImage: y = () => {
     },
-    isSeparated: $ = !0,
-    bookmarkComponent: C = /* @__PURE__ */ e(y, {}),
-    componentName: u,
-    LinkComponent: B,
-    hasShare: R = !0,
-    hasDelete: w = !1,
+    isSeparated: v = !0,
+    bookmarkComponent: k = /* @__PURE__ */ i(b, {}),
+    componentName: g,
+    LinkComponent: C,
+    hasShare: N = !0,
+    hasDelete: f = !1,
     onDelete: s = () => {
     }
-  }, d) => {
-    const _ = F(() => m == null ? void 0 : m.map((r, b) => {
-      var g;
-      return /* @__PURE__ */ e(
-        te,
+  }, l) => {
+    const h = D(() => t == null ? void 0 : t.map((e, u) => {
+      var p;
+      return /* @__PURE__ */ i(
+        ne,
         {
-          blogUuid: r == null ? void 0 : r.uuid,
-          title: r == null ? void 0 : r.title,
-          titleSlug: r == null ? void 0 : r.titleSlug,
-          options: r == null ? void 0 : r.options,
-          publishedAt: r == null ? void 0 : r.publishedAt,
-          timeToReadText: o,
-          timeToRead: r == null ? void 0 : r.timeToRead,
-          numberOfLikes: r == null ? void 0 : r.numberOfLikes,
-          numberOfComments: r == null ? void 0 : r.numberOfComments,
-          isSponsored: r == null ? void 0 : r.isSponsored,
-          isBookmarked: r == null ? void 0 : r.isBookmarked,
-          onSelectCard: (S, G) => a == null ? void 0 : a(r, G),
-          hasShare: R,
-          hasDelete: w,
-          onDelete: () => s == null ? void 0 : s(r),
-          onShare: () => p == null ? void 0 : p(r),
-          onBookmark: k,
-          imageUrl: N(r == null ? void 0 : r.imageUrl, r == null ? void 0 : r.uuid) || null,
-          bookmarkComponent: C,
-          metadata: { name: u, accessor: r == null ? void 0 : r.accessor },
-          LinkComponent: B
+          blogUuid: e == null ? void 0 : e.uuid,
+          title: e == null ? void 0 : e.title,
+          titleSlug: e == null ? void 0 : e.titleSlug,
+          options: e == null ? void 0 : e.options,
+          publishedAt: e == null ? void 0 : e.publishedAt,
+          timeToReadText: a,
+          timeToRead: e == null ? void 0 : e.timeToRead,
+          numberOfLikes: e == null ? void 0 : e.numberOfLikes,
+          numberOfComments: e == null ? void 0 : e.numberOfComments,
+          isSponsored: e == null ? void 0 : e.isSponsored,
+          isBookmarked: e == null ? void 0 : e.isBookmarked,
+          onSelectCard: ($, B) => o == null ? void 0 : o(e, B),
+          hasShare: N,
+          hasDelete: f,
+          onDelete: () => s == null ? void 0 : s(e),
+          onShare: () => d == null ? void 0 : d(e),
+          onBookmark: w,
+          imageUrl: y(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
+          bookmarkComponent: k,
+          metadata: { name: g, accessor: e == null ? void 0 : e.accessor },
+          LinkComponent: C
         },
-        `blog-card-item__${b + 1}__${(g = r == null ? void 0 : r.isBookmarked) == null ? void 0 : g.toString()}`
+        `blog-card-item__${u + 1}__${(p = e == null ? void 0 : e.isBookmarked) == null ? void 0 : p.toString()}`
       );
-    }), [m]);
-    return /* @__PURE__ */ e(ie, { isLoading: h, keyPrefix: "blog-list-skeleton", children: /* @__PURE__ */ e(x, { ref: d, className: $ ? "separated" : "", children: _ }) });
+    }), [t]);
+    return /* @__PURE__ */ i(ie, { isLoading: m, keyPrefix: "blog-list-skeleton", children: /* @__PURE__ */ i(x, { ref: l, className: v ? "separated" : "", children: h }) });
   }
 );
 export {
-  ge as default
+  fe as default
 };

package/dist/BlogProductCardsSection.cjs

@@ -1 +1 @@
-"use strict";const i=require("react/jsx-runtime"),c=require("react"),j=require("./useDetectMobile-DYV6V1yw.cjs"),M=require("./index-Cav6G7wx.cjs"),N=require("./Button.cjs"),y=require("./style-AYc9hnFj.cjs"),P=c.memo(M.SimpleProductCard),R=c.forwardRef(({buttonText:o,buttonLink:t,items:r,onButtonAction:a=()=>{},onSelectCard:s=()=>{},getImage:l=()=>{},isHighlight:n=!1,componentName:d,LinkComponent:p},m)=>{const b=j.useDetectMobile(),g=c.useMemo(()=>{var u;return(u=r==null?void 0:r.slice(0,4))==null?void 0:u.map((e,q)=>i.jsx(P,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,currency:e==null?void 0:e.currency,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:(_,h)=>s==null?void 0:s(e==null?void 0:e.uuid,h),image:l(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,metadata:{name:d,accessor:e==null?void 0:e.accessor},LinkComponent:p},q))},[r]);return i.jsxs(y.Wrapper,{ref:m,className:`blog-product-cards-section ${n?"highlight":""}`,children:[i.jsx("div",{className:"wrapper__grid",children:g}),i.jsx(N,{text:o,borderRadius:"curved",btnType:b?"basic":"outline",color:"neutral",className:"wrapper__action",onClick:()=>a(t)})]})});module.exports=R;
+"use strict";const i=require("react/jsx-runtime"),c=require("react"),j=require("./useDetectMobile-DYV6V1yw.cjs"),M=require("./index-BkztbBWe.cjs"),N=require("./Button.cjs"),y=require("./style-DIWAdlai.cjs"),P=c.memo(M.SimpleProductCard),R=c.forwardRef(({buttonText:o,buttonLink:t,items:r,onButtonAction:a=()=>{},onSelectCard:s=()=>{},getImage:l=()=>{},isHighlight:n=!1,componentName:d,LinkComponent:p},m)=>{const b=j.useDetectMobile(),g=c.useMemo(()=>{var u;return(u=r==null?void 0:r.slice(0,4))==null?void 0:u.map((e,q)=>i.jsx(P,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,currency:e==null?void 0:e.currency,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:(_,h)=>s==null?void 0:s(e==null?void 0:e.uuid,h),image:l(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,metadata:{name:d,accessor:e==null?void 0:e.accessor},LinkComponent:p},q))},[r]);return i.jsxs(y.Wrapper,{ref:m,className:`blog-product-cards-section ${n?"highlight":""}`,children:[i.jsx("div",{className:"wrapper__grid",children:g}),i.jsx(N,{text:o,borderRadius:"curved",btnType:b?"basic":"outline",color:"neutral",className:"wrapper__action",onClick:()=>a(t)})]})});module.exports=R;

package/dist/BlogProductCardsSection.js

@@ -1,9 +1,9 @@
 import { jsx as i, jsxs as h } from "react/jsx-runtime";
 import { memo as N, forwardRef as M, useMemo as P } from "react";
-import { u as _ } from "./useDetectMobile-CcVo3PNi.js";
-import { S as w } from "./index-D9fI5BvI.js";
+import { u as _ } from "./useDetectMobile-B0Jog4jQ.js";
+import { S as w } from "./index-jGcy-5M_.js";
 import y from "./Button.js";
-import { W as U } from "./style-Bq3rMbnN.js";
+import { W as U } from "./style-BzaX45du.js";
 const j = N(w), C = M(
   ({
     buttonText: a,

package/dist/BlogShopCardsSection.cjs

@@ -1 +1 @@
-"use strict";const i=require("react/jsx-runtime"),o=require("react"),q=require("./useDetectMobile-DYV6V1yw.cjs"),_=require("./index-B1-PjbTA.cjs"),f=require("./Button.cjs"),j=require("./style-AYc9hnFj.cjs"),w=o.memo(_.ShopCard),M=o.forwardRef(({buttonText:u,buttonLink:a,items:r,onButtonAction:c=()=>{},onSelectCard:s=()=>{},isLoading:v=!1,limit:R=4,getImage:n=()=>{},isHighlight:l=!1,componentName:d},p)=>{const h=q.useDetectMobile(),m=o.useMemo(()=>{var t;return(t=r==null?void 0:r.slice(0,4))==null?void 0:t.map((e,g)=>i.jsx(w,{uuid:e==null?void 0:e.uuid,title:e==null?void 0:e.name,subtitle:e==null?void 0:e.shortDescription,rating:e==null?void 0:e.rating,reviewCount:e==null?void 0:e.reviewCount,onSelectCard:(C,b)=>s==null?void 0:s(e==null?void 0:e.uuid,b),image:n(e==null?void 0:e.profileImage,e==null?void 0:e.uuid)||null,hideProducts:!0,metadata:{name:d,accessor:e==null?void 0:e.accessor}},`shop-card__${g+1}`))},[r]);return i.jsxs(j.Wrapper,{ref:p,className:l?"highlight":"",children:[i.jsx("div",{className:"wrapper__grid",children:m}),i.jsx(f,{text:u,borderRadius:"curved",btnType:h?"basic":"outline",color:"neutral",className:"wrapper__action",onClick:()=>c(a)})]})});module.exports=M;
+"use strict";const i=require("react/jsx-runtime"),o=require("react"),q=require("./useDetectMobile-DYV6V1yw.cjs"),_=require("./index-D4-_TrSn.cjs"),f=require("./Button.cjs"),j=require("./style-DIWAdlai.cjs"),w=o.memo(_.ShopCard),M=o.forwardRef(({buttonText:u,buttonLink:a,items:r,onButtonAction:c=()=>{},onSelectCard:s=()=>{},isLoading:v=!1,limit:R=4,getImage:n=()=>{},isHighlight:l=!1,componentName:d},p)=>{const h=q.useDetectMobile(),m=o.useMemo(()=>{var t;return(t=r==null?void 0:r.slice(0,4))==null?void 0:t.map((e,g)=>i.jsx(w,{uuid:e==null?void 0:e.uuid,title:e==null?void 0:e.name,subtitle:e==null?void 0:e.shortDescription,rating:e==null?void 0:e.rating,reviewCount:e==null?void 0:e.reviewCount,onSelectCard:(C,b)=>s==null?void 0:s(e==null?void 0:e.uuid,b),image:n(e==null?void 0:e.profileImage,e==null?void 0:e.uuid)||null,hideProducts:!0,metadata:{name:d,accessor:e==null?void 0:e.accessor}},`shop-card__${g+1}`))},[r]);return i.jsxs(j.Wrapper,{ref:p,className:l?"highlight":"",children:[i.jsx("div",{className:"wrapper__grid",children:m}),i.jsx(f,{text:u,borderRadius:"curved",btnType:h?"basic":"outline",color:"neutral",className:"wrapper__action",onClick:()=>c(a)})]})});module.exports=M;

package/dist/BlogShopCardsSection.js

@@ -1,9 +1,9 @@
 import { jsx as i, jsxs as g } from "react/jsx-runtime";
 import { memo as b, forwardRef as _, useMemo as w } from "react";
-import { u as v } from "./useDetectMobile-CcVo3PNi.js";
-import { S as M } from "./index-BEUk0FDk.js";
+import { u as v } from "./useDetectMobile-B0Jog4jQ.js";
+import { S as M } from "./index-Dx2hfxCG.js";
 import C from "./Button.js";
-import { W as N } from "./style-Bq3rMbnN.js";
+import { W as N } from "./style-BzaX45du.js";
 const S = b(M), L = _(
   ({
     buttonText: t,