layout-bmfont-text types

layout-bmfont-text.d.ts

import { Font } from 'three/examples/jsm/loaders/FontLoader';

export type CreateLayout = (options: Partial<LayoutBfmFontOpts>) => LayoutBfmFont;

export interface LayoutBfmFontOpts {
  /** the BMFont definition which holds chars, kernings, etc */
  font: Font & {
    common: {
      /** the common line height */
      lineHeight: number;
      /** the common base line */
      base: number;
      /** the scaleW of the texture atlas */
      scaleW: number;
      /** the scaleH of the texture atlas */
      scaleH: number;
    };
  };
  /** the text to layout. Newline characters (\n) will cause line breaks */
  text: string;
  /** the desired width of the text box, causes word-wrapping and clipping in "pre" mode. Leave as undefined to remove word-wrapping (default behaviour) */
  width?: number;
  /** a mode for word-wrapper; can be 'pre' (maintain spacing), or 'nowrap' (collapse whitespace but only break on newline characters), otherwise assumes normal word-wrap behaviour (collapse whitespace, break at width or newlines) */
  mode: 'pre' | 'nowrap';
  /** can be "left", "center" or "right" (default: left) */
  align: 'left' | 'center' | 'right';
  /** the letter spacing in pixels (default: 0) */
  letterSpacing: number;
  /** the line height in pixels (default to font.common.lineHeight) */
  lineHeight: number;
  /** the number of spaces to use in a single tab (default 4) */
  tabSize: number;
  /** the starting index into the text to layout (default 0) */
  start: number;
  /** the ending index (exclusive) into the text to layout (default text.length) */
  end: number;
}

export interface LayoutBfmFont {
  /**
   * An array of laid out glyphs that can be used for rendering.
   *
   * All positions are relative to the bottom-left baseline of the text box (i.e. the last line).
   */
  glyphs: Glyph[];

  /** Updates the layout, all options are the same as in constructor. */
  update: (options: Partial<LayoutBfmFontOpts>) => void;

  /** The width of the text box, or the width provided in constructor. */
  width: number;
  /** The height of the text box; from baseline to the top of the ascender. */
  height: number;

  /** metrics */
  /** The baseline metric: measures top of text layout to the baseline of the first line. */
  baseline: number;
  /** The x-height metric; the height of a lowercase character. Uses the first available height of the common lowercase Latin "x-chars", such as 'x', 'u', 'v', 'w', 'z'. */
  xHeight: number;
  /** The metric from baseline to the bottom of the descenders (like the bottom of a lowercase "g"). */
  descender: number;
  /** The metric for ascenders; typically from the top of x-height to the top of the glyph height. */
  ascender: number;
  /** The cap height metric; the height of a flat uppercase letter like 'H' or 'I'. Uses the frist available height of common uppercase Latin flat capitals, such as 'H', 'I', 'E', 'T', 'K'. */
  capHeight: number;
  /** The line height; the height from one baseline to the next. This is what was passed as opt.lineHeight, or defaults to the font.common.lineHeight. */
  lineHeight: number;
}

export interface Glyph {
  /** the index of this glyph into the string */
  index: number;
  /** the BMFont "char" object for this glyph */
  data: {
    /** the x texture offset for this glyph */
    x: number;
    /** the y texture offset for this glyph */
    y: number;
    /** the width of this glyph in the texture */
    width: number;
    /** the height of this glyph in the texture */
    height: number;
    /** the x offset to draw this glyph at */
    xoffset: number;
    /** the y offset to draw this glyph at */
    yoffset: number;
    /** the amount to move the cursor after drawing this glyph */
    xadvance: number;
  };
  /** the baseline position to render this glyph */
  position: [number, number];
  /** the line index this glyph appears in */
  line: number;
}

declare module 'layout-bmfont-text' {
  const createLayout: CreateLayout;

  export default createLayout;
}