@angular-wave/angular.ts 0.9.8 → 0.10.0

package/dist/angular-ts.umd.js

@@ -1,4 +1,4 @@
-/* Version: 0.9.8 - October 26, 2025 19:05:34 */
+/* Version: 0.10.0 - November 8, 2025 10:37:13 */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
   typeof define === 'function' && define.amd ? define(['exports'], factory) :
@@ -912,7 +912,7 @@
     return arg;
   }
 
-  /** @type {import("./interface.js").ErrorHandlingConfig} */
+  /** @type {import("./interface.ts").ErrorHandlingConfig} */
   const minErrConfig = {
     objectMaxDepth: 5,
     urlErrorParamsEnabled: true,
@@ -1204,6 +1204,382 @@
    */
   const Cache = new Map();
 
+  /**
+   * @readonly
+   * @enum {number}
+   */
+  const ASTType = {
+    Program: 1,
+    ExpressionStatement: 2,
+    AssignmentExpression: 3,
+    ConditionalExpression: 4,
+    LogicalExpression: 5,
+    BinaryExpression: 6,
+    UnaryExpression: 7,
+    CallExpression: 8,
+    MemberExpression: 9,
+    Identifier: 10,
+    Literal: 11,
+    ArrayExpression: 12,
+    Property: 13,
+    ObjectExpression: 14,
+    ThisExpression: 15,
+    LocalsExpression: 16,
+    NGValueParameter: 17,
+  };
+
+  const ADD_CLASS_SUFFIX = "-add";
+  const REMOVE_CLASS_SUFFIX = "-remove";
+  const EVENT_CLASS_PREFIX = "ng-";
+  const ACTIVE_CLASS_SUFFIX = "-active";
+  const PREPARE_CLASS_SUFFIX = "-prepare";
+
+  const NG_ANIMATE_CLASSNAME = "ng-animate";
+  const NG_ANIMATE_CHILDREN_DATA = "$$ngAnimateChildren";
+  let TRANSITION_PROP;
+  let TRANSITIONEND_EVENT;
+  let ANIMATION_PROP;
+  let ANIMATIONEND_EVENT;
+
+  // If unprefixed events are not supported but webkit-prefixed are, use the latter.
+  // Otherwise, just use W3C names, browsers not supporting them at all will just ignore them.
+  // Note: Chrome implements `window.onwebkitanimationend` and doesn't implement `window.onanimationend`
+  // but at the same time dispatches the `animationend` event and not `webkitAnimationEnd`.
+  // Register both events in case `window.onanimationend` is not supported because of that,
+  // do the same for `transitionend` as Safari is likely to exhibit similar behavior.
+  // Also, the only modern browser that uses vendor prefixes for transitions/keyframes is webkit
+  // therefore there is no reason to test anymore for other vendor prefixes:
+  // http://caniuse.com/#search=transition
+  if (
+    window.ontransitionend === undefined &&
+    window.onwebkittransitionend !== undefined
+  ) {
+    TRANSITION_PROP = "WebkitTransition";
+    TRANSITIONEND_EVENT = "webkitTransitionEnd transitionend";
+  } else {
+    TRANSITION_PROP = "transition";
+    TRANSITIONEND_EVENT = "transitionend";
+  }
+
+  if (
+    window.onanimationend === undefined &&
+    window.onwebkitanimationend !== undefined
+  ) {
+    ANIMATION_PROP = "WebkitAnimation";
+    ANIMATIONEND_EVENT = "webkitAnimationEnd animationend";
+  } else {
+    ANIMATION_PROP = "animation";
+    ANIMATIONEND_EVENT = "animationend";
+  }
+
+  const DURATION_KEY = "Duration";
+  const PROPERTY_KEY = ASTType.Property;
+  const DELAY_KEY = "Delay";
+  const TIMING_KEY = "TimingFunction";
+  const ANIMATION_ITERATION_COUNT_KEY = "IterationCount";
+  const ANIMATION_PLAYSTATE_KEY = "PlayState";
+  const SAFE_FAST_FORWARD_DURATION_VALUE = 9999;
+
+  const ANIMATION_DELAY_PROP = ANIMATION_PROP + DELAY_KEY;
+  const ANIMATION_DURATION_PROP = ANIMATION_PROP + DURATION_KEY;
+  const TRANSITION_DELAY_PROP = TRANSITION_PROP + DELAY_KEY;
+  const TRANSITION_DURATION_PROP = TRANSITION_PROP + DURATION_KEY;
+
+  const ngMinErr$1 = minErr("ng");
+  function assertArg(arg, name, reason) {
+    if (!arg) {
+      throw ngMinErr$1(
+        "areq",
+        "Argument '{0}' is {1}",
+        name || "?",
+        reason,
+      );
+    }
+    return arg;
+  }
+
+  function packageStyles(options) {
+    const styles = {};
+    if (options && (options.to || options.from)) {
+      styles.to = options.to;
+      styles.from = options.from;
+    }
+    return styles;
+  }
+
+  function pendClasses(classes, fix, isPrefix) {
+    let className = "";
+
+    classes = Array.isArray(classes)
+      ? classes
+      : classes && isString(classes) && classes.length
+        ? classes.split(/\s+/)
+        : [];
+    classes.forEach((klass, i) => {
+      if (klass && klass.length > 0) {
+        className += i > 0 ? " " : "";
+        className += isPrefix ? fix + klass : klass + fix;
+      }
+    });
+    return className;
+  }
+
+  function removeFromArray(arr, val) {
+    const index = arr.indexOf(val);
+    if (val >= 0) {
+      arr.splice(index, 1);
+    }
+  }
+
+  /**
+   *
+   * @param {NodeList|Node} element
+   * @returns {Node[]|Node|undefined}
+   */
+  function stripCommentsFromElement(element) {
+    if (element instanceof NodeList) {
+      return Array.from(element).filter((x) => x.nodeType == Node.ELEMENT_NODE);
+    } else if (element.nodeType === Node.ELEMENT_NODE) {
+      return /** @type {Node} */ (element);
+    } else {
+      return undefined;
+    }
+  }
+
+  /**
+   * @param {NodeList|Node} element
+   * @returns {Node}
+   */
+  function extractElementNode(element) {
+    if (!element || !Array.isArray(element)) return /** @type {Node} */ (element);
+    for (let i = 0; i < /** @type {NodeList} */ (element).length; i++) {
+      const elm = element[i];
+      if (elm.nodeType === Node.ELEMENT_NODE) {
+        return elm;
+      }
+    }
+  }
+
+  function applyAnimationClassesFactory() {
+    return function (element, options) {
+      if (options.addClass) {
+        element.classList.add(...options.addClass.trim().split(" "));
+        options.addClass = null;
+      }
+      if (options.removeClass) {
+        element.classList.remove(...options.removeClass.trim().split(" "));
+        options.removeClass = null;
+      }
+    };
+  }
+
+  function prepareAnimationOptions(options) {
+    options = options || {};
+    if (!options.$$prepared) {
+      let domOperation = options.domOperation || (() => {});
+      options.domOperation = function () {
+        options.$$domOperationFired = true;
+        domOperation();
+        domOperation = () => {};
+      };
+      options.$$prepared = true;
+    }
+    return options;
+  }
+
+  function applyAnimationStyles(element, options) {
+    applyAnimationFromStyles(element, options);
+    applyAnimationToStyles(element, options);
+  }
+
+  /**
+   * Applies initial animation styles to a DOM element.
+   *
+   * This function sets the element's inline styles using the properties
+   * defined in `options.from`, then clears the property to prevent reuse.
+   *
+   * @param {HTMLElement} element - The target DOM element to apply styles to.
+   * @param {{ from?: Partial<CSSStyleDeclaration> | null }} options - options containing a `from` object with CSS property–value pairs.
+   */
+  function applyAnimationFromStyles(element, options) {
+    if (options.from) {
+      Object.assign(element.style, options.from);
+      options.from = null;
+    }
+  }
+
+  /**
+   * Applies final animation styles to a DOM element.
+   *
+   * This function sets the element's inline styles using the properties
+   * defined in `options.to`, then clears the property to prevent reuse.
+   *
+   * @param {HTMLElement} element - The target DOM element to apply styles to.
+   * @param {{ to?: Partial<CSSStyleDeclaration> | null }} options - options containing a `from` object with CSS property–value pairs.
+   */
+  function applyAnimationToStyles(element, options) {
+    if (options.to) {
+      Object.assign(element.style, options.to);
+      options.to = null;
+    }
+  }
+
+  function mergeAnimationDetails(element, oldAnimation, newAnimation) {
+    const target = oldAnimation.options || {};
+    const newOptions = newAnimation.options || {};
+
+    const toAdd = `${target.addClass || ""} ${newOptions.addClass || ""}`;
+    const toRemove = `${target.removeClass || ""} ${newOptions.removeClass || ""}`;
+    const classes = resolveElementClasses(
+      element.getAttribute("class"),
+      toAdd,
+      toRemove,
+    );
+
+    if (newOptions.preparationClasses) {
+      target.preparationClasses = concatWithSpace(
+        newOptions.preparationClasses,
+        target.preparationClasses,
+      );
+      delete newOptions.preparationClasses;
+    }
+
+    extend(target, newOptions);
+
+    if (classes.addClass) {
+      target.addClass = classes.addClass;
+    } else {
+      target.addClass = null;
+    }
+
+    if (classes.removeClass) {
+      target.removeClass = classes.removeClass;
+    } else {
+      target.removeClass = null;
+    }
+
+    oldAnimation.addClass = target.addClass;
+    oldAnimation.removeClass = target.removeClass;
+
+    return target;
+  }
+
+  function resolveElementClasses(existing, toAdd, toRemove) {
+    const ADD_CLASS = 1;
+    const REMOVE_CLASS = -1;
+
+    const flags = {};
+    existing = splitClassesToLookup(existing);
+
+    toAdd = splitClassesToLookup(toAdd);
+    Object.keys(toAdd).forEach((key) => {
+      flags[key] = ADD_CLASS;
+    });
+
+    toRemove = splitClassesToLookup(toRemove);
+    Object.keys(toRemove).forEach((key) => {
+      flags[key] = flags[key] === ADD_CLASS ? null : REMOVE_CLASS;
+    });
+
+    const classes = {
+      addClass: "",
+      removeClass: "",
+    };
+
+    Object.entries(flags).forEach(([klass, val]) => {
+      let prop, allow;
+      if (val === ADD_CLASS) {
+        prop = "addClass";
+        allow = !existing[klass] || existing[klass + REMOVE_CLASS_SUFFIX];
+      } else if (val === REMOVE_CLASS) {
+        prop = "removeClass";
+        allow = existing[klass] || existing[klass + ADD_CLASS_SUFFIX];
+      }
+      if (allow) {
+        if (classes[prop].length) {
+          classes[prop] += " ";
+        }
+        classes[prop] += klass;
+      }
+    });
+
+    function splitClassesToLookup(classes) {
+      if (isString(classes)) {
+        classes = classes.trim().split(" ");
+      }
+
+      const obj = {};
+      if (classes) {
+        classes.forEach((klass) => {
+          // sometimes the split leaves empty string values
+          // incase extra spaces were applied to the options
+          if (klass.length) {
+            obj[klass] = true;
+          }
+        });
+      }
+      return obj;
+    }
+
+    return classes;
+  }
+
+  function applyGeneratedPreparationClasses(element, event, options) {
+    let classes = "";
+    if (event) {
+      classes = pendClasses(event, EVENT_CLASS_PREFIX, true);
+    }
+    if (options.addClass) {
+      classes = concatWithSpace(
+        classes,
+        pendClasses(options.addClass, ADD_CLASS_SUFFIX),
+      );
+    }
+    if (options.removeClass) {
+      classes = concatWithSpace(
+        classes,
+        pendClasses(options.removeClass, REMOVE_CLASS_SUFFIX),
+      );
+    }
+    if (classes.length) {
+      options.preparationClasses = classes;
+      element.className += ` ${classes}`;
+    }
+  }
+
+  function clearGeneratedClasses(element, options) {
+    if (options.preparationClasses) {
+      options.preparationClasses
+        .split(" ")
+        .forEach((cls) => element.classList.remove(cls));
+      options.preparationClasses = null;
+    }
+    if (options.activeClasses) {
+      options.activeClasses
+        .split(" ")
+        .forEach((cls) => element.classList.remove(cls));
+      options.activeClasses = null;
+    }
+  }
+
+  function blockKeyframeAnimations(node, applyBlock) {
+    const value = applyBlock ? "paused" : "";
+    const key = ANIMATION_PROP + ANIMATION_PLAYSTATE_KEY;
+    applyInlineStyle(node, [key, value]);
+    return [key, value];
+  }
+
+  function applyInlineStyle(node, styleTuple) {
+    const prop = styleTuple[0];
+    node.style[prop] = styleTuple[1];
+  }
+
+  function concatWithSpace(a, b) {
+    if (!a) return b;
+    if (!b) return a;
+    return `${a} ${b}`;
+  }
+
   /** @type {number} */
   let jqId = 1;
 
@@ -1725,12 +2101,8 @@
     // from the dom sometime before this code runs then let's
     // just stick to using the parent element as the anchor
     if (afterElement) {
-      const afterNode = extractElementNode$1(afterElement);
-      if (
-        afterNode &&
-        !afterNode.parentNode &&
-        !afterNode.previousElementSibling
-      ) {
+      const afterNode = extractElementNode(afterElement);
+      if (afterNode && !afterNode.parentNode && !afterNode.previousSibling) {
         afterElement = null;
       }
     }
@@ -1741,16 +2113,6 @@
     }
   }
 
-  function extractElementNode$1(element) {
-    const { length } = element;
-    for (let i = 0; i < length; i++) {
-      const elm = element[i];
-      if (elm.nodeType === Node.ELEMENT_NODE) {
-        return elm;
-      }
-    }
-  }
-
   /**
    * Returns the base href of the document.
    *
@@ -1869,7 +2231,7 @@
     /**
      * @param {string} name - Name of the module
      * @param {Array<string>} requires - List of modules which the injector will load before the current module
-     * @param {import("../../interface.js").Injectable<any>} [configFn]
+     * @param {import("../../interface.ts").Injectable<any>} [configFn]
      */
     constructor(name, requires, configFn) {
       assert(isString(name), "name required");
@@ -1895,7 +2257,7 @@
       /** @type {!Array<Array<*>>} */
       this.configBlocks = [];
 
-      /** @type {!Array.<import("../../interface.js").Injectable<any>>} */
+      /** @type {!Array.<import("../../interface.ts").Injectable<any>>} */
       this.runBlocks = [];
 
       if (configFn) {
@@ -1999,7 +2361,7 @@
 
     /**
      * @param {string} name
-     * @param {import("../../interface.js").Injectable<any>} decorFn
+     * @param {import("../../interface.ts").Injectable<any>} decorFn
      * @returns {NgModule}
      */
     decorator(name, decorFn) {
@@ -2012,7 +2374,7 @@
 
     /**
      * @param {string} name
-     * @param {import("../../interface.js").Injectable<any>} directiveFactory
+     * @param {import("../../interface.ts").Injectable<any>} directiveFactory
      * @returns {NgModule}
      */
     directive(name, directiveFactory) {
@@ -2029,7 +2391,7 @@
 
     /**
      * @param {string} name
-     * @param {import("../../interface.js").Injectable<any>} animationFactory
+     * @param {import("../../interface.ts").Injectable<any>} animationFactory
      * @returns {NgModule}
      */
     animation(name, animationFactory) {
@@ -2046,7 +2408,7 @@
 
     /**
      * @param {string} name
-     * @param {import("../../interface.js").Injectable<any>} filterFn
+     * @param {import("../../interface.ts").Injectable<any>} filterFn
      * @return {NgModule}
      */
     filter(name, filterFn) {
@@ -2059,7 +2421,7 @@
 
     /**
      * @param {string} name
-     * @param {import("../../interface.js").Injectable<any>} ctlFn
+     * @param {import("../../interface.ts").Injectable<any>} ctlFn
      * @returns {NgModule}
      */
     controller(name, ctlFn) {
@@ -2444,7 +2806,7 @@
      * Registers a factory.
      * @param {string} name
      * @param {(string|(function(*): *))[]} factoryFn
-     * @returns {import('../../interface.js').ServiceProvider}
+     * @returns {import('../../interface.ts').ServiceProvider}
      */
     function factory(name, factoryFn) {
       return provider(name, {
@@ -2466,7 +2828,7 @@
      * Registers a service constructor.
      * @param {string} name
      * @param {Function} constructor
-     * @returns {import('../../interface.js').ServiceProvider}
+     * @returns {import('../../interface.ts').ServiceProvider}
      */
     function service(name, constructor) {
       return factory(name, [
@@ -2935,7 +3297,7 @@
 
       /**
        * @param {import("../../core/di/internal-injector.js").InjectorService} $injector
-       * @returns {import("./interface.js").ControllerService} A service function that creates controllers.
+       * @returns {import("./interface.ts").ControllerService} A service function that creates controllers.
        */
       ($injector) => {
         return (expression, locals, later, ident) => {
@@ -3053,18 +3415,19 @@
         );
       }
       locals.$scope[identifier] = instance;
+      locals.$scope["$controllerIdentifier"] = identifier;
     }
   }
 
   const originUrl = urlResolve(window.location.href);
 
   /**
-   * @param {import("./interface.js").ResolvableUrl} url
-   * @return {import("./interface.js").ParsedUrl}
+   * @param {import("./interface.ts").ResolvableUrl} url
+   * @return {import("./interface.ts").ParsedUrl}
    */
   function urlResolve(url) {
     if (!isString(url))
-      return /** @type {import("./interface.js").ParsedUrl} */ (url);
+      return /** @type {import("./interface.ts").ParsedUrl} */ (url);
 
     const urlParsingNode = new URL(
       /** @type {string} */ (url),
@@ -3096,7 +3459,7 @@
    * Parse a request URL and determine whether this is a same-origin request as the application
    * document.
    *
-   * @param {import("./interface.js").ResolvableUrl} requestUrl The url of the request as a string that will be resolved
+   * @param {import("./interface.ts").ResolvableUrl} requestUrl The url of the request as a string that will be resolved
    * or a parsed URL object.
    * @returns {boolean} Whether the request is for the same origin as the application document.
    */
@@ -3110,7 +3473,7 @@
    * Note: The base URL is usually the same as the document location (`location.href`) but can
    * be overriden by using the `<base>` tag.
    *
-   * @param {import("./interface.js").ResolvableUrl} requestUrl The url of the request as a string that will be resolved
+   * @param {import("./interface.ts").ResolvableUrl} requestUrl The url of the request as a string that will be resolved
    * or a parsed URL object.
    * @returns {boolean} Whether the URL is same-origin as the document base URL.
    */
@@ -3124,7 +3487,7 @@
    *
    * @param {string[]} trustedOriginUrls - A list of URLs (strings), whose origins are trusted.
    *
-   * @returns {(url: import("./interface.js").ResolvableUrl) => boolean } - A function that receives a URL (string or parsed URL object) and returns
+   * @returns {(url: import("./interface.ts").ResolvableUrl) => boolean } - A function that receives a URL (string or parsed URL object) and returns
    *     whether it is of an allowed origin.
    */
   function urlIsAllowedOriginFactory(trustedOriginUrls) {
@@ -3137,7 +3500,7 @@
      * based on a list of trusted-origin URLs. The current location's origin is implicitly
      * trusted.
      *
-     * @param {import("./interface.js").ResolvableUrl} requestUrl - The URL to be checked (provided as a string that will be
+     * @param {import("./interface.ts").ResolvableUrl} requestUrl - The URL to be checked (provided as a string that will be
      *     resolved or a parsed URL object).
      *
      * @returns {boolean} - Whether the specified URL is of an allowed origin.
@@ -3153,9 +3516,9 @@
   /**
    * Determine if two URLs share the same origin.
    *
-   * @param {import("./interface.js").ResolvableUrl} url1 - First URL to compare as a string or a normalized URL in the form of
+   * @param {import("./interface.ts").ResolvableUrl} url1 - First URL to compare as a string or a normalized URL in the form of
    *     a dictionary object returned by `urlResolve()`.
-   * @param {import("./interface.js").ResolvableUrl} url2 - Second URL to compare as a string or a normalized URL in the form
+   * @param {import("./interface.ts").ResolvableUrl} url2 - Second URL to compare as a string or a normalized URL in the form
    *     of a dictionary object returned by `urlResolve()`.
    *
    * @returns {boolean} - True if both URLs have the same origin, and false otherwise.
@@ -3789,7 +4152,7 @@
          *
          * @param {string} type The SCE context in which this result will be used.
          * @param {string} expr String expression to compile.
-         * @return {import("../../core/parse/interface.js").CompiledExpression} A function which represents the compiled expression:
+         * @return {import("../../core/parse/interface.ts").CompiledExpression} A function which represents the compiled expression:
          *
          *    * `context` – `{object}` – an object against which any expressions embedded in the
          *      strings are evaluated against (typically a scope object).
@@ -4026,10 +4389,11 @@
     .forEach((eventName) => {
       const directiveName = directiveNormalize(`ng-${eventName}`);
       ngEventDirectives[directiveName] = [
-        "$parse",
-        "$exceptionHandler",
+        $injectTokens.$parse,
+        $injectTokens.$exceptionHandler,
+
         /**
-         * @param {import("../../core/parse/interface.ts").ParseService} $parse
+         * @param {ng.ParseService} $parse
          * @param {ng.ExceptionHandlerService} $exceptionHandler
          * @returns
          */
@@ -4062,14 +4426,58 @@
       restrict: "A",
       compile(_element, attr) {
         const fn = $parse(attr[directiveName]);
-        return function ngEventHandler(scope, element) {
-          element.addEventListener(eventName, (event) => {
+        return (scope, element) => {
+          const handler = (event) => {
             try {
               fn(scope, { $event: event });
             } catch (error) {
               $exceptionHandler(error);
             }
-          });
+          };
+          element.addEventListener(eventName, handler);
+
+          scope.$on("$destroy", () =>
+            element.removeEventListener(eventName, handler),
+          );
+        };
+      },
+    };
+  }
+
+  /**
+   *
+   * @param {ng.ParseService} $parse
+   * @param {ng.ExceptionHandlerService} $exceptionHandler
+   * @param {ng.WindowService} $window
+   * @param {string} directiveName
+   * @param {string} eventName
+   * @returns {ng.Directive}
+   */
+  function createWindowEventDirective(
+    $parse,
+    $exceptionHandler,
+    $window,
+    directiveName,
+    eventName,
+  ) {
+    return {
+      restrict: "A",
+      compile(_element, attr) {
+        const fn = $parse(attr[directiveName]);
+        return (scope) => {
+          const handler = (event) => {
+            try {
+              fn(scope, { $event: event });
+            } catch (error) {
+              $exceptionHandler(error);
+            }
+          };
+
+          $window.addEventListener(eventName, handler);
+
+          scope.$on("$destroy", () =>
+            $window.removeEventListener(eventName, handler),
+          );
         };
       },
     };
@@ -4079,16 +4487,13 @@
   const SIMPLE_ATTR_NAME = /^\w/;
   const specialAttrHolder = document.createElement("div");
 
-  /**
-   * @implements {Record<string, any>}
-   */
   class Attributes {
     static $nonscope = true;
 
     /**
-     * @param {import('../scope/scope.js').Scope} $rootScope
+     * @param {ng.Scope} $rootScope
      * @param {*} $animate
-     * @param {import("../../services/exception/exception-handler.js").ErrorHandler} $exceptionHandler
+     * @param {ng.ExceptionHandlerService} $exceptionHandler
      * @param {*} $sce
      * @param {import("../../shared/noderef.js").NodeRef} [nodeRef]
      * @param {Object} [attributesToCopy]
@@ -4401,19 +4806,18 @@
   /**
    * @param {string} source - the name of the attribute to be observed
    * @param {string} prop - the scope property to be updated with attribute value
-   * @returns {import("../../interface.ts").Directive}
+   * @returns {ng.Directive}
    */
   function ngObserveDirective(source, prop) {
     return {
       restrict: "A",
       compile: () => (scope, element) => {
-        const targetElement = element;
         if (prop === "") {
           prop = source;
         }
         const normalized = kebabToCamel(prop);
         if (!scope[normalized]) {
-          scope[normalized] = targetElement.getAttribute(source);
+          scope[normalized] = element.getAttribute(source);
         }
 
         const observer = new MutationObserver((mutations) => {
@@ -4426,7 +4830,7 @@
           }
         });
 
-        observer.observe(targetElement, {
+        observer.observe(element, {
           attributes: true,
           attributeFilter: [source],
         });
@@ -4438,91 +4842,6 @@
     };
   }
 
-  /**
-   * A function passed as the fifth argument to a {@type PublicLinkFn} link function.
-   * It behaves like a linking function, with the `scope` argument automatically created
-   * as a new child of the transcluded parent scope.
-   *
-   * The function returns the DOM content to be injected (transcluded) into the directive.
-   *
-   * @callback TranscludeFn
-   * @param {Element | Node | ChildNode | NodeList | Node[]} [clone] - The DOM node to be inserted into the transcluded directive.
-   * @param {import("../scope/scope.js").Scope} [scope] - The new child scope created from the transcluded parent.
-   * @returns void
-
-  /**
-   * A specialized version of {@link TranscludeFn} with the scope argument already bound.
-   * This function requires no parameters and returns the same result as {@link TranscludeFn}.
-   *
-   * @typedef {() => Element|Node} BoundTranscludeFn
-   */
-
-  /**
-   * @typedef {Object} SimpleChange
-   * @property {any} currentValue
-   * @property {boolean} firstChange
-   */
-
-  /**
-   * @description A function returned by the '$compile' service that links a compiled template to a scope.
-   *
-   * @callback PublicLinkFn
-   * @param {import('../scope/scope.js').Scope} scope - Scope to link with element
-   * @param {TranscludeFn} [cloneConnectFn]
-   * @param {*} [options]
-   * @return {Element|Node|ChildNode|Node[]} The nodes to be linked.
-   */
-
-  /**
-   * @description Entry point for the '$compile' service.
-   *
-   * @callback CompileFn
-   * @param {string|Element|Node|ChildNode|NodeList} compileNode - The node to be compiled.
-   * @param {TranscludeFn} [transcludeFn] - An optional transclusion function to be used during compilation.
-   * @param {number} [maxPriority] - An optional maximum priority for directives.
-   * @param {string} [ignoreDirective] - An optional directive to ignore during compilation.
-   * @param {*} [previousCompileContext] - An optional context from a previous compilation. TODO
-   * @returns {PublicLinkFn} A public link function.
-   */
-
-  /**
-   * @typedef {Object} LinkFnMapping
-   * @property {number} index
-   * @property {NodeLinkFnCtx} [nodeLinkFnCtx]
-   * @property {CompositeLinkFn} [childLinkFn]
-   */
-
-  /**
-   * @typedef {function(): CompositeLinkFn} CompileNodesFn
-   */
-
-  /**
-   * @callback NodeLinkFn
-   * @returns {Node|Element|NodeList}
-   */
-
-  /**
-   * @typedef {Object} NodeLinkFnCtx
-   * @property {NodeLinkFn} nodeLinkFn
-   * @property {boolean} terminal
-   * @property {TranscludeFn} transclude
-   * @property {boolean} transcludeOnThisElement
-   * @property {boolean} templateOnThisElement
-   * @property {boolean} newScope
-   */
-
-  /**
-   * @typedef {function(): NodeLinkFn} ApplyDirectivesToNodeFn
-   */
-
-  /**
-   * @description Function that aggregates all linking fns for a compilation root (nodeList)
-   * @callback CompositeLinkFn
-   * @param {import('../scope/scope.js').Scope} scope - The scope to be linked to the template
-   * @param {NodeRef} $linkNode - wrapper around a nodeList
-   * @param {Function} [parentBoundTranscludeFn]
-   */
-
   const $compileMinErr = minErr("$compile");
   const EXCLUDED_DIRECTIVES = ["ngIf", "ngRepeat"];
   const ALL_OR_NOTHING_ATTRS = ["ngSrc", "ngSrcset", "src", "srcset"];
@@ -4537,7 +4856,7 @@
     /* @ignore */ static $inject = [$injectTokens.$provide, $injectTokens.$$sanitizeUriProvider];
 
     /**
-     * @param {import('../../interface.js').Provider} $provide
+     * @param {import('../../interface.ts').Provider} $provide
      * @param {import('../sanitize/sanitize-uri.js').SanitizeUriProvider} $$sanitizeUriProvider
      */
     constructor($provide, $$sanitizeUriProvider) {
@@ -4546,7 +4865,6 @@
       const bindingCache = Object.create(null);
 
       /**
-       *
        * @param {import("../scope/scope.js").Scope} scope
        * @param {string} directiveName
        * @param {boolean} isController
@@ -4728,7 +5046,7 @@
       /**
        * @param {string|Object} name Name of the component in camelCase (i.e. `myComp` which will match `<my-comp>`),
        *    or an object map of components where the keys are the names and the values are the component definition objects.
-       * @param {import("../../interface.js").Component} options Component definition object (a simplified
+       * @param {import("../../interface.ts").Component} options Component definition object (a simplified
        *    {directive definition object}),
        *    with the following properties (all optional):
        *
@@ -5059,12 +5377,11 @@
               ? (x) => x
               : (x) => x.replace(/\{\{/g, startSymbol).replace(/}}/g, endSymbol);
 
-          const NG_PREFIX_BINDING = /^ng(Attr|Prop|On|Observe)([A-Z].*)$/;
+          const NG_PREFIX_BINDING = /^ng(Attr|Prop|On|Observe|Window)([A-Z].*)$/;
           return compile;
 
-          //= ===============================
           /**
-           * @type {CompileFn}
+           * @type {ng.CompileService}
            */
           function compile(
             element,
@@ -5078,7 +5395,7 @@
             /**
              * The composite link function is a composite of individual node linking functions.
              * It will be invoke by the public link function below.
-             * @type {CompositeLinkFn}
+             * @type {ng.CompositeLinkFn}
              */
             let compositeLinkFn = compileNodes(
               nodeRef,
@@ -5091,7 +5408,7 @@
             let namespace = null;
             return publicLinkFn;
 
-            /** @type {PublicLinkFn} */
+            /** @type {ng.PublicLinkFn} */
             function publicLinkFn(scope, cloneConnectFn, options) {
               if (!nodeRef) {
                 throw $compileMinErr(
@@ -5213,7 +5530,7 @@
            * @param {number=} [maxPriority] Max directive priority.
            * @param {*} [ignoreDirective]
            * @param {*} [previousCompileContext]
-           * @returns {CompositeLinkFn} A composite linking function of all of the matched directives or null.
+           * @returns {ng.CompositeLinkFn} A composite linking function of all of the matched directives or null.
            */
           function compileNodes(
             nodeRefList,
@@ -5226,7 +5543,7 @@
              * Aggregates for the composite linking function, where a node in a node list is mapped
              * to a corresponding link function. For single elements, the node should be mapped to
              * a single node link function.
-             * @type {LinkFnMapping[]}
+             * @type {ng.LinkFnMapping[]}
              */
             const linkFnsList = []; // An array to hold node indices and their linkFns
             let nodeLinkFnFound;
@@ -5246,7 +5563,7 @@
                 ignoreDirective,
               );
 
-              /** @type {NodeLinkFnCtx} */
+              /** @type {ng.NodeLinkFnCtx} */
               let nodeLinkFnCtx;
 
               if (directives.length) {
@@ -5393,10 +5710,10 @@
 
           /**
            * Prebinds the transclusion function to a scope
-           * @param {import("../scope/scope.js").Scope} scope
+           * @param {ng.Scope} scope
            * @param {*} transcludeFn
            * @param {*} previousBoundTranscludeFn
-           * @returns {BoundTranscludeFn}
+           * @returns {ng.BoundTranscludeFn}
            */
           function createBoundTranscludeFn(
             scope,
@@ -5454,7 +5771,7 @@
            */
           function collectDirectives(node, attrs, maxPriority, ignoreDirective) {
             /**
-             * @type {import('../../interface.ts').Directive[]}
+             * @type {ng.Directive[]}
              */
             const directives = [];
             const { nodeType } = node;
@@ -5480,6 +5797,7 @@
                   let isNgProp = false;
                   let isNgEvent = false;
                   let isNgObserve = false;
+                  let isWindow = false;
 
                   let attr = node.attributes[j];
                   let name = attr.name;
@@ -5493,6 +5811,7 @@
                     isNgProp = ngPrefixMatch[1] === "Prop";
                     isNgEvent = ngPrefixMatch[1] === "On";
                     isNgObserve = ngPrefixMatch[1] === "Observe";
+                    isWindow = ngPrefixMatch[1] === "Window";
 
                     // Normalize the non-prefixed name
                     name = name
@@ -5502,13 +5821,13 @@
                       .replace(/_(.)/g, (match, letter) => letter.toUpperCase());
                   }
 
-                  if (isNgProp || isNgEvent) {
+                  if (isNgProp || isNgEvent || isWindow) {
                     attrs[nName] = value;
                     attrsMap[nName] = attr.name;
 
                     if (isNgProp) {
                       addPropertyDirective(node, directives, nName, name);
-                    } else {
+                    } else if (isNgEvent) {
                       directives.push(
                         createEventDirective(
                           $parse,
@@ -5517,6 +5836,17 @@
                           name,
                         ),
                       );
+                    } else {
+                      // isWindow
+                      directives.push(
+                        createWindowEventDirective(
+                          $parse,
+                          $exceptionHandler,
+                          window,
+                          nName,
+                          name,
+                        ),
+                      );
                     }
                   } else if (isNgObserve) {
                     directives.push(ngObserveDirective(name, value));
@@ -5575,7 +5905,7 @@
            * @param maxPriority
            * @param ignoreDirective
            * @param previousCompileContext
-           * @returns {PublicLinkFn|TranscludeFn}
+           * @returns {ng.PublicLinkFn|ng.TranscludeFn}
            */
           function compilationGenerator(
             eager,
@@ -5622,14 +5952,14 @@
            *        this needs to be pre-sorted by priority order.
            * @param {Node | Element} compileNode  DOM node to apply the compile functions to
            * @param {Attributes} templateAttrs The shared attribute function
-           * @param {TranscludeFn} transcludeFn
+           * @param {ng.TranscludeFn} transcludeFn
            * @param {Object=} originalReplaceDirective An optional directive that will be ignored when
            *                                           compiling the transclusion.
            * @param {Array.<Function>} [preLinkFns]
            * @param {Array.<Function>} [postLinkFns]
            * @param {Object} [previousCompileContext] Context used for previous compilation of the current
            *                                        node
-           * @returns {NodeLinkFnCtx} node link function
+           * @returns {ng.NodeLinkFnCtx} node link function
            */
           function applyDirectivesToNode(
             directives,
@@ -5664,7 +5994,7 @@
             let directiveName;
             let $template;
             let replaceDirective = originalReplaceDirective;
-            /** @type {TranscludeFn} */
+            /** @type {ng.TranscludeFn} */
             let childTranscludeFn = transcludeFn;
 
             let didScanForMultipleTransclusion = false;
@@ -5673,7 +6003,7 @@
 
             /**
              * Links all the directives of a single node.
-             * @type {NodeLinkFn}
+             * @type {ng.NodeLinkFn}
              */
             // @ts-ignore
             let nodeLinkFn = function (
@@ -6355,7 +6685,7 @@
                 ii = directives.length;
               } else if (directive.compile) {
                 try {
-                  /** @type {PublicLinkFn} */
+                  /** @type {ng.PublicLinkFn} */
                   const linkFn = directive.compile(
                     compileNodeRef.getAny(),
                     templateAttrs,
@@ -7371,7 +7701,7 @@
                     }
 
                     /**
-                     * @type {SimpleChange}
+                     * @type {import("./inteface.ts").SimpleChange}
                      */
                     initialChanges[scopeName] = {
                       currentValue: destination[scopeName],
@@ -7497,7 +7827,7 @@
                               scope.$handler.watchers
                                 .get(attrs[attrName])
                                 ?.forEach((watchFn) => {
-                                  watchFn.listenerFn(val);
+                                  watchFn.listenerFn(val, scope.$target);
                                 });
                             }
                           }
@@ -7524,7 +7854,7 @@
                     parentGet = $parse(attrs[attrName]);
 
                     destination.$target[scopeName] = parentGet(scope.$target);
-                    /** @type {SimpleChange} */
+                    /** @type {import("./inteface.ts").SimpleChange} */
                     initialChanges[scopeName] = {
                       currentValue: destination.$target[scopeName],
                       firstChange: firstChange,
@@ -7910,8 +8240,14 @@
      * state (ng-dirty class). This method will also propagate to parent forms.
      */
     $setDirty() {
-      this.$$animate.removeClass(this.$$element, PRISTINE_CLASS);
-      this.$$animate.addClass(this.$$element, DIRTY_CLASS);
+      if (hasAnimate(this.$$element)) {
+        this.$$animate.removeClass(this.$$element, PRISTINE_CLASS);
+        this.$$animate.addClass(this.$$element, DIRTY_CLASS);
+      } else {
+        // Fallback for non-animated environments
+        this.$$element.classList.remove(PRISTINE_CLASS);
+        this.$$element.classList.add(DIRTY_CLASS);
+      }
       this.$dirty = true;
       this.$pristine = false;
       this.$$parentForm.$setDirty();
@@ -7930,11 +8266,18 @@
      * saving or resetting it.
      */
     $setPristine() {
-      this.$$animate.setClass(
-        this.$$element,
-        PRISTINE_CLASS,
-        `${DIRTY_CLASS} ${SUBMITTED_CLASS}`,
-      );
+      if (hasAnimate(this.$$element)) {
+        this.$$animate.setClass(
+          this.$$element,
+          PRISTINE_CLASS,
+          `${DIRTY_CLASS} ${SUBMITTED_CLASS}`,
+        );
+      } else {
+        // Fallback for non-animated environments
+        this.$$element.classList.remove(DIRTY_CLASS, SUBMITTED_CLASS);
+        this.$$element.classList.add(PRISTINE_CLASS);
+      }
+
       this.$dirty = false;
       this.$pristine = true;
       this.$submitted = false;
@@ -7972,7 +8315,11 @@
     }
 
     $$setSubmitted() {
-      this.$$animate.addClass(this.$$element, SUBMITTED_CLASS);
+      if (hasAnimate(this.$$element)) {
+        this.$$animate.addClass(this.$$element, SUBMITTED_CLASS);
+      } else {
+        this.$$element.classList.add(SUBMITTED_CLASS);
+      }
       this.$submitted = true;
       this.$$controls.forEach((control) => {
         if (control.$$setSubmitted) {
@@ -11492,7 +11839,7 @@
   const ngClassEvenDirective = classDirective("Even", 1);
 
   /**
-   * @returns {import('../../interface.ts').Directive}
+   * @returns {ng.Directive}
    */
   function ngCloakDirective() {
     return {
@@ -11582,7 +11929,7 @@
   ngIfDirective.$inject = ["$animate"];
   /**
    * @param {*}  $animate
-   * @returns {import("../../interface.ts").Directive}
+   * @returns {ng.Directive}
    */
   function ngIfDirective($animate) {
     return {
@@ -11592,10 +11939,10 @@
       restrict: "A",
       /**
        *
-       * @param {import("../../core/scope/scope.js").Scope} $scope
+       * @param {ng.Scope} $scope
        * @param {Element} $element
-       * @param {import("../../core/compile/attributes.js").Attributes} $attr
-       * @param {Object} _ctrl
+       * @param {ng.Attributes} $attr
+       * @param {*} _ctrl
        * @param {*} $transclude
        */
       link($scope, $element, $attr, _ctrl, $transclude) {
@@ -11607,7 +11954,7 @@
 
         let previousElements;
 
-        $scope.$watch($attr["ngIf"], (value) => {
+        $scope.$watch($attr.ngIf, (value) => {
           if (value) {
             if (!childScope) {
               $transclude((clone, newScope) => {
@@ -11662,7 +12009,7 @@
    * @param {import("../../services/anchor-scroll/anchor-scroll.js").AnchorScrollFunction} $anchorScroll
    * @param {*} $animate
    * @param {import('../../services/exception/interface.ts').ErrorHandler} $exceptionHandler
-   * @returns {import('../../interface.js').Directive}
+   * @returns {import('../../interface.ts').Directive}
    */
   function ngIncludeDirective(
     $templateRequest,
@@ -11783,7 +12130,7 @@
   ngIncludeFillContentDirective.$inject = [$injectTokens.$compile];
 
   /**
-   * @param {import("../../core/compile/compile.js").CompileFn} $compile
+   * @param {ng.CompileService} $compile
    * @returns {import("../../interface.ts").Directive}
    */
   function ngIncludeFillContentDirective($compile) {
@@ -12414,7 +12761,7 @@
   ngOptionsDirective.$inject = ["$compile", "$parse"];
   /**
    *
-   * @param {import("../../core/compile/compile.js").CompileFn} $compile
+   * @param {ng.CompileService} $compile
    * @param {import("../../core/parse/interface.ts").ParseService} $parse
    * @returns {import("../../interface.ts").Directive}
    */
@@ -12941,8 +13288,8 @@
 
   ngTranscludeDirective.$inject = ["$compile"];
   /**
-   * @param {import("../../core/compile/compile.js").CompileFn} $compile
-   * @returns {import("../../interface.ts").Directive}
+   * @param {ng.CompileService} $compile
+   * @returns {ng.Directive}
    */
   function ngTranscludeDirective($compile) {
     return {
@@ -12953,9 +13300,9 @@
 
         /**
          *
-         * @param {import("../../core/scope/scope.js").Scope} $scope
+         * @param {ng.Scope} $scope
          * @param {Element} $element
-         * @param {import("../../core/compile/attributes.js").Attributes} $attrs
+         * @param {ng.Attributes} $attrs
          * @param {*} _controller
          * @param {*} $transclude
          */
@@ -13044,7 +13391,7 @@
   const REGEX_STRING_REGEXP = /^\/(.+)\/([a-z]*)$/;
 
   /**
-   * @type {Record<string, import("../../interface.js").DirectiveFactory>}
+   * @type {Record<string, import("../../interface.ts").DirectiveFactory>}
    */
   const ngAttributeAliasDirectives = {};
 
@@ -13617,364 +13964,6 @@
     ];
   }
 
-  /**
-   * @readonly
-   * @enum {number}
-   */
-  const ASTType = {
-    Program: 1,
-    ExpressionStatement: 2,
-    AssignmentExpression: 3,
-    ConditionalExpression: 4,
-    LogicalExpression: 5,
-    BinaryExpression: 6,
-    UnaryExpression: 7,
-    CallExpression: 8,
-    MemberExpression: 9,
-    Identifier: 10,
-    Literal: 11,
-    ArrayExpression: 12,
-    Property: 13,
-    ObjectExpression: 14,
-    ThisExpression: 15,
-    LocalsExpression: 16,
-    NGValueParameter: 17,
-  };
-
-  const ADD_CLASS_SUFFIX = "-add";
-  const REMOVE_CLASS_SUFFIX = "-remove";
-  const EVENT_CLASS_PREFIX = "ng-";
-  const ACTIVE_CLASS_SUFFIX = "-active";
-  const PREPARE_CLASS_SUFFIX = "-prepare";
-
-  const NG_ANIMATE_CLASSNAME = "ng-animate";
-  const NG_ANIMATE_CHILDREN_DATA = "$$ngAnimateChildren";
-  let TRANSITION_PROP;
-  let TRANSITIONEND_EVENT;
-  let ANIMATION_PROP;
-  let ANIMATIONEND_EVENT;
-
-  // If unprefixed events are not supported but webkit-prefixed are, use the latter.
-  // Otherwise, just use W3C names, browsers not supporting them at all will just ignore them.
-  // Note: Chrome implements `window.onwebkitanimationend` and doesn't implement `window.onanimationend`
-  // but at the same time dispatches the `animationend` event and not `webkitAnimationEnd`.
-  // Register both events in case `window.onanimationend` is not supported because of that,
-  // do the same for `transitionend` as Safari is likely to exhibit similar behavior.
-  // Also, the only modern browser that uses vendor prefixes for transitions/keyframes is webkit
-  // therefore there is no reason to test anymore for other vendor prefixes:
-  // http://caniuse.com/#search=transition
-  if (
-    window.ontransitionend === undefined &&
-    window.onwebkittransitionend !== undefined
-  ) {
-    TRANSITION_PROP = "WebkitTransition";
-    TRANSITIONEND_EVENT = "webkitTransitionEnd transitionend";
-  } else {
-    TRANSITION_PROP = "transition";
-    TRANSITIONEND_EVENT = "transitionend";
-  }
-
-  if (
-    window.onanimationend === undefined &&
-    window.onwebkitanimationend !== undefined
-  ) {
-    ANIMATION_PROP = "WebkitAnimation";
-    ANIMATIONEND_EVENT = "webkitAnimationEnd animationend";
-  } else {
-    ANIMATION_PROP = "animation";
-    ANIMATIONEND_EVENT = "animationend";
-  }
-
-  const DURATION_KEY = "Duration";
-  const PROPERTY_KEY = ASTType.Property;
-  const DELAY_KEY = "Delay";
-  const TIMING_KEY = "TimingFunction";
-  const ANIMATION_ITERATION_COUNT_KEY = "IterationCount";
-  const ANIMATION_PLAYSTATE_KEY = "PlayState";
-  const SAFE_FAST_FORWARD_DURATION_VALUE = 9999;
-
-  const ANIMATION_DELAY_PROP = ANIMATION_PROP + DELAY_KEY;
-  const ANIMATION_DURATION_PROP = ANIMATION_PROP + DURATION_KEY;
-  const TRANSITION_DELAY_PROP = TRANSITION_PROP + DELAY_KEY;
-  const TRANSITION_DURATION_PROP = TRANSITION_PROP + DURATION_KEY;
-
-  const ngMinErr$1 = minErr("ng");
-  function assertArg(arg, name, reason) {
-    if (!arg) {
-      throw ngMinErr$1(
-        "areq",
-        "Argument '{0}' is {1}",
-        name || "?",
-        reason,
-      );
-    }
-    return arg;
-  }
-
-  function packageStyles(options) {
-    const styles = {};
-    if (options && (options.to || options.from)) {
-      styles.to = options.to;
-      styles.from = options.from;
-    }
-    return styles;
-  }
-
-  function pendClasses(classes, fix, isPrefix) {
-    let className = "";
-
-    classes = Array.isArray(classes)
-      ? classes
-      : classes && isString(classes) && classes.length
-        ? classes.split(/\s+/)
-        : [];
-    classes.forEach((klass, i) => {
-      if (klass && klass.length > 0) {
-        className += i > 0 ? " " : "";
-        className += isPrefix ? fix + klass : klass + fix;
-      }
-    });
-    return className;
-  }
-
-  function removeFromArray(arr, val) {
-    const index = arr.indexOf(val);
-    if (val >= 0) {
-      arr.splice(index, 1);
-    }
-  }
-
-  /**
-   *
-   * @param {NodeList|Node} element
-   * @returns {Node[]|Node|undefined}
-   */
-  function stripCommentsFromElement(element) {
-    if (element instanceof NodeList) {
-      return Array.from(element).filter((x) => x.nodeType == Node.ELEMENT_NODE);
-    } else if (element.nodeType === Node.ELEMENT_NODE) {
-      return /** @type {Node} */ (element);
-    } else {
-      return undefined;
-    }
-  }
-
-  /**
-   * @param {NodeList|Node} element
-   * @returns {Node}
-   */
-  function extractElementNode(element) {
-    if (!element) return /** @type {Node} */ (element);
-    for (let i = 0; i < /** @type {NodeList} */ (element).length; i++) {
-      const elm = element[i];
-      if (elm.nodeType === Node.ELEMENT_NODE) {
-        return elm;
-      }
-    }
-  }
-
-  function applyAnimationClassesFactory() {
-    return function (element, options) {
-      if (options.addClass) {
-        element.classList.add(...options.addClass.trim().split(" "));
-        options.addClass = null;
-      }
-      if (options.removeClass) {
-        element.classList.remove(...options.removeClass.trim().split(" "));
-        options.removeClass = null;
-      }
-    };
-  }
-
-  function prepareAnimationOptions(options) {
-    options = options || {};
-    if (!options.$$prepared) {
-      let domOperation = options.domOperation || (() => {});
-      options.domOperation = function () {
-        options.$$domOperationFired = true;
-        domOperation();
-        domOperation = () => {};
-      };
-      options.$$prepared = true;
-    }
-    return options;
-  }
-
-  function applyAnimationStyles(element, options) {
-    applyAnimationFromStyles(element, options);
-    applyAnimationToStyles(element, options);
-  }
-
-  function applyAnimationFromStyles(element, options) {
-    if (options.from) {
-      //element.css(options.from);
-      options.from = null;
-    }
-  }
-
-  function applyAnimationToStyles(element, options) {
-    if (options.to) {
-      //element.css(options.to);
-      options.to = null;
-    }
-  }
-
-  function mergeAnimationDetails(element, oldAnimation, newAnimation) {
-    const target = oldAnimation.options || {};
-    const newOptions = newAnimation.options || {};
-
-    const toAdd = `${target.addClass || ""} ${newOptions.addClass || ""}`;
-    const toRemove = `${target.removeClass || ""} ${newOptions.removeClass || ""}`;
-    const classes = resolveElementClasses(
-      element.getAttribute("class"),
-      toAdd,
-      toRemove,
-    );
-
-    if (newOptions.preparationClasses) {
-      target.preparationClasses = concatWithSpace(
-        newOptions.preparationClasses,
-        target.preparationClasses,
-      );
-      delete newOptions.preparationClasses;
-    }
-
-    extend(target, newOptions);
-
-    if (classes.addClass) {
-      target.addClass = classes.addClass;
-    } else {
-      target.addClass = null;
-    }
-
-    if (classes.removeClass) {
-      target.removeClass = classes.removeClass;
-    } else {
-      target.removeClass = null;
-    }
-
-    oldAnimation.addClass = target.addClass;
-    oldAnimation.removeClass = target.removeClass;
-
-    return target;
-  }
-
-  function resolveElementClasses(existing, toAdd, toRemove) {
-    const ADD_CLASS = 1;
-    const REMOVE_CLASS = -1;
-
-    const flags = {};
-    existing = splitClassesToLookup(existing);
-
-    toAdd = splitClassesToLookup(toAdd);
-    Object.keys(toAdd).forEach((key) => {
-      flags[key] = ADD_CLASS;
-    });
-
-    toRemove = splitClassesToLookup(toRemove);
-    Object.keys(toRemove).forEach((key) => {
-      flags[key] = flags[key] === ADD_CLASS ? null : REMOVE_CLASS;
-    });
-
-    const classes = {
-      addClass: "",
-      removeClass: "",
-    };
-
-    Object.entries(flags).forEach(([klass, val]) => {
-      let prop, allow;
-      if (val === ADD_CLASS) {
-        prop = "addClass";
-        allow = !existing[klass] || existing[klass + REMOVE_CLASS_SUFFIX];
-      } else if (val === REMOVE_CLASS) {
-        prop = "removeClass";
-        allow = existing[klass] || existing[klass + ADD_CLASS_SUFFIX];
-      }
-      if (allow) {
-        if (classes[prop].length) {
-          classes[prop] += " ";
-        }
-        classes[prop] += klass;
-      }
-    });
-
-    function splitClassesToLookup(classes) {
-      if (isString(classes)) {
-        classes = classes.trim().split(" ");
-      }
-
-      const obj = {};
-      if (classes) {
-        classes.forEach((klass) => {
-          // sometimes the split leaves empty string values
-          // incase extra spaces were applied to the options
-          if (klass.length) {
-            obj[klass] = true;
-          }
-        });
-      }
-      return obj;
-    }
-
-    return classes;
-  }
-
-  function applyGeneratedPreparationClasses(element, event, options) {
-    let classes = "";
-    if (event) {
-      classes = pendClasses(event, EVENT_CLASS_PREFIX, true);
-    }
-    if (options.addClass) {
-      classes = concatWithSpace(
-        classes,
-        pendClasses(options.addClass, ADD_CLASS_SUFFIX),
-      );
-    }
-    if (options.removeClass) {
-      classes = concatWithSpace(
-        classes,
-        pendClasses(options.removeClass, REMOVE_CLASS_SUFFIX),
-      );
-    }
-    if (classes.length) {
-      options.preparationClasses = classes;
-      element.className += ` ${classes}`;
-    }
-  }
-
-  function clearGeneratedClasses(element, options) {
-    if (options.preparationClasses) {
-      options.preparationClasses
-        .split(" ")
-        .forEach((cls) => element.classList.remove(cls));
-      options.preparationClasses = null;
-    }
-    if (options.activeClasses) {
-      options.activeClasses
-        .split(" ")
-        .forEach((cls) => element.classList.remove(cls));
-      options.activeClasses = null;
-    }
-  }
-
-  function blockKeyframeAnimations(node, applyBlock) {
-    const value = applyBlock ? "paused" : "";
-    const key = ANIMATION_PROP + ANIMATION_PLAYSTATE_KEY;
-    applyInlineStyle(node, [key, value]);
-    return [key, value];
-  }
-
-  function applyInlineStyle(node, styleTuple) {
-    const prop = styleTuple[0];
-    node.style[prop] = styleTuple[1];
-  }
-
-  function concatWithSpace(a, b) {
-    if (!a) return b;
-    if (!b) return a;
-    return `${a} ${b}`;
-  }
-
   /** @typedef {"enter"|"leave"|"move"|"addClass"|"setClass"|"removeClass"} AnimationMethod */
 
   /**
@@ -14362,7 +14351,7 @@
            *
            * @param {Element} element - the element which will be inserted into the DOM
            * @param {Element} parent - the parent element which will append the element as a child (so long as the after element is not present)
-           * @param {Element} after - after the sibling element after which the element will be appended
+           * @param {Element} [after] - after the sibling element after which the element will be appended
            * @param {AnimationOptions} [options] - an optional collection of options/styles that will be applied to the element.
            * @returns {import('./animate-runner.js').AnimateRunner} the animation runner
            */
@@ -17840,7 +17829,7 @@
               return concat.join("");
             };
 
-            return /**@type {import("./interface.js").InterpolationFunction}  */ extend(
+            return /**@type {import("./interface.ts").InterpolationFunction}  */ extend(
               (context, cb) => {
                 let i = 0;
                 const ii = expressions.length;
@@ -19508,7 +19497,7 @@
     /**
      * Registers a callback to be called when the URL changes.
      *
-     * @param {import("./interface.js").UrlChangeListener} callback - The callback function to register.
+     * @param {import("./interface.ts").UrlChangeListener} callback - The callback function to register.
      * @returns void
      */
     #onUrlChange(callback) {
@@ -20101,16 +20090,9 @@
    */
   let $parse;
 
-  /**@type {import('../../services/exception/exception-handler.js').ErrorHandler} */
+  /**@type {ng.ExceptionHandlerService} */
   let $exceptionHandler;
 
-  /**
-   * @typedef {Object} AsyncQueueTask
-   * @property {Scope} handler
-   * @property {Function} fn
-   * @property {Object} locals
-   */
-
   const $postUpdateQueue = [];
 
   class RootScopeProvider {
@@ -20119,11 +20101,11 @@
     }
 
     $get = [
-      "$exceptionHandler",
-      "$parse",
+      $injectTokens.$exceptionHandler,
+      $injectTokens.$parse,
       /**
-       * @param {import('../../services/exception/exception-handler.js').ErrorHandler} exceptionHandler
-       * @param {import('../parse/interface.ts').ParseService} parse
+       * @param {ng.ExceptionHandlerService} exceptionHandler
+       * @param {ng.ParseService} parse
        */
       (exceptionHandler, parse) => {
         $exceptionHandler = exceptionHandler;
@@ -20180,27 +20162,6 @@
     }
   }
 
-  /**
-   * Listener function definition.
-   * @typedef {Object} Listener
-   * @property {Object} originalTarget - The original target object.
-   * @property {ListenerFunction} listenerFn - The function invoked when changes are detected.
-   * @property {import("../parse/interface.ts").CompiledExpression} watchFn
-   * @property {number} id - Deregistration id
-   * @property {number} scopeId - The scope that created the Listener
-   * @property {string[]} property
-   * @property {string} [watchProp] - The original property to watch if different from observed key
-   * @property {Proxy} [foreignListener]
-   *
-   */
-
-  /**
-   * Listener function type.
-   * @callback ListenerFunction
-   * @param {*} newValue - The new value of the changed property.
-   * @param {Object} originalTarget - The original target object.
-   */
-
   /**
    * Decorator for excluding objects from scope observability
    */
@@ -20226,13 +20187,13 @@
           : context
         : undefined;
 
-      /** @type {Map<string, Array<Listener>>} Watch listeners */
+      /** @type {Map<string, Array<import('./interface.ts').Listener>>} Watch listeners */
       this.watchers = context ? context.watchers : new Map();
 
       /** @type {Map<String, Function[]>} Event listeners */
       this.$$listeners = new Map();
 
-      /** @type {Map<string, Array<Listener>>} Watch listeners from other proxies */
+      /** @type {Map<string, Array<import('./interface.ts').Listener>>} Watch listeners from other proxies */
       this.foreignListeners = context ? context.foreignListeners : new Map();
 
       /** @type {Set<ProxyConstructor>} */
@@ -20277,7 +20238,7 @@
           ? null
           : context;
 
-      /** @type {AsyncQueueTask[]} */
+      /** @type {import('./interface.ts').AsyncQueueTask[]} */
       this.$$asyncQueue = [];
 
       this.filters = [];
@@ -20286,257 +20247,18 @@
       this.$$destroyed = false;
 
       this.scheduled = [];
-    }
-
-    /**
-     * Intercepts and handles property assignments on the target object. If a new value is
-     * an object, it will be recursively proxied.
-     *
-     * @param {Object} target - The target object.
-     * @param {string} property - The name of the property being set.
-     * @param {*} value - The new value being assigned to the property.
-     * @param {Proxy} proxy - The proxy intercepting property access
-     * @returns {boolean} - Returns true to indicate success of the operation.
-     */
-    set(target, property, value, proxy) {
-      if (property === "undefined") {
-        throw new Error("Attempting to set undefined property");
-      }
-      if (
-        (target.constructor?.$nonscope &&
-          Array.isArray(target.constructor.$nonscope) &&
-          target.constructor.$nonscope.includes(property)) ||
-        (target.$nonscope &&
-          Array.isArray(target.$nonscope) &&
-          target.$nonscope.includes(property))
-      ) {
-        target[property] = value;
-        return true;
-      }
-
-      this.$proxy = proxy;
-      this.$target = target;
-      const oldValue = target[property];
-
-      // Handle NaNs
-      if (
-        oldValue !== undefined &&
-        Number.isNaN(oldValue) &&
-        Number.isNaN(value)
-      ) {
-        return true;
-      }
-      if (oldValue && oldValue[isProxySymbol]) {
-        if (Array.isArray(value)) {
-          if (oldValue !== value) {
-            const listeners = this.watchers.get(property);
-
-            if (listeners) {
-              this.#scheduleListener(listeners);
-            }
-
-            const foreignListeners = this.foreignListeners.get(property);
-
-            if (foreignListeners) {
-              this.#scheduleListener(foreignListeners);
-            }
-          }
-
-          if (this.objectListeners.get(target[property])) {
-            this.objectListeners.delete(target[property]);
-          }
-          target[property] = createScope(value, this);
-          this.objectListeners.set(target[property], [property]);
-          return true;
-        }
-
-        if (isObject(value)) {
-          if (hasOwn(target, property)) {
-            Object.keys(oldValue)
-              .filter((x) => !value[x])
-              .forEach((k) => {
-                delete oldValue[k];
-              });
-          }
-
-          if (oldValue !== value) {
-            const listeners = this.watchers.get(property);
-
-            if (listeners) {
-              this.#scheduleListener(listeners);
-            }
-
-            const foreignListeners = this.foreignListeners.get(property);
-
-            if (foreignListeners) {
-              this.#scheduleListener(foreignListeners);
-            }
-
-            this.#checkeListenersForAllKeys(value);
-          }
-          target[property] = createScope(value, this);
-          //setDeepValue(target[property], value);
-          return true;
-        }
-
-        if (isUndefined(value)) {
-          let called = false;
-          Object.keys(oldValue.$target).forEach((k) => {
-            if (oldValue.$target[k]?.[isProxySymbol]) {
-              called = true;
-            }
-            delete oldValue[k];
-          });
-
-          target[property] = undefined;
-          if (!called) {
-            let listeners = this.watchers.get(property);
-
-            if (listeners) {
-              this.#scheduleListener(listeners);
-            }
-          }
-
-          return true;
-        }
-
-        if (isDefined(value)) {
-          target[property] = value;
-          let listeners = this.watchers.get(property);
-
-          if (listeners) {
-            this.#scheduleListener(listeners);
-          }
-
-          if (Array.isArray(target)) {
-            if (this.objectListeners.has(proxy) && property !== "length") {
-              let keys = this.objectListeners.get(proxy);
-              keys.forEach((key) => {
-                const listeners = this.watchers.get(key);
-                if (listeners) {
-                  this.#scheduleListener(listeners);
-                }
-              });
-            }
-          }
-
-          return true;
-        }
-        return true;
-      } else {
-        if (isUndefined(target[property]) && isProxy(value)) {
-          this.foreignProxies.add(value);
-          target[property] = value;
-          if (!this.watchers.has(property)) {
-            return true;
-          }
-        }
-        if (isUndefined(value)) {
-          target[property] = value;
-        } else {
-          target[property] = createScope(value, this);
-        }
-
-        if (oldValue !== value) {
-          let expectedTarget = this.$target;
-          let listeners = [];
-          // Handle the case where we need to start observing object after a watcher has been set
-          if (isUndefined(oldValue) && isObject(target[property])) {
-            if (!this.objectListeners.has(target[property])) {
-              this.objectListeners.set(target[property], [property]);
-            }
-            for (const k of Object.keys(value)) {
-              this.watchers.get(k)?.forEach((l) => listeners.push(l));
-              // overwhrite the context so we pass the owneship test in filter
-              expectedTarget = value;
-            }
-          }
-
-          if (Array.isArray(target)) {
-            this.watchers.get("length")?.forEach((l) => listeners.push(l));
-          }
-
-          this.watchers.get(property)?.forEach((l) => listeners.push(l));
-          if (listeners.length > 0) {
-            // check if the listener actually appllies to this target
-            this.#scheduleListener(listeners, (x) => {
-              return x.filter((x) => {
-                if (!x.watchProp) return true;
-                // Compute the expected target based on `watchProp`
-                const wrapperExpr = x.watchProp.split(".").slice(0, -1).join(".");
-                const expectedHandler = $parse(wrapperExpr)(
-                  x.originalTarget,
-                )?.$handler;
-                return expectedTarget === expectedHandler?.$target;
-              });
-            });
-          }
-
-          let foreignListeners = this.foreignListeners.get(property);
-
-          if (!foreignListeners && this.$parent?.foreignListeners) {
-            foreignListeners = this.$parent.foreignListeners.get(property);
-          }
-          if (foreignListeners) {
-            // filter for repeaters
-            if (this.$target.$$hashKey) {
-              foreignListeners = foreignListeners.filter((x) =>
-                x.originalTarget.$$hashKey
-                  ? x.originalTarget.$$hashKey == this.$target.$$hashKey
-                  : false,
-              );
-            }
-
-            this.#scheduleListener(foreignListeners);
-          }
-        }
-
-        if (this.objectListeners.has(proxy) && property !== "length") {
-          let keys = this.objectListeners.get(proxy);
-          keys.forEach((key) => {
-            const listeners = this.watchers.get(key);
-            if (listeners) {
-              if (this.scheduled !== listeners) {
-                this.#scheduleListener(listeners);
-              }
-            }
-          });
-        }
-
-        return true;
-      }
-    }
-
-    /**
-     * Intercepts property access on the target object. It checks for specific
-     * properties (`watch` and `sync`) and binds their methods. For other properties,
-     * it returns the value directly.
-     *
-     * @param {Object} target - The target object.
-     * @param {string|number|symbol} property - The name of the property being accessed.
-     * @param {Proxy} proxy - The proxy object being invoked
-     * @returns {*} - The value of the property or a method if accessing `watch` or `sync`.
-     */
-    get(target, property, proxy) {
-      if (property === "$$watchersCount") return calculateWatcherCount(this);
-      if (property === isProxySymbol) return true;
-
-      if (target[property] && isProxy(target[property])) {
-        this.$proxy = target[property];
-      } else {
-        this.$proxy = proxy;
-      }
 
+      /** @private */
       this.propertyMap = {
         $watch: this.$watch.bind(this),
         $new: this.$new.bind(this),
         $newIsolate: this.$newIsolate.bind(this),
         $destroy: this.$destroy.bind(this),
+        $flushQueue: this.$flushQueue.bind(this),
         $eval: this.$eval.bind(this),
         $apply: this.$apply.bind(this),
         $postUpdate: this.$postUpdate.bind(this),
         $isRoot: this.#isRoot.bind(this),
-        $target: target,
         $proxy: this.$proxy,
         $on: this.$on.bind(this),
         $emit: this.$emit.bind(this),
@@ -20550,6 +20272,249 @@
         $merge: this.$merge.bind(this),
         $getById: this.$getById.bind(this),
       };
+    }
+
+    /**
+     * Intercepts and handles property assignments on the target object. If a new value is
+     * an object, it will be recursively proxied.
+     *
+     * @param {Object} target - The target object.
+     * @param {string} property - The name of the property being set.
+     * @param {*} value - The new value being assigned to the property.
+     * @param {Proxy} proxy - The proxy intercepting property access
+     * @returns {boolean} - Returns true to indicate success of the operation.
+     */
+    set(target, property, value, proxy) {
+      if (property === "undefined") {
+        throw new Error("Attempting to set undefined property");
+      }
+      if (
+        (target.constructor?.$nonscope &&
+          Array.isArray(target.constructor.$nonscope) &&
+          target.constructor.$nonscope.includes(property)) ||
+        (target.$nonscope &&
+          Array.isArray(target.$nonscope) &&
+          target.$nonscope.includes(property))
+      ) {
+        target[property] = value;
+        return true;
+      }
+
+      this.$proxy = proxy;
+      this.$target = target;
+      const oldValue = target[property];
+
+      // Handle NaNs
+      if (
+        oldValue !== undefined &&
+        Number.isNaN(oldValue) &&
+        Number.isNaN(value)
+      ) {
+        return true;
+      }
+      if (oldValue && oldValue[isProxySymbol]) {
+        if (Array.isArray(value)) {
+          if (oldValue !== value) {
+            const listeners = this.watchers.get(property);
+
+            if (listeners) {
+              this.#scheduleListener(listeners);
+            }
+
+            const foreignListeners = this.foreignListeners.get(property);
+
+            if (foreignListeners) {
+              this.#scheduleListener(foreignListeners);
+            }
+          }
+
+          if (this.objectListeners.get(target[property])) {
+            this.objectListeners.delete(target[property]);
+          }
+          target[property] = createScope(value, this);
+          this.objectListeners.set(target[property], [property]);
+          return true;
+        }
+
+        if (isObject(value)) {
+          if (hasOwn(target, property)) {
+            Object.keys(oldValue)
+              .filter((x) => !value[x])
+              .forEach((k) => {
+                delete oldValue[k];
+              });
+          }
+
+          if (oldValue !== value) {
+            const listeners = this.watchers.get(property);
+
+            if (listeners) {
+              this.#scheduleListener(listeners);
+            }
+
+            const foreignListeners = this.foreignListeners.get(property);
+
+            if (foreignListeners) {
+              this.#scheduleListener(foreignListeners);
+            }
+
+            this.#checkeListenersForAllKeys(value);
+          }
+          target[property] = createScope(value, this);
+          //setDeepValue(target[property], value);
+          return true;
+        }
+
+        if (isUndefined(value)) {
+          let called = false;
+          Object.keys(oldValue.$target).forEach((k) => {
+            if (oldValue.$target[k]?.[isProxySymbol]) {
+              called = true;
+            }
+            delete oldValue[k];
+          });
+
+          target[property] = undefined;
+          if (!called) {
+            let listeners = this.watchers.get(property);
+
+            if (listeners) {
+              this.#scheduleListener(listeners);
+            }
+          }
+
+          return true;
+        }
+
+        if (isDefined(value)) {
+          target[property] = value;
+          let listeners = this.watchers.get(property);
+
+          if (listeners) {
+            this.#scheduleListener(listeners);
+          }
+
+          if (Array.isArray(target)) {
+            if (this.objectListeners.has(proxy) && property !== "length") {
+              let keys = this.objectListeners.get(proxy);
+              keys.forEach((key) => {
+                const listeners = this.watchers.get(key);
+                if (listeners) {
+                  this.#scheduleListener(listeners);
+                }
+              });
+            }
+          }
+
+          return true;
+        }
+        return true;
+      } else {
+        if (isUndefined(target[property]) && isProxy(value)) {
+          this.foreignProxies.add(value);
+          target[property] = value;
+          if (!this.watchers.has(property)) {
+            return true;
+          }
+        }
+        if (isUndefined(value)) {
+          target[property] = value;
+        } else {
+          target[property] = createScope(value, this);
+        }
+
+        if (oldValue !== value) {
+          let expectedTarget = this.$target;
+          let listeners = [];
+          // Handle the case where we need to start observing object after a watcher has been set
+          if (isUndefined(oldValue) && isObject(target[property])) {
+            if (!this.objectListeners.has(target[property])) {
+              this.objectListeners.set(target[property], [property]);
+            }
+            for (const k of Object.keys(value)) {
+              this.watchers.get(k)?.forEach((l) => listeners.push(l));
+              // overwhrite the context so we pass the owneship test in filter
+              expectedTarget = value;
+            }
+          }
+
+          if (Array.isArray(target)) {
+            this.watchers.get("length")?.forEach((l) => listeners.push(l));
+          }
+
+          this.watchers.get(property)?.forEach((l) => listeners.push(l));
+          if (listeners.length > 0) {
+            // check if the listener actually appllies to this target
+            this.#scheduleListener(listeners, (x) => {
+              return x.filter((x) => {
+                if (!x.watchProp) return true;
+                // Compute the expected target based on `watchProp`
+                const wrapperExpr = x.watchProp.split(".").slice(0, -1).join(".");
+                const expectedHandler = $parse(wrapperExpr)(
+                  x.originalTarget,
+                )?.$handler;
+                return expectedTarget === expectedHandler?.$target;
+              });
+            });
+          }
+
+          let foreignListeners = this.foreignListeners.get(property);
+
+          if (!foreignListeners && this.$parent?.foreignListeners) {
+            foreignListeners = this.$parent.foreignListeners.get(property);
+          }
+          if (foreignListeners) {
+            // filter for repeaters
+            if (this.$target.$$hashKey) {
+              foreignListeners = foreignListeners.filter((x) =>
+                x.originalTarget["$$hashKey"]
+                  ? x.originalTarget["$$hashKey"] === this.$target.$$hashKey
+                  : false,
+              );
+            }
+
+            this.#scheduleListener(foreignListeners);
+          }
+        }
+
+        if (this.objectListeners.has(proxy) && property !== "length") {
+          let keys = this.objectListeners.get(proxy);
+          keys.forEach((key) => {
+            const listeners = this.watchers.get(key);
+            if (listeners) {
+              if (this.scheduled !== listeners) {
+                this.#scheduleListener(listeners);
+              }
+            }
+          });
+        }
+
+        return true;
+      }
+    }
+
+    /**
+     * Intercepts property access on the target object. It checks for specific
+     * properties (`watch` and `sync`) and binds their methods. For other properties,
+     * it returns the value directly.
+     *
+     * @param {Object} target - The target object.
+     * @param {string|number|symbol} property - The name of the property being accessed.
+     * @param {Proxy} proxy - The proxy object being invoked
+     * @returns {*} - The value of the property or a method if accessing `watch` or `sync`.
+     */
+    get(target, property, proxy) {
+      if (property === "$$watchersCount") return calculateWatcherCount(this);
+      if (property === isProxySymbol) return true;
+
+      if (target[property] && isProxy(target[property])) {
+        this.$proxy = target[property];
+      } else {
+        this.$proxy = proxy;
+      }
+
+      this.propertyMap.$target = target;
+      this.propertyMap.$proxy = proxy;
 
       if (
         Array.isArray(target) &&
@@ -20644,7 +20609,7 @@
     }
 
     /**
-     * @param {Listener[]} listeners
+     * @param {import('./interface.ts').Listener[]} listeners
      * @param {Function} filter
      */
     #scheduleListener(listeners, filter = (val) => val) {
@@ -20668,7 +20633,7 @@
      * function is invoked when changes to that property are detected.
      *
      * @param {string} watchProp - An expression to be watched in the context of this model.
-     * @param {ListenerFunction} [listenerFn] - A function to execute when changes are detected on watched context.
+     * @param {import('./interface.ts').ListenerFunction} [listenerFn] - A function to execute when changes are detected on watched context.
      * @param {boolean} [lazy] - A flag to indicate if the listener should be invoked immediately. Defaults to false.
      */
     $watch(watchProp, listenerFn, lazy = false) {
@@ -20690,7 +20655,7 @@
         return () => {};
       }
 
-      /** @type {Listener} */
+      /** @type {import('./interface.ts').Listener} */
       const listener = {
         originalTarget: this.$target,
         listenerFn: listenerFn,
@@ -20802,7 +20767,7 @@
 
             let potentialProxy = $parse(
               watchProp.split(".").slice(0, -1).join("."),
-            )(listener.originalTarget);
+            )(/** @type {Scope} */ (listener.originalTarget));
             if (potentialProxy && this.foreignProxies.has(potentialProxy)) {
               potentialProxy.$handler.#registerForeignKey(key, listener);
               potentialProxy.$handler.#scheduleListener([listener]);
@@ -21000,21 +20965,21 @@
       return true;
     }
 
-    // deregisterForeignKey(key, id) {
-    //   const listenerList = this.foreignListeners.get(key);
-    //   if (!listenerList) return false;
+    deregisterForeignKey(key, id) {
+      const listenerList = this.foreignListeners.get(key);
+      if (!listenerList) return false;
 
-    //   const index = listenerList.findIndex((x) => x.id === id);
-    //   if (index === -1) return false;
+      const index = listenerList.findIndex((x) => x.id === id);
+      if (index === -1) return false;
 
-    //   listenerList.splice(index, 1);
-    //   if (listenerList.length) {
-    //     this.foreignListeners.set(key, listenerList);
-    //   } else {
-    //     this.foreignListeners.delete(key);
-    //   }
-    //   return true;
-    // }
+      listenerList.splice(index, 1);
+      if (listenerList.length) {
+        this.foreignListeners.set(key, listenerList);
+      } else {
+        this.foreignListeners.delete(key);
+      }
+      return true;
+    }
 
     $eval(expr, locals) {
       const fn = $parse(expr);
@@ -21047,7 +21012,7 @@
     }
 
     /**
-     * @param {import('../../interface.js').Expression} expr
+     * @param {import('../../interface.ts').Expression} expr
      * @returns {any}
      */
     $apply(expr) {
@@ -21228,12 +21193,12 @@
 
     /**
      * @internal
-     * @param {Listener} listener - The property path that was changed.
+     * @param {import('./interface.ts').Listener} listener - The property path that was changed.
      */
     #notifyListener(listener, target) {
       const { originalTarget, listenerFn, watchFn } = listener;
       try {
-        let newVal = watchFn(originalTarget);
+        let newVal = watchFn(/** @type {Scope} */ (originalTarget));
         if (isUndefined(newVal)) {
           newVal = watchFn(target);
         }
@@ -21263,6 +21228,13 @@
       }
     }
 
+    /* @ignore */
+    $flushQueue() {
+      while ($postUpdateQueue.length) {
+        $postUpdateQueue.shift()();
+      }
+    }
+
     /**
      * Searches the scope instance
      *
@@ -21773,7 +21745,7 @@
 
   /**
    * @param {boolean} isDefault
-   * @returns {(any) => import("../../interface.js").Directive}
+   * @returns {(any) => import("../../interface.ts").Directive}
    */
   function ngMessageDirectiveFactory(isDefault) {
     ngMessageDirective.$inject = ["$animate"];
@@ -21980,6 +21952,9 @@
     return $aria.$$watchExpr("ngShow", "aria-hidden", [], true);
   }
 
+  /**
+   * @return {ng.Directive}
+   */
   function ngMessagesAriaDirective() {
     return {
       restrict: "A",
@@ -21995,18 +21970,21 @@
   }
 
   ngClickAriaDirective.$inject = [$injectTokens.$aria, $injectTokens.$parse];
+
+  /**
+   * @param $aria
+   * @param {ng.ParseService} $parse
+   * @return {ng.Directive}
+   */
   function ngClickAriaDirective($aria, $parse) {
     return {
       restrict: "A",
       compile(_elem, attr) {
         if (hasOwn(attr, ARIA_DISABLE_ATTR)) return;
 
-        const fn = $parse(attr.ngClick);
+        const fn = $parse(attr["ngClick"]);
 
-        /**
-         * @param {Element} elem
-         */
-        return function (scope, elem, attr) {
+        return (scope, elem, attr) => {
           if (!isNodeOneOf(elem, nativeAriaNodeNames)) {
             if ($aria.config("bindRoleForClick") && !elem.hasAttribute("role")) {
               elem.setAttribute("role", "button");
@@ -22043,10 +22021,6 @@
                       // See https://github.com/angular/angular.js/issues/16664
                       event.preventDefault();
                     }
-                    scope.$apply(callback);
-                  }
-
-                  function callback() {
                     fn(scope, { $event: event });
                   }
                 },
@@ -22368,6 +22342,7 @@
   }
 
   function AnimateCssProvider() {
+    let activeClasses;
     this.$get = [
       "$$AnimateRunner",
       "$$animateCache",
@@ -22711,10 +22686,7 @@
             return closeAndReturnNoopAnimator();
           }
 
-          let activeClasses = pendClasses(
-            preparationClasses,
-            ACTIVE_CLASS_SUFFIX,
-          );
+          activeClasses = pendClasses(preparationClasses, ACTIVE_CLASS_SUFFIX);
 
           if (options.delay != null) {
             if (typeof options.delay !== "boolean") {
@@ -22851,7 +22823,9 @@
 
             if (events && events.length) {
               // Remove the transitionend / animationend listener(s)
-              element.off(events.join(" "), onAnimationProgress);
+              events.forEach((i) =>
+                element.removeEventListener(i, onAnimationProgress),
+              );
             }
 
             // Cancel the fallback closing timeout and remove the timer data
@@ -23286,11 +23260,6 @@
       ) {
         const activeAnimationsLookup = new Map();
         const disabledElementsLookup = new Map();
-        let animationsEnabled = null;
-
-        function removeFromDisabledElementsLookup(evt) {
-          disabledElementsLookup.delete(evt.target);
-        }
 
         function postDigestTaskFactory() {
           let postDigestCalled = false;
@@ -23330,11 +23299,6 @@
               // any animations are triggered.
               $rootScope.$postUpdate(() => {
                 $rootScope.$postUpdate(() => {
-                  // we check for null directly in the event that the application already called
-                  // .enabled() with whatever arguments that it provided it with
-                  if (animationsEnabled === null) {
-                    animationsEnabled = true;
-                  }
                 });
               });
             }
@@ -23473,47 +23437,6 @@
             options.domOperation = domOperation;
             return queueAnimation(element, event, options);
           },
-
-          // this method has four signatures:
-          //  () - global getter
-          //  (bool) - global setter
-          //  (element) - element getter
-          //  (element, bool) - element setter<F37>
-          enabled(element, bool) {
-            const argCount = arguments.length;
-
-            if (argCount === 0) {
-              // () - Global getter
-              bool = !!animationsEnabled;
-            } else {
-              const hasElement = isElement(element);
-
-              if (!hasElement) {
-                // (bool) - Global setter
-                bool = animationsEnabled = !!element;
-              } else {
-                const node = element;
-
-                if (argCount === 1) {
-                  // (element) - Element getter
-                  bool = !disabledElementsLookup.get(node);
-                } else {
-                  // (element, bool) - Element setter
-                  if (!disabledElementsLookup.has(node)) {
-                    // The element is added to the map for the first time.
-                    // Create a listener to remove it on `$destroy` (to avoid memory leak).
-                    element.addEventListener(
-                      "$destroy",
-                      removeFromDisabledElementsLookup,
-                    );
-                  }
-                  disabledElementsLookup.set(node, !bool);
-                }
-              }
-            }
-
-            return bool;
-          },
         };
 
         return $animate;
@@ -23570,6 +23493,7 @@
           if (options.to && !isObject(options.to)) {
             options.to = null;
           }
+
           // If animations are hard-disabled for the whole application there is no need to continue.
           // There are also situations where a directive issues an animation for a JQLite wrapper that
           // contains only comment nodes. In this case, there is no way we can perform an animation.
@@ -23582,7 +23506,6 @@
             close();
             return runner;
           }
-
           const isStructural = ["enter", "move", "leave"].indexOf(event) >= 0;
 
           // This is a hard disable of all animations the element itself, therefore  there is no need to
@@ -23818,6 +23741,8 @@
             });
           });
 
+          // Since we don't have digest any more - trigger queue here
+          setTimeout($rootScope.$flushQueue, 0);
           return runner;
 
           function notifyProgress(runner, event, phase, data) {
@@ -23981,14 +23906,14 @@
   // TODO: use caching here to speed things up for detection
   // TODO: add documentation
 
-  AnimateJsProvider.$inject = ["$animateProvider"];
+  AnimateJsProvider.$inject = [$injectTokens.$animate + "Provider"];
   function AnimateJsProvider($animateProvider) {
     this.$get = [
       $injectTokens.$injector,
       "$$AnimateRunner",
       /**
        *
-       * @param {import("../core/di/internal-injector").InjectorService} $injector
+       * @param {ng.InjectorService} $injector
        * @param {*} $$AnimateRunner
        * @returns
        */
@@ -24847,8 +24772,8 @@
   }
 
   /**
-   * @typedef {import('./interface.js').RafScheduler} RafScheduler
-   * @typedef {import('../interface.js').ServiceProvider} ServiceProvider
+   * @typedef {import('./interface.ts').RafScheduler} RafScheduler
+   * @typedef {import('../interface.ts').ServiceProvider} ServiceProvider
    */
 
   /**
@@ -25363,9 +25288,9 @@
     ];
   }
 
-  ngAnimateSwapDirective.$inject = ["$animate"];
+  ngAnimateSwapDirective.$inject = [$injectTokens.$animate];
   /**
-   * @returns {import('../interface.ts').Directive}
+   * @returns {ng.Directive}
    */
   function ngAnimateSwapDirective($animate) {
     return {
@@ -25374,10 +25299,10 @@
       terminal: true,
       priority: 550, // We use 550 here to ensure that the directive is caught before others,
       // but after `ngIf` (at priority 600).
-      link(scope, $element, attrs, ctrl, $transclude) {
+      link(scope, $element, attrs, _ctrl, $transclude) {
         let previousElement;
         let previousScope;
-        scope.$watch(attrs["ngAnimateSwap"] || attrs["for"], (value) => {
+        scope.$watch(attrs.ngAnimateSwap || attrs.for, (value) => {
           if (previousElement) {
             $animate.leave(previousElement);
           }
@@ -27604,7 +27529,7 @@
      * @param {PathNode[]} fromPath
      * @param {PathNode[]} toPath
      * @param {boolean} [reloadState]
-     * @returns {import("../transition/interface.js").TreeChanges}
+     * @returns {import("../transition/interface.ts").TreeChanges}
      */
     static treeChanges(fromPath, toPath, reloadState) {
       const max = Math.min(fromPath.length, toPath.length);
@@ -28339,25 +28264,6 @@
     return vc.$ngViewContextAnchor === (ngViewContext && ngViewContext.name);
   };
 
-  /**
-   * An object for Transition Hook Phases
-   * @enum {number}
-   * @readonly
-   */
-  const TransitionHookPhase = {
-    CREATE: 0,
-    BEFORE: 1,
-    RUN: 2,
-    SUCCESS: 3,
-    ERROR: 4,
-  };
-
-  /** An object for Transition Hook Scopes */
-  const TransitionHookScope = {
-    TRANSITION: 0,
-    STATE: 1,
-  };
-
   /**
    * An object for Transition Rejection reasons.
    * @enum {number}
@@ -28477,7 +28383,7 @@
     }
   }
 
-  /** @typedef {import('../../interface.js').ServiceProvider} ServiceProvider
+  /** @typedef {import('../../interface.ts').ServiceProvider} ServiceProvider
 
   /**
    * Configurable provider for an injectable event bus
@@ -28834,6 +28740,31 @@
     bind: null,
   };
 
+  /**
+   * Enum representing the different phases of a transition hook.
+   *
+   * @readonly
+   * @enum {number}
+   */
+  const TransitionHookPhase = Object.freeze({
+    CREATE: 0,
+    BEFORE: 1,
+    RUN: 2,
+    SUCCESS: 3,
+    ERROR: 4,
+  });
+
+  /**
+   * Enum representing the scope in which a transition hook operates.
+   *
+   * @readonly
+   * @enum {number}
+   */
+  const TransitionHookScope = Object.freeze({
+    TRANSITION: 0,
+    STATE: 1,
+  });
+
   class TransitionHook {
     /**
      * Chains together an array of TransitionHooks.
@@ -30652,7 +30583,6 @@
     }
 
     _defineCoreEvents() {
-      const Phase = TransitionHookPhase;
       const TH = TransitionHook;
       const paths = this._criteriaPaths;
       const NORMAL_SORT = false,
@@ -30660,7 +30590,7 @@
       const SYNCHRONOUS = true;
       this._defineEvent(
         "onCreate",
-        Phase.CREATE,
+        TransitionHookPhase.CREATE,
         0,
         paths.to,
         NORMAL_SORT,
@@ -30668,15 +30598,21 @@
         TH.THROW_ERROR,
         SYNCHRONOUS,
       );
-      this._defineEvent("onBefore", Phase.BEFORE, 0, paths.to);
-      this._defineEvent("onStart", Phase.RUN, 0, paths.to);
-      this._defineEvent("onExit", Phase.RUN, 100, paths.exiting, REVERSE_SORT);
-      this._defineEvent("onRetain", Phase.RUN, 200, paths.retained);
-      this._defineEvent("onEnter", Phase.RUN, 300, paths.entering);
-      this._defineEvent("onFinish", Phase.RUN, 400, paths.to);
+      this._defineEvent("onBefore", TransitionHookPhase.BEFORE, 0, paths.to);
+      this._defineEvent("onStart", TransitionHookPhase.RUN, 0, paths.to);
+      this._defineEvent(
+        "onExit",
+        TransitionHookPhase.RUN,
+        100,
+        paths.exiting,
+        REVERSE_SORT,
+      );
+      this._defineEvent("onRetain", TransitionHookPhase.RUN, 200, paths.retained);
+      this._defineEvent("onEnter", TransitionHookPhase.RUN, 300, paths.entering);
+      this._defineEvent("onFinish", TransitionHookPhase.RUN, 400, paths.to);
       this._defineEvent(
         "onSuccess",
-        Phase.SUCCESS,
+        TransitionHookPhase.SUCCESS,
         0,
         paths.to,
         NORMAL_SORT,
@@ -30686,7 +30622,7 @@
       );
       this._defineEvent(
         "onError",
-        Phase.ERROR,
+        TransitionHookPhase.ERROR,
         0,
         paths.to,
         NORMAL_SORT,
@@ -30952,7 +30888,7 @@
 
     /**
      *
-     * @param {import("./interface.js").StateDeclaration} definition
+     * @param {import("./interface.ts").StateDeclaration} definition
      */
     state(definition) {
       if (!definition.name) {
@@ -32252,7 +32188,7 @@
     );
   }
 
-  /** @typedef {import('./interface.js').StateDeclaration} StateDeclaration */
+  /** @typedef {import('./interface.ts').StateDeclaration} StateDeclaration */
 
   /**
    * Internal representation of a ng-router state.
@@ -32275,7 +32211,7 @@
     includes = undefined;
 
     /**
-     * @param {import('./interface.js').StateDeclaration} config
+     * @param {import('./interface.ts').StateDeclaration} config
      */
     constructor(config) {
       Object.assign(this, config);
@@ -32283,7 +32219,7 @@
         return this;
       };
       /**
-       * @type {import('./interface.js').StateDeclaration}
+       * @type {import('./interface.ts').StateDeclaration}
        */
       this.self = config;
       /**
@@ -34672,7 +34608,7 @@
    * ```
    */
 
-  /** @type {import("../../interface.js").AnnotatedDirectiveFactory} */
+  /** @type {import("../../interface.ts").AnnotatedDirectiveFactory} */
   let ngView = [
     "$view",
     "$animate",
@@ -34683,7 +34619,7 @@
      * @param {*} $animate
      * @param {*} $viewScroll
      * @param {*} $interpolate
-     * @returns {import("../../interface.js").Directive}
+     * @returns {import("../../interface.ts").Directive}
      */
     function $ViewDirective($view, $animate, $viewScroll, $interpolate) {
       function getRenderer() {
@@ -35024,8 +34960,8 @@
 
   ngChannelDirective.$inject = [$injectTokens.$eventBus];
   /**
-   * @param {import("../../services/pubsub/pubsub.js").PubSub} $eventBus
-   * @returns {import("../../interface.ts").Directive}
+   * @param {ng.PubSubService} $eventBus
+   * @returns {ng.Directive}
    */
   function ngChannelDirective($eventBus) {
     return {
@@ -35109,7 +35045,8 @@
   }
 
   /**
-   * @param {"get" | "delete" | "post" | "put"} method
+   * @param {"get" | "delete" | "post" | "put"} method - HTTP method applied to request
+   * @param {string} [attrOverride] - Custom name to use for the attribute
    * @returns {ng.DirectiveFactory}
    */
   function defineDirective(method, attrOverride) {
@@ -35123,6 +35060,7 @@
       $injectTokens.$parse,
       $injectTokens.$state,
       $injectTokens.$sse,
+      $injectTokens.$animate,
     ];
     return directive;
   }
@@ -35142,15 +35080,11 @@
   /** @type {ng.DirectiveFactory} */
   const ngSseDirective = defineDirective("get", "ngSse");
 
-  /**
-   * @typedef {"click" | "change" | "submit"} EventType
-   */
-
   /**
    * Selects DOM event to listen for based on the element type.
    *
    * @param {Element} element - The DOM element to inspect.
-   * @returns {EventType} The name of the event to listen for.
+   * @returns {"click" | "change" | "submit"} The name of the event to listen for.
    */
   function getEventNameForElement(element) {
     const tag = element.tagName.toLowerCase();
@@ -35162,89 +35096,6 @@
     return "click";
   }
 
-  /**
-   * Handles DOM manipulation based on a swap strategy and server-rendered HTML.
-   *
-   * @param {string} html - The HTML string returned from the server.
-   * @param {import("./interface.ts").SwapModeType} swap
-   * @param {Element} target - The target DOM element to apply the swap to.
-   * @param {ng.Scope} scope
-   * @param {ng.CompileService} $compile
-   */
-  function handleSwapResponse(html, swap, target, scope, $compile) {
-    let nodes = [];
-    if (!["textcontent", "delete", "none"].includes(swap)) {
-      if (!html) {
-        return;
-      }
-
-      if (isObject(html)) {
-        scope.$merge(html);
-        return;
-      }
-
-      const compiled = $compile(html)(scope);
-      nodes =
-        compiled instanceof DocumentFragment
-          ? Array.from(compiled.childNodes)
-          : [compiled];
-    }
-
-    switch (swap) {
-      case "innerHTML":
-        target.replaceChildren(...nodes);
-        break;
-
-      case "outerHTML": {
-        const parent = target.parentNode;
-        if (!parent) return;
-        const frag = document.createDocumentFragment();
-        nodes.forEach((n) => frag.appendChild(n));
-        parent.replaceChild(frag, target);
-        break;
-      }
-
-      case "textContent":
-        target.textContent = html;
-        break;
-
-      case "beforebegin":
-        nodes.forEach((node) => target.parentNode.insertBefore(node, target));
-        break;
-
-      case "afterbegin":
-        nodes
-          .slice()
-          .reverse()
-          .forEach((node) => target.insertBefore(node, target.firstChild));
-        break;
-
-      case "beforeend":
-        nodes.forEach((node) => target.appendChild(node));
-        break;
-
-      case "afterend":
-        nodes
-          .slice()
-          .reverse()
-          .forEach((node) =>
-            target.parentNode.insertBefore(node, target.nextSibling),
-          );
-        break;
-
-      case "delete":
-        target.remove();
-        break;
-
-      case "none":
-        break;
-
-      default:
-        target.replaceChildren(...nodes);
-        break;
-    }
-  }
-
   /**
    * Creates an HTTP directive factory that supports GET, DELETE, POST, PUT.
    *
@@ -35253,16 +35104,136 @@
    * @returns {ng.DirectiveFactory}
    */
   function createHttpDirective(method, attrName) {
+    let content = undefined;
+
     /**
      * @param {ng.HttpService} $http
      * @param {ng.CompileService} $compile
      * @param {ng.LogService} $log
      * @param {ng.ParseService} $parse
      * @param {ng.StateService} $state
-     * @param {Function} $sse
+     * @param {ng.SseService} $sse
      * @returns {ng.Directive}
      */
-    return function ($http, $compile, $log, $parse, $state, $sse) {
+    return function ($http, $compile, $log, $parse, $state, $sse, $animate) {
+      /**
+       * Handles DOM manipulation based on a swap strategy and server-rendered HTML.
+       *
+       * @param {string | Object} html - The HTML string or object returned from the server.
+       * @param {import("./interface.ts").SwapModeType} swap
+       * @param {ng.Scope} scope
+       * @param {ng.Attributes} attrs
+       * @param {Element} element
+       */
+      function handleSwapResponse(html, swap, scope, attrs, element) {
+        let animationEnabled = false;
+        if (attrs.animate) {
+          animationEnabled = true;
+        }
+        let nodes = [];
+        if (!["textcontent", "delete", "none"].includes(swap)) {
+          if (!html) return;
+          const compiled = $compile(html)(scope);
+          nodes =
+            compiled instanceof DocumentFragment
+              ? Array.from(compiled.childNodes)
+              : [compiled];
+        }
+
+        const targetSelector = attrs["target"];
+        const target = targetSelector
+          ? document.querySelector(targetSelector)
+          : element;
+
+        if (!target) {
+          $log.warn(`${attrName}: target "${targetSelector}" not found`);
+          return;
+        }
+
+        switch (swap) {
+          case "innerHTML":
+            if (animationEnabled) {
+              if (content) {
+                $animate.leave(content).done(() => {
+                  content = nodes[0];
+                  $animate.enter(nodes[0], target);
+                  scope.$flushQueue();
+                });
+                scope.$flushQueue();
+              } else {
+                content = nodes[0];
+                $animate.enter(nodes[0], target);
+                scope.$flushQueue();
+              }
+            } else {
+              target.replaceChildren(...nodes);
+            }
+            break;
+
+          case "outerHTML": {
+            const parent = target.parentNode;
+            if (!parent) return;
+            const frag = document.createDocumentFragment();
+            nodes.forEach((n) => frag.appendChild(n));
+            if (animationEnabled) {
+              const placeholder = document.createComment("placeholder");
+              target.parentNode.insertBefore(placeholder, target.nextSibling);
+              $animate.leave(target).done(() => {
+                const insertedNodes = Array.from(frag.childNodes);
+                insertedNodes.forEach((n) =>
+                  $animate.enter(n, parent, placeholder),
+                );
+                content = insertedNodes;
+                scope.$flushQueue();
+              });
+              scope.$flushQueue();
+            } else {
+              parent.replaceChild(frag, target);
+            }
+            break;
+          }
+
+          case "textContent":
+            target.textContent = html;
+            break;
+
+          case "beforebegin":
+            nodes.forEach((node) => target.parentNode.insertBefore(node, target));
+            break;
+
+          case "afterbegin":
+            nodes
+              .slice()
+              .reverse()
+              .forEach((node) => target.insertBefore(node, target.firstChild));
+            break;
+
+          case "beforeend":
+            nodes.forEach((node) => target.appendChild(node));
+            break;
+
+          case "afterend":
+            nodes
+              .slice()
+              .reverse()
+              .forEach((node) =>
+                target.parentNode.insertBefore(node, target.nextSibling),
+              );
+            break;
+
+          case "delete":
+            target.remove();
+            break;
+
+          case "none":
+            break;
+
+          default:
+            target.replaceChildren(...nodes);
+            break;
+        }
+      }
+
       /**
        * Collects form data from the element or its associated form.
        *
@@ -35276,15 +35247,12 @@
         const tag = element.tagName.toLowerCase();
 
         if (tag === "form") {
-          /** @type {HTMLFormElement} */
           form = /** @type {HTMLFormElement} */ (element);
         } else if ("form" in element && element.form) {
-          /** @type {HTMLFormElement} */
           form = /** @type {HTMLFormElement} */ (element.form);
         } else if (element.hasAttribute("form")) {
           const formId = element.getAttribute("form");
           if (formId) {
-            /** @type {HTMLElement | null} */
             const maybeForm = document.getElementById(formId);
             if (maybeForm && maybeForm.tagName.toLowerCase() === "form") {
               form = /** @type {HTMLFormElement} */ (maybeForm);
@@ -35322,13 +35290,10 @@
       return {
         restrict: "A",
         link(scope, element, attrs) {
-          const eventName =
-            attrs["trigger"] ||
-            /** @type {EventType} */ getEventNameForElement(element);
-
+          const eventName = attrs.trigger || getEventNameForElement(element);
           const tag = element.tagName.toLowerCase();
 
-          if (isDefined(attrs["latch"])) {
+          if (isDefined(attrs.latch)) {
             attrs.$observe(
               "latch",
               callBackAfterFirst(() =>
@@ -35344,24 +35309,14 @@
             element.dispatchEvent(new Event(eventName));
             intervalId = setInterval(
               () => element.dispatchEvent(new Event(eventName)),
-              parseInt(attrs["interval"]) || 1000,
+              parseInt(attrs.interval) || 1000,
             );
           }
 
           element.addEventListener(eventName, async (event) => {
             if (/** @type {HTMLButtonElement} */ (element).disabled) return;
             if (tag === "form") event.preventDefault();
-            const swap = attrs["swap"] || "innerHTML";
-            const targetSelector = attrs["target"];
-            const target = targetSelector
-              ? document.querySelector(targetSelector)
-              : element;
-
-            if (!target) {
-              $log.warn(`${attrName}: target "${targetSelector}" not found`);
-              return;
-            }
-
+            const swap = attrs.swap || "innerHTML";
             const url = attrs[attrName];
             if (!url) {
               $log.warn(`${attrName}: no URL specified`);
@@ -35369,56 +35324,57 @@
             }
 
             const handler = (res) => {
-              if (isDefined(attrs["loading"])) {
+              if (isDefined(attrs.loading)) {
                 attrs.$set("loading", false);
               }
 
-              if (isDefined(attrs["loadingClass"])) {
-                attrs.$removeClass(attrs["loadingClass"]);
+              if (isDefined(attrs.loadingClass)) {
+                attrs.$removeClass(attrs.loadingClass);
               }
 
               const html = res.data;
               if (200 <= res.status && res.status <= 299) {
-                if (isDefined(attrs["success"])) {
-                  $parse(attrs["success"])(scope, { $res: html });
+                if (isDefined(attrs.success)) {
+                  $parse(attrs.success)(scope, { $res: html });
                 }
 
-                if (isDefined(attrs["stateSuccess"])) {
-                  $state.go(attrs["stateSuccess"]);
+                if (isDefined(attrs.stateSuccess)) {
+                  $state.go(attrs.stateSuccess);
                 }
               } else if (400 <= res.status && res.status <= 599) {
-                if (isDefined(attrs["error"])) {
-                  $parse(attrs["error"])(scope, { $res: html });
+                if (isDefined(attrs.error)) {
+                  $parse(attrs.error)(scope, { $res: html });
                 }
 
-                if (isDefined(attrs["stateError"])) {
-                  $state.go(attrs["stateError"]);
+                if (isDefined(attrs.stateError)) {
+                  $state.go(attrs.stateError);
                 }
               }
 
-              handleSwapResponse(
-                html,
-                /** @type {import("./interface.ts").SwapModeType} */ (swap),
-                target,
-                scope,
-                $compile,
-              );
+              if (isObject(html)) {
+                if (attrs.target) {
+                  scope.$eval(`${attrs.target} = ${JSON.stringify(html)}`);
+                } else {
+                  scope.$merge(html);
+                }
+              } else if (isString(html)) {
+                handleSwapResponse(html, swap, scope, attrs, element);
+              }
             };
-            if (isDefined(attrs["delay"])) {
-              await wait(parseInt(attrs["delay"]) | 0);
-            }
 
-            if (throttled) {
-              return;
+            if (isDefined(attrs.delay)) {
+              await wait(parseInt(attrs.delay) | 0);
             }
 
-            if (isDefined(attrs["throttle"])) {
+            if (throttled) return;
+
+            if (isDefined(attrs.throttle)) {
               throttled = true;
               attrs.$set("throttled", true);
               setTimeout(() => {
                 attrs.$set("throttled", false);
                 throttled = false;
-              }, parseInt(attrs["throttle"]));
+              }, parseInt(attrs.throttle));
             }
 
             if (isDefined(attrs["loading"])) {
@@ -35426,13 +35382,13 @@
             }
 
             if (isDefined(attrs["loadingClass"])) {
-              attrs.$addClass(attrs["loadingClass"]);
+              attrs.$addClass(attrs.loadingClass);
             }
 
             if (method === "post" || method === "put") {
               let data;
               const config = {};
-              if (attrs["enctype"]) {
+              if (attrs.enctype) {
                 config.headers = {
                   "Content-Type": attrs["enctype"],
                 };
@@ -35442,11 +35398,10 @@
               }
               $http[method](url, data, config).then(handler).catch(handler);
             } else {
-              // If SSE mode is enabled
-              if (method === "get" && attrs["ngSse"]) {
+              if (method === "get" && attrs.ngSse) {
                 const sseUrl = url;
                 const config = {
-                  withCredentials: attrs["withCredentials"] === "true",
+                  withCredentials: attrs.withCredentials === "true",
                   transformMessage: (data) => {
                     try {
                       return JSON.parse(data);
@@ -35456,9 +35411,9 @@
                   },
                   onOpen: () => {
                     $log.info(`${attrName}: SSE connection opened to ${sseUrl}`);
-                    if (isDefined(attrs["loading"])) attrs.$set("loading", false);
-                    if (isDefined(attrs["loadingClass"]))
-                      attrs.$removeClass(attrs["loadingClass"]);
+                    if (isDefined(attrs.loading)) attrs.$set("loading", false);
+                    if (isDefined(attrs.loadingClass))
+                      attrs.$removeClass(attrs.loadingClass);
                   },
                   onMessage: (data) => {
                     const res = { status: 200, data };
@@ -35469,12 +35424,15 @@
                     const res = { status: 500, data: err };
                     handler(res);
                   },
+                  onReconnect: (count) => {
+                    $log.info(`ngSse: reconnected ${count} time(s)`);
+                    if (attrs.onReconnect)
+                      $parse(attrs.onReconnect)(scope, { $count: count });
+                  },
                 };
 
-                // Open the SSE connection using the injected service
                 const source = $sse(sseUrl, config);
 
-                // Cleanup on scope destroy
                 scope.$on("$destroy", () => {
                   $log.info(`${attrName}: closing SSE connection`);
                   source.close();
@@ -35489,7 +35447,6 @@
             scope.$on("$destroy", () => clearInterval(intervalId));
           }
 
-          // Eagerly execute for 'load' event
           if (eventName == "load") {
             element.dispatchEvent(new Event("load"));
           }
@@ -35570,38 +35527,54 @@
    *   const source = $sse('/events', {
    *     onMessage: (data) => console.log(data),
    *     onError: (err) => console.error(err),
-   *     withCredentials: true
+   *     retryDelay: 2000,
+   *     heartbeatTimeout: 10000,
    *   });
    *
-   *   // later:
    *   source.close();
    */
-
   class SseProvider {
     constructor() {
       /**
        * Optional provider-level defaults
        * @type {ng.SseConfig}
        */
-      this.defaults = {};
+      this.defaults = {
+        retryDelay: 1000,
+        maxRetries: Infinity,
+        heartbeatTimeout: 15000, // 15 seconds
+        transformMessage(data) {
+          try {
+            return JSON.parse(data);
+          } catch {
+            return data;
+          }
+        },
+      };
     }
 
     /**
      * Returns the $sse service function
      * @returns {ng.SseService}
      */
-    $get =
-      () =>
-      (url, config = {}) => {
-        const finalUrl = this.#buildUrl(url, config.params);
-        return this.#createEventSource(finalUrl, config);
-      };
+    $get = [
+      $injectTokens.$log,
+      /** @param {ng.LogService} log */
+      (log) => {
+        this.$log = log;
+        return (url, config = {}) => {
+          const mergedConfig = { ...this.defaults, ...config };
+          const finalUrl = this.#buildUrl(url, mergedConfig.params);
+          return this.#createConnection(finalUrl, mergedConfig);
+        };
+      },
+    ];
 
     /**
      * Build URL with query parameters
-     * @param {string} url - Base URL
-     * @param {Record<string, any>=} params - Query parameters
-     * @returns {string} URL with serialized query string
+     * @param {string} url
+     * @param {Record<string, any>=} params
+     * @returns {string}
      */
     #buildUrl(url, params) {
       if (!params) return url;
@@ -35612,37 +35585,376 @@
     }
 
     /**
-     * Create and manage an EventSource
-     * @param {string} url - URL for SSE connection
-     * @param {ng.SseConfig} config - Configuration object
-     * @returns {EventSource} The EventSource instance wrapped as SseService
+     * Creates a managed SSE connection with reconnect and heartbeat
+     * @param {string} url
+     * @param {ng.SseConfig} config
+     * @returns {import("./interface.ts").SseConnection}
      */
-    #createEventSource(url, config) {
-      const es = new EventSource(url, {
-        withCredentials: !!config.withCredentials,
-      });
+    #createConnection(url, config) {
+      let es;
+      let retryCount = 0;
+      let closed = false;
+      let heartbeatTimer;
 
-      if (config.onOpen) {
-        es.addEventListener("open", (e) => config.onOpen(e));
-      }
+      const connect = () => {
+        if (closed) return;
 
-      es.addEventListener("message", (e) => {
-        let data = e.data;
-        try {
-          data = config.transformMessage
-            ? config.transformMessage(data)
-            : JSON.parse(data);
-        } catch {
-          // leave as raw string if not JSON
+        es = new EventSource(url, {
+          withCredentials: !!config.withCredentials,
+        });
+
+        es.addEventListener("open", (e) => {
+          retryCount = 0;
+          config.onOpen?.(e);
+          if (config.heartbeatTimeout) resetHeartbeat();
+        });
+
+        es.addEventListener("message", (e) => {
+          let data = e.data;
+          try {
+            data = config.transformMessage ? config.transformMessage(data) : data;
+          } catch {
+            /* empty */
+          }
+          config.onMessage?.(data, e);
+          if (config.heartbeatTimeout) resetHeartbeat();
+        });
+
+        es.addEventListener("error", (err) => {
+          config.onError?.(err);
+          if (closed) return;
+          es.close();
+
+          if (retryCount < config.maxRetries) {
+            retryCount++;
+            config.onReconnect?.(retryCount);
+            setTimeout(connect, config.retryDelay);
+          } else {
+            this.$log.warn("SSE: Max retries reached");
+          }
+        });
+      };
+
+      const resetHeartbeat = () => {
+        clearTimeout(heartbeatTimer);
+        heartbeatTimer = setTimeout(() => {
+          this.$log.warn("SSE: heartbeat timeout, reconnecting...");
+          es.close();
+          config.onReconnect?.(++retryCount);
+          connect();
+        }, config.heartbeatTimeout);
+      };
+
+      connect();
+
+      return {
+        close() {
+          closed = true;
+          clearTimeout(heartbeatTimer);
+          es.close();
+        },
+        connect() {
+          if (closed == false) {
+            close();
+          }
+          connect();
+        },
+      };
+    }
+  }
+
+  /**
+   * @returns {ng.Directive}
+   */
+  function ngViewportDirective() {
+    return {
+      restrict: "A",
+      link(scope, element, attrs) {
+        const enterExpr = attrs["onEnter"];
+        const leaveExpr = attrs["onLeave"];
+
+        const observer = new IntersectionObserver(
+          (entries) => {
+            entries.forEach((entry) => {
+              if (entry.isIntersecting) {
+                if (enterExpr) scope.$eval(enterExpr);
+              } else {
+                if (leaveExpr) scope.$eval(leaveExpr);
+              }
+            });
+          },
+          {
+            root: null, // viewport
+            threshold: 0.1, // consider "in view" if 10% visible
+          },
+        );
+
+        observer.observe(element);
+
+        // Clean up when the element is removed from DOM
+        const parent = element.parentNode;
+        let mutationObserver;
+        if (parent) {
+          mutationObserver = new MutationObserver((mutations) => {
+            for (const mutation of mutations) {
+              Array.from(mutation.removedNodes).forEach((removedNode) => {
+                if (removedNode === element) {
+                  observer.disconnect();
+                  mutationObserver.disconnect();
+                }
+              });
+            }
+          });
+          mutationObserver.observe(parent, { childList: true });
         }
-        config.onMessage?.(data, e);
-      });
 
-      if (config.onError) {
-        es.addEventListener("error", (e) => config.onError(e));
+        scope.$on("$destroy", () => {
+          observer.disconnect();
+          if (mutationObserver) mutationObserver.disconnect();
+        });
+      },
+    };
+  }
+
+  ngWorkerDirective.$inject = ["$worker", $injectTokens.$parse, $injectTokens.$log];
+  /**
+   * ngWorker directive factory
+   * Usage: <div ng-worker="workerName" data-params="{{ expression }}" data-on-result="callback($result)"></div>
+   */
+  function ngWorkerDirective($worker, $parse, $log) {
+    return {
+      restrict: "A",
+      link(scope, element, attrs) {
+        const workerName = attrs.ngWorker;
+        if (!workerName) {
+          $log.warn("ngWorker: missing worker name");
+          return;
+        }
+
+        const eventName = attrs.trigger || getEventNameForElement(element);
+
+        let throttled = false;
+        let intervalId;
+
+        if (isDefined(attrs.latch)) {
+          attrs.$observe(
+            "latch",
+            callBackAfterFirst(() => element.dispatchEvent(new Event(eventName))),
+          );
+        }
+
+        if (isDefined(attrs.interval)) {
+          element.dispatchEvent(new Event(eventName));
+          intervalId = setInterval(
+            () => element.dispatchEvent(new Event(eventName)),
+            parseInt(attrs.interval) || 1000,
+          );
+        }
+
+        const worker = $worker(workerName, {
+          onMessage: (result) => {
+            if (isDefined(attrs.dataOnResult)) {
+              $parse(attrs.dataOnResult)(scope, { $result: result });
+            } else {
+              const swap = attrs.swap || "innerHTML";
+              handleSwap(result, swap, element);
+            }
+          },
+          onError: (err) => {
+            $log.error(`[ng-worker:${workerName}]`, err);
+            if (isDefined(attrs.dataOnError)) {
+              $parse(attrs.dataOnError)(scope, { $error: err });
+            } else {
+              element.textContent = "Error";
+            }
+          },
+        });
+
+        element.addEventListener(eventName, async () => {
+          if (element.disabled) return;
+
+          if (isDefined(attrs.delay)) {
+            await wait(parseInt(attrs.delay) || 0);
+          }
+
+          if (throttled) return;
+
+          if (isDefined(attrs.throttle)) {
+            throttled = true;
+            attrs.$set("throttled", true);
+            setTimeout(() => {
+              attrs.$set("throttled", false);
+              throttled = false;
+            }, parseInt(attrs.throttle));
+          }
+
+          let params;
+          try {
+            params = attrs.params ? scope.$eval(attrs.params) : undefined;
+          } catch (err) {
+            $log.error("ngWorker: failed to evaluate data-params", err);
+            params = undefined;
+          }
+
+          worker.post(params);
+        });
+
+        if (intervalId) {
+          scope.$on("$destroy", () => clearInterval(intervalId));
+        }
+
+        if (eventName === "load") {
+          element.dispatchEvent(new Event("load"));
+        }
+      },
+    };
+  }
+
+  /**
+   * Swap result into DOM based on strategy
+   */
+  function handleSwap(result, swap, element) {
+    switch (swap) {
+      case "outerHTML": {
+        const parent = element.parentNode;
+        if (!parent) return;
+        const temp = document.createElement("div");
+        temp.innerHTML = result;
+        parent.replaceChild(temp.firstChild, element);
+        break;
       }
+      case "textContent":
+        element.textContent = result;
+        break;
+      case "beforebegin":
+        element.insertAdjacentHTML("beforebegin", result);
+        break;
+      case "afterbegin":
+        element.insertAdjacentHTML("afterbegin", result);
+        break;
+      case "beforeend":
+        element.insertAdjacentHTML("beforeend", result);
+        break;
+      case "afterend":
+        element.insertAdjacentHTML("afterend", result);
+        break;
+      case "innerHTML":
+      default:
+        element.innerHTML = result;
+        break;
+    }
+  }
 
-      return es;
+  /**
+   * Worker Provider
+   *
+   * Usage:
+   *   const worker = $worker('./math.worker.js', {
+   *     onMessage: (data) => console.log('Result:', data),
+   *     onError: (err) => console.error('Worker error:', err),
+   *     autoTerminate: false,
+   *     transformMessage: (d) => d,
+   *   });
+   *
+   *   worker.post({ action: 'fib', n: 20 });
+   *   worker.terminate();
+   */
+  class WorkerProvider {
+    /**
+     * @type {ng.LogService}
+     */
+    $log;
+    constructor() {
+      /**
+       * Optional provider-level defaults
+       * @type {ng.WorkerConfig}
+       */
+      this.defaults = {
+        autoTerminate: false,
+        transformMessage(data) {
+          try {
+            return JSON.parse(data);
+          } catch {
+            return data;
+          }
+        },
+      };
+    }
+
+    /**
+     * Returns the $worker service function
+     * @returns {ng.WorkerService}
+     */
+    $get = [
+      $injectTokens.$log,
+      /** @param {ng.LogService} log */
+      (log) => {
+        this.$log = log;
+        return (scriptPath, config = {}) => {
+          const merged = { ...this.defaults, ...config };
+          return this.#createWorker(scriptPath, merged);
+        };
+      },
+    ];
+
+    /**
+     * Creates a managed Web Worker instance
+     * @param {string | URL} scriptPath
+     * @param {ng.WorkerConfig} config
+     * @returns {import("./interface.ts").WorkerConnection}
+     */
+    #createWorker(scriptPath, config) {
+      if (!scriptPath) throw new Error("Worker script path required");
+
+      let worker = new Worker(scriptPath, { type: "module" });
+      let terminated = false;
+
+      const reconnect = () => {
+        if (terminated) return;
+        this.$log.info("Worker: restarting...");
+        worker.terminate();
+        worker = new Worker(scriptPath, { type: "module" });
+        wire(worker);
+      };
+
+      const wire = (w) => {
+        w.onmessage = (e) => {
+          let data = e.data;
+          try {
+            data = config.transformMessage ? config.transformMessage(data) : data;
+          } catch {
+            /* no-op */
+          }
+          config.onMessage?.(data, e);
+        };
+
+        w.onerror = (err) => {
+          config.onError?.(err);
+          if (config.autoRestart) reconnect();
+        };
+      };
+
+      wire(worker);
+      let that = this;
+      return {
+        post(data) {
+          if (terminated) return that.$log.warn("Worker already terminated");
+          try {
+            worker.postMessage(data);
+          } catch (err) {
+            that.$log.error("Worker post failed", err);
+          }
+        },
+        terminate() {
+          terminated = true;
+          worker.terminate();
+        },
+        restart() {
+          if (terminated)
+            return that.$log.warn("Worker cannot restart after terminate");
+          reconnect();
+        },
+      };
     }
   }
 
@@ -35658,7 +35970,7 @@
         [],
         [
           $injectTokens.$provide,
-          /** @param {import("./interface.js").Provider} $provide */
+          /** @param {import("./interface.ts").Provider} $provide */
           ($provide) => {
             // $$sanitizeUriProvider needs to be before $compileProvider as it is used by it.
             $provide.provider({
@@ -35723,6 +36035,8 @@
                 maxlength: maxlengthDirective,
                 ngValue: ngValueDirective,
                 ngModelOptions: ngModelOptionsDirective,
+                ngViewport: ngViewportDirective,
+                ngWorker: ngWorkerDirective,
               })
               .directive({
                 input: hiddenInputBrowserCacheDirective,
@@ -35790,6 +36104,7 @@
               $url: UrlService,
               $stateRegistry: StateRegistryProvider,
               $eventBus: PubSubProvider,
+              $worker: WorkerProvider,
             });
           },
         ],
@@ -35821,7 +36136,7 @@
       /**
        * @type {string} `version` from `package.json`
        */
-      this.version = "0.9.8"; //inserted via rollup plugin
+      this.version = "0.10.0"; //inserted via rollup plugin
 
       /** @type {!Array<string|any>} */
       this.bootsrappedModules = [];
@@ -35914,10 +36229,10 @@
         $injectTokens.$compile,
         $injectTokens.$injector,
         /**
-         * @param {import('./core/scope/scope.js').Scope} scope
+         * @param {ng.Scope} scope
          * @param {Element} el
-         * @param {import("./core/compile/compile.js").CompileFn} compile
-         * @param {import("./core/di/internal-injector.js").InjectorService} $injector
+         * @param {ng.CompileService} compile
+         * @param {ng.InjectorService} $injector
          */
         (scope, el, compile, $injector) => {
           // ng-route deps
@@ -36044,7 +36359,7 @@
      * @param {string} name The name of the module to create or retrieve.
      * @param {Array.<string>} [requires] If specified then new module is being created. If
      *        unspecified then the module is being retrieved for further configuration.
-     * @param {import("./interface.js").Injectable<any>} [configFn] Optional configuration function for the module that gets
+     * @param {import("./interface.ts").Injectable<any>} [configFn] Optional configuration function for the module that gets
      *        passed to {@link NgModule.config NgModule.config()}.
      * @returns {NgModule} A newly registered module.
      */