@lanaco/lnc-react-ui 4.0.127 → 4.0.129

package/dist/BannerSectionSimple.js

@@ -1,10 +1,11 @@
-import { jsxs as r, jsx as t } from "react/jsx-runtime";
-import { forwardRef as H } from "react";
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+import { forwardRef as M } from "react";
 import { s as o } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as n } from "./consts-BuFChS64.js";
-import M from "./Button.js";
-import { u as k } from "./useDetectMobile-Bkvj0VMa.js";
-const C = o.div`
+import k from "./Button.js";
+import { u as C } from "./useDetectMobile-Bkvj0VMa.js";
+import { l as B } from "./utils-BPdU4_1q.js";
+const I = o.div`
   display: flex;
   border-radius: 0.75rem;
   background-color: ${(e) => e.bgcolor || "transparent"};
@@ -25,6 +26,14 @@ const C = o.div`
     min-height: ${(e) => `${e.height}px` || "22.5rem"};
   }
 
+  & .header-image {
+    max-width: 148px;
+    max-height: 148px;
+    position: absolute;
+    left: 2rem;
+    top: 0;
+  }
+
   ${(e) => e.hasBorder === !0 && `border: 1px solid var(--gray-95008, rgba(20, 22, 26, 0.08));
   box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
 
@@ -48,13 +57,22 @@ const C = o.div`
       max-height: ${(e) => `${e.imgHMob}px` || "12.1rem"};
       min-height: ${(e) => `${e.imgHMob}px` || "12.1rem"};
     }
+
+    & .header-image {
+      max-width: 128px;
+      max-height: 128px;
+      min-width: 128px;
+      position: absolute;
+      left: 0;
+    }
   }
-`, B = o.div`
+`, N = o.div`
   padding: ${(e) => e.smallPadding === !0 ? "2rem" : "4rem 5rem"};
   display: flex;
   gap: 2rem;
   flex-direction: ${(e) => e.isHorizontalContent === !0 ? "row" : "column"};
   flex: 1;
+  z-index: 2;
 
   ${(e) => e.isHorizontalContent === !0 && "justify-content: space-between;"}
 
@@ -76,6 +94,8 @@ const C = o.div`
   @media (max-width: ${n + "px"}) {
     padding: 0;
     flex-direction: column;
+
+    ${(e) => e != null && e.hasHeaderImage ? "padding: 1rem 3rem;" : ""}
   }
 `, W = o.div`
   display: flex;
@@ -116,68 +136,71 @@ const C = o.div`
       letter-spacing: -0.0112rem;
     }
   }
-`, L = H((e, g) => {
+`, _ = M((e, s) => {
   const {
-    title: s,
-    subtitle: c,
-    buttonText: p,
-    buttonLink: x,
+    title: c,
+    subtitle: p,
+    buttonText: x,
+    buttonLink: f,
     onButtonAction: u = () => {
     },
-    imageUrl: a,
-    imagePosition: m = "right",
-    hideImageForMobile: l = !1,
-    sectionHeight: f = "12.65625rem",
-    imageWidth: b,
-    imageHeightMobile: $,
-    smallPadding: w = !1,
-    isHorizontalContent: y = !1,
-    backgroundColor: v,
-    hasBorder: z = !1
-  } = e, h = k();
-  return /* @__PURE__ */ r(
-    C,
+    imageUrl: m,
+    imagePosition: l = "right",
+    hideImageForMobile: h = !1,
+    sectionHeight: b = "12.65625rem",
+    imageWidth: $,
+    imageHeightMobile: w,
+    smallPadding: y = !1,
+    isHorizontalContent: v = !1,
+    backgroundColor: H,
+    hasBorder: z = !1,
+    headerImageUrl: i
+  } = e, d = C();
+  return /* @__PURE__ */ a(
+    I,
     {
-      ref: g,
-      bgcolor: v,
-      height: f,
-      imgW: b,
-      imgHMob: $,
+      ref: s,
+      bgcolor: H,
+      height: b,
+      imgW: $,
+      imgHMob: w,
       hasBorder: z,
       children: [
-        m !== "right" && !(l === !0 && h === !0) && /* @__PURE__ */ t("img", { src: a }),
-        /* @__PURE__ */ r(
-          B,
+        i && /* @__PURE__ */ t("img", { src: i, className: "header-image", alt: "Header image" }),
+        l !== "right" && !(h === !0 && d === !0) && /* @__PURE__ */ t("img", { src: m, className: "banner-image" }),
+        /* @__PURE__ */ a(
+          N,
           {
-            isHorizontalContent: y,
-            smallPadding: w,
+            isHorizontalContent: v,
+            smallPadding: y,
+            hasHeaderImage: B(i),
             children: [
-              /* @__PURE__ */ r(W, { children: [
-                /* @__PURE__ */ t("div", { className: "header-title", children: s }),
-                /* @__PURE__ */ t("div", { className: "header-subitle", children: c })
+              /* @__PURE__ */ a(W, { children: [
+                /* @__PURE__ */ t("div", { className: "header-title", children: c }),
+                /* @__PURE__ */ t("div", { className: "header-subitle", children: p })
               ] }),
               /* @__PURE__ */ t(
-                M,
+                k,
                 {
                   size: "medium",
                   color: "neutral",
                   type: "button",
                   className: "header-button",
-                  onClick: (i) => {
-                    var d;
-                    (d = i == null ? void 0 : i.target) == null || d.blur(), u(x);
+                  onClick: (r) => {
+                    var g;
+                    (g = r == null ? void 0 : r.target) == null || g.blur(), u(f);
                   },
-                  children: p
+                  children: x
                 }
               )
             ]
           }
         ),
-        m === "right" && !(l === !0 && h === !0) && /* @__PURE__ */ t("img", { src: a })
+        l === "right" && !(h === !0 && d === !0) && /* @__PURE__ */ t("img", { src: m, className: "banner-image" })
       ]
     }
   );
 });
 export {
-  L as default
+  _ as default
 };

package/dist/BlogExploreSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),q=require("react"),n=require("./index-BpbMKBf_.cjs"),G=require("./utils-DmMdPm9O.cjs"),J=require("./TextInput.cjs"),j=require("./Icon.cjs"),K=require("./Link.cjs"),C=require("./DropdownMenu.cjs"),z=require("./DropdownItem.cjs"),Q=require("./tag-Bov1gw34.cjs"),W=require("./BlogProductCardsSection.cjs"),P=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./BlogListSection.cjs"),Y=require("./consts-goSZX3xP.cjs"),B=P.styled.div`
+"use strict";const e=require("react/jsx-runtime"),q=require("react"),n=require("./index-BpbMKBf_.cjs"),C=require("./utils-DmMdPm9O.cjs"),J=require("./TextInput.cjs"),j=require("./Icon.cjs"),K=require("./Link.cjs"),z=require("./DropdownMenu.cjs"),I=require("./DropdownItem.cjs"),Q=require("./tag-Bov1gw34.cjs"),W=require("./BlogProductCardsSection.cjs"),P=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./BlogListSection.cjs"),Y=require("./consts-goSZX3xP.cjs"),B=P.styled.div`
   display: flex;
   justify-content: space-between;
   align-items: center;
@@ -79,7 +79,7 @@
       }
     }
   }
-`,O=q.forwardRef(({perPageOptions:o=[{code:10,name:"Show 10 items"},{code:25,name:"Show 25 items"},{code:50,name:"Show 50 items"}],perPage:m,handlePerPage:_=()=>{},page:s=1,handlePage:c=()=>{},totalPage:r},d)=>{var h,l;const p=()=>{s>1&&(c==null||c(s-1))},f=()=>{s<r&&(c==null||c(s+1))},x=()=>{const t=[];if(r<=7)for(let a=1;a<=r;a++)t.push(a);else s<=3?t.push(1,2,3,"...",r):s>=r-2?t.push(1,"...",r-2,r-1,r):t.push(1,2,3,"...",r);return t==null?void 0:t.map((a,u)=>a==="..."?e.jsx("div",{className:"pagination__page ellipsis",children:a},`pagination-ellipsis__${u}`):e.jsx("div",{onClick:()=>c(a),className:`pagination__page ${s===a?"active":""}`,children:a},`pagination-page__${u}`))};return e.jsxs(B,{className:"pagination",children:[e.jsx(C,{color:"neutral",control:((h=o==null?void 0:o.find(t=>(t==null?void 0:t.code)===m))==null?void 0:h.name)||((l=o[0])==null?void 0:l.name),placement:"bottom",zIndex:1001,className:"pagination__per-page",children:o==null?void 0:o.map((t,a)=>e.jsx(z,{active:(t==null?void 0:t.code)===(m==null?void 0:m.code),className:"sort-by__item",onClick:()=>_(t),children:t==null?void 0:t.name},`blog-epxlore-section-per-page-option__${a+1}`))}),e.jsxs("div",{className:"pagination__pages",children:[e.jsx("div",{className:`pagination__page ${s===1?"disabled":""}`,onClick:p,children:e.jsx(j,{icon:" mng-lnc-chevron--left"})}),x(),e.jsx("div",{className:`pagination__page ${s===r?"disabled":""}`,onClick:f,children:e.jsx(j,{icon:" mng-lnc-chevron--right"})})]})]})}),ee=P.styled.div`
+`,O=q.forwardRef(({perPageOptions:o=[{code:10,name:"Show 10 items"},{code:25,name:"Show 25 items"},{code:50,name:"Show 50 items"}],perPage:m,handlePerPage:_=()=>{},page:s=1,handlePage:c=()=>{},totalPage:r},d)=>{var h,l;const p=()=>{s>1&&(c==null||c(s-1))},f=()=>{s<r&&(c==null||c(s+1))},x=()=>{const t=[];if(r<=7)for(let a=1;a<=r;a++)t.push(a);else s<=3?t.push(1,2,3,"...",r):s>=r-2?t.push(1,"...",r-2,r-1,r):t.push(1,2,3,"...",r);return t==null?void 0:t.map((a,u)=>a==="..."?e.jsx("div",{className:"pagination__page ellipsis",children:a},`pagination-ellipsis__${u}`):e.jsx("div",{onClick:()=>c(a),className:`pagination__page ${s===a?"active":""}`,children:a},`pagination-page__${u}`))};return e.jsxs(B,{className:"pagination",children:[e.jsx(z,{color:"neutral",control:((h=o==null?void 0:o.find(t=>(t==null?void 0:t.code)===m))==null?void 0:h.name)||((l=o[0])==null?void 0:l.name),placement:"bottom",zIndex:1001,className:"pagination__per-page",children:o==null?void 0:o.map((t,a)=>e.jsx(I,{active:(t==null?void 0:t.code)===(m==null?void 0:m.code),className:"sort-by__item",onClick:()=>_(t),children:t==null?void 0:t.name},`blog-epxlore-section-per-page-option__${a+1}`))}),e.jsxs("div",{className:"pagination__pages",children:[e.jsx("div",{className:`pagination__page ${s===1?"disabled":""}`,onClick:p,children:e.jsx(j,{icon:" mng-lnc-chevron--left"})}),x(),e.jsx("div",{className:`pagination__page ${s===r?"disabled":""}`,onClick:f,children:e.jsx(j,{icon:" mng-lnc-chevron--right"})})]})]})}),ee=P.styled.div`
   display: flex;
   align-items: flex-start;
   gap: 2rem;
@@ -255,6 +255,7 @@
             font-style: normal;
             font-weight: 500;
             line-height: 1.25rem;
+            ${C.truncateTextInRows(2)}
           }
 
           & .item__description {
@@ -316,4 +317,4 @@
       display: none;
     }
   }
-`,I=q.forwardRef(({mainTitle:o,sideTitle:m,tags:_,selectedTag:s,handleSelectTag:c=()=>{},blogs:r,miniBlogs:d,products:p,blogsLoading:f=!1,productsLoading:x=!1,sortingOptions:h,sortBy:l,handleSortBy:t=()=>{},allTagText:a="All",searchPlaceholderText:u="Search blogs",timeToReadText:w="{0} min read",getBlogImageUrl:y=()=>{},handleSelectBlog:g=()=>{},handleSelectBlogTag:b=()=>{},handleShareBlog:N=()=>{},handleBookmarkBlog:k=()=>{},showAllButtonLink:L,showAllButtonText:$="Show all products",viewAllButtonText:A="View all (11)",viewAllButtonLink:ne,handleViewAll:R=()=>{},handleShowAll:D=()=>{},handleSelectProduct:E=()=>{},getProductImageUrl:M=()=>{},page:U,handlePage:F=()=>{},perPage:H,handlePerPage:V=()=>{},totalPage:v,perPageOptions:X,handleSearch:Z=()=>{}},re)=>e.jsxs(ee,{children:[e.jsxs("div",{className:"landing__main-content",children:[o&&e.jsx("div",{className:"main-content__title",children:o}),_&&e.jsx(Q.FaqSectionTags,{tags:_,allTagText:a,selectedTag:s,onSelectTag:c}),e.jsxs("div",{className:"main-content__actions",children:[e.jsx(J,{className:"main-content__search",placeholder:u,debounceTime:200,prefix:e.jsx(j,{icon:" mng-lnc-search",sizeInUnits:"1.25rem",className:"main-content__search-prefix"}),color:"neutral",onChange:Z}),e.jsx(C,{color:"neutral",control:l==null?void 0:l.name,zIndex:1001,className:"main-content__sort-by",children:h==null?void 0:h.map((i,T)=>e.jsx(z,{active:(i==null?void 0:i.code)===(l==null?void 0:l.code),className:"sort-by__item",onClick:()=>t(i),children:i==null?void 0:i.name},`blog-epxlore-section-sorting-option__${T+1}`))})]}),e.jsxs("div",{className:"main-content__items",children:[r&&(r==null?void 0:r.length)>0&&e.jsx(S,{timeToReadText:w,items:r==null?void 0:r.slice(0,5),isLoading:f,getImage:y,onSelectCard:g,onSelectOption:b,onShare:N,onBookmark:k}),e.jsx("div",{className:"main-content__divider"}),p&&(p==null?void 0:p.length)>0&&e.jsx(W,{buttonText:$,buttonLink:L,onButtonAction:D,onSelectCard:E,items:p,isLoading:x,getImage:M,isHighlight:!0}),e.jsx("div",{className:"main-content__divider"}),r&&(r==null?void 0:r.length)>0&&e.jsx(S,{timeToReadText:w,items:r==null?void 0:r.slice(5),isLoading:f,getImage:y,onSelectCard:g,onSelectOption:b,onShare:N,onBookmark:k})]}),v&&v>1&&e.jsx(O,{perPageOptions:X,perPage:H,handlePerPage:V,page:U,handlePage:F,totalPage:v})]}),e.jsxs("div",{className:"landing__side-content",children:[m&&e.jsx("div",{className:"side-content__title",children:m}),e.jsx("div",{className:"side-content__items",children:d&&(d==null?void 0:d.length)>0&&(d==null?void 0:d.map((i,T)=>e.jsxs("div",{className:"side-content__item",onClick:()=>g(i),children:[e.jsx("img",{src:y(i==null?void 0:i.imageUrl,i==null?void 0:i.uuid)||null,alt:`Mini blog ${T+1}`,className:"item__image"}),e.jsxs("div",{className:"item__content",children:[e.jsx("div",{className:"item__title",children:i==null?void 0:i.title}),e.jsx("div",{className:"item__description",children:G.formatLocaleDateString(i==null?void 0:i.publishedAt)})]})]})))}),e.jsx(K,{onClick:R,className:"side-content__link",children:A})]})]}));I.propTypes={mainTitle:n.PropTypes.string,sideTitle:n.PropTypes.string,tags:n.PropTypes.array,selectedTag:n.PropTypes.any,handleSelectTag:n.PropTypes.func,blogs:n.PropTypes.array,miniBlogs:n.PropTypes.array,products:n.PropTypes.array,blogsLoading:n.PropTypes.bool,productsLoading:n.PropTypes.bool,sortingOptions:n.PropTypes.array,sortBy:n.PropTypes.any,handleSortBy:n.PropTypes.func,allTagText:n.PropTypes.string,searchPlaceholderText:n.PropTypes.string,timeToReadText:n.PropTypes.string,getBlogImageUrl:n.PropTypes.func,handleSelectBlog:n.PropTypes.func,handleSelectBlogTag:n.PropTypes.func,handleShareBlog:n.PropTypes.func,handleBookmarkBlog:n.PropTypes.func,showAllButtonLink:n.PropTypes.string,showAllButtonText:n.PropTypes.string,viewAllButtonText:n.PropTypes.string,handleShowAll:n.PropTypes.func,handleSelectProduct:n.PropTypes.func,getProductImageUrl:n.PropTypes.func,page:n.PropTypes.number,handlePage:n.PropTypes.func,perPage:n.PropTypes.any,handlePerPage:n.PropTypes.func,totalPage:n.PropTypes.number,perPageOptions:n.PropTypes.array,handleSearch:n.PropTypes.func};module.exports=I;
+`,L=q.forwardRef(({mainTitle:o,sideTitle:m,tags:_,selectedTag:s,handleSelectTag:c=()=>{},blogs:r,miniBlogs:d,products:p,blogsLoading:f=!1,productsLoading:x=!1,sortingOptions:h,sortBy:l,handleSortBy:t=()=>{},allTagText:a="All",searchPlaceholderText:u="Search blogs",timeToReadText:w="{0} min read",getBlogImageUrl:y=()=>{},handleSelectBlog:g=()=>{},handleSelectBlogTag:b=()=>{},handleShareBlog:N=()=>{},handleBookmarkBlog:k=()=>{},showAllButtonLink:$,showAllButtonText:A="Show all products",viewAllButtonText:R="View all (11)",viewAllButtonLink:ne,handleViewAll:D=()=>{},handleShowAll:E=()=>{},handleSelectProduct:M=()=>{},getProductImageUrl:F=()=>{},page:U,handlePage:H=()=>{},perPage:V,handlePerPage:X=()=>{},totalPage:v,perPageOptions:Z,handleSearch:G=()=>{}},re)=>e.jsxs(ee,{children:[e.jsxs("div",{className:"landing__main-content",children:[o&&e.jsx("div",{className:"main-content__title",children:o}),_&&e.jsx(Q.FaqSectionTags,{tags:_,allTagText:a,selectedTagCode:s,onSelectTag:c}),e.jsxs("div",{className:"main-content__actions",children:[e.jsx(J,{className:"main-content__search",placeholder:u,debounceTime:200,prefix:e.jsx(j,{icon:" mng-lnc-search",sizeInUnits:"1.25rem",className:"main-content__search-prefix"}),color:"neutral",onChange:G}),e.jsx(z,{color:"neutral",control:l==null?void 0:l.name,zIndex:1001,className:"main-content__sort-by",children:h==null?void 0:h.map((i,T)=>e.jsx(I,{active:(i==null?void 0:i.code)===(l==null?void 0:l.code),className:"sort-by__item",onClick:()=>t(i),children:i==null?void 0:i.name},`blog-epxlore-section-sorting-option__${T+1}`))})]}),e.jsxs("div",{className:"main-content__items",children:[r&&(r==null?void 0:r.length)>0&&e.jsx(S,{timeToReadText:w,items:r==null?void 0:r.slice(0,5),isLoading:f,getImage:y,onSelectCard:g,onSelectOption:b,onShare:N,onBookmark:k}),e.jsx("div",{className:"main-content__divider"}),p&&(p==null?void 0:p.length)>0&&e.jsx(W,{buttonText:A,buttonLink:$,onButtonAction:E,onSelectCard:M,items:p,isLoading:x,getImage:F,isHighlight:!0}),e.jsx("div",{className:"main-content__divider"}),r&&(r==null?void 0:r.length)>0&&e.jsx(S,{timeToReadText:w,items:r==null?void 0:r.slice(5),isLoading:f,getImage:y,onSelectCard:g,onSelectOption:b,onShare:N,onBookmark:k})]}),v&&v>1&&e.jsx(O,{perPageOptions:Z,perPage:V,handlePerPage:X,page:U,handlePage:H,totalPage:v})]}),e.jsxs("div",{className:"landing__side-content",children:[m&&e.jsx("div",{className:"side-content__title",children:m}),d&&(d==null?void 0:d.length)>0&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"side-content__items",children:d==null?void 0:d.map((i,T)=>e.jsxs("div",{className:"side-content__item",onClick:()=>g(i),children:[e.jsx("img",{src:y(i==null?void 0:i.imageUrl,i==null?void 0:i.uuid)||null,alt:`Mini blog ${T+1}`,className:"item__image"}),e.jsxs("div",{className:"item__content",children:[e.jsx("div",{className:"item__title",children:i==null?void 0:i.title}),e.jsx("div",{className:"item__description",children:C.formatLocaleDateString(i==null?void 0:i.publishedAt)})]})]}))}),e.jsx(K,{onClick:D,className:"side-content__link",children:R})]})]})]}));L.propTypes={mainTitle:n.PropTypes.string,sideTitle:n.PropTypes.string,tags:n.PropTypes.array,selectedTag:n.PropTypes.any,handleSelectTag:n.PropTypes.func,blogs:n.PropTypes.array,miniBlogs:n.PropTypes.array,products:n.PropTypes.array,blogsLoading:n.PropTypes.bool,productsLoading:n.PropTypes.bool,sortingOptions:n.PropTypes.array,sortBy:n.PropTypes.any,handleSortBy:n.PropTypes.func,allTagText:n.PropTypes.string,searchPlaceholderText:n.PropTypes.string,timeToReadText:n.PropTypes.string,getBlogImageUrl:n.PropTypes.func,handleSelectBlog:n.PropTypes.func,handleSelectBlogTag:n.PropTypes.func,handleShareBlog:n.PropTypes.func,handleBookmarkBlog:n.PropTypes.func,showAllButtonLink:n.PropTypes.string,showAllButtonText:n.PropTypes.string,viewAllButtonText:n.PropTypes.string,handleShowAll:n.PropTypes.func,handleSelectProduct:n.PropTypes.func,getProductImageUrl:n.PropTypes.func,page:n.PropTypes.number,handlePage:n.PropTypes.func,perPage:n.PropTypes.any,handlePerPage:n.PropTypes.func,totalPage:n.PropTypes.number,perPageOptions:n.PropTypes.array,handleSearch:n.PropTypes.func};module.exports=L;

package/dist/BlogExploreSection.js

@@ -1,18 +1,18 @@
-import { jsxs as d, jsx as n } from "react/jsx-runtime";
+import { jsxs as l, jsx as n, Fragment as J } from "react/jsx-runtime";
 import { forwardRef as I } from "react";
 import { P as e } from "./index-CblbdqjE.js";
-import { s as J } from "./utils-BPdU4_1q.js";
-import K from "./TextInput.js";
+import { p as K, s as Q } from "./utils-BPdU4_1q.js";
+import W from "./TextInput.js";
 import N from "./Icon.js";
-import Q from "./Link.js";
+import Y from "./Link.js";
 import L from "./DropdownMenu.js";
 import $ from "./DropdownItem.js";
-import { F as W } from "./tag-CtleOqEC.js";
-import Y from "./BlogProductCardsSection.js";
+import { F as B } from "./tag-CtleOqEC.js";
+import O from "./BlogProductCardsSection.js";
 import { s as A } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import z from "./BlogListSection.js";
-import { M as B } from "./consts-BuFChS64.js";
-const O = A.div`
+import { M as P } from "./consts-BuFChS64.js";
+const ee = A.div`
   display: flex;
   justify-content: space-between;
   align-items: center;
@@ -93,7 +93,7 @@ const O = A.div`
       }
     }
   }
-`, P = I(
+`, ne = I(
   ({
     perPageOptions: o = [
       { code: 10, name: "Show 10 items" },
@@ -104,15 +104,15 @@ const O = A.div`
     handlePerPage: u = () => {
     },
     page: c = 1,
-    handlePage: l = () => {
+    handlePage: s = () => {
     },
     totalPage: t
   }, m) => {
-    var _, s;
+    var _, d;
     const h = () => {
-      c > 1 && (l == null || l(c - 1));
+      c > 1 && (s == null || s(c - 1));
     }, g = () => {
-      c < t && (l == null || l(c + 1));
+      c < t && (s == null || s(c + 1));
     }, v = () => {
       const r = [];
       if (t <= 7)
@@ -130,19 +130,19 @@ const O = A.div`
       ) : /* @__PURE__ */ n(
         "div",
         {
-          onClick: () => l(a),
+          onClick: () => s(a),
           className: `pagination__page ${c === a ? "active" : ""}`,
           children: a
         },
         `pagination-page__${p}`
       ));
     };
-    return /* @__PURE__ */ d(O, { className: "pagination", children: [
+    return /* @__PURE__ */ l(ee, { className: "pagination", children: [
       /* @__PURE__ */ n(
         L,
         {
           color: "neutral",
-          control: ((_ = o == null ? void 0 : o.find((r) => (r == null ? void 0 : r.code) === f)) == null ? void 0 : _.name) || ((s = o[0]) == null ? void 0 : s.name),
+          control: ((_ = o == null ? void 0 : o.find((r) => (r == null ? void 0 : r.code) === f)) == null ? void 0 : _.name) || ((d = o[0]) == null ? void 0 : d.name),
           placement: "bottom",
           zIndex: 1001,
           className: "pagination__per-page",
@@ -158,7 +158,7 @@ const O = A.div`
           ))
         }
       ),
-      /* @__PURE__ */ d("div", { className: "pagination__pages", children: [
+      /* @__PURE__ */ l("div", { className: "pagination__pages", children: [
         /* @__PURE__ */ n(
           "div",
           {
@@ -179,7 +179,7 @@ const O = A.div`
       ] })
     ] });
   }
-), ee = A.div`
+), te = A.div`
   display: flex;
   align-items: flex-start;
   gap: 2rem;
@@ -355,6 +355,7 @@ const O = A.div`
             font-style: normal;
             font-weight: 500;
             line-height: 1.25rem;
+            ${K(2)}
           }
 
           & .item__description {
@@ -369,7 +370,7 @@ const O = A.div`
     }
   }
 
-  @media (max-width: ${B + "px"}) {
+  @media (max-width: ${P + "px"}) {
     flex-direction: column;
 
     & .landing__main-content {
@@ -416,13 +417,13 @@ const O = A.div`
       display: none;
     }
   }
-`, ne = I(
+`, re = I(
   ({
     mainTitle: o,
     sideTitle: f,
     tags: u,
     selectedTag: c,
-    handleSelectTag: l = () => {
+    handleSelectTag: s = () => {
     },
     blogs: t,
     miniBlogs: m,
@@ -430,7 +431,7 @@ const O = A.div`
     blogsLoading: g = !1,
     productsLoading: v = !1,
     sortingOptions: _,
-    sortBy: s,
+    sortBy: d,
     handleSortBy: r = () => {
     },
     allTagText: a = "All",
@@ -442,24 +443,24 @@ const O = A.div`
     },
     handleSelectBlogTag: S = () => {
     },
-    handleShareBlog: C = () => {
+    handleShareBlog: T = () => {
     },
-    handleBookmarkBlog: T = () => {
+    handleBookmarkBlog: C = () => {
     },
     showAllButtonLink: j,
     showAllButtonText: M = "Show all products",
     viewAllButtonText: D = "View all (11)",
-    viewAllButtonLink: te,
+    viewAllButtonLink: ie,
     handleViewAll: E = () => {
     },
     handleShowAll: F = () => {
     },
-    handleSelectProduct: U = () => {
+    handleSelectProduct: R = () => {
     },
-    getProductImageUrl: q = () => {
+    getProductImageUrl: U = () => {
     },
-    page: H,
-    handlePage: R = () => {
+    page: q,
+    handlePage: H = () => {
     },
     perPage: V,
     handlePerPage: X = () => {
@@ -468,21 +469,21 @@ const O = A.div`
     perPageOptions: Z,
     handleSearch: G = () => {
     }
-  }, re) => /* @__PURE__ */ d(ee, { children: [
-    /* @__PURE__ */ d("div", { className: "landing__main-content", children: [
+  }, ae) => /* @__PURE__ */ l(te, { children: [
+    /* @__PURE__ */ l("div", { className: "landing__main-content", children: [
       o && /* @__PURE__ */ n("div", { className: "main-content__title", children: o }),
       u && /* @__PURE__ */ n(
-        W,
+        B,
         {
           tags: u,
           allTagText: a,
-          selectedTag: c,
-          onSelectTag: l
+          selectedTagCode: c,
+          onSelectTag: s
         }
       ),
-      /* @__PURE__ */ d("div", { className: "main-content__actions", children: [
+      /* @__PURE__ */ l("div", { className: "main-content__actions", children: [
         /* @__PURE__ */ n(
-          K,
+          W,
           {
             className: "main-content__search",
             placeholder: p,
@@ -503,13 +504,13 @@ const O = A.div`
           L,
           {
             color: "neutral",
-            control: s == null ? void 0 : s.name,
+            control: d == null ? void 0 : d.name,
             zIndex: 1001,
             className: "main-content__sort-by",
             children: _ == null ? void 0 : _.map((i, b) => /* @__PURE__ */ n(
               $,
               {
-                active: (i == null ? void 0 : i.code) === (s == null ? void 0 : s.code),
+                active: (i == null ? void 0 : i.code) === (d == null ? void 0 : d.code),
                 className: "sort-by__item",
                 onClick: () => r(i),
                 children: i == null ? void 0 : i.name
@@ -519,7 +520,7 @@ const O = A.div`
           }
         )
       ] }),
-      /* @__PURE__ */ d("div", { className: "main-content__items", children: [
+      /* @__PURE__ */ l("div", { className: "main-content__items", children: [
         t && (t == null ? void 0 : t.length) > 0 && /* @__PURE__ */ n(
           z,
           {
@@ -529,21 +530,21 @@ const O = A.div`
             getImage: x,
             onSelectCard: y,
             onSelectOption: S,
-            onShare: C,
-            onBookmark: T
+            onShare: T,
+            onBookmark: C
           }
         ),
         /* @__PURE__ */ n("div", { className: "main-content__divider" }),
         h && (h == null ? void 0 : h.length) > 0 && /* @__PURE__ */ n(
-          Y,
+          O,
           {
             buttonText: M,
             buttonLink: j,
             onButtonAction: F,
-            onSelectCard: U,
+            onSelectCard: R,
             items: h,
             isLoading: v,
-            getImage: q,
+            getImage: U,
             isHighlight: !0
           }
         ),
@@ -557,51 +558,53 @@ const O = A.div`
             getImage: x,
             onSelectCard: y,
             onSelectOption: S,
-            onShare: C,
-            onBookmark: T
+            onShare: T,
+            onBookmark: C
           }
         )
       ] }),
       w && w > 1 && /* @__PURE__ */ n(
-        P,
+        ne,
         {
           perPageOptions: Z,
           perPage: V,
           handlePerPage: X,
-          page: H,
-          handlePage: R,
+          page: q,
+          handlePage: H,
           totalPage: w
         }
       )
     ] }),
-    /* @__PURE__ */ d("div", { className: "landing__side-content", children: [
+    /* @__PURE__ */ l("div", { className: "landing__side-content", children: [
       f && /* @__PURE__ */ n("div", { className: "side-content__title", children: f }),
-      /* @__PURE__ */ n("div", { className: "side-content__items", children: m && (m == null ? void 0 : m.length) > 0 && (m == null ? void 0 : m.map((i, b) => /* @__PURE__ */ d(
-        "div",
-        {
-          className: "side-content__item",
-          onClick: () => y(i),
-          children: [
-            /* @__PURE__ */ n(
-              "img",
-              {
-                src: x(i == null ? void 0 : i.imageUrl, i == null ? void 0 : i.uuid) || null,
-                alt: `Mini blog ${b + 1}`,
-                className: "item__image"
-              }
-            ),
-            /* @__PURE__ */ d("div", { className: "item__content", children: [
-              /* @__PURE__ */ n("div", { className: "item__title", children: i == null ? void 0 : i.title }),
-              /* @__PURE__ */ n("div", { className: "item__description", children: J(i == null ? void 0 : i.publishedAt) })
-            ] })
-          ]
-        }
-      ))) }),
-      /* @__PURE__ */ n(Q, { onClick: E, className: "side-content__link", children: D })
+      m && (m == null ? void 0 : m.length) > 0 && /* @__PURE__ */ l(J, { children: [
+        /* @__PURE__ */ n("div", { className: "side-content__items", children: m == null ? void 0 : m.map((i, b) => /* @__PURE__ */ l(
+          "div",
+          {
+            className: "side-content__item",
+            onClick: () => y(i),
+            children: [
+              /* @__PURE__ */ n(
+                "img",
+                {
+                  src: x(i == null ? void 0 : i.imageUrl, i == null ? void 0 : i.uuid) || null,
+                  alt: `Mini blog ${b + 1}`,
+                  className: "item__image"
+                }
+              ),
+              /* @__PURE__ */ l("div", { className: "item__content", children: [
+                /* @__PURE__ */ n("div", { className: "item__title", children: i == null ? void 0 : i.title }),
+                /* @__PURE__ */ n("div", { className: "item__description", children: Q(i == null ? void 0 : i.publishedAt) })
+              ] })
+            ]
+          }
+        )) }),
+        /* @__PURE__ */ n(Y, { onClick: E, className: "side-content__link", children: D })
+      ] })
     ] })
   ] })
 );
-ne.propTypes = {
+re.propTypes = {
   mainTitle: e.string,
   sideTitle: e.string,
   tags: e.array,
@@ -638,5 +641,5 @@ ne.propTypes = {
   handleSearch: e.func
 };
 export {
-  ne as default
+  re as default
 };

package/dist/BlogListSection.cjs

@@ -53,6 +53,7 @@
 
       & .wrapper__tags {
         display: flex;
+        flex-wrap: wrap;
         gap: 0.25rem;
 
         & .wrapper__tag {
@@ -178,4 +179,4 @@
       bottom: -1.25rem;
     }
   }
-`,z=p.memo(C),L=p.forwardRef(({timeToReadText:g="{0} min read",items:s,onSelectCard:i=()=>{},onSelectOption:a=()=>{},onShare:n=()=>{},onBookmark:l=()=>{},isLoading:f=!1,getImage:u=()=>{},isSeparated:c=!0},h)=>{const _=p.useMemo(()=>s==null?void 0:s.map((e,d)=>t.jsx(z,{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:g,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:()=>i==null?void 0:i(e),onSelectOption:w=>a==null?void 0:a(w),onShare:()=>n==null?void 0:n(e),onBookmark:()=>l==null?void 0:l(e),imageUrl:u(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null},`blog-card-item__${d+1}`)),[s]);return t.jsx(P,{className:c?"separated":"",children:t.jsx(q.SuspenseBlogLarge,{isLoading:f,limit:5,keyPrefix:"blog-section",children:_})})});module.exports=L;
+`,x=p.memo(C),z=p.forwardRef(({timeToReadText:g="{0} min read",items:s,onSelectCard:i=()=>{},onSelectOption:a=()=>{},onShare:n=()=>{},onBookmark:l=()=>{},isLoading:f=!1,getImage:u=()=>{},isSeparated:c=!0},h)=>{const _=p.useMemo(()=>s==null?void 0:s.map((e,d)=>t.jsx(x,{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:g,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:()=>i==null?void 0:i(e),onSelectOption:w=>a==null?void 0:a(w),onShare:()=>n==null?void 0:n(e),onBookmark:()=>l==null?void 0:l(e),imageUrl:u(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null},`blog-card-item__${d+1}`)),[s]);return t.jsx(P,{className:c?"separated":"",children:t.jsx(q.SuspenseBlogLarge,{isLoading:f,limit:5,keyPrefix:"blog-section",children:_})})});module.exports=z;

package/dist/BlogListSection.js

@@ -63,6 +63,7 @@ const B = k.div`
 
       & .wrapper__tags {
         display: flex;
+        flex-wrap: wrap;
         gap: 0.25rem;
 
         & .wrapper__tag {

package/dist/BlogsSectionDetailed.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),u=require("react"),w=require("./emotion-styled.browser.esm-BtEseadx.cjs"),k=require("./consts-goSZX3xP.cjs"),R=require("./useDetectMobile-zkbzoOGV.cjs"),r=require("./utils-DmMdPm9O.cjs"),v=require("./style-C_BRvopE.cjs"),T=require("./Button.cjs"),O=require("./index-DiIeF_76.cjs"),A=w.styled.div`
+"use strict";const t=require("react/jsx-runtime"),u=require("react"),w=require("./emotion-styled.browser.esm-BtEseadx.cjs"),k=require("./consts-goSZX3xP.cjs"),R=require("./useDetectMobile-zkbzoOGV.cjs"),r=require("./utils-DmMdPm9O.cjs"),y=require("./style-C_BRvopE.cjs"),T=require("./Button.cjs"),O=require("./index-DiIeF_76.cjs"),A=w.styled.div`
   display: grid;
   grid-template-columns: ${i=>`repeat(${i.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
@@ -6,7 +6,7 @@
   @media (max-width: ${k.MOBILE_SIZE_PX+"px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`,y=w.styled.div`
+`,v=w.styled.div`
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -25,7 +25,7 @@
   & img {
     max-height: 11.0625rem;
     min-height: 11.0625rem;
-    object-fit: cover;
+    object-fit: fill;
     width: 100%;
   }
 
@@ -110,4 +110,4 @@
     align-items: center;
     gap: 1rem;
   }
-`,$=u.forwardRef((i,l)=>{const{title:s,imageUrl:m,text:o,numberOfLikes:n,numberOfComments:f,timeToRead:p,publishedAt:c,tags:d,onCardClick:j,timeToReadText:h="{0} min read"}=i;return t.jsxs(y,{ref:l,className:"blog-card",onClick:j,children:[t.jsx(O.ProductImageWrapper,{src:m}),t.jsxs(S,{children:[t.jsxs("div",{className:"info-wr",children:[t.jsxs("div",{className:"info-wr-1",children:[t.jsxs("span",{children:[r.formatLocaleDateString(c)," "]}),t.jsx("span",{className:"small-dot",children:"●"}),p&&h?`${r.formatString(h,p)}`:"N/A"]}),t.jsxs("div",{className:"info-wr-2",children:[t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-thumbs-up--filled"}),t.jsx("span",{children:r.getRoundedNumber(n)})]}),t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-messages-filled"}),t.jsx("span",{children:r.getRoundedNumber(f)})]})]})]}),t.jsx("div",{className:"text-wr-title",children:s}),t.jsx("div",{className:"text-wr",children:o})]}),t.jsx("div",{className:"tags-wr",children:d==null?void 0:d.map((a,b)=>t.jsx(v.BlogTag,{color:a==null?void 0:a.color,children:a==null?void 0:a.name},b))})]})}),D=u.forwardRef(({},i)=>t.jsxs(y,{className:"blog-card",children:[t.jsx("div",{className:"skeleton-img"}),t.jsxs(S,{children:[t.jsx("div",{className:"info-wr"}),t.jsx("div",{className:"skeleton-title"}),t.jsx("div",{className:"info-wr-skeleton"})]})]})),q=({limit:i=3,isLoading:l=!1,keyPrefix:s})=>t.jsx(t.Fragment,{children:Array.from({length:i},(m,o)=>t.jsx(D,{isLoading:l},`${s}-skeleton-product-card-${o}`))}),B=({children:i,fallbackComponent:l=t.jsx(t.Fragment,{}),isLoading:s=!1,limit:m,keyPrefix:o})=>t.jsx(u.Suspense,{fallbackComponent:l,children:s===!0?t.jsx(q,{isLoading:s,limit:m,keyPrefix:o}):i}),N=u.memo($),L=u.forwardRef((i,l)=>{const{icon:s,title:m,onButtonAction:o,items:n,buttonText:f,timeToReadText:p,limit:c=3,onSelectCard:d=()=>{},isLoading:j=!1,buttonLink:h,getImage:a=()=>{}}=i,b=R.useDetectMobile(),C=u.useMemo(()=>t.jsx(t.Fragment,{children:b===!0?n==null?void 0:n.map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,tags:e==null?void 0:e.tags,onCardClick:()=>d(e==null?void 0:e.titleSlug),imageUrl:a(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null},g)):n==null?void 0:n.slice(0,c).map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,imageUrl:a(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,tags:e==null?void 0:e.tags,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,onCardClick:()=>d(e==null?void 0:e.titleSlug)},g))}),[n,b,c,d]);return t.jsxs(v.RegulatTitleSectionWrapper,{ref:l,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[r.isDefinedNotEmptyString(s)&&t.jsx("i",{className:s}),t.jsx("span",{children:m})]}),r.isDefinedNotEmptyString(f)&&r.isDefinedNotEmptyString(h)&&t.jsx(T,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var g;(g=e==null?void 0:e.target)==null||g.blur(),o(h)},borderRadius:"curved",className:"button-link",children:f})]}),t.jsx(A,{limit:c,children:t.jsx(B,{isLoading:j,limit:c,keyPrefix:"explore-landing",children:C})})]})});module.exports=L;
+`,$=u.forwardRef((i,a)=>{const{title:s,imageUrl:m,text:o,numberOfLikes:n,numberOfComments:h,timeToRead:p,publishedAt:c,tags:d,onCardClick:j,timeToReadText:f="{0} min read"}=i;return t.jsxs(v,{ref:a,className:"blog-card",onClick:j,children:[t.jsx(O.ProductImageWrapper,{src:m}),t.jsxs(S,{children:[t.jsxs("div",{className:"info-wr",children:[t.jsxs("div",{className:"info-wr-1",children:[t.jsxs("span",{children:[r.formatLocaleDateString(c)," "]}),t.jsx("span",{className:"small-dot",children:"●"}),p&&f?`${r.formatString(f,p)}`:"N/A"]}),t.jsxs("div",{className:"info-wr-2",children:[t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-thumbs-up--filled"}),t.jsx("span",{children:r.getRoundedNumber(n)})]}),t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-messages-filled"}),t.jsx("span",{children:r.getRoundedNumber(h)})]})]})]}),t.jsx("div",{className:"text-wr-title",children:s}),t.jsx("div",{className:"text-wr",children:o})]}),t.jsx("div",{className:"tags-wr",children:d==null?void 0:d.map((l,b)=>t.jsx(y.BlogTag,{color:l==null?void 0:l.color,children:l==null?void 0:l.name},b))})]})}),D=u.forwardRef(({},i)=>t.jsxs(v,{className:"blog-card",children:[t.jsx("div",{className:"skeleton-img"}),t.jsxs(S,{children:[t.jsx("div",{className:"info-wr"}),t.jsx("div",{className:"skeleton-title"}),t.jsx("div",{className:"info-wr-skeleton"})]})]})),q=({limit:i=3,isLoading:a=!1,keyPrefix:s})=>t.jsx(t.Fragment,{children:Array.from({length:i},(m,o)=>t.jsx(D,{isLoading:a},`${s}-skeleton-product-card-${o}`))}),B=({children:i,fallbackComponent:a=t.jsx(t.Fragment,{}),isLoading:s=!1,limit:m,keyPrefix:o})=>t.jsx(u.Suspense,{fallbackComponent:a,children:s===!0?t.jsx(q,{isLoading:s,limit:m,keyPrefix:o}):i}),N=u.memo($),L=u.forwardRef((i,a)=>{const{icon:s,title:m,onButtonAction:o,items:n,buttonText:h,timeToReadText:p,limit:c=3,onSelectCard:d=()=>{},isLoading:j=!1,buttonLink:f,getImage:l=()=>{}}=i,b=R.useDetectMobile(),C=u.useMemo(()=>t.jsx(t.Fragment,{children:b===!0?n==null?void 0:n.map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,tags:e==null?void 0:e.tags,onCardClick:()=>d(e==null?void 0:e.titleSlug),imageUrl:l(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null},g)):n==null?void 0:n.slice(0,c).map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,imageUrl:l(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,tags:e==null?void 0:e.tags,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,onCardClick:()=>d(e==null?void 0:e.titleSlug)},g))}),[n,b,c,d]);return t.jsxs(y.RegulatTitleSectionWrapper,{ref:a,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[r.isDefinedNotEmptyString(s)&&t.jsx("i",{className:s}),t.jsx("span",{children:m})]}),r.isDefinedNotEmptyString(h)&&r.isDefinedNotEmptyString(f)&&t.jsx(T,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var g;(g=e==null?void 0:e.target)==null||g.blur(),o(f)},borderRadius:"curved",className:"button-link",children:h})]}),t.jsx(A,{limit:c,children:t.jsx(B,{isLoading:j,limit:c,keyPrefix:"explore-landing",children:C})})]})});module.exports=L;

package/dist/BlogsSectionDetailed.js

@@ -34,7 +34,7 @@ const E = y.div`
   & img {
     max-height: 11.0625rem;
     min-height: 11.0625rem;
-    object-fit: cover;
+    object-fit: fill;
     width: 100%;
   }