convert to tsup

.changeset/chatty-lions-push.md

@@ -0,0 +1,60 @@
+---
+'@udecode/plate-alignment': minor
+'@udecode/plate-autoformat': minor
+'@udecode/plate-basic-elements': minor
+'@udecode/plate-basic-marks': minor
+'@udecode/plate-block-quote': minor
+'@udecode/plate-break': minor
+'@udecode/plate-caption': minor
+'@udecode/plate-ui': minor
+'@udecode/plate-cloud': minor
+'@udecode/plate-code-block': minor
+'@udecode/plate-combobox': minor
+'@udecode/plate-comments': minor
+'@udecode/plate-common': minor
+'@udecode/plate-core': minor
+'@udecode/plate-cursor': minor
+'@udecode/plate-dnd': minor
+'@udecode/plate-emoji': minor
+'@udecode/plate-excalidraw': minor
+'@udecode/plate-find-replace': minor
+'@udecode/plate-floating': minor
+'@udecode/plate-font': minor
+'@udecode/plate-heading': minor
+'@udecode/plate-highlight': minor
+'@udecode/plate-horizontal-rule': minor
+'@udecode/plate-indent': minor
+'@udecode/plate-indent-list': minor
+'@udecode/plate-juice': minor
+'@udecode/plate-kbd': minor
+'@udecode/plate-line-height': minor
+'@udecode/plate-link': minor
+'@udecode/plate-list': minor
+'@udecode/plate-media': minor
+'@udecode/plate-mention': minor
+'@udecode/plate-node-id': minor
+'@udecode/plate-normalizers': minor
+'@udecode/plate-paragraph': minor
+'@udecode/plate': minor
+'@udecode/plate-utils': minor
+'@udecode/plate-reset-node': minor
+'@udecode/plate-resizable': minor
+'@udecode/plate-select': minor
+'@udecode/plate-selection': minor
+'@udecode/plate-serializer-csv': minor
+'@udecode/plate-serializer-docx': minor
+'@udecode/plate-serializer-html': minor
+'@udecode/plate-serializer-md': minor
+'@udecode/slate': minor
+'@udecode/slate-react': minor
+'@udecode/slate-utils': minor
+'@udecode/plate-suggestion': minor
+'@udecode/plate-tabbable': minor
+'@udecode/plate-table': minor
+'@udecode/plate-test-utils': minor
+'@udecode/plate-trailing-block': minor
+'@udecode/utils': minor
+'@udecode/plate-yjs': minor
+---
+
+use tsup as bundler

.github/workflows/test.yml

@@ -37,6 +37,8 @@ on:
       - 'scripts'
       - 'patches'
 
+  workflow_dispatch:
+
 jobs:
   test:
     name: ${{ matrix.command }}
@@ -98,7 +100,7 @@ jobs:
     needs:
       - test
     if: ${{ github.event_name == 'push' && failure() }}
-    
+
     steps:
       - name: Notify
         uses: nobrayner/discord-webhook@v1

.gitignore

@@ -117,4 +117,5 @@ packages/plate/docs/
 /test-results/
 /playwright-report/
 /playwright/.cache/
-.turbo
+.turbo
+.vercel

CONTRIBUTING.md

@@ -9,7 +9,7 @@ This document will provide guidance to help streamline the process and make effi
 This repository is a monorepo.
 
 - We use [yarn](https://yarnpkg.com/en/docs/install) and [`workspaces`](https://yarnpkg.com/features/workspaces) for development.
-- We use [Rollup](https://rollupjs.org/) as our build system.
+- We use [tsup](https://tsup.egoist.dev/) as our build system.
 - We use [changesets](https://github.com/changesets/changesets) for managing releases.
 
 ## Structure
@@ -32,7 +32,7 @@ packages
 ```
 
 | Path                      | Description                              |
-|---------------------------|------------------------------------------|
+| ------------------------- | ---------------------------------------- |
 | `apps/www/content`        | The content for the website.             |
 | `apps/www/src/app`        | The Next.js application for the website. |
 | `apps/www/src/components` | The React components for the website.    |
@@ -265,4 +265,4 @@ After creating your package, install and build it:
 ```bash
 yarn install
 yarn build
-```
+```

apps/www/next.config.mjs

@@ -1,77 +1,98 @@
 // import { createContentlayerPlugin } from 'next-contentlayer';
 
-/** @type {import('next').NextConfig} */
-const nextConfig = {
-  // Enable React strict mode.
-  // https://nextjs.org/docs/api-reference/next.config.js/react-strict-mod
-  reactStrictMode: true,
+const nextConfig = async (phase, { defaultConfig }) => {
+  /**
+   * @type {import('next').NextConfig}
+   */
+  const config = {
+    // Enable React strict mode.
+    // https://nextjs.org/docs/api-reference/next.config.js/react-strict-mod
+    reactStrictMode: true,
 
-  // Configure domains to allow for optimized image loading.
-  // https://nextjs.org/docs/basic-features/image-optimization#domains
-  images: {
-    domains: [
-      'cdn.discordapp.com',
-      'lh3.googleusercontent.com',
-      'avatars.githubusercontent.com',
-    ],
-  },
+    // Configure domains to allow for optimized image loading.
+    // https://nextjs.org/docs/basic-features/image-optimization#domains
+    images: {
+      domains: [
+        'cdn.discordapp.com',
+        'lh3.googleusercontent.com',
+        'avatars.githubusercontent.com',
+      ],
+    },
 
-  // typescript: {
-  //   ignoreBuildErrors: true,
-  // },
-  // eslint: {
-  //   ignoreDuringBuilds: true,
-  // },
+    // typescript: {
+    //   ignoreBuildErrors: true,
+    // },
+    // eslint: {
+    //   ignoreDuringBuilds: true,
+    // },
 
-  staticPageGenerationTimeout: 1200,
+    staticPageGenerationTimeout: 1200,
 
-  // Enable experimental features.
-  experimental: {
-    esmExternals: false,
-    serverActions: true,
-    // Specify external packages that should be excluded from server-side rendering.
-    // https://beta.nextjs.org/docs/api-reference/next-config#servercomponentsexternalpackages
-    serverComponentsExternalPackages: ['@prisma/client'],
-  },
+    // Enable experimental features.
+    experimental: {
+      esmExternals: false,
+      serverActions: true,
+      // Specify external packages that should be excluded from server-side rendering.
+      // https://beta.nextjs.org/docs/api-reference/next-config#servercomponentsexternalpackages
+      serverComponentsExternalPackages: ['@prisma/client'],
+    },
 
-  // redirects() {
-  //   return [
-  //     {
-  //       source: '/components',
-  //       destination: '/docs/components/accordion',
-  //       permanent: true,
-  //     },
-  //     {
-  //       source: '/docs/components',
-  //       destination: '/docs/components/accordion',
-  //       permanent: true,
-  //     },
-  //     {
-  //       source: '/examples',
-  //       destination: '/examples/dashboard',
-  //       permanent: false,
-  //     },
-  //     {
-  //       source: '/docs/primitives/:path*',
-  //       destination: '/docs/components/:path*',
-  //       permanent: true,
-  //     },
-  //     {
-  //       source: '/figma',
-  //       destination: '/docs/figma',
-  //       permanent: true,
-  //     },
-  //     {
-  //       source: '/docs/forms',
-  //       destination: '/docs/forms/react-hook-form',
-  //       permanent: false,
-  //     },
-  //   ];
-  // },
-};
+    // redirects() {
+    //   return [
+    //     {
+    //       source: '/components',
+    //       destination: '/docs/components/accordion',
+    //       permanent: true,
+    //     },
+    //     {
+    //       source: '/docs/components',
+    //       destination: '/docs/components/accordion',
+    //       permanent: true,
+    //     },
+    //     {
+    //       source: '/examples',
+    //       destination: '/examples/dashboard',
+    //       permanent: false,
+    //     },
+    //     {
+    //       source: '/docs/primitives/:path*',
+    //       destination: '/docs/components/:path*',
+    //       permanent: true,
+    //     },
+    //     {
+    //       source: '/figma',
+    //       destination: '/docs/figma',
+    //       permanent: true,
+    //     },
+    //     {
+    //       source: '/docs/forms',
+    //       destination: '/docs/forms/react-hook-form',
+    //       permanent: false,
+    //     },
+    //   ];
+    // },
+  };
+  if (phase === 'phase-development-server') {
+    const fs = await import('node:fs');
+    const glob = await import('glob').then((mod) => mod.default);
+
+    const packageNames = new glob.GlobSync(
+      '../../packages/**/package.json'
+    ).found
+      .map((file) => {
+        try {
+          const packageJson = JSON.parse(fs.readFileSync(file, 'utf8'));
+          return packageJson.name;
+        } catch (error) {
+          return null;
+        }
+      })
+      .filter((pkg) => pkg?.startsWith('@udecode'));
 
-// const withContentlayer = createContentlayerPlugin({
-// Additional Contentlayer config options
-// });
+    config.transpilePackages = packageNames;
+  }
+
+  return config;
+};
 
 export default nextConfig;

config/tsup.config.ts

@@ -0,0 +1,33 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { defineConfig } from 'tsup';
+
+const PACKAGE_ROOT_PATH = process.cwd();
+const INPUT_FILE_PATH = path.join(PACKAGE_ROOT_PATH, 'src/index.ts');
+const INPUT_FILE = fs.existsSync(INPUT_FILE_PATH)
+  ? INPUT_FILE_PATH
+  : path.join(PACKAGE_ROOT_PATH, 'src/index.tsx');
+
+export default defineConfig((opts) => {
+  return {
+    ...opts,
+    entry: [INPUT_FILE],
+    format: ['cjs', 'esm'],
+    external: [],
+    skipNodeModulesBundle: true,
+    dts: true,
+    sourcemap: true,
+    clean: true,
+    minify: false,
+    onSuccess: async () => {
+      if (opts.watch) {
+        console.info('Watching for changes...');
+        return;
+      }
+
+      console.info('Build succeeded!');
+    },
+
+    silent: true,
+  };
+});

config/turbowatch.config.ts

@@ -0,0 +1,79 @@
+import { readFileSync } from 'node:fs';
+import { GlobSync } from 'glob';
+import { defineConfig, Expression } from 'turbowatch';
+
+const foundPackageJson = new GlobSync('packages/*/package.json').found;
+
+type PathToPackageNameMap = Map<string, string>;
+
+const allPackages = foundPackageJson.reduce<PathToPackageNameMap>(
+  (acc, current) => {
+    try {
+      const packageJson = readFileSync(current, 'utf8');
+      const packageJsonParsed = JSON.parse(packageJson) as {
+        dependencies: Record<string, string>;
+        name: string | undefined;
+      };
+
+      const packageName = packageJsonParsed.name;
+
+      if (!packageName) {
+        return acc;
+      }
+
+      acc.set(current, packageName);
+      return acc;
+    } catch (_) {}
+
+    return acc;
+  },
+  new Map()
+);
+
+const dirList = [...allPackages.keys()].map(
+  (dir) => ['dirname', dir.replace('/package.json', '')] satisfies Expression
+);
+
+export default defineConfig({
+  project: process.cwd(),
+  triggers: [
+    {
+      expression: [
+        'allof',
+        ['not', ['anyof', ['dirname', 'node_modules'], ['dirname', 'dist']]],
+        ['anyof', ...dirList],
+        [
+          'anyof',
+          ['match', '*.ts', 'basename'],
+          ['match', '*.tsx', 'basename'],
+          ['match', '*.js', 'basename'],
+        ],
+      ],
+      interruptible: true,
+      name: 'build',
+      onChange: async ({ spawn, files, abortSignal }) => {
+        const changedPackages = new Set<string>();
+        for (const file of files) {
+          const pkgJsonPath = file.name
+            .replace(`${process.cwd()}/`, '')
+            .replace(/\/src\/.*/, '/package.json');
+
+          const packageName = allPackages.get(pkgJsonPath);
+
+          if (!packageName) {
+            continue;
+          }
+
+          changedPackages.add(packageName);
+        }
+
+        if (changedPackages.size === 0) {
+          return;
+        }
+
+        await spawn`turbo run build --filter=${[...changedPackages].join(',')}`;
+        if (abortSignal?.aborted) return;
+      },
+    },
+  ],
+});