npm - @arcgis/map-components - Versions diffs - 4.32.0-next.8 → 4.32.0-next.80 - Mend

@arcgis/map-components 4.32.0-next.8 → 4.32.0-next.80

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 (1134) hide show

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

@@ -1,38 +1,39 @@
 /// <reference types="@arcgis/core/interfaces.d.ts" />
+/// <reference types="../../index.d.ts" />
 import { ArcgisReferenceElement } from '../../utils/component-utils';
 import { Use } from '@arcgis/components-controllers';
 import { Nil } from '@arcgis/components-utils';
-import { PublicLitElement as LitElement } from '@arcgis/lumina';
+import { PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
 declare const useSliderWidget: (component: import('@arcgis/components-controllers').StencilLifecycles & {
-    manager: import('@arcgis/components-controllers').ControllerManager<never>;
+    manager: import('@arcgis/components-controllers').ControllerManager;
     el: HTMLElement;
-    autoDestroyDisabled?: boolean | undefined;
-    destroy?: (() => Promise<void>) | undefined;
+    autoDestroyDisabled?: boolean;
+    destroy?: () => Promise<void>;
 } & Pick<__esri.Slider, "values" | "label" | "viewModel" | "icon" | "layout" | "tickConfigs" | "draggableSegmentsEnabled" | "effectiveMax" | "effectiveMin" | "labelInputsEnabled" | "max" | "min" | "precision" | "rangeLabelInputsEnabled" | "snapOnClickEnabled" | "steps" | "syncedSegmentsEnabled" | "thumbsConstrained" | "trackElement"> & {
-    reactiveUtils?: __esri.reactiveUtils | undefined;
+    reactiveUtils?: typeof __esri.reactiveUtils;
     state?: "ready" | "disabled" | "editing" | "dragging" | undefined;
     viewModel?: __esri.SliderViewModel | undefined;
-    icon: string | Nil;
-    label: string | Nil;
-    referenceElement: string | Nil | ArcgisReferenceElement;
+    icon: Nil | string;
+    label: Nil | string;
+    referenceElement: ArcgisReferenceElement | Nil | string;
     position: __esri.UIPosition;
     arcgisReady: import('@arcgis/components-controllers').EventEmitter;
     arcgisPropertyChange: import('@arcgis/components-controllers').EventEmitter<{
         name: string;
     }> | undefined;
     el: HTMLElement & {
-        childElem?: (HTMLElement & {
-            ownedBy?: HTMLElement | undefined;
-        }) | undefined;
-        view?: __esri.MapView | Nil | __esri.SceneView;
+        childElem?: HTMLElement & {
+            ownedBy?: HTMLElement;
+        };
+        view?: __esri.MapView | __esri.SceneView | Nil;
     };
     autoDestroyDisabled: boolean;
     destroy: () => Promise<void>;
 }, options?: {
     editConstructorProperties(props: __esri.SliderProperties): __esri.SliderProperties | Promise<__esri.SliderProperties>;
 } | undefined) => __esri.Slider;
-export declare class ArcgisSlider extends LitElement implements Use<typeof useSliderWidget> {
+export declare class ArcgisSlider extends LitElement {
     /**
      * If true, the component will not be destroyed automatically when it is
      * disconnected from the document. This is useful when you want to move the
@@ -45,11 +46,17 @@ export declare class ArcgisSlider extends LitElement implements Use<typeof useSl
     effectiveMax: number;
     effectiveMin: number;
     readonly effectiveSegmentElements: __esri.Collection<HTMLElement>;
+    /**
+     * Icon which represents the component.
+     * Typically used when the component is controlled by another component (e.g. by the Expand component).
+     * Search [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/) for possible values.
+     */
     icon: string;
+    /** The component's default label. */
     label: string;
     readonly labelElements: __esri.Collection<HTMLElement>;
     labelInputsEnabled: boolean;
-    readonly labels: string[];
+    readonly labels: __esri.LabelInfos;
     layout: "horizontal" | "vertical" | "horizontal-reversed" | "vertical-reversed";
     max: number;
     readonly maxLabelElement: HTMLElement;
@@ -72,20 +79,20 @@ export declare class ArcgisSlider extends LitElement implements Use<typeof useSl
     values: number[];
     /** Permanently destroy the component */
     destroy(): Promise<void>;
-    readonly arcgisMaxChange: CustomEvent<__esri.SliderMaxChangeEvent>;
-    readonly arcgisMaxClick: CustomEvent<__esri.SliderMaxClickEvent>;
-    readonly arcgisMinChange: CustomEvent<__esri.SliderMinChangeEvent>;
-    readonly arcgisMinClick: CustomEvent<__esri.SliderMinClickEvent>;
-    readonly arcgisPropertyChange: CustomEvent<{
+    readonly arcgisMaxChange: TargetedEvent<this, __esri.SliderMaxChangeEvent>;
+    readonly arcgisMaxClick: TargetedEvent<this, __esri.SliderMaxClickEvent>;
+    readonly arcgisMinChange: TargetedEvent<this, __esri.SliderMinChangeEvent>;
+    readonly arcgisMinClick: TargetedEvent<this, __esri.SliderMinClickEvent>;
+    readonly arcgisPropertyChange: TargetedEvent<this, {
         name: "state";
     }>;
-    readonly arcgisReady: CustomEvent<undefined>;
-    readonly arcgisSegmentClick: CustomEvent<__esri.SliderSegmentClickEvent>;
-    readonly arcgisSegmentDrag: CustomEvent<__esri.SliderSegmentDragEvent>;
-    readonly arcgisThumbChange: CustomEvent<__esri.SliderThumbChangeEvent>;
-    readonly arcgisThumbClick: CustomEvent<__esri.SliderThumbClickEvent>;
-    readonly arcgisThumbDrag: CustomEvent<__esri.SliderThumbDragEvent>;
-    readonly arcgisTickClick: CustomEvent<__esri.SliderTickClickEvent>;
-    readonly arcgisTrackClick: CustomEvent<__esri.SliderTrackClickEvent>;
+    readonly arcgisReady: TargetedEvent<this, undefined>;
+    readonly arcgisSegmentClick: TargetedEvent<this, __esri.SliderSegmentClickEvent>;
+    readonly arcgisSegmentDrag: TargetedEvent<this, __esri.SliderSegmentDragEvent>;
+    readonly arcgisThumbChange: TargetedEvent<this, __esri.SliderThumbChangeEvent>;
+    readonly arcgisThumbClick: TargetedEvent<this, __esri.SliderThumbClickEvent>;
+    readonly arcgisThumbDrag: TargetedEvent<this, __esri.SliderThumbDragEvent>;
+    readonly arcgisTickClick: TargetedEvent<this, __esri.SliderTickClickEvent>;
+    readonly arcgisTrackClick: TargetedEvent<this, __esri.SliderTrackClickEvent>;
 }
 export {};

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

@@ -8,7 +8,7 @@ import { css as m } from "@lit/reactive-element/css-tag.js";
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
  * See https://js.arcgis.com/4.32/esri/copyright.txt for details.
- * v4.32.0-next.8
+ * v4.32.0-next.80
 */
 const c = m`arcgis-slider{min-width:200px;min-height:25px}`, r = a(s);
 class d extends h {

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

@@ -1,65 +1,102 @@
 /// <reference types="@arcgis/core/interfaces.d.ts" />
+/// <reference types="../../index.d.ts" />
 import { ArcgisReferenceElement } from '../../utils/component-utils';
-import { Use } from '@arcgis/components-controllers';
 import { Nil } from '@arcgis/components-utils';
-import { PublicLitElement as LitElement } from '@arcgis/lumina';
+import { Use } from '@arcgis/components-controllers';
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
-declare const useSwipeWidget: (component: import('@arcgis/components-controllers').StencilLifecycles & {
-    manager: import('@arcgis/components-controllers').ControllerManager<never>;
+declare const useSwipeViewModel: (component: import('@arcgis/components-controllers').StencilLifecycles & {
+    manager: import('@arcgis/components-controllers').ControllerManager;
     el: HTMLElement;
-    autoDestroyDisabled?: boolean | undefined;
-    destroy?: (() => Promise<void>) | undefined;
-} & Pick<__esri.Swipe, "label" | "viewModel" | "icon" | "direction" | "dragLabel" | "leadingLayers" | "trailingLayers"> & {
-    reactiveUtils?: __esri.reactiveUtils | undefined;
-    state?: unknown;
-    viewModel?: __esri.SwipeViewModel | undefined;
-    icon: string | Nil;
-    label: string | Nil;
-    referenceElement: string | Nil | ArcgisReferenceElement;
-    position: __esri.UIPosition;
+    autoDestroyDisabled?: boolean;
+    destroy?: () => Promise<void>;
+} & Pick<__esri.SwipeViewModel, never> & {
+    reactiveUtils?: typeof __esri.reactiveUtils;
+    state?: "ready" | "disabled" | undefined;
+    icon: Nil | string;
+    label: Nil | string;
+    referenceElement: ArcgisReferenceElement | Nil | string;
     arcgisReady: import('@arcgis/components-controllers').EventEmitter;
+    position: __esri.UIPosition;
     arcgisPropertyChange: import('@arcgis/components-controllers').EventEmitter<{
         name: string;
     }> | undefined;
     el: HTMLElement & {
-        childElem?: (HTMLElement & {
-            ownedBy?: HTMLElement | undefined;
-        }) | undefined;
-        view?: __esri.MapView | Nil | __esri.SceneView;
+        childElem?: HTMLElement & {
+            ownedBy?: HTMLElement;
+        };
+        view?: __esri.MapView | __esri.SceneView | undefined;
     };
     autoDestroyDisabled: boolean;
     destroy: () => Promise<void>;
 }, options?: {
-    editConstructorProperties(props: __esri.SwipeProperties): __esri.SwipeProperties | Promise<__esri.SwipeProperties>;
-} | undefined) => __esri.Swipe;
-export declare class ArcgisSwipe extends LitElement implements Use<typeof useSwipeWidget> {
+    editConstructorProperties(props: unknown): unknown;
+} | undefined) => __esri.SwipeViewModel;
+/** The [Swipe](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Swipe.html) provides a tool to show a portion of a layer or layers on top of a map.
+ */
+export declare class ArcgisSwipe extends LitElement {
+    /** */
+    private messages;
     /**
-     * If true, the component will not be destroyed automatically when it is
-     * disconnected from the document. This is useful when you want to move the
-     * component to a different place on the page, or temporary hide it. If this
-     * is set, make sure to call the \`destroy\` method when you are done to prevent
-     * memory leaks.
+     * If true, the component will not be destroyed automatically when
+     * it is disconnected from the document. This is useful when you
+     * want to move the component to a different place on the page, or
+     * temporary hide it. If this is set, make sure to call the
+     * \`destroy\` method when you are done to prevent memory leaks.
      */
     autoDestroyDisabled: boolean;
+    /**
+     * The direction the Swipe component moves across the view.
+     * If `"horizontal"`, the component will move left and right and
+     * if `"vertical"`, the component will move up and down.
+     */
     direction: "horizontal" | "vertical";
-    dragLabel: string;
-    /** @internal */
-    icon: string;
-    /** @internal */
-    label: string;
+    /**
+     * When `true`, sets the component to a disabled state so the user cannot interact with it.
+     */
+    disabled: boolean;
+    /**
+     * When `true`, the divider between the leading and trailing layers will be hidden.
+     */
+    hideDivider: boolean;
+    /**
+     * When `true`, the handle from which you drag the component will be hidden.
+     */
+    hideHandle: boolean;
+    /**
+     * Icon which represents the component. It is typically used when the component is controlled by another
+     * one (e.g. in the Expand component).
+     *
+     * @see [Calcite Icon Search](https://developers.arcgis.com/calcite-design-system/icons/)
+     */
+    icon: Nil | string;
+    /**
+     * The component's default label.
+     */
+    label: Nil | string;
+    /**
+     * A collection of layers that will show on the left or top side of the Swipe component.
+     */
     leadingLayers: __esri.Collection<__esri.Layer>;
-    /** @internal */
+    /** Overwrite localized strings for this component */
+    messageOverrides?: typeof this.messages._overrides;
     position: __esri.UIPosition;
-    /** @internal */
+    /**
+     * The position of the Swipe component. This determines what percentage
+     * of the view will be taken up by the [leadingLayers](#leadingLayers).
+     */
+    swipePosition: number;
     referenceElement: ArcgisReferenceElement | Nil | string;
     readonly state: "ready" | "disabled";
-    swipePosition: number;
+    /**
+     * A collection of layers that will show on the right or bottom side of the Swipe component.
+     */
     trailingLayers: __esri.Collection<__esri.Layer>;
     /** Permanently destroy the component */
     destroy(): Promise<void>;
-    readonly arcgisPropertyChange: CustomEvent<{
+    readonly arcgisPropertyChange: TargetedEvent<this, {
         name: "state";
     }>;
-    readonly arcgisReady: CustomEvent<undefined>;
+    readonly arcgisReady: TargetedEvent<this, undefined>;
 }
 export {};

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

@@ -1,32 +1,122 @@
-import { c as t } from "../../chunks/runtime.js";
-import { newWidgetsSwipe as i } from "@arcgis/core-adapter";
-import { usePropertyChange as e } from "@arcgis/components-controllers";
-import { m as s } from "../../chunks/useWidget.js";
-import { LitElement as a, createEvent as o, noShadowRoot as r } from "@arcgis/lumina";
+import { c as x } from "../../chunks/runtime.js";
+import { html as g } from "lit-html";
+import { g as _ } from "../../chunks/globalCss.js";
+import { l as m } from "../../chunks/legacyIcon.js";
+import { u as $, m as D } from "../../chunks/useViewModel.js";
+import { classes as v } from "@arcgis/components-utils";
+import { usePropertyChange as P } from "@arcgis/components-controllers";
+import { newWidgetsSwipeSwipeViewModel as C } from "@arcgis/core-adapter";
+import { LitElement as M, createEvent as K, noShadowRoot as z, safeClassMap as h, safeStyleMap as b, nothing as L } from "@arcgis/lumina";
+import { css as A } from "@lit/reactive-element/css-tag.js";
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
  * See https://js.arcgis.com/4.32/esri/copyright.txt for details.
- * v4.32.0-next.8
+ * v4.32.0-next.80
 */
-const n = s(i);
-class d extends a {
+const H = A`arcgis-swipe,.arcgis-swipe{position:absolute;margin:0;background:transparent;padding:0;width:100%;height:100%;overflow:hidden;user-select:none}.arcgis-swipe,.arcgis-ui .arcgis-swipe{pointer-events:none}.arcgis-swipe__container{position:absolute;z-index:1;margin:0;outline:0;border:0;padding:0;overflow:hidden;pointer-events:auto;touch-action:none;outline-color:transparent}.arcgis-swipe--horizontal .arcgis-swipe__container{margin-left:calc(var(--calcite-spacing-xxxl) / 2 * -1);cursor:col-resize;height:100%}.arcgis-swipe--vertical .arcgis-swipe__container{margin-top:calc(var(--calcite-spacing-xxxl) / 2 * -1);cursor:row-resize;width:100%}.arcgis-swipe--disabled .arcgis-swipe__container{cursor:default;pointer-events:none}.arcgis-swipe__divider{position:absolute;background-color:var(--calcite-color-background)}.arcgis-swipe--horizontal .arcgis-swipe__divider{top:0;left:calc(var(--calcite-spacing-xxxl) / 2);margin-left:calc(var(--calcite-border-width-lg) * .5 * -1);border-right:var(--calcite-border-width-sm) solid var(--calcite-color-border-1);border-left:var(--calcite-border-width-sm) solid var(--calcite-color-border-1);width:var(--calcite-border-width-lg);height:100%}.arcgis-swipe--vertical .arcgis-swipe__divider{top:calc(var(--calcite-spacing-xxxl) / 2);left:0;margin-top:calc(var(--calcite-border-width-lg) * .5 * -1);border-top:var(--calcite-border-width-sm) solid var(--calcite-color-border-1);border-bottom:var(--calcite-border-width-sm) solid var(--calcite-color-border-1);width:100%;height:var(--calcite-border-width-lg)}.arcgis-swipe__handle{display:flex;position:relative;align-items:center;justify-content:center;border:var(--calcite-border-width-sm) solid var(--calcite-color-border-1);border-radius:var(--calcite-corner-radius-round);background-color:var(--calcite-color-background);width:var(--calcite-spacing-xxxl);height:var(--calcite-spacing-xxxl);color:var(--calcite-color-border-input);&--hidden{visibility:hidden}}.arcgis-swipe--vertical .arcgis-swipe__handle{rotate:90deg}.arcgis-swipe__handle-icon{position:relative;z-index:2}.arcgis-swipe--horizontal .arcgis-swipe__handle{top:calc(50% - calc(var(--calcite-spacing-xxxl) / 2))}.arcgis-swipe--vertical .arcgis-swipe__handle{left:calc(50% - calc(var(--calcite-spacing-xxxl) / 2))}.arcgis-swipe__container:focus .arcgis-swipe__handle,.arcgis-swipe__container:focus .arcgis-swipe__divider{outline:inset 2px var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)))}.arcgis-swipe__container:focus .arcgis-swipe__handle{outline-offset:calc(-2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}`, l = "arcgis-swipe", n = {
+  base: l,
+  baseDisabled: `${l}--disabled`,
+  vertical: `${l}--vertical`,
+  horizontal: `${l}--horizontal`,
+  container: `${l}__container`,
+  divider: `${l}__divider`,
+  handle: `${l}__handle`,
+  handleHidden: `${l}__handle--hidden`,
+  handleIcon: `${l}__handle-icon`
+}, V = D(C);
+class O extends M {
   constructor() {
-    super(...arguments), this.widget = n(this), this.viewModel = this.widget.viewModel, this.autoDestroyDisabled = !1, this.direction = this.widget.direction, this.dragLabel = this.widget.dragLabel, this.icon = this.widget.icon, this.label = this.widget.label, this.leadingLayers = this.widget.leadingLayers, this.position = "manual", this.state = this.viewModel.state, this.swipePosition = this.widget.position, this.trailingLayers = this.widget.trailingLayers, this.arcgisPropertyChange = e()("state"), this.arcgisReady = o();
+    super(...arguments), this._container = null, this._swiping = !1, this.messages = $({}), this._pointerOffset = 0, this.viewModel = V(this), this._onContainerPointerDown = (i) => {
+      i.preventDefault();
+      const { _container: e } = this;
+      e && document.activeElement !== this.el && e.focus(), this._swiping = !0, this._calculatePointerOffset(i);
+    }, this.autoDestroyDisabled = !1, this.direction = this.viewModel.direction, this.disabled = !1, this.hideDivider = !1, this.hideHandle = !1, this.icon = "compare", this.label = this.messages.componentLabel, this.leadingLayers = this.viewModel.leadingLayers, this.position = "manual", this.swipePosition = this.viewModel.position, this.state = this.viewModel.state, this.trailingLayers = this.viewModel.trailingLayers, this.arcgisPropertyChange = P()("state"), this.arcgisReady = K();
   }
   static {
-    this.properties = { autoDestroyDisabled: 5, direction: 1, dragLabel: 1, icon: 1, label: 1, leadingLayers: 0, position: 1, referenceElement: 1, state: 3, swipePosition: 9, trailingLayers: 0 };
+    this.properties = { autoDestroyDisabled: 5, direction: 3, disabled: 7, hideDivider: 7, hideHandle: 7, icon: 3, label: 1, leadingLayers: 0, messageOverrides: 0, position: 3, swipePosition: 9, referenceElement: 1, state: 3, trailingLayers: 0 };
   }
   static {
-    this.shadowRootOptions = r;
+    this.shadowRootOptions = z;
   }
-  // #endregion
-  // #region Public Methods
+  static {
+    this.styles = H;
+  }
+  //#endregion
+  //#region Public Methods
   /** Permanently destroy the component */
   async destroy() {
     await this.manager.destroy();
   }
+  //#endregion
+  //#region Lifecycle
+  loaded() {
+    this.listenOn(document, "pointermove", this._onContainerPointerMove), this.listenOn(document, "pointerup", this._onContainerPointerUp);
+  }
+  //#endregion
+  //#region Private Methods
+  _calculatePointerOffset(i) {
+    const { direction: e } = this, t = i.target, r = (e === "vertical" ? t.clientHeight : t.clientWidth) / 2, s = t.getBoundingClientRect(), o = i.clientX - s.left, d = i.clientY - s.top;
+    this._pointerOffset = e === "vertical" ? d - r : o - r;
+  }
+  _onContainerPointerUp(i) {
+    this._swiping && (i.preventDefault(), this._swiping = !1);
+  }
+  _onContainerPointerMove(i) {
+    if (!this._swiping)
+      return;
+    i.preventDefault();
+    const { _pointerOffset: e, el: t, direction: r } = this, { clientX: s, clientY: o } = i, { top: d, left: a, width: c, height: p } = t.getBoundingClientRect(), u = r === "vertical" ? p : c, f = (r === "vertical" ? o - d - e : s - a - e) / u * 100;
+    this.swipePosition = f;
+  }
+  _getKeyPosition(i) {
+    const { key: e } = i, { swipePosition: t } = this, { max: r, min: s, step: o, stepMultiplier: d, direction: a } = this.viewModel, c = o * d;
+    if (["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", "Home", "End", "PageUp", "PageDown"].includes(e) && (i.preventDefault(), i.stopPropagation()), a === "vertical" ? e === "ArrowDown" || e === "ArrowRight" : e === "ArrowUp" || e === "ArrowRight") {
+      const w = i.shiftKey ? c : o;
+      return t + w;
+    }
+    if (a === "vertical" ? e === "ArrowUp" || e === "ArrowLeft" : e === "ArrowDown" || e === "ArrowLeft") {
+      const w = i.shiftKey ? c : o;
+      return t - w;
+    }
+    return e === "Home" ? s : e === "End" ? r : (a === "vertical" ? e === "PageDown" : e === "PageUp") ? t + c : (a === "vertical" ? e === "PageUp" : e === "PageDown") ? t - c : null;
+  }
+  _onContainerKeyDown(i) {
+    const e = this._getKeyPosition(i);
+    typeof e == "number" && (this.swipePosition = e);
+  }
+  //#endregion
+  //#region Rendering
+  render() {
+    const { state: i, direction: e } = this.viewModel, t = i === "disabled" || this.disabled, r = {
+      [_.disabled]: t,
+      [n.baseDisabled]: t,
+      [n.vertical]: e === "vertical",
+      [n.horizontal]: e === "horizontal"
+    };
+    return g`<div class=${h(v(n.base, _.widget, r))}>${i === "disabled" ? null : this._renderContainer()}</div>`;
+  }
+  _renderHandle() {
+    const { direction: i } = this.viewModel, { hideHandle: e } = this, t = {
+      [m.dragHorizontal]: i === "vertical",
+      [m.dragVertical]: i === "horizontal"
+    }, r = v(n.handle, !!e && n.handleHidden);
+    return g`<div class=${h(r)} role=presentation><span aria-hidden=true class=${h(v(n.handleIcon, t))}></span></div>`;
+  }
+  _renderDivider() {
+    return this.hideDivider ? null : g`<div class=${h(n.divider)} role=presentation></div>`;
+  }
+  _renderContent() {
+    return [this._renderDivider(), this._renderHandle()];
+  }
+  _renderContainer() {
+    const { disabled: i, viewModel: e } = this, { max: t, min: r, direction: s, position: o } = e, d = this.label ?? this.messages.dragLabel ?? "", a = `${o}%`, c = {
+      top: s === "vertical" ? a : void 0,
+      left: s === "vertical" ? void 0 : a
+    }, p = this._renderContent();
+    return i ? g`<div class=${h(n.container)} role=presentation style=${b(c)}>${p}</div>` : g`<div @pointerdown=${this._onContainerPointerDown} .ariaLabel=${d} .ariaOrientation=${s} .ariaValueMax=${`${t}`} .ariaValueMin=${`${r}`} .ariaValueNow=${`${o}`} .ariaValueText=${a} class=${h(n.container)} @keydown=${this._onContainerKeyDown} role=slider style=${b(c)} tabindex=0 title=${d ?? L} touch-action=none>${p}</div>`;
+  }
 }
-t("arcgis-swipe", d);
+x("arcgis-swipe", O);
 export {
-  d as ArcgisSwipe
+  O as ArcgisSwipe
 };

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

@@ -1,38 +1,47 @@
 /// <reference types="@arcgis/core/interfaces.d.ts" />
+/// <reference types="../../index.d.ts" />
 import { Use } from '@arcgis/components-controllers';
 import { Nil } from '@arcgis/components-utils';
 import { ArcgisReferenceElement } from '../../utils/component-utils';
-import { PublicLitElement as LitElement } from '@arcgis/lumina';
+import { PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
 declare const useTableListWidget: (component: import('@arcgis/components-controllers').StencilLifecycles & {
-    manager: import('@arcgis/components-controllers').ControllerManager<never>;
+    manager: import('@arcgis/components-controllers').ControllerManager;
     el: HTMLElement;
-    autoDestroyDisabled?: boolean | undefined;
-    destroy?: (() => Promise<void>) | undefined;
-} & Pick<__esri.TableList, "label" | "viewModel" | "icon" | "collapsed" | "dragEnabled" | "filterPlaceholder" | "filterText" | "listItemCreatedFunction" | "minDragEnabledItems" | "minFilterItems" | "selectedItems" | "selectionMode"> & {
-    reactiveUtils?: __esri.reactiveUtils | undefined;
+    autoDestroyDisabled?: boolean;
+    destroy?: () => Promise<void>;
+} & Pick<__esri.TableList, "label" | "viewModel" | "icon" | "collapsed" | "dragEnabled" | "filterPlaceholder" | "filterPredicate" | "filterText" | "listItemCreatedFunction" | "minDragEnabledItems" | "minFilterItems" | "selectedItems" | "selectionMode"> & {
+    reactiveUtils?: typeof __esri.reactiveUtils;
     state?: unknown;
     viewModel?: __esri.TableListViewModel | undefined;
-    icon: string | Nil;
-    label: string | Nil;
-    referenceElement: string | Nil | ArcgisReferenceElement;
+    icon: Nil | string;
+    label: Nil | string;
+    referenceElement: ArcgisReferenceElement | Nil | string;
     position: __esri.UIPosition;
     arcgisReady: import('@arcgis/components-controllers').EventEmitter;
     arcgisPropertyChange: import('@arcgis/components-controllers').EventEmitter<{
         name: string;
     }> | undefined;
     el: HTMLElement & {
-        childElem?: (HTMLElement & {
-            ownedBy?: HTMLElement | undefined;
-        }) | undefined;
-        view?: __esri.MapView | Nil | __esri.SceneView;
+        childElem?: HTMLElement & {
+            ownedBy?: HTMLElement;
+        };
+        view?: __esri.MapView | __esri.SceneView /**
+         * If true, the component will not be destroyed automatically when it is
+         * disconnected from the document. This is useful when you want to move the
+         * component to a different place on the page, or temporary hide it. If this
+         * is set, make sure to call the \`destroy\` method when you are done to prevent
+         * memory leaks.
+         */ | Nil;
     };
     autoDestroyDisabled: boolean;
     destroy: () => Promise<void>;
 }, options?: {
     editConstructorProperties(props: __esri.TableListProperties): __esri.TableListProperties | Promise<__esri.TableListProperties>;
 } | undefined) => __esri.TableList;
-export declare class ArcgisTableList extends LitElement implements Use<typeof useTableListWidget> {
+/** The [TableList](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-TableList.html) widget provides a way to display a list of tables associated with a [Map](https://developers.arcgis.com/javascript/latest/api-reference/esri-Map.html).
+ */
+export declare class ArcgisTableList extends LitElement {
     /**
      * If true, the component will not be destroyed automatically when it is
      * disconnected from the document. This is useful when you want to move the
@@ -44,8 +53,15 @@ export declare class ArcgisTableList extends LitElement implements Use<typeof us
     collapsed: boolean;
     dragEnabled: boolean;
     filterPlaceholder: string;
+    filterPredicate: __esri.TableListFilterPredicate;
     filterText: string;
+    /**
+     * Icon which represents the component.
+     * Typically used when the component is controlled by another component (e.g. by the Expand component).
+     * Search [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/) for possible values.
+     */
     icon: string;
+    /** The component's default label. */
     label: string;
     listItemCreatedFunction: __esri.TableListListItemCreatedHandler;
     minDragEnabledItems: number;
@@ -67,10 +83,10 @@ export declare class ArcgisTableList extends LitElement implements Use<typeof us
     visibleElementsTemporaryTableIndicators: boolean;
     /** Permanently destroy the component */
     destroy(): Promise<void>;
-    readonly arcgisPropertyChange: CustomEvent<{
+    readonly arcgisPropertyChange: TargetedEvent<this, {
         name: "state";
     }>;
-    readonly arcgisReady: CustomEvent<undefined>;
-    readonly arcgisTriggerAction: CustomEvent<__esri.TableListTriggerActionEvent>;
+    readonly arcgisReady: TargetedEvent<this, undefined>;
+    readonly arcgisTriggerAction: TargetedEvent<this, __esri.TableListTriggerActionEvent>;
 }
 export {};

package/dist/components/arcgis-table-list/customElement.js CHANGED Viewed

@@ -4,22 +4,26 @@ import { newWidgetsTableList as i } from "@arcgis/core-adapter";
 import { m as s } from "../../chunks/useWidget.js";
 import { LitElement as l, createEvent as r, noShadowRoot as a } from "@arcgis/lumina";
 import { reEmitEvent as o } from "@arcgis/components-controllers/accessor";
+import { css as n } from "@lit/reactive-element/css-tag.js";
 /*!
  * All material copyright Esri, All Rights Reserved, unless otherwise specified.
  * See https://js.arcgis.com/4.32/esri/copyright.txt for details.
- * v4.32.0-next.8
+ * v4.32.0-next.80
 */
-const n = s(i);
-class m extends l {
+const d = n`arcgis-table-list{display:block}`, m = s(i);
+class h extends l {
   constructor() {
-    super(...arguments), this.widget = n(this), this.viewModel = this.widget.viewModel, this.autoDestroyDisabled = !1, this.collapsed = this.widget.collapsed, this.dragEnabled = this.widget.dragEnabled, this.filterPlaceholder = this.widget.filterPlaceholder, this.filterText = this.widget.filterText, this.icon = this.widget.icon, this.label = this.widget.label, this.listItemCreatedFunction = this.widget.listItemCreatedFunction, this.minDragEnabledItems = this.widget.minDragEnabledItems, this.minFilterItems = this.widget.minFilterItems, this.position = "bottom-left", this.selectedItems = this.widget.selectedItems, this.selectionMode = this.widget.selectionMode, this.state = this.viewModel.state, this.visibleElementsCloseButton = !1, this.visibleElementsCollapseButton = !1, this.visibleElementsErrors = !1, this.visibleElementsFilter = !1, this.visibleElementsFlow = !0, this.visibleElementsHeading = !1, this.visibleElementsStatusIndicators = !0, this.visibleElementsTemporaryTableIndicators = !1, this.arcgisPropertyChange = t()("state"), this.arcgisReady = r(), this.arcgisTriggerAction = o(() => this.widget, "trigger-action");
+    super(...arguments), this.widget = m(this), this.viewModel = this.widget.viewModel, this.autoDestroyDisabled = !1, this.collapsed = this.widget.collapsed, this.dragEnabled = this.widget.dragEnabled, this.filterPlaceholder = this.widget.filterPlaceholder, this.filterPredicate = this.widget.filterPredicate, this.filterText = this.widget.filterText, this.icon = this.widget.icon, this.label = this.widget.label, this.listItemCreatedFunction = this.widget.listItemCreatedFunction, this.minDragEnabledItems = this.widget.minDragEnabledItems, this.minFilterItems = this.widget.minFilterItems, this.position = "bottom-left", this.selectedItems = this.widget.selectedItems, this.selectionMode = this.widget.selectionMode, this.state = this.viewModel.state, this.visibleElementsCloseButton = !1, this.visibleElementsCollapseButton = !1, this.visibleElementsErrors = !1, this.visibleElementsFilter = !1, this.visibleElementsFlow = !0, this.visibleElementsHeading = !1, this.visibleElementsStatusIndicators = !0, this.visibleElementsTemporaryTableIndicators = !1, this.arcgisPropertyChange = t()("state"), this.arcgisReady = r(), this.arcgisTriggerAction = o(() => this.widget, "trigger-action");
   }
   static {
-    this.properties = { autoDestroyDisabled: 5, collapsed: 7, dragEnabled: 5, filterPlaceholder: 1, filterText: 1, icon: 1, label: 1, listItemCreatedFunction: 0, minDragEnabledItems: 9, minFilterItems: 9, position: 1, referenceElement: 1, selectedItems: 0, selectionMode: 1, state: 3, tableItems: 32, visibleElementsCloseButton: 5, visibleElementsCollapseButton: 5, visibleElementsErrors: 5, visibleElementsFilter: 5, visibleElementsFlow: 5, visibleElementsHeading: 5, visibleElementsStatusIndicators: 5, visibleElementsTemporaryTableIndicators: 5 };
+    this.properties = { autoDestroyDisabled: 5, collapsed: 7, dragEnabled: 5, filterPlaceholder: 1, filterPredicate: 0, filterText: 1, icon: 1, label: 1, listItemCreatedFunction: 0, minDragEnabledItems: 9, minFilterItems: 9, position: 1, referenceElement: 1, selectedItems: 0, selectionMode: 1, state: 3, tableItems: 32, visibleElementsCloseButton: 5, visibleElementsCollapseButton: 5, visibleElementsErrors: 5, visibleElementsFilter: 5, visibleElementsFlow: 5, visibleElementsHeading: 5, visibleElementsStatusIndicators: 5, visibleElementsTemporaryTableIndicators: 5 };
   }
   static {
     this.shadowRootOptions = a;
   }
+  static {
+    this.styles = d;
+  }
   /** The collection of table ListItems displayed within the component. */
   get tableItems() {
     return this.widget.tableItems;
@@ -31,7 +35,7 @@ class m extends l {
     await this.manager.destroy();
   }
 }
-e("arcgis-table-list", m);
+e("arcgis-table-list", h);
 export {
-  m as ArcgisTableList
+  h as ArcgisTableList
 };

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

@@ -1,38 +1,41 @@
 /// <reference types="@arcgis/core/interfaces.d.ts" />
+/// <reference types="../../index.d.ts" />
 import { ArcgisReferenceElement } from '../../utils/component-utils';
 import { Use } from '@arcgis/components-controllers';
 import { Nil } from '@arcgis/components-utils';
-import { PublicLitElement as LitElement } from '@arcgis/lumina';
+import { PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
 declare const useTimeSliderWidget: (component: import('@arcgis/components-controllers').StencilLifecycles & {
-    manager: import('@arcgis/components-controllers').ControllerManager<never>;
+    manager: import('@arcgis/components-controllers').ControllerManager;
     el: HTMLElement;
-    autoDestroyDisabled?: boolean | undefined;
-    destroy?: (() => Promise<void>) | undefined;
+    autoDestroyDisabled?: boolean;
+    destroy?: () => Promise<void>;
 } & Pick<__esri.widgetsTimeSlider, "timeExtent" | "timeZone" | "label" | "viewModel" | "icon" | "mode" | "layout" | "loop" | "playRate" | "disabled" | "actions" | "fullTimeExtent" | "stops" | "tickConfigs" | "timeVisible"> & {
-    reactiveUtils?: __esri.reactiveUtils | undefined;
+    reactiveUtils?: typeof __esri.reactiveUtils;
     state?: unknown;
     viewModel?: __esri.TimeSliderViewModel | undefined;
-    icon: string | Nil;
-    label: string | Nil;
-    referenceElement: string | Nil | ArcgisReferenceElement;
+    icon: Nil | string;
+    label: Nil | string;
+    referenceElement: ArcgisReferenceElement | Nil | string;
     position: __esri.UIPosition;
     arcgisReady: import('@arcgis/components-controllers').EventEmitter;
     arcgisPropertyChange: import('@arcgis/components-controllers').EventEmitter<{
         name: string;
     }> | undefined;
     el: HTMLElement & {
-        childElem?: (HTMLElement & {
-            ownedBy?: HTMLElement | undefined;
-        }) | undefined;
-        view?: __esri.MapView | Nil | __esri.SceneView;
+        childElem?: HTMLElement & {
+            ownedBy?: HTMLElement;
+        };
+        view?: __esri.MapView | __esri.SceneView | Nil;
     };
     autoDestroyDisabled: boolean;
     destroy: () => Promise<void>;
 }, options?: {
     editConstructorProperties(props: __esri.widgetsTimeSliderProperties): __esri.widgetsTimeSliderProperties | Promise<__esri.widgetsTimeSliderProperties>;
 } | undefined) => __esri.widgetsTimeSlider;
-export declare class ArcgisTimeSlider extends LitElement implements Use<typeof useTimeSliderWidget> {
+/** The [TimeSlider](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-TimeSlider.html) simplifies visualization of temporal data in your application.
+ */
+export declare class ArcgisTimeSlider extends LitElement {
     actions: __esri.Collection<__esri.Action>;
     /**
      * If true, the component will not be destroyed automatically when it is
@@ -45,7 +48,13 @@ export declare class ArcgisTimeSlider extends LitElement implements Use<typeof u
     disabled: boolean;
     readonly effectiveStops: Date[];
     fullTimeExtent: __esri.TimeExtent;
+    /**
+     * Icon which represents the component.
+     * Typically used when the component is controlled by another component (e.g. by the Expand component).
+     * Search [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/) for possible values.
+     */
     icon: string;
+    /** The component's default label. */
     label: string;
     layout: "auto" | "compact" | "wide";
     loop: boolean;
@@ -67,10 +76,10 @@ export declare class ArcgisTimeSlider extends LitElement implements Use<typeof u
     previous(): Promise<void>;
     stop(): Promise<void>;
     updateWebDocument(webmap: __esri.WebMap): Promise<void>;
-    readonly arcgisPropertyChange: CustomEvent<{
+    readonly arcgisPropertyChange: TargetedEvent<this, {
         name: "timeExtent" | "state" | "effectiveStops" | "fullTimeExtent";
     }>;
-    readonly arcgisReady: CustomEvent<undefined>;
-    readonly arcgisTriggerAction: CustomEvent<__esri.TimeSliderTriggerActionEvent>;
+    readonly arcgisReady: TargetedEvent<this, undefined>;
+    readonly arcgisTriggerAction: TargetedEvent<this, __esri.TimeSliderTriggerActionEvent>;
 }
 export {};