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
58 lines
1.6 KiB
TypeScript
58 lines
1.6 KiB
TypeScript
import WrappedElement from './wrapped-element';
|
|
import { ClassNames, Item } from '../interfaces';
|
|
|
|
export default class WrappedSelect extends WrappedElement {
|
|
element: HTMLSelectElement;
|
|
classNames: ClassNames;
|
|
template: (data: object) => HTMLOptionElement;
|
|
|
|
constructor({
|
|
element,
|
|
classNames,
|
|
template,
|
|
}: {
|
|
element: HTMLSelectElement;
|
|
classNames: ClassNames;
|
|
template: (data: object) => HTMLOptionElement;
|
|
}) {
|
|
super({ element, classNames });
|
|
this.template = template;
|
|
}
|
|
|
|
get placeholderOption(): HTMLOptionElement | null {
|
|
return (
|
|
this.element.querySelector('option[value=""]') ||
|
|
// Backward compatibility layer for the non-standard placeholder attribute supported in older versions.
|
|
this.element.querySelector('option[placeholder]')
|
|
);
|
|
}
|
|
|
|
get optionGroups(): Element[] {
|
|
return Array.from(this.element.getElementsByTagName('OPTGROUP'));
|
|
}
|
|
|
|
get options(): Item[] | HTMLOptionElement[] {
|
|
return Array.from(this.element.options);
|
|
}
|
|
|
|
set options(options: Item[] | HTMLOptionElement[]) {
|
|
const fragment = document.createDocumentFragment();
|
|
const addOptionToFragment = (data): void => {
|
|
// Create a standard select option
|
|
const option = this.template(data);
|
|
// Append it to fragment
|
|
fragment.appendChild(option);
|
|
};
|
|
|
|
// Add each list item to list
|
|
options.forEach(optionData => addOptionToFragment(optionData));
|
|
|
|
this.appendDocFragment(fragment);
|
|
}
|
|
|
|
appendDocFragment(fragment: DocumentFragment): void {
|
|
this.element.innerHTML = '';
|
|
this.element.appendChild(fragment);
|
|
}
|
|
}
|