impact-nova 1.3.0 → 1.5.2

package/dist/components/ui/filter-panel/filter-panel.js

@@ -1,123 +1,127 @@
 import { jsx as e, jsxs as t } from "react/jsx-runtime";
-import u from "react";
-import { Sheet as b, SheetContent as v, SheetDescription as g, SheetTitle as w, SheetClose as y } from "../sheet.js";
+import b from "react";
+import { Sheet as v, SheetContent as g, SheetDescription as w, SheetTitle as y, SheetClose as N } from "../sheet.js";
 import { cn as n } from "../../../lib/utils.js";
-import { MultiColorFilter as N, Cross as C, Info as p } from "../../../icons/index.js";
-import { Button as F } from "../button.js";
-import { Tooltip as c, TooltipTrigger as o, TooltipContent as d } from "../tooltip.js";
-const j = ({ title: a, children: l, className: i }) => /* @__PURE__ */ t("div", { "data-component": "filter-panel-header", className: n("flex  shrink-0 flex-row items-center justify-between border-b px-4 py-3 bg-white", i), children: [
-  /* @__PURE__ */ t("div", { className: "flex items-center gap-3", children: [
-    /* @__PURE__ */ e("div", { className: "flex h-6 w-6 items-center justify-center", children: /* @__PURE__ */ e(N, { className: "h-5 w-5" }) }),
-    /* @__PURE__ */ e(w, { className: "text-lg font-bold text-[#1f2b4d]", children: a })
-  ] }),
-  /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
-    l,
-    /* @__PURE__ */ e(y, { asChild: !0, children: /* @__PURE__ */ e(F, { variant: "secondary", size: "icon", "aria-label": "Close", "data-component": "filter-panel-close", children: /* @__PURE__ */ e(C, { className: "h-3 w-3" }) }) })
-  ] })
-] }), E = ({
-  open: a,
-  onOpenChange: l,
+import { MultiColorFilter as C, Cross as F, Info as m } from "../../../icons/index.js";
+import { Button as P } from "../button.js";
+import { Tooltip as d, TooltipTrigger as h, TooltipContent as f } from "../tooltip.js";
+import { useImpactNovaI18n as u } from "../../../i18n/ImpactNovaI18nContext.js";
+const j = ({ title: l, children: a, className: i }) => {
+  const { t: c } = u();
+  return /* @__PURE__ */ t("div", { "data-component": "filter-panel-header", className: n("flex  shrink-0 flex-row items-center justify-between border-b px-4 py-3 bg-white", i), children: [
+    /* @__PURE__ */ t("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ e("div", { className: "flex h-6 w-6 items-center justify-center", children: /* @__PURE__ */ e(C, { className: "h-5 w-5" }) }),
+      /* @__PURE__ */ e(y, { className: "text-lg font-bold text-[#1f2b4d]", children: l })
+    ] }),
+    /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+      a,
+      /* @__PURE__ */ e(N, { asChild: !0, children: /* @__PURE__ */ e(P, { variant: "secondary", size: "icon", "aria-label": c("aria.close"), "data-component": "filter-panel-close", children: /* @__PURE__ */ e(F, { className: "h-3 w-3" }) }) })
+    ] })
+  ] });
+}, H = ({
+  open: l,
+  onOpenChange: a,
   title: i = "Filter panel",
-  children: h,
-  header: r,
-  sidebar: s,
-  className: x,
-  preventClose: m = !1
-}) => /* @__PURE__ */ e(b, { open: a, onOpenChange: l, children: /* @__PURE__ */ t(
-  v,
+  children: c,
+  header: s,
+  sidebar: r,
+  className: o,
+  preventClose: x = !1
+}) => /* @__PURE__ */ e(v, { open: l, onOpenChange: a, children: /* @__PURE__ */ t(
+  g,
   {
     side: "right",
     className: n(
       "w-full !max-w-[840px] p-0 sm:!max-w-[840px] gap-0 border-l shadow-xl transition-all duration-300 ease-in-out bg-white",
-      x
+      o
     ),
-    onInteractOutside: (f) => {
-      m && f.preventDefault();
+    onInteractOutside: (p) => {
+      x && p.preventDefault();
     },
-    onEscapeKeyDown: (f) => {
-      m && f.preventDefault();
+    onEscapeKeyDown: (p) => {
+      x && p.preventDefault();
     },
     children: [
-      /* @__PURE__ */ e(g, { className: "sr-only", children: "Select filters to apply to the current view." }),
+      /* @__PURE__ */ e(w, { className: "sr-only", children: "Select filters to apply to the current view." }),
       /* @__PURE__ */ t("div", { className: "flex h-full flex-col bg-white", children: [
-        r || /* @__PURE__ */ e(j, { title: i }),
+        s || /* @__PURE__ */ e(j, { title: i }),
         /* @__PURE__ */ t("div", { className: "flex flex-1 overflow-hidden", children: [
-          s,
-          /* @__PURE__ */ e("div", { className: "flex flex-col flex-1 overflow-hidden", children: h })
+          r,
+          /* @__PURE__ */ e("div", { className: "flex flex-col flex-1 overflow-hidden", children: c })
         ] })
       ] })
     ]
   }
 ) }), M = ({
-  items: a,
-  activeTab: l,
+  items: l,
+  activeTab: a,
   onTabChange: i,
-  className: h
-}) => /* @__PURE__ */ e("div", { "data-component": "filter-panel-sidebar", className: n("flex w-[200px] shrink-0 flex-col border-r bg-sidebar-light", h), children: /* @__PURE__ */ e("div", { className: "flex flex-1 flex-col py-2 gap-1 overflow-y-auto", children: a.map((r) => {
-  const s = l === r.id;
-  return /* @__PURE__ */ t(u.Fragment, { children: [
-    r.separator && /* @__PURE__ */ e("div", { className: "my-2 h-px bg-gray-200" }),
-    /* @__PURE__ */ t(
-      "button",
-      {
-        onClick: () => i(r.id),
-        "data-component": "filter-panel-sidebar-item",
-        "data-active": s ? "true" : "false",
-        "data-tab": r.id,
-        className: n(
-          "group flex items-center justify-between px-3 py-[6px] mx-2 rounded-lg text-left text-sm font-medium transition-colors",
-          s ? "bg-active-blue text-primary" : "text-text-secondary hover:bg-active-blue"
-        ),
-        children: [
-          /* @__PURE__ */ t("div", { className: "flex items-center gap-2 min-w-0 flex-1", children: [
-            /* @__PURE__ */ e("span", { className: n(
-              "shrink-0",
-              s ? "text-primary" : "text-text-secondary"
-            ), children: r.icon }),
-            /* @__PURE__ */ t("div", { className: "flex items-center gap-1 min-w-0", children: [
-              /* @__PURE__ */ t(c, { children: [
-                /* @__PURE__ */ e(o, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "truncate font-['Manrope']", children: r.label }) }),
-                /* @__PURE__ */ e(d, { variant: "tertiary", side: "right", children: r.label })
-              ] }),
-              r.isRequired && /* @__PURE__ */ e("span", { className: "shrink-0 text-error", children: "*" })
-            ] })
-          ] }),
-          /* @__PURE__ */ t("div", { className: "flex items-center gap-1 shrink-0 ml-1", children: [
-            r.count !== void 0 && r.count > 0 && /* @__PURE__ */ t(c, { children: [
-              /* @__PURE__ */ e(o, { asChild: !0, children: /* @__PURE__ */ e("span", { className: n(
-                "flex h-5 items-center justify-center rounded-full px-2 text-[11px]",
-                s ? "bg-white text-[#4259ee] border border-gray-100" : "bg-white border border-gray-100"
-              ), children: r.count }) }),
-              /* @__PURE__ */ t(d, { variant: "tertiary", side: "top", children: [
-                r.count,
-                " filters applied"
+  className: c
+}) => {
+  const { t: s } = u();
+  return /* @__PURE__ */ e("div", { "data-component": "filter-panel-sidebar", className: n("flex w-[200px] shrink-0 flex-col border-r bg-sidebar-light", c), children: /* @__PURE__ */ e("div", { className: "flex flex-1 flex-col py-2 gap-1 overflow-y-auto", children: l.map((r) => {
+    const o = a === r.id;
+    return /* @__PURE__ */ t(b.Fragment, { children: [
+      r.separator && /* @__PURE__ */ e("div", { className: "my-2 h-px bg-gray-200" }),
+      /* @__PURE__ */ t(
+        "button",
+        {
+          onClick: () => i(r.id),
+          "data-component": "filter-panel-sidebar-item",
+          "data-active": o ? "true" : "false",
+          "data-tab": r.id,
+          className: n(
+            "group flex items-center justify-between px-3 py-[6px] mx-2 rounded-lg text-left text-sm font-medium transition-colors",
+            o ? "bg-active-blue text-primary" : "text-text-secondary hover:bg-active-blue"
+          ),
+          children: [
+            /* @__PURE__ */ t("div", { className: "flex items-center gap-2 min-w-0 flex-1", children: [
+              /* @__PURE__ */ e("span", { className: n(
+                "shrink-0",
+                o ? "text-primary" : "text-text-secondary"
+              ), children: r.icon }),
+              /* @__PURE__ */ t("div", { className: "flex items-center gap-1 min-w-0", children: [
+                /* @__PURE__ */ t(d, { children: [
+                  /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "truncate font-['Manrope']", children: r.label }) }),
+                  /* @__PURE__ */ e(f, { variant: "tertiary", side: "right", children: r.label })
+                ] }),
+                r.isRequired && /* @__PURE__ */ e("span", { className: "shrink-0 text-error", children: "*" })
               ] })
             ] }),
-            r.hasError && /* @__PURE__ */ t(c, { children: [
-              /* @__PURE__ */ e(o, { asChild: !0, children: /* @__PURE__ */ e(p, { className: "h-4 w-4 text-error" }) }),
-              /* @__PURE__ */ e(d, { variant: "tertiary", children: "This tab contains errors" })
-            ] }),
-            r.hasWarning && /* @__PURE__ */ t(c, { children: [
-              /* @__PURE__ */ e(o, { asChild: !0, children: /* @__PURE__ */ e(p, { className: "h-4 w-4 text-warning" }) }),
-              /* @__PURE__ */ e(d, { variant: "tertiary", children: "This tab has warnings" })
-            ] }),
-            r.hasInfo && /* @__PURE__ */ t(c, { children: [
-              /* @__PURE__ */ e(o, { asChild: !0, children: /* @__PURE__ */ e(p, { className: "h-4 w-4 text-icon-gray" }) }),
-              /* @__PURE__ */ e(d, { variant: "tertiary", children: "Additional information available" })
+            /* @__PURE__ */ t("div", { className: "flex items-center gap-1 shrink-0 ml-1", children: [
+              r.count !== void 0 && r.count > 0 && /* @__PURE__ */ t(d, { children: [
+                /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e("span", { className: n(
+                  "flex h-5 items-center justify-center rounded-full px-2 text-[11px]",
+                  o ? "bg-white text-[#4259ee] border border-gray-100" : "bg-white border border-gray-100"
+                ), children: r.count }) }),
+                /* @__PURE__ */ e(f, { variant: "tertiary", side: "top", children: s("filterPanel.filtersAppliedCount", { count: r.count }) })
+              ] }),
+              r.hasError && /* @__PURE__ */ t(d, { children: [
+                /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e(m, { className: "h-4 w-4 text-error" }) }),
+                /* @__PURE__ */ e(f, { variant: "tertiary", children: s("filterPanel.tabContainsErrors") })
+              ] }),
+              r.hasWarning && /* @__PURE__ */ t(d, { children: [
+                /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e(m, { className: "h-4 w-4 text-warning" }) }),
+                /* @__PURE__ */ e(f, { variant: "tertiary", children: s("filterPanel.tabHasWarnings") })
+              ] }),
+              r.hasInfo && /* @__PURE__ */ t(d, { children: [
+                /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e(m, { className: "h-4 w-4 text-icon-gray" }) }),
+                /* @__PURE__ */ e(f, { variant: "tertiary", children: s("filterPanel.additionalInfoAvailable") })
+              ] })
             ] })
-          ] })
-        ]
-      }
-    )
-  ] }, r.id);
-}) }) }), R = ({ children: a, className: l }) => /* @__PURE__ */ e("div", { "data-component": "filter-panel-body", className: n("flex flex-1 flex-col overflow-auto bg-white p-4", l), children: a }), _ = ({ children: a, className: l, leftAction: i }) => /* @__PURE__ */ t("div", { "data-component": "filter-panel-footer", className: n("flex items-center justify-between border-t bg-white px-4 py-3 shrink-0", l), children: [
+          ]
+        }
+      )
+    ] }, r.id);
+  }) }) });
+}, R = ({ children: l, className: a }) => /* @__PURE__ */ e("div", { "data-component": "filter-panel-body", className: n("flex flex-1 flex-col overflow-auto bg-white p-4", a), children: l }), W = ({ children: l, className: a, leftAction: i }) => /* @__PURE__ */ t("div", { "data-component": "filter-panel-footer", className: n("flex items-center justify-between border-t bg-white px-4 py-3 shrink-0", a), children: [
   /* @__PURE__ */ e("div", { children: i && i }),
-  /* @__PURE__ */ e("div", { className: "flex items-center gap-3", children: a })
+  /* @__PURE__ */ e("div", { className: "flex items-center gap-3", children: l })
 ] });
 export {
-  E as FilterPanel,
+  H as FilterPanel,
   R as FilterPanelBody,
-  _ as FilterPanelFooter,
+  W as FilterPanelFooter,
   j as FilterPanelHeader,
   M as FilterPanelSidebar
 };

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

@@ -1,99 +1,103 @@
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
 import { ListFilter as k } from "lucide-react";
 import { cn as a } from "../../../lib/utils.js";
-import { Button as v } from "../button.js";
-import { Skeleton as i } from "../skeleton.js";
-import { FilterSummary as u } from "./filter-summary.js";
-import { FilterTagList as b } from "./filter-tag-list.js";
-const C = ({
-  filters: r,
-  onFilterRemove: l,
-  onAllFiltersClick: m,
-  savedFilters: n,
+import { Button as u } from "../button.js";
+import { Skeleton as t } from "../skeleton.js";
+import { FilterSummary as b } from "./filter-summary.js";
+import { FilterTagList as F } from "./filter-tag-list.js";
+import { useImpactNovaI18n as S } from "../../../i18n/ImpactNovaI18nContext.js";
+const T = ({
+  filters: l,
+  onFilterRemove: m,
+  onAllFiltersClick: n,
+  savedFilters: p,
   recentFilters: c,
-  onApplySavedFilter: p,
-  onSavedFilterSearch: o,
+  onApplySavedFilter: o,
+  onSavedFilterSearch: f,
   onSavedFiltersScroll: h,
-  onViewAll: f,
-  selectedFilter: d,
-  onSelectedFilterChange: w,
-  onDropdownOpenChange: x,
-  isLoadingFilterPreferencesList: N,
-  isLoading: g,
-  className: s
-}) => g ? /* @__PURE__ */ e(
-  "div",
-  {
-    "data-component": "filter-strip",
-    "data-loading": "true",
-    className: a(
-      "flex w-full h-12 items-center gap-3 bg-white px-6 py-2",
-      s
-    ),
-    children: /* @__PURE__ */ t("div", { className: "flex items-center gap-2 flex-1 min-w-0", "data-component": "filter-strip-loading", children: [
-      /* @__PURE__ */ e("span", { className: "text-sm font-medium text-[#60697d] font-['Manrope'] shrink-0", children: "Filters Applied" }),
-      /* @__PURE__ */ e(i, { className: "h-6 w-20 shrink-0" }),
-      /* @__PURE__ */ e("div", { className: "h-4 w-[1px] bg-[#e6e8f0] shrink-0" }),
-      /* @__PURE__ */ t("div", { className: "flex items-center gap-2 flex-1 min-w-0", children: [
-        /* @__PURE__ */ e(i, { className: "h-6 w-32" }),
-        /* @__PURE__ */ e(i, { className: "h-6 w-28" }),
-        /* @__PURE__ */ e(i, { className: "h-6 w-24" }),
-        /* @__PURE__ */ e(i, { className: "h-6 w-36" }),
-        /* @__PURE__ */ e(i, { className: "h-6 w-20" }),
-        /* @__PURE__ */ e(i, { className: "h-6 w-30" })
-      ] }),
-      /* @__PURE__ */ e("div", { className: "h-4 w-[1px] bg-[#e6e8f0] shrink-0" }),
-      /* @__PURE__ */ e(i, { className: "h-8 w-24 shrink-0" })
-    ] })
-  }
-) : /* @__PURE__ */ t(
-  "div",
-  {
-    "data-component": "filter-strip",
-    className: a(
-      "flex w-full h-12 items-center gap-3 bg-white px-6 py-2",
-      s
-    ),
-    children: [
-      /* @__PURE__ */ e(
-        u,
-        {
-          selectedFilter: d,
-          onSelectedFilterChange: w,
-          savedFilters: n,
-          recentFilters: c,
-          onApplySavedFilter: p,
-          onSavedFilterSearch: o,
-          onSavedFiltersScroll: h,
-          onDropdownOpenChange: x,
-          isLoadingFilterPreferencesList: N
-        }
+  onViewAll: d,
+  selectedFilter: w,
+  onSelectedFilterChange: x,
+  onDropdownOpenChange: N,
+  isLoadingFilterPreferencesList: g,
+  isLoading: v,
+  className: r
+}) => {
+  const { t: s } = S();
+  return v ? /* @__PURE__ */ e(
+    "div",
+    {
+      "data-component": "filter-strip",
+      "data-loading": "true",
+      className: a(
+        "flex w-full h-12 items-center gap-3 bg-white px-6 py-2",
+        r
       ),
-      /* @__PURE__ */ e("div", { className: "h-4 w-[1px] bg-[#e6e8f0] mx-1 shrink-0" }),
-      /* @__PURE__ */ e(
-        b,
-        {
-          filters: r,
-          onFilterRemove: l,
-          onViewAll: f
-        }
+      children: /* @__PURE__ */ i("div", { className: "flex items-center gap-2 flex-1 min-w-0", "data-component": "filter-strip-loading", children: [
+        /* @__PURE__ */ e("span", { className: "text-sm font-medium text-[#60697d] font-['Manrope'] shrink-0", children: s("filterStrip.filtersApplied") }),
+        /* @__PURE__ */ e(t, { className: "h-6 w-20 shrink-0" }),
+        /* @__PURE__ */ e("div", { className: "h-4 w-[1px] bg-[#e6e8f0] shrink-0" }),
+        /* @__PURE__ */ i("div", { className: "flex items-center gap-2 flex-1 min-w-0", children: [
+          /* @__PURE__ */ e(t, { className: "h-6 w-32" }),
+          /* @__PURE__ */ e(t, { className: "h-6 w-28" }),
+          /* @__PURE__ */ e(t, { className: "h-6 w-24" }),
+          /* @__PURE__ */ e(t, { className: "h-6 w-36" }),
+          /* @__PURE__ */ e(t, { className: "h-6 w-20" }),
+          /* @__PURE__ */ e(t, { className: "h-6 w-30" })
+        ] }),
+        /* @__PURE__ */ e("div", { className: "h-4 w-[1px] bg-[#e6e8f0] shrink-0" }),
+        /* @__PURE__ */ e(t, { className: "h-8 w-24 shrink-0" })
+      ] })
+    }
+  ) : /* @__PURE__ */ i(
+    "div",
+    {
+      "data-component": "filter-strip",
+      className: a(
+        "flex w-full h-12 items-center gap-3 bg-white px-6 py-2",
+        r
       ),
-      /* @__PURE__ */ e("div", { className: "h-4 w-[1px] bg-[#e6e8f0] mx-1 shrink-0" }),
-      /* @__PURE__ */ t(
-        v,
-        {
-          variant: "tertiary",
-          onClick: m,
-          "data-component": "filter-strip-all-filters",
-          children: [
-            /* @__PURE__ */ e(k, { className: "h-4 w-4" }),
-            "All Filters"
-          ]
-        }
-      )
-    ]
-  }
-);
+      children: [
+        /* @__PURE__ */ e(
+          b,
+          {
+            selectedFilter: w,
+            onSelectedFilterChange: x,
+            savedFilters: p,
+            recentFilters: c,
+            onApplySavedFilter: o,
+            onSavedFilterSearch: f,
+            onSavedFiltersScroll: h,
+            onDropdownOpenChange: N,
+            isLoadingFilterPreferencesList: g
+          }
+        ),
+        /* @__PURE__ */ e("div", { className: "h-4 w-[1px] bg-[#e6e8f0] mx-1 shrink-0" }),
+        /* @__PURE__ */ e(
+          F,
+          {
+            filters: l,
+            onFilterRemove: m,
+            onViewAll: d
+          }
+        ),
+        /* @__PURE__ */ e("div", { className: "h-4 w-[1px] bg-[#e6e8f0] mx-1 shrink-0" }),
+        /* @__PURE__ */ i(
+          u,
+          {
+            variant: "tertiary",
+            onClick: n,
+            "data-component": "filter-strip-all-filters",
+            children: [
+              /* @__PURE__ */ e(k, { className: "h-4 w-4" }),
+              s("filterStrip.allFilters")
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
 export {
-  C as FilterStrip
+  T as FilterStrip
 };