npm - webstudio - Versions diffs - 0.0.0-4f7bf18 - Mend

webstudio 0.0.0-4f7bf18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (74) hide show

package/LICENSE +661 -0
package/README.md +145 -0
package/bin.js +5 -0
package/lib/cli.js +6606 -0
package/package.json +88 -0
package/templates/cloudflare/WS_CF_README.md +48 -0
package/templates/cloudflare/functions/[[path]].ts +9 -0
package/templates/cloudflare/load-context.ts +9 -0
package/templates/cloudflare/package.json +22 -0
package/templates/cloudflare/tsconfig.json +18 -0
package/templates/cloudflare/vite.config.ts +21 -0
package/templates/cloudflare/worker-configuration.d.ts +3 -0
package/templates/cloudflare/wrangler.toml +55 -0
package/templates/defaults/app/constants.mjs +12 -0
package/templates/defaults/app/extension.ts +16 -0
package/templates/defaults/app/root.tsx +35 -0
package/templates/defaults/app/route-templates/default-sitemap.tsx +34 -0
package/templates/defaults/app/route-templates/html.tsx +297 -0
package/templates/defaults/app/route-templates/redirect.tsx +6 -0
package/templates/defaults/app/route-templates/xml.tsx +85 -0
package/templates/defaults/app/routes/[robots.txt].tsx +24 -0
package/templates/defaults/package.json +35 -0
package/templates/defaults/public/favicon.ico +0 -0
package/templates/defaults/tsconfig.json +22 -0
package/templates/defaults/vite.config.ts +16 -0
package/templates/internal/package.json +11 -0
package/templates/internal/tsconfig.json +5 -0
package/templates/netlify-edge-functions/app/constants.mjs +29 -0
package/templates/netlify-edge-functions/app/entry.server.tsx +21 -0
package/templates/netlify-edge-functions/netlify.toml +16 -0
package/templates/netlify-edge-functions/package.json +9 -0
package/templates/netlify-edge-functions/vite.config.ts +18 -0
package/templates/netlify-functions/app/constants.mjs +29 -0
package/templates/netlify-functions/app/entry.server.tsx +1 -0
package/templates/netlify-functions/netlify.toml +16 -0
package/templates/netlify-functions/package.json +9 -0
package/templates/netlify-functions/vite.config.ts +18 -0
package/templates/react-router-docker/.dockerignore +4 -0
package/templates/react-router-docker/Dockerfile +24 -0
package/templates/react-router-docker/app/constants.mjs +18 -0
package/templates/react-router-docker/app/extension.ts +13 -0
package/templates/react-router-docker/app/root.tsx +35 -0
package/templates/react-router-docker/app/route-templates/default-sitemap.tsx +34 -0
package/templates/react-router-docker/app/route-templates/html.tsx +295 -0
package/templates/react-router-docker/app/route-templates/redirect.tsx +6 -0
package/templates/react-router-docker/app/route-templates/xml.tsx +85 -0
package/templates/react-router-docker/app/routes/[_image].$.ts +24 -0
package/templates/react-router-docker/app/routes/[robots.txt].tsx +24 -0
package/templates/react-router-docker/app/routes.ts +4 -0
package/templates/react-router-docker/package.json +39 -0
package/templates/react-router-docker/public/favicon.ico +0 -0
package/templates/react-router-docker/tsconfig.json +18 -0
package/templates/react-router-docker/vite.config.ts +6 -0
package/templates/saas-helpers/package.json +6 -0
package/templates/saas-helpers/tsconfig.json +18 -0
package/templates/ssg/app/constants.mjs +13 -0
package/templates/ssg/app/route-templates/html/+Head.tsx +92 -0
package/templates/ssg/app/route-templates/html/+Page.tsx +21 -0
package/templates/ssg/app/route-templates/html/+data.ts +37 -0
package/templates/ssg/package.json +31 -0
package/templates/ssg/pages/+config.ts +12 -0
package/templates/ssg/public/favicon.ico +0 -0
package/templates/ssg/renderer/+onRenderClient.tsx +30 -0
package/templates/ssg/renderer/+onRenderHtml.tsx +29 -0
package/templates/ssg/tsconfig.json +22 -0
package/templates/ssg/vike.d.ts +25 -0
package/templates/ssg/vite.config.ts +7 -0
package/templates/ssg-netlify/app/constants.mjs +30 -0
package/templates/ssg-vercel/app/constants.mjs +26 -0
package/templates/ssg-vercel/public/vercel.json +11 -0
package/templates/vercel/.vercelignore +8 -0
package/templates/vercel/app/constants.mjs +25 -0
package/templates/vercel/package.json +1 -0
package/templates/vercel/vercel.json +11 -0

package/templates/ssg/app/route-templates/html/+data.ts ADDED Viewed

@@ -0,0 +1,37 @@
+import type { PageContextServer } from "vike/types";
+import { redirect } from "vike/abort";
+import { loadResources } from "@webstudio-is/sdk/runtime";
+import { getPageMeta, getResources } from "__SERVER__";
+export const data = async (pageContext: PageContextServer) => {
+  const url = new URL(pageContext.urlOriginal, "http://url");
+  const headers = new Headers(pageContext.headers ?? {});
+  const host = headers.get("x-forwarded-host") || headers.get("host") || "";
+  url.host = host;
+  url.protocol = "https";
+  const params = pageContext.routeParams;
+  const system = {
+    params,
+    search: Object.fromEntries(url.searchParams),
+    origin: url.origin,
+  };
+  const resources = await loadResources(fetch, getResources({ system }).data);
+  const pageMeta = getPageMeta({ system, resources });
+  if (pageMeta.redirect) {
+    const status =
+      pageMeta.status === 301 || pageMeta.status === 302
+        ? pageMeta.status
+        : 302;
+    throw redirect(pageMeta.redirect, status);
+  }
+  return {
+    url: url.href,
+    system,
+    resources,
+    pageMeta,
+  } satisfies PageContextServer["data"];
+};

package/templates/ssg/package.json ADDED Viewed

@@ -0,0 +1,31 @@
+{
+  "type": "module",
+  "private": true,
+  "sideEffects": false,
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite dev",
+    "typecheck": "tsc"
+  },
+  "dependencies": {
+    "@webstudio-is/image": "0.0.0-4f7bf18",
+    "@webstudio-is/react-sdk": "0.0.0-4f7bf18",
+    "@webstudio-is/sdk": "0.0.0-4f7bf18",
+    "@webstudio-is/sdk-components-react": "0.0.0-4f7bf18",
+    "@webstudio-is/sdk-components-animation": "0.0.0-4f7bf18",
+    "@webstudio-is/sdk-components-react-radix": "0.0.0-4f7bf18",
+    "react": "18.3.0-canary-14898b6a9-20240318",
+    "react-dom": "18.3.0-canary-14898b6a9-20240318",
+    "vike": "^0.4.218"
+  },
+  "devDependencies": {
+    "@types/react": "^18.2.70",
+    "@types/react-dom": "^18.2.25",
+    "@vitejs/plugin-react": "^4.3.4",
+    "typescript": "5.7.3",
+    "vite": "^5.4.11"
+  },
+  "engines": {
+    "node": ">=20.0.0"
+  }
+}

package/templates/ssg/pages/+config.ts ADDED Viewed

@@ -0,0 +1,12 @@
+import type { Config } from "vike/types";
+export default {
+  meta: {
+    Head: {
+      env: { server: true, client: true },
+    },
+    lang: {
+      env: { server: true, client: true },
+    },
+  },
+} satisfies Config;

package/templates/ssg/public/favicon.ico ADDED Viewed

Binary file

package/templates/ssg/renderer/+onRenderClient.tsx ADDED Viewed

@@ -0,0 +1,30 @@
+import { type Root, createRoot } from "react-dom/client";
+import type { OnRenderClientSync } from "vike/types";
+// @todo think about how to make __generated__ typeable
+/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */
+// @ts-ignore
+import { CustomCode } from "../app/__generated__/_index";
+let root: Root;
+export const onRenderClient: OnRenderClientSync = (pageContext) => {
+  const lang = pageContext.data.pageMeta.language || "en";
+  const Head = pageContext.config.Head ?? (() => <></>);
+  const Page = pageContext.Page ?? (() => <></>);
+  const htmlContent = (
+    <>
+      <head>
+        <meta charSet="UTF-8" />
+        <meta name="viewport" content="width=device-width,initial-scale=1" />
+        <Head data={pageContext.data} />
+        <CustomCode />
+      </head>
+      <Page data={pageContext.data} />
+    </>
+  );
+  if (root === undefined) {
+    root = createRoot(document.documentElement);
+  }
+  document.documentElement.lang = lang;
+  root.render(htmlContent);
+};

package/templates/ssg/renderer/+onRenderHtml.tsx ADDED Viewed

@@ -0,0 +1,29 @@
+import { renderToString } from "react-dom/server";
+import { dangerouslySkipEscape, escapeInject } from "vike/server";
+import type { OnRenderHtmlSync } from "vike/types";
+// @todo think about how to make __generated__ typeable
+/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */
+// @ts-ignore
+import { CustomCode } from "../app/__generated__/_index";
+export const onRenderHtml: OnRenderHtmlSync = (pageContext) => {
+  const lang = pageContext.data.pageMeta.language || "en";
+  const Head = pageContext.config.Head ?? (() => <></>);
+  const Page = pageContext.Page ?? (() => <></>);
+  const html = dangerouslySkipEscape(
+    renderToString(
+      <html lang={lang}>
+        <head>
+          <meta charSet="UTF-8" />
+          <meta name="viewport" content="width=device-width,initial-scale=1" />
+          <Head data={pageContext.data} />
+          <CustomCode />
+        </head>
+        <Page data={pageContext.data} />
+      </html>
+    )
+  );
+  return escapeInject`<!DOCTYPE html>
+${html}
+`;
+};

package/templates/ssg/tsconfig.json ADDED Viewed

@@ -0,0 +1,22 @@
+{
+  "include": ["**/*.ts", "**/*.tsx", "**/*.mjs"],
+  "compilerOptions": {
+    "lib": ["DOM", "DOM.Iterable", "ESNext"],
+    "types": [
+      "vite/client",
+      "@webstudio-is/react-sdk/placeholder",
+      "./vike.d.ts"
+    ],
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "target": "ES2022",
+    "strict": true,
+    "allowJs": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "skipLibCheck": true
+  }
+}

package/templates/ssg/vike.d.ts ADDED Viewed

@@ -0,0 +1,25 @@
+import type { ImageLoader } from "@webstudio-is/image";
+import type { PageMeta, System } from "@webstudio-is/sdk";
+declare global {
+  namespace Vike {
+    interface Config {
+      lang?: (props: { data: PageData }) => string;
+      Head?: (props: { data: PageData }) => React.ReactNode;
+    }
+    interface PageContext {
+      constants: {
+        assetBaseUrl: string;
+        imageLoader: ImageLoader;
+      };
+      data: {
+        url: string;
+        system: System;
+        resources: Record<string, unknown>;
+        pageMeta: PageMeta;
+      };
+      Page?: (props: { data: PageData }) => React.ReactNode;
+    }
+  }
+}

package/templates/ssg/vite.config.ts ADDED Viewed

@@ -0,0 +1,7 @@
+import { defineConfig } from "vite";
+import react from "@vitejs/plugin-react";
+import vike from "vike/plugin";
+export default defineConfig({
+  plugins: [react(), vike({ prerender: true })],
+});

package/templates/ssg-netlify/app/constants.mjs ADDED Viewed

@@ -0,0 +1,30 @@
+/**
+ * We use mjs extension as constants in this file is shared with the build script
+ * and we use `node --eval` to extract the constants.
+ */
+export const assetBaseUrl = "/assets/";
+/**
+ * @type {import("@webstudio-is/image").ImageLoader}
+ */
+export const imageLoader = (props) => {
+  if (process.env.NODE_ENV !== "production") {
+    return props.src;
+  }
+  if (props.format === "raw") {
+    return props.src;
+  }
+  // https://docs.netlify.com/image-cdn/overview/
+  const searchParams = new URLSearchParams();
+  searchParams.set("url", props.src);
+  searchParams.set("w", props.width.toString());
+  if (props.height) {
+    searchParams.set("h", props.height.toString());
+  }
+  searchParams.set("q", props.quality.toString());
+  // fit=contain by default
+  return `/.netlify/images?${searchParams}`;
+};

package/templates/ssg-vercel/app/constants.mjs ADDED Viewed

@@ -0,0 +1,26 @@
+/**
+ * We use mjs extension as constants in this file is shared with the build script
+ * and we use `node --eval` to extract the constants.
+ */
+export const assetBaseUrl = "/assets/";
+/**
+ * @type {import("@webstudio-is/image").ImageLoader}
+ */
+export const imageLoader = (props) => {
+  if (process.env.NODE_ENV !== "production") {
+    return props.src;
+  }
+  if (props.format === "raw") {
+    return props.src;
+  }
+  // https://vercel.com/blog/build-your-own-web-framework#automatic-image-optimization
+  const searchParams = new URLSearchParams();
+  searchParams.set("url", props.src);
+  searchParams.set("w", props.width.toString());
+  searchParams.set("q", props.quality.toString());
+  return `/_vercel/image?${searchParams}`;
+};

package/templates/ssg-vercel/public/vercel.json ADDED Viewed

@@ -0,0 +1,11 @@
+{
+  "images": {
+    "domains": [],
+    "sizes": [
+      16, 32, 48, 64, 96, 128, 144, 256, 384, 640, 750, 828, 1080, 1200, 1920,
+      2048, 3840
+    ],
+    "minimumCacheTTL": 60,
+    "formats": ["image/webp", "image/avif"]
+  }
+}

package/templates/vercel/.vercelignore ADDED Viewed

@@ -0,0 +1,8 @@
+node_modules
+.cache
+.env
+.vercel
+.webstudio
+build
+public/build

package/templates/vercel/app/constants.mjs ADDED Viewed

@@ -0,0 +1,25 @@
+/**
+ * We use mjs extension as constants in this file is shared with the build script
+ * and we use `node --eval` to extract the constants.
+ */
+export const assetBaseUrl = "/assets/";
+/**
+ * @type {import("@webstudio-is/image").ImageLoader}
+ */
+export const imageLoader = (props) => {
+  if (process.env.NODE_ENV !== "production") {
+    return props.src;
+  }
+  if (props.format === "raw") {
+    return props.src;
+  }
+  // https://vercel.com/blog/build-your-own-web-framework#automatic-image-optimization
+  const searchParams = new URLSearchParams();
+  searchParams.set("url", props.src);
+  searchParams.set("w", props.width.toString());
+  searchParams.set("q", props.quality.toString());
+  return `/_vercel/image?${searchParams}`;
+};

package/templates/vercel/package.json ADDED Viewed

	@@ -0,0 +1 @@
1	+ {}

package/templates/vercel/vercel.json ADDED Viewed

@@ -0,0 +1,11 @@
+{
+  "images": {
+    "domains": [],
+    "sizes": [
+      16, 32, 48, 64, 96, 128, 144, 256, 384, 640, 750, 828, 1080, 1200, 1920,
+      2048, 3840
+    ],
+    "minimumCacheTTL": 60,
+    "formats": ["image/webp", "image/avif"]
+  }
+}