webstudio 0.145.0 → 0.151.0

package/lib/cli.js

@@ -272,10 +272,10 @@ import {
   findTreeInstanceIds,
   getPagePath,
   parseComponentName,
-  executeExpression,
   generateFormsProperties,
   generateResourcesLoader,
-  generatePageMeta
+  generatePageMeta,
+  getStaticSiteMapXml
 } from "@webstudio-is/sdk";
 import { createImageLoader } from "@webstudio-is/image";
 import * as baseComponentMetas from "@webstudio-is/sdk-components-react/metas";
@@ -557,11 +557,9 @@ var prebuild = async (options) => {
   });
   await ensureFileInPath(join4(generatedDir, "index.css"), cssText);
   spinner.text = "Generating routes and pages";
-  const routeTemplatePath = normalize(
-    join4(cwd3(), "__templates__", "route-template.tsx")
-  );
+  const routeTemplatePath = normalize(join4(cwd3(), "app/routes/template.tsx"));
   const routeFileTemplate = await readFile4(routeTemplatePath, "utf8");
-  await rm(dirname2(routeTemplatePath), { recursive: true });
+  await rm(routeTemplatePath);
   for (const [pageId, pageComponents] of Object.entries(componentsByPage)) {
     const scope = createScope([
       // manually maintained list of occupied identifiers
@@ -633,6 +631,10 @@ var prebuild = async (options) => {
       )
     });
     const projectMeta = siteData.build.pages.meta;
+    const contactEmail = (
+      // fallback to user email when contact email is empty string
+      projectMeta?.contactEmail || siteData.user?.email || void 0
+    );
     const pageMeta = pageData.page.meta;
     const favIconAsset = assets.get(projectMeta?.faviconAssetId ?? "");
     const socialImageAsset = assets.get(pageMeta.socialImageAssetId ?? "");
@@ -645,6 +647,8 @@ import type { FontAsset, ImageAsset } from "@webstudio-is/sdk";
 import { useResource } from "@webstudio-is/react-sdk";
 ${componentImports}
 
+export const siteName = ${JSON.stringify(projectMeta?.siteName)};
+
 export const favIconAsset: ImageAsset | undefined =
   ${JSON.stringify(favIconAsset)};
 
@@ -668,7 +672,7 @@ export { Page }
 /* This is a auto generated file for building the project */ 
 
 
-import type { ProjectMeta, PageMeta } from "@webstudio-is/sdk";
+import type { PageMeta } from "@webstudio-is/sdk";
 ${generateResourcesLoader({
       scope,
       page: pageData.page,
@@ -688,11 +692,9 @@ ${generateRemixParams(pageData.page.path)}
 
 export const projectId = "${siteData.build.projectId}";
 
-export const user: { email: string | null } | undefined =
-  ${JSON.stringify(siteData.user)};
+export const contactEmail = ${JSON.stringify(contactEmail)};
 
-export const projectMeta: ProjectMeta =
-  ${JSON.stringify(projectMeta)};
+export const customCode = ${JSON.stringify(projectMeta?.code?.trim() ?? "")};
 `;
     const pagePath = getPagePath(pageData.page.id, siteData.build.pages);
     const remixRoute = generateRemixRoute(pagePath);
@@ -715,14 +717,7 @@ export const projectMeta: ProjectMeta =
     join4(generatedDir, "[sitemap.xml].ts"),
     `
       export const sitemap = ${JSON.stringify(
-      {
-        pages: siteData.pages.filter(
-          (page) => executeExpression(page.meta.excludePageFromSearch) !== true
-        ).map((page) => ({
-          path: page.path,
-          lastModified: siteData.build.updatedAt
-        }))
-      },
+      getStaticSiteMapXml(siteData.build.pages, siteData.build.updatedAt),
       null,
       2
     )};
@@ -917,7 +912,7 @@ import makeCLI from "yargs";
 // package.json
 var package_default = {
   name: "webstudio",
-  version: "0.145.0",
+  version: "0.151.0",
   description: "Webstudio CLI",
   author: "Webstudio <github@webstudio.is>",
   homepage: "https://webstudio.is",
@@ -961,24 +956,26 @@ var package_default = {
     zod: "^3.22.4"
   },
   devDependencies: {
-    "@netlify/remix-adapter": "^2.3.0",
-    "@netlify/remix-edge-adapter": "3.2.0",
-    "@remix-run/cloudflare": "^2.8.1",
-    "@remix-run/cloudflare-pages": "^2.8.1",
-    "@remix-run/dev": "^2.8.1",
-    "@remix-run/node": "^2.8.1",
-    "@remix-run/react": "^2.8.1",
-    "@remix-run/server-runtime": "^2.8.1",
-    "@types/node": "^18.17.1",
+    "@netlify/remix-adapter": "^2.3.1",
+    "@netlify/remix-edge-adapter": "3.2.2",
+    "@remix-run/cloudflare": "^2.9.1",
+    "@remix-run/cloudflare-pages": "^2.9.1",
+    "@remix-run/dev": "^2.9.1",
+    "@remix-run/node": "^2.9.1",
+    "@remix-run/react": "^2.9.1",
+    "@remix-run/server-runtime": "^2.9.1",
+    "@types/node": "^20.12.7",
     "@types/prompts": "^2.4.5",
     "@types/react": "^18.2.70",
     "@types/react-dom": "^18.2.25",
     "@types/yargs": "^17.0.32",
     "@webstudio-is/form-handlers": "workspace:*",
     "@webstudio-is/tsconfig": "workspace:*",
+    react: "18.3.0-canary-14898b6a9-20240318",
+    "react-dom": "18.3.0-canary-14898b6a9-20240318",
     tsx: "^4.7.2",
     typescript: "5.4.5",
-    "vite-tsconfig-paths": "^4.3.2",
+    vite: "^5.2.11",
     wrangler: "^3.48.0"
   }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webstudio",
-  "version": "0.145.0",
+  "version": "0.151.0",
   "description": "Webstudio CLI",
   "author": "Webstudio <github@webstudio.is>",
   "homepage": "https://webstudio.is",
@@ -28,33 +28,35 @@
     "title-case": "^4.1.0",
     "yargs": "^17.7.2",
     "zod": "^3.22.4",
-    "@webstudio-is/http-client": "0.145.0",
-    "@webstudio-is/image": "0.145.0",
-    "@webstudio-is/sdk": "0.145.0",
-    "@webstudio-is/react-sdk": "0.145.0",
-    "@webstudio-is/sdk-components-react": "0.145.0",
-    "@webstudio-is/sdk-components-react-radix": "0.145.0",
-    "@webstudio-is/sdk-components-react-remix": "0.145.0"
+    "@webstudio-is/http-client": "0.151.0",
+    "@webstudio-is/react-sdk": "0.151.0",
+    "@webstudio-is/image": "0.151.0",
+    "@webstudio-is/sdk": "0.151.0",
+    "@webstudio-is/sdk-components-react-radix": "0.151.0",
+    "@webstudio-is/sdk-components-react-remix": "0.151.0",
+    "@webstudio-is/sdk-components-react": "0.151.0"
   },
   "devDependencies": {
-    "@netlify/remix-adapter": "^2.3.0",
-    "@netlify/remix-edge-adapter": "3.2.0",
-    "@remix-run/cloudflare": "^2.8.1",
-    "@remix-run/cloudflare-pages": "^2.8.1",
-    "@remix-run/dev": "^2.8.1",
-    "@remix-run/node": "^2.8.1",
-    "@remix-run/react": "^2.8.1",
-    "@remix-run/server-runtime": "^2.8.1",
-    "@types/node": "^18.17.1",
+    "@netlify/remix-adapter": "^2.3.1",
+    "@netlify/remix-edge-adapter": "3.2.2",
+    "@remix-run/cloudflare": "^2.9.1",
+    "@remix-run/cloudflare-pages": "^2.9.1",
+    "@remix-run/dev": "^2.9.1",
+    "@remix-run/node": "^2.9.1",
+    "@remix-run/react": "^2.9.1",
+    "@remix-run/server-runtime": "^2.9.1",
+    "@types/node": "^20.12.7",
     "@types/prompts": "^2.4.5",
     "@types/react": "^18.2.70",
     "@types/react-dom": "^18.2.25",
     "@types/yargs": "^17.0.32",
+    "react": "18.3.0-canary-14898b6a9-20240318",
+    "react-dom": "18.3.0-canary-14898b6a9-20240318",
     "tsx": "^4.7.2",
     "typescript": "5.4.5",
-    "vite-tsconfig-paths": "^4.3.2",
+    "vite": "^5.2.11",
     "wrangler": "^3.48.0",
-    "@webstudio-is/form-handlers": "0.145.0",
+    "@webstudio-is/form-handlers": "0.151.0",
     "@webstudio-is/tsconfig": "1.0.7"
   },
   "scripts": {

package/templates/cloudflare/package.json

@@ -12,17 +12,13 @@
     "build-cf-types": "wrangler types"
   },
   "dependencies": {
-    "@remix-run/cloudflare": "^2.8.1",
-    "@remix-run/cloudflare-pages": "^2.8.1",
+    "@remix-run/cloudflare": "2.9.1",
+    "@remix-run/cloudflare-pages": "2.9.1",
     "isbot": "^4.1.0"
   },
   "devDependencies": {
     "@cloudflare/workers-types": "^4.20240405.0",
-    "vite-tsconfig-paths": "^4.2.1",
     "wrangler": "^3.48.0",
     "miniflare": "^3.20231030.4"
-  },
-  "engines": {
-    "node": ">=18.0.0"
   }
 }

package/templates/cloudflare/tsconfig.json

@@ -26,9 +26,6 @@
     "skipLibCheck": true,
     "forceConsistentCasingInFileNames": true,
     "baseUrl": ".",
-    "paths": {
-      "~/*": ["./app/*"]
-    },
 
     // Vite takes care of building everything, not tsc.
     "noEmit": true

package/templates/cloudflare/vite.config.ts

@@ -3,13 +3,11 @@ import {
   cloudflareDevProxyVitePlugin as remixCloudflareDevProxy,
 } from "@remix-run/dev";
 import { defineConfig } from "vite";
-import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig(({ mode }) => ({
   plugins: [
     // without this, remixCloudflareDevProxy trying to load workerd even for production (it's not needed for production)
     mode === "production" ? undefined : remixCloudflareDevProxy(),
     remix(),
-    tsconfigPaths(),
   ].filter(Boolean),
 }));

package/templates/defaults/app/__generated__/[sitemap.xml].ts

@@ -1,11 +1,9 @@
 /**
  * The only intent of this file is to support typings inside ../routes/[sitemap.xml].tsx for easier development.
  **/
-export const sitemap = {
-  pages: [
-    {
-      path: "",
-      lastModified: "2021-10-13T12:00:00.000Z",
-    },
-  ],
-};
+export const sitemap = [
+  {
+    path: "",
+    lastModified: "2021-10-13T12:00:00.000Z",
+  },
+];

package/templates/defaults/app/routes/[sitemap.xml].tsx

@@ -7,7 +7,7 @@ export const loader = (arg: LoaderFunctionArgs) => {
     arg.request.headers.get("host") ||
     "";
 
-  const urls = sitemap.pages.map((page) => {
+  const urls = sitemap.map((page) => {
     const url = new URL(`https://${host}${page.path}`);
 
     return `

package/templates/defaults/{__templates__/route-template.tsx → app/routes/template.tsx}

@@ -14,31 +14,40 @@ import { ReactSdkContext } from "@webstudio-is/react-sdk";
 import { n8nHandler, getFormId } from "@webstudio-is/form-handlers";
 import {
   Page,
+  siteName,
   favIconAsset,
   socialImageAsset,
   pageFontAssets,
   pageBackgroundImageAssets,
-} from "../../../__generated__/_index";
+} from "../../../../__generated__/_index";
 import {
   formsProperties,
   loadResources,
   getPageMeta,
   getRemixParams,
   projectId,
-  user,
-  projectMeta,
-} from "../../../__generated__/_index.server";
+  contactEmail,
+} from "../../../../__generated__/_index.server";
 
 import css from "../__generated__/index.css?url";
-import { assetBaseUrl, imageBaseUrl, imageLoader } from "~/constants.mjs";
+import { assetBaseUrl, imageBaseUrl, imageLoader } from "../constants.mjs";
 
 export const loader = async (arg: LoaderFunctionArgs) => {
   const url = new URL(arg.request.url);
+  const host =
+    arg.request.headers.get("x-forwarded-host") ||
+    arg.request.headers.get("host") ||
+    "";
+  url.host = host;
+  url.protocol = "https";
+
   const params = getRemixParams(arg.params);
   const system = {
     params,
     search: Object.fromEntries(url.searchParams),
+    origin: url.origin,
   };
+
   const resources = await loadResources({ system });
   const pageMeta = getPageMeta({ system, resources });
 
@@ -50,14 +59,6 @@ export const loader = async (arg: LoaderFunctionArgs) => {
     return redirect(pageMeta.redirect, status);
   }
 
-  const host =
-    arg.request.headers.get("x-forwarded-host") ||
-    arg.request.headers.get("host") ||
-    "";
-
-  url.host = host;
-  url.protocol = "https";
-
   // typecheck
   arg.context.EXCLUDE_FROM_SEARCH satisfies boolean;
 
@@ -69,7 +70,6 @@ export const loader = async (arg: LoaderFunctionArgs) => {
       system,
       resources,
       pageMeta,
-      projectMeta,
     },
     // No way for current information to change, so add cache for 10 minutes
     // In case of CRM Data, this should be set to 0
@@ -95,7 +95,7 @@ export const meta: MetaFunction<typeof loader> = ({ data }) => {
   if (data === undefined) {
     return metas;
   }
-  const { pageMeta, projectMeta } = data;
+  const { pageMeta } = data;
 
   if (data.url) {
     metas.push({
@@ -117,16 +117,16 @@ export const meta: MetaFunction<typeof loader> = ({ data }) => {
 
   const origin = `https://${data.host}`;
 
-  if (projectMeta?.siteName) {
+  if (siteName) {
     metas.push({
       property: "og:site_name",
-      content: projectMeta.siteName,
+      content: siteName,
     });
     metas.push({
       "script:ld+json": {
         "@context": "https://schema.org",
         "@type": "WebSite",
-        name: projectMeta.siteName,
+        name: siteName,
         url: origin,
       },
     });
@@ -255,9 +255,7 @@ export const action = async ({ request, context }: ActionFunctionArgs) => {
   // form properties are not defined when defaults are used
   const { action, method } = formProperties ?? {};
 
-  const email = user?.email;
-
-  if (email == null) {
+  if (contactEmail === undefined) {
     return { success: false };
   }
 
@@ -292,7 +290,7 @@ export const action = async ({ request, context }: ActionFunctionArgs) => {
     action: action ?? null,
     method: getMethod(method),
     pageUrl: pageUrl.toString(),
-    toEmail: email,
+    toEmail: contactEmail,
     fromEmail: pageUrl.hostname + "@webstudio.email",
   } as const;
 

package/templates/defaults/package.json

@@ -8,28 +8,28 @@
     "typecheck": "tsc"
   },
   "dependencies": {
-    "@remix-run/react": "^2.8.1",
-    "@remix-run/server-runtime": "^2.8.1",
-    "@remix-run/node": "^2.8.1",
-    "@webstudio-is/react-sdk": "0.145.0",
-    "@webstudio-is/sdk-components-react-radix": "0.145.0",
-    "@webstudio-is/sdk-components-react-remix": "0.145.0",
-    "@webstudio-is/sdk-components-react": "0.145.0",
-    "@webstudio-is/form-handlers": "0.145.0",
-    "@webstudio-is/image": "0.145.0",
-    "@webstudio-is/sdk": "0.145.0",
+    "@remix-run/node": "2.9.1",
+    "@remix-run/react": "2.9.1",
+    "@remix-run/server-runtime": "2.9.1",
+    "@webstudio-is/react-sdk": "0.151.0",
+    "@webstudio-is/sdk-components-react-radix": "0.151.0",
+    "@webstudio-is/sdk-components-react-remix": "0.151.0",
+    "@webstudio-is/sdk-components-react": "0.151.0",
+    "@webstudio-is/form-handlers": "0.151.0",
+    "@webstudio-is/image": "0.151.0",
+    "@webstudio-is/sdk": "0.151.0",
     "isbot": "^3.6.8",
     "react": "18.3.0-canary-14898b6a9-20240318",
     "react-dom": "18.3.0-canary-14898b6a9-20240318"
   },
   "devDependencies": {
-    "@remix-run/dev": "^2.8.1",
+    "@remix-run/dev": "2.9.1",
     "@types/react": "^18.2.70",
     "@types/react-dom": "^18.2.25",
     "typescript": "5.4.5",
-    "vite": "^5.2.8"
+    "vite": "^5.2.11"
   },
   "engines": {
-    "node": ">=18.0.0"
+    "node": ">=20.0.0"
   }
 }

package/templates/defaults/tsconfig.json

@@ -16,11 +16,6 @@
     "forceConsistentCasingInFileNames": true,
     "allowImportingTsExtensions": true,
     "baseUrl": ".",
-    "paths": {
-      "~/*": ["./app/*"]
-    },
-    "customConditions": ["webstudio"],
-
     // Remix takes care of building everything in `remix build`.
     "noEmit": true,
     "skipLibCheck": true

package/templates/defaults/vite.config.ts

@@ -1,15 +1,6 @@
-import { resolve } from "node:path";
 import { defineConfig } from "vite";
 import { vitePlugin as remix } from "@remix-run/dev";
 
 export default defineConfig({
   plugins: [remix()],
-  resolve: {
-    alias: [
-      {
-        find: "~",
-        replacement: resolve("app"),
-      },
-    ],
-  },
 });

package/templates/internal/tsconfig.json

@@ -0,0 +1,25 @@
+{
+  "include": ["**/*.ts", "**/*.tsx", "**/*.mjs"],
+  "compilerOptions": {
+    "lib": ["DOM", "DOM.Iterable", "ES2022"],
+    "types": ["@remix-run/node", "vite/client"],
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "target": "ES2022",
+    "strict": true,
+    "allowJs": true,
+    "checkJs": true,
+    "forceConsistentCasingInFileNames": true,
+    "allowImportingTsExtensions": true,
+    "baseUrl": ".",
+    "customConditions": ["webstudio"],
+
+    // Remix takes care of building everything in `remix build`.
+    "noEmit": true,
+    "skipLibCheck": true
+  }
+}

package/templates/netlify-edge-functions/package.json

@@ -3,7 +3,7 @@
     "start": "netlify serve"
   },
   "dependencies": {
-    "@netlify/edge-functions": "^2.3.1",
-    "@netlify/remix-edge-adapter": "3.2.0"
+    "@netlify/edge-functions": "^2.6.0",
+    "@netlify/remix-edge-adapter": "^3.2.2"
   }
 }

package/templates/netlify-edge-functions/vite.config.ts

@@ -1,16 +1,7 @@
-import { resolve } from "node:path";
 import { vitePlugin as remix } from "@remix-run/dev";
 import { defineConfig } from "vite";
 import { netlifyPlugin } from "@netlify/remix-edge-adapter/plugin";
 
 export default defineConfig({
   plugins: [remix(), netlifyPlugin()],
-  resolve: {
-    alias: [
-      {
-        find: "~",
-        replacement: resolve("app"),
-      },
-    ],
-  },
 });

package/templates/netlify-functions/package.json

@@ -4,6 +4,6 @@
   },
   "dependencies": {
     "@netlify/functions": "^2.6.0",
-    "@netlify/remix-adapter": "^2.3.0"
+    "@netlify/remix-adapter": "^2.3.1"
   }
 }

package/templates/netlify-functions/vite.config.ts

@@ -1,16 +1,7 @@
-import { resolve } from "node:path";
 import { vitePlugin as remix } from "@remix-run/dev";
 import { defineConfig } from "vite";
 import { netlifyPlugin } from "@netlify/remix-adapter/plugin";
 
 export default defineConfig({
   plugins: [remix(), netlifyPlugin()],
-  resolve: {
-    alias: [
-      {
-        find: "~",
-        replacement: resolve("app"),
-      },
-    ],
-  },
 });

package/templates/saas-helpers/tsconfig.json

@@ -0,0 +1,34 @@
+{
+  "include": [
+    "**/*.ts",
+    "**/*.tsx",
+    "**/.server/**/*.ts",
+    "**/.server/**/*.tsx",
+    "**/.client/**/*.ts",
+    "**/.client/**/*.tsx"
+  ],
+  "compilerOptions": {
+    "lib": ["DOM", "DOM.Iterable", "ES2022"],
+    "types": [
+      "@remix-run/cloudflare",
+      "vite/client",
+      "@cloudflare/workers-types/2023-07-01"
+    ],
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "resolveJsonModule": true,
+    "target": "ES2022",
+    "strict": true,
+    "allowJs": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "baseUrl": ".",
+    "customConditions": ["webstudio"],
+
+    // Vite takes care of building everything, not tsc.
+    "noEmit": true
+  }
+}