#38: Restore TypeScript support for using a non-namespaced TS jsxFactory

package.json

@@ -3,18 +3,13 @@
   "version": "2.1.3",
   "main": "./dist/index.js",
   "type": "module",
-  "types": "./dist/index.d.ts",
   "author": "Jeswin Kumar<jeswinpk@agilehead.com>",
   "repository": {
     "type": "git",
     "url": "https://github.com/forgojs/forgo"
   },
-  "exports": {
-    ".": {
-      "import": "./dist/forgo.min.js",
-      "types": "./dist/index.d.ts"
-    }
-  },
+  "exports": "./dist/forgo.min.js",
+  "types": "./dist/index.d.ts",
   "devDependencies": {
     "@types/jsdom": "^16.2.14",
     "@types/mocha": "^9.1.0",
@@ -28,7 +23,7 @@
   },
   "scripts": {
     "clean": "rimraf ./dist",
-    "build": "npm run clean && mkdir -p dist && npx tsc --emitDeclarationOnly && npx esbuild src/index.ts --minify --sourcemap --target=es2015 --outfile=dist/forgo.min.js",
+    "build": "npm run clean && npx tsc --emitDeclarationOnly && npx esbuild ./src/index.ts --minify --bundle --format=esm --sourcemap --target=es2015 --outfile=dist/forgo.min.js",
     "build-dev": "npx tsc",
     "test": "npx tsc && npx mocha dist/test/test.js"
   },

src/index.ts

@@ -1754,13 +1754,40 @@ function findNodeIndex(
 }
 
 /* JSX Types */
-import type { JSXTypes } from "./jsxTypes";
+/*
+  JSX typings expect a JSX namespace to be in scope for the forgo module (if a
+  using a jsxFactory like forgo.createElement), or attached to the naked factory
+  function (if using a jsxFactory like createElement).
+
+  See: https://www.typescriptlang.org/docs/handbook/jsx.html#intrinsic-elements
+  Also: https://dev.to/ferdaber/typescript-and-jsx-part-ii---what-can-create-jsx-22h6
+  Also: https://www.innoq.com/en/blog/type-checking-tsx/
+
+  Note that importing a module turns it into a namespace on this side of the
+  import, so it doesn't need to be declared as a namespace inside jsxTypes.ts.
+  However, attempting to declare it that way causes no end of headaches either
+  when trying to reexport it here, or reexport it from a createElement
+  namespace. Some errors arise at comple or build time, and some are only
+  visible when a project attempts to consume forgo.
+*/
+// This covers a consuming project using the forgo.createElement jsxFactory
+export * as JSX from "./jsxTypes.js";
+
+// If jsxTypes is imported using named imports, esbuild doesn't know how to
+// erase the imports and gets pset that "JSX" isn't an actual literal value
+// inside the jsxTypes.ts module. We have to import as a different name than the
+// export within createElement because I can't find a way to export a namespace
+// within a namespace without using import aliases.
+import * as JSXTypes from "./jsxTypes.js";
+// The createElement namespace exists so that users can set their TypeScript
+// jsxFactory to createElement instead of forgo.createElement.
+export namespace createElement {
+  export import JSX = JSXTypes;
+}
 
 declare global {
   interface ChildNode {
     __forgo?: NodeAttachedState;
     __forgo_deleted?: boolean;
   }
 }
-
-export { JSXTypes as JSX };