UNPKG

@arcgis/map-components

Version:
114 lines (113 loc) 5.78 kB
/// <reference path="../../index.d.ts" /> import type Collection from "@arcgis/core/core/Collection.js"; import type { PublicLitElement as LitElement } from "@arcgis/lumina"; /** @internal */ export abstract class ArcgisValuePickerCollection 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/components/arcgis-value-picker-collection/#destroy) method when you are done to * prevent memory leaks. * * @default false */ accessor autoDestroyDisabled: boolean; /** * Determines whether the user can interact with the next button. * This property is automatically set to `false` when [currentValue](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-value-picker-collection/#currentValue) matches the last index of * [items](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-value-picker-collection/#items). * * @default false * @example * ```js * const valuePicker = document.querySelector("arcgis-value-picker"); * const valuePickerCollection = document.querySelector("arcgis-value-picker-collection"); * * const collection = new Collection([ * { name: "Isaac Newton", dob: new Date(1643, 0, 4)}, * { name: "Albert Einstein", dob: new Date(1879, 2, 14)}, * { name: "Ernest Rutherford", dob: new Date(1871, 7, 20)} * ]); * valuePickerCollection.items = collection; * valuePickerCollection.currentValue = valuePickerCollection.items.at(0); * if (valuePickerCollection.canNext === true) { * valuePicker.next(); * console.log(valuePickerCollection.currentValue.name); // "Albert Einstein" * } * ``` */ accessor canNext: boolean; /** * Determines whether the user can interact with the play/pause button. * * @default false */ accessor canPlay: boolean; /** * Determines whether the user can interact with the previous button. * This property is automatically set to `false` when [currentValue](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-value-picker-collection/#currentValue) matches the first index of * [items](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-value-picker-collection/#items). * * @default false * @example * ```js * const valuePicker = document.querySelector("arcgis-value-picker"); * const valuePickerCollection = document.querySelector("arcgis-value-picker-collection"); * * const collection = new Collection([ * { name: "Isaac Newton", dob: new Date(1643, 0, 4)}, * { name: "Albert Einstein", dob: new Date(1879, 2, 14)}, * { name: "Ernest Rutherford", dob: new Date(1871, 7, 20)} * ]); * valuePickerCollection.items = collection; * valuePickerCollection.currentValue = valuePickerCollection.items.at(1); * if (valuePickerCollection.canPrevious === true) { * valuePicker.previous(); * console.log(valuePickerCollection.currentValue.name); // "Isaac Newton" * } * ``` */ accessor canPrevious: boolean; /** * The currently selected collection item. Note that because the type of [items](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-value-picker-collection/#items) is a * [Collection](https://developers.arcgis.com/javascript/latest/references/core/core/Collection/) of any shape, this component * identifies `currentValue` by reference rather than matching a field that may not always be present. Ensure that `currentValue` is always * assigned from an existing element within `items`. * * @example * ```js * const valuePickerCollection = document.querySelector("arcgis-value-picker-collection"); * * const collection = new Collection([ * { name: "Isaac Newton", dob: new Date(1643, 0, 4)}, * { name: "Albert Einstein", dob: new Date(1879, 2, 14)}, * { name: "Ernest Rutherford", dob: new Date(1871, 7, 20)} * ]); * valuePickerCollection.items = collection; * * // 3 different approaches to setting currentValue * * // Acceptable. currentValue is a reference to items * valuePickerCollection.currentValue = valuePickerCollection.items.at(0); * * // Acceptable. currentValue is assigned to the element at the index of items returned by find() * valuePickerCollection.currentValue = valuePickerCollection.items.find( * ({ name }) => name === "Albert Einstein" * ); * * // Invalid. The component has no mechanism to predict which field should be used to match this property to an index. * valuePickerCollection.currentValue = { name: "Isaac Newton", dob: new Date(1643, 0, 4) }; * ``` */ accessor currentValue: unknown | undefined; /** The collection of arbitrary items that [arcgis-value-picker](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-value-picker/) can iterate over. */ accessor items: Collection | 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 arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "canNext" | "canPlay" | "canPrevious" | "currentValue"; }>; readonly "@eventTypes": { arcgisPropertyChange: ArcgisValuePickerCollection["arcgisPropertyChange"]["detail"]; }; }