@types/wavesurfer.js - npm Package Compare versions

Comparing version 5.0.1 to 5.0.2

wavesurfer.js/index.d.ts

@@ -9,473 +9,5 @@ // Type definitions for wavesurfer.js 5.0
 
-import CursorPlugin = require("./src/plugin/cursor");
-import ElanPlugin = require("./src/plugin/elan");
-import MarkersPlugin = require("./src/plugin/markers");
-import MediaSessionPlugin = require("./src/plugin/mediasession");
-import MicrophonePlugin = require("./src/plugin/microphone");
-import MinimapPlugin = require("./src/plugin/minimap");
-import PlayheadPlugin = require("./src/plugin/playhead");
-import RegionsPlugin = require("./src/plugin/regions");
-import SpectogramPlugin = require("./src/plugin/spectogram");
-import TimelinePlugin = require("./src/plugin/timeline");
+import WaveSurfer from "./src/wavesurfer";
 
+export = WaveSurfer;
 export as namespace WaveSurfer;
-
-export = WaveSurfer;
-
-declare class Observer {
-    constructor();
-    fireEvent(eventName: string, ...args: any[]): void;
-    on(eventName: string, callback: EventHandler): WaveSurfer.ListenerDescriptor;
-    once(eventName: string, callback: EventHandler): WaveSurfer.ListenerDescriptor;
-    setDisabledEventEmissions(eventNames: string[]): void;
-    un(eventName: string, callback: EventHandler): void;
-    unAll(): void;
-
-    readonly handlers: { [eventName: string]: EventHandler[] };
-}
-
-type EventHandler = (...args: any[]) => void;
-
-declare class WaveSurfer extends Observer {
-    constructor(params: WaveSurfer.WaveSurferParams);
-
-    static VERSION: string;
-    static util: WaveSurfer.WaveSurferUtil;
-    static create(params: WaveSurfer.WaveSurferParams): WaveSurfer;
-
-    backend: WaveSurfer.WaveSurferBackend;
-    util: WaveSurfer.WaveSurferUtil;
-
-    [x: string]: any;
-
-    // pluginName -> WaveSurferPlugin
-
-    /** Only available in WaveSurfer instances with CursorPlugin. */
-    cursor: CursorPlugin;
-    /** Only available in WaveSurfer instances with ElanPlugin. */
-    elan: ElanPlugin;
-    /** Only available in WaveSurfer instances with MarkersPlugin. */
-    markers: MarkersPlugin;
-    /** Only available in WaveSurfer instances with MediaSessionPlugin. */
-    mediasession: MediaSessionPlugin;
-    /** Only available in WaveSurfer instances with MicrophonePlugin. */
-    microphone: MicrophonePlugin;
-    /** Only available in WaveSurfer instances with MinimapPlugin. */
-    minimap: MinimapPlugin;
-    /** Only available in WaveSurfer instances with PlayheadPlugin. */
-    playhead: PlayheadPlugin;
-    /** Only available in WaveSurfer instances with RegionsPlugin. */
-    regions: RegionsPlugin;
-    /** Only available in WaveSurfer instances with SpectogramPlugin. */
-    spectogram: SpectogramPlugin;
-    /** Only available in WaveSurfer instances with TimelinePlugin. */
-    timeline: TimelinePlugin;
-
-    // propertyNameAddedByPlugin -> any
-
-    addPlugin(plugin: WaveSurfer.PluginDefinition): WaveSurfer;
-    cancelAjax(): void;
-    destroy(): void;
-    destroyPlugin(name: string): WaveSurfer;
-    empty(): void;
-    exportImage(format?: string, quality?: number, type?: "dataURL" | "blob"): string | string[] | Promise<Blob[]>;
-    exportPCM(length?: number, accuracy?: number, noWindow?: boolean, start?: number, end?: number): Promise<Peaks>;
-    getActivePlugins(): { [pluginName: string]: boolean };
-    getBackgroundColor(): string;
-    getCurrentTime(): number;
-    getCursorColor(): string;
-    getDuration(): number;
-    getFilters(): AudioNode[];
-    getHeight(): number;
-    getMute(): boolean;
-    getPlaybackRate(): number;
-    getProgressColor(): string;
-    getVolume(): number;
-    getWaveColor(): CanvasGradient | string;
-    init(): WaveSurfer;
-    initPlugin(name: string): WaveSurfer;
-    isPlaying(): boolean;
-    isReady: boolean;
-    load(url: string | HTMLMediaElement, peaks?: Peaks, preload?: string, duration?: number): void;
-    loadBlob(url: Blob | File): void;
-    pause(): Promise<void> | undefined;
-    play(start?: number, end?: number): Promise<void> | undefined;
-    playPause(): Promise<void> | undefined;
-    registerPlugins(plugins: WaveSurfer.PluginDefinition[]): WaveSurfer;
-    seekAndCenter(progress: number): void;
-    seekTo(progress: number): void;
-    setBackgroundColor(color: string): void;
-    setCurrentTime(seconds: number): void;
-    setCursorColor(color: string): void;
-    setHeight(height: number): void;
-    setMute(mute: boolean): void;
-    setPlaybackRate(rate: number): void;
-    setPlayEnd(position: number): void;
-    setSinkId(deviceId: string): Promise<any>;
-    setVolume(newVolume: number): void;
-    setWaveColor(color: string | CanvasGradient): void;
-    skip(offset: number): void;
-    skipBackward(seconds?: number): void;
-    skipForward(seconds?: number): void;
-    stop(): void;
-    toggleInteraction(): void;
-    toggleMute(): void;
-    toggleScroll(): void;
-    zoom(pxPerSec?: number): void;
-}
-
-type Peaks = ReadonlyArray<number> | ReadonlyArray<ReadonlyArray<number>>;
-
-declare namespace WaveSurfer {
-    class WaveSurferObserver extends Observer {}
-
-    interface WaveSurferUtil {
-        absMax(values: ReadonlyArray<number>): number;
-        clamp(val: number, min: number, max: number): number;
-        fetchFile(options: XHROptions): Observer;
-        frame<T>(fn: (arg: T) => void): (arg: T) => void;
-        getId(prefix: string): string;
-        max(values: ReadonlyArray<number>): number;
-        min(values: ReadonlyArray<number>): number;
-        Observer: Observer;
-        preventClick(): void;
-        requestAnimationFrame(): (fn: (t: number) => void) => number;
-        style<T extends HTMLElement>(el: T, styles: Styles): T;
-    }
-
-    interface Styles {
-        [styleName: string]: string;
-    }
-
-    interface WaveSurferParams {
-        audioContext?: AudioContext;
-        audioRate?: number;
-        audioScriptProcessor?: ScriptProcessorNode;
-        autoCenter?: boolean;
-        autoCenterRate?: number;
-        autoCenterImmediately?: boolean;
-        backend?: "WebAudio" | "MediaElement" | "MediaElementWebAudio";
-        backgroundColor?: string;
-        barHeight?: number;
-        barRadius?: number;
-        barGap?: number;
-        barWidth?: number;
-        barMinHeight?: number;
-        closeAudioContext?: boolean;
-        container: string | HTMLElement;
-        cursorColor?: string;
-        cursorWidth?: number;
-        drawingContextAttributes?: DrawingContextAttributes;
-        duration?: number;
-        fillParent?: boolean;
-        forceDecode?: boolean;
-        height?: number;
-        hideScrollbar?: boolean;
-        interact?: boolean;
-        loopSelection?: boolean;
-        maxCanvasWidth?: number;
-        mediaControls?: boolean;
-        mediaType?: string;
-        minPxPerSec?: number;
-        normalize?: boolean;
-        partialRender?: boolean;
-        pixelRatio?: number;
-        plugins?: PluginDefinition[];
-        progressColor?: string;
-        removeMediaElementOnDestroy?: boolean;
-        renderer?: MultiCanvas;
-        responsive?: boolean | number;
-        rtl?: boolean;
-        scrollParent?: boolean;
-        skipLength?: number;
-        splitChannels?: boolean;
-        splitChannelsOptions?: SplitChannelsOptions;
-        vertical?: boolean;
-        waveColor?: string | CanvasGradient;
-        xhr?: XHROptions;
-    }
-
-    interface SplitChannelsOptions {
-        overlay?: boolean;
-        channelColors?: { [channel: number]: ChannelColor };
-        filterChannels?: number[];
-        relativeNormalization?: boolean;
-    }
-
-    interface ChannelColor {
-        progressColor: string;
-        waveColor: string;
-    }
-
-    class CanvasEntry {
-        constructor();
-
-        clearWave(): void;
-        destroy(): void;
-        drawLineToContext(
-            ctx: CanvasRenderingContext2D,
-            peaks: number[],
-            absmax: number,
-            halfH: number,
-            offsetY: number,
-            start: number,
-            end: number,
-        ): void;
-        drawLines(peaks: number[], absmax: number, halfH: number, offsetY: number, start: number, end: number): void;
-        drawRoundedRect(
-            ctx: CanvasRenderingContext2D,
-            x: number,
-            y: number,
-            width: number,
-            height: number,
-            radius: number,
-        ): void;
-        fillRectToContext(
-            ctx: CanvasRenderingContext2D,
-            x: number,
-            y: number,
-            width: number,
-            height: number,
-            radius: number,
-        ): void;
-        fillRects(x: number, y: number, width: number, height: number, radius: number): void;
-        getImage(format: string, quality: number, type: string): string | Promise<string>;
-        initProgress(element: HTMLCanvasElement): string;
-        initWave(element: HTMLCanvasElement): string;
-        setFillStyles(waveColor: string, progressColor: string): void;
-        updateDimensions(elementWidth: number, totalWidth: number, width: number, height: number): void;
-
-        readonly canvasContextAttributes: DrawingContextAttributes;
-        readonly end: number;
-        readonly id: string;
-        readonly progress: HTMLCanvasElement;
-        readonly progressCtx: CanvasRenderingContext2D;
-        readonly start: number;
-        readonly wave: HTMLCanvasElement;
-        readonly waveCtx: CanvasRenderingContext2D;
-    }
-
-    class Drawer extends Observer {
-        constructor(container: HTMLElement, params: WaveSurferParams);
-
-        readonly wrapper: HTMLElement;
-    }
-
-    class MultiCanvas extends Drawer {
-        constructor(container: HTMLElement, params: WaveSurferParams);
-
-        addCanvas(): void;
-        clearWave(): void;
-        createElements(): void;
-        drawBars(peaks: Peaks, channelIndex: number, start: number, end: number): void;
-        drawLine(
-            peaks: number[],
-            absmax: number,
-            halfH: number,
-            offsetY: number,
-            start: number,
-            end: number,
-            channelIndex: number,
-        ): void;
-        drawWave(peaks: Peaks, channelIndex: number, start: number, end: number): void;
-        fillRectToContext(
-            x: number,
-            y: number,
-            width: number,
-            height: number,
-            radius: number,
-            channelIndex: number,
-        ): void;
-        getImage(format: string, quality: number, type: string): string | string[] | Promise<string | string[]>;
-        hideChannel(channelIndex: number): void;
-        init(): void;
-        prepareDraw(
-            peaks: Peaks,
-            channelIndex: number,
-            start: number,
-            end: number,
-            fn: (arg: DrawParams) => void,
-            drawIndex: number,
-            normalizedMax: number,
-        ): void;
-        removeCanvas(): void;
-        setFillStyles(entry: CanvasEntry, waveColor: string, progressColor: string): void;
-        updateCursor(): void;
-        updateDimensions(entry: CanvasEntry, width: number, heihgt: number): void;
-        updateProgress(position: number): void;
-        updateSize(): void;
-
-        readonly EntryClass: typeof CanvasEntry;
-        readonly barRadius: number;
-        readonly canvasContextAttributes: DrawingContextAttributes;
-        readonly canvases: CanvasEntry[];
-        readonly halfPixel: number;
-        readonly hasProgressCanvas: boolean;
-        readonly maxCanvasElementWidth: number;
-        readonly maxCanvasWidth: number;
-        readonly overlap: number;
-        readonly progressWave: HTMLElement;
-    }
-
-    interface DrawingContextAttributes {
-        desynchronized: boolean;
-    }
-
-    interface DrawParams {
-        absmax: number;
-        hasMinVals: boolean;
-        height: number;
-        offsetY: number;
-        halfH: number;
-        peaks: Peaks;
-        channelIndex: number;
-    }
-
-    class PeakCache {
-        constructor();
-
-        addRangeToPeakCache(length: number, start: number, end: number): number[][];
-        clearPeakCache(): void;
-        getCacheRanges(): number[][];
-    }
-
-    class MediaElementWebAudio extends MediaElement {
-        constructor(params: WaveSurferParams);
-
-        createMediaElementSource(mediaElement: HTMLMediaElement): void;
-        destroy(): void;
-        init(): void;
-        play(start: number, end: number): Promise<void>;
-    }
-
-    class MediaElement extends WebAudioBackend {
-        constructor(params: WaveSurferParams);
-
-        static scriptBufferSize: number;
-
-        createTimer(): void;
-        destroy(): void;
-        getCurrentTime(): number;
-        getDuration(): number;
-        getPeaks(length: number, first: number, last: number): Peaks;
-        getPlaybackRate(): number;
-        getPlayedPercents(): number;
-        getVolume(): number;
-        init(): void;
-        isPaused(): boolean;
-        load(url: string, container: HTMLElement, peaks: Peaks, preload: string): void;
-        loadElt(elt: HTMLMediaElement, peaks: Peaks): void;
-        pause(): Promise<void>;
-        play(start: number, end: number): Promise<void>;
-        seekTo(start: number): void;
-        setMute(muted: boolean): void;
-        setPlayEnd(end: number): void;
-        setPlaybackRate(value: number): void;
-        setSinkId(deviceId: string): Promise<void>;
-        setVolume(value: number): void;
-
-        readonly destroyed: boolean;
-    }
-
-    class WebAudio extends WebAudioBackend {
-        load(buffer: AudioBuffer): void;
-        seekTo(start: number, end: number): { start: number; end: number };
-
-        readonly ac: AudioContext;
-        readonly analyser: AnalyserNode | null;
-        readonly destroyed: boolean;
-        readonly gainNode: GainNode | null;
-        readonly scriptNode: null;
-    }
-
-    abstract class WebAudioBackend extends Observer {
-        constructor(params: WaveSurferParams);
-
-        static scriptBufferSize: number;
-
-        createAnalyserNode(): void;
-        createScriptNode(): void;
-        createVolumeNode(): void;
-        destroy(): void;
-        destroyWebAudio(): void;
-        getAudioContext(): AudioContext;
-        getCurrentTime(): number;
-        getDuration(): number;
-        getOfflineAudioContext(sampleRate: number): OfflineAudioContext;
-        getPeaks(length: number, first: number, last: number): Peaks;
-        getPlaybackRate(): number;
-        getPlayedPercents(): number;
-        getPlayedTime(): number;
-        getVolume(): number;
-        init(): void;
-        isPaused(): boolean;
-        pause(): void;
-        play(start: number, end: number): void;
-        setFilter(...filters: AudioNode[]): void;
-        setFilters(filters: AudioNode[]): void;
-        setLength(length: number): void;
-        setPeaks(peaks: Peaks, duration: number): void;
-        setPlayEnd(end: number): void;
-        setPlaybackRate(value: number): void;
-        setSinkId(deviceId: string): Promise<void>;
-        setVolume(value: number): void;
-        supportsWebAudio(): boolean;
-    }
-
-    class WaveSurferPlugin {
-        constructor(params: Record<string, unknown>, ws: WaveSurfer);
-        static create(params: Record<string, unknown>): PluginDefinition;
-        init(): void;
-        destroy(): void;
-    }
-
-    interface PluginDefinition {
-        name: string;
-        staticProps?: { [staticPropName: string]: unknown };
-        deferInit?: boolean;
-        params: PluginParams;
-        instance: { new (params: PluginDefinition["params"], ws: WaveSurfer): WaveSurferPlugin };
-    }
-
-    interface PluginParams {
-        [paramName: string]: unknown;
-        deferInit?: boolean;
-    }
-
-    interface ListenerDescriptor {
-        name: string;
-        callback(...args: any[]): void;
-        un(): void;
-    }
-
-    interface Attributes {
-        [attributeName: string]: string;
-    }
-
-    interface Datas {
-        [dataName: string]: string;
-    }
-
-    interface XHROptions {
-        url?: string;
-        method?: string;
-        mode?: string;
-        credentials?: string;
-        cache?: string;
-        responseType?: "arraybuffer" | "blob" | "json" | "text";
-        requestHeaders?: XHRRequestHeader[];
-        redirect?: string;
-        referrer?: string;
-        withCredentials?: boolean;
-    }
-
-    interface XHRRequestHeader {
-        key: string;
-        value: string;
-    }
-
-    interface WaveSurferBackend {
-        setPeaks(peaks: Peaks, duration?: number): void;
-        getPeaks(length: number, first?: number, last?: number): Peaks;
-    }
-}

wavesurfer.js/package.json

 {
     "name": "@types/wavesurfer.js",
-    "version": "5.0.1",
+    "version": "5.0.2",
     "description": "TypeScript definitions for wavesurfer.js",
+    "homepage": "https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/wavesurfer.js",
     "license": "MIT",
@@ -36,5 +37,7 @@ "contributors": [
     "scripts": {},
-    "dependencies": {},
-    "typesPublisherContentHash": "a191ab36b48e6ef1f614ca8ba252b2c6360793cc787dd63ae6b9b105114dd32f",
-    "typeScriptVersion": "3.5"
+    "dependencies": {
+        "@types/debounce": "*"
+    },
+    "typesPublisherContentHash": "d99c328bb6a12960b02603f3503d7edce835e7f731ea137fa5202e41b5bbf6eb",
+    "typeScriptVersion": "3.6"
 }

wavesurfer.js/README.md

@@ -11,4 +11,4 @@ # Installation
 ### Additional Details
- * Last updated: Wed, 05 May 2021 08:01:23 GMT
- * Dependencies: none
+ * Last updated: Mon, 07 Jun 2021 18:31:32 GMT
+ * Dependencies: [@types/debounce](https://npmjs.com/package/@types/debounce)
  * Global values: `WaveSurfer`
@@ -15,0 +15,0 @@

wavesurfer.js/src/plugin/cursor.d.ts

@@ -1,49 +0,58 @@
-import {
-    PluginDefinition,
-    PluginParams,
-    Styles,
-    WaveSurferObserver,
-    WaveSurferPlugin,
-    WaveSurferUtil,
-} from "../../index";
+import { PluginDefinition, PluginParams, WaveSurferPlugin } from "../../types/plugin";
+import { Styles } from "../../types/util";
+import Observer from "../util/observer";
+import WaveSurfer from "../wavesurfer";
+export default class CursorPlugin extends Observer implements WaveSurferPlugin {
+    constructor(params: CursorPluginParams, ws: WaveSurfer);
+    static create(params: CursorPluginParams): PluginDefinition;
+    destroy(): void;
+    init(): void;
 
-export = WaveSurfer.CursorPlugin;
+    formatTime(cursorTime: number): string;
+    hideCursor(): void;
+    outerWidth(element: Element): number;
+    showCursor(): void;
+    updateCursorPosition(xpos: number, ypos: number, flip: boolean): void;
 
-declare namespace WaveSurfer {
-    class CursorPlugin extends WaveSurferObserver implements WaveSurferPlugin {
-        constructor(params: CursorPluginParams, ws: WaveSurfer);
-        static create(params: CursorPluginParams): PluginDefinition;
-        destroy(): void;
-        init(): void;
+    /** The cursor HTML element. */
+    readonly cursor: HTMLElement;
+    readonly defaultParams: CursorPluginParams;
+    /** The html container that will display the time. */
+    readonly displayTime: HTMLElement;
+    readonly params: CursorPluginParams;
+    /** Displays the time next to the cursor. */
+    readonly showTime: HTMLElement;
+    readonly style: WaveSurfer["util"]["style"];
+    readonly wavesurfer: WaveSurfer;
+    readonly wrapper: HTMLElement;
+}
 
-        formatTime(cursorTime: number): string;
-        hideCursor(): void;
-        outerWidth(element: Element): number;
-        showCursor(): void;
-        updateCursorPosition(xpos: number, ypos: number, flip: boolean): void;
-
-        readonly cursor: HTMLElement;
-        readonly defaultParams: CursorPluginParams;
-        readonly displayTime: HTMLElement;
-        readonly params: CursorPluginParams;
-        readonly showTime: HTMLElement;
-        readonly style: WaveSurferUtil["style"];
-        readonly wavesurfer: WaveSurfer;
-        readonly wrapper: HTMLElement;
-    }
-
-    interface CursorPluginParams extends PluginParams {
-        container?: string;
-        hideOnBlur?: boolean;
-        width?: string;
-        color?: string;
-        opacity?: string;
-        style?: string;
-        zIndex?: number;
-        customStyle?: Styles;
-        showTime?: boolean;
-        customShowTimeStyle?: Styles;
-        followCursorY?: string | false;
-        formatTimeCallback?: ((cursorTime: number) => string) | null;
-    }
+export interface CursorPluginParams extends PluginParams {
+    /** Hide the cursor when the mouse leaves the waveform (default: true). */
+    hideOnBlur?: boolean;
+    /** The width of the cursor (default: '1px'). */
+    width?: string;
+    /** The color of the cursor (default: 'black'). */
+    color?: string;
+    /** The opacity of the cursor (default 0.25). */
+    opacity?: string;
+    /** The border style of the cursor (default: 'solid'). */
+    style?: string;
+    /** The z-index of the cursor element (default: 3). */
+    zIndex?: number;
+    /** An object with custom styles which are applied to the cursor element. */
+    customStyle?: Styles;
+    /** Show the time on the cursor (default: false). */
+    showTime?: boolean;
+    /** An object with custom styles which are applied to the cursor time element. */
+    customShowTimeStyle?: Styles;
+    /**
+     * Whether to follow both the x- and the y-position of the mouse (default: false).
+     *
+     * Use `true` to make the time on the cursor follow the x and the y-position of the mouse.
+     * Use `false` to make the it only follow the x-position of the mouse.
+     */
+    followCursorY?: string | false;
+    /** Formats the timestamp on the cursor. */
+    formatTimeCallback?: ((cursorTime: number) => string) | null;
 }

wavesurfer.js/src/plugin/elan.d.ts

@@ -1,18 +0,19 @@
-import { PluginDefinition, PluginParams, WaveSurferObserver, WaveSurferPlugin } from "../..";
+import { PluginDefinition, PluginParams, WaveSurferPlugin } from "../../types/plugin";
+import Observer from "../util/observer";
+import WaveSurfer from "../wavesurfer";
 
-export = WaveSurfer.ElanPlugin;
+export default class ElanPlugin extends Observer implements WaveSurferPlugin {
+    constructor(params: ElanPluginParams, ws: WaveSurfer);
+    static create(params: ElanPluginParams): PluginDefinition;
+    destroy(): void;
+    init(): void;
+}
 
-declare namespace WaveSurfer {
-    class ElanPlugin extends WaveSurferObserver implements WaveSurferPlugin {
-        constructor(params: ElanPluginParams, ws: WaveSurfer);
-        static create(params: ElanPluginParams): PluginDefinition;
-        destroy(): void;
-        init(): void;
-    }
-
-    interface ElanPluginParams extends PluginParams {
-        container?: string | HTMLElement;
-        url?: string;
-        tiers?: unknown;
-    }
+export interface ElanPluginParams extends PluginParams {
+    /** CSS selector or HTML element where the ELAN information should be rendered. */
+    container?: string | HTMLElement;
+    /** The location of ELAN XML data. */
+    url?: string;
+    /** If set only shows the data tiers with the TIER_ID in this map. */
+    tiers?: unknown;
 }

wavesurfer.js/src/plugin/markers.d.ts

@@ -1,47 +0,55 @@
-import { PluginDefinition, PluginParams, WaveSurferObserver, WaveSurferPlugin, WaveSurferUtil } from "../..";
+import { PluginDefinition, PluginParams, WaveSurferPlugin } from "../../types/plugin";
+import Observer from "../util/observer";
+import WaveSurfer from "../wavesurfer";
 
-export = WaveSurfer.MarkersPlugin;
-
-interface WaveSurfer {
-    addMarker(param: WaveSurfer.MarkerParams): WaveSurfer.Marker;
-    clearMarkers(): void;
+declare module "../../wavesurfer" {
+    interface WaveSurfer {
+        addMarker(param: MarkerParams): Marker;
+        clearMarkers(): void;
+    }
 }
-declare namespace WaveSurfer {
-    class MarkersPlugin extends WaveSurferObserver implements WaveSurferPlugin {
-        constructor(params: MarkersPluginParams, ws: WaveSurfer);
-        static create(params: MarkersPluginParams): PluginDefinition;
-        destroy(): void;
-        init(): void;
 
-        add(param: MarkerParams): Marker;
-        clear(): void;
-        remove(index: number): void;
+export default class MarkersPlugin extends Observer implements WaveSurferPlugin {
+    constructor(params: MarkersPluginParams, ws: WaveSurfer);
+    static create(params: MarkersPluginParams): PluginDefinition;
+    destroy(): void;
+    init(): void;
 
-        readonly markerHeight: number;
-        readonly markerWidth: number;
-        readonly markers: Marker[];
-        readonly params: MarkersPluginParams;
-        readonly style: WaveSurferUtil["style"];
-        readonly util: WaveSurferUtil;
-        readonly wavesurfer: WaveSurfer;
-        readonly wrapper: HTMLElement;
-    }
+    /** Add a marker. */
+    add(param: MarkerParams): Marker;
+    /** Remove all markers. */
+    clear(): void;
+    /** Remove a marker. */
+    remove(index: number): void;
 
-    interface Marker {
-        time: number;
-        label?: string;
-        color: string;
-        position: "top" | "bottom";
-    }
+    readonly markerHeight: number;
+    readonly markerWidth: number;
+    readonly markers: Marker[];
+    readonly params: MarkersPluginParams;
+    readonly style: WaveSurfer["util"]["style"];
+    readonly util: WaveSurfer["util"];
+    readonly wavesurfer: WaveSurfer;
+    readonly wrapper: HTMLElement;
+}
 
-    interface MarkersPluginParams {
-        markers?: MarkerParams[];
-    }
+export interface Marker {
+    time: number;
+    label?: string;
+    color: string;
+    position: "top" | "bottom";
+}
 
-    interface MarkerParams {
-        time: number;
-        label?: string;
-        color?: string;
-        position?: "top" | "bottom";
-    }
+export interface MarkersPluginParams {
+    /** Initial set of markers. */
+    markers?: MarkerParams[];
 }
+
+export interface MarkerParams {
+    /** The time to set the marker at. */
+    time: number;
+    /** An optional marker label. */
+    label?: string;
+    /** Background color for marker. */
+    color?: string;
+    position?: "top" | "bottom";
+}

wavesurfer.js/src/plugin/mediasession.d.ts

@@ -1,35 +0,34 @@
-import { PluginDefinition, PluginParams, WaveSurferObserver, WaveSurferPlugin } from "../..";
+import { PluginDefinition, PluginParams, WaveSurferPlugin } from "../../types/plugin";
+import Observer from "../util/observer";
+import WaveSurfer from "../wavesurfer";
 
-export = WaveSurfer.MediaSessionPlugin;
+export default class MediaSessionPlugin extends Observer implements WaveSurferPlugin {
+    constructor(params: MediaSessionPluginParams, ws: WaveSurfer);
+    static create(params: MediaSessionPluginParams): PluginDefinition;
+    destroy(): void;
+    init(): void;
 
-declare namespace WaveSurfer {
-    class MediaSessionPlugin extends WaveSurferObserver implements WaveSurferPlugin {
-        constructor(params: MediaSessionPluginParams, ws: WaveSurfer);
-        static create(params: MediaSessionPluginParams): PluginDefinition;
-        destroy(): void;
-        init(): void;
+    update(): void;
 
-        update(): void;
+    readonly metadata: MediaMetadata;
+    readonly params: MediaSessionPluginParams;
+    readonly wavesurfer: WaveSurfer;
+}
 
-        readonly metadata: MediaMetadata;
-        readonly params: MediaSessionPluginParams;
-        readonly wavesurfer: WaveSurfer;
-    }
+export interface MediaSessionPluginParams extends PluginParams {
+    /** Representation of the metadata associated with a MediaSession that can be used by user agents to provide a customized user interface. */
+    metadata: MediaMetadata;
+}
 
-    interface MediaSessionPluginParams extends PluginParams {
-        metadata: MediaMetadata;
-    }
+export interface MediaMetadata {
+    title: string;
+    artist: string;
+    album: string;
+    artwork: MediaImage[];
+}
 
-    interface MediaMetadata {
-        title: string;
-        artist: string;
-        album: string;
-        artwork: MediaImage[];
-    }
-
-    interface MediaImage {
-        src: string;
-        sizes?: string;
-        type?: string;
-    }
+export interface MediaImage {
+    src: string;
+    sizes?: string;
+    type?: string;
 }

wavesurfer.js/src/plugin/microphone.d.ts

@@ -1,54 +0,71 @@
-import { PluginDefinition, PluginParams, WaveSurferObserver, WaveSurferPlugin } from "../..";
+import { PluginDefinition, PluginParams, WaveSurferPlugin } from "../../types/plugin";
+import Observer from "../util/observer";
+import WaveSurfer from "../wavesurfer";
 
-export = WaveSurfer.MicrophonePlugin;
+export default class MicrophonePlugin extends Observer implements WaveSurferPlugin {
+    constructor(params: MicrophonePluginParams, ws: WaveSurfer);
+    static create(params: MicrophonePluginParams): PluginDefinition;
+    destroy(): void;
+    init(): void;
 
-declare namespace WaveSurfer {
-    class MicrophonePlugin extends WaveSurferObserver implements WaveSurferPlugin {
-        constructor(params: MicrophonePluginParams, ws: WaveSurfer);
-        static create(params: MicrophonePluginParams): PluginDefinition;
-        destroy(): void;
-        init(): void;
+    /** Connect the media sources that feed the visualization. */
+    connect(): void;
+    /** Browser detector. */
+    detectBrowser(): Browser;
+    /** Device error callback. */
+    deviceError(code: string): void;
+    /** Disconnect the media sources that feed the visualization. */
+    disconnect(): void;
+    /** Extract browser version out of the provided user agent string. */
+    extractVersion(uastring: string, expr: string, pos: number): number;
+    /** Audio input device is ready. */
+    gotStream(stream: MediaStream): void;
+    /** Pause visualization. */
+    pause(): void;
+    /** Play visualization. */
+    play(): void;
+    /** Redraw the waveform. */
+    reloadBuffer(event: AudioProcessingEvent): void;
+    /** Allow user to select audio input device. */
+    start(): void;
+    /** Stop the device stream and remove any remaining waveform drawing from the wavesurfer canvas. */
+    stop(): void;
+    /** Stop the device and the visualization. */
+    stopDevice(): void;
+    /** Pause/resume visualization. */
+    togglePlay(): void;
 
-        connect(): void;
-        detectBrowser(): Browser;
-        deviceError(code: string): void;
-        disconnect(): void;
-        extractVersion(uastring: string, expr: string, pos: number): number;
-        gotStream(stream: MediaStream): void;
-        pause(): void;
-        play(): void;
-        reloadBuffer(event: AudioProcessingEvent): void;
-        start(): void;
-        stop(): void;
-        stopDevice(): void;
-        togglePlay(): void;
+    readonly active: boolean;
+    readonly browser: Browser;
+    readonly bufferSize: number;
+    readonly constraints: MediaStreamConstraints;
+    readonly levelChecker: ScriptProcessorNode;
+    readonly localAudioBuffer: AudioBuffer;
+    readonly mediaStreamSource: MediaStreamAudioSourceNode;
+    readonly micContext: AudioContext;
+    readonly numberOfInputChannels: number;
+    readonly numberOfOutputChannels: number;
+    readonly params: MicrophonePluginParams;
+    readonly reloadBufferFunction: (event: AudioProcessingEvent) => void;
+    readonly stream: MediaStream;
+    readonly wavesurfer: WaveSurfer;
+}
 
-        readonly active: boolean;
-        readonly browser: Browser;
-        readonly bufferSize: number;
-        readonly constraints: MediaStreamConstraints;
-        readonly levelChecker: ScriptProcessorNode;
-        readonly localAudioBuffer: AudioBuffer;
-        readonly mediaStreamSource: MediaStreamAudioSourceNode;
-        readonly micContext: AudioContext;
-        readonly numberOfInputChannels: number;
-        readonly numberOfOutputChannels: number;
-        readonly params: MicrophonePluginParams;
-        readonly reloadBufferFunction: (event: AudioProcessingEvent) => void;
-        readonly stream: MediaStream;
-        readonly wavesurfer: WaveSurfer;
-    }
+export interface Browser {
+    browser: "firefox" | "chrome" | "edge" | "safari" | "Not a supported browser.";
+    minVersion: number | null;
+    version: number | null;
+}
 
-    interface Browser {
-        browser: "firefox" | "chrome" | "edge" | "safari" | "Not a supported browser.";
-        minVersion: number | null;
-        version: number | null;
-    }
+export interface MicrophonePluginParams extends PluginParams {
+    /** Constraints describing the media types requested. */
+    constraints?: MediaStreamConstraints;
+    /** The buffer size in units of sample-frames (default: 4096). */
+    bufferSize?: BufferSize;
+    /** Integer specifying the number of channels for this node's input (default: 1). Values of up to 32 are supported. */
+    numberOfInputChannels?: number;
+    /** Integer specifying the number of channels for this node's output. */
+    numberOfOutputChannels?: number;
+}
 
-    interface MicrophonePluginParams extends PluginParams {
-        constraints?: MediaStreamConstraints;
-        bufferSize?: number;
-        numberOfInputChannels?: number;
-        numberOfOutputChannels?: number;
-    }
-}
+export type BufferSize = 256 | 512 | 1024 | 2048 | 4096 | 8192 | 16384;

wavesurfer.js/src/plugin/minimap.d.ts

@@ -1,47 +0,40 @@
-import { WaveSurferObserver, Drawer, WaveSurferPlugin, PluginDefinition, PluginParams, WaveSurferUtil } from "../..";
-import RegionsPlugin = require("./regions");
+import { PluginDefinition, PluginParams, WaveSurferPlugin } from "../../types/plugin";
+import Drawer from "../drawer";
+import Observer from "../util/observer";
+import WaveSurfer from "../wavesurfer";
+import RegionsPlugin from "./regions";
 
-export = WaveSurfer.MinimapPlugin;
+export default class MinimapPlugin extends Observer implements WaveSurferPlugin {
+    constructor(params: MinimapPluginParams, ws: WaveSurfer);
+    static create(params: MinimapPluginParams): PluginDefinition;
+    destroy(): void;
+    init(): void;
 
-declare namespace WaveSurfer {
-    class MinimapPlugin extends WaveSurferObserver implements WaveSurferPlugin {
-        constructor(params: MinimapPluginParams, ws: WaveSurfer);
-        static create(params: MinimapPluginParams): PluginDefinition;
-        destroy(): void;
-        init(): void;
+    bindMinmapEvents(): void;
+    bindWavesurferEvents(): void;
+    createElements(): void;
+    getWidth(): number;
+    moveOverviewRegion(pixels: number): void;
+    regions(): void;
+    render(): void;
+    renderRegions(): void;
 
-        bindMinmapEvents(): void;
-        bindWavesurferEvents(): void;
-        createElements(): void;
-        getWidth(): number;
-        moveOverviewRegion(pixels: number): void;
-        regions(): void;
-        render(): void;
-        renderRegions(): void;
+    readonly draggingOverview: boolean;
+    readonly drawer: Drawer;
+    readonly overviewPosition: number;
+    readonly overviewRegion: HTMLElement | null;
+    readonly overviewWidth: number | null;
+    readonly params: MinimapPluginParams;
+    readonly ratio: number;
+    readonly regionsPlugin: RegionsPlugin | null;
+    readonly renderEvent: string;
+    readonly util: WaveSurfer["util"];
+    readonly waveShowedWidth: number;
+    readonly waveWidth: number;
+    readonly wavesurfer: WaveSurfer;
+}
 
-        readonly draggingOverview: boolean;
-        readonly drawer: Drawer;
-        readonly overviewPosition: number;
-        readonly overviewRegion: HTMLElement | null;
-        readonly overviewWidth: number | null;
-        readonly params: MinimapPluginParams;
-        readonly ratio: number;
-        readonly regionsPlugin: RegionsPlugin | null;
-        readonly renderEvent: string;
-        readonly util: WaveSurferUtil;
-        readonly waveShowedWidth: number;
-        readonly waveWidth: number;
-        readonly wavesurfer: WaveSurfer;
-    }
-
-    interface MinimapPluginParams extends PluginParams {
-        container?: string | HTMLElement | false;
-
-        showRegions?: boolean;
-        regionsPluginName?: string;
-        showOverview?: boolean;
-        overviewBorderColor?: string;
-        overviewBorderSize?: number;
-        height?: number;
-    }
+export interface MinimapPluginParams extends PluginParams {
+    /** CSS selector or HTML element where the map should be rendered. By default it is simply appended after the waveform. */
+    container?: string | HTMLElement | false;
 }

wavesurfer.js/src/plugin/playhead.d.ts

@@ -1,36 +0,34 @@
-import { WaveSurferObserver, WaveSurferPlugin, PluginDefinition, PluginParams, WaveSurferUtil } from "../..";
+import { PluginDefinition, PluginParams, WaveSurferPlugin } from "../../types/plugin";
+import Observer from "../util/observer";
+import WaveSurfer from "../wavesurfer";
 
-export = WaveSurfer.PlayheadPlugin;
+export default class PlayheadPlugin extends Observer implements WaveSurferPlugin {
+    constructor(params: PlayheadPluginParams, ws: WaveSurfer);
+    static create(params: PlayheadPluginParams): PluginDefinition;
+    destroy(): void;
+    init(): void;
 
-declare namespace WaveSurfer {
-    class PlayheadPlugin extends WaveSurferObserver implements WaveSurferPlugin {
-        constructor(params: PlayheadPluginParams, ws: WaveSurfer);
-        static create(params: PlayheadPluginParams): PluginDefinition;
-        destroy(): void;
-        init(): void;
+    setPlayheadTime(time: number): void;
+    wavesurferOn(ev: string, fn: EventListener): void;
 
-        setPlayheadTime(time: number): void;
-        wavesurferOn(ev: string, fn: EventListener): void;
+    readonly element: HTMLElement;
+    readonly markerHeight: number;
+    readonly markerWidth: number;
+    readonly options: Record<string, unknown>;
+    readonly params: PlayheadPluginParams;
+    readonly playheadTime: number;
+    readonly style: WaveSurfer["util"]["style"];
+    readonly unFuns: Array<(this: WaveSurfer) => void>;
+    readonly util: WaveSurfer["util"];
+    readonly wavesurfer: WaveSurfer;
+    readonly wrapper: HTMLElement;
+}
 
-        readonly element: HTMLElement;
-        readonly markerHeight: number;
-        readonly markerWidth: number;
-        readonly options: Record<string, unknown>;
-        readonly params: PlayheadPluginParams;
-        readonly playheadTime: number;
-        readonly style: WaveSurferUtil["style"];
-        readonly unFuns: Array<(this: WaveSurfer) => void>;
-        readonly util: WaveSurferUtil;
-        readonly wavesurfer: WaveSurfer;
-        readonly wrapper: HTMLElement;
-    }
-
-    interface PlayheadPluginParams extends PluginParams {
-        /** Draw the playhead as a triangle/line. */
-        draw?: boolean;
-        /** Seeking (via clicking) while playing moves the playhead. */
-        moveOnSeek?: boolean;
-        /** Pausing the track returns the seek position to the playhead. */
-        returnOnPause?: boolean;
-    }
+export interface PlayheadPluginParams extends PluginParams {
+    /** Draw the playhead as a triangle/line. */
+    draw?: boolean;
+    /** Seeking (via clicking) while playing moves the playhead. */
+    moveOnSeek?: boolean;
+    /** Pausing the track returns the seek position to the playhead. */
+    returnOnPause?: boolean;
 }

wavesurfer.js/src/plugin/regions.d.ts

@@ -1,124 +0,133 @@
-import {
-    Attributes,
-    Datas,
-    PluginDefinition,
-    PluginParams,
-    Styles,
-    WaveSurferObserver,
-    WaveSurferPlugin,
-    WaveSurferUtil,
-} from "../..";
+import { Styles } from "../../types/util";
+import { PluginDefinition, PluginParams, WaveSurferPlugin } from "../../types/plugin";
+import Observer from "../util/observer";
+import WaveSurfer from "../wavesurfer";
 
-export = WaveSurfer.RegionsPlugin;
-
-declare class WaveSurfer {
-    addRegion(regionParams: WaveSurfer.RegionParams): void;
-    clearRegions(): void;
-    enableDragSelection(options: WaveSurfer.RegionParams): void;
+declare module "../../wavesurfer" {
+    interface WaveSurfer {
+        addRegion(regionParams: RegionParams): void;
+        clearRegions(): void;
+        enableDragSelection(options: RegionParams): void;
+    }
 }
 
-declare namespace WaveSurfer {
-    class RegionsPlugin extends WaveSurferObserver implements WaveSurferPlugin {
-        constructor(params: RegionsPluginParams, ws: WaveSurfer);
-        static create(params: RegionsPluginParams): PluginDefinition;
-        destroy(): void;
-        init(): void;
+export default class RegionsPlugin extends Observer implements WaveSurferPlugin {
+    constructor(params: RegionsPluginParams, ws: WaveSurfer);
+    static create(params: RegionsPluginParams): PluginDefinition;
+    destroy(): void;
+    init(): void;
 
-        add(params: RegionParams): Region;
-        clear(): void;
-        disableDragSelection(): void;
-        enableDragSelection(options: RegionParams): void;
-        getCurrentRegion(): Region | null;
-        getRegionSnapToGridValue(value: number, params: RegionParams): number;
+    add(params: RegionParams): Region;
+    clear(): void;
+    disableDragSelection(): void;
+    enableDragSelection(options: RegionParams): void;
+    getCurrentRegion(): Region | null;
+    getRegionSnapToGridValue(value: number, params: RegionParams): number;
 
-        readonly list: Region[];
-        readonly maxRegions: number[];
-        readonly params: RegionsPluginParams;
-        readonly regionsMinLength: number;
-        readonly util: WaveSurferUtil;
-        readonly wavesurfer: WaveSurfer;
-        readonly wrapper: HTMLElement;
-    }
+    readonly list: Region[];
+    readonly maxRegions: number[];
+    readonly params: RegionsPluginParams;
+    readonly regionsMinLength: number;
+    readonly util: WaveSurfer["util"];
+    readonly wavesurfer: WaveSurfer;
+    readonly wrapper: HTMLElement;
+}
 
-    interface RegionsPluginParams extends PluginParams {
-        dragSelection?: boolean;
-        regions?: RegionParams[];
-        slop?: number;
-        snapToGridInterval?: number;
-        maxRegions?: number[];
-        formatTimeCallback?: () => string;
-        edgeScrollWidth?: number;
-    }
+export interface RegionsPluginParams extends PluginParams {
+    /** Enable creating regions by dragging with the mouse. */
+    dragSelection?: boolean;
+    /** Regions that should be added upon initialisation. */
+    regions?: RegionParams[];
+    /** The sensitivity of the mouse dragging (default: 2). */
+    slop?: number;
+    /** Snap the regions to a grid of the specified multiples in seconds? */
+    snapToGridInterval?: number;
+    /** Shift the snap-to-grid by the specified seconds. May also be negative. */
+    snapToGridOffset?: number;
+    /** Maximum number of regions that may be created by the user at one time. */
+    maxRegions?: number[];
+    /** Allows custom formating for region tooltip. */
+    formatTimeCallback?: () => string;
+    /** from container edges' Optional width for edgeScroll to start (default: 5% of viewport width). */
+    edgeScrollWidth?: number;
+}
 
-    class Region extends WaveSurferObserver {
-        constructor(params: RegionParams, regionsUtil: WaveSurferUtil, ws: WaveSurfer);
+export class Region extends Observer {
+    constructor(params: RegionParams, regionsUtil: WaveSurfer["util"], ws: WaveSurfer);
 
-        bindRagEvents(): void;
-        bindEvents(): void;
-        bindInOut(): void;
-        formatTime(start: number, end: number): string;
-        getWidth(): number;
-        onDrag(delta: number): void;
-        onResize(delta: number, direction: "start" | "end"): void;
-        play(start: number): void;
-        playLoop(start: number): void;
-        remove(): void;
-        render(): void;
-        setLoop(loop: boolean): void;
-        update(params: RegionParams): void;
-        updateHandlesResize(resize: boolean): void;
-        updateRender(): void;
+    bindRagEvents(): void;
+    bindEvents(): void;
+    bindInOut(): void;
+    formatTime(start: number, end: number): string;
+    getWidth(): number;
+    onDrag(delta: number): void;
+    onResize(delta: number, direction: "start" | "end"): void;
+    play(start: number): void;
+    playLoop(start: number): void;
+    remove(): void;
+    render(): void;
+    setLoop(loop: boolean): void;
+    update(params: RegionParams): void;
+    updateHandlesResize(resize: boolean): void;
+    updateRender(): void;
 
-        readonly attributes: Attributes;
-        readonly color: string;
-        readonly data: Datas;
-        readonly drag: boolean;
-        readonly edgeScrollWidth?: number;
-        readonly element: HTMLElement;
-        readonly end: number;
-        readonly firedIn: boolean;
-        readonly firedOut: boolean;
-        readonly formatTimeCallback?: (start: number, end: number) => string;
-        readonly handleLeftEl: HTMLElement | null;
-        readonly handleRightEl: HTMLElement | null;
-        readonly handleStyle: HandleStyle;
-        readonly id: string;
-        readonly isDragging: boolean;
-        readonly isResizing: boolean;
-        readonly loop: boolean;
-        readonly marginTop: string;
-        readonly maxLength: number;
-        readonly minLength: number;
-        readonly preventContextMenu: boolean;
-        readonly regionHeight: string;
-        readonly regionsUtil: WaveSurferUtil;
-        readonly resize: boolean;
-        readonly scroll: boolean;
-        readonly scrollSpeed: number;
-        readonly scrollThreshold: number;
-        readonly start: number;
-        readonly style: WaveSurferUtil["style"];
-        readonly util: WaveSurferUtil;
-        readonly wavesurfer: WaveSurfer;
-        readonly wrapper: HTMLElement;
-    }
+    readonly attributes: Attributes;
+    readonly color: string;
+    readonly data: Datas;
+    readonly drag: boolean;
+    readonly edgeScrollWidth?: number;
+    readonly element: HTMLElement;
+    readonly end: number;
+    readonly firedIn: boolean;
+    readonly firedOut: boolean;
+    readonly formatTimeCallback?: (start: number, end: number) => string;
+    readonly handleLeftEl: HTMLElement | null;
+    readonly handleRightEl: HTMLElement | null;
+    readonly handleStyle: HandleStyle;
+    readonly id: string;
+    readonly isDragging: boolean;
+    readonly isResizing: boolean;
+    readonly loop: boolean;
+    readonly marginTop: string;
+    readonly maxLength: number;
+    readonly minLength: number;
+    readonly preventContextMenu: boolean;
+    readonly regionHeight: string;
+    readonly regionsUtil: WaveSurfer["util"];
+    readonly resize: boolean;
+    readonly scroll: boolean;
+    readonly scrollSpeed: number;
+    readonly scrollThreshold: number;
+    readonly start: number;
+    readonly style: WaveSurfer["util"]["style"];
+    readonly util: WaveSurfer["util"];
+    readonly wavesurfer: WaveSurfer;
+    readonly wrapper: HTMLElement;
+}
 
-    interface RegionParams {
-        id: string;
-        start?: number;
-        end?: number;
-        loop?: boolean;
-        drag?: boolean;
-        resize?: boolean;
-        color?: string;
-        channelIdx?: number;
-        handleStyle?: HandleStyle;
-        preventContextMenu?: boolean;
-        showTooltip?: boolean;
-    }
+export interface RegionParams {
+    id: string;
+    start?: number;
+    end?: number;
+    loop?: boolean;
+    drag?: boolean;
+    resize?: boolean;
+    color?: string;
+    channelIdx?: number;
+    handleStyle?: HandleStyle;
+    preventContextMenu?: boolean;
+    showTooltip?: boolean;
+}
 
-    interface HandleStyle {
-        left: Styles;
-        right: Styles;
-    }
+export interface HandleStyle {
+    left: Styles;
+    right: Styles;
 }
+
+export interface Attributes {
+    [attributeName: string]: string;
+}
+
+export interface Datas {
+    [dataName: string]: string;
+}

wavesurfer.js/src/plugin/spectogram.d.ts

@@ -1,56 +0,67 @@
-import { Drawer, PluginDefinition, PluginParams, WaveSurferObserver, WaveSurferPlugin, WaveSurferUtil } from "../..";
+import { PluginDefinition, PluginParams, WaveSurferPlugin } from "../../types/plugin";
+import Drawer from "../drawer";
+import Observer from "../util/observer";
+import WaveSurfer from "../wavesurfer";
 
-export = WaveSurfer.SpectogramPlugin;
+declare module "../../wavesurfer" {
+    interface WaveSurfer {
+        FFT(bufferSize: number, sampleRate: number, windowFunc: WindowFunction, alpha: number): void;
+    }
+}
 
-interface WaveSurfer {
-    FFT(bufferSize: number, sampleRate: number, windowFunc: WaveSurfer.WindowFunction, alpha: number): void;
+export default class SpectogramPlugin extends Observer implements WaveSurferPlugin {
+    constructor(params: SpectogramPluginParams, ws: WaveSurfer);
+    static create(params: SpectogramPluginParams): PluginDefinition;
+    destroy(): void;
+    init(): void;
+
+    readonly alpha: number;
+    readonly colorMap: number[][];
+    readonly container: HTMLElement;
+    readonly drawer: Drawer;
+    readonly fftSamples: number;
+    readonly frequenciesDataUrl: string;
+    readonly height: number;
+    readonly noverlap: number;
+    readonly params: SpectogramPluginParams;
+    readonly pixelRatio: number;
+    readonly spectrCc: CanvasRenderingContext2D;
+    readonly util: WaveSurfer["util"];
+    readonly wavesurfer: WaveSurfer;
+    readonly width: number;
+    readonly windowFunc: WindowFunction;
+    readonly wrapper: HTMLElement;
 }
 
-declare namespace WaveSurfer {
-    class SpectogramPlugin extends WaveSurferObserver implements WaveSurferPlugin {
-        constructor(params: SpectogramPluginParams, ws: WaveSurfer);
-        static create(params: SpectogramPluginParams): PluginDefinition;
-        destroy(): void;
-        init(): void;
+export interface SpectogramPluginParams extends PluginParams {
+    /** Selector of element or element in which to render. */
+    container: string | HTMLElement;
+    /** Number of samples to fetch to FFT. Must be a power of 2. */
+    fftSamples?: number;
+    /** Set to true to display frequency labels. */
+    labels?: boolean;
+    /** Size of the overlapping window. Must be < fftSamples. Auto deduced from canvas size by default. */
+    noverlap?: number;
+    /** The window function to be used. */
+    windowFunc?: WindowFunction;
+    /** Some window functions have this extra value (between 0 and 1). */
+    alpha?: number;
+    /** Controls the size of the spectrogram in relation with its canvas (1 = Draw on the whole canvas. 2 = Draw on a quarter, i.e. 1/2 the length and 1/2 the width). */
+    pixelRatio?: number;
+    /** A 256 long array of 4-element arrays. Each entry should contain a float between 0 and 1 and specify r, g, b, and alpha. */
+    colorMap?: RGBA[] & { length: 256 };
+}
 
-        readonly alpha: number;
-        readonly colorMap: number[][];
-        readonly container: HTMLElement;
-        readonly drawer: Drawer;
-        readonly fftSamples: number;
-        readonly frequenciesDataUrl: string;
-        readonly height: number;
-        readonly noverlap: number;
-        readonly params: SpectogramPluginParams;
-        readonly pixelRatio: number;
-        readonly spectrCc: CanvasRenderingContext2D;
-        readonly util: WaveSurferUtil;
-        readonly wavesurfer: WaveSurfer;
-        readonly width: number;
-        readonly windowFunc: WindowFunction;
-        readonly wrapper: HTMLElement;
-    }
+export type RGBA = [number, number, number, number];
 
-    interface SpectogramPluginParams extends PluginParams {
-        container?: string | HTMLElement;
-        fftSamples?: number;
-        labels?: boolean;
-        noverlap?: number;
-        windowFunc?: WindowFunction;
-        alpha?: number;
-        pixelRatio?: number;
-        colorMap?: number[][];
-    }
-
-    type WindowFunction =
-        | "bartlett"
-        | "bartlettHann"
-        | "blackman"
-        | "cosine"
-        | "gauss"
-        | "hamming"
-        | "hann"
-        | "lanczoz"
-        | "rectangular"
-        | "triangular";
-}
+export type WindowFunction =
+    | "bartlett"
+    | "bartlettHann"
+    | "blackman"
+    | "cosine"
+    | "gauss"
+    | "hamming"
+    | "hann"
+    | "lanczoz"
+    | "rectangular"
+    | "triangular";

wavesurfer.js/src/plugin/timeline.d.ts

@@ -1,56 +0,82 @@
-import { PluginDefinition, PluginParams, WaveSurferObserver, WaveSurferPlugin, WaveSurferUtil } from "../..";
+import { PluginDefinition, PluginParams, WaveSurferPlugin } from "../../types/plugin";
+import Observer from "../util/observer";
+import WaveSurfer from "../wavesurfer";
 
-export = WaveSurfer.TimelinePlugin;
+export default class TimelinePlugin extends Observer implements WaveSurferPlugin {
+    constructor(params: TimelinePluginParams, ws: WaveSurfer);
+    static create(params: TimelinePluginParams): PluginDefinition;
+    destroy(): void;
+    init(): void;
 
-declare namespace WaveSurfer {
-    class TimelinePlugin extends WaveSurferObserver implements WaveSurferPlugin {
-        constructor(params: TimelinePluginParams, ws: WaveSurfer);
-        static create(params: TimelinePluginParams): PluginDefinition;
-        destroy(): void;
-        init(): void;
+    /** Add new timeline canvas. */
+    addCanvas(): void;
+    /** Create a timeline element to wrap the canvases drawn by this plugin. */
+    createWrapper(): void;
+    /** Turn the time into a suitable label for the time. */
+    defaultFormatTimeCallback(seconds: number, pxPerSec: number): number;
+    /** Return the cadence of notches that get labels in the primary color. */
+    defaultPrimaryLabelInterval(pxPerSec: number): number;
+    /** Return the cadence of notches that get labels in the secondary color. */
+    defaultSecondaryLabelInterval(pxPerSec: number): number;
+    /** Return how many seconds should be between each notch. */
+    defaultTimeInterval(pxPerSec: number): number;
+    /** Draw a rectangle on the canvases. */
+    fillRect(x: number, y: number, width: number, height: number): void;
+    /** Fill a given text on the canvases. */
+    fillText(text: string, x: number, y: number): void;
+    /** Remove timeline canvas. */
+    removeCanvas(): void;
+    /** Render the timeline (also updates the already rendered timeline). */
+    render(): void;
+    /** Render the timeline labels and notches. */
+    renderCanvases(): void;
+    /** Set the canvas fill style. */
+    setFillStyles(fillStyle: string | CanvasGradient | CanvasPattern): void;
+    /** Set the canvas font. */
+    setFonts(font: string): void;
+    /** Make sure the correct of timeline canvas elements exist and are cached in this.canvases. */
+    updateCanvases(): void;
+    /** Update the dimensions and positioning style for all the timeline canvases. */
+    updateCanvasesPositioning(): void;
 
-        addCanvas(): void;
-        createWrapper(): void;
-        defaultFormatTimeCallback(seconds: number, pxPerSec: number): number;
-        defaultPrimaryLabelInterval(pxPerSec: number): number;
-        defaultSecondaryLabelInterval(pxPerSec: number): number;
-        defaultTimeInterval(pxPerSec: number): number;
-        fillRect(x: number, y: number, width: number, height: number): void;
-        fillText(text: string, x: number, y: number): void;
-        removeCanvas(): void;
-        render(): void;
-        renderCanvases(): void;
-        setFillStyles(fillStyle: string | CanvasGradient | CanvasPattern): void;
-        setFonts(font: string): void;
-        updateCanvases(): void;
-        updateCanvasesPositioning(): void;
+    readonly canvases: HTMLCanvasElement[];
+    readonly container: string | HTMLElement;
+    readonly params: TimelinePluginParams;
+    readonly util: WaveSurfer["util"];
+    readonly wavesurfer: WaveSurfer;
+    readonly wrapper: HTMLElement;
+}
 
-        readonly canvases: HTMLCanvasElement[];
-        readonly container: string | HTMLElement;
-        readonly params: TimelinePluginParams;
-        readonly util: WaveSurferUtil;
-        readonly wavesurfer: WaveSurfer;
-        readonly wrapper: HTMLElement;
-    }
-
-    interface TimelinePluginParams extends PluginParams {
-        container?: string | HTMLElement;
-        height?: number;
-        notchPercentHeight?: number;
-        unlabeledNotchColor?: string;
-        primaryColor?: string;
-        secondaryColor?: string;
-        primaryFontColor?: string;
-        secondaryFontColor?: string;
-        labelPadding?: number;
-        zoomDebounce?: number | false;
-        fontFamily?: string;
-        fontSize?: number;
-        duration?: number | null;
-        formatTimecallback?: (sec: number, pxPerSec: number) => string;
-        timeInterval?: (pxPerSec: number) => number;
-        primaryLabelInterval?: (pxPerSec: number) => number;
-        secondaryLabelInterval?: (pxPerSec: number) => number;
-        offset?: number;
-    }
+export interface TimelinePluginParams extends PluginParams {
+    /** CSS selector or HTML element where the timeline should be drawn. This is the only required parameter. */
+    container: string | HTMLElement;
+    /** Height of notches in percent (default: 90). */
+    notchPercentHeight?: number;
+    /** The colour of the notches that do not have labels (default: '#c0c0c0'). */
+    unlabeledNotchColor?: string;
+    /** The colour of the main notches (default: '#000'). */
+    primaryColor?: string;
+    /** The colour of the secondary notches (default: '#c0c0c0'). */
+    secondaryColor?: string;
+    /** The colour of the labels next to the main notches (default: '#000'). */
+    primaryFontColor?: string;
+    /** The colour of the labels next to the secondary notches (default: '#000'). */
+    secondaryFontColor?: string;
+    /** The padding between the label and the notch (default: 5). */
+    labelPadding?: number;
+    /** A debounce timeout to increase rendering performance for large files. */
+    zoomDebounce?: number | false;
+    fontFamily?: string;
+    /** Font size of labels in pixels (default: 10). */
+    fontSize?: number;
+    /** Length of the track in seconds. Overrides getDuration() for setting length of timeline. */
+    duration?: number | null;
+    formatTimecallback?: (sec: number, pxPerSec: number) => string;
+    timeInterval?: (pxPerSec: number) => number;
+    /** Cadence between labels in primary color. */
+    primaryLabelInterval?: (pxPerSec: number) => number;
+    /** Cadence between labels in secondary color. */
+    secondaryLabelInterval?: (pxPerSec: number) => number;
+    /** Offset for the timeline start in seconds. May also be negative. */
+    offset?: number;
 }

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

55118

increased by49.64%

Number of package files

41

increased by192.86%

Lines of code

1205

increased by35.7%

Number of low quality alerts

0

decreased by-100%

Worsened metrics

Dependency count

1

increased byInfinity%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@types/debounce@*

• + Added@types/debounce@3.0.0(transitive)