@freighttech/ui 0.13.18

package/dist/backend/dynamic-table/components/FilterDatePicker.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/backend/dynamic-table/components/FilterDatePicker.tsx"],
+  "sourcesContent": ["import React, { useCallback, useEffect, useRef, useState } from 'react';\nimport ReactDOM from 'react-dom';\nimport { Calendar as CalendarIcon } from 'lucide-react';\nimport { Calendar } from '../../../primitives/calendar';\nimport { useEscapeLayer } from '../hooks/useEscapeLayer';\n\ninterface FilterDatePickerProps {\n  /** ISO date string (YYYY-MM-DD), or empty string when unset. */\n  value: string;\n  onChange: (next: string) => void;\n  ariaLabel?: string;\n  placeholder?: string;\n  /** Extra classes on the trigger. The Configure View drawer's look is default. */\n  className?: string;\n  /**\n   * Stacking for the portalled calendar. Defaults to the drawer's 10000; a host\n   * that is itself portalled ABOVE that (the header quick filter sits at 10001)\n   * must raise it or the calendar paints behind the popover that opened it.\n   */\n  zIndex?: number;\n}\n\nfunction parseISODate(value: string): Date | null {\n  if (!value) return null;\n  const m = value.match(/^(\\d{4})-(\\d{2})-(\\d{2})/);\n  if (!m) return null;\n  const d = new Date(Number(m[1]), Number(m[2]) - 1, Number(m[3]));\n  return Number.isNaN(d.getTime()) ? null : d;\n}\n\nfunction formatISODate(date: Date): string {\n  const y = date.getFullYear();\n  const m = String(date.getMonth() + 1).padStart(2, '0');\n  const d = String(date.getDate()).padStart(2, '0');\n  return `${y}-${m}-${d}`;\n}\n\nfunction formatDisplay(date: Date): string {\n  // Locale-aware short date that matches the inline editor's compact look.\n  return date.toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: '2-digit' });\n}\n\nexport const FilterDatePicker: React.FC<FilterDatePickerProps> = ({\n  value,\n  onChange,\n  ariaLabel,\n  placeholder = 'Pick date',\n  className = '',\n  zIndex = 10000,\n}) => {\n  const [open, setOpen] = useState(false);\n  const [position, setPosition] = useState<{ top: number; left: number }>({ top: 0, left: 0 });\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const popupRef = useRef<HTMLDivElement>(null);\n\n  const selected = parseISODate(value);\n\n  const reposition = useCallback(() => {\n    if (!triggerRef.current) return;\n    const rect = triggerRef.current.getBoundingClientRect();\n    const margin = 8;\n    // Measured once mounted; the constants are only the first-frame estimate.\n    const popupHeight = popupRef.current?.offsetHeight || 360; // calendar + footer\n    const popupWidth = popupRef.current?.offsetWidth || 300;\n\n    // VERTICAL CLAMP. The \"open above\" case used to be expressed as\n    // `top: rect.top - 4` plus `translateY(-100%)`, which for a trigger high on\n    // the screen resolves to a NEGATIVE top: the month caption and the weekday\n    // header were cut off above the viewport and the month could not be\n    // changed, so an explicit date range was unpickable. The transform hid the\n    // arithmetic, so the top is now computed outright and clamped.\n    const fitsBelow = rect.bottom + popupHeight + margin <= window.innerHeight;\n    const desiredTop = fitsBelow ? rect.bottom + 4 : rect.top - 4 - popupHeight;\n    const maxTop = Math.max(margin, window.innerHeight - popupHeight - margin);\n    const top = Math.max(margin, Math.min(desiredTop, maxTop));\n\n    // Horizontal clamp. The trigger sits near the right edge of the\n    // configure-view drawer, so anchoring at `rect.left` lets a 300px-wide\n    // calendar overflow and get clipped by the screen edge.\n    const maxLeft = window.innerWidth - popupWidth - margin;\n    const left = Math.max(margin, Math.min(rect.left, maxLeft));\n    setPosition({ top, left });\n  }, []);\n\n  useEffect(() => {\n    if (!open) return;\n    reposition();\n    const onScroll = () => reposition();\n    window.addEventListener('scroll', onScroll, true);\n    window.addEventListener('resize', onScroll);\n    return () => {\n      window.removeEventListener('scroll', onScroll, true);\n      window.removeEventListener('resize', onScroll);\n    };\n  }, [open, reposition]);\n\n  useEffect(() => {\n    if (!open) return;\n    const onMouseDown = (e: MouseEvent) => {\n      const t = e.target as Node;\n      if (popupRef.current?.contains(t)) return;\n      if (triggerRef.current?.contains(t)) return;\n      setOpen(false);\n    };\n    document.addEventListener('mousedown', onMouseDown);\n    return () => document.removeEventListener('mousedown', onMouseDown);\n  }, [open]);\n\n  // The calendar had NO Escape handling, so pressing Escape over an open date\n  // popup closed the whole Configure View drawer and left the popup orphaned.\n  useEscapeLayer(open, () => {\n    setOpen(false);\n    triggerRef.current?.focus();\n  });\n\n  const handleSelect = (day: Date | undefined) => {\n    if (!day) return;\n    onChange(formatISODate(day));\n    setOpen(false);\n  };\n\n  const popup = open ? (\n    <div\n      ref={popupRef}\n      className=\"hot-editor-popup hot-calendar-popup hot-datetime-popup\"\n      style={{\n        position: 'fixed',\n        top: `${position.top}px`,\n        left: `${position.left}px`,\n        zIndex,\n      }}\n      onMouseDown={(e) => e.stopPropagation()}\n    >\n      <Calendar\n        mode=\"single\"\n        selected={selected ?? undefined}\n        defaultMonth={selected ?? undefined}\n        onSelect={handleSelect}\n        classNames={{\n          month: 'relative space-y-4',\n          month_caption: 'flex justify-center pt-1 items-center',\n          today: 'shadow-[var(--m3-focus-halo)] rounded-m3-xs text-[var(--m3-on-surface)] font-semibold',\n        }}\n      />\n      <div className=\"hot-calendar-footer\">\n        <button\n          type=\"button\"\n          className=\"hot-calendar-footer-btn hot-calendar-clear-btn\"\n          onMouseDown={(e) => {\n            e.preventDefault();\n            e.stopPropagation();\n            onChange('');\n            setOpen(false);\n          }}\n        >\n          Clear\n        </button>\n        <button\n          type=\"button\"\n          className=\"hot-calendar-footer-btn hot-calendar-today-btn\"\n          onMouseDown={(e) => {\n            e.preventDefault();\n            e.stopPropagation();\n            const now = new Date();\n            onChange(formatISODate(now));\n            setOpen(false);\n          }}\n        >\n          Today\n        </button>\n      </div>\n    </div>\n  ) : null;\n\n  return (\n    <>\n      <button\n        ref={triggerRef}\n        type=\"button\"\n        className={`hot-config-filter-input hot-config-filter-date-trigger ${className}`.trim()}\n        aria-label={ariaLabel}\n        onClick={() => setOpen((o) => !o)}\n      >\n        <span className={selected ? '' : 'hot-config-filter-date-placeholder'}>\n          {selected ? formatDisplay(selected) : placeholder}\n        </span>\n        <CalendarIcon className=\"w-3.5 h-3.5 text-[var(--m3-on-surface-variant)]\" />\n      </button>\n      {popup && typeof document !== 'undefined' ? ReactDOM.createPortal(popup, document.body) : popup}\n    </>\n  );\n};\n\nexport default FilterDatePicker;\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/backend/dynamic-table/components/FilterValueInput.js

@@ -0,0 +1,200 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import ReactDOM from "react-dom";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { useSuggestionFetch } from "../hooks/useSuggestionFetch.js";
+import { useEscapeLayer } from "../hooks/useEscapeLayer.js";
+const MAX_VISIBLE_SUGGESTIONS = 8;
+const FilterValueInput = ({
+  filterId,
+  initialValue,
+  isMultiValue,
+  onValueChange,
+  onValueAdd,
+  staticSuggestions,
+  loadSuggestions,
+  placeholder,
+  ariaLabel
+}) => {
+  const t = useT();
+  const [localValue, setLocalValue] = useState(initialValue);
+  const [open, setOpen] = useState(false);
+  const [activeIndex, setActiveIndex] = useState(-1);
+  const [position, setPosition] = useState({ top: 0, left: 0, width: 0 });
+  const inputRef = useRef(null);
+  const menuRef = useRef(null);
+  useEffect(() => {
+    setLocalValue(initialValue);
+  }, [initialValue]);
+  const {
+    values: asyncSuggestions,
+    loading,
+    failed
+  } = useSuggestionFetch(loadSuggestions, localValue, open);
+  const suggestions = useMemo(() => {
+    if (loadSuggestions) {
+      return asyncSuggestions.slice(0, MAX_VISIBLE_SUGGESTIONS);
+    }
+    const all = staticSuggestions ?? [];
+    const needle = localValue.trim().toLowerCase();
+    if (!needle) return all.slice(0, MAX_VISIBLE_SUGGESTIONS);
+    return all.filter((s) => s.toLowerCase().includes(needle)).slice(0, MAX_VISIBLE_SUGGESTIONS);
+  }, [loadSuggestions, asyncSuggestions, staticSuggestions, localValue]);
+  const hasPicker = !!loadSuggestions || (staticSuggestions?.length ?? 0) > 0;
+  const reposition = useCallback(() => {
+    const el = inputRef.current;
+    if (!el) return;
+    const rect = el.getBoundingClientRect();
+    const margin = 8;
+    const menuHeight = menuRef.current?.offsetHeight || 240;
+    const fitsBelow = rect.bottom + menuHeight + margin <= window.innerHeight;
+    const desiredTop = fitsBelow ? rect.bottom + 4 : rect.top - 4 - menuHeight;
+    const maxTop = Math.max(margin, window.innerHeight - menuHeight - margin);
+    setPosition({
+      top: Math.max(margin, Math.min(desiredTop, maxTop)),
+      left: rect.left,
+      width: rect.width
+    });
+  }, []);
+  useEffect(() => {
+    if (!open) return;
+    reposition();
+    const onScroll = () => reposition();
+    window.addEventListener("scroll", onScroll, true);
+    window.addEventListener("resize", onScroll);
+    return () => {
+      window.removeEventListener("scroll", onScroll, true);
+      window.removeEventListener("resize", onScroll);
+    };
+  }, [open, reposition]);
+  useEffect(() => {
+    if (!open) return;
+    const onMouseDown = (e) => {
+      const target = e.target;
+      if (menuRef.current?.contains(target)) return;
+      if (inputRef.current?.contains(target)) return;
+      setOpen(false);
+    };
+    document.addEventListener("mousedown", onMouseDown);
+    return () => document.removeEventListener("mousedown", onMouseDown);
+  }, [open]);
+  useEscapeLayer(open, () => {
+    setOpen(false);
+    setActiveIndex(-1);
+    inputRef.current?.focus();
+  });
+  const commit = useCallback(
+    (value) => {
+      const trimmed = value.trim();
+      if (isMultiValue) {
+        if (trimmed) onValueAdd(filterId, trimmed);
+        setLocalValue("");
+      } else {
+        setLocalValue(value);
+        onValueChange(filterId, trimmed);
+      }
+      setOpen(false);
+      setActiveIndex(-1);
+    },
+    [filterId, isMultiValue, onValueAdd, onValueChange]
+  );
+  const onKeyDown = (e) => {
+    if (open && suggestions.length > 0) {
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        setActiveIndex((i) => Math.min(i + 1, suggestions.length - 1));
+        return;
+      }
+      if (e.key === "ArrowUp") {
+        e.preventDefault();
+        setActiveIndex((i) => Math.max(i - 1, -1));
+        return;
+      }
+    }
+    if (e.key === "Enter") {
+      e.preventDefault();
+      if (activeIndex >= 0 && suggestions[activeIndex]) {
+        commit(suggestions[activeIndex]);
+        return;
+      }
+      commit(localValue);
+    }
+  };
+  const menu = open && hasPicker ? /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: menuRef,
+      role: "listbox",
+      className: "hot-filter-suggestions",
+      style: {
+        position: "fixed",
+        top: `${position.top}px`,
+        left: `${position.left}px`,
+        minWidth: `${position.width}px`,
+        zIndex: 10002
+      },
+      onMouseDown: (e) => e.stopPropagation(),
+      children: suggestions.length > 0 ? suggestions.map((suggestion, index) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          role: "option",
+          "aria-selected": index === activeIndex,
+          "data-active": index === activeIndex || void 0,
+          className: "hot-filter-suggestion text-body-regular-sm",
+          onMouseEnter: () => setActiveIndex(index),
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: () => commit(suggestion),
+          children: suggestion
+        },
+        suggestion
+      )) : loading ? (
+        // Loading and empty MUST look different. A silently empty dropdown is
+        // precisely what made this defect invisible for months.
+        /* @__PURE__ */ jsx("span", { className: "hot-filter-suggestion-note text-body-regular-xs", "data-suggestions-state": "loading", children: t("dynamicTable.filter.suggestionsLoading", "Loading\u2026") })
+      ) : failed ? /* @__PURE__ */ jsx("span", { className: "hot-filter-suggestion-note text-body-regular-xs", "data-suggestions-state": "error", children: t("dynamicTable.filter.suggestionsFailed", "Suggestions unavailable \u2014 type a value") }) : /* @__PURE__ */ jsx("span", { className: "hot-filter-suggestion-note text-body-regular-xs", "data-suggestions-state": "empty", children: t("dynamicTable.filter.suggestionsEmpty", "No suggestions") })
+    }
+  ) : null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref: inputRef,
+        type: "text",
+        role: hasPicker ? "combobox" : void 0,
+        "aria-expanded": hasPicker ? open : void 0,
+        "aria-label": ariaLabel,
+        className: "hot-config-filter-input",
+        placeholder,
+        value: localValue,
+        onChange: (e) => {
+          setLocalValue(e.target.value);
+          setActiveIndex(-1);
+          if (hasPicker) setOpen(true);
+        },
+        onFocus: () => {
+          if (hasPicker) {
+            reposition();
+            setOpen(true);
+          }
+        },
+        onKeyDown,
+        onBlur: () => {
+          setTimeout(() => {
+            if (!isMultiValue && localValue.trim() !== initialValue) {
+              onValueChange(filterId, localValue.trim());
+            }
+            setOpen(false);
+          }, 150);
+        }
+      }
+    ),
+    menu && typeof document !== "undefined" ? ReactDOM.createPortal(menu, document.body) : menu
+  ] });
+};
+var FilterValueInput_default = FilterValueInput;
+export {
+  FilterValueInput,
+  FilterValueInput_default as default
+};
+//# sourceMappingURL=FilterValueInput.js.map

package/dist/backend/dynamic-table/components/FilterValueInput.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/backend/dynamic-table/components/FilterValueInput.tsx"],
+  "sourcesContent": ["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport ReactDOM from 'react-dom';\nimport { useT } from '@open-mercato/shared/lib/i18n/context';\nimport { useSuggestionFetch } from '../hooks/useSuggestionFetch';\nimport { useEscapeLayer } from '../hooks/useEscapeLayer';\n\n/**\n * The filter value picker.\n *\n * WHY THIS EXISTS: `ConfigureViewFilters` declared `loadFilterSuggestions`,\n * destructured it and never called it. Every module that implements a\n * suggestion loader \u2014 folders, transport, invoicing, facilities, products,\n * carriers, contractors, the RFQ board \u2014 therefore got a bare free-text box,\n * and a filter on a relation or a user column could only be typed blind. Eight\n * lists, silently. This component is what the prop was always meant to reach.\n *\n * It is a COMBOBOX, not a closed select, and that is deliberate: `contains` on\n * a partial string is a legitimate filter, and the loader returns at most 50\n * values, so the list is a shortcut rather than the full domain.\n *\n * Fetch contract (do not \"optimise\" these away):\n *  - the needle goes TO THE SERVER on every change, debounced. Fetching once\n *    with an empty query and filtering the result client-side silently hides\n *    every value past the server's cap \u2014 the exact sampling bug documented in\n *    `server/filterSuggestions.ts`;\n *  - in-flight requests are superseded, so a slow first response can never\n *    overwrite a newer one;\n *  - a suggestion is a DISPLAY string that is simultaneously the stored value.\n *    Module list routes match these strings against the denormalised row, so\n *    there is no id mapping to do here. The value/label split exists only for\n *    static `source` columns, which are handled by the caller;\n *  - a loader that rejects leaves the free-text input fully usable. Filtering\n *    must never be blocked by a failed suggestion fetch.\n *\n * The fetch itself lives in `useSuggestionFetch` \u2014 shared with the column-header\n * quick filter, so that contract has exactly one implementation.\n */\n\nconst MAX_VISIBLE_SUGGESTIONS = 8;\n\nexport interface FilterValueInputProps {\n  /** Filter row id \u2014 passed straight back to the change handlers. */\n  filterId: string;\n  /** Current value for a single-value operator. Ignored when `isMultiValue`. */\n  initialValue: string;\n  /** `is_any_of` / `is_not_any_of`: committing ADDS a pill instead of replacing. */\n  isMultiValue: boolean;\n  onValueChange: (id: string, value: string) => void;\n  onValueAdd: (id: string, value: string) => void;\n  /**\n   * Static option labels for a column that declares `source`. Filtered\n   * client-side, because the whole set is already in memory.\n   */\n  staticSuggestions?: string[];\n  /** Server-backed suggestions for this column. Given the typed needle. */\n  loadSuggestions?: (query: string) => Promise<string[]>;\n  placeholder?: string;\n  ariaLabel?: string;\n}\n\nexport const FilterValueInput: React.FC<FilterValueInputProps> = ({\n  filterId,\n  initialValue,\n  isMultiValue,\n  onValueChange,\n  onValueAdd,\n  staticSuggestions,\n  loadSuggestions,\n  placeholder,\n  ariaLabel,\n}) => {\n  const t = useT();\n  const [localValue, setLocalValue] = useState(initialValue);\n  const [open, setOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState(-1);\n  const [position, setPosition] = useState({ top: 0, left: 0, width: 0 });\n\n  const inputRef = useRef<HTMLInputElement>(null);\n  const menuRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    setLocalValue(initialValue);\n  }, [initialValue]);\n\n  // \u2500\u2500 Suggestion fetch \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n  // Shared with the column-header quick filter: debounced, superseded, and it\n  // degrades to `failed` (never to a blocked filter) when the loader rejects.\n  const {\n    values: asyncSuggestions,\n    loading,\n    failed,\n  } = useSuggestionFetch(loadSuggestions, localValue, open);\n\n  const suggestions = useMemo(() => {\n    if (loadSuggestions) {\n      // The server already applied the needle and the cap; re-filtering here\n      // would drop values it deliberately returned.\n      return asyncSuggestions.slice(0, MAX_VISIBLE_SUGGESTIONS);\n    }\n    const all = staticSuggestions ?? [];\n    const needle = localValue.trim().toLowerCase();\n    if (!needle) return all.slice(0, MAX_VISIBLE_SUGGESTIONS);\n    return all.filter((s) => s.toLowerCase().includes(needle)).slice(0, MAX_VISIBLE_SUGGESTIONS);\n  }, [loadSuggestions, asyncSuggestions, staticSuggestions, localValue]);\n\n  const hasPicker = !!loadSuggestions || (staticSuggestions?.length ?? 0) > 0;\n\n  // \u2500\u2500 Positioning \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n  const reposition = useCallback(() => {\n    const el = inputRef.current;\n    if (!el) return;\n    const rect = el.getBoundingClientRect();\n    const margin = 8;\n    // Measured once mounted; 240 is only the first-frame estimate.\n    const menuHeight = menuRef.current?.offsetHeight || 240;\n    // Clamped into the viewport instead of `translateY(-100%)`: flipping a menu\n    // above a trigger that is itself near the top of the screen used to place\n    // it at a negative top, silently cutting off the first suggestions.\n    const fitsBelow = rect.bottom + menuHeight + margin <= window.innerHeight;\n    const desiredTop = fitsBelow ? rect.bottom + 4 : rect.top - 4 - menuHeight;\n    const maxTop = Math.max(margin, window.innerHeight - menuHeight - margin);\n    setPosition({\n      top: Math.max(margin, Math.min(desiredTop, maxTop)),\n      left: rect.left,\n      width: rect.width,\n    });\n  }, []);\n\n  useEffect(() => {\n    if (!open) return;\n    reposition();\n    const onScroll = () => reposition();\n    window.addEventListener('scroll', onScroll, true);\n    window.addEventListener('resize', onScroll);\n    return () => {\n      window.removeEventListener('scroll', onScroll, true);\n      window.removeEventListener('resize', onScroll);\n    };\n  }, [open, reposition]);\n\n  useEffect(() => {\n    if (!open) return;\n    const onMouseDown = (e: MouseEvent) => {\n      const target = e.target as Node;\n      if (menuRef.current?.contains(target)) return;\n      if (inputRef.current?.contains(target)) return;\n      setOpen(false);\n    };\n    document.addEventListener('mousedown', onMouseDown);\n    return () => document.removeEventListener('mousedown', onMouseDown);\n  }, [open]);\n\n  // Escape dismisses the suggestion list and nothing else. With the list CLOSED\n  // the hook is inactive, so Escape falls through to the drawer as it should.\n  useEscapeLayer(open, () => {\n    setOpen(false);\n    setActiveIndex(-1);\n    inputRef.current?.focus();\n  });\n\n  // \u2500\u2500 Commit \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n  const commit = useCallback(\n    (value: string) => {\n      const trimmed = value.trim();\n      if (isMultiValue) {\n        if (trimmed) onValueAdd(filterId, trimmed);\n        setLocalValue('');\n      } else {\n        setLocalValue(value);\n        onValueChange(filterId, trimmed);\n      }\n      setOpen(false);\n      setActiveIndex(-1);\n    },\n    [filterId, isMultiValue, onValueAdd, onValueChange],\n  );\n\n  const onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (open && suggestions.length > 0) {\n      if (e.key === 'ArrowDown') {\n        e.preventDefault();\n        setActiveIndex((i) => Math.min(i + 1, suggestions.length - 1));\n        return;\n      }\n      if (e.key === 'ArrowUp') {\n        e.preventDefault();\n        setActiveIndex((i) => Math.max(i - 1, -1));\n        return;\n      }\n    }\n    // NOTE: Escape is NOT handled here. React attaches its listeners at the\n    // root container, which runs long after the document-capture Escape handler\n    // Radix's Sheet installs \u2014 so by the time this ran the Configure View\n    // drawer was already closing underneath the suggestion list. `useEscapeLayer`\n    // below intercepts it at window-capture instead, and only while this list is\n    // the innermost open layer.\n    if (e.key === 'Enter') {\n      e.preventDefault();\n      if (activeIndex >= 0 && suggestions[activeIndex]) {\n        commit(suggestions[activeIndex]);\n        return;\n      }\n      commit(localValue);\n    }\n  };\n\n  const menu =\n    open && hasPicker ? (\n      <div\n        ref={menuRef}\n        role=\"listbox\"\n        className=\"hot-filter-suggestions\"\n        style={{\n          position: 'fixed',\n          top: `${position.top}px`,\n          left: `${position.left}px`,\n          minWidth: `${position.width}px`,\n          zIndex: 10002,\n        }}\n        onMouseDown={(e) => e.stopPropagation()}\n      >\n        {suggestions.length > 0 ? (\n          suggestions.map((suggestion, index) => (\n            <button\n              key={suggestion}\n              type=\"button\"\n              role=\"option\"\n              aria-selected={index === activeIndex}\n              data-active={index === activeIndex || undefined}\n              className=\"hot-filter-suggestion text-body-regular-sm\"\n              onMouseEnter={() => setActiveIndex(index)}\n              onMouseDown={(e) => e.preventDefault()}\n              onClick={() => commit(suggestion)}\n            >\n              {suggestion}\n            </button>\n          ))\n        ) : loading ? (\n          // Loading and empty MUST look different. A silently empty dropdown is\n          // precisely what made this defect invisible for months.\n          <span className=\"hot-filter-suggestion-note text-body-regular-xs\" data-suggestions-state=\"loading\">\n            {t('dynamicTable.filter.suggestionsLoading', 'Loading\u2026')}\n          </span>\n        ) : failed ? (\n          <span className=\"hot-filter-suggestion-note text-body-regular-xs\" data-suggestions-state=\"error\">\n            {t('dynamicTable.filter.suggestionsFailed', 'Suggestions unavailable \u2014 type a value')}\n          </span>\n        ) : (\n          <span className=\"hot-filter-suggestion-note text-body-regular-xs\" data-suggestions-state=\"empty\">\n            {t('dynamicTable.filter.suggestionsEmpty', 'No suggestions')}\n          </span>\n        )}\n      </div>\n    ) : null;\n\n  return (\n    <>\n      <input\n        ref={inputRef}\n        type=\"text\"\n        role={hasPicker ? 'combobox' : undefined}\n        aria-expanded={hasPicker ? open : undefined}\n        aria-label={ariaLabel}\n        className=\"hot-config-filter-input\"\n        placeholder={placeholder}\n        value={localValue}\n        onChange={(e) => {\n          setLocalValue(e.target.value);\n          setActiveIndex(-1);\n          if (hasPicker) setOpen(true);\n        }}\n        onFocus={() => {\n          if (hasPicker) {\n            reposition();\n            setOpen(true);\n          }\n        }}\n        onKeyDown={onKeyDown}\n        onBlur={() => {\n          // Delayed so a click on a suggestion lands first.\n          setTimeout(() => {\n            if (!isMultiValue && localValue.trim() !== initialValue) {\n              onValueChange(filterId, localValue.trim());\n            }\n            setOpen(false);\n          }, 150);\n        }}\n      />\n      {menu && typeof document !== 'undefined' ? ReactDOM.createPortal(menu, document.body) : menu}\n    </>\n  );\n};\n\nexport default FilterValueInput;\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/backend/dynamic-table/components/FooterTotalsRow.js

@@ -0,0 +1,165 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { memo } from "react";
+import { Sigma } from "lucide-react";
+import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { formatAggregate, AGGREGATE_EMPTY_PLACEHOLDER } from "../utils/formatAggregate.js";
+import { columnSpacerKey, columnSpacerStyle } from "../utils/columnSpacerStyle.js";
+const FooterTotalsRow = memo(({
+  columns,
+  aggregations,
+  result,
+  pageValues,
+  pageBreakdowns,
+  pageRowCount,
+  loading = false,
+  error = false,
+  getColumnWidth,
+  rowHeaders = false,
+  leftOffsets = [],
+  rightOffsets = [],
+  actionsColumnWidth = 0,
+  showActionsColumn = true,
+  totalWidth,
+  locale,
+  columnWindow
+}) => {
+  const t = useT();
+  const scope = result ? result.scope : "page";
+  const countInScope = result ? result.total : pageRowCount ?? 0;
+  const fnByField = new Map(aggregations.map((a) => [a.field, a.fn]));
+  const dimensionedFields = new Set(aggregations.filter((a) => a.dimension).map((a) => a.field));
+  let labelMaxWidth = 0;
+  for (let i = 0; i < columns.length; i += 1) {
+    if (fnByField.has(columns[i].data)) break;
+    labelMaxWidth += getColumnWidth(i);
+  }
+  const hasLabelLane = labelMaxWidth > 0;
+  const scopeLabel = error ? t("dynamicTable.aggregation.failed", "Could not calculate totals") : loading && !result ? t("dynamicTable.aggregation.loading", "Calculating\u2026") : scope === "dataset" ? t("dynamicTable.aggregation.scopeDataset", "All {count} matching rows", { count: countInScope }) : t("dynamicTable.aggregation.scopePage", "This page only ({count} rows)", { count: countInScope });
+  const valueFor = (field) => {
+    const fn = fnByField.get(field);
+    if (!fn) return null;
+    if (result) return result.values[`${field}:${fn}`] ?? null;
+    return pageValues?.[field] ?? null;
+  };
+  const breakdownFor = (field) => {
+    const fn = fnByField.get(field);
+    if (!fn) return void 0;
+    if (result) return result.breakdowns?.[`${field}:${fn}`];
+    return pageBreakdowns?.[field];
+  };
+  const renderFooterCell = (colIndex) => {
+    const col = columns[colIndex];
+    if (!col) return null;
+    const width = getColumnWidth(colIndex);
+    const stickyLeft = leftOffsets[colIndex];
+    const stickyRight = rightOffsets[colIndex];
+    const style = {
+      width,
+      flexBasis: width,
+      minWidth: width,
+      flexShrink: 0,
+      flexGrow: 0,
+      position: "relative"
+    };
+    if (stickyLeft !== void 0) {
+      style.position = "sticky";
+      style.left = stickyLeft;
+      style.zIndex = 2;
+    } else if (stickyRight !== void 0) {
+      style.position = "sticky";
+      style.right = stickyRight;
+      style.zIndex = 2;
+    }
+    const fn = fnByField.get(col.data);
+    const value = fn ? valueFor(col.data) : void 0;
+    const breakdown = fn ? breakdownFor(col.data) : void 0;
+    const suppressScalar = !!dimensionedFields.has(col.data) && !(breakdown && breakdown.length);
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "cell",
+        "aria-colindex": colIndex + 1 + (rowHeaders ? 1 : 0),
+        "data-footer-cell": col.data,
+        className: `hot-cell hot-footer-totals-cell${col.align ? ` cell-align-${col.align}` : ""}${col.mono ? " cell-mono" : ""}`,
+        style,
+        children: fn && !error ? /* @__PURE__ */ jsx("span", { className: "cell-content hot-footer-totals-value text-body-medium-sm", children: suppressScalar ? AGGREGATE_EMPTY_PLACEHOLDER : formatAggregate(value, col, locale, fn, breakdown) }) : null
+      },
+      col.data
+    );
+  };
+  const totalLabel = t("dynamicTable.aggregation.footerLabel", "Total");
+  const label = /* @__PURE__ */ jsxs("div", { className: "hot-footer-totals-label text-body-medium-sm", title: `${totalLabel} \xB7 ${scopeLabel}`, children: [
+    /* @__PURE__ */ jsx(Sigma, { className: "hot-footer-totals-sigma", style: { width: 14, height: 14 } }),
+    /* @__PURE__ */ jsx("span", { "data-footer-label": true, children: totalLabel }),
+    /* @__PURE__ */ jsx("span", { "data-footer-scope-label": true, className: "hot-footer-totals-scope text-body-regular-xs", children: scopeLabel })
+  ] });
+  const rowWidth = totalWidth === void 0 ? void 0 : `${totalWidth}px`;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-footer-totals": true,
+      "data-footer-scope": scope,
+      "data-footer-state": error ? "error" : loading ? "loading" : "ready",
+      "data-footer-layout": hasLabelLane ? "inline" : "stacked",
+      className: "hot-footer-totals",
+      style: {
+        position: "sticky",
+        bottom: 0,
+        zIndex: 5,
+        width: rowWidth,
+        background: "var(--m3-surface-container)",
+        borderTop: "1px solid var(--m3-outline-faint)"
+      },
+      children: [
+        !hasLabelLane && /* @__PURE__ */ jsx("div", { className: "hot-footer-totals-caption", style: { position: "sticky", left: 0, width: "fit-content" }, children: label }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "hot-footer-totals-row",
+            role: "row",
+            style: { display: "flex", width: rowWidth },
+            children: [
+              rowHeaders && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "hot-row-header hot-footer-totals-rowheader",
+                  style: { width: 50, flexBasis: 50, flexShrink: 0, flexGrow: 0, position: "sticky", left: 0, zIndex: 3 }
+                }
+              ),
+              hasLabelLane && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "hot-footer-totals-label-cell",
+                  style: { position: "relative", zIndex: 2, width: 0, maxWidth: 0 },
+                  children: /* @__PURE__ */ jsx("div", { className: "hot-footer-totals-label-clip", style: { maxWidth: labelMaxWidth }, children: label })
+                }
+              ),
+              columnWindow?.virtualized ? columnWindow.segments.map((seg) => seg.type === "spacer" ? /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "hot-cell-spacer",
+                  "aria-hidden": "true",
+                  style: columnSpacerStyle(seg.width)
+                },
+                columnSpacerKey(seg.fromIndex, seg.toIndex)
+              ) : renderFooterCell(seg.column.index)) : columns.map((_, colIndex) => renderFooterCell(colIndex)),
+              showActionsColumn && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "hot-cell hot-actions-cell hot-footer-totals-actions",
+                  style: { width: actionsColumnWidth, flexBasis: actionsColumnWidth, flexShrink: 0, flexGrow: 0, position: "sticky", right: 0, zIndex: 2 }
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+});
+FooterTotalsRow.displayName = "FooterTotalsRow";
+var FooterTotalsRow_default = FooterTotalsRow;
+export {
+  FooterTotalsRow_default as default
+};
+//# sourceMappingURL=FooterTotalsRow.js.map

package/dist/backend/dynamic-table/components/FooterTotalsRow.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/backend/dynamic-table/components/FooterTotalsRow.tsx"],
+  "sourcesContent": ["import React, { memo } from 'react';\nimport { Sigma } from 'lucide-react';\nimport { useT } from '@open-mercato/shared/lib/i18n/context';\nimport type { ColumnDef } from '../types/index';\nimport type {\n  AggregationRule,\n  AggregateResult,\n  AggregateBreakdownEntry,\n  AggregateScope,\n} from '../types/grouping';\nimport { formatAggregate, AGGREGATE_EMPTY_PLACEHOLDER } from '../utils/formatAggregate';\nimport type { ColumnWindow } from '../utils/columnWindow';\nimport { columnSpacerKey, columnSpacerStyle } from '../utils/columnSpacerStyle';\n\nexport interface FooterTotalsRowProps {\n  columns: ColumnDef[];\n  /** The view's aggregation rules \u2014 one per column, same list the group summaries use. */\n  aggregations: AggregationRule[];\n  /**\n   * Server-computed aggregate over the filtered dataset. `null` while it is in\n   * flight (or when the host has not wired `?aggregate=` yet), in which case\n   * `pageValues` is shown labelled as page-scoped.\n   */\n  result?: AggregateResult | null;\n  /**\n   * Fallback values folded from the loaded page, keyed by column `data`. Shown\n   * immediately so the footer is never blank; replaced the moment the dataset\n   * figure lands.\n   */\n  pageValues?: Record<string, number | null>;\n  /**\n   * Page-scoped per-dimension slices, keyed by column `data` \u2014 the breakdown\n   * counterpart of `pageValues`, used until the dataset breakdown lands.\n   */\n  pageBreakdowns?: Record<string, AggregateBreakdownEntry[]>;\n  /** Rows on the loaded page \u2014 the honest denominator for a page-scoped total. */\n  pageRowCount?: number;\n  loading?: boolean;\n  /** Set when the aggregate request failed; the footer says so rather than showing 0. */\n  error?: boolean;\n  /** Column width lookup by index (DynamicTable passes the cell store's getter). */\n  getColumnWidth: (colIndex: number) => number;\n  rowHeaders?: boolean;\n  leftOffsets?: (number | undefined)[];\n  rightOffsets?: (number | undefined)[];\n  actionsColumnWidth?: number;\n  showActionsColumn?: boolean;\n  totalWidth?: number;\n  locale?: string;\n  /**\n   * Mounted column window \u2014 the SAME instance the body rows consume, so the\n   * totals line up column-for-column while scrolled. Omit for the\n   * unvirtualized render.\n   */\n  columnWindow?: ColumnWindow;\n}\n\n/**\n * Pinned totals row.\n *\n * MUST be rendered OUTSIDE the virtualiser (it is sticky to the bottom of the\n * scroll container, like the header is to the top), which is why it takes\n * widths and sticky offsets as props rather than deriving them from a virtual\n * item.\n *\n * The scope label is not decoration and must not be dropped: a number that\n * covers one page of <= 100 rows, presented as if it covered the whole\n * filtered dataset, is the exact defect this component was built to end.\n */\nconst FooterTotalsRow: React.FC<FooterTotalsRowProps> = memo(({\n  columns,\n  aggregations,\n  result,\n  pageValues,\n  pageBreakdowns,\n  pageRowCount,\n  loading = false,\n  error = false,\n  getColumnWidth,\n  rowHeaders = false,\n  leftOffsets = [],\n  rightOffsets = [],\n  actionsColumnWidth = 0,\n  showActionsColumn = true,\n  totalWidth,\n  locale,\n  columnWindow,\n}) => {\n  const t = useT();\n\n  const scope: AggregateScope = result ? result.scope : 'page';\n  const countInScope = result ? result.total : (pageRowCount ?? 0);\n  const fnByField = new Map(aggregations.map((a) => [a.field, a.fn] as const));\n  const dimensionedFields = new Set(aggregations.filter((a) => a.dimension).map((a) => a.field));\n\n  // \u2500\u2500 How much room the \"\u03A3 Total \u00B7 scope\" label actually has \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n  //\n  // Ledger 3.3. The label was a ZERO-WIDTH cell that overflowed rightwards over\n  // \"the leading (blank) columns\" \u2014 but nothing checked that they were blank.\n  // On a view whose FIRST column carries an aggregate the label painted straight\n  // on top of that column's value: `.hot-footer-totals-label-cell` at width 0,\n  // x=295, and `.hot-footer-totals-cell` at x=295 width=132, both drawing text\n  // in the same 132px. The reader saw \"19 TOTAL THIS PAGE ONLY (19 ROWS)\" \u2014 a\n  // number and its own caption stacked on each other.\n  //\n  // The lead is now MEASURED: sum the widths of the leading columns that render\n  // nothing, and clamp the label to it. `overflow: hidden` + `text-overflow:\n  // ellipsis` (in CSS) means the label can shorten but can never reach the first\n  // value. The full string stays in `title`, so nothing is lost when it does.\n  let labelMaxWidth = 0;\n  for (let i = 0; i < columns.length; i += 1) {\n    if (fnByField.has(columns[i].data)) break;\n    labelMaxWidth += getColumnWidth(i);\n  }\n  // Every column is aggregated (or there are none): there is no lead to borrow,\n  // so the label moves under its own rules \u2014 see `hasLabelLane` below.\n  const hasLabelLane = labelMaxWidth > 0;\n\n  const scopeLabel = error\n    ? t('dynamicTable.aggregation.failed', 'Could not calculate totals')\n    : loading && !result\n      ? t('dynamicTable.aggregation.loading', 'Calculating\u2026')\n      : scope === 'dataset'\n        ? t('dynamicTable.aggregation.scopeDataset', 'All {count} matching rows', { count: countInScope })\n        : t('dynamicTable.aggregation.scopePage', 'This page only ({count} rows)', { count: countInScope });\n\n  const valueFor = (field: string): number | null => {\n    const fn = fnByField.get(field);\n    if (!fn) return null;\n    if (result) return result.values[`${field}:${fn}`] ?? null;\n    return pageValues?.[field] ?? null;\n  };\n\n  // Read the breakdown from the SAME source the scalar came from. Mixing a\n  // dataset-scope scalar with a page-scope breakdown (or the reverse) would put\n  // two different row sets on one line under one scope caption.\n  const breakdownFor = (field: string): AggregateBreakdownEntry[] | undefined => {\n    const fn = fnByField.get(field);\n    if (!fn) return undefined;\n    if (result) return result.breakdowns?.[`${field}:${fn}`];\n    return pageBreakdowns?.[field];\n  };\n\n  // One cell renderer, two callers \u2014 `colIndex` is always the ABSOLUTE index\n  // into `columns`, whether it came from a plain map or a window segment.\n  const renderFooterCell = (colIndex: number) => {\n    const col = columns[colIndex];\n    if (!col) return null;\n    const width = getColumnWidth(colIndex);\n    const stickyLeft = leftOffsets[colIndex];\n    const stickyRight = rightOffsets[colIndex];\n    const style: React.CSSProperties = {\n      width,\n      flexBasis: width,\n      minWidth: width,\n      flexShrink: 0,\n      flexGrow: 0,\n      position: 'relative',\n    };\n    if (stickyLeft !== undefined) {\n      style.position = 'sticky';\n      style.left = stickyLeft;\n      style.zIndex = 2;\n    } else if (stickyRight !== undefined) {\n      style.position = 'sticky';\n      style.right = stickyRight;\n      style.zIndex = 2;\n    }\n    const fn = fnByField.get(col.data);\n    const value = fn ? valueFor(col.data) : undefined;\n    const breakdown = fn ? breakdownFor(col.data) : undefined;\n    // A dimensioned rule whose source produced NO breakdown (a route that\n    // ignores the dimension in `?aggregate=`) must not silently fall back to\n    // the scalar: that scalar is the cross-currency sum this whole mechanism\n    // exists to stop, and it would be captioned \"All N matching rows\", which\n    // makes it look MORE authoritative, not less. Show the empty placeholder \u2014\n    // \"not available\" is recoverable, a false total is not.\n    const suppressScalar = !!dimensionedFields.has(col.data) && !(breakdown && breakdown.length);\n    return (\n      <div\n        key={col.data}\n        role=\"cell\"\n        aria-colindex={colIndex + 1 + (rowHeaders ? 1 : 0)}\n        data-footer-cell={col.data}\n        className={`hot-cell hot-footer-totals-cell${col.align ? ` cell-align-${col.align}` : ''}${col.mono ? ' cell-mono' : ''}`}\n        style={style}\n      >\n        {fn && !error ? (\n          <span className=\"cell-content hot-footer-totals-value text-body-medium-sm\">\n            {suppressScalar\n              ? AGGREGATE_EMPTY_PLACEHOLDER\n              : formatAggregate(value, col, locale, fn, breakdown)}\n          </span>\n        ) : null}\n      </div>\n    );\n  };\n\n  const totalLabel = t('dynamicTable.aggregation.footerLabel', 'Total');\n  const label = (\n    <div className=\"hot-footer-totals-label text-body-medium-sm\" title={`${totalLabel} \u00B7 ${scopeLabel}`}>\n      <Sigma className=\"hot-footer-totals-sigma\" style={{ width: 14, height: 14 }} />\n      <span data-footer-label>{totalLabel}</span>\n      <span data-footer-scope-label className=\"hot-footer-totals-scope text-body-regular-xs\">\n        {scopeLabel}\n      </span>\n    </div>\n  );\n\n  const rowWidth = totalWidth === undefined ? undefined : `${totalWidth}px`;\n\n  return (\n    <div\n      data-footer-totals\n      data-footer-scope={scope}\n      data-footer-state={error ? 'error' : loading ? 'loading' : 'ready'}\n      data-footer-layout={hasLabelLane ? 'inline' : 'stacked'}\n      className=\"hot-footer-totals\"\n      style={{\n        position: 'sticky',\n        bottom: 0,\n        zIndex: 5,\n        width: rowWidth,\n        background: 'var(--m3-surface-container)',\n        borderTop: '1px solid var(--m3-outline-faint)',\n      }}\n    >\n      {/* NO LEAD TO BORROW: every column from the first one carries a value, so\n          there is no blank run for the label to overflow into. It gets its own\n          caption line instead of being painted on top of a number. `sticky\n          left` keeps it readable while the grid is scrolled horizontally \u2014 the\n          scope statement is normative and may not scroll away from its own\n          counts. */}\n      {!hasLabelLane && (\n        <div className=\"hot-footer-totals-caption\" style={{ position: 'sticky', left: 0, width: 'fit-content' }}>\n          {label}\n        </div>\n      )}\n      <div\n        className=\"hot-footer-totals-row\"\n        role=\"row\"\n        style={{ display: 'flex', width: rowWidth }}\n      >\n        {rowHeaders && (\n          <div\n            className=\"hot-row-header hot-footer-totals-rowheader\"\n            style={{ width: 50, flexBasis: 50, flexShrink: 0, flexGrow: 0, position: 'sticky', left: 0, zIndex: 3 }}\n          />\n        )}\n        {/* Zero-width label that overflows to the right over the leading blank\n            columns, matching the group-summary row's treatment \u2014 but CLAMPED to\n            the width those columns actually give it (see `labelMaxWidth`), so it\n            can never reach the first value. */}\n        {hasLabelLane && (\n          <div\n            className=\"hot-footer-totals-label-cell\"\n            style={{ position: 'relative', zIndex: 2, width: 0, maxWidth: 0 }}\n          >\n            <div className=\"hot-footer-totals-label-clip\" style={{ maxWidth: labelMaxWidth }}>\n              {label}\n            </div>\n          </div>\n        )}\n        {columnWindow?.virtualized\n          ? columnWindow.segments.map((seg) =>\n              seg.type === 'spacer' ? (\n                <div\n                  key={columnSpacerKey(seg.fromIndex, seg.toIndex)}\n                  className=\"hot-cell-spacer\"\n                  aria-hidden=\"true\"\n                  style={columnSpacerStyle(seg.width)}\n                />\n              ) : (\n                renderFooterCell(seg.column.index)\n              ))\n          : columns.map((_, colIndex) => renderFooterCell(colIndex))}\n\n        {showActionsColumn && (\n          <div\n            className=\"hot-cell hot-actions-cell hot-footer-totals-actions\"\n            style={{ width: actionsColumnWidth, flexBasis: actionsColumnWidth, flexShrink: 0, flexGrow: 0, position: 'sticky', right: 0, zIndex: 2 }}\n          />\n        )}\n      </div>\n    </div>\n  );\n});\n\nFooterTotalsRow.displayName = 'FooterTotalsRow';\n\nexport default FooterTotalsRow;\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/backend/dynamic-table/components/FullscreenOverlay.js

@@ -0,0 +1,51 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useCallback } from "react";
+import { createPortal } from "react-dom";
+import { Minimize2 } from "lucide-react";
+const FullscreenOverlay = ({
+  isOpen,
+  onClose,
+  children,
+  tableName
+}) => {
+  const handleKeyDown = useCallback((e) => {
+    if (e.key === "Escape") {
+      onClose();
+    }
+  }, [onClose]);
+  useEffect(() => {
+    if (isOpen) {
+      document.body.style.overflow = "hidden";
+      document.addEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      document.body.style.overflow = "";
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [isOpen, handleKeyDown]);
+  if (!isOpen) return null;
+  const overlayContent = /* @__PURE__ */ jsxs("div", { className: "dynamic-table-fullscreen-overlay", children: [
+    /* @__PURE__ */ jsxs("div", { className: "dynamic-table-fullscreen-header", children: [
+      /* @__PURE__ */ jsxs("div", { className: "dynamic-table-fullscreen-title", children: [
+        tableName && /* @__PURE__ */ jsx("span", { children: tableName }),
+        /* @__PURE__ */ jsx("span", { className: "dynamic-table-fullscreen-badge", children: "Fullscreen" })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: onClose,
+          className: "dynamic-table-fullscreen-close",
+          title: "Exit fullscreen (Esc)",
+          children: /* @__PURE__ */ jsx(Minimize2, { className: "w-5 h-5" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "dynamic-table-fullscreen-content", children })
+  ] });
+  return createPortal(overlayContent, document.body);
+};
+var FullscreenOverlay_default = FullscreenOverlay;
+export {
+  FullscreenOverlay_default as default
+};
+//# sourceMappingURL=FullscreenOverlay.js.map

package/dist/backend/dynamic-table/components/FullscreenOverlay.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/backend/dynamic-table/components/FullscreenOverlay.tsx"],
+  "sourcesContent": ["import React, { useEffect, useCallback } from 'react';\nimport { createPortal } from 'react-dom';\nimport { X, Minimize2 } from 'lucide-react';\n\ninterface FullscreenOverlayProps {\n  isOpen: boolean;\n  onClose: () => void;\n  children: React.ReactNode;\n  tableName?: string;\n}\n\nconst FullscreenOverlay: React.FC<FullscreenOverlayProps> = ({\n  isOpen,\n  onClose,\n  children,\n  tableName,\n}) => {\n  // Handle ESC key to close\n  const handleKeyDown = useCallback((e: KeyboardEvent) => {\n    if (e.key === 'Escape') {\n      onClose();\n    }\n  }, [onClose]);\n\n  // Prevent body scroll when overlay is open\n  useEffect(() => {\n    if (isOpen) {\n      document.body.style.overflow = 'hidden';\n      document.addEventListener('keydown', handleKeyDown);\n    }\n    return () => {\n      document.body.style.overflow = '';\n      document.removeEventListener('keydown', handleKeyDown);\n    };\n  }, [isOpen, handleKeyDown]);\n\n  if (!isOpen) return null;\n\n  const overlayContent = (\n    <div className=\"dynamic-table-fullscreen-overlay\">\n      {/* Header with title and close button */}\n      <div className=\"dynamic-table-fullscreen-header\">\n        <div className=\"dynamic-table-fullscreen-title\">\n          {tableName && <span>{tableName}</span>}\n          <span className=\"dynamic-table-fullscreen-badge\">Fullscreen</span>\n        </div>\n        <button\n          onClick={onClose}\n          className=\"dynamic-table-fullscreen-close\"\n          title=\"Exit fullscreen (Esc)\"\n        >\n          <Minimize2 className=\"w-5 h-5\" />\n        </button>\n      </div>\n\n      {/* Table content */}\n      <div className=\"dynamic-table-fullscreen-content\">\n        {children}\n      </div>\n    </div>\n  );\n\n  return createPortal(overlayContent, document.body);\n};\n\nexport default FullscreenOverlay;\n"],
+  "mappings": "AA0CQ,SACgB,KADhB;AA1CR,SAAgB,WAAW,mBAAmB;AAC9C,SAAS,oBAAoB;AAC7B,SAAY,iBAAiB;AAS7B,MAAM,oBAAsD,CAAC;AAAA,EAC3D;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AAEJ,QAAM,gBAAgB,YAAY,CAAC,MAAqB;AACtD,QAAI,EAAE,QAAQ,UAAU;AACtB,cAAQ;AAAA,IACV;AAAA,EACF,GAAG,CAAC,OAAO,CAAC;AAGZ,YAAU,MAAM;AACd,QAAI,QAAQ;AACV,eAAS,KAAK,MAAM,WAAW;AAC/B,eAAS,iBAAiB,WAAW,aAAa;AAAA,IACpD;AACA,WAAO,MAAM;AACX,eAAS,KAAK,MAAM,WAAW;AAC/B,eAAS,oBAAoB,WAAW,aAAa;AAAA,IACvD;AAAA,EACF,GAAG,CAAC,QAAQ,aAAa,CAAC;AAE1B,MAAI,CAAC,OAAQ,QAAO;AAEpB,QAAM,iBACJ,qBAAC,SAAI,WAAU,oCAEb;AAAA,yBAAC,SAAI,WAAU,mCACb;AAAA,2BAAC,SAAI,WAAU,kCACZ;AAAA,qBAAa,oBAAC,UAAM,qBAAU;AAAA,QAC/B,oBAAC,UAAK,WAAU,kCAAiC,wBAAU;AAAA,SAC7D;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,SAAS;AAAA,UACT,WAAU;AAAA,UACV,OAAM;AAAA,UAEN,8BAAC,aAAU,WAAU,WAAU;AAAA;AAAA,MACjC;AAAA,OACF;AAAA,IAGA,oBAAC,SAAI,WAAU,oCACZ,UACH;AAAA,KACF;AAGF,SAAO,aAAa,gBAAgB,SAAS,IAAI;AACnD;AAEA,IAAO,4BAAQ;",
+  "names": []
+}