From 27f75a59f3728ff2e592982121cdda4b7d36073a Mon Sep 17 00:00:00 2001
From: Thomas Bouffard <27200110+tbouffard@users.noreply.github.com>
Date: Mon, 7 Nov 2022 18:31:40 +0100
Subject: [PATCH] docs: set the minimum TypeScript requirement to 3.8 (#128)

We use a recent TypeScript version to build maxGraph but applications
that integrates it may be forced to use old TypeScript versions.
We never explain what is the minimum TypeScript version requires to use
`maxGraph`. The changes proposed here are a first step to make this
information available.
It is only informative for now (mentioned in the README) and the minimum
TypeScript version is tested in the `ts-support` package (part of the
'build' GitHub workflow).
---
 .github/workflows/build.yml       |  3 +++
 README.md                         |  1 +
 packages/ts-example/package.json  |  2 +-
 packages/ts-support/.npmrc        |  1 +
 packages/ts-support/README.md     | 15 +++++++++++++++
 packages/ts-support/package.json  | 14 ++++++++++++++
 packages/ts-support/src/index.ts  | 27 +++++++++++++++++++++++++++
 packages/ts-support/tsconfig.json | 16 ++++++++++++++++
 8 files changed, 78 insertions(+), 1 deletion(-)
 create mode 100644 packages/ts-support/.npmrc
 create mode 100644 packages/ts-support/README.md
 create mode 100644 packages/ts-support/package.json
 create mode 100644 packages/ts-support/src/index.ts
 create mode 100644 packages/ts-support/tsconfig.json

diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index f17bd8b25..3a3461460 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -47,6 +47,9 @@ jobs:
       - name: Generate @maxgraph/core types
         working-directory: packages/core
         run: npm run generate-types
+      - name: Test TypeScript support
+        working-directory: packages/ts-support
+        run: npm test
       - name: Build ts-example
         working-directory: packages/ts-example
         run: npm run build
diff --git a/README.md b/README.md
index 818aa595b..e54dc4091 100644
--- a/README.md
+++ b/README.md
@@ -70,6 +70,7 @@ For more details, have a look at the [storybook stories](packages/html/stories).
 
 maxGraph is written in TypeScript and provides type definitions so maxGraph can be easily integrated into TypeScript projects.
 
+`maxGraph` requires **TypeScript 3.8** or greater.
 
 ## Support
 
diff --git a/packages/ts-example/package.json b/packages/ts-example/package.json
index 907efbf7c..7b520cc07 100644
--- a/packages/ts-example/package.json
+++ b/packages/ts-example/package.json
@@ -12,6 +12,6 @@
     "@maxgraph/core": "*"
   },
   "devDependencies": {
-    "vite": "~3.1.0"
+    "vite": "~3.2.3"
   }
 }
diff --git a/packages/ts-support/.npmrc b/packages/ts-support/.npmrc
new file mode 100644
index 000000000..43c97e719
--- /dev/null
+++ b/packages/ts-support/.npmrc
@@ -0,0 +1 @@
+package-lock=false
diff --git a/packages/ts-support/README.md b/packages/ts-support/README.md
new file mode 100644
index 000000000..9e18b574a
--- /dev/null
+++ b/packages/ts-support/README.md
@@ -0,0 +1,15 @@
+# ts-support
+
+Check the minimum TypeScript version required to use `maxGraph`.
+
+## Setup
+
+Initialize all packages
+> From the repository root, run `npm install`.
+
+Build maxgraph@core
+> From the `packages/core` directory, run `npm run generate-types`.
+
+## Run the test
+
+Run `npm test`
diff --git a/packages/ts-support/package.json b/packages/ts-support/package.json
new file mode 100644
index 000000000..6de0b1f6d
--- /dev/null
+++ b/packages/ts-support/package.json
@@ -0,0 +1,14 @@
+{
+  "name": "@maxgraph/ts-support",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "test": "tsc --version && tsc"
+  },
+  "dependencies": {
+    "@maxgraph/core": "*"
+  },
+  "devDependencies": {
+    "typescript": "3.8.2"
+  }
+}
diff --git a/packages/ts-support/src/index.ts b/packages/ts-support/src/index.ts
new file mode 100644
index 000000000..c03e42fce
--- /dev/null
+++ b/packages/ts-support/src/index.ts
@@ -0,0 +1,27 @@
+/*
+Copyright 2022-present The maxGraph project Contributors
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { Client, Graph, InternalEvent } from '@maxgraph/core';
+
+const version = Client.VERSION;
+
+// Creates the graph inside the given container
+const container = <HTMLElement>document.getElementById('graph-container');
+// Disables the built-in context menu
+InternalEvent.disableContextMenu(container);
+
+const graph = new Graph(container);
+graph.setPanning(true); // Use mouse right button for panning
diff --git a/packages/ts-support/tsconfig.json b/packages/ts-support/tsconfig.json
new file mode 100644
index 000000000..39b96909d
--- /dev/null
+++ b/packages/ts-support/tsconfig.json
@@ -0,0 +1,16 @@
+{
+  "compilerOptions": {
+    "module": "ES2015",
+    "target": "ES2015",
+    "lib": [
+      "ES2015",
+      "DOM"
+    ],
+    "moduleResolution": "Node",
+    "strict": true,
+    "noEmit": true
+  },
+  "include": [
+    "src/**/*"
+  ],
+}