@tarojs/components 3.5.7-alpha.9 → 3.5.8

package/dist/cjs/{taro-movable-area-core_2.cjs.entry.js → taro-movable-view-core.cjs.entry.js}

@@ -2,168 +2,69 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-9174e0b1.js');
-
-const areaCss = "taro-movable-area-core{display:block;position:relative;width:10px;height:10px}";
-
-const MovableArea = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    /** 子元素集合 */
-    this.views = [];
-    /** 手势缩放 */
-    this.scaleLength = 0;
-    this.viewsChanged = () => {
-      this.views = [];
-      const elements = this.element.querySelectorAll('taro-movable-view-core');
-      Array.from(elements).forEach((element) => {
-        this.views.push(element);
-      });
-      this.updateArea();
-    };
-    this.handleTouchStart = (e) => {
-      const touches = e.touches;
-      if (!touches || touches.length <= 1) {
-        return;
-      }
-      const gap = {
-        width: touches[1].pageX - touches[0].pageX,
-        height: touches[1].pageY - touches[0].pageY
-      };
-      this.scaleLength = Math.sqrt(gap.width * gap.width + gap.height * gap.height);
-      if (this.scaleArea) {
-        return;
-      }
-      const find = (target, views) => {
-        const loop = (e, t) => {
-          if (!(e = e.parentNode)) {
-            return false;
-          }
-          return (!(e instanceof HTMLElement) || e !== document.body) && (e === t || e === t.element || e.element === t || loop(e, t));
-        };
-        for (let i = 0; i < views.length; i++) {
-          const view = views[i];
-          if (target === view["element"] || loop(target, view)) {
-            return view;
-          }
-        }
-      };
-      const touch1 = find(touches[0].target, this.views);
-      const touch2 = find(touches[1].target, this.views);
-      this.scaleTarget = touch1 && touch1 === touch2 ? touch1 : undefined;
-    };
-    this.handleTouchMove = (e) => {
-      const touches = e.touches;
-      if (!touches || touches.length <= 1) {
-        return;
-      }
-      e.preventDefault();
-      const gap = {
-        width: touches[1].pageX - touches[0].pageX,
-        height: touches[1].pageY - touches[0].pageY
-      };
-      if (this.scaleLength > 0) {
-        this.updateScale(Math.sqrt(gap.width * gap.width + gap.height * gap.height) / this.scaleLength);
-      }
-    };
-    this.handleTouchEnd = (e) => {
-      var _a, _b;
-      if ((e.touches && e.touches.length) || !e.changedTouches) {
-        return;
-      }
-      this.scaleLength = 0;
-      if (this.scaleArea) {
-        this.views.forEach((element) => {
-          var _a;
-          (_a = element["endScale"]) === null || _a === void 0 ? void 0 : _a.call(element);
-        });
-      }
-      else {
-        (_b = (_a = this.scaleTarget) === null || _a === void 0 ? void 0 : _a["endScale"]) === null || _b === void 0 ? void 0 : _b.call(_a);
-      }
-      this.scaleTarget = undefined;
-    };
-    this.updateScale = (scale) => {
-      var _a, _b;
-      if (!scale || scale === 1) {
-        return;
-      }
-      if (this.scaleArea) {
-        this.views.forEach((element) => {
-          var _a;
-          (_a = element["setScale"]) === null || _a === void 0 ? void 0 : _a.call(element, scale);
-        });
-      }
-      else {
-        (_b = (_a = this.scaleTarget) === null || _a === void 0 ? void 0 : _a["setScale"]) === null || _b === void 0 ? void 0 : _b.call(_a, scale);
-      }
-    };
-    this.updateArea = () => {
-      const computedStyle = window.getComputedStyle(this.element);
-      const clientRect = this.element.getBoundingClientRect();
-      const horizontal = ["Left", "Right"].map((e) => {
-        return parseFloat(computedStyle["border" + e + "Width"]) + parseFloat(computedStyle["padding" + e]);
-      });
-      const vertical = ["Top", "Bottom"].map((e) => {
-        return parseFloat(computedStyle["border" + e + "Width"]) + parseFloat(computedStyle["padding" + e]);
-      });
-      this.views.forEach((element) => {
-        var _a;
-        (_a = element["setParent"]) === null || _a === void 0 ? void 0 : _a.call(element, {
-          element: this.element,
-          area: {
-            height: clientRect.height - vertical[0] - vertical[1],
-            width: clientRect.width - horizontal[0] - horizontal[1]
-          }
-        });
-      });
-    };
-    this.scaleArea = undefined;
-  }
-  connectedCallback() {
-    this.observer = new MutationObserver((mutations) => {
-      mutations.forEach((mutation) => {
-        var _a, _b;
-        if (mutation.attributeName === "class" || mutation.attributeName === "style") {
-          const offsetWidth = this.element.offsetWidth;
-          const offsetHeight = this.element.offsetHeight;
-          if (offsetWidth !== ((_a = this.offset) === null || _a === void 0 ? void 0 : _a.width) || offsetHeight !== ((_b = this.offset) === null || _b === void 0 ? void 0 : _b.height)) {
-            this.updateArea();
-          }
-          this.offset = {
-            width: offsetWidth,
-            height: offsetHeight
-          };
-        }
-      });
-    });
-    this.observer.observe(this.element, {
-      attributes: true
-    });
-  }
-  disconnectedCallback() {
-    var _a;
-    (_a = this.observer) === null || _a === void 0 ? void 0 : _a.disconnect();
-  }
-  componentDidLoad() {
-    this.viewsChanged();
-  }
-  render() {
-    return (index.h(index.Host, { onTouchStart: this.handleTouchStart, onTouchMove: this.handleTouchMove, onTouchEnd: this.handleTouchEnd }));
-  }
-  get element() { return index.getElement(this); }
-};
-MovableArea.style = areaCss;
+const index = require('./index-7c61bee9.js');
 
 const viewCss = "taro-movable-view-core{display:inline-block;position:absolute;left:0;top:0;width:10px;height:10px}";
 
-const MovableView = class {
+let MovableView = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.onChange = index.createEvent(this, "change", 7);
     this.onScale = index.createEvent(this, "scale", 7);
     this.onHTouchMove = index.createEvent(this, "htouchmove", 7);
     this.onVTouchMove = index.createEvent(this, "vtouchmove", 7);
+    /**
+     * 定义x轴方向的偏移，如果x的值不在可移动范围内，会自动移动到可移动范围；改变x的值会触发动画；单位支持px；
+     */
+    this.x = 0;
+    /**
+     * 定义y轴方向的偏移，如果y的值不在可移动范围内，会自动移动到可移动范围；改变y的值会触发动画；单位支持px；
+     */
+    this.y = 0;
+    /**
+     * 移动方向，属性值有all、vertical、horizontal、none
+     */
+    this.direction = "none";
+    /**
+     * 超过可移动区域后，是否还可以移动
+     */
+    this.outOfBounds = false;
+    /**
+     * 是否带有惯性
+     */
+    this.inertia = false;
+    /**
+     * 摩擦系数，用于控制惯性滑动的动画，值越大摩擦力越大，滑动越快停止；必须大于0，否则会被设置成默认值
+     */
+    this.friction = 2;
+    /**
+     * 阻尼系数，用于控制x或y改变时的动画和过界回弹的动画，值越大移动越快
+     */
+    this.damping = 20;
+    /**
+     * 是否禁用
+     */
+    this.disabled = false;
+    /**
+     * 是否支持双指缩放，默认缩放手势生效区域是在movable-view内
+     */
+    this.scale = false;
+    /**
+     * 定义缩放倍数最小值
+     */
+    this.scaleMin = .5;
+    /**
+     * 定义缩放倍数最大值
+     */
+    this.scaleMax = 10;
+    /**
+     * 定义缩放倍数，取值范围为 0.5 - 10
+     */
+    this.scaleValue = 1;
+    /**
+     * 是否使用动画
+     */
+    this.animation = true;
     /** 当前水平偏移 */
     this.translateX = 0;
     /** 当前垂直偏移 */
@@ -350,19 +251,6 @@ const MovableView = class {
       const y = touch.screenY - this.origin.y;
       this.setTransform(this.xMove ? (x + this.baseX) : 0, this.yMove ? (y + this.baseY) : 0);
     };
-    this.x = 0;
-    this.y = 0;
-    this.direction = "none";
-    this.outOfBounds = false;
-    this.inertia = false;
-    this.friction = 2;
-    this.damping = 20;
-    this.disabled = false;
-    this.scale = false;
-    this.scaleMin = .5;
-    this.scaleMax = 10;
-    this.scaleValue = 1;
-    this.animation = true;
   }
   watchX(newValue) {
     this.setTransform(parseFloat(`${newValue || 0}`), this.translateY);
@@ -477,7 +365,4 @@ const MovableView = class {
 };
 MovableView.style = viewCss;
 
-exports.taro_movable_area_core = MovableArea;
 exports.taro_movable_view_core = MovableView;
-
-//# sourceMappingURL=taro-movable-area-core_2.cjs.entry.js.map

package/dist/cjs/taro-navigation-bar-core.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-9174e0b1.js');
+const index = require('./index-7c61bee9.js');
 const helper = require('./helper-db78e01a.js');
 require('@tarojs/taro');
 
-const NavigationBar = class {
+let NavigationBar = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -19,5 +19,3 @@ const NavigationBar = class {
 };
 
 exports.taro_navigation_bar_core = NavigationBar;
-
-//# sourceMappingURL=taro-navigation-bar-core.cjs.entry.js.map

package/dist/cjs/taro-navigator-core.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-9174e0b1.js');
+const index = require('./index-7c61bee9.js');
 const Taro = require('@tarojs/taro');
 const index$1 = require('./index-f9d21cc5.js');
 
@@ -12,14 +12,12 @@ const Taro__default = /*#__PURE__*/_interopDefaultLegacy(Taro);
 
 const indexCss = ".navigator-hover{background:#efefef}";
 
-const Navigator = class {
+let Navigator = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.onSuccess = index.createEvent(this, "cuccess", 7);
     this.onFail = index.createEvent(this, "fail", 7);
     this.onComplete = index.createEvent(this, "Complete", 7);
-    this.hoverClass = undefined;
-    this.url = undefined;
     this.openType = 'navigate';
     this.isHover = false;
     this.delta = 0;
@@ -77,5 +75,3 @@ const Navigator = class {
 Navigator.style = indexCss;
 
 exports.taro_navigator_core = Navigator;
-
-//# sourceMappingURL=taro-navigator-core.cjs.entry.js.map

package/dist/cjs/taro-official-account-core.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-9174e0b1.js');
+const index = require('./index-7c61bee9.js');
 const helper = require('./helper-db78e01a.js');
 require('@tarojs/taro');
 
-const OfficialAccount = class {
+let OfficialAccount = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -19,5 +19,3 @@ const OfficialAccount = class {
 };
 
 exports.taro_official_account_core = OfficialAccount;
-
-//# sourceMappingURL=taro-official-account-core.cjs.entry.js.map

package/dist/cjs/taro-open-data-core.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-9174e0b1.js');
+const index = require('./index-7c61bee9.js');
 const helper = require('./helper-db78e01a.js');
 require('@tarojs/taro');
 
-const OpenData = class {
+let OpenData = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -19,5 +19,3 @@ const OpenData = class {
 };
 
 exports.taro_open_data_core = OpenData;
-
-//# sourceMappingURL=taro-open-data-core.cjs.entry.js.map

package/dist/cjs/taro-page-container-core.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-9174e0b1.js');
+const index = require('./index-7c61bee9.js');
 const helper = require('./helper-db78e01a.js');
 require('@tarojs/taro');
 
-const PageContainer = class {
+let PageContainer = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -19,5 +19,3 @@ const PageContainer = class {
 };
 
 exports.taro_page_container_core = PageContainer;
-
-//# sourceMappingURL=taro-page-container-core.cjs.entry.js.map

package/dist/cjs/taro-page-meta-core.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-9174e0b1.js');
+const index = require('./index-7c61bee9.js');
 const helper = require('./helper-db78e01a.js');
 require('@tarojs/taro');
 
-const PageMeta = class {
+let PageMeta = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
   }
@@ -19,5 +19,3 @@ const PageMeta = class {
 };
 
 exports.taro_page_meta_core = PageMeta;
-
-//# sourceMappingURL=taro-page-meta-core.cjs.entry.js.map

package/dist/cjs/taro-picker-core_2.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-9174e0b1.js');
+const index = require('./index-7c61bee9.js');
 const index$1 = require('./index-f9d21cc5.js');
 
 function getTimeRange(begin, end) {
@@ -154,13 +154,25 @@ const MASK_HEIGHT = LINE_HEIGHT * 7;
 
 const indexCss = ".weui-picker,.weui-picker__hd{font-size:12px}";
 
-const Picker = class {
+let Picker = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.onChange = index.createEvent(this, "change", 7);
     this.onColumnChange = index.createEvent(this, "columnchange", 7);
     this.onCancel = index.createEvent(this, "cancel", 7);
     this.index = [];
+    this.mode = 'selector';
+    this.disabled = false;
+    this.range = [];
+    this.start = '';
+    this.end = '';
+    this.fields = 'day';
+    this.name = '';
+    this.pickerValue = [];
+    this.height = [];
+    this.hidden = true;
+    this.fadeOut = false;
+    this.isWillLoadCalled = false;
     // 展示 Picker
     this.showPicker = () => {
       if (this.disabled)
@@ -348,20 +360,6 @@ const Picker = class {
       }
       return renderView;
     };
-    this.mode = 'selector';
-    this.disabled = false;
-    this.range = [];
-    this.rangeKey = undefined;
-    this.value = undefined;
-    this.start = '';
-    this.end = '';
-    this.fields = 'day';
-    this.name = '';
-    this.pickerValue = [];
-    this.height = [];
-    this.hidden = true;
-    this.fadeOut = false;
-    this.isWillLoadCalled = false;
   }
   componentWillLoad() {
     this.isWillLoadCalled = true;
@@ -503,22 +501,10 @@ const Picker = class {
 };
 Picker.style = indexCss;
 
-const TaroPickerGroup = class {
+let TaroPickerGroup = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.mode = undefined;
     this.range = [];
-    this.rangeKey = undefined;
-    this.height = undefined;
-    this.columnId = undefined;
-    this.updateHeight = undefined;
-    this.onColumnChange = undefined;
-    this.updateDay = undefined;
-    this.startY = undefined;
-    this.preY = undefined;
-    this.hadMove = undefined;
-    this.touchEnd = undefined;
-    this.isMove = undefined;
   }
   getPosition() {
     const transition = this.touchEnd ? 0.3 : 0;
@@ -685,5 +671,3 @@ const TaroPickerGroup = class {
 
 exports.taro_picker_core = Picker;
 exports.taro_picker_group = TaroPickerGroup;
-
-//# sourceMappingURL=taro-picker-core_2.cjs.entry.js.map

package/dist/cjs/taro-picker-view-column-core.cjs.entry.js

@@ -0,0 +1,95 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-7c61bee9.js');
+const index$1 = require('./index-47a1959e.js');
+
+const columnCss = ".taro-picker-view-column-container{display:-ms-flexbox;display:flex;overflow:scroll;overflow-x:hidden;position:relative;-ms-flex-direction:column;flex-direction:column;-ms-flex:1;flex:1;text-align:center}.taro-picker-view-column-container::-webkit-scrollbar{display:none}";
+
+let PickerViewColumn = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.onChange = index.createEvent(this, "onselect", 7);
+    this.onSelectStart = index.createEvent(this, "onselectstart", 7);
+    this.onSelectEnd = index.createEvent(this, "onselectend", 7);
+    // 初始化的选中位置
+    this.initialPosition = '0';
+    // 滑动距离上下留白区域-通过父视图和 indicator 计算而来
+    this.paddingVertical = 0;
+    this.isInit = false;
+    this.isMove = false;
+    // 滚动结束自动回到合适的位置
+    this.handleSelected = index$1.debounce(() => {
+      const childList = this.el.childNodes;
+      let sum = 0;
+      let selectedIndex = '0';
+      for (const index in childList) {
+        const item = childList[index];
+        const itemHeight = item.offsetHeight;
+        if (sum + itemHeight / 2.0 > this.el.scrollTop) {
+          selectedIndex = index;
+          break;
+        }
+        sum += itemHeight;
+      }
+      this.el.scrollTo({
+        top: sum,
+        behavior: 'smooth'
+      });
+      this.onChange.emit({
+        curIndex: this.col,
+        selectedIndex: selectedIndex
+      });
+      this.onSelectEnd.emit();
+    }, 500);
+  }
+  onScroll(_event) {
+    if (!this.isMove) {
+      this.isMove = true;
+      this.onSelectStart.emit();
+    }
+    this.handleSelected();
+  }
+  onMouseEnd() {
+    if (!this.isMove)
+      return;
+    this.isMove = false;
+    this.handleSelected();
+  }
+  onTouchEnd() {
+    this.isMove = false;
+    this.handleSelected();
+  }
+  componentDidUpdate() {
+    if (!this.isInit) {
+      this.isInit = true;
+      const childList = this.el.childNodes;
+      let idx = 0;
+      let sum = 0;
+      for (const index in childList) {
+        const item = childList[index];
+        if (this.initialPosition === index || !item || typeof item.offsetHeight !== 'number') {
+          break;
+        }
+        sum += item.offsetHeight;
+        idx++;
+      }
+      this.el.scrollTo({ top: sum });
+      if (idx >= childList.length) {
+        this.onChange.emit({
+          curIndex: this.col,
+          selectedIndex: idx - 1
+        });
+      }
+    }
+  }
+  render() {
+    const { paddingVertical = 0 } = this;
+    return (index.h(index.Host, { class: "taro-picker-view-column-container", style: { 'padding-top': `${paddingVertical}px`, 'padding-bottom': `${paddingVertical}px` } }));
+  }
+  get el() { return index.getElement(this); }
+};
+PickerViewColumn.style = columnCss;
+
+exports.taro_picker_view_column_core = PickerViewColumn;