@anoki/fse-ui 1.0.0-beta1.48.5 → 1.0.0-beta1.48.51

package/dist/index.es148.js

@@ -1,17 +1,94 @@
-import { j as r } from "./index.es243.js";
-import { VerticalCardStepper as c } from "./index.es124.js";
-import { Section as e } from "./index.es54.js";
-const p = ({
-  title: s,
-  description: t,
-  steps: o,
-  type: i
-}) => /* @__PURE__ */ r.jsxs(e, { children: [
-  /* @__PURE__ */ r.jsx(e.Title, { color: "blue-48", fs: "2", mdFs: "1", className: "mb-x16", children: s }),
-  /* @__PURE__ */ r.jsx(e.Description, { color: "slate-14", fs: "6", className: "mb-x36", children: t }),
-  /* @__PURE__ */ r.jsx(c, { steps: o, type: i })
-] });
+import { j as s } from "./index.es244.js";
+import { clsx as c } from "./index.es246.js";
+import './sections/ImagesDescription/ImagesDescription.css';/* empty css            */
+import { Section as l } from "./index.es54.js";
+const _ = {
+  // Layout FULL (1 colonna)
+  FULL_1_1: "FULL_1_1",
+  FULL_4_3: "FULL_4_3",
+  FULL_16_9: "FULL_16_9",
+  FULL_21_9: "FULL_21_9",
+  FULL_32_9: "FULL_32_9",
+  // Layout TWO_COL (2 colonne)
+  TWO_COL_1_1: "TWO_COL_1_1",
+  TWO_COL_4_3: "TWO_COL_4_3",
+  TWO_COL_16_9: "TWO_COL_16_9",
+  TWO_COL_21_9: "TWO_COL_21_9",
+  TWO_COL_32_9: "TWO_COL_32_9",
+  // Layout THREE_COL (3 colonne)
+  THREE_COL_1_1: "THREE_COL_1_1",
+  THREE_COL_4_3: "THREE_COL_4_3",
+  THREE_COL_16_9: "THREE_COL_16_9",
+  THREE_COL_21_9: "THREE_COL_21_9",
+  THREE_COL_32_9: "THREE_COL_32_9"
+}, d = ({
+  title: i,
+  items: t = [],
+  layout: a = _.FULL_1_1,
+  className: r
+}) => {
+  const o = ((e) => {
+    switch (e) {
+      // Layout FULL (1 colonna)
+      case _.FULL_1_1:
+        return "images-description-layout-full-1-1";
+      case _.FULL_4_3:
+        return "images-description-layout-full-4-3";
+      case _.FULL_16_9:
+        return "images-description-layout-full-16-9";
+      case _.FULL_21_9:
+        return "images-description-layout-full-21-9";
+      case _.FULL_32_9:
+        return "images-description-layout-full-32-9";
+      // Layout TWO_COL (2 colonne)
+      case _.TWO_COL_1_1:
+        return "images-description-layout-two-col-1-1";
+      case _.TWO_COL_4_3:
+        return "images-description-layout-two-col-4-3";
+      case _.TWO_COL_16_9:
+        return "images-description-layout-two-col-16-9";
+      case _.TWO_COL_21_9:
+        return "images-description-layout-two-col-21-9";
+      case _.TWO_COL_32_9:
+        return "images-description-layout-two-col-32-9";
+      // Layout THREE_COL (3 colonne)
+      case _.THREE_COL_1_1:
+        return "images-description-layout-three-col-1-1";
+      case _.THREE_COL_4_3:
+        return "images-description-layout-three-col-4-3";
+      case _.THREE_COL_16_9:
+        return "images-description-layout-three-col-16-9";
+      case _.THREE_COL_21_9:
+        return "images-description-layout-three-col-21-9";
+      case _.THREE_COL_32_9:
+        return "images-description-layout-three-col-32-9";
+      default:
+        return "";
+    }
+  })(a);
+  return /* @__PURE__ */ s.jsx(l, { className: c("base-col images-description-section", r), children: /* @__PURE__ */ s.jsx(
+    "ul",
+    {
+      role: "list",
+      "aria-label": `Raccolta di ${i}`,
+      className: `list-style-none ${o}`,
+      children: t == null ? void 0 : t.map((e) => /* @__PURE__ */ s.jsxs("li", { className: "images-description-item", children: [
+        /* @__PURE__ */ s.jsx("div", { className: "images-description-item-image-container", children: /* @__PURE__ */ s.jsx(
+          "img",
+          {
+            src: e.image.src,
+            alt: e.image.alt,
+            title: e.image.title,
+            className: "images-description-item-image"
+          }
+        ) }),
+        /* @__PURE__ */ s.jsx("div", { className: "images-description-item-content", children: /* @__PURE__ */ s.jsx("p", { className: "images-description-item-description text-slate-28 fs-9", children: e.description }) })
+      ] }, e._id))
+    }
+  ) });
+};
 export {
-  p as VerticalCardStepperSection
+  _ as IMAGES_DESCRIPTION_LAYOUTS,
+  d as ImagesDescription
 };
 //# sourceMappingURL=index.es148.js.map

package/dist/index.es148.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es148.js","sources":["../src/sections/VerticalCardStepperSection/index.tsx"],"sourcesContent":["import { Section, Step, StepVariantEnum, VerticalCardStepper } from \"@/components\";\n\ntype Props = {\n  title: string;\n  description: string;\n  steps: Step[];\n  type: StepVariantEnum;\n};\n\nexport const VerticalCardStepperSection = ({\n  title,\n  description,\n  steps,\n  type,\n}: Props) => {\n  return (\n    <Section>\n      <Section.Title color=\"blue-48\" fs=\"2\" mdFs=\"1\" className=\"mb-x16\">\n        {title}\n      </Section.Title>\n      <Section.Description color=\"slate-14\" fs=\"6\" className=\"mb-x36\">\n        {description}\n      </Section.Description>\n\n      <VerticalCardStepper steps={steps} type={type} />\n    </Section>\n  );\n};\n"],"names":["VerticalCardStepperSection","title","description","steps","type","Section","jsx","VerticalCardStepper"],"mappings":";;;AASO,MAAMA,IAA6B,CAAC;AAAA,EACzC,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AACF,6BAEKC,GACC,EAAA,UAAA;AAAA,EAACC,gBAAAA,EAAAA,IAAAD,EAAQ,OAAR,EAAc,OAAM,WAAU,IAAG,KAAI,MAAK,KAAI,WAAU,UACtD,UACHJ,EAAA,CAAA;AAAA,EACAK,gBAAAA,EAAAA,IAACD,EAAQ,aAAR,EAAoB,OAAM,YAAW,IAAG,KAAI,WAAU,UACpD,UACHH,EAAA,CAAA;AAAA,EAEAI,gBAAAA,EAAAA,IAACC,GAAoB,EAAA,OAAAJ,GAAc,MAAAC,EAAY,CAAA;AAAA,GACjD;"}
+{"version":3,"file":"index.es148.js","sources":["../src/sections/ImagesDescription/index.tsx"],"sourcesContent":["import { ReactNode } from \"react\";\nimport clsx from \"clsx\";\nimport { Section } from \"../../components\";\nimport \"./ImagesDescription.scss\";\n\nexport const IMAGES_DESCRIPTION_LAYOUTS = {\n  // Layout FULL (1 colonna)\n  FULL_1_1: \"FULL_1_1\",\n  FULL_4_3: \"FULL_4_3\",\n  FULL_16_9: \"FULL_16_9\",\n  FULL_21_9: \"FULL_21_9\",\n  FULL_32_9: \"FULL_32_9\",\n  // Layout TWO_COL (2 colonne)\n  TWO_COL_1_1: \"TWO_COL_1_1\",\n  TWO_COL_4_3: \"TWO_COL_4_3\",\n  TWO_COL_16_9: \"TWO_COL_16_9\",\n  TWO_COL_21_9: \"TWO_COL_21_9\",\n  TWO_COL_32_9: \"TWO_COL_32_9\",\n  // Layout THREE_COL (3 colonne)\n  THREE_COL_1_1: \"THREE_COL_1_1\",\n  THREE_COL_4_3: \"THREE_COL_4_3\",\n  THREE_COL_16_9: \"THREE_COL_16_9\",\n  THREE_COL_21_9: \"THREE_COL_21_9\",\n  THREE_COL_32_9: \"THREE_COL_32_9\",\n} as const;\n\nexport type ImagesDescriptionLayout =\n  (typeof IMAGES_DESCRIPTION_LAYOUTS)[keyof typeof IMAGES_DESCRIPTION_LAYOUTS];\n\nexport interface ImageDescriptionItem {\n  _id: string;\n  image: {\n    src: string;\n    alt: string;\n    title?: string;\n  };\n  description: string;\n}\n\nexport interface ImagesDescriptionProps {\n  title: ReactNode;\n  items: ImageDescriptionItem[];\n  layout?: ImagesDescriptionLayout;\n  className?: string;\n}\n\nexport const ImagesDescription = ({\n  title,\n  items = [],\n  layout = IMAGES_DESCRIPTION_LAYOUTS.FULL_1_1,\n  className,\n}: ImagesDescriptionProps) => {\n  const getLayoutClassName = (l: ImagesDescriptionLayout) => {\n    switch (l) {\n      // Layout FULL (1 colonna)\n      case IMAGES_DESCRIPTION_LAYOUTS.FULL_1_1:\n        return \"images-description-layout-full-1-1\";\n      case IMAGES_DESCRIPTION_LAYOUTS.FULL_4_3:\n        return \"images-description-layout-full-4-3\";\n      case IMAGES_DESCRIPTION_LAYOUTS.FULL_16_9:\n        return \"images-description-layout-full-16-9\";\n      case IMAGES_DESCRIPTION_LAYOUTS.FULL_21_9:\n        return \"images-description-layout-full-21-9\";\n      case IMAGES_DESCRIPTION_LAYOUTS.FULL_32_9:\n        return \"images-description-layout-full-32-9\";\n\n      // Layout TWO_COL (2 colonne)\n      case IMAGES_DESCRIPTION_LAYOUTS.TWO_COL_1_1:\n        return \"images-description-layout-two-col-1-1\";\n      case IMAGES_DESCRIPTION_LAYOUTS.TWO_COL_4_3:\n        return \"images-description-layout-two-col-4-3\";\n      case IMAGES_DESCRIPTION_LAYOUTS.TWO_COL_16_9:\n        return \"images-description-layout-two-col-16-9\";\n      case IMAGES_DESCRIPTION_LAYOUTS.TWO_COL_21_9:\n        return \"images-description-layout-two-col-21-9\";\n      case IMAGES_DESCRIPTION_LAYOUTS.TWO_COL_32_9:\n        return \"images-description-layout-two-col-32-9\";\n\n      // Layout THREE_COL (3 colonne)\n      case IMAGES_DESCRIPTION_LAYOUTS.THREE_COL_1_1:\n        return \"images-description-layout-three-col-1-1\";\n      case IMAGES_DESCRIPTION_LAYOUTS.THREE_COL_4_3:\n        return \"images-description-layout-three-col-4-3\";\n      case IMAGES_DESCRIPTION_LAYOUTS.THREE_COL_16_9:\n        return \"images-description-layout-three-col-16-9\";\n      case IMAGES_DESCRIPTION_LAYOUTS.THREE_COL_21_9:\n        return \"images-description-layout-three-col-21-9\";\n      case IMAGES_DESCRIPTION_LAYOUTS.THREE_COL_32_9:\n        return \"images-description-layout-three-col-32-9\";\n\n      default:\n        return \"\";\n    }\n  };\n\n  /* const isFullLayout = layout.startsWith(\"FULL_\");\n  const isThreeColLayout = layout.startsWith(\"THREE_COL_\");\n\n  const limitedItems = isFullLayout\n    ? items.slice(0, 1)\n    : isThreeColLayout\n      ? items.slice(0, 3)\n      : items.slice(0, 2); */\n\n  const layoutClassName = getLayoutClassName(layout);\n\n  return (\n    <Section className={clsx(\"base-col images-description-section\", className)}>\n      <ul\n        role=\"list\"\n        aria-label={`Raccolta di ${title}`}\n        className={`list-style-none ${layoutClassName}`}\n      >\n        {items?.map((item) => (\n          <li key={item._id} className=\"images-description-item\">\n            <div className=\"images-description-item-image-container\">\n              <img\n                src={item.image.src}\n                alt={item.image.alt}\n                title={item.image.title}\n                className=\"images-description-item-image\"\n              />\n            </div>\n            <div className=\"images-description-item-content\">\n              <p className=\"images-description-item-description text-slate-28 fs-9\">\n                {item.description}\n              </p>\n            </div>\n          </li>\n        ))}\n      </ul>\n    </Section>\n  );\n};\n"],"names":["IMAGES_DESCRIPTION_LAYOUTS","ImagesDescription","title","items","layout","className","layoutClassName","l","Section","clsx","jsx","item","jsxs"],"mappings":";;;;AAKO,MAAMA,IAA6B;AAAA;AAAA,EAExC,UAAU;AAAA,EACV,UAAU;AAAA,EACV,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA;AAAA,EAEX,aAAa;AAAA,EACb,aAAa;AAAA,EACb,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAAA;AAAA,EAEd,eAAe;AAAA,EACf,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,gBAAgB;AAAA,EAChB,gBAAgB;AAClB,GAsBaC,IAAoB,CAAC;AAAA,EAChC,OAAAC;AAAA,EACA,OAAAC,IAAQ,CAAC;AAAA,EACT,QAAAC,IAASJ,EAA2B;AAAA,EACpC,WAAAK;AACF,MAA8B;AAqDtB,QAAAC,KApDqB,CAACC,MAA+B;AACzD,YAAQA,GAAG;AAAA;AAAA,MAET,KAAKP,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA;AAAA,MAGT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA;AAAA,MAGT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MACT,KAAKA,EAA2B;AACvB,eAAA;AAAA,MAET;AACS,eAAA;AAAA,IAAA;AAAA,EAEb,GAW2CI,CAAM;AAEjD,+BACGI,GAAQ,EAAA,WAAWC,EAAK,uCAAuCJ,CAAS,GACvE,UAAAK,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAY,eAAeR,CAAK;AAAA,MAChC,WAAW,mBAAmBI,CAAe;AAAA,MAE5C,iCAAO,IAAI,CAACK,MACVC,gBAAAA,OAAA,MAAA,EAAkB,WAAU,2BAC3B,UAAA;AAAA,QAACF,gBAAAA,EAAAA,IAAA,OAAA,EAAI,WAAU,2CACb,UAAAA,gBAAAA,EAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAKC,EAAK,MAAM;AAAA,YAChB,KAAKA,EAAK,MAAM;AAAA,YAChB,OAAOA,EAAK,MAAM;AAAA,YAClB,WAAU;AAAA,UAAA;AAAA,QAAA,GAEd;AAAA,QACAD,gBAAAA,EAAAA,IAAC,OAAI,EAAA,WAAU,mCACb,UAAAA,gBAAAA,EAAA,IAAC,OAAE,WAAU,0DACV,UAAKC,EAAA,YACR,CAAA,EACF,CAAA;AAAA,MAAA,EAbO,GAAAA,EAAK,GAcd;AAAA,IACD;AAAA,EAAA,GAEL;AAEJ;"}

package/dist/index.es149.js

@@ -1,61 +1,17 @@
-import { j as e } from "./index.es243.js";
-import './sections/TableCard/TableCard.css';/* empty css            */
-import { useState as p, useMemo as x } from "react";
-import { useDebouncedValue as d } from "./index.es260.js";
-import { Search as u } from "./index.es11.js";
-import { GridContainer as h } from "./index.es7.js";
-import { GridItem as f } from "./index.es8.js";
-import { Section as m } from "./index.es54.js";
-import { Col as j } from "./index.es10.js";
-import { Row as b } from "./index.es9.js";
-import { CardFile as C } from "./index.es101.js";
-const Q = ({ title: n, headerTitle: l, data: s = [] }) => {
-  const [i, c] = p(""), o = d(i.trim().toLowerCase(), 300), a = x(() => o ? s.filter(
-    (t) => [
-      t.title,
-      t.description
-    ].some(
-      (r) => r == null ? void 0 : r.toLowerCase().includes(o)
-    )
-  ) : s, [o, s]);
-  return /* @__PURE__ */ e.jsxs(m, { className: "table-card", children: [
-    /* @__PURE__ */ e.jsx(m.Title, { mdFs: "2", fs: "3", color: "blue-48", as: "h2", className: "table-card-section-title", children: n }),
-    /* @__PURE__ */ e.jsxs(j, { children: [
-      /* @__PURE__ */ e.jsxs(
-        b,
-        {
-          alignItems: "flex-start",
-          className: "header-row",
-          justifyContent: "space-between",
-          flexWrap: "wrap",
-          children: [
-            /* @__PURE__ */ e.jsxs("h3", { className: "update-title", children: [
-              l,
-              " ",
-              /* @__PURE__ */ e.jsxs("span", { children: [
-                "(",
-                a.length,
-                ")"
-              ] })
-            ] }),
-            /* @__PURE__ */ e.jsx(
-              u,
-              {
-                variant: "outlined",
-                btnText: "",
-                helperText: "",
-                value: i,
-                onChangeValue: c
-              }
-            )
-          ]
-        }
-      ),
-      /* @__PURE__ */ e.jsx(h, { gap: "x24", mt: "x32", px: "x12", children: a.map((t, r) => /* @__PURE__ */ e.jsx(f, { sm: 6, md: 4, children: /* @__PURE__ */ e.jsx(C, { ...t }) }, `table-card-${r}`)) })
-    ] })
-  ] });
-};
+import { j as r } from "./index.es244.js";
+import { VerticalCardStepper as c } from "./index.es124.js";
+import { Section as e } from "./index.es54.js";
+const p = ({
+  title: s,
+  description: t,
+  steps: o,
+  type: i
+}) => /* @__PURE__ */ r.jsxs(e, { children: [
+  /* @__PURE__ */ r.jsx(e.Title, { color: "blue-48", fs: "2", mdFs: "1", className: "mb-x16", children: s }),
+  /* @__PURE__ */ r.jsx(e.Description, { color: "slate-14", fs: "6", className: "mb-x36", children: t }),
+  /* @__PURE__ */ r.jsx(c, { steps: o, type: i })
+] });
 export {
-  Q as TableCard
+  p as VerticalCardStepperSection
 };
 //# sourceMappingURL=index.es149.js.map

package/dist/index.es149.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es149.js","sources":["../src/sections/TableCard/index.tsx"],"sourcesContent":["import {\n  CardFile,\n  Col,\n  GridContainer,\n  GridItem,\n  Row,\n  Search,\n  Section,\n} from \"@/components\";\nimport \"./TableCard.scss\";\nimport { useMemo, useState } from \"react\";\nimport { useDebouncedValue } from \"@/utils/useDebouncedValue\";\nimport { CardFileProps } from \"@/components/ui/CardFile\";\n\ntype Props = {\n  title: string;\n  headerTitle: string;\n  data?: CardFileProps[];\n};\n\nexport const TableCard = ({ title, headerTitle, data = [] }: Props) => {\n  const [query, setQuery] = useState(\"\");\n  const debouncedQuery = useDebouncedValue(query.trim().toLowerCase(), 300);\n\n  const filtered = useMemo(() => {\n    if (!debouncedQuery) return data;\n    return data.filter((u) =>\n      [\n        u.title,\n        u.description,\n      ].some((field) => \n        field?.toLowerCase().includes(debouncedQuery)\n      ),\n    );\n  }, [debouncedQuery, data]);\n\n  return (\n    <Section className=\"table-card\">\n      <Section.Title mdFs=\"2\" fs=\"3\" color=\"blue-48\" as=\"h2\" className=\"table-card-section-title\">\n        {title}\n      </Section.Title>\n      <Col>\n        <Row\n          alignItems=\"flex-start\"\n          className=\"header-row\"\n          justifyContent=\"space-between\"\n          flexWrap=\"wrap\"\n        >\n          <h3 className=\"update-title\">\n            {headerTitle} <span>({filtered.length})</span>\n          </h3>\n          <Search\n            variant=\"outlined\"\n            btnText=\"\"\n            helperText=\"\"\n            value={query}\n            onChangeValue={setQuery}\n          />\n        </Row>\n        <GridContainer gap=\"x24\" mt=\"x32\" px=\"x12\">\n          {filtered.map((el, index) => (\n            <GridItem key={`table-card-${index}`} sm={6} md={4}>\n              <CardFile {...el} />\n            </GridItem>\n          ))}\n        </GridContainer>\n      </Col>\n    </Section>\n  );\n};\n"],"names":["TableCard","title","headerTitle","data","query","setQuery","useState","debouncedQuery","useDebouncedValue","filtered","useMemo","u","field","jsxs","Section","jsx","Col","Row","Search","GridContainer","el","index","GridItem","CardFile"],"mappings":";;;;;;;;;;;AAoBa,MAAAA,IAAY,CAAC,EAAE,OAAAC,GAAO,aAAAC,GAAa,MAAAC,IAAO,SAAgB;AACrE,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAS,EAAE,GAC/BC,IAAiBC,EAAkBJ,EAAM,OAAO,eAAe,GAAG,GAElEK,IAAWC,EAAQ,MAClBH,IACEJ,EAAK;AAAA,IAAO,CAACQ,MAClB;AAAA,MACEA,EAAE;AAAA,MACFA,EAAE;AAAA,IAAA,EACF;AAAA,MAAK,CAACC,MACNA,KAAA,gBAAAA,EAAO,cAAc,SAASL;AAAA,IAAc;AAAA,EAEhD,IAR4BJ,GAS3B,CAACI,GAAgBJ,CAAI,CAAC;AAGvB,SAAAU,gBAAAA,EAAA,KAACC,GAAQ,EAAA,WAAU,cACjB,UAAA;AAAA,IAAAC,gBAAAA,EAAA,IAACD,EAAQ,OAAR,EAAc,MAAK,KAAI,IAAG,KAAI,OAAM,WAAU,IAAG,MAAK,WAAU,4BAC9D,UACHb,GAAA;AAAA,2BACCe,GACC,EAAA,UAAA;AAAA,MAAAH,gBAAAA,EAAA;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,YAAW;AAAA,UACX,WAAU;AAAA,UACV,gBAAe;AAAA,UACf,UAAS;AAAA,UAET,UAAA;AAAA,YAACJ,gBAAAA,EAAAA,KAAA,MAAA,EAAG,WAAU,gBACX,UAAA;AAAA,cAAAX;AAAA,cAAY;AAAA,qCAAE,QAAK,EAAA,UAAA;AAAA,gBAAA;AAAA,gBAAEO,EAAS;AAAA,gBAAO;AAAA,cAAA,EAAC,CAAA;AAAA,YAAA,GACzC;AAAA,YACAM,gBAAAA,EAAA;AAAA,cAACG;AAAA,cAAA;AAAA,gBACC,SAAQ;AAAA,gBACR,SAAQ;AAAA,gBACR,YAAW;AAAA,gBACX,OAAOd;AAAA,gBACP,eAAeC;AAAA,cAAA;AAAA,YAAA;AAAA,UACjB;AAAA,QAAA;AAAA,MACF;AAAA,MACCU,gBAAAA,EAAA,IAAAI,GAAA,EAAc,KAAI,OAAM,IAAG,OAAM,IAAG,OAClC,UAASV,EAAA,IAAI,CAACW,GAAIC,MACjBN,gBAAAA,MAACO,GAAqC,EAAA,IAAI,GAAG,IAAI,GAC/C,UAAAP,gBAAAA,EAAA,IAACQ,GAAU,EAAA,GAAGH,EAAI,CAAA,EAAA,GADL,cAAcC,CAAK,EAElC,CACD,EACH,CAAA;AAAA,IAAA,EACF,CAAA;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"index.es149.js","sources":["../src/sections/VerticalCardStepperSection/index.tsx"],"sourcesContent":["import { Section, Step, StepVariantEnum, VerticalCardStepper } from \"@/components\";\n\ntype Props = {\n  title: string;\n  description: string;\n  steps: Step[];\n  type: StepVariantEnum;\n};\n\nexport const VerticalCardStepperSection = ({\n  title,\n  description,\n  steps,\n  type,\n}: Props) => {\n  return (\n    <Section>\n      <Section.Title color=\"blue-48\" fs=\"2\" mdFs=\"1\" className=\"mb-x16\">\n        {title}\n      </Section.Title>\n      <Section.Description color=\"slate-14\" fs=\"6\" className=\"mb-x36\">\n        {description}\n      </Section.Description>\n\n      <VerticalCardStepper steps={steps} type={type} />\n    </Section>\n  );\n};\n"],"names":["VerticalCardStepperSection","title","description","steps","type","Section","jsx","VerticalCardStepper"],"mappings":";;;AASO,MAAMA,IAA6B,CAAC;AAAA,EACzC,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AACF,6BAEKC,GACC,EAAA,UAAA;AAAA,EAACC,gBAAAA,EAAAA,IAAAD,EAAQ,OAAR,EAAc,OAAM,WAAU,IAAG,KAAI,MAAK,KAAI,WAAU,UACtD,UACHJ,EAAA,CAAA;AAAA,EACAK,gBAAAA,EAAAA,IAACD,EAAQ,aAAR,EAAoB,OAAM,YAAW,IAAG,KAAI,WAAU,UACpD,UACHH,EAAA,CAAA;AAAA,EAEAI,gBAAAA,EAAAA,IAACC,GAAoB,EAAA,OAAAJ,GAAc,MAAAC,EAAY,CAAA;AAAA,GACjD;"}

package/dist/index.es15.js

@@ -1,9 +1,9 @@
-import { j as e } from "./index.es243.js";
+import { j as e } from "./index.es244.js";
 import { useState as C, useId as G } from "react";
-import { clsx as m } from "./index.es244.js";
+import { clsx as m } from "./index.es246.js";
 import './components/ui/SearchGeneric/SearchGeneric.css';/* empty css            */
-import { useMediaQuery as Q } from "./index.es279.js";
-import { Close as S } from "./index.es160.js";
+import { useMediaQuery as Q } from "./index.es280.js";
+import { Close as S } from "./index.es161.js";
 import { Col as A } from "./index.es10.js";
 import { Button as D } from "./index.es28.js";
 function W({

package/dist/index.es150.js

@@ -1,158 +1,61 @@
-import { j as r } from "./index.es243.js";
-import { useRef as L, useState as g, useCallback as x, useEffect as T } from "react";
-import { Swiper as _, SwiperSlide as V } from "./index.es261.js";
-import B from "./index.es262.js";
-import F from "./index.es263.js";
-import q from "./index.es264.js";
-import './sections/Slider/Slider.css';import './node_modules/swiper/modules/pagination.css';import './node_modules/swiper/modules/navigation.css';import './node_modules/swiper/swiper.css';/* empty css            */
-/* empty css            */
-/* empty css            */
-/* empty css            */
-import { clsx as z } from "./index.es244.js";
-import { Pause as D } from "./index.es269.js";
-import { File as G } from "./index.es185.js";
-import { ArrowLeft as f } from "./index.es172.js";
-import { PlayVideo as H } from "./index.es220.js";
-import { Col as J } from "./index.es10.js";
-import { Row as j } from "./index.es9.js";
-const ae = ({
-  slides: s = [],
-  asLink: w = "a",
-  asImage: N = "img",
-  timeout: l = 3e3,
-  openInNewTab: y = !1,
-  paginationLabel: v = "di",
-  withShadow: C = !0,
-  gradientColor: S = "#3d6289",
-  swiperHeight: I = 574
-  /* type = "full-image" */
-}) => {
-  const P = w || "a", k = N, t = L(null), [a, b] = g(0), [i, A] = g(!0), c = () => {
-    A(!i);
-  }, n = x(() => {
-    if (!t.current) return;
-    const e = t.current;
-    e.isEnd && !e.params.loop ? e.slideTo(0) : e.slideNext();
-  }, []), R = x(() => {
-    if (!t.current) return;
-    const e = t.current;
-    e.isBeginning && !e.params.loop ? e.slideTo(e.slides.length - 1) : e.slidePrev();
-  }, []);
-  T(() => {
-    const e = i ? setInterval(() => {
-      n();
-    }, l) : null;
-    return () => {
-      e && clearInterval(e);
-    };
-  }, [i, n, l]);
-  const $ = {
-    "--gradient": S
-  }, m = {
-    "--swiper-height": `${I}px`
-  };
-  return /* @__PURE__ */ r.jsx(J, { className: "ui-slider-section-wrapper-container", style: m, children: /* @__PURE__ */ r.jsx("div", { className: "ui-slider", children: /* @__PURE__ */ r.jsxs(
-    _,
-    {
-      modules: [B, F, q],
-      slidesPerView: 1,
-      autoplay: i,
-      observer: !0,
-      observeParents: !0,
-      loop: !0,
-      onSwiper: (e) => t.current = e,
-      onSlideChange: (e) => b(e.realIndex),
-      style: m,
-      children: [
-        s.map((e, E) => {
-          var p, d, h;
-          return /* @__PURE__ */ r.jsxs(V, { children: [
-            /* @__PURE__ */ r.jsx(
-              k,
+import { j as e } from "./index.es244.js";
+import './sections/TableCard/TableCard.css';/* empty css            */
+import { useState as p, useMemo as x } from "react";
+import { useDebouncedValue as d } from "./index.es260.js";
+import { Search as u } from "./index.es11.js";
+import { GridContainer as h } from "./index.es7.js";
+import { GridItem as f } from "./index.es8.js";
+import { Section as m } from "./index.es54.js";
+import { Col as j } from "./index.es10.js";
+import { Row as b } from "./index.es9.js";
+import { CardFile as C } from "./index.es101.js";
+const Q = ({ title: n, headerTitle: l, data: s = [] }) => {
+  const [i, c] = p(""), o = d(i.trim().toLowerCase(), 300), a = x(() => o ? s.filter(
+    (t) => [
+      t.title,
+      t.description
+    ].some(
+      (r) => r == null ? void 0 : r.toLowerCase().includes(o)
+    )
+  ) : s, [o, s]);
+  return /* @__PURE__ */ e.jsxs(m, { className: "table-card", children: [
+    /* @__PURE__ */ e.jsx(m.Title, { mdFs: "2", fs: "3", color: "blue-48", as: "h1", className: "table-card-section-title", children: n }),
+    /* @__PURE__ */ e.jsxs(j, { children: [
+      /* @__PURE__ */ e.jsxs(
+        b,
+        {
+          alignItems: "flex-start",
+          className: "header-row",
+          justifyContent: "space-between",
+          flexWrap: "wrap",
+          children: [
+            /* @__PURE__ */ e.jsxs("h3", { className: "update-title", children: [
+              l,
+              " ",
+              /* @__PURE__ */ e.jsxs("span", { children: [
+                "(",
+                a.length,
+                ")"
+              ] })
+            ] }),
+            /* @__PURE__ */ e.jsx(
+              u,
               {
-                src: e.src,
-                alt: e.alt,
-                className: "slider-image",
-                onLoad: () => {
-                  var o, u;
-                  return (u = (o = t.current) == null ? void 0 : o.update) == null ? void 0 : u.call(o);
-                }
-              }
-            ),
-            /* @__PURE__ */ r.jsx(
-              "div",
-              {
-                className: z("slider-content", {
-                  "with-shadow": C
-                }),
-                style: $,
-                children: /* @__PURE__ */ r.jsx("div", { className: "container", children: /* @__PURE__ */ r.jsxs("div", { className: "slider-content-grid", children: [
-                  /* @__PURE__ */ r.jsxs("div", { className: "category", children: [
-                    e.category && /* @__PURE__ */ r.jsx(G, { fillColor: "#fff", width: 30, height: 30 }),
-                    ((p = e.category) == null ? void 0 : p.type) ?? " ",
-                    /* @__PURE__ */ r.jsx("p", { className: "date", children: ((d = e.category) == null ? void 0 : d.published_at) ?? " " })
-                  ] }),
-                  /* @__PURE__ */ r.jsx(
-                    P,
-                    {
-                      href: ((h = s[a]) == null ? void 0 : h.href) || "",
-                      target: y ? "_blank" : "_self",
-                      children: /* @__PURE__ */ r.jsx("h4", { className: "title", children: e.title })
-                    }
-                  )
-                ] }) })
-              }
-            )
-          ] }, E);
-        }),
-        /* @__PURE__ */ r.jsxs(j, { className: "pagination", gap: "x20", children: [
-          s.length > 1 && /* @__PURE__ */ r.jsxs(j, { alignItems: "center", children: [
-            /* @__PURE__ */ r.jsx(
-              f,
-              {
-                width: 40,
-                height: 40,
-                onClick: R,
-                color: "white",
-                className: "cursor-pointer"
-              }
-            ),
-            i ? /* @__PURE__ */ r.jsx(
-              D,
-              {
-                width: 20,
-                height: 20,
-                onClick: c,
-                className: "cursor-pointer"
-              }
-            ) : /* @__PURE__ */ r.jsx(
-              H,
-              {
-                width: 20,
-                height: 20,
-                onClick: c,
-                color: "white",
-                className: "cursor-pointer"
+                variant: "outlined",
+                btnText: "",
+                helperText: "",
+                value: i,
+                onChangeValue: c
               }
             )
-          ] }),
-          /* @__PURE__ */ r.jsx("span", { children: `${a + 1} ${v} ${s.length}` }),
-          s.length > 1 && /* @__PURE__ */ r.jsx(
-            f,
-            {
-              width: 40,
-              height: 40,
-              className: "next cursor-pointer",
-              onClick: n,
-              color: "white"
-            }
-          )
-        ] })
-      ]
-    }
-  ) }) });
+          ]
+        }
+      ),
+      /* @__PURE__ */ e.jsx(h, { gap: "x24", mt: "x32", px: "x12", children: a.map((t, r) => /* @__PURE__ */ e.jsx(f, { sm: 6, md: 4, children: /* @__PURE__ */ e.jsx(C, { ...t }) }, `table-card-${r}`)) })
+    ] })
+  ] });
 };
 export {
-  ae as Slider
+  Q as TableCard
 };
 //# sourceMappingURL=index.es150.js.map

package/dist/index.es150.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es150.js","sources":["../src/sections/Slider/index.tsx"],"sourcesContent":["import {\n  CSSProperties,\n  ElementType,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { Swiper, SwiperSlide } from \"swiper/react\";\nimport { Navigation, Pagination, A11y } from \"swiper/modules\";\nimport \"swiper/css\";\nimport \"swiper/css/navigation\";\nimport \"swiper/css/pagination\";\nimport \"./Slider.scss\";\nimport { ArrowLeft, File, PlayVideo } from \"@/icons\";\nimport clsx from \"clsx\";\nimport { Pause } from \"@/icons/Pause\";\nimport { Col, Row } from \"@/components\";\n\nexport type Slide = {\n  category?: {\n    type: string;\n    published_at: string;\n  };\n  src: string;\n  alt: string;\n  title: string;\n  href?: string;\n};\nexport type SliderType = \"full-image\";\nexport type SliderProps = {\n  slides: Slide[];\n  asImage: ElementType;\n  asLink?: ElementType;\n  timeout?: number;\n  openInNewTab?: boolean;\n  paginationLabel?: string;\n  withShadow?: boolean;\n  gradientColor?: string;\n  type?: SliderType;\n  swiperHeight?: number;\n};\n\nexport const Slider: React.FC<SliderProps> = ({\n  slides = [],\n  asLink = \"a\",\n  asImage = \"img\",\n  timeout = 3000,\n  openInNewTab = false,\n  paginationLabel = \"di\",\n  withShadow = true,\n  gradientColor = \"#3d6289\",\n  swiperHeight = 574,\n  /* type = \"full-image\" */\n}) => {\n  const LinkTag = asLink || \"a\";\n  const ImageComponent = asImage;\n  const swiperRef = useRef<any>(null);\n  const [currentIndex, setCurrentIndex] = useState(0);\n\n  const [autoplay, setAutoplay] = useState(true);\n  const toggleAutoPlay = () => {\n    setAutoplay(!autoplay);\n  };\n\n  const goNext = useCallback(() => {\n    if (!swiperRef.current) return;\n    const swiper = swiperRef.current;\n    if (swiper.isEnd && !swiper.params.loop) {\n      swiper.slideTo(0);\n    } else {\n      swiper.slideNext();\n    }\n  }, []);\n\n  const goPrev = useCallback(() => {\n    if (!swiperRef.current) return;\n    const swiper = swiperRef.current;\n    if (swiper.isBeginning && !swiper.params.loop) {\n      swiper.slideTo(swiper.slides.length - 1);\n    } else {\n      swiper.slidePrev();\n    }\n  }, []);\n\n  useEffect(() => {\n    const intervalId = autoplay\n      ? setInterval(() => {\n          goNext();\n        }, timeout)\n      : null;\n\n    return () => {\n      if (intervalId) clearInterval(intervalId);\n    };\n  }, [autoplay, goNext, timeout]);\n\n  const gradientColorStyle = {\n    \"--gradient\": gradientColor,\n  } as CSSProperties;\n\n  const swiperStyle = {\n    \"--swiper-height\": `${swiperHeight}px`,\n  } as CSSProperties;\n\n  return (\n    <Col className=\"ui-slider-section-wrapper-container\" style={swiperStyle}>\n      <div className=\"ui-slider\">\n        <Swiper\n          modules={[Navigation, Pagination, A11y]}\n          slidesPerView={1}\n          autoplay={autoplay}\n          observer={true}\n          observeParents={true}\n          loop={true}\n          onSwiper={(swiper) => (swiperRef.current = swiper)}\n          onSlideChange={(swiper) => setCurrentIndex(swiper.realIndex)}\n          style={swiperStyle}\n        >\n          {slides.map((slide, index) => (\n            <SwiperSlide key={index}>\n              <ImageComponent\n                src={slide.src}\n                alt={slide.alt}\n                className=\"slider-image\"\n                onLoad={() => swiperRef.current?.update?.()}\n              />\n              <div\n                className={clsx(\"slider-content\", {\n                  \"with-shadow\": withShadow,\n                })}\n                style={gradientColorStyle}\n              >\n                <div className=\"container\">\n                  <div className=\"slider-content-grid\">\n                    <div className=\"category\">\n                      {slide.category && (\n                        <File fillColor=\"#fff\" width={30} height={30} />\n                      )}\n                      {slide.category?.type ?? \" \"}\n                      <p className=\"date\">\n                        {slide.category?.published_at ?? \" \"}\n                      </p>\n                    </div>\n                    <LinkTag\n                      href={slides[currentIndex]?.href || \"\"}\n                      target={openInNewTab ? \"_blank\" : \"_self\"}\n                    >\n                      <h4 className=\"title\">{slide.title}</h4>\n                    </LinkTag>\n                  </div>\n                </div>\n              </div>\n            </SwiperSlide>\n          ))}\n          <Row className=\"pagination\" gap=\"x20\">\n            {slides.length > 1 && (\n              <Row alignItems=\"center\">\n                <ArrowLeft\n                  width={40}\n                  height={40}\n                  onClick={goPrev}\n                  color=\"white\"\n                  className=\"cursor-pointer\"\n                />\n                {autoplay ? (\n                  <Pause\n                    width={20}\n                    height={20}\n                    onClick={toggleAutoPlay}\n                    className=\"cursor-pointer\"\n                  />\n                ) : (\n                  <PlayVideo\n                    width={20}\n                    height={20}\n                    onClick={toggleAutoPlay}\n                    color=\"white\"\n                    className=\"cursor-pointer\"\n                  />\n                )}\n              </Row>\n            )}\n\n            <span>{`${currentIndex + 1} ${paginationLabel} ${slides.length}`}</span>\n            {slides.length > 1 && (\n              <ArrowLeft\n                width={40}\n                height={40}\n                className=\"next cursor-pointer\"\n                onClick={goNext}\n                color=\"white\"\n              />\n            )}\n          </Row>\n        </Swiper>\n      </div>\n    </Col>\n  );\n};\n"],"names":["Slider","slides","asLink","asImage","timeout","openInNewTab","paginationLabel","withShadow","gradientColor","swiperHeight","LinkTag","ImageComponent","swiperRef","useRef","currentIndex","setCurrentIndex","useState","autoplay","setAutoplay","toggleAutoPlay","goNext","useCallback","swiper","goPrev","useEffect","intervalId","gradientColorStyle","swiperStyle","jsx","Col","jsxs","Swiper","Navigation","Pagination","A11y","slide","index","SwiperSlide","_b","_a","clsx","File","_c","Row","ArrowLeft","Pause","PlayVideo"],"mappings":"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"}
+{"version":3,"file":"index.es150.js","sources":["../src/sections/TableCard/index.tsx"],"sourcesContent":["import {\n  CardFile,\n  Col,\n  GridContainer,\n  GridItem,\n  Row,\n  Search,\n  Section,\n} from \"@/components\";\nimport \"./TableCard.scss\";\nimport { useMemo, useState } from \"react\";\nimport { useDebouncedValue } from \"@/utils/useDebouncedValue\";\nimport { CardFileProps } from \"@/components/ui/CardFile\";\n\ntype Props = {\n  title: string;\n  headerTitle: string;\n  data?: CardFileProps[];\n};\n\nexport const TableCard = ({ title, headerTitle, data = [] }: Props) => {\n  const [query, setQuery] = useState(\"\");\n  const debouncedQuery = useDebouncedValue(query.trim().toLowerCase(), 300);\n\n  const filtered = useMemo(() => {\n    if (!debouncedQuery) return data;\n    return data.filter((u) =>\n      [\n        u.title,\n        u.description,\n      ].some((field) => \n        field?.toLowerCase().includes(debouncedQuery)\n      ),\n    );\n  }, [debouncedQuery, data]);\n\n  return (\n    <Section className=\"table-card\">\n      <Section.Title mdFs=\"2\" fs=\"3\" color=\"blue-48\" as=\"h1\" className=\"table-card-section-title\">\n        {title}\n      </Section.Title>\n      <Col>\n        <Row\n          alignItems=\"flex-start\"\n          className=\"header-row\"\n          justifyContent=\"space-between\"\n          flexWrap=\"wrap\"\n        >\n          <h3 className=\"update-title\">\n            {headerTitle} <span>({filtered.length})</span>\n          </h3>\n          <Search\n            variant=\"outlined\"\n            btnText=\"\"\n            helperText=\"\"\n            value={query}\n            onChangeValue={setQuery}\n          />\n        </Row>\n        <GridContainer gap=\"x24\" mt=\"x32\" px=\"x12\">\n          {filtered.map((el, index) => (\n            <GridItem key={`table-card-${index}`} sm={6} md={4}>\n              <CardFile {...el} />\n            </GridItem>\n          ))}\n        </GridContainer>\n      </Col>\n    </Section>\n  );\n};\n"],"names":["TableCard","title","headerTitle","data","query","setQuery","useState","debouncedQuery","useDebouncedValue","filtered","useMemo","u","field","jsxs","Section","jsx","Col","Row","Search","GridContainer","el","index","GridItem","CardFile"],"mappings":";;;;;;;;;;;AAoBa,MAAAA,IAAY,CAAC,EAAE,OAAAC,GAAO,aAAAC,GAAa,MAAAC,IAAO,SAAgB;AACrE,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAS,EAAE,GAC/BC,IAAiBC,EAAkBJ,EAAM,OAAO,eAAe,GAAG,GAElEK,IAAWC,EAAQ,MAClBH,IACEJ,EAAK;AAAA,IAAO,CAACQ,MAClB;AAAA,MACEA,EAAE;AAAA,MACFA,EAAE;AAAA,IAAA,EACF;AAAA,MAAK,CAACC,MACNA,KAAA,gBAAAA,EAAO,cAAc,SAASL;AAAA,IAAc;AAAA,EAEhD,IAR4BJ,GAS3B,CAACI,GAAgBJ,CAAI,CAAC;AAGvB,SAAAU,gBAAAA,EAAA,KAACC,GAAQ,EAAA,WAAU,cACjB,UAAA;AAAA,IAAAC,gBAAAA,EAAA,IAACD,EAAQ,OAAR,EAAc,MAAK,KAAI,IAAG,KAAI,OAAM,WAAU,IAAG,MAAK,WAAU,4BAC9D,UACHb,GAAA;AAAA,2BACCe,GACC,EAAA,UAAA;AAAA,MAAAH,gBAAAA,EAAA;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,YAAW;AAAA,UACX,WAAU;AAAA,UACV,gBAAe;AAAA,UACf,UAAS;AAAA,UAET,UAAA;AAAA,YAACJ,gBAAAA,EAAAA,KAAA,MAAA,EAAG,WAAU,gBACX,UAAA;AAAA,cAAAX;AAAA,cAAY;AAAA,qCAAE,QAAK,EAAA,UAAA;AAAA,gBAAA;AAAA,gBAAEO,EAAS;AAAA,gBAAO;AAAA,cAAA,EAAC,CAAA;AAAA,YAAA,GACzC;AAAA,YACAM,gBAAAA,EAAA;AAAA,cAACG;AAAA,cAAA;AAAA,gBACC,SAAQ;AAAA,gBACR,SAAQ;AAAA,gBACR,YAAW;AAAA,gBACX,OAAOd;AAAA,gBACP,eAAeC;AAAA,cAAA;AAAA,YAAA;AAAA,UACjB;AAAA,QAAA;AAAA,MACF;AAAA,MACCU,gBAAAA,EAAA,IAAAI,GAAA,EAAc,KAAI,OAAM,IAAG,OAAM,IAAG,OAClC,UAASV,EAAA,IAAI,CAACW,GAAIC,MACjBN,gBAAAA,MAACO,GAAqC,EAAA,IAAI,GAAG,IAAI,GAC/C,UAAAP,gBAAAA,EAAA,IAACQ,GAAU,EAAA,GAAGH,EAAI,CAAA,EAAA,GADL,cAAcC,CAAK,EAElC,CACD,EACH,CAAA;AAAA,IAAA,EACF,CAAA;AAAA,EAAA,GACF;AAEJ;"}