diff --git a/types/react-avatar-editor/index.d.ts b/types/react-avatar-editor/index.d.ts new file mode 100644 index 0000000000..a3bbf49f3b --- /dev/null +++ b/types/react-avatar-editor/index.d.ts @@ -0,0 +1,51 @@ +// Type definitions for react-avatar-editor 10.3 +// Project: https://github.com/mosch/react-avatar-editor +// Definitions by: Diogo CorrĂȘa +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 2.6 + +import * as React from "react"; + +export interface ImageState { + height: number; + width: number; + x: number; + y: number; + resource: ImageData; +} + +export interface CroppedRect { + x: number; + y: number; + width: number; + height: number; +} + +export interface AvatarEditorProps { + image: string | File; + width?: number; + height?: number; + border?: number | number[]; + borderRadius?: number; + color?: number[]; + style?: object; + scale?: number; + position?: object; + rotate?: number; + crossOrigin?: string; + disableDrop?: boolean; + onDropFile?(event: DragEvent): void; + onLoadFailure?(event: Event): void; + onLoadSuccess?(imgInfo: ImageState): void; + onImageReady?(event: Event): void; + onMouseUp?(): void; + onMouseMove?(event: Event): void; + onImageChange?(): void; + onPositionChange?(): void; +} + +export default class AvatarEditor extends React.Component { + static getImage(): HTMLCanvasElement; + static getImageScaledToCanvas(): HTMLCanvasElement; + static getCroppingRect(): CroppedRect; +} diff --git a/types/react-avatar-editor/react-avatar-editor-tests.tsx b/types/react-avatar-editor/react-avatar-editor-tests.tsx new file mode 100644 index 0000000000..063d083f3f --- /dev/null +++ b/types/react-avatar-editor/react-avatar-editor-tests.tsx @@ -0,0 +1,47 @@ +import * as React from "react"; +import AvatarEditor, { ImageState, CroppedRect } from "react-avatar-editor"; + +const file: File = new File(["str"], "image.jpg"); +const image: ImageData = new ImageData(1, 2); +const imageState: ImageState = { + height: 1, + width: 1, + x: 1, + y: 1, + resource: image +}; + +class AvatarEditorTest extends React.Component { + render() { + return ( +
+ + + + + + + + + + + + + + + {}} /> + {}} /> + {}} /> + {}} /> + {}} /> + {}} /> + {}} /> + {}} /> +
+ ); + } +} + +const getImage: HTMLCanvasElement = AvatarEditor.getImage(); +const getImageScaledToCanvas: HTMLCanvasElement = AvatarEditor.getImageScaledToCanvas(); +const getCroppingRect: CroppedRect = AvatarEditor.getCroppingRect(); diff --git a/types/react-avatar-editor/tsconfig.json b/types/react-avatar-editor/tsconfig.json new file mode 100644 index 0000000000..b947d3271a --- /dev/null +++ b/types/react-avatar-editor/tsconfig.json @@ -0,0 +1,25 @@ +{ + "files": [ + "index.d.ts", + "react-avatar-editor-tests.tsx" + ], + "compilerOptions": { + "jsx": "react", + "module": "commonjs", + "lib": [ + "es6", + "dom" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "strictFunctionTypes": true, + "baseUrl": "../", + "typeRoots": [ + "../" + ], + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true + } +} diff --git a/types/react-avatar-editor/tslint.json b/types/react-avatar-editor/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/react-avatar-editor/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" }