@doegis/core/widgets/Legend/styles/Classic.js

DOE GIS API

import{_ as e}from"../../../chunks/tslib.es6.js";import"../../../intl.js";import{property as t}from"../../../core/accessorSupport/decorators/property.js";import"../../../core/accessorSupport/ensureType.js";import"../../../core/arrayUtils.js";import{subclass as s}from"../../../core/accessorSupport/decorators/subclass.js";import r from"../../Widget.js";import{CSS as a,LEGEND as l}from"./ClassicCSS.js";import{renderRelationshipRamp as i}from"./support/relationshipUtils.js";import{getUnivariateAboveAndBelowRampElements as n,getUnivariateColorRampSize as o,getUnivariateColorRampPreview as p,getUnivariateColorRampMargin as d,getUnivariateColorSizeRampElements as c}from"./support/univariateUtils.js";import{getTitle as m,isRendererTitle as y,attachToNode as v,isImageryStretchedLegend as h}from"../support/styleUtils.js";import{Heading as u}from"../../support/Heading.js";import"../../support/widgetUtils.js";import{messageBundle as g}from"../../support/decorators/messageBundle.js";import{tsx as f}from"../../support/jsxFactory.js";import{formatNumber as b}from"../../../intl/number.js";const L=`${l}__`,w=24,C={display:"flex",alignItems:"flex-start"},_={marginLeft:"3px"},R={display:"table-cell",verticalAlign:"middle"};let A=class extends r{constructor(e,t){super(e,t),this.activeLayerInfos=null,this.headingLevel=3,this.messages=null,this.type="classic"}render(){const e=this.activeLayerInfos,t=e&&e.toArray().map((e=>this._renderLegendForLayer(e))).filter((e=>!!e));return f("div",null,t&&t.length?t:f("div",{class:a.message},this.messages.noLegend))}_renderLegendForLayer(e){if(!e.ready)return null;const t=!!e.children.length,s=`${L}${e.layer.uid}-version-${e.version}`,r=e.title?u({level:this.headingLevel,class:this.classes(a.header,a.label)},e.title):null;if(t){const t=e.children.map((e=>this._renderLegendForLayer(e))).toArray();return f("div",{key:s,class:this.classes(a.service,a.groupLayer)},r,t)}{const t=e.legendElements;if(t&&!t.length)return null;const l=t.map((t=>this._renderLegendForElement(t,e.layer,e.effectList))).filter((e=>!!e));if(!l.length)return null;const i={[a.groupLayerChild]:!!e.parent};return f("div",{key:s,class:this.classes(a.service,i),tabIndex:0},r,f("div",{class:a.layer},l))}}_renderLegendForElement(e,t,s,r){const l="color-ramp"===e.type,n="opacity-ramp"===e.type,o="size-ramp"===e.type;let p=null;if("symbol-table"===e.type||o){const r=e.infos.map((r=>this._renderLegendForElementInfo(r,t,s,o,e.legendType))).filter((e=>!!e));r.length&&(p=f("div",{class:a.layerBody},r))}else"color-ramp"===e.type||"opacity-ramp"===e.type||"heatmap-ramp"===e.type||"stretch-ramp"===e.type?p=this._renderLegendForRamp(e,t.opacity):"relationship-ramp"===e.type?p=i(e,this.id,t.opacity,s):"pie-chart-ramp"===e.type?p=this._renderPieChartRamp(e):"univariate-above-and-below-ramp"===e.type?p=this._renderUnivariateAboveAndBelowRamp(e,t.opacity,s):"univariate-color-size-ramp"===e.type&&(p=this._renderUnivariateColorSizeRamp(e,t.opacity,s));if(!p)return null;const d=e.title;let c=null;if("string"==typeof d)c=d;else if(d){const e=m(this.messages,d,l||n);c=y(d,l||n)&&d.title?`${d.title} (${e})`:e}const v=r?a.layerChildTable:a.layerTable,h=c?f("div",{class:a.layerCaption},c):null,u={[a.layerTableSizeRamp]:o||!r};return f("div",{class:this.classes(v,u)},h,p)}_renderPieChartRamp(e){return f("div",{bind:e.preview,afterCreate:v})}_renderUnivariateAboveAndBelowRamp(e,t,s){const{sizeRampElement:r,colorRampElement:l}=n(e,t);if(!r)return null;const i=o(r,"above",!0),c=o(r,"below",!0),m=12,y=p(l,{width:m,height:i,rampAlignment:"vertical",opacity:t,type:"above",effectList:s}),h=p(l,{width:m,height:c,rampAlignment:"vertical",opacity:t,type:"below",effectList:s}),u=d(r),g=r.infos.map((e=>e.label)),b=g.map(((e,t)=>{const s=2===t;return 0===t?f("div",{key:t,class:e?y?a.univariateAboveAndBelowLabel:a.rampLabel:null},e):s?f("div",null):null})),L=g.length-1,w=Math.floor(g.length/2),A=g.map(((e,t)=>t===w||t===L?f("div",{key:t,class:e?y?a.univariateAboveAndBelowLabel:a.rampLabel:null},e):null)),j={display:"table-cell",verticalAlign:"middle"},S={marginTop:`${u}px`},I={height:`${i}px`},$={height:`${c}px`};return f("div",{key:"univariate-above-and-below-ramp-preview",styles:C},f("div",{class:a.layerBody},r.infos.map(((e,t)=>f("div",{class:this.classes(a.layerRow,a.sizeRamp)},f("div",{class:a.symbol,styles:j,bind:e.preview,afterCreate:v}),y||t%2!=0?null:f("div",{class:a.layerInfo},g[t]))))),y?f("div",{styles:S,key:"color-ramp-preview"},f("div",{styles:_},f("div",{styles:R},f("div",{class:a.rampContainer,bind:y,afterCreate:v})),f("div",{styles:R},f("div",{class:a.rampLabelsContainer,styles:I},b))),f("div",{styles:_},f("div",{styles:R},f("div",{class:a.rampContainer,bind:h,afterCreate:v})),f("div",{styles:R},f("div",{class:a.rampLabelsContainer,styles:$},A)))):null)}_renderUnivariateColorSizeRamp(e,t,s){const{sizeRampElement:r,colorRampElement:l}=c(e);if(!r)return null;const i=d(r),n=12,m=o(r,"full",!1),y=p(l,{width:n,height:m,rampAlignment:"vertical",opacity:t,type:"full",effectList:s}),h=r.infos.length-1,u=r.infos.map(((e,t)=>0===t||t===h?f("div",{key:t,class:e.label?l?a.univariateAboveAndBelowLabel:a.rampLabel:null},e.label):null)),g={display:"table-cell",verticalAlign:"middle"},b={marginTop:`${i}px`},L={height:`${m}px`};return f("div",{key:"univariate-above-and-below-ramp-preview",styles:C},f("div",{class:a.layerBody},r.infos.map((e=>f("div",{class:this.classes(a.layerRow,a.sizeRamp)},f("div",{class:a.symbol,styles:g,bind:e.preview,afterCreate:v}))))),f("div",{styles:b,key:"color-ramp-preview"},f("div",{styles:_},f("div",{styles:R},f("div",{class:a.rampContainer,bind:y,afterCreate:v})),f("div",{styles:R},f("div",{class:a.rampLabelsContainer,styles:L},u)))))}_renderLegendForRamp(e,t){const s=e.infos,r="opacity-ramp"===e.type,l="heatmap-ramp"===e.type,i="stretch-ramp"===e.type,n=e.preview,o=r?a.opacityRamp:"";n.className=`${a.colorRamp} ${o}`,null!=t&&(n.style.opacity=t.toString());const p=s.map((e=>f("div",{class:e.label?a.rampLabel:null},l?this.messages[e.label]||e.label:i?this._getStretchStopLabel(e):e.label))),d={width:`${w}px`},c={height:n.style.height};return f("div",{class:a.layerRow},f("div",{class:a.symbolContainer,styles:d},f("div",{class:a.rampContainer,bind:n,afterCreate:v})),f("div",{class:a.layerInfo},f("div",{class:a.rampLabelsContainer,styles:c},p)))}_getStretchStopLabel(e){return e.label?this.messages[e.label]+": "+("string"==typeof e.value?e.value:b(e.value,{style:"decimal",notation:e.value.toString().includes("e")?"scientific":"standard"})):""}_renderLegendForElementInfo(e,t,s,r,l){if(e.type)return this._renderLegendForElement(e,t,s,!0);let i=null;const n=h(t,l);if(e.preview?i=f("div",{class:a.symbol,bind:e.preview,afterCreate:v}):e.src&&(i=this._renderImage(e,t,n)),!i)return null;const o={[a.imageryLayerInfoStretched]:n},p={[a.imageryLayerInfoStretched]:n,[a.sizeRamp]:!n&&r};return f("div",{class:a.layerRow},f("div",{class:this.classes(a.symbolContainer,p)},i),f("div",{class:this.classes(a.layerInfo,o)},m(this.messages,e.label,!1)||""))}_renderImage(e,t,s){const{label:r,src:l,opacity:i}=e,n={[a.imageryLayerStretchedImage]:s,[a.symbol]:!s},o={opacity:`${null!=i?i:t.opacity}`};return f("img",{alt:m(this.messages,r,!1),src:l,border:0,width:e.width,height:e.height,class:this.classes(n),styles:o})}};e([t()],A.prototype,"activeLayerInfos",void 0),e([t()],A.prototype,"headingLevel",void 0),e([t(),g("esri/widgets/Legend/t9n/Legend")],A.prototype,"messages",void 0),e([t({readOnly:!0})],A.prototype,"type",void 0),A=e([s("esri.widgets.Legend.styles.Classic")],A);const j=A;export{j as default};