@lanaco/lnc-react-ui 4.0.23 → 4.0.26

package/dist/index6.js

@@ -0,0 +1,144 @@
+import { jsxs as t, jsx as i } from "react/jsx-runtime";
+import { forwardRef as $ } from "react";
+import { n as r } from "./emotion-styled.browser.esm-BiK8DcgW.js";
+import { M as o } from "./consts-DNVz1x1I.js";
+import v from "./Button.js";
+import { u as y } from "./useDetectMobile-BookNOsk.js";
+const M = r.div`
+  display: flex;
+  border-radius: 0.75rem;
+  background-color: ${(e) => e.bgcolor || "transparent"};
+  overflow: hidden;
+  max-height: ${(e) => e.height || "22.5rem"};
+  min-height: ${(e) => e.height || "22.5rem"};
+  background-color: ${(e) => e.bgcolor || "transparent"};
+
+  & button {
+    width: fit-content;
+  }
+
+  ${(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);
+
+`}
+
+  & img {
+    object-fit: cover;
+    max-width: ${(e) => e.imgW || "22.5rem"};
+    min-width: ${(e) => e.imgW || "22.5rem"};
+    max-height: ${(e) => e.height || "22.5rem"};
+    min-height: ${(e) => e.height || "22.5rem"};
+  }
+
+  ${(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);
+
+`}
+
+  @media (max-width: ${o + "px"}) {
+    gap: 1.5rem;
+    flex-direction: column;
+    min-height: unset;
+    max-height: unset;
+
+    & button {
+      width: fit-content;
+    }
+
+    & img {
+      max-width: 100%;
+      min-width: 100%;
+      max-height: ${(e) => e.imgHMob || "12.1rem"};
+      min-height: ${(e) => e.imgHMob || "12.1rem"};
+    }
+  }
+`, C = r.div`
+  padding: ${(e) => e.smallPadding === !0 ? "2rem" : "4rem 5rem"};
+  display: flex;
+  gap: 2rem;
+  flex-direction: ${(e) => e.isHorizontalContent === !0 ? "row" : "column"};
+  flex: 1;
+
+  ${(e) => e.isHorizontalContent === !0 && "justify-content: space-between;"}
+
+  @media (max-width: ${o + "px"}) {
+    padding: 0;
+    flex-direction: column;
+  }
+`, H = r.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+
+  & .header-title {
+    font-size: 1.75rem;
+    font-weight: 600;
+  }
+
+  & .header-subtitle {
+    color: var(--gray-950, #14161a);
+    font-size: 1rem;
+    font-weight: 500;
+  }
+
+  @media (max-width: ${o + "px"}) {
+    flex-direction: column;
+  }
+`, I = $((e, B) => {
+  const {
+    title: l,
+    subtitle: h,
+    buttonText: g,
+    image: a,
+    imagePosition: n = "right",
+    noImageForMobile: m = !1,
+    height: s,
+    imageWidth: c,
+    imageHeightMob: x,
+    smallPadding: p = !1,
+    isHorizontalContent: u = !1,
+    backgroundColor: b,
+    hasBorder: f = !1,
+    onBannerClick: w
+  } = e, d = y();
+  return /* @__PURE__ */ t(
+    M,
+    {
+      bgcolor: b,
+      height: s,
+      imgW: c,
+      imgHMob: x,
+      hasBorder: f,
+      children: [
+        n !== "right" && !(m === !0 && d === !0) && /* @__PURE__ */ i("img", { src: a }),
+        /* @__PURE__ */ t(
+          C,
+          {
+            isHorizontalContent: u,
+            smallPadding: p,
+            children: [
+              /* @__PURE__ */ t(H, { children: [
+                /* @__PURE__ */ i("div", { className: "header-title", children: l }),
+                /* @__PURE__ */ i("div", { className: "header-subitle", children: h })
+              ] }),
+              /* @__PURE__ */ i(
+                v,
+                {
+                  size: "medium",
+                  color: "neutral",
+                  type: "button",
+                  onClick: w,
+                  children: g
+                }
+              )
+            ]
+          }
+        ),
+        n === "right" && !(m === !0 && d === !0) && /* @__PURE__ */ i("img", { src: a })
+      ]
+    }
+  );
+});
+export {
+  I as default
+};

package/dist/index7.cjs

@@ -0,0 +1,65 @@
+"use strict";const e=require("react/jsx-runtime"),o=require("react"),s=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),c=require("./consts-dNz9tpt4.cjs"),u=require("./Button.cjs"),t=require("./utils-CE6bljYe.cjs"),h=s.newStyled.div`
+  padding-bottom: 1.38rem;
+  text-align: center;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  gap: 2rem;
+  align-items: center;
+
+  & button {
+    width: fit-content;
+  }
+
+  @media (max-width: ${c.MOBILE_SIZE_PX+"px"}) {
+    padding-bottom: 0;
+  }
+`,g=s.newStyled.div`
+  text-align: center;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  gap: 0.25rem;
+
+  & .header-title {
+    font-size: 1.5rem;
+    font-weight: 600;
+  }
+
+  & .header-subtitle {
+    color: var(--gray-600, #676e79);
+    font-size: 1rem;
+    font-weight: 500;
+  }
+
+  @media (max-width: ${c.MOBILE_SIZE_PX+"px"}) {
+  }
+`,p=s.newStyled.div`
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  gap: 0.75rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+  align-items: center;
+
+  & .list-item {
+    display: flex;
+    align-items: center;
+
+    & .mng {
+      font-size: 1.25rem;
+      color: var(--success-600);
+    }
+  }
+
+  @media (max-width: ${c.MOBILE_SIZE_PX+"px"}) {
+    & .list-item {
+      flex-direction: column;
+      text-align: center;
+      justify-content: center;
+      gap: 0;
+    }
+  }
+`,j=o.forwardRef((a,y)=>{const{title:i,subtitle:n,buttonText:d,list:r,fallback:m=()=>{},onBannerClick:l}=a;return e.jsxs(h,{children:[(t.isDefined(i)||t.isDefined(n))&&e.jsxs(g,{children:[t.isDefined(i)&&e.jsx("div",{className:"header-title",children:i}),t.isDefined(n)&&e.jsx("div",{className:"header-subitle",children:n})]}),e.jsx(p,{children:r==null?void 0:r.map((x,f)=>e.jsx(o.Fragment,{children:e.jsxs("div",{className:"list-item",children:[e.jsx("i",{className:"mng mng-lnc-checkmark--filled"}),e.jsx("span",{children:x})]})},f))}),e.jsx(u,{size:"medium",color:"neutral",type:"button",onClick:()=>t.isDefined(l)?l():m(),children:d})]})});module.exports=j;

package/dist/index7.js

@@ -0,0 +1,104 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { forwardRef as h, Fragment as x } from "react";
+import { n as o } from "./emotion-styled.browser.esm-BiK8DcgW.js";
+import { M as a } from "./consts-DNVz1x1I.js";
+import g from "./Button.js";
+import { l as t } from "./utils-DtEdJZWa.js";
+const u = o.div`
+  padding-bottom: 1.38rem;
+  text-align: center;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  gap: 2rem;
+  align-items: center;
+
+  & button {
+    width: fit-content;
+  }
+
+  @media (max-width: ${a + "px"}) {
+    padding-bottom: 0;
+  }
+`, y = o.div`
+  text-align: center;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  gap: 0.25rem;
+
+  & .header-title {
+    font-size: 1.5rem;
+    font-weight: 600;
+  }
+
+  & .header-subtitle {
+    color: var(--gray-600, #676e79);
+    font-size: 1rem;
+    font-weight: 500;
+  }
+
+  @media (max-width: ${a + "px"}) {
+  }
+`, b = o.div`
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  gap: 0.75rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+  align-items: center;
+
+  & .list-item {
+    display: flex;
+    align-items: center;
+
+    & .mng {
+      font-size: 1.25rem;
+      color: var(--success-600);
+    }
+  }
+
+  @media (max-width: ${a + "px"}) {
+    & .list-item {
+      flex-direction: column;
+      text-align: center;
+      justify-content: center;
+      gap: 0;
+    }
+  }
+`, N = h((m, w) => {
+  const {
+    title: i,
+    subtitle: n,
+    buttonText: s,
+    list: r,
+    fallback: d = () => {
+    },
+    onBannerClick: c
+  } = m;
+  return /* @__PURE__ */ l(u, { children: [
+    (t(i) || t(n)) && /* @__PURE__ */ l(y, { children: [
+      t(i) && /* @__PURE__ */ e("div", { className: "header-title", children: i }),
+      t(n) && /* @__PURE__ */ e("div", { className: "header-subitle", children: n })
+    ] }),
+    /* @__PURE__ */ e(b, { children: r == null ? void 0 : r.map((f, p) => /* @__PURE__ */ e(x, { children: /* @__PURE__ */ l("div", { className: "list-item", children: [
+      /* @__PURE__ */ e("i", { className: "mng mng-lnc-checkmark--filled" }),
+      /* @__PURE__ */ e("span", { children: f })
+    ] }) }, p)) }),
+    /* @__PURE__ */ e(
+      g,
+      {
+        size: "medium",
+        color: "neutral",
+        type: "button",
+        onClick: () => t(c) ? c() : d(),
+        children: s
+      }
+    )
+  ] });
+});
+export {
+  N as default
+};

package/dist/index8.cjs

@@ -0,0 +1,82 @@
+"use strict";const i=require("react/jsx-runtime"),o=require("react"),t=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),r=require("./consts-dNz9tpt4.cjs"),b=require("./Button.cjs"),w=t.newStyled.div`
+  display: flex;
+  border-radius: 0.75rem;
+  background-color: ${e=>e.bgcolor||"transparent"};
+  overflow: hidden;
+
+  & button {
+    width: fit-content;
+  }
+
+  & img {
+    object-fit: cover;
+    max-width: ${e=>e.imgW||"33.39346rem"};
+    min-width: ${e=>e.imgW||"33.39346rem"};
+    max-height: ${e=>e.imgH||"22.5rem"};
+    min-height: ${e=>e.imgH||"22.5rem"};
+  }
+
+  ${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);
+
+`}
+
+  @media (max-width: ${r.MOBILE_SIZE_PX+"px"}) {
+    flex-direction: column;
+    & img {
+      max-width: 100%;
+      min-width: 100%;
+      max-height: ${e=>e.imgHMob||"12.1rem"};
+      min-height: ${e=>e.imgHMob||"12.1rem"};
+    }
+  }
+`,y=t.newStyled.div`
+  padding: 2rem;
+  display: flex;
+  gap: 1.25rem;
+  justify-content: space-between;
+  flex: 1;
+  flex-direction: column;
+
+  @media (max-width: ${r.MOBILE_SIZE_PX+"px"}) {
+    padding: 1.25rem;
+  }
+`,j=t.newStyled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+
+  & .header-title {
+    font-size: 1.5rem;
+    font-weight: 600;
+  }
+
+  & .header-subtitle {
+    color: var(--gray-600, #676e79);
+    font-size: 1rem;
+    font-weight: 500;
+  }
+
+  @media (max-width: ${r.MOBILE_SIZE_PX+"px"}) {
+    flex-direction: column;
+  }
+`,v=t.newStyled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+
+  & .list-item {
+    display: flex;
+    align-items: center;
+
+    & .mng {
+      font-size: 1.25rem;
+      color: var(--info-600);
+    }
+  }
+
+  @media (max-width: ${r.MOBILE_SIZE_PX+"px"}) {
+  }
+`,$=o.forwardRef((e,S)=>{const{title:a,subtitle:m,buttonText:s,list:n,image:d,imageHeight:l,imageWidth:c,imageHeightMob:x,hasBorder:g=!0,backgroundColor:h="transparent",onBannerClick:p}=e;return i.jsxs(w,{imgH:l,imgW:c,imgHMob:x,hasBorder:g,bgColor:h,children:[i.jsxs(y,{children:[i.jsxs(j,{children:[i.jsx("div",{className:"header-title",children:a}),i.jsx("div",{className:"header-subitle",children:m})]}),i.jsx(v,{children:n==null?void 0:n.map((u,f)=>i.jsx(o.Fragment,{children:i.jsxs("div",{className:"list-item",children:[i.jsx("i",{className:"mng mng-lnc-checkmark--filled"}),i.jsx("span",{children:u})]})},f))}),i.jsx(b,{size:"medium",color:"gray",type:"button",btnType:"outline",onClick:p,children:s})]}),i.jsx("img",{src:d})]})});module.exports=$;

package/dist/index8.js

@@ -0,0 +1,138 @@
+import { jsxs as r, jsx as i } from "react/jsx-runtime";
+import { forwardRef as u, Fragment as w } from "react";
+import { n as t } from "./emotion-styled.browser.esm-BiK8DcgW.js";
+import { M as n } from "./consts-DNVz1x1I.js";
+import v from "./Button.js";
+const y = t.div`
+  display: flex;
+  border-radius: 0.75rem;
+  background-color: ${(e) => e.bgcolor || "transparent"};
+  overflow: hidden;
+
+  & button {
+    width: fit-content;
+  }
+
+  & img {
+    object-fit: cover;
+    max-width: ${(e) => e.imgW || "33.39346rem"};
+    min-width: ${(e) => e.imgW || "33.39346rem"};
+    max-height: ${(e) => e.imgH || "22.5rem"};
+    min-height: ${(e) => e.imgH || "22.5rem"};
+  }
+
+  ${(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);
+
+`}
+
+  @media (max-width: ${n + "px"}) {
+    flex-direction: column;
+    & img {
+      max-width: 100%;
+      min-width: 100%;
+      max-height: ${(e) => e.imgHMob || "12.1rem"};
+      min-height: ${(e) => e.imgHMob || "12.1rem"};
+    }
+  }
+`, $ = t.div`
+  padding: 2rem;
+  display: flex;
+  gap: 1.25rem;
+  justify-content: space-between;
+  flex: 1;
+  flex-direction: column;
+
+  @media (max-width: ${n + "px"}) {
+    padding: 1.25rem;
+  }
+`, H = t.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+
+  & .header-title {
+    font-size: 1.5rem;
+    font-weight: 600;
+  }
+
+  & .header-subtitle {
+    color: var(--gray-600, #676e79);
+    font-size: 1rem;
+    font-weight: 500;
+  }
+
+  @media (max-width: ${n + "px"}) {
+    flex-direction: column;
+  }
+`, W = t.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+
+  & .list-item {
+    display: flex;
+    align-items: center;
+
+    & .mng {
+      font-size: 1.25rem;
+      color: var(--info-600);
+    }
+  }
+
+  @media (max-width: ${n + "px"}) {
+  }
+`, N = u((e, k) => {
+  const {
+    title: o,
+    subtitle: a,
+    buttonText: d,
+    list: m,
+    image: l,
+    imageHeight: c,
+    imageWidth: s,
+    imageHeightMob: g,
+    hasBorder: h = !0,
+    backgroundColor: p = "transparent",
+    onBannerClick: x
+  } = e;
+  return /* @__PURE__ */ r(
+    y,
+    {
+      imgH: c,
+      imgW: s,
+      imgHMob: g,
+      hasBorder: h,
+      bgColor: p,
+      children: [
+        /* @__PURE__ */ r($, { children: [
+          /* @__PURE__ */ r(H, { children: [
+            /* @__PURE__ */ i("div", { className: "header-title", children: o }),
+            /* @__PURE__ */ i("div", { className: "header-subitle", children: a })
+          ] }),
+          /* @__PURE__ */ i(W, { children: m == null ? void 0 : m.map((f, b) => /* @__PURE__ */ i(w, { children: /* @__PURE__ */ r("div", { className: "list-item", children: [
+            /* @__PURE__ */ i("i", { className: "mng mng-lnc-checkmark--filled" }),
+            /* @__PURE__ */ i("span", { children: f })
+          ] }) }, b)) }),
+          /* @__PURE__ */ i(
+            v,
+            {
+              size: "medium",
+              color: "gray",
+              type: "button",
+              btnType: "outline",
+              onClick: x,
+              children: d
+            }
+          )
+        ] }),
+        /* @__PURE__ */ i("img", { src: l })
+      ]
+    }
+  );
+});
+export {
+  N as default
+};

package/dist/index9.cjs

@@ -0,0 +1,150 @@
+"use strict";const r=require("react/jsx-runtime"),c=require("react"),x=require("./Button.cjs"),s=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),i=require("./utils-CE6bljYe.cjs"),h=require("./emotion-element-5486c51c.browser.esm-QRQ5FSjv.cjs"),m=require("./consts-dNz9tpt4.cjs"),f=s.newStyled.div`
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  border-radius: 0.75rem;
+  position: relative;
+  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1), 0px 1px 2px rgba(0, 0, 0, 0.06);
+
+  grid-column: ${t=>{var e;return((e=t.position)==null?void 0:e.columnStart)||"1"}} /
+    ${t=>{var e;return((e=t.position)==null?void 0:e.columnEnd)||"6"}};
+  grid-row: ${t=>{var e;return((e=t.position)==null?void 0:e.rowStart)||"1"}} /
+    ${t=>{var e;return((e=t.position)==null?void 0:e.rowEnd)||"1"}};
+
+  & .wrapper__image {
+    height: 100%;
+    width: 100%;
+    object-fit: cover;
+    border-radius: 0.75rem;
+  }
+
+  & .wrapper__image--skeleton {
+    width: 24.5rem;
+    height: 30rem;
+    border-radius: 0.75rem;
+    background-color: ${i.linearGradientAnimation("-90deg")};
+  }
+
+  & .wrapper__text {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    padding: 1rem;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    gap: 0.75rem;
+
+    & .text__title {
+      color: var(--white, #ffffff);
+      font-size: 1rem;
+      font-style: normal;
+      font-weight: 500;
+      line-height: 1.5rem;
+      ${i.truncateTextInRows(2)}
+    }
+
+    & .text__tag {
+      background-color: var(--warning-600, #d97706);
+      color: var(--white, #ffffff);
+      font-size: 0.875rem;
+      font-style: normal;
+      font-weight: 500;
+      line-height: 1.25rem;
+      padding: 0.25rem 0.5rem;
+
+      border-radius: 0.375rem;
+      background: var(--warning-600, #d97706);
+    }
+
+    & .text__description {
+      color: var(--white);
+      font-size: 0.875rem;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 1.25rem;
+      ${i.truncateTextInRows(2)}
+    }
+
+    & .text__action {
+      background: var(--white);
+      color: var(--black);
+
+      &:hover {
+        background: var(--primary-500, #f59e0b);
+        color: var(--white);
+      }
+    }
+
+    & .text__title--skeleton {
+      background-color: ${i.linearGradientAnimation("-90deg")};
+      height: 1rem;
+      width: 9rem;
+    }
+
+    & .text__description--skeleton {
+      background-color: ${i.linearGradientAnimation("-90deg")};
+      height: 1rem;
+      width: 12rem;
+    }
+
+    & .text__action--skeleton {
+      background-color: ${i.linearGradientAnimation("-90deg")};
+      height: 2rem;
+      width: 9rem;
+    }
+  }
+`,u=c.forwardRef(({title:t,image:e,description:n,actionText:o,onSelectCard:a=()=>{},className:l,position:g,tag:d},y)=>{const p=h.useTheme();return r.jsx(r.Fragment,{children:r.jsxs(f,{theme:p,className:l,onClick:a,position:g,children:[r.jsx("img",{src:e,className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__text",children:[d&&r.jsx("div",{className:"text__tag",children:d}),r.jsx("div",{className:"text__title",children:t}),i.isDefinedNotEmptyString(n)&&r.jsx("div",{className:"text__description",children:n}),i.isDefinedNotEmptyString(o)&&r.jsx(x,{text:o,onClick:a,className:"text__action"})]})]})})}),_=s.newStyled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+
+  & .regular-title {
+    display: flex;
+    gap: 0.5rem;
+    align-items: center;
+    justify-content: space-between;
+    font-size: 1.5rem;
+    font-weight: 600;
+    & .regular-title-text {
+      display: flex;
+      gap: 0.5rem;
+      align-items: center;
+    }
+
+    & i {
+      font-size: 1.5rem;
+      color: var(--primary-500, #f59e0b);
+    }
+  }
+
+  @media (max-width: ${m.MOBILE_SIZE_PX+"px"}) {
+    gap: 1.25rem;
+
+    & .regular-title {
+      font-size: 1.375rem;
+
+      &.center {
+        justify-content: center;
+      }
+    }
+  }
+`,w=s.newStyled.div`
+  display: grid;
+  grid-template-columns: repeat(12, 1fr);
+  grid-template-rows: 15rem 15rem;
+  grid-column-gap: 1.25rem;
+  grid-row-gap: 1.25rem;
+  height: 30rem;
+  max-height: 30rem;
+
+  @media (max-width: ${m.MOBILE_SIZE_PX+"px"}) {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    width: 100%;
+    height: 100%;
+    max-height: 100%;
+    padding: 0 1rem;
+  }
+`,b=c.forwardRef(({title:t,items:e,limit:n=3},o)=>r.jsxs(_,{children:[r.jsx("div",{className:"regular-title",children:r.jsx("div",{className:"regular-title-text",children:r.jsx("span",{children:t})})}),r.jsx(w,{limit:n,children:e&&(e==null?void 0:e.map((a,l)=>r.jsx(u,{...a},`landing-page-masonry-general-card__${l+1}`)))})]}));module.exports=b;