@webstudio-is/react-sdk 0.134.0 → 0.136.0

package/lib/index.js

@@ -649,6 +649,7 @@ import { StyleValue } from "@webstudio-is/css-engine";
 import jsep from "jsep";
 import jsepAssignment from "@jsep-plugin/assignment";
 import jsepObject from "@jsep-plugin/object";
+jsep.literals["undefined"] = "undefined";
 jsep.plugins.register(jsepAssignment);
 jsep.plugins.register(jsepObject);
 var generateCode = (node, failOnForbidden, options) => {
@@ -772,6 +773,31 @@ var validateExpression = (code, options) => {
     transformIdentifier
   });
 };
+var isLiteralNode = (node) => {
+  if (node.type === "Literal") {
+    return true;
+  }
+  if (node.type === "ArrayExpression") {
+    return node.elements.every(isLiteralNode);
+  }
+  if (node.type === "ObjectExpression") {
+    return node.properties.every((property) => {
+      const key = property.key;
+      const isIdentifierKey = key.type === "Identifier" && property.computed === false;
+      const isLiteralKey = key.type === "Literal";
+      return (isLiteralKey || isIdentifierKey) && isLiteralNode(property.value);
+    });
+  }
+  return false;
+};
+var isLiteralExpression = (expression) => {
+  try {
+    const node = jsep(expression);
+    return isLiteralNode(node);
+  } catch {
+    return false;
+  }
+};
 var dataSourceVariablePrefix = "$ws$dataSource$";
 var encodeDataSourceVariable = (id) => {
   const encoded = id.replaceAll("-", "__DASH__");
@@ -1816,6 +1842,12 @@ var generatePageMeta = ({
     usedDataSources,
     scope: localScope
   });
+  const languageExpression = generateExpression({
+    expression: page.meta.language ?? "undefined",
+    dataSources,
+    usedDataSources,
+    scope: localScope
+  });
   const socialImageAssetIdExpression = JSON.stringify(
     page.meta.socialImageAssetId
   );
@@ -1910,6 +1942,8 @@ var generatePageMeta = ({
   generated += `    description: ${descriptionExpression},
 `;
   generated += `    excludePageFromSearch: ${excludePageFromSearchExpression},
+`;
+  generated += `    language: ${languageExpression},
 `;
   generated += `    socialImageAssetId: ${socialImageAssetIdExpression},
 `;
@@ -1952,6 +1986,7 @@ export {
   executeExpression,
   generateCss,
   generateDataFromEmbedTemplate,
+  generateExpression,
   generateJsxChildren,
   generateJsxElement,
   generatePageMeta,
@@ -1968,6 +2003,7 @@ export {
   getStyleRules,
   idAttribute,
   indexAttribute,
+  isLiteralExpression,
   namespaceMeta,
   normalizeProps,
   portalComponent,

package/lib/types/components/components-utils.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
 import { componentAttribute, idAttribute } from "../props";
-export type AnyComponent = React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
+export type AnyComponent = React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & WebstudioComponentSystemProps & React.RefAttributes<HTMLElement>>;
+export type Components = Map<string, AnyComponent>;
+export type WebstudioComponentSystemProps = {
     [componentAttribute]: string;
     [idAttribute]: string;
-} & React.RefAttributes<HTMLElement>>;
-export type Components = Map<string, AnyComponent>;
+};

package/lib/types/expression.d.ts

@@ -12,6 +12,12 @@ export declare const validateExpression: (code: string, options?: {
     optional?: boolean;
     transformIdentifier?: TransformIdentifier;
 }) => string;
+/**
+ * check whether provided expression is a literal value
+ * like "", 0 or { param: "value" }
+ * which does not depends on any variable
+ */
+export declare const isLiteralExpression: (expression: string) => boolean;
 export declare const encodeDataSourceVariable: (id: string) => string;
 export declare const decodeDataSourceVariable: (name: string) => string | undefined;
 export declare const generateExpression: ({ expression, dataSources, usedDataSources, scope, }: {

package/lib/types/index.d.ts

@@ -9,7 +9,7 @@ export { type WsComponentPropsMeta, type ComponentState, type PresetStyle, WsCom
 export * from "./embed-template";
 export * from "./props";
 export * from "./context";
-export { validateExpression, encodeDataSourceVariable, decodeDataSourceVariable, executeExpression, } from "./expression";
+export * from "./expression";
 export { getIndexesWithinAncestors } from "./instance-utils";
 export * from "./hook";
 export { generateUtilsExport } from "./generator";

package/lib/types/page-meta-generator.d.ts

@@ -3,6 +3,7 @@ export type PageMeta = {
     title: string;
     description?: string;
     excludePageFromSearch?: boolean;
+    language?: string;
     socialImageAssetId?: Asset["id"];
     socialImageUrl?: string;
     status?: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webstudio-is/react-sdk",
-  "version": "0.134.0",
+  "version": "0.136.0",
   "description": "Webstudio JavaScript / TypeScript API",
   "author": "Webstudio <github@webstudio.is>",
   "homepage": "https://webstudio.is",
@@ -16,8 +16,8 @@
     "type-fest": "^4.3.1",
     "typescript": "5.2.2",
     "zod": "^3.21.4",
-    "@webstudio-is/tsconfig": "1.0.7",
-    "@webstudio-is/jest-config": "1.0.7"
+    "@webstudio-is/jest-config": "1.0.7",
+    "@webstudio-is/tsconfig": "1.0.7"
   },
   "peerDependencies": {
     "@remix-run/react": "^1.19.1",
@@ -33,11 +33,11 @@
     "jsep": "^1.3.8",
     "nanoid": "^5.0.1",
     "title-case": "^4.1.0",
-    "@webstudio-is/css-engine": "0.134.0",
-    "@webstudio-is/image": "0.134.0",
-    "@webstudio-is/sdk": "0.134.0",
-    "@webstudio-is/fonts": "0.134.0",
-    "@webstudio-is/icons": "^0.134.0"
+    "@webstudio-is/image": "0.136.0",
+    "@webstudio-is/icons": "^0.136.0",
+    "@webstudio-is/fonts": "0.136.0",
+    "@webstudio-is/sdk": "0.136.0",
+    "@webstudio-is/css-engine": "0.136.0"
   },
   "exports": {
     ".": {