Fix types and exports of the package

.changeset/strong-otters-brush.md

@@ -0,0 +1,5 @@
+---
+"single-spa-react": patch
+---
+
+fix: types and exports of the package

.gitignore

@@ -3,4 +3,6 @@ node_modules/
 lib/
 yarn-error.log
 coverage
-parcel/
+
+# File is ignored as it is an identical copy of single-spa-react.d.ts, and is copied during the build
+single-spa-react.d.cts

package.json

@@ -8,28 +8,40 @@
   "exports": {
     "./package.json": "./package.json",
     ".": {
-      "import": "./lib/esm/single-spa-react.js",
-      "require": "./lib/cjs/single-spa-react.cjs"
+      "import": {
+        "types": "./types/single-spa-react.d.ts",
+        "default": "./lib/esm/single-spa-react.js"
+      },
+      "require": {
+        "types": "./types/single-spa-react.d.cts",
+        "default": "./lib/cjs/single-spa-react.cjs"
+      }
     },
     "./parcel": {
-      "import": "./lib/esm/parcel.js",
-      "require": "./lib/cjs/parcel.cjs"
+      "import": {
+        "types": "./types/parcel/index.d.ts",
+        "default": "./lib/esm/parcel.js"
+      },
+      "require": {
+        "types": "./types/parcel/index.d.cts",
+        "default": "./lib/cjs/parcel.cjs"
+      }
     }
   },
+  "types": "types/single-spa-react.d.ts",
   "files": [
     "lib",
     "parcel",
-    "types/single-spa-react.d.ts",
+    "types",
     "README.md"
   ],
   "tsd": {
     "directory": "src"
   },
-  "types": "types/single-spa-react.d.ts",
   "scripts": {
     "build": "concurrently pnpm:build:*",
     "build:rollup": "rollup -c",
-    "build:types": "rimraf parcel && copyfiles -f types/parcel/index.d.ts ./parcel",
+    "build:types": "node scripts/build-types.js",
     "lint": "eslint src",
     "test": "concurrently pnpm:test:*",
     "test:browser": "cross-env BABEL_ENV=test NODE_OPTIONS=--experimental-vm-modules jest --coverage",

parcel/README.md

@@ -0,0 +1,20 @@
+# Parcel Folder
+
+## Overview
+This folder contains a `package.json` stub that redirects module resolutions, following the `package-json-redirects` strategy.
+
+## Why It's Here
+Serves as a compatibility layer for Node 10, which does not support the `exports` field in `package.json`. A separate `package.json` with `main` and `types` fields directs Node 10's resolution strategy to the appropriate files.
+
+```json
+{
+  "main": "./lib/cjs/parcel.cjs",
+  "types": "./types/parcel/index.d.cts"
+}
+```
+
+## How It Works
+When Node 10 attempts to import from this folder, it consults the `main` and `types` fields in `package.json` to locate the actual implementation and types files. This facilitates keeping those files in separate subfolders while making them accessible to older Node versions.
+
+## Reference
+For more detailed information and examples, see [this GitHub repository](https://github.com/andrewbranch/example-subpath-exports-ts-compat/tree/main/examples/node_modules/package-json-redirects).

parcel/package.json

@@ -0,0 +1,4 @@
+{
+  "main": "../lib/cjs/parcel.cjs",
+  "types": "../types/parcel/index.d.cts"
+}

scripts/build-types.js

@@ -0,0 +1,10 @@
+import fs from "fs";
+
+function copyFile(sourcePath, destinationPath) {
+  fs.copyFileSync(sourcePath, destinationPath);
+}
+
+copyFile("types/single-spa-react.d.ts", "types/single-spa-react.d.cts");
+
+// eslint-disable-next-line no-console
+console.log("Build types completed.");

types/parcel/index.d.cts

@@ -0,0 +1,33 @@
+import * as React from "react";
+import {
+  ParcelConfig,
+  ParcelProps,
+  Parcel as SingleSpaParcel,
+} from "single-spa";
+
+export interface ParcelCompProps<ExtraProps = {}> {
+  config: ParcelConfig<ExtraProps>;
+  mountParcel?: (
+    parcelConfig: ParcelConfig,
+    parcelProps: ParcelProps & ExtraProps
+  ) => SingleSpaParcel;
+  wrapWith?: string;
+  wrapStyle?: React.CSSProperties;
+  wrapClassName?: string;
+  appendTo?: HTMLElement;
+  parcelDidMount?: () => any;
+  handleError?: (err: Error) => any;
+  [extraProp: string]: any;
+}
+
+interface ParcelState {
+  hasError: boolean;
+}
+
+declare class Parcel<ExtraProps = {}> extends React.Component<
+  ParcelCompProps<ExtraProps>,
+  ParcelState
+> {}
+
+// @ts-ignore
+export = Parcel;