@visactor/vrender-core 1.1.0-alpha.17 → 1.1.0-alpha.19

package/cjs/graphic/graphic.d.ts

@@ -1,6 +1,6 @@
 import type { ICustomPath2D } from './../interface/path';
 import { Matrix, Point, type Dict, type IAABBBounds, type IOBBBounds, type IPointLike } from '@visactor/vutils';
-import type { GraphicType, IAnimateConfig, IGraphicAttribute, IGraphic, IGraphicJson, ISetAttributeContext, ITransform, GraphicReleaseStatus } from '../interface/graphic';
+import type { GraphicType, IAnimateConfig, IGraphicAttribute, IGraphic, IGraphicJson, ISetAttributeContext, ISetStatesOptions, ITransform, GraphicReleaseStatus } from '../interface/graphic';
 import { Node } from './node-tree';
 import type { IAnimate, IAnimateTarget, IGlyphGraphicAttribute, ILayer, IPickerService, IShadowRoot, IStage, IStep, ISymbolClass } from '../interface';
 import { IContainPointMode } from '../common/enums';
@@ -18,6 +18,16 @@ type AttributeDelta = Map<string, {
     prev: unknown;
     next: unknown;
 }>;
+type ResolvedGraphicStateTransition<T> = {
+    transition: {
+        changed: boolean;
+        states: string[];
+        effectiveStates?: string[];
+    };
+    effectiveStates: string[];
+    resolvedStateAttrs: Partial<T>;
+    isSimpleLocalTransition: boolean;
+};
 export declare const NOWORK_ANIMATE_ATTR: {
     strokeSeg: number;
     boundsPadding: number;
@@ -235,13 +245,23 @@ export declare abstract class Graphic<T extends Partial<IGraphicAttribute> = Par
     }): void;
     hasState(stateName?: string): boolean;
     getState(stateName: string): Partial<T> | StateDefinition<T> | undefined;
-    protected createStateModel(): StateModel<T>;
+    protected getStateResolveBaseAttrs(): Partial<T>;
+    protected syncStateResolveContext(stateResolveBaseAttrs?: Partial<T>): Partial<T>;
+    protected createStateModel(stateResolveBaseAttrs?: Partial<T>): StateModel<T>;
     protected resolveSimpleLocalStateTransition(states: string[], previousStates: readonly string[]): {
         changed: boolean;
         states: string[];
         effectiveStates: string[];
         resolvedStateAttrs: Partial<T>;
     } | null;
+    protected resolveGraphicStateTransition(states: string[], previousStates: readonly string[], forceResolverRefresh?: boolean): ResolvedGraphicStateTransition<T>;
+    protected normalizeSetStatesOptions(options?: boolean | ISetStatesOptions): {
+        hasAnimation?: boolean;
+        animateSameStatePatchChange: boolean;
+        shouldRefreshSameStatePatch: boolean;
+    };
+    protected sameStatePatches(left?: Partial<T>, right?: Partial<T>): boolean;
+    protected commitSameStatePatchRefresh(states: string[], hasAnimation?: boolean, animateSameStatePatchChange?: boolean): void;
     protected resolveStateAnimateConfig(animateConfig?: IAnimateConfig): any;
     applyStateAttrs(attrs: Partial<T>, stateNames: string[], hasAnimation?: boolean, isClear?: boolean, animateConfig?: IAnimateConfig, extraAnimateAttrs?: Partial<T>): void;
     updateNormalAttrs(_stateAttrs: Partial<T>): void;
@@ -254,6 +274,7 @@ export declare abstract class Graphic<T extends Partial<IGraphicAttribute> = Par
     toggleState(stateName: string, hasAnimation?: boolean): void;
     addState(stateName: string, keepCurrentStates?: boolean, hasAnimation?: boolean): void;
     setStates(states?: string[] | null, hasAnimation?: boolean): void;
+    setStates(states?: string[] | null, options?: ISetStatesOptions): void;
     useStates(states: string[], hasAnimation?: boolean): void;
     invalidateResolver(): void;
     private sameStateNames;

package/cjs/graphic/graphic.js

@@ -248,12 +248,10 @@ class Graphic extends node_tree_1.Node {
         };
     }
     recomputeCurrentStatePatch() {
-        var _a, _b, _c, _d;
+        var _a, _b;
         if (!(null === (_a = this.currentStates) || void 0 === _a ? void 0 : _a.length)) return this.effectiveStates = [], 
         this.resolvedStatePatch = void 0, void this.syncSharedStateActiveRegistrations();
-        const stateResolveBaseAttrs = null !== (_b = this.baseAttributes) && void 0 !== _b ? _b : this.attribute, stateModel = this.createStateModel();
-        null === (_c = this.stateEngine) || void 0 === _c || _c.setResolveContext(this, stateResolveBaseAttrs);
-        const transition = stateModel.useStates(this.currentStates), effectiveStates = null !== (_d = transition.effectiveStates) && void 0 !== _d ? _d : transition.states, resolvedStateAttrs = this.stateEngine && this.compiledStateDefinitions ? Object.assign({}, this.stateEngine.resolvedPatch) : this.getStateStyleResolver(this.stateMergeMode).resolve(stateResolveBaseAttrs, this.states, this.stateProxy, transition.states, this.stateSort);
+        const stateResolveBaseAttrs = this.getStateResolveBaseAttrs(), transition = this.createStateModel(stateResolveBaseAttrs).useStates(this.currentStates), effectiveStates = null !== (_b = transition.effectiveStates) && void 0 !== _b ? _b : transition.states, resolvedStateAttrs = this.stateEngine && this.compiledStateDefinitions ? Object.assign({}, this.stateEngine.resolvedPatch) : this.getStateStyleResolver(this.stateMergeMode).resolve(stateResolveBaseAttrs, this.states, this.stateProxy, transition.states, this.stateSort);
         this.currentStates = transition.states, this.effectiveStates = [ ...effectiveStates ], 
         this.resolvedStatePatch = resolvedStateAttrs, this.syncSharedStateActiveRegistrations();
     }
@@ -843,7 +841,16 @@ class Graphic extends node_tree_1.Node {
         var _a;
         return null === (_a = this.states) || void 0 === _a ? void 0 : _a[stateName];
     }
-    createStateModel() {
+    getStateResolveBaseAttrs() {
+        var _a;
+        return null !== (_a = this.baseAttributes) && void 0 !== _a ? _a : this.attribute;
+    }
+    syncStateResolveContext(stateResolveBaseAttrs = this.getStateResolveBaseAttrs()) {
+        var _a;
+        return null === (_a = this.stateEngine) || void 0 === _a || _a.setResolveContext(this, stateResolveBaseAttrs), 
+        stateResolveBaseAttrs;
+    }
+    createStateModel(stateResolveBaseAttrs = this.getStateResolveBaseAttrs()) {
         const {compiledDefinitions: compiledDefinitions, stateProxyEligibility: stateProxyEligibility, stateProxyModeKey: stateProxyModeKey} = this.resolveEffectiveCompiledDefinitions();
         return this.compiledStateDefinitions = compiledDefinitions, compiledDefinitions ? this.stateEngine && this.stateEngineCompiledDefinitions === compiledDefinitions && this.stateEngineStateProxy === this.stateProxy && this.stateEngineStateSort === this.stateSort && this.stateEngineMergeMode === this.stateMergeMode && this.stateEngineStateProxyModeKey === stateProxyModeKey || (this.stateEngine = new state_engine_1.StateEngine({
             compiledDefinitions: compiledDefinitions,
@@ -856,7 +863,7 @@ class Graphic extends node_tree_1.Node {
         this.stateEngineStateSort = this.stateSort, this.stateEngineMergeMode = this.stateMergeMode, 
         this.stateEngineStateProxyModeKey = stateProxyModeKey) : (this.stateEngine = void 0, 
         this.stateEngineCompiledDefinitions = void 0, this.stateEngineStateProxyModeKey = void 0), 
-        new state_model_1.StateModel({
+        this.syncStateResolveContext(stateResolveBaseAttrs), new state_model_1.StateModel({
             states: this.states,
             currentStates: this.currentStates,
             stateSort: this.stateSort,
@@ -917,6 +924,65 @@ class Graphic extends node_tree_1.Node {
             resolvedStateAttrs: resolvedStateAttrs
         };
     }
+    resolveGraphicStateTransition(states, previousStates, forceResolverRefresh = !1) {
+        var _a, _b;
+        let transition = this.resolveSimpleLocalStateTransition(states, previousStates);
+        const isSimpleLocalTransition = !!transition;
+        let resolvedStateAttrs;
+        if (transition) resolvedStateAttrs = transition.resolvedStateAttrs; else {
+            const stateResolveBaseAttrs = this.getStateResolveBaseAttrs(), stateModel = this.createStateModel(stateResolveBaseAttrs);
+            forceResolverRefresh && (null === (_a = this.stateEngine) || void 0 === _a || _a.invalidateResolverCache()), 
+            transition = stateModel.useStates(states), resolvedStateAttrs = this.stateEngine && this.compiledStateDefinitions ? Object.assign({}, this.stateEngine.resolvedPatch) : this.getStateStyleResolver(this.stateMergeMode).resolve(stateResolveBaseAttrs, this.states, this.stateProxy, transition.states, this.stateSort);
+        }
+        return {
+            transition: transition,
+            effectiveStates: null !== (_b = transition.effectiveStates) && void 0 !== _b ? _b : transition.states,
+            resolvedStateAttrs: resolvedStateAttrs,
+            isSimpleLocalTransition: isSimpleLocalTransition
+        };
+    }
+    normalizeSetStatesOptions(options) {
+        return options && "object" == typeof options ? {
+            hasAnimation: options.animate,
+            animateSameStatePatchChange: !0 === options.animateSameStatePatchChange,
+            shouldRefreshSameStatePatch: !0
+        } : {
+            hasAnimation: "boolean" == typeof options ? options : void 0,
+            animateSameStatePatchChange: !1,
+            shouldRefreshSameStatePatch: !1
+        };
+    }
+    sameStatePatches(left, right) {
+        const leftRecord = null != left ? left : {}, rightRecord = null != right ? right : {}, keys = new Set([ ...Object.keys(leftRecord), ...Object.keys(rightRecord) ]);
+        for (const key of keys) {
+            if (Object.prototype.hasOwnProperty.call(leftRecord, key) !== Object.prototype.hasOwnProperty.call(rightRecord, key)) return !1;
+            if (!areAttributeValuesEqual(leftRecord[key], rightRecord[key])) return !1;
+        }
+        return !0;
+    }
+    commitSameStatePatchRefresh(states, hasAnimation, animateSameStatePatchChange = !1) {
+        var _a;
+        const previousStates = null !== (_a = this.currentStates) && void 0 !== _a ? _a : EMPTY_STATE_NAMES, previousResolvedStatePatch = this.resolvedStatePatch, {transition: transition, effectiveStates: effectiveStates, resolvedStateAttrs: resolvedStateAttrs, isSimpleLocalTransition: isSimpleLocalTransition} = this.resolveGraphicStateTransition(states, previousStates, !0), patchChanged = !this.sameStatePatches(previousResolvedStatePatch, resolvedStateAttrs);
+        if ((!patchChanged || this.beforeStateUpdate(resolvedStateAttrs, previousStates, transition.states, hasAnimation, !1)) && (this.currentStates = transition.states, 
+        this.effectiveStates = isSimpleLocalTransition ? effectiveStates : [ ...effectiveStates ], 
+        this.resolvedStatePatch = resolvedStateAttrs, this.sharedStateDirty = !1, this.syncSharedStateActiveRegistrations(), 
+        patchChanged)) {
+            if (this.stage) {
+                const perfMonitor = (0, state_perf_monitor_1.getActiveStageStatePerfMonitor)(this.stage);
+                null == perfMonitor || perfMonitor.incrementCounter("stateCommits"), null == perfMonitor || perfMonitor.recordEvent("state-commit", {
+                    graphicId: this._uid,
+                    targetStates: [ ...transition.states ]
+                });
+            }
+            hasAnimation && animateSameStatePatchChange ? (this._syncFinalAttributeFromStaticTruth(), 
+            this.applyStateAttrs(resolvedStateAttrs, transition.states, hasAnimation, !1, void 0, this.buildRemovedStateAnimationAttrs(resolvedStateAttrs, previousResolvedStatePatch))) : (this.stopStateAnimates(), 
+            this.attributeMayContainTransientAttrs ? this._restoreAttributeFromStaticTruth({
+                type: enums_1.AttributeUpdateType.STATE
+            }) : this.restoreAttributeFromStatePatchDelta(previousResolvedStatePatch, this.resolvedStatePatch, {
+                type: enums_1.AttributeUpdateType.STATE
+            }), this.emitStateUpdateEvent());
+        }
+    }
     resolveStateAnimateConfig(animateConfig) {
         var _a, _b, _c;
         return null !== (_c = null !== (_a = null != animateConfig ? animateConfig : this.stateAnimateConfig) && void 0 !== _a ? _a : null === (_b = this.context) || void 0 === _b ? void 0 : _b.stateAnimateConfig) && void 0 !== _c ? _c : config_2.DefaultStateAnimateConfig;
@@ -993,32 +1059,22 @@ class Graphic extends node_tree_1.Node {
         const transition = this.createStateModel().addState(stateName, keepCurrentStates);
         transition.changed && this.useStates(transition.states, hasAnimation);
     }
-    setStates(states, hasAnimation) {
+    setStates(states, options) {
         var _a, _b, _c;
-        const nextStates = (null == states ? void 0 : states.length) ? states : EMPTY_STATE_NAMES, hasCurrentState = !!((null === (_a = this.currentStates) || void 0 === _a ? void 0 : _a.length) || (null === (_b = this.effectiveStates) || void 0 === _b ? void 0 : _b.length) || this.resolvedStatePatch || (null === (_c = this.registeredActiveScopes) || void 0 === _c ? void 0 : _c.size));
-        if (nextStates.length) this.sameStateNames(this.currentStates, nextStates) ? this.sharedStateDirty && this.refreshSharedStateBeforeRender() : this.useStates(nextStates, hasAnimation); else {
+        const {hasAnimation: hasAnimation, animateSameStatePatchChange: animateSameStatePatchChange, shouldRefreshSameStatePatch: shouldRefreshSameStatePatch} = this.normalizeSetStatesOptions(options), nextStates = (null == states ? void 0 : states.length) ? states : EMPTY_STATE_NAMES, hasCurrentState = !!((null === (_a = this.currentStates) || void 0 === _a ? void 0 : _a.length) || (null === (_b = this.effectiveStates) || void 0 === _b ? void 0 : _b.length) || this.resolvedStatePatch || (null === (_c = this.registeredActiveScopes) || void 0 === _c ? void 0 : _c.size));
+        if (nextStates.length) {
+            if (this.sameStateNames(this.currentStates, nextStates)) return shouldRefreshSameStatePatch ? void this.commitSameStatePatchRefresh(nextStates, hasAnimation, animateSameStatePatchChange) : void (this.sharedStateDirty && this.refreshSharedStateBeforeRender());
+            this.useStates(nextStates, hasAnimation);
+        } else {
             if (!hasCurrentState && !this.sharedStateDirty) return;
             this.clearStates(hasAnimation);
         }
     }
     useStates(states, hasAnimation) {
-        var _a, _b, _c, _d;
+        var _a;
         if (!states.length) return void this.clearStates(hasAnimation);
-        const previousStates = null !== (_a = this.currentStates) && void 0 !== _a ? _a : EMPTY_STATE_NAMES, previousResolvedStatePatch = this.resolvedStatePatch;
-        let transition = this.resolveSimpleLocalStateTransition(states, previousStates);
-        const isSimpleLocalTransition = !!transition;
-        let resolvedStateAttrs;
-        if (transition) {
-            if (!transition.changed) return;
-            resolvedStateAttrs = transition.resolvedStateAttrs;
-        } else {
-            const stateResolveBaseAttrs = null !== (_b = this.baseAttributes) && void 0 !== _b ? _b : this.attribute, stateModel = this.createStateModel();
-            if (null === (_c = this.stateEngine) || void 0 === _c || _c.setResolveContext(this, stateResolveBaseAttrs), 
-            transition = stateModel.useStates(states), !transition.changed && this.sameStateNames(previousStates, transition.states)) return;
-            resolvedStateAttrs = this.stateEngine && this.compiledStateDefinitions ? Object.assign({}, this.stateEngine.resolvedPatch) : this.getStateStyleResolver(this.stateMergeMode).resolve(stateResolveBaseAttrs, this.states, this.stateProxy, transition.states, this.stateSort);
-        }
-        const effectiveStates = null !== (_d = transition.effectiveStates) && void 0 !== _d ? _d : transition.states;
-        if (this.beforeStateUpdate(resolvedStateAttrs, previousStates, transition.states, hasAnimation, !1)) {
+        const previousStates = null !== (_a = this.currentStates) && void 0 !== _a ? _a : EMPTY_STATE_NAMES, previousResolvedStatePatch = this.resolvedStatePatch, {transition: transition, effectiveStates: effectiveStates, resolvedStateAttrs: resolvedStateAttrs, isSimpleLocalTransition: isSimpleLocalTransition} = this.resolveGraphicStateTransition(states, previousStates);
+        if ((transition.changed || !this.sameStateNames(previousStates, transition.states)) && this.beforeStateUpdate(resolvedStateAttrs, previousStates, transition.states, hasAnimation, !1)) {
             if (this.currentStates = transition.states, this.effectiveStates = isSimpleLocalTransition ? effectiveStates : [ ...effectiveStates ], 
             this.resolvedStatePatch = resolvedStateAttrs, this.sharedStateDirty = !1, this.syncSharedStateActiveRegistrations(), 
             this.stage) {
@@ -1037,10 +1093,10 @@ class Graphic extends node_tree_1.Node {
         }
     }
     invalidateResolver() {
-        var _a, _b, _c;
+        var _a, _b;
         if (!this.stateEngine || !(null === (_a = this.currentStates) || void 0 === _a ? void 0 : _a.length) || !this.compiledStateDefinitions) return;
-        const stateResolveBaseAttrs = null !== (_b = this.baseAttributes) && void 0 !== _b ? _b : this.attribute;
-        this.stateEngine.setResolveContext(this, stateResolveBaseAttrs), this.resolverEpoch = (null !== (_c = this.resolverEpoch) && void 0 !== _c ? _c : 0) + 1, 
+        this.syncStateResolveContext();
+        this.resolverEpoch = (null !== (_b = this.resolverEpoch) && void 0 !== _b ? _b : 0) + 1, 
         this.stateEngine.invalidateResolverCache();
         const transition = this.stateEngine.applyStates(this.currentStates), resolvedStateAttrs = Object.assign({}, this.stateEngine.resolvedPatch);
         this.effectiveStates = [ ...transition.effectiveStates ], this.resolvedStatePatch = resolvedStateAttrs,