officialblock 1.0.1 → 1.0.3

package/src/index.ts

@@ -1,11 +1,13 @@
 import type { App, Plugin } from 'vue'
-import { ArticleList, HeroSlide } from './components'
+import { ArticleList, HeroSlide, RichTextEditor, ThemePreview } from './components'
 
 // 全部引入插件
 const OfficialBlock = {
   install: (app: App) => {
     app.component('ArticleList', ArticleList)
     app.component('HeroSlide', HeroSlide)
+    app.component('RichTextEditor', RichTextEditor)
+    app.component('ThemePreview', ThemePreview)
   },
 } satisfies Plugin
 
@@ -13,11 +15,15 @@ const OfficialBlock = {
 export default OfficialBlock
 
 // 按需引入 - 导出组件
-export { ArticleList, HeroSlide }
+export { ArticleList, HeroSlide, RichTextEditor, ThemePreview }
 
 // 按需引入 - 导出单个组件的插件
 export { ArticleListPlugin, HeroSlidePlugin } from './components'
 
+// 导出主题相关功能
+export { useTheme } from './composables/useTheme'
+export { ThemeUtils, ResponsiveUtils, AnimationUtils, StorageUtils } from './utils/theme'
+
 // 导出类型定义
 export type {
   ComponentProps,
@@ -25,5 +31,10 @@ export type {
   ComponentSlots,
   HeroSlideProps,
   HeroSlideEmits,
-  SlideItem
-} from './components'
+  SlideItem,
+  IDomEditor,
+  IEditorConfig,
+  IToolbarConfig
+} from './components'
+
+export type { ThemeConfig } from './composables/useTheme'

package/src/main.ts

@@ -1,5 +1,20 @@
 import { createApp } from 'vue'
 import './style.css'
+import './styles/variables.scss'
+import 'virtual:uno.css'
 import App from './App.vue'
+import router from './router'
+import ArcoVue from '@arco-design/web-vue'
+import ArcoVueIcon from '@arco-design/web-vue/es/icon';
+import '@arco-design/web-vue/dist/arco.css'
 
-createApp(App).mount('#app')
+const app = createApp(App)
+app.use(router)
+app.use(ArcoVue)
+app.use(ArcoVueIcon)
+app.mount('#app')
+
+// 初始化主题系统
+import { useTheme } from './composables/useTheme'
+const { initTheme } = useTheme()
+initTheme()

package/src/router/index.ts

@@ -0,0 +1,96 @@
+import { createRouter, createWebHistory } from 'vue-router'
+import type { RouteRecordRaw } from 'vue-router'
+
+const routes: RouteRecordRaw[] = [
+  {
+    path: '/',
+    redirect: '/guide/introduction'
+  },
+  {
+    path: '/guide',
+    name: 'Guide',
+    component: () => import('../views/Layout.vue'),
+    children: [
+      {
+        path: 'introduction',
+        name: 'Introduction',
+        component: () => import('../views/guide/Introduction.vue'),
+        meta: { title: '介绍' }
+      },
+      {
+        path: 'installation',
+        name: 'Installation',
+        component: () => import('../views/guide/Installation.vue'),
+        meta: { title: '安装' }
+      },
+      {
+        path: 'quickstart',
+        name: 'QuickStart',
+        component: () => import('../views/guide/QuickStart.vue'),
+        meta: { title: '快速开始' }
+      }
+    ]
+  },
+  {
+    path: '/components',
+    name: 'Components',
+    component: () => import('../views/Layout.vue'),
+    children: [
+      {
+        path: 'article-list',
+        name: 'ArticleListDemo',
+        component: () => import('../views/components/ArticleListDemo.vue'),
+        meta: { title: 'ArticleList 文章列表' }
+      },
+      {
+        path: 'hero-slide',
+        name: 'HeroSlideDemo',
+        component: () => import('../views/components/HeroSlideDemo.vue'),
+        meta: { title: 'HeroSlide 轮播图' }
+      },
+      {
+        path: 'rich-text-editor',
+        name: 'RichTextEditorDemo',
+        component: () => import('../views/components/RichTextEditorDemo.vue'),
+        meta: { title: 'RichTextEditor 富文本编辑器' }
+      },
+      {
+        path: 'theme',
+        name: 'ThemeDemo',
+        component: () => import('../views/components/ThemeDemo.vue'),
+        meta: { title: 'Theme 主题系统' }
+      },
+      {
+        path: 'drag-sort',
+        name: 'DragSortDemo',
+        component: () => import('../views/components/DragSortDemo.vue'),
+        meta: { title: '拖拽排序演示' }
+      },
+      {
+        path: 'drag-limit',
+        name: 'DragLimitDemo',
+        component: () => import('../views/components/DragLimitDemo.vue'),
+        meta: { title: '拖拽限制演示' }
+      }
+    ]
+  },
+  {
+    path: '/:pathMatch(.*)*',
+    name: 'NotFound',
+    component: () => import('../views/NotFound.vue')
+  }
+]
+
+const router = createRouter({
+  history: createWebHistory(),
+  routes,
+  scrollBehavior(to, from, savedPosition) {
+    if (savedPosition) {
+      return savedPosition
+    } else {
+      return { top: 0 }
+    }
+  }
+})
+
+export default router

package/src/style.css

@@ -59,10 +59,8 @@ button:focus-visible {
 }
 
 #app {
-  max-width: 1280px;
-  margin: 0 auto;
-  padding: 2rem;
-  text-align: center;
+  width: 100%;
+  /* margin: 0 auto; */
 }
 
 @media (prefers-color-scheme: light) {