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

package/dist/components/arcgis-file-picker/customElement.d.ts

@@ -0,0 +1,103 @@
+/// <reference path="../../index.d.ts" />
+import type { PublicLitElement as LitElement } from "@arcgis/lumina";
+import type { IconName } from "../types.js";
+import type { AttachmentTypeCategory } from "@arcgis/core/widgets/BatchAttributeForm/inputs/types.js";
+import type { T9nMeta } from "@arcgis/lumina/controllers";
+
+/**
+ * Provides file browsing and drag/drop interactions, principally for attachments.
+ *
+ * @internal
+ */
+export abstract class ArcgisFilePicker extends LitElement {
+  /** @internal */
+  protected _messages: Partial<{
+      heading: {
+          singular: string;
+          plural: string;
+      };
+      detailedGuidance: {
+          singular: string;
+          plural: string;
+      };
+      selectFileButton: {
+          singular: string;
+          plural: string;
+      };
+      fileCategoryMessage: string;
+      fileCategory: {
+          image: string;
+          audio: string;
+          video: string;
+          document: string;
+      };
+  }> & T9nMeta<{
+      heading: {
+          singular: string;
+          plural: string;
+      };
+      detailedGuidance: {
+          singular: string;
+          plural: string;
+      };
+      selectFileButton: {
+          singular: string;
+          plural: string;
+      };
+      fileCategoryMessage: string;
+      fileCategory: {
+          image: string;
+          audio: string;
+          video: string;
+          document: string;
+      };
+  }>;
+  get accept(): string | undefined;
+  /** @default false */
+  accessor disabled: boolean;
+  /** Configures the user-facing direction regarding which file types are recommended. */
+  accessor fileTypeCategories: ReadonlySet<AttachmentTypeCategory> | undefined;
+  accessor heading: string | undefined;
+  /** @default "upload" */
+  accessor icon: IconName;
+  accessor messageOverrides: {
+      heading?: {
+          singular?: string | undefined;
+          plural?: string | undefined;
+      } | undefined;
+      detailedGuidance?: {
+          singular?: string | undefined;
+          plural?: string | undefined;
+      } | undefined;
+      selectFileButton?: {
+          singular?: string | undefined;
+          plural?: string | undefined;
+      } | undefined;
+      fileCategoryMessage?: string | undefined;
+      fileCategory?: {
+          image?: string | undefined;
+          audio?: string | undefined;
+          video?: string | undefined;
+          document?: string | undefined;
+      } | undefined;
+  };
+  /**
+   * Controls whether the native input is configured to enable multiple file selection.
+   *
+   * This does not enforce the limit, particularly if the user pastes or drags and drops attachments;
+   * the event can include multiple files even when this property is false.
+   *
+   * @default false
+   */
+  accessor multipleEnabled: boolean;
+  open(): Promise<void>;
+  /**
+   * This component does not enforce attachment count or file type limits.
+   * Do not rely on these events having only payloads consistent with
+   * the configured multipleEnabled/fileTypeCategories properties.
+   */
+  readonly arcgisFilesSelect: import("@arcgis/lumina").TargetedEvent<this, { files: File[]; }>;
+  readonly "@eventTypes": {
+    arcgisFilesSelect: ArcgisFilePicker["arcgisFilesSelect"]["detail"];
+  };
+}

package/dist/components/arcgis-file-picker/customElement.js

@@ -0,0 +1,117 @@
+/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+import { c as m } from "../../chunks/runtime.js";
+import { css as v, html as c } from "lit";
+import { LitElement as b, createEvent as _, nothing as y, safeClassMap as k } from "@arcgis/lumina";
+import { u as $ } from "../../chunks/useT9n.js";
+import { createRef as d, ref as h } from "lit/directives/ref.js";
+import { getAttachmentTypeCategory as D } from "@arcgis/core/widgets/Attachments/support/attachmentUtils.js";
+import { getElementLocale as F } from "@arcgis/toolkit/intl/dom";
+const T = v`:host{--arcgis-internal-file-picker-minimum-height: 10.875rem;--arcgis-internal-dropzone-danger-background: var( --calcite-notice-background-color, color-mix(in srgb, var(--calcite-color-status-danger) 25%, var(--calcite-color-foreground-1)) );--calcite-button-background-color: var(--calcite-color-foreground-1)}.hidden-input{display:none}.drop-zone{min-block-size:var(--arcgis-internal-file-picker-minimum-height);border:var(--calcite-border-width-sm) dashed var(--calcite-color-border-input);border-radius:var(--calcite-corner-radius-sm);background-color:var(--calcite-color-surface-2);padding:var(--calcite-space-lg) var(--calcite-space-md);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:var(--calcite-space-sm);-webkit-user-select:none;user-select:none;calcite-icon{color:var(--calcite-color-text-3);pointer-events:none}&.drag-active{background-color:var(--calcite-color-surface-highlight);border-color:var(--calcite-color-brand)}&.drag-danger{background-color:var(--arcgis-internal-dropzone-danger-background);border-color:var(--calcite-color-status-danger)}div{line-height:var(--calcite-font-line-height-fixed-base);color:var(--calcite-color-text-1);font-size:var(--calcite-font-size-0);font-weight:var(--calcite-font-weight-regular);text-align:center;pointer-events:none;&.detail{color:var(--calcite-color-text-2);font-size:var(--calcite-font-size--1)}}}`, S = /* @__PURE__ */ new Set(["unknown"]);
+class z extends b {
+  constructor() {
+    super(...arguments), this._messages = $({ blocking: !1 }), this.#i = d(), this.#e = d(), this._dragState = "idle", this.disabled = !1, this.icon = "upload", this.multipleEnabled = !1, this.arcgisFilesSelect = _();
+  }
+  static {
+    this.properties = { _dragState: 16, accept: 32, fileTypeCategories: 0, disabled: 5, heading: 1, icon: 1, messageOverrides: 0, multipleEnabled: 5 };
+  }
+  static {
+    this.styles = T;
+  }
+  static {
+    this.shadowRootOptions = { mode: "open", delegatesFocus: !0 };
+  }
+  #t;
+  #i;
+  #e;
+  get accept() {
+    const e = this.fileTypeCategories;
+    if (!e?.size)
+      return;
+    const t = [];
+    return e.has("image") && t.push("image/*"), e.has("audio") && t.push("audio/*"), e.has("video") && t.push("video/*"), e.has("document") && t.push("text/*", "application/*", "model/*"), t.length > 0 ? t.join(",") : void 0;
+  }
+  async open() {
+    this._openSync();
+  }
+  _handleUpload(e) {
+    const t = e.currentTarget, i = t.files;
+    try {
+      i && this._processFileList(i);
+    } finally {
+      t.value = "";
+    }
+  }
+  _handleDrop(e) {
+    this._applyDropEffects(e), this._dragState = "idle", !this.disabled && e.dataTransfer && this._processFileList(e.dataTransfer?.files);
+  }
+  _handlePaste(e) {
+    e.preventDefault(), !this.disabled && e.clipboardData && this._processFileList(e.clipboardData.files);
+  }
+  _handleDragOver(e) {
+    if (this._applyDropEffects(e), this.disabled)
+      this._dragState = "idle";
+    else {
+      const t = this._isValidTransfer(e.dataTransfer);
+      this._dragState = t ? "valid" : "warning";
+    }
+  }
+  _handleDragLeave({ relatedTarget: e, currentTarget: t }) {
+    e && (e === this.#e.value || e === t) || (this._dragState = "idle");
+  }
+  _handleButtonClick(e) {
+    this.disabled || (e.preventDefault(), e.stopPropagation(), this._openSync());
+  }
+  _handleZoneClick() {
+    this.disabled || (this.#e?.value?.setFocus(), this._dragState = "idle");
+  }
+  _processFileList(e) {
+    const t = Array.from(e);
+    t.length < 1 || this.disabled || this.arcgisFilesSelect.emit({ files: t });
+  }
+  _isValidTransfer(e) {
+    if (!e)
+      return !1;
+    const t = Array.from(e.items);
+    if (t.some(({ kind: s }) => s !== "file"))
+      return !1;
+    const i = t.filter(({ kind: s }) => s === "file");
+    if (!i.length || i.length > 1 && !this.multipleEnabled)
+      return !1;
+    const a = this.fileTypeCategories;
+    return a?.size ? !i.some(({ type: s }) => !a?.has(D(s))) : !0;
+  }
+  _applyDropEffects(e) {
+    e.preventDefault(), e.stopPropagation(), e.dataTransfer && (e.dataTransfer.dropEffect = this.disabled || !C(e.dataTransfer) ? "none" : "copy");
+  }
+  _openSync() {
+    this.#i.value?.click();
+  }
+  _getFileTypeGuidance() {
+    const e = this.fileTypeCategories;
+    if (!e?.size || !e.isDisjointFrom(S))
+      return null;
+    const t = this._messages.fileCategory;
+    if (!t)
+      return null;
+    const i = Array.from(e).map((a) => t[a]);
+    if (this.#t?.resolvedOptions().locale !== this._messages._t9nLocale) {
+      const a = F(this.el);
+      this.#t = new Intl.ListFormat(a.t9nLocale, { type: "conjunction", style: "long" });
+    }
+    return this.#t?.format(i) ?? null;
+  }
+  render() {
+    const { multipleEnabled: e, icon: t, disabled: i, heading: a, _dragState: s } = this, f = s === "valid" && !i, p = s === "warning" && !i, g = a || l(this._messages?.heading, e), u = l(this._messages.detailedGuidance, e), n = this._getFileTypeGuidance(), o = n === null ? null : this._messages?.fileCategoryMessage?.replace("{fileCategories}", n);
+    return c`<div><input accept=${this.accept ?? y} class="hidden-input" data-testid=native-input .disabled=${i} .multiple=${e} @change=${this._handleUpload} type=file ${h(this.#i)}><div .ariaDisabled=${i} class=${k({ "drop-zone": !0, "drag-active": f, "drag-danger": p })} data-testid=drop-zone @click=${this._handleZoneClick} @dragend=${this._handleDragLeave} @dragleave=${this._handleDragLeave} @dragover=${this._handleDragOver} @drop=${this._handleDrop} @paste=${this._handlePaste}><calcite-icon scale=l .icon=${t} data-testid=icon></calcite-icon><div class="heading">${g}</div><div class="detail">${u}</div><calcite-button alignment=center appearance=transparent data-testid=upload-button .disabled=${i} icon-start=folder-open kind=brand @click=${this._handleButtonClick} scale=s width=auto ${h(this.#e)}>${l(this._messages.selectFileButton, e)}</calcite-button>${o != null ? c`<div class="detail" data-testid=file-type>${o}</div>` : void 0}</div></div>`;
+  }
+}
+function l(r, e = !1) {
+  return r ? e ? r.plural : r.singular : "";
+}
+function C(r) {
+  return r?.items.length ? Array.from(r.items).some(({ kind: e }) => e === "file") : !1;
+}
+m("arcgis-file-picker", z);
+export {
+  z as ArcgisFilePicker
+};

package/dist/components/arcgis-file-picker/index.js

@@ -0,0 +1,3 @@
+import "@esri/calcite-components/components/calcite-icon";
+import "@esri/calcite-components/components/calcite-button";
+export * from "./customElement.js";

package/dist/components/arcgis-filter-builder/customElement.d.ts

@@ -0,0 +1,201 @@
+/// <reference path="../../index.d.ts" />
+import type Collection from "@arcgis/core/core/Collection.js";
+import type FilterConditionViewModel from "@arcgis/core/widgets/support/FilterCondition/FilterConditionViewModel.js";
+import type { AddConditionParameters } from "@arcgis/core/widgets/support/FilterBuilder/types.js";
+import type { ConditionOperatorName, OperatorNamesByFieldType } from "@arcgis/core/widgets/support/FilterCondition/types.js";
+import type { PublicLitElement as LitElement } from "@arcgis/lumina";
+import type { ArcgisReferenceElement } from "../types.js";
+import type { T9nMeta } from "@arcgis/lumina/controllers";
+import type { AssociationsLayerUnion } from "@arcgis/core/widgets/BatchAttributeForm/types.js";
+
+/**
+ * The Filter Builder component can be used to create and manage filter conditions for a specific layer.
+ * It provides a user interface for defining filter criteria, allowing users to build complex queries based on
+ * the attributes of the selected layer.
+ *
+ * @internal
+ */
+export abstract class ArcgisFilterBuilder extends LitElement {
+  get _conditionViewModels(): Collection<FilterConditionViewModel>;
+  /** @default false */
+  accessor autoDestroyDisabled: boolean;
+  /** The logical operator used to combine multiple filter conditions. */
+  accessor conditionOperator: ConditionOperatorName;
+  /** The number of filter conditions currently defined in the filter builder. */
+  get count(): number;
+  /**
+   * When true, the component is visually de-emphasized and does not accept user interaction.
+   *
+   * @default false
+   */
+  accessor disabled: boolean;
+  /**
+   * Controls visibility of the floating action button used to add new conditions. If true, the button will be hidden.
+   *
+   * @default false
+   */
+  accessor hideFab: boolean;
+  /**
+   * Controls visibility of the header section of the filter builder. If true, the header will be hidden.
+   *
+   * @default false
+   */
+  accessor hideHeader: boolean;
+  /**
+   * Controls visibility of the menu used to delete or duplicate conditions. If true, the menu will be hidden.
+   *
+   * @default false
+   */
+  accessor hideMenu: boolean;
+  /** The layer for which the filter conditions are being defined. */
+  accessor layer: AssociationsLayerUnion | null | undefined;
+  /** @internal */
+  protected messages: Partial<{
+      componentLabel: string;
+      addNew: string;
+      allAreTrue: string;
+      anyAreTrue: string;
+      chooseAField: string;
+      condition: string;
+      conditions: {
+          and: string;
+          or: string;
+      };
+      delete: string;
+      duplicate: string;
+      filterCondition: string;
+      moreOptions: string;
+      operator: string;
+      operators: {
+          contains: string;
+          doesNotContain: string;
+          endsWith: string;
+          excludes: string;
+          includes: string;
+          inTheLast: string;
+          is: string;
+          isAfter: string;
+          isAfterOrEqual: string;
+          isAtLeast: string;
+          isAtMost: string;
+          isBefore: string;
+          isBeforeOrEqual: string;
+          isBetween: string;
+          isBlank: string;
+          isEmpty: string;
+          isGreaterThan: string;
+          isLessThan: string;
+          isNot: string;
+          isNotBetween: string;
+          isNotBlank: string;
+          isNotEmpty: string;
+          isNotInTheLast: string;
+          isNotOn: string;
+          isOn: string;
+          startsWith: string;
+      };
+      value: string;
+  }> & T9nMeta<{
+      componentLabel: string;
+      addNew: string;
+      allAreTrue: string;
+      anyAreTrue: string;
+      chooseAField: string;
+      condition: string;
+      conditions: {
+          and: string;
+          or: string;
+      };
+      delete: string;
+      duplicate: string;
+      filterCondition: string;
+      moreOptions: string;
+      operator: string;
+      operators: {
+          contains: string;
+          doesNotContain: string;
+          endsWith: string;
+          excludes: string;
+          includes: string;
+          inTheLast: string;
+          is: string;
+          isAfter: string;
+          isAfterOrEqual: string;
+          isAtLeast: string;
+          isAtMost: string;
+          isBefore: string;
+          isBeforeOrEqual: string;
+          isBetween: string;
+          isBlank: string;
+          isEmpty: string;
+          isGreaterThan: string;
+          isLessThan: string;
+          isNot: string;
+          isNotBetween: string;
+          isNotBlank: string;
+          isNotEmpty: string;
+          isNotInTheLast: string;
+          isNotOn: string;
+          isOn: string;
+          startsWith: string;
+      };
+      value: string;
+  }>;
+  /** The list of operators available for use in filter conditions. */
+  accessor operators: OperatorNamesByFieldType;
+  /**
+   * By assigning the `id` attribute of the Map or Scene component to this property, you can position a child component anywhere in the DOM while still maintaining a connection to the Map or Scene.
+   *
+   * @see [Associate components with a Map or Scene component](https://developers.arcgis.com/javascript/latest/programming-patterns/#associate-components-with-a-map-or-scene-component)
+   */
+  accessor referenceElement: ArcgisReferenceElement | string | undefined;
+  /**
+   * Indicates the current state of the filter builder. This depends on the load state of
+   * the associated layer.
+   */
+  get state(): "disabled" | "loading" | "ready";
+  /**
+   * Controls the visual scale of the filter builder component.
+   *
+   * @default "m"
+   */
+  accessor visualScale: "l" | "m" | "s";
+  /** The SQL WHERE clause generated from the current filter conditions. */
+  get whereClause(): string;
+  /** An array of individual SQL WHERE clauses generated from the current filter conditions. */
+  get whereClauses(): string[];
+  /**
+   * Adds a new filter condition to the filter builder. The new condition can be configured with an optional field name, operator, and value.
+   *
+   * @param params - The configuration parameters for the new condition, including optional fieldName, operator, and value.
+   * @param index - The index at which to insert the new condition. If not provided, the condition is added to the end.
+   * @internal
+   */
+  addCondition(params?: AddConditionParameters, index?: number): Promise<void>;
+  destroy(): Promise<void>;
+  /**
+   * Duplicates the filter condition at the specified index. The duplicated condition will be inserted immediately after the original condition.
+   *
+   * @param index - The index of the condition to duplicate.
+   */
+  duplicateConditionByIndex(index: number): Promise<void>;
+  /**
+   * Removes the filter condition at the specified index from the filter builder.
+   *
+   * @param index - The index of the condition to remove.
+   */
+  removeConditionByIndex(index: number): Promise<void>;
+  /**
+   * Resets the filter builder by removing all existing conditions and clearing the generated WHERE clause.
+   * This method effectively returns the filter builder to its initial state.
+   */
+  reset(): Promise<void>;
+  /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
+  readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "whereClause"; }>;
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
+  readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
+  readonly "@eventTypes": {
+    arcgisPropertyChange: ArcgisFilterBuilder["arcgisPropertyChange"]["detail"];
+    arcgisReady: ArcgisFilterBuilder["arcgisReady"]["detail"];
+  };
+}

package/dist/components/arcgis-filter-builder/customElement.js

@@ -0,0 +1,123 @@
+/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
+import { c as u } from "../../chunks/runtime.js";
+import { css as h, html as s } from "lit";
+import { keyed as n } from "lit/directives/keyed.js";
+import { getEffectiveFieldAlias as p } from "@arcgis/core/editing/fieldUtils.js";
+import m from "@arcgis/core/widgets/support/FilterBuilder/FilterBuilderViewModel.js";
+import { LitElement as $, createEvent as g, safeClassMap as c } from "@arcgis/lumina";
+import { usePropertyChange as f } from "@arcgis/lumina/controllers";
+import { u as b } from "../../chunks/useT9n.js";
+import { m as v } from "../../chunks/useViewModel.js";
+const C = h`:host{display:flex;flex-direction:column;width:100%;height:100%;background-color:var(--calcite-color-background)}.root{display:flex;flex-direction:column}.operator-select-container{padding:var(--calcite-space-sm)}calcite-fab{display:flex;flex-direction:row;align-self:center;margin-block:var(--calcite-space-md)}calcite-block{margin-block:0}calcite-block div{display:flex;flex-direction:column;gap:var(--calcite-space-sm)}`, o = {
+  operatorSelectContainer: "operator-select-container",
+  conditionContainer: "condition-container"
+}, y = v(m);
+class S extends $ {
+  constructor() {
+    super(...arguments), this.#e = !1, this.messages = b(), this.viewModel = y(this), this.autoDestroyDisabled = !1, this.conditionOperator = this.viewModel.conditionOperator, this.hideFab = !1, this.hideHeader = !1, this.hideMenu = !1, this.layer = this.viewModel.layer, this.operators = this.viewModel.operators, this.visualScale = "m", this.arcgisPropertyChange = f()("whereClause"), this.arcgisReady = g();
+  }
+  static {
+    this.properties = { _conditionViewModels: 32, autoDestroyDisabled: 5, conditionOperator: 1, count: 32, disabled: 5, hideFab: 5, hideHeader: 5, hideMenu: 5, layer: 0, operators: 0, referenceElement: 1, state: 32, visualScale: 1, whereClause: 32, whereClauses: 32 };
+  }
+  static {
+    this.styles = C;
+  }
+  #e;
+  get _conditionViewModels() {
+    return this.viewModel.conditionViewModels;
+  }
+  get count() {
+    return this.viewModel.count;
+  }
+  get disabled() {
+    return this.#e || this.state === "disabled";
+  }
+  set disabled(e) {
+    this.#e = e;
+  }
+  get state() {
+    return this.viewModel.state;
+  }
+  get whereClause() {
+    return this.viewModel.whereClause;
+  }
+  get whereClauses() {
+    return this.viewModel.whereClauses;
+  }
+  async addCondition(e, t) {
+    this.viewModel.addCondition(e, t);
+  }
+  async destroy() {
+    await this.manager.destroy();
+  }
+  async duplicateConditionByIndex(e) {
+    this.viewModel.duplicateConditionByIndex(e);
+  }
+  async removeConditionByIndex(e) {
+    this.viewModel.removeConditionByIndex(e);
+  }
+  async reset() {
+    this.viewModel.reset();
+  }
+  load() {
+    this.manager.onLifecycle(() => [this._conditionViewModels.on("after-remove", (e) => e.item.destroy())]);
+  }
+  _afterValueChange(e, t) {
+    t == null || t === "" ? e.value = null : e.isNumericField || e.isObjectIDField ? e.value = parseFloat(t) : (e.isStringField || e.isGlobalIDField) && (e.value = t);
+  }
+  #i() {
+    if (this.count < 2)
+      return;
+    const { conditionOperator: e, messages: t } = this, a = e === "AND";
+    return s`<div class=${c(o.operatorSelectContainer)}><calcite-select .label=${t.condition ?? ""} .scale=${this.visualScale} width=full @calciteSelectChange=${({ currentTarget: i }) => {
+      this.conditionOperator = i.value;
+    }}><calcite-option .label=${t.allAreTrue} .selected=${a} value=AND></calcite-option><calcite-option .label=${t.anyAreTrue} .selected=${!a} value=OR></calcite-option></calcite-select></div>`;
+  }
+  #a() {
+    return this._conditionViewModels.toArray().map((e) => this.#l(e));
+  }
+  #s() {
+    if (this.hideFab)
+      return;
+    const e = this.state === "loading";
+    return s`<calcite-fab appearance=outline-fill .disabled=${e || this.disabled} icon=plus kind=neutral .loading=${e} .scale=${this.visualScale} .text=${this.messages.addNew} text-enabled @click=${() => this.addCondition()}></calcite-fab>`;
+  }
+  #l(e) {
+    const t = this.state === "loading";
+    return n(e, s`<calcite-block class=${c(o.conditionContainer)} .disabled=${this.disabled || e.state === "disabled"} expanded .loading=${t} .heading=${this.messages.condition} .scale=${this.visualScale}><div>${this.#r(e)}${this.#n(e)}${this.#c(e)}</div>${this.#o(e)}</calcite-block>`);
+  }
+  #r(e) {
+    const { layer: t } = this, { normalizedFieldName: a } = e;
+    return s`<calcite-select .label=${this.messages.chooseAField ?? ""} .scale=${this.visualScale} width=full @calciteSelectChange=${({ currentTarget: i }) => {
+      e.value = null, e.fieldName = i.value, e.visibleOperators.includes(e.operator) || (e.operator = e.visibleOperators[0]);
+    }}>${e.fields.map((i) => this.#t(i.name, p(i, t), a))}</calcite-select>`;
+  }
+  #n(e) {
+    const { operator: t, visibleOperators: a } = e, { messages: i } = this;
+    return s`<calcite-select .label=${i.operator ?? ""} required .scale=${this.visualScale} width=full @calciteSelectChange=${(l) => {
+      e.operator = l.currentTarget.value;
+    }}>${a.map((l) => this.#t(l, i.operators?.[l], t))}</calcite-select>`;
+  }
+  #t(e, t, a) {
+    return n(e, s`<calcite-option .label=${t ?? e} .selected=${e === a} .value=${e}></calcite-option>`);
+  }
+  #c(e) {
+    const { domain: t, operator: a, valueAsString: i } = e, { messages: l } = this;
+    if (!e.valueInputIsHidden)
+      return t?.type === "coded-value" && t.codedValues.length && (a === "is" || a === "isNot") ? s`<calcite-select .label=${l.value ?? ""} required .scale=${this.visualScale} width=full @calciteSelectChange=${({ currentTarget: r }) => this._afterValueChange(e, r.value)}>${t.codedValues.map(({ code: r, name: d }) => this.#t(`${r}`, d, i))}</calcite-select>` : s`<calcite-input .label=${l.value} .scale=${this.visualScale} .type=${e.isNumericField || e.isObjectIDField ? "number" : "text"} .value=${i} @calciteInputInput=${({ currentTarget: r }) => this._afterValueChange(e, r.value)}></calcite-input>`;
+  }
+  #o(e) {
+    if (this.hideMenu)
+      return;
+    const { messages: t, viewModel: a, visualScale: i } = this;
+    return s`<div slot=header-menu-actions><calcite-action icon=trash .scale=${i} .text=${t.delete ?? ""} text-enabled @click=${() => a.removeCondition(e)}></calcite-action><calcite-action icon=copy .scale=${i} .text=${t.duplicate ?? ""} text-enabled @click=${() => a.duplicateCondition(e)}></calcite-action></div>`;
+  }
+  render() {
+    const e = this.hideHeader ? void 0 : this.messages.componentLabel;
+    return s`<calcite-panel .disabled=${this.disabled} .heading=${e} .scale=${this.visualScale}>${this.#i()}${this.#a()}${this.#s()}</calcite-panel>`;
+  }
+}
+u("arcgis-filter-builder", S);
+export {
+  S as ArcgisFilterBuilder
+};

package/dist/components/arcgis-filter-builder/index.js

@@ -0,0 +1,8 @@
+import "@esri/calcite-components/components/calcite-select";
+import "@esri/calcite-components/components/calcite-option";
+import "@esri/calcite-components/components/calcite-fab";
+import "@esri/calcite-components/components/calcite-block";
+import "@esri/calcite-components/components/calcite-input";
+import "@esri/calcite-components/components/calcite-action";
+import "@esri/calcite-components/components/calcite-panel";
+export * from "./customElement.js";

package/dist/components/arcgis-floor-filter/customElement.d.ts

@@ -208,7 +208,7 @@ export abstract class ArcgisFloorFilter extends LitElement {
   destroy(): Promise<void>;
   /** @param webMap */
   updateWebDocument(webMap: WebMap | WebScene): Promise<void>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {
     arcgisReady: ArcgisFloorFilter["arcgisReady"]["detail"];

package/dist/components/arcgis-floor-filter/customElement.js

@@ -13,7 +13,7 @@ import { u as N } from "../../chunks/useT9n.js";
 import { m as S } from "../../chunks/useViewModel.js";
 import { H as w, i as C } from "../../chunks/heading.js";
 import { g as d } from "../../chunks/globalCss.js";
-import { createStore as E } from "@arcgis/lumina/controllers/accessor";
+import { createStore as E } from "@arcgis/lumina-toolkit/store";
 import { createRef as x, ref as p } from "lit/directives/ref.js";
 import { g as A } from "../../chunks/async-utils.js";
 const h = "floor-filter", v = `${h}__filter-menu`, o = {

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

@@ -64,7 +64,7 @@ export abstract class ArcgisFullscreen extends LitElement {
   };
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "state"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {
     arcgisPropertyChange: ArcgisFullscreen["arcgisPropertyChange"]["detail"];

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

@@ -1,13 +1,13 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { c } from "../../chunks/runtime.js";
-import { css as r, html as n } from "lit";
-import { LitElement as i, createEvent as a, safeClassMap as u, nothing as m } from "@arcgis/lumina";
+import { c as o } from "../../chunks/runtime.js";
+import { css as c, html as r } from "lit";
+import { LitElement as i, createEvent as a, nothing as u, safeClassMap as m } from "@arcgis/lumina";
 import { usePropertyChange as d } from "@arcgis/lumina/controllers";
 import { getClosestElement as f, classes as h } from "@arcgis/toolkit/dom";
 import { u as g } from "../../chunks/useT9n.js";
 import { u as p } from "../../chunks/useView.js";
 import { g as v } from "../../chunks/globalCss.js";
-const b = r`.arcgis-button{--calcite-icon-color: var(--calcite-color-text-3);--calcite-button-background-color: var(--calcite-color-foreground-1);color:var(--calcite-color-text-3);line-height:var(--calcite-font-line-height-relative-tight);calcite-button{--calcite-offset-invert-focus: 1}display:flex;flex-flow:column;cursor:pointer;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);:hover{--calcite-icon-color: var(--calcite-color-text-1);--calcite-button-background-color: var(--calcite-color-transparent-hover)}}`;
+const b = c`.arcgis-button{--calcite-icon-color: var(--calcite-color-text-3);--calcite-button-background-color: var(--calcite-color-foreground-1);color:var(--calcite-color-text-3);line-height:var(--calcite-font-line-height-relative-tight);calcite-button{--calcite-offset-invert-focus: 1}display:flex;flex-flow:column;cursor:pointer;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);:hover{--calcite-icon-color: var(--calcite-color-text-1);--calcite-button-background-color: var(--calcite-color-transparent-hover)}}`;
 function E(s) {
   return s.includes("#") || s.includes(".") || s.includes("[") ? s : `#${s}`;
 }
@@ -22,8 +22,7 @@ class x extends i {
     this.styles = b;
   }
   get fullscreenTitle() {
-    const e = this.state;
-    return e === "active" ? this.messages.exit : e === "ready" ? this.messages.enter : "";
+    return this.state === "active" ? this.messages.exit : this.messages.enter;
   }
   #e;
   get element() {
@@ -50,14 +49,14 @@ class x extends i {
     return this.element ?? e?.parentElement ?? l ?? null;
   }
   _toggle() {
-    document.fullscreenElement ? document.exitFullscreen() : this._getElement()?.requestFullscreen();
+    this.state !== "unsupported" && (document.fullscreenElement ? document.exitFullscreen() : this._getElement()?.requestFullscreen());
   }
   render() {
-    const { fullscreenTitle: e, state: t } = this, l = t === "unsupported", o = t === "ready" || t === "disabled" || t === "unsupported" ? "zoom-out-fixed" : "zoom-in-fixed";
-    return n`<div class=${u(h("root", v.arcgisButton))}>${!l && n`<calcite-button .disabled=${t === "disabled"} .iconStart=${o} kind=neutral .label=${e} @click=${this._toggle} .scale=${this.visualScale} title=${e ?? m}></calcite-button>` || ""}</div>`;
+    const { fullscreenTitle: e, state: t } = this, l = t === "unsupported", n = t === "ready" || t === "disabled" || t === "unsupported" ? "zoom-out-fixed" : "zoom-in-fixed";
+    return r`<div class=${m(h("root", v.arcgisButton))}><calcite-button .disabled=${t === "disabled" || l} .iconStart=${n} kind=neutral .label=${e} @click=${this._toggle} .scale=${this.visualScale} title=${e ?? u}></calcite-button></div>`;
   }
 }
-c("arcgis-fullscreen", x);
+o("arcgis-fullscreen", x);
 export {
   x as ArcgisFullscreen
 };

package/dist/components/arcgis-grid-controls/customElement.d.ts

@@ -295,7 +295,7 @@ export abstract class ArcgisGridControls extends LitElement {
    */
   accessor snappingEnabled: boolean;
   /**
-   * The [SnappingOptions](https://developers.arcgis.com/javascript/latest/references/core/views/interactive/snapping/SnappingOptions/)
+   * The [SnappingOptions](https://developers.arcgis.com/javascript/latest/references/core/views/interactive/options/SnappingOptions/)
    * that will be controlled by this component if the snapping toggle is enabled for display.
    * If SnappingOptions are provided, grid display will be automatically enabled or disabled to match snapping state.
    */
@@ -342,7 +342,7 @@ export abstract class ArcgisGridControls extends LitElement {
   trySetDisplayEnabled(enabled: boolean): void;
   /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
   readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "customColor" | "theme" | "spacing" | "rotation" | "majorLineInterval" | "rotateWithMap" | "dynamicScaling" | "snappingEnabled" | "interactivePlacementState" | "displayEnabled" | "gridOutOfScale" | "effectiveSpacingAfterDynamicScaling" | "gridControlsEnabled" | "gridColor"; }>;
-  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  /** Emitted when the component associated with a map or scene view is ready for user interaction. */
   readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
   readonly "@eventTypes": {
     arcgisPropertyChange: ArcgisGridControls["arcgisPropertyChange"]["detail"];