@jxsuite/studio 5.3.0 → 5.4.0

package/styles/inspector.css

@@ -76,7 +76,7 @@
   text-decoration: underline;
 }
 
-/* ─── Provenance dots on a section heading (plan §6.2) ────────────────────────
+/* ─── Provenance dots on a section heading (§6.7) ─────────────────────────────
    The chip itself is styled with the rest of the row vocabulary further down —
    one block, because Style and Component Props are the same chip in two
    cascades. What is only needed here is the DOT form: a collapsed accordion
@@ -93,7 +93,7 @@
   border: none;
   cursor: default;
 }
-/* `mixed` (§6.5) — the multi-selection's own state. Neutral on purpose: unlike the other three it
+/* `mixed` (§6.7) — the multi-selection's own state. Neutral on purpose: unlike the other three it
    says nothing about WHERE the value came from, only that the selected elements disagree, so it
    must not borrow the accent that means "set here" or the amber that means "inherited". */
 .set-dot.provenance-chip--mixed {
@@ -146,7 +146,8 @@
 }
 
 /* ─── The Layout-element card ───────────────────────────────────────────────
-   What the inspector says when you click page chrome — §8.2's first click. */
+   What the inspector says when you click page chrome — the first click a new author makes
+   (docs/studio/design/properties.md, "Layout elements"). */
 .layout-origin {
   display: flex;
   align-items: center;

package/styles/overlays.css

@@ -232,7 +232,7 @@
   color: var(--danger);
 }
 
-/* ─── ④ The toast host — the fourth overlay layer ─────────────────────────── */
+/* ─── The toast host — the fourth overlay layer ───────────────────────────── */
 /* The consequence line inside a destructive confirmation — what this delete or rename breaks, and
    what survives it. Set apart from the question above it, because the question is a sentence the
    user already wrote in their head and this is the part they have not thought about. */

package/styles/tokens.css

@@ -12,7 +12,11 @@
 
    The four --canvas-* steps are the exception and are meant to be: they colour surfaces that
    render as a light DOCUMENT in both chromes, so they are mixed from the black and white keywords
-   and do not follow the theme. See tokens.json for what else moved here out of styles/spectrum.css. */
+   and do not follow the theme. See tokens.json for what else moved here out of styles/spectrum.css.
+
+   user-select: none on :root is Studio's selection policy: the chrome is not text. Every surface
+   inherits it, a modal dialog restates it below, and a part whose text the reader must copy opts
+   back in from its own surface document, against the list tests/selection-policy.test.ts holds. */
 
 :root {
   box-sizing: border-box;
@@ -24,6 +28,7 @@
   font-family: var(--jx-font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif);
   font-size: var(--jx-text-md, 12px);
   line-height: 1.5;
+  user-select: none;
   --panel-w-left: 240px;
   --panel-w-right: 280px;
   --bg: var(--jx-bg, #111114);
@@ -89,6 +94,17 @@
   overflow: hidden;
   background: var(--jx-bg, #111114);
 }
+/* The root's `user-select: none` restated, because a modal dialog would otherwise take it back:
+   Chromium's UA sheet gives a MODAL dialog `user-select: text` (measured: `auto` while closed or
+   after show(), `text` after showModal()), and Blink inherits that into every node inside. Every
+   Studio modal is a jx-dialog opened with showModal(), so without this rule the headline, labels
+   and buttons of every dialog would be selectable whatever the root says. An author rule beats the
+   UA one at any specificity, since it is not `!important`. A dialog's MESSAGE opts back in from
+   its own surface document (`surfaces/dialog.json`), and an input inside one stays selectable
+   without help. */
+:root dialog {
+  user-select: none;
+}
 :root[data-theme="light"],
 :root[data-theme="light"] body {
   background: var(--jx-bg, #f7f7f9);

package/styles/tokens.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://jxsuite.com/schema/v1",
   "$id": "StudioTokens",
-  "$description": "Studio's global base and its semantic token layer, as a Jx style block. `styles/tokens.css` is GENERATED from this by `scripts/build-styles.ts`; edit this file and run `bun run styles:sync`. It stays a linked stylesheet because every declaration in it is pre-paint: the kit's own theme is adopted from JavaScript, so these hex fallbacks are what paints the shell before that lands. THE LAST OF `styles/spectrum.css` IS HERE. That file was the whole of what was declared ON the `sp-theme` element, where Spectrum's own ramp was in scope and `:root` was not, and its header said it would be deleted whole when that element went. It has: the box is `#shell-root` in `shell-frame.json`, the typography is the four declarations above (the sans stack is the kit's and 12px is `--jx-text-md`, which is what `--spectrum-font-size-75` resolved to), and `--case-c`/`--slot-c` are aliases in the same idiom as `--switch-c`, at the values `panel-outline.json` had already written down as their fallbacks. THE FOUR `--canvas-*` STEPS DO NOT FOLLOW THE THEME, and that is the point of them rather than an oversight: they colour surfaces that render as a light DOCUMENT in both chromes — the stylebook, the element-card previews, the empty-slot placeholder on the canvas — so they are mixed from the `black` and `white` KEYWORDS, which is what `var(--spectrum-black)`/`var(--spectrum-white)` were. Seven more steps were declared beside them and no rule in the package ever read one, so those are not here. The four `--data-*` syntax colours are not here either, for a reason `panel-data.json` states outright: nothing read them, they were declared for a palette nobody wrote, and `data-tone` still carries the type on every value for the day somebody does.",
+  "$description": "Studio's global base and its semantic token layer, as a Jx style block. `styles/tokens.css` is GENERATED from this by `scripts/build-styles.ts`; edit this file and run `bun run styles:sync`. It stays a linked stylesheet because every declaration in it is pre-paint: the kit's own theme is adopted from JavaScript, so these hex fallbacks are what paints the shell before that lands. THE LAST OF `styles/spectrum.css` IS HERE. That file was the whole of what was declared ON the `sp-theme` element, where Spectrum's own ramp was in scope and `:root` was not, and its header said it would be deleted whole when that element went. It has: the box is `#shell-root` in `shell-frame.json`, the typography is the four declarations above (the sans stack is the kit's and 12px is `--jx-text-md`, which is what `--spectrum-font-size-75` resolved to), and `--case-c`/`--slot-c` are aliases in the same idiom as `--switch-c`, at the values `panel-outline.json` had already written down as their fallbacks. THE FOUR `--canvas-*` STEPS DO NOT FOLLOW THE THEME, and that is the point of them rather than an oversight: they colour surfaces that render as a light DOCUMENT in both chromes — the stylebook, the element-card previews, the empty-slot placeholder on the canvas — so they are mixed from the `black` and `white` KEYWORDS, which is what `var(--spectrum-black)`/`var(--spectrum-white)` were. Seven more steps were declared beside them and no rule in the package ever read one, so those are not here. The four `--data-*` syntax colours are not here either, for a reason `panel-data.json` states outright: nothing read them, they were declared for a palette nobody wrote, and `data-tone` still carries the type on every value for the day somebody does. THE CHROME IS NOT TEXT: `user-select: none` on the root is Studio's selection policy, stated once so a drag across the window highlights no label, button or heading; every surface inherits it, `& dialog` restates it where the UA sheet would reopen it, and a part whose text the reader must copy opts back in on that part alone, from its own surface document, against the list `tests/selection-policy.test.ts` holds. Editable controls, Monaco and the canvas iframe keep their own selection and need nothing.",
   "tagName": "html",
   "style": {
     "box-sizing": "border-box",
@@ -13,6 +13,7 @@
     "font-family": "var(--jx-font-sans, -apple-system, BlinkMacSystemFont, \"Segoe UI\", system-ui, sans-serif)",
     "font-size": "var(--jx-text-md, 12px)",
     "line-height": "1.5",
+    "user-select": "none",
     "--panel-w-left": "240px",
     "--panel-w-right": "280px",
     "--bg": "var(--jx-bg, #111114)",
@@ -77,6 +78,10 @@
       "overflow": "hidden",
       "background": "var(--jx-bg, #111114)"
     },
+    "& dialog": {
+      "$description": "The root's `user-select: none` restated, because a modal dialog would otherwise take it back: Chromium's UA sheet gives a MODAL dialog `user-select: text` (measured: `auto` while closed or after show(), `text` after showModal()), and Blink inherits that into every node inside. Every Studio modal is a jx-dialog opened with showModal(), so without this rule the headline, labels and buttons of every dialog would be selectable whatever the root says. An author rule beats the UA one at any specificity, since it is not `!important`. A dialog's MESSAGE opts back in from its own surface document (`surfaces/dialog.json`), and an input inside one stays selectable without help.",
+      "user-select": "none"
+    },
     "&[data-theme=\"light\"], &[data-theme=\"light\"] body": {
       "background": "var(--jx-bg, #f7f7f9)"
     }

package/dist/chunks/entry-commands-1wnsqn5d.js

@@ -1,42 +0,0 @@
-import {
-  createEntry2,
-  registerContentCommands2
-} from "./studio-151w0xnh.js";
-import"./studio-rtskkm43.js";
-import"./studio-4f3psrk1.js";
-import"./studio-j0w60gft.js";
-import"./studio-ke09tn9k.js";
-import"./studio-4c041r8y.js";
-import"./studio-q0a3yk4n.js";
-import"./studio-a65w20ex.js";
-import"./studio-cgprcdxn.js";
-import"./studio-nsgw7dbk.js";
-import"./studio-27q131j3.js";
-import"./studio-nq5yf5mp.js";
-import"./studio-drg8qj9k.js";
-import"./studio-fzjx96t2.js";
-import"./studio-zjjde71a.js";
-import"./studio-z2smx5ce.js";
-import"./studio-b7xacrwe.js";
-import"./studio-ab87phj1.js";
-import"./studio-gk2twyh4.js";
-import"./studio-wnsyffg1.js";
-import"./studio-m1p9b6c3.js";
-import"./studio-esrxgwh6.js";
-import"./studio-6gryj0sg.js";
-import"./studio-6nzaktvy.js";
-import"./studio-jt27ta6x.js";
-import"./studio-0j7r7s9g.js";
-import"./studio-1k325pwf.js";
-import"./studio-d1n2bykn.js";
-import"./studio-yxa81f45.js";
-import"./studio-3ntvq6cg.js";
-import"./studio-d8z5bajd.js";
-import"./studio-tjjk7jvk.js";
-export {
-  createEntry2 as createEntry,
-  registerContentCommands2 as registerContentCommands
-};
-
-//# debugId=474288D19E3E71A764756E2164756E21
-//# sourceMappingURL=entry-commands-1wnsqn5d.js.map

package/dist/chunks/layers-panel-73gfkcga.js

@@ -1,41 +0,0 @@
-import {
-  startLayerTitleEdit2,
-  registerLayersPanel2
-} from "./studio-b66rsh78.js";
-import"./studio-nfx354t1.js";
-import"./studio-ye9drbk8.js";
-import"./studio-6kvgrkrp.js";
-import"./studio-a5h5j33a.js";
-import"./studio-gtfq1dkz.js";
-import"./studio-4f3psrk1.js";
-import"./studio-q0a3yk4n.js";
-import"./studio-a65w20ex.js";
-import"./studio-27q131j3.js";
-import"./studio-nq5yf5mp.js";
-import"./studio-drg8qj9k.js";
-import"./studio-fzjx96t2.js";
-import"./studio-zjjde71a.js";
-import"./studio-z2smx5ce.js";
-import"./studio-b7xacrwe.js";
-import"./studio-ab87phj1.js";
-import"./studio-gk2twyh4.js";
-import"./studio-wnsyffg1.js";
-import"./studio-m1p9b6c3.js";
-import"./studio-esrxgwh6.js";
-import"./studio-6gryj0sg.js";
-import"./studio-6nzaktvy.js";
-import"./studio-jt27ta6x.js";
-import"./studio-0j7r7s9g.js";
-import"./studio-1k325pwf.js";
-import"./studio-d1n2bykn.js";
-import"./studio-yxa81f45.js";
-import"./studio-3ntvq6cg.js";
-import"./studio-d8z5bajd.js";
-import"./studio-tjjk7jvk.js";
-export {
-  registerLayersPanel2 as registerLayersPanel,
-  startLayerTitleEdit2 as startLayerTitleEdit
-};
-
-//# debugId=CE19FDE5A143AAD964756E2164756E21
-//# sourceMappingURL=layers-panel-73gfkcga.js.map

package/dist/chunks/publish-panel-z1zd2da1.js

@@ -1,27 +0,0 @@
-import {
-  seedPublishConnected2,
-  openPublishPanel2
-} from "./studio-7144epdr.js";
-import"./studio-vn5hske5.js";
-import"./studio-c04nzbby.js";
-import"./studio-nsgw7dbk.js";
-import"./studio-fzjx96t2.js";
-import"./studio-z2smx5ce.js";
-import"./studio-gk2twyh4.js";
-import"./studio-wnsyffg1.js";
-import"./studio-m1p9b6c3.js";
-import"./studio-6gryj0sg.js";
-import"./studio-6nzaktvy.js";
-import"./studio-0j7r7s9g.js";
-import"./studio-1k325pwf.js";
-import"./studio-d1n2bykn.js";
-import"./studio-yxa81f45.js";
-import"./studio-3ntvq6cg.js";
-import"./studio-d8z5bajd.js";
-export {
-  openPublishPanel2 as openPublishPanel,
-  seedPublishConnected2 as seedPublishConnected
-};
-
-//# debugId=6014AB98C3074CCB64756E2164756E21
-//# sourceMappingURL=publish-panel-z1zd2da1.js.map

package/dist/chunks/quick-search-zdv7h8ht.js

@@ -1,47 +0,0 @@
-import {
-  initQuickSearch2,
-  openQuickSearch2
-} from "./studio-g33v4fe9.js";
-import"./studio-7rrb1esn.js";
-import"./studio-a5h5j33a.js";
-import"./studio-xajk70w0.js";
-import"./studio-msc1ee1m.js";
-import"./studio-t171hxhe.js";
-import"./studio-gtfq1dkz.js";
-import"./studio-rtskkm43.js";
-import"./studio-50wfwy44.js";
-import"./studio-j0w60gft.js";
-import"./studio-ke09tn9k.js";
-import"./studio-4c041r8y.js";
-import"./studio-q0a3yk4n.js";
-import"./studio-a65w20ex.js";
-import"./studio-cgprcdxn.js";
-import"./studio-nsgw7dbk.js";
-import"./studio-27q131j3.js";
-import"./studio-nq5yf5mp.js";
-import"./studio-drg8qj9k.js";
-import"./studio-fzjx96t2.js";
-import"./studio-zjjde71a.js";
-import"./studio-z2smx5ce.js";
-import"./studio-b7xacrwe.js";
-import"./studio-ab87phj1.js";
-import"./studio-gk2twyh4.js";
-import"./studio-wnsyffg1.js";
-import"./studio-m1p9b6c3.js";
-import"./studio-esrxgwh6.js";
-import"./studio-6gryj0sg.js";
-import"./studio-6nzaktvy.js";
-import"./studio-jt27ta6x.js";
-import"./studio-0j7r7s9g.js";
-import"./studio-1k325pwf.js";
-import"./studio-d1n2bykn.js";
-import"./studio-yxa81f45.js";
-import"./studio-3ntvq6cg.js";
-import"./studio-d8z5bajd.js";
-export {
-  initQuickSearch2 as initQuickSearch,
-  openQuickSearch2 as openQuickSearch
-};
-
-//# debugId=671F3AA898CB9C9E64756E2164756E21
-//# sourceMappingURL=quick-search-zdv7h8ht.js.map

package/dist/chunks/right-panel-889vbnm5.js

@@ -1,45 +0,0 @@
-import {
-  mount2,
-  unmount2,
-  render2,
-  inspectorTab2,
-  setInspectorTab2
-} from "./studio-c0qgc3tn.js";
-import"./studio-nfx354t1.js";
-import"./studio-ye9drbk8.js";
-import"./studio-6kvgrkrp.js";
-import"./studio-gtfq1dkz.js";
-import"./studio-4f3psrk1.js";
-import"./studio-a65w20ex.js";
-import"./studio-27q131j3.js";
-import"./studio-nq5yf5mp.js";
-import"./studio-drg8qj9k.js";
-import"./studio-fzjx96t2.js";
-import"./studio-zjjde71a.js";
-import"./studio-z2smx5ce.js";
-import"./studio-b7xacrwe.js";
-import"./studio-ab87phj1.js";
-import"./studio-gk2twyh4.js";
-import"./studio-wnsyffg1.js";
-import"./studio-m1p9b6c3.js";
-import"./studio-esrxgwh6.js";
-import"./studio-6gryj0sg.js";
-import"./studio-6nzaktvy.js";
-import"./studio-jt27ta6x.js";
-import"./studio-0j7r7s9g.js";
-import"./studio-1k325pwf.js";
-import"./studio-d1n2bykn.js";
-import"./studio-yxa81f45.js";
-import"./studio-3ntvq6cg.js";
-import"./studio-d8z5bajd.js";
-import"./studio-tjjk7jvk.js";
-export {
-  inspectorTab2 as inspectorTab,
-  mount2 as mount,
-  render2 as render,
-  setInspectorTab2 as setInspectorTab,
-  unmount2 as unmount
-};
-
-//# debugId=ACC2FC3785A3466764756E2164756E21
-//# sourceMappingURL=right-panel-889vbnm5.js.map

package/dist/chunks/studio-727xh0e3.js

@@ -1,76 +0,0 @@
-// ../collab/src/ops.ts
-function jsonClone(value) {
-  return JSON.parse(JSON.stringify(value));
-}
-function cloneValue2(v) {
-  return v === undefined || v === null ? v : jsonClone(v);
-}
-function getNodeAtPath3(doc, path) {
-  let node = doc;
-  for (const key of path) {
-    if (node == null) {
-      return;
-    }
-    node = node[key];
-  }
-  return node;
-}
-function childArray2(node) {
-  if (Array.isArray(node)) {
-    throw new TypeError("Cannot insert into a children array; parentPath must point at a node");
-  }
-  if (!node.children) {
-    node.children = [];
-  }
-  if (!Array.isArray(node.children)) {
-    throw new TypeError("Cannot insert into mapped-array children; edit the map template instead");
-  }
-  return node.children;
-}
-function applyDocOpToDoc2(doc, op) {
-  switch (op.op) {
-    case "set-key": {
-      const node = getNodeAtPath3(doc, op.path);
-      if (!node) {
-        throw new Error(`doc-op-node-not-found:${op.path.join("/")}`);
-      }
-      const target = node;
-      if (op.value === undefined) {
-        delete target[op.key];
-      } else {
-        target[op.key] = cloneValue2(op.value);
-      }
-      return;
-    }
-    case "insert-child": {
-      const parent = getNodeAtPath3(doc, op.parentPath);
-      childArray2(parent).splice(op.index, 0, cloneValue2(op.node));
-      return;
-    }
-    case "remove-child": {
-      const parent = getNodeAtPath3(doc, op.parentPath);
-      childArray2(parent).splice(op.index, 1);
-      return;
-    }
-    case "set-child": {
-      const parent = getNodeAtPath3(doc, op.parentPath);
-      childArray2(parent).splice(op.index, 1, cloneValue2(op.node));
-      return;
-    }
-    case "move-child": {
-      const fromParent = getNodeAtPath3(doc, op.fromParentPath);
-      const toParent = getNodeAtPath3(doc, op.toParentPath);
-      const [node] = childArray2(fromParent).splice(op.fromIndex, 1);
-      childArray2(toParent).splice(op.toIndex, 0, node);
-      return;
-    }
-    default: {
-      throw new Error(`unknown-doc-op:${op.op}`);
-    }
-  }
-}
-
-export { cloneValue2, getNodeAtPath3, childArray2, applyDocOpToDoc2 };
-
-//# debugId=32556033BC6FC83D64756E2164756E21
-//# sourceMappingURL=studio-727xh0e3.js.map