@mustmove/overlay-kit-rn 1.0.0

package/dist/index.mjs

@@ -0,0 +1,821 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+
+// src/context/provider/index.tsx
+import {
+  useCallback as useCallback2,
+  useEffect as useEffect5,
+  useReducer
+} from "react";
+
+// src/context/provider/content-overlay-controller.tsx
+import { memo, useEffect } from "react";
+import { jsx } from "react/jsx-runtime";
+var ContentOverlayController = memo(
+  ({
+    isOpen,
+    overlayId,
+    overlayDispatch,
+    controller: Controller
+  }) => {
+    useEffect(() => {
+      setImmediate(() => {
+        overlayDispatch({ type: "OPEN", overlayId });
+      });
+    }, [overlayDispatch, overlayId]);
+    return /* @__PURE__ */ jsx(
+      Controller,
+      {
+        isOpen,
+        overlayId,
+        close: () => overlayDispatch({ type: "CLOSE", overlayId }),
+        unmount: () => overlayDispatch({ type: "REMOVE", overlayId })
+      }
+    );
+  }
+);
+
+// src/context/provider/bottom-sheet-controller.tsx
+import {
+  memo as memo2,
+  useEffect as useEffect2,
+  useRef,
+  useCallback
+} from "react";
+import BottomSheet, {
+  BottomSheetBackdrop
+} from "@gorhom/bottom-sheet";
+import {
+  StyleSheet
+} from "react-native";
+import { useReducedMotion } from "react-native-reanimated";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var ContentBottomSheetController = memo2(
+  ({
+    isOpen,
+    overlayId,
+    overlayDispatch,
+    controller: Controller,
+    options = {}
+  }) => {
+    console.log("\u{1F680} ~ Controller:", Controller);
+    const bottomSheetRef = useRef(null);
+    const reducedMotion = useReducedMotion();
+    const _a = options, {
+      snapPoints = ["50%", "90%"],
+      enablePanDownToClose = true,
+      enableBackdrop = true,
+      backdropOpacity = 0.5,
+      enableDynamicSizing = true,
+      backgroundStyle = {},
+      handleStyle = {}
+    } = _a, restOptions = __objRest(_a, [
+      "snapPoints",
+      "enablePanDownToClose",
+      "enableBackdrop",
+      "backdropOpacity",
+      "enableDynamicSizing",
+      "backgroundStyle",
+      "handleStyle"
+    ]);
+    useEffect2(() => {
+      var _a2;
+      if (isOpen) {
+        const rafId = requestAnimationFrame(() => {
+          var _a3;
+          (_a3 = bottomSheetRef.current) == null ? void 0 : _a3.expand();
+          overlayDispatch({ type: "OPEN", overlayId });
+        });
+        return () => cancelAnimationFrame(rafId);
+      } else {
+        (_a2 = bottomSheetRef.current) == null ? void 0 : _a2.close();
+      }
+    }, [isOpen, overlayDispatch, overlayId]);
+    const handleClose = useCallback(() => {
+      overlayDispatch({ type: "CLOSE", overlayId });
+    }, [overlayDispatch, overlayId]);
+    const renderBackdrop = useCallback(
+      (props) => /* @__PURE__ */ jsx2(
+        BottomSheetBackdrop,
+        __spreadProps(__spreadValues({}, props), {
+          appearsOnIndex: 0,
+          disappearsOnIndex: -1,
+          opacity: backdropOpacity,
+          pressBehavior: "close"
+        })
+      ),
+      [backdropOpacity]
+    );
+    if (!isOpen) return null;
+    return /* @__PURE__ */ jsx2(
+      BottomSheet,
+      {
+        ref: bottomSheetRef,
+        android_keyboardInputMode: "adjustResize",
+        keyboardBehavior: "extend",
+        snapPoints: enableDynamicSizing ? void 0 : snapPoints,
+        enablePanDownToClose,
+        onClose: handleClose,
+        index: 0,
+        backdropComponent: enableBackdrop ? renderBackdrop : void 0,
+        backgroundStyle: [
+          {
+            borderTopLeftRadius: 16,
+            borderTopRightRadius: 16
+          },
+          backgroundStyle
+        ],
+        handleStyle: [
+          {
+            backgroundColor: "transparent",
+            borderTopLeftRadius: 16,
+            borderTopRightRadius: 16
+          },
+          handleStyle
+        ],
+        enableDynamicSizing,
+        animateOnMount: !reducedMotion,
+        children: /* @__PURE__ */ jsx2(
+          Controller,
+          __spreadValues({
+            isOpen,
+            overlayId,
+            snapPoints,
+            enablePanDownToClose,
+            close: () => overlayDispatch({ type: "CLOSE", overlayId }),
+            unmount: () => overlayDispatch({ type: "REMOVE", overlayId })
+          }, restOptions)
+        )
+      }
+    );
+  }
+);
+var styles = StyleSheet.create({
+  contentContainer: {
+    flex: 1
+  }
+});
+
+// src/context/provider/modal-controller.tsx
+import { memo as memo3, useEffect as useEffect3, useState } from "react";
+import {
+  Modal,
+  TouchableWithoutFeedback,
+  Animated,
+  StyleSheet as StyleSheet2,
+  Dimensions
+} from "react-native";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var { width: SCREEN_WIDTH, height: SCREEN_HEIGHT } = Dimensions.get("window");
+var ContentModalController = memo3(
+  ({
+    isOpen,
+    overlayId,
+    overlayDispatch,
+    controller: Controller,
+    options = {}
+  }) => {
+    const {
+      modalType = "center",
+      backdropOpacity = 0.5,
+      animationType = "fade",
+      swipeDirection
+    } = options;
+    const [backdropAnimation] = useState(new Animated.Value(0));
+    const [contentAnimation] = useState(new Animated.Value(0));
+    useEffect3(() => {
+      if (isOpen) {
+        setImmediate(() => {
+          overlayDispatch({ type: "OPEN", overlayId });
+        });
+        Animated.parallel([
+          Animated.timing(backdropAnimation, {
+            toValue: 1,
+            duration: 300,
+            useNativeDriver: true
+          }),
+          Animated.timing(contentAnimation, {
+            toValue: 1,
+            duration: 300,
+            useNativeDriver: true
+          })
+        ]).start();
+      } else {
+        Animated.parallel([
+          Animated.timing(backdropAnimation, {
+            toValue: 0,
+            duration: 200,
+            useNativeDriver: true
+          }),
+          Animated.timing(contentAnimation, {
+            toValue: 0,
+            duration: 200,
+            useNativeDriver: true
+          })
+        ]).start();
+      }
+    }, [
+      isOpen,
+      overlayDispatch,
+      overlayId,
+      backdropAnimation,
+      contentAnimation
+    ]);
+    const handleClose = () => {
+      overlayDispatch({ type: "CLOSE", overlayId });
+    };
+    const getContainerStyle = () => {
+      switch (modalType) {
+        case "bottom":
+          return styles2.bottomContainer;
+        case "top":
+          return styles2.topContainer;
+        case "left":
+          return styles2.leftContainer;
+        case "right":
+          return styles2.rightContainer;
+        default:
+          return styles2.centerContainer;
+      }
+    };
+    const getContentAnimationStyle = () => {
+      const baseOpacity = {
+        opacity: contentAnimation
+      };
+      switch (modalType) {
+        case "bottom":
+          return __spreadProps(__spreadValues({}, baseOpacity), {
+            transform: [
+              {
+                translateY: contentAnimation.interpolate({
+                  inputRange: [0, 1],
+                  outputRange: [SCREEN_HEIGHT, 0]
+                })
+              }
+            ]
+          });
+        case "top":
+          return __spreadProps(__spreadValues({}, baseOpacity), {
+            transform: [
+              {
+                translateY: contentAnimation.interpolate({
+                  inputRange: [0, 1],
+                  outputRange: [-SCREEN_HEIGHT, 0]
+                })
+              }
+            ]
+          });
+        case "left":
+          return __spreadProps(__spreadValues({}, baseOpacity), {
+            transform: [
+              {
+                translateX: contentAnimation.interpolate({
+                  inputRange: [0, 1],
+                  outputRange: [-SCREEN_WIDTH, 0]
+                })
+              }
+            ]
+          });
+        case "right":
+          return __spreadProps(__spreadValues({}, baseOpacity), {
+            transform: [
+              {
+                translateX: contentAnimation.interpolate({
+                  inputRange: [0, 1],
+                  outputRange: [SCREEN_WIDTH, 0]
+                })
+              }
+            ]
+          });
+        default:
+          if (animationType === "slide") {
+            return __spreadProps(__spreadValues({}, baseOpacity), {
+              transform: [
+                {
+                  scale: contentAnimation.interpolate({
+                    inputRange: [0, 1],
+                    outputRange: [0.8, 1]
+                  })
+                }
+              ]
+            });
+          }
+          return baseOpacity;
+      }
+    };
+    if (!isOpen) return null;
+    return /* @__PURE__ */ jsx3(
+      Modal,
+      {
+        visible: isOpen,
+        transparent: true,
+        animationType: "none",
+        onRequestClose: handleClose,
+        statusBarTranslucent: true,
+        presentationStyle: "overFullScreen",
+        children: /* @__PURE__ */ jsx3(TouchableWithoutFeedback, { onPress: handleClose, children: /* @__PURE__ */ jsx3(
+          Animated.View,
+          {
+            style: [
+              styles2.backdrop,
+              {
+                backgroundColor: `rgba(0, 0, 0, ${backdropOpacity})`,
+                opacity: backdropAnimation
+              }
+            ],
+            children: /* @__PURE__ */ jsx3(TouchableWithoutFeedback, { children: /* @__PURE__ */ jsx3(
+              Animated.View,
+              {
+                style: [getContainerStyle(), getContentAnimationStyle()],
+                children: /* @__PURE__ */ jsx3(
+                  Controller,
+                  {
+                    isOpen,
+                    overlayId,
+                    modalType,
+                    backdropOpacity,
+                    animationType,
+                    swipeDirection,
+                    close: () => overlayDispatch({ type: "CLOSE", overlayId }),
+                    unmount: () => overlayDispatch({ type: "REMOVE", overlayId })
+                  }
+                )
+              }
+            ) })
+          }
+        ) })
+      }
+    );
+  }
+);
+var styles2 = StyleSheet2.create({
+  backdrop: {
+    flex: 1,
+    backgroundColor: "rgba(0, 0, 0, 0.5)"
+  },
+  centerContainer: {
+    flex: 1,
+    justifyContent: "center",
+    alignItems: "center",
+    paddingHorizontal: 20
+  },
+  bottomContainer: {
+    flex: 1,
+    justifyContent: "flex-end"
+  },
+  topContainer: {
+    flex: 1,
+    justifyContent: "flex-start"
+  },
+  leftContainer: {
+    flex: 1,
+    justifyContent: "center",
+    alignItems: "flex-start"
+  },
+  rightContainer: {
+    flex: 1,
+    justifyContent: "center",
+    alignItems: "flex-end"
+  }
+});
+
+// src/utils/create-use-external-events.ts
+import { useEffect as useEffect4 } from "react";
+
+// src/utils/emitter.ts
+function createEmitter(all) {
+  all = all || /* @__PURE__ */ new Map();
+  return {
+    all,
+    on(type, handler) {
+      const handlers = all.get(type);
+      if (handlers) {
+        handlers.push(handler);
+      } else {
+        all.set(type, [handler]);
+      }
+    },
+    off(type, handler) {
+      const handlers = all.get(type);
+      if (handlers) {
+        if (handler) {
+          handlers.splice(handlers.indexOf(handler) >>> 0, 1);
+        } else {
+          all.set(type, []);
+        }
+      }
+    },
+    emit(type, evt) {
+      let handlers = all.get(type);
+      if (handlers) {
+        handlers.slice().forEach((handler) => {
+          handler(evt);
+        });
+      }
+      handlers = all.get("*");
+      if (handlers) {
+        handlers.slice().forEach((handler) => {
+          handler(type, evt);
+        });
+      }
+    }
+  };
+}
+
+// src/utils/create-use-external-events.ts
+var emitter = createEmitter();
+function useClientEffect(...args) {
+  useEffect4(...args);
+}
+function dispatchEvent(type, detail) {
+  emitter.emit(type, detail);
+}
+function createUseExternalEvents(prefix) {
+  function useExternalEvents(events) {
+    const handlers = Object.keys(events).reduce(
+      (prev, eventKey) => {
+        const currentEventKeys = `${prefix}:${eventKey}`;
+        return __spreadProps(__spreadValues({}, prev), {
+          [currentEventKeys]: function(event) {
+            events[eventKey](event);
+          }
+        });
+      },
+      {}
+    );
+    useClientEffect(() => {
+      Object.keys(handlers).forEach((eventKey) => {
+        emitter.off(eventKey, handlers[eventKey]);
+        emitter.on(eventKey, handlers[eventKey]);
+      });
+      return () => Object.keys(handlers).forEach((eventKey) => {
+        emitter.off(eventKey, handlers[eventKey]);
+      });
+    }, [handlers]);
+  }
+  function createEvent(event) {
+    return (...payload) => dispatchEvent(`${prefix}:${String(event)}`, payload[0]);
+  }
+  return [useExternalEvents, createEvent];
+}
+
+// src/utils/random-id.ts
+function randomId() {
+  return `overlay-kit-${Math.random().toString(36).slice(2, 11)}`;
+}
+
+// src/event.ts
+function createOverlay(overlayId) {
+  const [useOverlayEvent, createEvent] = createUseExternalEvents(
+    `${overlayId}/overlay-kit`
+  );
+  const open = (controller, options) => {
+    var _a, _b;
+    const overlayId2 = (_a = options == null ? void 0 : options.overlayId) != null ? _a : randomId();
+    const componentKey = randomId();
+    const overlayType = (_b = options == null ? void 0 : options.overlayType) != null ? _b : "overlay";
+    const dispatchOpenEvent = createEvent("open");
+    const _c = options || {}, { overlayId: _, overlayType: __ } = _c, restOptions = __objRest(_c, ["overlayId", "overlayType"]);
+    dispatchOpenEvent({
+      controller,
+      overlayId: overlayId2,
+      componentKey,
+      overlayType,
+      options: restOptions
+    });
+    return overlayId2;
+  };
+  const openAsync = async (controller, options) => {
+    return new Promise((resolve) => {
+      const wrappedController = (overlayProps, ...deprecatedLegacyContext) => {
+        const close2 = (param) => {
+          resolve(param);
+          overlayProps.close();
+        };
+        const unmount2 = (param) => {
+          resolve(param);
+          overlayProps.unmount();
+        };
+        const props = __spreadProps(__spreadValues({}, overlayProps), { close: close2, unmount: unmount2 });
+        return controller(props);
+      };
+      open(wrappedController, options);
+    });
+  };
+  const close = createEvent("close");
+  const unmount = createEvent("unmount");
+  const closeAll = createEvent("closeAll");
+  const unmountAll = createEvent("unmountAll");
+  return {
+    open,
+    openAsync,
+    close,
+    unmount,
+    closeAll,
+    unmountAll,
+    useOverlayEvent
+  };
+}
+
+// src/utils/create-safe-context.ts
+import { createContext, useContext } from "react";
+var NullSymbol = Symbol("Null");
+function createSafeContext(displayName) {
+  const Context = createContext(NullSymbol);
+  Context.displayName = displayName != null ? displayName : "SafeContext";
+  function useSafeContext() {
+    const context = useContext(Context);
+    if (context === NullSymbol) {
+      const error = new Error(`[${Context.displayName}]: Provider not found.`);
+      error.name = "[Error] Context";
+      throw error;
+    }
+    return context;
+  }
+  return [Context.Provider, useSafeContext];
+}
+
+// src/context/context.ts
+function createOverlaySafeContext() {
+  const [OverlayContextProvider, useOverlayContext] = createSafeContext("overlay-kit/OverlayContext");
+  function useCurrentOverlay2() {
+    return useOverlayContext().current;
+  }
+  function useOverlayData2() {
+    return useOverlayContext().overlayData;
+  }
+  return { OverlayContextProvider, useCurrentOverlay: useCurrentOverlay2, useOverlayData: useOverlayData2 };
+}
+
+// src/context/reducer.ts
+var determineCurrentOverlayId = (overlayOrderList, overlayData, targetOverlayId) => {
+  var _a, _b;
+  const openedOverlayOrderList = overlayOrderList.filter(
+    (orderedOverlayId) => overlayData[orderedOverlayId].isOpen === true
+  );
+  const targetIndexInOpenedList = openedOverlayOrderList.findIndex((item) => item === targetOverlayId);
+  return targetIndexInOpenedList === openedOverlayOrderList.length - 1 ? (_a = openedOverlayOrderList[targetIndexInOpenedList - 1]) != null ? _a : null : (_b = openedOverlayOrderList[openedOverlayOrderList.length - 1]) != null ? _b : null;
+};
+function overlayReducer(state, action) {
+  switch (action.type) {
+    case "ADD": {
+      if (state.overlayData[action.overlay.id] != null && state.overlayData[action.overlay.id].isOpen === false) {
+        const overlay2 = state.overlayData[action.overlay.id];
+        if (overlay2 == null || overlay2.isOpen) {
+          return state;
+        }
+        return __spreadProps(__spreadValues({}, state), {
+          current: action.overlay.id,
+          overlayData: __spreadProps(__spreadValues({}, state.overlayData), {
+            [action.overlay.id]: __spreadProps(__spreadValues({}, overlay2), { isOpen: true })
+          })
+        });
+      }
+      const isExisted = state.overlayOrderList.includes(action.overlay.id);
+      if (isExisted && state.overlayData[action.overlay.id].isOpen === true) {
+        throw new Error(
+          `You can't open the multiple overlays with the same overlayId(${action.overlay.id}). Please set a different id.`
+        );
+      }
+      return {
+        current: action.overlay.id,
+        /**
+         * @description Brings the overlay to the front when reopened after closing without unmounting.
+         */
+        overlayOrderList: [...state.overlayOrderList.filter((item) => item !== action.overlay.id), action.overlay.id],
+        overlayData: isExisted ? state.overlayData : __spreadProps(__spreadValues({}, state.overlayData), {
+          [action.overlay.id]: action.overlay
+        })
+      };
+    }
+    case "OPEN": {
+      const overlay2 = state.overlayData[action.overlayId];
+      if (overlay2 == null || overlay2.isOpen) {
+        return state;
+      }
+      return __spreadProps(__spreadValues({}, state), {
+        overlayData: __spreadProps(__spreadValues({}, state.overlayData), {
+          [action.overlayId]: __spreadProps(__spreadValues({}, overlay2), { isOpen: true, isMounted: true })
+        })
+      });
+    }
+    case "CLOSE": {
+      const overlay2 = state.overlayData[action.overlayId];
+      if (overlay2 == null || !overlay2.isOpen) {
+        return state;
+      }
+      const currentOverlayId = determineCurrentOverlayId(state.overlayOrderList, state.overlayData, action.overlayId);
+      return __spreadProps(__spreadValues({}, state), {
+        current: currentOverlayId,
+        overlayData: __spreadProps(__spreadValues({}, state.overlayData), {
+          [action.overlayId]: __spreadProps(__spreadValues({}, state.overlayData[action.overlayId]), {
+            isOpen: false
+          })
+        })
+      });
+    }
+    case "REMOVE": {
+      const overlay2 = state.overlayData[action.overlayId];
+      if (overlay2 == null) {
+        return state;
+      }
+      const remainingOverlays = state.overlayOrderList.filter((item) => item !== action.overlayId);
+      if (state.overlayOrderList.length === remainingOverlays.length) {
+        return state;
+      }
+      const copiedOverlayData = __spreadValues({}, state.overlayData);
+      delete copiedOverlayData[action.overlayId];
+      const currentOverlayId = determineCurrentOverlayId(state.overlayOrderList, state.overlayData, action.overlayId);
+      return {
+        current: currentOverlayId,
+        overlayOrderList: remainingOverlays,
+        overlayData: copiedOverlayData
+      };
+    }
+    case "CLOSE_ALL": {
+      if (Object.keys(state.overlayData).length === 0) {
+        return state;
+      }
+      return __spreadProps(__spreadValues({}, state), {
+        current: null,
+        overlayData: Object.keys(state.overlayData).reduce(
+          (prev, curr) => __spreadProps(__spreadValues({}, prev), {
+            [curr]: __spreadProps(__spreadValues({}, state.overlayData[curr]), {
+              isOpen: false
+            })
+          }),
+          {}
+        )
+      });
+    }
+    case "REMOVE_ALL": {
+      return { current: null, overlayOrderList: [], overlayData: {} };
+    }
+  }
+}
+
+// src/context/provider/index.tsx
+import { GestureHandlerRootView } from "react-native-gesture-handler";
+import { BottomSheetModalProvider as BottomSheetModalProvider2 } from "@gorhom/bottom-sheet";
+import { jsx as jsx4, jsxs } from "react/jsx-runtime";
+function createOverlayProvider() {
+  const overlayId = randomId();
+  const _a = createOverlay(overlayId), { useOverlayEvent } = _a, overlay2 = __objRest(_a, ["useOverlayEvent"]);
+  const { OverlayContextProvider, useCurrentOverlay: useCurrentOverlay2, useOverlayData: useOverlayData2 } = createOverlaySafeContext();
+  function OverlayProvider2({ children }) {
+    const [overlayState, overlayDispatch] = useReducer(overlayReducer, {
+      current: null,
+      overlayOrderList: [],
+      overlayData: {}
+    });
+    const overlayOpen = useCallback2(
+      ({
+        controller,
+        overlayId: overlayId2,
+        componentKey,
+        overlayType = "overlay",
+        options
+      }) => {
+        overlayDispatch({
+          type: "ADD",
+          overlay: {
+            id: overlayId2,
+            componentKey,
+            isOpen: true,
+            isMounted: true,
+            controller,
+            overlayType,
+            options
+          }
+        });
+      },
+      []
+    );
+    const close = useCallback2((overlayId2) => {
+      overlayDispatch({ type: "CLOSE", overlayId: overlayId2 });
+    }, []);
+    const unmount = useCallback2((overlayId2) => {
+      overlayDispatch({ type: "REMOVE", overlayId: overlayId2 });
+    }, []);
+    const closeAll = useCallback2(() => {
+      overlayDispatch({ type: "CLOSE_ALL" });
+    }, []);
+    const unmountAll = useCallback2(() => {
+      overlayDispatch({ type: "REMOVE_ALL" });
+    }, []);
+    useOverlayEvent({
+      open: overlayOpen,
+      close,
+      unmount,
+      closeAll,
+      unmountAll
+    });
+    useEffect5(() => {
+      return () => {
+        overlayDispatch({ type: "REMOVE_ALL" });
+      };
+    }, []);
+    return /* @__PURE__ */ jsx4(GestureHandlerRootView, { style: { flex: 1 }, children: /* @__PURE__ */ jsx4(BottomSheetModalProvider2, { children: /* @__PURE__ */ jsxs(OverlayContextProvider, { value: overlayState, children: [
+      children,
+      overlayState.overlayOrderList.map((item) => {
+        const overlayItem = overlayState.overlayData[item];
+        const {
+          id: currentOverlayId,
+          componentKey,
+          isOpen,
+          controller: Controller,
+          overlayType,
+          options
+        } = overlayItem;
+        if (overlayType === "bottomSheet") {
+          return /* @__PURE__ */ jsx4(
+            ContentBottomSheetController,
+            {
+              isOpen,
+              controller: Controller,
+              overlayId: currentOverlayId,
+              overlayDispatch,
+              options
+            },
+            componentKey
+          );
+        } else if (overlayType === "modal") {
+          const isCurrentModal = overlayState.current === currentOverlayId;
+          const shouldShow = isOpen && isCurrentModal;
+          return /* @__PURE__ */ jsx4(
+            ContentModalController,
+            {
+              isOpen: shouldShow,
+              controller: Controller,
+              overlayId: currentOverlayId,
+              overlayDispatch,
+              options
+            },
+            componentKey
+          );
+        } else {
+          return /* @__PURE__ */ jsx4(
+            ContentOverlayController,
+            {
+              isOpen,
+              controller: Controller,
+              overlayId: currentOverlayId,
+              overlayDispatch
+            },
+            componentKey
+          );
+        }
+      })
+    ] }) }) });
+  }
+  return {
+    overlay: overlay2,
+    OverlayProvider: OverlayProvider2,
+    useCurrentOverlay: useCurrentOverlay2,
+    useOverlayData: useOverlayData2
+  };
+}
+
+// src/utils/create-overlay-context.tsx
+var { overlay, OverlayProvider, useCurrentOverlay, useOverlayData } = createOverlayProvider();
+function experimental_createOverlayContext() {
+  return createOverlayProvider();
+}
+export {
+  OverlayProvider,
+  createUseExternalEvents,
+  experimental_createOverlayContext,
+  overlay,
+  useCurrentOverlay,
+  useOverlayData
+};
+//# sourceMappingURL=index.mjs.map