@luzmo/lucero 0.0.35 → 0.0.36

package/components/select/select.d.ts

@@ -34,77 +34,143 @@ declare const LuzmoSelect_base: typeof Focusable & {
  * @fires luzmo-opened - Announces that the overlay has been opened
  * @fires luzmo-closed - Announces that the overlay has been closed
  * @fires luzmo-search - Announces that the search has been updated
+ * @fires luzmo-scrolled - Announces that the user has scrolled within the options menu. Only fires when the options menu is virtualized.
+ * @attr size - The size of the select: `s`, `m`, `l` or `xl`
  */
 export declare class LuzmoSelect extends LuzmoSelect_base {
+    /**
+     * @internal
+     */
     static get styles(): CSSResultArray;
+    /**
+     * @internal
+     */
     button: HTMLButtonElement;
     /**
-     * Whether the Picker is disabled.
+     * @attr disabled - Whether the Picker is disabled.
+     * @default false
      */
     disabled: boolean;
+    /**
+     * @attr focused - Whether the Picker is focused.
+     * @default false
+     */
     focused: boolean;
     /**
-     * Whether to show icons only in menu or not in menu items or do show them (undefined)
+     * @attr icons - Whether to show icons only in menu (`only`) or not in menu items (`none`) or do show them (`undefined`)
      */
     icons?: 'only' | 'none';
     /**
-     * Type of visual selection
+     * @attr variant - Type of visual selection. Possible values: `checkmarks`, `checkboxes`, `highlight`
+     * @default 'checkmarks'
      */
     variant?: 'checkmarks' | 'checkboxes' | 'highlight';
     /**
-     * Whether the Select checkboxes are emphasized.
+     * @attr emphasized - Whether the Select checkboxes are emphasized.
+     * @default false
      */
     emphasized: boolean;
     /**
-     * Whether the value is invalid.
+     * @attr invalid - Whether the select is marked invalid.
+     * @default false
      */
     invalid: boolean;
     /**
-     * Whether the search input is visible.
+     * @attr search - Whether the search input is visible.
+     * @default 'auto'
      */
     search?: 'on' | 'off' | 'auto';
+    /**
+     * @attr no-wrap - Whether the text in the option childs should wrap
+     * @default false
+     */
     noWrap: boolean;
     /**
-     * Whether items are currently being retrieved.
+     * @attr retrieving - Whether items are currently being retrieved.
+     * @default false
      */
     retrieving: boolean;
     /**
-     * Whether the items are currently loading.
+     * @attr pending - Whether the select is currently marked as pending.
+     * @default false
      */
     pending: boolean;
     /**
-     * Whether the Select is clearable.
+     * @attr clearable - Whether the Select is clearable.
+     * @default false
      */
     clearable: boolean;
-    /** Defines a string value that labels the Picker while it is in pending state. */
+    /**
+     * @attr pending-label - Defines a string value that labels the Picker while it is in pending state.
+     * @default 'Pending'
+     */
     pendingLabel: string;
-    /** Defines a string value that labels the Picker when no results are found. */
+    /**
+     * @attr search-label - Defines a string value that labels the Picker when no results are found.
+     * @default 'Search'
+     */
     searchLabel: string;
-    /** Defines a string value that labels the Picker when no results are found. */
+    /**
+     * @attr no-results-label - Defines a string value that labels the Picker when no results are found.
+     * @default 'No results'
+     */
     noResultsLabel: string;
-    /** Defines a string value that labels the Picker when no data is available. */
+    /**
+     * @attr no-data-label - Defines a string value that labels the Picker when no data is available.
+     * @default 'No data'
+     */
     noDataLabel: string;
-    /** Defines a string value that labels the Picker when multiple items are selected. */
+    /**
+     * @attr multiple-label-template - Defines a string value that labels the Picker when multiple items are selected.
+     * @default 'Selected {count} items'
+     */
     multipleLabelTemplate: string;
+    /**
+     * @attr label - The label of the select. This is used to set the aria-label of the select.
+     */
     label?: string;
     /**
-     * Whether the Picker is open.
+     * @attr open - Whether the Picker is open.
+     * @default false
      */
     open: boolean;
     /**
-     * Readonly value
+     * @attr readonly - Whether the select is readonly.
+     * @default false
      */
     readonly: boolean;
+    /**
+     * @attr label-alignment - The alignment of the label.
+     * @default 'inline'
+     */
     labelAlignment?: 'inline';
+    /**
+     * @internal
+     */
     displayLabelContent?: {
         label?: string;
         icon?: string;
         shortLabel?: string;
     };
+    /**
+     * @internal
+     */
     searchString?: string;
+    /**
+     * @internal
+     */
     optionsMenu: LuzmoOptions;
+    /**
+     * @internal
+     */
     searchInput: HTMLInputElement;
+    /**
+     * @internal
+     */
     overlayElement: LuzmoOverlay;
+    /**
+     * @internal
+     */
     virtualizer: LitVirtualizer;
     /**
      * @type {"top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end"}
@@ -112,30 +178,79 @@ export declare class LuzmoSelect extends LuzmoSelect_base {
      */
     placement: Placement;
     /**
-     * Display as a quiet picker
+     * @attr quiet - Display as a quiet picker
+     * @default false
      */
     quiet: boolean;
+    /**
+     * The value of the select.
+     * @type {string | number | null}
+     * @default []
+     */
     value: (string | number | null)[];
+    /**
+     * The options of the select.
+     * @type {any[]}
+     * @default []
+     */
     options: any[];
+    /**
+     * @internal
+     */
     get selfManageFocusElement(): boolean;
     selects: undefined | 'single' | 'multiple';
+    /**
+     * @internal
+     */
     dependencyManager: DependencyManagerController;
+    /**
+     * @internal
+     */
     isMobile: MatchMediaController;
+    /**
+     * @internal
+     */
     strategy: DesktopController | MobileController;
+    /**
+     * @internal
+     */
     pendingStateController: PendingStateController<this>;
+    /**
+     * @internal
+     */
     protected listRole: 'listbox' | 'menu';
+    /**
+     * @internal
+     */
     protected itemRole: string;
+    /**
+     * @internal
+     */
     protected tooltipEl?: LuzmoTooltip;
+    /**
+     * @internal
+     */
     protected hasRenderedOverlay: boolean;
+    /**
+     * @internal
+     */
     private _selfManageFocusElement;
+    /**
+     * @internal
+     */
     private selectionPromise;
+    /**
+     * @internal
+     */
     private enterKeydownOn;
-    private _selectedOptions;
     /**
-     * Initializes the `PendingStateController` for the Picker component.
-     * The `PendingStateController` manages the pending state of the Picker.
+     * @internal
      */
+    private _selectedOptions;
     constructor();
+    /**
+     * @internal
+     */
     get focusElement(): HTMLElement;
     forceFocusVisible(): void;
     click(): void;
@@ -146,6 +261,9 @@ export declare class LuzmoSelect extends LuzmoSelect_base {
     handleButtonFocus(event: FocusEvent): void;
     toggle(target?: boolean): void;
     close(): void;
+    /**
+     * @internal
+     */
     handleSlottableRequest: (_event: SlottableRequestEvent) => void;
     bindEvents(): void;
     connectedCallback(): void;
@@ -153,8 +271,17 @@ export declare class LuzmoSelect extends LuzmoSelect_base {
     protected handleTooltipSlotchange(event: Event & {
         target: HTMLSlotElement;
     }): void;
+    /**
+     * @internal
+     */
     protected renderAngleIcon: () => TemplateResult;
+    /**
+     * @internal
+     */
     protected renderAlertIcon: () => TemplateResult;
+    /**
+     * @internal
+     */
     protected get labelTemplate(): TemplateResult[];
     protected update(changes: PropertyValues<this>): void;
     protected bindButtonKeydownListener(): void;
@@ -163,21 +290,39 @@ export declare class LuzmoSelect extends LuzmoSelect_base {
     protected firstUpdated(changes: PropertyValues<this>): void;
     private _getCssVarInPixels;
     private _estimatePopoverWidth;
+    /**
+     * @internal
+     */
     protected get dismissHelper(): TemplateResult;
     protected render(): TemplateResult;
+    /**
+     * @internal
+     */
     protected get renderDescriptionSlot(): TemplateResult;
     protected setSelectedOptionsFromValue(): void;
     protected renderSearchInput(): TemplateResult;
+    /**
+     * @internal
+     */
     protected get renderMenu(): TemplateResult;
     protected renderOverlay(menu: TemplateResult): TemplateResult;
     protected renderContainer(menu: TemplateResult): TemplateResult;
     protected getUpdateComplete(): Promise<boolean>;
+    /**
+     * @internal
+     */
     protected handleEnterKeydown: (event: KeyboardEvent) => void;
     protected handleScrolled(event: any): void;
     protected handleExceededTop(event: Event): void;
     protected handleSearchInput(event: CustomEvent): void;
     protected handleSearchKeydown(event: KeyboardEvent): void;
+    /**
+     * @internal
+     */
     protected clearValue: (event: Event) => void;
+    /**
+     * @internal
+     */
     protected handleKeydown: (event: KeyboardEvent) => void;
 }
 export {};