impact-nova 2.0.9 → 2.1.0-alpha.2

package/dist/components/flows/command-palette/utils.js

@@ -0,0 +1,249 @@
+import { isMac as m, hasUsableShortcutKey as y } from "../../primitives/kbd/keybinding-display.js";
+import { getKeySymbol as x, keybindingToString as H, keybindingToSymbols as I } from "../../primitives/kbd/keybinding-display.js";
+const S = {
+  system: "System",
+  user: "User",
+  browser: "Browser",
+  "ag-grid": "Table"
+};
+function T(e, t) {
+  if (typeof e.key != "string" || !y(t))
+    return !1;
+  let o = e.key.toLowerCase() === t.key.toLowerCase();
+  if (!o && t.alt && m()) {
+    const n = e.code, i = t.key.toLowerCase();
+    n.startsWith("Key") ? o = n.slice(3).toLowerCase() === i : n.startsWith("Digit") ? o = n.slice(5) === i : o = ({
+      Comma: ",",
+      Period: ".",
+      Slash: "/",
+      Backslash: "\\",
+      BracketLeft: "[",
+      BracketRight: "]",
+      Semicolon: ";",
+      Quote: "'",
+      Backquote: "`",
+      Minus: "-",
+      Equal: "="
+    }[n] ?? n.toLowerCase()) === i;
+  }
+  if (!o) return !1;
+  const a = !!t.meta, r = !!t.ctrl, s = !!t.alt, c = !!t.shift;
+  if (m())
+    return e.metaKey === a && e.ctrlKey === r && e.altKey === s && e.shiftKey === c;
+  const h = a || r;
+  return e.ctrlKey === h && e.altKey === s && e.shiftKey === c && !e.metaKey;
+}
+function W(e) {
+  const t = { key: "" }, o = e.includes("+") ? e.split("+").map((a) => a.trim()) : d(e);
+  for (const a of o) {
+    const r = a.toLowerCase();
+    r === "⌘" || r === "meta" || r === "cmd" || r === "command" ? t.meta = !0 : r === "⌃" || r === "ctrl" || r === "control" ? t.ctrl = !0 : r === "⌥" || r === "alt" || r === "option" ? t.alt = !0 : r === "⇧" || r === "shift" ? t.shift = !0 : t.key = a;
+  }
+  return t;
+}
+function d(e) {
+  const t = ["⌘", "⌃", "⌥", "⇧"], o = [];
+  let a = e;
+  for (const r of t)
+    a.includes(r) && (o.push(r), a = a.replace(r, ""));
+  return a.trim() && o.push(a.trim()), o;
+}
+function F(e, t) {
+  return !y(e) || !y(t) ? !1 : e.key.toLowerCase() === t.key.toLowerCase() && !!e.meta == !!t.meta && !!e.ctrl == !!t.ctrl && !!e.alt == !!t.alt && !!e.shift == !!t.shift;
+}
+function k(e) {
+  if ((/* @__PURE__ */ new Set([
+    "Control",
+    "Shift",
+    "Alt",
+    "Meta",
+    "CapsLock",
+    "NumLock",
+    "ScrollLock"
+  ])).has(e.key)) return null;
+  let o = e.key;
+  if (e.altKey && m()) {
+    const a = e.code;
+    a.startsWith("Key") ? o = a.slice(3).toLowerCase() : a.startsWith("Digit") ? o = a.slice(5) : o = {
+      Comma: ",",
+      Period: ".",
+      Slash: "/",
+      Backslash: "\\",
+      BracketLeft: "[",
+      BracketRight: "]",
+      Semicolon: ";",
+      Quote: "'",
+      Backquote: "`",
+      Minus: "-",
+      Equal: "="
+    }[a] ?? o;
+  }
+  return {
+    key: o,
+    meta: m() ? e.metaKey : !1,
+    ctrl: m() ? e.ctrlKey : e.ctrlKey || e.metaKey,
+    alt: e.altKey,
+    shift: e.shiftKey
+  };
+}
+const b = [
+  // ─── Tab & Window Shortcuts ────────────────────────────────────────────
+  { shortcut: "meta+n", label: "New window", category: "Tab & Window" },
+  { shortcut: "meta+shift+n", label: "New incognito window", category: "Tab & Window" },
+  { shortcut: "meta+t", label: "New tab", category: "Tab & Window" },
+  { shortcut: "meta+w", label: "Close current tab", category: "Tab & Window" },
+  { shortcut: "meta+shift+w", label: "Close current window", category: "Tab & Window" },
+  { shortcut: "meta+shift+t", label: "Reopen last closed tab", category: "Tab & Window" },
+  { shortcut: "meta+1", label: "Switch to tab 1", category: "Tab & Window" },
+  { shortcut: "meta+2", label: "Switch to tab 2", category: "Tab & Window" },
+  { shortcut: "meta+3", label: "Switch to tab 3", category: "Tab & Window" },
+  { shortcut: "meta+4", label: "Switch to tab 4", category: "Tab & Window" },
+  { shortcut: "meta+5", label: "Switch to tab 5", category: "Tab & Window" },
+  { shortcut: "meta+6", label: "Switch to tab 6", category: "Tab & Window" },
+  { shortcut: "meta+7", label: "Switch to tab 7", category: "Tab & Window" },
+  { shortcut: "meta+8", label: "Switch to tab 8", category: "Tab & Window" },
+  { shortcut: "meta+9", label: "Switch to last tab", category: "Tab & Window" },
+  { shortcut: "meta+shift+a", label: "Search open tabs", category: "Tab & Window" },
+  { shortcut: "meta+m", label: "Minimise window", category: "Tab & Window" },
+  { shortcut: "meta+q", label: "Quit Chrome", category: "Tab & Window" },
+  // ─── Google Chrome Feature Shortcuts ───────────────────────────────────
+  { shortcut: "meta+shift+b", label: "Show/hide bookmarks bar", category: "Chrome Features" },
+  { shortcut: "meta+alt+b", label: "Open Bookmarks Manager", category: "Chrome Features" },
+  { shortcut: "meta+,", label: "Open Chrome Settings", category: "Chrome Features" },
+  { shortcut: "meta+shift+delete", label: "Open Clear Browsing Data", category: "Chrome Features" },
+  { shortcut: "meta+d", label: "Bookmark current page", category: "Chrome Features" },
+  { shortcut: "meta+shift+d", label: "Bookmark all open tabs", category: "Chrome Features" },
+  { shortcut: "meta+f", label: "Find on page", category: "Chrome Features" },
+  { shortcut: "meta+g", label: "Find next", category: "Chrome Features" },
+  { shortcut: "meta+shift+g", label: "Find previous", category: "Chrome Features" },
+  { shortcut: "meta+h", label: "Hide Chrome", category: "Chrome Features" },
+  { shortcut: "meta+y", label: "Open History", category: "Chrome Features" },
+  { shortcut: "meta+j", label: "Open Downloads", category: "Chrome Features" },
+  { shortcut: "meta+shift+j", label: "Open DevTools (Console)", category: "Chrome Features" },
+  { shortcut: "meta+l", label: "Focus address bar", category: "Chrome Features" },
+  { shortcut: "meta+shift+m", label: "Switch Chrome profile", category: "Chrome Features" },
+  { shortcut: "meta+o", label: "Open file", category: "Chrome Features" },
+  { shortcut: "meta+p", label: "Print", category: "Chrome Features" },
+  { shortcut: "meta+r", label: "Reload page", category: "Chrome Features" },
+  { shortcut: "meta+shift+r", label: "Hard reload (skip cache)", category: "Chrome Features" },
+  { shortcut: "meta+s", label: "Save page as", category: "Chrome Features" },
+  { shortcut: "meta+shift+i", label: "Open DevTools", category: "Chrome Features" },
+  { shortcut: "meta+alt+i", label: "Open DevTools (Elements)", category: "Chrome Features" },
+  { shortcut: "meta+alt+j", label: "Open DevTools (Console)", category: "Chrome Features" },
+  { shortcut: "meta+shift+c", label: "Open DevTools (Inspect)", category: "Chrome Features" },
+  { shortcut: "meta+alt+u", label: "View page source", category: "Chrome Features" },
+  { shortcut: "meta+u", label: "View page source", category: "Chrome Features" },
+  // ─── Address Bar Shortcuts ─────────────────────────────────────────────
+  { shortcut: "meta+e", label: "Search from address bar", category: "Address Bar" },
+  // ─── Webpage Shortcuts ─────────────────────────────────────────────────
+  { shortcut: "meta+z", label: "Undo", category: "Webpage" },
+  { shortcut: "meta+shift+z", label: "Redo", category: "Webpage" },
+  { shortcut: "meta+x", label: "Cut", category: "Webpage" },
+  { shortcut: "meta+c", label: "Copy", category: "Webpage" },
+  { shortcut: "meta+v", label: "Paste", category: "Webpage" },
+  { shortcut: "meta+a", label: "Select all", category: "Webpage" },
+  { shortcut: "meta+shift+v", label: "Paste without formatting", category: "Webpage" },
+  { shortcut: "meta+plus", label: "Zoom in", category: "Webpage" },
+  { shortcut: "meta+-", label: "Zoom out", category: "Webpage" },
+  { shortcut: "meta+=", label: "Zoom in", category: "Webpage" },
+  { shortcut: "meta+0", label: "Reset zoom", category: "Webpage" },
+  // ─── System / Function Keys ────────────────────────────────────────────
+  { shortcut: "f1", label: "Open Help", category: "System" },
+  { shortcut: "f3", label: "Find on page", category: "System" },
+  { shortcut: "f5", label: "Reload page", category: "System" },
+  { shortcut: "f6", label: "Focus address bar / panels", category: "System" },
+  { shortcut: "f7", label: "Toggle caret browsing", category: "System" },
+  { shortcut: "f11", label: "Toggle fullscreen", category: "System" },
+  { shortcut: "f12", label: "Open DevTools", category: "System" },
+  { shortcut: "meta+f5", label: "Hard reload", category: "System" },
+  { shortcut: "ctrl+f5", label: "Hard reload (Windows)", category: "System" },
+  { shortcut: "ctrl+r", label: "Reload (Windows)", category: "System" },
+  { shortcut: "ctrl+shift+i", label: "DevTools (Windows)", category: "System" },
+  { shortcut: "ctrl+shift+j", label: "DevTools Console (Windows)", category: "System" }
+], g = new Set(
+  b.map((e) => e.shortcut)
+);
+function f(e) {
+  const t = [];
+  return (e.meta || e.ctrl) && t.push("meta"), e.alt && t.push("alt"), e.shift && t.push("shift"), t.push(e.key.toLowerCase()), t.join("+");
+}
+function K(e) {
+  const t = f(e);
+  return g.has(t) || g.has(t.replace("meta+", "ctrl+"));
+}
+function O(e) {
+  const t = f(e);
+  return b.find(
+    (o) => o.shortcut === t || o.shortcut === t.replace("meta+", "ctrl+")
+  );
+}
+function p(e, t) {
+  if (!e) return { score: 0, matches: [] };
+  const o = e.toLowerCase(), a = t.toLowerCase();
+  let r = 0;
+  for (const l of o) {
+    const u = a.indexOf(l, r);
+    if (u === -1) return null;
+    r = u + 1;
+  }
+  let s = 0, c = 0, h = 0;
+  const n = [];
+  let i = -1;
+  for (let l = 0; l < t.length && c < o.length; l++)
+    a[l] === o[c] ? (s += 1, h++, h > 1 && (s += h), (l === 0 || /[\s\-_./:]/.test(t[l - 1])) && (s += 5), t[l] === e[c] && (s += 0.5), i === -1 && (i = l), c++) : (i !== -1 && (n.push([i, l - 1]), i = -1), h = 0);
+  return i !== -1 && n.push([i, i + (c - n.reduce((l, u) => l + (u[1] - u[0] + 1), 0)) - 1]), c < o.length ? null : (a.startsWith(o) && (s += 10), s += Math.max(0, 5 - (t.length - e.length) * 0.1), { score: s, matches: n });
+}
+function L(e, t, o) {
+  if (!t.trim()) return e.map((r) => ({ item: r, score: 0, matches: [] }));
+  const a = [];
+  for (const r of e) {
+    const s = o(r), c = p(t, s);
+    c && a.push({ item: r, score: c.score, matches: c.matches });
+  }
+  return a.sort((r, s) => s.score - r.score), a;
+}
+const w = {
+  global: 0,
+  module: 1,
+  page: 2,
+  modal: 3
+};
+function R(e) {
+  return w[e];
+}
+function B(e) {
+  const t = [];
+  return e.forEach((o, a) => {
+    t.push({ commandId: a, keybinding: o });
+  }), JSON.stringify(t);
+}
+function D(e) {
+  const t = /* @__PURE__ */ new Map();
+  try {
+    const o = JSON.parse(e);
+    for (const a of o)
+      t.set(a.commandId, a.keybinding);
+  } catch {
+  }
+  return t;
+}
+export {
+  b as BROWSER_SHORTCUTS,
+  S as COMMAND_SOURCE_LABELS,
+  D as deserialiseOverrides,
+  L as fuzzyFilter,
+  p as fuzzyScore,
+  O as getBrowserShortcutInfo,
+  x as getKeySymbol,
+  y as hasUsableShortcutKey,
+  m as isMac,
+  K as isReservedShortcut,
+  k as keybindingFromEvent,
+  H as keybindingToString,
+  I as keybindingToSymbols,
+  F as keybindingsEqual,
+  T as matchesKeybinding,
+  W as parseKeybinding,
+  R as scopePriority,
+  B as serialiseOverrides
+};

package/dist/components/flows/filter-panel/filter-panel.d.ts

@@ -0,0 +1,7 @@
+import { FilterPanelHeaderProps, FilterPanelProps, FilterPanelSidebarProps, FilterPanelBodyProps, FilterPanelFooterProps } from './filter-panel.types';
+declare const FilterPanelHeader: ({ title, children, className, }: FilterPanelHeaderProps) => import("react/jsx-runtime").JSX.Element;
+declare const FilterPanel: ({ open, onOpenChange, title, children, header, sidebar, className, preventClose, }: FilterPanelProps) => import("react/jsx-runtime").JSX.Element;
+declare const FilterPanelSidebar: ({ items, activeTab, onTabChange, className, }: FilterPanelSidebarProps) => import("react/jsx-runtime").JSX.Element;
+declare const FilterPanelBody: ({ children, className }: FilterPanelBodyProps) => import("react/jsx-runtime").JSX.Element;
+declare const FilterPanelFooter: ({ children, className, leftAction, }: FilterPanelFooterProps) => import("react/jsx-runtime").JSX.Element;
+export { FilterPanel, FilterPanelHeader, FilterPanelSidebar, FilterPanelBody, FilterPanelFooter, };

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

@@ -0,0 +1,221 @@
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import b from "react";
+import { Sheet as v, SheetContent as g, SheetDescription as N, SheetTitle as y, SheetClose as w } from "../../feedback/sheet/sheet.js";
+import { cn as i } from "../../../lib/utils.js";
+import { MultiColorFilter as k, Cross as C, InfoBadge as m } from "impact-nova-icons";
+import { Button as F } from "../../primitives/button/button.js";
+import { Tooltip as d, TooltipTrigger as h, TooltipContent as f } from "../../feedback/tooltip/tooltip.js";
+import { Kbd as P } from "../../primitives/kbd/kbd.js";
+import { useImpactNovaI18n as u } from "../../../i18n/use-impact-nova-i18n.js";
+const I = ({
+  title: n,
+  children: r,
+  className: l
+}) => {
+  const { t: c } = u();
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      "data-component": "filter-panel-header",
+      className: i(
+        "flex  shrink-0 flex-row items-center justify-between border-b px-4 py-[9px] bg-canvas-elevated",
+        l
+      ),
+      children: [
+        /* @__PURE__ */ a("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ e(
+            "div",
+            {
+              className: "flex size-8 shrink-0 items-center justify-center rounded-md border border-brand-tint bg-white",
+              "aria-hidden": !0,
+              children: /* @__PURE__ */ e(k, { className: "size-5 shrink-0" })
+            }
+          ),
+          /* @__PURE__ */ e(y, { className: "text-lg font-bold text-content", children: n })
+        ] }),
+        /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
+          r,
+          /* @__PURE__ */ e(w, { asChild: !0, children: /* @__PURE__ */ e(
+            F,
+            {
+              variant: "secondary",
+              size: "icon",
+              tabIndex: -1,
+              "aria-label": c("aria.close"),
+              "data-component": "filter-panel-close",
+              children: /* @__PURE__ */ e(C, { className: "h-3 w-3" })
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+}, H = ({
+  open: n,
+  onOpenChange: r,
+  title: l = "Filter panel",
+  children: c,
+  header: s,
+  sidebar: t,
+  className: o,
+  preventClose: x = !1
+}) => /* @__PURE__ */ e(v, { open: n, onOpenChange: r, children: /* @__PURE__ */ a(
+  g,
+  {
+    side: "right",
+    className: i(
+      "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-canvas-elevated",
+      o
+    ),
+    onInteractOutside: (p) => {
+      x && p.preventDefault();
+    },
+    onEscapeKeyDown: (p) => {
+      x && p.preventDefault();
+    },
+    children: [
+      /* @__PURE__ */ e(N, { className: "sr-only", children: "Select filters to apply to the current view." }),
+      /* @__PURE__ */ a("div", { className: "flex h-full flex-col bg-canvas-elevated", "data-component": "filter-panel", children: [
+        s || /* @__PURE__ */ e(I, { title: l }),
+        /* @__PURE__ */ a("div", { className: "flex flex-1 overflow-hidden", children: [
+          t,
+          /* @__PURE__ */ e("div", { className: "flex flex-col flex-1 overflow-hidden", children: c })
+        ] })
+      ] })
+    ]
+  }
+) }), M = ({
+  items: n,
+  activeTab: r,
+  onTabChange: l,
+  className: c
+}) => {
+  const { t: s } = u();
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      "data-component": "filter-panel-sidebar",
+      className: i(
+        "flex w-[200px] shrink-0 flex-col border-r bg-navigation-canvas",
+        c
+      ),
+      children: /* @__PURE__ */ e("div", { className: "flex flex-1 flex-col py-2 gap-1 overflow-y-auto", children: n.map((t) => {
+        const o = r === t.id;
+        return /* @__PURE__ */ a(b.Fragment, { children: [
+          t.separator && /* @__PURE__ */ e("div", { className: "my-2 h-px bg-stroke-hairline" }),
+          /* @__PURE__ */ a(
+            "button",
+            {
+              type: "button",
+              autoFocus: o,
+              onClick: () => l(t.id),
+              "data-component": "filter-panel-sidebar-item",
+              "data-active": o ? "true" : "false",
+              "data-tab": t.id,
+              "data-shortcut-id": t.shortcutId,
+              className: i(
+                "group flex items-center justify-between px-3 py-[6px] mx-2 rounded-lg text-left text-sm font-medium transition-colors",
+                o ? "bg-canvas-accent text-brand" : "text-content-secondary hover:bg-canvas-accent"
+              ),
+              children: [
+                /* @__PURE__ */ a("div", { className: "flex items-center gap-2 min-w-0 flex-1", children: [
+                  /* @__PURE__ */ e(
+                    "span",
+                    {
+                      className: i(
+                        "shrink-0",
+                        o ? "text-brand" : "text-content-secondary"
+                      ),
+                      children: t.icon
+                    }
+                  ),
+                  /* @__PURE__ */ a("div", { className: "flex items-center gap-1 min-w-0", children: [
+                    /* @__PURE__ */ a(d, { children: [
+                      /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e("span", { className: "truncate font-['Manrope']", children: t.label }) }),
+                      /* @__PURE__ */ e(f, { variant: "tertiary", side: "right", children: t.tooltipKeybinding ? /* @__PURE__ */ a("span", { className: "flex items-center gap-2", children: [
+                        t.label,
+                        " ",
+                        /* @__PURE__ */ e(
+                          P,
+                          {
+                            keybinding: t.tooltipKeybinding,
+                            size: "sm"
+                          }
+                        )
+                      ] }) : t.label })
+                    ] }),
+                    t.isRequired && /* @__PURE__ */ e("span", { className: "shrink-0 text-danger", children: "*" })
+                  ] })
+                ] }),
+                /* @__PURE__ */ a("div", { className: "flex items-center gap-1 shrink-0 ml-1", children: [
+                  t.count !== void 0 && t.count > 0 && /* @__PURE__ */ a(d, { children: [
+                    /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e(
+                      "span",
+                      {
+                        className: i(
+                          "inline-flex h-5 min-w-5 items-center justify-center rounded-full px-1.5 text-[11px] font-medium tabular-nums leading-none shrink-0",
+                          o ? "bg-canvas-elevated text-brand border border-stroke-subtle" : "bg-brand-tint border border-stroke-subtle"
+                        ),
+                        children: t.count
+                      }
+                    ) }),
+                    /* @__PURE__ */ e(f, { variant: "tertiary", side: "top", children: s(
+                      t.countBadgeContext === "savedFiltersTotal" ? "filterPanel.savedFiltersAvailableCount" : "filterPanel.filtersAppliedCount",
+                      { count: t.count }
+                    ) })
+                  ] }),
+                  t.hasError && /* @__PURE__ */ a(d, { children: [
+                    /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e(m, { className: "h-5 w-5 shrink-0 text-danger" }) }),
+                    /* @__PURE__ */ e(f, { variant: "tertiary", children: s("filterPanel.tabContainsErrors") })
+                  ] }),
+                  t.hasWarning && /* @__PURE__ */ a(d, { children: [
+                    /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e(m, { className: "h-5 w-5 shrink-0 text-warning" }) }),
+                    /* @__PURE__ */ e(f, { variant: "tertiary", children: s("filterPanel.tabHasWarnings") })
+                  ] }),
+                  t.hasInfo && /* @__PURE__ */ a(d, { children: [
+                    /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e(m, { className: "h-5 w-5 shrink-0 text-content-icon" }) }),
+                    /* @__PURE__ */ e(f, { variant: "tertiary", children: s("filterPanel.additionalInfoAvailable") })
+                  ] })
+                ] })
+              ]
+            }
+          )
+        ] }, t.id);
+      }) })
+    }
+  );
+}, R = ({ children: n, className: r }) => /* @__PURE__ */ e(
+  "div",
+  {
+    "data-component": "filter-panel-body",
+    className: i(
+      "flex flex-1 flex-col overflow-auto bg-canvas-elevated p-4",
+      r
+    ),
+    children: n
+  }
+), W = ({
+  children: n,
+  className: r,
+  leftAction: l
+}) => /* @__PURE__ */ a(
+  "div",
+  {
+    "data-component": "filter-panel-footer",
+    className: i(
+      "flex items-center justify-between border-t bg-canvas-elevated px-4 py-3 shrink-0",
+      r
+    ),
+    children: [
+      /* @__PURE__ */ e("div", { children: l && l }),
+      /* @__PURE__ */ e("div", { className: "flex items-center gap-3", children: n })
+    ]
+  }
+);
+export {
+  H as FilterPanel,
+  R as FilterPanelBody,
+  W as FilterPanelFooter,
+  I as FilterPanelHeader,
+  M as FilterPanelSidebar
+};

package/dist/components/flows/filter-panel/filter-panel.types.d.ts

@@ -0,0 +1,46 @@
+import { default as React } from 'react';
+export interface FilterPanelHeaderProps {
+    title?: React.ReactNode;
+    children?: React.ReactNode;
+    className?: string;
+}
+export interface FilterPanelProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    title?: React.ReactNode;
+    children: React.ReactNode;
+    header?: React.ReactNode;
+    sidebar?: React.ReactNode;
+    className?: string;
+    preventClose?: boolean;
+}
+export type FilterSidebarCountBadgeContext = "appliedFields" | "savedFiltersTotal";
+export interface FilterSidebarItem {
+    id: string;
+    label: string;
+    icon: React.ReactNode;
+    count?: number;
+    countBadgeContext?: FilterSidebarCountBadgeContext;
+    isRequired?: boolean;
+    hasError?: boolean;
+    hasWarning?: boolean;
+    hasInfo?: boolean;
+    separator?: boolean;
+    tooltipKeybinding?: import('../command-palette/utils').KeyBinding;
+    shortcutId?: string;
+}
+export interface FilterPanelSidebarProps {
+    items: FilterSidebarItem[];
+    activeTab: string;
+    onTabChange: (tabId: string) => void;
+    className?: string;
+}
+export interface FilterPanelBodyProps {
+    children: React.ReactNode;
+    className?: string;
+}
+export interface FilterPanelFooterProps {
+    children: React.ReactNode;
+    className?: string;
+    leftAction?: React.ReactNode;
+}

package/dist/components/flows/filter-panel/index.d.ts

@@ -0,0 +1,2 @@
+export * from './filter-panel';
+export * from './filter-panel.types';

package/dist/components/flows/filter-strip/filter-strip.d.ts

@@ -0,0 +1,3 @@
+import { FilterStripProps } from './filter-strip.types';
+declare const FilterStrip: ({ filters, onFilterRemove, onAllFiltersClick, savedFilters, recentFilters, onApplySavedFilter, onSavedFilterSearch, onSavedFiltersScroll, onViewAll, onOverflowClick, selectedFilter, onSelectedFilterChange, onDropdownOpenChange, isLoadingFilterPreferencesList, isLoading, onEditSavedFilter, onDeleteSavedFilter, onSetDefaultSavedFilter, className, allFiltersKeybinding, allFiltersShortcutId, showAllFiltersButton, showSavedFilters, }: FilterStripProps) => import("react/jsx-runtime").JSX.Element;
+export { FilterStrip };

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

@@ -0,0 +1,127 @@
+import { jsx as e, jsxs as i, Fragment as L } from "react/jsx-runtime";
+import { ListFilter as A } from "impact-nova-icons";
+import { cn as l } from "../../../lib/utils.js";
+import { Button as B } from "../../primitives/button/button.js";
+import { Skeleton as t } from "../../data-display/skeleton/skeleton.js";
+import { useImpactNovaI18n as C } from "../../../i18n/use-impact-nova-i18n.js";
+import { FilterSummary as K } from "./filter-summary.js";
+import { FilterTagList as M } from "./filter-tag-list.js";
+const O = ({
+  filters: s,
+  onFilterRemove: n,
+  onAllFiltersClick: m,
+  savedFilters: o,
+  recentFilters: c,
+  onApplySavedFilter: p,
+  onSavedFilterSearch: h,
+  onSavedFiltersScroll: d,
+  onViewAll: f,
+  onOverflowClick: w,
+  selectedFilter: x,
+  onSelectedFilterChange: N,
+  onDropdownOpenChange: v,
+  isLoadingFilterPreferencesList: g,
+  isLoading: u,
+  onEditSavedFilter: k,
+  onDeleteSavedFilter: b,
+  onSetDefaultSavedFilter: F,
+  className: a,
+  allFiltersKeybinding: S,
+  allFiltersShortcutId: y,
+  showAllFiltersButton: j = !0,
+  showSavedFilters: I = !0
+}) => {
+  const { t: r } = C();
+  return u ? /* @__PURE__ */ e(
+    "div",
+    {
+      "data-component": "filter-strip",
+      "data-loading": "true",
+      className: l(
+        "flex w-full h-12 items-center gap-3 bg-canvas-elevated px-6 py-2",
+        a
+      ),
+      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-content-tertiary font-['Manrope'] shrink-0", children: r("filterStrip.filtersApplied") }),
+            /* @__PURE__ */ e(t, { className: "h-6 w-20 shrink-0" }),
+            /* @__PURE__ */ e("div", { className: "h-4 w-[1px] bg-stroke-hairline 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-stroke-hairline shrink-0" }),
+            /* @__PURE__ */ e(t, { className: "h-8 w-24 shrink-0" })
+          ]
+        }
+      )
+    }
+  ) : /* @__PURE__ */ i(
+    "div",
+    {
+      "data-component": "filter-strip",
+      className: l(
+        "flex w-full h-12 items-center gap-3 bg-canvas-elevated px-6 py-2 overflow-visible",
+        a
+      ),
+      children: [
+        I && /* @__PURE__ */ i(L, { children: [
+          /* @__PURE__ */ e(
+            K,
+            {
+              selectedFilter: x,
+              onSelectedFilterChange: N,
+              savedFilters: o,
+              recentFilters: c,
+              onApplySavedFilter: p,
+              onSavedFilterSearch: h,
+              onSavedFiltersScroll: d,
+              onDropdownOpenChange: v,
+              isLoadingFilterPreferencesList: g,
+              onEditSavedFilter: k,
+              onDeleteSavedFilter: b,
+              onSetDefaultSavedFilter: F
+            }
+          ),
+          /* @__PURE__ */ e("div", { className: "h-4 w-[1px] bg-stroke-hairline mx-1 shrink-0" })
+        ] }),
+        /* @__PURE__ */ e(
+          M,
+          {
+            filters: s,
+            onFilterRemove: n,
+            onOverflowClick: w,
+            onViewAll: f
+          }
+        ),
+        j && /* @__PURE__ */ i(
+          B,
+          {
+            variant: "tertiary",
+            onClick: m,
+            "data-component": "filter-strip-all-filters",
+            "aria-label": r("filterStrip.allFilters"),
+            tooltipSide: "bottom",
+            tooltipKeybinding: S,
+            "data-shortcut-id": y,
+            children: [
+              /* @__PURE__ */ e(A, { className: "h-4 w-4" }),
+              r("filterStrip.allFilters")
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  O as FilterStrip
+};