@geoscene/map-components 4.34.9 → 5.0.19

package/dist/components/geoscene-snapping-controls/customElement.d.ts

@@ -0,0 +1,156 @@
+/// <reference path="../../index.d.ts" />
+import type SnappingOptions from "@geoscene/core/views/interactive/snapping/SnappingOptions.js";
+import type { PublicLitElement as LitElement } from "@geoscene/lumina";
+import type { GeosceneReferenceElement, IconName } from "../types.js";
+import type { MapViewOrSceneView } from "@geoscene/core/views/MapViewOrSceneView.js";
+import type { Icon } from "@geoscene/calcite-components/components/calcite-icon";
+import type { SnappingControlsViewModelState } from "@geoscene/core/widgets/support/SnappingControls/SnappingControlsViewModel.js";
+
+export abstract class GeosceneSnappingControls 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
+   * 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-snapping-controls/#destroy) method when you are done to
+   * prevent memory leaks.
+   *
+   * @default false
+   */
+  accessor autoDestroyDisabled: boolean;
+  /**
+   * Controls display of the "Enable snapping" toggle.
+   *
+   * @default false
+   */
+  accessor hideEnabledToggle: boolean;
+  /**
+   * Controls display of the "Feature to feature" toggle. This controls feature snapping.
+   *
+   * @default false
+   */
+  accessor hideFeatureEnabledToggle: boolean;
+  /**
+   * Controls display of the [geoscene-grid-controls](https://doc.geoscene.cn/javascript/5.0/references/map-components/components/geoscene-grid-controls/).
+   *
+   * @default false
+   */
+  accessor hideGridControls: boolean;
+  /**
+   * Controls display of the buttons to change the color of the grid.
+   *
+   * @default false
+   */
+  accessor hideGridControlsElementsColorSelection: boolean;
+  /**
+   * Controls display of the toggle that modifies [dynamicScaling](https://doc.geoscene.cn/javascript/5.0/references/map-components/components/geoscene-grid-controls/#dynamicScaling).
+   *
+   * @default false
+   */
+  accessor hideGridControlsElementsDynamicScaleToggle: boolean;
+  /**
+   * Controls display of the line interval input. The input sets the interval between major grid lines.
+   *
+   * @default false
+   */
+  accessor hideGridControlsElementsLineIntervalInput: boolean;
+  /**
+   * Controls display of the numeric inputs that allow for setting grid spacing and rotation
+   *
+   * @default false
+   */
+  accessor hideGridControlsElementsNumericInputs: boolean;
+  /**
+   * Controls display of the out of scale warning. This warning is displayed when the grid is not shown because it would be too small at the current scale and dynamic scaling is disabled.
+   *
+   * @default false
+   */
+  accessor hideGridControlsElementsOutOfScaleWarning: boolean;
+  /**
+   * Controls display of the grid placement buttons. These buttons allow the user to start interactive configuration of the grid.
+   *
+   * @default false
+   */
+  accessor hideGridControlsElementsPlacementButtons: boolean;
+  /**
+   * Controls display of the "Rotate grid with map" toggle. This toggle controls whether the grid rotates with the map.
+   *
+   * @default false
+   */
+  accessor hideGridControlsElementsRotateWithMapToggle: boolean;
+  /**
+   * Controls display of the "Snapping layers" dropdown. The list displays the available layers to configure snapping.
+   *
+   * @default false
+   */
+  accessor hideLayerList: boolean;
+  /**
+   * Controls display of the “Geometry guides” toggle. This toggle controls the self-snapping configuration which handles showing right-angle and parallel line indicators while constructing or modifying geometries.
+   *
+   * @default false
+   */
+  accessor hideSelfEnabledToggle: boolean;
+  /**
+   * Icon which represents the component.
+   * Typically used when the component is controlled by another component (e.g. by the Expand component).
+   *
+   * @default "snap-to-point"
+   * @since 5.0
+   * @see [Calcite Icons](https://doc.geoscene.cn/calcite-design-system/icons/)
+   */
+  get icon(): Icon["icon"];
+  set icon(value: IconName);
+  /**
+   * The component's default label.
+   *
+   * @since 5.0
+   */
+  accessor label: string;
+  /**
+   * 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;
+  /**
+   * Controls display of the "Enable grid" toggle. This toggle controls whether the grid is displayed.
+   *
+   * @default false
+   */
+  accessor showGridControlsElementsGridEnabledToggle: boolean;
+  /**
+   * Controls display of the header
+   *
+   * @default false
+   */
+  accessor showHeader: boolean;
+  /**
+   * The [SnappingOptions](https://doc.geoscene.cn/javascript/5.0/references/core/views/interactive/snapping/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.
+   */
+  accessor snappingOptions: SnappingOptions;
+  /**
+   * The current state of the component.
+   *
+   * @default "disabled"
+   */
+  get state(): SnappingControlsViewModelState;
+  /**
+   * 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-snapping-controls component will be associated with a map or scene component rather than using the `view` property.
+   */
+  accessor view: MapViewOrSceneView | null | undefined;
+  /** Permanently destroy the component. */
+  destroy(): Promise<void>;
+  "@setterTypes": {
+    icon?: IconName;
+  };
+  /** 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: "snappingOptions" | "state"; }>;
+  /** 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: GeosceneSnappingControls["geoscenePropertyChange"]["detail"];
+    geosceneReady: GeosceneSnappingControls["geosceneReady"]["detail"];
+  };
+}

package/dist/components/geoscene-snapping-controls/customElement.js

@@ -0,0 +1,26 @@
+/* COPYRIGHT GeoScene - https://js.geoscene.cn/5.0/LICENSE.txt */
+import { c as e } from "../../chunks/runtime.js";
+import { usePropertyChange as i } from "@geoscene/lumina/controllers";
+import t from "@geoscene/core/widgets/support/SnappingControls.js";
+import { LitElement as r, createEvent as o } from "@geoscene/lumina";
+import { m as n } from "../../chunks/useWidget.js";
+import { css as a } from "lit";
+const s = a`.geoscene-widget__heading{color:var(--calcite-color-text-2);margin:0 0 .5rem;font-weight:var(--calcite-font-weight-semibold)}h1.geoscene-widget__heading{font-size:var(--calcite-font-size-xl)}h2.geoscene-widget__heading{font-size:var(--calcite-font-size-md)}h3.geoscene-widget__heading,h4.geoscene-widget__heading,h5.geoscene-widget__heading,h6.geoscene-widget__heading{font-size:var(--calcite-font-size)}.geoscene-widget{box-sizing:border-box;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);line-height:var(--calcite-font-line-height-relative-tight)}.geoscene-widget *,.geoscene-widget :before,.geoscene-widget :after{box-sizing:inherit}.geoscene-widget.geoscene-widget--disabled>*{opacity:.4;pointer-events:none}.geoscene-widget.geoscene-widget--compact{--geoscene-widget-padding-y: 0;--geoscene-widget-padding-x: 0}.geoscene-widget__anchor{color:var(--calcite-color-text-2)}.geoscene-widget__anchor:hover{color:var(--calcite-color-text-3)}.geoscene-widget__anchor:hover,.geoscene-widget__anchor:focus{text-decoration:underline}.geoscene-widget__anchor--disabled{opacity:.4;pointer-events:none}.geoscene-widget__header{background-color:var(--calcite-color-foreground-1);flex:1 0 100%;justify-content:space-between;align-items:center;width:100%;min-height:48px;padding:12px 0 12px 15px;display:flex}.geoscene-widget__heading{word-break:break-word}.geoscene-widget__header .geoscene-widget__heading{width:calc(100% - 48px);text-align:initial;color:var(--calcite-color-text-1);align-items:center;margin:0;padding:0;display:flex}.geoscene-widget__header-button{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);border:none;flex:0 0 48px;justify-content:center;align-self:stretch;align-items:center;width:48px;padding:0;display:flex}.geoscene-widget__footer{background-color:var(--calcite-color-foreground-1);justify-content:center;align-items:center;width:100%;min-height:48px;display:flex}.geoscene-widget__footer-pagination{color:var(--calcite-color-text-2);justify-content:space-between;align-items:center;display:flex}.geoscene-widget__footer-pagination-previous-button,.geoscene-widget__footer-pagination-next-button{cursor:pointer;background-color:var(--calcite-color-foreground-1);border:0;margin:0 7px;padding:12px 15px;transition:background-color .125s ease-in-out}.geoscene-widget__footer-pagination-previous-button:hover,.geoscene-widget__footer-pagination-previous-button:focus,.geoscene-widget__footer-pagination-next-button:hover,.geoscene-widget__footer-pagination-next-button:focus{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1)}.geoscene-menu{visibility:hidden;z-index:1;background-clip:padding;background-color:var(--calcite-color-foreground-1);background-clip:padding-box;width:100%;max-height:0;margin:2px 0 0;padding:0;font-size:var(--calcite-font-size);line-height:var(--calcite-spacing-xl);position:absolute;top:100%;left:0;overflow:hidden;box-shadow:0 1px 2px #0000004d}.geoscene-menu .geoscene-menu__header{color:var(--calcite-color-text-inverse);background-color:var(--calcite-color-inverse);padding:6px 12px}.geoscene-menu__list{margin:0;padding:0;list-style:none}.geoscene-menu__list-item{cursor:pointer;border-top:1px solid #adadad4d;border-left:3px solid #0000;padding:.8em 1em}.geoscene-menu__list-item [class^=geoscene-icon-],.geoscene-menu__list-item [class*=" geoscene-icon-"]{padding-right:2.8px}.geoscene-menu__list-item:first-child{border-top:none}.geoscene-menu__list-item--focus,.geoscene-menu__list-item:hover,.geoscene-menu__list-item:focus{background-color:var(--calcite-color-foreground-1)}.geoscene-menu__list-item:active{background-color:var(--calcite-color-foreground-current)}.geoscene-menu__list-item--active,.geoscene-menu__list-item--active:hover,.geoscene-menu__list-item--active:focus{background-color:var(--calcite-color-foreground-1);border-left-color:var(--calcite-color-brand)}.geoscene-widget__table{border-collapse:collapse;color:var(--calcite-color-text-1);border:none;width:100%;line-height:var(--calcite-font-line-height-relative-tight)}.geoscene-widget__table tr:nth-child(odd){background-color:var(--calcite-color-transparent)}.geoscene-widget__table tr:nth-child(2n){background-color:var(--calcite-color-transparent-press)}.geoscene-widget__table tr a{color:var(--calcite-color-text-2)}.geoscene-widget__table tr a:hover,.geoscene-widget__table tr a:focus{color:var(--calcite-color-text-1)}.geoscene-widget__table tr td,.geoscene-widget__table tr th{vertical-align:top;word-break:break-word;padding:.5em .7em;font-size:var(--calcite-font-size-sm);font-weight:var(--calcite-font-weight-regular)}.geoscene-widget__table tr th{text-align:left;border-right:3px solid #0000000d;width:50%}.geoscene-widget__table tr td{width:50%}.geoscene-input{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1);border:1px solid #959595;font-size:var(--calcite-font-size)}.geoscene-input::-ms-clear{display:none}.geoscene-input::placeholder{opacity:1;color:var(--calcite-color-text-2)}.geoscene-input:placeholder-shown{text-overflow:ellipsis}.geoscene-input[type=text],.geoscene-input[type=password],.geoscene-input[type=number]{height:32px;padding:0 .5em}calcite-combobox.geoscene-input{border:none}.geoscene-widget__content--empty{text-align:center;color:var(--calcite-color-border-input);flex-flow:column wrap;align-items:center;padding:18px 22px;display:flex}.geoscene-widget__content--empty h1.geoscene-widget__heading,.geoscene-widget__content--empty h2.geoscene-widget__heading,.geoscene-widget__content--empty h3.geoscene-widget__heading,.geoscene-widget__content--empty h4.geoscene-widget__heading,.geoscene-widget__content--empty h5.geoscene-widget__heading{font-weight:var(--calcite-font-weight-regular)}.geoscene-widget__content-illustration--empty{width:128px;padding:1rem 0}.geoscene-widget__content-icon--empty{width:32px;padding:.5rem 0}.geoscene-select{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background:var(--calcite-color-foreground-1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 32 32' width='32' height='32'%3E%3Cpath d='M8 11.207l-4-4V5.793l4 4 4-4v1.414z' fill='%23adadad' fillrule='nonzero'/%3E%3C/svg%3E") 100% no-repeat;border:1px solid #959595;border-radius:0;width:100%;height:32px;margin:0;padding:0 .5em;font-family:inherit;font-size:.85em;display:block}.geoscene-select[disabled]{cursor:auto}.geoscene-select::-ms-expand{display:none}.geoscene-disabled a,.geoscene-disabled [role=menu],.geoscene-disabled [role=checkbox],.geoscene-disabled [class^=geoscene-icon-],.geoscene-disabled [class*=" geoscene-icon-"]{color:var(--calcite-color-text-3)}.keynav-mode .geoscene-widget:focus,.keynav-mode .geoscene-widget :focus{z-index:1;outline-offset:2px;outline:2px solid #adadad}.geoscene-widget__loader-animation{border:.15em solid #adadad4d;border-top-color:var(--calcite-color-border-input);border-radius:100%;width:1em;height:1em;font-size:var(--calcite-font-size-md);animation:1.25s linear infinite geoscene-rotate;display:block;transform:translateZ(0)}:dir(rtl) .geoscene-widget__table th{text-align:right;border-left:3px solid #0000000d;border-right:none}:dir(rtl) .geoscene-select{background-position:0}:dir(rtl) .geoscene-menu__list-item{border-left:none;border-right:3px solid #0000}:dir(rtl) .geoscene-menu__list-item [class^=geoscene-icon-],:dir(rtl) .geoscene-menu__list-item [class*=" geoscene-icon-"]{padding-left:2px;padding-right:0}:dir(rtl) .geoscene-menu__list-item--active{border-right-color:var(--calcite-color-brand)}.geoscene-icon-font-fallback-text{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.geoscene-rotating{animation:1.25s linear infinite geoscene-rotate;transform:translateZ(0)}.geoscene-clearfix:before,.geoscene-clearfix:after{content:" ";display:table}.geoscene-clearfix:after{clear:both}.geoscene-interactive{cursor:pointer}.geoscene-hidden{display:none!important}.geoscene-invisible{visibility:hidden!important}.geoscene-offscreen{position:absolute;top:-999em;left:-999em}.geoscene-match-height{flex-direction:column;flex:auto;display:flex;overflow:hidden}.geoscene-snapping-controls{flex-flow:column wrap;display:flex}.geoscene-snapping-controls__container{flex-direction:column;flex:auto;display:flex}.geoscene-snapping-controls__container :only-child{border-block-end:none}.geoscene-snapping-controls__panel{width:320px}.geoscene-snapping-controls__item{border:var(--calcite-border-width-sm) solid var(--calcite-color-border-3);cursor:pointer;background-color:var(--calcite-color-foreground-1);border-radius:var(--calcite-corner-radius-sm);justify-content:space-between;margin:var(--calcite-spacing-xxs) 0;padding:var(--calcite-spacing-xxs);transition:border-color .125s ease-in-out;display:flex;box-shadow:0 var(--calcite-border-width-sm) var(--calcite-color-border-3)}.geoscene-snapping-controls__item-action-icon{flex:0 0 var(--calcite-spacing-md);width:var(--calcite-spacing-md);height:var(--calcite-spacing-md);margin-top:calc(var(--calcite-spacing-xxs) / 4);font-size:var(--calcite-font-size-md);display:inline-block}.geoscene-snapping-controls__action-toggle{opacity:1;cursor:pointer;border:var(--calcite-border-width-sm) solid var(--calcite-color-border-3);flex-flow:row-reverse;justify-content:space-between;align-items:flex-start;width:100%;margin:0;padding:var(--calcite-spacing-sm) var(--calcite-spacing-md);font-size:var(--calcite-font-size--1);transition:opacity .25s ease-in-out .25s,background-color .25s ease-in-out;display:flex}.geoscene-snapping-controls__action-toggle .geoscene-snapping-controls__item-action-title{margin-left:0}.geoscene-snapping-controls__action-toggle .geoscene-snapping-controls__item-action-icon{background-color:var(--calcite-color-foreground-2);border-radius:var(--calcite-corner-radius-pill);flex:0 0 calc(var(--calcite-spacing-md) + var(--calcite-spacing-xs));width:var(--calcite-spacing-md);height:var(--calcite-spacing-md);padding:0;transition:background-color .125s ease-in-out;position:relative;overflow:hidden;box-shadow:0 0 0 var(--calcite-border-width-sm) var(--calcite-color-border-1)}.geoscene-snapping-controls__action-toggle .geoscene-snapping-controls__item-action-icon:before{content:"";background-color:var(--calcite-color-text-3);border-radius:100%;width:var(--calcite-spacing-xs);height:var(--calcite-spacing-xs);margin:calc(var(--calcite-spacing-xxs) / 2);transition:background-color .125s ease-in-out,left .125s ease-in-out;display:block;position:absolute;top:0;left:0;box-shadow:0 0 0 var(--calcite-border-width-sm) var(--calcite-color-foreground-1)}.geoscene-snapping-controls__action-toggle--on .geoscene-snapping-controls__item-action-icon{background-color:var(--calcite-color-brand);box-shadow:0 0 0 var(--calcite-border-width-sm) var(--calcite-color-brand)}.geoscene-snapping-controls__action-toggle--on .geoscene-snapping-controls__item-action-icon:before{background-color:var(--calcite-color-foreground-1);left:var(--calcite-spacing-xs)}.geoscene-snapping-controls__nested-container{flex-direction:column;gap:var(--calcite-spacing-sm);display:flex}.geoscene-snapping-controls__nested-container:not(:empty){padding-top:var(--calcite-spacing-sm);padding-inline-start:var(--calcite-list-item-spacing-indent)}`, l = n(t);
+class c extends r {
+  constructor() {
+    super(...arguments), this.widget = l(this), this.viewModel = this.widget.viewModel, this.view = this.widget.view, this.autoDestroyDisabled = !1, this.hideEnabledToggle = this.widget.visibleElements.enabledToggle, this.hideFeatureEnabledToggle = this.widget.visibleElements.featureEnabledToggle, this.hideGridControls = this.widget.visibleElements.gridControls, this.hideGridControlsElementsColorSelection = this.widget.visibleElements.gridControlsElements.colorSelection, this.hideGridControlsElementsDynamicScaleToggle = this.widget.visibleElements.gridControlsElements.dynamicScaleToggle, this.hideGridControlsElementsLineIntervalInput = this.widget.visibleElements.gridControlsElements.lineIntervalInput, this.hideGridControlsElementsNumericInputs = this.widget.visibleElements.gridControlsElements.numericInputs, this.hideGridControlsElementsOutOfScaleWarning = this.widget.visibleElements.gridControlsElements.outOfScaleWarning, this.hideGridControlsElementsPlacementButtons = this.widget.visibleElements.gridControlsElements.placementButtons, this.hideGridControlsElementsRotateWithMapToggle = this.widget.visibleElements.gridControlsElements.rotateWithMapToggle, this.showHeader = this.widget.visibleElements.header, this.showGridControlsElementsGridEnabledToggle = this.widget.visibleElements.gridControlsElements.gridEnabledToggle, this.hideLayerList = this.widget.visibleElements.layerList, this.hideSelfEnabledToggle = this.widget.visibleElements.selfEnabledToggle, this.icon = this.widget.icon, this.label = this.widget.label, this.snappingOptions = this.widget.snappingOptions, this.state = this.viewModel.state, this.geoscenePropertyChange = i()("snappingOptions", "state"), this.geosceneReady = o();
+  }
+  static {
+    this.properties = { view: 0, autoDestroyDisabled: 5, hideEnabledToggle: 5, hideFeatureEnabledToggle: 5, hideGridControls: 5, hideGridControlsElementsColorSelection: 5, hideGridControlsElementsDynamicScaleToggle: 5, hideGridControlsElementsLineIntervalInput: 5, hideGridControlsElementsNumericInputs: 5, hideGridControlsElementsOutOfScaleWarning: 5, hideGridControlsElementsPlacementButtons: 5, hideGridControlsElementsRotateWithMapToggle: 5, showHeader: 5, showGridControlsElementsGridEnabledToggle: 5, hideLayerList: 5, hideSelfEnabledToggle: 5, icon: 1, label: 1, referenceElement: 1, snappingOptions: 0, state: 35 };
+  }
+  static {
+    this.styles = s;
+  }
+  async destroy() {
+    await this.manager.destroy();
+  }
+}
+e("geoscene-snapping-controls", c);
+export {
+  c as GeosceneSnappingControls
+};

package/dist/components/geoscene-snapping-controls/index.d.ts

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

package/dist/components/geoscene-snapping-controls/index.js

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

package/dist/components/geoscene-spinner/customElement.js

@@ -1,12 +1,10 @@
+/* COPYRIGHT GeoScene - https://js.geoscene.cn/5.0/LICENSE.txt */
 import { c as i } from "../../chunks/runtime.js";
-import { css as a, html as r } from "lit";
+import { css as r, html as a } from "lit";
 import { LitElement as n, safeStyleMap as l } from "@geoscene/lumina";
 import { t as c } from "../../chunks/screenLocation.js";
-/*! All material copyright GeoScene, All Rights Reserved, unless otherwise specified.
-See https://js.geoscene.cn/4.34/geoscene/copyright.txt for details.
-v4.34.9 */
-const p = a`:host{display:contents}calcite-loader{position:absolute}`;
-class d extends n {
+const p = r`:host{display:contents}.root{position:absolute}`;
+class m extends n {
   constructor() {
     super(...arguments), this.autoDestroyDisabled = !1, this.trackLocation = !1, this.screenLocation = c(this);
   }
@@ -31,10 +29,10 @@ class d extends n {
     };
   }
   render() {
-    return this.screenLocation ? r`<calcite-loader .label=${this.label ?? ""} inline style=${l(this._getPositionStyles())}></calcite-loader>` : null;
+    return this.screenLocation ? a`<calcite-loader class="root" .label=${this.label ?? ""} inline style=${l(this._getPositionStyles())}></calcite-loader>` : null;
   }
 }
-i("geoscene-spinner", d);
+i("geoscene-spinner", m);
 export {
-  d as GeosceneSpinner
+  m as GeosceneSpinner
 };

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

@@ -1,17 +1,18 @@
-/// <reference types="@geoscene/core/interfaces.d.ts" />
 /// <reference path="../../index.d.ts" />
-import { default as SwipeViewModel } from '@geoscene/core/widgets/Swipe/SwipeViewModel.js';
-import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@geoscene/lumina';
-import { Use } from '@geoscene/lumina/controllers';
-import { GeosceneReferenceElement } from '../../utils/component-utils';
+import type MapView from "@geoscene/core/views/MapView.js";
+import type Collection from "@geoscene/core/core/Collection.js";
+import type Layer from "@geoscene/core/layers/Layer.js";
+import type { PublicLitElement as LitElement } from "@geoscene/lumina";
+import type { GeosceneReferenceElement } from "../types.js";
+import type { T9nMeta } from "@geoscene/lumina/controllers";
+import type { Direction, State } from "@geoscene/core/widgets/Swipe/types.js";
 
-declare const useSwipeViewModel: (component: LitElement & Pick<SwipeViewModel, never> & import('../../controllers/useViewModel').ViewModelControllerUses<SwipeViewModel>) => SwipeViewModel;
 /**
  * The Swipe component provides a tool to show a portion of a layer or layers
  * on top of a map. Layers can be swiped vertically or horizontally to easily
  * compare two layers or see what is underneath a layer.
  *
- * To use the Swipe component, set the `leadingLayers` and `trailingLayers`
+ * To use the Swipe component, set the `startLayers` and `endLayers`
  * properties to determine what will be compared on either side of the component. If one of these properties
  * is not set, then the Swipe component will overlay the existing map.
  *
@@ -19,130 +20,164 @@ declare const useSwipeViewModel: (component: LitElement & Pick<SwipeViewModel, n
  *
  * - This component is not currently supported within a Scene component.
  *
- * [Read more...](https://doc.geoscene.cn/javascript/4.33/references/map-components/geoscene-swipe/)
- *
  * @since 4.31
- * @see [Sample - Swipe component](https://doc.geoscene.cn/javascript/4.33/sample-code/swipe/)
- * @see [Sample - Swipe component with scroll](https://doc.geoscene.cn/javascript/4.33/sample-code/swipe-scroll/)
+ * @see [Sample - Swipe component](https://doc.geoscene.cn/javascript/5.0/sample-code/swipe/)
+ * @see [Sample - Swipe component with scroll](https://doc.geoscene.cn/javascript/5.0/sample-code/swipe-scroll/)
  */
-export declare class GeosceneSwipe extends LitElement {
-    /**
-     * 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 Swipe component will be associated with a map or scene component rather than using the `view` property.
-     */
-    view?: __geoscene.MapView | nullish;
-    /**
-     * 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-swipe/#destroy) method when you are done to
-     * prevent memory leaks.
-     *
-     * @default false
-     */
-    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.
-     *
-     * @default "horizontal"
-     */
-    direction: "horizontal" | "vertical";
-    /**
-     * When `true`, sets the component to a disabled state so the user cannot interact with it.
-     *
-     * @default false
-     */
-    disabled: boolean;
-    /**
-     * When `true`, the divider between the leading and trailing layers will be hidden.
-     *
-     * @default false
-     */
-    hideDivider: boolean;
-    /**
-     * When `true`, the handle from which you drag the component will be hidden.
-     *
-     * @default false
-     */
-    hideHandle: boolean;
-    /**
-     * Icon which represents the component.
-     * Typically used when the component is controlled by another component (e.g. by the Expand component).
-     *
-     * @see [Calcite Icons](https://doc.geoscene.cn/calcite-design-system/icons/)
-     * @default "compare"
-     */
-    icon?: string;
-    /**
-     * The component's default label.
-     *
-     * @default "Swipe"
-     */
-    label?: string;
-    /** A collection of layers that will show on the left or top side of the Swipe component. */
-    leadingLayers: __geoscene.Collection<__geoscene.Layer>;
-    /**
-     * Replace localized message strings with your own strings.
-     *
-     * _**Note**: Individual message keys may change between releases._
-     */
-    messageOverrides?: typeof this.messages._overrides;
-    /** @deprecated since 4.34, use [`slot`](https://doc.geoscene.cn/javascript/4.33/building-your-ui/#slots) instead. */
-    position?: __geoscene.UIPosition;
-    /**
-     * The position of the Swipe component. This determines what percentage
-     * of the view will be taken up by the [leadingLayers](#leadingLayers).
-     *
-     * @default 25
-     */
-    swipePosition: number;
-    /**
-     * 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;
-    /**
-     * The current state of the component.
-     *
-     * @default "disabled"
-     */
-    readonly state: "ready" | "disabled";
-    /** A collection of layers that will show on the right or bottom side of the Swipe component. */
-    trailingLayers: __geoscene.Collection<__geoscene.Layer>;
-    /** Permanently destroy the component. */
-    destroy(): Promise<void>;
-    /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
-    readonly geoscenePropertyChange: TargetedEvent<this, {
-        name: "state";
-    }>;
-    /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
-    readonly geosceneReady: TargetedEvent<this, void>;
-    /**
-     * Fires when the swipe position changes and the drag handle is released on the component.
-     *
-     * **Note:** To constantly listen to changes while dragging, use the `geosceneSwipeInput` event instead.
-     *
-     * @event
-     * @since 4.34
-     */
-    readonly geosceneSwipeChange: TargetedEvent<this, void>;
-    /**
-     * Fires when the swipe position is updated.
-     * This event is fired continuously while dragging the handle.
-     *
-     * @event
-     * @since 4.34
-     */
-    readonly geosceneSwipeInput: TargetedEvent<this, void>;
-    private messages: Partial<{
-        componentLabel: string;
-        dragLabel: string;
-    }> & import('@geoscene/lumina/controllers').T9nMeta<{
-        componentLabel: string;
-        dragLabel: string;
-    }>;
-}
-export {};
+export abstract class GeosceneSwipe 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
+   * 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-swipe/#destroy) method when you are done to
+   * prevent memory leaks.
+   *
+   * @default false
+   */
+  accessor 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.
+   *
+   * @default "horizontal"
+   */
+  accessor direction: Direction;
+  /**
+   * When true, the component is visually withdrawn and cannot receive user interaction.
+   *
+   * @default false
+   */
+  accessor disabled: boolean;
+  /**
+   * A collection of layers that will show on the right or bottom side of the Swipe component.
+   *
+   * @see [trailingLayers](https://doc.geoscene.cn/javascript/5.0/references/core/widgets/Swipe/SwipeViewModel/#trailingLayers)
+   * @since 5.0
+   */
+  accessor endLayers: Collection<Layer>;
+  /**
+   * When `true`, the divider between the leading and trailing layers will be hidden.
+   *
+   * @default false
+   */
+  accessor hideDivider: boolean;
+  /**
+   * When `true`, the handle from which you drag the component will be hidden.
+   *
+   * @default false
+   */
+  accessor hideHandle: boolean;
+  /**
+   * Icon which represents the component.
+   * Typically used when the component is controlled by another component (e.g. by the Expand component).
+   *
+   * @default "compare"
+   * @see [Calcite Icons](https://doc.geoscene.cn/calcite-design-system/icons/)
+   */
+  accessor icon: string | undefined;
+  /**
+   * The component's default label.
+   *
+   * @default "Swipe"
+   */
+  accessor label: string | undefined;
+  /**
+   * A collection of layers that will show on the left or top side of the Swipe component.
+   *
+   * @deprecated since 5.0, use [startLayers](https://doc.geoscene.cn/javascript/5.0/references/map-components/components/geoscene-swipe/#startLayers) instead.
+   * @see [leadingLayers](https://doc.geoscene.cn/javascript/5.0/references/core/widgets/Swipe/SwipeViewModel/#leadingLayers)
+   */
+  accessor leadingLayers: Collection<Layer>;
+  /**
+   * Replace localized message strings with your own strings.
+   *
+   * _**Note**: Individual message keys may change between releases._
+   */
+  accessor messageOverrides: {
+      componentLabel?: string | undefined;
+      dragLabel?: string | undefined;
+  };
+  /** @internal */
+  protected messages: Partial<{
+      componentLabel: string;
+      dragLabel: string;
+  }> & T9nMeta<{
+      componentLabel: string;
+      dragLabel: string;
+  }>;
+  /**
+   * The position of the Swipe component. This determines what percentage
+   * of the view will be taken up by the [startLayers](https://doc.geoscene.cn/javascript/5.0/references/map-components/components/geoscene-swipe/#startLayers).
+   *
+   * @default 25
+   * @since 5.0
+   */
+  accessor position: number;
+  /**
+   * 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;
+  /**
+   * A collection of layers that will show on the left or top side of the Swipe component.
+   *
+   * @see [leadingLayers](https://doc.geoscene.cn/javascript/5.0/references/core/widgets/Swipe/SwipeViewModel/#leadingLayers)
+   * @since 5.0
+   */
+  accessor startLayers: Collection<Layer>;
+  /**
+   * The current state of the component.
+   *
+   * @default "disabled"
+   */
+  get state(): State;
+  /**
+   * The position of the Swipe component. This determines what percentage
+   * of the view will be taken up by the [startLayers](https://doc.geoscene.cn/javascript/5.0/references/map-components/components/geoscene-swipe/#startLayers).
+   *
+   * @deprecated since 5.0, use [position](https://doc.geoscene.cn/javascript/5.0/references/map-components/components/geoscene-swipe/#position) instead.
+   * @default 25
+   */
+  accessor swipePosition: number;
+  /**
+   * A collection of layers that will show on the right or bottom side of the Swipe component.
+   *
+   * @deprecated since 5.0, use [endLayers](https://doc.geoscene.cn/javascript/5.0/references/map-components/components/geoscene-swipe/#endLayers) instead.
+   * @see [trailingLayers](https://doc.geoscene.cn/javascript/5.0/references/core/widgets/Swipe/SwipeViewModel/#trailingLayers)
+   */
+  accessor trailingLayers: Collection<Layer>;
+  /**
+   * 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-swipe component will be associated with a map or scene component rather than using the `view` property.
+   */
+  accessor view: MapView | null | undefined;
+  /** Permanently destroy the component. */
+  destroy(): Promise<void>;
+  /** 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: "state"; }>;
+  /** 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>;
+  /**
+   * Fires when the swipe position changes and the drag handle is released on the component.
+   *
+   * **Note:** To constantly listen to changes while dragging, use the `geosceneSwipeInput` event instead.
+   *
+   * @since 4.34
+   */
+  readonly geosceneSwipeChange: import("@geoscene/lumina").TargetedEvent<this, void>;
+  /**
+   * Fires when the swipe position is updated.
+   * This event is fired continuously while dragging the handle.
+   *
+   * @since 4.34
+   */
+  readonly geosceneSwipeInput: import("@geoscene/lumina").TargetedEvent<this, void>;
+  readonly "@eventTypes": {
+    geoscenePropertyChange: GeosceneSwipe["geoscenePropertyChange"]["detail"];
+    geosceneReady: GeosceneSwipe["geosceneReady"]["detail"];
+    geosceneSwipeChange: GeosceneSwipe["geosceneSwipeChange"]["detail"];
+    geosceneSwipeInput: GeosceneSwipe["geosceneSwipeInput"]["detail"];
+  };
+}