@arcgis/map-components 4.34.0-next.98 → 4.34.0

package/dist/components/arcgis-legend-card-univariate-above-and-below-ramp/customElement.js

@@ -0,0 +1,64 @@
+import { c as C } from "../../chunks/runtime.js";
+import { css as E, html as r } from "lit";
+import { LitElement as L, safeClassMap as a, safeStyleMap as t } from "@arcgis/lumina";
+import { useDirection as S } from "@arcgis/lumina/controllers";
+import { f as k, h as B, b, c as f, a as U } from "../../chunks/univariateUtils.js";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/4.34/esri/copyright.txt for details.
+v4.34.0 */
+const F = E`.arcgis-legend--card__layer-row{display:flex;align-items:center}.arcgis-legend--card__symbol{display:block;margin:auto}.arcgis-legend--card__symbol-container{position:relative}.arcgis-legend__ramp-labels{display:flex;flex-flow:column nowrap;justify-content:space-between}.arcgis-legend__layer-cell{padding:var(--calcite-spacing-xxs) 0;min-width:100px;vertical-align:middle;word-break:break-word}.arcgis-legend__layer-cell--info{padding-right:var(--calcite-spacing-sm);padding-left:var(--calcite-spacing-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.arcgis-univariate-above-and-below-ramp__color--card{position:relative}.arcgis-univariate-above-and-below-ramp__color--card:before{content:"";border-left:var(--calcite-border-width-sm) solid var(--calcite-color-background);border-right:var(--calcite-border-width-sm) solid var(--calcite-color-background);width:100%;height:15px;display:block;position:absolute;top:var(--calcite-border-width-sm)}.arcgis-univariate-above-and-below-ramp__symbol{display:flex;align-items:center;justify-content:center}`, i = {
+  layerRow: "arcgis-legend--card__layer-row",
+  symbol: "arcgis-legend--card__symbol",
+  symbolContainer: "arcgis-legend--card__symbol-container",
+  rampLabelsContainer: "arcgis-legend__ramp-labels",
+  layerInfo: "arcgis-legend__layer-cell arcgis-legend__layer-cell--info",
+  univariateAboveAndBelowColorRamp: "arcgis-univariate-above-and-below-ramp__color--card"
+};
+class D extends L {
+  constructor() {
+    super(...arguments), this._direction = S(), this.legendElement = null, this.opacity = 1;
+  }
+  static {
+    this.properties = { cssEffectFilter: 1, legendElement: 0, opacity: 9, messages: 0 };
+  }
+  static {
+    this.styles = F;
+  }
+  render() {
+    const { legendElement: y, opacity: o } = this, { sizeRampElement: e, colorRampElement: n } = k(y, this.messages, o, "horizontal");
+    if (!e)
+      return null;
+    const w = B(e, "full", !0, "horizontal"), h = b(e, "above", !0, "horizontal"), _ = b(e, "below", !0, "horizontal"), c = 12, d = this.messages?.previewColorRampAriaLabel, m = f(n, {
+      width: h,
+      height: c,
+      rampAlignment: "horizontal",
+      opacity: o,
+      type: "above",
+      cssEffectFilter: this.cssEffectFilter,
+      ariaLabel: d
+    }), u = f(n, {
+      width: _,
+      height: c,
+      rampAlignment: "horizontal",
+      opacity: o,
+      type: "below",
+      cssEffectFilter: this.cssEffectFilter,
+      ariaLabel: d
+    }), p = U(e, "card"), g = e.infos.map((l) => l.label), R = g.length - 1, x = g.map((l, v) => v === 0 || v === R ? r`<div>${l}</div>` : null), $ = { display: "flex", flexDirection: "column" }, z = { display: "flex", flexDirection: "row" }, s = {
+      marginTop: "3px",
+      display: "flex"
+    };
+    this._direction === "rtl" ? s.marginRight = `${p}px` : s.marginLeft = `${p}px`;
+    const A = {
+      width: `${w}px`,
+      display: "flex",
+      flexDirection: "row",
+      justifyContent: "space-between"
+    };
+    return r`<div class=${a(i.layerRow)} style=${t($)}><div class=${a(i.symbolContainer)} style=${t(z)}>${e.infos.map((l) => r`<div class=${a(i.symbol)}>${l.preview}</div>`)}</div>${m ? r`<div class=${a(i.univariateAboveAndBelowColorRamp)} style=${t(s)}><div>${m}</div><div>${u}</div></div>` : null}<div class=${a(i.layerInfo)}><div class=${a(i.rampLabelsContainer)} style=${t(A)}>${x}</div></div></div>`;
+  }
+}
+C("arcgis-legend-card-univariate-above-and-below-ramp", D);
+export {
+  D as LegendCardUnivariateAboveAndBelowRamp
+};

package/dist/components/arcgis-legend-card-univariate-above-and-below-ramp/index.d.ts

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-legend-card-univariate-above-and-below-ramp/index.js

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-legend-card-univariate-color-size-ramp/customElement.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="@arcgis/core/interfaces.d.ts" />
+/// <reference path="../../index.d.ts" />
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { ArcgisLegend } from '../arcgis-legend/customElement.js';
+
+/** @private */
+export declare class LegendCardUnivariateColorSizeRamp extends LitElement {
+    cssEffectFilter?: string;
+    legendElement: __esri.UnivariateColorSizeRampElement;
+    /** @default 1 */
+    opacity: number;
+    messages: ArcgisLegend["messages"];
+}

package/dist/components/arcgis-legend-card-univariate-color-size-ramp/customElement.js

@@ -0,0 +1,62 @@
+import { c as _ } from "../../chunks/runtime.js";
+import { css as u, html as o } from "lit";
+import { LitElement as x, safeClassMap as a, safeStyleMap as l } from "@arcgis/lumina";
+import { useDirection as R } from "@arcgis/lumina/controllers";
+import { g as $, h as C, b as z, c as E, a as S } from "../../chunks/univariateUtils.js";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/4.34/esri/copyright.txt for details.
+v4.34.0 */
+const L = u`.arcgis-legend--card__layer-row,.arcgis-legend--card__symbol{display:flex;align-items:center}.arcgis-legend--card__symbol-container{position:relative}.arcgis-legend__ramp-labels{display:flex;flex-flow:column nowrap;justify-content:space-between}.arcgis-legend__layer-cell{padding:var(--calcite-spacing-xxs) 0;min-width:100px;vertical-align:middle;word-break:break-word}.arcgis-legend__layer-cell--info{padding-right:var(--calcite-spacing-sm);padding-left:var(--calcite-spacing-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.arcgis-univariate-above-and-below-ramp__color--card{position:relative}.arcgis-univariate-above-and-below-ramp__color--card:before{content:"";border-left:var(--calcite-border-width-sm) solid var(--calcite-color-background);border-right:var(--calcite-border-width-sm) solid var(--calcite-color-background);width:100%;height:15px;display:block;position:absolute;top:var(--calcite-border-width-sm)}.arcgis-univariate-above-and-below-ramp__symbol{display:flex;align-items:center;justify-content:center}`, i = {
+  layerRow: "arcgis-legend--card__layer-row",
+  symbol: "arcgis-legend--card__symbol",
+  symbolContainer: "arcgis-legend--card__symbol-container",
+  rampLabelsContainer: "arcgis-legend__ramp-labels",
+  layerInfo: "arcgis-legend__layer-cell arcgis-legend__layer-cell--info",
+  univariateAboveAndBelowColorRamp: "arcgis-univariate-above-and-below-ramp__color--card"
+};
+class k extends x {
+  constructor() {
+    super(...arguments), this._direction = R(), this.legendElement = null, this.opacity = 1;
+  }
+  static {
+    this.properties = { cssEffectFilter: 1, legendElement: 0, opacity: 9, messages: 0 };
+  }
+  static {
+    this.styles = L;
+  }
+  render() {
+    const { legendElement: c, opacity: d } = this, { sizeRampElement: e, colorRampElement: m } = $(c, this.messages, "horizontal");
+    if (!e)
+      return null;
+    const p = C(e, "full", !1, "horizontal"), g = z(e, "full", !1, "horizontal"), v = E(m, {
+      width: g,
+      height: 12,
+      rampAlignment: "horizontal",
+      opacity: d,
+      type: "full",
+      cssEffectFilter: this.cssEffectFilter,
+      ariaLabel: this.messages?.previewColorRampAriaLabel
+    }), s = S(e, "card"), f = e.infos.length - 1, y = e.infos.map((t, n) => n === 0 || n === f ? o`<div>${t.label}</div>` : null), b = {
+      display: "flex",
+      flexDirection: "column"
+    }, h = {
+      display: "flex",
+      flexDirection: "row"
+    }, r = {
+      marginTop: "3px",
+      display: "flex"
+    };
+    this._direction === "rtl" ? r.marginRight = `${s}px` : r.marginLeft = `${s}px`;
+    const w = {
+      width: `${p}px`,
+      display: "flex",
+      flexDirection: "row",
+      justifyContent: "space-between"
+    };
+    return o`<div class=${a(i.layerRow)} style=${l(b)}><div class=${a(i.symbolContainer)} style=${l(h)}>${e.infos.map((t) => o`<div class=${a(i.symbol)}>${t.preview}</div>`)}</div><div class=${a(i.univariateAboveAndBelowColorRamp)} style=${l(r)}><div>${v}</div></div><div class=${a(i.layerInfo)}><div class=${a(i.rampLabelsContainer)} style=${l(w)}>${y}</div></div></div>`;
+  }
+}
+_("arcgis-legend-card-univariate-color-size-ramp", k);
+export {
+  k as LegendCardUnivariateColorSizeRamp
+};

package/dist/components/arcgis-legend-card-univariate-color-size-ramp/index.d.ts

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-legend-card-univariate-color-size-ramp/index.js

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-legend-card-view/customElement.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="@arcgis/core/interfaces.d.ts" />
+/// <reference path="../../index.d.ts" />
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { HeadingLevel } from '../../support/heading';
+import { ArcgisLegend } from '../arcgis-legend/customElement.js';
+
+export type CardLayout = "auto" | "side-by-side" | "stack";
+/** @private */
+export declare class LegendCardView extends LitElement {
+    activeLayerInfos?: __esri.Collection<__esri.ActiveLayerInfo>;
+    /** @default 3 */
+    headingLevel: HeadingLevel;
+    messages: ArcgisLegend["messages"];
+    view: __esri.MapView | __esri.SceneView;
+    /**
+     * The rendering layout.
+     *
+     * @default "auto"
+     */
+    layout: CardLayout;
+    /** The type of style. For Card this value is always `card`. */
+    readonly type: "card";
+}

package/dist/components/arcgis-legend-card-view/customElement.js

@@ -0,0 +1,89 @@
+import { c as l } from "../../chunks/runtime.js";
+import { css as d, html as i } from "lit";
+import { watch as o } from "@arcgis/core/core/reactiveUtils.js";
+import { substitute as g } from "@arcgis/core/intl.js";
+import { LitElement as h, safeClassMap as a } from "@arcgis/lumina";
+import { classes as m } from "@arcgis/toolkit/dom";
+import { H as f } from "../../chunks/heading.js";
+import { g as _ } from "../../chunks/globalCss.js";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/4.34/esri/copyright.txt for details.
+v4.34.0 */
+const v = d`.esri-widget__heading{color:var(--calcite-color-text-2);margin:0 0 .5rem;font-weight:var(--calcite-font-weight-semibold)}h1.esri-widget__heading{font-size:var(--calcite-font-size-xl)}h2.esri-widget__heading{font-size:var(--calcite-font-size-md)}h3.esri-widget__heading,h4.esri-widget__heading,h5.esri-widget__heading,h6.esri-widget__heading{font-size:var(--calcite-font-size)}:host{display:flex;flex-direction:row;position:relative;transition:max-width .25s ease-in-out;overflow-x:auto}calcite-carousel-item[selected]{flex:1;overflow:auto}.arcgis-legend--card__message{padding:.5em 1em}.arcgis-legend--card__service-caption-text{margin:0}.arcgis-legend--card__service-content{display:flex;flex:1}.arcgis-legend--card__service-content>arcgis-legend-card-element:not(:first-child){border-left:1px solid var(--calcite-color-border-2)}.arcgis-legend--card__service{border-left:var(--calcite-border-width-sm) solid var(--calcite-color-border-2);min-width:fit-content;display:flex;flex-direction:column;flex:1}.arcgis-legend--card__service-caption-container{border-bottom:1px solid var(--calcite-color-border-2);padding:var(--calcite-spacing-md)}`, n = {
+  message: "arcgis-legend--card__message",
+  serviceCaptionText: "arcgis-legend--card__service-caption-text",
+  serviceContent: "arcgis-legend--card__service-content",
+  service: "arcgis-legend--card__service",
+  serviceCaptionContainer: "arcgis-legend--card__service-caption-container"
+}, u = 768;
+class p extends h {
+  constructor() {
+    super(...arguments), this.stacked = !1, this.headingLevel = 3, this.layout = "auto", this.type = "card";
+  }
+  static {
+    this.properties = { stacked: 16, activeLayerInfos: 0, headingLevel: 9, messages: 0, view: 0, layout: 1, type: 32 };
+  }
+  static {
+    this.styles = v;
+  }
+  loaded() {
+    this.manager.onLifecycle(() => [
+      o(() => [this.layout, this.view.width], () => {
+        this.stacked = this.layout === "stack" || (!this.layout || this.layout === "auto") && this.view.width <= u;
+      }, { initial: !0 })
+    ]);
+  }
+  render() {
+    return (this.stacked ? this._renderCarousel() : this._renderLayers()) || i`<div class=${a(n.message)}>${this.messages.noLegend}</div>`;
+  }
+  _renderTitle(e) {
+    return i`<div class=${a(n.serviceCaptionContainer)}>${f({ class: m(n.serviceCaptionText, _.heading), level: this.headingLevel, children: e })}</div>`;
+  }
+  _renderCarousel() {
+    const e = [], t = this.activeLayerInfos;
+    if (t)
+      for (const s of t)
+        this._renderSections(s, e);
+    return e?.length ? i`<calcite-carousel .label=${this.messages.carousel ?? ""}>${e.map((s, r) => i`<calcite-carousel-item .label=${g(this.messages?.pagination?.pageText ?? "", {
+      index: r + 1,
+      total: e.length
+    })}>${s}</calcite-carousel-item>`)}</calcite-carousel>` : null;
+  }
+  _renderLayers() {
+    const t = this.activeLayerInfos?.toArray()?.map((s) => this._renderLegendForLayer(s)).filter(Boolean);
+    return t?.length ? t : null;
+  }
+  _renderLegendForLayer(e) {
+    if (!e.ready)
+      return null;
+    if (e.children.length) {
+      const t = e.children.toArray().map(this._renderLegendForLayer, this);
+      return i`<section class=${a(n.service)}>${this._renderTitle(e.title)}<div class=${a(n.serviceContent)}>${t}</div></section>`;
+    }
+    return this._renderLegendElementsForLayer(e);
+  }
+  _renderLegendElementsForLayer(e) {
+    const t = e.legendElements?.filter(Boolean);
+    if (!t?.length)
+      return null;
+    const s = t.map((r) => i`<arcgis-legend-card-element .activeLayerInfo=${e} .cssEffectFilter=${e.cssEffectFilter ?? void 0} .stacked=${this.stacked} .headingLevel=${this.headingLevel} .layer=${e.layer} .legendElement=${r} .messages=${this.messages}></arcgis-legend-card-element>`);
+    return i`<section class=${a(n.service)}>${this._renderTitle(e.title)}<div class=${a(n.serviceContent)}>${s}</div></section>`;
+  }
+  _renderSections(e, t) {
+    if (!e.ready)
+      return;
+    if (e.children.length)
+      for (const r of e.children)
+        this._renderSections(r, t);
+    const s = e.legendElements;
+    if (s?.length)
+      for (const r of s) {
+        const c = i`<arcgis-legend-card-element .activeLayerInfo=${e} .cssEffectFilter=${e.cssEffectFilter ?? void 0} .stacked=${this.stacked} .headingLevel=${this.headingLevel} .layer=${e.layer} .legendElement=${r} .messages=${this.messages}></arcgis-legend-card-element>`;
+        c && t.push(c);
+      }
+  }
+}
+l("arcgis-legend-card-view", p);
+export {
+  p as LegendCardView
+};

package/dist/components/arcgis-legend-card-view/index.d.ts

@@ -0,0 +1,4 @@
+import "@esri/calcite-components/components/calcite-carousel";
+import "@esri/calcite-components/components/calcite-carousel-item";
+import "../arcgis-legend-card-element/index.js";
+export * from "./customElement.js";

package/dist/components/arcgis-legend-card-view/index.js

@@ -0,0 +1,4 @@
+import "@esri/calcite-components/components/calcite-carousel";
+import "@esri/calcite-components/components/calcite-carousel-item";
+import "../arcgis-legend-card-element/index.js";
+export * from "./customElement.js";

package/dist/components/arcgis-legend-classic-color-ramp/customElement.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="@arcgis/core/interfaces.d.ts" />
+/// <reference path="../../index.d.ts" />
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { ArcgisLegend } from '../arcgis-legend/customElement.js';
+
+/** @private */
+export declare class ArcgisLegendClassicColorRamp extends LitElement {
+    legendElement: __esri.ColorRampElement | __esri.HeatmapRampElement | __esri.OpacityRampElement | __esri.StretchRampElement;
+    /** @default 1 */
+    opacity: number;
+    messages: ArcgisLegend["messages"];
+}

package/dist/components/arcgis-legend-classic-color-ramp/customElement.js

@@ -0,0 +1,51 @@
+import { c } from "../../chunks/runtime.js";
+import { css as n, html as s } from "lit";
+import { LitElement as p, safeClassMap as i, safeStyleMap as g } from "@arcgis/lumina";
+import { s as o, c as m } from "../../chunks/utils2.js";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/4.34/esri/copyright.txt for details.
+v4.34.0 */
+const d = n`.arcgis-legend__layer-row{display:flex}.arcgis-legend__layer-cell{padding:var(--calcite-spacing-xxs) 0;min-width:100px;vertical-align:middle;word-break:break-word}.arcgis-legend__layer-cell--symbols{min-width:10px;text-align:center}.arcgis-legend__layer-cell--info{padding-right:var(--calcite-spacing-sm);padding-left:var(--calcite-spacing-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.arcgis-legend__ramps{margin-left:var(--calcite-spacing-sm)}:dir(rtl) .arcgis-legend__ramps{margin-right:var(--calcite-spacing-sm);margin-left:auto}.arcgis-legend__color-ramp{width:24px}.arcgis-legend__opacity-ramp{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAIAAABLbSncAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMTgwMTE3NDA3MjA2ODExODcxRkM3N0RBQzA4QkVDRSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpEOTY4RkNFNjM1MzYxMUU0ODlDMUFFQ0M2REU5QzFCNCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpEOTY4RkNFNTM1MzYxMUU0ODlDMUFFQ0M2REU5QzFCNCIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1LjEgTWFjaW50b3NoIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDE4MDExNzQwNzIwNjgxMTg3MUZDNzdEQUMwOEJFQ0UiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDE4MDExNzQwNzIwNjgxMTg3MUZDNzdEQUMwOEJFQ0UiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6SLS5VAAAAKElEQVR42mI8c+YMAwwYGxvD2UwMOADpEoz///+Hc86ePUsLOwACDABC1ghwV8TLOQAAAABJRU5ErkJggg==)}.arcgis-legend__ramp-labels{display:flex;flex-flow:column nowrap;justify-content:space-between}.arcgis-legend__ramp-label{position:relative;padding:0 var(--calcite-spacing-sm);line-height:var(--calcite-font-size-sm);white-space:nowrap;font-size:var(--calcite-font-size-sm)}.arcgis-legend__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:""}.arcgis-legend__ramp-label:first-child{margin-top:calc(var(--calcite-font-size-sm) / 3 * -1)}.arcgis-legend__ramp-label:last-child{bottom:calc(var(--calcite-font-size-sm) * .25 * -1)}.arcgis-legend-layer-caption{display:table-caption;padding:var(--calcite-spacing-sm) 0}:dir(rtl) .arcgis-legend__ramp-label:before{right:auto;left:100%;border-width:3px 0 3px 4px;border-color:transparent transparent transparent var(--calcite-color-text-1)}`, l = {
+  layerRow: "arcgis-legend__layer-row",
+  layerInfo: "arcgis-legend__layer-cell arcgis-legend__layer-cell--info",
+  symbolContainer: "arcgis-legend__layer-cell arcgis-legend__layer-cell--symbols",
+  rampContainer: "arcgis-legend__ramps",
+  colorRamp: "arcgis-legend__color-ramp",
+  opacityRamp: "arcgis-legend__opacity-ramp",
+  rampLabelsContainer: "arcgis-legend__ramp-labels",
+  rampLabel: "arcgis-legend__ramp-label"
+};
+class b extends p {
+  constructor() {
+    super(...arguments), this.legendElement = null, this.opacity = 1;
+  }
+  static {
+    this.properties = { _preview: 16, legendElement: 0, opacity: 9, messages: 0 };
+  }
+  static {
+    this.styles = d;
+  }
+  get _preview() {
+    const e = this.legendElement.preview;
+    if (!e)
+      return null;
+    const a = this.legendElement.type === "opacity-ramp", r = a ? l.opacityRamp : "";
+    e.className = `${l.colorRamp} ${r}`, this.opacity != null && (e.style.opacity = this.opacity.toString());
+    const t = a ? this.messages.previewOpacityRampAriaLabel : this.messages.previewColorRampAriaLabel;
+    return o(e, t), e;
+  }
+  render() {
+    const { legendElement: e, _preview: a } = this;
+    if (!a)
+      return null;
+    const r = { height: a.style.height };
+    return s`<div class=${i(l.layerRow)}><div class=${i(l.symbolContainer)}><div class=${i(l.rampContainer)}>${a}</div></div><div class=${i(l.layerInfo)}><div class=${i(l.rampLabelsContainer)} style=${g(r)}>${e.infos.map((t) => this._renderRampLabel(t, e.type))}</div></div></div>`;
+  }
+  _renderRampLabel(e, a) {
+    return s`<div class=${i(e.label ? l.rampLabel : void 0)}>${m(e, a, this.messages)}</div>`;
+  }
+}
+c("arcgis-legend-classic-color-ramp", b);
+export {
+  b as ArcgisLegendClassicColorRamp
+};

package/dist/components/arcgis-legend-classic-color-ramp/index.d.ts

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-legend-classic-color-ramp/index.js

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-legend-classic-element/customElement.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="@arcgis/core/interfaces.d.ts" />
+/// <reference path="../../index.d.ts" />
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { ArcgisLegend } from '../arcgis-legend/customElement.js';
+
+/** @private */
+export declare class ArcgisLegendClassicElement extends LitElement {
+    cssEffectFilter?: string;
+    layer: __esri.Layer;
+    legendElement: __esri.LegendElement;
+    messages: ArcgisLegend["messages"];
+}

package/dist/components/arcgis-legend-classic-element/customElement.js

@@ -0,0 +1,97 @@
+import { c as v } from "../../chunks/runtime.js";
+import { css as $, html as a } from "lit";
+import { LitElement as w, safeClassMap as t, nothing as g, safeStyleMap as f } from "@arcgis/lumina";
+import { classes as d } from "@arcgis/toolkit/dom";
+import { b as u, s as p, i as E, a as m, g as h } from "../../chunks/utils2.js";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/4.34/esri/copyright.txt for details.
+v4.34.0 */
+const L = $`.arcgis-legend__layer-table{display:flex;flex-flow:column;margin-bottom:var(--calcite-spacing-md);width:100%}.arcgis-legend__layer-table--size-ramp{display:table}.arcgis-legend__layer-table--size-ramp .arcgis-legend__layer-cell{display:table-cell}.arcgis-legend__layer-caption{display:table-caption;padding:var(--calcite-spacing-sm) 0;word-break:break-word}.arcgis-legend__layer-body{margin-left:var(--calcite-spacing-sm)}:dir(rtl) .arcgis-legend__layer-body{margin-right:var(--calcite-spacing-sm);margin-left:0;overflow:auto}.arcgis-legend__layer-row{display:flex}.arcgis-legend__layer-table--size-ramp .arcgis-legend__layer-row{display:table-row}.arcgis-legend__layer-cell{padding:var(--calcite-spacing-xxs) 0;min-width:100px;vertical-align:middle;word-break:break-word;display:flex;align-items:center}.arcgis-legend__layer-cell--info{padding-right:var(--calcite-spacing-sm);padding-left:var(--calcite-spacing-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.arcgis-legend__imagery-layer-image--stretched{display:block;margin-bottom:-2px}.arcgis-legend__imagery-layer-info--stretched{padding:0 2px;vertical-align:top}.arcgis-legend__layer-cell--symbols{min-width:10px;text-align:center}.arcgis-legend__symbol{display:flex;justify-content:center}`, s = {
+  layerTable: "arcgis-legend__layer-table",
+  layerTableSizeRamp: "arcgis-legend__layer-table--size-ramp",
+  layerCaption: "arcgis-legend__layer-caption",
+  layerBody: "arcgis-legend__layer-body",
+  layerRow: "arcgis-legend__layer-row",
+  layerInfo: "arcgis-legend__layer-cell arcgis-legend__layer-cell--info",
+  imageryLayerStretchedImage: "arcgis-legend__imagery-layer-image--stretched",
+  imageryLayerInfoStretched: "arcgis-legend__imagery-layer-info--stretched",
+  symbolContainer: "arcgis-legend__layer-cell arcgis-legend__layer-cell--symbols",
+  symbol: "arcgis-legend__symbol"
+};
+class x extends w {
+  static {
+    this.properties = { cssEffectFilter: 1, layer: 0, legendElement: 0, messages: 0 };
+  }
+  static {
+    this.styles = L;
+  }
+  render() {
+    const e = this._renderLegendElement(), r = u(this.legendElement, this.messages), l = r ? a`<div class=${t(s.layerCaption)}>${r}</div>` : null, i = {
+      [s.layerTableSizeRamp]: this.legendElement.type === "size-ramp"
+    };
+    return a`<section class=${t(d(s.layerTable, i))}>${l}${e}</section>`;
+  }
+  _renderLegendElement() {
+    switch (this.legendElement.type) {
+      case "symbol-table":
+        return this._renderSymbolTable(this.legendElement);
+      case "size-ramp":
+        return a`<arcgis-legend-classic-size-ramp .legendElement=${this.legendElement} .messages=${this.messages}></arcgis-legend-classic-size-ramp>`;
+      case "color-ramp":
+      case "opacity-ramp":
+      case "heatmap-ramp":
+      case "stretch-ramp":
+        return a`<arcgis-legend-classic-color-ramp .legendElement=${this.legendElement} .messages=${this.messages} .opacity=${this.layer.opacity}></arcgis-legend-classic-color-ramp>`;
+      case "relationship-ramp":
+        return a`<arcgis-legend-relationship-ramp .cssEffectFilter=${this.cssEffectFilter} .legendElement=${this.legendElement} .opacity=${this.layer.opacity} .messages=${this.messages}></arcgis-legend-relationship-ramp>`;
+      case "pie-chart-ramp": {
+        const { preview: e } = this.legendElement;
+        return p(e, this.messages.previewPieChartAriaLabel), a`<div>${e}</div>`;
+      }
+      case "univariate-above-and-below-ramp":
+        return a`<arcgis-legend-classic-univariate-above-and-below-ramp .cssEffectFilter=${this.cssEffectFilter} .legendElement=${this.legendElement} .messages=${this.messages} .opacity=${this.layer.opacity}></arcgis-legend-classic-univariate-above-and-below-ramp>`;
+      case "univariate-color-size-ramp":
+        return a`<arcgis-legend-classic-univariate-color-size-ramp .cssEffectFilter=${this.cssEffectFilter} .legendElement=${this.legendElement} .messages=${this.messages} .opacity=${this.layer.opacity}></arcgis-legend-classic-univariate-color-size-ramp>`;
+      default:
+        return null;
+    }
+  }
+  _renderSymbolTable(e) {
+    const r = e.infos.map((l) => this._renderElementInfo(l, e.legendType)).filter(Boolean);
+    return r.length ? a`<div class=${t(s.layerBody)}>${r}</div>` : null;
+  }
+  _renderElementInfo(e, r) {
+    const { layer: l } = this, i = "label" in e ? e.label : null;
+    if ("type" in e && e.type)
+      return e ? a`<arcgis-legend-classic-element .cssEffectFilter=${this.cssEffectFilter} .layer=${l} .legendElement=${e} .messages=${this.messages}></arcgis-legend-classic-element>` : null;
+    if (!("preview" in e && e.preview) && !("src" in e && e.src))
+      return null;
+    const c = E(l, r), n = {
+      [s.imageryLayerInfoStretched]: c
+    }, o = {
+      [s.imageryLayerInfoStretched]: c
+    };
+    return a`<div class=${t(s.layerRow)}><div class=${t(d(s.symbolContainer, o))}>${this._renderPreview(e, c)}</div><div class=${t(d(s.layerInfo, n))}>${m(this.messages, i, !1) || ""}</div></div>`;
+  }
+  _renderPreview(e, r) {
+    const { layer: l } = this;
+    if ("preview" in e && e.preview) {
+      const { preview: i } = e, c = "previewAriaLabel" in e ? e.previewAriaLabel : null, n = "label" in e ? m(this.messages, e.label, !1) : null;
+      return p(i, h(this.messages, c || n)), a`<div class=${t(s.symbol)}>${i}</div>`;
+    }
+    return "src" in e && e.src ? this._renderImage(e, l, r) : null;
+  }
+  _renderImage(e, r, l) {
+    const { previewAriaLabel: i, src: c, opacity: n } = e, o = m(this.messages, e.label, !1), b = {
+      [s.imageryLayerStretchedImage]: l,
+      [s.symbol]: !l
+    }, _ = {
+      opacity: `${n ?? r.opacity}`
+    }, y = h(this.messages, i || o);
+    return a`<img alt=${y ?? g} .ariaLabel=${y} class=${t(d(b))} height=${e.height ?? void 0 ?? g} src=${c ?? g} style=${f(_)} width=${e.width ?? void 0 ?? g}>`;
+  }
+}
+v("arcgis-legend-classic-element", x);
+export {
+  x as ArcgisLegendClassicElement
+};

package/dist/components/arcgis-legend-classic-element/index.d.ts

@@ -0,0 +1,7 @@
+import "../arcgis-legend-classic-size-ramp/index.js";
+import "../arcgis-legend-classic-color-ramp/index.js";
+import "../arcgis-legend-relationship-ramp/index.js";
+import "../arcgis-legend-classic-univariate-above-and-below-ramp/index.js";
+import "../arcgis-legend-classic-univariate-color-size-ramp/index.js";
+import ".//index.js";
+export * from "./customElement.js";

package/dist/components/arcgis-legend-classic-element/index.js

@@ -0,0 +1,7 @@
+import "../arcgis-legend-classic-size-ramp/index.js";
+import "../arcgis-legend-classic-color-ramp/index.js";
+import "../arcgis-legend-relationship-ramp/index.js";
+import "../arcgis-legend-classic-univariate-above-and-below-ramp/index.js";
+import "../arcgis-legend-classic-univariate-color-size-ramp/index.js";
+import ".//index.js";
+export * from "./customElement.js";

package/dist/components/arcgis-legend-classic-size-ramp/customElement.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="@arcgis/core/interfaces.d.ts" />
+/// <reference path="../../index.d.ts" />
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { ArcgisLegend } from '../arcgis-legend/customElement.js';
+
+/** @private */
+export declare class ArcgisLegendClassicSizeRamp extends LitElement {
+    legendElement: __esri.SizeRampElement;
+    messages: ArcgisLegend["messages"];
+}

package/dist/components/arcgis-legend-classic-size-ramp/customElement.js

@@ -0,0 +1,42 @@
+import { c as t } from "../../chunks/runtime.js";
+import { css as c, html as l } from "lit";
+import { LitElement as m, safeClassMap as i } from "@arcgis/lumina";
+import { classes as n } from "@arcgis/toolkit/dom";
+import { a as g, s as o, g as d } from "../../chunks/utils2.js";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/4.34/esri/copyright.txt for details.
+v4.34.0 */
+const p = c`.arcgis-legend__size-ramp--container{margin-left:var(--calcite-spacing-sm);display:table}:dir(rtl) .arcgis-legend__size-ramp--container{margin-right:var(--calcite-spacing-sm);margin-left:0;overflow:auto}.arcgis-legend__size-ramp--row{display:table-row}.arcgis-legend__size-ramp--cell{padding:var(--calcite-spacing-xxs) 0;min-width:100px;vertical-align:middle;word-break:break-word;display:table-cell}.arcgis-legend__size-ramp--label{padding-right:var(--calcite-spacing-sm);padding-left:var(--calcite-spacing-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.arcgis-legend__size-ramp--symbol-container{min-width:10px;text-align:center}.arcgis-legend__size-ramp--symbol{display:flex;justify-content:center}`, e = {
+  container: "arcgis-legend__size-ramp--container",
+  row: "arcgis-legend__size-ramp--row",
+  cell: "arcgis-legend__size-ramp--cell",
+  label: "arcgis-legend__size-ramp--label",
+  symbol: "arcgis-legend__size-ramp--symbol",
+  symbolContainer: "arcgis-legend__size-ramp--symbol-container"
+};
+class _ extends m {
+  constructor() {
+    super(...arguments), this.legendElement = null;
+  }
+  static {
+    this.properties = { legendElement: 0, messages: 0 };
+  }
+  static {
+    this.styles = p;
+  }
+  render() {
+    const s = this.legendElement.infos.map((a) => this._renderRow(a)).filter(Boolean);
+    return s.length ? this.legendElement.theme === "spike" ? l`<arcgis-legend-spike-ramp .legendElement=${this.legendElement} .messages=${this.messages}></arcgis-legend-spike-ramp>` : l`<div class=${i(e.container)}>${s}</div>` : null;
+  }
+  _renderRow(s) {
+    const { preview: a } = s;
+    if (!a)
+      return null;
+    const r = g(this.messages, s.label, !1);
+    return o(a, d(this.messages, r)), l`<div class=${i(e.row)}><div class=${i(n(e.cell, e.symbolContainer))}><div class=${i(e.symbol)}>${a}</div></div><div class=${i(n(e.cell, e.label))}>${r}</div></div>`;
+  }
+}
+t("arcgis-legend-classic-size-ramp", _);
+export {
+  _ as ArcgisLegendClassicSizeRamp
+};

package/dist/components/arcgis-legend-classic-size-ramp/index.d.ts

@@ -0,0 +1,2 @@
+import "../arcgis-legend-spike-ramp/index.js";
+export * from "./customElement.js";

package/dist/components/arcgis-legend-classic-size-ramp/index.js

@@ -0,0 +1,2 @@
+import "../arcgis-legend-spike-ramp/index.js";
+export * from "./customElement.js";

package/dist/components/arcgis-legend-classic-univariate-above-and-below-ramp/customElement.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="@arcgis/core/interfaces.d.ts" />
+/// <reference path="../../index.d.ts" />
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { ArcgisLegend } from '../arcgis-legend/customElement.js';
+
+/** @private */
+export declare class ArcgisLegendClassicUnivariateAboveAndBelowRamp extends LitElement {
+    cssEffectFilter?: string;
+    legendElement: __esri.UnivariateColorSizeRampElement;
+    /** @default 1 */
+    opacity: number;
+    messages: ArcgisLegend["messages"];
+}

package/dist/components/arcgis-legend-classic-univariate-above-and-below-ramp/customElement.js

@@ -0,0 +1,55 @@
+import { c as M } from "../../chunks/runtime.js";
+import { css as k, html as r } from "lit";
+import { LitElement as F, safeClassMap as i, safeStyleMap as a } from "@arcgis/lumina";
+import { f as P, b as y, c as f, a as U, u as I, d as _, e as c } from "../../chunks/univariateUtils.js";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/4.34/esri/copyright.txt for details.
+v4.34.0 */
+const j = k`.arcgis-legend__layer-body{margin-left:var(--calcite-spacing-sm);display:table}:dir(rtl) .arcgis-legend__layer-body{margin-right:var(--calcite-spacing-sm);margin-left:0;overflow:auto}.arcgis-legend__layer-row{display:table-row}.arcgis-legend__layer-cell{display:table-cell;padding:var(--calcite-spacing-xxs) 0;min-width:100px;vertical-align:middle;word-break:break-word}.arcgis-legend__layer-cell--info{padding-right:var(--calcite-spacing-sm);padding-left:var(--calcite-spacing-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.arcgis-legend__symbol{display:flex;justify-content:center}.arcgis-legend__ramps{margin-left:var(--calcite-spacing-md)}:dir(rtl) .arcgis-legend__ramps{margin-right:var(--calcite-spacing-md);margin-left:auto}.arcgis-legend__ramp-labels{display:flex;flex-flow:column nowrap;justify-content:space-between}.arcgis-legend__ramp-label{position:relative;padding:0 var(--calcite-spacing-sm);line-height:1em;white-space:nowrap;font-size:var(--calcite-font-size-sm)}.arcgis-legend__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:""}.arcgis-legend__ramp-label:first-child{margin-top:calc(var(--calcite-font-size-sm) / 3 * -1)}.arcgis-legend__ramp-label:last-child{bottom:calc(var(--calcite-font-size-sm) * .25 * -1)}:dir(rtl) .arcgis-legend__ramp-label:before{right:auto;left:100%;border-width:3px 0 3px 4px;border-color:transparent transparent transparent var(--calcite-color-text-1)}.arcgis-univariate-above-and-below-ramp__label{position:relative;margin-left:7px;line-height:1em;white-space:nowrap;font-size:var(--calcite-font-size-sm)}.arcgis-univariate-above-and-below-ramp__label:before{display:block;position:absolute;top:.45em;left:-19px;border-width:1px 0 0;border-style:solid;width:14px;height:0;content:""}.arcgis-univariate-above-and-below-ramp__label:first-child{top:calc(var(--calcite-font-size-sm) / 2.2 * -1)}.arcgis-univariate-above-and-below-ramp__label:last-child{bottom:calc(var(--calcite-font-size-sm) / 2.2 * -1)}:dir(rtl) .arcgis-univariate-above-and-below-ramp__label{margin-right:var(--calcite-spacing-sm);margin-left:auto}:dir(rtl) .arcgis-univariate-above-and-below-ramp__label:before{right:-19px;left:auto}.arcgis-univariate-above-and-below-ramp__symbol{display:flex;align-items:center;justify-content:center}`, e = {
+  layerBody: "arcgis-legend__layer-body",
+  layerRow: "arcgis-legend__layer-row",
+  layerInfo: "arcgis-legend__layer-cell arcgis-legend__layer-cell--info",
+  symbol: "arcgis-legend__symbol",
+  rampContainer: "arcgis-legend__ramps",
+  rampLabelsContainer: "arcgis-legend__ramp-labels",
+  rampLabel: "arcgis-legend__ramp-label",
+  univariateAboveAndBelowLabel: "arcgis-univariate-above-and-below-ramp__label"
+};
+class H extends F {
+  constructor() {
+    super(...arguments), this.legendElement = null, this.opacity = 1;
+  }
+  static {
+    this.properties = { cssEffectFilter: 1, legendElement: 0, opacity: 9, messages: 0 };
+  }
+  static {
+    this.styles = j;
+  }
+  render() {
+    const { legendElement: h, opacity: d } = this, { sizeRampElement: s, colorRampElement: p } = P(h, this.messages, d);
+    if (!s)
+      return null;
+    const m = this.messages.previewColorRampAriaLabel, g = y(s, "above", !0), v = y(s, "below", !0), b = 12, o = f(p, {
+      width: b,
+      height: g,
+      rampAlignment: "vertical",
+      opacity: d,
+      type: "above",
+      cssEffectFilter: this.cssEffectFilter,
+      ariaLabel: m
+    }), w = f(p, {
+      width: b,
+      height: v,
+      rampAlignment: "vertical",
+      opacity: d,
+      type: "below",
+      cssEffectFilter: this.cssEffectFilter,
+      ariaLabel: m
+    }), u = U(s), n = s.infos.map((l) => l.label), $ = n.map((l, t) => t === 0 ? r`<div class=${i(l ? o ? e.univariateAboveAndBelowLabel : e.rampLabel : void 0)}>${l}</div>` : t === 2 ? r`<div></div>` : null), x = n.length - 1, L = Math.floor(n.length / 2), R = n.map((l, t) => t === L || t === x ? r`<div class=${i(l ? o ? e.univariateAboveAndBelowLabel : e.rampLabel : void 0)}>${l}</div>` : null), A = { display: "table-cell", verticalAlign: "middle" }, C = { marginTop: `${u}px` }, E = { height: `${g}px` }, z = { height: `${v}px` };
+    return r`<div style=${a(I)}><div class=${i(e.layerBody)}>${s.infos.map((l, t) => r`<div class=${i(e.layerRow)}><div class=${i(e.symbol)} style=${a(A)}>${l.preview}</div>${!o && t % 2 === 0 ? r`<div class=${i(e.layerInfo)}>${n[t]}</div>` : null}</div>`)}</div>${o ? r`<div style=${a(C)}><div style=${a(_)}><div style=${a(c)}><div class=${i(e.rampContainer)}>${o}</div></div><div style=${a(c)}><div class=${i(e.rampLabelsContainer)} style=${a(E)}>${$}</div></div></div><div style=${a(_)}><div style=${a(c)}><div class=${i(e.rampContainer)}>${w}</div></div><div style=${a(c)}><div class=${i(e.rampLabelsContainer)} style=${a(z)}>${R}</div></div></div></div>` : null}</div>`;
+  }
+}
+M("arcgis-legend-classic-univariate-above-and-below-ramp", H);
+export {
+  H as ArcgisLegendClassicUnivariateAboveAndBelowRamp
+};

package/dist/components/arcgis-legend-classic-univariate-above-and-below-ramp/index.d.ts

@@ -0,0 +1 @@
+export * from "./customElement.js";