@amazon-devices/lottie-react-native 3.0.9000000000 → 3.0.9000000002
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/SystemModules/amzn__lottie-react-native-3.private.modules.txt +55 -54
- package/kepler-compatibility.json +4 -2
- package/lib/commonjs/index.js +0 -8
- package/lib/commonjs/specs/LottieAnimationViewNativeComponent.js.map +1 -1
- package/lib/module/specs/LottieAnimationViewNativeComponent.js.map +1 -1
- package/package.json +1 -1
- package/src/index.tsx +1 -2
- package/SystemBundles/735b44a50dba3b902c82350fcec8a8bf35be02aae8115d61ab1fcdfaad4482e5.bundle +0 -8258
- package/SystemBundles/735b44a50dba3b902c82350fcec8a8bf35be02aae8115d61ab1fcdfaad4482e5.map +0 -2950
- package/lib/commonjs/LottieView.js +0 -207
- package/lib/commonjs/LottieView.types.js +0 -6
- package/lib/commonjs/specs/LottieAnimationViewNativeComponent.js +0 -97
- package/lib/module/LottieView.js +0 -201
- package/lib/module/LottieView.types.js +0 -2
- package/lib/module/index.js +0 -3
- package/lib/module/specs/LottieAnimationViewNativeComponent.js +0 -91
- package/src/LottieView.tsx +0 -257
- package/src/LottieView.types.ts +0 -275
- package/src/__tests__/validate-public-api.test.js +0 -33
- package/src/specs/LottieAnimationViewNativeComponent.ts +0 -170
|
@@ -1,207 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.AnimatedLottieView = void 0;
|
|
7
|
-
var _react = _interopRequireDefault(require("react"));
|
|
8
|
-
var _reactNative = require("react-native");
|
|
9
|
-
var _LottieAnimationViewNativeComponent = _interopRequireWildcard(require("./specs/LottieAnimationViewNativeComponent"));
|
|
10
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
11
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
12
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
13
|
-
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
14
|
-
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
15
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
|
|
16
|
-
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /*
|
|
17
|
-
* Portions of this file are copyright (c) 2023 Amazon.com, Inc. or its affiliates. All rights reserved.
|
|
18
|
-
*
|
|
19
|
-
* PORTIONS OF THIS FILE ARE AMAZON PROPRIETARY/CONFIDENTIAL. USE IS SUBJECT TO LICENSE TERMS.
|
|
20
|
-
*
|
|
21
|
-
* Amazon modifications are indicated by [amznmod_* comments].
|
|
22
|
-
*/ /*
|
|
23
|
-
* Changelog:
|
|
24
|
-
* Set up lottie-react-native package to build for Kepler
|
|
25
|
-
*/
|
|
26
|
-
const AnimatedNativeLottieView = _reactNative.Animated.createAnimatedComponent(_LottieAnimationViewNativeComponent.default);
|
|
27
|
-
|
|
28
|
-
// amznmod_react - add textFiltersKepler prop for Kepler
|
|
29
|
-
const defaultProps = {
|
|
30
|
-
source: undefined,
|
|
31
|
-
progress: 0,
|
|
32
|
-
speed: 1,
|
|
33
|
-
loop: true,
|
|
34
|
-
autoPlay: false,
|
|
35
|
-
autoSize: false,
|
|
36
|
-
enableMergePathsAndroidForKitKatAndAbove: false,
|
|
37
|
-
cacheComposition: true,
|
|
38
|
-
useNativeLooping: false,
|
|
39
|
-
resizeMode: 'contain',
|
|
40
|
-
colorFilters: [],
|
|
41
|
-
textFiltersAndroid: [],
|
|
42
|
-
textFiltersIOS: [],
|
|
43
|
-
textFiltersKepler: []
|
|
44
|
-
};
|
|
45
|
-
|
|
46
|
-
/**
|
|
47
|
-
* View hosting the lottie animation.
|
|
48
|
-
*/
|
|
49
|
-
class AnimatedLottieView extends _react.default.PureComponent {
|
|
50
|
-
constructor(props) {
|
|
51
|
-
super(props);
|
|
52
|
-
_defineProperty(this, "_lottieAnimationViewRef", void 0);
|
|
53
|
-
_defineProperty(this, "onAnimationFinish", evt => {
|
|
54
|
-
if (this.props.onAnimationFinish) {
|
|
55
|
-
this.props.onAnimationFinish(evt.nativeEvent.isCancelled);
|
|
56
|
-
}
|
|
57
|
-
});
|
|
58
|
-
// amznmod_react - onAnimationLoad callback
|
|
59
|
-
_defineProperty(this, "onAnimationLoad", () => {
|
|
60
|
-
if (this.props.onAnimationLoad) {
|
|
61
|
-
this.props.onAnimationLoad();
|
|
62
|
-
}
|
|
63
|
-
});
|
|
64
|
-
// PROJ*-136246 - deprecate onAnimationJsonLoad
|
|
65
|
-
// amznmod_react - onAnimationLoad callback
|
|
66
|
-
_defineProperty(this, "onAnimationJsonLoad", () => {
|
|
67
|
-
console.warn("onAnimationJsonLoad will be deprecated in favor of onAnimationLoad. Migrate to use onAnimationLoad.");
|
|
68
|
-
if (this.props.onAnimationJsonLoad) {
|
|
69
|
-
this.props.onAnimationJsonLoad();
|
|
70
|
-
}
|
|
71
|
-
});
|
|
72
|
-
// amznmod_react - onAnimationPlay callback
|
|
73
|
-
_defineProperty(this, "onAnimationPlay", () => {
|
|
74
|
-
if (this.props.onAnimationPlay) {
|
|
75
|
-
this.props.onAnimationPlay();
|
|
76
|
-
}
|
|
77
|
-
});
|
|
78
|
-
// amznmod_react - onAnimationPause callback
|
|
79
|
-
_defineProperty(this, "onAnimationPause", () => {
|
|
80
|
-
if (this.props.onAnimationPause) {
|
|
81
|
-
this.props.onAnimationPause();
|
|
82
|
-
}
|
|
83
|
-
});
|
|
84
|
-
// amznmod_react - onAnimationResume callback
|
|
85
|
-
_defineProperty(this, "onAnimationResume", () => {
|
|
86
|
-
if (this.props.onAnimationResume) {
|
|
87
|
-
this.props.onAnimationResume();
|
|
88
|
-
}
|
|
89
|
-
});
|
|
90
|
-
this.play = this.play.bind(this);
|
|
91
|
-
this.reset = this.reset.bind(this);
|
|
92
|
-
this.pause = this.pause.bind(this);
|
|
93
|
-
this.resume = this.resume.bind(this);
|
|
94
|
-
this.onAnimationFinish = this.onAnimationFinish.bind(this);
|
|
95
|
-
this._captureRef = this._captureRef.bind(this);
|
|
96
|
-
// amznmod_react - add onAnimation... callbacks
|
|
97
|
-
this.onAnimationLoad = this.onAnimationLoad.bind(this);
|
|
98
|
-
this.onAnimationPlay = this.onAnimationPlay.bind(this);
|
|
99
|
-
this.onAnimationPause = this.onAnimationPause.bind(this);
|
|
100
|
-
this.onAnimationResume = this.onAnimationResume.bind(this);
|
|
101
|
-
this.onAnimationJsonLoad = this.onAnimationJsonLoad.bind(this);
|
|
102
|
-
}
|
|
103
|
-
componentDidUpdate(prevProps) {
|
|
104
|
-
if (this.props.autoPlay === true && this.props.source !== prevProps.source && !!this.props.source) {
|
|
105
|
-
this.play();
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
play(startFrame, endFrame) {
|
|
109
|
-
_LottieAnimationViewNativeComponent.Commands.play(this._lottieAnimationViewRef, startFrame !== null && startFrame !== void 0 ? startFrame : -1, endFrame !== null && endFrame !== void 0 ? endFrame : -1);
|
|
110
|
-
}
|
|
111
|
-
reset() {
|
|
112
|
-
_LottieAnimationViewNativeComponent.Commands.reset(this._lottieAnimationViewRef);
|
|
113
|
-
}
|
|
114
|
-
pause() {
|
|
115
|
-
_LottieAnimationViewNativeComponent.Commands.pause(this._lottieAnimationViewRef);
|
|
116
|
-
}
|
|
117
|
-
resume() {
|
|
118
|
-
_LottieAnimationViewNativeComponent.Commands.resume(this._lottieAnimationViewRef);
|
|
119
|
-
}
|
|
120
|
-
_captureRef(ref) {
|
|
121
|
-
if (ref === null) {
|
|
122
|
-
return;
|
|
123
|
-
}
|
|
124
|
-
this._lottieAnimationViewRef = ref;
|
|
125
|
-
// amznmod_react - Fix for a crash on autoplay + progress with animation
|
|
126
|
-
if (this._lottieAnimationViewRef && this.props.autoPlay === true) {
|
|
127
|
-
this.play();
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
render() {
|
|
131
|
-
var _this$props$colorFilt;
|
|
132
|
-
// amznmod_react - add textFiltersKepler prop
|
|
133
|
-
const {
|
|
134
|
-
style,
|
|
135
|
-
source,
|
|
136
|
-
autoSize,
|
|
137
|
-
autoPlay,
|
|
138
|
-
duration,
|
|
139
|
-
textFiltersAndroid,
|
|
140
|
-
textFiltersIOS,
|
|
141
|
-
textFiltersKepler,
|
|
142
|
-
...rest
|
|
143
|
-
} = this.props;
|
|
144
|
-
const sourceName = typeof source === 'string' ? source : undefined;
|
|
145
|
-
const sourceJson = typeof source === 'object' && !source.uri ? JSON.stringify(source) : undefined;
|
|
146
|
-
const sourceURL = typeof source === 'object' && source.uri ? source.uri : undefined;
|
|
147
|
-
const aspectRatioStyle = sourceJson ? {
|
|
148
|
-
aspectRatio: source.w / source.h
|
|
149
|
-
} : undefined;
|
|
150
|
-
const styleObject = _reactNative.StyleSheet.flatten(style);
|
|
151
|
-
let sizeStyle;
|
|
152
|
-
if (!styleObject || styleObject.width === undefined && styleObject.height === undefined) {
|
|
153
|
-
sizeStyle = autoSize && sourceJson ? {
|
|
154
|
-
width: source.w
|
|
155
|
-
} : _reactNative.StyleSheet.absoluteFill;
|
|
156
|
-
}
|
|
157
|
-
const speed = duration && sourceJson && source.fr ? Math.round(source.op / source.fr * 1000 / duration) : this.props.speed;
|
|
158
|
-
const colorFilters = (_this$props$colorFilt = this.props.colorFilters) === null || _this$props$colorFilt === void 0 ? void 0 : _this$props$colorFilt.map(colorFilter => ({
|
|
159
|
-
...colorFilter,
|
|
160
|
-
color: (0, _reactNative.processColor)(colorFilter.color)
|
|
161
|
-
}));
|
|
162
|
-
// amznmod_react - Clip LottieView on ReactNative
|
|
163
|
-
const baseStyle = {
|
|
164
|
-
overflow: 'hidden'
|
|
165
|
-
};
|
|
166
|
-
return (
|
|
167
|
-
/*#__PURE__*/
|
|
168
|
-
// amznmod_react - Clip LottieView on ReactNative
|
|
169
|
-
_react.default.createElement(_reactNative.View, {
|
|
170
|
-
style: [aspectRatioStyle, sizeStyle, style, baseStyle]
|
|
171
|
-
}, /*#__PURE__*/_react.default.createElement(AnimatedNativeLottieView, _extends({
|
|
172
|
-
ref: this._captureRef
|
|
173
|
-
}, rest, {
|
|
174
|
-
// amznmod_react - add autoPlay prop
|
|
175
|
-
autoPlay: autoPlay,
|
|
176
|
-
colorFilters: colorFilters,
|
|
177
|
-
textFiltersAndroid: textFiltersAndroid,
|
|
178
|
-
textFiltersIOS: textFiltersIOS
|
|
179
|
-
// amznmod_react - add textFiltersKepler prop
|
|
180
|
-
// amznmod_react - Clip LottieView on ReactNative
|
|
181
|
-
,
|
|
182
|
-
textFiltersKepler: textFiltersKepler,
|
|
183
|
-
speed: speed,
|
|
184
|
-
style: [aspectRatioStyle, sizeStyle || {
|
|
185
|
-
width: '100%',
|
|
186
|
-
height: '100%'
|
|
187
|
-
}, style, baseStyle],
|
|
188
|
-
sourceName: sourceName,
|
|
189
|
-
sourceJson: sourceJson,
|
|
190
|
-
sourceURL: sourceURL,
|
|
191
|
-
onAnimationFinish: this.onAnimationFinish
|
|
192
|
-
//amznmod_react - add onAnimation... callbacks
|
|
193
|
-
,
|
|
194
|
-
onAnimationLoad: this.onAnimationLoad,
|
|
195
|
-
onAnimationPlay: this.onAnimationPlay,
|
|
196
|
-
onAnimationPause: this.onAnimationPause,
|
|
197
|
-
onAnimationResume: this.onAnimationResume
|
|
198
|
-
// PROJ*-136246 - deprecate onAnimationJsonLoad
|
|
199
|
-
,
|
|
200
|
-
onAnimationJsonLoad: this.onAnimationJsonLoad
|
|
201
|
-
})))
|
|
202
|
-
);
|
|
203
|
-
}
|
|
204
|
-
}
|
|
205
|
-
exports.AnimatedLottieView = AnimatedLottieView;
|
|
206
|
-
_defineProperty(AnimatedLottieView, "defaultProps", defaultProps);
|
|
207
|
-
//# sourceMappingURL=LottieView.js.map
|
|
@@ -1,97 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = exports.Commands = void 0;
|
|
7
|
-
var _codegenNativeCommands = _interopRequireDefault(require("react-native/Libraries/Utilities/codegenNativeCommands"));
|
|
8
|
-
var _registerGeneratedViewConfig = _interopRequireDefault(require("@amazon-devices/react-native-kepler/Libraries/Utilities/registerGeneratedViewConfig"));
|
|
9
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
-
/*
|
|
11
|
-
* Portions of this file are copyright (c) 2023 Amazon.com, Inc. or its affiliates. All rights reserved.
|
|
12
|
-
*
|
|
13
|
-
* PORTIONS OF THIS FILE ARE AMAZON PROPRIETARY/CONFIDENTIAL. USE IS SUBJECT TO LICENSE TERMS.
|
|
14
|
-
*
|
|
15
|
-
* Amazon modifications are indicated by [amznmod_* comments].
|
|
16
|
-
*/
|
|
17
|
-
|
|
18
|
-
/*
|
|
19
|
-
* Changelog:
|
|
20
|
-
* Set up lottie-react-native package to build for Kepler
|
|
21
|
-
*/
|
|
22
|
-
|
|
23
|
-
// amznmod_react - add EmptyEvent type
|
|
24
|
-
|
|
25
|
-
// amznmod_react - change NativeComponentType to HostComponent
|
|
26
|
-
|
|
27
|
-
const Commands = exports.Commands = (0, _codegenNativeCommands.default)({
|
|
28
|
-
supportedCommands: ['play', 'reset', 'pause', 'resume']
|
|
29
|
-
});
|
|
30
|
-
|
|
31
|
-
// amznmod_react - native component registration to build for Kepler
|
|
32
|
-
const LottieNativeComponent = 'LottieAnimationView';
|
|
33
|
-
const viewConfig = {
|
|
34
|
-
autoPlay: true,
|
|
35
|
-
sourceName: true,
|
|
36
|
-
resizeMode: true,
|
|
37
|
-
renderMode: true,
|
|
38
|
-
sourceJson: true,
|
|
39
|
-
sourceURL: true,
|
|
40
|
-
imageAssetsFolder: true,
|
|
41
|
-
progress: true,
|
|
42
|
-
speed: true,
|
|
43
|
-
loop: true,
|
|
44
|
-
enableMergePathsAndroidForKitKatAndAbove: true,
|
|
45
|
-
hardwareAccelerationAndroid: true,
|
|
46
|
-
cacheComposition: true,
|
|
47
|
-
colorFilters: true,
|
|
48
|
-
textFiltersAndroid: true,
|
|
49
|
-
textFiltersIOS: true,
|
|
50
|
-
textFiltersKepler: true
|
|
51
|
-
};
|
|
52
|
-
const bubblingEventTypes = {
|
|
53
|
-
topAnimationFinish: {
|
|
54
|
-
phasedRegistrationNames: {
|
|
55
|
-
bubbled: 'onAnimationFinish',
|
|
56
|
-
captured: 'onAnimationFinishCapture'
|
|
57
|
-
}
|
|
58
|
-
},
|
|
59
|
-
topAnimationLoad: {
|
|
60
|
-
phasedRegistrationNames: {
|
|
61
|
-
bubbled: 'onAnimationLoad',
|
|
62
|
-
captured: 'onAnimationLoadCapture'
|
|
63
|
-
}
|
|
64
|
-
},
|
|
65
|
-
// PROJ*-136246 - deprecate onAnimationJsonLoad
|
|
66
|
-
topAnimationJsonLoad: {
|
|
67
|
-
phasedRegistrationNames: {
|
|
68
|
-
bubbled: 'onAnimationJsonLoad',
|
|
69
|
-
captured: 'onAnimationJsonLoadCapture'
|
|
70
|
-
}
|
|
71
|
-
},
|
|
72
|
-
topAnimationPlay: {
|
|
73
|
-
phasedRegistrationNames: {
|
|
74
|
-
bubbled: 'onAnimationPlay',
|
|
75
|
-
captured: 'onAnimationPlayCapture'
|
|
76
|
-
}
|
|
77
|
-
},
|
|
78
|
-
topAnimationPause: {
|
|
79
|
-
phasedRegistrationNames: {
|
|
80
|
-
bubbled: 'onAnimationPause',
|
|
81
|
-
captured: 'onAnimationPauseCapture'
|
|
82
|
-
}
|
|
83
|
-
},
|
|
84
|
-
topAnimationResume: {
|
|
85
|
-
phasedRegistrationNames: {
|
|
86
|
-
bubbled: 'onAnimationResume',
|
|
87
|
-
captured: 'onAnimationResumeCapture'
|
|
88
|
-
}
|
|
89
|
-
}
|
|
90
|
-
};
|
|
91
|
-
(0, _registerGeneratedViewConfig.default)(LottieNativeComponent, {
|
|
92
|
-
uiViewClassName: LottieNativeComponent,
|
|
93
|
-
validAttributes: viewConfig,
|
|
94
|
-
bubblingEventTypes: bubblingEventTypes
|
|
95
|
-
});
|
|
96
|
-
var _default = exports.default = LottieNativeComponent;
|
|
97
|
-
//# sourceMappingURL=LottieAnimationViewNativeComponent.js.map
|
package/lib/module/LottieView.js
DELETED
|
@@ -1,201 +0,0 @@
|
|
|
1
|
-
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
2
|
-
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
3
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
|
|
4
|
-
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
5
|
-
/*
|
|
6
|
-
* Portions of this file are copyright (c) 2023 Amazon.com, Inc. or its affiliates. All rights reserved.
|
|
7
|
-
*
|
|
8
|
-
* PORTIONS OF THIS FILE ARE AMAZON PROPRIETARY/CONFIDENTIAL. USE IS SUBJECT TO LICENSE TERMS.
|
|
9
|
-
*
|
|
10
|
-
* Amazon modifications are indicated by [amznmod_* comments].
|
|
11
|
-
*/
|
|
12
|
-
|
|
13
|
-
/*
|
|
14
|
-
* Changelog:
|
|
15
|
-
* Set up lottie-react-native package to build for Kepler
|
|
16
|
-
*/
|
|
17
|
-
|
|
18
|
-
import React from 'react';
|
|
19
|
-
import { View, StyleSheet, Animated, processColor } from 'react-native';
|
|
20
|
-
import NativeLottieAnimationView, { Commands } from './specs/LottieAnimationViewNativeComponent';
|
|
21
|
-
const AnimatedNativeLottieView = Animated.createAnimatedComponent(NativeLottieAnimationView);
|
|
22
|
-
|
|
23
|
-
// amznmod_react - add textFiltersKepler prop for Kepler
|
|
24
|
-
const defaultProps = {
|
|
25
|
-
source: undefined,
|
|
26
|
-
progress: 0,
|
|
27
|
-
speed: 1,
|
|
28
|
-
loop: true,
|
|
29
|
-
autoPlay: false,
|
|
30
|
-
autoSize: false,
|
|
31
|
-
enableMergePathsAndroidForKitKatAndAbove: false,
|
|
32
|
-
cacheComposition: true,
|
|
33
|
-
useNativeLooping: false,
|
|
34
|
-
resizeMode: 'contain',
|
|
35
|
-
colorFilters: [],
|
|
36
|
-
textFiltersAndroid: [],
|
|
37
|
-
textFiltersIOS: [],
|
|
38
|
-
textFiltersKepler: []
|
|
39
|
-
};
|
|
40
|
-
|
|
41
|
-
/**
|
|
42
|
-
* View hosting the lottie animation.
|
|
43
|
-
*/
|
|
44
|
-
export class AnimatedLottieView extends React.PureComponent {
|
|
45
|
-
constructor(props) {
|
|
46
|
-
super(props);
|
|
47
|
-
_defineProperty(this, "_lottieAnimationViewRef", void 0);
|
|
48
|
-
_defineProperty(this, "onAnimationFinish", evt => {
|
|
49
|
-
if (this.props.onAnimationFinish) {
|
|
50
|
-
this.props.onAnimationFinish(evt.nativeEvent.isCancelled);
|
|
51
|
-
}
|
|
52
|
-
});
|
|
53
|
-
// amznmod_react - onAnimationLoad callback
|
|
54
|
-
_defineProperty(this, "onAnimationLoad", () => {
|
|
55
|
-
if (this.props.onAnimationLoad) {
|
|
56
|
-
this.props.onAnimationLoad();
|
|
57
|
-
}
|
|
58
|
-
});
|
|
59
|
-
// PROJ*-136246 - deprecate onAnimationJsonLoad
|
|
60
|
-
// amznmod_react - onAnimationLoad callback
|
|
61
|
-
_defineProperty(this, "onAnimationJsonLoad", () => {
|
|
62
|
-
console.warn("onAnimationJsonLoad will be deprecated in favor of onAnimationLoad. Migrate to use onAnimationLoad.");
|
|
63
|
-
if (this.props.onAnimationJsonLoad) {
|
|
64
|
-
this.props.onAnimationJsonLoad();
|
|
65
|
-
}
|
|
66
|
-
});
|
|
67
|
-
// amznmod_react - onAnimationPlay callback
|
|
68
|
-
_defineProperty(this, "onAnimationPlay", () => {
|
|
69
|
-
if (this.props.onAnimationPlay) {
|
|
70
|
-
this.props.onAnimationPlay();
|
|
71
|
-
}
|
|
72
|
-
});
|
|
73
|
-
// amznmod_react - onAnimationPause callback
|
|
74
|
-
_defineProperty(this, "onAnimationPause", () => {
|
|
75
|
-
if (this.props.onAnimationPause) {
|
|
76
|
-
this.props.onAnimationPause();
|
|
77
|
-
}
|
|
78
|
-
});
|
|
79
|
-
// amznmod_react - onAnimationResume callback
|
|
80
|
-
_defineProperty(this, "onAnimationResume", () => {
|
|
81
|
-
if (this.props.onAnimationResume) {
|
|
82
|
-
this.props.onAnimationResume();
|
|
83
|
-
}
|
|
84
|
-
});
|
|
85
|
-
this.play = this.play.bind(this);
|
|
86
|
-
this.reset = this.reset.bind(this);
|
|
87
|
-
this.pause = this.pause.bind(this);
|
|
88
|
-
this.resume = this.resume.bind(this);
|
|
89
|
-
this.onAnimationFinish = this.onAnimationFinish.bind(this);
|
|
90
|
-
this._captureRef = this._captureRef.bind(this);
|
|
91
|
-
// amznmod_react - add onAnimation... callbacks
|
|
92
|
-
this.onAnimationLoad = this.onAnimationLoad.bind(this);
|
|
93
|
-
this.onAnimationPlay = this.onAnimationPlay.bind(this);
|
|
94
|
-
this.onAnimationPause = this.onAnimationPause.bind(this);
|
|
95
|
-
this.onAnimationResume = this.onAnimationResume.bind(this);
|
|
96
|
-
this.onAnimationJsonLoad = this.onAnimationJsonLoad.bind(this);
|
|
97
|
-
}
|
|
98
|
-
componentDidUpdate(prevProps) {
|
|
99
|
-
if (this.props.autoPlay === true && this.props.source !== prevProps.source && !!this.props.source) {
|
|
100
|
-
this.play();
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
play(startFrame, endFrame) {
|
|
104
|
-
Commands.play(this._lottieAnimationViewRef, startFrame !== null && startFrame !== void 0 ? startFrame : -1, endFrame !== null && endFrame !== void 0 ? endFrame : -1);
|
|
105
|
-
}
|
|
106
|
-
reset() {
|
|
107
|
-
Commands.reset(this._lottieAnimationViewRef);
|
|
108
|
-
}
|
|
109
|
-
pause() {
|
|
110
|
-
Commands.pause(this._lottieAnimationViewRef);
|
|
111
|
-
}
|
|
112
|
-
resume() {
|
|
113
|
-
Commands.resume(this._lottieAnimationViewRef);
|
|
114
|
-
}
|
|
115
|
-
_captureRef(ref) {
|
|
116
|
-
if (ref === null) {
|
|
117
|
-
return;
|
|
118
|
-
}
|
|
119
|
-
this._lottieAnimationViewRef = ref;
|
|
120
|
-
// amznmod_react - Fix for a crash on autoplay + progress with animation
|
|
121
|
-
if (this._lottieAnimationViewRef && this.props.autoPlay === true) {
|
|
122
|
-
this.play();
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
render() {
|
|
126
|
-
var _this$props$colorFilt;
|
|
127
|
-
// amznmod_react - add textFiltersKepler prop
|
|
128
|
-
const {
|
|
129
|
-
style,
|
|
130
|
-
source,
|
|
131
|
-
autoSize,
|
|
132
|
-
autoPlay,
|
|
133
|
-
duration,
|
|
134
|
-
textFiltersAndroid,
|
|
135
|
-
textFiltersIOS,
|
|
136
|
-
textFiltersKepler,
|
|
137
|
-
...rest
|
|
138
|
-
} = this.props;
|
|
139
|
-
const sourceName = typeof source === 'string' ? source : undefined;
|
|
140
|
-
const sourceJson = typeof source === 'object' && !source.uri ? JSON.stringify(source) : undefined;
|
|
141
|
-
const sourceURL = typeof source === 'object' && source.uri ? source.uri : undefined;
|
|
142
|
-
const aspectRatioStyle = sourceJson ? {
|
|
143
|
-
aspectRatio: source.w / source.h
|
|
144
|
-
} : undefined;
|
|
145
|
-
const styleObject = StyleSheet.flatten(style);
|
|
146
|
-
let sizeStyle;
|
|
147
|
-
if (!styleObject || styleObject.width === undefined && styleObject.height === undefined) {
|
|
148
|
-
sizeStyle = autoSize && sourceJson ? {
|
|
149
|
-
width: source.w
|
|
150
|
-
} : StyleSheet.absoluteFill;
|
|
151
|
-
}
|
|
152
|
-
const speed = duration && sourceJson && source.fr ? Math.round(source.op / source.fr * 1000 / duration) : this.props.speed;
|
|
153
|
-
const colorFilters = (_this$props$colorFilt = this.props.colorFilters) === null || _this$props$colorFilt === void 0 ? void 0 : _this$props$colorFilt.map(colorFilter => ({
|
|
154
|
-
...colorFilter,
|
|
155
|
-
color: processColor(colorFilter.color)
|
|
156
|
-
}));
|
|
157
|
-
// amznmod_react - Clip LottieView on ReactNative
|
|
158
|
-
const baseStyle = {
|
|
159
|
-
overflow: 'hidden'
|
|
160
|
-
};
|
|
161
|
-
return (
|
|
162
|
-
/*#__PURE__*/
|
|
163
|
-
// amznmod_react - Clip LottieView on ReactNative
|
|
164
|
-
React.createElement(View, {
|
|
165
|
-
style: [aspectRatioStyle, sizeStyle, style, baseStyle]
|
|
166
|
-
}, /*#__PURE__*/React.createElement(AnimatedNativeLottieView, _extends({
|
|
167
|
-
ref: this._captureRef
|
|
168
|
-
}, rest, {
|
|
169
|
-
// amznmod_react - add autoPlay prop
|
|
170
|
-
autoPlay: autoPlay,
|
|
171
|
-
colorFilters: colorFilters,
|
|
172
|
-
textFiltersAndroid: textFiltersAndroid,
|
|
173
|
-
textFiltersIOS: textFiltersIOS
|
|
174
|
-
// amznmod_react - add textFiltersKepler prop
|
|
175
|
-
// amznmod_react - Clip LottieView on ReactNative
|
|
176
|
-
,
|
|
177
|
-
textFiltersKepler: textFiltersKepler,
|
|
178
|
-
speed: speed,
|
|
179
|
-
style: [aspectRatioStyle, sizeStyle || {
|
|
180
|
-
width: '100%',
|
|
181
|
-
height: '100%'
|
|
182
|
-
}, style, baseStyle],
|
|
183
|
-
sourceName: sourceName,
|
|
184
|
-
sourceJson: sourceJson,
|
|
185
|
-
sourceURL: sourceURL,
|
|
186
|
-
onAnimationFinish: this.onAnimationFinish
|
|
187
|
-
//amznmod_react - add onAnimation... callbacks
|
|
188
|
-
,
|
|
189
|
-
onAnimationLoad: this.onAnimationLoad,
|
|
190
|
-
onAnimationPlay: this.onAnimationPlay,
|
|
191
|
-
onAnimationPause: this.onAnimationPause,
|
|
192
|
-
onAnimationResume: this.onAnimationResume
|
|
193
|
-
// PROJ*-136246 - deprecate onAnimationJsonLoad
|
|
194
|
-
,
|
|
195
|
-
onAnimationJsonLoad: this.onAnimationJsonLoad
|
|
196
|
-
})))
|
|
197
|
-
);
|
|
198
|
-
}
|
|
199
|
-
}
|
|
200
|
-
_defineProperty(AnimatedLottieView, "defaultProps", defaultProps);
|
|
201
|
-
//# sourceMappingURL=LottieView.js.map
|
package/lib/module/index.js
DELETED
|
@@ -1,91 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Portions of this file are copyright (c) 2023 Amazon.com, Inc. or its affiliates. All rights reserved.
|
|
3
|
-
*
|
|
4
|
-
* PORTIONS OF THIS FILE ARE AMAZON PROPRIETARY/CONFIDENTIAL. USE IS SUBJECT TO LICENSE TERMS.
|
|
5
|
-
*
|
|
6
|
-
* Amazon modifications are indicated by [amznmod_* comments].
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
/*
|
|
10
|
-
* Changelog:
|
|
11
|
-
* Set up lottie-react-native package to build for Kepler
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
import codegenNativeCommands from 'react-native/Libraries/Utilities/codegenNativeCommands';
|
|
15
|
-
import register from '@amazon-devices/react-native-kepler/Libraries/Utilities/registerGeneratedViewConfig';
|
|
16
|
-
|
|
17
|
-
// amznmod_react - add EmptyEvent type
|
|
18
|
-
|
|
19
|
-
// amznmod_react - change NativeComponentType to HostComponent
|
|
20
|
-
|
|
21
|
-
export const Commands = codegenNativeCommands({
|
|
22
|
-
supportedCommands: ['play', 'reset', 'pause', 'resume']
|
|
23
|
-
});
|
|
24
|
-
|
|
25
|
-
// amznmod_react - native component registration to build for Kepler
|
|
26
|
-
const LottieNativeComponent = 'LottieAnimationView';
|
|
27
|
-
const viewConfig = {
|
|
28
|
-
autoPlay: true,
|
|
29
|
-
sourceName: true,
|
|
30
|
-
resizeMode: true,
|
|
31
|
-
renderMode: true,
|
|
32
|
-
sourceJson: true,
|
|
33
|
-
sourceURL: true,
|
|
34
|
-
imageAssetsFolder: true,
|
|
35
|
-
progress: true,
|
|
36
|
-
speed: true,
|
|
37
|
-
loop: true,
|
|
38
|
-
enableMergePathsAndroidForKitKatAndAbove: true,
|
|
39
|
-
hardwareAccelerationAndroid: true,
|
|
40
|
-
cacheComposition: true,
|
|
41
|
-
colorFilters: true,
|
|
42
|
-
textFiltersAndroid: true,
|
|
43
|
-
textFiltersIOS: true,
|
|
44
|
-
textFiltersKepler: true
|
|
45
|
-
};
|
|
46
|
-
const bubblingEventTypes = {
|
|
47
|
-
topAnimationFinish: {
|
|
48
|
-
phasedRegistrationNames: {
|
|
49
|
-
bubbled: 'onAnimationFinish',
|
|
50
|
-
captured: 'onAnimationFinishCapture'
|
|
51
|
-
}
|
|
52
|
-
},
|
|
53
|
-
topAnimationLoad: {
|
|
54
|
-
phasedRegistrationNames: {
|
|
55
|
-
bubbled: 'onAnimationLoad',
|
|
56
|
-
captured: 'onAnimationLoadCapture'
|
|
57
|
-
}
|
|
58
|
-
},
|
|
59
|
-
// PROJ*-136246 - deprecate onAnimationJsonLoad
|
|
60
|
-
topAnimationJsonLoad: {
|
|
61
|
-
phasedRegistrationNames: {
|
|
62
|
-
bubbled: 'onAnimationJsonLoad',
|
|
63
|
-
captured: 'onAnimationJsonLoadCapture'
|
|
64
|
-
}
|
|
65
|
-
},
|
|
66
|
-
topAnimationPlay: {
|
|
67
|
-
phasedRegistrationNames: {
|
|
68
|
-
bubbled: 'onAnimationPlay',
|
|
69
|
-
captured: 'onAnimationPlayCapture'
|
|
70
|
-
}
|
|
71
|
-
},
|
|
72
|
-
topAnimationPause: {
|
|
73
|
-
phasedRegistrationNames: {
|
|
74
|
-
bubbled: 'onAnimationPause',
|
|
75
|
-
captured: 'onAnimationPauseCapture'
|
|
76
|
-
}
|
|
77
|
-
},
|
|
78
|
-
topAnimationResume: {
|
|
79
|
-
phasedRegistrationNames: {
|
|
80
|
-
bubbled: 'onAnimationResume',
|
|
81
|
-
captured: 'onAnimationResumeCapture'
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
};
|
|
85
|
-
register(LottieNativeComponent, {
|
|
86
|
-
uiViewClassName: LottieNativeComponent,
|
|
87
|
-
validAttributes: viewConfig,
|
|
88
|
-
bubblingEventTypes: bubblingEventTypes
|
|
89
|
-
});
|
|
90
|
-
export default LottieNativeComponent;
|
|
91
|
-
//# sourceMappingURL=LottieAnimationViewNativeComponent.js.map
|