diff --git a/types/react-howler/index.d.ts b/types/react-howler/index.d.ts new file mode 100644 index 0000000000..51722f9079 --- /dev/null +++ b/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 +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 3.2 + +/// +/// + +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 { + stop(id?: number): void; + + duration(id?: number): number; + + seek(time: number): number; + + howlerState(): HOWLER_STATE; + + howler: Howl; +} + +export default ReactHowler; diff --git a/types/react-howler/react-howler-tests.tsx b/types/react-howler/react-howler-tests.tsx new file mode 100644 index 0000000000..e840da7dde --- /dev/null +++ b/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(); + + render() { + const player = this.player.current; + + if (player) { + player.howler.duration(); + } + + return ( +
+ 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} + /> +
+ ); + } +} diff --git a/types/react-howler/tsconfig.json b/types/react-howler/tsconfig.json new file mode 100644 index 0000000000..fe1b001df3 --- /dev/null +++ b/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"] +} diff --git a/types/react-howler/tslint.json b/types/react-howler/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/react-howler/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" }