@webstudio-is/sdk 0.216.0 → 0.217.0

package/lib/core-templates.js

@@ -132,7 +132,6 @@ var blockMeta = {
   contentModel: {
     category: "instance",
     children: [blockTemplateComponent, "instance"]
-    // @todo prevent deleting block template
   }
 };
 var blockPropsMeta = {

package/lib/index.js

@@ -177,31 +177,6 @@ var Instance = z3.object({
   children: z3.array(InstanceChild)
 });
 var Instances = z3.map(InstanceId, Instance);
-var MatcherRelation = z3.union([
-  z3.literal("ancestor"),
-  z3.literal("parent"),
-  z3.literal("self"),
-  z3.literal("child"),
-  z3.literal("descendant")
-]);
-var MatcherOperation = z3.object({
-  $eq: z3.string().optional(),
-  $neq: z3.string().optional(),
-  $in: z3.array(z3.string()).optional(),
-  $nin: z3.array(z3.string()).optional()
-});
-var Matcher = z3.object({
-  relation: MatcherRelation,
-  component: MatcherOperation.optional(),
-  tag: MatcherOperation.optional(),
-  text: z3.literal(false).describe(
-    `
-      To disallow text editing on a container instance,
-      use: { relation: 'child', text: false }
-     `
-  ).optional()
-});
-var Matchers = z3.union([Matcher, z3.array(Matcher)]);
 
 // src/schema/data-sources.ts
 import { z as z4 } from "zod";
@@ -852,108 +827,19 @@ var PropMeta = z14.union([
   AnimationAction
 ]);
 
-// src/schema/embed-template.ts
+// src/schema/component-meta.ts
 import { z as z15 } from "zod";
 import { StyleValue as StyleValue3 } from "@webstudio-is/css-engine";
-var EmbedTemplateText = z15.object({
-  type: z15.literal("text"),
-  value: z15.string(),
-  placeholder: z15.boolean().optional()
-});
-var EmbedTemplateExpression = z15.object({
-  type: z15.literal("expression"),
-  value: z15.string()
-});
-var EmbedTemplateVariable = z15.object({
-  alias: z15.optional(z15.string()),
-  initialValue: z15.unknown()
-});
-var EmbedTemplateProp = z15.union([
-  z15.object({
-    type: z15.literal("number"),
-    name: z15.string(),
-    value: z15.number()
-  }),
-  z15.object({
-    type: z15.literal("string"),
-    name: z15.string(),
-    value: z15.string()
-  }),
-  z15.object({
-    type: z15.literal("boolean"),
-    name: z15.string(),
-    value: z15.boolean()
-  }),
-  z15.object({
-    type: z15.literal("string[]"),
-    name: z15.string(),
-    value: z15.array(z15.string())
-  }),
-  z15.object({
-    type: z15.literal("json"),
-    name: z15.string(),
-    value: z15.unknown()
-  }),
-  z15.object({
-    type: z15.literal("expression"),
-    name: z15.string(),
-    code: z15.string()
-  }),
-  z15.object({
-    type: z15.literal("parameter"),
-    name: z15.string(),
-    variableName: z15.string(),
-    variableAlias: z15.optional(z15.string())
-  }),
-  z15.object({
-    type: z15.literal("action"),
-    name: z15.string(),
-    value: z15.array(
-      z15.object({
-        type: z15.literal("execute"),
-        args: z15.optional(z15.array(z15.string())),
-        code: z15.string()
-      })
-    )
-  })
-]);
-var EmbedTemplateStyleDeclRaw = z15.object({
+var PresetStyleDecl = z15.object({
   // State selector, e.g. :hover
   state: z15.optional(z15.string()),
   property: z15.string(),
   value: StyleValue3
 });
-var EmbedTemplateStyleDecl = EmbedTemplateStyleDeclRaw;
-var EmbedTemplateInstance = z15.lazy(
-  () => z15.object({
-    type: z15.literal("instance"),
-    component: z15.string(),
-    label: z15.optional(z15.string()),
-    variables: z15.optional(z15.record(z15.string(), EmbedTemplateVariable)),
-    props: z15.optional(z15.array(EmbedTemplateProp)),
-    styles: z15.optional(z15.array(EmbedTemplateStyleDecl)),
-    children: WsEmbedTemplate
-  })
-);
-var WsEmbedTemplate = z15.lazy(
-  () => z15.array(
-    z15.union([EmbedTemplateInstance, EmbedTemplateText, EmbedTemplateExpression])
-  )
-);
-
-// src/schema/component-meta.ts
-import { z as z16 } from "zod";
-import { StyleValue as StyleValue4 } from "@webstudio-is/css-engine";
-var PresetStyleDecl = z16.object({
-  // State selector, e.g. :hover
-  state: z16.optional(z16.string()),
-  property: z16.string(),
-  value: StyleValue4
-});
-var WsComponentPropsMeta = z16.object({
-  props: z16.record(PropMeta),
+var WsComponentPropsMeta = z15.object({
+  props: z15.record(PropMeta),
   // Props that will be always visible in properties panel.
-  initialProps: z16.array(z16.string()).optional()
+  initialProps: z15.array(z15.string()).optional()
 });
 var componentCategories = [
   "general",
@@ -969,10 +855,10 @@ var componentCategories = [
   "internal"
 ];
 var stateCategories = ["states", "component-states"];
-var ComponentState = z16.object({
-  category: z16.enum(stateCategories).optional(),
-  selector: z16.string(),
-  label: z16.string()
+var ComponentState = z15.object({
+  category: z15.enum(stateCategories).optional(),
+  selector: z15.string(),
+  label: z15.string()
 });
 var defaultStates = [
   { selector: ":hover", label: "Hover" },
@@ -981,42 +867,41 @@ var defaultStates = [
   { selector: ":focus-visible", label: "Focus Visible" },
   { selector: ":focus-within", label: "Focus Within" }
 ];
-var ContentModel = z16.object({
+var ComponentContent = z15.string();
+var ContentModel = z15.object({
   /*
    * instance - accepted by any parent with "instance" in children categories
    * none - accepted by parents with this component name in children categories
    */
-  category: z16.union([z16.literal("instance"), z16.literal("none")]),
+  category: z15.union([z15.literal("instance"), z15.literal("none")]),
+  /**
+   * enforce direct children of category or components
+   */
+  children: z15.array(ComponentContent),
   /**
-   * transparent - pass through possible children from parent
-   * rich-text - can be edited as rich text
-   * instance - other instances accepted
-   * ComponentName - accept specific components with none category
+   * enforce descendants of category or components
    */
-  children: z16.array(z16.string())
+  descendants: z15.array(ComponentContent).optional()
 });
-var WsComponentMeta = z16.object({
-  category: z16.enum(componentCategories).optional(),
-  // container - can accept other components with dnd or be edited as text              ..
-  type: z16.enum(["container"]).optional(),
+var WsComponentMeta = z15.object({
+  category: z15.enum(componentCategories).optional(),
   /**
    * a property used as textual placeholder when no content specified while in builder
    * also signals to not insert components inside unless dropped explicitly
    */
-  placeholder: z16.string().optional(),
-  constraints: Matchers.optional(),
+  placeholder: z15.string().optional(),
   contentModel: ContentModel.optional(),
   // when this field is specified component receives
   // prop with index of same components withiin specified ancestor
   // important to automatically enumerate collections without
   // naming every item manually
-  indexWithinAncestor: z16.optional(z16.string()),
-  label: z16.optional(z16.string()),
-  description: z16.string().optional(),
-  icon: z16.string(),
-  presetStyle: z16.optional(z16.record(z16.string(), z16.array(PresetStyleDecl))),
-  states: z16.optional(z16.array(ComponentState)),
-  order: z16.number().optional()
+  indexWithinAncestor: z15.optional(z15.string()),
+  label: z15.optional(z15.string()),
+  description: z15.string().optional(),
+  icon: z15.string(),
+  presetStyle: z15.optional(z15.record(z15.string(), z15.array(PresetStyleDecl))),
+  states: z15.optional(z15.array(ComponentState)),
+  order: z15.number().optional()
 });
 
 // src/core-metas.ts
@@ -1145,7 +1030,6 @@ var blockMeta = {
   contentModel: {
     category: "instance",
     children: [blockTemplateComponent, "instance"]
-    // @todo prevent deleting block template
   }
 };
 var blockPropsMeta = {
@@ -1168,6 +1052,7 @@ var corePropsMetas = {
   [blockTemplateComponent]: blockTemplatePropsMeta
 };
 var isCoreComponent = (component) => component === rootComponent || component === elementComponent || component === collectionComponent || component === descendantComponent || component === blockComponent || component === blockTemplateComponent;
+var isComponentDetachable = (component) => component !== rootComponent && component !== blockTemplateComponent && component !== descendantComponent;
 
 // src/instances-utils.ts
 var ROOT_INSTANCE_ID = ":root";
@@ -2211,10 +2096,6 @@ export {
   DataSourceVariableValue,
   DataSources,
   Deployment,
-  EmbedTemplateInstance,
-  EmbedTemplateProp,
-  EmbedTemplateStyleDecl,
-  EmbedTemplateVariable,
   ExpressionChild,
   Folder,
   FolderName,
@@ -2226,10 +2107,6 @@ export {
   Instance,
   InstanceChild,
   Instances,
-  Matcher,
-  MatcherOperation,
-  MatcherRelation,
-  Matchers,
   OldPagePath,
   PageName,
   PagePath,
@@ -2258,7 +2135,6 @@ export {
   TextChild,
   WebstudioFragment,
   WsComponentMeta,
-  WsEmbedTemplate,
   addFontRules,
   animationActionSchema,
   animationKeyframeSchema,
@@ -2297,6 +2173,7 @@ export {
   getStyleDeclKey,
   initialBreakpoints,
   insetUnitValueSchema,
+  isComponentDetachable,
   isCoreComponent,
   isLiteralExpression,
   isPathnamePattern,

package/lib/types/core-metas.d.ts

@@ -1,4 +1,5 @@
 import type { WsComponentMeta } from "./schema/component-meta";
+import type { Instance } from "./schema/instances";
 export declare const rootComponent = "ws:root";
 export declare const elementComponent = "ws:element";
 export declare const portalComponent = "Slot";
@@ -1025,4 +1026,5 @@ export declare const corePropsMetas: {
         initialProps?: string[] | undefined;
     };
 };
-export declare const isCoreComponent: (component: string) => component is "ws:root" | "ws:element" | "ws:collection" | "ws:descendant" | "ws:block" | "ws:block-template";
+export declare const isCoreComponent: (component: Instance["component"]) => component is "ws:root" | "ws:element" | "ws:collection" | "ws:descendant" | "ws:block" | "ws:block-template";
+export declare const isComponentDetachable: (component: Instance["component"]) => boolean;

package/lib/types/index.d.ts

@@ -11,7 +11,6 @@ export * from "./schema/styles";
 export * from "./schema/deployment";
 export * from "./schema/webstudio";
 export * from "./schema/prop-meta";
-export * from "./schema/embed-template";
 export * from "./schema/component-meta";
 export * from "./core-metas";
 export * from "./instances-utils";

package/lib/types/schema/component-meta.d.ts

@@ -1,7 +1,7 @@
 import { z } from "zod";
 import type { HtmlTags } from "html-tags";
-import { StyleValue, type CssProperty } from "@webstudio-is/css-engine";
 import type { Simplify } from "type-fest";
+import { StyleValue, type CssProperty } from "@webstudio-is/css-engine";
 export declare const PresetStyleDecl: z.ZodObject<{
     state: z.ZodOptional<z.ZodString>;
     property: z.ZodString;
@@ -5913,174 +5913,48 @@ export declare const defaultStates: ComponentState[];
 export declare const ContentModel: z.ZodObject<{
     category: z.ZodUnion<[z.ZodLiteral<"instance">, z.ZodLiteral<"none">]>;
     /**
-     * transparent - pass through possible children from parent
-     * rich-text - can be edited as rich text
-     * instance - other instances accepted
-     * ComponentName - accept specific components with none category
+     * enforce direct children of category or components
+     */
+    children: z.ZodArray<z.ZodType<"instance" | "rich-text" | (string & {}), z.ZodTypeDef, "instance" | "rich-text" | (string & {})>, "many">;
+    /**
+     * enforce descendants of category or components
      */
-    children: z.ZodType<Array<"transparent" | "instance" | "rich-text" | (string & {})>>;
+    descendants: z.ZodOptional<z.ZodArray<z.ZodType<"instance" | "rich-text" | (string & {}), z.ZodTypeDef, "instance" | "rich-text" | (string & {})>, "many">>;
 }, "strip", z.ZodTypeAny, {
-    children: ("instance" | "transparent" | "rich-text" | (string & {}))[];
     category: "none" | "instance";
+    children: ("instance" | "rich-text" | (string & {}))[];
+    descendants?: ("instance" | "rich-text" | (string & {}))[] | undefined;
 }, {
-    children: ("instance" | "transparent" | "rich-text" | (string & {}))[];
     category: "none" | "instance";
+    children: ("instance" | "rich-text" | (string & {}))[];
+    descendants?: ("instance" | "rich-text" | (string & {}))[] | undefined;
 }>;
 export type ContentModel = z.infer<typeof ContentModel>;
 export declare const WsComponentMeta: z.ZodObject<{
     category: z.ZodOptional<z.ZodEnum<["general", "typography", "media", "animations", "data", "forms", "localization", "radix", "xml", "hidden", "internal"]>>;
-    type: z.ZodOptional<z.ZodEnum<["container"]>>;
     /**
      * a property used as textual placeholder when no content specified while in builder
      * also signals to not insert components inside unless dropped explicitly
      */
     placeholder: z.ZodOptional<z.ZodString>;
-    constraints: z.ZodOptional<z.ZodUnion<[z.ZodObject<{
-        relation: z.ZodUnion<[z.ZodLiteral<"ancestor">, z.ZodLiteral<"parent">, z.ZodLiteral<"self">, z.ZodLiteral<"child">, z.ZodLiteral<"descendant">]>;
-        component: z.ZodOptional<z.ZodObject<{
-            $eq: z.ZodOptional<z.ZodString>;
-            $neq: z.ZodOptional<z.ZodString>;
-            $in: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
-            $nin: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
-        }, "strip", z.ZodTypeAny, {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        }, {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        }>>;
-        tag: z.ZodOptional<z.ZodObject<{
-            $eq: z.ZodOptional<z.ZodString>;
-            $neq: z.ZodOptional<z.ZodString>;
-            $in: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
-            $nin: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
-        }, "strip", z.ZodTypeAny, {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        }, {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        }>>;
-        text: z.ZodOptional<z.ZodLiteral<false>>;
-    }, "strip", z.ZodTypeAny, {
-        relation: "ancestor" | "parent" | "self" | "child" | "descendant";
-        tag?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-        text?: false | undefined;
-        component?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-    }, {
-        relation: "ancestor" | "parent" | "self" | "child" | "descendant";
-        tag?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-        text?: false | undefined;
-        component?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-    }>, z.ZodArray<z.ZodObject<{
-        relation: z.ZodUnion<[z.ZodLiteral<"ancestor">, z.ZodLiteral<"parent">, z.ZodLiteral<"self">, z.ZodLiteral<"child">, z.ZodLiteral<"descendant">]>;
-        component: z.ZodOptional<z.ZodObject<{
-            $eq: z.ZodOptional<z.ZodString>;
-            $neq: z.ZodOptional<z.ZodString>;
-            $in: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
-            $nin: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
-        }, "strip", z.ZodTypeAny, {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        }, {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        }>>;
-        tag: z.ZodOptional<z.ZodObject<{
-            $eq: z.ZodOptional<z.ZodString>;
-            $neq: z.ZodOptional<z.ZodString>;
-            $in: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
-            $nin: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
-        }, "strip", z.ZodTypeAny, {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        }, {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        }>>;
-        text: z.ZodOptional<z.ZodLiteral<false>>;
-    }, "strip", z.ZodTypeAny, {
-        relation: "ancestor" | "parent" | "self" | "child" | "descendant";
-        tag?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-        text?: false | undefined;
-        component?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-    }, {
-        relation: "ancestor" | "parent" | "self" | "child" | "descendant";
-        tag?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-        text?: false | undefined;
-        component?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-    }>, "many">]>>;
     contentModel: z.ZodOptional<z.ZodObject<{
         category: z.ZodUnion<[z.ZodLiteral<"instance">, z.ZodLiteral<"none">]>;
         /**
-         * transparent - pass through possible children from parent
-         * rich-text - can be edited as rich text
-         * instance - other instances accepted
-         * ComponentName - accept specific components with none category
+         * enforce direct children of category or components
          */
-        children: z.ZodType<Array<"transparent" | "instance" | "rich-text" | (string & {})>>;
+        children: z.ZodArray<z.ZodType<"instance" | "rich-text" | (string & {}), z.ZodTypeDef, "instance" | "rich-text" | (string & {})>, "many">;
+        /**
+         * enforce descendants of category or components
+         */
+        descendants: z.ZodOptional<z.ZodArray<z.ZodType<"instance" | "rich-text" | (string & {}), z.ZodTypeDef, "instance" | "rich-text" | (string & {})>, "many">>;
     }, "strip", z.ZodTypeAny, {
-        children: ("instance" | "transparent" | "rich-text" | (string & {}))[];
         category: "none" | "instance";
+        children: ("instance" | "rich-text" | (string & {}))[];
+        descendants?: ("instance" | "rich-text" | (string & {}))[] | undefined;
     }, {
-        children: ("instance" | "transparent" | "rich-text" | (string & {}))[];
         category: "none" | "instance";
+        children: ("instance" | "rich-text" | (string & {}))[];
+        descendants?: ("instance" | "rich-text" | (string & {}))[] | undefined;
     }>>;
     indexWithinAncestor: z.ZodOptional<z.ZodString>;
     label: z.ZodOptional<z.ZodString>;
@@ -11159,50 +11033,19 @@ export declare const WsComponentMeta: z.ZodObject<{
 }, "strip", z.ZodTypeAny, {
     icon: string;
     order?: number | undefined;
-    type?: "container" | undefined;
     label?: string | undefined;
     description?: string | undefined;
-    placeholder?: string | undefined;
     states?: {
         selector: string;
         label: string;
         category?: "states" | "component-states" | undefined;
     }[] | undefined;
     category?: "hidden" | "data" | "media" | "general" | "typography" | "animations" | "forms" | "localization" | "radix" | "xml" | "internal" | undefined;
-    constraints?: {
-        relation: "ancestor" | "parent" | "self" | "child" | "descendant";
-        tag?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-        text?: false | undefined;
-        component?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-    } | {
-        relation: "ancestor" | "parent" | "self" | "child" | "descendant";
-        tag?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-        text?: false | undefined;
-        component?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-    }[] | undefined;
+    placeholder?: string | undefined;
     contentModel?: {
-        children: ("instance" | "transparent" | "rich-text" | (string & {}))[];
         category: "none" | "instance";
+        children: ("instance" | "rich-text" | (string & {}))[];
+        descendants?: ("instance" | "rich-text" | (string & {}))[] | undefined;
     } | undefined;
     indexWithinAncestor?: string | undefined;
     presetStyle?: Record<string, {
@@ -11814,50 +11657,19 @@ export declare const WsComponentMeta: z.ZodObject<{
 }, {
     icon: string;
     order?: number | undefined;
-    type?: "container" | undefined;
     label?: string | undefined;
     description?: string | undefined;
-    placeholder?: string | undefined;
     states?: {
         selector: string;
         label: string;
         category?: "states" | "component-states" | undefined;
     }[] | undefined;
     category?: "hidden" | "data" | "media" | "general" | "typography" | "animations" | "forms" | "localization" | "radix" | "xml" | "internal" | undefined;
-    constraints?: {
-        relation: "ancestor" | "parent" | "self" | "child" | "descendant";
-        tag?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-        text?: false | undefined;
-        component?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-    } | {
-        relation: "ancestor" | "parent" | "self" | "child" | "descendant";
-        tag?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-        text?: false | undefined;
-        component?: {
-            $eq?: string | undefined;
-            $neq?: string | undefined;
-            $in?: string[] | undefined;
-            $nin?: string[] | undefined;
-        } | undefined;
-    }[] | undefined;
+    placeholder?: string | undefined;
     contentModel?: {
-        children: ("instance" | "transparent" | "rich-text" | (string & {}))[];
         category: "none" | "instance";
+        children: ("instance" | "rich-text" | (string & {}))[];
+        descendants?: ("instance" | "rich-text" | (string & {}))[] | undefined;
     } | undefined;
     indexWithinAncestor?: string | undefined;
     presetStyle?: Record<string, {