diff --git a/packages/runtime/src/components/antd/TreeSelect.tsx b/packages/runtime/src/components/antd/TreeSelect.tsx
index bd733e5b..d3bc0daf 100644
--- a/packages/runtime/src/components/antd/TreeSelect.tsx
+++ b/packages/runtime/src/components/antd/TreeSelect.tsx
@@ -6,7 +6,11 @@ import { TreeSelect } from 'antd';
 import { Box } from '@chakra-ui/react';
 import { css } from '@emotion/react';
 import { ComponentImplementation } from '../../services/registry';
+import 'antd/lib/select/style/index.css';
+import 'antd/lib/empty/style/index.css';
+import 'antd/lib/tree-select/style/index.css';
 import 'antd/lib/style/index.css';
+import { useRef } from 'react';
 
 const StateSchema = Type.Object({
   value: Type.String(),
@@ -22,6 +26,7 @@ const TreeSelectImpl: ComponentImplementation<Static<typeof PropsSchema>> = ({
   autoSelectAncestors,
 }) => {
   const [value, setValue] = useState<string[]>();
+  const popContainerRef = useRef<HTMLDivElement | null>(null);
   useEffect(() => {
     mergeState({ value });
   }, [value]);
@@ -63,6 +68,7 @@ const TreeSelectImpl: ComponentImplementation<Static<typeof PropsSchema>> = ({
       css={css`
         ${customStyle?.content}
       `}
+      ref={popContainerRef}
     >
       <TreeSelect
         multiple={multiple}
@@ -72,6 +78,7 @@ const TreeSelectImpl: ComponentImplementation<Static<typeof PropsSchema>> = ({
         placeholder={placeholder}
         style={{ width: '100%' }}
         treeDefaultExpandAll={treeDefaultExpandAll}
+        getPopupContainer={() => popContainerRef.current || document.body}
       />
     </Box>
   );