Merge branch 'main' of https://github.com/vbenjs/vue-vben-admin into dev-v5

.github/ISSUE_TEMPLATE/bug-report.yml

@@ -62,7 +62,7 @@ body:
       description: Before submitting the issue, please make sure you do the following
       # description: By submitting this issue, you agree to follow our [Code of Conduct](https://example.com).
       options:
-        - label: Read the [docs](https://anncwb.github.io/vue-vben-admin-doc/)
+        - label: Read the [docs](https://doc.vben.pro/)
           required: true
         - label: Ensure the code is up to date. (Some issues have been fixed in the latest version)
           required: true

.github/ISSUE_TEMPLATE/feature-request.yml

@@ -62,7 +62,7 @@ body:
       label: Validations
       description: Before submitting the issue, please make sure you do the following
       options:
-        - label: Read the [docs](https://anncwb.github.io/vue-vben-admin-doc/)
+        - label: Read the [docs](https://doc.vben.pro/)
           required: true
         - label: Ensure the code is up to date. (Some issues have been fixed in the latest version)
           required: true

apps/web-ele/src/views/demos/element/index.vue

@@ -1,4 +1,6 @@
 <script lang="ts" setup>
+import { ref } from 'vue';
+
 import { Page } from '@vben/common-ui';
 
 import {
@@ -6,6 +8,7 @@ import {
   ElCard,
   ElMessage,
   ElNotification,
+  ElSegmented,
   ElSpace,
   ElTable,
 } from 'element-plus';
@@ -47,6 +50,10 @@ const tableData = [
   { prop1: '5', prop2: 'E' },
   { prop1: '6', prop2: 'F' },
 ];
+
+const segmentedValue = ref('Mon');
+
+const segmentedOptions = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
 </script>
 
 <template>
@@ -84,6 +91,14 @@ const tableData = [
         <ElButton type="success" @click="notify('success')"> 成功 </ElButton>
       </ElSpace>
     </ElCard>
+    <ElCard class="mb-5">
+      <template #header> Segmented </template>
+      <ElSegmented
+        v-model="segmentedValue"
+        :options="segmentedOptions"
+        size="large"
+      />
+    </ElCard>
     <ElCard class="mb-5">
       <ElTable :data="tableData" stripe>
         <ElTable.TableColumn label="测试列1" prop="prop1" />

docs/src/components/common-ui/vben-form.md

@@ -419,7 +419,7 @@ export interface FormSchema<
   help?: string;
   /** 表单项 */
   label?: string;
-  // 自定义组件内部渲染
+  /** 自定义组件内部渲染  */
   renderComponentContent?: RenderComponentContentType;
   /** 字段规则 */
   rules?: FormSchemaRuleType;
@@ -500,3 +500,20 @@ import { z } from '#/adapter/form';
             });
 }
 ```
+
+## Slots
+
+可以使用以下插槽在表单中插入自定义的内容
+
+| 插槽名        | 描述               |
+| ------------- | ------------------ |
+| reset-before  | 重置按钮之前的位置 |
+| submit-before | 提交按钮之前的位置 |
+| expand-before | 展开按钮之前的位置 |
+| expand-after  | 展开按钮之后的位置 |
+
+::: tip 字段插槽
+
+除了以上内置插槽之外，`schema`属性中每个字段的`fieldName`都可以作为插槽名称，这些字段插槽的优先级高于`component`定义的组件。也就是说，当提供了与`fieldName`同名的插槽时，这些插槽的内容将会作为这些字段的组件，此时`component`的值将会被忽略。
+
+:::

package.json

@@ -99,7 +99,7 @@
     "node": ">=20.10.0",
     "pnpm": ">=9.12.0"
   },
-  "packageManager": "pnpm@9.14.2",
+  "packageManager": "pnpm@9.14.4",
   "pnpm": {
     "peerDependencyRules": {
       "allowedVersions": {

packages/@core/base/design/src/design-tokens/dark.css

@@ -58,6 +58,8 @@
 
   /* Used for accents such as hover effects on <DropdownMenuItem>, <SelectItem>...etc */
   --accent: 216 5% 19%;
+  --accent-dark: 240 0% 22%;
+  --accent-darker: 240 0% 26%;
   --accent-lighter: 216 5% 12%;
   --accent-hover: 216 5% 24%;
   --accent-foreground: 0 0% 98%;

packages/@core/base/design/src/design-tokens/default.css

@@ -58,6 +58,8 @@
 
   /* Used for accents such as hover effects on <DropdownMenuItem>, <SelectItem>...etc */
   --accent: 240 5% 96%;
+  --accent-dark: 216 14% 93%;
+  --accent-darker: 216 11% 91%;
   --accent-lighter: 240 0% 98%;
   --accent-hover: 200deg 10% 90%;
   --accent-foreground: 240 6% 10%;

packages/@core/base/shared/package.json

@@ -86,12 +86,14 @@
     "dayjs": "catalog:",
     "defu": "catalog:",
     "lodash.clonedeep": "catalog:",
+    "lodash.set": "catalog:",
     "nprogress": "catalog:",
     "tailwind-merge": "catalog:",
     "theme-colors": "catalog:"
   },
   "devDependencies": {
     "@types/lodash.clonedeep": "catalog:",
+    "@types/lodash.set": "catalog:",
     "@types/nprogress": "catalog:"
   }
 }

packages/@core/base/shared/src/utils/index.ts

@@ -15,3 +15,4 @@ export * from './update-css-variables';
 export * from './util';
 export * from './window';
 export { default as cloneDeep } from 'lodash.clonedeep';
+export { default as set } from 'lodash.set';

packages/@core/ui-kit/form-ui/src/form-api.ts

@@ -185,7 +185,7 @@ export class FormApi {
     const fieldSet = new Set(fields);
     const schema = this.state?.schema ?? [];
 
-    const filterSchema = schema.filter((item) => fieldSet.has(item.fieldName));
+    const filterSchema = schema.filter((item) => !fieldSet.has(item.fieldName));
 
     this.setState({
       schema: filterSchema,

packages/@core/ui-kit/form-ui/src/use-form-context.ts

@@ -3,7 +3,7 @@ import type { FormActions, VbenFormProps } from './types';
 import { computed, type ComputedRef, unref, useSlots } from 'vue';
 
 import { createContext } from '@vben-core/shadcn-ui';
-import { isString } from '@vben-core/shared/utils';
+import { isString, set } from '@vben-core/shared/utils';
 
 import { useForm } from 'vee-validate';
 import { object, type ZodRawShape } from 'zod';
@@ -41,9 +41,9 @@ export function useFormInitial(
     const zodObject: ZodRawShape = {};
     (unref(props).schema || []).forEach((item) => {
       if (Reflect.has(item, 'defaultValue')) {
-        initialValues[item.fieldName] = item.defaultValue;
+        set(initialValues, item.fieldName, item.defaultValue);
       } else if (item.rules && !isString(item.rules)) {
-        zodObject[item.fieldName] = item.rules;
+        set(zodObject, item.fieldName, item.defaultValue);
       }
     });
 

packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue

@@ -191,7 +191,10 @@ watchEffect(() => {
 function calcMenuWidthStyle(isHiddenDom: boolean): CSSProperties {
   const { extraWidth, fixedExtra, isSidebarMixed, show, width } = props;
 
-  let widthValue = `${width + (isSidebarMixed && fixedExtra && extraVisible.value ? extraWidth : 0)}px`;
+  let widthValue =
+    width === 0
+      ? '0px'
+      : `${width + (isSidebarMixed && fixedExtra && extraVisible.value ? extraWidth : 0)}px`;
 
   const { collapseWidth } = props;
 

packages/@core/ui-kit/layout-ui/src/vben-layout.vue

@@ -192,7 +192,7 @@ const headerFixed = computed(() => {
 });
 
 const showSidebar = computed(() => {
-  return isSideMode.value && sidebarEnable.value;
+  return isSideMode.value && sidebarEnable.value && !props.sidebarHidden;
 });
 
 /**

packages/@core/ui-kit/popup-ui/src/modal/modal.vue

@@ -236,7 +236,7 @@ function handleFocusOutside(e: Event) {
         ref="wrapperRef"
         :class="
           cn('relative min-h-40 flex-1 overflow-y-auto p-3', contentClass, {
-            'overflow-hidden': showLoading,
+            'pointer-events-none overflow-hidden': showLoading,
           })
         "
       >

packages/effects/hooks/src/use-design-tokens.ts

@@ -260,6 +260,9 @@ export function useElementPlusDesignTokens() {
         '--el-fill-color-light': getCssVariableValue('--accent'),
         '--el-fill-color-lighter': getCssVariableValue('--accent-lighter'),
 
+        '--el-fill-color-dark': getCssVariableValue('--accent-dark'),
+        '--el-fill-color-darker': getCssVariableValue('--accent-darker'),
+
         // 解决ElLoading背景色问题
         '--el-mask-color': isDark.value
           ? 'rgba(0,0,0,.8)'

packages/effects/plugins/src/vxe-table/extends.ts

@@ -43,7 +43,11 @@ function extendProxyOption(
     const data = await configFn(
       params,
       {
-        ...customValues,
+        /**
+         * 开启toolbarConfig.refresh功能
+         * 点击刷新按钮 这里的值为PointerEvent 会携带错误参数
+         */
+        ...(customValues instanceof PointerEvent ? {} : customValues),
         ...formValues,
       },
       ...args,

playground/src/views/demos/features/icons/index.vue

@@ -60,6 +60,17 @@ import IconPicker from './icon-picker.vue';
       </div>
     </Card>
 
+    <Card class="mb-5" title="Tailwind CSS">
+      <div class="flex items-center gap-5 text-3xl">
+        <span class="icon-[ant-design--alipay-circle-outlined]"></span>
+        <span class="icon-[ant-design--account-book-filled]"></span>
+        <span class="icon-[ant-design--container-outlined]"></span>
+        <span class="icon-[svg-spinners--wind-toy]"></span>
+        <span class="icon-[svg-spinners--blocks-wave]"></span>
+        <span class="icon-[line-md--compass-filled-loop]"></span>
+      </div>
+    </Card>
+
     <Card class="mb-5" title="图标选择器(Iconify)">
       <div class="flex items-center gap-5">
         <IconPicker width="300px" />

playground/src/views/examples/form/basic.vue

@@ -291,6 +291,12 @@ const [CustomLayoutForm] = useVbenForm({
       formItemClass: 'col-start-1',
       label: '字符串',
     },
+    {
+      component: 'Input',
+      defaultValue: 'field4.path',
+      fieldName: 'field4.path',
+      label: 'field4.path',
+    },
   ],
   // 一共三列
   wrapperClass: 'grid-cols-3',

pnpm-workspace.yaml

@@ -21,22 +21,22 @@ catalog:
   '@commitlint/cli': ^19.6.0
   '@commitlint/config-conventional': ^19.6.0
   '@ctrl/tinycolor': ^4.1.0
-  '@eslint/js': ^9.15.0
+  '@eslint/js': ^9.16.0
   '@faker-js/faker': ^9.2.0
-  '@iconify/json': ^2.2.276
+  '@iconify/json': ^2.2.278
   '@iconify/tailwind': ^1.1.3
   '@iconify/vue': ^4.1.2
-  '@intlify/core-base': ^10.0.4
+  '@intlify/core-base': ^10.0.5
   '@intlify/unplugin-vue-i18n': ^6.0.0
   '@jspm/generator': ^2.4.1
   '@manypkg/get-packages': ^2.2.2
-  '@nolebase/vitepress-plugin-git-changelog': ^2.10.0
+  '@nolebase/vitepress-plugin-git-changelog': ^2.11.1
   '@playwright/test': ^1.49.0
-  '@pnpm/workspace.read-manifest': ^2.2.1
+  '@pnpm/workspace.read-manifest': ^1000.0.0
   '@stylistic/stylelint-plugin': ^3.1.1
   '@tailwindcss/nesting': 0.0.0-insiders.565cd3e
   '@tailwindcss/typography': ^0.5.15
-  '@tanstack/vue-query': ^5.61.4
+  '@tanstack/vue-query': ^5.62.0
   '@tanstack/vue-store': ^0.6.0
   '@types/archiver': ^6.0.3
   '@types/crypto-js': ^4.2.2
@@ -44,7 +44,8 @@ catalog:
   '@types/html-minifier-terser': ^7.0.2
   '@types/jsonwebtoken': ^9.0.7
   '@types/lodash.clonedeep': ^4.5.9
-  '@types/node': ^22.10.0
+  '@types/node': ^22.10.1
+  '@types/lodash.set': ^4.3.9
   '@types/nprogress': ^0.2.3
   '@types/postcss-import': ^14.0.3
   '@types/qrcode': ^1.5.5
@@ -59,8 +60,8 @@ catalog:
   '@vue/reactivity': ^3.5.13
   '@vue/shared': ^3.5.13
   '@vue/test-utils': ^2.4.6
-  '@vueuse/core': ^11.3.0
+  '@vueuse/core': ^12.0.0
-  '@vueuse/integrations': ^11.3.0
+  '@vueuse/integrations': ^12.0.0
   ant-design-vue: ^4.2.6
   archiver: ^7.0.1
   autoprefixer: ^10.4.20
@@ -85,8 +86,8 @@ catalog:
   depcheck: ^1.4.7
   dotenv: ^16.4.5
   echarts: ^5.5.1
-  element-plus: ^2.8.8
+  element-plus: ^2.9.0
-  eslint: ^9.15.0
+  eslint: ^9.16.0
   eslint-config-turbo: ^2.3.3
   eslint-plugin-command: ^0.2.6
   eslint-plugin-eslint-comments: ^3.2.0
@@ -101,7 +102,7 @@ catalog:
   eslint-plugin-unicorn: ^56.0.1
   eslint-plugin-unused-imports: ^4.1.4
   eslint-plugin-vitest: ^0.5.4
-  eslint-plugin-vue: ^9.31.0
+  eslint-plugin-vue: ^9.32.0
   execa: ^9.5.1
   find-up: ^7.0.0
   get-port: ^7.1.0
@@ -116,7 +117,8 @@ catalog:
   jsonwebtoken: ^9.0.2
   lint-staged: ^15.2.10
   lodash.clonedeep: ^4.5.0
-  lucide-vue-next: ^0.461.0
+  lucide-vue-next: ^0.462.0
+  lodash.set: ^4.3.2
   medium-zoom: ^1.1.0
   naive-ui: ^2.40.2
   nitropack: ^2.10.4
@@ -140,11 +142,11 @@ catalog:
   radix-vue: ^1.9.10
   resolve.exports: ^2.0.2
   rimraf: ^6.0.1
-  rollup: ^4.27.4
+  rollup: ^4.28.0
   rollup-plugin-visualizer: ^5.12.0
   sass: 1.80.6
-  sortablejs: ^1.15.4
+  sortablejs: ^1.15.6
-  stylelint: ^16.10.0
+  stylelint: ^16.11.0
   stylelint-config-recess-order: ^5.1.1
   stylelint-config-recommended: ^14.0.1
   stylelint-config-recommended-scss: ^14.1.0
@@ -167,19 +169,19 @@ catalog:
   vite-plugin-dts: 4.2.1
   vite-plugin-html: ^3.2.2
   vite-plugin-lazy-import: ^1.0.7
-  vite-plugin-pwa: ^0.21.0
+  vite-plugin-pwa: ^0.21.1
-  vite-plugin-vue-devtools: ^7.6.4
+  vite-plugin-vue-devtools: ^7.6.7
   vitepress: ^1.5.0
   vitepress-plugin-group-icons: ^1.3.0
   vitest: ^2.1.6
   vue: ^3.5.13
   vue-dompurify-html: ^5.2.0
   vue-eslint-parser: ^9.4.3
-  vue-i18n: ^10.0.4
+  vue-i18n: ^10.0.5
   vue-router: ^4.5.0
   vue-tsc: ^2.1.10
-  vxe-pc-ui: ^4.3.6
+  vxe-pc-ui: ^4.3.10
-  vxe-table: ^4.9.8
+  vxe-table: ^4.9.10
   watermark-js-plus: ^1.5.7
   zod: ^3.23.8
   zod-defaults: ^0.1.3