ggaction 0.0.17 → 0.0.18

package/src/actions/guides/legends/categorical/components.js

@@ -1,4 +1,5 @@
 import { editGraphicProperties } from "../../../primitives/graphicProperties.js";
+import { materializeLegendTitleLines } from "../../../../materialization/legendText.js";
 import { action } from "../../../../core/action.js";
 import {
   activeConfig,
@@ -19,15 +20,17 @@ export const rematerializeLegendLabels = /* @__PURE__ */ action(
       throw new Error("rematerializeLegendLabels requires existing legend labels.");
     }
     const layout = resolveLayout(this, config);
+    const labels = categoricalLegendLabels(config);
+    const visible = labels.flatMap((text, index) => text === "" ? [] : [index]);
     return editGraphicProperties(editGraphicProperties(this, id, {
-      length: config.domain.length,
-      x: layout.labelX,
-      y: layout.itemY
+      length: visible.length,
+      x: visible.map(index => layout.labelX[index]),
+      y: visible.map(index => layout.itemY[index])
     })
       .editGraphics({
         target: id,
         property: "text",
-        value: categoricalLegendLabels(config)
+        value: visible.map(index => labels[index])
       }), id, {
       fill: config.labels.color,
       fontSize: config.labels.fontSize,
@@ -52,7 +55,7 @@ export const createLegendLabels = /* @__PURE__ */ action(
       .createGraphics({
         id,
         type: "text",
-        length: config.domain.length,
+        length: categoricalLegendLabels(config).length,
         ...resolveCategoricalLegendPlacement(this)
       })
       .rematerializeLegendLabels({ kind: config.kind });
@@ -69,7 +72,7 @@ export const rematerializeLegendTitle = /* @__PURE__ */ action(
       throw new Error("rematerializeLegendTitle requires an existing legend title.");
     }
     const layout = resolveLayout(this, config);
-    return editGraphicProperties(this, id, {
+    const next = editGraphicProperties(this, id, {
       x: layout.titleX,
       y: layout.titleY,
       text: config.title,
@@ -81,12 +84,13 @@ export const rematerializeLegendTitle = /* @__PURE__ */ action(
       .editGraphics({
         target: id,
         property: "textAlign",
-        value: ["top", "bottom"].includes(config.position) &&
+        value: config.titleStyle.align ?? (["top", "bottom"].includes(config.position) &&
           config.titlePosition === "top"
           ? "center"
-          : "left"
+          : "left")
       })
       .editGraphics({ target: id, property: "textBaseline", value: "middle" });
+    return materializeLegendTitleLines(next, id, config.title, config.titleStyle);
   }
 );
 

package/src/actions/guides/legends/categorical/index.js

@@ -29,6 +29,7 @@ import {
 } from "./symbols.js";
 import { activeConfig, noOptions, symbolGraphic } from "./layout.js";
 import {
+  rematerializeLegendGroups,
   rematerializeHorizontalLegendLane,
   rematerializeSideLegendLane
 } from "../lane.js";
@@ -68,6 +69,10 @@ function createLegendHighlightAction() {
     },
     function (args = {}) {
       noOptions(args, "rematerializeLegendHighlights");
+      if (this.context.deferGuideLayoutValidation !== true &&
+          Object.values(this.guideConfigs.legend ?? {}).some(config => ["left", "right"].includes(config.position))) {
+        return this.rematerializeLegend();
+      }
       const kinds = args.kind === undefined
         ? ["series", "color", "stroke"].filter(
             kind => this.guideConfigs.legend?.[kind] !== undefined
@@ -134,6 +139,7 @@ export function registerBasicCategoricalLegendActions(ProgramClass) {
   ProgramClass.prototype.createLegendTitle = createLegendTitle;
   ProgramClass.prototype.rematerializeLegendTitle = rematerializeLegendTitle;
   ProgramClass.prototype.rematerializeLegend = rematerializeLegend;
+  ProgramClass.prototype.rematerializeLegendGroups = rematerializeLegendGroups;
   ProgramClass.prototype.rematerializeSideLegendLane =
     rematerializeSideLegendLane;
   ProgramClass.prototype.rematerializeHorizontalLegendLane =

package/src/actions/guides/legends/categorical/layout.js

@@ -1,3 +1,6 @@
+import { findLayer } from "../../../../selectors/layers.js";
+import { isLinearGradientPaint } from "../../../../grammar/paint.js";
+import { intrinsicLegendConfig } from "../../../../materialization/legendGroups.js";
 import { validateOptionObject } from "../../../../core/validation.js";
 import { mapOrdinalValues } from "../../../../grammar/scales/index.js";
 import { DEFAULT_COLORS } from "../../../../theme/defaults.js";
@@ -78,12 +81,20 @@ export function symbolWidth(config) {
   }));
 }
 
+export function categoricalLegendView(config) {
+  if (config.hiddenCount !== undefined || !config.overflow || config.domain.length <= config.overflow.maxItems) return config;
+  return { ...config, domain: config.domain.slice(0, config.overflow.maxItems),
+    hiddenCount: config.domain.length - config.overflow.maxItems };
+}
+
 export function categoricalLegendLabels(config) {
-  return config.domain.map(value => resolveDisplayLabel(
+  config = categoricalLegendView(config);
+  const labels = config.domain.map(value => resolveDisplayLabel(
     value,
     config.labelMap,
     formatVisibleText
   ));
+  return config.hiddenCount > 0 ? [...labels, `…${config.hiddenCount} entries`] : labels;
 }
 
 function resolveSampleBounds(program, config, width) {
@@ -96,7 +107,7 @@ function resolveSampleBounds(program, config, width) {
           stroke: layer.stroke ?? (config.channels.includes("stroke")
             ? appearance.strokes[index]
             : appearance.colors[index]),
-          strokeWidth: layer.lineWidth, opacity: layer.opacity,
+          strokeWidth: layer.lineWidth, opacity: layer.opacity ?? appearance.opacity,
           ...requestedStrokeDetails(layer, "Legend line symbol") } };
       }
       if (layer.type === "swatch") {
@@ -106,21 +117,21 @@ function resolveSampleBounds(program, config, width) {
           stroke: config.channels.includes("stroke")
             ? appearance.strokes[index]
             : layer.stroke,
-          opacity: layer.opacity,
+          opacity: layer.opacity ?? appearance.opacity,
           ...requestedStrokeDetails(details, "Legend swatch symbol")
-        }, details.cornerRadius ?? 0);
+        }, details);
       }
       if (config.channels.includes("shape")) {
         return createPointShapeGraphic({ shape: appearance.shapes[index], x: width / 2, y: 0,
           area: Math.PI * layer.size ** 2, fill: layer.fill ?? appearance.colors[index],
-          stroke: layer.stroke, strokeWidth: layer.strokeWidth, opacity: layer.opacity,
+          stroke: layer.stroke, strokeWidth: layer.strokeWidth, opacity: layer.opacity ?? appearance.opacity,
           ...requestedStrokeDetails(layer, "Legend point symbol") });
       }
       return { type: "circle", properties: { x: width / 2, y: 0, radius: layer.size,
         stroke: config.channels.includes("stroke")
           ? appearance.strokes[index]
           : layer.stroke,
-        strokeWidth: layer.strokeWidth, opacity: layer.opacity,
+        strokeWidth: layer.strokeWidth, opacity: layer.opacity ?? appearance.opacity,
         ...requestedStrokeDetails(layer, "Legend point symbol") } };
     });
     return items.map((item, itemIndex) => {
@@ -147,6 +158,8 @@ function resolveSampleBounds(program, config, width) {
 }
 
 export function resolveLayout(program, config) {
+  config = intrinsicLegendConfig(program, config);
+  config = categoricalLegendView(config);
   const { plot, canvas } = resolveContinuousBounds(program,
     "Legend layout requires Canvas bounds, width, and height.");
   const width = symbolWidth(config);
@@ -160,7 +173,14 @@ export function resolveLayout(program, config) {
 }
 
 export function resolveAppearance(program, config) {
-  let colors = config.domain.map(() => DEFAULT_COLORS.mark);
+  const target = findLayer(program, config.target);
+  const gradientFallback = target?.mark?.type === "area" &&
+    target.encoding.color === undefined &&
+    !config.channels.includes("color") &&
+    isLinearGradientPaint(program.markConfigs[target.id]?.fill);
+  const fallback = gradientFallback
+    ? program.markConfigs[target.id].fill : DEFAULT_COLORS.mark;
+  let colors = config.domain.map(() => fallback);
   let strokes = config.domain.map(() => "white");
   let dashes = config.domain.map(() => []);
   let shapes = config.domain.map(() => "circle");
@@ -172,7 +192,8 @@ export function resolveAppearance(program, config) {
     if (config.channels[index] === "strokeDash") dashes = values;
     if (config.channels[index] === "shape") shapes = values;
   }
-  return { colors, strokes, dashes, shapes };
+  return { colors, strokes, dashes, shapes,
+    ...(gradientFallback ? { opacity: program.markConfigs[target.id].opacity } : {}) };
 }
 
 export function noOptions(args, operation) {
@@ -189,3 +210,11 @@ export function layerFor(config, type) {
   }
   return layer;
 }
+
+
+export function resolveSymbolLayout(program, config) {
+  const view = categoricalLegendView(config);
+  const layout = resolveLayout(program, view);
+  return { ...layout, symbolX: layout.symbolX.slice(0, view.domain.length),
+    itemY: layout.itemY.slice(0, view.domain.length) };
+}

package/src/actions/guides/legends/categorical/options.js

@@ -1,3 +1,5 @@
+import { LEGEND_TITLE_STYLE_KEYS, validateLegendTitleAlignment } from "../../../../grammar/legendTitleStyle.js";
+import { PLOT_LEGEND_POSITIONS, isPlotLegend } from "../../../../layout/legend.js";
 import { validateOptionObject } from "../../../../core/validation.js";
 import { CATEGORICAL_LEGEND_CHANNELS } from "../../../../core/vocabulary.js";
 import { normalizeRecipe } from "./recipes.js";
@@ -9,7 +11,7 @@ import {
   validateKeys,
   validateObject
 } from "./validation.js";
-import { DEFAULT_COLORS, DEFAULT_FONT_FAMILY } from
+import { DEFAULT_COLORS, DEFAULT_FONT_FAMILY, DEFAULT_VERTICAL_LEGEND_ITEM_GAP } from
   "../../../../theme/defaults.js";
 
 export const CHANNELS = CATEGORICAL_LEGEND_CHANNELS;
@@ -29,7 +31,8 @@ const OPTIONS = Object.freeze([
   "labels",
   "titleStyle",
   "itemGap",
-  "border"
+  "border",
+  "overflow"
 ]);
 const TEXT_OPTIONS = Object.freeze([
   "offset",
@@ -39,12 +42,19 @@ const TEXT_OPTIONS = Object.freeze([
   "fontWeight",
   "format"
 ]);
-const TITLE_OPTIONS = Object.freeze([
-  "color",
-  "fontSize",
-  "fontFamily",
-  "fontWeight"
-]);
+
+export function normalizeLegendOverflow(value) {
+  if (value === undefined || value === false) return value;
+  validateObject(value, ["maxItems", "summary"], "Legend overflow");
+  if (!Number.isInteger(value.maxItems) || value.maxItems < 1) {
+    throw new RangeError("Legend overflow.maxItems must be a positive integer.");
+  }
+  if (value.summary !== undefined && value.summary !== "ellipsis-count") {
+    throw new Error("Legend overflow.summary must be ellipsis-count.");
+  }
+  return { maxItems: value.maxItems, summary: "ellipsis-count" };
+}
+
 const BORDER_OPTIONS = Object.freeze([
   "color",
   "lineWidth",
@@ -99,7 +109,7 @@ export function normalizeOptions(args, kind, { internalSymbol = false } = {}) {
   if (Object.hasOwn(args, "titleStyle")) {
     validateObject(
       args.titleStyle,
-      TITLE_OPTIONS,
+      LEGEND_TITLE_STYLE_KEYS,
       "createLegend.titleStyle"
     );
   }
@@ -121,13 +131,15 @@ export function normalizeOptions(args, kind, { internalSymbol = false } = {}) {
   };
   const position = args.position ?? defaults.position;
   const align = args.align ?? defaults.align;
+  const inside = isPlotLegend({ position });
   const side = ["left", "right"].includes(position);
-  const direction = args.direction ?? (side ? "vertical" : "horizontal");
+  const direction = args.direction ?? (side || inside ? "vertical" : "horizontal");
   const columns = args.columns;
   const offset = args.offset ?? 8;
   const titlePosition = args.titlePosition ?? "top";
-  const itemGap = args.itemGap ?? (["right", "left"].includes(position)
-    ? 28
+  validateLegendTitleAlignment(titleStyle, titlePosition);
+  const itemGap = args.itemGap ?? (direction === "vertical"
+    ? DEFAULT_VERTICAL_LEGEND_ITEM_GAP
     : position === "top" ? 24 : 20);
   const layout = args.layout === undefined ? "edge" : args.layout;
   if (!["edge", "legacy-bottom"].includes(layout)) {
@@ -142,14 +154,14 @@ export function normalizeOptions(args, kind, { internalSymbol = false } = {}) {
     throw new Error('Legend columns, vertical direction, left title and custom offset require layout "edge".');
   }
 
-  if (!["right", "left", "bottom", "top"].includes(position)) {
+  if (!["right", "left", "bottom", "top", ...PLOT_LEGEND_POSITIONS].includes(position)) {
     throw new Error(`Unsupported legend position "${position}".`);
   }
   if (!["left", "center", "right"].includes(align)) {
     throw new Error(`Unsupported legend alignment "${align}".`);
   }
-  if (["right", "left"].includes(position) && align !== "center") {
-    throw new Error("Side legends currently require center alignment.");
+  if ((side || inside) && align !== "center") {
+    throw new Error(inside ? "In-plot legends require center alignment." : "Side legends currently require center alignment.");
   }
   if (!["horizontal", "vertical"].includes(direction)) {
     throw new Error(`Unsupported legend direction "${direction}".`);
@@ -157,11 +169,8 @@ export function normalizeOptions(args, kind, { internalSymbol = false } = {}) {
   if (side && direction !== "vertical") {
     throw new Error("Side legends require vertical direction.");
   }
-  if (side && columns !== undefined && columns !== 1) {
-    throw new Error("Side legends require one column.");
-  }
-  if (side && titlePosition !== "top") {
-    throw new Error("Side legends require a top title.");
+  if ((side || inside) && titlePosition !== "top") {
+    throw new Error(inside ? "In-plot legends require a top title." : "Side legends require a top title.");
   }
   if (columns !== undefined && (!Number.isInteger(columns) || columns <= 0)) {
     throw new RangeError("Legend columns must be a positive integer.");
@@ -181,7 +190,9 @@ export function normalizeOptions(args, kind, { internalSymbol = false } = {}) {
   validateFontWeight(titleStyle.fontWeight, "Legend title fontWeight");
   positive(itemGap, "Legend itemGap");
 
+  const overflow = normalizeLegendOverflow(args.overflow);
   return {
+    ...(overflow === undefined ? {} : { overflow }),
     target: args.target,
     channels: args.channels,
     position,

package/src/actions/guides/legends/categorical/resolve.js

@@ -17,7 +17,7 @@ function isCategoricalTarget(layer) {
       channel => layer.encoding?.[channel]?.scale !== undefined
     );
   }
-  return ["bar", "area", "arc", "rect", "rule", "tick"].includes(
+  return ["bar", "area", "arc", "rect", "rule", "tick", "text"].includes(
     layer?.mark?.type
   ) && ["color", "stroke"].some(
     channel => layer.encoding?.[channel]?.scale !== undefined
@@ -49,7 +49,7 @@ export const sameValues = sameOrderedValues;
 
 function resolveLegendKind(layer, requestedChannels) {
   if (sameValues(requestedChannels, ["stroke"])) return "stroke";
-  if (["bar", "area", "arc", "rect"].includes(layer.mark.type)) return "color";
+  if (["bar", "area", "arc", "rect", "text"].includes(layer.mark.type)) return "color";
   if (
     layer.mark.type === "point" &&
     sameValues(requestedChannels, ["color"])

package/src/actions/guides/legends/categorical/symbols.js

@@ -2,17 +2,19 @@ import { editGraphicProperties } from "../../../primitives/graphicProperties.js"
 import { action } from "../../../../core/action.js";
 import {
   activeConfig,
+  categoricalLegendView,
   graphic,
   layerFor,
   noOptions,
   resolveAppearance,
-  resolveLayout,
+  resolveSymbolLayout as resolveLayout,
   symbolGraphic,
   symbolWidth
 } from "./layout.js";
 import { resolveCategoricalLegendPlacement } from "../lifecycle.js";
 import { createPointShapeGraphic } from "../../../../grammar/pointShapes.js";
 import {
+  hasRectRadius,
   materializeRectItem,
   requestedRectStyleDetails
 } from "../../../../grammar/roundedRect.js";
@@ -32,11 +34,12 @@ function makeEditSymbol(type) {
     { op, description: `Rematerialize categorical legend ${type} symbols.` },
     function (args = {}) {
       noOptions(args, op);
-      const { config } = activeConfig(this, args.kind);
+      const { config: stored } = activeConfig(this, args.kind);
+      const config = categoricalLegendView(stored);
       const layer = layerFor(config, type);
       const id = symbolGraphic(config, type);
       const dynamicPoint = type === "point" && config.channels.includes("shape");
-      const styledSwatch = type === "swatch" && Object.hasOwn(layer, "cornerRadius");
+      const styledSwatch = type === "swatch" && hasRectRadius(layer);
       const expected = dynamicPoint || styledSwatch
         ? "collection"
         : { line: "line", point: "circle", swatch: "rect" }[type];
@@ -81,7 +84,7 @@ function makeEditSymbol(type) {
         )) {
           next = next.editGraphics({ target: id, property, value });
         }
-        return applyLayerOpacity(next, id, layer.opacity);
+        return applyLayerOpacity(next, id, layer.opacity ?? appearance.opacity);
       }
       if (type === "point") {
         const x = layout.symbolX.map(value => value + symbolWidth(config) / 2);
@@ -98,7 +101,7 @@ function makeEditSymbol(type) {
                 ? appearance.strokes[index]
                 : layer.stroke,
               strokeWidth: layer.strokeWidth,
-              opacity: layer.opacity,
+              opacity: layer.opacity ?? appearance.opacity,
               ...requestedStrokeDetails(layer, "Legend point symbol")
             });
           });
@@ -127,7 +130,7 @@ function makeEditSymbol(type) {
         )) {
           next = next.editGraphics({ target: id, property, value });
         }
-        return applyLayerOpacity(next, id, layer.opacity);
+        return applyLayerOpacity(next, id, layer.opacity ?? appearance.opacity);
       }
       const x = layout.symbolX.map(
         value => value + (symbolWidth(config) - layer.width) / 2
@@ -151,9 +154,9 @@ function makeEditSymbol(type) {
           fill: fills[index],
           stroke: strokes[index],
           strokeWidth: layer.strokeWidth,
-          ...(layer.opacity === undefined ? {} : { opacity: layer.opacity }),
+          ...((layer.opacity ?? appearance.opacity) === undefined ? {} : { opacity: layer.opacity ?? appearance.opacity }),
           ...requestedStrokeDetails(details, "Legend swatch symbol")
-        }, details.cornerRadius ?? 0))
+        }, details))
       );
     }
   );
@@ -166,14 +169,15 @@ function makeCreateSymbol(type, edit) {
     { op, description: `Create categorical legend ${type} symbols.` },
     function (args = {}) {
       noOptions(args, op);
-      const { config } = activeConfig(this, args.kind);
+      const { config: stored } = activeConfig(this, args.kind);
+      const config = categoricalLegendView(stored);
       const layer = layerFor(config, type);
       const id = symbolGraphic(config, type);
       if (this.graphicSpec.objects[id] !== undefined) {
         throw new Error(`${op} requires missing ${type} symbols.`);
       }
       const graphicType = type === "point" && config.channels.includes("shape") ||
-        type === "swatch" && (layer.cornerRadius ?? 0) > 0
+        type === "swatch" && hasRectRadius(layer)
         ? "collection"
         : { line: "line", point: "circle", swatch: "rect" }[type];
       return this
@@ -213,7 +217,8 @@ export const createLegendSymbols = /* @__PURE__ */ action(
   { op: "createLegendSymbols", description: "Create layered legend symbols." },
   function (args = {}) {
     noOptions(args, "createLegendSymbols");
-    const { config } = activeConfig(this, args.kind);
+    const { config: stored } = activeConfig(this, args.kind);
+    const config = categoricalLegendView(stored);
     let next = this;
     for (const layer of config.symbol.layers) {
       const operation = {
@@ -231,7 +236,8 @@ export const rematerializeLegendSymbols = /* @__PURE__ */ action(
   { op: "rematerializeLegendSymbols", description: "Rematerialize layered legend symbols." },
   function (args = {}) {
     noOptions(args, "rematerializeLegendSymbols");
-    const { config } = activeConfig(this, args.kind);
+    const { config: stored } = activeConfig(this, args.kind);
+    const config = categoricalLegendView(stored);
     let next = this;
     for (const layer of config.symbol.layers) {
       const operation = {

package/src/actions/guides/legends/categorical/validation.js

@@ -19,9 +19,4 @@ export const nonEmptyString = validateNonEmptyString;
 export const nonNegative = validateNonNegativeFinite;
 export const positive = validatePositiveFinite;
 
-export function validateFontWeight(value, label) {
-  if (typeof value !== "string" && !Number.isFinite(value)) {
-    throw new TypeError(`${label} must be a string or number.`);
-  }
-  return value;
-}
+export { validateFontWeight } from "../../../../core/validation.js";

package/src/actions/guides/legends/continuous/colorSymbols.js

@@ -0,0 +1 @@
+import{validateOptionObject as h,validatePositiveFinite as k,validateNonNegativeFinite as x,validateNonEmptyString as v}from"../../../../core/validation.js";import{intrinsicLegendConfig as L}from"../../../../materialization/legendGroups.js";import{mapScaleConsumerValues as C}from"../../../../materialization/scales/map.js";import{transformedTicks as G}from"../../../../grammar/scales/index.js";import{resolveLegendItemLayout as _}from"../../../../layout/legendItems.js";import{editGraphicProperties as u}from"../../../primitives/graphicProperties.js";import{normalizeLegendSampling as z,readLegendSampling as W,validateSamplingAgainstScale as w,resolveLegendSampleValues as B}from"../sampling.js";import{normalizeContinuousLegend as T,normalizeItemLegendLayout as P,resolveContinuousBounds as V,formatContinuousValues as E,assertLegendBoundsInsideCanvas as F,resolveLegendBackgroundFromBounds as I,editLegendBackground as N,styleContinuousText as y}from"./common.js";function q(t){if(t===void 0||t==="auto")return{type:"point",radius:7,strokeWidth:1};if(h(t,["type","radius","stroke","strokeWidth"],"Sampled color symbol"),t.type!==void 0&&t.type!=="point")throw new Error("Sampled color symbol requires type point.");const e={type:"point",radius:7,strokeWidth:1,...t};return k(e.radius,"Sampled color symbol radius"),x(e.strokeWidth,"Sampled color symbol strokeWidth"),e.stroke!==void 0&&v(e.stroke,"Sampled color symbol stroke"),e}function Q(t,e,i="create"){if(t.gradient!==void 0)throw new Error("Symbol color legends do not accept gradient dimensions.");const{representation:l,values:r,count:s,symbol:o,columns:d,direction:n,itemGap:a,layout:p,titlePosition:c,...m}=t,b=T(m,"gradient"),g=["left","right","top-left","top-right","bottom-left","bottom-right"].includes(t.position??"right"),S=P({...t,itemGap:t.itemGap??(g?18:20)},{multiColumnSide:!0}),{count:X,...f}=b;return{...f,...S,representation:"symbols",sampling:z(t,{previous:e,operation:i,label:"Sampled color legend"}),symbol:q(t.symbol)}}function O(t,e,i){e=L(t,e);const{plot:l,canvas:r}=V(t),s=w(W(e),i,"Sampled color legend");let o=s.mode==="auto"&&["log","sqrt","symlog"].includes(i.type)?G(i.type,i.domain,s.count,i.type==="log"?{base:i.base}:i.type==="symlog"?{constant:i.constant}:{}):B(e,i,"Sampled color legend");s.mode==="auto"&&i.midpoint!==void 0&&!o.includes(i.midpoint)&&(o=[...o,i.midpoint].sort((c,m)=>c-m));let d=E(o,i.domain,e.fieldType,e.labels.format);const n=e.symbol.radius+e.symbol.strokeWidth/2,a=_(l,e,d,{width:n*2,height:n*2},r,t.materializationConfigs.textMetrics);F(a.bounds,r,"Sampled color legend",e);const p=I(a.bounds,e.border,r,"Sampled color legend",e);return{...a,background:p,values:o,texts:d,extent:n,config:e}}function R(t,e,i){const l=i,{scale:r,encoding:s}=e,o=O(t,l,r),d=C(o.values,r,"color");let n=t.editSemantic({property:"guide.legend.color.scale",value:s.scale}).editSemantic({property:"guide.legend.color.title",value:l.title})._withLegendConfig("gradient",e.config);return n=u(n,"colorGradientSymbols",{length:o.values.length,x:o.symbolX.map(a=>a+o.extent),y:o.itemY,radius:l.symbol.radius,fill:d,stroke:l.symbol.stroke??d,strokeWidth:l.symbol.strokeWidth,opacity:l.blockSymbol?.opacity??1}),n=u(n,"colorGradientLabels",{length:o.values.length,x:o.labelX,y:o.itemY,text:o.texts}),n=N(n,"colorGradientBackground",o.background,l.border),n=y(n,"colorGradientLabels",l.labels),l.titleVisible===!1?n:(n=u(n,"colorGradientTitle",{x:o.title.x,y:o.title.y,text:l.title}),y(n,"colorGradientTitle",l.titleStyle,{align:o.title.align}))}export{R as materializeColorSymbols,q as normalizeColorSymbol,Q as normalizeColorSymbols,O as resolveColorSymbolsLayout};