Try to build sdk-components-react with vite

packages/sdk-components-react/package.json

@@ -35,7 +35,7 @@
     }
   },
   "scripts": {
-    "build": "rm -rf lib && esbuild src/components.ts src/metas.ts src/props.ts --outdir=lib --bundle --format=esm --packages=external",
+    "build": "vite build --config ../../vite.sdk-components.config.ts",
     "build:args": "NODE_OPTIONS=--conditions=webstudio generate-arg-types './src/*.tsx !./src/*.stories.tsx !./src/*.test.{ts,tsx} !./src/*.ws.ts' && prettier --write \"**/*.props.ts\"",
     "dts": "tsc --project tsconfig.dts.json",
     "test": "vitest run",
@@ -63,6 +63,7 @@
     "react": "18.3.0-canary-14898b6a9-20240318",
     "react-dom": "18.3.0-canary-14898b6a9-20240318",
     "typescript": "5.6.3",
+    "vite": "^5.4.10",
     "vitest": "^2.1.4"
   }
 }

vite.sdk-components.config.ts

@@ -0,0 +1,30 @@
+import { defineConfig } from "vite";
+
+const isBareImport = (id: string) =>
+  id.startsWith("@") || id.includes(".") === false;
+
+export default defineConfig({
+  // resolve only webstudio condition in tests
+  resolve: {
+    conditions: ["webstudio"],
+  },
+  build: {
+    lib: {
+      entry: [
+        "src/components.ts",
+        "src/metas.ts",
+        "src/props.ts",
+        "src/hooks.ts",
+      ],
+      formats: ["es"],
+    },
+    rollupOptions: {
+      external: isBareImport,
+      output: {
+        preserveModules: true,
+        preserveModulesRoot: "src",
+        dir: "lib",
+      },
+    },
+  },
+});