UNPKG

web-ui-pack

Version:
126 lines (125 loc) 6.74 kB
import WUPPopupElement from "../popup/popupElement"; import { SetValueReasons } from "./baseControl"; import WUPTextControl from "./text"; export declare const enum MenuOpenCases { /** When $openMenu() called programmatically; Don't use it for $options (it's for nested cycle) */ onManualCall = 0, /** When control got focus via user interaction; ignores case when user changed value by click on item on clearButton * to change such behavior update WUPBaseComboControl.prototype.canOpenMenu */ onFocus = 2, /** When control got focus programmatically (via option `autofocus` or when called method 'focus()') */ onFocusAuto = 4, /** When user clicks on control (beside editable not-empty input) */ onClick = 8, /** When user clicks on input (by default it's disabled rule to allow user to work with input without popup close/open blinks) */ onClickInput = 16, /** When user types text */ onInput = 32, /** When user presses arrowUp/arrowDown */ onPressArrowKey = 64 } export declare const enum MenuCloseCases { /** When $closeMenu() called programmatically; Don't use it for $options (it's for nested cycle) */ onManualCall = 0, /** When user clicks on control but not menu (beside editable not-empty input) */ onClick = 1, /** When user clicks on menu item and it's selected */ onSelect = 2, /** When control loses focus */ onFocusLost = 3, /** When user presses Escape key */ OnPressEsc = 4, /** When user presses Enter key */ OnPressEnter = 5, /** When options are changed and need to re-render */ OnOptionsChange = 6 } declare global { namespace WUP.BaseCombo { interface EventMap extends WUP.Text.EventMap { /** Fires after popup-menu is opened (after animation finishes) */ $openMenu: Event; /** Fires after popup is closed (after animation finishes) */ $closeMenu: Event; } interface ValidityMap extends Omit<WUP.Text.ValidityMap, "min" | "max" | "email"> { } interface NewOptions { /** Case when menu-popup to open; WARN MenuOpenCases.inputClick doesn't work without MenuOpenCases.click * @defaultValue onPressArrowKey | onClick | onFocus */ openCase: MenuOpenCases; /** Set true to make input not editable but allow select items via popup-menu (ordinary dropdown mode) */ readOnlyInput: boolean | number; } interface Options<T = any, VM = ValidityMap> extends WUP.Text.Options<T, VM>, NewOptions { } interface JSXProps<C = WUPBaseComboControl> extends WUP.Text.JSXProps<C>, WUP.Base.OnlyNames<NewOptions> { "w-openCase"?: MenuOpenCases | number; "w-readOnlyInput"?: boolean | number; } } } /** Base abstract form-control for any control with popup-menu (Dropdown, Datepicker etc.) */ export default abstract class WUPBaseComboControl<ValueType = any, TOptions extends WUP.BaseCombo.Options = WUP.BaseCombo.Options, EventMap extends WUP.BaseCombo.EventMap = WUP.BaseCombo.EventMap> extends WUPTextControl<ValueType, TOptions, EventMap> { #private; static get $style(): string; static $defaults: WUP.BaseCombo.Options<any>; /** Fires after popup-menu is opened (after animation finishes) */ $onOpenMenu?: (e: Event) => void; /** Fires after popup is closed (after animation finishes) */ $onCloseMenu?: (e: Event) => void; /** Returns if popup-menu is opened */ get $isOpened(): boolean; /** Close popup-menu * @returns Promise resolved by animation time */ $closeMenu(): Promise<void>; /** Open popup-menu * @returns Promise resolved resolved by animation time */ $openMenu(): Promise<void>; /** Reference to popupMenu */ $refPopup?: WUPPopupElement; protected renderControl(): void; protected gotChanges(propsChanged: Array<keyof WUP.BaseCombo.Options> | null): void; gotFormChanges(propsChanged: Array<keyof WUP.Form.Options | keyof WUP.BaseCombo.Options> | null): void; setupInputReadonly(): void; /** Called when need to create menu in opened popup */ protected abstract renderMenu(popup: WUPPopupElement, menuId: string): HTMLElement; /** Called when need to transfer current value to text-input (or string-value) */ protected abstract valueToInput(v: ValueType | undefined): string; /** Called on user's keyDown to apply focus on popup-menu items */ protected abstract focusMenuItemByKeydown(e: KeyboardEvent): void; /** Returns whether possible to use input-click as dropdown behavior */ isLockInputDropdown(e: Event): boolean; /** Override to change open-behavior */ canOpenMenu(openCase: MenuOpenCases, e?: MouseEvent | FocusEvent | KeyboardEvent | null): boolean; /** Called when need to create new popup for menu */ protected renderPopup(menuId: string): WUPPopupElement; protected goOpenMenu(openCase: MenuOpenCases, e?: MouseEvent | FocusEvent | KeyboardEvent | null): Promise<WUPPopupElement | null>; /** Override to change close-behavior */ canCloseMenu(closeCase: MenuCloseCases, e?: MouseEvent | FocusEvent | null): boolean; protected _isClosing?: true; protected goCloseMenu(closeCase: MenuCloseCases, e?: MouseEvent | FocusEvent | null): Promise<boolean>; /** Current focused menu-item (via aria-activedescendant) */ _focusedMenuItem?: HTMLElement | null; /** Focus/resetFocus for item (via aria-activedescendant) */ protected focusMenuItem(next: HTMLElement | null): void; /** Scroll to element if previous scroll is not in processing (debounce by empty timeout) */ tryScrollTo(el: HTMLElement): void; _selectedMenuItem?: HTMLElement | null; /** Select item (set aria-selected and scroll to) */ protected selectMenuItem(next: HTMLElement | null): void; protected gotKeyDown(e: KeyboardEvent): void; protected gotInput(e: WUP.Text.GotInputEvent, preventValueChange?: boolean): void; protected gotFocus(ev: FocusEvent): Array<() => void>; protected gotFocusLost(): void; /** Called when user selected new value from menu and need to close menu */ protected selectValue(v: ValueType, canCloseMenu?: boolean): void; /** Reset input to currentValue; called on pressing Escape or Enter */ protected resetInputValue(): void; protected setInputValue(v: ValueType | undefined, reason: SetValueReasons): void; protected setInputValueDirect(v: string, reason: SetValueReasons): void; /** Called when popup must be removed (by focus out OR if control removed) */ protected removePopup(): void; protected gotRemoved(): void; private inputFocus; }