darkwiiplayer/BetterSelect
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Rename files

Browse source
This commit is contained in:
Talia 2025-01-31 14:53:09 +01:00
parent 7963660e2d
commit 7a9048558d
Signed by: darkwiiplayer
GPG key ID: 7808674088232B3E
3 changed files with 13 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
package.json
View file

@ -1,9 +1,12 @@
{
"name": "@darkwiiplayer/better-select",
"browser": "src/BetterSelect.js",
"exports": {
".": "./src/better-select.js",
"./styles": "./src/better-select.css"
},
"type": "module",
"license": "MIT",
"version": "1.5.5",
"version": "2.0.0",
"url": "https://darkwiiplayer.github.io/BetterSelect/",
"scripts": {
"definitions": "tsc src/*.js --declaration --allowJs --emitDeclarationOnly"

4
src/BetterSelect.css → src/better-select.css
View file

@ -66,7 +66,7 @@ better-select {
background-color: var(--highlight);
}
&:not(:state(--open))::part(drop-down) {
&:not(:state(open))::part(drop-down) {
transform: scale(100%, 70%) translate(0, -30%);
opacity: 0;
}
@ -80,7 +80,7 @@ better-select {
transition: transform .3s var(--overshoot);
}
&:state(--open)::part(display)::after {
&:state(open)::part(display)::after {
transform: rotate(180deg);
}
}

12
src/BetterSelect.js → src/better-select.js
View file

@ -145,7 +145,7 @@ export class BetterSelect extends HTMLElement {
slot[name="loading"] {
display: none;
}
:host(:state(--loading)) {
:host(:state(loading)) {
[part="list"] { display: none; }
slot[name="loading"] { display: block; }
}
@ -206,7 +206,7 @@ export class BetterSelect extends HTMLElement {
this.setOption(item)
this.dispatchEvent(new InputEvent("input", {bubbles: true}))
this.close()
} else if (!this.#internals.states.has("--open")) {
} else if (!this.#internals.states.has("open")) {
this.open()
} else if (this.display.contains(event.target) || this.display.contains(event.target.closest("[slot]")?.assignedSlot)) {
this.close()
@ -215,7 +215,7 @@ export class BetterSelect extends HTMLElement {
this.addEventListener("keydown", event => {
const key = event.key
if (this.#internals.states.has("--open")) {
if (this.#internals.states.has("open")) {
if (key == " " && this.list.contains(this.shadowRoot.activeElement)) {
this.close()
event.preventDefault()
@ -325,10 +325,10 @@ export class BetterSelect extends HTMLElement {
this.#internals.states.add("open")
if ("populate" in this) {
this.#internals.states.add("--loading")
this.#internals.states.add("loading")
// @ts-ignore
await this.populate()
this.#internals.states.delete("--loading")
this.#internals.states.delete("loading")
}
}
@ -338,7 +338,7 @@ export class BetterSelect extends HTMLElement {
hidden.removeAttribute("hidden")
this.#abortOpen?.abort()
this.#abortOpen = null
this.#internals.states.delete("--open")
this.#internals.states.delete("open")
this.dialog.close()
}