Method renderDropdown

src/dropdown.ts:243–282

()

	}

	private renderDropdown() {
		if (!this.dropdownEl) return;
		this.dropdownEl.empty();

		if (this.labels.clearLabel && this.selectedValues.size > 0) {
			const clearItem = this.dropdownEl.createDiv({ cls: "custom-dropdown-item custom-dropdown-clear" });
			clearItem.textContent = this.labels.clearLabel;
			clearItem.addEventListener("click", (e) => {
				e.stopPropagation();
				this.selectedValues.clear();
				this.updateLabel();
				this.renderDropdown();
				this.notifyChange();
			});
		}

		this.options.forEach((label, value) => {
			const item = this.dropdownEl!.createDiv({ cls: "custom-dropdown-item" });
			const check = item.createDiv({ cls: "custom-dropdown-check" });
			setIcon(check, "check");
			item.createDiv({ cls: "custom-dropdown-text", text: label });
			item.setAttr("title", label);
			const isSelected = this.selectedValues.has(value);
			if (isSelected) {
				item.addClass("is-selected");
			}

			item.addEventListener("click", (e) => {
				e.stopPropagation();
				if (this.selectedValues.has(value)) {
					this.selectedValues.delete(value);
				} else {
					this.selectedValues.add(value);
				}
				this.updateLabel();
				this.renderDropdown();
				this.notifyChange();
			});
		});
	}

	onChange(callback: (values: string[]) => void) {
		this.onChangeCallback = callback;