Merge branch 'main' into fix/Upload-warning-Extraneous-non-props-attr…

…ibutes-mode

CHANGELOG.en-US.md

@@ -4,16 +4,26 @@
 
 ### Fixes
 
+- Fix `n-notification` 's `description` does not wrap when there is English, closes [#4609](https://github.com/tusen-ai/naive-ui/issues/4609).
 - Fix `n-dynamic-input` can't access `value[index]` by `index` passed in `on-remove` prop.
 - Fix `n-dynamic-input` doesn't return correct `index` in `on-create` callback.
 - Fix `trTR` i18n, closes [#4231](https://github.com/tusen-ai/naive-ui/issues/4231).
+- Fix `n-input`'s show password icon is offset when use both `password` and `disabled`, closes [#4364](https://github.com/tusen-ai/naive-ui/issues/4364).
 - Fix `n-upload` warning cause by extraneous non-props attributes were passed to vue component `TransitionGroup` but could not be automatically inherited, closes [#4447](https://github.com/tusen-ai/naive-ui/issues/4447).
 
 ### Feats
 
 - `n-dynamic-input` adds `action` slot, closes [#3981](https://github.com/tusen-ai/naive-ui/issues/3981).
 - `n-dynamic-input` add `disabled` prop, closes [#4055](https://github.com/tusen-ai/naive-ui/issues/4055).
 - `n-data-table` adds `titleAlign` prop, closes [#3954](https://github.com/tusen-ai/naive-ui/issues/3954).
+- `n-rate` exposes `index` in the default slot, closes [#4413](https://github.com/tusen-ai/naive-ui/issues/4413).
+- `n-scrollbar` adds `size` prop, closes [#3896](https://github.com/tusen-ai/naive-ui/issues/3896).
+- `n-select` adds `keyboard` prop, closes [#4340](https://github.com/tusen-ai/naive-ui/issues/4340).
+- `n-data-table`'s `render-expand-icon` add `expanded` param, closes [#4439](https://github.com/tusen-ai/naive-ui/issues/4439).
+
+### i18n
+
+- Update zhTw locale.
 
 ## 2.34.3
 

CHANGELOG.zh-CN.md

@@ -4,16 +4,26 @@
 
 ### Fixes
 
+- 修复 `n-notification` 的 `description` 有英文时没有自动换行, closes [#4609](https://github.com/tusen-ai/naive-ui/issues/4609).
 - 修复 `n-dynamic-input` 的 `on-remove` 方法返回被删除的数据下标 `index` 时 `value[index]` 已经不存在
 - 修复 `n-dynamic-input` 在点击添加按钮后 `on-create` 返回的 `index` 不正确
 - 修复 `trTR` 国际化，关闭 [#4231](https://github.com/tusen-ai/naive-ui/issues/4231)
+- 修复 `n-input` 同时使用 `password` 和 `disabled` 时，显示密码图标偏移的问题，关闭 [#4364](https://github.com/tusen-ai/naive-ui/issues/4364)
 - 修复 `n-upload` 内部使用 vue `TransitionGroup` 组件时, 传递了未声明的 prop 且未被自动继承导致警告, 关闭[#4447](https://github.com/tusen-ai/naive-ui/issues/4447)
 
 ### Feats
 
 - `n-dynamic-input` 新增 `action` slot，关闭 [#3981](https://github.com/tusen-ai/naive-ui/issues/3981)
 - `n-dynamic-input` 新增 `disabled` 属性，关闭 [#4055](https://github.com/tusen-ai/naive-ui/issues/4055)
 - `n-data-table` 新增 `titleAlign` 属性，关闭 [#3954](https://github.com/tusen-ai/naive-ui/issues/3954)
+- `n-rate` 默认 slot 提供 `index` 序号，关闭 [#4413](https://github.com/tusen-ai/naive-ui/issues/4413)
+- `n-scrollbar` 新增 `size` 属性，关闭 [#3896](https://github.com/tusen-ai/naive-ui/issues/3896)
+- `n-select` 新增 `keyboard` 属性，[#4340](https://github.com/tusen-ai/naive-ui/issues/4340)
+- `n-data-table` 的 `render-expand-icon` 属性新增 `expanded` 参数，关闭 [#4439](https://github.com/tusen-ai/naive-ui/issues/4439)
+
+### i18n
+
+- 更新 zhTw 国际化
 
 ## 2.34.3
 

src/button/demos/enUS/icon.demo.vue

@@ -22,6 +22,7 @@ Icons can be used in buttons. You can use `render-icon` prop or `icon` slot.
 
 <script lang="ts">
 import { CashOutline as CashIcon } from '@vicons/ionicons5'
+import { NIcon } from 'naive-ui'
 import { defineComponent, h } from 'vue'
 
 export default defineComponent({
@@ -31,7 +32,9 @@ export default defineComponent({
   setup () {
     return {
       renderIcon () {
-        return h(CashIcon)
+        return h(NIcon, null, {
+          default: () => h(CashIcon)
+        })
       }
     }
   }

src/button/demos/zhCN/icon.demo.vue

@@ -22,6 +22,7 @@
 
 <script lang="ts">
 import { CashOutline as CashIcon } from '@vicons/ionicons5'
+import { NIcon } from 'naive-ui'
 import { defineComponent, h } from 'vue'
 
 export default defineComponent({
@@ -31,7 +32,9 @@ export default defineComponent({
   setup () {
     return {
       renderIcon () {
-        return h(CashIcon)
+        return h(NIcon, null, {
+          default: () => h(CashIcon)
+        })
       }
     }
   }

src/data-table/demos/enUS/index.demo-entry.md

@@ -88,7 +88,7 @@ render-cell.vue
 | pagination | `false \| object` | `false` | See [Pagination props](pagination#Pagination-Props) |  |
 | remote | `boolean` | `false` | If data-table do automatic paging. You may set it to `true` in async usage. |  |
 | render-cell | `(value: any, rowData: object, column: DataTableBaseColumn) => VNodeChild` | `undefined` | Render function of cell, it will be overwritten by columns' `render`. | 2.30.5 |
-| render-expand-icon | `() => VNodeChild` | `undefined` | Render function of expand icon. | 2.32.2 |
+| render-expand-icon | `({ expanded }: { expanded: boolean }) => VNodeChild` | `undefined` | Render function of expand icon. | 2.32.2, `expanded`: NEXT_VERSION |
 | row-class-name | `string \| (rowData: object, rowIndex : number) => string` | `undefined` | Class name of each row. |  |
 | row-key | `(rowData: object) => (number \| string)` | `undefined` | Generate the key of the row by row data (if you don't want to set the key). |  |
 | row-props | `(rowData: object, rowIndex : number) => object` | `undefined` | Customize row attributes. |  |

src/data-table/demos/zhCN/index.demo-entry.md

@@ -98,7 +98,7 @@ expandable-debug.vue
 | pagination | `false \| object` | `false` | 属性参考 [Pagination props](pagination#Pagination-Props) |  |
 | remote | `boolean` | `false` | 表格是否自动分页数据，在异步的状况下你可能需要把它设为 `true` |  |
 | render-cell | `(value: any, rowData: object, column: DataTableBaseColumn) => VNodeChild` | `undefined` | 自定义单元格渲染，优先级低于列的 `render` | 2.30.5 |
-| render-expand-icon | `() => VNodeChild` | `undefined` | 自定义渲染展开图标 | 2.32.2 |
+| render-expand-icon | `({ expanded }: { expanded: boolean }) => VNodeChild` | `undefined` | 自定义渲染展开图标 | 2.32.2, `expanded`: NEXT_VERSION |
 | row-class-name | `string \| (rowData: object, index : number) => string` | `undefined` | 每一行上的类名 |  |
 | row-key | `(rowData: object) => (number \| string)` | `undefined` | 通过行数据创建行的 key（如果你不想给每一行加上 key） |  |
 | row-props | `(rowData: object, rowIndex : number) => object` | `undefined` | 自定义行属性 |  |

src/data-table/src/TableParts/ExpandTrigger.tsx

@@ -1,10 +1,11 @@
-import { h, defineComponent, PropType, VNodeChild } from 'vue'
+import { h, defineComponent, PropType } from 'vue'
 import { ChevronRightIcon } from '../../../_internal/icons'
 import {
   NBaseIcon,
   NBaseLoading,
   NIconSwitchTransition
 } from '../../../_internal'
+import { RenderExpandIcon } from '../interface'
 
 export default defineComponent({
   name: 'DataTableExpandTrigger',
@@ -20,7 +21,7 @@ export default defineComponent({
       required: true
     },
     renderExpandIcon: {
-      type: Function as PropType<() => VNodeChild>
+      type: Function as PropType<RenderExpandIcon>
     }
   },
   render () {
@@ -45,7 +46,9 @@ export default defineComponent({
                   scale={0.88}
                 />
               ) : this.renderExpandIcon ? (
-                this.renderExpandIcon()
+                this.renderExpandIcon({
+                  expanded: this.expanded
+                })
               ) : (
                 <NBaseIcon clsPrefix={clsPrefix} key="base-icon">
                   {{

src/data-table/src/interface.ts

@@ -119,7 +119,7 @@ export const dataTableProps = {
   renderCell: Function as PropType<
   (value: any, rowData: object, column: TableBaseColumn) => VNodeChild
   >,
-  renderExpandIcon: Function as PropType<() => VNodeChild>,
+  renderExpandIcon: Function as PropType<RenderExpandIcon>,
   spinProps: { type: Object as PropType<BaseLoadingExposedProps>, default: {} },
   onLoad: Function as PropType<DataTableOnLoad>,
   'onUpdate:page': [Function, Array] as PropType<
@@ -308,6 +308,11 @@ export type RenderExpand<T = InternalRowData> = (
   row: T,
   index: number
 ) => VNodeChild
+export type RenderExpandIcon = ({
+  expanded
+}: {
+  expanded: boolean
+}) => VNodeChild
 
 // TODO: we should deprecate `index` since it would change after row is expanded
 export type Expandable<T = InternalRowData> = (row: T) => boolean
@@ -387,7 +392,7 @@ export interface DataTableInjection {
   paginationBehaviorOnFilterRef: Ref<'current' | 'first'>
   expandableRef: Ref<Expandable<any> | undefined>
   stickyExpandedRowsRef: Ref<boolean>
-  renderExpandIconRef: Ref<undefined | (() => VNodeChild)>
+  renderExpandIconRef: Ref<undefined | RenderExpandIcon>
   summaryPlacementRef: Ref<'top' | 'bottom'>
   treeMateRef: Ref<TreeMate<InternalRowData, InternalRowData, InternalRowData>>
   scrollbarPropsRef: Ref<ScrollbarProps | undefined>

src/discrete/src/discrete.ts

@@ -15,7 +15,7 @@ export function createDiscreteApi<T extends DiscreteApiType> (
     notificationProviderProps,
     loadingBarProviderProps
   }: DiscreteApiOptions = {}
-): DiscreteApi {
+): DiscreteApi<T> {
   const providersAndProps: Array<{
     type: DiscreteApiType
     Provider: Component

src/input/src/styles/input.cssr.ts

@@ -159,6 +159,9 @@ export default cB('input', `
     cE('placeholder', 'white-space: nowrap;')
   ]),
   cE('eye', `
+    display: flex;
+    align-items: center;
+    justify-content: center;
     transition: color .3s var(--n-bezier);
   `),
   // textarea
@@ -250,9 +253,6 @@ export default cB('input', `
   ]),
   cNotM('disabled', [
     cE('eye', `
-      display: flex;
-      align-items: center;
-      justify-content: center;
       color: var(--n-icon-color);
       cursor: pointer;
     `, [

src/legacy-transfer/tests/Transfer.spec.ts

@@ -12,13 +12,15 @@ describe('n-legacy-transfer', () => {
     expect(wrapper.find('.n-legacy-transfer').attributes('class')).toContain(
       'n-legacy-transfer--disabled'
     )
+    wrapper.unmount()
   })
 
   it('should work with `filterable` prop', () => {
     const wrapper = mount(NLegacyTransfer, { props: { filterable: true } })
     expect(wrapper.find('.n-legacy-transfer').attributes('class')).toContain(
       'n-legacy-transfer--filterable'
     )
+    wrapper.unmount()
   })
 
   it('should work with `filter` prop', async () => {
@@ -35,6 +37,7 @@ describe('n-legacy-transfer', () => {
     await wrapper.find('input').setValue('1')
     await sleep(300)
     expect(onFilter).toHaveBeenCalled()
+    wrapper.unmount()
   })
 
   it('should work with `size` prop', async () => {
@@ -45,6 +48,7 @@ describe('n-legacy-transfer', () => {
       expect(
         wrapper.find('.n-legacy-transfer').attributes('style')
       ).toMatchSnapshot()
+      wrapper.unmount()
     })
   })
 
@@ -62,6 +66,7 @@ describe('n-legacy-transfer', () => {
     expect(wrapper.findAll('input')[1].attributes('placeholder')).toBe(
       'test-target'
     )
+    wrapper.unmount()
   })
 
   it('should work with `source-title`、`target-title` props', async () => {
@@ -77,5 +82,6 @@ describe('n-legacy-transfer', () => {
     expect(
       wrapper.findAll('.n-legacy-transfer-list-header__header')[1].text()
     ).toBe('test-target')
+    wrapper.unmount()
   })
 })

src/list/tests/List.spec.ts

@@ -20,6 +20,7 @@ describe('n-list', () => {
     expect(wrapper.find('.n-list__header').text()).toBe('test header')
     expect(wrapper.find('.n-list__footer').exists()).toBe(true)
     expect(wrapper.find('.n-list__footer').text()).toBe('test footer')
+    wrapper.unmount()
   })
 
   it('should work with n-list-item slots', async () => {
@@ -39,6 +40,7 @@ describe('n-list', () => {
     expect(wrapper.find('.n-list-item__prefix').text()).toBe('test prefix')
     expect(wrapper.find('.n-list-item__suffix').exists()).toBe(true)
     expect(wrapper.find('.n-list-item__suffix').text()).toBe('test suffix')
+    wrapper.unmount()
   })
 
   it('should work with `bordered` prop', async () => {
@@ -54,5 +56,6 @@ describe('n-list', () => {
 
     await wrapper.setProps({ bordered: true })
     expect(wrapper.find('.n-list').classes()).toContain('n-list--bordered')
+    wrapper.unmount()
   })
 })

src/locales/__snapshots__/index.spec.tsx.snap

@@ -1091,7 +1091,7 @@ exports[`locale works 8`] = `
         <div class="n-input n-input--resizable n-input--stateful" style="--n-bezier: cubic-bezier(.4, 0, .2, 1); --n-count-text-color: rgb(118, 124, 130); --n-count-text-color-disabled: rgba(194, 194, 194, 1); --n-color: rgba(255, 255, 255, 1); --n-font-size: 14px; --n-border-radius: 3px; --n-height: 34px; --n-padding-left: 12px; --n-padding-right: 12px; --n-text-color: rgb(51, 54, 57); --n-caret-color: #18a058; --n-text-decoration-color: rgb(51, 54, 57); --n-border: 1px solid rgb(224, 224, 230); --n-border-disabled: 1px solid rgb(224, 224, 230); --n-border-hover: 1px solid #36ad6a; --n-border-focus: 1px solid #36ad6a; --n-placeholder-color: rgba(194, 194, 194, 1); --n-placeholder-color-disabled: rgba(209, 209, 209, 1); --n-icon-size: 16px; --n-line-height-textarea: 1.6; --n-color-disabled: rgb(250, 250, 252); --n-color-focus: rgba(255, 255, 255, 1); --n-text-color-disabled: rgba(194, 194, 194, 1); --n-box-shadow-focus: 0 0 0 2px rgba(24, 160, 88, 0.2); --n-loading-color: #18a058; --n-caret-color-warning: #f0a020; --n-color-focus-warning: rgba(255, 255, 255, 1); --n-box-shadow-focus-warning: 0 0 0 2px rgba(240, 160, 32, 0.2); --n-border-warning: 1px solid #f0a020; --n-border-focus-warning: 1px solid #fcb040; --n-border-hover-warning: 1px solid #fcb040; --n-loading-color-warning: #f0a020; --n-caret-color-error: #d03050; --n-color-focus-error: rgba(255, 255, 255, 1); --n-box-shadow-focus-error: 0 0 0 2px rgba(208, 48, 80, 0.2); --n-border-error: 1px solid #d03050; --n-border-focus-error: 1px solid #de576d; --n-border-hover-error: 1px solid #de576d; --n-loading-color-error: #d03050; --n-clear-color: rgba(194, 194, 194, 1); --n-clear-size: 16px; --n-clear-color-hover: rgba(146, 146, 146, 1); --n-clear-color-pressed: rgba(175, 175, 175, 1); --n-icon-color: rgba(194, 194, 194, 1); --n-icon-color-hover: rgba(146, 146, 146, 1); --n-icon-color-pressed: rgba(175, 175, 175, 1); --n-icon-color-disabled: rgba(209, 209, 209, 1); --n-suffix-text-color: rgb(51, 54, 57);" tabindex="0">
           <div class="n-input-wrapper">
             <!---->
-            <div class="n-input__input"><input type="text" class="n-input__input-el" tabindex="-1" placeholder="Select Year" size="20">
+            <div class="n-input__input"><input type="text" class="n-input__input-el" tabindex="-1" placeholder="Pilih tahun" size="20">
               <!---->
               <!---->
             </div>

src/locales/common/idID.ts

@@ -16,7 +16,7 @@ const idID: NLocale = {
     placeholder: 'Mohon Pilih',
     loading: 'Memuat',
     loadingRequiredMessage: (label: string): string =>
-      `Mohon muat semua ${label}'s turunan sebelum memeriksa.`
+      `Mohon muat semua ${label} sebelum memeriksa.`
   },
   Time: {
     dateFormat: 'dd-MM-yyyy',
@@ -40,15 +40,15 @@ const idID: NLocale = {
     datetimePlaceholder: 'Pilih Tanggal dan Waktu',
     monthPlaceholder: 'Pilih Bulan',
     // FIXME: translation needed
-    yearPlaceholder: 'Select Year',
-    quarterPlaceholder: 'Select Quarter',
+    yearPlaceholder: 'Pilih tahun',
+    quarterPlaceholder: 'Pilih perempat tahun',
     startDatePlaceholder: 'Tanggal Mulai',
     endDatePlaceholder: 'Tanggal Selesai',
     startDatetimePlaceholder: 'Tanggal dan Waktu Mulai',
     endDatetimePlaceholder: 'Tanggal dan Waktu Selesai',
     // FIXME: translation needed
-    startMonthPlaceholder: 'Start Month',
-    endMonthPlaceholder: 'End Month',
+    startMonthPlaceholder: 'Awal bulan',
+    endMonthPlaceholder: 'Akhir bulan',
     monthBeforeYear: true,
     firstDayOfWeek: 6 as 0 | 1 | 2 | 3 | 4 | 5 | 6,
     today: 'Hari ini'
@@ -65,11 +65,11 @@ const idID: NLocale = {
   },
   // TODO: translation
   Transfer: {
-    selectAll: 'Select all',
-    unselectAll: 'Unselect all',
-    clearAll: 'Clear',
-    total: (num: number): string => `Total ${num} items`,
-    selected: (num: number): string => `${num} items selected`
+    selectAll: 'Pilih semua',
+    unselectAll: 'Batalkan pilihan',
+    clearAll: 'Bersihkan',
+    total: (num: number): string => `Total ${num} item`,
+    selected: (num: number): string => `${num} item dipilih`
   },
   Empty: {
     description: 'Tidak ada data'
@@ -103,7 +103,7 @@ const idID: NLocale = {
     create: 'Buat baru'
   },
   ThemeEditor: {
-    title: 'Tema editor',
+    title: 'Pengaturan Tema',
     clearAllVars: 'Bersihkan semua variabel',
     clearSearch: 'Bersihkan pencarian',
     filterCompName: 'Saring nama komponen',
@@ -113,15 +113,15 @@ const idID: NLocale = {
     restore: 'Setel ulang ke awal'
   },
   Image: {
-    tipPrevious: 'Previous picture (←)',
-    tipNext: 'Next picture (→)',
-    tipCounterclockwise: 'Counterclockwise',
-    tipClockwise: 'Clockwise',
+    tipPrevious: 'Gambar sebelumnya (←)',
+    tipNext: 'Gambar berikutnya (→)',
+    tipCounterclockwise: 'Berlawanan arah jarum jam',
+    tipClockwise: 'Searah jarum jam',
     tipZoomOut: 'Zoom out',
     tipZoomIn: 'Zoom in',
-    tipClose: 'Close (Esc)',
+    tipClose: 'Tutup (Esc)',
     // TODO: translation
-    tipOriginalSize: 'Zoom to original size'
+    tipOriginalSize: 'Zoom ke ukuran asli'
   }
 }