@multiplatform.one/config 6.0.0

package/src/vitest.ts

@@ -0,0 +1,255 @@
+import path from "node:path";
+import { tamaguiPlugin } from "@tamagui/vite-plugin";
+import react from "@vitejs/plugin-react";
+import type { UserConfig } from "vite";
+
+export interface CreateVitestConfigOptions {
+  /**
+   * Path to the Tamagui config file for test environments.
+   * Defaults to "./tests/tamagui.config.ts".
+   * Set to false to disable the Tamagui plugin.
+   */
+  tamaguiConfig?: string | false;
+
+  /**
+   * Test environment. Defaults to "jsdom".
+   */
+  environment?: "jsdom" | "happy-dom" | "node";
+
+  /**
+   * Setup files to run before tests.
+   */
+  setupFiles?: string[];
+
+  /**
+   * Test timeout in ms. Defaults to 30000.
+   */
+  testTimeout?: number;
+
+  /**
+   * Additional deps to inline in test server.
+   */
+  inlineDeps?: string[];
+
+  /**
+   * Dependencies to externalize in test server (server.deps.external).
+   */
+  externalDeps?: string[];
+
+  /**
+   * Additional resolve aliases.
+   */
+  aliases?: Record<string, string>;
+
+  /**
+   * Coverage configuration overrides.
+   */
+  coverage?: {
+    exclude?: string[];
+  };
+
+  /**
+   * Whether to replace react-native imports with react-native-web.
+   * Defaults to true.
+   */
+  replaceReactNative?: boolean;
+
+  /**
+   * Whether to deduplicate React to root node_modules.
+   * Defaults to true. Prevents "multiple React instances" errors in monorepo.
+   */
+  dedupeReact?: boolean;
+
+  /**
+   * Absolute path to root node_modules for React deduplication.
+   * Defaults to ../../node_modules relative to cwd.
+   */
+  rootNodeModules?: string;
+
+  /**
+   * Additional resolve conditions. Defaults to ["source", "test", "browser"].
+   */
+  conditions?: string[];
+
+  /**
+   * Test include patterns. Defaults to vitest default.
+   */
+  include?: string[];
+
+  /**
+   * Test exclude patterns. Defaults to vitest default.
+   */
+  exclude?: string[];
+
+  /**
+   * Whether to pass when no tests are found. Defaults to false.
+   */
+  passWithNoTests?: boolean;
+}
+
+/**
+ * Creates a shared Vitest configuration for multiplatform.one packages.
+ *
+ * This eliminates the ~100 lines of duplicated vitest config across 13+ packages,
+ * handling Tamagui transforms, react-native-web replacement, React deduplication,
+ * and consistent coverage/environment settings.
+ *
+ * @example
+ * ```ts
+ * // packages/components/vitest.config.mjs
+ * import { createVitestConfig } from "@multiplatform.one/config/vitest";
+ *
+ * export default createVitestConfig({
+ *   setupFiles: ["./tests/setup.tsx"],
+ *   tamaguiConfig: "../../features/tamagui.config.ts",
+ * });
+ * ```
+ */
+export function createVitestConfig(options: CreateVitestConfigOptions = {}): UserConfig {
+  const {
+    tamaguiConfig = "./tests/tamagui.config.ts",
+    environment = "jsdom",
+    setupFiles = [],
+    testTimeout = 30000,
+    inlineDeps = [],
+    externalDeps = [],
+    aliases = {},
+    coverage,
+    replaceReactNative = true,
+    dedupeReact = true,
+    rootNodeModules: _rootNodeModules,
+    conditions = ["source", "test", "browser"],
+    include,
+    exclude,
+    passWithNoTests,
+  } = options;
+
+  const rootNodeModules = _rootNodeModules || path.resolve(process.cwd(), "../../node_modules");
+
+  const plugins: any[] = [
+    react({
+      jsxRuntime: "automatic",
+    }),
+  ];
+
+  // Replace react-native imports with react-native-web
+  if (replaceReactNative) {
+    plugins.push({
+      name: "replace-react-native",
+      transform(code: string, id: string) {
+        if (id.includes("node_modules")) return;
+        return {
+          code: code.replace(/from ['"]react-native['"]/g, 'from "react-native-web"'),
+          map: null,
+        };
+      },
+    });
+  }
+
+  // Tamagui plugin for test environment
+  if (tamaguiConfig !== false) {
+    plugins.push(
+      tamaguiPlugin({
+        components: ["tamagui"],
+        config: tamaguiConfig,
+      } as any),
+    );
+  }
+
+  // Build resolve aliases
+  const resolveAliases: Record<string, string> = {};
+  if (replaceReactNative) {
+    resolveAliases["react-native"] = "react-native-web";
+    // Replace react-native-svg with tamagui's web-safe SVG shim.
+    // react-native-svg's CJS build calls require("react-native"), and in Node.js 24
+    // that triggers importSyncForRequire which tries to parse react-native/index.js
+    // as ESM. That file contains Flow syntax (`import typeof`) which is invalid ESM,
+    // so Node.js 24 throws SyntaxError: Unexpected token 'typeof'.
+    resolveAliases["react-native-svg"] = "@tamagui/react-native-svg";
+  }
+  if (dedupeReact) {
+    resolveAliases.react = path.resolve(rootNodeModules, "react");
+    resolveAliases["react-dom"] = path.resolve(rootNodeModules, "react-dom");
+    resolveAliases["react-dom/client"] = path.resolve(rootNodeModules, "react-dom/client");
+    resolveAliases["react-dom/server"] = path.resolve(rootNodeModules, "react-dom/server");
+    resolveAliases["react/jsx-runtime"] = path.resolve(rootNodeModules, "react/jsx-runtime");
+    resolveAliases["react/jsx-dev-runtime"] = path.resolve(
+      rootNodeModules,
+      "react/jsx-dev-runtime",
+    );
+    resolveAliases.scheduler = path.resolve(rootNodeModules, "scheduler");
+  }
+
+  const testConfig: Record<string, unknown> = {
+    environment,
+    globals: true,
+    setupFiles,
+    testTimeout,
+    coverage: {
+      provider: "v8" as const,
+      reporter: ["text", "lcov", "html"],
+      reportsDirectory: "./coverage",
+      all: true,
+      clean: true,
+      exclude: [
+        "node_modules/",
+        "tests/",
+        "*.config.*",
+        "**/*.stories.*",
+        "**/*.spec.*",
+        "**/*.test.*",
+        ...(coverage?.exclude || []),
+      ],
+    },
+    server: {
+      deps: {
+        inline: ["react-native-web", "one", /@tamagui\//, "tamagui", ...inlineDeps],
+        ...(externalDeps.length > 0 ? { external: externalDeps } : {}),
+        interopDefault: true,
+      },
+    },
+  };
+  if (include) testConfig.include = include;
+  if (exclude) testConfig.exclude = exclude;
+  if (passWithNoTests) testConfig.passWithNoTests = true;
+
+  return {
+    plugins,
+    test: testConfig,
+    resolve: {
+      extensions: [
+        ".test.ts",
+        ".test.tsx",
+        ".web.ts",
+        ".web.tsx",
+        ".web.js",
+        ".web.jsx",
+        ".ts",
+        ".tsx",
+        ".js",
+        ".jsx",
+      ],
+      mainFields: ["browser", "module", "main"],
+      alias: {
+        ...resolveAliases,
+        ...aliases,
+      },
+      conditions,
+      dedupe: dedupeReact ? ["react", "react-dom", "scheduler"] : [],
+    },
+    define: {
+      __DEV__: true,
+      global: "globalThis",
+      process: JSON.stringify({
+        env: {
+          NODE_ENV: "test",
+          NODE_DEBUG: false,
+        },
+        platform: process.platform,
+        version: process.version,
+        type: "renderer",
+      }),
+      "Buffer.isBuffer": "((obj) => obj?.constructor?.name === 'Buffer')",
+    },
+  } as UserConfig;
+}

package/src/workspacePublicPackages.spec.ts

@@ -0,0 +1,72 @@
+import { describe, expect, it } from "vitest";
+import path from "node:path";
+import {
+  discoverPublicPackageRoots,
+  resolvePackageMainSource,
+  publicPackageViteSourceAliases,
+} from "./workspacePublicPackages";
+
+const workspaceRoot = path.resolve(__dirname, "../../..");
+
+describe("discoverPublicPackageRoots", () => {
+  it("returns a Map of package names to their directories", () => {
+    const roots = discoverPublicPackageRoots(workspaceRoot);
+    expect(roots).toBeInstanceOf(Map);
+    expect(roots.size).toBeGreaterThan(0);
+  });
+
+  it("includes known packages", () => {
+    const roots = discoverPublicPackageRoots(workspaceRoot);
+    expect(roots.has("@multiplatform.one/platform")).toBe(true);
+    expect(roots.has("@multiplatform.one/theme")).toBe(true);
+  });
+
+  it("maps package names to paths within public/", () => {
+    const roots = discoverPublicPackageRoots(workspaceRoot);
+    const platformPath = roots.get("@multiplatform.one/platform");
+    expect(platformPath).toBeDefined();
+    expect(platformPath).toContain(path.join("public", "platform"));
+  });
+
+  it("returns empty Map for non-existent directory", () => {
+    const roots = discoverPublicPackageRoots("/nonexistent/path");
+    expect(roots.size).toBe(0);
+  });
+});
+
+describe("resolvePackageMainSource", () => {
+  it("resolves the main source file for a known package", () => {
+    const roots = discoverPublicPackageRoots(workspaceRoot);
+    const platformDir = roots.get("@multiplatform.one/platform");
+    expect(platformDir).toBeDefined();
+
+    const main = resolvePackageMainSource(platformDir!);
+    expect(main).toBeDefined();
+    expect(main).toMatch(/index\.(ts|tsx)$/);
+  });
+
+  it("returns undefined for a directory with no index file", () => {
+    const main = resolvePackageMainSource("/nonexistent/pkg");
+    expect(main).toBeUndefined();
+  });
+});
+
+describe("publicPackageViteSourceAliases", () => {
+  it("returns an object mapping package names to source files", () => {
+    const aliases = publicPackageViteSourceAliases(workspaceRoot);
+    expect(typeof aliases).toBe("object");
+    expect(Object.keys(aliases).length).toBeGreaterThan(0);
+  });
+
+  it("each alias value points to a .ts or .tsx file", () => {
+    const aliases = publicPackageViteSourceAliases(workspaceRoot);
+    for (const [, filePath] of Object.entries(aliases)) {
+      expect(filePath).toMatch(/\.(ts|tsx)$/);
+    }
+  });
+
+  it("includes known package aliases", () => {
+    const aliases = publicPackageViteSourceAliases(workspaceRoot);
+    expect(aliases["@multiplatform.one/platform"]).toBeDefined();
+  });
+});

package/src/workspacePublicPackages.ts

@@ -0,0 +1,59 @@
+import fs from "node:fs";
+import path from "node:path";
+
+/**
+ * Every direct child of `public/` with a `package.json` `name` is treated as a
+ * publishable workspace package (same rule as Metro in `apps/storybook-expo`).
+ *
+ * Tamagui’s internal esbuild (bundling `tamagui.config` + `components`) reads
+ * `compilerOptions.paths` from the repo `tsconfig.base.json` chain, including
+ * `tamagui-workspace-paths.generated.json` (see `scripts/generate-tamagui-workspace-paths.mjs`).
+ */
+export function discoverPublicPackageRoots(workspaceRoot: string): Map<string, string> {
+  const byName = new Map<string, string>();
+  const publicDir = path.join(workspaceRoot, "public");
+  if (!fs.existsSync(publicDir)) return byName;
+  for (const ent of fs.readdirSync(publicDir, { withFileTypes: true })) {
+    if (!ent.isDirectory()) continue;
+    const pkgRoot = path.join(publicDir, ent.name);
+    const pkgJsonPath = path.join(pkgRoot, "package.json");
+    if (!fs.existsSync(pkgJsonPath)) continue;
+    try {
+      const pkg = JSON.parse(fs.readFileSync(pkgJsonPath, "utf8")) as { name?: string };
+      if (typeof pkg.name === "string" && pkg.name.length > 0) {
+        byName.set(pkg.name, pkgRoot);
+      }
+    } catch {
+      /* invalid package.json */
+    }
+  }
+  return byName;
+}
+
+/** Main entry file for Vite/Storybook-style “compile from source” aliases. */
+export function resolvePackageMainSource(pkgDir: string): string | undefined {
+  const candidates = [
+    path.join(pkgDir, "src", "index.storybook.ts"),
+    path.join(pkgDir, "src", "index.storybook.tsx"),
+    path.join(pkgDir, "src", "index.ts"),
+    path.join(pkgDir, "src", "index.tsx"),
+    path.join(pkgDir, "index.storybook.ts"),
+    path.join(pkgDir, "index.storybook.tsx"),
+    path.join(pkgDir, "index.ts"),
+    path.join(pkgDir, "index.tsx"),
+  ];
+  return candidates.find((c) => fs.existsSync(c));
+}
+
+/**
+ * Vite `resolve.alias` entries: each public package name → its TypeScript main.
+ * For SPA / ad-hoc Vite configs that should not list packages by hand.
+ */
+export function publicPackageViteSourceAliases(workspaceRoot: string): Record<string, string> {
+  const aliases: Record<string, string> = {};
+  for (const [name, dir] of discoverPublicPackageRoots(workspaceRoot)) {
+    const main = resolvePackageMainSource(dir);
+    if (main) aliases[name] = main;
+  }
+  return aliases;
+}

package/tsconfig/app.json

@@ -0,0 +1,22 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "display": "App configuration for multiplatform.one apps",
+  "compilerOptions": {
+    "composite": false,
+    "declaration": false,
+    "declarationMap": false,
+    "noEmit": true,
+    "allowJs": true,
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "resolveJsonModule": true,
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "target": "ES2020",
+    "lib": ["DOM", "DOM.Iterable", "ESNext"],
+    "types": ["node", "react", "vite/client"]
+  }
+}

package/tsconfig/base.json

@@ -0,0 +1,39 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "rootDir": ".",
+    "composite": true,
+    "declaration": true,
+    "declarationMap": true,
+    "sourceMap": true,
+    "importHelpers": true,
+    "allowJs": false,
+    "resolveJsonModule": true,
+    "allowSyntheticDefaultImports": true,
+    "forceConsistentCasingInFileNames": true,
+    "downlevelIteration": true,
+    "strict": true,
+    "esModuleInterop": true,
+    "preserveSymlinks": true,
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "noEmit": false,
+    "noEmitOnError": true,
+    "noImplicitAny": false,
+    "noImplicitReturns": false,
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "preserveConstEnums": true,
+    "removeComments": false,
+    "skipLibCheck": true,
+    "strictNullChecks": true,
+    "target": "ES2020",
+    "types": ["node", "react", "vite/client", "@testing-library/jest-dom/vitest"],
+    "lib": ["DOM", "DOM.Iterable", "ESNext"]
+  },
+  "typeAcquisition": {
+    "enable": true
+  }
+}

package/tsconfig/build.json

@@ -0,0 +1,24 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "display": "Build configuration for multiplatform.one packages",
+  "extends": "./base.json",
+  "compilerOptions": {
+    "outDir": "./dist",
+    "declarationDir": "./types",
+    "tsBuildInfoFile": "./dist/.tsbuildinfo"
+  },
+  "include": ["**/*"],
+  "exclude": [
+    "tests",
+    "types",
+    "dist",
+    "**/*.spec.ts",
+    "**/*.spec.tsx",
+    "**/*.test.ts",
+    "**/*.test.tsx",
+    "**/*.stories.ts",
+    "**/*.stories.tsx",
+    "vitest.config.ts",
+    "vitest.config.mjs"
+  ]
+}

package/tsconfig/tamagui_fix.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Type augmentation for Tamagui v2 RC children type issue.
+ *
+ * Tamagui v2 RC 11 component types resolve to a structure where `children`
+ * is omitted from the JSX element props, causing thousands of type errors like:
+ *   Type '{ children: Element[]; }' is not assignable to type 'WithShorthands<...>'
+ *
+ * This augmentation fixes the issue by extending the base prop types to accept
+ * children. Remove once Tamagui v2 stable resolves this.
+ */
+
+import type { ReactNode } from "react";
+
+declare module "@tamagui/web" {
+  interface TamaguiComponentPropsBaseBase {
+    children?: ReactNode;
+  }
+}
+
+declare module "@tamagui/core" {
+  interface TamaguiComponentPropsBaseBase {
+    children?: ReactNode;
+  }
+}
+
+// Re-export from tamagui/web which is an internal entry point without type declarations
+declare module "tamagui/web" {
+  export * from "@tamagui/web";
+}