@arcgis/map-components

/// <reference types="@arcgis/core/interfaces.d.ts" /> /// <reference types="../../index.d.ts" /> import { Use } from '@arcgis/lumina/controllers'; import { default as Slider } from '@arcgis/core/widgets/Slider.js'; import { PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina'; import { ArcgisReferenceElement } from '../../utils/component-utils'; declare const useSliderWidget: (component: LitElement & Pick<Slider, "icon" | "label" | "viewModel" | "values" | "layout" | "tickConfigs" | "draggableSegmentsEnabled" | "effectiveMax" | "effectiveMin" | "labelInputsEnabled" | "max" | "min" | "precision" | "rangeLabelInputsEnabled" | "snapOnClickEnabled" | "steps" | "syncedSegmentsEnabled" | "thumbsConstrained"> & { state?: "ready" | "disabled" | "editing" | "dragging" | undefined; viewModel?: __esri.SliderViewModel | undefined; closed?: boolean; icon: import('@arcgis/components-utils').Nil | string; label: import('@arcgis/components-utils').Nil | string; referenceElement?: ArcgisReferenceElement | string; position: __esri.UIPosition; arcgisReady: import('@arcgis/lumina').EventEmitter; arcgisPropertyChange: import('@arcgis/lumina').EventEmitter<{ name: string; }> | undefined; el: HTMLElement & { childElem?: HTMLElement & { ownedBy?: HTMLElement; }; view?: __esri.LinkChartView | __esri.MapView | __esri.SceneView; }; autoDestroyDisabled: boolean; destroy: () => Promise<void>; }) => Slider; /** * [Read more...](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-slider/) * * @internal */ export declare class ArcgisSlider extends LitElement { /** * If true, the component will not be destroyed automatically when it is * disconnected from the document. This is useful when you want to move the * component to a different place on the page, or temporarily hide it. If this * is set, make sure to call the [destroy](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-slider/#destroy) method when you are done to * prevent memory leaks. * * @default false */ autoDestroyDisabled: boolean; /** * Indicates if the user can drag the segment between thumbs * to update thumb positions. * * @default true */ draggableSegmentsEnabled: boolean; /** * When set, the user is restricted from moving slider thumbs to positions higher than * this value. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#effectiveMax) */ effectiveMax: number | nullish; /** * When set, the user is restricted from moving slider thumbs to positions less than * this value. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#effectiveMin) */ effectiveMin: number | nullish; /** * The HTML Element nodes representing the slider segment between the [min](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#min) and [effectiveMin](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#effectiveMin), and the segment between the * [effectiveMax](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#effectiveMax) and [max](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#max). * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#effectiveSegmentElements) */ readonly effectiveSegmentElements: __esri.Collection<HTMLElement>; /** * Icon which represents the component. * Typically used when the component is controlled by another component (e.g. by the Expand component). * * @see [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/) * @default "caret-double-horizontal" */ icon: string; /** * The widget's default label. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#label) */ label: string; /** * The HTML Element nodes representing [labels](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#labels) attached to slider thumbs. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#labelElements) */ readonly labelElements: __esri.Collection<HTMLElement>; /** * Indicates whether to enable editing input values via keyboard input * when the user clicks a label. * * @default false */ labelInputsEnabled: boolean; /** * An array of strings associated with 'values' generated using an internal label formatter or * the values returned from [labelFormatFunction](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#labelFormatFunction). * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#labels) */ readonly labels: __esri.LabelInfos; /** * Determines the layout/orientation of the Slider widget. * * @default "horizontal" */ layout: "vertical" | "horizontal" | "horizontal-reversed" | "vertical-reversed"; /** * The maximum possible data/thumb value of the slider. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#max) */ max: number | nullish; /** * The HTML Element node representing the [max](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#max) value label. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#maxLabelElement) */ readonly maxLabelElement: HTMLElement | nullish; /** * The minimum possible data/thumb value of the slider. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#min) */ min: number | nullish; /** * The HTML Element node representing the [min](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#min) value label. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#minLabelElement) */ readonly minLabelElement: HTMLElement | nullish; /** @default "bottom-left" */ position: __esri.UIPosition; /** * Defines how slider thumb values should be rounded. * * @default 4 */ precision: number; /** * Indicates whether to enable editing range values via keyboard input * when the user clicks a [min](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#min) or [max](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#max) label. * * @default false */ rangeLabelInputsEnabled: boolean; /** * 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) */ referenceElement?: ArcgisReferenceElement | string; /** * The HTML Element nodes representing interactive slider segments. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#segmentElements) */ readonly segmentElements: __esri.Collection<HTMLElement>; /** * Indicates if the closest thumb will snap to the clicked location on the track. * * @default true */ snapOnClickEnabled: boolean; /** The current state of the component. */ readonly state: "ready" | "disabled" | "editing" | "dragging"; /** * Sets steps, or intervals, on the slider that restrict user * input to specific values. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#steps) */ steps: number | nullish | number[]; /** * When `true`, all segments will sync together in updating thumb values when the user drags any segment. * * @default false */ syncedSegmentsEnabled: boolean; /** * The HTML Element nodes representing slider thumbs. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#thumbElements) */ readonly thumbElements: __esri.Collection<HTMLElement>; /** * When `false`, the user can freely move any slider thumb to any * position along the track. * * @default true */ thumbsConstrained: boolean; /** * When set, renders ticks along the slider track. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#tickConfigs) */ tickConfigs: __esri.TickConfig[]; /** * The HTML Element nodes representing slider ticks and their associated labels. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#tickElements) */ readonly tickElements: __esri.Collection<__esri.Collection<__esri.TickElementGroup>>; /** * The HTML Element node representing the slider track. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#trackElement) */ readonly trackElement: HTMLElement | nullish; /** * An array of numbers representing absolute thumb positions on the slider. * * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Slider.html#values) */ values: nullish | number[]; /** Permanently destroy the component. */ destroy(): Promise<void>; readonly arcgisMaxChange: TargetedEvent<this, __esri.SliderMaxChangeEvent>; readonly arcgisMaxClick: TargetedEvent<this, __esri.SliderMaxClickEvent>; readonly arcgisMinChange: TargetedEvent<this, __esri.SliderMinChangeEvent>; readonly arcgisMinClick: TargetedEvent<this, __esri.SliderMinClickEvent>; /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */ readonly arcgisPropertyChange: TargetedEvent<this, { name: "state"; }>; /** Emitted when the component associated with a map or scene view is is ready to be interacted with. */ readonly arcgisReady: TargetedEvent<this, void>; readonly arcgisSegmentClick: TargetedEvent<this, __esri.SliderSegmentClickEvent>; readonly arcgisSegmentDrag: TargetedEvent<this, __esri.SliderSegmentDragEvent>; readonly arcgisThumbChange: TargetedEvent<this, __esri.SliderThumbChangeEvent>; readonly arcgisThumbClick: TargetedEvent<this, __esri.SliderThumbClickEvent>; readonly arcgisThumbDrag: TargetedEvent<this, __esri.SliderThumbDragEvent>; readonly arcgisTickClick: TargetedEvent<this, __esri.SliderTickClickEvent>; readonly arcgisTrackClick: TargetedEvent<this, __esri.SliderTrackClickEvent>; } export {};