@anoki/fse-ui 1.0.448 → 1.0.450

package/dist/index.es107.js

@@ -1,28 +1,28 @@
-import { j as r } from "./index.es171.js";
-import { clsx as a } from "./index.es173.js";
-import { createColorClasses as l } from "./index.es182.js";
+import { j as r } from "./index.es172.js";
+import { clsx as l } from "./index.es174.js";
+import { createColorClasses as a } from "./index.es181.js";
 const x = ({
-  width: s = 24,
-  height: o = 24,
-  className: t,
-  color: e
+  width: C = 32,
+  height: s = 32,
+  className: o,
+  color: t
 }) => {
-  const m = l({ color: e });
+  const e = a({ color: t });
   return /* @__PURE__ */ r.jsx(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
-      width: s,
-      height: o,
+      width: C,
+      height: s,
       fill: "currentColor",
-      viewBox: "0 0 40 40",
-      className: a(t, m),
+      viewBox: "0 0 32 32",
+      className: l(o, e),
       "aria-hidden": "true",
-      children: /* @__PURE__ */ r.jsx("path", { d: "M36.667 8.333V10H3.334V8.333zm-33.333 12.5h33.333v-1.667H3.334zm33.333 10.833H3.334V30h33.333z" })
+      children: /* @__PURE__ */ r.jsx("path", { d: "M25.3333 5.33331H18C17.6318 5.33331 17.3333 5.63179 17.3333 5.99998C17.3333 6.36817 17.6318 6.66665 18 6.66665H24.2662L12.9898 17.943C12.7945 18.1383 12.7945 18.4549 12.9898 18.6502L13.2255 18.8859C13.4208 19.0811 13.7373 19.0811 13.9326 18.8859L25.3333 7.48512V14C25.3333 14.3682 25.6318 14.6666 26 14.6666C26.3682 14.6666 26.6667 14.3682 26.6667 14V6.66665C26.6667 5.93027 26.0697 5.33331 25.3333 5.33331ZM22.68 16.6666C22.68 16.2985 22.9785 16 23.3467 16C23.7045 16.0071 23.9929 16.2955 24 16.6533V24C24 26.2091 22.2091 28 20 28H8C5.79086 28 4 26.2091 4 24V12C4 9.79084 5.79086 7.99998 8 7.99998H14.6667C15.0319 8.00707 15.3262 8.30143 15.3333 8.66665C15.3333 9.03484 15.0349 9.33331 14.6667 9.33331H8C6.52724 9.33331 5.33333 10.5272 5.33333 12V24C5.33333 25.4727 6.52724 26.6666 8 26.6666H20.0133C21.4861 26.6666 22.68 25.4727 22.68 24V16.6666Z" })
     }
   );
 };
 export {
-  x as Hamburguer
+  x as ExternalLink
 };
 //# sourceMappingURL=index.es107.js.map

package/dist/index.es107.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es107.js","sources":["../src/icons/Hamburguer/index.tsx"],"sourcesContent":["import clsx from \"clsx\";\r\nimport { IconProps } from \"../../types/icons\";\r\nimport { createColorClasses } from \"@/theme/colors\";\r\n\r\nexport const Hamburguer = ({\r\n  width = 24,\r\n  height = 24,\r\n  className,\r\n  color,\r\n}: IconProps) => {\r\n  const classes = createColorClasses({ color });\r\n\r\n  return (\r\n    <svg\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      width={width}\r\n      height={height}\r\n      fill=\"currentColor\"\r\n      viewBox=\"0 0 40 40\"\r\n      className={clsx(className, classes)}\r\n      aria-hidden=\"true\" // this is a decorative icon, so we should hide it from screen readers\r\n    >\r\n      <path d=\"M36.667 8.333V10H3.334V8.333zm-33.333 12.5h33.333v-1.667H3.334zm33.333 10.833H3.334V30h33.333z\"></path>\r\n    </svg>\r\n  );\r\n};\r\n"],"names":["Hamburguer","width","height","className","color","classes","createColorClasses","jsx","clsx"],"mappings":";;;AAIO,MAAMA,IAAa,CAAC;AAAA,EACzB,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,OAAAC;AACF,MAAiB;AACf,QAAMC,IAAUC,EAAmB,EAAE,OAAAF,GAAO;AAG1C,SAAAG,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,OAAAN;AAAA,MACA,QAAAC;AAAA,MACA,MAAK;AAAA,MACL,SAAQ;AAAA,MACR,WAAWM,EAAKL,GAAWE,CAAO;AAAA,MAClC,eAAY;AAAA,MAEZ,UAAAE,gBAAAA,EAAAA,IAAC,QAAK,EAAA,GAAE,iGAAiG,CAAA;AAAA,IAAA;AAAA,EAC3G;AAEJ;"}
+{"version":3,"file":"index.es107.js","sources":["../src/icons/ExternalLink/index.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { IconProps } from \"../../types/icons\";\nimport { createColorClasses } from \"@/theme/colors\";\n\nexport const ExternalLink = ({\n  width = 32,\n  height = 32,\n  className,\n  color,\n}: IconProps) => {\n  const classes = createColorClasses({ color });\n\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={width}\n      height={height}\n      fill=\"currentColor\"\n      viewBox=\"0 0 32 32\"\n      className={clsx(className, classes)}\n      aria-hidden=\"true\" // this is a decorative icon, so we should hide it from screen readers\n    >\n      <path d=\"M25.3333 5.33331H18C17.6318 5.33331 17.3333 5.63179 17.3333 5.99998C17.3333 6.36817 17.6318 6.66665 18 6.66665H24.2662L12.9898 17.943C12.7945 18.1383 12.7945 18.4549 12.9898 18.6502L13.2255 18.8859C13.4208 19.0811 13.7373 19.0811 13.9326 18.8859L25.3333 7.48512V14C25.3333 14.3682 25.6318 14.6666 26 14.6666C26.3682 14.6666 26.6667 14.3682 26.6667 14V6.66665C26.6667 5.93027 26.0697 5.33331 25.3333 5.33331ZM22.68 16.6666C22.68 16.2985 22.9785 16 23.3467 16C23.7045 16.0071 23.9929 16.2955 24 16.6533V24C24 26.2091 22.2091 28 20 28H8C5.79086 28 4 26.2091 4 24V12C4 9.79084 5.79086 7.99998 8 7.99998H14.6667C15.0319 8.00707 15.3262 8.30143 15.3333 8.66665C15.3333 9.03484 15.0349 9.33331 14.6667 9.33331H8C6.52724 9.33331 5.33333 10.5272 5.33333 12V24C5.33333 25.4727 6.52724 26.6666 8 26.6666H20.0133C21.4861 26.6666 22.68 25.4727 22.68 24V16.6666Z\" />\n    </svg>\n  );\n};\n"],"names":["ExternalLink","width","height","className","color","classes","createColorClasses","jsx","clsx"],"mappings":";;;AAIO,MAAMA,IAAe,CAAC;AAAA,EAC3B,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,OAAAC;AACF,MAAiB;AACf,QAAMC,IAAUC,EAAmB,EAAE,OAAAF,GAAO;AAG1C,SAAAG,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,OAAAN;AAAA,MACA,QAAAC;AAAA,MACA,MAAK;AAAA,MACL,SAAQ;AAAA,MACR,WAAWM,EAAKL,GAAWE,CAAO;AAAA,MAClC,eAAY;AAAA,MAEZ,UAAAE,gBAAAA,EAAAA,IAAC,QAAK,EAAA,GAAE,m1BAAm1B,CAAA;AAAA,IAAA;AAAA,EAC71B;AAEJ;"}

package/dist/index.es108.js

@@ -1,30 +1,28 @@
-import { j as s } from "./index.es171.js";
-import { clsx as a } from "./index.es173.js";
-import { createColorClasses as i } from "./index.es182.js";
-const p = ({
-  width: r = 24,
+import { j as r } from "./index.es172.js";
+import { clsx as a } from "./index.es174.js";
+import { createColorClasses as l } from "./index.es181.js";
+const x = ({
+  width: s = 24,
   height: o = 24,
   className: t,
-  color: e,
-  onClick: l
+  color: e
 }) => {
-  const m = i({ color: e });
-  return /* @__PURE__ */ s.jsx(
+  const m = l({ color: e });
+  return /* @__PURE__ */ r.jsx(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
-      width: r,
+      width: s,
       height: o,
       fill: "currentColor",
-      viewBox: "0 0 24 24",
+      viewBox: "0 0 40 40",
       className: a(t, m),
       "aria-hidden": "true",
-      onClick: l,
-      children: /* @__PURE__ */ s.jsx("path", { d: "m12.7 12 6.7 6.6-.8.8-6.6-6.7-6.6 6.7-.8-.8 6.7-6.6-6.7-6.6.8-.8 6.6 6.7 6.6-6.7.8.8z" })
+      children: /* @__PURE__ */ r.jsx("path", { d: "M36.667 8.333V10H3.334V8.333zm-33.333 12.5h33.333v-1.667H3.334zm33.333 10.833H3.334V30h33.333z" })
     }
   );
 };
 export {
-  p as Close
+  x as Hamburguer
 };
 //# sourceMappingURL=index.es108.js.map

package/dist/index.es108.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es108.js","sources":["../src/icons/Close/index.tsx"],"sourcesContent":["import clsx from \"clsx\";\r\nimport { IconProps } from \"@/types/icons.ts\";\r\nimport { createColorClasses } from \"@/theme/colors\";\r\n\r\nexport const Close = ({\r\n  width = 24,\r\n  height = 24,\r\n  className,\r\n  color,\r\n  onClick,\r\n}: IconProps) => {\r\n  const classes = createColorClasses({ color });\r\n\r\n  return (\r\n    <svg\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      width={width}\r\n      height={height}\r\n      fill=\"currentColor\"\r\n      viewBox=\"0 0 24 24\"\r\n      className={clsx(className, classes)}\r\n      aria-hidden=\"true\" // this is a decorative icon, so we should hide it from screen readers\r\n      onClick={onClick}\r\n    >\r\n      <path d=\"m12.7 12 6.7 6.6-.8.8-6.6-6.7-6.6 6.7-.8-.8 6.7-6.6-6.7-6.6.8-.8 6.6 6.7 6.6-6.7.8.8z\"></path>\r\n    </svg>\r\n  );\r\n};\r\n"],"names":["Close","width","height","className","color","onClick","classes","createColorClasses","jsx","clsx"],"mappings":";;;AAIO,MAAMA,IAAQ,CAAC;AAAA,EACpB,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AACF,MAAiB;AACf,QAAMC,IAAUC,EAAmB,EAAE,OAAAH,GAAO;AAG1C,SAAAI,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,OAAAP;AAAA,MACA,QAAAC;AAAA,MACA,MAAK;AAAA,MACL,SAAQ;AAAA,MACR,WAAWO,EAAKN,GAAWG,CAAO;AAAA,MAClC,eAAY;AAAA,MACZ,SAAAD;AAAA,MAEA,UAAAG,gBAAAA,EAAAA,IAAC,QAAK,EAAA,GAAE,wFAAwF,CAAA;AAAA,IAAA;AAAA,EAClG;AAEJ;"}
+{"version":3,"file":"index.es108.js","sources":["../src/icons/Hamburguer/index.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { IconProps } from \"../../types/icons\";\nimport { createColorClasses } from \"@/theme/colors\";\n\nexport const Hamburguer = ({\n  width = 24,\n  height = 24,\n  className,\n  color,\n}: IconProps) => {\n  const classes = createColorClasses({ color });\n\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={width}\n      height={height}\n      fill=\"currentColor\"\n      viewBox=\"0 0 40 40\"\n      className={clsx(className, classes)}\n      aria-hidden=\"true\" // this is a decorative icon, so we should hide it from screen readers\n    >\n      <path d=\"M36.667 8.333V10H3.334V8.333zm-33.333 12.5h33.333v-1.667H3.334zm33.333 10.833H3.334V30h33.333z\"></path>\n    </svg>\n  );\n};\n"],"names":["Hamburguer","width","height","className","color","classes","createColorClasses","jsx","clsx"],"mappings":";;;AAIO,MAAMA,IAAa,CAAC;AAAA,EACzB,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,OAAAC;AACF,MAAiB;AACf,QAAMC,IAAUC,EAAmB,EAAE,OAAAF,GAAO;AAG1C,SAAAG,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,OAAAN;AAAA,MACA,QAAAC;AAAA,MACA,MAAK;AAAA,MACL,SAAQ;AAAA,MACR,WAAWM,EAAKL,GAAWE,CAAO;AAAA,MAClC,eAAY;AAAA,MAEZ,UAAAE,gBAAAA,EAAAA,IAAC,QAAK,EAAA,GAAE,iGAAiG,CAAA;AAAA,IAAA;AAAA,EAC3G;AAEJ;"}

package/dist/index.es109.js

@@ -1,36 +1,30 @@
-import { j as s } from "./index.es171.js";
-import { clsx as l } from "./index.es173.js";
-import { createColorClasses as a } from "./index.es182.js";
+import { j as s } from "./index.es172.js";
+import { clsx as a } from "./index.es174.js";
+import { createColorClasses as i } from "./index.es181.js";
 const p = ({
-  width: o = 114,
-  height: r = 115,
+  width: r = 24,
+  height: o = 24,
   className: t,
-  color: e
+  color: e,
+  onClick: l
 }) => {
-  const i = a({ color: e });
+  const m = i({ color: e });
   return /* @__PURE__ */ s.jsx(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
-      width: o,
-      height: r,
-      viewBox: "0 0 114 115",
-      fill: "none",
-      className: l(t, i),
+      width: r,
+      height: o,
+      fill: "currentColor",
+      viewBox: "0 0 24 24",
+      className: a(t, m),
       "aria-hidden": "true",
-      children: /* @__PURE__ */ s.jsx(
-        "path",
-        {
-          stroke: "#fff",
-          strokeWidth: "20",
-          d: "M104 57.5c0 26.316-21.125 47.5-47 47.5S10 83.816 10 57.5 31.125 10 57 10s47 21.184 47 47.5Z",
-          opacity: "0.3"
-        }
-      )
+      onClick: l,
+      children: /* @__PURE__ */ s.jsx("path", { d: "m12.7 12 6.7 6.6-.8.8-6.6-6.7-6.6 6.7-.8-.8 6.7-6.6-6.7-6.6.8-.8 6.6 6.7 6.6-6.7.8.8z" })
     }
   );
 };
 export {
-  p as Ellipse
+  p as Close
 };
 //# sourceMappingURL=index.es109.js.map

package/dist/index.es109.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es109.js","sources":["../src/icons/Ellipse/index.tsx"],"sourcesContent":["import clsx from \"clsx\";\r\nimport { IconProps } from \"../../types/icons\";\r\nimport { createColorClasses } from \"@/theme/colors\";\r\n\r\nexport const Ellipse = ({\r\n  width = 114,\r\n  height = 115,\r\n  className,\r\n  color,\r\n}: IconProps) => {\r\n  const classes = createColorClasses({ color });\r\n\r\n  return (\r\n    <svg\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      width={width}\r\n      height={height}\r\n      viewBox=\"0 0 114 115\"\r\n      fill=\"none\"\r\n      className={clsx(className, classes)}\r\n      aria-hidden=\"true\" // this is a decorative icon, so we should hide it from screen readers\r\n    >\r\n      <path\r\n        stroke=\"#fff\"\r\n        strokeWidth=\"20\"\r\n        d=\"M104 57.5c0 26.316-21.125 47.5-47 47.5S10 83.816 10 57.5 31.125 10 57 10s47 21.184 47 47.5Z\"\r\n        opacity=\"0.3\"\r\n      ></path>\r\n    </svg>\r\n  );\r\n};\r\n"],"names":["Ellipse","width","height","className","color","classes","createColorClasses","jsx","clsx"],"mappings":";;;AAIO,MAAMA,IAAU,CAAC;AAAA,EACtB,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,OAAAC;AACF,MAAiB;AACf,QAAMC,IAAUC,EAAmB,EAAE,OAAAF,GAAO;AAG1C,SAAAG,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,OAAAN;AAAA,MACA,QAAAC;AAAA,MACA,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,WAAWM,EAAKL,GAAWE,CAAO;AAAA,MAClC,eAAY;AAAA,MAEZ,UAAAE,gBAAAA,EAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,QAAO;AAAA,UACP,aAAY;AAAA,UACZ,GAAE;AAAA,UACF,SAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IACT;AAAA,EACH;AAEJ;"}
+{"version":3,"file":"index.es109.js","sources":["../src/icons/Close/index.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { IconProps } from \"@/types/icons.ts\";\nimport { createColorClasses } from \"@/theme/colors\";\n\nexport const Close = ({\n  width = 24,\n  height = 24,\n  className,\n  color,\n  onClick,\n}: IconProps) => {\n  const classes = createColorClasses({ color });\n\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={width}\n      height={height}\n      fill=\"currentColor\"\n      viewBox=\"0 0 24 24\"\n      className={clsx(className, classes)}\n      aria-hidden=\"true\" // this is a decorative icon, so we should hide it from screen readers\n      onClick={onClick}\n    >\n      <path d=\"m12.7 12 6.7 6.6-.8.8-6.6-6.7-6.6 6.7-.8-.8 6.7-6.6-6.7-6.6.8-.8 6.6 6.7 6.6-6.7.8.8z\"></path>\n    </svg>\n  );\n};\n"],"names":["Close","width","height","className","color","onClick","classes","createColorClasses","jsx","clsx"],"mappings":";;;AAIO,MAAMA,IAAQ,CAAC;AAAA,EACpB,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AACF,MAAiB;AACf,QAAMC,IAAUC,EAAmB,EAAE,OAAAH,GAAO;AAG1C,SAAAI,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,OAAAP;AAAA,MACA,QAAAC;AAAA,MACA,MAAK;AAAA,MACL,SAAQ;AAAA,MACR,WAAWO,EAAKN,GAAWG,CAAO;AAAA,MAClC,eAAY;AAAA,MACZ,SAAAD;AAAA,MAEA,UAAAG,gBAAAA,EAAAA,IAAC,QAAK,EAAA,GAAE,wFAAwF,CAAA;AAAA,IAAA;AAAA,EAClG;AAEJ;"}

package/dist/index.es11.js

@@ -1,44 +1,49 @@
-import { j as e } from "./index.es171.js";
+import { j as r } from "./index.es172.js";
 import './components/ui/Search/Search.css';/* empty css            */
-import { clsx as r } from "./index.es173.js";
-import { useState as u } from "react";
-import { useAlertDialog as m } from "./index.es185.js";
-import { Button as p } from "./index.es25.js";
-const j = ({ btnText: s, helperText: a, value: i }) => {
-  const [t, l] = u(i), { openAlert: o, AlertDialog: c } = m();
-  return /* @__PURE__ */ e.jsxs("div", { className: r("ui-search", "br-x4 bg-border-secondary w-full"), children: [
-    /* @__PURE__ */ e.jsx(
+import { clsx as e } from "./index.es174.js";
+import { useState as m } from "react";
+import { useAlertDialog as p } from "./index.es186.js";
+import { Button as x } from "./index.es25.js";
+const v = ({
+  btnText: i,
+  helperText: l,
+  onChangeValue: t,
+  value: o
+}) => {
+  const [s, c] = m(o), { openAlert: n, AlertDialog: u } = p();
+  return /* @__PURE__ */ r.jsxs("div", { className: e("ui-search", "br-x4 bg-border-secondary w-full"), children: [
+    /* @__PURE__ */ r.jsx(
       "input",
       {
         id: "search",
         type: "search",
-        className: r(
+        className: e(
           "ui-search-input",
           "bg-white fs-6 text-slate-20 br-x4 w-full pl-x24"
         ),
-        placeholder: a,
+        placeholder: l,
         "aria-label": "Barra di ricerca",
-        value: t,
-        onChange: (n) => {
-          l(n.target.value);
+        value: s,
+        onChange: (a) => {
+          t && t(a.target.value), c(a.target.value);
         }
       }
     ),
-    /* @__PURE__ */ e.jsx("div", { className: r("ui-div-btn"), children: /* @__PURE__ */ e.jsx(
-      p,
+    /* @__PURE__ */ r.jsx("div", { className: e("ui-div-btn"), children: /* @__PURE__ */ r.jsx(
+      x,
       {
-        className: r(
+        className: e(
           "ui-btn-search",
           "bg-primary text-white fs-7 fw-semibold br-x4"
         ),
-        onClick: () => o({ description: t }),
-        children: s
+        onClick: () => n({ description: s }),
+        children: i
       }
     ) }),
-    /* @__PURE__ */ e.jsx(c, {})
+    /* @__PURE__ */ r.jsx(u, {})
   ] });
 };
 export {
-  j as Search
+  v as Search
 };
 //# sourceMappingURL=index.es11.js.map

package/dist/index.es11.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es11.js","sources":["../src/components/ui/Search/index.tsx"],"sourcesContent":["import \"./Search.scss\";\nimport clsx from \"clsx\";\nimport { useState } from \"react\";\nimport { Button } from \"@/components\";\nimport { useAlertDialog } from \"@/hooks/useAlert.tsx\";\n\ntype SearchProps = {\n  btnText: string;\n  helperText: string;\n  value: string;\n};\n\nexport const Search = ({ btnText, helperText, value }: SearchProps) => {\n  const [valueInput, setValueInput] = useState(value);\n  const { openAlert, AlertDialog } = useAlertDialog();\n  return (\n    <div className={clsx(\"ui-search\", \"br-x4 bg-border-secondary w-full\")}>\n      <input\n        id=\"search\"\n        type=\"search\"\n        className={clsx(\n          \"ui-search-input\",\n          \"bg-white fs-6 text-slate-20 br-x4 w-full pl-x24\",\n        )}\n        placeholder={helperText}\n        aria-label=\"Barra di ricerca\"\n        value={valueInput}\n        onChange={(e) => {\n          setValueInput(e.target.value);\n        }}\n      />\n      <div className={clsx(\"ui-div-btn\")}>\n        <Button\n          className={clsx(\n            \"ui-btn-search\",\n            \"bg-primary text-white fs-7 fw-semibold br-x4\",\n          )}\n          onClick={() => openAlert({ description: valueInput })}\n        >\n          {btnText}\n        </Button>\n      </div>\n      <AlertDialog />\n    </div>\n  );\n};\n"],"names":["Search","btnText","helperText","value","valueInput","setValueInput","useState","openAlert","AlertDialog","useAlertDialog","clsx","jsx","e","Button"],"mappings":";;;;;;AAYO,MAAMA,IAAS,CAAC,EAAE,SAAAC,GAAS,YAAAC,GAAY,OAAAC,QAAyB;AACrE,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASH,CAAK,GAC5C,EAAE,WAAAI,GAAW,aAAAC,EAAY,IAAIC,EAAe;AAClD,gCACG,OAAI,EAAA,WAAWC,EAAK,aAAa,kCAAkC,GAClE,UAAA;AAAA,IAAAC,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,WAAWD;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,aAAaR;AAAA,QACb,cAAW;AAAA,QACX,OAAOE;AAAA,QACP,UAAU,CAACQ,MAAM;AACD,UAAAP,EAAAO,EAAE,OAAO,KAAK;AAAA,QAAA;AAAA,MAC9B;AAAA,IACF;AAAA,IACCD,gBAAAA,EAAA,IAAA,OAAA,EAAI,WAAWD,EAAK,YAAY,GAC/B,UAAAC,gBAAAA,EAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,WAAWH;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,SAAS,MAAMH,EAAU,EAAE,aAAaH,GAAY;AAAA,QAEnD,UAAAH;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,0BACCO,GAAY,CAAA,CAAA;AAAA,EAAA,GACf;AAEJ;"}
+{"version":3,"file":"index.es11.js","sources":["../src/components/ui/Search/index.tsx"],"sourcesContent":["import \"./Search.scss\";\nimport clsx from \"clsx\";\nimport { useState } from \"react\";\nimport { Button } from \"@/components\";\nimport { useAlertDialog } from \"@/hooks/useAlert.tsx\";\n\ntype SearchProps = {\n  btnText: string;\n  helperText: string;\n  value: string;\n  onChangeValue?: (value: string) => void;\n};\n\nexport const Search = ({\n  btnText,\n  helperText,\n  onChangeValue,\n  value,\n}: SearchProps) => {\n  const [valueInput, setValueInput] = useState(value);\n  const { openAlert, AlertDialog } = useAlertDialog();\n  return (\n    <div className={clsx(\"ui-search\", \"br-x4 bg-border-secondary w-full\")}>\n      <input\n        id=\"search\"\n        type=\"search\"\n        className={clsx(\n          \"ui-search-input\",\n          \"bg-white fs-6 text-slate-20 br-x4 w-full pl-x24\",\n        )}\n        placeholder={helperText}\n        aria-label=\"Barra di ricerca\"\n        value={valueInput}\n        onChange={(e) => {\n          if (onChangeValue) {\n            onChangeValue(e.target.value);\n          }\n          setValueInput(e.target.value);\n        }}\n      />\n      <div className={clsx(\"ui-div-btn\")}>\n        <Button\n          className={clsx(\n            \"ui-btn-search\",\n            \"bg-primary text-white fs-7 fw-semibold br-x4\",\n          )}\n          onClick={() => openAlert({ description: valueInput })}\n        >\n          {btnText}\n        </Button>\n      </div>\n      <AlertDialog />\n    </div>\n  );\n};\n"],"names":["Search","btnText","helperText","onChangeValue","value","valueInput","setValueInput","useState","openAlert","AlertDialog","useAlertDialog","clsx","jsx","e","Button"],"mappings":";;;;;;AAaO,MAAMA,IAAS,CAAC;AAAA,EACrB,SAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,OAAAC;AACF,MAAmB;AACjB,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASH,CAAK,GAC5C,EAAE,WAAAI,GAAW,aAAAC,EAAY,IAAIC,EAAe;AAClD,gCACG,OAAI,EAAA,WAAWC,EAAK,aAAa,kCAAkC,GAClE,UAAA;AAAA,IAAAC,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAG;AAAA,QACH,MAAK;AAAA,QACL,WAAWD;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,aAAaT;AAAA,QACb,cAAW;AAAA,QACX,OAAOG;AAAA,QACP,UAAU,CAACQ,MAAM;AACf,UAAIV,KACYA,EAAAU,EAAE,OAAO,KAAK,GAEhBP,EAAAO,EAAE,OAAO,KAAK;AAAA,QAAA;AAAA,MAC9B;AAAA,IACF;AAAA,IACCD,gBAAAA,EAAA,IAAA,OAAA,EAAI,WAAWD,EAAK,YAAY,GAC/B,UAAAC,gBAAAA,EAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,WAAWH;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA,SAAS,MAAMH,EAAU,EAAE,aAAaH,GAAY;AAAA,QAEnD,UAAAJ;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,0BACCQ,GAAY,CAAA,CAAA;AAAA,EAAA,GACf;AAEJ;"}