jqtree 1.5.2 → 1.6.2

package/lib/types.js

@@ -1,2 +1 @@
-"use strict";
-exports.__esModule = true;
+"use strict";

package/lib/typings.d.js

@@ -0,0 +1,2 @@
+/// <reference path="./tree.jquery.d.ts" />
+"use strict";

package/lib/util.js

@@ -1,10 +1,24 @@
 "use strict";
-exports.__esModule = true;
-exports.getBoolString = exports.isFunction = exports.isInt = void 0;
-exports.isInt = function (n) {
-    return typeof n === "number" && n % 1 === 0;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isInt = exports.isFunction = exports.getBoolString = void 0;
+
+var isInt = function isInt(n) {
+  return typeof n === "number" && n % 1 === 0;
 };
-exports.isFunction = function (v) { return typeof v === "function"; };
-exports.getBoolString = function (value) {
-    return value ? "true" : "false";
+
+exports.isInt = isInt;
+
+var isFunction = function isFunction(v) {
+  return typeof v === "function";
 };
+
+exports.isFunction = isFunction;
+
+var getBoolString = function getBoolString(value) {
+  return value ? "true" : "false";
+};
+
+exports.getBoolString = getBoolString;

package/lib/version.js

@@ -1,4 +1,9 @@
 "use strict";
-exports.__esModule = true;
-var version = "1.5.2";
-exports["default"] = version;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var version = "1.6.2";
+var _default = version;
+exports["default"] = _default;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "jqtree",
-    "version": "1.5.2",
+    "version": "1.6.2",
     "description": "Tree widget for jQuery",
     "keywords": [
         "jquery-plugin",
@@ -14,7 +14,8 @@
         "url": "https://github.com/mbraak/jqtree"
     },
     "scripts": {
-        "test": "start-server-and-test devserver-with-coverage http://localhost:8080 'jest --runInBand --coverage --no-cache --verbose'",
+        "ci": "pnpm run lint && yarn run tsc && pnpm run test",
+        "test": "start-server-and-test 'yarn devserver-with-coverage' http://localhost:8080 'jest --runInBand --coverage --no-cache --verbose'",
         "test-with-server": "jest --runInBand --coverage",
         "test-watch": "jest --watch",
         "lint": "eslint src/ --ext .ts,.tsx",
@@ -31,45 +32,51 @@
         "print-coverage": "nyc report"
     },
     "dependencies": {
-        "jquery": ">=1.9"
+        "jquery": "^3.6.0"
     },
     "devDependencies": {
-        "@rollup/plugin-typescript": "^6.0.0",
-        "@testing-library/dom": "^7.21.7",
-        "@types/jest": "^26.0.8",
-        "@types/jquery": "^3.5.0",
-        "@types/pngjs": "^3.4.2",
-        "@types/wait-on": "^4.0.0",
-        "@typescript-eslint/eslint-plugin": "^4.0.1",
-        "@typescript-eslint/parser": "^4.0.1",
-        "autoprefixer": "^10.0.0",
-        "coveralls": "^3.1.0",
-        "eslint": "^7.3.1",
-        "eslint-plugin-import": "^2.22.0",
-        "eslint-plugin-jest": "^24.0.0",
-        "expect-playwright": "^0.2.5",
-        "givens": "^1.3.4",
-        "jest": "^26.2.2",
-        "jest-extended": "^0.11.5",
-        "jest-playwright-preset": "^1.3.1",
-        "jsonfile": "^6.0.1",
+        "@babel/cli": "^7.16.0",
+        "@babel/core": "^7.16.5",
+        "@babel/preset-env": "^7.16.5",
+        "@babel/preset-typescript": "^7.16.5",
+        "@rollup/plugin-babel": "^5.3.0",
+        "@rollup/plugin-node-resolve": "^13.1.1",
+        "@testing-library/dom": "^8.11.1",
+        "@types/jest": "^27.0.3",
+        "@types/jquery": "^3.5.10",
+        "@types/pngjs": "^6.0.1",
+        "@typescript-eslint/eslint-plugin": "^5.7.0",
+        "@typescript-eslint/parser": "^5.7.0",
+        "autoprefixer": "^10.4.0",
+        "babel-jest": "^27.4.5",
+        "babel-plugin-istanbul": "^6.1.1",
+        "coveralls": "^3.1.1",
+        "eslint": "^8.4.1",
+        "eslint-plugin-import": "^2.25.3",
+        "eslint-plugin-jest": "^25.3.0",
+        "eslint-plugin-playwright": "^0.6.0",
+        "eslint-plugin-testing-library": "^5.0.1",
+        "expect-playwright": "^0.8.0",
+        "givens": "^1.3.9",
+        "jest": "^27.4.5",
+        "jest-extended": "^1.2.0",
+        "jest-playwright-preset": "^1.7.0",
+        "jsonfile": "^6.1.0",
         "lodash.template": "^4.5.0",
-        "msw": "^0.21.2",
+        "msw": "^0.36.3",
         "pixelmatch": "^5.2.1",
-        "playwright": "^1.4.1",
+        "playwright": "^1.17.1",
         "pngjs": "^6.0.0",
-        "postcss": "^8.0.7",
-        "postcss-cli": "^8.0.0",
-        "postcss-load-config": "^3.0.0",
-        "postcss-nested": "^5.0.0",
-        "prettier": "^2.0.5",
-        "rollup": "^2.7.6",
-        "rollup-plugin-istanbul": "^2.0.1",
-        "rollup-plugin-serve": "^1.0.4",
+        "postcss": "^8.4.5",
+        "postcss-cli": "^9.1.0",
+        "postcss-load-config": "^3.1.0",
+        "postcss-nested": "^5.0.6",
+        "prettier": "^2.5.1",
+        "rollup": "^2.61.1",
+        "rollup-plugin-serve": "^1.1.0",
         "rollup-plugin-terser": "^7.0.2",
-        "start-server-and-test": "^1.11.3",
-        "ts-jest": "^26.1.4",
-        "tslib": "^2.0.1",
-        "typescript": "^4.0.2"
+        "start-server-and-test": "^1.14.0",
+        "tslib": "^2.3.1",
+        "typescript": "^4.5.4"
     }
 }

package/production

@@ -1,5 +1,5 @@
-rollup -c rollup.config.js
-DEBUG_BUILD=true rollup -c rollup.config.js
-tsc --outDir lib --noEmit false --project tsconfig.json &&
-postcss -o jqtree.css jqtree.postcss
+rollup -c rollup.config.js &&
+DEBUG_BUILD=true rollup -c rollup.config.js &&
+babel src --out-dir lib --extensions .ts &&
+postcss -o jqtree.css jqtree.postcss &&
 postcss -o static/example.css static/example.postcss

package/rollup.config.js

@@ -2,10 +2,10 @@ import fs from "fs";
 import path from "path";
 import jsonfile from "jsonfile";
 import template from "lodash.template";
-import typescript from "@rollup/plugin-typescript";
-import { terser } from "rollup-plugin-terser";
+import { babel } from "@rollup/plugin-babel";
+import resolve from "@rollup/plugin-node-resolve";
 import serve from "rollup-plugin-serve";
-import coverage from "rollup-plugin-istanbul";
+import { terser } from "rollup-plugin-terser";
 
 const getBanner = () => {
     const headerTemplate = fs.readFileSync("./src/header.txt", "utf8");
@@ -24,7 +24,19 @@ const debugBuild = Boolean(process.env.DEBUG_BUILD);
 const devServer = Boolean(process.env.SERVE);
 const includeCoverage = Boolean(process.env.COVERAGE);
 
-const plugins = [typescript()];
+const resolvePlugin = resolve({ extensions: [".ts"] });
+
+const babelConfigFile = includeCoverage
+    ? "babel.coverage.config.json"
+    : "babel.config.json";
+
+const babelPlugin = babel({
+    babelHelpers: "bundled",
+    configFile: path.resolve(__dirname, babelConfigFile),
+    extensions: [".ts"],
+});
+
+const plugins = [resolvePlugin, babelPlugin];
 
 if (!debugBuild) {
     const terserPlugin = terser({
@@ -35,13 +47,6 @@ if (!debugBuild) {
     plugins.push(terserPlugin);
 }
 
-if (includeCoverage) {
-    const coveragePlugin = coverage({
-        esModules: true,
-    });
-    plugins.push(coveragePlugin);
-}
-
 if (devServer) {
     const servePlugin = serve({
         contentBase: [

package/src/dataLoader.ts

@@ -1,4 +1,4 @@
-import { DefaultRecord, Node, NodeData } from "./node";
+import { Node } from "./node";
 import { JqTreeWidget } from "./tree.jquery";
 
 export type HandleFinishedLoading = () => void;
@@ -28,7 +28,7 @@ export default class DataLoader {
             this.notifyLoading(false, parentNode, $el);
         };
 
-        const handleSuccess = (data: any): void => {
+        const handleSuccess = (data: string | NodeData[]): void => {
             stopLoading();
             this.treeWidget.loadData(this.parseData(data), parentNode);
 
@@ -108,12 +108,12 @@ export default class DataLoader {
         void jQuery.ajax(ajaxSettings);
     }
 
-    private parseData(data: NodeData): NodeData[] {
+    private parseData(data: string | NodeData[]): NodeData[] {
         const { dataFilter } = this.treeWidget.options;
 
-        const getParsedData = (): unknown => {
+        const getParsedData = () => {
             if (typeof data === "string") {
-                return JSON.parse(data) as unknown;
+                return JSON.parse(data) as NodeData[];
             } else {
                 return data;
             }
@@ -124,7 +124,7 @@ export default class DataLoader {
         if (dataFilter) {
             return dataFilter(parsedData);
         } else {
-            return parsedData as DefaultRecord[];
+            return parsedData;
         }
     }
 }

package/src/dragAndDropHandler.ts

@@ -1,12 +1,8 @@
-import * as jQueryProxy from "jquery";
 import { getPositionName, Node, Position } from "./node";
 import { DropHint, HitArea, PositionInfo } from "./types";
 import { NodeElement } from "./nodeElement";
 import { JqTreeWidget } from "./tree.jquery";
 
-// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access
-const jQuery: JQueryStatic = (<any>jQueryProxy).default || jQueryProxy;
-
 interface Dimensions {
     left: number;
     top: number;

package/src/elementsRenderer.ts

@@ -248,6 +248,10 @@ export default class ElementsRenderer {
             classes += " jqtree-title-folder";
         }
 
+        classes += ` jqtree-title-button-${
+            this.treeWidget.options.buttonLeft ? "left" : "right"
+        }`;
+
         titleSpan.className = classes;
 
         titleSpan.setAttribute("role", "treeitem");

package/src/jqtreeOptions.ts

@@ -1,4 +1,4 @@
-import { Node, NodeData } from "./node";
+import { Node } from "./node";
 
 type CanMoveNodeTo = (
     node: Node,
@@ -17,35 +17,36 @@ type HandleLoadingMethod = (
 ) => void;
 
 export interface JQTreeOptions {
-    animationSpeed?: string | number;
-    autoEscape?: boolean;
-    autoOpen?: boolean | number;
-    buttonLeft?: boolean;
-    closedIcon?: string | Element;
-    data?: NodeData[];
-    dataFilter?: DataFilter;
-    dataUrl?: DataUrl;
-    dragAndDrop?: boolean;
-    nodeClass?: typeof Node;
-    keyboardSupport?: boolean;
-    onCanMove?: (node: Node) => boolean;
-    onCanMoveTo?: CanMoveNodeTo;
-    onCanSelectNode?: (node: Node) => boolean;
-    onCreateLi?: CreateLi;
-    onDragMove?: DragMethod;
-    onDragStop?: DragMethod;
-    onIsMoveHandle?: (el: JQuery) => boolean;
-    onLoadFailed?: (response: JQuery.jqXHR) => void;
-    onLoading?: HandleLoadingMethod;
-    onGetStateFromStorage?: () => string;
-    onSetStateFromStorage?: (data: string) => void;
-    openedIcon?: string | Element;
-    openFolderDelay?: number;
-    rtl?: boolean;
-    selectable?: boolean;
-    saveState?: boolean | string;
-    slide?: boolean;
-    showEmptyFolder?: boolean;
-    tabIndex?: number;
-    useContextMenu?: boolean;
+    animationSpeed: string | number;
+    autoEscape: boolean;
+    autoOpen: boolean | number;
+    buttonLeft: boolean;
+    closedIcon: string | Element | undefined;
+    data: NodeData[] | undefined;
+    dataFilter: DataFilter | undefined;
+    dataUrl: DataUrl | undefined;
+    dragAndDrop: boolean;
+    keyboardSupport: boolean;
+    nodeClass: typeof Node;
+    onCanMove: ((node: Node) => boolean) | undefined;
+    onCanMoveTo: CanMoveNodeTo | undefined;
+    onCanSelectNode: ((node: Node) => boolean) | undefined;
+    onCreateLi: CreateLi | undefined;
+    onDragMove: DragMethod | undefined;
+    onDragStop: DragMethod | undefined;
+    onGetStateFromStorage: (() => string) | undefined;
+    onIsMoveHandle: ((el: JQuery) => boolean) | undefined;
+    onLoadFailed: ((response: JQuery.jqXHR) => void) | undefined;
+    onLoading: HandleLoadingMethod | undefined;
+    onSetStateFromStorage: ((data: string) => void) | undefined;
+    openedIcon: string | Element;
+    openFolderDelay: number;
+    rtl: boolean | undefined;
+    selectable: boolean;
+    saveState: boolean | string;
+    showEmptyFolder: boolean;
+    slide: boolean;
+    startDndDelay: number;
+    tabIndex: number;
+    useContextMenu: boolean;
 }

package/src/mouse.widget.ts

@@ -22,28 +22,24 @@ const getPositionInfoFromTouch = (
 });
 
 abstract class MouseWidget<WidgetOptions> extends SimpleWidget<WidgetOptions> {
-    public $el: JQuery<HTMLElement>;
     protected isMouseStarted: boolean;
-    protected mouseDelay: number;
     protected mouseDownInfo: PositionInfo | null;
     private mouseDelayTimer: number | null;
     private isMouseDelayMet: boolean;
 
-    public setMouseDelay(mouseDelay: number): void {
-        this.mouseDelay = mouseDelay;
-    }
-
     public init(): void {
         const element = this.$el.get(0);
-        element.addEventListener("mousedown", this.mouseDown, {
-            passive: false,
-        });
-        element.addEventListener("touchstart", this.touchStart, {
-            passive: false,
-        });
+
+        if (element) {
+            element.addEventListener("mousedown", this.mouseDown, {
+                passive: false,
+            });
+            element.addEventListener("touchstart", this.touchStart, {
+                passive: false,
+            });
+        }
 
         this.isMouseStarted = false;
-        this.mouseDelay = 0;
         this.mouseDelayTimer = null;
         this.isMouseDelayMet = false;
         this.mouseDownInfo = null;
@@ -51,13 +47,20 @@ abstract class MouseWidget<WidgetOptions> extends SimpleWidget<WidgetOptions> {
 
     public deinit(): void {
         const el = this.$el.get(0);
-        el.removeEventListener("mousedown", this.mouseDown);
-        el.removeEventListener("touchstart", this.touchStart);
 
-        document.removeEventListener("mousemove", this.mouseMove);
-        document.removeEventListener("touchmove", this.touchMove);
-        document.removeEventListener("mouseup", this.mouseUp);
-        document.removeEventListener("touchend", this.touchEnd);
+        if (el) {
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access
+            (el as any).removeEventListener("mousedown", this.mouseDown, {
+                passive: false,
+            });
+
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access
+            (el as any).removeEventListener("touchstart", this.touchStart, {
+                passive: false,
+            });
+        }
+
+        this.removeMouseMoveEventListeners();
     }
 
     protected abstract mouseCapture(positionInfo: PositionInfo): boolean | null;
@@ -68,6 +71,8 @@ abstract class MouseWidget<WidgetOptions> extends SimpleWidget<WidgetOptions> {
 
     protected abstract mouseStop(positionInfo: PositionInfo): void;
 
+    protected abstract getMouseDelay(): number;
+
     private mouseDown = (e: MouseEvent): void => {
         // Left mouse button?
         if (e.button !== 0) {
@@ -110,19 +115,25 @@ abstract class MouseWidget<WidgetOptions> extends SimpleWidget<WidgetOptions> {
             passive: false,
         });
 
-        if (this.mouseDelay) {
-            this.startMouseDelayTimer();
+        const mouseDelay = this.getMouseDelay();
+
+        if (mouseDelay) {
+            this.startMouseDelayTimer(mouseDelay);
+        } else {
+            this.isMouseDelayMet = true;
         }
     }
 
-    private startMouseDelayTimer(): void {
+    private startMouseDelayTimer(mouseDelay: number): void {
         if (this.mouseDelayTimer) {
             clearTimeout(this.mouseDelayTimer);
         }
 
         this.mouseDelayTimer = window.setTimeout(() => {
-            this.isMouseDelayMet = true;
-        }, this.mouseDelay);
+            if (this.mouseDownInfo) {
+                this.isMouseDelayMet = true;
+            }
+        }, mouseDelay);
 
         this.isMouseDelayMet = false;
     }
@@ -144,7 +155,7 @@ abstract class MouseWidget<WidgetOptions> extends SimpleWidget<WidgetOptions> {
             return;
         }
 
-        if (this.mouseDelay && !this.isMouseDelayMet) {
+        if (!this.isMouseDelayMet) {
             return;
         }
 
@@ -168,10 +179,9 @@ abstract class MouseWidget<WidgetOptions> extends SimpleWidget<WidgetOptions> {
     };
 
     private handleMouseUp(positionInfo: PositionInfo): void {
-        document.removeEventListener("mousemove", this.mouseMove);
-        document.removeEventListener("touchmove", this.touchMove);
-        document.removeEventListener("mouseup", this.mouseUp);
-        document.removeEventListener("touchend", this.touchEnd);
+        this.removeMouseMoveEventListeners();
+        this.isMouseDelayMet = false;
+        this.mouseDownInfo = null;
 
         if (this.isMouseStarted) {
             this.isMouseStarted = false;
@@ -179,6 +189,25 @@ abstract class MouseWidget<WidgetOptions> extends SimpleWidget<WidgetOptions> {
         }
     }
 
+    private removeMouseMoveEventListeners() {
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access
+        (document as any).removeEventListener("mousemove", this.mouseMove, {
+            passive: false,
+        });
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access
+        (document as any).removeEventListener("touchmove", this.touchMove, {
+            passive: false,
+        });
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access
+        (document as any).removeEventListener("mouseup", this.mouseUp, {
+            passive: false,
+        });
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access
+        (document as any).removeEventListener("touchend", this.touchEnd, {
+            passive: false,
+        });
+    }
+
     private touchStart = (e: TouchEvent): void => {
         if (!e) {
             return;