chore: adjust code

package.json

@@ -208,6 +208,7 @@
     "@tdesign/common-js": "workspace:^",
     "@tdesign/common-style": "workspace:^",
     "@tdesign/components": "workspace:^",
+    "@tdesign/react-site": "workspace:^",
     "@types/sortablejs": "^1.10.7",
     "@types/tinycolor2": "^1.4.3",
     "@types/validator": "^13.1.3",

packages/components/button/_usage/index.jsx

@@ -3,23 +3,19 @@
  */
 
 // @ts-nocheck
-import React, { useState, useEffect, useMemo } from "react";
-import BaseUsage, {
-  useConfigChange,
-  usePanelChange,
-} from "@site/src/components/BaseUsage";
-import jsxToString from "react-element-to-jsx-string";
+import React, { useState, useEffect, useMemo } from 'react';
+import BaseUsage, { useConfigChange, usePanelChange } from '@tdesign/react-site/src/components/BaseUsage';
+import jsxToString from 'react-element-to-jsx-string';
 
-import configProps from "./props.json";
-
-import { Button } from "tdesign-react";
+import { Button } from '@tdesign/components';
+import configProps from './props.json';
 
 export default function Usage() {
   const [configList, setConfigList] = useState(configProps);
 
   const { changedProps, onConfigChange } = useConfigChange(configList);
 
-  const panelList = [{ label: "button", value: "button" }];
+  const panelList = [{ label: 'button', value: 'button' }];
 
   const { panel, onPanelChange } = usePanelChange(panelList);
 
@@ -30,7 +26,7 @@ export default function Usage() {
   }, [changedProps]);
 
   const jsxStr = useMemo(() => {
-    if (!renderComp) return "";
+    if (!renderComp) return '';
     return jsxToString(renderComp);
   }, [renderComp]);
 

packages/tdesign-react/site/src/components/Demo.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import Button from '@tdesign/components/button';
+import { Button } from '@tdesign/components';
 import { Link, useLocation } from 'react-router-dom';
 
 export const demoFiles = import.meta.glob('../../../../components/**/_example/*.tsx', { eager: true });

packages/tdesign-react/site/src/components/Playground.jsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import { HashRouter, Routes, Navigate, Route, useLocation, Link } from 'react-router-dom';
 import ReactDOM from 'react-dom';
-import Button from 'tdesign-react/button';
-import 'tdesign-react/style/index.js';
+import { Button } from '@tdesign/components';
+import '@tdesign/components/style/index.js';
 
 const demoFiles = import.meta.glob('../../../src/**/_example/*.jsx', { eager: true });
 const demoObject = {};

packages/tdesign-react/site/src/components/codesandbox/index.jsx

@@ -1,6 +1,5 @@
 import React, { useState } from 'react';
-import Tooltip from 'tdesign-react/tooltip';
-import Loading from 'tdesign-react/loading';
+import { Tooltip, Loading } from '@tdesign/components';
 
 import { mainJsContent, htmlContent, pkgContent, styleContent, tsconfigContent } from './content';
 import '../../styles/Codesandbox.less';

packages/tdesign-react/site/src/components/stackblitz/index.jsx

@@ -1,5 +1,5 @@
 import React, { useRef, useState } from 'react';
-import Tooltip from 'tdesign-react/tooltip';
+import { Tooltip } from '@tdesign/components';
 
 import {
   htmlContent,