@webstudio-is/react-sdk 0.216.0 → 0.218.0

package/lib/index.js

@@ -179,233 +179,12 @@ var isAttributeNameSafe = (attributeName) => {
   return false;
 };
 
-// src/embed-template.ts
-import { nanoid } from "nanoid";
-import {
-  encodeDataSourceVariable,
-  transpileExpression
-} from "@webstudio-is/sdk";
-var getVariablValue = (value) => {
-  if (typeof value === "string") {
-    return { type: "string", value };
-  }
-  if (typeof value === "number") {
-    return { type: "number", value };
-  }
-  if (typeof value === "boolean") {
-    return { type: "boolean", value };
-  }
-  if (Array.isArray(value)) {
-    return { type: "string[]", value };
-  }
-  return { type: "json", value };
-};
-var createInstancesFromTemplate = (treeTemplate, instances, props, dataSourceByRef, styleSourceSelections, styleSources, styles, metas, defaultBreakpointId, generateId) => {
-  const parentChildren = [];
-  for (const item of treeTemplate) {
-    if (item.type === "instance") {
-      const instanceId = generateId();
-      if (item.variables) {
-        for (const [name, variable] of Object.entries(item.variables)) {
-          if (dataSourceByRef.has(name)) {
-            throw Error(`${name} data source already defined`);
-          }
-          dataSourceByRef.set(name, {
-            type: "variable",
-            id: generateId(),
-            scopeInstanceId: instanceId,
-            name: variable.alias ?? name,
-            value: getVariablValue(variable.initialValue)
-          });
-        }
-      }
-      if (item.props) {
-        for (const prop of item.props) {
-          const propId = generateId();
-          if (prop.type === "expression") {
-            props.push({
-              id: propId,
-              instanceId,
-              name: prop.name,
-              type: "expression",
-              // replace all references with variable names
-              value: transpileExpression({
-                expression: prop.code,
-                replaceVariable: (ref) => {
-                  const id = dataSourceByRef.get(ref)?.id ?? ref;
-                  return encodeDataSourceVariable(id);
-                }
-              })
-            });
-            continue;
-          }
-          if (prop.type === "action") {
-            props.push({
-              id: propId,
-              instanceId,
-              type: "action",
-              name: prop.name,
-              value: prop.value.map((value) => {
-                const args = value.args ?? [];
-                return {
-                  type: "execute",
-                  args,
-                  // replace all references with variable names
-                  code: transpileExpression({
-                    expression: value.code,
-                    replaceVariable: (ref) => {
-                      if (args.includes(ref)) {
-                        return;
-                      }
-                      const id = dataSourceByRef.get(ref)?.id ?? ref;
-                      return encodeDataSourceVariable(id);
-                    }
-                  })
-                };
-              })
-            });
-            continue;
-          }
-          if (prop.type === "parameter") {
-            const dataSourceId = generateId();
-            dataSourceByRef.set(prop.variableName, {
-              type: "parameter",
-              id: dataSourceId,
-              scopeInstanceId: instanceId,
-              name: prop.variableAlias ?? prop.variableName
-            });
-            props.push({
-              id: propId,
-              instanceId,
-              name: prop.name,
-              type: "parameter",
-              // replace variable reference with variable id
-              value: dataSourceId
-            });
-            continue;
-          }
-          props.push({ id: propId, instanceId, ...prop });
-        }
-      }
-      const styleSourceIds = [];
-      if (item.styles) {
-        const styleSourceId = generateId();
-        styleSources.push({
-          type: "local",
-          id: styleSourceId
-        });
-        styleSourceIds.push(styleSourceId);
-        for (const styleDecl of item.styles) {
-          styles.push({
-            breakpointId: defaultBreakpointId,
-            styleSourceId,
-            state: styleDecl.state,
-            property: styleDecl.property,
-            value: styleDecl.value
-          });
-        }
-      }
-      if (styleSourceIds.length > 0) {
-        styleSourceSelections.push({
-          instanceId,
-          values: styleSourceIds
-        });
-      }
-      const instance = {
-        type: "instance",
-        id: instanceId,
-        label: item.label,
-        component: item.component,
-        children: []
-      };
-      instances.push(instance);
-      instance.children = createInstancesFromTemplate(
-        item.children,
-        instances,
-        props,
-        dataSourceByRef,
-        styleSourceSelections,
-        styleSources,
-        styles,
-        metas,
-        defaultBreakpointId,
-        generateId
-      );
-      parentChildren.push({
-        type: "id",
-        value: instanceId
-      });
-    }
-    if (item.type === "text") {
-      parentChildren.push({
-        type: "text",
-        value: item.value,
-        placeholder: item.placeholder
-      });
-    }
-    if (item.type === "expression") {
-      parentChildren.push({
-        type: "expression",
-        // replace all references with variable names
-        value: transpileExpression({
-          expression: item.value,
-          replaceVariable: (ref) => {
-            const id = dataSourceByRef.get(ref)?.id ?? ref;
-            return encodeDataSourceVariable(id);
-          }
-        })
-      });
-    }
-  }
-  return parentChildren;
-};
-var generateDataFromEmbedTemplate = (treeTemplate, metas, generateId = nanoid) => {
-  const instances = [];
-  const props = [];
-  const dataSourceByRef = /* @__PURE__ */ new Map();
-  const styleSourceSelections = [];
-  const styleSources = [];
-  const styles = [];
-  const baseBreakpointId = generateId();
-  const children = createInstancesFromTemplate(
-    treeTemplate,
-    instances,
-    props,
-    dataSourceByRef,
-    styleSourceSelections,
-    styleSources,
-    styles,
-    metas,
-    baseBreakpointId,
-    generateId
-  );
-  const breakpoints = [];
-  if (styles.length > 0) {
-    breakpoints.push({
-      id: baseBreakpointId,
-      label: ""
-    });
-  }
-  return {
-    children,
-    instances,
-    props,
-    dataSources: Array.from(dataSourceByRef.values()),
-    styleSourceSelections,
-    styleSources,
-    styles,
-    breakpoints,
-    assets: [],
-    resources: []
-  };
-};
-
 // src/component-generator.ts
 import {
   parseComponentName,
   generateExpression,
   decodeDataSourceVariable,
-  transpileExpression as transpileExpression2,
+  transpileExpression,
   blockComponent,
   blockTemplateComponent,
   collectionComponent,
@@ -910,7 +689,9 @@ var standardAttributesToReactProps = {
   y: "y",
   ychannelselector: "yChannelSelector",
   z: "z",
-  zoomandpan: "zoomAndPan"
+  zoomandpan: "zoomAndPan",
+  // added by us
+  dirname: "dirName"
 };
 
 // src/component-generator.ts
@@ -925,7 +706,7 @@ var generateAction = ({
   let assignersCode = "";
   for (const value of prop.value) {
     args = value.args;
-    assignersCode += transpileExpression2({
+    assignersCode += transpileExpression({
       expression: value.code,
       executable: true,
       replaceVariable: (identifier, assignee) => {
@@ -1319,7 +1100,6 @@ export {
   animationCanPlayOnCanvasAttribute,
   collapsedAttribute,
   componentAttribute,
-  generateDataFromEmbedTemplate,
   generateJsxChildren,
   generateJsxElement,
   generateRemixParams,

package/lib/types/index.d.ts

@@ -1,6 +1,5 @@
 export * from "./remix";
 export * from "./components/components-utils";
-export * from "./embed-template";
 export * from "./props";
 export type * from "./context";
 export type * from "./hook";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webstudio-is/react-sdk",
-  "version": "0.216.0",
+  "version": "0.218.0",
   "description": "Webstudio JavaScript / TypeScript API",
   "author": "Webstudio <github@webstudio.is>",
   "homepage": "https://webstudio.is",
@@ -14,7 +14,7 @@
     "type-fest": "^4.37.0",
     "vitest": "^3.0.8",
     "zod": "^3.24.2",
-    "@webstudio-is/template": "0.216.0",
+    "@webstudio-is/template": "0.218.0",
     "@webstudio-is/tsconfig": "1.0.7"
   },
   "peerDependencies": {
@@ -25,12 +25,12 @@
   "dependencies": {
     "change-case": "^5.4.4",
     "html-tags": "^4.0.0",
-    "nanoid": "^5.0.9",
-    "@webstudio-is/css-engine": "0.216.0",
-    "@webstudio-is/fonts": "0.216.0",
-    "@webstudio-is/icons": "^0.216.0",
-    "@webstudio-is/sdk": "0.216.0",
-    "@webstudio-is/image": "0.216.0"
+    "nanoid": "^5.1.5",
+    "@webstudio-is/fonts": "0.218.0",
+    "@webstudio-is/icons": "^0.218.0",
+    "@webstudio-is/css-engine": "0.218.0",
+    "@webstudio-is/sdk": "0.218.0",
+    "@webstudio-is/image": "0.218.0"
   },
   "exports": {
     ".": {

package/lib/types/embed-template.d.ts

@@ -1,2 +0,0 @@
-import type { Instance, WebstudioFragment, WsEmbedTemplate, WsComponentMeta } from "@webstudio-is/sdk";
-export declare const generateDataFromEmbedTemplate: (treeTemplate: WsEmbedTemplate, metas: Map<Instance["component"], WsComponentMeta>, generateId?: () => string) => WebstudioFragment;

package/lib/types/embed-template.test.d.ts

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