diff --git a/compiler/apps/playground/components/Editor/ConfigEditor.tsx b/compiler/apps/playground/components/Editor/ConfigEditor.tsx index 18f904d225f0e..cf80b48dbf0da 100644 --- a/compiler/apps/playground/components/Editor/ConfigEditor.tsx +++ b/compiler/apps/playground/components/Editor/ConfigEditor.tsx @@ -14,6 +14,7 @@ import React, { unstable_ViewTransition as ViewTransition, unstable_addTransitionType as addTransitionType, startTransition, + Activity, } from 'react'; import {Resizable} from 're-resizable'; import {useStore, useStoreDispatch} from '../StoreContext'; @@ -34,12 +35,8 @@ export default function ConfigEditor({ const [isExpanded, setIsExpanded] = useState(false); return ( - // TODO: Use when it is compatible with Monaco: https://github.com/suren-atoyan/monaco-react/issues/753 <> -
+ { startTransition(() => { @@ -49,11 +46,8 @@ export default function ConfigEditor({ }} formattedAppliedConfig={formattedAppliedConfig} /> -
-
+ + { startTransition(() => { @@ -62,7 +56,7 @@ export default function ConfigEditor({ }); }} /> -
+
); } @@ -122,7 +116,8 @@ function ExpandedEditor({ return ( + enter={{[CONFIG_PANEL_TRANSITION]: 'slide-in', default: 'none'}} + exit={{[CONFIG_PANEL_TRANSITION]: 'slide-out', default: 'none'}}>