@arcgis/map-components 5.1.0-next.11 → 5.1.0-next.111

package/dist/components/arcgis-sketch-tooltip-controls/customElement.d.ts

@@ -0,0 +1,91 @@
+/// <reference path="../../index.d.ts" />
+import type SketchOptions from "@arcgis/core/views/interactive/sketch/SketchOptions.js";
+import type { TooltipDirectionMode } from "@arcgis/core/views/interactive/tooltip/types.js";
+import type { PublicLitElement as LitElement } from "@arcgis/lumina";
+import type { T9nMeta } from "@arcgis/lumina/controllers";
+
+export abstract class ArcgisSketchTooltipControls extends LitElement {
+  /**
+   * private
+   *
+   * @default false
+   */
+  get _hasContent(): boolean;
+  /**
+   * Indicates whether the direction (deflection) of the segment being drawn
+   * is measured relative to the previous segment or from the main axis of the map
+   * (usually north). See [SketchTooltipOptions](https://developers.arcgis.com/javascript/latest/references/core/views/interactive/sketch/SketchTooltipOptions/) and [SketchValueOptions](https://developers.arcgis.com/javascript/latest/references/core/views/interactive/sketch/SketchValueOptions/#directionMode).
+   */
+  accessor directionMode: TooltipDirectionMode;
+  /**
+   * Controls whether the labels toggle is shown for this component.
+   *
+   * > **Note:**  If this component is contained in another component, the parent
+   * component is responsible for setting this property based on any
+   * known limitations, including properties on the view. Specifically,
+   * as of 5.1, if the view is a 2d video or linkchart instead of a map,
+   * the parent component should set this property to `true`.
+   *
+   * @default false
+   */
+  accessor hideLabelsToggle: boolean;
+  /**
+   * Controls whether the tooltips toggle is shown for this component.
+   *
+   * @default false
+   */
+  accessor hideTooltipsToggle: boolean;
+  /** The component's default label. */
+  accessor label: string | undefined;
+  /**
+   * Indicates whether labels are shown next to each segment of the graphic being sketched.
+   *
+   * @default false
+   */
+  accessor labelsEnabled: boolean;
+  /** @internal */
+  protected messages: {
+      componentLabel: string;
+      directionModePicker: string;
+      directionModeAbsolute: string;
+      directionModeRelative: string;
+      tooltipsToggle: string;
+      tooltipsToggleHint: string;
+      labelsToggle: string;
+      labelsToggleHint: string;
+  } & T9nMeta<{
+      componentLabel: string;
+      directionModePicker: string;
+      directionModeAbsolute: string;
+      directionModeRelative: string;
+      tooltipsToggle: string;
+      tooltipsToggleHint: string;
+      labelsToggle: string;
+      labelsToggleHint: string;
+  }>;
+  /**
+   * Controls whether the direction mode picker is shown for this component.
+   *
+   * @default false
+   */
+  accessor showDirectionModePicker: boolean;
+  /**
+   * Controls whether a header is shown for this component.
+   *
+   * @default false
+   */
+  accessor showHeader: boolean;
+  /** Controls the sketch labels, tooltips, and values options. */
+  accessor sketchOptions: SketchOptions;
+  /**
+   * Indicates whether tooltips are shown while sketching and editing.
+   *
+   * @default false
+   */
+  accessor tooltipsEnabled: boolean;
+  /** 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: "tooltipsEnabled" | "labelsEnabled" | "directionMode"; }>;
+  readonly "@eventTypes": {
+    arcgisPropertyChange: ArcgisSketchTooltipControls["arcgisPropertyChange"]["detail"];
+  };
+}

package/dist/components/arcgis-sketch-tooltip-controls/customElement.js

@@ -0,0 +1,71 @@
+/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
+import { c as l } from "../../chunks/runtime.js";
+import { css as a, html as i } from "lit";
+import n from "@arcgis/core/views/interactive/sketch/SketchOptions.js";
+import { LitElement as c, nothing as r } from "@arcgis/lumina";
+import { usePropertyChange as d } from "@arcgis/lumina/controllers";
+import { u as h } from "../../chunks/useT9n.js";
+import { V as s } from "../../chunks/visible-element.js";
+const b = a`.root{display:flex;flex-flow:column wrap;min-width:100%;& calcite-label:last-child{--calcite-label-margin-bottom: 0}}.block{border-block-end:none;margin:0}.block-content{display:flex;flex-direction:column;gap:var(--calcite-spacing-xs, 6px)}.radio-button-label-wrapper{align-items:center;display:flex;gap:var(--calcite-space-base, 2px)}`;
+class p extends c {
+  constructor() {
+    super(...arguments), this.messages = h({ blocking: !0 }), this.showHeader = !1, this.hideTooltipsToggle = !1, this.hideLabelsToggle = !1, this.showDirectionModePicker = !1, this.sketchOptions = new n(), this.arcgisPropertyChange = d()("tooltipsEnabled", "labelsEnabled", "directionMode");
+  }
+  static {
+    this.properties = { _hasContent: 32, showHeader: 5, label: 1, hideTooltipsToggle: 5, hideLabelsToggle: 5, showDirectionModePicker: 5, sketchOptions: 0, tooltipsEnabled: 5, labelsEnabled: 5, directionMode: 1 };
+  }
+  static {
+    this.styles = b;
+  }
+  get _hasContent() {
+    return !this.hideTooltipsToggle || !this.hideLabelsToggle || this.showDirectionModePicker;
+  }
+  get tooltipsEnabled() {
+    return this.sketchOptions.tooltips.enabled;
+  }
+  set tooltipsEnabled(e) {
+    this.sketchOptions.tooltips.enabled = e;
+  }
+  get labelsEnabled() {
+    return this.sketchOptions.labels.enabled;
+  }
+  set labelsEnabled(e) {
+    this.sketchOptions.labels.enabled = e;
+  }
+  get directionMode() {
+    return this.sketchOptions.values.directionMode;
+  }
+  set directionMode(e) {
+    this.sketchOptions.values.directionMode = e;
+  }
+  _onDirectionModeChange(e) {
+    this.sketchOptions.values.directionMode = e.currentTarget.selectedItem.value;
+  }
+  render() {
+    const { label: e, messages: t } = this, o = e ?? t.componentLabel;
+    return i`<div aria-label=${o ?? r} class="root">${this._hasContent ? i`<calcite-block class="block" expanded .heading=${this.showHeader ? e : ""} .label=${o ?? ""}><div class="block-content">${s({ hidden: this.hideTooltipsToggle, children: this._renderTooltipsToggle() })}${s({ hidden: this.hideLabelsToggle, children: this._renderLabelsToggle() })}${s({ hidden: !this.showDirectionModePicker, children: this._renderDirectionModePicker() })}</div></calcite-block>` : void 0}</div>`;
+  }
+  _renderTooltipsToggle() {
+    const { messages: e } = this;
+    return i`<arcgis-labeled-switch .checked=${this.sketchOptions.tooltips.effectiveEnabled} .hint=${e.tooltipsToggleHint} .label=${e.tooltipsToggle} @arcgisCheckedChanged=${(t) => {
+      this.sketchOptions.tooltips.enabled = t.detail;
+    }} .disabled=${this.sketchOptions.tooltips.forceEnabled}></arcgis-labeled-switch>`;
+  }
+  _renderLabelsToggle() {
+    const { messages: e } = this;
+    return i`<arcgis-labeled-switch .checked=${this.sketchOptions.labels.enabled} .hint=${e.labelsToggleHint} .label=${e.labelsToggle} @arcgisCheckedChanged=${(t) => {
+      this.sketchOptions.labels.enabled = t.detail;
+    }}></arcgis-labeled-switch>`;
+  }
+  _renderDirectionModePicker() {
+    const { messages: e } = this, { directionMode: t } = this.sketchOptions.values;
+    return i`<calcite-label layout=default scale=s>${e.directionModePicker}<calcite-radio-button-group name=direction-mode layout=horizontal scale=s @calciteRadioButtonGroupChange=${this._onDirectionModeChange}>${this._renderDirectionModeOption("relative", t, e.directionModeRelative)}${this._renderDirectionModeOption("absolute", t, e.directionModeAbsolute)}</calcite-radio-button-group></calcite-label>`;
+  }
+  _renderDirectionModeOption(e, t, o) {
+    return i`<calcite-label layout=inline scale=s><calcite-radio-button .checked=${e === t} scale=s .value=${e}></calcite-radio-button><div class="radio-button-label-wrapper"><calcite-icon .icon=${`${e}-direction`} scale=s></calcite-icon>${o}</div></calcite-label>`;
+  }
+}
+l("arcgis-sketch-tooltip-controls", p);
+export {
+  p as ArcgisSketchTooltipControls
+};

package/dist/components/arcgis-sketch-tooltip-controls/index.d.ts

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

package/dist/components/arcgis-sketch-tooltip-controls/index.js

@@ -0,0 +1,7 @@
+import "@esri/calcite-components/components/calcite-block";
+import "../arcgis-labeled-switch/index.js";
+import "@esri/calcite-components/components/calcite-label";
+import "@esri/calcite-components/components/calcite-radio-button-group";
+import "@esri/calcite-components/components/calcite-radio-button";
+import "@esri/calcite-components/components/calcite-icon";
+export * from "./customElement.js";

package/dist/components/arcgis-slice/customElement.d.ts

@@ -15,21 +15,21 @@ import type { Icon as Icon } from "@esri/calcite-components/components/calcite-i
  * [slice analysis](https://developers.arcgis.com/javascript/latest/references/core/analysis/SliceAnalysis/)
  * to any layer type, making it possible to see inside buildings or to explore geological surfaces.
  *
- * [![slice](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/slice.gif)](https://developers.arcgis.com/javascript/latest/sample-code/building-scene-layer-slice/index.html)
+ * <a href="https://developers.arcgis.com/javascript/latest/sample-code/building-scene-layer-slice/index.html"><video src="https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/slice.webm" autoplay loop muted playsinline></video></a>
  *
- * The slicing [shape](#shape)
+ * The slicing [shape](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slice/#shape)
  * is always a [plane](https://developers.arcgis.com/javascript/latest/references/core/analysis/SlicePlane/).
  * By default, the plane is either horizontal or vertical. To allow a tilt angle for the plane, set
- * [tiltEnabled](#tiltEnabled)
+ * [tiltEnabled](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slice/#tiltEnabled)
  * to `true`. The slice hides any content in front of the surface. The handles on the sides of the plane can be used to adjust
  * the size, heading, tilt, and position of the slice plane.
  * The [SlicePlane](https://developers.arcgis.com/javascript/latest/references/core/analysis/SlicePlane/)
- * can be set or retrieved using the [shape](#shape) property.
+ * can be set or retrieved using the [shape](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slice/#shape) property.
  *
  * Once the slice plane is applied, layers can be excluded from the slicing. For example, by excluding the sublayers which include
  * columns and floor slabs, the inner structure of a building can investigated.
  *
- * [![slice-exclude](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/slice-exclude.png)](https://developers.arcgis.com/javascript/latest/sample-code/building-scene-layer-slice/index.html)
+ * [![slice-exclude](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/slice-exclude.avif)](https://developers.arcgis.com/javascript/latest/sample-code/building-scene-layer-slice/index.html)
  *
  * Holding the `Shift` key while placing a new slice applies it vertically.
  *
@@ -284,16 +284,16 @@ export abstract class ArcgisSlice extends LitElement {
    */
   accessor view: SceneView | undefined;
   /**
-   * Clear the [shape](#shape) of the slice, effectively removing it from the view. Other properties like [excludedLayers](#excludedLayers)
-   * and [excludeGroundSurface](#excludeGroundSurface) are not modified.
-   * Calling this method changes the [state](#state) to `ready`.
+   * Clear the [shape](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slice/#shape) of the slice, effectively removing it from the view. Other properties like [excludedLayers](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slice/#excludedLayers)
+   * and [excludeGroundSurface](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slice/#excludeGroundSurface) are not modified.
+   * Calling this method changes the [state](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slice/#state) to `ready`.
    */
   clear(): Promise<void>;
   /** Permanently destroy the component. */
   destroy(): Promise<void>;
   /**
-   * Start the interactive placement of a new slice, clearing the previous [shape](#shape).
-   * Calling this method changes the [state](#state) to `slicing`.
+   * Start the interactive placement of a new slice, clearing the previous [shape](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slice/#shape).
+   * Calling this method changes the [state](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slice/#state) to `slicing`.
    */
   start(): Promise<void>;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */

package/dist/components/arcgis-slice/customElement.js

@@ -1,7 +1,7 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
 import { c as m } from "../../chunks/runtime.js";
-import { css as y, html as r } from "lit";
-import { ignoreAbortErrors as w } from "@arcgis/core/core/promiseUtils.js";
+import { css as w, html as r } from "lit";
+import { ignoreAbortErrors as y } from "@arcgis/core/core/promiseUtils.js";
 import { watch as b } from "@arcgis/core/core/reactiveUtils.js";
 import { LitElement as _, createEvent as L, safeClassMap as k, nothing as z } from "@arcgis/lumina";
 import { usePropertyChange as $ } from "@arcgis/lumina/controllers";
@@ -12,7 +12,7 @@ import { g as h } from "../../chunks/globalCss.js";
 import V from "@arcgis/core/analysis/SliceAnalysis.js";
 import { property as d, subclass as C } from "@arcgis/core/core/accessorSupport/decorators.js";
 import { A as G } from "../../chunks/AnalysisViewModel.js";
-const A = y`:host{--arcgis-internal-color-black-30: color-mix(in srgb, #000000 30.2%, transparent);--arcgis-internal-box-shadow: var(--calcite-spacing-none) var(--calcite-spacing-px) var(--calcite-spacing-base) var(--arcgis-internal-color-black-30);--arcgis-internal-top-max-width: calc(min(100cqw, 100vw) - var(--calcite-spacing-xxxl));--arcgis-internal-panel-width: 300px;--arcgis-internal-panel-height: 100%;--arcgis-internal-panel-height-sm: 240px;--arcgis-internal-panel-height-md: 420px;--arcgis-internal-panel-height-lg: 540px;--arcgis-internal-panel-height-xl: 680px;--arcgis-internal-panel-gap: var(--calcite-spacing-lg);--arcgis-internal-panel-actions-gap: var(--calcite-spacing-sm);--arcgis-internal-basemap-gallery-width-lg: 450px;--arcgis-internal-collapse-icon-flip: scaleX(1);--arcgis-internal-row-direction: row;--arcgis-internal-legend-width: 300px;--arcgis-internal-layout-overlay-space-top: var(--arcgis-layout-overlay-space-top, 0px);--arcgis-internal-layout-overlay-space-bottom: var(--arcgis-layout-overlay-space-bottom, 0px);--arcgis-internal-layout-overlay-space-left: var(--arcgis-layout-overlay-space-left, 0px);--arcgis-internal-layout-overlay-space-right: var(--arcgis-layout-overlay-space-right, 0px);--arcgis-internal-view-color-focus: var(--arcgis-view-color-focus, var(--calcite-color-brand));--arcgis-internal-attribution-space-bottom: var(--arcgis-internal-layout-overlay-space-bottom);--arcgis-internal-attribution-space-left: var(--arcgis-internal-layout-overlay-space-left);--arcgis-internal-attribution-space-right: var(--arcgis-internal-layout-overlay-space-right);--arcgis-internal-attribution-font-size: var(--calcite-font-size-sm);--arcgis-internal-attribution-font-size-sm: var(--calcite-font-size-xs);--arcgis-internal-sketch-justify-content: flex-start}.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}.esri-widget--panel{min-width:300px;min-height:32px;padding:var(--arcgis-internal-padding);transition:max-height .25s ease-in-out;overflow-y:auto}.container{display:flex;overflow-y:auto;--layer-item-background: var(--calcite-color-foreground-2);flex-direction:column;flex-shrink:0;flex-basis:auto;justify-content:space-between;gap:var(--arcgis-internal-panel-gap)}.error{color:var(--calcite-color-status-danger)}.container,.hint{display:flex;flex-direction:column;gap:var(--arcgis-internal-panel-gap)}.error,.hint{overflow:hidden;animation:arcgis-slice-fade-in .25s ease-in-out}.error p,.hint p{margin:0;padding:0}.hint:not(:has(*)){display:none}.layer-item{--calcite-color-foreground-2: var(--layer-item-background);--calcite-color-foreground-1: var(--layer-item-background)}.actions{display:flex;flex-flow:column;gap:var(--arcgis-internal-panel-actions-gap);justify-content:center}.actions:not(:has(*)){display:none}@keyframes arcgis-slice-fade-in{0%{opacity:0}25%{opacity:0}to{opacity:1}}`;
+const A = w`:host{--arcgis-internal-color-black-30: color-mix(in srgb, #000000 30.2%, transparent);--arcgis-internal-box-shadow: var(--calcite-spacing-none) var(--calcite-spacing-px) var(--calcite-spacing-base) var(--arcgis-internal-color-black-30);--arcgis-internal-top-max-width: calc(min(100cqw, 100vw) - var(--calcite-spacing-xxxl));--arcgis-internal-panel-width: 300px;--arcgis-internal-panel-height: 100%;--arcgis-internal-panel-height-sm: 240px;--arcgis-internal-panel-height-md: 420px;--arcgis-internal-panel-height-lg: 540px;--arcgis-internal-panel-height-xl: 680px;--arcgis-internal-panel-gap: var(--calcite-spacing-lg);--arcgis-internal-panel-actions-gap: var(--calcite-spacing-sm);--arcgis-internal-basemap-gallery-width-lg: 450px;--arcgis-internal-collapse-icon-flip: scaleX(1);--arcgis-internal-row-direction: row;--arcgis-internal-legend-width: 300px;--arcgis-internal-layout-overlay-space-top: var(--arcgis-layout-overlay-space-top, 0px);--arcgis-internal-layout-overlay-space-bottom: var(--arcgis-layout-overlay-space-bottom, 0px);--arcgis-internal-layout-overlay-space-left: var(--arcgis-layout-overlay-space-left, 0px);--arcgis-internal-layout-overlay-space-right: var(--arcgis-layout-overlay-space-right, 0px);--arcgis-internal-view-color-focus: var(--arcgis-view-color-focus, var(--calcite-color-brand));--arcgis-internal-attribution-space-bottom: var(--arcgis-internal-layout-overlay-space-bottom);--arcgis-internal-attribution-space-left: var(--arcgis-internal-layout-overlay-space-left);--arcgis-internal-attribution-space-right: var(--arcgis-internal-layout-overlay-space-right);--arcgis-internal-attribution-font-size: var(--calcite-font-size-sm);--arcgis-internal-attribution-font-size-sm: var(--calcite-font-size-xs);--arcgis-internal-sketch-justify-content: flex-start}.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}.esri-widget--panel{min-width:300px;min-height:32px;padding:var(--arcgis-internal-padding);transition:max-height .25s ease-in-out;overflow-y:auto}:host{width:var(--arcgis-internal-panel-width, 300px)}.root{min-width:var(--arcgis-internal-panel-min-width, 300px);overflow:var(--arcgis-internal-panel-overflow, visible);height:fit-content}.container{display:flex;--layer-item-background: var(--calcite-color-foreground-2);flex-direction:column;flex-shrink:0;flex-basis:auto;justify-content:space-between;gap:var(--arcgis-internal-panel-gap)}.error{color:var(--calcite-color-status-danger)}.container,.hint{display:flex;flex-direction:column;gap:var(--arcgis-internal-panel-gap)}.error,.hint{overflow:hidden;animation:arcgis-slice-fade-in .25s ease-in-out}.error p,.hint p{margin:0;padding:0}.hint:not(:has(*)){display:none}.layer-item{--calcite-color-foreground-2: var(--layer-item-background);--calcite-color-foreground-1: var(--layer-item-background)}.actions{display:flex;flex-flow:column;gap:var(--arcgis-internal-panel-actions-gap);justify-content:center}.actions:not(:has(*)){display:none}@keyframes arcgis-slice-fade-in{0%{opacity:0}25%{opacity:0}to{opacity:1}}`;
 var j = Object.defineProperty, T = Object.getOwnPropertyDescriptor, l = (e, i, t, s) => {
   for (var a = s > 1 ? void 0 : s ? T(i, t) : i, n = e.length - 1, c; n >= 0; n--)
     (c = e[n]) && (a = (s ? c(i, t, a) : c(a)) || a);
@@ -32,7 +32,8 @@ let o = class extends G {
       });
       this._excludingLayers = i, i.finally(() => {
         this._excludingLayers === i && (this._excludingLayers = void 0);
-      }), await i.catch();
+      }), await i.catch(() => {
+      });
     }
   }
   async place(e) {
@@ -132,7 +133,7 @@ class O extends _ {
     await this.manager.destroy();
   }
   async start() {
-    w(this.viewModel.start());
+    y(this.viewModel.start());
   }
   load() {
     this.manager.onLifecycle(() => [
@@ -141,6 +142,7 @@ class O extends _ {
   }
   render() {
     return r`<div class=${k({
+      root: !0,
       [h.widget]: !0,
       [h.panel]: !0
     })} role=presentation>${this._renderContainerNode()}</div>`;

package/dist/components/arcgis-slice/types.d.ts

@@ -1,4 +1,4 @@
-import type BuildingComponentSublayer from "@arcgis/core/layers/buildingSublayers/BuildingComponentSublayer";
-import type Layer from "@arcgis/core/layers/Layer";
+import type BuildingComponentSublayer from "@arcgis/core/layers/buildingSublayers/BuildingComponentSublayer.js";
+import type Layer from "@arcgis/core/layers/Layer.js";
 
 export type SliceableLayer = BuildingComponentSublayer | Layer;

package/dist/components/arcgis-slider-binary-color-size-legacy/customElement.d.ts

@@ -1,11 +1,11 @@
 /// <reference path="../../index.d.ts" />
-import type ClassBreaksRenderer from "@arcgis/core/renderers/ClassBreaksRenderer";
+import type ClassBreaksRenderer from "@arcgis/core/renderers/ClassBreaksRenderer.js";
 import type SizeStop from "@arcgis/core/renderers/visualVariables/support/SizeStop.js";
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
-import type { RendererResult } from "@arcgis/core/smartMapping/renderers/univariateColorSize";
-import type { HistogramResult } from "@arcgis/core/smartMapping/statistics/types";
+import type { RendererResult } from "@arcgis/core/smartMapping/renderers/univariateColorSize.js";
+import type { HistogramResult } from "@arcgis/core/smartMapping/statistics/types.js";
 import type { ArcgisReferenceElement, IconName } from "../types.js";
-import type { ThumbDragEvent, ThumbChangeEvent } from "@arcgis/core/widgets/Slider/types";
+import type { ThumbDragEvent, ThumbChangeEvent } from "@arcgis/core/widgets/Slider/types.js";
 import type { HistogramConfig, ZoomOptions } from "@arcgis/core/widgets/smartMapping/types.js";
 import type { LabelFormatFunction, InputParseFunction } from "@arcgis/core/widgets/types.js";
 import type { BinaryColorSizeSliderStyle } from "@arcgis/core/widgets/smartMapping/BinaryColorSizeSlider.js";
@@ -17,13 +17,13 @@ import type { SmartMappingSliderBaseState } from "@arcgis/core/widgets/smartMapp
  * > This is a **legacy component**. It relies on an underlying widget as part of our migration to native web components.
  * >
  * > A fully native replacement for this component is in development. Once it reaches feature parity, the legacy component will be deprecated and no longer maintained.
- * At that point, new development should use the native component.
+ * At that point, development should use the native component.
  *
  * The Binary Color Size Slider component is intended for authoring and exploring diverging data-driven visualizations in any
  * layer that can be rendered with an above and below theme for a [SizeVariable](https://developers.arcgis.com/javascript/latest/references/core/renderers/visualVariables/SizeVariable/).
  *
  * The [updateFromRendererResult()](https://developers.arcgis.com/javascript/latest/references/core/widgets/smartMapping/BinaryColorSizeSlider/#fromRendererResult)
- * method can be used to intelligently populate slider properties including [max](#max), [min](#min), [size visual variable](https://developers.arcgis.com/javascript/latest/references/core/renderers/visualVariables/SizeVariable/)
+ * method can be used to intelligently populate slider properties including [max](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-binary-color-size-legacy/#max), [min](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-binary-color-size-legacy/#min), [size visual variable](https://developers.arcgis.com/javascript/latest/references/core/renderers/visualVariables/SizeVariable/)
  * configuration, and the slider's histogram after the renderer has been created from the result of the
  * [createContinuousRenderer()](https://developers.arcgis.com/javascript/latest/references/core/smartMapping/renderers/univariateColorSize/#createContinuousRenderer) method.
  *
@@ -135,12 +135,12 @@ export abstract class ArcgisSliderBinaryColorSizeLegacy extends LitElement {
    * The image below demonstrates how slider input values resemble corresponding slider values by default
    * and won't match the formatting set in `labelFormatFunction`.
    *
-   * ![Slider without input formatter](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/sliders/slider-no-input-formatter.png "Slider without input formatter")
+   * ![Slider without input formatter](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/sliders/slider-no-input-formatter.avif "Slider without input formatter")
    *
    * If you want to format slider input values so they match thumb labels, you can pass the same function set in `labelFormatFunction` to
    * `inputFormatFunction` for consistent formatting.
    *
-   * ![Slider with input formatter](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/sliders/slider-input-formatter.png "Slider with input formatter")
+   * ![Slider with input formatter](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/sliders/slider-input-formatter.avif "Slider with input formatter")
    *
    * However, if an `inputFormatFunction` is specified, you must also write a corresponding
    * [inputParseFunction](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-binary-color-size-legacy/#inputParseFunction) to parse user inputs to understandable slider values. In most cases, if
@@ -216,7 +216,7 @@ export abstract class ArcgisSliderBinaryColorSizeLegacy extends LitElement {
    */
   accessor labelFormatFunction: LabelFormatFunction | null | undefined;
   /**
-   * The maximum value or upper bound of the slider. Once the slider has rendered with the [updateFromRendererResult()](#updateFromRendererResult) method,
+   * The maximum value or upper bound of the slider. Once the slider has rendered with the [updateFromRendererResult()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-binary-color-size-legacy/#updateFromRendererResult) method,
    * the user may change this property by selecting the label containing the max value on the slider UI. It is the responsibility of the app developer
    * to set up event listeners that update the size variable of the appropriate renderer.
    *
@@ -227,7 +227,7 @@ export abstract class ArcgisSliderBinaryColorSizeLegacy extends LitElement {
    */
   accessor max: number;
   /**
-   * The minimum value or lower bound of the slider. Once the slider has rendered with the [updateFromRendererResult()](#updateFromRendererResult) method,
+   * The minimum value or lower bound of the slider. Once the slider has rendered with the [updateFromRendererResult()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-binary-color-size-legacy/#updateFromRendererResult) method,
    * the user may change this property by selecting the label containing the min value on the slider UI. It is the responsibility of the app developer
    * to set up event listeners that update the size variable of the appropriate renderer.
    *
@@ -240,7 +240,7 @@ export abstract class ArcgisSliderBinaryColorSizeLegacy extends LitElement {
   /**
    * When `true`, ensures symbol sizes in the `above` range
    * are consistent with symbol sizes in the `below` range for all slider thumb positions.
-   * In other words, the size values in the [stops](#stops) will adjust
+   * In other words, the size values in the [stops](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-binary-color-size-legacy/#stops) will adjust
    * proportionally according to the positions of the data values within the
    * constraints of the size range (maxSize - minSize) as the slider thumbs update.
    * When `false`, size values in the stops will remain the same even when slider thumb values
@@ -291,7 +291,7 @@ export abstract class ArcgisSliderBinaryColorSizeLegacy extends LitElement {
    */
   accessor sliderStyle: BinaryColorSizeSliderStyle;
   /** The current state of the component. */
-  accessor state: SmartMappingSliderBaseState;
+  get state(): SmartMappingSliderBaseState;
   /**
    * The size stops from the [SizeVariable](https://developers.arcgis.com/javascript/latest/references/core/renderers/visualVariables/SizeVariable/)
    * to link to the slider. You must provide either three or five stops. The minimum size
@@ -309,21 +309,21 @@ export abstract class ArcgisSliderBinaryColorSizeLegacy extends LitElement {
    */
   accessor stops: Array<SizeStop>;
   /**
-   * Zooms the slider track to the bounds provided in this property. When min and/or max zoom values are provided, the absolute [min](#min) and
-   * [max](#max) slider values are preserved and rendered at their typical positions on the slider. However, the
+   * Zooms the slider track to the bounds provided in this property. When min and/or max zoom values are provided, the absolute [min](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-binary-color-size-legacy/#min) and
+   * [max](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-binary-color-size-legacy/#max) slider values are preserved and rendered at their typical positions on the slider. However, the
    *  slider track itself is zoomed so that thumbs cannot be moved above or below the provided min and max zoomed values.
    *
    *  When a slider is in a zoomed state, the zoomed ends of the track will appear jagged. In the image below, notice how the
    *  top thumb cannot be moved past the zoom max of `31` even though the slider max is `200`.
    *
-   *  ![slider-zoom](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/sliders/slider-zoomed.png "Zoomed slider")
+   *  ![slider-zoom](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/sliders/slider-zoomed.avif "Zoomed slider")
    *
    *  To exit a zoomed state, the user can click the jagged line or the developer can set the `zoomOptions` to `null`. It
    *  is up to the developer to provide a UI option for end users to enable zooming on the slider.
    *
    *  Setting the `zoomOptions` is useful when the slider is tied to heavily skewed datasets where the histogram renders only one or two bars because of outliers.
    *
-   *  ![slider-not-zoomed](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/sliders/slider-skewed-not-zoomed.png "Unzoomed slider")
+   *  ![slider-not-zoomed](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/sliders/slider-skewed-not-zoomed.avif "Unzoomed slider")
    *
    *  You can remove the influence of outliers by zooming the slider and regenerating a histogram based on the zoomed min and max. This will provide a better view of the data
    *  and make the slider more useful to the end user.

package/dist/components/arcgis-slider-binary-color-size-legacy/customElement.js

@@ -12,7 +12,7 @@ class _ extends l {
     super(...arguments), this.widget = h(this), this.viewModel = this.widget.viewModel, this.label = this.widget.label, this.autoDestroyDisabled = !1, this.handlesSyncedToPrimary = this.widget.handlesSyncedToPrimary, this.histogramConfig = this.widget.histogramConfig, this.icon = this.widget.icon, this.inputFormatFunction = this.widget.inputFormatFunction, this.inputParseFunction = this.widget.inputParseFunction, this.labelFormatFunction = this.widget.labelFormatFunction, this.max = this.widget.max, this.min = this.widget.min, this.persistSizeRangeEnabled = this.widget.persistSizeRangeEnabled, this.precision = this.widget.precision, this.sliderStyle = this.widget.style, this.state = this.widget.state, this.stops = this.widget.stops, this.zoomOptions = this.widget.zoomOptions, this.arcgisPropertyChange = n()("histogramConfig", "max", "min", "precision", "sliderStyle", "state", "zoomOptions"), this.arcgisReady = a(), this.arcgisThumbChange = i(() => this.widget, "thumb-change"), this.arcgisThumbDrag = i(() => this.widget, "thumb-drag");
   }
   static {
-    this.properties = { label: 16, autoDestroyDisabled: 5, handlesSyncedToPrimary: 5, histogramConfig: 0, icon: 1, inputFormatFunction: 0, inputParseFunction: 0, labelFormatFunction: 0, max: 9, min: 9, persistSizeRangeEnabled: 5, precision: 9, referenceElement: 1, sliderStyle: 0, state: 1, stops: 0, zoomOptions: 0 };
+    this.properties = { label: 16, autoDestroyDisabled: 5, handlesSyncedToPrimary: 5, histogramConfig: 0, icon: 1, inputFormatFunction: 0, inputParseFunction: 0, labelFormatFunction: 0, max: 9, min: 9, persistSizeRangeEnabled: 5, precision: 9, referenceElement: 1, sliderStyle: 0, state: 32, stops: 0, zoomOptions: 0 };
   }
   static {
     this.styles = c;

package/dist/components/arcgis-slider-classed-color-legacy/customElement.d.ts

@@ -1,10 +1,10 @@
 /// <reference path="../../index.d.ts" />
-import type ClassBreakInfo from "@arcgis/core/renderers/support/ClassBreakInfo";
+import type ClassBreakInfo from "@arcgis/core/renderers/support/ClassBreakInfo.js";
 import type { PublicLitElement as LitElement } from "@arcgis/lumina";
-import type { ClassBreaksRendererResult } from "@arcgis/core/smartMapping/renderers/color";
-import type { HistogramResult } from "@arcgis/core/smartMapping/statistics/types";
+import type { ClassBreaksRendererResult } from "@arcgis/core/smartMapping/renderers/color.js";
+import type { HistogramResult } from "@arcgis/core/smartMapping/statistics/types.js";
 import type { ArcgisReferenceElement, IconName } from "../types.js";
-import type { ThumbDragEvent, ThumbChangeEvent } from "@arcgis/core/widgets/Slider/types";
+import type { ThumbDragEvent, ThumbChangeEvent } from "@arcgis/core/widgets/Slider/types.js";
 import type { ColorBreak, HistogramConfig } from "@arcgis/core/widgets/smartMapping/types.js";
 import type { LabelFormatFunction, InputParseFunction } from "@arcgis/core/widgets/types.js";
 import type { SmartMappingSliderBaseState } from "@arcgis/core/widgets/smartMapping/SmartMappingSliderBase.js";
@@ -14,7 +14,7 @@ import type { SmartMappingSliderBaseState } from "@arcgis/core/widgets/smartMapp
  * >
  * > This is a **legacy component**. It relies on an underlying widget as part of our migration to native web components.
  * >
- * > A fully native replacement for this component is in development. Once it reaches feature parity, the legacy component will be deprecated and no longer maintained. At that point, new development should use the native component.
+ * > A fully native replacement for this component is in development. Once it reaches feature parity, the legacy component will be deprecated and no longer maintained. At that point, development should use the native component.
  *
  * The Classed Color Slider component is designed for authoring and exploring data-driven visualizations in any
  * layer that can be rendered with color in a [ClassBreaksRenderer](https://developers.arcgis.com/javascript/latest/references/core/renderers/ClassBreaksRenderer/).
@@ -22,10 +22,10 @@ import type { SmartMappingSliderBaseState } from "@arcgis/core/widgets/smartMapp
  * <span id="image-annotations"></span>
  * See the image below for a summary of the configurable options available on this slider.
  *
- * ![Classed Color Slider with annotations](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/sliders/classedcolorslider-labels.png "Classed Color Slider with annotations")
+ * ![Classed Color Slider with annotations](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/sliders/classedcolorslider-labels.avif "Classed Color Slider with annotations")
  *
  * The [updateFromRendererResult()](https://developers.arcgis.com/javascript/latest/references/core/widgets/smartMapping/ClassedColorSlider/#fromRendererResult) method can be used to intelligently populate slider properties including
- * [max](#max), [min](#min), the [classBreakInfos](https://developers.arcgis.com/javascript/latest/references/core/renderers/ClassBreaksRenderer/#classBreakInfos) configuration,
+ * [max](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-classed-color-legacy/#max), [min](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-classed-color-legacy/#min), the [classBreakInfos](https://developers.arcgis.com/javascript/latest/references/core/renderers/ClassBreaksRenderer/#classBreakInfos) configuration,
  * and the slider's histogram after the renderer has been created from the result of the
  * [createClassBreaksRenderer()](https://developers.arcgis.com/javascript/latest/references/core/smartMapping/renderers/color/#createClassBreaksRenderer) method.
  *
@@ -150,12 +150,12 @@ export abstract class ArcgisSliderClassedColorLegacy extends LitElement {
    * The image below demonstrates how slider input values resemble corresponding slider values by default
    * and won't match the formatting set in `labelFormatFunction`.
    *
-   * ![Slider without input formatter](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/sliders/slider-no-input-formatter.png "Slider without input formatter")
+   * ![Slider without input formatter](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/sliders/slider-no-input-formatter.avif "Slider without input formatter")
    *
    * If you want to format slider input values so they match thumb labels, you can pass the same function set in `labelFormatFunction` to
    * `inputFormatFunction` for consistent formatting.
    *
-   * ![Slider with input formatter](https://developers.arcgis.com/javascript/latest/assets/img/apiref/widgets/sliders/slider-input-formatter.png "Slider with input formatter")
+   * ![Slider with input formatter](https://developers.arcgis.com/javascript/latest/assets/references/core/widgets/sliders/slider-input-formatter.avif "Slider with input formatter")
    *
    * However, if an `inputFormatFunction` is specified, you must also write a corresponding
    * [inputParseFunction](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-classed-color-legacy/#inputParseFunction) to parse user inputs to understandable slider values. In most cases, if
@@ -231,7 +231,7 @@ export abstract class ArcgisSliderClassedColorLegacy extends LitElement {
    */
   accessor labelFormatFunction: LabelFormatFunction | null | undefined;
   /**
-   * The maximum value or upper bound of the slider. Once the slider has rendered with the [updateFromRendererResult()](#updateFromRendererResult) method,
+   * The maximum value or upper bound of the slider. Once the slider has rendered with the [updateFromRendererResult()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-classed-color-legacy/#updateFromRendererResult) method,
    * the user may change this property by selecting the label containing the max value on the slider UI. It is the responsibility of the app developer
    * to set up event listeners that update the breaks of the appropriate renderer.
    *
@@ -242,7 +242,7 @@ export abstract class ArcgisSliderClassedColorLegacy extends LitElement {
    */
   accessor max: number;
   /**
-   * The minimum value or lower bound of the slider. Once the slider has rendered with the [updateFromRendererResult()](#updateFromRendererResult) method,
+   * The minimum value or lower bound of the slider. Once the slider has rendered with the [updateFromRendererResult()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-classed-color-legacy/#updateFromRendererResult) method,
    * the user may change this property by selecting the label containing the min value on the slider UI. It is the responsibility of the app developer
    * to set up event listeners that update the breaks of the appropriate renderer.
    *
@@ -273,7 +273,7 @@ export abstract class ArcgisSliderClassedColorLegacy extends LitElement {
    */
   accessor referenceElement: ArcgisReferenceElement | string | undefined;
   /** The current state of the component. */
-  accessor state: SmartMappingSliderBaseState;
+  get state(): SmartMappingSliderBaseState;
   /** Permanently destroy the component. */
   destroy(): Promise<void>;
   /**
@@ -283,7 +283,7 @@ export abstract class ArcgisSliderClassedColorLegacy extends LitElement {
    *
    * The number of breaks from the renderer must match the number of breaks in the slider.
    * Generally, the input breaks for this method should come from the same renderer as one
-   * used to create the slider with the [updateFromRendererResult()](#updateFromRendererResult) method.
+   * used to create the slider with the [updateFromRendererResult()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-slider-classed-color-legacy/#updateFromRendererResult) method.
    *
    * @param breakInfos - The classBreakInfos
    *   from a [ClassBreaksRenderer](https://developers.arcgis.com/javascript/latest/references/core/renderers/ClassBreaksRenderer/) instance to update based on

package/dist/components/arcgis-slider-classed-color-legacy/customElement.js

@@ -12,7 +12,7 @@ class h extends l {
     super(...arguments), this.widget = _(this), this.viewModel = this.widget.viewModel, this.label = this.widget.label, this.autoDestroyDisabled = !1, this.breaks = this.widget.breaks, this.histogramConfig = this.widget.histogramConfig, this.icon = this.widget.icon, this.inputFormatFunction = this.widget.inputFormatFunction, this.inputParseFunction = this.widget.inputParseFunction, this.labelFormatFunction = this.widget.labelFormatFunction, this.max = this.widget.max, this.min = this.widget.min, this.precision = this.widget.precision, this.state = this.widget.state, this.arcgisPropertyChange = d()("breaks", "histogramConfig", "max", "min", "precision", "state"), this.arcgisReady = a(), this.arcgisThumbChange = i(() => this.widget, "thumb-change"), this.arcgisThumbDrag = i(() => this.widget, "thumb-drag");
   }
   static {
-    this.properties = { label: 16, autoDestroyDisabled: 5, breaks: 0, histogramConfig: 0, icon: 1, inputFormatFunction: 0, inputParseFunction: 0, labelFormatFunction: 0, max: 9, min: 9, precision: 9, referenceElement: 1, state: 1 };
+    this.properties = { label: 16, autoDestroyDisabled: 5, breaks: 0, histogramConfig: 0, icon: 1, inputFormatFunction: 0, inputParseFunction: 0, labelFormatFunction: 0, max: 9, min: 9, precision: 9, referenceElement: 1, state: 32 };
   }
   static {
     this.styles = n;