Migrate Tree class to Typescript

.gitignore

@@ -1,6 +1,7 @@
 node_modules/
 coverage/
 debug.log
+dist
 yarn-error.log
 .DS_Store
 .eslintcache

.vscode/settings.json

@@ -5,6 +5,6 @@
 		{ "language": "html", "autoFix": true }
 	],
 	"editor.codeActionsOnSave": {
-		"source.fixAll.eslint": true
+		"source.fixAll.eslint": "explicit"
 	}
 }

package.json

@@ -24,10 +24,12 @@
 		"demo/*.json",
 		"cosmoz-*.js",
 		"test/data/",
-		"examples"
+		"examples",
+		"dist/*"
 	],
 	"scripts": {
-		"lint": "eslint --cache --ext .js,.html .",
+		"lint": "tsc && eslint --cache --ext .js,.html .",
+		"build": "tsc -p tsconfig.build.json",
 		"start": "wds",
 		"test": "wtr --coverage",
 		"test:watch": "wtr --watch",
@@ -47,6 +49,12 @@
 	"publishConfig": {
 		"access": "public"
 	},
+	"exports": {
+		"./cosmoz-tree": "./dist/cosmoz-tree.js",
+		"./cosmoz-tree.js": "./dist/cosmoz-tree.js",
+		"./cosmoz-default-tree": "./dist/cosmoz-default-tree.js",
+		"./cosmoz-default-tree.js": "./dist/cosmoz-default-tree.js"
+	},
 	"commitlint": {
 		"extends": [
 			"@commitlint/config-conventional"

cosmoz-tree.js → src/cosmoz-tree.ts

@@ -3,7 +3,27 @@
 
 @demo demo/index.html
 */
+
+export type TreeOptions = {
+	childProperty?: string;
+	searchProperty?: string;
+	pathLocatorSeparator?: string;
+	pathStringSeparator?: string;
+};
+
 export class Tree {
+	_treeData: object;
+
+	_roots: object;
+
+	childProperty: string;
+
+	searchProperty: string;
+
+	pathLocatorSeparator: string;
+
+	pathStringSeparator: string;
+
 	/**
 	 * @param {Object} treeData (The tree object.)
 	 * @param {Object} options (Tree options.)
@@ -12,7 +32,7 @@
 	 * @param {String} options.pathStringSeparator ["/"] (The string the path should get separated with.)
 	 * @param {String} options.pathLocatorSeparator ["."] (The string which separates the path segments of a path locator.)
 	 */
-	constructor(treeData, options = {}) {
+	constructor(treeData: object, options: TreeOptions = {}) {
 		this._treeData = treeData;
 		this._roots = Object.values(treeData);
 
@@ -22,9 +42,9 @@
 		this.searchProperty = options.searchProperty || 'name';
 	}
 
-	static _sortPathNodes(a, b) {
+	static _sortPathNodes(a, b): number {
 		const undefCounter = (item) => item === undefined,
 			defCounter = (item) => item,
 			aUndefCount = a.filter(undefCounter).length,
 			bUndefCount = b.filter(undefCounter).length,
 			aDefCount = a.filter(defCounter).length,
@@ -33,12 +53,15 @@
 		if (aUndefCount < bUndefCount) {
 			return -1;
 		}
+
 		if (aUndefCount > bUndefCount || aDefCount < bDefCount) {
 			return 1;
 		}
+
 		if (aDefCount > bDefCount) {
 			return -1;
 		}
+
 		return 0;
 	}
 
@@ -50,10 +73,10 @@
 	 * @param {Array} nodes [this._roots] (The objects the search should be based on.)
 	 */
 	getNodeByProperty(
-		propertyValue,
-		propertyName = this.searchProperty,
-		nodes = this._roots,
-	) {
+		propertyValue?: string,
+		propertyName: string = this.searchProperty,
+		nodes: object = this._roots,
+	): object | undefined {
 		if (propertyValue === undefined) {
 			return;
 		}
@@ -69,12 +92,18 @@
 	 * @param {Boolean} exact [true] (If the search should be executed exact or flaw. true wouldn't match "Pet")
 	 * @param {String} propertyName [this.searchProperty] (The name of the property the match should be based on. e.g. "name")
 	 */
-	searchNodes(propertyValue, nodes, exact, propertyName = this.searchProperty) {
+	searchNodes(
+		propertyValue: string,
+		nodes,
+		exact: boolean | undefined,
+		propertyName: string = this.searchProperty,
+	): object[] {
 		const options = {
 			propertyName,
 			exact: exact !== undefined ? exact : true,
 			firstHitOnly: false,
 		};
+
 		return this._searchNodes(propertyValue, options, nodes);
 	}
 
@@ -85,12 +114,17 @@
 	 * @param {String} propertyName [this.searchProperty] (The name of the property the match should be based on. e.g. "name")
 	 * @param {Object} nodes [this._treeData] (The nodes the search should be based on.)
 	 */
-	findNode(propertyValue, propertyName = this.searchProperty, nodes) {
+	findNode(
+		propertyValue: string,
+		propertyName: string = this.searchProperty,
+		nodes,
+	) {
 		const options = {
 			propertyName,
 			exact: true,
 			firstHitOnly: true,
 		};
+
 		return this._searchNodes(propertyValue, options, nodes).shift();
 	}
 
@@ -104,11 +138,19 @@
 	 * @param {Boolean} options.firstHitOnly [false] (If the search should only return the first found node.)
 	 * @param {Object} nodes [this._roots] (The nodes the search should be based on.)
 	 */
-	_searchNodes(propertyValue, options, nodes = this._roots) {
+	_searchNodes(
+		propertyValue: string,
+		options: {
+			propertyName: string;
+			exact: boolean;
+			firstHitOnly: boolean;
+		},
+		nodes = this._roots,
+	) {
 		const results = [];
 
 		for (const node of nodes) {
 			const res = this.search(node, propertyValue, options);
 			if (options.firstHitOnly && res.length > 0) {
 				return res;
 			}
@@ -126,9 +168,9 @@
 	 * @param {String} pathLocatorSeparator [this.pathLocatorSeparator] (The string which separates the path. e.g ".")
 	 */
 	getNodeByPathLocator(
-		pathLocator,
+		pathLocator?: string,
 		nodeObj = this._treeData,
-		pathLocatorSeparator = this.pathLocatorSeparator,
+		pathLocatorSeparator: string = this.pathLocatorSeparator,
 	) {
 		if (!pathLocator) {
 			return this._roots;
@@ -154,9 +196,9 @@
 	 * @param {String} pathLocatorSeparator [this.pathLocatorSeparator] (The string which separates the path.)
 	 */
 	getPathNodes(
-		pathLocator,
+		pathLocator?: string,
 		nodeObj = this._treeData,
-		pathLocatorSeparator = this.pathLocatorSeparator,
+		pathLocatorSeparator: string = this.pathLocatorSeparator,
 	) {
 		if (!pathLocator) {
 			return nodeObj;
@@ -175,9 +217,9 @@
 	}
 
 	_getPathNodes(
-		pathLocator,
+		pathLocator: string,
 		nodeObj = this._treeData,
-		pathLocatorSeparator = this.pathLocatorSeparator,
+		pathLocatorSeparator: string = this.pathLocatorSeparator,
 	) {
 		const path = pathLocator.split(pathLocatorSeparator),
 			nodes = this._pathToNodes(path, nodeObj, pathLocatorSeparator);
@@ -216,10 +258,10 @@
 	 * @param {String} pathLocatorSeparator [this.pathLocatorSeparator] (The string which separates the path segments of pathLocator.)
 	 */
 	getPathString(
-		pathLocator,
-		pathProperty = this.searchProperty,
-		pathStringSeparator = this.pathStringSeparator,
-		pathLocatorSeparator = this.pathLocatorSeparator,
+		pathLocator: string,
+		pathProperty: string = this.searchProperty,
+		pathStringSeparator: string = this.pathStringSeparator,
+		pathLocatorSeparator: string = this.pathLocatorSeparator,
 	) {
 		const pathNodes = this.getPathNodes(
 			pathLocator,
@@ -247,11 +289,11 @@
 	 * @param {String} pathLocatorSeparator [this.pathLocatorSeparator] (The string which separates the path. e.g ".")
 	 */
 	getPathStringByProperty(
-		propertyValue,
-		propertyName = this.searchProperty,
-		pathProperty = this.searchProperty,
-		pathStringSeparator = this.pathStringSeparator,
-		pathLocatorSeparator = this.pathLocatorSeparator,
+		propertyValue: string,
+		propertyName: string = this.searchProperty,
+		pathProperty: string = this.searchProperty,
+		pathStringSeparator: string = this.pathStringSeparator,
+		pathLocatorSeparator: string = this.pathLocatorSeparator,
 	) {
 		if (propertyValue === undefined) {
 			return;
@@ -279,7 +321,7 @@
 	 * @param {Object} node The object to return children from
 	 * @returns {Object|Array} The node's children
 	 */
-	getChildren(node) {
+	getChildren(node: object) {
 		if (!node || !node[this.childProperty]) {
 			return [];
 		}
@@ -291,7 +333,7 @@
 	 * @param {Object} node The object to get children from
 	 * @returns {Boolean} True if node has children
 	 */
-	hasChildren(node) {
+	hasChildren(node: object): boolean {
 		if (!node) {
 			return false;
 		}
@@ -312,7 +354,7 @@
 	 * @param {String} propertyName The name of property
 	 * @returns {*} The value of the property
 	 */
-	getProperty(node, propertyName) {
+	getProperty(node: object, propertyName: string) {
 		if (!node || !propertyName) {
 			return;
 		}
@@ -328,7 +370,14 @@
 	 * @param {String} options.propertyName (The name of the property the match should be based on. e.g. "name")
 	 * @param {Boolean} options.exact [false] (If the search should be executed exact or fuzzy. true wouldn't match "Pet")
 	 */
-	nodeConformsSearch(node, propertyValue, options) {
+	nodeConformsSearch(
+		node: object,
+		propertyValue: string,
+		options?: {
+			propertyName: string;
+			exact: boolean;
+		},
+	): boolean | undefined {
 		const property = options ? node[options.propertyName] : undefined;
 
 		if (!property) {
@@ -340,6 +389,7 @@
 		if (options.exact) {
 			return property === propertyValue;
 		}
+
 		return property.toLowerCase().indexOf(propertyValue.toLowerCase()) > -1;
 	}
 
@@ -353,7 +403,15 @@
 	 * @param {Boolean} options.exact [false] (If false, the propertyValue is matched fuzzy)
 	 * @param {Array} results (The array search results get added to.) Default: []
 	 */
-	search(node, propertyValue, options, results = []) {
+	search(
+		node,
+		propertyValue: string,
+		options: {
+			propertyName: string;
+			exact: string;
+		},
+		results = [],
+	) {
 		const nodeConforms = this.nodeConformsSearch(node, propertyValue, options),
 			children = this.getChildren(node);
 

tsconfig.build.json

@@ -0,0 +1,9 @@
+{
+	"extends": "./tsconfig.json",
+	"compilerOptions": {
+		"outDir": "dist",
+		"declaration": true,
+		"noEmit": false
+	},
+	"include": ["src"]
+}

tsconfig.json

@@ -0,0 +1,11 @@
+{
+	"compilerOptions": {
+		"allowSyntheticDefaultImports": true,
+		"noEmit": true,
+		"module": "esnext",
+		"moduleResolution": "bundler",
+		"strict": true,
+		"target": "esnext",
+		"allowJs": true
+	}
+}