react-native-smart-skeleton 0.0.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.
Files changed (173) hide show
  1. package/README.md +255 -0
  2. package/lib/commonjs/animations/breathing.js +53 -0
  3. package/lib/commonjs/animations/breathing.js.map +1 -0
  4. package/lib/commonjs/animations/pulse.js +50 -0
  5. package/lib/commonjs/animations/pulse.js.map +1 -0
  6. package/lib/commonjs/animations/shimmer.js +68 -0
  7. package/lib/commonjs/animations/shimmer.js.map +1 -0
  8. package/lib/commonjs/animations/wave.js +54 -0
  9. package/lib/commonjs/animations/wave.js.map +1 -0
  10. package/lib/commonjs/clone/SkeletonClone.js +91 -0
  11. package/lib/commonjs/clone/SkeletonClone.js.map +1 -0
  12. package/lib/commonjs/components/Circle.js +27 -0
  13. package/lib/commonjs/components/Circle.js.map +1 -0
  14. package/lib/commonjs/components/Group.js +57 -0
  15. package/lib/commonjs/components/Group.js.map +1 -0
  16. package/lib/commonjs/components/Pill.js +32 -0
  17. package/lib/commonjs/components/Pill.js.map +1 -0
  18. package/lib/commonjs/components/Rect.js +21 -0
  19. package/lib/commonjs/components/Rect.js.map +1 -0
  20. package/lib/commonjs/components/Skeleton.js +196 -0
  21. package/lib/commonjs/components/Skeleton.js.map +1 -0
  22. package/lib/commonjs/components/Square.js +28 -0
  23. package/lib/commonjs/components/Square.js.map +1 -0
  24. package/lib/commonjs/demo/demo.gif +0 -0
  25. package/lib/commonjs/hooks/useReducedMotion.js +42 -0
  26. package/lib/commonjs/hooks/useReducedMotion.js.map +1 -0
  27. package/lib/commonjs/hooks/useSkeletonTheme.js +46 -0
  28. package/lib/commonjs/hooks/useSkeletonTheme.js.map +1 -0
  29. package/lib/commonjs/index.js +149 -0
  30. package/lib/commonjs/index.js.map +1 -0
  31. package/lib/commonjs/presets/Card.js +83 -0
  32. package/lib/commonjs/presets/Card.js.map +1 -0
  33. package/lib/commonjs/presets/Chat.js +54 -0
  34. package/lib/commonjs/presets/Chat.js.map +1 -0
  35. package/lib/commonjs/presets/Product.js +70 -0
  36. package/lib/commonjs/presets/Product.js.map +1 -0
  37. package/lib/commonjs/presets/Profile.js +67 -0
  38. package/lib/commonjs/presets/Profile.js.map +1 -0
  39. package/lib/commonjs/presets/Video.js +76 -0
  40. package/lib/commonjs/presets/Video.js.map +1 -0
  41. package/lib/commonjs/providers/SkeletonProvider.js +70 -0
  42. package/lib/commonjs/providers/SkeletonProvider.js.map +1 -0
  43. package/lib/commonjs/types/index.js +6 -0
  44. package/lib/commonjs/types/index.js.map +1 -0
  45. package/lib/commonjs/utils/colors.js +144 -0
  46. package/lib/commonjs/utils/colors.js.map +1 -0
  47. package/lib/commonjs/utils/responsive.js +84 -0
  48. package/lib/commonjs/utils/responsive.js.map +1 -0
  49. package/lib/commonjs/utils/theme.js +39 -0
  50. package/lib/commonjs/utils/theme.js.map +1 -0
  51. package/lib/module/animations/breathing.js +47 -0
  52. package/lib/module/animations/breathing.js.map +1 -0
  53. package/lib/module/animations/pulse.js +44 -0
  54. package/lib/module/animations/pulse.js.map +1 -0
  55. package/lib/module/animations/shimmer.js +61 -0
  56. package/lib/module/animations/shimmer.js.map +1 -0
  57. package/lib/module/animations/wave.js +48 -0
  58. package/lib/module/animations/wave.js.map +1 -0
  59. package/lib/module/clone/SkeletonClone.js +84 -0
  60. package/lib/module/clone/SkeletonClone.js.map +1 -0
  61. package/lib/module/components/Circle.js +20 -0
  62. package/lib/module/components/Circle.js.map +1 -0
  63. package/lib/module/components/Group.js +50 -0
  64. package/lib/module/components/Group.js.map +1 -0
  65. package/lib/module/components/Pill.js +25 -0
  66. package/lib/module/components/Pill.js.map +1 -0
  67. package/lib/module/components/Rect.js +14 -0
  68. package/lib/module/components/Rect.js.map +1 -0
  69. package/lib/module/components/Skeleton.js +188 -0
  70. package/lib/module/components/Skeleton.js.map +1 -0
  71. package/lib/module/components/Square.js +21 -0
  72. package/lib/module/components/Square.js.map +1 -0
  73. package/lib/module/demo/demo.gif +0 -0
  74. package/lib/module/hooks/useReducedMotion.js +37 -0
  75. package/lib/module/hooks/useReducedMotion.js.map +1 -0
  76. package/lib/module/hooks/useSkeletonTheme.js +40 -0
  77. package/lib/module/hooks/useSkeletonTheme.js.map +1 -0
  78. package/lib/module/index.js +50 -0
  79. package/lib/module/index.js.map +1 -0
  80. package/lib/module/presets/Card.js +76 -0
  81. package/lib/module/presets/Card.js.map +1 -0
  82. package/lib/module/presets/Chat.js +47 -0
  83. package/lib/module/presets/Chat.js.map +1 -0
  84. package/lib/module/presets/Product.js +63 -0
  85. package/lib/module/presets/Product.js.map +1 -0
  86. package/lib/module/presets/Profile.js +60 -0
  87. package/lib/module/presets/Profile.js.map +1 -0
  88. package/lib/module/presets/Video.js +69 -0
  89. package/lib/module/presets/Video.js.map +1 -0
  90. package/lib/module/providers/SkeletonProvider.js +61 -0
  91. package/lib/module/providers/SkeletonProvider.js.map +1 -0
  92. package/lib/module/types/index.js +2 -0
  93. package/lib/module/types/index.js.map +1 -0
  94. package/lib/module/utils/colors.js +132 -0
  95. package/lib/module/utils/colors.js.map +1 -0
  96. package/lib/module/utils/responsive.js +74 -0
  97. package/lib/module/utils/responsive.js.map +1 -0
  98. package/lib/module/utils/theme.js +32 -0
  99. package/lib/module/utils/theme.js.map +1 -0
  100. package/lib/typescript/animations/breathing.d.ts +26 -0
  101. package/lib/typescript/animations/breathing.d.ts.map +1 -0
  102. package/lib/typescript/animations/pulse.d.ts +22 -0
  103. package/lib/typescript/animations/pulse.d.ts.map +1 -0
  104. package/lib/typescript/animations/shimmer.d.ts +34 -0
  105. package/lib/typescript/animations/shimmer.d.ts.map +1 -0
  106. package/lib/typescript/animations/wave.d.ts +23 -0
  107. package/lib/typescript/animations/wave.d.ts.map +1 -0
  108. package/lib/typescript/clone/SkeletonClone.d.ts +30 -0
  109. package/lib/typescript/clone/SkeletonClone.d.ts.map +1 -0
  110. package/lib/typescript/components/Circle.d.ts +10 -0
  111. package/lib/typescript/components/Circle.d.ts.map +1 -0
  112. package/lib/typescript/components/Group.d.ts +21 -0
  113. package/lib/typescript/components/Group.d.ts.map +1 -0
  114. package/lib/typescript/components/Pill.d.ts +12 -0
  115. package/lib/typescript/components/Pill.d.ts.map +1 -0
  116. package/lib/typescript/components/Rect.d.ts +12 -0
  117. package/lib/typescript/components/Rect.d.ts.map +1 -0
  118. package/lib/typescript/components/Skeleton.d.ts +16 -0
  119. package/lib/typescript/components/Skeleton.d.ts.map +1 -0
  120. package/lib/typescript/components/Square.d.ts +10 -0
  121. package/lib/typescript/components/Square.d.ts.map +1 -0
  122. package/lib/typescript/hooks/useReducedMotion.d.ts +11 -0
  123. package/lib/typescript/hooks/useReducedMotion.d.ts.map +1 -0
  124. package/lib/typescript/hooks/useSkeletonTheme.d.ts +12 -0
  125. package/lib/typescript/hooks/useSkeletonTheme.d.ts.map +1 -0
  126. package/lib/typescript/index.d.ts +51 -0
  127. package/lib/typescript/index.d.ts.map +1 -0
  128. package/lib/typescript/presets/Card.d.ts +11 -0
  129. package/lib/typescript/presets/Card.d.ts.map +1 -0
  130. package/lib/typescript/presets/Chat.d.ts +12 -0
  131. package/lib/typescript/presets/Chat.d.ts.map +1 -0
  132. package/lib/typescript/presets/Product.d.ts +12 -0
  133. package/lib/typescript/presets/Product.d.ts.map +1 -0
  134. package/lib/typescript/presets/Profile.d.ts +11 -0
  135. package/lib/typescript/presets/Profile.d.ts.map +1 -0
  136. package/lib/typescript/presets/Video.d.ts +12 -0
  137. package/lib/typescript/presets/Video.d.ts.map +1 -0
  138. package/lib/typescript/providers/SkeletonProvider.d.ts +18 -0
  139. package/lib/typescript/providers/SkeletonProvider.d.ts.map +1 -0
  140. package/lib/typescript/types/index.d.ts +149 -0
  141. package/lib/typescript/types/index.d.ts.map +1 -0
  142. package/lib/typescript/utils/colors.d.ts +51 -0
  143. package/lib/typescript/utils/colors.d.ts.map +1 -0
  144. package/lib/typescript/utils/responsive.d.ts +27 -0
  145. package/lib/typescript/utils/responsive.d.ts.map +1 -0
  146. package/lib/typescript/utils/theme.d.ts +16 -0
  147. package/lib/typescript/utils/theme.d.ts.map +1 -0
  148. package/package.json +74 -0
  149. package/src/animations/breathing.tsx +81 -0
  150. package/src/animations/pulse.tsx +75 -0
  151. package/src/animations/shimmer.tsx +88 -0
  152. package/src/animations/wave.tsx +74 -0
  153. package/src/clone/SkeletonClone.tsx +82 -0
  154. package/src/components/Circle.tsx +13 -0
  155. package/src/components/Group.tsx +55 -0
  156. package/src/components/Pill.tsx +23 -0
  157. package/src/components/Rect.tsx +15 -0
  158. package/src/components/Skeleton.tsx +218 -0
  159. package/src/components/Square.tsx +13 -0
  160. package/src/demo/demo.gif +0 -0
  161. package/src/hooks/useReducedMotion.ts +46 -0
  162. package/src/hooks/useSkeletonTheme.ts +45 -0
  163. package/src/index.ts +94 -0
  164. package/src/presets/Card.tsx +56 -0
  165. package/src/presets/Chat.tsx +52 -0
  166. package/src/presets/Product.tsx +45 -0
  167. package/src/presets/Profile.tsx +54 -0
  168. package/src/presets/Video.tsx +53 -0
  169. package/src/providers/SkeletonProvider.tsx +67 -0
  170. package/src/types/index.ts +246 -0
  171. package/src/utils/colors.ts +132 -0
  172. package/src/utils/responsive.ts +73 -0
  173. package/src/utils/theme.ts +35 -0
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = Group;
7
+ var _react = _interopRequireWildcard(require("react"));
8
+ var _reactNative = require("react-native");
9
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
10
+ /**
11
+ * Groups multiple skeleton children together and automatically staggers
12
+ * their animation start so they don't all pulse/shimmer perfectly in sync —
13
+ * a subtle touch that reads as more natural for lists of skeleton rows.
14
+ *
15
+ * Any direct child that accepts a `delay` prop (i.e. any Skeleton.* shape,
16
+ * or a custom component that forwards `delay` to one) will have an
17
+ * incremental delay injected automatically. Children that already specify
18
+ * their own `delay` are left untouched.
19
+ *
20
+ * @example
21
+ * <Skeleton.Group staggerDelay={80}>
22
+ * <Skeleton.Rect width="100%" height={16} />
23
+ * <Skeleton.Rect width="80%" height={16} />
24
+ * <Skeleton.Rect width="60%" height={16} />
25
+ * </Skeleton.Group>
26
+ */
27
+ function Group({
28
+ children,
29
+ staggerDelay = 80,
30
+ animation,
31
+ direction = "column",
32
+ style,
33
+ testID
34
+ }) {
35
+ const items = _react.Children.toArray(children);
36
+ return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
37
+ style: [{
38
+ flexDirection: direction === "row" ? "row" : "column"
39
+ }, style],
40
+ testID: testID
41
+ }, items.map((child, index) => {
42
+ if (! /*#__PURE__*/(0, _react.isValidElement)(child)) return child;
43
+ const existingProps = child.props;
44
+ const injectedProps = {};
45
+ if (existingProps.delay === undefined) {
46
+ injectedProps.delay = index * staggerDelay;
47
+ }
48
+ if (animation && existingProps.animation === undefined) {
49
+ injectedProps.animation = animation;
50
+ }
51
+ return /*#__PURE__*/(0, _react.cloneElement)(child, {
52
+ key: child.key ?? index,
53
+ ...injectedProps
54
+ });
55
+ }));
56
+ }
57
+ //# sourceMappingURL=Group.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Group","children","staggerDelay","animation","direction","style","testID","items","Children","toArray","createElement","View","flexDirection","map","child","index","isValidElement","existingProps","props","injectedProps","delay","undefined","cloneElement","key"],"sourceRoot":"../../../src","sources":["components/Group.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAAoC,SAAAD,wBAAAG,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAL,uBAAA,YAAAA,CAAAG,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAGpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACe,SAASkB,KAAKA,CAAC;EAC1BC,QAAQ;EACRC,YAAY,GAAG,EAAE;EACjBC,SAAS;EACTC,SAAS,GAAG,QAAQ;EACpBC,KAAK;EACLC;AACgB,CAAC,EAAE;EACnB,MAAMC,KAAK,GAAGC,eAAQ,CAACC,OAAO,CAACR,QAAQ,CAAC;EAExC,oBACIxB,MAAA,CAAAc,OAAA,CAAAmB,aAAA,CAAC9B,YAAA,CAAA+B,IAAI;IACDN,KAAK,EAAE,CAAC;MAAEO,aAAa,EAAER,SAAS,KAAK,KAAK,GAAG,KAAK,GAAG;IAAS,CAAC,EAAEC,KAAK,CAAE;IAC1EC,MAAM,EAAEA;EAAO,GAEdC,KAAK,CAACM,GAAG,CAAC,CAACC,KAAK,EAAEC,KAAK,KAAK;IACzB,IAAI,eAAC,IAAAC,qBAAc,EAACF,KAAK,CAAC,EAAE,OAAOA,KAAK;IAExC,MAAMG,aAAa,GAAGH,KAAK,CAACI,KAAgC;IAC5D,MAAMC,aAAsC,GAAG,CAAC,CAAC;IAEjD,IAAIF,aAAa,CAACG,KAAK,KAAKC,SAAS,EAAE;MACnCF,aAAa,CAACC,KAAK,GAAGL,KAAK,GAAGb,YAAY;IAC9C;IAEA,IAAIC,SAAS,IAAIc,aAAa,CAACd,SAAS,KAAKkB,SAAS,EAAE;MACpDF,aAAa,CAAChB,SAAS,GAAGA,SAAS;IACvC;IAEA,oBAAO,IAAAmB,mBAAY,EAACR,KAAK,EAAE;MAAES,GAAG,EAAET,KAAK,CAACS,GAAG,IAAIR,KAAK;MAAE,GAAGI;IAAc,CAAC,CAAC;EAC7E,CAAC,CACC,CAAC;AAEf","ignoreList":[]}
@@ -0,0 +1,32 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = Pill;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _Skeleton = _interopRequireDefault(require("./Skeleton"));
9
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
+ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
11
+ /**
12
+ * A fully-rounded "pill" skeleton placeholder, commonly used for buttons,
13
+ * tags/chips, or badges. Border radius is automatically derived from height
14
+ * unless overridden.
15
+ *
16
+ * @example
17
+ * <Skeleton.Pill width={80} height={28} />
18
+ */
19
+ function Pill({
20
+ width = 80,
21
+ height = 24,
22
+ borderRadius,
23
+ ...props
24
+ }) {
25
+ const numericHeight = typeof height === "number" ? height : 24;
26
+ return /*#__PURE__*/_react.default.createElement(_Skeleton.default, _extends({
27
+ width: width,
28
+ height: height,
29
+ borderRadius: borderRadius ?? numericHeight / 2
30
+ }, props));
31
+ }
32
+ //# sourceMappingURL=Pill.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","_interopRequireDefault","require","_Skeleton","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","Pill","width","height","borderRadius","props","numericHeight","createElement"],"sourceRoot":"../../../src","sources":["components/Pill.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAF,sBAAA,CAAAC,OAAA;AAAkC,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,SAAA,WAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,CAAA,aAAAP,CAAA,MAAAA,CAAA,GAAAQ,SAAA,CAAAC,MAAA,EAAAT,CAAA,UAAAU,CAAA,GAAAF,SAAA,CAAAR,CAAA,YAAAW,CAAA,IAAAD,CAAA,OAAAE,cAAA,CAAAC,IAAA,CAAAH,CAAA,EAAAC,CAAA,MAAAJ,CAAA,CAAAI,CAAA,IAAAD,CAAA,CAAAC,CAAA,aAAAJ,CAAA,KAAAJ,QAAA,CAAAW,KAAA,OAAAN,SAAA;AAGlC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACe,SAASO,IAAIA,CAAC;EAAEC,KAAK,GAAG,EAAE;EAAEC,MAAM,GAAG,EAAE;EAAEC,YAAY;EAAE,GAAGC;AAAyB,CAAC,EAAE;EACjG,MAAMC,aAAa,GAAG,OAAOH,MAAM,KAAK,QAAQ,GAAGA,MAAM,GAAG,EAAE;EAC9D,oBACIrB,MAAA,CAAAM,OAAA,CAAAmB,aAAA,CAACtB,SAAA,CAAAG,OAAQ,EAAAC,QAAA;IACLa,KAAK,EAAEA,KAAM;IACbC,MAAM,EAAEA,MAAO;IACfC,YAAY,EAAEA,YAAY,IAAIE,aAAa,GAAG;EAAE,GAC5CD,KAAK,CACZ,CAAC;AAEV","ignoreList":[]}
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = Rect;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _Skeleton = _interopRequireDefault(require("./Skeleton"));
9
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
+ /**
11
+ * A rectangular skeleton placeholder. Equivalent to `<Skeleton />` directly,
12
+ * provided for a consistent, explicit naming convention alongside
13
+ * `Skeleton.Circle`, `Skeleton.Square`, and `Skeleton.Pill`.
14
+ *
15
+ * @example
16
+ * <Skeleton.Rect width={200} height={20} />
17
+ */
18
+ function Rect(props) {
19
+ return /*#__PURE__*/_react.default.createElement(_Skeleton.default, props);
20
+ }
21
+ //# sourceMappingURL=Rect.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","_interopRequireDefault","require","_Skeleton","e","__esModule","default","Rect","props","createElement"],"sourceRoot":"../../../src","sources":["components/Rect.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAF,sBAAA,CAAAC,OAAA;AAAkC,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGlC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACe,SAASG,IAAIA,CAACC,KAAoB,EAAE;EAC/C,oBAAOR,MAAA,CAAAM,OAAA,CAAAG,aAAA,CAACN,SAAA,CAAAG,OAAQ,EAAKE,KAAQ,CAAC;AAClC","ignoreList":[]}
@@ -0,0 +1,196 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = Skeleton;
7
+ var _react = _interopRequireWildcard(require("react"));
8
+ var _reactNative = require("react-native");
9
+ var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
10
+ var _SkeletonProvider = require("../providers/SkeletonProvider");
11
+ var _useSkeletonTheme = require("../hooks/useSkeletonTheme");
12
+ var _useReducedMotion = require("../hooks/useReducedMotion");
13
+ var _shimmer = require("../animations/shimmer");
14
+ var _pulse = require("../animations/pulse");
15
+ var _wave = require("../animations/wave");
16
+ var _breathing = require("../animations/breathing");
17
+ var _colors = require("../utils/colors");
18
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
19
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
20
+ const LinearGradientComponent = (() => {
21
+ try {
22
+ return require("expo-linear-gradient").LinearGradient;
23
+ } catch {
24
+ try {
25
+ return require("react-native-linear-gradient").default;
26
+ } catch {
27
+ return _reactNative.View;
28
+ }
29
+ }
30
+ })();
31
+ const AnimatedLinearGradient = _reactNativeReanimated.default.createAnimatedComponent(LinearGradientComponent);
32
+
33
+ /**
34
+ * The base building block of react-native-smart-skeleton. Renders a single
35
+ * rectangular (optionally rounded) placeholder shape with the requested
36
+ * animation, fully theme-aware and accessible.
37
+ *
38
+ * Most consumers will reach for `Skeleton.Rect`, `Skeleton.Circle`,
39
+ * `Skeleton.Square`, or `Skeleton.Pill` instead of this directly, but those
40
+ * are all thin wrappers around this component.
41
+ *
42
+ * @example
43
+ * <Skeleton width={200} height={20} animation="shimmer" />
44
+ */
45
+ function Skeleton({
46
+ width = "100%",
47
+ height = 16,
48
+ borderRadius = 4,
49
+ backgroundColor,
50
+ highlightColor,
51
+ gradientColors,
52
+ animation,
53
+ duration,
54
+ delay = 0,
55
+ rtl,
56
+ colorVariant,
57
+ style,
58
+ accessibilityLabel = "Loading content",
59
+ accessible = true,
60
+ testID
61
+ }) {
62
+ const ctx = (0, _react.useContext)(_SkeletonProvider.SkeletonContext);
63
+ const themeColors = (0, _useSkeletonTheme.useSkeletonTheme)(colorVariant);
64
+ const osReducedMotion = (0, _useReducedMotion.useReducedMotion)();
65
+ const [measuredWidth, setMeasuredWidth] = (0, _react.useState)(0);
66
+ const onLayout = (0, _react.useCallback)(e => {
67
+ setMeasuredWidth(e.nativeEvent.layout.width);
68
+ }, []);
69
+
70
+ // Resolve effective settings, falling back through: prop -> provider -> library default.
71
+ const resolvedAnimation = animation ?? ctx?.animation ?? "shimmer";
72
+ const resolvedDuration = duration ?? ctx?.duration ?? 1200;
73
+ const resolvedPerformanceMode = ctx?.performanceMode ?? "balanced";
74
+ const reducedMotion = ctx?.reducedMotion ?? osReducedMotion;
75
+ const resolvedRtl = rtl ?? ctx?.rtl ?? _reactNative.I18nManager.isRTL;
76
+ const bg = backgroundColor ?? themeColors.background;
77
+ const highlight = highlightColor ?? themeColors.highlight;
78
+ const colors = gradientColors ?? (0, _colors.buildSweepGradient)(bg, highlight);
79
+
80
+ // Reduced motion: never run shimmer/wave/pulse at full intensity. Fall back to a
81
+ // slow "breathing" effect unless the consumer explicitly asked for "none".
82
+ const effectiveAnimation = reducedMotion && resolvedAnimation !== "none" ? "breathing" : resolvedAnimation;
83
+ const disabled = effectiveAnimation === "none";
84
+ const shimmer = (0, _shimmer.useShimmerTransform)(measuredWidth, {
85
+ duration: resolvedDuration,
86
+ delay,
87
+ disabled: disabled || effectiveAnimation !== "shimmer",
88
+ performanceMode: resolvedPerformanceMode
89
+ });
90
+ const wave = (0, _wave.useWaveTransform)(measuredWidth, {
91
+ duration: resolvedDuration,
92
+ delay,
93
+ disabled: disabled || effectiveAnimation !== "wave",
94
+ performanceMode: resolvedPerformanceMode
95
+ });
96
+ const pulseStyle = (0, _pulse.usePulseStyle)({
97
+ duration: resolvedDuration,
98
+ delay,
99
+ disabled: disabled || effectiveAnimation !== "pulse",
100
+ performanceMode: resolvedPerformanceMode
101
+ });
102
+ const breathingStyle = (0, _breathing.useBreathingStyle)({
103
+ duration: reducedMotion ? resolvedDuration * 1.6 : resolvedDuration,
104
+ delay,
105
+ disabled: disabled || effectiveAnimation !== "breathing",
106
+ performanceMode: resolvedPerformanceMode,
107
+ // Reduced-motion breathing should be extra subtle.
108
+ minScale: reducedMotion ? 0.99 : 0.97,
109
+ minOpacity: reducedMotion ? 0.92 : 0.85
110
+ });
111
+ const containerStyle = [{
112
+ width,
113
+ height,
114
+ borderRadius,
115
+ overflow: "hidden",
116
+ backgroundColor: bg
117
+ }, style];
118
+ const renderOverlay = () => {
119
+ if (disabled) return null;
120
+ if (effectiveAnimation === "pulse") {
121
+ return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
122
+ pointerEvents: "none",
123
+ style: [{
124
+ position: "absolute",
125
+ top: 0,
126
+ right: 0,
127
+ bottom: 0,
128
+ left: 0,
129
+ backgroundColor: highlight
130
+ }, pulseStyle]
131
+ });
132
+ }
133
+ if (effectiveAnimation === "breathing") {
134
+ return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
135
+ pointerEvents: "none",
136
+ style: [{
137
+ position: "absolute",
138
+ top: 0,
139
+ right: 0,
140
+ bottom: 0,
141
+ left: 0,
142
+ backgroundColor: highlight
143
+ }, breathingStyle]
144
+ });
145
+ }
146
+ if (effectiveAnimation === "shimmer" || effectiveAnimation === "wave") {
147
+ const transform = effectiveAnimation === "shimmer" ? shimmer : wave;
148
+ const flip = resolvedRtl ? {
149
+ transform: [{
150
+ scaleX: -1
151
+ }]
152
+ } : null;
153
+ return /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
154
+ pointerEvents: "none",
155
+ style: [{
156
+ position: "absolute",
157
+ top: 0,
158
+ bottom: 0,
159
+ left: 0
160
+ }, {
161
+ width: transform.sweepWidth
162
+ }, transform.style, flip]
163
+ }, /*#__PURE__*/_react.default.createElement(AnimatedLinearGradient, {
164
+ colors: colors,
165
+ start: {
166
+ x: 0,
167
+ y: 0
168
+ },
169
+ end: {
170
+ x: 1,
171
+ y: 0
172
+ },
173
+ style: {
174
+ flex: 1
175
+ }
176
+ }));
177
+ }
178
+ return null;
179
+ };
180
+ return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
181
+ onLayout: onLayout,
182
+ style: containerStyle,
183
+ accessible: accessible,
184
+ accessibilityRole: accessible ? "image" : undefined,
185
+ accessibilityLabel: accessible ? accessibilityLabel : undefined,
186
+ accessibilityState: accessible ? {
187
+ busy: true
188
+ } : undefined
189
+ // importantForAccessibility keeps these decorative-but-informative
190
+ // nodes from over-announcing on Android when nested in lists.
191
+ ,
192
+ importantForAccessibility: accessible ? "yes" : "no-hide-descendants",
193
+ testID: testID
194
+ }, renderOverlay());
195
+ }
196
+ //# sourceMappingURL=Skeleton.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeReanimated","_interopRequireDefault","_SkeletonProvider","_useSkeletonTheme","_useReducedMotion","_shimmer","_pulse","_wave","_breathing","_colors","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","LinearGradientComponent","LinearGradient","View","AnimatedLinearGradient","Animated","createAnimatedComponent","Skeleton","width","height","borderRadius","backgroundColor","highlightColor","gradientColors","animation","duration","delay","rtl","colorVariant","style","accessibilityLabel","accessible","testID","ctx","useContext","SkeletonContext","themeColors","useSkeletonTheme","osReducedMotion","useReducedMotion","measuredWidth","setMeasuredWidth","useState","onLayout","useCallback","nativeEvent","layout","resolvedAnimation","resolvedDuration","resolvedPerformanceMode","performanceMode","reducedMotion","resolvedRtl","I18nManager","isRTL","bg","background","highlight","colors","buildSweepGradient","effectiveAnimation","disabled","shimmer","useShimmerTransform","wave","useWaveTransform","pulseStyle","usePulseStyle","breathingStyle","useBreathingStyle","minScale","minOpacity","containerStyle","overflow","renderOverlay","createElement","pointerEvents","position","top","right","bottom","left","transform","flip","scaleX","sweepWidth","start","x","y","end","flex","accessibilityRole","undefined","accessibilityState","busy","importantForAccessibility"],"sourceRoot":"../../../src","sources":["components/Skeleton.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,28 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = Square;
7
+ var _react = _interopRequireDefault(require("react"));
8
+ var _Skeleton = _interopRequireDefault(require("./Skeleton"));
9
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
+ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
11
+ /**
12
+ * A square skeleton placeholder with equal width and height.
13
+ *
14
+ * @example
15
+ * <Skeleton.Square size={64} borderRadius={8} />
16
+ */
17
+ function Square({
18
+ size = 50,
19
+ borderRadius = 4,
20
+ ...props
21
+ }) {
22
+ return /*#__PURE__*/_react.default.createElement(_Skeleton.default, _extends({
23
+ width: size,
24
+ height: size,
25
+ borderRadius: borderRadius
26
+ }, props));
27
+ }
28
+ //# sourceMappingURL=Square.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","_interopRequireDefault","require","_Skeleton","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","Square","size","borderRadius","props","createElement","width","height"],"sourceRoot":"../../../src","sources":["components/Square.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAF,sBAAA,CAAAC,OAAA;AAAkC,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,SAAA,WAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,CAAA,aAAAP,CAAA,MAAAA,CAAA,GAAAQ,SAAA,CAAAC,MAAA,EAAAT,CAAA,UAAAU,CAAA,GAAAF,SAAA,CAAAR,CAAA,YAAAW,CAAA,IAAAD,CAAA,OAAAE,cAAA,CAAAC,IAAA,CAAAH,CAAA,EAAAC,CAAA,MAAAJ,CAAA,CAAAI,CAAA,IAAAD,CAAA,CAAAC,CAAA,aAAAJ,CAAA,KAAAJ,QAAA,CAAAW,KAAA,OAAAN,SAAA;AAGlC;AACA;AACA;AACA;AACA;AACA;AACe,SAASO,MAAMA,CAAC;EAAEC,IAAI,GAAG,EAAE;EAAEC,YAAY,GAAG,CAAC;EAAE,GAAGC;AAA2B,CAAC,EAAE;EAC3F,oBAAOtB,MAAA,CAAAM,OAAA,CAAAiB,aAAA,CAACpB,SAAA,CAAAG,OAAQ,EAAAC,QAAA;IAACiB,KAAK,EAAEJ,IAAK;IAACK,MAAM,EAAEL,IAAK;IAACC,YAAY,EAAEA;EAAa,GAAKC,KAAK,CAAG,CAAC;AACzF","ignoreList":[]}
Binary file
@@ -0,0 +1,42 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useReducedMotion = useReducedMotion;
7
+ var _react = require("react");
8
+ var _reactNative = require("react-native");
9
+ /**
10
+ * Tracks the OS-level "reduce motion" accessibility setting
11
+ * (Reduce Motion on iOS, Remove Animations on Android) and keeps it
12
+ * up to date if the user changes the setting while the app is running.
13
+ *
14
+ * Skeleton animations should fall back to a static or near-static
15
+ * appearance (or the "breathing" animation at a slow, low-amplitude
16
+ * rate) when this returns true.
17
+ */
18
+ function useReducedMotion() {
19
+ const [reducedMotion, setReducedMotion] = (0, _react.useState)(false);
20
+ (0, _react.useEffect)(() => {
21
+ let isMounted = true;
22
+ _reactNative.AccessibilityInfo.isReduceMotionEnabled?.().then(enabled => {
23
+ if (isMounted) setReducedMotion(!!enabled);
24
+ }).catch(() => {
25
+ // Some platforms/environments (e.g. older RN, web shims) may not
26
+ // implement this — default to false (animations enabled).
27
+ });
28
+ const subscription = _reactNative.AccessibilityInfo.addEventListener("reduceMotionChanged", enabled => {
29
+ setReducedMotion(!!enabled);
30
+ });
31
+ return () => {
32
+ isMounted = false;
33
+ // RN >= 0.65 returns an EmitterSubscription with `.remove()`.
34
+ // Older versions returned void and relied on removeEventListener.
35
+ if (subscription && typeof subscription.remove === "function") {
36
+ subscription.remove();
37
+ }
38
+ };
39
+ }, []);
40
+ return reducedMotion;
41
+ }
42
+ //# sourceMappingURL=useReducedMotion.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","require","_reactNative","useReducedMotion","reducedMotion","setReducedMotion","useState","useEffect","isMounted","AccessibilityInfo","isReduceMotionEnabled","then","enabled","catch","subscription","addEventListener","remove"],"sourceRoot":"../../../src","sources":["hooks/useReducedMotion.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASE,gBAAgBA,CAAA,EAAY;EACxC,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAG,IAAAC,eAAQ,EAAC,KAAK,CAAC;EAEzD,IAAAC,gBAAS,EAAC,MAAM;IACZ,IAAIC,SAAS,GAAG,IAAI;IAEpBC,8BAAiB,CAACC,qBAAqB,GAAG,CAAC,CACtCC,IAAI,CAAEC,OAAO,IAAK;MACf,IAAIJ,SAAS,EAAEH,gBAAgB,CAAC,CAAC,CAACO,OAAO,CAAC;IAC9C,CAAC,CAAC,CACDC,KAAK,CAAC,MAAM;MACT;MACA;IAAA,CACH,CAAC;IAEN,MAAMC,YAAY,GAAGL,8BAAiB,CAACM,gBAAgB,CACnD,qBAAqB,EACpBH,OAAgB,IAAK;MAClBP,gBAAgB,CAAC,CAAC,CAACO,OAAO,CAAC;IAC/B,CACJ,CAAC;IAED,OAAO,MAAM;MACTJ,SAAS,GAAG,KAAK;MACjB;MACA;MACA,IAAIM,YAAY,IAAI,OAAQA,YAAY,CAASE,MAAM,KAAK,UAAU,EAAE;QACnEF,YAAY,CAASE,MAAM,CAAC,CAAC;MAClC;IACJ,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOZ,aAAa;AACxB","ignoreList":[]}
@@ -0,0 +1,46 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useSkeletonTheme = useSkeletonTheme;
7
+ var _react = require("react");
8
+ var _reactNative = require("react-native");
9
+ var _SkeletonProvider = require("../providers/SkeletonProvider");
10
+ var _theme = require("../utils/theme");
11
+ var _colors = require("../utils/colors");
12
+ /**
13
+ * Resolves the active light/dark colors for a skeleton.
14
+ *
15
+ * If used inside a <SkeletonProvider>, honors its `theme` prop ("light" | "dark" | "system")
16
+ * and any registered brand `colors`. If used standalone (no provider), falls back to the
17
+ * device's OS color scheme and the library's default palette.
18
+ *
19
+ * @param colorVariant optional brand color variant name registered on the provider
20
+ */
21
+ function useSkeletonTheme(colorVariant) {
22
+ const ctx = (0, _react.useContext)(_SkeletonProvider.SkeletonContext);
23
+ const systemScheme = (0, _reactNative.useColorScheme)();
24
+ return (0, _react.useMemo)(() => {
25
+ if (ctx) {
26
+ const colors = ctx.getVariantColors(colorVariant);
27
+ return {
28
+ isDark: ctx.isDark,
29
+ background: colors.background,
30
+ highlight: colors.highlight
31
+ };
32
+ }
33
+ const isDark = systemScheme === "dark";
34
+ const fallback = (0, _theme.getDefaultThemeColors)(isDark);
35
+ const colors = (0, _colors.resolveThemeColors)({
36
+ isDark,
37
+ ambient: fallback
38
+ });
39
+ return {
40
+ isDark,
41
+ background: colors.background,
42
+ highlight: colors.highlight
43
+ };
44
+ }, [ctx, systemScheme, colorVariant]);
45
+ }
46
+ //# sourceMappingURL=useSkeletonTheme.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","require","_reactNative","_SkeletonProvider","_theme","_colors","useSkeletonTheme","colorVariant","ctx","useContext","SkeletonContext","systemScheme","useColorScheme","useMemo","colors","getVariantColors","isDark","background","highlight","fallback","getDefaultThemeColors","resolveThemeColors","ambient"],"sourceRoot":"../../../src","sources":["hooks/useSkeletonTheme.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASK,gBAAgBA,CAACC,YAAqB,EAAyB;EAC3E,MAAMC,GAAG,GAAG,IAAAC,iBAAU,EAACC,iCAAe,CAAC;EACvC,MAAMC,YAAY,GAAG,IAAAC,2BAAc,EAAC,CAAC;EAErC,OAAO,IAAAC,cAAO,EAAC,MAAM;IACjB,IAAIL,GAAG,EAAE;MACL,MAAMM,MAAM,GAAGN,GAAG,CAACO,gBAAgB,CAACR,YAAY,CAAC;MACjD,OAAO;QACHS,MAAM,EAAER,GAAG,CAACQ,MAAM;QAClBC,UAAU,EAAEH,MAAM,CAACG,UAAU;QAC7BC,SAAS,EAAEJ,MAAM,CAACI;MACtB,CAAC;IACL;IAEA,MAAMF,MAAM,GAAGL,YAAY,KAAK,MAAM;IACtC,MAAMQ,QAAQ,GAAG,IAAAC,4BAAqB,EAACJ,MAAM,CAAC;IAE9C,MAAMF,MAAM,GAAG,IAAAO,0BAAkB,EAAC;MAC9BL,MAAM;MACNM,OAAO,EAAEH;IACb,CAAC,CAAC;IAEF,OAAO;MACHH,MAAM;MACNC,UAAU,EAAEH,MAAM,CAACG,UAAU;MAC7BC,SAAS,EAAEJ,MAAM,CAACI;IACtB,CAAC;EACL,CAAC,EAAE,CAACV,GAAG,EAAEG,YAAY,EAAEJ,YAAY,CAAC,CAAC;AACzC","ignoreList":[]}
@@ -0,0 +1,149 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "Card", {
7
+ enumerable: true,
8
+ get: function () {
9
+ return _Card.default;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "Chat", {
13
+ enumerable: true,
14
+ get: function () {
15
+ return _Chat.default;
16
+ }
17
+ });
18
+ Object.defineProperty(exports, "Circle", {
19
+ enumerable: true,
20
+ get: function () {
21
+ return _Circle.default;
22
+ }
23
+ });
24
+ Object.defineProperty(exports, "Group", {
25
+ enumerable: true,
26
+ get: function () {
27
+ return _Group.default;
28
+ }
29
+ });
30
+ Object.defineProperty(exports, "Pill", {
31
+ enumerable: true,
32
+ get: function () {
33
+ return _Pill.default;
34
+ }
35
+ });
36
+ Object.defineProperty(exports, "Product", {
37
+ enumerable: true,
38
+ get: function () {
39
+ return _Product.default;
40
+ }
41
+ });
42
+ Object.defineProperty(exports, "Profile", {
43
+ enumerable: true,
44
+ get: function () {
45
+ return _Profile.default;
46
+ }
47
+ });
48
+ Object.defineProperty(exports, "Rect", {
49
+ enumerable: true,
50
+ get: function () {
51
+ return _Rect.default;
52
+ }
53
+ });
54
+ exports.Skeleton = void 0;
55
+ Object.defineProperty(exports, "SkeletonBase", {
56
+ enumerable: true,
57
+ get: function () {
58
+ return _Skeleton.default;
59
+ }
60
+ });
61
+ Object.defineProperty(exports, "SkeletonClone", {
62
+ enumerable: true,
63
+ get: function () {
64
+ return _SkeletonClone.default;
65
+ }
66
+ });
67
+ Object.defineProperty(exports, "SkeletonContext", {
68
+ enumerable: true,
69
+ get: function () {
70
+ return _SkeletonProvider.SkeletonContext;
71
+ }
72
+ });
73
+ Object.defineProperty(exports, "SkeletonProvider", {
74
+ enumerable: true,
75
+ get: function () {
76
+ return _SkeletonProvider.SkeletonProvider;
77
+ }
78
+ });
79
+ Object.defineProperty(exports, "Square", {
80
+ enumerable: true,
81
+ get: function () {
82
+ return _Square.default;
83
+ }
84
+ });
85
+ Object.defineProperty(exports, "Video", {
86
+ enumerable: true,
87
+ get: function () {
88
+ return _Video.default;
89
+ }
90
+ });
91
+ exports.default = void 0;
92
+ Object.defineProperty(exports, "useReducedMotion", {
93
+ enumerable: true,
94
+ get: function () {
95
+ return _useReducedMotion.useReducedMotion;
96
+ }
97
+ });
98
+ Object.defineProperty(exports, "useSkeletonTheme", {
99
+ enumerable: true,
100
+ get: function () {
101
+ return _useSkeletonTheme.useSkeletonTheme;
102
+ }
103
+ });
104
+ var _Skeleton = _interopRequireDefault(require("./components/Skeleton"));
105
+ var _Rect = _interopRequireDefault(require("./components/Rect"));
106
+ var _Circle = _interopRequireDefault(require("./components/Circle"));
107
+ var _Square = _interopRequireDefault(require("./components/Square"));
108
+ var _Pill = _interopRequireDefault(require("./components/Pill"));
109
+ var _Group = _interopRequireDefault(require("./components/Group"));
110
+ var _Profile = _interopRequireDefault(require("./presets/Profile"));
111
+ var _Card = _interopRequireDefault(require("./presets/Card"));
112
+ var _Chat = _interopRequireDefault(require("./presets/Chat"));
113
+ var _Product = _interopRequireDefault(require("./presets/Product"));
114
+ var _Video = _interopRequireDefault(require("./presets/Video"));
115
+ var _SkeletonClone = _interopRequireDefault(require("./clone/SkeletonClone"));
116
+ var _SkeletonProvider = require("./providers/SkeletonProvider");
117
+ var _useSkeletonTheme = require("./hooks/useSkeletonTheme");
118
+ var _useReducedMotion = require("./hooks/useReducedMotion");
119
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
120
+ /**
121
+ * `Skeleton` is the library's primary export: a callable base component
122
+ * (`<Skeleton />`) that also carries every shape, the layout-grouping
123
+ * helper, and every smart preset as static properties — so you only ever
124
+ * need a single import.
125
+ *
126
+ * @example
127
+ * import { Skeleton, SkeletonProvider } from "react-native-smart-skeleton";
128
+ *
129
+ * <SkeletonProvider>
130
+ * <Skeleton.Rect width={200} height={20} />
131
+ * <Skeleton.Circle size={48} />
132
+ * <Skeleton.Profile lines={2} />
133
+ * </SkeletonProvider>
134
+ */
135
+
136
+ const Skeleton = exports.Skeleton = _Skeleton.default;
137
+ Skeleton.Rect = _Rect.default;
138
+ Skeleton.Circle = _Circle.default;
139
+ Skeleton.Square = _Square.default;
140
+ Skeleton.Pill = _Pill.default;
141
+ Skeleton.Group = _Group.default;
142
+ Skeleton.Clone = _SkeletonClone.default;
143
+ Skeleton.Profile = _Profile.default;
144
+ Skeleton.Card = _Card.default;
145
+ Skeleton.Chat = _Chat.default;
146
+ Skeleton.Product = _Product.default;
147
+ Skeleton.Video = _Video.default;
148
+ var _default = exports.default = Skeleton;
149
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_Skeleton","_interopRequireDefault","require","_Rect","_Circle","_Square","_Pill","_Group","_Profile","_Card","_Chat","_Product","_Video","_SkeletonClone","_SkeletonProvider","_useSkeletonTheme","_useReducedMotion","e","__esModule","default","Skeleton","exports","SkeletonBase","Rect","Circle","Square","Pill","Group","Clone","SkeletonClone","Profile","Card","Chat","Product","Video","_default"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,SAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,OAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,KAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,MAAA,GAAAN,sBAAA,CAAAC,OAAA;AAEA,IAAAM,QAAA,GAAAP,sBAAA,CAAAC,OAAA;AACA,IAAAO,KAAA,GAAAR,sBAAA,CAAAC,OAAA;AACA,IAAAQ,KAAA,GAAAT,sBAAA,CAAAC,OAAA;AACA,IAAAS,QAAA,GAAAV,sBAAA,CAAAC,OAAA;AACA,IAAAU,MAAA,GAAAX,sBAAA,CAAAC,OAAA;AAEA,IAAAW,cAAA,GAAAZ,sBAAA,CAAAC,OAAA;AAEA,IAAAY,iBAAA,GAAAZ,OAAA;AACA,IAAAa,iBAAA,GAAAb,OAAA;AACA,IAAAc,iBAAA,GAAAd,OAAA;AAA4D,SAAAD,uBAAAgB,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AA4B5D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAeA,MAAMG,QAAQ,GAAAC,OAAA,CAAAD,QAAA,GAAGE,iBAAiC;AAElDF,QAAQ,CAACG,IAAI,GAAGA,aAAI;AACpBH,QAAQ,CAACI,MAAM,GAAGA,eAAM;AACxBJ,QAAQ,CAACK,MAAM,GAAGA,eAAM;AACxBL,QAAQ,CAACM,IAAI,GAAGA,aAAI;AACpBN,QAAQ,CAACO,KAAK,GAAGA,cAAK;AACtBP,QAAQ,CAACQ,KAAK,GAAGC,sBAAa;AAC9BT,QAAQ,CAACU,OAAO,GAAGA,gBAAO;AAC1BV,QAAQ,CAACW,IAAI,GAAGA,aAAI;AACpBX,QAAQ,CAACY,IAAI,GAAGA,aAAI;AACpBZ,QAAQ,CAACa,OAAO,GAAGA,gBAAO;AAC1Bb,QAAQ,CAACc,KAAK,GAAGA,cAAK;AAAC,IAAAC,QAAA,GAAAd,OAAA,CAAAF,OAAA,GAORC,QAAQ","ignoreList":[]}