@lanaco/lnc-react-ui 4.0.200 → 4.0.202

package/dist/PartnerCardsSection.cjs

@@ -0,0 +1,134 @@
+"use strict";const e=require("react/jsx-runtime"),c=require("react"),x=require("./Icon.cjs"),_=require("./Popover.cjs"),f=require("./PopoverTrigger.cjs"),u=require("./PopoverContent.cjs"),d=require("./emotion-styled.browser.esm-BtEseadx.cjs"),v=require("./consts-goSZX3xP.cjs"),l=require("./utils-RnrgDDZP.cjs"),y=d.styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 3rem;
+  border-radius: 1.25rem;
+  padding: 2rem;
+  background: #f4f6fb;
+
+  & .section__text {
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+
+    & .section__title {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 100%;
+      gap: 1rem;
+
+      & span {
+        font-weight: 600;
+        font-size: 1.5rem;
+        leading-trim: none;
+        line-height: 2rem;
+        letter-spacing: 0%;
+        text-align: center;
+        color: var(--gray-900, #0c1520);
+        ${l.truncateText()}
+      }
+
+      &::after {
+        content: "";
+        flex: 1;
+        height: 0.0625rem;
+        background-color: var(--gray-200, #e4e9f0);
+      }
+
+      &::before {
+        content: "";
+        flex: 1;
+        height: 0.0625rem;
+        background-color: var(--gray-200, #e4e9f0);
+      }
+    }
+
+    & .section__description {
+      font-weight: 400;
+      font-size: 0.875rem;
+      leading-trim: none;
+      line-height: 1.25rem;
+      letter-spacing: 0.0156rem;
+      text-align: center;
+      color: var(--gray-700, #424b56);
+      ${l.truncateTextInRows(2)}
+    }
+  }
+
+  & .section__items {
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    gap: 1.5rem;
+
+    & .section__item {
+      width: 100%;
+      height: 100%;
+      max-width: 16.25rem;
+      max-height: 7.5rem;
+      border-radius: 0.5rem;
+      border: 1px solid var(--gray-200, #e4e9f0);
+      overflow: hidden;
+
+      & img {
+        object-fit: cover;
+        width: 100%;
+        height: 100%;
+        filter: grayscale(100%);
+        transition: filter 0.3s ease;
+
+        &:hover {
+          filter: grayscale(0%);
+        }
+      }
+
+      &:hover {
+        cursor: pointer;
+      }
+    }
+  }
+
+  @media (max-width: ${v.MOBILE_SIZE_PX+"px"}) {
+    padding: 1rem;
+
+    & .section__text {
+      & .section__title {
+        font-size: 1.25rem;
+        line-height: 1.75rem;
+      }
+    }
+
+    & .section__items {
+      display: grid;
+      grid-template-columns: ${()=>"repeat(2, minmax(0, auto))"};
+      justify-items: center;
+      gap: 1rem;
+
+      & .section__trigger {
+        width: 100% !important;
+      }
+
+      & .section__item {
+        max-width: 100%;
+        max-height: 5rem;
+      }
+    }
+  }
+`,w=d.styled.div`
+  width: 100%;
+  height: 100%;
+  max-width: 16.25rem;
+  max-height: 12.5rem;
+  border-radius: 0.75rem;
+  padding: 1.25rem;
+  background: var(--gray-200, #e4e9f0);
+  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
+
+  font-weight: 400;
+  font-size: 0.75rem;
+  leading-trim: none;
+  line-height: 1rem;
+  letter-spacing: 0.025rem;
+  color: var(--gray-900, #0c1520);
+`,j=c.forwardRef(({icon:o,title:s,description:i,items:r,onSelectCard:g=()=>{}},b)=>{const[m,a]=c.useState(null),h=t=>{a(t)},p=()=>{a(null)};return e.jsxs(y,{children:[e.jsxs("div",{className:"section__text",children:[o&&e.jsx(x,{icon:o,sizeInUnits:"2.5rem",color:"warning",className:"section__icon"}),s&&e.jsx("div",{className:"section__title",children:e.jsx("span",{children:s})}),i&&e.jsx("div",{className:"section__description",children:i})]}),r&&(r==null?void 0:r.length)>0&&e.jsx("div",{className:"section__items",children:r==null?void 0:r.map((t,n)=>e.jsxs(_,{open:n===m,placement:"top-end",offsetValue:4,children:[e.jsx(f,{className:"section__trigger",children:e.jsx("div",{className:"section__item",onMouseEnter:()=>{h(n)},onMouseLeave:p,onClick:()=>{g(t)},children:e.jsx("img",{src:t==null?void 0:t.imageUrl,alt:`Partner card image ${n+1}`,loading:"lazy"})})}),e.jsx(u,{style:{padding:0,borderRadius:12},children:e.jsx(w,{children:i})})]},`partner-cards-section-item__${n+1}`))})]})});module.exports=j;

package/dist/PartnerCardsSection.js

@@ -0,0 +1,203 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import { forwardRef as h, useState as f } from "react";
+import _ from "./Icon.js";
+import x from "./Popover.js";
+import u from "./PopoverTrigger.js";
+import v from "./PopoverContent.js";
+import { s as l } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as y } from "./consts-BuFChS64.js";
+import { t as w, m as b } from "./utils-DtEfC-TX.js";
+const P = l.div`
+  display: flex;
+  flex-direction: column;
+  gap: 3rem;
+  border-radius: 1.25rem;
+  padding: 2rem;
+  background: #f4f6fb;
+
+  & .section__text {
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+
+    & .section__title {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 100%;
+      gap: 1rem;
+
+      & span {
+        font-weight: 600;
+        font-size: 1.5rem;
+        leading-trim: none;
+        line-height: 2rem;
+        letter-spacing: 0%;
+        text-align: center;
+        color: var(--gray-900, #0c1520);
+        ${w()}
+      }
+
+      &::after {
+        content: "";
+        flex: 1;
+        height: 0.0625rem;
+        background-color: var(--gray-200, #e4e9f0);
+      }
+
+      &::before {
+        content: "";
+        flex: 1;
+        height: 0.0625rem;
+        background-color: var(--gray-200, #e4e9f0);
+      }
+    }
+
+    & .section__description {
+      font-weight: 400;
+      font-size: 0.875rem;
+      leading-trim: none;
+      line-height: 1.25rem;
+      letter-spacing: 0.0156rem;
+      text-align: center;
+      color: var(--gray-700, #424b56);
+      ${b(2)}
+    }
+  }
+
+  & .section__items {
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    gap: 1.5rem;
+
+    & .section__item {
+      width: 100%;
+      height: 100%;
+      max-width: 16.25rem;
+      max-height: 7.5rem;
+      border-radius: 0.5rem;
+      border: 1px solid var(--gray-200, #e4e9f0);
+      overflow: hidden;
+
+      & img {
+        object-fit: cover;
+        width: 100%;
+        height: 100%;
+        filter: grayscale(100%);
+        transition: filter 0.3s ease;
+
+        &:hover {
+          filter: grayscale(0%);
+        }
+      }
+
+      &:hover {
+        cursor: pointer;
+      }
+    }
+  }
+
+  @media (max-width: ${y + "px"}) {
+    padding: 1rem;
+
+    & .section__text {
+      & .section__title {
+        font-size: 1.25rem;
+        line-height: 1.75rem;
+      }
+    }
+
+    & .section__items {
+      display: grid;
+      grid-template-columns: ${() => "repeat(2, minmax(0, auto))"};
+      justify-items: center;
+      gap: 1rem;
+
+      & .section__trigger {
+        width: 100% !important;
+      }
+
+      & .section__item {
+        max-width: 100%;
+        max-height: 5rem;
+      }
+    }
+  }
+`, N = l.div`
+  width: 100%;
+  height: 100%;
+  max-width: 16.25rem;
+  max-height: 12.5rem;
+  border-radius: 0.75rem;
+  padding: 1.25rem;
+  background: var(--gray-200, #e4e9f0);
+  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
+
+  font-weight: 400;
+  font-size: 0.75rem;
+  leading-trim: none;
+  line-height: 1rem;
+  letter-spacing: 0.025rem;
+  color: var(--gray-900, #0c1520);
+`, S = h(
+  ({ icon: a, title: c, description: n, items: r, onSelectCard: m = () => {
+  } }, j) => {
+    const [d, s] = f(null), g = (t) => {
+      s(t);
+    }, p = () => {
+      s(null);
+    };
+    return /* @__PURE__ */ o(P, { children: [
+      /* @__PURE__ */ o("div", { className: "section__text", children: [
+        a && /* @__PURE__ */ e(
+          _,
+          {
+            icon: a,
+            sizeInUnits: "2.5rem",
+            color: "warning",
+            className: "section__icon"
+          }
+        ),
+        c && /* @__PURE__ */ e("div", { className: "section__title", children: /* @__PURE__ */ e("span", { children: c }) }),
+        n && /* @__PURE__ */ e("div", { className: "section__description", children: n })
+      ] }),
+      r && (r == null ? void 0 : r.length) > 0 && /* @__PURE__ */ e("div", { className: "section__items", children: r == null ? void 0 : r.map((t, i) => /* @__PURE__ */ o(
+        x,
+        {
+          open: i === d,
+          placement: "top-end",
+          offsetValue: 4,
+          children: [
+            /* @__PURE__ */ e(u, { className: "section__trigger", children: /* @__PURE__ */ e(
+              "div",
+              {
+                className: "section__item",
+                onMouseEnter: () => {
+                  g(i);
+                },
+                onMouseLeave: p,
+                onClick: () => {
+                  m(t);
+                },
+                children: /* @__PURE__ */ e(
+                  "img",
+                  {
+                    src: t == null ? void 0 : t.imageUrl,
+                    alt: `Partner card image ${i + 1}`,
+                    loading: "lazy"
+                  }
+                )
+              }
+            ) }),
+            /* @__PURE__ */ e(v, { style: { padding: 0, borderRadius: 12 }, children: /* @__PURE__ */ e(N, { children: n }) })
+          ]
+        },
+        `partner-cards-section-item__${i + 1}`
+      )) })
+    ] });
+  }
+);
+export {
+  S as default
+};

package/dist/PartnerStatsSection.cjs

@@ -0,0 +1,100 @@
+"use strict";const e=require("react/jsx-runtime"),l=require("react"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),a=require("./consts-goSZX3xP.cjs"),n=require("./utils-RnrgDDZP.cjs"),_=c.styled.div`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 2rem;
+  align-self: stretch;
+
+  & .section__text {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 1rem;
+    align-self: stretch;
+    max-width: 50rem;
+
+    & .section__title {
+      color: var(--gray-900, #0c1520);
+      font-size: 2rem;
+      font-style: normal;
+      font-weight: 600;
+      line-height: 2.5rem;
+      ${n.truncateTextInRows(2)}
+    }
+
+    & .section__description {
+      color: var(--gray-700, #424b56);
+      font-size: 0.875rem;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 1.25rem;
+      letter-spacing: 0.0156rem;
+      ${n.truncateTextInRows(2)}
+    }
+  }
+
+  & .section__items {
+    display: flex;
+
+    & .section__item {
+      border-left: 4px solid #ffa36a;
+      height: 3rem;
+      display: flex;
+      flex-direction: column;
+      align-items: flex-start;
+      flex: 1 0 0;
+      min-width: 12.5rem;
+      padding-left: 0.75rem;
+
+      & .item__title {
+        color: var(--gray-900, #0c1520);
+        font-size: 1.375rem;
+        font-style: normal;
+        font-weight: 600;
+        line-height: 1.75rem;
+      }
+
+      & .item__description {
+        color: var(--gray-600, #5a6573);
+        font-size: 0.875rem;
+        font-style: normal;
+        font-weight: 500;
+        line-height: 1.25rem;
+      }
+    }
+  }
+
+  @media (max-width: ${a.MOBILE_SIZE_PX+"px"}) {
+    gap: 1.25rem;
+
+    & .section__text {
+      & .section__title {
+        font-size: 1.375rem;
+        line-height: 1.75rem;
+      }
+
+      & .section__description {
+        ${n.truncateTextInRows(5)}
+      }
+    }
+
+    & .section__items {
+      & .section__item {
+        height: 3.5rem;
+        min-width: auto;
+
+        & .item__title {
+          font-size: 1rem;
+          line-height: 1.5rem;
+          letter-spacing: 0.0063rem;
+        }
+
+        & .item__description {
+          font-size: 12px;
+          line-height: 1rem;
+          letter-spacing: 0.0313rem;
+        }
+      }
+    }
+  }
+`,m=l.forwardRef(({title:r,description:s,items:t},d)=>e.jsxs(_,{children:[e.jsxs("div",{className:"section__text",children:[r&&e.jsx("div",{className:"section__title",children:r}),s&&e.jsx("div",{className:"section__description",children:s})]}),t&&(t==null?void 0:t.length)>0&&e.jsx("div",{className:"section__items",children:t==null?void 0:t.map((i,o)=>e.jsxs("div",{className:"section__item",children:[e.jsx("div",{className:"item__title",children:i==null?void 0:i.title}),e.jsx("div",{className:"item__description",children:i==null?void 0:i.description})]},`partner-stats-section-item__${o+1}`))})]}));module.exports=m;

package/dist/PartnerStatsSection.js

@@ -0,0 +1,124 @@
+import { jsxs as r, jsx as i } from "react/jsx-runtime";
+import { forwardRef as a } from "react";
+import { s as c } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as m } from "./consts-BuFChS64.js";
+import { m as n } from "./utils-DtEfC-TX.js";
+const _ = c.div`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 2rem;
+  align-self: stretch;
+
+  & .section__text {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 1rem;
+    align-self: stretch;
+    max-width: 50rem;
+
+    & .section__title {
+      color: var(--gray-900, #0c1520);
+      font-size: 2rem;
+      font-style: normal;
+      font-weight: 600;
+      line-height: 2.5rem;
+      ${n(2)}
+    }
+
+    & .section__description {
+      color: var(--gray-700, #424b56);
+      font-size: 0.875rem;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 1.25rem;
+      letter-spacing: 0.0156rem;
+      ${n(2)}
+    }
+  }
+
+  & .section__items {
+    display: flex;
+
+    & .section__item {
+      border-left: 4px solid #ffa36a;
+      height: 3rem;
+      display: flex;
+      flex-direction: column;
+      align-items: flex-start;
+      flex: 1 0 0;
+      min-width: 12.5rem;
+      padding-left: 0.75rem;
+
+      & .item__title {
+        color: var(--gray-900, #0c1520);
+        font-size: 1.375rem;
+        font-style: normal;
+        font-weight: 600;
+        line-height: 1.75rem;
+      }
+
+      & .item__description {
+        color: var(--gray-600, #5a6573);
+        font-size: 0.875rem;
+        font-style: normal;
+        font-weight: 500;
+        line-height: 1.25rem;
+      }
+    }
+  }
+
+  @media (max-width: ${m + "px"}) {
+    gap: 1.25rem;
+
+    & .section__text {
+      & .section__title {
+        font-size: 1.375rem;
+        line-height: 1.75rem;
+      }
+
+      & .section__description {
+        ${n(5)}
+      }
+    }
+
+    & .section__items {
+      & .section__item {
+        height: 3.5rem;
+        min-width: auto;
+
+        & .item__title {
+          font-size: 1rem;
+          line-height: 1.5rem;
+          letter-spacing: 0.0063rem;
+        }
+
+        & .item__description {
+          font-size: 12px;
+          line-height: 1rem;
+          letter-spacing: 0.0313rem;
+        }
+      }
+    }
+  }
+`, y = a(({ title: o, description: l, items: e }, d) => /* @__PURE__ */ r(_, { children: [
+  /* @__PURE__ */ r("div", { className: "section__text", children: [
+    o && /* @__PURE__ */ i("div", { className: "section__title", children: o }),
+    l && /* @__PURE__ */ i("div", { className: "section__description", children: l })
+  ] }),
+  e && (e == null ? void 0 : e.length) > 0 && /* @__PURE__ */ i("div", { className: "section__items", children: e == null ? void 0 : e.map((t, s) => /* @__PURE__ */ r(
+    "div",
+    {
+      className: "section__item",
+      children: [
+        /* @__PURE__ */ i("div", { className: "item__title", children: t == null ? void 0 : t.title }),
+        /* @__PURE__ */ i("div", { className: "item__description", children: t == null ? void 0 : t.description })
+      ]
+    },
+    `partner-stats-section-item__${s + 1}`
+  )) })
+] }));
+export {
+  y as default
+};

package/dist/ProductsWithBannerSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),d=require("react"),g=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),w=require("./useDetectMobile-zkbzoOGV.cjs"),f=require("./style-CkcozOY6.cjs"),c=require("./utils-RnrgDDZP.cjs"),L=require("./index-uwl7BjRF.cjs"),i=require("./style-BAcV7F53.cjs"),W=g.styled.div`
+"use strict";const e=require("react/jsx-runtime"),d=require("react"),g=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),w=require("./useDetectMobile-zkbzoOGV.cjs"),f=require("./style-B4kAj6YU.cjs"),c=require("./utils-RnrgDDZP.cjs"),L=require("./index-uwl7BjRF.cjs"),i=require("./style-BAcV7F53.cjs"),W=g.styled.div`
   width: 100%;
   height: 22.5rem;
   min-height: 22.5rem;

package/dist/ProductsWithBannerSection.js

@@ -3,7 +3,7 @@ import { forwardRef as W, useRef as N, Suspense as U, memo as G, useMemo as M }
 import { s as f } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as R } from "./consts-BuFChS64.js";
 import { u as _ } from "./useDetectMobile-Bkvj0VMa.js";
-import { R as j } from "./style-Cmlod7oq.js";
+import { R as j } from "./style-neMbLWE6.js";
 import { m as B, l as I, k as C } from "./utils-DtEfC-TX.js";
 import { P as L } from "./index-B22BZVBG.js";
 import { b as s, a as i, S as u, c as b } from "./style-BwQ4djFC.js";