@telepath-computer/television 0.1.8 → 0.1.9

package/dist/electron.cjs

@@ -73484,13 +73484,21 @@ var Server2 = class {
     });
   }
   start() {
-    return new Promise((resolve) => {
-      this.httpServer.listen(this.port, this.host, () => {
+    return new Promise((resolve, reject) => {
+      const handleError = (error2) => {
+        this.httpServer.off("listening", handleListening);
+        reject(error2);
+      };
+      const handleListening = () => {
+        this.httpServer.off("error", handleError);
         const address = this.httpServer.address();
         const resolvedPort = typeof address === "object" && address ? address.port : this.port;
         this.baseURL = buildServerURL(this.host ?? DEFAULT_SERVER_HOST, resolvedPort);
         resolve(this.httpServer);
-      });
+      };
+      this.httpServer.once("error", handleError);
+      this.httpServer.once("listening", handleListening);
+      this.httpServer.listen(this.port, this.host);
     });
   }
   getBaseURL() {
@@ -73641,15 +73649,29 @@ function isClientMessage(value) {
     case "create-workspace":
       return typeof message.id === "string" && typeof message.name === "string";
     case "update-workspace":
-      return typeof message.workspaceID === "string" && typeof message.fields === "object" && message.fields !== null && (!("name" in message.fields) || typeof message.fields.name === "string") && (!("layout" in message.fields) || Array.isArray(message.fields.layout) && message.fields.layout.every(
-        (card) => typeof card === "object" && card !== null && "type" in card && card.type === "artifact" && "artifactID" in card && typeof card.artifactID === "string" && "cols" in card && typeof card.cols === "number" && "rows" in card && typeof card.rows === "number"
-      ));
+      return typeof message.workspaceID === "string" && typeof message.fields === "object" && message.fields !== null && (!("name" in message.fields) || typeof message.fields.name === "string") && (!("layout" in message.fields) || Array.isArray(message.fields.layout) && message.fields.layout.every(isLayoutNode));
     case "delete-workspace":
       return typeof message.workspaceID === "string";
     default:
       return false;
   }
 }
+function isLayoutNode(value) {
+  if (typeof value !== "object" || value === null || !("type" in value)) {
+    return false;
+  }
+  const node = value;
+  switch (node.type) {
+    case "card":
+      return typeof node.id === "string" && typeof node.artifactID === "string" && (typeof node.width === "number" || node.width === "auto") && (typeof node.height === "number" || node.height === "auto");
+    case "row":
+      return typeof node.id === "string" && (typeof node.height === "number" || node.height === "auto") && Array.isArray(node.children) && node.children.every(isLayoutNode);
+    case "stack":
+      return typeof node.id === "string" && Array.isArray(node.children) && node.children.every(isLayoutNode);
+    default:
+      return false;
+  }
+}
 
 // node_modules/mitt/dist/mitt.mjs
 function mitt_default(n) {
@@ -73701,54 +73723,324 @@ var import_node_crypto2 = require("node:crypto");
 var import_node_fs2 = require("node:fs");
 var import_node_path3 = __toESM(require("node:path"), 1);
 
+// src/constants.ts
+var LAYOUT_FULL_WIDTH_UNITS = 4;
+var LAYOUT_FULL_HEIGHT_UNITS = 6;
+var MIN_LAYOUT_CARD_WIDTH_UNITS = 2;
+var MAX_LAYOUT_CARD_WIDTH_UNITS = LAYOUT_FULL_WIDTH_UNITS;
+var DEFAULT_LAYOUT_CARD_WIDTH = "auto";
+var DEFAULT_LAYOUT_CARD_HEIGHT = "auto";
+var DEFAULT_LAYOUT_UNIT = 120;
+var CARD_GAP = 16;
+var CARD_WIDTH = DEFAULT_LAYOUT_UNIT * LAYOUT_FULL_WIDTH_UNITS + CARD_GAP * (LAYOUT_FULL_WIDTH_UNITS - 1);
+var CARD_HEIGHT = DEFAULT_LAYOUT_UNIT * LAYOUT_FULL_HEIGHT_UNITS + CARD_GAP * (LAYOUT_FULL_HEIGHT_UNITS - 1);
+
 // src/types.ts
-var DEFAULT_LAYOUT_CARD_COLS = 2;
-var DEFAULT_LAYOUT_CARD_ROWS = 6;
-var LAYOUT_COLS_NARROW = 1;
-var LAYOUT_ROW_SHORT = 2;
-var LAYOUT_ROW_MID = 3;
-var LAYOUT_ROW_TALL = 4;
-var ALLOWED_COLS = [LAYOUT_COLS_NARROW, DEFAULT_LAYOUT_CARD_COLS];
-var ALLOWED_ROWS = [
-  LAYOUT_ROW_SHORT,
-  LAYOUT_ROW_MID,
-  LAYOUT_ROW_TALL,
-  DEFAULT_LAYOUT_CARD_ROWS
-];
-function clampLayoutCols(cols) {
-  const n = Math.round(cols);
-  return ALLOWED_COLS.includes(n) ? n : DEFAULT_LAYOUT_CARD_COLS;
-}
-function clampLayoutRows(rows) {
-  const n = Math.round(rows);
-  return ALLOWED_ROWS.includes(n) ? n : DEFAULT_LAYOUT_CARD_ROWS;
-}
-function createLayoutCardRecord(artifactID) {
+function createCardNode(artifactID, overrides = {}) {
   return {
-    type: "artifact",
+    id: overrides.id ?? ulid3(),
+    type: "card",
     artifactID,
-    cols: DEFAULT_LAYOUT_CARD_COLS,
-    rows: DEFAULT_LAYOUT_CARD_ROWS
+    width: overrides.width ?? DEFAULT_LAYOUT_CARD_WIDTH,
+    height: overrides.height ?? DEFAULT_LAYOUT_CARD_HEIGHT
   };
 }
-function sanitizeLayoutCard(card) {
+function layoutContainsArtifactID(layout, artifactID) {
+  return layout.some((node) => nodeContainsArtifactID(node, artifactID));
+}
+function nodeContainsArtifactID(node, artifactID) {
+  switch (node.type) {
+    case "card":
+      return node.artifactID === artifactID;
+    case "row":
+      return node.children.some((child) => child.artifactID === artifactID);
+    case "stack":
+      return node.children.some((child) => nodeContainsArtifactID(child, artifactID));
+  }
+}
+function getWorkspaceArtifactIDs(workspace) {
+  return workspace.layout.flatMap(collectArtifactIDs);
+}
+function collectArtifactIDs(node) {
+  switch (node.type) {
+    case "card":
+      return [node.artifactID];
+    case "row":
+      return node.children.map((child) => child.artifactID);
+    case "stack":
+      return node.children.flatMap(collectArtifactIDs);
+  }
+}
+
+// src/browser/ui/layout.ts
+var LEGACY_BAND_HEIGHT_ROWS = 6;
+var LEGACY_NARROW_COLS = 1;
+var LEGACY_FULL_COLS = 2;
+var LEGACY_ROW_SHORT = 2;
+var LEGACY_ROW_MID = 3;
+var LEGACY_ROW_TALL = 4;
+var LEGACY_ROW_FULL = 6;
+var LEGACY_ALLOWED_ROWS = [LEGACY_ROW_SHORT, LEGACY_ROW_MID, LEGACY_ROW_TALL, LEGACY_ROW_FULL];
+var LEGACY_LEFT_X = 0;
+var LEGACY_RIGHT_X = 1;
+function removeArtifactFromLayout(layout, artifactID) {
+  return normalizeRootNodes(layout.flatMap((node) => removeArtifactFromNode(node, artifactID)));
+}
+function migrateLegacyLayout(cards) {
+  const normalized = cards.map((card) => ({
+    artifactID: card.artifactID,
+    width: normalizeLegacyCols(card.width),
+    height: normalizeLegacyRows(card.height)
+  }));
+  const bands = deriveLegacyBands(normalized);
+  return normalizeRootNodes(bands.flatMap(buildNodesForLegacyBand));
+}
+function normalizeRootNodes(layout) {
+  const normalized = [];
+  for (const node of layout) {
+    const entries = normalizeNode(node);
+    for (const entry of entries) {
+      if (entry.type === "row") {
+        normalized.push(...entry.children.map(cloneCard));
+        continue;
+      }
+      normalized.push(entry);
+    }
+  }
+  return normalized;
+}
+function normalizeNode(node) {
+  switch (node.type) {
+    case "card":
+      return [cloneCard(node)];
+    case "row": {
+      const children = node.children.map(cloneCard);
+      if (children.length === 0) {
+        return [];
+      }
+      if (children.length === 1) {
+        return [children[0]];
+      }
+      return [{ ...node, children }];
+    }
+    case "stack": {
+      const children = [];
+      for (const child of node.children) {
+        const normalizedChildren = normalizeNode(child);
+        for (const normalizedChild of normalizedChildren) {
+          if (normalizedChild.type === "stack") {
+            children.push(...normalizedChild.children.map(cloneStackChild));
+            continue;
+          }
+          if (normalizedChild.type === "row") {
+            children.push({
+              ...normalizedChild,
+              children: normalizedChild.children.map(cloneCard)
+            });
+            continue;
+          }
+          children.push(cloneCard(normalizedChild));
+        }
+      }
+      if (children.length === 0) {
+        return [];
+      }
+      if (children.length === 1) {
+        return [cloneStackChild(children[0])];
+      }
+      return [{ ...node, children }];
+    }
+  }
+}
+function removeArtifactFromNode(node, artifactID) {
+  switch (node.type) {
+    case "card":
+      return node.artifactID === artifactID ? [] : [cloneCard(node)];
+    case "row": {
+      const children = node.children.filter((child) => child.artifactID !== artifactID).map(cloneCard);
+      if (children.length === 0) {
+        return [];
+      }
+      if (children.length === 1) {
+        return [children[0]];
+      }
+      return [{ ...node, children }];
+    }
+    case "stack": {
+      const children = node.children.flatMap((child) => {
+        const removed = removeArtifactFromNode(child, artifactID);
+        return removed.filter((entry) => entry.type !== "stack");
+      });
+      if (children.length === 0) {
+        return [];
+      }
+      if (children.length === 1) {
+        return [cloneStackChild(children[0])];
+      }
+      return [{ ...node, children }];
+    }
+  }
+}
+function normalizeLegacyCols(width) {
+  return Math.round(width) === LEGACY_NARROW_COLS ? LEGACY_NARROW_COLS : LEGACY_FULL_COLS;
+}
+function normalizeLegacyRows(height) {
+  const rounded = Math.round(height);
+  return LEGACY_ALLOWED_ROWS.includes(rounded) ? rounded : LEGACY_BAND_HEIGHT_ROWS;
+}
+function deriveLegacyBands(cards) {
+  const bands = [];
+  let current = null;
+  for (const card of cards) {
+    if (!current) {
+      const placements = packLegacyBand([card], card.width);
+      if (!placements) {
+        continue;
+      }
+      current = {
+        width: card.width,
+        placements
+      };
+      continue;
+    }
+    const nextCards = current.placements.map((placement) => ({
+      artifactID: placement.artifactID,
+      width: placement.width,
+      height: placement.height
+    })).concat(card);
+    let nextWidth = current.width;
+    let packed = packLegacyBand(nextCards, nextWidth);
+    if (!packed && current.width < LEGACY_FULL_COLS && card.width > current.width) {
+      nextWidth = LEGACY_FULL_COLS;
+      packed = packLegacyBand(nextCards, nextWidth);
+    }
+    if (packed) {
+      current = {
+        width: nextWidth,
+        placements: packed
+      };
+      continue;
+    }
+    bands.push(current);
+    const newPlacements = packLegacyBand([card], card.width);
+    if (!newPlacements) {
+      current = null;
+      continue;
+    }
+    current = {
+      width: card.width,
+      placements: newPlacements
+    };
+  }
+  if (current) {
+    bands.push(current);
+  }
+  return bands;
+}
+function packLegacyBand(cards, width) {
+  const occupied = Array.from(
+    { length: LEGACY_BAND_HEIGHT_ROWS },
+    () => Array.from({ length: width }, () => false)
+  );
+  const placements = [];
+  for (const card of cards) {
+    const position = firstLegacyFit(occupied, width, card);
+    if (!position) {
+      return null;
+    }
+    const placement = {
+      artifactID: card.artifactID,
+      width: card.width,
+      height: card.height,
+      x: position.x,
+      y: position.y
+    };
+    placeLegacyCard(occupied, placement);
+    placements.push(placement);
+  }
+  return placements;
+}
+function firstLegacyFit(occupied, width, card) {
+  if (card.width > width || card.height > LEGACY_BAND_HEIGHT_ROWS) {
+    return null;
+  }
+  for (let y2 = 0; y2 <= LEGACY_BAND_HEIGHT_ROWS - card.height; y2 += 1) {
+    for (let x2 = 0; x2 <= width - card.width; x2 += 1) {
+      let fits = true;
+      for (let yy = y2; yy < y2 + card.height && fits; yy += 1) {
+        for (let xx = x2; xx < x2 + card.width; xx += 1) {
+          if (occupied[yy]?.[xx]) {
+            fits = false;
+            break;
+          }
+        }
+      }
+      if (fits) {
+        return { x: x2, y: y2 };
+      }
+    }
+  }
+  return null;
+}
+function placeLegacyCard(occupied, placement) {
+  for (let yy = placement.y; yy < placement.y + placement.height; yy += 1) {
+    for (let xx = placement.x; xx < placement.x + placement.width; xx += 1) {
+      occupied[yy][xx] = true;
+    }
+  }
+}
+function buildNodesForLegacyBand(band) {
+  const placements = [...band.placements].sort((a, b2) => a.y - b2.y || a.x - b2.x);
+  const children = [];
+  for (let index = 0; index < placements.length; index += 1) {
+    const current = placements[index];
+    const next = placements[index + 1];
+    if (current.width === LEGACY_NARROW_COLS && next && next.width === LEGACY_NARROW_COLS && next.y === current.y && next.height === current.height && current.x === LEGACY_LEFT_X && next.x === LEGACY_RIGHT_X) {
+      children.push({
+        id: ulid3(),
+        type: "row",
+        height: current.height,
+        children: [migrateLegacyCard(current), migrateLegacyCard(next)]
+      });
+      index += 1;
+      continue;
+    }
+    children.push(migrateLegacyCard(current));
+  }
+  if (children.length === 0) {
+    return [];
+  }
+  if (children.length === 1) {
+    const child = children[0];
+    return child.type === "row" ? child.children.map(cloneCard) : [cloneCard(child)];
+  }
+  return [
+    {
+      id: ulid3(),
+      type: "stack",
+      children
+    }
+  ];
+}
+function migrateLegacyCard(card) {
   return {
-    type: "artifact",
+    id: ulid3(),
+    type: "card",
     artifactID: card.artifactID,
-    cols: clampLayoutCols(card.cols ?? DEFAULT_LAYOUT_CARD_COLS),
-    rows: clampLayoutRows(card.rows ?? DEFAULT_LAYOUT_CARD_ROWS)
+    width: card.width === LEGACY_NARROW_COLS ? MIN_LAYOUT_CARD_WIDTH_UNITS : MAX_LAYOUT_CARD_WIDTH_UNITS,
+    height: card.height
   };
 }
-function migrateWorkspaceData(workspace) {
-  const layout = Array.isArray(workspace.layout) ? workspace.layout.map((card) => sanitizeLayoutCard(card)) : [];
+function cloneCard(node) {
   return {
-    id: workspace.id,
-    name: workspace.name,
-    layout
+    ...node
   };
 }
-function getWorkspaceArtifactIDs(workspace) {
-  return workspace.layout.map((card) => card.artifactID);
+function cloneStackChild(node) {
+  return node.type === "card" ? cloneCard(node) : {
+    ...node,
+    children: node.children.map(cloneCard)
+  };
 }
 
 // src/server/server-store.ts
@@ -73768,26 +74060,51 @@ function validateHTMLFragment(content) {
   }
 }
 function migrateWorkspaceJson(raw) {
-  if ("layout" in raw && Array.isArray(raw.layout) && raw.layout.length > 0) {
-    return false;
-  }
   if ("artifacts" in raw && Array.isArray(raw.artifacts)) {
     raw.layout = raw.artifacts;
     delete raw.artifacts;
     return true;
   }
   if ("artifactIDs" in raw && Array.isArray(raw.artifactIDs)) {
-    raw.layout = raw.artifactIDs.map((id) => ({
-      type: "artifact",
-      artifactID: id,
-      cols: DEFAULT_COLS,
-      rows: DEFAULT_ROWS
-    }));
+    raw.layout = raw.artifactIDs.map((id) => ({ artifactID: id, width: DEFAULT_COLS, height: DEFAULT_ROWS }));
     delete raw.artifactIDs;
     return true;
   }
   return false;
 }
+function deserializeWorkspaceData(workspace) {
+  const rawLayout = workspace.layout;
+  if (!Array.isArray(rawLayout)) {
+    return {
+      migrated: false,
+      workspace: {
+        id: workspace.id,
+        name: workspace.name,
+        layout: []
+      }
+    };
+  }
+  if (rawLayout.every(
+    (node) => typeof node === "object" && node !== null && "type" in node && (node.type === "card" || node.type === "stack")
+  )) {
+    return {
+      migrated: false,
+      workspace: {
+        id: workspace.id,
+        name: workspace.name,
+        layout: rawLayout
+      }
+    };
+  }
+  return {
+    migrated: true,
+    workspace: {
+      id: workspace.id,
+      name: workspace.name,
+      layout: migrateLegacyLayout(rawLayout)
+    }
+  };
+}
 var ServerStore = class extends Emitter {
   dataDir;
   workspaces = /* @__PURE__ */ new Map();
@@ -73821,7 +74138,7 @@ var ServerStore = class extends Emitter {
   }
   findArtifactWorkspaces(artifactID) {
     return [...this.workspaces.values()].filter(
-      (workspace) => workspace.layout.some((card) => card.artifactID === artifactID)
+      (workspace) => layoutContainsArtifactID(workspace.layout, artifactID)
     );
   }
   createArtifact(input) {
@@ -73839,7 +74156,7 @@ var ServerStore = class extends Emitter {
       content: input.content
     });
     this.artifacts.set(artifact.id, artifact);
-    workspace.layout.push(createLayoutCardRecord(artifact.id));
+    workspace.layout = [...workspace.layout, createCardNode(artifact.id)];
     this.persistArtifact(artifact);
     this.persistWorkspace(workspace);
     this.emit("mutation", {
@@ -73872,11 +74189,11 @@ var ServerStore = class extends Emitter {
       throw new Error(`Artifact not found: ${input.artifactID}`);
     }
     const workspace = this.requireWorkspace(input.workspaceID);
-    if (!workspace.layout.some((card) => card.artifactID === input.artifactID)) {
+    if (!layoutContainsArtifactID(workspace.layout, input.artifactID)) {
       throw new Error(`Artifact not linked to workspace: ${input.artifactID}`);
     }
     this.artifacts.delete(input.artifactID);
-    workspace.layout = workspace.layout.filter((card) => card.artifactID !== input.artifactID);
+    workspace.layout = removeArtifactFromLayout(workspace.layout, input.artifactID);
     this.persistWorkspace(workspace);
     this.deleteArtifactFile(input.artifactID);
     this.emit("mutation", {
@@ -73907,7 +74224,7 @@ var ServerStore = class extends Emitter {
       nextFields.name = input.fields.name;
     }
     if (Array.isArray(input.fields.layout)) {
-      workspace.layout = input.fields.layout.map((card) => sanitizeLayoutCard(card));
+      workspace.layout = input.fields.layout.map((node) => structuredClone(node));
       nextFields.layout = workspace.layout;
     }
     this.persistWorkspace(workspace);
@@ -73945,10 +74262,10 @@ var ServerStore = class extends Emitter {
       const filePath = import_node_path3.default.join(this.workspacesDir, file2);
       const raw = this.readJsonFile(filePath);
       if (!raw || typeof raw !== "object") continue;
-      const migrated = migrateWorkspaceJson(raw);
-      const workspace = migrateWorkspaceData(raw);
+      const renamedLegacyFields = migrateWorkspaceJson(raw);
+      const { workspace, migrated } = deserializeWorkspaceData(raw);
       this.workspaces.set(workspace.id, workspace);
-      if (migrated) {
+      if (renamedLegacyFields || migrated) {
         this.persistWorkspace(workspace);
       }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@telepath-computer/television",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "type": "module",
   "main": "dist/electron.cjs",
   "bin": {
@@ -14,7 +14,7 @@
     "dev": "npm run dev:server",
     "dev:electron": "scripts/dev-electron.sh",
     "dev:server": "scripts/dev-server.sh",
-    "demo:layout": "vite --config config/vite.demo-layout.ts --host 127.0.0.1",
+    "layout": "vite --config config/vite.demo-layout.ts --host 127.0.0.1",
     "build": "npm run build:artifact-runtime && npm run build:renderer && npm run build:cli && npm run build:electron",
     "prepack": "npm run build",
     "start": "npm run build && env -u ELECTRON_RUN_AS_NODE electron .",
@@ -22,7 +22,9 @@
     "lint:fix": "npm run lint -- --fix",
     "type-check": "tsc --noEmit",
     "test:setup": "playwright install chromium",
-    "test": "vitest run",
+    "test:core": "vitest run test/main.test.ts test/layout.test.ts test/television-client.test.ts test/workspace-service.test.ts test/browser-server.test.ts test/server-manager.test.ts test/server-store.test.ts test/artifacts.test.ts test/artifact-runtime.test.ts test/html-artifact-srcdoc.test.ts test/demo-layout-state.test.ts test/server.test.ts test/cli.test.ts",
+    "test:ui": "vitest run test/client-store.test.ts test/runtime.test.ts test/renderer.test.ts test/artifact-view.test.ts test/layout-stream.test.ts test/drag-controller.test.ts test/layout-mutations.test.ts test/workspace-view.test.ts test/app-root.test.ts",
+    "test": "npm run test:core && npm run test:ui",
     "test:e2e": "playwright test --config=playwright.config.ts",
     "test:electron": "npm run build && playwright test --config=playwright.electron.config.ts",
     "test:all": "npm test && npm run test:e2e && npm run test:electron",