@wildwinter/expr-editor 0.13.1 → 0.14.1

package/dist/index.cjs

@@ -288,6 +288,13 @@ var choicesOf = (e) => {
   if (e.type === "enum") return e.enumValues;
   return void 0;
 };
+var propertyTip = (e) => {
+  if (!e) return void 0;
+  const lines = [];
+  if (e.purpose) lines.push(e.purpose);
+  if (e.type === "quality" && e.stages?.length) lines.push(`Stages: ${e.stages.join(" \u2192 ")}`);
+  return lines.length ? lines.join("\n") : void 0;
+};
 var refOf = (e, defaultScope) => e.scope === defaultScope ? `@${e.name}` : `@${e.scope}.${e.name}`;
 var displayName = (e, defaultScope) => e.scope === defaultScope ? e.name : `${e.scope}.${e.name}`;
 function filterCatalogue(entries, filter = {}) {
@@ -422,6 +429,14 @@ function textField(opts) {
   setTimeout(() => input.focus(), 0);
   return wrap;
 }
+function propertyMenuBody(actions, close) {
+  const wrap = el("div", "exed-menu");
+  for (const a of actions) wrap.append(button("exed-opt", a.label, () => {
+    a.run();
+    close();
+  }));
+  return wrap;
+}
 
 // src/flat.ts
 var FLAG_FNS = /* @__PURE__ */ new Set(["check_flags", "set_flags"]);
@@ -459,7 +474,12 @@ function renderNode(node, path, ctx, parentOp, side) {
     case "scopedvar": {
       const entry = lookup(ctx.catalogue, node.scope, node.name);
       const label = displayName({ scope: node.scope, name: node.name }, ctx.defaultScope);
-      const varPill = pill("var", label, (b) => variableEditor(ctx, path, node, b), { issue: issue ?? (entry ? void 0 : `Unknown property ${label}`) });
+      const varPill = pill(
+        "var",
+        label,
+        (b) => variableEditor(ctx, path, node, b),
+        { issue: issue ?? (entry ? void 0 : `Unknown property ${label}`), title: propertyTip(entry) }
+      );
       attachPropertyMenu(ctx, node, varPill);
       return varPill;
     }
@@ -535,14 +555,7 @@ function attachPropertyMenu(ctx, node, pillEl) {
   const open = ctx.openMenu ?? ctx.openPopover;
   pillEl.addEventListener("contextmenu", (e) => {
     e.preventDefault();
-    open(pillEl, (close) => {
-      const wrap = el("div", "exed-menu");
-      for (const a of actions) wrap.append(button("exed-opt", a.label, () => {
-        a.run();
-        close();
-      }));
-      return wrap;
-    });
+    open(pillEl, (close) => propertyMenuBody(actions, close));
   });
 }
 function isCompoundComparison(node, ctx) {
@@ -1552,6 +1565,7 @@ function mountEffectsEditor(host, opts) {
       valueField: true,
       ...addTerm ? { addTerm } : {},
       ...selfAdvanceRef ? { selfAdvanceRef } : {},
+      ...opts.propertyActions ? { propertyActions: opts.propertyActions } : {},
       ...opts.popoverContainer ? { popoverContainer: opts.popoverContainer } : {},
       text: textMode,
       onChange
@@ -1602,6 +1616,17 @@ function mountEffectsEditor(host, opts) {
         commit(updateAt(effects, i, { target: refOf(entry, defaultScope), value: initialValueFor(entry, defaultScope).src }));
       });
     }, "change the target property");
+    const targetEntry = opts.catalogue.find((e) => refOf(e, defaultScope) === eff.target);
+    const tip = propertyTip(targetEntry);
+    if (tip) targetBtn.title = tip;
+    if (targetEntry && opts.propertyActions) {
+      const actions = opts.propertyActions({ scope: targetEntry.scope, name: targetEntry.name });
+      if (actions.length) targetBtn.addEventListener("contextmenu", (e) => {
+        e.preventDefault();
+        closePopover();
+        popover = openPopover(targetBtn, (close) => propertyMenuBody(actions, close), { container: opts.popoverContainer });
+      });
+    }
     const advances = isSelfAdvance(eff, defaultScope, opts.dialect);
     row.append(targetBtn);
     if (!advances) row.append(el("span", "exed-effect-eq", ["="]));
@@ -1765,13 +1790,26 @@ function renderConditionPreview(src, o) {
   const cls = o.propertyActions ? "exed-preview exed-preview-interactive" : "exed-preview";
   return el("div", cls, [exprPills(src, o)]);
 }
+function targetPill(ref, o) {
+  const pill2 = el("span", "exed-pill exed-pill-prop", [ref || "(property)"]);
+  const entry = o.catalogue.find((e) => refOf(e, o.dialect.defaultScope) === ref);
+  if (!entry) return pill2;
+  const tip = propertyTip(entry);
+  if (tip) pill2.title = tip;
+  const actions = o.propertyActions?.({ scope: entry.scope, name: entry.name }) ?? [];
+  if (actions.length) pill2.addEventListener("contextmenu", (e) => {
+    e.preventDefault();
+    openPopover(pill2, (close) => propertyMenuBody(actions, close), { container: o.popoverContainer });
+  });
+  return pill2;
+}
 function renderEffectsPreview(effects, o) {
-  const wrap = el("div", "exed-preview exed-preview-effects");
+  const wrap = el("div", `exed-preview exed-preview-effects${o.propertyActions ? " exed-preview-interactive" : ""}`);
   for (const eff of effects) {
     const row = el("div", "exed-preview-eff");
     if (eff.kind === "set") {
       const advances = isSelfAdvance(eff, o.dialect.defaultScope, o.dialect);
-      row.append(el("span", "exed-pill exed-pill-prop", [eff.target || "(property)"]));
+      row.append(targetPill(eff.target, o));
       if (!advances) row.append(el("span", "exed-effect-eq", ["="]));
       row.append(exprPills(eff.value, o, advances ? eff.target : void 0));
     } else {
@@ -1837,6 +1875,7 @@ exports.numLit = numLit;
 exports.opSwapGroup = opSwapGroup;
 exports.pathKey = pathKey;
 exports.placeholderForOp = placeholderForOp;
+exports.propertyTip = propertyTip;
 exports.redirectDeleteForPlaceholderSibling = redirectDeleteForPlaceholderSibling;
 exports.refOf = refOf;
 exports.removeArgAt = removeArgAt;