@situaction/traq-ui-ste 1.2.4 → 1.2.6

package/dist/components/select/Select.js

@@ -1,13 +1,13 @@
-import { jsxs as w, jsx as r } from "react/jsx-runtime";
-import { useState as b, useRef as m, useEffect as p } from "react";
-import { Button as W } from "../button/Button.js";
-import { Input as H } from "../input/Input.js";
-import { IconButton as I } from "../icon-button/IconButton.js";
+import { jsxs as b, jsx as r } from "react/jsx-runtime";
+import { useState as p, useRef as m, useEffect as v } from "react";
+import { Button as B } from "../button/Button.js";
+import { Input as G } from "../input/Input.js";
+import { IconButton as H } from "../icon-button/IconButton.js";
 import { Icon as _ } from "../icon/Icon.js";
 import { Modal as J } from "../modal/Modal.js";
 import "../theme/ThemeContext.js";
 import '../../styles/Size.css';import '../../styles/Select.css';/* empty css                   */
-const O = "_selectContainer_133eb_54", Q = "_selected_133eb_57", X = "_children_133eb_61", Y = "_active_133eb_78", Z = "_selectList_133eb_82", ee = "_modal_133eb_91", te = "_dropdownFadeIn_133eb_1", ne = "_itemLabel_133eb_98", re = "_searchWrapper_133eb_103", oe = "_noResults_133eb_109", u = {
+const O = "_selectContainer_133eb_54", Q = "_selected_133eb_57", X = "_children_133eb_61", Y = "_active_133eb_78", Z = "_selectList_133eb_82", ee = "_modal_133eb_91", te = "_dropdownFadeIn_133eb_1", ne = "_itemLabel_133eb_98", re = "_searchWrapper_133eb_103", oe = "_noResults_133eb_109", i = {
   selectContainer: O,
   selected: Q,
   children: X,
@@ -21,131 +21,131 @@ const O = "_selectContainer_133eb_54", Q = "_selected_133eb_57", X = "_children_
 }, me = ({
   selected: L,
   size: C = "m",
-  listItem: s,
+  listItem: u,
   modeDisplay: x = "all",
-  onSelect: B,
+  onSelect: F,
   positionOverride: y,
-  placeholder: F = "Sélectionner",
-  searchPlaceholder: U,
-  autoCloseCondition: V,
-  searchable: z = !1,
+  placeholder: k = "Sélectionner",
+  searchPlaceholder: j,
+  autoCloseCondition: U,
+  searchable: V = !1,
   fullWidth: S = !1
 }) => {
-  const [t, f] = b(!1), A = m(null), [M, P] = b({
+  const [t, f] = p(!1), z = m(null), [A, P] = p({
     top: "calc(100% + 6px)",
     left: "0px"
-  }), [c, k] = b(L ?? null), [$, q] = b("");
-  p(() => {
-    L ? k(L) : s.length > 0 ? k(s[0]) : k(null);
-  }, [L, s]), p(() => {
+  }), [o, E] = p(L ?? null), [$, M] = p("");
+  v(() => {
+    E(L || null);
+  }, [L]), v(() => {
     y && P(y);
   }, [y]);
-  const D = (e) => {
-    k(e), f(!1), B && B(e);
-  }, G = () => {
-    const e = c == null ? void 0 : c.icon, o = (c == null ? void 0 : c.label) || F || "Sélectionner";
-    return x === "icon" && e ? /* @__PURE__ */ r(I, { ref: d, mode: "tertiary", size: C, onClick: () => f(!t), children: /* @__PURE__ */ r(_, { icon: c.icon }) }) : x === "text" ? /* @__PURE__ */ r(
-      W,
+  const q = (e) => {
+    E(e), f(!1), F && F(e);
+  }, D = () => {
+    const e = o == null ? void 0 : o.icon, s = (o == null ? void 0 : o.label) ?? k;
+    return x === "icon" && e ? /* @__PURE__ */ r(H, { ref: d, mode: "tertiary", size: C, onClick: () => f(!t), children: /* @__PURE__ */ r(_, { icon: o.icon }) }) : x === "text" ? /* @__PURE__ */ r(
+      B,
       {
         ref: d,
         mode: "tertiary",
-        label: o,
+        label: o ? s : k,
         childrenRight: /* @__PURE__ */ r(_, { icon: t ? "CaretUp" : "CaretDown", size: 14, weight: "bold" }),
         size: C,
         fullWidth: S,
         onClick: () => f(!t)
       }
     ) : x === "all" ? /* @__PURE__ */ r(
-      W,
+      B,
       {
         ref: d,
         mode: "tertiary",
-        label: o,
+        label: o ? s : k,
         size: C,
         fullWidth: S,
-        childrenLeft: e && /* @__PURE__ */ r(_, { icon: c.icon }),
+        childrenLeft: e && /* @__PURE__ */ r(_, { icon: o.icon }),
         childrenRight: /* @__PURE__ */ r(_, { icon: t ? "CaretUp" : "CaretDown", size: 14, weight: "bold" }),
         onClick: () => f(!t)
       }
     ) : /* @__PURE__ */ r(
-      W,
+      B,
       {
         ref: d,
         mode: "tertiary",
         fullWidth: S,
-        label: F ?? "Sélectionner",
+        label: k ?? "Sélectionner",
         size: C,
         onClick: () => f(!t)
       }
     );
-  }, E = m(null), g = m({}), [R, v] = b(""), h = m(null), K = m({}), j = s.filter(
+  }, N = m(null), g = m({}), [R, w] = p(""), h = m(null), I = m({}), K = u.filter(
     (e) => String(e.label ?? "").toLowerCase().includes($.toLowerCase())
-  ), N = (e) => {
+  ), W = (e) => {
     if (!t) return;
-    const o = e.key.length === 1 ? e.key.toLowerCase() : "";
-    if (!o) return;
-    const a = R + o;
-    v(a);
-    const i = s.find((n) => {
-      var l;
-      return (l = n.label) == null ? void 0 : l.toLowerCase().startsWith(a);
+    const s = e.key.length === 1 ? e.key.toLowerCase() : "";
+    if (!s) return;
+    const l = R + s;
+    w(l);
+    const a = u.find((n) => {
+      var c;
+      return (c = n.label) == null ? void 0 : c.toLowerCase().startsWith(l);
     });
-    if (i) {
-      const n = g.current[i.value];
+    if (a) {
+      const n = g.current[a.value];
       n == null || n.scrollIntoView({ behavior: "smooth", block: "nearest" });
     }
     h.current && clearTimeout(h.current), h.current = setTimeout(() => {
-      v("");
+      w("");
     }, 500);
   };
-  p(() => (t ? window.addEventListener("keydown", N) : (window.removeEventListener("keydown", N), v("")), () => {
-    window.removeEventListener("keydown", N);
-  }), [t, R, s]), p(() => {
-    const e = (o) => {
+  v(() => (t ? window.addEventListener("keydown", W) : (window.removeEventListener("keydown", W), w("")), () => {
+    window.removeEventListener("keydown", W);
+  }), [t, R, u]), v(() => {
+    const e = (s) => {
       if (!t) return;
-      const a = o.key.length === 1 ? o.key.toLowerCase() : "";
-      if (!a) return;
-      const i = R + a;
-      v(i);
-      const n = s.find(
-        (l) => {
+      const l = s.key.length === 1 ? s.key.toLowerCase() : "";
+      if (!l) return;
+      const a = R + l;
+      w(a);
+      const n = u.find(
+        (c) => {
           var T;
-          return (T = l.label) == null ? void 0 : T.toLowerCase().startsWith(i);
+          return (T = c.label) == null ? void 0 : T.toLowerCase().startsWith(a);
         }
       );
-      if (n && E.current && n.value in g.current && g.current[n.value]) {
-        const l = E.current, T = g.current[n.value];
-        l.scrollTo({
-          top: T.offsetTop - l.offsetTop,
+      if (n && N.current && n.value in g.current && g.current[n.value]) {
+        const c = N.current, T = g.current[n.value];
+        c.scrollTo({
+          top: T.offsetTop - c.offsetTop,
           behavior: "smooth"
         });
       }
       h.current && clearTimeout(h.current), h.current = setTimeout(() => {
-        v("");
+        w("");
       }, 700);
     };
     return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
-  }, [t, s, R]), p(() => {
+  }, [t, u, R]), v(() => {
     if (!t) return;
-    const e = (o) => {
-      const a = o.key.toLowerCase();
-      if (a.length === 1) {
-        const i = s.find(
+    const e = (s) => {
+      const l = s.key.toLowerCase();
+      if (l.length === 1) {
+        const a = u.find(
           (n) => {
-            var l;
-            return (l = n.label) == null ? void 0 : l.toLowerCase().startsWith(a);
+            var c;
+            return (c = n.label) == null ? void 0 : c.toLowerCase().startsWith(l);
           }
         );
-        if (i) {
-          const n = K.current[i.value];
+        if (a) {
+          const n = I.current[a.value];
           n && n.scrollIntoView({ block: "start", behavior: "smooth" });
         }
       }
     };
     return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
-  }, [t, s]);
+  }, [t, u]);
   const d = m(null);
-  return p(() => {
+  return v(() => {
     if (t && d.current) {
       const e = d.current.getBoundingClientRect().height;
       P(y || {
@@ -153,49 +153,49 @@ const O = "_selectContainer_133eb_54", Q = "_selected_133eb_57", X = "_children_
         left: "0px"
       });
     }
-  }, [t]), /* @__PURE__ */ w("div", { className: u.selectContainer, children: [
-    G(),
+  }, [t]), /* @__PURE__ */ b("div", { className: i.selectContainer, children: [
+    D(),
     /* @__PURE__ */ r(
       J,
       {
-        ref: A,
+        ref: z,
         anchorRef: d,
         open: t,
         onClose: () => f(!1),
-        position: M,
+        position: A,
         disableOverlay: !0,
-        className: u.modal,
-        autoCloseCondition: V,
-        children: /* @__PURE__ */ w("div", { children: [
-          z && /* @__PURE__ */ w("div", { children: [
+        className: i.modal,
+        autoCloseCondition: U,
+        children: /* @__PURE__ */ b("div", { children: [
+          V && /* @__PURE__ */ b("div", { children: [
             /* @__PURE__ */ r(
-              H,
+              G,
               {
                 type: "text",
-                placeholder: U,
+                placeholder: j,
                 status: "ghost",
                 sizeStyle: "s",
                 value: $,
-                onChange: (e) => q(e.target.value)
+                onChange: (e) => M(e.target.value)
               }
             ),
-            /* @__PURE__ */ r("div", { className: u.searchWrapper })
+            /* @__PURE__ */ r("div", { className: i.searchWrapper })
           ] }),
-          /* @__PURE__ */ w("div", { className: u.selectList, ref: E, children: [
-            j.map((e) => /* @__PURE__ */ w(
+          /* @__PURE__ */ b("div", { className: i.selectList, ref: N, children: [
+            K.map((e) => /* @__PURE__ */ b(
               "div",
               {
-                ref: (o) => K.current[e.value] = o,
-                className: `${u.children} ${(c == null ? void 0 : c.value) === e.value ? u.active : ""}`,
-                onClick: () => D(e),
+                ref: (s) => I.current[e.value] = s,
+                className: `${i.children} ${(o == null ? void 0 : o.value) === e.value ? i.active : ""}`,
+                onClick: () => q(e),
                 children: [
                   e.icon && /* @__PURE__ */ r(_, { icon: e.icon, size: 16 }),
-                  e.label && /* @__PURE__ */ r("div", { className: u.itemLabel, children: e.label })
+                  e.label && /* @__PURE__ */ r("div", { className: i.itemLabel, children: e.label })
                 ]
               },
               e.value
             )),
-            j.length === 0 && /* @__PURE__ */ r("div", { className: `${u.noResults} textSmall`, children: "Aucun résultat" })
+            K.length === 0 && /* @__PURE__ */ r("div", { className: `${i.noResults} textSmall`, children: "Aucun résultat" })
           ] })
         ] })
       }

package/dist/components/tooltip/Tooltip.js

@@ -1,15 +1,15 @@
-import { jsxs as g, jsx as d } from "react/jsx-runtime";
-import { useState as h } from "react";
-import '../../styles/Tooltip.css';const y = "_tooltip_7qhvn_30", s = {
-  "tooltip-container": "_tooltip-container_7qhvn_30",
+import { jsxs as g, jsx as b } from "react/jsx-runtime";
+import { useState as d } from "react";
+import '../../styles/Tooltip.css';const y = "_tooltip_19b26_30", s = {
+  "tooltip-container": "_tooltip-container_19b26_30",
   tooltip: y
-}, _ = ({ children: l, content: n, position: a = "top", gap: i = "xs-5", padding: r = "xs-5" }) => {
-  const [p, o] = h(!1), c = [
+}, _ = ({ children: l, content: a, position: i = "top", gap: n = "xs-5", padding: r = "xs-5" }) => {
+  const [p, o] = d(!1), c = [
     s.tooltip,
     "labelMedium",
     "fontWeight-600"
   ].filter(Boolean).join(" "), m = {
-    "--dynamic-gap": `var(--spacing-${i})`,
+    "--dynamic-gap": `var(--spacing-${n})`,
     "--dynamic-padding": `var(--spacing-${r})`
   }, f = () => {
     const t = "calc(100% + var(--dynamic-gap))", e = {
@@ -22,7 +22,7 @@ import '../../styles/Tooltip.css';const y = "_tooltip_7qhvn_30", s = {
       left: { top: "50%", right: t, transform: "translateY(-50%)" },
       right: { top: "50%", left: t, transform: "translateY(-50%)" }
     };
-    return { ...e[a] || e.top };
+    return { ...e[i] || e.top };
   };
   return /* @__PURE__ */ g(
     "div",
@@ -33,7 +33,7 @@ import '../../styles/Tooltip.css';const y = "_tooltip_7qhvn_30", s = {
       onMouseLeave: () => o(!1),
       children: [
         l,
-        p && /* @__PURE__ */ d("div", { className: c, style: f(), children: n })
+        p && /* @__PURE__ */ b("div", { className: c, style: f(), children: a })
       ]
     }
   );

package/dist/styles/Tooltip.css

@@ -1 +1 @@
-._tooltip-container_7qhvn_30{position:relative;width:auto;height:auto;display:flex;justify-content:center;align-items:center;cursor:pointer}._tooltip-container_7qhvn_30 ._tooltip_7qhvn_30{position:absolute;padding:var(--dynamic-padding);border:1px solid var(--general-border-window);border-radius:.5rem;font-size:12px;white-space:nowrap;z-index:10;opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s;background-color:var(--background-tooltip);box-shadow:0 4px 5px 0 var(--shadow-color-minimal);color:var(--general-text-icons)}._tooltip-container_7qhvn_30:hover ._tooltip_7qhvn_30{opacity:1;visibility:visible}
+._tooltip-container_19b26_30{position:relative;width:100%;height:auto;display:flex;justify-content:center;align-items:center;cursor:pointer}._tooltip-container_19b26_30 ._tooltip_19b26_30{position:absolute;padding:var(--dynamic-padding);border:1px solid var(--general-border-window);border-radius:.5rem;font-size:12px;white-space:nowrap;z-index:10;opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s;background-color:var(--background-tooltip);box-shadow:0 4px 5px 0 var(--shadow-color-minimal);color:var(--general-text-icons)}._tooltip-container_19b26_30:hover ._tooltip_19b26_30{opacity:1;visibility:visible}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@situaction/traq-ui-ste",
-  "version": "1.2.4",
+  "version": "1.2.6",
   "description": "library react component Situaction",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",