chore: update uikit -> ui-kit

packages/business/chart-ui/package.json

@@ -43,8 +43,5 @@
     "@vben-core/preferences": "workspace:*",
     "echarts": "^5.5.0",
     "vue": "^3.4.30"
-  },
-  "devDependencies": {
-    "@vben/types": "workspace:*"
   }
 }

packages/business/layouts/package.json

@@ -47,11 +47,12 @@
     "@vben-core/tabs-ui": "workspace:*",
     "@vben-core/toolkit": "workspace:*",
     "@vben/locales": "workspace:*",
-    "@vben/universal-ui": "workspace:*",
+    "@vben/widgets": "workspace:*",
     "vue": "^3.4.30",
     "vue-router": "^4.4.0"
   },
   "devDependencies": {
-    "@vben-core/typings": "workspace:*"
+    "@vben-core/typings": "workspace:*",
+    "@vben/types": "workspace:*"
   }
 }

packages/business/layouts/src/authentication/toolbar.vue

@@ -1,10 +1,10 @@
 <script setup lang="ts">
+import { LanguageToggle, ThemeToggle } from '@vben/widgets';
+
 import {
   AuthenticationColorToggle,
   AuthenticationLayoutToggle,
-  LanguageToggle,
-  ThemeToggle,
-} from '@vben/universal-ui';
+} from './widgets';
 
 defineOptions({
   name: 'AuthenticationToolbar',

packages/business/layouts/src/authentication/widgets/index.ts

@@ -0,0 +1,2 @@
+export { default as AuthenticationColorToggle } from './color-toggle.vue';
+export { default as AuthenticationLayoutToggle } from './layout-toggle.vue';

packages/business/layouts/src/basic/header/header.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { GlobalSearch, LanguageToggle, ThemeToggle } from '@vben/universal-ui';
+import { GlobalSearch, LanguageToggle, ThemeToggle } from '@vben/widgets';
 import { usePreferences } from '@vben-core/preferences';
 import { VbenFullScreen } from '@vben-core/shadcn-ui';
 import { useAccessStore } from '@vben-core/stores';

packages/business/layouts/src/basic/layout.vue

@@ -2,7 +2,7 @@
 import { computed } from 'vue';
 
 import { $t } from '@vben/locales';
-import { PreferencesWidget } from '@vben/universal-ui';
+import { PreferencesWidget } from '@vben/widgets';
 import { VbenAdminLayout } from '@vben-core/layout-ui';
 import {
   preferences,

packages/business/universal-ui/package.json

@@ -40,15 +40,12 @@
     "@vben-core/design": "workspace:*"
   },
   "dependencies": {
-    "@vben-core/colorful": "workspace:*",
     "@vben-core/design": "workspace:*",
     "@vben-core/iconify": "workspace:*",
     "@vben-core/preferences": "workspace:*",
     "@vben-core/shadcn-ui": "workspace:*",
-    "@vben-core/toolkit": "workspace:*",
     "@vben/chart-ui": "workspace:*",
     "@vben/locales": "workspace:*",
-    "@vueuse/core": "^10.11.0",
     "@vueuse/integrations": "^10.11.0",
     "qrcode": "^1.5.3",
     "vue": "^3.4.30",

packages/business/universal-ui/src/authentication/index.ts

@@ -4,5 +4,3 @@ export { default as AuthenticationLogin } from './login.vue';
 export { default as AuthenticationQrCodeLogin } from './qrcode-login.vue';
 export { default as AuthenticationRegister } from './register.vue';
 export type { LoginAndRegisterParams, LoginCodeParams } from './typings';
-export { default as AuthenticationColorToggle } from './widgets/color-toggle.vue';
-export { default as AuthenticationLayoutToggle } from './widgets/layout-toggle.vue';

packages/business/universal-ui/src/dashboard/dashboard.vue

@@ -1,56 +1,64 @@
 <script lang="ts" setup>
 import type { CardItem, ChartItem } from './typings';
-defineOptions({ name: 'Dashboard' });
-import Card from './card.vue';
-import ChartTab from './chartTab.vue';
-import ChartCard from './chartCard.vue';
+
 import { ref } from 'vue';
 
+import Card from './card.vue';
+import ChartCard from './chartCard.vue';
+import ChartTab from './chartTab.vue';
+
 interface Props {
   cardList: CardItem[];
   chartTabs: ChartItem[];
 }
+
+defineOptions({ name: 'Dashboard' });
+
+withDefaults(defineProps<Props>(), {
+  cardList: () => [],
+  chartTabs: () => [],
+});
+
 const itemA = ref({
-  title: '玫瑰图',
   option: {
     legend: {
       top: 'bottom',
     },
-    toolbox: {
-      show: true,
-      feature: {
-        mark: { show: true },
-        dataView: { show: true, readOnly: false },
-        restore: { show: true },
-        saveAsImage: { show: true },
-      },
-    },
     series: [
       {
-        name: 'Nightingale Chart',
-        type: 'pie',
-        radius: [50, 200],
         center: ['50%', '50%'],
-        roseType: 'area',
+        data: [
+          { name: 'rose 1', value: 40 },
+          { name: 'rose 2', value: 38 },
+          { name: 'rose 3', value: 32 },
+          { name: 'rose 4', value: 30 },
+          { name: 'rose 5', value: 28 },
+          { name: 'rose 6', value: 26 },
+          { name: 'rose 7', value: 22 },
+          { name: 'rose 8', value: 18 },
+        ],
         itemStyle: {
           borderRadius: 8,
         },
-        data: [
-          { value: 40, name: 'rose 1' },
-          { value: 38, name: 'rose 2' },
-          { value: 32, name: 'rose 3' },
-          { value: 30, name: 'rose 4' },
-          { value: 28, name: 'rose 5' },
-          { value: 26, name: 'rose 6' },
-          { value: 22, name: 'rose 7' },
-          { value: 18, name: 'rose 8' },
-        ],
+        name: 'Nightingale Chart',
+        radius: [50, 200],
+        roseType: 'area',
+        type: 'pie',
       },
     ],
+    toolbox: {
+      feature: {
+        dataView: { readOnly: false, show: true },
+        mark: { show: true },
+        restore: { show: true },
+        saveAsImage: { show: true },
+      },
+      show: true,
+    },
   },
+  title: '玫瑰图',
 });
 const itemB = ref({
-  title: '雷达图',
   option: {
     legend: {
       data: ['Allocated Budget', 'Actual Spending'],
@@ -58,82 +66,78 @@ const itemB = ref({
     radar: {
       // shape: 'circle',
       indicator: [
-        { name: 'Sales', max: 6500 },
-        { name: 'Administration', max: 16000 },
-        { name: 'Information Technology', max: 30000 },
-        { name: 'Customer Support', max: 38000 },
-        { name: 'Development', max: 52000 },
-        { name: 'Marketing', max: 25000 },
+        { max: 6500, name: 'Sales' },
+        { max: 16_000, name: 'Administration' },
+        { max: 30_000, name: 'Information Technology' },
+        { max: 38_000, name: 'Customer Support' },
+        { max: 52_000, name: 'Development' },
+        { max: 25_000, name: 'Marketing' },
       ],
     },
     series: [
       {
-        name: 'Budget vs spending',
-        type: 'radar',
         data: [
           {
-            value: [4200, 3000, 20000, 35000, 50000, 18000],
             name: 'Allocated Budget',
+            value: [4200, 3000, 20_000, 35_000, 50_000, 18_000],
           },
           {
-            value: [5000, 14000, 28000, 26000, 42000, 21000],
             name: 'Actual Spending',
+            value: [5000, 14_000, 28_000, 26_000, 42_000, 21_000],
           },
         ],
+        name: 'Budget vs spending',
+        type: 'radar',
       },
     ],
   },
+  title: '雷达图',
 });
 const itemC = ref({
-  title: '饼图',
   option: {
-    tooltip: {
-      trigger: 'item',
-    },
     legend: {
-      top: '5%',
       left: 'center',
+      top: '5%',
     },
     series: [
       {
-        name: 'Access From',
-        type: 'pie',
-        radius: ['40%', '70%'],
         avoidLabelOverlap: false,
+        data: [
+          { name: 'Search Engine', value: 1048 },
+          { name: 'Direct', value: 735 },
+          { name: 'Email', value: 580 },
+          { name: 'Union Ads', value: 484 },
+          { name: 'Video Ads', value: 300 },
+        ],
+        emphasis: {
+          label: {
+            fontSize: 40,
+            fontWeight: 'bold',
+            show: true,
+          },
+        },
         itemStyle: {
-          borderRadius: 10,
           borderColor: '#fff',
+          borderRadius: 10,
           borderWidth: 2,
         },
         label: {
-          show: false,
           position: 'center',
-        },
-        emphasis: {
-          label: {
-            show: true,
-            fontSize: 40,
-            fontWeight: 'bold',
-          },
+          show: false,
         },
         labelLine: {
           show: false,
         },
-        data: [
-          { value: 1048, name: 'Search Engine' },
-          { value: 735, name: 'Direct' },
-          { value: 580, name: 'Email' },
-          { value: 484, name: 'Union Ads' },
-          { value: 300, name: 'Video Ads' },
-        ],
+        name: 'Access From',
+        radius: ['40%', '70%'],
+        type: 'pie',
       },
     ],
+    tooltip: {
+      trigger: 'item',
+    },
   },
-});
-
-withDefaults(defineProps<Props>(), {
-  cardList: () => [],
-  chartTabs: () => [],
+  title: '饼图',
 });
 </script>
 

packages/business/universal-ui/src/index.ts

@@ -1,11 +1,3 @@
 export * from './authentication';
-export * from './coze-assistant';
 export * from './dashboard';
 export * from './fallback';
-export * from './global-provider';
-export * from './global-search';
-export * from './language-toggle';
-export * from './notification';
-export * from './preferences';
-export * from './theme-toggle';
-export * from './user-dropdown';

packages/business/widgets/package.json

@@ -0,0 +1,61 @@
+{
+  "name": "@vben/widgets",
+  "version": "5.0.0",
+  "homepage": "https://github.com/vbenjs/vue-vben-admin",
+  "bugs": "https://github.com/vbenjs/vue-vben-admin/issues",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vbenjs/vue-vben-admin.git",
+    "directory": "packages/business/widgets"
+  },
+  "license": "MIT",
+  "type": "module",
+  "scripts": {
+    "build": "pnpm vite build",
+    "prepublishOnly": "npm run build"
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "main": "./dist/index.mjs",
+  "module": "./dist/index.mjs",
+  "exports": {
+    ".": {
+      "types": "./src/index.ts",
+      "development": "./src/index.ts",
+      "default": "./dist/index.mjs"
+    }
+  },
+  "publishConfig": {
+    "exports": {
+      ".": {
+        "default": "./dist/index.mjs"
+      }
+    }
+  },
+  "peerDependencies": {
+    "@vben-core/design": "workspace:*"
+  },
+  "dependencies": {
+    "@vben-core/colorful": "workspace:*",
+    "@vben-core/design": "workspace:*",
+    "@vben-core/iconify": "workspace:*",
+    "@vben-core/preferences": "workspace:*",
+    "@vben-core/shadcn-ui": "workspace:*",
+    "@vben-core/toolkit": "workspace:*",
+    "@vben/chart-ui": "workspace:*",
+    "@vben/locales": "workspace:*",
+    "@vueuse/core": "^10.11.0",
+    "@vueuse/integrations": "^10.11.0",
+    "qrcode": "^1.5.3",
+    "vue": "^3.4.30",
+    "vue-router": "^4.4.0"
+  },
+  "devDependencies": {
+    "@types/qrcode": "^1.5.5",
+    "@vben/types": "workspace:*"
+  }
+}

packages/business/widgets/postcss.config.mjs

@@ -0,0 +1 @@
+export { default } from '@vben/tailwind-config/postcss';

packages/business/widgets/src/index.ts

@@ -0,0 +1,8 @@
+export * from './coze-assistant';
+export * from './global-provider';
+export * from './global-search';
+export * from './language-toggle';
+export * from './notification';
+export * from './preferences';
+export * from './theme-toggle';
+export * from './user-dropdown';

packages/business/widgets/tailwind.config.mjs

@@ -0,0 +1 @@
+export { default } from '@vben/tailwind-config';

packages/business/widgets/tsconfig.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "@vben/tsconfig/web.json",
+  "include": ["src"],
+  "exclude": ["node_modules"]
+}

packages/business/widgets/vite.config.mts

@@ -0,0 +1,3 @@
+import { defineConfig } from '@vben/vite-config';
+
+export default defineConfig();