@breadstone/mosaik-elements-foundation 0.0.12-beta.0

package/Accesability/Platform.d.ts

@@ -0,0 +1,35 @@
+/**
+ * @public
+ */
+export type PlatformType = 'browser' | 'desktop' | 'mobile';
+/**
+ * @public
+ */
+export declare namespace Platform {
+    namespace Browser {
+        function isIE(window: Window): boolean;
+        function isEdge(window: Window): boolean;
+        function isFireFox(window: Window): boolean;
+        function isChrome(window: Window): boolean;
+        function isOpera(window: Window): boolean;
+        function isSafari(window: Window): boolean;
+    }
+    /**
+     * @public
+     */
+    function isMobile(window: Window): boolean;
+    /**
+     * @public
+     */
+    function isDesktop(window: Window): boolean;
+    /**
+     * @public
+     */
+    function isWebApp(): boolean;
+}
+declare global {
+    interface Navigator {
+        standalone: boolean;
+    }
+}
+//# sourceMappingURL=Platform.d.ts.map

package/Accesability/Platform.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Platform.d.ts","sourceRoot":"","sources":["../../src/Accesability/Platform.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAI5D;;GAEG;AACH,yBAAiB,QAAQ,CAAC;IAEtB,UAAiB,OAAO,CAAC;QAErB,SAAgB,IAAI,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAE5C;QAED,SAAgB,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAE9C;QAED,SAAgB,SAAS,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAEjD;QAED,SAAgB,QAAQ,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAEhD;QAED,SAAgB,OAAO,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAE/C;QAED,SAAgB,QAAQ,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAGhD;KAEJ;IAED;;OAEG;IACH,SAAgB,QAAQ,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAEhD;IAED;;OAEG;IACH,SAAgB,SAAS,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAEjD;IAED;;OAEG;IACH,SAAgB,QAAQ,IAAI,OAAO,CAKlC;CAEJ;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,SAAS;QACf,UAAU,EAAE,OAAO,CAAC;KACvB;CACJ"}

package/Accesability/Platform.js

@@ -0,0 +1,60 @@
+// #region Imports
+// #endregion
+/**
+ * @public
+ */
+export var Platform;
+(function (Platform) {
+    let Browser;
+    (function (Browser) {
+        function isIE(window) {
+            return window.navigator.userAgent.indexOf('MSIE ') > 0 || window.navigator.userAgent.indexOf('Trident/') > 0;
+        }
+        Browser.isIE = isIE;
+        function isEdge(window) {
+            return window.navigator.userAgent.includes('Edge');
+        }
+        Browser.isEdge = isEdge;
+        function isFireFox(window) {
+            return window.navigator.userAgent.toLowerCase().includes('firefox');
+        }
+        Browser.isFireFox = isFireFox;
+        function isChrome(window) {
+            return 'chrome' in window;
+        }
+        Browser.isChrome = isChrome;
+        function isOpera(window) {
+            return ('opr' in window) || 'opera' in window || navigator.userAgent.includes(' OPR/');
+        }
+        Browser.isOpera = isOpera;
+        function isSafari(window) {
+            // @ts-ignore allow HTMLElement and Safari
+            return (/constructor/i).test(window.HTMLElement) || ((p) => p.toString() === '[object SafariRemoteNotification]')(!window.safari || (typeof safari !== 'undefined' && safari.pushNotification));
+        }
+        Browser.isSafari = isSafari;
+    })(Browser = Platform.Browser || (Platform.Browser = {}));
+    /**
+     * @public
+     */
+    function isMobile(window) {
+        return (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i).test(window.navigator.userAgent);
+    }
+    Platform.isMobile = isMobile;
+    /**
+     * @public
+     */
+    function isDesktop(window) {
+        return window.navigator.userAgent.includes('Electron');
+    }
+    Platform.isDesktop = isDesktop;
+    /**
+     * @public
+     */
+    function isWebApp() {
+        const isInWebAppiOS = window.navigator.standalone;
+        const isInWebAppChrome = window.matchMedia('(display-mode: standalone)').matches;
+        return isInWebAppiOS || isInWebAppChrome;
+    }
+    Platform.isWebApp = isWebApp;
+})(Platform || (Platform = {}));
+//# sourceMappingURL=Platform.js.map

package/Accesability/Platform.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Platform.js","sourceRoot":"","sources":["../../src/Accesability/Platform.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAOlB,aAAa;AAEb;;GAEG;AACH,MAAM,KAAW,QAAQ,CAuDxB;AAvDD,WAAiB,QAAQ;IAErB,IAAiB,OAAO,CA2BvB;IA3BD,WAAiB,OAAO;QAEpB,SAAgB,IAAI,CAAC,MAAc;YAC/B,OAAO,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,OAAO,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC;QACjH,CAAC;QAFe,YAAI,OAEnB,CAAA;QAED,SAAgB,MAAM,CAAC,MAAc;YACjC,OAAO,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;QACvD,CAAC;QAFe,cAAM,SAErB,CAAA;QAED,SAAgB,SAAS,CAAC,MAAc;YACpC,OAAO,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;QACxE,CAAC;QAFe,iBAAS,YAExB,CAAA;QAED,SAAgB,QAAQ,CAAC,MAAc;YACnC,OAAO,QAAQ,IAAI,MAAM,CAAC;QAC9B,CAAC;QAFe,gBAAQ,WAEvB,CAAA;QAED,SAAgB,OAAO,CAAC,MAAc;YAClC,OAAO,CAAC,KAAK,IAAI,MAAM,CAAC,IAAI,OAAO,IAAI,MAAM,IAAI,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;QAC3F,CAAC;QAFe,eAAO,UAEtB,CAAA;QAED,SAAgB,QAAQ,CAAC,MAAc;YACnC,0CAA0C;YAC1C,OAAO,CAAC,cAAc,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAM,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,EAAE,KAAK,mCAAmC,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,IAAI,CAAC,OAAO,MAAM,KAAK,WAAW,IAAI,MAAM,CAAC,gBAAgB,CAAC,CAAC,CAAC;QACzM,CAAC;QAHe,gBAAQ,WAGvB,CAAA;IAEL,CAAC,EA3BgB,OAAO,GAAP,gBAAO,KAAP,gBAAO,QA2BvB;IAED;;OAEG;IACH,SAAgB,QAAQ,CAAC,MAAc;QACnC,OAAO,CAAC,gEAAgE,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;IAC/G,CAAC;IAFe,iBAAQ,WAEvB,CAAA;IAED;;OAEG;IACH,SAAgB,SAAS,CAAC,MAAc;QACpC,OAAO,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;IAC3D,CAAC;IAFe,kBAAS,YAExB,CAAA;IAED;;OAEG;IACH,SAAgB,QAAQ;QACpB,MAAM,aAAa,GAAG,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC;QAClD,MAAM,gBAAgB,GAAG,MAAM,CAAC,UAAU,CAAC,4BAA4B,CAAC,CAAC,OAAO,CAAC;QAEjF,OAAO,aAAa,IAAI,gBAAgB,CAAC;IAC7C,CAAC;IALe,iBAAQ,WAKvB,CAAA;AAEL,CAAC,EAvDgB,QAAQ,KAAR,QAAQ,QAuDxB"}

package/Animations/AnimationEasings.d.ts

@@ -0,0 +1,31 @@
+export declare enum EaseIn {
+    Quad = "cubic-bezier(0.550, 0.085, 0.680, 0.530)",
+    Cubic = "cubic-bezier(0.550, 0.055, 0.675, 0.190)",
+    Quart = "cubic-bezier(0.895, 0.030, 0.685, 0.220)",
+    Quint = "cubic-bezier(0.755, 0.050, 0.855, 0.060)",
+    Sine = "cubic-bezier(0.470, 0.000, 0.745, 0.715)",
+    Expo = "cubic-bezier(0.950, 0.050, 0.795, 0.035)",
+    Circ = "cubic-bezier(0.600, 0.040, 0.980, 0.335)",
+    Back = "cubic-bezier(0.600, -0.280, 0.735, 0.045)"
+}
+export declare enum EaseOut {
+    Quad = "cubic-bezier(0.250, 0.460, 0.450, 0.940)",
+    Cubic = "cubic-bezier(0.215, 0.610, 0.355, 1.000)",
+    Quart = "cubic-bezier(0.165, 0.840, 0.440, 1.000)",
+    Quint = "cubic-bezier(0.230, 1.000, 0.320, 1.000)",
+    Sine = "cubic-bezier(0.390, 0.575, 0.565, 1.000)",
+    Expo = "cubic-bezier(0.190, 1.000, 0.220, 1.000)",
+    Circ = "cubic-bezier(0.075, 0.820, 0.165, 1.000)",
+    Back = "cubic-bezier(0.175, 0.885, 0.320, 1.275)"
+}
+export declare enum EaseInOut {
+    Quad = "cubic-bezier(0.455, 0.030, 0.515, 0.955)",
+    Cubic = "cubic-bezier(0.645, 0.045, 0.355, 1.000)",
+    Quart = "cubic-bezier(0.770, 0.000, 0.175, 1.000)",
+    Quint = "cubic-bezier(0.860, 0.000, 0.070, 1.000)",
+    Sine = "cubic-bezier(0.445, 0.050, 0.550, 0.950)",
+    Expo = "cubic-bezier(1.000, 0.000, 0.000, 1.000)",
+    Circ = "cubic-bezier(0.785, 0.135, 0.150, 0.860)",
+    Back = "cubic-bezier(0.680, -0.550, 0.265, 1.550)"
+}
+//# sourceMappingURL=AnimationEasings.d.ts.map

package/Animations/AnimationEasings.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimationEasings.d.ts","sourceRoot":"","sources":["../../src/Animations/AnimationEasings.ts"],"names":[],"mappings":"AAAA,oBAAY,MAAM;IACd,IAAI,6CAA6C;IACjD,KAAK,6CAA6C;IAClD,KAAK,6CAA6C;IAClD,KAAK,6CAA6C;IAClD,IAAI,6CAA6C;IACjD,IAAI,6CAA6C;IACjD,IAAI,6CAA6C;IACjD,IAAI,8CAA8C;CACrD;AAED,oBAAY,OAAO;IACf,IAAI,6CAA6C;IACjD,KAAK,6CAA6C;IAClD,KAAK,6CAA6C;IAClD,KAAK,6CAA6C;IAClD,IAAI,6CAA6C;IACjD,IAAI,6CAA6C;IACjD,IAAI,6CAA6C;IACjD,IAAI,6CAA6C;CACpD;AAED,oBAAY,SAAS;IACjB,IAAI,6CAA6C;IACjD,KAAK,6CAA6C;IAClD,KAAK,6CAA6C;IAClD,KAAK,6CAA6C;IAClD,IAAI,6CAA6C;IACjD,IAAI,6CAA6C;IACjD,IAAI,6CAA6C;IACjD,IAAI,8CAA8C;CACrD"}

package/Animations/AnimationEasings.js

@@ -0,0 +1,34 @@
+export var EaseIn;
+(function (EaseIn) {
+    EaseIn["Quad"] = "cubic-bezier(0.550, 0.085, 0.680, 0.530)";
+    EaseIn["Cubic"] = "cubic-bezier(0.550, 0.055, 0.675, 0.190)";
+    EaseIn["Quart"] = "cubic-bezier(0.895, 0.030, 0.685, 0.220)";
+    EaseIn["Quint"] = "cubic-bezier(0.755, 0.050, 0.855, 0.060)";
+    EaseIn["Sine"] = "cubic-bezier(0.470, 0.000, 0.745, 0.715)";
+    EaseIn["Expo"] = "cubic-bezier(0.950, 0.050, 0.795, 0.035)";
+    EaseIn["Circ"] = "cubic-bezier(0.600, 0.040, 0.980, 0.335)";
+    EaseIn["Back"] = "cubic-bezier(0.600, -0.280, 0.735, 0.045)";
+})(EaseIn || (EaseIn = {}));
+export var EaseOut;
+(function (EaseOut) {
+    EaseOut["Quad"] = "cubic-bezier(0.250, 0.460, 0.450, 0.940)";
+    EaseOut["Cubic"] = "cubic-bezier(0.215, 0.610, 0.355, 1.000)";
+    EaseOut["Quart"] = "cubic-bezier(0.165, 0.840, 0.440, 1.000)";
+    EaseOut["Quint"] = "cubic-bezier(0.230, 1.000, 0.320, 1.000)";
+    EaseOut["Sine"] = "cubic-bezier(0.390, 0.575, 0.565, 1.000)";
+    EaseOut["Expo"] = "cubic-bezier(0.190, 1.000, 0.220, 1.000)";
+    EaseOut["Circ"] = "cubic-bezier(0.075, 0.820, 0.165, 1.000)";
+    EaseOut["Back"] = "cubic-bezier(0.175, 0.885, 0.320, 1.275)";
+})(EaseOut || (EaseOut = {}));
+export var EaseInOut;
+(function (EaseInOut) {
+    EaseInOut["Quad"] = "cubic-bezier(0.455, 0.030, 0.515, 0.955)";
+    EaseInOut["Cubic"] = "cubic-bezier(0.645, 0.045, 0.355, 1.000)";
+    EaseInOut["Quart"] = "cubic-bezier(0.770, 0.000, 0.175, 1.000)";
+    EaseInOut["Quint"] = "cubic-bezier(0.860, 0.000, 0.070, 1.000)";
+    EaseInOut["Sine"] = "cubic-bezier(0.445, 0.050, 0.550, 0.950)";
+    EaseInOut["Expo"] = "cubic-bezier(1.000, 0.000, 0.000, 1.000)";
+    EaseInOut["Circ"] = "cubic-bezier(0.785, 0.135, 0.150, 0.860)";
+    EaseInOut["Back"] = "cubic-bezier(0.680, -0.550, 0.265, 1.550)";
+})(EaseInOut || (EaseInOut = {}));
+//# sourceMappingURL=AnimationEasings.js.map

package/Animations/AnimationEasings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimationEasings.js","sourceRoot":"","sources":["../../src/Animations/AnimationEasings.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,MASX;AATD,WAAY,MAAM;IACd,2DAAiD,CAAA;IACjD,4DAAkD,CAAA;IAClD,4DAAkD,CAAA;IAClD,4DAAkD,CAAA;IAClD,2DAAiD,CAAA;IACjD,2DAAiD,CAAA;IACjD,2DAAiD,CAAA;IACjD,4DAAkD,CAAA;AACtD,CAAC,EATW,MAAM,KAAN,MAAM,QASjB;AAED,MAAM,CAAN,IAAY,OASX;AATD,WAAY,OAAO;IACf,4DAAiD,CAAA;IACjD,6DAAkD,CAAA;IAClD,6DAAkD,CAAA;IAClD,6DAAkD,CAAA;IAClD,4DAAiD,CAAA;IACjD,4DAAiD,CAAA;IACjD,4DAAiD,CAAA;IACjD,4DAAiD,CAAA;AACrD,CAAC,EATW,OAAO,KAAP,OAAO,QASlB;AAED,MAAM,CAAN,IAAY,SASX;AATD,WAAY,SAAS;IACjB,8DAAiD,CAAA;IACjD,+DAAkD,CAAA;IAClD,+DAAkD,CAAA;IAClD,+DAAkD,CAAA;IAClD,8DAAiD,CAAA;IACjD,8DAAiD,CAAA;IACjD,8DAAiD,CAAA;IACjD,+DAAkD,CAAA;AACtD,CAAC,EATW,SAAS,KAAT,SAAS,QASpB"}

package/Animations/AnimationPlayer.d.ts

@@ -0,0 +1,12 @@
+import type { IAnimationReferenceMetadata } from './Types';
+/**
+ * @public
+ */
+export declare class AnimationPlayer {
+    private readonly _target;
+    constructor(target: HTMLElement);
+    play(metadata: IAnimationReferenceMetadata): Promise<AnimationPlaybackEvent>;
+    stopAll(): Promise<unknown>;
+    private parseKeyframes;
+}
+//# sourceMappingURL=AnimationPlayer.d.ts.map

package/Animations/AnimationPlayer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimationPlayer.d.ts","sourceRoot":"","sources":["../../src/Animations/AnimationPlayer.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,SAAS,CAAC;AAI3D;;GAEG;AACH,qBAAa,eAAe;IAIxB,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAc;gBAMnB,MAAM,EAAE,WAAW;IAMzB,IAAI,CAAC,QAAQ,EAAE,2BAA2B,GAAG,OAAO,CAAC,sBAAsB,CAAC;IAqBlF,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC;IAiBlC,OAAO,CAAC,cAAc;CAgBzB"}

package/Animations/AnimationPlayer.js

@@ -0,0 +1,58 @@
+// #region Imports
+// #endregion
+/**
+ * @public
+ */
+export class AnimationPlayer {
+    // #region Fields
+    _target;
+    // #endregion
+    // #region Ctor
+    constructor(target) {
+        this._target = target;
+    }
+    // #endregion
+    async play(metadata) {
+        return new Promise((resolve) => {
+            if (metadata.options?.duration === Infinity) {
+                throw new Error('Promise-based animations must be finite.');
+            }
+            const parsedKeyframes = this.parseKeyframes(metadata.steps);
+            const options = {
+                ...metadata.options,
+                duration: window.matchMedia('(prefers-reduced-motion: reduce)').matches
+                    ? 0
+                    : metadata.options?.duration
+            };
+            const animation = this._target.animate(parsedKeyframes, options);
+            animation.addEventListener('cancel', resolve, { once: true });
+            animation.addEventListener('finish', resolve, { once: true });
+        });
+    }
+    stopAll() {
+        return Promise.all(this._target.getAnimations().map((animation) => new Promise((resolve) => {
+            const handleAnimationEvent = () => requestAnimationFrame(resolve);
+            animation.addEventListener('cancel', handleAnimationEvent, {
+                once: true
+            });
+            animation.addEventListener('finish', handleAnimationEvent, {
+                once: true
+            });
+            animation.cancel();
+        })));
+    }
+    parseKeyframes(keyframes) {
+        return keyframes.map((keyframe) => {
+            if (!keyframe.height) {
+                return keyframe;
+            }
+            return {
+                ...keyframe,
+                height: keyframe.height === 'auto'
+                    ? `${this._target.scrollHeight}px`
+                    : keyframe.height
+            };
+        });
+    }
+}
+//# sourceMappingURL=AnimationPlayer.js.map

package/Animations/AnimationPlayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimationPlayer.js","sourceRoot":"","sources":["../../src/Animations/AnimationPlayer.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAIlB,aAAa;AAEb;;GAEG;AACH,MAAM,OAAO,eAAe;IAExB,iBAAiB;IAEA,OAAO,CAAc;IAEtC,aAAa;IAEb,eAAe;IAEf,YAAmB,MAAmB;QAClC,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;IAC1B,CAAC;IAED,aAAa;IAEN,KAAK,CAAC,IAAI,CAAC,QAAqC;QACnD,OAAO,IAAI,OAAO,CAAyB,CAAC,OAAO,EAAE,EAAE;YACnD,IAAI,QAAQ,CAAC,OAAO,EAAE,QAAQ,KAAK,QAAQ,EAAE,CAAC;gBAC1C,MAAM,IAAI,KAAK,CAAC,0CAA0C,CAAC,CAAC;YAChE,CAAC;YAED,MAAM,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;YAC5D,MAAM,OAAO,GAAG;gBACZ,GAAG,QAAQ,CAAC,OAAO;gBACnB,QAAQ,EAAE,MAAM,CAAC,UAAU,CAAC,kCAAkC,CAAC,CAAC,OAAO;oBACnE,CAAC,CAAC,CAAC;oBACH,CAAC,CAAC,QAAQ,CAAC,OAAO,EAAE,QAAQ;aACnC,CAAC;YAEF,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,eAAe,EAAE,OAAO,CAAC,CAAC;YAEjE,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;YAC9D,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;QAClE,CAAC,CAAC,CAAC;IACP,CAAC;IAEM,OAAO;QACV,OAAO,OAAO,CAAC,GAAG,CACd,IAAI,CAAC,OAAO,CAAC,aAAa,EAAE,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;YACpE,MAAM,oBAAoB,GAAG,GAAW,EAAE,CAAC,qBAAqB,CAAC,OAAO,CAAC,CAAC;YAE1E,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,oBAAoB,EAAE;gBACvD,IAAI,EAAE,IAAI;aACb,CAAC,CAAC;YACH,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,oBAAoB,EAAE;gBACvD,IAAI,EAAE,IAAI;aACb,CAAC,CAAC;YAEH,SAAS,CAAC,MAAM,EAAE,CAAC;QACvB,CAAC,CAAC,CAAC,CACN,CAAC;IACN,CAAC;IAEO,cAAc,CAAC,SAA0B;QAC7C,OAAO,SAAS,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE;YAC9B,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;gBACnB,OAAO,QAAQ,CAAC;YACpB,CAAC;YAED,OAAO;gBACH,GAAG,QAAQ;gBACX,MAAM,EACF,QAAQ,CAAC,MAAM,KAAK,MAAM;oBACtB,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,IAAI;oBAClC,CAAC,CAAC,QAAQ,CAAC,MAAM;aAC5B,CAAC;QACN,CAAC,CAAC,CAAC;IACP,CAAC;CAEJ"}

package/Animations/AnimationPlayer2.d.ts

@@ -0,0 +1,22 @@
+/**
+ * The `AnimationPlayer2` class.
+ *
+ * @public
+ */
+export declare class AnimationPlayer2 {
+    /**
+     * Constructs a new instance of the `MotionManager` class.
+     *
+     * @public
+     */
+    constructor();
+    /**
+     * @public
+     */
+    play(element: HTMLElement, props: PropertyIndexedKeyframes, options?: number | KeyframeAnimationOptions): Promise<AnimationPlaybackEvent>;
+    /**
+     * @private
+     */
+    private applyAnimation;
+}
+//# sourceMappingURL=AnimationPlayer2.d.ts.map

package/Animations/AnimationPlayer2.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimationPlayer2.d.ts","sourceRoot":"","sources":["../../src/Animations/AnimationPlayer2.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,qBAAa,gBAAgB;IAIzB;;;;OAIG;;IAQH;;OAEG;IACI,IAAI,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,wBAAwB,EAAE,OAAO,CAAC,EAAE,MAAM,GAAG,wBAAwB,GAAG,OAAO,CAAC,sBAAsB,CAAC;IAahJ;;OAEG;IACH,OAAO,CAAC,cAAc;CAazB"}

package/Animations/AnimationPlayer2.js

@@ -0,0 +1,41 @@
+/**
+ * The `AnimationPlayer2` class.
+ *
+ * @public
+ */
+export class AnimationPlayer2 {
+    // #region Ctor
+    /**
+     * Constructs a new instance of the `MotionManager` class.
+     *
+     * @public
+     */
+    constructor() {
+    }
+    // #endregion
+    // #region Methods
+    /**
+     * @public
+     */
+    play(element, props, options) {
+        const animation = element.animate(props, options);
+        return new Promise((resolve) => {
+            animation.addEventListener('finish', (x) => {
+                this.applyAnimation(element, props);
+                resolve(x);
+            }, { once: true });
+            animation.play();
+        });
+    }
+    /**
+     * @private
+     */
+    applyAnimation(element, prop) {
+        Object.entries(prop).forEach(([k, v]) => {
+            if (k in element.style) {
+                element.style.setProperty(k, v?.toString() ?? '');
+            }
+        });
+    }
+}
+//# sourceMappingURL=AnimationPlayer2.js.map

package/Animations/AnimationPlayer2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimationPlayer2.js","sourceRoot":"","sources":["../../src/Animations/AnimationPlayer2.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,OAAO,gBAAgB;IAEzB,eAAe;IAEf;;;;OAIG;IACH;IACA,CAAC;IAED,aAAa;IAEb,kBAAkB;IAElB;;OAEG;IACI,IAAI,CAAC,OAAoB,EAAE,KAA+B,EAAE,OAA2C;QAC1G,MAAM,SAAS,GAAG,OAAO,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;QAElD,OAAO,IAAI,OAAO,CAAyB,CAAC,OAAO,EAAE,EAAE;YACnD,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;gBACvC,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;gBACpC,OAAO,CAAC,CAAC,CAAC,CAAC;YACf,CAAC,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;YAEnB,SAAS,CAAC,IAAI,EAAE,CAAC;QACrB,CAAC,CAAC,CAAC;IACP,CAAC;IAED;;OAEG;IACK,cAAc,CAAC,OAAoB,EAAE,IAA8B;QACvE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAC1B,CAAC,EACD,CAAC,CACJ,EAAE,EAAE;YACD,IAAI,CAAC,IAAI,OAAO,CAAC,KAAK,EAAE,CAAC;gBACrB,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;YACtD,CAAC;QACL,CAAC,CAAC,CAAC;IACP,CAAC;CAIJ"}

package/Animations/Directives/Animate.d.ts

@@ -0,0 +1,11 @@
+import type { IAnimateOptions } from './IAnimateOptions';
+export declare namespace Animate {
+    const fadeIn: IAnimateOptions;
+    const fadeOut: IAnimateOptions;
+    const slideInTop: IAnimateOptions;
+    const slideInBottom: IAnimateOptions;
+    const slideInLeft: IAnimateOptions;
+    const slideInRight: IAnimateOptions;
+    const rotate: IAnimateOptions;
+}
+//# sourceMappingURL=Animate.d.ts.map

package/Animations/Directives/Animate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Animate.d.ts","sourceRoot":"","sources":["../../../src/Animations/Directives/Animate.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAIzD,yBAAiB,OAAO,CAAC;IAId,MAAM,MAAM,EAAE,eAQpB,CAAC;IAEK,MAAM,OAAO,EAAE,eAQrB,CAAC;IAMK,MAAM,UAAU,EAAE,eASxB,CAAC;IAEK,MAAM,aAAa,EAAE,eAS3B,CAAC;IAEK,MAAM,WAAW,EAAE,eASzB,CAAC;IAEK,MAAM,YAAY,EAAE,eAS1B,CAAC;IAMK,MAAM,MAAM,EAAE,eAGpB,CAAC;CAIL"}

package/Animations/Directives/Animate.js

@@ -0,0 +1,75 @@
+// #region Imports
+import { EaseInOut } from '../AnimationEasings';
+// #endregion
+export var Animate;
+(function (Animate) {
+    // #region Fade
+    Animate.fadeIn = {
+        from: { opacity: 0 },
+        to: { opacity: 1 },
+        options: {
+            delay: 0,
+            duration: 1000,
+            easing: EaseInOut.Quad
+        }
+    };
+    Animate.fadeOut = {
+        from: { opacity: 1 },
+        to: { opacity: 0 },
+        options: {
+            delay: 0,
+            duration: 1000,
+            easing: EaseInOut.Quad
+        }
+    };
+    // #endregion
+    // #region Slide
+    Animate.slideInTop = {
+        from: {
+            opacity: 0,
+            transform: 'translateY(-16px)'
+        },
+        to: {
+            opacity: 1,
+            transform: 'translateY(0)'
+        }
+    };
+    Animate.slideInBottom = {
+        from: {
+            opacity: 0,
+            transform: 'translateY(16px)'
+        },
+        to: {
+            opacity: 1,
+            transform: 'translateY(0)'
+        }
+    };
+    Animate.slideInLeft = {
+        from: {
+            opacity: 0,
+            transform: 'translateX(-16px)'
+        },
+        to: {
+            opacity: 1,
+            transform: 'translateX(0)'
+        }
+    };
+    Animate.slideInRight = {
+        from: {
+            opacity: 0,
+            transform: 'translateX(16px)'
+        },
+        to: {
+            opacity: 1,
+            transform: 'translateX(0)'
+        }
+    };
+    // #endregion
+    // #region Rotate
+    Animate.rotate = {
+        from: { transform: 'rotate(0deg)' },
+        to: { transform: 'rotate(360deg)' }
+    };
+    // #endregion
+})(Animate || (Animate = {}));
+//# sourceMappingURL=Animate.js.map

package/Animations/Directives/Animate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Animate.js","sourceRoot":"","sources":["../../../src/Animations/Directives/Animate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAGhD,aAAa;AAEb,MAAM,KAAW,OAAO,CAmFvB;AAnFD,WAAiB,OAAO;IAEpB,eAAe;IAEF,cAAM,GAAoB;QACnC,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;QACpB,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;QAClB,OAAO,EAAE;YACL,KAAK,EAAE,CAAC;YACR,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,SAAS,CAAC,IAAI;SACzB;KACJ,CAAC;IAEW,eAAO,GAAoB;QACpC,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;QACpB,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;QAClB,OAAO,EAAE;YACL,KAAK,EAAE,CAAC;YACR,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,SAAS,CAAC,IAAI;SACzB;KACJ,CAAC;IAEF,aAAa;IAEb,gBAAgB;IAEH,kBAAU,GAAoB;QACvC,IAAI,EAAE;YACF,OAAO,EAAE,CAAC;YACV,SAAS,EAAE,mBAAmB;SACjC;QACD,EAAE,EAAE;YACA,OAAO,EAAE,CAAC;YACV,SAAS,EAAE,eAAe;SAC7B;KACJ,CAAC;IAEW,qBAAa,GAAoB;QAC1C,IAAI,EAAE;YACF,OAAO,EAAE,CAAC;YACV,SAAS,EAAE,kBAAkB;SAChC;QACD,EAAE,EAAE;YACA,OAAO,EAAE,CAAC;YACV,SAAS,EAAE,eAAe;SAC7B;KACJ,CAAC;IAEW,mBAAW,GAAoB;QACxC,IAAI,EAAE;YACF,OAAO,EAAE,CAAC;YACV,SAAS,EAAE,mBAAmB;SACjC;QACD,EAAE,EAAE;YACA,OAAO,EAAE,CAAC;YACV,SAAS,EAAE,eAAe;SAC7B;KACJ,CAAC;IAEW,oBAAY,GAAoB;QACzC,IAAI,EAAE;YACF,OAAO,EAAE,CAAC;YACV,SAAS,EAAE,kBAAkB;SAChC;QACD,EAAE,EAAE;YACA,OAAO,EAAE,CAAC;YACV,SAAS,EAAE,eAAe;SAC7B;KACJ,CAAC;IAEF,aAAa;IAEb,iBAAiB;IAEJ,cAAM,GAAoB;QACnC,IAAI,EAAE,EAAE,SAAS,EAAE,cAAc,EAAE;QACnC,EAAE,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE;KACtC,CAAC;IAEF,aAAa;AAEjB,CAAC,EAnFgB,OAAO,KAAP,OAAO,QAmFvB"}

package/Animations/Directives/AnimateDirective.d.ts

@@ -0,0 +1,27 @@
+import { type AsyncDirectiveArgs, AsyncDirectiveBase } from '../../Controls/Directives/Abstracts/AsyncDirectiveBase';
+import { type IAnimationRef } from './AnimationRefDirective';
+import type { IAnimateOptions } from './IAnimateOptions';
+/**
+ * The `AnimateDirective` class.
+ *
+ * @public
+ */
+export declare class AnimateDirective extends AsyncDirectiveBase {
+    private readonly _animationPlayer;
+    private _wasTriggered;
+    /**
+     * Constructs a new instance of the `AnimateDirective` class.
+     *
+     * @public
+     */
+    constructor(args: AsyncDirectiveArgs);
+    /**
+     * @public
+     */
+    render(optionsOrRef: (IAnimateOptions & {
+        trigger?: (cb: () => void) => void;
+    }) | IAnimationRef): unknown;
+    private play;
+}
+export declare const animate: (...values: Parameters<AnimateDirective["render"]>) => any;
+//# sourceMappingURL=AnimateDirective.d.ts.map

package/Animations/Directives/AnimateDirective.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimateDirective.d.ts","sourceRoot":"","sources":["../../../src/Animations/Directives/AnimateDirective.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,kBAAkB,EAAE,kBAAkB,EAAqB,MAAM,wDAAwD,CAAC;AAGxI,OAAO,EAAE,KAAK,aAAa,EAAkB,MAAM,yBAAyB,CAAC;AAC7E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAIzD;;;;GAIG;AACH,qBAAa,gBAAiB,SAAQ,kBAAkB;IAIpD,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAmB;IACpD,OAAO,CAAC,aAAa,CAAU;IAM/B;;;;OAIG;gBACgB,IAAI,EAAE,kBAAkB;IAe3C;;OAEG;IACI,MAAM,CAAC,YAAY,EAAE,CAAC,eAAe,GAAG;QAAE,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,IAAI,KAAK,IAAI,CAAA;KAAE,CAAC,GAAG,aAAa,GAAG,OAAO;IAmChH,OAAO,CAAC,IAAI;CAcf;AAED,eAAO,MAAM,OAAO,EAAuC,CAAC,GAAG,MAAM,EAAE,UAAU,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC,KAAK,GAAG,CAAC"}

package/Animations/Directives/AnimateDirective.js

@@ -0,0 +1,80 @@
+/* eslint-disable @typescript-eslint/consistent-return */
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/no-unnecessary-condition */
+// #region Imports
+import { AsyncDirectiveBase, PartType, compose } from '../../Controls/Directives/Abstracts/AsyncDirectiveBase';
+import { nothing } from '../../Dom/Html';
+import { AnimationPlayer2 } from '../AnimationPlayer2';
+import { isAnimationRef } from './AnimationRefDirective';
+// #endregion
+/**
+ * The `AnimateDirective` class.
+ *
+ * @public
+ */
+export class AnimateDirective extends AsyncDirectiveBase {
+    // #region Fields
+    _animationPlayer;
+    _wasTriggered;
+    // #endregion
+    // #region Ctor
+    /**
+     * Constructs a new instance of the `AnimateDirective` class.
+     *
+     * @public
+     */
+    constructor(args) {
+        super(args);
+        if (args.type !== PartType.ELEMENT) {
+            throw new Error('The `animate` directive must be used in attribute position.');
+        }
+        this._wasTriggered = false;
+        this._animationPlayer = new AnimationPlayer2();
+    }
+    // #endregion
+    // #region Methods
+    /**
+     * @public
+     */
+    render(optionsOrRef) {
+        if (!this._wasTriggered) {
+            this._wasTriggered = true;
+            if (isAnimationRef(optionsOrRef)) {
+                return;
+            }
+            Object.entries({
+                ...optionsOrRef.from,
+                ...optionsOrRef.initial,
+                ...{}
+            }).forEach(([k, v]) => {
+                if (k in this.internals.element.style) {
+                    this.internals.element.style.setProperty(k, v?.toString() ?? '');
+                }
+            });
+            if (optionsOrRef.to) {
+                if (optionsOrRef.trigger) {
+                    optionsOrRef.trigger(() => {
+                        this.play(optionsOrRef);
+                    });
+                }
+                else {
+                    this.play(optionsOrRef);
+                }
+            }
+        }
+        return nothing;
+    }
+    play(options) {
+        void this._animationPlayer.play(this.internals.element, options.to, {
+            ...{
+                duration: 333,
+                easing: 'ease'
+            },
+            ...options.options
+        }).then(() => {
+            options.onFinished?.();
+        });
+    }
+}
+export const animate = compose(AnimateDirective);
+//# sourceMappingURL=AnimateDirective.js.map

package/Animations/Directives/AnimateDirective.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimateDirective.js","sourceRoot":"","sources":["../../../src/Animations/Directives/AnimateDirective.ts"],"names":[],"mappings":"AAAA,yDAAyD;AACzD,uDAAuD;AACvD,gEAAgE;AAChE,kBAAkB;AAElB,OAAO,EAA2B,kBAAkB,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,wDAAwD,CAAC;AACxI,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAsB,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAG7E,aAAa;AAEb;;;;GAIG;AACH,MAAM,OAAO,gBAAiB,SAAQ,kBAAkB;IAEpD,iBAAiB;IAEA,gBAAgB,CAAmB;IAC5C,aAAa,CAAU;IAE/B,aAAa;IAEb,eAAe;IAEf;;;;OAIG;IACH,YAAmB,IAAwB;QACvC,KAAK,CAAC,IAAI,CAAC,CAAC;QAEZ,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,OAAO,EAAE,CAAC;YACjC,MAAM,IAAI,KAAK,CAAC,6DAA6D,CAAC,CAAC;QACnF,CAAC;QAED,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;QAC3B,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,EAAE,CAAC;IACnD,CAAC;IAED,aAAa;IAEb,kBAAkB;IAElB;;OAEG;IACI,MAAM,CAAC,YAAwF;QAClG,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;YACtB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;YAE1B,IAAI,cAAc,CAAC,YAAY,CAAC,EAAE,CAAC;gBAC/B,OAAO;YACX,CAAC;YAED,MAAM,CAAC,OAAO,CAAC;gBACX,GAAG,YAAY,CAAC,IAAI;gBACpB,GAAG,YAAY,CAAC,OAAO;gBACvB,GAAG,EAAE;aACR,CAAC,CAAC,OAAO,CAAC,CAAC,CACR,CAAC,EACD,CAAC,CACJ,EAAE,EAAE;gBACD,IAAI,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;oBACpC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;gBACrE,CAAC;YACL,CAAC,CAAC,CAAC;YAEH,IAAI,YAAY,CAAC,EAAE,EAAE,CAAC;gBAClB,IAAI,YAAY,CAAC,OAAO,EAAE,CAAC;oBACvB,YAAY,CAAC,OAAO,CAAC,GAAG,EAAE;wBACtB,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;oBAC5B,CAAC,CAAC,CAAC;gBACP,CAAC;qBAAM,CAAC;oBACJ,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;gBAC5B,CAAC;YACL,CAAC;QACL,CAAC;QAED,OAAO,OAAO,CAAC;IACnB,CAAC;IAEO,IAAI,CAAC,OAAwB;QACjC,KAAK,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,OAAO,CAAC,EAAE,EAAE;YAChE,GAAG;gBACC,QAAQ,EAAE,GAAG;gBACb,MAAM,EAAE,MAAM;aACjB;YACD,GAAG,OAAO,CAAC,OAAO;SACrB,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE;YACT,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC;QAC3B,CAAC,CAAC,CAAC;IACP,CAAC;CAIJ;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,OAAO,CAAC,gBAAuB,CAA+D,CAAC"}

package/Animations/Directives/AnimationRefDirective.d.ts

@@ -0,0 +1,23 @@
+import { type AsyncDirectiveArgs, AsyncDirectiveBase } from '../../Controls/Directives/Abstracts/AsyncDirectiveBase';
+import type { IAnimateOptions } from './IAnimateOptions';
+export interface IAnimationRef {
+    play: (options: IAnimateOptions) => Promise<AnimationPlaybackEvent>;
+}
+export declare function isAnimationRef(value: any): value is IAnimationRef;
+/**
+ * The `AnimateDirective` class.
+ *
+ * @public
+ */
+export declare class AnimationRefDirective extends AsyncDirectiveBase {
+    private readonly _animationPlayer;
+    /**
+     * Constructs a new instance of the `AnimateDirective` class.
+     *
+     * @public
+     */
+    constructor(args: AsyncDirectiveArgs);
+    render(cb: (ref: IAnimationRef) => void): unknown;
+}
+export declare const animationRef: (...values: Parameters<AnimationRefDirective["render"]>) => any;
+//# sourceMappingURL=AnimationRefDirective.d.ts.map

package/Animations/Directives/AnimationRefDirective.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimationRefDirective.d.ts","sourceRoot":"","sources":["../../../src/Animations/Directives/AnimationRefDirective.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,kBAAkB,EAAE,kBAAkB,EAAqB,MAAM,wDAAwD,CAAC;AAGxI,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAIzD,MAAM,WAAW,aAAa;IAC1B,IAAI,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,OAAO,CAAC,sBAAsB,CAAC,CAAC;CACvE;AAGD,wBAAgB,cAAc,CAAC,KAAK,EAAE,GAAG,GAAG,KAAK,IAAI,aAAa,CAEjE;AAED;;;;GAIG;AACH,qBAAa,qBAAsB,SAAQ,kBAAkB;IAIzD,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAmB;IAMpD;;;;OAIG;gBACgB,IAAI,EAAE,kBAAkB;IAcpC,MAAM,CAAC,EAAE,EAAE,CAAC,GAAG,EAAE,aAAa,KAAK,IAAI,GAAG,OAAO;CAQ3D;AAED,eAAO,MAAM,YAAY,EAA4C,CAAC,GAAG,MAAM,EAAE,UAAU,CAAC,qBAAqB,CAAC,QAAQ,CAAC,CAAC,KAAK,GAAG,CAAC"}

package/Animations/Directives/AnimationRefDirective.js

@@ -0,0 +1,39 @@
+// #region Imports
+import { AsyncDirectiveBase, PartType, compose } from '../../Controls/Directives/Abstracts/AsyncDirectiveBase';
+import { nothing } from '../../Dom/Html';
+import { AnimationPlayer2 } from '../AnimationPlayer2';
+// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+export function isAnimationRef(value) {
+    return value && typeof value === 'object' && 'play' in value;
+}
+/**
+ * The `AnimateDirective` class.
+ *
+ * @public
+ */
+export class AnimationRefDirective extends AsyncDirectiveBase {
+    // #region Fields
+    _animationPlayer;
+    // #endregion
+    // #region Ctor
+    /**
+     * Constructs a new instance of the `AnimateDirective` class.
+     *
+     * @public
+     */
+    constructor(args) {
+        super(args);
+        if (args.type !== PartType.ELEMENT) {
+            throw new Error('The `animate` directive must be used in attribute position.');
+        }
+        this._animationPlayer = new AnimationPlayer2();
+    }
+    // #endregion
+    // #region Methods
+    render(cb) {
+        cb({ play: (options) => this._animationPlayer.play(this.internals.element, options.from, options.options) });
+        return nothing;
+    }
+}
+export const animationRef = compose(AnimationRefDirective);
+//# sourceMappingURL=AnimationRefDirective.js.map

package/Animations/Directives/AnimationRefDirective.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimationRefDirective.js","sourceRoot":"","sources":["../../../src/Animations/Directives/AnimationRefDirective.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAA2B,kBAAkB,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,wDAAwD,CAAC;AACxI,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AASvD,6EAA6E;AAC7E,MAAM,UAAU,cAAc,CAAC,KAAU;IACrC,OAAO,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,MAAM,IAAI,KAAK,CAAC;AACjE,CAAC;AAED;;;;GAIG;AACH,MAAM,OAAO,qBAAsB,SAAQ,kBAAkB;IAEzD,iBAAiB;IAEA,gBAAgB,CAAmB;IAEpD,aAAa;IAEb,eAAe;IAEf;;;;OAIG;IACH,YAAmB,IAAwB;QACvC,KAAK,CAAC,IAAI,CAAC,CAAC;QAEZ,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,CAAC,OAAO,EAAE,CAAC;YACjC,MAAM,IAAI,KAAK,CAAC,6DAA6D,CAAC,CAAC;QACnF,CAAC;QAED,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,EAAE,CAAC;IACnD,CAAC;IAED,aAAa;IAEb,kBAAkB;IAEX,MAAM,CAAC,EAAgC;QAC1C,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,OAAwB,EAAE,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAE9H,OAAO,OAAO,CAAC;IACnB,CAAC;CAIJ;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,OAAO,CAAC,qBAA4B,CAAoE,CAAC"}

package/Animations/Directives/IAnimateOptions.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Represents the `IAnimatePreset` interface.
+ *
+ * @public
+ */
+export interface IAnimateOptions {
+    from: Record<string, string | Array<string> | number | null | Array<number | null> | undefined>;
+    to: Record<string, string | Array<string> | number | null | Array<number | null> | undefined>;
+    options?: KeyframeAnimationOptions;
+    initial?: Record<string, string | Array<string> | number | null | Array<number | null> | undefined>;
+    onFinished?: () => void;
+}
+//# sourceMappingURL=IAnimateOptions.d.ts.map

package/Animations/Directives/IAnimateOptions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IAnimateOptions.d.ts","sourceRoot":"","sources":["../../../src/Animations/Directives/IAnimateOptions.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAI5B,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,GAAG,MAAM,GAAG,IAAI,GAAG,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC,CAAC;IAEhG,EAAE,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,GAAG,MAAM,GAAG,IAAI,GAAG,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC,CAAC;IAE9F,OAAO,CAAC,EAAE,wBAAwB,CAAC;IAEnC,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,GAAG,MAAM,GAAG,IAAI,GAAG,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC,CAAC;IAEpG,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CAI3B"}

package/Animations/Directives/IAnimateOptions.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=IAnimateOptions.js.map