@tarojs/taro-h5 3.5.10 → 3.5.11

package/dist/index.cjs.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var Taro = require('@tarojs/api');
 var router = require('@tarojs/router');
+var utils = require('@tarojs/router/dist/utils');
 var runtime = require('@tarojs/runtime');
 var base64Js = require('base64-js');
 var navigate = require('@tarojs/router/dist/utils/navigate');
@@ -13,6 +14,24 @@ var jsonpRetry = require('jsonp-retry');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
 var Taro__default = /*#__PURE__*/_interopDefaultLegacy(Taro);
 var jsonpRetry__default = /*#__PURE__*/_interopDefaultLegacy(jsonpRetry);
 
@@ -195,6 +214,9 @@ function upperCaseFirstLetter(string) {
     string = string.replace(/^./, match => match.toUpperCase());
     return string;
 }
+const toKebabCase = function (string) {
+    return string.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
+};
 function inlineStyle(style) {
     let res = '';
     for (const attr in style)
@@ -311,6 +333,30 @@ function processOpenApi({ name, defaultOptions, standardMethod, formatOptions =
         }
     };
 }
+/**
+ * 根据url获取应用的启动页面
+ * @returns
+ */
+function getLaunchPage() {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const appConfig = window.__taroAppConfig || {};
+    // createPageConfig时根据stack的长度来设置stamp以保证页面path的唯一，此函数是在createPageConfig之前调用，预先设置stamp=1
+    const stamp = '?stamp=1';
+    let entryPath = '';
+    if (((_a = appConfig.router) === null || _a === void 0 ? void 0 : _a.mode) === 'browser' || ((_b = appConfig.router) === null || _b === void 0 ? void 0 : _b.mode) === 'multi') {
+        entryPath = location.pathname;
+    }
+    else {
+        entryPath = location.hash.slice(1).split('?')[0];
+    }
+    const routePath = utils.addLeadingSlash(utils.stripBasename(entryPath, (_c = appConfig.router) === null || _c === void 0 ? void 0 : _c.basename));
+    const homePath = utils.addLeadingSlash(utils.getHomePage((_e = (_d = appConfig.routes) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.path, (_f = appConfig.router) === null || _f === void 0 ? void 0 : _f.basename, (_g = appConfig.router) === null || _g === void 0 ? void 0 : _g.customRoutes, appConfig.entryPagePath));
+    // url上没有指定应用的启动页面时使用homePath
+    if (routePath === '/') {
+        return homePath + stamp;
+    }
+    return routePath + stamp;
+}
 
 // 广告
 const createRewardedVideoAd = temporarilyNotSupport('createRewardedVideoAd');
@@ -3926,6 +3972,7 @@ class Modal {
     }
     create(options = {}) {
         return new Promise((resolve) => {
+            var _a, _b;
             // style
             const { maskStyle, modalStyle, titleStyle, textStyle, footStyle, btnStyle } = this.style;
             // configuration
@@ -3990,10 +4037,13 @@ class Modal {
             // show immediately
             document.body.appendChild(this.el);
             setTimeout(() => { this.el.style.opacity = '1'; }, 0);
+            // Current.page不存在时说明路由还未挂载，此时需根据url来分配将要渲染的页面path
+            this.currentPath = (_b = (_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path) !== null && _b !== void 0 ? _b : getLaunchPage();
         });
     }
     show(options = {}) {
         return new Promise((resolve) => {
+            var _a, _b;
             const config = Object.assign(Object.assign({}, this.options), options);
             if (this.hideOpacityTimer)
                 clearTimeout(this.hideOpacityTimer);
@@ -4037,6 +4087,8 @@ class Modal {
             // show
             this.el.style.display = 'block';
             setTimeout(() => { this.el.style.opacity = '1'; }, 0);
+            // Current.page不存在时说明路由还未挂载，此时需根据url来分配将要渲染的页面path
+            this.currentPath = (_b = (_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path) !== null && _b !== void 0 ? _b : getLaunchPage();
         });
     }
     hide() {
@@ -4044,6 +4096,7 @@ class Modal {
             clearTimeout(this.hideOpacityTimer);
         if (this.hideDisplayTimer)
             clearTimeout(this.hideDisplayTimer);
+        this.currentPath = null;
         this.hideOpacityTimer = setTimeout(() => {
             this.el.style.opacity = '0';
             this.hideDisplayTimer = setTimeout(() => { this.el.style.display = 'none'; }, 200);
@@ -4127,6 +4180,7 @@ class Toast {
         };
     }
     create(options = {}, _type = 'toast') {
+        var _a, _b;
         // style
         const { maskStyle, toastStyle, successStyle, errrorStyle, loadingStyle, imageStyle, textStyle } = this.style;
         // configuration
@@ -4170,9 +4224,12 @@ class Toast {
         this.type = config._type;
         // disappear after duration
         config.duration >= 0 && this.hide(config.duration, this.type);
+        // Current.page不存在时说明路由还未挂载，此时需根据url来分配将要渲染的页面path
+        this.currentPath = (_b = (_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path) !== null && _b !== void 0 ? _b : getLaunchPage();
         return '';
     }
     show(options = {}, _type = 'toast') {
+        var _a, _b;
         const config = Object.assign(Object.assign(Object.assign({}, this.options), options), { _type });
         if (this.hideOpacityTimer)
             clearTimeout(this.hideOpacityTimer);
@@ -4204,6 +4261,8 @@ class Toast {
         this.type = config._type;
         // disappear after duration
         config.duration >= 0 && this.hide(config.duration, this.type);
+        // Current.page不存在时说明路由还未挂载，此时需根据url来分配将要渲染的页面path
+        this.currentPath = (_b = (_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path) !== null && _b !== void 0 ? _b : getLaunchPage();
         return '';
     }
     hide(duration = 0, type) {
@@ -4213,6 +4272,7 @@ class Toast {
             clearTimeout(this.hideOpacityTimer);
         if (this.hideDisplayTimer)
             clearTimeout(this.hideDisplayTimer);
+        this.currentPath = null;
         this.hideOpacityTimer = setTimeout(() => {
             this.el.style.opacity = '0';
             this.hideDisplayTimer = setTimeout(() => { this.el.style.display = 'none'; }, 100);
@@ -4474,10 +4534,15 @@ const showActionSheet = (options = { itemList: [] }) => __awaiter(void 0, void 0
         return handle.success(({ tapIndex: result }));
     }
 });
-Taro__default["default"].eventCenter.on('__taroRouterChange', () => {
-    hideToast();
-    hideLoading();
-    hideModal();
+Taro__default["default"].eventCenter.on('__afterTaroRouterChange', () => {
+    var _a, _b;
+    if (toast.currentPath && toast.currentPath !== ((_a = runtime.Current.page) === null || _a === void 0 ? void 0 : _a.path)) {
+        hideToast();
+        hideLoading();
+    }
+    if (modal.currentPath && modal.currentPath !== ((_b = runtime.Current.page) === null || _b === void 0 ? void 0 : _b.path)) {
+        hideModal();
+    }
 });
 const enableAlertBeforeUnload = temporarilyNotSupport('enableAlertBeforeUnload');
 const disableAlertBeforeUnload = temporarilyNotSupport('disableAlertBeforeUnload');
@@ -4946,6 +5011,159 @@ const offWindowResize = callback => {
 // Worker
 const createWorker = temporarilyNotSupport('createWorker');
 
+// pollify
+Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('intersection-observer')); });
+class TaroH5IntersectionObserver {
+    constructor(component, options = {}) {
+        // 选项
+        this._options = {
+            thresholds: [0],
+            initialRatio: 0,
+            observeAll: false
+        };
+        // 监控中的选择器
+        this._listeners = [];
+        // 用来扩展（或收缩）参照节点布局区域的边界
+        this._rootMargin = {};
+        // 是否已初始化
+        this._isInited = false;
+        this._component = component;
+        Object.assign(this._options, options);
+    }
+    // selector 的容器节点
+    get container() {
+        const container = (this._component !== null
+            ? (findDOM(this._component) || document)
+            : document);
+        return container;
+    }
+    createInst() {
+        // 去除原本的实例
+        this.disconnect();
+        const { left = 0, top = 0, bottom = 0, right = 0 } = this._rootMargin;
+        return new IntersectionObserver(entries => {
+            entries.forEach(entry => {
+                const _callback = this._getCallbackByElement(entry.target);
+                const result = {
+                    boundingClientRect: entry.boundingClientRect,
+                    intersectionRatio: entry.intersectionRatio,
+                    intersectionRect: entry.intersectionRect,
+                    relativeRect: entry.rootBounds || { left: 0, right: 0, top: 0, bottom: 0 },
+                    time: entry.time
+                };
+                // web端会默认首次触发
+                if (!this._isInited && this._options.initialRatio <= Math.min.apply(Math, this._options.thresholds)) {
+                    // 初始的相交比例，如果调用时检测到的相交比例与这个值不相等且达到阈值，则会触发一次监听器的回调函数。
+                    return;
+                }
+                _callback && _callback.call(this, result);
+            });
+            this._isInited = true;
+        }, {
+            root: this._root,
+            rootMargin: [`${top}px`, `${right}px`, `${bottom}px`, `${left}px`].join(' '),
+            threshold: this._options.thresholds
+        });
+    }
+    disconnect() {
+        if (this._observerInst) {
+            let listener;
+            while ((listener = this._listeners.pop())) {
+                this._observerInst.unobserve(listener.element);
+            }
+            this._observerInst.disconnect();
+        }
+    }
+    observe(targetSelector, callback) {
+        // 同wx小程序效果一致，每个实例监听一个Selector
+        if (this._listeners.length)
+            return;
+        // 监听前没有设置关联的节点
+        if (!this._observerInst) {
+            console.warn('Intersection observer will be ignored because no relative nodes are found.');
+            return;
+        }
+        const nodeList = this._options.observeAll
+            ? this.container.querySelectorAll(targetSelector)
+            : [this.container.querySelector(targetSelector)];
+        nodeList.forEach(element => {
+            if (!element)
+                return;
+            this._observerInst.observe(element);
+            this._listeners.push({ element, callback });
+        });
+    }
+    relativeTo(selector, margins) {
+        // 已设置observe监听后，重新关联节点
+        if (this._listeners.length) {
+            console.error('Relative nodes cannot be added after "observe" call in IntersectionObserver');
+            return this;
+        }
+        this._root = this.container.querySelector(selector) || null;
+        if (margins) {
+            this._rootMargin = margins;
+        }
+        this._observerInst = this.createInst();
+        return this;
+    }
+    relativeToViewport(margins) {
+        return this.relativeTo('.taro_page', margins);
+    }
+    _getCallbackByElement(element) {
+        const listener = this._listeners.find(listener => listener.element === element);
+        return listener ? listener.callback : null;
+    }
+}
+
+function generateMediaQueryStr(descriptor) {
+    const mediaQueryArr = [];
+    const descriptorMenu = ['width', 'minWidth', 'maxWidth', 'height', 'minHeight', 'maxHeight', 'orientation'];
+    for (const item of descriptorMenu) {
+        if (item !== 'orientation' &&
+            descriptor[item] &&
+            Number(descriptor[item]) >= 0) {
+            mediaQueryArr.push(`(${(toKebabCase(item))}: ${Number(descriptor[item])}px)`);
+        }
+        if (item === 'orientation' && descriptor[item]) {
+            mediaQueryArr.push(`(${toKebabCase(item)}: ${descriptor[item]})`);
+        }
+    }
+    return mediaQueryArr.join(' and ');
+}
+class MediaQueryObserver {
+    // 监听页面媒体查询变化情况
+    observe(descriptor, callback) {
+        if (isFunction(callback)) {
+            // 创建媒体查询对象
+            this._mediaQueryObserver = window.matchMedia(generateMediaQueryStr(descriptor));
+            // 监听器
+            this._listener = (ev) => {
+                callback({ matches: ev.matches });
+            };
+            callback({ matches: this._mediaQueryObserver.matches });
+            // 兼容旧浏览器中MediaQueryList尚未继承于EventTarget导致不存在'addEventListener'
+            if ('addEventListener' in this._mediaQueryObserver) {
+                this._mediaQueryObserver.addEventListener('change', this._listener);
+            }
+            else {
+                this._mediaQueryObserver.addListener(this._listener);
+            }
+        }
+    }
+    // 停止监听，销毁媒体查询对象
+    disconnect() {
+        if (this._mediaQueryObserver && this._listener) {
+            // 兼容旧浏览器中MediaQueryList尚未继承于EventTarget导致不存在'removeEventListener'
+            if ('removeEventListener' in this._mediaQueryObserver) {
+                this._mediaQueryObserver.removeEventListener('change', this._listener);
+            }
+            else {
+                this._mediaQueryObserver.removeListener(this._listener);
+            }
+        }
+    }
+}
+
 class NodesRef {
     constructor(selector, querySelectorQuery, single) {
         this._component = querySelectorQuery._component;
@@ -5191,7 +5409,12 @@ class SelectorQuery {
 const createSelectorQuery = () => {
     return new SelectorQuery();
 };
-const createIntersectionObserver = temporarilyNotSupport('createIntersectionObserver');
+const createIntersectionObserver = (component, options) => {
+    return new TaroH5IntersectionObserver(component, options);
+};
+const createMediaQueryObserver = () => {
+    return new MediaQueryObserver();
+};
 
 const { Behavior, getEnv, ENV_TYPE, Link, interceptors, getInitPxTransform, Current, options, eventCenter, Events, preload } = Taro__default["default"];
 const taro = {
@@ -5332,6 +5555,7 @@ exports.createLivePusherContext = createLivePusherContext;
 exports.createMapContext = createMapContext;
 exports.createMediaAudioPlayer = createMediaAudioPlayer;
 exports.createMediaContainer = createMediaContainer;
+exports.createMediaQueryObserver = createMediaQueryObserver;
 exports.createMediaRecorder = createMediaRecorder;
 exports.createOffscreenCanvas = createOffscreenCanvas;
 exports.createRewardedVideoAd = createRewardedVideoAd;