@fluentui-react-native/experimental-shimmer 0.9.0 → 0.10.1
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/CHANGELOG.json +43 -1
- package/CHANGELOG.md +20 -2
- package/lib/Shimmer.d.ts.map +1 -1
- package/lib/Shimmer.js +7 -4
- package/lib/Shimmer.js.map +1 -1
- package/lib/Shimmer.types.d.ts +2 -1
- package/lib/Shimmer.types.d.ts.map +1 -1
- package/lib/Shimmer.types.js +1 -1
- package/lib/Shimmer.types.js.map +1 -1
- package/lib/Shimmer.types.win32.d.ts +3 -2
- package/lib/Shimmer.types.win32.d.ts.map +1 -1
- package/lib/Shimmer.types.win32.js.map +1 -1
- package/lib/Shimmer.win32.d.ts +1 -1
- package/lib/Shimmer.win32.d.ts.map +1 -1
- package/lib-commonjs/Shimmer.d.ts.map +1 -1
- package/lib-commonjs/Shimmer.js +7 -4
- package/lib-commonjs/Shimmer.js.map +1 -1
- package/lib-commonjs/Shimmer.types.d.ts +2 -1
- package/lib-commonjs/Shimmer.types.d.ts.map +1 -1
- package/lib-commonjs/Shimmer.types.js.map +1 -1
- package/lib-commonjs/Shimmer.types.win32.d.ts +3 -2
- package/lib-commonjs/Shimmer.types.win32.d.ts.map +1 -1
- package/lib-commonjs/Shimmer.types.win32.js.map +1 -1
- package/lib-commonjs/Shimmer.win32.d.ts +1 -1
- package/lib-commonjs/Shimmer.win32.d.ts.map +1 -1
- package/package.json +3 -3
- package/src/Shimmer.tsx +7 -4
- package/src/Shimmer.types.ts +2 -2
- package/src/Shimmer.types.win32.ts +3 -2
- package/src/Shimmer.win32.tsx +1 -1
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,49 @@
|
|
|
2
2
|
"name": "@fluentui-react-native/experimental-shimmer",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Wed, 21 Jun 2023 22:47:06 GMT",
|
|
6
|
+
"tag": "@fluentui-react-native/experimental-shimmer_v0.10.1",
|
|
7
|
+
"version": "0.10.1",
|
|
8
|
+
"comments": {
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "joannaquu@gmail.com",
|
|
12
|
+
"package": "@fluentui-react-native/experimental-shimmer",
|
|
13
|
+
"commit": "ae6f6796fbefbb529650fe27bdac75a5ea42e251",
|
|
14
|
+
"comment": "update Shimmer direction for rtl"
|
|
15
|
+
}
|
|
16
|
+
]
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"date": "Mon, 12 Jun 2023 17:46:43 GMT",
|
|
21
|
+
"tag": "@fluentui-react-native/experimental-shimmer_v0.10.0",
|
|
22
|
+
"version": "0.10.0",
|
|
23
|
+
"comments": {
|
|
24
|
+
"minor": [
|
|
25
|
+
{
|
|
26
|
+
"author": "ayushsinghs@yahoo.in",
|
|
27
|
+
"package": "@fluentui-react-native/experimental-shimmer",
|
|
28
|
+
"commit": "60d243e2af9f727a0265bf6a0aed49e687305f77",
|
|
29
|
+
"comment": "Changes for treeshake to work"
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
"author": "beachball",
|
|
33
|
+
"package": "@fluentui-react-native/experimental-shimmer",
|
|
34
|
+
"comment": "Bump @fluentui-react-native/framework to v0.11.0",
|
|
35
|
+
"commit": "6530042f4f24cbb296337a8bcf5fb32a09cc6378"
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
"author": "beachball",
|
|
39
|
+
"package": "@fluentui-react-native/experimental-shimmer",
|
|
40
|
+
"comment": "Bump @fluentui-react-native/use-styling to v0.11.0",
|
|
41
|
+
"commit": "6530042f4f24cbb296337a8bcf5fb32a09cc6378"
|
|
42
|
+
}
|
|
43
|
+
]
|
|
44
|
+
}
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
"date": "Mon, 05 Jun 2023 19:26:23 GMT",
|
|
6
48
|
"tag": "@fluentui-react-native/experimental-shimmer_v0.9.0",
|
|
7
49
|
"version": "0.9.0",
|
|
8
50
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,30 @@
|
|
|
1
1
|
# Change Log - @fluentui-react-native/experimental-shimmer
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Wed, 21 Jun 2023 22:47:06 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## 0.10.1
|
|
8
|
+
|
|
9
|
+
Wed, 21 Jun 2023 22:47:06 GMT
|
|
10
|
+
|
|
11
|
+
### Patches
|
|
12
|
+
|
|
13
|
+
- update Shimmer direction for rtl (joannaquu@gmail.com)
|
|
14
|
+
|
|
15
|
+
## 0.10.0
|
|
16
|
+
|
|
17
|
+
Mon, 12 Jun 2023 17:46:43 GMT
|
|
18
|
+
|
|
19
|
+
### Minor changes
|
|
20
|
+
|
|
21
|
+
- Changes for treeshake to work (ayushsinghs@yahoo.in)
|
|
22
|
+
- Bump @fluentui-react-native/framework to v0.11.0
|
|
23
|
+
- Bump @fluentui-react-native/use-styling to v0.11.0
|
|
24
|
+
|
|
7
25
|
## 0.9.0
|
|
8
26
|
|
|
9
|
-
Mon, 05 Jun 2023 19:
|
|
27
|
+
Mon, 05 Jun 2023 19:26:23 GMT
|
|
10
28
|
|
|
11
29
|
### Minor changes
|
|
12
30
|
|
package/lib/Shimmer.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.d.ts","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,YAAY,EAAe,MAAM,iBAAiB,CAAC;AAIjE,eAAO,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"Shimmer.d.ts","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,YAAY,EAAe,MAAM,iBAAiB,CAAC;AAIjE,eAAO,MAAM,OAAO,yLAuHlB,CAAC"}
|
package/lib/Shimmer.js
CHANGED
|
@@ -64,11 +64,14 @@ export var Shimmer = compose(__assign(__assign({ displayName: shimmerName }, sty
|
|
|
64
64
|
* Different angles are handled by rotating this gradient.
|
|
65
65
|
* The startValue is used to control the start position of the gradient animation, it is set as -2 to make sure it is starts off the screen for any angle.
|
|
66
66
|
* Similarly the endValue is set to 3 to make sure the gradient animation exits the entire screen for any angle.
|
|
67
|
+
* In RTL, startValue and endValue are flipped to ensure that the animation moves from right to left.
|
|
67
68
|
*/
|
|
68
|
-
var startValue =
|
|
69
|
+
var startValue = I18nManager.isRTL ? 3 : -2;
|
|
70
|
+
var endValue = I18nManager.isRTL ? -2 : 3;
|
|
71
|
+
var x1 = useRef(new Animated.Value(startValue)).current;
|
|
69
72
|
var shimmerAnimation = useCallback(function () {
|
|
70
|
-
Animated.loop(Animated.timing(
|
|
71
|
-
toValue:
|
|
73
|
+
Animated.loop(Animated.timing(x1, {
|
|
74
|
+
toValue: endValue,
|
|
72
75
|
duration: memoizedShimmerData.duration,
|
|
73
76
|
delay: memoizedShimmerData.delay,
|
|
74
77
|
useNativeDriver: true,
|
|
@@ -100,7 +103,7 @@ export var Shimmer = compose(__assign(__assign({ displayName: shimmerName }, sty
|
|
|
100
103
|
: { translateX: undefined, scaleX: undefined };
|
|
101
104
|
return (withSlots(Slots.root, __assign({}, mergedProps),
|
|
102
105
|
withSlots(Defs, null,
|
|
103
|
-
withSlots(AnimatedLinearGradient, { id: "gradient", x1:
|
|
106
|
+
withSlots(AnimatedLinearGradient, { id: "gradient", x1: x1, x2: "-1", gradientTransform: "rotate(".concat(memoizedShimmerData.angle, ")") },
|
|
104
107
|
withSlots(Stop, { offset: "10%", stopColor: memoizedShimmerData.shimmerColor, stopOpacity: memoizedShimmerData.shimmerColorOpacity }),
|
|
105
108
|
withSlots(Stop, { offset: "20%", stopColor: memoizedShimmerData.shimmerWaveColor, stopOpacity: memoizedShimmerData.shimmerWaveColorOpacity }),
|
|
106
109
|
withSlots(Stop, { offset: "30%", stopColor: memoizedShimmerData.shimmerColor, stopOpacity: memoizedShimmerData.shimmerColorOpacity })),
|
package/lib/Shimmer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.js","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Shimmer.js","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"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"}
|
package/lib/Shimmer.types.d.ts
CHANGED
|
@@ -1,2 +1,3 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export type { ShimmerCircleElement, ShimmerRectElement, ShimmerElementTypes, ShimmerTokens, ShimmerSlotProps, ShimmerProps, ShimmerType, } from './Shimmer.types.shared';
|
|
2
|
+
export { shimmerName } from './Shimmer.types.shared';
|
|
2
3
|
//# sourceMappingURL=Shimmer.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.d.ts","sourceRoot":"","sources":["../src/Shimmer.types.ts"],"names":[],"mappings":"AAAA,
|
|
1
|
+
{"version":3,"file":"Shimmer.types.d.ts","sourceRoot":"","sources":["../src/Shimmer.types.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,oBAAoB,EACpB,kBAAkB,EAClB,mBAAmB,EACnB,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,WAAW,GACZ,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC"}
|
package/lib/Shimmer.types.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { shimmerName
|
|
1
|
+
export { shimmerName } from './Shimmer.types.shared';
|
|
2
2
|
//# sourceMappingURL=Shimmer.types.js.map
|
package/lib/Shimmer.types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.js","sourceRoot":"","sources":["../src/Shimmer.types.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Shimmer.types.js","sourceRoot":"","sources":["../src/Shimmer.types.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { ViewProps } from 'react-native';
|
|
3
3
|
import type { ShimmerProps, ShimmerTokens } from './Shimmer.types.shared';
|
|
4
|
-
export { ShimmerProps, ShimmerTokens };
|
|
5
|
-
export {
|
|
4
|
+
export type { ShimmerProps, ShimmerTokens };
|
|
5
|
+
export type { ShimmerRectElement, ShimmerElementTypes, ShimmerCircleElement } from './Shimmer.types.shared';
|
|
6
|
+
export { shimmerName } from './Shimmer.types.shared';
|
|
6
7
|
export interface ClippingMaskProps extends ShimmerTokens {
|
|
7
8
|
/**
|
|
8
9
|
* Extra parameter necessary to provide the mask effect generated from the provided ShimmerElements.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.win32.d.ts","sourceRoot":"","sources":["../src/Shimmer.types.win32.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAC1E,
|
|
1
|
+
{"version":3,"file":"Shimmer.types.win32.d.ts","sourceRoot":"","sources":["../src/Shimmer.types.win32.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAC1E,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,CAAC;AAC5C,YAAY,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC5G,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAErD,MAAM,WAAW,iBAAkB,SAAQ,aAAa;IACtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,gBAAiB,SAAQ,aAAa;IACrD;;;OAGG;IACH,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,SAAS,CAAC;IAChB,YAAY,EAAE,iBAAiB,CAAC;IAChC,WAAW,EAAE,gBAAgB,CAAC;IAC9B,oBAAoB,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;CACjE;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,YAAY,CAAC;IACpB,SAAS,EAAE,gBAAgB,CAAC;IAC5B,MAAM,EAAE,aAAa,CAAC;CACvB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.win32.js","sourceRoot":"","sources":["../src/Shimmer.types.win32.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Shimmer.types.win32.js","sourceRoot":"","sources":["../src/Shimmer.types.win32.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC"}
|
package/lib/Shimmer.win32.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import type { ShimmerProps, ShimmerCircleElement, ShimmerRectElement } from './Shimmer.types.shared';
|
|
2
|
-
export { ShimmerCircleElement, ShimmerRectElement };
|
|
2
|
+
export type { ShimmerCircleElement, ShimmerRectElement };
|
|
3
3
|
export declare const Shimmer: import("@fluentui-react-native/framework").ComposableComponent<ShimmerProps, import("./Shimmer.types.win32").ShimmerSlotProps, import("./Shimmer.types.shared").ShimmerTokens, object>;
|
|
4
4
|
//# sourceMappingURL=Shimmer.win32.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.win32.d.ts","sourceRoot":"","sources":["../src/Shimmer.win32.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAuB,YAAY,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC1H,
|
|
1
|
+
{"version":3,"file":"Shimmer.win32.d.ts","sourceRoot":"","sources":["../src/Shimmer.win32.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAuB,YAAY,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC1H,YAAY,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,CAAC;AAiEzD,eAAO,MAAM,OAAO,wLAwElB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.d.ts","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,YAAY,EAAe,MAAM,iBAAiB,CAAC;AAIjE,eAAO,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"Shimmer.d.ts","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,YAAY,EAAe,MAAM,iBAAiB,CAAC;AAIjE,eAAO,MAAM,OAAO,yLAuHlB,CAAC"}
|
package/lib-commonjs/Shimmer.js
CHANGED
|
@@ -70,11 +70,14 @@ exports.Shimmer = (0, framework_1.compose)(__assign(__assign({ displayName: Shim
|
|
|
70
70
|
* Different angles are handled by rotating this gradient.
|
|
71
71
|
* The startValue is used to control the start position of the gradient animation, it is set as -2 to make sure it is starts off the screen for any angle.
|
|
72
72
|
* Similarly the endValue is set to 3 to make sure the gradient animation exits the entire screen for any angle.
|
|
73
|
+
* In RTL, startValue and endValue are flipped to ensure that the animation moves from right to left.
|
|
73
74
|
*/
|
|
74
|
-
var startValue =
|
|
75
|
+
var startValue = react_native_1.I18nManager.isRTL ? 3 : -2;
|
|
76
|
+
var endValue = react_native_1.I18nManager.isRTL ? -2 : 3;
|
|
77
|
+
var x1 = (0, react_1.useRef)(new react_native_1.Animated.Value(startValue)).current;
|
|
75
78
|
var shimmerAnimation = (0, react_1.useCallback)(function () {
|
|
76
|
-
react_native_1.Animated.loop(react_native_1.Animated.timing(
|
|
77
|
-
toValue:
|
|
79
|
+
react_native_1.Animated.loop(react_native_1.Animated.timing(x1, {
|
|
80
|
+
toValue: endValue,
|
|
78
81
|
duration: memoizedShimmerData.duration,
|
|
79
82
|
delay: memoizedShimmerData.delay,
|
|
80
83
|
useNativeDriver: true,
|
|
@@ -106,7 +109,7 @@ exports.Shimmer = (0, framework_1.compose)(__assign(__assign({ displayName: Shim
|
|
|
106
109
|
: { translateX: undefined, scaleX: undefined };
|
|
107
110
|
return ((0, framework_1.withSlots)(Slots.root, __assign({}, mergedProps),
|
|
108
111
|
(0, framework_1.withSlots)(react_native_svg_1.Defs, null,
|
|
109
|
-
(0, framework_1.withSlots)(AnimatedLinearGradient, { id: "gradient", x1:
|
|
112
|
+
(0, framework_1.withSlots)(AnimatedLinearGradient, { id: "gradient", x1: x1, x2: "-1", gradientTransform: "rotate(".concat(memoizedShimmerData.angle, ")") },
|
|
110
113
|
(0, framework_1.withSlots)(react_native_svg_1.Stop, { offset: "10%", stopColor: memoizedShimmerData.shimmerColor, stopOpacity: memoizedShimmerData.shimmerColorOpacity }),
|
|
111
114
|
(0, framework_1.withSlots)(react_native_svg_1.Stop, { offset: "20%", stopColor: memoizedShimmerData.shimmerWaveColor, stopOpacity: memoizedShimmerData.shimmerWaveColorOpacity }),
|
|
112
115
|
(0, framework_1.withSlots)(react_native_svg_1.Stop, { offset: "30%", stopColor: memoizedShimmerData.shimmerColor, stopOpacity: memoizedShimmerData.shimmerColorOpacity })),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.js","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,0BAA0B;AAC1B,qBAAqB;AACrB,+BAAgE;AAEhE,6CAAqD;AAGrD,8DAAmG;AACnG,8DAAuC;AACvC,qDAA8F;AAE9F,qDAAoD;AAEpD,iDAA8C;AAE9C,IAAM,UAAU,GAAG,IAAA,2BAAe,EAAC,iCAAe,CAAC,CAAC;AACvC,QAAA,OAAO,GAAG,IAAA,mBAAO,sBAC5B,WAAW,EAAE,2BAAW,IACrB,iCAAe,KAClB,KAAK,EAAE;QACL,IAAI,EAAE,sBAAG;KACV,EACD,SAAS,EAAE,UAAC,KAAmB,EAAE,QAA+B;QAC9D,IAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC9B,KAAK,GAAG,IAAA,sBAAU,EAAC,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC;QAChD,IAAM,sBAAsB,GAAG,uBAAQ,CAAC,uBAAuB,CAAC,iCAAc,CAAC,CAAC;QAChF,IAAM,MAAM,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC;QACtC,IAAM,mBAAmB,GAAG,IAAA,eAAO,EACjC;;YAAM,OAAA,CAAC;gBACL,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;gBAClD,cAAc,EAAE,CAAA,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,0CAAG,OAAO,CAAC,EAAC,CAAC,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,MAAM;gBACxE,eAAe,EAAE,CAAA,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,0CAAG,QAAQ,CAAC,EAAC,CAAC,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,MAAM;gBAC3E,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;gBAClD,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC;gBAC9D,YAAY,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC;gBAC9E,mBAAmB,EAAE,MAAM,CAAC,qBAAqB,CAAC;gBAClD,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,kBAAkB,CAAC;gBAC9F,uBAAuB,EAAE,MAAM,CAAC,yBAAyB,CAAC;aAC3D,CAAC,CAAA;SAAA,EACF;YACE,KAAK,CAAC,KAAK;YACX,KAAK,CAAC,KAAK;YACX,KAAK,CAAC,QAAQ;YACd,KAAK,CAAC,YAAY;YAClB,KAAK,CAAC,mBAAmB;YACzB,KAAK,CAAC,gBAAgB;YACtB,KAAK,CAAC,uBAAuB;YAC7B,KAAK,CAAC,KAAK;SACZ,CACF,CAAC;QAEF
|
|
1
|
+
{"version":3,"file":"Shimmer.js","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,2 +1,3 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export type { ShimmerCircleElement, ShimmerRectElement, ShimmerElementTypes, ShimmerTokens, ShimmerSlotProps, ShimmerProps, ShimmerType, } from './Shimmer.types.shared';
|
|
2
|
+
export { shimmerName } from './Shimmer.types.shared';
|
|
2
3
|
//# sourceMappingURL=Shimmer.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.d.ts","sourceRoot":"","sources":["../src/Shimmer.types.ts"],"names":[],"mappings":"AAAA,
|
|
1
|
+
{"version":3,"file":"Shimmer.types.d.ts","sourceRoot":"","sources":["../src/Shimmer.types.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,oBAAoB,EACpB,kBAAkB,EAClB,mBAAmB,EACnB,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,WAAW,GACZ,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.js","sourceRoot":"","sources":["../src/Shimmer.types.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"Shimmer.types.js","sourceRoot":"","sources":["../src/Shimmer.types.ts"],"names":[],"mappings":";;;AASA,+DAAqD;AAA5C,mHAAA,WAAW,OAAA"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { ViewProps } from 'react-native';
|
|
3
3
|
import type { ShimmerProps, ShimmerTokens } from './Shimmer.types.shared';
|
|
4
|
-
export { ShimmerProps, ShimmerTokens };
|
|
5
|
-
export {
|
|
4
|
+
export type { ShimmerProps, ShimmerTokens };
|
|
5
|
+
export type { ShimmerRectElement, ShimmerElementTypes, ShimmerCircleElement } from './Shimmer.types.shared';
|
|
6
|
+
export { shimmerName } from './Shimmer.types.shared';
|
|
6
7
|
export interface ClippingMaskProps extends ShimmerTokens {
|
|
7
8
|
/**
|
|
8
9
|
* Extra parameter necessary to provide the mask effect generated from the provided ShimmerElements.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.win32.d.ts","sourceRoot":"","sources":["../src/Shimmer.types.win32.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAC1E,
|
|
1
|
+
{"version":3,"file":"Shimmer.types.win32.d.ts","sourceRoot":"","sources":["../src/Shimmer.types.win32.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAC1E,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,CAAC;AAC5C,YAAY,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC5G,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAErD,MAAM,WAAW,iBAAkB,SAAQ,aAAa;IACtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,gBAAiB,SAAQ,aAAa;IACrD;;;OAGG;IACH,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,SAAS,CAAC;IAChB,YAAY,EAAE,iBAAiB,CAAC;IAChC,WAAW,EAAE,gBAAgB,CAAC;IAC9B,oBAAoB,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;CACjE;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,YAAY,CAAC;IACpB,SAAS,EAAE,gBAAgB,CAAC;IAC5B,MAAM,EAAE,aAAa,CAAC;CACvB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.win32.js","sourceRoot":"","sources":["../src/Shimmer.types.win32.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"Shimmer.types.win32.js","sourceRoot":"","sources":["../src/Shimmer.types.win32.ts"],"names":[],"mappings":";;;AAKA,+DAAqD;AAA5C,mHAAA,WAAW,OAAA"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import type { ShimmerProps, ShimmerCircleElement, ShimmerRectElement } from './Shimmer.types.shared';
|
|
2
|
-
export { ShimmerCircleElement, ShimmerRectElement };
|
|
2
|
+
export type { ShimmerCircleElement, ShimmerRectElement };
|
|
3
3
|
export declare const Shimmer: import("@fluentui-react-native/framework").ComposableComponent<ShimmerProps, import("./Shimmer.types.win32").ShimmerSlotProps, import("./Shimmer.types.shared").ShimmerTokens, object>;
|
|
4
4
|
//# sourceMappingURL=Shimmer.win32.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.win32.d.ts","sourceRoot":"","sources":["../src/Shimmer.win32.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAuB,YAAY,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC1H,
|
|
1
|
+
{"version":3,"file":"Shimmer.win32.d.ts","sourceRoot":"","sources":["../src/Shimmer.win32.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAuB,YAAY,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC1H,YAAY,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,CAAC;AAiEzD,eAAO,MAAM,OAAO,wLAwElB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-react-native/experimental-shimmer",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.10.1",
|
|
4
4
|
"description": "A cross-platform Fluent Shimmer component",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -22,11 +22,11 @@
|
|
|
22
22
|
"directory": "packages/experimental/Shimmer"
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@fluentui-react-native/framework": "0.
|
|
25
|
+
"@fluentui-react-native/framework": "0.11.0",
|
|
26
26
|
"@fluentui-react-native/tokens": ">=0.21.0 <1.0.0",
|
|
27
27
|
"@fluentui-react-native/theming-utils": ">=0.24.0 <1.0.0",
|
|
28
28
|
"@fluentui-react-native/component-cache": "^1.5.0",
|
|
29
|
-
"@fluentui-react-native/use-styling": "^0.
|
|
29
|
+
"@fluentui-react-native/use-styling": "^0.11.0"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
32
|
"@fluentui-react-native/eslint-config-rules": "^0.1.1",
|
package/src/Shimmer.tsx
CHANGED
|
@@ -53,12 +53,15 @@ export const Shimmer = compose<ShimmerType>({
|
|
|
53
53
|
* Different angles are handled by rotating this gradient.
|
|
54
54
|
* The startValue is used to control the start position of the gradient animation, it is set as -2 to make sure it is starts off the screen for any angle.
|
|
55
55
|
* Similarly the endValue is set to 3 to make sure the gradient animation exits the entire screen for any angle.
|
|
56
|
+
* In RTL, startValue and endValue are flipped to ensure that the animation moves from right to left.
|
|
56
57
|
*/
|
|
57
|
-
const startValue =
|
|
58
|
+
const startValue = I18nManager.isRTL ? 3 : -2;
|
|
59
|
+
const endValue = I18nManager.isRTL ? -2 : 3;
|
|
60
|
+
const x1 = useRef(new Animated.Value(startValue)).current;
|
|
58
61
|
const shimmerAnimation = useCallback(() => {
|
|
59
62
|
Animated.loop(
|
|
60
|
-
Animated.timing(
|
|
61
|
-
toValue:
|
|
63
|
+
Animated.timing(x1, {
|
|
64
|
+
toValue: endValue,
|
|
62
65
|
duration: memoizedShimmerData.duration,
|
|
63
66
|
delay: memoizedShimmerData.delay,
|
|
64
67
|
useNativeDriver: true,
|
|
@@ -105,7 +108,7 @@ export const Shimmer = compose<ShimmerType>({
|
|
|
105
108
|
return (
|
|
106
109
|
<Slots.root {...mergedProps}>
|
|
107
110
|
<Defs>
|
|
108
|
-
<AnimatedLinearGradient id="gradient" x1={
|
|
111
|
+
<AnimatedLinearGradient id="gradient" x1={x1} x2="-1" gradientTransform={`rotate(${memoizedShimmerData.angle})`}>
|
|
109
112
|
<Stop offset="10%" stopColor={memoizedShimmerData.shimmerColor} stopOpacity={memoizedShimmerData.shimmerColorOpacity} />
|
|
110
113
|
<Stop
|
|
111
114
|
offset="20%"
|
package/src/Shimmer.types.ts
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import type { ViewProps } from 'react-native';
|
|
2
2
|
|
|
3
3
|
import type { ShimmerProps, ShimmerTokens } from './Shimmer.types.shared';
|
|
4
|
-
export { ShimmerProps, ShimmerTokens };
|
|
5
|
-
export {
|
|
4
|
+
export type { ShimmerProps, ShimmerTokens };
|
|
5
|
+
export type { ShimmerRectElement, ShimmerElementTypes, ShimmerCircleElement } from './Shimmer.types.shared';
|
|
6
|
+
export { shimmerName } from './Shimmer.types.shared';
|
|
6
7
|
|
|
7
8
|
export interface ClippingMaskProps extends ShimmerTokens {
|
|
8
9
|
/**
|
package/src/Shimmer.win32.tsx
CHANGED
|
@@ -12,7 +12,7 @@ import { ClipPath, Defs, LinearGradient, Path, Rect, Stop, Svg } from 'react-nat
|
|
|
12
12
|
import { RCTNativeAnimatedShimmer } from './consts.win32';
|
|
13
13
|
import { stylingSettings } from './Shimmer.styling.win32';
|
|
14
14
|
import type { ShimmerElementTypes, ShimmerProps, ShimmerCircleElement, ShimmerRectElement } from './Shimmer.types.shared';
|
|
15
|
-
export { ShimmerCircleElement, ShimmerRectElement };
|
|
15
|
+
export type { ShimmerCircleElement, ShimmerRectElement };
|
|
16
16
|
import { shimmerName } from './Shimmer.types.shared';
|
|
17
17
|
import type { ClippingMaskProps, ShimmerType, ShimmerWaveProps } from './Shimmer.types.win32';
|
|
18
18
|
import { convertRectToSvgPath, convertCircleToSvgPath } from './SvgShapeToPath';
|