impact-nova 1.6.2 → 1.6.3

package/dist/components/ui/filter-strip/filter-summary.js

@@ -1,85 +1,86 @@
-import { jsxs as a, jsx as e, Fragment as U } from "react/jsx-runtime";
-import * as n from "react";
-import { ChevronDown as W, Search as X, Trash2 as Z, Pencil as _, Star as ee } from "lucide-react";
-import { cn as c } from "../../../lib/utils.js";
-import { Popover as te, PopoverTrigger as le, PopoverContent as ae } from "../popover.js";
-import { Tooltip as d, TooltipTrigger as p, TooltipContent as h } from "../tooltip.js";
-import { Button as M } from "../button.js";
-import { Separator as I } from "../separator.js";
-import { Tabs as re, TabsList as ie, TabsTrigger as j } from "../tabs.js";
-import { Input as ne } from "../input.js";
-import { Badge as se } from "../badge.js";
-import { Skeleton as oe } from "../skeleton.js";
-import { useImpactNovaI18n as ce } from "../../../i18n/ImpactNovaI18nContext.js";
-const Ce = ({
-  selectedFilter: m,
-  onSelectedFilterChange: O,
-  savedFilters: $,
-  recentFilters: C,
-  onApplySavedFilter: B,
-  onSavedFilterSearch: v,
-  onSavedFiltersScroll: D,
-  onDropdownOpenChange: G,
-  isLoadingFilterPreferencesList: L = !1,
-  onEditSavedFilter: S,
-  onDeleteSavedFilter: w,
-  onSetDefaultSavedFilter: k
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import * as s from "react";
+import { ChevronDown as F, Search as V } from "lucide-react";
+import { cn as b } from "../../../lib/utils.js";
+import { Popover as Y, PopoverTrigger as q, PopoverContent as H } from "../popover.js";
+import { Tooltip as v, TooltipTrigger as g, TooltipContent as y } from "../tooltip.js";
+import { Button as S } from "../button.js";
+import { Separator as w } from "../separator.js";
+import { Tabs as J, TabsList as K, TabsTrigger as N } from "../tabs.js";
+import { Input as U } from "../input.js";
+import { Badge as W } from "../badge.js";
+import { Skeleton as X } from "../skeleton.js";
+import { useImpactNovaI18n as Z } from "../../../i18n/ImpactNovaI18nContext.js";
+const he = ({
+  selectedFilter: c,
+  onSelectedFilterChange: C,
+  savedFilters: T,
+  recentFilters: m,
+  onApplySavedFilter: k,
+  onSavedFilterSearch: p,
+  onSavedFiltersScroll: P,
+  onDropdownOpenChange: A,
+  isLoadingFilterPreferencesList: j = !1,
+  onEditSavedFilter: $,
+  onDeleteSavedFilter: ee,
+  onSetDefaultSavedFilter: te
 }) => {
-  const { t: r } = ce(), [g, T] = n.useState(!1), Q = (l) => {
-    T(l), G?.(l);
-  }, [P, E] = n.useState(""), [u, F] = n.useState(""), [i, R] = n.useState("All"), [s, A] = n.useState(null);
-  n.useEffect(() => {
-    const l = setTimeout(() => {
-      F(P);
+  const { t: r } = Z(), [d, h] = s.useState(!1), I = (a) => {
+    h(a), A?.(a);
+  }, [u, M] = s.useState(""), [f, O] = s.useState(""), [n, D] = s.useState("All"), [i, x] = s.useState(null);
+  s.useEffect(() => {
+    const a = setTimeout(() => {
+      O(u);
     }, 300);
-    return () => clearTimeout(l);
-  }, [P]), n.useEffect(() => {
-    v && v(
-      u,
-      i === "All" ? void 0 : i
+    return () => clearTimeout(a);
+  }, [u]), s.useEffect(() => {
+    p && p(
+      f,
+      n === "All" ? void 0 : n
     );
-  }, [u, i, v]), n.useEffect(() => {
-    g && A({ label: m });
-  }, [g, m]);
-  const z = (l) => {
-    E(l.target.value);
-  }, V = () => {
-    s && (O?.(s.label), s.savedItem && B?.(s.savedItem), T(!1));
-  }, Y = () => {
-    T(!1);
-  }, q = () => !C || C.length === 0 ? null : /* @__PURE__ */ a("div", { className: "flex flex-col", children: [
-    /* @__PURE__ */ e("div", { className: "px-1 py-[6px] text-xs font-medium text-content-tertiary font-['Manrope']", children: "Recent" }),
-    /* @__PURE__ */ e("div", { className: "mb-[6px] flex flex-col", children: C.map((l, f) => {
-      const o = l.map((y) => y.label).join(", "), x = s?.label === o;
+  }, [f, n, p]), s.useEffect(() => {
+    d && x({ label: c });
+  }, [d, c]);
+  const E = (a) => {
+    M(a.target.value);
+  }, G = () => {
+    i && (C?.(i.label), i.savedItem && k?.(i.savedItem), h(!1));
+  }, L = () => {
+    h(!1);
+  }, Q = () => !m || m.length === 0 ? null : /* @__PURE__ */ l("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ e("div", { className: "px-1 py-[6px] text-xs font-medium text-[#60697d] font-['Manrope']", children: "Recent" }),
+    /* @__PURE__ */ e("div", { className: "mb-[6px] flex flex-col", children: m.map((a, t) => {
+      const o = a.map((z) => z.label).join(", "), B = i?.label === o;
       return /* @__PURE__ */ e(
-        "div",
+        "button",
         {
-          className: c(
-            "flex cursor-pointer flex-row px-3 py-2 rounded-lg hover:bg-canvas-muted",
-            x && "bg-brand-highlight"
+          type: "button",
+          className: b(
+            "flex cursor-pointer flex-row px-3 py-2 rounded-lg hover:bg-[#f5f6fa] w-full text-left bg-transparent border-none",
+            B && "bg-[#edf0ff]"
           ),
-          onClick: () => A({ label: o }),
-          children: /* @__PURE__ */ a(d, { children: [
-            /* @__PURE__ */ e(p, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "text-sm font-['Manrope'] truncate text-content", children: o }) }),
-            /* @__PURE__ */ e(h, { variant: "tertiary", side: "right", children: o })
+          onClick: () => x({ label: o }),
+          children: /* @__PURE__ */ l(v, { children: [
+            /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "text-sm font-['Manrope'] truncate text-[#1f2b4d]", children: o }) }),
+            /* @__PURE__ */ e(y, { variant: "tertiary", side: "right", children: o })
           ] })
         },
-        f
+        t
       );
     }) }),
-    /* @__PURE__ */ e(I, { className: "mb-2" })
-  ] }), H = () => {
-    if (L)
-      return /* @__PURE__ */ e("div", { className: "flex max-h-[160px] flex-col overflow-y-auto px-3 py-2 space-y-2", children: [1, 2, 3, 4, 5].map((t) => /* @__PURE__ */ e(oe, { className: "h-9 w-full rounded-lg" }, t)) });
-    let l = $?.filter(
-      (t) => i === "All" || t.type === i
+    /* @__PURE__ */ e(w, { className: "mb-2" })
+  ] }), _ = () => {
+    if (j)
+      return /* @__PURE__ */ e("div", { className: "flex max-h-[160px] flex-col overflow-y-auto px-3 py-2 space-y-2", children: [1, 2, 3, 4, 5].map((t) => /* @__PURE__ */ e(X, { className: "h-9 w-full rounded-lg" }, t)) });
+    let a = T?.filter(
+      (t) => n === "All" || t.type === n
     );
-    if (!v && u && (l = l?.filter(
-      (t) => t.label.toLowerCase().includes(u.toLowerCase())
-    )), !l || l.length === 0) {
+    if (!p && f && (a = a?.filter(
+      (t) => t.label.toLowerCase().includes(f.toLowerCase())
+    )), !a || a.length === 0) {
       let t = "No saved filters found";
-      if (!!u)
-        switch (i) {
+      if (!!f)
+        switch (n) {
           case "Personal":
             t = "No personal filters match your search";
             break;
@@ -90,7 +91,7 @@ const Ce = ({
             t = "No saved filters match your search";
         }
       else
-        switch (i) {
+        switch (n) {
           case "Personal":
             t = "You haven't created any personal filters yet.";
             break;
@@ -100,194 +101,120 @@ const Ce = ({
           default:
             t = "No filters have been saved yet.";
         }
-      return /* @__PURE__ */ e("div", { className: "flex flex-col items-center justify-center py-8 text-center min-h-[100px] px-6", children: /* @__PURE__ */ e("span", { className: "text-sm text-content-tertiary font-['Manrope'] leading-relaxed", children: t }) });
+      return /* @__PURE__ */ e("div", { className: "flex flex-col items-center justify-center py-8 text-center min-h-[100px] px-6", children: /* @__PURE__ */ e("span", { className: "text-sm text-[#60697d] font-['Manrope'] leading-relaxed", children: t }) });
     }
-    const f = S || w || k, o = l.find((t) => t.isDefault), x = l.filter((t) => !t.isDefault), y = (t, N = !1) => {
-      const K = s?.label === t.label;
-      return /* @__PURE__ */ a(
-        "div",
-        {
-          className: c(
-            "group mb-1 flex items-center justify-between cursor-pointer rounded-lg px-3 py-2 text-sm font-medium font-['Manrope'] hover:bg-[#f5f6fa]",
-            K ? "bg-[#edf0ff]" : "text-[#1f2b4d]"
-          ),
-          onClick: () => A({ label: t.label, savedItem: t }),
-          children: [
-            /* @__PURE__ */ a(d, { children: [
-              /* @__PURE__ */ e(p, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "truncate flex-1 min-w-0", children: t.label }) }),
-              /* @__PURE__ */ e(h, { variant: "tertiary", side: "right", children: t.label })
-            ] }),
-            f && /* @__PURE__ */ a(
-              "div",
+    return /* @__PURE__ */ e(
+      "div",
+      {
+        className: "flex max-h-[160px] flex-col overflow-y-auto",
+        onScroll: P,
+        children: a.map((t) => {
+          const o = i?.label === t.label;
+          return /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              className: b(
+                "mb-1 flex justify-between cursor-pointer rounded-lg px-3 py-2 text-sm font-medium font-['Manrope'] hover:bg-[#f5f6fa] w-full text-left bg-transparent border-none",
+                o ? "bg-[#edf0ff]" : "text-[#1f2b4d]"
+              ),
+              onClick: () => x({ label: t.label, savedItem: t }),
+              children: /* @__PURE__ */ l(v, { children: [
+                /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "truncate", children: t.label }) }),
+                /* @__PURE__ */ e(y, { variant: "tertiary", side: "right", children: t.label })
+              ] })
+            },
+            t.id
+          );
+        })
+      }
+    );
+  }, R = i?.label !== c;
+  return /* @__PURE__ */ l(Y, { open: d, onOpenChange: I, children: [
+    /* @__PURE__ */ e(q, { asChild: !0, children: /* @__PURE__ */ l(
+      "button",
+      {
+        type: "button",
+        className: "flex cursor-pointer items-center gap-2 bg-transparent border-none p-0",
+        "aria-label": r("filterStrip.selectFilter"),
+        "aria-expanded": d,
+        "aria-haspopup": "dialog",
+        children: [
+          /* @__PURE__ */ e("span", { className: "text-sm font-medium text-[#60697d] font-['Manrope']", children: r("filterStrip.filtersApplied") }),
+          /* @__PURE__ */ l(v, { children: [
+            /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ e(
+              W,
               {
-                className: c(
-                  "flex items-center gap-1 ml-2 transition-opacity shrink-0",
-                  N ? "opacity-100" : "opacity-0 group-hover:opacity-100"
-                ),
-                children: [
-                  w && /* @__PURE__ */ a(d, { children: [
-                    /* @__PURE__ */ e(p, { asChild: !0, children: /* @__PURE__ */ e(
-                      "button",
-                      {
-                        type: "button",
-                        "aria-label": `${r("filterStrip.deleteFilter")} ${t.label}`,
-                        className: c(
-                          "p-1 rounded transition-colors",
-                          N ? "opacity-0 group-hover:opacity-100" : "hover:bg-[#e6e8f0]"
-                        ),
-                        onClick: (b) => {
-                          b.stopPropagation(), w(t);
-                        },
-                        children: /* @__PURE__ */ e(Z, { className: "h-3.5 w-3.5 text-[#60697d]" })
-                      }
-                    ) }),
-                    /* @__PURE__ */ e(h, { variant: "tertiary", side: "top", children: r("filterStrip.deleteFilter") })
-                  ] }),
-                  S && /* @__PURE__ */ a(d, { children: [
-                    /* @__PURE__ */ e(p, { asChild: !0, children: /* @__PURE__ */ e(
-                      "button",
-                      {
-                        type: "button",
-                        "aria-label": `${r("filterStrip.editFilter")} ${t.label}`,
-                        className: c(
-                          "p-1 rounded transition-colors",
-                          N ? "opacity-0 group-hover:opacity-100" : "hover:bg-[#e6e8f0]"
-                        ),
-                        onClick: (b) => {
-                          b.stopPropagation(), S(t);
-                        },
-                        children: /* @__PURE__ */ e(_, { className: "h-3.5 w-3.5 text-[#60697d]" })
-                      }
-                    ) }),
-                    /* @__PURE__ */ e(h, { variant: "tertiary", side: "top", children: r("filterStrip.editFilter") })
-                  ] }),
-                  k && /* @__PURE__ */ a(d, { children: [
-                    /* @__PURE__ */ e(p, { asChild: !0, children: /* @__PURE__ */ e(
-                      "button",
-                      {
-                        type: "button",
-                        "aria-label": `${t.isDefault ? r("filterStrip.defaultFilter") : r("filterStrip.setAsDefault")} ${t.label}`,
-                        className: "p-1 rounded hover:bg-[#e6e8f0] transition-colors",
-                        onClick: (b) => {
-                          b.stopPropagation(), k(t);
-                        },
-                        children: /* @__PURE__ */ e(
-                          ee,
-                          {
-                            className: c(
-                              "h-3.5 w-3.5",
-                              t.isDefault ? "text-[#E1BC29] fill-[#E1BC29]" : "text-[#60697d]"
-                            )
-                          }
-                        )
-                      }
-                    ) }),
-                    /* @__PURE__ */ e(h, { variant: "tertiary", side: "top", children: t.isDefault ? r("filterStrip.defaultFilter") : r("filterStrip.setAsDefault") })
-                  ] })
-                ]
+                color: "primary",
+                variant: "outline",
+                className: "font-['Manrope'] max-w-[140px]",
+                children: c || r("filterStrip.notSelected")
               }
-            )
-          ]
-        },
-        t.id
-      );
-    };
-    return /* @__PURE__ */ a("div", { className: "flex flex-col", children: [
-      o && /* @__PURE__ */ a(U, { children: [
-        y(o, !0),
-        x.length > 0 && /* @__PURE__ */ e(I, { className: "my-1" })
-      ] }),
-      x.length > 0 && /* @__PURE__ */ e(
-        "div",
-        {
-          className: "flex max-h-[160px] flex-col overflow-y-auto",
-          onScroll: D,
-          children: x.map((t) => y(t, !1))
-        }
-      )
-    ] });
-  }, J = s?.label !== m;
-  return /* @__PURE__ */ a(te, { open: g, onOpenChange: Q, children: [
-    /* @__PURE__ */ e(le, { asChild: !0, children: /* @__PURE__ */ a("div", { className: "flex cursor-pointer items-center gap-2", children: [
-      /* @__PURE__ */ e("span", { className: "text-sm font-medium text-content-tertiary font-['Manrope']", children: r("filterStrip.filtersApplied") }),
-      /* @__PURE__ */ a(d, { children: [
-        /* @__PURE__ */ e(p, { asChild: !0, children: /* @__PURE__ */ e(
-          se,
-          {
-            color: "primary",
-            variant: "outline",
-            className: "font-['Manrope'] max-w-[140px] inline-block",
-            children: /* @__PURE__ */ e("span", { className: "block truncate", children: m || r("filterStrip.notSelected") })
-          }
-        ) }),
-        /* @__PURE__ */ e(h, { variant: "tertiary", side: "top", children: m || r("filterStrip.notSelected") })
-      ] }),
-      /* @__PURE__ */ a(d, { children: [
-        /* @__PURE__ */ e(p, { asChild: !0, children: /* @__PURE__ */ e(
-          "div",
-          {
-            className: c(
-              "flex h-8 w-8 items-center justify-center rounded-lg bg-canvas-muted transition-transform duration-200",
-              g && "rotate-180"
-            ),
-            children: /* @__PURE__ */ e(W, { className: "h-4 w-4 text-content" })
-          }
-        ) }),
-        /* @__PURE__ */ e(h, { variant: "tertiary", side: "top", children: r("filterStrip.selectFilter") })
-      ] })
-    ] }) }),
+            ) }),
+            /* @__PURE__ */ e(y, { variant: "tertiary", side: "top", children: c || r("filterStrip.notSelected") })
+          ] }),
+          /* @__PURE__ */ e(
+            "div",
+            {
+              className: b(
+                "flex h-8 w-8 items-center justify-center rounded-lg bg-[#f5f6fa] transition-transform duration-200",
+                d && "rotate-180"
+              ),
+              "aria-hidden": "true",
+              children: /* @__PURE__ */ e(F, { className: "h-4 w-4 text-[#1f2b4d]" })
+            }
+          )
+        ]
+      }
+    ) }),
     /* @__PURE__ */ e(
-      ae,
+      H,
       {
         align: "start",
-        className: "w-[280px] p-0 shadow-elevation-floating",
+        className: "w-[280px] p-0 shadow-[0_0_4px_0_rgba(0,0,0,0.12)]",
         sideOffset: 8,
-        onInteractOutside: (l) => {
-          const f = l.target;
-          (f.closest('[role="dialog"]') || f.closest("[data-radix-dialog-content]")) && l.preventDefault();
-        },
-        children: /* @__PURE__ */ a("div", { className: "flex w-full flex-col py-[8px] px-[6px]", children: [
-          q(),
-          /* @__PURE__ */ a("div", { className: "flex flex-col", children: [
-            /* @__PURE__ */ e("div", { className: "px-1 py-[6px] text-xs font-medium text-content-tertiary font-['Manrope']", children: r("filterStrip.savedFilters") }),
-            /* @__PURE__ */ a(
-              re,
+        children: /* @__PURE__ */ l("div", { className: "flex w-full flex-col py-[8px] px-[6px]", children: [
+          Q(),
+          /* @__PURE__ */ l("div", { className: "flex flex-col", children: [
+            /* @__PURE__ */ e("div", { className: "px-1 py-[6px] text-xs font-medium text-[#60697d] font-['Manrope']", children: r("filterStrip.savedFilters") }),
+            /* @__PURE__ */ l(
+              J,
               {
-                value: i,
-                onValueChange: (l) => R(l),
+                value: n,
+                onValueChange: (a) => D(a),
                 variant: "outline",
                 size: "sm",
                 className: "w-full px-1",
                 children: [
-                  /* @__PURE__ */ e("div", { className: "py-[8px]", children: /* @__PURE__ */ a(ie, { children: [
-                    /* @__PURE__ */ e(j, { value: "All", children: "All" }),
-                    /* @__PURE__ */ e(j, { value: "Global", children: "Global" }),
-                    /* @__PURE__ */ e(j, { value: "Personal", children: "Personal" })
+                  /* @__PURE__ */ e("div", { className: "py-[8px]", children: /* @__PURE__ */ l(K, { children: [
+                    /* @__PURE__ */ e(N, { value: "All", children: "All" }),
+                    /* @__PURE__ */ e(N, { value: "Global", children: "Global" }),
+                    /* @__PURE__ */ e(N, { value: "Personal", children: "Personal" })
                   ] }) }),
                   /* @__PURE__ */ e("div", { className: "pb-[8px]", children: /* @__PURE__ */ e(
-                    ne,
+                    U,
                     {
-                      prefix: /* @__PURE__ */ e(X, { className: "h-4 w-4 text-content-muted" }),
+                      prefix: /* @__PURE__ */ e(V, { className: "h-4 w-4 text-gray-500" }),
                       placeholder: r("filterStrip.searchFiltersPlaceholder"),
-                      value: P,
-                      onChange: z,
+                      value: u,
+                      onChange: E,
                       className: "h-9 px-1 border-none shadow-none focus-visible:ring-0"
                     }
                   ) }),
-                  /* @__PURE__ */ e("div", { className: "mt-0", children: H() })
+                  /* @__PURE__ */ e("div", { className: "mt-0", children: _() })
                 ]
               }
             )
           ] }),
-          /* @__PURE__ */ e(I, { className: "my-2" }),
-          /* @__PURE__ */ a("div", { className: "flex justify-end gap-2 px-3 pb-1", children: [
-            /* @__PURE__ */ e(M, { variant: "secondary", onClick: Y, children: r("prompt.cancel") }),
+          /* @__PURE__ */ e(w, { className: "my-2" }),
+          /* @__PURE__ */ l("div", { className: "flex justify-end gap-2 px-3 pb-1", children: [
+            /* @__PURE__ */ e(S, { variant: "secondary", onClick: L, children: r("prompt.cancel") }),
             /* @__PURE__ */ e(
-              M,
+              S,
               {
                 variant: "default",
-                onClick: V,
-                disabled: !J,
+                onClick: G,
+                disabled: !R,
                 children: r("filterStrip.applyFilter")
               }
             )
@@ -298,5 +225,5 @@ const Ce = ({
   ] });
 };
 export {
-  Ce as FilterSummary
+  he as FilterSummary
 };