build: add gen-entry.ts

package.json

@@ -38,5 +38,6 @@
         "@algolia/client-search"
       ]
     }
-  }
+  },
+  "packageManager": "pnpm@10.15.1+sha512.34e538c329b5553014ca8e8f4535997f96180a1d0f614339357449935350d924e22f8614682191264ec33d1462ac21561aff97f6bb18065351c162c7e8f6de67"
 }

packages/ui/components.json

@@ -10,11 +10,11 @@
     "prefix": ""
   },
   "aliases": {
-    "components": "@/components",
-    "composables": "@/composables",
-    "utils": "@/lib/utils",
-    "ui": "@/components",
-    "lib": "@/lib"
+    "components": "src/components",
+    "composables": "src/composables",
+    "utils": "src/lib/utils",
+    "ui": "src/components",
+    "lib": "src/lib"
   },
   "iconLibrary": "lucide"
 }

packages/ui/scripts/gen-entry.ts

@@ -0,0 +1,43 @@
+import fs from 'fs'
+import path from 'path'
+
+const rootDir = path.resolve(import.meta.dirname, '../src')
+const readDir = path.resolve(rootDir, './components')
+const outputDir = path.resolve(rootDir, './index.ts')
+
+async function readDirName(){  
+  const pathList:Awaited<string[]> = await new Promise((resolve, reject) => {
+    fs.readdir(readDir, (err, data) => {
+      if (err) {    
+         reject(err)
+      }
+      resolve(data)
+     })
+   })
+   return pathList 
+}
+
+async function writeExportFile(pathList: string[]) {
+  const pathListStr = pathList.map(fileName => {
+    return `export * from './components/${fileName}/index'`
+  })
+  await new Promise((resolve, reject) => {
+    fs.writeFile(outputDir, pathListStr.join('\r\n'), (err) => {
+      if (err) {
+        reject(err)
+      }
+      resolve(undefined)
+    })   
+  })
+}
+
+async function generate() {
+  try {
+    const list = await readDirName()
+    writeExportFile(list)
+  } catch(error) {
+    console.error(error)
+  }
+}
+
+generate()

packages/ui/src/components/collapsible/Collapsible.vue

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import type { CollapsibleRootEmits, CollapsibleRootProps } from "reka-ui"
+import { CollapsibleRoot, useForwardPropsEmits } from "reka-ui"
+
+const props = defineProps<CollapsibleRootProps>()
+const emits = defineEmits<CollapsibleRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
+</script>
+
+<template>
+  <CollapsibleRoot
+    v-slot="slotProps"
+    data-slot="collapsible"
+    v-bind="forwarded"
+  >
+    <slot v-bind="slotProps" />
+  </CollapsibleRoot>
+</template>

packages/ui/src/components/collapsible/CollapsibleContent.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+import type { CollapsibleContentProps } from "reka-ui"
+import { CollapsibleContent } from "reka-ui"
+
+const props = defineProps<CollapsibleContentProps>()
+</script>
+
+<template>
+  <CollapsibleContent
+    data-slot="collapsible-content"
+    v-bind="props"
+  >
+    <slot />
+  </CollapsibleContent>
+</template>

packages/ui/src/components/collapsible/CollapsibleTrigger.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+import type { CollapsibleTriggerProps } from "reka-ui"
+import { CollapsibleTrigger } from "reka-ui"
+
+const props = defineProps<CollapsibleTriggerProps>()
+</script>
+
+<template>
+  <CollapsibleTrigger
+    data-slot="collapsible-trigger"
+    v-bind="props"
+  >
+    <slot />
+  </CollapsibleTrigger>
+</template>

packages/ui/src/components/collapsible/index.ts

@@ -0,0 +1,3 @@
+export { default as Collapsible } from './Collapsible.vue'
+export { default as CollapsibleContent } from './CollapsibleContent.vue'
+export { default as CollapsibleTrigger } from './CollapsibleTrigger.vue'

packages/ui/src/index.ts

@@ -1,30 +1,29 @@
-// Generated by scripts/gen-entry.ts. Do not edit manually.
-
-export * from './components/alert/index'
-export * from './components/avatar/index'
-export * from './components/badge/index'
-export * from './components/button/index'
-export * from './components/button-group/index'
-export * from './components/card/index'
-export * from './components/checkbox/index'
-export * from './components/combobox/index'
-export * from './components/context-menu/index'
-export * from './components/dialog/index'
-export * from './components/dropdown-menu/index'
-export * from './components/input/index'
-export * from './components/input-group/index'
-export * from './components/kbd/index'
-export * from './components/label/index'
-export * from './components/radio-group/index'
-export * from './components/select/index'
-export * from './components/separator/index'
-export * from './components/sheet/index'
-export * from './components/sidebar/index'
-export * from './components/skeleton/index'
-export * from './components/slider/index'
-export * from './components/sonner/index'
-export * from './components/spinner/index'
-export * from './components/switch/index'
-export * from './components/tabs/index'
-export * from './components/textarea/index'
-export * from './components/tooltip/index'
+export * from './components/alert/index'
+export * from './components/avatar/index'
+export * from './components/badge/index'
+export * from './components/button/index'
+export * from './components/button-group/index'
+export * from './components/card/index'
+export * from './components/checkbox/index'
+export * from './components/collapsible/index'
+export * from './components/combobox/index'
+export * from './components/context-menu/index'
+export * from './components/dialog/index'
+export * from './components/dropdown-menu/index'
+export * from './components/input/index'
+export * from './components/input-group/index'
+export * from './components/kbd/index'
+export * from './components/label/index'
+export * from './components/radio-group/index'
+export * from './components/select/index'
+export * from './components/separator/index'
+export * from './components/sheet/index'
+export * from './components/sidebar/index'
+export * from './components/skeleton/index'
+export * from './components/slider/index'
+export * from './components/sonner/index'
+export * from './components/spinner/index'
+export * from './components/switch/index'
+export * from './components/tabs/index'
+export * from './components/textarea/index'
+export * from './components/tooltip/index'

packages/web/src/components/MainContainer/index.vue

@@ -1,13 +1,15 @@
 <template>
-  <section>
-    <h1 @click="open=!open">
+  <SidebarInset>
+    <SidebarTrigger class="-ml-1" />
+    <h1 @click="open = !open">
       <!-- 主体 -->
     </h1>
-  </section>
+  </SidebarInset>
 </template>
 
 <script setup lang="ts">
-  import { inject } from 'vue'
+import { inject } from 'vue'
+import { SidebarTrigger, SidebarInset } from '@memoh/ui'
 
-  const open=inject('sideBarIsOpen')
+const open = inject('sideBarIsOpen')
 </script>

packages/web/src/components/Sidebar/index.vue

@@ -30,7 +30,7 @@
         </SidebarHeader>
         <SidebarContent>
           <SidebarGroup>
-            <SidebarGroupLabel class="text-base">
+            <SidebarGroupLabel>
               对话操作
             </SidebarGroupLabel>
             <SidebarGroupContent>
@@ -39,17 +39,15 @@
                   v-for="sidebarItem in sidebarInfo"
                   :key="sidebarItem.title"
                 >
-                  <SidebarMenuButton        
-                    as-child
-                  >
-                    <section class="flex">
+                  <CollapsibleTrigger as-child>
+                    <SidebarMenuButton>
                       <svg-icon
                         type="mdi"
                         :path="sidebarItem.icon"
                       />
                       <span>{{ sidebarItem.title }}</span>
-                    </section>
-                  </SidebarMenuButton>
+                    </SidebarMenuButton>
+                  </CollapsibleTrigger>
                 </SidebarMenuItem>
               </SidebarMenu>
             </SidebarGroupContent>
@@ -74,11 +72,12 @@ import {
   SidebarMenuButton,
   SidebarMenuItem,
   SidebarProvider,
-  SidebarRail,  
+  SidebarRail, 
+  
 } from '@memoh/ui'
 import { reactive, inject } from 'vue'
 import SvgIcon from '@jamescoyle/vue-icon'
-import { mdiCogOutline, mdiChatOutline, mdiCogBox, mdiListBox } from '@mdi/js'
+import { mdiRobot, mdiChatOutline, mdiCogBox, mdiListBox } from '@mdi/js'
 
 
 const open=inject('sideBarIsOpen')
@@ -90,7 +89,7 @@ const sidebarInfo = reactive([{
 }, {
   title: '模型配置',
   path: '/',
-  icon: mdiCogOutline
+  icon: mdiRobot
   }, {
   title: '环境设置',
   path: '/',

packages/web/src/layout/mainLayout/index.vue

@@ -1,7 +1,12 @@
 <template>
   <section class="flex">
-    <slot name="sidebar" />
-    <slot name="main" />
+    <sidebar-provider>
+      <slot name="sidebar" />
+      <slot name="main" />
+    </sidebar-provider>
   </section>
 </template>
+<script setup lang="ts">
+import { SidebarProvider } from '@memoh/ui'
 
+</script>