@geoscene/map-components 4.33.20 → 5.0.19

package/dist/components/geoscene-elevation-profile-legend-item/customElement.js

@@ -0,0 +1,75 @@
+/* COPYRIGHT GeoScene - https://js.geoscene.cn/5.0/LICENSE.txt */
+import { c as d } from "../../chunks/runtime.js";
+import { css as h, html as s } from "lit";
+import { substitute as p } from "@geoscene/core/intl.js";
+import { LitElement as g, createEvent as u, safeClassMap as b, safeStyleMap as f, nothing as n } from "@geoscene/lumina";
+const v = h`:host{--internal-block-spacing: var(--calcite-spacing-sm-plus);--internal-inline-spacing: var(--calcite-spacing-md);--internal-collapse-toggle-size: 32px;--internal-color-indicator-width: 3px;--internal-opacity-disabled: .4}.container{position:relative;background:var(--calcite-color-foreground-2)}.disabled{filter:grayscale(1);opacity:var(--internal-opacity-disabled)}.color-indicator{position:absolute;inset-inline-start:0;top:0;width:var(--internal-color-indicator-width);height:100%}.header{display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.content{display:block;padding:var(--internal-block-spacing) var(--internal-inline-spacing);padding-top:0}.collapse-toggle{flex-shrink:0;width:var(--internal-collapse-toggle-size);height:var(--internal-collapse-toggle-size)}.label{--calcite-label-margin-bottom: 0;flex-grow:1;flex-shrink:1;padding-inline-start:var(--internal-inline-spacing);min-width:0}`;
+class m extends g {
+  constructor() {
+    super(...arguments), this.expanded = !1, this.featureSelected = !1, this.hideCheckbox = !1, this.geosceneExpandedToggle = u();
+  }
+  static {
+    this.properties = { effectiveDisplayUnits: 0, expanded: 5, featureSelected: 5, hideCheckbox: 5, messages: 0, result: 0 };
+  }
+  static {
+    this.styles = v;
+  }
+  async destroy() {
+    await this.manager.destroy();
+  }
+  render() {
+    return s`<div class=${b({
+      container: !0,
+      expanded: this.expanded,
+      disabled: this._disabled
+    })}>${this._renderColorIndicator()}<div class="header">${this._renderLabelWithCheckbox()}${this._renderCollapseToggleButton()}</div>${this.expanded ? this._renderStatistics() : void 0}</div>`;
+  }
+  _renderColorIndicator() {
+    return s`<div class="color-indicator" style=${f({ backgroundColor: this.result.profile.color.toCss() })}></div>`;
+  }
+  _renderCollapseToggleButton() {
+    const { expanded: e, messages: t } = this, i = t[e ? "hideDetails" : "showDetails"] ?? "";
+    return s`<calcite-action class="collapse-toggle" data-testid=${`legend-toggle-${this.result.profile.id}`} .icon=${e ? "chevron-up" : "chevron-down"} @click=${() => this.geosceneExpandedToggle.emit(this.result.profile)} .text=${i} title=${i ?? n}></calcite-action>`;
+  }
+  _renderLabelWithCheckbox() {
+    const { result: e, hideCheckbox: t, messages: i } = this;
+    return s`<calcite-label class="label" layout=inline>${t ? void 0 : this._renderCheckbox()}${r(e, i)}</calcite-label>`;
+  }
+  _renderCheckbox() {
+    const { result: e, messages: t } = this, { profile: i } = e, l = i.enabled, c = t[l ? "hideProfile" : "showProfile"] ?? "", o = p(c, {
+      name: r(e, t)
+    });
+    return s`<calcite-checkbox .checked=${l} class="checkbox" title=${o ?? n} .disabled=${this._disabled} @calciteCheckboxChange=${() => {
+      i.enabled = !i.enabled;
+    }}></calcite-checkbox>`;
+  }
+  _renderStatistics() {
+    return s`<div class="content"><geoscene-elevation-profile-statistics .messages=${this.messages} .result=${this._disabled ? void 0 : this.result} .effectiveDisplayUnits=${this.effectiveDisplayUnits}></geoscene-elevation-profile-statistics></div>`;
+  }
+  get _disabled() {
+    return !this.featureSelected && this.result.profile.type === "input";
+  }
+}
+function r({ profile: a }, { profiles: e }) {
+  const t = a.title;
+  if (t != null)
+    return t;
+  if (!e)
+    return "";
+  switch (a.type) {
+    case "ground":
+      return e.ground;
+    case "input":
+      return e.input;
+    case "query":
+      return e.query;
+    case "scene":
+      return e.scene;
+    default:
+      return "";
+  }
+}
+d("geoscene-elevation-profile-legend-item", m);
+export {
+  m as GeosceneElevationProfileLegendItem
+};

package/dist/components/geoscene-elevation-profile-legend-item/index.js

@@ -0,0 +1,5 @@
+import "@geoscene/calcite-components/components/calcite-action";
+import "@geoscene/calcite-components/components/calcite-label";
+import "@geoscene/calcite-components/components/calcite-checkbox";
+import "../geoscene-elevation-profile-statistics/index.js";
+export * from "./customElement.js";

package/dist/components/geoscene-elevation-profile-settings/customElement.js

@@ -0,0 +1,60 @@
+/* COPYRIGHT GeoScene - https://js.geoscene.cn/5.0/LICENSE.txt */
+import { c } from "../../chunks/runtime.js";
+import { ref as o } from "lit/directives/ref.js";
+import { css as r, html as t } from "lit";
+import { LitElement as h, createEvent as p, nothing as s } from "@geoscene/lumina";
+import { V as l } from "../../chunks/visible-element.js";
+const g = r`:host{--geoscene-unit-select-inline-size: 180px}calcite-popover[calcite-hydrated-hidden]{inset-block-start:-999999px;inset-inline-start:-999999px}.popover-content{display:flex;flex-direction:column;gap:var(--calcite-spacing-md);padding:var(--calcite-spacing-md);max-width:300px}.uniform-chart-scaling-label{--calcite-label-margin-bottom: 0}.uniform-chart-scaling-checkbox-wrapper{width:var(--geoscene-unit-select-inline-size);flex-shrink:0}`;
+class d extends h {
+  constructor() {
+    super(...arguments), this._onUniformChartScalingChange = (e) => {
+      this.geosceneElevationProfileSettingsUniformChartScalingChange.emit(e.currentTarget.checked);
+    }, this._onActionRef = (e) => {
+      this._actionElement = e ?? void 0;
+    }, this._popoverIsOpen = !1, this.hideDistanceDisplayUnitSelect = !1, this.hideElevationDisplayUnitSelect = !1, this.hideUniformChartScalingToggle = !1, this.geosceneElevationProfileSettingsUniformChartScalingChange = p();
+  }
+  static {
+    this.properties = { _popoverIsOpen: 16, _actionElement: 16, viewModel: 0, hideDistanceDisplayUnitSelect: 5, hideElevationDisplayUnitSelect: 5, hideUniformChartScalingToggle: 5, messages: 0, uniformChartScaling: 5, unitOptionsDistance: 0, unitOptionsElevation: 0 };
+  }
+  static {
+    this.styles = g;
+  }
+  async destroy() {
+    await this.manager.destroy();
+  }
+  _onPopoverClose() {
+    this._popoverIsOpen = !1;
+  }
+  _onPopoverOpen() {
+    this._popoverIsOpen = !0;
+  }
+  render() {
+    const { messages: e } = this;
+    if (!e || this.hideDistanceDisplayUnitSelect && this.hideElevationDisplayUnitSelect && this.hideUniformChartScalingToggle)
+      return;
+    const i = (this._popoverIsOpen ? e.hideSettings : e.showSettings) ?? "";
+    return t`<calcite-action data-testid=settings-button icon=gear .text=${i} title=${i ?? s} ${o(this._onActionRef)}></calcite-action>${this._actionElement ? t`<calcite-popover auto-close .label=${i} placement=bottom-end .referenceElement=${this._actionElement} @calcitePopoverOpen=${this._onPopoverOpen} @calcitePopoverClose=${this._onPopoverClose}><div class="popover-content">${this._renderUnitSelector()}${this._renderUniformChartScalingToggle()}</div></calcite-popover>` : void 0}`;
+  }
+  _renderUnitSelector() {
+    const { viewModel: e, messages: i } = this;
+    if (!e || this.hideDistanceDisplayUnitSelect && this.hideElevationDisplayUnitSelect)
+      return;
+    const n = "inline-space-between";
+    return t`${l({ hidden: this.hideDistanceDisplayUnitSelect, children: t`<geoscene-unit-select .options=${this.unitOptionsDistance} .selectLabel=${i.unitDistanceSelectLabel} .value=${e.distanceUnit} .layout=${n} @geosceneUnitSelectChange=${(a) => {
+      e.distanceUnit = a.detail;
+    }}></geoscene-unit-select>` })}${l({ hidden: this.hideElevationDisplayUnitSelect, children: t`<geoscene-unit-select .options=${this.unitOptionsElevation} .selectLabel=${i.unitElevationSelectLabel} .value=${e.elevationUnit} .layout=${n} @geosceneUnitSelectChange=${(a) => {
+      e.elevationUnit = a.detail;
+    }}></geoscene-unit-select>` })}`;
+  }
+  _renderUniformChartScalingToggle() {
+    const { messages: e, hideUniformChartScalingToggle: i, uniformChartScaling: n } = this;
+    if (i)
+      return;
+    const a = e?.[n ? "uniformChartScalingDisable" : "uniformChartScalingEnable"] ?? "";
+    return t`<calcite-label class="uniform-chart-scaling-label" layout=inline-space-between>${e?.uniformChartScalingLabel}<div class="uniform-chart-scaling-checkbox-wrapper"><calcite-checkbox .checked=${n} title=${a ?? s} @calciteCheckboxChange=${this._onUniformChartScalingChange}></calcite-checkbox></div></calcite-label>`;
+  }
+}
+c("geoscene-elevation-profile-settings", d);
+export {
+  d as GeosceneElevationProfileSettings
+};

package/dist/components/geoscene-elevation-profile-settings/index.js

@@ -0,0 +1,6 @@
+import "@geoscene/calcite-components/components/calcite-action";
+import "@geoscene/calcite-components/components/calcite-popover";
+import "../geoscene-unit-select/index.js";
+import "@geoscene/calcite-components/components/calcite-label";
+import "@geoscene/calcite-components/components/calcite-checkbox";
+export * from "./customElement.js";

package/dist/components/geoscene-elevation-profile-statistics/customElement.js

@@ -0,0 +1,57 @@
+/* COPYRIGHT GeoScene - https://js.geoscene.cn/5.0/LICENSE.txt */
+import { c as l } from "../../chunks/runtime.js";
+import { css as o, html as r } from "lit";
+import c from "@geoscene/core/applications/Components/QuantityFormatter.js";
+import { LitElement as v, createEvent as g } from "@geoscene/lumina";
+const d = o`:host{--internal-block-spacing: var(--calcite-spacing-sm-plus);--internal-inline-spacing: var(--calcite-spacing-md);--internal-columns: 1;--internal-icon-size: 16px;container-type:inline-size}.container{display:grid;isolation:isolate;grid-template-columns:repeat(var(--internal-columns, 1),1fr);gap:var(--calcite-spacing-xxs) var(--calcite-spacing-md)}.statistic{display:block;width:max-content;text-align:start;white-space:nowrap}.statistic-label,.statistic-value,.slope-values{font-size:var(--calcite-font-size-xs);font-weight:var(--calcite-font-weight-bold)}.statistic-label{font-weight:var(--calcite-font-weight-regular)}.statistic-value{margin-top:-.15em}.slope-values{display:flex;align-items:center;calcite-icon{width:var(--internal-icon-size);height:var(--internal-icon-size)}}@container (width > 200px){.container{--internal-columns: 2}}@container (width > 400px){.container{--internal-columns: 4}}@container (width > 800px){.container{--internal-columns: 8}}`;
+class p extends v {
+  constructor() {
+    super(...arguments), this._formatter = new c(), this.geosceneExpandedToggle = g();
+  }
+  static {
+    this.properties = { effectiveDisplayUnits: 0, messages: 0, result: 0 };
+  }
+  static {
+    this.styles = d;
+  }
+  async destroy() {
+    await this.manager.destroy();
+  }
+  async load() {
+    await this._formatter.when();
+  }
+  render() {
+    const e = this.messages?.statistics;
+    if (e)
+      return r`<div class="container">${this._renderDistance("maxDistance", e.maxDistance)}${this._renderElevation("elevationGain", e.gain)}${this._renderElevation("elevationLoss", e.loss)}${this._renderElevation("minElevation", e.minElevation)}${this._renderElevation("maxElevation", e.maxElevation)}${this._renderElevation("avgElevation", e.avgElevation)}${this._renderSlope("maxPositiveSlope", "maxNegativeSlope", e.maxSlope)}${this._renderSlope("avgPositiveSlope", "avgNegativeSlope", e.avgSlope)}</div>`;
+  }
+  _renderDistance(e, i) {
+    const a = this._renderValue(e, (t) => {
+      const s = this.effectiveDisplayUnits?.distance;
+      return s ? this._formatter.formatLength({ type: "length", value: t, unit: s }, n) : "";
+    });
+    return this._renderStatistic(i, a);
+  }
+  _renderElevation(e, i) {
+    const a = this._renderValue(e, (t) => {
+      const s = this.effectiveDisplayUnits?.elevation;
+      return s ? this._formatter.formatVerticalLength({ type: "length", value: t, unit: s }, n) : "";
+    });
+    return this._renderStatistic(i, a);
+  }
+  _renderSlope(e, i, a) {
+    return this._renderStatistic(a, r`<div class="slope-values"><calcite-icon icon=arrow-up scale=s></calcite-icon>${this._renderValue(e, (t) => this._formatter.formatAngleDegrees(t, "degrees", "geographic", "geographic", n))}<calcite-icon icon=arrow-down scale=s></calcite-icon>${this._renderValue(i, (t) => this._formatter.formatAngleDegrees(t, "degrees", "geographic", "geographic", n))}</div>`);
+  }
+  _renderStatistic(e, i) {
+    return r`<div class="statistic"><label class="statistic-label">${e}</label><div class="statistic-value">${i}</div></div>`;
+  }
+  _renderValue(e, i) {
+    const { result: a } = this, t = a?.progress === 1 ? a.statistics?.[e] : void 0;
+    return t == null ? " ― " : i(t);
+  }
+}
+const n = 1;
+l("geoscene-elevation-profile-statistics", p);
+export {
+  p as GeosceneElevationProfileStatistics
+};

package/dist/components/geoscene-elevation-profile-statistics/index.js

@@ -0,0 +1,2 @@
+import "@geoscene/calcite-components/components/calcite-icon";
+export * from "./customElement.js";

package/dist/components/geoscene-expand/customElement.d.ts

@@ -1,151 +1,229 @@
-/// <reference types="@geoscene/core/interfaces.d.ts" />
-/// <reference types="../../index.d.ts" />
-import { Use } from '@geoscene/lumina/controllers';
-import { default as Expand } from '@geoscene/core/widgets/Expand.js';
-import { PublicLitElement as LitElement, TargetedEvent } from '@geoscene/lumina';
-import { GeosceneReferenceElement } from '../../utils/component-utils';
+/// <reference path="../../index.d.ts" />
+import type LinkChartView from "@geoscene/core/views/LinkChartView.js";
+import type MapView from "@geoscene/core/views/MapView.js";
+import type SceneView from "@geoscene/core/views/SceneView.js";
+import type { GeosceneReferenceElement, IconName } from "../types.js";
+import type { PublicLitElement as LitElement } from "@geoscene/lumina";
+import type { T9nMeta } from "@geoscene/lumina/controllers";
+import type { ExpandState } from "./types.js";
+import type { Panel as Panel } from "@geoscene/calcite-components/components/calcite-panel";
+import type { Action as Action } from "@geoscene/calcite-components/components/calcite-action";
 
-declare const useExpandWidget: (component: LitElement & Pick<Expand, "icon" | "label" | "viewModel" | "autoCollapse" | "closeOnEsc" | "collapseIcon" | "collapseTooltip" | "content" | "expandIcon" | "expandTooltip" | "expanded" | "focusTrapDisabled" | "group" | "iconNumber" | "mode" | "placement"> & {
-    state?: unknown;
-    viewModel?: __geoscene.ExpandViewModel | undefined;
-    closed?: boolean;
-    icon: import('@arcgis/components-utils').Nil | string;
-    label: import('@arcgis/components-utils').Nil | string;
-    referenceElement?: GeosceneReferenceElement | string;
-    position: __geoscene.UIPosition;
-    geosceneReady: import('@geoscene/lumina').EventEmitter;
-    geoscenePropertyChange: import('@geoscene/lumina').EventEmitter<{
-        name: string;
-    }> | undefined;
-    el: HTMLElement & {
-        childElem?: HTMLElement & {
-            ownedBy?: HTMLElement;
-        };
-        view?: __geoscene.LinkChartView | __geoscene.MapView | __geoscene.SceneView;
-    };
-    autoDestroyDisabled: boolean;
-    destroy: () => Promise<void>;
-}) => Expand;
 /**
- * The Expand component acts as a clickable button for displaying interactive content, most commonly other components.
+ * Expand acts as a clickable button for displaying interactive content, most commonly other components.
  *
- * [Read more...](https://doc.geoscene.cn/javascript/4.33/references/map-components/geoscene-expand/)
+ * @see [Samples with the Expand component](https://doc.geoscene.cn/javascript/5.0/sample-code/?tagged=geoscene-expand)
+ * @since 4.28
+ * @example
+ * ```html
+ * <geoscene-map item-id="45b3b2fb35e94ab09381d0caa0da5946">
+ *  <geoscene-expand slot="top-right">
+ *   <geoscene-layer-list></geoscene-layer-list>
+ *  </geoscene-expand>
+ * </geoscene-map>
+ * ```
  */
-export declare class GeosceneExpand extends LitElement {
-    /**
-     * Automatically collapses the expand widget instance when the view's
-     * viewpoint updates.
-     *
-     * @default false
-     */
-    autoCollapse: boolean;
-    /**
-     * 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 temporarily hide it. If this
-     * is set, make sure to call the [destroy](https://doc.geoscene.cn/javascript/4.33/references/map-components/geoscene-expand/#destroy) method when you are done to
-     * prevent memory leaks.
-     *
-     * @default false
-     */
-    autoDestroyDisabled: boolean;
-    /**
-     * When true, the Expand widget will close after the Escape key is pressed when the keyboard focus is within its content.
-     *
-     * @default true
-     */
-    closeOnEsc: boolean | Function;
-    /**
-     * Calcite icon used to style the Expand button when the [content](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Expand.html#content) can be collapsed.
-     *
-     * @default "chevrons-right"
-     */
-    collapseIcon: string;
-    /**
-     * Tooltip to display to indicate Expand widget can be collapsed.
-     *
-     * @default "Collapse" (English locale)
-     */
-    collapseTooltip: string;
-    /**
-     * Calcite icon used when the widget is collapsed.
-     *
-     * @default "chevrons-left"
-     */
-    expandIcon: string | nullish;
-    /**
-     * Tooltip to display to indicate Expand widget can be expanded.
-     *
-     * @default "Expand" (English locale)
-     */
-    expandTooltip: string;
-    /**
-     * Indicates whether the widget is currently expanded or not.
-     *
-     * @default false
-     */
-    expanded: boolean;
-    /**
-     * Disables focus trapping within the expand widget.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Expand.html#focusTrapDisabled)
-     *
-     * @deprecated since 4.33, use [`focusTrapDisabled`](#focusTrapDisabled) instead.
-     * @default false
-     */
-    focusTrapEnabled: boolean;
-    /**
-     * Disables focus trapping within the expand component.
-     *
-     * @since 4.33
-     * @default false
-     */
-    focusTrapDisabled: boolean;
-    /**
-     * This value associates two or more Expand widget instances with each other, allowing one
-     * instance to auto collapse when another instance in the same group is expanded.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Expand.html#group)
-     */
-    group: string | nullish;
-    /**
-     * A number to display at the corner of the widget to indicate the number of, for example, open issues or unread notices.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Expand.html#iconNumber)
-     */
-    iconNumber: number;
-    /**
-     * The widget's default label.
-     *
-     * [Read more...](https://doc.geoscene.cn/javascript/4.33/api-reference/geoscene-widgets-Expand.html#label)
-     */
-    label: string;
-    /**
-     * The mode in which the widget displays.
-     *
-     * @default "auto"
-     */
-    mode: "auto" | "floating" | "drawer";
-    /**
-     * The placement used by the [calcite popover](https://developers.geoscene.cn/calcite-design-system/components/popover/) when the widget is expanded.
-     *
-     * @default null
-     */
-    placement: nullish | "left" | "right" | "top" | "bottom" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end" | "leading-start" | "leading" | "leading-end" | "trailing-end" | "trailing" | "trailing-start";
-    /** @default "top-right" */
-    position: __geoscene.UIPosition;
-    /**
-     * 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://doc.geoscene.cn/javascript/4.33/programming-patterns/#associate-components-with-a-map-or-scene-component)
-     */
-    referenceElement?: GeosceneReferenceElement | string;
-    collapse(): Promise<void>;
-    /** Permanently destroy the component. */
-    destroy(): Promise<void>;
-    expand(): Promise<void>;
-    toggle(): Promise<void>;
-    /** Emitted when the component associated with a map or scene view is is ready to be interacted with. */
-    readonly geosceneReady: TargetedEvent<this, void>;
-}
-export {};
+export abstract class GeosceneExpand extends LitElement {
+  /**
+   * Automatically collapses the Expand component when the
+   * [viewpoint](https://doc.geoscene.cn/javascript/5.0/references/core/views/View/#viewpoint) updates.
+   *
+   * @default false
+   */
+  accessor autoCollapse: boolean;
+  /**
+   * 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 temporarily hide it. If this
+   * is set, make sure to call the [destroy()](https://doc.geoscene.cn/javascript/5.0/references/map-components/components/geoscene-expand/#destroy) method when you are done to
+   * prevent memory leaks.
+   *
+   * @default false
+   */
+  accessor autoDestroyDisabled: boolean;
+  /**
+   * When `true`, the Expand component will not close itself if the Escape key is pressed while its content has keyboard focus.
+   * This property can also be set to a function that returns a boolean, allowing for more customization for when to allow the
+   * Expand component to be closed via the Escape key.
+   *
+   * @default false
+   * @since 4.34
+   * @example
+   * ```html
+   * <geoscene-expand slot="top-right" close-on-esc-disabled>
+   *   <geoscene-search></geoscene-search>
+   * </geoscene-expand>
+   * ```
+   * @example
+   * ```html
+   * <geoscene-expand slot="top-right">
+   *   <geoscene-search></geoscene-search>
+   * </geoscene-expand>
+   *
+   * <script>
+   *  const expandElement = document.querySelector("geoscene-expand");
+   *  const searchElement = document.querySelector("geoscene-search");
+   *  // don't close the expand if the search is active
+   *  expandElement.closeOnEscDisabled = () => searchElement.activeMenu !== "none";
+   * </script>
+   * ```
+   */
+  accessor closeOnEscDisabled: boolean | ((event: KeyboardEvent) => boolean);
+  /**
+   * Calcite icon used to style the Expand when it can be collapsed.
+   *
+   * @default "chevrons-right"
+   * @see [Calcite Icon Search](https://doc.geoscene.cn/calcite-design-system/icons/)
+   */
+  get collapseIcon(): IconName;
+  set collapseIcon(value: IconName | null | undefined);
+  /**
+   * Tooltip to display to indicate the Expand can be collapsed.
+   *
+   * @default "Collapse" (English locale)
+   */
+  accessor collapseTooltip: string;
+  /**
+   * Indicates whether the component is currently expanded or not.
+   *
+   * @default false
+   */
+  accessor expanded: boolean;
+  /**
+   * Calcite icon used to style the Expand when it can be expanded.
+   * The component will automatically use the icon of the component placed within the Expand if it has one.
+   *
+   * @default "chevrons-left"
+   * @see [Calcite Icon Search](https://doc.geoscene.cn/calcite-design-system/icons/)
+   */
+  accessor expandIcon: IconName | null | undefined;
+  /**
+   * Tooltip to display to indicate Expand can be expanded.
+   *
+   * @default "Expand" (English locale)
+   */
+  accessor expandTooltip: string;
+  /**
+   * Whether the user's keyboard focus should be trapped in the expanded panel state. If `true`, tabbing
+   * forward or backward will cycle through elements only within the panel content.
+   *
+   * @default false
+   */
+  accessor focusTrapDisabled: boolean;
+  /**
+   * This value associates two or more Expand components with each other, allowing one
+   * component to auto collapse when another in the same group is expanded. For auto collapsing
+   * to take effect, all components in the group must be included in the same Map, Scene, or Link Chart component.
+   *
+   * For example, if you place multiple Expand components in the `top-left` slot of the Map, you can assign them to a
+   * group called `top-left`. If one Expand component is expanded and the user clicks on a different component in the
+   * `top-left` group, then the first component is collapsed, allowing the content of the second component to be
+   * fully visible.
+   *
+   * @example
+   * ```html
+   * <geoscene-map basemap="tianditu-vector">
+   *   <geoscene-expand slot="top-left" group="top-left" expanded>
+   *     <geoscene-layer-list></geoscene-layer-list>
+   *   </geoscene-expand>
+   *   <geoscene-expand slot="top-left" group="top-left">
+   *     <geoscene-basemap-gallery></geoscene-basemap-gallery>
+   *   </geoscene-expand>
+   * </geoscene-map>
+   */
+  accessor group: string | undefined;
+  /**
+   * A number to display at the corner of the component to indicate the number of, for example, open issues or unread notices.
+   *
+   * ![expand component icon number](https://doc.geoscene.cn/javascript/5.0//assets/img/apiref/widgets/expand-with-iconnumber.png)
+   *
+   * @default 0
+   */
+  accessor iconNumber: number;
+  /** The component's default label. */
+  accessor label: string | undefined;
+  /**
+   * Replace localized message strings with your own strings.
+   *
+   * _**Note**: Individual message keys may change between releases._
+   *
+   * @since 4.34
+   */
+  accessor messageOverrides: {
+      expand?: string | undefined;
+      collapse?: string | undefined;
+  };
+  /** @internal */
+  protected messages: Partial<{
+      expand: string;
+      collapse: string;
+  }> & T9nMeta<{
+      expand: string;
+      collapse: string;
+  }>;
+  /**
+   * The mode in which the component displays. These modes are listed below:
+   *
+   * - `auto`: This is the default mode. It is responsive to browser size changes and will update based on whether the component is viewed in a desktop or mobile application.
+   * - `floating`: Use this mode if you wish to always display the component as floating in a [Calcite Popover component](https://doc.geoscene.cn/calcite-design-system/components/popover/) regardless of browser size.
+   * - `drawer`: Use this mode if you wish to always display the component in a [Calcite Sheet component](https://doc.geoscene.cn/calcite-design-system/components/sheet/) regardless of browser size.
+   *
+   * @default "auto"
+   */
+  accessor mode: "auto" | "drawer" | "floating";
+  /**
+   * The placement used by the [Calcite Popover](https://doc.geoscene.cn/calcite-design-system/components/popover/) when the component is expanded.
+   * This property has no effect when the component is in `drawer` mode.
+   */
+  accessor placement: Panel["menuPlacement"] | undefined;
+  /**
+   * 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://doc.geoscene.cn/javascript/5.0/programming-patterns/#associate-components-with-a-map-or-scene-component)
+   */
+  accessor referenceElement: GeosceneReferenceElement | string | undefined;
+  /**
+   * The current state of the component.
+   *
+   * @default "disabled"
+   * @since 4.34
+   */
+  get state(): ExpandState;
+  /**
+   * When true, disables rendering in the top layer (above overlays and modals).
+   * This can be useful for controlling stacking context in complex UI layouts.
+   *
+   * @default false
+   * @since 5.0
+   */
+  accessor topLayerDisabled: boolean;
+  /**
+   * The view associated with the component. 
+   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the geoscene-expand component will be associated with a map or scene component rather than using the `view` property.
+   */
+  accessor view: LinkChartView | MapView | SceneView | null | undefined;
+  /**
+   * Specifies the size of the component.
+   *
+   * @default "m"
+   * @since 5.0
+   */
+  accessor visualScale: Action["scale"];
+  /** Collapse the component. */
+  collapse(): Promise<void>;
+  /** Permanently destroy the component. */
+  destroy(): Promise<void>;
+  /** Expand the component. */
+  expand(): Promise<void>;
+  "@setterTypes": {
+    collapseIcon?: IconName | null | undefined;
+  };
+  /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
+  readonly geoscenePropertyChange: import("@geoscene/lumina").TargetedEvent<this, { name: "expanded"; }>;
+  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  readonly geosceneReady: import("@geoscene/lumina").TargetedEvent<this, void>;
+  readonly "@eventTypes": {
+    geoscenePropertyChange: GeosceneExpand["geoscenePropertyChange"]["detail"];
+    geosceneReady: GeosceneExpand["geosceneReady"]["detail"];
+  };
+}