@wildwinter/expr-editor 0.8.0 → 0.10.0

package/README.md

@@ -63,6 +63,11 @@ Notable options beyond the basics:
 Pills carry `aria-haspopup`/labels and the tree controls carry aria-labels for
 assistive tech. A comparison of a numeric dialect function against a number
 (e.g. `turns_since_tag("x") > 3`) deletes as a unit.
+
+`renderConditionPreview(src, opts)` / `renderEffectsPreview(effects, opts)`
+return read-only pill strips (same pills as the editor, non-interactive). Pass
+`propertyActions` to make property pills right-click interactive (e.g. "Go to
+definition") while left-click still falls through to the host.
 - `setText(on)` — the host's raw-text toggle (`</>`); unparseable input falls
   back to raw text automatically.
 

package/dist/index.cjs

@@ -443,6 +443,13 @@ function renderNode(node, path, ctx, parentOp, side) {
     case "flagdelta":
       return pill(node.sign === "+" ? "flagpos" : "flagneg", `${node.sign}${node.name || "flag"}`, (b) => flagEditor(ctx, path, node, b), { issue, path });
     case "call": {
+      if (ctx.compact && ctx.dialect.functions[node.name]?.flagDeltaArgs && node.args.length >= 2 && node.args[0].kind === "scopedvar" && node.args.slice(1).every((a) => a.kind === "flagdelta")) {
+        const row2 = el("span", "exed-call exed-call-flags");
+        row2.append(renderNode(node.args[0], [...path, "args", 0], ctx));
+        row2.append(el("span", "exed-flagsep", [":"]));
+        for (let i = 1; i < node.args.length; i++) row2.append(renderNode(node.args[i], [...path, "args", i], ctx));
+        return row2;
+      }
       const row = el("span", "exed-call");
       row.append(pill("func", node.name, (b) => callEditor(ctx, path, node, b), { issue }));
       row.append(el("span", "exed-paren", ["("]));
@@ -492,9 +499,10 @@ function attachPropertyMenu(ctx, node, pillEl) {
   if (!ctx.propertyActions) return;
   const actions = ctx.propertyActions({ scope: node.scope, name: node.name });
   if (!actions.length) return;
+  const open = ctx.openMenu ?? ctx.openPopover;
   pillEl.addEventListener("contextmenu", (e) => {
     e.preventDefault();
-    ctx.openPopover(pillEl, (close) => {
+    open(pillEl, (close) => {
       const wrap = el("div", "exed-menu");
       for (const a of actions) wrap.append(button("exed-opt", a.label, () => {
         a.run();
@@ -1655,6 +1663,7 @@ function frozenCtx(src, o) {
     catalogue: o.catalogue,
     scopeOrder: o.scopeOrder ?? [],
     functions: [],
+    compact: true,
     byPath: v.byPath,
     getAst: () => v.ast,
     apply: () => {
@@ -1664,7 +1673,13 @@ function frozenCtx(src, o) {
     pickNode: () => {
     },
     // enables labelled node pills; never fires (preview is read-only)
-    ...o.nodeLabel ? { nodeLabel: o.nodeLabel } : {}
+    ...o.nodeLabel ? { nodeLabel: o.nodeLabel } : {},
+    ...o.propertyActions ? {
+      propertyActions: o.propertyActions,
+      openMenu: (anchor, render) => {
+        openPopover(anchor, render, { container: o.popoverContainer });
+      }
+    } : {}
   };
   return { ctx, ast: v.ast };
 }
@@ -1673,7 +1688,8 @@ function exprPills(src, o) {
   return ast ? renderNode(ast, [], ctx) : el("span", "exed-preview-raw", [src]);
 }
 function renderConditionPreview(src, o) {
-  return el("div", "exed-preview", [exprPills(src, o)]);
+  const cls = o.propertyActions ? "exed-preview exed-preview-interactive" : "exed-preview";
+  return el("div", cls, [exprPills(src, o)]);
 }
 function renderEffectsPreview(effects, o) {
   const wrap = el("div", "exed-preview exed-preview-effects");