added updated type definitions for v1.6.1 and entry into package.json (#47)

* added updated type definitions for v1.6.1 and entry into package.json

* updated readme for type usage

README.md

@@ -87,10 +87,7 @@ npm install vanilla-tilt
 
 #### Typings
 
-Installing typings using npm
-```
-npm install @types/vanilla-tilt
-```
+Typings were out of date in the previous version, so I've rolled a copy directly into the application for you would be Typescript junkies!
 
 ### Credits
 

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "vanilla-tilt",
-  "version": "1.5.0",
+  "version": "1.6.1",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -2342,12 +2342,14 @@
         "balanced-match": {
           "version": "1.0.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -2362,17 +2364,20 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "concat-map": {
           "version": "0.0.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -2489,7 +2494,8 @@
         "inherits": {
           "version": "2.0.3",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "ini": {
           "version": "1.3.5",
@@ -2501,6 +2507,7 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -2515,6 +2522,7 @@
           "version": "3.0.4",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -2522,12 +2530,14 @@
         "minimist": {
           "version": "0.0.8",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "minipass": {
           "version": "2.2.4",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.1",
             "yallist": "^3.0.0"
@@ -2546,6 +2556,7 @@
           "version": "0.5.1",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -2626,7 +2637,8 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -2638,6 +2650,7 @@
           "version": "1.4.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -2759,6 +2772,7 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",

package.json

@@ -6,6 +6,7 @@
   "module_es2015": "lib/vanilla-tilt.es2015.js",
   "jsnext:main": "lib/vanilla-tilt.es2015.js",
   "distrib": "dist/vanilla-tilt.js",
+  "types": "vanilla-tilt.d.ts",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "build": "npm run build:lib && cp ./README.md ./lib",

vanilla-tilt.d.ts

@@ -0,0 +1,147 @@
+// Extended Type definitions for vanilla-tilt 1.6.1
+// Project: https://github.com/micku7zu/vanilla-tilt.js
+// Definitions by: Livio Brunner <https://github.com/BrunnerLivio>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+
+/**
+ * Options which configures the tilting
+ */
+export interface TiltOptions {
+  /**
+   * Reverse the tilt direction
+   */
+  reverse?: boolean;
+  /**
+   * Max tilt rotation (degrees)
+   */
+  max?: number;
+  /**
+   * Transform perspective, the lower the more extreme the tilt gets.
+   */
+  perspective?: number;
+  /**
+   * 2 = 200%, 1.5 = 150%, etc..
+   */
+  scale?: number;
+  /**
+   * Speed of the enter/exit transition
+   */
+  speed?: number;
+  /**
+   * Set a transition on enter/exit.
+   */
+  transition?: boolean;
+  /**
+   * What axis should be disabled. Can be X or Y.
+   */
+  axis?: null | "x" | "y";
+  /**
+   * If the tilt effect has to be reset on exit.
+   */
+  reset?: boolean;
+  /**
+   * Easing on enter/exit.
+   */
+  easing?: string;
+  /**
+   * if it should have a "glare" effect
+   */
+  glare?: boolean;
+  /**
+   * the maximum "glare" opacity
+   */
+  "max-glare"?: number;
+  /**
+   * false = VanillaTilt creates the glare elements for you, otherwise
+   * you need to add .js-tilt-glare>.js-tilt-glare-inner by yourself
+   */
+  "glare-prerender"?: boolean;
+
+  // Boolean to enable/disable device orientation detection,
+  gyroscope?: boolean;
+
+  // css-selector or link to HTML-element what will be listen mouse events
+  "mouse-event-element"?: string;
+
+  // This is the bottom limit of the device angle on X axis,
+  // meaning that a device rotated at this angle would tilt the element as if
+  // the mouse was on the left border of the element;
+  gyroscopeMinAngleX?: number
+
+  // This is the top limit of the device angle on X axis,
+  // meaning that a device rotated at this angle would tilt the element as if
+  // the mouse was on the right border of the element;
+  gyroscopeMaxAngleX?: number
+
+  // This is the bottom limit of the device angle on Y axis,
+  // meaning that a device rotated at this angle would tilt the element as if
+  // the mouse was on the top border of the element;
+  gyroscopeMinAngleY?: number
+
+  // This is the top limit of the device angle on Y axis,
+  // meaning that a device rotated at this angle would tilt the element as if
+  // the mouse was on the bottom border of the element;
+  gyroscopeMaxAngleY?: number
+
+}
+
+export interface TiltValues {
+  /**
+   * The current tilt on the X axis
+   */
+  tiltX: number;
+  /**
+   * The current tilt on the Y axis
+   */
+  tiltY: number;
+  /**
+   * The current percentage on the X axis
+   */
+  percentageX: number;
+  /**
+   * The current percentage on the Y axis
+   */
+  percentageY: number;
+}
+
+export interface HTMLVanillaTiltElement extends HTMLElement {
+  vanillaTilt: VanillaTilt;
+}
+
+/**
+ * A smooth 3D tilt javascript library forked from Tilt.js (jQuery version).
+ */
+export default class VanillaTilt {
+  /**
+   * Creates a new instance of a VanillaTilt element.
+   * @param element The element, which should be a VanillaTilt element
+   * @param settings Settings which configures the element
+   */
+  constructor(element: HTMLElement, settings?: TiltOptions);
+  /**
+   * Initializes one or multiple elements
+   * @param elements The element, which should tilt
+   * @param settings Settings, which configures the elements
+   */
+  static init(elements: HTMLElement | HTMLElement[], settings?: TiltOptions): void;
+  /**
+   * Resets the styling
+   */
+  reset(): void;
+  /**
+   * Get values of instance
+   */
+  getValues(): TiltValues;
+  /**
+   * Destroys the instance and removes the listeners.
+   */
+  destroy(): void;
+  /**
+   * Start listening to events
+   */
+  addEventListeners(): void;
+  /**
+   * Stop listening to events
+   */
+  removeEventListener(): void;
+}