@fluentui-react-native/experimental-shimmer 0.6.0 → 0.6.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 +28 -1
- package/CHANGELOG.md +12 -2
- package/lib/Shimmer.d.ts.map +1 -1
- package/lib/Shimmer.js +6 -3
- package/lib/Shimmer.js.map +1 -1
- package/lib-commonjs/Shimmer.d.ts.map +1 -1
- package/lib-commonjs/Shimmer.js +4 -1
- package/lib-commonjs/Shimmer.js.map +1 -1
- package/package.json +3 -3
- package/src/Shimmer.tsx +15 -10
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,34 @@
|
|
|
2
2
|
"name": "@fluentui-react-native/experimental-shimmer",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Thu, 16 Dec 2021 06:26:42 GMT",
|
|
6
|
+
"tag": "@fluentui-react-native/experimental-shimmer_v0.6.1",
|
|
7
|
+
"version": "0.6.1",
|
|
8
|
+
"comments": {
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "sanajmi@microsoft.com",
|
|
12
|
+
"package": "@fluentui-react-native/experimental-shimmer",
|
|
13
|
+
"commit": "6bc41c5b55447849b86d9c8928aafc022e11f688",
|
|
14
|
+
"comment": "Flip Shimmer in RTL"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"author": "beachball",
|
|
18
|
+
"package": "@fluentui-react-native/experimental-shimmer",
|
|
19
|
+
"comment": "Bump @fluentui-react-native/framework to v0.7.1",
|
|
20
|
+
"commit": "841d2998e8b97fabe0b6dac9c74c3d63d2b3bbd4"
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"author": "beachball",
|
|
24
|
+
"package": "@fluentui-react-native/experimental-shimmer",
|
|
25
|
+
"comment": "Bump @fluentui-react-native/tokens to v0.11.1",
|
|
26
|
+
"commit": "841d2998e8b97fabe0b6dac9c74c3d63d2b3bbd4"
|
|
27
|
+
}
|
|
28
|
+
]
|
|
29
|
+
}
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
"date": "Wed, 17 Nov 2021 19:28:07 GMT",
|
|
6
33
|
"tag": "@fluentui-react-native/experimental-shimmer_v0.6.0",
|
|
7
34
|
"version": "0.6.0",
|
|
8
35
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,22 @@
|
|
|
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 Thu, 16 Dec 2021 06:26:42 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## 0.6.1
|
|
8
|
+
|
|
9
|
+
Thu, 16 Dec 2021 06:26:42 GMT
|
|
10
|
+
|
|
11
|
+
### Patches
|
|
12
|
+
|
|
13
|
+
- Flip Shimmer in RTL (sanajmi@microsoft.com)
|
|
14
|
+
- Bump @fluentui-react-native/framework to v0.7.1
|
|
15
|
+
- Bump @fluentui-react-native/tokens to v0.11.1
|
|
16
|
+
|
|
7
17
|
## 0.6.0
|
|
8
18
|
|
|
9
|
-
Wed, 17 Nov 2021 19:
|
|
19
|
+
Wed, 17 Nov 2021 19:28:07 GMT
|
|
10
20
|
|
|
11
21
|
### Minor changes
|
|
12
22
|
|
package/lib/Shimmer.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.d.ts","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAe,YAAY,EAAe,MAAM,iBAAiB,CAAC;AAOzE,eAAO,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"Shimmer.d.ts","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAe,YAAY,EAAe,MAAM,iBAAiB,CAAC;AAOzE,eAAO,MAAM,OAAO,mOAsHlB,CAAC"}
|
package/lib/Shimmer.js
CHANGED
|
@@ -22,10 +22,10 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
22
22
|
};
|
|
23
23
|
/** @jsx withSlots */
|
|
24
24
|
import { useRef, useEffect, useMemo, useCallback } from 'react';
|
|
25
|
-
import { Circle, ClipPath, Defs, LinearGradient, Rect, Stop, Svg } from 'react-native-svg';
|
|
25
|
+
import { Circle, ClipPath, Defs, LinearGradient, Rect, Stop, Svg, G } from 'react-native-svg';
|
|
26
26
|
import { shimmerName } from './Shimmer.types';
|
|
27
27
|
import { compose, mergeProps, withSlots, buildUseStyling } from '@fluentui-react-native/framework';
|
|
28
|
-
import { Animated } from 'react-native';
|
|
28
|
+
import { Animated, I18nManager } from 'react-native';
|
|
29
29
|
import { stylingSettings } from './Shimmer.styling';
|
|
30
30
|
import assertNever from 'assert-never';
|
|
31
31
|
var useStyling = buildUseStyling(stylingSettings);
|
|
@@ -95,6 +95,8 @@ export var Shimmer = compose(__assign(__assign({ displayName: shimmerName }, sty
|
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
97
|
}
|
|
98
|
+
// Flip the SVG if we are running in RTL
|
|
99
|
+
var rtlTransfrom = I18nManager.isRTL ? { translateX: memoizedShimmerData.containerWidth, scaleX: -1 } : {};
|
|
98
100
|
return (withSlots(Slots.root, __assign({}, mergedProps),
|
|
99
101
|
withSlots(Defs, null,
|
|
100
102
|
withSlots(AnimatedLinearGradient, { id: "gradient", x1: startValue, y1: memoizedShimmerData.angle, x2: "-1", y2: "-1" },
|
|
@@ -102,7 +104,8 @@ export var Shimmer = compose(__assign(__assign({ displayName: shimmerName }, sty
|
|
|
102
104
|
withSlots(Stop, { offset: "20%", stopColor: memoizedShimmerData.shimmerWaveColor, stopOpacity: memoizedShimmerData.shimmerWaveColorOpacity }),
|
|
103
105
|
withSlots(Stop, { offset: "30%", stopColor: memoizedShimmerData.shimmerColor, stopOpacity: memoizedShimmerData.shimmerColorOpacity })),
|
|
104
106
|
withSlots(ClipPath, { id: "shimmerView" }, rows)),
|
|
105
|
-
withSlots(
|
|
107
|
+
withSlots(G, { transform: rtlTransfrom },
|
|
108
|
+
withSlots(Rect, { x: "0", y: "0", width: memoizedShimmerData.containerWidth, height: memoizedShimmerData.containerHeight, fill: "url(#gradient)", clipPath: "url(#shimmerView)" }))));
|
|
106
109
|
};
|
|
107
110
|
} }));
|
|
108
111
|
//# sourceMappingURL=Shimmer.js.map
|
package/lib/Shimmer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.js","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,qBAAqB;AACrB,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,cAAc,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"Shimmer.js","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.d.ts","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAe,YAAY,EAAe,MAAM,iBAAiB,CAAC;AAOzE,eAAO,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"Shimmer.d.ts","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAe,YAAY,EAAe,MAAM,iBAAiB,CAAC;AAOzE,eAAO,MAAM,OAAO,mOAsHlB,CAAC"}
|
package/lib-commonjs/Shimmer.js
CHANGED
|
@@ -100,6 +100,8 @@ exports.Shimmer = framework_1.compose(__assign(__assign({ displayName: Shimmer_t
|
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
102
|
}
|
|
103
|
+
// Flip the SVG if we are running in RTL
|
|
104
|
+
var rtlTransfrom = react_native_1.I18nManager.isRTL ? { translateX: memoizedShimmerData.containerWidth, scaleX: -1 } : {};
|
|
103
105
|
return (framework_1.withSlots(Slots.root, __assign({}, mergedProps),
|
|
104
106
|
framework_1.withSlots(react_native_svg_1.Defs, null,
|
|
105
107
|
framework_1.withSlots(AnimatedLinearGradient, { id: "gradient", x1: startValue, y1: memoizedShimmerData.angle, x2: "-1", y2: "-1" },
|
|
@@ -107,7 +109,8 @@ exports.Shimmer = framework_1.compose(__assign(__assign({ displayName: Shimmer_t
|
|
|
107
109
|
framework_1.withSlots(react_native_svg_1.Stop, { offset: "20%", stopColor: memoizedShimmerData.shimmerWaveColor, stopOpacity: memoizedShimmerData.shimmerWaveColorOpacity }),
|
|
108
110
|
framework_1.withSlots(react_native_svg_1.Stop, { offset: "30%", stopColor: memoizedShimmerData.shimmerColor, stopOpacity: memoizedShimmerData.shimmerColorOpacity })),
|
|
109
111
|
framework_1.withSlots(react_native_svg_1.ClipPath, { id: "shimmerView" }, rows)),
|
|
110
|
-
framework_1.withSlots(react_native_svg_1.
|
|
112
|
+
framework_1.withSlots(react_native_svg_1.G, { transform: rtlTransfrom },
|
|
113
|
+
framework_1.withSlots(react_native_svg_1.Rect, { x: "0", y: "0", width: memoizedShimmerData.containerWidth, height: memoizedShimmerData.containerHeight, fill: "url(#gradient)", clipPath: "url(#shimmerView)" }))));
|
|
111
114
|
};
|
|
112
115
|
} }));
|
|
113
116
|
//# sourceMappingURL=Shimmer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.js","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,qBAAqB;AACrB,+BAAgE;AAChE,
|
|
1
|
+
{"version":3,"file":"Shimmer.js","sourceRoot":"","sources":["../src/Shimmer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,qBAAqB;AACrB,+BAAgE;AAChE,qDAA+G;AAC/G,iDAAyE;AACzE,8DAA6G;AAC7G,6CAAqD;AACrD,qDAAoD;AACpD,8DAAuC;AAEvC,IAAM,UAAU,GAAG,2BAAe,CAAC,iCAAe,CAAC,CAAC;AACvC,QAAA,OAAO,GAAG,mBAAO,qBAC5B,WAAW,EAAE,2BAAW,IACrB,iCAAe,KAClB,KAAK,EAAE;QACL,IAAI,EAAE,sBAAG;KACV,EACD,MAAM,EAAE,UAAC,KAAmB,EAAE,QAA+B;QAC3D,IAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC9B,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,eAAO,CACjC,cAAM,OAAA,CAAC;YACL,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;YAClD,cAAc,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAC,OAAO,GAAE,CAAC,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAC,OAAO,EAAE,CAAC,CAAC,MAAM;YACtE,eAAe,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAC,QAAQ,GAAE,CAAC,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,MAAM;YACzE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;YAClD,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC;YAC9D,YAAY,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC;YAC9E,mBAAmB,EAAE,MAAM,CAAC,qBAAqB,CAAC;YAClD,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,kBAAkB,CAAC;YAC9F,uBAAuB,EAAE,MAAM,CAAC,yBAAyB,CAAC;SAC3D,CAAC,EAVI,CAUJ,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,IAAM,UAAU,GAAG,cAAM,CAAC,IAAI,uBAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;QAEzD;;;;;WAKG;QACH,IAAM,gBAAgB,GAAG,mBAAW,CAAC;YACnC,uBAAQ,CAAC,QAAQ,CAAC;gBAChB,uBAAQ,CAAC,MAAM,CAAC,UAAU,EAAE;oBAC1B,OAAO,EAAE,EAAE;oBACX,QAAQ,EAAE,mBAAmB,CAAC,QAAQ;oBACtC,KAAK,EAAE,mBAAmB,CAAC,KAAK;oBAChC,eAAe,EAAE,IAAI;iBACtB,CAAC;aACH,CAAC,CAAC,KAAK,CAAC;gBACP,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;gBACvB,gBAAgB,EAAE,CAAC;YACrB,CAAC,CAAC,CAAC;QACL,CAAC,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,mBAAmB,CAAC,KAAK,CAAC,CAAC,CAAC;QAE9D,iBAAS,CAAC;YACR,gBAAgB,EAAE,CAAC;QACrB,CAAC,CAAC,CAAC;QAEH,OAAO,UAAC,IAAkB;YACxB,IAAM,wCAAsD,EAApD,sBAAQ,EAAE,sCAA0C,CAAC;YAC7D,IAAM,IAAI,GAAG,EAAE,CAAC;YAEhB,IAAI,QAAQ,EAAE;gBACZ,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;oBACxC,IAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;oBAC5B,IAAI,OAAO,CAAC,IAAI,IAAI,MAAM,EAAE;wBAC1B,IAAI,CAAC,IAAI,CACP,sBAAC,uBAAI,IACH,GAAG,EAAE,CAAC,EACN,KAAK,EAAE,OAAO,CAAC,KAAK,EACpB,MAAM,EAAE,OAAO,CAAC,MAAM,EACtB,CAAC,EAAE,OAAO,CAAC,CAAC,EACZ,CAAC,EAAE,OAAO,CAAC,CAAC,EACZ,EAAE,EAAE,OAAO,CAAC,aAAa,EACzB,EAAE,EAAE,OAAO,CAAC,aAAa,GACzB,CACH,CAAC;qBACH;yBAAM,IAAI,OAAO,CAAC,IAAI,IAAI,QAAQ,EAAE;wBACnC,IAAI,CAAC,IAAI,CAAC,sBAAC,yBAAM,IAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,OAAO,CAAC,MAAM,EAAE,EAAE,EAAE,OAAO,CAAC,EAAE,EAAE,EAAE,EAAE,OAAO,CAAC,EAAE,GAAI,CAAC,CAAC;qBAClF;yBAAM;wBACL,sBAAW,CAAC,OAAO,CAAC,CAAC;qBACtB;iBACF;aACF;YAED,wCAAwC;YACxC,IAAM,YAAY,GAAoB,0BAAW,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,mBAAmB,CAAC,cAAc,EAAE,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;YAE9H,OAAO,CACL,sBAAC,KAAK,CAAC,IAAI,eAAK,WAAW;gBACzB,sBAAC,uBAAI;oBACH,sBAAC,sBAAsB,IAAC,EAAE,EAAC,UAAU,EAAC,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,mBAAmB,CAAC,KAAK,EAAE,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI;wBAClG,sBAAC,uBAAI,IAAC,MAAM,EAAC,KAAK,EAAC,SAAS,EAAE,mBAAmB,CAAC,YAAY,EAAE,WAAW,EAAE,mBAAmB,CAAC,mBAAmB,GAAI;wBACxH,sBAAC,uBAAI,IACH,MAAM,EAAC,KAAK,EACZ,SAAS,EAAE,mBAAmB,CAAC,gBAAgB,EAC/C,WAAW,EAAE,mBAAmB,CAAC,uBAAuB,GACxD;wBACF,sBAAC,uBAAI,IAAC,MAAM,EAAC,KAAK,EAAC,SAAS,EAAE,mBAAmB,CAAC,YAAY,EAAE,WAAW,EAAE,mBAAmB,CAAC,mBAAmB,GAAI,CACjG;oBACzB,sBAAC,2BAAQ,IAAC,EAAE,EAAC,aAAa,IAAE,IAAI,CAAY,CACvC;gBACP,sBAAC,oBAAC,IAAC,SAAS,EAAE,YAAY;oBACxB,sBAAC,uBAAI,IACH,CAAC,EAAC,GAAG,EACL,CAAC,EAAC,GAAG,EACL,KAAK,EAAE,mBAAmB,CAAC,cAAc,EACzC,MAAM,EAAE,mBAAmB,CAAC,eAAe,EAC3C,IAAI,EAAC,gBAAgB,EACrB,QAAQ,EAAC,mBAAmB,GAC5B,CACA,CACO,CACd,CAAC;QACJ,CAAC,CAAC;IACJ,CAAC,IACD,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-react-native/experimental-shimmer",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.1",
|
|
4
4
|
"description": "A cross-platform Fluent Shimmer component",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -14,8 +14,8 @@
|
|
|
14
14
|
"prettier-fix": "fluentui-scripts prettier --fix true"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@fluentui-react-native/framework": "0.7.
|
|
18
|
-
"@fluentui-react-native/tokens": ">=0.11.
|
|
17
|
+
"@fluentui-react-native/framework": "0.7.1",
|
|
18
|
+
"@fluentui-react-native/tokens": ">=0.11.1 <1.0.0",
|
|
19
19
|
"react-native-svg": "^12.1.1"
|
|
20
20
|
},
|
|
21
21
|
"devDependencies": {
|
package/src/Shimmer.tsx
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
/** @jsx withSlots */
|
|
2
2
|
import { useRef, useEffect, useMemo, useCallback } from 'react';
|
|
3
|
-
import { Circle, ClipPath, Defs, LinearGradient, Rect, Stop, Svg } from 'react-native-svg';
|
|
3
|
+
import { Circle, ClipPath, Defs, LinearGradient, Rect, Stop, Svg, G, TransformObject } from 'react-native-svg';
|
|
4
4
|
import { shimmerName, ShimmerProps, ShimmerType } from './Shimmer.types';
|
|
5
5
|
import { compose, mergeProps, withSlots, UseSlots, buildUseStyling } from '@fluentui-react-native/framework';
|
|
6
|
-
import { Animated } from 'react-native';
|
|
6
|
+
import { Animated, I18nManager } from 'react-native';
|
|
7
7
|
import { stylingSettings } from './Shimmer.styling';
|
|
8
8
|
import assertNever from 'assert-never';
|
|
9
9
|
|
|
@@ -95,6 +95,9 @@ export const Shimmer = compose<ShimmerType>({
|
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
97
|
|
|
98
|
+
// Flip the SVG if we are running in RTL
|
|
99
|
+
const rtlTransfrom: TransformObject = I18nManager.isRTL ? { translateX: memoizedShimmerData.containerWidth, scaleX: -1 } : {};
|
|
100
|
+
|
|
98
101
|
return (
|
|
99
102
|
<Slots.root {...mergedProps}>
|
|
100
103
|
<Defs>
|
|
@@ -109,14 +112,16 @@ export const Shimmer = compose<ShimmerType>({
|
|
|
109
112
|
</AnimatedLinearGradient>
|
|
110
113
|
<ClipPath id="shimmerView">{rows}</ClipPath>
|
|
111
114
|
</Defs>
|
|
112
|
-
<
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
115
|
+
<G transform={rtlTransfrom}>
|
|
116
|
+
<Rect
|
|
117
|
+
x="0"
|
|
118
|
+
y="0"
|
|
119
|
+
width={memoizedShimmerData.containerWidth}
|
|
120
|
+
height={memoizedShimmerData.containerHeight}
|
|
121
|
+
fill="url(#gradient)"
|
|
122
|
+
clipPath="url(#shimmerView)"
|
|
123
|
+
/>
|
|
124
|
+
</G>
|
|
120
125
|
</Slots.root>
|
|
121
126
|
);
|
|
122
127
|
};
|