@lightningjs/renderer 3.0.0-beta16 → 3.0.0-beta17

package/dist/src/core/animations/Animation.js

@@ -0,0 +1,111 @@
+import Transition from './Transition.js';
+import { normalizeTimingFunction } from './utils.js';
+import Playback, { PlaybackSettingsKeys } from './Playback.js';
+const mapTransitions = (target, animationParams, aDuration, aDelay, aEasing) => {
+    const aStart = aDelay;
+    const aEnd = aDelay + aDuration;
+    const transitionsByKey = {};
+    const keys = Object.keys(animationParams);
+    const filteredKeys = [];
+    for (let i = 0; i < keys.length; i++) {
+        const key = keys[i];
+        //skip playback settings
+        if (PlaybackSettingsKeys[key] === true) {
+            continue;
+        }
+        transitionsByKey[key] = [];
+        filteredKeys.push(key);
+    }
+    for (let i = 0; i < filteredKeys.length; i++) {
+        const key = filteredKeys[i];
+        const prop = target[key];
+        if (prop === undefined) {
+            console.warn(`CoreAnimation: property "${key}" does not exist on target.`);
+            continue;
+        }
+        const aProp = animationParams[key];
+        if (typeof aProp === 'number') {
+            transitionsByKey[key].push(new Transition(null, animationParams[key], aStart, aEnd, aEasing));
+            continue;
+        }
+        if (typeof aProp === 'object' && Array.isArray(aProp) === false) {
+            const from = aProp.from ?? null;
+            const start = aProp.duration ?? aDuration;
+            const end = aDelay + (aProp.delay ?? 0);
+            const easing = normalizeTimingFunction(aProp.easing) ?? aEasing;
+            transitionsByKey[key].push(new Transition(from, aProp.to, start, end, easing));
+            continue;
+        }
+        const isUsableArray = Array.isArray(aProp) && aProp.length > 0;
+        //keyframed animation for number arrays
+        if (isUsableArray === true && typeof aProp[0] === 'number') {
+            const spreadDuration = aDuration / Math.min(aProp.length - 1, 1);
+            let transitionStart = aDelay;
+            let startValue = aProp[0];
+            const len = aProp.length;
+            if (len > 1) {
+                for (let j = 1; j < len; j++) {
+                    const value = aProp[j];
+                    const transitionEnd = transitionStart + spreadDuration;
+                    transitionsByKey[key].push(new Transition(startValue, value, transitionStart, transitionEnd, aEasing));
+                    //carry over to next transition
+                    transitionStart = transitionEnd;
+                    startValue = value;
+                }
+            }
+            else {
+                transitionsByKey[key].push(new Transition(null, startValue, transitionStart, transitionStart + spreadDuration, aEasing));
+            }
+            continue;
+        }
+        if (isUsableArray === true && typeof aProp[0] === 'string') {
+            console.warn(`CoreAnimation: keyframed string animations are not yet supported for property "${key}".`);
+            continue;
+        }
+    }
+    return transitionsByKey;
+};
+export default class Animation extends Playback {
+    target;
+    transitions;
+    transitionKeys;
+    constructor(animationManager, target, animationParams) {
+        super(animationManager, animationParams);
+        this.target = target;
+        this.transitions = mapTransitions(target, animationParams, this.duration, this.delay, this.easing);
+        this.transitionKeys = Object.keys(this.transitions);
+    }
+    updateValues(currentTime) {
+        for (let i = 0; i < this.transitionKeys.length; i++) {
+            const key = this.transitionKeys[i];
+            const transitions = this.transitions[key];
+            for (let j = 0; j < transitions.length; j++) {
+                const transition = transitions[j];
+                if (currentTime >= transition.start &&
+                    currentTime <= transition.start + transition.end) {
+                    //apply value to target
+                    this.target[key] =
+                        transition.update(currentTime);
+                    continue;
+                }
+            }
+        }
+    }
+    applyStartValues() {
+        //set start values for transitions
+        for (let i = 0; i < this.transitionKeys.length; i++) {
+            const key = this.transitionKeys[i];
+            //only need to set the first transition's from value
+            const firstTransition = this.transitions[key][0];
+            const from = firstTransition.from;
+            const currentValue = this.target[key];
+            const targetValue = from !== null ? from : currentValue;
+            if (from === null) {
+                firstTransition.from = targetValue;
+            }
+            this.target[key] = targetValue;
+            firstTransition.currentValue = targetValue;
+        }
+    }
+}
+//# sourceMappingURL=Animation.js.map

package/dist/src/core/animations/Animation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Animation.js","sourceRoot":"","sources":["../../../../src/core/animations/Animation.ts"],"names":[],"mappings":"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"}

package/dist/src/core/animations/CoreTransition.d.ts

@@ -0,0 +1,24 @@
+import type { TimingFunction } from "./utils";
+export interface TransitionSettings {
+    to: number;
+    from?: number | null;
+    duration?: number;
+    delay?: number;
+    easing?: string | TimingFunction;
+}
+export type TransitionValueTypes = number | TransitionSettings | string | (number | TransitionSettings | string)[];
+export default class Transition {
+    private data;
+    currentValue: number | null;
+    applyProgress: (from: number, to: number, p: number) => number;
+    constructor(from: number | null, to: number, duration: number, delay: number, easing: TimingFunction | null);
+    applyEasedProgress(from: number, to: number, p: number): number;
+    applyLinearProgress(from: number, to: number, p: number): number;
+    update(animationTime: number): number;
+    set from(value: number | null);
+    get from(): number | null;
+    get to(): number;
+    get start(): number;
+    get end(): number;
+    get easing(): TimingFunction | null;
+}

package/dist/src/core/animations/CoreTransition.js

@@ -0,0 +1,63 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export default class Transition {
+    data;
+    currentValue = null;
+    applyProgress = this.applyLinearProgress;
+    constructor(from, to, duration, delay, easing) {
+        this.data = [from, to, duration, delay, easing];
+        if (easing !== null) {
+            this.applyProgress = this.applyEasedProgress;
+        }
+    }
+    // This function only gets called if an easing function is provided
+    applyEasedProgress(from, to, p) {
+        return from + (to - from) * this.data[4](p);
+    }
+    // This function gets called if no easing function is provided (linear)
+    applyLinearProgress(from, to, p) {
+        return from + (to - from) * p;
+    }
+    update(animationTime) {
+        const [from, to, start, end] = this.data;
+        //calculate progress of transition
+        let p = (animationTime - start) / (end - start);
+        return this.currentValue = this.applyProgress(from, to, p);
+    }
+    //only settable property is 'from' will be used on start of animation
+    set from(value) {
+        this.data[0] = value;
+    }
+    get from() {
+        return this.data[0];
+    }
+    get to() {
+        return this.data[1];
+    }
+    get start() {
+        return this.data[2];
+    }
+    get end() {
+        return this.data[3];
+    }
+    get easing() {
+        return this.data[4];
+    }
+}
+//# sourceMappingURL=CoreTransition.js.map

package/dist/src/core/animations/CoreTransition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoreTransition.js","sourceRoot":"","sources":["../../../../src/core/animations/CoreTransition.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAkCH,MAAM,CAAC,OAAO,OAAO,UAAU;IACrB,IAAI,CAAwB;IACpC,YAAY,GAAkB,IAAI,CAAC;IACnC,aAAa,GAAG,IAAI,CAAC,mBAAmB,CAAC;IAEzC,YAAY,IAAmB,EAAE,EAAU,EAAE,QAAgB,EAAE,KAAa,EAAE,MAA6B;QACzG,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QAChD,IAAI,MAAM,KAAK,IAAI,EAAE,CAAC;YACpB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,kBAAkB,CAAC;QAC/C,CAAC;IACH,CAAC;IAED,mEAAmE;IACnE,kBAAkB,CAAC,IAAY,EAAE,EAAU,EAAE,CAAS;QACpD,OAAO,IAAI,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,CAAC;IAC/C,CAAC;IAED,uEAAuE;IACvE,mBAAmB,CAAC,IAAY,EAAE,EAAU,EAAE,CAAS;QACrD,OAAO,IAAI,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC;IAChC,CAAC;IAED,MAAM,CAAC,aAAqB;QAC1B,MAAM,CAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,GAAG,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;QACzC,kCAAkC;QAClC,IAAI,CAAC,GAAG,CAAC,aAAa,GAAG,KAAK,CAAC,GAAG,CAAC,GAAG,GAAG,KAAK,CAAC,CAAC;QAChD,OAAO,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,IAAK,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;IAC9D,CAAC;IAED,qEAAqE;IACrE,IAAI,IAAI,CAAC,KAAoB;QAC3B,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC;IACvB,CAAC;IAED,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC;IAED,IAAI,EAAE;QACJ,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC;IAED,IAAI,KAAK;QACP,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC;IAED,IAAI,GAAG;QACL,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC;IAED,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC;CACF"}

package/dist/src/core/animations/Playback.d.ts

@@ -0,0 +1,62 @@
+import { EventEmitter } from '../../common/EventEmitter.js';
+import type { AnimationManager } from './AnimationManager.js';
+import { type TimingFunction } from './utils.js';
+export declare enum StopMethodFlags {
+    Immediate = 0,
+    Reset = 1,
+    Reverse = 2
+}
+export type StopMethodOptions = 'reverse' | 'reset' | 'immediate';
+export declare const getStopMethodFlag: (method: string | undefined) => StopMethodFlags;
+export interface PlaybackSettings {
+    delay: number;
+    duration: number;
+    easing: string | TimingFunction;
+    loop: boolean;
+    repeat: number;
+    reverse: boolean;
+    stopMethod: StopMethodOptions;
+}
+export declare enum PlaybackState {
+    Idle = 0,
+    Destroyed = 1,
+    Stopped = 2,
+    Finished = 3,
+    Paused = 4,
+    Playing = 5,
+    Stopping = 6
+}
+export declare const PlaybackSettingsKeys: {
+    delay: boolean;
+    duration: boolean;
+    easing: boolean;
+    loop: boolean;
+    repeat: boolean;
+    reverse: boolean;
+    stopMethod: boolean;
+};
+export declare function getPlaybackId(): number;
+export default class Playback extends EventEmitter {
+    readonly animationManager: AnimationManager;
+    readonly id: number;
+    delay: number;
+    duration: number;
+    easing: TimingFunction | null;
+    loop: boolean;
+    repeat: number;
+    reverse: boolean;
+    stopMethod: StopMethodFlags;
+    state: PlaybackState;
+    startTime: number | null;
+    pauseTime: number | null;
+    endTime: number | null;
+    currentTime: number;
+    iteration: number;
+    constructor(animationManager: AnimationManager, settings?: Partial<PlaybackSettings>);
+    update(currentFrameTime: number): void;
+    updateValues(currentTime: number): void;
+    applyStartValues(): void;
+    start(): this;
+    stop(): void;
+    finish(): void;
+}

package/dist/src/core/animations/Playback.js

@@ -0,0 +1,155 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { EventEmitter } from '../../common/EventEmitter.js';
+import { normalizeTimingFunction } from './utils.js';
+export var StopMethodFlags;
+(function (StopMethodFlags) {
+    StopMethodFlags[StopMethodFlags["Immediate"] = 0] = "Immediate";
+    StopMethodFlags[StopMethodFlags["Reset"] = 1] = "Reset";
+    StopMethodFlags[StopMethodFlags["Reverse"] = 2] = "Reverse";
+})(StopMethodFlags || (StopMethodFlags = {}));
+export const getStopMethodFlag = (method) => {
+    if (method === undefined || method === 'immediate') {
+        return StopMethodFlags.Immediate;
+    }
+    switch (method) {
+        case 'reverse':
+            return StopMethodFlags.Reverse;
+        case 'reset':
+            return StopMethodFlags.Reset;
+    }
+    return StopMethodFlags.Immediate;
+};
+export var PlaybackState;
+(function (PlaybackState) {
+    PlaybackState[PlaybackState["Idle"] = 0] = "Idle";
+    PlaybackState[PlaybackState["Destroyed"] = 1] = "Destroyed";
+    PlaybackState[PlaybackState["Stopped"] = 2] = "Stopped";
+    PlaybackState[PlaybackState["Finished"] = 3] = "Finished";
+    PlaybackState[PlaybackState["Paused"] = 4] = "Paused";
+    PlaybackState[PlaybackState["Playing"] = 5] = "Playing";
+    PlaybackState[PlaybackState["Stopping"] = 6] = "Stopping";
+})(PlaybackState || (PlaybackState = {}));
+export const PlaybackSettingsKeys = {
+    delay: true,
+    duration: true,
+    easing: true,
+    loop: true,
+    repeat: true,
+    reverse: true,
+    stopMethod: true,
+};
+//freeze the keys object to prevent modification
+Object.freeze(PlaybackSettingsKeys);
+/**
+ * Returns a new unique ID
+ */
+let playbackId = 1;
+export function getPlaybackId() {
+    return playbackId++;
+}
+export default class Playback extends EventEmitter {
+    animationManager;
+    //id
+    id = getPlaybackId();
+    //settings
+    delay;
+    duration;
+    easing;
+    loop;
+    repeat;
+    reverse;
+    stopMethod;
+    //lifecycle
+    state = PlaybackState.Idle;
+    startTime = null;
+    pauseTime = null;
+    endTime = null;
+    currentTime = 0;
+    iteration = 0;
+    constructor(animationManager, settings = {}) {
+        super();
+        this.animationManager = animationManager;
+        this.delay = settings.delay ?? 0;
+        this.duration = settings.duration ?? 200;
+        this.easing = normalizeTimingFunction(settings.easing);
+        this.loop = settings.loop ?? false;
+        this.repeat = settings.repeat ?? 0;
+        this.reverse = settings.reverse ?? false;
+        this.stopMethod = getStopMethodFlag(settings.stopMethod);
+    }
+    update(currentFrameTime) {
+        let state = this.state;
+        let targetTime = currentFrameTime - this.startTime;
+        if (state === PlaybackState.Stopping) {
+            targetTime = this.duration - targetTime;
+        }
+        if (state === PlaybackState.Playing && targetTime > this.duration) {
+            targetTime = this.duration;
+            if (this.loop === true) {
+                this.iteration++;
+                this.startTime = currentFrameTime;
+                targetTime = 0;
+                if (this.repeat > 0 && this.iteration > this.repeat) {
+                    this.stop();
+                }
+            }
+        }
+    }
+    updateValues(currentTime) { }
+    applyStartValues() {
+        //needs to be implemented in subclass
+    }
+    start() {
+        const animationManager = this.animationManager;
+        this.startTime = animationManager.currentFrameTime + this.delay;
+        this.endTime = this.startTime + this.duration;
+        this.state = PlaybackState.Playing;
+        animationManager.register(this);
+        this.emit('start');
+        return this;
+    }
+    stop() {
+        const stopMethod = this.stopMethod;
+        if (stopMethod === StopMethodFlags.Immediate) {
+            this.finish();
+            return;
+        }
+        if (stopMethod === StopMethodFlags.Reset) {
+            this.updateValues(0);
+            this.finish();
+            return;
+        }
+        if (stopMethod === StopMethodFlags.Reverse) {
+            if (this.state === PlaybackState.Playing) {
+                this.state = PlaybackState.Stopping;
+                //adjust start time to account for current time
+                const currentFrameTime = this.animationManager.currentFrameTime;
+                const elapsedTime = currentFrameTime - this.startTime;
+                this.startTime = currentFrameTime - (this.duration - elapsedTime);
+            }
+        }
+    }
+    finish() {
+        this.state = PlaybackState.Finished;
+        this.emit('finish');
+        this.animationManager.unregister(this);
+    }
+}
+//# sourceMappingURL=Playback.js.map

package/dist/src/core/animations/Playback.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Playback.js","sourceRoot":"","sources":["../../../../src/core/animations/Playback.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAE5D,OAAO,EAAE,uBAAuB,EAAuB,MAAM,YAAY,CAAC;AAE1E,MAAM,CAAN,IAAY,eAIX;AAJD,WAAY,eAAe;IACzB,+DAAS,CAAA;IACT,uDAAK,CAAA;IACL,2DAAO,CAAA;AACT,CAAC,EAJW,eAAe,KAAf,eAAe,QAI1B;AAKD,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAC/B,MAA0B,EACT,EAAE;IACnB,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,WAAW,EAAE,CAAC;QACnD,OAAO,eAAe,CAAC,SAAS,CAAC;IACnC,CAAC;IAED,QAAQ,MAAM,EAAE,CAAC;QACf,KAAK,SAAS;YACZ,OAAO,eAAe,CAAC,OAAO,CAAC;QACjC,KAAK,OAAO;YACV,OAAO,eAAe,CAAC,KAAK,CAAC;IACjC,CAAC;IAED,OAAO,eAAe,CAAC,SAAS,CAAC;AACnC,CAAC,CAAC;AAYF,MAAM,CAAN,IAAY,aAQX;AARD,WAAY,aAAa;IACvB,iDAAI,CAAA;IACJ,2DAAS,CAAA;IACT,uDAAO,CAAA;IACP,yDAAQ,CAAA;IACR,qDAAM,CAAA;IACN,uDAAO,CAAA;IACP,yDAAQ,CAAA;AACV,CAAC,EARW,aAAa,KAAb,aAAa,QAQxB;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAG;IAClC,KAAK,EAAE,IAAI;IACX,QAAQ,EAAE,IAAI;IACd,MAAM,EAAE,IAAI;IACZ,IAAI,EAAE,IAAI;IACV,MAAM,EAAE,IAAI;IACZ,OAAO,EAAE,IAAI;IACb,UAAU,EAAE,IAAI;CACjB,CAAC;AAEF,gDAAgD;AAChD,MAAM,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC;AAEpC;;GAEG;AACH,IAAI,UAAU,GAAG,CAAC,CAAC;AACnB,MAAM,UAAU,aAAa;IAC3B,OAAO,UAAU,EAAE,CAAC;AACtB,CAAC;AAED,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,YAAY;IAqBrC;IApBX,IAAI;IACK,EAAE,GAAG,aAAa,EAAE,CAAC;IAC9B,UAAU;IACV,KAAK,CAAS;IACd,QAAQ,CAAS;IACjB,MAAM,CAAwB;IAC9B,IAAI,CAAU;IACd,MAAM,CAAS;IACf,OAAO,CAAU;IACjB,UAAU,CAAkB;IAE5B,WAAW;IACX,KAAK,GAAkB,aAAa,CAAC,IAAI,CAAC;IAC1C,SAAS,GAAkB,IAAI,CAAC;IAChC,SAAS,GAAkB,IAAI,CAAC;IAChC,OAAO,GAAkB,IAAI,CAAC;IAC9B,WAAW,GAAW,CAAC,CAAC;IACxB,SAAS,GAAW,CAAC,CAAC;IAEtB,YACW,gBAAkC,EAC3C,WAAsC,EAAE;QAExC,KAAK,EAAE,CAAC;QAHC,qBAAgB,GAAhB,gBAAgB,CAAkB;QAI3C,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,KAAK,IAAI,CAAC,CAAC;QACjC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,QAAQ,IAAI,GAAG,CAAC;QACzC,IAAI,CAAC,MAAM,GAAG,uBAAuB,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;QACvD,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,IAAI,KAAK,CAAC;QACnC,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,CAAC;QACnC,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,OAAO,IAAI,KAAK,CAAC;QACzC,IAAI,CAAC,UAAU,GAAG,iBAAiB,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;IAC3D,CAAC;IAED,MAAM,CAAC,gBAAwB;QAC7B,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;QACvB,IAAI,UAAU,GAAG,gBAAgB,GAAG,IAAI,CAAC,SAAU,CAAC;QACpD,IAAI,KAAK,KAAK,aAAa,CAAC,QAAQ,EAAE,CAAC;YACrC,UAAU,GAAG,IAAI,CAAC,QAAQ,GAAG,UAAU,CAAC;QAC1C,CAAC;QAED,IAAI,KAAK,KAAK,aAAa,CAAC,OAAO,IAAI,UAAU,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClE,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC;YAC3B,IAAI,IAAI,CAAC,IAAI,KAAK,IAAI,EAAE,CAAC;gBACvB,IAAI,CAAC,SAAS,EAAE,CAAC;gBACjB,IAAI,CAAC,SAAS,GAAG,gBAAgB,CAAC;gBAClC,UAAU,GAAG,CAAC,CAAC;gBACf,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;oBACpD,IAAI,CAAC,IAAI,EAAE,CAAC;gBACd,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IAED,YAAY,CAAC,WAAmB,IAAG,CAAC;IAEpC,gBAAgB;QACd,qCAAqC;IACvC,CAAC;IAED,KAAK;QACH,MAAM,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAC;QAC/C,IAAI,CAAC,SAAS,GAAG,gBAAgB,CAAC,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC;QAChE,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC9C,IAAI,CAAC,KAAK,GAAG,aAAa,CAAC,OAAO,CAAC;QACnC,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;QAChC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACnB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI;QACF,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;QACnC,IAAI,UAAU,KAAK,eAAe,CAAC,SAAS,EAAE,CAAC;YAC7C,IAAI,CAAC,MAAM,EAAE,CAAC;YACd,OAAO;QACT,CAAC;QACD,IAAI,UAAU,KAAK,eAAe,CAAC,KAAK,EAAE,CAAC;YACzC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;YACrB,IAAI,CAAC,MAAM,EAAE,CAAC;YACd,OAAO;QACT,CAAC;QACD,IAAI,UAAU,KAAK,eAAe,CAAC,OAAO,EAAE,CAAC;YAC3C,IAAI,IAAI,CAAC,KAAK,KAAK,aAAa,CAAC,OAAO,EAAE,CAAC;gBACzC,IAAI,CAAC,KAAK,GAAG,aAAa,CAAC,QAAQ,CAAC;gBACpC,+CAA+C;gBAC/C,MAAM,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC;gBAChE,MAAM,WAAW,GAAG,gBAAgB,GAAG,IAAI,CAAC,SAAU,CAAC;gBACvD,IAAI,CAAC,SAAS,GAAG,gBAAgB,GAAG,CAAC,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,CAAC;YACpE,CAAC;QACH,CAAC;IACH,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,KAAK,GAAG,aAAa,CAAC,QAAQ,CAAC;QACpC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QACpB,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACzC,CAAC;CACF"}

package/dist/src/core/animations/Transition.d.ts

@@ -0,0 +1,25 @@
+import type { TimingFunction } from './utils';
+export interface TransitionSettings {
+    to: number;
+    from?: number | null;
+    duration?: number;
+    delay?: number;
+    easing?: string | TimingFunction;
+}
+export type TransitionableValue = number | number[];
+export type TransitionValueTypes = number | TransitionSettings | string | (number | TransitionSettings | string)[];
+export default class Transition {
+    private data;
+    currentValue: TransitionableValue | null;
+    applyProgress: (from: number, to: number, p: number) => number;
+    constructor(from: TransitionableValue | null, to: TransitionableValue, duration: number, delay: number, easing: TimingFunction | null);
+    applyEasedProgress(from: number, to: number, p: number): number;
+    applyLinearProgress(from: number, to: number, p: number): number;
+    update(animationTime: number): number;
+    set from(value: TransitionableValue | null);
+    get from(): TransitionableValue | null;
+    get to(): TransitionableValue;
+    get start(): number;
+    get end(): number;
+    get easing(): TimingFunction | null;
+}

package/dist/src/core/animations/Transition.js

@@ -0,0 +1,63 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export default class Transition {
+    data;
+    currentValue = null;
+    applyProgress = this.applyLinearProgress;
+    constructor(from, to, duration, delay, easing) {
+        this.data = [from, to, duration, delay, easing];
+        if (easing !== null) {
+            this.applyProgress = this.applyEasedProgress;
+        }
+    }
+    // This function only gets called if an easing function is provided
+    applyEasedProgress(from, to, p) {
+        return from + (to - from) * this.data[4](p);
+    }
+    // This function gets called if no easing function is provided (linear)
+    applyLinearProgress(from, to, p) {
+        return from + (to - from) * p;
+    }
+    update(animationTime) {
+        const [from, to, start, end] = this.data;
+        //calculate progress of transition
+        let p = (animationTime - start) / (end - start);
+        return (this.currentValue = this.applyProgress(from, to, p));
+    }
+    //only settable property is 'from' will be used on start of animation
+    set from(value) {
+        this.data[0] = value;
+    }
+    get from() {
+        return this.data[0];
+    }
+    get to() {
+        return this.data[1];
+    }
+    get start() {
+        return this.data[2];
+    }
+    get end() {
+        return this.data[3];
+    }
+    get easing() {
+        return this.data[4];
+    }
+}
+//# sourceMappingURL=Transition.js.map

package/dist/src/core/animations/Transition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Transition.js","sourceRoot":"","sources":["../../../../src/core/animations/Transition.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAoCH,MAAM,CAAC,OAAO,OAAO,UAAU;IACrB,IAAI,CAAuB;IACnC,YAAY,GAA+B,IAAI,CAAC;IAChD,aAAa,GAAG,IAAI,CAAC,mBAAmB,CAAC;IAEzC,YACE,IAAgC,EAChC,EAAuB,EACvB,QAAgB,EAChB,KAAa,EACb,MAA6B;QAE7B,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;QAChD,IAAI,MAAM,KAAK,IAAI,EAAE,CAAC;YACpB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,kBAAkB,CAAC;QAC/C,CAAC;IACH,CAAC;IAED,mEAAmE;IACnE,kBAAkB,CAAC,IAAY,EAAE,EAAU,EAAE,CAAS;QACpD,OAAO,IAAI,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAE,CAAC,CAAC,CAAC,CAAC;IAC/C,CAAC;IAED,uEAAuE;IACvE,mBAAmB,CAAC,IAAY,EAAE,EAAU,EAAE,CAAS;QACrD,OAAO,IAAI,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC;IAChC,CAAC;IAED,MAAM,CAAC,aAAqB;QAC1B,MAAM,CAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,GAAG,CAAC,GAAG,IAAI,CAAC,IAMnC,CAAC;QACF,kCAAkC;QAClC,IAAI,CAAC,GAAG,CAAC,aAAa,GAAG,KAAK,CAAC,GAAG,CAAC,GAAG,GAAG,KAAK,CAAC,CAAC;QAChD,OAAO,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,IAAK,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;IAChE,CAAC;IAED,qEAAqE;IACrE,IAAI,IAAI,CAAC,KAAiC;QACxC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC;IACvB,CAAC;IAED,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC;IAED,IAAI,EAAE;QACJ,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC;IAED,IAAI,KAAK;QACP,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC;IAED,IAAI,GAAG;QACL,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC;IAED,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC;CACF"}

package/dist/src/core/animations/utils.d.ts

@@ -0,0 +1,2 @@
+export type TimingFunction = (t: number) => number;
+export declare const normalizeTimingFunction: (something: string | TimingFunction | undefined) => TimingFunction | null;