@comergehq/studio 0.1.4 → 0.1.6

package/dist/index.js

@@ -218,7 +218,7 @@ var React = __toESM(require("react"));
 var import_axios = __toESM(require("axios"));
 
 // src/core/services/http/baseUrl.ts
-var BASE_URL = "http://192.168.8.175:8080";
+var BASE_URL = "https://comerge.ai";
 
 // src/core/services/http/public.ts
 var CLIENT_KEY_HEADER = "x-comerge-api-key";
@@ -1740,6 +1740,16 @@ function StudioBottomSheet({
   const insets = (0, import_react_native_safe_area_context.useSafeAreaInsets)();
   const internalSheetRef = React8.useRef(null);
   const resolvedSheetRef = sheetRef ?? internalSheetRef;
+  React8.useEffect(() => {
+    if (import_react_native6.Platform.OS !== "ios") return;
+    const sub = import_react_native6.Keyboard.addListener("keyboardDidHide", () => {
+      const sheet = resolvedSheetRef.current;
+      if (!sheet || !open) return;
+      const targetIndex = snapPoints.length - 1;
+      setTimeout(() => sheet.snapToIndex(targetIndex), 10);
+    });
+    return () => sub.remove();
+  }, [open, resolvedSheetRef, snapPoints.length]);
   React8.useEffect(() => {
     const sheet = resolvedSheetRef.current;
     if (!sheet) return;
@@ -1762,12 +1772,12 @@ function StudioBottomSheet({
       index: open ? snapPoints.length - 1 : -1,
       snapPoints,
       enablePanDownToClose: true,
-      keyboardBehavior: "extend",
+      keyboardBehavior: import_react_native6.Platform.OS === "ios" ? "interactive" : "extend",
       keyboardBlurBehavior: "restore",
       android_keyboardInputMode: "adjustResize",
       backgroundComponent: (props) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(StudioSheetBackground, { ...props, renderBackground: background == null ? void 0 : background.renderBackground }),
       topInset: insets.top,
-      bottomInset: insets.bottom,
+      bottomInset: 0,
       handleIndicatorStyle: { backgroundColor: theme.colors.handleIndicator },
       onChange: handleChange,
       ...bottomSheetProps,
@@ -5408,6 +5418,8 @@ var import_react_native48 = require("react-native");
 // src/components/chat/ChatPage.tsx
 var React33 = __toESM(require("react"));
 var import_react_native44 = require("react-native");
+var import_react_native_safe_area_context4 = require("react-native-safe-area-context");
+var import_react_native_reanimated2 = __toESM(require("react-native-reanimated"));
 
 // src/components/chat/ChatMessageList.tsx
 var React32 = __toESM(require("react"));
@@ -5599,7 +5611,34 @@ function ChatPage({
   listRef
 }) {
   const theme = useTheme();
+  const insets = (0, import_react_native_safe_area_context4.useSafeAreaInsets)();
   const [composerHeight, setComposerHeight] = React33.useState(0);
+  const [keyboardVisible, setKeyboardVisible] = React33.useState(false);
+  const animatedKeyboard = (0, import_react_native_reanimated2.useAnimatedKeyboard)();
+  React33.useEffect(() => {
+    if (import_react_native44.Platform.OS !== "ios") return;
+    const show = import_react_native44.Keyboard.addListener("keyboardWillShow", () => setKeyboardVisible(true));
+    const hide = import_react_native44.Keyboard.addListener("keyboardWillHide", () => setKeyboardVisible(false));
+    return () => {
+      show.remove();
+      hide.remove();
+    };
+  }, []);
+  const footerBottomPadding = import_react_native44.Platform.OS === "ios" ? keyboardVisible ? 0 : insets.bottom : insets.bottom + 10;
+  const footerAnimatedStyle = (0, import_react_native_reanimated2.useAnimatedStyle)(() => {
+    if (import_react_native44.Platform.OS !== "ios") return { paddingBottom: insets.bottom + 10 };
+    return { paddingBottom: animatedKeyboard.height.value > 0 ? 0 : insets.bottom };
+  });
+  const overlayBottom = composerHeight + footerBottomPadding + theme.spacing.lg;
+  const resolvedOverlay = React33.useMemo(() => {
+    var _a;
+    if (!overlay) return null;
+    if (!React33.isValidElement(overlay)) return overlay;
+    const prevStyle = (_a = overlay.props) == null ? void 0 : _a.style;
+    return React33.cloneElement(overlay, {
+      style: [prevStyle, { bottom: overlayBottom }]
+    });
+  }, [overlay, overlayBottom]);
   return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_react_native44.View, { style: [{ flex: 1 }, style], children: [
     header ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react_native44.View, { children: header }) : null,
     topBanner ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react_native44.View, { style: { paddingHorizontal: theme.spacing.lg, paddingTop: theme.spacing.sm }, children: topBanner }) : null,
@@ -5612,42 +5651,58 @@ function ChatPage({
           showTypingIndicator,
           renderMessageContent,
           onNearBottomChange,
-          contentStyle: { paddingBottom: theme.spacing.xl + composerHeight }
+          contentStyle: { paddingBottom: theme.spacing.xl + composerHeight + footerBottomPadding }
         }
       ),
-      overlay
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
-      ChatComposer,
-      {
-        ...composer,
-        attachments: composer.attachments ?? [],
-        onLayout: ({ height }) => setComposerHeight(height)
-      }
-    )
+      resolvedOverlay,
+      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+        import_react_native_reanimated2.default.View,
+        {
+          style: [
+            {
+              position: "absolute",
+              left: 0,
+              right: 0,
+              bottom: 0,
+              paddingHorizontal: theme.spacing.lg,
+              paddingTop: theme.spacing.sm
+            },
+            footerAnimatedStyle
+          ],
+          children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
+            ChatComposer,
+            {
+              ...composer,
+              attachments: composer.attachments ?? [],
+              onLayout: ({ height }) => setComposerHeight(height)
+            }
+          )
+        }
+      )
+    ] })
   ] });
 }
 
 // src/components/chat/ScrollToBottomButton.tsx
 var React34 = __toESM(require("react"));
 var import_react_native45 = require("react-native");
-var import_react_native_reanimated2 = __toESM(require("react-native-reanimated"));
+var import_react_native_reanimated3 = __toESM(require("react-native-reanimated"));
 var import_jsx_runtime48 = require("react/jsx-runtime");
 function ScrollToBottomButton({ visible, onPress, children, style }) {
   const theme = useTheme();
-  const progress = (0, import_react_native_reanimated2.useSharedValue)(visible ? 1 : 0);
+  const progress = (0, import_react_native_reanimated3.useSharedValue)(visible ? 1 : 0);
   const [pressed, setPressed] = React34.useState(false);
   React34.useEffect(() => {
-    progress.value = (0, import_react_native_reanimated2.withTiming)(visible ? 1 : 0, { duration: 200, easing: import_react_native_reanimated2.Easing.out(import_react_native_reanimated2.Easing.ease) });
+    progress.value = (0, import_react_native_reanimated3.withTiming)(visible ? 1 : 0, { duration: 200, easing: import_react_native_reanimated3.Easing.out(import_react_native_reanimated3.Easing.ease) });
   }, [progress, visible]);
-  const animStyle = (0, import_react_native_reanimated2.useAnimatedStyle)(() => ({
+  const animStyle = (0, import_react_native_reanimated3.useAnimatedStyle)(() => ({
     opacity: progress.value,
     transform: [{ translateY: (1 - progress.value) * 20 }]
   }));
   const bg = theme.scheme === "dark" ? "rgba(39,39,42,0.9)" : "rgba(244,244,245,0.95)";
   const border = theme.scheme === "dark" ? withAlpha("#FFFFFF", 0.12) : withAlpha("#000000", 0.08);
   return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
-    import_react_native_reanimated2.default.View,
+    import_react_native_reanimated3.default.View,
     {
       pointerEvents: visible ? "auto" : "none",
       style: [
@@ -6132,8 +6187,22 @@ function StudioOverlay({
     openSheet();
   }, [openSheet]);
   const backToPreview = React37.useCallback(() => {
+    if (import_react_native51.Platform.OS !== "ios") {
+      import_react_native51.Keyboard.dismiss();
+      setActivePage("preview");
+      return;
+    }
+    let done = false;
+    const finalize = () => {
+      if (done) return;
+      done = true;
+      sub.remove();
+      clearTimeout(t);
+      setActivePage("preview");
+    };
+    const sub = import_react_native51.Keyboard.addListener("keyboardDidHide", finalize);
+    const t = setTimeout(finalize, 350);
     import_react_native51.Keyboard.dismiss();
-    setActivePage("preview");
   }, []);
   const startDraw = React37.useCallback(() => {
     setDrawing(true);