pencil.js/dist/modules/text/text.d.ts

Nice modular interactive 2D drawing library.

/**
 * Text class
 * <br><img src="./media/examples/text.png" alt="text demo"/>
 * @class
 * @extends {module:Rectangle}
 */
export default class Text {
    /**
     * @param {Object} definition - Text definition
     * @return {Text}
     */
    static from(definition: any): Text;
    /**
     * Load a font URL
     * @param {String|Array<String>} url - URL or an array of URL to font files
     * @return {Promise<String>} Promise for the generated font-family
     */
    static load(url: string | Array<string>): Promise<string>;
    /**
     * Return a font definition from a set of options
     * @param {TextOptions} options - Chosen options
     * @return {String}
     */
    static getFontDefinition(options: any): string;
    /**
     * @typedef {Object} TextMeasures
     * @prop {Number} width - Horizontal size
     * @prop {Number} height - Vertical size
     */
    /**
     * Compute a text width and height
     * @param {String|Array<String>} text - Any text
     * @param {TextOptions} [options] - Options of the text
     * @return {TextMeasures}
     */
    static measure(text: string | Array<string>, options?: any): {
        /**
         * - Horizontal size
         */
        width: number;
        /**
         * - Vertical size
         */
        height: number;
    };
    /**
     * @typedef {Object} TextOptions
     * @extends ComponentOptions
     * @prop {String} [font="sans-serif"] - Font to use (can be a URL)
     * @prop {Number} [fontSize=10] - Size of the text in pixels
     * @prop {String} [align=Text.alignments.start] - Text horizontal alignment
     * @prop {Boolean} [bold=false] - Use bold font-weight
     * @prop {Boolean} [italic=false] - Use italic font-style
     * @prop {Boolean} [underscore=false] - Draw a line under the text
     * @prop {Number} [lineHeight=1] - Ratio of line height (1 is normal, 2 is twice the space)
     */
    /**
     * @type {TextOptions}
     */
    static get defaultOptions(): any;
    /**
     * @typedef {Object} TextAlignments
     * @prop {String} left - The text is left-aligned.
     * @prop {String} right - The text is right-aligned.
     * @prop {String} center - The text is centered.
     * @prop {String} start - The text is aligned at the normal start of the line. (regarding locales)
     * @prop {String} end - The text is aligned at the normal end of the line. (regarding locales)
     */
    /**
     * @type {TextAlignments}
     */
    static get alignments(): {
        /**
         * - The text is left-aligned.
         */
        left: string;
        /**
         * - The text is right-aligned.
         */
        right: string;
        /**
         * - The text is centered.
         */
        center: string;
        /**
         * - The text is aligned at the normal start of the line. (regarding locales)
         */
        start: string;
        /**
         * - The text is aligned at the normal end of the line. (regarding locales)
         */
        end: string;
    };
    /**
     * Text constructor
     * @param {PositionDefinition} positionDefinition - Top most point of the line start (depend on align option)
     * @param {String} [text=""] - Text to display
     * @param {TextOptions} [options] - Drawing options
     */
    constructor(positionDefinition: PositionDefinition, text?: string, options?: any);
    /**
     * @type {Array<String>}
     */
    lines: Array<string>;
    /**
     * Change the text
     * @param {String|Array<String>} text - New text value
     * @example this.text = "Single line text";
     * @example this.text = "Multi\nLine text";
     * @example this.text = ["Multi", "Line text"];
     * @example this.text = ["Multi", "Line\ntext"];
     */
    set text(text: string | string[]);
    /**
     * Returns the text
     * @return {String}
     */
    get text(): string;
    /**
     * Draw the text into a drawing context
     * @param {CanvasRenderingContext2D} ctx - Drawing context
     * @return {Text} Itself
     */
    makePath(ctx: CanvasRenderingContext2D): Text;
    /**
     * @inheritDoc
     * @return {Text} Itself
     */
    setContext(ctx: any): Text;
    /**
     * Return the position offset according to alignment
     * @return {Number}
     */
    getAlignOffset(): number;
    /**
     * Measure the text with current options
     * @return {TextMeasures}
     */
    getMeasures(): {
        /**
         * - Horizontal size
         */
        width: number;
        /**
         * - Vertical size
         */
        height: number;
    };
    /**
     * Can't set text's width
     * @param {*} _ -
     */
    set width(_: any);
    /**
     * Width of the text
     * @return {Number}
     */
    get width(): number;
    /**
     * Can't set text's height
     * @param {*} _ -
     */
    set height(_: any);
    /**
     * Height of the text
     * @return {Number}
     */
    get height(): number;
    /**
     * @inheritDoc
     */
    toJSON(): any;
}