@esmx/router 3.0.0-rc.17 → 3.0.0-rc.19

package/src/utils/path.ts

@@ -1,417 +0,0 @@
-import normalizeUrl from 'normalize-url';
-import URLParse from 'url-parse';
-
-import type {
-    HistoryState,
-    Route,
-    RouterBase,
-    RouterLocation,
-    RouterRawLocation
-} from '../types';
-import {
-    decode,
-    decodeQuery,
-    encodeHash,
-    encodeQueryKey,
-    encodeQueryValue
-} from './encoding';
-import { isValidValue } from './utils';
-import { assert, warn } from './warn';
-
-/**
- * 判断路径是否以 http 或 https 开头 或者直接是域名开头
- */
-export const regexDomain =
-    /^(?:https?:\/\/|[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z0-9][a-z0-9-]{0,61}[a-z0-9](\/.*)?/i;
-
-/**
- * 判断路径是否以 scheme 协议开头
- */
-export const regexScheme = /^(?:[a-z][a-z\d+.-]*:.+)/i;
-
-/**
- * 判断路径是否以 http(s) 协议开头
- */
-export const regexHttpScheme = /^(http(s)?:\/\/)/;
-
-/**
- * 去除URL路径中重复的斜杠，但不改变协议部分的双斜杠。
- *
- * @param url 需要处理的URL字符串。
- * @returns 处理后的URL，重复的斜杠被去除。
- */
-function removeDuplicateSlashes(url: string): string {
-    // 正则表达式匹配除了://之外的连续两个或以上斜杠，并替换为一个斜杠
-    if (url.includes('://')) {
-        const [base, path] = url.split('://');
-        const result = path.replace(/\/{2,}/g, '/');
-        return `${base}://${result}`;
-    }
-
-    const result = url.replace(/\/{2,}/g, '/');
-    return result;
-}
-
-/**
- * 格式化路径 主要用于拼接嵌套路由的路径
- * 返回的格式化后的路径如果有协议则以协议开头，如果没有协议则以/开头
- */
-export function normalizePath(path: string, parentPath?: string) {
-    // 如果path以/开头 说明是绝对路径，不需要拼接路径
-    // 按 Hanson 要求，不提供绝对路径
-    // if (path.startsWith('/')) {
-    //     return removeDuplicateSlashes(path);
-    // }
-    let normalizedPath = parentPath ? `${parentPath}/${path}` : `${path}`;
-
-    // 当解析的路径不是以http 或 https 协议开头时，给开头加上/
-    if (
-        !regexHttpScheme.test(normalizedPath) &&
-        !normalizedPath.startsWith('/')
-    ) {
-        normalizedPath = `/${normalizedPath}`;
-    }
-
-    return (
-        // 只有存在父级路由才进行路由拼接
-        removeDuplicateSlashes(normalizedPath) // 将多个斜杠 / 替换为单个斜杠 /
-            .replace(/\/$/, '') || // 移除结尾的斜杠 /
-        '/' // 为空字符串时至少返回单个 /
-    );
-}
-
-/**
- * 路径解析方法
- * @example 输入 https://www.google.com/test1/test2?a=1&b=2#123 输出 { pathname: '/test1/test2', query: { a: '1', b: '2' }, queryArray: { a: ['1'], b: ['2'] }, hash: '123' }
- * 输入 /test1/test2?a=1&b=2#123 同样输出 { pathname: '/test1/test2', query: { a: '1', b: '2' }, queryArray: { a: ['1'], b: ['2'] }, hash: '123' }
- */
-export function parsePath(path = ''): {
-    pathname: string;
-    query: Record<string, string>;
-    queryArray: Record<string, string[]>;
-    hash: string;
-} {
-    path = normalizePath(path);
-    const { pathname, query, hash } = new URLParse(path || '/');
-    const queryObj = {};
-    const queryArray = {};
-    if (query.length > 0) {
-        query
-            .slice(1)
-            .split('&')
-            .forEach((item) => {
-                let [key = '', value = ''] = item.split('=');
-                key = decode(key);
-                value = decodeQuery(value);
-                if (key) {
-                    queryObj[key] = value;
-                    queryArray[key] = (queryArray[key] || []).concat(value);
-                }
-                // queryArray[key] = [
-                //     ...(queryArray[key] || []),
-                //     ...(value !== undefined ? [value] : [])
-                // ];
-            });
-    }
-    return {
-        pathname,
-        query: queryObj,
-        queryArray,
-        hash: decode(hash)
-    };
-}
-
-/**
- * 将path query hash合并为完整路径
- * @example stringifyPath({ pathname: '/news', query: { a: '1' }, hash: '123' }) 输出 '/news?a=1#123'
- */
-export function stringifyPath(
-    {
-        pathname = '',
-        query = {},
-        queryArray = {},
-        hash = ''
-    }: {
-        pathname: string;
-        /* 按 Hanson 要求加入 undefined 类型 */
-        query: Record<string, string | undefined>;
-        queryArray: Record<string, string[]>;
-        hash: string;
-    } = {
-        pathname: '',
-        query: {},
-        queryArray: {},
-        hash: ''
-    }
-): string {
-    const queryString = Object.entries(
-        Object.assign({}, query, queryArray)
-    ).reduce((acc, [key, value]) => {
-        let query = '';
-        const encodedKey = encodeQueryKey(key);
-
-        if (Array.isArray(value)) {
-            query = value.reduce((all, item) => {
-                if (!isValidValue(item)) return all;
-                const encodedValue = encodeQueryValue(item);
-                if (encodedValue) {
-                    all = all
-                        ? `${all}&${encodedKey}=${encodedValue}`
-                        : `${encodedKey}=${encodedValue}`;
-                }
-                return all;
-            }, '');
-        } else {
-            const encodedValue = encodeQueryValue(value);
-            if (isValidValue(value)) {
-                query = `${encodedKey}=${encodedValue}`;
-            }
-        }
-
-        if (query) {
-            acc = acc ? `${acc}&${query}` : `?${query}`;
-        }
-
-        return acc;
-    }, '');
-
-    const hashContent = hash.startsWith('#') ? hash.replace(/^#/, '') : hash;
-    const hashString = hashContent ? `#${encodeHash(hashContent)}` : '';
-    return `${pathname}${queryString}${hashString}`;
-}
-
-/**
- * 标准化 RouterLocation 字段
- */
-export function normalizeLocation(
-    rawLocation: RouterRawLocation,
-    base: RouterBase = ''
-): RouterLocation & {
-    path: string;
-    base: string;
-    queryArray: Record<string, string[]>;
-} {
-    let pathname = '';
-    /* 按 Hanson 要求加入 undefined 类型 */
-    let query: Record<string, string | undefined> = {};
-    let queryArray: Record<string, string[]> = {};
-    let hash = '';
-    let params: Record<string, string> | undefined;
-    let state: HistoryState = {};
-
-    if (typeof rawLocation === 'object') {
-        const parsedOption = parsePath(rawLocation.path);
-        pathname = parsedOption.pathname;
-
-        // 只有在rawLocation初始传入了 query 或 queryArray 时才使用 rawLocation
-        if (rawLocation.query || rawLocation.queryArray) {
-            queryArray = rawLocation.queryArray || {};
-            query = rawLocation.query || {};
-        } else {
-            queryArray = parsedOption.queryArray;
-            query = parsedOption.query;
-        }
-
-        hash = rawLocation.hash || parsedOption.hash;
-
-        params = rawLocation.params; // params 不使用默认值
-        state = rawLocation.state || {};
-    } else {
-        const parsedOption = parsePath(rawLocation);
-        pathname = parsedOption.pathname;
-        query = parsedOption.query;
-        queryArray = parsedOption.queryArray;
-        hash = parsedOption.hash;
-    }
-
-    const fullPath = stringifyPath({
-        pathname,
-        query,
-        queryArray,
-        hash
-    });
-    const baseString = normalizePath(
-        typeof base === 'function'
-            ? base({
-                  fullPath,
-                  query,
-                  queryArray,
-                  hash
-              })
-            : base
-    );
-
-    let path = pathname;
-    // 如果 base 部分包含域名
-    if (regexDomain.test(baseString)) {
-        const { pathname } = new URLParse(baseString);
-        path = normalizePath(path.replace(new RegExp(`^(${pathname})`), ''));
-    }
-    path = normalizePath(path.replace(new RegExp(`^(${baseString})`), ''));
-
-    const { query: realQuery, queryArray: realQueryArray } =
-        parsePath(fullPath);
-
-    const res: RouterLocation & {
-        path: string;
-        base: string;
-        queryArray: Record<string, string[]>;
-    } = {
-        base: baseString,
-        path,
-        query: realQuery,
-        queryArray: realQueryArray,
-        hash,
-        state
-    };
-    if (params) res.params = params;
-    return res;
-}
-
-/**
- * 判断路径是否以协议或域名开头
- */
-export function isPathWithProtocolOrDomain(
-    location: RouterRawLocation,
-    base: RouterBase = ''
-): {
-    /**
-     * 是否以协议或域名开头
-     */
-    flag: boolean;
-    /**
-     * 虚假的 route 信息，内部跳转时无法信任，只有外站跳转时使用
-     */
-    route: Route;
-} {
-    let url = '';
-    let state = {};
-    let baseString = '';
-    if (typeof base === 'string') {
-        baseString = base;
-    } else {
-        baseString = base({
-            fullPath: '',
-            query: {},
-            queryArray: {},
-            hash: ''
-        });
-    }
-
-    if (typeof location === 'string') {
-        url = location;
-    } else {
-        state = location.state || {};
-        const {
-            path,
-            query = {},
-            queryArray,
-            hash = '',
-            ...nLocation
-        } = normalizeLocation(location);
-        url = stringifyPath({
-            ...nLocation,
-            query,
-            queryArray,
-            pathname: path,
-            hash
-        });
-    }
-
-    try {
-        url = normalizeUrl(url, {
-            stripWWW: false,
-            removeQueryParameters: false
-        });
-    } catch (error) {
-        try {
-            url = new URL(url, baseString).href;
-        } catch (error) {
-            assert(false, `Invalid URL: ${url}`);
-        }
-    }
-
-    // 如果以 scheme 协议开头 并且不是 http(s) 协议开头 则认为是外站跳转
-    if (regexScheme.test(url) && !regexHttpScheme.test(url)) {
-        const {
-            hash,
-            host,
-            hostname,
-            href,
-            origin,
-            pathname,
-            port,
-            protocol,
-            search
-        } = new URL(url);
-        const route: Route = {
-            hash,
-            host,
-            hostname,
-            href,
-            origin,
-            pathname,
-            port,
-            protocol,
-            search,
-            params: {},
-            query: {},
-            queryArray: {},
-            state,
-            meta: {},
-            path: pathname,
-            fullPath: url,
-            base: '',
-            matched: []
-        };
-        return {
-            flag: true,
-            route
-        };
-    }
-
-    const {
-        hash,
-        host,
-        hostname,
-        href,
-        origin,
-        pathname,
-        port,
-        protocol,
-        query: search
-    } = new URLParse(url);
-    const { query = {}, queryArray } = normalizeLocation(url);
-    const route: Route = {
-        href,
-        origin,
-        host,
-        protocol,
-        hostname,
-        port,
-        pathname,
-        search,
-        hash,
-        query,
-        queryArray,
-        params: {},
-        state,
-        meta: {},
-        path: pathname,
-        fullPath: `${pathname}${search}${hash}`,
-        base: '',
-        matched: []
-    };
-
-    if (regexDomain.test(url)) {
-        return {
-            flag: true,
-            route
-        };
-    }
-
-    return {
-        flag: false,
-        route
-    };
-}

package/src/utils/scroll.ts

@@ -1,120 +0,0 @@
-import type {
-    RouterRawLocation,
-    ScrollPosition,
-    ScrollPositionCoordinates,
-    _ScrollPositionNormalized
-} from '../types';
-import { warn } from './warn';
-
-/**
- * 获取当前滚动位置
- */
-export const computeScrollPosition = (): _ScrollPositionNormalized => ({
-    left: window.scrollX,
-    top: window.scrollY
-});
-
-/**
- * 获取元素位置
- */
-function getElementPosition(
-    el: Element,
-    offset: ScrollPositionCoordinates
-): _ScrollPositionNormalized {
-    const docRect = document.documentElement.getBoundingClientRect();
-    const elRect = el.getBoundingClientRect();
-
-    return {
-        behavior: offset.behavior,
-        left: elRect.left - docRect.left - (offset.left || 0),
-        top: elRect.top - docRect.top - (offset.top || 0)
-    };
-}
-
-/**
- * 滚动到指定位置
- */
-export function scrollToPosition(position: ScrollPosition): void {
-    let scrollToOptions: ScrollPositionCoordinates;
-
-    if ('el' in position) {
-        const positionEl = position.el;
-        const isIdSelector =
-            typeof positionEl === 'string' && positionEl.startsWith('#');
-
-        const el =
-            typeof positionEl === 'string'
-                ? isIdSelector
-                    ? document.getElementById(positionEl.slice(1))
-                    : document.querySelector(positionEl)
-                : positionEl;
-
-        if (!el) {
-            return;
-        }
-        scrollToOptions = getElementPosition(el, position);
-    } else {
-        scrollToOptions = position;
-    }
-
-    if ('scrollBehavior' in document.documentElement.style) {
-        window.scrollTo(scrollToOptions);
-    } else {
-        window.scrollTo(
-            scrollToOptions.left != null
-                ? scrollToOptions.left
-                : window.scrollX,
-            scrollToOptions.top != null ? scrollToOptions.top : window.scrollY
-        );
-    }
-}
-
-/**
- * 存储的滚动位置
- */
-export const scrollPositions = new Map<string, _ScrollPositionNormalized>();
-
-const POSITION_KEY = '__scroll_position_key';
-
-/**
- * 保存滚动位置
- */
-export function saveScrollPosition(
-    key: string,
-    scrollPosition: _ScrollPositionNormalized
-) {
-    scrollPositions.set(key, scrollPosition);
-    // preserve existing history state as it could be overriden by the user
-    const stateCopy = Object.assign({}, window.history.state);
-    stateCopy[POSITION_KEY] = scrollPosition;
-
-    try {
-        const protocolAndPath =
-            window.location.protocol + '//' + window.location.host;
-        const absolutePath = window.location.href.replace(protocolAndPath, '');
-        window.history.replaceState(stateCopy, '', absolutePath);
-    } catch (error) {
-        warn(`Failed to save scroll position.`, error);
-    }
-}
-
-/**
- * 获取存储的滚动位置
- */
-export function getSavedScrollPosition(
-    key: string
-): _ScrollPositionNormalized | null {
-    const scroll = scrollPositions.get(key) || history.state[POSITION_KEY];
-
-    // 保存的滚动位置信息不应当被多次使用, 下一次应当使用新保存的位置信息
-    scrollPositions.delete(key);
-    return scroll || null;
-}
-
-/**
- * 获取跳转配置的保持滚动位置参数
- */
-export function getKeepScrollPosition(location: RouterRawLocation): boolean {
-    if (typeof location === 'string') return false;
-    return location.keepScrollPosition || false;
-}

package/src/utils/utils.ts

@@ -1,30 +0,0 @@
-/**
- * 是否在浏览器环境
- */
-export const inBrowser = typeof window !== 'undefined';
-
-/**
- *  Symbol 是否可用
- */
-export const isSymbolAble =
-    typeof Symbol === 'function' && typeof Symbol.toStringTag === 'symbol';
-
-/**
- * 判断是否是 es module 对象
- */
-export function isESModule(obj: any): boolean {
-    return (
-        Boolean(obj.__esModule) ||
-        (isSymbolAble && obj[Symbol.toStringTag] === 'Module')
-    );
-}
-
-/**
- * 判断是否是合法的值
- */
-export function isValidValue(value: any): boolean {
-    if (value === null) return false;
-    if (value === undefined) return false;
-    if (typeof value === 'number' && isNaN(value)) return false;
-    return true;
-}

package/src/utils/warn.ts

@@ -1,13 +0,0 @@
-export function assert(condition: boolean, message: string) {
-    if (!condition) {
-        throw new Error(`[@esmx/router] ${message}`);
-    }
-}
-
-export function warn(...args: any[]) {
-    console.log(
-        '%c ROUTER WARNING:',
-        'color: rgb(214, 77, 77); font-weight: bold;',
-        ...args
-    );
-}