ggaction 0.0.20 → 0.0.22

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

@@ -1,4 +1,5 @@
 import {findLayer} from '../../../selectors/layers.js';
+import {prepareLegendSpacingEdit} from '../../../grammar/legendSpacing.js';
 import {findCoordinate} from '../../../selectors/coordinates.js';
 import {legendBlockChannels} from '../../../grammar/legendBlocks.js';
 import {mergeLegendTitleStyle} from '../../../grammar/legendTitleStyle.js';
@@ -91,6 +92,7 @@ export function createColorSizeLegendFromConfig(program,config) {
 }
 
 export function resolveColorSizeEdit(program,previous,args) {
+ ({previous,args}=prepareLegendSpacingEdit(previous,args));
  validateOptionObject(args,[...ITEM_LEGEND_OPTIONS.filter(key=>key!=='overflow'),'symbol'],'Color-size legend edit');
  const {count:_count,values:_values,title:_title,...layoutArgs}=args;
  const title=args.title==='auto'?previous.field:typeof args.title==='string'?args.title:previous.title;

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

@@ -1 +1 @@
-import{normalizeLegendClipHeight as O}from"../../../../grammar/legendClip.js";import{applyLegendClipGraphics as $}from"../../../../materialization/legendClip.js";import{normalizeGradientDirection as H}from"../../../../grammar/legendGradient.js";import{normalizeLegendBorderDash as R}from"../../../../grammar/legendBorder.js";import{materializeLegendBorder as q}from"../../../../materialization/legendBorder.js";import{LEGEND_TITLE_STYLE_KEYS as M,mergeLegendTitleStyle as V,validateLegendTitleAlignment as v}from"../../../../grammar/legendTitleStyle.js";import{PLOT_LEGEND_POSITIONS as Y,isPlotLegend as m}from"../../../../layout/legend.js";import{isContinuousColorScaleType as K}from"../../../../grammar/scales/types.js";import{isPlainObject as I}from"../../../../core/immutable.js";import{resolveTextBounds as X}from"../../../../core/textMetrics.js";import{resolveLegendTitleText as J}from"../../../../layout/legendText.js";import{materializeLegendTitleLines as Q}from"../../../../materialization/legendText.js";import{validateKeys as G,validateFontWeight as Z,validateOptionObject as z,validateNonEmptyString as y,validateNonNegativeFinite as ee,validatePositiveFinite as te,validateGeneratedItemLimit as ne}from"../../../../core/validation.js";import{formatTimeTick as ie}from"../../../../grammar/ticks.js";import{formatValue as oe,validateValueFormat as C}from"../../../../grammar/valueFormat.js";import{formatDistinctNumericSamples as re,sampleNumericRange as le}from"../../../../grammar/numeric.js";import{resolveGraphicBounds as de,canvasOverflowError as _}from"../../../../layout/canvas.js";import{isHorizontalEdgeLegend as N}from"../../../../layout/legendLane.js";import{DEFAULT_COLORS as h,DEFAULT_FONT_FAMILY as F,DEFAULT_VERTICAL_LEGEND_ITEM_GAP as w}from"../../../../theme/defaults.js";import{findLayer as se}from"../../../../selectors/layers.js";import{isOpacityLegendLayer as ae}from"../../../../materialization/legends.js";import{findCanvasGraphic as ce}from"../../../../materialization/graphicHierarchy.js";import{normalizeLegendSampling as fe}from"../sampling.js";import{editGraphicProperties as p}from"../../../primitives/graphicProperties.js";const pe=["clipHeight","target","channels","position","align","offset","title","count","values","gradient","symbol","labels","titleStyle","itemGap","border","direction","columns","titlePosition"],Re=Object.freeze(["clipHeight","target","count","values","position","layout","align","direction","columns","titlePosition","offset","itemGap","title","labels","titleStyle","border","overflow"]),ue=["offset","color","fontSize","fontFamily","fontWeight","format"],me=["color","lineWidth","padding","background","strokeDash"],P=["right","left","top","bottom",...Y],x={offset:12,color:h.text,fontSize:12,fontFamily:F,fontWeight:"normal"},D={color:h.text,fontSize:13,fontFamily:F,fontWeight:600},ge=Object.freeze(x),he=Object.freeze({...D,color:h.strongText});function B(e,t){return e!==void 0&&e!==!1&&y(e,"Legend title"),{title:e===!1||e===void 0?t:e,inferredTitle:e===!1||e===void 0,titleVisible:e!==!1}}function qe(e,t,n){const i=["right","left"].includes(e.position??"right")||m(e),r=(e.direction??(i?"vertical":"horizontal"))==="vertical"?w:n;return{...e.clipHeight===void 0?{}:{clipHeight:O(e.clipHeight)},...ye({...e,itemGap:e.itemGap??r}),...B(e.title,t.field),labels:T(e.labels,"createLegend.labels",ge),titleStyle:A(e.titleStyle,"createLegend.titleStyle",he),border:j(e.border)}}const Le={color:h.border,lineWidth:1,padding:12,background:"transparent"},E=te,g=ee;function T(e,t,n){if(e===void 0)return{...n};if(!I(e))throw new TypeError(`${t} must be a plain object.`);G(e,ue,t);const i={...n,...e};Object.hasOwn(i,"offset")&&g(i.offset,`${t} offset`),E(i.fontSize,`${t} fontSize`);for(const o of["color","fontFamily"])y(i[o],`${t} ${o}`);return Z(i.fontWeight,`${t} fontWeight`,"finite number"),Object.hasOwn(i,"format")&&(i.format=C(i.format,`${t} format`)),i}function A(e,t,n,i=!1){e!==void 0&&z(e,M,t);const o=V(n,e,{edit:i}),{align:r,...d}=o;return{...T(d,t,{}),...r===void 0?{}:{align:r}}}function j(e){if(e===void 0||e===!1)return!1;if(e!==!0&&!I(e))throw new TypeError("createLegend.border must be a boolean or plain object.");e!==!0&&G(e,me,"createLegend.border");const t={...Le,...e===!0?{}:e};for(const i of["color","background"])y(t[i],`Legend border ${i}`);g(t.lineWidth,"Legend border lineWidth"),g(t.padding,"Legend border padding");const n=R(t.strokeDash);return{...t,...n===void 0?{}:{strokeDash:n}}}function Me(e,t){z(e,pe,"createLegend");const n=e.position??"right";if(!P.includes(n))throw new Error(`Unsupported legend position "${n}".`);const i=e.align??"center";if(!["left","center","right"].includes(i))throw new Error(`Unsupported legend alignment "${i}".`);if(["left","right"].includes(n)&&i!=="center")throw new Error("Side continuous legends require center alignment.");if(t==="gradient"&&Object.hasOwn(e,"values"))throw new Error("Gradient legends do not support exact sample values.");const o=t==="opacity"?fe(e,{operation:"create",label:"Opacity legend"}):void 0,r=t==="gradient"?e.count??5:void 0;if(t==="gradient"){if(!Number.isInteger(r)||r<2)throw new RangeError("Continuous legend count must be an integer of at least 2.");ne(r,"Continuous legend count")}const d=e.offset??(m({position:n})?8:30);g(d,"Legend offset");const l=e.titlePosition??"top";if(v(e.titleStyle,l),!(t==="gradient"?["top","left","bottom"]:["top","left"]).includes(l))throw new Error(`Unsupported legend titlePosition "${l}".`);if(l==="left"&&(!["top","bottom"].includes(n)||t!=="opacity"))throw new Error("Only horizontal opacity legends support left titlePosition.");const a=e.itemGap??(t==="opacity"&&(["right","left"].includes(n)||m({position:n}))?w:l==="left"?20:28);if(E(a,"Legend itemGap"),t==="gradient"){for(const s of["symbol","columns","itemGap"])if(Object.hasOwn(e,s))throw new Error(`Gradient legend does not accept ${s}.`)}else for(const s of["columns","direction","gradient"])if(Object.hasOwn(e,s))throw new Error(`Opacity legend does not accept ${s}.`);return{...e.clipHeight===void 0?{}:{clipHeight:O(e.clipHeight)},target:e.target,position:n,align:i,offset:d,...t==="gradient"?{count:r,...e.direction===void 0?{}:{gradientDirection:H(e.direction)}}:{sampling:o},...B(e.title),labels:T(e.labels,"createLegend.labels",l==="left"?{...x,offset:8}:x),titleStyle:A(e.titleStyle,"createLegend.titleStyle",D),itemGap:a,titlePosition:l,border:j(e.border)}}function U(e,t,n){const i=e.semanticSpec.layers.filter(n);if(t===void 0)return i.length===1?i[0]:void 0;const o=se(e,t);return i.includes(o)?o:void 0}function Ve(e,t,n){const i=U(e,t,n==="opacity"?ae:o=>o.mark?.type==="point"&&o.encoding?.[n]?.scale!==void 0);if(i===void 0)throw new Error(t===void 0?`${n} legend requires one eligible ${n==="opacity"?"point, line or bar":"point"} mark.`:`Unknown ${n} legend target "${t}".`);return i}function Ye(e,t,n="color"){const i=U(e,t,o=>(n==="stroke"?["point","line","area","bar","rect","arc","rule","tick"]:["point","bar","rect","text","area"]).includes(o.mark?.type)&&o.encoding?.[n]?.scale!==void 0&&(n!=="color"||["quantitative","temporal"].includes(o.encoding[n].fieldType)));if(i===void 0)throw new Error(t===void 0?n==="color"?"color legend requires one eligible point, bar, rect, text, or area mark.":"stroke legend requires one eligible mark.":`Unknown ${n} legend target "${t}".`);return i}function Ke(e,t,n){const i=e.resolvedScales[t];if(n==="sequential"?!K(i?.type):i?.type!==n)throw new Error(`Legend requires resolved ${n} scale "${t}".`);return i}function Xe(e,t="Continuous legend layout requires Canvas bounds."){const n=de(e),i=ce(e);if(n===void 0||![n.x,n.y,n.width,n.height].every(Number.isFinite)||i?.type!=="canvas"||!Number.isFinite(i.properties.width)||!Number.isFinite(i.properties.height))throw new Error(t);return{plot:n,canvas:i.properties}}function Je(e,t){return le(e[0],e[1],t,"Continuous legend domain")}function Qe(e,t,n,i="auto"){const o=C(i,"Legend label format");return o==="auto"?n==="temporal"?e.map(r=>ie(r,t)):re(e):e.map(r=>oe(r,{format:o,valueType:n==="temporal"?"temporal":"quantitative",label:"Legend label format"}))}function k(e,t,n,{align:i="left"}={}){const o=p(e,t,{fill:n.color,fontSize:n.fontSize,fontFamily:n.fontFamily,fontWeight:n.fontWeight,textAlign:i,textBaseline:"middle"});return t.endsWith("Title")?Q(o,t,o.graphicSpec.objects[t].properties.text,n):o}function Ze(e,t,n,i,{hardBreaks:o=!1}={}){return X({x:e.x,y:e.y,text:String(t),...n,...o?{lines:J(t,n,i).lines}:{},textAlign:e.align??"left",textBaseline:"middle"},i)}function et(e,t,n,i){if(!(i?.groupIntrinsic||N(i)||["left","right"].includes(i?.position))&&e.some(o=>o.left<0||o.right>t.width||o.top<0||o.bottom>t.height))throw _(`${n} requires more Canvas margin space.`,e,t)}function tt(e,t,n,i,o){if(t===!1)return;const r=t.lineWidth/2;let d=1/0,l=1/0,a=-1/0,s=-1/0;for(const f of e)d=Math.min(d,f.left),l=Math.min(l,f.top),a=Math.max(a,f.right),s=Math.max(s,f.bottom);if(d-=t.padding,l-=t.padding,a+=t.padding,s+=t.padding,!o?.groupIntrinsic&&!N(o)&&!["left","right"].includes(o?.position)&&(d-r<0||l-r<0||a+r>n.width||s+r>n.height))throw _(`${i} background requires more Canvas margin space.`,[{left:d-r,right:a+r,top:l-r,bottom:s+r}],n);return{x:d,y:l,width:a-d,height:s-l}}function be(e,t,n,i){return n===void 0?e:q(e,t,n,i)}function ye(e,{multiColumnSide:t=!1}={}){const n=e.position??"right";if(!P.includes(n))throw new Error(`Unsupported legend position "${n}".`);const i=["left","right"].includes(n)||m({position:n}),o=e.layout===void 0?"edge":e.layout;if(o!=="edge")throw new Error('This legend requires layout "edge".');const r=e.align??"center";if(!["left","center","right"].includes(r))throw new Error(`Unsupported legend alignment "${r}".`);const d=e.direction??(i?"vertical":"horizontal");if(!["horizontal","vertical"].includes(d))throw new Error(`Unsupported legend direction "${d}".`);const l=e.columns;if(l!==void 0&&(!Number.isInteger(l)||l<1))throw new RangeError("Legend columns must be a positive integer.");const a=e.titlePosition??"top";if(v(e.titleStyle,a),!["top","left"].includes(a))throw new Error(`Unsupported legend titlePosition "${a}".`);if(i&&(r!=="center"||a!=="top"||!t&&(d!=="vertical"||l!==void 0&&l!==1)))throw new Error("Side item legends require vertical direction, center alignment, top title and one column.");const s=e.offset??(m({position:n})?8:30),f=e.itemGap??(d==="vertical"?w:28);return g(s,"Legend offset"),E(f,"Legend itemGap"),{position:n,layout:o,align:r,direction:d,columns:l,titlePosition:a,offset:s,itemGap:f}}function nt(e,t,n,i,{symbols:o,optional:r={},text:d=i.labels,labels:l=i.config.labels,titleStyle:a=i.config.titleStyle}){const s=`${t}Legend`,f=Object.values(o).find(Array.isArray)?.length??d.length;let c=e.editSemantic({property:`guide.legend.${t}.scale`,value:n.scale}).editSemantic({property:`guide.legend.${t}.title`,value:n.title})._withLegendConfig(t,n);c=p(c,`${s}Symbols`,{length:f,...o});const L=i.labelItemIndices,b=u=>L===void 0||!Array.isArray(u)?u:L.map(W=>u[W]);c=p(c,`${s}Labels`,{length:L?.length??d.length,x:b(i.labelX),y:b(i.itemY),text:b(d)}),c=be(c,`${s}Background`,i.background,n.border),c=p(c,`${s}Symbols`,Object.fromEntries(Object.entries(r).filter(([,u])=>u!==void 0))),c=k(c,`${s}Labels`,l);const S=i.config;return S.titleVisible===!1?$(c):(c=p(c,`${s}Title`,{x:i.title.x,y:i.title.y,text:S.title}),$(k(c,`${s}Title`,a,{align:i.title.align})))}function it(e,t,n,i,o,r){const d=`${t}Legend`;let l=e.editSemantic({property:`guide.legend.${t}.scale`,value:n.scale}).editSemantic({property:`guide.legend.${t}.title`,value:n.title})._withLegendConfig(t,n);return n.border!==!1&&(l=l.createGraphics({id:`${d}Background`,type:"rect",...r})),l=l.createGraphics({id:`${d}Symbols`,type:o,length:i,...r}).createGraphics({id:`${d}Labels`,type:"text",length:i,...r}),n.titleVisible!==!1&&(l=l.createGraphics({id:`${d}Title`,type:"text",...r})),l}export{ge as ITEM_LEGEND_LABELS,Re as ITEM_LEGEND_OPTIONS,he as ITEM_LEGEND_TITLE_STYLE,et as assertLegendBoundsInsideCanvas,it as createItemLegendGraphics,p as editGraphicProperties,be as editLegendBackground,Qe as formatContinuousValues,nt as materializeItemLegend,Me as normalizeContinuousLegend,B as normalizeInitialLegendTitle,qe as normalizeItemLegendConfig,ye as normalizeItemLegendLayout,j as normalizeLegendBorder,T as normalizeLegendTextOptions,A as normalizeLegendTitleOptions,Ke as requireResolvedLegendScale,Xe as resolveContinuousBounds,Ye as resolveContinuousColorLayer,Ve as resolveContinuousLegendLayer,tt as resolveLegendBackgroundFromBounds,Ze as resolveLegendTextBounds,Je as sampleContinuousValues,U as selectLegendLayer,k as styleContinuousText,g as validateNonNegative,E as validatePositive};
+import{normalizeLegendClipHeight as O}from"../../../../grammar/legendClip.js";import{normalizeLegendSpacing as $}from"../../../../grammar/legendSpacing.js";import{applyLegendClipGraphics as v}from"../../../../materialization/legendClip.js";import{normalizeGradientDirection as R}from"../../../../grammar/legendGradient.js";import{normalizeLegendBorderDash as q}from"../../../../grammar/legendBorder.js";import{materializeLegendBorder as M}from"../../../../materialization/legendBorder.js";import{LEGEND_TITLE_STYLE_KEYS as V,mergeLegendTitleStyle as Y,validateLegendTitleAlignment as I}from"../../../../grammar/legendTitleStyle.js";import{PLOT_LEGEND_POSITIONS as K,isPlotLegend as m}from"../../../../layout/legend.js";import{isContinuousColorScaleType as X}from"../../../../grammar/scales/types.js";import{isPlainObject as G}from"../../../../core/immutable.js";import{resolveTextBounds as J}from"../../../../core/textMetrics.js";import{resolveLegendTitleText as Q}from"../../../../layout/legendText.js";import{materializeLegendTitleLines as Z}from"../../../../materialization/legendText.js";import{validateKeys as z,validateFontWeight as ee,validateOptionObject as C,validateNonEmptyString as y,validateNonNegativeFinite as te,validatePositiveFinite as ie,validateGeneratedItemLimit as ne}from"../../../../core/validation.js";import{formatTimeTick as oe}from"../../../../grammar/ticks.js";import{formatValue as re,validateValueFormat as P}from"../../../../grammar/valueFormat.js";import{formatDistinctNumericSamples as le,sampleNumericRange as de}from"../../../../grammar/numeric.js";import{resolveGraphicBounds as ae,canvasOverflowError as _}from"../../../../layout/canvas.js";import{isHorizontalEdgeLegend as N}from"../../../../layout/legendLane.js";import{DEFAULT_COLORS as h,DEFAULT_FONT_FAMILY as F,DEFAULT_VERTICAL_LEGEND_ITEM_GAP as w}from"../../../../theme/defaults.js";import{findLayer as se}from"../../../../selectors/layers.js";import{isOpacityLegendLayer as ce}from"../../../../materialization/legends.js";import{findCanvasGraphic as fe}from"../../../../materialization/graphicHierarchy.js";import{normalizeLegendSampling as pe}from"../sampling.js";import{editGraphicProperties as p}from"../../../primitives/graphicProperties.js";const ue=["clipHeight","target","channels","position","align","offset","title","count","values","gradient","symbol","labels","titleStyle","itemGap","rowPadding","titlePadding","border","direction","columns","titlePosition"],Me=Object.freeze(["clipHeight","target","count","values","position","layout","align","direction","columns","titlePosition","offset","itemGap","rowPadding","titlePadding","title","labels","titleStyle","border","overflow"]),me=["offset","color","fontSize","fontFamily","fontWeight","format"],ge=["color","lineWidth","padding","background","strokeDash"],D=["right","left","top","bottom",...K],x={offset:12,color:h.text,fontSize:12,fontFamily:F,fontWeight:"normal"},B={color:h.text,fontSize:13,fontFamily:F,fontWeight:600},he=Object.freeze(x),Le=Object.freeze({...B,color:h.strongText});function A(e,t){return e!==void 0&&e!==!1&&y(e,"Legend title"),{title:e===!1||e===void 0?t:e,inferredTitle:e===!1||e===void 0,titleVisible:e!==!1}}function Ve(e,t,i){const n=["right","left"].includes(e.position??"right")||m(e),r=(e.direction??(n?"vertical":"horizontal"))==="vertical"?w:i;return{...e.clipHeight===void 0?{}:{clipHeight:O(e.clipHeight)},...we({...e,itemGap:e.itemGap??r}),...A(e.title,t.field),labels:T(e.labels,"createLegend.labels",he),titleStyle:j(e.titleStyle,"createLegend.titleStyle",Le),border:k(e.border)}}const be={color:h.border,lineWidth:1,padding:12,background:"transparent"},E=ie,g=te;function T(e,t,i){if(e===void 0)return{...i};if(!G(e))throw new TypeError(`${t} must be a plain object.`);z(e,me,t);const n={...i,...e};Object.hasOwn(n,"offset")&&g(n.offset,`${t} offset`),E(n.fontSize,`${t} fontSize`);for(const o of["color","fontFamily"])y(n[o],`${t} ${o}`);return ee(n.fontWeight,`${t} fontWeight`,"finite number"),Object.hasOwn(n,"format")&&(n.format=P(n.format,`${t} format`)),n}function j(e,t,i,n=!1){e!==void 0&&C(e,V,t);const o=Y(i,e,{edit:n}),{align:r,...d}=o;return{...T(d,t,{}),...r===void 0?{}:{align:r}}}function k(e){if(e===void 0||e===!1)return!1;if(e!==!0&&!G(e))throw new TypeError("createLegend.border must be a boolean or plain object.");e!==!0&&z(e,ge,"createLegend.border");const t={...be,...e===!0?{}:e};for(const n of["color","background"])y(t[n],`Legend border ${n}`);g(t.lineWidth,"Legend border lineWidth"),g(t.padding,"Legend border padding");const i=q(t.strokeDash);return{...t,...i===void 0?{}:{strokeDash:i}}}function Ye(e,t){C(e,ue,"createLegend");const i=e.position??"right";if(!D.includes(i))throw new Error(`Unsupported legend position "${i}".`);const n=e.align??"center";if(!["left","center","right"].includes(n))throw new Error(`Unsupported legend alignment "${n}".`);if(["left","right"].includes(i)&&n!=="center")throw new Error("Side continuous legends require center alignment.");const o=t==="opacity"||Object.hasOwn(e,"values")?pe(e,{operation:"create",label:t==="gradient"?"Gradient legend":"Opacity legend"}):void 0,r=t==="gradient"?o?.count??e.count??5:void 0;if(t==="gradient"){if(!Number.isInteger(r)||r<2)throw new RangeError("Continuous legend count must be an integer of at least 2.");ne(r,"Continuous legend count")}const d=e.offset??(m({position:i})?8:30);g(d,"Legend offset");const l=e.titlePosition??"top";if(I(e.titleStyle,l),!(t==="gradient"?["top","left","bottom"]:["top","left"]).includes(l))throw new Error(`Unsupported legend titlePosition "${l}".`);if(l==="left"&&(!["top","bottom"].includes(i)||t!=="opacity"))throw new Error("Only horizontal opacity legends support left titlePosition.");const s=e.itemGap??(t==="opacity"&&(["right","left"].includes(i)||m({position:i}))?w:l==="left"?20:28);if(E(s,"Legend itemGap"),t==="gradient"){for(const a of["symbol","columns","itemGap"])if(Object.hasOwn(e,a))throw new Error(`Gradient legend does not accept ${a}.`)}else for(const a of["columns","direction","gradient"])if(Object.hasOwn(e,a))throw new Error(`Opacity legend does not accept ${a}.`);return{...e.clipHeight===void 0?{}:{clipHeight:O(e.clipHeight)},target:e.target,...$(e),position:i,align:n,offset:d,...t==="gradient"?{count:r,...o?.mode==="values"?{sampling:o}:{},...e.direction===void 0?{}:{gradientDirection:R(e.direction)}}:{sampling:o},...A(e.title),labels:T(e.labels,"createLegend.labels",l==="left"?{...x,offset:8}:x),titleStyle:j(e.titleStyle,"createLegend.titleStyle",B),itemGap:s,titlePosition:l,border:k(e.border)}}function U(e,t,i){const n=e.semanticSpec.layers.filter(i);if(t===void 0)return n.length===1?n[0]:void 0;const o=se(e,t);return n.includes(o)?o:void 0}function Ke(e,t,i){const n=U(e,t,i==="opacity"?ce:o=>o.mark?.type==="point"&&o.encoding?.[i]?.scale!==void 0);if(n===void 0)throw new Error(t===void 0?`${i} legend requires one eligible ${i==="opacity"?"point, line or bar":"point"} mark.`:`Unknown ${i} legend target "${t}".`);return n}function Xe(e,t,i="color"){const n=U(e,t,o=>(i==="stroke"?["point","line","area","bar","rect","arc","rule","tick"]:["point","line","bar","rect","text","area","arc","tick"]).includes(o.mark?.type)&&o.encoding?.[i]?.scale!==void 0&&(i!=="color"||["quantitative","temporal"].includes(o.encoding[i].fieldType)));if(n===void 0)throw new Error(t===void 0?i==="color"?"color legend requires one eligible point, line, bar, rect, text, area, arc, or tick mark.":"stroke legend requires one eligible mark.":`Unknown ${i} legend target "${t}".`);return n}function Je(e,t,i){const n=e.resolvedScales[t];if(i==="sequential"?!X(n?.type):n?.type!==i)throw new Error(`Legend requires resolved ${i} scale "${t}".`);return n}function Qe(e,t="Continuous legend layout requires Canvas bounds."){const i=ae(e),n=fe(e);if(i===void 0||![i.x,i.y,i.width,i.height].every(Number.isFinite)||n?.type!=="canvas"||!Number.isFinite(n.properties.width)||!Number.isFinite(n.properties.height))throw new Error(t);return{plot:i,canvas:n.properties}}function Ze(e,t){return de(e[0],e[1],t,"Continuous legend domain")}function et(e,t,i,n="auto"){const o=P(n,"Legend label format");return o==="auto"?i==="temporal"?e.map(r=>oe(r,t)):le(e):e.map(r=>re(r,{format:o,valueType:i==="temporal"?"temporal":"quantitative",label:"Legend label format"}))}function W(e,t,i,{align:n="left"}={}){const o=p(e,t,{fill:i.color,fontSize:i.fontSize,fontFamily:i.fontFamily,fontWeight:i.fontWeight,textAlign:n,textBaseline:"middle"});return t.endsWith("Title")?Z(o,t,o.graphicSpec.objects[t].properties.text,i):o}function tt(e,t,i,n,{hardBreaks:o=!1}={}){return J({x:e.x,y:e.y,text:String(t),...i,...o?{lines:Q(t,i,n).lines}:{},textAlign:e.align??"left",textBaseline:"middle"},n)}function it(e,t,i,n){if(!(n?.groupIntrinsic||N(n)||["left","right"].includes(n?.position))&&e.some(o=>o.left<0||o.right>t.width||o.top<0||o.bottom>t.height))throw _(`${i} requires more Canvas margin space.`,e,t)}function nt(e,t,i,n,o){if(t===!1)return;const r=t.lineWidth/2;let d=1/0,l=1/0,s=-1/0,a=-1/0;for(const f of e)d=Math.min(d,f.left),l=Math.min(l,f.top),s=Math.max(s,f.right),a=Math.max(a,f.bottom);if(d-=t.padding,l-=t.padding,s+=t.padding,a+=t.padding,!o?.groupIntrinsic&&!N(o)&&!["left","right"].includes(o?.position)&&(d-r<0||l-r<0||s+r>i.width||a+r>i.height))throw _(`${n} background requires more Canvas margin space.`,[{left:d-r,right:s+r,top:l-r,bottom:a+r}],i);return{x:d,y:l,width:s-d,height:a-l}}function ye(e,t,i,n){return i===void 0?e:M(e,t,i,n)}function we(e,{multiColumnSide:t=!1}={}){const i=e.position??"right";if(!D.includes(i))throw new Error(`Unsupported legend position "${i}".`);const n=["left","right"].includes(i)||m({position:i}),o=e.layout===void 0?"edge":e.layout;if(o!=="edge")throw new Error('This legend requires layout "edge".');const r=e.align??"center";if(!["left","center","right"].includes(r))throw new Error(`Unsupported legend alignment "${r}".`);const d=e.direction??(n?"vertical":"horizontal");if(!["horizontal","vertical"].includes(d))throw new Error(`Unsupported legend direction "${d}".`);const l=e.columns;if(l!==void 0&&(!Number.isInteger(l)||l<1))throw new RangeError("Legend columns must be a positive integer.");const s=e.titlePosition??"top";if(I(e.titleStyle,s),!["top","left"].includes(s))throw new Error(`Unsupported legend titlePosition "${s}".`);if(n&&(r!=="center"||s!=="top"||!t&&(d!=="vertical"||l!==void 0&&l!==1)))throw new Error("Side item legends require vertical direction, center alignment, top title and one column.");const a=e.offset??(m({position:i})?8:30),f=e.itemGap??(d==="vertical"?w:28);return g(a,"Legend offset"),E(f,"Legend itemGap"),{position:i,layout:o,align:r,direction:d,columns:l,titlePosition:s,offset:a,itemGap:f,...$(e)}}function ot(e,t,i,n,{symbols:o,optional:r={},text:d=n.labels,labels:l=n.config.labels,titleStyle:s=n.config.titleStyle}){const a=`${t}Legend`,f=Object.values(o).find(Array.isArray)?.length??d.length;let c=e.editSemantic({property:`guide.legend.${t}.scale`,value:i.scale}).editSemantic({property:`guide.legend.${t}.title`,value:i.title})._withLegendConfig(t,i);c=p(c,`${a}Symbols`,{length:f,...o});const L=n.labelItemIndices,b=u=>L===void 0||!Array.isArray(u)?u:L.map(H=>u[H]);c=p(c,`${a}Labels`,{length:L?.length??d.length,x:b(n.labelX),y:b(n.itemY),text:b(d)}),c=ye(c,`${a}Background`,n.background,i.border),c=p(c,`${a}Symbols`,Object.fromEntries(Object.entries(r).filter(([,u])=>u!==void 0))),c=W(c,`${a}Labels`,l);const S=n.config;return S.titleVisible===!1?v(c):(c=p(c,`${a}Title`,{x:n.title.x,y:n.title.y,text:S.title}),v(W(c,`${a}Title`,s,{align:n.title.align})))}function rt(e,t,i,n,o,r){const d=`${t}Legend`;let l=e.editSemantic({property:`guide.legend.${t}.scale`,value:i.scale}).editSemantic({property:`guide.legend.${t}.title`,value:i.title})._withLegendConfig(t,i);return i.border!==!1&&(l=l.createGraphics({id:`${d}Background`,type:"rect",...r})),l=l.createGraphics({id:`${d}Symbols`,type:o,length:n,...r}).createGraphics({id:`${d}Labels`,type:"text",length:n,...r}),i.titleVisible!==!1&&(l=l.createGraphics({id:`${d}Title`,type:"text",...r})),l}export{he as ITEM_LEGEND_LABELS,Me as ITEM_LEGEND_OPTIONS,Le as ITEM_LEGEND_TITLE_STYLE,it as assertLegendBoundsInsideCanvas,rt as createItemLegendGraphics,p as editGraphicProperties,ye as editLegendBackground,et as formatContinuousValues,ot as materializeItemLegend,Ye as normalizeContinuousLegend,A as normalizeInitialLegendTitle,Ve as normalizeItemLegendConfig,we as normalizeItemLegendLayout,k as normalizeLegendBorder,T as normalizeLegendTextOptions,j as normalizeLegendTitleOptions,Je as requireResolvedLegendScale,Qe as resolveContinuousBounds,Xe as resolveContinuousColorLayer,Ke as resolveContinuousLegendLayer,nt as resolveLegendBackgroundFromBounds,tt as resolveLegendTextBounds,Ze as sampleContinuousValues,U as selectLegendLayer,W as styleContinuousText,g as validateNonNegative,E as validatePositive};

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

@@ -1,360 +1 @@
-import{validateLegendClip}from"../../../../grammar/legendClip.js";
-import{hasLegendClipGraphics}from"../../../../materialization/legendClip.js";
-import { normalizeColorSymbols, resolveColorSymbolsLayout, materializeColorSymbols } from "./colorSymbols.js";
-import { alignLegendTitle, resolveLegendTitleText } from "../../../../layout/legendText.js";
-import { intrinsicLegendConfig } from "../../../../materialization/legendGroups.js";
-import { mapContinuousScaleValues, transformedTicks } from "../../../../grammar/scales/index.js";
-import { action, closedAction } from "../../../../core/action.js";
-import { isPlainObject } from "../../../../core/immutable.js";
-import { normalizeLegendGradient, DEFAULT_LEGEND_GRADIENT } from "../../../../grammar/legendGradient.js";
-import { mapScaleConsumerValues } from "../../../../materialization/scales/map.js";
-import { inverseLerp, interpolateNumber } from "../../../../grammar/numeric.js";
-import { DEFAULT_COLORS } from "../../../../theme/defaults.js";
-import {
-  assertLegendBoundsInsideCanvas,
-  editLegendBackground,
-  editGraphicProperties,
-  formatContinuousValues,
-  normalizeContinuousLegend,
-  requireResolvedLegendScale,
-  resolveContinuousBounds,
-  resolveContinuousColorLayer,
-  resolveLegendBackgroundFromBounds,
-  resolveLegendTextBounds,
-  sampleContinuousValues,
-  styleContinuousText
-} from "./common.js";
-import { resolveLegendGraphicPlacement } from
-  "../../../../materialization/graphicHierarchy.js";
-import { resolveEffectiveLegendBlockConfig } from "../blocks.js";
-
-export const DEFAULT_GRADIENT_SIZE = DEFAULT_LEGEND_GRADIENT;
-
-export function resolveGradientLayout(program, config, scale, label = "Gradient legend", stripStrokeWidth = 0) {
-  validateLegendClip("gradient",config);
-  if (config.representation === "symbols") return resolveColorSymbolsLayout(program, config, scale);
-  config = intrinsicLegendConfig(program, config);
-  const { plot, canvas } = resolveContinuousBounds(program);
-  const vertical = config.gradientDirection === undefined
-    ? ["right", "left"].includes(config.position) : config.gradientDirection === "vertical";
-  const stripWidth = vertical ? config.gradient.thickness : config.gradient.length;
-  const stripHeight = vertical ? config.gradient.length : config.gradient.thickness;
-  const length = config.gradient.length;
-  const thickness = config.gradient.thickness;
-  const titleText = config.titleVisible === false ? { height: 0, extraHeight: 0 }
-    : resolveLegendTitleText(config.title, config.titleStyle, program.materializationConfigs.textMetrics);
-  const titleGap = config.blockGap ?? 12;
-  let x;
-  let y;
-  if (config.position === "right") {
-    x = plot.x + plot.width + config.offset;
-    y = plot.y + 46 + titleGap - 12 + titleText.extraHeight / 2;
-  } else if (config.position === "left") {
-    x = plot.x - config.offset - stripWidth;
-    y = plot.y + 46 + titleGap - 12 + titleText.extraHeight / 2;
-  } else {
-    x = config.align === "left" ? plot.x
-      : config.align === "right" ? plot.x + plot.width - stripWidth
-        : plot.x + (plot.width - stripWidth) / 2;
-    y = config.position === "top"
-      ? plot.y - config.offset - stripHeight - config.labels.offset -
-        config.labels.fontSize
-      : plot.y + plot.height + config.offset +
-        (config.titleVisible === false ? 0 : titleText.height + titleGap);
-  }
-  let title = vertical
-    ? { x, y: ["right", "left"].includes(config.position) ? plot.y + 20
-      : y - titleGap - titleText.height / 2, align: "left" }
-    : {
-        x: x + length / 2,
-        y: y - titleGap - titleText.height / 2,
-        align: "center"
-      };
-  const transformed = ["log", "pow", "sqrt", "symlog"].includes(scale.type);
-  const values = transformed
-    ? transformedTicks(scale.type, scale.domain, config.count,
-        scale.type === "log" ? {base: scale.base}
-          : scale.type === "pow" ? {exponent: scale.exponent}
-          : scale.type === "symlog" ? {constant: scale.constant} : {})
-    : [...sampleContinuousValues(scale.domain, config.count)];
-  if (scale.midpoint !== undefined && !values.includes(scale.midpoint)) {
-    values.push(scale.midpoint);
-    values.sort((a, b) => scale.domain[1] > scale.domain[0] ? a - b : b - a);
-  }
-  const texts = formatContinuousValues(
-    values,
-    scale.domain,
-    config.fieldType,
-    config.labels.format
-  );
-  const fractions = transformed ? mapContinuousScaleValues(values, {...scale, range: [0, 1]})
-    : values.map((value, index) => scale.midpoint === undefined
-    ? index / (values.length - 1)
-    : inverseLerp(value, ...scale.domain));
-  const labelOffset = config.labels.offset;
-  const labels = vertical
-    ? fractions.map(fraction => ({
-        x: config.position === "left"
-          ? x - labelOffset : x + thickness + labelOffset,
-        y: y + length * (1 - fraction),
-        align: config.position === "left" ? "right" : "left"
-      }))
-    : fractions.map(fraction => ({
-        x: x + length * fraction,
-        y: y + thickness + labelOffset + config.labels.fontSize / 2,
-        align: "center"
-      }));
-  const ticks = vertical
-    ? labels.map(label => ({
-        x1: config.position === "left" ? x : x + thickness,
-        y1: label.y,
-        x2: config.position === "left" ? x - 6 : x + thickness + 6,
-        y2: label.y
-      }))
-    : labels.map(label => ({
-        x1: label.x,
-        y1: y + thickness,
-        x2: label.x,
-        y2: y + thickness + 6
-      }));
-  const stripBounds = {
-    left: x,
-    right: x + (vertical ? thickness : length),
-    top: y,
-    bottom: y + (vertical ? length : thickness)
-  };
-  const tickBounds = ticks.map(tick => ({
-    left: Math.min(tick.x1, tick.x2) - 0.5,
-    right: Math.max(tick.x1, tick.x2) + 0.5,
-    top: Math.min(tick.y1, tick.y2) - 0.5,
-    bottom: Math.max(tick.y1, tick.y2) + 0.5
-  }));
-  const labelBounds = labels.map((label, index) =>
-    resolveLegendTextBounds(label, texts[index], config.labels, program.materializationConfigs.textMetrics)
-  );
-  if (config.titlePosition === "bottom" && config.titleVisible !== false) {
-    const bottom = Math.max(stripBounds.bottom + stripStrokeWidth / 2,
-      ...tickBounds.map(bounds => bounds.bottom), ...labelBounds.map(bounds => bounds.bottom));
-    title = { x: vertical ? x : x + length / 2,
-      y: bottom + titleGap + titleText.height / 2, align: vertical ? "left" : "center" };
-  }
-  if (config.titleVisible !== false) title = alignLegendTitle(title, config.title, config.titleStyle,
-    [{ left: stripBounds.left - stripStrokeWidth / 2, right: stripBounds.right + stripStrokeWidth / 2,
-      top: stripBounds.top - stripStrokeWidth / 2, bottom: stripBounds.bottom + stripStrokeWidth / 2 },
-      ...tickBounds, ...labelBounds], program.materializationConfigs.textMetrics);
-  const titleBounds = config.titleVisible === false ? undefined : resolveLegendTextBounds(
-    title,
-    config.title,
-    config.titleStyle
-  , program.materializationConfigs.textMetrics, { hardBreaks: true });
-  const occupiedBounds = [stripBounds, ...tickBounds, ...labelBounds,
-    ...(config.titleVisible === false ? [] : [titleBounds])];
-  assertLegendBoundsInsideCanvas(
-    occupiedBounds,
-    canvas,
-    `${label} layout`, config
-  );
-  const background = resolveLegendBackgroundFromBounds(
-    occupiedBounds,
-    config.border,
-    canvas,
-    label, config
-  );
-  return {
-    vertical, x, y, length, thickness, values, texts, labels, ticks, title,
-    background
-  };
-}
-
-export function resolveGradientConfig(program, config, channel = "color") {
-  const layer = resolveContinuousColorLayer(program, config.target, channel);
-  const encoding = layer.encoding[channel];
-  if (!["quantitative", "temporal"].includes(encoding.fieldType)) {
-    throw new Error(`${channel === "color" ? "Gradient" : "Stroke gradient"} legend requires quantitative or temporal ${channel}.`);
-  }
-  const scale = requireResolvedLegendScale(
-    program,
-    encoding.scale,
-    "sequential"
-  );
-  return {
-    layer,
-    encoding,
-    scale,
-    config: {
-      ...config,
-      target: layer.id,
-      scale: encoding.scale,
-      fieldType: encoding.fieldType,
-      title: config.inferredTitle ? encoding.field : config.title,
-      domain: scale.domain
-    }
-  };
-}
-
-// Both channels use the same positions and width policy. Their paint and
-// semantic/graphic namespaces remain explicit channel-owned choices.
-export function materializeGradientLegend(program, resolved, appearance) {
-  const stroke = appearance !== undefined;
-  const channel = stroke ? "stroke" : "color";
-  const kind = stroke ? "strokeGradient" : "gradient";
-  const prefix = `${channel}Gradient`;
-  const { scale, encoding, config: currentConfig } = resolved;
-  const config = resolveEffectiveLegendBlockConfig(program, kind, currentConfig);
-  if (!stroke && config.representation === "symbols") return materializeColorSymbols(program, resolved, config);
-  const layout = resolveGradientLayout(program, config, scale,
-    stroke ? "Stroke gradient legend" : "Gradient legend", appearance?.strokeWidth ?? 0);
-  const stripCount = 60;
-  const stripSize = layout.length / stripCount;
-  const strips = Array.from({ length: stripCount }, (_, index) => {
-    const fraction = (index + 0.5) / stripCount;
-    const position = layout.vertical ? 1 - fraction : fraction;
-    const samplingScale = scale.midpoint === undefined ? { ...scale, type: "sequential", domain: [0, 1] } : scale;
-    const value = scale.midpoint === undefined ? position : interpolateNumber(...scale.domain, position);
-    const [color] = mapScaleConsumerValues([value], samplingScale, channel);
-    return {
-      x: layout.x + (layout.vertical ? 0 : index * stripSize),
-      y: layout.y + (layout.vertical ? index * stripSize : 0),
-      width: layout.vertical ? layout.thickness : stripSize,
-      height: layout.vertical ? stripSize : layout.thickness,
-      fill: stroke ? appearance.fill : color,
-      stroke: color,
-      strokeWidth: stroke ? appearance.strokeWidth : 0
-    };
-  });
-  let next = program
-    .editSemantic({ property: `guide.legend.${channel}.scale`, value: encoding.scale })
-    .editSemantic({ property: `guide.legend.${channel}.title`, value: config.title })
-    ._withLegendConfig(kind, currentConfig);
-  // Preserve each channel's established primitive trace order.
-  if (!stroke) next = next.editGraphics({ target: `${prefix}Strips`, property: "length", value: strips.length });
-  next = editLegendBackground(next, `${prefix}Background`, layout.background, config.border);
-  if (stroke) next = next.editGraphics({ target: `${prefix}Strips`, property: "length", value: strips.length });
-  for (const property of ["x", "y", "width", "height", "fill", "stroke", "strokeWidth"]) {
-    next = next.editGraphics({ target: `${prefix}Strips`, property, value: strips.map(strip => strip[property]) });
-  }
-  if (config.gradient.opacity !== undefined) {
-    next = next.editGraphics({ target: `${prefix}Strips`, property: "opacity", value: config.gradient.opacity });
-  }
-  next = next.editGraphics({ target: `${prefix}Ticks`, property: "length", value: layout.ticks.length });
-  for (const property of ["x1", "y1", "x2", "y2"]) {
-    next = next.editGraphics({ target: `${prefix}Ticks`, property, value: layout.ticks.map(tick => tick[property]) });
-  }
-  next = editGraphicProperties(next, `${prefix}Ticks`, { stroke: DEFAULT_COLORS.mutedText, strokeWidth: 1 });
-  next = editGraphicProperties(next, `${prefix}Labels`, {
-    length: layout.labels.length, x: layout.labels.map(label => label.x),
-    y: layout.labels.map(label => label.y), text: layout.texts
-  });
-  next = styleContinuousText(next, `${prefix}Labels`, config.labels, { align: layout.labels[0].align });
-  if (config.titleVisible === false) return next;
-  next = editGraphicProperties(next, `${prefix}Title`, { x: layout.title.x, y: layout.title.y, text: config.title });
-  return styleContinuousText(next, `${prefix}Title`, config.titleStyle, { align: layout.title.align });
-}
-
-export const rematerializeGradientLegend = /* @__PURE__ */ closedAction(
-  {
-    op: "rematerializeGradientLegend",
-    description: "Rematerialize a continuous color gradient legend."
-  }, [],
-  function (args = {}) {
-    if(hasLegendClipGraphics(this))return this.rematerializeLegend();
-    const stored = this.guideConfigs.legend?.gradient;
-    if (stored === undefined) {
-      throw new Error("Gradient legend requires stored configuration.");
-    }
-    return materializeGradientLegend(this, resolveGradientConfig(this, stored));
-  }
-);
-
-
-export function resolveGradientLegendCreation(program, args = {}, channel = "color") {
-  const { representation, ...options } = args;
-  if (representation !== undefined && !["gradient", "symbols"].includes(representation)) throw new Error("Legend representation must be gradient or symbols.");
-  if (channel !== "color" && representation !== undefined) throw new Error("Legend representation requires continuous color.");
-  const config = representation === "symbols" ? normalizeColorSymbols(options) : normalizeContinuousLegend(options, "gradient");
-  if (args.channels !== undefined && (
-    !Array.isArray(args.channels) ||
-    args.channels.length !== 1 ||
-    args.channels[0] !== channel
-  )) {
-    throw new Error(`Gradient legend requires channels: ["${channel}"].`);
-  }
-  if (args.gradient !== undefined && !isPlainObject(args.gradient)) {
-    throw new TypeError("createLegend.gradient must be a plain object.");
-  }
-  if (config.representation !== "symbols") config.gradient = normalizeLegendGradient(args.gradient);
-  const resolved = resolveGradientConfig(program, config, channel);
-  return resolved;
-}
-
-export function createGradientLegendFromConfig(program, config, channel = "color") {
-  const prefix = `${channel}Gradient`;
-  const kind = channel === "color" ? "gradient" : "strokeGradient";
-  const resolved = resolveGradientConfig(program, config, channel);
-  resolveGradientLayout(program, resolved.config, resolved.scale, channel === "color" ? "Gradient legend" : "Stroke gradient legend");
-  let next = program
-    .editSemantic({
-      property: `guide.legend.${channel}.scale`,
-      value: resolved.encoding.scale
-    })
-    .editSemantic({
-      property: `guide.legend.${channel}.title`,
-      value: resolved.config.title
-    })
-    ._withLegendConfig(kind, resolved.config);
-  if (resolved.config.border !== false) {
-    next = next.createGraphics({
-      id: `${prefix}Background`,
-      type: "rect",
-      ...resolveLegendGraphicPlacement(next)
-    });
-  }
-  if (resolved.config.representation === "symbols") {
-    next = next.createGraphics({ id: `${prefix}Symbols`, type: "circle", length: 0, ...resolveLegendGraphicPlacement(next) });
-  } else next = next
-    .createGraphics({
-      id: `${prefix}Strips`,
-      type: "rect",
-      length: 0,
-      ...resolveLegendGraphicPlacement(next, resolved.config.border === false
-        ? {}
-        : { after: `${prefix}Background` })
-    })
-    .createGraphics({
-      id: `${prefix}Ticks`,
-      type: "line",
-      length: 0,
-      ...resolveLegendGraphicPlacement(next)
-    });
-  next = next.createGraphics({
-      id: `${prefix}Labels`,
-      type: "text",
-      length: 0,
-      ...resolveLegendGraphicPlacement(next)
-    });
-  if (resolved.config.titleVisible !== false) {
-    next = next.createGraphics({
-      id: `${prefix}Title`,
-      type: "text",
-      ...resolveLegendGraphicPlacement(next)
-    });
-  }
-  return next[channel === "color" ? "rematerializeGradientLegend" : "rematerializeStrokeGradientLegend"]();
-}
-
-export const createGradientLegend = /* @__PURE__ */ action(
-  {
-    op: "createGradientLegend",
-    description: "Create a continuous color gradient legend."
-  },
-  function (args = {}) {
-    const resolved = resolveGradientLegendCreation(this, args);
-    resolveGradientLayout(this, resolved.config, resolved.scale);
-    if (this.guideConfigs.legend?.gradient !== undefined) {
-      throw new Error(
-        "createGradientLegend requires a missing gradient legend."
-      );
-    }
-    return createGradientLegendFromConfig(this, resolved.config);
-  }
-);
+import{validateLegendClip as H}from"../../../../grammar/legendClip.js";import{hasLegendClipGraphics as I}from"../../../../materialization/legendClip.js";import{normalizeColorSymbols as N,resolveColorSymbolsLayout as U,materializeColorSymbols as j}from"./colorSymbols.js";import{alignLegendTitle as Z,resolveLegendTitleText as J}from"../../../../layout/legendText.js";import{resolveLegendContentSpacing as K}from"../../../../layout/legendSpacing.js";import{validateLegendSpacing as Q}from"../../../../grammar/legendSpacing.js";import{intrinsicLegendConfig as X}from"../../../../materialization/legendGroups.js";import{mapContinuousScaleValues as Y,transformedTicks as W}from"../../../../grammar/scales/index.js";import{action as ee,closedAction as te}from"../../../../core/action.js";import{isPlainObject as ie}from"../../../../core/immutable.js";import{normalizeLegendGradient as ne,DEFAULT_LEGEND_GRADIENT as re}from"../../../../grammar/legendGradient.js";import{mapScaleConsumerValues as oe}from"../../../../materialization/scales/map.js";import{inverseLerp as se,interpolateNumber as le}from"../../../../grammar/numeric.js";import{DEFAULT_COLORS as ae}from"../../../../theme/defaults.js";import{assertLegendBoundsInsideCanvas as de,editLegendBackground as pe,editGraphicProperties as M,formatContinuousValues as ue,normalizeContinuousLegend as me,requireResolvedLegendScale as ge,resolveContinuousBounds as ce,resolveContinuousColorLayer as fe,resolveLegendBackgroundFromBounds as ye,resolveLegendTextBounds as F,sampleContinuousValues as he,styleContinuousText as P}from"./common.js";import{resolveLegendGraphicPlacement as C}from"../../../../materialization/graphicHierarchy.js";import{resolveEffectiveLegendBlockConfig as xe}from"../blocks.js";import{readLegendSampling as be,validateSamplingAgainstScale as ve}from"../sampling.js";const He=re;function _(d,e,t,l="Gradient legend",a=0){if(H("gradient",e),Q("gradient",e),e.representation==="symbols")return U(d,e,t);e=X(d,e);const{plot:n,canvas:r}=ce(d),g=e.gradientDirection===void 0?["right","left"].includes(e.position):e.gradientDirection==="vertical",$=g?e.gradient.thickness:e.gradient.length,z=g?e.gradient.length:e.gradient.thickness,m=e.gradient.length,s=e.gradient.thickness,y=e.titleVisible===!1?{height:0,extraHeight:0}:J(e.title,e.titleStyle,d.materializationConfigs.textMetrics),f=e.blockGap??12;let p,i;e.position==="right"?(p=n.x+n.width+e.offset,i=n.y+46+f-12+y.extraHeight/2):e.position==="left"?(p=n.x-e.offset-$,i=n.y+46+f-12+y.extraHeight/2):(p=e.align==="left"?n.x:e.align==="right"?n.x+n.width-$:n.x+(n.width-$)/2,i=e.position==="top"?n.y-e.offset-z-e.labels.offset-e.labels.fontSize:n.y+n.height+e.offset+(e.titleVisible===!1?0:y.height+f));let u=g?{x:p,y:["right","left"].includes(e.position)?n.y+20:i-f-y.height/2,align:"left"}:{x:p+m/2,y:i-f-y.height/2,align:"center"};const h=["log","pow","sqrt","symlog"].includes(t.type),S=ve(be(e),t,l),L=S.mode==="values",x=L?[...S.values]:h?W(t.type,t.domain,e.count,t.type==="log"?{base:t.base}:t.type==="pow"?{exponent:t.exponent}:t.type==="symlog"?{constant:t.constant}:{}):[...he(t.domain,e.count)];!L&&t.midpoint!==void 0&&!x.includes(t.midpoint)&&(x.push(t.midpoint),x.sort((o,c)=>t.domain[1]>t.domain[0]?o-c:c-o));const T=ue(x,t.domain,e.fieldType,e.labels.format),k=h||L?Y(x,{...t,range:[0,1]}):x.map((o,c)=>!L&&t.midpoint===void 0?c/(x.length-1):se(o,...t.domain)),q=e.labels.offset;let G=g?k.map(o=>({x:e.position==="left"?p-q:p+s+q,y:i+m*(1-o),align:e.position==="left"?"right":"left"})):k.map(o=>({x:p+m*o,y:i+s+q+e.labels.fontSize/2,align:"center"})),B=g?G.map(o=>({x1:e.position==="left"?p:p+s,y1:o.y,x2:e.position==="left"?p-6:p+s+6,y2:o.y})):G.map(o=>({x1:o.x,y1:i+s,x2:o.x,y2:i+s+6}));const b={left:p,right:p+(g?s:m),top:i,bottom:i+(g?m:s)},E=B.map(o=>({left:Math.min(o.x1,o.x2)-.5,right:Math.max(o.x1,o.x2)+.5,top:Math.min(o.y1,o.y2)-.5,bottom:Math.max(o.y1,o.y2)+.5})),V=G.map((o,c)=>F(o,T[c],e.labels,d.materializationConfigs.textMetrics));if(e.titlePosition==="bottom"&&e.titleVisible!==!1){const o=Math.max(b.bottom+a/2,...E.map(c=>c.bottom),...V.map(c=>c.bottom));u={x:g?p:p+m/2,y:o+f+y.height/2,align:g?"left":"center"}}e.titleVisible!==!1&&(u=Z(u,e.title,e.titleStyle,[{left:b.left-a/2,right:b.right+a/2,top:b.top-a/2,bottom:b.bottom+a/2},...E,...V],d.materializationConfigs.textMetrics));const O=e.titleVisible===!1?void 0:F(u,e.title,e.titleStyle,d.materializationConfigs.textMetrics,{hardBreaks:!0});let A=[b,...E,...V,...e.titleVisible===!1?[]:[O]];const w=e.titlePadding===void 0?void 0:K(e,[{row:0,x:p,y:i,bounds:[{left:b.left-a/2,right:b.right+a/2,top:b.top-a/2,bottom:b.bottom+a/2},...E,...V.filter((o,c)=>T[c]!=="")]}],O);if(w!==void 0){const{dx:o,dy:c}=w.offsets[0];p+=o,i+=c,G=G.map(v=>({...v,x:v.x+o,y:v.y+c})),B=B.map(v=>({...v,x1:v.x1+o,x2:v.x2+o,y1:v.y1+c,y2:v.y2+c})),u={...u,x:u.x+w.titleOffset.dx,y:u.y+w.titleOffset.dy},A=w.bounds}de(A,r,`${l} layout`,e);const R=ye(A,e.border,r,l,e);return{vertical:g,x:p,y:i,length:m,thickness:s,values:x,texts:T,labels:G,ticks:B,title:u,background:R}}function D(d,e,t="color"){const l=fe(d,e.target,t),a=l.encoding[t];if(!["quantitative","temporal"].includes(a.fieldType))throw new Error(`${t==="color"?"Gradient":"Stroke gradient"} legend requires quantitative or temporal ${t}.`);const n=ge(d,a.scale,"sequential");return{layer:l,encoding:a,scale:n,config:{...e,target:l.id,scale:a.scale,fieldType:a.fieldType,title:e.inferredTitle?a.field:e.title,domain:n.domain}}}function Le(d,e,t){const l=t!==void 0,a=l?"stroke":"color",n=l?"strokeGradient":"gradient",r=`${a}Gradient`,{scale:g,encoding:$,config:z}=e,m=xe(d,n,z);if(!l&&m.representation==="symbols")return j(d,e,m);const s=_(d,m,g,l?"Stroke gradient legend":"Gradient legend",t?.strokeWidth??0),y=60,f=s.length/y,p=Array.from({length:y},(u,h)=>{const S=(h+.5)/y,L=s.vertical?1-S:S,x=g.midpoint===void 0?{...g,type:"sequential",domain:[0,1]}:g,T=g.midpoint===void 0?L:le(...g.domain,L),[k]=oe([T],x,a);return{x:s.x+(s.vertical?0:h*f),y:s.y+(s.vertical?h*f:0),width:s.vertical?s.thickness:f,height:s.vertical?f:s.thickness,fill:l?t.fill:k,stroke:k,strokeWidth:l?t.strokeWidth:0}});let i=d.editSemantic({property:`guide.legend.${a}.scale`,value:$.scale}).editSemantic({property:`guide.legend.${a}.title`,value:m.title})._withLegendConfig(n,z);l||(i=i.editGraphics({target:`${r}Strips`,property:"length",value:p.length})),i=pe(i,`${r}Background`,s.background,m.border),l&&(i=i.editGraphics({target:`${r}Strips`,property:"length",value:p.length}));for(const u of["x","y","width","height","fill","stroke","strokeWidth"])i=i.editGraphics({target:`${r}Strips`,property:u,value:p.map(h=>h[u])});m.gradient.opacity!==void 0&&(i=i.editGraphics({target:`${r}Strips`,property:"opacity",value:m.gradient.opacity})),i=i.editGraphics({target:`${r}Ticks`,property:"length",value:s.ticks.length});for(const u of["x1","y1","x2","y2"])i=i.editGraphics({target:`${r}Ticks`,property:u,value:s.ticks.map(h=>h[u])});return i=M(i,`${r}Ticks`,{stroke:ae.mutedText,strokeWidth:1}),i=M(i,`${r}Labels`,{length:s.labels.length,x:s.labels.map(u=>u.x),y:s.labels.map(u=>u.y),text:s.texts}),i=P(i,`${r}Labels`,m.labels,{align:s.labels[0].align}),m.titleVisible===!1?i:(i=M(i,`${r}Title`,{x:s.title.x,y:s.title.y,text:m.title}),P(i,`${r}Title`,m.titleStyle,{align:s.title.align}))}const Ie=te({op:"rematerializeGradientLegend",description:"Rematerialize a continuous color gradient legend."},[],function(d={}){if(I(this))return this.rematerializeLegend();const e=this.guideConfigs.legend?.gradient;if(e===void 0)throw new Error("Gradient legend requires stored configuration.");return Le(this,D(this,e))});function Ge(d,e={},t="color"){const{representation:l,...a}=e;if(l!==void 0&&!["gradient","symbols"].includes(l))throw new Error("Legend representation must be gradient or symbols.");if(t!=="color"&&l!==void 0)throw new Error("Legend representation requires continuous color.");const n=l==="symbols"?N(a):me(a,"gradient");if(e.channels!==void 0&&(!Array.isArray(e.channels)||e.channels.length!==1||e.channels[0]!==t))throw new Error(`Gradient legend requires channels: ["${t}"].`);if(e.gradient!==void 0&&!ie(e.gradient))throw new TypeError("createLegend.gradient must be a plain object.");return n.representation!=="symbols"&&(n.gradient=ne(e.gradient)),D(d,n,t)}function Ce(d,e,t="color"){const l=`${t}Gradient`,a=t==="color"?"gradient":"strokeGradient",n=D(d,e,t);_(d,n.config,n.scale,t==="color"?"Gradient legend":"Stroke gradient legend");let r=d.editSemantic({property:`guide.legend.${t}.scale`,value:n.encoding.scale}).editSemantic({property:`guide.legend.${t}.title`,value:n.config.title})._withLegendConfig(a,n.config);return n.config.border!==!1&&(r=r.createGraphics({id:`${l}Background`,type:"rect",...C(r)})),n.config.representation==="symbols"?r=r.createGraphics({id:`${l}Symbols`,type:"circle",length:0,...C(r)}):r=r.createGraphics({id:`${l}Strips`,type:"rect",length:0,...C(r,n.config.border===!1?{}:{after:`${l}Background`})}).createGraphics({id:`${l}Ticks`,type:"line",length:0,...C(r)}),r=r.createGraphics({id:`${l}Labels`,type:"text",length:0,...C(r)}),n.config.titleVisible!==!1&&(r=r.createGraphics({id:`${l}Title`,type:"text",...C(r)})),r[t==="color"?"rematerializeGradientLegend":"rematerializeStrokeGradientLegend"]()}const Ne=ee({op:"createGradientLegend",description:"Create a continuous color gradient legend."},function(d={}){const e=Ge(this,d);if(_(this,e.config,e.scale),this.guideConfigs.legend?.gradient!==void 0)throw new Error("createGradientLegend requires a missing gradient legend.");return Ce(this,e.config)});export{He as DEFAULT_GRADIENT_SIZE,Ne as createGradientLegend,Ce as createGradientLegendFromConfig,Le as materializeGradientLegend,Ie as rematerializeGradientLegend,D as resolveGradientConfig,_ as resolveGradientLayout,Ge as resolveGradientLegendCreation};

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

@@ -32,7 +32,7 @@ import { resolveEffectiveLegendBlockConfig } from "../blocks.js";
 
 const OPTIONS = [
   "target", "channels", "position", "align", "offset", "title",
-  "symbol", "labels", "titleStyle", "itemGap", "direction", "border", "layout", "columns", "titlePosition"
+  "symbol", "labels", "titleStyle", "itemGap", "rowPadding", "titlePadding", "direction", "border", "layout", "columns", "titlePosition"
 ];
 const SYMBOL_OPTIONS = [
   "width", "height", "stroke", "strokeWidth"

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

@@ -2,6 +2,8 @@ import{validateLegendClip}from"../../../../grammar/legendClip.js";
 import{hasLegendClipGraphics,applyLegendClipGraphics}from"../../../../materialization/legendClip.js";
 import { intrinsicLegendConfig } from "../../../../materialization/legendGroups.js";
 import { alignLegendTitle, resolveLegendTitleText } from "../../../../layout/legendText.js";
+import {resolveLegendContentSpacing} from "../../../../layout/legendSpacing.js";
+import {validateLegendSpacing} from "../../../../grammar/legendSpacing.js";
 import { editGraphicProperties } from "../../../primitives/graphicProperties.js";
 import { action, closedAction } from "../../../../core/action.js";
 import { isPlainObject } from "../../../../core/immutable.js";
@@ -91,6 +93,7 @@ function resolveOpacityConfig(program, config) {
 
 function resolveOpacityLayout(program, config, scale) {
   validateLegendClip("opacity",config);
+  validateLegendSpacing("opacity",config);
   config = intrinsicLegendConfig(program, config);
   const { plot, canvas } = resolveContinuousBounds(program);
   const vertical = ["right", "left"].includes(config.position);
@@ -210,7 +213,18 @@ function resolveOpacityLayout(program, config, scale) {
     config.title,
     config.titleStyle
   , program.materializationConfigs.textMetrics, { hardBreaks: true });
-  const occupiedBounds = [...(config.titleVisible === false ? [] : [titleBounds]), ...labelBounds, ...symbolBounds];
+  let occupiedBounds = [...(config.titleVisible === false ? [] : [titleBounds]), ...labelBounds, ...symbolBounds];
+  const spacing = config.rowPadding === undefined && config.titlePadding === undefined ? undefined
+    : resolveLegendContentSpacing(config,symbols.map((symbol,index) => ({
+    row:vertical ? index : 0,x:symbol.x,y:symbol.y,
+    bounds:[symbolBounds[index],...(texts[index] === "" ? [] : [labelBounds[index]])]
+  })),titleBounds);
+  if (spacing !== undefined) {
+    symbols = symbols.map((point,index) => ({...point,x:point.x+spacing.offsets[index].dx,y:point.y+spacing.offsets[index].dy}));
+    labels = labels.map((point,index) => ({...point,x:point.x+spacing.offsets[index].dx,y:point.y+spacing.offsets[index].dy}));
+    title = {...title,x:title.x+spacing.titleOffset.dx,y:title.y+spacing.titleOffset.dy};
+    occupiedBounds = spacing.bounds;
+  }
   assertLegendBoundsInsideCanvas(
     occupiedBounds,
     canvas,