@anoki/fse-ui 2.3.0-4-SNAPSHOT2 → 2.3.0-5-SNAPSHOT1

package/dist/index.es138.js

@@ -1,13 +1,13 @@
-import { j as t } from "./index.es237.js";
-import { ArrowDown as M } from "./index.es165.js";
-import { RichText as V } from "./index.es143.js";
-import { clsx as n } from "./index.es239.js";
+import { j as t } from "./index.es241.js";
+import { ArrowDown as M } from "./index.es168.js";
+import { RichText as V } from "./index.es146.js";
+import { clsx as n } from "./index.es243.js";
 import { useState as p, useRef as S } from "react";
 import './components/ui/VideoPlayer/VideoPlayer.css';/* empty css            */
 import { VIDEO_PLAYER_SIZE as e } from "./index.es139.js";
-import G from "./index.es451.js";
+import G from "./index.es455.js";
 import { Col as U } from "./index.es61.js";
-import { PlayVideo as B } from "./index.es220.js";
+import { PlayVideo as B } from "./index.es223.js";
 const F = {
   [e.SMALL]: {
     width: "311px"

package/dist/index.es14.js

@@ -1,4 +1,4 @@
-import { j as s } from "./index.es237.js";
+import { j as s } from "./index.es241.js";
 import './components/ui/AccessLogSkeleton/AccessLogSkeleton.css';/* empty css            */
 const n = () => /* @__PURE__ */ s.jsxs("div", { className: "access-skeleton-container", children: [
   /* @__PURE__ */ s.jsxs("div", { className: "access-skeleton-search-row", children: [

package/dist/index.es140.js

@@ -1,53 +1,69 @@
-import { j as i } from "./index.es237.js";
-import { Section as s } from "./index.es123.js";
-import './sections/Login/Login.css';/* empty css            */
-import { EntryButton as g } from "./index.es82.js";
-import { Col as o } from "./index.es61.js";
-const N = ({
-  title: l,
-  description: e,
-  loginTitle: n,
-  loginDescription: r,
-  buttonLabel: t,
-  buttonAriaLabel: c,
-  buttonHref: a,
-  asImage: m = "img",
-  region: d = "marche",
-  authSrc: h = ""
+import { j as c } from "./index.es241.js";
+import { useState as f, useRef as h, useEffect as T } from "react";
+import './components/ui/Tooltip/tooltip.css';/* empty css            */
+const $ = ({
+  children: m,
+  label: d,
+  opened: n,
+  defaultOpened: w = !1,
+  position: r = "top",
+  withArrow: x = !0,
+  delay: p = 0,
+  className: b = ""
 }) => {
-  const x = m;
-  return console.log(d), /* @__PURE__ */ i.jsxs(s, { className: "base-col ui-login-section", children: [
-    /* @__PURE__ */ i.jsxs(o, { className: "ui-login-content", children: [
-      /* @__PURE__ */ i.jsx(s.Title, { fs: "1", className: "md-fs-0 ui-login-title", mdFs: "0", children: l }),
-      e && /* @__PURE__ */ i.jsx(s.Description, { className: "ui-login-description", children: e })
-    ] }),
-    /* @__PURE__ */ i.jsxs("div", { className: "bg-white shadow br-x4 ui-login-body", children: [
-      /* @__PURE__ */ i.jsxs(o, { gap: "x16", children: [
-        /* @__PURE__ */ i.jsx("h1", { className: "text-slate-20 fw-semibold fs-5 md-fs-4", children: n }),
-        /* @__PURE__ */ i.jsx(s.Description, { children: r }),
-        /* @__PURE__ */ i.jsx(
-          g,
+  const [g, s] = f(w), l = h(null), i = h(null), [a, v] = f({ top: 0, left: 0 }), u = n !== void 0 ? n : g, j = () => {
+    p > 0 ? l.current = setTimeout(() => s(!0), p) : s(!0);
+  }, R = () => {
+    l.current && clearTimeout(l.current), s(!1);
+  };
+  return T(() => {
+    if (i.current) {
+      const t = i.current.getBoundingClientRect();
+      let e = 0, o = 0;
+      switch (r) {
+        case "top":
+          e = t.top - 8, o = t.left + t.width / 2;
+          break;
+        case "bottom":
+          e = t.height + 8, o = t.width / 2;
+          break;
+        case "left":
+          e = t.top + t.height / 2, o = t.left - 8;
+          break;
+        case "right":
+          e = t.top + t.height / 2, o = t.right + 8;
+          break;
+      }
+      v({ top: e, left: o });
+    }
+  }, [u, r]), /* @__PURE__ */ c.jsxs(
+    "div",
+    {
+      className: "tooltip-wrapper",
+      ref: i,
+      onMouseEnter: j,
+      onMouseLeave: R,
+      children: [
+        m,
+        u && /* @__PURE__ */ c.jsxs(
+          "div",
           {
-            ariaLabel: c,
-            href: a,
-            children: t
+            className: `tooltip-box tooltip-${r} ${b} p-x24`,
+            style: {
+              top: a.top,
+              left: a.left
+            },
+            children: [
+              d,
+              x && /* @__PURE__ */ c.jsx("div", { className: `tooltip-arrow tooltip-arrow-${r}` })
+            ]
           }
         )
-      ] }),
-      /* @__PURE__ */ i.jsx("div", { className: "ui-login-body-img h-full", children: /* @__PURE__ */ i.jsx(
-        x,
-        {
-          src: h,
-          alt: "",
-          "aria-hidden": "true",
-          width: 246,
-          height: 746
-        }
-      ) })
-    ] })
-  ] });
+      ]
+    }
+  );
 };
 export {
-  N as Login
+  $ as Tooltip
 };
 //# sourceMappingURL=index.es140.js.map

package/dist/index.es140.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es140.js","sources":["../src/sections/Login/index.tsx"],"sourcesContent":["import { Section } from \"@/components/ui/Section\";\nimport { Col, EntryButton } from \"@/components\";\nimport \"./Login.scss\";\nimport { Config } from \"@/utils/config.ts\";\n\nexport type LoginProps = {\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  loginTitle: string;\n  loginDescription: React.ReactNode;\n  buttonLabel: string;\n  buttonAriaLabel: string;\n  buttonHref: string;\n  asImage?: \"img\";\n  region?: Config[\"REGION\"];\n  authSrc?: string;\n};\n\nexport const Login = ({\n  title,\n  description,\n  loginTitle,\n  loginDescription,\n  buttonLabel,\n  buttonAriaLabel,\n  buttonHref,\n  asImage = \"img\",\n  region = \"marche\",\n  authSrc = \"\",\n}: LoginProps) => {\n  const ImageComponent = asImage;\n\n  console.log(region);\n\n  return (\n    <Section className=\"base-col ui-login-section\">\n      <Col className=\"ui-login-content\">\n        <Section.Title fs=\"1\" className=\"md-fs-0 ui-login-title\" mdFs=\"0\">\n          {title}\n        </Section.Title>\n        {description && (\n          <Section.Description className=\"ui-login-description\">\n            {description}\n          </Section.Description>\n        )}\n      </Col>\n      <div className=\"bg-white shadow br-x4 ui-login-body\">\n        <Col gap={\"x16\"}>\n          <h1 className=\"text-slate-20 fw-semibold fs-5 md-fs-4\">\n            {loginTitle}\n          </h1>\n          <Section.Description>{loginDescription}</Section.Description>\n          <EntryButton\n            // showIcon={region === \"marche\"}\n            ariaLabel={buttonAriaLabel}\n            href={buttonHref}\n          >\n            {buttonLabel}\n          </EntryButton>\n        </Col>\n\n        <div className=\"ui-login-body-img h-full\">\n          <ImageComponent\n            src={authSrc}\n            alt=\"\"\n            aria-hidden=\"true\"\n            width={246}\n            height={746}\n          />\n        </div>\n      </div>\n    </Section>\n  );\n};\n"],"names":["Login","title","description","loginTitle","loginDescription","buttonLabel","buttonAriaLabel","buttonHref","asImage","region","authSrc","ImageComponent","jsxs","Section","Col","jsx","EntryButton"],"mappings":";;;;;AAkBO,MAAMA,IAAQ,CAAC;AAAA,EACpB,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,QAAAC,IAAS;AAAA,EACT,SAAAC,IAAU;AACZ,MAAkB;AAChB,QAAMC,IAAiBH;AAEvB,iBAAQ,IAAIC,CAAM,GAGhBG,gBAAAA,EAAAA,KAACC,GAAA,EAAQ,WAAU,6BACjB,UAAA;AAAA,IAAAD,gBAAAA,EAAAA,KAACE,GAAA,EAAI,WAAU,oBACb,UAAA;AAAA,MAAAC,gBAAAA,EAAAA,IAACF,EAAQ,OAAR,EAAc,IAAG,KAAI,WAAU,0BAAyB,MAAK,KAC3D,UAAAZ,EAAA,CACH;AAAA,MACCC,KACCa,gBAAAA,EAAAA,IAACF,EAAQ,aAAR,EAAoB,WAAU,wBAC5B,UAAAX,EAAA,CACH;AAAA,IAAA,GAEJ;AAAA,IACAU,gBAAAA,EAAAA,KAAC,OAAA,EAAI,WAAU,uCACb,UAAA;AAAA,MAAAA,gBAAAA,EAAAA,KAACE,GAAA,EAAI,KAAK,OACR,UAAA;AAAA,QAAAC,gBAAAA,EAAAA,IAAC,MAAA,EAAG,WAAU,0CACX,UAAAZ,GACH;AAAA,QACAY,gBAAAA,EAAAA,IAACF,EAAQ,aAAR,EAAqB,UAAAT,EAAA,CAAiB;AAAA,QACvCW,gBAAAA,EAAAA;AAAAA,UAACC;AAAA,UAAA;AAAA,YAEC,WAAWV;AAAA,YACX,MAAMC;AAAA,YAEL,UAAAF;AAAA,UAAA;AAAA,QAAA;AAAA,MACH,GACF;AAAA,MAEAU,gBAAAA,EAAAA,IAAC,OAAA,EAAI,WAAU,4BACb,UAAAA,gBAAAA,EAAAA;AAAAA,QAACJ;AAAA,QAAA;AAAA,UACC,KAAKD;AAAA,UACL,KAAI;AAAA,UACJ,eAAY;AAAA,UACZ,OAAO;AAAA,UACP,QAAQ;AAAA,QAAA;AAAA,MAAA,EACV,CACF;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"index.es140.js","sources":["../src/components/ui/Tooltip/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { ReactNode, useState, useRef, useEffect } from \"react\";\nimport \"./tooltip.scss\";\n\ntype TooltipPosition = \"top\" | \"bottom\" | \"left\" | \"right\";\n\ninterface TooltipProps {\n  children: ReactNode;\n  label: ReactNode;\n  opened?: boolean;\n  defaultOpened?: boolean;\n  position?: TooltipPosition;\n  withArrow?: boolean;\n  delay?: number;\n  className?: string;\n}\n\nexport const Tooltip: React.FC<TooltipProps> = ({\n  children,\n  label,\n  opened,\n  defaultOpened = false,\n  position = \"top\",\n  withArrow = true,\n  delay = 0,\n  className = \"\",\n}) => {\n  const [isOpen, setIsOpen] = useState(defaultOpened);\n  const timeoutRef = useRef<NodeJS.Timeout | null>(null);\n  const wrapperRef = useRef<HTMLDivElement | null>(null);\n  const [coords, setCoords] = useState({ top: 0, left: 0 });\n\n  const isControlled = opened !== undefined;\n  const visible = isControlled ? opened : isOpen;\n\n  const showTooltip = () => {\n    if (delay > 0) {\n      timeoutRef.current = setTimeout(() => setIsOpen(true), delay);\n    } else {\n      setIsOpen(true);\n    }\n  };\n\n  const hideTooltip = () => {\n    if (timeoutRef.current) clearTimeout(timeoutRef.current);\n    setIsOpen(false);\n  };\n\n  useEffect(() => {\n    if (wrapperRef.current) {\n      const rect = wrapperRef.current.getBoundingClientRect();\n      let top = 0;\n      let left = 0;\n      switch (position) {\n        case \"top\":\n          top = rect.top - 8;\n          left = rect.left + rect.width / 2;\n          break;\n        case \"bottom\":\n          top = rect.height + 8;\n          left = rect.width / 2;\n          break;\n        case \"left\":\n          top = rect.top + rect.height / 2;\n          left = rect.left - 8;\n          break;\n        case \"right\":\n          top = rect.top + rect.height / 2;\n          left = rect.right + 8;\n          break;\n      }\n      setCoords({ top, left });\n    }\n  }, [visible, position]);\n\n  return (\n    <div\n      className=\"tooltip-wrapper\"\n      ref={wrapperRef}\n      onMouseEnter={showTooltip}\n      onMouseLeave={hideTooltip}\n    >\n      {children}\n      {visible && (\n        <div\n          className={`tooltip-box tooltip-${position} ${className} p-x24`}\n          style={{\n            top: coords.top,\n            left: coords.left,\n          }}\n        >\n          {label}\n          {withArrow && (\n            <div className={`tooltip-arrow tooltip-arrow-${position}`} />\n          )}\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["Tooltip","children","label","opened","defaultOpened","position","withArrow","delay","className","isOpen","setIsOpen","useState","timeoutRef","useRef","wrapperRef","coords","setCoords","visible","showTooltip","hideTooltip","useEffect","rect","top","left","jsxs","jsx"],"mappings":";;;AAiBO,MAAMA,IAAkC,CAAC;AAAA,EAC9C,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC,IAAQ;AAAA,EACR,WAAAC,IAAY;AACd,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAASP,CAAa,GAC5CQ,IAAaC,EAA8B,IAAI,GAC/CC,IAAaD,EAA8B,IAAI,GAC/C,CAACE,GAAQC,CAAS,IAAIL,EAAS,EAAE,KAAK,GAAG,MAAM,GAAG,GAGlDM,IADed,MAAW,SACDA,IAASM,GAElCS,IAAc,MAAM;AACxB,IAAIX,IAAQ,IACVK,EAAW,UAAU,WAAW,MAAMF,EAAU,EAAI,GAAGH,CAAK,IAE5DG,EAAU,EAAI;AAAA,EAElB,GAEMS,IAAc,MAAM;AACxB,IAAIP,EAAW,WAAS,aAAaA,EAAW,OAAO,GACvDF,EAAU,EAAK;AAAA,EACjB;AAEA,SAAAU,EAAU,MAAM;AACd,QAAIN,EAAW,SAAS;AACtB,YAAMO,IAAOP,EAAW,QAAQ,sBAAA;AAChC,UAAIQ,IAAM,GACNC,IAAO;AACX,cAAQlB,GAAA;AAAA,QACN,KAAK;AACH,UAAAiB,IAAMD,EAAK,MAAM,GACjBE,IAAOF,EAAK,OAAOA,EAAK,QAAQ;AAChC;AAAA,QACF,KAAK;AACH,UAAAC,IAAMD,EAAK,SAAS,GACpBE,IAAOF,EAAK,QAAQ;AACpB;AAAA,QACF,KAAK;AACH,UAAAC,IAAMD,EAAK,MAAMA,EAAK,SAAS,GAC/BE,IAAOF,EAAK,OAAO;AACnB;AAAA,QACF,KAAK;AACH,UAAAC,IAAMD,EAAK,MAAMA,EAAK,SAAS,GAC/BE,IAAOF,EAAK,QAAQ;AACpB;AAAA,MAAA;AAEJ,MAAAL,EAAU,EAAE,KAAAM,GAAK,MAAAC,GAAM;AAAA,IACzB;AAAA,EACF,GAAG,CAACN,GAASZ,CAAQ,CAAC,GAGpBmB,gBAAAA,EAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,KAAKV;AAAA,MACL,cAAcI;AAAA,MACd,cAAcC;AAAA,MAEb,UAAA;AAAA,QAAAlB;AAAA,QACAgB,KACCO,gBAAAA,EAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,uBAAuBnB,CAAQ,IAAIG,CAAS;AAAA,YACvD,OAAO;AAAA,cACL,KAAKO,EAAO;AAAA,cACZ,MAAMA,EAAO;AAAA,YAAA;AAAA,YAGd,UAAA;AAAA,cAAAb;AAAA,cACAI,KACCmB,gBAAAA,EAAAA,IAAC,OAAA,EAAI,WAAW,+BAA+BpB,CAAQ,GAAA,CAAI;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAE/D;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/index.es141.js

@@ -1,109 +1,84 @@
-import { j as s } from "./index.es237.js";
-import { Section as m, SectionHeading as f } from "./index.es123.js";
-import { clsx as g } from "./index.es239.js";
-import { l as t } from "./index.es240.js";
-import { useMemo as j } from "react";
-import { RichText as v } from "./index.es143.js";
-import './sections/HomeServices/HomeServices.css';/* empty css            */
-import { ArrowLink as T } from "./index.es25.js";
-import { CardCategory as w } from "./index.es36.js";
-import { Col as O } from "./index.es61.js";
-const r = {
-  LayoutOne: "LayoutOne",
-  LayoutTwo: "LayoutTwo",
-  LayoutThree: "LayoutThree",
-  LayoutFour: "LayoutFour"
-}, H = ({
-  title: l,
-  description: L,
-  goToLabel: i,
-  href: p,
-  asLink: h = "a",
-  items: a,
-  layout: n = r.LayoutOne,
-  className: x,
-  showBlueBackground: y = !1
+import { j as o } from "./index.es241.js";
+import './components/ui/Avatars/avatars.css';/* empty css            */
+import { Tooltip as h } from "./index.es140.js";
+import { Col as d } from "./index.es61.js";
+const l = [
+  "#007bff",
+  // blue
+  "#28a745",
+  // green
+  "#dc3545",
+  // red
+  "#17a2b8",
+  // teal
+  "#6f42c1",
+  // purple
+  "#fd7e14",
+  // orange
+  "#20c997"
+  // emerald
+];
+function f(e) {
+  let r = 0;
+  for (let t = 0; t < e.length; t++)
+    r = e.charCodeAt(t) + ((r << 5) - r);
+  return l[Math.abs(r) % l.length];
+}
+const C = ({
+  users: e,
+  maxVisible: r = 5,
+  size: t = 32
 }) => {
-  const d = n === r.LayoutOne ? "ui-home-services-layout-one" : n === r.LayoutTwo ? "ui-home-services-layout-two" : n === r.LayoutThree ? "ui-home-services-layout-three" : n === r.LayoutFour ? "ui-home-services-layout-four" : "", u = j(() => {
-    switch (n) {
-      case r.LayoutOne:
-        return a.map((o, e) => {
-          const c = e !== 0;
-          return {
-            ...t.omit(o, c ? ["image"] : [])
-          };
-        });
-      case r.LayoutTwo:
-        return a.map((o) => ({
-          ...t.omit(o, [])
-        }));
-      case r.LayoutThree:
-        return a.map((o, e) => {
-          const c = e !== 0;
-          return {
-            ...t.omit(o, c ? ["image"] : [])
-          };
-        });
-      case r.LayoutFour:
-        return a.map((o, e) => {
-          const c = e !== 2;
-          return {
-            ...t.omit(o, c ? ["image"] : [])
-          };
-        });
-      default:
-        return a;
-    }
-  }, [a, n]);
-  return /* @__PURE__ */ s.jsxs(
-    m,
+  const i = e.slice(0, r), s = e.length - i.length;
+  return /* @__PURE__ */ o.jsx(
+    h,
     {
-      className: g(
-        "base-col ui-home-services-section",
-        x,
-        y ? "blue-background" : ""
-      ),
-      children: [
-        /* @__PURE__ */ s.jsx(O, { className: "ui-home-services-section-content", children: /* @__PURE__ */ s.jsx(
-          f,
-          {
-            title: l,
-            description: /* @__PURE__ */ s.jsx(v, { description: L }),
-            className: "ui-home-services-section-title",
-            color: "slate-20",
-            mdFs: "1",
-            titleMarginBottom: "mb-x0",
-            descriptionMarginBottom: "mb-x0",
-            children: i && p && /* @__PURE__ */ s.jsx(T, { href: p, asLink: h, fs: "7", children: i.toUpperCase() })
-          }
-        ) }),
-        /* @__PURE__ */ s.jsx(
-          "ul",
-          {
-            role: "list",
-            "aria-label": `Lista di ${l}`,
-            className: `list-style-none ${d}`,
-            children: u == null ? void 0 : u.map((o, e) => /* @__PURE__ */ s.jsx("li", { children: /* @__PURE__ */ s.jsx(
-              w,
-              {
-                title: o == null ? void 0 : o.name,
-                description: o == null ? void 0 : o.description,
-                image: o == null ? void 0 : o.image,
-                href: (o == null ? void 0 : o.link) || (o == null ? void 0 : o.externalLink),
-                showIcon: o == null ? void 0 : o.externalLink,
-                asLink: h,
-                isExternal: o == null ? void 0 : o.externalLink
+      position: "bottom",
+      label: /* @__PURE__ */ o.jsx(d, { gap: "x24", children: i.map((a) => /* @__PURE__ */ o.jsxs("p", { className: "text-primary", children: [
+        a.firstName,
+        " ",
+        a.lastName
+      ] }, a.fiscalCode)) }),
+      children: /* @__PURE__ */ o.jsxs("div", { className: "avatars-group", children: [
+        i.map((a, n) => {
+          const c = f(a.firstName), m = a.firstName.charAt(0).toUpperCase();
+          return /* @__PURE__ */ o.jsx(
+            "div",
+            {
+              className: "avatar",
+              style: {
+                width: t,
+                height: t,
+                marginLeft: n === 0 ? 0 : -t / 4,
+                backgroundColor: c,
+                fontSize: t * 0.45
               },
-              [o._id, e].join("-")
-            ) }, [o._id, e].join("-")))
+              children: m
+            },
+            a.fiscalCode
+          );
+        }),
+        s > 0 && /* @__PURE__ */ o.jsxs(
+          "div",
+          {
+            className: "avatar avatar-extra",
+            style: {
+              width: t,
+              height: t,
+              marginLeft: -t / 4,
+              fontSize: t * 0.45
+            },
+            children: [
+              "+",
+              s
+            ]
           }
         )
-      ]
+      ] })
     }
   );
 };
 export {
-  r as HOME_SERVICES_LAYOUTS,
-  H as HomeServices
+  C as Avatars
 };
 //# sourceMappingURL=index.es141.js.map

package/dist/index.es141.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es141.js","sources":["../src/sections/HomeServices/index.tsx"],"sourcesContent":["import { ArrowLink, CardCategory, Col } from \"@/components\";\nimport { Section, SectionHeading } from \"@/components/ui/Section\";\nimport clsx from \"clsx\";\nimport { omit } from \"lodash\";\nimport { ComponentType, ReactNode, useMemo } from \"react\";\nimport { RichText } from \"../RichText\";\nimport \"./HomeServices.scss\";\n\nexport const HOME_SERVICES_LAYOUTS = {\n  LayoutOne: \"LayoutOne\",\n  LayoutTwo: \"LayoutTwo\",\n  LayoutThree: \"LayoutThree\",\n  LayoutFour: \"LayoutFour\",\n} as const;\n\ntype Layout =\n  (typeof HOME_SERVICES_LAYOUTS)[keyof typeof HOME_SERVICES_LAYOUTS];\n\nexport type AggregationItemsProps = {\n  title: ReactNode;\n  description?: ReactNode;\n  goToLabel?: string;\n  href?: string;\n  asLink?: \"a\" | ComponentType<any>;\n  items: any[];\n  layout?: Layout;\n  className?: string;\n  showBlueBackground?: boolean;\n};\n\nexport const HomeServices = ({\n  title,\n  description,\n  goToLabel,\n  href,\n  asLink = \"a\",\n  items,\n  layout = HOME_SERVICES_LAYOUTS.LayoutOne,\n  className,\n  showBlueBackground = false,\n}: AggregationItemsProps) => {\n  const layoutClassName =\n    layout === HOME_SERVICES_LAYOUTS.LayoutOne\n      ? \"ui-home-services-layout-one\"\n      : layout === HOME_SERVICES_LAYOUTS.LayoutTwo\n        ? \"ui-home-services-layout-two\"\n        : layout === HOME_SERVICES_LAYOUTS.LayoutThree\n          ? \"ui-home-services-layout-three\"\n          : layout === HOME_SERVICES_LAYOUTS.LayoutFour\n            ? \"ui-home-services-layout-four\"\n            : \"\";\n\n  const itemsNormalized = useMemo(() => {\n    switch (layout) {\n      case HOME_SERVICES_LAYOUTS.LayoutOne:\n        return items.map((item, index) => {\n          const removeImage = index !== 0;\n          return {\n            ...omit(item, removeImage ? [\"image\"] : []),\n          };\n        });\n      case HOME_SERVICES_LAYOUTS.LayoutTwo:\n        return items.map((item) => {\n          const removeImage = false;\n          return {\n            ...omit(item, removeImage ? [\"image\"] : []),\n          };\n        });\n      case HOME_SERVICES_LAYOUTS.LayoutThree:\n        return items.map((item, index) => {\n          const removeImage = index !== 0;\n          return {\n            ...omit(item, removeImage ? [\"image\"] : []),\n          };\n        });\n      case HOME_SERVICES_LAYOUTS.LayoutFour:\n        return items.map((item, index) => {\n          const removeImage = index !== 2;\n          return {\n            ...omit(item, removeImage ? [\"image\"] : []),\n          };\n        });\n      default:\n        return items;\n    }\n  }, [items, layout]);\n\n  return (\n    <Section\n      className={clsx(\n        \"base-col ui-home-services-section\",\n        className,\n        showBlueBackground ? \"blue-background\" : \"\",\n      )}\n    >\n      <Col className=\"ui-home-services-section-content\">\n        <SectionHeading\n          title={title}\n          description={<RichText description={description}></RichText>}\n          className=\"ui-home-services-section-title\"\n          color=\"slate-20\"\n          mdFs=\"1\"\n          titleMarginBottom=\"mb-x0\"\n          descriptionMarginBottom=\"mb-x0\"\n        >\n          {goToLabel && href && (\n            <ArrowLink href={href} asLink={asLink} fs=\"7\">\n              {goToLabel.toUpperCase()}\n            </ArrowLink>\n          )}\n        </SectionHeading>\n      </Col>\n      <ul\n        role=\"list\"\n        aria-label={`Lista di ${title}`}\n        className={`list-style-none ${layoutClassName}`}\n      >\n        {itemsNormalized?.map((item, index) => {\n          return (\n            <li key={[item._id, index].join(\"-\")}>\n              <CardCategory\n                key={[item._id, index].join(\"-\")}\n                title={item?.name}\n                description={item?.description}\n                image={item?.image}\n                href={item?.link || item?.externalLink}\n                showIcon={item?.externalLink}\n                asLink={asLink}\n                isExternal={item?.externalLink}\n              />\n            </li>\n          );\n        })}\n      </ul>\n    </Section>\n  );\n};\n"],"names":["HOME_SERVICES_LAYOUTS","HomeServices","title","description","goToLabel","href","asLink","items","layout","className","showBlueBackground","layoutClassName","itemsNormalized","useMemo","item","index","removeImage","omit","jsxs","Section","clsx","jsx","Col","SectionHeading","RichText","ArrowLink","CardCategory"],"mappings":"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"}
+{"version":3,"file":"index.es141.js","sources":["../src/components/ui/Avatars/index.tsx"],"sourcesContent":["\"use client\";\nimport React from \"react\";\nimport \"./avatars.scss\"; // importa lo stile\nimport { Tooltip } from \"../Tooltip\";\nimport { Col, RelatedPeople } from \"@/components\";\n\ntype AvatarsProps = {\n  users: RelatedPeople[];\n  maxVisible?: number;\n  size?: number;\n};\n\nconst COLORS = [\n  \"#007bff\", // blue\n  \"#28a745\", // green\n  \"#dc3545\", // red\n  \"#17a2b8\", // teal\n  \"#6f42c1\", // purple\n  \"#fd7e14\", // orange\n  \"#20c997\", // emerald\n];\n\nfunction getColorFromName(name: string) {\n  let hash = 0;\n  for (let i = 0; i < name.length; i++) {\n    hash = name.charCodeAt(i) + ((hash << 5) - hash);\n  }\n  return COLORS[Math.abs(hash) % COLORS.length];\n}\n\nexport const Avatars: React.FC<AvatarsProps> = ({\n  users,\n  maxVisible = 5,\n  size = 32,\n}) => {\n  const visibleUsers = users.slice(0, maxVisible);\n  const hiddenCount = users.length - visibleUsers.length;\n\n  return (\n    <Tooltip\n      position=\"bottom\"\n      label={\n        <Col gap=\"x24\">\n          {visibleUsers.map((user) => (\n            <p key={user.fiscalCode} className=\"text-primary\">\n              {user.firstName} {user.lastName}\n            </p>\n          ))}\n        </Col>\n      }\n    >\n      <div className=\"avatars-group\">\n        {visibleUsers.map((user, index) => {\n          const bg = getColorFromName(user.firstName);\n          const initial = user.firstName.charAt(0).toUpperCase();\n\n          return (\n            <div\n              key={user.fiscalCode}\n              className=\"avatar\"\n              style={{\n                width: size,\n                height: size,\n                marginLeft: index === 0 ? 0 : -size / 4,\n                backgroundColor: bg,\n                fontSize: size * 0.45,\n              }}\n            >\n              {initial}\n            </div>\n          );\n        })}\n\n        {hiddenCount > 0 && (\n          <div\n            className=\"avatar avatar-extra\"\n            style={{\n              width: size,\n              height: size,\n              marginLeft: -size / 4,\n              fontSize: size * 0.45,\n            }}\n          >\n            +{hiddenCount}\n          </div>\n        )}\n      </div>\n    </Tooltip>\n  );\n};\n"],"names":["COLORS","getColorFromName","name","hash","i","Avatars","users","maxVisible","size","visibleUsers","hiddenCount","jsx","Tooltip","Col","user","jsxs","index","bg","initial"],"mappings":";;;;AAYA,MAAMA,IAAS;AAAA,EACb;AAAA;AAAA,EACA;AAAA;AAAA,EACA;AAAA;AAAA,EACA;AAAA;AAAA,EACA;AAAA;AAAA,EACA;AAAA;AAAA,EACA;AAAA;AACF;AAEA,SAASC,EAAiBC,GAAc;AACtC,MAAIC,IAAO;AACX,WAASC,IAAI,GAAGA,IAAIF,EAAK,QAAQE;AAC/B,IAAAD,IAAOD,EAAK,WAAWE,CAAC,MAAMD,KAAQ,KAAKA;AAE7C,SAAOH,EAAO,KAAK,IAAIG,CAAI,IAAIH,EAAO,MAAM;AAC9C;AAEO,MAAMK,IAAkC,CAAC;AAAA,EAC9C,OAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,MAAAC,IAAO;AACT,MAAM;AACJ,QAAMC,IAAeH,EAAM,MAAM,GAAGC,CAAU,GACxCG,IAAcJ,EAAM,SAASG,EAAa;AAEhD,SACEE,gBAAAA,EAAAA;AAAAA,IAACC;AAAA,IAAA;AAAA,MACC,UAAS;AAAA,MACT,OACED,gBAAAA,EAAAA,IAACE,GAAA,EAAI,KAAI,OACN,UAAAJ,EAAa,IAAI,CAACK,MACjBC,gBAAAA,EAAAA,KAAC,KAAA,EAAwB,WAAU,gBAChC,UAAA;AAAA,QAAAD,EAAK;AAAA,QAAU;AAAA,QAAEA,EAAK;AAAA,MAAA,EAAA,GADjBA,EAAK,UAEb,CACD,GACH;AAAA,MAGF,UAAAC,gBAAAA,EAAAA,KAAC,OAAA,EAAI,WAAU,iBACZ,UAAA;AAAA,QAAAN,EAAa,IAAI,CAACK,GAAME,MAAU;AACjC,gBAAMC,IAAKhB,EAAiBa,EAAK,SAAS,GACpCI,IAAUJ,EAAK,UAAU,OAAO,CAAC,EAAE,YAAA;AAEzC,iBACEH,gBAAAA,EAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cAEC,WAAU;AAAA,cACV,OAAO;AAAA,gBACL,OAAOH;AAAA,gBACP,QAAQA;AAAA,gBACR,YAAYQ,MAAU,IAAI,IAAI,CAACR,IAAO;AAAA,gBACtC,iBAAiBS;AAAA,gBACjB,UAAUT,IAAO;AAAA,cAAA;AAAA,cAGlB,UAAAU;AAAA,YAAA;AAAA,YAVIJ,EAAK;AAAA,UAAA;AAAA,QAahB,CAAC;AAAA,QAEAJ,IAAc,KACbK,gBAAAA,EAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAO;AAAA,cACL,OAAOP;AAAA,cACP,QAAQA;AAAA,cACR,YAAY,CAACA,IAAO;AAAA,cACpB,UAAUA,IAAO;AAAA,YAAA;AAAA,YAEpB,UAAA;AAAA,cAAA;AAAA,cACGE;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ,EAAA,CAEJ;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/index.es142.js

@@ -1,60 +1,41 @@
-import { j as o } from "./index.es237.js";
-import { clsx as m } from "./index.es239.js";
-import { RichText as c } from "./index.es143.js";
-import './sections/WhatDoYouNeed/WhatDoYouNeed.css';/* empty css            */
-import { Section as p, SectionHeading as u } from "./index.es123.js";
-import { Col as h } from "./index.es61.js";
-import { Button as x } from "./index.es32.js";
-const B = ({
-  title: r,
-  description: t,
-  links: e,
-  asLink: s = "a",
-  showBlueBackground: n = !1
-}) => /* @__PURE__ */ o.jsxs(
-  p,
-  {
-    className: `base-col ui-what-do-you-need-section ${n ? "blue-background" : ""}`,
-    children: [
-      /* @__PURE__ */ o.jsx(h, { className: "ui-what-do-you-need-content", children: /* @__PURE__ */ o.jsx(
-        u,
-        {
-          title: r,
-          fs: "2",
-          mdFs: "1",
-          color: "slate-20",
-          titleMarginBottom: "0",
-          descriptionMarginBottom: "0",
-          description: t ? /* @__PURE__ */ o.jsx(c, { description: t }) : void 0
-        }
-      ) }),
-      /* @__PURE__ */ o.jsx(
-        "ul",
-        {
-          role: "list",
-          "aria-label": `Lista di ${r}`,
-          className: m(
-            "list-style-none ui-what-do-you-need-links",
-            e.length < 4 ? "row" : "grid"
-          ),
-          children: e == null ? void 0 : e.map(({ link: i, title: d, isNewTab: a }, l) => /* @__PURE__ */ o.jsx("li", { children: /* @__PURE__ */ o.jsx(
-            x,
+import { j as e } from "./index.es241.js";
+import { Avatars as i } from "./index.es141.js";
+import './components/ui/DelegationHomeBanner/DelegationHomeBanner.css';/* empty css            */
+import { Col as n } from "./index.es61.js";
+import { Row as a } from "./index.es116.js";
+import { ArrowLink as m } from "./index.es25.js";
+function f({
+  users: r,
+  title: o = "",
+  linkLabel: t = "",
+  onChangeProfileClick: s
+}) {
+  return /* @__PURE__ */ e.jsxs(
+    n,
+    {
+      br: "x4",
+      gap: "x16",
+      className: "delegation-home-banner bg-lightblue-a03 shadow",
+      children: [
+        /* @__PURE__ */ e.jsx("h3", { className: "ui-banner-title text-slate-20 fs-4 fw-semibold", children: o }),
+        /* @__PURE__ */ e.jsxs(a, { justifyContent: "space-between", children: [
+          /* @__PURE__ */ e.jsx(i, { users: r, maxVisible: 4 }),
+          /* @__PURE__ */ e.jsx(
+            m,
             {
-              asLink: s,
-              href: i,
-              size: "2",
-              variant: l > 0 ? "secondary" : "primary",
-              target: a ? "_blank" : void 0,
-              rel: a ? "noopener noreferrer" : void 0,
-              children: d
+              arrowVisible: !0,
+              asButton: !0,
+              onClick: s,
+              className: "cursor-pointer",
+              children: t
             }
-          ) }, i))
-        }
-      )
-    ]
-  }
-);
+          )
+        ] })
+      ]
+    }
+  );
+}
 export {
-  B as WhatDoYouNeed
+  f as DelegationHomeBanner
 };
 //# sourceMappingURL=index.es142.js.map

package/dist/index.es142.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es142.js","sources":["../src/sections/WhatDoYouNeed/index.tsx"],"sourcesContent":["import { Button, Col, Section, SectionHeading } from \"@/components\";\nimport { SectionLink } from \"@anoki/fse-common\";\nimport clsx from \"clsx\";\nimport { ComponentType, PropsWithChildren, ReactNode } from \"react\";\nimport { RichText } from \"../RichText\";\nimport \"./WhatDoYouNeed.scss\";\n\ntype WhatDoYouNeedProps = PropsWithChildren<{\n  title: ReactNode;\n  description?: ReactNode;\n  links: EnhancedSectionLink[];\n  asLink?: \"a\" | ComponentType<any>;\n  showBlueBackground?: boolean;\n}>;\n\ntype EnhancedSectionLink = SectionLink & {\n  isNewTab?: boolean;\n};\n\nexport const WhatDoYouNeed = ({\n  title,\n  description,\n  links,\n  asLink = \"a\",\n  showBlueBackground = false,\n}: WhatDoYouNeedProps) => {\n  return (\n    <Section\n      className={`base-col ui-what-do-you-need-section ${showBlueBackground ? \"blue-background\" : \"\"}`}\n    >\n      <Col className=\"ui-what-do-you-need-content\">\n        <SectionHeading\n          title={title}\n          fs=\"2\"\n          mdFs=\"1\"\n          color=\"slate-20\"\n          titleMarginBottom=\"0\"\n          descriptionMarginBottom=\"0\"\n          description={description ? <RichText description={description}></RichText> : undefined}\n        />\n      </Col>\n      <ul\n        role=\"list\"\n        aria-label={`Lista di ${title}`}\n        className={clsx(\n          \"list-style-none ui-what-do-you-need-links\",\n          links.length < 4 ? \"row\" : \"grid\",\n        )}\n      >\n        {links?.map(({ link, title, isNewTab }, index) => (\n          <li key={link}>\n            <Button\n              asLink={asLink}\n              href={link}\n              size=\"2\"\n              variant={index > 0 ? \"secondary\" : \"primary\"}\n              // textColor={index > 0 ? \"primary\" : undefined}\n              // bg={index > 0 ? \"white\" : undefined}\n              // className={index > 0 ? \"br-color-primary\" : undefined}\n              target={isNewTab ? \"_blank\" : undefined}\n              rel={isNewTab ? \"noopener noreferrer\" : undefined}\n            >\n              {title}\n            </Button>\n          </li>\n        ))}\n      </ul>\n    </Section>\n  );\n};\n"],"names":["WhatDoYouNeed","title","description","links","asLink","showBlueBackground","jsxs","Section","jsx","Col","SectionHeading","RichText","clsx","link","isNewTab","index","Button"],"mappings":";;;;;;;AAmBO,MAAMA,IAAgB,CAAC;AAAA,EAC5B,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,oBAAAC,IAAqB;AACvB,MAEIC,gBAAAA,EAAAA;AAAAA,EAACC;AAAA,EAAA;AAAA,IACC,WAAW,wCAAwCF,IAAqB,oBAAoB,EAAE;AAAA,IAE9F,UAAA;AAAA,MAAAG,gBAAAA,EAAAA,IAACC,GAAA,EAAI,WAAU,+BACb,UAAAD,gBAAAA,EAAAA;AAAAA,QAACE;AAAA,QAAA;AAAA,UACC,OAAAT;AAAA,UACA,IAAG;AAAA,UACH,MAAK;AAAA,UACL,OAAM;AAAA,UACN,mBAAkB;AAAA,UAClB,yBAAwB;AAAA,UACxB,aAAaC,IAAcM,gBAAAA,EAAAA,IAACG,GAAA,EAAS,aAAAT,GAA0B,IAAc;AAAA,QAAA;AAAA,MAAA,GAEjF;AAAA,MACAM,gBAAAA,EAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,cAAY,YAAYP,CAAK;AAAA,UAC7B,WAAWW;AAAA,YACT;AAAA,YACAT,EAAM,SAAS,IAAI,QAAQ;AAAA,UAAA;AAAA,UAG5B,UAAAA,KAAA,gBAAAA,EAAO,IAAI,CAAC,EAAE,MAAAU,GAAM,OAAAZ,GAAO,UAAAa,EAAA,GAAYC,MACtCP,gBAAAA,EAAAA,IAAC,MAAA,EACC,UAAAA,gBAAAA,EAAAA;AAAAA,YAACQ;AAAA,YAAA;AAAA,cACC,QAAAZ;AAAA,cACA,MAAMS;AAAA,cACN,MAAK;AAAA,cACL,SAASE,IAAQ,IAAI,cAAc;AAAA,cAInC,QAAQD,IAAW,WAAW;AAAA,cAC9B,KAAKA,IAAW,wBAAwB;AAAA,cAEvC,UAAAb;AAAAA,YAAA;AAAA,UAAA,EACH,GAbOY,CAcT;AAAA,QACD;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAAA;"}
+{"version":3,"file":"index.es142.js","sources":["../src/components/ui/DelegationHomeBanner/index.tsx"],"sourcesContent":["\"use client\";\nimport { ArrowLink, Col, Row } from \"@/components\";\nimport { Avatars } from \"../Avatars\";\nimport \"./DelegationHomeBanner.scss\";\ntype HomeBannerProps = {\n  users: Array<any>;\n  title?: string;\n  linkLabel?: string;\n  onChangeProfileClick?: () => void;\n};\nexport function DelegationHomeBanner({\n  users,\n  title = \"\",\n  linkLabel = \"\",\n  onChangeProfileClick,\n}: HomeBannerProps) {\n  return (\n    <Col\n      br={\"x4\"}\n      gap={\"x16\"}\n      className={\"delegation-home-banner bg-lightblue-a03 shadow\"}\n    >\n      <h3 className=\"ui-banner-title text-slate-20 fs-4 fw-semibold\">\n        {title}\n      </h3>\n      <Row justifyContent=\"space-between\">\n        <Avatars users={users} maxVisible={4} />\n        <ArrowLink\n          arrowVisible={true}\n          asButton\n          onClick={onChangeProfileClick}\n          className=\"cursor-pointer\"\n        >\n          {linkLabel}\n        </ArrowLink>\n      </Row>\n    </Col>\n  );\n}\n"],"names":["DelegationHomeBanner","users","title","linkLabel","onChangeProfileClick","jsxs","Col","jsx","Row","Avatars","ArrowLink"],"mappings":";;;;;;AAUO,SAASA,EAAqB;AAAA,EACnC,OAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,WAAAC,IAAY;AAAA,EACZ,sBAAAC;AACF,GAAoB;AAClB,SACEC,gBAAAA,EAAAA;AAAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,MACJ,KAAK;AAAA,MACL,WAAW;AAAA,MAEX,UAAA;AAAA,QAAAC,gBAAAA,EAAAA,IAAC,MAAA,EAAG,WAAU,kDACX,UAAAL,GACH;AAAA,QACAG,gBAAAA,EAAAA,KAACG,GAAA,EAAI,gBAAe,iBAClB,UAAA;AAAA,UAAAD,gBAAAA,EAAAA,IAACE,GAAA,EAAQ,OAAAR,GAAc,YAAY,EAAA,CAAG;AAAA,UACtCM,gBAAAA,EAAAA;AAAAA,YAACG;AAAA,YAAA;AAAA,cACC,cAAc;AAAA,cACd,UAAQ;AAAA,cACR,SAASN;AAAA,cACT,WAAU;AAAA,cAET,UAAAD;AAAA,YAAA;AAAA,UAAA;AAAA,QACH,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}