@mantou/gem 1.6.19 → 1.7.1

package/dist/gem.es.js

@@ -39,36 +39,27 @@ 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, _a, _nextSibling, _parentElement, _inertStore, _b, _cacheCurrentKey, cacheCurrentKey_get, _urlParamsLang, urlParamsLang_get, _cacheLang, cacheLang_get, _isMain, isMain_get, _lang, lang_set;
+var GemExports = /* @__PURE__ */ Object.freeze({
   __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,141 +87,6 @@ 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;
   }
 });
 /**
@@ -1175,7 +1031,7 @@ function css(arr, ...args) {
 }
 const SheetToken = Symbol.for("gem@sheetToken");
 let useNativeCSSStyleSheet = true;
-let CSSStyleSheet = window.CSSStyleSheet;
+let CSSStyleSheet = globalThis.CSSStyleSheet;
 try {
   new CSSStyleSheet();
 } catch {
@@ -1325,6 +1181,12 @@ function disconnect(store2, func) {
   const listeners = StoreListenerMap.get(store2);
   listeners == null ? void 0 : listeners.delete(func);
 }
+const version = "1.7.1";
+var VersionExports = /* @__PURE__ */ Object.freeze({
+  __proto__: null,
+  [Symbol.toStringTag]: "Module",
+  version
+});
 /**
  * @license
  * Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
@@ -1556,7 +1418,7 @@ const constructorSymbol = Symbol("constructor");
 const initSymbol = Symbol("init");
 const updateSymbol = Symbol("update");
 class GemElement extends HTMLElement {
-  constructor({ isAsync, isLight, delegatesFocus } = {}) {
+  constructor({ isAsync, isLight, delegatesFocus, slotAssignment } = {}) {
     super();
     __privateAdd$1(this, _renderRoot, void 0);
     __privateAdd$1(this, _internals, void 0);
@@ -1627,13 +1489,13 @@ class GemElement extends HTMLElement {
       });
     });
     __privateAdd$1(this, _render, () => {
-      var _a2, _b;
+      var _a2, _b2;
       __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>
-            `)}`;
+      const styles = useNativeCSSStyleSheet ? "" : html`${(_b2 = (_a2 = this.shadowRoot) == null ? void 0 : _a2.adoptedStyleSheets) == null ? void 0 : _b2.map((e) => html`
+            <style media=${e.media.mediaText}>
+              ${e.style}
+            </style>
+          `)}`;
       if (this.render) {
         const r = this.render();
         return r && html`${r}${styles}`;
@@ -1666,7 +1528,7 @@ class GemElement extends HTMLElement {
       (_a2 = this.updated) == null ? void 0 : _a2.call(this);
     });
     __privateAdd$1(this, _connectedCallback, () => {
-      var _a2, _b, _c;
+      var _a2, _b2, _c;
       this[constructorSymbol] = false;
       if (__privateGet$1(this, _isAppendReason)) {
         __privateSet$1(this, _isAppendReason, false);
@@ -1680,7 +1542,7 @@ 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`);
@@ -1695,7 +1557,7 @@ class GemElement extends HTMLElement {
       }
     };
     __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);
@@ -1738,24 +1600,18 @@ class GemElement extends HTMLElement {
   }
   get internals() {
     if (!__privateGet$1(this, _internals)) {
-      const getCustomStateSet = () => {
-        const getV = (v) => v.replace(/-/g, "");
-        return {
-          has: (v) => getV(v) in this.dataset,
-          add: (v) => {
-            this.dataset[getV(v)] = "";
-          },
-          delete: (v) => delete this.dataset[getV(v)]
-        };
-      };
-      if (!this.attachInternals) {
-        this.attachInternals = () => {
-          return { states: getCustomStateSet() };
-        };
-      }
       __privateSet$1(this, _internals, this.attachInternals());
-      if (!__privateGet$1(this, _internals).states) {
-        __privateGet$1(this, _internals).states = getCustomStateSet();
+      try {
+        __privateGet$1(this, _internals).states.add("foo");
+        __privateGet$1(this, _internals).states.delete("foo");
+      } catch {
+        Reflect.defineProperty(__privateGet$1(this, _internals), "states", {
+          value: {
+            has: (v) => kebabToCamelCase(v) in this.dataset,
+            add: (v) => this.dataset[kebabToCamelCase(v)] = "",
+            delete: (v) => delete this.dataset[kebabToCamelCase(v)]
+          }
+        });
       }
     }
     return __privateGet$1(this, _internals);
@@ -1791,7 +1647,7 @@ class GemElement extends HTMLElement {
     }
   }
   disconnectedCallback() {
-    var _a2, _b, _c, _d;
+    var _a2, _b2, _c, _d;
     if (this.isConnected) {
       __privateSet$1(this, _isAppendReason, true);
       return;
@@ -1803,7 +1659,7 @@ 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));
@@ -1912,7 +1768,7 @@ function defineRef(target, prop, ref) {
             return ref;
           },
           get element() {
-            const gemReflects = [...ele.querySelectorAll("[data-gemreflect]")].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)
@@ -1930,18 +1786,17 @@ function defineCSSState(target, prop, state2) {
   Object.defineProperty(target, prop, {
     configurable: true,
     get() {
-      var _a2;
       const that = this;
       const { states } = that.internals;
-      return (_a2 = states.has) == null ? void 0 : _a2.call(states, state2);
+      return states == null ? void 0 : states.has(state2);
     },
     set(v) {
       const that = this;
       const { states } = that.internals;
       if (v) {
-        states.add(state2);
+        states == null ? void 0 : states.add(state2);
       } else {
-        states.delete(state2);
+        states == null ? void 0 : states.delete(state2);
       }
     }
   });
@@ -1949,15 +1804,18 @@ function defineCSSState(target, prop, state2) {
 const nativeDefineElement = customElements.define.bind(customElements);
 customElements.define = (name, cls, options) => {
   if (cls.prototype instanceof GemElement) {
-    const { observedAttributes, observedPropertys, defineEvents, defineCSSStates, defineRefs } = cls;
+    const { observedAttributes, observedProperties, defineEvents, defineCSSStates, defineRefs } = cls;
     observedAttributes == null ? void 0 : observedAttributes.forEach((attr) => defineAttribute(cls.prototype, kebabToCamelCase(attr), attr));
-    observedPropertys == null ? void 0 : observedPropertys.forEach((prop) => defineProperty(cls.prototype, prop));
+    observedProperties == null ? void 0 : observedProperties.forEach((prop) => defineProperty(cls.prototype, prop));
     defineEvents == null ? void 0 : defineEvents.forEach((event) => defineProperty(cls.prototype, kebabToCamelCase(event), event));
-    defineCSSStates == null ? void 0 : defineCSSStates.forEach((state2) => defineCSSState(cls.prototype, kebabToCamelCase(state2), `--${state2}`));
+    defineCSSStates == null ? void 0 : defineCSSStates.forEach((state2) => defineCSSState(cls.prototype, kebabToCamelCase(state2), state2));
     defineRefs == null ? void 0 : defineRefs.forEach((ref) => defineRef(cls.prototype, kebabToCamelCase(ref), ref));
   }
   nativeDefineElement(name, cls, options);
 };
+if (window.__GEM_DEVTOOLS__HOOK__) {
+  Object.assign(window.__GEM_DEVTOOLS__HOOK__, __spreadValues(__spreadValues({}, GemExports), VersionExports));
+}
 function pushStaticField(target, field, member, isSet = false) {
   const cls = target.constructor;
   const current = cls[field];
@@ -1991,13 +1849,13 @@ function numattribute(target, prop) {
   defineAttr(target, prop, attr);
 }
 function property(target, prop) {
-  pushStaticField(target, "observedPropertys", prop);
+  pushStaticField(target, "observedProperties", prop);
   defineProperty(target, prop);
 }
 function state(target, prop) {
   const attr = camelToKebabCase(prop);
   pushStaticField(target, "defineCSSStates", attr);
-  defineCSSState(target, prop, `--${attr}`);
+  defineCSSState(target, prop, attr);
 }
 function slot(target, prop) {
   const attr = camelToKebabCase(target[prop] || prop);
@@ -2147,9 +2005,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);
@@ -2207,7 +2065,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;
@@ -2229,7 +2087,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;
@@ -2405,7 +2263,7 @@ let GemRouteElement = class extends GemElement {
       return html`${content}`;
     return html`
       <style>
-        :host,
+        :host(:where(:not([hidden]))),
         :not(:defined) {
           display: contents;
         }
@@ -2481,9 +2339,10 @@ var __decorateClass$5 = (decorators, target, key2, kind) => {
     __defProp$5(target, key2, result);
   return result;
 };
-let GemLinkElement = class extends GemElement {
+let GemLinkElement = (_a = class extends GemElement {
   constructor() {
     super();
+    __privateAdd(this, _routeOptions);
     this.clickHandle = async (e) => {
       var _a2;
       const pathInfo = this.getPathInfo();
@@ -2512,7 +2371,7 @@ let GemLinkElement = class extends GemElement {
       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(__spreadProps(__spreadValues({}, createHistoryParams(this.route, __privateGet(this, _routeOptions, routeOptions_get))), {
           title: this.route.title || this.docTitle
         }));
       } else if (this.href) {
@@ -2534,11 +2393,11 @@ let GemLinkElement = class extends GemElement {
     this.addEventListener("click", this.clickHandle);
   }
   getPathInfo() {
-    var _a2, _b;
+    var _a2, _b2;
     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;
+      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();
@@ -2582,7 +2441,9 @@ let GemLinkElement = class extends GemElement {
       </a>
     `;
   }
-};
+}, _routeOptions = new WeakSet(), routeOptions_get = function() {
+  return this.routeOptions || this.options;
+}, _a);
 __decorateClass$5([
   attribute
 ], GemLinkElement.prototype, "href", 2);
@@ -2610,6 +2471,9 @@ __decorateClass$5([
 __decorateClass$5([
   property
 ], GemLinkElement.prototype, "options", 2);
+__decorateClass$5([
+  property
+], GemLinkElement.prototype, "routeOptions", 2);
 __decorateClass$5([
   property
 ], GemLinkElement.prototype, "prepare", 2);
@@ -2728,10 +2592,8 @@ class GemUseElement extends GemElement {
   render() {
     return html`
       <style>
-        :host {
+        :host(:where(:not([hidden]))) {
           position: relative;
-        }
-        :host(:not([hidden])) {
           display: inline-flex;
           align-items: center;
         }
@@ -2776,7 +2638,7 @@ class GemUnsafeElement extends GemElement {
       if (this.shadowRoot) {
         this.shadowRoot.innerHTML = `
             <style>
-              :host {
+              :host(:where(:not([hidden]))) {
                 display: contents;
               }
               ${this.contentcss}
@@ -2808,13 +2670,12 @@ var __decorateClass$1 = (decorators, target, key2, kind) => {
     __defProp$1(target, key2, result);
   return result;
 };
-document.querySelectorAll("[data-reflect]").forEach((e) => e.remove());
 class GemReflectElement extends GemElement {
   constructor() {
     super({ isLight: true });
     this.target = document.head;
     this.hidden = true;
-    this.dataset.gemreflect = "";
+    this.dataset.gemReflect = "";
     this.effect(() => {
       const childNodes = [...this.childNodes];
       childNodes.forEach((node) => {
@@ -2893,7 +2754,7 @@ var __decorateClass = (decorators, target, key2, kind) => {
     __defProp2(target, key2, result);
   return result;
 };
-let GemDialogBaseElement = (_a = class extends GemElement {
+let GemDialogBaseElement = (_b = class extends GemElement {
   constructor() {
     super();
     __privateAdd(this, _nextSibling, void 0);
@@ -2948,7 +2809,7 @@ let GemDialogBaseElement = (_a = class extends GemElement {
   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);
@@ -3290,8 +3151,4 @@ const mediaQuery = {
     return matche(this.DATA_REDUCE);
   }
 };
-const version = "1.6.19";
-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 };