@arcgis/common-components 5.2.0-next.52 → 5.2.0-next.53

package/dist/components/arcgis-slider-field/customElement.d.ts

@@ -0,0 +1,292 @@
+/// <reference path="../../index.d.ts" />
+import type Field from "@arcgis/core/layers/support/Field.js";
+import type { PublicLitElement as LitElement } from "@arcgis/lumina";
+import type { ArcgisSlider } from "../arcgis-slider/customElement.js";
+import type { T9nMeta } from "@arcgis/lumina/controllers";
+
+/**
+ * The Field Slider component wraps [arcgis-slider](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/) and adapts input/output formatting based on the configured
+ * [fieldType](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#fieldType).
+ *
+ * Use this component when slider values must be represented in ArcGIS field formats, such as numeric timestamps for `date`,
+ * `YYYY-MM-DD` for `date-only`, or `HH:mm:ss` for `time-only`.
+ *
+ * @slot [content-start] - A slot for elements before the track.
+ * @slot [content-end] - A slot for elements after the track.
+ * @slot [popover] - A slot for custom content to be rendered in the popover.
+ * @example
+ * ```html
+ * <!-- Numeric field (double) -->
+ * <arcgis-slider-field field-type="double" min="0" max="100" values="20.5,75.25"></arcgis-slider-field>
+ * ```
+ * @example
+ * ```html
+ * <!-- Date field -->
+ * <arcgis-slider-field
+ *   field-type="date"
+ *   min="1704067200000"
+ *   max="1735689599000"
+ *   values="1710028800000,1726617600000"
+ * ></arcgis-slider-field>
+ * ```
+ * @example
+ * ```html
+ * <!-- Timestamp offset field -->
+ * <arcgis-slider-field
+ *   field-type="timestamp-offset"
+ *   min="2024-01-01T00:00:00-05:00"
+ *   max="2024-12-31T23:59:59-05:00"
+ *   values="2024-03-10T08:00:00-05:00,2024-09-18T18:30:00-05:00"
+ * ></arcgis-slider-field>
+ * ```
+ * @internal
+ */
+export abstract class ArcgisSliderField extends LitElement {
+  /**
+   * The active value of the component, based on which thumb or range (segment) is active. This returns the stored value for the active thumb,
+   * so it may reflect the thumb’s last set position.
+   *
+   *
+   * It returns:
+   * - `undefined` when no value is active
+   * - a serialized string when a single value is active
+   * - `"all"` when the range (segment) is active
+   *
+   * Listen to [@arcgisActiveValueChange](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#event-arcgisActiveValueChange) to be notified when a value becomes active or inactive.
+   *
+   * @see [@arcgisActiveValueChange](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#event-arcgisActiveValueChange)
+   */
+  get activeValue(): string | undefined;
+  /**
+   * Indicates whether the slider is disabled.
+   *
+   * @default false
+   */
+  accessor disabled: boolean;
+  /**
+   * Defines the ArcGIS field type used to parse, format, and serialize slider values.
+   *
+   * Supported values:
+   * - Numeric: `small-integer`, `integer`, `big-integer`, `single`, `double`, `long`, `oid`
+   * - Temporal: `date`, `date-only`, `time-only`, `timestamp-offset`
+   *
+   * @default "double"
+   * @see [Field.type](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-support-Field.html#type)
+   */
+  accessor fieldType: FieldSliderType;
+  /**
+   * Controls where the filled segment is displayed on the track for single-thumb sliders.
+   * Range sliders always display the fill between the min and max thumbs.
+   *
+   * @default "start"
+   * @see [arcgis-slider.fillPlacement](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#fillPlacement)
+   */
+  accessor fillPlacement: ArcgisSlider["fillPlacement"];
+  /** The component's default label. */
+  accessor label: string | undefined;
+  /**
+   * Determines the layout/orientation of the slider.
+   *
+   * @default "horizontal"
+   * @see [mirrored](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#mirrored)
+   * @see [arcgis-slider.layout](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#layout)
+   */
+  accessor layout: ArcgisSlider["layout"];
+  /**
+   * The upper bound of the slider range, expressed using the format of the current
+   * [fieldType](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#fieldType).
+   *
+   * If omitted or invalid, a field-type specific default is used.
+   *
+   * Examples:
+   * - `double`: `"100.5"`
+   * - `date`: `"1710028800000"`
+   * - `date-only`: `"2024-12-31"`
+   *
+   * @default ""
+   * @see [arcgis-slider.max](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#max)
+   */
+  accessor max: string;
+  /**
+   * Replace localized message strings with your own strings.
+   *
+   * _**Note**: Individual message keys may change between releases._
+   */
+  accessor messageOverrides: { componentLabel?: string | undefined; };
+  /** @internal */
+  protected messages: Partial<{ componentLabel: string; }> & T9nMeta<{ componentLabel: string; }>;
+  /**
+   * The lower bound of the slider range, expressed using the format of the current
+   * [fieldType](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#fieldType).
+   *
+   * If omitted or invalid, a field-type specific default is used.
+   *
+   * Examples:
+   * - `double`: `"0"`
+   * - `date`: `"1704067200000"`
+   * - `time-only`: `"00:00:00"`
+   *
+   * @default ""
+   * @see [arcgis-slider.min](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#min)
+   */
+  accessor min: string;
+  /**
+   * When `true`, the slider displays values from high to low.
+   *
+   * @default false
+   * @see [layout](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#layout)
+   * @see [arcgis-slider.mirrored](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#mirrored)
+   */
+  accessor mirrored: boolean;
+  /**
+   * The accessible label for the popover. This label is used by assistive technologies
+   * and does not affect visible UI.
+   *
+   * @default ""
+   * @see [arcgis-slider.popoverLabel](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#popoverLabel)
+   */
+  accessor popoverLabel: ArcgisSlider["popoverLabel"];
+  /**
+   * When `true`, allows editing the min/max range labels with keyboard input.
+   *
+   * Applies only to: `small-integer`, `integer`, `big-integer`, `single`, `double`, `long`, `oid`.
+   *
+   * @default false
+   * @see [arcgis-slider.rangeLabelsEditingEnabled](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#rangeLabelsEditingEnabled)
+   */
+  accessor rangeLabelsEditingEnabled: boolean;
+  /**
+   * Controls where min/max range labels are positioned relative to the track.
+   *
+   * @default "center"
+   * @see [showRangeLabels](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#showRangeLabels)
+   * @see [arcgis-slider.rangeLabelsPlacement](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#rangeLabelsPlacement)
+   */
+  accessor rangeLabelsPlacement: ArcgisSlider["rangeLabelsPlacement"];
+  /**
+   * Indicates whether min/max range labels are visible on the slider.
+   *
+   * @default false
+   * @see [arcgis-slider.showRangeLabels](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#showRangeLabels)
+   */
+  accessor showRangeLabels: boolean;
+  /**
+   * Controls when thumb value labels are displayed.
+   *
+   * - `"always"`: Always show labels.
+   * - `"auto"`: Show labels only during interaction.
+   * - `"hidden"`: Never show labels.
+   *
+   * @default "always"
+   * @see [arcgis-slider.valueLabelsDisplay](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#valueLabelsDisplay)
+   */
+  accessor valueLabelsDisplay: ArcgisSlider["valueLabelsDisplay"];
+  /**
+   * When `true`, allows editing value labels with keyboard input.
+   *
+   * Applies only to: `small-integer`, `integer`, `big-integer`, `single`, `double`, `long`, `oid`.
+   *
+   * @default false
+   * @see [arcgis-slider.valueLabelsEditingEnabled](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#valueLabelsEditingEnabled)
+   */
+  accessor valueLabelsEditingEnabled: boolean;
+  /**
+   * Determines whether value labels are placed before or after the track.
+   *
+   * @default "start"
+   * @see [arcgis-slider.valueLabelsPlacement](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#valueLabelsPlacement)
+   */
+  accessor valueLabelsPlacement: ArcgisSlider["valueLabelsPlacement"];
+  /**
+   * Comma-delimited slider values, expressed using the format of the current
+   * [fieldType](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#fieldType).
+   *
+   * Examples:
+   * - `integer`: `"2,20,50"`
+   * - `date`: `"1710028800000,1726617600000"`
+   * - `date-only`: `"2024-03-10,2024-09-18"`
+   * - `timestamp-offset`: `"2024-03-10T08:00:00-05:00,2024-09-18T18:30:00-05:00"`
+   *
+   * @default ""
+   * @see [arcgis-slider.values](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#values)
+   */
+  accessor values: string;
+  /**
+   * Returns the [values](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#values) property converted into an array of dates (YYYY-MM-DD). Attempting to access this property
+   * on a slider with incompatible data, such as number or time only values, will result in the property returning an array of null values. Note that when
+   * this property is accessed, the time of day information that may be present on the slider is stripped away.
+   */
+  get valuesAsDateOnly(): (string | null)[];
+  /**
+   * Returns the [values](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#values) property converted into an array of values that match the native type of the property.
+   * For time-only, date-only or timestamp-offset sliders, this property will return an array of strings, and for numeric or date sliders, this property
+   * will return an array of numbers.
+   */
+  get valuesAsFieldType(): (number | string)[];
+  /**
+   * Returns the [values](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#values) property converted into an array of numbers. When this property is accessed on
+   * a slider with temporal data, the resulting array will be formatted as milliseconds since the Unix epoch when the date is available. If only
+   * the time is available, the array will be formatted as ms since midnight. Values that cannot be parsed will become NaN.
+   */
+  get valuesAsNumbers(): number[];
+  /**
+   * Returns the [values](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#values) property converted into an array of times (HH:mm:ss). Attempting to access this property
+   * on a slider with incompatible data, such as number or date only values, will result in the property returning an array of null values. Note that
+   * when this property is accessed, the time is extracted in UTC and the date is stripped away, so an ISO 8601 value of `2024-03-10T08:00:00-05:00` would
+   * simply become `13:00:00`.
+   */
+  get valuesAsTimeOnly(): (string | null)[];
+  /**
+   * Returns the [values](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#values) property converted into an array of UTC timestamps formatted according to the
+   * ISO 8601 standard. Attempting to access this property on a slider with incompatible data, such as number or time only values,
+   * will result in the property returning an array of null values.
+   */
+  get valuesAsTimestampOffset(): (string | null)[];
+  /**
+   * Fires when the active value changes.
+   *
+   * @see [arcgis-slider.@arcgisActiveValueChange](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#event-arcgisActiveValueChange)
+   */
+  readonly arcgisActiveValueChange: import("@arcgis/lumina").TargetedEvent<this, void>;
+  /**
+   * Fires when user interaction is committed (for example, on thumb release).
+   *
+   * Use [@arcgisInput](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/#event-arcgisInput) for continuous updates while dragging.
+   *
+   * @see [arcgis-slider.@arcgisChange](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#event-arcgisChange)
+   */
+  readonly arcgisChange: import("@arcgis/lumina").TargetedEvent<this, void>;
+  /**
+   * Fires continuously while the slider thumb or range is being dragged.
+   * This event can fire frequently; debounce or throttle expensive work if needed.
+   *
+   * @see [arcgis-slider.@arcgisInput](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#event-arcgisInput)
+   */
+  readonly arcgisInput: import("@arcgis/lumina").TargetedEvent<this, void>;
+  /**
+   * Fires when the slider range changes.
+   *
+   * @see [arcgis-slider.@arcgisRangeChange](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider/#event-arcgisRangeChange)
+   */
+  readonly arcgisRangeChange: import("@arcgis/lumina").TargetedEvent<this, void>;
+  readonly "@eventTypes": {
+    arcgisActiveValueChange: ArcgisSliderField["arcgisActiveValueChange"]["detail"];
+    arcgisChange: ArcgisSliderField["arcgisChange"]["detail"];
+    arcgisInput: ArcgisSliderField["arcgisInput"]["detail"];
+    arcgisRangeChange: ArcgisSliderField["arcgisRangeChange"]["detail"];
+  };
+}
+
+/**
+ * Supported ArcGIS field types for [arcgis-slider-field](https://developers.arcgis.com/javascript/latest/references/common-components/components/arcgis-slider-field/).
+ *
+ * This type is derived from `Field["type"]` and constrained to the field types
+ * currently supported by the component.
+ *
+ * - Numeric: `small-integer`, `integer`, `big-integer`, `single`, `double`, `long`, `oid`
+ * - Temporal: `date`, `date-only`, `time-only`, `timestamp-offset`
+ *
+ * @see [Field.type](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-support-Field.html#type)
+ * @internal
+ */
+export type FieldSliderType = Extract<Field["type"], "big-integer" | "date-only" | "date" | "double" | "integer" | "long" | "oid" | "single" | "small-integer" | "time-only" | "timestamp-offset">;

package/dist/components/arcgis-slider-field/customElement.js

@@ -0,0 +1,375 @@
+/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+import { c as O } from "../../chunks/runtime.js";
+import { LitElement as F, createEvent as c } from "@arcgis/lumina";
+import { css as w, html as D } from "lit";
+import { u as L } from "../../chunks/useT9n.js";
+import { a as d } from "../../chunks/locale.js";
+import { createRef as $, ref as M } from "lit/directives/ref.js";
+const E = w`:host{display:block;width:100%;height:100%}`, o = 1440 * 60 * 1e3, N = /^(\d{4})-(\d{2})-(\d{2})$/u, R = /^(\d{2}):(\d{2})(?::(\d{2})(?:\.(\d{1,3}))?)?$/u;
+class h {
+  constructor({
+    type: e,
+    editable: t,
+    precision: s,
+    steps: i
+  }) {
+    this.type = e, this.editable = t, this.precision = s, this.steps = i;
+  }
+  toDateOnly(e) {
+    return null;
+  }
+  toTimeOnly(e) {
+    return null;
+  }
+  toTimestampOffset(e) {
+    return null;
+  }
+  toFieldType(e) {
+    return e;
+  }
+}
+class m extends h {
+  constructor({ type: e, precision: t, integer: s = !1, minimum: i, maximum: a }) {
+    super({
+      type: e,
+      editable: !0,
+      precision: t
+    }), this._integer = s, this._minimum = i, this._maximum = a;
+  }
+  resolveRange(e, t, s) {
+    return {
+      min: t ?? Math.min(0, ...e),
+      max: s ?? Math.max(100, ...e)
+    };
+  }
+  parse(e) {
+    const t = Number.parseFloat(e.trim());
+    if (!Number.isFinite(t))
+      return;
+    const s = this._integer ? Math.trunc(t) : t;
+    return Math.min(this._maximum, Math.max(this._minimum, s));
+  }
+  serialize(e) {
+    return this._integer ? `${Math.trunc(e)}` : `${e}`;
+  }
+  format(e, t, s, i) {
+    return i(t);
+  }
+}
+class I extends h {
+  constructor() {
+    super({
+      type: "date",
+      editable: !1,
+      precision: 0,
+      steps: 1e3
+    }), this._dateTimeFormatOptions = {
+      dateStyle: "short"
+    };
+  }
+  resolveRange(e, t, s) {
+    return p(e, t, s, Date.now());
+  }
+  parse(e) {
+    const t = Number.parseFloat(e.trim());
+    return Number.isFinite(t) ? Math.trunc(t) : void 0;
+  }
+  serialize(e) {
+    return `${Math.trunc(e)}`;
+  }
+  toDateOnly(e) {
+    return new Date(e).toISOString().slice(0, 10);
+  }
+  toTimeOnly(e) {
+    return new Date(e).toISOString().slice(11, 19);
+  }
+  toTimestampOffset(e) {
+    return new Date(e).toISOString();
+  }
+  format(e, t) {
+    return d(e, this._dateTimeFormatOptions).format(new Date(t));
+  }
+}
+class z extends h {
+  constructor() {
+    super({
+      type: "timestamp-offset",
+      editable: !1,
+      precision: 0,
+      steps: 1e3
+    }), this._dateTimeFormatOptions = {
+      dateStyle: "short"
+    };
+  }
+  resolveRange(e, t, s) {
+    return p(e, t, s, Date.now());
+  }
+  parse(e) {
+    const t = Date.parse(e.trim());
+    return Number.isFinite(t) ? t : void 0;
+  }
+  serialize(e) {
+    return new Date(e).toISOString();
+  }
+  toDateOnly(e) {
+    return new Date(e).toISOString().slice(0, 10);
+  }
+  toTimeOnly(e) {
+    return new Date(e).toISOString().slice(11, 19);
+  }
+  toTimestampOffset(e) {
+    return new Date(e).toISOString();
+  }
+  toFieldType(e) {
+    return this.serialize(e);
+  }
+  format(e, t) {
+    return d(e, this._dateTimeFormatOptions).format(new Date(t));
+  }
+}
+class A extends h {
+  constructor() {
+    super({
+      type: "date-only",
+      editable: !1,
+      precision: 0,
+      steps: o
+    }), this._dateFormatOptions = {
+      dateStyle: "short",
+      timeZone: "UTC"
+    };
+  }
+  resolveRange(e, t, s) {
+    return p(e, t, s, Math.trunc(Date.now() / o) * o);
+  }
+  parse(e) {
+    const t = N.exec(e.trim());
+    if (!t)
+      return;
+    const s = Number.parseInt(t[1], 10), i = Number.parseInt(t[2], 10), a = Number.parseInt(t[3], 10), r = Date.UTC(s, i - 1, a), l = new Date(r);
+    if (!(l.getUTCFullYear() !== s || l.getUTCMonth() !== i - 1 || l.getUTCDate() !== a))
+      return r;
+  }
+  serialize(e) {
+    return new Date(e).toISOString().slice(0, 10);
+  }
+  toDateOnly(e) {
+    return this.serialize(e);
+  }
+  toTimestampOffset(e) {
+    return new Date(e).toISOString();
+  }
+  toFieldType(e) {
+    return this.serialize(e);
+  }
+  format(e, t) {
+    return d(e, this._dateFormatOptions).format(new Date(t));
+  }
+}
+class C extends h {
+  constructor() {
+    super({
+      type: "time-only",
+      editable: !1,
+      precision: 0,
+      steps: 1e3
+    }), this._timeFormatOptions = {
+      timeStyle: "medium",
+      timeZone: "UTC"
+    };
+  }
+  resolveRange(e, t, s) {
+    return { min: t ?? 0, max: s ?? o - 1 };
+  }
+  parse(e) {
+    const t = R.exec(e.trim());
+    if (!t)
+      return;
+    const s = Number.parseInt(t[1], 10), i = Number.parseInt(t[2], 10), a = t[3] ? Number.parseInt(t[3], 10) : 0, r = t[4] ? Number.parseInt(t[4].padEnd(3, "0").slice(0, 3), 10) : 0;
+    if (!(s > 23 || i > 59 || a > 59))
+      return ((s * 60 + i) * 60 + a) * 1e3 + r;
+  }
+  serialize(e) {
+    const t = Math.max(0, Math.min(o - 1, Math.floor(e))), s = Math.floor(t / 36e5), i = Math.floor(t % 36e5 / 6e4), a = Math.floor(t % 6e4 / 1e3), r = t % 1e3, l = `${g(s)}:${g(i)}:${g(a)}`;
+    return r > 0 ? `${l}.${r.toString().padStart(3, "0")}` : l;
+  }
+  toTimeOnly(e) {
+    return this.serialize(e);
+  }
+  toFieldType(e) {
+    return this.serialize(e);
+  }
+  format(e, t) {
+    return d(e, this._timeFormatOptions).format(new Date(t));
+  }
+}
+function g(n) {
+  return n.toString().padStart(2, "0");
+}
+function p(n, e, t, s) {
+  const i = t ?? (n.length > 0 ? Math.max(...n) : s);
+  return {
+    min: e ?? Math.min(i - 30 * o, ...n),
+    max: i
+  };
+}
+const y = {
+  min: -32768,
+  max: 32767
+}, u = {
+  min: -2147483648,
+  max: 2147483647
+}, f = {
+  min: -Number.MAX_SAFE_INTEGER,
+  max: Number.MAX_SAFE_INTEGER
+}, b = (2 - 2 ** -23) * 2 ** 127, v = {
+  min: -b,
+  max: b
+}, x = {
+  min: -Number.MAX_VALUE,
+  max: Number.MAX_VALUE
+}, S = {
+  min: 0,
+  max: u.max
+}, V = {
+  "small-integer": () => new m({
+    type: "small-integer",
+    precision: 0,
+    integer: !0,
+    minimum: y.min,
+    maximum: y.max
+  }),
+  integer: () => new m({
+    type: "integer",
+    precision: 0,
+    integer: !0,
+    minimum: u.min,
+    maximum: u.max
+  }),
+  "big-integer": () => new m({
+    type: "big-integer",
+    precision: 0,
+    integer: !0,
+    minimum: f.min,
+    maximum: f.max
+  }),
+  single: () => new m({
+    type: "single",
+    precision: 4,
+    minimum: v.min,
+    maximum: v.max
+  }),
+  double: () => new m({
+    type: "double",
+    precision: 4,
+    minimum: x.min,
+    maximum: x.max
+  }),
+  long: () => new m({
+    type: "long",
+    precision: 0,
+    integer: !0,
+    minimum: u.min,
+    maximum: u.max
+  }),
+  oid: () => new m({
+    type: "oid",
+    precision: 0,
+    integer: !0,
+    minimum: S.min,
+    maximum: S.max
+  }),
+  date: () => new I(),
+  "date-only": () => new A(),
+  "time-only": () => new C(),
+  "timestamp-offset": () => new z()
+};
+function _(n) {
+  return V[n]();
+}
+const T = "double";
+class P extends F {
+  constructor() {
+    super(...arguments), this.#t = $(), this.#s = void 0, this.messages = L({}), this._strategy = _(T), this.disabled = !1, this.fieldType = T, this.fillPlacement = "start", this.layout = "horizontal", this.max = "", this.min = "", this.mirrored = !1, this.popoverLabel = "", this.rangeLabelsEditingEnabled = !1, this.rangeLabelsPlacement = "center", this.showRangeLabels = !1, this.values = "", this.valueLabelsEditingEnabled = !1, this.valueLabelsDisplay = "always", this.valueLabelsPlacement = "start", this.arcgisChange = c({ cancelable: !1 }), this.arcgisInput = c({ cancelable: !1 }), this.arcgisRangeChange = c({ cancelable: !1 }), this.arcgisActiveValueChange = c({ cancelable: !1 });
+  }
+  static {
+    this.properties = { _strategy: 16, activeValue: 32, disabled: 5, fieldType: 1, fillPlacement: 1, label: 1, layout: 1, max: 1, messageOverrides: 0, min: 1, mirrored: 5, popoverLabel: 1, rangeLabelsEditingEnabled: 5, rangeLabelsPlacement: 1, showRangeLabels: 5, values: 1, valueLabelsEditingEnabled: 5, valueLabelsDisplay: 1, valueLabelsPlacement: 1, valuesAsNumbers: 32, valuesAsDateOnly: 32, valuesAsTimeOnly: 32, valuesAsTimestampOffset: 32, valuesAsFieldType: 32 };
+  }
+  static {
+    this.styles = E;
+  }
+  #t;
+  #s;
+  get activeValue() {
+    const e = this.#t.value?.activeValue;
+    return typeof e == "number" ? this._strategy.serialize(e) : e;
+  }
+  get valuesAsNumbers() {
+    return this.#e(this.values).map((e) => e ?? NaN);
+  }
+  get valuesAsDateOnly() {
+    return this.#e(this.values).map((e) => e === void 0 ? null : this._strategy.toDateOnly(e));
+  }
+  get valuesAsTimeOnly() {
+    return this.#e(this.values).map((e) => e === void 0 ? null : this._strategy.toTimeOnly(e));
+  }
+  get valuesAsTimestampOffset() {
+    return this.#e(this.values).map((e) => e === void 0 ? null : this._strategy.toTimestampOffset(e));
+  }
+  get valuesAsFieldType() {
+    return this.#e(this.values).map((e) => e === void 0 ? NaN : this._strategy.toFieldType(e));
+  }
+  willUpdate(e) {
+    super.willUpdate(e), e.has("fieldType") && (this._strategy = _(this.fieldType)), (e.has("messages") || e.has("fieldType")) && (this.#s = this.#u(this.messages._lang)), (e.has("values") || e.has("min") || e.has("max") || e.has("fieldType")) && this.#c();
+  }
+  #n(e) {
+    e.stopPropagation(), this.#i(e.currentTarget.values), this.arcgisInput.emit();
+  }
+  #l(e) {
+    e.stopPropagation(), this.#i(e.currentTarget.values), this.arcgisChange.emit();
+  }
+  #m(e) {
+    e.stopPropagation(), this.arcgisActiveValueChange.emit();
+  }
+  #o(e) {
+    e.stopPropagation();
+    const t = e.currentTarget;
+    this.min = this._strategy.serialize(t.min), this.max = this._strategy.serialize(t.max), this.#i(t.values), this.arcgisRangeChange.emit();
+  }
+  #u(e) {
+    return this._strategy.format.bind(this._strategy, e);
+  }
+  #i(e) {
+    this.values = e.map((t) => this._strategy.serialize(t)).join(",");
+  }
+  #e(e) {
+    return e.split(",").map((t) => t.trim()).filter((t) => t.length > 0).map((t) => this._strategy.parse(t));
+  }
+  #a(e) {
+    return this.#e(e).filter((t) => Number.isFinite(t));
+  }
+  #r(e) {
+    const t = this._strategy, s = t.parse(this.min), i = t.parse(this.max);
+    let a = Number.isFinite(s) ? s : void 0, r = Number.isFinite(i) ? i : void 0;
+    a != null && r != null && a >= r && (a = void 0, r = void 0);
+    const l = t.resolveRange(e, a, r);
+    return l.min >= l.max ? t.resolveRange(e, void 0, void 0) : l;
+  }
+  #h(e, t, s) {
+    return e.map((i) => Math.min(s, Math.max(t, i))).sort((i, a) => i - a);
+  }
+  #c() {
+    const e = this.#a(this.values), t = this.#r(e), s = this._strategy.serialize(t.min), i = this._strategy.serialize(t.max);
+    s !== this.min && (this.min = s), i !== this.max && (this.max = i);
+    const r = this.#h(e, t.min, t.max).map((l) => this._strategy.serialize(l)).join(",");
+    r !== this.values && (this.values = r);
+  }
+  render() {
+    const e = this.#a(this.values), t = this.#r(e), s = this._strategy.editable, i = this._strategy.steps;
+    return D`<arcgis-slider .ariaLabel=${this.label} .disabled=${this.disabled} .labelFormatter=${this.#s} .layout=${this.layout} .max=${t.max} .min=${t.min} .mirrored=${this.mirrored} .popoverLabel=${this.popoverLabel} .precision=${this._strategy.precision} .fillPlacement=${this.fillPlacement} .steps=${i} .rangeLabelsEditingEnabled=${s && this.rangeLabelsEditingEnabled} .rangeLabelsPlacement=${this.rangeLabelsPlacement} .showRangeLabels=${this.showRangeLabels} .valueLabelsDisplay=${this.valueLabelsDisplay} .valueLabelsEditingEnabled=${s && this.valueLabelsEditingEnabled} .valueLabelsPlacement=${this.valueLabelsPlacement} .values=${e} @arcgisChange=${this.#l} @arcgisInput=${this.#n} @arcgisActiveValueChange=${this.#m} @arcgisRangeChange=${this.#o} ${M(this.#t)}><slot name=content-start slot=content-start></slot><slot name=content-end slot=content-end></slot><slot name=popover slot=popover></slot></arcgis-slider>`;
+  }
+}
+O("arcgis-slider-field", P);
+export {
+  P as ArcgisSliderField
+};

package/dist/components/arcgis-slider-field/index.d.ts

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

package/dist/components/arcgis-slider-field/index.js

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