@anoki/fse-ui 1.0.735 → 1.0.737

package/dist/index.es138.js

@@ -1,6 +1,6 @@
 import { j as c } from "./index.es212.js";
-import { clsx as s } from "./index.es213.js";
-import { createColorClasses as a } from "./index.es216.js";
+import { clsx as s } from "./index.es214.js";
+import { createColorClasses as a } from "./index.es227.js";
 const V = ({
   width: l = 263,
   height: h = 40,

package/dist/index.es139.js

@@ -1,6 +1,6 @@
 import { j as q } from "./index.es212.js";
-import { clsx as M } from "./index.es213.js";
-import { createColorClasses as t } from "./index.es216.js";
+import { clsx as M } from "./index.es214.js";
+import { createColorClasses as t } from "./index.es227.js";
 const i = ({
   width: v = 137,
   height: h = 40,

package/dist/index.es14.js

@@ -1,6 +1,6 @@
 import { j as a } from "./index.es212.js";
 import './components/ui/SearchDocument/SearchDocument.css';/* empty css            */
-import { clsx as n } from "./index.es213.js";
+import { clsx as n } from "./index.es214.js";
 import { useState as u } from "react";
 import { Close as C } from "./index.es134.js";
 import { Col as N } from "./index.es10.js";

package/dist/index.es140.js

@@ -1,6 +1,6 @@
 import { j as c } from "./index.es212.js";
-import { clsx as s } from "./index.es213.js";
-import { createColorClasses as r } from "./index.es216.js";
+import { clsx as s } from "./index.es214.js";
+import { createColorClasses as r } from "./index.es227.js";
 const a = ({
   width: v = 118,
   height: m = 40,

package/dist/index.es141.js

@@ -1,6 +1,6 @@
 import { j as h } from "./index.es212.js";
-import { clsx as c } from "./index.es213.js";
-import { createColorClasses as r } from "./index.es216.js";
+import { clsx as c } from "./index.es214.js";
+import { createColorClasses as r } from "./index.es227.js";
 const v = ({
   width: l = 44,
   height: s = 44,

package/dist/index.es142.js

@@ -1,6 +1,6 @@
 import { j as q } from "./index.es212.js";
-import { clsx as t } from "./index.es213.js";
-import { createColorClasses as s } from "./index.es216.js";
+import { clsx as t } from "./index.es214.js";
+import { createColorClasses as s } from "./index.es227.js";
 const x = ({
   width: l = 101,
   height: a = 40,

package/dist/index.es143.js

@@ -1,6 +1,6 @@
 import { j as q } from "./index.es212.js";
-import { clsx as M } from "./index.es213.js";
-import { createColorClasses as c } from "./index.es216.js";
+import { clsx as M } from "./index.es214.js";
+import { createColorClasses as c } from "./index.es227.js";
 const V = ({
   width: h = 181,
   height: v = 40,

package/dist/index.es144.js

@@ -1,6 +1,6 @@
 import { j as l } from "./index.es212.js";
-import { clsx as s } from "./index.es213.js";
-import { createColorClasses as f } from "./index.es216.js";
+import { clsx as s } from "./index.es214.js";
+import { createColorClasses as f } from "./index.es227.js";
 const n = ({
   width: e = 75,
   height: c = 75,

package/dist/index.es145.js

@@ -1,6 +1,6 @@
 import { j as l } from "./index.es212.js";
-import { clsx as o } from "./index.es213.js";
-import { createColorClasses as t } from "./index.es216.js";
+import { clsx as o } from "./index.es214.js";
+import { createColorClasses as t } from "./index.es227.js";
 const m = ({
   width: a = 75,
   height: s = 75,

package/dist/index.es146.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
-import { clsx as i } from "./index.es213.js";
-import { createColorClasses as a } from "./index.es216.js";
+import { clsx as i } from "./index.es214.js";
+import { createColorClasses as a } from "./index.es227.js";
 const x = ({
   width: s = 24,
   height: o = 24,

package/dist/index.es147.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
-import { clsx as i } from "./index.es213.js";
-import { createColorClasses as a } from "./index.es216.js";
+import { clsx as i } from "./index.es214.js";
+import { createColorClasses as a } from "./index.es227.js";
 const x = ({
   width: s = 24,
   height: o = 24,

package/dist/index.es148.js

@@ -1,6 +1,6 @@
 import { j as e } from "./index.es212.js";
-import { clsx as c } from "./index.es213.js";
-import { createColorClasses as h } from "./index.es216.js";
+import { clsx as c } from "./index.es214.js";
+import { createColorClasses as h } from "./index.es227.js";
 const n = ({
   width: s = 32,
   height: o = 32,

package/dist/index.es149.js

@@ -1,6 +1,6 @@
 import { j as c } from "./index.es212.js";
-import { clsx as l } from "./index.es213.js";
-import { createColorClasses as r } from "./index.es216.js";
+import { clsx as l } from "./index.es214.js";
+import { createColorClasses as r } from "./index.es227.js";
 const d = ({
   width: a = 32,
   height: h = 32,

package/dist/index.es15.js

@@ -1,42 +1,42 @@
 import { j as e } from "./index.es212.js";
-import { useState as g } from "react";
-import { clsx as n } from "./index.es213.js";
+import { useState as w } from "react";
+import { clsx as n } from "./index.es214.js";
 import './components/ui/SearchGeneric/SearchGeneric.css';/* empty css            */
-import { useMediaQuery as B } from "./index.es220.js";
+import { useMediaQuery as B } from "./index.es233.js";
 import { Close as E } from "./index.es134.js";
 import { Col as M } from "./index.es10.js";
 import { Button as R } from "./index.es25.js";
-function H({
-  btnText: w,
-  helperText: m,
-  mobileHelperText: b = m,
-  value: j,
-  items: v,
-  setValue: u,
+function J({
+  btnText: b,
+  helperText: u,
+  mobileHelperText: j = u,
+  value: v,
+  items: C,
+  setValue: l,
   setTypedValue: h,
   getSearchField: p,
   getDisplayField: d = p,
   onItemSelect: x,
-  minCharsToSearch: C = 3,
-  className: N
+  minCharsToSearch: N = 3,
+  className: y
 }) {
-  const [r, l] = g(j || ""), [f, a] = g([]), y = B("(min-width: 768px)"), I = (t) => {
+  const [r, c] = w(v || ""), [f, a] = w([]), I = B("(min-width: 768px)"), g = (t) => {
     const s = t.target.value;
-    if (l(s), h && h(s), s.length >= C) {
-      const c = v.filter((i) => {
+    if (c(s), h && h(s), s.length >= N) {
+      const m = C.filter((i) => {
         const o = p(i);
         return o == null ? void 0 : o.toLowerCase().includes(s.toLowerCase());
       });
-      a(c);
+      a(m);
     } else
       a([]);
   }, L = (t) => {
     const s = d(t);
-    l(s), u(s), a([]), x && x(t);
+    c(s), l(s), a([]), x && x(t);
   }, k = (t, s) => {
     if (!s) return t;
-    const c = t.split(new RegExp(`(${s})`, "gi"));
-    return /* @__PURE__ */ e.jsx(e.Fragment, { children: c.map(
+    const m = t.split(new RegExp(`(${s})`, "gi"));
+    return /* @__PURE__ */ e.jsx(e.Fragment, { children: m.map(
       (i, o) => i.toLowerCase() === s.toLowerCase() ? /* @__PURE__ */ e.jsx("span", { className: "text-primary fw-bold", children: i }, o) : i
     ) });
   };
@@ -46,7 +46,7 @@ function H({
       className: n(
         "ui-search",
         "br-x4 bg-border-secondary w-full",
-        N
+        y
       ),
       children: [
         /* @__PURE__ */ e.jsxs("div", { className: "position-relative", children: [
@@ -60,10 +60,10 @@ function H({
                 "fs-6 md-fs-custom text-slate-20 br-x4 w-full pl-x24",
                 r && r.length >= 3 && "has-clear-icon"
               ),
-              placeholder: y ? m : b,
+              placeholder: I ? u : j,
               "aria-label": "Barra di ricerca",
               value: r,
-              onChange: I,
+              onChange: g,
               maxLength: 30
             }
           ),
@@ -72,7 +72,7 @@ function H({
             {
               className: "ui-clean-button",
               onClick: () => {
-                l(""), a([]);
+                c(""), a([]), l(""), g({ target: { value: "" } });
               }
             }
           )
@@ -104,9 +104,9 @@ function H({
               "bg-primary text-white fs-7 md-fs-6 fw-semibold br-x4"
             ),
             onClick: () => {
-              a([]), u(r);
+              a([]), l(r);
             },
-            children: w
+            children: b
           }
         ) })
       ]
@@ -114,6 +114,6 @@ function H({
   );
 }
 export {
-  H as SearchGeneric
+  J as SearchGeneric
 };
 //# sourceMappingURL=index.es15.js.map

package/dist/index.es15.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es15.js","sources":["../src/components/ui/SearchGeneric/index.tsx"],"sourcesContent":["import { ChangeEvent, useState } from \"react\";\nimport clsx from \"clsx\";\nimport { Button, Col } from \"@/components\";\nimport { Close } from \"@/icons\";\nimport \"./SearchGeneric.scss\";\nimport { useMediaQuery } from \"@/hooks/useMediaQuery.ts\";\n\nexport type SearchGenericProps<T extends object> = {\n  btnText: string;\n  helperText: string;\n  mobileHelperText?: string;\n  value: string;\n  items: T[];\n  setValue: (value: string) => void;\n  setTypedValue?: (value: string) => void;\n  getSearchField: (item: T) => string;\n  getDisplayField?: (item: T) => string;\n  onItemSelect?: (item: T) => void;\n  minCharsToSearch?: number;\n  className?: string;\n};\n\nexport function SearchGeneric<T extends object>({\n  btnText,\n  helperText,\n  mobileHelperText = helperText,\n  value,\n  items,\n  setValue,\n  setTypedValue,\n  getSearchField,\n  getDisplayField = getSearchField,\n  onItemSelect,\n  minCharsToSearch = 3,\n  className,\n}: SearchGenericProps<T>) {\n  const [valueInput, setValueInput] = useState<string>(value || \"\");\n  const [filteredItems, setFilteredItems] = useState<T[]>([]);\n  const isDesktop = useMediaQuery(\"(min-width: 768px)\");\n\n  const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n    const inputValue = e.target.value;\n    setValueInput(inputValue);\n    if (setTypedValue) {\n      setTypedValue(inputValue);\n    }\n    if (inputValue.length >= minCharsToSearch) {\n      const results = items.filter((item) => {\n        const searchField = getSearchField(item);\n        return searchField?.toLowerCase().includes(inputValue.toLowerCase());\n      });\n      setFilteredItems(results);\n    } else {\n      setFilteredItems([]);\n    }\n  };\n\n  const handleSelectItem = (item: T) => {\n    const displayValue = getDisplayField(item);\n    setValueInput(displayValue);\n    setValue(displayValue);\n    setFilteredItems([]);\n\n    if (onItemSelect) {\n      onItemSelect(item);\n    }\n  };\n\n  const highlightMatch = (text: string, query: string) => {\n    if (!query) return text;\n\n    const parts = text.split(new RegExp(`(${query})`, \"gi\"));\n\n    return (\n      <>\n        {parts.map((part, i) =>\n          part.toLowerCase() === query.toLowerCase() ? (\n            <span key={i} className=\"text-primary fw-bold\">\n              {part}\n            </span>\n          ) : (\n            part\n          ),\n        )}\n      </>\n    );\n  };\n\n  return (\n    <div\n      className={clsx(\n        \"ui-search\",\n        \"br-x4 bg-border-secondary w-full\",\n        className,\n      )}\n    >\n      <div className=\"position-relative\">\n        <input\n          id=\"search\"\n          type=\"text\"\n          className={clsx(\n            \"ui-search-input\",\n            \"fs-6 md-fs-custom text-slate-20 br-x4 w-full pl-x24\",\n            valueInput && valueInput.length >= 3 && \"has-clear-icon\",\n          )}\n          placeholder={isDesktop ? helperText : mobileHelperText}\n          aria-label=\"Barra di ricerca\"\n          value={valueInput}\n          onChange={handleInputChange}\n          maxLength={30}\n        />\n        {valueInput && (\n          <Close\n            className=\"ui-clean-button\"\n            onClick={() => {\n              setValueInput(\"\");\n              setFilteredItems([]);\n            }}\n          />\n        )}\n      </div>\n      {filteredItems.length > 0 && (\n        <div className=\"ui-wrap-list-item-search shadow position-absolute p-x24\">\n          <Col\n            gap={\"x24\"}\n            fw={\"regular\"}\n            text={\"secondary\"}\n            fs={\"6\"}\n            className=\"ui-list-item-search overflow-y-auto \"\n          >\n            {filteredItems.map((item, index) => (\n              <div\n                key={index}\n                onClick={() => handleSelectItem(item)}\n                className=\"hover:bg-primary\"\n              >\n                {highlightMatch(getDisplayField(item), valueInput)}\n              </div>\n            ))}\n          </Col>\n        </div>\n      )}\n      <div className={clsx(\"ui-div-btn\")}>\n        <Button\n          className={clsx(\n            \"ui-btn-search\",\n            \"bg-primary text-white fs-7 md-fs-6 fw-semibold br-x4\",\n          )}\n          onClick={() => {\n            setFilteredItems([]);\n            setValue(valueInput);\n          }}\n        >\n          {btnText}\n        </Button>\n      </div>\n    </div>\n  );\n}\n"],"names":["SearchGeneric","btnText","helperText","mobileHelperText","value","items","setValue","setTypedValue","getSearchField","getDisplayField","onItemSelect","minCharsToSearch","className","valueInput","setValueInput","useState","filteredItems","setFilteredItems","isDesktop","useMediaQuery","handleInputChange","e","inputValue","results","item","searchField","handleSelectItem","displayValue","highlightMatch","text","query","parts","part","i","jsxs","clsx","jsx","Close","Col","index","Button"],"mappings":"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"}
+{"version":3,"file":"index.es15.js","sources":["../src/components/ui/SearchGeneric/index.tsx"],"sourcesContent":["import { ChangeEvent, useState } from \"react\";\nimport clsx from \"clsx\";\nimport { Button, Col } from \"@/components\";\nimport { Close } from \"@/icons\";\nimport \"./SearchGeneric.scss\";\nimport { useMediaQuery } from \"@/hooks/useMediaQuery.ts\";\n\nexport type SearchGenericProps<T extends object> = {\n  btnText: string;\n  helperText: string;\n  mobileHelperText?: string;\n  value: string;\n  items: T[];\n  setValue: (value: string) => void;\n  setTypedValue?: (value: string) => void;\n  getSearchField: (item: T) => string;\n  getDisplayField?: (item: T) => string;\n  onItemSelect?: (item: T) => void;\n  minCharsToSearch?: number;\n  className?: string;\n};\n\nexport function SearchGeneric<T extends object>({\n  btnText,\n  helperText,\n  mobileHelperText = helperText,\n  value,\n  items,\n  setValue,\n  setTypedValue,\n  getSearchField,\n  getDisplayField = getSearchField,\n  onItemSelect,\n  minCharsToSearch = 3,\n  className,\n}: SearchGenericProps<T>) {\n  const [valueInput, setValueInput] = useState<string>(value || \"\");\n  const [filteredItems, setFilteredItems] = useState<T[]>([]);\n  const isDesktop = useMediaQuery(\"(min-width: 768px)\");\n\n  const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n    const inputValue = e.target.value;\n    setValueInput(inputValue);\n    if (setTypedValue) {\n      setTypedValue(inputValue);\n    }\n    if (inputValue.length >= minCharsToSearch) {\n      const results = items.filter((item) => {\n        const searchField = getSearchField(item);\n        return searchField?.toLowerCase().includes(inputValue.toLowerCase());\n      });\n      setFilteredItems(results);\n    } else {\n      setFilteredItems([]);\n    }\n  };\n\n  const handleSelectItem = (item: T) => {\n    const displayValue = getDisplayField(item);\n    setValueInput(displayValue);\n    setValue(displayValue);\n    setFilteredItems([]);\n\n    if (onItemSelect) {\n      onItemSelect(item);\n    }\n  };\n\n  const highlightMatch = (text: string, query: string) => {\n    if (!query) return text;\n\n    const parts = text.split(new RegExp(`(${query})`, \"gi\"));\n\n    return (\n      <>\n        {parts.map((part, i) =>\n          part.toLowerCase() === query.toLowerCase() ? (\n            <span key={i} className=\"text-primary fw-bold\">\n              {part}\n            </span>\n          ) : (\n            part\n          ),\n        )}\n      </>\n    );\n  };\n\n  return (\n    <div\n      className={clsx(\n        \"ui-search\",\n        \"br-x4 bg-border-secondary w-full\",\n        className,\n      )}\n    >\n      <div className=\"position-relative\">\n        <input\n          id=\"search\"\n          type=\"text\"\n          className={clsx(\n            \"ui-search-input\",\n            \"fs-6 md-fs-custom text-slate-20 br-x4 w-full pl-x24\",\n            valueInput && valueInput.length >= 3 && \"has-clear-icon\",\n          )}\n          placeholder={isDesktop ? helperText : mobileHelperText}\n          aria-label=\"Barra di ricerca\"\n          value={valueInput}\n          onChange={handleInputChange}\n          maxLength={30}\n        />\n        {valueInput && (\n          <Close\n            className=\"ui-clean-button\"\n            onClick={() => {\n              setValueInput(\"\");\n              setFilteredItems([]);\n              setValue(\"\");\n              handleInputChange({ target: { value: \"\" } } as any);\n            }}\n          />\n        )}\n      </div>\n      {filteredItems.length > 0 && (\n        <div className=\"ui-wrap-list-item-search shadow position-absolute p-x24\">\n          <Col\n            gap={\"x24\"}\n            fw={\"regular\"}\n            text={\"secondary\"}\n            fs={\"6\"}\n            className=\"ui-list-item-search overflow-y-auto \"\n          >\n            {filteredItems.map((item, index) => (\n              <div\n                key={index}\n                onClick={() => handleSelectItem(item)}\n                className=\"hover:bg-primary\"\n              >\n                {highlightMatch(getDisplayField(item), valueInput)}\n              </div>\n            ))}\n          </Col>\n        </div>\n      )}\n      <div className={clsx(\"ui-div-btn\")}>\n        <Button\n          className={clsx(\n            \"ui-btn-search\",\n            \"bg-primary text-white fs-7 md-fs-6 fw-semibold br-x4\",\n          )}\n          onClick={() => {\n            setFilteredItems([]);\n            setValue(valueInput);\n          }}\n        >\n          {btnText}\n        </Button>\n      </div>\n    </div>\n  );\n}\n"],"names":["SearchGeneric","btnText","helperText","mobileHelperText","value","items","setValue","setTypedValue","getSearchField","getDisplayField","onItemSelect","minCharsToSearch","className","valueInput","setValueInput","useState","filteredItems","setFilteredItems","isDesktop","useMediaQuery","handleInputChange","e","inputValue","results","item","searchField","handleSelectItem","displayValue","highlightMatch","text","query","parts","part","i","jsxs","clsx","jsx","Close","Col","index","Button"],"mappings":"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"}

package/dist/index.es150.js

@@ -1,6 +1,6 @@
 import { j as a } from "./index.es212.js";
-import { clsx as r } from "./index.es213.js";
-import { createColorClasses as t } from "./index.es216.js";
+import { clsx as r } from "./index.es214.js";
+import { createColorClasses as t } from "./index.es227.js";
 const m = ({
   width: l = 32,
   height: c = 32,

package/dist/index.es151.js

@@ -1,6 +1,6 @@
 import { j as e } from "./index.es212.js";
-import { clsx as m } from "./index.es213.js";
-import { createColorClasses as d } from "./index.es216.js";
+import { clsx as m } from "./index.es214.js";
+import { createColorClasses as d } from "./index.es227.js";
 const n = ({
   width: l = 32,
   height: h = 32,

package/dist/index.es152.js

@@ -1,6 +1,6 @@
 import { j as c } from "./index.es212.js";
-import { clsx as t } from "./index.es213.js";
-import { createColorClasses as v } from "./index.es216.js";
+import { clsx as t } from "./index.es214.js";
+import { createColorClasses as v } from "./index.es227.js";
 const m = ({
   width: l = 32,
   height: e = 32,

package/dist/index.es153.js

@@ -1,5 +1,5 @@
 import { j as l } from "./index.es212.js";
-import { clsx as s } from "./index.es213.js";
+import { clsx as s } from "./index.es214.js";
 const i = ({ width: r = 40, height: e = 40, className: o }) => /* @__PURE__ */ l.jsx(
   "svg",
   {

package/dist/index.es154.js

@@ -1,5 +1,5 @@
 import { j as C } from "./index.es212.js";
-import { clsx as r } from "./index.es213.js";
+import { clsx as r } from "./index.es214.js";
 const t = ({
   width: e = 40,
   height: l = 40,

package/dist/index.es155.js

@@ -1,5 +1,5 @@
 import { j as r } from "./index.es212.js";
-import { clsx as s } from "./index.es213.js";
+import { clsx as s } from "./index.es214.js";
 const a = ({
   width: e = 24,
   height: t = 24,

package/dist/index.es156.js

@@ -1,6 +1,6 @@
 import { j as l } from "./index.es212.js";
-import { clsx as t } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as t } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const n = ({
   width: o = 32,
   height: a = 32,

package/dist/index.es157.js

@@ -1,6 +1,6 @@
 import { j as a } from "./index.es212.js";
-import { clsx as t } from "./index.es213.js";
-import { createColorClasses as c } from "./index.es216.js";
+import { clsx as t } from "./index.es214.js";
+import { createColorClasses as c } from "./index.es227.js";
 const d = ({
   width: l = 32,
   height: s = 32,

package/dist/index.es158.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
-import { clsx as a } from "./index.es213.js";
-import { createColorClasses as m } from "./index.es216.js";
+import { clsx as a } from "./index.es214.js";
+import { createColorClasses as m } from "./index.es227.js";
 const d = ({
   width: l = 24,
   height: e = 24,

package/dist/index.es16.js

@@ -1,8 +1,8 @@
 import { j as e } from "./index.es212.js";
 import { Container as u } from "./index.es6.js";
-import { Divider as p } from "./index.es224.js";
+import { Divider as p } from "./index.es237.js";
 import './components/navigations/Footer/Footer.css';/* empty css            */
-import { clsx as j } from "./index.es213.js";
+import { clsx as j } from "./index.es214.js";
 import { FseUE as N } from "./index.es143.js";
 import { FseIT as E } from "./index.es139.js";
 import { FseMS as T } from "./index.es142.js";

package/dist/index.es160.js

@@ -1,6 +1,6 @@
 import { j as l } from "./index.es212.js";
-import { clsx as t } from "./index.es213.js";
-import { createColorClasses as c } from "./index.es216.js";
+import { clsx as t } from "./index.es214.js";
+import { createColorClasses as c } from "./index.es227.js";
 const x = ({
   width: r = 32,
   height: s = 32,

package/dist/index.es161.js

@@ -1,6 +1,6 @@
 import { j as e } from "./index.es212.js";
-import { clsx as a } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as a } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const d = ({
   width: l = 24,
   height: s = 24,

package/dist/index.es162.js

@@ -1,6 +1,6 @@
 import { j as e } from "./index.es212.js";
-import { clsx as a } from "./index.es213.js";
-import { createColorClasses as m } from "./index.es216.js";
+import { clsx as a } from "./index.es214.js";
+import { createColorClasses as m } from "./index.es227.js";
 const d = ({
   width: o = 24,
   height: r = 24,

package/dist/index.es163.js

@@ -1,6 +1,6 @@
 import { j as e } from "./index.es212.js";
-import { clsx as i } from "./index.es213.js";
-import { createColorClasses as a } from "./index.es216.js";
+import { clsx as i } from "./index.es214.js";
+import { createColorClasses as a } from "./index.es227.js";
 const c = ({
   width: r = 24,
   height: s = 24,

package/dist/index.es164.js

@@ -1,6 +1,6 @@
 import { j as s } from "./index.es212.js";
-import { clsx as r } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as r } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const h = ({
   width: l = 24,
   height: o = 24,

package/dist/index.es165.js

@@ -1,6 +1,6 @@
 import { j as s } from "./index.es212.js";
-import { clsx as l } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as l } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const a = ({
   width: r = 24,
   height: t = 24,

package/dist/index.es166.js

@@ -1,6 +1,6 @@
 import { j as e } from "./index.es212.js";
-import { clsx as i } from "./index.es213.js";
-import { createColorClasses as m } from "./index.es216.js";
+import { clsx as i } from "./index.es214.js";
+import { createColorClasses as m } from "./index.es227.js";
 const p = ({
   width: r = 16,
   height: s = 29,

package/dist/index.es167.js

@@ -1,6 +1,6 @@
 import { j as s } from "./index.es212.js";
-import { clsx as c } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as c } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const d = ({
   width: r = 24,
   height: e = 24,

package/dist/index.es168.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
-import { clsx as l } from "./index.es213.js";
-import { createColorClasses as x } from "./index.es216.js";
+import { clsx as l } from "./index.es214.js";
+import { createColorClasses as x } from "./index.es227.js";
 const m = ({
   width: s = 24,
   height: t = 32,

package/dist/index.es17.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
 import { Container as l } from "./index.es6.js";
-import { clsx as i } from "./index.es213.js";
+import { clsx as i } from "./index.es214.js";
 import './components/navigations/HeaderSlim/HeaderSlim.css';/* empty css            */
 import { Row as j } from "./index.es9.js";
 const w = ({

package/dist/index.es170.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
-import { clsx as l } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as l } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const x = ({
   width: s = 24,
   height: t = 24,

package/dist/index.es171.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
-import { clsx as i } from "./index.es213.js";
-import { createColorClasses as c } from "./index.es216.js";
+import { clsx as i } from "./index.es214.js";
+import { createColorClasses as c } from "./index.es227.js";
 const f = ({
   width: s = 13,
   height: o = 9,

package/dist/index.es172.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
-import { clsx as i } from "./index.es213.js";
-import { createColorClasses as c } from "./index.es216.js";
+import { clsx as i } from "./index.es214.js";
+import { createColorClasses as c } from "./index.es227.js";
 const f = ({
   width: s = 13,
   height: o = 9,

package/dist/index.es173.js

@@ -1,6 +1,6 @@
 import { j as e } from "./index.es212.js";
-import { clsx as a } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as a } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const d = ({
   width: o = 20,
   height: r = 20,

package/dist/index.es174.js

@@ -1,6 +1,6 @@
 import { j as C } from "./index.es212.js";
-import { clsx as l } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as l } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const L = ({
   width: o = 24,
   height: e = 24,

package/dist/index.es175.js

@@ -1,6 +1,6 @@
 import { j as l } from "./index.es212.js";
-import { clsx as i } from "./index.es213.js";
-import { createColorClasses as a } from "./index.es216.js";
+import { clsx as i } from "./index.es214.js";
+import { createColorClasses as a } from "./index.es227.js";
 const d = ({
   width: r = 24,
   height: e = 24,

package/dist/index.es176.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
-import { clsx as a } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as a } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const p = ({
   width: s = 24,
   height: o = 24,

package/dist/index.es178.js

@@ -1,6 +1,6 @@
 import { j as l } from "./index.es212.js";
-import { clsx as t } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as t } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const c = ({
   width: r = 24,
   height: e = 24,

package/dist/index.es179.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
-import { clsx as t } from "./index.es213.js";
-import { createColorClasses as i } from "./index.es216.js";
+import { clsx as t } from "./index.es214.js";
+import { createColorClasses as i } from "./index.es227.js";
 const p = ({
   width: e = 24,
   height: l = 24,

package/dist/index.es18.js

@@ -1,7 +1,7 @@
 import { j as e } from "./index.es212.js";
 import { LOGOS as i } from "./index.es24.js";
-import { clsx as s } from "./index.es213.js";
-import { Divider as l } from "./index.es224.js";
+import { clsx as s } from "./index.es214.js";
+import { Divider as l } from "./index.es237.js";
 import './components/navigations/HeaderPostLogin/HeaderPostLogin.css';/* empty css            */
 import { Col as o } from "./index.es10.js";
 import { Row as v } from "./index.es9.js";

package/dist/index.es180.js

@@ -1,6 +1,6 @@
 import { j as r } from "./index.es212.js";
-import { clsx as m } from "./index.es213.js";
-import { createColorClasses as a } from "./index.es216.js";
+import { clsx as m } from "./index.es214.js";
+import { createColorClasses as a } from "./index.es227.js";
 const p = ({
   width: e = 36,
   height: s = 36,

package/dist/index.es181.js

@@ -1,6 +1,6 @@
 import { j as a } from "./index.es212.js";
-import { clsx as l } from "./index.es213.js";
-import { createColorClasses as m } from "./index.es216.js";
+import { clsx as l } from "./index.es214.js";
+import { createColorClasses as m } from "./index.es227.js";
 const v = ({
   width: c = 24,
   height: e = 24,

package/dist/index.es182.js

@@ -1,6 +1,6 @@
 import { j as l } from "./index.es212.js";
-import { clsx as a } from "./index.es213.js";
-import { createColorClasses as m } from "./index.es216.js";
+import { clsx as a } from "./index.es214.js";
+import { createColorClasses as m } from "./index.es227.js";
 const c = ({
   width: e = 24,
   height: s = 24,