@situaction/traq-ui-ste 1.1.29 → 1.1.31

package/dist/components/select/Select.js

@@ -1,79 +1,171 @@
-import { jsxs as u, jsx as o } from "react/jsx-runtime";
-import { useState as f, useRef as N, useEffect as w } from "react";
-import { Button as _ } from "../button/Button.js";
-import '../../styles/Size.css';import '../../styles/index.css';import '../../styles/Select.css';/* empty css                    */
-import { IconButton as S } from "../icon-button/IconButton.js";
-import { Icon as i } from "../icon/Icon.js";
-import { Modal as g } from "../modal/Modal.js";
+import { jsxs as K, jsx as r } from "react/jsx-runtime";
+import { useState as k, useRef as h, useEffect as w } from "react";
+import { Button as E } from "../button/Button.js";
+import { IconButton as I } from "../icon-button/IconButton.js";
+import { Icon as p } from "../icon/Icon.js";
+import { Modal as M } from "../modal/Modal.js";
 import "../theme/ThemeContext.js";
-/* empty css                   */
-const R = "_selectContainer_1o5wx_54", y = "_selected_1o5wx_57", z = "_children_1o5wx_61", B = "_active_1o5wx_78", F = "_selectList_1o5wx_82", j = "_modal_1o5wx_91", U = "_dropdownFadeIn_1o5wx_1", $ = "_itemLabel_1o5wx_98", c = {
-  selectContainer: R,
+import '../../styles/Size.css';import '../../styles/Select.css';/* empty css                   */
+const O = "_selectContainer_1o5wx_54", q = "_selected_1o5wx_57", A = "_children_1o5wx_61", D = "_active_1o5wx_78", G = "_selectList_1o5wx_82", H = "_modal_1o5wx_91", J = "_dropdownFadeIn_1o5wx_1", Q = "_itemLabel_1o5wx_98", m = {
+  selectContainer: O,
+  selected: q,
+  children: A,
+  active: D,
+  selectList: G,
+  modal: H,
+  dropdownFadeIn: J,
+  itemLabel: Q
+}, re = ({
   selected: y,
-  children: z,
-  active: B,
-  selectList: F,
-  modal: j,
-  dropdownFadeIn: U,
-  itemLabel: $
-}, K = ({ selected: a, size: s = "m", listItem: h, modeDisplay: r = "all", onSelect: p, positionOverride: d }) => {
-  const [n, l] = f(!1), C = N(null), [x, L] = f({ top: "calc(100% + 6px)" }), v = a ?? h[0], [t, b] = f(v);
+  size: _ = "m",
+  listItem: a,
+  modeDisplay: x = "all",
+  onSelect: S,
+  positionOverride: g,
+  placeholder: N = "Sélectionner",
+  autoCloseCondition: W
+}) => {
+  const [t, u] = k(!1), $ = h(null), [j, B] = k({
+    top: "calc(100% + 6px)",
+    left: "0px",
+    width: "100%"
+  }), [c, P] = k(y ?? null);
   w(() => {
-    a && b(a);
-  }, [a]), w(() => {
-    d && L(d);
-  }, [d]);
-  const I = (e) => {
-    b(e), l(!1), p && p(e);
-  }, k = () => {
-    const e = !!t.icon, m = !!t.label;
-    return t.icon && r === "icon" && e ? /* @__PURE__ */ o(S, { mode: "tertiary", size: s ?? "m", onClick: () => l(!n), children: /* @__PURE__ */ o(i, { icon: t.icon }) }) : t.label && r === "text" && m ? /* @__PURE__ */ o(
-      _,
+    P(y ?? null);
+  }, [y]), w(() => {
+    g && B(g);
+  }, [g]);
+  const U = (e) => {
+    P(e), u(!1), S && S(e);
+  }, V = () => {
+    const e = c == null ? void 0 : c.icon, o = (c == null ? void 0 : c.label) || N || "Sélectionner";
+    return x === "icon" && e ? /* @__PURE__ */ r(I, { ref: d, mode: "tertiary", size: _, onClick: () => u(!t), children: /* @__PURE__ */ r(p, { icon: c.icon }) }) : x === "text" ? /* @__PURE__ */ r(
+      E,
       {
+        ref: d,
         mode: "tertiary",
-        label: t.label,
-        childrenRight: /* @__PURE__ */ o(i, { icon: n ? "CaretUp" : "CaretDown", size: 14, weight: "bold" }),
-        size: s ?? "m",
-        onClick: () => l(!n)
+        label: o,
+        childrenRight: /* @__PURE__ */ r(p, { icon: t ? "CaretUp" : "CaretDown", size: 14, weight: "bold" }),
+        size: _,
+        onClick: () => u(!t)
       }
-    ) : t.label && t.icon && r === "all" && (e || m) ? /* @__PURE__ */ o(
-      _,
+    ) : x === "all" ? /* @__PURE__ */ r(
+      E,
       {
+        ref: d,
         mode: "tertiary",
-        label: m ? t.label : "",
-        size: s ?? "m",
-        childrenLeft: e && /* @__PURE__ */ o(i, { icon: t.icon }),
-        childrenRight: /* @__PURE__ */ o(i, { icon: n ? "CaretUp" : "CaretDown", size: 14, weight: "bold" }),
-        onClick: () => l(!n)
+        label: o,
+        size: _,
+        childrenLeft: e && /* @__PURE__ */ r(p, { icon: c.icon }),
+        childrenRight: /* @__PURE__ */ r(p, { icon: t ? "CaretUp" : "CaretDown", size: 14, weight: "bold" }),
+        onClick: () => u(!t)
       }
-    ) : /* @__PURE__ */ o(
-      _,
+    ) : /* @__PURE__ */ r(
+      E,
       {
+        ref: d,
         mode: "tertiary",
-        label: "Sélectionner",
-        size: s ?? "m",
-        onClick: () => l(!n)
+        label: N ?? "Sélectionner",
+        size: _,
+        onClick: () => u(!t)
       }
     );
+  }, R = h(null), b = h({}), [L, v] = k(""), f = h(null), F = h({}), T = (e) => {
+    if (!t) return;
+    const o = e.key.length === 1 ? e.key.toLowerCase() : "";
+    if (!o) return;
+    const i = L + o;
+    v(i);
+    const l = a.find((n) => {
+      var s;
+      return (s = n.label) == null ? void 0 : s.toLowerCase().startsWith(i);
+    });
+    if (l) {
+      const n = b.current[l.value];
+      n == null || n.scrollIntoView({ behavior: "smooth", block: "nearest" });
+    }
+    f.current && clearTimeout(f.current), f.current = setTimeout(() => {
+      v("");
+    }, 500);
   };
-  return /* @__PURE__ */ u("div", { className: c.selectContainer, children: [
-    k(),
-    /* @__PURE__ */ o(
-      g,
+  w(() => (t ? window.addEventListener("keydown", T) : (window.removeEventListener("keydown", T), v("")), () => {
+    window.removeEventListener("keydown", T);
+  }), [t, L, a]), w(() => {
+    const e = (o) => {
+      if (!t) return;
+      const i = o.key.length === 1 ? o.key.toLowerCase() : "";
+      if (!i) return;
+      const l = L + i;
+      v(l);
+      const n = a.find(
+        (s) => {
+          var C;
+          return (C = s.label) == null ? void 0 : C.toLowerCase().startsWith(l);
+        }
+      );
+      if (n && R.current && n.value in b.current && b.current[n.value]) {
+        const s = R.current, C = b.current[n.value];
+        s.scrollTo({
+          top: C.offsetTop - s.offsetTop,
+          behavior: "smooth"
+        });
+      }
+      f.current && clearTimeout(f.current), f.current = setTimeout(() => {
+        v("");
+      }, 700);
+    };
+    return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
+  }, [t, a, L]), w(() => {
+    if (!t) return;
+    const e = (o) => {
+      const i = o.key.toLowerCase();
+      if (i.length === 1) {
+        const l = a.find(
+          (n) => {
+            var s;
+            return (s = n.label) == null ? void 0 : s.toLowerCase().startsWith(i);
+          }
+        );
+        if (l) {
+          const n = F.current[l.value];
+          n && n.scrollIntoView({ block: "start", behavior: "smooth" });
+        }
+      }
+    };
+    return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+  }, [t, a]);
+  const d = h(null);
+  return w(() => {
+    if (t && d.current) {
+      const e = d.current.getBoundingClientRect().height;
+      B({
+        top: `${e + 6}px`,
+        left: "0px",
+        width: "100%"
+      });
+    }
+  }, [t]), /* @__PURE__ */ K("div", { className: m.selectContainer, children: [
+    V(),
+    /* @__PURE__ */ r(
+      M,
       {
-        ref: C,
-        open: n,
-        onClose: () => l(!1),
-        className: c.modal,
-        position: x,
-        children: /* @__PURE__ */ o("div", { className: c.selectList, children: h.map((e) => /* @__PURE__ */ u(
+        ref: $,
+        anchorRef: d,
+        open: t,
+        onClose: () => u(!1),
+        position: j,
+        disableOverlay: !0,
+        className: m.modal,
+        autoCloseCondition: W,
+        children: /* @__PURE__ */ r("div", { className: m.selectList, ref: R, children: a.map((e) => /* @__PURE__ */ K(
           "div",
           {
-            className: `${c.children} ${e.value === t.value ? c.active : ""}`,
-            onClick: () => I(e),
+            ref: (o) => F.current[e.value] = o,
+            className: `${m.children} ${(c == null ? void 0 : c.value) === e.value ? m.active : ""}`,
+            onClick: () => U(e),
             children: [
-              e.icon && /* @__PURE__ */ o(i, { icon: e.icon }),
-              e.label && /* @__PURE__ */ o("div", { className: c.itemLabel, children: e.label })
+              e.icon && /* @__PURE__ */ r(p, { icon: e.icon }),
+              e.label && /* @__PURE__ */ r("div", { className: m.itemLabel, children: e.label })
             ]
           },
           e.value
@@ -83,5 +175,5 @@ const R = "_selectContainer_1o5wx_54", y = "_selected_1o5wx_57", z = "_children_
   ] });
 };
 export {
-  K as Select
+  re as Select
 };

package/dist/components/select-filter-input-tags/SelectFilterInputTags.js

@@ -1,20 +1,21 @@
 import { jsx as e, jsxs as r } from "react/jsx-runtime";
-import '../../styles/Size.css';import '../../styles/index.css';import '../../styles/SelectFilterInputTags.css';/* empty css                    */
+import "../button/Button.js";
 import "react";
 import { Input as c } from "../input/Input.js";
+import "../icon-button/IconButton.js";
 import "../modal/Modal.js";
 import "../theme/ThemeContext.js";
-/* empty css                   */
-const a = "_listTagSelect_2v3fb_6", u = "_flexAutoSize_2v3fb_24", n = {
+import '../../styles/Size.css';import '../../styles/SelectFilterInputTags.css';/* empty css                   */
+const a = "_listTagSelect_2v3fb_6", p = "_flexAutoSize_2v3fb_24", u = {
   listTagSelect: a,
-  flexAutoSize: u
-}, v = ({ children: l, inputValue: o, handleInputChange: s, handleKeyDown: i }) => /* @__PURE__ */ e("div", { className: n.listTagSelect, children: /* @__PURE__ */ r("div", { children: [
-  l,
+  flexAutoSize: p
+}, _ = ({ children: o, inputValue: l, handleInputChange: s, handleKeyDown: i }) => /* @__PURE__ */ e("div", { className: u.listTagSelect, children: /* @__PURE__ */ r("div", { children: [
+  o,
   /* @__PURE__ */ e("div", { className: "flexAutoSize", children: /* @__PURE__ */ e(
     c,
     {
       type: "text",
-      value: o,
+      value: l,
       onKeyDown: (t) => {
         t.key === "Enter" && i && i(t);
       },
@@ -27,5 +28,5 @@ const a = "_listTagSelect_2v3fb_6", u = "_flexAutoSize_2v3fb_24", n = {
   ) })
 ] }) });
 export {
-  v as SelectFilterInputTags
+  _ as SelectFilterInputTags
 };

package/dist/components/select-multi-items/SelectMultiItems.js

@@ -2,11 +2,11 @@ import { jsxs as i, jsx as o } from "react/jsx-runtime";
 import { useState as _, useRef as h } from "react";
 import { R as v, I as C, D as x } from "../../X-Bd1VjKAF.mjs";
 import { Button as M } from "../button/Button.js";
-import '../../styles/Size.css';import '../../styles/index.css';import '../../styles/SelectMultiItems.css';/* empty css                    */
+import "../icon-button/IconButton.js";
 import { TagCounter as R } from "../tag-counter/TagCounter.js";
 import { Modal as w } from "../modal/Modal.js";
 import "../theme/ThemeContext.js";
-/* empty css                   */
+import '../../styles/Size.css';import '../../styles/SelectMultiItems.css';/* empty css                   */
 const y = "_relative_w7e9a_6", I = "_tagCounter_w7e9a_10", N = "_modal_w7e9a_18", r = {
   relative: y,
   tagCounter: I,

package/dist/components/switch/Switch.js

@@ -1,11 +1,11 @@
 import { jsxs as m, jsx as c } from "react/jsx-runtime";
 import { useState as $, useEffect as b } from "react";
-import '../../styles/Size.css';import '../../styles/index.css';import '../../styles/Switch.css';/* empty css                    */
+import "../button/Button.js";
 import { IconButton as k } from "../icon-button/IconButton.js";
 import { Icon as g } from "../icon/Icon.js";
 import "../modal/Modal.js";
 import "../theme/ThemeContext.js";
-/* empty css                   */
+import '../../styles/Size.css';import '../../styles/Switch.css';/* empty css                   */
 const y = "_slider_1mxgk_21", I = "_s_1mxgk_6", N = "_m_1mxgk_58", S = "_l_1mxgk_75", j = "_xl_1mxgk_92", B = "_disabled_1mxgk_110", E = "_wrapper_1mxgk_121", R = "_button_1mxgk_136", T = "_active_1mxgk_145", t = {
   switch: "_switch_1mxgk_6",
   slider: y,

package/dist/components/tabs/Tabs.d.ts

@@ -11,7 +11,10 @@ export interface TabsProps {
     position?: 'center' | 'right' | 'left';
     /** Callback function to handle tab selection, receiving the selected tab's label */
     onTabSelect: (selectedItem: string | ReactNode) => void;
+    /** Full width*/
     fullWidth?: boolean;
+    /** tabs disabled */
+    disabledTabs?: number[];
 }
 /**
  * Tabs component that allows tab navigation with text, icons, or buttons.

package/dist/components/tabs/Tabs.js

@@ -1,9 +1,8 @@
-import { jsxs as $, jsx as a } from "react/jsx-runtime";
-import { useState as u, useRef as s, useLayoutEffect as C } from "react";
-import '../../styles/index.css';import '../../styles/Tabs.css';/* empty css                    */
-import { Button as N } from "../button/Button.js";
-import { IconButton as p } from "../icon-button/IconButton.js";
-const w = "_underline_6o3gh_70", n = {
+import { jsxs as w, jsx as l } from "react/jsx-runtime";
+import { useState as f, useRef as u, useLayoutEffect as B } from "react";
+import { Button as p } from "../button/Button.js";
+import { IconButton as S } from "../icon-button/IconButton.js";
+import '../../styles/Tabs.css';const j = "_underline_6o3gh_70", e = {
   "tab-container": "_tab-container_6o3gh_30",
   "tab-container-button": "_tab-container-button_6o3gh_34",
   "tab-container-icon": "_tab-container-icon_6o3gh_39",
@@ -13,68 +12,85 @@ const w = "_underline_6o3gh_70", n = {
   "tab-full-width": "_tab-full-width_6o3gh_51",
   "selected-button": "_selected-button_6o3gh_57",
   "selected-text": "_selected-text_6o3gh_63",
-  underline: w,
+  underline: j,
   "flexHorizontal-center": "_flexHorizontal-center_6o3gh_78",
   "flexHorizontal-left": "_flexHorizontal-left_6o3gh_84",
   "flexHorizontal-right": "_flexHorizontal-right_6o3gh_90"
-}, A = ({
-  listItems: i,
+}, q = ({
+  listItems: c,
   type: o,
-  onTabSelect: f,
-  defaultActiveTab: d = 0,
-  position: h = "left",
-  fullWidth: m = !1
+  onTabSelect: h,
+  defaultActiveTab: g = 0,
+  position: m = "left",
+  fullWidth: x = !1,
+  disabledTabs: b = []
+  // ✅ par défaut vide
 }) => {
-  const [l, g] = u(d), [x, z] = u({}), c = s(null), v = s(null), _ = s([]), b = (t) => {
-    g(t), f(i[t]);
-  }, R = (t) => {
-    if (c.current && t) {
-      const e = t.getBoundingClientRect(), r = c.current.getBoundingClientRect();
-      z({
-        left: `${e.left - r.left}px`,
-        width: `${e.width}px`
+  const [s, v] = f(g), [z, $] = f({}), r = u(null), R = u(null), _ = u([]), d = (t) => {
+    b.includes(t) || (v(t), h(c[t]));
+  }, H = (t) => {
+    if (r.current && t) {
+      const n = t.getBoundingClientRect(), i = r.current.getBoundingClientRect();
+      $({
+        left: `${n.left - i.left}px`,
+        width: `${n.width}px`
       });
     }
-  }, H = [
-    n[`flexHorizontal-${h}`],
-    o === "button" ? n["tab-items-button"] : n["tab-items"]
+  }, C = [
+    e[`flexHorizontal-${m}`],
+    o === "button" ? e["tab-items-button"] : e["tab-items"]
   ].filter(Boolean).join(" ");
-  return C(() => {
-    const t = _.current[l];
+  return B(() => {
+    const t = _.current[s];
     t && requestAnimationFrame(() => {
-      R(t);
+      H(t);
     });
-  }, [l, i.length]), /* @__PURE__ */ $("div", { className: `tab ${n["tab-container"]} ${n[`tab-container-${o}`]} ${m && n["tab-full-width"]}`, ref: c, children: [
-    /* @__PURE__ */ a("div", { className: H, children: i.map((t, e) => /* @__PURE__ */ a(
-      "div",
-      {
-        ref: (r) => _.current[e] = r,
-        className: o === "button" && e === l ? n["selected-button"] : "",
-        children: o === "icon" ? /* @__PURE__ */ a(
-          p,
-          {
-            mode: "icon",
-            size: "s",
-            selected: e === l,
-            onClick: () => b(e),
-            children: t
-          }
-        ) : /* @__PURE__ */ a("div", { className: e === l ? n["selected-text"] : void 0, children: /* @__PURE__ */ a(
-          N,
-          {
-            size: "s",
-            label: t,
-            mode: o === "text" ? "text" : "ghost",
-            selected: e === l,
-            onClick: () => b(e)
-          }
-        ) })
-      },
-      e
-    )) }),
-    o !== "button" && /* @__PURE__ */ a("div", { ref: v, className: n.underline, style: x })
-  ] });
+  }, [s, c.length]), /* @__PURE__ */ w(
+    "div",
+    {
+      className: `tab ${e["tab-container"]} ${e[`tab-container-${o}`]} ${x && e["tab-full-width"]}`,
+      ref: r,
+      children: [
+        /* @__PURE__ */ l("div", { className: C, children: c.map((t, n) => {
+          const i = b.includes(n), a = n === s;
+          return /* @__PURE__ */ l(
+            "div",
+            {
+              ref: (N) => _.current[n] = N,
+              className: `
+                ${o === "button" && a ? e["selected-button"] : ""}
+                ${i ? e["tab-disabled"] : ""}
+              `,
+              children: o === "icon" ? /* @__PURE__ */ l(
+                S,
+                {
+                  mode: "icon",
+                  size: "s",
+                  selected: a,
+                  onClick: () => d(n),
+                  disabled: i,
+                  children: t
+                }
+              ) : /* @__PURE__ */ l("div", { className: a ? e["selected-text"] : void 0, children: /* @__PURE__ */ l(
+                p,
+                {
+                  size: "s",
+                  label: t,
+                  mode: o === "text" ? "text" : "ghost",
+                  selected: a,
+                  onClick: () => d(n),
+                  disabled: i
+                }
+              ) })
+            },
+            n
+          );
+        }) }),
+        o !== "button" && /* @__PURE__ */ l("div", { ref: R, className: e.underline, style: z })
+      ]
+    }
+  );
 };
 export {
-  A as Tabs
+  q as Tabs
 };

package/dist/main.d.ts

@@ -27,4 +27,5 @@ export { SidePanel } from './components/panel/side-panel/SidePanel';
 export { SidePanelHeader } from './components/panel/side-panel-header/SidePanelHeader';
 export { InputLabel } from './components/input-label/InputLabel';
 export { EditableField } from './components/editable-field/EditableField';
+export { EditableSelect } from './components/editable-select/EditableSelect';
 export { ThemeProvider, useTheme } from './components/theme/ThemeContext';

package/dist/main.js

@@ -1,63 +1,64 @@
-import { Button as m } from "./components/button/Button.js";
-import { ButtonControlledScroll as x } from "./components/buttonControledScroll/ButtonControlledScroll.js";
-import { Input as l } from "./components/input/Input.js";
-import { Tabs as n } from "./components/tabs/Tabs.js";
-import { IconButton as a } from "./components/icon-button/IconButton.js";
-import { Tag as s } from "./components/tag/Tag.js";
-import { Title as I } from "./components/title/Title.js";
+import { Button as t } from "./components/button/Button.js";
+import { ButtonControlledScroll as p } from "./components/buttonControledScroll/ButtonControlledScroll.js";
+import { Input as f } from "./components/input/Input.js";
+import { Tabs as i } from "./components/tabs/Tabs.js";
+import { IconButton as d } from "./components/icon-button/IconButton.js";
+import { Tag as c } from "./components/tag/Tag.js";
+import { Title as u } from "./components/title/Title.js";
 import { TagCounter as S } from "./components/tag-counter/TagCounter.js";
-import { Checkbox as b } from "./components/checkbox/Checkbox.js";
-import { Tooltip as L } from "./components/tooltip/Tooltip.js";
-import { Select as B } from "./components/select/Select.js";
-import { Calendar as P } from "./components/calendar/Calendar.js";
-import { Accordion as F } from "./components/accordion/Accordion.js";
-import { AccordionItem as k } from "./components/accordion/item/AccordionItem.js";
-import { Card as w } from "./components/card/Card.js";
-import { Icon as H } from "./components/icon/Icon.js";
-import { Menu as q } from "./components/menu/Menu.js";
-import { Modal as z } from "./components/modal/Modal.js";
-import { SelectMultiItems as G } from "./components/select-multi-items/SelectMultiItems.js";
-import { SelectFilterInputTags as K } from "./components/select-filter-input-tags/SelectFilterInputTags.js";
-import { ListControls as Q } from "./components/list/list-controls/ListControls.js";
-import { NestedList as U } from "./components/list/nested-list/NestedList.js";
-import { NestedListItem as W } from "./components/list/nested-list/item/NestedListItem.js";
-import { Switch as Y } from "./components/switch/Switch.js";
-import { SidePanel as _ } from "./components/panel/side-panel/SidePanel.js";
-import { SidePanelHeader as oo } from "./components/panel/side-panel-header/SidePanelHeader.js";
-import { InputLabel as eo } from "./components/input-label/InputLabel.js";
-import { EditableField as mo } from "./components/editable-field/EditableField.js";
-import { ThemeProvider as xo, useTheme as fo } from "./components/theme/ThemeContext.js";
-import './styles/Size.css';import './styles/index.css';/* empty css                */
-/* empty css               */
+import { Checkbox as C } from "./components/checkbox/Checkbox.js";
+import { Tooltip as h } from "./components/tooltip/Tooltip.js";
+import { Select as g } from "./components/select/Select.js";
+import { Calendar as M } from "./components/calendar/Calendar.js";
+import { Accordion as A } from "./components/accordion/Accordion.js";
+import { AccordionItem as F } from "./components/accordion/item/AccordionItem.js";
+import { Card as k } from "./components/card/Card.js";
+import { Icon as w } from "./components/icon/Icon.js";
+import { Menu as j } from "./components/menu/Menu.js";
+import { Modal as y } from "./components/modal/Modal.js";
+import { SelectMultiItems as D } from "./components/select-multi-items/SelectMultiItems.js";
+import { SelectFilterInputTags as J } from "./components/select-filter-input-tags/SelectFilterInputTags.js";
+import { ListControls as O } from "./components/list/list-controls/ListControls.js";
+import { NestedList as R } from "./components/list/nested-list/NestedList.js";
+import { NestedListItem as V } from "./components/list/nested-list/item/NestedListItem.js";
+import { Switch as X } from "./components/switch/Switch.js";
+import { SidePanel as Z } from "./components/panel/side-panel/SidePanel.js";
+import { SidePanelHeader as $ } from "./components/panel/side-panel-header/SidePanelHeader.js";
+import { InputLabel as ro } from "./components/input-label/InputLabel.js";
+import { EditableField as to } from "./components/editable-field/EditableField.js";
+import { EditableSelect as po } from "./components/editable-select/EditableSelect.js";
+import { ThemeProvider as fo, useTheme as lo } from "./components/theme/ThemeContext.js";
+import './styles/Size.css';/* empty css               */
 export {
-  F as Accordion,
-  k as AccordionItem,
-  m as Button,
-  x as ButtonControlledScroll,
-  P as Calendar,
-  w as Card,
-  b as Checkbox,
-  mo as EditableField,
-  H as Icon,
-  a as IconButton,
-  l as Input,
-  eo as InputLabel,
-  Q as ListControls,
-  q as Menu,
-  z as Modal,
-  U as NestedList,
-  W as NestedListItem,
-  B as Select,
-  K as SelectFilterInputTags,
-  G as SelectMultiItems,
-  _ as SidePanel,
-  oo as SidePanelHeader,
-  Y as Switch,
-  n as Tabs,
-  s as Tag,
+  A as Accordion,
+  F as AccordionItem,
+  t as Button,
+  p as ButtonControlledScroll,
+  M as Calendar,
+  k as Card,
+  C as Checkbox,
+  to as EditableField,
+  po as EditableSelect,
+  w as Icon,
+  d as IconButton,
+  f as Input,
+  ro as InputLabel,
+  O as ListControls,
+  j as Menu,
+  y as Modal,
+  R as NestedList,
+  V as NestedListItem,
+  g as Select,
+  J as SelectFilterInputTags,
+  D as SelectMultiItems,
+  Z as SidePanel,
+  $ as SidePanelHeader,
+  X as Switch,
+  i as Tabs,
+  c as Tag,
   S as TagCounter,
-  xo as ThemeProvider,
-  I as Title,
-  L as Tooltip,
-  fo as useTheme
+  fo as ThemeProvider,
+  u as Title,
+  h as Tooltip,
+  lo as useTheme
 };

package/dist/styles/Button.css

@@ -1 +1 @@
-._button_mzv5s_30{font-family:var(--font-family);font-weight:500;font-style:normal;line-height:1.25rem;border:0;cursor:pointer;width:fit-content}._button_mzv5s_30:focus-visible{outline:2px solid var(--button-focus-mode);outline-offset:2px}._button_mzv5s_30:disabled{background:var(--button-primary-disabled-background);color:var(--button-primary-disabled-text);border:1px solid var(--button-primary-disabled-border);cursor:initial;pointer-events:none}._button_mzv5s_30:disabled *{fill:var(--button-primary-disabled-text)}._button-primary_mzv5s_54{color:var(--button-primary-default-text);background:var(--button-primary-default-background)}._button-primary_mzv5s_54:hover{background:var(--button-primary-hover-background)}._button-primary_mzv5s_54:active{background:var(--button-primary-pressed-background);outline:none}._button-primary_mzv5s_54 *{fill:var(--button-primary-default-text)}._button-secondary_mzv5s_68{color:var(--button-secondary-default-text);border:1px solid var(--button-secondary-default-border);background:var(--button-secondary-default-background)}._button-secondary_mzv5s_68:hover{border:1px solid var(--button-secondary-hover-border);background:var(--button-secondary-hover-background)}._button-secondary_mzv5s_68:active{border:1px solid var(--button-secondary-pressed-border);background:var(--button-secondary-pressed-background)}._button-secondary_mzv5s_68 *{fill:var(--button-secondary-default-text)}._button-tertiary_mzv5s_84{color:var(--button-tertiary-default-text);background-color:transparent;border:1px solid var(--button-tertiary-default-border)}._button-tertiary_mzv5s_84:hover{border:1px solid var(--button-tertiary-hover-border);background:var(--button-tertiary-hover-background)}._button-tertiary_mzv5s_84:active{border:1px solid var(--button-tertiary-pressed-border);background:var(--button-tertiary-pressed-background)}._button-tertiary_mzv5s_84 *{fill:var(--button-tertiary-default-text)}._button-ghost_mzv5s_100{color:var(--button-ghost-default-text);background-color:transparent}._button-ghost_mzv5s_100:hover{background:var(--button-ghost-hover-background)}._button-ghost_mzv5s_100:active{background-color:var(--button-ghost-pressed-background)}._button-ghost_mzv5s_100:disabled{border:none}._button-ghost_mzv5s_100 *{fill:var(--button-ghost-default-text)}._button-text_mzv5s_116{color:var(--text-button-inactive-text);background-color:transparent;padding:0!important}._button-text_mzv5s_116:hover{color:var(--text-button-inactive-hover-text)}._button-text_mzv5s_116:disabled{border:none;background-color:transparent;color:var(--text-button-disabled-text)}._button-text-selected_mzv5s_129,._button-text-selected_mzv5s_129:hover{color:var(--text-button-active-text)}._button-error_mzv5s_135{color:var(--button-destructive-default-text);background:var(--button-destructive-default-background)}._button-error_mzv5s_135:hover{background:var(--button-destructive-hover-background)}._button-error_mzv5s_135:active{background:var(--button-destructive-pressed-background)}._button-error_mzv5s_135 *{fill:var(--button-destructive-default-text)}._button-size-xl_mzv5s_148{padding:1rem 2rem;font-size:1.125em;line-height:28px;border-radius:8px}._button-size-l_mzv5s_154{padding:.75rem 1.5rem;font-size:1em;line-height:24px;border-radius:8px}._button-size-m_mzv5s_160{padding:.5rem 1rem;font-size:.875em;line-height:22px;border-radius:4px}._button-size-s_mzv5s_166{padding:.375rem .75rem;font-size:.875em;line-height:16px;border-radius:4px}._button-size-menu_mzv5s_172{padding:.5rem;font-size:1em;line-height:24px;border-radius:4px}._button-gap-menu_mzv5s_178{gap:.5rem}._button-gap-xl_mzv5s_181{gap:12px}._button-gap-l_mzv5s_184{gap:8px}._button-gap-m_mzv5s_178,._button-gap-s_mzv5s_187{gap:4px}._flexHorizontalCenter_mzv5s_191{display:flex;justify-content:center;align-items:center;flex-direction:row}
+@font-face{font-family:Urbanist-Thin;src:url(../fonts/Urbanist-Thin.ttf) format("truetype");font-weight:100;font-style:normal}@font-face{font-family:Urbanist-Extra-Light;src:url(../fonts/Urbanist-ExtraLight.ttf) format("truetype");font-weight:200;font-style:normal}@font-face{font-family:Urbanist-Light;src:url(../fonts/Urbanist-Light.ttf) format("truetype");font-weight:300;font-style:normal}@font-face{font-family:Urbanist-Regular;src:url(../fonts/Urbanist-Regular.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:Urbanist;src:url(../fonts/Urbanist-Medium.ttf) format("truetype");font-weight:500;font-style:normal}@font-face{font-family:Urbanist-Back;src:url(../fonts/Urbanist-Black.ttf) format("truetype");font-weight:600;font-style:normal}@font-face{font-family:Urbanist-Semi-Bold;src:url(../fonts/Urbanist-SemiBold.ttf) format("truetype");font-weight:700;font-style:normal}@font-face{font-family:Urbanist-Bold;src:url(../fonts/Urbanist-Bold.ttf) format("truetype");font-weight:800;font-style:normal}@font-face{font-family:Urbanist-Extra-Bold;src:url(../fonts/Urbanist-ExtraBold.ttf) format("truetype");font-weight:900;font-style:normal}:root,body{font-family:Urbanist,sans-serif;line-height:1;width:100vw;height:100vh}h1{font-size:1.875em;font-style:normal;font-weight:700;line-height:2.25rem}h2{font-size:1.5em;font-style:normal;font-weight:700;line-height:2rem;margin:0}h3{font-size:1.25em;font-style:normal;font-weight:700;line-height:1.75rem;margin:0}h4{font-size:1.125em;font-style:normal;font-weight:700;line-height:1.75rem;margin:0}h5{font-size:1em;font-style:normal;font-weight:700;line-height:1.5rem;margin:0}h6{font-size:.875em;font-style:normal;font-weight:700;line-height:1.25rem;margin:0}.textExtraLarge{font-size:1.25em;font-style:normal;line-height:2rem}.textLarge{font-size:1.125em;font-style:normal;line-height:1.75rem}.textMedium{font-size:1em;font-style:normal;line-height:1.5rem}.textSmall{font-size:.875em;font-style:normal;line-height:1.25rem}.textSmaller{font-size:.75em;font-style:normal;line-height:1rem}.labelExtraLarge{font-size:1.25em;font-style:normal;line-height:normal;letter-spacing:1.2px}.labelLarge{font-size:1.125em;font-style:normal;line-height:normal;letter-spacing:1.08px}.labelMedium{font-size:1em;font-style:normal;line-height:normal;letter-spacing:.96px}.labelSmall{font-size:.875em;font-style:normal;line-height:normal;letter-spacing:.84px}.labelSmaller{font-size:.75em;font-style:normal;line-height:normal;letter-spacing:.72px}.labelSmallest{font-size:.625em;font-style:normal;line-height:normal;letter-spacing:.6px}.fontWeight-100{font-weight:100}.fontWeight-200{font-weight:200}.fontWeight-300{font-weight:300}.fontWeight-400{font-weight:400}.fontWeight-500{font-weight:500}.fontWeight-600{font-weight:600}.fontWeight-700{font-weight:700}.fontWeight-800{font-weight:800}.fontWeight-900{font-weight:900}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-thumb{background-color:var(--scrollbar-background);border-radius:.5rem;transition:all .3s ease;margin:.625rem;background-clip:padding-box}::-webkit-scrollbar:hover{cursor:pointer}::-webkit-scrollbar-corner{background:var(--scrollbar-background)}._button_mzv5s_30{font-family:var(--font-family);font-weight:500;font-style:normal;line-height:1.25rem;border:0;cursor:pointer;width:fit-content}._button_mzv5s_30:focus-visible{outline:2px solid var(--button-focus-mode);outline-offset:2px}._button_mzv5s_30:disabled{background:var(--button-primary-disabled-background);color:var(--button-primary-disabled-text);border:1px solid var(--button-primary-disabled-border);cursor:initial;pointer-events:none}._button_mzv5s_30:disabled *{fill:var(--button-primary-disabled-text)}._button-primary_mzv5s_54{color:var(--button-primary-default-text);background:var(--button-primary-default-background)}._button-primary_mzv5s_54:hover{background:var(--button-primary-hover-background)}._button-primary_mzv5s_54:active{background:var(--button-primary-pressed-background);outline:none}._button-primary_mzv5s_54 *{fill:var(--button-primary-default-text)}._button-secondary_mzv5s_68{color:var(--button-secondary-default-text);border:1px solid var(--button-secondary-default-border);background:var(--button-secondary-default-background)}._button-secondary_mzv5s_68:hover{border:1px solid var(--button-secondary-hover-border);background:var(--button-secondary-hover-background)}._button-secondary_mzv5s_68:active{border:1px solid var(--button-secondary-pressed-border);background:var(--button-secondary-pressed-background)}._button-secondary_mzv5s_68 *{fill:var(--button-secondary-default-text)}._button-tertiary_mzv5s_84{color:var(--button-tertiary-default-text);background-color:transparent;border:1px solid var(--button-tertiary-default-border)}._button-tertiary_mzv5s_84:hover{border:1px solid var(--button-tertiary-hover-border);background:var(--button-tertiary-hover-background)}._button-tertiary_mzv5s_84:active{border:1px solid var(--button-tertiary-pressed-border);background:var(--button-tertiary-pressed-background)}._button-tertiary_mzv5s_84 *{fill:var(--button-tertiary-default-text)}._button-ghost_mzv5s_100{color:var(--button-ghost-default-text);background-color:transparent}._button-ghost_mzv5s_100:hover{background:var(--button-ghost-hover-background)}._button-ghost_mzv5s_100:active{background-color:var(--button-ghost-pressed-background)}._button-ghost_mzv5s_100:disabled{border:none}._button-ghost_mzv5s_100 *{fill:var(--button-ghost-default-text)}._button-text_mzv5s_116{color:var(--text-button-inactive-text);background-color:transparent;padding:0!important}._button-text_mzv5s_116:hover{color:var(--text-button-inactive-hover-text)}._button-text_mzv5s_116:disabled{border:none;background-color:transparent;color:var(--text-button-disabled-text)}._button-text-selected_mzv5s_129,._button-text-selected_mzv5s_129:hover{color:var(--text-button-active-text)}._button-error_mzv5s_135{color:var(--button-destructive-default-text);background:var(--button-destructive-default-background)}._button-error_mzv5s_135:hover{background:var(--button-destructive-hover-background)}._button-error_mzv5s_135:active{background:var(--button-destructive-pressed-background)}._button-error_mzv5s_135 *{fill:var(--button-destructive-default-text)}._button-size-xl_mzv5s_148{padding:1rem 2rem;font-size:1.125em;line-height:28px;border-radius:8px}._button-size-l_mzv5s_154{padding:.75rem 1.5rem;font-size:1em;line-height:24px;border-radius:8px}._button-size-m_mzv5s_160{padding:.5rem 1rem;font-size:.875em;line-height:22px;border-radius:4px}._button-size-s_mzv5s_166{padding:.375rem .75rem;font-size:.875em;line-height:16px;border-radius:4px}._button-size-menu_mzv5s_172{padding:.5rem;font-size:1em;line-height:24px;border-radius:4px}._button-gap-menu_mzv5s_178{gap:.5rem}._button-gap-xl_mzv5s_181{gap:12px}._button-gap-l_mzv5s_184{gap:8px}._button-gap-m_mzv5s_178,._button-gap-s_mzv5s_187{gap:4px}._flexHorizontalCenter_mzv5s_191{display:flex;justify-content:center;align-items:center;flex-direction:row}