related-ui-components 3.0.6 → 3.0.8

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 (9) hide show
  1. package/lib/module/components/Skeleton/Shimmer.js +42 -52
  2. package/lib/module/components/Skeleton/Shimmer.js.map +1 -1
  3. package/lib/module/contexts/BottomSheetStackProvider.js +8 -7
  4. package/lib/module/contexts/BottomSheetStackProvider.js.map +1 -1
  5. package/lib/typescript/src/components/Skeleton/Shimmer.d.ts.map +1 -1
  6. package/lib/typescript/src/contexts/BottomSheetStackProvider.d.ts.map +1 -1
  7. package/package.json +1 -1
  8. package/src/components/Skeleton/Shimmer.tsx +42 -72
  9. package/src/contexts/BottomSheetStackProvider.tsx +9 -1
package/lib/module/components/Skeleton/Shimmer.js CHANGED
@@ -1,12 +1,10 @@
1
1
  "use strict";
2
2
 
3
- import React, { useCallback, useEffect, useMemo } from "react";
4
- import { View, StyleSheet, I18nManager } from "react-native";
5
- import Animated, { useSharedValue, useAnimatedStyle, withRepeat, withSequence, withTiming, cancelAnimation, Easing } from "react-native-reanimated";
3
+ import React, { useEffect, useRef } from "react";
4
+ import { View, StyleSheet, Animated, Easing, I18nManager } from "react-native";
6
5
  import { LinearGradient } from "expo-linear-gradient";
7
6
  import { useTheme } from "../../theme/index.js";
8
7
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
9
- const AnimatedLinearGradient = Animated.createAnimatedComponent(LinearGradient);
10
8
  const Shimmer = ({
11
9
  children,
12
10
  width,
@@ -20,42 +18,25 @@ const Shimmer = ({
20
18
  theme
21
19
  } = useTheme();
22
20
  const isRTL = I18nManager.isRTL;
23
-
24
- // Shared animation values (Reanimated)
25
- const containerWidth = useSharedValue(typeof width === "number" ? width : 400);
26
- const translateX = useSharedValue(0);
27
- const opacity = useSharedValue(1);
28
- const shimmerColors = useMemo(() => [theme.skeletonBackgroundColor + "00", shimmerColor || theme.skeletonShimmer, theme.skeletonBackgroundColor + "00"], [theme, shimmerColor]);
29
-
30
- // Define easing
31
- const easing = Easing.bezier(0.76, 0, 0.24, 1);
32
-
33
- // Start shimmer animation
34
- const startAnimation = useCallback(() => {
35
- "worklet";
36
-
37
- const direction = isRTL ? -1 : 1;
38
- translateX.value = withRepeat(withSequence(withTiming(-containerWidth.value * 1.5 * direction, {
39
- duration: 0
40
- }), withTiming(containerWidth.value * 1.5 * direction, {
41
- duration,
42
- easing
43
- })), -1);
44
- opacity.value = withTiming(1, {
45
- duration: duration / 2,
46
- easing
47
- });
48
- }, [containerWidth, duration, easing, isRTL]);
21
+ const animatedValue = useRef(new Animated.Value(0)).current;
49
22
  useEffect(() => {
50
- startAnimation();
51
- return () => cancelAnimation(translateX);
52
- }, [startAnimation, translateX]);
53
- const animatedStyle = useAnimatedStyle(() => ({
54
- opacity: opacity.value,
55
- transform: [{
56
- translateX: translateX.value
57
- }]
58
- }));
23
+ const animation = Animated.loop(Animated.timing(animatedValue, {
24
+ toValue: 1,
25
+ duration: duration,
26
+ easing: Easing.linear,
27
+ useNativeDriver: true
28
+ }));
29
+ animation.start();
30
+ return () => animation.stop();
31
+ }, [animatedValue, duration]);
32
+ const numericWidth = typeof width === "number" ? width : 400;
33
+ const ltrOutputRange = [-shimmerWidth, numericWidth + shimmerWidth];
34
+ const rtlOutputRange = [numericWidth + shimmerWidth, -shimmerWidth];
35
+ const translateX = animatedValue.interpolate({
36
+ inputRange: [0, 1],
37
+ outputRange: isRTL ? rtlOutputRange : ltrOutputRange
38
+ });
39
+ const shimmerColors = ["rgba(255, 255, 255, 0)", shimmerColor || theme.skeletonShimmer, "rgba(255, 255, 255, 0)"];
59
40
  return /*#__PURE__*/_jsxs(View, {
60
41
  style: [{
61
42
  width,
@@ -63,20 +44,29 @@ const Shimmer = ({
63
44
  overflow: "hidden",
64
45
  backgroundColor: theme.skeletonBackgroundColor
65
46
  }, style],
66
- children: [children, /*#__PURE__*/_jsx(AnimatedLinearGradient, {
67
- colors: shimmerColors,
68
- start: {
69
- x: 0,
70
- y: 0.5
71
- },
72
- end: {
73
- x: 1,
74
- y: 0.5
75
- },
76
- style: [StyleSheet.absoluteFill, {
77
- width: shimmerWidth,
47
+ children: [children, /*#__PURE__*/_jsx(Animated.View, {
48
+ style: {
49
+ ...StyleSheet.absoluteFillObject,
50
+ transform: [{
51
+ translateX
52
+ }],
78
53
  zIndex: 1
79
- }, animatedStyle]
54
+ },
55
+ children: /*#__PURE__*/_jsx(LinearGradient, {
56
+ colors: shimmerColors,
57
+ style: {
58
+ flex: 1,
59
+ width: shimmerWidth
60
+ },
61
+ start: {
62
+ x: 0,
63
+ y: 0.5
64
+ },
65
+ end: {
66
+ x: 1,
67
+ y: 0.5
68
+ }
69
+ })
80
70
  })]
81
71
  });
82
72
  };
package/lib/module/components/Skeleton/Shimmer.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","useCallback","useEffect","useMemo","View","StyleSheet","I18nManager","Animated","useSharedValue","useAnimatedStyle","withRepeat","withSequence","withTiming","cancelAnimation","Easing","LinearGradient","useTheme","jsx","_jsx","jsxs","_jsxs","AnimatedLinearGradient","createAnimatedComponent","Shimmer","children","width","height","style","shimmerColor","duration","shimmerWidth","theme","isRTL","containerWidth","translateX","opacity","shimmerColors","skeletonBackgroundColor","skeletonShimmer","easing","bezier","startAnimation","direction","value","animatedStyle","transform","overflow","backgroundColor","colors","start","x","y","end","absoluteFill","zIndex"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Skeleton/Shimmer.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,OAAO,QAAQ,OAAO;AAC9D,SACEC,IAAI,EACJC,UAAU,EAIVC,WAAW,QACN,cAAc;AACrB,OAAOC,QAAQ,IACbC,cAAc,EACdC,gBAAgB,EAChBC,UAAU,EACVC,YAAY,EACZC,UAAU,EACVC,eAAe,EACfC,MAAM,QAED,yBAAyB;AAChC,SAASC,cAAc,QAAQ,sBAAsB;AACrD,SAASC,QAAQ,QAAQ,sBAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEvC,MAAMC,sBAAsB,GAAGd,QAAQ,CAACe,uBAAuB,CAACP,cAAc,CAAC;AAY/E,MAAMQ,OAA+B,GAAGA,CAAC;EACvCC,QAAQ;EACRC,KAAK;EACLC,MAAM;EACNC,KAAK;EACLC,YAAY;EACZC,QAAQ,GAAG,IAAI;EACfC,YAAY,GAAG;AACjB,CAAC,KAAK;EACJ,MAAM;IAAEC;EAAM,CAAC,GAAGf,QAAQ,CAAC,CAAC;EAC5B,MAAMgB,KAAK,GAAG1B,WAAW,CAAC0B,KAAK;;EAE/B;EACA,MAAMC,cAAc,GAAGzB,cAAc,CACnC,OAAOiB,KAAK,KAAK,QAAQ,GAAGA,KAAK,GAAG,GACtC,CAAC;EACD,MAAMS,UAAU,GAAG1B,cAAc,CAAC,CAAC,CAAC;EACpC,MAAM2B,OAAO,GAAG3B,cAAc,CAAC,CAAC,CAAC;EAEjC,MAAM4B,aAAa,GAAGjC,OAAO,CAC3B,MAAM,CACJ4B,KAAK,CAACM,uBAAuB,GAAG,IAAI,EACpCT,YAAY,IAAIG,KAAK,CAACO,eAAe,EACrCP,KAAK,CAACM,uBAAuB,GAAG,IAAI,CACrC,EACD,CAACN,KAAK,EAAEH,YAAY,CACtB,CAAC;;EAED;EACA,MAAMW,MAAM,GAAGzB,MAAM,CAAC0B,MAAM,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;;EAE9C;EACA,MAAMC,cAAc,GAAGxC,WAAW,CAAC,MAAM;IACvC,SAAS;;IACT,MAAMyC,SAAS,GAAGV,KAAK,GAAG,CAAC,CAAC,GAAG,CAAC;IAEhCE,UAAU,CAACS,KAAK,GAAGjC,UAAU,CAC3BC,YAAY,CACVC,UAAU,CAAC,CAACqB,cAAc,CAACU,KAAK,GAAG,GAAG,GAAGD,SAAS,EAAE;MAAEb,QAAQ,EAAE;IAAE,CAAC,CAAC,EACpEjB,UAAU,CAACqB,cAAc,CAACU,KAAK,GAAG,GAAG,GAAGD,SAAS,EAAE;MACjDb,QAAQ;MACRU;IACF,CAAC,CACH,CAAC,EACD,CAAC,CACH,CAAC;IAEDJ,OAAO,CAACQ,KAAK,GAAG/B,UAAU,CAAC,CAAC,EAAE;MAC5BiB,QAAQ,EAAEA,QAAQ,GAAG,CAAC;MACtBU;IACF,CAAC,CAAC;EACJ,CAAC,EAAE,CAACN,cAAc,EAAEJ,QAAQ,EAAEU,MAAM,EAAEP,KAAK,CAAC,CAAC;EAE7C9B,SAAS,CAAC,MAAM;IACduC,cAAc,CAAC,CAAC;IAEhB,OAAO,MAAM5B,eAAe,CAACqB,UAAU,CAAC;EAC1C,CAAC,EAAE,CAACO,cAAc,EAAEP,UAAU,CAAC,CAAC;EAEhC,MAAMU,aAAa,GAAGnC,gBAAgB,CAAC,OAAO;IAC5C0B,OAAO,EAAEA,OAAO,CAACQ,KAAK;IACtBE,SAAS,EAAE,CAAC;MAAEX,UAAU,EAAEA,UAAU,CAACS;IAAM,CAAC;EAC9C,CAAC,CAAC,CAAC;EAEH,oBACEvB,KAAA,CAAChB,IAAI;IACHuB,KAAK,EAAE,CACL;MACEF,KAAK;MACLC,MAAM;MACNoB,QAAQ,EAAE,QAAQ;MAClBC,eAAe,EAAEhB,KAAK,CAACM;IACzB,CAAC,EACDV,KAAK,CACL;IAAAH,QAAA,GAEDA,QAAQ,eAGTN,IAAA,CAACG,sBAAsB;MACrB2B,MAAM,EAAEZ,aAAqB;MAC7Ba,KAAK,EAAE;QAAEC,CAAC,EAAE,CAAC;QAAEC,CAAC,EAAE;MAAI,CAAE;MACxBC,GAAG,EAAE;QAAEF,CAAC,EAAE,CAAC;QAAEC,CAAC,EAAE;MAAI,CAAE;MACtBxB,KAAK,EAAE,CACLtB,UAAU,CAACgD,YAAY,EACvB;QAAE5B,KAAK,EAAEK,YAAY;QAAEwB,MAAM,EAAE;MAAE,CAAC,EAClCV,aAAa;IACb,CACH,CAAC;EAAA,CACE,CAAC;AAEX,CAAC;AAED,eAAerB,OAAO","ignoreList":[]}
1
+ {"version":3,"names":["React","useEffect","useRef","View","StyleSheet","Animated","Easing","I18nManager","LinearGradient","useTheme","jsx","_jsx","jsxs","_jsxs","Shimmer","children","width","height","style","shimmerColor","duration","shimmerWidth","theme","isRTL","animatedValue","Value","current","animation","loop","timing","toValue","easing","linear","useNativeDriver","start","stop","numericWidth","ltrOutputRange","rtlOutputRange","translateX","interpolate","inputRange","outputRange","shimmerColors","skeletonShimmer","overflow","backgroundColor","skeletonBackgroundColor","absoluteFillObject","transform","zIndex","colors","flex","x","y","end"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Skeleton/Shimmer.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAChD,SACEC,IAAI,EACJC,UAAU,EACVC,QAAQ,EACRC,MAAM,EAINC,WAAW,QACN,cAAc;AACrB,SAASC,cAAc,QAAQ,sBAAsB;AACrD,SAASC,QAAQ,QAAQ,sBAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAYvC,MAAMC,OAA+B,GAAGA,CAAC;EACvCC,QAAQ;EACRC,KAAK;EACLC,MAAM;EACNC,KAAK;EACLC,YAAY;EACZC,QAAQ,GAAG,IAAI;EACfC,YAAY,GAAG;AACjB,CAAC,KAAK;EACJ,MAAM;IAAEC;EAAM,CAAC,GAAGb,QAAQ,CAAC,CAAC;EAC5B,MAAMc,KAAK,GAAGhB,WAAW,CAACgB,KAAK;EAC/B,MAAMC,aAAa,GAAGtB,MAAM,CAAC,IAAIG,QAAQ,CAACoB,KAAK,CAAC,CAAC,CAAC,CAAC,CAACC,OAAO;EAE3DzB,SAAS,CAAC,MAAM;IACd,MAAM0B,SAAS,GAAGtB,QAAQ,CAACuB,IAAI,CAC7BvB,QAAQ,CAACwB,MAAM,CAACL,aAAa,EAAE;MAC7BM,OAAO,EAAE,CAAC;MACVV,QAAQ,EAAEA,QAAQ;MAClBW,MAAM,EAAEzB,MAAM,CAAC0B,MAAM;MACrBC,eAAe,EAAE;IACnB,CAAC,CACH,CAAC;IACDN,SAAS,CAACO,KAAK,CAAC,CAAC;IACjB,OAAO,MAAMP,SAAS,CAACQ,IAAI,CAAC,CAAC;EAC/B,CAAC,EAAE,CAACX,aAAa,EAAEJ,QAAQ,CAAC,CAAC;EAE7B,MAAMgB,YAAY,GAAG,OAAOpB,KAAK,KAAK,QAAQ,GAAGA,KAAK,GAAG,GAAG;EAE5D,MAAMqB,cAAc,GAAG,CAAC,CAAChB,YAAY,EAAEe,YAAY,GAAGf,YAAY,CAAC;EACnE,MAAMiB,cAAc,GAAG,CAACF,YAAY,GAAGf,YAAY,EAAE,CAACA,YAAY,CAAC;EAEnE,MAAMkB,UAAU,GAAGf,aAAa,CAACgB,WAAW,CAAC;IAC3CC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;IAClBC,WAAW,EAAEnB,KAAK,GAAGe,cAAc,GAAGD;EACxC,CAAC,CAAC;EAEF,MAAMM,aAAa,GAAG,CACpB,wBAAwB,EACxBxB,YAAY,IAAIG,KAAK,CAACsB,eAAe,EACrC,wBAAwB,CACzB;EAED,oBACE/B,KAAA,CAACV,IAAI;IACHe,KAAK,EAAE,CACL;MACEF,KAAK;MACLC,MAAM;MACN4B,QAAQ,EAAE,QAAQ;MAClBC,eAAe,EAAExB,KAAK,CAACyB;IACzB,CAAC,EACD7B,KAAK,CACL;IAAAH,QAAA,GAEDA,QAAQ,eACTJ,IAAA,CAACN,QAAQ,CAACF,IAAI;MACZe,KAAK,EAAE;QACL,GAAGd,UAAU,CAAC4C,kBAAkB;QAChCC,SAAS,EAAE,CAAC;UAAEV;QAAW,CAAC,CAAC;QAC3BW,MAAM,EAAE;MACV,CAAE;MAAAnC,QAAA,eAEFJ,IAAA,CAACH,cAAc;QACb2C,MAAM,EAAER,aAAqB;QAC7BzB,KAAK,EAAE;UAAEkC,IAAI,EAAE,CAAC;UAAEpC,KAAK,EAAEK;QAAa,CAAE;QACxCa,KAAK,EAAE;UAAEmB,CAAC,EAAE,CAAC;UAAEC,CAAC,EAAE;QAAI,CAAE;QACxBC,GAAG,EAAE;UAAEF,CAAC,EAAE,CAAC;UAAEC,CAAC,EAAE;QAAI;MAAE,CACvB;IAAC,CACW,CAAC;EAAA,CACZ,CAAC;AAEX,CAAC;AAED,eAAexC,OAAO","ignoreList":[]}
package/lib/module/contexts/BottomSheetStackProvider.js CHANGED
@@ -64,14 +64,15 @@ export const BottomSheetStackProvider = ({
64
64
  appearsOnIndex: 0,
65
65
  pressBehavior: "close"
66
66
  }), []);
67
+ const contextValue = useMemo(() => ({
68
+ push,
69
+ pop,
70
+ replace,
71
+ clear,
72
+ canGoBack
73
+ }), [push, pop, replace, clear, canGoBack]);
67
74
  return /*#__PURE__*/_jsxs(BottomSheetStackContext.Provider, {
68
- value: {
69
- push,
70
- pop,
71
- replace,
72
- clear,
73
- canGoBack
74
- },
75
+ value: contextValue,
75
76
  children: [children, /*#__PURE__*/_jsx(BottomSheet, {
76
77
  ref: sheetRef,
77
78
  index: -1,
package/lib/module/contexts/BottomSheetStackProvider.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["BottomSheet","BottomSheetBackdrop","React","useCallback","useEffect","useMemo","useRef","useState","BackHandler","StyleSheet","Animated","FadeIn","FadeOut","useSafeAreaInsets","BottomSheetStackContext","jsx","_jsx","jsxs","_jsxs","BottomSheetStackProvider","children","stack","setStack","sheetRef","top","push","item","prev","clear","current","close","pop","length","slice","replace","currentItem","canGoBack","isOpen","snapToIndex","initialSnapIndex","backHandlerSubscription","addEventListener","remove","AnimatedView","View","enteringAnimation","duration","exitingAnimation","renderBackdrop","props","disappearsOnIndex","style","backgroundColor","appearsOnIndex","pressBehavior","Provider","value","ref","index","snapPoints","enableDynamicSizing","dynamicSizing","enablePanDownToClose","android_keyboardInputMode","enableBlurKeyboardOnGesture","keyboardBlurBehavior","keyboardBehavior","onClose","backdropComponent","topInset","handleIndicatorStyle","styles","sheetContainer","bottomSheetProps","entering","exiting","animatedView","component","create","flex"],"sourceRoot":"..\\..\\..\\src","sources":["contexts/BottomSheetStackProvider.tsx"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["BottomSheet","BottomSheetBackdrop","React","useCallback","useEffect","useMemo","useRef","useState","BackHandler","StyleSheet","Animated","FadeIn","FadeOut","useSafeAreaInsets","BottomSheetStackContext","jsx","_jsx","jsxs","_jsxs","BottomSheetStackProvider","children","stack","setStack","sheetRef","top","push","item","prev","clear","current","close","pop","length","slice","replace","currentItem","canGoBack","isOpen","snapToIndex","initialSnapIndex","backHandlerSubscription","addEventListener","remove","AnimatedView","View","enteringAnimation","duration","exitingAnimation","renderBackdrop","props","disappearsOnIndex","style","backgroundColor","appearsOnIndex","pressBehavior","contextValue","Provider","value","ref","index","snapPoints","enableDynamicSizing","dynamicSizing","enablePanDownToClose","android_keyboardInputMode","enableBlurKeyboardOnGesture","keyboardBlurBehavior","keyboardBehavior","onClose","backdropComponent","topInset","handleIndicatorStyle","styles","sheetContainer","bottomSheetProps","entering","exiting","animatedView","component","create","flex"],"sourceRoot":"..\\..\\..\\src","sources":["contexts/BottomSheetStackProvider.tsx"],"mappings":";;AAAA,OAAOA,WAAW,IAChBC,mBAAmB,QAEd,sBAAsB;AAC7B,OAAOC,KAAK,IAEVC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,QAAQ,QACH,OAAO;AACd,SAASC,WAAW,EAAEC,UAAU,QAAQ,cAAc;AACtD,OAAOC,QAAQ,IAAIC,MAAM,EAAEC,OAAO,QAAQ,yBAAyB;AACnE,SAASC,iBAAiB,QAAQ,gCAAgC;AAClE,SACEC,uBAAuB,QAElB,8BAA2B;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAEnC,OAAO,MAAMC,wBAA2D,GAAGA,CAAC;EAC1EC;AACF,CAAC,KAAK;EACJ,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGf,QAAQ,CAAyB,EAAE,CAAC;EAC9D,MAAMgB,QAAQ,GAAGjB,MAAM,CAAc,IAAI,CAAC;EAC1C,MAAM;IAAEkB;EAAI,CAAC,GAAGX,iBAAiB,CAAC,CAAC;EAEnC,MAAMY,IAAI,GAAGtB,WAAW,CAAEuB,IAA0B,IAAK;IACvDJ,QAAQ,CAAEK,IAAI,IAAK,CAAC,GAAGA,IAAI,EAAED,IAAI,CAAC,CAAC;EACrC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAME,KAAK,GAAGzB,WAAW,CAAC,MAAM;IAC9BoB,QAAQ,CAACM,OAAO,EAAEC,KAAK,CAAC,CAAC;IACzBR,QAAQ,CAAC,EAAE,CAAC;EACd,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMS,GAAG,GAAG5B,WAAW,CAAC,MAAM;IAC5B,IAAIkB,KAAK,CAACW,MAAM,IAAI,CAAC,EAAE;MACrBJ,KAAK,CAAC,CAAC;MACP;IACF;IACAN,QAAQ,CAAEK,IAAI,IAAKA,IAAI,CAACM,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;EACvC,CAAC,EAAE,CAACZ,KAAK,CAACW,MAAM,EAAEJ,KAAK,CAAC,CAAC;EAEzB,MAAMM,OAAO,GAAG/B,WAAW,CAAEuB,IAA0B,IAAK;IAC1DJ,QAAQ,CAAC,CAACI,IAAI,CAAC,CAAC;EAClB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMS,WAAW,GAAG9B,OAAO,CAAC,MAAMgB,KAAK,CAACA,KAAK,CAACW,MAAM,GAAG,CAAC,CAAC,EAAE,CAACX,KAAK,CAAC,CAAC;EACnE,MAAMe,SAAS,GAAGf,KAAK,CAACW,MAAM,GAAG,CAAC;EAClC,MAAMK,MAAM,GAAGhB,KAAK,CAACW,MAAM,GAAG,CAAC;EAE/B5B,SAAS,CAAC,MAAM;IACd,IAAIiC,MAAM,IAAIF,WAAW,EAAE;MACzBZ,QAAQ,CAACM,OAAO,EAAES,WAAW,CAACH,WAAW,CAACI,gBAAgB,IAAI,CAAC,CAAC;IAClE;IAEA,MAAMC,uBAAuB,GAAGhC,WAAW,CAACiC,gBAAgB,CAC1D,mBAAmB,EACnB,MAAM;MACJ,IAAIL,SAAS,EAAE;QACbL,GAAG,CAAC,CAAC;QACL,OAAO,IAAI;MACb;MACA,IAAI,CAACK,SAAS,IAAIf,KAAK,CAACW,MAAM,KAAK,CAAC,EAAE;QACpCT,QAAQ,CAACM,OAAO,EAAEC,KAAK,CAAC,CAAC;QACzB,OAAO,IAAI;MACb;MACA,OAAO,KAAK;IACd,CACF,CAAC;IAED,OAAO,MAAMU,uBAAuB,CAACE,MAAM,CAAC,CAAC;EAC/C,CAAC,EAAE,CAACL,MAAM,EAAED,SAAS,EAAED,WAAW,EAAEJ,GAAG,EAAEV,KAAK,CAAC,CAAC;EAEhD,MAAMsB,YAAY,GAAGjC,QAAQ,CAACkC,IAAI;EAClC,MAAMC,iBAAiB,GAAGlC,MAAM,CAACmC,QAAQ,CAAC,GAAG,CAAC;EAC9C,MAAMC,gBAAgB,GAAGnC,OAAO,CAACkC,QAAQ,CAAC,GAAG,CAAC;EAE9C,MAAME,cAAc,GAAG7C,WAAW,CAC/B8C,KAA+B,iBAC9BjC,IAAA,CAACf,mBAAmB;IAAA,GACdgD,KAAK;IACTC,iBAAiB,EAAE,CAAC,CAAE;IACtBC,KAAK,EAAE,CAACF,KAAK,CAACE,KAAK,EAAE;MAAEC,eAAe,EAAE;IAAkB,CAAC,CAAE;IAC7DC,cAAc,EAAE,CAAE;IAClBC,aAAa,EAAE;EAAQ,CACxB,CACF,EACD,EACF,CAAC;EAED,MAAMC,YAAY,GAAGlD,OAAO,CAAC,OAAO;IAClCoB,IAAI;IACJM,GAAG;IACHG,OAAO;IACPN,KAAK;IACLQ;EACF,CAAC,CAAC,EAAE,CAACX,IAAI,EAAEM,GAAG,EAAEG,OAAO,EAAEN,KAAK,EAAEQ,SAAS,CAAC,CAAC;EAE3C,oBACElB,KAAA,CAACJ,uBAAuB,CAAC0C,QAAQ;IAC/BC,KAAK,EAAEF,YAAa;IAAAnC,QAAA,GAEnBA,QAAQ,eACTJ,IAAA,CAAChB,WAAW;MACV0D,GAAG,EAAEnC,QAAS;MACdoC,KAAK,EAAE,CAAC,CAAE;MACVC,UAAU,EAAEzB,WAAW,EAAEyB,UAAU,IAAI,CAAC,MAAM,CAAE;MAChDC,mBAAmB,EAAE1B,WAAW,EAAE2B,aAAa,IAAI,KAAM;MACzDC,oBAAoB;MACpBC,yBAAyB,EAAC,cAAc;MACxCC,2BAA2B;MAC3BC,oBAAoB,EAAC,SAAS;MAC9BC,gBAAgB,EAAC,YAAY;MAC7BC,OAAO,EAAExC,KAAM;MACfyC,iBAAiB,EAAErB,cAAe;MAClCsB,QAAQ,EAAE9C,GAAI;MACd+C,oBAAoB,EAAE;QAAEnB,eAAe,EAAE;MAAU,CAAE;MACrDD,KAAK,EAAEqB,MAAM,CAACC,cAAe;MAAA,GACzBtC,WAAW,EAAEuC,gBAAgB;MAAAtD,QAAA,EAEhCe,WAAW,iBACVnB,IAAA,CAAC2B,YAAY;QAEXgC,QAAQ,EAAE9B,iBAAkB;QAC5B+B,OAAO,EAAE7B,gBAAiB;QAC1BI,KAAK,EAAEqB,MAAM,CAACK,YAAa;QAAAzD,QAAA,EAE1Be,WAAW,CAAC2C;MAAS,GALjBzD,KAAK,CAACW,MAMC;IACf,CACU,CAAC;EAAA,CACkB,CAAC;AAEvC,CAAC;AAED,MAAMwC,MAAM,GAAG/D,UAAU,CAACsE,MAAM,CAAC;EAC/BN,cAAc,EAAE;IACd;IACA;IACA;EAAA,CACD;EACDI,YAAY,EAAE;IACZG,IAAI,EAAE;EACR;AACF,CAAC,CAAC","ignoreList":[]}
package/lib/typescript/src/components/Skeleton/Shimmer.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Shimmer.d.ts","sourceRoot":"","sources":["../../../../../src/components/Skeleton/Shimmer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAC/D,OAAO,EAGL,SAAS,EACT,cAAc,EACd,SAAS,EAEV,MAAM,cAAc,CAAC;AAgBtB,UAAU,YAAY;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,EAAE,cAAc,CAAC;IACtB,MAAM,EAAE,cAAc,CAAC;IACvB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CA2FnC,CAAC;AAEF,eAAe,OAAO,CAAC"}
1
+ {"version":3,"file":"Shimmer.d.ts","sourceRoot":"","sources":["../../../../../src/components/Skeleton/Shimmer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AACjD,OAAO,EAKL,SAAS,EACT,cAAc,EACd,SAAS,EAEV,MAAM,cAAc,CAAC;AAItB,UAAU,YAAY;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,EAAE,cAAc,CAAC;IACtB,MAAM,EAAE,cAAc,CAAC;IACvB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAuEnC,CAAC;AAEF,eAAe,OAAO,CAAC"}
package/lib/typescript/src/contexts/BottomSheetStackProvider.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheetStackProvider.d.ts","sourceRoot":"","sources":["../../../../src/contexts/BottomSheetStackProvider.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EACZ,SAAS,EAMV,MAAM,OAAO,CAAC;AASf,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,CA2GtE,CAAC"}
1
+ {"version":3,"file":"BottomSheetStackProvider.d.ts","sourceRoot":"","sources":["../../../../src/contexts/BottomSheetStackProvider.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EACZ,SAAS,EAMV,MAAM,OAAO,CAAC;AASf,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,CAmHtE,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "related-ui-components",
3
- "version": "3.0.6",
3
+ "version": "3.0.8",
4
4
  "main": "./src/index.ts",
5
5
  "scripts": {
6
6
  "start": "expo start",
package/src/components/Skeleton/Shimmer.tsx CHANGED
@@ -1,27 +1,17 @@
1
- import React, { useCallback, useEffect, useMemo } from "react";
1
+ import React, { useEffect, useRef } from "react";
2
2
  import {
3
3
  View,
4
4
  StyleSheet,
5
+ Animated,
6
+ Easing,
5
7
  ViewStyle,
6
8
  DimensionValue,
7
9
  StyleProp,
8
10
  I18nManager,
9
11
  } from "react-native";
10
- import Animated, {
11
- useSharedValue,
12
- useAnimatedStyle,
13
- withRepeat,
14
- withSequence,
15
- withTiming,
16
- cancelAnimation,
17
- Easing,
18
- useAnimatedReaction,
19
- } from "react-native-reanimated";
20
12
  import { LinearGradient } from "expo-linear-gradient";
21
13
  import { useTheme } from "../../theme";
22
14
 
23
- const AnimatedLinearGradient = Animated.createAnimatedComponent(LinearGradient);
24
-
25
15
  interface ShimmerProps {
26
16
  children?: React.ReactNode;
27
17
  width: DimensionValue;
@@ -43,58 +33,36 @@ const Shimmer: React.FC<ShimmerProps> = ({
43
33
  }) => {
44
34
  const { theme } = useTheme();
45
35
  const isRTL = I18nManager.isRTL;
36
+ const animatedValue = useRef(new Animated.Value(0)).current;
46
37
 
47
- // Shared animation values (Reanimated)
48
- const containerWidth = useSharedValue(
49
- typeof width === "number" ? width : 400
50
- );
51
- const translateX = useSharedValue(0);
52
- const opacity = useSharedValue(1);
53
-
54
- const shimmerColors = useMemo(
55
- () => [
56
- theme.skeletonBackgroundColor + "00",
57
- shimmerColor || theme.skeletonShimmer,
58
- theme.skeletonBackgroundColor + "00",
59
- ],
60
- [theme, shimmerColor]
61
- );
62
-
63
- // Define easing
64
- const easing = Easing.bezier(0.76, 0, 0.24, 1);
65
-
66
- // Start shimmer animation
67
- const startAnimation = useCallback(() => {
68
- "worklet";
69
- const direction = isRTL ? -1 : 1;
70
-
71
- translateX.value = withRepeat(
72
- withSequence(
73
- withTiming(-containerWidth.value * 1.5 * direction, { duration: 0 }),
74
- withTiming(containerWidth.value * 1.5 * direction, {
75
- duration,
76
- easing,
77
- })
78
- ),
79
- -1
38
+ useEffect(() => {
39
+ const animation = Animated.loop(
40
+ Animated.timing(animatedValue, {
41
+ toValue: 1,
42
+ duration: duration,
43
+ easing: Easing.linear,
44
+ useNativeDriver: true,
45
+ })
80
46
  );
47
+ animation.start();
48
+ return () => animation.stop();
49
+ }, [animatedValue, duration]);
81
50
 
82
- opacity.value = withTiming(1, {
83
- duration: duration / 2,
84
- easing,
85
- });
86
- }, [containerWidth, duration, easing, isRTL]);
51
+ const numericWidth = typeof width === "number" ? width : 400;
87
52
 
88
- useEffect(() => {
89
- startAnimation();
53
+ const ltrOutputRange = [-shimmerWidth, numericWidth + shimmerWidth];
54
+ const rtlOutputRange = [numericWidth + shimmerWidth, -shimmerWidth];
90
55
 
91
- return () => cancelAnimation(translateX);
92
- }, [startAnimation, translateX]);
56
+ const translateX = animatedValue.interpolate({
57
+ inputRange: [0, 1],
58
+ outputRange: isRTL ? rtlOutputRange : ltrOutputRange,
59
+ });
93
60
 
94
- const animatedStyle = useAnimatedStyle(() => ({
95
- opacity: opacity.value,
96
- transform: [{ translateX: translateX.value }],
97
- }));
61
+ const shimmerColors = [
62
+ "rgba(255, 255, 255, 0)",
63
+ shimmerColor || theme.skeletonShimmer,
64
+ "rgba(255, 255, 255, 0)",
65
+ ];
98
66
 
99
67
  return (
100
68
  <View
@@ -109,20 +77,22 @@ const Shimmer: React.FC<ShimmerProps> = ({
109
77
  ]}
110
78
  >
111
79
  {children}
112
-
113
- {/* Shimmer Gradient */}
114
- <AnimatedLinearGradient
115
- colors={shimmerColors as any}
116
- start={{ x: 0, y: 0.5 }}
117
- end={{ x: 1, y: 0.5 }}
118
- style={[
119
- StyleSheet.absoluteFill,
120
- { width: shimmerWidth, zIndex: 1 },
121
- animatedStyle,
122
- ]}
123
- />
80
+ <Animated.View
81
+ style={{
82
+ ...StyleSheet.absoluteFillObject,
83
+ transform: [{ translateX }],
84
+ zIndex: 1,
85
+ }}
86
+ >
87
+ <LinearGradient
88
+ colors={shimmerColors as any}
89
+ style={{ flex: 1, width: shimmerWidth }}
90
+ start={{ x: 0, y: 0.5 }}
91
+ end={{ x: 1, y: 0.5 }}
92
+ />
93
+ </Animated.View>
124
94
  </View>
125
95
  );
126
96
  };
127
97
 
128
- export default Shimmer;
98
+ export default Shimmer;
package/src/contexts/BottomSheetStackProvider.tsx CHANGED
@@ -90,9 +90,17 @@ export const BottomSheetStackProvider: React.FC<{ children: ReactNode }> = ({
90
90
  []
91
91
  );
92
92
 
93
+ const contextValue = useMemo(() => ({
94
+ push,
95
+ pop,
96
+ replace,
97
+ clear,
98
+ canGoBack,
99
+ }), [push, pop, replace, clear, canGoBack]);
100
+
93
101
  return (
94
102
  <BottomSheetStackContext.Provider
95
- value={{ push, pop, replace, clear, canGoBack }}
103
+ value={contextValue}
96
104
  >
97
105
  {children}
98
106
  <BottomSheet