@proveanything/smartlinks-utils-ui 0.9.2 → 0.9.4

package/dist/components/RecordsAdmin/index.js

@@ -1,11 +1,12 @@
+import { assertComponentStylesLoaded } from '../../chunk-OLYC54YT.js';
 import '../../chunk-5UQQYXCX.js';
 import { FacetRuleEditor } from '../../chunk-JMCV6FOW.js';
 import { useFacets } from '../../chunk-4LHF5JB7.js';
 import { cn } from '../../chunk-L7FQ52F5.js';
-import { parsedRefToTarget, parsedRefToScope, matchRecords, scopesEqual, getRecordById, listRecords, upsertRecord, updateRecord, createRecord, removeRecord } from '../../chunk-KFKVGUUP.js';
-export { bulkDelete, bulkUpsert, createRecord, getRecordById, listRecords, matchRecords, parsedRefToScope, parsedRefToTarget, removeRecord, restoreRecord, scopesEqual, upsertRecord } from '../../chunk-KFKVGUUP.js';
-import { createContext, useState, useEffect, useCallback, useMemo, useRef, useContext, useSyncExternalStore, createElement, useId } from 'react';
-import { ChevronDown, Database, Lightbulb, SearchX, Inbox, LayoutGrid, Eye, MoreHorizontal, Download, Upload, Trash2, Copy, Pencil, Plus, CircleDashed, ArrowDownLeft, CheckCircle2, List, SlidersHorizontal, Globe, Tag, Boxes, Layers, Package, Rows3, ChevronRight, Eraser, ClipboardPaste, Box, X, Image, Table, ArrowLeft, ChevronLeft, AlertTriangle, Info, HelpCircle, Search, CornerDownLeft, Circle, AlertCircle, Undo2, Save, Loader2, XCircle, ArrowRight, BookOpen, Globe2, Target, Check, Settings2 } from 'lucide-react';
+import { parsedRefToTarget, parsedRefToScope, matchRecords, scopesEqual, getRecordById, listRecords, upsertRecord, updateRecord, createRecord, removeRecord } from '../../chunk-KA4MKRHL.js';
+export { bulkDelete, bulkUpsert, createRecord, getRecordById, listRecords, matchRecords, parsedRefToScope, parsedRefToTarget, removeRecord, restoreRecord, scopesEqual, upsertRecord } from '../../chunk-KA4MKRHL.js';
+import { createContext, useState, useEffect, useCallback, useMemo, useRef, useContext, useSyncExternalStore, useLayoutEffect, createElement, useId } from 'react';
+import { ChevronDown, Database, Lightbulb, SearchX, Inbox, LayoutGrid, Eye, MoreHorizontal, Download, Upload, Trash2, Copy, Pencil, Plus, CircleDashed, ArrowDownLeft, CheckCircle2, List, SlidersHorizontal, Globe, Tag, Boxes, Layers, Package, Rows3, ChevronRight, Eraser, ClipboardPaste, Box, X, Search, Image, Table, ArrowLeft, ChevronLeft, AlertTriangle, Info, HelpCircle, CornerDownLeft, Circle, AlertCircle, Undo2, Save, Loader2, XCircle, ArrowRight, BookOpen, Globe2, Target, Check, Settings2 } from 'lucide-react';
 import { useQuery, useQueryClient, useInfiniteQuery } from '@tanstack/react-query';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { createPortal } from 'react-dom';
@@ -267,10 +268,12 @@ var ruleHash = (rule) => {
   if (!norm) return null;
   return fnv1a(JSON.stringify(norm));
 };
-var summariseRule = (rule) => {
+var summariseRule = (rule, lookup) => {
   const norm = normaliseRule(rule);
   if (!norm) return "No rule";
-  return norm.all.map((c) => `${c.facetKey}=${c.anyOf.join(",")}`).join(" \xB7 ");
+  const fLabel = (k) => lookup?.facetLabel?.(k) ?? k;
+  const vLabel = (k, v) => lookup?.valueLabel?.(k, v) ?? v;
+  return norm.all.map((c) => `${fLabel(c.facetKey)}: ${c.anyOf.map((v) => vLabel(c.facetKey, v)).join(", ")}`).join(" \xB7 ");
 };
 var rulesEqual = (a, b) => ruleHash(a) === ruleHash(b);
 
@@ -280,18 +283,6 @@ var resolveRecord = async (args) => {
   const editingScope = parsedRefToScope(args.target);
   const result = await matchRecords(args.ctx, target, { strategy: "all" }).catch(() => null);
   const entries = result?.data ?? [];
-  console.info("[RecordsAdmin/resolveRecord]", {
-    editingScope,
-    target,
-    matchCount: entries.length,
-    winnerAnchors: entries[0] && {
-      productId: entries[0].productId,
-      variantId: entries[0].variantId,
-      batchId: entries[0].batchId,
-      proofId: entries[0].proofId
-    },
-    winnerRef: entries[0]?.ref
-  });
   if (entries.length === 0) {
     return { data: null, source: "empty" };
   }
@@ -305,16 +296,6 @@ var resolveRecord = async (args) => {
     },
     editingScope
   );
-  console.info("[RecordsAdmin/resolveRecord] classification", {
-    winnerIsSelf,
-    winnerAnchors: {
-      productId: winner.productId,
-      variantId: winner.variantId,
-      batchId: winner.batchId,
-      proofId: winner.proofId
-    },
-    editingScope
-  });
   if (winnerIsSelf) {
     const parent = entries[1];
     return {
@@ -1833,11 +1814,6 @@ function useShellNavigation(args) {
   const onItemOpen = useCallback((itemId) => {
     if (!isCollection) return;
     void runWithGuard(() => {
-      console.info("[RecordsAdminShell] item open requested", {
-        itemId,
-        scopeRef: baseScopeRef,
-        previousSelectedItemId: selectedItemId
-      });
       if (!isDraftId(itemId)) {
         const row = collectionItems.items.find((it) => it.itemId === itemId || it.id === itemId);
         if (row && row.data !== void 0) {
@@ -1938,7 +1914,7 @@ function useShellNavigation(args) {
       }
     }
     try {
-      const { removeRecord: removeRecord2 } = await import('../../records-AYYQSP7E.js');
+      const { removeRecord: removeRecord2 } = await import('../../records-4NN757SG.js');
       await removeRecord2(ctx, itemId);
       onTelemetry?.({ type: "item.delete", recordType, scopeRef: baseScopeRef, itemId });
       if (selectedItemId === itemId) setSelectedItemId(null);
@@ -2113,16 +2089,30 @@ var useShellDeepLink = (args) => {
     setSelectedVariantId,
     selectedBatchId,
     setSelectedBatchId,
-    setFacetBrowseFilter
+    setFacetBrowseFilter,
+    isCollection,
+    setSelectedItemId,
+    collectionItems,
+    recordListItems,
+    recordListLoading,
+    skipNextItemResetRef
   } = args;
   const lastAppliedDLRef = useRef("");
   const [pendingDeepLinkRecordId, setPendingDeepLinkRecordId] = useState(null);
+  const preserveInitialRecordIdRef = useRef(!!deepLinkState.urlState.recordId);
+  const warnedMissingRef = useRef(/* @__PURE__ */ new Set());
   useEffect(() => {
     if (!deepLinkState.enabled) return;
     if (selectedItemId) return;
-    deepLinkState.emit({ scope: editingScope?.raw ?? null, recordId: null }, "scope");
-    lastAppliedDLRef.current = `${""}|${editingScope?.raw ?? ""}|${itemView}`;
-  }, [deepLinkState.enabled, editingScope?.raw, selectedItemId, itemView]);
+    const echoView = deepLinkState.urlState.view ?? "";
+    const currentDeepLinkedRecordId = pendingDeepLinkRecordId ?? deepLinkState.urlState.recordId ?? null;
+    const preservingPendingRecordId = preserveInitialRecordIdRef.current && !!currentDeepLinkedRecordId;
+    deepLinkState.emit(
+      preservingPendingRecordId ? { scope: editingScope?.raw ?? null } : { scope: editingScope?.raw ?? null, recordId: null },
+      "scope"
+    );
+    lastAppliedDLRef.current = `${preservingPendingRecordId ? currentDeepLinkedRecordId ?? "" : ""}|${editingScope?.raw ?? ""}|${echoView}`;
+  }, [deepLinkState.enabled, deepLinkState.urlState.recordId, editingScope?.raw, selectedItemId, itemView, pendingDeepLinkRecordId]);
   useEffect(() => {
     if (!deepLinkState.enabled) return;
     const { recordId, scope, view } = deepLinkState.urlState;
@@ -2151,6 +2141,7 @@ var useShellDeepLink = (args) => {
       if (selectedRecordId !== null) setSelectedRecordId(null);
     }
     setPendingDeepLinkRecordId(recordId ?? null);
+    if (recordId) preserveInitialRecordIdRef.current = true;
     if (!recordId && selectedItemId !== null) {
       console.info("[RecordsAdminShell] preserving selected item during restore without recordId", {
         selectedItemId,
@@ -2159,6 +2150,57 @@ var useShellDeepLink = (args) => {
       });
     }
   }, [deepLinkState.enabled, deepLinkState.urlState]);
+  useEffect(() => {
+    const pending = pendingDeepLinkRecordId;
+    if (!pending) return;
+    if (isCollection) {
+      const hit2 = collectionItems.items.find((it) => it.id === pending || it.itemId === pending);
+      if (hit2) {
+        skipNextItemResetRef.current = true;
+        setSelectedItemId(pending);
+        preserveInitialRecordIdRef.current = false;
+        setPendingDeepLinkRecordId(null);
+        return;
+      }
+      if (!collectionItems.isLoading) {
+        if (!warnedMissingRef.current.has(pending)) {
+          warnedMissingRef.current.add(pending);
+          console.warn("[RecordsAdminShell] deep-linked recordId not found in collection items \u2014 clearing pending selection", {
+            recordId: pending,
+            scope: editingScope?.raw ?? null
+          });
+        }
+        preserveInitialRecordIdRef.current = false;
+        setPendingDeepLinkRecordId(null);
+      }
+      return;
+    }
+    const hit = recordListItems.find((it) => it.id === pending);
+    if (hit) {
+      if (selectedRecordId !== pending) setSelectedRecordId(pending);
+      preserveInitialRecordIdRef.current = false;
+      setPendingDeepLinkRecordId(null);
+      return;
+    }
+    if (!recordListLoading) {
+      if (!warnedMissingRef.current.has(pending)) {
+        warnedMissingRef.current.add(pending);
+        console.warn("[RecordsAdminShell] deep-linked recordId not found in records list \u2014 clearing pending selection", {
+          recordId: pending,
+          scope: editingScope?.raw ?? null
+        });
+      }
+      preserveInitialRecordIdRef.current = false;
+      setPendingDeepLinkRecordId(null);
+    }
+  }, [
+    pendingDeepLinkRecordId,
+    isCollection,
+    collectionItems.items,
+    collectionItems.isLoading,
+    recordListItems,
+    recordListLoading
+  ]);
   return { pendingDeepLinkRecordId, lastAppliedDLRef };
 };
 var isFacetRuleValid = (rule) => {
@@ -3196,10 +3238,16 @@ var RowContextMenu = ({
 }) => {
   const [open, setOpen] = useState(false);
   const wrapperRef = useRef(null);
+  const triggerRef = useRef(null);
+  const menuRef = useRef(null);
+  const [pos, setPos] = useState(null);
   useEffect(() => {
     if (!open) return;
     const onDoc = (e) => {
-      if (!wrapperRef.current?.contains(e.target)) setOpen(false);
+      const t = e.target;
+      if (wrapperRef.current?.contains(t)) return;
+      if (menuRef.current?.contains(t)) return;
+      setOpen(false);
     };
     const onKey = (e) => {
       if (e.key === "Escape") setOpen(false);
@@ -3211,12 +3259,36 @@ var RowContextMenu = ({
       document.removeEventListener("keydown", onKey);
     };
   }, [open]);
+  useLayoutEffect(() => {
+    if (!open) {
+      setPos(null);
+      return;
+    }
+    const update = () => {
+      const el = triggerRef.current;
+      if (!el) return;
+      const r = el.getBoundingClientRect();
+      const menuWidth = menuRef.current?.offsetWidth ?? 176;
+      const margin = 8;
+      const left = Math.max(margin, Math.min(window.innerWidth - menuWidth - margin, r.right - menuWidth));
+      const top = r.bottom + 4;
+      setPos({ top, left });
+    };
+    update();
+    window.addEventListener("resize", update);
+    window.addEventListener("scroll", update, true);
+    return () => {
+      window.removeEventListener("resize", update);
+      window.removeEventListener("scroll", update, true);
+    };
+  }, [open]);
   if (!onCopy && !onPaste) return null;
   const pasteLabel = !canPaste ? i18n.clipboardEmpty : pasteSourceLabel ? i18n.pasteFrom.replace("{name}", pasteSourceLabel) : pasteWillReplace ? i18n.pasteReplace : i18n.paste;
   return /* @__PURE__ */ jsxs("div", { ref: wrapperRef, className: "ra-row-menu-wrap relative", children: [
     /* @__PURE__ */ jsx(
       "button",
       {
+        ref: triggerRef,
         type: "button",
         className: "ra-row-menu-trigger",
         "aria-label": "Row actions",
@@ -3229,75 +3301,106 @@ var RowContextMenu = ({
         children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "w-3.5 h-3.5", "aria-hidden": "true" })
       }
     ),
-    open && /* @__PURE__ */ jsxs("div", { role: "menu", className: "ra-row-menu", onClick: (e) => e.stopPropagation(), children: [
-      onCopy && /* @__PURE__ */ jsxs(
-        "button",
+    open && typeof document !== "undefined" && createPortal(
+      /* @__PURE__ */ jsxs(
+        "div",
         {
-          type: "button",
-          role: "menuitem",
-          className: "ra-row-menu-item",
-          onClick: (e) => {
-            e.stopPropagation();
-            setOpen(false);
-            onCopy();
-          },
+          ref: menuRef,
+          role: "menu",
+          className: "ra-row-menu ra-row-menu-portal",
+          style: pos ? { top: pos.top, left: pos.left } : { visibility: "hidden" },
+          onClick: (e) => e.stopPropagation(),
+          onMouseDown: (e) => e.stopPropagation(),
           children: [
-            /* @__PURE__ */ jsx(Copy, { className: "w-3 h-3", "aria-hidden": "true" }),
-            /* @__PURE__ */ jsx("span", { children: i18n.copy })
+            onCopy && /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                role: "menuitem",
+                className: "ra-row-menu-item",
+                onClick: (e) => {
+                  e.stopPropagation();
+                  setOpen(false);
+                  onCopy();
+                },
+                children: [
+                  /* @__PURE__ */ jsx(Copy, { className: "w-3 h-3", "aria-hidden": "true" }),
+                  /* @__PURE__ */ jsx("span", { children: i18n.copy })
+                ]
+              }
+            ),
+            onPaste && /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                role: "menuitem",
+                className: "ra-row-menu-item",
+                disabled: !canPaste,
+                onClick: (e) => {
+                  e.stopPropagation();
+                  setOpen(false);
+                  if (canPaste) onPaste();
+                },
+                children: [
+                  /* @__PURE__ */ jsx(ClipboardPaste, { className: "w-3 h-3", "aria-hidden": "true" }),
+                  /* @__PURE__ */ jsx("span", { className: "truncate", children: pasteLabel })
+                ]
+              }
+            )
           ]
         }
       ),
-      onPaste && /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          role: "menuitem",
-          className: "ra-row-menu-item",
-          disabled: !canPaste,
-          onClick: (e) => {
-            e.stopPropagation();
-            setOpen(false);
-            if (canPaste) onPaste();
-          },
-          children: [
-            /* @__PURE__ */ jsx(ClipboardPaste, { className: "w-3 h-3", "aria-hidden": "true" }),
-            /* @__PURE__ */ jsx("span", { className: "truncate", children: pasteLabel })
-          ]
-        }
-      )
-    ] })
+      document.body
+    )
   ] });
 };
 
 // src/components/RecordsAdmin/browser/formatFacetRule.ts
-function formatFacetRule(rule) {
+function formatFacetRule(rule, lookup) {
   if (!rule || !rule.all || rule.all.length === 0) return null;
+  const fLabel = (k) => lookup?.facetLabel?.(k) ?? k;
+  const vLabel = (k, v) => lookup?.valueLabel?.(k, v) ?? v;
   const parts = rule.all.map((c) => {
     const vals = (c.anyOf ?? []).filter(Boolean);
-    if (vals.length === 0) return `${c.facetKey} (no values)`;
-    if (vals.length === 1) return `${c.facetKey} = ${vals[0]}`;
-    return `${c.facetKey} \u2208 {${vals.join(", ")}}`;
+    const fk = fLabel(c.facetKey);
+    if (vals.length === 0) return `${fk} (no values)`;
+    if (vals.length === 1) return `${fk} = ${vLabel(c.facetKey, vals[0])}`;
+    return `${fk} \u2208 {${vals.map((v) => vLabel(c.facetKey, v)).join(", ")}}`;
   });
   return parts.join(" AND ");
 }
-function summarizeFacetRule(rule) {
+function summarizeFacetRule(rule, lookup) {
   if (!rule || !rule.all || rule.all.length === 0) return [];
+  const fLabel = (k) => lookup?.facetLabel?.(k) ?? k;
+  const vLabel = (k, v) => lookup?.valueLabel?.(k, v) ?? v;
   return rule.all.map((c) => {
-    const values = (c.anyOf ?? []).filter(Boolean);
+    const rawValues = (c.anyOf ?? []).filter(Boolean);
+    const values = rawValues.map((v) => vLabel(c.facetKey, v));
+    const fk = fLabel(c.facetKey);
     let label;
-    if (values.length === 0) label = `${c.facetKey}: \u2014`;
-    else if (values.length === 1) label = `${c.facetKey}: ${values[0]}`;
-    else if (values.length <= 3) label = `${c.facetKey}: ${values.join(", ")}`;
-    else label = `${c.facetKey}: ${values.slice(0, 2).join(", ")} +${values.length - 2}`;
+    if (values.length === 0) label = `${fk}: \u2014`;
+    else if (values.length === 1) label = `${fk}: ${values[0]}`;
+    else if (values.length <= 3) label = `${fk}: ${values.join(", ")}`;
+    else label = `${fk}: ${values.slice(0, 2).join(", ")} +${values.length - 2}`;
     return { facetKey: c.facetKey, values, label };
   });
 }
+var RuleLabelLookupContext = createContext(null);
+var useRuleLabelLookup = () => useContext(RuleLabelLookupContext) ?? void 0;
+var RuleLabelLookupProvider = ({
+  value,
+  children
+}) => {
+  const v = useMemo(() => value, [value]);
+  return /* @__PURE__ */ jsx(RuleLabelLookupContext.Provider, { value: v, children });
+};
 var DefaultRecordRow = ({ record, ctx, compact = false }) => {
   const { selected, onSelect, isDirty, hasError, onCopy, onPaste, canPaste, pasteWillReplace, clipboardSourceLabel } = ctx;
+  const ruleLabelLookup = useRuleLabelLookup();
   const ScopeIcon = record.scope.kind && record.scope.kind !== "collection" ? DEFAULT_ICONS.scope[record.scope.kind] : DEFAULT_ICONS.scope.product;
   const tone = resolveTone(void 0, record.status);
-  const ruleSummary = formatFacetRule(record.facetRule);
-  const ruleClauses = summarizeFacetRule(record.facetRule);
+  const ruleSummary = formatFacetRule(record.facetRule, ruleLabelLookup);
+  const ruleClauses = summarizeFacetRule(record.facetRule, ruleLabelLookup);
   const isRuleRecord = ruleClauses.length > 0;
   const i18n = ctx.i18n ?? DEFAULT_I18N;
   const subtitle = record.subtitle ?? (isRuleRecord ? null : ruleSummary) ?? (tone === "missing" ? i18n.subtitleEmpty : tone === "own" ? i18n.subtitleConfigured : i18n.subtitleInherited);
@@ -3338,9 +3441,9 @@ var DefaultRecordRow = ({ record, ctx, compact = false }) => {
           !compact && !isRuleRecord && /* @__PURE__ */ jsx("div", { className: "ra-row-sub", children: subtitle })
         ] }),
         compact && /* @__PURE__ */ jsx(StatusIcon, { status: record.status, size: "0.85rem" }),
-        !compact && record.scope.kind && record.scope.kind !== "collection" && /* @__PURE__ */ jsx("span", { className: "ra-row-scope", "aria-hidden": "true", children: /* @__PURE__ */ jsx(ScopeIcon, { className: "w-3 h-3" }) }),
+        !compact && record.scope.kind && record.scope.kind !== "collection" && record.scope.kind !== "rule" && /* @__PURE__ */ jsx("span", { className: "ra-row-scope", "aria-hidden": "true", children: /* @__PURE__ */ jsx(ScopeIcon, { className: "w-3 h-3" }) }),
         record.badges?.slice(0, 1).map((b, i) => /* @__PURE__ */ jsx("span", { className: "ra-chip", "data-tone": "muted", children: b.label }, `${b.label}-${i}`)),
-        record.facetRule && !compact && /* @__PURE__ */ jsx(
+        record.facetRule && !compact && !isRuleRecord && /* @__PURE__ */ jsx(
           "span",
           {
             className: "ra-row-rule-pip",
@@ -3848,15 +3951,19 @@ function useCollectionItems(args) {
 
 // src/components/RecordsAdmin/data/deepLinkAdapter.ts
 var findQueryHost = (loc) => {
-  if (loc.search && loc.search.length > 1) return "search";
+  if (loc.hash && loc.hash.startsWith("#/")) return "hash";
   if (loc.hash && loc.hash.includes("?")) return "hash";
+  if (loc.search && loc.search.length > 1) return "search";
   return "search";
 };
-var getQueryString = (loc) => {
-  const host = findQueryHost(loc);
-  if (host === "search") return loc.search.startsWith("?") ? loc.search.slice(1) : loc.search;
+var getSearchParams = (loc) => new URLSearchParams(loc.search.startsWith("?") ? loc.search.slice(1) : loc.search);
+var getHashParams = (loc) => {
   const idx = loc.hash.indexOf("?");
-  return idx >= 0 ? loc.hash.slice(idx + 1) : "";
+  return new URLSearchParams(idx >= 0 ? loc.hash.slice(idx + 1) : "");
+};
+var getReadParams = (loc) => {
+  if (loc.hash && loc.hash.includes("?")) return getHashParams(loc);
+  return getSearchParams(loc);
 };
 var buildUrl = (loc, nextQuery) => {
   const host = findQueryHost(loc);
@@ -3870,7 +3977,7 @@ var buildUrl = (loc, nextQuery) => {
 var createDefaultDeepLinkAdapter = (paramNames) => ({
   read() {
     if (typeof window === "undefined") return {};
-    const params = new URLSearchParams(getQueryString(window.location));
+    const params = getReadParams(window.location);
     return {
       recordId: params.get(paramNames.recordId),
       scope: params.get(paramNames.scope),
@@ -3879,7 +3986,7 @@ var createDefaultDeepLinkAdapter = (paramNames) => ({
   },
   write(partial, mode) {
     if (typeof window === "undefined") return;
-    const params = new URLSearchParams(getQueryString(window.location));
+    const params = findQueryHost(window.location) === "hash" ? getHashParams(window.location) : getSearchParams(window.location);
     const apply = (key, value) => {
       if (value == null || value === "") params.delete(key);
       else params.set(key, value);
@@ -3913,14 +4020,22 @@ var CONTEXT_KEYS = [
   "lang",
   "theme"
 ];
-var findQueryString = (loc) => {
-  if (loc.search && loc.search.length > 1) {
-    return loc.search.startsWith("?") ? loc.search.slice(1) : loc.search;
-  }
-  if (loc.hash && loc.hash.includes("?")) {
-    return loc.hash.slice(loc.hash.indexOf("?") + 1);
-  }
-  return "";
+var getSearchParams2 = (loc) => new URLSearchParams(loc.search.startsWith("?") ? loc.search.slice(1) : loc.search);
+var getHashParams2 = (loc) => {
+  const idx = loc.hash.indexOf("?");
+  return new URLSearchParams(idx >= 0 ? loc.hash.slice(idx + 1) : "");
+};
+var getReadParams2 = (loc) => {
+  if (loc.hash && loc.hash.includes("?")) return getHashParams2(loc);
+  return getSearchParams2(loc);
+};
+var getMergedParams = (loc) => {
+  const merged = getSearchParams2(loc);
+  const hashParams = getHashParams2(loc);
+  hashParams.forEach((value, key) => {
+    merged.set(key, value);
+  });
+  return merged;
 };
 var findPath = (loc) => {
   if (loc.hash && loc.hash.startsWith("#")) {
@@ -3943,7 +4058,7 @@ var createPostMessageDeepLinkAdapter = (paramNames) => {
   const lastShellState = {};
   const post = (path) => {
     if (typeof window === "undefined") return;
-    const params = new URLSearchParams(findQueryString(window.location));
+    const params = getMergedParams(window.location);
     const context = {};
     const state = {};
     params.forEach((value, key) => {
@@ -3967,9 +4082,6 @@ var createPostMessageDeepLinkAdapter = (paramNames) => {
         state,
         appId: context.appId
       };
-      console.debug("[smartlinks-ui] postMessage \u2192 parent", message, {
-        sameWindow: window.parent === window
-      });
       window.parent.postMessage(message, "*");
     } catch {
     }
@@ -3977,7 +4089,7 @@ var createPostMessageDeepLinkAdapter = (paramNames) => {
   return {
     read() {
       if (typeof window === "undefined") return {};
-      const params = new URLSearchParams(findQueryString(window.location));
+      const params = getReadParams2(window.location);
       return {
         recordId: params.get(paramNames.recordId),
         scope: params.get(paramNames.scope),
@@ -4012,7 +4124,7 @@ var classify2 = (mode, kind) => {
   return SMART_PUSH.includes(kind) ? "push" : "replace";
 };
 function useDeepLinkState(options) {
-  const enabled = !!options?.enabled;
+  const enabled = options?.enabled !== false;
   const history = options?.history ?? "smart";
   const paramNames = useMemo(() => ({
     ...DEFAULT_DEEP_LINK_PARAM_NAMES,
@@ -4024,11 +4136,6 @@ function useDeepLinkState(options) {
     if (options?.adapter) return options.adapter;
     if (!defaultAdapterRef.current) {
       const inIframe = isInSmartLinksIframe();
-      console.debug("[smartlinks-ui] deep-link adapter selected", {
-        adapter: inIframe ? "postMessage" : "default",
-        inIframe,
-        href: typeof window !== "undefined" ? window.location.href : "(ssr)"
-      });
       defaultAdapterRef.current = inIframe ? createPostMessageDeepLinkAdapter(paramNames) : createDefaultDeepLinkAdapter(paramNames);
     }
     return defaultAdapterRef.current;
@@ -4042,7 +4149,9 @@ function useDeepLinkState(options) {
     return adapter.subscribe(() => setUrlState(adapter.read()));
   }, [adapter]);
   const emit = useCallback((partial, kind) => {
-    if (!adapter) return;
+    if (!adapter) {
+      return;
+    }
     const mode = classify2(history, kind);
     adapter.write(partial, mode);
     setUrlState((prev) => ({ ...prev, ...partial }));
@@ -5101,14 +5210,16 @@ var PreviewScopePicker = ({
   onChange,
   showVariants,
   showBatches,
+  activeScope,
   i18n
 }) => {
   const productPinned = !!editingScope.productId;
+  const hideForTab = activeScope === "product" || activeScope === "variant" || activeScope === "batch";
   const products = useProductBrowse({
     SL,
     collectionId,
     pageSize: 100,
-    enabled: !productPinned
+    enabled: !productPinned && !hideForTab
   });
   const variants = useProductChildren({
     SL,
@@ -5122,11 +5233,8 @@ var PreviewScopePicker = ({
     productId: value.productId,
     kind: showBatches ? "batch" : null
   });
-  const isDefault = useMemo(
-    () => value.raw === editingScope.raw,
-    [value.raw, editingScope.raw]
-  );
   useEffect(() => {
+    if (hideForTab) return;
     if (productPinned) return;
     if (value.productId) return;
     const first = products.items[0];
@@ -5138,9 +5246,10 @@ var PreviewScopePicker = ({
       batchId: void 0,
       raw: `product:${first.id}`
     });
-  }, [productPinned, value.productId, products.items]);
-  const [productPickerOpen, setProductPickerOpen] = useState(false);
-  const showProductPicker = !productPinned && products.items.length > 1;
+  }, [hideForTab, productPinned, value.productId, products.items]);
+  const [lightboxOpen, setLightboxOpen] = useState(false);
+  if (hideForTab) return null;
+  const showProductPicker = !productPinned;
   const showVariantPicker = showVariants && !!value.productId && variants.items.length > 0;
   const showBatchPicker = showBatches && !!value.productId && batches.items.length > 0;
   if (!showProductPicker && !showVariantPicker && !showBatchPicker) {
@@ -5151,6 +5260,16 @@ var PreviewScopePicker = ({
     borderColor: "hsl(var(--ra-border))",
     color: "hsl(var(--ra-text))"
   };
+  const pickProduct = (productId) => {
+    onChange({
+      ...value,
+      productId,
+      variantId: void 0,
+      batchId: void 0,
+      raw: `product:${productId}`
+    });
+    setLightboxOpen(false);
+  };
   return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
     /* @__PURE__ */ jsxs(
       "span",
@@ -5163,56 +5282,27 @@ var PreviewScopePicker = ({
         ]
       }
     ),
-    !isDefault && /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        onClick: () => onChange(editingScope),
-        className: "text-[10px] px-2 py-1 rounded-md border hover:bg-[hsl(var(--ra-muted))]",
-        style: selectStyle,
-        children: [
-          "\u21BA ",
-          i18n?.previewAsDefault ?? "Same as edited"
-        ]
-      }
-    ),
-    showProductPicker && !productPickerOpen && currentProductName && /* @__PURE__ */ jsxs(
-      "button",
+    showProductPicker && /* @__PURE__ */ jsxs(
+      "span",
       {
-        type: "button",
-        onClick: () => setProductPickerOpen(true),
-        className: "text-[10px] px-2 py-1 rounded-md border hover:bg-[hsl(var(--ra-muted))] inline-flex items-center gap-1 max-w-[12rem] truncate",
-        style: selectStyle,
-        title: `Preview as ${currentProductName} \u2014 click to change`,
+        className: "inline-flex items-center gap-1.5 text-[11px] truncate max-w-[18rem]",
+        style: { color: "hsl(var(--ra-text))" },
         children: [
-          "as ",
-          /* @__PURE__ */ jsx("span", { className: "font-medium truncate", children: currentProductName }),
-          /* @__PURE__ */ jsx(ChevronDown, { className: "w-3 h-3 opacity-60" })
+          /* @__PURE__ */ jsx("span", { className: "font-medium truncate", title: currentProductName, children: currentProductName || "\u2014" }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => setLightboxOpen(true),
+              className: "text-[10px] px-1.5 py-0.5 rounded-md border hover:bg-[hsl(var(--ra-muted))]",
+              style: selectStyle,
+              title: i18n?.change ?? "Change preview product",
+              children: i18n?.change ?? "Change"
+            }
+          )
         ]
       }
     ),
-    showProductPicker && productPickerOpen && /* @__PURE__ */ jsx(
-      "select",
-      {
-        className: SELECT_CLS,
-        style: selectStyle,
-        autoFocus: true,
-        onBlur: () => setProductPickerOpen(false),
-        value: value.productId ?? "",
-        onChange: (e) => {
-          const productId = e.target.value || void 0;
-          onChange({
-            ...value,
-            productId,
-            variantId: void 0,
-            batchId: void 0,
-            raw: productId ? `product:${productId}` : ""
-          });
-          setProductPickerOpen(false);
-        },
-        children: products.items.map((p) => /* @__PURE__ */ jsx("option", { value: p.id, children: p.name }, p.id))
-      }
-    ),
     showVariantPicker && /* @__PURE__ */ jsxs(
       "select",
       {
@@ -5253,9 +5343,161 @@ var PreviewScopePicker = ({
           batches.items.map((b) => /* @__PURE__ */ jsx("option", { value: b.id, children: b.name }, b.id))
         ]
       }
+    ),
+    lightboxOpen && /* @__PURE__ */ jsx(
+      ProductPickerLightbox,
+      {
+        SL,
+        collectionId,
+        currentProductId: value.productId,
+        onPick: pickProduct,
+        onClose: () => setLightboxOpen(false),
+        i18n
+      }
     )
   ] });
 };
+var ProductPickerLightbox = ({
+  SL,
+  collectionId,
+  currentProductId,
+  onPick,
+  onClose,
+  i18n
+}) => {
+  const [search, setSearch] = useState("");
+  const inputRef = useRef(null);
+  const browse = useProductBrowse({
+    SL,
+    collectionId,
+    search,
+    pageSize: 50,
+    enabled: true
+  });
+  useEffect(() => {
+    const prev = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
+    const t = window.setTimeout(() => inputRef.current?.focus(), 0);
+    const onKey = (e) => {
+      if (e.key === "Escape") {
+        e.stopPropagation();
+        onClose();
+      }
+    };
+    window.addEventListener("keydown", onKey, true);
+    return () => {
+      window.clearTimeout(t);
+      window.removeEventListener("keydown", onKey, true);
+      document.body.style.overflow = prev;
+    };
+  }, [onClose]);
+  if (typeof document === "undefined") return null;
+  return createPortal(
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "ra-shell ra-confirm-root",
+        role: "presentation",
+        onMouseDown: (e) => e.stopPropagation(),
+        onClick: (e) => e.stopPropagation(),
+        onTouchStart: (e) => e.stopPropagation(),
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "ra-confirm-backdrop", onClick: onClose }),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              role: "dialog",
+              "aria-modal": "true",
+              "aria-label": i18n?.searchProducts ?? "Search products",
+              className: "ra-confirm-card",
+              style: { width: "min(520px, 100%)", padding: "1rem" },
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-3", children: [
+                  /* @__PURE__ */ jsx(Search, { className: "w-4 h-4 opacity-60" }),
+                  /* @__PURE__ */ jsx(
+                    "input",
+                    {
+                      ref: inputRef,
+                      type: "text",
+                      value: search,
+                      onChange: (e) => setSearch(e.target.value),
+                      placeholder: i18n?.searchProducts ?? "Search products\u2026",
+                      className: "flex-1 text-sm px-2 py-1.5 rounded-md border bg-transparent focus:outline-none focus:ring-1",
+                      style: {
+                        borderColor: "hsl(var(--ra-border))",
+                        color: "hsl(var(--ra-text))"
+                      }
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: onClose,
+                      className: "p-1 rounded-md hover:bg-[hsl(var(--ra-muted))]",
+                      "aria-label": i18n?.close ?? "Close",
+                      style: { color: "hsl(var(--ra-muted-text))" },
+                      children: /* @__PURE__ */ jsx(X, { className: "w-4 h-4" })
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: "overflow-y-auto rounded-md border",
+                    style: {
+                      maxHeight: "50vh",
+                      borderColor: "hsl(var(--ra-border))"
+                    },
+                    children: [
+                      browse.isLoading && browse.items.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-xs px-3 py-4 text-center", style: { color: "hsl(var(--ra-muted-text))" }, children: "Loading\u2026" }) : browse.items.length === 0 ? /* @__PURE__ */ jsx("div", { className: "text-xs px-3 py-4 text-center", style: { color: "hsl(var(--ra-muted-text))" }, children: "No products match." }) : /* @__PURE__ */ jsx("ul", { className: "divide-y", style: { borderColor: "hsl(var(--ra-border))" }, children: browse.items.map((p) => {
+                        const active = p.id === currentProductId;
+                        return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+                          "button",
+                          {
+                            type: "button",
+                            onClick: () => onPick(p.id),
+                            className: "w-full text-left px-3 py-2 text-sm hover:bg-[hsl(var(--ra-muted))] flex items-center justify-between gap-3",
+                            style: {
+                              color: "hsl(var(--ra-text))",
+                              background: active ? "hsl(var(--ra-muted))" : "transparent"
+                            },
+                            children: [
+                              /* @__PURE__ */ jsxs("span", { className: "flex flex-col min-w-0", children: [
+                                /* @__PURE__ */ jsx("span", { className: "truncate font-medium", children: p.name }),
+                                p.sku ? /* @__PURE__ */ jsx("span", { className: "truncate text-[11px]", style: { color: "hsl(var(--ra-muted-text))" }, children: p.sku }) : null
+                              ] }),
+                              active ? /* @__PURE__ */ jsx("span", { className: "text-[10px] uppercase tracking-wide", style: { color: "hsl(var(--ra-muted-text))" }, children: "current" }) : null
+                            ]
+                          }
+                        ) }, p.id);
+                      }) }),
+                      browse.hasNextPage && /* @__PURE__ */ jsx("div", { className: "px-3 py-2 border-t", style: { borderColor: "hsl(var(--ra-border))" }, children: /* @__PURE__ */ jsx(
+                        "button",
+                        {
+                          type: "button",
+                          onClick: () => browse.fetchNextPage(),
+                          disabled: browse.isFetchingNextPage,
+                          className: "text-xs w-full py-1 rounded-md border hover:bg-[hsl(var(--ra-muted))]",
+                          style: {
+                            borderColor: "hsl(var(--ra-border))",
+                            color: "hsl(var(--ra-text))"
+                          },
+                          children: browse.isFetchingNextPage ? "Loading\u2026" : "Load more"
+                        }
+                      ) })
+                    ]
+                  }
+                )
+              ]
+            }
+          )
+        ]
+      }
+    ),
+    document.body
+  );
+};
 var ICONS2 = {
   table: Table,
   cards: LayoutGrid,
@@ -7154,6 +7396,11 @@ function RecordsAdminShellInner(props) {
     variantChildren,
     batchChildren
   } = browser;
+  const ruleScopedList = useRecordList({
+    ctx,
+    scopeKind: "rule",
+    enabled: true
+  });
   const pinnedProduct = useSingleProduct({
     SL,
     collectionId,
@@ -7240,7 +7487,18 @@ function RecordsAdminShellInner(props) {
     setSelectedVariantId,
     selectedBatchId,
     setSelectedBatchId,
-    setFacetBrowseFilter
+    setFacetBrowseFilter,
+    // Pending-recordId resolution — without these the URL's `recordId` is
+    // parsed but never opens the editor on refresh / share-link load.
+    isCollection,
+    setSelectedItemId,
+    collectionItems: {
+      items: collectionItems.items,
+      isLoading: collectionItems.isLoading
+    },
+    recordListItems: recordList.items,
+    recordListLoading: recordList.isLoading,
+    skipNextItemResetRef
   });
   const supportedForResolution = useMemo(() => requestedScopes, [requestedScopes]);
   const resolved = useResolvedRecord({
@@ -7487,6 +7745,7 @@ function RecordsAdminShellInner(props) {
         onChange: setPreviewScope,
         showVariants: drillVariantsAllowed,
         showBatches: drillBatchesAllowed,
+        activeScope,
         i18n: { previewAs: i18n.previewAs, previewAsDefault: i18n.previewAsDefault }
       }
     ) : null;
@@ -7675,6 +7934,26 @@ function RecordsAdminShellInner(props) {
   const isGlobalTab = activeScope === "collection";
   const isAllTab = activeScope === "all";
   const isRecordsTab = isRuleTab || isGlobalTab || isAllTab;
+  const ruleLabelLookup = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const it of facetBrowse.items) {
+      const k = it.scope.facetId;
+      const v = it.scope.facetValue;
+      if (!k || !v) continue;
+      const facetLabel = it.subtitle ?? k;
+      const valueLabel = it.label ?? v;
+      let info = map.get(k);
+      if (!info) {
+        info = { label: facetLabel, values: /* @__PURE__ */ new Map() };
+        map.set(k, info);
+      }
+      if (!info.values.has(v)) info.values.set(v, valueLabel);
+    }
+    return {
+      facetLabel: (k) => map.get(k)?.label,
+      valueLabel: (k, v) => map.get(k)?.values.get(v)
+    };
+  }, [facetBrowse.items]);
   const effectiveGroupBy = useMemo(() => {
     if (groupBy) return groupBy;
     if (isAllTab) return void 0;
@@ -7683,13 +7962,25 @@ function RecordsAdminShellInner(props) {
     return (record) => {
       const hash = ruleHash(record.facetRule);
       if (!hash) return null;
-      return { key: `rule:${hash}`, label: summariseRule(record.facetRule) };
+      return { key: `rule:${hash}`, label: summariseRule(record.facetRule, ruleLabelLookup) };
     };
-  }, [groupBy, isRuleTab, isAllTab, isCollection]);
+  }, [groupBy, isRuleTab, isAllTab, isCollection, ruleLabelLookup]);
   const [bulkRuleEditTarget, setBulkRuleEditTarget] = useState(null);
   const ruleCatalogue = useMemo(() => {
     const buckets = /* @__PURE__ */ new Map();
+    const seenIds = /* @__PURE__ */ new Set();
+    const merged = [];
+    for (const item of ruleScopedList.allItems) {
+      if (item.id && seenIds.has(item.id)) continue;
+      if (item.id) seenIds.add(item.id);
+      merged.push(item);
+    }
     for (const item of recordList.items) {
+      if (item.id && seenIds.has(item.id)) continue;
+      if (item.id) seenIds.add(item.id);
+      merged.push(item);
+    }
+    for (const item of merged) {
       const hash = ruleHash(item.facetRule);
       if (!hash || !item.facetRule) continue;
       const existing = buckets.get(hash);
@@ -7699,7 +7990,7 @@ function RecordsAdminShellInner(props) {
         buckets.set(hash, {
           hash,
           rule: item.facetRule,
-          summary: summariseRule(item.facetRule),
+          summary: summariseRule(item.facetRule, ruleLabelLookup),
           count: 1
         });
       }
@@ -7708,7 +7999,7 @@ function RecordsAdminShellInner(props) {
       if (b.count !== a.count) return b.count - a.count;
       return a.summary.localeCompare(b.summary);
     });
-  }, [recordList.items]);
+  }, [recordList.items, ruleScopedList.allItems, ruleLabelLookup]);
   const [targetingExpandNonce, setTargetingExpandNonce] = useState(0);
   const renderRuleGroupActions = useCallback(
     (group) => {
@@ -7799,8 +8090,13 @@ function RecordsAdminShellInner(props) {
     }
     return Array.from(buckets.values()).map(({ rep, count }) => ({
       ...rep,
-      label: summariseRule(rep.facetRule),
-      subtitle: `${count} ${itemNoun}${count === 1 ? "" : "s"}`
+      // Title carries the count + identity; the rule chips below render
+      // the friendly facet/value labels (via the lookup) so we don't
+      // repeat the same information in two places. Without this, a row
+      // had three echoes of the same rule (raw-key title, friendly chip,
+      // and the right-pane "Rule · …" header).
+      label: `${count} ${itemNoun}${count === 1 ? "" : "s"}`,
+      subtitle: void 0
     }));
   }, [isRuleTab, isCollection, filteredRuleItems, itemNoun]);
   const activeRuleSummary = useMemo(() => {
@@ -7808,8 +8104,8 @@ function RecordsAdminShellInner(props) {
     if (!selectedRecordId || isDraftId3(selectedRecordId)) return null;
     const hit = recordList.items.find((it) => it.id === selectedRecordId);
     if (!hit?.facetRule) return null;
-    return summariseRule(hit.facetRule);
-  }, [isRuleTab, isCollection, selectedRecordId, recordList.items]);
+    return summariseRule(hit.facetRule, ruleLabelLookup);
+  }, [isRuleTab, isCollection, selectedRecordId, recordList.items, ruleLabelLookup]);
   const applyFacetBrowseFilter = useCallback(
     (items2) => {
       if (!facetBrowseFilter) return items2;
@@ -7884,7 +8180,7 @@ function RecordsAdminShellInner(props) {
     });
   };
   onLeftSelectRef.current = onLeftSelect;
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(RuleLabelLookupProvider, { value: ruleLabelLookup, children: /* @__PURE__ */ jsxs(
     "div",
     {
       className: `ra-shell flex flex-col h-full ${className ?? ""}`,
@@ -8365,7 +8661,7 @@ function RecordsAdminShellInner(props) {
         )
       ]
     }
-  );
+  ) });
 }
 var RecordBrowser = ({
   scopes,
@@ -9220,6 +9516,9 @@ function useMergedRecord(args) {
   };
 }
 
+// src/components/RecordsAdmin/index.ts
+assertComponentStylesLoaded("records-admin");
+
 export { ALL_ITEM_VIEWS, ALL_PRESENTATIONS, BatchList, BulkActionsMenu, DEFAULT_DEEP_LINK_PARAM_NAMES, DEFAULT_I18N, DEFAULT_ICONS, DefaultItemCards, DefaultItemTable, DefaultRecordCard, DefaultRecordRow, DeleteButton, DirtyDraftProvider, DrawerPreview, EditorItemNav, EmptyState, ErrorState, FacetList, InheritanceMarker, InheritanceProvider, InlinePreview, IntroCard, ItemListView, ItemViewSwitcher, LoadingState, PresentationSwitcher, PreviewScopePicker, PreviewToggleButton, ProductDrillDown, ProductList, RecordBrowser, RecordEditor, RecordList, RecordsAdminShell, ResolvedPreview, ScopeBreadcrumb, ScopeTabs, SiblingRail, SidePreview, StatusDot, StatusFilterPills, StatusIcon, TabbedPreview, UtilityRow, VariantList, buildDraftKey, buildRef, checkPasteCompatibility, cloneValue, createDefaultDeepLinkAdapter, createPostMessageDeepLinkAdapter, downloadBlob, exportCsv, importCsv, isInSmartLinksIframe, mergeIcons, normaliseRule, parseRef, pickHeaderIcon, resolutionChain, resolveRecord, ruleHash, rulesEqual, scopeCountsQueryKey, statusToneLabel, summariseRule, useCollectedRecords, useCollectionItems, useDeepLinkState, useDirtyDraft, useDirtyDraftActions, useDirtyDraftStore, useDirtyDrafts, useDirtyNavigation, useFacetBrowse, useIntroDismissed, useItemViewPref, useMergedRecord, usePresentationPref, useProductBrowse, useProductChildren, useRecordClipboard, useRecordEditor, useRecordList, useResolveAllRecords, useResolvedRecord, useRulePreview, useScopeCounts, useScopeProbe, useUnsavedGuard };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map