@mantou/gem 1.7.0 → 1.7.2

package/dist/gem.es.js

@@ -1,22 +1,3 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key2, value) => key2 in obj ? __defProp(obj, key2, { enumerable: true, configurable: true, writable: true, value }) : obj[key2] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __accessCheck = (obj, member, msg) => {
   if (!member.has(obj))
     throw TypeError("Cannot " + msg);
@@ -39,36 +20,26 @@ var __privateMethod = (obj, member, method) => {
   __accessCheck(obj, member, "access private method");
   return method;
 };
-var _map, _firstItem, _lastItem, _delete, delete_fn, _stringify, _parse, _nextSibling, _parentElement, _inertStore, _a, _cacheCurrentKey, cacheCurrentKey_get, _urlParamsLang, urlParamsLang_get, _cacheLang, cacheLang_get, _isMain, isMain_get, _lang, lang_set;
-var Gem = /* @__PURE__ */ Object.freeze({
+var _map, _firstItem, _lastItem, _delete, delete_fn, _stringify, _parse, _routeOptions, routeOptions_get, _hint, hint_get, _onClick, _preventDefault, _getHint, _a, _getContent, _nextSibling, _parentElement, _inertStore, _b, _cacheCurrentKey, cacheCurrentKey_get, _urlParamsLang, urlParamsLang_get, _cacheLang, cacheLang_get, _isMain, isMain_get, _lang, lang_set;
+var GemExports = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  [Symbol.toStringTag]: "Module",
-  get StoreListenerMap() {
-    return StoreListenerMap;
-  },
-  get createStore() {
-    return createStore;
-  },
-  get createStoreSet() {
-    return createStoreSet;
-  },
-  get updateStore() {
-    return updateStore;
+  get GemElement() {
+    return GemElement;
   },
-  get connect() {
-    return connect;
+  get defineAttribute() {
+    return defineAttribute;
   },
-  get disconnect() {
-    return disconnect;
+  get defineProperty() {
+    return defineProperty;
   },
-  get history() {
-    return history;
+  get defineRef() {
+    return defineRef;
   },
-  get titleStore() {
-    return titleStore;
+  get defineCSSState() {
+    return defineCSSState;
   },
-  get basePathStore() {
-    return basePathStore;
+  get nativeDefineElement() {
+    return nativeDefineElement;
   },
   get html() {
     return html;
@@ -96,143 +67,8 @@ var Gem = /* @__PURE__ */ Object.freeze({
   },
   get ifDefined() {
     return ifDefined;
-  },
-  get GemElement() {
-    return GemElement;
-  },
-  get defineAttribute() {
-    return defineAttribute;
-  },
-  get defineProperty() {
-    return defineProperty;
-  },
-  get defineRef() {
-    return defineRef;
-  },
-  get defineCSSState() {
-    return defineCSSState;
-  },
-  get nativeDefineElement() {
-    return nativeDefineElement;
-  },
-  get refobject() {
-    return refobject;
-  },
-  get attribute() {
-    return attribute;
-  },
-  get boolattribute() {
-    return boolattribute;
-  },
-  get numattribute() {
-    return numattribute;
-  },
-  get property() {
-    return property;
-  },
-  get state() {
-    return state;
-  },
-  get slot() {
-    return slot;
-  },
-  get part() {
-    return part;
-  },
-  get emitter() {
-    return emitter;
-  },
-  get globalemitter() {
-    return globalemitter;
-  },
-  get adoptedStyle() {
-    return adoptedStyle;
-  },
-  get connectStore() {
-    return connectStore;
-  },
-  get rootElement() {
-    return rootElement;
-  },
-  get customElement() {
-    return customElement;
-  },
-  get addMicrotask() {
-    return addMicrotask;
-  },
-  get addMicrotaskToStack() {
-    return addMicrotaskToStack;
-  },
-  get absoluteLocation() {
-    return absoluteLocation;
-  },
-  get LinkedList() {
-    return LinkedList;
-  },
-  get PropProxyMap() {
-    return PropProxyMap;
-  },
-  get QueryString() {
-    return QueryString;
-  },
-  get raw() {
-    return raw;
-  },
-  get css() {
-    return css;
-  },
-  get SheetToken() {
-    return SheetToken;
-  },
-  get useNativeCSSStyleSheet() {
-    return useNativeCSSStyleSheet;
-  },
-  get createCSSSheet() {
-    return createCSSSheet;
-  },
-  get randomStr() {
-    return randomStr;
-  },
-  get styled() {
-    return styled;
-  },
-  get camelToKebabCase() {
-    return camelToKebabCase;
-  },
-  get kebabToCamelCase() {
-    return kebabToCamelCase;
-  },
-  get cleanObject() {
-    return cleanObject;
-  },
-  get GemError() {
-    return GemError;
-  },
-  get isArrayChange() {
-    return isArrayChange;
-  },
-  get removeItems() {
-    return removeItems;
-  },
-  get objectMapToString() {
-    return objectMapToString;
-  },
-  get styleMap() {
-    return styleMap;
-  },
-  get classMap() {
-    return classMap;
-  },
-  get partMap() {
-    return partMap;
-  },
-  get exportPartsMap() {
-    return exportPartsMap;
-  },
-  get version() {
-    return version;
   }
-});
+}, Symbol.toStringTag, { value: "Module" }));
 /**
  * @license
  * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
@@ -246,7 +82,7 @@ var Gem = /* @__PURE__ */ Object.freeze({
  * subject to an additional IP rights grant found at
  * http://polymer.github.io/PATENTS.txt
  */
-const directives = new WeakMap();
+const directives = /* @__PURE__ */ new WeakMap();
 const directive = (f) => (...args) => {
   const d = f(...args);
   directives.set(d, true);
@@ -370,9 +206,9 @@ class Template {
             if (s === "") {
               insert = createMarker();
             } else {
-              const match = lastAttributeNameRegex.exec(s);
-              if (match !== null && endsWith(match[2], boundAttributeSuffix)) {
-                s = s.slice(0, match.index) + match[1] + match[2].slice(0, -boundAttributeSuffix.length) + match[3];
+              const match2 = lastAttributeNameRegex.exec(s);
+              if (match2 !== null && endsWith(match2[2], boundAttributeSuffix)) {
+                s = s.slice(0, match2.index) + match2[1] + match2[2].slice(0, -boundAttributeSuffix.length) + match2[3];
               }
               insert = document.createTextNode(s);
             }
@@ -949,8 +785,8 @@ function templateFactory(result) {
   let templateCache = templateCaches.get(result.type);
   if (templateCache === void 0) {
     templateCache = {
-      stringsArray: new WeakMap(),
-      keyString: new Map()
+      stringsArray: /* @__PURE__ */ new WeakMap(),
+      keyString: /* @__PURE__ */ new Map()
     };
     templateCaches.set(result.type, templateCache);
   }
@@ -967,7 +803,7 @@ function templateFactory(result) {
   templateCache.stringsArray.set(result.strings, template);
   return template;
 }
-const templateCaches = new Map();
+const templateCaches = /* @__PURE__ */ new Map();
 /**
  * @license
  * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
@@ -981,7 +817,7 @@ const templateCaches = new Map();
  * subject to an additional IP rights grant found at
  * http://polymer.github.io/PATENTS.txt
  */
-const parts = new WeakMap();
+const parts = /* @__PURE__ */ new WeakMap();
 const render = (result, container, options) => {
   let part2 = parts.get(container);
   if (part2 === void 0) {
@@ -1010,7 +846,7 @@ if (typeof window !== "undefined") {
 }
 const html = (strings, ...values) => new TemplateResult(strings, values, "html", defaultTemplateProcessor);
 const svg = (strings, ...values) => new SVGTemplateResult(strings, values, "svg", defaultTemplateProcessor);
-const microtaskSet = new Set();
+const microtaskSet = /* @__PURE__ */ new Set();
 function addMicrotask(func) {
   if (typeof func !== "function")
     return;
@@ -1040,14 +876,14 @@ function absoluteLocation(currentPath = "", relativePath = "") {
   const { pathname, search, hash } = new URL(relativePath, location.origin + currentPath);
   return pathname + search + hash;
 }
-class LinkedList extends (globalThis.EventTarget || Object) {
+class LinkedList extends EventTarget {
   constructor() {
     super(...arguments);
     __privateAdd(this, _delete);
     __privateAdd(this, _map, void 0);
     __privateAdd(this, _firstItem, void 0);
     __privateAdd(this, _lastItem, void 0);
-    __privateSet(this, _map, new Map());
+    __privateSet(this, _map, /* @__PURE__ */ new Map());
   }
   get size() {
     return __privateGet(this, _map).size;
@@ -1174,20 +1010,6 @@ function css(arr, ...args) {
   return raw(arr, ...args);
 }
 const SheetToken = Symbol.for("gem@sheetToken");
-let useNativeCSSStyleSheet = true;
-let CSSStyleSheet = window.CSSStyleSheet;
-try {
-  new CSSStyleSheet();
-} catch {
-  useNativeCSSStyleSheet = false;
-  CSSStyleSheet = class {
-    constructor() {
-      this.media = { mediaText: "" };
-      this.style = "";
-      this.replaceSync = (style) => this.style = style;
-    }
-  };
-}
 function createCSSSheet(rules, mediaQuery2 = "") {
   const styleSheet = new CSSStyleSheet();
   const sheet = {};
@@ -1286,21 +1108,29 @@ function objectMapToString(object, separate, toString) {
   return result;
 }
 function styleMap(object) {
-  return objectMapToString(object, ";", (key2, value) => value !== void 0 ? `${camelToKebabCase(key2)}:${value}` : "");
+  return objectMapToString(
+    object,
+    ";",
+    (key2, value) => value !== void 0 ? `${camelToKebabCase(key2)}:${value}` : ""
+  );
 }
 function classMap(object) {
   return objectMapToString(object, " ", (key2, value) => value ? key2 : "");
 }
 const partMap = classMap;
 function exportPartsMap(object) {
-  return objectMapToString(object, ",", (key2, value) => value !== void 0 ? `${key2}:${value}` : "");
+  return objectMapToString(
+    object,
+    ",",
+    (key2, value) => value === true || key2 === value ? key2 : value ? `${key2}:${value}` : ""
+  );
 }
-const StoreListenerMap = new WeakMap();
+const StoreListenerMap = /* @__PURE__ */ new WeakMap();
 function createStore(originStore) {
   if (StoreListenerMap.has(originStore)) {
     throw new GemError("argument error");
   }
-  StoreListenerMap.set(originStore, new Set());
+  StoreListenerMap.set(originStore, /* @__PURE__ */ new Set());
   return originStore;
 }
 function createStoreSet(originStoreSet) {
@@ -1325,6 +1155,11 @@ function disconnect(store2, func) {
   const listeners = StoreListenerMap.get(store2);
   listeners == null ? void 0 : listeners.delete(func);
 }
+const version = "1.7.2";
+var VersionExports = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  version
+}, Symbol.toStringTag, { value: "Module" }));
 /**
  * @license
  * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
@@ -1364,14 +1199,14 @@ const removePart = (part2) => {
   removeNodes(part2.startNode.parentNode, part2.startNode, part2.endNode.nextSibling);
 };
 const generateMap = (list, start, end) => {
-  const map = new Map();
+  const map = /* @__PURE__ */ new Map();
   for (let i = start; i <= end; i++) {
     map.set(list[i], i);
   }
   return map;
 };
-const partListCache = new WeakMap();
-const keyListCache = new WeakMap();
+const partListCache = /* @__PURE__ */ new WeakMap();
+const keyListCache = /* @__PURE__ */ new WeakMap();
 const repeat = directive((items, keyFnOrTemplate, template) => {
   let keyFn;
   if (template === void 0) {
@@ -1478,7 +1313,7 @@ const repeat = directive((items, keyFnOrTemplate, template) => {
  * subject to an additional IP rights grant found at
  * http://polymer.github.io/PATENTS.txt
  */
-const previousValues$1 = new WeakMap();
+const previousValues$1 = /* @__PURE__ */ new WeakMap();
 const guard = directive((value, f) => (part2) => {
   const previousValue = previousValues$1.get(part2);
   if (Array.isArray(value)) {
@@ -1504,7 +1339,7 @@ const guard = directive((value, f) => (part2) => {
  * subject to an additional IP rights grant found at
  * http://polymer.github.io/PATENTS.txt
  */
-const previousValues = new WeakMap();
+const previousValues = /* @__PURE__ */ new WeakMap();
 const ifDefined = directive((value) => (part2) => {
   const previousValue = previousValues.get(part2);
   if (value === void 0 && part2 instanceof AttributePart) {
@@ -1535,7 +1370,7 @@ var __privateSet$1 = (obj, member, value, setter) => {
   setter ? setter.call(obj, value) : member.set(obj, value);
   return value;
 };
-var _renderRoot, _internals, _isAppendReason, _isMounted, _isAsync, _effectList, _memoList, _unmountCallback, _exec, _execEffect, _execMemo, _initEffect, _render, _shouldUpdate, _updateCallback, _update, _updated, _connectedCallback;
+var _final, _renderRoot, _internals, _isAppendReason, _isMounted, _isAsync, _effectList, _memoList, _unmountCallback, _exec, _execEffect, _execMemo, _initEffect, _render, _shouldUpdate, _updateCallback, _update, _updated, _connectedCallback;
 function emptyFunction() {
 }
 function execCallback(fun) {
@@ -1555,8 +1390,8 @@ asyncRenderTaskList.addEventListener("start", () => addMicrotask(tick));
 const constructorSymbol = Symbol("constructor");
 const initSymbol = Symbol("init");
 const updateSymbol = Symbol("update");
-class GemElement extends HTMLElement {
-  constructor({ isAsync, isLight, delegatesFocus } = {}) {
+const _GemElement = class extends HTMLElement {
+  constructor({ isAsync, isLight, delegatesFocus, slotAssignment } = {}) {
     super();
     __privateAdd$1(this, _renderRoot, void 0);
     __privateAdd$1(this, _internals, void 0);
@@ -1627,18 +1462,10 @@ class GemElement extends HTMLElement {
       });
     });
     __privateAdd$1(this, _render, () => {
-      var _a2, _b;
       __privateGet$1(this, _execMemo).call(this);
-      const styles = useNativeCSSStyleSheet ? "" : html`${(_b = (_a2 = this.shadowRoot) == null ? void 0 : _a2.adoptedStyleSheets) == null ? void 0 : _b.map((e) => html`
-              <style media=${e.media.mediaText}>
-                ${e.style}
-              </style>
-            `)}`;
-      if (this.render) {
-        const r = this.render();
-        return r && html`${r}${styles}`;
-      }
-      return __privateGet$1(this, _renderRoot) === this ? void 0 : html`<slot></slot>${styles}`;
+      if (this.render)
+        return this.render();
+      return __privateGet$1(this, _renderRoot) === this ? void 0 : html`<slot></slot>`;
     });
     __privateAdd$1(this, _shouldUpdate, () => {
       return this.shouldUpdate ? this.shouldUpdate() : true;
@@ -1666,12 +1493,12 @@ class GemElement extends HTMLElement {
       (_a2 = this.updated) == null ? void 0 : _a2.call(this);
     });
     __privateAdd$1(this, _connectedCallback, () => {
-      var _a2, _b, _c;
-      this[constructorSymbol] = false;
+      var _a2, _b2, _c;
       if (__privateGet$1(this, _isAppendReason)) {
         __privateSet$1(this, _isAppendReason, false);
         return;
       }
+      Reflect.set(this, constructorSymbol, false);
       (_a2 = this.willMount) == null ? void 0 : _a2.call(this);
       const { observedStores, rootElement: rootElement2 } = this.constructor;
       observedStores == null ? void 0 : observedStores.forEach((store2) => {
@@ -1680,76 +1507,54 @@ class GemElement extends HTMLElement {
       const temp = __privateGet$1(this, _render).call(this);
       temp !== void 0 && render(temp, __privateGet$1(this, _renderRoot));
       __privateSet$1(this, _isMounted, true);
-      __privateSet$1(this, _unmountCallback, (_b = this.mounted) == null ? void 0 : _b.call(this));
+      __privateSet$1(this, _unmountCallback, (_b2 = this.mounted) == null ? void 0 : _b2.call(this));
       __privateGet$1(this, _initEffect).call(this);
       if (rootElement2 && ((_c = this.getRootNode().host) == null ? void 0 : _c.tagName) !== rootElement2.toUpperCase()) {
         throw new GemError(`not allow current root type`);
       }
     });
-    this[constructorSymbol] = true;
-    addMicrotask(() => this[initSymbol] = false);
-    this[initSymbol] = true;
-    this[updateSymbol] = () => {
+    addMicrotask(() => Reflect.set(this, initSymbol, false));
+    Reflect.set(this, constructorSymbol, true);
+    Reflect.set(this, initSymbol, true);
+    Reflect.set(this, updateSymbol, () => {
       if (__privateGet$1(this, _isMounted)) {
         addMicrotask(__privateGet$1(this, _update));
       }
-    };
+    });
     __privateSet$1(this, _isAsync, isAsync);
-    __privateSet$1(this, _renderRoot, isLight ? this : this.attachShadow({ mode: "open", delegatesFocus }));
+    __privateSet$1(this, _renderRoot, isLight ? this : this.attachShadow({ mode: "open", delegatesFocus, slotAssignment }));
     const { adoptedStyleSheets } = new.target;
     if (adoptedStyleSheets) {
       const sheets = adoptedStyleSheets.map((item) => item[SheetToken] || item);
       if (this.shadowRoot) {
         this.shadowRoot.adoptedStyleSheets = sheets;
       } else {
-        this.effect(() => {
-          const root = this.getRootNode();
-          if (!useNativeCSSStyleSheet) {
-            const ele = root === document ? document.body : root;
-            ele._sheets = ele._sheets || {};
-            sheets.forEach(({ style, media }) => {
-              if (ele._sheets[style]) {
-                ele._sheets[style].count++;
-              } else {
-                const s = document.createElement("style");
-                s.innerHTML = style;
-                s.media = media.mediaText;
-                ele.append(s);
-                ele._sheets[style] = { ele: s, count: 1 };
-              }
-            });
-            return () => {
-              sheets.forEach(({ style }) => {
-                ele._sheets[style].count--;
-                if (!ele._sheets[style].count) {
-                  delete ele._sheets[style];
-                }
-              });
-            };
-          } else {
+        this.effect(
+          () => {
+            const root = this.getRootNode();
             root.adoptedStyleSheets = [...root.adoptedStyleSheets, ...sheets];
             return () => {
               root.adoptedStyleSheets = removeItems(root.adoptedStyleSheets, sheets);
             };
-          }
-        }, () => []);
+          },
+          () => []
+        );
       }
     }
   }
   get internals() {
-    var _a2, _b;
     if (!__privateGet$1(this, _internals)) {
       __privateSet$1(this, _internals, this.attachInternals());
       try {
-        (_a2 = __privateGet$1(this, _internals).states) == null ? void 0 : _a2.add("foo");
-        (_b = __privateGet$1(this, _internals).states) == null ? void 0 : _b.delete("foo");
+        __privateGet$1(this, _internals).states.add("foo");
+        __privateGet$1(this, _internals).states.delete("foo");
       } catch {
         Reflect.defineProperty(__privateGet$1(this, _internals), "states", {
-          value: new Proxy(__privateGet$1(this, _internals).states, {
-            get(target, p) {
-              return (str) => target[p](`--${str}`);
-            }
-          })
+          value: {
+            has: (v) => kebabToCamelCase(v) in this.dataset,
+            add: (v) => this.dataset[kebabToCamelCase(v)] = "",
+            delete: (v) => delete this.dataset[kebabToCamelCase(v)]
+          }
         });
       }
     }
@@ -1759,6 +1564,7 @@ class GemElement extends HTMLElement {
     if (__privateGet$1(this, _isMounted)) {
       addMicrotask(__privateGet$1(this, _update));
     }
+    return __privateGet$1(_GemElement, _final);
   }
   closestElement(constructorOrTag) {
     const isConstructor = typeof constructorOrTag === "function";
@@ -1784,9 +1590,13 @@ class GemElement extends HTMLElement {
     } else {
       __privateGet$1(this, _connectedCallback).call(this);
     }
+    return __privateGet$1(_GemElement, _final);
+  }
+  adoptedCallback() {
+    return __privateGet$1(_GemElement, _final);
   }
   disconnectedCallback() {
-    var _a2, _b, _c, _d;
+    var _a2, _b2, _c, _d;
     if (this.isConnected) {
       __privateSet$1(this, _isAppendReason, true);
       return;
@@ -1798,31 +1608,35 @@ class GemElement extends HTMLElement {
     });
     execCallback(__privateGet$1(this, _unmountCallback));
     (_a2 = this.unmounted) == null ? void 0 : _a2.call(this);
-    (_b = __privateGet$1(this, _effectList)) == null ? void 0 : _b.forEach((effectItem) => {
+    (_b2 = __privateGet$1(this, _effectList)) == null ? void 0 : _b2.forEach((effectItem) => {
       execCallback(effectItem.preCallback);
     });
     __privateSet$1(this, _effectList, (_c = __privateGet$1(this, _effectList)) == null ? void 0 : _c.filter(({ inConstructor }) => inConstructor));
     __privateSet$1(this, _memoList, (_d = __privateGet$1(this, _memoList)) == null ? void 0 : _d.filter(({ inConstructor }) => inConstructor));
+    return __privateGet$1(_GemElement, _final);
   }
-}
-_renderRoot = new WeakMap();
-_internals = new WeakMap();
-_isAppendReason = new WeakMap();
-_isMounted = new WeakMap();
-_isAsync = new WeakMap();
-_effectList = new WeakMap();
-_memoList = new WeakMap();
-_unmountCallback = new WeakMap();
-_exec = new WeakMap();
-_execEffect = new WeakMap();
-_execMemo = new WeakMap();
-_initEffect = new WeakMap();
-_render = new WeakMap();
-_shouldUpdate = new WeakMap();
-_updateCallback = new WeakMap();
-_update = new WeakMap();
-_updated = new WeakMap();
-_connectedCallback = new WeakMap();
+};
+let GemElement = _GemElement;
+_final = /* @__PURE__ */ new WeakMap();
+_renderRoot = /* @__PURE__ */ new WeakMap();
+_internals = /* @__PURE__ */ new WeakMap();
+_isAppendReason = /* @__PURE__ */ new WeakMap();
+_isMounted = /* @__PURE__ */ new WeakMap();
+_isAsync = /* @__PURE__ */ new WeakMap();
+_effectList = /* @__PURE__ */ new WeakMap();
+_memoList = /* @__PURE__ */ new WeakMap();
+_unmountCallback = /* @__PURE__ */ new WeakMap();
+_exec = /* @__PURE__ */ new WeakMap();
+_execEffect = /* @__PURE__ */ new WeakMap();
+_execMemo = /* @__PURE__ */ new WeakMap();
+_initEffect = /* @__PURE__ */ new WeakMap();
+_render = /* @__PURE__ */ new WeakMap();
+_shouldUpdate = /* @__PURE__ */ new WeakMap();
+_updateCallback = /* @__PURE__ */ new WeakMap();
+_update = /* @__PURE__ */ new WeakMap();
+_updated = /* @__PURE__ */ new WeakMap();
+_connectedCallback = /* @__PURE__ */ new WeakMap();
+__privateAdd$1(GemElement, _final, Symbol());
 const gemElementProxyMap = new PropProxyMap();
 function defineAttribute(target, prop, attr) {
   const { booleanAttributes, numberAttributes } = target.constructor;
@@ -1880,11 +1694,11 @@ function defineProperty(target, prop, event, eventOptions) {
       if (v !== proxy[prop]) {
         if (event) {
           proxy[prop] = (v == null ? void 0 : v[isEventHandleSymbol]) ? v : (detail, options) => {
-            const evt = new CustomEvent(event, __spreadProps(__spreadValues(__spreadValues({}, options), eventOptions), { detail }));
+            const evt = new CustomEvent(event, { ...options, ...eventOptions, detail });
             that.dispatchEvent(evt);
             v(detail, options);
           };
-          proxy[prop][isEventHandleSymbol] = true;
+          Reflect.set(proxy[prop], isEventHandleSymbol, true);
         } else {
           proxy[prop] = v;
           this[updateSymbol]();
@@ -1907,7 +1721,9 @@ function defineRef(target, prop, ref) {
             return ref;
           },
           get element() {
-            const gemReflects = [...ele.querySelectorAll("[data-gem-reflect]")].map((e) => e.target);
+            const gemReflects = [...ele.querySelectorAll("[data-gem-reflect]")].map(
+              (e) => e.target
+            );
             for (const e of [ele, ...gemReflects]) {
               const result = e.querySelector(`[ref=${ref}]`);
               if (result)
@@ -1952,6 +1768,9 @@ customElements.define = (name, cls, options) => {
   }
   nativeDefineElement(name, cls, options);
 };
+if (window.__GEM_DEVTOOLS__HOOK__) {
+  Object.assign(window.__GEM_DEVTOOLS__HOOK__, { ...GemExports, ...VersionExports });
+}
 function pushStaticField(target, field, member, isSet = false) {
   const cls = target.constructor;
   const current = cls[field];
@@ -2048,7 +1867,7 @@ const store = createStore({
   $hasShouldCloseHandle: false,
   $key: ""
 });
-const paramsMap = new Map();
+const paramsMap = /* @__PURE__ */ new Map();
 function validData(data) {
   const { $key, $hasCloseHandle, $hasOpenHandle, $hasShouldCloseHandle } = data || {};
   if (store.$key === $key)
@@ -2078,18 +1897,19 @@ function normalizeParams(params) {
   const title = params.title || (pathChanged ? "" : document.title);
   const statusChanged = params.close || params.data || params.open || params.shouldClose;
   const hash = params.hash || (!pathChanged && statusChanged ? decodeURIComponent(location.hash) : "");
-  return __spreadProps(__spreadValues({}, params), { title, path, query, hash });
+  return { ...params, title, path, query, hash };
 }
 function updateHistory(p, native) {
   validData(p.data);
   const params = normalizeParams(p);
   const { title, path, query, hash, close, open: open2, shouldClose, data } = params;
-  const state2 = __spreadValues({
+  const state2 = {
     $hasCloseHandle: !!close,
     $hasOpenHandle: !!open2,
     $hasShouldCloseHandle: !!shouldClose,
-    $key: getKey()
-  }, data);
+    $key: getKey(),
+    ...data
+  };
   paramsMap.set(state2.$key, params);
   updateStore(cleanObject(store), state2);
   const url = getUrlBarPath(path) + new QueryString(query) + hash;
@@ -2100,9 +1920,10 @@ function updateHistory(p, native) {
 }
 function updateHistoryByNative(data, title, originUrl, native) {
   validData(data);
-  const state2 = __spreadValues({
-    $key: getKey()
-  }, data || {});
+  const state2 = {
+    $key: getKey(),
+    ...data || {}
+  };
   const { pathname, search, hash } = new URL(originUrl, location.origin + location.pathname);
   const params = normalizeParams({ path: pathname, query: new QueryString(search), hash, title, data });
   paramsMap.set(state2.$key, params);
@@ -2141,9 +1962,9 @@ class GemHistory {
     updateHistory(params, nativeReplaceState);
   }
   pushIgnoreCloseHandle(params) {
-    var _a2, _b;
+    var _a2, _b2;
     if (store.$hasCloseHandle) {
-      (_b = (_a2 = paramsMap.get(store.$key)) == null ? void 0 : _a2.close) == null ? void 0 : _b.call(_a2);
+      (_b2 = (_a2 = paramsMap.get(store.$key)) == null ? void 0 : _a2.close) == null ? void 0 : _b2.call(_a2);
       this.replace(params);
     } else {
       this.push(params);
@@ -2182,9 +2003,10 @@ if (!window._GEMHISTORY) {
     gemHistory.back();
   } else {
     const params = normalizeParams({ title: document.title, hash: location.hash });
-    updateStore(store, __spreadValues({
-      $key: getKey()
-    }, nativeHistory.state || {}));
+    updateStore(store, {
+      $key: getKey(),
+      ...nativeHistory.state || {}
+    });
     paramsMap.set(store.$key, params);
   }
   connect(gemTitleStore, () => {
@@ -2201,7 +2023,7 @@ if (!window._GEMHISTORY) {
   });
   let navigating = false;
   window.addEventListener("popstate", (event) => {
-    var _a2, _b;
+    var _a2, _b2;
     const newState = event.state;
     if (!(newState == null ? void 0 : newState.$key)) {
       return;
@@ -2223,7 +2045,7 @@ if (!window._GEMHISTORY) {
     const prevState = store;
     const isForward = parseFloat(newState.$key) > parseFloat(prevState.$key);
     if (isForward && newState.$hasOpenHandle) {
-      (_b = (_a2 = paramsMap.get(newState.$key)) == null ? void 0 : _a2.open) == null ? void 0 : _b.call(_a2);
+      (_b2 = (_a2 = paramsMap.get(newState.$key)) == null ? void 0 : _a2.open) == null ? void 0 : _b2.call(_a2);
     } else if (prevState.$hasCloseHandle) {
       const prevParams = paramsMap.get(prevState.$key);
       const closeHandle = prevParams == null ? void 0 : prevParams.close;
@@ -2280,14 +2102,24 @@ class ParamsRegExp extends RegExp {
   constructor(pattern) {
     const namePosition = {};
     let i = 0;
-    super(`^${pattern.replace(/:([^/$]+)/g, (_m, name) => {
-      namePosition[name] = i++;
-      return `([^/]+)`;
-    }).replace("*", ".*")}$`, "i");
+    super(
+      `^${pattern.replace(/:([^/$]+)/g, (_m, name) => {
+        namePosition[name] = i++;
+        return `([^/]+)`;
+      }).replace("*", ".*")}$`,
+      "i"
+    );
     this.namePosition = namePosition;
   }
 }
 function matchPath(pattern, path) {
+  if (window.URLPattern) {
+    const urLPattern = new window.URLPattern({ pathname: pattern });
+    const matchResult2 = urLPattern.exec({ pathname: path }) || urLPattern.exec({ pathname: `${path}/` });
+    if (!matchResult2)
+      return null;
+    return matchResult2.pathname.groups;
+  }
   const reg = new ParamsRegExp(pattern);
   const matchResult = path.match(reg) || `${path}/`.match(reg);
   if (!matchResult)
@@ -2312,9 +2144,10 @@ function createPath(route, options) {
 }
 function createHistoryParams(route, options) {
   const path = createPath(route, options);
-  return __spreadValues({
-    path
-  }, options);
+  return {
+    path,
+    ...options
+  };
 }
 let GemRouteElement = class extends GemElement {
   constructor({ isLight, routes } = {}) {
@@ -2354,39 +2187,42 @@ let GemRouteElement = class extends GemElement {
     this.routes = routes;
   }
   mounted() {
-    this.effect(([key2, path], old) => {
-      if (old && key2 === old[0] && path === old[1]) {
-        __privateGet2(this, _updateLocationStore).call(this);
-        return;
-      }
-      const { route, params = {} } = GemRouteElement.findRoute(this.routes, path);
-      const { redirect, content, getContent } = route || {};
-      if (redirect) {
-        history.replace({ path: redirect });
-        return;
-      }
-      const title = route == null ? void 0 : route.title;
-      if (title)
-        updateStore(titleStore, { title });
-      const contentOrLoader = content || (getContent == null ? void 0 : getContent(params));
-      if (contentOrLoader instanceof Promise) {
-        this.loading(route);
-        __privateSet2(this, _lastLoader, contentOrLoader);
-        const isSomeLoader = () => __privateGet2(this, _lastLoader) === contentOrLoader;
-        contentOrLoader.then((content2) => {
-          if (isSomeLoader())
-            __privateGet2(this, _setContent).call(this, route, params, content2);
-        }).catch((err) => {
-          if (isSomeLoader())
-            this.error(err);
-        });
-        return;
+    this.effect(
+      ([key2, path], old) => {
+        if (old && key2 === old[0] && path === old[1]) {
+          __privateGet2(this, _updateLocationStore).call(this);
+          return;
+        }
+        const { route, params = {} } = GemRouteElement.findRoute(this.routes, path);
+        const { redirect, content, getContent } = route || {};
+        if (redirect) {
+          history.replace({ path: redirect });
+          return;
+        }
+        const title = route == null ? void 0 : route.title;
+        if (title)
+          updateStore(titleStore, { title });
+        const contentOrLoader = content || (getContent == null ? void 0 : getContent(params));
+        if (contentOrLoader instanceof Promise) {
+          this.loading(route);
+          __privateSet2(this, _lastLoader, contentOrLoader);
+          const isSomeLoader = () => __privateGet2(this, _lastLoader) === contentOrLoader;
+          contentOrLoader.then((content2) => {
+            if (isSomeLoader())
+              __privateGet2(this, _setContent).call(this, route, params, content2);
+          }).catch((err) => {
+            if (isSomeLoader())
+              this.error(err);
+          });
+          return;
+        }
+        __privateGet2(this, _setContent).call(this, route, params, contentOrLoader);
+      },
+      () => {
+        const { path } = history.getParams();
+        return [this.key, path, location.search];
       }
-      __privateGet2(this, _setContent).call(this, route, params, contentOrLoader);
-    }, () => {
-      const { path } = history.getParams();
-      return [this.key, path, location.search];
-    });
+    );
   }
   shouldUpdate() {
     if (this.inert)
@@ -2399,7 +2235,7 @@ let GemRouteElement = class extends GemElement {
       return html`${content}`;
     return html`
       <style>
-        :host,
+        :host(:where(:not([hidden]))),
         :not(:defined) {
           display: contents;
         }
@@ -2408,9 +2244,9 @@ let GemRouteElement = class extends GemElement {
     `;
   }
 };
-_lastLoader = new WeakMap();
-_updateLocationStore = new WeakMap();
-_setContent = new WeakMap();
+_lastLoader = /* @__PURE__ */ new WeakMap();
+_updateLocationStore = /* @__PURE__ */ new WeakMap();
+_setContent = /* @__PURE__ */ new WeakMap();
 GemRouteElement.createLocationStore = () => {
   const { path, query, data } = history.getParams();
   return createStore({ path, query, data, params: {} });
@@ -2424,7 +2260,7 @@ GemRouteElement.findRoute = (target = [], path) => {
     routes = Object.values(target);
   }
   for (const route of routes) {
-    if (route.pattern === "*") {
+    if ("*" === route.pattern) {
       defaultRoute = route;
     } else {
       const params = matchPath(route.pattern, path);
@@ -2461,7 +2297,7 @@ GemRouteElement = __decorateClass$6([
 ], GemRouteElement);
 class GemLightRouteElement extends GemRouteElement {
   constructor(options = {}) {
-    super(__spreadProps(__spreadValues({}, options), { isLight: true }));
+    super({ ...options, isLight: true });
   }
 }
 var __defProp$5 = Object.defineProperty;
@@ -2475,42 +2311,50 @@ var __decorateClass$5 = (decorators, target, key2, kind) => {
     __defProp$5(target, key2, result);
   return result;
 };
-let GemLinkElement = class extends GemElement {
+function isExternal(path) {
+  return !path.startsWith("/");
+}
+let GemLinkElement = (_a = class extends GemElement {
   constructor() {
     super();
-    this.clickHandle = async (e) => {
+    __privateAdd(this, _routeOptions);
+    __privateAdd(this, _hint);
+    __privateAdd(this, _onClick, void 0);
+    __privateAdd(this, _preventDefault, void 0);
+    __privateAdd(this, _getHint, void 0);
+    __privateSet(this, _onClick, async () => {
       var _a2;
-      const pathInfo = this.getPathInfo();
-      if (!pathInfo)
+      const locationString = this.getLocationString();
+      if (!locationString)
         return;
-      if (this.isExternal(pathInfo)) {
+      if (isExternal(locationString)) {
         switch (this.target) {
           case "_self":
-            window.location.href = pathInfo;
+            window.location.href = locationString;
             return;
           case "_parent":
-            window.parent.location.href = pathInfo;
+            window.parent.location.href = locationString;
             return;
           case "_top":
-            window.top.location.href = pathInfo;
+            window.top.location.href = locationString;
             return;
           default:
-            window.open(pathInfo);
+            window.open(locationString);
             return;
         }
       }
       const { path, query, hash } = history.getParams();
-      if (path + query + hash === pathInfo) {
+      if (path + query + hash === locationString) {
         return;
       }
-      e.stopPropagation();
       await ((_a2 = this.prepare) == null ? void 0 : _a2.call(this));
       if (this.route) {
-        history.pushIgnoreCloseHandle(__spreadProps(__spreadValues({}, createHistoryParams(this.route, this.options)), {
+        history.pushIgnoreCloseHandle({
+          ...createHistoryParams(this.route, __privateGet(this, _routeOptions, routeOptions_get)),
           title: this.route.title || this.docTitle
-        }));
+        });
       } else if (this.href) {
-        const { pathname, search, hash: hash2 } = new URL(pathInfo, location.origin);
+        const { pathname, search, hash: hash2 } = new URL(locationString, location.origin);
         history.pushIgnoreCloseHandle({
           path: pathname,
           query: search,
@@ -2520,37 +2364,18 @@ let GemLinkElement = class extends GemElement {
       } else {
         history.pushIgnoreCloseHandle({ path: this.path, query: this.query, hash: this.hash, title: this.docTitle });
       }
-    };
-    this.preventDefault = (e) => {
+    });
+    __privateSet(this, _preventDefault, (e) => {
       e.preventDefault();
-    };
+    });
+    __privateSet(this, _getHint, () => {
+      const locationString = this.getLocationString();
+      return isExternal(locationString) ? locationString : new URL(history.basePath + locationString, location.origin).toString();
+    });
     this.tabIndex = 0;
-    this.addEventListener("click", this.clickHandle);
+    this.addEventListener("click", __privateGet(this, _onClick));
   }
-  getPathInfo() {
-    var _a2, _b;
-    if (this.route) {
-      const queryProp = ((_a2 = this.options) == null ? void 0 : _a2.query) || "";
-      const hashProp = ((_b = this.options) == null ? void 0 : _b.hash) || "";
-      return createPath(this.route, this.options) + queryProp + hashProp;
-    } else {
-      const url = this.href || this.path + this.query + this.hash;
-      const { path, query } = history.getParams();
-      if (url.startsWith("#")) {
-        return `${path}${query}${url}`;
-      } else if (url.startsWith("?")) {
-        return `${path}${url}`;
-      } else if (url.startsWith(".")) {
-        return absoluteLocation(path, url);
-      } else {
-        return url;
-      }
-    }
-  }
-  isExternal(pathInfo) {
-    return !pathInfo.startsWith("/");
-  }
-  render(pathInfo = this.getPathInfo()) {
+  render() {
     return html`
       <style>
         :host {
@@ -2569,14 +2394,38 @@ let GemLinkElement = class extends GemElement {
       </style>
       <a
         part=${this.link}
-        @click=${this.preventDefault}
-        href=${ifDefined(this.hint === "off" ? void 0 : this.isExternal(pathInfo) ? pathInfo : new URL(history.basePath + pathInfo, location.origin).toString())}
+        @click=${__privateGet(this, _preventDefault)}
+        href=${ifDefined(__privateGet(this, _hint, hint_get) === "off" ? void 0 : __privateGet(this, _getHint).call(this))}
       >
         <slot></slot>
       </a>
     `;
   }
-};
+  getLocationString() {
+    var _a2, _b2;
+    if (this.route) {
+      const queryProp = ((_a2 = __privateGet(this, _routeOptions, routeOptions_get)) == null ? void 0 : _a2.query) || "";
+      const hashProp = ((_b2 = __privateGet(this, _routeOptions, routeOptions_get)) == null ? void 0 : _b2.hash) || "";
+      return createPath(this.route, __privateGet(this, _routeOptions, routeOptions_get)) + queryProp + hashProp;
+    } else {
+      const url = this.href || this.path + this.query + this.hash;
+      const { path, query } = history.getParams();
+      if (url.startsWith("#")) {
+        return `${path}${query}${url}`;
+      } else if (url.startsWith("?")) {
+        return `${path}${url}`;
+      } else if (url.startsWith(".")) {
+        return absoluteLocation(path, url);
+      } else {
+        return url;
+      }
+    }
+  }
+}, _routeOptions = new WeakSet(), routeOptions_get = function() {
+  return this.routeOptions || this.options;
+}, _hint = new WeakSet(), hint_get = function() {
+  return this.hint || "on";
+}, _onClick = new WeakMap(), _preventDefault = new WeakMap(), _getHint = new WeakMap(), _a);
 __decorateClass$5([
   attribute
 ], GemLinkElement.prototype, "href", 2);
@@ -2604,6 +2453,9 @@ __decorateClass$5([
 __decorateClass$5([
   property
 ], GemLinkElement.prototype, "options", 2);
+__decorateClass$5([
+  property
+], GemLinkElement.prototype, "routeOptions", 2);
 __decorateClass$5([
   property
 ], GemLinkElement.prototype, "prepare", 2);
@@ -2614,16 +2466,13 @@ GemLinkElement = __decorateClass$5([
   connectStore(basePathStore)
 ], GemLinkElement);
 let GemActiveLinkElement = class extends GemLinkElement {
-  render() {
-    const { path, query, hash } = history.getParams();
-    const isMatchPattern = this.pattern && matchPath(this.pattern, path);
-    const pathInfo = this.getPathInfo();
-    if (isMatchPattern || path + query + hash === pathInfo) {
-      this.active = true;
-    } else {
-      this.active = false;
-    }
-    return super.render(pathInfo);
+  constructor() {
+    super();
+    this.effect(() => {
+      const { path, query, hash } = history.getParams();
+      const isMatchPattern = this.pattern && matchPath(this.pattern, path);
+      this.active = !!isMatchPattern || path + query + hash === this.getLocationString();
+    });
   }
 };
 __decorateClass$5([
@@ -2651,28 +2500,23 @@ var __decorateClass$4 = (decorators, target, key2, kind) => {
   return result;
 };
 let GemTitleElement = class extends GemElement {
+  constructor() {
+    super();
+    new MutationObserver(() => this.update()).observe(this, { childList: true, characterData: true, subtree: true });
+  }
   static setTitle(title) {
     updateStore(titleStore, { title });
   }
-  static updateTitle(str = "", suffix = "") {
-    const { title } = titleStore;
-    if (title && title !== GemTitleElement.defaultTitle) {
-      GemTitleElement.title = title;
-      document.title = GemTitleElement.title + suffix;
-    } else if (str) {
-      GemTitleElement.title = str;
-      document.title = GemTitleElement.title + suffix;
+  static updateTitle(title = titleStore.title, prefix = "", suffix = "") {
+    if (title === GemTitleElement.defaultTitle) {
+      document.title = GemTitleElement.title = title;
     } else {
-      GemTitleElement.title = GemTitleElement.defaultTitle;
-      document.title = GemTitleElement.title;
+      GemTitleElement.title = title;
+      document.title = prefix + GemTitleElement.title + suffix;
     }
   }
-  constructor() {
-    super();
-    new MutationObserver(() => this.update()).observe(this, { childList: true, characterData: true, subtree: true });
-  }
   render() {
-    GemTitleElement.updateTitle(this.textContent || "", this.suffix);
+    GemTitleElement.updateTitle(this.textContent || void 0, this.prefix, this.suffix);
     if (this.hidden) {
       return html``;
     }
@@ -2681,7 +2525,11 @@ let GemTitleElement = class extends GemElement {
 };
 GemTitleElement.title = document.title;
 GemTitleElement.defaultTitle = document.title;
+GemTitleElement.defaultPrefix = `${document.title} | `;
 GemTitleElement.defaultSuffix = ` - ${document.title}`;
+__decorateClass$4([
+  attribute
+], GemTitleElement.prototype, "prefix", 2);
 __decorateClass$4([
   attribute
 ], GemTitleElement.prototype, "suffix", 2);
@@ -2701,31 +2549,33 @@ var __decorateClass$3 = (decorators, target, key2, kind) => {
     __defProp$3(target, key2, result);
   return result;
 };
-const eleCache = new Map();
+const eleCache = /* @__PURE__ */ new Map();
 class GemUseElement extends GemElement {
-  getContent() {
-    const ele = this.element || (this.selector ? (this.root || document).querySelector(this.selector) : null);
-    if (typeof ele === "string") {
-      let temp = eleCache.get(ele);
-      if (!temp) {
-        temp = document.createElement("template");
-        temp.innerHTML = ele;
-        eleCache.set(ele, temp);
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _getContent, void 0);
+    __privateSet(this, _getContent, () => {
+      const ele = this.element || (this.selector ? (this.root || document).querySelector(this.selector) : null);
+      if (typeof ele === "string") {
+        let temp = eleCache.get(ele);
+        if (!temp) {
+          temp = document.createElement("template");
+          temp.innerHTML = ele;
+          eleCache.set(ele, temp);
+        }
+        return temp.content.cloneNode(true);
+      } else if (ele instanceof HTMLTemplateElement) {
+        return ele.content.cloneNode(true);
+      } else {
+        return ele == null ? void 0 : ele.cloneNode(true);
       }
-      return temp.content.cloneNode(true);
-    } else if (ele instanceof HTMLTemplateElement) {
-      return ele.content.cloneNode(true);
-    } else {
-      return ele == null ? void 0 : ele.cloneNode(true);
-    }
+    });
   }
   render() {
     return html`
       <style>
-        :host {
+        :host(:where(:not([hidden]))) {
           position: relative;
-        }
-        :host(:not([hidden])) {
           display: inline-flex;
           align-items: center;
         }
@@ -2734,11 +2584,12 @@ class GemUseElement extends GemElement {
           height: 100%;
         }
       </style>
-      ${this.getContent()}
+      ${__privateGet(this, _getContent).call(this)}
       <slot></slot>
     `;
   }
 }
+_getContent = new WeakMap();
 __decorateClass$3([
   attribute
 ], GemUseElement.prototype, "selector", 2);
@@ -2766,19 +2617,22 @@ var __decorateClass$2 = (decorators, target, key2, kind) => {
 class GemUnsafeElement extends GemElement {
   constructor() {
     super();
-    this.effect(() => {
-      if (this.shadowRoot) {
-        this.shadowRoot.innerHTML = `
+    this.effect(
+      () => {
+        if (this.shadowRoot) {
+          this.shadowRoot.innerHTML = `
             <style>
-              :host {
+              :host(:where(:not([hidden]))) {
                 display: contents;
               }
               ${this.contentcss}
             </style>
             ${this.content}
           `;
-      }
-    }, () => [this.content, this.contentcss]);
+        }
+      },
+      () => [this.content, this.contentcss]
+    );
   }
   render() {
     return void 0;
@@ -2808,18 +2662,21 @@ class GemReflectElement extends GemElement {
     this.target = document.head;
     this.hidden = true;
     this.dataset.gemReflect = "";
-    this.effect(() => {
-      const childNodes = [...this.childNodes];
-      childNodes.forEach((node) => {
-        if (node instanceof HTMLElement) {
-          node.dataset.reflect = "";
-        }
-        this.target.append(node);
-      });
-      return () => {
-        childNodes.forEach((node) => node.remove());
-      };
-    }, () => [this.target]);
+    this.effect(
+      () => {
+        const childNodes = [...this.childNodes];
+        childNodes.forEach((node) => {
+          if (node instanceof HTMLElement) {
+            node.dataset.reflect = "";
+          }
+          this.target.append(node);
+        });
+        return () => {
+          childNodes.forEach((node) => node.remove());
+        };
+      },
+      () => [this.target]
+    );
   }
 }
 __decorateClass$1([
@@ -2829,6 +2686,7 @@ customElements.define("gem-reflect", GemReflectElement);
 const open = Symbol("open mark");
 function createModalClass(options) {
   var _a2;
+  const final2 = Symbol();
   return _a2 = class extends GemElement {
     constructor() {
       super();
@@ -2848,7 +2706,7 @@ function createModalClass(options) {
       this.inertStore = [...document.body.children].filter((e) => !e.inert);
       this.inertStore.forEach((e) => e.inert = true);
       document.body.append(instance);
-      const changeStore = () => updateStore(this.store, __spreadValues({ [open]: true }, opts));
+      const changeStore = () => updateStore(this.store, { [open]: true, ...opts });
       setTimeout(() => {
         changeStore();
         history.push({
@@ -2858,24 +2716,28 @@ function createModalClass(options) {
           shouldClose: this.shouldClose.bind(this)
         });
       }, 100);
+      return final2;
     }
     static close() {
       history.back();
+      return final2;
     }
     static closeHandle() {
       var _a3;
       this.inertStore.forEach((e) => e.inert = false);
       (_a3 = this.instance) == null ? void 0 : _a3.remove();
-      updateStore(this.store, __spreadValues({ [open]: false }, options));
+      updateStore(this.store, { [open]: false, ...options });
+      return final2;
     }
     static shouldClose() {
       return true;
     }
-  }, _a2.inertStore = [], _a2.instance = null, _a2.store = createStore(__spreadValues({
-    [open]: false
-  }, options)), _a2;
+  }, _a2.inertStore = [], _a2.instance = null, _a2.store = createStore({
+    [open]: false,
+    ...options
+  }), _a2;
 }
-var __defProp2 = Object.defineProperty;
+var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __decorateClass = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key2) : target;
@@ -2883,16 +2745,16 @@ var __decorateClass = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp2(target, key2, result);
+    __defProp(target, key2, result);
   return result;
 };
-let GemDialogBaseElement = (_a = class extends GemElement {
+const final = Symbol();
+let GemDialogBaseElement = (_b = class extends GemElement {
   constructor() {
     super();
     __privateAdd(this, _nextSibling, void 0);
     __privateAdd(this, _parentElement, void 0);
     __privateAdd(this, _inertStore, void 0);
-    this.inert = true;
     __privateSet(this, _inertStore, []);
     this.closeHandle = () => {
       var _a2;
@@ -2905,6 +2767,7 @@ let GemDialogBaseElement = (_a = class extends GemElement {
       }
       this.dispatchEvent(new CustomEvent("close"));
       this.opened = false;
+      return final;
     };
     this.openHandle = () => {
       this.hidden = false;
@@ -2916,6 +2779,7 @@ let GemDialogBaseElement = (_a = class extends GemElement {
       document.body.append(this);
       this.dispatchEvent(new CustomEvent("open"));
       this.opened = true;
+      return final;
     };
     this.open = () => {
       if (this.opened)
@@ -2927,21 +2791,25 @@ let GemDialogBaseElement = (_a = class extends GemElement {
         close: this.closeHandle,
         shouldClose: this.shouldClose
       });
+      return final;
     };
     this.close = () => {
       history.back();
+      return final;
     };
     this.forceClose = () => {
       this.opened = false;
       setTimeout(this.close, 100);
+      return final;
     };
+    this.inert = true;
     this.internals.role = "dialog";
     this.internals.ariaModal = "true";
   }
   shouldClose() {
     return true;
   }
-}, _nextSibling = new WeakMap(), _parentElement = new WeakMap(), _inertStore = new WeakMap(), _a);
+}, _nextSibling = new WeakMap(), _parentElement = new WeakMap(), _inertStore = new WeakMap(), _b);
 __decorateClass([
   attribute
 ], GemDialogBaseElement.prototype, "label", 2);
@@ -2951,45 +2819,41 @@ __decorateClass([
 GemDialogBaseElement = __decorateClass([
   connectStore(history.store)
 ], GemDialogBaseElement);
-const themeStoreMap = new WeakMap();
+const themeStoreMap = /* @__PURE__ */ new WeakMap();
 function getThemeStore(theme) {
   return themeStoreMap.get(theme);
 }
-const themePropMap = new WeakMap();
-function getThemeProp(theme) {
-  return themePropMap.get(theme);
-}
-function replaceStyle(style, theme) {
-  const themeStore = themeStoreMap.get(theme);
-  const themeProp = themePropMap.get(theme);
-  const rules = Object.keys(themeStore).reduce((prev, key2) => {
-    if (!themeStore[key2] || !themeProp[key2])
-      return prev;
-    return prev + `${themeProp[key2]}:${themeStore[key2]};`;
-  }, "");
-  style.textContent = `:root, :host {${rules}}`;
+const themePropsMap = /* @__PURE__ */ new WeakMap();
+function getThemeProps(theme) {
+  return themePropsMap.get(theme);
 }
+const setThemeFnMap = /* @__PURE__ */ new WeakMap();
 function createTheme(themeObj) {
   const salt = randomStr();
   const style = document.createElement("style");
-  const themeStore = createStore(themeObj);
+  const store2 = createStore(themeObj);
   const theme = {};
-  const themeProp = {};
-  themePropMap.set(theme, themeProp);
-  themeStoreMap.set(theme, themeStore);
-  Object.keys(themeStore).forEach((key2) => {
-    themeProp[key2] = `--${camelToKebabCase(key2)}-${salt}`;
-    theme[key2] = `var(${themeProp[key2]})`;
+  const props = {};
+  themePropsMap.set(theme, props);
+  themeStoreMap.set(theme, store2);
+  const setTheme = () => Object.keys(store2).forEach((key2) => {
+    if (props[key2])
+      return;
+    props[key2] = `--${camelToKebabCase(key2)}-${salt}`;
+    theme[key2] = `var(${props[key2]})`;
   });
-  const replace = () => replaceStyle(style, theme);
-  connect(themeStore, replace);
+  setThemeFnMap.set(theme, setTheme);
+  setTheme();
+  const getStyle = () => `:root, :host {${Object.keys(store2).reduce((prev, key2) => prev + `${props[key2]}:${store2[key2]};`, "")}}`;
+  const replace = () => style.textContent = getStyle();
+  connect(store2, replace);
   replace();
   (document.head || document.documentElement).append(style);
   return theme;
 }
 function updateTheme(theme, newThemeObj) {
-  const store2 = getThemeStore(theme);
-  updateStore(store2, newThemeObj);
+  updateStore(getThemeStore(theme), newThemeObj);
+  setThemeFnMap.get(theme)();
 }
 const splitReg = /\$\d(?:<[^>]*>)?/;
 const matchReg = /\$(\d)(<([^>]*)>)?/g;
@@ -3006,7 +2870,7 @@ function splice(rawValue, ...rest) {
   }
   return html(templateArr, ...values);
 }
-const modules = new Set();
+const modules = /* @__PURE__ */ new Set();
 const _I18n = class {
   constructor(options) {
     __privateAdd(this, _cacheCurrentKey);
@@ -3183,7 +3047,10 @@ const defaultReqInit = {
   }
 };
 async function request(uri, options = {}) {
-  const res = await fetch(uri, __spreadValues(__spreadValues({}, defaultReqInit), options));
+  const res = await fetch(uri, {
+    ...defaultReqInit,
+    ...options
+  });
   if (res.status === 0)
     throw new Error("Request fail");
   if (res.status >= 500)
@@ -3224,67 +3091,59 @@ function put(url, body) {
 function post(url, body) {
   return request(url, { method: "POST", body: serializationBody(body) });
 }
-const matche = (query) => window.matchMedia(query).matches;
+const match = (query) => window.matchMedia(query).matches;
 const mediaQuery = {
   PRINT: "print",
   get isPrint() {
-    return matche(this.PRINT);
+    return match(this.PRINT);
   },
   HOVER: "(hover: hover)",
   get isHover() {
-    return matche(this.HOVER);
+    return match(this.HOVER);
   },
-  PHONE: "(min-width: 319px) and (max-width: 480px)",
-  get isPhone() {
-    return matche(this.PHONE);
-  },
-  LAPTOP: "(min-width: 1023px) and (max-width: 1280px) and (orientation: landscape)",
-  get isLaptop() {
-    return matche(this.LAPTOP);
-  },
-  DESKTOP: "(min-width: 1279px) and (orientation: landscape)",
-  get isDesktop() {
-    return matche(this.DESKTOP);
+  PWA: "(display-mode: standalone)",
+  get isPWA() {
+    return match(this.PWA);
   },
-  WIDTHSCREEN: "(min-width: 1919px) and (orientation: landscape)",
-  get isWidthScreen() {
-    return matche(this.WIDTHSCREEN);
+  MOTION_REDUCE: "(prefers-reduced-motion: reduce)",
+  get isMotionReduce() {
+    return match(this.MOTION_REDUCE);
   },
-  PHONE_LANDSCAPE: "(min-width: 479px) and (max-width: 959px) and (orientation: landscape)",
-  get isPhoneLandscape() {
-    return matche(this.PHONE_LANDSCAPE);
+  DATA_REDUCE: "(prefers-reduced-data: reduce)",
+  get isDataReduce() {
+    return match(this.DATA_REDUCE);
   },
-  TABLET: "(min-width: 768px) and (max-width: 1024px)",
-  get isTablet() {
-    return matche(this.TABLET);
+  WATCH: "(width < 320px)",
+  get isWatch() {
+    return match(this.WATCH);
   },
-  SMALL_PHONE: "(min-width: 319px) and (max-width: 480px) and (max-height: 640px)",
+  SMALL_PHONE: "(320px <= width <= 480px) and (height <= 640px)",
   get isSmallPhone() {
-    return matche(this.SMALL_PHONE);
+    return match(this.SMALL_PHONE);
   },
-  WATCH: "(max-width: 319px)",
-  get isWatch() {
-    return matche(this.WATCH);
+  PHONE: "(320px <= width <= 480px)",
+  get isPhone() {
+    return match(this.PHONE);
+  },
+  PHONE_LANDSCAPE: "(480px < width < 960px) and (orientation: landscape)",
+  get isPhoneLandscape() {
+    return match(this.PHONE_LANDSCAPE);
   },
-  SHORT: "(min-width: 479px) and (max-height: 320px)",
+  SHORT: "(width >= 480px) and (height <= 320px)",
   get isShort() {
-    return matche(this.SHORT);
+    return match(this.SHORT);
   },
-  PWA: "(display-mode: standalone)",
-  get isPWA() {
-    return matche(this.PWA);
+  TABLET: "(480px < width <= 1280px)",
+  get isTablet() {
+    return match(this.TABLET);
   },
-  MOTION_REDUCE: "(prefers-reduced-motion: reduce)",
-  get isMotionReduce() {
-    return matche(this.MOTION_REDUCE);
+  DESKTOP: "(width > 1280px) and (orientation: landscape)",
+  get isDesktop() {
+    return match(this.DESKTOP);
   },
-  DATA_REDUCE: "(prefers-reduced-data: reduce)",
-  get isDataReduce() {
-    return matche(this.DATA_REDUCE);
+  WIDTHSCREEN: "(width >= 1920px) and (orientation: landscape)",
+  get isWidthScreen() {
+    return match(this.WIDTHSCREEN);
   }
 };
-const version = "1.7.0";
-if (window.__GEM_DEVTOOLS__HOOK__) {
-  Object.assign(window.__GEM_DEVTOOLS__HOOK__, __spreadValues({}, Gem));
-}
-export { GemActiveLinkElement, GemDialogBaseElement, GemElement, GemError, GemLightRouteElement, GemLinkElement, GemReflectElement, GemRouteElement, GemTitleElement, GemUnsafeElement, GemUseElement, I18n, LinkedList, PropProxyMap, QueryString, SVGTemplateResult, SheetToken, StoreListenerMap, TemplateResult, absoluteLocation, addMicrotask, addMicrotaskToStack, adoptedStyle, attribute, basePathStore, boolattribute, camelToKebabCase, classMap, cleanObject, connect, connectStore, createCSSSheet, createHistoryParams, createModalClass, createPath, createStore, createStoreSet, createTheme, css, customElement, defaultReqInit, defineAttribute, defineCSSState, defineProperty, defineRef, del, directive, disconnect, emitter, exportPartsMap, get, getThemeProp, getThemeStore, globalemitter, guard, history, html, ifDefined, isArrayChange, kebabToCamelCase, matchPath, mediaQuery, nativeDefineElement, numattribute, objectMapToString, part, partMap, post, property, put, randomStr, raw, refobject, removeItems, render, repeat, request, rootElement, slot, splice, state, styleMap, styled, svg, titleStore, updateStore, updateTheme, useNativeCSSStyleSheet, version };
+export { GemActiveLinkElement, GemDialogBaseElement, GemElement, GemError, GemLightRouteElement, GemLinkElement, GemReflectElement, GemRouteElement, GemTitleElement, GemUnsafeElement, GemUseElement, I18n, LinkedList, PropProxyMap, QueryString, SVGTemplateResult, SheetToken, StoreListenerMap, TemplateResult, absoluteLocation, addMicrotask, addMicrotaskToStack, adoptedStyle, attribute, basePathStore, boolattribute, camelToKebabCase, classMap, cleanObject, connect, connectStore, createCSSSheet, createHistoryParams, createModalClass, createPath, createStore, createStoreSet, createTheme, css, customElement, defaultReqInit, defineAttribute, defineCSSState, defineProperty, defineRef, del, directive, disconnect, emitter, exportPartsMap, get, getThemeProps, getThemeStore, globalemitter, guard, history, html, ifDefined, isArrayChange, kebabToCamelCase, matchPath, mediaQuery, nativeDefineElement, numattribute, objectMapToString, part, partMap, post, property, put, randomStr, raw, refobject, removeItems, render, repeat, request, rootElement, slot, splice, state, styleMap, styled, svg, titleStore, updateStore, updateTheme, version };