niuma-ui 1.1.1 → 1.1.5

package/CHANGELOG.md

@@ -6,6 +6,53 @@
 
 ## [Unreleased]
 
+## [1.1.5] - 2026-08-19
+
+### 修复
+
+- 命令式 `rsConfirm` / `openRsDialog`：销毁改为幂等，并在测试收尾走正规 `unmount`（不再先拆 Teleport 节点）。避免 Vue 卸载时 `nextSibling` 未处理异常导致 CI 失败。
+
+## [1.1.4] - 2026-08-19
+
+### 新增
+
+- `RsDialog`：`layout="form"` 作为居中轻量表单/说明窗的正式布局；`layout="confirm"` 仍可用，开发环境继续警告并视作 form 的历史别名。确认/提示请用 `RsConfirmDialog` / `rsConfirm`。
+- `RsSelect.fillSearchWithValue`：打开下拉时把当前选中项写入搜索框并参与过滤（默认 `false`，搜索框保持空白）。
+- **RsIcon `postgres`**：PostgreSQL 官方大象品牌图标，token `--rs-icon-postgres-accent`。
+- `MONACO_POSTGRESQL_LANGUAGE`（`postgresql`）：官方 PostgreSQL 的 Monaco languageId，走 Bridge LSP；`RsMonacoEditor` 对 postgresql / clickhouse / sqlite / sqlserver / oracle 同样不再注册实例级补全。
+- `RsTerminal`：`selectionChange` 事件；expose `getSelection` / `hasSelection` / `getGeometry` 与类型 `RsTerminalExpose` / `RsTerminalGeometry`。
+- `src/dev/vite-xterm-deps.ts`：供宿主 Vite `optimizeDeps` 预构建 xterm，避免控制台首次加载 504。
+
+### 变更
+
+- `RsSelect`：`filterOption` 默认 `true`（修复 Vue 把 boolean 联合类型当成 Boolean prop，未传入即 `false`、可搜索列表永远不过滤）。
+- `RsSelect`：`searchable` 一律走本地过滤并关掉 Reka 内置 filter，避免手输关键字时匹配项被挡住。
+- `RsTerminal`：`inheritAttrs: false`，`class` / `style` 落到 `.rs-terminal`；`wheelScrollModifier="shift"` 仅在备用屏（vim/top）把滚轮转成方向键，普通 shell 滚历史。
+- `RsTableColumn.tooltip`：只写格子里看不到的额外提示；可见文本被截断时用 `ellipsis`。
+- `RsMonacoEditor`：当前行高亮改为整行 `line`（不再只画 gutter）。
+
+### 修复
+
+- `RsTable`：自定义 slot + `ellipsis` 也能挂溢出 tooltip；slot 不再 `max-width: 100%` 导致溢出检测失效。
+- `RsTable` 共享 tooltip：z-index 改为 `--rs-z-dropdown`；`findTipHost` 兼容文本节点，避免悬停到文字时丢宿主。
+- `RsTerminal`：宿主负字距不再让 xterm 行尾被裁；xterm 6 空 viewport 滚动条不再挡住最后一列；滑块对齐 RsScrollbar；flex 项 `min-width: 0` 以便列数随容器收缩。
+
+## [1.1.3] - 2026-08-14
+
+### 新增
+
+- **RsDrawer 内边缘拖拽缩放**：默认 `resizable`（`size=full` 除外）。左右改宽、上下改高，可配 `minSize` / `maxSize`，支持键盘方向键。
+
+### 修复
+
+- **RsDrawer 贴边定位**：覆盖 Reka DialogContent 默认居中，避免抽屉被压成标题条。
+
+## [1.1.2] - 2026-08-14
+
+### 修复
+
+- **RsIcon 在 pnpm/npm 宿主中为空**：不再用 `import.meta.glob` 扫 `node_modules/@lucide/vue`（该路径在 pnpm 虚拟 store 下不存在）。改为 `import * as LucideVue from '@lucide/vue'`，走正常包解析，宿主安装 `niuma-ui` 即可使用图标。
+
 ## [1.1.1] - 2026-08-14
 
 ### 修复
@@ -106,7 +153,11 @@
 
 - 1.0 之前的私有 tag（如 `v0.1.0`）仅作历史记录；新接入请依赖 `v1.0.0` 及之后版本。
 
-[Unreleased]: https://github.com/Blair-Shang/niuma-ui/compare/v1.1.1...HEAD
+[Unreleased]: https://github.com/Blair-Shang/niuma-ui/compare/v1.1.5...HEAD
+[1.1.5]: https://github.com/Blair-Shang/niuma-ui/releases/tag/v1.1.5
+[1.1.4]: https://github.com/Blair-Shang/niuma-ui/releases/tag/v1.1.4
+[1.1.3]: https://github.com/Blair-Shang/niuma-ui/releases/tag/v1.1.3
+[1.1.2]: https://github.com/Blair-Shang/niuma-ui/releases/tag/v1.1.2
 [1.1.1]: https://github.com/Blair-Shang/niuma-ui/releases/tag/v1.1.1
 [1.1.0]: https://github.com/Blair-Shang/niuma-ui/releases/tag/v1.1.0
 [1.0.2]: https://github.com/Blair-Shang/niuma-ui/releases/tag/v1.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "niuma-ui",
-  "version": "1.1.1",
+  "version": "1.1.5",
   "license": "Apache-2.0",
   "type": "module",
   "description": "Vue 3 设计系统与 Rs* 组件库（--rs-* token）",

package/src/__tests__/RsDialog.spec.ts

@@ -107,10 +107,23 @@ describe('RsDialog', () => {
     await flushPromises()
     const content = document.body.querySelector('.rs-dialog__content')
     expect(content?.classList.contains('rs-dialog__content--confirm')).toBe(true)
+    expect(content?.classList.contains('rs-dialog__content--form')).toBe(true)
     expect(content?.classList.contains('rs-dialog__content--sm')).toBe(true)
     wrapper.unmount()
   })
 
+  it('applies form layout without confirm deprecation class-only alias', async () => {
+    const wrapper = mount(RsDialog, {
+      props: { open: true, title: '表单', width: 'sm', layout: 'form', resizable: false, fullscreenable: false },
+      attachTo: document.body,
+    })
+    await flushPromises()
+    const content = document.body.querySelector('.rs-dialog__content')
+    expect(content?.classList.contains('rs-dialog__content--form')).toBe(true)
+    expect(content?.classList.contains('rs-dialog__content--confirm')).toBe(false)
+    wrapper.unmount()
+  })
+
   it('renders footer slot', async () => {
     const wrapper = mount(RsDialog, {
       props: { open: true, title: '保存' },

package/src/__tests__/RsDrawer.spec.ts

@@ -235,4 +235,52 @@ describe('RsDrawer', () => {
     expect(closeBtn.querySelector('.rs-btn__tooltip')?.textContent).toContain('Close')
     wrapper.unmount()
   })
+
+  it('renders an inner-edge resize handle by default', async () => {
+    const wrapper = mount(RsDrawer, {
+      props: { open: true, title: '帮助' },
+      attachTo: document.body,
+    })
+    await flushPromises()
+    const handle = document.body.querySelector('.rs-drawer__resize') as HTMLElement | null
+    expect(handle).toBeTruthy()
+    expect(handle?.getAttribute('aria-orientation')).toBe('vertical')
+    wrapper.unmount()
+  })
+
+  it('hides the resize handle when size is full or resizable is false', async () => {
+    const full = mount(RsDrawer, {
+      props: { open: true, title: '全屏', size: 'full' },
+      attachTo: document.body,
+    })
+    await flushPromises()
+    expect(document.body.querySelector('.rs-drawer__resize')).toBeNull()
+    full.unmount()
+
+    const locked = mount(RsDrawer, {
+      props: { open: true, title: '固定', resizable: false },
+      attachTo: document.body,
+    })
+    await flushPromises()
+    expect(document.body.querySelector('.rs-drawer__resize')).toBeNull()
+    locked.unmount()
+  })
+
+  it('widens a right drawer with ArrowLeft on the resize handle', async () => {
+    const wrapper = mount(RsDrawer, {
+      props: { open: true, title: '缩放', width: 360 },
+      attachTo: document.body,
+    })
+    await flushPromises()
+    const content = document.body.querySelector('.rs-drawer__content') as HTMLElement
+    Object.defineProperty(content, 'getBoundingClientRect', {
+      configurable: true,
+      value: () => ({ width: 360, height: 800, top: 0, left: 800, right: 1160, bottom: 800, x: 800, y: 0, toJSON: () => ({}) }),
+    })
+    const handle = document.body.querySelector('.rs-drawer__resize') as HTMLElement
+    await handle.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft', bubbles: true }))
+    await flushPromises()
+    expect(content.style.width).toBe('376px')
+    wrapper.unmount()
+  })
 })

package/src/__tests__/RsIcon.spec.ts

@@ -109,6 +109,15 @@ describe('RsIcon', () => {
     expect(isRsIconName('sqlserver')).toBe(true)
   })
 
+  it('loads custom postgres icon', () => {
+    const icon = resolveLucideIcon('postgres')
+    expect(icon).toBeTruthy()
+    const wrapper = mount(RsIcon, { props: { name: 'postgres' } })
+    expect(wrapper.find('svg.rs-icon').exists()).toBe(true)
+    expect(wrapper.find('.postgres-icon__mark').exists()).toBe(true)
+    expect(isRsIconName('postgres')).toBe(true)
+  })
+
   it('loads arbitrary lucide icon by name', () => {
     const icon = resolveLucideIcon('trash-2')
     expect(icon).toBeTruthy()
@@ -205,6 +214,11 @@ describe('RsIcon', () => {
     expect(wrapper.find('svg').attributes('style')).toContain('--rs-icon-sqlserver-accent: #34C759')
   })
 
+  it('applies accent color to custom postgres icon', () => {
+    const wrapper = mount(RsIcon, { props: { name: 'postgres', color: '#34C759' } })
+    expect(wrapper.find('svg').attributes('style')).toContain('--rs-icon-postgres-accent: #34C759')
+  })
+
   it('applies rotate transform', () => {
     const wrapper = mount(RsIcon, { props: { name: 'chevron-right', rotate: 90 } })
     expect(wrapper.find('svg').attributes('style')).toContain('rotate(90deg)')

package/src/__tests__/RsSelect.spec.ts

@@ -296,6 +296,68 @@ describe('RsSelect', () => {
     expect(root.props('ignoreFilter')).toBe(true)
   })
 
+  it('enables manual filter when searchable so query hides non-matches', async () => {
+    const typeOptions = [
+      { label: 'INT', value: 'INT' },
+      { label: 'BIGINT', value: 'BIGINT' },
+      { label: 'NVARCHAR', value: 'NVARCHAR' },
+      { label: 'NVARCHAR(MAX)', value: 'NVARCHAR(MAX)' },
+    ]
+    const wrapper = mount(RsSelect, {
+      props: {
+        options: typeOptions,
+        modelValue: 'BIGINT',
+        searchable: true,
+        creatable: true,
+      },
+      attachTo: document.body,
+    })
+    const root = wrapper.getComponent({ name: 'ComboboxRoot' })
+    expect(root.props('ignoreFilter')).toBe(true)
+
+    await wrapper.find('.rs-select__trigger').trigger('click')
+    await flushPromises()
+    const input = document.querySelector('.rs-select__search') as HTMLInputElement | null
+    expect(input).toBeTruthy()
+    input!.value = 'NVA'
+    input!.dispatchEvent(new Event('input', { bubbles: true }))
+    await flushPromises()
+
+    const labels = [...document.querySelectorAll('.rs-select__item-label')].map(
+      (el) => el.textContent?.trim() ?? '',
+    )
+    expect(labels).toContain('NVARCHAR')
+    expect(labels).toContain('NVARCHAR(MAX)')
+    expect(labels).not.toContain('INT')
+    expect(labels).not.toContain('BIGINT')
+    expect(document.querySelector('.rs-select__item--create')?.textContent).toContain('NVA')
+    wrapper.unmount()
+  })
+
+  it('filterOption false keeps the full list while typing', async () => {
+    const wrapper = mount(RsSelect, {
+      props: {
+        options,
+        modelValue: '',
+        searchable: true,
+        filterOption: false,
+      },
+      attachTo: document.body,
+    })
+    await wrapper.find('.rs-select__trigger').trigger('click')
+    await flushPromises()
+    const input = document.querySelector('.rs-select__search') as HTMLInputElement | null
+    input!.value = 'zzz'
+    input!.dispatchEvent(new Event('input', { bubbles: true }))
+    await flushPromises()
+    const labels = [...document.querySelectorAll('.rs-select__item-label')].map(
+      (el) => el.textContent?.trim() ?? '',
+    )
+    expect(labels).toContain('GPT-4o')
+    expect(labels).toContain('Claude')
+    wrapper.unmount()
+  })
+
   it('creatable enables search and commits typed value on Enter', async () => {
     const wrapper = mount(RsSelect, {
       props: { options, modelValue: '', creatable: true },
@@ -574,6 +636,40 @@ describe('RsSelect', () => {
     wrapper.unmount()
   })
 
+  it('does not fill search with the selected value when opening', async () => {
+    const wrapper = mount(RsSelect, {
+      props: { options, modelValue: 'claude', searchable: true },
+      attachTo: document.body,
+    })
+    await wrapper.find('.rs-select__trigger').trigger('click')
+    await flushPromises()
+    const input = document.querySelector('.rs-select__search') as HTMLInputElement | null
+    expect(input?.value).toBe('')
+    const labels = [...document.querySelectorAll('.rs-select__item-label')].map(
+      (el) => el.textContent?.trim() ?? '',
+    )
+    expect(labels).toContain('GPT-4o')
+    expect(labels).toContain('Claude')
+    wrapper.unmount()
+  })
+
+  it('fills search with the selected label when fillSearchWithValue', async () => {
+    const wrapper = mount(RsSelect, {
+      props: { options, modelValue: 'claude', searchable: true, fillSearchWithValue: true },
+      attachTo: document.body,
+    })
+    await wrapper.find('.rs-select__trigger').trigger('click')
+    await flushPromises()
+    const input = document.querySelector('.rs-select__search') as HTMLInputElement | null
+    expect(input?.value).toBe('Claude')
+    const labels = [...document.querySelectorAll('.rs-select__item-label')].map(
+      (el) => el.textContent?.trim() ?? '',
+    )
+    expect(labels).toContain('Claude')
+    expect(labels).not.toContain('GPT-4o')
+    wrapper.unmount()
+  })
+
   it('renders dropdownRender instead of the default panel body', async () => {
     const wrapper = mount(RsSelect, {
       props: { options, modelValue: '' },

package/src/__tests__/RsTable.spec.ts

@@ -372,6 +372,23 @@ describe('RsTable', () => {
     expect(cell.attributes('style')).toContain('width: 80px')
   })
 
+  it('attaches overflow tooltip on slotted ellipsis columns', () => {
+    const wrapper = mount(RsTable, {
+      props: {
+        columns: [{ key: 'name', title: '名称', ellipsis: true, width: 80 }],
+        data: [{ id: '1', name: '很长的名字' }],
+      },
+      slots: {
+        name: ({ row }: { row: { name: string } }) => row.name,
+      },
+    })
+    const tip = wrapper.find('.rs-table__cell-tip')
+    expect(tip.exists()).toBe(true)
+    expect(tip.attributes('data-rs-table-tip-mode')).toBe('overflow')
+    expect(tip.attributes('data-rs-table-tip-text')).toBe('很长的名字')
+    wrapper.unmount()
+  })
+
   it('shows shared cell tooltip on ellipsis overflow hover', async () => {
     vi.useFakeTimers()
     const wrapper = mount(RsTable, {

package/src/__tests__/createRsDialog.spec.ts

@@ -1,13 +1,15 @@
 import { h } from 'vue'
 import { afterEach, describe, expect, it } from 'vitest'
 import { flushPromises } from '@vue/test-utils'
-import { openRsDialog, rsConfirm } from '../composables/createRsDialog'
+import {
+  destroyAllRsDialogHosts,
+  openRsDialog,
+  rsConfirm,
+} from '../composables/createRsDialog'
 
 describe('createRsDialog', () => {
   afterEach(() => {
-    document.body.querySelectorAll('.rs-dialog__content, .rs-confirm-dialog__content').forEach((el) => {
-      el.closest('body > div')?.remove()
-    })
+    destroyAllRsDialogHosts()
   })
 
   it('rsConfirm resolves true when confirm clicked', async () => {
@@ -83,6 +85,17 @@ describe('createRsDialog', () => {
     await expect(promise).resolves.toBe(true)
   })
 
+  it('destroy does not throw after portal node was removed', async () => {
+    const handle = openRsDialog({
+      title: '残留',
+      showOverlay: false,
+      body: () => 'portal',
+    })
+    await flushPromises()
+    document.body.querySelector('.rs-dialog__content')?.closest('body > div')?.remove()
+    expect(() => handle.destroy()).not.toThrow()
+  })
+
   it('openRsDialog mounts builtin footer and can destroy', async () => {
     const handle = openRsDialog({
       title: '命令式',

package/src/components/RsDialog.vue

@@ -47,13 +47,14 @@ const props = withDefaults(
     /**
      * 宽度：`sm` / `md` / `lg`，或 number(px) / `px` / `rem` / `%`。
      * window：打开时折成像素后居中（`%` 相对视口扣除 inset），之后可拖拽缩放。
-     * confirm：自定义宽度按 CSS 写入。
+     * form / confirm：自定义宽度按 CSS 写入。
      */
     width?: RsDialogWidth
     tone?: RsFeedbackTone
     /**
-     * window：可拖拽/缩放工作窗（推荐）。
-     * confirm：历史兼容的居中轻量窗；新代码的确认/提示请用 RsConfirmDialog。
+     * window：可拖拽/缩放工作窗。
+     * form：居中轻量表单/说明窗（高度随内容，默认不可缩放）。
+     * confirm：历史别名，等同 form；确认/提示请用 RsConfirmDialog。
      */
     layout?: RsDialogLayout
     draggable?: boolean
@@ -143,8 +144,8 @@ const attrs = useAttrs()
 const slots = useSlots()
 const { t } = useRsI18n()
 
-const isWindowLayout = computed(() => props.layout === 'window')
-const isConfirmLayout = computed(() => props.layout === 'confirm')
+const isCompactLayout = computed(() => props.layout === 'form' || props.layout === 'confirm')
+const isWindowLayout = computed(() => !isCompactLayout.value)
 const enableDraggable = computed(() => props.draggable && isWindowLayout.value)
 const enableResizable = computed(() => props.resizable && isWindowLayout.value)
 const deferBodyMount = computed(() => props.deferBodyMount ?? isWindowLayout.value)
@@ -263,7 +264,8 @@ const contentClass = computed(() => {
     ? `rs-dialog__content--${props.width}`
     : 'rs-dialog__content--custom-width'
   return [
-    `rs-dialog__content--${props.layout}`,
+    isCompactLayout.value ? 'rs-dialog__content--form' : 'rs-dialog__content--window',
+    props.layout === 'confirm' ? 'rs-dialog__content--confirm' : undefined,
     presetClass,
     `rs-dialog__content--tone-${props.tone}`,
     {
@@ -368,7 +370,7 @@ const {
   initialWidth: initialWidthPx,
   draggable: enableDraggable,
   resizable: enableResizable,
-  compact: isConfirmLayout,
+  compact: isCompactLayout,
   boundsTransition: toRef(props, 'boundsTransition'),
 })
 
@@ -551,7 +553,8 @@ defineExpose({
   color: var(--rs-dialog-title-fg);
 }
 
-/* 亮色 confirm：轻微 vibrancy；window 用实底避免 CEF 下 blur 合成开销 */
+/* 亮色 form：轻微 vibrancy；window 用实底避免 CEF 下 blur 合成开销 */
+[data-rs-theme='light'] .rs-dialog__content--form,
 [data-rs-theme='light'] .rs-dialog__content--confirm {
   background: color-mix(in srgb, var(--rs-dialog-bg) 94%, transparent);
   backdrop-filter: blur(24px) saturate(180%);
@@ -560,10 +563,12 @@ defineExpose({
 [data-rs-theme='light'] .rs-dialog__content--window {
   background: var(--rs-dialog-bg);
 }
-/* confirm 布局：缩放 + 淡入（居中，含 translate）；苹果 sheet 缓动曲线 */
+/* form 布局：缩放 + 淡入（居中，含 translate）；苹果 sheet 缓动曲线 */
+.rs-dialog__content--form[data-state='open'],
 .rs-dialog__content--confirm[data-state='open'] {
   animation: rs-dialog-pop-in 240ms cubic-bezier(0.32, 0.72, 0, 1);
 }
+.rs-dialog__content--form[data-state='closed'],
 .rs-dialog__content--confirm[data-state='closed'] {
   animation: rs-dialog-pop-out 180ms ease;
 }