@rive-app/canvas-lite 2.37.7 → 2.37.8
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.
- package/package.json +1 -1
- package/rive.d.ts +16 -0
- package/rive.js +184 -24
- package/rive.js.map +1 -1
- package/rive.wasm +0 -0
- package/rive_advanced.mjs.d.ts +17 -0
- package/rive_fallback.wasm +0 -0
- package/utils/index.d.ts +2 -0
- package/utils/registerKeyboardInteractions.d.ts +22 -0
package/package.json
CHANGED
package/rive.d.ts
CHANGED
|
@@ -215,6 +215,10 @@ export interface RiveParameters {
|
|
|
215
215
|
layout?: Layout;
|
|
216
216
|
autoplay?: boolean;
|
|
217
217
|
useOffscreenRenderer?: boolean;
|
|
218
|
+
/**
|
|
219
|
+
* Optional tab index to set for the canvas element if there are any Focus nodes within the graphic
|
|
220
|
+
*/
|
|
221
|
+
tabIndex?: number;
|
|
218
222
|
/**
|
|
219
223
|
* Allow the runtime to automatically load assets hosted in Rive's CDN.
|
|
220
224
|
* enabled by default.
|
|
@@ -316,6 +320,7 @@ export interface RiveLoadParameters {
|
|
|
316
320
|
stateMachines?: string | string[];
|
|
317
321
|
useOffscreenRenderer?: boolean;
|
|
318
322
|
shouldDisableRiveListeners?: boolean;
|
|
323
|
+
tabIndex?: number;
|
|
319
324
|
}
|
|
320
325
|
export interface RiveResetParameters {
|
|
321
326
|
artboard?: string;
|
|
@@ -415,6 +420,7 @@ export declare class Rive {
|
|
|
415
420
|
private runtime;
|
|
416
421
|
private artboard;
|
|
417
422
|
private eventCleanup;
|
|
423
|
+
private keyboardEventCleanup;
|
|
418
424
|
private file;
|
|
419
425
|
private riveFile;
|
|
420
426
|
private eventManager;
|
|
@@ -438,8 +444,11 @@ export declare class Rive {
|
|
|
438
444
|
private _currentCanvasHeight;
|
|
439
445
|
private _audioEventListener;
|
|
440
446
|
private _boundDraw;
|
|
447
|
+
private _pageVisibilityHandler;
|
|
448
|
+
private _explicitlyStoppedRendering;
|
|
441
449
|
private _viewModelInstance;
|
|
442
450
|
private _dataEnums;
|
|
451
|
+
private _tabIndex;
|
|
443
452
|
private drawOptimization;
|
|
444
453
|
private enablePerfMarks;
|
|
445
454
|
durations: number[];
|
|
@@ -723,6 +732,13 @@ export declare class Rive {
|
|
|
723
732
|
*/
|
|
724
733
|
startRendering(): void;
|
|
725
734
|
private scheduleRendering;
|
|
735
|
+
/**
|
|
736
|
+
* Called when document.visibilitychange fires (tab change, window minimize, etc.).
|
|
737
|
+
* Cancels the rAF loop on hide and resets the time reference so that no accumulated time is
|
|
738
|
+
* applied to state machines when the tab becomes visible again. This prevents state machine
|
|
739
|
+
* advances with large time deltas when rAF starts up again.
|
|
740
|
+
*/
|
|
741
|
+
private _onPageVisibilityChange;
|
|
726
742
|
/**
|
|
727
743
|
* Enables frames-per-second (FPS) reporting for the runtime
|
|
728
744
|
* If no callback is provided, Rive will append a fixed-position div at the top-right corner of
|
package/rive.js
CHANGED
|
@@ -2546,7 +2546,7 @@ moduleRtn = da;
|
|
|
2546
2546
|
/* 5 */
|
|
2547
2547
|
/***/ ((module) => {
|
|
2548
2548
|
|
|
2549
|
-
module.exports = /*#__PURE__*/JSON.parse('{"name":"@rive-app/canvas-lite","version":"2.37.
|
|
2549
|
+
module.exports = /*#__PURE__*/JSON.parse('{"name":"@rive-app/canvas-lite","version":"2.37.8","description":"A lite version of Rive\'s canvas based web api.","main":"rive.js","homepage":"https://rive.app","repository":{"type":"git","url":"https://github.com/rive-app/rive-wasm/tree/master/js"},"keywords":["rive","animation"],"author":"Rive","contributors":["Luigi Rosso <luigi@rive.app> (https://rive.app)","Maxwell Talbot <max@rive.app> (https://rive.app)","Arthur Vivian <arthur@rive.app> (https://rive.app)","Umberto Sonnino <umberto@rive.app> (https://rive.app)","Matthew Sullivan <matt.j.sullivan@gmail.com> (mailto:matt.j.sullivan@gmail.com)"],"license":"MIT","files":["rive.js","rive.js.map","rive.wasm","rive_fallback.wasm","rive.d.ts","rive_advanced.mjs.d.ts","runtimeLoader.d.ts","utils"],"typings":"rive.d.ts","dependencies":{},"browser":{"fs":false,"path":false}}');
|
|
2550
2550
|
|
|
2551
2551
|
/***/ }),
|
|
2552
2552
|
/* 6 */
|
|
@@ -2554,26 +2554,29 @@ module.exports = /*#__PURE__*/JSON.parse('{"name":"@rive-app/canvas-lite","versi
|
|
|
2554
2554
|
|
|
2555
2555
|
__webpack_require__.r(__webpack_exports__);
|
|
2556
2556
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
2557
|
-
/* harmony export */ AudioAssetWrapper: () => (/* reexport safe */
|
|
2558
|
-
/* harmony export */ AudioWrapper: () => (/* reexport safe */
|
|
2559
|
-
/* harmony export */ BLANK_URL: () => (/* reexport safe */
|
|
2560
|
-
/* harmony export */ CustomFileAssetLoaderWrapper: () => (/* reexport safe */
|
|
2561
|
-
/* harmony export */ FileAssetWrapper: () => (/* reexport safe */
|
|
2562
|
-
/* harmony export */ FileFinalizer: () => (/* reexport safe */
|
|
2563
|
-
/* harmony export */ FontAssetWrapper: () => (/* reexport safe */
|
|
2564
|
-
/* harmony export */ FontWrapper: () => (/* reexport safe */
|
|
2565
|
-
/* harmony export */ ImageAssetWrapper: () => (/* reexport safe */
|
|
2566
|
-
/* harmony export */ ImageWrapper: () => (/* reexport safe */
|
|
2567
|
-
/* harmony export */ RiveFont: () => (/* reexport safe */
|
|
2568
|
-
/* harmony export */ createFinalization: () => (/* reexport safe */
|
|
2569
|
-
/* harmony export */ finalizationRegistry: () => (/* reexport safe */
|
|
2557
|
+
/* harmony export */ AudioAssetWrapper: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.AudioAssetWrapper),
|
|
2558
|
+
/* harmony export */ AudioWrapper: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.AudioWrapper),
|
|
2559
|
+
/* harmony export */ BLANK_URL: () => (/* reexport safe */ _sanitizeUrl__WEBPACK_IMPORTED_MODULE_2__.BLANK_URL),
|
|
2560
|
+
/* harmony export */ CustomFileAssetLoaderWrapper: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.CustomFileAssetLoaderWrapper),
|
|
2561
|
+
/* harmony export */ FileAssetWrapper: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.FileAssetWrapper),
|
|
2562
|
+
/* harmony export */ FileFinalizer: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.FileFinalizer),
|
|
2563
|
+
/* harmony export */ FontAssetWrapper: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.FontAssetWrapper),
|
|
2564
|
+
/* harmony export */ FontWrapper: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.FontWrapper),
|
|
2565
|
+
/* harmony export */ ImageAssetWrapper: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.ImageAssetWrapper),
|
|
2566
|
+
/* harmony export */ ImageWrapper: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.ImageWrapper),
|
|
2567
|
+
/* harmony export */ RiveFont: () => (/* reexport safe */ _riveFont__WEBPACK_IMPORTED_MODULE_4__.RiveFont),
|
|
2568
|
+
/* harmony export */ createFinalization: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.createFinalization),
|
|
2569
|
+
/* harmony export */ finalizationRegistry: () => (/* reexport safe */ _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__.finalizationRegistry),
|
|
2570
|
+
/* harmony export */ registerKeyboardInteractions: () => (/* reexport safe */ _registerKeyboardInteractions__WEBPACK_IMPORTED_MODULE_1__.registerKeyboardInteractions),
|
|
2570
2571
|
/* harmony export */ registerTouchInteractions: () => (/* reexport safe */ _registerTouchInteractions__WEBPACK_IMPORTED_MODULE_0__.registerTouchInteractions),
|
|
2571
|
-
/* harmony export */ sanitizeUrl: () => (/* reexport safe */
|
|
2572
|
+
/* harmony export */ sanitizeUrl: () => (/* reexport safe */ _sanitizeUrl__WEBPACK_IMPORTED_MODULE_2__.sanitizeUrl)
|
|
2572
2573
|
/* harmony export */ });
|
|
2573
2574
|
/* harmony import */ var _registerTouchInteractions__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7);
|
|
2574
|
-
/* harmony import */ var
|
|
2575
|
-
/* harmony import */ var
|
|
2576
|
-
/* harmony import */ var
|
|
2575
|
+
/* harmony import */ var _registerKeyboardInteractions__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(8);
|
|
2576
|
+
/* harmony import */ var _sanitizeUrl__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9);
|
|
2577
|
+
/* harmony import */ var _finalizationRegistry__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(10);
|
|
2578
|
+
/* harmony import */ var _riveFont__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(11);
|
|
2579
|
+
|
|
2577
2580
|
|
|
2578
2581
|
|
|
2579
2582
|
|
|
@@ -2875,6 +2878,68 @@ var registerTouchInteractions = function (_a) {
|
|
|
2875
2878
|
/* 8 */
|
|
2876
2879
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
2877
2880
|
|
|
2881
|
+
__webpack_require__.r(__webpack_exports__);
|
|
2882
|
+
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
2883
|
+
/* harmony export */ registerKeyboardInteractions: () => (/* binding */ registerKeyboardInteractions)
|
|
2884
|
+
/* harmony export */ });
|
|
2885
|
+
/**
|
|
2886
|
+
* Registers focus and tab-traversal event handlers on the canvas to route
|
|
2887
|
+
* Tab/Shift+Tab to the active Rive state machine's focus manager.
|
|
2888
|
+
*
|
|
2889
|
+
* Mirrors registerTouchInteractions for pointer events.
|
|
2890
|
+
*
|
|
2891
|
+
* Returns a cleanup function that removes all registered event listeners,
|
|
2892
|
+
* or null if the setup conditions are not met.
|
|
2893
|
+
*/
|
|
2894
|
+
var registerKeyboardInteractions = function (_a) {
|
|
2895
|
+
var canvas = _a.canvas, stateMachine = _a.stateMachine, rive = _a.rive, hasFocusNodes = _a.hasFocusNodes;
|
|
2896
|
+
if (!canvas ||
|
|
2897
|
+
!stateMachine ||
|
|
2898
|
+
!rive ||
|
|
2899
|
+
typeof window === "undefined") {
|
|
2900
|
+
return null;
|
|
2901
|
+
}
|
|
2902
|
+
// Work off an assumption of a single state machine
|
|
2903
|
+
var mainSm = stateMachine;
|
|
2904
|
+
var canvasHasFocus = false;
|
|
2905
|
+
var onCanvasFocus = function (_event) {
|
|
2906
|
+
canvasHasFocus = true;
|
|
2907
|
+
};
|
|
2908
|
+
var onCanvasBlur = function (_event) {
|
|
2909
|
+
canvasHasFocus = false;
|
|
2910
|
+
};
|
|
2911
|
+
var onKeyDown = function (event) {
|
|
2912
|
+
if (!canvasHasFocus)
|
|
2913
|
+
return;
|
|
2914
|
+
if (event.code === "Tab" && hasFocusNodes) {
|
|
2915
|
+
var forward = !event.shiftKey;
|
|
2916
|
+
var focusMoved = forward ? mainSm.focusNext() : mainSm.focusPrevious();
|
|
2917
|
+
if (focusMoved) {
|
|
2918
|
+
// Keep Tab inside the canvas — a Rive node received focus.
|
|
2919
|
+
event.preventDefault();
|
|
2920
|
+
}
|
|
2921
|
+
else {
|
|
2922
|
+
// No more traversable nodes — release Tab to the page.
|
|
2923
|
+
// Since we're not preventing default, blur event will fire on the canvas
|
|
2924
|
+
canvasHasFocus = false;
|
|
2925
|
+
}
|
|
2926
|
+
}
|
|
2927
|
+
};
|
|
2928
|
+
canvas.addEventListener("focus", onCanvasFocus);
|
|
2929
|
+
canvas.addEventListener("blur", onCanvasBlur);
|
|
2930
|
+
canvas.addEventListener("keydown", onKeyDown);
|
|
2931
|
+
return function () {
|
|
2932
|
+
canvas.removeEventListener("focus", onCanvasFocus);
|
|
2933
|
+
canvas.removeEventListener("blur", onCanvasBlur);
|
|
2934
|
+
canvas.removeEventListener("keydown", onKeyDown);
|
|
2935
|
+
};
|
|
2936
|
+
};
|
|
2937
|
+
|
|
2938
|
+
|
|
2939
|
+
/***/ }),
|
|
2940
|
+
/* 9 */
|
|
2941
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
2942
|
+
|
|
2878
2943
|
__webpack_require__.r(__webpack_exports__);
|
|
2879
2944
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
2880
2945
|
/* harmony export */ BLANK_URL: () => (/* binding */ BLANK_URL),
|
|
@@ -2925,7 +2990,7 @@ function sanitizeUrl(url) {
|
|
|
2925
2990
|
|
|
2926
2991
|
|
|
2927
2992
|
/***/ }),
|
|
2928
|
-
/*
|
|
2993
|
+
/* 10 */
|
|
2929
2994
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
2930
2995
|
|
|
2931
2996
|
__webpack_require__.r(__webpack_exports__);
|
|
@@ -3204,7 +3269,7 @@ var createFinalization = function (target, finalizable) {
|
|
|
3204
3269
|
|
|
3205
3270
|
|
|
3206
3271
|
/***/ }),
|
|
3207
|
-
/*
|
|
3272
|
+
/* 11 */
|
|
3208
3273
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
3209
3274
|
|
|
3210
3275
|
__webpack_require__.r(__webpack_exports__);
|
|
@@ -4823,8 +4888,10 @@ var Rive = /** @class */ (function () {
|
|
|
4823
4888
|
this.readyForPlaying = false;
|
|
4824
4889
|
// Runtime artboard
|
|
4825
4890
|
this.artboard = null;
|
|
4826
|
-
// place to clear up event listeners
|
|
4891
|
+
// place to clear up pointer/touch event listeners
|
|
4827
4892
|
this.eventCleanup = null;
|
|
4893
|
+
// place to clear up focus/keyboard event listeners
|
|
4894
|
+
this.keyboardEventCleanup = null;
|
|
4828
4895
|
this.shouldDisableRiveListeners = false;
|
|
4829
4896
|
this.automaticallyHandleEvents = false;
|
|
4830
4897
|
this.dispatchPointerExit = true;
|
|
@@ -4852,8 +4919,16 @@ var Rive = /** @class */ (function () {
|
|
|
4852
4919
|
this._audioEventListener = null;
|
|
4853
4920
|
// draw method bound to the class
|
|
4854
4921
|
this._boundDraw = null;
|
|
4922
|
+
// Page visibility handler — prevents state machine advancing / rAF from being invoked with large time delta
|
|
4923
|
+
// when the browser tab is switched back to after being hidden.
|
|
4924
|
+
this._pageVisibilityHandler = null;
|
|
4925
|
+
// True only when the page visibility handler itself cancelled an active frame.
|
|
4926
|
+
// Set by stopRendering(), cleared by startRendering(). Prevents the
|
|
4927
|
+
// visibilitychange handler from restarting a rendering loop the caller intentionally stopped.
|
|
4928
|
+
this._explicitlyStoppedRendering = false;
|
|
4855
4929
|
this._viewModelInstance = null;
|
|
4856
4930
|
this._dataEnums = null;
|
|
4931
|
+
this._tabIndex = null;
|
|
4857
4932
|
this.drawOptimization = DrawOptimizationOptions.DrawOnChanged;
|
|
4858
4933
|
// When true, emits performance.mark/measure entries for load and render.
|
|
4859
4934
|
this.enablePerfMarks = false;
|
|
@@ -4874,12 +4949,18 @@ var Rive = /** @class */ (function () {
|
|
|
4874
4949
|
_this.resizeToCanvas();
|
|
4875
4950
|
}
|
|
4876
4951
|
};
|
|
4952
|
+
// Tracks the current animation frame request
|
|
4953
|
+
this.frameRequestId = null;
|
|
4877
4954
|
/**
|
|
4878
4955
|
* Used be draw to track when a second of active rendering time has passed.
|
|
4879
4956
|
* Used for debugging purposes
|
|
4880
4957
|
*/
|
|
4881
4958
|
this.renderSecondTimer = 0;
|
|
4882
4959
|
this._boundDraw = this.draw.bind(this);
|
|
4960
|
+
if (typeof document !== 'undefined') {
|
|
4961
|
+
this._pageVisibilityHandler = this._onPageVisibilityChange.bind(this);
|
|
4962
|
+
document.addEventListener('visibilitychange', this._pageVisibilityHandler);
|
|
4963
|
+
}
|
|
4883
4964
|
this.canvas = params.canvas;
|
|
4884
4965
|
if (params.canvas.constructor === HTMLCanvasElement) {
|
|
4885
4966
|
this._observed = observers.add(this.canvas, this.onCanvasResize);
|
|
@@ -4958,6 +5039,7 @@ var Rive = /** @class */ (function () {
|
|
|
4958
5039
|
stateMachines: params.stateMachines,
|
|
4959
5040
|
artboard: params.artboard,
|
|
4960
5041
|
useOffscreenRenderer: params.useOffscreenRenderer,
|
|
5042
|
+
tabIndex: params.tabIndex,
|
|
4961
5043
|
});
|
|
4962
5044
|
}
|
|
4963
5045
|
Object.defineProperty(Rive.prototype, "viewModelCount", {
|
|
@@ -4979,13 +5061,14 @@ var Rive = /** @class */ (function () {
|
|
|
4979
5061
|
// Initializes the Rive object either from constructor or load()
|
|
4980
5062
|
Rive.prototype.init = function (_a) {
|
|
4981
5063
|
var _this = this;
|
|
4982
|
-
var src = _a.src, buffer = _a.buffer, riveFile = _a.riveFile, animations = _a.animations, stateMachines = _a.stateMachines, artboard = _a.artboard, _b = _a.autoplay, autoplay = _b === void 0 ? false : _b, _c = _a.useOffscreenRenderer, useOffscreenRenderer = _c === void 0 ? false : _c, _d = _a.autoBind, autoBind = _d === void 0 ? false : _d;
|
|
5064
|
+
var src = _a.src, buffer = _a.buffer, riveFile = _a.riveFile, animations = _a.animations, stateMachines = _a.stateMachines, artboard = _a.artboard, _b = _a.autoplay, autoplay = _b === void 0 ? false : _b, _c = _a.useOffscreenRenderer, useOffscreenRenderer = _c === void 0 ? false : _c, _d = _a.autoBind, autoBind = _d === void 0 ? false : _d, tabIndex = _a.tabIndex;
|
|
4983
5065
|
if (this.destroyed) {
|
|
4984
5066
|
return;
|
|
4985
5067
|
}
|
|
4986
5068
|
this.src = src;
|
|
4987
5069
|
this.buffer = buffer;
|
|
4988
5070
|
this.riveFile = riveFile;
|
|
5071
|
+
this._tabIndex = tabIndex !== null && tabIndex !== void 0 ? tabIndex : null;
|
|
4989
5072
|
// If no source file url specified, it's a bust
|
|
4990
5073
|
if (!this.src && !this.buffer && !this.riveFile) {
|
|
4991
5074
|
throw new RiveError(Rive.missingErrorMessage);
|
|
@@ -5056,9 +5139,14 @@ var Rive = /** @class */ (function () {
|
|
|
5056
5139
|
if (this.eventCleanup) {
|
|
5057
5140
|
this.eventCleanup();
|
|
5058
5141
|
}
|
|
5142
|
+
if (this.keyboardEventCleanup) {
|
|
5143
|
+
this.keyboardEventCleanup();
|
|
5144
|
+
this.keyboardEventCleanup = null;
|
|
5145
|
+
}
|
|
5059
5146
|
if (!this.shouldDisableRiveListeners) {
|
|
5060
|
-
var
|
|
5061
|
-
|
|
5147
|
+
var playingStateMachines = this.animator.stateMachines.filter(function (sm) { return sm.playing; });
|
|
5148
|
+
var activeStateMachines = playingStateMachines
|
|
5149
|
+
.filter(function (sm) { return _this.runtime.hasListeners(sm.instance); })
|
|
5062
5150
|
.map(function (sm) { return sm.instance; });
|
|
5063
5151
|
var touchScrollEnabledOption = this.isTouchScrollEnabled;
|
|
5064
5152
|
var dispatchPointerExit = this.dispatchPointerExit;
|
|
@@ -5080,6 +5168,27 @@ var Rive = /** @class */ (function () {
|
|
|
5080
5168
|
enableMultiTouch: enableMultiTouch,
|
|
5081
5169
|
layoutScaleFactor: this._layout.layoutScaleFactor,
|
|
5082
5170
|
});
|
|
5171
|
+
// Wire up keyboard interactions for state machines that have focus nodes.
|
|
5172
|
+
// hasFocusNodes — unified focus tree check, gates tab traversal
|
|
5173
|
+
var smWithFocusNodes = playingStateMachines
|
|
5174
|
+
.filter(function (sm) { return sm.instance.hasFocusNodes(); })
|
|
5175
|
+
.map(function (sm) { return sm.instance; });
|
|
5176
|
+
if (smWithFocusNodes.length) {
|
|
5177
|
+
// Set the canvas as a tabbable element if there are any focus nodes.
|
|
5178
|
+
// Prefer the tabIndex param set by the user, otherwise use 0.
|
|
5179
|
+
// But do not override any explicit tabIndex already set on the canvas, if any.
|
|
5180
|
+
var currentCanvasTabIndex = this.canvas.tabIndex;
|
|
5181
|
+
// By default, canvas elements have a tabIndex of -1
|
|
5182
|
+
if (currentCanvasTabIndex === -1 || isNaN(currentCanvasTabIndex)) {
|
|
5183
|
+
this.canvas.tabIndex = (this._tabIndex !== null ? this._tabIndex : 0);
|
|
5184
|
+
}
|
|
5185
|
+
this.keyboardEventCleanup = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.registerKeyboardInteractions)({
|
|
5186
|
+
canvas: this.canvas,
|
|
5187
|
+
stateMachine: smWithFocusNodes[0], // work off assumption of single state machine
|
|
5188
|
+
rive: this.runtime,
|
|
5189
|
+
hasFocusNodes: smWithFocusNodes.length > 0,
|
|
5190
|
+
});
|
|
5191
|
+
}
|
|
5083
5192
|
}
|
|
5084
5193
|
};
|
|
5085
5194
|
/**
|
|
@@ -5090,6 +5199,10 @@ var Rive = /** @class */ (function () {
|
|
|
5090
5199
|
this.eventCleanup();
|
|
5091
5200
|
this.eventCleanup = null;
|
|
5092
5201
|
}
|
|
5202
|
+
if (this.keyboardEventCleanup) {
|
|
5203
|
+
this.keyboardEventCleanup();
|
|
5204
|
+
this.keyboardEventCleanup = null;
|
|
5205
|
+
}
|
|
5093
5206
|
};
|
|
5094
5207
|
/**
|
|
5095
5208
|
* If the instance has audio and the system audio is not ready
|
|
@@ -5489,6 +5602,10 @@ var Rive = /** @class */ (function () {
|
|
|
5489
5602
|
audioManager.remove(this._audioEventListener);
|
|
5490
5603
|
this._audioEventListener = null;
|
|
5491
5604
|
}
|
|
5605
|
+
if (this._pageVisibilityHandler) {
|
|
5606
|
+
document.removeEventListener('visibilitychange', this._pageVisibilityHandler);
|
|
5607
|
+
this._pageVisibilityHandler = null;
|
|
5608
|
+
}
|
|
5492
5609
|
(_b = this._viewModelInstance) === null || _b === void 0 ? void 0 : _b.cleanup();
|
|
5493
5610
|
this._viewModelInstance = null;
|
|
5494
5611
|
this._dataEnums = null;
|
|
@@ -5513,6 +5630,10 @@ var Rive = /** @class */ (function () {
|
|
|
5513
5630
|
if (this.eventCleanup !== null) {
|
|
5514
5631
|
this.eventCleanup();
|
|
5515
5632
|
}
|
|
5633
|
+
if (this.keyboardEventCleanup) {
|
|
5634
|
+
this.keyboardEventCleanup();
|
|
5635
|
+
this.keyboardEventCleanup = null;
|
|
5636
|
+
}
|
|
5516
5637
|
// Delete all animation and state machine instances
|
|
5517
5638
|
this.stop();
|
|
5518
5639
|
if (this.artboard) {
|
|
@@ -5581,6 +5702,10 @@ var Rive = /** @class */ (function () {
|
|
|
5581
5702
|
if (this.eventCleanup) {
|
|
5582
5703
|
this.eventCleanup();
|
|
5583
5704
|
}
|
|
5705
|
+
if (this.keyboardEventCleanup) {
|
|
5706
|
+
this.keyboardEventCleanup();
|
|
5707
|
+
this.keyboardEventCleanup = null;
|
|
5708
|
+
}
|
|
5584
5709
|
this.setupRiveListeners();
|
|
5585
5710
|
this.startRendering();
|
|
5586
5711
|
};
|
|
@@ -5598,6 +5723,10 @@ var Rive = /** @class */ (function () {
|
|
|
5598
5723
|
if (this.eventCleanup) {
|
|
5599
5724
|
this.eventCleanup();
|
|
5600
5725
|
}
|
|
5726
|
+
if (this.keyboardEventCleanup) {
|
|
5727
|
+
this.keyboardEventCleanup();
|
|
5728
|
+
this.keyboardEventCleanup = null;
|
|
5729
|
+
}
|
|
5601
5730
|
this.animator.pause(animationNames);
|
|
5602
5731
|
};
|
|
5603
5732
|
Rive.prototype.scrub = function (animationNames, value) {
|
|
@@ -5633,6 +5762,10 @@ var Rive = /** @class */ (function () {
|
|
|
5633
5762
|
if (this.eventCleanup) {
|
|
5634
5763
|
this.eventCleanup();
|
|
5635
5764
|
}
|
|
5765
|
+
if (this.keyboardEventCleanup) {
|
|
5766
|
+
this.keyboardEventCleanup();
|
|
5767
|
+
this.keyboardEventCleanup = null;
|
|
5768
|
+
}
|
|
5636
5769
|
};
|
|
5637
5770
|
/**
|
|
5638
5771
|
* Resets the animation
|
|
@@ -6092,6 +6225,7 @@ var Rive = /** @class */ (function () {
|
|
|
6092
6225
|
* they would have been at if rendering had not been stopped.
|
|
6093
6226
|
*/
|
|
6094
6227
|
Rive.prototype.stopRendering = function () {
|
|
6228
|
+
this._explicitlyStoppedRendering = true;
|
|
6095
6229
|
if (this.loaded && this.frameRequestId) {
|
|
6096
6230
|
if (this.runtime.cancelAnimationFrame) {
|
|
6097
6231
|
this.runtime.cancelAnimationFrame(this.frameRequestId);
|
|
@@ -6107,6 +6241,7 @@ var Rive = /** @class */ (function () {
|
|
|
6107
6241
|
* renderer is already active, then this will have zero effect.
|
|
6108
6242
|
*/
|
|
6109
6243
|
Rive.prototype.startRendering = function () {
|
|
6244
|
+
this._explicitlyStoppedRendering = false;
|
|
6110
6245
|
this.drawFrame();
|
|
6111
6246
|
};
|
|
6112
6247
|
Rive.prototype.scheduleRendering = function () {
|
|
@@ -6119,6 +6254,31 @@ var Rive = /** @class */ (function () {
|
|
|
6119
6254
|
}
|
|
6120
6255
|
}
|
|
6121
6256
|
};
|
|
6257
|
+
/**
|
|
6258
|
+
* Called when document.visibilitychange fires (tab change, window minimize, etc.).
|
|
6259
|
+
* Cancels the rAF loop on hide and resets the time reference so that no accumulated time is
|
|
6260
|
+
* applied to state machines when the tab becomes visible again. This prevents state machine
|
|
6261
|
+
* advances with large time deltas when rAF starts up again.
|
|
6262
|
+
*/
|
|
6263
|
+
Rive.prototype._onPageVisibilityChange = function () {
|
|
6264
|
+
var _a, _b;
|
|
6265
|
+
if (document.hidden) {
|
|
6266
|
+
if (this.frameRequestId !== null) {
|
|
6267
|
+
if ((_a = this.runtime) === null || _a === void 0 ? void 0 : _a.cancelAnimationFrame) {
|
|
6268
|
+
this.runtime.cancelAnimationFrame(this.frameRequestId);
|
|
6269
|
+
}
|
|
6270
|
+
else {
|
|
6271
|
+
cancelAnimationFrame(this.frameRequestId);
|
|
6272
|
+
}
|
|
6273
|
+
this.frameRequestId = null;
|
|
6274
|
+
}
|
|
6275
|
+
// Reset so the first resumed frame starts with elapsedTime === 0.
|
|
6276
|
+
this.lastRenderTime = 0;
|
|
6277
|
+
}
|
|
6278
|
+
else if (((_b = this.animator) === null || _b === void 0 ? void 0 : _b.isPlaying) && !this._explicitlyStoppedRendering) {
|
|
6279
|
+
this.scheduleRendering();
|
|
6280
|
+
}
|
|
6281
|
+
};
|
|
6122
6282
|
/**
|
|
6123
6283
|
* Enables frames-per-second (FPS) reporting for the runtime
|
|
6124
6284
|
* If no callback is provided, Rive will append a fixed-position div at the top-right corner of
|