fix: slot

components/select/index.js

@@ -1,7 +1,7 @@
 import Base from "../xy-base.js";
 import style from "./index.css?inline" assert { type: "css" };
-import "../popover/index.js";
 import "../button/index.js";
+import "../popover/index.js";
 import "../icon/index.js";
 
 export default class Select extends Base {

components/theme.css

@@ -53,15 +53,17 @@
   --tips-color: #fff;
 }
 
-xy-popover:not(:defined){
-  position: absolute;
-  visibility: hidden;
-}
 
 html:has(xy-dialog[open]){
   overflow: hidden;
 }
 
+xy-select:not(:defined) xy-option,
+xy-popover:not(:defined){
+  position: absolute;
+  visibility: hidden;
+}
+
 xy-select xy-button[slot="button"]::part(button)::after{
   content: '';
   width: 1em;

components/xy-base.js

@@ -6,7 +6,7 @@ export default class Base extends HTMLElement {
 		super();
 	}
 
-  #mounted = [];
+  #mounted = false;
 
   adoptedStyle (style, dom) {
     let styleSheet = style
@@ -37,17 +37,19 @@ export default class Base extends HTMLElement {
     }
     if (!this.slots.length) return
     return new Promise((resolve) => {
-      if (this.#mounted.length === this.slots.length) {
+      if (this.#mounted) {
         resolve()
       } else {
-        this.slots.forEach((el,i) => el.addEventListener("slotchange", () => {
-          if (!this.#mounted[i]) {
-            this.#mounted[i] = true
-          }
-          if (this.#mounted.length === this.slots.length) {
-            setTimeout(resolve, 200);
-          }
-        }))
+        Promise.all(this.slots.map(el => new Promise((_resolve, reject) => {
+          el.addEventListener("slotchange", () => {
+            _resolve()
+          })
+        })))
+        .then(() =>{
+          console.log('slot加载完成')
+          this.#mounted = true
+          resolve()
+        })
       }
     })
   }