airx 0.4.0 → 0.7.1

package/output/umd/index.js

@@ -1,1304 +0,0 @@
-(function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
-  typeof define === 'function' && define.amd ? define(['exports'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.airx = {}));
-})(this, (function (exports) { 'use strict';
-
-  const globalContext = {
-      current: null
-  };
-  function useContext() {
-      if (globalContext.current == null) {
-          throw new Error('Unable to find a valid component context');
-      }
-      return globalContext.current;
-  }
-  const onMounted = (listener) => {
-      return useContext().onMounted(listener);
-  };
-  const onUnmounted = (listener) => {
-      return useContext().onUnmounted(listener);
-  };
-  const inject = (key) => {
-      return useContext().inject(key);
-  };
-  const provide = (key, value) => {
-      return useContext().provide(key, value);
-  };
-
-  const isPrintLogs = typeof process != 'undefined'
-      && process?.env?.NODE_ENV === 'development'
-      && process?.env?.AIRX_DEBUG === 'true';
-  function createLogger(name) {
-      function getPrintPrefix() {
-          const date = new Date().toLocaleString();
-          return `[${date}][${name}]`;
-      }
-      function debug(...args) {
-          if (isPrintLogs)
-              console.log(getPrintPrefix(), ...args);
-      }
-      return { debug };
-  }
-
-  let firstSignal = undefined;
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const globalNS = (function () {
-      // the only reliable means to get the global object is
-      // `Function('return this')()`
-      // However, this causes CSP violations in Chrome apps.
-      if (typeof self !== 'undefined') {
-          return self;
-      }
-      if (typeof window !== 'undefined') {
-          return window;
-      }
-      if (typeof global !== 'undefined') {
-          return global;
-      }
-      throw new Error('unable to locate global object');
-  })();
-  // 通过函数包装来延迟加载 Signal
-  // 这对使用 Polyfill 的应用来说更友好
-  function getSignal() {
-      const globalSignal = globalNS['Signal'];
-      if (globalSignal == null)
-          throw new Error('Signal is undefined');
-      if (firstSignal == null)
-          firstSignal = globalSignal;
-      if (firstSignal !== globalSignal)
-          throw new Error('Signal have multiple instances');
-      return globalSignal;
-  }
-  function createWatch(notify) {
-      const signal = getSignal();
-      return new signal.subtle.Watcher(notify);
-  }
-  function createComputed(computation, options) {
-      const signal = getSignal();
-      return new signal.Computed(computation, options);
-  }
-  function isState(target) {
-      const signal = getSignal();
-      return target instanceof signal.State;
-  }
-
-  const airxElementSymbol = Symbol('airx-element');
-
-  /**
-   * createElement 是用于创建 AirxElement 的工具函数
-   */
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  function createElement(type, props, ...children) {
-      const localChildren = [];
-      if (children.length > 0) {
-          localChildren.push(...children);
-      }
-      else if (props && props.children) {
-          localChildren.push(props.children);
-      }
-      return {
-          type,
-          props: {
-              ...props,
-              children: localChildren
-          },
-          [airxElementSymbol]: true
-      };
-  }
-  function isValidElement(element) {
-      return typeof element === 'object'
-          && element !== null
-          && Reflect.get(element, airxElementSymbol);
-  }
-  function Fragment(props) {
-      return () => props.children;
-  }
-  function component(comp) {
-      return comp;
-  }
-  function createErrorRender(error) {
-      console.error(error);
-      const handleClick = () => {
-          // 点击输出错误是为了避免
-          // 页面上多个组件同时出错时
-          // 无法定位错误与之对应的组件
-          console.error(error);
-      };
-      const formattingError = () => {
-          if (error == null)
-              return 'Unknown rendering error';
-          if (error instanceof Error)
-              return error.message;
-          return JSON.stringify(error);
-      };
-      const errorBlockStyle = {
-          padding: '8px',
-          fontSize: '20px',
-          color: 'rgb(255,255,255)',
-          backgroundColor: 'rgb(255, 0, 0)',
-      };
-      return () => createElement('div', { style: errorBlockStyle, onClick: handleClick }, formattingError());
-  }
-
-  class InnerAirxComponentContext {
-      instance;
-      disposers = new Set();
-      providedMap = new Map();
-      injectedMap = new Map();
-      mountListeners = new Set();
-      unmountedListeners = new Set();
-      triggerMounted() {
-          this.mountListeners.forEach(listener => {
-              let disposer = undefined;
-              try {
-                  disposer = listener();
-              }
-              catch (err) {
-                  console.error(err, listener);
-              }
-              if (typeof disposer === 'function') {
-                  this.addDisposer(disposer);
-              }
-          });
-          // 生命周期只会调用一次
-          this.mountListeners.clear();
-      }
-      triggerUnmounted() {
-          // 递归的调用子 child 的 Unmounted
-          if (this.instance?.child != null) {
-              this.instance.child.context.triggerUnmounted();
-          }
-          // 处理自己
-          this.unmountedListeners.forEach(listener => {
-              try {
-                  listener();
-              }
-              catch (err) {
-                  console.error(err, listener);
-              }
-          });
-          // 处理兄弟节点
-          if (this.instance?.sibling != null) {
-              this.instance.sibling.context.triggerUnmounted();
-          }
-          this.dispose();
-      }
-      onMounted(listener) {
-          this.mountListeners.add(listener);
-      }
-      onUnmounted(listener) {
-          this.unmountedListeners.add(listener);
-      }
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      provide(key, value) {
-          this.providedMap.set(key, value);
-          return v => {
-              if (typeof v === 'function') {
-                  const old = this.providedMap.get(key);
-                  const func = v;
-                  this.providedMap.set(key, func(old));
-                  return;
-              }
-              this.providedMap.set(key, v);
-          };
-      }
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      inject(key) {
-          const getProvideValueForParent = (instance, key) => {
-              if (instance && instance.context) {
-                  const value = instance.context.providedMap.get(key);
-                  if (value != undefined)
-                      return value;
-                  if (instance.parent)
-                      return getProvideValueForParent(instance.parent, key);
-              }
-              return undefined;
-          };
-          const currentParentValue = getProvideValueForParent(this.instance.parent, key);
-          this.injectedMap.set(key, currentParentValue); // 更新本地值
-          return this.injectedMap.get(key);
-      }
-      addDisposer(...disposers) {
-          disposers.forEach(disposer => {
-              this.disposers.add(disposer);
-          });
-      }
-      dispose() {
-          this.disposers.forEach((disposer) => {
-              try {
-                  disposer();
-              }
-              catch (err) {
-                  // eslint-disable-next-line no-console
-                  console.error(err, disposer);
-              }
-          });
-          this.disposers.clear();
-          this.injectedMap.clear();
-          this.providedMap.clear();
-          this.mountListeners.clear();
-          this.unmountedListeners.clear();
-      }
-      /**
-       * 当 context 传递给外部消费时，隐藏内部实现，仅暴露接口定义的内容
-       * @returns 和 AirxComponentContext 接口完全一致的对象
-       */
-      getSafeContext() {
-          return {
-              inject: k => this.inject(k),
-              provide: (k, v) => this.provide(k, v),
-              onMounted: listener => this.onMounted(listener),
-              onUnmounted: listener => this.onUnmounted(listener)
-          };
-      }
-  }
-  /**
-     * 更新 children
-     * @param parentInstance  当前正在处理的组件的实例
-     * @param children  当前组件的子节点
-     */
-  function reconcileChildren(appContext, parentInstance, childrenElementArray) {
-      const logger = createLogger('reconcileChildren');
-      logger.debug('reconcileChildren', parentInstance, childrenElementArray);
-      // parentInstance ←-------- 
-      //   |    ↑                ↑
-      // child parent          parent
-      //   ↓    |                |
-      // instance  -sibling→  instance -→ ....
-      /**
-       * 内部通过 index 生成 element 的 key
-       * 通过前缀来避免和用户手动设置的 key 发生冲突
-       * @param index
-       * @returns 生成的 key
-       */
-      function getInnerElementIndexKey(index) {
-          return `airx-element-inner-key:${index}`;
-      }
-      /**
-       * 将 children 实例链转成 Map 便于此处消费
-       * @param firstChild children 实例的第一个元素
-       * @returns 从 firstChild 开始之后的所有 sibling 实例组成的 Map
-       */
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      function getChildrenInstanceMap(firstChild) {
-          // 不使用递归是因为递归容易爆栈
-          let nextIndex = 0;
-          let nextChild = firstChild;
-          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-          const map = new Map();
-          while (nextChild) {
-              /* 如果有 key，则将 key 作为 map key，否则将 index 作为 key */
-              if (nextChild.element?.props.key != null) {
-                  map.set(nextChild.element?.props.key, nextChild);
-              }
-              else {
-                  map.set(getInnerElementIndexKey(nextIndex), nextChild);
-              }
-              nextChild = nextChild.sibling;
-              nextIndex += 1;
-          }
-          return map;
-      }
-      const newChildrenInstanceArray = [];
-      const childrenInstanceMap = getChildrenInstanceMap(parentInstance.child);
-      function getChildInstance(child, index) {
-          if (child.props.key != null) {
-              const key = child.props.key;
-              const instance = childrenInstanceMap.get(key) || null;
-              return [instance, () => childrenInstanceMap.delete(key)];
-          }
-          const innerKey = getInnerElementIndexKey(index);
-          const instance = childrenInstanceMap.get(innerKey) || null;
-          return [instance, () => childrenInstanceMap.delete(innerKey)];
-      }
-      /** 是否复用实例 */
-      function isReuseInstance(instance, nextElement) {
-          for (const plugin of appContext.plugins) {
-              if (typeof plugin.isReuseInstance === 'function') {
-                  const result = plugin.isReuseInstance(instance, nextElement);
-                  // 任意一个插件要求不复用就不复用
-                  if (result === false)
-                      return false;
-              }
-          }
-          return true;
-      }
-      function updateMemoProps(instance) {
-          if (instance.element == null)
-              return;
-          if (instance.memoProps == null)
-              instance.memoProps = {};
-          // 简单来说就是以下几件事情
-          // 始终保持 props 的引用不变
-          // 1. 创建一个新对象来保存 beforeElement props 的状态
-          // 2. 将新的 element 上的 props 引用设置为之前的 props
-          // 3. 将新的 element 上的 props 更新到之前的 props 上去
-          if (instance.memoProps != null) {
-              for (const key in instance.memoProps) {
-                  delete instance.memoProps[key];
-              }
-          }
-          // 将新的 props 更新上去
-          for (const key in instance.element.props) {
-              const value = instance.element.props[key];
-              instance.memoProps[key] = value;
-          }
-      }
-      function isNeedReRender(instance) {
-          for (const plugin of appContext.plugins) {
-              if (typeof plugin.isReRender === 'function') {
-                  const result = plugin.isReRender(instance);
-                  // 任意一个插件要求重新渲染就重新渲染
-                  if (result === true)
-                      return true;
-              }
-          }
-          return false;
-      }
-      function getElementNamespace(element) {
-          const ns = Object.keys(element.props)
-              .filter(key => (key === 'xmlns' || key.startsWith('xmlns:')))
-              .sort((a, b) => a.length - b.length);
-          if (ns.length > 1) {
-              console.log('airx currently does not support setting multiple xmlns');
-              return '';
-          }
-          if (ns.some(i => i.startsWith('xmlns:'))) {
-              console.log('airx does not currently support setting named namespaces，only supports default');
-              return '';
-          }
-          // 原则上来说 html 仅支持设置默认的 namespace
-          return element.props[ns[0]];
-      }
-      // 依次遍历 child 并和 instance 对比
-      for (let index = 0; index < childrenElementArray.length; index++) {
-          const element = childrenElementArray[index];
-          const [instance, seize] = getChildInstance(element, index);
-          if (instance && isReuseInstance(instance, element)) {
-              seize(); // 从 childrenInstanceMap 中释放
-              newChildrenInstanceArray.push(instance);
-              instance.beforeElement = instance.element;
-              instance.element = element;
-              updateMemoProps(instance);
-              // 如果父组件更新了，子组件全部都要更新
-              if (instance.needReRender !== true && typeof element.type === 'function') {
-                  instance.needReRender = parentInstance.needReRender || isNeedReRender(instance);
-              }
-          }
-          else {
-              const context = new InnerAirxComponentContext();
-              const elementNamespace = getElementNamespace(element);
-              const instance = { element, context, elementNamespace };
-              newChildrenInstanceArray.push(instance);
-              context.instance = instance;
-              updateMemoProps(instance);
-              // 添加 ref 处理
-              if ('ref' in instance.memoProps) {
-                  context.onMounted(() => {
-                      const ref = instance.memoProps.ref;
-                      // 如果组件有自己的 dom
-                      if (instance.domRef) {
-                          if (isState(ref)) {
-                              ref.set(instance.domRef);
-                              return () => ref.set(undefined);
-                          }
-                          if (typeof ref === 'function') {
-                              ref(instance.domRef);
-                              return () => ref(undefined);
-                          }
-                      }
-                  });
-              }
-          }
-      }
-      // 新的 node
-      for (let index = 0; index < newChildrenInstanceArray.length; index++) {
-          const instance = newChildrenInstanceArray[index];
-          // 确保链的干净
-          instance.parent = parentInstance;
-          if (index === 0)
-              parentInstance.child = instance;
-          if (index > 0)
-              newChildrenInstanceArray[index - 1].sibling = instance;
-          if (index === newChildrenInstanceArray.length - 1)
-              delete instance.sibling;
-          // 处理 ElementNS: 继承父级 namespace
-          if (!instance.elementNamespace && instance.parent?.elementNamespace) {
-              // SVG 中 foreignObject 代表外来对象，起到隔离 namespace 的作用
-              if (instance.parent.element?.type !== 'foreignObject') {
-                  instance.elementNamespace = instance.parent.elementNamespace;
-              }
-          }
-      }
-      // 剩余的是需要移除的
-      if (childrenInstanceMap.size > 0) {
-          if (parentInstance.deletions == null) {
-              parentInstance.deletions = new Set();
-          }
-          childrenInstanceMap.forEach(instance => {
-              parentInstance.deletions?.add(instance);
-          });
-      }
-      logger.debug('parentInstance', parentInstance);
-  }
-  /**
-   * 处理单个 instance
-   * @param instance 当前处理的实例
-   * @returns 返回下一个需要处理的 instance
-   */
-  function performUnitOfWork(pluginContext, instance, onUpdateRequire) {
-      const element = instance.element;
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      function childrenAsElements(children) {
-          const childrenAsArray = Array.isArray(children) ? children : [children];
-          function isComment(element) {
-              if (element === '')
-                  return true;
-              if (element == null)
-                  return true;
-              if (element === false)
-                  return true;
-              return false;
-          }
-          return childrenAsArray.flat(3).map(element => {
-              if (isValidElement(element))
-                  return element;
-              const elementType = isComment(element) ? 'comment' : 'text';
-              const textContent = element === '' ? 'empty-string' : String(element);
-              return createElement(elementType, { textContent });
-          });
-      }
-      // airx 组件
-      if (typeof element?.type === 'function') {
-          if (instance.componentReturnValue == null) {
-              const component = element.type;
-              const beforeContext = globalContext.current;
-              globalContext.current = instance.context.getSafeContext();
-              let componentReturnValue = undefined;
-              try {
-                  componentReturnValue = component(instance.memoProps);
-              }
-              catch (error) {
-                  componentReturnValue = createErrorRender(error);
-              }
-              // restore context
-              globalContext.current = beforeContext;
-              instance.componentReturnValue = componentReturnValue;
-              // static function component
-              if (isValidElement(componentReturnValue)) {
-                  const elements = childrenAsElements(componentReturnValue);
-                  reconcileChildren(pluginContext, instance, elements);
-              }
-              // reaction function component
-              if (typeof componentReturnValue === 'function') {
-                  if (instance.signalWatcher == null) {
-                      // Watch 是惰性的，只有当 Signal 被读取时才会触发 --！
-                      const signalWatcher = createWatch(async () => {
-                          instance.needReRender = true;
-                          onUpdateRequire?.(instance);
-                          queueMicrotask(() => {
-                              signalWatcher.watch();
-                              const paddings = signalWatcher.getPending();
-                              for (const padding of paddings)
-                                  padding.get();
-                          });
-                      });
-                      instance.signalWatcher = signalWatcher;
-                      instance.context.addDisposer(() => signalWatcher.unwatch());
-                  }
-                  const childrenComputed = createComputed(() => {
-                      try {
-                          if (typeof componentReturnValue === 'function') {
-                              return componentReturnValue();
-                          }
-                      }
-                      catch (error) {
-                          return createErrorRender(error)();
-                      }
-                  });
-                  instance.signalWatcher.watch(childrenComputed);
-                  const children = childrenComputed.get();
-                  reconcileChildren(pluginContext, instance, childrenAsElements(children));
-              }
-          }
-          if (instance.needReRender) {
-              let children;
-              try {
-                  if (isValidElement(instance.componentReturnValue)) {
-                      children = instance.componentReturnValue;
-                  }
-                  else {
-                      // 如果是由于父组件导致的子组件渲染
-                      // 直接使用 childrenComputed.get() 将读取到缓存值
-                      // 因此这里使用 childrenRender 来更新 children 的值
-                      children = instance.componentReturnValue();
-                  }
-              }
-              catch (error) {
-                  children = createErrorRender(error)();
-              }
-              reconcileChildren(pluginContext, instance, childrenAsElements(children));
-              delete instance.needReRender;
-          }
-      }
-      // 浏览器组件/标签
-      if (typeof element?.type === 'string') {
-          if ('children' in element.props && Array.isArray(element.props.children)) {
-              reconcileChildren(pluginContext, instance, childrenAsElements(element.props.children));
-          }
-      }
-      // 优先处理 child
-      if (instance.child) {
-          return instance.child;
-      }
-      /**
-       * 递归向上查找可用的兄弟 instance
-       * @param instance
-       * @returns 返回下一个需要处理的兄弟 instance
-       */
-      function returnSibling(instance) {
-          if (instance.sibling) {
-              return instance.sibling;
-          }
-          if (instance.parent) {
-              return returnSibling(instance.parent);
-          }
-          return null;
-      }
-      return returnSibling(instance);
-  }
-
-  function camelToKebab(str) {
-      return str.replace(/([A-Z])/g, (match, p1, offset) => {
-          if (offset === 0) {
-              return p1.toLowerCase();
-          }
-          else {
-              return '-' + p1.toLowerCase();
-          }
-      });
-  }
-  class ServerElement {
-      nodeName;
-      static createTextNode(content) {
-          const dom = new ServerElement('#text');
-          dom.content = content;
-          return dom;
-      }
-      static createComment(content) {
-          const dom = new ServerElement('#comment');
-          dom.content = content;
-          return dom;
-      }
-      static createElement(tag) {
-          return new ServerElement(tag);
-      }
-      constructor(nodeName) {
-          this.nodeName = nodeName;
-          this.style = {};
-          this.content = '';
-          this.children = [];
-          this.className = '';
-          this.attributes = new Map();
-      }
-      firstChild;
-      nextSibling;
-      parentNode;
-      className;
-      style;
-      content;
-      children;
-      attributes;
-      removeChild(dom) {
-          /* eslint-disable @typescript-eslint/ban-ts-comment */
-          const index = this.children.findIndex(v => v === dom);
-          if (index != -1)
-              this.children.splice(index, 1);
-          // @ts-ignore
-          this.firstChild = undefined;
-          // @ts-ignore
-          this.nextSibling = undefined;
-          // @ts-ignore
-          this.parentNode = undefined;
-          /* eslint-enable @typescript-eslint/ban-ts-comment */
-      }
-      appendChild(dom) {
-          /* eslint-disable @typescript-eslint/ban-ts-comment */
-          // @ts-ignore
-          dom.parentNode = this;
-          if (this.children.length > 0) {
-              // @ts-ignore
-              this.children[this.children.length - 1].nextSibling = dom;
-          }
-          // @ts-ignore
-          this.firstChild = this.children[0];
-          this.children.push(dom);
-          /* eslint-enable @typescript-eslint/ban-ts-comment */
-      }
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      setAttribute(name, value) {
-          if (value === '')
-              return this.attributes.delete(name);
-          /* eslint-disable @typescript-eslint/ban-ts-comment */
-          // @ts-ignore
-          if (name === 'class')
-              return this.className = value;
-          // @ts-ignore
-          if (name === 'style')
-              return this.style = value;
-          /* eslint-enable @typescript-eslint/ban-ts-comment */
-          this.attributes.set(name, value);
-      }
-      removeAttribute(name) {
-          this.attributes.delete(name);
-      }
-      toString() {
-          if (this.nodeName === '#text')
-              return this.content;
-          if (this.nodeName === '#comment')
-              return this.content;
-          const styleString = Object.entries(this.style)
-              .map(([key, value]) => `${camelToKebab(key)}:${value}`)
-              .join(';');
-          const attributes = [...this.attributes.entries()];
-          if (styleString.length > 0)
-              attributes.push(['style', styleString]);
-          if (this.className.length > 0)
-              attributes.push(['class', this.className]);
-          const attributesString = attributes.map(([name, value]) => ` ${name}="${value}"`).join('');
-          return `<${this.nodeName}${attributesString}>${this.children.map(child => child.toString()).join('')}</${this.nodeName}>`;
-      }
-  }
-  function render$1(pluginContext, element, onComplete) {
-      const rootInstance = {
-          domRef: ServerElement.createElement('div'),
-          context: new InnerAirxComponentContext()
-      };
-      rootInstance.context.instance = rootInstance;
-      const context = {
-          rootInstance,
-          nextUnitOfWork: null,
-          needCommitDom: false
-      };
-      const appInstance = {
-          element,
-          parent: context.rootInstance,
-          memoProps: { ...element.props },
-          context: new InnerAirxComponentContext()
-      };
-      appInstance.context.instance = appInstance;
-      context.rootInstance.child = appInstance;
-      context.nextUnitOfWork = appInstance;
-      /**
-       * 提交 Dom 变化
-       */
-      function commitDom(rootInstance, rootNode) {
-          const logger = createLogger('commitDom');
-          logger.debug('commitDom', rootInstance);
-          function updateDomProperties(dom, nextProps, prevProps = {}) {
-              const isKey = (key) => key === 'key';
-              const isRef = (key) => key === 'ref';
-              const isStyle = (key) => key === 'style';
-              const isClass = (key) => key === 'class';
-              const isEvent = (key) => key.startsWith("on");
-              const isChildren = (key) => key === 'children';
-              const isGone = (_prev, next) => (key) => !(key in next);
-              const isNew = (prev, next) => (key) => prev[key] !== next[key];
-              const isProperty = (key) => !isChildren(key) && !isEvent(key) && !isStyle(key) && !isClass(key) && !isKey(key) && !isRef(key);
-              // https://developer.mozilla.org/zh-CN/docs/Web/API/Node
-              if (dom.nodeName === '#text' || dom.nodeName === '#comment') {
-                  const textNode = dom;
-                  if (textNode.nodeValue !== nextProps.textContent) {
-                      textNode.nodeValue = String(nextProps.textContent);
-                  }
-                  return;
-              }
-              // remove old style
-              const oldStyle = prevProps?.style;
-              if (typeof oldStyle === 'object' && oldStyle != null) {
-                  Object.keys(oldStyle).forEach(key => {
-                      /* eslint-disable @typescript-eslint/no-explicit-any */
-                      delete dom.style[key];
-                      /* eslint-enable @typescript-eslint/no-explicit-any */
-                  });
-              }
-              // add new style
-              const newStyle = nextProps?.style;
-              if (typeof newStyle === 'object' && newStyle != null) {
-                  Object.keys(newStyle).forEach((key) => {
-                      /* eslint-disable @typescript-eslint/no-explicit-any */
-                      const value = newStyle?.[key];
-                      dom.style[key] = value == null ? '' : value;
-                      /* eslint-enable @typescript-eslint/no-explicit-any */
-                  });
-              }
-              if (dom.className !== nextProps?.class) {
-                  if (!nextProps?.class) {
-                      dom.removeAttribute('class');
-                  }
-                  else if (typeof nextProps?.class === 'string') {
-                      dom.setAttribute('class', nextProps?.class);
-                  }
-              }
-              // Remove old properties
-              Object.keys(prevProps)
-                  .filter(isProperty)
-                  .filter(isGone(prevProps, nextProps))
-                  .forEach(name => dom.removeAttribute(name));
-              // Set new or changed properties
-              Object.keys(nextProps)
-                  .filter(isProperty)
-                  .filter(isNew(prevProps, nextProps))
-                  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                  .forEach(name => dom.setAttribute(name, nextProps[name]));
-          }
-          function getParentDom(instance) {
-              if (instance.parent?.domRef != null) {
-                  return instance.parent.domRef;
-              }
-              if (instance.parent) {
-                  return getParentDom(instance.parent);
-              }
-              throw new Error('Cant find dom');
-          }
-          /**
-           * 查找 instance 下所有的一级 dom
-           * @param instance
-           * @returns
-           */
-          function getChildDoms(instance) {
-              const domList = [];
-              const todoList = [instance];
-              while (todoList.length > 0) {
-                  const current = todoList.pop();
-                  // 找到真实 dom 直接提交
-                  if (current?.domRef != null) {
-                      domList.push(current.domRef);
-                  }
-                  // 有子节点但是无真实 dom，向下继续查找
-                  if (current?.domRef == null) {
-                      if (current?.child != null) {
-                          todoList.push(current.child);
-                      }
-                  }
-                  // 可能有兄弟节点，则需要继续查找
-                  if (current?.sibling != null) {
-                      todoList.push(current.sibling);
-                  }
-              }
-              return domList;
-          }
-          function commitInstanceDom(nextInstance, oldNode) {
-              // 移除标删元素
-              if (nextInstance.deletions) {
-                  for (const deletion of nextInstance.deletions) {
-                      const domList = getChildDoms(deletion);
-                      for (let index = 0; index < domList.length; index++) {
-                          const dom = domList[index];
-                          if (dom && dom.parentNode)
-                              dom.parentNode.removeChild(dom);
-                      }
-                      deletion.context.triggerUnmounted();
-                  }
-                  nextInstance.deletions.clear();
-              }
-              // 创建 dom
-              if (nextInstance.domRef == null) {
-                  if (nextInstance.element == null)
-                      throw new Error('???');
-                  if (typeof nextInstance.element.type === 'string') {
-                      if (nextInstance.element.type === 'text') {
-                          const textContent = nextInstance.element.props.textContent;
-                          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                          nextInstance.domRef = ServerElement.createTextNode(textContent);
-                      }
-                      else if (nextInstance.element.type === 'comment') {
-                          const textContent = nextInstance.element.props.textContent;
-                          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                          nextInstance.domRef = ServerElement.createComment(textContent);
-                      }
-                      else {
-                          nextInstance.domRef = ServerElement.createElement(nextInstance.element.type);
-                      }
-                  }
-              }
-              // 更新属性
-              if (nextInstance.domRef != null && nextInstance.element != null) {
-                  updateDomProperties(nextInstance.domRef, nextInstance.element.props, nextInstance.beforeElement?.props);
-              }
-              // 插入 parent
-              // TODO: 针对仅移动时优化
-              if (nextInstance.domRef != null) {
-                  if (oldNode !== nextInstance.domRef) {
-                      if (nextInstance.domRef.parentNode) {
-                          nextInstance.domRef.parentNode.removeChild(nextInstance.domRef);
-                      }
-                      const parentDom = getParentDom(nextInstance);
-                      parentDom.appendChild(nextInstance.domRef);
-                  }
-              }
-          }
-          function commitWalkV2(initInstance, initNode) {
-              // 创建一个栈，将根节点压入栈中
-              const stack = [[initInstance, initNode]];
-              while (stack.length > 0) {
-                  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                  const stackLayer = stack.pop();
-                  if (typeof stackLayer === 'function') {
-                      stackLayer();
-                      continue;
-                  }
-                  const [instance, node] = stackLayer;
-                  commitInstanceDom(instance, node);
-                  // stack 是先入后出
-                  // 实际上是先渲染 child
-                  // 这里然后再渲染 sibling
-                  // 执行生命周期的 Mount
-                  stack.push(() => instance.context.triggerMounted());
-                  // 更新下一个兄弟节点
-                  if (instance.sibling != null) {
-                      const siblingNode = instance.domRef
-                          ? instance.domRef.nextSibling
-                          : node?.nextSibling;
-                      stack.push([instance.sibling, siblingNode || undefined]);
-                  }
-                  // 更新下一个子节点
-                  if (instance.child != null) {
-                      const childNode = instance.domRef
-                          ? instance.domRef.firstChild
-                          : node;
-                      stack.push([instance.child, childNode || undefined]);
-                  }
-              }
-          }
-          commitWalkV2(rootInstance, rootNode);
-      }
-      while (context.nextUnitOfWork) {
-          context.nextUnitOfWork = performUnitOfWork(pluginContext, context.nextUnitOfWork);
-      }
-      commitDom(context.rootInstance.child, context.rootInstance.domRef?.firstChild || undefined);
-      onComplete(context.rootInstance.domRef?.toString() || '');
-  }
-
-  function render(pluginContext, element, domRef) {
-      const rootInstance = {
-          domRef,
-          context: new InnerAirxComponentContext()
-      };
-      rootInstance.context.instance = rootInstance;
-      const context = {
-          rootInstance,
-          nextUnitOfWork: null,
-          needCommitDom: false
-      };
-      const appInstance = {
-          element,
-          parent: context.rootInstance,
-          memoProps: { ...element.props },
-          context: new InnerAirxComponentContext()
-      };
-      appInstance.context.instance = appInstance;
-      context.rootInstance.child = appInstance;
-      context.nextUnitOfWork = appInstance;
-      /**
-       * 提交 Dom 变化
-       */
-      function commitDom(rootInstance, rootNode) {
-          const logger = createLogger('commitDom');
-          logger.debug('commitDom', rootInstance);
-          function updateDomProperties(dom, nextProps, prevProps = {}) {
-              for (const plugin of pluginContext.plugins) {
-                  if (plugin.updateDom)
-                      plugin.updateDom(dom, nextProps, prevProps);
-              }
-          }
-          function getParentDom(instance) {
-              if (instance.parent?.domRef != null) {
-                  return instance.parent.domRef;
-              }
-              if (instance.parent) {
-                  return getParentDom(instance.parent);
-              }
-              throw new Error('Cant find dom');
-          }
-          /**
-           * 查找 instance 下所有的一级 dom
-           * @param instance
-           * @returns
-           */
-          function getChildDoms(instance) {
-              const domList = [];
-              const todoList = [instance];
-              while (todoList.length > 0) {
-                  const current = todoList.pop();
-                  // 找到真实 dom 直接提交
-                  if (current?.domRef != null) {
-                      domList.push(current.domRef);
-                  }
-                  // 有子节点但是无真实 dom，向下继续查找
-                  if (current?.domRef == null) {
-                      if (current?.child != null) {
-                          todoList.push(current.child);
-                      }
-                  }
-                  // 可能有兄弟节点，则需要继续查找
-                  if (current?.sibling != null) {
-                      todoList.push(current.sibling);
-                  }
-              }
-              return domList;
-          }
-          function commitInstanceDom(nextInstance, oldNode) {
-              // 移除标删元素
-              if (nextInstance.deletions) {
-                  for (const deletion of nextInstance.deletions) {
-                      const domList = getChildDoms(deletion);
-                      for (let index = 0; index < domList.length; index++) {
-                          const dom = domList[index];
-                          if (dom && dom.parentNode)
-                              dom.parentNode.removeChild(dom);
-                      }
-                      deletion.context.triggerUnmounted();
-                  }
-                  nextInstance.deletions.clear();
-              }
-              // 创建 dom
-              if (nextInstance.domRef == null) {
-                  if (nextInstance.element == null)
-                      throw new Error('???');
-                  if (typeof nextInstance.element.type === 'string') {
-                      if (nextInstance.element.type === 'text') {
-                          const textContent = nextInstance.element.props.textContent;
-                          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                          nextInstance.domRef = document.createTextNode(textContent);
-                      }
-                      else if (nextInstance.element.type === 'comment') {
-                          const textContent = nextInstance.element.props.textContent;
-                          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                          nextInstance.domRef = document.createComment(textContent);
-                      }
-                      else {
-                          nextInstance.domRef = nextInstance.elementNamespace
-                              ? document.createElementNS(nextInstance.elementNamespace, nextInstance.element.type)
-                              : document.createElement(nextInstance.element.type);
-                      }
-                      if (nextInstance.domRef) {
-                          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                          nextInstance.domRef.airxInstance = nextInstance;
-                      }
-                  }
-              }
-              // 更新属性
-              if (nextInstance.domRef != null && nextInstance.element != null) {
-                  updateDomProperties(nextInstance.domRef, nextInstance.element.props, nextInstance.beforeElement?.props);
-              }
-              // 插入 parent
-              // TODO: 针对仅移动时优化
-              if (nextInstance.domRef != null) {
-                  if (oldNode !== nextInstance.domRef) {
-                      if (nextInstance.domRef.parentNode) {
-                          nextInstance.domRef.parentNode.removeChild(nextInstance.domRef);
-                      }
-                      const parentDom = getParentDom(nextInstance);
-                      parentDom.appendChild(nextInstance.domRef);
-                  }
-              }
-          }
-          function commitWalkV2(initInstance, initNode) {
-              // 创建一个栈，将根节点压入栈中
-              const stack = [[initInstance, initNode]];
-              while (stack.length > 0) {
-                  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                  const stackLayer = stack.pop();
-                  if (typeof stackLayer === 'function') {
-                      stackLayer();
-                      continue;
-                  }
-                  const [instance, node] = stackLayer;
-                  commitInstanceDom(instance, node);
-                  // stack 是先入后出
-                  // 实际上是先渲染 child
-                  // 这里然后再渲染 sibling
-                  // 执行生命周期的 Mount
-                  stack.push(() => instance.context.triggerMounted());
-                  // 更新下一个兄弟节点
-                  if (instance.sibling != null) {
-                      const siblingNode = instance.domRef
-                          ? instance.domRef.nextSibling
-                          : node?.nextSibling;
-                      stack.push([instance.sibling, siblingNode || undefined]);
-                  }
-                  // 更新下一个子节点
-                  if (instance.child != null) {
-                      const childNode = instance.domRef
-                          ? instance.domRef.firstChild
-                          : node;
-                      stack.push([instance.child, childNode || undefined]);
-                  }
-              }
-          }
-          commitWalkV2(rootInstance, rootNode);
-      }
-      function onUpdateRequire() {
-          if (context.nextUnitOfWork == null && context.rootInstance.child) {
-              context.nextUnitOfWork = context.rootInstance.child;
-          }
-      }
-      /**
-       * 调度
-       */
-      function workLoop(deadline) {
-          let shouldYield = false;
-          const logger = createLogger('workLoop');
-          while (context.nextUnitOfWork && !shouldYield) {
-              logger.debug('nextUnitOfWork', context.nextUnitOfWork);
-              context.nextUnitOfWork = performUnitOfWork(pluginContext, context.nextUnitOfWork, onUpdateRequire);
-              if (context.nextUnitOfWork == null)
-                  context.needCommitDom = true;
-              if (deadline)
-                  shouldYield = deadline.timeRemaining() < 1;
-          }
-          if (context.needCommitDom && context.rootInstance.child) {
-              commitDom(context.rootInstance.child, context.rootInstance.domRef?.firstChild || undefined);
-              context.needCommitDom = false;
-          }
-          // TODO: 兼容性
-          requestIdleCallback(workLoop);
-      }
-      // 开始调度
-      workLoop();
-      return context.rootInstance;
-  }
-
-  class BasicLogic {
-      logger = createLogger('basicLogicPlugin');
-      isSameProps(preProps, nextProps) {
-          if (Object.is(nextProps, preProps)) {
-              return true;
-          }
-          if (typeof preProps !== 'object'
-              || typeof nextProps !== 'object'
-              || preProps === null
-              || nextProps === null) {
-              this.logger.debug('props must be an object');
-              return false;
-          }
-          // 对应 key 的值不相同返回 false
-          const prevKeys = Object.keys(preProps);
-          for (let index = 0; index < prevKeys.length; index++) {
-              const key = prevKeys[index];
-              if (key !== 'children' && key !== 'key') {
-                  if (!Object.hasOwn(nextProps, key))
-                      return false;
-                  if (!Object.is(preProps[key], nextProps[key]))
-                      return false;
-              }
-              if (key === 'children') {
-                  const prevChildren = preProps['children'];
-                  const nextChildren = nextProps['children'];
-                  // children 都是空的，则无需更新
-                  if (prevChildren.length === 0 && nextChildren.length === 0)
-                      return true;
-                  // 简单比较一下 child 的引用
-                  for (let index = 0; index < prevChildren.length; index++) {
-                      const prevChild = prevChildren[index];
-                      const nextChild = nextChildren[index];
-                      if (prevChild !== nextChild)
-                          return false;
-                      if (typeof prevChild !== typeof nextChild)
-                          return false;
-                  }
-              }
-              return true;
-          }
-          return false;
-      }
-      isReRender(instance) {
-          const nextProps = instance.element?.props;
-          const preProps = instance.beforeElement?.props;
-          if (!this.isSameProps(preProps, nextProps))
-              return true;
-      }
-      updateDom(dom, nextProps, prevProps = {}) {
-          this.logger.debug('updateDom', dom, nextProps, prevProps);
-          const isKey = (key) => key === 'key';
-          const isRef = (key) => key === 'ref';
-          const isStyle = (key) => key === 'style';
-          const isClass = (key) => key === 'class';
-          const isEvent = (key) => key.startsWith("on");
-          const isChildren = (key) => key === 'children';
-          const isGone = (_prev, next) => (key) => !(key in next);
-          const isNew = (prev, next) => (key) => prev[key] !== next[key];
-          const isProperty = (key) => !isChildren(key) && !isEvent(key) && !isStyle(key) && !isClass(key) && !isKey(key) && !isRef(key);
-          // https://developer.mozilla.org/zh-CN/docs/Web/API/Node
-          if (dom.nodeName === '#text' || dom.nodeName === '#comment') {
-              const textNode = dom;
-              if (textNode.nodeValue !== nextProps.textContent) {
-                  textNode.nodeValue = String(nextProps.textContent);
-              }
-              return;
-          }
-          // remove old style
-          const oldStyle = prevProps?.style;
-          if (typeof oldStyle === 'object' && oldStyle != null) {
-              if (!('style' in dom) || !dom.style)
-                  return;
-              Object.keys(oldStyle).forEach(key => {
-                  /* eslint-disable @typescript-eslint/no-explicit-any */
-                  if ('style' in dom && dom.style) {
-                      delete dom.style[key];
-                      /* eslint-enable @typescript-eslint/no-explicit-any */
-                  }
-              });
-          }
-          // add new style
-          const newStyle = nextProps?.style;
-          if (typeof newStyle === 'object' && newStyle != null) {
-              if (!('style' in dom) || !dom.style)
-                  return;
-              Object.keys(newStyle).forEach((key) => {
-                  /* eslint-disable @typescript-eslint/no-explicit-any */
-                  const value = newStyle?.[key];
-                  dom.style[key] = value == null ? '' : value;
-                  /* eslint-enable @typescript-eslint/no-explicit-any */
-              });
-          }
-          if (dom.className !== nextProps?.class) {
-              if (!nextProps?.class) {
-                  dom.removeAttribute('class');
-              }
-              else if (typeof nextProps?.class === 'string') {
-                  dom.setAttribute('class', nextProps?.class);
-              }
-          }
-          //Remove old or changed event listeners
-          Object.keys(prevProps)
-              .filter(isEvent)
-              .filter(key => !(key in nextProps) ||
-              isNew(prevProps, nextProps)(key))
-              .forEach(name => {
-              const eventType = name
-                  .toLowerCase()
-                  .substring(2);
-              if (prevProps[name] == null)
-                  return;
-              if (typeof prevProps[name] !== 'function') {
-                  console.error('EventListener is not a function');
-              }
-              else {
-                  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                  dom.removeEventListener(eventType, prevProps[name]);
-              }
-          });
-          // Add event listeners
-          Object.keys(nextProps)
-              .filter(isEvent)
-              .filter(isNew(prevProps, nextProps))
-              .forEach(name => {
-              const eventType = name
-                  .toLowerCase()
-                  .substring(2);
-              if (nextProps[name] == null)
-                  return;
-              if (typeof nextProps[name] !== 'function') {
-                  console.error('EventListener is not a function');
-              }
-              else {
-                  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                  dom.addEventListener(eventType, nextProps[name]);
-              }
-          });
-          // Remove old properties
-          Object.keys(prevProps)
-              .filter(isProperty)
-              .filter(isGone(prevProps, nextProps))
-              .forEach(name => dom.removeAttribute(name));
-          // Set new or changed properties
-          Object.keys(nextProps)
-              .filter(isProperty)
-              .filter(isNew(prevProps, nextProps))
-              // eslint-disable-next-line @typescript-eslint/no-explicit-any
-              .forEach(name => dom.setAttribute(name, nextProps[name]));
-      }
-      isReuseInstance(instance, nextElement) {
-          if (instance && instance.element && instance.element.type !== nextElement.type) {
-              return false;
-          }
-      }
-  }
-
-  class InjectSystem {
-      getProvideValueForParent(instance, key) {
-          if (instance && instance.context) {
-              const value = instance.context.providedMap.get(key);
-              if (value != undefined)
-                  return value;
-              if (instance.parent) {
-                  return this.getProvideValueForParent(instance.parent, key);
-              }
-          }
-          return undefined;
-      }
-      isReuseInstance(instance) {
-          const injectedKeys = [...instance.context.injectedMap.keys()];
-          for (let index = 0; index < injectedKeys.length; index++) {
-              const key = injectedKeys[index];
-              const currentValue = instance.context.injectedMap.get(key);
-              const parentValue = this.getProvideValueForParent(instance.parent, key);
-              // 如果发现任何值发生变化，则重建实例
-              if (parentValue !== currentValue)
-                  return false;
-          }
-      }
-  }
-
-  class PluginContext {
-      plugins = [
-          new BasicLogic(),
-          new InjectSystem()
-      ];
-      registerPlugin(...plugins) {
-          this.plugins.push(...plugins);
-      }
-  }
-
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  function createApp(element) {
-      const appContext = new PluginContext();
-      const ensureAsElement = (element) => {
-          if (typeof element === 'function') {
-              return createElement(element, {});
-          }
-          return element;
-      };
-      const app = {
-          plugin: (...plugins) => {
-              appContext.registerPlugin(...plugins);
-              return app;
-          },
-          mount: (container) => {
-              container.innerHTML = ''; // 先清空再说
-              render(appContext, ensureAsElement(element), container);
-              return app;
-          },
-          renderToHTML: () => {
-              return new Promise(resolve => {
-                  render$1(appContext, ensureAsElement(element), resolve);
-              });
-          }
-      };
-      return app;
-  }
-
-  exports.Fragment = Fragment;
-  exports.component = component;
-  exports.createApp = createApp;
-  exports.createElement = createElement;
-  exports.inject = inject;
-  exports.onMounted = onMounted;
-  exports.onUnmounted = onUnmounted;
-  exports.provide = provide;
-
-}));
-//# sourceMappingURL=index.js.map