[UPDATE] additional work

Author: Judimax

projects/wml-angular-components-base/src/lib/models.ts

@@ -5,8 +5,15 @@ import { WMLMotionUIProperty,WMLMotionUIPropertyState } from "@windmillcode/wml-
 
 
 export class WMLAngularMotionUIProperty<V=any,T=any> extends WMLMotionUIProperty<V,T>{
-  override motionEndEvent =  new Subject<WMLMotionUIPropertyState>();
-  override motionKeyFrameEvent = new Subject<string>()
+
+  constructor(props:Partial<WMLAngularMotionUIProperty> = {}) {
+    super({
+      motionEndEvent: new Subject<WMLMotionUIPropertyState>(),
+      motionKeyFrameEvent: new Subject<string>(),
+      ...props
+    });
+  }
+
 }
 
 

projects/wml-components-base/src/lib/models.ts

@@ -44,8 +44,6 @@ export class WMLUIProperty<V=any,T=any>{
         ...props
       }
     )
-
-
   }
 
 
@@ -131,15 +129,11 @@ export class WMLView<V=any,T=any> extends WMLUIProperty<V,T>{
     )
   }
 
-  /**
-   * @deprecated use angular.cdref instead
-  */
+
   get cdref(){
     return this.angular.cdref
   }
-  /**
-   * @deprecated use angular.cdref instead
-  */
+
   set cdref(val){
     this.angular.cdref = val
   }
@@ -222,6 +216,12 @@ export class WMLMotionUIProperty<V=any,T="animation" | "transition"> extends WML
   }
 
   autoOpen = false
+  eventType : "subject" | "callback" =(()=>{
+    if(["Angular"].includes(getGlobalObject().WINDMILLCODE.framework.name )){
+      return "subject"
+    }
+    return "callback"
+  })()
  /**
  * Necessary for animations to work properly.
  * Modify only if you know what you are doing.
@@ -255,7 +255,7 @@ export class WMLMotionUIProperty<V=any,T="animation" | "transition"> extends WML
   }
   triggerMotionEndEvent=(motionState?:WMLMotionUIPropertyState)=>{
     motionState ??= this.motionState
-    if(["Angular"].includes(getGlobalObject().WINDMILLCODE.framework.name )){
+    if(this.eventType === "subject"){
       // @ts-ignore
       this.motionEndEvent.next?.(motionState)
     }
@@ -267,7 +267,7 @@ export class WMLMotionUIProperty<V=any,T="animation" | "transition"> extends WML
   }
   triggerMotionKeyFrameEvent=(keyFrame?:string)=>{
     keyFrame ??= this.currentTransitionInfo.keyframe
-    if(["Angular"].includes(getGlobalObject().WINDMILLCODE.framework.name )){
+    if(this.eventType === "subject"){
       // @ts-ignore
       this.motionKeyFrameEvent.next?.(keyFrame)
     }
@@ -293,12 +293,11 @@ export class WMLMotionUIProperty<V=any,T="animation" | "transition"> extends WML
     })
 
     this.triggerMotionEndEvent()
-    if(["Angular"].includes(getGlobalObject().WINDMILLCODE.framework.name )){
+    if(this.eventType === "subject"){
       this.angular.cdref?.detectChanges()
     }
 
   }
-
   readonly transitionEnd:(evt?:TransitionEvent)=> void =(evt)=>{
     let state = this.getGroupMotionState()
     this.currentTransitionInfo.transitionEndStyles.push(evt?.propertyName.replace(/-./g, (match) => match.charAt(1).toUpperCase()))
@@ -634,6 +633,8 @@ export class WMLMotionUIProperty<V=any,T="animation" | "transition"> extends WML
 }
 
 
+
+
 export class WMLWrapper<V=any,T=any> {
   constructor(props:Partial<WMLWrapper> = {}){
     Object.assign(