npm - @arcgis/map-components - Versions diffs - 5.2.0-next.98 → 6.0.0-next.0 - Mend

@arcgis/map-components 5.2.0-next.98 → 6.0.0-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3058) hide show

package/dist/components/arcgis-legend/customElement.d.ts CHANGED Viewed

@@ -1,13 +1,12 @@
 /// <reference path="../../index.d.ts" />
-import type ActiveLayerInfo from "@arcgis/core/widgets/Legend/support/ActiveLayerInfo.js";
+import type ActiveLayerInfo from "@arcgis/core/legend/ActiveLayerInfo.js";
 import type LinkChartView from "@arcgis/core/views/LinkChartView.js";
 import type Collection from "@arcgis/core/core/Collection.js";
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
 import type { ArcgisReferenceElement, HeadingLevel } from "../types.js";
 import type { T9nMeta } from "@arcgis/lumina/controllers";
 import type { MapViewOrSceneView } from "@arcgis/core/views/MapViewOrSceneView.js";
-import type { LayerInfo } from "@arcgis/core/widgets/types.js";
-import type { LegendViewModelState } from "@arcgis/core/widgets/Legend/LegendViewModel.js";
+import type { LayerInfo, LegendContentState } from "@arcgis/core/legend/types.js";
 /**
  * The Legend component displays the symbols and labels used to represent layers in an [arcgis-map](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-map/) or [arcgis-scene](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scene/).
@@ -89,9 +88,9 @@ import type { LegendViewModelState } from "@arcgis/core/widgets/Legend/LegendVie
  */
 export abstract class ArcgisLegend extends LitElement {
   /**
-   * Collection of [ActiveLayerInfo](https://developers.arcgis.com/javascript/latest/references/core/widgets/Legend/support/ActiveLayerInfo/) objects used by the legend view to
+   * Collection of [ActiveLayerInfo](https://developers.arcgis.com/javascript/latest/references/core/legend/ActiveLayerInfo/) objects used by the legend view to
    * display data in the legend. The legend component watches this property to hide or display the layer's legend when
-   * an [ActiveLayerInfo](https://developers.arcgis.com/javascript/latest/references/core/widgets/Legend/support/ActiveLayerInfo/) is removed from or added to this collection.
+   * an [ActiveLayerInfo](https://developers.arcgis.com/javascript/latest/references/core/legend/ActiveLayerInfo/) is removed from or added to this collection.
    */
   accessor activeLayerInfos: Collection<ActiveLayerInfo>;
   /**
@@ -257,7 +256,6 @@ export abstract class ArcgisLegend extends LitElement {
    *     sublayerIds: [subtypeSublayerId]
    *   }
    * ];
-   * });
    * ```
    */
   accessor layerInfos: Array<LayerInfo>;
@@ -422,7 +420,7 @@ export abstract class ArcgisLegend extends LitElement {
    */
   accessor referenceElement: ArcgisReferenceElement | string | undefined;
   /**
-   * If a layer uses a unique value render, only features that satisfy the layer's
+   * If a layer uses a unique value renderer, only features that satisfy the layer's
    * [definition](https://developers.arcgis.com/javascript/latest/references/core/layers/FeatureLayer/#definitionExpression)
    * will be displayed in the legend when set to true.
    *
@@ -446,7 +444,7 @@ export abstract class ArcgisLegend extends LitElement {
    *
    * @default "disabled"
    */
-  get state(): LegendViewModelState;
+  get state(): LegendContentState;
   /**
    * The view associated with the component.
    * > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the arcgis-legend component will be associated with a map or scene component rather than using the `view` property.
@@ -456,7 +454,7 @@ export abstract class ArcgisLegend extends LitElement {
   destroy(): Promise<void>;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "state"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {
     arcgisPropertyChange: ArcgisLegend["arcgisPropertyChange"]["detail"];

package/dist/components/arcgis-legend/customElement.js CHANGED Viewed

@@ -2,17 +2,17 @@
 import { c as d } from "../../chunks/runtime.js";
 import { css as g, html as o } from "lit";
 import { on as a, watch as n } from "@arcgis/core/core/reactiveUtils.js";
-import h from "@arcgis/core/widgets/Legend/LegendViewModel.js";
+import h from "@arcgis/core/legend/LegendContent.js";
 import { LitElement as p, createEvent as f, safeClassMap as u } from "@arcgis/lumina";
 import { usePropertyChange as m } from "@arcgis/lumina/controllers";
 import { classes as v } from "@arcgis/toolkit/dom";
-import { u as w } from "../../chunks/useT9n.js";
-import { m as _ } from "../../chunks/useViewModel.js";
+import { u as _ } from "../../chunks/useT9n.js";
+import { m as w } from "../../chunks/useViewModel.js";
 import { g as l } from "../../chunks/globalCss.js";
-const y = g`.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)}.esri-widget{box-sizing:border-box;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget *,.esri-widget :before,.esri-widget :after{box-sizing:inherit}.esri-widget.esri-widget--disabled>*{opacity:.4;pointer-events:none}.esri-widget.esri-widget--compact{--esri-widget-padding-y: 0;--esri-widget-padding-x: 0}.esri-widget__anchor{color:var(--calcite-color-text-2)}.esri-widget__anchor:hover{color:var(--calcite-color-text-3)}.esri-widget__anchor:hover,.esri-widget__anchor:focus{text-decoration:underline}.esri-widget__anchor--disabled{opacity:.4;pointer-events:none}.esri-widget__header{background-color:var(--calcite-color-foreground-1);flex:1 0 100%;justify-content:space-between;align-items:center;width:100%;min-height:48px;padding:12px 0 12px 15px;display:flex}.esri-widget__heading{word-break:break-word}.esri-widget__header .esri-widget__heading{width:calc(100% - 48px);text-align:initial;color:var(--calcite-color-text-1);align-items:center;margin:0;padding:0;display:flex}.esri-widget__header-button{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);border:none;flex:0 0 48px;justify-content:center;align-self:stretch;align-items:center;width:48px;padding:0;display:flex}.esri-widget__footer{background-color:var(--calcite-color-foreground-1);justify-content:center;align-items:center;width:100%;min-height:48px;display:flex}.esri-widget__footer-pagination{color:var(--calcite-color-text-2);justify-content:space-between;align-items:center;display:flex}.esri-widget__footer-pagination-previous-button,.esri-widget__footer-pagination-next-button{cursor:pointer;background-color:var(--calcite-color-foreground-1);border:0;margin:0 7px;padding:12px 15px;transition:background-color .125s ease-in-out}.esri-widget__footer-pagination-previous-button:hover,.esri-widget__footer-pagination-previous-button:focus,.esri-widget__footer-pagination-next-button:hover,.esri-widget__footer-pagination-next-button:focus{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1)}.esri-menu{visibility:hidden;z-index:1;background-clip:padding;background-color:var(--calcite-color-foreground-1);background-clip:padding-box;width:100%;max-height:0;margin:2px 0 0;padding:0;font-size:var(--calcite-font-size);line-height:var(--calcite-spacing-xl);position:absolute;top:100%;left:0;overflow:hidden;box-shadow:0 1px 2px #0000004d}.esri-menu .esri-menu__header{color:var(--calcite-color-text-inverse);background-color:var(--calcite-color-inverse);padding:6px 12px}.esri-menu__list{margin:0;padding:0;list-style:none}.esri-menu__list-item{cursor:pointer;border-top:1px solid #adadad4d;border-left:3px solid #0000;padding:.8em 1em}.esri-menu__list-item [class^=esri-icon-],.esri-menu__list-item [class*=" esri-icon-"]{padding-right:2.8px}.esri-menu__list-item:first-child{border-top:none}.esri-menu__list-item--focus,.esri-menu__list-item:hover,.esri-menu__list-item:focus{background-color:var(--calcite-color-foreground-1)}.esri-menu__list-item:active{background-color:var(--calcite-color-foreground-current)}.esri-menu__list-item--active,.esri-menu__list-item--active:hover,.esri-menu__list-item--active:focus{background-color:var(--calcite-color-foreground-1);border-left-color:var(--calcite-color-brand)}.esri-widget__table{border-collapse:collapse;color:var(--calcite-color-text-1);border:none;width:100%;line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget__table tr:nth-child(odd){background-color:var(--calcite-color-transparent)}.esri-widget__table tr:nth-child(2n){background-color:var(--calcite-color-transparent-press)}.esri-widget__table tr a{color:var(--calcite-color-text-2)}.esri-widget__table tr a:hover,.esri-widget__table tr a:focus{color:var(--calcite-color-text-1)}.esri-widget__table tr td,.esri-widget__table tr th{vertical-align:top;word-break:break-word;padding:.5em .7em;font-size:var(--calcite-font-size-sm);font-weight:var(--calcite-font-weight-regular)}.esri-widget__table tr th{text-align:left;border-right:3px solid #0000000d;width:50%}.esri-widget__table tr td{width:50%}.esri-input{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1);border:1px solid #959595;font-size:var(--calcite-font-size)}.esri-input::-ms-clear{display:none}.esri-input::placeholder{opacity:1;color:var(--calcite-color-text-2)}.esri-input:placeholder-shown{text-overflow:ellipsis}.esri-input[type=text],.esri-input[type=password],.esri-input[type=number]{height:32px;padding:0 .5em}calcite-combobox.esri-input{border:none}.esri-widget__content--empty{text-align:center;color:var(--calcite-color-border-input);flex-flow:column wrap;align-items:center;padding:18px 22px;display:flex}.esri-widget__content--empty h1.esri-widget__heading,.esri-widget__content--empty h2.esri-widget__heading,.esri-widget__content--empty h3.esri-widget__heading,.esri-widget__content--empty h4.esri-widget__heading,.esri-widget__content--empty h5.esri-widget__heading{font-weight:var(--calcite-font-weight-regular)}.esri-widget__content-illustration--empty{width:128px;padding:1rem 0}.esri-widget__content-icon--empty{width:32px;padding:.5rem 0}.esri-select{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background:var(--calcite-color-foreground-1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 32 32' width='32' height='32'%3E%3Cpath d='M8 11.207l-4-4V5.793l4 4 4-4v1.414z' fill='%23adadad' fillrule='nonzero'/%3E%3C/svg%3E") 100% no-repeat;border:1px solid #959595;border-radius:0;width:100%;height:32px;margin:0;padding:0 .5em;font-family:inherit;font-size:.85em;display:block}.esri-select[disabled]{cursor:auto}.esri-select::-ms-expand{display:none}.esri-disabled a,.esri-disabled [role=menu],.esri-disabled [role=checkbox],.esri-disabled [class^=esri-icon-],.esri-disabled [class*=" esri-icon-"]{color:var(--calcite-color-text-3)}.keynav-mode .esri-widget:focus,.keynav-mode .esri-widget :focus{z-index:1;outline-offset:2px;outline:2px solid #adadad}.esri-widget__loader-animation{border:.15em solid #adadad4d;border-top-color:var(--calcite-color-border-input);border-radius:100%;width:1em;height:1em;font-size:var(--calcite-font-size-md);animation:1.25s linear infinite esri-rotate;display:block;transform:translateZ(0)}:dir(rtl) .esri-widget__table th{text-align:right;border-left:3px solid #0000000d;border-right:none}:dir(rtl) .esri-select{background-position:0}:dir(rtl) .esri-menu__list-item{border-left:none;border-right:3px solid #0000}:dir(rtl) .esri-menu__list-item [class^=esri-icon-],:dir(rtl) .esri-menu__list-item [class*=" esri-icon-"]{padding-left:2px;padding-right:0}:dir(rtl) .esri-menu__list-item--active{border-right-color:var(--calcite-color-brand)}.esri-icon-font-fallback-text{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.esri-rotating{animation:1.25s linear infinite esri-rotate;transform:translateZ(0)}.esri-clearfix:before,.esri-clearfix:after{content:" ";display:table}.esri-clearfix:after{clear:both}.esri-interactive{cursor:pointer}.esri-hidden{display:none!important}.esri-invisible{visibility:hidden!important}.esri-offscreen{position:absolute;top:-999em;left:-999em}.esri-match-height{flex-direction:column;flex:auto;display:flex;overflow:hidden}:host{--arcgis-internal-legend-heading-margin: 0 0 var(--calcite-space-xs);--arcgis-internal-legend-layer-padding: var(--calcite-space-md);--arcgis-internal-legend-layer-gap: var(--calcite-space-xl);--arcgis-internal-legend-layer-element-gap: var(--calcite-space-md);overflow:auto;width:var(--arcgis-internal-legend-width, 300px)}.root{overflow-y:var(--arcgis-internal-panel-overflow, auto)}:host([card-style-layout="side-by-side"]){--arcgis-internal-legend-width: auto}`, b = _(h);
+const y = g`.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)}.esri-widget{box-sizing:border-box;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget *,.esri-widget :before,.esri-widget :after{box-sizing:inherit}.esri-widget.esri-widget--disabled>*{opacity:.4;pointer-events:none}.esri-widget.esri-widget--compact{--esri-widget-padding-y: 0;--esri-widget-padding-x: 0}.esri-widget__anchor{color:var(--calcite-color-text-2)}.esri-widget__anchor:hover{color:var(--calcite-color-text-3)}.esri-widget__anchor:hover,.esri-widget__anchor:focus{text-decoration:underline}.esri-widget__anchor--disabled{opacity:.4;pointer-events:none}.esri-widget__header{background-color:var(--calcite-color-foreground-1);flex:1 0 100%;justify-content:space-between;align-items:center;width:100%;min-height:48px;padding:12px 0 12px 15px;display:flex}.esri-widget__heading{word-break:break-word}.esri-widget__header .esri-widget__heading{width:calc(100% - 48px);text-align:initial;color:var(--calcite-color-text-1);align-items:center;margin:0;padding:0;display:flex}.esri-widget__header-button{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);border:none;flex:0 0 48px;justify-content:center;align-self:stretch;align-items:center;width:48px;padding:0;display:flex}.esri-widget__footer{background-color:var(--calcite-color-foreground-1);justify-content:center;align-items:center;width:100%;min-height:48px;display:flex}.esri-widget__footer-pagination{color:var(--calcite-color-text-2);justify-content:space-between;align-items:center;display:flex}.esri-widget__footer-pagination-previous-button,.esri-widget__footer-pagination-next-button{cursor:pointer;background-color:var(--calcite-color-foreground-1);border:0;margin:0 7px;padding:12px 15px;transition:background-color .125s ease-in-out}.esri-widget__footer-pagination-previous-button:hover,.esri-widget__footer-pagination-previous-button:focus,.esri-widget__footer-pagination-next-button:hover,.esri-widget__footer-pagination-next-button:focus{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1)}.esri-menu{visibility:hidden;z-index:1;background-clip:padding;background-color:var(--calcite-color-foreground-1);background-clip:padding-box;width:100%;max-height:0;margin:2px 0 0;padding:0;font-size:var(--calcite-font-size);line-height:var(--calcite-spacing-xl);position:absolute;top:100%;left:0;overflow:hidden;box-shadow:0 1px 2px #0000004d}.esri-menu .esri-menu__header{color:var(--calcite-color-text-inverse);background-color:var(--calcite-color-inverse);padding:6px 12px}.esri-menu__list{margin:0;padding:0;list-style:none}.esri-menu__list-item{cursor:pointer;border-top:1px solid #adadad4d;border-left:3px solid #0000;padding:.8em 1em}.esri-menu__list-item [class^=esri-icon-],.esri-menu__list-item [class*=" esri-icon-"]{padding-right:2.8px}.esri-menu__list-item:first-child{border-top:none}.esri-menu__list-item--focus,.esri-menu__list-item:hover,.esri-menu__list-item:focus{background-color:var(--calcite-color-foreground-1)}.esri-menu__list-item:active{background-color:var(--calcite-color-foreground-current)}.esri-menu__list-item--active,.esri-menu__list-item--active:hover,.esri-menu__list-item--active:focus{background-color:var(--calcite-color-foreground-1);border-left-color:var(--calcite-color-brand)}.esri-widget__table{border-collapse:collapse;color:var(--calcite-color-text-1);border:none;width:100%;line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget__table tr:nth-child(odd){background-color:var(--calcite-color-transparent)}.esri-widget__table tr:nth-child(2n){background-color:var(--calcite-color-transparent-press)}.esri-widget__table tr a{color:var(--calcite-color-text-2)}.esri-widget__table tr a:hover,.esri-widget__table tr a:focus{color:var(--calcite-color-text-1)}.esri-widget__table tr td,.esri-widget__table tr th{vertical-align:top;word-break:break-word;padding:.5em .7em;font-size:var(--calcite-font-size-sm);font-weight:var(--calcite-font-weight-regular)}.esri-widget__table tr th{text-align:left;border-right:3px solid #0000000d;width:50%}.esri-widget__table tr td{width:50%}.esri-input{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1);border:1px solid #959595;font-size:var(--calcite-font-size)}.esri-input::-ms-clear{display:none}.esri-input::placeholder{opacity:1;color:var(--calcite-color-text-2)}.esri-input:placeholder-shown{text-overflow:ellipsis}.esri-input[type=text],.esri-input[type=password],.esri-input[type=number]{height:32px;padding:0 .5em}calcite-combobox.esri-input{border:none}.esri-widget__content--empty{text-align:center;color:var(--calcite-color-border-input);flex-flow:column wrap;align-items:center;padding:18px 22px;display:flex}.esri-widget__content--empty h1.esri-widget__heading,.esri-widget__content--empty h2.esri-widget__heading,.esri-widget__content--empty h3.esri-widget__heading,.esri-widget__content--empty h4.esri-widget__heading,.esri-widget__content--empty h5.esri-widget__heading{font-weight:var(--calcite-font-weight-regular)}.esri-widget__content-illustration--empty{width:128px;padding:1rem 0}.esri-widget__content-icon--empty{width:32px;padding:.5rem 0}.esri-select{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background:var(--calcite-color-foreground-1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 32 32' width='32' height='32'%3E%3Cpath d='M8 11.207l-4-4V5.793l4 4 4-4v1.414z' fill='%23adadad' fillrule='nonzero'/%3E%3C/svg%3E") 100% no-repeat;border:1px solid #959595;border-radius:0;width:100%;height:32px;margin:0;padding:0 .5em;font-family:inherit;font-size:.85em;display:block}.esri-select[disabled]{cursor:auto}.esri-select::-ms-expand{display:none}.esri-disabled a,.esri-disabled [role=menu],.esri-disabled [role=checkbox],.esri-disabled [class^=esri-icon-],.esri-disabled [class*=" esri-icon-"]{color:var(--calcite-color-text-3)}.keynav-mode .esri-widget:focus,.keynav-mode .esri-widget :focus{z-index:1;outline-offset:2px;outline:2px solid #adadad}.esri-widget__loader-animation{border:.15em solid #adadad4d;border-top-color:var(--calcite-color-border-input);border-radius:100%;width:1em;height:1em;font-size:var(--calcite-font-size-md);animation:1.25s linear infinite esri-rotate;display:block;transform:translateZ(0)}:dir(rtl) .esri-widget__table th{text-align:right;border-left:3px solid #0000000d;border-right:none}:dir(rtl) .esri-select{background-position:0}:dir(rtl) .esri-menu__list-item{border-left:none;border-right:3px solid #0000}:dir(rtl) .esri-menu__list-item [class^=esri-icon-],:dir(rtl) .esri-menu__list-item [class*=" esri-icon-"]{padding-left:2px;padding-right:0}:dir(rtl) .esri-menu__list-item--active{border-right-color:var(--calcite-color-brand)}.esri-icon-font-fallback-text{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.esri-rotating{animation:1.25s linear infinite esri-rotate;transform:translateZ(0)}.esri-clearfix:before,.esri-clearfix:after{content:" ";display:table}.esri-clearfix:after{clear:both}.esri-interactive{cursor:pointer}.esri-hidden{display:none!important}.esri-invisible{visibility:hidden!important}.esri-offscreen{position:absolute;top:-999em;left:-999em}.esri-match-height{flex-direction:column;flex:auto;display:flex;overflow:hidden}:host{--arcgis-internal-legend-heading-margin: 0 0 var(--calcite-space-xs);--arcgis-internal-legend-layer-padding: var(--calcite-space-md);--arcgis-internal-legend-layer-gap: var(--calcite-space-xl);--arcgis-internal-legend-layer-element-gap: var(--calcite-space-md);overflow:auto;width:var(--arcgis-internal-legend-width, 300px)}.root{overflow-y:var(--arcgis-internal-panel-overflow, auto)}:host([card-style-layout="side-by-side"]){--arcgis-internal-legend-width: auto}`, b = w(h);
 class x extends p {
   constructor() {
-    super(...arguments), this.messages = w({}), this.viewModel = b(this), this._isCardStyle = !1, this.view = this.viewModel.view, this.icon = "legend", this.activeLayerInfos = this.viewModel.activeLayerInfos, this.basemapLegendVisible = this.viewModel.basemapLegendVisible, this.headingLevel = 3, this.hideLayersNotInCurrentView = this.viewModel.hideLayersNotInCurrentView, this.respectLayerDefinitionExpression = this.viewModel.respectLayerDefinitionExpression, this.layerInfos = this.viewModel.layerInfos, this.loading = this.viewModel.loading, this.legendStyle = "classic", this.autoDestroyDisabled = !1, this.label = this.messages?.componentLabel, this.state = this.viewModel.state, this.arcgisPropertyChange = m()("state"), this.arcgisReady = f();
+    super(...arguments), this.messages = _({}), this.viewModel = b(this), this._isCardStyle = !1, this.view = this.viewModel.view, this.icon = "legend", this.activeLayerInfos = this.viewModel.activeLayerInfos, this.basemapLegendVisible = this.viewModel.basemapLegendVisible, this.headingLevel = 3, this.hideLayersNotInCurrentView = this.viewModel.hideLayersNotInCurrentView, this.respectLayerDefinitionExpression = this.viewModel.respectLayerDefinitionExpression, this.layerInfos = this.viewModel.layerInfos, this.loading = this.viewModel.loading, this.legendStyle = "classic", this.autoDestroyDisabled = !1, this.label = this.messages?.componentLabel, this.state = this.viewModel.state, this.arcgisPropertyChange = m()("state"), this.arcgisReady = f();
   }
   static {
     this.properties = { _isCardStyle: 16, view: 0, referenceElement: 1, icon: 1, activeLayerInfos: 0, basemapLegendVisible: 5, headingLevel: 9, hideLayersNotInCurrentView: 5, respectLayerDefinitionExpression: 5, ignoreLayerVisibility: 5, layerInfos: 0, loading: 39, cardStyleLayout: 1, legendStyle: 1, autoDestroyDisabled: 5, messageOverrides: 0, label: 1, state: 32 };

package/dist/components/arcgis-legend-card-color-ramp/customElement.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { css as y, html as s } from "lit";
 import { LitElement as v, safeClassMap as $, safeStyleMap as u } from "@arcgis/lumina";
 import { classes as L } from "@arcgis/toolkit/dom";
 import { r as b } from "../../chunks/svgUtils.js";
-import { a as x } from "../../chunks/utils3.js";
+import { a as x } from "../../chunks/utils2.js";
 const w = y`:host{display:flex}.layer-row{display:flex;flex:1}.color-ramp-container{justify-content:center}.symbol-container{display:flex;flex-direction:column}.interval-separators-container{text-align:center}.interval-separator{font-size:.5em}.ramp-label{margin:0 .5em;white-space:nowrap;height:25px;line-height:var(--calcite-font-line-height-fixed-xl)}`, R = 25, E = 25, _ = 100;
 class S extends v {
   constructor() {

package/dist/components/arcgis-legend-card-element/customElement.js CHANGED Viewed

@@ -1,14 +1,14 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { c as E } from "../../chunks/runtime.js";
+import { c as x } from "../../chunks/runtime.js";
 import { css as k, html as t } from "lit";
 import y from "@arcgis/core/Color.js";
-import { LitElement as L, safeClassMap as c, safeStyleMap as u, nothing as b } from "@arcgis/lumina";
-import { classes as r } from "@arcgis/toolkit/dom";
+import { LitElement as L, safeClassMap as n, safeStyleMap as u, nothing as b } from "@arcgis/lumina";
+import { classes as c } from "@arcgis/toolkit/dom";
 import { H as w } from "../../chunks/heading.js";
 import { g as f } from "../../chunks/globalCss.js";
 import { a as _, g as v } from "../../chunks/titleUtils.js";
-import { s as $, i as z, g as x } from "../../chunks/utils3.js";
-const C = k`.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)}.section{word-break:break-word;word-wrap:break-word;padding:var(--calcite-space-sm) var(--calcite-space-md);min-width:250px;max-width:500px;height:100%;height:-moz-available;height:-webkit-fill-available;height:fill-available;overflow:auto;font-size:var(--calcite-font-size-sm)}.carousel-title-container{margin-bottom:var(--calcite-space-sm)}.carousel-title{margin:0}.section-title{font-weight:var(--calcite-font-weight-regular)}.layer-caption{padding:var(--calcite-space-2xs) 0;margin:0;font-weight:var(--calcite-font-weight-regular)}.imagery-layer-stretched-image{display:block;margin-bottom:-2px}.image-label{padding-inline-start:var(--calcite-space-xs)}.label-element{margin:.1em;padding:.5em 1em;min-width:2em;min-height:1em;text-align:center;display:flex;align-items:center;justify-content:center;flex:1}.layer-row{display:flex;align-items:center}.symbol{display:block;margin:auto}.pie-chart-ramp-preview{display:flex;justify-content:center}.relationship-container{display:flex;flex-direction:column}.relationship-container .layer-row{padding-bottom:.5em}.relationship-container .layer-row:last-child{padding-bottom:0}.container{display:flex;gap:var(--calcite-space-sm);flex-wrap:wrap}.background-styles-container{display:flex;flex-wrap:wrap}:host([stacked]) .container{display:table}:host([stacked]) .symbol-row{display:table-row;width:100%}:host([stacked]) .symbol-row:not(:last-child) .label-cell,:host([stacked]) .symbol-row:not(:last-child) .symbol-cell{padding-bottom:var(--calcite-space-xs)}:host([stacked]) .label-cell{display:table-cell;vertical-align:middle}:host([stacked]) .symbol-cell{display:table-cell;vertical-align:middle;text-align:center}:host([stacked]) .symbol-cell div{display:flex;align-items:center;justify-content:center}`;
+import { s as $, i as C, g as E } from "../../chunks/utils2.js";
+const z = k`.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)}.section{word-break:break-word;word-wrap:break-word;padding:var(--calcite-space-sm) var(--calcite-space-md);min-width:250px;max-width:500px;overflow:auto;font-size:var(--calcite-font-size-sm)}.carousel-title-container{margin-bottom:var(--calcite-space-sm)}.carousel-title{margin:0}.section-title{font-weight:var(--calcite-font-weight-regular)}.layer-caption{padding:var(--calcite-space-2xs) 0;margin:0;font-weight:var(--calcite-font-weight-regular)}.imagery-layer-stretched-image{display:block;margin-bottom:-2px}.image-label{padding-inline-start:var(--calcite-space-xs)}.label-element{margin:.1em;padding:.5em 1em;min-width:2em;min-height:1em;text-align:center;display:flex;align-items:center;justify-content:center;flex:1}.layer-row{display:flex;align-items:center}.symbol{display:block;margin:auto}.pie-chart-ramp-preview{display:flex;justify-content:center}.relationship-container{display:flex;flex-direction:column}.relationship-container .layer-row{padding-bottom:.5em}.relationship-container .layer-row:last-child{padding-bottom:0}.container{display:flex;gap:var(--calcite-space-sm);flex-wrap:wrap}.background-styles-container{display:flex;flex-wrap:wrap}:host([stacked]) .container{display:table}:host([stacked]) .symbol-row{display:table-row;width:100%}:host([stacked]) .symbol-row:not(:last-child) .label-cell,:host([stacked]) .symbol-row:not(:last-child) .symbol-cell{padding-bottom:var(--calcite-space-xs)}:host([stacked]) .label-cell{display:table-cell;vertical-align:middle}:host([stacked]) .symbol-cell{display:table-cell;vertical-align:middle;text-align:center}:host([stacked]) .symbol-cell div{display:flex;align-items:center;justify-content:center}`;
 function F(m) {
   return m ? m.r * 0.299 + m.g * 0.587 + m.b * 0.114 >= 127 : void 0;
 }
@@ -20,24 +20,24 @@ class S extends L {
     this.properties = { cssEffectFilter: 1, stacked: 7, activeLayerInfo: 0, headingLevel: 9, layer: 0, legendElement: 0, messages: 0 };
   }
   static {
-    this.styles = C;
+    this.styles = z;
   }
   _getBackgroundStyles(e) {
-    const a = e.symbol, s = a.color, n = !!s?.a, l = "outline" in a ? a.outline : null, i = !!l?.color?.a, o = n && s ? new y([s.r, s.g, s.b, s.a * this.layer.opacity]) : new y([255, 255, 255, 0]), d = i && l.color ? new y([l.color.r, l.color.g, l.color.b, l.color.a * this.layer.opacity]) : new y([255, 255, 255, 0]), g = F(e.symbol.color) ?? !0, h = g ? "black" : "white", p = g ? "rgba(255, 255, 255, .6)" : "rgba(0, 0, 0, .6)";
+    const i = e.symbol, s = i.color, r = !!s?.a, l = "outline" in i ? i.outline : null, a = !!l?.color?.a, o = r && s ? new y([s.r, s.g, s.b, s.a * this.layer.opacity]) : new y([255, 255, 255, 0]), d = a && l.color ? new y([l.color.r, l.color.g, l.color.b, l.color.a * this.layer.opacity]) : new y([255, 255, 255, 0]), g = F(e.symbol.color) ?? !0, h = g ? "black" : "white", p = g ? "rgba(255, 255, 255, .6)" : "rgba(0, 0, 0, .6)";
     return {
-      background: n ? o.toCss(!0) : "none",
+      background: r ? o.toCss(!0) : "none",
       color: h,
       textShadow: `-1px -1px 0 ${p},
                   1px -1px 0 ${p},
                   -1px 1px 0 ${p},
                   1px 1px 0 ${p}`,
-      border: i ? `1px solid ${d.toCss(!0)}` : "none",
+      border: a ? `1px solid ${d.toCss(!0)}` : "none",
       filter: this.cssEffectFilter ?? ""
     };
   }
   render() {
-    const e = this._renderLegendElement(), a = _(this.legendElement, this.messages), s = this.stacked ? t`<div class="carousel-title-container">${w({ class: r("carousel-title", f.heading), level: this.headingLevel, children: this.activeLayerInfo.title })}${a ? t`<p class="layer-caption">${a}</p>` : null}</div>` : a ? w({ class: r("section-title", f.heading), level: this.headingLevel, children: a }) : null;
-    return t`<section class="section" role=tabpanel tabindex=0>${s}${e}</section>`;
+    const e = this._renderLegendElement(), i = this.activeLayerInfo.legendElements.includes(this.legendElement), s = _(this.legendElement, this.messages), r = this.stacked && i ? t`<div class="carousel-title-container">${w({ class: c("carousel-title", f.heading), level: this.headingLevel, children: this.activeLayerInfo.title })}${s ? t`<p class="layer-caption">${s}</p>` : null}</div>` : s ? w({ class: c("section-title", f.heading), level: this.headingLevel, children: s }) : null;
+    return t`<section class="section" role=tabpanel tabindex=0>${r}${e}</section>`;
   }
   _renderLegendElement() {
     switch (this.legendElement.type) {
@@ -65,24 +65,24 @@ class S extends L {
     }
   }
   _renderSymbolTable(e) {
-    const a = e.infos.map((i) => this._renderElementInfo(i, e.legendType)).filter(Boolean);
-    if (!a.length)
+    const i = e.infos.map((a) => this._renderElementInfo(a, e.legendType)).filter(Boolean);
+    if (!i.length)
       return null;
-    const s = e.infos.some((i) => "symbol" in i && i.symbol?.type.includes("simple-fill")), l = this.activeLayerInfo.legendElements.some(({ type: i }) => i === "relationship-ramp") ? "relationship-container" : s ? "background-styles-container" : "container";
-    return t`<div class=${c(l)}>${a}</div>`;
+    const s = e.infos.some((a) => "symbol" in a && a.symbol?.type.includes("simple-fill")), l = this.activeLayerInfo.legendElements.some(({ type: a }) => a === "relationship-ramp") ? "relationship-container" : s ? "background-styles-container" : "container";
+    return t`<div class=${n(l)}>${i}</div>`;
   }
-  _renderElementInfo(e, a) {
-    const { layer: s } = this, n = "label" in e ? e.label : null;
+  _renderElementInfo(e, i) {
+    const { layer: s } = this, r = "label" in e ? e.label : null;
     if ("type" in e && e.type)
-      return t`<arcgis-legend-card-element .activeLayerInfo=${this.activeLayerInfo} .cssEffectFilter=${this.cssEffectFilter} .stacked=${this.stacked} .headingLevel=${this.headingLevel} .layer=${s} .legendElement=${e} .messages=${this.messages}></arcgis-legend-card-element>`;
+      return t`<arcgis-legend-card-element .activeLayerInfo=${this.activeLayerInfo} .cssEffectFilter=${this.cssEffectFilter} .headingLevel=${this.headingLevel} .layer=${s} .legendElement=${e} .messages=${this.messages} .stacked=${this.stacked}></arcgis-legend-card-element>`;
     if (!("preview" in e && e.preview) && !("src" in e && e.src))
       return null;
-    const l = z(s, a), i = v(this.messages, n, !1) || "";
+    const l = C(s, i), a = v(this.messages, r, !1) || "";
     if ("src" in e && e.src) {
       const o = {
         "symbol-cell": this.stacked
       };
-      return t`<div class=${c(r("layer-row", { "symbol-row": this.stacked }))}><div class=${c(r(o))}>${this._renderImage(e, s, l)}</div><div class=${c(r("image-label", { "label-cell": this.stacked }))}>${i}</div></div>`;
+      return t`<div class=${n(c("layer-row", { "symbol-row": this.stacked }))}><div class=${n(c(o))}>${this._renderImage(e, s, l)}</div><div class=${n(c("image-label", { "label-cell": this.stacked }))}>${a}</div></div>`;
     }
     if ("symbol" in e && e.preview) {
       if (!e.symbol?.type.includes("simple-fill")) {
@@ -91,23 +91,23 @@ class S extends L {
         const o = {
           "symbol-cell": this.stacked
         }, { preview: d } = e, g = "previewAriaLabel" in e ? e.previewAriaLabel : null, h = "label" in e ? v(this.messages, e.label, !1) : null;
-        return $(d, x(this.messages, g || h)), t`<div class=${c(r("layer-row", { "symbol-row": this.stacked }))}><div class=${c(r(o))}>${d}</div><div class=${c(r("image-label", { "label-cell": this.stacked }))}>${i}</div></div>`;
+        return $(d, E(this.messages, g || h)), t`<div class=${n(c("layer-row", { "symbol-row": this.stacked }))}><div class=${n(c(o))}>${d}</div><div class=${n(c("image-label", { "label-cell": this.stacked }))}>${a}</div></div>`;
       }
-      return t`<div class="layer-row"><div class="label-element" style=${u(this._getBackgroundStyles(e))}>${i}</div></div>`;
+      return t`<div class="layer-row"><div class="label-element" style=${u(this._getBackgroundStyles(e))}>${a}</div></div>`;
     }
     return null;
   }
-  _renderImage(e, a, s) {
-    const { previewAriaLabel: n, src: l, opacity: i } = e, o = v(this.messages, e.label, !1), d = {
+  _renderImage(e, i, s) {
+    const { previewAriaLabel: r, src: l, opacity: a } = e, o = v(this.messages, e.label, !1), d = {
       "imagery-layer-stretched-image": s,
       symbol: !s
     }, g = {
-      opacity: `${i ?? a.opacity}`
-    }, h = x(this.messages, n || o);
-    return t`<img alt=${h ?? b} .ariaLabel=${h} class=${c(r(d))} height=${e.height ?? void 0 ?? b} src=${l ?? b} style=${u(g)} width=${e.width ?? void 0 ?? b}>`;
+      opacity: `${a ?? i.opacity}`
+    }, h = E(this.messages, r || o);
+    return t`<img alt=${h ?? b} .ariaLabel=${h} class=${n(c(d))} height=${e.height ?? void 0 ?? b} src=${l ?? b} style=${u(g)} width=${e.width ?? void 0 ?? b}>`;
   }
 }
-E("arcgis-legend-card-element", S);
+x("arcgis-legend-card-element", S);
 export {
   S as ArcgisLegendCardElement
 };

package/dist/components/arcgis-legend-card-size-ramp/customElement.js CHANGED Viewed

@@ -2,7 +2,7 @@
 import { c as C } from "../../chunks/runtime.js";
 import { css as P, html as X } from "lit";
 import { LitElement as j, safeStyleMap as v, safeClassMap as Y } from "@arcgis/lumina";
-import { s as k, g as I, p as R } from "../../chunks/utils3.js";
+import { s as k, g as I, p as R } from "../../chunks/utils2.js";
 const A = P`.size-ramp-container{display:flex;align-items:center;justify-content:center}.size-ramp-vertical-container{display:flex;flex-direction:column;align-items:center;justify-content:center}.size-ramp-label{margin:0 .5em;white-space:nowrap}.size-ramp-vertical-ramp{display:flex;flex-direction:column;align-items:center}.size-ramp-ramp{display:flex;flex-direction:row-reverse;align-items:center}.size-ramp-preview{display:flex}`, M = "#ddd";
 function N(e) {
   if (!e)

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

@@ -1,13 +1,13 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 import { c as l } from "../../chunks/runtime.js";
-import { css as a, html as i } from "lit";
+import { css as a, html as s } from "lit";
 import { watch as c } from "@arcgis/core/core/reactiveUtils.js";
 import { substitute as o } from "@arcgis/core/intl.js";
 import { LitElement as d } from "@arcgis/lumina";
 import { classes as h } from "@arcgis/toolkit/dom";
 import { H as g } from "../../chunks/heading.js";
 import { g as m } from "../../chunks/globalCss.js";
-const f = a`.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}.message{padding:.5em 1em}.service-caption-text{margin:0}.service-content{display:flex;flex:1}.service-content>arcgis-legend-card-element:not(:first-child){border-left:1px solid var(--calcite-color-border-2)}.service{border-left:var(--calcite-border-width-sm) solid var(--calcite-color-border-2);display:flex;flex-direction:column;flex:1}.service-caption-container{border-bottom:1px solid var(--calcite-color-border-2);padding:var(--calcite-space-md)}`, u = 768;
+const f = a`.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{height:fit-content;max-height:100%}calcite-carousel-item{max-height:100%;min-height:0}calcite-carousel-item[selected]{flex:1;overflow:auto}.message{padding:.5em 1em}.service-caption-text{margin:0}.service-content{display:flex;flex:1}.service-content>arcgis-legend-card-element:not(:first-child){border-left:1px solid var(--calcite-color-border-2)}.service{border-left:var(--calcite-border-width-sm) solid var(--calcite-color-border-2);display:flex;flex-direction:column;flex:1}.service-caption-container{border-bottom:1px solid var(--calcite-color-border-2);padding:var(--calcite-space-md)}`, u = 768;
 class v extends d {
   constructor() {
     super(...arguments), this.stacked = !1, this.headingLevel = 3, this.layout = "auto", this.type = "card";
@@ -26,23 +26,23 @@ class v extends d {
     ]);
   }
   render() {
-    return (this.stacked ? this._renderCarousel() : this._renderLayers()) || i`<div class="message">${this.messages.noLegend}</div>`;
+    return (this.stacked ? this._renderCarousel() : this._renderLayers()) || s`<div class="message">${this.messages.noLegend}</div>`;
   }
   _renderTitle(e) {
-    return i`<div class="service-caption-container">${g({ class: h("service-caption-text", m.heading), level: this.headingLevel, children: e })}</div>`;
+    return s`<div class="service-caption-container">${g({ class: h("service-caption-text", m.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 .paginationDisabled=${e.length < 2} .label=${this.messages.carousel ?? ""}>${e.map((s, r) => i`<calcite-carousel-item .label=${o(this.messages?.pagination?.pageText ?? "", {
+      for (const i of t)
+        this._renderSections(i, e);
+    return e?.length ? s`<calcite-carousel .paginationDisabled=${e.length < 2} .label=${this.messages.carousel ?? ""}>${e.map((i, r) => s`<calcite-carousel-item .label=${o(this.messages?.pagination?.pageText ?? "", {
       index: r + 1,
       total: e.length
-    })}>${s}</calcite-carousel-item>`)}</calcite-carousel>` : null;
+    })}>${i}</calcite-carousel-item>`)}</calcite-carousel>` : null;
   }
   _renderLayers() {
-    const t = this.activeLayerInfos?.toArray()?.map((s) => this._renderLegendForLayer(s)).filter(Boolean);
+    const t = this.activeLayerInfos?.toArray()?.map((i) => this._renderLegendForLayer(i)).filter(Boolean);
     return t?.length ? t : null;
   }
   _renderLegendForLayer(e) {
@@ -50,7 +50,7 @@ class v extends d {
       return null;
     if (e.children.length) {
       const t = e.children.toArray().map(this._renderLegendForLayer, this);
-      return i`<section class="service">${this._renderTitle(e.title)}<div class="service-content">${t}</div></section>`;
+      return s`<section class="service">${this._renderTitle(e.title)}<div class="service-content">${t}</div></section>`;
     }
     return this._renderLegendElementsForLayer(e);
   }
@@ -58,8 +58,8 @@ class v extends d {
     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="service">${this._renderTitle(e.title)}<div class="service-content">${s}</div></section>`;
+    const i = t.map((r) => s`<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 s`<section class="service">${this._renderTitle(e.title)}<div class="service-content">${i}</div></section>`;
   }
   _renderSections(e, t) {
     if (!e.ready)
@@ -67,10 +67,10 @@ class v extends d {
     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 n = 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>`;
+    const i = e.legendElements;
+    if (i?.length)
+      for (const r of i) {
+        const n = s`<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>`;
         n && t.push(n);
       }
   }

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

@@ -2,7 +2,7 @@
 import { c as r } from "../../chunks/runtime.js";
 import { css as s, html as l } from "lit";
 import { LitElement as i, safeStyleMap as c, safeClassMap as o } from "@arcgis/lumina";
-import { s as p, a as n } from "../../chunks/utils3.js";
+import { s as p, a as n } from "../../chunks/utils2.js";
 const m = s`.layer-row{display:flex}.layer-cell{padding:var(--calcite-space-2xs) 0;vertical-align:middle;word-break:break-word}.layer-cell-symbols{text-align:center}.layer-cell-info{padding-right:var(--calcite-space-sm);padding-left:var(--calcite-space-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.color-ramp{width:24px}.opacity-ramp{background-image:url(data:image/avif;base64,AAAAHGZ0eXBhdmlmAAAAAG1pZjFhdmlmbWlhZgAAANZtZXRhAAAAAAAAACFoZGxyAAAAAAAAAABwaWN0AAAAAAAAAAAAAAAAAAAAAA5waXRtAAAAAAABAAAAImlsb2MAAAAAREAAAQABAAAAAAD6AAEAAAAAAAAAHgAAACNpaW5mAAAAAAABAAAAFWluZmUCAAAAAAEAAGF2MDEAAAAAVmlwcnAAAAA4aXBjbwAAAAxhdjFDgQAMAAAAABRpc3BlAAAAAAAAAAgAAAAIAAAAEHBpeGkAAAAAAwgICAAAABZpcG1hAAAAAAAAAAEAAQOBAgMAAAAmbWRhdBIACggYCL/kgIaDQjIQGAAAAEBAA1LuL7oS8L0QEA==)}.ramp-labels{display:flex;flex-flow:column nowrap;justify-content:space-between}.ramp-label{position:relative;padding:0 var(--calcite-space-sm);line-height:var(--calcite-font-size-sm);white-space:nowrap;font-size:var(--calcite-font-size-sm)}.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:""}.ramp-label:first-child{margin-top:calc(var(--calcite-font-size-sm) / 3 * -1)}.ramp-label:last-child{bottom:calc(var(--calcite-font-size-sm) * .25 * -1)}.layer-caption{display:table-caption;padding:var(--calcite-space-sm) 0}:dir(rtl) .ramp-label:before{right:auto;left:100%;border-width:3px 0 3px 4px;border-color:transparent transparent transparent var(--calcite-color-text-1)}`;
 class d extends i {
   constructor() {

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

@@ -1,20 +1,23 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { c as w } from "../../chunks/runtime.js";
-import { css as f, html as s } from "lit";
-import { LitElement as u, safeClassMap as m, nothing as o, safeStyleMap as $ } from "@arcgis/lumina";
+import { c as u } from "../../chunks/runtime.js";
+import { css as w, html as s } from "lit";
+import { LitElement as $, safeClassMap as m, nothing as o, safeStyleMap as f } from "@arcgis/lumina";
 import { classes as y } from "@arcgis/toolkit/dom";
 import { a as E, g as p } from "../../chunks/titleUtils.js";
-import { s as h, i as L, g as b } from "../../chunks/utils3.js";
-const x = f`:host{contain:content}.layer-body:has(>arcgis-legend-classic-element){display:flex;flex-direction:column;gap:calc(var(--arcgis-internal-legend-layer-gap) / 2)}.layer-body arcgis-legend-classic-element{margin-inline-start:var(--arcgis-internal-legend-layer-padding)}.layer-table{display:table;width:100%}.layer-caption{display:table-caption;word-break:break-word;color:var(--calcite-color-text-1);font-size:var(--calcite-font-size-sm);font-weight:var(--calcite-font-weight-regular);padding-bottom:var(--calcite-space-sm)}.layer-row{display:table-row}.layer-body:has(>.layer-row+.layer-row)>.layer-row .layer-cell{padding-block:var(--calcite-space-2xs)}.layer-cell{vertical-align:middle;word-break:break-word;display:table-cell}.layer-cell-info{padding-inline-start:var(--calcite-space-xs);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.layer-cell-inline-title{font-weight:var(--calcite-font-weight-medium);font-size:var(--calcite-font-size)}.imagery-layer-stretched-image{display:block;margin-bottom:-2px}.imagery-layer-info-stretched{padding:0 2px;vertical-align:top}.layer-cell-symbols{text-align:center}.symbol{display:flex;justify-content:center}`;
-class z extends u {
+import { s as h, i as L, g as b } from "../../chunks/utils2.js";
+const x = w`:host{contain:content}.layer-body:has(>arcgis-legend-classic-element){display:flex;flex-direction:column;gap:calc(var(--arcgis-internal-legend-layer-gap) / 2)}.layer-table{display:table;width:100%}.layer-caption{display:table-caption;word-break:break-word;color:var(--calcite-color-text-1);font-size:var(--calcite-font-size-sm);font-weight:var(--calcite-font-weight-regular);padding-bottom:var(--calcite-space-sm)}.layer-row{display:table-row}.layer-body:has(>.layer-row+.layer-row)>.layer-row .layer-cell{padding-block:var(--calcite-space-2xs)}.layer-cell{vertical-align:middle;word-break:break-word;display:table-cell}.layer-cell-info{padding-inline-start:var(--calcite-space-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.imagery-layer-stretched-image{display:block;margin-bottom:-2px}.imagery-layer-info-stretched{padding:0 2px;vertical-align:top}.layer-cell-symbols{text-align:center}.symbol{display:flex;justify-content:center}@supports (grid-template-columns: subgrid){:host([align-symbols]){contain:none}:host([align-symbols]),:host([align-symbols]) :is(.layer-table,.layer-body,.layer-row){display:grid;grid-template-columns:subgrid;grid-column:1 / -1;column-gap:0;min-inline-size:0}:host([align-symbols]) .layer-row{align-items:center}:host([align-symbols]) .layer-caption{display:block;grid-column:1 / -1}:host([align-symbols]) .layer-cell{display:block;min-inline-size:0}:host([align-symbols]) .layer-cell-info{overflow-wrap:anywhere}:host([align-symbols]) .symbol{margin-inline:auto}:host([align-symbols]) div.symbol{inline-size:max-content}}`;
+class z extends $ {
+  constructor() {
+    super(...arguments), this.alignSymbols = !1;
+  }
   static {
-    this.properties = { cssEffectFilter: 1, layer: 0, inlineLayerTitle: 1, legendElement: 0, messages: 0 };
+    this.properties = { cssEffectFilter: 1, layer: 0, inlineLayerTitle: 1, alignSymbols: 7, legendElement: 0, messages: 0 };
   }
   static {
     this.styles = x;
   }
   render() {
-    const e = this._renderLegendElement(), i = E(this.legendElement, this.messages), a = i ? s`<div class="layer-caption">${i}</div>` : null;
+    const e = this._renderLegendElement(), l = E(this.legendElement, this.messages), a = l ? s`<div class="layer-caption">${l}</div>` : null;
     return s`<section class="layer-table">${a}${e}</section>`;
   }
   _renderLegendElement() {
@@ -43,44 +46,44 @@ class z extends u {
     }
   }
   _renderSymbolTable(e) {
-    const i = this.inlineLayerTitle && e.infos.length === 1 ? this.inlineLayerTitle : void 0, a = e.infos.map((l) => this._renderElementInfo(l, e.legendType, i)).filter(Boolean);
+    const l = this.inlineLayerTitle && e.infos.length === 1 ? this.inlineLayerTitle : void 0, a = e.infos.map((i) => this._renderElementInfo(i, e.legendType, l)).filter(Boolean);
     return a.length ? s`<div class="layer-body">${a}</div>` : null;
   }
-  _renderElementInfo(e, i, a) {
-    const { layer: l } = this, t = "label" in e ? e.label : null;
+  _renderElementInfo(e, l, a) {
+    const { layer: i } = this, t = "label" in e ? e.label : null;
     if ("type" in e && e.type)
-      return e ? s`<arcgis-legend-classic-element .cssEffectFilter=${this.cssEffectFilter} .layer=${l} .legendElement=${e} .messages=${this.messages}></arcgis-legend-classic-element>` : null;
+      return e ? s`<arcgis-legend-classic-element .cssEffectFilter=${this.cssEffectFilter} .layer=${i} .legendElement=${e} .messages=${this.messages}></arcgis-legend-classic-element>` : null;
     if (!("preview" in e && e.preview) && !("src" in e && e.src))
       return null;
-    const r = L(l, i), d = {
+    const r = L(i, l), g = {
       "imagery-layer-info-stretched": r
-    }, g = {
+    }, d = {
       "imagery-layer-info-stretched": r
     }, n = p(this.messages, t, !1) || "", c = !n && a ? a : "", v = {
       "layer-cell-inline-title": !!c,
-      ...d
+      ...g
     };
-    return s`<div class="layer-row"><div class=${m(y("layer-cell", "layer-cell-symbols", g))}>${this._renderPreview(e, r)}</div><div class=${m(y("layer-cell", "layer-cell-info", v))}>${n || c}</div></div>`;
+    return s`<div class="layer-row"><div class=${m(y("layer-cell", "layer-cell-symbols", d))}>${this._renderPreview(e, r)}</div><div class=${m(y("layer-cell", "layer-cell-info", v))}>${n || c}</div></div>`;
   }
-  _renderPreview(e, i) {
+  _renderPreview(e, l) {
     const { layer: a } = this;
     if ("preview" in e && e.preview) {
-      const { preview: l } = e, t = "previewAriaLabel" in e ? e.previewAriaLabel : null, r = "label" in e ? p(this.messages, e.label, !1) : null;
-      return h(l, b(this.messages, t || r)), s`<div class="symbol">${l}</div>`;
+      const { preview: i } = e, t = "previewAriaLabel" in e ? e.previewAriaLabel : null, r = "label" in e ? p(this.messages, e.label, !1) : null;
+      return h(i, b(this.messages, t || r)), s`<div class="symbol">${i}</div>`;
     }
-    return "src" in e && e.src ? this._renderImage(e, a, i) : null;
+    return "src" in e && e.src ? this._renderImage(e, a, l) : null;
   }
-  _renderImage(e, i, a) {
-    const { previewAriaLabel: l, src: t, opacity: r } = e, d = p(this.messages, e.label, !1), g = {
+  _renderImage(e, l, a) {
+    const { previewAriaLabel: i, src: t, opacity: r } = e, g = p(this.messages, e.label, !1), d = {
       "imagery-layer-stretched-image": a,
       symbol: !a
     }, n = {
-      opacity: `${r ?? i.opacity}`
-    }, c = b(this.messages, l || d);
-    return s`<img alt=${c ?? o} .ariaLabel=${c} class=${m(y(g))} height=${e.height ?? void 0 ?? o} src=${t ?? o} style=${$(n)} width=${e.width ?? void 0 ?? o}>`;
+      opacity: `${r ?? l.opacity}`
+    }, c = b(this.messages, i || g);
+    return s`<img alt=${c ?? o} .ariaLabel=${c} class=${m(y(d))} height=${e.height ?? void 0 ?? o} src=${t ?? o} style=${f(n)} width=${e.width ?? void 0 ?? o}>`;
   }
 }
-w("arcgis-legend-classic-element", z);
+u("arcgis-legend-classic-element", z);
 export {
   z as ArcgisLegendClassicElement
 };

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

@@ -4,7 +4,7 @@ import { css as n, html as i } from "lit";
 import { LitElement as m, safeClassMap as r } from "@arcgis/lumina";
 import { classes as l } from "@arcgis/toolkit/dom";
 import { g as o } from "../../chunks/titleUtils.js";
-import { s as c, g as p } from "../../chunks/utils3.js";
+import { s as c, g as p } from "../../chunks/utils2.js";
 const d = n`.size-ramp-container{display:table}.size-ramp-row{display:table-row}.size-ramp-row:not(:last-child) .size-ramp-cell,.size-ramp-row:not(:last-child) .size-ramp-label{padding-bottom:var(--calcite-space-xs)}.size-ramp-cell{min-width:100px;vertical-align:middle;word-break:break-word;display:table-cell}.size-ramp-label{padding-inline-start:var(--calcite-space-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.size-ramp-symbol-container{min-width:10px;text-align:center}.size-ramp-symbol{display:flex;justify-content:center}`;
 class g extends m {
   constructor() {

package/dist/components/arcgis-legend-classic-view/customElement.js CHANGED Viewed

@@ -1,28 +1,28 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { c as m } from "../../chunks/runtime.js";
-import { css as y, html as s } from "lit";
-import { LitElement as p, safeClassMap as d } from "@arcgis/lumina";
-import { classes as g } from "@arcgis/toolkit/dom";
-import { H as f } from "../../chunks/heading.js";
-import { g as v } from "../../chunks/titleUtils.js";
-const u = y`.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:block;padding:var(--arcgis-internal-padding)}.layers{display:flex;flex-direction:column;gap:var(--arcgis-internal-legend-layer-gap)}.layers>.layer{position:relative}.layers>.layer:not(:last-child):after{content:"";position:absolute;left:0;right:0;bottom:calc(var(--arcgis-internal-legend-layer-gap) / -2);border-bottom:1px solid var(--calcite-color-border-2)}.layer>.esri-widget__heading{color:var(--calcite-color-text-1);margin:var(--arcgis-internal-legend-heading-margin);font-size:var(--calcite-font-size-md);font-weight:var(--calcite-font-weight-semibold)}.layer{word-wrap:break-word}.layer-elements{display:flex;flex-direction:column;gap:var(--arcgis-internal-legend-layer-element-gap);overflow:auto}.layer-children{display:flex;flex-direction:column;gap:var(--arcgis-internal-legend-layer-gap)}.layer-children>.layer{margin-inline-start:var(--arcgis-internal-legend-layer-padding);position:relative}.layer-children>.layer:not(:last-child):after{content:"";position:absolute;left:0;right:0;bottom:calc(var(--arcgis-internal-legend-layer-gap) / -2);border-bottom:1px solid var(--calcite-color-border-2)}.layer-children.layer-children-compact>.layer.layer-child-inline-title{margin-inline-start:0}.layer-children.layer-children-compact>.layer:not(:last-child):after{content:none}.layer-children.layer-children-compact{gap:var(--calcite-space-2xs)}.layer-child{padding:0}.layer>.esri-widget__heading.layer-child-title{color:var(--calcite-color-text-1);font-weight:var(--calcite-font-weight-medium);font-size:var(--calcite-font-size)}`;
-function w(r) {
-  return "type" in r && !!r.type;
+import { c as p } from "../../chunks/runtime.js";
+import { css as f, html as c } from "lit";
+import { LitElement as v, safeClassMap as g } from "@arcgis/lumina";
+import { classes as h } from "@arcgis/toolkit/dom";
+import { H as u } from "../../chunks/heading.js";
+import { g as w } from "../../chunks/titleUtils.js";
+const b = f`.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:block;padding:var(--arcgis-internal-padding, var(--calcite-spacing-md) var(--calcite-spacing-lg))}.layers{display:flex;flex-direction:column;gap:var(--arcgis-internal-legend-layer-gap)}.layers>.layer{position:relative}.layers>.layer:not(:last-child):after{content:"";position:absolute;left:0;right:0;bottom:calc(var(--arcgis-internal-legend-layer-gap) / -2);border-bottom:1px solid var(--calcite-color-border-2)}.layer>.esri-widget__heading{color:var(--calcite-color-text-1);margin:var(--arcgis-internal-legend-heading-margin);font-size:var(--calcite-font-size-md);font-weight:var(--calcite-font-weight-semibold)}.layer{word-wrap:break-word}.layer-elements{display:flex;flex-direction:column;gap:var(--arcgis-internal-legend-layer-element-gap);overflow:auto}.layer-children{display:flex;flex-direction:column;gap:var(--arcgis-internal-legend-layer-gap)}.layer-children>.layer{margin-inline-start:var(--arcgis-internal-legend-layer-padding);position:relative}.layer-children>.layer:not(:last-child):after{content:"";position:absolute;left:0;right:0;bottom:calc(var(--arcgis-internal-legend-layer-gap) / -2);border-bottom:1px solid var(--calcite-color-border-2)}.layer-children.layer-children-compact>.layer.layer-child-inline-title{margin-inline-start:0}.layer-children.layer-children-compact>.layer:not(:last-child):after{content:none}.layer-children.layer-children-compact{gap:var(--calcite-space-2xs)}@supports (grid-template-columns: subgrid){.layer-children.layer-children-aligned{display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:0}.layer-children-aligned>.layer,.layer-children-aligned>.layer>.layer-elements{display:grid;grid-template-columns:subgrid;grid-column:1 / -1;row-gap:0;min-inline-size:0}.layer-children-aligned>.layer>.layer-elements{overflow:visible}}.layer-child{padding:0}.layer>.esri-widget__heading.layer-child-title{color:var(--calcite-color-text-1);font-weight:var(--calcite-font-weight-medium);font-size:var(--calcite-font-size)}`;
+function _(n) {
+  return "type" in n && !!n.type;
 }
-function h(r, e) {
-  const i = r.legendElements?.filter(Boolean);
-  if (!r.parent || !r.title || i?.length !== 1)
+function m(n, e) {
+  const r = n.legendElements?.filter(Boolean);
+  if (!n.parent || !n.title || r?.length !== 1)
     return;
-  const [t] = i;
-  if (t.type !== "symbol-table" || t.infos.length !== 1)
+  const [i] = r;
+  if (i.type !== "symbol-table" || i.infos.length !== 1)
     return;
-  const [l] = t.infos;
-  if (!l || w(l))
+  const [l] = i.infos;
+  if (!l || _(l))
     return;
-  const n = "preview" in l && !!l.preview || "src" in l && !!l.src, a = "label" in l ? v(e, l.label, !1) : "";
-  return n && !a ? r.title ?? void 0 : void 0;
+  const t = "preview" in l && !!l.preview || "src" in l && !!l.src, a = "label" in l ? w(e, l.label, !1) : "";
+  return t && !a ? n.title ?? void 0 : void 0;
 }
-class _ extends p {
+class x extends v {
   constructor() {
     super(...arguments), this.headingLevel = 3, this.type = "classic";
   }
@@ -30,40 +30,41 @@ class _ extends p {
     this.properties = { activeLayerInfos: 0, headingLevel: 9, type: 32, messages: 0 };
   }
   static {
-    this.styles = u;
+    this.styles = b;
   }
   render() {
-    const i = this.activeLayerInfos?.toArray().map((t) => this._renderLegendForLayer(t)).filter(Boolean);
-    return i?.length ? s`<section class="layers">${i}</section>` : s`<div class="no-legend">${this.messages.noLegend}</div>`;
+    const r = this.activeLayerInfos?.toArray().map((i) => this._renderLegendForLayer(i)).filter(Boolean);
+    return r?.length ? c`<section class="layers">${r}</section>` : c`<div class="no-legend">${this.messages.noLegend}</div>`;
   }
-  _renderLegendForLayer(e) {
+  _renderLegendForLayer(e, r = !1) {
     if (!e.ready)
       return null;
-    const i = h(e, this.messages), t = e.title && !i ? f({
+    const i = m(e, this.messages), l = e.title && !i ? u({
       level: this.headingLevel,
       class: e.parent ? "layer-child-title" : void 0,
       children: e.title
     }) : null;
     if (e.children.length) {
-      const l = e.children.toArray(), n = l.length > 0 && l.every((o) => !!h(o, this.messages)), a = l.map((o) => this._renderLegendForLayer(o)), c = g("layer-children", {
-        "layer-children-compact": n
+      const t = e.children.toArray(), a = t.length > 0 && t.every((s) => !!m(s, this.messages)), o = a && t.every((s) => !s.children.length), d = t.map((s) => this._renderLegendForLayer(s, o)), y = h("layer-children", {
+        "layer-children-compact": a,
+        "layer-children-aligned": o
       });
-      return s`<section class="layer">${t}<div class=${d(c)}>${a}</div></section>`;
+      return c`<section class="layer">${l}<div class=${g(y)}>${d}</div></section>`;
     }
-    return this._renderLegendElementsForLayer(e, t, i);
+    return this._renderLegendElementsForLayer(e, l, i, r);
   }
-  _renderLegendElementsForLayer(e, i, t) {
-    const l = e.legendElements?.filter(Boolean);
-    if (!l?.length)
+  _renderLegendElementsForLayer(e, r, i, l = !1) {
+    const t = e.legendElements?.filter(Boolean);
+    if (!t?.length)
       return null;
-    const n = l.map((c) => s`<arcgis-legend-classic-element .cssEffectFilter=${e.cssEffectFilter ?? void 0} .inlineLayerTitle=${t} .layer=${e.layer} .legendElement=${c} .messages=${this.messages}></arcgis-legend-classic-element>`), a = {
+    const a = t.map((d) => c`<arcgis-legend-classic-element .cssEffectFilter=${e.cssEffectFilter ?? void 0} .inlineLayerTitle=${i} .alignSymbols=${l} .layer=${e.layer} .legendElement=${d} .messages=${this.messages}></arcgis-legend-classic-element>`), o = {
       "layer-child": !!e.parent,
-      "layer-child-inline-title": !!t
+      "layer-child-inline-title": !!i
     };
-    return s`<section class=${d(g("layer", a))}>${i}<div class="layer-elements">${n}</div></section>`;
+    return c`<section class=${g(h("layer", o))}>${r}<div class="layer-elements">${a}</div></section>`;
   }
 }
-m("arcgis-legend-classic-view", _);
+p("arcgis-legend-classic-view", x);
 export {
-  _ as LegendClassicView
+  x as LegendClassicView
 };