npm - @angular-wave/angular.ts - Versions diffs - 0.0.56 → 0.0.57 - Mend

@angular-wave/angular.ts 0.0.56 → 0.0.57

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (12) hide show

package/dist/angular-ts.esm.js +2 -2
package/dist/angular-ts.umd.js +2 -2
package/package.json +1 -1
package/src/animations/animate-css.html +6 -2
package/src/animations/animate-css.js +0 -1
package/src/core/animate/animate.js +97 -195
package/src/directive/if/if.js +24 -10
package/src/directive/if/if.md +2 -2
package/src/shared/utils.js +23 -0
package/types/core/animate/animate.d.ts +93 -172
package/types/directive/if/if.d.ts +6 -3
package/types/shared/utils.d.ts +6 -0

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@angular-wave/angular.ts",
   "license": "MIT",
-  "version": "0.0.56",
+  "version": "0.0.57",
   "type": "module",
   "main": "dist/angular-ts.esm.js",
   "browser": "dist/angular-ts.umd.js",

package/src/animations/animate-css.html CHANGED Viewed

@@ -19,9 +19,13 @@
     </script>
     <style>
+      .fade {
+        background-color: red;
+      }
       /* The starting CSS styles for the enter animation */
       .fade.ng-enter {
         transition: 0.5s linear all;
+        background-color: white;
         opacity: 0;
       }
@@ -34,18 +38,18 @@
       /* The starting CSS styles for the leave animation */
       .fade.ng-leave {
         transition: 0.5s linear all;
-        background-color: blue;
         opacity: 1;
       }
       /* The finishing CSS styles for the leave animation */
       .fade.ng-leave.ng-leave-active {
         opacity: 0;
+        background-color: white;
       }
     </style>
   </head>
   <body ng-app="test">
-    <div ng-if="bool" class="fade">Fade me in out</div>
+    <div ng-if="bool" class="fade" data-animate="true">Fade me in out</div>
     <button ng-click="bool=true">Fade In!</button>
     <button ng-click="bool=false">Fade Out!</button>
   </body>

package/src/animations/animate-css.js CHANGED Viewed

@@ -281,7 +281,6 @@ export function $AnimateCssProvider() {
         }
         const temporaryStyles = [];
-        const classes = element.attr("class");
         const styles = packageStyles(options);
         let animationClosed;
         let animationPaused;

package/src/core/animate/animate.js CHANGED Viewed

@@ -10,6 +10,16 @@ import { JQLite } from "../../shared/jqlite/jqlite";
 import { NG_ANIMATE_CLASSNAME } from "../../animations/shared";
 import { addInlineStyles } from "./helpers";
+/** @typedef {"enter"|"leave"|"move"|"addClass"|"setClass"|"removeClass"} AnimationMethod */
+/**
+ * @typedef {Object} AnimationOptions
+ * @property {string} addClass - space-separated CSS classes to add to element
+ * @property {Object} from - CSS properties & values at the beginning of animation. Must have matching `to`
+ * @property {string} removeClass - space-separated CSS classes to remove from element
+ * @property {string} to - CSS properties & values at end of animation. Must have matching `from`
+ */
 const $animateMinErr = minErr("$animate");
 function mergeClasses(a, b) {
@@ -60,10 +70,6 @@ function prepareAnimateOptions(options) {
   return isObject(options) ? options : {};
 }
-export function CoreAnimateJsProvider() {
-  this.$get = () => {};
-}
 // this is prefixed with Core since it conflicts with
 // the animateQueueProvider defined in ngAnimate/animateQueue.js
 export function CoreAnimateQueueProvider() {
@@ -179,6 +185,27 @@ export function CoreAnimateQueueProvider() {
   ];
 }
+export function domInsert(element, parentElement, afterElement) {
+  // if for some reason the previous element was removed
+  // 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(afterElement);
+    if (
+      afterNode &&
+      !afterNode.parentNode &&
+      !afterNode.previousElementSibling
+    ) {
+      afterElement = null;
+    }
+  }
+  if (afterElement) {
+    afterElement.after(element);
+  } else {
+    parentElement.prepend(element);
+  }
+}
 AnimateProvider.$inject = ["$provide"];
 export function AnimateProvider($provide) {
   const provider = this;
@@ -327,31 +354,8 @@ export function AnimateProvider($provide) {
   this.$get = [
     "$$animateQueue",
     function ($$animateQueue) {
-      function domInsert(element, parentElement, afterElement) {
-        // if for some reason the previous element was removed
-        // 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(afterElement);
-          if (
-            afterNode &&
-            !afterNode.parentNode &&
-            !afterNode.previousElementSibling
-          ) {
-            afterElement = null;
-          }
-        }
-        if (afterElement) {
-          afterElement.after(element);
-        } else {
-          parentElement.prepend(element);
-        }
-      }
       /**
-       * @ngdoc service
-       * @name $animate
-       * @description The $animate service exposes a series of DOM utility methods that provide support
+       * The $animate service exposes a series of DOM utility methods that provide support
        * for animation hooks. The default behavior is the application of DOM operations, however,
        * when an animation is detected (and animations are enabled), $animate will do the heavy lifting
        * to ensure that animation runs with the triggered DOM operation.
@@ -363,20 +367,11 @@ export function AnimateProvider($provide) {
        * `ngShow`, `ngHide` and `ngMessages` also provide support for animations.
        *
        * It is recommended that the`$animate` service is always used when executing DOM-related procedures within directives.
-       *
-       * To learn more about enabling animation support, click here to visit the
-       * {@link ngAnimate ngAnimate module page}.
        */
       return {
-        // we don't call it directly since non-existant arguments may
-        // be interpreted as null within the sub enabled function
         /**
          *
-         * @ngdoc method
-         * @name $animate#on
-         * @kind function
-         * @description Sets up an event listener to fire whenever the animation event (enter, leave, move, etc...)
+         * Sets up an event listener to fire whenever the animation event (enter, leave, move, etc...)
          *    has fired on the given element or among any of its children. Once the listener is fired, the provided callback
          *    is fired with the following params:
          *
@@ -425,11 +420,7 @@ export function AnimateProvider($provide) {
         on: $$animateQueue.on,
         /**
-         *
-         * @ngdoc method
-         * @name $animate#off
-         * @kind function
-         * @description Deregisters an event listener based on the event which has been associated with the provided element. This method
+         * Deregisters an event listener based on the event which has been associated with the provided element. This method
          * can be used in three different ways depending on the arguments:
          *
          * ```js
@@ -456,17 +447,14 @@ export function AnimateProvider($provide) {
         off: $$animateQueue.off,
         /**
-         * @ngdoc method
-         * @name $animate#pin
-         * @kind function
-         * @description Associates the provided element with a host parent element to allow the element to be animated even if it exists
-         *    outside of the DOM structure of the AngularJS application. By doing so, any animation triggered via `$animate` can be issued on the
-         *    element despite being outside the realm of the application or within another application. Say for example if the application
-         *    was bootstrapped on an element that is somewhere inside of the `<body>` tag, but we wanted to allow for an element to be situated
-         *    as a direct child of `document.body`, then this can be achieved by pinning the element via `$animate.pin(element)`. Keep in mind
-         *    that calling `$animate.pin(element, parentElement)` will not actually insert into the DOM anywhere; it will just create the association.
+         *  Associates the provided element with a host parent element to allow the element to be animated even if it exists
+         *  outside of the DOM structure of the AngularJS application. By doing so, any animation triggered via `$animate` can be issued on the
+         *  element despite being outside the realm of the application or within another application. Say for example if the application
+         *  was bootstrapped on an element that is somewhere inside of the `<body>` tag, but we wanted to allow for an element to be situated
+         *  as a direct child of `document.body`, then this can be achieved by pinning the element via `$animate.pin(element)`. Keep in mind
+         *  that calling `$animate.pin(element, parentElement)` will not actually insert into the DOM anywhere; it will just create the association.
          *
-         *    Note that this feature is only active when the `ngAnimate` module is used.
+         *  Note that this feature is only active when the `ngAnimate` module is used.
          *
          * @param {Element} element the external element that will be pinned
          * @param {Element} parentElement the host parent element that will be associated with the external element
@@ -505,14 +493,11 @@ export function AnimateProvider($provide) {
         enabled: $$animateQueue.enabled,
         /**
-       * @ngdoc method
-       * @name $animate#cancel
-       * @kind function
-       * @description Cancels the provided animation and applies the end state of the animation.
+       * Cancels the provided animation and applies the end state of the animation.
        * Note that this does not cancel the underlying operation, e.g. the setting of classes or
        * adding the element to the DOM.
        *
-       * @param {animationRunner} animationRunner An animation runner returned by an $animate function.
+       * @param {import('./animate-runner').AnimateRunner} runner An animation runner returned by an $animate function.
        *
        * @example
         <example module="animationExample" deps="angular-animate.js" animations="true" name="animate-cancel">
@@ -583,28 +568,16 @@ export function AnimateProvider($provide) {
         },
         /**
-         *
-         * @ngdoc method
-         * @name $animate#enter
-         * @kind function
-         * @description Inserts the element into the DOM either after the `after` element (if provided) or
-         *   as the first child within the `parent` element and then triggers an animation.
-         *   A promise is returned that will be resolved during the next digest once the animation
-         *   has completed.
-         *
-         * @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 the sibling element after which the element will be appended
-         * @param {object=} options an optional collection of options/styles that will be applied to the element.
-         *   The object can have the following properties:
-         *
-         *   - **addClass** - `{string}` - space-separated CSS classes to add to element
-         *   - **from** - `{Object}` - CSS properties & values at the beginning of animation. Must have matching `to`
-         *   - **removeClass** - `{string}` - space-separated CSS classes to remove from element
-         *   - **to** - `{Object}` - CSS properties & values at end of animation. Must have matching `from`
-         *
-         * @return {Runner} the animation runner
+         * Inserts the element into the DOM either after the `after` element (if provided) or
+         * as the first child within the `parent` element and then triggers an animation.
+         * A promise is returned that will be resolved during the next digest once the animation
+         * has completed.
+         *
+         * @param {JQLite} element - the element which will be inserted into the DOM
+         * @param {JQLite} parent - the parent element which will append the element as a child (so long as the after element is not present)
+         * @param {JQLite} 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').AnimateRunner} the animation runner
          */
         enter(element, parent, after, options) {
           parent = parent && JQLite(parent);
@@ -619,28 +592,16 @@ export function AnimateProvider($provide) {
         },
         /**
-         *
-         * @ngdoc method
-         * @name $animate#move
-         * @kind function
-         * @description Inserts (moves) the element into its new position in the DOM either after
-         *   the `after` element (if provided) or as the first child within the `parent` element
-         *   and then triggers an animation. A promise is returned that will be resolved
-         *   during the next digest once the animation has completed.
-         *
-         * @param {Element} element the element which will be moved into the new DOM position
-         * @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 the sibling element after which the element will be appended
-         * @param {object=} options an optional collection of options/styles that will be applied to the element.
-         *   The object can have the following properties:
-         *
-         *   - **addClass** - `{string}` - space-separated CSS classes to add to element
-         *   - **from** - `{Object}` - CSS properties & values at the beginning of animation. Must have matching `to`
-         *   - **removeClass** - `{string}` - space-separated CSS classes to remove from element
-         *   - **to** - `{Object}` - CSS properties & values at end of animation. Must have matching `from`
-         *
-         * @return {Runner} the animation runner
+         * Inserts (moves) the element into its new position in the DOM either after
+         * the `after` element (if provided) or as the first child within the `parent` element
+         * and then triggers an animation. A promise is returned that will be resolved
+         * during the next digest once the animation has completed.
+         *
+         * @param {JQLite} element - the element which will be inserted into the DOM
+         * @param {JQLite} parent - the parent element which will append the element as a child (so long as the after element is not present)
+         * @param {JQLite} 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').AnimateRunner} the animation runner
          */
         move(element, parent, after, options) {
           parent = parent && JQLite(parent);
@@ -655,23 +616,13 @@ export function AnimateProvider($provide) {
         },
         /**
-         * @ngdoc method
-         * @name $animate#leave
-         * @kind function
-         * @description Triggers an animation and then removes the element from the DOM.
+         * Triggers an animation and then removes the element from the DOM.
          * When the function is called a promise is returned that will be resolved during the next
          * digest once the animation has completed.
          *
-         * @param {Element} element the element which will be removed from the DOM
-         * @param {object=} options an optional collection of options/styles that will be applied to the element.
-         *   The object can have the following properties:
-         *
-         *   - **addClass** - `{string}` - space-separated CSS classes to add to element
-         *   - **from** - `{Object}` - CSS properties & values at the beginning of animation. Must have matching `to`
-         *   - **removeClass** - `{string}` - space-separated CSS classes to remove from element
-         *   - **to** - `{Object}` - CSS properties & values at end of animation. Must have matching `from`
-         *
-         * @return {Runner} the animation runner
+         * @param {JQLite} element the element which will be removed from the DOM
+         * @param {AnimationOptions} [options] an optional collection of options/styles that will be applied to the element.
+         * @returns {import('./animate-runner').AnimateRunner} the animation runner
          */
         leave(element, options) {
           return $$animateQueue.push(
@@ -685,56 +636,36 @@ export function AnimateProvider($provide) {
         },
         /**
-         * @ngdoc method
-         * @name $animate#addClass
-         * @kind function
-         *
-         * @description Triggers an addClass animation surrounding the addition of the provided CSS class(es). Upon
-         *   execution, the addClass operation will only be handled after the next digest and it will not trigger an
-         *   animation if element already contains the CSS class or if the class is removed at a later step.
-         *   Note that class-based animations are treated differently compared to structural animations
-         *   (like enter, move and leave) since the CSS classes may be added/removed at different points
-         *   depending if CSS or JavaScript animations are used.
-         *
-         * @param {Element} element the element which the CSS classes will be applied to
+         * Triggers an addClass animation surrounding the addition of the provided CSS class(es). Upon
+         * execution, the addClass operation will only be handled after the next digest and it will not trigger an
+         * animation if element already contains the CSS class or if the class is removed at a later step.
+         * Note that class-based animations are treated differently compared to structural animations
+         * (like enter, move and leave) since the CSS classes may be added/removed at different points
+         * depending if CSS or JavaScript animations are used.
+         *
+         * @param {JQLite} element the element which the CSS classes will be applied to
          * @param {string} className the CSS class(es) that will be added (multiple classes are separated via spaces)
-         * @param {object=} options an optional collection of options/styles that will be applied to the element.
-         *   The object can have the following properties:
-         *
-         *   - **removeClass** - `{string}` - space-separated CSS classes to remove from element
-         *   - **from** - `{Object}` - CSS properties & values at the beginning of animation. Must have matching `to`
-         *   - **to** - `{Object}` - CSS properties & values at end of animation. Must have matching `from`
-         *
-         * @return {Runner} animationRunner the animation runner
+         * @param {AnimationOptions} [options] an optional collection of options/styles that will be applied to the element.
+         * @return {import('./animate-runner').AnimateRunner}} animationRunner the animation runner
          */
         addClass(element, className, options) {
           options = prepareAnimateOptions(options);
-          options.addClass = mergeClasses(options.addclass, className);
+          options.addClass = mergeClasses(options.addClass, className);
           return $$animateQueue.push(element, "addClass", options);
         },
         /**
-         * @ngdoc method
-         * @name $animate#removeClass
-         * @kind function
-         *
-         * @description Triggers a removeClass animation surrounding the removal of the provided CSS class(es). Upon
-         *   execution, the removeClass operation will only be handled after the next digest and it will not trigger an
-         *   animation if element does not contain the CSS class or if the class is added at a later step.
-         *   Note that class-based animations are treated differently compared to structural animations
-         *   (like enter, move and leave) since the CSS classes may be added/removed at different points
-         *   depending if CSS or JavaScript animations are used.
-         *
-         * @param {Element} element the element which the CSS classes will be applied to
+         * Triggers a removeClass animation surrounding the removal of the provided CSS class(es). Upon
+         * execution, the removeClass operation will only be handled after the next digest and it will not trigger an
+         * animation if element does not contain the CSS class or if the class is added at a later step.
+         * Note that class-based animations are treated differently compared to structural animations
+         * (like enter, move and leave) since the CSS classes may be added/removed at different points
+         * depending if CSS or JavaScript animations are used.
+         *
+         * @param {JQLite} element the element which the CSS classes will be applied to
          * @param {string} className the CSS class(es) that will be removed (multiple classes are separated via spaces)
-         * @param {object=} options an optional collection of options/styles that will be applied to the element.
-         *   The object can have the following properties:
-         *
-         *   - **addClass** - `{string}` - space-separated CSS classes to add to element
-         *   - **from** - `{Object}` - CSS properties & values at the beginning of animation. Must have matching `to`
-         *   - **to** - `{Object}` - CSS properties & values at end of animation. Must have matching `from`
-         *
-         * @return {Runner} the animation runner
+         * @param {AnimationOptions} [options] an optional collection of options/styles that will be applied to the element.         *
+         * @return {import('./animate-runner').AnimateRunner} animationRunner the animation runner
          */
         removeClass(element, className, options) {
           options = prepareAnimateOptions(options);
@@ -743,29 +674,19 @@ export function AnimateProvider($provide) {
         },
         /**
-         * @ngdoc method
-         * @name $animate#setClass
-         * @kind function
-         *
-         * @description Performs both the addition and removal of a CSS classes on an element and (during the process)
-         *    triggers an animation surrounding the class addition/removal. Much like `$animate.addClass` and
-         *    `$animate.removeClass`, `setClass` will only evaluate the classes being added/removed once a digest has
-         *    passed. Note that class-based animations are treated differently compared to structural animations
-         *    (like enter, move and leave) since the CSS classes may be added/removed at different points
-         *    depending if CSS or JavaScript animations are used.
+         * Performs both the addition and removal of a CSS classes on an element and (during the process)
+         * triggers an animation surrounding the class addition/removal. Much like `$animate.addClass` and
+         * `$animate.removeClass`, `setClass` will only evaluate the classes being added/removed once a digest has
+         * passed. Note that class-based animations are treated differently compared to structural animations
+         * (like enter, move and leave) since the CSS classes may be added/removed at different points
+         * depending if CSS or JavaScript animations are used.
          *
          * @param {Element} element the element which the CSS classes will be applied to
          * @param {string} add the CSS class(es) that will be added (multiple classes are separated via spaces)
          * @param {string} remove the CSS class(es) that will be removed (multiple classes are separated via spaces)
          * @param {object=} options an optional collection of options/styles that will be applied to the element.
-         *   The object can have the following properties:
          *
-         *   - **addClass** - `{string}` - space-separated CSS classes to add to element
-         *   - **removeClass** - `{string}` - space-separated CSS classes to remove from element
-         *   - **from** - `{Object}` - CSS properties & values at the beginning of animation. Must have matching `to`
-         *   - **to** - `{Object}` - CSS properties & values at end of animation. Must have matching `from`
-         *
-         * @return {Runner} the animation runner
+         * @return {import('./animate-runner').AnimateRunner} the animation runner
          */
         setClass(element, add, remove, options) {
           options = prepareAnimateOptions(options);
@@ -775,11 +696,7 @@ export function AnimateProvider($provide) {
         },
         /**
-         * @ngdoc method
-         * @name $animate#animate
-         * @kind function
-         *
-         * @description Performs an inline animation on the element which applies the provided to and from CSS styles to the element.
+         * Performs an inline animation on the element which applies the provided to and from CSS styles to the element.
          * If any detected CSS transition, keyframe or JavaScript matches the provided className value, then the animation will take
          * on the provided styles. For example, if a transition animation is set for the given className, then the provided `from` and
          * `to` styles will be applied alongside the given transition. If the CSS style provided in `from` does not have a corresponding
@@ -797,22 +714,7 @@ export function AnimateProvider($provide) {
          *   }
          * });
          * ```
-         *
-         * @param {Element} element the element which the CSS styles will be applied to
-         * @param {object} from the from (starting) CSS styles that will be applied to the element and across the animation.
-         * @param {object} to the to (destination) CSS styles that will be applied to the element and across the animation.
-         * @param {string=} className an optional CSS class that will be applied to the element for the duration of the animation. If
-         *    this value is left as empty then a CSS class of `ng-inline-animate` will be applied to the element.
-         *    (Note that if no animation is detected then this value will not be applied to the element.)
-         * @param {object=} options an optional collection of options/styles that will be applied to the element.
-         *   The object can have the following properties:
-         *
-         *   - **addClass** - `{string}` - space-separated CSS classes to add to element
-         *   - **from** - `{Object}` - CSS properties & values at the beginning of animation. Must have matching `to`
-         *   - **removeClass** - `{string}` - space-separated CSS classes to remove from element
-         *   - **to** - `{Object}` - CSS properties & values at end of animation. Must have matching `from`
-         *
-         * @return {Runner} the animation runner
+         *  @return {import('./animate-runner').AnimateRunner} the animation runner
          */
         animate(element, from, to, className, options) {
           options = prepareAnimateOptions(options);

package/src/directive/if/if.js CHANGED Viewed

@@ -1,16 +1,22 @@
+import { domInsert } from "../../core/animate/animate";
 import { getBlockNodes } from "../../shared/jqlite/jqlite";
+import { hasAnimate } from "../../shared/utils";
-export const ngIfDirective = [
-  "$animate",
-  ($animate) => ({
+ngIfDirective.$inject = ["$animate"];
+export function ngIfDirective($animate) {
+  return {
     multiElement: true,
     transclude: "element",
     priority: 600,
     terminal: true,
     restrict: "A",
-    link($scope, $element, $attr, ctrl, $transclude) {
+    link($scope, $element, $attr, _ctrl, $transclude) {
+      /** @type {{clone: import("../../shared/jqlite/jqlite").JQLite }} */
       let block;
+      /** @type {import('../../core/scope/scope').Scope} */
       let childScope;
+      /** @type {import("../../shared/jqlite/jqlite").JQLite} */
       let previousElements;
       $scope.$watch($attr.ngIf, (value) => {
         if (value) {
@@ -25,7 +31,11 @@ export const ngIfDirective = [
               block = {
                 clone,
               };
-              $animate.enter(clone, $element.parent(), $element);
+              if (hasAnimate(clone[0])) {
+                $animate.enter(clone, $element.parent(), $element);
+              } else {
+                domInsert(clone, $element.parent(), $element);
+              }
             });
           }
         } else {
@@ -39,13 +49,17 @@ export const ngIfDirective = [
           }
           if (block) {
             previousElements = getBlockNodes(block.clone);
-            $animate.leave(previousElements).done((response) => {
-              if (response !== false) previousElements = null;
-            });
+            if (hasAnimate(previousElements[0])) {
+              $animate.leave(previousElements).done((response) => {
+                if (response !== false) previousElements = null;
+              });
+            } else {
+              previousElements.remove();
+            }
             block = null;
           }
         }
       });
     },
-  }),
-];
+  };
+}

package/src/directive/if/if.md CHANGED Viewed

@@ -26,8 +26,8 @@ is if an element's class attribute is directly modified after it's compiled, usi
 jQuery's `.addClass()` method, and the element is later removed. When `ngIf` recreates the element
 the added class will be lost because the original compiled state is used to regenerate the element.
-Additionally, you can provide animations via the `ngAnimate` module to animate the `enter`
-and `leave` effects.
+Additionally, the `enter` and `leave` animation effects can be enabled for the element by
+setting data attribute (`data-*`) or custom attribute `animate` to `true` attribute.
 @animations
 | Animation | Occurs |

package/src/shared/utils.js CHANGED Viewed

@@ -1255,3 +1255,26 @@ export function directiveNormalize(name) {
       offset ? letter.toUpperCase() : letter,
     );
 }
+/**
+ * Whether element should be animated
+ * @param {Node} node
+ * @returns {boolean}
+ */
+export function hasAnimate(node) {
+  return hasCustomOrDataAttribute(node, "animate");
+}
+/**
+ * @ignore
+ * @param {Node} node
+ * @param {string} attr
+ * @returns {boolean}
+ */
+function hasCustomOrDataAttribute(node, attr) {
+  if (node.nodeType !== Node.ELEMENT_NODE) return false;
+  const element = /** @type {HTMLElement} */ (node);
+  return (
+    element.dataset[attr] === "true" || element.getAttribute(attr) === "true"
+  );
+}