niuma-ui 1.1.3 → 1.1.6

package/CHANGELOG.md

@@ -6,6 +6,43 @@
 
 ## [Unreleased]
 
+## [1.1.6] - 2026-08-20
+
+### 变更
+
+- `package.json` 增加 `sideEffects`（仅 CSS）：宿主从入口 barrel 按需导入时，可摇掉未使用的 Monaco / Terminal / CodeMirror。按文档具名导入并引入 `niuma-ui/styles.css` 的用法不受影响。
+
+## [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
 
 ### 新增
@@ -122,7 +159,10 @@
 
 - 1.0 之前的私有 tag（如 `v0.1.0`）仅作历史记录；新接入请依赖 `v1.0.0` 及之后版本。
 
-[Unreleased]: https://github.com/Blair-Shang/niuma-ui/compare/v1.1.3...HEAD
+[Unreleased]: https://github.com/Blair-Shang/niuma-ui/compare/v1.1.6...HEAD
+[1.1.6]: https://github.com/Blair-Shang/niuma-ui/releases/tag/v1.1.6
+[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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "niuma-ui",
-  "version": "1.1.3",
+  "version": "1.1.6",
   "license": "Apache-2.0",
   "type": "module",
   "description": "Vue 3 设计系统与 Rs* 组件库（--rs-* token）",
@@ -44,6 +44,10 @@
     "README.en.md",
     "CHANGELOG.md"
   ],
+  "sideEffects": [
+    "**/*.css",
+    "**/*.scss"
+  ],
   "peerDependencies": {
     "vue": "^3.5.39"
   },

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__/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;
 }

package/src/components/RsMonacoEditor.vue

@@ -10,6 +10,11 @@ import {
   MONACO_MYSQL_LANGUAGE,
   MONACO_DAMENG_LANGUAGE,
   MONACO_KINGBASE_LANGUAGE,
+  MONACO_POSTGRESQL_LANGUAGE,
+  MONACO_CLICKHOUSE_LANGUAGE,
+  MONACO_SQLITE_LSP_LANGUAGE,
+  MONACO_SQLSERVER_LANGUAGE,
+  MONACO_ORACLE_LANGUAGE,
 } from '../monaco/languages'
 /** VS Code 式调试装饰样式（断点 / 当前行）；业务组件勿再自定义 glyph CSS */
 import '../monaco/debug-decorations.css'
@@ -220,11 +225,16 @@ function completionPrefix(line: string): string {
 }
 
 function isManagedSqlDialect(language: string | undefined): boolean {
-  // mysql / dameng / kingbase：Bridge LSP 接管补全；勿再注册实例级 Provider
+  // Bridge LSP 接管补全；勿再注册实例级 Provider / wordBased
   return (
     language === MONACO_MYSQL_LANGUAGE ||
     language === MONACO_DAMENG_LANGUAGE ||
-    language === MONACO_KINGBASE_LANGUAGE
+    language === MONACO_KINGBASE_LANGUAGE ||
+    language === MONACO_POSTGRESQL_LANGUAGE ||
+    language === MONACO_CLICKHOUSE_LANGUAGE ||
+    language === MONACO_SQLITE_LSP_LANGUAGE ||
+    language === MONACO_SQLSERVER_LANGUAGE ||
+    language === MONACO_ORACLE_LANGUAGE
   )
 }
 
@@ -377,7 +387,7 @@ function initEditor(): void {
     wordWrap: 'on',
     bracketPairColorization: { enabled: true },
     padding: { top: 8, bottom: 8 },
-    renderLineHighlight: 'gutter',
+    renderLineHighlight: 'line',
     smoothScrolling: true,
     cursorSmoothCaretAnimation: 'on',
     folding: true,
@@ -388,7 +398,7 @@ function initEditor(): void {
     lineDecorationsWidth: props.glyphMargin ? 16 : 4,
     overviewRulerLanes: 0,
     hideCursorInOverviewRuler: true,
-    // Shell：业务 completionRequest；mysql/dameng/kingbase：Bridge LSP；避免 wordBased 抢补全
+    // Shell：业务 completionRequest；SQL 方言：Bridge LSP；避免 wordBased 抢补全
     quickSuggestions: props.language === MONACO_MONGODB_SHELL_LANGUAGE
       ? { other: true, comments: false, strings: true }
       : true,

package/src/components/RsSelect.vue

@@ -90,6 +90,9 @@ const props = withDefaults(
     block?: boolean
     invalid?: boolean
     showValidateMessage?: boolean
+    /**
+     * 自定义过滤；`false` 关闭。默认 `true`（必须显式默认，否则 Vue 会把 boolean 联合类型当成 Boolean prop，未传入即 `false`，可搜索列表永远不过滤）。
+     */
     filterOption?: RsSelectFilterOption | boolean
     optionFilterProp?: RsSelectOptionFilterProp
     maxTagCount?: number
@@ -101,6 +104,11 @@ const props = withDefaults(
     maxTagTooltip?: boolean
     tokenSeparators?: string[]
     autoClearSearchValue?: boolean
+    /**
+     * 打开下拉时把当前选中项写入搜索框并参与过滤。
+     * 默认 false：搜索框保持空白（Reka 挂载时会写选中值，需显式清掉）。
+     */
+    fillSearchWithValue?: boolean
     showArrow?: boolean
     listHeight?: number
     placement?: RsSelectPlacement
@@ -126,11 +134,13 @@ const props = withDefaults(
     loading: false,
     matchTriggerWidth: false,
     block: false,
+    filterOption: true,
     optionFilterProp: 'label',
     optionLabelProp: 'label',
     labelInValue: false,
     maxTagTooltip: true,
     autoClearSearchValue: true,
+    fillSearchWithValue: false,
     showArrow: true,
     listHeight: 256,
     placement: 'bottom',