mirror of
https://github.com/barsdeveloper/ueblueprint.git
synced 2026-02-27 02:34:45 +08:00
Dropdown implementation, switch refactoring
* Various fixes * Fix tests * Dropdown names deduced from pin names * Remove update callbacks * Fix double pins issue * return undefined if not switch
This commit is contained in:
49
js/template/pin/DropdownTemplate.js
Normal file
49
js/template/pin/DropdownTemplate.js
Normal file
@@ -0,0 +1,49 @@
|
||||
import { html } from "lit"
|
||||
import ITemplate from "../ITemplate.js"
|
||||
import MouseIgnore from "../../input/mouse/MouseIgnore.js"
|
||||
|
||||
/**
|
||||
* @typedef {import ("../../element/DropdownElement.js").default} DropdownElement
|
||||
* @typedef {import("lit").PropertyValues} PropertyValues
|
||||
*/
|
||||
|
||||
/** @extends {ITemplate<DropdownElement>} */
|
||||
export default class DropdownTemplate extends ITemplate {
|
||||
|
||||
/** @type {HTMLSelectElement} */
|
||||
#selectElement
|
||||
|
||||
render() {
|
||||
return html`
|
||||
<select class="ueb-pin-input-content">
|
||||
${this.element.options.map(([k, v]) => html`
|
||||
<option value="${k}" ?selected="${k === this.element.selected}">${v}</option>
|
||||
`)}
|
||||
</select>
|
||||
`
|
||||
}
|
||||
|
||||
/** @param {PropertyValues} changedProperties */
|
||||
firstUpdated(changedProperties) {
|
||||
super.firstUpdated(changedProperties)
|
||||
this.#selectElement = this.element.querySelector("select")
|
||||
const event = new Event("input", { bubbles: true })
|
||||
this.#selectElement.dispatchEvent(event)
|
||||
}
|
||||
|
||||
createInputObjects() {
|
||||
return [
|
||||
...super.createInputObjects(),
|
||||
// Prevents creating links when selecting text and other undesired mouse actions detection
|
||||
new MouseIgnore(this.element, this.blueprint),
|
||||
]
|
||||
}
|
||||
|
||||
setSelectedValue(value) {
|
||||
/** @type {HTMLOptionElement} */(this.element.querySelector(`option[value="${value}"]`)).defaultSelected = true
|
||||
}
|
||||
|
||||
getSelectedValue() {
|
||||
return this.#selectElement.value
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user