@ai-matrx/canvas 0.0.0-bootstrap.0 → 0.1.0

package/dist/index.cjs

@@ -0,0 +1,758 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  CANVAS_DEFAULT_WIDTH: () => CANVAS_DEFAULT_WIDTH,
+  CANVAS_MIN_SPLIT_FRACTION: () => CANVAS_MIN_SPLIT_FRACTION,
+  CANVAS_MIN_WIDTH: () => CANVAS_MIN_WIDTH,
+  CANVAS_STORAGE_KEY: () => CANVAS_STORAGE_KEY,
+  bindCanvasToReduxStore: () => bindCanvasToReduxStore,
+  canvasActions: () => canvasActions,
+  canvasItemId: () => canvasItemId,
+  canvasReducer: () => canvasReducer,
+  consoleCanvasErrorSink: () => consoleCanvasErrorSink,
+  createCanvasController: () => createCanvasController,
+  createCanvasStore: () => createCanvasStore,
+  createInitialCanvasState: () => createInitialCanvasState,
+  createLocalStorageCanvasPersistence: () => createLocalStorageCanvasPersistence,
+  findNonJson: () => findNonJson,
+  isCanvasAction: () => isCanvasAction,
+  isCanvasJson: () => isCanvasJson,
+  listPaneIds: () => listPaneIds,
+  normalizeSizes: () => normalizeSizes,
+  parseCanvasItemId: () => parseCanvasItemId,
+  sanitizeCanvasSnapshot: () => sanitizeCanvasSnapshot,
+  selectCanvasActiveItem: () => selectCanvasActiveItem,
+  selectCanvasFocusedPaneId: () => selectCanvasFocusedPaneId,
+  selectCanvasIsFullscreen: () => selectCanvasIsFullscreen,
+  selectCanvasIsHydrated: () => selectCanvasIsHydrated,
+  selectCanvasIsOpen: () => selectCanvasIsOpen,
+  selectCanvasItem: () => selectCanvasItem,
+  selectCanvasItemCount: () => selectCanvasItemCount,
+  selectCanvasLayout: () => selectCanvasLayout,
+  selectCanvasPane: () => selectCanvasPane,
+  selectCanvasPaneCount: () => selectCanvasPaneCount,
+  selectCanvasWidth: () => selectCanvasWidth,
+  toPersistableSnapshot: () => toPersistableSnapshot
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/core/types.ts
+var CANVAS_MIN_WIDTH = 360;
+var CANVAS_DEFAULT_WIDTH = 640;
+var CANVAS_MIN_SPLIT_FRACTION = 0.12;
+
+// src/core/ids.ts
+var SEP = "::";
+function canvasItemId(kind, key) {
+  return `${kind}${SEP}${key}`;
+}
+function parseCanvasItemId(id) {
+  const at = id.indexOf(SEP);
+  return at < 0 ? { kind: id, key: "" } : { kind: id.slice(0, at), key: id.slice(at + SEP.length) };
+}
+function paneIdFromSeq(seq) {
+  return `pane-${seq}`;
+}
+function splitIdFromSeq(seq) {
+  return `split-${seq}`;
+}
+function findNonJson(value, path = "data") {
+  if (value === null) return null;
+  switch (typeof value) {
+    case "string":
+    case "boolean":
+      return null;
+    case "number":
+      return Number.isFinite(value) ? null : path;
+    case "object": {
+      if (Array.isArray(value)) {
+        for (let i = 0; i < value.length; i++) {
+          const bad = findNonJson(value[i], `${path}[${i}]`);
+          if (bad) return bad;
+        }
+        return null;
+      }
+      const proto = Object.getPrototypeOf(value);
+      if (proto !== Object.prototype && proto !== null) return path;
+      for (const [k, v] of Object.entries(value)) {
+        if (v === void 0) continue;
+        const bad = findNonJson(v, `${path}.${k}`);
+        if (bad) return bad;
+      }
+      return null;
+    }
+    default:
+      return path;
+  }
+}
+function isCanvasJson(value) {
+  return findNonJson(value) === null;
+}
+
+// src/core/layout.ts
+function listPaneIds(node) {
+  if (node.type === "pane") return [node.paneId];
+  return node.children.flatMap(listPaneIds);
+}
+function evenSizes(count) {
+  return Array.from({ length: count }, () => 1 / count);
+}
+function normalizeSizes(sizes, count) {
+  if (sizes.length !== count || sizes.some((s) => !Number.isFinite(s) || s <= 0)) {
+    return evenSizes(count);
+  }
+  const total = sizes.reduce((sum, s) => sum + s, 0);
+  return sizes.map((s) => s / total);
+}
+function splitPane(node, paneId, newPaneId, orientation, newSplitId) {
+  if (node.type === "pane") {
+    if (node.paneId !== paneId) return node;
+    return {
+      type: "split",
+      id: newSplitId,
+      orientation,
+      children: [node, { type: "pane", paneId: newPaneId }],
+      sizes: [0.5, 0.5]
+    };
+  }
+  const index = node.children.findIndex(
+    (child) => child.type === "pane" && child.paneId === paneId
+  );
+  if (index >= 0 && node.orientation === orientation) {
+    const share = node.sizes[index] ?? 1 / node.children.length;
+    const children = [...node.children];
+    children.splice(index + 1, 0, { type: "pane", paneId: newPaneId });
+    const sizes = [...node.sizes];
+    sizes.splice(index, 1, share / 2, share / 2);
+    return { ...node, children, sizes: normalizeSizes(sizes, children.length) };
+  }
+  return {
+    ...node,
+    children: node.children.map(
+      (child) => splitPane(child, paneId, newPaneId, orientation, newSplitId)
+    )
+  };
+}
+function removePane(node, paneId) {
+  if (node.type === "pane") return node.paneId === paneId ? null : node;
+  const children = [];
+  const sizes = [];
+  node.children.forEach((child, i) => {
+    const next = removePane(child, paneId);
+    if (next) {
+      children.push(next);
+      sizes.push(node.sizes[i] ?? 1 / node.children.length);
+    }
+  });
+  if (children.length === 0) return null;
+  if (children.length === 1) return children[0] ?? null;
+  return { ...node, children, sizes: normalizeSizes(sizes, children.length) };
+}
+function resizeSplit(node, splitId, sizes) {
+  if (node.type === "pane") return node;
+  if (node.id === splitId) {
+    const clamped = sizes.map((s) => Math.max(CANVAS_MIN_SPLIT_FRACTION, s));
+    return { ...node, sizes: normalizeSizes(clamped, node.children.length) };
+  }
+  return {
+    ...node,
+    children: node.children.map((child) => resizeSplit(child, splitId, sizes))
+  };
+}
+function isValidLayout(node, knownPanes, seen = /* @__PURE__ */ new Set()) {
+  if (!node || typeof node !== "object") return false;
+  const n = node;
+  if (n.type === "pane") {
+    const id = n.paneId;
+    if (typeof id !== "string" || !knownPanes.has(id) || seen.has(id)) return false;
+    seen.add(id);
+    return true;
+  }
+  if (n.type !== "split") return false;
+  if (typeof n.id !== "string") return false;
+  if (n.orientation !== "horizontal" && n.orientation !== "vertical") return false;
+  if (!Array.isArray(n.children) || n.children.length < 2) return false;
+  if (!Array.isArray(n.sizes) || n.sizes.length !== n.children.length) return false;
+  return n.children.every((child) => isValidLayout(child, knownPanes, seen));
+}
+
+// src/core/reducer.ts
+var P = "matrxCanvas/";
+var canvasActions = {
+  open: (input) => ({ type: `${P}open`, payload: { ...input, now: Date.now() } }),
+  update: (itemId, patch) => ({
+    type: `${P}update`,
+    payload: { itemId, ...patch, now: Date.now() }
+  }),
+  /** Gives an item a new identity in place (e.g. a draft that was just saved and now has an id). */
+  rekey: (itemId, key) => ({ type: `${P}rekey`, payload: { itemId, key } }),
+  closeItem: (itemId) => ({ type: `${P}closeItem`, payload: { itemId } }),
+  closeOthers: (itemId) => ({ type: `${P}closeOthers`, payload: { itemId } }),
+  activate: (itemId) => ({ type: `${P}activate`, payload: { itemId } }),
+  focusPane: (paneId) => ({ type: `${P}focusPane`, payload: { paneId } }),
+  moveItem: (itemId, toPaneId, index) => ({
+    type: `${P}moveItem`,
+    payload: { itemId, toPaneId, index }
+  }),
+  splitPane: (paneId, orientation, moveItemId) => ({
+    type: `${P}splitPane`,
+    payload: { paneId, orientation, moveItemId }
+  }),
+  closePane: (paneId) => ({ type: `${P}closePane`, payload: { paneId } }),
+  resizeSplit: (splitId, sizes) => ({
+    type: `${P}resizeSplit`,
+    payload: { splitId, sizes }
+  }),
+  setOpen: (open) => ({ type: `${P}setOpen`, payload: { open } }),
+  toggle: () => ({ type: `${P}toggle` }),
+  setFullscreen: (fullscreen) => ({ type: `${P}setFullscreen`, payload: { fullscreen } }),
+  setWidth: (width) => ({ type: `${P}setWidth`, payload: { width } }),
+  hydrate: (snapshot) => ({ type: `${P}hydrate`, payload: { snapshot } }),
+  reset: () => ({ type: `${P}reset` })
+};
+function isCanvasAction(action) {
+  return !!action && typeof action === "object" && typeof action.type === "string" && action.type.startsWith(P);
+}
+function createInitialCanvasState() {
+  const paneId = paneIdFromSeq(1);
+  return {
+    version: 1,
+    isOpen: false,
+    isFullscreen: false,
+    width: CANVAS_DEFAULT_WIDTH,
+    layout: { type: "pane", paneId },
+    panes: { [paneId]: { id: paneId, itemIds: [], activeItemId: null } },
+    items: {},
+    focusedPaneId: paneId,
+    seq: 1,
+    hydrated: false
+  };
+}
+function paneOf(state, itemId) {
+  for (const pane of Object.values(state.panes)) {
+    if (pane.itemIds.includes(itemId)) return pane;
+  }
+  return null;
+}
+function withPane(state, pane) {
+  return { ...state, panes: { ...state.panes, [pane.id]: pane } };
+}
+function nextActive(itemIds, removed, current) {
+  if (current !== removed) return current;
+  const index = itemIds.indexOf(removed);
+  const rest = itemIds.filter((id) => id !== removed);
+  return rest[Math.min(index, rest.length - 1)] ?? null;
+}
+function detachItem(state, itemId) {
+  const pane = paneOf(state, itemId);
+  if (!pane) return state;
+  return withPane(state, {
+    ...pane,
+    itemIds: pane.itemIds.filter((id) => id !== itemId),
+    activeItemId: nextActive(pane.itemIds, itemId, pane.activeItemId)
+  });
+}
+function dropPane(state, paneId) {
+  const layout = removePane(state.layout, paneId);
+  if (!layout) return state;
+  const panes = { ...state.panes };
+  delete panes[paneId];
+  const focusedPaneId = state.focusedPaneId === paneId ? listPaneIds(layout)[0] ?? state.focusedPaneId : state.focusedPaneId;
+  return { ...state, layout, panes, focusedPaneId };
+}
+function addSplit(state, paneId, orientation) {
+  const seq = state.seq + 1;
+  const newPaneId = paneIdFromSeq(seq);
+  const layout = splitPane(state.layout, paneId, newPaneId, orientation, splitIdFromSeq(seq));
+  return {
+    newPaneId,
+    state: {
+      ...state,
+      seq,
+      layout,
+      panes: { ...state.panes, [newPaneId]: { id: newPaneId, itemIds: [], activeItemId: null } },
+      focusedPaneId: newPaneId
+    }
+  };
+}
+function insertInto(state, paneId, itemId, activate, index) {
+  const pane = state.panes[paneId];
+  if (!pane) return state;
+  const itemIds = [...pane.itemIds.filter((id) => id !== itemId)];
+  const at = index === void 0 ? afterActive(itemIds, pane.activeItemId) : Math.max(0, Math.min(index, itemIds.length));
+  itemIds.splice(at, 0, itemId);
+  return withPane(state, {
+    ...pane,
+    itemIds,
+    activeItemId: activate || pane.activeItemId === null ? itemId : pane.activeItemId
+  });
+}
+function afterActive(itemIds, active) {
+  const index = active ? itemIds.indexOf(active) : -1;
+  return index < 0 ? itemIds.length : index + 1;
+}
+function clampWidth(width) {
+  return Number.isFinite(width) ? Math.max(CANVAS_MIN_WIDTH, Math.round(width)) : CANVAS_DEFAULT_WIDTH;
+}
+function sanitizeCanvasSnapshot(raw) {
+  if (!raw || typeof raw !== "object") return null;
+  const s = raw;
+  if (s.version !== 1 || !s.panes || !s.items || !s.layout) return null;
+  const paneIds = new Set(Object.keys(s.panes));
+  if (!isValidLayout(s.layout, paneIds)) return null;
+  const layoutPanes = new Set(listPaneIds(s.layout));
+  if (layoutPanes.size !== paneIds.size) return null;
+  const items = {};
+  for (const [id, item] of Object.entries(s.items)) {
+    if (item && typeof item.kind === "string" && typeof item.key === "string" && canvasItemId(item.kind, item.key) === id) {
+      items[id] = item;
+    }
+  }
+  const panes = {};
+  for (const [id, pane] of Object.entries(s.panes)) {
+    const itemIds = (Array.isArray(pane.itemIds) ? pane.itemIds : []).filter((itemId) => itemId in items);
+    const activeItemId = pane.activeItemId && itemIds.includes(pane.activeItemId) ? pane.activeItemId : itemIds[0] ?? null;
+    panes[id] = { id, itemIds, activeItemId };
+  }
+  const focused = s.focusedPaneId && paneIds.has(s.focusedPaneId) ? s.focusedPaneId : listPaneIds(s.layout)[0];
+  if (!focused) return null;
+  const layout = normalizeLayout(s.layout);
+  const seq = Math.max(typeof s.seq === "number" && Number.isFinite(s.seq) ? s.seq : 0, highestIdNumber(layout));
+  return {
+    version: 1,
+    isOpen: s.isOpen === true,
+    // Full screen is a moment, not a preference: a reload never starts there.
+    isFullscreen: false,
+    width: clampWidth(typeof s.width === "number" ? s.width : CANVAS_DEFAULT_WIDTH),
+    layout,
+    panes,
+    items,
+    focusedPaneId: focused,
+    seq,
+    hydrated: true
+  };
+}
+function normalizeLayout(node) {
+  if (node.type === "pane") return node;
+  return { ...node, sizes: normalizeSizes(node.sizes, node.children.length), children: node.children.map(normalizeLayout) };
+}
+function highestIdNumber(node) {
+  const own = Number((node.type === "pane" ? node.paneId : node.id).split("-").pop());
+  const mine = Number.isFinite(own) ? own : 0;
+  return node.type === "pane" ? mine : Math.max(mine, ...node.children.map(highestIdNumber));
+}
+function canvasReducer(state = createInitialCanvasState(), action) {
+  if (!isCanvasAction(action)) return state;
+  switch (action.type) {
+    case `${P}open`: {
+      const { kind, key, title, data, target = "focused", reveal = true, activate = true, now } = action.payload;
+      const itemId = canvasItemId(kind, key);
+      const existing = state.items[itemId];
+      let next = state;
+      if (existing) {
+        const item = {
+          ...existing,
+          ...data !== void 0 ? { data } : {},
+          ...title !== void 0 ? { title } : {},
+          updatedAt: now
+        };
+        next = { ...next, items: { ...next.items, [itemId]: item } };
+        const pane = paneOf(next, itemId);
+        if (pane && activate) next = { ...withPane(next, { ...pane, activeItemId: itemId }), focusedPaneId: pane.id };
+        if (!pane) next = insertInto(next, next.focusedPaneId, itemId, true);
+      } else {
+        const item = { id: itemId, kind, key, title: title ?? null, data: data ?? null, openedAt: now, updatedAt: now };
+        next = { ...next, items: { ...next.items, [itemId]: item } };
+        let paneId = next.focusedPaneId;
+        if (typeof target === "object" && next.panes[target.paneId]) {
+          paneId = target.paneId;
+        } else if (target === "split-right" || target === "split-down") {
+          const split = addSplit(next, next.focusedPaneId, target === "split-right" ? "horizontal" : "vertical");
+          next = split.state;
+          paneId = split.newPaneId;
+        }
+        next = insertInto(next, paneId, itemId, activate);
+        if (activate) next = { ...next, focusedPaneId: paneId };
+      }
+      return reveal ? { ...next, isOpen: true } : next;
+    }
+    case `${P}update`: {
+      const { itemId, data, title, now } = action.payload;
+      const item = state.items[itemId];
+      if (!item) return state;
+      return {
+        ...state,
+        items: {
+          ...state.items,
+          [itemId]: { ...item, ...data !== void 0 ? { data } : {}, ...title !== void 0 ? { title } : {}, updatedAt: now }
+        }
+      };
+    }
+    case `${P}rekey`: {
+      const { itemId, key } = action.payload;
+      const item = state.items[itemId];
+      if (!item || item.key === key) return state;
+      const nextId = canvasItemId(item.kind, key);
+      if (state.items[nextId]) return canvasReducer(canvasReducer(state, canvasActions.closeItem(itemId)), canvasActions.activate(nextId));
+      const items = { ...state.items, [nextId]: { ...item, id: nextId, key } };
+      delete items[itemId];
+      const panes = {};
+      for (const pane of Object.values(state.panes)) {
+        panes[pane.id] = pane.itemIds.includes(itemId) ? {
+          ...pane,
+          itemIds: pane.itemIds.map((id) => id === itemId ? nextId : id),
+          activeItemId: pane.activeItemId === itemId ? nextId : pane.activeItemId
+        } : pane;
+      }
+      return { ...state, items, panes };
+    }
+    case `${P}closeItem`: {
+      const { itemId } = action.payload;
+      if (!state.items[itemId]) return state;
+      const pane = paneOf(state, itemId);
+      let next = detachItem(state, itemId);
+      const items = { ...next.items };
+      delete items[itemId];
+      next = { ...next, items };
+      if (pane && next.panes[pane.id]?.itemIds.length === 0) next = dropPane(next, pane.id);
+      return next;
+    }
+    case `${P}closeOthers`: {
+      const { itemId } = action.payload;
+      const pane = paneOf(state, itemId);
+      if (!pane) return state;
+      const items = { ...state.items };
+      for (const id of pane.itemIds) if (id !== itemId) delete items[id];
+      return { ...withPane(state, { ...pane, itemIds: [itemId], activeItemId: itemId }), items };
+    }
+    case `${P}activate`: {
+      const pane = paneOf(state, action.payload.itemId);
+      if (!pane) return state;
+      return { ...withPane(state, { ...pane, activeItemId: action.payload.itemId }), focusedPaneId: pane.id };
+    }
+    case `${P}focusPane`:
+      return state.panes[action.payload.paneId] ? { ...state, focusedPaneId: action.payload.paneId } : state;
+    case `${P}moveItem`: {
+      const { itemId, toPaneId, index } = action.payload;
+      const from = paneOf(state, itemId);
+      if (!from || !state.panes[toPaneId]) return state;
+      if (from.id === toPaneId && index === void 0) return state.focusedPaneId === toPaneId ? state : { ...state, focusedPaneId: toPaneId };
+      let next = from.id === toPaneId ? state : detachItem(state, itemId);
+      next = insertInto(next, toPaneId, itemId, true, index);
+      next = { ...next, focusedPaneId: toPaneId };
+      if (from.id !== toPaneId && next.panes[from.id]?.itemIds.length === 0) next = dropPane(next, from.id);
+      return next;
+    }
+    case `${P}splitPane`: {
+      const { paneId, orientation, moveItemId } = action.payload;
+      const pane = state.panes[paneId];
+      if (!pane) return state;
+      const split = addSplit(state, paneId, orientation);
+      let next = split.state;
+      if (moveItemId && pane.itemIds.includes(moveItemId) && pane.itemIds.length > 1) {
+        next = detachItem(next, moveItemId);
+        next = insertInto(next, split.newPaneId, moveItemId, true);
+      }
+      return next;
+    }
+    case `${P}closePane`: {
+      const pane = state.panes[action.payload.paneId];
+      if (!pane) return state;
+      const onlyPane = listPaneIds(state.layout).length === 1;
+      if (onlyPane) return { ...state, isOpen: false, isFullscreen: false };
+      const items = { ...state.items };
+      for (const id of pane.itemIds) delete items[id];
+      return dropPane({ ...state, items }, pane.id);
+    }
+    case `${P}resizeSplit`:
+      return { ...state, layout: resizeSplit(state.layout, action.payload.splitId, action.payload.sizes) };
+    case `${P}setOpen`:
+      return action.payload.open === state.isOpen ? state : { ...state, isOpen: action.payload.open, isFullscreen: action.payload.open ? state.isFullscreen : false };
+    case `${P}toggle`:
+      return { ...state, isOpen: !state.isOpen, isFullscreen: state.isOpen ? false : state.isFullscreen };
+    case `${P}setFullscreen`:
+      return { ...state, isFullscreen: action.payload.fullscreen, isOpen: action.payload.fullscreen ? true : state.isOpen };
+    case `${P}setWidth`:
+      return { ...state, width: clampWidth(action.payload.width) };
+    case `${P}hydrate`: {
+      const snapshot = action.payload.snapshot ? sanitizeCanvasSnapshot(action.payload.snapshot) : null;
+      if (!snapshot) return { ...state, hydrated: true };
+      let next = snapshot;
+      for (const item of Object.values(state.items)) {
+        const pane = paneOf(state, item.id);
+        next = { ...next, items: { ...next.items, [item.id]: item } };
+        if (!paneOf(next, item.id)) next = insertInto(next, next.focusedPaneId, item.id, pane?.activeItemId === item.id);
+      }
+      return { ...next, isOpen: next.isOpen || state.isOpen, hydrated: true };
+    }
+    case `${P}reset`:
+      return { ...createInitialCanvasState(), hydrated: true };
+    default:
+      return state;
+  }
+}
+
+// src/core/store.ts
+function createCanvasStore(initial) {
+  let state = initial ?? createInitialCanvasState();
+  const listeners = /* @__PURE__ */ new Set();
+  return {
+    getState: () => state,
+    dispatch(action) {
+      const next = canvasReducer(state, action);
+      if (next === state) return;
+      state = next;
+      for (const listener of [...listeners]) listener();
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    }
+  };
+}
+function bindCanvasToReduxStore(store, select) {
+  return {
+    getState: () => select(store.getState()),
+    dispatch: (action) => {
+      store.dispatch(action);
+    },
+    subscribe: (listener) => store.subscribe(listener)
+  };
+}
+
+// src/core/persistence.ts
+var CANVAS_STORAGE_KEY = "ai-matrx.canvas.v1";
+function createLocalStorageCanvasPersistence(key = CANVAS_STORAGE_KEY, storage = typeof window === "undefined" ? null : safeLocalStorage()) {
+  return {
+    load() {
+      if (!storage) throw new Error("Canvas storage is unavailable; allow browser storage or provide a persistence port.");
+      const raw = storage.getItem(key);
+      if (!raw) return null;
+      return JSON.parse(raw);
+    },
+    save(snapshot) {
+      if (!storage) throw new Error("Canvas storage is unavailable; allow browser storage or provide a persistence port.");
+      storage.setItem(key, JSON.stringify(snapshot));
+    }
+  };
+}
+function safeLocalStorage() {
+  try {
+    const probe = "__mxc_probe__";
+    window.localStorage.setItem(probe, "1");
+    window.localStorage.removeItem(probe);
+    return window.localStorage;
+  } catch {
+    return null;
+  }
+}
+function toPersistableSnapshot(state, isRestorable) {
+  const keep = new Set(
+    Object.values(state.items).filter((item) => isRestorable(item.kind)).map((item) => item.id)
+  );
+  if (keep.size === Object.keys(state.items).length) return state;
+  const items = Object.fromEntries(Object.entries(state.items).filter(([id]) => keep.has(id)));
+  let layout = state.layout;
+  const panes = {};
+  for (const pane of Object.values(state.panes)) {
+    const itemIds = pane.itemIds.filter((id) => keep.has(id));
+    if (itemIds.length === 0 && pane.itemIds.length > 0) {
+      const pruned = removePane(layout, pane.id);
+      if (pruned) {
+        layout = pruned;
+        continue;
+      }
+    }
+    panes[pane.id] = {
+      ...pane,
+      itemIds,
+      activeItemId: pane.activeItemId && keep.has(pane.activeItemId) ? pane.activeItemId : itemIds[0] ?? null
+    };
+  }
+  const focusedPaneId = panes[state.focusedPaneId] ? state.focusedPaneId : Object.values(panes)[0]?.id ?? state.focusedPaneId;
+  return { ...state, items, panes, layout, focusedPaneId };
+}
+
+// src/core/controller.ts
+var consoleCanvasErrorSink = (report) => {
+  console.error(`[@ai-matrx/canvas] ${report.code}: ${report.message}`, report.detail ?? "");
+};
+function createCanvasController(options) {
+  const { store, persistence = null } = options;
+  const onError = options.onError ?? consoleCanvasErrorSink;
+  const isRestorable = options.isRestorable ?? (() => true);
+  const dispatch = (action) => store.dispatch(action);
+  let presentations = 0;
+  const presentationListeners = /* @__PURE__ */ new Set();
+  const notifyPresentation = () => {
+    for (const listener of [...presentationListeners]) listener();
+  };
+  const controller = {
+    store,
+    getState: () => store.getState(),
+    open(input) {
+      if (options.isKnownKind && !options.isKnownKind(input.kind)) {
+        onError({ code: "unknown-kind", message: `No canvas kind "${input.kind}" is registered.`, detail: input });
+        return null;
+      }
+      if (input.data !== void 0) {
+        const bad = findNonJson(input.data);
+        if (bad) {
+          onError({
+            code: "non-json-data",
+            message: `Canvas data for "${input.kind}" must be plain JSON; ${bad} is not.`,
+            detail: { kind: input.kind, key: input.key }
+          });
+          return null;
+        }
+      }
+      dispatch(canvasActions.open(input));
+      return canvasItemId(input.kind, input.key);
+    },
+    update(itemId, patch) {
+      if (patch.data !== void 0) {
+        const bad = findNonJson(patch.data);
+        if (bad) {
+          onError({ code: "non-json-data", message: `Canvas update for ${itemId} must be plain JSON; ${bad} is not.` });
+          return false;
+        }
+      }
+      if (!store.getState().items[itemId]) return false;
+      dispatch(canvasActions.update(itemId, patch));
+      return true;
+    },
+    rekey(itemId, key) {
+      const item = store.getState().items[itemId];
+      if (!item) return null;
+      dispatch(canvasActions.rekey(itemId, key));
+      return canvasItemId(item.kind, key);
+    },
+    close: (itemId) => dispatch(canvasActions.closeItem(itemId)),
+    closeOthers: (itemId) => dispatch(canvasActions.closeOthers(itemId)),
+    activate: (itemId) => dispatch(canvasActions.activate(itemId)),
+    focusPane: (paneId) => dispatch(canvasActions.focusPane(paneId)),
+    moveItem: (itemId, toPaneId, index) => dispatch(canvasActions.moveItem(itemId, toPaneId, index)),
+    splitPane: (paneId, orientation, moveItemId) => dispatch(canvasActions.splitPane(paneId, orientation, moveItemId)),
+    closePane: (paneId) => dispatch(canvasActions.closePane(paneId)),
+    resizeSplit: (splitId, sizes) => dispatch(canvasActions.resizeSplit(splitId, sizes)),
+    show: () => dispatch(canvasActions.setOpen(true)),
+    hide: () => dispatch(canvasActions.setOpen(false)),
+    toggle: () => dispatch(canvasActions.toggle()),
+    setFullscreen: (fullscreen) => dispatch(canvasActions.setFullscreen(fullscreen)),
+    setWidth: (width) => dispatch(canvasActions.setWidth(width)),
+    has: (kind, key) => canvasItemId(kind, key) in store.getState().items,
+    isPresented: () => presentations > 0,
+    registerPresentation() {
+      presentations += 1;
+      notifyPresentation();
+      let done = false;
+      return () => {
+        if (done) return;
+        done = true;
+        presentations -= 1;
+        notifyPresentation();
+      };
+    },
+    subscribePresentation(listener) {
+      presentationListeners.add(listener);
+      return () => presentationListeners.delete(listener);
+    },
+    start() {
+      let disposed = false;
+      let timer = null;
+      let lastSaved = null;
+      const save = () => {
+        timer = null;
+        const state = store.getState();
+        if (!persistence || !state.hydrated || state === lastSaved) return;
+        lastSaved = state;
+        try {
+          void Promise.resolve(persistence.save(toPersistableSnapshot(state, isRestorable))).catch(
+            (error) => onError({ code: "persistence-save", message: "Saving the canvas layout failed.", detail: error })
+          );
+        } catch (error) {
+          onError({ code: "persistence-save", message: "Saving the canvas layout failed.", detail: error });
+        }
+      };
+      let seen = store.getState();
+      const unsubscribe = store.subscribe(() => {
+        if (!persistence || disposed) return;
+        const current = store.getState();
+        if (current === seen) return;
+        seen = current;
+        if (timer) clearTimeout(timer);
+        timer = setTimeout(save, options.saveDelayMs ?? 250);
+      });
+      if (store.getState().hydrated) {
+      } else if (!persistence) {
+        dispatch(canvasActions.hydrate(null));
+      } else {
+        Promise.resolve().then(() => persistence.load()).then(
+          (snapshot) => {
+            if (disposed) return;
+            const openedThisSession = store.getState().isOpen;
+            const validSnapshot = snapshot === null ? null : sanitizeCanvasSnapshot(snapshot);
+            if (snapshot !== null && validSnapshot === null) {
+              onError({ code: "persistence-load", message: "The saved canvas layout is invalid. Clear the saved layout or repair the persistence port." });
+            }
+            dispatch(canvasActions.hydrate(validSnapshot));
+            if (!openedThisSession && options.mayRestoreOpen && !options.mayRestoreOpen() && store.getState().isOpen) {
+              dispatch(canvasActions.setOpen(false));
+            }
+          },
+          (error) => {
+            onError({ code: "persistence-load", message: "The saved canvas layout could not be read.", detail: error });
+            if (!disposed) dispatch(canvasActions.hydrate(null));
+          }
+        );
+      }
+      return () => {
+        disposed = true;
+        unsubscribe();
+        if (timer) {
+          clearTimeout(timer);
+          save();
+        }
+      };
+    }
+  };
+  return controller;
+}
+
+// src/core/selectors.ts
+var selectCanvasIsOpen = (s) => s.isOpen;
+var selectCanvasIsFullscreen = (s) => s.isFullscreen;
+var selectCanvasWidth = (s) => s.width;
+var selectCanvasLayout = (s) => s.layout;
+var selectCanvasFocusedPaneId = (s) => s.focusedPaneId;
+var selectCanvasIsHydrated = (s) => s.hydrated;
+var selectCanvasItemCount = (s) => Object.keys(s.items).length;
+var selectCanvasPane = (s, paneId) => s.panes[paneId];
+var selectCanvasItem = (s, itemId) => s.items[itemId];
+function selectCanvasPaneCount(s) {
+  return listPaneIds(s.layout).length;
+}
+function selectCanvasActiveItem(s) {
+  const pane = s.panes[s.focusedPaneId];
+  return pane?.activeItemId ? s.items[pane.activeItemId] ?? null : null;
+}
+//# sourceMappingURL=index.cjs.map