@lanaco/lnc-react-ui 4.0.170 → 4.0.171

package/dist/FieldOfInterestsWithTagsCardsSection.js

@@ -1,11 +1,12 @@
-import { jsx as i, jsxs as m } from "react/jsx-runtime";
-import { forwardRef as d } from "react";
-import { s as c } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { p as x, o as u, k as $, l as N } from "./utils-BdsZgOUE.js";
-import { M as v } from "./consts-BuFChS64.js";
-import C from "./Icon.js";
-import { u as I } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-const W = c.div`
+import { jsxs as l, jsx as i } from "react/jsx-runtime";
+import { forwardRef as h } from "react";
+import { o as _, k as b, l as k } from "./utils-DHfRApMf.js";
+import N from "./Icon.js";
+import { s as g } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as x } from "./consts-BuFChS64.js";
+import { u as C } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+import { S as I, a as $ } from "./index-DxwIu0Wn.js";
+const W = g.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -43,7 +44,7 @@ const W = c.div`
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${x(2)}
+      ${_(2)}
     }
 
     & .wrapper__description {
@@ -53,16 +54,11 @@ const W = c.div`
       font-weight: 400;
       line-height: 1rem;
       letter-spacing: 0.025rem;
-      ${x(2)}
+      ${_(2)}
     }
   }
   cursor: pointer;
-`, j = c.div`
-  width: 100%;
-  height: 11.625rem;
-  border-radius: 0.75rem;
-  background: ${u("-90deg")};
-`, F = c.div`
+`, j = g.div`
   display: flex;
   padding: 0 0.75rem 0 0.75rem;
   align-items: center;
@@ -113,42 +109,37 @@ const W = c.div`
     }
   }
 
-  @media (max-width: ${v + "px"}) {
+  @media (max-width: ${x + "px"}) {
     min-width: fit-content;
   }
-`, T = c.div`
-  width: 7rem;
-  height: 3rem;
-  border-radius: 999px;
-  background: ${u("-90deg")};
-`, z = d(({}, r) => /* @__PURE__ */ i(T, {})), O = d(
+`, F = h(
   ({ name: r, isActive: a, activeColor: t, icon: n, onSelectCard: s = () => {
-  } }, p) => /* @__PURE__ */ m(
-    F,
+  } }, o) => /* @__PURE__ */ l(
+    j,
     {
-      ref: p,
+      ref: o,
       className: a ? "active" : "",
       activeColor: t,
       onClick: s,
       children: [
-        $(n) && /* @__PURE__ */ i(C, { icon: n, className: "wrapper__icon" }),
+        b(n) && /* @__PURE__ */ i(N, { icon: n, className: "wrapper__icon" }),
         /* @__PURE__ */ i("div", { className: "wrapper__text", children: r })
       ]
     }
   )
-), A = d(
+), z = h(
   ({ image: r, imageComponent: a, name: t, description: n, onSelectCard: s = () => {
-  } }, p) => {
-    const { theme: f } = I();
-    return /* @__PURE__ */ m(W, { ref: p, theme: f, onClick: s, children: [
-      N(a) ? a : /* @__PURE__ */ i("img", { src: r, className: "wrapper__image" }),
-      /* @__PURE__ */ m("div", { className: "wrapper__content", children: [
+  } }, o) => {
+    const { theme: p } = C();
+    return /* @__PURE__ */ l(W, { ref: o, theme: p, onClick: s, children: [
+      k(a) ? a : /* @__PURE__ */ i("img", { src: r, className: "wrapper__image" }),
+      /* @__PURE__ */ l("div", { className: "wrapper__content", children: [
         t && /* @__PURE__ */ i("div", { className: "wrapper__title", children: t }),
         n && /* @__PURE__ */ i("div", { className: "wrapper__description", children: n })
       ] })
     ] });
   }
-), E = d(({}, r) => /* @__PURE__ */ i(j, {})), M = c.div`
+), O = g.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -196,7 +187,7 @@ const W = c.div`
     width: 100%;
   }
 
-  @media (max-width: ${v + "px"}) {
+  @media (max-width: ${x + "px"}) {
     gap: 1rem;
 
     & .wrapper__tags {
@@ -225,72 +216,77 @@ const W = c.div`
       gap: 1rem;
     }
   }
-`, X = d(
+`, G = h(
   ({
     title: r,
     subtitle: a,
     tags: t = [],
     limitTags: n = 7,
     limitTagsForMobile: s = 7,
-    limit: p = 3,
-    limitForMobile: f = 2,
-    items: o = [],
-    selectedTag: y,
-    activeColor: b,
-    onSelectTag: h = () => {
+    limit: o = 3,
+    limitForMobile: p = 2,
+    items: m = [],
+    isLoadingTags: w = !1,
+    isLoadingCards: T = !1,
+    selectedTag: v,
+    activeColor: u,
+    onSelectTag: d = () => {
     },
-    onSelectCard: _ = () => {
+    onSelectCard: c = () => {
     }
-  }, k) => {
-    var g, w;
-    return /* @__PURE__ */ m(
-      M,
-      {
-        ref: k,
-        limitTags: n,
-        limitTagsForMobile: s,
-        limitCards: p,
-        limitCardsForMobile: f,
-        children: [
-          /* @__PURE__ */ m("div", { className: "wrapper__heading", children: [
-            r && /* @__PURE__ */ i("div", { className: "wrapper__title", children: r }),
-            a && /* @__PURE__ */ i("div", { className: "wrapper__subtitle", children: a })
-          ] }),
-          /* @__PURE__ */ i("div", { className: "wrapper__tags", children: t && (t == null ? void 0 : t.length) > 0 ? t == null ? void 0 : t.map((e, l) => /* @__PURE__ */ i(
-            O,
-            {
-              icon: e == null ? void 0 : e.icon,
-              name: e == null ? void 0 : e.title,
-              isActive: (e == null ? void 0 : e.code) === y,
-              activeColor: b,
-              onSelectCard: () => h == null ? void 0 : h(e)
-            },
-            `field-of-interests-with-tags-card-tag__${l + 1}`
-          )) : (g = Array.from("123")) == null ? void 0 : g.map((e, l) => /* @__PURE__ */ i(
-            z,
-            {},
-            `field-of-interests-with-tags-card-tag-skeleton__${l + 1}`
-          )) }),
-          /* @__PURE__ */ i("div", { className: "wrapper__cards", children: o && (o == null ? void 0 : o.length) > 0 ? o == null ? void 0 : o.map((e, l) => /* @__PURE__ */ i(
-            A,
-            {
-              image: e == null ? void 0 : e.image,
-              imageComponent: e == null ? void 0 : e.imageComponent,
-              name: e == null ? void 0 : e.title,
-              description: e == null ? void 0 : e.description,
-              onSelectCard: () => _ == null ? void 0 : _(e)
-            },
-            `field-of-interests-with-tags-card__${l + 1}`
-          )) : (w = Array.from("123")) == null ? void 0 : w.map((e, l) => /* @__PURE__ */ i(
-            E,
-            {},
-            `field-of-interests-with-tags-card-skeleton__${l + 1}`
-          )) })
-        ]
-      }
-    );
-  }
+  }, y) => /* @__PURE__ */ l(
+    O,
+    {
+      ref: y,
+      limitTags: n,
+      limitTagsForMobile: s,
+      limitCards: o,
+      limitCardsForMobile: p,
+      children: [
+        /* @__PURE__ */ l("div", { className: "wrapper__heading", children: [
+          r && /* @__PURE__ */ i("div", { className: "wrapper__title", children: r }),
+          a && /* @__PURE__ */ i("div", { className: "wrapper__subtitle", children: a })
+        ] }),
+        /* @__PURE__ */ i(
+          I,
+          {
+            isLoading: w,
+            keyPrefix: "field-of-interests-with-tags-tag",
+            children: /* @__PURE__ */ i("div", { className: "wrapper__tags", children: t == null ? void 0 : t.map((e, f) => /* @__PURE__ */ i(
+              F,
+              {
+                icon: e == null ? void 0 : e.icon,
+                name: e == null ? void 0 : e.title,
+                isActive: (e == null ? void 0 : e.code) === v,
+                activeColor: u,
+                onSelectCard: () => d == null ? void 0 : d(e)
+              },
+              `field-of-interests-with-tags-card-tag__${f + 1}`
+            )) })
+          }
+        ),
+        /* @__PURE__ */ i(
+          $,
+          {
+            isLoading: w,
+            keyPrefix: "field-of-interests-with-tags-card",
+            children: /* @__PURE__ */ i("div", { className: "wrapper__cards", children: m == null ? void 0 : m.map((e, f) => /* @__PURE__ */ i(
+              z,
+              {
+                image: e == null ? void 0 : e.image,
+                imageComponent: e == null ? void 0 : e.imageComponent,
+                name: e == null ? void 0 : e.title,
+                description: e == null ? void 0 : e.description,
+                onSelectCard: () => c == null ? void 0 : c(e)
+              },
+              `field-of-interests-with-tags-card__${f + 1}`
+            )) })
+          }
+        )
+      ]
+    }
+  )
 );
 export {
-  X as default
+  G as default
 };

package/dist/FileInput.js

@@ -2,7 +2,7 @@ import { jsxs as R, jsx as m } from "react/jsx-runtime";
 import { forwardRef as S, useState as y } from "react";
 import { s as b } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { P as t } from "./index-CblbdqjE.js";
-import { d as x, b as a, e as V, c as $, h as I } from "./utils-BdsZgOUE.js";
+import { d as x, b as a, e as V, c as $, h as I } from "./utils-DHfRApMf.js";
 import { u as B } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const D = b.label`
   display: inline-flex;

package/dist/FlexGridItem.js

@@ -2,7 +2,7 @@ import { jsx as y } from "react/jsx-runtime";
 import { forwardRef as N, useState as S, useEffect as b } from "react";
 import { P as i } from "./index-CblbdqjE.js";
 import { s as I } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { u as M } from "./utils-BdsZgOUE.js";
+import { u as M } from "./utils-DHfRApMf.js";
 const W = I.div`
   ${(t) => t.width > 0 ? "" : "flex: 1;"}
   min-width: ${(t) => 100 / t.columns}%;

package/dist/FormField.js

@@ -1,7 +1,7 @@
 import { jsxs as b, jsx as a } from "react/jsx-runtime";
 import { P as l } from "./index-CblbdqjE.js";
 import { s as m } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { c as i, b as n } from "./utils-BdsZgOUE.js";
+import { c as i, b as n } from "./utils-DHfRApMf.js";
 import { u as g } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const f = m.label`
   display: block;

package/dist/FormView.js

@@ -17,7 +17,7 @@ import X from "./TimeInput.js";
 import Z from "./ColorInput.js";
 import z from "./FileInput.js";
 import ee from "./RangeSlider.js";
-import { g as re, a as te, b as oe } from "./utils-BdsZgOUE.js";
+import { g as re, a as te, b as oe } from "./utils-DHfRApMf.js";
 import ae from "./FormField.js";
 import { u as ne } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const ie = y.div`

package/dist/GeneralWithTagsCardsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),o=require("react"),d=require("./emotion-styled.browser.esm-BtEseadx.cjs"),m=require("./consts-goSZX3xP.cjs"),p=require("./utils-Dl9xPH4c.cjs"),y=require("./Icon.cjs"),v=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),j=d.styled.div`
+"use strict";const r=require("react/jsx-runtime"),m=require("react"),y=require("./Icon.cjs"),g=require("./emotion-styled.browser.esm-BtEseadx.cjs"),x=require("./consts-goSZX3xP.cjs"),w=require("./utils-Dl9xPH4c.cjs"),v=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),f=require("./index-BAJkosVg.cjs"),j=g.styled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -35,13 +35,13 @@
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${p.truncateTextInRows(2)}
+      ${w.truncateTextInRows(2)}
       transition: var(--transition, all 0.2s ease);
     }
   }
-    cursor: pointer;
+  cursor: pointer;
 
-  @media (max-width: ${m.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${x.MOBILE_SIZE_PX+"px"}) {
     background: transparent;
     border: none;
     box-shadow: none;
@@ -63,18 +63,7 @@
       }
     }
   }
-`,k=d.styled.div`
-  width: 100%;
-  height: 11.625rem;
-  border-radius: 0.75rem;
-  background: ${p.linearGradientAnimation("-90deg")};
-
-  @media (max-width: ${m.MOBILE_SIZE_PX+"px"}) {
-    width: 5rem;
-    height: 5rem;
-    border-radius: 999px;
-  }
-`,$=d.styled.div`
+`,k=g.styled.div`
   display: flex;
   padding: 0 0.75rem 0 0.75rem;
   align-items: center;
@@ -115,17 +104,12 @@
     letter-spacing: -0.09px;
   }
 
-  @media (max-width: ${m.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${x.MOBILE_SIZE_PX+"px"}) {
     & .wrapper__text {
       white-space: nowrap;
     }
   }
-`,N=d.styled.div`
-  width: 7rem;
-  height: 3rem;
-  border-radius: 999px;
-  background: ${p.linearGradientAnimation("-90deg")};
-`,C=o.forwardRef(({},a)=>r.jsx(N,{})),E=o.forwardRef(({title:a,icon:i,onSelectCard:t=()=>{}},l)=>r.jsxs($,{ref:l,onClick:t,children:[p.isDefinedNotEmptyString(i)&&r.jsx(y,{icon:i,className:"wrapper__icon"}),r.jsx("div",{className:"wrapper__text",children:a})]})),I=o.forwardRef(({imageUrl:a,imageComponent:i,title:t,onSelectCard:l=()=>{}},c)=>{const{theme:g}=v.useTheme();return r.jsxs(j,{ref:c,theme:g,onClick:l,children:[p.isDefined(i)?i:r.jsx("img",{src:a,className:"wrapper__image"}),r.jsx("div",{className:"wrapper__content",children:r.jsx("div",{className:"wrapper__title",children:t})})]})}),W=o.forwardRef(({},a)=>r.jsx(k,{})),G=d.styled.div`
+`,I=m.forwardRef(({title:t,icon:a,onSelectCard:i=()=>{}},n)=>r.jsxs(k,{ref:n,onClick:i,children:[w.isDefinedNotEmptyString(a)&&r.jsx(y,{icon:a,className:"wrapper__icon"}),r.jsx("div",{className:"wrapper__text",children:t})]})),N=m.forwardRef(({imageUrl:t,imageComponent:a,title:i,onSelectCard:n=()=>{}},s)=>{const{theme:l}=v.useTheme();return r.jsxs(j,{ref:s,theme:l,onClick:n,children:[w.isDefined(a)?a:r.jsx("img",{src:t,className:"wrapper__image"}),r.jsx("div",{className:"wrapper__content",children:r.jsx("div",{className:"wrapper__title",children:i})})]})}),$=g.styled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -167,13 +151,13 @@
 
   & .wrapper__cards {
     display: grid;
-    grid-template-columns: ${a=>`repeat(${a==null?void 0:a.limitCards}, minmax(0, 1fr))`};
+    grid-template-columns: ${t=>`repeat(${t==null?void 0:t.limitCards}, minmax(0, 1fr))`};
     justify-content: center;
     align-items: center;
     gap: 1.5rem;
   }
 
-  @media (max-width: ${m.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${x.MOBILE_SIZE_PX+"px"}) {
     & .wrapper__tags {
       display: flex;
       flex-wrap: nowrap;
@@ -197,8 +181,8 @@
     }
 
     & .wrapper__cards {
-      grid-template-columns: ${a=>`repeat(${a==null?void 0:a.limitCardsForMobile}, minmax(0, 1fr))`};
+      grid-template-columns: ${t=>`repeat(${t==null?void 0:t.limitCardsForMobile}, minmax(0, 1fr))`};
       gap: 1rem;
     }
   }
-`,R=o.forwardRef(({title:a,subtitle:i,options:t=[],limitTags:l=7,limitTagsForMobile:c=2,limit:g=3,limitForMobile:f=3,items:n=[],onSelectTag:h=()=>{},onSelectCard:_=()=>{},isLoading:u},b)=>{var x,w;return r.jsxs(G,{ref:b,limitTags:l,limitTagsForMobile:c,limitCards:g,limitCardsForMobile:f,children:[r.jsxs("div",{className:"wrapper__heading",children:[a&&r.jsx("div",{className:"wrapper__title",children:a}),i&&r.jsx("div",{className:"wrapper__subtitle",children:i})]}),r.jsx("div",{className:"wrapper__cards",children:n&&(n==null?void 0:n.length)>0?n==null?void 0:n.map((e,s)=>r.jsx(I,{imageUrl:e==null?void 0:e.imageUrl,imageComponent:e==null?void 0:e.imageComponent,title:e==null?void 0:e.title,onSelectCard:()=>{_==null||_(e)}},`general-with-tags-card__${s+1}`)):(x=Array.from("123"))==null?void 0:x.map((e,s)=>r.jsx(W,{},`general-with-tags-card-skeleton__${s+1}`))}),(t==null?void 0:t.length)>0&&r.jsx("div",{className:"wrapper__tags",children:t==null?void 0:t.map((e,s)=>r.jsx(E,{icon:e==null?void 0:e.icon,title:e==null?void 0:e.title,onSelectCard:()=>h==null?void 0:h(e)},`general-with-tags-card-tag__${s+1}`))}),u===!0&&!((t==null?void 0:t.length)>0)&&r.jsx("div",{className:"wrapper__tags",children:(w=Array.from("123"))==null?void 0:w.map((e,s)=>r.jsx(C,{},`general-with-tags-card-tag-skeleton__${s+1}`))})]})});module.exports=R;
+`,C=m.forwardRef(({title:t,subtitle:a,options:i=[],limitTags:n=7,limitTagsForMobile:s=2,limit:l=3,limitForMobile:h=3,items:o=[],onSelectTag:p=()=>{},onSelectCard:d=()=>{},isLoadingTags:_=!1,isLoadingCards:u=!1},b)=>r.jsxs($,{ref:b,limitTags:n,limitTagsForMobile:s,limitCards:l,limitCardsForMobile:h,children:[r.jsxs("div",{className:"wrapper__heading",children:[t&&r.jsx("div",{className:"wrapper__title",children:t}),a&&r.jsx("div",{className:"wrapper__subtitle",children:a})]}),r.jsx(f.SuspenseFieldOfInterestsWithTagsCard,{isLoading:u,keyPrefix:"general-with-tags-cards-card",children:r.jsx("div",{className:"wrapper__cards",children:o==null?void 0:o.map((e,c)=>r.jsx(N,{imageUrl:e==null?void 0:e.imageUrl,imageComponent:e==null?void 0:e.imageComponent,title:e==null?void 0:e.title,onSelectCard:()=>{d==null||d(e)}},`general-with-tags-card__${c+1}`))})}),r.jsx(f.SuspenseFieldOfInterestsWithTagsTag,{isLoading:_,keyPrefix:"general-with-tags-cards-tag",children:r.jsx("div",{className:"wrapper__tags",children:i==null?void 0:i.map((e,c)=>r.jsx(I,{icon:e==null?void 0:e.icon,title:e==null?void 0:e.title,onSelectCard:()=>p==null?void 0:p(e)},`general-with-tags-card-tag__${c+1}`))})})]}));module.exports=C;

package/dist/GeneralWithTagsCardsSection.js

@@ -1,11 +1,12 @@
-import { jsx as a, jsxs as m } from "react/jsx-runtime";
-import { forwardRef as s } from "react";
-import { s as p } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as d } from "./consts-BuFChS64.js";
-import { p as y, o as x, k, l as $ } from "./utils-BdsZgOUE.js";
-import N from "./Icon.js";
-import { u as C } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-const W = p.div`
+import { jsxs as s, jsx as a } from "react/jsx-runtime";
+import { forwardRef as g } from "react";
+import b from "./Icon.js";
+import { s as f } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as h } from "./consts-BuFChS64.js";
+import { o as v, k as y, l as k } from "./utils-DHfRApMf.js";
+import { u as N } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+import { a as $, S as C } from "./index-DxwIu0Wn.js";
+const W = f.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -42,13 +43,13 @@ const W = p.div`
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${y(2)}
+      ${v(2)}
       transition: var(--transition, all 0.2s ease);
     }
   }
-    cursor: pointer;
+  cursor: pointer;
 
-  @media (max-width: ${d + "px"}) {
+  @media (max-width: ${h + "px"}) {
     background: transparent;
     border: none;
     box-shadow: none;
@@ -70,18 +71,7 @@ const W = p.div`
       }
     }
   }
-`, j = p.div`
-  width: 100%;
-  height: 11.625rem;
-  border-radius: 0.75rem;
-  background: ${x("-90deg")};
-
-  @media (max-width: ${d + "px"}) {
-    width: 5rem;
-    height: 5rem;
-    border-radius: 999px;
-  }
-`, G = p.div`
+`, j = f.div`
   display: flex;
   padding: 0 0.75rem 0 0.75rem;
   align-items: center;
@@ -122,33 +112,28 @@ const W = p.div`
     letter-spacing: -0.09px;
   }
 
-  @media (max-width: ${d + "px"}) {
+  @media (max-width: ${h + "px"}) {
     & .wrapper__text {
       white-space: nowrap;
     }
   }
-`, T = p.div`
-  width: 7rem;
-  height: 3rem;
-  border-radius: 999px;
-  background: ${x("-90deg")};
-`, z = s(({}, r) => /* @__PURE__ */ a(T, {})), I = s(
+`, I = g(
   ({ title: r, icon: i, onSelectCard: t = () => {
-  } }, o) => /* @__PURE__ */ m(G, { ref: o, onClick: t, children: [
-    k(i) && /* @__PURE__ */ a(N, { icon: i, className: "wrapper__icon" }),
+  } }, n) => /* @__PURE__ */ s(j, { ref: n, onClick: t, children: [
+    y(i) && /* @__PURE__ */ a(b, { icon: i, className: "wrapper__icon" }),
     /* @__PURE__ */ a("div", { className: "wrapper__text", children: r })
   ] })
-), E = s(
+), z = g(
   // eslint-disable-next-line react/prop-types
-  ({ imageUrl: r, imageComponent: i, title: t, onSelectCard: o = () => {
-  } }, c) => {
-    const { theme: g } = C();
-    return /* @__PURE__ */ m(W, { ref: c, theme: g, onClick: o, children: [
-      $(i) ? i : /* @__PURE__ */ a("img", { src: r, className: "wrapper__image" }),
+  ({ imageUrl: r, imageComponent: i, title: t, onSelectCard: n = () => {
+  } }, l) => {
+    const { theme: o } = N();
+    return /* @__PURE__ */ s(W, { ref: l, theme: o, onClick: n, children: [
+      k(i) ? i : /* @__PURE__ */ a("img", { src: r, className: "wrapper__image" }),
       /* @__PURE__ */ a("div", { className: "wrapper__content", children: /* @__PURE__ */ a("div", { className: "wrapper__title", children: t }) })
     ] });
   }
-), M = s(({}, r) => /* @__PURE__ */ a(j, {})), A = p.div`
+), T = f.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -196,7 +181,7 @@ const W = p.div`
     gap: 1.5rem;
   }
 
-  @media (max-width: ${d + "px"}) {
+  @media (max-width: ${h + "px"}) {
     & .wrapper__tags {
       display: flex;
       flex-wrap: nowrap;
@@ -224,71 +209,74 @@ const W = p.div`
       gap: 1rem;
     }
   }
-`, O = s(
+`, R = g(
   ({
     title: r,
     subtitle: i,
     options: t = [],
-    limitTags: o = 7,
-    limitTagsForMobile: c = 2,
-    limit: g = 3,
-    limitForMobile: u = 3,
-    items: n = [],
-    onSelectTag: h = () => {
+    limitTags: n = 7,
+    limitTagsForMobile: l = 2,
+    limit: o = 3,
+    limitForMobile: w = 3,
+    items: p = [],
+    onSelectTag: m = () => {
     },
-    onSelectCard: f = () => {
+    onSelectCard: d = () => {
     },
-    isLoading: b
-  }, v) => {
-    var w, _;
-    return /* @__PURE__ */ m(
-      A,
-      {
-        ref: v,
-        limitTags: o,
-        limitTagsForMobile: c,
-        limitCards: g,
-        limitCardsForMobile: u,
-        children: [
-          /* @__PURE__ */ m("div", { className: "wrapper__heading", children: [
-            r && /* @__PURE__ */ a("div", { className: "wrapper__title", children: r }),
-            i && /* @__PURE__ */ a("div", { className: "wrapper__subtitle", children: i })
-          ] }),
-          /* @__PURE__ */ a("div", { className: "wrapper__cards", children: n && (n == null ? void 0 : n.length) > 0 ? n == null ? void 0 : n.map((e, l) => /* @__PURE__ */ a(
-            E,
-            {
-              imageUrl: e == null ? void 0 : e.imageUrl,
-              imageComponent: e == null ? void 0 : e.imageComponent,
-              title: e == null ? void 0 : e.title,
-              onSelectCard: () => {
-                f == null || f(e);
-              }
-            },
-            `general-with-tags-card__${l + 1}`
-          )) : (w = Array.from("123")) == null ? void 0 : w.map((e, l) => /* @__PURE__ */ a(
-            M,
-            {},
-            `general-with-tags-card-skeleton__${l + 1}`
-          )) }),
-          (t == null ? void 0 : t.length) > 0 && /* @__PURE__ */ a("div", { className: "wrapper__tags", children: t == null ? void 0 : t.map((e, l) => /* @__PURE__ */ a(
-            I,
-            {
-              icon: e == null ? void 0 : e.icon,
-              title: e == null ? void 0 : e.title,
-              onSelectCard: () => h == null ? void 0 : h(e)
-            },
-            `general-with-tags-card-tag__${l + 1}`
-          )) }),
-          b === !0 && !((t == null ? void 0 : t.length) > 0) && /* @__PURE__ */ a("div", { className: "wrapper__tags", children: (_ = Array.from("123")) == null ? void 0 : _.map((e, l) => /* @__PURE__ */ a(
-            z,
-            {},
-            `general-with-tags-card-tag-skeleton__${l + 1}`
-          )) })
-        ]
-      }
-    );
-  }
+    isLoadingTags: _ = !1,
+    isLoadingCards: x = !1
+  }, u) => /* @__PURE__ */ s(
+    T,
+    {
+      ref: u,
+      limitTags: n,
+      limitTagsForMobile: l,
+      limitCards: o,
+      limitCardsForMobile: w,
+      children: [
+        /* @__PURE__ */ s("div", { className: "wrapper__heading", children: [
+          r && /* @__PURE__ */ a("div", { className: "wrapper__title", children: r }),
+          i && /* @__PURE__ */ a("div", { className: "wrapper__subtitle", children: i })
+        ] }),
+        /* @__PURE__ */ a(
+          $,
+          {
+            isLoading: x,
+            keyPrefix: "general-with-tags-cards-card",
+            children: /* @__PURE__ */ a("div", { className: "wrapper__cards", children: p == null ? void 0 : p.map((e, c) => /* @__PURE__ */ a(
+              z,
+              {
+                imageUrl: e == null ? void 0 : e.imageUrl,
+                imageComponent: e == null ? void 0 : e.imageComponent,
+                title: e == null ? void 0 : e.title,
+                onSelectCard: () => {
+                  d == null || d(e);
+                }
+              },
+              `general-with-tags-card__${c + 1}`
+            )) })
+          }
+        ),
+        /* @__PURE__ */ a(
+          C,
+          {
+            isLoading: _,
+            keyPrefix: "general-with-tags-cards-tag",
+            children: /* @__PURE__ */ a("div", { className: "wrapper__tags", children: t == null ? void 0 : t.map((e, c) => /* @__PURE__ */ a(
+              I,
+              {
+                icon: e == null ? void 0 : e.icon,
+                title: e == null ? void 0 : e.title,
+                onSelectCard: () => m == null ? void 0 : m(e)
+              },
+              `general-with-tags-card-tag__${c + 1}`
+            )) })
+          }
+        )
+      ]
+    }
+  )
 );
 export {
-  O as default
+  R as default
 };