@bleedingdev/modern-js-ultramodern-sandpack-profile 3.8.3-ultramodern.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021-present Modern.js
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/cjs/index.cjs

@@ -0,0 +1,261 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, getters, values)=>{
+        var define = (defs, kind)=>{
+            for(var key in defs)if (__webpack_require__.o(defs, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+                enumerable: true,
+                [kind]: defs[key]
+            });
+        };
+        define(getters, "get");
+        define(values, "value");
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+const packageJson = `${JSON.stringify({
+    name: 'ultramodern-sandpack-app',
+    version: '0.1.0',
+    private: true,
+    type: 'module',
+    packageManager: 'pnpm@11.24.0',
+    scripts: {
+        dev: 'modern dev',
+        start: 'modern dev --host 0.0.0.0',
+        build: 'modern build'
+    },
+    engines: {
+        node: '>=26.7.0',
+        pnpm: '>=11.24.0'
+    },
+    dependencies: {
+        '@modern-js/plugin-i18n': 'npm:@bleedingdev/modern-js-plugin-i18n@latest',
+        '@modern-js/plugin-tanstack': 'npm:@bleedingdev/modern-js-plugin-tanstack@latest',
+        '@modern-js/runtime': 'npm:@bleedingdev/modern-js-runtime@latest',
+        effect: '4.0.0-rc.112',
+        i18next: '26.3.6',
+        react: '19.2.8',
+        'react-dom': '19.2.8'
+    },
+    devDependencies: {
+        '@modern-js/app-tools': 'npm:@bleedingdev/modern-js-app-tools@latest',
+        '@modern-js/tsconfig': 'npm:@bleedingdev/modern-js-tsconfig@latest',
+        '@rsbuild/plugin-tailwindcss': '2.0.3',
+        '@types/node': '^26.2.0',
+        '@types/react': '^19.2.18',
+        '@types/react-dom': '^19.2.4',
+        tailwindcss: '4.3.3',
+        typescript: '7.0.2'
+    }
+}, null, 2)}\n`;
+const codeSandboxTasks = `${JSON.stringify({
+    $schema: 'https://codesandbox.io/schemas/tasks.json',
+    setupTasks: [
+        {
+            name: 'Installing dependencies',
+            command: 'pnpm install'
+        }
+    ],
+    tasks: {
+        start: {
+            name: 'UltraModern.js application',
+            command: 'pnpm start',
+            runAtStart: true,
+            preview: {
+                port: 8080,
+                prLink: 'direct'
+            }
+        }
+    }
+}, null, 2)}\n`;
+const modernConfig = `import { appTools, defineConfig } from '@modern-js/app-tools';
+import { i18nPlugin } from '@modern-js/plugin-i18n';
+import { tanstackRouterPlugin } from '@modern-js/plugin-tanstack';
+import { pluginTailwindcss } from '@rsbuild/plugin-tailwindcss';
+
+export default defineConfig({
+  builderPlugins: [pluginTailwindcss()],
+  output: {
+    disableTsChecker: false,
+    polyfill: 'off',
+  },
+  performance: {
+    buildCache: false,
+  },
+  plugins: [
+    appTools(),
+    tanstackRouterPlugin(),
+    i18nPlugin({
+      htmlLangAttr: true,
+      localeDetection: {
+        fallbackLanguage: 'en',
+        languages: ['en', 'cs'],
+        localePathRedirect: false,
+      },
+      reactI18next: false,
+    }),
+  ],
+  server: {
+    ssr: false,
+  },
+  source: {
+    alias: {
+      '@modern-js/plugin-i18n/runtime':
+        '@modern-js/plugin-i18n/runtime/no-react-i18next',
+    },
+  },
+});
+`;
+const runtimeConfig = `import { defineRuntimeConfig } from '@modern-js/runtime';
+import { createInstance } from 'i18next';
+
+const i18nInstance = createInstance();
+
+export default defineRuntimeConfig({
+  i18n: {
+    i18nInstance,
+    initOptions: {
+      defaultNS: 'translation',
+      fallbackLng: 'en',
+      lng: 'en',
+      resources: {
+        en: {
+          translation: {
+            language: 'Language',
+            welcome: 'Build a fast, typed UltraModern.js application.',
+          },
+        },
+        cs: {
+          translation: {
+            language: 'Jazyk',
+            welcome: 'Vytvořte rychlou a typově bezpečnou UltraModern.js aplikaci.',
+          },
+        },
+      },
+      supportedLngs: ['en', 'cs'],
+    },
+  },
+  router: {
+    framework: 'tanstack',
+  },
+});
+`;
+const layout = `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { Link, Outlet } from '@modern-js/plugin-tanstack/runtime';
+
+export default function Layout() {
+  const { changeLanguage, language, t } = useModernI18n();
+
+  return (
+    <div className="min-h-screen bg-slate-950 text-slate-100">
+      <header className="mx-auto flex max-w-4xl items-center justify-between p-6">
+        <Link className="font-semibold" prefetch="render" to="/">
+          UltraModern.js
+        </Link>
+        <label className="flex items-center gap-2 text-sm">
+          {t('language')}
+          <select
+            aria-label={t('language')}
+            className="rounded bg-slate-800 px-2 py-1"
+            onChange={event => void changeLanguage(event.currentTarget.value)}
+            value={language}
+          >
+            <option value="en">English</option>
+            <option value="cs">Čeština</option>
+          </select>
+        </label>
+      </header>
+      <Outlet />
+    </div>
+  );
+}
+`;
+const page = `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { Effect, pipe } from 'effect';
+import './index.css';
+
+export default function HomePage() {
+  const { language, t } = useModernI18n();
+  const message = Effect.runSync(
+    pipe(
+      Effect.succeed(t('welcome')),
+      Effect.map(text => \`\${text} [\${language}]\`),
+    ),
+  );
+
+  return (
+    <main className="mx-auto max-w-4xl px-6 py-20">
+      <p className="text-sm font-medium uppercase tracking-widest text-cyan-300">
+        Effect · TanStack Router · Tailwind · i18n
+      </p>
+      <h1 className="mt-4 text-5xl font-bold tracking-tight">{message}</h1>
+      <p className="mt-6 text-slate-300">
+        Edit <code>src/routes/page.tsx</code> to get started.
+      </p>
+    </main>
+  );
+}
+`;
+const ultramodernSandpackFiles = {
+    '/.browserslistrc': 'defaults\n',
+    '/.codesandbox/environment.json': '{\n  "nodeVersion": "26"\n}\n',
+    '/.codesandbox/tasks.json': codeSandboxTasks,
+    '/modern.config.ts': modernConfig,
+    '/package.json': packageJson,
+    '/src/modern-app-env.d.ts': '/// <reference types="@modern-js/app-tools/types" />\n',
+    '/src/modern.runtime.ts': runtimeConfig,
+    '/src/routes/index.css': `@import 'tailwindcss' source(none);
+@source '..';
+
+html {
+  color-scheme: dark;
+  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
+}
+
+body {
+  margin: 0;
+}
+
+* {
+  box-sizing: border-box;
+}
+`,
+    '/src/routes/layout.tsx': layout,
+    '/src/routes/page.tsx': page,
+    '/tsconfig.json': `${JSON.stringify({
+        extends: '@modern-js/tsconfig/base',
+        compilerOptions: {
+            jsx: 'react-jsx',
+            noUncheckedIndexedAccess: true,
+            strict: true
+        },
+        include: [
+            'src',
+            'modern.config.ts'
+        ]
+    }, null, 2)}\n`
+};
+__webpack_require__.d(__webpack_exports__, {}, {
+    ultramodernSandpackFiles: ultramodernSandpackFiles
+});
+exports.ultramodernSandpackFiles = __webpack_exports__.ultramodernSandpackFiles;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "ultramodernSandpackFiles"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/esm/index.js

@@ -0,0 +1,223 @@
+const packageJson = `${JSON.stringify({
+    name: 'ultramodern-sandpack-app',
+    version: '0.1.0',
+    private: true,
+    type: 'module',
+    packageManager: 'pnpm@11.24.0',
+    scripts: {
+        dev: 'modern dev',
+        start: 'modern dev --host 0.0.0.0',
+        build: 'modern build'
+    },
+    engines: {
+        node: '>=26.7.0',
+        pnpm: '>=11.24.0'
+    },
+    dependencies: {
+        '@modern-js/plugin-i18n': 'npm:@bleedingdev/modern-js-plugin-i18n@latest',
+        '@modern-js/plugin-tanstack': 'npm:@bleedingdev/modern-js-plugin-tanstack@latest',
+        '@modern-js/runtime': 'npm:@bleedingdev/modern-js-runtime@latest',
+        effect: '4.0.0-rc.112',
+        i18next: '26.3.6',
+        react: '19.2.8',
+        'react-dom': '19.2.8'
+    },
+    devDependencies: {
+        '@modern-js/app-tools': 'npm:@bleedingdev/modern-js-app-tools@latest',
+        '@modern-js/tsconfig': 'npm:@bleedingdev/modern-js-tsconfig@latest',
+        '@rsbuild/plugin-tailwindcss': '2.0.3',
+        '@types/node': '^26.2.0',
+        '@types/react': '^19.2.18',
+        '@types/react-dom': '^19.2.4',
+        tailwindcss: '4.3.3',
+        typescript: '7.0.2'
+    }
+}, null, 2)}\n`;
+const codeSandboxTasks = `${JSON.stringify({
+    $schema: 'https://codesandbox.io/schemas/tasks.json',
+    setupTasks: [
+        {
+            name: 'Installing dependencies',
+            command: 'pnpm install'
+        }
+    ],
+    tasks: {
+        start: {
+            name: 'UltraModern.js application',
+            command: 'pnpm start',
+            runAtStart: true,
+            preview: {
+                port: 8080,
+                prLink: 'direct'
+            }
+        }
+    }
+}, null, 2)}\n`;
+const modernConfig = `import { appTools, defineConfig } from '@modern-js/app-tools';
+import { i18nPlugin } from '@modern-js/plugin-i18n';
+import { tanstackRouterPlugin } from '@modern-js/plugin-tanstack';
+import { pluginTailwindcss } from '@rsbuild/plugin-tailwindcss';
+
+export default defineConfig({
+  builderPlugins: [pluginTailwindcss()],
+  output: {
+    disableTsChecker: false,
+    polyfill: 'off',
+  },
+  performance: {
+    buildCache: false,
+  },
+  plugins: [
+    appTools(),
+    tanstackRouterPlugin(),
+    i18nPlugin({
+      htmlLangAttr: true,
+      localeDetection: {
+        fallbackLanguage: 'en',
+        languages: ['en', 'cs'],
+        localePathRedirect: false,
+      },
+      reactI18next: false,
+    }),
+  ],
+  server: {
+    ssr: false,
+  },
+  source: {
+    alias: {
+      '@modern-js/plugin-i18n/runtime':
+        '@modern-js/plugin-i18n/runtime/no-react-i18next',
+    },
+  },
+});
+`;
+const runtimeConfig = `import { defineRuntimeConfig } from '@modern-js/runtime';
+import { createInstance } from 'i18next';
+
+const i18nInstance = createInstance();
+
+export default defineRuntimeConfig({
+  i18n: {
+    i18nInstance,
+    initOptions: {
+      defaultNS: 'translation',
+      fallbackLng: 'en',
+      lng: 'en',
+      resources: {
+        en: {
+          translation: {
+            language: 'Language',
+            welcome: 'Build a fast, typed UltraModern.js application.',
+          },
+        },
+        cs: {
+          translation: {
+            language: 'Jazyk',
+            welcome: 'Vytvořte rychlou a typově bezpečnou UltraModern.js aplikaci.',
+          },
+        },
+      },
+      supportedLngs: ['en', 'cs'],
+    },
+  },
+  router: {
+    framework: 'tanstack',
+  },
+});
+`;
+const layout = `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { Link, Outlet } from '@modern-js/plugin-tanstack/runtime';
+
+export default function Layout() {
+  const { changeLanguage, language, t } = useModernI18n();
+
+  return (
+    <div className="min-h-screen bg-slate-950 text-slate-100">
+      <header className="mx-auto flex max-w-4xl items-center justify-between p-6">
+        <Link className="font-semibold" prefetch="render" to="/">
+          UltraModern.js
+        </Link>
+        <label className="flex items-center gap-2 text-sm">
+          {t('language')}
+          <select
+            aria-label={t('language')}
+            className="rounded bg-slate-800 px-2 py-1"
+            onChange={event => void changeLanguage(event.currentTarget.value)}
+            value={language}
+          >
+            <option value="en">English</option>
+            <option value="cs">Čeština</option>
+          </select>
+        </label>
+      </header>
+      <Outlet />
+    </div>
+  );
+}
+`;
+const page = `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { Effect, pipe } from 'effect';
+import './index.css';
+
+export default function HomePage() {
+  const { language, t } = useModernI18n();
+  const message = Effect.runSync(
+    pipe(
+      Effect.succeed(t('welcome')),
+      Effect.map(text => \`\${text} [\${language}]\`),
+    ),
+  );
+
+  return (
+    <main className="mx-auto max-w-4xl px-6 py-20">
+      <p className="text-sm font-medium uppercase tracking-widest text-cyan-300">
+        Effect · TanStack Router · Tailwind · i18n
+      </p>
+      <h1 className="mt-4 text-5xl font-bold tracking-tight">{message}</h1>
+      <p className="mt-6 text-slate-300">
+        Edit <code>src/routes/page.tsx</code> to get started.
+      </p>
+    </main>
+  );
+}
+`;
+const ultramodernSandpackFiles = {
+    '/.browserslistrc': 'defaults\n',
+    '/.codesandbox/environment.json': '{\n  "nodeVersion": "26"\n}\n',
+    '/.codesandbox/tasks.json': codeSandboxTasks,
+    '/modern.config.ts': modernConfig,
+    '/package.json': packageJson,
+    '/src/modern-app-env.d.ts': '/// <reference types="@modern-js/app-tools/types" />\n',
+    '/src/modern.runtime.ts': runtimeConfig,
+    '/src/routes/index.css': `@import 'tailwindcss' source(none);
+@source '..';
+
+html {
+  color-scheme: dark;
+  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
+}
+
+body {
+  margin: 0;
+}
+
+* {
+  box-sizing: border-box;
+}
+`,
+    '/src/routes/layout.tsx': layout,
+    '/src/routes/page.tsx': page,
+    '/tsconfig.json': `${JSON.stringify({
+        extends: '@modern-js/tsconfig/base',
+        compilerOptions: {
+            jsx: 'react-jsx',
+            noUncheckedIndexedAccess: true,
+            strict: true
+        },
+        include: [
+            'src',
+            'modern.config.ts'
+        ]
+    }, null, 2)}\n`
+};
+export { ultramodernSandpackFiles };

package/dist/esm-node/index.js

@@ -0,0 +1,224 @@
+import "node:module";
+const packageJson = `${JSON.stringify({
+    name: 'ultramodern-sandpack-app',
+    version: '0.1.0',
+    private: true,
+    type: 'module',
+    packageManager: 'pnpm@11.24.0',
+    scripts: {
+        dev: 'modern dev',
+        start: 'modern dev --host 0.0.0.0',
+        build: 'modern build'
+    },
+    engines: {
+        node: '>=26.7.0',
+        pnpm: '>=11.24.0'
+    },
+    dependencies: {
+        '@modern-js/plugin-i18n': 'npm:@bleedingdev/modern-js-plugin-i18n@latest',
+        '@modern-js/plugin-tanstack': 'npm:@bleedingdev/modern-js-plugin-tanstack@latest',
+        '@modern-js/runtime': 'npm:@bleedingdev/modern-js-runtime@latest',
+        effect: '4.0.0-rc.112',
+        i18next: '26.3.6',
+        react: '19.2.8',
+        'react-dom': '19.2.8'
+    },
+    devDependencies: {
+        '@modern-js/app-tools': 'npm:@bleedingdev/modern-js-app-tools@latest',
+        '@modern-js/tsconfig': 'npm:@bleedingdev/modern-js-tsconfig@latest',
+        '@rsbuild/plugin-tailwindcss': '2.0.3',
+        '@types/node': '^26.2.0',
+        '@types/react': '^19.2.18',
+        '@types/react-dom': '^19.2.4',
+        tailwindcss: '4.3.3',
+        typescript: '7.0.2'
+    }
+}, null, 2)}\n`;
+const codeSandboxTasks = `${JSON.stringify({
+    $schema: 'https://codesandbox.io/schemas/tasks.json',
+    setupTasks: [
+        {
+            name: 'Installing dependencies',
+            command: 'pnpm install'
+        }
+    ],
+    tasks: {
+        start: {
+            name: 'UltraModern.js application',
+            command: 'pnpm start',
+            runAtStart: true,
+            preview: {
+                port: 8080,
+                prLink: 'direct'
+            }
+        }
+    }
+}, null, 2)}\n`;
+const modernConfig = `import { appTools, defineConfig } from '@modern-js/app-tools';
+import { i18nPlugin } from '@modern-js/plugin-i18n';
+import { tanstackRouterPlugin } from '@modern-js/plugin-tanstack';
+import { pluginTailwindcss } from '@rsbuild/plugin-tailwindcss';
+
+export default defineConfig({
+  builderPlugins: [pluginTailwindcss()],
+  output: {
+    disableTsChecker: false,
+    polyfill: 'off',
+  },
+  performance: {
+    buildCache: false,
+  },
+  plugins: [
+    appTools(),
+    tanstackRouterPlugin(),
+    i18nPlugin({
+      htmlLangAttr: true,
+      localeDetection: {
+        fallbackLanguage: 'en',
+        languages: ['en', 'cs'],
+        localePathRedirect: false,
+      },
+      reactI18next: false,
+    }),
+  ],
+  server: {
+    ssr: false,
+  },
+  source: {
+    alias: {
+      '@modern-js/plugin-i18n/runtime':
+        '@modern-js/plugin-i18n/runtime/no-react-i18next',
+    },
+  },
+});
+`;
+const runtimeConfig = `import { defineRuntimeConfig } from '@modern-js/runtime';
+import { createInstance } from 'i18next';
+
+const i18nInstance = createInstance();
+
+export default defineRuntimeConfig({
+  i18n: {
+    i18nInstance,
+    initOptions: {
+      defaultNS: 'translation',
+      fallbackLng: 'en',
+      lng: 'en',
+      resources: {
+        en: {
+          translation: {
+            language: 'Language',
+            welcome: 'Build a fast, typed UltraModern.js application.',
+          },
+        },
+        cs: {
+          translation: {
+            language: 'Jazyk',
+            welcome: 'Vytvořte rychlou a typově bezpečnou UltraModern.js aplikaci.',
+          },
+        },
+      },
+      supportedLngs: ['en', 'cs'],
+    },
+  },
+  router: {
+    framework: 'tanstack',
+  },
+});
+`;
+const layout = `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { Link, Outlet } from '@modern-js/plugin-tanstack/runtime';
+
+export default function Layout() {
+  const { changeLanguage, language, t } = useModernI18n();
+
+  return (
+    <div className="min-h-screen bg-slate-950 text-slate-100">
+      <header className="mx-auto flex max-w-4xl items-center justify-between p-6">
+        <Link className="font-semibold" prefetch="render" to="/">
+          UltraModern.js
+        </Link>
+        <label className="flex items-center gap-2 text-sm">
+          {t('language')}
+          <select
+            aria-label={t('language')}
+            className="rounded bg-slate-800 px-2 py-1"
+            onChange={event => void changeLanguage(event.currentTarget.value)}
+            value={language}
+          >
+            <option value="en">English</option>
+            <option value="cs">Čeština</option>
+          </select>
+        </label>
+      </header>
+      <Outlet />
+    </div>
+  );
+}
+`;
+const page = `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { Effect, pipe } from 'effect';
+import './index.css';
+
+export default function HomePage() {
+  const { language, t } = useModernI18n();
+  const message = Effect.runSync(
+    pipe(
+      Effect.succeed(t('welcome')),
+      Effect.map(text => \`\${text} [\${language}]\`),
+    ),
+  );
+
+  return (
+    <main className="mx-auto max-w-4xl px-6 py-20">
+      <p className="text-sm font-medium uppercase tracking-widest text-cyan-300">
+        Effect · TanStack Router · Tailwind · i18n
+      </p>
+      <h1 className="mt-4 text-5xl font-bold tracking-tight">{message}</h1>
+      <p className="mt-6 text-slate-300">
+        Edit <code>src/routes/page.tsx</code> to get started.
+      </p>
+    </main>
+  );
+}
+`;
+const ultramodernSandpackFiles = {
+    '/.browserslistrc': 'defaults\n',
+    '/.codesandbox/environment.json': '{\n  "nodeVersion": "26"\n}\n',
+    '/.codesandbox/tasks.json': codeSandboxTasks,
+    '/modern.config.ts': modernConfig,
+    '/package.json': packageJson,
+    '/src/modern-app-env.d.ts': '/// <reference types="@modern-js/app-tools/types" />\n',
+    '/src/modern.runtime.ts': runtimeConfig,
+    '/src/routes/index.css': `@import 'tailwindcss' source(none);
+@source '..';
+
+html {
+  color-scheme: dark;
+  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
+}
+
+body {
+  margin: 0;
+}
+
+* {
+  box-sizing: border-box;
+}
+`,
+    '/src/routes/layout.tsx': layout,
+    '/src/routes/page.tsx': page,
+    '/tsconfig.json': `${JSON.stringify({
+        extends: '@modern-js/tsconfig/base',
+        compilerOptions: {
+            jsx: 'react-jsx',
+            noUncheckedIndexedAccess: true,
+            strict: true
+        },
+        include: [
+            'src',
+            'modern.config.ts'
+        ]
+    }, null, 2)}\n`
+};
+export { ultramodernSandpackFiles };

package/dist/types/index.d.ts

@@ -0,0 +1,2 @@
+export type UltramodernSandpackFiles = Readonly<Record<`/${string}`, string>>;
+export declare const ultramodernSandpackFiles: UltramodernSandpackFiles;

package/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@bleedingdev/modern-js-ultramodern-sandpack-profile",
+  "description": "Fork-owned executable Sandpack profile for UltraModern.js applications.",
+  "homepage": "https://github.com/BleedingDev/ultramodern.js#readme",
+  "bugs": {
+    "url": "https://github.com/BleedingDev/ultramodern.js/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/BleedingDev/ultramodern.js.git",
+    "directory": "packages/toolkit/ultramodern-sandpack-profile"
+  },
+  "license": "MIT",
+  "version": "3.8.3-ultramodern.2",
+  "type": "module",
+  "types": "./dist/types/index.d.ts",
+  "main": "./dist/esm/index.js",
+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.js",
+      "default": "./dist/esm/index.js"
+    }
+  },
+  "typesVersions": {
+    "*": {
+      ".": [
+        "./dist/types/index.d.ts",
+        "./src/index.ts"
+      ]
+    }
+  },
+  "engines": {
+    "node": ">=26.7.0"
+  },
+  "devDependencies": {
+    "@rslib/core": "0.23.2",
+    "@types/node": "^26.2.0",
+    "@typescript/native-preview": "7.0.0-dev.20260707.2"
+  },
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "rslib build",
+    "dev": "rslib build --watch",
+    "test": "node --experimental-strip-types --test tests/*.test.ts",
+    "test:build-smoke": "node --experimental-strip-types --test tests/*.smoke.ts"
+  }
+}

package/rslib.config.mts

@@ -0,0 +1,4 @@
+import { rslibConfig } from '@modern-js/rslib';
+import { defineConfig } from '@rslib/core';
+
+export default defineConfig(rslibConfig);

package/src/index.ts

@@ -0,0 +1,241 @@
+export type UltramodernSandpackFiles = Readonly<Record<`/${string}`, string>>;
+
+const packageJson = `${JSON.stringify(
+  {
+    name: 'ultramodern-sandpack-app',
+    version: '0.1.0',
+    private: true,
+    type: 'module',
+    packageManager: 'pnpm@11.24.0',
+    scripts: {
+      dev: 'modern dev',
+      start: 'modern dev --host 0.0.0.0',
+      build: 'modern build',
+    },
+    engines: {
+      node: '>=26.7.0',
+      pnpm: '>=11.24.0',
+    },
+    dependencies: {
+      '@modern-js/plugin-i18n': 'npm:@bleedingdev/modern-js-plugin-i18n@latest',
+      '@modern-js/plugin-tanstack':
+        'npm:@bleedingdev/modern-js-plugin-tanstack@latest',
+      '@modern-js/runtime': 'npm:@bleedingdev/modern-js-runtime@latest',
+      effect: '4.0.0-rc.112',
+      i18next: '26.3.6',
+      react: '19.2.8',
+      'react-dom': '19.2.8',
+    },
+    devDependencies: {
+      '@modern-js/app-tools': 'npm:@bleedingdev/modern-js-app-tools@latest',
+      '@modern-js/tsconfig': 'npm:@bleedingdev/modern-js-tsconfig@latest',
+      '@rsbuild/plugin-tailwindcss': '2.0.3',
+      '@types/node': '^26.2.0',
+      '@types/react': '^19.2.18',
+      '@types/react-dom': '^19.2.4',
+      tailwindcss: '4.3.3',
+      typescript: '7.0.2',
+    },
+  },
+  null,
+  2,
+)}\n`;
+
+const codeSandboxTasks = `${JSON.stringify(
+  {
+    $schema: 'https://codesandbox.io/schemas/tasks.json',
+    setupTasks: [
+      {
+        name: 'Installing dependencies',
+        command: 'pnpm install',
+      },
+    ],
+    tasks: {
+      start: {
+        name: 'UltraModern.js application',
+        command: 'pnpm start',
+        runAtStart: true,
+        preview: {
+          port: 8080,
+          prLink: 'direct',
+        },
+      },
+    },
+  },
+  null,
+  2,
+)}\n`;
+
+const modernConfig = `import { appTools, defineConfig } from '@modern-js/app-tools';
+import { i18nPlugin } from '@modern-js/plugin-i18n';
+import { tanstackRouterPlugin } from '@modern-js/plugin-tanstack';
+import { pluginTailwindcss } from '@rsbuild/plugin-tailwindcss';
+
+export default defineConfig({
+  builderPlugins: [pluginTailwindcss()],
+  output: {
+    disableTsChecker: false,
+    polyfill: 'off',
+  },
+  performance: {
+    buildCache: false,
+  },
+  plugins: [
+    appTools(),
+    tanstackRouterPlugin(),
+    i18nPlugin({
+      htmlLangAttr: true,
+      localeDetection: {
+        fallbackLanguage: 'en',
+        languages: ['en', 'cs'],
+        localePathRedirect: false,
+      },
+      reactI18next: false,
+    }),
+  ],
+  server: {
+    ssr: false,
+  },
+  source: {
+    alias: {
+      '@modern-js/plugin-i18n/runtime':
+        '@modern-js/plugin-i18n/runtime/no-react-i18next',
+    },
+  },
+});
+`;
+
+const runtimeConfig = `import { defineRuntimeConfig } from '@modern-js/runtime';
+import { createInstance } from 'i18next';
+
+const i18nInstance = createInstance();
+
+export default defineRuntimeConfig({
+  i18n: {
+    i18nInstance,
+    initOptions: {
+      defaultNS: 'translation',
+      fallbackLng: 'en',
+      lng: 'en',
+      resources: {
+        en: {
+          translation: {
+            language: 'Language',
+            welcome: 'Build a fast, typed UltraModern.js application.',
+          },
+        },
+        cs: {
+          translation: {
+            language: 'Jazyk',
+            welcome: 'Vytvořte rychlou a typově bezpečnou UltraModern.js aplikaci.',
+          },
+        },
+      },
+      supportedLngs: ['en', 'cs'],
+    },
+  },
+  router: {
+    framework: 'tanstack',
+  },
+});
+`;
+
+const layout = `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { Link, Outlet } from '@modern-js/plugin-tanstack/runtime';
+
+export default function Layout() {
+  const { changeLanguage, language, t } = useModernI18n();
+
+  return (
+    <div className="min-h-screen bg-slate-950 text-slate-100">
+      <header className="mx-auto flex max-w-4xl items-center justify-between p-6">
+        <Link className="font-semibold" prefetch="render" to="/">
+          UltraModern.js
+        </Link>
+        <label className="flex items-center gap-2 text-sm">
+          {t('language')}
+          <select
+            aria-label={t('language')}
+            className="rounded bg-slate-800 px-2 py-1"
+            onChange={event => void changeLanguage(event.currentTarget.value)}
+            value={language}
+          >
+            <option value="en">English</option>
+            <option value="cs">Čeština</option>
+          </select>
+        </label>
+      </header>
+      <Outlet />
+    </div>
+  );
+}
+`;
+
+const page = `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { Effect, pipe } from 'effect';
+import './index.css';
+
+export default function HomePage() {
+  const { language, t } = useModernI18n();
+  const message = Effect.runSync(
+    pipe(
+      Effect.succeed(t('welcome')),
+      Effect.map(text => \`\${text} [\${language}]\`),
+    ),
+  );
+
+  return (
+    <main className="mx-auto max-w-4xl px-6 py-20">
+      <p className="text-sm font-medium uppercase tracking-widest text-cyan-300">
+        Effect · TanStack Router · Tailwind · i18n
+      </p>
+      <h1 className="mt-4 text-5xl font-bold tracking-tight">{message}</h1>
+      <p className="mt-6 text-slate-300">
+        Edit <code>src/routes/page.tsx</code> to get started.
+      </p>
+    </main>
+  );
+}
+`;
+
+export const ultramodernSandpackFiles: UltramodernSandpackFiles = {
+  '/.browserslistrc': 'defaults\n',
+  '/.codesandbox/environment.json': '{\n  "nodeVersion": "26"\n}\n',
+  '/.codesandbox/tasks.json': codeSandboxTasks,
+  '/modern.config.ts': modernConfig,
+  '/package.json': packageJson,
+  '/src/modern-app-env.d.ts':
+    '/// <reference types="@modern-js/app-tools/types" />\n',
+  '/src/modern.runtime.ts': runtimeConfig,
+  '/src/routes/index.css': `@import 'tailwindcss' source(none);
+@source '..';
+
+html {
+  color-scheme: dark;
+  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
+}
+
+body {
+  margin: 0;
+}
+
+* {
+  box-sizing: border-box;
+}
+`,
+  '/src/routes/layout.tsx': layout,
+  '/src/routes/page.tsx': page,
+  '/tsconfig.json': `${JSON.stringify(
+    {
+      extends: '@modern-js/tsconfig/base',
+      compilerOptions: {
+        jsx: 'react-jsx',
+        noUncheckedIndexedAccess: true,
+        strict: true,
+      },
+      include: ['src', 'modern.config.ts'],
+    },
+    null,
+    2,
+  )}\n`,
+};

package/tests/profile-build.smoke.ts

@@ -0,0 +1,99 @@
+import assert from 'node:assert/strict';
+import { spawnSync } from 'node:child_process';
+import {
+  lstat,
+  mkdir,
+  mkdtemp,
+  readdir,
+  readFile,
+  rm,
+  symlink,
+  writeFile,
+} from 'node:fs/promises';
+import os from 'node:os';
+import path from 'node:path';
+import { after, test } from 'node:test';
+import { ultramodernSandpackFiles } from '../src/index.ts';
+
+const fixtureRoots: string[] = [];
+const repositoryRoot = path.resolve(import.meta.dirname, '../../../..');
+
+async function listFiles(root: string, directory = root): Promise<string[]> {
+  const entries = await readdir(directory, { withFileTypes: true });
+  const files = await Promise.all(
+    entries.map(async entry => {
+      const absolutePath = path.join(directory, entry.name);
+      return entry.isDirectory()
+        ? listFiles(root, absolutePath)
+        : [path.relative(root, absolutePath)];
+    }),
+  );
+  return files.flat();
+}
+
+async function materializeBuildFixture() {
+  const root = await mkdtemp(
+    path.join(os.tmpdir(), 'ultramodern-sandpack-build-'),
+  );
+  fixtureRoots.push(root);
+
+  for (const [relativePath, source] of Object.entries(
+    ultramodernSandpackFiles,
+  )) {
+    const outputPath = path.join(root, relativePath.replace(/^\//u, ''));
+    await mkdir(path.dirname(outputPath), { recursive: true });
+    await writeFile(outputPath, source, 'utf8');
+  }
+
+  await symlink(
+    path.join(repositoryRoot, 'node_modules'),
+    path.join(root, 'node_modules'),
+  );
+  return root;
+}
+
+after(async () => {
+  await Promise.all(
+    fixtureRoots.map(root => rm(root, { force: true, recursive: true })),
+  );
+});
+
+test('the materialized profile builds through the real Modern.js CLI', async () => {
+  const fixtureRoot = await materializeBuildFixture();
+  const modernCli = path.join(
+    repositoryRoot,
+    'packages/solutions/app-tools/bin/modern.js',
+  );
+  const cliMetadata = await lstat(modernCli);
+  assert.equal(cliMetadata.isFile(), true);
+
+  const result = spawnSync(process.execPath, [modernCli, 'build'], {
+    cwd: fixtureRoot,
+    encoding: 'utf8',
+    env: {
+      ...process.env,
+      FORCE_COLOR: '0',
+      NO_COLOR: '1',
+    },
+    timeout: 180_000,
+  });
+
+  assert.equal(
+    result.status,
+    0,
+    `modern build failed\nstdout:\n${result.stdout}\nstderr:\n${result.stderr}`,
+  );
+
+  const distRoot = path.join(fixtureRoot, 'dist');
+  const emittedFiles = await listFiles(distRoot);
+  const htmlPath = emittedFiles.find(file => file.endsWith('.html'));
+  assert.ok(htmlPath, `build emitted no HTML: ${emittedFiles.join(', ')}`);
+  assert.ok(
+    emittedFiles.some(file => /\.(?:js|mjs)$/u.test(file)),
+    `build emitted no JavaScript: ${emittedFiles.join(', ')}`,
+  );
+
+  const html = await readFile(path.join(distRoot, htmlPath), 'utf8');
+  assert.match(html, /<script\b/u);
+  assert.match(html, /<html\b[^>]*\blang=/u);
+});

package/tests/profile.test.ts

@@ -0,0 +1,106 @@
+import assert from 'node:assert/strict';
+import { mkdir, mkdtemp, readFile, rm, writeFile } from 'node:fs/promises';
+import os from 'node:os';
+import path from 'node:path';
+import { after, test } from 'node:test';
+import { ultramodernSandpackFiles } from '../src/index.ts';
+
+const materializedRoots: string[] = [];
+
+async function materializeProfile() {
+  const root = await mkdtemp(
+    path.join(os.tmpdir(), 'ultramodern-sandpack-profile-'),
+  );
+  materializedRoots.push(root);
+
+  for (const [relativePath, source] of Object.entries(
+    ultramodernSandpackFiles,
+  )) {
+    const outputPath = path.join(root, relativePath.replace(/^\//u, ''));
+    await mkdir(path.dirname(outputPath), { recursive: true });
+    await writeFile(outputPath, source, 'utf8');
+  }
+
+  return root;
+}
+
+after(async () => {
+  await Promise.all(
+    materializedRoots.map(root => rm(root, { force: true, recursive: true })),
+  );
+});
+
+test('materializes an executable UltraModern single-app profile', async () => {
+  const root = await materializeProfile();
+  const manifest = JSON.parse(
+    await readFile(path.join(root, 'package.json'), 'utf8'),
+  );
+  const tasks = JSON.parse(
+    await readFile(path.join(root, '.codesandbox/tasks.json'), 'utf8'),
+  );
+  const environment = JSON.parse(
+    await readFile(path.join(root, '.codesandbox/environment.json'), 'utf8'),
+  );
+
+  assert.equal(manifest.engines.node, '>=26.7.0');
+  assert.equal(manifest.packageManager, 'pnpm@11.24.0');
+  assert.equal(manifest.scripts.start, 'modern dev --host 0.0.0.0');
+  assert.equal(manifest.scripts.build, 'modern build');
+  assert.equal(tasks.tasks.start.command, 'pnpm start');
+  assert.equal(environment.nodeVersion, '26');
+
+  for (const packageName of [
+    '@modern-js/app-tools',
+    '@modern-js/plugin-i18n',
+    '@modern-js/plugin-tanstack',
+    '@modern-js/runtime',
+  ]) {
+    const selector =
+      manifest.dependencies?.[packageName] ??
+      manifest.devDependencies?.[packageName];
+    assert.match(
+      selector,
+      new RegExp(
+        `^npm:@bleedingdev/modern-js-${packageName.split('/').at(-1)}@`,
+        'u',
+      ),
+    );
+  }
+
+  assert.equal(manifest.dependencies.effect, '4.0.0-rc.112');
+  assert.equal(manifest.dependencies.i18next, '26.3.6');
+  assert.equal(manifest.devDependencies.tailwindcss, '4.3.3');
+  assert.equal(
+    manifest.devDependencies['@rsbuild/plugin-tailwindcss'],
+    '2.0.3',
+  );
+});
+
+test('declares every UltraModern capability in executable entrypoints', async () => {
+  const root = await materializeProfile();
+  const config = await readFile(path.join(root, 'modern.config.ts'), 'utf8');
+  const runtime = await readFile(
+    path.join(root, 'src/modern.runtime.ts'),
+    'utf8',
+  );
+  const layout = await readFile(
+    path.join(root, 'src/routes/layout.tsx'),
+    'utf8',
+  );
+  const page = await readFile(path.join(root, 'src/routes/page.tsx'), 'utf8');
+  const styles = await readFile(
+    path.join(root, 'src/routes/index.css'),
+    'utf8',
+  );
+
+  assert.match(config, /tanstackRouterPlugin\(\)/u);
+  assert.match(config, /i18nPlugin\(/u);
+  assert.match(config, /pluginTailwindcss\(\)/u);
+  assert.match(runtime, /framework: 'tanstack'/u);
+  assert.match(runtime, /supportedLngs: \['en', 'cs'\]/u);
+  assert.match(layout, /@modern-js\/plugin-tanstack\/runtime/u);
+  assert.match(layout, /prefetch="render"/u);
+  assert.match(page, /Effect\.runSync/u);
+  assert.match(page, /useModernI18n/u);
+  assert.match(styles, /@import 'tailwindcss'/u);
+});

package/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "@modern-js/tsconfig/base",
+  "compilerOptions": {
+    "declaration": false,
+    "paths": {},
+    "rootDir": "./src"
+  },
+  "include": ["src"]
+}