@visactor/vchart 2.1.0-alpha.14 → 2.1.0-alpha.16

package/esm/mark/base/base-mark.js

@@ -56,10 +56,6 @@ import { log } from "../../util/debug";
 
 import { morph as runMorph } from "../../compile/morph";
 
-import { addGraphicState, removeGraphicState, setGraphicStates } from "../../util/graphic-state";
-
-const statesClearedBeforeReInitKey = Symbol("statesClearedBeforeReInit");
-
 export class BaseMark extends GrammarItem {
     commit(render, recursion) {
         recursion && this.getMarks().length > 0 && this.getMarks().forEach((m => m.commit(!1, recursion))), 
@@ -212,8 +208,8 @@ export class BaseMark extends GrammarItem {
     stopAnimationByState(state) {}
     pauseAnimationByState(state) {}
     resumeAnimationByState(state) {}
-    removeProduct(releaseDetach) {
-        this._product && this._product.parent && this._product.parent.removeChild(this._product, releaseDetach), 
+    removeProduct() {
+        this._product && this._product.parent && this._product.parent.removeChild(this._product), 
         this._product = null, this._compiledProductId = null;
     }
     release() {
@@ -231,9 +227,8 @@ export class BaseMark extends GrammarItem {
             zIndex: LayoutZIndex.Mark,
             morph: !1
         }, this._visible = !0, this.stateStyle = {}, this._unCompileChannel = {}, this._disabledAnimationStates = [], 
-        this._skipBeforeLayouted = !1, this._sharedStateDefinitionRefIds = new WeakMap, 
-        this._sharedStateDefinitionRefId = 0, this._dynamicSharedStateNames = new Set, this._extensionChannel = {}, 
-        this._computeExChannel = {}, this._graphicMap = new Map, this._graphics = [], this._getEncoderOfStyle = (stateName, style) => {
+        this._skipBeforeLayouted = !1, this._extensionChannel = {}, this._computeExChannel = {}, 
+        this._graphicMap = new Map, this._graphics = [], this._getEncoderOfStyle = (stateName, style) => {
             if (style && stateName) {
                 const validEncoder = {};
                 return Object.keys(style).forEach((key => {
@@ -246,10 +241,10 @@ export class BaseMark extends GrammarItem {
             setCustomizedShape && (g.pathProxy = attrs => setCustomizedShape(g.context.data, attrs, new CustomPath2D)), 
             graphicName && (isFunction(graphicName) ? g.name = graphicName(g) : g.name = graphicName);
         }, this._setStateOfGraphic = (g, hasAnimation) => {
-            var _a, _b, _c;
-            g.stateProxy = null;
-            const targetStates = g.context.diffState === DiffState.enter || g.context.diffState === DiffState.update ? g.context.states : void 0, hasCurrentState = !!((null === (_a = g.currentStates) || void 0 === _a ? void 0 : _a.length) || (null === (_b = g.effectiveStates) || void 0 === _b ? void 0 : _b.length) || g.resolvedStatePatch || (null === (_c = g.registeredActiveScopes) || void 0 === _c ? void 0 : _c.size));
-            ((null == targetStates ? void 0 : targetStates.length) || hasCurrentState) && setGraphicStates(g, targetStates, hasAnimation);
+            g.clearStates(), g.stateProxy = null, g.context.diffState !== DiffState.enter && g.context.diffState !== DiffState.update || (g.stateProxy = (stateName, nexStates) => {
+                var _a;
+                return this._runEncoderOfGraphic(null === (_a = this._encoderOfState) || void 0 === _a ? void 0 : _a[stateName], g);
+            }, g.context.states && g.useStates(g.context.states, hasAnimation));
         }, this.name = name, this.model = option.model, this.key = option.key, this.state = new MarkStateManager(option, this), 
         this._attributeContext = option.attributeContext, null === (_a = option.map) || void 0 === _a || _a.set(this.id, this);
     }
@@ -583,7 +578,6 @@ export class BaseMark extends GrammarItem {
         if (graphics.forEach((g => {
             const state = g.context.animationState;
             if ("appear" === state) return;
-            if ("update" === state && !this._hasDiffAttrs(g)) return;
             const config = animationConfig[state];
             if (config && config.length > 0) {
                 const configList = config.map(((item, index) => ({
@@ -682,108 +676,41 @@ export class BaseMark extends GrammarItem {
             groupStyles: groupStyles
         };
     }
-    _getSharedStateDefinitionRefId(value) {
-        if ("object" != typeof value && "function" != typeof value || null === value) return `${value}`;
-        const objectValue = value;
-        let id = this._sharedStateDefinitionRefIds.get(objectValue);
-        return id || (id = ++this._sharedStateDefinitionRefId, this._sharedStateDefinitionRefIds.set(objectValue, id)), 
-        `ref:${id}`;
-    }
-    _getSharedStateDefinitionValueKey(value) {
-        try {
-            const jsonValue = JSON.stringify(value);
-            return null != jsonValue ? jsonValue : `${value}`;
-        } catch (_error) {
-            return this._getSharedStateDefinitionRefId(value);
-        }
-    }
-    _isStaticSharedStateAttribute(stateName, key) {
-        var _a, _b;
-        const stateStyle = null === (_a = this.stateStyle[stateName]) || void 0 === _a ? void 0 : _a[key];
-        if (!stateStyle || stateStyle.referer || isFunction(stateStyle.postProcess) || key in this._computeExChannel) return !1;
-        const style = stateStyle.style;
-        return !isFunction(style) && (!GradientType.includes(null == style ? void 0 : style.gradient) && (![ "outerBorder", "innerBorder" ].includes(key) && !isValidScaleType(null === (_b = null == style ? void 0 : style.scale) || void 0 === _b ? void 0 : _b.type)));
-    }
-    _applySharedStateDefinitions() {
-        var _a;
-        if (!this._product) return;
-        const stateNames = Object.keys(null !== (_a = this._encoderOfState) && void 0 !== _a ? _a : {}).filter((stateName => "group" !== stateName && "update" !== stateName));
-        if (!stateNames.length) return this._dynamicSharedStateNames.clear(), void (void 0 !== this._product.sharedStateDefinitions && (this._product.sharedStateDefinitions = void 0));
-        const sortedStateNames = this._stateSort ? stateNames.slice().sort(this._stateSort) : stateNames, statePriority = new Map;
-        sortedStateNames.forEach(((stateName, index) => {
-            statePriority.set(stateName, index);
-        }));
-        const sharedStateDefinitions = {}, cacheKeys = [], dynamicSharedStateNames = new Set;
-        if (stateNames.forEach((stateName => {
-            var _a;
-            const encoder = this._encoderOfState[stateName], patch = {}, dynamicEncoder = {}, patchKeys = [], dynamicKeys = [];
-            if (Object.keys(null != encoder ? encoder : {}).forEach((key => {
-                this._isStaticSharedStateAttribute(stateName, key) ? (patch[key] = this._computeAttribute(key, stateName)(void 0), 
-                patchKeys.push(key)) : (dynamicEncoder[key] = encoder[key], dynamicKeys.push(key));
-            })), !patchKeys.length && !dynamicKeys.length) return;
-            const definition = {
-                priority: null !== (_a = statePriority.get(stateName)) && void 0 !== _a ? _a : 0
-            };
-            patchKeys.length && (definition.patch = patch), dynamicKeys.length && (dynamicSharedStateNames.add(stateName), 
-            definition.declaredAffectedKeys = dynamicKeys, definition.resolver = ({graphic: graphic}) => this._runEncoderOfGraphic(dynamicEncoder, graphic)), 
-            sharedStateDefinitions[stateName] = definition, cacheKeys.push([ stateName, definition.priority, patchKeys.sort().map((key => `${key}:${this._getSharedStateDefinitionValueKey(patch[key])}`)), dynamicKeys.sort().map((key => {
-                var _a;
-                const stateStyle = null === (_a = this.stateStyle[stateName]) || void 0 === _a ? void 0 : _a[key];
-                return `${key}:${this._getSharedStateDefinitionRefId(null == stateStyle ? void 0 : stateStyle.style)}:${this._getSharedStateDefinitionRefId(null == stateStyle ? void 0 : stateStyle.postProcess)}:${this._getSharedStateDefinitionRefId(null == stateStyle ? void 0 : stateStyle.referer)}`;
-            })) ].join("|"));
-        })), !cacheKeys.length) return this._dynamicSharedStateNames.clear(), void (void 0 !== this._product.sharedStateDefinitions && (this._product.sharedStateDefinitions = void 0));
-        const cacheKey = cacheKeys.sort().join("||");
-        this._dynamicSharedStateNames = dynamicSharedStateNames, cacheKey === this._sharedStateDefinitionsCacheKey && this._sharedStateDefinitionsCache ? this._product.sharedStateDefinitions !== this._sharedStateDefinitionsCache && (this._product.sharedStateDefinitions = this._sharedStateDefinitionsCache) : (this._sharedStateDefinitionsCacheKey = cacheKey, 
-        this._sharedStateDefinitionsCache = sharedStateDefinitions, this._product.sharedStateDefinitions = sharedStateDefinitions);
-    }
     _addProgressiveGraphic(parent, g) {
         parent.incrementalAppendChild(g);
     }
     _runEncoder(graphics, noGroupEncode) {
         var _a;
         const attrsByGroup = noGroupEncode ? null : this._runGroupEncoder(null === (_a = this._encoderOfState) || void 0 === _a ? void 0 : _a.group);
-        graphics.forEach((g => {
-            var _a;
-            const attrs = this._runEncoderOfGraphic(null === (_a = this._encoderOfState) || void 0 === _a ? void 0 : _a.update, g);
-            isNil(this._markConfig.interactive) || (attrs.pickable = this._markConfig.interactive);
+        graphics.forEach(((g, index) => {
+            var _a, _b;
+            let attrs = this._runEncoderOfGraphic(null === (_a = this._encoderOfState) || void 0 === _a ? void 0 : _a.update, g);
+            null === (_b = g.currentStates) || void 0 === _b || _b.forEach((_state => {
+                var _a;
+                const stateAttr = this._runEncoderOfGraphic(null === (_a = this._encoderOfState) || void 0 === _a ? void 0 : _a[_state], g);
+                attrs = Object.assign(Object.assign({}, attrs), stateAttr);
+            })), isNil(this._markConfig.interactive) || (attrs.pickable = this._markConfig.interactive);
             const finalAttrs = this._transformGraphicAttributes(g, attrs, null == attrsByGroup ? void 0 : attrsByGroup[g.context.groupKey]);
             g.context.finalAttrs = finalAttrs;
         }));
     }
-    _excludeStateControlledDiffAttrs(g, diffAttrs) {
-        var _a;
-        if (!diffAttrs || !Object.keys(diffAttrs).length) return diffAttrs;
-        let nextDiffAttrs;
-        const excludeKey = key => {
-            key in diffAttrs && (nextDiffAttrs || (nextDiffAttrs = Object.assign({}, diffAttrs)), 
-            delete nextDiffAttrs[key]);
-        };
-        return g.resolvedStatePatch && Object.keys(g.resolvedStatePatch).forEach(excludeKey), 
-        null === (_a = g.context.states) || void 0 === _a || _a.forEach((stateName => {
-            var _a;
-            const encoder = null === (_a = this._encoderOfState) || void 0 === _a ? void 0 : _a[stateName];
-            encoder && Object.keys(encoder).forEach(excludeKey);
-        })), null != nextDiffAttrs ? nextDiffAttrs : diffAttrs;
-    }
-    _hasDiffAttrs(g) {
-        return !!g.context.diffAttrs && Object.keys(g.context.diffAttrs).length > 0;
-    }
     _runApplyGraphic(graphics) {
         const hasAnimation = this.hasAnimation();
         graphics.forEach(((g, index) => {
-            var _a, _b;
+            var _a, _b, _c;
             const finalAttrs = g.context.finalAttrs, hasStateAnimation = this.hasAnimationByState(g.context.animationState);
             if (g.setAttributes) {
-                const diffAttrs = this._excludeStateControlledDiffAttrs(g, getDiffAttributesOfGraphic(g, finalAttrs));
+                const diffAttrs = getDiffAttributesOfGraphic(g, finalAttrs);
                 g.context.diffAttrs = diffAttrs, g.context.reusing ? (g.context.lastAttrs = g.attribute, 
-                g.initAttributes(finalAttrs), g.context.reusing = !1) : hasStateAnimation || (hasAnimation ? g.setAttributesAndPreventAnimate(diffAttrs) : g.setAttributes(diffAttrs)), 
-                !(null === (_b = this.renderContext) || void 0 === _b ? void 0 : _b.progressive) && this._product && g.parent !== this._product && this._product.appendChild(g);
+                g.initAttributes({}), g.context.reusing = !1) : hasStateAnimation || (hasAnimation ? g.setAttributesAndPreventAnimate(diffAttrs) : g.setAttributes(diffAttrs)), 
+                !(null === (_c = this.renderContext) || void 0 === _c ? void 0 : _c.progressive) && this._product && g.parent !== this._product && this._product.appendChild(g), 
+                hasAnimation && g.setFinalAttributes(finalAttrs);
             } else {
                 const mockGraphic = g;
-                (g = this._createGraphic(finalAttrs)).context = mockGraphic.context, g.context.diffAttrs = finalAttrs, 
-                g.stateSort = this._stateSort;
+                g = this._createGraphic(finalAttrs), hasAnimation && (null === (_a = g.setFinalAttributes) || void 0 === _a || _a.call(g, finalAttrs)), 
+                g.context = mockGraphic.context, g.context.diffAttrs = finalAttrs, g.stateSort = this._stateSort;
                 const gIndex = this._graphics === graphics ? index : index + this._graphics.length - graphics.length;
-                if (gIndex >= 0 && (this._graphics[gIndex] = g), null === (_a = this.renderContext) || void 0 === _a ? void 0 : _a.progressive) {
+                if (gIndex >= 0 && (this._graphics[gIndex] = g), null === (_b = this.renderContext) || void 0 === _b ? void 0 : _b.progressive) {
                     const groupIndex = this._dataByGroup ? this._dataByGroup.keys.indexOf(g.context.groupKey) : 0, group = groupIndex >= 0 ? this._product.getChildAt(groupIndex) : null;
                     group && this._addProgressiveGraphic(group, g);
                 } else this._product.appendChild(g), this._graphicMap.set(g.context.uniqueKey, g);
@@ -846,7 +773,7 @@ export class BaseMark extends GrammarItem {
     }
     renderInner() {
         var _a, _b, _c;
-        this._updateEncoderByState(), this._applySharedStateDefinitions();
+        this._updateEncoderByState();
         const data = null !== (_b = null === (_a = this._data) || void 0 === _a ? void 0 : _a.getProduct()) && void 0 !== _b ? _b : [ {} ], transformData = this._runBeforeTransform(data);
         let markData;
         if (null == transformData ? void 0 : transformData.progressive) {
@@ -871,12 +798,7 @@ export class BaseMark extends GrammarItem {
         if (!this._product) return;
         const stateInfo = this.state.getStateInfo(key);
         this._graphics.forEach((g => {
-            const reinitStateGraphic = g, statesClearedBeforeReInit = reinitStateGraphic[statesClearedBeforeReInitKey], wasStateClearedBeforeReInit = null == statesClearedBeforeReInit ? void 0 : statesClearedBeforeReInit.includes(key), hasStateAnimation = !wasStateClearedBeforeReInit && this.hasAnimationByState("state");
-            if ("in" === this.state.checkOneState(g, g.context.data, stateInfo) ? addGraphicState(g, key, !0, hasStateAnimation) : removeGraphicState(g, key, hasStateAnimation), 
-            wasStateClearedBeforeReInit) {
-                const nextStates = statesClearedBeforeReInit.filter((stateName => stateName !== key));
-                nextStates.length ? reinitStateGraphic[statesClearedBeforeReInitKey] = nextStates : delete reinitStateGraphic[statesClearedBeforeReInitKey];
-            }
+            "in" === this.state.checkOneState(g, g.context.data, stateInfo) ? g.addState(key, !0, this.hasAnimationByState("state")) : g.removeState(key, this.hasAnimationByState("state"));
         }));
     }
     clearExitGraphics() {
@@ -896,7 +818,7 @@ export class BaseMark extends GrammarItem {
                         })
                     })));
                     g.applyAnimationState([ "exit" ], [ 1 === exitConfigList.length ? exitConfigList[0] : exitConfigList ], (() => {
-                        g.context.diffState === DiffState.exit && g.isExiting && this._graphicMap.get(key) === g && doRemove(g, key);
+                        doRemove(g, key);
                     }));
                 }
             } else doRemove(g, key);
@@ -1007,8 +929,7 @@ export class BaseMark extends GrammarItem {
     }
     clearBeforeReInit() {
         this.state.clearAllStateInfo(), this.uncommit(), this.stateStyle = {}, this.getGraphics().forEach((g => {
-            var _a;
-            (null === (_a = g.currentStates) || void 0 === _a ? void 0 : _a.length) && (g[statesClearedBeforeReInitKey] = g.currentStates.slice());
+            g.clearStates();
         }));
     }
 }