@visactor/vrender-components 0.17.1 → 0.17.2-alpha.0

package/dist/index.js

@@ -19215,6 +19215,12 @@
       _getNodeId(id) {
           return `${this.id}-${this.name}-${id}`;
       }
+      _dispatchEvent(eventName, details) {
+          var _a;
+          const changeEvent = new CustomEvent(eventName, details);
+          changeEvent.manager = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.eventSystem.manager;
+          this.dispatchEvent(changeEvent);
+      }
   }
 
   const delayMap$2 = {
@@ -19295,7 +19301,7 @@
               const [currentPos, currentScrollValue] = this._computeScrollValue(e);
               const range = [preScrollRange[0] + currentScrollValue, preScrollRange[1] + currentScrollValue];
               if (!realTime) {
-                  this._onChange({
+                  this._dispatchEvent('scroll', {
                       pre: preRange,
                       value: vutils.clampRange(range, limitRange[0], limitRange[1])
                   });
@@ -19331,7 +19337,7 @@
           }
           this.attribute.range = currScrollRange;
           if (realTime) {
-              this._onChange({
+              this._dispatchEvent('scroll', {
                   pre: preRange,
                   value: currScrollRange
               });
@@ -19434,12 +19440,6 @@
               ? vutils.clampRange([x1 + min * width, x1 + max * width], x1, width - sliderSize)
               : vutils.clampRange([y1 + min * height, y1 + max * height], y1, height - sliderSize);
       }
-      _onChange(detail) {
-          var _a;
-          const changeEvent = new CustomEvent('scroll', detail);
-          changeEvent.manager = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.eventSystem.manager;
-          this.dispatchEvent(changeEvent);
-      }
       _reset() {
           this._sliderRenderBounds = null;
           this._sliderLimitRange = null;
@@ -25268,7 +25268,6 @@
               this._activeCache.lastPos = this.eventPosToStagePos(e);
           };
           this._onHandlerPointerMove = (e) => {
-              var _a;
               e.stopPropagation();
               const { start: startAttr, end: endAttr, brushSelect, realTime = true } = this.attribute;
               const pos = this.eventPosToStagePos(e);
@@ -25306,8 +25305,11 @@
               end = Math.min(Math.max(end, 0), 1);
               if (startAttr !== start || endAttr !== end) {
                   this.setStateAttr(start, end, true);
-                  realTime && ((_a = this._updateStateCallback) === null || _a === void 0 ? void 0 : _a.call(this, start, end, this._activeTag));
-                  this._dispatchChangeEvent(start, end);
+                  this._dispatchEvent('change', {
+                      start,
+                      end,
+                      tag: this._activeTag
+                  });
               }
           };
           const { start, end, size, orient, showDetail, position, previewData, previewPointsX, previewPointsY, previewPointsX1, previewPointsY1, updateStateCallback } = this.attribute;
@@ -25332,7 +25334,6 @@
           vutils.isFunction(previewPointsY) && (this._previewPointsY = previewPointsY);
           vutils.isFunction(previewPointsX1) && (this._previewPointsX1 = previewPointsX1);
           vutils.isFunction(previewPointsY1) && (this._previewPointsY1 = previewPointsY1);
-          vutils.isFunction(updateStateCallback) && (this._updateStateCallback = updateStateCallback);
       }
       bindEvents() {
           if (this.attribute.disableTriggerEvent) {
@@ -25403,15 +25404,14 @@
           shouldRender && this.setAttributes({ start, end });
       }
       eventPosToStagePos(e) {
-          var _a, _b, _c;
-          const stagePosition = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.window.getBoundingClientRect();
+          var _a, _b;
+          const { x, y } = vglobal.mapToCanvasPoint(e);
           return {
-              x: e.clientX - ((stagePosition === null || stagePosition === void 0 ? void 0 : stagePosition.left) || 0) - (((_b = this.stage) === null || _b === void 0 ? void 0 : _b.x) || 0),
-              y: e.clientY - ((stagePosition === null || stagePosition === void 0 ? void 0 : stagePosition.top) || 0) - (((_c = this.stage) === null || _c === void 0 ? void 0 : _c.y) || 0)
+              x: x - (((_a = this.stage) === null || _a === void 0 ? void 0 : _a.x) || 0),
+              y: y - (((_b = this.stage) === null || _b === void 0 ? void 0 : _b.y) || 0)
           };
       }
       _onHandlerPointerUp(e) {
-          var _a;
           e.preventDefault();
           const { start, end, brushSelect, realTime = true } = this.attribute;
           if (this._activeState) {
@@ -25424,8 +25424,11 @@
           brushSelect && this.renderDragMask();
           if (!realTime || start !== this.state.start || end !== this.state.end) {
               this.setStateAttr(this.state.start, this.state.end, true);
-              (_a = this._updateStateCallback) === null || _a === void 0 ? void 0 : _a.call(this, this.state.start, this.state.end, this._activeTag);
-              this._dispatchChangeEvent(this.state.start, this.state.end);
+              this._dispatchEvent('change', {
+                  start: this.state.start,
+                  end: this.state.end,
+                  tag: this._activeTag
+              });
           }
       }
       _onHandlerPointerEnter(e) {
@@ -25787,25 +25790,18 @@
           container.add(labelShape);
           return labelShape;
       }
-      _dispatchChangeEvent(start, end) {
-          var _a;
-          const changeEvent = new CustomEvent('change', {
-              start,
-              end
-          });
-          changeEvent.manager = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.eventSystem.manager;
-          this.dispatchEvent(changeEvent);
-      }
       setStartAndEnd(start, end) {
-          var _a;
           const { start: startAttr, end: endAttr } = this.attribute;
           if (vutils.isValid(start) && vutils.isValid(end) && (start !== this.state.start || end !== this.state.end)) {
               this.state.start = start;
               this.state.end = end;
               if (startAttr !== this.state.start || endAttr !== this.state.end) {
                   this.setStateAttr(start, end, true);
-                  (_a = this._updateStateCallback) === null || _a === void 0 ? void 0 : _a.call(this, start, end, this._activeTag);
-                  this._dispatchChangeEvent(start, end);
+                  this._dispatchEvent('change', {
+                      start,
+                      end,
+                      tag: this._activeTag
+                  });
               }
           }
       }
@@ -25833,9 +25829,6 @@
           const middleHandlerSymbolSize = (_d = (_c = middleHandlerStyle === null || middleHandlerStyle === void 0 ? void 0 : middleHandlerStyle.icon) === null || _c === void 0 ? void 0 : _c.size) !== null && _d !== void 0 ? _d : 10;
           return Math.max(middleHandlerRectSize, ...vutils.array(middleHandlerSymbolSize));
       }
-      setUpdateStateCallback(callback) {
-          vutils.isFunction(callback) && (this._updateStateCallback = callback);
-      }
       setPreviewPointsX(callback) {
           vutils.isFunction(callback) && (this._previewPointsX = callback);
       }
@@ -26627,7 +26620,6 @@
               target.removeState('hover');
           };
           this._onClick = (e) => {
-              var _a, _b;
               const target = e.target;
               if (target.name === 'preHandler') {
                   if (this._current === 1) {
@@ -26640,14 +26632,12 @@
                   else {
                       target.removeState('disable');
                   }
-                  const changeEvent = new CustomEvent('toPrev', {
+                  this._dispatchEvent('toPrev', {
                       current: this._current,
                       total: this._total,
                       direction: 'pre',
                       event: e
                   });
-                  changeEvent.manager = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.eventSystem.manager;
-                  this.dispatchEvent(changeEvent);
               }
               if (target.name === 'nextHandler') {
                   if (this._current === this._total) {
@@ -26660,14 +26650,12 @@
                   else {
                       target.removeState('disable');
                   }
-                  const changeEvent = new CustomEvent('toNext', {
+                  this._dispatchEvent('toNext', {
                       current: this._current,
                       total: this._total,
                       direction: 'next',
                       event: e
                   });
-                  changeEvent.manager = (_b = this.stage) === null || _b === void 0 ? void 0 : _b.eventSystem.manager;
-                  this.dispatchEvent(changeEvent);
               }
               if (this._current > 1) {
                   this.preHandler.removeState('disable');
@@ -26944,7 +26932,7 @@
                       const currentSelectedItems = this._getSelectedLegends();
                       if (selectMode === 'multiple') {
                           if (allowAllCanceled === false && isSelected && currentSelectedItems.length === 1) {
-                              this._dispatchEvent(exports.LegendEvent.legendItemClick, legendItem, e);
+                              this._dispatchLegendEvent(exports.LegendEvent.legendItemClick, legendItem, e);
                               return;
                           }
                           if (isSelected) {
@@ -26967,7 +26955,7 @@
                           });
                       }
                   }
-                  this._dispatchEvent(exports.LegendEvent.legendItemClick, legendItem, e);
+                  this._dispatchLegendEvent(exports.LegendEvent.legendItemClick, legendItem, e);
               }
           };
       }
@@ -27389,7 +27377,7 @@
           if (focusButton) {
               focusButton.setAttribute('visible', true);
           }
-          this._dispatchEvent(exports.LegendEvent.legendItemHover, legendItem, e);
+          this._dispatchLegendEvent(exports.LegendEvent.legendItemHover, legendItem, e);
       }
       _unHover(legendItem, e) {
           let attributeUpdate = false;
@@ -27414,9 +27402,9 @@
               focusButton.setAttribute('visible', false);
           }
           if (attributeUpdate) {
-              this._dispatchEvent(exports.LegendEvent.legendItemAttributeUpdate, legendItem, e);
+              this._dispatchLegendEvent(exports.LegendEvent.legendItemAttributeUpdate, legendItem, e);
           }
-          this._dispatchEvent(exports.LegendEvent.legendItemUnHover, legendItem, e);
+          this._dispatchLegendEvent(exports.LegendEvent.legendItemUnHover, legendItem, e);
       }
       _setLegendItemState(legendItem, stateName, e) {
           const keepCurrentStates = true;
@@ -27437,7 +27425,7 @@
               }
           });
           if (attributeUpdate) {
-              this._dispatchEvent(exports.LegendEvent.legendItemAttributeUpdate, legendItem, e);
+              this._dispatchLegendEvent(exports.LegendEvent.legendItemAttributeUpdate, legendItem, e);
           }
       }
       _removeLegendItemState(legendItem, stateNames, e) {
@@ -27462,7 +27450,7 @@
               }
           });
           if (attributeUpdate) {
-              this._dispatchEvent(exports.LegendEvent.legendItemAttributeUpdate, legendItem, e);
+              this._dispatchLegendEvent(exports.LegendEvent.legendItemAttributeUpdate, legendItem, e);
           }
       }
       _getSelectedLegends() {
@@ -27481,12 +27469,11 @@
           shape.delegate = delegateShape;
           shape.states = vutils.merge({}, DEFAULT_STATES, states);
       }
-      _dispatchEvent(eventName, legendItem, event) {
-          var _a;
+      _dispatchLegendEvent(eventName, legendItem, event) {
           const currentSelectedItems = this._getSelectedLegends();
           currentSelectedItems.sort((pre, next) => pre.index - next.index);
           const currentSelected = currentSelectedItems.map((obj) => obj.label);
-          const changeEvent = new CustomEvent(eventName, {
+          this._dispatchEvent(eventName, {
               item: legendItem,
               data: legendItem.data,
               selected: legendItem.hasState(exports.LegendStateValue.selected),
@@ -27494,8 +27481,6 @@
               currentSelected,
               event
           });
-          changeEvent.manager = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.eventSystem.manager;
-          this.dispatchEvent(changeEvent);
       }
       _handleStyle(config, item, isSelected, index, items) {
           const newConfig = vutils.merge({}, config);
@@ -28169,10 +28154,9 @@
           }
       }
       _dispatchChangeEvent() {
-          var _a;
           const isRange = !!this.attribute.range;
           const currentValue = this._currentValue;
-          const changeEvent = new CustomEvent('change', {
+          this._dispatchEvent('change', {
               value: isRange
                   ? [
                       Math.min(currentValue.endValue, currentValue.startValue),
@@ -28186,8 +28170,6 @@
                   ]
                   : currentValue.startPos
           });
-          changeEvent.manager = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.eventSystem.manager;
-          this.dispatchEvent(changeEvent);
       }
       _getHandlers() {
           let startHandler = this._startHandler;
@@ -29083,12 +29065,6 @@
                   this.forward();
               });
           };
-          this._createCustomEvent = (eventType) => {
-              var _a;
-              const customEvent = new CustomEvent(eventType, { eventType });
-              customEvent.manager = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.eventSystem.manager;
-              return customEvent;
-          };
           this.renderPlay = () => {
               if (this._isPaused) {
                   this._playController.setAttributes(Object.assign({ symbolType: this._playController.getComputedAttribute('symbolType') }, this._startAttr.style));
@@ -29104,20 +29080,16 @@
               this._forwardController.setAttributes(this._forwardAttr.style);
           };
           this.play = () => {
-              const onPlayEvent = this._createCustomEvent(ControllerEventEnum.OnPlay);
-              this.dispatchEvent(onPlayEvent);
+              this._dispatchEvent('ControllerEventEnum.OnPlay');
           };
           this.pause = () => {
-              const onPauseEvent = this._createCustomEvent(ControllerEventEnum.OnPause);
-              this.dispatchEvent(onPauseEvent);
+              this._dispatchEvent('ControllerEventEnum.OnPause');
           };
           this.forward = () => {
-              const onPlayEvent = this._createCustomEvent(ControllerEventEnum.OnForward);
-              this.dispatchEvent(onPlayEvent);
+              this._dispatchEvent('ControllerEventEnum.OnForward');
           };
           this.backward = () => {
-              const onPlayEvent = this._createCustomEvent(ControllerEventEnum.OnBackward);
-              this.dispatchEvent(onPlayEvent);
+              this._dispatchEvent('ControllerEventEnum.OnBackward');
           };
           this.togglePlay = () => {
               this._playController.setAttributes(this._startAttr.style);
@@ -29392,14 +29364,11 @@
           this._controller.setAttributes(attrs);
       }
       dispatchCustomEvent(eventType, dataIndex) {
-          var _a;
-          const changeEvent = new CustomEvent(eventType, {
+          this._dispatchEvent(eventType, {
               eventType,
               index: dataIndex,
               value: this._data[dataIndex]
           });
-          changeEvent.manager = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.eventSystem.manager;
-          this.dispatchEvent(changeEvent);
       }
   }
   BasePlayer.defaultAttributes = {
@@ -29813,20 +29782,27 @@
               if (this._activeDrawState && !this._isDrawedBeforeEnd && removeOnClick) {
                   this._container.incrementalClearChild();
                   this._brushMaskAABBBoundsDict = {};
-                  this._updateDragMaskCallback &&
-                      this._updateDragMaskCallback({
-                          operateType: exports.IOperateType.brushClear,
-                          operateMask: this._operatingMask,
-                          operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
-                      });
+                  this._dispatchEvent(exports.IOperateType.brushClear, {
+                      operateMask: this._operatingMask,
+                      operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+                      event: e
+                  });
               }
               else if (!this._outOfInteractiveRange(e)) {
-                  this._updateDragMaskCallback &&
-                      this._updateDragMaskCallback({
-                          operateType: this._activeDrawState ? exports.IOperateType.drawEnd : exports.IOperateType.moveEnd,
+                  if (this._activeDrawState) {
+                      this._dispatchEvent(exports.IOperateType.drawEnd, {
                           operateMask: this._operatingMask,
-                          operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
+                          operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+                          event: e
                       });
+                  }
+                  if (this._activeMoveState) {
+                      this._dispatchEvent(exports.IOperateType.moveEnd, {
+                          operateMask: this._operatingMask,
+                          operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+                          event: e
+                      });
+                  }
               }
               this._activeDrawState = false;
               this._activeMoveState = false;
@@ -29834,7 +29810,7 @@
               (_a = this._operatingMask) === null || _a === void 0 ? void 0 : _a.setAttribute('pickable', false);
           };
       }
-      bindBrushEvents() {
+      _bindBrushEvents() {
           if (this.attribute.disableTriggerEvent) {
               return;
           }
@@ -29872,12 +29848,11 @@
               this._container.incrementalClearChild();
           }
           this._addBrushMask();
-          this._updateDragMaskCallback &&
-              this._updateDragMaskCallback({
-                  operateType: exports.IOperateType.drawStart,
-                  operateMask: this._operatingMask,
-                  operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
-              });
+          this._dispatchEvent(exports.IOperateType.drawStart, {
+              operateMask: this._operatingMask,
+              operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+              event: e
+          });
       }
       _initMove(e) {
           var _a, _b;
@@ -29894,12 +29869,11 @@
           this._operatingMaskMoveRangeX = [minMoveStepX, maxMoveStepX];
           this._operatingMaskMoveRangeY = [minMoveStepY, maxMoveStepY];
           this._operatingMask.setAttribute('pickable', true);
-          this._updateDragMaskCallback &&
-              this._updateDragMaskCallback({
-                  operateType: exports.IOperateType.moveStart,
-                  operateMask: this._operatingMask,
-                  operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
-              });
+          this._dispatchEvent(exports.IOperateType.moveStart, {
+              operateMask: this._operatingMask,
+              operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+              event: e
+          });
       }
       _drawing(e) {
           var _a;
@@ -29923,12 +29897,11 @@
           const maskPoints = this._computeMaskPoints();
           this._operatingMask.setAttribute('points', maskPoints);
           this._brushMaskAABBBoundsDict[this._operatingMask.name] = this._operatingMask.AABBBounds;
-          this._updateDragMaskCallback &&
-              this._updateDragMaskCallback({
-                  operateType: exports.IOperateType.drawing,
-                  operateMask: this._operatingMask,
-                  operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
-              });
+          this._dispatchEvent(exports.IOperateType.drawing, {
+              operateMask: this._operatingMask,
+              operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+              event: e
+          });
       }
       _moving(e) {
           const startPos = this._cacheMovePoint;
@@ -29947,12 +29920,11 @@
               dy: moveY
           });
           this._brushMaskAABBBoundsDict[this._operatingMask.name] = this._operatingMask.AABBBounds;
-          this._updateDragMaskCallback &&
-              this._updateDragMaskCallback({
-                  operateType: exports.IOperateType.moving,
-                  operateMask: this._operatingMask,
-                  operatedMaskAABBBounds: this._brushMaskAABBBoundsDict
-              });
+          this._dispatchEvent(exports.IOperateType.moving, {
+              operateMask: this._operatingMask,
+              operatedMaskAABBBounds: this._brushMaskAABBBoundsDict,
+              event: e
+          });
       }
       _computeMaskPoints() {
           const { brushType, xRange = [0, 0], yRange = [0, 0] } = this.attribute;
@@ -30037,21 +30009,18 @@
           return false;
       }
       eventPosToStagePos(e) {
-          var _a, _b, _c;
-          const stagePosition = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.window.getBoundingClientRect();
+          var _a, _b;
+          const { x, y } = vglobal.mapToCanvasPoint(e);
           return {
-              x: e.clientX - ((stagePosition === null || stagePosition === void 0 ? void 0 : stagePosition.left) || 0) - (((_b = this.stage) === null || _b === void 0 ? void 0 : _b.x) || 0),
-              y: e.clientY - ((stagePosition === null || stagePosition === void 0 ? void 0 : stagePosition.top) || 0) - (((_c = this.stage) === null || _c === void 0 ? void 0 : _c.y) || 0)
+              x: x - (((_a = this.stage) === null || _a === void 0 ? void 0 : _a.x) || 0),
+              y: y - (((_b = this.stage) === null || _b === void 0 ? void 0 : _b.y) || 0)
           };
       }
       render() {
-          this.bindBrushEvents();
+          this._bindBrushEvents();
           const group = this.createOrUpdateChild('brush-container', {}, 'group');
           this._container = group;
       }
-      setUpdateDragMaskCallback(callback) {
-          vutils.isFunction(callback) && (this._updateDragMaskCallback = callback);
-      }
       releaseBrushEvents() {
           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.removeEventListener(trigger, this._onBrushStart);
@@ -30607,7 +30576,6 @@
           });
       }
       handleClick() {
-          var _a;
           if (this.attribute.disabled) {
               return;
           }
@@ -30619,12 +30587,10 @@
               this.setAttribute('checked', true);
               this.setAttribute('indeterminate', false);
           }
-          const changeEvent = new CustomEvent('checkbox_state_change', {
+          this._dispatchEvent('checkbox_state_change', {
               eventType: 'checkbox_state_change',
               checked: this.attribute.checked
           });
-          changeEvent.manager = (_a = this.stage) === null || _a === void 0 ? void 0 : _a.eventSystem.manager;
-          this.dispatchEvent(changeEvent);
       }
   }
   CheckBox.defaultAttributes = {
@@ -30665,7 +30631,7 @@
       }
   };
 
-  const version = "0.17.1";
+  const version = "0.17.2-alpha.0";
 
   exports.AbstractComponent = AbstractComponent;
   exports.ArcInfo = ArcInfo;