♻️ refactor: Update dumi

.dumirc.ts

@@ -36,7 +36,9 @@ const themeConfig = {
   nav: [
     { link: '/components/ai21', title: 'Icons' },
     { link: '/features/model-icon', title: 'Components' },
-    { link: '/editor', title: 'Editor' },
+    { link: '/editor', title: 'SVG Editor' },
+    { link: 'https://ui.lobehub.com', mode: 'override', title: 'UI' },
+    { link: 'https://charts.lobehub.com', mode: 'override', title: 'Charts' },
     { link: '/changelog', title: 'Changelog' },
   ],
   socialLinks: {

docs/index.md

@@ -4,6 +4,4 @@ hero:
   description: Popular AI / LLM Model Brand SVG Logo and Icon Collection
 ---
 
-<code src="./Dashboard.tsx" inline></code>
-
 <code src="./index.tsx" inline></code>

docs/index.tsx

@@ -1,5 +1,8 @@
-import { Features, FeaturesProps } from '@lobehub/ui';
+import { Features, FeaturesProps, Snippet } from '@lobehub/ui';
 import { Expand, GitPullRequest, Trees } from 'lucide-react';
+import { Center, Flexbox } from 'react-layout-kit';
+
+import Dashboard from '@/components/Dashboard';
 
 const items: FeaturesProps['items'] = [
   {
@@ -23,5 +26,14 @@ const items: FeaturesProps['items'] = [
 ];
 
 export default () => {
-  return <Features items={items} />;
+  return (
+    <Flexbox gap={48}>
+      <Center>
+        <h2 style={{ fontSize: 20 }}>To install Lobe Icons, run the following command:</h2>
+        <Snippet language={'bash'}>{'$ bun add @lobehub/icons'}</Snippet>
+      </Center>
+      <Dashboard />
+      <Features items={items} />
+    </Flexbox>
+  );
 };

package.json

@@ -89,8 +89,8 @@
     "concurrently": "^8.2.2",
     "consola": "^3.2.3",
     "cross-env": "^7.0.3",
-    "dumi": "2.2.17",
-    "dumi-theme-lobehub": "^1.8.1",
+    "dumi": "^2.4.14",
+    "dumi-theme-lobehub": "^1.8.2",
     "eslint": "^8.57.1",
     "father": "^4.5.1",
     "glob": "^11.0.0",
@@ -100,7 +100,7 @@
     "lint-staged": "^15.2.10",
     "lodash-es": "^4.17.21",
     "markdown-table": "^3.0.4",
-    "multi-semantic-release": "^3",
+    "multi-semantic-release": "^3.0.2",
     "p-map": "^7.0.2",
     "polished": "^4.3.1",
     "prettier": "^3.3.3",

src/components/Dashboard/IconItem.tsx

@@ -27,7 +27,10 @@ const useStyles = createStyles(({ cx, css, token }) => {
   return {
     card: css`
       position: relative;
+
       overflow: hidden;
+
+      background: ${token.colorBgContainer};
       border: 1px solid ${token.colorBorderSecondary};
       border-radius: ${token.borderRadiusLG}px;
     `,

src/components/Dashboard/index.tsx

@@ -44,7 +44,7 @@ const Dashboard = memo(() => {
           onSearch={(v) => setKeyword(v)}
           placeholder={'Search by brand or model keywords...'}
           style={{ width: '100%' }}
-          variant={'filled'}
+          type={'block'}
         />
         <Segmented
           defaultValue={type}