Class HtmlTextBuilder

packages/backend/src/html/htmlTextBuilder.ts:16–294

} from "./htmlMain";

export class HtmlTextBuilder extends HtmlDefaultBuilder {
  constructor(node: TextNode, settings: HTMLSettings) {
    super(node, settings);
  }

  // Override htmlElement to ensure text nodes use paragraph elements
  get htmlElement(): string {
    return "p";
  }

  getTextSegments(node: TextNode): {
    style: string;
    text: string;
    openTypeFeatures: { [key: string]: boolean };
    className?: string;
    componentName?: string;
  }[] {
    const segments = (node as any)
      .styledTextSegments as StyledTextSegmentSubset[];
    if (!segments) {
      return [];
    }

    return segments.map((segment, index) => {
      // Prepare additional CSS properties from layer blur and drop shadow effects.
      const additionalStyles: { [key: string]: string } = {};

      const layerBlurStyle = this.getLayerBlurStyle();
      if (layerBlurStyle) {
        additionalStyles.filter = layerBlurStyle;
      }
      const textShadowStyle = this.getTextShadowStyle();
      if (textShadowStyle) {
        additionalStyles["text-shadow"] = textShadowStyle;
      }

      const styleAttributes = formatMultipleJSX(
        {
          color: htmlColorFromFills(segment.fills as any),
          "font-size": segment.fontSize,
          "font-family": segment.fontName.family,
          "font-style": this.getFontStyle(segment.fontName.style),
          "font-weight": `${segment.fontWeight}`,
          "text-decoration": this.textDecoration(segment.textDecoration),
          "text-transform": this.textTransform(segment.textCase),
          "line-height": this.lineHeight(segment.lineHeight, segment.fontSize),
          "letter-spacing": this.letterSpacing(
            segment.letterSpacing,
            segment.fontSize,
          ),
          // "text-indent": segment.indentation,
          "word-wrap": "break-word",
          ...additionalStyles,
        },
        this.isJSX,
      );

      let chars = segment.characters;