RSC compatibility and more SSR tests

radix-ui · Jun 3, 2024 · 1d07a66 · 1d07a66
1 parent 107dd05
commit 1d07a66
Show file tree

Hide file tree

Showing 106 changed files with 624 additions and 261 deletions.
diff --git a/.yarn/versions/60c2f256.yml b/.yarn/versions/60c2f256.yml
@@ -59,3 +59,4 @@ releases:
 
 declined:
   - primitives
+  - ssr-testing
diff --git a/packages/react/accordion/src/index.ts b/packages/react/accordion/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createAccordionScope,
   //

diff --git a/packages/react/alert-dialog/package.json b/packages/react/alert-dialog/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-alert-dialog",
-  "version": "1.0.6-rc.6",
+  "version": "1.0.6-rc.5",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/alert-dialog/src/index.ts b/packages/react/alert-dialog/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createAlertDialogScope,
   //

diff --git a/packages/react/announce/src/index.ts b/packages/react/announce/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   Announce,
   //

diff --git a/packages/react/avatar/src/index.ts b/packages/react/avatar/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createAvatarScope,
   //

diff --git a/packages/react/checkbox/src/index.ts b/packages/react/checkbox/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createCheckboxScope,
   //

diff --git a/packages/react/collapsible/src/index.ts b/packages/react/collapsible/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createCollapsibleScope,
   //

diff --git a/packages/react/collection/src/index.ts b/packages/react/collection/src/index.ts
@@ -1,2 +1,3 @@
+'use client';
 export { createCollection } from './Collection';
 export type { CollectionProps } from './Collection';
diff --git a/packages/react/context-menu/package.json b/packages/react/context-menu/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-context-menu",
-  "version": "2.1.6-rc.11",
+  "version": "2.1.6-rc.10",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/context-menu/src/index.ts b/packages/react/context-menu/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createContextMenuScope,
   //

diff --git a/packages/react/dialog/package.json b/packages/react/dialog/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-dialog",
-  "version": "1.0.6-rc.6",
+  "version": "1.0.6-rc.5",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/dialog/src/index.ts b/packages/react/dialog/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createDialogScope,
   //

diff --git a/packages/react/dismissable-layer/package.json b/packages/react/dismissable-layer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-dismissable-layer",
-  "version": "1.0.6-rc.6",
+  "version": "1.0.6-rc.5",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/dismissable-layer/src/index.ts b/packages/react/dismissable-layer/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   DismissableLayer,
   DismissableLayerBranch,

diff --git a/packages/react/dropdown-menu/package.json b/packages/react/dropdown-menu/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-dropdown-menu",
-  "version": "2.0.7-rc.11",
+  "version": "2.0.7-rc.10",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/dropdown-menu/src/index.ts b/packages/react/dropdown-menu/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createDropdownMenuScope,
   //

diff --git a/packages/react/focus-guards/src/index.ts b/packages/react/focus-guards/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   FocusGuards,
   //

diff --git a/packages/react/focus-scope/src/index.ts b/packages/react/focus-scope/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   FocusScope,
   //

diff --git a/packages/react/form/package.json b/packages/react/form/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-form",
-  "version": "0.0.4-rc.7",
+  "version": "0.0.4-rc.6",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/form/src/index.ts b/packages/react/form/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createFormScope,
   //

diff --git a/packages/react/hover-card/package.json b/packages/react/hover-card/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-hover-card",
-  "version": "1.0.8-rc.9",
+  "version": "1.0.8-rc.8",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/hover-card/src/index.ts b/packages/react/hover-card/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createHoverCardScope,
   //

diff --git a/packages/react/label/package.json b/packages/react/label/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-label",
-  "version": "2.0.3-rc.7",
+  "version": "2.0.3-rc.6",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/label/src/index.ts b/packages/react/label/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   Label,
   //

diff --git a/packages/react/menu/package.json b/packages/react/menu/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-menu",
-  "version": "2.0.7-rc.11",
+  "version": "2.0.7-rc.10",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/menu/src/index.ts b/packages/react/menu/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createMenuScope,
   //

diff --git a/packages/react/menubar/package.json b/packages/react/menubar/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-menubar",
-  "version": "1.0.5-rc.11",
+  "version": "1.0.5-rc.10",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/menubar/src/index.ts b/packages/react/menubar/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createMenubarScope,
   //

diff --git a/packages/react/navigation-menu/package.json b/packages/react/navigation-menu/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-navigation-menu",
-  "version": "1.1.5-rc.10",
+  "version": "1.1.5-rc.9",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/navigation-menu/src/index.ts b/packages/react/navigation-menu/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createNavigationMenuScope,
   //

diff --git a/packages/react/popover/package.json b/packages/react/popover/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-popover",
-  "version": "1.0.8-rc.9",
+  "version": "1.0.8-rc.8",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/popover/src/index.ts b/packages/react/popover/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createPopoverScope,
   //

diff --git a/packages/react/popper/package.json b/packages/react/popper/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-popper",
-  "version": "1.1.4-rc.9",
+  "version": "1.1.4-rc.8",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/popper/src/index.ts b/packages/react/popper/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createPopperScope,
   //

diff --git a/packages/react/portal/src/Portal.tsx b/packages/react/portal/src/Portal.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import ReactDOM from 'react-dom';
 import { Primitive } from '@radix-ui/react-primitive';
+import { useLayoutEffect } from '@radix-ui/react-use-layout-effect';
 
 import type * as Radix from '@radix-ui/react-primitive';
 
@@ -16,11 +17,14 @@ interface PortalProps extends PrimitiveDivProps {
   /**
    * An optional container where the portaled content should be appended.
    */
-  container?: HTMLElement | null;
+  container?: Element | null;
 }
 
 const Portal = React.forwardRef<PortalElement, PortalProps>((props, forwardedRef) => {
-  const { container = globalThis?.document?.body, ...portalProps } = props;
+  const { container: containerProp, ...portalProps } = props;
+  const [mounted, setMounted] = React.useState(false);
+  useLayoutEffect(() => setMounted(true), []);
+  const container = containerProp || (mounted && globalThis?.document?.body);
   return container
     ? ReactDOM.createPortal(<Primitive.div {...portalProps} ref={forwardedRef} />, container)
     : null;

diff --git a/packages/react/portal/src/index.ts b/packages/react/portal/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   Portal,
   //

diff --git a/packages/react/presence/src/index.ts b/packages/react/presence/src/index.ts
@@ -1,2 +1,3 @@
+'use client';
 export { Presence } from './Presence';
 export type { PresenceProps } from './Presence';
diff --git a/packages/react/primitive/src/Primitive.tsx b/packages/react/primitive/src/Primitive.tsx
@@ -46,9 +46,9 @@ const Primitive = NODES.reduce((primitive, node) => {
     const { asChild, ...primitiveProps } = props;
     const Comp: any = asChild ? Slot : node;
 
-    React.useEffect(() => {
+    if (typeof window !== 'undefined') {
       (window as any)[Symbol.for('radix-ui')] = true;
-    }, []);
+    }
 
     return <Comp {...primitiveProps} ref={forwardedRef} />;
   });

diff --git a/packages/react/progress/src/index.ts b/packages/react/progress/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createProgressScope,
   //

diff --git a/packages/react/radio-group/package.json b/packages/react/radio-group/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-radio-group",
-  "version": "1.1.4-rc.11",
+  "version": "1.1.4-rc.10",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/radio-group/src/index.ts b/packages/react/radio-group/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createRadioGroupScope,
   //

diff --git a/packages/react/roving-focus/package.json b/packages/react/roving-focus/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-roving-focus",
-  "version": "1.0.5-rc.11",
+  "version": "1.0.5-rc.10",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/roving-focus/src/index.ts b/packages/react/roving-focus/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createRovingFocusGroupScope,
   //

diff --git a/packages/react/scroll-area/package.json b/packages/react/scroll-area/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-scroll-area",
-  "version": "1.0.6-rc.12",
+  "version": "1.0.6-rc.11",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/scroll-area/src/index.ts b/packages/react/scroll-area/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createScrollAreaScope,
   //

diff --git a/packages/react/select/package.json b/packages/react/select/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-select",
-  "version": "2.0.1-rc.12",
+  "version": "2.0.1-rc.11",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/select/src/index.ts b/packages/react/select/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createSelectScope,
   //

diff --git a/packages/react/slider/package.json b/packages/react/slider/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-slider",
-  "version": "1.2.0-rc.3",
+  "version": "1.2.0-rc.2",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/slider/src/index.ts b/packages/react/slider/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createSliderScope,
   //

diff --git a/packages/react/switch/src/index.ts b/packages/react/switch/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createSwitchScope,
   //

diff --git a/packages/react/tabs/package.json b/packages/react/tabs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-tabs",
-  "version": "1.0.5-rc.11",
+  "version": "1.0.5-rc.10",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/tabs/src/index.ts b/packages/react/tabs/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createTabsScope,
   //

diff --git a/packages/react/toast/package.json b/packages/react/toast/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-toast",
-  "version": "1.1.6-rc.6",
+  "version": "1.1.6-rc.5",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/toast/src/index.ts b/packages/react/toast/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createToastScope,
   //

diff --git a/packages/react/toggle-group/package.json b/packages/react/toggle-group/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-toggle-group",
-  "version": "1.0.5-rc.11",
+  "version": "1.0.5-rc.10",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/toggle-group/src/index.ts b/packages/react/toggle-group/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createToggleGroupScope,
   //

diff --git a/packages/react/toggle/src/index.ts b/packages/react/toggle/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   Toggle,
   //

diff --git a/packages/react/toolbar/package.json b/packages/react/toolbar/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-toolbar",
-  "version": "1.0.5-rc.11",
+  "version": "1.0.5-rc.10",
   "license": "MIT",
   "exports": {
     ".": {

diff --git a/packages/react/toolbar/src/index.ts b/packages/react/toolbar/src/index.ts
@@ -1,3 +1,4 @@
+'use client';
 export {
   createToolbarScope,
   //

diff --git a/packages/react/tooltip/package.json b/packages/react/tooltip/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-tooltip",
-  "version": "1.0.8-rc.9",
+  "version": "1.0.8-rc.8",
   "license": "MIT",
   "exports": {
     ".": {