diff --git a/packages/react/components/Dialog.tsx b/packages/react/components/Dialog/Component.tsx
similarity index 92%
rename from packages/react/components/Dialog.tsx
rename to packages/react/components/Dialog/Component.tsx
index 704db6f..f4bdc36 100644
--- a/packages/react/components/Dialog.tsx
+++ b/packages/react/components/Dialog/Component.tsx
@@ -1,32 +1,13 @@
-import React, { Dispatch, SetStateAction, useState } from "react";
+import React, { useState } from "react";
 import { Slot, VariantProps, vcn } from "@pswui-lib";
 import ReactDOM from "react-dom";
 
-/**
- * =========================
- * DialogContext
- * =========================
- */
-
-interface DialogContext {
-  opened: boolean;
-}
-
-const initialDialogContext: DialogContext = { opened: false };
-const DialogContext = React.createContext<
-  [DialogContext, Dispatch<SetStateAction<DialogContext>>]
->([
+import {
+  DialogContext,
   initialDialogContext,
-  () => {
-    if (process.env.NODE_ENV && process.env.NODE_ENV === "development") {
-      console.warn(
-        "It seems like you're using DialogContext outside of a provider.",
-      );
-    }
-  },
-]);
-
-const useDialogContext = () => React.useContext(DialogContext);
+  useDialogContext,
+  IDialogContext,
+} from "./Context";
 
 /**
  * =========================
@@ -39,7 +20,7 @@ interface DialogRootProps {
 }
 
 const DialogRoot = ({ children }: DialogRootProps) => {
-  const state = useState<DialogContext>(initialDialogContext);
+  const state = useState<IDialogContext>(initialDialogContext);
   return (
     <DialogContext.Provider value={state}>{children}</DialogContext.Provider>
   );
@@ -411,7 +392,6 @@ const DialogFooter = React.forwardRef<HTMLDivElement, DialogFooterProps>(
 );
 
 export {
-  useDialogContext,
   DialogRoot,
   DialogTrigger,
   DialogOverlay,
diff --git a/packages/react/components/Dialog/Context.ts b/packages/react/components/Dialog/Context.ts
new file mode 100644
index 0000000..3b59c7b
--- /dev/null
+++ b/packages/react/components/Dialog/Context.ts
@@ -0,0 +1,27 @@
+import { Dispatch, SetStateAction, useContext, createContext } from "react";
+
+/**
+ * =========================
+ * DialogContext
+ * =========================
+ */
+
+export interface IDialogContext {
+  opened: boolean;
+}
+
+export const initialDialogContext: IDialogContext = { opened: false };
+export const DialogContext = createContext<
+  [IDialogContext, Dispatch<SetStateAction<IDialogContext>>]
+>([
+  initialDialogContext,
+  () => {
+    if (process.env.NODE_ENV && process.env.NODE_ENV === "development") {
+      console.warn(
+        "It seems like you're using DialogContext outside of a provider.",
+      );
+    }
+  },
+]);
+
+export const useDialogContext = () => useContext(DialogContext);
diff --git a/packages/react/components/Dialog/index.ts b/packages/react/components/Dialog/index.ts
new file mode 100644
index 0000000..9202698
--- /dev/null
+++ b/packages/react/components/Dialog/index.ts
@@ -0,0 +1,2 @@
+export * from "./Component";
+export { useDialogContext } from "./Context";