import { VElement, VTextNode } from './element'; import { FormatValue } from './format'; import { Component } from './component'; import { Slot } from './slot'; import { Decorator } from './decorator'; /** * 格式渲染可回退的渲染模式 * 一般情况下,我们会把格式渲染到一个标签内,但可能会产生一些冗余,通过回退渲染模式,可以优化渲染的结果 * * 默认情况的渲染结果: * ```html * hello, Textbus! * ``` * 我们可以通过把样式附加到 strong 标签上,来减少 DOM 节点的生成。 * * 未优化前代码: * ```tsx * const colorFormatter = { * name: 'color', * render(children, formatValue) { * return {children} * } * } * ``` * 优化后: * ```ts * const colorFormatter = { * name: 'color', * render(children, formatValue) { * return { * fallbackTagName: 'span', * attach(host) { * host.styles.set('color', formatValue) * } * } * } * } * ``` * * 优化后渲染结果: * ```html * hello, Textbus! * ``` */ export interface FormatHostBindingRender { /** 回退渲染的标签 */ fallbackTagName: string; /** 给当前虚拟 DOM 节点附加信息的方法 */ attach(host: VElement): void; } /** * 格式配置 */ export interface FormatterConfig { /** 渲染优先级,在相同格式范围内,越小越先渲染 */ priority?: number; /** 当光标在格式末尾并编辑时,是否自动从前继承样式 */ inheritable?: boolean; /** * 格式是否分段渲染。默认情况下 Textbus 采用"最少节点"策略——全覆盖格式统一包裹为一个父节点。 * 设为 true 后,格式不会创建统一包裹,而是下沉到每个子段独立渲染,适用于需要保持并列结构的场景。 */ segmented?: boolean; /** * @deprecated 请使用 {@link segmented} 替代 */ columned?: boolean; /** * 校验是否可应用,当返回 false 时,由不应用 */ checkHost?(host: Slot, value: T): boolean; /** * 格式渲染的方法 * @param children 子节点集合 * @param formatValue 当前格式要渲染的值 * @param renderEnv 渲染环境变量,你可以根据条件渲染不同的结果,renderEnv 的值由 slot.toTree 方法的第二个参数决定 */ render(children: Array, formatValue: T, renderEnv: unknown): VElement | FormatHostBindingRender; } /** * Textbus 动态格式扩展接口 * Formatter 可以在任意插槽的任意区域内生效,常用于行内样式或其它需要标记插槽内一部分内容的情况 */ export declare class Formatter { name: string; private config; readonly priority: number; readonly segmented: boolean; /** @deprecated 请使用 {@link segmented} 替代 */ readonly columned: boolean; readonly inheritable: boolean; /** * 构造函数 * @param name 格式的名字,在同一个编辑器实例内不可重复 * @param config 格式配置 */ constructor(name: string, config: FormatterConfig); checkHost(host: Slot, value: T): boolean; render(children: Array, formatValue: T, renderEnv: unknown): VElement | FormatHostBindingRender; } /** * 可堆叠格式:同一段文本上同一格式名可并存多条不同取值(如多条批注)。 * 内核通过 `instanceof StackableFormatter` 与 {@link Formatter} 区分合并与查询策略; * {@link Query#queryFormat} 对该类返回的 `value` 类型为 `T[]`。 */ export declare class StackableFormatter extends Formatter { /** 类型品牌:供条件类型区分普通 {@link Formatter},运行时不参与逻辑 */ readonly _stackableFormatterMarker: true; constructor(name: string, config: FormatterConfig); } export interface AttributeConfig { /** * 当应用时,Textbus 默认会应用到当前插槽和其后代组件的所有插槽, * 当设置为 true 时,则只应用自身 */ onlySelf?: boolean; /** * 校验是否可应用,当返回 false 时,由不应用 */ checkHost?(host: Slot, value: T): boolean; /** * 渲染属性的方法 * @param node 不附加属性的节点 * @param formatValue 要附加属性的值 * @param renderEnv 渲染环境变量,你可以根据条件渲染不同的结果,renderEnv 的值由 slot.toTree 方法的第二个参数决定 */ render(node: VElement, formatValue: T, renderEnv: unknown): void; } /** * Textbus 动态属性扩展接口 * Attribute 可以在任意插槽的整体生效,常用于块级样式或给整个插槽附加信息的情况 */ export declare class Attribute { name: string; private config; readonly onlySelf: boolean; /** * 构建函数 * @param name 属性的名字,在同一个编辑器实例内不可重复 * @param config */ constructor(name: string, config: AttributeConfig); checkHost(host: Slot, value: T): boolean; render(node: VElement, formatValue: T, renderEnv: unknown): void; }