import WUPBaseElement from "./baseElement"; import WUPPopupElement from "./popup/popupElement"; import { PopupAnimations, PopupCloseCases, PopupOpenCases } from "./popup/popupElement.types"; declare const tagName = "wup-dropdown"; declare global { namespace WUP.Dropdown { interface Options extends WUP.Popup.Options { /** Animation applied to popup; * @defaultValue `PopupAnimations.drawer` * @tutorial Troubleshooting * * to change option for specific element change it for `` directly after timeout * @example setTimeout(() => this.$refPopup.$options.animation = PopupAnimations.stack) */ animation: PopupAnimations; /** Case when popup need to show; * @defaultValue `PopupOpenCases.onClick | PopupOpenCases.onFocus` * @tutorial Troubleshooting * * to change option for specific element change it for `` directly after timeout * @example setTimeout(() => this.$refPopup.$options.openCase = PopupOpenCases.onFocus | PopupOpenCases.onClick) */ openCase: PopupOpenCases; /** Close menu on popup click * @defaultValue true */ closeOnPopupClick: boolean; /** Placement rules relative to target; * @defaultValue `[ WUPPopupElement.$placements.$bottom.$start, WUPPopupElement.$placements.$bottom.$end, WUPPopupElement.$placements.$top.$start, WUPPopupElement.$placements.$top.$end, WUPPopupElement.$placements.$bottom.$start.$resizeHeight, WUPPopupElement.$placements.$bottom.$end.$resizeHeight, WUPPopupElement.$placements.$top.$start.$resizeHeight, WUPPopupElement.$placements.$top.$end.$resizeHeight ]` */ placement: Array; /** Sets minWidth 100% of targetWidth; it can't be more than css-style min-width * @defaultValue true */ minWidthByTarget: boolean; /** Sets minHeight 100% of targetWidth; it can't be more than css-style min-height * @defaultValue true */ minHeightByTarget: boolean; } interface JSXProps { /** Close menu on popup click * @defaultValue true */ "w-closeOnPopupClick"?: boolean; } } interface HTMLElementTagNameMap { [tagName]: WUPDropdownElement; } namespace JSX { interface IntrinsicElements { /** Dropdown element * @see {@link WUPDropdownElement} */ [tagName]: WUP.Base.ReactHTML & WUP.Dropdown.JSXProps; } } } declare module "preact/jsx-runtime" { namespace JSX { interface HTMLAttributes { } interface IntrinsicElements { /** Dropdown element * @see {@link WUPDropdownElement} */ [tagName]: HTMLAttributes & WUP.Dropdown.JSXProps; } } } /** Dropdown element * @example * ```html
* ``` * @tutorial Troubleshooting * * in comparison with Combobox Dropdown doesn't contain input but can contain in popup any items (like nav-menu etc.) */ export default class WUPDropdownElement extends WUPBaseElement { #private; static get $style(): string; /** Default options applied to every element. Change it to configure default behavior * * @tutorial Troubleshooting * * Popup-related options are not observed so to change it use `WUPDropdownElement.$defaults` or `element.$refPopup.$options` directly */ static $defaults: WUP.Dropdown.Options; /** Reference to nested HTMLElement tied with $options.label */ $refTitle: HTMLElement; /** Reference to popupMenu */ $refPopup: WUPPopupElement; /** Reference to list */ $refMenu: HTMLElement; protected gotReady(): void; /** Custom function to override default `WUPPopupElement.prototype.goClose` */ protected goOpenPopup(openCase: PopupOpenCases, ev: MouseEvent | FocusEvent | null): Promise; /** Custom function to override default `WUPPopupElement.prototype.goClose` */ protected goClosePopup(closeCase: PopupCloseCases, ev: MouseEvent | FocusEvent | KeyboardEvent | null): Promise; } export {};