npm publishing and deploying to cjquines.com

.github/workflows/cjquines-publish.yml

@@ -0,0 +1,29 @@
+# From https://github.com/pihart/ts/blob/572ce179d629f2426ed4f9d7f262fb2e70d9fed6/.github/workflows/npm-publish.yml
+
+# This workflow will run tests using node and then publish a package to NPM when a release is created
+# For more information see: https://help.github.com/actions/language-and-framework-guides/publishing-nodejs-packages
+
+name: Publish to cjquines.com
+
+on:
+  release:
+    types: [ created ]
+
+jobs:
+  build-and-publish:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/[email protected]
+      - uses: actions/[email protected]
+        with:
+          node-version: 12
+          registry-url: https://registry.npmjs.org/
+      - run: npm ci
+      - run: npm test --if-present
+      - name: Create SSH key
+        run: |
+          install -m 600 -D /dev/null ~/.ssh/id_rsa
+          echo "${{ secrets.SSH_PRIVATE_KEY }}" > ~/.ssh/id_rsa
+          echo "${{ secrets.SSH_KNOWN_HOSTS }}" > ~/.ssh/known_hosts
+      - name: Publish
+        run: rsync -a dist/ ssh.phx.nearlyfreespeech.net:/home/public/qboard/

.github/workflows/npm-publish.yml

@@ -0,0 +1,26 @@
+# From https://github.com/pihart/ts/blob/572ce179d629f2426ed4f9d7f262fb2e70d9fed6/.github/workflows/npm-publish.yml
+
+# This workflow will run tests using node and then publish a package to NPM when a release is created
+# For more information see: https://help.github.com/actions/language-and-framework-guides/publishing-nodejs-packages
+
+name: Publish to NPM
+
+on:
+  release:
+    types: [ created ]
+
+jobs:
+  build-and-publish:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/[email protected]
+      - uses: actions/[email protected]
+        with:
+          node-version: 12
+          registry-url: https://registry.npmjs.org/
+      - run: npm ci
+      - run: npm test --if-present
+      - name: Publish
+        run: npm publish --access public
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.github/workflows/semver.yml

@@ -0,0 +1,52 @@
+# From https://github.com/pihart/ts/blob/572ce179d629f2426ed4f9d7f262fb2e70d9fed6/.github/workflows/semver.yml
+
+name: NPM SemVer
+
+on:
+  pull_request:
+    types: [ closed ]
+    branches: [ main ]
+
+jobs:
+  semver:
+    runs-on: ubuntu-latest
+    if: "github.event.pull_request.merged == true && !contains(github.event.pull_request.labels.*.name, 'semver: no-semver')"
+
+    steps:
+      - uses: actions/[email protected]
+      - run: |
+          git config --global user.name 'Avi Mehra'
+          git config --global user.email '[email protected]'
+      - uses: pihart/[email protected]
+        with:
+          label-prefix: "Semver:"
+          run-prefix: npm version
+          items: |
+            [
+              {
+                "label": "Major",
+                "run": "major"
+              },
+              {
+                "label": "Minor",
+                "run": "minor"
+              },
+              {
+                "label": "Patch",
+                "run": "patch"
+              },
+              {
+                "label": "Premajor",
+                "run": "premajor"
+              },
+              {
+                "label": "Preminor",
+                "run": "preminor"
+              },
+              {
+                "label": "Prepatch",
+                "run": "prepatch"
+              }
+            ]
+      - run: |
+          git push --follow-tags origin HEAD:main

.gitignore

@@ -1,5 +1,6 @@
 /coverage
 /dist
+/tscdist
 /node_modules
 npm-debug.log*
 deploy.sh

package.json

@@ -2,6 +2,8 @@
   "name": "qboard",
   "version": "0.1.1",
   "description": "The efficient digital whiteboard.",
+  "main": "tscdist/lib/qboard.js",
+  "types": "tscdist/lib/qboard.d.ts",
   "scripts": {
     "build": "nwb build-react-app",
     "clean": "nwb clean-app",
@@ -13,10 +15,15 @@
     "stylelint:fix": "npm run stylelint -- --fix",
     "predeploy": "npm run build",
     "deploy": "node deploy.js",
-    "start": "nwb serve-react-app"
+    "start": "nwb serve-react-app",
+    "build:module": "tsc --outDir tscdist",
+    "prepublish": "npm run build:module"
   },
   "dependencies": {
     "@mehra/ts": "^5.2.0",
+    "@types/fabric": "^3.6.8",
+    "@types/react": "^16.9.52",
+    "@types/react-modal": "^3.10.6",
     "fabric": "^4.2.0",
     "keyboardjs": "^2.6.4",
     "pdfmake": "^0.1.70",
@@ -27,11 +34,8 @@
     "tex-to-svg": "^0.2.0"
   },
   "devDependencies": {
-    "@types/fabric": "^3.6.8",
     "@types/keyboardjs": "^2.5.0",
     "@types/pdfmake": "^0.1.17",
-    "@types/react": "^16.9.52",
-    "@types/react-modal": "^3.10.6",
     "@typescript-eslint/eslint-plugin": "^4.18.0",
     "@typescript-eslint/parser": "^4.18.0",
     "awesome-typescript-loader": "^5.2.1",
@@ -51,7 +55,7 @@
     "typescript": "^4.2.3"
   },
   "files": [
-    "./src/**/*"
+    "tscdist"
   ],
   "bugs": {
     "url": "https://github.com/cjquines/qboard/issues"

src/lib/qboard.ts

@@ -61,7 +61,7 @@ export default class QBoard {
     strokeUniform: true,
   };
 
-  resizeCooldown: NodeJS.Timeout | undefined;
+  resizeCooldown: number | undefined;
   currentObject: fabric.Object | undefined;
   dragActive = false;
   isDown = false;
@@ -229,8 +229,9 @@ export default class QBoard {
   };
 
   windowResize = (): void => {
-    if (this.resizeCooldown !== undefined) clearTimeout(this.resizeCooldown);
-    this.resizeCooldown = setTimeout(() => {
+    if (this.resizeCooldown !== undefined)
+      window.clearTimeout(this.resizeCooldown);
+    this.resizeCooldown = window.setTimeout(() => {
       this.canvas.fitToWindow(this.canvasWidth, this.canvasHeight);
       this.baseCanvas.fitToWindow(this.canvasWidth, this.canvasHeight);
     }, 100);

tsconfig.json

@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "declaration": true,
     "esModuleInterop": true,
     "jsx": "react",
     "target": "ES2019",