@webstudio-is/sdk-components-react 0.212.0 → 0.213.0

package/lib/head-link.ws.js

@@ -1,19 +1,19 @@
-import { ResourceIcon as o } from "@webstudio-is/icons/svg";
+import { ResourceIcon as e } from "@webstudio-is/icons/svg";
 import "@webstudio-is/sdk";
-import { props as e } from "./__generated__/head-link.props.js";
+import { props as o } from "./__generated__/head-link.props.js";
 const p = {
   category: "hidden",
-  icon: o,
+  icon: e,
   type: "embed",
-  constraints: {
-    relation: "parent",
-    component: { $eq: "HeadSlot" }
+  contentModel: {
+    category: "none",
+    children: ["empty"]
   }
-}, a = {
-  props: e,
+}, c = {
+  props: o,
   initialProps: ["rel", "hrefLang", "href", "type", "as"]
 };
 export {
   p as meta,
-  a as propsMeta
+  c as propsMeta
 };

package/lib/head-meta.ws.js

@@ -5,9 +5,9 @@ const p = {
   category: "hidden",
   icon: o,
   type: "embed",
-  constraints: {
-    relation: "parent",
-    component: { $eq: "HeadSlot" }
+  contentModel: {
+    category: "none",
+    children: ["empty"]
   }
 }, i = {
   props: t,

package/lib/head-slot.ws.js

@@ -1,20 +1,14 @@
-import { HeaderIcon as o } from "@webstudio-is/icons/svg";
+import { HeaderIcon as e } from "@webstudio-is/icons/svg";
 import "@webstudio-is/sdk";
 import { props as t } from "./__generated__/head.props.js";
 const r = {
-  icon: o,
+  icon: e,
   type: "container",
   description: "Inserts children into the head of the document",
-  constraints: [
-    {
-      relation: "ancestor",
-      component: { $nin: ["HeadSlot"] }
-    },
-    {
-      relation: "child",
-      component: { $in: ["HeadLink", "HeadMeta", "HeadTitle"] }
-    }
-  ]
+  contentModel: {
+    category: "instance",
+    children: ["HeadLink", "HeadMeta", "HeadTitle"]
+  }
 }, a = {
   props: t,
   initialProps: []

package/lib/head-title.ws.js

@@ -1,18 +1,18 @@
 import { WindowTitleIcon as o } from "@webstudio-is/icons/svg";
 import "@webstudio-is/sdk";
 import { props as t } from "./__generated__/head-title.props.js";
-const p = {
+const c = {
   category: "hidden",
   icon: o,
   type: "container",
-  constraints: {
-    relation: "parent",
-    component: { $eq: "HeadSlot" }
+  contentModel: {
+    category: "none",
+    children: ["text"]
   }
 }, i = {
   props: t
 };
 export {
-  p as meta,
+  c as meta,
   i as propsMeta
 };

package/lib/html-embed.ws.js

@@ -1,25 +1,30 @@
 import { EmbedIcon as t } from "@webstudio-is/icons/svg";
+import { descendantComponent as n } from "@webstudio-is/sdk";
 import { props as e } from "./__generated__/html-embed.props.js";
-const i = {
-  div: [
-    {
-      property: "display",
-      value: { type: "keyword", value: "contents" }
-    },
-    {
-      property: "white-space-collapse",
-      value: { type: "keyword", value: "collapse" }
-    }
-  ]
-}, a = {
+const r = {
   category: "general",
-  type: "embed",
+  type: "container",
   label: "HTML Embed",
   description: "Used to add HTML code to the page, such as an SVG or script.",
   icon: t,
-  presetStyle: i,
-  order: 2
-}, s = {
+  order: 2,
+  contentModel: {
+    category: "instance",
+    children: [n]
+  },
+  presetStyle: {
+    div: [
+      {
+        property: "display",
+        value: { type: "keyword", value: "contents" }
+      },
+      {
+        property: "white-space-collapse",
+        value: { type: "keyword", value: "collapse" }
+      }
+    ]
+  }
+}, c = {
   props: {
     ...e,
     clientOnly: {
@@ -41,6 +46,6 @@ const i = {
   initialProps: ["className", "clientOnly", "executeScriptOnCanvas"]
 };
 export {
-  a as meta,
-  s as propsMeta
+  r as meta,
+  c as propsMeta
 };

package/lib/markdown-embed.ws.js

@@ -1,8 +1,13 @@
 import { MarkdownEmbedIcon as e } from "@webstudio-is/icons/svg";
-import { props as o } from "./__generated__/markdown-embed.props.js";
-const t = {
-  type: "embed",
+import { descendantComponent as o } from "@webstudio-is/sdk";
+import { props as t } from "./__generated__/markdown-embed.props.js";
+const a = {
+  type: "container",
   icon: e,
+  contentModel: {
+    category: "instance",
+    children: [o]
+  },
   presetStyle: {
     div: [
       {
@@ -15,9 +20,9 @@ const t = {
       }
     ]
   }
-}, a = {
+}, c = {
   props: {
-    ...o,
+    ...t,
     code: {
       required: !0,
       control: "code",
@@ -28,6 +33,6 @@ const t = {
   initialProps: ["className"]
 };
 export {
-  t as meta,
-  a as propsMeta
+  a as meta,
+  c as propsMeta
 };

package/lib/types/html-embed.ws.d.ts

@@ -1,3 +1,3 @@
-import type { WsComponentMeta, WsComponentPropsMeta } from "@webstudio-is/sdk";
+import { type WsComponentMeta, type WsComponentPropsMeta } from "@webstudio-is/sdk";
 export declare const meta: WsComponentMeta;
 export declare const propsMeta: WsComponentPropsMeta;

package/lib/types/markdown-embed.ws.d.ts

@@ -1,3 +1,3 @@
-import type { WsComponentMeta, WsComponentPropsMeta } from "@webstudio-is/sdk";
+import { type WsComponentMeta, type WsComponentPropsMeta } from "@webstudio-is/sdk";
 export declare const meta: WsComponentMeta;
 export declare const propsMeta: WsComponentPropsMeta;

package/lib/vimeo-play-button.ws.js

@@ -2,30 +2,24 @@ import { defaultStates as t } from "@webstudio-is/sdk";
 import { ButtonElementIcon as o } from "@webstudio-is/icons/svg";
 import { button as e } from "@webstudio-is/sdk/normalize.css";
 import { props as n } from "./__generated__/vimeo-play-button.props.js";
-const r = {
-  button: e
-}, p = {
+const s = {
   category: "hidden",
   type: "container",
-  constraints: [
-    {
-      relation: "ancestor",
-      component: { $in: ["Vimeo", "YouTube"] }
-    },
-    {
-      relation: "ancestor",
-      component: { $neq: "Button" }
-    }
-  ],
   label: "Play Button",
   icon: o,
-  presetStyle: r,
-  states: t
+  states: t,
+  contentModel: {
+    category: "none",
+    children: ["instance"]
+  },
+  presetStyle: {
+    button: e
+  }
 }, c = {
   props: n,
   initialProps: ["id", "className"]
 };
 export {
-  p as meta,
+  s as meta,
   c as propsMeta
 };

package/lib/vimeo-preview-image.ws.js

@@ -1,14 +1,14 @@
 import { meta as e, propsMeta as o } from "./image.ws.js";
 import { props as r } from "./__generated__/vimeo-preview-image.props.js";
-const i = {
+const a = {
   ...e,
   category: "hidden",
   label: "Preview Image",
-  constraints: {
-    relation: "ancestor",
-    component: { $in: ["Vimeo", "YouTube"] }
+  contentModel: {
+    category: "none",
+    children: ["empty"]
   }
-}, p = {
+}, i = {
   props: {
     ...r,
     // Automatically generated props don't have the right control.
@@ -22,6 +22,6 @@ const i = {
   initialProps: o.initialProps
 };
 export {
-  i as meta,
-  p as propsMeta
+  a as meta,
+  i as propsMeta
 };

package/lib/vimeo-spinner.ws.js

@@ -1,25 +1,25 @@
-import { defaultStates as o } from "@webstudio-is/sdk";
-import { div as t } from "@webstudio-is/sdk/normalize.css";
+import { defaultStates as t } from "@webstudio-is/sdk";
+import { div as o } from "@webstudio-is/sdk/normalize.css";
 import { BoxIcon as e } from "@webstudio-is/icons/svg";
 import { props as r } from "./__generated__/vimeo-spinner.props.js";
-const n = {
-  div: t
-}, m = {
+const s = {
   type: "container",
-  constraints: {
-    relation: "ancestor",
-    component: { $in: ["Vimeo", "YouTube"] }
-  },
   icon: e,
-  states: o,
-  presetStyle: n,
+  states: t,
   category: "hidden",
-  label: "Spinner"
+  label: "Spinner",
+  contentModel: {
+    category: "none",
+    children: ["instance"]
+  },
+  presetStyle: {
+    div: o
+  }
 }, c = {
   props: r,
   initialProps: ["id", "className"]
 };
 export {
-  m as meta,
+  s as meta,
   c as propsMeta
 };

package/lib/vimeo.ws.js

@@ -1,19 +1,24 @@
 import { VimeoIcon as o } from "@webstudio-is/icons/svg";
 import { defaultStates as t } from "@webstudio-is/sdk";
-import { div as i } from "@webstudio-is/sdk/normalize.css";
-import { props as n } from "./__generated__/vimeo.props.js";
-const r = {
-  div: i
-}, c = {
+import { div as e } from "@webstudio-is/sdk/normalize.css";
+import { props as i } from "./__generated__/vimeo.props.js";
+const m = {
   type: "container",
   icon: o,
   states: t,
-  presetStyle: r,
-  constraints: {
-    relation: "ancestor",
-    component: { $nin: ["Button", "Link", "Heading"] }
+  contentModel: {
+    category: "instance",
+    children: [
+      "instance",
+      "VimeoSpinner",
+      "VimeoPlayButton",
+      "VimeoPreviewImage"
+    ]
+  },
+  presetStyle: {
+    div: e
   }
-}, e = [
+}, r = [
   "id",
   "className",
   "url",
@@ -31,11 +36,11 @@ const r = {
   "showControls",
   "controlsColor",
   "playsinline"
-], m = {
-  props: n,
-  initialProps: e
+], p = {
+  props: i,
+  initialProps: r
 };
 export {
-  c as meta,
-  m as propsMeta
+  m as meta,
+  p as propsMeta
 };

package/lib/youtube.ws.js

@@ -1,19 +1,24 @@
-import { YoutubeIcon as o } from "@webstudio-is/icons/svg";
-import { defaultStates as t } from "@webstudio-is/sdk";
-import { div as e } from "@webstudio-is/sdk/normalize.css";
-import { props as n } from "./__generated__/youtube.props.js";
-const i = {
-  div: e
-}, c = {
+import { YoutubeIcon as e } from "@webstudio-is/icons/svg";
+import { defaultStates as o } from "@webstudio-is/sdk";
+import { div as t } from "@webstudio-is/sdk/normalize.css";
+import { props as i } from "./__generated__/youtube.props.js";
+const p = {
   type: "container",
-  icon: o,
-  states: t,
-  presetStyle: i,
-  constraints: {
-    relation: "ancestor",
-    component: { $nin: ["Button", "Link", "Heading"] }
+  icon: e,
+  states: o,
+  contentModel: {
+    category: "instance",
+    children: [
+      "instance",
+      "VimeoSpinner",
+      "VimeoPlayButton",
+      "VimeoPreviewImage"
+    ]
+  },
+  presetStyle: {
+    div: t
   }
-}, a = [
+}, n = [
   "id",
   "className",
   "url",
@@ -41,11 +46,11 @@ const i = {
   "language",
   "color",
   "playlist"
-], d = {
-  props: n,
-  initialProps: a
+], c = {
+  props: i,
+  initialProps: n
 };
 export {
-  c as meta,
-  d as propsMeta
+  p as meta,
+  c as propsMeta
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webstudio-is/sdk-components-react",
-  "version": "0.212.0",
+  "version": "0.213.0",
   "description": "Webstudio default library for react",
   "author": "Webstudio <github@webstudio.is>",
   "homepage": "https://webstudio.is",
@@ -49,10 +49,10 @@
     "colord": "^2.9.3",
     "micromark": "^4.0.2",
     "micromark-extension-gfm-table": "^2.1.1",
-    "@webstudio-is/icons": "0.212.0",
-    "@webstudio-is/react-sdk": "0.212.0",
-    "@webstudio-is/sdk": "0.212.0",
-    "@webstudio-is/image": "0.212.0"
+    "@webstudio-is/icons": "0.213.0",
+    "@webstudio-is/image": "0.213.0",
+    "@webstudio-is/react-sdk": "0.213.0",
+    "@webstudio-is/sdk": "0.213.0"
   },
   "devDependencies": {
     "@testing-library/dom": "^10.4.0",
@@ -65,7 +65,7 @@
     "vitest": "^3.0.8",
     "@webstudio-is/generate-arg-types": "0.0.0",
     "@webstudio-is/sdk-cli": "0.94.0",
-    "@webstudio-is/template": "0.212.0",
+    "@webstudio-is/template": "0.213.0",
     "@webstudio-is/tsconfig": "1.0.7"
   },
   "scripts": {