@visa/nova-angular
Version:
Visa Product Design System Nova Angular library
159 lines (158 loc) • 6.81 kB
TypeScript
/**
* Copyright (c) 2025 Visa, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*
**/
import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
import { AfterContentInit, ChangeDetectorRef, ElementRef, EventEmitter, QueryList, WritableSignal } from '@angular/core';
import { ControlValueAccessor } from '@angular/forms';
import { AppReadyService } from '../_utilities/services/app-stable-check.service';
import { UUIDService } from '../_utilities/services/uuid.service';
import { ListboxItemComponent } from '../listbox-item/listbox-item.component';
import { NovaLibService } from '../nova-lib.service';
import { ListboxService } from './listbox.service';
import * as i0 from "@angular/core";
export declare class ListboxDirective implements ControlValueAccessor, AfterContentInit {
private uuidService;
private novaLibService;
private listboxService;
private cdRef;
el: ElementRef;
private appReadyService;
listItems: QueryList<ListboxItemComponent>;
_isRoleListboxVariant: WritableSignal<boolean>;
_childrenDisabled: boolean;
_childrenInvalid: boolean;
_internalValue: (string | number)[] | string | number | null;
_inCombobox: boolean;
_listboxHeight: number;
_listboxItemHeight: number;
_listboxGap: number;
_listboxScrollStylesSet: boolean;
_keyword: String;
_highlightIndex: number | null;
_isHotkeyEvent: Boolean;
_recentSelectedIndex: number | null;
_timeoutId: number;
ariaActiveDescendant: WritableSignal<string | null>;
/**
* Provides custom class(es) for custom styling.
* @default .v-listbox
*/
get class(): string;
set class(value: string);
_class: string;
get hostClass(): string;
/**
* Sets custom id.
* @default uuidService.getUUID('v-listbox-')
* @builtin true
*/
id: string;
get hostId(): string;
/**
* Sets listbox to multiselect variant when true.
* @default false
*/
get multiselect(): boolean;
set multiselect(value: BooleanInput);
_multiselect: boolean;
/**
* Sets component and any ListboxItemComponent children as disabled when true. <br>
* Will automatically become true if all children are disabled.
* @default false
*/
get disabled(): boolean;
set disabled(value: BooleanInput);
_disabled: boolean;
/** Fires when a formControl's disabled state updates */
setDisabledState(isDisabled: boolean): void;
/**
* Sets component and any ListboxItemComponent children as invalid when true. <br>
* Will automatically become true if any child is invalid.
* @default false
*/
get invalid(): boolean;
set invalid(value: BooleanInput);
_invalid: boolean;
/**
* Marks component as required when true.
* @default false
*/
get required(): boolean;
set required(value: BooleanInput);
_required: boolean;
/**
* Sets custom role.
* @default 'group' if no child list item contains a child radio or checkbox.
* @default not present if any child list item contains a child radio or checkbox.
* @builtin true
*/
role: string;
get hostRole(): string;
/**
* Sets CSS variable <code>--v-listbox-block-size-scroll</code>. <br />
* If true, the default 180px will be the listbox's <code>max-block-size</code>. <br />
* If set to a number or string representing a number (ie <code>[containHeight]="250"</code>), the variable will be set to that amount of pixels.
*/
get containHeight(): NumberInput | BooleanInput;
set containHeight(value: NumberInput | BooleanInput);
_containHeight: NumberInput | BooleanInput;
get scrollHeight(): NumberInput | void | boolean;
/**
* Value of listbox.
*/
get value(): (string | number)[] | string | number | null;
set value(value: (string | number)[] | string | number | null);
get val(): (string | number)[] | string | number | null;
set val(value: (string | number)[] | string | number | null);
setValue(value: (string | number)[] | string | number | null): void;
_value: string | number | (string | number)[] | null;
/**
* Overrides default scroll control behavior. <br />
* By default the listbox will scroll to the last selected item.
* @default false
*/
get customScrollControl(): boolean;
set customScrollControl(value: BooleanInput);
_customScrollControl: boolean;
/**
* Emits disabled, invalid, and required state of input when updated.
*/
communicateState: EventEmitter<any>;
/**
* Emits new listbox value.
*/
valueUpdated: EventEmitter<any>;
constructor(uuidService: UUIDService, novaLibService: NovaLibService, listboxService: ListboxService, cdRef: ChangeDetectorRef, el: ElementRef, appReadyService: AppReadyService);
handleFocus(event: Event): void;
handleBlur(event: Event): void;
ngAfterContentInit(): void;
setUpListbox(): void;
setInitialValue(): void;
addListItemSubscriptions(): void;
updateItemsFromValue(): void;
updateValueFromItems(): void;
setChildrenDisabled(): void;
setChildrenInvalid(): void;
onChange: (_: any) => void;
onTouched: (_: any) => void;
registerOnChange(fn: any): void;
registerOnTouched(fn: any): void;
writeValue(value: any): void;
resetListbox(): void;
informState(): void;
static ɵfac: i0.ɵɵFactoryDeclaration<ListboxDirective, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<ListboxDirective, "[v-listbox] ", never, { "class": { "alias": "class"; "required": false; }; "id": { "alias": "id"; "required": false; }; "multiselect": { "alias": "multiselect"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "required": { "alias": "required"; "required": false; }; "role": { "alias": "role"; "required": false; }; "containHeight": { "alias": "containHeight"; "required": false; }; "value": { "alias": "value"; "required": false; }; "customScrollControl": { "alias": "customScrollControl"; "required": false; }; }, { "communicateState": "communicateState"; "valueUpdated": "valueUpdated"; }, ["listItems"], never, true, never>;
}