@modern-js/sandpack-react 2.69.4 → 3.0.0-alpha.0

package/dist/esm/templates/mwa.js

@@ -1,113 +0,0 @@
-import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
-import { commonFiles } from "./common";
-var MWAFiles = _object_spread({}, commonFiles, {
-  "README.md": "# Modern.js App\n\n## Setup\n\nInstall the dependencies:\n\n```bash\npnpm install\n```\n\n## Get Started\n\nStart the dev server:\n\n```bash\npnpm dev\n```\n\nEnable optional features or add a new entry:\n\n```bash\npnpm new\n```\n\nBuild the app for production:\n\n```bash\npnpm build\n```\n\nPreview the production build locally:\n\n```bash\npnpm serve\n```\n\nFor more information, see the [Modern.js documentation](https://modernjs.dev/en).\n",
-  ".browserslistrc": "chrome >= 51\nedge >= 15\nfirefox >= 54\nsafari >= 10\nios_saf >= 10\n",
-  "package.json": '{\n  "name": "modern-app",\n  "version": "0.1.0",\n  "scripts": {\n    "reset": "npx rimraf node_modules ./**/node_modules",\n    "dev": "modern dev",\n    "build": "modern build",\n    "start": "modern start",\n    "serve": "modern serve",\n    "new": "modern new",\n    "lint": "biome check",\n    "prepare": "simple-git-hooks",\n    "upgrade": "modern upgrade"\n  },\n  "engines": {\n    "node": ">=16.18.1"\n  },\n  "lint-staged": {\n    "*.{js,ts,cjs,mjs,d.cts,d.mts,jsx,tsx,json,jsonc}": [\n      "biome check --files-ignore-unknown=true"\n    ]\n  },\n  "simple-git-hooks": {\n    "pre-commit": "npx lint-staged"\n  },\n  "dependencies": {\n    "@modern-js/runtime": "2.69.3",\n    "react": "^18.3.1",\n    "react-dom": "^18.3.1"\n  },\n  "devDependencies": {\n    "@modern-js/app-tools": "2.69.3",\n    "@modern-js/tsconfig": "2.69.3",\n    "@biomejs/biome": "1.9.4",\n    "typescript": "~5.7.3",\n    "@types/jest": "~29.2.4",\n    "@types/node": "~18.11.9",\n    "@types/react": "^18.3.11",\n    "@types/react-dom": "~18.3.1",\n    "lint-staged": "~15.4.0",\n    "simple-git-hooks": "^2.11.1",\n    "rimraf": "^6.0.1"\n  }\n}\n',
-  "modern.config.ts": "import { appTools, defineConfig } from '@modern-js/app-tools';\n\n// https://modernjs.dev/en/configure/app/usage\nexport default defineConfig({\n  runtime: {\n    router: true,\n  },\n  plugins: [\n    appTools({\n      bundler: \n    }),\n  ],\n});\n",
-  "tsconfig.json": '{\n  "extends": "@modern-js/tsconfig/base",\n  "compilerOptions": {\n    "declaration": false,\n    "jsx": "preserve",\n    "baseUrl": "./",\n    "paths": {\n      "@/*": ["./src/*"],\n      "@shared/*": ["./shared/*"]\n    }\n  },\n  "include": ["src", "shared", "config", "modern.config.ts"],\n  "exclude": ["**/node_modules"]\n}\n',
-  "src/modern-app-env.d.ts": "/// <reference types='@modern-js/app-tools/types' />\n/// <reference types='@modern-js/runtime/types' />\n/// <reference types='@modern-js/runtime/types/router' />\n",
-  "src/modern.runtime.ts": "import { defineRuntimeConfig } from '@modern-js/runtime';\n\nexport default defineRuntimeConfig({});\n",
-  "src/routes/index.css": "html,\nbody {\n  padding: 0;\n  margin: 0;\n  font-family: PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;\n  background: linear-gradient(to bottom, transparent, #fff) #eceeef;\n}\n\np {\n  margin: 0;\n}\n\n* {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  box-sizing: border-box;\n}\n\n.container-box {\n  min-height: 100vh;\n  max-width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  padding-top: 10px;\n}\n\nmain {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n}\n\n.title {\n  display: flex;\n  margin: 4rem 0 4rem;\n  align-items: center;\n  font-size: 4rem;\n  font-weight: 600;\n}\n\n.logo {\n  width: 6rem;\n  margin: 7px 0 0 1rem;\n}\n\n.name {\n  color: #4ecaff;\n}\n\n.description {\n  text-align: center;\n  line-height: 1.5;\n  font-size: 1.3rem;\n  color: #1b3a42;\n  margin-bottom: 5rem;\n}\n\n.code {\n  background: #fafafa;\n  border-radius: 12px;\n  padding: 0.6rem 0.9rem;\n  font-size: 1.05rem;\n  font-family:\n    Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,\n    Bitstream Vera Sans Mono, Courier New, monospace;\n}\n\n.container-box .grid {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 1100px;\n  margin-top: 3rem;\n}\n\n.card {\n  padding: 1.5rem;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  height: 100px;\n  color: inherit;\n  text-decoration: none;\n  transition: 0.15s ease;\n  width: 45%;\n}\n\n.card:hover,\n.card:focus {\n  transform: scale(1.05);\n}\n\n.card h2 {\n  display: flex;\n  align-items: center;\n  font-size: 1.5rem;\n  margin: 0;\n  padding: 0;\n}\n\n.card p {\n  opacity: 0.6;\n  font-size: 0.9rem;\n  line-height: 1.5;\n  margin-top: 1rem;\n}\n\n.arrow-right {\n  width: 1.3rem;\n  margin-left: 0.5rem;\n  margin-top: 3px;\n}\n",
-  "src/routes/layout.tsx": "import { Outlet } from '@modern-js/runtime/router';\n\nexport default function Layout() {\n  return (\n    <div>\n      <Outlet />\n    </div>\n  );\n}\n",
-  "src/routes/page.tsx": `import { Helmet } from '@modern-js/runtime/head';
-import './index.css';
-
-const Index = () => (
-  <div className="container-box">
-    <Helmet>
-      <link
-        rel="icon"
-        type="image/x-icon"
-        href="https://lf3-static.bytednsdoc.com/obj/eden-cn/uhbfnupenuhf/favicon.ico"
-      />
-    </Helmet>
-    <main>
-      <div className="title">
-        Welcome to
-        <img
-          className="logo"
-          src="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/modern-js-logo.svg"
-          alt="Modern.js Logo"
-        />
-        <p className="name">Modern.js</p>
-      </div>
-      <p className="description">
-        Get started by editing <code className="code">src/routes/page.tsx</code>
-      </p>
-      <div className="grid">
-        <a
-          href="https://modernjs.dev/guides/get-started/introduction.html"
-          target="_blank"
-          rel="noopener noreferrer"
-          className="card"
-        >
-          <h2>
-            Guide
-            <img
-              className="arrow-right"
-              src="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/arrow-right.svg"
-              alt="Guide"
-            />
-          </h2>
-          <p>Follow the guides to use all features of Modern.js.</p>
-        </a>
-        <a
-          href="https://modernjs.dev/tutorials/foundations/introduction.html"
-          target="_blank"
-          className="card"
-          rel="noreferrer"
-        >
-          <h2>
-            Tutorials
-            <img
-              className="arrow-right"
-              src="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/arrow-right.svg"
-              alt="Tutorials"
-            />
-          </h2>
-          <p>Learn to use Modern.js to create your first application.</p>
-        </a>
-        <a
-          href="https://modernjs.dev/configure/app/usage.html"
-          target="_blank"
-          className="card"
-          rel="noreferrer"
-        >
-          <h2>
-            Config
-            <img
-              className="arrow-right"
-              src="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/arrow-right.svg"
-              alt="Config"
-            />
-          </h2>
-          <p>Find all configuration options provided by Modern.js.</p>
-        </a>
-        <a
-          href="https://github.com/web-infra-dev/modern.js"
-          target="_blank"
-          rel="noopener noreferrer"
-          className="card"
-        >
-          <h2>
-            GitHub
-            <img
-              className="arrow-right"
-              src="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/arrow-right.svg"
-              alt="Github"
-            />
-          </h2>
-          <p>View the source code on GitHub; feel free to contribute.</p>
-        </a>
-      </div>
-    </main>
-  </div>
-);
-
-export default Index;
-`
-});
-export {
-  MWAFiles
-};

package/dist/esm-node/index.js

@@ -1,66 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { OpenInCodeSandboxButton, SandpackCodeEditor, SandpackFileExplorer, SandpackLayout, SandpackProvider } from "@codesandbox/sandpack-react";
-import { ModernTemplates } from "./templates";
-function fileterFiles(files, removeFiles) {
-  if (removeFiles.length === 0) {
-    return files;
-  }
-  const result = {};
-  Object.keys(files).forEach((filename) => {
-    if (!removeFiles.includes(filename)) {
-      result[filename] = files[filename];
-    }
-  });
-  return result;
-}
-function ModernSandpack(props) {
-  const { template, customSetup = {}, files: customFiles = {}, removeFiles = [], options = {}, initialCollapsedFolder = [], activeFile = "src/routes/page.tsx", theme = "light" } = props;
-  const initFiles = ModernTemplates[template];
-  const files = {
-    ...fileterFiles(initFiles, removeFiles),
-    ...fileterFiles(customFiles, removeFiles)
-  };
-  return /* @__PURE__ */ _jsx(SandpackProvider, {
-    theme,
-    customSetup: {
-      environment: "node",
-      ...customSetup
-    },
-    files,
-    options: {
-      activeFile,
-      visibleFiles: Object.keys(customFiles).filter((file) => !removeFiles.includes(file)),
-      ...options
-    },
-    children: /* @__PURE__ */ _jsxs(SandpackLayout, {
-      children: [
-        /* @__PURE__ */ _jsx(SandpackFileExplorer, {
-          autoHiddenFiles: true,
-          initialCollapsedFolder: [
-            "/.husky/",
-            "/.vscode/",
-            "/.codesandbox/",
-            ...initialCollapsedFolder
-          ]
-        }),
-        /* @__PURE__ */ _jsx(SandpackCodeEditor, {
-          showLineNumbers: true,
-          showInlineErrors: true,
-          readOnly: true,
-          showTabs: false
-        }),
-        /* @__PURE__ */ _jsx("div", {
-          style: {
-            position: "absolute",
-            right: "5px",
-            bottom: "5px"
-          },
-          children: /* @__PURE__ */ _jsx(OpenInCodeSandboxButton, {})
-        })
-      ]
-    })
-  });
-}
-export {
-  ModernSandpack as default
-};

package/dist/esm-node/templates/common.js

@@ -1,10 +0,0 @@
-const commonFiles = {
-  ".codesandbox/environment.json": '{\n  "nodeVersion": 18\n}\n',
-  ".codesandbox/tasks.json": '{\n  "$schema": "https://codesandbox.io/schemas/tasks.json",\n  "setupTasks": [\n    {\n      "name": "Installing Dependencies",\n      "command": "pnpm install"\n    }\n  ],\n  "tasks": {\n    "start": {\n      "name": "Application",\n      "command": "pnpm run start",\n      "runAtStart": true,\n      "restartOn": {\n        "files": ["pnpm-lock.yaml"]\n      }\n    }\n  }\n}\n',
-  ".gitignore": ".DS_Store\n\n.pnp\n.pnp.js\n.env.local\n.env.*.local\n.history\n*.log*\n\nnode_modules/\n.yarn-integrity\n.pnpm-store/\n*.tsbuildinfo\n.changeset/pre.json\n\ndist/\ncoverage/\nrelease/\noutput/\noutput_resource/\nlog/\n\n.vscode/**/*\n!.vscode/settings.json\n!.vscode/extensions.json\n.idea/\n\n**/*/typings/auto-generated\n\nmodern.config.local.*\n",
-  "biome.json": '{\n  "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",\n  "vcs": {\n    "enabled": true,\n    "defaultBranch": "main",\n    "clientKind": "git",\n    "useIgnoreFile": true\n  },\n  "formatter": {\n    "enabled": true,\n    "indentStyle": "space"\n  },\n  "javascript": {\n    "formatter": {\n      "quoteStyle": "single",\n      "arrowParentheses": "asNeeded",\n      "jsxQuoteStyle": "double",\n      "lineWidth": 80\n    }\n  },\n  "linter": {\n    "enabled": true,\n    "rules": {\n      "recommended": true,\n      "suspicious": {\n        "noDuplicateFontNames": "off"\n      }\n    }\n  },\n  "organizeImports": {\n    "enabled": true\n  },\n  "files": {\n    "ignoreUnknown": true,\n    "ignore": [".vscode/**/*", "node_modules/**/*", "dist/**/*"]\n  }\n}\n',
-  ".npmrc": "strict-peer-dependencies=false\n"
-};
-export {
-  commonFiles
-};

package/dist/esm-node/templates/index.js

@@ -1,7 +0,0 @@
-const { MWAFiles } = require("./mwa");
-const ModernTemplates = {
-  "web-app": MWAFiles
-};
-export {
-  ModernTemplates
-};

package/dist/esm-node/templates/mwa.js

@@ -1,115 +0,0 @@
-import { commonFiles } from "./common";
-const MWAFiles = {
-  ...commonFiles,
-  ...{
-    "README.md": "# Modern.js App\n\n## Setup\n\nInstall the dependencies:\n\n```bash\npnpm install\n```\n\n## Get Started\n\nStart the dev server:\n\n```bash\npnpm dev\n```\n\nEnable optional features or add a new entry:\n\n```bash\npnpm new\n```\n\nBuild the app for production:\n\n```bash\npnpm build\n```\n\nPreview the production build locally:\n\n```bash\npnpm serve\n```\n\nFor more information, see the [Modern.js documentation](https://modernjs.dev/en).\n",
-    ".browserslistrc": "chrome >= 51\nedge >= 15\nfirefox >= 54\nsafari >= 10\nios_saf >= 10\n",
-    "package.json": '{\n  "name": "modern-app",\n  "version": "0.1.0",\n  "scripts": {\n    "reset": "npx rimraf node_modules ./**/node_modules",\n    "dev": "modern dev",\n    "build": "modern build",\n    "start": "modern start",\n    "serve": "modern serve",\n    "new": "modern new",\n    "lint": "biome check",\n    "prepare": "simple-git-hooks",\n    "upgrade": "modern upgrade"\n  },\n  "engines": {\n    "node": ">=16.18.1"\n  },\n  "lint-staged": {\n    "*.{js,ts,cjs,mjs,d.cts,d.mts,jsx,tsx,json,jsonc}": [\n      "biome check --files-ignore-unknown=true"\n    ]\n  },\n  "simple-git-hooks": {\n    "pre-commit": "npx lint-staged"\n  },\n  "dependencies": {\n    "@modern-js/runtime": "2.69.3",\n    "react": "^18.3.1",\n    "react-dom": "^18.3.1"\n  },\n  "devDependencies": {\n    "@modern-js/app-tools": "2.69.3",\n    "@modern-js/tsconfig": "2.69.3",\n    "@biomejs/biome": "1.9.4",\n    "typescript": "~5.7.3",\n    "@types/jest": "~29.2.4",\n    "@types/node": "~18.11.9",\n    "@types/react": "^18.3.11",\n    "@types/react-dom": "~18.3.1",\n    "lint-staged": "~15.4.0",\n    "simple-git-hooks": "^2.11.1",\n    "rimraf": "^6.0.1"\n  }\n}\n',
-    "modern.config.ts": "import { appTools, defineConfig } from '@modern-js/app-tools';\n\n// https://modernjs.dev/en/configure/app/usage\nexport default defineConfig({\n  runtime: {\n    router: true,\n  },\n  plugins: [\n    appTools({\n      bundler: \n    }),\n  ],\n});\n",
-    "tsconfig.json": '{\n  "extends": "@modern-js/tsconfig/base",\n  "compilerOptions": {\n    "declaration": false,\n    "jsx": "preserve",\n    "baseUrl": "./",\n    "paths": {\n      "@/*": ["./src/*"],\n      "@shared/*": ["./shared/*"]\n    }\n  },\n  "include": ["src", "shared", "config", "modern.config.ts"],\n  "exclude": ["**/node_modules"]\n}\n',
-    "src/modern-app-env.d.ts": "/// <reference types='@modern-js/app-tools/types' />\n/// <reference types='@modern-js/runtime/types' />\n/// <reference types='@modern-js/runtime/types/router' />\n",
-    "src/modern.runtime.ts": "import { defineRuntimeConfig } from '@modern-js/runtime';\n\nexport default defineRuntimeConfig({});\n",
-    "src/routes/index.css": "html,\nbody {\n  padding: 0;\n  margin: 0;\n  font-family: PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;\n  background: linear-gradient(to bottom, transparent, #fff) #eceeef;\n}\n\np {\n  margin: 0;\n}\n\n* {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  box-sizing: border-box;\n}\n\n.container-box {\n  min-height: 100vh;\n  max-width: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  padding-top: 10px;\n}\n\nmain {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n}\n\n.title {\n  display: flex;\n  margin: 4rem 0 4rem;\n  align-items: center;\n  font-size: 4rem;\n  font-weight: 600;\n}\n\n.logo {\n  width: 6rem;\n  margin: 7px 0 0 1rem;\n}\n\n.name {\n  color: #4ecaff;\n}\n\n.description {\n  text-align: center;\n  line-height: 1.5;\n  font-size: 1.3rem;\n  color: #1b3a42;\n  margin-bottom: 5rem;\n}\n\n.code {\n  background: #fafafa;\n  border-radius: 12px;\n  padding: 0.6rem 0.9rem;\n  font-size: 1.05rem;\n  font-family:\n    Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,\n    Bitstream Vera Sans Mono, Courier New, monospace;\n}\n\n.container-box .grid {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 1100px;\n  margin-top: 3rem;\n}\n\n.card {\n  padding: 1.5rem;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  height: 100px;\n  color: inherit;\n  text-decoration: none;\n  transition: 0.15s ease;\n  width: 45%;\n}\n\n.card:hover,\n.card:focus {\n  transform: scale(1.05);\n}\n\n.card h2 {\n  display: flex;\n  align-items: center;\n  font-size: 1.5rem;\n  margin: 0;\n  padding: 0;\n}\n\n.card p {\n  opacity: 0.6;\n  font-size: 0.9rem;\n  line-height: 1.5;\n  margin-top: 1rem;\n}\n\n.arrow-right {\n  width: 1.3rem;\n  margin-left: 0.5rem;\n  margin-top: 3px;\n}\n",
-    "src/routes/layout.tsx": "import { Outlet } from '@modern-js/runtime/router';\n\nexport default function Layout() {\n  return (\n    <div>\n      <Outlet />\n    </div>\n  );\n}\n",
-    "src/routes/page.tsx": `import { Helmet } from '@modern-js/runtime/head';
-import './index.css';
-
-const Index = () => (
-  <div className="container-box">
-    <Helmet>
-      <link
-        rel="icon"
-        type="image/x-icon"
-        href="https://lf3-static.bytednsdoc.com/obj/eden-cn/uhbfnupenuhf/favicon.ico"
-      />
-    </Helmet>
-    <main>
-      <div className="title">
-        Welcome to
-        <img
-          className="logo"
-          src="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/modern-js-logo.svg"
-          alt="Modern.js Logo"
-        />
-        <p className="name">Modern.js</p>
-      </div>
-      <p className="description">
-        Get started by editing <code className="code">src/routes/page.tsx</code>
-      </p>
-      <div className="grid">
-        <a
-          href="https://modernjs.dev/guides/get-started/introduction.html"
-          target="_blank"
-          rel="noopener noreferrer"
-          className="card"
-        >
-          <h2>
-            Guide
-            <img
-              className="arrow-right"
-              src="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/arrow-right.svg"
-              alt="Guide"
-            />
-          </h2>
-          <p>Follow the guides to use all features of Modern.js.</p>
-        </a>
-        <a
-          href="https://modernjs.dev/tutorials/foundations/introduction.html"
-          target="_blank"
-          className="card"
-          rel="noreferrer"
-        >
-          <h2>
-            Tutorials
-            <img
-              className="arrow-right"
-              src="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/arrow-right.svg"
-              alt="Tutorials"
-            />
-          </h2>
-          <p>Learn to use Modern.js to create your first application.</p>
-        </a>
-        <a
-          href="https://modernjs.dev/configure/app/usage.html"
-          target="_blank"
-          className="card"
-          rel="noreferrer"
-        >
-          <h2>
-            Config
-            <img
-              className="arrow-right"
-              src="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/arrow-right.svg"
-              alt="Config"
-            />
-          </h2>
-          <p>Find all configuration options provided by Modern.js.</p>
-        </a>
-        <a
-          href="https://github.com/web-infra-dev/modern.js"
-          target="_blank"
-          rel="noopener noreferrer"
-          className="card"
-        >
-          <h2>
-            GitHub
-            <img
-              className="arrow-right"
-              src="https://lf3-static.bytednsdoc.com/obj/eden-cn/zq-uylkvT/ljhwZthlaukjlkulzlp/arrow-right.svg"
-              alt="Github"
-            />
-          </h2>
-          <p>View the source code on GitHub; feel free to contribute.</p>
-        </a>
-      </div>
-    </main>
-  </div>
-);
-
-export default Index;
-`
-  }
-};
-export {
-  MWAFiles
-};