Method getHTML

src/webpage/utils/fancySelect.ts:19–128

()

		this.max = max;
	}
	getHTML() {
		const div = document.createElement("div");
		div.classList.add("fancySelect");
		const input = document.createElement("input");
		input.type = "text";
		div.append(input);

		const options = document.createElement("div");
		options.classList.add("fancyOptions");
		const genArgs = () => {
			Array.from(div.getElementsByClassName("selected")).forEach((_) => _.remove());
			for (const option of this.options.toReversed()) {
				if (!option.default) continue;
				const span = document.createElement("span");
				span.classList.add("selected");
				span.textContent = option.label;

				const x = document.createElement("span");
				x.classList.add("svg-x");
				span.prepend(x);
				x.onmousedown = (e) => {
					e.preventDefault();
					e.stopImmediatePropagation();
					input.focus();
					span.remove();
					option.default = false;
					genList(input.value);
				};

				div.prepend(span);
			}
		};
		const genList = (filter: string) => {
			options.innerHTML = "";
			options.classList.remove("removeElm");
			for (const option of this.options) {
				if (
					!option.label.includes(filter) &&
					!option.description?.includes(filter) &&
					!option.value.includes(filter)
				) {
					continue;
				}
				const div = document.createElement("div");
				div.classList.add("flexltr");

				const check = document.createElement("input");
				check.type = "checkbox";
				check.checked = option.default;
				check.onclick = (e) => e.preventDefault();

				const label = document.createElement("div");
				label.classList.add("flexttb");
				label.append(option.label);
				if (option.description) {
					const p = document.createElement("p");
					p.textContent = option.description;
					label.append(p);