@esmx/router-vue 3.0.0-rc.17 → 3.0.0-rc.20

package/dist/view.d.ts

@@ -1,21 +0,0 @@
-import type { Route } from '@esmx/router';
-import { type PropType } from 'vue';
-export declare const RouterView: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    name: {
-        type: PropType<string>;
-        default: string;
-    };
-    route: PropType<Route>;
-}>, (() => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>[] | null) | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    name: {
-        type: PropType<string>;
-        default: string;
-    };
-    route: PropType<Route>;
-}>> & Readonly<{}>, {
-    name: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/view.mjs

@@ -1,75 +0,0 @@
-import {
-  computed,
-  defineComponent,
-  getCurrentInstance,
-  h,
-  inject,
-  provide,
-  shallowReactive
-} from "vue";
-import { routerViewDepthKey, routerViewLocationKey } from "./symbols.mjs";
-export const RouterView = defineComponent({
-  name: "RouterView",
-  inheritAttrs: true,
-  props: {
-    name: {
-      type: String,
-      default: "default"
-    },
-    route: Object
-  },
-  // Better compat for @vue/compat users
-  // https://github.com/vuejs/router/issues/1315
-  compatConfig: { MODE: 3 },
-  setup: (props, { attrs, slots }) => {
-    const instance = getCurrentInstance();
-    if (!instance) {
-      console.error("no current instance");
-      return;
-    }
-    const injectedRoute = inject(
-      routerViewLocationKey
-    );
-    const routeToDisplay = computed(
-      () => props.route || injectedRoute
-    );
-    const injectedDepth = inject(
-      routerViewDepthKey,
-      computed(() => 0)
-    );
-    const depth = computed(() => {
-      let initialDepth = injectedDepth.value;
-      const { matched } = routeToDisplay.value;
-      let matchedRoute;
-      while ((matchedRoute = matched[initialDepth]) && !(matchedRoute == null ? void 0 : matchedRoute.component)) {
-        initialDepth++;
-      }
-      return initialDepth;
-    });
-    provide(routerViewLocationKey, shallowReactive(routeToDisplay.value));
-    provide(
-      routerViewDepthKey,
-      computed(() => depth.value + 1)
-    );
-    return () => {
-      const matchRoute = routeToDisplay.value.matched[depth.value];
-      if (!matchRoute) {
-        return null;
-      }
-      const component = h(
-        matchRoute.component,
-        Object.assign({}, props, attrs)
-      );
-      return (
-        // pass the vnode to the slot as a prop.
-        // h and <component :is="..."> both accept vnodes
-        normalizeSlot(slots.default, { Component: component }) || component
-      );
-    };
-  }
-});
-function normalizeSlot(slot, data) {
-  if (!slot) return null;
-  const slotContent = slot(data);
-  return slotContent.length === 1 ? slotContent[0] : slotContent;
-}

package/src/link.ts

@@ -1,177 +0,0 @@
-import {
-    type RouteRecord,
-    type RouterRawLocation,
-    isEqualRoute,
-    isSameRoute
-} from '@esmx/router';
-import { type PropType, defineComponent, h } from 'vue';
-
-import { useRoute, useRouter } from './use';
-
-export interface RouterLinkProps {
-    /**
-     * 前往的路由路径
-     */
-    to: RouterRawLocation;
-
-    /**
-     * 节点使用的标签名
-     * @default 'a'
-     */
-    tag: string;
-
-    /**
-     * 调用 router.replace 以替换 router.push。
-     * @default false
-     */
-    replace: boolean;
-
-    /**
-     * 路径激活匹配规则
-     * @example include => 路径包含即激活.
-     * 如: 当前路由为/en/news/list  此时router-link 的路径为 /en/news 也会激活
-     * @example route => 路由匹配才会激活,需要匹配的路由树一致.
-     * 如: 当前路由为/en/news/list/123  此时router-link 的路径为 /en/news/list 也会激活
-     * @example exact => 路径全匹配才会激活，不仅需要匹配路由树一致，还需要参数匹配才会激活.
-     * 如: 当前路由为/en/news/list/123  此时router-link 的路径为 /en/news/list/123 才会激活，如果配置的路径为/en/news/list/123456 也不会激活
-     * @default 'include'
-     */
-    exact: 'include' | 'route' | 'exact';
-
-    /**
-     * 是否为相对路径
-     * 按照 Hanson 要求目前都是绝对路径，因此废弃此属性
-     * @default false
-     */
-    // append?: boolean;
-
-    /**
-     * 路由激活时的class
-     * @default 'router-link-active'
-     */
-    activeClass: string;
-
-    /**
-     * 哪些事件触发路由跳转
-     * @default 'click'
-     */
-    event: string | string[];
-}
-
-export const RouterLink = defineComponent({
-    props: {
-        to: {
-            type: [String, Object] as PropType<RouterLinkProps['to']>,
-            required: true
-        },
-        tag: {
-            type: String as PropType<RouterLinkProps['tag']>,
-            default: 'a'
-        },
-        replace: {
-            type: Boolean as PropType<RouterLinkProps['replace']>,
-            default: false
-        },
-        exact: {
-            type: String as PropType<RouterLinkProps['exact']>,
-            default: 'include'
-        },
-        // append: {
-        //     type: Boolean as PropType<boolean>,
-        //     default: false
-        // },
-        activeClass: {
-            type: String as PropType<RouterLinkProps['activeClass']>,
-            default: 'router-link-active'
-        },
-        event: {
-            type: String as PropType<RouterLinkProps['event']>,
-            default: 'click'
-        }
-    },
-    render(props: RouterLinkProps) {
-        const { to, tag, replace, exact, activeClass, event } = props;
-        const router = useRouter();
-        const current = useRoute();
-        const resolveRoute = router.resolve(to);
-
-        /* 匹配函数 */
-        let compare: (current: RouteRecord, route: RouteRecord) => Boolean;
-        switch (exact) {
-            /* 路由级匹配 */
-            case 'route':
-                compare = isSameRoute;
-                break;
-
-            /* 全匹配 */
-            case 'exact':
-                compare = isEqualRoute;
-                break;
-
-            /* 是否包含 */
-            case 'include':
-            default:
-                compare = (current: RouteRecord, route: RouteRecord) => {
-                    return current.fullPath.startsWith(route.fullPath);
-                };
-                break;
-        }
-
-        /* 根据路由是否匹配获取高亮 */
-        const active = compare(current, resolveRoute);
-
-        /* 事件处理函数 */
-        const handler = (e: MouseEvent) => {
-            if (guardEvent(e)) {
-                router[replace ? 'replace' : 'push'](to);
-            }
-        };
-
-        /* 可触发事件 map */
-        const on: Record<string, Function | Function[]> = {};
-        const eventTypeList = getEventTypeList(event);
-        eventTypeList.forEach((eventName) => {
-            on[`on${eventName.toLocaleLowerCase()}`] = handler;
-        });
-
-        return h(
-            tag,
-            {
-                class: ['router-link', active ? [activeClass] : ''],
-                href: resolveRoute.fullPath,
-                ...on
-            },
-            this.$slots
-        );
-    }
-});
-
-function getEventTypeList(eventType: string | string[]): string[] {
-    if (eventType instanceof Array) {
-        if (eventType.length > 0) {
-            return eventType;
-        }
-        return ['click'];
-    }
-    return [eventType || 'click'];
-}
-
-function guardEvent(e: MouseEvent) {
-    // don't redirect with control keys
-    if (e.metaKey || e.altKey || e.ctrlKey || e.shiftKey) return;
-    // don't redirect when preventDefault called
-    if (e.defaultPrevented) return;
-    // don't redirect on right click
-    if (e.button !== undefined && e.button !== 0) return;
-    // don't redirect if `target="_blank"`
-    // @ts-expect-error getAttribute does exist
-    if (e.currentTarget?.getAttribute) {
-        // @ts-expect-error getAttribute exists
-        const target = e.currentTarget.getAttribute('target');
-        if (/\b_blank\b/i.test(target)) return;
-    }
-    // this may be a Weex event which doesn't have this method
-    if (e.preventDefault) e.preventDefault();
-
-    return true;
-}

package/src/symbols.ts

@@ -1,8 +0,0 @@
-/* router key */
-export const routerKey = Symbol('routerViewLocation');
-
-/* router location key */
-export const routerViewLocationKey = Symbol('routerViewLocation');
-
-/* router depth key */
-export const routerViewDepthKey = Symbol('routerViewDepth');

package/src/view.ts

@@ -1,95 +0,0 @@
-import type { Route, RouteConfig } from '@esmx/router';
-import {
-    type ComputedRef,
-    type PropType,
-    type ShallowReactive,
-    type Slot,
-    computed,
-    defineComponent,
-    getCurrentInstance,
-    h,
-    inject,
-    provide,
-    shallowReactive
-} from 'vue';
-
-import { routerViewDepthKey, routerViewLocationKey } from './symbols';
-
-export const RouterView = defineComponent({
-    name: 'RouterView',
-    inheritAttrs: true,
-    props: {
-        name: {
-            type: String as PropType<string>,
-            default: 'default'
-        },
-        route: Object as PropType<Route>
-    },
-
-    // Better compat for @vue/compat users
-    // https://github.com/vuejs/router/issues/1315
-    compatConfig: { MODE: 3 },
-
-    setup: (props, { attrs, slots }) => {
-        const instance = getCurrentInstance();
-        if (!instance) {
-            console.error('no current instance');
-            return;
-        }
-
-        const injectedRoute = inject<ShallowReactive<Route>>(
-            routerViewLocationKey
-        )!;
-
-        const routeToDisplay = computed<Route>(
-            () => props.route || injectedRoute
-        );
-        const injectedDepth = inject<ComputedRef<number>>(
-            routerViewDepthKey,
-            computed(() => 0)
-        );
-
-        const depth = computed<number>(() => {
-            let initialDepth = injectedDepth.value;
-            const { matched } = routeToDisplay.value;
-            let matchedRoute: RouteConfig | undefined;
-            while (
-                (matchedRoute = matched[initialDepth]) &&
-                !matchedRoute?.component
-            ) {
-                initialDepth++;
-            }
-            return initialDepth;
-        });
-
-        provide(routerViewLocationKey, shallowReactive(routeToDisplay.value));
-        provide(
-            routerViewDepthKey,
-            computed(() => depth.value + 1)
-        );
-
-        return () => {
-            const matchRoute = routeToDisplay.value.matched[depth.value];
-            if (!matchRoute) {
-                return null;
-            }
-
-            const component = h(
-                matchRoute.component,
-                Object.assign({}, props, attrs)
-            );
-            return (
-                // pass the vnode to the slot as a prop.
-                // h and <component :is="..."> both accept vnodes
-                normalizeSlot(slots.default, { Component: component }) ||
-                component
-            );
-        };
-    }
-});
-
-function normalizeSlot(slot: Slot | undefined, data: any) {
-    if (!slot) return null;
-    const slotContent = slot(data);
-    return slotContent.length === 1 ? slotContent[0] : slotContent;
-}