@visactor/vrender-core 1.1.0-alpha.6 → 1.1.0-alpha.8

package/cjs/graphic/rect.d.ts

@@ -40,6 +40,8 @@ export declare class Rect extends Graphic<IRectGraphicAttribute> implements IRec
     protected updateAABBBounds(attribute: IRectGraphicAttribute, rectTheme: Required<IRectGraphicAttribute>, aabbBounds: IAABBBounds): import("@visactor/vutils").IBounds;
     protected needUpdateTags(keys: string[]): boolean;
     protected needUpdateTag(key: string): boolean;
+    protected shouldSkipStateTransitionDefaultAttribute(key: string, targetAttrs?: Partial<IRectGraphicAttribute>): boolean;
+    protected getStateTransitionDefaultAttribute(key: string, targetAttrs?: Partial<IRectGraphicAttribute>): any;
     toCustomPath(): ICustomPath2D;
     clone(): Rect;
     getNoWorkAnimateAttr(): Record<string, number>;

package/cjs/graphic/rect.js

@@ -38,6 +38,50 @@ class Rect extends graphic_1.Graphic {
     needUpdateTag(key) {
         return super.needUpdateTag(key, RECT_UPDATE_TAG_KEY);
     }
+    shouldSkipStateTransitionDefaultAttribute(key, targetAttrs) {
+        var _a;
+        const attrs = null !== (_a = null != targetAttrs ? targetAttrs : this.baseAttributes) && void 0 !== _a ? _a : this.attribute, hasValue = attrKey => null != attrs[attrKey], isNilValue = attrKey => null == attrs[attrKey];
+        switch (key) {
+          case "width":
+            return isNilValue("width") && hasValue("x") && hasValue("x1");
+
+          case "height":
+            return isNilValue("height") && hasValue("y") && hasValue("y1");
+
+          case "x1":
+            return isNilValue("x1") && hasValue("x") && hasValue("width");
+
+          case "y1":
+            return isNilValue("y1") && hasValue("y") && hasValue("height");
+
+          default:
+            return !1;
+        }
+    }
+    getStateTransitionDefaultAttribute(key, targetAttrs) {
+        var _a;
+        const attrs = null !== (_a = null != targetAttrs ? targetAttrs : this.baseAttributes) && void 0 !== _a ? _a : this.attribute, getNumber = attrKey => {
+            const value = attrs[attrKey];
+            return "number" == typeof value && Number.isFinite(value) ? value : void 0;
+        }, x = getNumber("x"), y = getNumber("y"), x1 = getNumber("x1"), y1 = getNumber("y1"), width = getNumber("width"), height = getNumber("height");
+        switch (key) {
+          case "width":
+            if (null == width && null != x && null != x1) return x1 - x;
+            break;
+
+          case "height":
+            if (null == height && null != y && null != y1) return y1 - y;
+            break;
+
+          case "x1":
+            if (null == x1 && null != x && null != width) return x + width;
+            break;
+
+          case "y1":
+            if (null == y1 && null != y && null != height) return y + height;
+        }
+        return super.getStateTransitionDefaultAttribute(key, targetAttrs);
+    }
     toCustomPath() {
         let path = super.toCustomPath();
         if (path) return path;

package/cjs/graphic/rect.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/graphic/rect.ts"],"names":[],"mappings":"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","file":"rect.js","sourcesContent":["import type { IAABBBounds } from '@visactor/vutils';\nimport { Graphic, GRAPHIC_UPDATE_TAG_KEY, NOWORK_ANIMATE_ATTR } from './graphic';\nimport type { GraphicType, ICustomPath2D, IRect, IRectGraphicAttribute } from '../interface';\nimport { CustomPath2D } from '../common/custom-path2d';\nimport { getTheme } from './theme';\nimport { application } from '../application';\nimport { RECT_NUMBER_TYPE } from './constants';\nimport { normalizeRectAttributes } from '../common/rect-utils';\nimport { updateBoundsOfCommonOuterBorder } from './graphic-service/common-outer-boder-bounds';\nimport { EmptyContext2d } from '../canvas';\n\nconst RECT_UPDATE_TAG_KEY = ['width', 'x1', 'y1', 'height', 'cornerRadius', ...GRAPHIC_UPDATE_TAG_KEY];\n\nexport class Rect extends Graphic<IRectGraphicAttribute> implements IRect {\n  type: GraphicType = 'rect';\n\n  static NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;\n\n  constructor(params: IRectGraphicAttribute) {\n    super(params);\n    this.numberType = RECT_NUMBER_TYPE;\n  }\n\n  isValid(): boolean {\n    return super.isValid() && this._isValid();\n  }\n  private _isValid(): boolean {\n    return true;\n    // 暂时不判断，理论上认为都是合法的，节省性能耗时\n    // const { width, x1, y1, height } = this.attribute;\n    // return (this._validNumber(width) || this._validNumber(x1)) && (this._validNumber(height) || this._validNumber(y1));\n  }\n\n  getGraphicTheme(): Required<IRectGraphicAttribute> {\n    return getTheme(this).rect;\n  }\n\n  protected updateAABBBounds(\n    attribute: IRectGraphicAttribute,\n    rectTheme: Required<IRectGraphicAttribute>,\n    aabbBounds: IAABBBounds\n  ) {\n    if (!this.updatePathProxyAABBBounds(aabbBounds)) {\n      let { width, height } = attribute;\n      const { x1, y1, x, y } = attribute;\n      width = width ?? x1 - x;\n      height = height ?? y1 - y;\n      if (isFinite(width) || isFinite(height) || isFinite(x) || isFinite(y)) {\n        aabbBounds.set(0, 0, width || 0, height || 0);\n      }\n    }\n\n    const { tb1, tb2 } = application.graphicService.updateTempAABBBounds(aabbBounds);\n\n    updateBoundsOfCommonOuterBorder(attribute, rectTheme, tb1);\n    aabbBounds.union(tb1);\n    tb1.setValue(tb2.x1, tb2.y1, tb2.x2, tb2.y2);\n\n    this.widthWithoutTransform = aabbBounds.x2 - aabbBounds.x1;\n    this.heightWithoutTransform = aabbBounds.y2 - aabbBounds.y1;\n\n    application.graphicService.transformAABBBounds(attribute, aabbBounds, rectTheme, false, this);\n    return aabbBounds;\n  }\n\n  protected needUpdateTags(keys: string[]): boolean {\n    return super.needUpdateTags(keys, RECT_UPDATE_TAG_KEY);\n  }\n  protected needUpdateTag(key: string): boolean {\n    return super.needUpdateTag(key, RECT_UPDATE_TAG_KEY);\n  }\n\n  toCustomPath(): ICustomPath2D {\n    // throw new Error('暂不支持');\n    let path = super.toCustomPath();\n    if (path) {\n      return path;\n    }\n    const attribute = this.attribute;\n    const { x, y, width, height } = normalizeRectAttributes(attribute);\n\n    path = new CustomPath2D();\n    path.moveTo(x, y);\n    path.rect(x, y, width, height);\n\n    return path;\n  }\n\n  clone() {\n    return new Rect({ ...this.attribute });\n  }\n\n  getNoWorkAnimateAttr(): Record<string, number> {\n    return Rect.NOWORK_ANIMATE_ATTR;\n  }\n}\n\nexport function createRect(attributes: IRectGraphicAttribute): IRect {\n  return new Rect(attributes);\n}\n"]}
+{"version":3,"sources":["../src/graphic/rect.ts"],"names":[],"mappings":"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","file":"rect.js","sourcesContent":["import type { IAABBBounds } from '@visactor/vutils';\nimport { Graphic, GRAPHIC_UPDATE_TAG_KEY, NOWORK_ANIMATE_ATTR } from './graphic';\nimport type { GraphicType, ICustomPath2D, IRect, IRectGraphicAttribute } from '../interface';\nimport { CustomPath2D } from '../common/custom-path2d';\nimport { getTheme } from './theme';\nimport { application } from '../application';\nimport { RECT_NUMBER_TYPE } from './constants';\nimport { normalizeRectAttributes } from '../common/rect-utils';\nimport { updateBoundsOfCommonOuterBorder } from './graphic-service/common-outer-boder-bounds';\n\nconst RECT_UPDATE_TAG_KEY = ['width', 'x1', 'y1', 'height', 'cornerRadius', ...GRAPHIC_UPDATE_TAG_KEY];\n\nexport class Rect extends Graphic<IRectGraphicAttribute> implements IRect {\n  type: GraphicType = 'rect';\n\n  static NOWORK_ANIMATE_ATTR = NOWORK_ANIMATE_ATTR;\n\n  constructor(params: IRectGraphicAttribute) {\n    super(params);\n    this.numberType = RECT_NUMBER_TYPE;\n  }\n\n  isValid(): boolean {\n    return super.isValid() && this._isValid();\n  }\n  private _isValid(): boolean {\n    return true;\n    // 暂时不判断，理论上认为都是合法的，节省性能耗时\n    // const { width, x1, y1, height } = this.attribute;\n    // return (this._validNumber(width) || this._validNumber(x1)) && (this._validNumber(height) || this._validNumber(y1));\n  }\n\n  getGraphicTheme(): Required<IRectGraphicAttribute> {\n    return getTheme(this).rect;\n  }\n\n  protected updateAABBBounds(\n    attribute: IRectGraphicAttribute,\n    rectTheme: Required<IRectGraphicAttribute>,\n    aabbBounds: IAABBBounds\n  ) {\n    if (!this.updatePathProxyAABBBounds(aabbBounds)) {\n      let { width, height } = attribute;\n      const { x1, y1, x, y } = attribute;\n      width = width ?? x1 - x;\n      height = height ?? y1 - y;\n      if (isFinite(width) || isFinite(height) || isFinite(x) || isFinite(y)) {\n        aabbBounds.set(0, 0, width || 0, height || 0);\n      }\n    }\n\n    const { tb1, tb2 } = application.graphicService.updateTempAABBBounds(aabbBounds);\n\n    updateBoundsOfCommonOuterBorder(attribute, rectTheme, tb1);\n    aabbBounds.union(tb1);\n    tb1.setValue(tb2.x1, tb2.y1, tb2.x2, tb2.y2);\n\n    this.widthWithoutTransform = aabbBounds.x2 - aabbBounds.x1;\n    this.heightWithoutTransform = aabbBounds.y2 - aabbBounds.y1;\n\n    application.graphicService.transformAABBBounds(attribute, aabbBounds, rectTheme, false, this);\n    return aabbBounds;\n  }\n\n  protected needUpdateTags(keys: string[]): boolean {\n    return super.needUpdateTags(keys, RECT_UPDATE_TAG_KEY);\n  }\n  protected needUpdateTag(key: string): boolean {\n    return super.needUpdateTag(key, RECT_UPDATE_TAG_KEY);\n  }\n\n  protected shouldSkipStateTransitionDefaultAttribute(\n    key: string,\n    targetAttrs?: Partial<IRectGraphicAttribute>\n  ): boolean {\n    const attrs = (targetAttrs ?? this.baseAttributes ?? this.attribute) as Partial<IRectGraphicAttribute>;\n    const hasValue = (attrKey: keyof IRectGraphicAttribute) => (attrs as any)[attrKey] != null;\n    const isNilValue = (attrKey: keyof IRectGraphicAttribute) => (attrs as any)[attrKey] == null;\n\n    switch (key) {\n      case 'width':\n        return isNilValue('width') && hasValue('x') && hasValue('x1');\n      case 'height':\n        return isNilValue('height') && hasValue('y') && hasValue('y1');\n      case 'x1':\n        return isNilValue('x1') && hasValue('x') && hasValue('width');\n      case 'y1':\n        return isNilValue('y1') && hasValue('y') && hasValue('height');\n      default:\n        return false;\n    }\n  }\n\n  protected getStateTransitionDefaultAttribute(key: string, targetAttrs?: Partial<IRectGraphicAttribute>) {\n    const attrs = (targetAttrs ?? this.baseAttributes ?? this.attribute) as Partial<IRectGraphicAttribute>;\n    const getNumber = (attrKey: keyof IRectGraphicAttribute) => {\n      const value = attrs[attrKey];\n      return typeof value === 'number' && Number.isFinite(value) ? value : undefined;\n    };\n    const x = getNumber('x');\n    const y = getNumber('y');\n    const x1 = getNumber('x1');\n    const y1 = getNumber('y1');\n    const width = getNumber('width');\n    const height = getNumber('height');\n\n    switch (key) {\n      case 'width':\n        if (width == null && x != null && x1 != null) {\n          return x1 - x;\n        }\n        break;\n      case 'height':\n        if (height == null && y != null && y1 != null) {\n          return y1 - y;\n        }\n        break;\n      case 'x1':\n        if (x1 == null && x != null && width != null) {\n          return x + width;\n        }\n        break;\n      case 'y1':\n        if (y1 == null && y != null && height != null) {\n          return y + height;\n        }\n        break;\n    }\n\n    return super.getStateTransitionDefaultAttribute(key, targetAttrs);\n  }\n\n  toCustomPath(): ICustomPath2D {\n    // throw new Error('暂不支持');\n    let path = super.toCustomPath();\n    if (path) {\n      return path;\n    }\n    const attribute = this.attribute;\n    const { x, y, width, height } = normalizeRectAttributes(attribute);\n\n    path = new CustomPath2D();\n    path.moveTo(x, y);\n    path.rect(x, y, width, height);\n\n    return path;\n  }\n\n  clone() {\n    return new Rect({ ...this.attribute });\n  }\n\n  getNoWorkAnimateAttr(): Record<string, number> {\n    return Rect.NOWORK_ANIMATE_ATTR;\n  }\n}\n\nexport function createRect(attributes: IRectGraphicAttribute): IRect {\n  return new Rect(attributes);\n}\n"]}

package/cjs/graphic/state/state-transition-orchestrator.d.ts

@@ -11,10 +11,14 @@ export interface IStateTransitionAnalysisOptions {
     noWorkAnimateAttr?: Record<string, number>;
     isClear?: boolean;
     getDefaultAttribute?: (key: string) => unknown;
+    shouldSkipDefaultAttribute?: (key: string, targetAttrs: Record<string, unknown>) => boolean;
     animateConfig?: IAnimateConfig;
+    extraAnimateAttrs?: Record<string, unknown>;
 }
 export interface IStateTransitionApplyOptions {
     animateConfig?: IAnimateConfig;
+    extraAnimateAttrs?: Record<string, unknown>;
+    shouldSkipDefaultAttribute?: (key: string, targetAttrs: Record<string, unknown>) => boolean;
 }
 export interface IStateTransitionGraphic<T> {
     finalAttribute?: Record<string, any>;
@@ -28,6 +32,7 @@ export interface IStateTransitionGraphic<T> {
     }) => void;
     getNoWorkAnimateAttr?: () => Record<string, number>;
     getDefaultAttribute?: (key: string) => unknown;
+    shouldSkipStateTransitionDefaultAttribute?: (key: string, targetAttrs?: Partial<T>) => boolean;
 }
 export interface IStateTransitionOrchestrator<T> {
     analyzeTransition: (currentAttrs: Partial<T>, targetAttrs: Partial<T>, stateNames?: string[], hasAnimation?: boolean, options?: IStateTransitionAnalysisOptions) => IStateTransitionPlan<T>;

package/cjs/graphic/state/state-transition-orchestrator.js

@@ -27,11 +27,21 @@ class StateTransitionOrchestrator {
             noAnimateAttrs: {}
         };
         if (!hasAnimation) return plan;
-        const noWorkAnimateAttr = Object.assign(Object.assign({}, null !== (_a = options.noWorkAnimateAttr) && void 0 !== _a ? _a : {}), normalizeNoAnimateAttrConfig(null === (_b = options.animateConfig) || void 0 === _b ? void 0 : _b.noAnimateAttrs)), isClear = !0 === options.isClear, getDefaultAttribute = options.getDefaultAttribute;
+        const noWorkAnimateAttr = Object.assign(Object.assign({}, null !== (_a = options.noWorkAnimateAttr) && void 0 !== _a ? _a : {}), normalizeNoAnimateAttrConfig(null === (_b = options.animateConfig) || void 0 === _b ? void 0 : _b.noAnimateAttrs)), isClear = !0 === options.isClear, getDefaultAttribute = options.getDefaultAttribute, shouldSkipDefaultAttribute = options.shouldSkipDefaultAttribute, assignTransitionAttr = (key, value) => {
+            if (noWorkAnimateAttr[key]) return plan.jumpAttrs[key] = value, void (plan.noAnimateAttrs[key] = value);
+            if (isClear && void 0 === value) {
+                if (null == shouldSkipDefaultAttribute ? void 0 : shouldSkipDefaultAttribute(key, targetAttrs)) return;
+                plan.animateAttrs[key] = getDefaultAttribute ? getDefaultAttribute(key) : value;
+            } else plan.animateAttrs[key] = value;
+        };
         for (const key in targetAttrs) {
             if (!Object.prototype.hasOwnProperty.call(targetAttrs, key)) continue;
-            const value = targetAttrs[key];
-            noWorkAnimateAttr[key] ? (plan.jumpAttrs[key] = value, plan.noAnimateAttrs[key] = value) : plan.animateAttrs[key] = isClear && void 0 === value && getDefaultAttribute ? getDefaultAttribute(key) : value;
+            assignTransitionAttr(key, targetAttrs[key]);
+        }
+        const extraAnimateAttrs = options.extraAnimateAttrs;
+        if (extraAnimateAttrs) for (const key in extraAnimateAttrs) {
+            const hasTargetAttr = Object.prototype.hasOwnProperty.call(targetAttrs, key);
+            !Object.prototype.hasOwnProperty.call(extraAnimateAttrs, key) || hasTargetAttr && void 0 !== targetAttrs[key] || assignTransitionAttr(key, extraAnimateAttrs[key]);
         }
         return plan;
     }
@@ -59,12 +69,14 @@ class StateTransitionOrchestrator {
         }), plan;
     }
     applyClearTransition(graphic, targetAttrs, hasAnimation, stateNames, options = {}) {
-        var _a, _b;
+        var _a, _b, _c, _d;
         const plan = this.analyzeTransition({}, targetAttrs, stateNames, hasAnimation, {
             noWorkAnimateAttr: null === (_a = graphic.getNoWorkAnimateAttr) || void 0 === _a ? void 0 : _a.call(graphic),
             isClear: !0,
             getDefaultAttribute: null === (_b = graphic.getDefaultAttribute) || void 0 === _b ? void 0 : _b.bind(graphic),
-            animateConfig: options.animateConfig
+            shouldSkipDefaultAttribute: null !== (_c = options.shouldSkipDefaultAttribute) && void 0 !== _c ? _c : null === (_d = graphic.shouldSkipStateTransitionDefaultAttribute) || void 0 === _d ? void 0 : _d.bind(graphic),
+            animateConfig: options.animateConfig,
+            extraAnimateAttrs: options.extraAnimateAttrs
         });
         return this.applyTransition(graphic, plan, hasAnimation, options);
     }

package/cjs/graphic/state/state-transition-orchestrator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/graphic/state/state-transition-orchestrator.ts"],"names":[],"mappings":"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","file":"state-transition-orchestrator.js","sourcesContent":["import { DefaultStateAnimateConfig } from '../../animate/config';\nimport { AttributeUpdateType } from '../../common/enums';\nimport type { IAnimateConfig } from '../../interface/graphic';\n\nexport interface IStateTransitionPlan<T> {\n  stateNames?: string[];\n  targetAttrs: Partial<T>;\n  animateAttrs: Partial<T>;\n  jumpAttrs: Partial<T>;\n  noAnimateAttrs: Partial<T>;\n}\n\nexport interface IStateTransitionAnalysisOptions {\n  noWorkAnimateAttr?: Record<string, number>;\n  isClear?: boolean;\n  getDefaultAttribute?: (key: string) => unknown;\n  animateConfig?: IAnimateConfig;\n}\n\nexport interface IStateTransitionApplyOptions {\n  animateConfig?: IAnimateConfig;\n}\n\nexport interface IStateTransitionGraphic<T> {\n  finalAttribute?: Record<string, any>;\n  applyAnimationState?: (state: string[], animations: Array<Record<string, any>>) => void;\n  setAttributesAndPreventAnimate: (\n    attrs: Partial<T>,\n    forceUpdateTag?: boolean,\n    context?: { type: AttributeUpdateType }\n  ) => void;\n  stopStateAnimates: () => void;\n  _emitCustomEvent: (type: string, context?: { type: AttributeUpdateType }) => void;\n  getNoWorkAnimateAttr?: () => Record<string, number>;\n  getDefaultAttribute?: (key: string) => unknown;\n}\n\nexport interface IStateTransitionOrchestrator<T> {\n  analyzeTransition: (\n    currentAttrs: Partial<T>,\n    targetAttrs: Partial<T>,\n    stateNames?: string[],\n    hasAnimation?: boolean,\n    options?: IStateTransitionAnalysisOptions\n  ) => IStateTransitionPlan<T>;\n  applyTransition: (\n    graphic: IStateTransitionGraphic<T>,\n    plan: IStateTransitionPlan<T>,\n    hasAnimation?: boolean,\n    options?: IStateTransitionApplyOptions\n  ) => IStateTransitionPlan<T>;\n  applyClearTransition: (\n    graphic: IStateTransitionGraphic<T>,\n    targetAttrs: Partial<T>,\n    hasAnimation?: boolean,\n    stateNames?: string[],\n    options?: IStateTransitionApplyOptions\n  ) => IStateTransitionPlan<T>;\n}\n\nfunction hasOwnKeys(value: object): boolean {\n  return Object.keys(value).length > 0;\n}\n\nfunction normalizeNoAnimateAttrConfig(config?: IAnimateConfig['noAnimateAttrs']): Record<string, number> {\n  if (!config) {\n    return {};\n  }\n\n  if (Array.isArray(config)) {\n    return config.reduce<Record<string, number>>((acc, key) => {\n      acc[key] = 1;\n      return acc;\n    }, {});\n  }\n\n  return Object.keys(config).reduce<Record<string, number>>((acc, key) => {\n    if ((config as Record<string, boolean | number>)[key]) {\n      acc[key] = 1;\n    }\n    return acc;\n  }, {});\n}\n\nexport class StateTransitionOrchestrator<T extends Record<string, any> = Record<string, any>>\n  implements IStateTransitionOrchestrator<T>\n{\n  analyzeTransition(\n    _currentAttrs: Partial<T>,\n    targetAttrs: Partial<T>,\n    stateNames?: string[],\n    hasAnimation?: boolean,\n    options: IStateTransitionAnalysisOptions = {}\n  ): IStateTransitionPlan<T> {\n    const plan: IStateTransitionPlan<T> = {\n      stateNames,\n      targetAttrs: { ...targetAttrs },\n      animateAttrs: {},\n      jumpAttrs: {},\n      noAnimateAttrs: {}\n    };\n\n    if (!hasAnimation) {\n      return plan;\n    }\n\n    const noWorkAnimateAttr = {\n      ...(options.noWorkAnimateAttr ?? {}),\n      ...normalizeNoAnimateAttrConfig(options.animateConfig?.noAnimateAttrs)\n    };\n    const isClear = options.isClear === true;\n    const getDefaultAttribute = options.getDefaultAttribute;\n\n    for (const key in targetAttrs) {\n      if (!Object.prototype.hasOwnProperty.call(targetAttrs, key)) {\n        continue;\n      }\n\n      const value = (targetAttrs as Record<string, any>)[key];\n\n      if (noWorkAnimateAttr[key]) {\n        (plan.jumpAttrs as Record<string, any>)[key] = value;\n        (plan.noAnimateAttrs as Record<string, any>)[key] = value;\n        continue;\n      }\n\n      (plan.animateAttrs as Record<string, any>)[key] =\n        isClear && value === undefined && getDefaultAttribute ? getDefaultAttribute(key) : value;\n    }\n\n    return plan;\n  }\n\n  applyTransition(\n    graphic: IStateTransitionGraphic<T>,\n    plan: IStateTransitionPlan<T>,\n    hasAnimation?: boolean,\n    options: IStateTransitionApplyOptions = {}\n  ): IStateTransitionPlan<T> {\n    if (hasAnimation) {\n      const stateAnimateConfig = options.animateConfig ?? DefaultStateAnimateConfig;\n      graphic.applyAnimationState?.(\n        ['state'],\n        [\n          {\n            name: 'state',\n            animation: {\n              type: 'state',\n              to: plan.animateAttrs,\n              duration: stateAnimateConfig.duration,\n              easing: stateAnimateConfig.easing\n            }\n          }\n        ]\n      );\n\n      if (hasOwnKeys(plan.noAnimateAttrs)) {\n        graphic.setAttributesAndPreventAnimate(plan.noAnimateAttrs, false, { type: AttributeUpdateType.STATE });\n      }\n    } else {\n      graphic.stopStateAnimates();\n      graphic.setAttributesAndPreventAnimate(plan.targetAttrs, false, { type: AttributeUpdateType.STATE });\n    }\n\n    if (graphic.finalAttribute) {\n      Object.assign(graphic.finalAttribute, plan.targetAttrs);\n    }\n\n    graphic._emitCustomEvent('afterStateUpdate', { type: AttributeUpdateType.STATE });\n\n    return plan;\n  }\n\n  applyClearTransition(\n    graphic: IStateTransitionGraphic<T>,\n    targetAttrs: Partial<T>,\n    hasAnimation?: boolean,\n    stateNames?: string[],\n    options: IStateTransitionApplyOptions = {}\n  ): IStateTransitionPlan<T> {\n    const plan = this.analyzeTransition({}, targetAttrs, stateNames, hasAnimation, {\n      noWorkAnimateAttr: graphic.getNoWorkAnimateAttr?.(),\n      isClear: true,\n      getDefaultAttribute: graphic.getDefaultAttribute?.bind(graphic),\n      animateConfig: options.animateConfig\n    });\n\n    return this.applyTransition(graphic, plan, hasAnimation, options);\n  }\n}\n"]}
+{"version":3,"sources":["../src/graphic/state/state-transition-orchestrator.ts"],"names":[],"mappings":"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","file":"state-transition-orchestrator.js","sourcesContent":["import { DefaultStateAnimateConfig } from '../../animate/config';\nimport { AttributeUpdateType } from '../../common/enums';\nimport type { IAnimateConfig } from '../../interface/graphic';\n\nexport interface IStateTransitionPlan<T> {\n  stateNames?: string[];\n  targetAttrs: Partial<T>;\n  animateAttrs: Partial<T>;\n  jumpAttrs: Partial<T>;\n  noAnimateAttrs: Partial<T>;\n}\n\nexport interface IStateTransitionAnalysisOptions {\n  noWorkAnimateAttr?: Record<string, number>;\n  isClear?: boolean;\n  getDefaultAttribute?: (key: string) => unknown;\n  shouldSkipDefaultAttribute?: (key: string, targetAttrs: Record<string, unknown>) => boolean;\n  animateConfig?: IAnimateConfig;\n  extraAnimateAttrs?: Record<string, unknown>;\n}\n\nexport interface IStateTransitionApplyOptions {\n  animateConfig?: IAnimateConfig;\n  extraAnimateAttrs?: Record<string, unknown>;\n  shouldSkipDefaultAttribute?: (key: string, targetAttrs: Record<string, unknown>) => boolean;\n}\n\nexport interface IStateTransitionGraphic<T> {\n  finalAttribute?: Record<string, any>;\n  applyAnimationState?: (state: string[], animations: Array<Record<string, any>>) => void;\n  setAttributesAndPreventAnimate: (\n    attrs: Partial<T>,\n    forceUpdateTag?: boolean,\n    context?: { type: AttributeUpdateType }\n  ) => void;\n  stopStateAnimates: () => void;\n  _emitCustomEvent: (type: string, context?: { type: AttributeUpdateType }) => void;\n  getNoWorkAnimateAttr?: () => Record<string, number>;\n  getDefaultAttribute?: (key: string) => unknown;\n  shouldSkipStateTransitionDefaultAttribute?: (key: string, targetAttrs?: Partial<T>) => boolean;\n}\n\nexport interface IStateTransitionOrchestrator<T> {\n  analyzeTransition: (\n    currentAttrs: Partial<T>,\n    targetAttrs: Partial<T>,\n    stateNames?: string[],\n    hasAnimation?: boolean,\n    options?: IStateTransitionAnalysisOptions\n  ) => IStateTransitionPlan<T>;\n  applyTransition: (\n    graphic: IStateTransitionGraphic<T>,\n    plan: IStateTransitionPlan<T>,\n    hasAnimation?: boolean,\n    options?: IStateTransitionApplyOptions\n  ) => IStateTransitionPlan<T>;\n  applyClearTransition: (\n    graphic: IStateTransitionGraphic<T>,\n    targetAttrs: Partial<T>,\n    hasAnimation?: boolean,\n    stateNames?: string[],\n    options?: IStateTransitionApplyOptions\n  ) => IStateTransitionPlan<T>;\n}\n\nfunction hasOwnKeys(value: object): boolean {\n  return Object.keys(value).length > 0;\n}\n\nfunction normalizeNoAnimateAttrConfig(config?: IAnimateConfig['noAnimateAttrs']): Record<string, number> {\n  if (!config) {\n    return {};\n  }\n\n  if (Array.isArray(config)) {\n    return config.reduce<Record<string, number>>((acc, key) => {\n      acc[key] = 1;\n      return acc;\n    }, {});\n  }\n\n  return Object.keys(config).reduce<Record<string, number>>((acc, key) => {\n    if ((config as Record<string, boolean | number>)[key]) {\n      acc[key] = 1;\n    }\n    return acc;\n  }, {});\n}\n\nexport class StateTransitionOrchestrator<T extends Record<string, any> = Record<string, any>>\n  implements IStateTransitionOrchestrator<T>\n{\n  analyzeTransition(\n    _currentAttrs: Partial<T>,\n    targetAttrs: Partial<T>,\n    stateNames?: string[],\n    hasAnimation?: boolean,\n    options: IStateTransitionAnalysisOptions = {}\n  ): IStateTransitionPlan<T> {\n    const plan: IStateTransitionPlan<T> = {\n      stateNames,\n      targetAttrs: { ...targetAttrs },\n      animateAttrs: {},\n      jumpAttrs: {},\n      noAnimateAttrs: {}\n    };\n\n    if (!hasAnimation) {\n      return plan;\n    }\n\n    const noWorkAnimateAttr = {\n      ...(options.noWorkAnimateAttr ?? {}),\n      ...normalizeNoAnimateAttrConfig(options.animateConfig?.noAnimateAttrs)\n    };\n    const isClear = options.isClear === true;\n    const getDefaultAttribute = options.getDefaultAttribute;\n    const shouldSkipDefaultAttribute = options.shouldSkipDefaultAttribute;\n\n    const assignTransitionAttr = (key: string, value: any): void => {\n      if (noWorkAnimateAttr[key]) {\n        (plan.jumpAttrs as Record<string, any>)[key] = value;\n        (plan.noAnimateAttrs as Record<string, any>)[key] = value;\n        return;\n      }\n\n      if (isClear && value === undefined) {\n        if (shouldSkipDefaultAttribute?.(key, targetAttrs as Record<string, unknown>)) {\n          return;\n        }\n        (plan.animateAttrs as Record<string, any>)[key] = getDefaultAttribute ? getDefaultAttribute(key) : value;\n        return;\n      }\n\n      (plan.animateAttrs as Record<string, any>)[key] = value;\n    };\n\n    for (const key in targetAttrs) {\n      if (!Object.prototype.hasOwnProperty.call(targetAttrs, key)) {\n        continue;\n      }\n\n      const value = (targetAttrs as Record<string, any>)[key];\n      assignTransitionAttr(key, value);\n    }\n\n    const extraAnimateAttrs = options.extraAnimateAttrs;\n    if (extraAnimateAttrs) {\n      for (const key in extraAnimateAttrs) {\n        const hasTargetAttr = Object.prototype.hasOwnProperty.call(targetAttrs, key);\n        if (\n          !Object.prototype.hasOwnProperty.call(extraAnimateAttrs, key) ||\n          (hasTargetAttr && (targetAttrs as Record<string, any>)[key] !== undefined)\n        ) {\n          continue;\n        }\n        assignTransitionAttr(key, (extraAnimateAttrs as Record<string, any>)[key]);\n      }\n    }\n\n    return plan;\n  }\n\n  applyTransition(\n    graphic: IStateTransitionGraphic<T>,\n    plan: IStateTransitionPlan<T>,\n    hasAnimation?: boolean,\n    options: IStateTransitionApplyOptions = {}\n  ): IStateTransitionPlan<T> {\n    if (hasAnimation) {\n      const stateAnimateConfig = options.animateConfig ?? DefaultStateAnimateConfig;\n      graphic.applyAnimationState?.(\n        ['state'],\n        [\n          {\n            name: 'state',\n            animation: {\n              type: 'state',\n              to: plan.animateAttrs,\n              duration: stateAnimateConfig.duration,\n              easing: stateAnimateConfig.easing\n            }\n          }\n        ]\n      );\n\n      if (hasOwnKeys(plan.noAnimateAttrs)) {\n        graphic.setAttributesAndPreventAnimate(plan.noAnimateAttrs, false, { type: AttributeUpdateType.STATE });\n      }\n    } else {\n      graphic.stopStateAnimates();\n      graphic.setAttributesAndPreventAnimate(plan.targetAttrs, false, { type: AttributeUpdateType.STATE });\n    }\n\n    if (graphic.finalAttribute) {\n      Object.assign(graphic.finalAttribute, plan.targetAttrs);\n    }\n\n    graphic._emitCustomEvent('afterStateUpdate', { type: AttributeUpdateType.STATE });\n\n    return plan;\n  }\n\n  applyClearTransition(\n    graphic: IStateTransitionGraphic<T>,\n    targetAttrs: Partial<T>,\n    hasAnimation?: boolean,\n    stateNames?: string[],\n    options: IStateTransitionApplyOptions = {}\n  ): IStateTransitionPlan<T> {\n    const plan = this.analyzeTransition({}, targetAttrs, stateNames, hasAnimation, {\n      noWorkAnimateAttr: graphic.getNoWorkAnimateAttr?.(),\n      isClear: true,\n      getDefaultAttribute: graphic.getDefaultAttribute?.bind(graphic),\n      shouldSkipDefaultAttribute:\n        options.shouldSkipDefaultAttribute ?? graphic.shouldSkipStateTransitionDefaultAttribute?.bind(graphic),\n      animateConfig: options.animateConfig,\n      extraAnimateAttrs: options.extraAnimateAttrs\n    });\n\n    return this.applyTransition(graphic, plan, hasAnimation, options);\n  }\n}\n"]}

package/dist/index.es.js

@@ -10227,18 +10227,39 @@ class StateTransitionOrchestrator {
         const noWorkAnimateAttr = Object.assign(Object.assign({}, ((_a = options.noWorkAnimateAttr) !== null && _a !== void 0 ? _a : {})), normalizeNoAnimateAttrConfig((_b = options.animateConfig) === null || _b === void 0 ? void 0 : _b.noAnimateAttrs));
         const isClear = options.isClear === true;
         const getDefaultAttribute = options.getDefaultAttribute;
+        const shouldSkipDefaultAttribute = options.shouldSkipDefaultAttribute;
+        const assignTransitionAttr = (key, value) => {
+            if (noWorkAnimateAttr[key]) {
+                plan.jumpAttrs[key] = value;
+                plan.noAnimateAttrs[key] = value;
+                return;
+            }
+            if (isClear && value === undefined) {
+                if (shouldSkipDefaultAttribute === null || shouldSkipDefaultAttribute === void 0 ? void 0 : shouldSkipDefaultAttribute(key, targetAttrs)) {
+                    return;
+                }
+                plan.animateAttrs[key] = getDefaultAttribute ? getDefaultAttribute(key) : value;
+                return;
+            }
+            plan.animateAttrs[key] = value;
+        };
         for (const key in targetAttrs) {
             if (!Object.prototype.hasOwnProperty.call(targetAttrs, key)) {
                 continue;
             }
             const value = targetAttrs[key];
-            if (noWorkAnimateAttr[key]) {
-                plan.jumpAttrs[key] = value;
-                plan.noAnimateAttrs[key] = value;
-                continue;
+            assignTransitionAttr(key, value);
+        }
+        const extraAnimateAttrs = options.extraAnimateAttrs;
+        if (extraAnimateAttrs) {
+            for (const key in extraAnimateAttrs) {
+                const hasTargetAttr = Object.prototype.hasOwnProperty.call(targetAttrs, key);
+                if (!Object.prototype.hasOwnProperty.call(extraAnimateAttrs, key) ||
+                    (hasTargetAttr && targetAttrs[key] !== undefined)) {
+                    continue;
+                }
+                assignTransitionAttr(key, extraAnimateAttrs[key]);
             }
-            plan.animateAttrs[key] =
-                isClear && value === undefined && getDefaultAttribute ? getDefaultAttribute(key) : value;
         }
         return plan;
     }
@@ -10272,12 +10293,14 @@ class StateTransitionOrchestrator {
         return plan;
     }
     applyClearTransition(graphic, targetAttrs, hasAnimation, stateNames, options = {}) {
-        var _a, _b;
+        var _a, _b, _c, _d;
         const plan = this.analyzeTransition({}, targetAttrs, stateNames, hasAnimation, {
             noWorkAnimateAttr: (_a = graphic.getNoWorkAnimateAttr) === null || _a === void 0 ? void 0 : _a.call(graphic),
             isClear: true,
             getDefaultAttribute: (_b = graphic.getDefaultAttribute) === null || _b === void 0 ? void 0 : _b.bind(graphic),
-            animateConfig: options.animateConfig
+            shouldSkipDefaultAttribute: (_c = options.shouldSkipDefaultAttribute) !== null && _c !== void 0 ? _c : (_d = graphic.shouldSkipStateTransitionDefaultAttribute) === null || _d === void 0 ? void 0 : _d.bind(graphic),
+            animateConfig: options.animateConfig,
+            extraAnimateAttrs: options.extraAnimateAttrs
         });
         return this.applyTransition(graphic, plan, hasAnimation, options);
     }
@@ -10859,21 +10882,36 @@ class Graphic extends Node {
         });
         return snapshot;
     }
-    buildStateAnimationTargetAttrs(resolvedStateAttrs, previousResolvedStatePatch) {
-        const targetAttrs = cloneAttributeValue(resolvedStateAttrs);
+    buildRemovedStateAnimationAttrs(targetStateAttrs, previousResolvedStatePatch) {
+        const extraAttrs = {};
         if (!previousResolvedStatePatch) {
-            return targetAttrs;
+            return extraAttrs;
         }
         const snapshot = this.buildStaticAttributeSnapshot();
+        const staticTargetAttrs = snapshot;
         Object.keys(previousResolvedStatePatch).forEach(key => {
-            if (Object.prototype.hasOwnProperty.call(targetAttrs, key)) {
+            const hasTargetAttr = Object.prototype.hasOwnProperty.call(targetStateAttrs, key);
+            if (hasTargetAttr && targetStateAttrs[key] !== undefined) {
+                return;
+            }
+            const assignFallbackAttr = (value) => {
+                if (value === undefined && this.shouldSkipStateTransitionDefaultAttribute(key, staticTargetAttrs)) {
+                    return;
+                }
+                extraAttrs[key] = value === undefined ? value : cloneAttributeValue(value);
+            };
+            if (hasTargetAttr) {
+                assignFallbackAttr(this.getStateTransitionDefaultAttribute(key, staticTargetAttrs));
+                return;
+            }
+            if (Object.prototype.hasOwnProperty.call(snapshot, key)) {
+                const snapshotValue = snapshot[key];
+                assignFallbackAttr(snapshotValue === undefined ? this.getStateTransitionDefaultAttribute(key, staticTargetAttrs) : snapshotValue);
                 return;
             }
-            targetAttrs[key] = Object.prototype.hasOwnProperty.call(snapshot, key)
-                ? cloneAttributeValue(snapshot[key])
-                : this.getDefaultAttribute(key);
+            assignFallbackAttr(this.getStateTransitionDefaultAttribute(key, staticTargetAttrs));
         });
-        return targetAttrs;
+        return extraAttrs;
     }
     syncObjectToSnapshot(target, snapshot) {
         const delta = new Map();
@@ -11583,22 +11621,36 @@ class Graphic extends Node {
         var _a, _b, _c;
         return (_c = (_a = animateConfig !== null && animateConfig !== void 0 ? animateConfig : this.stateAnimateConfig) !== null && _a !== void 0 ? _a : (_b = this.context) === null || _b === void 0 ? void 0 : _b.stateAnimateConfig) !== null && _c !== void 0 ? _c : DefaultStateAnimateConfig;
     }
-    applyStateAttrs(attrs, stateNames, hasAnimation, isClear, animateConfig) {
+    applyStateAttrs(attrs, stateNames, hasAnimation, isClear, animateConfig, extraAnimateAttrs) {
         const resolvedAnimateConfig = hasAnimation ? this.resolveStateAnimateConfig(animateConfig) : undefined;
-        const transitionOptions = resolvedAnimateConfig ? { animateConfig: resolvedAnimateConfig } : undefined;
+        const transitionOptions = resolvedAnimateConfig
+            ? {
+                animateConfig: resolvedAnimateConfig,
+                extraAnimateAttrs: extraAnimateAttrs,
+                shouldSkipDefaultAttribute: this.shouldSkipStateTransitionDefaultAttribute.bind(this)
+            }
+            : undefined;
         if (isClear) {
             this.getStateTransitionOrchestrator().applyClearTransition(this, attrs, hasAnimation, stateNames, transitionOptions);
             return;
         }
         const plan = this.getStateTransitionOrchestrator().analyzeTransition({}, attrs, stateNames, hasAnimation, {
             noWorkAnimateAttr: this.getNoWorkAnimateAttr(),
-            animateConfig: resolvedAnimateConfig
+            animateConfig: resolvedAnimateConfig,
+            extraAnimateAttrs: extraAnimateAttrs,
+            shouldSkipDefaultAttribute: this.shouldSkipStateTransitionDefaultAttribute.bind(this)
         });
         this.getStateTransitionOrchestrator().applyTransition(this, plan, hasAnimation, transitionOptions);
     }
     updateNormalAttrs(stateAttrs) {
         this._deprecatedNormalAttrsView = cloneAttributeValue(this.baseAttributes);
     }
+    getStateTransitionDefaultAttribute(key, targetAttrs) {
+        return this.getDefaultAttribute(key);
+    }
+    shouldSkipStateTransitionDefaultAttribute(_key, _targetAttrs) {
+        return false;
+    }
     stopStateAnimates(type = 'end') {
         const stopAnimationState = this.stopAnimationState;
         if (typeof stopAnimationState === 'function') {
@@ -11624,6 +11676,9 @@ class Graphic extends Node {
     clearStates(hasAnimation) {
         var _a, _b, _c;
         const previousStates = this.currentStates ? this.currentStates.slice() : [];
+        const previousResolvedStatePatch = this.resolvedStatePatch
+            ? cloneAttributeValue(this.resolvedStatePatch)
+            : undefined;
         const transition = this.createStateModel().clearStates();
         if (!transition.changed && previousStates.length === 0) {
             this.currentStates = [];
@@ -11650,7 +11705,7 @@ class Graphic extends Node {
         });
         if (hasAnimation) {
             this._syncFinalAttributeFromStaticTruth();
-            this.applyStateAttrs(resolvedStateAttrs, transition.states, hasAnimation, true);
+            this.applyStateAttrs(resolvedStateAttrs, transition.states, hasAnimation, true, undefined, this.buildRemovedStateAnimationAttrs(resolvedStateAttrs, previousResolvedStatePatch));
         }
         else {
             this.stopStateAnimates();
@@ -11712,7 +11767,7 @@ class Graphic extends Node {
         });
         if (hasAnimation) {
             this._syncFinalAttributeFromStaticTruth();
-            this.applyStateAttrs(this.buildStateAnimationTargetAttrs(resolvedStateAttrs, previousResolvedStatePatch), transition.states, hasAnimation);
+            this.applyStateAttrs(resolvedStateAttrs, transition.states, hasAnimation, false, undefined, this.buildRemovedStateAnimationAttrs(resolvedStateAttrs, previousResolvedStatePatch));
         }
         else {
             this.stopStateAnimates();
@@ -13621,6 +13676,61 @@ class Rect extends Graphic {
     needUpdateTag(key) {
         return super.needUpdateTag(key, RECT_UPDATE_TAG_KEY);
     }
+    shouldSkipStateTransitionDefaultAttribute(key, targetAttrs) {
+        var _a;
+        const attrs = ((_a = targetAttrs !== null && targetAttrs !== void 0 ? targetAttrs : this.baseAttributes) !== null && _a !== void 0 ? _a : this.attribute);
+        const hasValue = (attrKey) => attrs[attrKey] != null;
+        const isNilValue = (attrKey) => attrs[attrKey] == null;
+        switch (key) {
+            case 'width':
+                return isNilValue('width') && hasValue('x') && hasValue('x1');
+            case 'height':
+                return isNilValue('height') && hasValue('y') && hasValue('y1');
+            case 'x1':
+                return isNilValue('x1') && hasValue('x') && hasValue('width');
+            case 'y1':
+                return isNilValue('y1') && hasValue('y') && hasValue('height');
+            default:
+                return false;
+        }
+    }
+    getStateTransitionDefaultAttribute(key, targetAttrs) {
+        var _a;
+        const attrs = ((_a = targetAttrs !== null && targetAttrs !== void 0 ? targetAttrs : this.baseAttributes) !== null && _a !== void 0 ? _a : this.attribute);
+        const getNumber = (attrKey) => {
+            const value = attrs[attrKey];
+            return typeof value === 'number' && Number.isFinite(value) ? value : undefined;
+        };
+        const x = getNumber('x');
+        const y = getNumber('y');
+        const x1 = getNumber('x1');
+        const y1 = getNumber('y1');
+        const width = getNumber('width');
+        const height = getNumber('height');
+        switch (key) {
+            case 'width':
+                if (width == null && x != null && x1 != null) {
+                    return x1 - x;
+                }
+                break;
+            case 'height':
+                if (height == null && y != null && y1 != null) {
+                    return y1 - y;
+                }
+                break;
+            case 'x1':
+                if (x1 == null && x != null && width != null) {
+                    return x + width;
+                }
+                break;
+            case 'y1':
+                if (y1 == null && y != null && height != null) {
+                    return y + height;
+                }
+                break;
+        }
+        return super.getStateTransitionDefaultAttribute(key, targetAttrs);
+    }
     toCustomPath() {
         let path = super.toCustomPath();
         if (path) {

package/es/graphic/graphic.d.ts

@@ -149,7 +149,7 @@ export declare abstract class Graphic<T extends Partial<IGraphicAttribute> = Par
     };
     protected recomputeCurrentStatePatch(): void;
     protected buildStaticAttributeSnapshot(): Partial<T>;
-    protected buildStateAnimationTargetAttrs(resolvedStateAttrs: Partial<T>, previousResolvedStatePatch?: Partial<T>): Partial<T>;
+    protected buildRemovedStateAnimationAttrs(targetStateAttrs: Partial<T>, previousResolvedStatePatch?: Partial<T>): Partial<T>;
     protected syncObjectToSnapshot(target: Record<string, any>, snapshot: Record<string, any>): AttributeDelta;
     protected _syncAttribute(): AttributeDelta;
     protected _syncFinalAttributeFromStaticTruth(): void;
@@ -211,8 +211,10 @@ export declare abstract class Graphic<T extends Partial<IGraphicAttribute> = Par
     getState(stateName: string): Partial<T> | StateDefinition<T> | undefined;
     protected createStateModel(): StateModel<T>;
     protected resolveStateAnimateConfig(animateConfig?: IAnimateConfig): any;
-    applyStateAttrs(attrs: Partial<T>, stateNames: string[], hasAnimation?: boolean, isClear?: boolean, animateConfig?: IAnimateConfig): void;
+    applyStateAttrs(attrs: Partial<T>, stateNames: string[], hasAnimation?: boolean, isClear?: boolean, animateConfig?: IAnimateConfig, extraAnimateAttrs?: Partial<T>): void;
     updateNormalAttrs(stateAttrs: Partial<T>): void;
+    protected getStateTransitionDefaultAttribute(key: string, targetAttrs?: Partial<T>): any;
+    protected shouldSkipStateTransitionDefaultAttribute(_key: string, _targetAttrs?: Partial<T>): boolean;
     protected stopStateAnimates(type?: 'start' | 'end'): void;
     private getNormalAttribute;
     clearStates(hasAnimation?: boolean): void;

package/es/graphic/graphic.js

@@ -297,13 +297,21 @@ export class Graphic extends Node {
             "deep" === this.stateMergeMode && isPlainObjectValue(previousValue) && isPlainObjectValue(nextValue) ? snapshot[key] = deepMergeAttributeValue(previousValue, nextValue) : snapshot[key] = cloneAttributeValue(nextValue);
         })), snapshot) : snapshot;
     }
-    buildStateAnimationTargetAttrs(resolvedStateAttrs, previousResolvedStatePatch) {
-        const targetAttrs = cloneAttributeValue(resolvedStateAttrs);
-        if (!previousResolvedStatePatch) return targetAttrs;
-        const snapshot = this.buildStaticAttributeSnapshot();
+    buildRemovedStateAnimationAttrs(targetStateAttrs, previousResolvedStatePatch) {
+        const extraAttrs = {};
+        if (!previousResolvedStatePatch) return extraAttrs;
+        const snapshot = this.buildStaticAttributeSnapshot(), staticTargetAttrs = snapshot;
         return Object.keys(previousResolvedStatePatch).forEach((key => {
-            Object.prototype.hasOwnProperty.call(targetAttrs, key) || (targetAttrs[key] = Object.prototype.hasOwnProperty.call(snapshot, key) ? cloneAttributeValue(snapshot[key]) : this.getDefaultAttribute(key));
-        })), targetAttrs;
+            const hasTargetAttr = Object.prototype.hasOwnProperty.call(targetStateAttrs, key);
+            if (hasTargetAttr && void 0 !== targetStateAttrs[key]) return;
+            const assignFallbackAttr = value => {
+                void 0 === value && this.shouldSkipStateTransitionDefaultAttribute(key, staticTargetAttrs) || (extraAttrs[key] = void 0 === value ? value : cloneAttributeValue(value));
+            };
+            if (hasTargetAttr) assignFallbackAttr(this.getStateTransitionDefaultAttribute(key, staticTargetAttrs)); else if (Object.prototype.hasOwnProperty.call(snapshot, key)) {
+                const snapshotValue = snapshot[key];
+                assignFallbackAttr(void 0 === snapshotValue ? this.getStateTransitionDefaultAttribute(key, staticTargetAttrs) : snapshotValue);
+            } else assignFallbackAttr(this.getStateTransitionDefaultAttribute(key, staticTargetAttrs));
+        })), extraAttrs;
     }
     syncObjectToSnapshot(target, snapshot) {
         const delta = new Map;
@@ -724,20 +732,30 @@ export class Graphic extends Node {
         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 : DefaultStateAnimateConfig;
     }
-    applyStateAttrs(attrs, stateNames, hasAnimation, isClear, animateConfig) {
+    applyStateAttrs(attrs, stateNames, hasAnimation, isClear, animateConfig, extraAnimateAttrs) {
         const resolvedAnimateConfig = hasAnimation ? this.resolveStateAnimateConfig(animateConfig) : void 0, transitionOptions = resolvedAnimateConfig ? {
-            animateConfig: resolvedAnimateConfig
+            animateConfig: resolvedAnimateConfig,
+            extraAnimateAttrs: extraAnimateAttrs,
+            shouldSkipDefaultAttribute: this.shouldSkipStateTransitionDefaultAttribute.bind(this)
         } : void 0;
         if (isClear) return void this.getStateTransitionOrchestrator().applyClearTransition(this, attrs, hasAnimation, stateNames, transitionOptions);
         const plan = this.getStateTransitionOrchestrator().analyzeTransition({}, attrs, stateNames, hasAnimation, {
             noWorkAnimateAttr: this.getNoWorkAnimateAttr(),
-            animateConfig: resolvedAnimateConfig
+            animateConfig: resolvedAnimateConfig,
+            extraAnimateAttrs: extraAnimateAttrs,
+            shouldSkipDefaultAttribute: this.shouldSkipStateTransitionDefaultAttribute.bind(this)
         });
         this.getStateTransitionOrchestrator().applyTransition(this, plan, hasAnimation, transitionOptions);
     }
     updateNormalAttrs(stateAttrs) {
         this._deprecatedNormalAttrsView = cloneAttributeValue(this.baseAttributes);
     }
+    getStateTransitionDefaultAttribute(key, targetAttrs) {
+        return this.getDefaultAttribute(key);
+    }
+    shouldSkipStateTransitionDefaultAttribute(_key, _targetAttrs) {
+        return !1;
+    }
     stopStateAnimates(type = "end") {
         const stopAnimationState = this.stopAnimationState;
         if ("function" == typeof stopAnimationState) return void stopAnimationState.call(this, "state", type);
@@ -753,7 +771,7 @@ export class Graphic extends Node {
     }
     clearStates(hasAnimation) {
         var _a, _b, _c;
-        const previousStates = this.currentStates ? this.currentStates.slice() : [], transition = this.createStateModel().clearStates();
+        const previousStates = this.currentStates ? this.currentStates.slice() : [], previousResolvedStatePatch = this.resolvedStatePatch ? cloneAttributeValue(this.resolvedStatePatch) : void 0, transition = this.createStateModel().clearStates();
         if (!transition.changed && 0 === previousStates.length) return this.currentStates = [], 
         this.effectiveStates = [], this.resolvedStatePatch = void 0, this.sharedStateDirty = !1, 
         void this.clearSharedStateActiveRegistrations();
@@ -764,7 +782,7 @@ export class Graphic extends Node {
         null === (_c = getStageStatePerfMonitor(this.stage)) || void 0 === _c || _c.recordEvent("state-commit", {
             graphicId: this._uid,
             targetStates: []
-        }), hasAnimation ? (this._syncFinalAttributeFromStaticTruth(), this.applyStateAttrs(resolvedStateAttrs, transition.states, hasAnimation, !0)) : (this.stopStateAnimates(), 
+        }), hasAnimation ? (this._syncFinalAttributeFromStaticTruth(), this.applyStateAttrs(resolvedStateAttrs, transition.states, hasAnimation, !0, void 0, this.buildRemovedStateAnimationAttrs(resolvedStateAttrs, previousResolvedStatePatch))) : (this.stopStateAnimates(), 
         this._restoreAttributeFromStaticTruth({
             type: AttributeUpdateType.STATE
         }), this._emitCustomEvent("afterStateUpdate", {
@@ -797,7 +815,7 @@ export class Graphic extends Node {
         null === (_e = getStageStatePerfMonitor(this.stage)) || void 0 === _e || _e.recordEvent("state-commit", {
             graphicId: this._uid,
             targetStates: [ ...transition.states ]
-        }), hasAnimation ? (this._syncFinalAttributeFromStaticTruth(), this.applyStateAttrs(this.buildStateAnimationTargetAttrs(resolvedStateAttrs, previousResolvedStatePatch), transition.states, hasAnimation)) : (this.stopStateAnimates(), 
+        }), hasAnimation ? (this._syncFinalAttributeFromStaticTruth(), this.applyStateAttrs(resolvedStateAttrs, transition.states, hasAnimation, !1, void 0, this.buildRemovedStateAnimationAttrs(resolvedStateAttrs, previousResolvedStatePatch))) : (this.stopStateAnimates(), 
         this._restoreAttributeFromStaticTruth({
             type: AttributeUpdateType.STATE
         }), this._emitCustomEvent("afterStateUpdate", {