@arcgis/map-components/dist/cdn/P3KYHTKB.js

ArcGIS Map Components

/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
import a from"./KYU6MBFA.js";import{O as x,Q as g,U as y,a as f,b as v}from"./WUJCCZQC.js";import"./3TTFCHAA.js";export default $arcgis.t(([{e:b,g:$,h:S}])=>{var M=f`.spike-ramp-container{display:flex;flex-direction:row;gap:var(--calcite-spacing-sm-plus);margin-left:var(--calcite-spacing-sm)}.spike-ramp-preview-container{display:flex;position:relative;gap:var(--calcite-spacing-sm-plus);border-bottom:var(--calcite-border-width-sm) solid var(--calcite-color-border-2);padding:0 var(--calcite-spacing-xl)}.spike-ramp-preview{display:flex;gap:var(--calcite-spacing-sm-plus);align-items:end}.spike-ramp-symbol-preview{display:flex}.spike-ramp-lines{display:flex;position:absolute;bottom:0}.spike-ramp-labels-container{display:flex;position:relative;top:-5px;flex:1;min-width:120px}.spike-ramp-label{position:relative;padding:0 var(--calcite-spacing-sm);line-height:1em;word-break:break-all;font-size:var(--calcite-font-size-sm)}.spike-ramp-label:before{display:block;position:absolute;top:.25em;right:100%;border-width:3px 4px 3px 0;border-style:solid;border-color:transparent var(--calcite-color-text-1) transparent transparent;width:0;height:0;content:""}`,N="#ddd",e=window.devicePixelRatio;function u(m){return m.infos.filter((o,a)=>a%2===0)}function E(m){return!!(m&&typeof m=="object")}var w=class extends x{constructor(){super(...arguments),this.legendElement=null}static{this.properties={legendElement:0,messages:0}}static{this.styles=M}render(){return this.legendElement.infos.length!==5?null:v`<div class="spike-ramp-container"><div class="spike-ramp-preview-container">${this._renderSpikeRampLines()}${this._renderSpikeRampPreview()}</div>${this._renderSpikeRampLabels()}</div>`}_renderSpikeRampPreview(){let o=this.legendElement,[a,l,d]=u(o).map(({preview:n,label:r})=>{if(!n)return null;let t=n.cloneNode(!0);return t.classList.add("spike-ramp-symbol-preview"),S(t,$(this.messages,r)),t});return!a||!l||!d?null:v`<div class="spike-ramp-preview"><div>${d}</div><div>${l}</div><div>${a}</div></div>`}_renderSpikeRampLines(){let o=this.legendElement,[{width:a,height:l},{width:d},{width:n,height:r}]=u(o).map(({size:k})=>E(k)?{width:b(k.width),height:b(k.height)}:{width:0,height:0}),t=10,c=8,p=a+d+n+t*3,h=l,s=document.createElement("canvas");s.width=(p+t)*e,s.height=h*e,s.style.width=`${s.width/e}px`,s.style.height=`${s.height/e}px`;let i=s.getContext("2d");i.beginPath();let R=p-(a/2+t),L=0,T=p+c;i.moveTo(R*e,L*e),i.lineTo(T*e,0*e);let _=(p-c)/2,z=(l-r)/2,P=p+c,A=(l-r)/2;i.moveTo(_*e,z*e),i.lineTo(P*e,A*e);let C=n/2,W=h-r,H=p+c,I=h-r;return i.moveTo(C*e,W*e),i.lineTo(H*e,I*e),i.strokeStyle=N,i.lineWidth=.5*e,i.stroke(),v`<div class="spike-ramp-lines">${s}</div>`}_renderSpikeRampLabels(){let o=this.legendElement,[{label:a,height:l},{label:d},{label:n,height:r}]=u(o).map(({label:s,size:i})=>({label:s,height:E(i)?b(i.height):0})),t=l-r,c={position:"absolute",top:"0"},p={position:"absolute",top:`${t/2}px`},h={position:"absolute",top:`${t}px`};return v`<div class="spike-ramp-labels-container"><div class="spike-ramp-label" style=${g(c)}>${a}</div><div class="spike-ramp-label" style=${g(p)}>${d}</div><div class="spike-ramp-label" style=${g(h)}>${n}</div></div>`}};y("arcgis-legend-spike-ramp",w);return w},a)