Style

Style

/**
 * The interface of canvas style properties
 */
interface CanvasStyle {

    /**
     * @default null
     */
    fillStyle: null | string | CanvasGradient | CanvasPattern;

    /**
     * @default null
     */
    strokeStyle: null | string | CanvasGradient | CanvasPattern;

    /**
     * @default 1
     */
    lineWidth: number;

    /**
     * @default 'butt'
     */
    lineCap: CanvasLineCap;

    /**
     * @default 'miter'
     */
    lineJoin: CanvasLineJoin;

    /**
     * @default 0
     */
    lineDashOffset: number;

    /**
     * @default null
     */
    lineDash: null | number[];

    /**
     * @default 10
     */
    miterLimit: number;

    /**
     * @default 'inherit'
     */
    direction: CanvasDirection;

    /**
     * @default '18px sans-serif'
     */
    font: string;

    /**
     * @default 'left'
     */
    textAlign: CanvasTextAlign;

    /**
     * @default 'top'
     */
    textBaseline: CanvasTextBaseline;

    /**
     * @default null
     */
    shadowColor: null | string;

    /**
     * @default 0
     */
    shadowBlur: number;

    /**
     * @default 0
     */
    shadowOffsetX: number;

    /**
     * @default 0
     */
    shadowOffsetY: number;

    /**
     * @default 1
     */
    opacity: number;

    /**
     * The canvas pixel ratio
     * @default window.devicePixelRatio
     */
    ratio: number;

}

/**
 * The namespace of style-related APIs
 */
namespace Style {

    /**
     * The defaults of canvas styles (mutable)
     */
    const defaults: CanvasStyle;

    /**
     * Apply the style to the canvas context
     */
    function apply(
        context: CanvasRenderingContext2D,
        style: CanvasStyle
    ): void;

    /**
     * Compute the style properties from the child's and its parent's styles
     */
    function compute(
        output: CanvasStyle,
        parentStyle: CanvasStyle,
        childStyle: Partial<CanvasStyle>
    ): void;

}