Replace parcel with tsup. Better types, better tsconfig. Move to ESM. (…

…#6468)

packages/providers/news/6468.internal

@@ -0,0 +1 @@
+Replace `parcel` with `tsup`. Better types, better tsconfig. Move to ESM. @sneridagh

packages/providers/package.json

@@ -28,22 +28,19 @@
   "publishConfig": {
     "access": "public"
   },
-  "source": "./src/index.ts",
-  "main": "./dist/main.js",
-  "module": "./dist/module.mjs",
-  "types": "./dist/index.d.ts",
+  "type": "module",
+  "main": "./dist/index.js",
   "exports": {
+    "./package.json": "./package.json",
     ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/module.mjs",
-      "require": "./dist/main.js"
-    },
-    "./src/*": "./src/*"
+      "import": "./dist/index.js",
+      "default": "./dist/index.cjs"
+    }
   },
   "scripts": {
-    "watch": "parcel watch",
-    "build": "parcel build",
-    "build:force": "rm -rf dist && parcel build --no-cache",
+    "build": "tsup",
+    "build:force": "tsup",
+    "check:exports": "attw --pack .",
     "test": "vitest",
     "dry-release": "release-it --dry-run",
     "release": "release-it",
@@ -67,18 +64,13 @@
     "react-aria-components": "^1.4.0"
   },
   "devDependencies": {
-    "@parcel/config-default": "^2.12.0",
-    "@parcel/core": "^2.12.0",
-    "@parcel/packager-ts": "^2.12.0",
-    "@parcel/transformer-js": "^2.12.0",
-    "@parcel/transformer-react-refresh-wrap": "^2.12.0",
-    "@parcel/transformer-typescript-types": "^2.12.0",
+    "@arethetypeswrong/cli": "^0.16.4",
     "@plone/types": "workspace:*",
     "@types/react": "^18",
     "@types/react-dom": "^18",
-    "parcel": "^2.12.0",
     "release-it": "17.1.1",
     "tsconfig": "workspace:*",
+    "tsup": "^8.3.5",
     "typescript": "^5.6.3",
     "vitest": "^2.1.3"
   }

packages/providers/src/AppRouter.tsx

@@ -1,4 +1,9 @@
-import React, { createContext, ReactNode, useContext, useMemo } from 'react';
+import React, {
+  createContext,
+  type ReactNode,
+  useContext,
+  useMemo,
+} from 'react';
 import { RouterProvider } from 'react-aria-components';
 import { flattenToAppURL as defaultFlattenToAppURL } from './utils';
 
@@ -17,7 +22,7 @@ interface AppRouter {
   useLocation: () => Location | undefined;
   useParams: (opts?: any) => Record<string, string>;
   navigate: (path: string) => void;
-  useHref: (to: string, options?: any) => string;
+  useHref?: (to: string, options?: any) => string;
   flattenToAppURL: (path: string | undefined) => string | undefined;
 }
 

packages/providers/src/PloneProvider.tsx

@@ -1,23 +1,26 @@
-import React, { createContext, ReactNode, useContext, useMemo } from 'react';
+import React, {
+  createContext,
+  type ReactNode,
+  useContext,
+  useMemo,
+} from 'react';
 import { QueryClient } from '@tanstack/react-query';
-import { AppRouterProvider, Location } from './AppRouter';
+import { AppRouterProvider, type Location } from './AppRouter';
 import { PloneClientProvider } from './PloneClient';
 import PloneClient from '@plone/client';
 import { flattenToAppURL as defaultFlattenToAppURL } from './utils';
 
 interface PloneProvider {
-  ploneClient: InstanceType<typeof PloneClient>;
-  queryClient: QueryClient;
+  ploneClient?: InstanceType<typeof PloneClient>;
+  queryClient?: QueryClient;
   useLocation: () => Location | undefined;
   useParams: (opts?: any) => Record<string, string>;
   navigate: (path: string) => void;
-  useHref: (to: string, options?: any) => string;
+  useHref?: (to: string, options?: any) => string;
   flattenToAppURL: (path: string | undefined) => string | undefined;
 }
 
 const PloneProviderContext = createContext<PloneProvider>({
-  ploneClient: null,
-  queryClient: null,
   useLocation: () => ({
     href: '',
     pathname: '',

packages/providers/tsconfig.json

@@ -1,6 +1,27 @@
 {
-  "extends": "tsconfig/react-library.json",
-  "include": ["src", "src/**/*.js"],
+  "compilerOptions": {
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "target": "es2022",
+    "allowJs": true,
+    "resolveJsonModule": true,
+    "moduleDetection": "force",
+    "isolatedModules": true,
+    "verbatimModuleSyntax": true,
+
+    "strict": true,
+    "noImplicitOverride": true,
+
+    "lib": ["es2022", "dom", "dom.iterable"],
+    "module": "preserve",
+    "noEmit": true,
+
+    "jsx": "react-jsx",
+
+    "allowSyntheticDefaultImports": true,
+    "forceConsistentCasingInFileNames": true
+  },
+  "include": ["src"],
   "exclude": [
     "node_modules",
     "build",

packages/providers/tsup.config.ts

@@ -0,0 +1,9 @@
+import { defineConfig } from 'tsup';
+
+export default defineConfig({
+  entryPoints: ['src/index.ts'],
+  format: ['cjs', 'esm'],
+  dts: true,
+  outDir: 'dist',
+  clean: true,
+});