@openreplay/tracker 3.6.3 → 3.6.5

package/lib/modules/mouse.js

@@ -1,7 +1,7 @@
-import { hasTag, isSVGElement } from "../app/guards.js";
-import { normSpaces, hasOpenreplayAttribute, getLabelAttribute, } from "../utils.js";
-import { MouseMove, MouseClick } from "../common/messages.js";
-import { getInputLabel } from "./input.js";
+import { hasTag, isSVGElement } from '../app/guards.js';
+import { normSpaces, hasOpenreplayAttribute, getLabelAttribute } from '../utils.js';
+import { MouseMove, MouseClick } from '../common/messages.js';
+import { getInputLabel } from './input.js';
 function _getSelector(target) {
     let el = target;
     let selector = null;
@@ -10,9 +10,10 @@ function _getSelector(target) {
             return `#${el.id}` + (selector ? ` > ${selector}` : '');
         }
         selector =
-            el.className.split(' ')
-                .map(cn => cn.trim())
-                .filter(cn => cn !== '')
+            el.className
+                .split(' ')
+                .map((cn) => cn.trim())
+                .filter((cn) => cn !== '')
                 .reduce((sel, cn) => `${sel}.${cn}`, el.tagName.toLowerCase()) +
                 (selector ? ` > ${selector}` : '');
         if (el === document.body) {
@@ -24,12 +25,12 @@ function _getSelector(target) {
 }
 function isClickable(element) {
     const tag = element.tagName.toUpperCase();
-    return tag === 'BUTTON' ||
+    return (tag === 'BUTTON' ||
         tag === 'A' ||
         tag === 'LI' ||
         tag === 'SELECT' ||
         element.onclick != null ||
-        element.getAttribute('role') === 'button';
+        element.getAttribute('role') === 'button');
     //|| element.className.includes("btn")
     // MBTODO: intersect addEventListener
 }
@@ -64,8 +65,7 @@ function _getTarget(target) {
         if (tag === 'INPUT') {
             return element;
         }
-        if (isClickable(element) ||
-            getLabelAttribute(element) !== null) {
+        if (isClickable(element) || getLabelAttribute(element) !== null) {
             return element;
         }
         element = element.parentElement;
@@ -78,7 +78,7 @@ export default function (app) {
         if (dl !== null) {
             return dl;
         }
-        if (hasTag(target, "INPUT")) {
+        if (hasTag(target, 'INPUT')) {
             return getInputLabel(target);
         }
         if (isClickable(target)) {
@@ -110,7 +110,7 @@ export default function (app) {
     };
     const selectorMap = {};
     function getSelector(id, target) {
-        return selectorMap[id] = selectorMap[id] || _getSelector(target);
+        return (selectorMap[id] = selectorMap[id] || _getSelector(target));
     }
     app.attachEventListener(document.documentElement, 'mouseover', (e) => {
         const target = getTarget(e.target);
@@ -132,9 +132,7 @@ export default function (app) {
         const id = app.nodes.getID(target);
         if (id !== undefined) {
             sendMouseMove();
-            app.send(new MouseClick(id, mouseTarget === target
-                ? Math.round(performance.now() - mouseTargetTime)
-                : 0, getTargetLabel(target), getSelector(id, target)), true);
+            app.send(new MouseClick(id, mouseTarget === target ? Math.round(performance.now() - mouseTargetTime) : 0, getTargetLabel(target), getSelector(id, target)), true);
         }
         mouseTarget = null;
     });

package/lib/modules/performance.d.ts

@@ -1,4 +1,4 @@
-import type App from "../app/index.js";
+import type App from '../app/index.js';
 export declare const deviceMemory: number;
 export declare const jsHeapSizeLimit: number;
 export interface Options {

package/lib/modules/performance.js

@@ -1,5 +1,5 @@
-import { IN_BROWSER } from "../utils.js";
-import { PerformanceTrack } from "../common/messages.js";
+import { IN_BROWSER } from '../utils.js';
+import { PerformanceTrack } from '../common/messages.js';
 const perf = IN_BROWSER && 'performance' in window && 'memory' in performance // works in Chrome only
     ? performance
     : { memory: {} };

package/lib/modules/scroll.d.ts

@@ -1,2 +1,2 @@
-import type App from "../app/index.js";
+import type App from '../app/index.js';
 export default function (app: App): void;

package/lib/modules/scroll.js

@@ -1,5 +1,5 @@
-import { SetViewportScroll, SetNodeScroll } from "../common/messages.js";
-import { isElementNode } from "../app/guards.js";
+import { SetViewportScroll, SetNodeScroll } from '../common/messages.js';
+import { isElementNode } from '../app/guards.js';
 export default function (app) {
     let documentScroll = false;
     const nodeScroll = new Map();

package/lib/modules/timing.d.ts

@@ -1,4 +1,4 @@
-import type App from "../app/index.js";
+import type App from '../app/index.js';
 export interface Options {
     captureResourceTimings: boolean;
     capturePageLoadTimings: boolean;

package/lib/modules/timing.js

@@ -1,6 +1,6 @@
-import { hasTag } from "../app/guards.js";
-import { isURL } from "../utils.js";
-import { ResourceTiming, PageLoadTiming, PageRenderTiming } from "../common/messages.js";
+import { hasTag } from '../app/guards.js';
+import { isURL } from '../utils.js';
+import { ResourceTiming, PageLoadTiming, PageRenderTiming } from '../common/messages.js';
 function getPaintBlocks(resources) {
     const paintBlocks = [];
     const elements = document.getElementsByTagName('*');
@@ -8,7 +8,7 @@ function getPaintBlocks(resources) {
     for (let i = 0; i < elements.length; i++) {
         const element = elements[i];
         let src = '';
-        if (hasTag(element, "IMG")) {
+        if (hasTag(element, 'IMG')) {
             src = element.currentSrc || element.src;
         }
         if (!src) {
@@ -34,9 +34,7 @@ function getPaintBlocks(resources) {
         const bottom = Math.min(rect.bottom, window.innerHeight ||
             (document.documentElement && document.documentElement.clientHeight) ||
             0);
-        const right = Math.min(rect.right, window.innerWidth ||
-            (document.documentElement && document.documentElement.clientWidth) ||
-            0);
+        const right = Math.min(rect.right, window.innerWidth || (document.documentElement && document.documentElement.clientWidth) || 0);
         if (bottom <= top || right <= left)
             continue;
         const area = (bottom - top) * (right - left);
@@ -46,8 +44,7 @@ function getPaintBlocks(resources) {
 }
 function calculateSpeedIndex(firstContentfulPaint, paintBlocks) {
     let a = (Math.max((document.documentElement && document.documentElement.clientWidth) || 0, window.innerWidth || 0) *
-        Math.max((document.documentElement && document.documentElement.clientHeight) ||
-            0, window.innerHeight || 0)) /
+        Math.max((document.documentElement && document.documentElement.clientHeight) || 0, window.innerHeight || 0)) /
         10;
     let s = a * firstContentfulPaint;
     for (let i = 0; i < paintBlocks.length; i++) {
@@ -76,16 +73,13 @@ export default function (app, opts) {
         if (resources !== null) {
             resources[entry.name] = entry.startTime + entry.duration;
         }
-        app.send(new ResourceTiming(entry.startTime + performance.timing.navigationStart, entry.duration, entry.responseStart && entry.startTime
-            ? entry.responseStart - entry.startTime
-            : 0, entry.transferSize > entry.encodedBodySize
-            ? entry.transferSize - entry.encodedBodySize
-            : 0, entry.encodedBodySize || 0, entry.decodedBodySize || 0, entry.name, entry.initiatorType));
+        app.send(new ResourceTiming(entry.startTime + performance.timing.navigationStart, entry.duration, entry.responseStart && entry.startTime ? entry.responseStart - entry.startTime : 0, entry.transferSize > entry.encodedBodySize ? entry.transferSize - entry.encodedBodySize : 0, entry.encodedBodySize || 0, entry.decodedBodySize || 0, entry.name, entry.initiatorType));
     }
     const observer = new PerformanceObserver((list) => list.getEntries().forEach(resourceTiming));
     let prevSessionID;
     app.attachStartCallback(function ({ sessionID }) {
-        if (sessionID !== prevSessionID) { // Send past page resources on a newly started session
+        if (sessionID !== prevSessionID) {
+            // Send past page resources on a newly started session
             performance.getEntriesByType('resource').forEach(resourceTiming);
             prevSessionID = sessionID;
         }
@@ -102,9 +96,7 @@ export default function (app, opts) {
                 return;
             }
             if (firstPaint === 0 || firstContentfulPaint === 0) {
-                performance
-                    .getEntriesByType('paint')
-                    .forEach((entry) => {
+                performance.getEntriesByType('paint').forEach((entry) => {
                     const { name, startTime } = entry;
                     switch (name) {
                         case 'first-paint':
@@ -142,23 +134,19 @@ export default function (app, opts) {
                 if (time - interactiveWindowTickTime > 50) {
                     interactiveWindowStartTime = time;
                 }
-                interactiveWindowTickTime =
-                    time - interactiveWindowStartTime > 5000 ? null : time;
+                interactiveWindowTickTime = time - interactiveWindowStartTime > 5000 ? null : time;
             }
-            if ((paintBlocks !== null && interactiveWindowTickTime === null) ||
-                time > 30000) {
+            if ((paintBlocks !== null && interactiveWindowTickTime === null) || time > 30000) {
                 pageRenderTimingSent = true;
                 resources = null;
                 const speedIndex = paintBlocks === null
                     ? 0
                     : calculateSpeedIndex(firstContentfulPaint || firstPaint, paintBlocks);
                 const timeToInteractive = interactiveWindowTickTime === null
-                    ? Math.max(interactiveWindowStartTime, firstContentfulPaint, performance.timing.domContentLoadedEventEnd -
-                        performance.timing.navigationStart || 0)
+                    ? Math.max(interactiveWindowStartTime, firstContentfulPaint, performance.timing.domContentLoadedEventEnd - performance.timing.navigationStart ||
+                        0)
                     : 0;
-                app.send(new PageRenderTiming(speedIndex, firstContentfulPaint > visuallyComplete
-                    ? firstContentfulPaint
-                    : visuallyComplete, timeToInteractive));
+                app.send(new PageRenderTiming(speedIndex, firstContentfulPaint > visuallyComplete ? firstContentfulPaint : visuallyComplete, timeToInteractive));
             }
         });
     }

package/lib/modules/viewport.d.ts

@@ -1,2 +1,2 @@
-import type App from "../app/index.js";
+import type App from '../app/index.js';
 export default function (app: App): void;

package/lib/modules/viewport.js

@@ -1,4 +1,4 @@
-import { SetPageLocation, SetViewportSize, SetPageVisibility, } from "../common/messages.js";
+import { SetPageLocation, SetViewportSize, SetPageVisibility } from '../common/messages.js';
 export default function (app) {
     let url, width, height;
     let navigationStart = performance.timing.navigationStart;

package/lib/utils.js

@@ -11,25 +11,25 @@ export function normSpaces(str) {
 export function isURL(s) {
     return s.startsWith('https://') || s.startsWith('http://');
 }
-export const IN_BROWSER = !(typeof window === "undefined");
+export const IN_BROWSER = !(typeof window === 'undefined');
 // TODO: JOIN IT WITH LOGGER somehow (use logging decorators?); Don't forget about index.js loggin when there is no logger instance.
 export const DOCS_HOST = 'https://docs.openreplay.com';
 const warnedFeatures = {};
-export function deprecationWarn(nameOfFeature, useInstead, docsPath = "/") {
+export function deprecationWarn(nameOfFeature, useInstead, docsPath = '/') {
     if (warnedFeatures[nameOfFeature]) {
         return;
     }
-    console.warn(`OpenReplay: ${nameOfFeature} is deprecated. ${useInstead ? `Please, use ${useInstead} instead.` : ""} Visit ${DOCS_HOST}${docsPath} for more information.`);
+    console.warn(`OpenReplay: ${nameOfFeature} is deprecated. ${useInstead ? `Please, use ${useInstead} instead.` : ''} Visit ${DOCS_HOST}${docsPath} for more information.`);
     warnedFeatures[nameOfFeature] = true;
 }
 export function getLabelAttribute(e) {
-    let value = e.getAttribute("data-openreplay-label");
+    let value = e.getAttribute('data-openreplay-label');
     if (value !== null) {
         return value;
     }
-    value = e.getAttribute("data-asayer-label");
+    value = e.getAttribute('data-asayer-label');
     if (value !== null) {
-        deprecationWarn(`"data-asayer-label" attribute`, `"data-openreplay-label" attribute`, "/");
+        deprecationWarn('"data-asayer-label" attribute', '"data-openreplay-label" attribute', '/');
     }
     return value;
 }
@@ -40,7 +40,7 @@ export function hasOpenreplayAttribute(e, name) {
     }
     const oldName = `data-asayer-${name}`;
     if (e.hasAttribute(oldName)) {
-        deprecationWarn(`"${oldName}" attribute`, `"${newName}" attribute`, "/installation/sanitize-data");
+        deprecationWarn(`"${oldName}" attribute`, `"${newName}" attribute`, '/installation/sanitize-data');
         return true;
     }
     return false;

package/lib/vendors/finder/finder.js

@@ -8,10 +8,10 @@ let config;
 let rootDocument;
 export function finder(input, options) {
     if (input.nodeType !== Node.ELEMENT_NODE) {
-        throw new Error(`Can't generate CSS selector for non-element node type.`);
+        throw new Error("Can't generate CSS selector for non-element node type.");
     }
-    if ("html" === input.tagName.toLowerCase()) {
-        return "html";
+    if ('html' === input.tagName.toLowerCase()) {
+        return 'html';
     }
     const defaults = {
         root: document.body,
@@ -35,7 +35,7 @@ export function finder(input, options) {
         return selector(path);
     }
     else {
-        throw new Error(`Selector was not found.`);
+        throw new Error('Selector was not found.');
     }
 }
 function findRootDocument(rootNode, defaults) {
@@ -49,30 +49,33 @@ function findRootDocument(rootNode, defaults) {
 }
 function bottomUpSearch(input, limit, fallback) {
     let path = null;
-    let stack = [];
+    const stack = [];
     let current = input;
     let i = 0;
     while (current && current !== config.root.parentElement) {
-        let level = maybe(id(current)) || maybe(...attr(current)) || maybe(...classNames(current)) || maybe(tagName(current)) || [any()];
+        let level = maybe(id(current)) ||
+            maybe(...attr(current)) ||
+            maybe(...classNames(current)) ||
+            maybe(tagName(current)) || [any()];
         const nth = index(current);
         if (limit === Limit.All) {
             if (nth) {
-                level = level.concat(level.filter(dispensableNth).map(node => nthChild(node, nth)));
+                level = level.concat(level.filter(dispensableNth).map((node) => nthChild(node, nth)));
             }
         }
         else if (limit === Limit.Two) {
             level = level.slice(0, 1);
             if (nth) {
-                level = level.concat(level.filter(dispensableNth).map(node => nthChild(node, nth)));
+                level = level.concat(level.filter(dispensableNth).map((node) => nthChild(node, nth)));
             }
         }
         else if (limit === Limit.One) {
-            const [node] = level = level.slice(0, 1);
+            const [node] = (level = level.slice(0, 1));
             if (nth && dispensableNth(node)) {
                 level = [nthChild(node, nth)];
             }
         }
-        for (let node of level) {
+        for (const node of level) {
             node.level = i;
         }
         stack.push(level);
@@ -95,7 +98,7 @@ function findUniquePath(stack, fallback) {
     if (paths.length > config.threshold) {
         return fallback ? fallback() : null;
     }
-    for (let candidate of paths) {
+    for (const candidate of paths) {
         if (unique(candidate)) {
             return candidate;
         }
@@ -118,7 +121,7 @@ function selector(path) {
     return query;
 }
 function penalty(path) {
-    return path.map(node => node.penalty).reduce((acc, i) => acc + i, 0);
+    return path.map((node) => node.penalty).reduce((acc, i) => acc + i, 0);
 }
 function unique(path) {
     switch (rootDocument.querySelectorAll(selector(path)).length) {
@@ -131,10 +134,10 @@ function unique(path) {
     }
 }
 function id(input) {
-    const elementId = input.getAttribute("id");
+    const elementId = input.getAttribute('id');
     if (elementId && config.idName(elementId)) {
         return {
-            name: "#" + cssesc(elementId, { isIdentifier: true }),
+            name: '#' + cssesc(elementId, { isIdentifier: true }),
             penalty: 0,
         };
     }
@@ -143,16 +146,15 @@ function id(input) {
 function attr(input) {
     const attrs = Array.from(input.attributes).filter((attr) => config.attr(attr.name, attr.value));
     return attrs.map((attr) => ({
-        name: "[" + cssesc(attr.name, { isIdentifier: true }) + "=\"" + cssesc(attr.value) + "\"]",
-        penalty: 0.5
+        name: '[' + cssesc(attr.name, { isIdentifier: true }) + '="' + cssesc(attr.value) + '"]',
+        penalty: 0.5,
     }));
 }
 function classNames(input) {
-    const names = Array.from(input.classList)
-        .filter(config.className);
+    const names = Array.from(input.classList).filter(config.className);
     return names.map((name) => ({
-        name: "." + cssesc(name, { isIdentifier: true }),
-        penalty: 1
+        name: '.' + cssesc(name, { isIdentifier: true }),
+        penalty: 1,
     }));
 }
 function tagName(input) {
@@ -160,15 +162,15 @@ function tagName(input) {
     if (config.tagName(name)) {
         return {
             name,
-            penalty: 2
+            penalty: 2,
         };
     }
     return null;
 }
 function any() {
     return {
-        name: "*",
-        penalty: 3
+        name: '*',
+        penalty: 3,
     };
 }
 function index(input) {
@@ -195,11 +197,11 @@ function index(input) {
 function nthChild(node, i) {
     return {
         name: node.name + `:nth-child(${i})`,
-        penalty: node.penalty + 1
+        penalty: node.penalty + 1,
     };
 }
 function dispensableNth(node) {
-    return node.name !== "html" && !node.name.startsWith("#");
+    return node.name !== 'html' && !node.name.startsWith('#');
 }
 function maybe(...level) {
     const list = level.filter(notEmpty);
@@ -214,7 +216,7 @@ function notEmpty(value) {
 function combinations(stack, path = []) {
     const paths = [];
     if (stack.length > 0) {
-        for (let node of stack[0]) {
+        for (const node of stack[0]) {
             paths.push(...combinations(stack.slice(1, stack.length), path.concat(node)));
         }
     }
@@ -228,7 +230,7 @@ function sort(paths) {
 }
 function optimize(path, input, scope = {
     counter: 0,
-    visited: new Map()
+    visited: new Map(),
 }) {
     const paths = [];
     if (path.length > 2 && path.length > config.optimizedMinLength) {
@@ -259,20 +261,20 @@ const regexAnySingleEscape = /[ -,\.\/:-@\[-\^`\{-~]/;
 const regexSingleEscape = /[ -,\.\/:-@\[\]\^`\{-~]/;
 const regexExcessiveSpaces = /(^|\\+)?(\\[A-F0-9]{1,6})\x20(?![a-fA-F0-9\x20])/g;
 const defaultOptions = {
-    "escapeEverything": false,
-    "isIdentifier": false,
-    "quotes": "single",
-    "wrap": false
+    escapeEverything: false,
+    isIdentifier: false,
+    quotes: 'single',
+    wrap: false,
 };
 function cssesc(string, opt = {}) {
     const options = Object.assign(Object.assign({}, defaultOptions), opt);
-    if (options.quotes != "single" && options.quotes != "double") {
-        options.quotes = "single";
+    if (options.quotes != 'single' && options.quotes != 'double') {
+        options.quotes = 'single';
     }
-    const quote = options.quotes == "double" ? "\"" : "'";
+    const quote = options.quotes == 'double' ? '"' : "'";
     const isIdentifier = options.isIdentifier;
     const firstChar = string.charAt(0);
-    let output = "";
+    let output = '';
     let counter = 0;
     const length = string.length;
     while (counter < length) {
@@ -280,13 +282,13 @@ function cssesc(string, opt = {}) {
         let codePoint = character.charCodeAt(0);
         let value = void 0;
         // If it’s not a printable ASCII character…
-        if (codePoint < 0x20 || codePoint > 0x7E) {
-            if (codePoint >= 0xD800 && codePoint <= 0xDBFF && counter < length) {
+        if (codePoint < 0x20 || codePoint > 0x7e) {
+            if (codePoint >= 0xd800 && codePoint <= 0xdbff && counter < length) {
                 // It’s a high surrogate, and there is a next character.
                 const extra = string.charCodeAt(counter++);
-                if ((extra & 0xFC00) == 0xDC00) {
+                if ((extra & 0xfc00) == 0xdc00) {
                     // next character is low surrogate
-                    codePoint = ((codePoint & 0x3FF) << 10) + (extra & 0x3FF) + 0x10000;
+                    codePoint = ((codePoint & 0x3ff) << 10) + (extra & 0x3ff) + 0x10000;
                 }
                 else {
                     // It’s an unmatched surrogate; only append this code unit, in case
@@ -294,22 +296,25 @@ function cssesc(string, opt = {}) {
                     counter--;
                 }
             }
-            value = "\\" + codePoint.toString(16).toUpperCase() + " ";
+            value = '\\' + codePoint.toString(16).toUpperCase() + ' ';
         }
         else {
             if (options.escapeEverything) {
                 if (regexAnySingleEscape.test(character)) {
-                    value = "\\" + character;
+                    value = '\\' + character;
                 }
                 else {
-                    value = "\\" + codePoint.toString(16).toUpperCase() + " ";
+                    value = '\\' + codePoint.toString(16).toUpperCase() + ' ';
                 }
             }
             else if (/[\t\n\f\r\x0B]/.test(character)) {
-                value = "\\" + codePoint.toString(16).toUpperCase() + " ";
+                value = '\\' + codePoint.toString(16).toUpperCase() + ' ';
             }
-            else if (character == "\\" || !isIdentifier && (character == "\"" && quote == character || character == "'" && quote == character) || isIdentifier && regexSingleEscape.test(character)) {
-                value = "\\" + character;
+            else if (character == '\\' ||
+                (!isIdentifier &&
+                    ((character == '"' && quote == character) || (character == "'" && quote == character))) ||
+                (isIdentifier && regexSingleEscape.test(character))) {
+                value = '\\' + character;
             }
             else {
                 value = character;
@@ -319,10 +324,10 @@ function cssesc(string, opt = {}) {
     }
     if (isIdentifier) {
         if (/^-[-\d]/.test(output)) {
-            output = "\\-" + output.slice(1);
+            output = '\\-' + output.slice(1);
         }
         else if (/\d/.test(firstChar)) {
-            output = "\\3" + firstChar + " " + output.slice(1);
+            output = '\\3' + firstChar + ' ' + output.slice(1);
         }
     }
     // Remove spaces after `\HEX` escapes that are not followed by a hex digit,
@@ -334,7 +339,7 @@ function cssesc(string, opt = {}) {
             return $0;
         }
         // Strip the space.
-        return ($1 || "") + $2;
+        return ($1 || '') + $2;
     });
     if (!isIdentifier && options.wrap) {
         return quote + output + quote;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openreplay/tracker",
   "description": "The OpenReplay tracker main package",
-  "version": "3.6.3",
+  "version": "3.6.5",
   "keywords": [
     "logging",
     "replay"
@@ -14,33 +14,51 @@
   "type": "module",
   "main": "./lib/index.js",
   "scripts": {
-    "lint": "eslint src --ext .ts,.js --fix && tsc --noEmit",
+    "lint": "eslint src --ext .ts,.js --fix",
     "clean": "rm -Rf build && rm -Rf lib && rm -Rf cjs",
-    "tsc": "tsc -b src/main && tsc -b src/webworker && tsc --project src/main/tsconfig-cjs.json",
+    "tscRun": "tsc -b src/main && tsc -b src/webworker && tsc --project src/main/tsconfig-cjs.json",
     "rollup": "rollup --config rollup.config.js",
     "compile": "node --experimental-modules --experimental-json-modules scripts/compile.cjs",
-    "build": "npm run clean && npm run tsc && npm run rollup && npm run compile",
-    "prepare": "node scripts/checkver.cjs && npm run build"
+    "build": "npm run clean && npm run tscRun && npm run rollup && npm run compile",
+    "prepare": "cd ../../ && husky install tracker/.husky/",
+    "lint-front": "lint-staged",
+    "pret": "prettier src --write"
   },
   "devDependencies": {
     "@babel/core": "^7.10.2",
     "@rollup/plugin-babel": "^5.0.3",
     "@rollup/plugin-node-resolve": "^10.0.0",
-    "@typescript-eslint/eslint-plugin": "^4.33.0",
-    "@typescript-eslint/parser": "^4.33.0",
+    "@typescript-eslint/eslint-plugin": "^5.30.0",
+    "@typescript-eslint/parser": "^5.30.0",
     "eslint": "^7.8.0",
-    "eslint-plugin-prettier": "^4.1.4",
-    "prettier": "^2.0.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "husky": "^8.0.1",
+    "lint-staged": "^13.0.3",
+    "prettier": "^2.7.1",
     "replace-in-files": "^2.0.3",
     "rollup": "^2.17.0",
     "rollup-plugin-terser": "^6.1.0",
     "semver": "^6.3.0",
-    "typescript": "^4.6.0-dev.20211126"
+    "typescript": "4.6.0-dev.20211126"
   },
   "dependencies": {
     "error-stack-parser": "^2.0.6"
   },
   "engines": {
     "node": ">=14.0"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "sh lint.sh"
+    }
+  },
+  "lint-staged": {
+    "*.{js,mjs,jsx,ts,tsx}": [
+      "eslint --fix --quiet"
+    ],
+    "*.{json,md,html,js,jsx,ts,tsx}": [
+      "prettier --write"
+    ]
   }
 }