From 029289500a6a79684b3147df39abc151350d3aa8 Mon Sep 17 00:00:00 2001 From: Gordon Smith Date: Mon, 11 Nov 2024 12:29:44 +0000 Subject: [PATCH] feat: Upgrade timeline to v3 Signed-off-by: Gordon Smith --- package-lock.json | 27 +++- package.json | 2 +- packages/timeline/.vscode/launch.json | 47 +++++++ packages/timeline/.vscode/tasks.json | 34 +++-- packages/timeline/esbuild.js | 29 +++++ packages/timeline/index.html | 108 +++++++++++++++ packages/timeline/package.json | 70 +++++----- packages/timeline/rollup.config.mjs | 56 -------- packages/timeline/src/MiniGantt.ts | 19 +-- packages/timeline/src/ReactAxisGantt.ts | 9 +- packages/timeline/src/ReactAxisGanttSeries.ts | 4 +- packages/timeline/src/ReactGantt.ts | 4 + packages/timeline/src/ReactTimeline.ts | 20 +-- packages/timeline/src/ReactTimelineSeries.ts | 16 +-- packages/timeline/src/index.ts | 14 +- .../timeline/tests/timeline.browser.spec.ts | 123 ++++++++++++++++++ packages/timeline/tsconfig.json | 35 ++--- packages/timeline/vitest.workspace.ts | 6 + 18 files changed, 467 insertions(+), 156 deletions(-) create mode 100644 packages/timeline/.vscode/launch.json create mode 100644 packages/timeline/esbuild.js create mode 100644 packages/timeline/index.html delete mode 100644 packages/timeline/rollup.config.mjs create mode 100644 packages/timeline/tests/timeline.browser.spec.ts create mode 100644 packages/timeline/vitest.workspace.ts diff --git a/package-lock.json b/package-lock.json index 3c30dbc1c4..da8a4c54d2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -44,7 +44,7 @@ "packages/preact-shim", "packages/react", "xpackages/requirejs-shim", - "xpackages/timeline", + "packages/timeline", "packages/tree", "packages/util", "xcomponents/*", @@ -787,6 +787,10 @@ "resolved": "packages/react", "link": true }, + "node_modules/@hpcc-js/timeline": { + "resolved": "packages/timeline", + "link": true + }, "node_modules/@hpcc-js/tree": { "resolved": "packages/tree", "link": true @@ -17531,6 +17535,27 @@ "react-dom": "^17.0.0 || ^18.0.0" } }, + "packages/timeline": { + "name": "@hpcc-js/timeline", + "version": "3.0.0", + "license": "Apache-2.0", + "dependencies": { + "@hpcc-js/api": "^3.0.0", + "@hpcc-js/chart": "^3.0.0", + "@hpcc-js/common": "^3.0.0", + "@hpcc-js/html": "^3.0.0", + "@hpcc-js/layout": "^3.0.0", + "@hpcc-js/react": "^3.0.0" + }, + "devDependencies": { + "@hpcc-js/esbuild-plugins": "^1.2.0", + "d3-array": "^1", + "d3-scale": "^1", + "d3-selection": "^1", + "d3-time-format": "^2", + "d3-zoom": "^1" + } + }, "packages/tree": { "name": "@hpcc-js/tree", "version": "3.0.0", diff --git a/package.json b/package.json index 1007bae18a..dd9adc3ea8 100644 --- a/package.json +++ b/package.json @@ -41,7 +41,7 @@ "packages/preact-shim", "packages/react", "xpackages/requirejs-shim", - "xpackages/timeline", + "packages/timeline", "packages/tree", "packages/util", "xcomponents/*", diff --git a/packages/timeline/.vscode/launch.json b/packages/timeline/.vscode/launch.json new file mode 100644 index 0000000000..7c2436335f --- /dev/null +++ b/packages/timeline/.vscode/launch.json @@ -0,0 +1,47 @@ +{ + "version": "0.2.0", + "configurations": [ + { + "name": "test-browser", + "type": "msedge", + "request": "launch", + "url": "http://localhost:8888", + "webRoot": "${workspaceFolder}", + "outFiles": [ + "${workspaceFolder}/**/*.js", + "!**/node_modules/**" + ], + }, + { + "name": "test-node", + "type": "node", + "request": "launch", + "runtimeArgs": [ + "run-script", + "test-node" + ], + "runtimeExecutable": "npm", + "skipFiles": [ + "/**" + ], + "outFiles": [ + "${workspaceFolder}/**/*.js", + "!**/node_modules/**" + ], + }, + { + "name": "index.html", + "request": "launch", + "type": "msedge", + "url": "file:///${workspaceFolder}/index.html", + "runtimeArgs": [ + "--disable-web-security" + ], + "webRoot": "${workspaceFolder}", + "outFiles": [ + "${workspaceFolder}/**/*.js", + "!**/node_modules/**" + ] + } + ] +} \ No newline at end of file diff --git a/packages/timeline/.vscode/tasks.json b/packages/timeline/.vscode/tasks.json index 7fffdb949c..120545d06c 100644 --- a/packages/timeline/.vscode/tasks.json +++ b/packages/timeline/.vscode/tasks.json @@ -1,20 +1,36 @@ { - // See https://go.microsoft.com/fwlink/?LinkId=733558 - // for the documentation about the tasks.json format "version": "2.0.0", "tasks": [ { + "label": "gen-types-watch", "type": "npm", - "script": "compile-umd-watch", - "group": { - "kind": "build", - "isDefault": true - }, + "script": "gen-types-watch", "problemMatcher": [ "$tsc-watch" ], - "label": "npm: compile-umd-watch", - "detail": "tsc --module umd --outDir ./lib-umd --watch" + "presentation": { + "group": "group-build" + } + }, + { + "label": "bundle-watch", + "type": "npm", + "script": "bundle-watch", + "problemMatcher": [], + "presentation": { + "group": "group-build" + } + }, + { + "label": "build", + "dependsOn": [ + "gen-types-watch", + "bundle-watch", + ], + "group": { + "kind": "build", + "isDefault": true + } } ] } \ No newline at end of file diff --git a/packages/timeline/esbuild.js b/packages/timeline/esbuild.js new file mode 100644 index 0000000000..67b91a9988 --- /dev/null +++ b/packages/timeline/esbuild.js @@ -0,0 +1,29 @@ +import { browserTpl } from "@hpcc-js/esbuild-plugins"; +import pkg from "./package.json" with { type: "json" }; + +// config --- +await Promise.all([ + browserTpl("src/index.ts", "dist/index", { + keepNames: true, + alias: { + "d3-array": "@hpcc-js/common", + "d3-brush": "@hpcc-js/common", + "d3-collection": "@hpcc-js/common", + "d3-color": "@hpcc-js/common", + "d3-dispatch": "@hpcc-js/common", + "d3-drag": "@hpcc-js/common", + "d3-dsv": "@hpcc-js/common", + "d3-ease": "@hpcc-js/common", + "d3-format": "@hpcc-js/common", + "d3-interpolate": "@hpcc-js/common", + "d3-scale": "@hpcc-js/common", + "d3-selection": "@hpcc-js/common", + "d3-time-format": "@hpcc-js/common", + "d3-transition": "@hpcc-js/common", + "d3-zoom": "@hpcc-js/common" + }, + external: [ + ...Object.keys(pkg.dependencies), + ] + }) +]); diff --git a/packages/timeline/index.html b/packages/timeline/index.html new file mode 100644 index 0000000000..325730588d --- /dev/null +++ b/packages/timeline/index.html @@ -0,0 +1,108 @@ + + + + + Home + + + + + + +

ESM Quick Test

+
+ + + + + \ No newline at end of file diff --git a/packages/timeline/package.json b/packages/timeline/package.json index 0ff3be6ccf..5d0ff174f8 100644 --- a/packages/timeline/package.json +++ b/packages/timeline/package.json @@ -1,58 +1,56 @@ { "name": "@hpcc-js/timeline", - "version": "2.54.0", + "version": "3.0.0", "description": "hpcc-js - Viz Timeline", - "main": "dist/index.js", - "module": "dist/index.es6", - "unpkg": "dist/index.min.js", - "jsdelivr": "dist/index.min.js", - "types": "types/index.d.ts", - "typesVersions": { - "<3.8": { - "*": [ - "types-3.4/index.d.ts" - ] - } + "type": "module", + "exports": { + ".": { + "types": "./types/index.d.ts", + "default": "./dist/index.js" + }, + "./dist/*": "./dist/*" }, + "module": "./dist/index.js", + "browser": "./dist/index.js", + "types": "./types/index.d.ts", "files": [ "dist/*", + "src/*", "types/*", - "types-3.4/*", - "src/*" + "font-awesome/**/*" ], "scripts": { - "clean": "rimraf --glob lib* types dist *.tsbuildinfo", - "compile-es6": "tsc --module es6 --outDir ./lib-es6", - "compile-es6-watch": "npm run compile-es6 -- -w", - "compile-umd": "tsc --module umd --outDir ./lib-umd", - "compile-umd-watch": "npm run compile-umd -- -w", - "bundle": "rollup -c", - "bundle-watch": "npm run bundle -- -w", - "minimize": "terser dist/index.js -c -m --source-map \"content='dist/index.js.map',url='index.min.js.map'\" -o dist/index.min.js", - "gen-legacy-types": "downlevel-dts ./types ./types-3.4", - "build": "npm run compile-es6 && npm run bundle", - "watch": "npm-run-all compile-es6 -p compile-es6-watch bundle-watch", + "clean": "rimraf --glob lib* types dist *.tsbuildinfo .turbo", + "bundle": "node esbuild.js", + "bundle-watch": "npm run bundle -- --development --watch", + "gen-types": "tsc --project tsconfig.json", + "gen-types-watch": "npm run gen-types -- --watch", + "build": "run-p gen-types bundle", "stamp": "node ../../node_modules/@hpcc-js/bundle/src/stamp.js", "lint": "eslint ./src", + "lint-fix": "eslint --fix src/**/*.ts", "docs": "typedoc --options tdoptions.json .", - "update": "npx --yes npm-check-updates -u -t minor" + "test-browser": "vitest run --project browser", + "test": "vitest run", + "coverage": "vitest run --coverage", + "update": "npx --yes npm-check-updates -u -t minor", + "update-major": "npx --yes npm-check-updates -u" }, "dependencies": { - "@hpcc-js/api": "^2.14.0", - "@hpcc-js/chart": "^2.86.0", - "@hpcc-js/common": "^2.73.0", - "@hpcc-js/html": "^2.44.0", - "@hpcc-js/layout": "^2.51.0", - "@hpcc-js/react": "^2.55.0" + "@hpcc-js/api": "^3.0.0", + "@hpcc-js/chart": "^3.0.0", + "@hpcc-js/common": "^3.0.0", + "@hpcc-js/html": "^3.0.0", + "@hpcc-js/layout": "^3.0.0", + "@hpcc-js/react": "^3.0.0" }, "devDependencies": { - "@hpcc-js/bundle": "^2.12.0", + "@hpcc-js/esbuild-plugins": "^1.2.0", "d3-array": "^1", "d3-scale": "^1", "d3-selection": "^1", "d3-time-format": "^2", - "d3-zoom": "^1", - "tslib": "2.7.0" + "d3-zoom": "^1" }, "repository": { "type": "git", @@ -65,4 +63,4 @@ "url": "https://github.com/hpcc-systems/Visualization/issues" }, "homepage": "https://github.com/hpcc-systems/Visualization" -} +} \ No newline at end of file diff --git a/packages/timeline/rollup.config.mjs b/packages/timeline/rollup.config.mjs deleted file mode 100644 index 3e0b2b9d2a..0000000000 --- a/packages/timeline/rollup.config.mjs +++ /dev/null @@ -1,56 +0,0 @@ -import { external, globals } from "@hpcc-js/bundle"; -import alias from '@rollup/plugin-alias'; -import commonjs from '@rollup/plugin-commonjs'; -import sourcemaps from 'rollup-plugin-sourcemaps'; -import nodeResolve from '@rollup/plugin-node-resolve'; -import postcss from "rollup-plugin-postcss"; - -import pkg from "./package.json" with { type: "json" }; - -export default { - input: "lib-es6/index", - external: external, - output: [{ - file: pkg.main, - format: "umd", - sourcemap: true, - globals: globals, - name: pkg.name - }, { - file: pkg.module + ".js", - format: "es", - sourcemap: true, - globals: globals, - name: pkg.name - }], - plugins: [ - alias({ - entries: [ - { find: "d3-array", replacement: "@hpcc-js/common" }, - { find: "d3-brush", replacement: "@hpcc-js/common" }, - { find: "d3-collection", replacement: "@hpcc-js/common" }, - { find: "d3-color", replacement: "@hpcc-js/common" }, - { find: "d3-dispatch", replacement: "@hpcc-js/common" }, - { find: "d3-drag", replacement: "@hpcc-js/common" }, - { find: "d3-dsv", replacement: "@hpcc-js/common" }, - { find: "d3-ease", replacement: "@hpcc-js/common" }, - { find: "d3-format", replacement: "@hpcc-js/common" }, - { find: "d3-interpolate", replacement: "@hpcc-js/common" }, - { find: "d3-scale", replacement: "@hpcc-js/common" }, - { find: "d3-selection", replacement: "@hpcc-js/common" }, - { find: "d3-time-format", replacement: "@hpcc-js/common" }, - { find: "d3-transition", replacement: "@hpcc-js/common" }, - { find: "d3-zoom", replacement: "@hpcc-js/common" } - ] - }), - nodeResolve({ - preferBuiltins: true - }), - commonjs({}), - sourcemaps(), - postcss({ - extensions: [".css"], - minimize: true - }) - ] -}; \ No newline at end of file diff --git a/packages/timeline/src/MiniGantt.ts b/packages/timeline/src/MiniGantt.ts index e79ae43e8b..e3b173ff4e 100644 --- a/packages/timeline/src/MiniGantt.ts +++ b/packages/timeline/src/MiniGantt.ts @@ -83,7 +83,7 @@ export class MiniGantt extends SVGWidget { } dataStartPos(d) { - if(typeof this._dateCache[d[this._startDate_idx]] !== "undefined"){ + if (typeof this._dateCache[d[this._startDate_idx]] !== "undefined") { return this._dateCache[d[this._startDate_idx]]; } const pos = this.brAxis.scalePos(d[this._startDate_idx]); @@ -92,7 +92,7 @@ export class MiniGantt extends SVGWidget { } dataEndPos(d) { - if(typeof this._dateCache[d[this._endDate_idx]] !== "undefined"){ + if (typeof this._dateCache[d[this._endDate_idx]] !== "undefined") { return this._dateCache[d[this._endDate_idx]]; } const pos = this.brAxis.scalePos(d[this._endDate_idx]); @@ -522,20 +522,21 @@ export class MiniGantt extends SVGWidget { updateEntityRect(textbox: EntityRect, d) { } +} +MiniGantt.prototype._class += " timeline_MiniGantt"; +MiniGantt.prototype.implements(ITooltip.prototype); +MiniGantt.prototype.mixin(Utility.SimpleSelectionMixin); +export interface MiniGantt { // ITooltip --- tooltip; - tooltipHTML: (_) => string; - tooltipFormat: (_) => string; + tooltipHTML(_): string; + tooltipFormat(_): string; // SimpleSelectionMixin _selection; -} -MiniGantt.prototype._class += " timeline_MiniGantt"; -MiniGantt.prototype.implements(ITooltip.prototype); -MiniGantt.prototype.mixin(Utility.SimpleSelectionMixin); -export interface MiniGantt { + // Properties --- timePattern(): string; timePattern(_: string): this; tickFormat(): string; diff --git a/packages/timeline/src/ReactAxisGantt.ts b/packages/timeline/src/ReactAxisGantt.ts index cfcb14138e..10a989ade1 100644 --- a/packages/timeline/src/ReactAxisGantt.ts +++ b/packages/timeline/src/ReactAxisGantt.ts @@ -1,6 +1,6 @@ import { Axis } from "@hpcc-js/chart"; import { SVGWidget } from "@hpcc-js/common"; -import { ReactGantt } from "./ReactGantt"; +import { ReactGantt } from "./ReactGantt.ts"; export type IAxisGanttData = [string, number | string, number | string, any?] | any[]; @@ -160,6 +160,13 @@ export class ReactAxisGantt extends SVGWidget { this._gantt.render(); } + exit(domNode, element) { + this._bottomAxis.target(null); + this._gantt.target(null); + this._topAxis.target(null); + super.exit(domNode, element); + } + columns(): string[]; columns(_: string[]): this; columns(_?: string[]): this | string[] { diff --git a/packages/timeline/src/ReactAxisGanttSeries.ts b/packages/timeline/src/ReactAxisGanttSeries.ts index ba7bdd0e3f..bc643e793f 100644 --- a/packages/timeline/src/ReactAxisGanttSeries.ts +++ b/packages/timeline/src/ReactAxisGanttSeries.ts @@ -1,9 +1,9 @@ import { min as d3Min, max as d3Max } from "d3-array"; import { Axis } from "@hpcc-js/chart"; import { Border2 } from "@hpcc-js/layout"; -import { ReactGantt } from "./ReactGantt"; -import { IAxisGanttData } from "./ReactAxisGantt"; import { React } from "@hpcc-js/react"; +import { ReactGantt } from "./ReactGantt.ts"; +import { IAxisGanttData } from "./ReactAxisGantt.ts"; export class ReactAxisGanttSeries extends Border2 { diff --git a/packages/timeline/src/ReactGantt.ts b/packages/timeline/src/ReactGantt.ts index 9d514f55cd..9833a9ee34 100644 --- a/packages/timeline/src/ReactGantt.ts +++ b/packages/timeline/src/ReactGantt.ts @@ -332,6 +332,10 @@ export class ReactGantt extends SVGZoomWidget { ; element.on("dblclick.zoom", null); } + exit(domNode, element) { + this._tooltip.target(null); + super.exit(domNode, element); + } renderRangeElement(d, i, transformEach = false, options: any = {}, seriesKey?: string) { const borderOffset1 = options.strokeWidth; const borderOffset2 = borderOffset1 * 2; diff --git a/packages/timeline/src/ReactTimeline.ts b/packages/timeline/src/ReactTimeline.ts index aa5e3ede5c..9e0f28c585 100644 --- a/packages/timeline/src/ReactTimeline.ts +++ b/packages/timeline/src/ReactTimeline.ts @@ -1,11 +1,11 @@ import { timeFormat as d3TimeFormat, timeParse as d3TimeParse } from "d3-time-format"; -import { ReactAxisGantt } from "./ReactAxisGantt"; +import { ReactAxisGantt } from "./ReactAxisGantt.ts"; export class ReactTimeline extends ReactAxisGantt { protected _axisLabelFormatter;//TODO: add a type to this? d3 time formatting function type? - constructor(){ + constructor() { super(); this._drawStartPos = "origin"; this._topAxis.type("time"); @@ -24,20 +24,20 @@ export class ReactTimeline extends ReactAxisGantt { update(domNode, element) { super.update(domNode, element); - if(this.timePattern_exists()) { + if (this.timePattern_exists()) { let minTimestamp = Infinity; let maxTimestamp = -Infinity; let lowDateStr = ""; let highDateStr = ""; - this.data().map(n=>{ + this.data().map(n => { const start = new Date(n[1]).getTime(); const end = new Date(n[2]).getTime(); - if(minTimestamp > start){ + if (minTimestamp > start) { minTimestamp = start; lowDateStr = "" + n[1]; } - if(maxTimestamp < end){ + if (maxTimestamp < end) { maxTimestamp = end; highDateStr = "" + n[2]; } @@ -78,7 +78,7 @@ export class ReactTimeline extends ReactAxisGantt { } onzoom(transform) { - + const w = this.width(); const low = this._gantt._minStart; const high = this._gantt._maxEnd; @@ -98,18 +98,18 @@ export class ReactTimeline extends ReactAxisGantt { .render() ; } - - _tooltipHTML: (_) => string; } ReactTimeline.prototype._class += " timeline_ReactTimeline"; export interface ReactTimeline { + _tooltipHTML(_): string; + timePattern(): string; timePattern(_: string): this; timePattern_exists(): boolean; tooltipTimeFormat(): string; tooltipTimeFormat(_: string): this; } -ReactTimeline.prototype.publish("timePattern", "%Y-%m-%d", "string", "Time pattern used for parsing datetime strings on each data row", null, {optional:true}); +ReactTimeline.prototype.publish("timePattern", "%Y-%m-%d", "string", "Time pattern used for parsing datetime strings on each data row", null, { optional: true }); ReactTimeline.prototype.publish("tooltipTimeFormat", "%Y-%m-%d", "string", "Time format used in the default html tooltip"); diff --git a/packages/timeline/src/ReactTimelineSeries.ts b/packages/timeline/src/ReactTimelineSeries.ts index e75d106b61..be5635ee8e 100644 --- a/packages/timeline/src/ReactTimelineSeries.ts +++ b/packages/timeline/src/ReactTimelineSeries.ts @@ -1,12 +1,12 @@ import { timeFormat as d3TimeFormat, timeParse as d3TimeParse } from "d3-time-format"; -import { ReactAxisGanttSeries } from "./ReactAxisGanttSeries"; +import { ReactAxisGanttSeries } from "./ReactAxisGanttSeries.ts"; const parseTime = d3TimeParse("%Q"); export class ReactTimelineSeries extends ReactAxisGanttSeries { protected _axisLabelFormatter;//TODO: add a type to this? d3 time formatting function type? - constructor(){ + constructor() { super(); this._topAxis.type("time"); this._bottomAxis.type("time"); @@ -23,20 +23,20 @@ export class ReactTimelineSeries extends ReactAxisGanttSeries { update(domNode, element) { super.update(domNode, element); - if(this.timePattern_exists()) { + if (this.timePattern_exists()) { let minTimestamp = Infinity; let maxTimestamp = -Infinity; let lowDateStr = ""; let highDateStr = ""; - this.data().forEach(n=>{ + this.data().forEach(n => { const start = new Date(n[1]).getTime(); const end = new Date(n[2]).getTime(); - if(minTimestamp > start){ + if (minTimestamp > start) { minTimestamp = start; lowDateStr = "" + n[1]; } - if(maxTimestamp < end){ + if (maxTimestamp < end) { maxTimestamp = end; highDateStr = "" + n[2]; } @@ -76,7 +76,7 @@ export class ReactTimelineSeries extends ReactAxisGanttSeries { } onzoom(transform) { - + const w = this.width(); const low = this._gantt._minStart; const high = this._gantt._maxEnd; @@ -108,6 +108,6 @@ export interface ReactTimelineSeries { tooltipTimeFormat(): string; tooltipTimeFormat(_: string): this; } -ReactTimelineSeries.prototype.publish("timePattern", "%Y-%m-%d", "string", "Time pattern used for parsing datetime strings on each data row", null, {optional:true}); +ReactTimelineSeries.prototype.publish("timePattern", "%Y-%m-%d", "string", "Time pattern used for parsing datetime strings on each data row", null, { optional: true }); ReactTimelineSeries.prototype.publish("tooltipTimeFormat", "%Y-%m-%d", "string", "Time format used in the default html tooltip"); diff --git a/packages/timeline/src/index.ts b/packages/timeline/src/index.ts index 85f54e355f..abb158cbe1 100644 --- a/packages/timeline/src/index.ts +++ b/packages/timeline/src/index.ts @@ -1,7 +1,7 @@ -export * from "./__package__"; -export * from "./MiniGantt"; -export * from "./ReactGantt"; -export * from "./ReactAxisGantt"; -export * from "./ReactAxisGanttSeries"; -export * from "./ReactTimeline"; -export * from "./ReactTimelineSeries"; +export * from "./__package__.ts"; +export * from "./MiniGantt.ts"; +export * from "./ReactGantt.ts"; +export * from "./ReactAxisGantt.ts"; +export * from "./ReactAxisGanttSeries.ts"; +export * from "./ReactTimeline.ts"; +export * from "./ReactTimelineSeries.ts"; diff --git a/packages/timeline/tests/timeline.browser.spec.ts b/packages/timeline/tests/timeline.browser.spec.ts new file mode 100644 index 0000000000..8464554c13 --- /dev/null +++ b/packages/timeline/tests/timeline.browser.spec.ts @@ -0,0 +1,123 @@ +import * as timeline from "@hpcc-js/timeline"; +import { MiniGantt, ReactAxisGantt, ReactAxisGanttSeries, ReactGantt, ReactTimeline, ReactTimelineSeries } from "@hpcc-js/timeline"; +import { Class, EntityCard, HTMLWidget, Icon, SVGWidget } from "@hpcc-js/common"; +import { Bar, Column, Line, Pie, Step } from "@hpcc-js/chart"; +import { describe, it, expect } from "vitest"; +import { classDef, data, render } from "../../common/tests/index.ts"; + +const urlSearch: string = window.location.href.split("?")[1]; + +describe("@hpcc-js/timeline", () => { + for (const key in timeline) { + const item = (timeline as any)[key]; + if (item) { + if (!urlSearch || urlSearch === item.prototype.constructor.name) { + describe(`${item.prototype?.constructor?.name}`, () => { + it("Simple", () => { + expect(true).to.be.true; + }); + if (item.prototype instanceof Class) { + classDef("timeline", item); + } + if (item.prototype instanceof HTMLWidget || item.prototype instanceof SVGWidget) { + switch (item.prototype.constructor) { + case ReactGantt: + case ReactAxisGantt: + render(new item.prototype.constructor() + .data([ + ["item-1", 0, 1], + ["item-2", 99, 999] + ]) + ); + break; + case ReactAxisGanttSeries: + render(new ReactAxisGanttSeries() + .columns(["Label", "start", "end", "category"]) + .seriesColumn("category") + .data([ + ["item-1", 7, 45, "A"], + ["item-2", 11, 16, "B"], + ["item-3", 16, 25, "C"], + ["item-3a", 9, 17, "D"], + ["item-3b", 22, 72, "A"], + ["item-3c", 23, 29, "C"], + ["item-3d", 24, 67, "D"], + ["item-3e", 20, 25, "B"], + ["item-4", 1, 20, "D"], + ["item-6", 10, 50, "B"], + ["item-7", 3, 40, "A"] + ]) + ); + break; + case ReactTimelineSeries: + render(new ReactTimelineSeries() + .timePattern("%Y-%m-%dT%H:%M:%S.%LZ") + .columns(["Label", "start", "end", "category"]) + .seriesColumn("category") + .data([ + ["item-1", "2016-07-01T09:10:00.0Z", "2016-07-01T09:45:00.0Z", "A"], + ["item-2", "2016-07-01T11:00:00.0Z", "2016-07-01T12:00:00.0Z", "B"], + ["item-3", "2016-07-01T09:20:00.0Z", "2016-07-01T12:20:00.0Z", "C"], + ["item-3a", "2016-07-01T09:21:00.0Z", "2016-07-01T12:11:00.0Z", "D"], + ["item-3b", "2016-07-01T09:22:00.0Z", "2016-07-01T12:12:00.0Z", "E"], + ["item-3c", "2016-07-01T09:23:00.0Z", "2016-07-01T12:13:00.0Z", "A"], + ["item-3d", "2016-07-01T09:24:00.0Z", "2016-07-01T12:14:00.0Z", "B"], + ["item-3e", "2016-07-01T09:25:00.0Z", "2016-07-01T12:15:00.0Z", "A"], + ["item-4", "2016-07-01T09:15:00.0Z", "2016-07-01T12:20:00.0Z", "C"], + ["item-6", "2016-07-01T10:00:00.0Z", "2016-07-01T10:50:00.0Z", "A"], + ["item-7", "2016-07-01T10:30:01.0Z", "2016-07-01T10:40:00.0Z", "B"] + ]) + ); + break; + case ReactTimeline: + render(new ReactTimeline() + .timePattern("%Y-%m-%dT%H:%M:%S.%LZ") + .data([ + ["item-1", "2016-07-01T09:10:00.0Z", "2016-07-01T09:45:00.0Z"], + ["item-2", "2016-07-01T11:00:00.0Z", "2016-07-01T12:00:00.0Z"], + ["item-3", "2016-07-01T09:20:00.0Z", "2016-07-01T12:20:00.0Z"], + ["item-3a", "2016-07-01T09:21:00.0Z", "2016-07-01T12:11:00.0Z"], + ["item-3b", "2016-07-01T09:22:00.0Z", "2016-07-01T12:12:00.0Z"], + ["item-3c", "2016-07-01T09:23:00.0Z", "2016-07-01T12:13:00.0Z"], + ["item-3d", "2016-07-01T09:24:00.0Z", "2016-07-01T12:14:00.0Z"], + ["item-3e", "2016-07-01T09:25:00.0Z", "2016-07-01T12:15:00.0Z"], + ["item-4", "2016-07-01T09:15:00.0Z", "2016-07-01T12:20:00.0Z"], + ["item-6", "2016-07-01T10:00:00.0Z", "2016-07-01T10:50:00.0Z"], + ["item-7", "2016-07-01T10:30:01.0Z", "2016-07-01T10:40:00.0Z"] + ]) + ); + break; + case MiniGantt: + render(new MiniGantt() + .timePattern("%Y-%m-%dT%H:%M:%S.%LZ") + .tickFormat("%H:%M") + .data([ + ["Start", "2016-07-01T09:12:15.0Z"], + ["item-1", "2016-07-01T09:10:00.0Z", "2016-07-01T09:45:00.0Z"], + ["item-2", "2016-07-01T11:00:00.0Z", "2016-07-01T12:00:00.0Z"], + ["item-3", "2016-07-01T09:20:00.0Z", "2016-07-01T12:20:00.0Z"], + ["item-3a", "2016-07-01T09:21:00.0Z", "2016-07-01T12:11:00.0Z"], + ["item-3b", "2016-07-01T09:22:00.0Z", "2016-07-01T12:12:00.0Z"], + ["item-3c", "2016-07-01T09:23:00.0Z", "2016-07-01T12:13:00.0Z"], + ["item-3d", "2016-07-01T09:24:00.0Z", "2016-07-01T12:14:00.0Z"], + ["item-3e", "2016-07-01T09:25:00.0Z", "2016-07-01T12:15:00.0Z"], + ["item-4", "2016-07-01T09:15:00.0Z", "2016-07-01T12:20:00.0Z"], + ["item-6", "2016-07-01T10:00:00.0Z", "2016-07-01T10:50:00.0Z"], + ["item-7", "2016-07-01T10:30:01.0Z", "2016-07-01T10:40:00.0Z"], + ["10 O'Clock", "2016-07-01T10:00:00.0Z"], + ["Finish", "2016-07-01T12:30:45.0Z"] + ]) + ); + break; + + default: + it("Has render test", () => { + expect(false).to.be.true; + }); + } + } + }); + } + } + } +}); diff --git a/packages/timeline/tsconfig.json b/packages/timeline/tsconfig.json index f0f5dccce5..3cd3be3a69 100644 --- a/packages/timeline/tsconfig.json +++ b/packages/timeline/tsconfig.json @@ -1,22 +1,25 @@ { - "extends": "../tsconfig.settings.json", "compilerOptions": { - "rootDir": "./src", - "outDir": "./lib-umd", - "declarationDir": "./types", + "rootDir": "src", + "module": "NodeNext", + "target": "ESNext", + "resolveJsonModule": true, + "emitDeclarationOnly": true, + "declaration": true, + "declarationDir": "types", + "strict": false, + "noImplicitAny": false, + "noImplicitThis": false, + "strictNullChecks": false, + "skipLibCheck": true, + "allowImportingTsExtensions": true, + "lib": [ + "DOM", + "ESNext", + "ES2020" + ] }, "include": [ - "./src/**/*" - ], - "references": [ - { - "path": "../api" - }, - { - "path": "../chart" - }, - { - "path": "../common" - } + "./src/index.ts" ] } \ No newline at end of file diff --git a/packages/timeline/vitest.workspace.ts b/packages/timeline/vitest.workspace.ts new file mode 100644 index 0000000000..fa7bb0720b --- /dev/null +++ b/packages/timeline/vitest.workspace.ts @@ -0,0 +1,6 @@ +import { defineWorkspace } from 'vitest/config'; +import baseWorkspace from '../../vitest.workspace.ts'; + +export default defineWorkspace([ + ...baseWorkspace +]) \ No newline at end of file