react-native-resource-calendar 1.0.3 → 1.0.5

package/README.md

@@ -17,6 +17,11 @@ Expo compatibility.
 
 ---
 
+## 🎬 Demo
+https://github.com/user-attachments/assets/48841509-c801-4d77-948b-f108ff57ad34
+
+---
+
 ## 📦 Installation
 
 ```bash
@@ -25,12 +30,39 @@ npm install react-native-resource-calendar
 yarn add react-native-resource-calendar
 ```
 
-## 🚀 Quick Start
+## ⚙️ Peer Dependencies
 
-Follow these steps to get started quickly with **React Native Resource Calendar**.
+This library relies on several React Native ecosystem packages that must be installed in your app.
+If you’re using Expo, run the following to ensure compatible versions:
+
+```bash
+npx expo install \
+react-native-gesture-handler \
+react-native-reanimated \
+react-native-svg \
+@shopify/flash-list \
+@shopify/react-native-skia \
+expo-haptics
+```
+
+If you’re using bare React Native (not Expo), install them manually:
+
+```bash
+npm install \
+react-native-gesture-handler \
+react-native-reanimated \
+react-native-svg \
+@shopify/flash-list \
+@shopify/react-native-skia \
+expo-haptics
+```
 
 ---
 
+## 🚀 Quick Start
+
+Follow these steps to get started quickly with **React Native Resource Calendar**.
+
 ### 1️⃣ Wrap your app with CalendarBindingProvider
 
 ### 2️⃣ Feed the Calendar component with resources and events
@@ -262,6 +294,8 @@ export default function App() {
 }
 ```
 
+---
+
 ## ⚙️ Calendar Props
 
 The `Calendar` component accepts a flexible set of props for customizing layout, theme, and interactivity.
@@ -338,4 +372,4 @@ type CalendarTheme = {
         fontFamily?: string;
     };
 };
-```
+```

package/dist/index.js

@@ -694,7 +694,7 @@ function StaffAvatar({
       width: circleSize,
       backgroundColor: avatarColor || "#C9E5E8",
       overflow: "hidden"
-    } }, image ? /* @__PURE__ */ React18__namespace.createElement(
+    } }, !image ? /* @__PURE__ */ React18__namespace.createElement(
       reactNative.Image,
       {
         resizeMode: "cover",
@@ -712,10 +712,11 @@ function StaffAvatar({
         style: {
           fontFamily: titleFace,
           fontSize,
-          color: textColor || "#4d959c"
+          color: textColor || "#4d959c",
+          lineHeight: circleSize
         }
       },
-      name ? name.split(" ").map((n) => n[0]).join("") : ""
+      name ? name.split(" ").map((n) => n[0]).join("").slice(0, 2) : ""
     ))))
   );
 }
@@ -770,7 +771,16 @@ var EventGridBlocksSkia = ({
   const onTouchesUp = React18__namespace.useCallback(() => {
     setPressedRow(null);
   }, []);
-  const longPressGesture = reactNativeGestureHandler.Gesture.LongPress().onBegin((e) => Animated2.runOnJS(onPressBegin)(Math.floor(e.y / rowHeight))).onEnd((e) => Animated2.runOnJS(onSlotPress)(Math.floor(e.y / rowHeight))).onFinalize(() => Animated2.runOnJS(onTouchesUp)());
+  const longPressGesture = reactNativeGestureHandler.Gesture.LongPress().onBegin((e) => {
+    "worklet";
+    Animated2.runOnJS(onPressBegin)(Math.floor(e.y / rowHeight));
+  }).onEnd((e) => {
+    "worklet";
+    Animated2.runOnJS(onSlotPress)(Math.floor(e.y / rowHeight));
+  }).onFinalize(() => {
+    "worklet";
+    Animated2.runOnJS(onTouchesUp)();
+  });
   return /* @__PURE__ */ React18__namespace.createElement(reactNativeGestureHandler.GestureDetector, { gesture: longPressGesture }, /* @__PURE__ */ React18__namespace.createElement(reactNative.View, null, /* @__PURE__ */ React18__namespace.createElement(reactNativeSkia.Canvas, { style: { width: APPOINTMENT_BLOCK_WIDTH, height: segmentHeight } }, firstRects.map(({ x, y, width: w, height: h, row }, idx) => /* @__PURE__ */ React18__namespace.createElement(React18__namespace.Fragment, { key: idx }, /* @__PURE__ */ React18__namespace.createElement(
     reactNativeSkia.Rect,
     {
@@ -1335,11 +1345,13 @@ var CalendarInner = (props) => {
     Haptics__namespace.impactAsync(Haptics__namespace.ImpactFeedbackStyle.Light);
   }, []);
   const panGesture = reactNativeGestureHandler.Gesture.Pan().manualActivation(!isIOS).enabled(layout !== null).shouldCancelWhenOutside(false).onTouchesMove((_evt, stateManager) => {
+    "worklet";
     if (isIOS) return;
     if (selectedEvent)
       stateManager.activate();
     else stateManager.end();
   }).onUpdate((evt) => {
+    "worklet";
     if (!evt || evt.y == null || evt.x == null) return;
     let draggable = false;
     let pullable = false;
@@ -1428,6 +1440,7 @@ var CalendarInner = (props) => {
       }
     }
   }).onEnd(() => {
+    "worklet";
     autoScrollSpeed.value = 0;
     autoScrollXSpeed.value = 0;
     lastXScrollTime.value = 0;