@esri/calcite-components
Version:
Web Components for Esri's Calcite Design System.
85 lines (84 loc) • 3.83 kB
TypeScript
/// <reference path="../../index.d.ts" />
import type { PublicLitElement as LitElement } from "@arcgis/lumina";
import type { ComboboxChildElement } from "../calcite-combobox/interfaces.js";
import type { IconName } from "../calcite-icon/interfaces.js";
/**
* @cssproperty [--calcite-combobox-item-border-color] - [Deprecated] Specifies the component's border color.
* @cssproperty [--calcite-combobox-text-color] - Specifies the component's text and `icon` color.
* @cssproperty [--calcite-combobox-text-color-hover] - Specifies the component's text and `icon` color when hovered.
* @cssproperty [--calcite-combobox-item-background-color-active] - When `active`, specifies the component's background color.
* @cssproperty [--calcite-combobox-item-background-color-hover] - Specifies the component's background color when hovered.
* @cssproperty [--calcite-combobox-item-shadow] - Specifies the component's shadow.
* @cssproperty [--calcite-combobox-selected-icon-color] - Specifies the component's `selected` indicator icon color.
* @cssproperty [--calcite-combobox-description-text-color] - Specifies the component's `description` and `shortHeading` text color.
* @cssproperty [--calcite-combobox-description-text-color-press] - Specifies the component's `description` and `shortHeading` text color when hovered.
* @cssproperty [--calcite-combobox-heading-text-color] - Specifies the component's `heading` text color.
* @slot - A slot for adding nested `calcite-combobox-item`s.
* @slot [content-end] - A slot for adding non-actionable elements after the component's content.
* @slot [content-start] - A slot for adding non-actionable elements before the component's content.
*/
export abstract class ComboboxItem extends LitElement {
/**
* When `true`, the component is active.
*
* @default false
*/
accessor active: boolean;
/** Specifies the parent and grandparent `calcite-combobox-item`s, which are set on `calcite-combobox`. */
accessor ancestors: ComboboxChildElement[];
/** Specifies a description for the component. Displays below the heading. */
accessor description: string;
/**
* When `true`, prevents interaction and decreases the component's opacity.
*
* @default false
*/
accessor disabled: boolean;
/**
* When `true`, omits the component from the `calcite-combobox` filtered search results.
*
* @default false
*/
accessor filterDisabled: boolean;
/** The `id` attribute of the component. When omitted, a globally unique identifier is used. */
accessor guid: string;
/**
* Specifies the component's heading text.
*
* @required
*/
accessor heading: string;
/** Specifies an icon to display. */
accessor icon: IconName;
/**
* When `true` and the element direction is right-to-left (`"rtl"`), flips the component`s `icon`.
*
* @default false
*/
accessor iconFlipRtl: boolean;
/** Specifies an accessible label for the component. */
accessor label: any;
/** Specifies additional metadata to the component for use in filtering. */
accessor metadata: Record<string, unknown>;
/**
* When `true`, the component is selected.
*
* @default false
*/
accessor selected: boolean;
/**
* Specifies the component's short heading.
*
* When provided, the short heading will be displayed in the component's selection.
*
* It is recommended to use 5 characters or fewer.
*/
accessor shortHeading: string;
/** The component's value. Falls back to `heading` if not provided. */
accessor value: any;
/** Fires whenever the component is selected or unselected. */
readonly calciteComboboxItemChange: import("@arcgis/lumina").TargetedEvent<this, void>;
readonly "@eventTypes": {
calciteComboboxItemChange: ComboboxItem["calciteComboboxItemChange"]["detail"];
};
}