impact-nova 2.0.9 → 2.1.0-alpha.2

package/dist/components/data/ag-grid-react/headers/components/header-info.d.ts

@@ -0,0 +1,39 @@
+import { CustomHeaderProps } from 'ag-grid-react';
+import { IHeaderGroupParams } from 'ag-grid-community';
+import { ExtendedHeaderComponentParams, InfoContent } from '../../ag-grid.types';
+/**
+ * Info Icon Trigger - native button for grid header info actions.
+ */
+export declare const InfoIconTrigger: ({ onClick, className, label, }: {
+    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    className?: string;
+    label: string;
+}) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Tooltip-only Info Trigger
+ */
+export declare const TooltipInfoTrigger: ({ content, className, onInfoClick, label, }: {
+    content: string;
+    className?: string;
+    onInfoClick?: (e: React.MouseEvent) => void;
+    label: string;
+}) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Modal-enabled Info Trigger
+ * Only this component allocates a useState hook.
+ */
+export declare const ModalInfoTrigger: ({ infoData, className, onInfoClick, label, }: {
+    infoData?: InfoContent;
+    className?: string;
+    onInfoClick?: (e: React.MouseEvent) => void;
+    label: string;
+}) => import("react/jsx-runtime").JSX.Element;
+type HeaderInfoProps = (CustomHeaderProps | IHeaderGroupParams) & ExtendedHeaderComponentParams & {
+    className?: string;
+};
+/**
+ * Header Info - Main switcher for optimized performance
+ * Works for both CustomHeader and CustomHeaderGroup
+ */
+export declare const HeaderInfo: (props: HeaderInfoProps) => import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/components/data/ag-grid-react/headers/components/header-info.js

@@ -0,0 +1,105 @@
+import { jsx as t, jsxs as I, Fragment as g } from "react/jsx-runtime";
+import { useState as k } from "react";
+import { cn as m } from "../../../../../lib/utils.js";
+import { Info as b } from "impact-nova-icons";
+import { useImpactNovaI18n as p } from "../../../../../i18n/use-impact-nova-i18n.js";
+import { LazyTooltip as h } from "./lazy-tooltip.js";
+import { InfoModal as C } from "./info-modal.js";
+const u = ({
+  onClick: n,
+  className: i,
+  label: r
+}) => {
+  const o = (a) => {
+    a.stopPropagation(), n?.(a);
+  };
+  return /* @__PURE__ */ t(
+    "button",
+    {
+      type: "button",
+      "aria-label": r,
+      className: m(
+        "cursor-pointer flex items-center justify-center shrink-0 w-6 h-6 rounded-md transition-all duration-200 text-content-tertiary hover:bg-muted active:bg-stroke-hairline",
+        i
+      ),
+      onClick: o,
+      children: /* @__PURE__ */ t(b, { size: 16, "aria-hidden": !0 })
+    }
+  );
+}, v = ({
+  content: n,
+  className: i,
+  onInfoClick: r,
+  label: o
+}) => /* @__PURE__ */ t(h, { content: n, children: /* @__PURE__ */ t(u, { onClick: r, className: i, label: o }) }), y = ({
+  infoData: n,
+  className: i,
+  onInfoClick: r,
+  label: o
+}) => {
+  const { t: a } = p(), [l, s] = k(!1), c = (e) => {
+    e.stopPropagation(), s(!0);
+  };
+  return /* @__PURE__ */ I(g, { children: [
+    /* @__PURE__ */ t(h, { content: a("gridHeader.clickForDetails"), children: /* @__PURE__ */ t(
+      u,
+      {
+        label: o,
+        onClick: (e) => {
+          c(e), r && r(e);
+        },
+        className: m(
+          "hover:bg-muted hover:shadow-sm hover:text-brand-variant-hover hover:-translate-y-0.5 active:scale-95",
+          i
+        )
+      }
+    ) }),
+    l && n && // Stop propagation to prevent the click from bubbling to the header group
+    // regardless of whether the modal is portaled or not.
+    /* @__PURE__ */ t("div", { onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ t(
+      C,
+      {
+        open: l,
+        onClose: () => s(!1),
+        data: n
+      }
+    ) })
+  ] });
+}, M = (n) => {
+  const { t: i } = p(), {
+    showInfoIcon: r,
+    displayName: o,
+    displayMode: a = "tooltip",
+    infoTooltip: l,
+    infoData: s,
+    className: c,
+    onInfoClick: e
+  } = n;
+  if (!r || !o || o.trim() === "") return null;
+  const d = () => {
+    e && e(n);
+  }, f = l ? `${o}: ${l}` : `${o} ${i("gridHeader.information")}`;
+  return a === "modal" ? /* @__PURE__ */ t(
+    y,
+    {
+      infoData: s,
+      className: c,
+      onInfoClick: d,
+      label: f
+    }
+  ) : /* @__PURE__ */ t(
+    v,
+    {
+      content: l || `Info about ${o}`,
+      className: c,
+      onInfoClick: d,
+      label: f
+    }
+  );
+};
+export {
+  M as HeaderInfo,
+  u as InfoIconTrigger,
+  y as ModalInfoTrigger,
+  v as TooltipInfoTrigger
+};

package/dist/components/data/ag-grid-react/headers/components/info-modal.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+import { InfoContent } from '../../ag-grid.types';
+interface InfoModalProps {
+    open: boolean;
+    onClose: () => void;
+    data: InfoContent;
+}
+/**
+ * InfoModal - Generic modal for displaying detailed column information.
+ */
+export declare const InfoModal: React.FC<InfoModalProps>;
+export {};

package/dist/components/data/ag-grid-react/headers/components/info-modal.js

@@ -0,0 +1,20 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import "react";
+import { Dialog as s, DialogContent as d, DialogHeader as p, DialogTitle as g, DialogBody as f } from "../../../../feedback/dialog/dialog.js";
+import { useImpactNovaI18n as h } from "../../../../../i18n/use-impact-nova-i18n.js";
+import { SectionRenderer as x } from "./section-renderers.js";
+const H = ({ open: a, onClose: l, data: o }) => {
+  const { t: n } = h();
+  if (!o) return null;
+  const { title: m, sections: r = [] } = o;
+  return /* @__PURE__ */ e(s, { open: a, onOpenChange: (t) => !t && l(), children: /* @__PURE__ */ i(d, { className: "max-w-2xl", children: [
+    /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(g, { children: m || n("gridHeader.information") }) }),
+    /* @__PURE__ */ i(f, { className: "space-y-6 py-8", children: [
+      r.map((t, c) => /* @__PURE__ */ e(x, { section: t }, `${t.type}-${c}`)),
+      r.length === 0 && /* @__PURE__ */ e("p", { className: "text-sm text-content-muted text-center py-4", children: n("gridHeader.noInformationAvailable") })
+    ] })
+  ] }) });
+};
+export {
+  H as InfoModal
+};

package/dist/components/data/ag-grid-react/headers/components/lazy-tooltip.d.ts

@@ -0,0 +1,10 @@
+interface LazyTooltipProps {
+    content: React.ReactNode;
+    children: React.ReactNode;
+    side?: 'top' | 'right' | 'bottom' | 'left';
+}
+/**
+ * Lazy-mount tooltip on first hover. Requires app-level TooltipProvider (ImpactNovaProviders).
+ */
+export declare const LazyTooltip: ({ content, children, side }: LazyTooltipProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/data/ag-grid-react/headers/components/lazy-tooltip.js

@@ -0,0 +1,13 @@
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { useState as a } from "react";
+import { Tooltip as p, TooltipTrigger as l, TooltipContent as c } from "../../../../feedback/tooltip/tooltip.js";
+const f = ({ content: r, children: e, side: o = "bottom" }) => {
+  const [n, i] = a(!1);
+  return n ? /* @__PURE__ */ s(p, { children: [
+    /* @__PURE__ */ t(l, { asChild: !0, children: /* @__PURE__ */ t("span", { children: e }) }),
+    /* @__PURE__ */ t(c, { side: o, variant: "tertiary", children: /* @__PURE__ */ t("p", { children: r }) })
+  ] }) : /* @__PURE__ */ t("span", { onMouseEnter: () => i(!0), children: e });
+};
+export {
+  f as LazyTooltip
+};

package/dist/components/data/ag-grid-react/headers/components/section-renderers.d.ts

@@ -0,0 +1,32 @@
+import { default as React } from 'react';
+import { UISection, TextSection, KeyValueSection, BadgesSection, LinkSection } from '../../ag-grid.types';
+/**
+ * Text Section Renderer
+ */
+export declare const TextSectionRenderer: React.FC<{
+    section: TextSection;
+}>;
+/**
+ * Key-Value Section Renderer
+ */
+export declare const KeyValueSectionRenderer: React.FC<{
+    section: KeyValueSection;
+}>;
+/**
+ * Badges Section Renderer
+ */
+export declare const BadgesSectionRenderer: React.FC<{
+    section: BadgesSection;
+}>;
+/**
+ * Link Section Renderer
+ */
+export declare const LinkSectionRenderer: React.FC<{
+    section: LinkSection;
+}>;
+/**
+ * Main Section Switcher
+ */
+export declare const SectionRenderer: React.FC<{
+    section: UISection;
+}>;

package/dist/components/data/ag-grid-react/headers/components/section-renderers.js

@@ -0,0 +1,78 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import "react";
+import { Badge as o } from "../../../../data-display/badge/badge.js";
+import { cn as i } from "../../../../../lib/utils.js";
+const d = ({ section: t }) => {
+  const r = t.variant || "paragraph", { label: n, content: l } = t.data || {}, a = i(
+    r === "heading" ? "text-lg font-semibold text-content" : r === "caption" ? "text-xs text-content-muted" : "text-sm text-content-tertiary leading-relaxed"
+  );
+  return /* @__PURE__ */ s("div", { className: "flex flex-col gap-1.5", children: [
+    n && /* @__PURE__ */ e("span", { className: "text-xs text-content-tertiary font-medium", children: n }),
+    /* @__PURE__ */ e("p", { className: a, children: l })
+  ] });
+}, x = ({ section: t }) => {
+  const r = t.data?.items || [];
+  return /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-x-8 gap-y-4", children: r.map((n, l) => /* @__PURE__ */ s("div", { className: "flex flex-col gap-1 min-w-[120px]", children: [
+    /* @__PURE__ */ e("span", { className: "text-xs text-content-tertiary font-normal", children: n.label }),
+    /* @__PURE__ */ e("span", { className: "text-sm text-content font-semibold", children: String(n.value) })
+  ] }, `${n.label}-${l}`)) });
+}, m = ({ section: t }) => {
+  const { label: r, items: n = [] } = t.data || {}, l = n.filter((a) => a.label && a.label.trim().length > 0);
+  return /* @__PURE__ */ s("div", { className: "flex flex-col gap-2", children: [
+    r && /* @__PURE__ */ e("span", { className: "text-xs text-content-tertiary font-medium", children: r }),
+    /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-2", children: l.map((a, c) => /* @__PURE__ */ e(
+      o,
+      {
+        variant: a.variant,
+        color: a.color,
+        children: a.label
+      },
+      `${a.label}-${c}`
+    )) })
+  ] });
+}, p = ({ section: t }) => {
+  const { label: r, text: n, url: l } = t.data || {};
+  return /* @__PURE__ */ s("div", { className: "flex flex-col gap-1.5", children: [
+    r && /* @__PURE__ */ e("span", { className: "text-xs text-content-tertiary font-medium", children: r }),
+    /* @__PURE__ */ e(
+      "a",
+      {
+        href: l,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: "text-sm text-brand hover:underline font-medium inline-flex items-center gap-1",
+        children: n
+      }
+    )
+  ] });
+}, N = ({ section: t }) => {
+  const r = () => {
+    switch (t.type) {
+      case "TEXT":
+        return /* @__PURE__ */ e(d, { section: t });
+      case "KEY_VALUE":
+        return /* @__PURE__ */ e(x, { section: t });
+      case "BADGES":
+        return /* @__PURE__ */ e(m, { section: t });
+      case "LINK":
+        return /* @__PURE__ */ e(p, { section: t });
+      default:
+        return null;
+    }
+  }, n = (l) => {
+    const { separator: a } = t;
+    return a ? a === !0 || a === l || a === "both" : !1;
+  };
+  return /* @__PURE__ */ s("div", { className: "w-full", children: [
+    n("top") && /* @__PURE__ */ e("div", { className: "h-px bg-stroke-hairline my-6" }),
+    r(),
+    n("bottom") && /* @__PURE__ */ e("div", { className: "h-px bg-stroke-hairline my-6" })
+  ] });
+};
+export {
+  m as BadgesSectionRenderer,
+  x as KeyValueSectionRenderer,
+  p as LinkSectionRenderer,
+  N as SectionRenderer,
+  d as TextSectionRenderer
+};

package/dist/components/data/ag-grid-react/headers/components/truncated-text.d.ts

@@ -0,0 +1,15 @@
+interface TruncatedTextProps {
+    text: string;
+    className?: string;
+}
+/**
+ * TruncatedText - Wraps text to 2 lines, shows tooltip when clamped
+ *
+ * Performance note: This component uses useState/useRef but is only instantiated
+ * once per visible header (not per column). With column virtualization, only ~20-30
+ * headers are rendered at a time, so the hook overhead is minimal.
+ *
+ * The tooltip is lazily mounted - only after user hovers AND text is clamped.
+ */
+export declare const TruncatedText: ({ text, className }: TruncatedTextProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/data/ag-grid-react/headers/components/truncated-text.js

@@ -0,0 +1,27 @@
+import { jsx as e, jsxs as h } from "react/jsx-runtime";
+import { useRef as f, useState as s } from "react";
+import { cn as p } from "../../../../../lib/utils.js";
+import { TooltipProvider as m, Tooltip as T, TooltipTrigger as g, TooltipContent as C } from "../../../../feedback/tooltip/tooltip.js";
+const b = ({ text: t, className: o }) => {
+  const r = f(null), [c, i] = s(!1), [l, a] = s(!1), d = () => {
+    if (r.current) {
+      const u = r.current.scrollHeight > r.current.clientHeight;
+      i(u), a(!0);
+    }
+  }, n = p("line-clamp-2 break-words", o);
+  return l && c ? /* @__PURE__ */ e(m, { children: /* @__PURE__ */ h(T, { children: [
+    /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ e("span", { ref: r, className: n, children: t }) }),
+    /* @__PURE__ */ e(C, { side: "bottom", variant: "tertiary", children: /* @__PURE__ */ e("p", { children: t }) })
+  ] }) }) : /* @__PURE__ */ e(
+    "span",
+    {
+      ref: r,
+      className: n,
+      onMouseEnter: d,
+      children: t
+    }
+  );
+};
+export {
+  b as TruncatedText
+};

package/dist/components/data/ag-grid-react/headers/context/grid-header-context.d.ts

@@ -0,0 +1,36 @@
+import { AdvancedFilterModel } from '../../ag-grid.types';
+/**
+ * Grid Header Context - Coordinates header state across all columns.
+ *
+ * Instead of each header having its own useState for search state
+ * (50,000 columns = 50,000 state objects), we use ONE context state
+ * at the grid level to track:
+ * - Which column (if any) has active search popover
+ * - Advanced filter model and computed display strings
+ */
+export interface GridHeaderContextValue {
+    /** Open search popover for a specific column */
+    openSearch: (columnId: string) => void;
+    /** Close the search popover */
+    closeSearch: () => void;
+    /** Open the advanced filter dialog, optionally for a specific column */
+    openAdvancedFilter: (columnId?: string) => void;
+    /** Close the advanced filter dialog */
+    closeAdvancedFilter: () => void;
+    /** Apply a new advanced filter model (updates state AND applies to grid) */
+    applyAdvancedFilter: (model: AdvancedFilterModel | null) => void;
+    /** Open column settings menu for a specific column or group */
+    openMenu: (columnId: string, anchor: HTMLElement, variant?: 'column' | 'group') => void;
+    /** Close the column settings menu */
+    closeMenu: () => void;
+    /** ID of the column that currently has the settings menu open */
+    activeMenuColumnId: string | null;
+    /** Variant of the active menu ('column' for regular columns, 'group' for column groups) */
+    activeMenuVariant: 'column' | 'group' | null;
+}
+export declare const GridHeaderContext: import('react').Context<GridHeaderContextValue | null>;
+/**
+ * Hook to access grid header context from within header components.
+ * Returns null if used outside of GridHeaderContext.Provider.
+ */
+export declare const useGridHeader: () => GridHeaderContextValue | null;

package/dist/components/data/ag-grid-react/headers/custom-header-group.d.ts

@@ -0,0 +1,10 @@
+import { IHeaderGroupParams } from 'ag-grid-community';
+import { ExtendedHeaderComponentParams } from '../ag-grid.types';
+/**
+ * CustomHeaderGroup — optimized for large column trees.
+ *
+ * Not wrapped in React.memo: AG Grid mutates `columnGroup` in place on expand/collapse;
+ * memo would serve stale `isExpanded` and break collapse. `toggleExpand` reads
+ * `columnGroup.isExpanded()` at click time.
+ */
+export declare function CustomHeaderGroup(props: IHeaderGroupParams & ExtendedHeaderComponentParams): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/data/ag-grid-react/headers/custom-header.d.ts

@@ -0,0 +1,3 @@
+import { CustomHeaderProps } from 'ag-grid-react';
+import { ExtendedHeaderComponentParams } from '../ag-grid.types';
+export declare const CustomHeader: (props: CustomHeaderProps & ExtendedHeaderComponentParams) => import("react/jsx-runtime").JSX.Element;