@fluentui-react-native/experimental-shimmer 0.14.1 → 0.14.4
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/.cache/tsconfig.tsbuildinfo +1 -0
- package/CHANGELOG.md +42 -0
- package/jest.config.cjs +1 -0
- package/lib/Shimmer.d.ts.map +1 -1
- package/lib/Shimmer.js +4 -22
- package/lib/Shimmer.js.map +1 -1
- package/lib/Shimmer.test.js.map +1 -1
- package/lib/Shimmer.types.shared.d.ts +1 -1
- package/lib/Shimmer.types.shared.d.ts.map +1 -1
- package/lib/Shimmer.win32.js +3 -11
- package/lib/Shimmer.win32.js.map +1 -1
- package/lib/SvgShapeToPath.js.map +1 -1
- package/lib/Win32ShimmerNativeComponent.d.ts.map +1 -1
- package/package.json +24 -29
- package/src/Shimmer.test.tsx +1 -1
- package/src/Shimmer.tsx +3 -13
- package/src/Shimmer.types.shared.ts +1 -1
- package/tsconfig.json +26 -3
- package/babel.config.js +0 -1
- package/eslint.config.js +0 -3
- package/jest.config.js +0 -2
- package/lib-commonjs/Shimmer.d.ts +0 -3
- package/lib-commonjs/Shimmer.d.ts.map +0 -1
- package/lib-commonjs/Shimmer.js +0 -104
- package/lib-commonjs/Shimmer.js.map +0 -1
- package/lib-commonjs/Shimmer.styling.d.ts +0 -4
- package/lib-commonjs/Shimmer.styling.d.ts.map +0 -1
- package/lib-commonjs/Shimmer.styling.js +0 -34
- package/lib-commonjs/Shimmer.styling.js.map +0 -1
- package/lib-commonjs/Shimmer.styling.win32.d.ts +0 -8
- package/lib-commonjs/Shimmer.styling.win32.d.ts.map +0 -1
- package/lib-commonjs/Shimmer.styling.win32.js +0 -35
- package/lib-commonjs/Shimmer.styling.win32.js.map +0 -1
- package/lib-commonjs/Shimmer.test.d.ts +0 -2
- package/lib-commonjs/Shimmer.test.d.ts.map +0 -1
- package/lib-commonjs/Shimmer.test.js +0 -92
- package/lib-commonjs/Shimmer.test.js.map +0 -1
- package/lib-commonjs/Shimmer.types.d.ts +0 -3
- package/lib-commonjs/Shimmer.types.d.ts.map +0 -1
- package/lib-commonjs/Shimmer.types.js +0 -6
- package/lib-commonjs/Shimmer.types.js.map +0 -1
- package/lib-commonjs/Shimmer.types.shared.d.ts +0 -145
- package/lib-commonjs/Shimmer.types.shared.d.ts.map +0 -1
- package/lib-commonjs/Shimmer.types.shared.js +0 -5
- package/lib-commonjs/Shimmer.types.shared.js.map +0 -1
- package/lib-commonjs/Shimmer.types.win32.d.ts +0 -39
- package/lib-commonjs/Shimmer.types.win32.d.ts.map +0 -1
- package/lib-commonjs/Shimmer.types.win32.js +0 -6
- package/lib-commonjs/Shimmer.types.win32.js.map +0 -1
- package/lib-commonjs/Shimmer.win32.d.ts +0 -9
- package/lib-commonjs/Shimmer.win32.d.ts.map +0 -1
- package/lib-commonjs/Shimmer.win32.js +0 -135
- package/lib-commonjs/Shimmer.win32.js.map +0 -1
- package/lib-commonjs/ShimmerTokens.android.d.ts +0 -5
- package/lib-commonjs/ShimmerTokens.android.d.ts.map +0 -1
- package/lib-commonjs/ShimmerTokens.android.js +0 -15
- package/lib-commonjs/ShimmerTokens.android.js.map +0 -1
- package/lib-commonjs/ShimmerTokens.d.ts +0 -5
- package/lib-commonjs/ShimmerTokens.d.ts.map +0 -1
- package/lib-commonjs/ShimmerTokens.ios.d.ts +0 -5
- package/lib-commonjs/ShimmerTokens.ios.d.ts.map +0 -1
- package/lib-commonjs/ShimmerTokens.ios.js +0 -15
- package/lib-commonjs/ShimmerTokens.ios.js.map +0 -1
- package/lib-commonjs/ShimmerTokens.js +0 -17
- package/lib-commonjs/ShimmerTokens.js.map +0 -1
- package/lib-commonjs/ShimmerTokens.win32.d.ts +0 -5
- package/lib-commonjs/ShimmerTokens.win32.d.ts.map +0 -1
- package/lib-commonjs/ShimmerTokens.win32.js +0 -17
- package/lib-commonjs/ShimmerTokens.win32.js.map +0 -1
- package/lib-commonjs/SvgShapeToPath.d.ts +0 -18
- package/lib-commonjs/SvgShapeToPath.d.ts.map +0 -1
- package/lib-commonjs/SvgShapeToPath.js +0 -148
- package/lib-commonjs/SvgShapeToPath.js.map +0 -1
- package/lib-commonjs/Win32ShimmerNativeComponent.d.ts +0 -14
- package/lib-commonjs/Win32ShimmerNativeComponent.d.ts.map +0 -1
- package/lib-commonjs/Win32ShimmerNativeComponent.js +0 -10
- package/lib-commonjs/Win32ShimmerNativeComponent.js.map +0 -1
- package/lib-commonjs/consts.android.d.ts +0 -4
- package/lib-commonjs/consts.android.d.ts.map +0 -1
- package/lib-commonjs/consts.android.js +0 -7
- package/lib-commonjs/consts.android.js.map +0 -1
- package/lib-commonjs/consts.d.ts +0 -4
- package/lib-commonjs/consts.d.ts.map +0 -1
- package/lib-commonjs/consts.ios.d.ts +0 -4
- package/lib-commonjs/consts.ios.d.ts.map +0 -1
- package/lib-commonjs/consts.ios.js +0 -7
- package/lib-commonjs/consts.ios.js.map +0 -1
- package/lib-commonjs/consts.js +0 -7
- package/lib-commonjs/consts.js.map +0 -1
- package/lib-commonjs/consts.win32.d.ts +0 -4
- package/lib-commonjs/consts.win32.d.ts.map +0 -1
- package/lib-commonjs/consts.win32.js +0 -7
- package/lib-commonjs/consts.win32.js.map +0 -1
- package/lib-commonjs/index.d.ts +0 -5
- package/lib-commonjs/index.d.ts.map +0 -1
- package/lib-commonjs/index.js +0 -12
- package/lib-commonjs/index.js.map +0 -1
|
@@ -1,145 +0,0 @@
|
|
|
1
|
-
import type { ColorValue, ViewProps } from 'react-native';
|
|
2
|
-
import type { IBackgroundColorTokens } from '@fluentui-react-native/tokens';
|
|
3
|
-
import type { SvgProps } from 'react-native-svg';
|
|
4
|
-
export declare const shimmerName = "Shimmer";
|
|
5
|
-
/**
|
|
6
|
-
* Properties necessary to define a circular Shimmer element.
|
|
7
|
-
*/
|
|
8
|
-
export interface ShimmerCircleElement {
|
|
9
|
-
/**
|
|
10
|
-
* Shimmer element type.
|
|
11
|
-
*/
|
|
12
|
-
type: 'circle';
|
|
13
|
-
/**
|
|
14
|
-
* Radius of the circle element.
|
|
15
|
-
* @defaultValue 12
|
|
16
|
-
*/
|
|
17
|
-
radius?: number;
|
|
18
|
-
/**
|
|
19
|
-
* Note: cx and cy should be optional properties [or removed], with relative positioning being the default [or only] positioning mechanism.
|
|
20
|
-
* Note: The behavior of element intersections is undefined. https://www.github.com/Microsoft/fluentui-react-native Issue #866
|
|
21
|
-
*/
|
|
22
|
-
/**
|
|
23
|
-
* The x-axis center of the circle element in the Shimmer relative to the origin [top-left, (0,0)].
|
|
24
|
-
*/
|
|
25
|
-
cx: number;
|
|
26
|
-
/**
|
|
27
|
-
* The y-axis center of the circle element in the Shimmer relative to the origin [top-left, (0,0)].
|
|
28
|
-
*/
|
|
29
|
-
cy: number;
|
|
30
|
-
}
|
|
31
|
-
/**
|
|
32
|
-
* Properties necessary to define a rectangular Shimmer element.
|
|
33
|
-
*/
|
|
34
|
-
export interface ShimmerRectElement {
|
|
35
|
-
/**
|
|
36
|
-
* Shimmer element type.
|
|
37
|
-
*/
|
|
38
|
-
type: 'rect';
|
|
39
|
-
/**
|
|
40
|
-
* Width of the rect.
|
|
41
|
-
* @defaultValue 100%
|
|
42
|
-
*/
|
|
43
|
-
width?: number;
|
|
44
|
-
/**
|
|
45
|
-
* Height of the rect.
|
|
46
|
-
* @defaultValue 16
|
|
47
|
-
*/
|
|
48
|
-
height?: number;
|
|
49
|
-
/**
|
|
50
|
-
* Border radius for the x-axis of a rounded rect.
|
|
51
|
-
* @defaultValue 0
|
|
52
|
-
*/
|
|
53
|
-
borderRadiusX?: number;
|
|
54
|
-
/**
|
|
55
|
-
* Border radius for the y-axis of a rounded rect.
|
|
56
|
-
* @defaultValue 0
|
|
57
|
-
*/
|
|
58
|
-
borderRadiusY?: number;
|
|
59
|
-
/**
|
|
60
|
-
* Note: x and y should be optional properties [or removed], with relative positioning being the default [or only] positioning mechanism.
|
|
61
|
-
* Note: The behavior of element intersections is undefined. https://www.github.com/Microsoft/fluentui-react-native Issue #866
|
|
62
|
-
*/
|
|
63
|
-
/**
|
|
64
|
-
* The x-axis position of the rect element's top-left corner in the Shimmer relative to the origin [top-left, (0,0)].
|
|
65
|
-
*/
|
|
66
|
-
x: number;
|
|
67
|
-
/**
|
|
68
|
-
* The y-axis position of the rect element's top-left corner in the Shimmer relative to the origin [top-left, (0,0)].
|
|
69
|
-
*/
|
|
70
|
-
y: number;
|
|
71
|
-
}
|
|
72
|
-
export type ShimmerElementTypes = ShimmerCircleElement | ShimmerRectElement;
|
|
73
|
-
export interface ShimmerTokens extends IBackgroundColorTokens {
|
|
74
|
-
/**
|
|
75
|
-
* Specifies the Shimmer effect angle in degrees (produced by a gradient).
|
|
76
|
-
*
|
|
77
|
-
* @defaultValue 45 on @platform Android
|
|
78
|
-
* @defaultValue 0 on other platforms.
|
|
79
|
-
*/
|
|
80
|
-
angle?: number;
|
|
81
|
-
/**
|
|
82
|
-
* Specifies the animation delay time in milliseconds.
|
|
83
|
-
*
|
|
84
|
-
* @defaultValue 500 on @platform win32
|
|
85
|
-
* @defaultValue 0 on other platforms.
|
|
86
|
-
*/
|
|
87
|
-
delay?: number;
|
|
88
|
-
/**
|
|
89
|
-
* Specifies the time required to traverse the control in milliseconds.
|
|
90
|
-
*
|
|
91
|
-
* @defaultValue 1000 on @platform Android
|
|
92
|
-
* @defaultValue 2000 on @platform win32
|
|
93
|
-
* @defaultValue 7000 on other platforms.
|
|
94
|
-
*/
|
|
95
|
-
duration?: number;
|
|
96
|
-
/**
|
|
97
|
-
* Specifies the opacity of the shimmer color.
|
|
98
|
-
* @defaultValue 1
|
|
99
|
-
*/
|
|
100
|
-
shimmerColorOpacity?: number;
|
|
101
|
-
/**
|
|
102
|
-
* Specifies the opacity of the wave color.
|
|
103
|
-
* @defaultValue 1
|
|
104
|
-
*/
|
|
105
|
-
shimmerWaveColorOpacity?: number;
|
|
106
|
-
/**
|
|
107
|
-
* Color you see when the shimmer wave is not animating.
|
|
108
|
-
*
|
|
109
|
-
* @defaultValue theme.colors.neutralStencil1 on @platform Android
|
|
110
|
-
* @defaultValue theme.colors.bodyFrameDivider on @platform win32
|
|
111
|
-
* @defaultValue #E1E1E1/#404040 for light/dark theme on other platforms.
|
|
112
|
-
*/
|
|
113
|
-
shimmerColor?: ColorValue;
|
|
114
|
-
/**
|
|
115
|
-
* Defines the tip color of the wave which has a linear gradient.
|
|
116
|
-
* from shimmerColor to shimmerWaveColor to shimmerColor.
|
|
117
|
-
*
|
|
118
|
-
* @defaultValue theme.colors.neutralStencil2 on @platform Android
|
|
119
|
-
* @defaultValue #E1E1E1 on @platform win32
|
|
120
|
-
* @defaultValue white/black for light/dark theme on other platforms.
|
|
121
|
-
*/
|
|
122
|
-
shimmerWaveColor?: ColorValue;
|
|
123
|
-
/**
|
|
124
|
-
* Width of the Shimmer wave.
|
|
125
|
-
*
|
|
126
|
-
* @defaultValue '100%' of the 'width' property
|
|
127
|
-
* @platform win32
|
|
128
|
-
*/
|
|
129
|
-
shimmerWaveWidth?: number | string;
|
|
130
|
-
}
|
|
131
|
-
export interface ShimmerSlotProps {
|
|
132
|
-
root: SvgProps;
|
|
133
|
-
}
|
|
134
|
-
export interface ShimmerProps extends ViewProps, ShimmerTokens {
|
|
135
|
-
/**
|
|
136
|
-
* Shimmer shapes that define the masking effect of the Shimmer control.
|
|
137
|
-
*/
|
|
138
|
-
elements: Array<ShimmerElementTypes>;
|
|
139
|
-
}
|
|
140
|
-
export interface ShimmerType {
|
|
141
|
-
props: ShimmerProps;
|
|
142
|
-
slotProps: ShimmerSlotProps;
|
|
143
|
-
tokens: ShimmerTokens;
|
|
144
|
-
}
|
|
145
|
-
//# sourceMappingURL=Shimmer.types.shared.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.shared.d.ts","sourceRoot":"","sources":["../src/Shimmer.types.shared.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE1D,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEjD,eAAO,MAAM,WAAW,YAAY,CAAC;AAErC;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,IAAI,EAAE,QAAQ,CAAC;IAEf;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IAEH;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;CACZ;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;OAGG;IAEH;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IAEV;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,MAAM,mBAAmB,GAAG,oBAAoB,GAAG,kBAAkB,CAAC;AAE5E,MAAM,WAAW,aAAc,SAAQ,sBAAsB;IAC3D;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B;;;OAGG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IAEjC;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,UAAU,CAAC;IAE1B;;;;;;;OAOG;IACH,gBAAgB,CAAC,EAAE,UAAU,CAAC;IAE9B;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACpC;AAED,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,QAAQ,CAAC;CAChB;AAED,MAAM,WAAW,YAAa,SAAQ,SAAS,EAAE,aAAa;IAC5D;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,mBAAmB,CAAC,CAAC;CACtC;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,YAAY,CAAC;IACpB,SAAS,EAAE,gBAAgB,CAAC;IAC5B,MAAM,EAAE,aAAa,CAAC;CACvB"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.shared.js","sourceRoot":"","sources":["../src/Shimmer.types.shared.ts"],"names":[],"mappings":";;;AAKa,QAAA,WAAW,GAAG,SAAS,CAAC"}
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import type { ViewProps } from 'react-native';
|
|
2
|
-
import type { ShimmerProps, ShimmerTokens } from './Shimmer.types.shared';
|
|
3
|
-
export type { ShimmerProps, ShimmerTokens };
|
|
4
|
-
export type { ShimmerRectElement, ShimmerElementTypes, ShimmerCircleElement } from './Shimmer.types.shared';
|
|
5
|
-
export { shimmerName } from './Shimmer.types.shared';
|
|
6
|
-
export interface ClippingMaskProps extends ShimmerTokens {
|
|
7
|
-
/**
|
|
8
|
-
* Extra parameter necessary to provide the mask effect generated from the provided ShimmerElements.
|
|
9
|
-
*
|
|
10
|
-
* @defaultValue null
|
|
11
|
-
*/
|
|
12
|
-
clipPath?: string;
|
|
13
|
-
/**
|
|
14
|
-
* The height and width of the viewBox are internal props used by the SVG to size themselves and
|
|
15
|
-
* set up their viewBox to establish coordinate space for DPI scaling purposes.
|
|
16
|
-
*/
|
|
17
|
-
viewBoxHeight: number;
|
|
18
|
-
viewBoxWidth: number;
|
|
19
|
-
}
|
|
20
|
-
export interface ShimmerWaveProps extends ShimmerTokens {
|
|
21
|
-
/**
|
|
22
|
-
* The height and width of the viewBox are internal props used by the SVG to size themselves and
|
|
23
|
-
* set up their viewBox to establish coordinate space for DPI scaling purposes.
|
|
24
|
-
*/
|
|
25
|
-
viewBoxHeight: number;
|
|
26
|
-
viewBoxWidth: number;
|
|
27
|
-
}
|
|
28
|
-
export interface ShimmerSlotProps {
|
|
29
|
-
root: ViewProps;
|
|
30
|
-
clippingMask: ClippingMaskProps;
|
|
31
|
-
shimmerWave: ShimmerWaveProps;
|
|
32
|
-
shimmerWaveContainer: React.PropsWithChildren<ShimmerWaveProps>;
|
|
33
|
-
}
|
|
34
|
-
export interface ShimmerType {
|
|
35
|
-
props: ShimmerProps;
|
|
36
|
-
slotProps: ShimmerSlotProps;
|
|
37
|
-
tokens: ShimmerTokens;
|
|
38
|
-
}
|
|
39
|
-
//# sourceMappingURL=Shimmer.types.win32.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
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,6 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.shimmerName = void 0;
|
|
4
|
-
const Shimmer_types_shared_1 = require("./Shimmer.types.shared");
|
|
5
|
-
Object.defineProperty(exports, "shimmerName", { enumerable: true, get: function () { return Shimmer_types_shared_1.shimmerName; } });
|
|
6
|
-
//# sourceMappingURL=Shimmer.types.win32.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.types.win32.js","sourceRoot":"","sources":["../src/Shimmer.types.win32.ts"],"names":[],"mappings":";;;AAKA,iEAAqD;AAA5C,mHAAA,WAAW,OAAA"}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright (c) Microsoft Corporation.
|
|
3
|
-
* Licensed under the MIT License.
|
|
4
|
-
* @format
|
|
5
|
-
*/
|
|
6
|
-
import type { ShimmerProps, ShimmerCircleElement, ShimmerRectElement } from './Shimmer.types.shared';
|
|
7
|
-
export type { ShimmerCircleElement, ShimmerRectElement };
|
|
8
|
-
export declare const Shimmer: import("@fluentui-react-native/framework").ComposableComponent<ShimmerProps, import("./Shimmer.types.win32").ShimmerSlotProps, import("./Shimmer.types.shared").ShimmerTokens, import("@fluentui-react-native/framework").ObjectBase>;
|
|
9
|
-
//# sourceMappingURL=Shimmer.win32.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.win32.d.ts","sourceRoot":"","sources":["../src/Shimmer.win32.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAYH,OAAO,KAAK,EAAuB,YAAY,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC1H,YAAY,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,CAAC;AAoFzD,eAAO,MAAM,OAAO,uOAwElB,CAAC"}
|
|
@@ -1,135 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Shimmer = void 0;
|
|
7
|
-
const jsx_runtime_1 = require("@fluentui-react-native/framework-base/jsx-runtime");
|
|
8
|
-
/**
|
|
9
|
-
* Copyright (c) Microsoft Corporation.
|
|
10
|
-
* Licensed under the MIT License.
|
|
11
|
-
* @format
|
|
12
|
-
*/
|
|
13
|
-
/** @jsxImportSource @fluentui-react-native/framework-base */
|
|
14
|
-
const react_native_1 = require("react-native");
|
|
15
|
-
const framework_1 = require("@fluentui-react-native/framework");
|
|
16
|
-
const assert_never_1 = require("assert-never");
|
|
17
|
-
const react_native_svg_1 = require("react-native-svg");
|
|
18
|
-
const Shimmer_styling_win32_1 = require("./Shimmer.styling.win32");
|
|
19
|
-
const Shimmer_types_shared_1 = require("./Shimmer.types.shared");
|
|
20
|
-
const SvgShapeToPath_1 = require("./SvgShapeToPath");
|
|
21
|
-
const Win32ShimmerNativeComponent_1 = __importDefault(require("./Win32ShimmerNativeComponent"));
|
|
22
|
-
const clippingMask = (props) => {
|
|
23
|
-
/**
|
|
24
|
-
* Absolute positioning is used to overlay the clipping mask on top of the shimmer wave.
|
|
25
|
-
*
|
|
26
|
-
* preserveAspectRatio = 'xMinYMin slice' asks the SVG to scale the viewBox up to fit the
|
|
27
|
-
* viewPort, starting from the origin of the viewPort and minimum coordinates of the viewBox.
|
|
28
|
-
* 'slice' removes the unnecessary remainder.
|
|
29
|
-
*/
|
|
30
|
-
const { backgroundColor, viewBoxHeight, viewBoxWidth } = props;
|
|
31
|
-
const svgProps = {
|
|
32
|
-
style: { position: 'absolute', height: viewBoxHeight, width: viewBoxWidth },
|
|
33
|
-
viewBox: '0 0 ' + viewBoxWidth + ' ' + viewBoxHeight,
|
|
34
|
-
preserveAspectRatio: 'xMinYMin slice',
|
|
35
|
-
};
|
|
36
|
-
return (jsx_runtime_1.jsxs(react_native_svg_1.Svg, { ...svgProps, children: [
|
|
37
|
-
jsx_runtime_1.jsx(react_native_svg_1.Defs, { children: jsx_runtime_1.jsx(react_native_svg_1.ClipPath, { id: "shimmerCuts", children: jsx_runtime_1.jsx(react_native_svg_1.Path, { d: props.clipPath, clipRule: "evenodd" }) }) }), jsx_runtime_1.jsx(react_native_svg_1.Rect, { width: "100%", height: "100%", fill: backgroundColor, clipPath: "url(#shimmerCuts)" })
|
|
38
|
-
] }));
|
|
39
|
-
};
|
|
40
|
-
const wave = (props) => {
|
|
41
|
-
const { shimmerColor, shimmerColorOpacity, shimmerWaveColor, shimmerWaveColorOpacity, viewBoxHeight, viewBoxWidth } = props;
|
|
42
|
-
/**
|
|
43
|
-
* See the comment above for an explanation of preserveAspectRatio.
|
|
44
|
-
*/
|
|
45
|
-
const svgProps = {
|
|
46
|
-
style: { height: viewBoxHeight, width: viewBoxWidth },
|
|
47
|
-
viewBox: '0 0 ' + viewBoxWidth + ' ' + viewBoxHeight,
|
|
48
|
-
preserveAspectRatio: 'xMinYMin slice',
|
|
49
|
-
};
|
|
50
|
-
/**
|
|
51
|
-
* React-Native-SVG doesn't process opaque color values correctly for gradients, directly invoking `processColor`
|
|
52
|
-
* and squashing in the opacity value of the color stop. This handling scheme is incompatible with OpaqueColorValue type
|
|
53
|
-
* colors e.g. PlatformColor, and will show nothing. As a short-term solution, provide alternate non-gradient handling
|
|
54
|
-
* of the wave color as a solid color.
|
|
55
|
-
*/
|
|
56
|
-
if (typeof (0, react_native_1.processColor)(shimmerWaveColor) !== 'object' && typeof (0, react_native_1.processColor)(shimmerColor) !== 'object') {
|
|
57
|
-
// The typical path where the provided shimmer colors are not OpaqueColorValues.
|
|
58
|
-
return (jsx_runtime_1.jsxs(react_native_svg_1.Svg, { ...svgProps, children: [
|
|
59
|
-
jsx_runtime_1.jsxs(react_native_svg_1.LinearGradient, { id: "gradient", children: [
|
|
60
|
-
jsx_runtime_1.jsx(react_native_svg_1.Stop, { stopColor: shimmerColor, stopOpacity: shimmerColorOpacity }), jsx_runtime_1.jsx(react_native_svg_1.Stop, { offset: "20%", stopColor: shimmerWaveColor, stopOpacity: shimmerWaveColorOpacity }), jsx_runtime_1.jsx(react_native_svg_1.Stop, { offset: "40%", stopColor: shimmerColor, stopOpacity: shimmerColorOpacity })
|
|
61
|
-
] }), jsx_runtime_1.jsx(react_native_svg_1.Rect, { width: props.shimmerWaveWidth, height: "100%", fill: "url(#gradient)" })
|
|
62
|
-
] }));
|
|
63
|
-
}
|
|
64
|
-
else {
|
|
65
|
-
// The unexpected path where either of the provided shimmer colors are OpaqueColorValues.
|
|
66
|
-
// scaleX is used to mimic the gradient occupying 40% of the fill since we don't know the provided width of the
|
|
67
|
-
// shimmer wave.
|
|
68
|
-
return (jsx_runtime_1.jsx(react_native_svg_1.Svg, { ...svgProps, children: jsx_runtime_1.jsx(react_native_svg_1.Rect, { width: props.shimmerWaveWidth, height: "100%", fill: shimmerWaveColor, fillOpacity: shimmerWaveColorOpacity, scaleX: "0.4" }) }));
|
|
69
|
-
}
|
|
70
|
-
};
|
|
71
|
-
const waveContainer = (props) => {
|
|
72
|
-
const { shimmerColor, viewBoxHeight, viewBoxWidth } = props;
|
|
73
|
-
return (jsx_runtime_1.jsx(Win32ShimmerNativeComponent_1.default, { ...props, style: { backgroundColor: shimmerColor, height: viewBoxHeight, width: viewBoxWidth, overflow: 'hidden' } }));
|
|
74
|
-
};
|
|
75
|
-
exports.Shimmer = (0, framework_1.compose)({
|
|
76
|
-
displayName: Shimmer_types_shared_1.shimmerName,
|
|
77
|
-
...Shimmer_styling_win32_1.stylingSettings,
|
|
78
|
-
slots: {
|
|
79
|
-
root: react_native_1.View,
|
|
80
|
-
clippingMask: clippingMask,
|
|
81
|
-
shimmerWave: wave,
|
|
82
|
-
shimmerWaveContainer: waveContainer,
|
|
83
|
-
},
|
|
84
|
-
useRender: (props, useSlots) => {
|
|
85
|
-
const Slots = useSlots(props);
|
|
86
|
-
return (rest) => {
|
|
87
|
-
const { elements, ...mergedProps } = (0, framework_1.mergeProps)(props, rest);
|
|
88
|
-
/**
|
|
89
|
-
* Generate a clip path from the provided element shapes, with their path parameter strings generated from their corresponding properties.
|
|
90
|
-
* Ideally this would be better possible with functions from the shape elements themselves and not to rely on our own calculations.
|
|
91
|
-
*
|
|
92
|
-
* One nuanced consideration is scaling the SVG with DPI. Without specifying a viewBox, points are considered to be pixels on an SVG canvas.
|
|
93
|
-
* When the native control is scaled the SVG canvas will scale up -- but pixel coordinates will not, changing the visual for different pixel densities.
|
|
94
|
-
* By providing a viewBox appropriate for our SVG the viewBox containing the graphics will be scaled up to fit the viewPort.
|
|
95
|
-
* Since we're programmatically generating the visual, we can assert our viewBox is `0 0 xMax yMax` where xMax and yMax are the greatest
|
|
96
|
-
* X and Y points used by a shape.
|
|
97
|
-
*/
|
|
98
|
-
let clipPathsAsMask = [];
|
|
99
|
-
let xMax = 0;
|
|
100
|
-
let yMax = 0;
|
|
101
|
-
if (elements) {
|
|
102
|
-
elements.forEach((element) => {
|
|
103
|
-
if (element.type == 'circle') {
|
|
104
|
-
clipPathsAsMask = clipPathsAsMask.concat((0, SvgShapeToPath_1.convertCircleToSvgPath)(element));
|
|
105
|
-
const xMaxCandidate = element.cx + element.radius;
|
|
106
|
-
const yMaxCandidate = element.cy + element.radius;
|
|
107
|
-
xMax = xMax >= xMaxCandidate ? xMax : xMaxCandidate;
|
|
108
|
-
yMax = yMax >= yMaxCandidate ? yMax : yMaxCandidate;
|
|
109
|
-
}
|
|
110
|
-
else if (element.type == 'rect') {
|
|
111
|
-
clipPathsAsMask = clipPathsAsMask.concat((0, SvgShapeToPath_1.convertRectToSvgPath)(element));
|
|
112
|
-
const xMaxCandidate = element.x + element.width;
|
|
113
|
-
const yMaxCandidate = element.y + element.height;
|
|
114
|
-
xMax = xMax >= xMaxCandidate ? xMax : xMaxCandidate;
|
|
115
|
-
yMax = yMax >= yMaxCandidate ? yMax : yMaxCandidate;
|
|
116
|
-
}
|
|
117
|
-
else {
|
|
118
|
-
(0, assert_never_1.assertNever)(element);
|
|
119
|
-
}
|
|
120
|
-
});
|
|
121
|
-
}
|
|
122
|
-
/**
|
|
123
|
-
* Win32 D2D1 doesn't directly support SVG mask elements, so we're going to generate a mask
|
|
124
|
-
* by manipulating our clip path for the same effect. We do so utilizing the clip-rule='evenodd'
|
|
125
|
-
* and drawing a rectangle around the entire svg viewBox, causing all inner elements to be "clipped out"
|
|
126
|
-
* instead of "clipped around," generating the visual we desire with the linear gradient below the mask.
|
|
127
|
-
*/
|
|
128
|
-
const mergedClipPath = clipPathsAsMask.join(' ').concat('M 0 0 h ' + xMax + ' v ' + yMax + ' h -' + xMax + ' z ');
|
|
129
|
-
return (jsx_runtime_1.jsxs(Slots.root, { ...mergedProps, children: [
|
|
130
|
-
jsx_runtime_1.jsx(Slots.shimmerWaveContainer, { viewBoxHeight: yMax, viewBoxWidth: xMax, children: jsx_runtime_1.jsx(Slots.shimmerWave, { viewBoxHeight: yMax, viewBoxWidth: xMax }) }), jsx_runtime_1.jsx(Slots.clippingMask, { clipPath: mergedClipPath, viewBoxHeight: yMax, viewBoxWidth: xMax })
|
|
131
|
-
] }));
|
|
132
|
-
};
|
|
133
|
-
},
|
|
134
|
-
});
|
|
135
|
-
//# sourceMappingURL=Shimmer.win32.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Shimmer.win32.js","sourceRoot":"","sources":["../src/Shimmer.win32.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import type { Theme } from '@fluentui-react-native/framework';
|
|
2
|
-
import type { TokenSettings } from '@fluentui-react-native/use-styling';
|
|
3
|
-
import type { ShimmerTokens } from './Shimmer.types';
|
|
4
|
-
export declare const defaultShimmerTokens: TokenSettings<ShimmerTokens, Theme>;
|
|
5
|
-
//# sourceMappingURL=ShimmerTokens.android.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ShimmerTokens.android.d.ts","sourceRoot":"","sources":["../src/ShimmerTokens.android.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kCAAkC,CAAC;AAC9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAC;AAGxE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAErD,eAAO,MAAM,oBAAoB,EAAE,aAAa,CAAC,aAAa,EAAE,KAAK,CAShD,CAAC"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.defaultShimmerTokens = void 0;
|
|
4
|
-
const consts_1 = require("./consts");
|
|
5
|
-
const defaultShimmerTokens = (theme) => ({
|
|
6
|
-
angle: consts_1.shimmerDefaultAngle,
|
|
7
|
-
delay: consts_1.shimmerDefaultDelay,
|
|
8
|
-
duration: consts_1.shimmerDefaultDuration,
|
|
9
|
-
shimmerColor: theme.colors.neutralStencil1,
|
|
10
|
-
shimmerColorOpacity: 1,
|
|
11
|
-
shimmerWaveColor: theme.colors.neutralStencil2,
|
|
12
|
-
shimmerWaveColorOpacity: 1,
|
|
13
|
-
});
|
|
14
|
-
exports.defaultShimmerTokens = defaultShimmerTokens;
|
|
15
|
-
//# sourceMappingURL=ShimmerTokens.android.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ShimmerTokens.android.js","sourceRoot":"","sources":["../src/ShimmerTokens.android.ts"],"names":[],"mappings":";;;AAGA,qCAA4F;AAGrF,MAAM,oBAAoB,GAAwC,CAAC,KAAY,EAAE,EAAE,CACxF,CAAC;IACC,KAAK,EAAE,4BAAmB;IAC1B,KAAK,EAAE,4BAAmB;IAC1B,QAAQ,EAAE,+BAAsB;IAChC,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,eAAe;IAC1C,mBAAmB,EAAE,CAAC;IACtB,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,eAAe;IAC9C,uBAAuB,EAAE,CAAC;CAC3B,CAAkB,CAAC;AATT,QAAA,oBAAoB,GAApB,oBAAoB,CASX"}
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import type { Theme } from '@fluentui-react-native/framework';
|
|
2
|
-
import type { TokenSettings } from '@fluentui-react-native/use-styling';
|
|
3
|
-
import type { ShimmerTokens } from './Shimmer.types';
|
|
4
|
-
export declare const defaultShimmerTokens: TokenSettings<ShimmerTokens, Theme>;
|
|
5
|
-
//# sourceMappingURL=ShimmerTokens.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ShimmerTokens.d.ts","sourceRoot":"","sources":["../src/ShimmerTokens.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kCAAkC,CAAC;AAE9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAC;AAGxE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAErD,eAAO,MAAM,oBAAoB,EAAE,aAAa,CAAC,aAAa,EAAE,KAAK,CAUhD,CAAC"}
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import type { Theme } from '@fluentui-react-native/framework';
|
|
2
|
-
import type { TokenSettings } from '@fluentui-react-native/use-styling';
|
|
3
|
-
import type { ShimmerTokens } from './Shimmer.types';
|
|
4
|
-
export declare const defaultShimmerTokens: TokenSettings<ShimmerTokens, Theme>;
|
|
5
|
-
//# sourceMappingURL=ShimmerTokens.ios.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ShimmerTokens.ios.d.ts","sourceRoot":"","sources":["../src/ShimmerTokens.ios.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kCAAkC,CAAC;AAC9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAC;AAGxE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAErD,eAAO,MAAM,oBAAoB,EAAE,aAAa,CAAC,aAAa,EAAE,KAAK,CAShD,CAAC"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.defaultShimmerTokens = void 0;
|
|
4
|
-
const consts_1 = require("./consts");
|
|
5
|
-
const defaultShimmerTokens = (theme) => ({
|
|
6
|
-
angle: consts_1.shimmerDefaultAngle,
|
|
7
|
-
delay: consts_1.shimmerDefaultDelay,
|
|
8
|
-
duration: consts_1.shimmerDefaultDuration,
|
|
9
|
-
shimmerColor: theme.colors.neutralStencil1,
|
|
10
|
-
shimmerColorOpacity: 1,
|
|
11
|
-
shimmerWaveColor: theme.colors.neutralStencil2,
|
|
12
|
-
shimmerWaveColorOpacity: 1,
|
|
13
|
-
});
|
|
14
|
-
exports.defaultShimmerTokens = defaultShimmerTokens;
|
|
15
|
-
//# sourceMappingURL=ShimmerTokens.ios.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ShimmerTokens.ios.js","sourceRoot":"","sources":["../src/ShimmerTokens.ios.ts"],"names":[],"mappings":";;;AAGA,qCAA4F;AAGrF,MAAM,oBAAoB,GAAwC,CAAC,KAAY,EAAE,EAAE,CACxF,CAAC;IACC,KAAK,EAAE,4BAAmB;IAC1B,KAAK,EAAE,4BAAmB;IAC1B,QAAQ,EAAE,+BAAsB;IAChC,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,eAAe;IAC1C,mBAAmB,EAAE,CAAC;IACtB,gBAAgB,EAAE,KAAK,CAAC,MAAM,CAAC,eAAe;IAC9C,uBAAuB,EAAE,CAAC;CAC3B,CAAkB,CAAC;AATT,QAAA,oBAAoB,GAApB,oBAAoB,CASX"}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.defaultShimmerTokens = void 0;
|
|
4
|
-
const theming_utils_1 = require("@fluentui-react-native/theming-utils");
|
|
5
|
-
const consts_1 = require("./consts");
|
|
6
|
-
const defaultShimmerTokens = (theme) => ({
|
|
7
|
-
angle: consts_1.shimmerDefaultAngle,
|
|
8
|
-
backgroundColor: theme.colors.transparentBackground,
|
|
9
|
-
delay: consts_1.shimmerDefaultDelay,
|
|
10
|
-
duration: consts_1.shimmerDefaultDuration,
|
|
11
|
-
shimmerColor: (0, theming_utils_1.getCurrentAppearance)(theme.host.appearance, 'light') === 'light' ? '#E1E1E1' : '#404040',
|
|
12
|
-
shimmerColorOpacity: 1,
|
|
13
|
-
shimmerWaveColor: (0, theming_utils_1.getCurrentAppearance)(theme.host.appearance, 'light') === 'light' ? 'white' : 'black',
|
|
14
|
-
shimmerWaveColorOpacity: 1,
|
|
15
|
-
});
|
|
16
|
-
exports.defaultShimmerTokens = defaultShimmerTokens;
|
|
17
|
-
//# sourceMappingURL=ShimmerTokens.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ShimmerTokens.js","sourceRoot":"","sources":["../src/ShimmerTokens.ts"],"names":[],"mappings":";;;AACA,wEAA4E;AAG5E,qCAA4F;AAGrF,MAAM,oBAAoB,GAAwC,CAAC,KAAY,EAAE,EAAE,CACxF,CAAC;IACC,KAAK,EAAE,4BAAmB;IAC1B,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,qBAAqB;IACnD,KAAK,EAAE,4BAAmB;IAC1B,QAAQ,EAAE,+BAAsB;IAChC,YAAY,EAAE,IAAA,oCAAoB,EAAC,KAAK,CAAC,IAAI,CAAC,UAAU,EAAE,OAAO,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;IACtG,mBAAmB,EAAE,CAAC;IACtB,gBAAgB,EAAE,IAAA,oCAAoB,EAAC,KAAK,CAAC,IAAI,CAAC,UAAU,EAAE,OAAO,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO;IACtG,uBAAuB,EAAE,CAAC;CAC3B,CAAkB,CAAC;AAVT,QAAA,oBAAoB,GAApB,oBAAoB,CAUX"}
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import type { Theme } from '@fluentui-react-native/framework';
|
|
2
|
-
import type { TokenSettings } from '@fluentui-react-native/use-styling';
|
|
3
|
-
import type { ShimmerTokens } from './Shimmer.types';
|
|
4
|
-
export declare const defaultShimmerTokens: TokenSettings<ShimmerTokens, Theme>;
|
|
5
|
-
//# sourceMappingURL=ShimmerTokens.win32.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ShimmerTokens.win32.d.ts","sourceRoot":"","sources":["../src/ShimmerTokens.win32.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kCAAkC,CAAC;AAC9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oCAAoC,CAAC;AAGxE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAErD,eAAO,MAAM,oBAAoB,EAAE,aAAa,CAAC,aAAa,EAAE,KAAK,CAWhD,CAAC"}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.defaultShimmerTokens = void 0;
|
|
4
|
-
const consts_1 = require("./consts");
|
|
5
|
-
const defaultShimmerTokens = (theme) => ({
|
|
6
|
-
angle: consts_1.shimmerDefaultAngle,
|
|
7
|
-
backgroundColor: theme.colors.background,
|
|
8
|
-
delay: consts_1.shimmerDefaultDelay,
|
|
9
|
-
duration: consts_1.shimmerDefaultDuration,
|
|
10
|
-
shimmerColor: theme.colors.bodyFrameDivider,
|
|
11
|
-
shimmerColorOpacity: 1,
|
|
12
|
-
shimmerWaveColor: '#E1E1E1',
|
|
13
|
-
shimmerWaveColorOpacity: 1,
|
|
14
|
-
shimmerWaveWidth: '100%',
|
|
15
|
-
});
|
|
16
|
-
exports.defaultShimmerTokens = defaultShimmerTokens;
|
|
17
|
-
//# sourceMappingURL=ShimmerTokens.win32.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ShimmerTokens.win32.js","sourceRoot":"","sources":["../src/ShimmerTokens.win32.ts"],"names":[],"mappings":";;;AAGA,qCAA4F;AAGrF,MAAM,oBAAoB,GAAwC,CAAC,KAAY,EAAE,EAAE,CACxF,CAAC;IACC,KAAK,EAAE,4BAAmB;IAC1B,eAAe,EAAE,KAAK,CAAC,MAAM,CAAC,UAAU;IACxC,KAAK,EAAE,4BAAmB;IAC1B,QAAQ,EAAE,+BAAsB;IAChC,YAAY,EAAE,KAAK,CAAC,MAAM,CAAC,gBAAgB;IAC3C,mBAAmB,EAAE,CAAC;IACtB,gBAAgB,EAAE,SAAS;IAC3B,uBAAuB,EAAE,CAAC;IAC1B,gBAAgB,EAAE,MAAM;CACzB,CAAkB,CAAC;AAXT,QAAA,oBAAoB,GAApB,oBAAoB,CAWX"}
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* These functions are necessary to deal with the win32 platform issue of d2d1 not supporting SVG <Mask> elements.
|
|
3
|
-
* We can support them indirectly by inverting a <ClipPath> element, with the troublesome issue of there being
|
|
4
|
-
* no direct way to do so -- which makes sense in general, one would just use <Mask> instead.
|
|
5
|
-
*
|
|
6
|
-
* The most desirable interface would be a ClipPath.invert property or function and/or a toString; masking
|
|
7
|
-
* is generally an inversion of clipping, but we do not have such properties or functions. This void can
|
|
8
|
-
* be filled by implementing directly (a worthwhile PR to react-native-svg) or by implementing toString functions
|
|
9
|
-
* for shapes individually. The shapes individually can be composed into a single clip path string, along with
|
|
10
|
-
* a shape that covers the entire SVG canvas. Using the evenodd clip rule, this effectively becomes a mask.
|
|
11
|
-
*
|
|
12
|
-
* This solution is far from ideal and may have incompatibilities with <ClipPath> features; for Shimmer, it's sufficient,
|
|
13
|
-
* as we only support rounded rects and circles, with a circle being a rounded rect of borderRadius=length/2=width/2.
|
|
14
|
-
*/
|
|
15
|
-
import type { ShimmerCircleElement, ShimmerRectElement } from './Shimmer.types';
|
|
16
|
-
export declare function convertRectToSvgPath(rectShape: ShimmerRectElement): string;
|
|
17
|
-
export declare function convertCircleToSvgPath(circleShape: ShimmerCircleElement): string;
|
|
18
|
-
//# sourceMappingURL=SvgShapeToPath.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"SvgShapeToPath.d.ts","sourceRoot":"","sources":["../src/SvgShapeToPath.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAgJhF,wBAAgB,oBAAoB,CAAC,SAAS,EAAE,kBAAkB,GAAG,MAAM,CAU1E;AAED,wBAAgB,sBAAsB,CAAC,WAAW,EAAE,oBAAoB,GAAG,MAAM,CAWhF"}
|