ranui 0.1.9 → 0.1.10-alpha.2

package/dist/{index-7216d6b0.js → index-DqtzBqPN.js}

@@ -4,22 +4,13 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { s as str2Xml } from "./index-7913ec46.js";
-const __variableDynamicImportRuntimeHelper = (glob, path) => {
-  const v = glob[path];
-  if (v) {
-    return typeof v === "function" ? v() : Promise.resolve(v);
-  }
-  return new Promise((_, reject) => {
-    (typeof queueMicrotask === "function" ? queueMicrotask : setTimeout)(reject.bind(null, new Error("Unknown variable dynamic import: " + path)));
-  });
-};
-const f7170ee498e0dd32cbdcb63fba8f75cc = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{display:inline-flex}:host .ran-icon{display:flex}:host([spin]){animation-name:rotate;animation-duration:1.4s;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes rotate{to{transform:rotate(360deg)}}\n";
+import { _ as __variableDynamicImportRuntimeHelper, s as str2Xml } from "./arrow-down-D4qr4m33.js";
+import "./utils-74Icp-PI.js";
 const X_LINKS_NS = "http://www.w3.org/1999/xlink";
 const X_LINK_HREF = "xlink:href";
 function Custom() {
-  if (typeof window !== "undefined" && !customElements.get("r-icon")) {
-    class CustomElement extends HTMLElement {
+  if (typeof window !== "undefined" && !customElements.get("ra-icon")) {
+    class RaIcon extends HTMLElement {
       constructor() {
         super();
         __publicField(this, "_icon");
@@ -29,7 +20,7 @@ function Custom() {
          */
         __publicField(this, "loadLocal", () => {
           return new Promise((resolve, reject) => {
-            __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "../../assets/icons/add-user.svg": () => import("./add-user-b2bed3e7.js"), "../../assets/icons/arrow-down.svg": () => import("./info-circle-fill-90ec9aa9.js").then((n) => n.a), "../../assets/icons/book.svg": () => import("./book-b11a68eb.js"), "../../assets/icons/check-circle-fill.svg": () => import("./check-circle-fill-dc284144.js"), "../../assets/icons/check-circle.svg": () => import("./check-circle-74bd09c3.js"), "../../assets/icons/close-circle-fill.svg": () => import("./close-circle-fill-238a66b1.js"), "../../assets/icons/close-circle.svg": () => import("./close-circle-720c18be.js"), "../../assets/icons/close.svg": () => import("./close-20925345.js"), "../../assets/icons/eye-close.svg": () => import("./eye-close-3874f1ae.js"), "../../assets/icons/eye.svg": () => import("./eye-5e742329.js"), "../../assets/icons/home.svg": () => import("./home-c4a05e8b.js"), "../../assets/icons/info-circle-fill.svg": () => import("./info-circle-fill-90ec9aa9.js").then((n) => n.i), "../../assets/icons/info-circle.svg": () => import("./info-circle-5826decc.js"), "../../assets/icons/loading.svg": () => import("./loading-09ca52df.js"), "../../assets/icons/lock.svg": () => import("./lock-1d2487c9.js"), "../../assets/icons/message.svg": () => import("./message-b2bfdea7.js"), "../../assets/icons/power-off.svg": () => import("./power-off-6ade5a91.js"), "../../assets/icons/preview.svg": () => import("./preview-b291aea8.js"), "../../assets/icons/setting.svg": () => import("./setting-1e5ccb6d.js"), "../../assets/icons/team.svg": () => import("./team-ca6a12e1.js"), "../../assets/icons/unlock.svg": () => import("./unlock-f56086fd.js"), "../../assets/icons/user.svg": () => import("./user-5c01e665.js"), "../../assets/icons/warning-circle-fill.svg": () => import("./warning-circle-fill-d17c37c9.js"), "../../assets/icons/warning-circle.svg": () => import("./warning-circle-035e025c.js") }), `../../assets/icons/${this.name}.svg`).then((result) => {
+            __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "../../assets/icons/add-user.svg": () => import("./add-user-BN1JlY7e.js"), "../../assets/icons/arrow-down.svg": () => import("./arrow-down-D4qr4m33.js").then((n) => n.a), "../../assets/icons/book.svg": () => import("./book-nTEFXU2x.js"), "../../assets/icons/check-circle-fill.svg": () => import("./check-circle-fill-B_pd8ZSs.js"), "../../assets/icons/check-circle.svg": () => import("./check-circle-szyAJiap.js"), "../../assets/icons/close-circle-fill.svg": () => import("./close-circle-fill-jSqPPw9i.js"), "../../assets/icons/close-circle.svg": () => import("./close-circle-CwmuN2C6.js"), "../../assets/icons/close.svg": () => import("./close-CFnkhudp.js"), "../../assets/icons/eye-close.svg": () => import("./eye-close-BVr3NJtg.js"), "../../assets/icons/eye.svg": () => import("./eye-D_mEt17f.js"), "../../assets/icons/home.svg": () => import("./home-BUQ4USMk.js"), "../../assets/icons/info-circle-fill.svg": () => import("./info-circle-fill-CFeVMdci.js"), "../../assets/icons/info-circle.svg": () => import("./info-circle-COnL5bTJ.js"), "../../assets/icons/loading.svg": () => import("./loading-Dcc5RApI.js"), "../../assets/icons/lock.svg": () => import("./lock-Cr7BnmWN.js"), "../../assets/icons/message.svg": () => import("./message-D36_Zo2l.js"), "../../assets/icons/power-off.svg": () => import("./power-off-lQRbiBak.js"), "../../assets/icons/preview.svg": () => import("./preview-CJbz9GjO.js"), "../../assets/icons/setting.svg": () => import("./setting-DemlgzVC.js"), "../../assets/icons/sprite.svg": () => import("./sprite-CH2zLtZy.js"), "../../assets/icons/team.svg": () => import("./team-tl4NJXPC.js"), "../../assets/icons/unlock.svg": () => import("./unlock-CeU74z9n.js"), "../../assets/icons/user.svg": () => import("./user-B-eVXwuk.js"), "../../assets/icons/warning-circle-fill.svg": () => import("./warning-circle-fill-lODUKz0i.js"), "../../assets/icons/warning-circle.svg": () => import("./warning-circle-DDUgEDIv.js") }), `../../assets/icons/${this.name}.svg`, 5).then((result) => {
               if (result && result.default && result.default._identification) {
                 const { data } = result.default;
                 this._icon && this._div.removeChild(this._icon);
@@ -42,10 +33,8 @@ function Custom() {
                 }
               } else {
                 this.loadNs();
-                reject(
-                  `
- couldn't be loaded by r-icon, message: ${this.name} icon is undefined`
-                );
+                reject(`
+ couldn't be loaded by ra-icon, message: ${this.name} icon is undefined`);
               }
             }).catch((error) => {
               this.loadNs();
@@ -65,11 +54,7 @@ function Custom() {
           this._icon.setAttribute("width", "100");
           this._icon.setAttribute("height", "100");
           const use = document.createElementNS(X_LINKS_NS, "use");
-          use.setAttributeNS(
-            X_LINKS_NS,
-            X_LINK_HREF,
-            `../../assets/iconfont/icon.svg#icon-${this.name}`
-          );
+          use.setAttributeNS(X_LINKS_NS, X_LINK_HREF, `../../assets/iconfont/icon.svg#icon-${this.name}`);
           this._icon.appendChild(use);
           this._div.appendChild(this._icon);
         });
@@ -108,11 +93,7 @@ function Custom() {
         });
         this._div = document.createElement("div");
         this._div.setAttribute("class", "ran-icon");
-        const shadowRoot = this.attachShadow({ mode: "closed" });
-        const F7170EE498E0DD32CBDCB63FBA8F75CC = document.createElement("style");
-        F7170EE498E0DD32CBDCB63FBA8F75CC.textContent = f7170ee498e0dd32cbdcb63fba8f75cc;
-        shadowRoot.appendChild(F7170EE498E0DD32CBDCB63FBA8F75CC);
-        shadowRoot.appendChild(this._div);
+        this._div.setAttribute("part", "ran-icon");
       }
       static get observedAttributes() {
         return ["name", "size", "color", "spin"];
@@ -146,6 +127,7 @@ function Custom() {
           this.setAttribute("spin", value);
       }
       connectedCallback() {
+        this.appendChild(this._div);
         this.setIcon();
       }
       attributeChangedCallback(name, oldValue, newValue) {
@@ -161,7 +143,7 @@ function Custom() {
         }
       }
     }
-    customElements.define("r-icon", CustomElement);
+    customElements.define("ra-icon", RaIcon);
   }
 }
 const index = Custom();

package/dist/{index-1b73beee.js → index-DsIUhdNt.js}

@@ -4,12 +4,12 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { a as addClassToElement, r as removeClassToElement, i as isMobile, b as generateThrottle } from "./index-7913ec46.js";
-import { i as isDisabled, c as createCustomError } from "./index-57492b9b.js";
-import "./components/option/index.js";
-import "./index-7216d6b0.js";
-import "./index-1048a998.js";
-const f7170ee498e0dd32cbdcb63fba8f75cc = '.remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{position:relative;display:inline-block;cursor:pointer;height:32px;outline:0;-webkit-tap-highlight-color:transparent}:host,:host(:focus),:host(:active){outline:0;-webkit-tap-highlight-color:transparent}:host ::slotted(r-option){display:none}:host([disabled]){cursor:not-allowed;pointer-events:all;opacity:.6}:host([type="text"])::part(selection){border:none}:host([type="text"])::part(icon){display:none}:host(:not([disabled]):hover) .select{cursor:pointer}:host(:not([disabled]):hover) .selection{border:1px solid #1890ff}:host(:not([disabled]):hover) .selection-search{cursor:pointer}:host(:not([disabled]):hover) .selection-item{cursor:pointer;color:#bfbfbf}:host(:not([disabled]):focus) .selection{border:1px solid #1890ff}:host(:not([disabled]):focus) .selection-search{cursor:pointer}:host(:not([disabled]):focus) .selection-item{cursor:pointer;color:#bfbfbf}:host .selection-search{display:none}:host([showSearch]:not([disabled])) .selection-search{cursor:text;display:block}:host([showSearch]:not([disabled])) .selection-item{cursor:pointer}:host([showSearch]:not([disabled]):focus) .selection-search{display:block;cursor:text;opacity:1}.ran-select{width:100%;height:100%;box-sizing:border-box;margin:0;padding:0;color:#000000e0;font-size:14px;line-height:1.57142857;list-style:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";position:relative;display:inline-block}.ran-select .selection{position:relative;background-color:#fff;border:1px solid #d9d9d9;transition:all .2s cubic-bezier(.645,.045,.355,1);width:100%;height:100%;padding:0 11px;box-sizing:border-box;margin:0;color:#000000e0;font-size:14px;line-height:1.57142857;list-style:none;font-family:inherit;display:flex;border-radius:6px}.ran-select .selection-search{position:absolute;top:0;left:0;height:100%;inset-inline-start:11px;inset-inline-end:11px;opacity:0;margin:0;padding:0;background:transparent;border:none;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;cursor:not-allowed}.ran-select .selection-search::-webkit-search-cancel-button{display:none;-webkit-appearance:none}.ran-select .selection-search::part(ran-input){border:none;padding:0;height:100%;outline:none}.ran-select .selection-search::part(ran-input):active{border:none;padding:0;height:100%;outline:none;border-color:transparent;box-shadow:none;border-right-width:0px}.ran-select .selection-item{position:absolute;top:0;left:12px;margin:0;padding:0;background:transparent;border:none;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;height:100%;-webkit-user-select:none;user-select:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:pointer}.ran-select .selection-select{color:#00000040}.ran-select .selection .icon{display:flex;align-items:center;color:#00000040;font-style:normal;text-align:center;text-transform:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:absolute;top:50%;inset-inline-start:auto;inset-inline-end:8px;height:12px;margin-top:-3px;font-size:12px;pointer-events:none}\n';
+import { a as addClassToElement, r as removeClassToElement, i as isMobile, d as generateThrottle } from "./utils-74Icp-PI.js";
+import { H as HTMLElementSSR, i as isDisabled, c as createCustomError } from "./index-CSnBqUsQ.js";
+import "./option.js";
+import "./index-C6wPL-2Y.js";
+import "./index-Cbp6LrE5.js";
+const f7170ee498e0dd32cbdcb63fba8f75cc = '.remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}r-select{position:relative;width:120px;height:40px}:host{position:relative;display:inline-block;cursor:pointer;height:32px;outline:0;-webkit-tap-highlight-color:transparent}:host,:host(:focus),:host(:active){outline:0;-webkit-tap-highlight-color:transparent}:host ::slotted(r-option){display:none}:host([disabled]){cursor:not-allowed;pointer-events:all;opacity:.6}:host([type="text"])::part(selection){border:none}:host([type="text"])::part(icon){display:none}:host(:not([disabled]):hover) .select{cursor:pointer}:host(:not([disabled]):hover) .selection{border:1px solid #1890ff}:host(:not([disabled]):hover) .selection-search{cursor:pointer}:host(:not([disabled]):hover) .selection-item{cursor:pointer;color:#bfbfbf}:host(:not([disabled]):focus) .selection{border:1px solid #1890ff}:host(:not([disabled]):focus) .selection-search{cursor:pointer}:host(:not([disabled]):focus) .selection-item{cursor:pointer;color:#bfbfbf}:host .selection-search{display:none}:host([showSearch]:not([disabled])) .selection-search{cursor:text;display:block}:host([showSearch]:not([disabled])) .selection-item{cursor:pointer}:host([showSearch]:not([disabled]):focus) .selection-search{display:block;cursor:text;opacity:1}.ran-select{width:100%;height:100%;box-sizing:border-box;margin:0;padding:0;color:#000000e0;font-size:14px;line-height:1.57142857;list-style:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";position:relative;display:inline-block}.ran-select .selection{position:relative;background-color:#fff;border:1px solid #d9d9d9;transition:all .2s cubic-bezier(.645,.045,.355,1);width:100%;height:100%;padding:0 11px;box-sizing:border-box;margin:0;color:#000000e0;font-size:14px;line-height:1.57142857;list-style:none;font-family:inherit;display:flex;border-radius:6px}.ran-select .selection-search{position:absolute;top:0;left:0;height:100%;inset-inline-start:11px;inset-inline-end:11px;opacity:0;margin:0;padding:0;background:transparent;border:none;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;cursor:not-allowed}.ran-select .selection-search::-webkit-search-cancel-button{display:none;-webkit-appearance:none}.ran-select .selection-search::part(ran-input){border:none;padding:0;height:100%;outline:none}.ran-select .selection-search::part(ran-input):active{border:none;padding:0;height:100%;outline:none;border-color:transparent;box-shadow:none;border-right-width:0px}.ran-select .selection-item{position:absolute;top:0;left:12px;margin:0;padding:0;background:transparent;border:none;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;height:100%;-webkit-user-select:none;user-select:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:pointer}.ran-select .selection-select{color:#00000040}.ran-select .selection .icon{display:flex;align-items:center;color:#00000040;font-style:normal;text-align:center;text-transform:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:absolute;top:50%;inset-inline-start:auto;inset-inline-end:8px;height:12px;margin-top:-3px;font-size:12px;pointer-events:none}';
 const placementDirection = {
   bottom: {
     add: "ran-select-dropdown-down-in",
@@ -21,7 +21,7 @@ const placementDirection = {
   }
 };
 const searchThrottle = generateThrottle();
-class Select extends HTMLElement {
+class Select extends HTMLElementSSR() {
   constructor() {
     super();
     __publicField(this, "removeTimeId");
@@ -50,17 +50,11 @@ class Select extends HTMLElement {
       if (this._selectDropDownOutTimeId)
         return;
       if (this._selectionDropdown && this._selectionDropdown.style.display !== "none") {
-        addClassToElement(
-          this._selectionDropdown,
-          placementDirection[this.placement].remove
-        );
+        addClassToElement(this._selectionDropdown, placementDirection[this.placement].remove);
         this._selectDropDownOutTimeId = setTimeout(() => {
           var _a;
           (_a = this._selectionDropdown) == null ? void 0 : _a.style.setProperty("display", "none");
-          this._selectionDropdown && removeClassToElement(
-            this._selectionDropdown,
-            placementDirection[this.placement].remove
-          );
+          this._selectionDropdown && removeClassToElement(this._selectionDropdown, placementDirection[this.placement].remove);
           clearTimeout(this._selectDropDownOutTimeId);
           this._selectDropDownOutTimeId = void 0;
         }, 300);
@@ -75,16 +69,10 @@ class Select extends HTMLElement {
       if (this._selectDropDownInTimeId)
         return;
       if (this._selectionDropdown && this._selectionDropdown.style.display !== "block") {
-        addClassToElement(
-          this._selectionDropdown,
-          placementDirection[this.placement].add
-        );
+        addClassToElement(this._selectionDropdown, placementDirection[this.placement].add);
         (_a = this._selectionDropdown) == null ? void 0 : _a.style.setProperty("display", "block");
         this._selectDropDownInTimeId = setTimeout(() => {
-          this._selectionDropdown && removeClassToElement(
-            this._selectionDropdown,
-            placementDirection[this.placement].add
-          );
+          this._selectionDropdown && removeClassToElement(this._selectionDropdown, placementDirection[this.placement].add);
           clearTimeout(this._selectDropDownInTimeId);
           this._selectDropDownInTimeId = void 0;
         }, 200);
@@ -95,35 +83,31 @@ class Select extends HTMLElement {
         return;
       const rect = this.getBoundingClientRect();
       const { top, left, bottom, width, height, x, y, right } = rect;
-      this._selectionDropdown.style.setProperty(
-        "-ran-x",
-        `${x + window.scrollX}`
-      );
-      this._selectionDropdown.style.setProperty(
-        "-ran-y",
-        `${y + window.scrollY}`
-      );
+      const root = document.getElementById(this.getPopupContainerId);
+      this._selectionDropdown.style.setProperty("--ran-x", `${top + window.scrollX}`);
+      this._selectionDropdown.style.setProperty("--ran-y", `${left + window.scrollY}`);
       let selectTop = bottom + window.scrollY;
       let selectLeft = left + window.scrollX;
       this._selectionDropdown.style.setProperty("width", `${width}px`);
-      const root = document.getElementById(this.getPopupContainerId);
       if (this.placement === "top") {
         selectTop = top + window.scrollY - this._selectionDropdown.clientHeight;
-        if (this.getPopupContainerId && root) {
+      }
+      if (this.getPopupContainerId && root) {
+        if (this.placement === "top") {
           selectTop = top - root.getBoundingClientRect().top - this._selectionDropdown.clientHeight;
-          selectLeft = left - root.getBoundingClientRect().left;
+        } else {
+          selectTop = root.getBoundingClientRect().height;
         }
+        selectLeft = 0;
       }
-      this._selectionDropdown.style.setProperty(
-        "inset",
-        `${selectTop}px auto auto ${selectLeft}px`
-      );
+      this._selectionDropdown.style.setProperty("inset", `${selectTop}px auto auto ${selectLeft}px`);
     });
     /**
      * @description: 设置下拉框
      * @return {*}
      */
-    __publicField(this, "selectMouseDown", () => {
+    __publicField(this, "selectMouseDown", (e) => {
+      e.stopPropagation();
       if (isDisabled(this))
         return;
       this.removeDropDownTimeId();
@@ -133,7 +117,7 @@ class Select extends HTMLElement {
     });
     __publicField(this, "removeDropDownTimeId", () => {
       this._search.setAttribute("value", "");
-      if (this.action.includes("hover") && !isMobile()) {
+      if (this.trigger.includes("hover") && !isMobile()) {
         clearTimeout(this.removeTimeId);
         this.removeTimeId = void 0;
       }
@@ -149,7 +133,7 @@ class Select extends HTMLElement {
       this.removeTimeId = setTimeout(() => {
         this.removeDropDownTimeId();
         this.setSelectDropdownDisplayNone();
-      }, 300);
+      }, 100);
     });
     /**
      * @description: 选中一个选项的情况
@@ -158,6 +142,7 @@ class Select extends HTMLElement {
      */
     __publicField(this, "clickOption", (e) => {
       var _a, _b;
+      e.stopPropagation();
       let element = e.target;
       if ((_a = element.classList) == null ? void 0 : _a.contains("ranui-select-dropdown-option-item")) {
         element = element.children[0];
@@ -176,18 +161,12 @@ class Select extends HTMLElement {
       const { height } = rect;
       this._text.style.setProperty("line-height", `${height}px`);
       if (this._activeOption) {
-        removeClassToElement(
-          this._activeOption,
-          "ranui-select-dropdown-option-active"
-        );
+        removeClassToElement(this._activeOption, "ranui-select-dropdown-option-active");
       }
       setTimeout(() => {
         this._activeOption = (element == null ? void 0 : element.parentElement) || void 0;
         if (this._activeOption) {
-          addClassToElement(
-            this._activeOption,
-            "ranui-select-dropdown-option-active"
-          );
+          addClassToElement(this._activeOption, "ranui-select-dropdown-option-active");
         }
       }, 200);
       this.setSelectDropdownDisplayNone();
@@ -202,32 +181,20 @@ class Select extends HTMLElement {
       if (!this._selectDropdown) {
         const container = document.getElementById(this.getPopupContainerId) || document.body;
         this._selectDropdown = document.createElement("div");
-        this._selectDropdown.style.setProperty(
-          "-webkit-tap-highlight-color",
-          "transparent"
-        );
+        this._selectDropdown.style.setProperty("-webkit-tap-highlight-color", "transparent");
         this._selectDropdown.style.setProperty("outline", "0");
         this._selectDropdown.addEventListener("click", this.clickOption);
         this._selectionDropdown = document.createElement("div");
-        this._selectionDropdown.style.setProperty(
-          "-webkit-tap-highlight-color",
-          "transparent"
-        );
+        this._selectionDropdown.style.setProperty("-webkit-tap-highlight-color", "transparent");
         this._selectionDropdown.style.setProperty("outline", "0");
         if (this.dropdownclass) {
-          this._selectionDropdown.setAttribute(
-            "class",
-            `${this.dropdownclass} ranui-select-dropdown`
-          );
+          this._selectionDropdown.setAttribute("class", `${this.dropdownclass} ranui-select-dropdown`);
         } else {
           this._selectionDropdown.setAttribute("class", "ranui-select-dropdown");
         }
-        if (this.action.includes("hover") && !isMobile()) {
+        if (this.trigger.includes("hover") && !isMobile()) {
           this._selectDropdown.addEventListener("mouseleave", this.selectBlur);
-          this._selectDropdown.addEventListener(
-            "mouseenter",
-            this.removeDropDownTimeId
-          );
+          this._selectDropdown.addEventListener("mouseenter", this.removeDropDownTimeId);
         }
         this._selectDropdown.appendChild(this._selectionDropdown);
         this._selectionDropdown.style.setProperty("display", "none");
@@ -290,16 +257,10 @@ class Select extends HTMLElement {
             );
             this._activeOption = selectOptionItem;
           } else {
-            selectOptionItem.setAttribute(
-              "class",
-              "ranui-select-dropdown-option-item"
-            );
+            selectOptionItem.setAttribute("class", "ranui-select-dropdown-option-item");
           }
           const selectOptionItemContent = document.createElement("div");
-          selectOptionItemContent.setAttribute(
-            "class",
-            "ranui-select-dropdown-option-item-content"
-          );
+          selectOptionItemContent.setAttribute("class", "ranui-select-dropdown-option-item-content");
           selectOptionItemContent.innerHTML = `${label}`;
           selectOptionItemContent.setAttribute("value", `${value}`);
           selectOptionItemContent.setAttribute("title", `${label}`);
@@ -348,12 +309,12 @@ class Select extends HTMLElement {
     });
     __publicField(this, "setShowSearch", () => {
       this.onSearch = searchThrottle(this.changeSearch);
-      this._search.addEventListener("change", this.onSearch);
-      this._search.addEventListener("click", this.onSearch);
+      this.onSearch && this._search.addEventListener("change", this.onSearch);
+      this.onSearch && this._search.addEventListener("click", this.onSearch);
     });
     __publicField(this, "removeShowSearch", () => {
-      this._search.removeEventListener("change", this.onSearch);
-      this._search.removeEventListener("click", this.onSearch);
+      this.onSearch && this._search.removeEventListener("change", this.onSearch);
+      this.onSearch && this._search.removeEventListener("click", this.onSearch);
     });
     __publicField(this, "listenSlotChange", () => {
       this._slot.addEventListener("slotchange", this.addOptionToSlot);
@@ -366,15 +327,19 @@ class Select extends HTMLElement {
       this.removeEventListener("mouseleave", this.selectBlur);
       this.removeEventListener("click", this.selectMouseDown);
       this.removeEventListener("blur", this.selectBlur);
-      if (this.action.includes("hover") && !isMobile()) {
+      if (this.trigger.includes("hover") && !isMobile()) {
         this.addEventListener("mouseenter", this.selectMouseDown);
         this.addEventListener("mouseleave", this.selectBlur);
       }
-      if (this.action.includes("click")) {
+      if (this.trigger.includes("click")) {
         this.addEventListener("click", this.selectMouseDown);
         this.addEventListener("blur", this.selectBlur);
       }
     });
+    __publicField(this, "clickRemoveSelect", (e) => {
+      e.stopPropagation();
+      this.setSelectDropdownDisplayNone();
+    });
     this._slot = document.createElement("slot");
     this._select = document.createElement("div");
     this._select.setAttribute("class", "ran-select");
@@ -391,7 +356,7 @@ class Select extends HTMLElement {
     this._text = document.createElement("span");
     this._text.setAttribute("class", "selection-item");
     this._text.setAttribute("part", "selection-item");
-    this._icon = document.createElement("r-icon");
+    this._icon = document.createElement("ra-icon");
     this._icon.setAttribute("class", "icon");
     this._icon.setAttribute("part", "icon");
     this._icon.setAttribute("name", "arrow-down");
@@ -412,7 +377,7 @@ class Select extends HTMLElement {
     F7170EE498E0DD32CBDCB63FBA8F75CC.textContent = f7170ee498e0dd32cbdcb63fba8f75cc;
     shadowRoot.appendChild(F7170EE498E0DD32CBDCB63FBA8F75CC);
     this._shadowDom = shadowRoot;
-    shadowRoot.appendChild(this._select);
+    this._shadowDom.appendChild(this._select);
   }
   static get observedAttributes() {
     return [
@@ -428,7 +393,7 @@ class Select extends HTMLElement {
       // 挂载的节点
       "dropdownclass",
       // 弹窗的类名
-      "action"
+      "trigger"
       // 触发下拉框的行为， click 还是 hover ，hover 在 isMobile 移动端无效
     ];
   }
@@ -484,11 +449,11 @@ class Select extends HTMLElement {
   set dropdownclass(value) {
     this.setAttribute("dropdownclass", value || "");
   }
-  get action() {
-    return this.getAttribute("action") || "click";
+  get trigger() {
+    return this.getAttribute("trigger") || "click";
   }
-  set action(value) {
-    this.setAttribute("action", value || "");
+  set trigger(value) {
+    this.setAttribute("trigger", value || "");
   }
   get disabled() {
     return isDisabled(this);
@@ -509,9 +474,7 @@ class Select extends HTMLElement {
         sheet.insertRule(this.sheet);
         this._shadowDom.adoptedStyleSheets = [sheet];
       } catch (error) {
-        console.error(
-          `Failed to parse the rule in CSSStyleSheet: ${this.sheet}`
-        );
+        console.error(`Failed to parse the rule in CSSStyleSheet: ${this.sheet}`);
       }
     }
   }
@@ -521,6 +484,7 @@ class Select extends HTMLElement {
     this.listenActionEvent();
     this.listenSlotChange();
     this.setShowSearch();
+    document.addEventListener("click", this.clickRemoveSelect);
   }
   disconnectCallback() {
     var _a;
@@ -531,6 +495,7 @@ class Select extends HTMLElement {
     this.removeSelectDropdown();
     (_a = this._selectDropdown) == null ? void 0 : _a.removeEventListener("click", this.clickOption);
     this.removeListenSlotChange();
+    document.removeEventListener("click", this.clickRemoveSelect);
   }
   attributeChangedCallback(name, oldValue, newValue) {
     if (name === "disabled" && this._select) {

package/dist/{index-01b17e26.js → index-Du-Biu-I.js}

@@ -4,7 +4,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-const f7170ee498e0dd32cbdcb63fba8f75cc = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}\n";
+const f7170ee498e0dd32cbdcb63fba8f75cc = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}";
 const failImage = `
     data:image/png;base64,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
 `;

package/dist/{index-0d5b9435.js → index-DytfjwBV.js}

@@ -4,8 +4,8 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-const f7170ee498e0dd32cbdcb63fba8f75cc = '.remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host([type="toast"]){--ranui-message-background: rgba(0, 0, 0, .7);--ranui-message-color: #fff;--ranui-message-border-radius: 7px}.ran-message-notice{padding:8px;text-align:center;max-width:90%;margin:0 auto;word-break:break-all}.ran-message-notice-content{display:inline-block;padding:10px 16px;background:var(--ranui-message-background, #fff);border-radius:var(--ranui-message-border-radius, 8px);box-shadow:0 3px 6px -4px #0000001f,0 6px 16px #00000014,0 9px 28px 8px #0000000d;pointer-events:all}.ran-message-notice-content-info{align-items:center;display:flex}.ran-message-notice-content-info span{margin:0;padding:0;color:var(--ranui-message-color, #000000d9);font-size:14px;font-variant:tabular-nums;list-style:none;font-feature-settings:"tnum";z-index:1010;width:100%;pointer-events:none}@keyframes MessageMoveIn{0%{padding:0;transform:translateY(-100%);opacity:0}to{padding:8px;transform:translateY(0);opacity:1}}@keyframes MessageMoveOut{0%{max-height:150px;padding:8px;opacity:1}to{max-height:0;padding:0;opacity:0}}.ranui-message{box-sizing:border-box;margin:0;padding:0;color:#000000d9;font-size:14px;font-variant:tabular-nums;line-height:1.5715;list-style:none;font-feature-settings:"tnum";position:fixed;top:8px;left:0;z-index:1010;width:100%;pointer-events:none}.ranui-message .message-in{animation-name:MessageMoveIn;animation-duration:.3s;animation-timing-function:cubic-bezier(.78,.14,.15,.86)}.ranui-message .message-leave{animation-name:MessageMoveOut;animation-duration:.3s;animation-timing-function:cubic-bezier(.78,.14,.15,.86)}\n';
-const index$1 = "";
+import "./index-C6wPL-2Y.js";
+const f7170ee498e0dd32cbdcb63fba8f75cc = '.remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host([type="toast"]){--ranui-message-background: rgba(0, 0, 0, .7);--ranui-message-color: #fff;--ranui-message-border-radius: 7px}.ran-message-notice{padding:8px;text-align:center;max-width:90%;margin:0 auto;word-break:break-all}.ran-message-notice-content{display:inline-block;padding:10px 16px;background:var(--ranui-message-background, #fff);border-radius:var(--ranui-message-border-radius, 8px);box-shadow:0 3px 6px -4px #0000001f,0 6px 16px #00000014,0 9px 28px 8px #0000000d;pointer-events:all}.ran-message-notice-content-info{align-items:center;display:flex}.ran-message-notice-content-info span{margin:0;padding:0;color:var(--ranui-message-color, #000000d9);font-size:14px;font-variant:tabular-nums;list-style:none;font-feature-settings:"tnum";z-index:1010;width:100%;pointer-events:none}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes MessageMoveIn{0%{padding:0;transform:translateY(-100%);opacity:0}to{padding:8px;transform:translateY(0);opacity:1}}@keyframes MessageMoveOut{0%{max-height:150px;padding:8px;opacity:1}to{max-height:0;padding:0;opacity:0}}.ranui-message{box-sizing:border-box;margin:0;padding:0;color:#000000d9;font-size:14px;font-variant:tabular-nums;line-height:1.5715;list-style:none;font-feature-settings:"tnum";position:fixed;top:8px;left:0;z-index:1010;width:100%;pointer-events:none}.ranui-message .message-in{animation-name:MessageMoveIn;animation-duration:.3s;animation-timing-function:cubic-bezier(.78,.14,.15,.86)}.ranui-message .message-leave{animation-name:MessageMoveOut;animation-duration:.3s;animation-timing-function:cubic-bezier(.78,.14,.15,.86)}';
 const AnimationTime = 300;
 const defaultDuration = 3e3;
 const typeMapIcon = /* @__PURE__ */ new Map([