diff --git a/packages/react/lib/index.ts b/packages/react/lib/index.ts
index a507740..47c4881 100644
--- a/packages/react/lib/index.ts
+++ b/packages/react/lib/index.ts
@@ -1,3 +1,4 @@
 export * from "./vcn";
 export * from "./Slot";
 export * from "./ssrFallback";
+export * from "./withSSD";
diff --git a/packages/react/lib/withSSD.tsx b/packages/react/lib/withSSD.tsx
new file mode 100644
index 0000000..0cc71ee
--- /dev/null
+++ b/packages/react/lib/withSSD.tsx
@@ -0,0 +1,16 @@
+import type { ComponentType } from "react";
+import { ServerSideDocumentFallback } from "./ssrFallback";
+
+function withServerSideDocument<P extends {}>(
+  Component: ComponentType<P>,
+): ComponentType<P> {
+  return (props) => {
+    return (
+      <ServerSideDocumentFallback>
+        <Component {...props} />
+      </ServerSideDocumentFallback>
+    );
+  };
+}
+
+export { withServerSideDocument };
diff --git a/registry.json b/registry.json
index 2ede696..6dd37ba 100644
--- a/registry.json
+++ b/registry.json
@@ -4,7 +4,7 @@
     "components": "/packages/react/components/{componentName}",
     "lib": "/packages/react/lib/{libName}"
   },
-  "lib": ["index.ts", "Slot.tsx", "vcn.ts", "ssrFallback.tsx"],
+  "lib": ["index.ts", "Slot.tsx", "vcn.ts", "ssrFallback.tsx", "withSSD.tsx"],
   "components": {
     "button": { "type": "file", "name": "Button.tsx" },
     "checkbox": { "type": "file", "name": "Checkbox.tsx" },