@visactor/vrender-components 0.22.7-alpha.4 → 0.22.7-alpha.6

package/dist/index.es.js

@@ -14963,7 +14963,7 @@ class ScrollBar extends AbstractComponent {
             });
             const triggers = getEndTriggersOfDrag();
             const obj = vglobal.env === 'browser' ? vglobal : this.stage;
-            obj.addEventListener('pointermove', this._onSliderPointerMoveWithDelay, { capture: true });
+            obj.addEventListener('pointermove', this._onSliderPointerMoveWithDelay, { capture: true, passive: true });
             triggers.forEach((trigger) => {
                 obj.addEventListener(trigger, this._onSliderPointerUp);
             });
@@ -14988,6 +14988,7 @@ class ScrollBar extends AbstractComponent {
             return [currentPos, currentScrollValue];
         };
         this._onSliderPointerMove = (e) => {
+            e.preventDefault();
             const { stopSliderMovePropagation = true } = this.attribute;
             if (stopSliderMovePropagation) {
                 e.stopPropagation();
@@ -15001,7 +15002,6 @@ class ScrollBar extends AbstractComponent {
             ? this._onSliderPointerMove
             : delayMap$2[this.attribute.delayType](this._onSliderPointerMove, this.attribute.delayTime);
         this._onSliderPointerUp = (e) => {
-            e.preventDefault();
             const { range: preRange, limitRange = [0, 1] } = this.attribute;
             const preScrollRange = this.getScrollRange();
             const [currentPos, currentScrollValue] = this._computeScrollValue(e);
@@ -15146,7 +15146,7 @@ class ScrollBar extends AbstractComponent {
     _clearDragEvents() {
         const triggers = getEndTriggersOfDrag();
         const obj = vglobal.env === 'browser' ? vglobal : this.stage;
-        obj.removeEventListener('pointermove', this._onSliderPointerMoveWithDelay, { capture: true });
+        obj.removeEventListener('pointermove', this._onSliderPointerMoveWithDelay, { capture: true, passive: false });
         triggers.forEach((trigger) => {
             obj.removeEventListener(trigger, this._onSliderPointerUp);
         });
@@ -23015,9 +23015,13 @@ class DataZoom extends AbstractComponent {
             end: 1
         };
         this._statePointToData = state => state;
+        this._handleTouchMove = (e) => {
+            if (this._activeState) {
+                e.preventDefault();
+            }
+        };
         this._onHandlerPointerDown = (e, tag) => {
             this._clearDragEvents();
-            e.stopPropagation();
             if (tag === 'start') {
                 this._activeTag = DataZoomActiveTag.startHandler;
                 this._activeItem = this._startHandlerMask;
@@ -23043,13 +23047,13 @@ class DataZoom extends AbstractComponent {
             this._activeCache.lastPos = this.eventPosToStagePos(e);
             const evtTarget = vglobal.env === 'browser' ? vglobal : this.stage;
             const triggers = getEndTriggersOfDrag();
-            evtTarget.addEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
+            evtTarget.addEventListener('pointermove', this._onHandlerPointerMove, { capture: true, passive: false });
             triggers.forEach((trigger) => {
                 evtTarget.addEventListener(trigger, this._onHandlerPointerUp);
             });
         };
         this._pointerMove = (e) => {
-            e.stopPropagation();
+            e.preventDefault();
             const { start: startAttr, end: endAttr, brushSelect, realTime = true } = this.attribute;
             const pos = this.eventPosToStagePos(e);
             const { attPos, max } = this._layoutCache;
@@ -23079,12 +23083,12 @@ class DataZoom extends AbstractComponent {
                         end = end + dis;
                     }
                 }
-                this._activeCache.lastPos = pos;
                 brushSelect && this.renderDragMask();
             }
             start = Math.min(Math.max(start, 0), 1);
             end = Math.min(Math.max(end, 0), 1);
             if (startAttr !== start || endAttr !== end) {
+                this._activeCache.lastPos = pos;
                 this.setStateAttr(start, end, true);
                 if (realTime) {
                     this._dispatchEvent('change', {
@@ -23099,7 +23103,6 @@ class DataZoom extends AbstractComponent {
             ? this._pointerMove
             : delayMap$1[this.attribute.delayType](this._pointerMove, this.attribute.delayTime);
         this._onHandlerPointerUp = (e) => {
-            e.preventDefault();
             const { start, end, brushSelect, realTime = true } = this.attribute;
             if (this._activeState) {
                 if (this._activeTag === DataZoomActiveTag.background) {
@@ -23166,6 +23169,7 @@ class DataZoom extends AbstractComponent {
             this.addEventListener('pointerenter', this._onHandlerPointerEnter);
             this.addEventListener('pointerleave', this._onHandlerPointerLeave);
         }
+        vglobal.addEventListener('touchmove', this._handleTouchMove, { passive: false });
     }
     dragMaskSize() {
         const { position } = this.attribute;
@@ -23196,18 +23200,16 @@ class DataZoom extends AbstractComponent {
     _clearDragEvents() {
         const evtTarget = vglobal.env === 'browser' ? vglobal : this.stage;
         const triggers = getEndTriggersOfDrag();
-        evtTarget.removeEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
+        evtTarget.removeEventListener('pointermove', this._onHandlerPointerMove, { capture: true, passive: false });
         triggers.forEach((trigger) => {
             evtTarget.removeEventListener(trigger, this._onHandlerPointerUp);
         });
     }
     _onHandlerPointerEnter(e) {
-        e.stopPropagation();
         this._showText = true;
         this.renderText();
     }
     _onHandlerPointerLeave(e) {
-        e.stopPropagation();
         this._showText = false;
         this.renderText();
     }
@@ -27224,7 +27226,6 @@ class Slider extends AbstractComponent {
             this._dispatchTooltipEvent('sliderTooltipHide');
         };
         this._onHandlerPointerdown = (e) => {
-            e.stopPropagation();
             this._clearAllDragEvents();
             this._isChanging = true;
             const { x, y } = this.stage.eventPointTransform(e);
@@ -27232,14 +27233,14 @@ class Slider extends AbstractComponent {
             this._prePos = this._isHorizontal ? x : y;
             const triggers = getEndTriggersOfDrag();
             const obj = vglobal.env === 'browser' ? vglobal : this.stage;
-            obj.addEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
+            obj.addEventListener('pointermove', this._onHandlerPointerMove, { capture: true, passive: false });
             triggers.forEach((trigger) => {
                 obj.addEventListener(trigger, this._onHandlerPointerUp);
             });
         };
         this._onHandlerPointerMove = (e) => {
             var _a, _b;
-            e.stopPropagation();
+            e.preventDefault();
             this._isChanging = true;
             const { railWidth, railHeight, min, max } = this.attribute;
             if (max === min) {
@@ -27275,26 +27276,29 @@ class Slider extends AbstractComponent {
             this._dispatchChangeEvent();
         };
         this._onHandlerPointerUp = (e) => {
-            e.preventDefault();
             this._isChanging = false;
             this._currentHandler = null;
             this._clearAllDragEvents();
         };
+        this._handleTouchMove = (e) => {
+            if (this._isChanging) {
+                e.preventDefault();
+            }
+        };
         this._onTrackPointerdown = (e) => {
-            e.stopPropagation();
             this._clearAllDragEvents();
             this._isChanging = true;
             const { x, y } = this.stage.eventPointTransform(e);
             this._prePos = this._isHorizontal ? x : y;
             const triggers = getEndTriggersOfDrag();
             const obj = vglobal.env === 'browser' ? vglobal : this.stage;
-            obj.addEventListener('pointermove', this._onTrackPointerMove, { capture: true });
+            obj.addEventListener('pointermove', this._onTrackPointerMove, { capture: true, passive: false });
             triggers.forEach((trigger) => {
                 obj.addEventListener(trigger, this._onTrackPointerUp);
             });
         };
         this._onTrackPointerMove = (e) => {
-            e.stopPropagation();
+            e.preventDefault();
             this._isChanging = true;
             const { railWidth, railHeight, min, max, inverse } = this.attribute;
             if (max === min) {
@@ -27346,12 +27350,10 @@ class Slider extends AbstractComponent {
             this._dispatchChangeEvent();
         };
         this._onTrackPointerUp = (e) => {
-            e.preventDefault();
             this._isChanging = false;
             this._clearAllDragEvents();
         };
         this._onRailPointerDown = (e) => {
-            e.stopPropagation();
             this._clearAllDragEvents();
             this._isChanging = true;
             const { railWidth, railHeight, min, max } = this.attribute;
@@ -27730,6 +27732,7 @@ class Slider extends AbstractComponent {
                 this._track.addEventListener('pointerdown', this._onTrackPointerdown);
             }
             this._railContainer.addEventListener('pointerdown', this._onRailPointerDown);
+            vglobal.addEventListener('touchmove', this._handleTouchMove, { passive: false });
         }
     }
     _bindTooltipEvents() {
@@ -27743,11 +27746,11 @@ class Slider extends AbstractComponent {
     _clearAllDragEvents() {
         const triggers = getEndTriggersOfDrag();
         const obj = vglobal.env === 'browser' ? vglobal : this.stage;
-        obj.removeEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
+        obj.removeEventListener('pointermove', this._onHandlerPointerMove, { capture: true, passive: false });
         triggers.forEach((trigger) => {
             obj.removeEventListener(trigger, this._onHandlerPointerUp);
         });
-        obj.removeEventListener('pointermove', this._onTrackPointerMove, { capture: true });
+        obj.removeEventListener('pointermove', this._onTrackPointerMove, { capture: true, passive: false });
         triggers.forEach((trigger) => {
             obj.removeEventListener(trigger, this._onTrackPointerUp);
         });
@@ -31485,6 +31488,6 @@ StoryLabelItem.defaultAttributes = {
     theme: 'default'
 };
 
-const version = "0.22.7-alpha.4";
+const version = "0.22.7-alpha.6";
 
 export { AXIS_ELEMENT_NAME, AbstractComponent, ArcInfo, ArcLabel, ArcSegment, AxisStateValue, BasePlayer, Brush, CheckBox, CircleAxis, CircleAxisGrid, CircleCrosshair, ColorContinuousLegend, ContinuousPlayer, DEFAULT_ITEM_SPACE_COL, DEFAULT_ITEM_SPACE_ROW, DEFAULT_LABEL_SPACE, DEFAULT_PAGER_SPACE, DEFAULT_SHAPE_SIZE, DEFAULT_SHAPE_SPACE, DEFAULT_STATES$1 as DEFAULT_STATES, DEFAULT_TITLE_SPACE, DEFAULT_VALUE_SPACE, DataLabel, DataZoom, DataZoomActiveTag, DirectionEnum, DiscreteLegend, DiscretePlayer, EmptyTip, GroupTransition, IMarkAreaLabelPosition, IMarkCommonArcLabelPosition, IMarkLineLabelPosition, IMarkPointItemPosition, IOperateType, Indicator, LEGEND_ELEMENT_NAME, LabelBase, LegendEvent, LegendStateValue, LineAxis, LineAxisGrid, LineCrosshair, LineLabel, LinkPath, MarkArcArea, MarkArcLine, MarkArea, MarkLine, MarkPoint, Pager, PlayerEventEnum, PolygonCrosshair, PolygonSectorCrosshair, PopTip, Radio, RectCrosshair, RectLabel, SLIDER_ELEMENT_NAME, ScrollBar, SectorCrosshair, Segment, SizeContinuousLegend, Slider, StoryLabelItem, Switch, SymbolLabel, Tag, Timeline, Title, Tooltip, TopZIndex, VTag, WeatherBox, alignTextInLine, angle, angleLabelOrientAttribute, angleTo, cartesianTicks, clampRadian, computeOffsetForlimit, continuousTicks, contrastAccessibilityChecker, convertDomainToTickData, createTextGraphicByType, deltaXYToAngle, fuzzyEqualNumber, getAxisBreakSymbolAttrs, getCircleLabelPosition, getCirclePoints, getCircleVerticalVector, getElMap, getHorizontalPath, getMarksByName, getNoneGroupMarksByName, getPolarAngleLabelPosition, getPolygonPath, getSizeHandlerPath, getTextAlignAttrOfVerticalDir, getTextType, getVerticalCoord, getVerticalPath, hasOverlap, htmlAttributeTransform, initTextMeasure, isInRange, isPostiveXAxis, isRichText, isVisible, labelSmartInvert, length, limitShapeInBounds, linearDiscreteTicks, loadPoptip, loadScrollbar, measureTextSize, normalize, polarAngleAxisDiscreteTicks, polarTicks, reactAttributeTransform, registerArcDataLabel, registerLineDataLabel, registerMarkArcAreaAnimate, registerMarkArcLineAnimate, registerMarkAreaAnimate, registerMarkLineAnimate, registerMarkPointAnimate, registerRectDataLabel, registerSymbolDataLabel, removeRepeatPoint, richTextAttributeTransform, scale, scrollbarModule, setPoptipTheme, smartInvertStrategy, tan2AngleToAngle, textIntersect, ticks, traverseGroup, version };

package/es/data-zoom/data-zoom.d.ts

@@ -158,6 +158,7 @@ export declare class DataZoom extends AbstractComponent<Required<DataZoomAttribu
     constructor(attributes: DataZoomAttributes, options?: ComponentOptions);
     setAttributes(params: Partial<Required<DataZoomAttributes>>, forceUpdateTag?: boolean): void;
     protected bindEvents(): void;
+    private _handleTouchMove;
     protected dragMaskSize(): number;
     protected setStateAttr(start: number, end: number, shouldRender: boolean): void;
     protected eventPosToStagePos(e: FederatedPointerEvent): {

package/es/data-zoom/data-zoom.js

@@ -60,8 +60,10 @@ export class DataZoom extends AbstractComponent {
         }, this.state = {
             start: 0,
             end: 1
-        }, this._statePointToData = state => state, this._onHandlerPointerDown = (e, tag) => {
-            this._clearDragEvents(), e.stopPropagation(), "start" === tag ? (this._activeTag = DataZoomActiveTag.startHandler, 
+        }, this._statePointToData = state => state, this._handleTouchMove = e => {
+            this._activeState && e.preventDefault();
+        }, this._onHandlerPointerDown = (e, tag) => {
+            this._clearDragEvents(), "start" === tag ? (this._activeTag = DataZoomActiveTag.startHandler, 
             this._activeItem = this._startHandlerMask) : "end" === tag ? (this._activeTag = DataZoomActiveTag.endHandler, 
             this._activeItem = this._endHandlerMask) : "middleRect" === tag ? (this._activeTag = DataZoomActiveTag.middleHandler, 
             this._activeItem = this._middleHandlerRect) : "middleSymbol" === tag ? (this._activeTag = DataZoomActiveTag.middleHandler, 
@@ -70,27 +72,27 @@ export class DataZoom extends AbstractComponent {
             this._activeCache.lastPos = this.eventPosToStagePos(e);
             const evtTarget = "browser" === vglobal.env ? vglobal : this.stage, triggers = getEndTriggersOfDrag();
             evtTarget.addEventListener("pointermove", this._onHandlerPointerMove, {
-                capture: !0
+                capture: !0,
+                passive: !1
             }), triggers.forEach((trigger => {
                 evtTarget.addEventListener(trigger, this._onHandlerPointerUp);
             }));
         }, this._pointerMove = e => {
-            e.stopPropagation();
+            e.preventDefault();
             const {start: startAttr, end: endAttr, brushSelect: brushSelect, realTime: realTime = !0} = this.attribute, pos = this.eventPosToStagePos(e), {attPos: attPos, max: max} = this._layoutCache, dis = (pos[attPos] - this._activeCache.lastPos[attPos]) / max;
             let {start: start, end: end} = this.state;
             this._activeState && (this._activeTag === DataZoomActiveTag.middleHandler ? this.moveZoomWithMiddle((this.state.start + this.state.end) / 2 + dis) : this._activeTag === DataZoomActiveTag.startHandler ? start + dis > end ? (start = end, 
             end = start + dis, this._activeTag = DataZoomActiveTag.endHandler) : start += dis : this._activeTag === DataZoomActiveTag.endHandler && (end + dis < start ? (end = start, 
             start = end + dis, this._activeTag = DataZoomActiveTag.startHandler) : end += dis), 
-            this._activeCache.lastPos = pos, brushSelect && this.renderDragMask()), start = Math.min(Math.max(start, 0), 1), 
-            end = Math.min(Math.max(end, 0), 1), startAttr === start && endAttr === end || (this.setStateAttr(start, end, !0), 
-            realTime && this._dispatchEvent("change", {
+            brushSelect && this.renderDragMask()), start = Math.min(Math.max(start, 0), 1), 
+            end = Math.min(Math.max(end, 0), 1), startAttr === start && endAttr === end || (this._activeCache.lastPos = pos, 
+            this.setStateAttr(start, end, !0), realTime && this._dispatchEvent("change", {
                 start: start,
                 end: end,
                 tag: this._activeTag
             }));
         }, this._onHandlerPointerMove = 0 === this.attribute.delayTime ? this._pointerMove : delayMap[this.attribute.delayType](this._pointerMove, this.attribute.delayTime), 
         this._onHandlerPointerUp = e => {
-            e.preventDefault();
             const {start: start, end: end, brushSelect: brushSelect, realTime: realTime = !0} = this.attribute;
             if (this._activeState && this._activeTag === DataZoomActiveTag.background) {
                 const pos = this.eventPosToStagePos(e);
@@ -122,7 +124,9 @@ export class DataZoom extends AbstractComponent {
         brushSelect && this._previewGroup && this._previewGroup.addEventListener("pointerdown", (e => this._onHandlerPointerDown(e, "background"))), 
         this._selectedPreviewGroup && this._selectedPreviewGroup.addEventListener("pointerdown", (e => this._onHandlerPointerDown(e, selectedTag))), 
         "auto" === showDetail && (this.addEventListener("pointerenter", this._onHandlerPointerEnter), 
-        this.addEventListener("pointerleave", this._onHandlerPointerLeave));
+        this.addEventListener("pointerleave", this._onHandlerPointerLeave)), vglobal.addEventListener("touchmove", this._handleTouchMove, {
+            passive: !1
+        });
     }
     dragMaskSize() {
         const {position: position} = this.attribute, {attPos: attPos, max: max} = this._layoutCache;
@@ -146,16 +150,17 @@ export class DataZoom extends AbstractComponent {
     _clearDragEvents() {
         const evtTarget = "browser" === vglobal.env ? vglobal : this.stage, triggers = getEndTriggersOfDrag();
         evtTarget.removeEventListener("pointermove", this._onHandlerPointerMove, {
-            capture: !0
+            capture: !0,
+            passive: !1
         }), triggers.forEach((trigger => {
             evtTarget.removeEventListener(trigger, this._onHandlerPointerUp);
         }));
     }
     _onHandlerPointerEnter(e) {
-        e.stopPropagation(), this._showText = !0, this.renderText();
+        this._showText = !0, this.renderText();
     }
     _onHandlerPointerLeave(e) {
-        e.stopPropagation(), this._showText = !1, this.renderText();
+        this._showText = !1, this.renderText();
     }
     backgroundDragZoom(startPos, endPos) {
         const {attPos: attPos, max: max} = this._layoutCache, {position: position} = this.attribute, startPosInComponent = startPos[attPos] - position[attPos], endPosInComponent = endPos[attPos] - position[attPos], start = Math.min(Math.max(Math.min(startPosInComponent, endPosInComponent) / max, 0), 1), end = Math.min(Math.max(Math.max(startPosInComponent, endPosInComponent) / max, 0), 1);