[react-signature-canvas] Add definitions

types/react-signature-canvas/index.d.ts

@@ -0,0 +1,38 @@
+// Type definitions for react-signature-canvas 1.0
+// Project: https://github.com/agilgur5/react-signature-canvas
+// Definitions by: Kamil Socha <https://github.com/ksocha>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+
+import * as React from 'react';
+import SignaturePad from 'signature_pad';
+
+export interface ReactSignatureCanvasProps extends SignaturePad.SignaturePadOptions {
+    canvasProps?: React.CanvasHTMLAttributes<HTMLCanvasElement>;
+    clearOnResize?: boolean;
+}
+
+declare class ReactSignatureCanvas extends React.Component<ReactSignatureCanvasProps> {
+    on: SignaturePad['on'];
+
+    off: SignaturePad['off'];
+
+    clear: SignaturePad['clear'];
+
+    isEmpty: SignaturePad['isEmpty'];
+
+    fromDataURL: SignaturePad['fromDataURL'];
+
+    toDataURL: SignaturePad['toDataURL'];
+
+    fromData: SignaturePad['fromData'];
+
+    toData: SignaturePad['toData'];
+
+    getCanvas(): HTMLCanvasElement;
+
+    getTrimmedCanvas(): HTMLCanvasElement;
+
+    getSignaturePad(): SignaturePad;
+}
+
+export default ReactSignatureCanvas;

types/react-signature-canvas/react-signature-canvas-tests.tsx

@@ -0,0 +1,52 @@
+import ReactSignatureCanvas from 'react-signature-canvas';
+import SignaturePad from 'signature_pad';
+import * as React from 'react';
+
+const ReactSignatureCanvasNoOptions: JSX.Element = <ReactSignatureCanvas />;
+
+const ReactSignatureCanvasDotSizeFunctionOptions: JSX.Element = <ReactSignatureCanvas dotSize={() => 4} />;
+
+const ReactSignatureCanvasAllOptions: JSX.Element = (
+    <ReactSignatureCanvas
+        dotSize={2}
+        minWidth={2}
+        maxWidth={2}
+        throttle={2}
+        minDistance={2}
+        backgroundColor="blue"
+        penColor="red"
+        velocityFilterWeight={2}
+        onBegin={(event: MouseEvent) => {}}
+        onEnd={(event: MouseEvent) => {}}
+        canvasProps={{
+            title: 'canvas',
+            width: '50%',
+            height: 300,
+            className: 'canvas',
+            style: { border: '2px solid #000' },
+        }}
+        clearOnResize
+    />
+);
+
+class Example extends React.Component {
+    canvasRef = React.createRef<ReactSignatureCanvas>();
+
+    componentDidMount() {
+        if (this.canvasRef.current) {
+            this.canvasRef.current.clear();
+            this.canvasRef.current.fromData([[new SignaturePad.Point(1, 2, 3)]]);
+            this.canvasRef.current.fromDataURL('url');
+            this.canvasRef.current.fromDataURL('url', { height: 1, width: 4 });
+            const isEmptyResult: boolean = this.canvasRef.current.isEmpty();
+            this.canvasRef.current.off();
+            this.canvasRef.current.on();
+            const toDataResult: SignaturePad.Point[][] = this.canvasRef.current.toData();
+            const toDataURLResult: string = this.canvasRef.current.toDataURL();
+        }
+    }
+
+    render() {
+        return <ReactSignatureCanvas ref={this.canvasRef} />;
+    }
+}

types/react-signature-canvas/tsconfig.json

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

types/react-signature-canvas/tslint.json

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