Add types for react-howler package

types/react-howler/index.d.ts

@@ -0,0 +1,49 @@
+// Type definitions for react-howler 3.7
+// Project: https://github.com/thangngoc89/react-howler
+// Definitions by: Danijel Maksimovic <https://github.com/maksimovicdanijel>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 3.2
+
+/// <reference types="../react"/>
+/// <reference types="../howler"/>
+
+import * as React from 'react';
+import { Howl } from 'howler';
+
+declare enum HOWLER_STATE {
+    UNLOADED = 'unloaded',
+    LOADING = 'loading',
+    LOADED = 'loaded'
+}
+
+interface Props {
+    src: string | string[];
+    format?: string[];
+    playing?: boolean;
+    mute?: boolean;
+    loop?: boolean;
+    preload?: boolean;
+    volume?: number;
+    onEnd?: () => void;
+    onPause?: () => void;
+    onPlay?: (id: number) => void;
+    onVolume?: (id: number) => void;
+    onStop?: (id: number) => void;
+    onLoad?: () => void;
+    onLoadError?: (id: number) => void;
+    html5?: boolean;
+}
+
+declare class ReactHowler extends React.Component<Props> {
+    stop(id?: number): void;
+
+    duration(id?: number): number;
+
+    seek(time: number): number;
+
+    howlerState(): HOWLER_STATE;
+
+    howler: Howl;
+}
+
+export default ReactHowler;

types/react-howler/react-howler-tests.tsx

@@ -0,0 +1,39 @@
+import * as React from 'react';
+import ReactHowler from 'react-howler';
+
+export class ReactHowlerTest extends React.Component {
+    private readonly player = React.createRef<ReactHowler>();
+
+    render() {
+        const player = this.player.current;
+
+        if (player) {
+            player.howler.duration();
+        }
+
+        return (
+            <div>
+                <ReactHowler
+                    src={'some-source-url.mp3'}
+                    playing={false}
+                    mute={true}
+                    onPlay={id => console.log('playing sound with id ', id)}
+                    onLoad={() => console.log('sound loaded')}
+                    onLoadError={id =>
+                        console.log('error loading sound with id ', id)
+                    }
+                    onEnd={() => console.log('sound ended')}
+                    onPause={() => console.log('sound paused')}
+                    onStop={id => console.log('sound with id paused', id)}
+                    volume={0.5}
+                    onVolume={id => console.log('volume changed', id)}
+                    loop={true}
+                    html5={true}
+                    format={['mp3']}
+                    preload={false}
+                    ref={this.player}
+                />
+            </div>
+        );
+    }
+}

types/react-howler/tsconfig.json

@@ -0,0 +1,17 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "lib": ["es6", "dom"],
+        "noImplicitAny": true,
+        "noImplicitThis": true,
+        "strictNullChecks": true,
+        "baseUrl": "../",
+        "typeRoots": ["../"],
+        "jsx": "react",
+        "types": [],
+        "noEmit": true,
+        "forceConsistentCasingInFileNames": true,
+        "strictFunctionTypes": false
+    },
+    "files": ["index.d.ts", "react-howler-tests.tsx"]
+}

types/react-howler/tslint.json

@@ -0,0 +1 @@
+{ "extends": "dtslint/dt.json" }