feat(split): adds watch-props prop (#5527)

* fix(n-split): `modified `default-size` panel not updated issue

* feat(n-split): add `watch-props` prop

* Update src/split/demos/enUS/index.demo-entry.md

Co-authored-by: OrbisK <37191683+OrbisK@users.noreply.github.com>

* Update src/split/demos/zhCN/index.demo-entry.md

Co-authored-by: OrbisK <37191683+OrbisK@users.noreply.github.com>

* Update CHANGELOG.en-US.md

Co-authored-by: OrbisK <37191683+OrbisK@users.noreply.github.com>

* fix: change to watchEffect

* fix: docs

---------

Co-authored-by: OrbisK <37191683+OrbisK@users.noreply.github.com>
Co-authored-by: 07akioni <07akioni2@gmail.com>

CHANGELOG.en-US.md

@@ -14,6 +14,7 @@
 - `n-auto-complete` adds `append` prop.
 - `n-select` add native `title` attribute when `filterable` and blur input.
 - `n-split` adds `size` prop and `on-update:size` prop.
+- `n-split` adds `watch-props` prop, closes [#5526](https://github.com/tusen-ai/naive-ui/issues/5526).
 
 ### i18n
 
@@ -102,6 +103,9 @@
 - `n-tree-select` adds `ellipsis-tag-popover-props` prop.
 - `n-avatar-group` adds `expand-on-hover` prop.
 - `n-tabs` adds `tab-class`, `add-tab-style` and `add-tab-class` props.
+- `n-tree` adds `override-default-node-click-behavior` prop.
+- `n-tree-select` adds `override-default-node-click-behavior` prop.
+- Adds `n-flex` component.
 - `n-pagination` adds `show-quick-jump-dropdown` prop, closes [#5251](https://github.com/tusen-ai/naive-ui/issues/5251).
 
 ## 2.36.0

CHANGELOG.zh-CN.md

@@ -14,6 +14,7 @@
 - `n-auto-complete` 新增 `append` 属性
 - `n-select` 在组件可过滤且输入失焦时，添加原生 `title` 属性
 - `n-split` 新增 `size` 和 `on-update:size` 属性
+- `n-split` 新增 `watch-props` 属性，关闭 [#5526](https://github.com/tusen-ai/naive-ui/issues/5526)
 
 ### i18n
 
@@ -103,6 +104,9 @@
 - `n-tree-select` 新增 `ellipsis-tag-popover-props` 属性
 - `n-avatar-group` 新增 `expand-on-hover` 属性
 - `n-tabs` 新增 `tab-class`、`add-tab-style`、`add-tab-class` 属性
+- `n-tree` 新增 `override-default-node-click-behavior` 属性
+- `n-tree-select` 新增 `override-default-node-click-behavior` 属性
+- 新增 `n-flex` 组件
 - `n-pagination` 新增 `show-quick-jump-dropdown` 属性，关闭 [#5251](https://github.com/tusen-ai/naive-ui/issues/5251)
 
 ## 2.36.0

src/split/demos/enUS/index.demo-entry.md

@@ -27,6 +27,7 @@ slot.vue
 | min | `number` | `0` | The minimum threshold for splitting, 0-1 is a percentage. | 2.36.0 |
 | max | `number` | `1` | The maximum split threshold, 0-1 is a percentage. | 2.36.0 |
 | resize-trigger-size | `number` | `3` | Size of the resize trigger. | 2.36.0 |
+| watch-props | `Array<'defaultSize'>` | `undefined` | Default prop names that needed to be watched. Components will be updated after the prop is changed. Note: the `watch-props` itself is not reactive. | NEXT_VERSION |
 | on-update:size | `(value: number) => void` | `undefined` | Callback fired on size changes. | NEXT_VERSION |
 
 ### Split Slots

src/split/demos/zhCN/index.demo-entry.md

@@ -28,6 +28,7 @@ controlled.vue
 | min | `number` | `0` | Split 的分割最小阈值，0-1 代表百分比 | 2.36.0 |
 | max | `number` | `1` | Split 的分割最大阈值，0-1 代表百分比 | 2.36.0 |
 | resize-trigger-size | `number` | `3` | Split 的分隔条大小 | 2.36.0 |
+| watch-props | `Array<'defaultSize'>` | `undefined` | 需要检测变更的默认属性，检测后组件状态会更新。注意：`watch-props` 本身不是响应式的 | NEXT_VERSION |
 | on-update:size | `(value: number) => void` | `undefined` | 组件 size 属性变化时触发的回调 | NEXT_VERSION |
 
 ### Split Slots

src/split/src/Split.tsx

@@ -5,6 +5,7 @@ import {
   ref,
   computed,
   type CSSProperties,
+  watchEffect,
   toRef
 } from 'vue'
 import { off, on } from 'evtd'
@@ -47,7 +48,8 @@ export const splitProps = {
   },
   onDragStart: Function as PropType<(e: Event) => void>,
   onDragMove: Function as PropType<(e: Event) => void>,
-  onDragEnd: Function as PropType<(e: Event) => void>
+  onDragEnd: Function as PropType<(e: Event) => void>,
+  watchProps: Array as PropType<Array<'defaultSize'>>
 } as const
 
 export type SplitProps = ExtractPublicPropTypes<typeof splitProps>
@@ -81,6 +83,9 @@ export default defineComponent({
     const isDraggingRef = ref(false)
     const controlledSizeRef = toRef(props, 'size')
     const uncontrolledSizeRef = ref(props.defaultSize)
+    if (props.watchProps?.includes('defaultSize')) {
+      watchEffect(() => (uncontrolledSizeRef.value = props.defaultSize))
+    }
     // use to update controlled or uncontrolled values
     const doUpdateSize = (size: number): void => {
       const _onUpdateSize = props['onUpdate:size']