@jxsuite/studio 0.23.2 → 0.25.0

package/dist/studio.js

@@ -194710,12 +194710,12 @@ var init_reactivity_esm_bundler = __esm(() => {
   shallowReadonlyMap = /* @__PURE__ */ new WeakMap;
 });
 
-// src/reactivity.js
+// src/reactivity.ts
 var init_reactivity = __esm(() => {
   init_reactivity_esm_bundler();
 });
 
-// src/tabs/tab.js
+// src/tabs/tab.ts
 function createDefaultUi() {
   return {
     rightTab: "properties",
@@ -194800,7 +194800,7 @@ var init_tab = __esm(() => {
   ALL_MODES = ["edit", "design", "preview", "source", "stylebook"];
 });
 
-// src/workspace/workspace.js
+// src/workspace/workspace.ts
 function openTab(opts) {
   const tab = createTab(opts);
   workspace.tabs.set(tab.id, tab);
@@ -194887,7 +194887,7 @@ var init_workspace2 = __esm(() => {
   activeTab = computed(() => workspace.activeTabId ? workspace.tabs.get(workspace.activeTabId) ?? null : null);
 });
 
-// src/state.js
+// src/state.ts
 function getNodeAtPath(doc, path) {
   let node = doc;
   for (const key of path) {
@@ -194933,7 +194933,12 @@ function flattenTree(doc, path = [], depth = 0) {
       rows.push(...flattenTree(children[i2], childPath, depth + 1));
     }
   } else if (children && typeof children === "object" && children.$prototype === "Array") {
-    rows.push({ node: children, path: [...path, "children"], depth: depth + 1, nodeType: "map" });
+    rows.push({
+      node: children,
+      path: [...path, "children"],
+      depth: depth + 1,
+      nodeType: "map"
+    });
     const mapDef = children.map;
     if (mapDef && typeof mapDef === "object") {
       rows.push(...flattenTree(mapDef, [...path, "children", "map"], depth + 2));
@@ -194943,9 +194948,19 @@ function flattenTree(doc, path = [], depth = 0) {
     for (const [caseName, caseDef] of Object.entries(doc.cases)) {
       const casePath = [...path, "cases", caseName];
       if (caseDef && typeof caseDef === "object" && caseDef.$ref) {
-        rows.push({ node: caseDef, path: casePath, depth: depth + 1, nodeType: "case-ref" });
+        rows.push({
+          node: caseDef,
+          path: casePath,
+          depth: depth + 1,
+          nodeType: "case-ref"
+        });
       } else if (caseDef && typeof caseDef === "object") {
-        rows.push({ node: caseDef, path: casePath, depth: depth + 1, nodeType: "case" });
+        rows.push({
+          node: caseDef,
+          path: casePath,
+          depth: depth + 1,
+          nodeType: "case"
+        });
         const caseChildren = flattenTree(caseDef, casePath, depth + 2);
         rows.push(...caseChildren.slice(1));
       }
@@ -194979,7 +194994,7 @@ function requireProjectState() {
 }
 var projectState = null;
 
-// src/store.js
+// src/store.ts
 function initShellRefs() {
   canvasWrap = document.querySelector("#canvas-wrap");
   activityBar = document.querySelector("#activity-bar");
@@ -195059,20 +195074,19 @@ function renderOnly(...names) {
 function updateSession(patch) {
   const tab = activeTab.value;
   if (tab) {
-    const p = patch;
-    if (p.selection !== undefined)
-      tab.session.selection = p.selection;
-    if (p.hover !== undefined)
-      tab.session.hover = p.hover;
-    if (p.clipboard !== undefined)
-      tab.session.clipboard = p.clipboard;
-    if (p.ui) {
-      for (const [k, v] of Object.entries(p.ui)) {
+    if (patch.selection !== undefined)
+      tab.session.selection = patch.selection;
+    if (patch.hover !== undefined)
+      tab.session.hover = patch.hover;
+    if (patch.clipboard !== undefined)
+      tab.session.clipboard = patch.clipboard;
+    if (patch.ui) {
+      for (const [k, v] of Object.entries(patch.ui)) {
         tab.session.ui[k] = v;
       }
     }
-    if (p.canvas) {
-      for (const [k, v] of Object.entries(p.canvas)) {
+    if (patch.canvas) {
+      for (const [k, v] of Object.entries(patch.canvas)) {
         tab.session.canvas[k] = v;
       }
     }
@@ -196343,7 +196357,7 @@ var require_dist = __commonJS((exports) => {
   } });
 });
 
-// src/platform.js
+// src/platform.ts
 function registerPlatform(platform3) {
   g.__jxPlatform = platform3;
 }
@@ -196360,7 +196374,7 @@ var init_platform3 = __esm(() => {
   g = globalThis;
 });
 
-// src/files/components.js
+// src/files/components.ts
 var exports_components = {};
 __export(exports_components, {
   loadComponentRegistry: () => loadComponentRegistry,
@@ -225734,7 +225748,1201 @@ var init_hast_util_whitespace = __esm(() => {
   init_lib29();
 });
 
-// ../parser/src/html-to-jx.js
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/util/schema.js
+class Schema4 {
+  constructor(property, normal, space) {
+    this.normal = normal;
+    this.property = property;
+    if (space) {
+      this.space = space;
+    }
+  }
+}
+var init_schema2 = __esm(() => {
+  Schema4.prototype.normal = {};
+  Schema4.prototype.property = {};
+  Schema4.prototype.space = undefined;
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/util/merge.js
+function merge3(definitions, space) {
+  const property = {};
+  const normal = {};
+  for (const definition3 of definitions) {
+    Object.assign(property, definition3.property);
+    Object.assign(normal, definition3.normal);
+  }
+  return new Schema4(property, normal, space);
+}
+var init_merge2 = __esm(() => {
+  init_schema2();
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/normalize.js
+function normalize5(value2) {
+  return value2.toLowerCase();
+}
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/util/info.js
+class Info2 {
+  constructor(property, attribute) {
+    this.attribute = attribute;
+    this.property = property;
+  }
+}
+var init_info2 = __esm(() => {
+  Info2.prototype.attribute = "";
+  Info2.prototype.booleanish = false;
+  Info2.prototype.boolean = false;
+  Info2.prototype.commaOrSpaceSeparated = false;
+  Info2.prototype.commaSeparated = false;
+  Info2.prototype.defined = false;
+  Info2.prototype.mustUseProperty = false;
+  Info2.prototype.number = false;
+  Info2.prototype.overloadedBoolean = false;
+  Info2.prototype.property = "";
+  Info2.prototype.spaceSeparated = false;
+  Info2.prototype.space = undefined;
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/util/types.js
+var exports_types2 = {};
+__export(exports_types2, {
+  spaceSeparated: () => spaceSeparated2,
+  overloadedBoolean: () => overloadedBoolean2,
+  number: () => number2,
+  commaSeparated: () => commaSeparated2,
+  commaOrSpaceSeparated: () => commaOrSpaceSeparated2,
+  booleanish: () => booleanish2,
+  boolean: () => boolean3
+});
+function increment2() {
+  return 2 ** ++powers2;
+}
+var powers2 = 0, boolean3, booleanish2, overloadedBoolean2, number2, spaceSeparated2, commaSeparated2, commaOrSpaceSeparated2;
+var init_types5 = __esm(() => {
+  boolean3 = increment2();
+  booleanish2 = increment2();
+  overloadedBoolean2 = increment2();
+  number2 = increment2();
+  spaceSeparated2 = increment2();
+  commaSeparated2 = increment2();
+  commaOrSpaceSeparated2 = increment2();
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/util/defined-info.js
+function mark2(values2, key, value2) {
+  if (value2) {
+    values2[key] = value2;
+  }
+}
+var checks2, DefinedInfo2;
+var init_defined_info2 = __esm(() => {
+  init_info2();
+  init_types5();
+  checks2 = Object.keys(exports_types2);
+  DefinedInfo2 = class DefinedInfo2 extends Info2 {
+    constructor(property, attribute, mask, space) {
+      let index2 = -1;
+      super(property, attribute);
+      mark2(this, "space", space);
+      if (typeof mask === "number") {
+        while (++index2 < checks2.length) {
+          const check = checks2[index2];
+          mark2(this, checks2[index2], (mask & exports_types2[check]) === exports_types2[check]);
+        }
+      }
+    }
+  };
+  DefinedInfo2.prototype.defined = true;
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/util/create.js
+function create5(definition3) {
+  const properties = {};
+  const normals = {};
+  for (const [property, value2] of Object.entries(definition3.properties)) {
+    const info = new DefinedInfo2(property, definition3.transform(definition3.attributes || {}, property), value2, definition3.space);
+    if (definition3.mustUseProperty && definition3.mustUseProperty.includes(property)) {
+      info.mustUseProperty = true;
+    }
+    properties[property] = info;
+    normals[normalize5(property)] = property;
+    normals[normalize5(info.attribute)] = property;
+  }
+  return new Schema4(properties, normals, definition3.space);
+}
+var init_create2 = __esm(() => {
+  init_defined_info2();
+  init_schema2();
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/aria.js
+var aria2;
+var init_aria4 = __esm(() => {
+  init_create2();
+  init_types5();
+  aria2 = create5({
+    properties: {
+      ariaActiveDescendant: null,
+      ariaAtomic: booleanish2,
+      ariaAutoComplete: null,
+      ariaBusy: booleanish2,
+      ariaChecked: booleanish2,
+      ariaColCount: number2,
+      ariaColIndex: number2,
+      ariaColSpan: number2,
+      ariaControls: spaceSeparated2,
+      ariaCurrent: null,
+      ariaDescribedBy: spaceSeparated2,
+      ariaDetails: null,
+      ariaDisabled: booleanish2,
+      ariaDropEffect: spaceSeparated2,
+      ariaErrorMessage: null,
+      ariaExpanded: booleanish2,
+      ariaFlowTo: spaceSeparated2,
+      ariaGrabbed: booleanish2,
+      ariaHasPopup: null,
+      ariaHidden: booleanish2,
+      ariaInvalid: null,
+      ariaKeyShortcuts: null,
+      ariaLabel: null,
+      ariaLabelledBy: spaceSeparated2,
+      ariaLevel: number2,
+      ariaLive: null,
+      ariaModal: booleanish2,
+      ariaMultiLine: booleanish2,
+      ariaMultiSelectable: booleanish2,
+      ariaOrientation: null,
+      ariaOwns: spaceSeparated2,
+      ariaPlaceholder: null,
+      ariaPosInSet: number2,
+      ariaPressed: booleanish2,
+      ariaReadOnly: booleanish2,
+      ariaRelevant: null,
+      ariaRequired: booleanish2,
+      ariaRoleDescription: spaceSeparated2,
+      ariaRowCount: number2,
+      ariaRowIndex: number2,
+      ariaRowSpan: number2,
+      ariaSelected: booleanish2,
+      ariaSetSize: number2,
+      ariaSort: null,
+      ariaValueMax: number2,
+      ariaValueMin: number2,
+      ariaValueNow: number2,
+      ariaValueText: null,
+      role: null
+    },
+    transform(_, property) {
+      return property === "role" ? property : "aria-" + property.slice(4).toLowerCase();
+    }
+  });
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/util/case-sensitive-transform.js
+function caseSensitiveTransform2(attributes4, attribute) {
+  return attribute in attributes4 ? attributes4[attribute] : attribute;
+}
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/util/case-insensitive-transform.js
+function caseInsensitiveTransform2(attributes4, property) {
+  return caseSensitiveTransform2(attributes4, property.toLowerCase());
+}
+var init_case_insensitive_transform2 = () => {};
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/html.js
+var html7;
+var init_html4 = __esm(() => {
+  init_case_insensitive_transform2();
+  init_create2();
+  init_types5();
+  html7 = create5({
+    attributes: {
+      acceptcharset: "accept-charset",
+      classname: "class",
+      htmlfor: "for",
+      httpequiv: "http-equiv"
+    },
+    mustUseProperty: ["checked", "multiple", "muted", "selected"],
+    properties: {
+      abbr: null,
+      accept: commaSeparated2,
+      acceptCharset: spaceSeparated2,
+      accessKey: spaceSeparated2,
+      action: null,
+      allow: null,
+      allowFullScreen: boolean3,
+      allowPaymentRequest: boolean3,
+      allowUserMedia: boolean3,
+      alpha: boolean3,
+      alt: null,
+      as: null,
+      async: boolean3,
+      autoCapitalize: null,
+      autoComplete: spaceSeparated2,
+      autoFocus: boolean3,
+      autoPlay: boolean3,
+      blocking: spaceSeparated2,
+      capture: null,
+      charSet: null,
+      checked: boolean3,
+      cite: null,
+      className: spaceSeparated2,
+      closedBy: null,
+      colorSpace: null,
+      cols: number2,
+      colSpan: number2,
+      command: null,
+      commandFor: null,
+      content: null,
+      contentEditable: booleanish2,
+      controls: boolean3,
+      controlsList: spaceSeparated2,
+      coords: number2 | commaSeparated2,
+      crossOrigin: null,
+      data: null,
+      dateTime: null,
+      decoding: null,
+      default: boolean3,
+      defer: boolean3,
+      dir: null,
+      dirName: null,
+      disabled: boolean3,
+      download: overloadedBoolean2,
+      draggable: booleanish2,
+      encType: null,
+      enterKeyHint: null,
+      fetchPriority: null,
+      form: null,
+      formAction: null,
+      formEncType: null,
+      formMethod: null,
+      formNoValidate: boolean3,
+      formTarget: null,
+      headers: spaceSeparated2,
+      height: number2,
+      hidden: overloadedBoolean2,
+      high: number2,
+      href: null,
+      hrefLang: null,
+      htmlFor: spaceSeparated2,
+      httpEquiv: spaceSeparated2,
+      id: null,
+      imageSizes: null,
+      imageSrcSet: null,
+      inert: boolean3,
+      inputMode: null,
+      integrity: null,
+      is: null,
+      isMap: boolean3,
+      itemId: null,
+      itemProp: spaceSeparated2,
+      itemRef: spaceSeparated2,
+      itemScope: boolean3,
+      itemType: spaceSeparated2,
+      kind: null,
+      label: null,
+      lang: null,
+      language: null,
+      list: null,
+      loading: null,
+      loop: boolean3,
+      low: number2,
+      manifest: null,
+      max: null,
+      maxLength: number2,
+      media: null,
+      method: null,
+      min: null,
+      minLength: number2,
+      multiple: boolean3,
+      muted: boolean3,
+      name: null,
+      nonce: null,
+      noModule: boolean3,
+      noValidate: boolean3,
+      onAbort: null,
+      onAfterPrint: null,
+      onAuxClick: null,
+      onBeforeMatch: null,
+      onBeforePrint: null,
+      onBeforeToggle: null,
+      onBeforeUnload: null,
+      onBlur: null,
+      onCancel: null,
+      onCanPlay: null,
+      onCanPlayThrough: null,
+      onChange: null,
+      onClick: null,
+      onClose: null,
+      onContextLost: null,
+      onContextMenu: null,
+      onContextRestored: null,
+      onCopy: null,
+      onCueChange: null,
+      onCut: null,
+      onDblClick: null,
+      onDrag: null,
+      onDragEnd: null,
+      onDragEnter: null,
+      onDragExit: null,
+      onDragLeave: null,
+      onDragOver: null,
+      onDragStart: null,
+      onDrop: null,
+      onDurationChange: null,
+      onEmptied: null,
+      onEnded: null,
+      onError: null,
+      onFocus: null,
+      onFormData: null,
+      onHashChange: null,
+      onInput: null,
+      onInvalid: null,
+      onKeyDown: null,
+      onKeyPress: null,
+      onKeyUp: null,
+      onLanguageChange: null,
+      onLoad: null,
+      onLoadedData: null,
+      onLoadedMetadata: null,
+      onLoadEnd: null,
+      onLoadStart: null,
+      onMessage: null,
+      onMessageError: null,
+      onMouseDown: null,
+      onMouseEnter: null,
+      onMouseLeave: null,
+      onMouseMove: null,
+      onMouseOut: null,
+      onMouseOver: null,
+      onMouseUp: null,
+      onOffline: null,
+      onOnline: null,
+      onPageHide: null,
+      onPageShow: null,
+      onPaste: null,
+      onPause: null,
+      onPlay: null,
+      onPlaying: null,
+      onPopState: null,
+      onProgress: null,
+      onRateChange: null,
+      onRejectionHandled: null,
+      onReset: null,
+      onResize: null,
+      onScroll: null,
+      onScrollEnd: null,
+      onSecurityPolicyViolation: null,
+      onSeeked: null,
+      onSeeking: null,
+      onSelect: null,
+      onSlotChange: null,
+      onStalled: null,
+      onStorage: null,
+      onSubmit: null,
+      onSuspend: null,
+      onTimeUpdate: null,
+      onToggle: null,
+      onUnhandledRejection: null,
+      onUnload: null,
+      onVolumeChange: null,
+      onWaiting: null,
+      onWheel: null,
+      open: boolean3,
+      optimum: number2,
+      pattern: null,
+      ping: spaceSeparated2,
+      placeholder: null,
+      playsInline: boolean3,
+      popover: null,
+      popoverTarget: null,
+      popoverTargetAction: null,
+      poster: null,
+      preload: null,
+      readOnly: boolean3,
+      referrerPolicy: null,
+      rel: spaceSeparated2,
+      required: boolean3,
+      reversed: boolean3,
+      rows: number2,
+      rowSpan: number2,
+      sandbox: spaceSeparated2,
+      scope: null,
+      scoped: boolean3,
+      seamless: boolean3,
+      selected: boolean3,
+      shadowRootClonable: boolean3,
+      shadowRootCustomElementRegistry: boolean3,
+      shadowRootDelegatesFocus: boolean3,
+      shadowRootMode: null,
+      shadowRootSerializable: boolean3,
+      shape: null,
+      size: number2,
+      sizes: null,
+      slot: null,
+      span: number2,
+      spellCheck: booleanish2,
+      src: null,
+      srcDoc: null,
+      srcLang: null,
+      srcSet: null,
+      start: number2,
+      step: null,
+      style: null,
+      tabIndex: number2,
+      target: null,
+      title: null,
+      translate: null,
+      type: null,
+      typeMustMatch: boolean3,
+      useMap: null,
+      value: booleanish2,
+      width: number2,
+      wrap: null,
+      writingSuggestions: null,
+      align: null,
+      aLink: null,
+      archive: spaceSeparated2,
+      axis: null,
+      background: null,
+      bgColor: null,
+      border: number2,
+      borderColor: null,
+      bottomMargin: number2,
+      cellPadding: null,
+      cellSpacing: null,
+      char: null,
+      charOff: null,
+      classId: null,
+      clear: null,
+      code: null,
+      codeBase: null,
+      codeType: null,
+      color: null,
+      compact: boolean3,
+      declare: boolean3,
+      event: null,
+      face: null,
+      frame: null,
+      frameBorder: null,
+      hSpace: number2,
+      leftMargin: number2,
+      link: null,
+      longDesc: null,
+      lowSrc: null,
+      marginHeight: number2,
+      marginWidth: number2,
+      noResize: boolean3,
+      noHref: boolean3,
+      noShade: boolean3,
+      noWrap: boolean3,
+      object: null,
+      profile: null,
+      prompt: null,
+      rev: null,
+      rightMargin: number2,
+      rules: null,
+      scheme: null,
+      scrolling: booleanish2,
+      standby: null,
+      summary: null,
+      text: null,
+      topMargin: number2,
+      valueType: null,
+      version: null,
+      vAlign: null,
+      vLink: null,
+      vSpace: number2,
+      allowTransparency: null,
+      autoCorrect: null,
+      autoSave: null,
+      credentialless: boolean3,
+      disablePictureInPicture: boolean3,
+      disableRemotePlayback: boolean3,
+      exportParts: commaSeparated2,
+      part: spaceSeparated2,
+      prefix: null,
+      property: null,
+      results: number2,
+      security: null,
+      unselectable: null
+    },
+    space: "html",
+    transform: caseInsensitiveTransform2
+  });
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/svg.js
+var svg5;
+var init_svg2 = __esm(() => {
+  init_create2();
+  init_types5();
+  svg5 = create5({
+    attributes: {
+      accentHeight: "accent-height",
+      alignmentBaseline: "alignment-baseline",
+      arabicForm: "arabic-form",
+      baselineShift: "baseline-shift",
+      capHeight: "cap-height",
+      className: "class",
+      clipPath: "clip-path",
+      clipRule: "clip-rule",
+      colorInterpolation: "color-interpolation",
+      colorInterpolationFilters: "color-interpolation-filters",
+      colorProfile: "color-profile",
+      colorRendering: "color-rendering",
+      crossOrigin: "crossorigin",
+      dataType: "datatype",
+      dominantBaseline: "dominant-baseline",
+      enableBackground: "enable-background",
+      fillOpacity: "fill-opacity",
+      fillRule: "fill-rule",
+      floodColor: "flood-color",
+      floodOpacity: "flood-opacity",
+      fontFamily: "font-family",
+      fontSize: "font-size",
+      fontSizeAdjust: "font-size-adjust",
+      fontStretch: "font-stretch",
+      fontStyle: "font-style",
+      fontVariant: "font-variant",
+      fontWeight: "font-weight",
+      glyphName: "glyph-name",
+      glyphOrientationHorizontal: "glyph-orientation-horizontal",
+      glyphOrientationVertical: "glyph-orientation-vertical",
+      hrefLang: "hreflang",
+      horizAdvX: "horiz-adv-x",
+      horizOriginX: "horiz-origin-x",
+      horizOriginY: "horiz-origin-y",
+      imageRendering: "image-rendering",
+      letterSpacing: "letter-spacing",
+      lightingColor: "lighting-color",
+      markerEnd: "marker-end",
+      markerMid: "marker-mid",
+      markerStart: "marker-start",
+      maskType: "mask-type",
+      navDown: "nav-down",
+      navDownLeft: "nav-down-left",
+      navDownRight: "nav-down-right",
+      navLeft: "nav-left",
+      navNext: "nav-next",
+      navPrev: "nav-prev",
+      navRight: "nav-right",
+      navUp: "nav-up",
+      navUpLeft: "nav-up-left",
+      navUpRight: "nav-up-right",
+      onAbort: "onabort",
+      onActivate: "onactivate",
+      onAfterPrint: "onafterprint",
+      onBeforePrint: "onbeforeprint",
+      onBegin: "onbegin",
+      onCancel: "oncancel",
+      onCanPlay: "oncanplay",
+      onCanPlayThrough: "oncanplaythrough",
+      onChange: "onchange",
+      onClick: "onclick",
+      onClose: "onclose",
+      onCopy: "oncopy",
+      onCueChange: "oncuechange",
+      onCut: "oncut",
+      onDblClick: "ondblclick",
+      onDrag: "ondrag",
+      onDragEnd: "ondragend",
+      onDragEnter: "ondragenter",
+      onDragExit: "ondragexit",
+      onDragLeave: "ondragleave",
+      onDragOver: "ondragover",
+      onDragStart: "ondragstart",
+      onDrop: "ondrop",
+      onDurationChange: "ondurationchange",
+      onEmptied: "onemptied",
+      onEnd: "onend",
+      onEnded: "onended",
+      onError: "onerror",
+      onFocus: "onfocus",
+      onFocusIn: "onfocusin",
+      onFocusOut: "onfocusout",
+      onHashChange: "onhashchange",
+      onInput: "oninput",
+      onInvalid: "oninvalid",
+      onKeyDown: "onkeydown",
+      onKeyPress: "onkeypress",
+      onKeyUp: "onkeyup",
+      onLoad: "onload",
+      onLoadedData: "onloadeddata",
+      onLoadedMetadata: "onloadedmetadata",
+      onLoadStart: "onloadstart",
+      onMessage: "onmessage",
+      onMouseDown: "onmousedown",
+      onMouseEnter: "onmouseenter",
+      onMouseLeave: "onmouseleave",
+      onMouseMove: "onmousemove",
+      onMouseOut: "onmouseout",
+      onMouseOver: "onmouseover",
+      onMouseUp: "onmouseup",
+      onMouseWheel: "onmousewheel",
+      onOffline: "onoffline",
+      onOnline: "ononline",
+      onPageHide: "onpagehide",
+      onPageShow: "onpageshow",
+      onPaste: "onpaste",
+      onPause: "onpause",
+      onPlay: "onplay",
+      onPlaying: "onplaying",
+      onPopState: "onpopstate",
+      onProgress: "onprogress",
+      onRateChange: "onratechange",
+      onRepeat: "onrepeat",
+      onReset: "onreset",
+      onResize: "onresize",
+      onScroll: "onscroll",
+      onSeeked: "onseeked",
+      onSeeking: "onseeking",
+      onSelect: "onselect",
+      onShow: "onshow",
+      onStalled: "onstalled",
+      onStorage: "onstorage",
+      onSubmit: "onsubmit",
+      onSuspend: "onsuspend",
+      onTimeUpdate: "ontimeupdate",
+      onToggle: "ontoggle",
+      onUnload: "onunload",
+      onVolumeChange: "onvolumechange",
+      onWaiting: "onwaiting",
+      onZoom: "onzoom",
+      overlinePosition: "overline-position",
+      overlineThickness: "overline-thickness",
+      paintOrder: "paint-order",
+      panose1: "panose-1",
+      pointerEvents: "pointer-events",
+      referrerPolicy: "referrerpolicy",
+      renderingIntent: "rendering-intent",
+      shapeRendering: "shape-rendering",
+      stopColor: "stop-color",
+      stopOpacity: "stop-opacity",
+      strikethroughPosition: "strikethrough-position",
+      strikethroughThickness: "strikethrough-thickness",
+      strokeDashArray: "stroke-dasharray",
+      strokeDashOffset: "stroke-dashoffset",
+      strokeLineCap: "stroke-linecap",
+      strokeLineJoin: "stroke-linejoin",
+      strokeMiterLimit: "stroke-miterlimit",
+      strokeOpacity: "stroke-opacity",
+      strokeWidth: "stroke-width",
+      tabIndex: "tabindex",
+      textAnchor: "text-anchor",
+      textDecoration: "text-decoration",
+      textRendering: "text-rendering",
+      transformOrigin: "transform-origin",
+      typeOf: "typeof",
+      underlinePosition: "underline-position",
+      underlineThickness: "underline-thickness",
+      unicodeBidi: "unicode-bidi",
+      unicodeRange: "unicode-range",
+      unitsPerEm: "units-per-em",
+      vAlphabetic: "v-alphabetic",
+      vHanging: "v-hanging",
+      vIdeographic: "v-ideographic",
+      vMathematical: "v-mathematical",
+      vectorEffect: "vector-effect",
+      vertAdvY: "vert-adv-y",
+      vertOriginX: "vert-origin-x",
+      vertOriginY: "vert-origin-y",
+      wordSpacing: "word-spacing",
+      writingMode: "writing-mode",
+      xHeight: "x-height",
+      playbackOrder: "playbackorder",
+      timelineBegin: "timelinebegin"
+    },
+    properties: {
+      about: commaOrSpaceSeparated2,
+      accentHeight: number2,
+      accumulate: null,
+      additive: null,
+      alignmentBaseline: null,
+      alphabetic: number2,
+      amplitude: number2,
+      arabicForm: null,
+      ascent: number2,
+      attributeName: null,
+      attributeType: null,
+      azimuth: number2,
+      bandwidth: null,
+      baselineShift: null,
+      baseFrequency: null,
+      baseProfile: null,
+      bbox: null,
+      begin: null,
+      bias: number2,
+      by: null,
+      calcMode: null,
+      capHeight: number2,
+      className: spaceSeparated2,
+      clip: null,
+      clipPath: null,
+      clipPathUnits: null,
+      clipRule: null,
+      color: null,
+      colorInterpolation: null,
+      colorInterpolationFilters: null,
+      colorProfile: null,
+      colorRendering: null,
+      content: null,
+      contentScriptType: null,
+      contentStyleType: null,
+      crossOrigin: null,
+      cursor: null,
+      cx: null,
+      cy: null,
+      d: null,
+      dataType: null,
+      defaultAction: null,
+      descent: number2,
+      diffuseConstant: number2,
+      direction: null,
+      display: null,
+      dur: null,
+      divisor: number2,
+      dominantBaseline: null,
+      download: boolean3,
+      dx: null,
+      dy: null,
+      edgeMode: null,
+      editable: null,
+      elevation: number2,
+      enableBackground: null,
+      end: null,
+      event: null,
+      exponent: number2,
+      externalResourcesRequired: null,
+      fill: null,
+      fillOpacity: number2,
+      fillRule: null,
+      filter: null,
+      filterRes: null,
+      filterUnits: null,
+      floodColor: null,
+      floodOpacity: null,
+      focusable: null,
+      focusHighlight: null,
+      fontFamily: null,
+      fontSize: null,
+      fontSizeAdjust: null,
+      fontStretch: null,
+      fontStyle: null,
+      fontVariant: null,
+      fontWeight: null,
+      format: null,
+      fr: null,
+      from: null,
+      fx: null,
+      fy: null,
+      g1: commaSeparated2,
+      g2: commaSeparated2,
+      glyphName: commaSeparated2,
+      glyphOrientationHorizontal: null,
+      glyphOrientationVertical: null,
+      glyphRef: null,
+      gradientTransform: null,
+      gradientUnits: null,
+      handler: null,
+      hanging: number2,
+      hatchContentUnits: null,
+      hatchUnits: null,
+      height: null,
+      href: null,
+      hrefLang: null,
+      horizAdvX: number2,
+      horizOriginX: number2,
+      horizOriginY: number2,
+      id: null,
+      ideographic: number2,
+      imageRendering: null,
+      initialVisibility: null,
+      in: null,
+      in2: null,
+      intercept: number2,
+      k: number2,
+      k1: number2,
+      k2: number2,
+      k3: number2,
+      k4: number2,
+      kernelMatrix: commaOrSpaceSeparated2,
+      kernelUnitLength: null,
+      keyPoints: null,
+      keySplines: null,
+      keyTimes: null,
+      kerning: null,
+      lang: null,
+      lengthAdjust: null,
+      letterSpacing: null,
+      lightingColor: null,
+      limitingConeAngle: number2,
+      local: null,
+      markerEnd: null,
+      markerMid: null,
+      markerStart: null,
+      markerHeight: null,
+      markerUnits: null,
+      markerWidth: null,
+      mask: null,
+      maskContentUnits: null,
+      maskType: null,
+      maskUnits: null,
+      mathematical: null,
+      max: null,
+      media: null,
+      mediaCharacterEncoding: null,
+      mediaContentEncodings: null,
+      mediaSize: number2,
+      mediaTime: null,
+      method: null,
+      min: null,
+      mode: null,
+      name: null,
+      navDown: null,
+      navDownLeft: null,
+      navDownRight: null,
+      navLeft: null,
+      navNext: null,
+      navPrev: null,
+      navRight: null,
+      navUp: null,
+      navUpLeft: null,
+      navUpRight: null,
+      numOctaves: null,
+      observer: null,
+      offset: null,
+      onAbort: null,
+      onActivate: null,
+      onAfterPrint: null,
+      onBeforePrint: null,
+      onBegin: null,
+      onCancel: null,
+      onCanPlay: null,
+      onCanPlayThrough: null,
+      onChange: null,
+      onClick: null,
+      onClose: null,
+      onCopy: null,
+      onCueChange: null,
+      onCut: null,
+      onDblClick: null,
+      onDrag: null,
+      onDragEnd: null,
+      onDragEnter: null,
+      onDragExit: null,
+      onDragLeave: null,
+      onDragOver: null,
+      onDragStart: null,
+      onDrop: null,
+      onDurationChange: null,
+      onEmptied: null,
+      onEnd: null,
+      onEnded: null,
+      onError: null,
+      onFocus: null,
+      onFocusIn: null,
+      onFocusOut: null,
+      onHashChange: null,
+      onInput: null,
+      onInvalid: null,
+      onKeyDown: null,
+      onKeyPress: null,
+      onKeyUp: null,
+      onLoad: null,
+      onLoadedData: null,
+      onLoadedMetadata: null,
+      onLoadStart: null,
+      onMessage: null,
+      onMouseDown: null,
+      onMouseEnter: null,
+      onMouseLeave: null,
+      onMouseMove: null,
+      onMouseOut: null,
+      onMouseOver: null,
+      onMouseUp: null,
+      onMouseWheel: null,
+      onOffline: null,
+      onOnline: null,
+      onPageHide: null,
+      onPageShow: null,
+      onPaste: null,
+      onPause: null,
+      onPlay: null,
+      onPlaying: null,
+      onPopState: null,
+      onProgress: null,
+      onRateChange: null,
+      onRepeat: null,
+      onReset: null,
+      onResize: null,
+      onScroll: null,
+      onSeeked: null,
+      onSeeking: null,
+      onSelect: null,
+      onShow: null,
+      onStalled: null,
+      onStorage: null,
+      onSubmit: null,
+      onSuspend: null,
+      onTimeUpdate: null,
+      onToggle: null,
+      onUnload: null,
+      onVolumeChange: null,
+      onWaiting: null,
+      onZoom: null,
+      opacity: null,
+      operator: null,
+      order: null,
+      orient: null,
+      orientation: null,
+      origin: null,
+      overflow: null,
+      overlay: null,
+      overlinePosition: number2,
+      overlineThickness: number2,
+      paintOrder: null,
+      panose1: null,
+      path: null,
+      pathLength: number2,
+      patternContentUnits: null,
+      patternTransform: null,
+      patternUnits: null,
+      phase: null,
+      ping: spaceSeparated2,
+      pitch: null,
+      playbackOrder: null,
+      pointerEvents: null,
+      points: null,
+      pointsAtX: number2,
+      pointsAtY: number2,
+      pointsAtZ: number2,
+      preserveAlpha: null,
+      preserveAspectRatio: null,
+      primitiveUnits: null,
+      propagate: null,
+      property: commaOrSpaceSeparated2,
+      r: null,
+      radius: null,
+      referrerPolicy: null,
+      refX: null,
+      refY: null,
+      rel: commaOrSpaceSeparated2,
+      rev: commaOrSpaceSeparated2,
+      renderingIntent: null,
+      repeatCount: null,
+      repeatDur: null,
+      requiredExtensions: commaOrSpaceSeparated2,
+      requiredFeatures: commaOrSpaceSeparated2,
+      requiredFonts: commaOrSpaceSeparated2,
+      requiredFormats: commaOrSpaceSeparated2,
+      resource: null,
+      restart: null,
+      result: null,
+      rotate: null,
+      rx: null,
+      ry: null,
+      scale: null,
+      seed: null,
+      shapeRendering: null,
+      side: null,
+      slope: null,
+      snapshotTime: null,
+      specularConstant: number2,
+      specularExponent: number2,
+      spreadMethod: null,
+      spacing: null,
+      startOffset: null,
+      stdDeviation: null,
+      stemh: null,
+      stemv: null,
+      stitchTiles: null,
+      stopColor: null,
+      stopOpacity: null,
+      strikethroughPosition: number2,
+      strikethroughThickness: number2,
+      string: null,
+      stroke: null,
+      strokeDashArray: commaOrSpaceSeparated2,
+      strokeDashOffset: null,
+      strokeLineCap: null,
+      strokeLineJoin: null,
+      strokeMiterLimit: number2,
+      strokeOpacity: number2,
+      strokeWidth: null,
+      style: null,
+      surfaceScale: number2,
+      syncBehavior: null,
+      syncBehaviorDefault: null,
+      syncMaster: null,
+      syncTolerance: null,
+      syncToleranceDefault: null,
+      systemLanguage: commaOrSpaceSeparated2,
+      tabIndex: number2,
+      tableValues: null,
+      target: null,
+      targetX: number2,
+      targetY: number2,
+      textAnchor: null,
+      textDecoration: null,
+      textRendering: null,
+      textLength: null,
+      timelineBegin: null,
+      title: null,
+      transformBehavior: null,
+      type: null,
+      typeOf: commaOrSpaceSeparated2,
+      to: null,
+      transform: null,
+      transformOrigin: null,
+      u1: null,
+      u2: null,
+      underlinePosition: number2,
+      underlineThickness: number2,
+      unicode: null,
+      unicodeBidi: null,
+      unicodeRange: null,
+      unitsPerEm: number2,
+      values: null,
+      vAlphabetic: number2,
+      vMathematical: number2,
+      vectorEffect: null,
+      vHanging: number2,
+      vIdeographic: number2,
+      version: null,
+      vertAdvY: number2,
+      vertOriginX: number2,
+      vertOriginY: number2,
+      viewBox: null,
+      viewTarget: null,
+      visibility: null,
+      width: null,
+      widths: null,
+      wordSpacing: null,
+      writingMode: null,
+      x: null,
+      x1: null,
+      x2: null,
+      xChannelSelector: null,
+      xHeight: number2,
+      y: null,
+      y1: null,
+      y2: null,
+      yChannelSelector: null,
+      z: null,
+      zoomAndPan: null
+    },
+    space: "svg",
+    transform: caseSensitiveTransform2
+  });
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/xlink.js
+var xlink2;
+var init_xlink2 = __esm(() => {
+  init_create2();
+  xlink2 = create5({
+    properties: {
+      xLinkActuate: null,
+      xLinkArcRole: null,
+      xLinkHref: null,
+      xLinkRole: null,
+      xLinkShow: null,
+      xLinkTitle: null,
+      xLinkType: null
+    },
+    space: "xlink",
+    transform(_, property) {
+      return "xlink:" + property.slice(5).toLowerCase();
+    }
+  });
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/xmlns.js
+var xmlns2;
+var init_xmlns2 = __esm(() => {
+  init_create2();
+  init_case_insensitive_transform2();
+  xmlns2 = create5({
+    attributes: { xmlnsxlink: "xmlns:xlink" },
+    properties: { xmlnsXLink: null, xmlns: null },
+    space: "xmlns",
+    transform: caseInsensitiveTransform2
+  });
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/xml.js
+var xml3;
+var init_xml2 = __esm(() => {
+  init_create2();
+  xml3 = create5({
+    properties: { xmlBase: null, xmlLang: null, xmlSpace: null },
+    space: "xml",
+    transform(_, property) {
+      return "xml:" + property.slice(3).toLowerCase();
+    }
+  });
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/lib/find.js
+function find2(schema4, value2) {
+  const normal = normalize5(value2);
+  let property = value2;
+  let Type2 = Info2;
+  if (normal in schema4.normal) {
+    return schema4.property[schema4.normal[normal]];
+  }
+  if (normal.length > 4 && normal.slice(0, 4) === "data" && valid2.test(value2)) {
+    if (value2.charAt(4) === "-") {
+      const rest = value2.slice(5).replace(dash2, camelcase3);
+      property = "data" + rest.charAt(0).toUpperCase() + rest.slice(1);
+    } else {
+      const rest = value2.slice(4);
+      if (!dash2.test(rest)) {
+        let dashes = rest.replace(cap2, kebab2);
+        if (dashes.charAt(0) !== "-") {
+          dashes = "-" + dashes;
+        }
+        value2 = "data" + dashes;
+      }
+    }
+    Type2 = DefinedInfo2;
+  }
+  return new Type2(property, value2);
+}
+function kebab2($0) {
+  return "-" + $0.toLowerCase();
+}
+function camelcase3($0) {
+  return $0.charAt(1).toUpperCase();
+}
+var cap2, dash2, valid2;
+var init_find2 = __esm(() => {
+  init_defined_info2();
+  init_info2();
+  cap2 = /[A-Z]/g;
+  dash2 = /-[a-z]/g;
+  valid2 = /^data[-\w.:]+$/i;
+});
+
+// ../../node_modules/.bun/property-information@7.2.0/node_modules/property-information/index.js
+var html8, svg6;
+var init_property_information2 = __esm(() => {
+  init_merge2();
+  init_aria4();
+  init_html4();
+  init_svg2();
+  init_xlink2();
+  init_xmlns2();
+  init_xml2();
+  init_find2();
+  html8 = merge3([aria2, html7, xlink2, xmlns2, xml3], "html");
+  svg6 = merge3([aria2, svg5, xlink2, xmlns2, xml3], "svg");
+});
+
+// ../parser/src/html-to-jx.ts
 function htmlToJx(htmlString) {
   const hast = fromHtml(htmlString, { fragment: true });
   return convertHastChildren(hast.children);
@@ -225779,7 +226987,7 @@ function hastPropsToJx(properties) {
   for (const [key, value2] of Object.entries(properties)) {
     if (value2 === false || value2 === undefined || value2 === null)
       continue;
-    const info = find(html6, key);
+    const info = find2(html8, key);
     const name = info.attribute;
     if (name === "style" && typeof value2 === "string") {
       parseInlineStyle(value2, style2);
@@ -225809,10 +227017,10 @@ function parseInlineStyle(styleStr, out) {
 var init_html_to_jx = __esm(() => {
   init_hast_util_from_html();
   init_hast_util_whitespace();
-  init_property_information();
+  init_property_information2();
 });
 
-// ../parser/src/transpile.js
+// ../parser/src/transpile.ts
 var exports_transpile = {};
 __export(exports_transpile, {
   transpileJxMarkdown: () => transpileJxMarkdown,
@@ -225971,7 +227179,7 @@ function mdastNodeToJx(node2) {
       break;
     }
     case "inlineCode":
-      el.textContent = node2.value;
+      el.textContent = node2.value ?? null;
       break;
     case "link":
       el.attributes = { href: node2.url };
@@ -226003,7 +227211,7 @@ function mdastNodeToJx(node2) {
       el.children = [
         {
           tagName: "code",
-          textContent: node2.value,
+          textContent: node2.value ?? null,
           ...node2.lang ? { className: `language-${node2.lang}` } : {}
         }
       ];
@@ -230825,15 +232033,15 @@ function getClientRects(element3) {
   return Array.from(element3.getClientRects());
 }
 function getDocumentRect(element3) {
-  const html7 = getDocumentElement(element3);
+  const html9 = getDocumentElement(element3);
   const scroll = getNodeScroll(element3);
   const body = element3.ownerDocument.body;
-  const width2 = max(html7.scrollWidth, html7.clientWidth, body.scrollWidth, body.clientWidth);
-  const height = max(html7.scrollHeight, html7.clientHeight, body.scrollHeight, body.clientHeight);
+  const width2 = max(html9.scrollWidth, html9.clientWidth, body.scrollWidth, body.clientWidth);
+  const height = max(html9.scrollHeight, html9.clientHeight, body.scrollHeight, body.clientHeight);
   let x = -scroll.scrollLeft + getWindowScrollBarX(element3);
   const y = -scroll.scrollTop;
   if (getComputedStyle3(body).direction === "rtl") {
-    x += max(html7.clientWidth, body.clientWidth) - width2;
+    x += max(html9.clientWidth, body.clientWidth) - width2;
   }
   return {
     width: width2,
@@ -230844,10 +232052,10 @@ function getDocumentRect(element3) {
 }
 function getViewportRect(element3, strategy) {
   const win = getWindow2(element3);
-  const html7 = getDocumentElement(element3);
+  const html9 = getDocumentElement(element3);
   const visualViewport = win.visualViewport;
-  let width2 = html7.clientWidth;
-  let height = html7.clientHeight;
+  let width2 = html9.clientWidth;
+  let height = html9.clientHeight;
   let x = 0;
   let y = 0;
   if (visualViewport) {
@@ -230859,13 +232067,13 @@ function getViewportRect(element3, strategy) {
       y = visualViewport.offsetTop;
     }
   }
-  const windowScrollbarX = getWindowScrollBarX(html7);
+  const windowScrollbarX = getWindowScrollBarX(html9);
   if (windowScrollbarX <= 0) {
-    const doc = html7.ownerDocument;
+    const doc = html9.ownerDocument;
     const body = doc.body;
     const bodyStyles = getComputedStyle(body);
     const bodyMarginInline = doc.compatMode === "CSS1Compat" ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
-    const clippingStableScrollbarWidth = Math.abs(html7.clientWidth - body.clientWidth - bodyMarginInline);
+    const clippingStableScrollbarWidth = Math.abs(html9.clientWidth - body.clientWidth - bodyMarginInline);
     if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) {
       width2 -= clippingStableScrollbarWidth;
     }
@@ -235000,7 +236208,7 @@ if (monacoEnvironment2?.globalAPI) {
 // ../../node_modules/.bun/monaco-editor@0.55.1/node_modules/monaco-editor/esm/vs/editor/editor.api.js
 init_editor_api2();
 
-// src/services/monaco-setup.js
+// src/services/monaco-setup.ts
 init_monaco_contribution();
 
 // ../../node_modules/.bun/monaco-editor@0.55.1/node_modules/monaco-editor/esm/vs/basic-languages/_.contribution.js
@@ -235776,6 +236984,9 @@ var schema_default = {
               }
             }
           ]
+        },
+        description: {
+          type: "string"
         }
       }
     },
@@ -236059,6 +237270,339 @@ var schema_default = {
         }
       }
     },
+    ExpressionPointer: {
+      description: "A JSON Pointer $ref operand within an expression node.",
+      type: "object",
+      properties: {
+        $ref: {
+          type: "string",
+          pattern: "^(\\$map/|\\$reduce/|event#/|#/|parent#/|window#/|document#/)"
+        }
+      },
+      required: [
+        "$ref"
+      ],
+      additionalProperties: false
+    },
+    ExpressionLiteral: {
+      description: "A non-reactive operand: scalar or array of operands.",
+      anyOf: [
+        {
+          type: "string",
+          not: {
+            pattern: "\\$\\{"
+          }
+        },
+        {
+          type: "number"
+        },
+        {
+          type: "boolean"
+        },
+        {
+          type: "null"
+        },
+        {
+          type: "array",
+          items: {
+            $ref: "#/$defs/ExpressionOperand"
+          }
+        }
+      ]
+    },
+    ExpressionOperand: {
+      description: "Anything that may appear in target or value: a pointer, a literal, or a nested expression node.",
+      anyOf: [
+        {
+          $ref: "#/$defs/ExpressionPointer"
+        },
+        {
+          $ref: "#/$defs/ExpressionNode"
+        },
+        {
+          $ref: "#/$defs/ExpressionLiteral"
+        }
+      ]
+    },
+    UnaryOperator: {
+      enum: [
+        "!",
+        "-"
+      ]
+    },
+    BinaryOperator: {
+      enum: [
+        "+",
+        "-",
+        "*",
+        "/",
+        "%",
+        "===",
+        "!==",
+        "<",
+        "<=",
+        ">",
+        ">=",
+        "&&",
+        "||"
+      ]
+    },
+    AssignmentOperator: {
+      enum: [
+        "=",
+        "+=",
+        "-=",
+        "*=",
+        "/="
+      ]
+    },
+    NoArgMethod: {
+      enum: [
+        "pop",
+        "shift"
+      ]
+    },
+    OneArgMethod: {
+      enum: [
+        "push",
+        "unshift"
+      ]
+    },
+    SpliceMethod: {
+      const: "splice"
+    },
+    ReduceMethod: {
+      const: "reduce"
+    },
+    MapFilterMethod: {
+      enum: [
+        "map",
+        "filter"
+      ]
+    },
+    ExpressionNode: {
+      description: "The core expression node. operator + target, with value gated by arity.",
+      type: "object",
+      required: [
+        "operator",
+        "target"
+      ],
+      additionalProperties: false,
+      properties: {
+        operator: {
+          type: "string"
+        },
+        target: {
+          $ref: "#/$defs/ExpressionOperand"
+        },
+        value: {
+          $ref: "#/$defs/ExpressionOperand"
+        },
+        initial: {
+          $ref: "#/$defs/ExpressionOperand"
+        }
+      },
+      oneOf: [
+        {
+          title: "Unary — target only, no value",
+          properties: {
+            operator: {
+              $ref: "#/$defs/UnaryOperator"
+            }
+          },
+          required: [
+            "operator"
+          ],
+          not: {
+            anyOf: [
+              {
+                required: [
+                  "value"
+                ]
+              },
+              {
+                required: [
+                  "initial"
+                ]
+              }
+            ]
+          }
+        },
+        {
+          title: "Binary — left in target, right in value",
+          properties: {
+            operator: {
+              $ref: "#/$defs/BinaryOperator"
+            }
+          },
+          required: [
+            "operator",
+            "value"
+          ],
+          not: {
+            required: [
+              "initial"
+            ]
+          }
+        },
+        {
+          title: "Assignment — writable target, value required",
+          properties: {
+            operator: {
+              $ref: "#/$defs/AssignmentOperator"
+            },
+            target: {
+              $ref: "#/$defs/ExpressionPointer"
+            }
+          },
+          required: [
+            "operator",
+            "value"
+          ],
+          not: {
+            required: [
+              "initial"
+            ]
+          }
+        },
+        {
+          title: "pop / shift — array receiver, no value",
+          properties: {
+            operator: {
+              $ref: "#/$defs/NoArgMethod"
+            },
+            target: {
+              $ref: "#/$defs/ExpressionPointer"
+            }
+          },
+          required: [
+            "operator"
+          ],
+          not: {
+            anyOf: [
+              {
+                required: [
+                  "value"
+                ]
+              },
+              {
+                required: [
+                  "initial"
+                ]
+              }
+            ]
+          }
+        },
+        {
+          title: "push / unshift — array receiver, single value argument",
+          properties: {
+            operator: {
+              $ref: "#/$defs/OneArgMethod"
+            },
+            target: {
+              $ref: "#/$defs/ExpressionPointer"
+            }
+          },
+          required: [
+            "operator",
+            "value"
+          ],
+          not: {
+            required: [
+              "initial"
+            ]
+          }
+        },
+        {
+          title: "splice — array receiver, [start, deleteCount, ...items]",
+          properties: {
+            operator: {
+              $ref: "#/$defs/SpliceMethod"
+            },
+            target: {
+              $ref: "#/$defs/ExpressionPointer"
+            },
+            value: {
+              type: "array",
+              items: {
+                $ref: "#/$defs/ExpressionOperand"
+              },
+              minItems: 1
+            }
+          },
+          required: [
+            "operator",
+            "value"
+          ],
+          not: {
+            required: [
+              "initial"
+            ]
+          }
+        },
+        {
+          title: "reduce — pure fold; per-item expression in value, seed in initial",
+          properties: {
+            operator: {
+              $ref: "#/$defs/ReduceMethod"
+            },
+            target: {
+              $ref: "#/$defs/ExpressionPointer"
+            },
+            value: {
+              $ref: "#/$defs/ExpressionNode"
+            }
+          },
+          required: [
+            "operator",
+            "value",
+            "initial"
+          ]
+        },
+        {
+          title: "map / filter — pure; per-item expression in value, no initial",
+          properties: {
+            operator: {
+              $ref: "#/$defs/MapFilterMethod"
+            },
+            target: {
+              $ref: "#/$defs/ExpressionPointer"
+            },
+            value: {
+              $ref: "#/$defs/ExpressionNode"
+            }
+          },
+          required: [
+            "operator",
+            "value"
+          ],
+          not: {
+            required: [
+              "initial"
+            ]
+          }
+        }
+      ]
+    },
+    ExpressionEntry: {
+      description: "A declarative expression entry (Shape 5). Used as a state entry or inline event handler.",
+      type: "object",
+      required: [
+        "$expression"
+      ],
+      properties: {
+        $expression: {
+          $ref: "#/$defs/ExpressionNode"
+        },
+        $title: {
+          type: "string"
+        },
+        $description: {
+          type: "string"
+        }
+      },
+      additionalProperties: false
+    },
     ElementDef: {
       description: "A Jx element definition. Maps directly to a DOM element.",
       type: "object",
@@ -255995,339 +257539,6 @@ var schema_default = {
         "$map/item/done"
       ]
     },
-    ExpressionPointer: {
-      description: "A JSON Pointer $ref operand within an expression node.",
-      type: "object",
-      properties: {
-        $ref: {
-          type: "string",
-          pattern: "^(\\$map/|\\$reduce/|event#/|#/|parent#/|window#/|document#/)"
-        }
-      },
-      required: [
-        "$ref"
-      ],
-      additionalProperties: false
-    },
-    ExpressionLiteral: {
-      description: "A non-reactive operand: scalar or array of operands.",
-      anyOf: [
-        {
-          type: "string",
-          not: {
-            pattern: "\\$\\{"
-          }
-        },
-        {
-          type: "number"
-        },
-        {
-          type: "boolean"
-        },
-        {
-          type: "null"
-        },
-        {
-          type: "array",
-          items: {
-            $ref: "#/$defs/ExpressionOperand"
-          }
-        }
-      ]
-    },
-    ExpressionOperand: {
-      description: "Anything that may appear in target or value: a pointer, a literal, or a nested expression node.",
-      anyOf: [
-        {
-          $ref: "#/$defs/ExpressionPointer"
-        },
-        {
-          $ref: "#/$defs/ExpressionNode"
-        },
-        {
-          $ref: "#/$defs/ExpressionLiteral"
-        }
-      ]
-    },
-    UnaryOperator: {
-      enum: [
-        "!",
-        "-"
-      ]
-    },
-    BinaryOperator: {
-      enum: [
-        "+",
-        "-",
-        "*",
-        "/",
-        "%",
-        "===",
-        "!==",
-        "<",
-        "<=",
-        ">",
-        ">=",
-        "&&",
-        "||"
-      ]
-    },
-    AssignmentOperator: {
-      enum: [
-        "=",
-        "+=",
-        "-=",
-        "*=",
-        "/="
-      ]
-    },
-    NoArgMethod: {
-      enum: [
-        "pop",
-        "shift"
-      ]
-    },
-    OneArgMethod: {
-      enum: [
-        "push",
-        "unshift"
-      ]
-    },
-    SpliceMethod: {
-      const: "splice"
-    },
-    ReduceMethod: {
-      const: "reduce"
-    },
-    MapFilterMethod: {
-      enum: [
-        "map",
-        "filter"
-      ]
-    },
-    ExpressionNode: {
-      description: "The core expression node. operator + target, with value gated by arity.",
-      type: "object",
-      required: [
-        "operator",
-        "target"
-      ],
-      additionalProperties: false,
-      properties: {
-        operator: {
-          type: "string"
-        },
-        target: {
-          $ref: "#/$defs/ExpressionOperand"
-        },
-        value: {
-          $ref: "#/$defs/ExpressionOperand"
-        },
-        initial: {
-          $ref: "#/$defs/ExpressionOperand"
-        }
-      },
-      oneOf: [
-        {
-          title: "Unary — target only, no value",
-          properties: {
-            operator: {
-              $ref: "#/$defs/UnaryOperator"
-            }
-          },
-          required: [
-            "operator"
-          ],
-          not: {
-            anyOf: [
-              {
-                required: [
-                  "value"
-                ]
-              },
-              {
-                required: [
-                  "initial"
-                ]
-              }
-            ]
-          }
-        },
-        {
-          title: "Binary — left in target, right in value",
-          properties: {
-            operator: {
-              $ref: "#/$defs/BinaryOperator"
-            }
-          },
-          required: [
-            "operator",
-            "value"
-          ],
-          not: {
-            required: [
-              "initial"
-            ]
-          }
-        },
-        {
-          title: "Assignment — writable target, value required",
-          properties: {
-            operator: {
-              $ref: "#/$defs/AssignmentOperator"
-            },
-            target: {
-              $ref: "#/$defs/ExpressionPointer"
-            }
-          },
-          required: [
-            "operator",
-            "value"
-          ],
-          not: {
-            required: [
-              "initial"
-            ]
-          }
-        },
-        {
-          title: "pop / shift — array receiver, no value",
-          properties: {
-            operator: {
-              $ref: "#/$defs/NoArgMethod"
-            },
-            target: {
-              $ref: "#/$defs/ExpressionPointer"
-            }
-          },
-          required: [
-            "operator"
-          ],
-          not: {
-            anyOf: [
-              {
-                required: [
-                  "value"
-                ]
-              },
-              {
-                required: [
-                  "initial"
-                ]
-              }
-            ]
-          }
-        },
-        {
-          title: "push / unshift — array receiver, single value argument",
-          properties: {
-            operator: {
-              $ref: "#/$defs/OneArgMethod"
-            },
-            target: {
-              $ref: "#/$defs/ExpressionPointer"
-            }
-          },
-          required: [
-            "operator",
-            "value"
-          ],
-          not: {
-            required: [
-              "initial"
-            ]
-          }
-        },
-        {
-          title: "splice — array receiver, [start, deleteCount, ...items]",
-          properties: {
-            operator: {
-              $ref: "#/$defs/SpliceMethod"
-            },
-            target: {
-              $ref: "#/$defs/ExpressionPointer"
-            },
-            value: {
-              type: "array",
-              items: {
-                $ref: "#/$defs/ExpressionOperand"
-              },
-              minItems: 1
-            }
-          },
-          required: [
-            "operator",
-            "value"
-          ],
-          not: {
-            required: [
-              "initial"
-            ]
-          }
-        },
-        {
-          title: "reduce — pure fold; per-item expression in value, seed in initial",
-          properties: {
-            operator: {
-              $ref: "#/$defs/ReduceMethod"
-            },
-            target: {
-              $ref: "#/$defs/ExpressionPointer"
-            },
-            value: {
-              $ref: "#/$defs/ExpressionNode"
-            }
-          },
-          required: [
-            "operator",
-            "value",
-            "initial"
-          ]
-        },
-        {
-          title: "map / filter — pure; per-item expression in value, no initial",
-          properties: {
-            operator: {
-              $ref: "#/$defs/MapFilterMethod"
-            },
-            target: {
-              $ref: "#/$defs/ExpressionPointer"
-            },
-            value: {
-              $ref: "#/$defs/ExpressionNode"
-            }
-          },
-          required: [
-            "operator",
-            "value"
-          ],
-          not: {
-            required: [
-              "initial"
-            ]
-          }
-        }
-      ]
-    },
-    ExpressionEntry: {
-      description: "A declarative expression entry (Shape 5). Used as a state entry or inline event handler.",
-      type: "object",
-      required: [
-        "$expression"
-      ],
-      properties: {
-        $expression: {
-          $ref: "#/$defs/ExpressionNode"
-        },
-        $title: {
-          type: "string"
-        },
-        $description: {
-          type: "string"
-        }
-      },
-      additionalProperties: false
-    },
     ElementPropertyValue: {
       oneOf: [
         {
@@ -256664,6 +257875,134 @@ var schema_default = {
         "object",
         "null"
       ]
+    },
+    HeadEntry: {
+      description: "A page-level <head> entry. Defines meta tags, link tags, script tags, etc.",
+      type: "object",
+      required: [
+        "tagName"
+      ],
+      properties: {
+        tagName: {
+          type: "string"
+        },
+        attributes: {
+          type: "object",
+          additionalProperties: {
+            oneOf: [
+              {
+                type: "string"
+              },
+              {
+                type: "boolean"
+              }
+            ]
+          }
+        },
+        textContent: {
+          type: "string"
+        },
+        children: {
+          type: "array",
+          items: {
+            $ref: "#/$defs/HeadEntry"
+          }
+        }
+      },
+      additionalProperties: true
+    },
+    ImageConfig: {
+      description: "Image optimization configuration for the project.",
+      type: "object",
+      properties: {
+        optimize: {
+          type: "boolean"
+        },
+        widths: {
+          type: "array",
+          items: {
+            type: "number"
+          }
+        },
+        formats: {
+          type: "array",
+          items: {
+            type: "string"
+          }
+        },
+        quality: {
+          type: "object",
+          properties: {
+            webp: {
+              type: "number"
+            },
+            avif: {
+              type: "number"
+            },
+            jpeg: {
+              type: "number"
+            },
+            png: {
+              type: "number"
+            }
+          }
+        },
+        sizes: {
+          type: "string"
+        },
+        lazyLoad: {
+          type: "boolean"
+        }
+      }
+    },
+    ContentTypeDef: {
+      description: "Content type definition. Defines the source directory, frontmatter schema, and element dependencies.",
+      type: "object",
+      properties: {
+        source: {
+          description: "Path to the content directory relative to the project root.",
+          type: "string",
+          examples: [
+            "./content/blog/",
+            "./content/docs/"
+          ]
+        },
+        format: {
+          type: "string",
+          enum: [
+            "md",
+            "json",
+            "csv",
+            "yaml"
+          ]
+        },
+        schema: {
+          description: "JSON Schema for validating frontmatter of content type entries.",
+          type: "object"
+        },
+        $elements: {
+          description: "Custom elements available in markdown directives for this content type.",
+          type: "array",
+          items: {
+            oneOf: [
+              {
+                type: "object",
+                required: [
+                  "$ref"
+                ],
+                properties: {
+                  $ref: {
+                    type: "string"
+                  }
+                }
+              },
+              {
+                type: "string"
+              }
+            ]
+          }
+        }
+      }
     }
   }
 };
@@ -256830,47 +258169,15 @@ var project_schema_default = {
       description: "Site-wide reactive state available to all pages.",
       type: "object"
     },
+    $defs: {
+      description: "Global type definitions available to all pages.",
+      type: "object"
+    },
     contentTypes: {
       description: "Content type definitions. Each key is a content type name; the value defines the source directory, frontmatter schema, and element dependencies.",
       type: "object",
       additionalProperties: {
-        type: "object",
-        properties: {
-          source: {
-            description: "Path to the content directory relative to the project root.",
-            type: "string",
-            examples: [
-              "./content/blog/",
-              "./content/docs/"
-            ]
-          },
-          schema: {
-            description: "JSON Schema for validating frontmatter of content type entries.",
-            type: "object"
-          },
-          $elements: {
-            description: "Custom elements available in markdown directives for this content type.",
-            type: "array",
-            items: {
-              oneOf: [
-                {
-                  type: "object",
-                  required: [
-                    "$ref"
-                  ],
-                  properties: {
-                    $ref: {
-                      type: "string"
-                    }
-                  }
-                },
-                {
-                  type: "string"
-                }
-              ]
-            }
-          }
-        }
+        $ref: "#/$defs/ContentTypeDef"
       }
     },
     redirects: {
@@ -256931,6 +258238,9 @@ var project_schema_default = {
         }
       }
     },
+    images: {
+      $ref: "#/$defs/ImageConfig"
+    },
     i18n: {
       description: "Internationalization configuration.",
       type: "object",
@@ -256967,10 +258277,105 @@ var project_schema_default = {
       }
     }
   },
-  additionalProperties: false
+  additionalProperties: false,
+  $defs: {
+    ImageConfig: {
+      description: "Image optimization configuration for the project.",
+      type: "object",
+      properties: {
+        optimize: {
+          type: "boolean"
+        },
+        widths: {
+          type: "array",
+          items: {
+            type: "number"
+          }
+        },
+        formats: {
+          type: "array",
+          items: {
+            type: "string"
+          }
+        },
+        quality: {
+          type: "object",
+          properties: {
+            webp: {
+              type: "number"
+            },
+            avif: {
+              type: "number"
+            },
+            jpeg: {
+              type: "number"
+            },
+            png: {
+              type: "number"
+            }
+          }
+        },
+        sizes: {
+          type: "string"
+        },
+        lazyLoad: {
+          type: "boolean"
+        }
+      }
+    },
+    ContentTypeDef: {
+      description: "Content type definition. Defines the source directory, frontmatter schema, and element dependencies.",
+      type: "object",
+      properties: {
+        source: {
+          description: "Path to the content directory relative to the project root.",
+          type: "string",
+          examples: [
+            "./content/blog/",
+            "./content/docs/"
+          ]
+        },
+        format: {
+          type: "string",
+          enum: [
+            "md",
+            "json",
+            "csv",
+            "yaml"
+          ]
+        },
+        schema: {
+          description: "JSON Schema for validating frontmatter of content type entries.",
+          type: "object"
+        },
+        $elements: {
+          description: "Custom elements available in markdown directives for this content type.",
+          type: "array",
+          items: {
+            oneOf: [
+              {
+                type: "object",
+                required: [
+                  "$ref"
+                ],
+                properties: {
+                  $ref: {
+                    type: "string"
+                  }
+                }
+              },
+              {
+                type: "string"
+              }
+            ]
+          }
+        }
+      }
+    }
+  }
 };
 
-// src/services/monaco-setup.js
+// src/services/monaco-setup.ts
 var WORKER_PATHS = {
   json: "/monaco-editor/esm/vs/language/json/json.worker.js",
   typescript: "/monaco-editor/esm/vs/language/typescript/ts.worker.js",
@@ -257009,11 +258414,11 @@ jsonDefaults.setDiagnosticsOptions({
   ]
 });
 
-// src/studio.js
+// src/studio.ts
 init_store();
 init_workspace2();
 
-// src/tabs/transact.js
+// src/tabs/transact.ts
 init_reactivity();
 var HISTORY_LIMIT = 100;
 function transactDoc(tab, mutationFn, { skipHistory = false } = {}) {
@@ -257357,10 +258762,10 @@ function mutateUpdateFrontmatter(tab, field, value) {
   tab.doc.dirty = true;
 }
 
-// src/studio.js
+// src/studio.ts
 init_reactivity();
 
-// src/view.js
+// src/view.ts
 var view = {
   panzoomWrap: null,
   renderGeneration: 0,
@@ -257659,7 +259064,7 @@ var elements_meta_default = {
   }
 };
 
-// src/editor/inline-format.js
+// src/editor/inline-format.ts
 var FORMAT_TAGS = new Set([
   "strong",
   "em",
@@ -258012,11 +259417,11 @@ function findTemplateExpressions(text2) {
   return results;
 }
 
-// src/editor/slash-menu.js
+// src/editor/slash-menu.ts
 init_lit_html();
 init_ref();
 
-// src/ui/layers.js
+// src/ui/layers.ts
 init_lit_html();
 var _popoverLayer;
 var _modalLayer;
@@ -258126,7 +259531,7 @@ function getLayerSlot(layer, id) {
   return slot;
 }
 
-// src/editor/slash-menu.js
+// src/editor/slash-menu.ts
 var SLASH_COMMANDS = [
   { label: "Heading 1", tag: "h1", description: "Large heading" },
   { label: "Heading 2", tag: "h2", description: "Medium heading" },
@@ -258297,7 +259702,7 @@ function onKeydown(e) {
   }
 }
 
-// src/editor/inline-edit.js
+// src/editor/inline-edit.ts
 var INLINE_TAGS = new Set([
   "em",
   "strong",
@@ -258711,11 +260116,11 @@ function handleSlashSelect(cmd) {
   insert(path, cmd, commitResult);
 }
 
-// src/editor/component-inline-edit.js
+// src/editor/component-inline-edit.ts
 init_store();
 init_workspace2();
 
-// src/panels/block-action-bar.js
+// src/panels/block-action-bar.ts
 init_lit_html();
 init_style_map();
 init_ref();
@@ -260279,12 +261684,12 @@ function draggable(args) {
   }));
   return once(cleanup);
 }
-// src/panels/block-action-bar.js
+// src/panels/block-action-bar.ts
 init_store();
 init_workspace2();
 init_components();
 
-// src/editor/convert-to-component.js
+// src/editor/convert-to-component.ts
 init_lit_html();
 init_ref();
 init_store();
@@ -260292,7 +261697,7 @@ init_workspace2();
 init_components();
 init_platform3();
 
-// src/panels/statusbar.js
+// src/panels/statusbar.ts
 init_store();
 init_reactivity();
 init_workspace2();
@@ -260371,7 +261776,7 @@ function statusMessage(msg, duration = 3000) {
   }, duration);
 }
 
-// src/editor/convert-to-component.js
+// src/editor/convert-to-component.ts
 var VALID_NAME = /^[a-z][a-z0-9]*(-[a-z0-9]+)+$/;
 async function convertToComponent() {
   const tab = activeTab.value;
@@ -260509,7 +261914,7 @@ function promptComponentName(defaultName) {
   });
 }
 
-// src/canvas/canvas-helpers.js
+// src/canvas/canvas-helpers.ts
 init_store();
 init_workspace2();
 var _ctx = null;
@@ -260598,7 +262003,7 @@ function overlayBoxDescriptor(el, type, panel) {
   };
 }
 
-// src/editor/convert-targets.js
+// src/editor/convert-targets.ts
 var TAG_LABELS = {
   p: "Paragraph",
   h1: "Heading 1",
@@ -260640,7 +262045,7 @@ function getConvertTargets(currentTag, isEmpty) {
   }));
 }
 
-// src/panels/block-action-bar.js
+// src/panels/block-action-bar.ts
 var _ctx2 = null;
 function initBlockActionBar(ctx) {
   _ctx2 = ctx;
@@ -260731,7 +262136,7 @@ function renderMoveArrows() {
   const sel = tab.session.selection;
   const idx = childIndex(sel);
   const pPath = parentElementPath(sel);
-  const parentNode = getNodeAtPath(tab.doc.document, pPath);
+  const parentNode = pPath ? getNodeAtPath(tab.doc.document, pPath) : null;
   const siblings = parentNode?.children;
   return html3`
     <sp-action-button
@@ -261014,7 +262419,7 @@ function renderBlockActionBar() {
   });
 }
 
-// src/panels/shared.js
+// src/panels/shared.ts
 function mediaDisplayName(name) {
   if (name === "--")
     return "Base";
@@ -261051,7 +262456,7 @@ function defaultDef(tag3) {
   else if (tag3 === "input")
     def3.attributes = { type: "text", placeholder: "Enter text..." };
   else if (tag3 === "img")
-    def3.attributes = { src: "", alt: "Image" };
+    def3.attributes = { alt: "Image" };
   else if (tag3 === "iframe")
     def3.attributes = { src: "" };
   else if (tag3 === "select")
@@ -261082,7 +262487,7 @@ function defaultDef(tag3) {
   return def3;
 }
 
-// src/editor/component-inline-edit.js
+// src/editor/component-inline-edit.ts
 var _ctx3 = null;
 function initComponentInlineEdit(ctx) {
   _ctx3 = ctx;
@@ -261091,7 +262496,7 @@ function enterComponentInlineEdit(el, path) {
   if (view.componentInlineEdit && view.componentInlineEdit.el === el) {
     return;
   }
-  const node = getNodeAtPath(activeTab.value?.doc.document, path);
+  const node = getNodeAtPath(activeTab.value.doc.document, path);
   if (!node)
     return;
   const tc = node.textContent;
@@ -261321,11 +262726,13 @@ function handleComponentSlashSelect(cmd) {
     updateUi("pendingInlineEdit", { path: newPath, mediaName });
 }
 
-// src/editor/content-inline-edit.js
+// src/editor/content-inline-edit.ts
 init_store();
 init_workspace2();
 
-// src/utils/edit-display.js
+// src/utils/edit-display.ts
+var mediaTags = new Set(["img", "video", "source", "iframe", "audio"]);
+var TRANSPARENT_PX = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
 function templateToEditDisplay(str) {
   return str.replace(/\$\{([^}]+)\}/g, "❪ $1 ❫");
 }
@@ -261345,9 +262752,38 @@ function prepareForEditMode(node) {
     return node.map(prepareForEditMode);
   const obj = node;
   const out = {};
+  let needsMediaPlaceholder = false;
+  const isMediaElement = mediaTags.has(obj.tagName || "");
+  if (isMediaElement) {
+    const attrs = obj.attributes;
+    const topSrc = obj.src;
+    const attrSrc = attrs?.src;
+    const topPoster = obj.poster;
+    const attrPoster = attrs?.poster;
+    const hasSrc = topSrc && topSrc !== "" || attrSrc && attrSrc !== "";
+    const hasPoster = topPoster && topPoster !== "" || attrPoster && attrPoster !== "";
+    if (!hasSrc && !hasPoster) {
+      needsMediaPlaceholder = true;
+    }
+  }
   for (const [k, v] of Object.entries(obj)) {
-    if (k === "state" || k === "$media" || k === "$props" || k === "$elements") {
+    if (k === "state" || k === "$media" || k === "$elements") {
       out[k] = v;
+    } else if (k === "$props" && v && typeof v === "object") {
+      const propsOut = {};
+      for (const [pk, pv] of Object.entries(v)) {
+        if (typeof pv === "string" && pv.includes("${")) {
+          const isUrlAttr = pk === "src" || pk === "href" || pk === "poster" || pk === "action";
+          propsOut[pk] = isUrlAttr ? "" : templateToEditDisplay(pv);
+        } else if (pv && typeof pv === "object" && pv.$ref) {
+          const ref3 = pv.$ref;
+          const label = ref3.startsWith("#/state/") ? ref3.slice(8) : ref3;
+          propsOut[pk] = `{${label}}`;
+        } else {
+          propsOut[pk] = pv;
+        }
+      }
+      out[k] = propsOut;
     } else if (k === "children") {
       if (Array.isArray(v)) {
         out.children = v.map(prepareForEditMode);
@@ -261393,6 +262829,29 @@ function prepareForEditMode(node) {
           ];
         }
       }
+    } else if (k === "attributes" && isMediaElement && v && typeof v === "object") {
+      const attrs = v;
+      const processed = {};
+      for (const [ak, av] of Object.entries(attrs)) {
+        if (ak === "src" || ak === "poster") {
+          if (typeof av === "string" && av !== "" && !av.includes("${")) {
+            processed[ak] = av;
+          } else {
+            needsMediaPlaceholder = true;
+            processed[ak] = TRANSPARENT_PX;
+          }
+        } else if (typeof av === "string" && av.includes("${")) {
+          const isUrlAttr = ak === "href" || ak === "action";
+          processed[ak] = isUrlAttr ? "" : templateToEditDisplay(av);
+        } else if (av && typeof av === "object" && av.$ref) {
+          const ref3 = av.$ref;
+          const label = ref3.startsWith("#/state/") ? ref3.slice(8) : ref3;
+          processed[ak] = `{${label}}`;
+        } else {
+          processed[ak] = av;
+        }
+      }
+      out.attributes = processed;
     } else if (k === "style") {
       if (v && typeof v === "object") {
         const s = {};
@@ -261404,13 +262863,31 @@ function prepareForEditMode(node) {
         out.style = v;
       }
     } else if (typeof v === "string" && v.includes("${")) {
-      out[k] = templateToEditDisplay(v);
+      const isMediaSrc = (k === "src" || k === "poster") && mediaTags.has(obj.tagName || "");
+      if (isMediaSrc) {
+        needsMediaPlaceholder = true;
+        out[k] = TRANSPARENT_PX;
+      } else {
+        const isUrlAttr = k === "src" || k === "href" || k === "poster" || k === "action";
+        out[k] = isUrlAttr ? "" : templateToEditDisplay(v);
+      }
     } else if (v && typeof v === "object" && v.$ref) {
       const ref3 = v.$ref;
       const label = ref3.startsWith("#/state/") ? ref3.slice(8) : ref3;
-      out[k] = `{${label}}`;
+      const isMediaSrc = (k === "src" || k === "poster") && mediaTags.has(obj.tagName || "");
+      if (isMediaSrc) {
+        needsMediaPlaceholder = true;
+        out[k] = TRANSPARENT_PX;
+      } else {
+        out[k] = `{${label}}`;
+      }
     } else {
-      out[k] = prepareForEditMode(v);
+      if ((k === "src" || k === "poster") && v === "" && mediaTags.has(obj.tagName || "")) {
+        needsMediaPlaceholder = true;
+        out[k] = TRANSPARENT_PX;
+      } else {
+        out[k] = prepareForEditMode(v);
+      }
     }
   }
   if (out.tagName && !out.textContent && !out.innerHTML) {
@@ -261477,10 +262954,16 @@ function prepareForEditMode(node) {
       }
     }
   }
+  if (needsMediaPlaceholder) {
+    const cls = out.className || "";
+    if (!cls.includes("empty-media-placeholder")) {
+      out.className = cls ? cls + " empty-media-placeholder" : "empty-media-placeholder";
+    }
+  }
   return out;
 }
 
-// src/editor/content-inline-edit.js
+// src/editor/content-inline-edit.ts
 function enterInlineEdit(el, path) {
   restoreTemplateExpressions(el);
   for (const p of canvasPanels) {
@@ -261489,7 +262972,7 @@ function enterInlineEdit(el, path) {
   }
   startEditing(el, path, {
     onCommit(commitPath, children, textContent) {
-      const node = getNodeAtPath(activeTab.value?.doc.document, commitPath);
+      const node = getNodeAtPath(activeTab.value.doc.document, commitPath);
       if (children) {
         if (node && JSON.stringify(node.children) === JSON.stringify(children))
           return;
@@ -261623,7 +263106,7 @@ function enterInlineEdit(el, path) {
   view.inlineEditCleanup = inlineEditCleanup;
 }
 
-// src/canvas/canvas-utils.js
+// src/canvas/canvas-utils.ts
 init_lit_html();
 init_ref();
 init_class_map();
@@ -261888,13 +263371,13 @@ function updateActivePanelHeaders() {
   }
 }
 
-// src/canvas/canvas-render.js
+// src/canvas/canvas-render.ts
 init_lit_html();
 init_ref();
 init_store();
 init_workspace2();
 
-// src/files/file-ops.js
+// src/files/file-ops.ts
 init_unified();
 
 // ../../node_modules/.bun/remark-stringify@11.0.0/node_modules/remark-stringify/lib/index.js
@@ -261910,7 +263393,7 @@ function remarkStringify(options) {
     });
   }
 }
-// src/files/file-ops.js
+// src/files/file-ops.ts
 init_remark_directive();
 init_remark_gfm();
 
@@ -265042,12 +266525,12 @@ function stringify4(value, replacer2, options) {
     return value.toString(options);
   return new Document2(value, _replacer, options).toString(options);
 }
-// src/markdown/md-convert.js
+// src/markdown/md-convert.ts
 init_unified();
 init_remark_directive();
 init_remark_gfm();
 
-// src/markdown/md-allowlist.js
+// src/markdown/md-allowlist.ts
 var MD_BLOCK = new Set([
   "h1",
   "h2",
@@ -265099,7 +266582,7 @@ var MD_NESTING = {
   a: { block: false, inline: true, directive: false, only: null }
 };
 
-// src/markdown/md-convert.js
+// src/markdown/md-convert.ts
 init_transpile();
 var INLINE_CONTENT_TAGS = new Set([
   "p",
@@ -265291,8 +266774,14 @@ function blockChildren(el) {
 function collectDirectiveAttrs(el) {
   const propsObj = {};
   for (const [key, value2] of Object.entries(el)) {
-    if (key === "tagName" || key === "children" || key === "textContent" || key === "innerHTML" || key === "attributes")
+    if (key === "tagName" || key === "textContent" || key === "innerHTML" || key === "attributes")
       continue;
+    if (key === "children") {
+      if (value2 && typeof value2 === "object" && !Array.isArray(value2)) {
+        propsObj.children = value2;
+      }
+      continue;
+    }
     propsObj[key] = value2;
   }
   if (el.attributes) {
@@ -265313,7 +266802,9 @@ function convertToDirective(el, isBlock) {
       children: el.textContent != null ? [{ type: "text", value: String(el.textContent) }] : (el.children ?? []).map((c) => convertJxNode(c, false)).filter(Boolean)
     };
   }
-  const childArray = el.children;
+  const rawChildren = el.children;
+  const childrenIsObject = rawChildren && typeof rawChildren === "object" && !Array.isArray(rawChildren);
+  const childArray = childrenIsObject ? undefined : rawChildren;
   if (!childArray?.length && el.textContent == null) {
     return {
       type: "leafDirective",
@@ -265484,7 +266975,7 @@ function collapsePropsToAttrMap(propsObj) {
   return result;
 }
 
-// src/services/code-services.js
+// src/services/code-services.ts
 init_platform3();
 init_store();
 async function codeService(action, payload) {
@@ -265554,7 +267045,7 @@ function getFunctionArgs(editing, document4) {
   return ["state", "event"];
 }
 
-// src/files/file-ops.js
+// src/files/file-ops.ts
 init_platform3();
 init_workspace2();
 async function loadMarkdown(source) {
@@ -265567,11 +267058,17 @@ async function loadMarkdown(source) {
   const children = doc.children ?? [];
   if (children.length === 0)
     children.push({ tagName: "p", children: [] });
+  const documentKeys = new Set(["state", "imports"]);
   const contentDoc = { children };
   const frontmatter2 = {};
   for (const [key, value2] of Object.entries(doc)) {
-    if (key !== "children")
+    if (key === "children")
+      continue;
+    if (documentKeys.has(key)) {
+      contentDoc[key] = value2;
+    } else {
       frontmatter2[key] = value2;
+    }
   }
   return { document: contentDoc, frontmatter: frontmatter2 };
 }
@@ -265642,7 +267139,8 @@ async function exportFile() {
 function serializeDocument(tab) {
   if (tab.doc.sourceFormat === "md") {
     const fm = tab.doc.content?.frontmatter || {};
-    const fullDoc = { ...fm, children: tab.doc.document.children ?? [] };
+    const doc = tab.doc.document;
+    const fullDoc = { ...fm, ...doc, children: doc.children ?? [] };
     return jxDocToMd(fullDoc);
   }
   if (tab.doc.mode === "content") {
@@ -265659,10 +267157,10 @@ ${md}` : md;
   return JSON.stringify(tab.doc.document, null, 2);
 }
 
-// src/panels/welcome-screen.js
+// src/panels/welcome-screen.ts
 init_lit_html();
 
-// src/recent-projects.js
+// src/recent-projects.ts
 var STORAGE_KEY = "jx-studio-recent-projects";
 var FILES_STORAGE_KEY = "jx-studio-recent-files";
 var MAX_RECENT = 8;
@@ -265702,7 +267200,7 @@ function trackRecentFile(file) {
   localStorage.setItem(FILES_STORAGE_KEY, JSON.stringify(recent));
 }
 
-// src/panels/git-panel.js
+// src/panels/git-panel.ts
 init_lit_html();
 init_live();
 init_repeat();
@@ -265710,11 +267208,11 @@ init_platform3();
 init_store();
 init_workspace2();
 
-// src/github/github-publish.js
+// src/github/github-publish.ts
 init_lit_html();
 init_ref();
 
-// src/github/github-auth.js
+// src/github/github-auth.ts
 init_lit_html();
 var CLIENT_ID = "Ov23liYVlMFpgjOEPXJH";
 var STORAGE_KEY2 = "jx_github_token";
@@ -265809,7 +267307,7 @@ async function authenticateGithub() {
   });
 }
 
-// src/github/github-publish.js
+// src/github/github-publish.ts
 init_platform3();
 async function publishToGithub({ projectName }) {
   const token = await authenticateGithub();
@@ -265909,7 +267407,7 @@ async function publishToGithub({ projectName }) {
   return true;
 }
 
-// src/panels/git-panel.js
+// src/panels/git-panel.ts
 async function refreshGitStatus() {
   if (!projectState)
     return;
@@ -266471,7 +267969,7 @@ function _relativeDate(iso) {
   return d2.toLocaleDateString();
 }
 
-// src/panels/welcome-screen.js
+// src/panels/welcome-screen.ts
 var _ctx5 = null;
 function initWelcome(ctx) {
   _ctx5 = ctx;
@@ -266558,7 +268056,7 @@ function shortenPath(path2) {
   }
   return path2;
 }
-// src/utils/canvas-media.js
+// src/utils/canvas-media.ts
 function parseMediaEntries(mediaDef) {
   if (!mediaDef)
     return { sizeBreakpoints: [], featureQueries: [], baseWidth: 320 };
@@ -266606,7 +268104,7 @@ function applyCanvasStyle(el, styleDef, activeBreakpoints, featureToggles) {
     }
   }
   for (const [key, val] of Object.entries(styleDef)) {
-    if (!key.startsWith("@") || typeof val !== "object")
+    if (!key.startsWith("@") || typeof val !== "object" || val === null)
       continue;
     const mediaName = key.slice(1);
     if (mediaName === "--")
@@ -266678,7 +268176,7 @@ function applyOverridesToCanvas(canvasEl, overrides) {
   }
 }
 
-// src/site-context.js
+// src/site-context.ts
 init_store();
 init_platform3();
 function getEffectiveMedia(docMedia) {
@@ -266832,15 +268330,15 @@ async function updateSiteConfig(patch2) {
   setProjectState({ ...requireProjectState(), projectConfig: config });
 }
 
-// src/canvas/canvas-live-render.js
+// src/canvas/canvas-live-render.ts
 init_store();
 init_workspace2();
 init_reactivity();
 
-// ../runtime/src/runtime.js
+// ../runtime/src/runtime.ts
 init_reactivity_esm_bundler();
 
-// ../runtime/src/expression.js
+// ../runtime/src/expression.ts
 var MUTATING_OPS = new Set([
   "=",
   "+=",
@@ -267059,28 +268557,43 @@ function evaluateExpression(node2, state, event, iterCtx) {
     }
     if (operator === "map") {
       return arr.map((item, index2) => {
-        return evaluateExpression(value2, state, event, { ...iterCtx, item, index: index2 });
+        return evaluateExpression(value2, state, event, {
+          ...iterCtx,
+          item,
+          index: index2
+        });
       });
     }
     if (operator === "filter") {
       return arr.filter((item, index2) => {
-        return evaluateExpression(value2, state, event, { ...iterCtx, item, index: index2 });
+        return evaluateExpression(value2, state, event, {
+          ...iterCtx,
+          item,
+          index: index2
+        });
       });
     }
   }
+  return;
 }
 function getPath(obj, path2) {
   return path2.split(/[./]/).reduce((o, k) => o?.[k], obj);
 }
 
-// ../runtime/src/runtime.js
+// ../runtime/src/runtime.ts
+var _resolveCache = new Map;
 async function resolve3(source) {
   if (typeof source !== "string")
     return source;
-  const res = await fetch(source);
-  if (!res.ok)
-    throw new Error(`Jx: failed to fetch ${source} (${res.status})`);
-  return res.json();
+  if (_resolveCache.has(source))
+    return _resolveCache.get(source);
+  const p = fetch(source).then((res) => {
+    if (!res.ok)
+      throw new Error(`Jx: failed to fetch ${source} (${res.status})`);
+    return res.json();
+  });
+  _resolveCache.set(source, p);
+  return p;
 }
 var SCHEMA_KEYWORDS = new Set([
   "type",
@@ -267133,17 +268646,18 @@ async function buildScope(doc, parentScope = {}, base2 = location.href) {
       continue;
     }
     if (typeof def3 === "object") {
-      if (def3.$prototype)
+      const d2 = def3;
+      if (d2.$prototype)
         continue;
-      if ("$expression" in def3)
+      if ("$expression" in d2)
         continue;
-      if (def3.timing === "server" && def3.$src && def3.$export)
+      if (d2.timing === "server" && d2.$src && d2.$export)
         continue;
-      if ("default" in def3) {
-        raw[key] = def3.default;
+      if ("default" in d2) {
+        raw[key] = d2.default;
         continue;
       }
-      if (hasSchemaKeywords(def3))
+      if (hasSchemaKeywords(d2))
         continue;
       raw[key] = def3;
     }
@@ -267381,12 +268895,13 @@ function applyProperties(el, def3, state) {
 function bindProperty(el, key, val, state) {
   const target = el;
   if (isRefObj(val)) {
+    const refVal = val;
     if (key === "id") {
-      target[key] = resolveRef(val.$ref, state);
+      target[key] = resolveRef(refVal.$ref, state);
       return;
     }
     effect(() => {
-      target[key] = resolveRef(val.$ref, state);
+      target[key] = resolveRef(refVal.$ref, state);
     });
     return;
   }
@@ -267812,6 +269327,10 @@ async function importAndInstantiate(def3, src, exportName, base2) {
 async function resolveClassJson(def3, state, key, base2) {
   const src = def3.$src;
   let classDef;
+  const isBareSpecifier = !src.startsWith(".") && !src.startsWith("/") && !src.startsWith("http") && !src.startsWith("file:");
+  if (isBareSpecifier) {
+    return resolveViaDevProxy(def3, state, key, base2);
+  }
   try {
     const url = base2 ? new URL(src, base2).href : src;
     const res = await fetch(url);
@@ -268118,9 +269637,13 @@ async function registerElements(elements, base2) {
     await defineElement(doc, href);
   }
 }
+var _definedSources = new Set;
 async function defineElement(source, base2) {
   if (typeof source === "string") {
     base2 = new URL(source, base2 ?? location.href).href;
+    if (_definedSources.has(base2))
+      return;
+    _definedSources.add(base2);
     source = await resolve3(source);
   }
   base2 = base2 ?? location.href;
@@ -268138,6 +269661,8 @@ async function defineElement(source, base2) {
   const def3 = source_;
   const observedAttrs = def3.observedAttributes ?? [];
   const ElementClass = class extends HTMLElement {
+    _jxInitialized = false;
+    _state = null;
     static get observedAttributes() {
       return observedAttrs;
     }
@@ -268190,29 +269715,26 @@ async function defineElement(source, base2) {
       }
     }
     disconnectedCallback() {
-      const self2 = this;
-      if (typeof self2._state?.onUnmount === "function") {
-        self2._state.onUnmount(self2._state);
+      if (typeof this._state?.onUnmount === "function") {
+        this._state.onUnmount(this._state);
       }
     }
     adoptedCallback() {
-      const self2 = this;
-      if (typeof self2._state?.onAdopted === "function") {
-        self2._state.onAdopted(self2._state);
+      if (typeof this._state?.onAdopted === "function") {
+        this._state.onAdopted(this._state);
       }
     }
     attributeChangedCallback(name, oldVal, newVal) {
-      const self2 = this;
-      if (!self2._state || oldVal === newVal)
+      if (!this._state || oldVal === newVal)
         return;
       const camelKey = name.replace(/-([a-z])/g, (_, c) => c.toUpperCase());
-      const current = self2._state[camelKey];
+      const current = this._state[camelKey];
       if (typeof current === "number")
-        self2._state[camelKey] = Number(newVal);
+        this._state[camelKey] = Number(newVal);
       else if (typeof current === "boolean")
-        self2._state[camelKey] = newVal !== null && newVal !== "false";
+        this._state[camelKey] = newVal !== null && newVal !== "false";
       else
-        self2._state[camelKey] = newVal;
+        this._state[camelKey] = newVal;
     }
   };
   customElements.define(tagName, ElementClass);
@@ -268223,10 +269745,11 @@ function renderCustomElementWithProps(def3, state, options, path2) {
     options.onNodeCreated(el, path2 ?? [], def3);
   for (const [key, val] of Object.entries(def3.$props ?? {})) {
     if (isRefObj(val)) {
-      const resolved = resolveRef(val.$ref, state);
+      const refVal = val;
+      const resolved = resolveRef(refVal.$ref, state);
       el[key] = resolved;
       effect(() => {
-        el[key] = resolveRef(val.$ref, state);
+        el[key] = resolveRef(refVal.$ref, state);
       });
     } else if (isTemplateString(val)) {
       effect(() => {
@@ -268275,10 +269798,10 @@ function distributeSlots(host, slottedChildren) {
   }
 }
 
-// src/canvas/canvas-live-render.js
+// src/canvas/canvas-live-render.ts
 init_components();
 
-// src/canvas/nested-site-style.js
+// src/canvas/nested-site-style.ts
 function buildNestedSiteCSS(styleObj, scope) {
   let css = "";
   function emit(parentSel, rules) {
@@ -268305,7 +269828,7 @@ function camelToKebab2(s2) {
   return s2.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
 }
 
-// src/canvas/canvas-live-render.js
+// src/canvas/canvas-live-render.ts
 function _preventNav(e) {
   if (e.target.closest("a[href]")) {
     e.preventDefault();
@@ -268439,7 +269962,7 @@ async function renderCanvasLive(gen, doc, canvasEl) {
       for (const tag3 of collectTags(renderDoc)) {
         const comp = componentRegistry.find((c) => c.tagName === tag3);
         if (comp && comp.source !== "npm") {
-          const relPath = computeRelativePath(S.documentPath, comp.path);
+          const relPath = computeRelativePath(S.documentPath ?? null, comp.path);
           if (!existingRefs.has(relPath)) {
             effectiveElements.push({ $ref: relPath });
             existingRefs.add(relPath);
@@ -268553,7 +270076,7 @@ async function renderCanvasLive(gen, doc, canvasEl) {
           continue;
         const el2 = document.createElement(tag3);
         for (const [k, v] of Object.entries(attrs))
-          el2.setAttribute(k, v);
+          el2.setAttribute(k, String(v));
         if (entry.textContent)
           el2.textContent = entry.textContent;
         document.head.appendChild(el2);
@@ -268639,21 +270162,29 @@ async function renderCanvasLive(gen, doc, canvasEl) {
   }
 }
 
-// src/panels/preview-render.js
+// src/panels/preview-render.ts
 init_store();
 init_workspace2();
 
-// src/panels/signals-panel.js
+// src/panels/signals-panel.ts
 init_lit_html();
 init_class_map();
 init_if_defined();
 init_style_map();
 init_workspace2();
 
-// src/ui/field-row.js
+// src/ui/field-row.ts
 init_lit_html();
 init_class_map();
-function renderFieldRow({ prop, label: label4, hasValue, onClear, widget, span, warning }) {
+function renderFieldRow({
+  prop,
+  label: label4,
+  hasValue,
+  onClear,
+  widget,
+  span,
+  warning
+}) {
   return html3`
     <div
       class=${classMap({ "style-row": true, "style-row--warning": !!warning })}
@@ -268676,7 +270207,7 @@ function renderFieldRow({ prop, label: label4, hasValue, onClear, widget, span,
   `;
 }
 
-// src/ui/expression-editor.js
+// src/ui/expression-editor.ts
 init_lit_html();
 init_live();
 var UNARY_OPS2 = new Set(["!", "-"]);
@@ -268991,7 +270522,8 @@ function renderExpressionEditor(node2, onChange, opts) {
       }
       if (newInfo.needsValue) {
         if (newInfo.valueIsNode) {
-          updated.value = safeNode.value?.operator ? safeNode.value : { operator: "!", target: null };
+          const val = safeNode.value;
+          updated.value = val?.operator ? safeNode.value : { operator: "!", target: null };
         } else if (newInfo.spliceArray) {
           updated.value = Array.isArray(safeNode.value) ? safeNode.value : [null];
         } else {
@@ -269058,7 +270590,7 @@ function renderExpressionEditor(node2, onChange, opts) {
   `;
 }
 
-// src/ui/media-picker.js
+// src/ui/media-picker.ts
 init_lit_html();
 init_live();
 init_platform3();
@@ -269169,7 +270701,7 @@ function renderMediaPicker(prop, value2, onCommit) {
   `;
 }
 
-// src/panels/signals-panel.js
+// src/panels/signals-panel.ts
 var expandedSignal = null;
 var advancedParamOpen = new Set;
 var DEF_TEMPLATES = {
@@ -269312,7 +270844,6 @@ function resolveDefaultForCanvas(value2, defs) {
   return `{${defName}}`;
 }
 function signalFieldRow(label4, value2, onChange) {
-  let debounce;
   return renderFieldRow({
     prop: label4,
     label: label4,
@@ -269320,10 +270851,11 @@ function signalFieldRow(label4, value2, onChange) {
     widget: html3`
       <sp-textfield
         size="s"
-        value=${value2}
-        @input=${(e) => {
-      clearTimeout(debounce);
-      debounce = setTimeout(() => onChange(e.target.value), 400);
+        .value=${value2}
+        @change=${(e) => {
+      const v = e.target.value;
+      if (v !== value2)
+        onChange(v);
     }}
       ></sp-textfield>
     `
@@ -269422,7 +270954,7 @@ function renderSignalsTemplate(S, ctx) {
       transactDoc(activeTab.value, (t) => mutateAddDef(t, n3, { $prototype: protoName }));
       expandedSignal = n3;
       if (src) {
-        fetchPluginSchema({ $prototype: protoName, $src: src }, S).then(() => ctx.renderLeftPanel());
+        fetchPluginSchema({ $prototype: protoName, $src: src }, { ...S.documentPath != null && { documentPath: S.documentPath } }).then(() => ctx.renderLeftPanel());
       } else {
         ctx.renderLeftPanel();
       }
@@ -269729,10 +271261,7 @@ function renderParameterEditorTemplate(S, name, def3, ctx) {
             @keydown=${(e) => {
         if (e.key === "Enter" && e.target.value.trim()) {
           transactDoc(activeTab.value, (t) => mutateUpdateDef(t, name, {
-            parameters: [
-              ...params,
-              { name: e.target.value.trim() }
-            ]
+            parameters: [...params, { name: e.target.value.trim() }]
           }));
         }
       }}
@@ -269775,10 +271304,9 @@ function renderParameterEditorTemplate(S, name, def3, ctx) {
                 style="flex:1"
                 @change=${(e) => {
       const next2 = [...params];
-      next2[i2] = {
-        ...next2[i2],
-        type: e.target.value ? { text: e.target.value } : undefined
-      };
+      const val = e.target.value;
+      const { type: _t, ...rest } = next2[i2];
+      next2[i2] = val ? { ...rest, type: { text: val } } : rest;
       transactDoc(activeTab.value, (t) => mutateUpdateDef(t, name, { parameters: next2 }));
     }}
               />
@@ -269789,10 +271317,9 @@ function renderParameterEditorTemplate(S, name, def3, ctx) {
                 style="flex:2"
                 @change=${(e) => {
       const next2 = [...params];
-      next2[i2] = {
-        ...next2[i2],
-        description: e.target.value || undefined
-      };
+      const val = e.target.value;
+      const { description: _d, ...rest } = next2[i2];
+      next2[i2] = val ? { ...rest, description: val } : rest;
       transactDoc(activeTab.value, (t) => mutateUpdateDef(t, name, { parameters: next2 }));
     }}
               />
@@ -269802,10 +271329,9 @@ function renderParameterEditorTemplate(S, name, def3, ctx) {
                 .checked=${!!p.optional}
                 @change=${(e) => {
       const next2 = [...params];
-      next2[i2] = {
-        ...next2[i2],
-        optional: e.target.checked || undefined
-      };
+      const checked = e.target.checked;
+      const { optional: _o, ...rest } = next2[i2];
+      next2[i2] = checked ? { ...rest, optional: true } : rest;
       transactDoc(activeTab.value, (t) => mutateUpdateDef(t, name, { parameters: next2 }));
     }}
               />
@@ -269867,10 +271393,9 @@ function renderEmitsEditorTemplate(S, name, def3) {
             style="flex:1"
             @change=${(e) => {
     const next2 = [...emits];
-    next2[i2] = {
-      ...next2[i2],
-      type: e.target.value ? { text: e.target.value } : undefined
-    };
+    const val = e.target.value;
+    const { type: _t, ...rest } = next2[i2];
+    next2[i2] = val ? { ...rest, type: { text: val } } : rest;
     transactDoc(activeTab.value, (t) => mutateUpdateDef(t, name, { emits: next2 }));
   }}
           />
@@ -269881,10 +271406,9 @@ function renderEmitsEditorTemplate(S, name, def3) {
             style="flex:2"
             @change=${(e) => {
     const next2 = [...emits];
-    next2[i2] = {
-      ...next2[i2],
-      description: e.target.value || undefined
-    };
+    const val = e.target.value;
+    const { description: _d, ...rest } = next2[i2];
+    next2[i2] = val ? { ...rest, description: val } : rest;
     transactDoc(activeTab.value, (t) => mutateUpdateDef(t, name, { emits: next2 }));
   }}
           />
@@ -270172,7 +271696,9 @@ function renderExternalPrototypeEditorTemplate(S, name, def3, ctx) {
       >
         Loading schema…
       </div>`;
-      fetchPluginSchema(def3, S).then((schema4) => {
+      fetchPluginSchema(def3, {
+        ...S.documentPath != null && { documentPath: S.documentPath }
+      }).then((schema4) => {
         if (schema4)
           ctx.renderLeftPanel();
       });
@@ -270196,7 +271722,7 @@ function renderExternalPrototypeEditorTemplate(S, name, def3, ctx) {
   `;
 }
 
-// src/panels/preview-render.js
+// src/panels/preview-render.ts
 function renderCanvasNode(node2, path2, parent, activeBreakpoints, featureToggles) {
   if (typeof node2 === "string" || typeof node2 === "number" || typeof node2 === "boolean") {
     parent.appendChild(document.createTextNode(String(node2)));
@@ -270263,7 +271789,7 @@ function renderCanvasNode(node2, path2, parent, activeBreakpoints, featureToggle
   return el;
 }
 
-// src/panels/canvas-dnd.js
+// src/panels/canvas-dnd.ts
 init_store();
 init_workspace2();
 // ../../node_modules/.bun/@babel+runtime@7.29.7/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js
@@ -270452,12 +271978,12 @@ function extractInstruction(userData) {
   return (_ref5 = userData[uniqueKey]) !== null && _ref5 !== undefined ? _ref5 : null;
 }
 
-// src/panels/dnd.js
+// src/panels/dnd.ts
 init_store();
 init_workspace2();
 init_components();
 
-// src/panels/stylebook-panel.js
+// src/panels/stylebook-panel.ts
 init_lit_html();
 init_ref();
 init_class_map();
@@ -270672,7 +272198,7 @@ registerBlockType( name, settings );`
   }
 };
 
-// src/panels/stylebook-panel.js
+// src/panels/stylebook-panel.ts
 function _resolveNestedStyle(style2, tagPath) {
   const parts = tagPath.split(" ");
   let obj = style2;
@@ -270719,7 +272245,10 @@ function renderStylebookMode(ctx) {
           @input=${onFilterInput2}
         />
         <button
-          class=${classMap({ "tb-toggle": true, active: tab?.session.ui.stylebookCustomizedOnly })}
+          class=${classMap({
+    "tb-toggle": true,
+    active: !!tab?.session.ui.stylebookCustomizedOnly
+  })}
           @click=${onCustomizedToggle}
         >
           Customized
@@ -270826,7 +272355,7 @@ function refreshStylebookStyles() {
         }
         if (activeBreakpoints.size > 0) {
           for (const [key, val] of Object.entries(tagStyle)) {
-            if (!key.startsWith("@") || typeof val !== "object")
+            if (!key.startsWith("@") || typeof val !== "object" || val === null)
               continue;
             const mediaName = key.slice(1);
             if (mediaName === "--")
@@ -270845,7 +272374,7 @@ function refreshStylebookStyles() {
       }
       if (activeBreakpoints.size > 0) {
         for (const [key, val] of Object.entries(rootStyle)) {
-          if (!key.startsWith("@") || typeof val !== "object")
+          if (!key.startsWith("@") || typeof val !== "object" || val === null)
             continue;
           const mediaName = key.slice(1);
           if (mediaName === "--")
@@ -270945,7 +272474,7 @@ function buildStylebookElement(entry, rootStyle, activeBreakpoints, parentTag =
     }
     if (activeBreakpoints) {
       for (const [key, val] of Object.entries(tagStyle)) {
-        if (!key.startsWith("@") || typeof val !== "object")
+        if (!key.startsWith("@") || typeof val !== "object" || val === null)
           continue;
         const mediaName = key.slice(1);
         if (mediaName === "--")
@@ -270965,7 +272494,7 @@ function buildStylebookElement(entry, rootStyle, activeBreakpoints, parentTag =
   if (activeBreakpoints) {
     const tagPath = compoundTag || entry.tag;
     for (const [key, val] of Object.entries(rootStyle)) {
-      if (!key.startsWith("@") || typeof val !== "object")
+      if (!key.startsWith("@") || typeof val !== "object" || val === null)
         continue;
       const mediaName = key.slice(1);
       if (mediaName === "--")
@@ -271030,7 +272559,7 @@ function hasTagStyle(rootStyle, tag3) {
   if (s2 && typeof s2 === "object" && Object.keys(s2).length > 0)
     return true;
   for (const [key, val] of Object.entries(rootStyle)) {
-    if (!key.startsWith("@") || typeof val !== "object")
+    if (!key.startsWith("@") || typeof val !== "object" || val === null)
       continue;
     const ms = _resolveNestedStyle(val, tag3);
     if (ms && typeof ms === "object" && Object.keys(ms).length > 0)
@@ -271218,7 +272747,7 @@ function findStylebookEl(canvasEl, tag3) {
   return null;
 }
 
-// src/panels/dnd.js
+// src/panels/dnd.ts
 function registerLayersDnD() {
   requestAnimationFrame(() => {
     const container = leftPanel?.querySelector(".layers-container");
@@ -271483,7 +273012,7 @@ function applyDropInstruction(instruction, srcData, targetPath) {
             return ref3 && (ref3 === `./${comp.path}` || ref3.endsWith(comp.path.split("/").pop()));
           });
           if (!alreadyImported) {
-            const relPath = computeRelativePath(tab?.documentPath, comp.path);
+            const relPath = computeRelativePath(tab?.documentPath ?? null, comp.path);
             transact(activeTab.value, (doc2) => {
               if (!doc2.$elements)
                 doc2.$elements = [];
@@ -271496,7 +273025,7 @@ function applyDropInstruction(instruction, srcData, targetPath) {
   }
 }
 
-// src/panels/canvas-dnd.js
+// src/panels/canvas-dnd.ts
 var _activeDropEl = null;
 function registerPanelDnD(panel) {
   const { canvas, dropLine } = panel;
@@ -271645,18 +273174,18 @@ function showCanvasDropIndicator(el, elPath, isLeaf2, panel) {
   dropLine.className = "canvas-drop-indicator line";
 }
 
-// src/panels/panel-events.js
+// src/panels/panel-events.ts
 init_store();
 init_workspace2();
 
-// src/editor/context-menu.js
+// src/editor/context-menu.ts
 init_lit_html();
 init_ref();
 init_html_to_jx();
 init_store();
 init_workspace2();
 
-// src/editor/convert-to-repeater.js
+// src/editor/convert-to-repeater.ts
 init_lit_html();
 init_ref();
 init_store();
@@ -271703,8 +273232,24 @@ async function convertToRepeater() {
     };
   });
 }
-function promptRepeaterConfig(defs) {
+async function promptRepeaterConfig(defs) {
   const arrayDefs = Object.entries(defs).filter(([, d2]) => d2?.type === "array" || Array.isArray(d2?.default) || d2?.$prototype === "Array");
+  const tab = activeTab.value;
+  const docPath = tab?.documentPath;
+  for (const [name, d2] of Object.entries(defs)) {
+    const def3 = d2;
+    if (!def3?.$prototype || def3.$prototype === "Function" || def3.$prototype === "Array")
+      continue;
+    if (arrayDefs.some(([n2]) => n2 === name))
+      continue;
+    const schema4 = await fetchPluginSchema({
+      ...def3.$src != null && { $src: def3.$src },
+      $prototype: def3.$prototype
+    }, { ...docPath != null && { documentPath: docPath } });
+    if (schema4?.returns?.type === "array") {
+      arrayDefs.push([name, d2]);
+    }
+  }
   const fnDefs = Object.entries(defs).filter(([, d2]) => defCategory(d2) === "function");
   let source = arrayDefs.length > 0 ? arrayDefs[0][0] : "__new__";
   let newDefName = "";
@@ -271731,16 +273276,16 @@ function promptRepeaterConfig(defs) {
           return;
         }
         done({
-          items: { $ref: `#/$defs/${name}` },
-          filter: filterDef ? { $ref: `#/$defs/${filterDef}` } : undefined,
-          sort: sortDef ? { $ref: `#/$defs/${sortDef}` } : undefined,
+          items: { $ref: `#/state/${name}` },
+          ...filterDef && { filter: { $ref: `#/state/${filterDef}` } },
+          ...sortDef && { sort: { $ref: `#/state/${sortDef}` } },
           newDef: { name }
         });
       } else {
         done({
-          items: { $ref: `#/$defs/${source}` },
-          filter: filterDef ? { $ref: `#/$defs/${filterDef}` } : undefined,
-          sort: sortDef ? { $ref: `#/$defs/${sortDef}` } : undefined
+          items: { $ref: `#/state/${source}` },
+          ...filterDef && { filter: { $ref: `#/state/${filterDef}` } },
+          ...sortDef && { sort: { $ref: `#/state/${sortDef}` } }
         });
       }
     }
@@ -271848,10 +273393,10 @@ function promptRepeaterConfig(defs) {
   });
 }
 
-// src/editor/context-menu.js
+// src/editor/context-menu.ts
 init_components();
 
-// src/panels/layers-panel.js
+// src/panels/layers-panel.ts
 init_lit_html();
 init_class_map();
 init_if_defined();
@@ -271866,14 +273411,17 @@ function startLayerTitleEdit(path2, rerender) {
   if (!label4)
     return;
   const tab = activeTab.value;
-  const node2 = getNodeAtPath(tab?.doc.document, path2);
+  if (!tab)
+    return;
+  const node2 = getNodeAtPath(tab.doc.document, path2);
   if (!node2)
     return;
   label4.style.display = "none";
   const input = document.createElement("input");
   input.className = "layer-title-input";
   input.value = node2.$title || "";
-  input.placeholder = nodeLabel({ ...node2, $title: undefined });
+  const { $title: _, ...nodeWithoutTitle } = node2;
+  input.placeholder = nodeLabel(nodeWithoutTitle);
   label4.after(input);
   input.focus();
   input.select();
@@ -271888,7 +273436,7 @@ function startLayerTitleEdit(path2, rerender) {
     committed = true;
     cleanup();
     const val = input.value.trim();
-    transactDoc(activeTab.value, (t) => mutateUpdateProperty(t, path2, "$title", val || undefined));
+    transactDoc(tab, (t) => mutateUpdateProperty(t, path2, "$title", val || undefined));
     rerender();
   };
   const cancel = () => {
@@ -271915,7 +273463,7 @@ function renderLayersTemplate(ctx) {
   for (const fn of view.dndCleanups)
     fn();
   view.dndCleanups = [];
-  const rows = flattenTree(tab?.doc.document);
+  const rows = flattenTree(tab.doc.document);
   const collapsed2 = view._layersCollapsed || (view._layersCollapsed = new Set);
   const layerRows = [];
   for (const { node: node2, path: path2, depth, nodeType } of rows) {
@@ -271949,12 +273497,12 @@ function renderLayersTemplate(ctx) {
     const jxNode = node2;
     if (path2.length >= 2 && nodeType === "element") {
       const pPath = parentElementPath(path2);
-      const parentNode2 = pPath ? getNodeAtPath(tab?.doc.document, pPath) : null;
+      const parentNode2 = pPath ? getNodeAtPath(tab.doc.document, pPath) : null;
       if (parentNode2 && isInlineElement(jxNode, parentNode2))
         continue;
     }
     const key = pathKey(path2);
-    const isSelected = pathsEqual(path2, tab?.session.selection);
+    const isSelected = pathsEqual(path2, tab.session.selection);
     const hasChildren = Array.isArray(jxNode.children) && jxNode.children.length > 0;
     const hasMapChildren = jxNode.children && typeof jxNode.children === "object" && jxNode.children.$prototype === "Array";
     const hasCases = jxNode.$switch && jxNode.cases && typeof jxNode.cases === "object" && Object.keys(jxNode.cases).length > 0;
@@ -271993,7 +273541,7 @@ function renderLayersTemplate(ctx) {
     const isRoot = tab?.doc.mode === "content" ? path2.length === 0 : path2.length < 2;
     const idx = isElement ? childIndex(path2) : 0;
     const parentPath = isElement && !isRoot ? parentElementPath(path2) : null;
-    const parentNode = parentPath ? getNodeAtPath(tab?.doc.document, parentPath) : null;
+    const parentNode = parentPath ? getNodeAtPath(tab.doc.document, parentPath) : null;
     const siblingCount = parentNode?.children?.length || 0;
     const canMoveUp = isElement && !isRoot && idx > 0;
     const canMoveDown = isElement && !isRoot && idx < siblingCount - 1;
@@ -272086,7 +273634,7 @@ function renderLayersTemplate(ctx) {
       e.currentTarget.blur();
       const pp = parentPath;
       const prevPath = [...pp, idx - 1];
-      const prev = getNodeAtPath(activeTab.value?.doc.document, prevPath);
+      const prev = getNodeAtPath(activeTab.value.doc.document, prevPath);
       const len = prev?.children?.length || 0;
       transactDoc(activeTab.value, (t) => mutateMoveNode(t, path2, prevPath, len));
     }}
@@ -272152,7 +273700,7 @@ function renderLayersTemplate(ctx) {
   `;
 }
 
-// src/editor/context-menu.js
+// src/editor/context-menu.ts
 var JX_MIME = "web application/jx+json";
 function nodeToHtml(node2) {
   if (typeof node2 === "string")
@@ -272292,7 +273840,9 @@ function showContextMenu(e, path2, opts = {}) {
   e.preventDefault();
   dismissContextMenu();
   const tab = activeTab.value;
-  const node2 = getNodeAtPath(tab?.doc.document, path2);
+  if (!tab)
+    return;
+  const node2 = getNodeAtPath(tab.doc.document, path2);
   if (!node2)
     return;
   tab.session.selection = path2;
@@ -272452,7 +274002,7 @@ function showContextMenu(e, path2, opts = {}) {
   });
 }
 
-// src/editor/insertion-helper.js
+// src/editor/insertion-helper.ts
 init_workspace2();
 var _ctx8 = null;
 var _helper = null;
@@ -272629,7 +274179,7 @@ function onSlashSelect(cmd, point4) {
   hide2();
 }
 
-// src/panels/panel-events.js
+// src/panels/panel-events.ts
 var _ctx9 = null;
 function initPanelEvents(ctx) {
   _ctx9 = ctx;
@@ -272798,7 +274348,7 @@ function registerPanelEvents(panel) {
   view.canvasEventCleanups.push(() => unmount());
 }
 
-// src/canvas/canvas-diff.js
+// src/canvas/canvas-diff.ts
 function valuesEqual(a, b) {
   if (a === b)
     return true;
@@ -272896,7 +274446,7 @@ function computeDocumentDiff(originalDoc, currentDoc) {
   return { byPath: diffMap, allPaths };
 }
 
-// src/panels/pseudo-preview.js
+// src/panels/pseudo-preview.ts
 init_store();
 init_workspace2();
 var pseudoStyleHost = document.createElement("div");
@@ -272940,7 +274490,7 @@ function updateForcedPseudoPreview() {
   view.forcedStyleTag = tag3;
 }
 
-// src/panels/editors.js
+// src/panels/editors.ts
 init_lit_html();
 init_ref();
 init_store();
@@ -273107,7 +274657,7 @@ function registerFunctionCompletions() {
   });
 }
 
-// src/panels/overlays.js
+// src/panels/overlays.ts
 init_lit_html();
 init_style_map();
 init_store();
@@ -273237,7 +274787,7 @@ function _flush() {
   _ctx10.renderBlockActionBar();
 }
 
-// src/canvas/canvas-render.js
+// src/canvas/canvas-render.ts
 var _ctx11 = null;
 var _prevStylebookFilter = "";
 var _prevStylebookCustomizedOnly = false;
@@ -273385,6 +274935,8 @@ function renderCanvas() {
       clearTimeout(debounce);
       debounce = setTimeout(() => {
         const tab2 = activeTab.value;
+        if (!tab2)
+          return;
         if (lang === "json") {
           try {
             tab2.doc.document = JSON.parse(editor2.getValue());
@@ -273544,10 +275096,15 @@ function renderCanvas() {
         ${panelEntries.map((e) => e.tpl)}
       </div>
     `, canvasWrap);
-  for (const { panel, activeSet } of panelEntries) {
+  for (let i2 = 0;i2 < panelEntries.length; i2++) {
+    const { panel, activeSet } = panelEntries[i2];
     const p = panel;
     canvasPanels.push(p);
-    renderCanvasIntoPanel(p, activeSet, featureToggles);
+    if (i2 === 0) {
+      renderCanvasIntoPanel(p, activeSet, featureToggles);
+    } else {
+      setTimeout(() => renderCanvasIntoPanel(p, activeSet, featureToggles), 0);
+    }
   }
   updateActivePanelHeaders();
   applyTransform();
@@ -273662,7 +275219,7 @@ function renderOverlays() {
   render4();
 }
 
-// src/files/files.js
+// src/files/files.ts
 init_lit_html();
 init_class_map();
 init_ref();
@@ -273715,7 +275272,10 @@ async function loadProject() {
     }
   } catch {}
 }
-async function openProject({ renderActivityBar, renderLeftPanel }) {
+async function openProject({
+  renderActivityBar,
+  renderLeftPanel
+}) {
   try {
     const platform3 = getPlatform();
     const result = await platform3.openProject();
@@ -274327,7 +275887,7 @@ async function openFileInTab(path2) {
       id,
       documentPath: path2,
       document: document4,
-      frontmatter: frontmatter2,
+      ...frontmatter2 != null && { frontmatter: frontmatter2 },
       sourceFormat: path2.endsWith(".md") ? "md" : null
     });
     requireProjectState().selectedPath = path2;
@@ -274364,7 +275924,7 @@ async function reloadFileInTab(path2) {
   }
 }
 
-// src/panels/imports-panel.js
+// src/panels/imports-panel.ts
 init_lit_html();
 init_components();
 init_store();
@@ -274629,9 +276189,7 @@ function renderDocumentLevelImports({
               <div class="imports-list">
                 ${refEntries.map((entry) => html3`
                     <div class="import-row">
-                      <span
-                        class="import-path"
-                        title=${entry.$ref}
+                      <span class="import-path" title=${entry.$ref}
                         >${entry.$ref}</span
                       >
                       <sp-action-button
@@ -274717,19 +276275,22 @@ function renderDocumentLevelImports({
   `;
 }
 
-// src/panels/head-panel.js
+// src/panels/head-panel.ts
 init_lit_html();
 init_live();
 init_store();
 init_workspace2();
 
-// src/utils/studio-utils.js
+// src/utils/studio-utils.ts
 function camelToKebab3(str) {
   return str.replace(/[A-Z]/g, (c) => "-" + c.toLowerCase());
 }
 function camelToLabel(prop) {
   return prop.replace(/([A-Z])/g, " $1").replace(/^./, (c) => c.toUpperCase());
 }
+function toCamelCase(str) {
+  return str.replace(/[^a-zA-Z0-9]+(.)?/g, (_, c) => c ? c.toUpperCase() : "").replace(/^[A-Z]/, (c) => c.toLowerCase());
+}
 function kebabToLabel(val) {
   return val.replace(/(^|-)(\w)/g, (_, sep2, c) => (sep2 ? " " : "") + c.toUpperCase());
 }
@@ -274834,7 +276395,7 @@ function parseCemType(typeText) {
   return { kind: "text" };
 }
 
-// src/utils/google-fonts.js
+// src/utils/google-fonts.ts
 var GFONTS_CSS_PREFIX = "https://fonts.googleapis.com/css2?";
 var GFONTS_PRECONNECT_ORIGINS = [
   "https://fonts.googleapis.com",
@@ -274874,7 +276435,7 @@ function cleanupGoogleFontPreconnects(head) {
   return head;
 }
 
-// src/panels/head-panel.js
+// src/panels/head-panel.ts
 init_platform3();
 var layoutEntries = null;
 async function loadLayoutEntries() {
@@ -275018,7 +276579,11 @@ function renderMetaFieldRow(field, head, applyMutation) {
     widget
   });
 }
-function renderHeadTemplate({ document: doc, applyMutation, renderLeftPanel }) {
+function renderHeadTemplate({
+  document: doc,
+  applyMutation,
+  renderLeftPanel
+}) {
   const head = doc.$head ?? [];
   const title = doc.title ?? "";
   const iconEntry = findLinkEntry(head, "icon");
@@ -275236,8 +276801,9 @@ function renderFrontmatterSection() {
     return nothing;
   const fm = tab.doc.content?.frontmatter || {};
   const col = findContentTypeSchema(tab.documentPath, projectState?.projectConfig);
-  const schemaProps = col?.schema?.properties;
-  const requiredFields = new Set(col?.schema?.required || []);
+  const schema4 = col?.schema;
+  const schemaProps = schema4?.properties;
+  const requiredFields = new Set(schema4?.required || []);
   const fields = [];
   if (schemaProps) {
     for (const [field, fieldSchema] of Object.entries(schemaProps)) {
@@ -275384,10 +276950,10 @@ function renderFmField(field, entry, value2, requiredFields) {
   });
 }
 
-// src/studio.js
+// src/studio.ts
 init_platform3();
 
-// src/platforms/devserver.js
+// src/platforms/devserver.ts
 function createDevServerPlatform() {
   let _projectRoot = "";
   function serverPath(rel) {
@@ -275807,7 +277373,7 @@ function createDevServerPlatform() {
   };
 }
 
-// src/resize-edges.js
+// src/resize-edges.ts
 var g2 = globalThis;
 var EDGES = [
   "top",
@@ -275874,7 +277440,7 @@ async function startResize(e, edge, wc) {
   document.addEventListener("mouseup", onUp);
 }
 
-// src/studio.js
+// src/studio.ts
 init_components();
 init_lit_html();
 // data/webdata.json
@@ -277494,7 +279060,7 @@ var webdata_default = {
   ]
 };
 
-// src/panels/data-explorer.js
+// src/panels/data-explorer.ts
 init_lit_html();
 init_class_map();
 var expandedDataKeys = new Set;
@@ -277580,8 +279146,8 @@ function renderDataTreeTemplate(value2, depth, maxDepth = 5) {
     </div>`;
   }
   if (Array.isArray(value2)) {
-    const cap3 = 20;
-    const items2 = value2.slice(0, cap3).map((item, i2) => {
+    const cap4 = 20;
+    const items2 = value2.slice(0, cap4).map((item, i2) => {
       if (item === null || item === undefined || typeof item !== "object") {
         const valText = typeof item === "string" && item.length > 80 ? `"${item.slice(0, 80)}…"` : JSON.stringify(item);
         return html3`<div class="data-branch" style="padding-left:${indent2}">
@@ -277598,14 +279164,14 @@ function renderDataTreeTemplate(value2, depth, maxDepth = 5) {
         ${renderDataTreeTemplate(item, depth + 1, maxDepth)}
       `;
     });
-    return html3`${items2}${value2.length > cap3 ? html3`<div class="data-leaf data-ellipsis" style="padding-left:${indent2}">
-          … ${value2.length - cap3} more
+    return html3`${items2}${value2.length > cap4 ? html3`<div class="data-leaf data-ellipsis" style="padding-left:${indent2}">
+          … ${value2.length - cap4} more
         </div>` : nothing}`;
   }
   const obj = value2;
   const keys = Object.keys(obj);
-  const cap2 = 30;
-  const items = keys.slice(0, cap2).map((key) => {
+  const cap3 = 30;
+  const items = keys.slice(0, cap3).map((key) => {
     const v = obj[key];
     if (v === null || v === undefined || typeof v !== "object") {
       const valText = typeof v === "string" && v.length > 80 ? `"${v.slice(0, 80)}…"` : JSON.stringify(v);
@@ -277623,8 +279189,8 @@ function renderDataTreeTemplate(value2, depth, maxDepth = 5) {
       ${renderDataTreeTemplate(v, depth + 1, maxDepth)}
     `;
   });
-  return html3`${items}${keys.length > cap2 ? html3`<div class="data-leaf data-ellipsis" style="padding-left:${indent2}">
-        … ${keys.length - cap2} more
+  return html3`${items}${keys.length > cap3 ? html3`<div class="data-leaf data-ellipsis" style="padding-left:${indent2}">
+        … ${keys.length - cap3} more
       </div>` : nothing}`;
 }
 
@@ -281663,7 +283229,7 @@ __decorateClass21([
   query("#form")
 ], Search.prototype, "form", 2);
 
-// src/ui/spectrum.js
+// src/ui/spectrum.ts
 init_Popover_dev();
 
 // ../../node_modules/.bun/@spectrum-web-components+menu@1.12.1/node_modules/@spectrum-web-components/menu/src/Menu.dev.js
@@ -289832,10 +291398,10 @@ function $6c7bd7858deea686$var$getSymbols(locale, formatter2, intlOptions, origi
     index: index2
   };
 }
-function $6c7bd7858deea686$var$replaceAll(str, find2, replace2) {
+function $6c7bd7858deea686$var$replaceAll(str, find3, replace2) {
   if (str.replaceAll)
-    return str.replaceAll(find2, replace2);
-  return str.split(find2).join(replace2);
+    return str.replaceAll(find3, replace2);
+  return str.split(find3).join(replace2);
 }
 function $6c7bd7858deea686$var$escapeRegex(string6) {
   return string6.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
@@ -293597,7 +295163,7 @@ class Divider extends DividerBase {
 }
 Divider.styles = [divider_css_default];
 
-// src/ui/spectrum.js
+// src/ui/spectrum.ts
 init_Tooltip_dev();
 init_Overlay_dev();
 
@@ -294749,7 +296315,7 @@ __decorateClass50([
   property({ reflect: true })
 ], HelpText.prototype, "variant", 2);
 
-// src/ui/spectrum.js
+// src/ui/spectrum.ts
 init_Underlay_dev();
 
 // ../../node_modules/.bun/@spectrum-web-components+accordion@1.12.1/node_modules/@spectrum-web-components/accordion/src/Accordion.dev.js
@@ -300766,7 +302332,7 @@ class IconCheckmark extends IconBase {
   }
 }
 
-// src/ui/value-selector.js
+// src/ui/value-selector.ts
 init_lit();
 init_live2();
 
@@ -300867,7 +302433,7 @@ class JxValueSelector extends LitElement {
   }
 }
 
-// src/ui/color-selector.js
+// src/ui/color-selector.ts
 init_lit();
 init_lit_html();
 init_live();
@@ -301097,7 +302663,7 @@ function isColorPopoverOpen() {
   return !!document.querySelector(".style-input-color sp-overlay[open]");
 }
 
-// src/ui/spectrum.js
+// src/ui/spectrum.ts
 var components = [
   ["sp-theme", Theme],
   ["sp-tabs", Tabs],
@@ -301234,7 +302800,7 @@ Theme.registerThemeFragment("spectrum", "system", theme_css_default);
 Theme.registerThemeFragment("dark", "color", theme_dark_css_default);
 Theme.registerThemeFragment("medium", "scale", scale_medium_css_default);
 
-// src/ui/panel-resize.js
+// src/ui/panel-resize.ts
 var STORAGE_KEY3 = "jx-studio-panel-widths";
 var MIN_WIDTH2 = 160;
 var MAX_RATIO = 0.5;
@@ -301303,11 +302869,11 @@ if (resizeLeft)
 if (resizeRight)
   setupHandle(resizeRight, "--panel-w-right", "right", DEFAULT_RIGHT);
 
-// src/editor/shortcuts.js
+// src/editor/shortcuts.ts
 init_store();
 init_workspace2();
 
-// src/panels/quick-search.js
+// src/panels/quick-search.ts
 init_lit_html();
 init_class_map();
 init_live();
@@ -301454,7 +303020,7 @@ function renderOverlay() {
   render2(tpl, container);
 }
 
-// src/editor/shortcuts.js
+// src/editor/shortcuts.ts
 function initShortcuts(getContext) {
   canvasWrap.addEventListener("wheel", (e20) => {
     const { canvasMode, panX, panY, setPan, applyTransform: applyTransform2 } = getContext();
@@ -301706,23 +303272,23 @@ function navigateSelection(direction = -1) {
   }
 }
 
-// src/panels/activity-bar.js
+// src/panels/activity-bar.ts
 init_lit_html();
 init_store();
 init_reactivity();
 init_workspace2();
 
-// src/settings/settings-modal.js
+// src/settings/settings-modal.ts
 init_lit_html();
 init_class_map();
 init_ref();
 
-// src/settings/defs-editor.js
+// src/settings/defs-editor.ts
 init_lit_html();
 init_platform3();
 init_store();
 
-// src/settings/schema-field-ui.js
+// src/settings/schema-field-ui.ts
 init_lit_html();
 var FIELD_TYPES = ["string", "number", "boolean", "array", "object", "reference"];
 var FORMAT_OPTIONS = ["", "image", "date", "color"];
@@ -301747,6 +303313,9 @@ function fieldCardTpl(fieldName, fieldSchema, isRequired, handlers, contentTypeN
   return html3`
     <div class="schema-field-card">
       <div class="schema-field-row">
+        <sp-field-label size="s" class="schema-field-label"
+          >${camelToLabel(fieldName)}</sp-field-label
+        >
         <sp-textfield
           size="s"
           quiet
@@ -302011,7 +303580,7 @@ function yamlDefault(type2, format3) {
   }
 }
 
-// src/settings/defs-editor.js
+// src/settings/defs-editor.ts
 var selectedDef = null;
 var showAddField = false;
 var newFieldState = { name: "", type: "string", format: "", required: false };
@@ -302341,7 +303910,7 @@ function renderDefsEditor(container) {
   render2(tpl, container);
 }
 
-// src/settings/content-types-editor.js
+// src/settings/content-types-editor.ts
 init_lit_html();
 init_repeat();
 init_platform3();
@@ -302385,9 +303954,10 @@ function handleNewContentType(rerender) {
   });
 }
 function handleAddField2(rerender) {
-  const name = newFieldState2.name.trim();
-  if (!name || !selectedContentType)
+  const raw = newFieldState2.name.trim();
+  if (!raw || !selectedContentType)
     return;
+  const name = toCamelCase(raw);
   const schema4 = getSelectedSchema();
   if (!schema4)
     return;
@@ -302432,15 +304002,16 @@ function handleToggleRequired2(fieldName, rerender) {
 }
 function handleRenameField2(oldName, newName, rerender) {
   const schema4 = getSelectedSchema();
-  if (!schema4?.properties || !newName || schema4.properties[newName])
+  const normalized = toCamelCase(newName);
+  if (!schema4?.properties || !normalized || schema4.properties[normalized])
     return;
   const newProps = {};
   for (const [key, val] of Object.entries(schema4.properties)) {
-    newProps[key === oldName ? newName : key] = val;
+    newProps[key === oldName ? normalized : key] = val;
   }
   schema4.properties = newProps;
   if (schema4.required) {
-    schema4.required = schema4.required.map((r8) => r8 === oldName ? newName : r8);
+    schema4.required = schema4.required.map((r8) => r8 === oldName ? normalized : r8);
   }
   rerender();
   saveProjectConfig2();
@@ -302477,14 +304048,17 @@ function handleAddNestedField2(parentName, fieldState, rerender) {
   const parent = schema4?.properties?.[parentName];
   if (!parent)
     return;
+  const name = toCamelCase(fieldState.name);
+  if (!name)
+    return;
   if (!parent.properties)
     parent.properties = {};
-  parent.properties[fieldState.name] = schemaForType(fieldState.type);
+  parent.properties[name] = schemaForType(fieldState.type);
   if (fieldState.required) {
     if (!parent.required)
       parent.required = [];
-    if (!parent.required.includes(fieldState.name))
-      parent.required.push(fieldState.name);
+    if (!parent.required.includes(name))
+      parent.required.push(name);
   }
   rerender();
   saveProjectConfig2();
@@ -302519,15 +304093,16 @@ function handleToggleNestedRequired2(parentName, childName, rerender) {
 function handleRenameNested2(parentName, oldChild, newChild, rerender) {
   const schema4 = getSelectedSchema();
   const parent = schema4?.properties?.[parentName];
-  if (!parent?.properties || !newChild || parent.properties[newChild])
+  const normalized = toCamelCase(newChild);
+  if (!parent?.properties || !normalized || parent.properties[normalized])
     return;
   const newProps = {};
   for (const [key, val] of Object.entries(parent.properties)) {
-    newProps[key === oldChild ? newChild : key] = val;
+    newProps[key === oldChild ? normalized : key] = val;
   }
   parent.properties = newProps;
   if (parent.required) {
-    parent.required = parent.required.map((r8) => r8 === oldChild ? newChild : r8);
+    parent.required = parent.required.map((r8) => r8 === oldChild ? normalized : r8);
   }
   rerender();
   saveProjectConfig2();
@@ -302688,7 +304263,7 @@ function renderContentTypesEditor(container) {
   render2(tpl, container);
 }
 
-// src/settings/css-vars-editor.js
+// src/settings/css-vars-editor.ts
 init_lit_html();
 init_ref();
 init_store();
@@ -302912,7 +304487,7 @@ function renderAddRow(prefix, placeholder, valuePlaceholder, addVar) {
   `;
 }
 
-// src/settings/head-editor.js
+// src/settings/head-editor.ts
 init_lit_html();
 init_store();
 function renderHeadEditor(container) {
@@ -303150,7 +304725,7 @@ function renderGoogleFontsSection(headEntries, save, rerender) {
   `;
 }
 
-// src/settings/general-settings.js
+// src/settings/general-settings.ts
 init_lit_html();
 init_store();
 init_platform3();
@@ -303300,7 +304875,7 @@ function renderGeneralSettings(container) {
   render2(tpl, container);
 }
 
-// src/settings/settings-modal.js
+// src/settings/settings-modal.ts
 var _handle = null;
 var _activeSection = "general";
 var _contentEl = null;
@@ -303395,7 +304970,7 @@ function renderActiveSection() {
   }
 }
 
-// src/panels/activity-bar.js
+// src/panels/activity-bar.ts
 var _scope3 = null;
 function mount4() {
   _scope3 = effectScope();
@@ -303507,18 +305082,18 @@ function renderActivityBar() {
   render2(tpl, activityBar);
 }
 
-// src/panels/toolbar.js
+// src/panels/toolbar.ts
 init_lit_html();
 init_store();
 init_reactivity();
 init_workspace2();
 init_platform3();
 
-// src/browse/browse-modal.js
+// src/browse/browse-modal.ts
 init_lit_html();
 init_ref();
 
-// src/browse/browse.js
+// src/browse/browse.ts
 init_lit_html();
 init_ref();
 init_repeat();
@@ -304149,7 +305724,7 @@ function invalidateBrowseCache() {
   _previewCache.clear();
 }
 
-// src/browse/browse-modal.js
+// src/browse/browse-modal.ts
 var _handle2 = null;
 var _escHandler = null;
 function openBrowseModal() {
@@ -304199,7 +305774,7 @@ function closeBrowseModal() {
   _handle2 = null;
 }
 
-// src/new-project/new-project-modal.js
+// src/new-project/new-project-modal.ts
 init_lit_html();
 init_platform3();
 var _handle3 = null;
@@ -304359,7 +305934,7 @@ function renderModal2() {
 }
 var _dirDerived = true;
 
-// src/panels/toolbar.js
+// src/panels/toolbar.ts
 var _rootEl = null;
 var _ctx12 = null;
 var _scope4 = null;
@@ -304619,7 +306194,9 @@ function toolbarTemplate() {
     ctx.setCanvasMode(m3.key);
     view.panX = 0;
     view.panY = 0;
-    const uiPatch = { editingFunction: null };
+    const uiPatch = {
+      editingFunction: null
+    };
     if (m3.key === "stylebook")
       uiPatch.rightTab = "style";
     updateSession({ ui: uiPatch });
@@ -304771,13 +306348,13 @@ function toolbarTemplate() {
   `;
 }
 
-// src/panels/right-panel.js
+// src/panels/right-panel.ts
 init_lit_html();
 init_store();
 init_reactivity();
 init_workspace2();
 
-// src/panels/events-panel.js
+// src/panels/events-panel.ts
 init_store();
 init_lit_html();
 init_live();
@@ -304805,7 +306382,7 @@ function eventsSidebarTemplate(helpers) {
   if (!node2)
     return html3`<div class="empty-state">Node not found</div>`;
   const defs = document4.state || {};
-  const functionDefs = Object.entries(defs).filter(([, d3]) => d3.$prototype === "Function" || d3.$handler);
+  const functionDefs = Object.entries(defs).filter(([, d3]) => d3?.$prototype === "Function" || d3?.$handler);
   let declaredEventsT = nothing;
   if (isCustomElementDoc2()) {
     const allEmits = [];
@@ -304823,7 +306400,9 @@ function eventsSidebarTemplate(helpers) {
               <div class="declared-event-row" title=${ev.description || ""}>
                 <code class="event-code">${ev.name || "(unnamed)"}</code>
                 <span class="event-source">← ${ev._fn}</span>
-                ${ev.type?.text ? html3`<span class="event-type">${ev.type.text}</span>` : nothing}
+                ${ev.type?.text ? html3`<span class="event-type"
+                      >${ev.type.text}</span
+                    >` : nothing}
               </div>
             `)}
         </div>
@@ -304994,14 +306573,14 @@ function eventsSidebarTemplate(helpers) {
   `;
 }
 
-// src/panels/style-panel.js
+// src/panels/style-panel.ts
 init_lit_html();
 init_live();
 init_if_defined();
 init_store();
 init_workspace2();
 
-// src/utils/inherited-style.js
+// src/utils/inherited-style.ts
 function computeInheritedStyle(style2, mediaNames, activeTab2, activeSelector = null) {
   if (activeTab2 === null || mediaNames.length === 0)
     return {};
@@ -305039,7 +306618,7 @@ function computeInheritedStyle(style2, mediaNames, activeTab2, activeSelector =
   return inherited;
 }
 
-// src/panels/style-utils.js
+// src/panels/style-utils.ts
 init_store();
 init_workspace2();
 // data/css-meta.json
@@ -306531,7 +308110,7 @@ var css_meta_default = {
   }
 };
 
-// src/panels/style-utils.js
+// src/panels/style-utils.ts
 var cssInitialMap = new Map;
 function initCssData(webdata) {
   cssInitialMap = new Map(webdata.cssProps);
@@ -306683,19 +308262,19 @@ function currentFontFamily() {
   return raw;
 }
 
-// src/panels/style-inputs.js
+// src/panels/style-inputs.ts
 init_lit_html();
 init_live();
 init_store();
 init_workspace2();
 
-// src/ui/widgets.js
+// src/ui/widgets.ts
 init_lit_html();
 init_live();
 init_if_defined();
 init_store();
 
-// src/ui/unit-selector.js
+// src/ui/unit-selector.ts
 init_lit_html();
 init_live();
 init_class_map();
@@ -306773,11 +308352,11 @@ function renderUnitSelector(entry, prop, value2, onChange, placeholder = "") {
   `;
 }
 
-// src/ui/button-group.js
+// src/ui/button-group.ts
 init_lit_html();
 init_class_map();
 
-// src/ui/icons.js
+// src/ui/icons.ts
 init_lit();
 var icons = {
   "arrow-right": html3`<sp-icon-arrow-right slot="icon"></sp-icon-arrow-right>`,
@@ -306816,7 +308395,7 @@ var icons = {
 };
 var icons_default = icons;
 
-// src/ui/button-group.js
+// src/ui/button-group.ts
 function renderButtonGroup(entry, prop, value2, onChange) {
   const values2 = entry.$buttonValues || entry.enum || [];
   const iconMap = entry.$icons || {};
@@ -306825,7 +308404,7 @@ function renderButtonGroup(entry, prop, value2, onChange) {
   const extra = buttonValues && enumValues && enumValues.length > buttonValues.length ? enumValues.filter((v) => !buttonValues.includes(v)) : [];
   const menuId = `style-btngrp-${prop}`;
   const hasExtra = extra.length > 0;
-  const extraSelected = hasExtra && extra.includes(value2);
+  const extraSelected = hasExtra && extra.includes(String(value2));
   return html3`
     <div class=${classMap({ "button-group-combo": true, "has-overflow": hasExtra })}>
       <sp-action-group size="s" compact>
@@ -306870,7 +308449,7 @@ function renderButtonGroup(entry, prop, value2, onChange) {
   `;
 }
 
-// src/ui/widgets.js
+// src/ui/widgets.ts
 function renderTextInput(prop, value2, onChange, placeholder = "") {
   return html3`
     <sp-textfield
@@ -306928,7 +308507,7 @@ function widgetForType(type2, entry, prop, value2, onCommit, opts = {}) {
   }
 }
 
-// src/panels/style-inputs.js
+// src/panels/style-inputs.ts
 function renderKeywordInput(options, prop, value2, onChange) {
   const cssInitialMap2 = getCssInitialMap();
   const isTypoPreview = TYPO_PREVIEW_PROPS.has(prop) || prop === "fontWeight";
@@ -307042,7 +308621,7 @@ function widgetForType2(type2, entry, prop, value2, onCommit, opts = {}) {
   });
 }
 
-// src/panels/style-panel.js
+// src/panels/style-panel.ts
 function isTagPath(selector) {
   return /^[a-z]/.test(selector);
 }
@@ -307060,13 +308639,14 @@ function renderStyleRow(entry, prop, value2, onCommit, onDelete, isWarning, grid
   const type2 = inferInputType(entry);
   const hasVal = value2 !== undefined && value2 !== "";
   const placeholder = !hasVal && inheritedValue ? String(inheritedValue) : "";
+  const spanVal = gridMode && entry.$span === 2 ? 2 : undefined;
   return renderFieldRow({
     prop,
     label: propLabel(entry, prop),
     hasValue: hasVal,
     onClear: onDelete,
     widget: widgetForType2(type2, entry, prop, value2, onCommit, { placeholder }),
-    span: gridMode && entry.$span === 2 ? 2 : undefined,
+    ...spanVal != null && { span: spanVal },
     warning: isWarning
   });
 }
@@ -307135,12 +308715,12 @@ function renderShorthandRow(shortProp, entry, style2, mutateFn, _deleteFn, inher
     return longhands.map(({ name, entry: lEntry }, idx) => {
       const lVal = style2[name] ?? (expanded2 ? expanded2[idx] : "");
       return html3`
-                <div class="style-row style-row--child" data-prop=${name}>
-                  <div class="style-row-label">
-                    ${lVal !== undefined && lVal !== "" ? html3`<span
-                          class="set-dot"
-                          title="Clear ${name}"
-                          @click=${(e20) => {
+              <div class="style-row style-row--child" data-prop=${name}>
+                <div class="style-row-label">
+                  ${lVal !== undefined && lVal !== "" ? html3`<span
+                        class="set-dot"
+                        title="Clear ${name}"
+                        @click=${(e20) => {
         e20.stopPropagation();
         const vals = longhands.map((l, i7) => i7 === idx ? emptyVal : style2[l.name] ?? (expanded2 ? expanded2[i7] : emptyVal));
         transactDoc(activeTab.value, (t15) => {
@@ -307151,12 +308731,10 @@ function renderShorthandRow(shortProp, entry, style2, mutateFn, _deleteFn, inher
           mutateFn(t15, shortProp, compress2(vals));
         });
       }}
-                        ></span>` : nothing}
-                    <sp-field-label size="s" title=${name}
-                      >${propLabel(lEntry, name)}</sp-field-label
-                    >
-                  </div>
-                  ${widgetForType2(inferInputType(lEntry), lEntry, name, lVal, (newVal) => {
+                      ></span>` : nothing}
+                  <sp-field-label size="s" title=${name}>${propLabel(lEntry, name)}</sp-field-label>
+                </div>
+                ${widgetForType2(inferInputType(lEntry), lEntry, name, lVal, (newVal) => {
         const vals = longhands.map((l, i7) => i7 === idx ? newVal || emptyVal : style2[l.name] ?? (expanded2 ? expanded2[i7] : emptyVal));
         transactDoc(activeTab.value, (t15) => {
           for (const l of longhands) {
@@ -307166,8 +308744,8 @@ function renderShorthandRow(shortProp, entry, style2, mutateFn, _deleteFn, inher
           mutateFn(t15, shortProp, compress2(vals));
         });
       }, { placeholder: !lVal && inherited[name] ? String(inherited[name]) : "" })}
-                </div>
-              `;
+              </div>
+            `;
     });
   })() : nothing}
   `;
@@ -307307,7 +308885,8 @@ function styleSidebarTemplate(node2, activeMediaTab, activeSelector, effectiveSt
     commitMutate = (t15, prop, val) => mutateUpdateNestedStylePath(t15, sel, stylePath, prop, val);
     commitStyle = (prop, val) => transactDoc(activeTab.value, (t15) => commitMutate(t15, prop, val));
   } else if (activeSelector && mediaTab && mediaNames.length > 0) {
-    activeStyle = (style2[`@${mediaTab}`] || {})[activeSelector] || {};
+    const mediaObj = style2[`@${mediaTab}`] || {};
+    activeStyle = mediaObj[activeSelector] || {};
     commitMutate = (t15, prop, val) => mutateUpdateMediaNestedStyle(t15, sel, mediaTab, activeSelector, prop, val);
     commitStyle = (prop, val) => transactDoc(activeTab.value, (t15) => commitMutate(t15, prop, val));
   } else if (activeSelector) {
@@ -307634,7 +309213,7 @@ function renderStylePanelTemplate(ctx) {
   return styleSidebarTemplate(node2, tab.session.ui.activeMedia, tab.session.ui.activeSelector);
 }
 
-// src/panels/properties-panel.js
+// src/panels/properties-panel.ts
 init_lit_html();
 init_live();
 init_store();
@@ -308001,7 +309580,7 @@ var html_meta_default = {
   }
 };
 
-// src/panels/properties-panel.js
+// src/panels/properties-panel.ts
 function friendlyNameToMedia(name) {
   return friendlyNameToVar(name, "--");
 }
@@ -308018,7 +309597,7 @@ function bindableFieldRow(label4, type2, rawValue, onChange, filterFn = null, ex
   const tab = activeTab.value;
   const defs = tab.doc.document.state || {};
   const isBound = typeof rawValue === "object" && rawValue !== null && rawValue.$ref;
-  const signalDefs = Object.entries(defs).filter(([, d3]) => filterFn ? filterFn(d3) : !d3.$handler && d3.$prototype !== "Function");
+  const signalDefs = Object.entries(defs).filter(([, d3]) => filterFn ? filterFn(d3) : !d3?.$handler && d3?.$prototype !== "Function");
   let debounce;
   const onInput2 = (e20) => {
     clearTimeout(debounce);
@@ -308219,7 +309798,7 @@ function renderComponentPropsFieldsTemplate(node2, path2, mapSignals, navigateTo
   const currentVals = isNpm ? node2.attributes || {} : node2.$props || {};
   const updateFn = isNpm ? (name, v) => transactDoc(activeTab.value, (t15) => mutateUpdateAttribute(t15, path2, name, v === "" ? undefined : v)) : (name, v) => transactDoc(activeTab.value, (t15) => mutateUpdateProp(t15, path2, name, v));
   const defs = tab.doc.document.state || {};
-  const signalDefs = Object.entries(defs).filter(([, d3]) => !d3.$handler && d3.$prototype !== "Function");
+  const signalDefs = Object.entries(defs).filter(([, d3]) => !d3?.$handler && d3?.$prototype !== "Function");
   const extraSignals = mapSignals;
   return html3`
     ${comp.props.map((prop) => {
@@ -308228,6 +309807,7 @@ function renderComponentPropsFieldsTemplate(node2, path2, mapSignals, navigateTo
     const hasVal = rawValue !== undefined && rawValue !== null;
     const parsed = parseCemType(prop.type);
     const onChange = (v) => updateFn(prop.name, v);
+    const staticVal = isBound ? "" : String(rawValue ?? "");
     const clearProp = (e20) => {
       e20.stopPropagation();
       updateFn(prop.name, undefined);
@@ -308270,7 +309850,6 @@ function renderComponentPropsFieldsTemplate(node2, path2, mapSignals, navigateTo
           </sp-picker>
         `;
     let debounce;
-    const staticVal = isBound ? "" : rawValue ?? "";
     let widgetTpl;
     if (prop.format === "image") {
       widgetTpl = renderMediaPicker(prop.name, staticVal, onChange);
@@ -308855,24 +310434,27 @@ function renderPropertiesPanelTemplate(ctx) {
               <div class="style-section-body">
                 ${entries2.length === 0 ? html3`<div class="empty-state">
                       No attributes declared. Set "attribute" on a state entry.
-                    </div>` : entries2.map(([key, d3]) => html3`
+                    </div>` : entries2.map(([key, d3]) => {
+      const def3 = d3;
+      return html3`
                         <div
                           style="display:flex;gap:6px;align-items:center;padding:2px 0;font-size:11px"
                         >
                           <code style="font-family:monospace;color:var(--accent)"
-                            >${d3.attribute}</code
+                            >${def3.attribute}</code
                           >
                           <span style="color:var(--fg-dim)"> → </span>
                           <span>${key}</span>
-                          ${d3.type ? html3`<span style="margin-left:auto;color:var(--fg-dim);font-size:10px"
-                                >${d3.type}</span
+                          ${def3.type ? html3`<span style="margin-left:auto;color:var(--fg-dim);font-size:10px"
+                                >${def3.type}</span
                               >` : nothing}
-                          ${d3.reflects ? html3`<span
+                          ${def3.reflects ? html3`<span
                                 style="font-size:9px;background:var(--bg-hover);padding:1px 4px;border-radius:3px"
                                 >reflects</span
                               >` : nothing}
                         </div>
-                      `)}
+                      `;
+    })}
               </div>
             </sp-accordion-item>
           `;
@@ -308983,7 +310565,7 @@ function renderPropertiesPanelTemplate(ctx) {
   return tpl;
 }
 
-// src/panels/ai-panel.js
+// src/panels/ai-panel.ts
 init_lit_html();
 init_ref();
 
@@ -309673,7 +311255,7 @@ var q = function() {
 }();
 q.quikdown = k;
 
-// src/panels/ai-panel.js
+// src/panels/ai-panel.ts
 init_platform3();
 var messages2 = [];
 var streaming = false;
@@ -309695,14 +311277,15 @@ function mountAiPanel() {
   mounted2 = true;
   checkAuth();
 }
+var _g = globalThis;
 function rerenderPanel() {
-  const { render: render6 } = globalThis.__jxRightPanelRender || {};
+  const { render: render6 } = _g.__jxRightPanelRender || {};
   if (render6)
     render6();
   requestAnimationFrame(() => mountQuikChat());
 }
 function registerRightPanelRender(fn) {
-  globalThis.__jxRightPanelRender = { render: fn };
+  _g.__jxRightPanelRender = { render: fn };
 }
 function mountQuikChat() {
   const container = _quikChatEl;
@@ -309993,7 +311576,7 @@ function renderAiPanelTemplate() {
   `;
 }
 
-// src/panels/right-panel.js
+// src/panels/right-panel.ts
 var _ctx13 = null;
 var _scope5 = null;
 var _rendering = false;
@@ -310169,13 +311752,13 @@ function _flush2() {
   _ctx13.updateForcedPseudoPreview();
 }
 
-// src/panels/left-panel.js
+// src/panels/left-panel.ts
 init_lit_html();
 init_store();
 init_reactivity();
 init_workspace2();
 
-// src/panels/stylebook-layers-panel.js
+// src/panels/stylebook-layers-panel.ts
 init_lit_html();
 init_class_map();
 init_workspace2();
@@ -310255,7 +311838,7 @@ function renderStylebookLayersTemplate(ctx) {
   }
 }
 
-// src/panels/elements-panel.js
+// src/panels/elements-panel.ts
 init_lit_html();
 init_store();
 init_workspace2();
@@ -310286,7 +311869,7 @@ function renderElementsTemplate(ctx) {
                 @click=${() => {
         const t16 = activeTab.value;
         const parentPath = t16?.session.selection || [];
-        const parent = getNodeAtPath(t16?.doc.document, parentPath);
+        const parent = getNodeAtPath(t16.doc.document, parentPath);
         const idx = parent?.children ? parent.children.length : 0;
         transactDoc(t16, (tr) => mutateInsertNode(tr, parentPath, idx, structuredClone(def3)));
       }}
@@ -310335,7 +311918,7 @@ function renderElementsTemplate(ctx) {
                     @click=${() => {
     const t16 = activeTab.value;
     const parentPath = t16?.session.selection || [];
-    const parent = getNodeAtPath(t16?.doc.document, parentPath);
+    const parent = getNodeAtPath(t16.doc.document, parentPath);
     const idx = parent?.children ? parent.children.length : 0;
     const instanceDef = {
       tagName: comp.tagName,
@@ -310374,7 +311957,7 @@ function renderElementsTemplate(ctx) {
   `;
 }
 
-// src/panels/left-panel.js
+// src/panels/left-panel.ts
 var _ctx14 = null;
 var _scope6 = null;
 var _rendering2 = false;
@@ -310549,7 +312132,7 @@ function _render() {
     ctx.registerLayersDnD();
 }
 
-// src/panels/tab-strip.js
+// src/panels/tab-strip.ts
 init_lit_html();
 init_class_map();
 init_repeat();
@@ -310636,7 +312219,7 @@ async function requestClose(id) {
   closeTab(id);
 }
 
-// src/studio.js
+// src/studio.ts
 function getCanvasMode() {
   return activeTab.value?.session.ui.canvasMode ?? "design";
 }
@@ -310770,10 +312353,20 @@ render2(html3`
     <datalist id="tag-names">
       ${webdata_default.allTags.map((tag5) => html3`<option value=${tag5}></option>`)}
     </datalist>
-    <datalist id="css-props">
-      ${webdata_default.cssProps.map(([name]) => html3`<option value=${name}></option>`)}
-    </datalist>
+    <datalist id="css-props"></datalist>
   `, datalistHost);
+requestIdleCallback(() => {
+  const dl = document.getElementById("css-props");
+  if (!dl)
+    return;
+  const frag = document.createDocumentFragment();
+  for (const [name] of webdata_default.cssProps) {
+    const opt = document.createElement("option");
+    opt.value = name;
+    frag.appendChild(opt);
+  }
+  dl.appendChild(frag);
+});
 initCssData(webdata_default);
 if (!hasPlatform()) {
   registerPlatform(createDevServerPlatform());
@@ -311010,7 +312603,7 @@ if (_projectParam) {
             id: fileRelPath,
             documentPath: fileRelPath,
             document: parsedDoc,
-            frontmatter: frontmatter2,
+            ...frontmatter2 != null && { frontmatter: frontmatter2 },
             sourceFormat: isMd ? "md" : null
           });
           if (isMd && activeTab.value)
@@ -311145,5 +312738,5 @@ effect(() => {
     scheduleAutosave();
 });
 
-//# debugId=9E9829984105751D64756E2164756E21
+//# debugId=8A6CA76BD8515F1464756E2164756E21
 //# sourceMappingURL=studio.js.map