react-native-smart-skeleton 0.0.1

package/lib/module/components/Skeleton.js

@@ -0,0 +1,188 @@
+import React, { useCallback, useContext, useState } from "react";
+import { I18nManager, View } from "react-native";
+import Animated from "react-native-reanimated";
+import { SkeletonContext } from "../providers/SkeletonProvider";
+import { useSkeletonTheme } from "../hooks/useSkeletonTheme";
+import { useReducedMotion } from "../hooks/useReducedMotion";
+import { useShimmerTransform } from "../animations/shimmer";
+import { usePulseStyle } from "../animations/pulse";
+import { useWaveTransform } from "../animations/wave";
+import { useBreathingStyle } from "../animations/breathing";
+import { buildSweepGradient } from "../utils/colors";
+const LinearGradientComponent = (() => {
+  try {
+    return require("expo-linear-gradient").LinearGradient;
+  } catch {
+    try {
+      return require("react-native-linear-gradient").default;
+    } catch {
+      return View;
+    }
+  }
+})();
+const AnimatedLinearGradient = Animated.createAnimatedComponent(LinearGradientComponent);
+
+/**
+ * The base building block of react-native-smart-skeleton. Renders a single
+ * rectangular (optionally rounded) placeholder shape with the requested
+ * animation, fully theme-aware and accessible.
+ *
+ * Most consumers will reach for `Skeleton.Rect`, `Skeleton.Circle`,
+ * `Skeleton.Square`, or `Skeleton.Pill` instead of this directly, but those
+ * are all thin wrappers around this component.
+ *
+ * @example
+ * <Skeleton width={200} height={20} animation="shimmer" />
+ */
+export default function Skeleton({
+  width = "100%",
+  height = 16,
+  borderRadius = 4,
+  backgroundColor,
+  highlightColor,
+  gradientColors,
+  animation,
+  duration,
+  delay = 0,
+  rtl,
+  colorVariant,
+  style,
+  accessibilityLabel = "Loading content",
+  accessible = true,
+  testID
+}) {
+  const ctx = useContext(SkeletonContext);
+  const themeColors = useSkeletonTheme(colorVariant);
+  const osReducedMotion = useReducedMotion();
+  const [measuredWidth, setMeasuredWidth] = useState(0);
+  const onLayout = useCallback(e => {
+    setMeasuredWidth(e.nativeEvent.layout.width);
+  }, []);
+
+  // Resolve effective settings, falling back through: prop -> provider -> library default.
+  const resolvedAnimation = animation ?? ctx?.animation ?? "shimmer";
+  const resolvedDuration = duration ?? ctx?.duration ?? 1200;
+  const resolvedPerformanceMode = ctx?.performanceMode ?? "balanced";
+  const reducedMotion = ctx?.reducedMotion ?? osReducedMotion;
+  const resolvedRtl = rtl ?? ctx?.rtl ?? I18nManager.isRTL;
+  const bg = backgroundColor ?? themeColors.background;
+  const highlight = highlightColor ?? themeColors.highlight;
+  const colors = gradientColors ?? buildSweepGradient(bg, highlight);
+
+  // Reduced motion: never run shimmer/wave/pulse at full intensity. Fall back to a
+  // slow "breathing" effect unless the consumer explicitly asked for "none".
+  const effectiveAnimation = reducedMotion && resolvedAnimation !== "none" ? "breathing" : resolvedAnimation;
+  const disabled = effectiveAnimation === "none";
+  const shimmer = useShimmerTransform(measuredWidth, {
+    duration: resolvedDuration,
+    delay,
+    disabled: disabled || effectiveAnimation !== "shimmer",
+    performanceMode: resolvedPerformanceMode
+  });
+  const wave = useWaveTransform(measuredWidth, {
+    duration: resolvedDuration,
+    delay,
+    disabled: disabled || effectiveAnimation !== "wave",
+    performanceMode: resolvedPerformanceMode
+  });
+  const pulseStyle = usePulseStyle({
+    duration: resolvedDuration,
+    delay,
+    disabled: disabled || effectiveAnimation !== "pulse",
+    performanceMode: resolvedPerformanceMode
+  });
+  const breathingStyle = useBreathingStyle({
+    duration: reducedMotion ? resolvedDuration * 1.6 : resolvedDuration,
+    delay,
+    disabled: disabled || effectiveAnimation !== "breathing",
+    performanceMode: resolvedPerformanceMode,
+    // Reduced-motion breathing should be extra subtle.
+    minScale: reducedMotion ? 0.99 : 0.97,
+    minOpacity: reducedMotion ? 0.92 : 0.85
+  });
+  const containerStyle = [{
+    width,
+    height,
+    borderRadius,
+    overflow: "hidden",
+    backgroundColor: bg
+  }, style];
+  const renderOverlay = () => {
+    if (disabled) return null;
+    if (effectiveAnimation === "pulse") {
+      return /*#__PURE__*/React.createElement(Animated.View, {
+        pointerEvents: "none",
+        style: [{
+          position: "absolute",
+          top: 0,
+          right: 0,
+          bottom: 0,
+          left: 0,
+          backgroundColor: highlight
+        }, pulseStyle]
+      });
+    }
+    if (effectiveAnimation === "breathing") {
+      return /*#__PURE__*/React.createElement(Animated.View, {
+        pointerEvents: "none",
+        style: [{
+          position: "absolute",
+          top: 0,
+          right: 0,
+          bottom: 0,
+          left: 0,
+          backgroundColor: highlight
+        }, breathingStyle]
+      });
+    }
+    if (effectiveAnimation === "shimmer" || effectiveAnimation === "wave") {
+      const transform = effectiveAnimation === "shimmer" ? shimmer : wave;
+      const flip = resolvedRtl ? {
+        transform: [{
+          scaleX: -1
+        }]
+      } : null;
+      return /*#__PURE__*/React.createElement(Animated.View, {
+        pointerEvents: "none",
+        style: [{
+          position: "absolute",
+          top: 0,
+          bottom: 0,
+          left: 0
+        }, {
+          width: transform.sweepWidth
+        }, transform.style, flip]
+      }, /*#__PURE__*/React.createElement(AnimatedLinearGradient, {
+        colors: colors,
+        start: {
+          x: 0,
+          y: 0
+        },
+        end: {
+          x: 1,
+          y: 0
+        },
+        style: {
+          flex: 1
+        }
+      }));
+    }
+    return null;
+  };
+  return /*#__PURE__*/React.createElement(View, {
+    onLayout: onLayout,
+    style: containerStyle,
+    accessible: accessible,
+    accessibilityRole: accessible ? "image" : undefined,
+    accessibilityLabel: accessible ? accessibilityLabel : undefined,
+    accessibilityState: accessible ? {
+      busy: true
+    } : undefined
+    // importantForAccessibility keeps these decorative-but-informative
+    // nodes from over-announcing on Android when nested in lists.
+    ,
+    importantForAccessibility: accessible ? "yes" : "no-hide-descendants",
+    testID: testID
+  }, renderOverlay());
+}
+//# sourceMappingURL=Skeleton.js.map

package/lib/module/components/Skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useContext","useState","I18nManager","View","Animated","SkeletonContext","useSkeletonTheme","useReducedMotion","useShimmerTransform","usePulseStyle","useWaveTransform","useBreathingStyle","buildSweepGradient","LinearGradientComponent","require","LinearGradient","default","AnimatedLinearGradient","createAnimatedComponent","Skeleton","width","height","borderRadius","backgroundColor","highlightColor","gradientColors","animation","duration","delay","rtl","colorVariant","style","accessibilityLabel","accessible","testID","ctx","themeColors","osReducedMotion","measuredWidth","setMeasuredWidth","onLayout","e","nativeEvent","layout","resolvedAnimation","resolvedDuration","resolvedPerformanceMode","performanceMode","reducedMotion","resolvedRtl","isRTL","bg","background","highlight","colors","effectiveAnimation","disabled","shimmer","wave","pulseStyle","breathingStyle","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":[]}

package/lib/module/components/Square.js

@@ -0,0 +1,21 @@
+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); }
+import React from "react";
+import Skeleton from "./Skeleton";
+/**
+ * A square skeleton placeholder with equal width and height.
+ *
+ * @example
+ * <Skeleton.Square size={64} borderRadius={8} />
+ */
+export default function Square({
+  size = 50,
+  borderRadius = 4,
+  ...props
+}) {
+  return /*#__PURE__*/React.createElement(Skeleton, _extends({
+    width: size,
+    height: size,
+    borderRadius: borderRadius
+  }, props));
+}
+//# sourceMappingURL=Square.js.map

package/lib/module/components/Square.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Skeleton","Square","size","borderRadius","props","createElement","_extends","width","height"],"sourceRoot":"../../../src","sources":["components/Square.tsx"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,QAAQ,MAAM,YAAY;AAGjC;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,MAAMA,CAAC;EAAEC,IAAI,GAAG,EAAE;EAAEC,YAAY,GAAG,CAAC;EAAE,GAAGC;AAA2B,CAAC,EAAE;EAC3F,oBAAOL,KAAA,CAAAM,aAAA,CAACL,QAAQ,EAAAM,QAAA;IAACC,KAAK,EAAEL,IAAK;IAACM,MAAM,EAAEN,IAAK;IAACC,YAAY,EAAEA;EAAa,GAAKC,KAAK,CAAG,CAAC;AACzF","ignoreList":[]}

package/lib/module/hooks/useReducedMotion.js

@@ -0,0 +1,37 @@
+import { useEffect, useState } from "react";
+import { AccessibilityInfo } from "react-native";
+
+/**
+ * Tracks the OS-level "reduce motion" accessibility setting
+ * (Reduce Motion on iOS, Remove Animations on Android) and keeps it
+ * up to date if the user changes the setting while the app is running.
+ *
+ * Skeleton animations should fall back to a static or near-static
+ * appearance (or the "breathing" animation at a slow, low-amplitude
+ * rate) when this returns true.
+ */
+export function useReducedMotion() {
+  const [reducedMotion, setReducedMotion] = useState(false);
+  useEffect(() => {
+    let isMounted = true;
+    AccessibilityInfo.isReduceMotionEnabled?.().then(enabled => {
+      if (isMounted) setReducedMotion(!!enabled);
+    }).catch(() => {
+      // Some platforms/environments (e.g. older RN, web shims) may not
+      // implement this — default to false (animations enabled).
+    });
+    const subscription = AccessibilityInfo.addEventListener("reduceMotionChanged", enabled => {
+      setReducedMotion(!!enabled);
+    });
+    return () => {
+      isMounted = false;
+      // RN >= 0.65 returns an EmitterSubscription with `.remove()`.
+      // Older versions returned void and relied on removeEventListener.
+      if (subscription && typeof subscription.remove === "function") {
+        subscription.remove();
+      }
+    };
+  }, []);
+  return reducedMotion;
+}
+//# sourceMappingURL=useReducedMotion.js.map

package/lib/module/hooks/useReducedMotion.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useState","AccessibilityInfo","useReducedMotion","reducedMotion","setReducedMotion","isMounted","isReduceMotionEnabled","then","enabled","catch","subscription","addEventListener","remove"],"sourceRoot":"../../../src","sources":["hooks/useReducedMotion.ts"],"mappings":"AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,iBAAiB,QAAQ,cAAc;;AAEhD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,gBAAgBA,CAAA,EAAY;EACxC,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGJ,QAAQ,CAAC,KAAK,CAAC;EAEzDD,SAAS,CAAC,MAAM;IACZ,IAAIM,SAAS,GAAG,IAAI;IAEpBJ,iBAAiB,CAACK,qBAAqB,GAAG,CAAC,CACtCC,IAAI,CAAEC,OAAO,IAAK;MACf,IAAIH,SAAS,EAAED,gBAAgB,CAAC,CAAC,CAACI,OAAO,CAAC;IAC9C,CAAC,CAAC,CACDC,KAAK,CAAC,MAAM;MACT;MACA;IAAA,CACH,CAAC;IAEN,MAAMC,YAAY,GAAGT,iBAAiB,CAACU,gBAAgB,CACnD,qBAAqB,EACpBH,OAAgB,IAAK;MAClBJ,gBAAgB,CAAC,CAAC,CAACI,OAAO,CAAC;IAC/B,CACJ,CAAC;IAED,OAAO,MAAM;MACTH,SAAS,GAAG,KAAK;MACjB;MACA;MACA,IAAIK,YAAY,IAAI,OAAQA,YAAY,CAASE,MAAM,KAAK,UAAU,EAAE;QACnEF,YAAY,CAASE,MAAM,CAAC,CAAC;MAClC;IACJ,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOT,aAAa;AACxB","ignoreList":[]}

package/lib/module/hooks/useSkeletonTheme.js

@@ -0,0 +1,40 @@
+import { useContext, useMemo } from "react";
+import { useColorScheme } from "react-native";
+import { SkeletonContext } from "../providers/SkeletonProvider";
+import { getDefaultThemeColors } from "../utils/theme";
+import { resolveThemeColors } from "../utils/colors";
+/**
+ * Resolves the active light/dark colors for a skeleton.
+ *
+ * If used inside a <SkeletonProvider>, honors its `theme` prop ("light" | "dark" | "system")
+ * and any registered brand `colors`. If used standalone (no provider), falls back to the
+ * device's OS color scheme and the library's default palette.
+ *
+ * @param colorVariant optional brand color variant name registered on the provider
+ */
+export function useSkeletonTheme(colorVariant) {
+  const ctx = useContext(SkeletonContext);
+  const systemScheme = useColorScheme();
+  return useMemo(() => {
+    if (ctx) {
+      const colors = ctx.getVariantColors(colorVariant);
+      return {
+        isDark: ctx.isDark,
+        background: colors.background,
+        highlight: colors.highlight
+      };
+    }
+    const isDark = systemScheme === "dark";
+    const fallback = getDefaultThemeColors(isDark);
+    const colors = resolveThemeColors({
+      isDark,
+      ambient: fallback
+    });
+    return {
+      isDark,
+      background: colors.background,
+      highlight: colors.highlight
+    };
+  }, [ctx, systemScheme, colorVariant]);
+}
+//# sourceMappingURL=useSkeletonTheme.js.map

package/lib/module/hooks/useSkeletonTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useContext","useMemo","useColorScheme","SkeletonContext","getDefaultThemeColors","resolveThemeColors","useSkeletonTheme","colorVariant","ctx","systemScheme","colors","getVariantColors","isDark","background","highlight","fallback","ambient"],"sourceRoot":"../../../src","sources":["hooks/useSkeletonTheme.ts"],"mappings":"AAAA,SAASA,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAC3C,SAASC,cAAc,QAAQ,cAAc;AAC7C,SAASC,eAAe,QAAQ,+BAA+B;AAC/D,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,kBAAkB,QAAQ,iBAAiB;AAGpD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,gBAAgBA,CAACC,YAAqB,EAAyB;EAC3E,MAAMC,GAAG,GAAGR,UAAU,CAACG,eAAe,CAAC;EACvC,MAAMM,YAAY,GAAGP,cAAc,CAAC,CAAC;EAErC,OAAOD,OAAO,CAAC,MAAM;IACjB,IAAIO,GAAG,EAAE;MACL,MAAME,MAAM,GAAGF,GAAG,CAACG,gBAAgB,CAACJ,YAAY,CAAC;MACjD,OAAO;QACHK,MAAM,EAAEJ,GAAG,CAACI,MAAM;QAClBC,UAAU,EAAEH,MAAM,CAACG,UAAU;QAC7BC,SAAS,EAAEJ,MAAM,CAACI;MACtB,CAAC;IACL;IAEA,MAAMF,MAAM,GAAGH,YAAY,KAAK,MAAM;IACtC,MAAMM,QAAQ,GAAGX,qBAAqB,CAACQ,MAAM,CAAC;IAE9C,MAAMF,MAAM,GAAGL,kBAAkB,CAAC;MAC9BO,MAAM;MACNI,OAAO,EAAED;IACb,CAAC,CAAC;IAEF,OAAO;MACHH,MAAM;MACNC,UAAU,EAAEH,MAAM,CAACG,UAAU;MAC7BC,SAAS,EAAEJ,MAAM,CAACI;IACtB,CAAC;EACL,CAAC,EAAE,CAACN,GAAG,EAAEC,YAAY,EAAEF,YAAY,CAAC,CAAC;AACzC","ignoreList":[]}

package/lib/module/index.js

@@ -0,0 +1,50 @@
+import SkeletonBase from "./components/Skeleton";
+import Rect from "./components/Rect";
+import Circle from "./components/Circle";
+import Square from "./components/Square";
+import Pill from "./components/Pill";
+import Group from "./components/Group";
+import Profile from "./presets/Profile";
+import Card from "./presets/Card";
+import Chat from "./presets/Chat";
+import Product from "./presets/Product";
+import Video from "./presets/Video";
+import SkeletonClone from "./clone/SkeletonClone";
+export { SkeletonProvider, SkeletonContext } from "./providers/SkeletonProvider";
+export { useSkeletonTheme } from "./hooks/useSkeletonTheme";
+export { useReducedMotion } from "./hooks/useReducedMotion";
+
+/**
+ * `Skeleton` is the library's primary export: a callable base component
+ * (`<Skeleton />`) that also carries every shape, the layout-grouping
+ * helper, and every smart preset as static properties — so you only ever
+ * need a single import.
+ *
+ * @example
+ * import { Skeleton, SkeletonProvider } from "react-native-smart-skeleton";
+ *
+ * <SkeletonProvider>
+ *   <Skeleton.Rect width={200} height={20} />
+ *   <Skeleton.Circle size={48} />
+ *   <Skeleton.Profile lines={2} />
+ * </SkeletonProvider>
+ */
+
+const Skeleton = SkeletonBase;
+Skeleton.Rect = Rect;
+Skeleton.Circle = Circle;
+Skeleton.Square = Square;
+Skeleton.Pill = Pill;
+Skeleton.Group = Group;
+Skeleton.Clone = SkeletonClone;
+Skeleton.Profile = Profile;
+Skeleton.Card = Card;
+Skeleton.Chat = Chat;
+Skeleton.Product = Product;
+Skeleton.Video = Video;
+export { Skeleton };
+export { SkeletonBase };
+export { Rect, Circle, Square, Pill, Group, SkeletonClone };
+export { Profile, Card, Chat, Product, Video };
+export default Skeleton;
+//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["SkeletonBase","Rect","Circle","Square","Pill","Group","Profile","Card","Chat","Product","Video","SkeletonClone","SkeletonProvider","SkeletonContext","useSkeletonTheme","useReducedMotion","Skeleton","Clone"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":"AAAA,OAAOA,YAAY,MAAM,uBAAuB;AAChD,OAAOC,IAAI,MAAM,mBAAmB;AACpC,OAAOC,MAAM,MAAM,qBAAqB;AACxC,OAAOC,MAAM,MAAM,qBAAqB;AACxC,OAAOC,IAAI,MAAM,mBAAmB;AACpC,OAAOC,KAAK,MAAM,oBAAoB;AAEtC,OAAOC,OAAO,MAAM,mBAAmB;AACvC,OAAOC,IAAI,MAAM,gBAAgB;AACjC,OAAOC,IAAI,MAAM,gBAAgB;AACjC,OAAOC,OAAO,MAAM,mBAAmB;AACvC,OAAOC,KAAK,MAAM,iBAAiB;AAEnC,OAAOC,aAAa,MAAM,uBAAuB;AAEjD,SAASC,gBAAgB,EAAEC,eAAe,QAAQ,8BAA8B;AAChF,SAASC,gBAAgB,QAAQ,0BAA0B;AAC3D,SAASC,gBAAgB,QAAQ,0BAA0B;;AA4B3D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAeA,MAAMC,QAAQ,GAAGhB,YAAiC;AAElDgB,QAAQ,CAACf,IAAI,GAAGA,IAAI;AACpBe,QAAQ,CAACd,MAAM,GAAGA,MAAM;AACxBc,QAAQ,CAACb,MAAM,GAAGA,MAAM;AACxBa,QAAQ,CAACZ,IAAI,GAAGA,IAAI;AACpBY,QAAQ,CAACX,KAAK,GAAGA,KAAK;AACtBW,QAAQ,CAACC,KAAK,GAAGN,aAAa;AAC9BK,QAAQ,CAACV,OAAO,GAAGA,OAAO;AAC1BU,QAAQ,CAACT,IAAI,GAAGA,IAAI;AACpBS,QAAQ,CAACR,IAAI,GAAGA,IAAI;AACpBQ,QAAQ,CAACP,OAAO,GAAGA,OAAO;AAC1BO,QAAQ,CAACN,KAAK,GAAGA,KAAK;AAEtB,SAASM,QAAQ;AACjB,SAAShB,YAAY;AACrB,SAASC,IAAI,EAAEC,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAEC,KAAK,EAAEM,aAAa;AACzD,SAASL,OAAO,EAAEC,IAAI,EAAEC,IAAI,EAAEC,OAAO,EAAEC,KAAK;AAE5C,eAAeM,QAAQ","ignoreList":[]}

package/lib/module/presets/Card.js

@@ -0,0 +1,76 @@
+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); }
+import React from "react";
+import { View } from "react-native";
+import Skeleton from "../components/Skeleton";
+import Circle from "../components/Circle";
+import Group from "../components/Group";
+/**
+ * A ready-made skeleton block mimicking a typical content card: an image
+ * area on top, optionally a small avatar + name row, then body text lines.
+ *
+ * @example
+ * <Skeleton.Card imageHeight={160} lines={3} />
+ */
+export default function Card({
+  imageHeight = 160,
+  lines = 3,
+  showAvatar = false,
+  count = 1,
+  gap = 20,
+  animation,
+  style,
+  testID
+}) {
+  return /*#__PURE__*/React.createElement(View, {
+    style: style,
+    testID: testID
+  }, Array.from({
+    length: count
+  }).map((_, blockIndex) => /*#__PURE__*/React.createElement(View, {
+    key: blockIndex,
+    style: {
+      marginTop: blockIndex === 0 ? 0 : gap
+    }
+  }, /*#__PURE__*/React.createElement(Skeleton, {
+    width: "100%",
+    height: imageHeight,
+    borderRadius: 12,
+    animation: animation
+  }), showAvatar && /*#__PURE__*/React.createElement(View, {
+    style: {
+      flexDirection: "row",
+      alignItems: "center",
+      marginTop: 12
+    }
+  }, /*#__PURE__*/React.createElement(Circle, {
+    size: 32,
+    animation: animation
+  }), /*#__PURE__*/React.createElement(Skeleton, {
+    width: "40%",
+    height: 12,
+    style: {
+      marginLeft: 8
+    },
+    animation: animation
+  })), /*#__PURE__*/React.createElement(Group, {
+    staggerDelay: 60,
+    animation: animation,
+    style: {
+      marginTop: showAvatar ? 12 : 16
+    }
+  }, Array.from({
+    length: lines
+  }, (__, lineIndex) => {
+    const lineProps = {
+      width: lineIndex === lines - 1 ? "50%" : "100%",
+      height: 12,
+      style: {
+        marginTop: lineIndex === 0 ? 0 : 8
+      }
+    };
+    return /*#__PURE__*/React.createElement(Skeleton, _extends({
+      key: lineIndex
+    }, lineProps));
+  })))));
+}
+//# sourceMappingURL=Card.js.map

package/lib/module/presets/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Skeleton","Circle","Group","Card","imageHeight","lines","showAvatar","count","gap","animation","style","testID","createElement","Array","from","length","map","_","blockIndex","key","marginTop","width","height","borderRadius","flexDirection","alignItems","size","marginLeft","staggerDelay","__","lineIndex","lineProps","_extends"],"sourceRoot":"../../../src","sources":["presets/Card.tsx"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,OAAOC,QAAQ,MAAM,wBAAwB;AAC7C,OAAOC,MAAM,MAAM,sBAAsB;AACzC,OAAOC,KAAK,MAAM,qBAAqB;AAGvC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,IAAIA,CAAC;EACzBC,WAAW,GAAG,GAAG;EACjBC,KAAK,GAAG,CAAC;EACTC,UAAU,GAAG,KAAK;EAClBC,KAAK,GAAG,CAAC;EACTC,GAAG,GAAG,EAAE;EACRC,SAAS;EACTC,KAAK;EACLC;AACqB,CAAC,EAAE;EACxB,oBACIb,KAAA,CAAAc,aAAA,CAACb,IAAI;IAACW,KAAK,EAAEA,KAAM;IAACC,MAAM,EAAEA;EAAO,GAC9BE,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAER;EAAM,CAAC,CAAC,CAACS,GAAG,CAAC,CAACC,CAAC,EAAEC,UAAU,kBAC7CpB,KAAA,CAAAc,aAAA,CAACb,IAAI;IAACoB,GAAG,EAAED,UAAW;IAACR,KAAK,EAAE;MAAEU,SAAS,EAAEF,UAAU,KAAK,CAAC,GAAG,CAAC,GAAGV;IAAI;EAAE,gBACpEV,KAAA,CAAAc,aAAA,CAACZ,QAAQ;IAACqB,KAAK,EAAC,MAAM;IAACC,MAAM,EAAElB,WAAY;IAACmB,YAAY,EAAE,EAAG;IAACd,SAAS,EAAEA;EAAU,CAAE,CAAC,EAErFH,UAAU,iBACPR,KAAA,CAAAc,aAAA,CAACb,IAAI;IAACW,KAAK,EAAE;MAAEc,aAAa,EAAE,KAAK;MAAEC,UAAU,EAAE,QAAQ;MAAEL,SAAS,EAAE;IAAG;EAAE,gBACvEtB,KAAA,CAAAc,aAAA,CAACX,MAAM;IAACyB,IAAI,EAAE,EAAG;IAACjB,SAAS,EAAEA;EAAU,CAAE,CAAC,eAC1CX,KAAA,CAAAc,aAAA,CAACZ,QAAQ;IAACqB,KAAK,EAAC,KAAK;IAACC,MAAM,EAAE,EAAG;IAACZ,KAAK,EAAE;MAAEiB,UAAU,EAAE;IAAE,CAAE;IAAClB,SAAS,EAAEA;EAAU,CAAE,CACjF,CACT,eAEDX,KAAA,CAAAc,aAAA,CAACV,KAAK;IACF0B,YAAY,EAAE,EAAG;IACjBnB,SAAS,EAAEA,SAAU;IACrBC,KAAK,EAAE;MAAEU,SAAS,EAAEd,UAAU,GAAG,EAAE,GAAG;IAAG;EAAE,GAE1CO,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAEV;EAAM,CAAC,EAAE,CAACwB,EAAE,EAAEC,SAAS,KAAK;IAC9C,MAAMC,SAAwB,GAAG;MAC7BV,KAAK,EAAES,SAAS,KAAKzB,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,MAAM;MAC/CiB,MAAM,EAAE,EAAE;MACVZ,KAAK,EAAE;QAAEU,SAAS,EAAEU,SAAS,KAAK,CAAC,GAAG,CAAC,GAAG;MAAE;IAChD,CAAC;IACD,oBAAOhC,KAAA,CAAAc,aAAA,CAACZ,QAAQ,EAAAgC,QAAA;MAACb,GAAG,EAAEW;IAAU,GAAKC,SAAS,CAAG,CAAC;EACtD,CAAC,CACE,CACL,CACT,CACC,CAAC;AAEf","ignoreList":[]}

package/lib/module/presets/Chat.js

@@ -0,0 +1,47 @@
+import React from "react";
+import { View } from "react-native";
+import Skeleton from "../components/Skeleton";
+const BUBBLE_WIDTHS = ["55%", "70%", "45%", "62%"];
+
+/**
+ * A ready-made skeleton block mimicking a chat conversation: a series of
+ * message bubbles, alternating left/right alignment by default to read as
+ * a two-party conversation while loading.
+ *
+ * @example
+ * <Skeleton.Chat messages={5} />
+ */
+export default function Chat({
+  messages = 4,
+  alternate = true,
+  gap = 12,
+  animation,
+  style,
+  testID
+}) {
+  return /*#__PURE__*/React.createElement(View, {
+    style: style,
+    testID: testID
+  }, Array.from({
+    length: messages
+  }).map((_, index) => {
+    const isRight = alternate && index % 2 === 1;
+    const width = BUBBLE_WIDTHS[index % BUBBLE_WIDTHS.length];
+    const height = 18 + index % 3 * 6;
+    return /*#__PURE__*/React.createElement(View, {
+      key: index,
+      style: {
+        flexDirection: "row",
+        justifyContent: isRight ? "flex-end" : "flex-start",
+        marginTop: index === 0 ? 0 : gap
+      }
+    }, /*#__PURE__*/React.createElement(Skeleton, {
+      width: width,
+      height: height,
+      borderRadius: 14,
+      animation: animation,
+      delay: index * 70
+    }));
+  }));
+}
+//# sourceMappingURL=Chat.js.map

package/lib/module/presets/Chat.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Skeleton","BUBBLE_WIDTHS","Chat","messages","alternate","gap","animation","style","testID","createElement","Array","from","length","map","_","index","isRight","width","height","key","flexDirection","justifyContent","marginTop","borderRadius","delay"],"sourceRoot":"../../../src","sources":["presets/Chat.tsx"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,OAAOC,QAAQ,MAAM,wBAAwB;AAG7C,MAAMC,aAAa,GAAG,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;;AAElD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,IAAIA,CAAC;EACzBC,QAAQ,GAAG,CAAC;EACZC,SAAS,GAAG,IAAI;EAChBC,GAAG,GAAG,EAAE;EACRC,SAAS;EACTC,KAAK;EACLC;AACqB,CAAC,EAAE;EACxB,oBACIV,KAAA,CAAAW,aAAA,CAACV,IAAI;IAACQ,KAAK,EAAEA,KAAM;IAACC,MAAM,EAAEA;EAAO,GAC9BE,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAET;EAAS,CAAC,CAAC,CAACU,GAAG,CAAC,CAACC,CAAC,EAAEC,KAAK,KAAK;IAChD,MAAMC,OAAO,GAAGZ,SAAS,IAAIW,KAAK,GAAG,CAAC,KAAK,CAAC;IAC5C,MAAME,KAAK,GAAGhB,aAAa,CAACc,KAAK,GAAGd,aAAa,CAACW,MAAM,CAAC;IACzD,MAAMM,MAAM,GAAG,EAAE,GAAKH,KAAK,GAAG,CAAC,GAAI,CAAE;IAErC,oBACIjB,KAAA,CAAAW,aAAA,CAACV,IAAI;MACDoB,GAAG,EAAEJ,KAAM;MACXR,KAAK,EAAE;QACHa,aAAa,EAAE,KAAK;QACpBC,cAAc,EAAEL,OAAO,GAAG,UAAU,GAAG,YAAY;QACnDM,SAAS,EAAEP,KAAK,KAAK,CAAC,GAAG,CAAC,GAAGV;MACjC;IAAE,gBAEFP,KAAA,CAAAW,aAAA,CAACT,QAAQ;MACLiB,KAAK,EAAEA,KAAM;MACbC,MAAM,EAAEA,MAAO;MACfK,YAAY,EAAE,EAAG;MACjBjB,SAAS,EAAEA,SAAU;MACrBkB,KAAK,EAAET,KAAK,GAAG;IAAG,CACrB,CACC,CAAC;EAEf,CAAC,CACC,CAAC;AAEf","ignoreList":[]}

package/lib/module/presets/Product.js

@@ -0,0 +1,63 @@
+import React from "react";
+import { View } from "react-native";
+import Skeleton from "../components/Skeleton";
+import { getRecommendedColumns } from "../utils/responsive";
+/**
+ * A ready-made skeleton grid mimicking a product listing (e.g. e-commerce
+ * catalog or search results): square-ish image, title line, and price line,
+ * tiled into a responsive grid.
+ *
+ * @example
+ * <Skeleton.Product count={6} columns={2} />
+ */
+export default function Product({
+  imageHeight = 140,
+  columns,
+  count = 4,
+  gap = 16,
+  animation,
+  style,
+  testID
+}) {
+  const resolvedColumns = columns ?? getRecommendedColumns();
+  const itemWidth = `${100 / resolvedColumns}%`;
+  return /*#__PURE__*/React.createElement(View, {
+    style: [{
+      flexDirection: "row",
+      flexWrap: "wrap"
+    }, style],
+    testID: testID
+  }, Array.from({
+    length: count
+  }).map((_, index) => /*#__PURE__*/React.createElement(View, {
+    key: index,
+    style: {
+      width: itemWidth,
+      paddingHorizontal: gap / 2,
+      marginBottom: gap
+    }
+  }, /*#__PURE__*/React.createElement(Skeleton, {
+    width: "100%",
+    height: imageHeight,
+    borderRadius: 10,
+    animation: animation,
+    delay: index * 40
+  }), /*#__PURE__*/React.createElement(Skeleton, {
+    width: "80%",
+    height: 12,
+    style: {
+      marginTop: 8
+    },
+    animation: animation,
+    delay: index * 40
+  }), /*#__PURE__*/React.createElement(Skeleton, {
+    width: "40%",
+    height: 12,
+    style: {
+      marginTop: 6
+    },
+    animation: animation,
+    delay: index * 40
+  }))));
+}
+//# sourceMappingURL=Product.js.map

package/lib/module/presets/Product.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Skeleton","getRecommendedColumns","Product","imageHeight","columns","count","gap","animation","style","testID","resolvedColumns","itemWidth","createElement","flexDirection","flexWrap","Array","from","length","map","_","index","key","width","paddingHorizontal","marginBottom","height","borderRadius","delay","marginTop"],"sourceRoot":"../../../src","sources":["presets/Product.tsx"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,OAAOC,QAAQ,MAAM,wBAAwB;AAC7C,SAASC,qBAAqB,QAAQ,qBAAqB;AAG3D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,OAAOA,CAAC;EAC5BC,WAAW,GAAG,GAAG;EACjBC,OAAO;EACPC,KAAK,GAAG,CAAC;EACTC,GAAG,GAAG,EAAE;EACRC,SAAS;EACTC,KAAK;EACLC;AACwB,CAAC,EAAE;EAC3B,MAAMC,eAAe,GAAGN,OAAO,IAAIH,qBAAqB,CAAC,CAAC;EAC1D,MAAMU,SAAS,GAAG,GAAG,GAAG,GAAGD,eAAe,GAAG;EAE7C,oBACIZ,KAAA,CAAAc,aAAA,CAACb,IAAI;IAACS,KAAK,EAAE,CAAC;MAAEK,aAAa,EAAE,KAAK;MAAEC,QAAQ,EAAE;IAAO,CAAC,EAAEN,KAAK,CAAE;IAACC,MAAM,EAAEA;EAAO,GAC5EM,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAEZ;EAAM,CAAC,CAAC,CAACa,GAAG,CAAC,CAACC,CAAC,EAAEC,KAAK,kBACxCtB,KAAA,CAAAc,aAAA,CAACb,IAAI;IACDsB,GAAG,EAAED,KAAM;IACXZ,KAAK,EAAE;MACHc,KAAK,EAAEX,SAAgB;MACvBY,iBAAiB,EAAEjB,GAAG,GAAG,CAAC;MAC1BkB,YAAY,EAAElB;IAClB;EAAE,gBAEFR,KAAA,CAAAc,aAAA,CAACZ,QAAQ;IAACsB,KAAK,EAAC,MAAM;IAACG,MAAM,EAAEtB,WAAY;IAACuB,YAAY,EAAE,EAAG;IAACnB,SAAS,EAAEA,SAAU;IAACoB,KAAK,EAAEP,KAAK,GAAG;EAAG,CAAE,CAAC,eACzGtB,KAAA,CAAAc,aAAA,CAACZ,QAAQ;IAACsB,KAAK,EAAC,KAAK;IAACG,MAAM,EAAE,EAAG;IAACjB,KAAK,EAAE;MAAEoB,SAAS,EAAE;IAAE,CAAE;IAACrB,SAAS,EAAEA,SAAU;IAACoB,KAAK,EAAEP,KAAK,GAAG;EAAG,CAAE,CAAC,eACtGtB,KAAA,CAAAc,aAAA,CAACZ,QAAQ;IAACsB,KAAK,EAAC,KAAK;IAACG,MAAM,EAAE,EAAG;IAACjB,KAAK,EAAE;MAAEoB,SAAS,EAAE;IAAE,CAAE;IAACrB,SAAS,EAAEA,SAAU;IAACoB,KAAK,EAAEP,KAAK,GAAG;EAAG,CAAE,CACnG,CACT,CACC,CAAC;AAEf","ignoreList":[]}

package/lib/module/presets/Profile.js

@@ -0,0 +1,60 @@
+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); }
+import React from "react";
+import { View } from "react-native";
+import Skeleton from "../components/Skeleton";
+import Circle from "../components/Circle";
+import Group from "../components/Group";
+/**
+ * A ready-made skeleton block mimicking a profile header: a circular avatar
+ * beside a name line and one or more secondary text lines (e.g. handle/bio).
+ *
+ * @example
+ * <Skeleton.Profile avatarSize={56} lines={2} />
+ */
+export default function Profile({
+  avatarSize = 56,
+  lines = 2,
+  count = 1,
+  gap = 16,
+  animation,
+  style,
+  testID
+}) {
+  return /*#__PURE__*/React.createElement(View, {
+    style: style,
+    testID: testID
+  }, Array.from({
+    length: count
+  }).map((_, blockIndex) => /*#__PURE__*/React.createElement(View, {
+    key: blockIndex,
+    style: {
+      flexDirection: "row",
+      alignItems: "center",
+      marginTop: blockIndex === 0 ? 0 : gap
+    }
+  }, /*#__PURE__*/React.createElement(Circle, {
+    size: avatarSize,
+    animation: animation
+  }), /*#__PURE__*/React.createElement(Group, {
+    staggerDelay: 60,
+    animation: animation,
+    style: {
+      marginLeft: 12,
+      flex: 1
+    }
+  }, Array.from({
+    length: lines
+  }, (__, lineIndex) => {
+    const lineProps = {
+      width: lineIndex === 0 ? "60%" : `${85 - lineIndex * 15}%`,
+      height: lineIndex === 0 ? 16 : 12,
+      style: {
+        marginTop: lineIndex === 0 ? 0 : 8
+      }
+    };
+    return /*#__PURE__*/React.createElement(Skeleton, _extends({
+      key: lineIndex
+    }, lineProps));
+  })))));
+}
+//# sourceMappingURL=Profile.js.map

package/lib/module/presets/Profile.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Skeleton","Circle","Group","Profile","avatarSize","lines","count","gap","animation","style","testID","createElement","Array","from","length","map","_","blockIndex","key","flexDirection","alignItems","marginTop","size","staggerDelay","marginLeft","flex","__","lineIndex","lineProps","width","height","_extends"],"sourceRoot":"../../../src","sources":["presets/Profile.tsx"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AACnC,OAAOC,QAAQ,MAAM,wBAAwB;AAC7C,OAAOC,MAAM,MAAM,sBAAsB;AACzC,OAAOC,KAAK,MAAM,qBAAqB;AAGvC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,OAAOA,CAAC;EAC5BC,UAAU,GAAG,EAAE;EACfC,KAAK,GAAG,CAAC;EACTC,KAAK,GAAG,CAAC;EACTC,GAAG,GAAG,EAAE;EACRC,SAAS;EACTC,KAAK;EACLC;AACwB,CAAC,EAAE;EAC3B,oBACIZ,KAAA,CAAAa,aAAA,CAACZ,IAAI;IAACU,KAAK,EAAEA,KAAM;IAACC,MAAM,EAAEA;EAAO,GAC9BE,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAER;EAAM,CAAC,CAAC,CAACS,GAAG,CAAC,CAACC,CAAC,EAAEC,UAAU,kBAC7CnB,KAAA,CAAAa,aAAA,CAACZ,IAAI;IACDmB,GAAG,EAAED,UAAW;IAChBR,KAAK,EAAE;MACHU,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBC,SAAS,EAAEJ,UAAU,KAAK,CAAC,GAAG,CAAC,GAAGV;IACtC;EAAE,gBAEFT,KAAA,CAAAa,aAAA,CAACV,MAAM;IAACqB,IAAI,EAAElB,UAAW;IAACI,SAAS,EAAEA;EAAU,CAAE,CAAC,eAClDV,KAAA,CAAAa,aAAA,CAACT,KAAK;IACFqB,YAAY,EAAE,EAAG;IACjBf,SAAS,EAAEA,SAAU;IACrBC,KAAK,EAAE;MAAEe,UAAU,EAAE,EAAE;MAAEC,IAAI,EAAE;IAAE;EAAE,GAElCb,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAET;EAAM,CAAC,EAAE,CAACqB,EAAE,EAAEC,SAAS,KAAK;IAC9C,MAAMC,SAAwB,GAAG;MAC7BC,KAAK,EAAEF,SAAS,KAAK,CAAC,GAAG,KAAK,GAAG,GAAG,EAAE,GAAGA,SAAS,GAAG,EAAE,GAAG;MAC1DG,MAAM,EAAEH,SAAS,KAAK,CAAC,GAAG,EAAE,GAAG,EAAE;MACjClB,KAAK,EAAE;QAAEY,SAAS,EAAEM,SAAS,KAAK,CAAC,GAAG,CAAC,GAAG;MAAE;IAChD,CAAC;IACD,oBAAO7B,KAAA,CAAAa,aAAA,CAACX,QAAQ,EAAA+B,QAAA;MAACb,GAAG,EAAES;IAAU,GAAKC,SAAS,CAAG,CAAC;EACtD,CAAC,CACE,CACL,CACT,CACC,CAAC;AAEf","ignoreList":[]}