mirror of
https://github.com/Choices-js/Choices.git
synced 2024-05-02 05:52:46 +02:00
68313da412
* Typescript config setup * Add type annotations to components * Further type additions * And more... * Add types to actions * Add types to templates * Further type checks * Further type additons * Install fuse latest * Housekeeping * Remove old type definitions * Fix remaning type issues * Fix some failing tests * Remove types workflow * Fix failing unit tests * Resolve back space event regression * Convert cypress files to .ts * Fix eslint issues * Remove cachebusting urls * Resolve delete button bug * Resolve regression bugs * Fix lint script * Fix lint workflow * Pass args instead of object to keyboard handlers * Flatten misc reducer * Resolve keyboad action test failures * Use Pick instead of Partial * Use interfaces in action tests * Update firefox image * Incorporate #791 * Incorporate #788
57 lines
1.2 KiB
TypeScript
57 lines
1.2 KiB
TypeScript
import { PassedElement, ClassNames } from '../interfaces';
|
|
|
|
export default class Dropdown {
|
|
element: HTMLElement;
|
|
type: PassedElement['type'];
|
|
classNames: ClassNames;
|
|
isActive: boolean;
|
|
|
|
constructor({
|
|
element,
|
|
type,
|
|
classNames,
|
|
}: {
|
|
element: HTMLElement;
|
|
type: PassedElement['type'];
|
|
classNames: ClassNames;
|
|
}) {
|
|
this.element = element;
|
|
this.classNames = classNames;
|
|
this.type = type;
|
|
this.isActive = false;
|
|
}
|
|
|
|
/**
|
|
* Bottom position of dropdown in viewport coordinates
|
|
*/
|
|
get distanceFromTopWindow(): number {
|
|
return this.element.getBoundingClientRect().bottom;
|
|
}
|
|
|
|
getChild(selector: string): HTMLElement | null {
|
|
return this.element.querySelector(selector);
|
|
}
|
|
|
|
/**
|
|
* Show dropdown to user by adding active state class
|
|
*/
|
|
show(): this {
|
|
this.element.classList.add(this.classNames.activeState);
|
|
this.element.setAttribute('aria-expanded', 'true');
|
|
this.isActive = true;
|
|
|
|
return this;
|
|
}
|
|
|
|
/**
|
|
* Hide dropdown from user
|
|
*/
|
|
hide(): this {
|
|
this.element.classList.remove(this.classNames.activeState);
|
|
this.element.setAttribute('aria-expanded', 'false');
|
|
this.isActive = false;
|
|
|
|
return this;
|
|
}
|
|
}
|