@fluentui-react-native/experimental-shimmer 0.14.3 → 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.
Files changed (90) hide show
  1. package/.cache/tsconfig.tsbuildinfo +1 -0
  2. package/CHANGELOG.md +20 -0
  3. package/jest.config.cjs +1 -0
  4. package/lib/Shimmer.js +1 -9
  5. package/lib/Shimmer.js.map +1 -1
  6. package/lib/Shimmer.test.js.map +1 -1
  7. package/lib/Shimmer.win32.js +3 -11
  8. package/lib/Shimmer.win32.js.map +1 -1
  9. package/lib/SvgShapeToPath.js.map +1 -1
  10. package/lib/Win32ShimmerNativeComponent.d.ts.map +1 -1
  11. package/package.json +16 -21
  12. package/tsconfig.json +26 -3
  13. package/babel.config.js +0 -1
  14. package/jest.config.js +0 -2
  15. package/lib-commonjs/Shimmer.d.ts +0 -3
  16. package/lib-commonjs/Shimmer.d.ts.map +0 -1
  17. package/lib-commonjs/Shimmer.js +0 -94
  18. package/lib-commonjs/Shimmer.js.map +0 -1
  19. package/lib-commonjs/Shimmer.styling.d.ts +0 -4
  20. package/lib-commonjs/Shimmer.styling.d.ts.map +0 -1
  21. package/lib-commonjs/Shimmer.styling.js +0 -34
  22. package/lib-commonjs/Shimmer.styling.js.map +0 -1
  23. package/lib-commonjs/Shimmer.styling.win32.d.ts +0 -8
  24. package/lib-commonjs/Shimmer.styling.win32.d.ts.map +0 -1
  25. package/lib-commonjs/Shimmer.styling.win32.js +0 -35
  26. package/lib-commonjs/Shimmer.styling.win32.js.map +0 -1
  27. package/lib-commonjs/Shimmer.test.d.ts +0 -2
  28. package/lib-commonjs/Shimmer.test.d.ts.map +0 -1
  29. package/lib-commonjs/Shimmer.test.js +0 -92
  30. package/lib-commonjs/Shimmer.test.js.map +0 -1
  31. package/lib-commonjs/Shimmer.types.d.ts +0 -3
  32. package/lib-commonjs/Shimmer.types.d.ts.map +0 -1
  33. package/lib-commonjs/Shimmer.types.js +0 -6
  34. package/lib-commonjs/Shimmer.types.js.map +0 -1
  35. package/lib-commonjs/Shimmer.types.shared.d.ts +0 -145
  36. package/lib-commonjs/Shimmer.types.shared.d.ts.map +0 -1
  37. package/lib-commonjs/Shimmer.types.shared.js +0 -5
  38. package/lib-commonjs/Shimmer.types.shared.js.map +0 -1
  39. package/lib-commonjs/Shimmer.types.win32.d.ts +0 -39
  40. package/lib-commonjs/Shimmer.types.win32.d.ts.map +0 -1
  41. package/lib-commonjs/Shimmer.types.win32.js +0 -6
  42. package/lib-commonjs/Shimmer.types.win32.js.map +0 -1
  43. package/lib-commonjs/Shimmer.win32.d.ts +0 -9
  44. package/lib-commonjs/Shimmer.win32.d.ts.map +0 -1
  45. package/lib-commonjs/Shimmer.win32.js +0 -135
  46. package/lib-commonjs/Shimmer.win32.js.map +0 -1
  47. package/lib-commonjs/ShimmerTokens.android.d.ts +0 -5
  48. package/lib-commonjs/ShimmerTokens.android.d.ts.map +0 -1
  49. package/lib-commonjs/ShimmerTokens.android.js +0 -15
  50. package/lib-commonjs/ShimmerTokens.android.js.map +0 -1
  51. package/lib-commonjs/ShimmerTokens.d.ts +0 -5
  52. package/lib-commonjs/ShimmerTokens.d.ts.map +0 -1
  53. package/lib-commonjs/ShimmerTokens.ios.d.ts +0 -5
  54. package/lib-commonjs/ShimmerTokens.ios.d.ts.map +0 -1
  55. package/lib-commonjs/ShimmerTokens.ios.js +0 -15
  56. package/lib-commonjs/ShimmerTokens.ios.js.map +0 -1
  57. package/lib-commonjs/ShimmerTokens.js +0 -17
  58. package/lib-commonjs/ShimmerTokens.js.map +0 -1
  59. package/lib-commonjs/ShimmerTokens.win32.d.ts +0 -5
  60. package/lib-commonjs/ShimmerTokens.win32.d.ts.map +0 -1
  61. package/lib-commonjs/ShimmerTokens.win32.js +0 -17
  62. package/lib-commonjs/ShimmerTokens.win32.js.map +0 -1
  63. package/lib-commonjs/SvgShapeToPath.d.ts +0 -18
  64. package/lib-commonjs/SvgShapeToPath.d.ts.map +0 -1
  65. package/lib-commonjs/SvgShapeToPath.js +0 -148
  66. package/lib-commonjs/SvgShapeToPath.js.map +0 -1
  67. package/lib-commonjs/Win32ShimmerNativeComponent.d.ts +0 -14
  68. package/lib-commonjs/Win32ShimmerNativeComponent.d.ts.map +0 -1
  69. package/lib-commonjs/Win32ShimmerNativeComponent.js +0 -10
  70. package/lib-commonjs/Win32ShimmerNativeComponent.js.map +0 -1
  71. package/lib-commonjs/consts.android.d.ts +0 -4
  72. package/lib-commonjs/consts.android.d.ts.map +0 -1
  73. package/lib-commonjs/consts.android.js +0 -7
  74. package/lib-commonjs/consts.android.js.map +0 -1
  75. package/lib-commonjs/consts.d.ts +0 -4
  76. package/lib-commonjs/consts.d.ts.map +0 -1
  77. package/lib-commonjs/consts.ios.d.ts +0 -4
  78. package/lib-commonjs/consts.ios.d.ts.map +0 -1
  79. package/lib-commonjs/consts.ios.js +0 -7
  80. package/lib-commonjs/consts.ios.js.map +0 -1
  81. package/lib-commonjs/consts.js +0 -7
  82. package/lib-commonjs/consts.js.map +0 -1
  83. package/lib-commonjs/consts.win32.d.ts +0 -4
  84. package/lib-commonjs/consts.win32.d.ts.map +0 -1
  85. package/lib-commonjs/consts.win32.js +0 -7
  86. package/lib-commonjs/consts.win32.js.map +0 -1
  87. package/lib-commonjs/index.d.ts +0 -5
  88. package/lib-commonjs/index.d.ts.map +0 -1
  89. package/lib-commonjs/index.js +0 -12
  90. package/lib-commonjs/index.js.map +0 -1
@@ -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"}
@@ -1,148 +0,0 @@
1
- "use strict";
2
- /**
3
- * These functions are necessary to deal with the win32 platform issue of d2d1 not supporting SVG <Mask> elements.
4
- * We can support them indirectly by inverting a <ClipPath> element, with the troublesome issue of there being
5
- * no direct way to do so -- which makes sense in general, one would just use <Mask> instead.
6
- *
7
- * The most desirable interface would be a ClipPath.invert property or function and/or a toString; masking
8
- * is generally an inversion of clipping, but we do not have such properties or functions. This void can
9
- * be filled by implementing directly (a worthwhile PR to react-native-svg) or by implementing toString functions
10
- * for shapes individually. The shapes individually can be composed into a single clip path string, along with
11
- * a shape that covers the entire SVG canvas. Using the evenodd clip rule, this effectively becomes a mask.
12
- *
13
- * This solution is far from ideal and may have incompatibilities with <ClipPath> features; for Shimmer, it's sufficient,
14
- * as we only support rounded rects and circles, with a circle being a rounded rect of borderRadius=length/2=width/2.
15
- */
16
- Object.defineProperty(exports, "__esModule", { value: true });
17
- exports.convertRectToSvgPath = convertRectToSvgPath;
18
- exports.convertCircleToSvgPath = convertCircleToSvgPath;
19
- // Note for explicit clarity: length and width represent the full length and width of the rect, and not
20
- // the straight edge segments (i.e. length - 2*borderRadius).
21
- // borderRadius[X|Y] cannot be larger than [length/2 or width]/2; it would not be able to connect to the edge
22
- // segments of the rect if so, and will be reduced to the maximum values accordingly.
23
- function convertRoundedRectToSvgPath(x, y, borderRadiusX, borderRadiusY, width, height) {
24
- // Reduce borderRadii to maximum usable size.
25
- if (borderRadiusX * 2 > width) {
26
- borderRadiusX = width / 2;
27
- }
28
- if (borderRadiusY * 2 > height) {
29
- borderRadiusY = height / 2;
30
- }
31
- const horizontalEdgeLength = width - borderRadiusX * 2;
32
- const verticalEdgeLength = height - borderRadiusY * 2;
33
- const xAxisRotation = 0;
34
- const largeArcFlag = 0;
35
- const sweepArcFlag = 1;
36
- /**
37
- * The general manner in which we will draw our rounded rect is in the following
38
- * order of points.
39
- *
40
- * - Forward (/) and back (\) slashes represent borderRadiusY and borderRadiusX, respectively.
41
- * - The un-rounded rect points are represented by center dots (and steal 1 unit from the borderRadii).
42
- * - x and y parameters are left out as path arguments use relative coordinates (vs absolute coordinates).
43
- * - Coordinate axis aids are present to avoid counting for any necessary clarification.
44
- *
45
- * x: arbitrary
46
- * y: arbitrary
47
- * width: 24
48
- * height: 12
49
- * borderRadiusX: 5
50
- * borderRadiusY: 3
51
- *
52
- * 0123456789012345678901234
53
- *
54
- * (1+9) (2)
55
- * ⬇ ⬇
56
- * 0 •\\\\--------------\\\\•
57
- * 1 / /
58
- * 2 / /
59
- * 3 (8) ➡ | | ⬅ (3)
60
- * 4 | |
61
- * 5 | |
62
- * 6 | |
63
- * 7 | |
64
- * 8 | |
65
- * 9 (7) ➡ | | ⬅ (4)
66
- * 0 / /
67
- * 1 / /
68
- * 2 •\\\\--------------\\\\•
69
- * ⬆ ⬆
70
- * (6) (5)
71
- *
72
- * Which would generate the following path:
73
- * const path = 'M {x+5} ${y+3} ' +
74
- * 'h 14 ' +
75
- * 'a 5 3 0 0 1 5 3' +
76
- * 'v 6 ' +
77
- * 'a 5 3 0 0 1 -5 3' +
78
- * 'h -14 ' +
79
- * 'a 5 3 0 0 1 -5 -3' +
80
- * 'v -6 ' +
81
- * 'a 5 3 0 0 1 5 -3 Z';
82
- */
83
- // We start at the left-most point of the top edge.
84
- // M: lift and move the pen to [x] [y] coordinates -- does not draw.
85
- let path = ['M', x + borderRadiusX, y];
86
- // draw to the right-most point of the top edge.
87
- // h: horizontally draw a line [n] units relative to the current pen position.
88
- path = path.concat(['h', horizontalEdgeLength]);
89
- /**
90
- * draw the arc for the top-right corner. If the rect is not rounded, the arc will be 0 length.
91
- * a: draw an arc relative to the current pen position with the following parameters:
92
- * rx: X-axis ellipse radius
93
- * ry: Y-axis ellipse radius
94
- * x-axis-rotation: rotation of the ellipse relative to the current coordinate system
95
- * large-arc-flag: See https://www.w3.org/TR/SVG/paths.html#PathDataEllipticalArcCommands
96
- * sweep-arc-flag: See https://www.w3.org/TR/SVG/paths.html#PathDataEllipticalArcCommands
97
- * (dx, dy): relative end coordinate
98
- *
99
- * 'a rx ry x-axis-rotation large-arc-flag sweep-arc-flag dx dy'
100
- *
101
- * We will use x-axis-rotation = 0, large-arc-flag = 0, and sweep-arc-flag = 1 for our path generation.
102
- * */
103
- path = path.concat(['a', borderRadiusX, borderRadiusY, xAxisRotation, largeArcFlag, sweepArcFlag, borderRadiusX, borderRadiusY]);
104
- /**
105
- * Draw to the bottom-most point of the right edge.
106
- * v: vertically draw a line [n] units relative to the current pen position.
107
- */
108
- path = path.concat(['v', verticalEdgeLength]);
109
- /**
110
- * Draw the arc for the bottom-right corner.
111
- */
112
- path = path.concat(['a', borderRadiusX, borderRadiusY, xAxisRotation, largeArcFlag, sweepArcFlag, -borderRadiusX, borderRadiusY]);
113
- /**
114
- * Draw to the left-most point of the bottom edge.
115
- */
116
- path = path.concat(['h', -horizontalEdgeLength]);
117
- /**
118
- * Draw the bottom-left corner.
119
- */
120
- path = path.concat(['a', borderRadiusX, borderRadiusY, xAxisRotation, largeArcFlag, sweepArcFlag, -borderRadiusX, -borderRadiusY]);
121
- /**
122
- * Draw to the top-most point of the left edge.
123
- */
124
- path = path.concat(['v', -verticalEdgeLength]);
125
- /**
126
- * Draw the top-left corner.
127
- */
128
- path = path.concat(['a', borderRadiusX, borderRadiusY, xAxisRotation, largeArcFlag, sweepArcFlag, borderRadiusX, -borderRadiusY]);
129
- /**
130
- * Finally, close the shape. While we have manually returned to the same coordinate we started with, closing and not-closing the shape
131
- * can have different behavior depending on other properties.
132
- * z or Z: close the shape.
133
- */
134
- path = path.concat('z');
135
- /**
136
- * Join all arguments with spaces and return the completed path.
137
- */
138
- return path.join(' ');
139
- }
140
- function convertRectToSvgPath(rectShape) {
141
- // Extract necessary args and generate the corresponding path for the shape.
142
- return convertRoundedRectToSvgPath(rectShape.x ? rectShape.x : 0, rectShape.y ? rectShape.y : 0, rectShape.borderRadiusX ? rectShape.borderRadiusX : 0, rectShape.borderRadiusX ? rectShape.borderRadiusY : 0, rectShape.width ? rectShape.width : 100, rectShape.height ? rectShape.height : 16);
143
- }
144
- function convertCircleToSvgPath(circleShape) {
145
- const radius = circleShape.radius ? circleShape.radius : 12;
146
- return convertRoundedRectToSvgPath(circleShape.cx ? circleShape.cx - circleShape.radius : 12, circleShape.cy ? circleShape.cy - circleShape.radius : 12, radius, radius, radius * 2, radius * 2);
147
- }
148
- //# sourceMappingURL=SvgShapeToPath.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SvgShapeToPath.js","sourceRoot":"","sources":["../src/SvgShapeToPath.ts"],"names":[],"mappings":"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"}
@@ -1,14 +0,0 @@
1
- /**
2
- * Copyright (c) Microsoft Corporation.
3
- * Licensed under the MIT License.
4
- * @format
5
- */
6
- import type { ViewProps } from 'react-native';
7
- import type { Double } from 'react-native/Libraries/Types/CodegenTypes';
8
- export interface NativeProps extends ViewProps {
9
- delay?: Double;
10
- duration?: Double;
11
- }
12
- declare const _default: import("react-native").HostComponent<NativeProps>;
13
- export default _default;
14
- //# sourceMappingURL=Win32ShimmerNativeComponent.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Win32ShimmerNativeComponent.d.ts","sourceRoot":"","sources":["../src/Win32ShimmerNativeComponent.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,2CAA2C,CAAC;AAGxE,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;;AAED,wBAA+E"}
@@ -1,10 +0,0 @@
1
- "use strict";
2
- /**
3
- * Copyright (c) Microsoft Corporation.
4
- * Licensed under the MIT License.
5
- * @format
6
- */
7
- Object.defineProperty(exports, "__esModule", { value: true });
8
- const react_native_1 = require("react-native");
9
- exports.default = (0, react_native_1.requireNativeComponent)('RCTNativeAnimatedShimmer');
10
- //# sourceMappingURL=Win32ShimmerNativeComponent.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Win32ShimmerNativeComponent.js","sourceRoot":"","sources":["../src/Win32ShimmerNativeComponent.ts"],"names":[],"mappings":";AAAA;;;;GAIG;;AAKH,+CAAsD;kBAOvC,IAAA,qCAAsB,EAAc,0BAA0B,CAAC"}
@@ -1,4 +0,0 @@
1
- export declare const shimmerDefaultAngle = 45;
2
- export declare const shimmerDefaultDelay = 0;
3
- export declare const shimmerDefaultDuration = 1000;
4
- //# sourceMappingURL=consts.android.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"consts.android.d.ts","sourceRoot":"","sources":["../src/consts.android.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,mBAAmB,KAAK,CAAC;AACtC,eAAO,MAAM,mBAAmB,IAAI,CAAC;AACrC,eAAO,MAAM,sBAAsB,OAAO,CAAC"}
@@ -1,7 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.shimmerDefaultDuration = exports.shimmerDefaultDelay = exports.shimmerDefaultAngle = void 0;
4
- exports.shimmerDefaultAngle = 45;
5
- exports.shimmerDefaultDelay = 0;
6
- exports.shimmerDefaultDuration = 1000;
7
- //# sourceMappingURL=consts.android.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"consts.android.js","sourceRoot":"","sources":["../src/consts.android.ts"],"names":[],"mappings":";;;AAAa,QAAA,mBAAmB,GAAG,EAAE,CAAC;AACzB,QAAA,mBAAmB,GAAG,CAAC,CAAC;AACxB,QAAA,sBAAsB,GAAG,IAAI,CAAC"}
@@ -1,4 +0,0 @@
1
- export declare const shimmerDefaultAngle = 0;
2
- export declare const shimmerDefaultDelay = 0;
3
- export declare const shimmerDefaultDuration = 7000;
4
- //# sourceMappingURL=consts.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../src/consts.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,mBAAmB,IAAI,CAAC;AACrC,eAAO,MAAM,mBAAmB,IAAI,CAAC;AACrC,eAAO,MAAM,sBAAsB,OAAO,CAAC"}
@@ -1,4 +0,0 @@
1
- export declare const shimmerDefaultAngle = 0;
2
- export declare const shimmerDefaultDelay = 0;
3
- export declare const shimmerDefaultDuration = 1000;
4
- //# sourceMappingURL=consts.ios.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"consts.ios.d.ts","sourceRoot":"","sources":["../src/consts.ios.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,mBAAmB,IAAI,CAAC;AACrC,eAAO,MAAM,mBAAmB,IAAI,CAAC;AACrC,eAAO,MAAM,sBAAsB,OAAO,CAAC"}
@@ -1,7 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.shimmerDefaultDuration = exports.shimmerDefaultDelay = exports.shimmerDefaultAngle = void 0;
4
- exports.shimmerDefaultAngle = 0;
5
- exports.shimmerDefaultDelay = 0;
6
- exports.shimmerDefaultDuration = 1000;
7
- //# sourceMappingURL=consts.ios.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"consts.ios.js","sourceRoot":"","sources":["../src/consts.ios.ts"],"names":[],"mappings":";;;AAAa,QAAA,mBAAmB,GAAG,CAAC,CAAC;AACxB,QAAA,mBAAmB,GAAG,CAAC,CAAC;AACxB,QAAA,sBAAsB,GAAG,IAAI,CAAC"}