Refactor animate runner to ESM

Author: tolyo

@types/animations/animate-css-driver.d.ts

@@ -8,7 +8,6 @@ export class AnimateCssDriverProvider {
     | string
     | ((
         $animateCss: any,
-        $$AnimateRunner: typeof import("./runner/animate-runner.js").AnimateRunner,
         $rootElement: Element,
       ) => (animationDetails: any) => any)
   )[];

@types/animations/animate-css.d.ts

@@ -3,7 +3,6 @@ export class AnimateCssProvider {
   $get: (
     | string
     | ((
-        $$AnimateRunner: typeof import("./runner/animate-runner.js").AnimateRunner,
         $$animateCache: any,
         $$rAFScheduler: any,
       ) => (

@types/animations/animate-js-driver.d.ts

@@ -1,13 +1,7 @@
 export function AnimateJsDriverProvider($$animationProvider: any): void;
 export class AnimateJsDriverProvider {
   constructor($$animationProvider: any);
-  $get: (
-    | string
-    | ((
-        $$animateJs: any,
-        $$AnimateRunner: typeof import("./runner/animate-runner.js").AnimateRunner,
-      ) => (animationDetails: any) => any)
-  )[];
+  $get: (string | (($$animateJs: any) => (animationDetails: any) => any))[];
 }
 export namespace AnimateJsDriverProvider {
   let $inject: string[];

@types/animations/animate-js.d.ts

@@ -3,10 +3,7 @@ export class AnimateJsProvider {
   constructor($animateProvider: any);
   $get: (
     | string
-    | ((
-        $injector: ng.InjectorService,
-        $$AnimateRunner: typeof import("./runner/animate-runner.js").AnimateRunner,
-      ) => (
+    | (($injector: ng.InjectorService) => (
         element: any,
         event: any,
         classes: any,

@types/animations/animate-queue.d.ts

@@ -12,7 +12,6 @@ export class AnimateQueueProvider {
         $rootScope: import("../core/scope/scope.js").Scope,
         $injector: import("../core/di/internal-injector.js").InjectorService,
         $$animation: any,
-        $$AnimateRunner: typeof import("./runner/animate-runner.js").AnimateRunner,
         $templateRequest: any,
       ) => {
         on(event: any, container: any, callback: any): void;

@types/animations/animation.d.ts

@@ -6,13 +6,9 @@ export class AnimationProvider {
     | ((
         $rootScope: ng.RootScopeService,
         $injector: any,
-        $$AnimateRunner: typeof import("./runner/animate-runner.js").AnimateRunner,
         $$rAFScheduler: any,
         $$animateCache: any,
-      ) => (
-        element: any,
-        event: any,
-        options: any,
-      ) => import("./runner/animate-runner.js").AnimateRunner)
+      ) => (element: any, event: any, options: any) => AnimateRunner)
   )[];
 }
+import { AnimateRunner } from "./runner/animate-runner.js";

@types/animations/runner/animate-runner.d.ts

@@ -5,14 +5,6 @@
  * @param {VoidFunction} fn - The callback to execute.
  */
 export function schedule(fn: VoidFunction): void;
-/**
- * Provider for the `$$AnimateRunner` service.
- * Used to inject the runner into the animation subsystem.
- */
-export class AnimateRunnerFactoryProvider {
-  /** @type {() => typeof AnimateRunner} */
-  $get: () => typeof AnimateRunner;
-}
 /**
  * Represents an asynchronous animation operation.
  * Provides both callback-based and promise-based completion APIs.
@@ -41,8 +33,8 @@ export class AnimateRunner {
   host: import("../interface.ts").AnimationHost;
   /** @type {Array<(ok: boolean) => void>} */
   _doneCallbacks: Array<(ok: boolean) => void>;
-  /** @type {0|1|2} */
-  _state: 0 | 1 | 2;
+  /** @type {RunnerState} */
+  _state: RunnerState;
   /** @type {Promise<void>|null} */
   _promise: Promise<void> | null;
   /** @type {(fn: VoidFunction) => void} */
@@ -95,3 +87,13 @@ export class AnimateRunner {
    */
   private _finish;
 }
+/**
+ * Internal runner states.
+ */
+type RunnerState = number;
+declare namespace RunnerState {
+  let INITIAL: number;
+  let PENDING: number;
+  let DONE: number;
+}
+export {};

src/animations/animate-css-driver.js

@@ -1,4 +1,5 @@
 import { isString } from "../shared/utils.js";
+import { AnimateRunner } from "./runner/animate-runner.js";
 import { concatWithSpace } from "./shared.js";
 
 const NG_ANIMATE_SHIM_CLASS_NAME = "ng-animate-shim";
@@ -20,16 +21,14 @@ export function AnimateCssDriverProvider($$animationProvider) {
    */
   this.$get = [
     "$animateCss",
-    "$$AnimateRunner",
     "$rootElement",
     /**
      *
      * @param {*} $animateCss
-     * @param {typeof import('./runner/animate-runner.js').AnimateRunner} $$AnimateRunner
      * @param {Element} $rootElement
      * @returns
      */
-    function ($animateCss, $$AnimateRunner, $rootElement) {
+    function ($animateCss, $rootElement) {
       const bodyNode = document.body;
       const rootNode = $rootElement;
 
@@ -102,7 +101,7 @@ export function AnimateCssDriverProvider($$animationProvider) {
               runner.complete();
             });
 
-            runner = new $$AnimateRunner({
+            runner = new AnimateRunner({
               end: endFn,
               cancel: endFn,
             });
@@ -213,12 +212,12 @@ export function AnimateCssDriverProvider($$animationProvider) {
               animationRunners.push(animation.start());
             });
 
-            const runner = new $$AnimateRunner({
+            const runner = new AnimateRunner({
               end: endFn,
               cancel: endFn, // CSS-driven animations cannot be cancelled, only ended
             });
 
-            $$AnimateRunner.all(animationRunners, (status) => {
+            AnimateRunner.all(animationRunners, (status) => {
               runner.complete(status);
             });
 

src/animations/animate-css.js

@@ -4,6 +4,7 @@ import {
   setCacheData,
 } from "../shared/dom.js";
 import { isDefined } from "../shared/utils.js";
+import { AnimateRunner } from "./runner/animate-runner.js";
 import {
   ACTIVE_CLASS_SUFFIX,
   ADD_CLASS_SUFFIX,
@@ -143,18 +144,16 @@ function registerRestorableStyles(backup, node, properties) {
 export function AnimateCssProvider() {
   let activeClasses;
   this.$get = [
-    "$$AnimateRunner",
     "$$animateCache",
     "$$rAFScheduler",
 
     /**
      *
-     * @param {typeof import("./runner/animate-runner.js").AnimateRunner} $$AnimateRunner
      * @param {*} $$animateCache
      * @param {import("./raf-scheduler").RafScheduler} $$rAFScheduler
      * @returns
      */
-    function ($$AnimateRunner, $$animateCache, $$rAFScheduler) {
+    function ($$animateCache, $$rAFScheduler) {
       const applyAnimationClasses = applyAnimationClassesFactory();
 
       function computeCachedCssStyles(
@@ -552,7 +551,7 @@ export function AnimateCssProvider() {
               pause: null,
             };
 
-            runner = new $$AnimateRunner(runnerHost);
+            runner = new AnimateRunner(runnerHost);
 
             waitUntilQuiet(start);
 
@@ -651,7 +650,7 @@ export function AnimateCssProvider() {
         }
 
         function closeAndReturnNoopAnimator() {
-          runner = new $$AnimateRunner({
+          runner = new AnimateRunner({
             end: endFn,
             cancel: cancelFn,
           });

src/animations/animate-js-driver.js

@@ -1,16 +1,15 @@
+import { AnimateRunner } from "./runner/animate-runner.js";
+
 AnimateJsDriverProvider.$inject = ["$$animationProvider"];
 export function AnimateJsDriverProvider($$animationProvider) {
   $$animationProvider.drivers.push("$$animateJsDriver");
   this.$get = [
     "$$animateJs",
-    "$$AnimateRunner",
     /**
      *
      * @param {*} $$animateJs
-     * @param {typeof import("./runner/animate-runner.js").AnimateRunner} $$AnimateRunner
-     * @returns
      */
-    function ($$animateJs, $$AnimateRunner) {
+    function ($$animateJs) {
       return function initDriverFn(animationDetails) {
         if (animationDetails.from && animationDetails.to) {
           const fromAnimation = prepareAnimation(animationDetails.from);
@@ -29,9 +28,9 @@ export function AnimateJsDriverProvider($$animationProvider) {
                 animationRunners.push(toAnimation.start());
               }
 
-              $$AnimateRunner.all(animationRunners, done);
+              AnimateRunner.all(animationRunners, done);
 
-              const runner = new $$AnimateRunner({
+              const runner = new AnimateRunner({
                 end: endFnFactory(),
                 cancel: endFnFactory(),
               });