@veltra/sheet 2.6.0 → 2.8.0

package/dist/components/sheet/sheet.js

@@ -53,9 +53,17 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 		readonly: {
 			type: Boolean,
 			default: false
+		},
+		colResize: {
+			type: Boolean,
+			default: false
+		},
+		scrollbar: {
+			type: Boolean,
+			default: true
 		}
 	},
-	emits: ["active-sheet-change"],
+	emits: ["active-sheet-change", "col-resize-end"],
 	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
@@ -117,7 +125,8 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			getActiveSheet: () => activeSheet.value,
 			context,
 			formulaBarRef,
-			isFunctionPopupOpen: () => popupTool.value?.popup === "functions"
+			isFunctionPopupOpen: () => popupTool.value?.popup === "functions",
+			onColResizeEnd: (event) => emit("col-resize-end", event)
 		});
 		__expose({
 			workbook,

package/dist/components/sheet/use-sheet-grid.js

@@ -71,9 +71,12 @@ function useSheetGrid(options) {
 			resolveCellRenderer: props.resolveCellRenderer,
 			header: props.header,
 			editors: props.editors,
+			colResize: props.colResize,
+			scrollbar: props.scrollbar,
 			onContextMenu: handleContextMenu,
 			onEditStart: (addr) => formulaBarRef.value?.mirrorGridEdit(addr),
 			onEditEnd: (addr) => formulaBarRef.value?.exitMirror(addr),
+			onColResizeEnd: options.onColResizeEnd,
 			interceptSelection: () => (formulaBarRef.value?.isRefSelecting() ?? false) || (formulaBarRef.value?.isFunctionPopupOpen() ?? false) || (options.isFunctionPopupOpen?.() ?? false),
 			onSelectionIntercept: (range) => formulaBarRef.value?.handleRefSelect(range)
 		});
@@ -182,7 +185,9 @@ function useSheetGrid(options) {
 		props.showRowHeader,
 		props.showColHeader,
 		props.header,
-		props.editors
+		props.editors,
+		props.colResize,
+		props.scrollbar
 	], ([nextRows, nextCols]) => {
 		const sheet = getActiveSheet();
 		if (nextRows != null) sheet.ensureTableSize(nextRows, 0);

package/dist/types/sheet.d.ts

@@ -49,6 +49,16 @@ export interface SheetProps {
   showColHeader?: boolean;
   /** 只读预览（关闭编辑回写、填充柄等写入口） */
   readonly?: boolean;
+  /**
+   * 列宽拖拽（透传 SheetGrid）：readonly 下置 true 仅放开列头 resize 手柄，编辑仍
+   * 关闭；缺省 false 行为不变。变化触发网格重建（构造期选项）
+   */
+  colResize?: boolean;
+  /**
+   * 画布滚动条（透传 SheetGrid → 引擎内建）：内容溢出的轴在画布右/下缘绘制滚动条
+   * （可拖拽 / 点按跳转）；缺省 true。变化触发网格重建（构造期选项）
+   */
+  scrollbar?: boolean;
 }
 export interface SheetEmits {
   /** 激活 sheet 切换（点击 tab 或宿主调用 workbook.activateSheet） */
@@ -56,6 +66,11 @@ export interface SheetEmits {
     sheet: Sheet;
     index: number;
   }): void;
+  /** 列宽拖拽落定（写模型之后）：载荷含列索引与最终宽度 */
+  (name: 'col-resize-end', payload: {
+    col: number;
+    width: number;
+  }): void;
 }
 /** 在组件内部引用 */
 export interface _SheetExposed {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veltra/sheet",
-  "version": "2.6.0",
+  "version": "2.8.0",
   "homepage": "https://github.com/cabinet-fe/ultra-ui#readme",
   "bugs": {
     "url": "https://github.com/cabinet-fe/ultra-ui/issues"
@@ -34,7 +34,7 @@
     }
   },
   "dependencies": {
-    "infinitable": "^0.1.0"
+    "infinitable": "^0.1.2"
   },
   "peerDependencies": {
     "@cat-kit/core": ">=1.2.1",

package/src/components/sheet/__test__/sheet-component.test.ts

@@ -84,6 +84,19 @@ afterEach(() => {
 })
 
 describe('USheet 组件', () => {
+  it('scrollbar 透传引擎内建滚动条（缺省开启，false 关闭并触发重建）', async () => {
+    const exposedOn: { value: SheetExposed | undefined } = { value: undefined }
+    mount(() => ({}), exposedOn)
+    await nextTick()
+    // 引擎缺省 true（undefined 即开启），无需显式下发
+    expect(exposedOn.value!.getGrid()!.getTable().options.scrollbar).toBeUndefined()
+
+    const exposedOff: { value: SheetExposed | undefined } = { value: undefined }
+    mount(() => ({ scrollbar: false }), exposedOff)
+    await nextTick()
+    expect(exposedOff.value!.getGrid()!.getTable().options.scrollbar).toBe(false)
+  })
+
   it('挂载后默认选区 A1：名称框显示 A1、fx 输入栏可用', async () => {
     const workbook = createWorkbook()
     const { el } = mount(() => ({ workbook, rows: 10, cols: 6 }))
@@ -1186,6 +1199,52 @@ describe('USheet 行高/列宽右键菜单', () => {
   })
 })
 
+describe('USheet colResize（readonly 列宽拖拽）', () => {
+  it('readonly + colResize：列头拖宽写模型并 emit col-resize-end（col + 最终宽度）', async () => {
+    const workbook = createWorkbook()
+    const events: Array<{ col: number; width: number }> = []
+    const { el } = mount(() => ({
+      workbook,
+      rows: 10,
+      cols: 6,
+      readonly: true,
+      colResize: true,
+      onColResizeEnd: (event: { col: number; width: number }) => events.push(event)
+    }))
+    await nextTick()
+
+    // 第 0 列右缘（46 + 80 = 126，±4 手柄区）列头带内拖拽：宽 = 起始 80 + 指针位移 42
+    const instance = el.querySelector<HTMLElement>('.u-sheet__grid-instance')!
+    fire(instance, 'pointerdown', { clientX: 124, clientY: 10 })
+    fire(instance, 'pointermove', { clientX: 166, clientY: 10 })
+    fire(instance, 'pointerup', { clientX: 166, clientY: 10 })
+    await nextTick()
+    expect(events).toEqual([{ col: 0, width: 122 }])
+    expect(workbook.activeSheet.getColWidth(0)).toBe(122)
+  })
+
+  it('缺省 readonly 仍禁列宽拖拽（不 emit）', async () => {
+    const workbook = createWorkbook()
+    const events: Array<{ col: number; width: number }> = []
+    const { el } = mount(() => ({
+      workbook,
+      rows: 10,
+      cols: 6,
+      readonly: true,
+      onColResizeEnd: (event: { col: number; width: number }) => events.push(event)
+    }))
+    await nextTick()
+
+    const instance = el.querySelector<HTMLElement>('.u-sheet__grid-instance')!
+    fire(instance, 'pointerdown', { clientX: 124, clientY: 10 })
+    fire(instance, 'pointermove', { clientX: 166, clientY: 10 })
+    fire(instance, 'pointerup', { clientX: 166, clientY: 10 })
+    await nextTick()
+    expect(events).toEqual([])
+    expect(workbook.activeSheet.getColWidth(0)).toBeUndefined()
+  })
+})
+
 describe('fx 选区锚点', () => {
   const A1_ANCHOR = { minCol: 0, minRow: 0, maxCol: 0, maxRow: 0 }
 

package/src/components/sheet/sheet.vue

@@ -111,7 +111,9 @@ const props = withDefaults(defineProps<SheetProps>(), {
   showTabs: true,
   showRowHeader: true,
   showColHeader: true,
-  readonly: false
+  readonly: false,
+  colResize: false,
+  scrollbar: true
 })
 
 const emit = defineEmits<SheetEmits>()
@@ -215,7 +217,8 @@ const { rebuildGrid, activateGrid, pruneCache, getGrid, setSelectionAnchor } = u
   context,
   formulaBarRef,
   // 工具栏「函数」弹框打开期间与 fx 入口一致：画布点击不清除目标格高亮
-  isFunctionPopupOpen: () => popupTool.value?.popup === 'functions'
+  isFunctionPopupOpen: () => popupTool.value?.popup === 'functions',
+  onColResizeEnd: (event) => emit('col-resize-end', event)
 })
 
 const exposed: _SheetExposed = {

package/src/components/sheet/use-sheet-grid.ts

@@ -39,6 +39,8 @@ interface UseSheetGridOptions {
   formulaBarRef: ElRef<FormulaBarMirror>
   /** 函数弹框打开中（宿主侧入口，如工具栏「函数」按钮） */
   isFunctionPopupOpen?: () => boolean
+  /** 列宽拖拽落定（SheetGrid 透传 → 宿主 emit col-resize-end） */
+  onColResizeEnd?: (event: { col: number; width: number }) => void
 }
 
 /** 缓存实例（LRU 淘汰）：每个 sheet 一个独立容器 div，非激活容器 visibility:hidden 堆叠 */
@@ -128,9 +130,12 @@ export function useSheetGrid(options: UseSheetGridOptions) {
       resolveCellRenderer: props.resolveCellRenderer,
       header: props.header,
       editors: props.editors,
+      colResize: props.colResize,
+      scrollbar: props.scrollbar,
       onContextMenu: handleContextMenu,
       onEditStart: (addr) => formulaBarRef.value?.mirrorGridEdit(addr),
       onEditEnd: (addr) => formulaBarRef.value?.exitMirror(addr),
+      onColResizeEnd: options.onColResizeEnd,
       // 引用选择：不回写模型选区，序列化为 A1 / A1:B2 交给公式栏；
       // 函数弹框打开期间（fx / 工具栏两入口）同样拦截，画布点击不离开目标格
       interceptSelection: () =>
@@ -268,7 +273,9 @@ export function useSheetGrid(options: UseSheetGridOptions) {
         props.showRowHeader,
         props.showColHeader,
         props.header,
-        props.editors
+        props.editors,
+        props.colResize,
+        props.scrollbar
       ] as const,
     ([nextRows, nextCols]) => {
       const sheet = getActiveSheet()

package/src/types/sheet.ts

@@ -57,11 +57,23 @@ export interface SheetProps {
   showColHeader?: boolean
   /** 只读预览（关闭编辑回写、填充柄等写入口） */
   readonly?: boolean
+  /**
+   * 列宽拖拽（透传 SheetGrid）：readonly 下置 true 仅放开列头 resize 手柄，编辑仍
+   * 关闭；缺省 false 行为不变。变化触发网格重建（构造期选项）
+   */
+  colResize?: boolean
+  /**
+   * 画布滚动条（透传 SheetGrid → 引擎内建）：内容溢出的轴在画布右/下缘绘制滚动条
+   * （可拖拽 / 点按跳转）；缺省 true。变化触发网格重建（构造期选项）
+   */
+  scrollbar?: boolean
 }
 
 export interface SheetEmits {
   /** 激活 sheet 切换（点击 tab 或宿主调用 workbook.activateSheet） */
   (name: 'active-sheet-change', payload: { sheet: Sheet; index: number }): void
+  /** 列宽拖拽落定（写模型之后）：载荷含列索引与最终宽度 */
+  (name: 'col-resize-end', payload: { col: number; width: number }): void
 }
 
 /** 在组件内部引用 */