ggaction 0.0.5 → 0.0.6

package/src/actions/guides/legends/edit.js

@@ -3,6 +3,7 @@ import { validateOptionObject } from "../../../core/validation.js";
 import { normalizeOptions } from "./categorical/options.js";
 import { symbolGraphic } from "./categorical/layout.js";
 import {
+  normalizeLegendTextOptions,
   normalizeContinuousLegend,
   validatePositive
 } from "./continuous/common.js";
@@ -12,6 +13,10 @@ import { findLayer } from "../../../selectors/layers.js";
 import { resolveLegendGraphicPlacement } from
   "../../../materialization/graphicHierarchy.js";
 import { resolveLegendTarget } from "./target.js";
+import {
+  STROKE_WIDTH_LEGEND_LABELS,
+  STROKE_WIDTH_LEGEND_TITLE_STYLE
+} from "./strokeWidth.js";
 
 const OPTIONS = Object.freeze([
   "target", "position", "align", "direction", "columns", "offset",
@@ -163,6 +168,61 @@ function editInterval(program, previous, args) {
   return next.rematerializeIntervalLegend();
 }
 
+function editStrokeWidth(program, previous, args) {
+  const allowed = ["target", "title", "count", "labels", "titleStyle"];
+  for (const key of Object.keys(args)) {
+    if (!allowed.includes(key)) {
+      throw new Error(`stroke-width legend does not accept ${key}.`);
+    }
+  }
+  const count = args.count ?? previous.count;
+  if (!Number.isInteger(count) || count < 2) {
+    throw new RangeError(
+      "Stroke-width legend count must be an integer of at least 2."
+    );
+  }
+  const layer = findLayer(program, previous.target);
+  const titleMode = args.title;
+  const inferredTitle = titleMode === "auto"
+    ? true
+    : typeof titleMode === "string" ? false : previous.inferredTitle;
+  const titleVisible = titleMode === false
+    ? false
+    : titleMode === undefined ? previous.titleVisible !== false : true;
+  const title = titleMode === "auto"
+    ? layer?.encoding?.strokeWidth?.field
+    : typeof titleMode === "string" ? titleMode : previous.title;
+  const config = {
+    ...previous,
+    title,
+    inferredTitle,
+    titleVisible,
+    count,
+    labels: normalizeLegendTextOptions(
+      args.labels,
+      "editLegend.labels",
+      previous.labels ?? STROKE_WIDTH_LEGEND_LABELS
+    ),
+    titleStyle: normalizeLegendTextOptions(
+      args.titleStyle,
+      "editLegend.titleStyle",
+      previous.titleStyle ?? STROKE_WIDTH_LEGEND_TITLE_STYLE
+    )
+  };
+  let next = program;
+  if (titleMode === "auto" || typeof titleMode === "string") {
+    next = next.editSemantic({
+      property: "guide.legend.strokeWidth.title",
+      value: title
+    });
+  }
+  next = next._withLegendConfig("strokeWidth", config);
+  next = reconcileGraphic(next, "strokeWidthLegendTitle", titleVisible, {
+    type: "text"
+  });
+  return next.rematerializeStrokeWidthLegend();
+}
+
 function categoricalSymbolIds(config) {
   return new Set(config.symbol.layers.map(layer => symbolGraphic(config, layer.type)));
 }
@@ -285,9 +345,7 @@ export const editLegend = action(
       return editInterval(this, configs.interval, args);
     }
     if (configs.strokeWidth?.target === target) {
-      throw new Error(
-        "editLegend does not yet support stroke-width legends; edit the owning scale instead."
-      );
+      return editStrokeWidth(this, configs.strokeWidth, args);
     }
     const continuousKind = ["gradient", "opacity"].find(
       kind => configs[kind]?.target === target

package/src/actions/guides/legends/remove.js

@@ -2,38 +2,139 @@ import { action } from "../../../core/action.js";
 import { validateKeys } from "../../../core/validation.js";
 import { legendGraphicIds, legendResourcePolicy } from
   "../../../materialization/guides/resources.js";
+import { LEGEND_CHANNELS } from "../../../core/vocabulary.js";
 import { resolveLegendTarget } from "./target.js";
 
-const OPTIONS = Object.freeze(["target"]);
+const OPTIONS = Object.freeze(["target", "channels"]);
+
+function legendKindChannels(kind, config) {
+  if (["series", "color"].includes(kind)) return config.channels;
+  return {
+    size: ["size"],
+    gradient: ["color"],
+    interval: ["color"],
+    opacity: ["opacity"],
+    strokeWidth: ["strokeWidth"]
+  }[kind];
+}
+
+function validateRequestedChannels(channels) {
+  if (!Array.isArray(channels)) {
+    throw new TypeError("removeLegend channels must be an array.");
+  }
+  if (channels.length === 0) {
+    throw new Error("removeLegend channels must select at least one channel.");
+  }
+  const seen = new Set();
+  for (const channel of channels) {
+    if (!LEGEND_CHANNELS.includes(channel)) {
+      throw new Error(`Unsupported legend channel "${channel}".`);
+    }
+    if (seen.has(channel)) {
+      throw new Error(`removeLegend channels contains duplicate "${channel}".`);
+    }
+    seen.add(channel);
+  }
+}
+
+function resolveRequestedKinds(program, target, channels) {
+  validateRequestedChannels(channels);
+  const requested = new Set(channels);
+  const matched = new Set();
+  const kinds = [];
+  for (const [kind, config] of Object.entries(program.guideConfigs.legend ?? {})) {
+    if (config?.target !== target) continue;
+    const owned = legendKindChannels(kind, config);
+    const overlap = owned.filter(channel => requested.has(channel));
+    if (overlap.length > 0 && overlap.length !== owned.length) {
+      throw new Error(
+        `Legend channels ${owned.map(channel => `"${channel}"`).join(", ")} ` +
+        "belong to one combined block and must be removed together."
+      );
+    }
+    if (overlap.length === owned.length) {
+      kinds.push(kind);
+      for (const channel of owned) matched.add(channel);
+    }
+  }
+  const missing = channels.filter(channel => !matched.has(channel));
+  if (missing.length > 0) {
+    throw new Error(
+      `Legend target "${target}" has no complete block for channel "${missing[0]}".`
+    );
+  }
+  return kinds;
+}
+
+export function removeLegendKinds(program, kinds) {
+  const removed = new Set(kinds);
+  const retainedSemanticKinds = new Set(
+    Object.entries(program.guideConfigs.legend ?? {})
+      .filter(([kind]) => !removed.has(kind))
+      .map(([kind]) => legendResourcePolicy(kind).semanticKind)
+  );
+  const semanticKinds = new Set(
+    kinds.map(kind => legendResourcePolicy(kind).semanticKind)
+  );
+  let next = program;
+  for (const kind of semanticKinds) {
+    if (
+      !retainedSemanticKinds.has(kind) &&
+      next.semanticSpec.guides.legend?.[kind] !== undefined
+    ) {
+      next = next.editSemantic({
+        property: `guide.legend.${kind}`,
+        remove: true
+      });
+    }
+  }
+  for (const id of new Set(kinds.flatMap(legendGraphicIds))) {
+    if (next.graphicSpec.objects[id] !== undefined) {
+      next = next.editGraphics({ target: id, remove: true });
+    }
+  }
+  for (const kind of kinds) {
+    next = next._withoutMaterializationConfig(["guides", "legend", kind]);
+  }
+  return next;
+}
 
 export const removeLegend = action(
   { op: "removeLegend", description: "Remove every legend block owned by one mark." },
   function (args = {}) {
     validateKeys(args, OPTIONS, "removeLegend");
     const target = resolveLegendTarget(this, args.target, "removeLegend");
-    const kinds = Object.entries(this.guideConfigs.legend ?? {})
+    const targetKinds = Object.entries(this.guideConfigs.legend ?? {})
       .filter(([, config]) => config?.target === target)
       .map(([kind]) => kind);
-    const semanticKinds = new Set(
-      kinds.map(kind => legendResourcePolicy(kind).semanticKind)
-    );
-    let next = this;
-    for (const kind of semanticKinds) {
-      if (next.semanticSpec.guides.legend?.[kind] !== undefined) {
-        next = next.editSemantic({
-          property: `guide.legend.${kind}`,
-          remove: true
-        });
-      }
-    }
-    for (const id of new Set(kinds.flatMap(legendGraphicIds))) {
-      if (next.graphicSpec.objects[id] !== undefined) {
-        next = next.editGraphics({ target: id, remove: true });
-      }
-    }
-    for (const kind of kinds) {
-      next = next._withoutMaterializationConfig(["guides", "legend", kind]);
-    }
-    return next;
+    const kinds = args.channels === undefined
+      ? targetKinds
+      : resolveRequestedKinds(this, target, args.channels);
+    let next = removeLegendKinds(this, kinds);
+    const retainedKinds = Object.keys(next.guideConfigs.legend ?? {});
+    if (args.channels === undefined) {
+      const removedSemanticKinds = new Set(
+        kinds.map(kind => legendResourcePolicy(kind).semanticKind)
+      );
+      const hasSharedSemanticKind = retainedKinds.some(kind =>
+        removedSemanticKinds.has(legendResourcePolicy(kind).semanticKind)
+      );
+      return hasSharedSemanticKind ? next.rematerializeLegend() : next;
+    }
+    const remainingTargetKinds = targetKinds.filter(kind => !kinds.includes(kind));
+    const removedCategorical = kinds.some(kind => ["series", "color"].includes(kind));
+    if (
+      removedCategorical &&
+      remainingTargetKinds.includes("size") &&
+      next.guideConfigs.legend.size.inheritAppearance === true
+    ) {
+      next = next._withLegendConfig("size", {
+        ...next.guideConfigs.legend.size,
+        inheritAppearance: false
+      });
+    }
+    return retainedKinds.length === 0
+      ? next
+      : next.rematerializeLegend();
   }
 );

package/src/actions/guides/legends/strokeWidth.js

@@ -10,6 +10,21 @@ import { DEFAULT_COLORS, DEFAULT_FONT_FAMILY } from
 
 const OPTIONS = Object.freeze(["target", "count"]);
 
+export const STROKE_WIDTH_LEGEND_LABELS = Object.freeze({
+  offset: 12,
+  color: DEFAULT_COLORS.text,
+  fontSize: 12,
+  fontFamily: DEFAULT_FONT_FAMILY,
+  fontWeight: "normal"
+});
+
+export const STROKE_WIDTH_LEGEND_TITLE_STYLE = Object.freeze({
+  color: DEFAULT_COLORS.strongText,
+  fontSize: 13,
+  fontFamily: DEFAULT_FONT_FAMILY,
+  fontWeight: 600
+});
+
 export function isStrokeWidthLegendLayer(layer) {
   return ["line", "rule"].includes(layer?.mark?.type) &&
     layer.encoding?.strokeWidth?.scale !== undefined;
@@ -41,14 +56,12 @@ function requireScale(program, id) {
   return scale;
 }
 
-function styleText(program, id, { title = false } = {}) {
+function styleText(program, id, style) {
   return program
-    .editGraphics({ target: id, property: "fill", value: title
-      ? DEFAULT_COLORS.strongText
-      : DEFAULT_COLORS.text })
-    .editGraphics({ target: id, property: "fontSize", value: title ? 13 : 12 })
-    .editGraphics({ target: id, property: "fontFamily", value: DEFAULT_FONT_FAMILY })
-    .editGraphics({ target: id, property: "fontWeight", value: title ? 600 : "normal" })
+    .editGraphics({ target: id, property: "fill", value: style.color })
+    .editGraphics({ target: id, property: "fontSize", value: style.fontSize })
+    .editGraphics({ target: id, property: "fontFamily", value: style.fontFamily })
+    .editGraphics({ target: id, property: "fontWeight", value: style.fontWeight })
     .editGraphics({ target: id, property: "textAlign", value: "left" })
     .editGraphics({ target: id, property: "textBaseline", value: "middle" });
 }
@@ -60,10 +73,16 @@ export const rematerializeStrokeWidthLegend = action(
   },
   function (args = {}) {
     validateKeys(args, [], "rematerializeStrokeWidthLegend");
-    const config = this.guideConfigs.legend?.strokeWidth;
-    if (config === undefined) {
+    const stored = this.guideConfigs.legend?.strokeWidth;
+    if (stored === undefined) {
       throw new Error("Stroke-width legend requires stored configuration.");
     }
+    const config = {
+      ...stored,
+      labels: stored.labels ?? { ...STROKE_WIDTH_LEGEND_LABELS },
+      titleStyle: stored.titleStyle ?? { ...STROKE_WIDTH_LEGEND_TITLE_STYLE },
+      titleVisible: stored.titleVisible !== false
+    };
     const layer = findLayer(this, config.target);
     const encoding = layer?.encoding?.strokeWidth;
     if (encoding?.scale === undefined) {
@@ -101,18 +120,24 @@ export const rematerializeStrokeWidthLegend = action(
       .editGraphics({ target: "strokeWidthLegendSymbols", property: "stroke", value: DEFAULT_COLORS.mark })
       .editGraphics({ target: "strokeWidthLegendSymbols", property: "strokeWidth", value: widths })
       .editGraphics({ target: "strokeWidthLegendLabels", property: "length", value: values.length })
-      .editGraphics({ target: "strokeWidthLegendLabels", property: "x", value: values.map(() => originX + 44) })
+      .editGraphics({
+        target: "strokeWidthLegendLabels",
+        property: "x",
+        value: values.map(() => originX + 32 + config.labels.offset)
+      })
       .editGraphics({ target: "strokeWidthLegendLabels", property: "y", value: y })
       .editGraphics({
         target: "strokeWidthLegendLabels",
         property: "text",
         value: values.map(value => String(+value.toPrecision(3)))
-      })
+      });
+    next = styleText(next, "strokeWidthLegendLabels", config.labels);
+    if (config.titleVisible === false) return next;
+    next = next
       .editGraphics({ target: "strokeWidthLegendTitle", property: "x", value: originX })
       .editGraphics({ target: "strokeWidthLegendTitle", property: "y", value: titleY })
       .editGraphics({ target: "strokeWidthLegendTitle", property: "text", value: title });
-    next = styleText(next, "strokeWidthLegendLabels");
-    return styleText(next, "strokeWidthLegendTitle", { title: true });
+    return styleText(next, "strokeWidthLegendTitle", config.titleStyle);
   }
 );
 
@@ -140,7 +165,10 @@ export const createStrokeWidthLegend = action(
         scale: encoding.scale,
         title: encoding.field,
         inferredTitle: true,
-        count
+        count,
+        labels: { ...STROKE_WIDTH_LEGEND_LABELS },
+        titleStyle: { ...STROKE_WIDTH_LEGEND_TITLE_STYLE },
+        titleVisible: true
       })
       .createGraphics({
         id: "strokeWidthLegendSymbols",

package/src/actions/marks/arc/actions.js

@@ -46,8 +46,8 @@ function validateInnerRadius(value) {
   return value;
 }
 
-function normalizeConfig(args, previous = {}) {
-  return {
+function normalizeConfig(args, previous = {}, { allowStrokeRemoval = false } = {}) {
+  let config = {
     ...previous,
     ...(Object.hasOwn(args, "innerRadius")
       ? { innerRadius: validateInnerRadius(args.innerRadius) }
@@ -61,18 +61,28 @@ function normalizeConfig(args, previous = {}) {
     ...(Object.hasOwn(args, "opacity")
       ? { opacity: validateUnitInterval(args.opacity, "Arc opacity") }
       : {}),
-    ...(Object.hasOwn(args, "stroke")
+    ...(Object.hasOwn(args, "stroke") && args.stroke !== false
       ? { stroke: validateNonEmptyString(args.stroke, "Arc stroke") }
-      : {}),
-    ...(Object.hasOwn(args, "strokeWidth")
-      ? {
-          strokeWidth: validateNonNegativeFinite(
-            args.strokeWidth,
-            "Arc strokeWidth"
-          )
-        }
       : {})
   };
+  if (args.stroke === false) {
+    if (!allowStrokeRemoval) {
+      throw new TypeError("Arc stroke must be a non-empty string.");
+    }
+    config.stroke = false;
+    delete config.strokeWidth;
+  } else if (Object.hasOwn(args, "stroke")) {
+    if (previous.stroke === false && !Object.hasOwn(args, "strokeWidth")) {
+      config.strokeWidth = 1;
+    }
+  }
+  if (Object.hasOwn(args, "strokeWidth")) {
+    config.strokeWidth = validateNonNegativeFinite(
+      args.strokeWidth,
+      "Arc strokeWidth"
+    );
+  }
+  return config;
 }
 
 const createArcMark = action(
@@ -189,8 +199,16 @@ const rematerializeArcMark = action(
       .editGraphics({ target: id, property: "commands", value: commands })
       .editGraphics({ target: id, property: "fill", value: fills })
       .editGraphics({ target: id, property: "opacity", value: config.opacity ?? 1 })
-      .editGraphics({ target: id, property: "stroke", value: config.stroke ?? "#ffffff" })
-      .editGraphics({ target: id, property: "strokeWidth", value: config.strokeWidth ?? 1 })
+      .editGraphics({
+        target: id,
+        property: "stroke",
+        value: config.stroke === false ? "transparent" : config.stroke ?? "#ffffff"
+      })
+      .editGraphics({
+        target: id,
+        property: "strokeWidth",
+        value: config.stroke === false ? 0 : config.strokeWidth ?? 1
+      })
       .editGraphics({
         target: id,
         property: "strokeDash",
@@ -222,9 +240,23 @@ const editArcMark = action(
     if (Object.hasOwn(args, "fill") && layer.encoding?.color !== undefined) {
       throw new Error("editArcMark fill cannot be combined with a color encoding.");
     }
+    if (args.stroke === false && Object.hasOwn(args, "strokeWidth")) {
+      throw new Error(
+        "editArcMark cannot set strokeWidth while removing stroke."
+      );
+    }
+    if (
+      Object.hasOwn(args, "strokeWidth") &&
+      !Object.hasOwn(args, "stroke") &&
+      this.markConfigs[layer.id]?.stroke === false
+    ) {
+      throw new Error("editArcMark strokeWidth requires an active stroke.");
+    }
     const next = this._withMarkConfig(
       layer.id,
-      normalizeConfig(args, this.markConfigs[layer.id])
+      normalizeConfig(args, this.markConfigs[layer.id], {
+        allowStrokeRemoval: true
+      })
     );
     return canMaterializeArc(next, layer)
       ? next.rematerializeArcMark({ id: layer.id })

package/src/actions/marks/point/edit.js

@@ -61,12 +61,24 @@ export const editPointMark = action(
     if (Object.hasOwn(args, "opacity")) {
       config.opacity = validateUnitInterval(args.opacity, "Point opacity");
     }
+    if (args.stroke === false && Object.hasOwn(args, "strokeWidth")) {
+      throw new Error(
+        "editPointMark cannot set strokeWidth while removing stroke."
+      );
+    }
     if (Object.hasOwn(args, "stroke")) {
-      config.stroke = validateNonEmptyString(args.stroke, "Point stroke");
-      config.strokeWidth ??= 1;
+      if (args.stroke === false) {
+        config.stroke = false;
+        delete config.strokeWidth;
+      } else {
+        const restoresStroke = config.stroke === false;
+        config.stroke = validateNonEmptyString(args.stroke, "Point stroke");
+        if (restoresStroke) config.strokeWidth = 1;
+        else config.strokeWidth ??= 1;
+      }
     }
     if (Object.hasOwn(args, "strokeWidth")) {
-      if (config.stroke === undefined) {
+      if (typeof config.stroke !== "string") {
         throw new Error("Point strokeWidth requires an active stroke.");
       }
       config.strokeWidth = validateNonNegativeFinite(

package/src/actions/marks/point/materialize.js

@@ -129,7 +129,9 @@ function resolveJitterEntries({
     const extent = resolvePointShapeExtent({
       shape: shapes[index],
       area: resolvedArea,
-      strokeWidth: config.stroke === undefined ? 0 : config.strokeWidth ?? 1
+      strokeWidth: typeof config.stroke === "string"
+        ? config.strokeWidth ?? 1
+        : 0
     });
     return [{
       index,
@@ -289,7 +291,7 @@ export const rematerializePointMark = action(
           y: centerY,
           area: resolvedArea,
           fill: color,
-          ...(config.stroke === undefined ? {} : { stroke: config.stroke }),
+          ...(typeof config.stroke === "string" ? { stroke: config.stroke } : {}),
           ...(config.strokeWidth === undefined
             ? {}
             : { strokeWidth: config.strokeWidth }),
@@ -371,7 +373,11 @@ export const rematerializePointMark = action(
     } else if (encodedOpacity !== undefined) {
       next = next.editGraphics({ target: id, property: "opacity", value: encodedOpacity });
     }
-    if (config.stroke !== undefined) {
+    if (config.stroke === false) {
+      next = next
+        .editGraphics({ target: id, property: "stroke", value: "transparent" })
+        .editGraphics({ target: id, property: "strokeWidth", value: 0 });
+    } else if (config.stroke !== undefined) {
       next = next.editGraphics({ target: id, property: "stroke", value: config.stroke });
       next = next.editGraphics({
         target: id,

package/src/actions/marks/rule/actions.js

@@ -238,7 +238,10 @@ const rematerializeRuleMark = action(
       }
     }
 
-    const resolvedConfig = resolved.markConfigs[id] ?? DEFAULT_RULE_CONFIG;
+    const resolvedConfig = {
+      ...DEFAULT_RULE_CONFIG,
+      ...resolved.markConfigs[id]
+    };
     const dashEncoding = layer.encoding?.strokeDash;
     const opacityEncoding = layer.encoding?.opacity;
     const strokeWidthEncoding = layer.encoding?.strokeWidth;