@webstudio-is/react-sdk 0.206.0 → 0.208.0

package/lib/index.js

@@ -156,6 +156,7 @@ var showAttribute = "data-ws-show";
 var indexAttribute = "data-ws-index";
 var collapsedAttribute = "data-ws-collapsed";
 var textContentAttribute = "data-ws-text-content";
+var animationCanPlayOnCanvasAttribute = "data-ws-animation-can-play-on-canvas";
 var attributeNameStartChar = "A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD";
 var attributeNameChar = attributeNameStartChar + ":\\-0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040";
 var validAttributeNameRegex = new RegExp(
@@ -779,33 +780,33 @@ var generateWebstudioComponent = ({
   classesMap
 }) => {
   const instance = instances.get(rootInstanceId);
-  if (instance === void 0) {
-    return "";
-  }
   const indexesWithinAncestors = getIndexesWithinAncestors(metas, instances, [
     rootInstanceId
   ]);
   const usedDataSources = /* @__PURE__ */ new Map();
-  const generatedJsx = generateJsxElement({
-    context: "expression",
-    scope,
-    instance,
-    props,
-    dataSources,
-    usedDataSources,
-    indexesWithinAncestors,
-    classesMap,
-    children: generateJsxChildren({
+  let generatedJsx = "<></>\n";
+  if (instance) {
+    generatedJsx = generateJsxElement({
+      context: "expression",
       scope,
-      children: instance.children,
-      instances,
+      instance,
       props,
       dataSources,
       usedDataSources,
       indexesWithinAncestors,
-      classesMap
-    })
-  });
+      classesMap,
+      children: generateJsxChildren({
+        scope,
+        children: instance.children,
+        instances,
+        props,
+        dataSources,
+        usedDataSources,
+        indexesWithinAncestors,
+        classesMap
+      })
+    });
+  }
   let generatedProps = "";
   let generatedParameters = "";
   const uniqueParameters = new Set(
@@ -861,6 +862,7 @@ var generateWebstudioComponent = ({
   return generatedComponent;
 };
 export {
+  animationCanPlayOnCanvasAttribute,
   collapsedAttribute,
   componentAttribute,
   generateDataFromEmbedTemplate,

package/lib/runtime.js

@@ -7,7 +7,8 @@ import {
 var ReactSdkContext = createContext({
   assetBaseUrl: "/",
   imageLoader: ({ src }) => src,
-  resources: {}
+  resources: {},
+  breakpoints: []
 });
 var useResource = (name) => {
   const { resources } = useContext(ReactSdkContext);

package/lib/types/context.d.ts

@@ -22,5 +22,10 @@ export type Params = {
 export declare const ReactSdkContext: import("react").Context<Params & {
     imageLoader: ImageLoader;
     resources: Record<string, any>;
+    breakpoints: {
+        id: string;
+        minWidth?: number;
+        maxWidth?: number;
+    }[];
 }>;
 export declare const useResource: (name: string) => any;

package/lib/types/props.d.ts

@@ -394,6 +394,7 @@ export declare const normalizeProps: ({ props, assetBaseUrl, assets, uploadingIm
             };
             name?: string | undefined;
             description?: string | undefined;
+            enabled?: [string, boolean][] | undefined;
         }[];
         source?: "closest" | "nearest" | "root" | undefined;
         axis?: "block" | "x" | "inline" | "y" | undefined;
@@ -699,6 +700,7 @@ export declare const normalizeProps: ({ props, assetBaseUrl, assets, uploadingIm
             };
             name?: string | undefined;
             description?: string | undefined;
+            enabled?: [string, boolean][] | undefined;
         }[];
         subject?: string | undefined;
         axis?: "block" | "x" | "inline" | "y" | undefined;
@@ -740,4 +742,5 @@ export declare const showAttribute: "data-ws-show";
 export declare const indexAttribute: "data-ws-index";
 export declare const collapsedAttribute: "data-ws-collapsed";
 export declare const textContentAttribute: "data-ws-text-content";
+export declare const animationCanPlayOnCanvasAttribute = "data-ws-animation-can-play-on-canvas";
 export declare const isAttributeNameSafe: (attributeName: string) => boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webstudio-is/react-sdk",
-  "version": "0.206.0",
+  "version": "0.208.0",
   "description": "Webstudio JavaScript / TypeScript API",
   "author": "Webstudio <github@webstudio.is>",
   "homepage": "https://webstudio.is",
@@ -11,10 +11,10 @@
     "react": "18.3.0-canary-14898b6a9-20240318",
     "react-dom": "18.3.0-canary-14898b6a9-20240318",
     "strip-indent": "^4.0.0",
-    "type-fest": "^4.32.0",
-    "vitest": "^3.0.4",
+    "type-fest": "^4.37.0",
+    "vitest": "^3.0.8",
     "zod": "^3.22.4",
-    "@webstudio-is/template": "0.206.0",
+    "@webstudio-is/template": "0.208.0",
     "@webstudio-is/tsconfig": "1.0.7"
   },
   "peerDependencies": {
@@ -26,11 +26,11 @@
     "change-case": "^5.4.4",
     "html-tags": "^4.0.0",
     "nanoid": "^5.0.9",
-    "@webstudio-is/css-engine": "0.206.0",
-    "@webstudio-is/fonts": "0.206.0",
-    "@webstudio-is/icons": "^0.206.0",
-    "@webstudio-is/image": "0.206.0",
-    "@webstudio-is/sdk": "0.206.0"
+    "@webstudio-is/css-engine": "0.208.0",
+    "@webstudio-is/fonts": "0.208.0",
+    "@webstudio-is/icons": "^0.208.0",
+    "@webstudio-is/image": "0.208.0",
+    "@webstudio-is/sdk": "0.208.0"
   },
   "exports": {
     ".": {

package/placeholder.d.ts

@@ -11,6 +11,12 @@ declare module "__CLIENT__" {
 
   export const favIconAsset: string | undefined;
 
+  export const breakpoints: {
+    id: string;
+    minWidth?: number;
+    maxWidth?: number;
+  }[];
+
   // Font assets on current page (can be preloaded)
   export const pageFontAssets: string[];