@ibiz-template/vue3-components 0.0.1-alpha.1

package/es/common/app-icon/app-icon.d.ts

@@ -0,0 +1,19 @@
+import { PropType, VNode } from 'vue';
+export declare const AppIcon: import("vue").DefineComponent<{
+    icon: {
+        type: PropType<ISysImage>;
+    };
+    size: {
+        type: PropType<"small" | "medium" | "large">;
+    };
+}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    icon: {
+        type: PropType<ISysImage>;
+    };
+    size: {
+        type: PropType<"small" | "medium" | "large">;
+    };
+}>>, {}>;
+export default AppIcon;

package/es/common/app-icon/app-icon.js

@@ -0,0 +1,71 @@
+import { defineComponent, computed, createVNode, resolveComponent } from "vue";
+import { useNamespace } from "@ibiz-template/vue3-util";
+const AppIcon = /* @__PURE__ */ defineComponent({
+  name: "AppIcon",
+  props: {
+    icon: {
+      type: Object
+    },
+    size: {
+      type: String
+    }
+  },
+  setup(props) {
+    const ns = useNamespace("icon");
+    const BaseUrl = `${ibiz.env.assetsUrl}/img/`;
+    function getContent(icon) {
+      if (icon) {
+        if (icon.cssClass) {
+          if (icon.cssClass.indexOf("fa-") !== -1) {
+            return createVNode("i", {
+              "class": [ns.b(), icon.cssClass]
+            }, null);
+          }
+          return createVNode(resolveComponent("ion-icon"), {
+            "class": ns.b(),
+            "name": icon.cssClass
+          }, null);
+        }
+        if (icon.imagePath) {
+          if (icon.imagePath.endsWith("svg")) {
+            if (icon.imagePath.startsWith("http")) {
+              return createVNode(resolveComponent("ion-icon"), {
+                "class": ns.b(),
+                "src": icon.imagePath
+              }, null);
+            }
+            return createVNode(resolveComponent("ion-icon"), {
+              "src": BaseUrl + icon.imagePath,
+              "class": ns.b()
+            }, null);
+          }
+          if (icon.imagePath.startsWith("http")) {
+            return createVNode("img", {
+              "class": ns.b(),
+              "src": icon.imagePath
+            }, null);
+          }
+          return createVNode("img", {
+            "class": ns.b(),
+            "src": BaseUrl + icon.imagePath
+          }, null);
+        }
+        if (icon.rawContent) {
+          return createVNode("img", {
+            "class": ns.b(),
+            "src": icon.rawContent
+          }, null);
+        }
+      }
+      return null;
+    }
+    const content = computed(() => {
+      return getContent(props.icon);
+    });
+    return () => content.value;
+  }
+});
+export {
+  AppIcon,
+  AppIcon as default
+};

package/es/common/app-keep-alive/app-keep-alive.d.ts

@@ -0,0 +1,47 @@
+import { ComponentInternalInstance, ConcreteComponent, TransitionHooks, VNode, VNodeProps } from 'vue';
+import { queuePostFlushCb } from './scheduler';
+export declare const enum ShapeFlags {
+    ELEMENT = 1,
+    FUNCTIONAL_COMPONENT = 2,
+    STATEFUL_COMPONENT = 4,
+    TEXT_CHILDREN = 8,
+    ARRAY_CHILDREN = 16,
+    SLOTS_CHILDREN = 32,
+    TELEPORT = 64,
+    SUSPENSE = 128,
+    COMPONENT_SHOULD_KEEP_ALIVE = 256,
+    COMPONENT_KEPT_ALIVE = 512,
+    COMPONENT = 6
+}
+export declare const enum MoveType {
+    ENTER = 0,
+    LEAVE = 1,
+    REORDER = 2
+}
+export interface ComponentRenderContext {
+    [key: string]: any;
+    _: ComponentInternalInstance;
+}
+type MatchPattern = string | RegExp | (string | RegExp)[];
+export interface KeepAliveProps {
+    keyList: string[];
+    include?: MatchPattern;
+    exclude?: MatchPattern;
+    max?: number | string;
+}
+export declare const isKeepAlive: (vnode: VNode) => boolean;
+export declare const AppKeepAlive: {
+    new (): {
+        $props: VNodeProps & KeepAliveProps;
+    };
+    __isKeepAlive: true;
+};
+export declare const getComponentName: (Component: ConcreteComponent, includeInferred?: boolean) => string | false | undefined;
+export declare const isFunction: (val: unknown) => val is Function;
+export declare const isAsyncWrapper: (i: ComponentInternalInstance | VNode) => boolean;
+export declare function setTransitionHooks(vnode: VNode, hooks: TransitionHooks): void;
+export declare const invokeArrayFns: (fns: Function[], arg?: any) => void;
+export declare const queuePostRenderEffect: typeof queuePostFlushCb;
+export declare function invokeVNodeHook(hook: any, instance: ComponentInternalInstance | null, vnode: VNode, prevVNode?: VNode | null): void;
+export declare const devtoolsComponentAdded: (component: ComponentInternalInstance) => void;
+export {};

package/es/common/app-keep-alive/app-keep-alive.js

@@ -0,0 +1,297 @@
+import { callWithAsyncErrorHandling, getCurrentInstance, watch, onMounted, onUpdated, onBeforeUnmount, isVNode, cloneVNode } from "vue";
+import { queuePostFlushCb } from "./scheduler";
+var ShapeFlags = /* @__PURE__ */ ((ShapeFlags2) => {
+  ShapeFlags2[ShapeFlags2["ELEMENT"] = 1] = "ELEMENT";
+  ShapeFlags2[ShapeFlags2["FUNCTIONAL_COMPONENT"] = 2] = "FUNCTIONAL_COMPONENT";
+  ShapeFlags2[ShapeFlags2["STATEFUL_COMPONENT"] = 4] = "STATEFUL_COMPONENT";
+  ShapeFlags2[ShapeFlags2["TEXT_CHILDREN"] = 8] = "TEXT_CHILDREN";
+  ShapeFlags2[ShapeFlags2["ARRAY_CHILDREN"] = 16] = "ARRAY_CHILDREN";
+  ShapeFlags2[ShapeFlags2["SLOTS_CHILDREN"] = 32] = "SLOTS_CHILDREN";
+  ShapeFlags2[ShapeFlags2["TELEPORT"] = 64] = "TELEPORT";
+  ShapeFlags2[ShapeFlags2["SUSPENSE"] = 128] = "SUSPENSE";
+  ShapeFlags2[ShapeFlags2["COMPONENT_SHOULD_KEEP_ALIVE"] = 256] = "COMPONENT_SHOULD_KEEP_ALIVE";
+  ShapeFlags2[ShapeFlags2["COMPONENT_KEPT_ALIVE"] = 512] = "COMPONENT_KEPT_ALIVE";
+  ShapeFlags2[ShapeFlags2["COMPONENT"] = 6] = "COMPONENT";
+  return ShapeFlags2;
+})(ShapeFlags || {});
+var MoveType = /* @__PURE__ */ ((MoveType2) => {
+  MoveType2[MoveType2["ENTER"] = 0] = "ENTER";
+  MoveType2[MoveType2["LEAVE"] = 1] = "LEAVE";
+  MoveType2[MoveType2["REORDER"] = 2] = "REORDER";
+  return MoveType2;
+})(MoveType || {});
+const isKeepAlive = (vnode) => vnode.type.__isKeepAlive;
+const KeepAliveImpl = {
+  name: `AppKeepAlive`,
+  // Marker for special handling inside the renderer. We are not using a ===
+  // check directly on KeepAlive in the renderer, because importing it directly
+  // would prevent it from being tree-shaken.
+  __isKeepAlive: true,
+  props: {
+    include: [String, RegExp, Array],
+    exclude: [String, RegExp, Array],
+    max: [String, Number],
+    keyList: [Array]
+  },
+  setup(props, { slots }) {
+    const instance = getCurrentInstance();
+    const sharedContext = instance.ctx;
+    const cache = /* @__PURE__ */ new Map();
+    const keys = /* @__PURE__ */ new Set();
+    let current = null;
+    {
+      instance.__v_cache = cache;
+    }
+    const parentSuspense = instance.suspense;
+    const {
+      renderer: {
+        p: patch,
+        m: move,
+        um: _unmount,
+        o: { createElement }
+      }
+    } = sharedContext;
+    const storageContainer = createElement("div");
+    sharedContext.activate = (vnode, container, anchor, isSVG, optimized) => {
+      const instance2 = vnode.component;
+      move(vnode, container, anchor, 0, parentSuspense);
+      patch(
+        instance2.vnode,
+        vnode,
+        container,
+        anchor,
+        instance2,
+        parentSuspense,
+        isSVG,
+        vnode.slotScopeIds,
+        optimized
+      );
+      queuePostRenderEffect(() => {
+        instance2.isDeactivated = false;
+        if (instance2.a) {
+          invokeArrayFns(instance2.a);
+        }
+        const vnodeHook = vnode.props && vnode.props.onVnodeMounted;
+        if (vnodeHook) {
+          invokeVNodeHook(vnodeHook, instance2.parent, vnode);
+        }
+      });
+      {
+        devtoolsComponentAdded(instance2);
+      }
+    };
+    sharedContext.deactivate = (vnode) => {
+      const instance2 = vnode.component;
+      move(vnode, storageContainer, null, 1, parentSuspense);
+      queuePostRenderEffect(() => {
+        if (instance2.da) {
+          invokeArrayFns(instance2.da);
+        }
+        const vnodeHook = vnode.props && vnode.props.onVnodeUnmounted;
+        if (vnodeHook) {
+          invokeVNodeHook(vnodeHook, instance2.parent, vnode);
+        }
+        instance2.isDeactivated = true;
+      });
+      {
+        devtoolsComponentAdded(instance2);
+      }
+    };
+    function unmount(vnode) {
+      resetShapeFlag(vnode);
+      _unmount(vnode, instance, parentSuspense, true);
+    }
+    function pruneCache(filter) {
+      cache.forEach((vnode, key) => {
+        const name = getComponentName(vnode.type);
+        if (name && (!filter || !filter(name))) {
+          pruneCacheEntry(key);
+        }
+      });
+    }
+    function pruneCache2(filter) {
+      cache.forEach((vnode, key) => {
+        const name = vnode.key;
+        if (name && (filter && filter(name))) {
+          pruneCacheEntry(key);
+        }
+      });
+    }
+    function pruneCacheEntry(key) {
+      const cached = cache.get(key);
+      if (!current || cached.type !== current.type) {
+        unmount(cached);
+      } else if (current) {
+        resetShapeFlag(current);
+      }
+      cache.delete(key);
+      keys.delete(key);
+    }
+    watch(
+      () => [props.include, props.exclude, props.keyList],
+      ([include, exclude, keyList]) => {
+        include && pruneCache((name) => matches(include, name));
+        exclude && pruneCache((name) => !matches(exclude, name));
+        keyList && pruneCache2((name) => !matches(keyList, name));
+      },
+      // prune post-render after `current` has been updated
+      { flush: "post", deep: true }
+    );
+    let pendingCacheKey = null;
+    const cacheSubtree = () => {
+      if (pendingCacheKey != null) {
+        cache.set(pendingCacheKey, getInnerChild(instance.subTree));
+      }
+    };
+    onMounted(cacheSubtree);
+    onUpdated(cacheSubtree);
+    onBeforeUnmount(() => {
+      for (const key in cache) {
+        pruneCacheEntry(key);
+      }
+    });
+    return () => {
+      pendingCacheKey = null;
+      if (!slots.default) {
+        return null;
+      }
+      const children = slots.default();
+      const rawVNode = children[0];
+      if (children.length > 1) {
+        console.log(`KeepAlive should contain exactly one component child.`);
+        current = null;
+        return children;
+      }
+      if (!isVNode(rawVNode) || !(rawVNode.shapeFlag & 4) && !(rawVNode.shapeFlag & 128)) {
+        current = null;
+        return rawVNode;
+      }
+      let vnode = getInnerChild(rawVNode);
+      const comp = vnode.type;
+      const name = getComponentName(
+        isAsyncWrapper(vnode) ? vnode.type.__asyncResolved || {} : comp
+      );
+      const { include, exclude, max, keyList } = props;
+      const slotKey = vnode.key;
+      if (
+        // 包括并且不匹配的
+        include && (!name || !matches(include, name)) || // 排除并且匹配的
+        exclude && name && matches(exclude, name) || // keyList中存在并且不匹配的
+        keyList && !slotKey && !matches(keyList, slotKey)
+      ) {
+        current = vnode;
+        return rawVNode;
+      }
+      const key = vnode.key == null ? comp : vnode.key;
+      const cachedVNode = cache.get(key);
+      if (vnode.el) {
+        vnode = cloneVNode(vnode);
+        if (rawVNode.shapeFlag & 128) {
+          rawVNode.ssContent = vnode;
+        }
+      }
+      pendingCacheKey = key;
+      if (cachedVNode) {
+        vnode.el = cachedVNode.el;
+        vnode.component = cachedVNode.component;
+        if (vnode.transition) {
+          setTransitionHooks(vnode, vnode.transition);
+        }
+        vnode.shapeFlag |= 512;
+        keys.delete(key);
+        keys.add(key);
+      } else {
+        keys.add(key);
+        if (max && keys.size > parseInt(max, 10)) {
+          pruneCacheEntry(keys.values().next().value);
+        }
+      }
+      vnode.shapeFlag |= 256;
+      current = vnode;
+      vnode.keepAlive = true;
+      vnode.curPath = slotKey;
+      return vnode;
+    };
+  }
+};
+const AppKeepAlive = KeepAliveImpl;
+function matches(pattern, name) {
+  if (Array.isArray(pattern)) {
+    return pattern.indexOf(name) > -1;
+  }
+  if (typeof pattern === "string") {
+    return pattern.split(",").includes(name);
+  }
+  if (isRegExp(pattern)) {
+    return pattern.test(name);
+  }
+  return false;
+}
+function resetShapeFlag(vnode) {
+  vnode.shapeFlag &= ~256;
+  vnode.shapeFlag &= ~512;
+}
+function getInnerChild(vnode) {
+  return vnode.shapeFlag & 128 ? vnode.ssContent : vnode;
+}
+function isRegExp(v) {
+  return Object.prototype.toString.call(v) === "[object RegExp]";
+}
+const getComponentName = (Component, includeInferred = true) => {
+  return isFunction(Component) ? Component.displayName || Component.name : Component.name || includeInferred && Component.__name;
+};
+const isFunction = (val) => typeof val === "function";
+const isAsyncWrapper = (i) => !!i.type.__asyncLoader;
+function setTransitionHooks(vnode, hooks) {
+  if (vnode.shapeFlag & 6 && vnode.component) {
+    setTransitionHooks(vnode.component.subTree, hooks);
+  } else {
+    vnode.transition = hooks;
+  }
+}
+const invokeArrayFns = (fns, arg) => {
+  for (let i = 0; i < fns.length; i++) {
+    fns[i](arg);
+  }
+};
+const queuePostRenderEffect = queuePostFlushCb;
+function invokeVNodeHook(hook, instance, vnode, prevVNode = null) {
+  callWithAsyncErrorHandling(hook, instance, 7, [
+    vnode,
+    prevVNode
+  ]);
+}
+const devtoolsComponentAdded = /* @__PURE__ */ createDevtoolsComponentHook(
+  "component:added"
+  /* COMPONENT_ADDED */
+);
+function createDevtoolsComponentHook(hook) {
+  return (component) => {
+    emit(
+      hook,
+      component.appContext.app,
+      component.uid,
+      component.parent ? component.parent.uid : void 0,
+      component
+    );
+  };
+}
+function emit(event, ...args) {
+  if (window.__VUE_DEVTOOLS_GLOBAL_HOOK__) {
+    window.__VUE_DEVTOOLS_GLOBAL_HOOK__.emit(event, ...args);
+  }
+}
+export {
+  AppKeepAlive,
+  MoveType,
+  ShapeFlags,
+  devtoolsComponentAdded,
+  getComponentName,
+  invokeArrayFns,
+  invokeVNodeHook,
+  isAsyncWrapper,
+  isFunction,
+  isKeepAlive,
+  queuePostRenderEffect,
+  setTransitionHooks
+};

package/es/common/app-keep-alive/scheduler.d.ts

@@ -0,0 +1,39 @@
+import { ComponentInternalInstance } from 'vue';
+export declare const NOOP: () => void;
+export interface SchedulerJob extends Function {
+    id?: number;
+    pre?: boolean;
+    active?: boolean;
+    computed?: boolean;
+    /**
+     * Indicates whether the effect is allowed to recursively trigger itself
+     * when managed by the scheduler.
+     *
+     * By default, a job cannot trigger itself because some built-in method calls,
+     * e.g. Array.prototype.push actually performs reads as well (#1740) which
+     * can lead to confusing infinite loops.
+     * The allowed cases are component update functions and watch callbacks.
+     * Component update functions may update child component props, which in turn
+     * trigger flush: "pre" watch callbacks that mutates state that the parent
+     * relies on (#1801). Watch callbacks doesn't track its dependencies so if it
+     * triggers itself again, it's likely intentional and it is the user's
+     * responsibility to perform recursive state mutation that eventually
+     * stabilizes (#1727).
+     */
+    allowRecurse?: boolean;
+    /**
+     * Attached by renderer.ts when setting up a component's render effect
+     * Used to obtain component information when reporting max recursive updates.
+     * dev only.
+     */
+    ownerInstance?: ComponentInternalInstance;
+}
+export type SchedulerJobs = SchedulerJob | SchedulerJob[];
+type CountMap = Map<SchedulerJob, number>;
+export declare function nextTick<T = void>(this: T, fn?: () => void): Promise<void>;
+export declare function queueJob(job: SchedulerJob): void;
+export declare function invalidateJob(job: SchedulerJob): void;
+export declare function queuePostFlushCb(cb: SchedulerJobs): void;
+export declare function flushPreFlushCbs(seen?: CountMap, i?: number): void;
+export declare function flushPostFlushCbs(seen?: CountMap): void;
+export {};

package/es/common/app-keep-alive/scheduler.js

@@ -0,0 +1,171 @@
+import { callWithErrorHandling } from "vue";
+import { getComponentName } from "./app-keep-alive";
+const __DEV__ = true;
+const NOOP = () => {
+};
+let isFlushing = false;
+let isFlushPending = false;
+const queue = [];
+let flushIndex = 0;
+const pendingPostFlushCbs = [];
+let activePostFlushCbs = null;
+let postFlushIndex = 0;
+const resolvedPromise = /* @__PURE__ */ Promise.resolve();
+let currentFlushPromise = null;
+const RECURSION_LIMIT = 100;
+function nextTick(fn) {
+  const p = currentFlushPromise || resolvedPromise;
+  return fn ? p.then(this ? fn.bind(this) : fn) : p;
+}
+function findInsertionIndex(id) {
+  let start = flushIndex + 1;
+  let end = queue.length;
+  while (start < end) {
+    const middle = start + end >>> 1;
+    const middleJobId = getId(queue[middle]);
+    middleJobId < id ? start = middle + 1 : end = middle;
+  }
+  return start;
+}
+function queueJob(job) {
+  if (!queue.length || !queue.includes(
+    job,
+    isFlushing && job.allowRecurse ? flushIndex + 1 : flushIndex
+  )) {
+    if (job.id == null) {
+      queue.push(job);
+    } else {
+      queue.splice(findInsertionIndex(job.id), 0, job);
+    }
+    queueFlush();
+  }
+}
+function queueFlush() {
+  if (!isFlushing && !isFlushPending) {
+    isFlushPending = true;
+    currentFlushPromise = resolvedPromise.then(flushJobs);
+  }
+}
+function invalidateJob(job) {
+  const i = queue.indexOf(job);
+  if (i > flushIndex) {
+    queue.splice(i, 1);
+  }
+}
+function queuePostFlushCb(cb) {
+  if (!Array.isArray(cb)) {
+    if (!activePostFlushCbs || !activePostFlushCbs.includes(
+      cb,
+      cb.allowRecurse ? postFlushIndex + 1 : postFlushIndex
+    )) {
+      pendingPostFlushCbs.push(cb);
+    }
+  } else {
+    pendingPostFlushCbs.push(...cb);
+  }
+  queueFlush();
+}
+function flushPreFlushCbs(seen, i = isFlushing ? flushIndex + 1 : 0) {
+  {
+    seen = seen || /* @__PURE__ */ new Map();
+  }
+  for (; i < queue.length; i++) {
+    const cb = queue[i];
+    if (cb && cb.pre) {
+      if (checkRecursiveUpdates(seen, cb)) {
+        continue;
+      }
+      queue.splice(i, 1);
+      i--;
+      cb();
+    }
+  }
+}
+function flushPostFlushCbs(seen) {
+  if (pendingPostFlushCbs.length) {
+    const deduped = [...new Set(pendingPostFlushCbs)];
+    pendingPostFlushCbs.length = 0;
+    if (activePostFlushCbs) {
+      activePostFlushCbs.push(...deduped);
+      return;
+    }
+    activePostFlushCbs = deduped;
+    {
+      seen = seen || /* @__PURE__ */ new Map();
+    }
+    activePostFlushCbs.sort((a, b) => getId(a) - getId(b));
+    for (postFlushIndex = 0; postFlushIndex < activePostFlushCbs.length; postFlushIndex++) {
+      if (checkRecursiveUpdates(seen, activePostFlushCbs[postFlushIndex])) {
+        continue;
+      }
+      activePostFlushCbs[postFlushIndex]();
+    }
+    activePostFlushCbs = null;
+    postFlushIndex = 0;
+  }
+}
+const getId = (job) => job.id == null ? Infinity : job.id;
+const comparator = (a, b) => {
+  const diff = getId(a) - getId(b);
+  if (diff === 0) {
+    if (a.pre && !b.pre)
+      return -1;
+    if (b.pre && !a.pre)
+      return 1;
+  }
+  return diff;
+};
+function flushJobs(seen) {
+  isFlushPending = false;
+  isFlushing = true;
+  {
+    seen = seen || /* @__PURE__ */ new Map();
+  }
+  queue.sort(comparator);
+  const check = (job) => checkRecursiveUpdates(seen, job);
+  try {
+    for (flushIndex = 0; flushIndex < queue.length; flushIndex++) {
+      const job = queue[flushIndex];
+      if (job && job.active !== false) {
+        if (__DEV__ && check(job)) {
+          continue;
+        }
+        callWithErrorHandling(job, null, 14);
+      }
+    }
+  } finally {
+    flushIndex = 0;
+    queue.length = 0;
+    flushPostFlushCbs(seen);
+    isFlushing = false;
+    currentFlushPromise = null;
+    if (queue.length || pendingPostFlushCbs.length) {
+      flushJobs(seen);
+    }
+  }
+}
+function checkRecursiveUpdates(seen, fn) {
+  if (!seen.has(fn)) {
+    seen.set(fn, 1);
+  } else {
+    const count = seen.get(fn);
+    if (count > RECURSION_LIMIT) {
+      const instance = fn.ownerInstance;
+      const componentName = instance && getComponentName(instance.type);
+      console.warn(
+        `Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.`
+      );
+      return true;
+    }
+    seen.set(fn, count + 1);
+  }
+}
+export {
+  NOOP,
+  flushPostFlushCbs,
+  flushPreFlushCbs,
+  invalidateJob,
+  nextTick,
+  queueJob,
+  queuePostFlushCb
+};

package/es/common/app-router-view/app-router-view.d.ts

@@ -0,0 +1,30 @@
+import { PropType, VNode } from 'vue';
+/**
+ * 只会第一次绘制的时候绘制路由相关的内容，后面路由导致的router-view的回调都屏蔽了。
+ * 通过变更manualKey,来强制刷新router-view的slot回调。并且吧manualKey传给Component的key，搭配AppKeepAlive可以缓存组件
+ */
+export declare const AppRouterView: import("vue").DefineComponent<{
+    name: {
+        type: PropType<string>;
+        default: string;
+    };
+    route: PropType<RouteLocationNormalizedLoaded>;
+    manualKey: {
+        type: StringConstructor;
+    };
+}, {
+    renderComp: (Component: VNode, _route: any) => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | undefined;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    name: {
+        type: PropType<string>;
+        default: string;
+    };
+    route: PropType<RouteLocationNormalizedLoaded>;
+    manualKey: {
+        type: StringConstructor;
+    };
+}>>, {
+    name: string;
+}>;