@visactor/vrender-components 0.16.1-alpha.0 → 0.16.2-alpha.0

package/dist/index.js

@@ -4684,7 +4684,7 @@
   function applyStrokeStyle(ctx, character) {
     var strokeStyle = character && character.stroke || defaultFormatting.stroke;
     if (!strokeStyle) return void (ctx.globalAlpha = 0);
-    ctx.globalAlpha = 1, ctx.lineWidth = 1, ctx.strokeStyle = strokeStyle;
+    ctx.globalAlpha = 1, ctx.lineWidth = character && "number" == typeof character.lineHeight ? character.lineHeight : 1, ctx.strokeStyle = strokeStyle;
     var fontSize = character.fontSize || 16;
     switch (character.script) {
       case "super":
@@ -5887,7 +5887,7 @@
     }, {
       key: "stopPropagation",
       value: function stopPropagation() {
-        this.propagationStopped = !0;
+        this.nativeEvent instanceof Event && this.nativeEvent.cancelable && this.nativeEvent.stopPropagation(), this.propagationStopped = !0;
       }
     }, {
       key: "initEvent",
@@ -6563,7 +6563,7 @@
           void 0 === step.props[k] && (step.props[k] = _this7.target.getDefaultAttribute(k));
         }); lastStep.prev;) lastStep.props && (lastStep.propKeys || (lastStep.propKeys = Object.keys(lastStep.props)), lastStep.propKeys.forEach(function (key) {
           void 0 === _props[key] && (_props[key] = lastStep.props[key]);
-        })), lastStep = lastStep.prev;
+        })), step.propKeys = Object.keys(step.props), lastStep = lastStep.prev;
         var initProps = this.stepHead.props;
         step.propKeys || (step.propKeys = Object.keys(_props)), step.propKeys.forEach(function (key) {
           if (void 0 === initProps[key]) {
@@ -7490,7 +7490,7 @@
     }, {
       key: "clearStates",
       value: function clearStates(hasAnimation) {
-        this.hasState() && this.normalAttrs && this.applyStateAttrs(this.normalAttrs, this.currentStates, hasAnimation, !0), this.normalAttrs = null, this.currentStates = [];
+        this.hasState() && this.normalAttrs ? (this.currentStates = [], this.applyStateAttrs(this.normalAttrs, this.currentStates, hasAnimation, !0)) : this.currentStates = [], this.normalAttrs = null;
       }
     }, {
       key: "removeState",
@@ -11403,9 +11403,7 @@
       _classCallCheck(this, Line);
       this.left = left, this.width = width, this.baseline = baseline, this.ascent = ascent, this.descent = descent, this.top = baseline - ascent, this.paragraphs = lineBuffer.map(function (p) {
         return p;
-      }), this.textAlign = (this.paragraphs[0] instanceof RichTextIcon ? this.paragraphs[0].attribute.textAlign : this.paragraphs[0].character.textAlign) || "left", this.direction = direction, this.directionKey = DIRECTION_KEY[this.direction];
-      var directionKey = this.directionKey;
-      this.actualWidth = 0;
+      }), this.textAlign = (this.paragraphs[0] instanceof RichTextIcon ? this.paragraphs[0].attribute.textAlign : this.paragraphs[0].character.textAlign) || "left", this.direction = direction, this.directionKey = DIRECTION_KEY[this.direction], this.actualWidth = 0;
       var maxHeight = 0;
       this.paragraphs.forEach(function (word, index) {
         if (0 === index && word instanceof Paragraph) {
@@ -11413,24 +11411,30 @@
           0 !== (null == result ? void 0 : result.index) && (word.text = word.text.slice(null == result ? void 0 : result.index), word.updateWidth());
         }
         _this.actualWidth += word[_this.directionKey.width], maxHeight = Math.max(word[_this.directionKey.height], maxHeight);
-      }), this.height = maxHeight, this.blankWidth = isWidthMax ? 0 : this.width - this.actualWidth;
-      var x = this.left,
-        spacing = 0;
-      if (this.actualWidth < width && !isWidthMax) switch (this.textAlign) {
-        case "right":
-          x = width - this.actualWidth;
-          break;
-        case "center":
-          x = (width - this.actualWidth) / 2;
-          break;
-        case "justify":
-          this.paragraphs.length < 2 ? x = (width - this.actualWidth) / 2 : spacing = (width - this.actualWidth) / (this.paragraphs.length - 1);
-      }
-      this.paragraphs.map(function (paragraph) {
-        paragraph instanceof RichTextIcon ? (paragraph["_" + directionKey.x] = x, x += paragraph[directionKey.width] + spacing, paragraph["_" + directionKey.y] = "top" === paragraph.attribute.textBaseline ? 0 : "bottom" === paragraph.attribute.textBaseline ? maxHeight - paragraph.height : (maxHeight - paragraph.height) / 2) : (paragraph[directionKey.left] = x, x += paragraph[directionKey.width] + spacing);
-      });
+      }), this.height = maxHeight, this.blankWidth = isWidthMax ? 0 : this.width - this.actualWidth, this.calcOffset(width, isWidthMax);
     }
     _createClass(Line, [{
+      key: "calcOffset",
+      value: function calcOffset(width, isWidthMax) {
+        var directionKey = this.directionKey,
+          maxHeight = this.height;
+        var x = this.left,
+          spacing = 0;
+        if (this.actualWidth < width && !isWidthMax) switch (this.textAlign) {
+          case "right":
+            x = width - this.actualWidth;
+            break;
+          case "center":
+            x = (width - this.actualWidth) / 2;
+            break;
+          case "justify":
+            this.paragraphs.length < 2 ? x = (width - this.actualWidth) / 2 : spacing = (width - this.actualWidth) / (this.paragraphs.length - 1);
+        }
+        this.paragraphs.map(function (paragraph) {
+          paragraph instanceof RichTextIcon ? (paragraph["_" + directionKey.x] = x, x += paragraph[directionKey.width] + spacing, paragraph["_" + directionKey.y] = "top" === paragraph.attribute.textBaseline ? 0 : "bottom" === paragraph.attribute.textBaseline ? maxHeight - paragraph.height : (maxHeight - paragraph.height) / 2) : (paragraph[directionKey.left] = x, x += paragraph[directionKey.width] + spacing);
+        });
+      }
+    }, {
       key: "draw",
       value: function draw(ctx, lastLine, x, y, drawIcon) {
         var _this2 = this;
@@ -11710,10 +11714,22 @@
           var textParts = textConfig[i].text.split("\n");
           for (var j = 0; j < textParts.length; j++) paragraphs.push(new Paragraph(textParts[j], 0 !== j, textConfig[i]));
         } else paragraphs.push(new Paragraph(textConfig[i].text, !1, textConfig[i]));
-        var frame = new Frame(0, 0, ("number" == typeof maxWidth && (!width || width > maxWidth) ? maxWidth : width) || 0, ("number" == typeof maxHeight && (!height || height > maxHeight) ? maxHeight : height) || 0, ellipsis, wordBreak, verticalDirection, textAlign, textBaseline, layoutDirection || "horizontal", "number" == typeof maxWidth && (!width || width > maxWidth), "number" == typeof maxHeight && (!height || height > maxHeight), singleLine || !1, null === (_a = this._frameCache) || void 0 === _a ? void 0 : _a.icons),
+        var maxWidthFinite = "number" == typeof maxWidth && Number.isFinite(maxWidth) && maxWidth > 0,
+          maxHeightFinite = "number" == typeof maxHeight && Number.isFinite(maxHeight) && maxHeight > 0,
+          richTextWidthEnable = "number" == typeof width && Number.isFinite(width) && width > 0 && (!maxWidthFinite || width <= maxWidth),
+          richTextHeightEnable = "number" == typeof height && Number.isFinite(height) && height > 0 && (!maxHeightFinite || height <= maxHeight),
+          frame = new Frame(0, 0, (richTextWidthEnable ? width : maxWidthFinite ? maxWidth : 0) || 0, (richTextHeightEnable ? height : maxHeightFinite ? maxHeight : 0) || 0, ellipsis, wordBreak, verticalDirection, textAlign, textBaseline, layoutDirection || "horizontal", !richTextWidthEnable && maxWidthFinite, !richTextHeightEnable && maxHeightFinite, singleLine || !1, null === (_a = this._frameCache) || void 0 === _a ? void 0 : _a.icons),
           wrapper = new Wrapper(frame);
         for (var _i = 0; _i < paragraphs.length; _i++) wrapper.deal(paragraphs[_i]);
-        wrapper.send(), this._frameCache = frame;
+        wrapper.send();
+        if (!("horizontal" === frame.layoutDirection ? richTextWidthEnable : richTextHeightEnable)) {
+          var frameSize = frame.getActualSizeWidthEllipsis();
+          var offsetSize = "horizontal" === frame.layoutDirection ? frameSize.width : frameSize.height;
+          ("horizontal" === frame.layoutDirection ? maxWidthFinite : maxHeightFinite) && (offsetSize = Math.min(offsetSize, "horizontal" === frame.layoutDirection ? maxWidth : maxHeight)), frame.lines.forEach(function (l) {
+            l.calcOffset(offsetSize, !1);
+          });
+        }
+        this._frameCache = frame;
       }
     }, {
       key: "clone",
@@ -16788,7 +16804,7 @@
       value: function drawItem(graphic, renderService, drawContext, drawContribution, params) {
         if (!graphic.attribute._debug_bounds) return !1;
         var context = drawContext.context;
-        context.highPerformanceSave(), context.setTransformFromMatrix(graphic.parent.globalTransMatrix, !0);
+        context.highPerformanceSave(), graphic.parent && context.setTransformFromMatrix(graphic.parent.globalTransMatrix, !0), graphic.glyphHost && graphic.glyphHost.parent && context.setTransformFromMatrix(graphic.glyphHost.parent.globalTransMatrix, !0);
         var b = graphic.AABBBounds;
         return !0 !== graphic.attribute._debug_bounds && graphic.attribute._debug_bounds(context, graphic), context.strokeRect(b.x1, b.y1, b.width(), b.height()), context.highPerformanceRestore(), !0;
       }
@@ -18021,35 +18037,36 @@
     if ("object" == (typeof Reflect === "undefined" ? "undefined" : _typeof(Reflect)) && "function" == typeof Reflect.decorate) r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) (d = decorators[i]) && (r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r);
     return c > 3 && r && Object.defineProperty(target, key, r), r;
   };
-  var DefaultCanvasGlyphRender = /*#__PURE__*/function (_BaseRender) {
-    _inherits(DefaultCanvasGlyphRender, _BaseRender);
-    var _super = _createSuper(DefaultCanvasGlyphRender);
+  var DefaultCanvasGlyphRender = /*#__PURE__*/function () {
     function DefaultCanvasGlyphRender() {
-      var _this;
       _classCallCheck(this, DefaultCanvasGlyphRender);
-      _this = _super.apply(this, arguments), _this.numberType = GLYPH_NUMBER_TYPE;
-      return _this;
+      this.numberType = GLYPH_NUMBER_TYPE;
     }
     _createClass(DefaultCanvasGlyphRender, [{
       key: "drawShape",
       value: function drawShape(glyph, context, x, y, drawContext, params, fillCb, strokeCb) {
+        drawContext.drawContribution && glyph.getSubGraphic().forEach(function (item) {
+          var renderer = drawContext.drawContribution.getRenderContribution(item);
+          renderer && renderer.drawShape && renderer.drawShape(item, context, x, y, drawContext, params, fillCb, strokeCb);
+        });
+      }
+    }, {
+      key: "draw",
+      value: function draw(glyph, renderService, drawContext, params) {
+        var context = drawContext.context;
+        if (!context) return;
+        if (context.highPerformanceSave(), !drawContext.drawContribution) return;
         var glyphTheme = getTheme(glyph),
           subGraphic = glyph.getSubGraphic();
         subGraphic.length && subGraphic.forEach(function (g) {
           drawContext.drawContribution.renderItem(g, drawContext, {
             theme: glyphTheme
           });
-        });
-      }
-    }, {
-      key: "draw",
-      value: function draw(glyph, renderService, drawContext, params) {
-        var glyphAttr = getTheme(glyph).glyph;
-        this._draw(glyph, glyphAttr, !1, drawContext, params);
+        }), context.highPerformanceRestore();
       }
     }]);
     return DefaultCanvasGlyphRender;
-  }(BaseRender);
+  }();
   DefaultCanvasGlyphRender = __decorate$6([injectable()], DefaultCanvasGlyphRender);
 
   var __decorate$5 = undefined && undefined.__decorate || function (decorators, target, key, desc) {
@@ -18592,11 +18609,11 @@
               const { direction } = this.attribute;
               this._prePos = direction === 'horizontal' ? e.clientX : e.clientY;
               if (vglobal.env === 'browser') {
-                  vglobal.addEventListener('pointermove', this._onSliderPointerMove);
+                  vglobal.addEventListener('pointermove', this._onSliderPointerMove, { capture: true });
                   vglobal.addEventListener('pointerup', this._onSliderPointerUp);
               }
               else {
-                  this._slider.addEventListener('pointermove', this._onSliderPointerMove);
+                  this._slider.addEventListener('pointermove', this._onSliderPointerMove, { capture: true });
                   this._slider.addEventListener('pointerup', this._onSliderPointerUp);
                   this._slider.addEventListener('pointerupoutside', this._onSliderPointerUp);
               }
@@ -18663,6 +18680,9 @@
           return this.attribute.range;
       }
       bindEvents() {
+          if (this.attribute.disableTriggerEvent) {
+              return;
+          }
           if (this._rail) {
               this._rail.addEventListener('pointerdown', this._onRailPointerDown);
           }
@@ -20302,6 +20322,21 @@
                   this._lastSelect = target;
               }
           };
+          this._handleRelatedGraphicSetState = (e) => {
+              var _a, _b, _c;
+              if (((_a = e.detail) === null || _a === void 0 ? void 0 : _a.type) === AttributeUpdateType.STATE) {
+                  const currentStates = (_c = (_b = e.target) === null || _b === void 0 ? void 0 : _b.currentStates) !== null && _c !== void 0 ? _c : [];
+                  const label = this._graphicToText.get(e.target);
+                  if (label) {
+                      if (label.text) {
+                          label.text.useStates(currentStates);
+                      }
+                      if (label.labelLine) {
+                          label.labelLine.useStates(currentStates);
+                      }
+                  }
+              }
+          };
       }
       labeling(textBounds, graphicBounds, position, offset) {
           return;
@@ -20340,6 +20375,9 @@
           this._renderLabels(labels);
       }
       _bindEvent(target) {
+          if (this.attribute.disableTriggerEvent) {
+              return;
+          }
           if (!target) {
               return;
           }
@@ -20352,7 +20390,7 @@
               target.addEventListener('pointerdown', this._onClick);
           }
       }
-      _setStates(target) {
+      _setStatesOfText(target) {
           if (!target) {
               return;
           }
@@ -20362,10 +20400,20 @@
           }
           target.states = state;
       }
+      _setStatesOfLabelLine(target) {
+          if (!target) {
+              return;
+          }
+          const state = this.attribute.labelLineState;
+          if (!state || vutils.isEmpty(state)) {
+              return;
+          }
+          target.states = state;
+      }
       _createLabelText(attributes) {
           const text = createText(attributes);
           this._bindEvent(text);
-          this._setStates(text);
+          this._setStatesOfText(text);
           return text;
       }
       _prepare() {
@@ -20561,7 +20609,11 @@
                   if (relatedGraphic) {
                       const { from, to } = getAnimationAttributes(text.attribute, 'fadeIn');
                       this.add(text);
-                      labelLine && this.add(labelLine);
+                      if (labelLine) {
+                          this._setStatesOfLabelLine(labelLine);
+                          this.add(labelLine);
+                      }
+                      this._syncStateWithRelatedGraphic(relatedGraphic);
                       relatedGraphic.once('animate-bind', () => {
                           text.setAttributes(from);
                           const listener = this._afterRelatedGraphicAttributeUpdate(text, texts, index, relatedGraphic, {
@@ -20621,6 +20673,7 @@
                   if (labelLine) {
                       this.add(labelLine);
                   }
+                  this._syncStateWithRelatedGraphic(relatedGraphic);
               }
               else if (state === 'update') {
                   const prevLabel = prevTextMap.get(relatedGraphic);
@@ -20640,6 +20693,11 @@
           });
           this._graphicToText = currentTextMap;
       }
+      _syncStateWithRelatedGraphic(relatedGraphic) {
+          if (this.attribute.syncState) {
+              relatedGraphic.on('afterAttributeUpdate', this._handleRelatedGraphicSetState);
+          }
+      }
       _afterRelatedGraphicAttributeUpdate(text, texts, index, relatedGraphic, { mode, duration, easing, to, delay }) {
           const listener = (event) => {
               var _a;
@@ -21169,8 +21227,9 @@
                   maxRadius = currentMarks.attribute.outerRadius;
               }
           });
-          currentMarks.forEach((currentMark, index) => {
+          data.forEach((d, index) => {
               var _a, _b;
+              const currentMark = this._idToGraphic.get(d.id);
               const graphicAttribute = currentMark.attribute;
               const center = { x: (_a = graphicAttribute === null || graphicAttribute === void 0 ? void 0 : graphicAttribute.x) !== null && _a !== void 0 ? _a : 0, y: (_b = graphicAttribute === null || graphicAttribute === void 0 ? void 0 : graphicAttribute.y) !== null && _b !== void 0 ? _b : 0 };
               if (!vutils.isNil(data[index]) && !vutils.isNil(textBoundsArray[index])) {
@@ -21396,17 +21455,6 @@
               labelPosition.x = cx + alignOffset + flag * (spaceWidth + targetCenterOffset);
           }
       }
-      _computeAlignOffset(align, labelWidth, alignFlag) {
-          switch (align) {
-              case 'left':
-                  return alignFlag < 0 ? -labelWidth : 0;
-              case 'right':
-                  return alignFlag < 0 ? 0 : labelWidth;
-              case 'center':
-              default:
-                  return (labelWidth / 2) * alignFlag;
-          }
-      }
       _computeAlign(arc, attribute) {
           var _a, _b, _c, _d, _e, _f;
           const labelConfig = attribute;
@@ -22264,6 +22312,9 @@
           this._bindEvent();
       }
       _bindEvent() {
+          if (this.attribute.disableTriggerEvent) {
+              return;
+          }
           const { hover, select } = this.attribute;
           if (hover) {
               this._innerView.addEventListener('pointermove', this._onHover);
@@ -24248,6 +24299,9 @@
           vutils.isFunction(updateStateCallback) && (this._updateStateCallback = updateStateCallback);
       }
       bindEvents() {
+          if (this.attribute.disableTriggerEvent) {
+              return;
+          }
           const { showDetail, brushSelect } = this.attribute;
           if (this._startHandler) {
               this._startHandler.addEventListener('pointerdown', (e) => this._onHandlerPointerDown(e, 'start'));
@@ -24275,10 +24329,14 @@
               this._selectedPreviewGroup.addEventListener('pointerdown', (e) => this._onHandlerPointerDown(e, selectedTag));
           }
           if (vglobal.env === 'browser') {
-              vglobal.addEventListener('pointermove', this._onHandlerPointerMove.bind(this));
+              vglobal.addEventListener('pointermove', this._onHandlerPointerMove.bind(this), {
+                  capture: true
+              });
               vglobal.addEventListener('pointerup', this._onHandlerPointerUp.bind(this));
           }
-          this.addEventListener('pointermove', this._onHandlerPointerMove);
+          this.addEventListener('pointermove', this._onHandlerPointerMove, {
+              capture: true
+          });
           this.addEventListener('pointerup', this._onHandlerPointerUp);
           this.addEventListener('pointerupoutside', this._onHandlerPointerUp);
           if (showDetail === 'auto') {
@@ -25600,6 +25658,9 @@
           this._bindEvents();
       }
       _bindEvents() {
+          if (this.attribute.disableTriggerEvent) {
+              return;
+          }
           if (this.preHandler) {
               this.preHandler.addEventListener('pointerenter', this._onHover);
               this.preHandler.addEventListener('pointerleave', this._onUnHover);
@@ -25977,6 +26038,9 @@
           }
       }
       _bindEvents() {
+          if (this.attribute.disableTriggerEvent) {
+              return;
+          }
           if (!this._itemsContainer) {
               return;
           }
@@ -26110,7 +26174,7 @@
       }
       _renderPager(isHorizontal) {
           const renderStartY = this._title ? this._title.AABBBounds.height() + vutils.get(this.attribute, 'title.space', 8) : 0;
-          const { maxWidth, maxHeight, maxCol = 1, maxRow = 2, item = {}, pager = {} } = this.attribute;
+          const { maxWidth, maxHeight, maxCol = 1, maxRow = 2, item = {}, pager = {}, disableTriggerEvent } = this.attribute;
           const { spaceCol = DEFAULT_ITEM_SPACE_COL, spaceRow = DEFAULT_ITEM_SPACE_ROW } = item;
           const itemsContainer = this._itemsContainer;
           const { animation = true, animationDuration = 450, animationEasing = 'quadIn', space: pagerSpace = DEFAULT_PAGER_SPACE } = pager, pageStyle = __rest(pager, ["animation", "animationDuration", "animationEasing", "space"]);
@@ -26121,12 +26185,12 @@
           let startY = 0;
           let pages = 1;
           if (isHorizontal) {
-              pagerComp = new Pager(Object.assign({ layout: maxRow === 1 ? 'horizontal' : 'vertical', total: 99 }, vutils.merge({
+              pagerComp = new Pager(Object.assign(Object.assign({ layout: maxRow === 1 ? 'horizontal' : 'vertical', total: 99 }, vutils.merge({
                   handler: {
                       preShape: 'triangleUp',
                       nextShape: 'triangleDown'
                   }
-              }, pageStyle)));
+              }, pageStyle)), { disableTriggerEvent }));
               this._pager = pagerComp;
               this._innerView.add(pagerComp);
               pageHeight = (maxRow - 1) * spaceRow + this._itemHeight * maxRow;
@@ -26157,7 +26221,7 @@
               });
           }
           else {
-              pagerComp = new Pager(Object.assign({ layout: 'horizontal', total: 99 }, pageStyle));
+              pagerComp = new Pager(Object.assign({ layout: 'horizontal', total: 99, disableTriggerEvent }, pageStyle));
               this._pager = pagerComp;
               this._innerView.add(pagerComp);
               pageWidth = this._itemMaxWidth * maxCol + (maxCol - 1) * spaceCol;
@@ -26461,11 +26525,13 @@
               this._currentHandler = e.target;
               this._prePos = this._isHorizontal ? e.clientX : e.clientY;
               if (vglobal.env === 'browser') {
-                  vglobal.addEventListener('pointermove', this._onHandlerPointerMove);
+                  vglobal.addEventListener('pointermove', this._onHandlerPointerMove, {
+                      capture: true
+                  });
                   vglobal.addEventListener('pointerup', this._onHandlerPointerUp);
               }
               else {
-                  this._currentHandler.addEventListener('pointermove', this._onHandlerPointerMove);
+                  this._currentHandler.addEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
                   this._currentHandler.addEventListener('pointerup', this._onHandlerPointerUp);
                   this._currentHandler.addEventListener('pointerupoutside', this._onHandlerPointerUp);
               }
@@ -26509,12 +26575,14 @@
               e.preventDefault();
               this._currentHandler = null;
               if (vglobal.env === 'browser') {
-                  vglobal.removeEventListener('pointermove', this._onHandlerPointerMove);
+                  vglobal.removeEventListener('pointermove', this._onHandlerPointerMove, {
+                      capture: true
+                  });
                   vglobal.removeEventListener('pointerup', this._onHandlerPointerUp);
               }
               else {
                   const currentTarget = e.target;
-                  currentTarget.removeEventListener('pointermove', this._onHandlerPointerMove);
+                  currentTarget.removeEventListener('pointermove', this._onHandlerPointerMove, { capture: true });
                   currentTarget.removeEventListener('pointerup', this._onHandlerPointerUp);
                   currentTarget.removeEventListener('pointerupoutside', this._onHandlerPointerUp);
               }
@@ -26523,11 +26591,15 @@
               e.stopPropagation();
               this._prePos = this._isHorizontal ? e.clientX : e.clientY;
               if (vglobal.env === 'browser') {
-                  vglobal.addEventListener('pointermove', this._onTrackPointerMove);
+                  vglobal.addEventListener('pointermove', this._onTrackPointerMove, {
+                      capture: true
+                  });
                   vglobal.addEventListener('pointerup', this._onTrackPointerUp);
               }
               else {
-                  this._track.addEventListener('pointermove', this._onTrackPointerMove);
+                  this._track.addEventListener('pointermove', this._onTrackPointerMove, {
+                      capture: true
+                  });
                   this._track.addEventListener('pointerup', this._onTrackPointerUp);
                   this._track.addEventListener('pointerupoutside', this._onTrackPointerUp);
               }
@@ -26855,6 +26927,9 @@
           return textShape;
       }
       _bindEvents() {
+          if (this.attribute.disableTriggerEvent) {
+              return;
+          }
           const { slidable, range } = this.attribute;
           if (slidable) {
               if (this._startHandler) {
@@ -27064,7 +27139,7 @@
           this._updateColor();
       }
       _renderContent() {
-          const { colors, slidable, layout, align, min, max, value, railWidth, railHeight, showHandler = true, handlerSize, handlerStyle, railStyle, trackStyle, startText, endText, handlerText, showTooltip, tooltip } = this.attribute;
+          const { colors, slidable, layout, align, min, max, value, railWidth, railHeight, showHandler = true, handlerSize, handlerStyle, railStyle, trackStyle, startText, endText, handlerText, showTooltip, tooltip, disableTriggerEvent } = this.attribute;
           const domain = [];
           const step = (max - min) / (colors.length - 1);
           for (let i = 0; i < colors.length; i++) {
@@ -27095,7 +27170,8 @@
               endText,
               handlerText,
               showTooltip,
-              tooltip
+              tooltip,
+              disableTriggerEvent
           });
           this._innerView.add(slider);
           this._slider = slider;
@@ -27104,6 +27180,9 @@
           this._updateColor();
       }
       _bindEvents() {
+          if (this.attribute.disableTriggerEvent) {
+              return;
+          }
           if (this._slider) {
               this._slider.addEventListener('change', this._onSliderChange);
           }
@@ -27254,7 +27333,7 @@
           this._slider.setValue(value);
       }
       _renderContent() {
-          const { slidable, layout, align, min, max, value, railWidth, railHeight, showHandler = true, handlerSize, handlerStyle, railStyle, trackStyle, startText, endText, handlerText, showTooltip, tooltip, sizeBackground } = this.attribute;
+          const { slidable, layout, align, min, max, value, railWidth, railHeight, showHandler = true, handlerSize, handlerStyle, railStyle, trackStyle, startText, endText, handlerText, showTooltip, tooltip, sizeBackground, disableTriggerEvent } = this.attribute;
           const mainContainer = createGroup({
               x: 0,
               y: 0
@@ -27284,7 +27363,8 @@
               endText,
               handlerText,
               showTooltip,
-              tooltip
+              tooltip,
+              disableTriggerEvent
           });
           mainContainer.add(slider);
           let start = 0;
@@ -27318,6 +27398,9 @@
           this._slider = slider;
       }
       _bindEvents() {
+          if (this.attribute.disableTriggerEvent) {
+              return;
+          }
           if (this._slider) {
               this._slider.addEventListener('change', this._onSliderChange);
           }
@@ -27833,6 +27916,9 @@
               }
           };
           this._initEvents = () => {
+              if (this.attribute.disableTriggerEvent) {
+                  return;
+              }
               this._playController.addEventListener('pointerdown', (e) => {
                   e.stopPropagation();
                   if (this._isPaused === true) {
@@ -28030,7 +28116,8 @@
                   range: false,
                   handlerText: { visible: false },
                   startText: { visible: false },
-                  endText: { visible: false }
+                  endText: { visible: false },
+                  disableTriggerEvent: this.attribute.disableTriggerEvent
               };
               if (isHorizontal(this._orient)) {
                   const railWidth = Math.max(0, this._layoutInfo.slider.size);
@@ -28064,7 +28151,8 @@
                   start: this._start,
                   pause: this._pause,
                   forward: this._forward,
-                  backward: this._backward
+                  backward: this._backward,
+                  disableTriggerEvent: this.attribute.disableTriggerEvent
               };
               if (isHorizontal(this._orient)) {
                   attrs.layout = 'horizontal';
@@ -28217,6 +28305,9 @@
               this._slider.setAttribute('value', this._dataIndex);
           };
           this._initEvents = () => {
+              if (this.attribute.disableTriggerEvent) {
+                  return;
+              }
               this._controller.addEventListener(ControllerEventEnum.OnPlay, (e) => {
                   e.stopPropagation();
                   this.play();
@@ -28365,6 +28456,9 @@
               }
           };
           this._initEvents = () => {
+              if (this.attribute.disableTriggerEvent) {
+                  return;
+              }
               this._controller.addEventListener(ControllerEventEnum.OnPlay, (e) => {
                   e.stopPropagation();
                   this.play();
@@ -28592,6 +28686,9 @@
           };
       }
       bindBrushEvents() {
+          if (this.attribute.disableTriggerEvent) {
+              return;
+          }
           const { delayType = 'throttle', delayTime = 0, trigger = DEFAULT_BRUSH_ATTRIBUTES.trigger, updateTrigger = DEFAULT_BRUSH_ATTRIBUTES.updateTrigger, endTrigger = DEFAULT_BRUSH_ATTRIBUTES.endTrigger, resetTrigger = DEFAULT_BRUSH_ATTRIBUTES.resetTrigger } = this.attribute;
           this.stage.addEventListener(trigger, this._onBrushStart);
           this.stage.addEventListener(updateTrigger, delayMap[delayType](this._onBrushing, delayTime));
@@ -29202,7 +29299,7 @@
       return new Tag(params ? params.attribute : {});
   }
 
-  const version = "0.16.1-alpha.0";
+  const version = "0.16.2-alpha.0";
 
   exports.AbstractComponent = AbstractComponent;
   exports.ArcInfo = ArcInfo;