@proveanything/smartlinks-utils-ui 0.8.2 → 0.8.3

package/dist/components/RecordsAdmin/index.d.ts

@@ -658,6 +658,22 @@ interface RecordsAdminShellProps<TData = unknown> {
         variantId?: string;
         batchId?: string;
     };
+    /**
+     * How the rail should react when `contextScope.productId` is pinned.
+     *
+     * - `'strict'` (default) — the host has scoped this mount to one product.
+     *   The rail hides `'collection'` (Global) and `'rule'` tabs entirely
+     *   (they're collection-wide concerns the product inherits) and the
+     *   product list collapses to that single product. When the product has
+     *   no variants and no batches available for drill-down AND no other
+     *   top-level scopes survive, the rail itself is hidden and the editor
+     *   takes the whole pane.
+     * - `'expand'` — legacy behaviour. The full rail renders; pinning only
+     *   biases the default tab + selected product.
+     *
+     * Has no effect when `contextScope.productId` is not set.
+     */
+    contextScopeMode?: 'strict' | 'expand';
     renderEditor: (ctx: EditorContext<TData>) => ReactNode;
     /**
      * Render the preview surface. Receives the editor's current value so the
@@ -1651,6 +1667,16 @@ interface UseCollectionItemsArgs {
      * the query disabled.
      */
     scope: ParsedRef | null;
+    /**
+     * When the scope is a rule (kind === 'rule'), pass the rule's `facetRule`
+     * here. Items belonging to a rule are records that carry the *same*
+     * facetRule — they share anchors only by coincidence (typically empty),
+     * so anchor equality alone isn't enough to identify them. When this is
+     * provided we match rule records by facetRule equality and ignore
+     * anchors. When absent, anchor-based matching applies (and rule records
+     * are skipped, since they belong on the Rules tab).
+     */
+    facetRule?: FacetRule | null;
     /** Per-page size requested from the SDK (default 100). */
     pageSize?: number;
     /**

package/dist/components/RecordsAdmin/index.js

@@ -2229,6 +2229,14 @@ function useItemViewPref(args) {
   return [value, set];
 }
 var QK_BASE2 = ["records-admin", "collection-items"];
+var canonicalFacetRule = (rule) => {
+  if (!rule || !Array.isArray(rule.all)) return "";
+  const clauses = rule.all.map((c) => ({
+    facetKey: c.facetKey,
+    anyOf: [...c.anyOf ?? []].sort()
+  })).sort((a, b) => a.facetKey.localeCompare(b.facetKey));
+  return JSON.stringify(clauses);
+};
 var defaultToSummary = (rec, base) => {
   const data = rec.data;
   const display = data?.display ?? void 0;
@@ -2238,8 +2246,13 @@ var defaultToSummary = (rec, base) => {
   const thumbnail = data.thumbnail ?? data.image ?? data.cover ?? data.home_image_url ?? base.thumbnail;
   return { ...base, label, subtitle, thumbnail };
 };
-var recordMatchesScope = (rec, scope) => {
+var recordMatchesScope = (rec, scope, ruleSignature) => {
   const facetRule = rec.facetRule ?? null;
+  if (scope.kind === "rule") {
+    if (!facetRule) return false;
+    if (!ruleSignature) return false;
+    return canonicalFacetRule(facetRule) === ruleSignature;
+  }
   if (facetRule) return false;
   return (rec.productId ?? void 0) === scope.productId && (rec.variantId ?? void 0) === scope.variantId && (rec.batchId ?? void 0) === scope.batchId && (rec.proofId ?? void 0) === scope.proofId;
 };
@@ -2247,15 +2260,20 @@ function useCollectionItems(args) {
   const {
     ctx,
     scope,
+    facetRule,
     pageSize = 100,
     toSummary: toSummary2 = defaultToSummary,
     enabled = true
   } = args;
   const queryClient = useQueryClient();
   const scopeRef = scope?.raw ?? "";
+  const ruleSignature = useMemo(
+    () => scope?.kind === "rule" ? canonicalFacetRule(facetRule) : "",
+    [scope?.kind, facetRule]
+  );
   const queryKey = useMemo(
-    () => [...QK_BASE2, ctx.collectionId, ctx.appId, ctx.recordType, scopeRef],
-    [ctx.collectionId, ctx.appId, ctx.recordType, scopeRef]
+    () => [...QK_BASE2, ctx.collectionId, ctx.appId, ctx.recordType, scopeRef, ruleSignature],
+    [ctx.collectionId, ctx.appId, ctx.recordType, scopeRef, ruleSignature]
   );
   const query = useInfiniteQuery({
     queryKey,
@@ -2275,7 +2293,7 @@ function useCollectionItems(args) {
   const items = useMemo(() => {
     if (!scope) return [];
     const all = query.data?.pages.flatMap((p) => p.data) ?? [];
-    const relevant = all.filter((rec) => recordMatchesScope(rec, scope));
+    const relevant = all.filter((rec) => recordMatchesScope(rec, scope, ruleSignature));
     return relevant.map((rec) => {
       const ref = rec.ref ?? "";
       const parsed = parseRef(ref);
@@ -2292,7 +2310,7 @@ function useCollectionItems(args) {
       };
       return toSummary2(rec, base);
     }).filter((x) => x !== null);
-  }, [query.data, toSummary2, scope]);
+  }, [query.data, toSummary2, scope, ruleSignature]);
   const refetch = useCallback(() => {
     queryClient.invalidateQueries({ queryKey });
   }, [queryClient, queryKey]);
@@ -5535,6 +5553,7 @@ function RecordsAdminShellInner(props) {
     scopes: requestedScopes,
     defaultScope,
     contextScope,
+    contextScopeMode = "strict",
     renderEditor,
     renderPreview,
     intro,
@@ -5657,6 +5676,11 @@ function RecordsAdminShellInner(props) {
     }
     return [...TOP_LEVEL_SCOPES];
   }, [requestedScopes]);
+  const productPinnedFromContext = !!contextScope?.productId;
+  const effectiveTopLevelScopes = useMemo(() => {
+    if (!productPinnedFromContext || contextScopeMode !== "strict") return topLevelScopes;
+    return topLevelScopes.filter((s) => s !== "collection" && s !== "rule");
+  }, [productPinnedFromContext, contextScopeMode, topLevelScopes]);
   useEffect(() => {
     if (requestedScopes.includes("facet") && !WARNED_FACET_DEPRECATED) {
       WARNED_FACET_DEPRECATED = true;
@@ -5674,10 +5698,10 @@ function RecordsAdminShellInner(props) {
     [requestedScopes, probe.isLoading, probe.hasBatches]
   );
   const initialScope = useMemo(() => {
-    if (contextScope?.productId && topLevelScopes.includes("product")) return "product";
-    if (defaultScope && topLevelScopes.includes(defaultScope)) return defaultScope;
-    return topLevelScopes[0] ?? "product";
-  }, [contextScope?.productId, defaultScope, topLevelScopes]);
+    if (contextScope?.productId && effectiveTopLevelScopes.includes("product")) return "product";
+    if (defaultScope && effectiveTopLevelScopes.includes(defaultScope)) return defaultScope;
+    return effectiveTopLevelScopes[0] ?? "product";
+  }, [contextScope?.productId, defaultScope, effectiveTopLevelScopes]);
   const [activeScope, setActiveScope] = useState(initialScope);
   useEffect(() => {
     setActiveScope(initialScope);
@@ -5805,6 +5829,12 @@ function RecordsAdminShellInner(props) {
   const collectionItems = useCollectionItems({
     ctx,
     scope: isCollection ? editingScope : null,
+    // When the editing scope is a rule, items belonging to that rule are
+    // records carrying the *same* facetRule (anchors are typically empty
+    // and would otherwise collide with global records). Look up the rule's
+    // facetRule from the selected record's summary so `useCollectionItems`
+    // can match by rule equality instead of by anchors.
+    facetRule: editingScope?.kind === "rule" ? recordList.items.find((it) => it.id === selectedRecordId)?.facetRule ?? null : null,
     enabled: isCollection
   });
   const editingTargetScope = useMemo(() => {
@@ -6385,6 +6415,21 @@ function RecordsAdminShellInner(props) {
   };
   const isProductTab = activeScope === "product";
   const productPinned = !!contextScope?.productId;
+  const railHidden = useMemo(() => {
+    if (!productPinned) return false;
+    if (contextScopeMode !== "strict") return false;
+    if (cardinality === "collection") return false;
+    if (effectiveTopLevelScopes.length > 1) return false;
+    if (drillVariantsAllowed || drillBatchesAllowed) return false;
+    return true;
+  }, [
+    productPinned,
+    contextScopeMode,
+    cardinality,
+    effectiveTopLevelScopes.length,
+    drillVariantsAllowed,
+    drillBatchesAllowed
+  ]);
   const effectivePresentation = isProductTab ? presentation : "list";
   const showPresentationSwitcher = isProductTab && presentations.length > 1;
   const effectiveGroupBy = groupBy;
@@ -6679,9 +6724,12 @@ function RecordsAdminShellInner(props) {
           "div",
           {
             className: "flex-1 grid border-t overflow-hidden",
-            style: { gridTemplateColumns: "minmax(260px, 320px) 1fr", borderColor: "hsl(var(--ra-border))" },
+            style: {
+              gridTemplateColumns: railHidden ? "1fr" : "minmax(260px, 320px) 1fr",
+              borderColor: "hsl(var(--ra-border))"
+            },
             children: [
-              /* @__PURE__ */ jsx("aside", { className: "border-r overflow-hidden flex flex-col", style: { borderColor: "hsl(var(--ra-border))", background: "hsl(var(--ra-surface))" }, children: isCollection && selectedItemId && collectionRailMode === "siblings" && ruleWizardStep === null ? /* @__PURE__ */ jsx(
+              !railHidden && /* @__PURE__ */ jsx("aside", { className: "border-r overflow-hidden flex flex-col", style: { borderColor: "hsl(var(--ra-border))", background: "hsl(var(--ra-surface))" }, children: isCollection && selectedItemId && collectionRailMode === "siblings" && ruleWizardStep === null ? /* @__PURE__ */ jsx(
                 SiblingRail,
                 {
                   items: collectionItems.items,
@@ -6698,7 +6746,7 @@ function RecordsAdminShellInner(props) {
                 /* @__PURE__ */ jsx("div", { className: "p-2", children: /* @__PURE__ */ jsx(
                   ScopeTabs,
                   {
-                    scopes: topLevelScopes,
+                    scopes: effectiveTopLevelScopes,
                     active: activeScope,
                     onChange: (s) => {
                       void runWithGuard(() => {
@@ -6747,60 +6795,62 @@ function RecordsAdminShellInner(props) {
                       ]
                     }
                   ),
-                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-                    /* @__PURE__ */ jsxs("div", { className: "relative flex-1 min-w-0", children: [
-                      /* @__PURE__ */ jsx(Search, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 w-3.5 h-3.5 opacity-50" }),
+                  !(isGlobalTab && !isCollection) && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                      /* @__PURE__ */ jsxs("div", { className: "relative flex-1 min-w-0", children: [
+                        /* @__PURE__ */ jsx(Search, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 w-3.5 h-3.5 opacity-50" }),
+                        /* @__PURE__ */ jsx(
+                          "input",
+                          {
+                            type: "text",
+                            value: search,
+                            onChange: (e) => setSearch(e.target.value),
+                            placeholder: i18n.searchPlaceholder,
+                            className: "w-full pl-8 pr-3 py-1.5 text-xs rounded-md border bg-transparent focus:outline-none focus:ring-1",
+                            style: { borderColor: "hsl(var(--ra-border))", color: "hsl(var(--ra-text))" }
+                          }
+                        )
+                      ] }),
                       /* @__PURE__ */ jsx(
-                        "input",
+                        PresentationSwitcher,
                         {
-                          type: "text",
-                          value: search,
-                          onChange: (e) => setSearch(e.target.value),
-                          placeholder: i18n.searchPlaceholder,
-                          className: "w-full pl-8 pr-3 py-1.5 text-xs rounded-md border bg-transparent focus:outline-none focus:ring-1",
-                          style: { borderColor: "hsl(var(--ra-border))", color: "hsl(var(--ra-text))" }
+                          options: showPresentationSwitcher ? presentations : [],
+                          value: presentation,
+                          onChange: onPresentationChange,
+                          i18n
                         }
                       )
                     ] }),
-                    /* @__PURE__ */ jsx(
-                      PresentationSwitcher,
+                    !isProductTab && !isRuleTab && !isGlobalTab && /* @__PURE__ */ jsx(
+                      StatusFilterPills,
                       {
-                        options: showPresentationSwitcher ? presentations : [],
-                        value: presentation,
-                        onChange: onPresentationChange,
+                        value: filter,
+                        onChange: setFilter,
+                        counts: facetBrowse.counts,
+                        hideZero: ["partial"],
                         i18n
                       }
+                    ),
+                    isRuleTab && /* @__PURE__ */ jsx(
+                      RuleFilterChips,
+                      {
+                        source: recordList.items,
+                        value: ruleFilters,
+                        onChange: setRuleFilters
+                      }
+                    ),
+                    isRuleTab && /* @__PURE__ */ jsx(
+                      FacetBrowseFilter,
+                      {
+                        facets: facetBrowseFacets,
+                        value: facetBrowseFilter,
+                        onChange: setFacetBrowseFilter,
+                        isLoading: facetBrowse.isLoading
+                      }
                     )
-                  ] }),
-                  !isProductTab && !isRuleTab && !isGlobalTab && /* @__PURE__ */ jsx(
-                    StatusFilterPills,
-                    {
-                      value: filter,
-                      onChange: setFilter,
-                      counts: facetBrowse.counts,
-                      hideZero: ["partial"],
-                      i18n
-                    }
-                  ),
-                  isRuleTab && /* @__PURE__ */ jsx(
-                    RuleFilterChips,
-                    {
-                      source: recordList.items,
-                      value: ruleFilters,
-                      onChange: setRuleFilters
-                    }
-                  ),
-                  (isRuleTab || isGlobalTab && !isCollection) && /* @__PURE__ */ jsx(
-                    FacetBrowseFilter,
-                    {
-                      facets: facetBrowseFacets,
-                      value: facetBrowseFilter,
-                      onChange: setFacetBrowseFilter,
-                      isLoading: facetBrowse.isLoading
-                    }
-                  )
+                  ] })
                 ] }),
-                /* @__PURE__ */ jsxs("div", { className: "flex-1 overflow-y-auto", children: [
+                /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto", children: isGlobalTab && !isCollection ? null : /* @__PURE__ */ jsxs(Fragment, { children: [
                   leftLoading && /* @__PURE__ */ jsx(LoadingState, {}),
                   !leftLoading && leftError && /* @__PURE__ */ jsx(ErrorState, { error: leftError }),
                   !leftLoading && !leftError && leftItems.length === 0 && (renderEmpty ? renderEmpty({ scope: editingScope }) : renderEmptyState ? renderEmptyState({ scope: activeScope }) : /* @__PURE__ */ jsx(
@@ -6844,7 +6894,7 @@ function RecordsAdminShellInner(props) {
                       }
                     ) })
                   ] })
-                ] })
+                ] }) })
               ] }) }),
               /* @__PURE__ */ jsxs("main", { className: "overflow-hidden", children: [
                 ruleWizardStep !== null && /* @__PURE__ */ jsxs(