create-oc 1.1.29 → 1.1.31

package/index.js

@@ -16,6 +16,31 @@ function checkNodeVersion() {
   }
 }
 
+function createOcJson(cwd, importmap) {
+  let oc = {};
+  try {
+    oc = fs.readFileSync(path.join(cwd, 'oc.json'), 'utf-8');
+  } catch {}
+
+  if (!oc.$schema) {
+    oc.$schema = 'https://opencomponents.github.io/schema.json';
+  }
+  oc.importmap = oc.importmap?.imports
+    ? {
+        imports: {
+          ...oc.importmap.imports,
+          ...importmap,
+        },
+      }
+    : importmap;
+
+  fs.writeFileSync(
+    path.join(cwd, 'oc.json'),
+    JSON.stringify(oc, null, 2),
+    'utf-8'
+  );
+}
+
 checkNodeVersion();
 
 const templateChoices = [
@@ -132,6 +157,30 @@ replaceJson(`./${componentName}/package.json`, (pkg) => ({
   },
 }));
 
+const imports = (() => {
+  switch (template) {
+    case 'esm.react':
+      return {
+        react: 'https://esm.sh/react@19.1.0',
+        'react-dom': 'https://esm.sh/react-dom@19.1.0',
+        'react-dom/': 'https://esm.sh/react-dom@19.1.0/',
+      };
+    case 'esm.remix':
+      return {
+        '@remix-run/dom':
+          'https://esm.sh/@remix-run/dom@0.0.0-experimental-remix-jam.6',
+        '@remix-run/events':
+          'https://esm.sh/@remix-run/events@0.0.0-experimental-remix-jam.5',
+        '@remix-run/events/':
+          'https://esm.sh/@remix-run/events@0.0.0-experimental-remix-jam.5/',
+      };
+    default:
+      return undefined;
+  }
+})();
+
+createOcJson(process.cwd(), imports ? { imports } : undefined);
+
 console.log('Finished. To start your oc for the first time:');
 console.log();
 console.log(`  cd ${componentName}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-oc",
-  "version": "1.1.29",
+  "version": "1.1.31",
   "type": "module",
   "description": "",
   "main": "index.js",

package/templates/elm/package.json

@@ -17,8 +17,8 @@
   },
   "dependencies": {},
   "devDependencies": {
-    "oc-server": "^3.2.0",
-    "oc-template-elm-compiler": "^2.1.2",
+    "oc-server": "^4.0.0",
+    "oc-template-elm-compiler": "^2.1.4",
     "elm": "^0.19.1-6",
     "typescript": "^5.3.3"
   }

package/templates/elm/tsconfig.json

@@ -9,7 +9,7 @@
     "strict": true,
     "forceConsistentCasingInFileNames": true,
     "module": "esnext",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true
   },

package/templates/es6/package.json

@@ -18,7 +18,7 @@
     }
   },
   "devDependencies": {
-    "oc-server": "^3.2.0",
-    "oc-template-es6-compiler": "^7.1.2"
+    "oc-server": "^4.0.0",
+    "oc-template-es6-compiler": "^7.1.4"
   }
 }

package/templates/es6/src/view.ts

@@ -1,7 +1,6 @@
-import { InitialData, serverClient } from 'oc-server';
+import { InitialData, serverClient, getSettings } from 'oc-server/client';
 import styles from './styles.css';
 import logo from '../public/logo.png';
-import { getSettings } from 'oc-server';
 
 const onRender = (cb: (element: HTMLElement) => void) => {
   const isBrowser = typeof window !== 'undefined';

package/templates/es6/tsconfig.json

@@ -10,7 +10,7 @@
     "forceConsistentCasingInFileNames": true,
     "noFallthroughCasesInSwitch": true,
     "module": "esnext",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true
   }

package/templates/esm.react/package.json

@@ -28,8 +28,8 @@
     "@types/react-dom": "^19.1.6",
     "@vitejs/plugin-react": "^4.6.0",
     "happy-dom": "^18.0.1",
-    "oc-server": "^3.2.0",
-    "oc-template-esm-compiler": "^2.0.0",
+    "oc-server": "^4.0.0",
+    "oc-template-esm-compiler": "^3.0.2",
     "react": "19.1.0",
     "react-dom": "19.1.0",
     "typescript": "5.8.3",

package/templates/esm.react/src/App.tsx

@@ -1,5 +1,9 @@
 import { useState } from 'react';
-import { serverClient, InitialData, ActionOutput } from 'oc-server';
+import {
+  serverClient,
+  type InitialData,
+  type ActionOutput,
+} from 'oc-server/client';
 import styles from './styles.module.css';
 import logo from '../public/logo.png';
 

package/templates/esm.react/src/entry.client.tsx

@@ -1,15 +1,17 @@
-import { createComponent } from "oc-template-esm-compiler/renderer";
-import { createRoot, Root } from "react-dom/client";
-import App from "./App";
+import { createComponent } from 'oc-template-esm-compiler/renderer';
+import { createRoot, Root } from 'react-dom/client';
+import App from './App';
 
-let root: Root | undefined = undefined;
+export default createComponent(() => {
+  let root: Root | undefined = undefined;
 
-export default createComponent({
-  mount(element, props) {
-    root = createRoot(element);
-    root.render(<App {...props} />);
-  },
-  unmount() {
-    root?.unmount();
-  },
+  return {
+    mount(element, props) {
+      root = createRoot(element);
+      root.render(<App {...props} />);
+    },
+    unmount() {
+      root?.unmount();
+    },
+  };
 });

package/templates/esm.react/vite.config.ts

@@ -1,24 +1,17 @@
-import { defineConfig } from "vite";
-import react from "@vitejs/plugin-react";
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
   // Add your own plugins here for thinkgs like eslint or typecheckers
   plugins: [react()],
-  resolve: {
-    alias: {
-      react: "https://esm.sh/react@19.1.0",
-      "react-dom": "https://esm.sh/react-dom@19.1.0",
-      "react-dom/": "https://esm.sh/react-dom@19.1.0/",
-    },
-  },
   build: {
     rollupOptions: {
-      external: ["react", "react-dom"],
+      external: ['react', 'react-dom'],
     },
   },
   // @ts-ignore Missing test property
   test: {
-    environment: 'jsdom'
-  }
+    environment: 'jsdom',
+  },
 });

package/templates/esm.remix/package.json

@@ -25,8 +25,8 @@
     "@remix-run/dom": "^0.0.0-experimental-remix-jam.6",
     "@remix-run/events": "^0.0.0-experimental-remix-jam.5",
     "happy-dom": "^18.0.1",
-    "oc-server": "^3.2.0",
-    "oc-template-esm-compiler": "^2.0.0",
+    "oc-server": "^4.0.0",
+    "oc-template-esm-compiler": "^3.0.2",
     "typescript": "5.8.3",
     "vitest": "^3.2.4"
   }

package/templates/esm.remix/src/App.tsx

@@ -1,4 +1,8 @@
-import { serverClient, type ActionOutput, getInitialData } from 'oc-server';
+import {
+  serverClient,
+  type ActionOutput,
+  getInitialData,
+} from 'oc-server/client';
 import type { Remix } from '@remix-run/dom';
 import { press } from '@remix-run/events/press';
 import styles from './styles.module.css';

package/templates/esm.remix/src/entry.client.tsx

@@ -2,14 +2,16 @@ import { createComponent } from 'oc-template-esm-compiler/renderer';
 import { createRoot } from '@remix-run/dom';
 import App from './App';
 
-let root: ReturnType<typeof createRoot> | undefined = undefined;
+export default createComponent(() => {
+  let root: ReturnType<typeof createRoot> | undefined = undefined;
 
-export default createComponent({
-  mount(element) {
-    root = createRoot(element as HTMLElement);
-    root.render(<App />);
-  },
-  unmount() {
-    root?.remove();
-  },
+  return {
+    mount(element) {
+      root = createRoot(element as HTMLElement);
+      root.render(<App />);
+    },
+    unmount() {
+      root?.remove();
+    },
+  };
 });

package/templates/esm.remix/vite.config.ts

@@ -2,17 +2,6 @@ import { defineConfig } from 'vite';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  // Add your own plugins here for thinkgs like eslint or typecheckers
-  resolve: {
-    alias: {
-      '@remix-run/dom':
-        'https://esm.sh/@remix-run/dom@0.0.0-experimental-remix-jam.6',
-      '@remix-run/events':
-        'https://esm.sh/@remix-run/events@0.0.0-experimental-remix-jam.5',
-      '@remix-run/events/':
-        'https://esm.sh/@remix-run/events@0.0.0-experimental-remix-jam.5/',
-    },
-  },
   build: {
     rollupOptions: {
       external: ['@remix-run/dom', '@remix-run/events'],

package/templates/preact/package.json

@@ -26,8 +26,8 @@
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.4.3",
     "jsdom": "^21.1.1",
-    "oc-server": "^3.2.0",
-    "oc-template-preact-compiler": "^3.1.2",
+    "oc-server": "^4.0.0",
+    "oc-template-preact-compiler": "^3.1.4",
     "preact": "^10.13.2",
     "typescript": "5.0.2",
     "vitest": "^0.29.7"

package/templates/preact/src/App.tsx

@@ -1,5 +1,9 @@
 import { useState } from 'preact/hooks';
-import { ActionOutput, InitialData, serverClient } from 'oc-server';
+import {
+  type ActionOutput,
+  type InitialData,
+  serverClient,
+} from 'oc-server/client';
 import styles from './styles.css';
 import logo from '../public/logo.png';
 

package/templates/preact/tsconfig.json

@@ -16,7 +16,7 @@
     // These values are required and cannot be changed by the user
     // Keep this in sync with the rollup config
     "module": "esnext",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "react-jsx",

package/templates/react/package.json

@@ -26,8 +26,8 @@
     "@testing-library/user-event": "^14.4.3",
     "@types/react": "^18.0.28",
     "jsdom": "^21.1.1",
-    "oc-server": "^3.2.0",
-    "oc-template-react-compiler": "^10.1.2",
+    "oc-server": "^4.0.0",
+    "oc-template-react-compiler": "^10.1.4",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "typescript": "5.1.3",

package/templates/react/src/App.tsx

@@ -1,5 +1,9 @@
 import { useState } from 'react';
-import { serverClient, InitialData, ActionOutput } from 'oc-server';
+import {
+  serverClient,
+  type InitialData,
+  type ActionOutput,
+} from 'oc-server/client';
 import styles from './styles.css';
 import logo from '../public/logo.png';
 

package/templates/react/tsconfig.json

@@ -16,7 +16,7 @@
     // These values are required and cannot be changed by the user
     // Keep this in sync with the rollup config
     "module": "ESNext",
-    "moduleResolution": "Node",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "react-jsx"

package/templates/solid/package.json

@@ -25,8 +25,8 @@
     "@testing-library/jest-dom": "^6.5.0",
     "@types/testing-library__jest-dom": "^5.14.5",
     "jsdom": "^21.1.1",
-    "oc-server": "^3.2.0",
-    "oc-template-solid-compiler": "^3.1.2",
+    "oc-server": "^4.0.0",
+    "oc-template-solid-compiler": "^3.1.4",
     "solid-js": "^1.9.5",
     "typescript": "5.5.4",
     "vitest": "^2.0.5"

package/templates/solid/src/App.tsx

@@ -1,5 +1,9 @@
-import { createSignal, Show, For } from 'solid-js';
-import { serverClient, InitialData, ActionOutput } from 'oc-server';
+import { createSignal, Show } from 'solid-js';
+import {
+  serverClient,
+  type InitialData,
+  type ActionOutput,
+} from 'oc-server/client';
 import styles from './styles.css';
 import logo from '../public/logo.png';
 

package/templates/solid/tsconfig.json

@@ -16,7 +16,7 @@
     // These values are required and cannot be changed by the user
     // Keep this in sync with the rollup config
     "module": "esnext",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve",

package/templates/svelte/package.json

@@ -27,8 +27,8 @@
     "@tsconfig/svelte": "^5.0.4",
     "@types/testing-library__jest-dom": "^5.14.5",
     "jsdom": "^21.1.1",
-    "oc-server": "^3.2.0",
-    "oc-template-svelte-compiler": "^2.1.2",
+    "oc-server": "^4.0.0",
+    "oc-template-svelte-compiler": "^2.1.4",
     "svelte": "^5.23.0",
     "svelte-check": "^4.0.0",
     "typescript": "5.0.2",

package/templates/svelte/src/App.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import logo from '../public/logo.png';
-  import { type InitialData, serverClient } from 'oc-server';
+  import { type InitialData, serverClient } from 'oc-server/client';
 
   let funFact: string | null = $state(null);
   let { born, firstName, hobbies, lastName }: InitialData = $props();

package/templates/vue/package.json

@@ -27,8 +27,8 @@
     "@vitejs/plugin-vue": "^5.2.1",
     "@vue/tsconfig": "^0.7.0",
     "jsdom": "^21.1.1",
-    "oc-server": "^3.2.0",
-    "oc-template-vue-compiler": "^3.1.2",
+    "oc-server": "^4.0.0",
+    "oc-template-vue-compiler": "^3.1.4",
     "typescript": "5.8.2",
     "vitest": "^0.29.7",
     "vue": "^3.5.13",

package/templates/vue/tsconfig.json

@@ -16,7 +16,7 @@
     // These values are required and cannot be changed by the user
     // Keep this in sync with the rollup config
     "module": "esnext",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve"