g2o-gradient/dist/index.d.ts

g2o LinearGradient and RadialGradient

import * as g2o from 'g2o';
import { ElementBase, ColorProvider, ViewDOM, VectorLike, G20 } from 'g2o';

declare class Stop extends ElementBase {
    #private;
    readonly change$: g2o.Observable<this>;
    /**
     * @param offset The offset percentage of the stop represented as a zero-to-one value. Default value flip flops from zero-to-one as new stops are created.
     * @param color The color of the stop. Default value flip flops from white to black as new stops are created.
     * @param opacity The opacity value. Default value is 1, cannot be lower than 0.
     */
    constructor(offset?: number, color?: string, opacity?: number);
    /**
     * The current index being referenced for calculating a stop's default offset value.
     */
    static Index: number;
    get color(): string;
    set color(color: string);
    get offset(): number;
    set offset(offset: number);
    get opacity(): number;
    set opacity(opacity: number);
}

interface GradientOptions {
    id?: string;
    spreadMethod?: 'pad' | 'reflect' | 'repeat';
    units?: 'objectBoundingBox' | 'userSpaceOnUse';
}
/**
 *
 */
declare abstract class Gradient extends ElementBase implements ColorProvider {
    #private;
    _flagStops: boolean;
    readonly _change: g2o.Variable<this>;
    readonly change$: g2o.Observable<this>;
    constructor(stops?: (Stop | [offset: number, color: string, opacity: number])[], options?: GradientOptions);
    dispose(): void;
    serialize(): string;
    render<T>(viewDOM: ViewDOM<T>, defs: T): void;
    incrementUse<T>(viewDOM: ViewDOM<T>, defs: T): void;
    decrementUse<T>(viewDOM: ViewDOM<T>, defs: T): void;
    update(): this;
    flagReset(dirtyFlag?: boolean): this;
    /**
     * Indicates what happens if the gradient starts or ends inside the bounds of the target rectangle.
     * @see {@link https://www.w3.org/TR/SVG11/pservers.html#LinearGradientElementSpreadMethodAttribute} for more information
     */
    get spreadMethod(): 'pad' | 'reflect' | 'repeat';
    set spreadMethod(spread: 'pad' | 'reflect' | 'repeat');
    get stops(): Stop[];
    set stops(stops: Stop[]);
    /**
     * Indicates how coordinate values are interpreted by the renderer.
     * @see {@link https://www.w3.org/TR/SVG11/pservers.html#RadialGradientElementGradientUnitsAttribute} for more information
     */
    get units(): 'userSpaceOnUse' | 'objectBoundingBox';
    set units(units: 'userSpaceOnUse' | 'objectBoundingBox');
}

interface LinearGradientOptions extends GradientOptions {
}
declare class LinearGradient extends Gradient implements ColorProvider {
    #private;
    /**
     * @param point1 The position of the first end point of the linear gradient.
     * @param point2 The position of the second end point of the linear gradient.
     * @param stops A list of {@link Stop}s that contain the gradient fill pattern for the gradient.
     * The linear gradient lives within the space of the parent object's matrix space.
     */
    constructor(point1: VectorLike, point2: VectorLike, stops: (Stop | [offset: number, color: string, opacity: number])[], options?: LinearGradientOptions);
    render<T>(viewDOM: ViewDOM<T>, defs: T): this;
    update(): this;
    flagReset(dirtyFlag?: boolean): this;
    get point1(): G20;
    set point1(point1: G20);
    get point2(): G20;
    set point2(point2: G20);
}

interface RadialGradientOptions extends GradientOptions {
    /**
     * The radius of the radial gradient.
     */
    radius?: number;
    /**
     * The x coordinate of the focal point on the radial gradient.
     */
    fx?: number;
    /**
     * The y coordinate of the focal point on the radial gradient.
     */
    fy?: number;
}
declare class RadialGradient extends Gradient implements ColorProvider {
    #private;
    /**
     *
     * @param center The position of the origin of the radial gradient.
     * @param stops A list of {@link Stop}s that contain the gradient fill pattern for the gradient.
     * @param options
     */
    constructor(center: VectorLike, stops?: (Stop | [offset: number, color: string, opacity: number])[], options?: RadialGradientOptions);
    render<T>(viewDOM: ViewDOM<T>, defs: T): this;
    update(): this;
    flagReset(dirtyFlag?: boolean): this;
    get center(): G20;
    set center(center: G20);
    get focal(): G20;
    set focal(focal: G20);
    get radius(): number | null;
    set radius(radius: number | null);
}

export { Gradient, type GradientOptions, LinearGradient, type LinearGradientOptions, RadialGradient, type RadialGradientOptions, Stop };