From cca344a3d1cdca3d4e63806a9bd5f7867f8961d4 Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Wed, 9 Oct 2024 21:30:42 +0300
Subject: Allow nested sheets without boilerplate (#5660)

Co-authored-by: Hailey <me@haileyok.com>
---
 modules/bottom-sheet/src/BottomSheetPortal.tsx | 40 ++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 modules/bottom-sheet/src/BottomSheetPortal.tsx

(limited to 'modules/bottom-sheet/src/BottomSheetPortal.tsx')

diff --git a/modules/bottom-sheet/src/BottomSheetPortal.tsx b/modules/bottom-sheet/src/BottomSheetPortal.tsx
new file mode 100644
index 000000000..da14cfa77
--- /dev/null
+++ b/modules/bottom-sheet/src/BottomSheetPortal.tsx
@@ -0,0 +1,40 @@
+import React from 'react'
+
+import {createPortalGroup_INTERNAL} from './lib/Portal'
+
+type PortalContext = React.ElementType<{children: React.ReactNode}>
+
+const Context = React.createContext({} as PortalContext)
+
+export const useBottomSheetPortal_INTERNAL = () => React.useContext(Context)
+
+export function BottomSheetPortalProvider({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  const portal = React.useMemo(() => {
+    return createPortalGroup_INTERNAL()
+  }, [])
+
+  return (
+    <Context.Provider value={portal.Portal}>
+      <portal.Provider>
+        {children}
+        <portal.Outlet />
+      </portal.Provider>
+    </Context.Provider>
+  )
+}
+
+const defaultPortal = createPortalGroup_INTERNAL()
+
+export const BottomSheetOutlet = defaultPortal.Outlet
+
+export function BottomSheetProvider({children}: {children: React.ReactNode}) {
+  return (
+    <Context.Provider value={defaultPortal.Portal}>
+      <defaultPortal.Provider>{children}</defaultPortal.Provider>
+    </Context.Provider>
+  )
+}
-- 
cgit 1.4.1