@borurio-print/print-designer 1.0.2 → 1.0.4

package/README.md

@@ -1,128 +1,130 @@
-# Borurio Print Designer
-
-这是一个 Vue 3 标签打印设计器基础项目，同时支持独立 Web/iframe 页面和 npm 组件包两种使用方式。
-
-## 入口说明
-
-- `src/main.ts`：独立 Web/iframe 入口，创建 Vue 应用并挂载到 `#app`。
-- `src/index.ts`：npm 包入口，只导出组件、类型和语言包，不创建应用。
-- `src/PrintDesigner.vue`：设计器根组件，持有模板、网格和缩放状态。
-
-## 目录职责
-
-- `src/components`：可跨业务模块复用的基础组件，目前包含 Symbol 图标组件。
-- `src/core`：与界面无关的领域类型。
-- `src/locales`：中英文语言包及独立 Web 模式的 i18n 实例。
-- `src/views/print-designer/components`：打印设计器内部使用的界面组件。
-- `src/assets/iconfont`：Iconfont 平台生成的本地 Symbol 脚本，不建议手动修改。
-
-## 构建配置
-
-- `vite.config.ts`：生成可部署到服务器并通过 iframe 打开的 `dist`。
-- `vite.lib.config.ts`：从 `src/index.ts` 生成 npm 使用的 `dist-lib`。
-- `tsconfig.app.json`：检查 Web 应用源码，不输出文件。
-- `tsconfig.lib.json`：为 npm 包生成 TypeScript 声明文件。
-- `tsconfig.node.json`：检查 Vite 配置文件。
-
-## 常用命令
-
-- `pnpm dev`：启动本地 Web 开发服务。
-- `pnpm build:web`：构建 iframe/Web 版本并执行类型检查。
-- `pnpm build:lib`：构建 npm 版本并生成类型声明。
-- `pnpm build`：依次构建 npm 和 Web 两种版本。
-
-## npm 包使用
-
-当前包名为 `@borurio-print/print-designer`。业务项目需要已安装下列 peer dependencies：
-
-- Vue `>=3.2.45 <4.0.0`
-- Element Plus `>=2.3.2 <3.0.0`
-- vue-i18n `>=9.2.2 <12.0.0`
-
-```bash
-npm install @borurio-print/print-designer
-```
-
-如果业务项目尚未安装上述 peer dependencies，再按 npm 提示补充安装。
-二维码、条形码和 PDF 生成库已包含在设计器产物中，业务项目无需另行安装。
-
-在 Vue 页面中引入组件和独立样式文件：
-
-```vue
-<script setup lang="ts">
-import { PrintDesigner } from '@borurio-print/print-designer'
-import '@borurio-print/print-designer/style.css'
-</script>
-
-<template>
-  <div class="print-designer-page">
-    <PrintDesigner />
-  </div>
-</template>
-
-<style scoped>
-.print-designer-page {
-  width: 100%;
-  height: 100vh;
-}
-</style>
-```
-
-组件使用业务应用已经注册的 `vue-i18n` 实例。业务应用需要把组件语言包合并到
-对应语言中：
-
-```ts
-import { createI18n } from 'vue-i18n'
-import {
-  enUS as printDesignerEnUS,
-  zhCN as printDesignerZhCN,
-} from '@borurio-print/print-designer'
-
-const i18n = createI18n({
-  legacy: false,
-  locale: 'zh-CN',
-  messages: {
-    'zh-CN': printDesignerZhCN,
-    'en-US': printDesignerEnUS,
-  },
-})
-
-app.use(i18n)
-```
-
-如果业务应用已经存在语言包，可以使用 `mergeLocaleMessage` 合并，避免覆盖原有文案：
-
-```ts
-i18n.global.mergeLocaleMessage('zh-CN', printDesignerZhCN)
-i18n.global.mergeLocaleMessage('en-US', printDesignerEnUS)
-```
-
-如果业务系统使用 `zh-cn` 和 `en` 作为语言代码，则按实际代码合并：
-
-```ts
-i18n.global.mergeLocaleMessage('zh-cn', printDesignerZhCN)
-i18n.global.mergeLocaleMessage('en', printDesignerEnUS)
-```
-
-## npm 发布
-
-首次发布前，需要确认当前 npm 账号拥有 `@borurio-print` 组织作用域的发布权限。先登录并检查
-即将进入安装包的文件：
-
-```bash
-npm login
-pnpm build:lib
-npm pack --dry-run
-```
-
-确认内容无误后发布公开包：
-
-```bash
-pnpm publish --access public
-```
-
-同一个版本号不能重复发布；后续修改需要先更新 `package.json` 中的版本号。
-
-## 自动生成文件
-
-`src/auto-imports.d.ts` 和 `src/components.d.ts` 由自动按需引入插件生成；`pnpm-lock.yaml` 由 pnpm 生成。这些文件不应手动添加说明或修改内容。
+# Borurio Print Designer
+
+这是一个 Vue 3 标签打印设计器基础项目，同时支持独立 Web/iframe 页面和 npm 组件包两种使用方式。
+
+## 入口说明
+
+- `src/main.ts`：独立 Web/iframe 入口，创建 Vue 应用并挂载到 `#app`。
+- `src/index.ts`：npm 包入口，只导出组件、类型和语言包，不创建应用。
+- `src/PrintDesigner.vue`：设计器根组件，持有模板、网格和缩放状态。
+
+## 目录职责
+
+- `src/components`：可跨业务模块复用的基础组件，目前包含 Symbol 图标组件。
+- `src/core`：与界面无关的领域类型。
+- `src/locales`：中英文语言包及独立 Web 模式的 i18n 实例。
+- `src/views/print-designer/components`：打印设计器内部使用的界面组件。
+- `src/assets/iconfont`：Iconfont 平台生成的本地 Symbol 脚本，不建议手动修改。
+
+## 构建配置
+
+- `vite.config.ts`：生成可部署到服务器并通过 iframe 打开的 `dist`。
+- `vite.lib.config.ts`：从 `src/index.ts` 生成 npm 使用的 `dist-lib`。
+- `tsconfig.app.json`：检查 Web 应用源码，不输出文件。
+- `tsconfig.lib.json`：为 npm 包生成 TypeScript 声明文件。
+- `tsconfig.node.json`：检查 Vite 配置文件。
+
+## 常用命令
+
+- `pnpm dev`：启动本地 Web 开发服务。
+- `pnpm build:web`：构建 iframe/Web 版本并执行类型检查。
+- `pnpm build:lib`：构建 npm 版本并生成类型声明。
+- `pnpm build`：依次构建 npm 和 Web 两种版本。
+
+## npm 包使用
+
+当前包名为 `@borurio-print/print-designer`。业务项目需要已安装下列 peer dependencies：
+
+- Vue `>=3.2.45 <4.0.0`
+- Element Plus `>=2.3.2 <3.0.0`
+- vue-i18n `>=9.2.2 <12.0.0`
+
+```bash
+npm install @borurio-print/print-designer
+```
+
+如果业务项目尚未安装上述 peer dependencies，再按 npm 提示补充安装。
+二维码、条形码和 PDF 生成库已包含在设计器产物中，业务项目无需另行安装。
+
+在 Vue 页面中引入组件和独立样式文件：
+
+```vue
+<script setup lang="ts">
+import { PrintDesigner } from '@borurio-print/print-designer'
+import '@borurio-print/print-designer/style.css'
+</script>
+
+<template>
+  <div class="print-designer-page">
+    <PrintDesigner />
+  </div>
+</template>
+
+<style scoped>
+.print-designer-page {
+  width: 100%;
+  height: 100vh;
+}
+</style>
+```
+
+组件使用业务应用已经注册的 `vue-i18n` 实例。业务应用需要把组件语言包合并到
+对应语言中：
+
+```ts
+import { createI18n } from 'vue-i18n'
+import {
+  enUS as printDesignerEnUS,
+  zhCN as printDesignerZhCN,
+} from '@borurio-print/print-designer'
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'zh-CN',
+  messages: {
+    'zh-CN': printDesignerZhCN,
+    'en-US': printDesignerEnUS,
+  },
+})
+
+app.use(i18n)
+```
+
+如果业务应用已经存在语言包，可以使用 `mergeLocaleMessage` 合并，避免覆盖原有文案：
+
+```ts
+i18n.global.mergeLocaleMessage('zh-CN', printDesignerZhCN)
+i18n.global.mergeLocaleMessage('en-US', printDesignerEnUS)
+```
+
+如果业务系统使用 `zh-cn` 和 `en` 作为语言代码，则按实际代码合并：
+
+```ts
+i18n.global.mergeLocaleMessage('zh-cn', printDesignerZhCN)
+i18n.global.mergeLocaleMessage('en', printDesignerEnUS)
+```
+
+## npm 发布
+
+首次发布前，需要确认当前 npm 账号拥有 `@borurio-print` 组织作用域的发布权限。先登录并检查
+即将进入安装包的文件：
+
+```bash
+npm login
+pnpm build:lib
+npm pack --dry-run
+```
+
+确认内容无误后发布公开包：
+
+```bash
+pnpm publish --access public
+```
+
+同一个版本号不能重复发布；后续修改需要先更新 `package.json` 中的版本号。
+
+## 自动生成文件
+
+`src/auto-imports.d.ts` 和 `src/components.d.ts` 由自动按需引入插件生成；`pnpm-lock.yaml` 由 pnpm 生成。这些文件不应手动添加说明或修改内容。
+
+pnpm publish --access public

package/dist-lib/PrintDesigner.vue.d.ts

@@ -1,3 +1,28 @@
-declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+import type { BusinessFieldGroup, PrintResult, PrintTemplate } from '@/core/types';
+type __VLS_Props = {
+    /**
+     * 由业务系统提供的可打印字段目录。
+     * 设计器只保存字段路径和用户最终选择的展示类型，不感知 WMS、OMS 业务含义。
+     */
+    fieldGroups?: readonly BusinessFieldGroup[];
+};
+declare function getTemplate(): PrintTemplate;
+declare function loadTemplate(template: PrintTemplate): void;
+/** 供业务系统获取 PDF Blob，后续可直接传给本地打印控件。 */
+declare function generatePdf(data: unknown): Promise<Blob>;
+/** 供业务系统直接在浏览器中打开数据打印预览。 */
+declare function previewPdf(data: unknown): Promise<void>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    getTemplate: typeof getTemplate;
+    loadTemplate: typeof loadTemplate;
+    generatePdf: typeof generatePdf;
+    previewPdf: typeof previewPdf;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "print-result": (result: PrintResult) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onPrint-result"?: (result: PrintResult) => any;
+}>, {
+    fieldGroups: readonly BusinessFieldGroup[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist-lib/core/componentRegistry.d.ts

@@ -1,4 +1,5 @@
 import type { DesignerElementType, ElementPropertyConfig, ElementPropertyKey } from './types';
+export type ComponentGroup = 'basic' | 'advanced';
 /**
  * 一个左侧组件的完整能力声明。
  * properties 的顺序同时决定右侧属性编辑器的展示顺序，因此每个组件都能
@@ -6,6 +7,7 @@ import type { DesignerElementType, ElementPropertyConfig, ElementPropertyKey } f
  */
 export interface ComponentDefinition {
     field: DesignerElementType;
+    group: ComponentGroup;
     icon: string;
     titleKey: string;
     properties: readonly ElementPropertyConfig[];
@@ -13,9 +15,10 @@ export interface ComponentDefinition {
 /**
  * 设计器组件注册表。
  *
- * - 文字开放内容、字号、加粗和旋转。
- * - 二维码、条形码开放内容、宽度、高度和旋转。
+ * - 文字开放内容、字号、加粗和旋转；文字框额外开放固定区域排版能力。
+ * - 二维码、条形码、图片开放内容、宽度、高度和旋转。
  * - 边框开放宽高、线宽和旋转；横线、竖线只开放各自长度方向与线宽。
+ * - 表格开放坐标、宽高、列配置、字体、边框线宽和旋转。
  * - 序号和时间暂时保留空属性数组，维持原有入口但不提前引入未完成逻辑。
  */
 export declare const componentItems: readonly ComponentDefinition[];

package/dist-lib/core/dataResolver.d.ts

@@ -0,0 +1,6 @@
+export declare function isRecord(value: unknown): value is Record<string, unknown>;
+export declare function getValueByPath(source: unknown, path: string | undefined): unknown;
+export declare function getRecordArrayByPath(source: unknown, path: string | undefined): Record<string, unknown>[];
+export declare function formatFieldValue(value: unknown): string;
+/** 将文字中的 {field.path} 占位符替换为当前业务记录中的字段值。 */
+export declare function resolveFieldTemplate(template: string, source: unknown): string;

package/dist-lib/core/pdfPageRenderer.d.ts

@@ -0,0 +1,4 @@
+/** 将 PDF 指定页转换为可嵌入 SVG 的图片，并复用相同配置的渲染结果。 */
+export declare function renderPdfPageToDataUrl(source: string, pageNumber: number, widthMm: number, heightMm: number): Promise<string>;
+/** 打印前等待画布内已经发起的 PDF 页面渲染完成。 */
+export declare function waitForPendingPdfRenders(): Promise<void>;

package/dist-lib/core/printPagination.d.ts

@@ -0,0 +1,9 @@
+import type { DesignerElement, PrintRenderPage, TemplateMode } from './types';
+interface PaginationOptions {
+    templateMode: TemplateMode;
+    firstElements: DesignerElement[];
+    continuationElements: DesignerElement[];
+}
+export declare function buildPrintRenderPages(data: unknown, options: PaginationOptions): PrintRenderPage[];
+export declare function buildRepeatedPrintPages(pageCount: number, options: PaginationOptions): PrintRenderPage[];
+export {};

package/dist-lib/core/textBoxLayout.d.ts

@@ -0,0 +1,13 @@
+import type { TextBoxDesignerElement } from './types';
+export interface TextBoxLayoutResult {
+    lines: string[];
+    fontSizePt: number;
+    fontSizeMm: number;
+    lineHeightMm: number;
+    truncated: boolean;
+}
+/**
+ * 把运行时文字排入固定毫米矩形。设计画布和 PDF 共用该结果，避免预览与打印
+ * 分别依赖 CSS/SVG 的隐式换行规则而产生差异。
+ */
+export declare function layoutTextBox(element: TextBoxDesignerElement, content: string): TextBoxLayoutResult;

package/dist-lib/core/types.d.ts

@@ -3,9 +3,64 @@ export interface TemplateSize {
     widthMm: number;
     heightMm: number;
 }
+/** 模板打印模式：单模板所有页复用一套画布，双模板区分首页和续页。 */
+export type TemplateMode = 'single' | 'dual';
+/** 双模板模式下可编辑的模板页。 */
+export type TemplatePage = 'first' | 'continuation';
 /** 当前标签模板的基础信息。 */
 export interface TemplateInfo extends TemplateSize {
     name: string;
+    mode: TemplateMode;
+}
+/** 设计器保存和读取的完整模板快照。 */
+export interface PrintTemplate {
+    version: 1;
+    info: TemplateInfo;
+    pages: Record<TemplatePage, DesignerElement[]>;
+}
+/** 打印阶段传给单个表格元素的真实业务数据。 */
+export interface TableRuntimeGroup {
+    /** 原始分组数组中的下标，用于跨页后仍显示连续序号。 */
+    index: number;
+    record: Record<string, unknown>;
+    rows: Record<string, unknown>[];
+}
+export interface TableRuntimeData {
+    groups?: TableRuntimeGroup[];
+    rows?: Record<string, unknown>[];
+}
+/** 已完成分页的一张打印页。 */
+export interface PrintRenderPage {
+    elements: DesignerElement[];
+    /** 当前打印页对应的根业务记录；同一记录拆分出的续页共享该数据。 */
+    data?: Record<string, unknown>;
+    tableData: Record<string, TableRuntimeData>;
+}
+/** 设计器完成 PDF 预览或内部测试打印后通知业务系统的结果。 */
+export interface PrintResult {
+    success: boolean;
+    action: 'preview' | 'testPrint';
+    pageCount: number;
+    blob?: Blob;
+    error?: unknown;
+}
+/** 业务字段目前允许在标签中使用的三种展示方式。 */
+export type FieldElementType = 'text' | 'textBox' | 'qrcode' | 'barcode';
+/**
+ * 由业务系统传给设计器的字段定义。
+ *
+ * field 是打印时读取业务数据的字段路径，label 只负责设计器中的可读名称，
+ * type 决定字段第一次添加到画布时采用哪一种展示方式。
+ */
+export interface BusinessField {
+    field: string;
+    label: string;
+    type: FieldElementType;
+}
+/** 左侧字段列表的分组；不同业务系统可以传入完全不同的分组和字段。 */
+export interface BusinessFieldGroup {
+    label: string;
+    fields: readonly BusinessField[];
 }
 /**
  * 设计器支持的组件类型。
@@ -13,9 +68,9 @@ export interface TemplateInfo extends TemplateSize {
  * 这里保留尚未实现编辑能力的组件类型，是为了让左侧组件注册表始终使用
  * 稳定的业务标识；后续实现方框、线条等组件时不需要修改已有模板字段。
  */
-export type DesignerElementType = 'text' | 'rectangle' | 'horizontalLine' | 'verticalLine' | 'qrcode' | 'barcode' | 'serialNumber' | 'pageNumber' | 'time';
+export type DesignerElementType = 'text' | 'textBox' | 'rectangle' | 'horizontalLine' | 'verticalLine' | 'qrcode' | 'barcode' | 'image' | 'serialNumber' | 'pageNumber' | 'time' | 'table' | 'pdf';
 /** 右侧属性面板中可独立组合的属性编辑器标识。 */
-export type ElementPropertyKey = 'content' | 'width' | 'height' | 'fontSize' | 'fontWeight' | 'strokeWidth' | 'rotation' | 'timeMode' | 'includeTime' | 'fixedTime';
+export type ElementPropertyKey = 'displayType' | 'content' | 'textBoxFitMode' | 'textBoxOverflowMode' | 'lineHeight' | 'minFontSize' | 'imageSource' | 'x' | 'y' | 'width' | 'height' | 'fontSize' | 'fontWeight' | 'strokeWidth' | 'rotation' | 'timeMode' | 'includeTime' | 'fixedTime' | 'tableConfig' | 'pdfSource' | 'pdfCropMode' | 'pdfCropRatio';
 /**
  * 单个属性编辑器的能力与数值约束。
  * 数值范围跟随组件类型配置，输入框和 SVG 控制点共用，避免两处规则不一致。
@@ -36,7 +91,7 @@ export interface ElementPropertyConfig {
  */
 export interface BaseDesignerElement {
     id: string;
-    type: 'text' | 'rectangle' | 'horizontalLine' | 'verticalLine' | 'qrcode' | 'barcode' | 'serialNumber' | 'pageNumber' | 'time';
+    type: 'text' | 'textBox' | 'rectangle' | 'horizontalLine' | 'verticalLine' | 'qrcode' | 'barcode' | 'image' | 'serialNumber' | 'pageNumber' | 'time' | 'table' | 'pdf';
     xMm: number;
     yMm: number;
     widthMm: number;
@@ -47,6 +102,8 @@ export interface BaseDesignerElement {
 /** 普通文字元素独有的排版属性。 */
 export interface TextDesignerElement extends BaseDesignerElement {
     type: 'text';
+    /** 存在 field 时，打印阶段从业务数据读取；普通固定文字不设置该字段。 */
+    field?: string;
     content: string;
     fontSizePt: number;
     fontWeight: 400 | 700;
@@ -78,12 +135,31 @@ export type TextStyleDesignerElement = TextDesignerElement | SerialNumberDesigne
 /** 二维码首期只保存内容；纠错等级等高级选项可继续独立注册为属性。 */
 export interface QrcodeDesignerElement extends BaseDesignerElement {
     type: 'qrcode';
+    field?: string;
     content: string;
 }
 /** 条形码首期固定使用通用的 CODE128 编码。 */
 export interface BarcodeDesignerElement extends BaseDesignerElement {
     type: 'barcode';
+    field?: string;
+    content: string;
+}
+/** 图片元素保存图片地址或 data URL，由 SVG image 负责保持原图比例渲染。 */
+export interface ImageDesignerElement extends BaseDesignerElement {
+    type: 'image';
+    field?: string;
+    content: string;
+}
+/** PDF 页面在固定元素区域内的裁切方式。 */
+export type PdfCropMode = 'none' | 'currentSize' | 'scale' | 'cropWidth' | 'cropHeight';
+/** PDF 元素显示指定文件中的一页，打印前会将该页渲染进模板 SVG。 */
+export interface PdfDesignerElement extends BaseDesignerElement {
+    type: 'pdf';
+    /** 支持同源/CORS 地址、Blob URL 或 data URL。 */
     content: string;
+    cropMode: PdfCropMode;
+    /** 等比例缩放、裁切宽度和裁切高度使用的百分比。 */
+    cropRatio: number;
 }
 /** 无填充边框元素，strokeWidthMm 表示实际打印线宽。 */
 export interface RectangleDesignerElement extends BaseDesignerElement {
@@ -98,10 +174,120 @@ export interface LineDesignerElement extends BaseDesignerElement {
     type: 'horizontalLine' | 'verticalLine';
     strokeWidthMm: number;
 }
+export type TableColumnAlign = 'left' | 'center' | 'right';
+export type TableMode = 'normal' | 'groupedDetail';
+export type TableColumnType = 'text' | 'serialNumber' | 'image';
+export type TableColumnWidthMode = 'auto' | 'fixed';
+/** 表格单列配置；自适应列平分剩余宽度，固定列优先使用指定毫米宽度。 */
+export interface TableColumn {
+    id: string;
+    type: TableColumnType;
+    /** 相邻列设置相同分组名称时，会合并成上层分组表头。 */
+    groupTitle: string;
+    title: string;
+    content: string;
+    widthMode: TableColumnWidthMode;
+    widthMm?: number;
+    minWidthMm: number;
+    /** 兼容旧版比例列宽，读入旧模板时会自动归一化成自适应列。 */
+    widthRatio?: number;
+    /** 表头文字的水平对齐方式，独立于内容单元格。 */
+    headerAlign: TableColumnAlign;
+    align: TableColumnAlign;
+    /** 打印控件后续可根据该字段从数组行数据中取值。 */
+    field?: string;
+}
+/** 分组明细表格的分组标题行单元格配置。 */
+export interface TableGroupHeaderCell {
+    id: string;
+    content: string;
+    /** 打印控件后续可根据分组数据读取字段值。 */
+    field?: string;
+    widthMode: TableColumnWidthMode;
+    widthMm?: number;
+    minWidthMm: number;
+    /** 兼容旧版比例列宽，读入旧模板时会自动归一化成自适应列。 */
+    widthRatio?: number;
+    align: TableColumnAlign;
+}
+/** 右侧表格配置属性一次性提交的可编辑内容。 */
+export interface TableConfigValue {
+    mode: TableMode;
+    /** 打印控件后续从业务数据中读取表格数组的字段路径。 */
+    field?: string;
+    /** 分组明细模式下读取分组数组的字段路径。 */
+    groupField?: string;
+    /** 分组明细模式下在每个分组内读取明细数组的字段路径。 */
+    detailField?: string;
+    showHeader: boolean;
+    showBorder: boolean;
+    repeatHeader: boolean;
+    headerBackground: string;
+    groupHeaderRowHeightMm: number;
+    headerRowHeightMm: number;
+    bodyRowHeightMm: number;
+    previewGroupCount: number;
+    previewRowCount: number;
+    groupHeaderCells: TableGroupHeaderCell[];
+    columns: TableColumn[];
+}
+/** 表格作为单个元素拖动和缩放，内部列配置由右侧属性面板维护。 */
+export interface TableDesignerElement extends BaseDesignerElement {
+    type: 'table';
+    mode: TableMode;
+    /** 打印控件后续从业务数据中读取表格数组的字段路径。 */
+    field?: string;
+    /** 分组明细模式下读取分组数组的字段路径。 */
+    groupField?: string;
+    /** 分组明细模式下在每个分组内读取明细数组的字段路径。 */
+    detailField?: string;
+    columns: TableColumn[];
+    groupHeaderCells: TableGroupHeaderCell[];
+    showHeader: boolean;
+    showBorder: boolean;
+    repeatHeader: boolean;
+    headerBackground: string;
+    groupHeaderRowHeightMm: number;
+    headerRowHeightMm: number;
+    bodyRowHeightMm: number;
+    previewGroupCount: number;
+    previewRowCount: number;
+    strokeWidthMm: number;
+    fontSizePt: number;
+    fontWeight: 400 | 700;
+}
+/** 文字框在固定区域内放不下内容时采用的尺寸适配方式。 */
+export type TextBoxFitMode = 'fixed' | 'shrinkFont';
+/** 固定区域在最小字号下仍放不下内容时采用的溢出方式。 */
+export type TextBoxOverflowMode = 'clip' | 'ellipsis';
+/**
+ * 多行文字框使用固定毫米宽高进行排版。
+ * 与普通文字不同，拖动控制点只改变文本框，不会同步缩放字号。
+ */
+export interface TextBoxDesignerElement extends BaseDesignerElement {
+    type: 'textBox';
+    /** 存在 field 时，打印阶段从业务数据读取；普通固定文字框不设置该字段。 */
+    field?: string;
+    content: string;
+    fontSizePt: number;
+    fontWeight: 400 | 700;
+    /** 行高相对于字号毫米高度的倍数。 */
+    lineHeight: number;
+    fitMode: TextBoxFitMode;
+    overflowMode: TextBoxOverflowMode;
+    /** shrinkFont 模式允许缩小到的最小字号。 */
+    minFontSizePt: number;
+}
 /** 当前已经具备创建、属性编辑和 SVG 渲染能力的元素集合。 */
-export type DesignerElement = TextDesignerElement | RectangleDesignerElement | LineDesignerElement | QrcodeDesignerElement | BarcodeDesignerElement | SerialNumberDesignerElement | PageNumberDesignerElement | TimeDesignerElement;
+export type DesignerElement = TextDesignerElement | TextBoxDesignerElement | RectangleDesignerElement | LineDesignerElement | QrcodeDesignerElement | BarcodeDesignerElement | ImageDesignerElement | SerialNumberDesignerElement | PageNumberDesignerElement | TimeDesignerElement | TableDesignerElement | PdfDesignerElement;
+/** 设计器运行期间保存的元素剪贴板快照。 */
+export interface ElementClipboardItem {
+    id: string;
+    label: string;
+    element: DesignerElement;
+}
 /** 独立属性编辑器使用的统一值类型。 */
-export type ElementPropertyValue = string | number | boolean;
+export type ElementPropertyValue = string | number | boolean | TableConfigValue;
 /** SVG 选区八个缩放控制点的稳定标识。 */
 export type ResizeHandle = 'topLeft' | 'top' | 'topRight' | 'right' | 'bottomRight' | 'bottom' | 'bottomLeft' | 'left';
 /**