@wildwinter/expr-editor 0.4.0 → 0.6.0

package/dist/index.d.cts

@@ -276,6 +276,16 @@ interface ExpressionEditorOptions {
      *  placeholder pill (a root string literal) rather than the condition
      *  clause-menu empty state. Pairs with mode:"flat". */
     valueField?: boolean;
+    /** Flat compact editor for a `set_flags(@target, +a, -b)` value whose target is
+     *  implied by context (an outcome row's target column). Renders only the
+     *  flag-delta pills plus an "+ flag" chip, hiding the function name and target
+     *  arg. `target` is the name-form ref of the flags property (e.g. "@quests"),
+     *  `flags` its declared flag names (offered by the "+ flag" picker). Pairs
+     *  with mode:"flat"; set requireNonEmpty so the last flag can't be removed. */
+    flagValue?: {
+        target: string;
+        flags: string[];
+    };
     /** Emitted on every edit (name-form; "" when cleared). */
     onChange: (src: string) => void;
     /** Notified when the author starts (true) / stops (false) editing inside a popover

package/dist/index.d.ts

@@ -276,6 +276,16 @@ interface ExpressionEditorOptions {
      *  placeholder pill (a root string literal) rather than the condition
      *  clause-menu empty state. Pairs with mode:"flat". */
     valueField?: boolean;
+    /** Flat compact editor for a `set_flags(@target, +a, -b)` value whose target is
+     *  implied by context (an outcome row's target column). Renders only the
+     *  flag-delta pills plus an "+ flag" chip, hiding the function name and target
+     *  arg. `target` is the name-form ref of the flags property (e.g. "@quests"),
+     *  `flags` its declared flag names (offered by the "+ flag" picker). Pairs
+     *  with mode:"flat"; set requireNonEmpty so the last flag can't be removed. */
+    flagValue?: {
+        target: string;
+        flags: string[];
+    };
     /** Emitted on every edit (name-form; "" when cleared). */
     onChange: (src: string) => void;
     /** Notified when the author starts (true) / stops (false) editing inside a popover

package/dist/index.js

@@ -539,7 +539,9 @@ function flagEditor(ctx, path, node, anchor) {
   const call = getNodeAt(ctx.getAst(), callPath);
   const flagsVar = call?.kind === "call" ? call.args[0] : void 0;
   const entry = flagsVar?.kind === "scopedvar" ? lookup(ctx.catalogue, flagsVar.scope, flagsVar.name) : null;
+  const flagCount = call?.kind === "call" ? call.args.filter((a) => a.kind === "flagdelta").length : 0;
   const used = call?.kind === "call" ? call.args.filter((a, i) => a.kind === "flagdelta" && i !== path[path.length - 1]).map((a) => a.name) : [];
+  const canRemove = !(ctx.requireNonEmpty && flagCount <= 1);
   ctx.openPopover(anchor, (close) => {
     const wrap = el("div", "exed-menu");
     wrap.append(el("div", "exed-menu-head", ["Flag set?"]));
@@ -564,6 +566,12 @@ function flagEditor(ctx, path, node, anchor) {
         close();
       } }));
     }
+    if (canRemove) {
+      wrap.append(button("exed-opt danger", "Remove flag", () => {
+        ctx.apply(deleteAt(ctx.getAst(), path));
+        close();
+      }));
+    }
     return wrap;
   });
 }
@@ -1073,8 +1081,12 @@ function mountExpressionEditor(host, opts) {
     closePopover();
     host.replaceChildren();
     const v = validateSource(src, opts.schema, opts.dialect);
-    if (raw || v.unparseable) {
+    const flagCompact = !!opts.flagValue && (opts.mode ?? "tree") === "flat";
+    const astIsFlagCall = v.ast?.kind === "call" && (v.ast.name === "set_flags" || v.ast.name === "check_flags");
+    if (raw || v.unparseable || flagCompact && !!v.ast && !astIsFlagCall) {
       host.append(rawArea());
+    } else if (flagCompact) {
+      host.append(flagValueBody(astIsFlagCall ? v.ast : null));
     } else if (!src.trim() || !v.ast) {
       host.append(opts.valueField ? valueEmptyState() : emptyState());
     } else {
@@ -1124,6 +1136,61 @@ function mountExpressionEditor(host, opts) {
     const ctx = buildCtx(strLit(""));
     return el("div", "exed-flat", [renderNode(strLit(""), [], ctx)]);
   }
+  function parseRef(ref) {
+    const bare = ref.replace(/^@/, "");
+    const dot = bare.indexOf(".");
+    return dot >= 0 ? scopedVar(bare.slice(0, dot), bare.slice(dot + 1)) : scopedVar(defaultScope, bare);
+  }
+  function flagValueBody(call) {
+    const wrap = el("div", "exed-flat exed-flagvalue");
+    const ctx = buildCtx(call ?? boolLit(true));
+    if (call) {
+      call.args.forEach((arg, i) => {
+        if (arg.kind === "flagdelta") wrap.append(renderNode(arg, ["args", i], ctx));
+      });
+    }
+    wrap.append(addFlagChip(ctx, call));
+    return wrap;
+  }
+  function addFlagChip(ctx, call) {
+    const flags = opts.flagValue?.flags ?? [];
+    const used = call ? call.args.filter((a) => a.kind === "flagdelta").map((a) => a.name) : [];
+    const available = flags.filter((f) => !used.includes(f));
+    return button("exed-add exed-addflag", "+ flag", (e) => {
+      const anchor = e.currentTarget;
+      ctx.openPopover(anchor, (close) => {
+        let sign = "+";
+        const wrap = el("div", "exed-menu");
+        wrap.append(el("div", "exed-menu-head", ["Add flag"]));
+        const signRow = el("div", "exed-field-row");
+        const drawSign = () => {
+          signRow.replaceChildren(
+            button(`exed-opt${sign === "+" ? " sel" : ""}`, "+ set", () => {
+              sign = "+";
+              drawSign();
+            }),
+            button(`exed-opt${sign === "-" ? " sel" : ""}`, "\u2212 unset", () => {
+              sign = "-";
+              drawSign();
+            })
+          );
+        };
+        drawSign();
+        wrap.append(signRow);
+        const commit = (name) => {
+          const delta = flagDelta(sign, name);
+          emit(toSrc(call ? { ...call, args: [...call.args, delta] } : callNode("set_flags", [parseRef(opts.flagValue.target), delta])));
+          close();
+        };
+        if (available.length) {
+          for (const n of available) wrap.append(button("exed-opt", n, () => commit(n)));
+        } else {
+          wrap.append(el("div", "exed-hint", [flags.length === 0 ? "This flags property declares no flag values yet." : "All declared flags are already used."]));
+        }
+        return wrap;
+      });
+    }, "add a flag");
+  }
   function addTermControl(ctx) {
     const boolean = opts.addTerm === "boolean";
     const ops = boolean ? ["and", "or"] : ARITHMETIC_OPS;