@ai-matrx/associations 0.5.2 → 0.6.0

package/dist/react/index.js

@@ -1,13 +1,191 @@
 "use client";
 
 // src/react/context.tsx
-import { createContext, useContext, useRef } from "react";
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useRef
+} from "react";
+
+// src/demanded-rpcs.generated.ts
+var DEMANDED_RPC_NAMES = [
+  "assoc_add",
+  "assoc_remove",
+  "assoc_set_targets",
+  "assoc_remove_for_entity",
+  "assoc_for_entity",
+  "assoc_for_targets",
+  "assoc_for_sources",
+  "assoc_members_visible",
+  "conversation_file_add",
+  "conversation_file_remove",
+  "conversation_files",
+  "agent_resource_add",
+  "agent_resource_remove",
+  "cat_list",
+  "cat_create",
+  "cat_update",
+  "cat_reparent",
+  "cat_delete",
+  "ues_set",
+  "ues_list",
+  "ues_get_bulk",
+  "ues_touch",
+  "reference_search_candidates",
+  "cmt_list",
+  "cmt_add",
+  "cmt_edit",
+  "cmt_delete"
+];
+
+// src/core/assertDemandedSchema.ts
+var BAD_UUID = "__not_a_uuid__";
+var SELF_TEST_MISSING_RPC = "assoc_probe_self_test_missing_fn";
+var PROBE_ARGS = {
+  // edges — writes
+  assoc_add: {
+    p_source_type: "note",
+    p_source_id: BAD_UUID,
+    p_target_type: "task",
+    p_target_id: BAD_UUID
+  },
+  assoc_remove: {
+    p_source_type: "note",
+    p_source_id: BAD_UUID,
+    p_target_type: "task",
+    p_target_id: BAD_UUID
+  },
+  assoc_set_targets: {
+    p_source_type: "note",
+    p_source_id: BAD_UUID,
+    p_target_type: "task",
+    p_target_ids: [BAD_UUID]
+  },
+  assoc_remove_for_entity: { p_type: "note", p_id: BAD_UUID },
+  // edges — reads
+  assoc_for_entity: { p_type: "note", p_id: BAD_UUID },
+  assoc_for_targets: { p_target_type: "task", p_target_ids: [BAD_UUID] },
+  assoc_for_sources: { p_source_type: "note", p_source_ids: [BAD_UUID] },
+  assoc_members_visible: { p_target_type: "task", p_target_ids: [BAD_UUID] },
+  // conversation files
+  conversation_file_add: {
+    p_conversation_id: BAD_UUID,
+    p_file_id: BAD_UUID
+  },
+  conversation_file_remove: {
+    p_conversation_id: BAD_UUID,
+    p_file_id: BAD_UUID
+  },
+  conversation_files: { p_conversation_id: BAD_UUID },
+  // agent resources
+  agent_resource_add: {
+    p_agent_id: BAD_UUID,
+    p_source_type: "note",
+    p_source_id: BAD_UUID
+  },
+  agent_resource_remove: {
+    p_agent_id: BAD_UUID,
+    p_source_type: "note",
+    p_source_id: BAD_UUID
+  },
+  // categories
+  cat_list: {},
+  cat_create: { p_dimension: "", p_name: "", p_org_id: BAD_UUID },
+  cat_update: { p_category_id: BAD_UUID, p_name: "__probe__" },
+  cat_reparent: { p_category_id: BAD_UUID },
+  cat_delete: { p_category_id: BAD_UUID },
+  // favorites / recents
+  ues_set: { p_entity_type: "__probe__", p_entity_id: BAD_UUID },
+  ues_list: {},
+  ues_get_bulk: { p_entity_type: "__probe__", p_entity_ids: [BAD_UUID] },
+  ues_touch: { p_entity_type: "__probe__", p_entity_id: BAD_UUID },
+  // candidates
+  reference_search_candidates: { p_token: "__probe__", p_limit: 1 },
+  // comments (W6) — every fn takes a uuid arg, so the unparseable sentinel
+  // guarantees 22P02 before any SECURITY DEFINER body runs (no write occurs).
+  cmt_list: { p_entity_type: "__probe__", p_entity_id: BAD_UUID },
+  cmt_add: {
+    p_entity_type: "__probe__",
+    p_entity_id: BAD_UUID,
+    p_body: "__probe__"
+  },
+  cmt_edit: { p_id: BAD_UUID, p_body: "__probe__" },
+  cmt_delete: { p_id: BAD_UUID }
+};
+function isMissingFunctionError(error) {
+  if (!error || typeof error !== "object") return false;
+  return error.code === "PGRST202";
+}
+async function assertDemandedSchema(dataSource, options = {}) {
+  const { selfTest = false, concurrency = 6, throwOnViolation = true } = options;
+  const names = [...DEMANDED_RPC_NAMES];
+  if (selfTest) names.push(SELF_TEST_MISSING_RPC);
+  const missing = [];
+  const unreachable = [];
+  const answered = [];
+  let cursor = 0;
+  async function worker() {
+    while (cursor < names.length) {
+      const fn = names[cursor];
+      cursor += 1;
+      if (!fn) continue;
+      const args = fn === SELF_TEST_MISSING_RPC ? {} : PROBE_ARGS[fn];
+      try {
+        const { error } = await dataSource.rpc(fn, args);
+        if (error == null) answered.push(fn);
+        else if (isMissingFunctionError(error)) missing.push(fn);
+        else answered.push(fn);
+      } catch (e) {
+        unreachable.push({ fn, error: e });
+      }
+    }
+  }
+  await Promise.all(
+    Array.from({ length: Math.min(concurrency, names.length) }, worker)
+  );
+  if (selfTest) {
+    const selfTestMissing = missing.includes(SELF_TEST_MISSING_RPC);
+    const idx = missing.indexOf(SELF_TEST_MISSING_RPC);
+    if (idx >= 0) missing.splice(idx, 1);
+    const answeredIdx = answered.indexOf(SELF_TEST_MISSING_RPC);
+    if (answeredIdx >= 0) answered.splice(answeredIdx, 1);
+    if (!selfTestMissing) {
+      throw new Error(
+        `assertDemandedSchema self-test FAILED: the fabricated function "${SELF_TEST_MISSING_RPC}" did not come back as missing (PGRST202). This probe cannot currently fail, so its green result proves nothing \u2014 the dataSource is swallowing or faking errors.`
+      );
+    }
+  }
+  if (unreachable.length > 0) {
+    throw new Error(
+      `assertDemandedSchema could not complete: ${unreachable.length} probe call(s) failed to reach the database (${unreachable.map((u) => u.fn).join(", ")}). This is NOT a schema verdict \u2014 fix connectivity and re-run.`
+    );
+  }
+  const ok = missing.length === 0;
+  const report = { ok, missing, unreachable, answered };
+  if (!ok && throwOnViolation) {
+    throw new Error(
+      `DEMANDED SCHEMA VIOLATION: the database this dataSource points at cannot answer ${missing.length} demanded @ai-matrx/associations function(s): ${missing.join(", ")}. This package demands the AI Matrx platform schema (README \xA7 The demanded schema); a database without it is not this package's database.`
+    );
+  }
+  return report;
+}
+
+// src/react/context.tsx
 import { jsx } from "react/jsx-runtime";
 var AssociationsReactContext = createContext(
   null
 );
+function isDevelopmentBuild() {
+  try {
+    return typeof process !== "undefined" && true;
+  } catch {
+    return false;
+  }
+}
 function AssociationsProvider({
   store,
+  probeSchema,
   notifier,
   windowShell,
   capture,
@@ -17,6 +195,28 @@ function AssociationsProvider({
   children
 }) {
   const notifierWarned = useRef(false);
+  const shouldProbe = probeSchema ?? isDevelopmentBuild();
+  useEffect(() => {
+    if (!shouldProbe) return;
+    let stale = false;
+    void (async () => {
+      try {
+        await assertDemandedSchema(store.dataSource);
+      } catch (error) {
+        if (stale) return;
+        store.errorSink({
+          code: "demanded_schema_violation",
+          message: error instanceof Error ? error.message : "assertDemandedSchema failed",
+          context: {
+            remedy: "Run the platform.associations schema (README \xA7 The demanded schema) on the database this dataSource points at."
+          }
+        });
+      }
+    })();
+    return () => {
+      stale = true;
+    };
+  }, [shouldProbe, store]);
   return /* @__PURE__ */ jsx(
     AssociationsReactContext.Provider,
     {
@@ -78,7 +278,7 @@ function useNotifier() {
 }
 
 // src/react/hooks/useAssociations.ts
-import { useEffect, useRef as useRef2, useSyncExternalStore } from "react";
+import { useEffect as useEffect2, useRef as useRef2, useSyncExternalStore } from "react";
 
 // src/results.ts
 function isAssociationsRpcErr(r) {
@@ -789,7 +989,7 @@ function useAssociations(args) {
     () => store.getEdges(type, id ?? "")
   );
   const loadedKey = useRef2(null);
-  useEffect(() => {
+  useEffect2(() => {
     if (!autoLoad || !type || !id) return;
     const k = associationsKey(type, id);
     if (loadedKey.current === k) return;
@@ -845,7 +1045,7 @@ var useEntityRelationships = useAssociations;
 // src/react/hooks/useContainerLinks.ts
 import {
   useCallback,
-  useEffect as useEffect2,
+  useEffect as useEffect3,
   useLayoutEffect,
   useRef as useRef3,
   useState
@@ -910,7 +1110,7 @@ function useContainerLinks(args) {
       loading: false
     });
   }, [containerId, conversationKey, store]);
-  useEffect2(() => {
+  useEffect3(() => {
     const timeout = setTimeout(() => {
       void loadConversationFiles();
     }, 0);
@@ -993,7 +1193,7 @@ function useContainerLinks(args) {
 }
 
 // src/react/hooks/useEntityTitles.ts
-import { useEffect as useEffect3, useState as useState2 } from "react";
+import { useEffect as useEffect4, useState as useState2 } from "react";
 function useEntityTitles(refs) {
   const store = useAssociationsStore();
   const [resolved, setResolved] = useState2({});
@@ -1003,7 +1203,7 @@ function useEntityTitles(refs) {
     (r) => store.registry.tryGetEntityInfo(r.token)?.titleColumn != null && store.titles.get(r.token, r.id) == null && !attempted[entityTitleCacheKey(r.token, r.id)]
   );
   const neededKey = needed.map((r) => entityTitleCacheKey(r.token, r.id)).sort().join("|");
-  useEffect3(() => {
+  useEffect4(() => {
     if (!neededKey) return;
     let cancelled = false;
     setLoading(true);
@@ -1067,7 +1267,7 @@ function useEntityTitles(refs) {
 }
 
 // src/react/hooks/useCategories.ts
-import { useEffect as useEffect4, useRef as useRef4, useSyncExternalStore as useSyncExternalStore2 } from "react";
+import { useEffect as useEffect5, useRef as useRef4, useSyncExternalStore as useSyncExternalStore2 } from "react";
 var noopSubscribe2 = () => () => {
 };
 function useCategories(args) {
@@ -1079,7 +1279,7 @@ function useCategories(args) {
     () => store.getCategories(dimension ?? "")
   );
   const loadedKey = useRef4(null);
-  useEffect4(() => {
+  useEffect5(() => {
     if (!autoLoad || !dimension) return;
     if (loadedKey.current === dimension) return;
     loadedKey.current = dimension;
@@ -1130,7 +1330,7 @@ function useCategories(args) {
 }
 
 // src/react/hooks/useUniversalEntitySearch.ts
-import { useEffect as useEffect5, useRef as useRef5, useState as useState3 } from "react";
+import { useEffect as useEffect6, useRef as useRef5, useState as useState3 } from "react";
 var DEBOUNCE_MS = 250;
 var RECENTS_LIMIT = 12;
 function useUniversalEntitySearch(args) {
@@ -1148,7 +1348,7 @@ function useUniversalEntitySearch(args) {
   const [isRecents, setIsRecents] = useState3(true);
   const runRef = useRef5(0);
   const tokensKey = (tokens ?? []).join(",");
-  useEffect5(() => {
+  useEffect6(() => {
     if (!enabled) return;
     const run = ++runRef.current;
     const trimmed = query.trim();
@@ -1210,7 +1410,7 @@ async function loadRecents(store, tokens) {
 }
 
 // src/react/hooks/useAssociationCandidates.ts
-import { useEffect as useEffect6, useState as useState4 } from "react";
+import { useEffect as useEffect7, useState as useState4 } from "react";
 function useAssociationCandidates(args) {
   const { token, enabled = true, search, limit } = args;
   const store = useAssociationsStore();
@@ -1219,7 +1419,7 @@ function useAssociationCandidates(args) {
   const [loading, setLoading] = useState4(false);
   const [error, setError] = useState4(null);
   const [tick, setTick] = useState4(0);
-  useEffect6(() => {
+  useEffect7(() => {
     if (!enabled) return void 0;
     let cancelled = false;
     void (async () => {
@@ -1260,7 +1460,7 @@ function currentUserIdOrNull(store) {
 }
 
 // src/react/hooks/useComments.ts
-import { useEffect as useEffect7, useRef as useRef6, useSyncExternalStore as useSyncExternalStore3 } from "react";
+import { useEffect as useEffect8, useRef as useRef6, useSyncExternalStore as useSyncExternalStore3 } from "react";
 var noopSubscribe3 = () => () => {
 };
 function useComments(args) {
@@ -1273,7 +1473,7 @@ function useComments(args) {
     () => store.getComments(token, id ?? "")
   );
   const loadedKey = useRef6(null);
-  useEffect7(() => {
+  useEffect8(() => {
     if (!autoLoad || !key || !id) return;
     if (loadedKey.current === key) return;
     loadedKey.current = key;
@@ -1415,6 +1615,16 @@ function usePrimaryEntity() {
 
 // src/react/components/AssociationWindow.tsx
 import { useId } from "react";
+
+// src/react/components/DefaultWindowShell.tsx
+import {
+  useCallback as useCallback2,
+  useEffect as useEffect9,
+  useLayoutEffect as useLayoutEffect2,
+  useRef as useRef7,
+  useState as useState6
+} from "react";
+import { createPortal } from "react-dom";
 import { cn } from "@ai-matrx/design-system";
 
 // src/react/icons.tsx
@@ -1533,9 +1743,246 @@ function DefaultEntityIcon(props) {
     /* @__PURE__ */ jsx3("path", { d: "M12 13.5V8" })
   ] });
 }
+function MaximizeIcon(props) {
+  return /* @__PURE__ */ jsxs("svg", { ...base(props), children: [
+    /* @__PURE__ */ jsx3("path", { d: "M15 3h6v6" }),
+    /* @__PURE__ */ jsx3("path", { d: "M9 21H3v-6" }),
+    /* @__PURE__ */ jsx3("path", { d: "M21 3l-7 7" }),
+    /* @__PURE__ */ jsx3("path", { d: "M3 21l7-7" })
+  ] });
+}
+function RestoreIcon(props) {
+  return /* @__PURE__ */ jsxs("svg", { ...base(props), children: [
+    /* @__PURE__ */ jsx3("path", { d: "M4 14h6v6" }),
+    /* @__PURE__ */ jsx3("path", { d: "M20 10h-6V4" }),
+    /* @__PURE__ */ jsx3("path", { d: "M14 10l7-7" }),
+    /* @__PURE__ */ jsx3("path", { d: "M3 21l7-7" })
+  ] });
+}
+function GripResizeIcon(props) {
+  return /* @__PURE__ */ jsxs("svg", { ...base(props), children: [
+    /* @__PURE__ */ jsx3("path", { d: "M21 15 15 21" }),
+    /* @__PURE__ */ jsx3("path", { d: "M21 20 20 21" })
+  ] });
+}
 
-// src/react/components/AssociationWindow.tsx
+// src/react/components/DefaultWindowShell.tsx
 import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
+var DEFAULT_WIDTH = 440;
+var DEFAULT_HEIGHT = 580;
+var MIN_WIDTH = 330;
+var MIN_HEIGHT = 380;
+var MOBILE_MAX_WIDTH = 640;
+var EDGE_KEEP = 48;
+function viewport() {
+  if (typeof window === "undefined") {
+    return { width: DEFAULT_WIDTH, height: DEFAULT_HEIGHT };
+  }
+  return { width: window.innerWidth, height: window.innerHeight };
+}
+function clamp(rect) {
+  const { width: vw, height: vh } = viewport();
+  const width = Math.min(Math.max(rect.width, MIN_WIDTH), Math.max(vw, MIN_WIDTH));
+  const height = Math.min(
+    Math.max(rect.height, MIN_HEIGHT),
+    Math.max(vh, MIN_HEIGHT)
+  );
+  return {
+    width,
+    height,
+    x: Math.min(Math.max(rect.x, EDGE_KEEP - width), Math.max(vw - EDGE_KEEP, 0)),
+    y: Math.min(Math.max(rect.y, 0), Math.max(vh - EDGE_KEEP, 0))
+  };
+}
+function centred() {
+  const { width: vw, height: vh } = viewport();
+  const width = Math.min(DEFAULT_WIDTH, Math.max(vw - 32, MIN_WIDTH));
+  const height = Math.min(DEFAULT_HEIGHT, Math.max(vh - 32, MIN_HEIGHT));
+  return clamp({
+    width,
+    height,
+    x: Math.round((vw - width) / 2),
+    y: Math.round((vh - height) / 2)
+  });
+}
+function DefaultWindowShell({
+  id,
+  title,
+  onClose,
+  icon,
+  children,
+  className
+}) {
+  const panelRef = useRef7(null);
+  const [mounted, setMounted] = useState6(false);
+  const [isMobile, setIsMobile] = useState6(false);
+  const [rect, setRect] = useState6(() => centred());
+  const [maximized, setMaximized] = useState6(false);
+  const gesture = useRef7(null);
+  useLayoutEffect2(() => {
+    setMounted(true);
+    setIsMobile(window.innerWidth < MOBILE_MAX_WIDTH);
+    setRect(centred());
+  }, []);
+  useEffect9(() => {
+    if (!mounted) return;
+    const onResize = () => {
+      setIsMobile(window.innerWidth < MOBILE_MAX_WIDTH);
+      setRect((current) => clamp(current));
+    };
+    window.addEventListener("resize", onResize);
+    return () => window.removeEventListener("resize", onResize);
+  }, [mounted]);
+  useEffect9(() => {
+    const onKeyDown = (event) => {
+      if (event.key === "Escape") onClose();
+    };
+    window.addEventListener("keydown", onKeyDown);
+    return () => window.removeEventListener("keydown", onKeyDown);
+  }, [onClose]);
+  useEffect9(() => {
+    panelRef.current?.focus({ preventScroll: true });
+  }, [mounted]);
+  const beginGesture = useCallback2(
+    (mode) => (event) => {
+      if (isMobile || maximized || event.button !== 0) return;
+      event.preventDefault();
+      event.currentTarget.setPointerCapture(event.pointerId);
+      gesture.current = {
+        mode,
+        pointerId: event.pointerId,
+        startX: event.clientX,
+        startY: event.clientY,
+        origin: rect
+      };
+    },
+    [isMobile, maximized, rect]
+  );
+  const onPointerMove = useCallback2((event) => {
+    const active = gesture.current;
+    if (!active || active.pointerId !== event.pointerId) return;
+    const dx = event.clientX - active.startX;
+    const dy = event.clientY - active.startY;
+    setRect(
+      clamp(
+        active.mode === "move" ? { ...active.origin, x: active.origin.x + dx, y: active.origin.y + dy } : {
+          ...active.origin,
+          width: active.origin.width + dx,
+          height: active.origin.height + dy
+        }
+      )
+    );
+  }, []);
+  const endGesture = useCallback2((event) => {
+    const active = gesture.current;
+    if (!active || active.pointerId !== event.pointerId) return;
+    gesture.current = null;
+    if (event.currentTarget.hasPointerCapture(event.pointerId)) {
+      event.currentTarget.releasePointerCapture(event.pointerId);
+    }
+  }, []);
+  if (!mounted || typeof document === "undefined") return null;
+  const labelId = `assoc-window-title:${id}`;
+  const style = isMobile ? {} : maximized ? { inset: "1rem", width: "auto", height: "auto" } : {
+    left: rect.x,
+    top: rect.y,
+    width: rect.width,
+    height: rect.height
+  };
+  return createPortal(
+    /* @__PURE__ */ jsxs2(
+      "div",
+      {
+        ref: panelRef,
+        role: "dialog",
+        "aria-labelledby": labelId,
+        tabIndex: -1,
+        style,
+        className: cn(
+          // Non-modal by design: no backdrop element exists, so the page
+          // behind keeps every click. `pointer-events-auto` re-asserts our
+          // own subtree in case a Radix surface left <body> inert.
+          "pointer-events-auto fixed z-50 flex flex-col overflow-hidden border border-border bg-card text-card-foreground shadow-xl outline-none",
+          isMobile ? "inset-x-0 bottom-0 max-h-[85dvh] rounded-t-xl" : "rounded-xl",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxs2(
+            "header",
+            {
+              onPointerDown: beginGesture("move"),
+              onPointerMove,
+              onPointerUp: endGesture,
+              onPointerCancel: endGesture,
+              onDoubleClick: () => {
+                if (!isMobile) setMaximized((v) => !v);
+              },
+              className: cn(
+                "flex shrink-0 items-center justify-between gap-2 border-b border-border px-3 py-2 select-none",
+                isMobile ? "" : "cursor-move touch-none"
+              ),
+              children: [
+                /* @__PURE__ */ jsxs2(
+                  "span",
+                  {
+                    id: labelId,
+                    className: "flex min-w-0 items-center gap-1.5 text-sm font-medium text-foreground",
+                    children: [
+                      icon,
+                      /* @__PURE__ */ jsx4("span", { className: "truncate", children: title })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsxs2("span", { className: "flex shrink-0 items-center gap-0.5", children: [
+                  isMobile ? null : /* @__PURE__ */ jsx4(
+                    "button",
+                    {
+                      type: "button",
+                      onPointerDown: (event) => event.stopPropagation(),
+                      onClick: () => setMaximized((v) => !v),
+                      "aria-label": maximized ? "Restore window" : "Maximize window",
+                      className: "flex h-6 w-6 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
+                      children: maximized ? /* @__PURE__ */ jsx4(RestoreIcon, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ jsx4(MaximizeIcon, { className: "h-3.5 w-3.5" })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx4(
+                    "button",
+                    {
+                      type: "button",
+                      onPointerDown: (event) => event.stopPropagation(),
+                      onClick: onClose,
+                      "aria-label": "Close",
+                      className: "flex h-6 w-6 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
+                      children: /* @__PURE__ */ jsx4(XIcon, { className: "h-3.5 w-3.5" })
+                    }
+                  )
+                ] })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx4("div", { className: "min-h-0 flex-1 overflow-hidden", children }),
+          isMobile || maximized ? null : /* @__PURE__ */ jsx4(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Resize window",
+              onPointerDown: beginGesture("resize"),
+              onPointerMove,
+              onPointerUp: endGesture,
+              onPointerCancel: endGesture,
+              className: "absolute bottom-0 right-0 flex h-4 w-4 cursor-nwse-resize touch-none items-center justify-center text-muted-foreground/60 hover:text-foreground",
+              children: /* @__PURE__ */ jsx4(GripResizeIcon, { className: "h-3 w-3" })
+            }
+          )
+        ]
+      }
+    ),
+    document.body
+  );
+}
+
+// src/react/components/AssociationWindow.tsx
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
 function AssociationWindow({
   open,
   onClose,
@@ -1548,78 +1995,51 @@ function AssociationWindow({
   const instanceId = useId();
   const { windowShell } = useAssociationsUiPorts();
   if (!open) return null;
-  const body = /* @__PURE__ */ jsxs2("div", { className: "flex h-full min-h-0 flex-col gap-2 p-3", children: [
-    subtitle ? /* @__PURE__ */ jsx4("div", { className: "shrink-0 text-xs text-muted-foreground", children: subtitle }) : null,
+  const body = /* @__PURE__ */ jsxs3("div", { className: "flex h-full min-h-0 flex-col gap-2 p-3", children: [
+    subtitle ? /* @__PURE__ */ jsx5("div", { className: "shrink-0 text-xs text-muted-foreground", children: subtitle }) : null,
     children
   ] });
+  const windowId = `association:${scopeId}:${instanceId}`;
   if (windowShell) {
     const HostWindow = windowShell.Window;
-    return /* @__PURE__ */ jsx4(
-      HostWindow,
-      {
-        id: `association:${scopeId}:${instanceId}`,
-        title,
-        onClose,
-        children: body
-      }
-    );
+    return /* @__PURE__ */ jsx5(HostWindow, { id: windowId, title, onClose, children: body });
   }
-  return /* @__PURE__ */ jsxs2(
-    "div",
+  return /* @__PURE__ */ jsx5(
+    DefaultWindowShell,
     {
-      role: "dialog",
-      "aria-label": title,
-      className: cn(
-        "pointer-events-auto fixed left-1/2 top-1/2 z-50 flex max-h-[85dvh] w-[min(440px,calc(100vw-2rem))] -translate-x-1/2 -translate-y-1/2 flex-col overflow-hidden rounded-xl border border-border bg-card shadow-xl"
-      ),
-      style: { height: "min(580px, 85dvh)" },
-      children: [
-        /* @__PURE__ */ jsxs2("div", { className: "flex shrink-0 items-center justify-between gap-2 border-b border-border px-3 py-2", children: [
-          /* @__PURE__ */ jsxs2("span", { className: "flex min-w-0 items-center gap-1.5 text-sm font-medium text-foreground", children: [
-            icon,
-            /* @__PURE__ */ jsx4("span", { className: "truncate", children: title })
-          ] }),
-          /* @__PURE__ */ jsx4(
-            "button",
-            {
-              type: "button",
-              onClick: onClose,
-              "aria-label": "Close",
-              className: "flex h-6 w-6 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
-              children: /* @__PURE__ */ jsx4(XIcon, { className: "h-3.5 w-3.5" })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx4("div", { className: "min-h-0 flex-1", children: body })
-      ]
+      id: windowId,
+      title,
+      onClose,
+      ...icon !== void 0 ? { icon } : {},
+      children: body
     }
   );
 }
 
 // src/react/components/AssociationPicker.tsx
-import { useState as useState6 } from "react";
+import { useState as useState7 } from "react";
 import { cn as cn2, Input } from "@ai-matrx/design-system";
-import { Fragment, jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
 function AssociationPicker(props) {
   const store = useAssociationsStore();
   const { pickerOverrides } = useAssociationsUiPorts();
   const info = store.registry.getEntityInfo(props.token);
   const Icon = info.Icon ?? DefaultEntityIcon;
   const Override = pickerOverrides?.[props.token];
-  if (Override) return /* @__PURE__ */ jsx5(Override, { ...props });
+  if (Override) return /* @__PURE__ */ jsx6(Override, { ...props });
   const title = `Add ${info.labelPlural}`;
   const subtitle = props.containerLabel ? `Attach to ${props.containerLabel}` : "Click an item to attach or detach it";
   if (!props.open) return null;
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(
     AssociationWindow,
     {
       open: props.open,
       onClose: () => props.onOpenChange(false),
       scopeId: `picker:${props.token}`,
       title,
-      icon: /* @__PURE__ */ jsx5(Icon, { className: "size-3.5 text-primary" }),
+      icon: /* @__PURE__ */ jsx6(Icon, { className: "size-3.5 text-primary" }),
       subtitle,
-      children: /* @__PURE__ */ jsx5(
+      children: /* @__PURE__ */ jsx6(
         AssociationCandidateBody,
         {
           token: props.token,
@@ -1644,7 +2064,7 @@ function AssociationCandidateBody({
   onClose
 }) {
   void onClose;
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(
     EntityCandidateList,
     {
       token,
@@ -1666,8 +2086,8 @@ function EntityCandidateList({
 }) {
   const store = useAssociationsStore();
   const notifier = useNotifier();
-  const [search, setSearch] = useState6("");
-  const [busyId, setBusyId] = useState6(null);
+  const [search, setSearch] = useState7("");
+  const [busyId, setBusyId] = useState7(null);
   const info = store.registry.getEntityInfo(token);
   const Icon = info.Icon ?? DefaultEntityIcon;
   const { candidates, loading, error, reload } = useAssociationCandidates({
@@ -1691,10 +2111,10 @@ function EntityCandidateList({
       setBusyId(null);
     }
   };
-  return /* @__PURE__ */ jsxs3(Fragment, { children: [
-    /* @__PURE__ */ jsxs3("div", { className: "relative mb-2", children: [
-      /* @__PURE__ */ jsx5(SearchIcon, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" }),
-      /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsxs4(Fragment, { children: [
+    /* @__PURE__ */ jsxs4("div", { className: "relative mb-2", children: [
+      /* @__PURE__ */ jsx6(SearchIcon, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" }),
+      /* @__PURE__ */ jsx6(
         Input,
         {
           value: search,
@@ -1705,13 +2125,13 @@ function EntityCandidateList({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx5("div", { className: "flex-1 min-h-0 overflow-y-auto -mx-1 px-1", children: loading && candidates.length === 0 ? /* @__PURE__ */ jsxs3(ListMessage, { children: [
-      /* @__PURE__ */ jsx5(SpinnerIcon, { className: "h-4 w-4 animate-spin" }),
+    /* @__PURE__ */ jsx6("div", { className: "flex-1 min-h-0 overflow-y-auto -mx-1 px-1", children: loading && candidates.length === 0 ? /* @__PURE__ */ jsxs4(ListMessage, { children: [
+      /* @__PURE__ */ jsx6(SpinnerIcon, { className: "h-4 w-4 animate-spin" }),
       "Loading\u2026"
-    ] }) : error ? /* @__PURE__ */ jsxs3("div", { className: "rounded-md border border-destructive/40 bg-destructive/10 px-3 py-2 text-[12px] text-destructive", children: [
-      /* @__PURE__ */ jsx5("p", { className: "font-medium", children: "Couldn\u2019t load items" }),
-      /* @__PURE__ */ jsx5("p", { className: "opacity-80", children: error }),
-      /* @__PURE__ */ jsx5(
+    ] }) : error ? /* @__PURE__ */ jsxs4("div", { className: "rounded-md border border-destructive/40 bg-destructive/10 px-3 py-2 text-[12px] text-destructive", children: [
+      /* @__PURE__ */ jsx6("p", { className: "font-medium", children: "Couldn\u2019t load items" }),
+      /* @__PURE__ */ jsx6("p", { className: "opacity-80", children: error }),
+      /* @__PURE__ */ jsx6(
         "button",
         {
           type: "button",
@@ -1720,10 +2140,10 @@ function EntityCandidateList({
           children: "Retry"
         }
       )
-    ] }) : candidates.length === 0 ? /* @__PURE__ */ jsx5(ListMessage, { children: canCreate ? `Nothing to attach yet \u2014 create a new ${info.label.toLowerCase()} below.` : "Nothing to attach." }) : /* @__PURE__ */ jsx5("ul", { className: "space-y-0.5", children: candidates.map((c) => {
+    ] }) : candidates.length === 0 ? /* @__PURE__ */ jsx6(ListMessage, { children: canCreate ? `Nothing to attach yet \u2014 create a new ${info.label.toLowerCase()} below.` : "Nothing to attach." }) : /* @__PURE__ */ jsx6("ul", { className: "space-y-0.5", children: candidates.map((c) => {
       const attached = attachedIds.has(c.id);
       const busy = busyId === c.id;
-      return /* @__PURE__ */ jsx5("li", { children: /* @__PURE__ */ jsxs3(
+      return /* @__PURE__ */ jsx6("li", { children: /* @__PURE__ */ jsxs4(
         "button",
         {
           type: "button",
@@ -1735,23 +2155,23 @@ function EntityCandidateList({
             attached && "bg-accent/40"
           ),
           children: [
-            /* @__PURE__ */ jsx5(Icon, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
-            /* @__PURE__ */ jsx5("span", { className: "flex-1 min-w-0 truncate text-foreground", children: c.title }),
-            /* @__PURE__ */ jsx5(
+            /* @__PURE__ */ jsx6(Icon, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
+            /* @__PURE__ */ jsx6("span", { className: "flex-1 min-w-0 truncate text-foreground", children: c.title }),
+            /* @__PURE__ */ jsx6(
               "span",
               {
                 className: cn2(
                   "flex h-5 w-5 items-center justify-center rounded-full shrink-0",
                   attached ? "bg-primary text-primary-foreground" : "border border-border text-muted-foreground group-hover:border-primary/60"
                 ),
-                children: busy ? /* @__PURE__ */ jsx5(SpinnerIcon, { className: "h-3 w-3 animate-spin" }) : attached ? /* @__PURE__ */ jsx5(CheckIcon, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx5(PlusIcon, { className: "h-3 w-3" })
+                children: busy ? /* @__PURE__ */ jsx6(SpinnerIcon, { className: "h-3 w-3 animate-spin" }) : attached ? /* @__PURE__ */ jsx6(CheckIcon, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx6(PlusIcon, { className: "h-3 w-3" })
               }
             )
           ]
         }
       ) }, c.id);
     }) }) }),
-    canCreate && /* @__PURE__ */ jsx5(
+    canCreate && /* @__PURE__ */ jsx6(
       CreateAndAttachFooter,
       {
         token,
@@ -1773,9 +2193,9 @@ function CreateAndAttachFooter({
   const store = useAssociationsStore();
   const notifier = useNotifier();
   const info = store.registry.getEntityInfo(token);
-  const [editing, setEditing] = useState6(false);
-  const [name, setName] = useState6("");
-  const [busy, setBusy] = useState6(false);
+  const [editing, setEditing] = useState7(false);
+  const [name, setName] = useState7("");
+  const [busy, setBusy] = useState7(false);
   const submit = async () => {
     const title = name.trim();
     if (!title || busy) return;
@@ -1810,7 +2230,7 @@ function CreateAndAttachFooter({
     }
   };
   if (!editing) {
-    return /* @__PURE__ */ jsxs3(
+    return /* @__PURE__ */ jsxs4(
       "button",
       {
         type: "button",
@@ -1820,10 +2240,10 @@ function CreateAndAttachFooter({
         },
         className: "mt-2 flex min-h-11 w-full shrink-0 items-center justify-center gap-1.5 rounded-md border border-dashed border-border px-3 py-2 text-sm text-muted-foreground transition-colors hover:border-primary/60 hover:text-foreground md:min-h-0",
         children: [
-          /* @__PURE__ */ jsx5(PlusIcon, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx6(PlusIcon, { className: "h-4 w-4" }),
           "New ",
           info.label,
-          seed ? /* @__PURE__ */ jsxs3("span", { className: "max-w-40 truncate text-muted-foreground/70", children: [
+          seed ? /* @__PURE__ */ jsxs4("span", { className: "max-w-40 truncate text-muted-foreground/70", children: [
             "\u201C",
             seed,
             "\u201D"
@@ -1832,8 +2252,8 @@ function CreateAndAttachFooter({
       }
     );
   }
-  return /* @__PURE__ */ jsxs3("div", { className: "mt-2 flex shrink-0 items-center gap-1.5", children: [
-    /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsxs4("div", { className: "mt-2 flex shrink-0 items-center gap-1.5", children: [
+    /* @__PURE__ */ jsx6(
       Input,
       {
         autoFocus: true,
@@ -1852,17 +2272,17 @@ function CreateAndAttachFooter({
         style: { fontSize: 16 }
       }
     ),
-    /* @__PURE__ */ jsx5(
+    /* @__PURE__ */ jsx6(
       "button",
       {
         type: "button",
         disabled: busy || !name.trim(),
         onClick: () => void submit(),
         className: "flex h-11 items-center gap-1 rounded-md bg-primary px-2.5 text-sm font-medium text-primary-foreground transition-opacity disabled:opacity-50 md:h-8",
-        children: busy ? /* @__PURE__ */ jsx5(SpinnerIcon, { className: "h-3.5 w-3.5 animate-spin" }) : "Create"
+        children: busy ? /* @__PURE__ */ jsx6(SpinnerIcon, { className: "h-3.5 w-3.5 animate-spin" }) : "Create"
       }
     ),
-    /* @__PURE__ */ jsx5(
+    /* @__PURE__ */ jsx6(
       "button",
       {
         type: "button",
@@ -1873,38 +2293,122 @@ function CreateAndAttachFooter({
         },
         title: "Cancel",
         className: "flex h-11 w-11 items-center justify-center rounded-md border border-border text-muted-foreground transition-colors hover:text-foreground disabled:opacity-50 md:h-8 md:w-8",
-        children: /* @__PURE__ */ jsx5(XIcon, { className: "h-4 w-4" })
+        children: /* @__PURE__ */ jsx6(XIcon, { className: "h-4 w-4" })
       }
     )
   ] });
 }
 function ListMessage({ children }) {
-  return /* @__PURE__ */ jsx5("div", { className: "flex items-center justify-center gap-2 py-8 text-[13px] text-muted-foreground", children });
+  return /* @__PURE__ */ jsx6("div", { className: "flex items-center justify-center gap-2 py-8 text-[13px] text-muted-foreground", children });
 }
 
 // src/react/components/UniversalAssociationPicker.tsx
-import { useState as useState7 } from "react";
-import { cn as cn3, Input as Input2 } from "@ai-matrx/design-system";
-import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+import { useState as useState8 } from "react";
+import { cn as cn4, Input as Input2 } from "@ai-matrx/design-system";
+
+// src/react/components/entityDoors.tsx
+import { cn as cn3 } from "@ai-matrx/design-system";
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+function DoorRef(props) {
+  const { onOpen, ...refProps } = props;
+  const { entityDoors } = useAssociationsUiPorts();
+  const store = useAssociationsStore();
+  const HostRef = entityDoors?.EntityRef;
+  if (HostRef) return /* @__PURE__ */ jsx7(HostRef, { ...refProps });
+  const name = refProps.name ?? null;
+  const href = store.registry.tryGetEntityInfo(refProps.token)?.hrefFor?.(refProps.id) ?? null;
+  if (onOpen) {
+    return /* @__PURE__ */ jsx7(
+      "button",
+      {
+        type: "button",
+        onClick: onOpen,
+        className: cn3(
+          "min-w-0 truncate text-left underline-offset-2 hover:underline",
+          refProps.className
+        ),
+        children: name
+      }
+    );
+  }
+  if (href) {
+    return /* @__PURE__ */ jsxs5(
+      "a",
+      {
+        href,
+        target: refProps.openInNewTab === false ? void 0 : "_blank",
+        rel: "noopener noreferrer",
+        className: cn3(
+          "inline-flex min-w-0 items-center gap-1 truncate underline-offset-2 hover:underline",
+          refProps.className
+        ),
+        children: [
+          /* @__PURE__ */ jsx7("span", { className: "min-w-0 truncate", children: name }),
+          /* @__PURE__ */ jsx7(ExternalLinkIcon, { className: "h-3 w-3 shrink-0 opacity-0 transition-opacity group-hover:opacity-60" })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx7("span", { className: cn3("min-w-0 truncate", refProps.className), children: name });
+}
+function UnresolvedRef({ token, id }) {
+  const { entityDoors } = useAssociationsUiPorts();
+  const HostUnresolved = entityDoors?.UnresolvedRef;
+  if (HostUnresolved) return /* @__PURE__ */ jsx7(HostUnresolved, { token, id });
+  return /* @__PURE__ */ jsx7(
+    "span",
+    {
+      className: "inline-flex items-center rounded border border-border/60 bg-muted/40 px-1.5 py-0.5 text-[11px] text-muted-foreground",
+      title: `This ${token} could not be read \u2014 it may be deleted or not shared with you.`,
+      children: "Unavailable"
+    }
+  );
+}
+function DoorControlsSlot(props) {
+  const { entityDoors } = useAssociationsUiPorts();
+  const store = useAssociationsStore();
+  const HostControls = entityDoors?.DoorControls;
+  if (HostControls) return /* @__PURE__ */ jsx7(HostControls, { ...props });
+  const href = store.registry.tryGetEntityInfo(props.token)?.hrefFor?.(props.id) ?? null;
+  if (!href) return null;
+  const label = props.name ? `Open ${props.name}` : `Open this ${props.token}`;
+  return /* @__PURE__ */ jsx7(
+    "a",
+    {
+      href,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      "aria-label": label,
+      title: label,
+      className: cn3(
+        "inline-flex h-5 w-5 shrink-0 items-center justify-center rounded text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
+        props.className
+      ),
+      children: /* @__PURE__ */ jsx7(ExternalLinkIcon, { className: "h-3 w-3" })
+    }
+  );
+}
+
+// src/react/components/UniversalAssociationPicker.tsx
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
 function attachedKey(token, id) {
   return `${token}:${id}`;
 }
 function UniversalAssociationPicker(props) {
   const { attachedKeys, onAttach, onDetach, ownerId, orgId, className } = props;
   const store = useAssociationsStore();
-  const { entityDoors, pickerOverrides } = useAssociationsUiPorts();
+  const { pickerOverrides } = useAssociationsUiPorts();
   const notifier = useNotifier();
   const tokens = props.tokens ?? store.registry.curatedTokens();
-  const [query, setQuery] = useState7("");
-  const [browseToken, setBrowseToken] = useState7(null);
-  const [busyKey, setBusyKey] = useState7(null);
+  const [query, setQuery] = useState8("");
+  const [browseToken, setBrowseToken] = useState8(null);
+  const [busyKey, setBusyKey] = useState8(null);
   const { results, loading, isRecents } = useUniversalEntitySearch({
     query,
     tokens,
     ownerId: ownerId ?? null,
     enabled: browseToken === null
   });
-  const DoorControls = entityDoors?.DoorControls;
   const toggle = async (c) => {
     const key = attachedKey(c.token, c.id);
     if (busyKey) return;
@@ -1928,10 +2432,10 @@ function UniversalAssociationPicker(props) {
     groups.set(r.token, list);
   }
   const BrowseOverride = browseToken ? pickerOverrides?.[browseToken] : void 0;
-  return /* @__PURE__ */ jsxs4("div", { className: cn3("flex min-h-0 flex-1 flex-col gap-2", className), children: [
-    /* @__PURE__ */ jsxs4("div", { className: "relative", children: [
-      /* @__PURE__ */ jsx6(SearchIcon, { className: "absolute left-2.5 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
-      /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsxs6("div", { className: cn4("flex min-h-0 flex-1 flex-col gap-2", className), children: [
+    /* @__PURE__ */ jsxs6("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx8(SearchIcon, { className: "absolute left-2.5 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
+      /* @__PURE__ */ jsx8(
         Input2,
         {
           value: query,
@@ -1944,23 +2448,23 @@ function UniversalAssociationPicker(props) {
           style: { fontSize: 16 }
         }
       ),
-      loading && browseToken === null && /* @__PURE__ */ jsx6(SpinnerIcon, { className: "absolute right-2.5 top-1/2 h-4 w-4 -translate-y-1/2 animate-spin text-muted-foreground" })
+      loading && browseToken === null && /* @__PURE__ */ jsx8(SpinnerIcon, { className: "absolute right-2.5 top-1/2 h-4 w-4 -translate-y-1/2 animate-spin text-muted-foreground" })
     ] }),
-    /* @__PURE__ */ jsx6("div", { className: "flex flex-wrap gap-1", children: tokens.map((t) => {
+    /* @__PURE__ */ jsx8("div", { className: "flex flex-wrap gap-1", children: tokens.map((t) => {
       const info = store.registry.getEntityInfo(t);
       const ChipIcon = info.Icon ?? DefaultEntityIcon;
       const active = browseToken === t;
-      return /* @__PURE__ */ jsxs4(
+      return /* @__PURE__ */ jsxs6(
         "button",
         {
           type: "button",
           onClick: () => setBrowseToken(active ? null : t),
-          className: cn3(
+          className: cn4(
             "inline-flex items-center gap-1 rounded-md border px-1.5 py-0.5 text-[11px] transition-colors",
             active ? "border-primary/50 bg-primary/10 text-foreground" : "border-border text-muted-foreground hover:text-foreground hover:bg-accent"
           ),
           children: [
-            /* @__PURE__ */ jsx6(ChipIcon, { className: "h-3 w-3" }),
+            /* @__PURE__ */ jsx8(ChipIcon, { className: "h-3 w-3" }),
             info.labelPlural
           ]
         },
@@ -1970,7 +2474,7 @@ function UniversalAssociationPicker(props) {
     browseToken && BrowseOverride ? (
       // The token's canonical host picker (e.g. the stored-files browser)
       // owns per-token browsing when registered — never a plain list twin.
-      /* @__PURE__ */ jsx6(
+      /* @__PURE__ */ jsx8(
         BrowseOverride,
         {
           open: true,
@@ -1986,7 +2490,7 @@ function UniversalAssociationPicker(props) {
           onDetach: (id) => onDetach(browseToken, id)
         }
       )
-    ) : browseToken ? /* @__PURE__ */ jsx6("div", { className: "flex min-h-0 flex-1 flex-col", children: /* @__PURE__ */ jsx6(
+    ) : browseToken ? /* @__PURE__ */ jsx8("div", { className: "flex min-h-0 flex-1 flex-col", children: /* @__PURE__ */ jsx8(
       AssociationCandidateBody,
       {
         token: browseToken,
@@ -1999,63 +2503,63 @@ function UniversalAssociationPicker(props) {
         onAttach: (id, title) => onAttach(browseToken, id, title),
         onDetach: (id) => onDetach(browseToken, id)
       }
-    ) }) : /* @__PURE__ */ jsx6("div", { className: "-mx-1 min-h-0 flex-1 overflow-y-auto px-1", children: results.length === 0 ? /* @__PURE__ */ jsx6("p", { className: "py-6 text-center text-[12px] text-muted-foreground", children: loading ? "Searching\u2026" : query.trim() ? "No matches \u2014 narrow with a type chip to browse." : "No recent items. Type to search, or pick a type to browse." }) : /* @__PURE__ */ jsxs4("div", { className: "space-y-2", children: [
-      isRecents && /* @__PURE__ */ jsx6("p", { className: "px-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground/60", children: "Recent" }),
+    ) }) : /* @__PURE__ */ jsx8("div", { className: "-mx-1 min-h-0 flex-1 overflow-y-auto px-1", children: results.length === 0 ? /* @__PURE__ */ jsx8("p", { className: "py-6 text-center text-[12px] text-muted-foreground", children: loading ? "Searching\u2026" : query.trim() ? "No matches \u2014 narrow with a type chip to browse." : "No recent items. Type to search, or pick a type to browse." }) : /* @__PURE__ */ jsxs6("div", { className: "space-y-2", children: [
+      isRecents && /* @__PURE__ */ jsx8("p", { className: "px-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground/60", children: "Recent" }),
       [...groups.entries()].map(([token, items]) => {
         const info = store.registry.getEntityInfo(token);
         const GroupIcon = info.Icon ?? DefaultEntityIcon;
-        return /* @__PURE__ */ jsxs4("div", { className: "space-y-0.5", children: [
-          /* @__PURE__ */ jsxs4("p", { className: "flex items-center gap-1 px-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground/70", children: [
-            /* @__PURE__ */ jsx6(GroupIcon, { className: "h-3 w-3" }),
+        return /* @__PURE__ */ jsxs6("div", { className: "space-y-0.5", children: [
+          /* @__PURE__ */ jsxs6("p", { className: "flex items-center gap-1 px-1 text-[10px] font-medium uppercase tracking-wider text-muted-foreground/70", children: [
+            /* @__PURE__ */ jsx8(GroupIcon, { className: "h-3 w-3" }),
             info.labelPlural
           ] }),
-          /* @__PURE__ */ jsx6("ul", { className: "space-y-0.5", children: items.map((c) => {
+          /* @__PURE__ */ jsx8("ul", { className: "space-y-0.5", children: items.map((c) => {
             const key = attachedKey(c.token, c.id);
             const attached = attachedKeys.has(key);
             const busy = busyKey === key;
-            return /* @__PURE__ */ jsxs4(
+            return /* @__PURE__ */ jsxs6(
               "li",
               {
-                className: cn3(
+                className: cn4(
                   "group/entity-ref group flex items-center gap-1 rounded-md pr-1.5 transition-colors",
                   "hover:bg-accent",
                   attached && "bg-accent/40"
                 ),
                 children: [
-                  /* @__PURE__ */ jsxs4(
+                  /* @__PURE__ */ jsxs6(
                     "button",
                     {
                       type: "button",
                       disabled: busy,
                       onClick: () => toggle(c),
                       title: attached ? `Detach "${c.title}"` : `Attach "${c.title}"`,
-                      className: cn3(
+                      className: cn4(
                         "flex min-w-0 flex-1 items-center gap-2 rounded-md px-2.5 py-1.5 text-left text-sm",
                         "disabled:opacity-50"
                       ),
                       children: [
-                        /* @__PURE__ */ jsx6("span", { className: "min-w-0 flex-1 truncate text-foreground", children: c.title }),
-                        /* @__PURE__ */ jsx6(
+                        /* @__PURE__ */ jsx8("span", { className: "min-w-0 flex-1 truncate text-foreground", children: c.title }),
+                        /* @__PURE__ */ jsx8(
                           "span",
                           {
-                            className: cn3(
+                            className: cn4(
                               "flex h-5 w-5 shrink-0 items-center justify-center rounded-full",
                               attached ? "bg-primary text-primary-foreground" : "border border-border text-muted-foreground group-hover:border-primary/60"
                             ),
-                            children: busy ? /* @__PURE__ */ jsx6(SpinnerIcon, { className: "h-3 w-3 animate-spin" }) : attached ? /* @__PURE__ */ jsx6(CheckIcon, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx6(PlusIcon, { className: "h-3 w-3" })
+                            children: busy ? /* @__PURE__ */ jsx8(SpinnerIcon, { className: "h-3 w-3 animate-spin" }) : attached ? /* @__PURE__ */ jsx8(CheckIcon, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx8(PlusIcon, { className: "h-3 w-3" })
                           }
                         )
                       ]
                     }
                   ),
-                  DoorControls ? /* @__PURE__ */ jsx6(
-                    DoorControls,
+                  /* @__PURE__ */ jsx8(
+                    DoorControlsSlot,
                     {
                       token: c.token,
                       id: c.id,
                       name: c.title
                     }
-                  ) : null
+                  )
                 ]
               },
               key
@@ -2068,79 +2572,18 @@ function UniversalAssociationPicker(props) {
 }
 
 // src/react/components/AttachedItemsSheet.tsx
-import { useEffect as useEffect8, useState as useState8 } from "react";
+import { useEffect as useEffect10, useState as useState9 } from "react";
 import { cn as cn5 } from "@ai-matrx/design-system";
-
-// src/react/components/entityDoors.tsx
-import { cn as cn4 } from "@ai-matrx/design-system";
-import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
-function DoorRef(props) {
-  const { onOpen, ...refProps } = props;
-  const { entityDoors } = useAssociationsUiPorts();
-  const store = useAssociationsStore();
-  const HostRef = entityDoors?.EntityRef;
-  if (HostRef) return /* @__PURE__ */ jsx7(HostRef, { ...refProps });
-  const name = refProps.name ?? null;
-  const href = store.registry.tryGetEntityInfo(refProps.token)?.hrefFor?.(refProps.id) ?? null;
-  if (onOpen) {
-    return /* @__PURE__ */ jsx7(
-      "button",
-      {
-        type: "button",
-        onClick: onOpen,
-        className: cn4(
-          "min-w-0 truncate text-left underline-offset-2 hover:underline",
-          refProps.className
-        ),
-        children: name
-      }
-    );
-  }
-  if (href) {
-    return /* @__PURE__ */ jsxs5(
-      "a",
-      {
-        href,
-        target: refProps.openInNewTab === false ? void 0 : "_blank",
-        rel: "noopener noreferrer",
-        className: cn4(
-          "inline-flex min-w-0 items-center gap-1 truncate underline-offset-2 hover:underline",
-          refProps.className
-        ),
-        children: [
-          /* @__PURE__ */ jsx7("span", { className: "min-w-0 truncate", children: name }),
-          /* @__PURE__ */ jsx7(ExternalLinkIcon, { className: "h-3 w-3 shrink-0 opacity-0 transition-opacity group-hover:opacity-60" })
-        ]
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx7("span", { className: cn4("min-w-0 truncate", refProps.className), children: name });
-}
-function UnresolvedRef({ token, id }) {
-  const { entityDoors } = useAssociationsUiPorts();
-  const HostUnresolved = entityDoors?.UnresolvedRef;
-  if (HostUnresolved) return /* @__PURE__ */ jsx7(HostUnresolved, { token, id });
-  return /* @__PURE__ */ jsx7(
-    "span",
-    {
-      className: "inline-flex items-center rounded border border-border/60 bg-muted/40 px-1.5 py-0.5 text-[11px] text-muted-foreground",
-      title: `This ${token} could not be read \u2014 it may be deleted or not shared with you.`,
-      children: "Unavailable"
-    }
-  );
-}
-
-// src/react/components/AttachedItemsSheet.tsx
-import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
 function AttachedItemsSheet(props) {
   const store = useAssociationsStore();
   const info = store.registry.getEntityInfo(props.token);
   const Icon = info.Icon ?? DefaultEntityIcon;
   const title = info.labelPlural;
   const containerName = props.container?.label ?? props.containerLabel;
-  const subtitle = props.container ? /* @__PURE__ */ jsxs6("span", { className: "inline-flex min-w-0 max-w-full items-center gap-1", children: [
+  const subtitle = props.container ? /* @__PURE__ */ jsxs7("span", { className: "inline-flex min-w-0 max-w-full items-center gap-1", children: [
     "Attached to",
-    /* @__PURE__ */ jsx8(
+    /* @__PURE__ */ jsx9(
       DoorRef,
       {
         token: props.container.type,
@@ -2151,16 +2594,16 @@ function AttachedItemsSheet(props) {
     )
   ] }) : props.containerLabel ? `Attached to ${props.containerLabel}` : "Attached items";
   if (!props.open) return null;
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx9(
     AssociationWindow,
     {
       open: props.open,
       onClose: () => props.onOpenChange(false),
       scopeId: `attached:${props.token}`,
       title,
-      icon: /* @__PURE__ */ jsx8(Icon, { className: "size-3.5 text-primary" }),
+      icon: /* @__PURE__ */ jsx9(Icon, { className: "size-3.5 text-primary" }),
       subtitle,
-      children: /* @__PURE__ */ jsx8(
+      children: /* @__PURE__ */ jsx9(
         AttachedItemsBody,
         {
           token: props.token,
@@ -2184,11 +2627,11 @@ function AttachedItemsBody({
   const notifier = useNotifier();
   const info = store.registry.getEntityInfo(token);
   const Icon = info.Icon ?? DefaultEntityIcon;
-  const [titles, setTitles] = useState8(null);
-  const [titleError, setTitleError] = useState8(null);
-  const [busyId, setBusyId] = useState8(null);
+  const [titles, setTitles] = useState9(null);
+  const [titleError, setTitleError] = useState9(null);
+  const [busyId, setBusyId] = useState9(null);
   const idKey = links.map((l) => l.resourceId).sort().join(",");
-  useEffect8(() => {
+  useEffect10(() => {
     if (!enabled) return;
     const ids = idKey ? idKey.split(",") : [];
     if (ids.length === 0) {
@@ -2232,30 +2675,30 @@ function AttachedItemsBody({
       setBusyId(null);
     }
   };
-  return /* @__PURE__ */ jsxs6(Fragment2, { children: [
-    titleError ? /* @__PURE__ */ jsxs6("div", { className: "mb-2 rounded-md border border-destructive/40 bg-destructive/10 px-3 py-2 text-[12px] text-destructive", children: [
+  return /* @__PURE__ */ jsxs7(Fragment2, { children: [
+    titleError ? /* @__PURE__ */ jsxs7("div", { className: "mb-2 rounded-md border border-destructive/40 bg-destructive/10 px-3 py-2 text-[12px] text-destructive", children: [
       "Showing names recorded at attach time \u2014 they may be out of date.",
       " ",
       titleError
     ] }) : null,
-    /* @__PURE__ */ jsx8("div", { className: "flex-1 min-h-0 overflow-y-auto -mx-1 px-1", children: links.length === 0 ? /* @__PURE__ */ jsx8("div", { className: "flex items-center justify-center py-8 text-[13px] text-muted-foreground", children: "Nothing attached yet." }) : titles === null ? /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-center gap-2 py-8 text-[13px] text-muted-foreground", children: [
-      /* @__PURE__ */ jsx8(SpinnerIcon, { className: "h-4 w-4 animate-spin" }),
+    /* @__PURE__ */ jsx9("div", { className: "flex-1 min-h-0 overflow-y-auto -mx-1 px-1", children: links.length === 0 ? /* @__PURE__ */ jsx9("div", { className: "flex items-center justify-center py-8 text-[13px] text-muted-foreground", children: "Nothing attached yet." }) : titles === null ? /* @__PURE__ */ jsxs7("div", { className: "flex items-center justify-center gap-2 py-8 text-[13px] text-muted-foreground", children: [
+      /* @__PURE__ */ jsx9(SpinnerIcon, { className: "h-4 w-4 animate-spin" }),
       "Loading\u2026"
-    ] }) : /* @__PURE__ */ jsx8("ul", { className: "space-y-0.5", children: links.map((link) => {
+    ] }) : /* @__PURE__ */ jsx9("ul", { className: "space-y-0.5", children: links.map((link) => {
       const resolved = titles.get(link.resourceId);
       const missing = !titles.has(link.resourceId);
       const name = resolved ?? link.label ?? (missing ? null : "Untitled");
       const busy = busyId === link.resourceId;
-      return /* @__PURE__ */ jsxs6(
+      return /* @__PURE__ */ jsxs7(
         "li",
         {
           className: "group/entity-ref group flex items-center gap-2 rounded-md px-2.5 py-2 text-sm transition-colors hover:bg-accent",
           children: [
-            /* @__PURE__ */ jsx8(Icon, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
-            /* @__PURE__ */ jsx8("span", { className: "flex-1 min-w-0 truncate", children: name === null ? (
+            /* @__PURE__ */ jsx9(Icon, { className: "h-4 w-4 shrink-0 text-muted-foreground" }),
+            /* @__PURE__ */ jsx9("span", { className: "flex-1 min-w-0 truncate", children: name === null ? (
               // The X beside the row stays the one-click detach.
-              /* @__PURE__ */ jsx8(UnresolvedRef, { token, id: link.resourceId })
-            ) : /* @__PURE__ */ jsx8(
+              /* @__PURE__ */ jsx9(UnresolvedRef, { token, id: link.resourceId })
+            ) : /* @__PURE__ */ jsx9(
               DoorRef,
               {
                 token,
@@ -2265,7 +2708,7 @@ function AttachedItemsBody({
                 className: "text-foreground"
               }
             ) }),
-            /* @__PURE__ */ jsx8(
+            /* @__PURE__ */ jsx9(
               "button",
               {
                 type: "button",
@@ -2276,7 +2719,7 @@ function AttachedItemsBody({
                   "flex h-6 w-6 shrink-0 items-center justify-center rounded-md text-muted-foreground transition-colors",
                   "hover:bg-destructive/10 hover:text-destructive disabled:opacity-50"
                 ),
-                children: busy ? /* @__PURE__ */ jsx8(SpinnerIcon, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ jsx8(XIcon, { className: "h-3.5 w-3.5" })
+                children: busy ? /* @__PURE__ */ jsx9(SpinnerIcon, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ jsx9(XIcon, { className: "h-3.5 w-3.5" })
               }
             )
           ]
@@ -2284,14 +2727,14 @@ function AttachedItemsBody({
         link.edgeId
       );
     }) }) }),
-    onAdd ? /* @__PURE__ */ jsxs6(
+    onAdd ? /* @__PURE__ */ jsxs7(
       "button",
       {
         type: "button",
         onClick: onAdd,
         className: "mt-2 flex w-full items-center justify-center gap-1.5 rounded-md border border-border px-3 py-2 text-sm text-muted-foreground transition-colors hover:border-primary/60 hover:text-foreground",
         children: [
-          /* @__PURE__ */ jsx8(PlusIcon, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx9(PlusIcon, { className: "h-4 w-4" }),
           "Attach ",
           info.labelPlural.toLowerCase()
         ]
@@ -2301,7 +2744,7 @@ function AttachedItemsBody({
 }
 
 // src/react/components/AssociationCard.tsx
-import { useState as useState9 } from "react";
+import { useState as useState10 } from "react";
 import { cn as cn6 } from "@ai-matrx/design-system";
 
 // src/react/contentRoles.ts
@@ -2352,7 +2795,7 @@ function getContentRoleMeta(role) {
 }
 
 // src/react/components/AssociationCard.tsx
-import { Fragment as Fragment3, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
 function AssociationCard({
   token,
   container: containerProp,
@@ -2361,11 +2804,11 @@ function AssociationCard({
   const store = useAssociationsStore();
   const fromCtx = usePrimaryEntity();
   const container = containerProp ?? fromCtx;
-  const [open, setOpen] = useState9(false);
+  const [open, setOpen] = useState10(false);
   const info = store.registry.getEntityInfo(token);
   const role = getContentRoleMeta(info.contentRole);
   const Icon = info.Icon ?? DefaultEntityIcon;
-  const [listOpen, setListOpen] = useState9(false);
+  const [listOpen, setListOpen] = useState10(false);
   const { status, countFor, attachedIdsFor, linksFor, attach, detach } = useContainerLinks({
     containerType: container?.type ?? "organization",
     containerId: container?.id ?? null,
@@ -2383,8 +2826,8 @@ function AssociationCard({
   const loading = status === "loading" || status === "idle";
   const canAttach = info.canListCandidates;
   const canDrillIn = count > 0;
-  return /* @__PURE__ */ jsxs7(Fragment3, { children: [
-    /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs8(Fragment3, { children: [
+    /* @__PURE__ */ jsxs8(
       "div",
       {
         className: cn6(
@@ -2392,7 +2835,7 @@ function AssociationCard({
           className
         ),
         children: [
-          /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsx10(
             "span",
             {
               className: cn6(
@@ -2401,7 +2844,7 @@ function AssociationCard({
               )
             }
           ),
-          /* @__PURE__ */ jsxs7(
+          /* @__PURE__ */ jsxs8(
             "button",
             {
               type: "button",
@@ -2413,7 +2856,7 @@ function AssociationCard({
                 canDrillIn ? "cursor-pointer" : "cursor-default"
               ),
               children: [
-                /* @__PURE__ */ jsx9(
+                /* @__PURE__ */ jsx10(
                   "span",
                   {
                     className: cn6(
@@ -2421,20 +2864,20 @@ function AssociationCard({
                       role.accentBg,
                       role.accentText
                     ),
-                    children: /* @__PURE__ */ jsx9(Icon, { className: "h-4 w-4" })
+                    children: /* @__PURE__ */ jsx10(Icon, { className: "h-4 w-4" })
                   }
                 ),
-                /* @__PURE__ */ jsxs7("span", { className: "min-w-0 flex-1", children: [
-                  /* @__PURE__ */ jsx9("span", { className: "block truncate text-sm font-medium text-foreground", children: info.labelPlural }),
-                  /* @__PURE__ */ jsx9("span", { className: "block text-[11px] text-muted-foreground tabular-nums", children: loading ? /* @__PURE__ */ jsxs7("span", { className: "inline-flex items-center gap-1", children: [
-                    /* @__PURE__ */ jsx9(SpinnerIcon, { className: "h-3 w-3 animate-spin" }),
+                /* @__PURE__ */ jsxs8("span", { className: "min-w-0 flex-1", children: [
+                  /* @__PURE__ */ jsx10("span", { className: "block truncate text-sm font-medium text-foreground", children: info.labelPlural }),
+                  /* @__PURE__ */ jsx10("span", { className: "block text-[11px] text-muted-foreground tabular-nums", children: loading ? /* @__PURE__ */ jsxs8("span", { className: "inline-flex items-center gap-1", children: [
+                    /* @__PURE__ */ jsx10(SpinnerIcon, { className: "h-3 w-3 animate-spin" }),
                     "Loading\u2026"
                   ] }) : `${count} attached` })
                 ] })
               ]
             }
           ),
-          canAttach && /* @__PURE__ */ jsx9(
+          canAttach && /* @__PURE__ */ jsx10(
             "button",
             {
               type: "button",
@@ -2442,13 +2885,13 @@ function AssociationCard({
               "aria-label": `Attach ${info.labelPlural.toLowerCase()}`,
               title: `Attach ${info.labelPlural.toLowerCase()}`,
               className: "mr-2 flex h-11 w-11 shrink-0 items-center justify-center rounded-md border border-border text-muted-foreground transition-colors hover:border-primary/60 hover:text-foreground lg:mr-3 lg:h-7 lg:w-7",
-              children: /* @__PURE__ */ jsx9(PlusIcon, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ jsx10(PlusIcon, { className: "h-4 w-4" })
             }
           )
         ]
       }
     ),
-    listOpen && /* @__PURE__ */ jsx9(
+    listOpen && /* @__PURE__ */ jsx10(
       AttachedItemsSheet,
       {
         open: listOpen,
@@ -2466,7 +2909,7 @@ function AssociationCard({
         onDetach: (resourceId) => detach(token, resourceId)
       }
     ),
-    canAttach && /* @__PURE__ */ jsx9(
+    canAttach && /* @__PURE__ */ jsx10(
       AssociationPicker,
       {
         open,
@@ -2484,7 +2927,7 @@ function AssociationCard({
 
 // src/react/components/AssociationCardGrid.tsx
 import { cn as cn7 } from "@ai-matrx/design-system";
-import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
 function AssociationCardGrid({
   tokens,
   excludeTokens,
@@ -2495,33 +2938,33 @@ function AssociationCardGrid({
   const list = (tokens ?? store.registry.curatedTokens()).filter(
     (token) => !excluded.has(token)
   );
-  return /* @__PURE__ */ jsx10("div", { className: cn7("space-y-5", className), children: CONTENT_ROLES.map((role) => {
+  return /* @__PURE__ */ jsx11("div", { className: cn7("space-y-5", className), children: CONTENT_ROLES.map((role) => {
     const inRole = list.filter(
       (token) => store.registry.getEntityInfo(token).contentRole === role.id
     );
     if (inRole.length === 0) return null;
-    return /* @__PURE__ */ jsxs8("section", { children: [
-      /* @__PURE__ */ jsxs8("div", { className: "mb-2.5 flex items-baseline gap-3 pl-1.5", children: [
-        /* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx10(
+    return /* @__PURE__ */ jsxs9("section", { children: [
+      /* @__PURE__ */ jsxs9("div", { className: "mb-2.5 flex items-baseline gap-3 pl-1.5", children: [
+        /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx11(
             "span",
             {
               className: cn7("h-2.5 w-2.5 rounded-full", role.accentBar)
             }
           ),
-          /* @__PURE__ */ jsx10("h3", { className: "text-sm font-semibold text-foreground", children: role.title })
+          /* @__PURE__ */ jsx11("h3", { className: "text-sm font-semibold text-foreground", children: role.title })
         ] }),
-        /* @__PURE__ */ jsx10("p", { className: "hidden text-xs text-muted-foreground sm:block", children: role.tagline })
+        /* @__PURE__ */ jsx11("p", { className: "hidden text-xs text-muted-foreground sm:block", children: role.tagline })
       ] }),
-      /* @__PURE__ */ jsx10("div", { className: "grid grid-cols-1 gap-2 sm:grid-cols-2 lg:grid-cols-3", children: inRole.map((token) => /* @__PURE__ */ jsx10(AssociationCard, { token }, token)) })
+      /* @__PURE__ */ jsx11("div", { className: "grid grid-cols-1 gap-2 sm:grid-cols-2 lg:grid-cols-3", children: inRole.map((token) => /* @__PURE__ */ jsx11(AssociationCard, { token }, token)) })
     ] }, role.id);
   }) });
 }
 
 // src/react/components/AssociationList.tsx
-import { useState as useState10 } from "react";
+import { useState as useState11 } from "react";
 import { cn as cn8, Skeleton } from "@ai-matrx/design-system";
-import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
 function useContainerLinksAdapter(container, tokens) {
   const store = useAssociationsStore();
   const links = useContainerLinks({
@@ -2559,9 +3002,9 @@ function AssociationList(props) {
   const adapter = props.adapter ?? defaultAdapter;
   const variant = props.variant ?? "full";
   const tokenFilter = props.tokens ?? null;
-  const [pickerToken, setPickerToken] = useState10(null);
-  const [showUniversal, setShowUniversal] = useState10(false);
-  const [removingKeys, setRemovingKeys] = useState10(/* @__PURE__ */ new Set());
+  const [pickerToken, setPickerToken] = useState11(null);
+  const [showUniversal, setShowUniversal] = useState11(false);
+  const [removingKeys, setRemovingKeys] = useState11(/* @__PURE__ */ new Set());
   const rows = tokenFilter ? adapter.rows.filter((r) => tokenFilter.includes(r.token)) : adapter.rows;
   const visibleRows = rows.filter((r) => !removingKeys.has(r.key));
   const { titleFor } = useEntityTitles(
@@ -2599,15 +3042,15 @@ function AssociationList(props) {
   const grouped = groupRows(store, visibleRows);
   const isLoading = adapter.status === "loading" || adapter.status === "idle";
   const attachableTokens = tokenFilter ?? store.registry.curatedTokens();
-  return /* @__PURE__ */ jsxs9("div", { className: cn8("flex flex-col gap-2 text-foreground", props.className), children: [
-    /* @__PURE__ */ jsxs9("div", { className: "flex items-center justify-between gap-2 px-1", children: [
-      /* @__PURE__ */ jsxs9("h3", { className: "flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: [
-        /* @__PURE__ */ jsx11(Link2Icon, { className: "h-3.5 w-3.5" }),
+  return /* @__PURE__ */ jsxs10("div", { className: cn8("flex flex-col gap-2 text-foreground", props.className), children: [
+    /* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between gap-2 px-1", children: [
+      /* @__PURE__ */ jsxs10("h3", { className: "flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: [
+        /* @__PURE__ */ jsx12(Link2Icon, { className: "h-3.5 w-3.5" }),
         "Resources",
-        visibleRows.length > 0 && /* @__PURE__ */ jsx11("span", { className: "rounded bg-muted px-1 text-[10px] font-medium text-muted-foreground", children: visibleRows.length })
+        visibleRows.length > 0 && /* @__PURE__ */ jsx12("span", { className: "rounded bg-muted px-1 text-[10px] font-medium text-muted-foreground", children: visibleRows.length })
       ] }),
-      /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-1.5", children: [
-        /* @__PURE__ */ jsxs9(
+      /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-1.5", children: [
+        /* @__PURE__ */ jsxs10(
           "button",
           {
             type: "button",
@@ -2617,19 +3060,19 @@ function AssociationList(props) {
               showUniversal ? "bg-accent text-foreground" : "text-muted-foreground hover:bg-accent hover:text-foreground"
             ),
             children: [
-              /* @__PURE__ */ jsx11(PlusIcon, { className: "h-3 w-3" }),
+              /* @__PURE__ */ jsx12(PlusIcon, { className: "h-3 w-3" }),
               "Add"
             ]
           }
         ),
-        /* @__PURE__ */ jsx11(
+        /* @__PURE__ */ jsx12(
           "button",
           {
             type: "button",
             onClick: () => void adapter.reload(),
             title: "Refresh",
             className: "text-muted-foreground/60 transition-colors hover:text-foreground",
-            children: /* @__PURE__ */ jsx11(
+            children: /* @__PURE__ */ jsx12(
               RefreshIcon,
               {
                 className: cn8(
@@ -2642,7 +3085,7 @@ function AssociationList(props) {
         )
       ] })
     ] }),
-    showUniversal && /* @__PURE__ */ jsx11("div", { className: "rounded-md border border-border/60 bg-muted/30 p-2 max-h-80 flex flex-col", children: /* @__PURE__ */ jsx11(
+    showUniversal && /* @__PURE__ */ jsx12("div", { className: "rounded-md border border-border/60 bg-muted/30 p-2 max-h-80 flex flex-col", children: /* @__PURE__ */ jsx12(
       UniversalAssociationPicker,
       {
         tokens: attachableTokens,
@@ -2652,9 +3095,9 @@ function AssociationList(props) {
         onDetach: (token, id) => adapter.detach(token, id)
       }
     ) }),
-    adapter.status === "error" && /* @__PURE__ */ jsxs9("div", { className: "flex items-center justify-between gap-2 rounded-md border border-destructive/40 bg-destructive/10 px-2.5 py-2", children: [
-      /* @__PURE__ */ jsx11("span", { className: "truncate text-[11px] text-destructive", children: adapter.error || "Failed to load resources" }),
-      /* @__PURE__ */ jsx11(
+    adapter.status === "error" && /* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between gap-2 rounded-md border border-destructive/40 bg-destructive/10 px-2.5 py-2", children: [
+      /* @__PURE__ */ jsx12("span", { className: "truncate text-[11px] text-destructive", children: adapter.error || "Failed to load resources" }),
+      /* @__PURE__ */ jsx12(
         "button",
         {
           type: "button",
@@ -2664,17 +3107,17 @@ function AssociationList(props) {
         }
       )
     ] }),
-    adapter.status !== "error" && isLoading && visibleRows.length === 0 && /* @__PURE__ */ jsxs9("div", { className: "space-y-1.5 px-1", children: [
-      /* @__PURE__ */ jsx11(Skeleton, { className: "h-3 w-20" }),
-      /* @__PURE__ */ jsx11(Skeleton, { className: "h-7 w-full rounded-md" }),
-      /* @__PURE__ */ jsx11(Skeleton, { className: "h-7 w-3/4 rounded-md" })
+    adapter.status !== "error" && isLoading && visibleRows.length === 0 && /* @__PURE__ */ jsxs10("div", { className: "space-y-1.5 px-1", children: [
+      /* @__PURE__ */ jsx12(Skeleton, { className: "h-3 w-20" }),
+      /* @__PURE__ */ jsx12(Skeleton, { className: "h-7 w-full rounded-md" }),
+      /* @__PURE__ */ jsx12(Skeleton, { className: "h-7 w-3/4 rounded-md" })
     ] }),
-    adapter.status === "ready" && visibleRows.length === 0 && /* @__PURE__ */ jsx11("p", { className: "px-1 py-1 text-[11px] text-muted-foreground", children: "Nothing attached yet \u2014 use Add to link anything." }),
-    visibleRows.length > 0 && /* @__PURE__ */ jsx11("div", { className: "space-y-2.5", children: grouped.map(({ role, tokens: tokenGroups }) => {
+    adapter.status === "ready" && visibleRows.length === 0 && /* @__PURE__ */ jsx12("p", { className: "px-1 py-1 text-[11px] text-muted-foreground", children: "Nothing attached yet \u2014 use Add to link anything." }),
+    visibleRows.length > 0 && /* @__PURE__ */ jsx12("div", { className: "space-y-2.5", children: grouped.map(({ role, tokens: tokenGroups }) => {
       const roleMeta = getContentRoleMeta(role);
-      return /* @__PURE__ */ jsxs9("div", { className: "space-y-1.5", children: [
-        variant === "full" && /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-1.5 px-1", children: [
-          /* @__PURE__ */ jsx11(
+      return /* @__PURE__ */ jsxs10("div", { className: "space-y-1.5", children: [
+        variant === "full" && /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-1.5 px-1", children: [
+          /* @__PURE__ */ jsx12(
             "span",
             {
               className: cn8(
@@ -2683,7 +3126,7 @@ function AssociationList(props) {
               )
             }
           ),
-          /* @__PURE__ */ jsx11(
+          /* @__PURE__ */ jsx12(
             "p",
             {
               className: cn8(
@@ -2696,28 +3139,28 @@ function AssociationList(props) {
         ] }),
         tokenGroups.map(({ info, token, rows: tokenRows }) => {
           const TokenIcon = info?.Icon ?? null;
-          return /* @__PURE__ */ jsxs9("div", { className: "space-y-0.5", children: [
-            /* @__PURE__ */ jsxs9("div", { className: "flex items-center justify-between gap-1 px-1", children: [
-              /* @__PURE__ */ jsxs9("p", { className: "flex items-center gap-1 text-[10px] font-medium text-muted-foreground/80", children: [
-                TokenIcon ? /* @__PURE__ */ jsx11(TokenIcon, { className: "h-3 w-3" }) : null,
+          return /* @__PURE__ */ jsxs10("div", { className: "space-y-0.5", children: [
+            /* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between gap-1 px-1", children: [
+              /* @__PURE__ */ jsxs10("p", { className: "flex items-center gap-1 text-[10px] font-medium text-muted-foreground/80", children: [
+                TokenIcon ? /* @__PURE__ */ jsx12(TokenIcon, { className: "h-3 w-3" }) : null,
                 info?.labelPlural ?? titleize(token),
-                /* @__PURE__ */ jsx11("span", { className: "text-muted-foreground/50", children: tokenRows.length })
+                /* @__PURE__ */ jsx12("span", { className: "text-muted-foreground/50", children: tokenRows.length })
               ] }),
-              /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-1", children: [
                 props.renderSectionActions && info ? props.renderSectionActions(info.token) : null,
-                info?.canListCandidates && /* @__PURE__ */ jsx11(
+                info?.canListCandidates && /* @__PURE__ */ jsx12(
                   "button",
                   {
                     type: "button",
                     onClick: () => setPickerToken(info.token),
                     title: `Add ${info.labelPlural}`,
                     className: "rounded p-0.5 text-muted-foreground/60 transition-colors hover:bg-accent hover:text-foreground",
-                    children: /* @__PURE__ */ jsx11(PlusIcon, { className: "h-3 w-3" })
+                    children: /* @__PURE__ */ jsx12(PlusIcon, { className: "h-3 w-3" })
                   }
                 )
               ] })
             ] }),
-            /* @__PURE__ */ jsx11("ul", { className: "space-y-0.5", children: tokenRows.map((row) => {
+            /* @__PURE__ */ jsx12("ul", { className: "space-y-0.5", children: tokenRows.map((row) => {
               const busy = removingKeys.has(row.key);
               const custom = props.renderRow?.(row, {
                 title: titleFor({
@@ -2730,9 +3173,9 @@ function AssociationList(props) {
                 onOpen: () => openRow(row)
               });
               if (custom != null) {
-                return /* @__PURE__ */ jsx11("li", { children: custom }, row.key);
+                return /* @__PURE__ */ jsx12("li", { children: custom }, row.key);
               }
-              return /* @__PURE__ */ jsx11("li", { children: /* @__PURE__ */ jsxs9(
+              return /* @__PURE__ */ jsx12("li", { children: /* @__PURE__ */ jsxs10(
                 "div",
                 {
                   className: cn8(
@@ -2740,7 +3183,7 @@ function AssociationList(props) {
                     busy && "opacity-50"
                   ),
                   children: [
-                    /* @__PURE__ */ jsx11(
+                    /* @__PURE__ */ jsx12(
                       DoorRef,
                       {
                         token: row.token,
@@ -2756,9 +3199,9 @@ function AssociationList(props) {
                         className: "min-w-0 flex-1 text-foreground"
                       }
                     ),
-                    row.originRefs && row.originRefs.length > 0 ? /* @__PURE__ */ jsxs9("span", { className: "flex shrink-0 items-center gap-1 text-[10px] text-muted-foreground/60", children: [
+                    row.originRefs && row.originRefs.length > 0 ? /* @__PURE__ */ jsxs10("span", { className: "flex shrink-0 items-center gap-1 text-[10px] text-muted-foreground/60", children: [
                       "via",
-                      row.originRefs.map((origin) => /* @__PURE__ */ jsx11(
+                      row.originRefs.map((origin) => /* @__PURE__ */ jsx12(
                         DoorRef,
                         {
                           token: origin.token,
@@ -2770,8 +3213,8 @@ function AssociationList(props) {
                         },
                         `${origin.token}:${origin.id}`
                       ))
-                    ] }) : row.originNote ? /* @__PURE__ */ jsx11("span", { className: "shrink-0 text-[10px] text-muted-foreground/60", children: row.originNote }) : null,
-                    adapter.setPinned && info && row.removable && /* @__PURE__ */ jsx11(
+                    ] }) : row.originNote ? /* @__PURE__ */ jsx12("span", { className: "shrink-0 text-[10px] text-muted-foreground/60", children: row.originNote }) : null,
+                    adapter.setPinned && info && row.removable && /* @__PURE__ */ jsx12(
                       "button",
                       {
                         type: "button",
@@ -2786,7 +3229,7 @@ function AssociationList(props) {
                           "shrink-0 rounded p-0.5 transition-colors hover:!text-foreground",
                           row.pinned ? "text-primary" : "text-muted-foreground/0 group-hover:text-muted-foreground"
                         ),
-                        children: /* @__PURE__ */ jsx11(
+                        children: /* @__PURE__ */ jsx12(
                           PinIcon,
                           {
                             className: cn8(
@@ -2797,7 +3240,7 @@ function AssociationList(props) {
                         )
                       }
                     ),
-                    row.removable && /* @__PURE__ */ jsx11(
+                    row.removable && /* @__PURE__ */ jsx12(
                       "button",
                       {
                         type: "button",
@@ -2806,7 +3249,7 @@ function AssociationList(props) {
                         title: "Detach",
                         "aria-label": "Detach",
                         className: "shrink-0 rounded p-0.5 text-muted-foreground/0 transition-colors group-hover:text-muted-foreground hover:!text-destructive disabled:opacity-50",
-                        children: busy ? /* @__PURE__ */ jsx11(SpinnerIcon, { className: "h-3 w-3 animate-spin" }) : /* @__PURE__ */ jsx11(XIcon, { className: "h-3 w-3" })
+                        children: busy ? /* @__PURE__ */ jsx12(SpinnerIcon, { className: "h-3 w-3 animate-spin" }) : /* @__PURE__ */ jsx12(XIcon, { className: "h-3 w-3" })
                       }
                     )
                   ]
@@ -2817,7 +3260,7 @@ function AssociationList(props) {
         })
       ] }, role);
     }) }),
-    pickerToken && /* @__PURE__ */ jsx11(
+    pickerToken && /* @__PURE__ */ jsx12(
       AssociationPicker,
       {
         open: true,
@@ -2873,9 +3316,9 @@ function titleize(token) {
 }
 
 // src/react/components/AssociationCaptureToolbar.tsx
-import { useRef as useRef7, useState as useState11 } from "react";
+import { useRef as useRef8, useState as useState12 } from "react";
 import { Button, cn as cn9, Input as Input3 } from "@ai-matrx/design-system";
-import { Fragment as Fragment4, jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
 function AssociationCaptureToolbar({
   attach,
   uploadFolderPath,
@@ -2893,21 +3336,43 @@ function AssociationCaptureToolbar({
   const store = useAssociationsStore();
   const { capture } = useAssociationsUiPorts();
   const notifier = useNotifier();
-  const fileInputRef = useRef7(null);
-  const [isUploading, setIsUploading] = useState11(false);
-  const [isDragOver, setIsDragOver] = useState11(false);
-  const [isPicking, setIsPicking] = useState11(false);
-  const [namingDoc, setNamingDoc] = useState11(false);
-  const [docName, setDocName] = useState11("");
-  const [creatingDoc, setCreatingDoc] = useState11(false);
+  const fileInputRef = useRef8(null);
+  const [isUploading, setIsUploading] = useState12(false);
+  const [isDragOver, setIsDragOver] = useState12(false);
+  const [isPicking, setIsPicking] = useState12(false);
+  const [namingDoc, setNamingDoc] = useState12(false);
+  const [docName, setDocName] = useState12("");
+  const [creatingDoc, setCreatingDoc] = useState12(false);
+  const hostRequestUpload = capture?.requestUpload;
+  const hostUploadFile = capture?.uploadFile;
+  const requestUploadPath = hostRequestUpload ? (opts) => hostRequestUpload(opts) : hostUploadFile ? async (opts) => {
+    const uploaded = [];
+    const failed = [];
+    for (const file of opts.files) {
+      try {
+        const result = await hostUploadFile(file, {
+          folderPath: opts.folderPath,
+          ...opts.visibility !== void 0 ? { visibility: opts.visibility } : {}
+        });
+        if (result.ok) uploaded.push(result.id);
+        else failed.push({ name: file.name, error: result.error });
+      } catch (err) {
+        failed.push({
+          name: file.name,
+          error: err instanceof Error && err.message ? err.message : "Upload failed"
+        });
+      }
+    }
+    return { uploaded, aliased: [], failed };
+  } : void 0;
   const actions = {
-    upload: (showActions?.upload ?? true) && Boolean(capture?.requestUpload),
+    upload: (showActions?.upload ?? true) && Boolean(requestUploadPath),
     addFile: (showActions?.addFile ?? true) && Boolean(capture?.openFilePicker),
     newDocument: (showActions?.newDocument ?? true) && Boolean(capture?.createDataTable)
   };
-  const canDrop = Boolean(capture?.requestUpload);
+  const canDrop = Boolean(requestUploadPath);
   const uploadAndAttach = async (files) => {
-    const requestUpload = capture?.requestUpload;
+    const requestUpload = requestUploadPath;
     if (files.length === 0 || !requestUpload) return;
     setIsUploading(true);
     const watchdog = setTimeout(() => {
@@ -3065,7 +3530,7 @@ function AssociationCaptureToolbar({
     }
   };
   const anyBuiltIn = actions.upload || actions.addFile || actions.newDocument;
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11(
     "div",
     {
       className: cn9(
@@ -3086,11 +3551,11 @@ function AssociationCaptureToolbar({
       },
       onDrop: handleDrop,
       children: [
-        isDragOver ? /* @__PURE__ */ jsx12("div", { className: "pointer-events-none absolute inset-0 z-10 grid place-items-center bg-background/70", children: /* @__PURE__ */ jsxs10("span", { className: "flex items-center gap-2 rounded-md border border-primary/40 bg-card px-3 py-1.5 text-xs font-medium text-foreground", children: [
-          /* @__PURE__ */ jsx12(UploadIcon, { className: "size-3.5 text-primary" }),
+        isDragOver ? /* @__PURE__ */ jsx13("div", { className: "pointer-events-none absolute inset-0 z-10 grid place-items-center bg-background/70", children: /* @__PURE__ */ jsxs11("span", { className: "flex items-center gap-2 rounded-md border border-primary/40 bg-card px-3 py-1.5 text-xs font-medium text-foreground", children: [
+          /* @__PURE__ */ jsx13(UploadIcon, { className: "size-3.5 text-primary" }),
           "Drop to upload & attach"
         ] }) }) : null,
-        /* @__PURE__ */ jsx12(
+        /* @__PURE__ */ jsx13(
           "input",
           {
             ref: fileInputRef,
@@ -3100,8 +3565,8 @@ function AssociationCaptureToolbar({
             onChange: handleFilesSelected
           }
         ),
-        showToolbar && (anyBuiltIn || extraActions) ? /* @__PURE__ */ jsx12("div", { className: "flex flex-wrap items-center gap-0.5 border-b border-border/60 px-1.5 py-1", children: namingDoc ? /* @__PURE__ */ jsxs10("div", { className: "flex flex-1 items-center gap-1.5 py-0.5", children: [
-          /* @__PURE__ */ jsx12(
+        showToolbar && (anyBuiltIn || extraActions) ? /* @__PURE__ */ jsx13("div", { className: "flex flex-wrap items-center gap-0.5 border-b border-border/60 px-1.5 py-1", children: namingDoc ? /* @__PURE__ */ jsxs11("div", { className: "flex flex-1 items-center gap-1.5 py-0.5", children: [
+          /* @__PURE__ */ jsx13(
             Input3,
             {
               autoFocus: true,
@@ -3120,17 +3585,17 @@ function AssociationCaptureToolbar({
               style: { fontSize: 16 }
             }
           ),
-          /* @__PURE__ */ jsx12(
+          /* @__PURE__ */ jsx13(
             "button",
             {
               type: "button",
               disabled: creatingDoc || !docName.trim(),
               onClick: () => void handleCreateDoc(),
               className: "flex h-7 items-center rounded-md bg-primary px-2 text-[11px] font-medium text-primary-foreground disabled:opacity-50",
-              children: creatingDoc ? /* @__PURE__ */ jsx12(SpinnerIcon, { className: "size-3.5 animate-spin" }) : "Create"
+              children: creatingDoc ? /* @__PURE__ */ jsx13(SpinnerIcon, { className: "size-3.5 animate-spin" }) : "Create"
             }
           ),
-          /* @__PURE__ */ jsx12(
+          /* @__PURE__ */ jsx13(
             "button",
             {
               type: "button",
@@ -3143,8 +3608,8 @@ function AssociationCaptureToolbar({
               children: "Cancel"
             }
           )
-        ] }) : /* @__PURE__ */ jsxs10(Fragment4, { children: [
-          actions.upload ? /* @__PURE__ */ jsx12(
+        ] }) : /* @__PURE__ */ jsxs11(Fragment4, { children: [
+          actions.upload ? /* @__PURE__ */ jsx13(
             CaptureToolbarAction,
             {
               icon: isUploading ? SpinnerIcon : UploadIcon,
@@ -3154,7 +3619,7 @@ function AssociationCaptureToolbar({
               disabled: isPicking || isUploading
             }
           ) : null,
-          actions.addFile ? /* @__PURE__ */ jsx12(
+          actions.addFile ? /* @__PURE__ */ jsx13(
             CaptureToolbarAction,
             {
               icon: isPicking ? SpinnerIcon : FolderOpenIcon,
@@ -3164,8 +3629,8 @@ function AssociationCaptureToolbar({
               disabled: isPicking || isUploading
             }
           ) : null,
-          (actions.upload || actions.addFile) && actions.newDocument ? /* @__PURE__ */ jsx12("span", { className: "mx-1 h-4 w-px bg-border" }) : null,
-          actions.newDocument ? /* @__PURE__ */ jsx12(
+          (actions.upload || actions.addFile) && actions.newDocument ? /* @__PURE__ */ jsx13("span", { className: "mx-1 h-4 w-px bg-border" }) : null,
+          actions.newDocument ? /* @__PURE__ */ jsx13(
             CaptureToolbarAction,
             {
               icon: creatingDoc ? SpinnerIcon : PlusIcon,
@@ -3189,7 +3654,7 @@ function CaptureToolbarAction({
   disabled,
   spinning
 }) {
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11(
     Button,
     {
       type: "button",
@@ -3199,15 +3664,145 @@ function CaptureToolbarAction({
       disabled,
       className: "h-7 gap-1 px-2 text-[11px] text-muted-foreground hover:text-foreground",
       children: [
-        /* @__PURE__ */ jsx12(Icon, { className: cn9("size-3.5", spinning && "animate-spin") }),
+        /* @__PURE__ */ jsx13(Icon, { className: cn9("size-3.5", spinning && "animate-spin") }),
         label
       ]
     }
   );
 }
 
+// src/react/lazyPorts.tsx
+import { Suspense, lazy } from "react";
+import { jsx as jsx14 } from "react/jsx-runtime";
+function lazyComponent(load) {
+  return lazy(async () => {
+    const loaded = await load();
+    return typeof loaded === "function" ? { default: loaded } : loaded;
+  });
+}
+function lazyWindowShell(load) {
+  const Loaded = lazyComponent(load);
+  return function LazyWindowShell(props) {
+    return /* @__PURE__ */ jsx14(Suspense, { fallback: null, children: /* @__PURE__ */ jsx14(Loaded, { ...props }) });
+  };
+}
+function lazyPickerOverride(load) {
+  const Loaded = lazyComponent(load);
+  return function LazyPickerOverride(props) {
+    if (!props.open) return null;
+    return /* @__PURE__ */ jsx14(Suspense, { fallback: null, children: /* @__PURE__ */ jsx14(Loaded, { ...props }) });
+  };
+}
+
+// src/react/hooks/useAssociationPickerBridge.ts
+import { useCallback as useCallback3, useState as useState13 } from "react";
+function useAssociationPickerBridge(props, options = {}) {
+  const store = useAssociationsStore();
+  const notifier = useNotifier();
+  const [busy, setBusy] = useState13(false);
+  const { attachedIds, onAttach, onDetach, token } = props;
+  const {
+    createdLocationLabel,
+    openCreatedLocation,
+    itemNoun = "item"
+  } = options;
+  const attachMany = useCallback3(
+    async (items) => {
+      if (items.length === 0) return;
+      setBusy(true);
+      const failed = [];
+      try {
+        for (const item of items) {
+          try {
+            const result = await onAttach(item.id, item.name);
+            if (!result.ok) {
+              failed.push({ name: item.name, error: result.error });
+            }
+          } catch (error) {
+            store.errorSink({
+              code: "picker_attach_threw",
+              message: `[associations] attaching ${itemNoun} "${item.name}" threw`,
+              context: { token, id: item.id, detail: error }
+            });
+            failed.push({
+              name: item.name,
+              error: error instanceof Error ? error.message : void 0
+            });
+          }
+        }
+        const attached = items.length - failed.length;
+        if (attached > 0) {
+          notifier.success(
+            attached === 1 ? `Attached 1 ${itemNoun}` : `Attached ${attached} ${itemNoun}s`
+          );
+        }
+        if (failed.length > 0) {
+          const first = failed[0];
+          const detail = first?.error ? ` (${first.error})` : "";
+          notifier.error(
+            failed.length === 1 ? `Couldn't attach "${first?.name ?? itemNoun}"${detail}` : `Couldn't attach ${failed.length} ${itemNoun}s${detail}`,
+            {
+              ...createdLocationLabel ? {
+                description: `The ${failed.length === 1 ? itemNoun + " is" : itemNoun + "s are"} safe in ${createdLocationLabel}. You can retry the association here.`
+              } : {},
+              ...openCreatedLocation ? { action: openCreatedLocation } : {}
+            }
+          );
+          store.errorSink({
+            code: "picker_attach_partial",
+            message: `[associations] ${failed.length} of ${items.length} ${itemNoun}s were not attached`,
+            context: { token, failed }
+          });
+        }
+      } finally {
+        setBusy(false);
+      }
+    },
+    [
+      createdLocationLabel,
+      itemNoun,
+      notifier,
+      onAttach,
+      openCreatedLocation,
+      store,
+      token
+    ]
+  );
+  const toggle = useCallback3(
+    async (item) => {
+      setBusy(true);
+      try {
+        const detaching = attachedIds.has(item.id);
+        const result = detaching ? await onDetach(item.id) : await onAttach(item.id, item.name);
+        if (!result.ok) {
+          const verb = detaching ? "detach" : "attach";
+          notifier.error(
+            `Couldn't ${verb} "${item.name}"` + (result.error ? `: ${result.error}` : "")
+          );
+          store.errorSink({
+            code: detaching ? "picker_detach_failed" : "picker_attach_failed",
+            message: `[associations] ${verb} refused for "${item.name}"`,
+            context: { token, id: item.id, error: result.error }
+          });
+        }
+      } catch (error) {
+        store.errorSink({
+          code: "picker_toggle_threw",
+          message: `[associations] toggling ${itemNoun} "${item.name}" threw`,
+          context: { token, id: item.id, detail: error }
+        });
+        notifier.error(`Couldn't update "${item.name}"`);
+      } finally {
+        setBusy(false);
+      }
+    },
+    [attachedIds, itemNoun, notifier, onAttach, onDetach, store, token]
+  );
+  return { attachMany, toggle, busy };
+}
+
 // src/react/components/AssociationEntitySelect.tsx
-import { useState as useState12 } from "react";
+import { useState as useState14 } from "react";
 import {
   cn as cn10,
   Command,
@@ -3221,7 +3816,7 @@ import {
   PopoverContent,
   PopoverTrigger
 } from "@ai-matrx/design-system";
-import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
 function AssociationEntitySelect({
   token,
   adapter,
@@ -3235,19 +3830,17 @@ function AssociationEntitySelect({
   createSlot
 }) {
   const store = useAssociationsStore();
-  const { entityDoors } = useAssociationsUiPorts();
   const notifier = useNotifier();
   const info = store.registry.getEntityInfo(token);
   const InfoIcon = info.Icon ?? DefaultEntityIcon;
-  const DoorControls = entityDoors?.DoorControls;
   const { items, activeId } = adapter;
   const active = items.find((i) => i.id === activeId) ?? null;
   const activeIndex = active ? items.indexOf(active) : -1;
-  const [open, setOpen] = useState12(false);
-  const [query, setQuery] = useState12("");
-  const [creating, setCreating] = useState12(false);
-  const [draftName, setDraftName] = useState12("");
-  const [busy, setBusy] = useState12(false);
+  const [open, setOpen] = useState14(false);
+  const [query, setQuery] = useState14("");
+  const [creating, setCreating] = useState14(false);
+  const [draftName, setDraftName] = useState14("");
+  const [busy, setBusy] = useState14(false);
   const entityLabel = info.label.toLowerCase();
   const close = () => {
     setOpen(false);
@@ -3264,7 +3857,7 @@ function AssociationEntitySelect({
     if (id) close();
     else notifier.error(`Couldn't create the ${entityLabel}`);
   };
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     "div",
     {
       className: cn10(
@@ -3272,7 +3865,7 @@ function AssociationEntitySelect({
         className
       ),
       children: [
-        showIcon ? /* @__PURE__ */ jsx13(
+        showIcon ? /* @__PURE__ */ jsx15(
           InfoIcon,
           {
             className: cn10(
@@ -3282,7 +3875,7 @@ function AssociationEntitySelect({
             "aria-hidden": true
           }
         ) : null,
-        active ? /* @__PURE__ */ jsx13(
+        active ? /* @__PURE__ */ jsx15(
           EditableLabel,
           {
             value: active.title,
@@ -3301,8 +3894,8 @@ function AssociationEntitySelect({
             inputClassName: "text-xs font-medium"
           }
         ) : null,
-        active && DoorControls ? /* @__PURE__ */ jsx13(DoorControls, { token, id: active.id, name: active.title }) : null,
-        !active ? /* @__PURE__ */ jsx13(
+        active ? /* @__PURE__ */ jsx15(DoorControlsSlot, { token, id: active.id, name: active.title }) : null,
+        !active ? /* @__PURE__ */ jsx15(
           "span",
           {
             className: cn10(
@@ -3312,13 +3905,13 @@ function AssociationEntitySelect({
             children: adapter.loading ? "\u2026" : emptyLabel ?? info.labelPlural
           }
         ) : null,
-        /* @__PURE__ */ jsxs11(
+        /* @__PURE__ */ jsxs12(
           Popover,
           {
             open,
             onOpenChange: (next) => next ? setOpen(true) : close(),
             children: [
-              /* @__PURE__ */ jsx13(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs11(
+              /* @__PURE__ */ jsx15(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs12(
                 "button",
                 {
                   type: "button",
@@ -3326,17 +3919,17 @@ function AssociationEntitySelect({
                   title: `Switch or add ${info.labelPlural.toLowerCase()}`,
                   "aria-label": `Switch or add ${info.labelPlural.toLowerCase()}`,
                   children: [
-                    items.length > 1 ? /* @__PURE__ */ jsxs11("span", { className: "tabular-nums", children: [
+                    items.length > 1 ? /* @__PURE__ */ jsxs12("span", { className: "tabular-nums", children: [
                       activeIndex >= 0 ? activeIndex + 1 : "\u2014",
                       "/",
                       items.length
                     ] }) : null,
-                    /* @__PURE__ */ jsx13(ChevronDownIcon, { className: "size-3 opacity-60" })
+                    /* @__PURE__ */ jsx15(ChevronDownIcon, { className: "size-3 opacity-60" })
                   ]
                 }
               ) }),
-              /* @__PURE__ */ jsx13(PopoverContent, { className: "w-60 p-0", align, children: /* @__PURE__ */ jsxs11(Command, { children: [
-                items.length > 5 ? /* @__PURE__ */ jsx13(
+              /* @__PURE__ */ jsx15(PopoverContent, { className: "w-60 p-0", align, children: /* @__PURE__ */ jsxs12(Command, { children: [
+                items.length > 5 ? /* @__PURE__ */ jsx15(
                   CommandInput,
                   {
                     value: query,
@@ -3344,9 +3937,9 @@ function AssociationEntitySelect({
                     placeholder: `Search ${info.labelPlural.toLowerCase()}\u2026`
                   }
                 ) : null,
-                /* @__PURE__ */ jsxs11(CommandList, { children: [
-                  /* @__PURE__ */ jsx13(CommandEmpty, { children: "No match." }),
-                  items.length > 0 ? /* @__PURE__ */ jsx13(CommandGroup, { children: items.map((item) => /* @__PURE__ */ jsxs11(
+                /* @__PURE__ */ jsxs12(CommandList, { children: [
+                  /* @__PURE__ */ jsx15(CommandEmpty, { children: "No match." }),
+                  items.length > 0 ? /* @__PURE__ */ jsx15(CommandGroup, { children: items.map((item) => /* @__PURE__ */ jsxs12(
                     CommandItem,
                     {
                       value: `${item.title} ${item.id}`,
@@ -3357,7 +3950,7 @@ function AssociationEntitySelect({
                       },
                       className: "group/entity-ref group gap-2",
                       children: [
-                        /* @__PURE__ */ jsx13(
+                        /* @__PURE__ */ jsx15(
                           CheckIcon,
                           {
                             className: cn10(
@@ -3366,8 +3959,8 @@ function AssociationEntitySelect({
                             )
                           }
                         ),
-                        /* @__PURE__ */ jsx13("span", { className: "min-w-0 flex-1 truncate", children: item.title }),
-                        DoorControls ? /* @__PURE__ */ jsx13(
+                        /* @__PURE__ */ jsx15("span", { className: "min-w-0 flex-1 truncate", children: item.title }),
+                        /* @__PURE__ */ jsx15(
                           "span",
                           {
                             className: "inline-flex shrink-0 items-center",
@@ -3375,8 +3968,8 @@ function AssociationEntitySelect({
                               e.preventDefault();
                               e.stopPropagation();
                             },
-                            children: /* @__PURE__ */ jsx13(
-                              DoorControls,
+                            children: /* @__PURE__ */ jsx15(
+                              DoorControlsSlot,
                               {
                                 token,
                                 id: item.id,
@@ -3384,8 +3977,8 @@ function AssociationEntitySelect({
                               }
                             )
                           }
-                        ) : null,
-                        adapter.detach && item.id !== activeId ? /* @__PURE__ */ jsx13(
+                        ),
+                        adapter.detach && item.id !== activeId ? /* @__PURE__ */ jsx15(
                           "button",
                           {
                             type: "button",
@@ -3400,7 +3993,7 @@ function AssociationEntitySelect({
                             className: "grid size-5 shrink-0 place-items-center rounded text-muted-foreground opacity-0 transition-opacity hover:bg-accent hover:text-destructive group-hover:opacity-100",
                             title: `Remove this ${entityLabel} from here (does not delete it)`,
                             "aria-label": `Remove ${item.title}`,
-                            children: /* @__PURE__ */ jsx13(XIcon, { className: "size-3" })
+                            children: /* @__PURE__ */ jsx15(XIcon, { className: "size-3" })
                           }
                         ) : null
                       ]
@@ -3408,9 +4001,9 @@ function AssociationEntitySelect({
                     item.id
                   )) }) : null
                 ] }),
-                createSlot !== void 0 ? /* @__PURE__ */ jsx13("div", { className: "border-t border-border p-1", children: typeof createSlot === "function" ? createSlot(close) : createSlot }) : null,
-                createSlot === void 0 && adapter.createAndAttach ? /* @__PURE__ */ jsx13("div", { className: "border-t border-border p-1", children: creating ? /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-1 px-1 py-0.5", children: [
-                  /* @__PURE__ */ jsx13(
+                createSlot !== void 0 ? /* @__PURE__ */ jsx15("div", { className: "border-t border-border p-1", children: typeof createSlot === "function" ? createSlot(close) : createSlot }) : null,
+                createSlot === void 0 && adapter.createAndAttach ? /* @__PURE__ */ jsx15("div", { className: "border-t border-border p-1", children: creating ? /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-1 px-1 py-0.5", children: [
+                  /* @__PURE__ */ jsx15(
                     "input",
                     {
                       autoFocus: true,
@@ -3434,17 +4027,17 @@ function AssociationEntitySelect({
                       "aria-label": `New ${entityLabel} name`
                     }
                   ),
-                  /* @__PURE__ */ jsx13(
+                  /* @__PURE__ */ jsx15(
                     "button",
                     {
                       type: "button",
                       disabled: busy || !draftName.trim(),
                       onClick: () => void create(draftName),
                       className: "inline-flex h-6 shrink-0 items-center rounded-md px-1.5 text-[10px] font-medium text-primary transition-colors hover:bg-accent disabled:opacity-50",
-                      children: busy ? /* @__PURE__ */ jsx13(SpinnerIcon, { className: "size-3 animate-spin" }) : "Create"
+                      children: busy ? /* @__PURE__ */ jsx15(SpinnerIcon, { className: "size-3 animate-spin" }) : "Create"
                     }
                   )
-                ] }) : /* @__PURE__ */ jsxs11(
+                ] }) : /* @__PURE__ */ jsxs12(
                   "button",
                   {
                     type: "button",
@@ -3455,7 +4048,7 @@ function AssociationEntitySelect({
                     },
                     className: "flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-xs text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
                     children: [
-                      busy ? /* @__PURE__ */ jsx13(SpinnerIcon, { className: "size-3.5 animate-spin" }) : /* @__PURE__ */ jsx13(PlusIcon, { className: "size-3.5" }),
+                      busy ? /* @__PURE__ */ jsx15(SpinnerIcon, { className: "size-3.5 animate-spin" }) : /* @__PURE__ */ jsx15(PlusIcon, { className: "size-3.5" }),
                       query.trim() ? `Create "${query.trim()}"` : `New ${info.label}`
                     ]
                   }
@@ -3470,7 +4063,7 @@ function AssociationEntitySelect({
 }
 
 // src/react/components/CategorySelect.tsx
-import { useState as useState13 } from "react";
+import { useState as useState15 } from "react";
 import {
   CreatablePicker,
   Select,
@@ -3545,7 +4138,7 @@ function buildCategoryHierarchy(categories) {
 }
 
 // src/react/components/CategorySelect.tsx
-import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
 var NONE = "__none__";
 var ROOT_PARENT = "__root__";
 function plural(noun) {
@@ -3572,7 +4165,7 @@ function CategorySelect({
     reload
   } = useCategories({ dimension });
   const hierarchy = buildCategoryHierarchy(categories);
-  const [createParentId, setCreateParentId] = useState13(ROOT_PARENT);
+  const [createParentId, setCreateParentId] = useState15(ROOT_PARENT);
   const options = [
     ...allowNone ? [{ value: NONE, label: "None", keywords: "none clear empty" }] : [],
     ...hierarchy.hasHierarchy ? hierarchy.items.map(({ category, depth, parent }) => ({
@@ -3581,9 +4174,9 @@ function CategorySelect({
       // The type-ahead matches the parent's name too, so someone who knows
       // the branch but not the leaf still finds it.
       keywords: parent ? parent.name : "",
-      render: depth === 0 ? /* @__PURE__ */ jsx14("span", { className: "font-medium", children: category.name }) : /* @__PURE__ */ jsxs12("span", { className: "flex items-center gap-1.5 pl-3 text-muted-foreground", children: [
-        /* @__PURE__ */ jsx14(CornerDownRightIcon, { className: "h-3.5 w-3.5 shrink-0" }),
-        /* @__PURE__ */ jsx14("span", { className: "text-foreground", children: category.name })
+      render: depth === 0 ? /* @__PURE__ */ jsx16("span", { className: "font-medium", children: category.name }) : /* @__PURE__ */ jsxs13("span", { className: "flex items-center gap-1.5 pl-3 text-muted-foreground", children: [
+        /* @__PURE__ */ jsx16(CornerDownRightIcon, { className: "h-3.5 w-3.5 shrink-0" }),
+        /* @__PURE__ */ jsx16("span", { className: "text-foreground", children: category.name })
       ] })
     })) : categories.map((category) => ({
       value: category.id,
@@ -3630,8 +4223,8 @@ function CategorySelect({
     );
     return result.id;
   };
-  return /* @__PURE__ */ jsxs12("div", { children: [
-    /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsxs13("div", { children: [
+    /* @__PURE__ */ jsx16(
       CreatablePicker,
       {
         value: value ?? (allowNone ? NONE : null),
@@ -3647,18 +4240,18 @@ function CategorySelect({
         emptyLabel: `No ${noun} matches that.`,
         ...allowCreate ? { onCreate: create } : {},
         ...allowCreate && hierarchy.hasHierarchy ? {
-          createExtra: /* @__PURE__ */ jsxs12(Select, { value: createParentId, onValueChange: setCreateParentId, children: [
-            /* @__PURE__ */ jsx14(
+          createExtra: /* @__PURE__ */ jsxs13(Select, { value: createParentId, onValueChange: setCreateParentId, children: [
+            /* @__PURE__ */ jsx16(
               SelectTrigger,
               {
                 className: "h-7 text-xs",
                 "aria-label": `Put the new ${noun} under`,
-                children: /* @__PURE__ */ jsx14(SelectValue, {})
+                children: /* @__PURE__ */ jsx16(SelectValue, {})
               }
             ),
-            /* @__PURE__ */ jsxs12(SelectContent, { children: [
-              /* @__PURE__ */ jsx14(SelectItem, { value: ROOT_PARENT, className: "text-xs", children: "Top level" }),
-              hierarchy.items.filter((item) => item.depth === 0).map((item) => /* @__PURE__ */ jsxs12(
+            /* @__PURE__ */ jsxs13(SelectContent, { children: [
+              /* @__PURE__ */ jsx16(SelectItem, { value: ROOT_PARENT, className: "text-xs", children: "Top level" }),
+              hierarchy.items.filter((item) => item.depth === 0).map((item) => /* @__PURE__ */ jsxs13(
                 SelectItem,
                 {
                   value: item.category.id,
@@ -3678,18 +4271,18 @@ function CategorySelect({
     selected === null && value !== null ? (
       // A stored id whose row this reader cannot see is not "nothing chosen":
       // saying so beats a blank box that looks like an unsaved field.
-      /* @__PURE__ */ jsxs12("p", { className: "mt-1 text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ jsxs13("p", { className: "mt-1 text-xs text-muted-foreground", children: [
         "This ",
         noun,
         " is no longer available to you."
       ] })
     ) : null,
-    error ? /* @__PURE__ */ jsx14("p", { className: "mt-1 text-xs text-destructive", children: error }) : null
+    error ? /* @__PURE__ */ jsx16("p", { className: "mt-1 text-xs text-destructive", children: error }) : null
   ] });
 }
 
 // src/react/components/CategoryTagPicker.tsx
-import { useState as useState14 } from "react";
+import { useState as useState16 } from "react";
 import {
   Badge,
   Button as Button2,
@@ -3709,7 +4302,7 @@ import {
   SelectTrigger as SelectTrigger2,
   SelectValue as SelectValue2
 } from "@ai-matrx/design-system";
-import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
 var ROOT_PARENT2 = "__root__";
 function CategoryTagPicker({
   entityType,
@@ -3725,11 +4318,11 @@ function CategoryTagPicker({
 }) {
   const store = useAssociationsStore();
   const notifier = useNotifier();
-  const [open, setOpen] = useState14(false);
-  const [creating, setCreating] = useState14(false);
-  const [writing, setWriting] = useState14(false);
-  const [search, setSearch] = useState14("");
-  const [createParentId, setCreateParentId] = useState14(ROOT_PARENT2);
+  const [open, setOpen] = useState16(false);
+  const [creating, setCreating] = useState16(false);
+  const [writing, setWriting] = useState16(false);
+  const [search, setSearch] = useState16("");
+  const [createParentId, setCreateParentId] = useState16(ROOT_PARENT2);
   const {
     categories,
     create: createCategory,
@@ -3833,44 +4426,44 @@ function CategoryTagPicker({
   const exactMatch = categories.some(
     (c) => c.name.toLowerCase() === search.trim().toLowerCase()
   );
-  return /* @__PURE__ */ jsxs13("div", { className: "flex flex-wrap items-center gap-1.5", children: [
-    selected.map((c) => /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14("div", { className: "flex flex-wrap items-center gap-1.5", children: [
+    selected.map((c) => /* @__PURE__ */ jsxs14(
       Badge,
       {
         variant: "secondary",
         className: "gap-1 pr-1 text-xs font-medium",
         children: [
           showHierarchy ? hierarchyById.get(c.id)?.displayName ?? c.name : c.name,
-          /* @__PURE__ */ jsx15(
+          /* @__PURE__ */ jsx17(
             "button",
             {
               type: "button",
               onClick: () => void toggle(c.id),
               className: "ml-0.5 rounded-full p-0.5 hover:bg-muted-foreground/20",
               "aria-label": `Remove ${c.name}`,
-              children: /* @__PURE__ */ jsx15(XIcon, { className: "h-2.5 w-2.5" })
+              children: /* @__PURE__ */ jsx17(XIcon, { className: "h-2.5 w-2.5" })
             }
           )
         ]
       },
       c.id
     )),
-    /* @__PURE__ */ jsxs13(Popover2, { open, onOpenChange: setOpen, children: [
-      /* @__PURE__ */ jsx15(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs13(
+    /* @__PURE__ */ jsxs14(Popover2, { open, onOpenChange: setOpen, children: [
+      /* @__PURE__ */ jsx17(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs14(
         Button2,
         {
           variant: "outline",
           size: "sm",
           className: "h-7 gap-1 px-2 text-xs",
           children: [
-            /* @__PURE__ */ jsx15(Icon, { className: "h-3.5 w-3.5" }),
+            /* @__PURE__ */ jsx17(Icon, { className: "h-3.5 w-3.5" }),
             selected.length === 0 ? addLabel : "Edit",
-            /* @__PURE__ */ jsx15(ChevronsUpDownIcon, { className: "h-3 w-3 opacity-50" })
+            /* @__PURE__ */ jsx17(ChevronsUpDownIcon, { className: "h-3 w-3 opacity-50" })
           ]
         }
       ) }),
-      /* @__PURE__ */ jsx15(PopoverContent2, { className: "w-56 p-0", align: "start", children: /* @__PURE__ */ jsxs13(Command2, { shouldFilter: false, children: [
-        /* @__PURE__ */ jsx15(
+      /* @__PURE__ */ jsx17(PopoverContent2, { className: "w-56 p-0", align: "start", children: /* @__PURE__ */ jsxs14(Command2, { shouldFilter: false, children: [
+        /* @__PURE__ */ jsx17(
           CommandInput2,
           {
             placeholder: allowCreate ? "Search or create..." : "Search...",
@@ -3878,9 +4471,9 @@ function CategoryTagPicker({
             onValueChange: setSearch
           }
         ),
-        /* @__PURE__ */ jsxs13(CommandList2, { children: [
-          /* @__PURE__ */ jsx15(CommandEmpty2, { className: "px-2 py-3 text-xs text-muted-foreground", children: search.trim() ? "No match." : emptyText }),
-          /* @__PURE__ */ jsx15(CommandGroup2, { children: showHierarchy ? filteredHierarchy.map(({ category, depth, parent }) => /* @__PURE__ */ jsxs13(
+        /* @__PURE__ */ jsxs14(CommandList2, { children: [
+          /* @__PURE__ */ jsx17(CommandEmpty2, { className: "px-2 py-3 text-xs text-muted-foreground", children: search.trim() ? "No match." : emptyText }),
+          /* @__PURE__ */ jsx17(CommandGroup2, { children: showHierarchy ? filteredHierarchy.map(({ category, depth, parent }) => /* @__PURE__ */ jsxs14(
             CommandItem2,
             {
               value: category.id,
@@ -3888,7 +4481,7 @@ function CategoryTagPicker({
               onSelect: () => void toggle(category.id),
               className: cn11("text-xs", depth === 1 && "pl-6"),
               children: [
-                /* @__PURE__ */ jsx15(
+                /* @__PURE__ */ jsx17(
                   CheckIcon,
                   {
                     className: cn11(
@@ -3897,19 +4490,19 @@ function CategoryTagPicker({
                     )
                   }
                 ),
-                depth === 1 ? /* @__PURE__ */ jsx15(CornerDownRightIcon, { className: "mr-1.5 h-3.5 w-3.5 shrink-0 text-muted-foreground" }) : null,
-                /* @__PURE__ */ jsx15("span", { className: cn11(depth === 0 && "font-medium"), children: category.name })
+                depth === 1 ? /* @__PURE__ */ jsx17(CornerDownRightIcon, { className: "mr-1.5 h-3.5 w-3.5 shrink-0 text-muted-foreground" }) : null,
+                /* @__PURE__ */ jsx17("span", { className: cn11(depth === 0 && "font-medium"), children: category.name })
               ]
             },
             category.id
-          )) : filtered.map((c) => /* @__PURE__ */ jsxs13(
+          )) : filtered.map((c) => /* @__PURE__ */ jsxs14(
             CommandItem2,
             {
               value: c.id,
               onSelect: () => void toggle(c.id),
               className: "text-xs",
               children: [
-                /* @__PURE__ */ jsx15(
+                /* @__PURE__ */ jsx17(
                   CheckIcon,
                   {
                     className: cn11(
@@ -3923,25 +4516,25 @@ function CategoryTagPicker({
             },
             c.id
           )) }),
-          allowCreate && search.trim() && !exactMatch ? /* @__PURE__ */ jsxs13(CommandGroup2, { children: [
-            showHierarchy ? /* @__PURE__ */ jsxs13("div", { className: "space-y-1.5 px-2 pb-2", children: [
-              /* @__PURE__ */ jsx15("p", { className: "text-[11px] font-medium text-muted-foreground", children: "Place in" }),
-              /* @__PURE__ */ jsxs13(
+          allowCreate && search.trim() && !exactMatch ? /* @__PURE__ */ jsxs14(CommandGroup2, { children: [
+            showHierarchy ? /* @__PURE__ */ jsxs14("div", { className: "space-y-1.5 px-2 pb-2", children: [
+              /* @__PURE__ */ jsx17("p", { className: "text-[11px] font-medium text-muted-foreground", children: "Place in" }),
+              /* @__PURE__ */ jsxs14(
                 Select2,
                 {
                   value: createParentId,
                   onValueChange: setCreateParentId,
                   children: [
-                    /* @__PURE__ */ jsx15(SelectTrigger2, { size: "sm", className: "bg-background", children: /* @__PURE__ */ jsx15(SelectValue2, {}) }),
-                    /* @__PURE__ */ jsxs13(SelectContent2, { children: [
-                      /* @__PURE__ */ jsx15(SelectItem2, { value: ROOT_PARENT2, children: "Top level" }),
-                      hierarchy.roots.map((root) => /* @__PURE__ */ jsx15(SelectItem2, { value: root.id, children: root.name }, root.id))
+                    /* @__PURE__ */ jsx17(SelectTrigger2, { size: "sm", className: "bg-background", children: /* @__PURE__ */ jsx17(SelectValue2, {}) }),
+                    /* @__PURE__ */ jsxs14(SelectContent2, { children: [
+                      /* @__PURE__ */ jsx17(SelectItem2, { value: ROOT_PARENT2, children: "Top level" }),
+                      hierarchy.roots.map((root) => /* @__PURE__ */ jsx17(SelectItem2, { value: root.id, children: root.name }, root.id))
                     ] })
                   ]
                 }
               )
             ] }) : null,
-            /* @__PURE__ */ jsxs13(
+            /* @__PURE__ */ jsxs14(
               CommandItem2,
               {
                 value: `__create__${search}`,
@@ -3949,7 +4542,7 @@ function CategoryTagPicker({
                 disabled: creating,
                 className: "text-xs text-primary",
                 children: [
-                  creating ? /* @__PURE__ */ jsx15(SpinnerIcon, { className: "mr-2 h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ jsx15(Icon, { className: "mr-2 h-3.5 w-3.5" }),
+                  creating ? /* @__PURE__ */ jsx17(SpinnerIcon, { className: "mr-2 h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ jsx17(Icon, { className: "mr-2 h-3.5 w-3.5" }),
                   "Create \u201C",
                   search.trim(),
                   "\u201D"
@@ -3964,7 +4557,7 @@ function CategoryTagPicker({
 }
 
 // src/react/components/CommentThread.tsx
-import { useState as useState15 } from "react";
+import { useState as useState17 } from "react";
 import { Button as Button3, Skeleton as Skeleton2, cn as cn12 } from "@ai-matrx/design-system";
 
 // src/react/relativeTime.ts
@@ -3992,7 +4585,7 @@ function formatRelativeTime(iso, now = Date.now()) {
 }
 
 // src/react/components/CommentThread.tsx
-import { Fragment as Fragment5, jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
 var AUTHOR_DOOR_TOKEN = "user";
 function resolveAuthor(comment, authorDisplay) {
   const base2 = {
@@ -4011,7 +4604,7 @@ function resolveAuthor(comment, authorDisplay) {
 }
 function AuthorAvatar({ author }) {
   if (author.avatarUrl) {
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx18(
       "img",
       {
         src: author.avatarUrl,
@@ -4020,7 +4613,7 @@ function AuthorAvatar({ author }) {
       }
     );
   }
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx18(
     "span",
     {
       "aria-hidden": true,
@@ -4035,7 +4628,7 @@ function AuthorName({
 }) {
   const DoorRef2 = entityDoors?.EntityRef;
   if (DoorRef2 && author.userId) {
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx18(
       DoorRef2,
       {
         token: AUTHOR_DOOR_TOKEN,
@@ -4046,7 +4639,7 @@ function AuthorName({
       }
     );
   }
-  return /* @__PURE__ */ jsx16("span", { className: "text-sm font-medium text-foreground", children: author.name });
+  return /* @__PURE__ */ jsx18("span", { className: "text-sm font-medium text-foreground", children: author.name });
 }
 function CommentComposer({
   onSubmit,
@@ -4057,9 +4650,9 @@ function CommentComposer({
   autoFocus = false
 }) {
   const notifier = useNotifier();
-  const [body, setBody] = useState15(initialValue);
-  const [submitting, setSubmitting] = useState15(false);
-  const [error, setError] = useState15(null);
+  const [body, setBody] = useState17(initialValue);
+  const [submitting, setSubmitting] = useState17(false);
+  const [error, setError] = useState17(null);
   async function submit(e) {
     e?.preventDefault();
     const trimmed = body.trim();
@@ -4076,8 +4669,8 @@ function CommentComposer({
     }
     setBody("");
   }
-  return /* @__PURE__ */ jsxs14("form", { onSubmit: submit, className: "flex flex-col gap-1.5", children: [
-    /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs15("form", { onSubmit: submit, className: "flex flex-col gap-1.5", children: [
+    /* @__PURE__ */ jsx18(
       "textarea",
       {
         value: body,
@@ -4092,10 +4685,10 @@ function CommentComposer({
         className: "w-full resize-y rounded-md border border-border bg-background px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
       }
     ),
-    error && /* @__PURE__ */ jsx16("p", { role: "alert", className: "text-xs text-destructive", children: error }),
-    /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsxs14(Button3, { type: "submit", size: "sm", disabled: !body.trim() || submitting, children: [
-        submitting && /* @__PURE__ */ jsx16(SpinnerIcon, { className: "mr-1 h-3 w-3 animate-spin" }),
+    error && /* @__PURE__ */ jsx18("p", { role: "alert", className: "text-xs text-destructive", children: error }),
+    /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs15(Button3, { type: "submit", size: "sm", disabled: !body.trim() || submitting, children: [
+        submitting && /* @__PURE__ */ jsx18(SpinnerIcon, { className: "mr-1 h-3 w-3 animate-spin" }),
         submitLabel
       ] }),
       trailing
@@ -4111,10 +4704,10 @@ function CommentItem({
 }) {
   const { authorDisplay, entityDoors } = useAssociationsUiPorts();
   const notifier = useNotifier();
-  const [replying, setReplying] = useState15(false);
-  const [editing, setEditing] = useState15(false);
-  const [confirmingDelete, setConfirmingDelete] = useState15(false);
-  const [deleting, setDeleting] = useState15(false);
+  const [replying, setReplying] = useState17(false);
+  const [editing, setEditing] = useState17(false);
+  const [confirmingDelete, setConfirmingDelete] = useState17(false);
+  const [deleting, setDeleting] = useState17(false);
   const author = resolveAuthor(comment, authorDisplay);
   const isOwn = thread.currentUserId !== null && comment.createdBy === thread.currentUserId;
   const edited = comment.updatedAt !== comment.createdAt;
@@ -4128,7 +4721,7 @@ function CommentItem({
       notifier.error(res.error ?? "Could not delete the comment");
     }
   }
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     "div",
     {
       "data-comment-id": comment.id,
@@ -4137,10 +4730,10 @@ function CommentItem({
         depth > 0 && "border-l border-border pl-3"
       ),
       children: [
-        /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx16(AuthorAvatar, { author }),
-          /* @__PURE__ */ jsx16(AuthorName, { author, entityDoors }),
-          /* @__PURE__ */ jsx16(
+        /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx18(AuthorAvatar, { author }),
+          /* @__PURE__ */ jsx18(AuthorName, { author, entityDoors }),
+          /* @__PURE__ */ jsx18(
             "span",
             {
               className: "text-xs text-muted-foreground",
@@ -4148,7 +4741,7 @@ function CommentItem({
               children: formatRelativeTime(comment.createdAt)
             }
           ),
-          edited && /* @__PURE__ */ jsx16(
+          edited && /* @__PURE__ */ jsx18(
             "span",
             {
               className: "text-xs text-muted-foreground",
@@ -4157,7 +4750,7 @@ function CommentItem({
             }
           )
         ] }),
-        editing ? /* @__PURE__ */ jsx16("div", { className: "pl-8", children: /* @__PURE__ */ jsx16(
+        editing ? /* @__PURE__ */ jsx18("div", { className: "pl-8", children: /* @__PURE__ */ jsx18(
           CommentComposer,
           {
             initialValue: comment.body,
@@ -4169,7 +4762,7 @@ function CommentItem({
               if (res.ok) setEditing(false);
               return res;
             },
-            trailing: /* @__PURE__ */ jsx16(
+            trailing: /* @__PURE__ */ jsx18(
               Button3,
               {
                 type: "button",
@@ -4180,10 +4773,10 @@ function CommentItem({
               }
             )
           }
-        ) }) : /* @__PURE__ */ jsx16("p", { className: "whitespace-pre-wrap pl-8 text-sm text-foreground", children: comment.body }),
-        !editing && /* @__PURE__ */ jsx16("div", { className: "flex items-center gap-1 pl-7", children: confirmingDelete ? /* @__PURE__ */ jsxs14(Fragment5, { children: [
-          /* @__PURE__ */ jsx16("span", { className: "text-xs text-destructive", children: "Deletes this comment for everyone." }),
-          /* @__PURE__ */ jsxs14(
+        ) }) : /* @__PURE__ */ jsx18("p", { className: "whitespace-pre-wrap pl-8 text-sm text-foreground", children: comment.body }),
+        !editing && /* @__PURE__ */ jsx18("div", { className: "flex items-center gap-1 pl-7", children: confirmingDelete ? /* @__PURE__ */ jsxs15(Fragment5, { children: [
+          /* @__PURE__ */ jsx18("span", { className: "text-xs text-destructive", children: "Deletes this comment for everyone." }),
+          /* @__PURE__ */ jsxs15(
             Button3,
             {
               type: "button",
@@ -4192,12 +4785,12 @@ function CommentItem({
               disabled: deleting,
               onClick: () => void confirmDelete(),
               children: [
-                deleting && /* @__PURE__ */ jsx16(SpinnerIcon, { className: "mr-1 h-3 w-3 animate-spin" }),
+                deleting && /* @__PURE__ */ jsx18(SpinnerIcon, { className: "mr-1 h-3 w-3 animate-spin" }),
                 "Delete"
               ]
             }
           ),
-          /* @__PURE__ */ jsx16(
+          /* @__PURE__ */ jsx18(
             Button3,
             {
               type: "button",
@@ -4208,8 +4801,8 @@ function CommentItem({
               children: "Cancel"
             }
           )
-        ] }) : /* @__PURE__ */ jsxs14(Fragment5, { children: [
-          /* @__PURE__ */ jsx16(
+        ] }) : /* @__PURE__ */ jsxs15(Fragment5, { children: [
+          /* @__PURE__ */ jsx18(
             "button",
             {
               type: "button",
@@ -4218,8 +4811,8 @@ function CommentItem({
               children: "Reply"
             }
           ),
-          isOwn && /* @__PURE__ */ jsxs14(Fragment5, { children: [
-            /* @__PURE__ */ jsx16(
+          isOwn && /* @__PURE__ */ jsxs15(Fragment5, { children: [
+            /* @__PURE__ */ jsx18(
               "button",
               {
                 type: "button",
@@ -4228,7 +4821,7 @@ function CommentItem({
                 children: "Edit"
               }
             ),
-            /* @__PURE__ */ jsx16(
+            /* @__PURE__ */ jsx18(
               "button",
               {
                 type: "button",
@@ -4239,9 +4832,9 @@ function CommentItem({
             )
           ] })
         ] }) }),
-        replying && /* @__PURE__ */ jsxs14("div", { className: "flex items-start gap-2 pl-8 pt-1", children: [
-          /* @__PURE__ */ jsx16(CornerDownRightIcon, { className: "mt-2 h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
-          /* @__PURE__ */ jsx16("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx16(
+        replying && /* @__PURE__ */ jsxs15("div", { className: "flex items-start gap-2 pl-8 pt-1", children: [
+          /* @__PURE__ */ jsx18(CornerDownRightIcon, { className: "mt-2 h-3.5 w-3.5 shrink-0 text-muted-foreground" }),
+          /* @__PURE__ */ jsx18("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx18(
             CommentComposer,
             {
               submitLabel: "Reply",
@@ -4255,7 +4848,7 @@ function CommentItem({
                 if (res.ok) setReplying(false);
                 return res;
               },
-              trailing: /* @__PURE__ */ jsx16(
+              trailing: /* @__PURE__ */ jsx18(
                 Button3,
                 {
                   type: "button",
@@ -4268,7 +4861,7 @@ function CommentItem({
             }
           ) })
         ] }),
-        replies.length > 0 && /* @__PURE__ */ jsx16("div", { className: "flex flex-col gap-3 pl-8 pt-1", children: replies.map((reply) => /* @__PURE__ */ jsx16(
+        replies.length > 0 && /* @__PURE__ */ jsx18("div", { className: "flex flex-col gap-3 pl-8 pt-1", children: replies.map((reply) => /* @__PURE__ */ jsx18(
           CommentItem,
           {
             comment: reply,
@@ -4308,11 +4901,11 @@ function CommentThread({
   const thread = useComments({ token, id });
   const { roots, childrenOf } = buildCommentTree(thread.comments);
   const loading = (thread.status === "loading" || thread.status === "idle") && thread.comments.length === 0;
-  return /* @__PURE__ */ jsxs14("section", { className: cn12("flex flex-col gap-3", className), children: [
-    showHeader && /* @__PURE__ */ jsxs14("header", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx16("h3", { className: "text-sm font-semibold text-foreground", children: "Comments" }),
-      /* @__PURE__ */ jsx16("span", { className: "text-xs text-muted-foreground tabular-nums", children: thread.comments.length }),
-      /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs15("section", { className: cn12("flex flex-col gap-3", className), children: [
+    showHeader && /* @__PURE__ */ jsxs15("header", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx18("h3", { className: "text-sm font-semibold text-foreground", children: "Comments" }),
+      /* @__PURE__ */ jsx18("span", { className: "text-xs text-muted-foreground tabular-nums", children: thread.comments.length }),
+      /* @__PURE__ */ jsx18(
         "button",
         {
           type: "button",
@@ -4320,18 +4913,18 @@ function CommentThread({
           "aria-label": "Refresh comments",
           title: "Refresh comments",
           className: "ml-auto flex h-6 w-6 items-center justify-center rounded text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
-          children: thread.status === "loading" ? /* @__PURE__ */ jsx16(SpinnerIcon, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ jsx16(RefreshIcon, { className: "h-3.5 w-3.5" })
+          children: thread.status === "loading" ? /* @__PURE__ */ jsx18(SpinnerIcon, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ jsx18(RefreshIcon, { className: "h-3.5 w-3.5" })
         }
       )
     ] }),
-    thread.error && /* @__PURE__ */ jsxs14(
+    thread.error && /* @__PURE__ */ jsxs15(
       "div",
       {
         role: "alert",
         className: "flex items-center gap-2 rounded-md border border-destructive/40 bg-destructive/10 px-3 py-2 text-xs text-destructive",
         children: [
-          /* @__PURE__ */ jsx16("span", { className: "min-w-0 flex-1", children: thread.error }),
-          /* @__PURE__ */ jsx16(
+          /* @__PURE__ */ jsx18("span", { className: "min-w-0 flex-1", children: thread.error }),
+          /* @__PURE__ */ jsx18(
             Button3,
             {
               type: "button",
@@ -4345,10 +4938,10 @@ function CommentThread({
         ]
       }
     ),
-    loading ? /* @__PURE__ */ jsxs14("div", { className: "flex flex-col gap-3", "aria-hidden": true, "data-testid": "comments-loading", children: [
-      /* @__PURE__ */ jsx16(Skeleton2, { className: "h-12 w-full" }),
-      /* @__PURE__ */ jsx16(Skeleton2, { className: "h-12 w-4/5" })
-    ] }) : roots.length === 0 && !thread.error ? /* @__PURE__ */ jsx16("p", { className: "text-sm text-muted-foreground", children: "No comments yet." }) : /* @__PURE__ */ jsx16("div", { className: "flex flex-col gap-4", children: roots.map((comment) => /* @__PURE__ */ jsx16(
+    loading ? /* @__PURE__ */ jsxs15("div", { className: "flex flex-col gap-3", "aria-hidden": true, "data-testid": "comments-loading", children: [
+      /* @__PURE__ */ jsx18(Skeleton2, { className: "h-12 w-full" }),
+      /* @__PURE__ */ jsx18(Skeleton2, { className: "h-12 w-4/5" })
+    ] }) : roots.length === 0 && !thread.error ? /* @__PURE__ */ jsx18("p", { className: "text-sm text-muted-foreground", children: "No comments yet." }) : /* @__PURE__ */ jsx18("div", { className: "flex flex-col gap-4", children: roots.map((comment) => /* @__PURE__ */ jsx18(
       CommentItem,
       {
         comment,
@@ -4359,7 +4952,7 @@ function CommentThread({
       },
       comment.id
     )) }),
-    /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsx18(
       CommentComposer,
       {
         onSubmit: (body) => thread.add(body, { orgId: orgId ?? null })
@@ -4385,6 +4978,8 @@ export {
   CommentComposer,
   CommentThread,
   DefaultEntityIcon,
+  DefaultWindowShell,
+  DoorControlsSlot,
   DoorRef,
   PrimaryEntityProvider,
   UniversalAssociationPicker,
@@ -4393,8 +4988,11 @@ export {
   buildCommentTree,
   formatRelativeTime,
   getContentRoleMeta,
+  lazyPickerOverride,
+  lazyWindowShell,
   useAssociationCandidates,
   useAssociationEntitySelectAdapter,
+  useAssociationPickerBridge,
   useAssociations,
   useAssociationsStore,
   useAssociationsUiPorts,