@webstudio-is/react-sdk 0.91.0 → 0.92.0

package/lib/cjs/embed-template.js

@@ -1,368 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var embed_template_exports = {};
-__export(embed_template_exports, {
-  EmbedTemplateInstance: () => EmbedTemplateInstance,
-  EmbedTemplateStyleDecl: () => EmbedTemplateStyleDecl,
-  WsEmbedTemplate: () => WsEmbedTemplate,
-  generateDataFromEmbedTemplate: () => generateDataFromEmbedTemplate,
-  namespaceMeta: () => namespaceMeta
-});
-module.exports = __toCommonJS(embed_template_exports);
-var import_zod = require("zod");
-var import_nanoid = require("nanoid");
-var import_title_case = require("title-case");
-var import_no_case = require("no-case");
-var import_project_build = require("@webstudio-is/project-build");
-var import_css_data = require("@webstudio-is/css-data");
-var import_expression = require("./expression");
-const EmbedTemplateText = import_zod.z.object({
-  type: import_zod.z.literal("text"),
-  value: import_zod.z.string()
-});
-const EmbedTemplateDataSource = import_zod.z.union([
-  import_zod.z.object({
-    type: import_zod.z.literal("variable"),
-    initialValue: import_zod.z.union([
-      import_zod.z.string(),
-      import_zod.z.number(),
-      import_zod.z.boolean(),
-      import_zod.z.array(import_zod.z.string())
-    ])
-  }),
-  import_zod.z.object({
-    type: import_zod.z.literal("expression"),
-    code: import_zod.z.string()
-  })
-]);
-const EmbedTemplateProp = import_zod.z.union([
-  import_zod.z.object({
-    type: import_zod.z.literal("dataSource"),
-    name: import_zod.z.string(),
-    dataSourceName: import_zod.z.string()
-  }),
-  import_zod.z.object({
-    type: import_zod.z.literal("number"),
-    name: import_zod.z.string(),
-    value: import_zod.z.number()
-  }),
-  import_zod.z.object({
-    type: import_zod.z.literal("string"),
-    name: import_zod.z.string(),
-    value: import_zod.z.string()
-  }),
-  import_zod.z.object({
-    type: import_zod.z.literal("boolean"),
-    name: import_zod.z.string(),
-    value: import_zod.z.boolean()
-  }),
-  import_zod.z.object({
-    type: import_zod.z.literal("string[]"),
-    name: import_zod.z.string(),
-    value: import_zod.z.array(import_zod.z.string())
-  }),
-  import_zod.z.object({
-    type: import_zod.z.literal("action"),
-    name: import_zod.z.string(),
-    value: import_zod.z.array(
-      import_zod.z.object({
-        type: import_zod.z.literal("execute"),
-        args: import_zod.z.optional(import_zod.z.array(import_zod.z.string())),
-        code: import_zod.z.string()
-      })
-    )
-  })
-]);
-const EmbedTemplateStyleDeclRaw = import_zod.z.object({
-  // State selector, e.g. :hover
-  state: import_zod.z.optional(import_zod.z.string()),
-  property: import_zod.z.string(),
-  value: import_css_data.StyleValue
-});
-const EmbedTemplateStyleDecl = EmbedTemplateStyleDeclRaw;
-const EmbedTemplateInstance = import_zod.z.lazy(
-  () => import_zod.z.object({
-    type: import_zod.z.literal("instance"),
-    component: import_zod.z.string(),
-    label: import_zod.z.optional(import_zod.z.string()),
-    dataSources: import_zod.z.optional(import_zod.z.record(import_zod.z.string(), EmbedTemplateDataSource)),
-    props: import_zod.z.optional(import_zod.z.array(EmbedTemplateProp)),
-    tokens: import_zod.z.optional(import_zod.z.array(import_zod.z.string())),
-    styles: import_zod.z.optional(import_zod.z.array(EmbedTemplateStyleDecl)),
-    children: WsEmbedTemplate
-  })
-);
-const WsEmbedTemplate = import_zod.z.lazy(
-  () => import_zod.z.array(import_zod.z.union([EmbedTemplateInstance, EmbedTemplateText]))
-);
-const getDataSourceValue = (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 };
-  }
-  value;
-  throw Error("Impossible case");
-};
-const createInstancesFromTemplate = (treeTemplate, instances, props, dataSourceByRef, styleSourceSelections, styleSources, styles, metas, defaultBreakpointId) => {
-  const parentChildren = [];
-  for (const item of treeTemplate) {
-    if (item.type === "instance") {
-      const instanceId = (0, import_nanoid.nanoid)();
-      if (item.dataSources) {
-        for (const [name, dataSource] of Object.entries(item.dataSources)) {
-          if (dataSourceByRef.has(name)) {
-            throw Error(`${name} data source already defined`);
-          }
-          if (dataSource.type === "variable") {
-            dataSourceByRef.set(name, {
-              type: "variable",
-              id: (0, import_nanoid.nanoid)(),
-              scopeInstanceId: instanceId,
-              name,
-              value: getDataSourceValue(dataSource.initialValue)
-            });
-          }
-          if (dataSource.type === "expression") {
-            dataSourceByRef.set(name, {
-              type: "expression",
-              id: (0, import_nanoid.nanoid)(),
-              scopeInstanceId: instanceId,
-              name,
-              // replace all references with variable names
-              code: (0, import_expression.validateExpression)(dataSource.code, {
-                transformIdentifier: (ref) => {
-                  const id = dataSourceByRef.get(ref)?.id ?? ref;
-                  return (0, import_expression.encodeDataSourceVariable)(id);
-                }
-              })
-            });
-          }
-        }
-      }
-      if (item.props) {
-        for (const prop of item.props) {
-          const propId = (0, import_nanoid.nanoid)();
-          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: (0, import_expression.validateExpression)(value.code, {
-                    effectful: true,
-                    transformIdentifier: (ref) => {
-                      if (args.includes(ref)) {
-                        return ref;
-                      }
-                      const id = dataSourceByRef.get(ref)?.id ?? ref;
-                      return (0, import_expression.encodeDataSourceVariable)(id);
-                    }
-                  })
-                };
-              })
-            });
-            continue;
-          }
-          if (prop.type === "dataSource") {
-            const dataSource = dataSourceByRef.get(prop.dataSourceName);
-            if (dataSource === void 0) {
-              throw Error(`${prop.dataSourceName} data source is not defined`);
-            }
-            props.push({
-              id: propId,
-              instanceId,
-              type: "dataSource",
-              name: prop.name,
-              value: dataSource.id
-            });
-            continue;
-          }
-          props.push({ id: propId, instanceId, ...prop });
-        }
-      }
-      const styleSourceIds = [];
-      if (item.tokens) {
-        const meta = metas.get(item.component);
-        if (meta?.presetTokens) {
-          for (const name of item.tokens) {
-            const tokenValue = meta.presetTokens[name];
-            if (tokenValue) {
-              const styleSourceId = `${item.component}:${name}`;
-              styleSourceIds.push(styleSourceId);
-              styleSources.push({
-                type: "token",
-                id: styleSourceId,
-                name: (0, import_title_case.titleCase)((0, import_no_case.noCase)(name))
-              });
-              for (const styleDecl of tokenValue.styles) {
-                styles.push({
-                  breakpointId: defaultBreakpointId,
-                  styleSourceId,
-                  state: styleDecl.state,
-                  property: styleDecl.property,
-                  value: styleDecl.value
-                });
-              }
-            }
-          }
-        }
-      }
-      if (item.styles) {
-        const styleSourceId = (0, import_nanoid.nanoid)();
-        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
-      );
-      parentChildren.push({
-        type: "id",
-        value: instanceId
-      });
-    }
-    if (item.type === "text") {
-      parentChildren.push({
-        type: "text",
-        value: item.value
-      });
-    }
-  }
-  return parentChildren;
-};
-const generateDataFromEmbedTemplate = (treeTemplate, metas, defaultBreakpointId) => {
-  const instances = [];
-  const props = [];
-  const dataSourceByRef = /* @__PURE__ */ new Map();
-  const styleSourceSelections = [];
-  const styleSources = [];
-  const styles = [];
-  const children = createInstancesFromTemplate(
-    treeTemplate,
-    instances,
-    props,
-    dataSourceByRef,
-    styleSourceSelections,
-    styleSources,
-    styles,
-    metas,
-    defaultBreakpointId
-  );
-  return {
-    children,
-    instances,
-    props,
-    dataSources: Array.from(dataSourceByRef.values()),
-    styleSourceSelections,
-    styleSources,
-    styles
-  };
-};
-const namespaceEmbedTemplateComponents = (template, namespace, components) => {
-  return template.map((item) => {
-    if (item.type === "text") {
-      return item;
-    }
-    if (item.type === "instance") {
-      const prefix = components.has(item.component) ? `${namespace}:` : "";
-      return {
-        ...item,
-        component: `${prefix}${item.component}`,
-        children: namespaceEmbedTemplateComponents(
-          item.children,
-          namespace,
-          components
-        )
-      };
-    }
-    item;
-    throw Error("Impossible case");
-  });
-};
-const namespaceMeta = (meta, namespace, components) => {
-  const newMeta = { ...meta };
-  if (newMeta.requiredAncestors) {
-    newMeta.requiredAncestors = newMeta.requiredAncestors.map(
-      (component) => components.has(component) ? `${namespace}:${component}` : component
-    );
-  }
-  if (newMeta.invalidAncestors) {
-    newMeta.invalidAncestors = newMeta.invalidAncestors.map(
-      (component) => components.has(component) ? `${namespace}:${component}` : component
-    );
-  }
-  if (newMeta.indexWithinAncestor) {
-    newMeta.indexWithinAncestor = components.has(newMeta.indexWithinAncestor) ? `${namespace}:${newMeta.indexWithinAncestor}` : newMeta.indexWithinAncestor;
-  }
-  if (newMeta.template) {
-    newMeta.template = namespaceEmbedTemplateComponents(
-      newMeta.template,
-      namespace,
-      components
-    );
-  }
-  return newMeta;
-};