@jxsuite/studio 2.4.0 → 2.4.1

package/dist/iframe-entry.js

@@ -3480,6 +3480,16 @@ function getPath2(obj, path) {
   return readPath(obj, path);
 }
 var _privatePropWarned = new Set;
+function instanceSupplies(el, key) {
+  if (Object.hasOwn(el, key)) {
+    return true;
+  }
+  if (el.hasAttribute(key)) {
+    return true;
+  }
+  const kebab = key.replaceAll(/[A-Z]/gu, (c) => `-${c.toLowerCase()}`);
+  return kebab !== key && el.hasAttribute(kebab);
+}
 function refusePrivateProp(key, where) {
   if (!isPrivateStateKey(key)) {
     return false;
@@ -3630,7 +3640,7 @@ async function defineElement(source, baseUrl) {
         if (isPrivateStateKey(key)) {
           continue;
         }
-        if (key in this && this[key] !== undefined) {
+        if (key in this && this[key] !== undefined && instanceSupplies(this, key)) {
           state[key] = this[key];
         }
       }
@@ -4199,6 +4209,8 @@ function injectHead(doc) {
   }
 }
 function makeStamper(ctx) {
+  const islands = [];
+  const insideIsland = (path) => islands.some((island) => path.length > island.length && island.every((seg, i) => path[i] === seg));
   return (created, path, def2) => {
     if (!(created instanceof HTMLElement)) {
       return;
@@ -4207,8 +4219,10 @@ function makeStamper(ctx) {
     if (isDefinitionRoot) {
       created.dataset.jxDefinitionRoot = "";
     }
-    if (!isDefinitionRoot && created.tagName.includes("-") && isEditableMode(ctx.canvasMode)) {
+    const isIsland = !isDefinitionRoot && created.tagName.includes("-") && isEditableMode(ctx.canvasMode);
+    if (isIsland) {
       created.contentEditable = "false";
+      islands.push(path);
     }
     const classified = classifyRenderNode(path, def2, ctx);
     if (classified.kind === "layout") {
@@ -4225,6 +4239,9 @@ function makeStamper(ctx) {
       return;
     }
     created.dataset.jxPath = serializeJxPath(classified.path);
+    if (!isIsland && isEditableMode(ctx.canvasMode) && insideIsland(path)) {
+      created.contentEditable = "true";
+    }
   };
 }
 function installCanvasImageRetry(root, maxAttempts = 3) {
@@ -5188,6 +5205,7 @@ var insertFn = null;
 var endFn = null;
 var _plainMode = false;
 var _plainOriginal = "";
+var _plainPosted = false;
 var editableVerdicts = null;
 function setEditableVerdicts(verdicts) {
   editableVerdicts = verdicts;
@@ -5207,6 +5225,7 @@ function startEditing(el, path, callbacks, opts) {
   endFn = callbacks.onEnd;
   _plainMode = opts?.plainText === true;
   _plainOriginal = _plainMode ? el.textContent ?? "" : "";
+  _plainPosted = false;
   el.dataset.jxActiveBlock = "";
   if (_plainMode) {
     try {
@@ -5240,6 +5259,7 @@ function stopEditing(silent = false) {
   insertFn = null;
   _plainMode = false;
   _plainOriginal = "";
+  _plainPosted = false;
   if (silent) {
     endFn = null;
   } else if (endFn) {
@@ -5251,6 +5271,9 @@ function stopEditing(silent = false) {
 function commitActiveBlock() {
   commitChanges(true);
 }
+function isPlainSession() {
+  return _plainMode && activeEl !== null;
+}
 function isEditing() {
   return activeEl !== null;
 }
@@ -5336,6 +5359,7 @@ function releaseWithoutCommit() {
   insertFn = null;
   _plainMode = false;
   _plainOriginal = "";
+  _plainPosted = false;
   if (endFn) {
     const fn = endFn;
     endFn = null;
@@ -5347,8 +5371,14 @@ function commitChanges(inPlace) {
     return;
   }
   if (_plainMode) {
-    commitFn(activePath, null, (activeEl.textContent ?? "").replaceAll(`
-`, " "), inPlace);
+    const text = (activeEl.textContent ?? "").replaceAll(`
+`, " ");
+    if (text === _plainOriginal.replaceAll(`
+`, " ") && !_plainPosted) {
+      return;
+    }
+    _plainPosted = true;
+    commitFn(activePath, null, text, inPlace);
     return;
   }
   normalizeInlineContent(activeEl);
@@ -5471,6 +5501,9 @@ function openSlashMenu(opts) {
   if (!activeEl || !insertFn || !activePath) {
     return;
   }
+  if (_plainMode) {
+    return;
+  }
   const sel = window.getSelection();
   if (!sel || !sel.rangeCount) {
     return;
@@ -5986,6 +6019,7 @@ var INSERT_TEXT = new Set([
   "insertTranspose"
 ]);
 var NATIVE_FORMAT_PREFIX = "format";
+var PROP_STRUCTURAL = new Set(["insertParagraph", "insertLineBreak"]);
 function classifyBeforeInput(ctx) {
   const { inputType, from, to } = ctx;
   if (inputType === "insertCompositionText" || inputType === "insertFromComposition") {
@@ -6000,6 +6034,9 @@ function classifyBeforeInput(ctx) {
   if (inputType === "insertFromDrop" || inputType === "deleteByDrag") {
     return { kind: "reject" };
   }
+  if (ctx.inPropHost) {
+    return PROP_STRUCTURAL.has(inputType) ? { kind: "reject" } : { kind: "native" };
+  }
   if (!from || !to) {
     return { kind: "reject" };
   }
@@ -6107,6 +6144,11 @@ function startEditableRoot(container, deps) {
     composing = false;
     scheduleCommitTick();
   };
+  const forget = () => {
+    cancelCommitTick();
+    activeEl2 = null;
+    activeKey = null;
+  };
   const deactivate = () => {
     if (!activeEl2) {
       return;
@@ -6181,6 +6223,7 @@ function startEditableRoot(container, deps) {
       atBlockStart: resolved ? isAtBlockStart(resolved.from) : false,
       data: e.data ?? "",
       from: resolved?.from ?? null,
+      inPropHost: activeEl2 !== null && activeKey === null,
       inputType: e.inputType,
       to: resolved?.to ?? null
     });
@@ -6251,6 +6294,7 @@ function startEditableRoot(container, deps) {
   doc.addEventListener("pointerdown", onPointerDownCapture, true);
   return {
     capture: () => captureDocSelection(container, deps.isEditableBlock),
+    forget,
     isComposing: () => composing,
     flush: () => {
       if (composing) {
@@ -6746,14 +6790,18 @@ function startIframeInlineEdit(channel, container, opts) {
       return true;
     }
     const node = getNodeAtPath(shadowDoc, hostPath);
+    const attrs = node?.attributes;
+    if (attrs?.[`props.${prop}`] !== undefined || attrs?.[prop] !== undefined) {
+      return false;
+    }
     const raw = node?.$props?.[prop];
     if (raw == null) {
       return true;
     }
-    if (typeof raw === "object") {
+    if (typeof raw !== "string") {
       return false;
     }
-    return !(typeof raw === "string" && raw.includes("${"));
+    return !raw.includes("${");
   };
   const enterPropEditAt = (el, hostPath, prop) => {
     channel.post({ kind: "editStart", path: hostPath, prop });
@@ -6768,6 +6816,7 @@ function startIframeInlineEdit(channel, container, opts) {
       onEnd: () => {
         clearHighlight();
         lastNonEmptyRange = null;
+        root.forget();
         channel.post({ kind: "editEnd" });
       },
       onInsert: () => {},
@@ -6779,6 +6828,9 @@ function startIframeInlineEdit(channel, container, opts) {
     if (!el) {
       return;
     }
+    if (isPlainSession()) {
+      return;
+    }
     if (lastNonEmptyRange && lastNonEmptyRange.startContainer.isConnected && el.contains(lastNonEmptyRange.commonAncestorContainer)) {
       const sel = window.getSelection();
       el.focus();
@@ -6893,6 +6945,14 @@ function startIframeInlineEdit(channel, container, opts) {
     if (!editingAllowed()) {
       return;
     }
+    if (msg.prop !== undefined) {
+      const instance = elementForPath2(container, msg.path);
+      const marker = instance?.querySelector(`[data-jx-bound-prop="${CSS.escape(msg.prop)}"]`);
+      if (marker) {
+        activateProp(marker);
+      }
+      return;
+    }
     const el = elementForPath2(container, msg.path);
     if (el && isEditableBlock(el)) {
       root.placeCaret({ offset: msg.offset ?? 0, path: msg.path });
@@ -8170,5 +8230,5 @@ export {
   startCanvasIframe
 };
 
-//# debugId=4B2F6890CDE12A9464756E2164756E21
+//# debugId=8BEF1FC0BD88A0F164756E2164756E21
 //# sourceMappingURL=iframe-entry.js.map

package/dist/studio.js

@@ -1,6 +1,6 @@
 import {
   seedPublishConnected
-} from "./chunks/studio-tqr02xaa.js";
+} from "./chunks/studio-qymkxbcq.js";
 import"./chunks/studio-wdt9y92a.js";
 import {
   ElementResolutionController,
@@ -67,7 +67,7 @@ import {
   registerStyleCommands,
   render as render3,
   setInspectorTab
-} from "./chunks/studio-8x4399kc.js";
+} from "./chunks/studio-1d6bm7eg.js";
 import {
   CommandUnavailableError,
   chordFromEvent,
@@ -99,7 +99,7 @@ import {
   showSlashMenu,
   showSlashMenuAtRect,
   suppressBlockActionBar
-} from "./chunks/studio-377bbhtz.js";
+} from "./chunks/studio-qb6vy1z1.js";
 import {
   addableContexts,
   defaultCommands,
@@ -111,7 +111,7 @@ import {
   tokenLabel,
   transposeStylebookStyle,
   writeTokenOverride
-} from "./chunks/studio-yz06mkfj.js";
+} from "./chunks/studio-gfzyxa0m.js";
 import {
   DERIVE_PRESETS,
   JxColorPopover,
@@ -144,7 +144,7 @@ import {
   spNumberField,
   spTextArea,
   spTextField
-} from "./chunks/studio-ng5gbxkj.js";
+} from "./chunks/studio-n9k15qdg.js";
 import {
   LitElement,
   css
@@ -160,7 +160,7 @@ import {
 import {
   initQuickSearch,
   openQuickSearch
-} from "./chunks/studio-qd4k0h80.js";
+} from "./chunks/studio-9sxn0eaa.js";
 import {
   addRecentProject,
   clearRecentProjects,
@@ -187,10 +187,10 @@ import {
   removeRecentProject,
   renderFilesTemplate,
   seedEntry
-} from "./chunks/studio-1dgqagzz.js";
+} from "./chunks/studio-jand3kjg.js";
 import {
   computeWindow
-} from "./chunks/studio-kwavhmdr.js";
+} from "./chunks/studio-91sdrn9x.js";
 import {
   autoSyncProjectOnOpen,
   cleanupGitPanel,
@@ -211,13 +211,13 @@ import {
   registerSourceControlCommands,
   renderGitPanel,
   stripRange
-} from "./chunks/studio-q07vj7p9.js";
+} from "./chunks/studio-tdt7b6qb.js";
 import {
   createPanelScheduler
 } from "./chunks/studio-8jpzqk5s.js";
 import {
   selectContributedEntry
-} from "./chunks/studio-rdsvb808.js";
+} from "./chunks/studio-rz861p2b.js";
 import {
   notifySettingsDocument,
   onSettingsDocumentChanged,
@@ -238,7 +238,7 @@ import {
   renderForm,
   renderProvenanceChip,
   resolveContextPointer
-} from "./chunks/studio-ky68mp85.js";
+} from "./chunks/studio-rkr6pm84.js";
 import {
   validateDoc,
   validateProjectConfig
@@ -263,7 +263,7 @@ import {
   registerGridCommands,
   scanLibrary,
   uploadDirForCategory
-} from "./chunks/studio-0evba9z5.js";
+} from "./chunks/studio-4m39t01b.js";
 import {
   live
 } from "./chunks/studio-c31yb4t6.js";
@@ -307,7 +307,7 @@ import {
   setIncludeDrafts,
   startFsSync,
   writesForTurn
-} from "./chunks/studio-wxthr2x1.js";
+} from "./chunks/studio-gqpbrrj5.js";
 import"./chunks/studio-2w11grav.js";
 import"./chunks/studio-bw5dz6km.js";
 import {
@@ -316,18 +316,18 @@ import {
   isImage,
   setMediaChangedHandler,
   uploadAssets
-} from "./chunks/studio-102jzb8r.js";
+} from "./chunks/studio-0svvdm0a.js";
 import {
   beginActivity,
   registerActivityPanel,
   showProgressModal
-} from "./chunks/studio-eqyybj2e.js";
+} from "./chunks/studio-d1f2rqxh.js";
 import {
   currentDeploy,
   latestDeployment,
   noteDeployment,
   platformSupportsPublish
-} from "./chunks/studio-53dn6e6t.js";
+} from "./chunks/studio-675v08qj.js";
 import {
   CATEGORIES,
   SPAN_FULL_RENDER,
@@ -439,7 +439,7 @@ import {
   timeSpan,
   timeSpanAsync,
   updateActivePanelHeaders
-} from "./chunks/studio-yk7037sg.js";
+} from "./chunks/studio-h6553a8h.js";
 import {
   BOTTOM_TAB_IDS,
   BUFFER_COMMIT,
@@ -606,7 +606,7 @@ import {
   updateSiteConfig,
   view,
   workspace
-} from "./chunks/studio-ddgrc5hs.js";
+} from "./chunks/studio-kfq9ed73.js";
 import {
   classMap,
   ifDefined,
@@ -669,7 +669,7 @@ import {
   mountStillWanted,
   refreshExtensionUi,
   refreshFormats
-} from "./chunks/studio-6gcrk1bq.js";
+} from "./chunks/studio-40fm3hyr.js";
 import {
   getPlatform,
   hasPlatform,
@@ -16807,7 +16807,7 @@ function entryIdsFor(collection) {
   if (known) {
     return known;
   }
-  const pending = import("./chunks/content-source-jrvn5vwy.js").then((m) => m.listCollectionEntryIds(collection));
+  const pending = import("./chunks/content-source-cn9te96r.js").then((m) => m.listCollectionEntryIds(collection));
   entryIdCache.set(collection, pending);
   return pending;
 }
@@ -17068,7 +17068,7 @@ function renderEntryMode(surface, tab) {
   });
 }
 async function openEntryEditor(path) {
-  const { openFileInTab: openFileInTab2 } = await import("./chunks/files-jdbtammm.js");
+  const { openFileInTab: openFileInTab2 } = await import("./chunks/files-dsh5g8j4.js");
   await openFileInTab2(path);
   for (const [id, tab] of workspace.tabs.entries()) {
     if (tab.documentPath !== path) {
@@ -17129,7 +17129,7 @@ async function createEntry(collectionName) {
     });
     return null;
   }
-  const { createFileIn: createFileIn2 } = await import("./chunks/files-jdbtammm.js");
+  const { createFileIn: createFileIn2 } = await import("./chunks/files-dsh5g8j4.js");
   const created = await createFileIn2({
     content,
     dir: collection.dir,
@@ -22349,7 +22349,7 @@ function groupProblems(records = problems) {
   return groups;
 }
 function openProblemPath(path) {
-  import("./chunks/files-jdbtammm.js").then((m) => m.openFileInTab(path));
+  import("./chunks/files-dsh5g8j4.js").then((m) => m.openFileInTab(path));
 }
 function actionTpl(record) {
   const id = record.action;
@@ -58591,9 +58591,9 @@ function renderDefsEditor(container) {
 
 // src/version.ts
 var APP_NAME = "Jx Studio";
-var VERSION = "2.4.0";
-var BUILD_DATE = "2026-08-23T19:11:17.175Z";
-var GIT_COMMIT = "bea72f9";
+var VERSION = "2.4.1";
+var BUILD_DATE = "2026-08-24T11:52:26.010Z";
+var GIT_COMMIT = "eb4fe5d";
 var LINKS = {
   github: "https://github.com/jxsuite/jx",
   docs: "https://github.com/jxsuite/jx#readme",
@@ -59670,7 +59670,7 @@ async function openProjectSettings(section) {
   showSettingsDocument();
   notifySettingsDocument();
   try {
-    const { syncExtensionSettingsSections } = await import("./chunks/extension-sections-2zjyty05.js");
+    const { syncExtensionSettingsSections } = await import("./chunks/extension-sections-mdgmqrry.js");
     await syncExtensionSettingsSections();
   } catch (error) {
     notify.warn(`Could not load extension settings sections — ${errorMessage(error)}`, {
@@ -60294,7 +60294,7 @@ function publishCommands() {
         name: "set_up_publishing"
       },
       run: async () => {
-        const { openPublishPanel } = await import("./chunks/publish-panel-2we6smjv.js");
+        const { openPublishPanel } = await import("./chunks/publish-panel-b0xh7b4y.js");
         openPublishPanel();
       },
       title: "Set Up Publishing"
@@ -61016,7 +61016,7 @@ function i18nCommands() {
           });
           return;
         }
-        const { openFileInTab: openFileInTab2 } = await import("./chunks/files-jdbtammm.js");
+        const { openFileInTab: openFileInTab2 } = await import("./chunks/files-dsh5g8j4.js");
         await openFileInTab2(path);
       },
       title: "Open Translation"
@@ -61063,7 +61063,7 @@ function i18nCommands() {
           return;
         }
         const cut = path.lastIndexOf("/");
-        const { createFileIn: createFileIn2, openFileInTab: openFileInTab2 } = await import("./chunks/files-jdbtammm.js");
+        const { createFileIn: createFileIn2, openFileInTab: openFileInTab2 } = await import("./chunks/files-dsh5g8j4.js");
         const created = await createFileIn2({
           content,
           dir: cut === -1 ? "." : path.slice(0, cut),
@@ -61876,5 +61876,5 @@ export {
   hasUnsavedTabs
 };
 
-//# debugId=5769FAD30A86F19564756E2164756E21
+//# debugId=C20E21297FE0976064756E2164756E21
 //# sourceMappingURL=studio.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jxsuite/studio",
-  "version": "2.4.0",
+  "version": "2.4.1",
   "description": "Jx Studio — visual builder for Jx documents",
   "license": "MIT",
   "repository": {
@@ -59,11 +59,11 @@
     "@atlaskit/pragmatic-drag-and-drop-hitbox": "^2.1.0",
     "@jxsuite/ai": "^0.36.2",
     "@jxsuite/collab": "^0.8.1",
-    "@jxsuite/create": "^1.3.4",
-    "@jxsuite/formulas": "^0.0.10",
+    "@jxsuite/create": "^1.3.5",
+    "@jxsuite/formulas": "^0.0.11",
     "@jxsuite/markup": "^0.4.5",
     "@jxsuite/protocol": "^1.2.0",
-    "@jxsuite/runtime": "^2.0.3",
+    "@jxsuite/runtime": "^2.0.4",
     "@jxsuite/schema": "^1.8.0",
     "@spectrum-web-components/accordion": "^1.12.2",
     "@spectrum-web-components/action-bar": "1.12.2",

package/src/canvas/editable-actions.ts

@@ -49,6 +49,15 @@ export interface BeforeInputContext {
   atBlockEnd: boolean;
   /** The event's `data` (inserted text), empty for deletions. */
   data: string;
+  /**
+   * The caret is in a PROP-BOUND nested host — text inside a component instance that is an
+   * invertible prop binding (studio.md §8.2.5), not a block of the page document.
+   *
+   * Such a host has no `data-jx-path` of its own, so `from`/`to` are always null for it. Without
+   * this flag the null-position rule below rejected every keystroke: the caret appeared, and
+   * nothing typed into a component slot ever landed.
+   */
+  inPropHost: boolean;
 }
 
 /**
@@ -91,6 +100,20 @@ const INSERT_TEXT = new Set([
  */
 const NATIVE_FORMAT_PREFIX = "format";
 
+/**
+ * Intents refused inside a prop-bound host, because a prop value is ONE PLAIN STRING.
+ *
+ * `docs/studio/editing/writing.md` puts it as "paragraph splits are off": there is no second block
+ * for Enter to make, and a `<br>` would serialise into a value that is supposed to be a single
+ * line. Everything else — insert, delete, paste, cut, IME — is ordinary text editing on a
+ * `plaintext-only` host and runs natively.
+ *
+ * These are refused rather than re-expressed: Enter FINISHES the edit (handled as a keystroke by
+ * the editing engine, not as an input event), so the chokepoint's only job is to stop the browser
+ * inserting the newline first.
+ */
+const PROP_STRUCTURAL = new Set(["insertParagraph", "insertLineBreak"]);
+
 /**
  * Classify one `beforeinput`.
  *
@@ -124,7 +147,20 @@ export function classifyBeforeInput(ctx: BeforeInputContext): EditAction {
     return { kind: "reject" };
   }
 
-  // 2. No resolvable position means the caret is in canvas chrome or a `contenteditable="false"`
+  /*
+   * 2. A prop-bound host is editable text with NO document path — it is written back as a prop
+   * value by its own commit (`editCommitProp`), not as a block. It must be judged before the
+   * null-position rule below, which would otherwise reject it for having no path: that is exactly
+   * what made a component slot show a caret and swallow every keystroke.
+   *
+   * Nothing here is structural, so nothing is re-expressed; the browser edits the text and the
+   * session commits the string.
+   */
+  if (ctx.inPropHost) {
+    return PROP_STRUCTURAL.has(inputType) ? { kind: "reject" } : { kind: "native" };
+  }
+
+  // 3. No resolvable position means the caret is in canvas chrome or a `contenteditable="false"`
   // Island — there is no document node to write to.
   if (!from || !to) {
     return { kind: "reject" };

package/src/canvas/iframe-editable-root.ts

@@ -134,6 +134,12 @@ export function restoreDocSelection(container: HTMLElement, range: DocRange): bo
 export interface EditableRootHandle {
   /** Tear the host down. */
   stop: () => void;
+  /**
+   * Forget the active element without committing or notifying — for when the EDITING ENGINE has
+   * already ended the session itself (Enter / Escape in a prop host) and only this module's
+   * bookkeeping is left pointing at it.
+   */
+  forget: () => void;
   /**
    * Re-derive the active block from the live selection. Call after moving the selection
    * programmatically — `selectionchange` is dispatched as a task, so a caller that needs the
@@ -242,6 +248,23 @@ export function startEditableRoot(
     scheduleCommitTick();
   };
 
+  /**
+   * Drop the active element WITHOUT telling the engine — the engine is what asked.
+   *
+   * `deactivate()` exists for the caret leaving, and calls `onDeactivate` to commit on the way out.
+   * When the ENGINE ends a session itself (Enter or Escape in a prop host), that has already
+   * happened, and calling back into it would re-enter a teardown that is mid-flight. What was
+   * missing was the other half: nothing cleared `activeEl`/`activeKey`, so the host kept pointing
+   * at a dead session — `onPointerDownCapture`'s `el !== activeEl` guard was then false and the
+   * next click on the same text did nothing at all, and `inPropHost` stayed true with no session
+   * behind it.
+   */
+  const forget = () => {
+    cancelCommitTick();
+    activeEl = null;
+    activeKey = null;
+  };
+
   /** Release whatever is active, if anything. */
   const deactivate = () => {
     if (!activeEl) {
@@ -358,6 +381,9 @@ export function startEditableRoot(
       atBlockStart: resolved ? isAtBlockStart(resolved.from) : false,
       data: e.data ?? "",
       from: resolved?.from ?? null,
+      /* An adopted element with no path IS the prop-bound host — `onPointerDownCapture` sets
+         exactly that pair, and `syncActiveBlock` preserves it while the caret stays inside. */
+      inPropHost: activeEl !== null && activeKey === null,
       inputType: e.inputType,
       to: resolved?.to ?? null,
     });
@@ -456,6 +482,7 @@ export function startEditableRoot(
 
   return {
     capture: () => captureDocSelection(container, deps.isEditableBlock),
+    forget,
     /** Whether an IME composition is in flight — callers must not rewrite the DOM under it. */
     isComposing: () => composing,
     flush: () => {