@webstudio-is/sdk-components-react 0.79.0 → 0.80.0

package/lib/blockquote.ws.js

@@ -68,7 +68,8 @@ const meta = {
   order: 3
 };
 const propsMeta = {
-  props
+  props,
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/body.ws.js

@@ -15,7 +15,8 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props
+  props,
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/bold.ws.js

@@ -15,7 +15,8 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props
+  props,
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/box.ws.js

@@ -38,7 +38,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: ["tag"]
+  initialProps: ["id", "tag"]
 };
 export {
   meta,

package/lib/button.ws.js

@@ -30,7 +30,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: ["type", "aria-label"]
+  initialProps: ["id", "type", "aria-label"]
 };
 export {
   meta,

package/lib/checkbox.ws.js

@@ -15,6 +15,7 @@ const presetStyle = {
 };
 const meta = {
   category: "forms",
+  invalidAncestors: ["Button"],
   type: "control",
   label: "Checkbox",
   icon: CheckboxCheckedIcon,
@@ -50,7 +51,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: ["name"]
+  initialProps: ["id", "name"]
 };
 export {
   meta,

package/lib/cjs/blockquote.ws.js

@@ -90,5 +90,6 @@ const meta = {
   order: 3
 };
 const propsMeta = {
-  props: import_blockquote.props
+  props: import_blockquote.props,
+  initialProps: ["id"]
 };

package/lib/cjs/body.ws.js

@@ -37,5 +37,6 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props: import_body.props
+  props: import_body.props,
+  initialProps: ["id"]
 };

package/lib/cjs/bold.ws.js

@@ -37,5 +37,6 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props: import_bold.props
+  props: import_bold.props,
+  initialProps: ["id"]
 };

package/lib/cjs/box.ws.js

@@ -49,5 +49,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_box.props,
-  initialProps: ["tag"]
+  initialProps: ["id", "tag"]
 };

package/lib/cjs/button.ws.js

@@ -52,5 +52,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_button.props,
-  initialProps: ["type", "aria-label"]
+  initialProps: ["id", "type", "aria-label"]
 };

package/lib/cjs/checkbox.ws.js

@@ -37,6 +37,7 @@ const presetStyle = {
 };
 const meta = {
   category: "forms",
+  invalidAncestors: ["Button"],
   type: "control",
   label: "Checkbox",
   icon: import_svg.CheckboxCheckedIcon,
@@ -72,5 +73,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_checkbox.props,
-  initialProps: ["name"]
+  initialProps: ["id", "name"]
 };

package/lib/cjs/code-text.ws.js

@@ -70,5 +70,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_code_text2.props,
-  initialProps: ["inline", "lang", "meta"]
+  initialProps: ["id", "inline", "lang", "meta"]
 };

package/lib/cjs/form.ws.js

@@ -79,5 +79,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_form.props,
-  initialProps: []
+  initialProps: ["id"]
 };

package/lib/cjs/heading.ws.js

@@ -52,5 +52,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_heading.props,
-  initialProps: ["tag"]
+  initialProps: ["id", "tag"]
 };

package/lib/cjs/html-embed.js

@@ -64,7 +64,7 @@ const InnerHtml = (props) => {
 };
 const Placeholder = (props) => {
   const { code, innerRef, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: innerRef, ...rest, style: { padding: "20px" }, children: 'Open "Properties" panel to insert HTML code' });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: innerRef, ...rest, style: { padding: "20px" }, children: 'Open the "Settings" panel to insert HTML code' });
 };
 const HtmlEmbed = (0, import_react.forwardRef)((props, ref) => {
   const { renderer } = (0, import_react.useContext)(import_react_sdk.ReactSdkContext);

package/lib/cjs/html-embed.ws.js

@@ -41,5 +41,6 @@ const propsMeta = {
       type: "string",
       rows: 10
     }
-  }
+  },
+  initialProps: ["id"]
 };

package/lib/cjs/image.ws.js

@@ -65,5 +65,5 @@ const propsMeta = {
     ...import_image.props,
     ...propsOverrides
   },
-  initialProps: ["src", "width", "height", "alt", "loading"]
+  initialProps: ["id", "src", "width", "height", "alt", "loading"]
 };

package/lib/cjs/input.ws.js

@@ -27,10 +27,17 @@ var import_react_sdk = require("@webstudio-is/react-sdk");
 var import_css_normalize = require("@webstudio-is/react-sdk/css-normalize");
 var import_input = require("./__generated__/input.props");
 const presetStyle = {
-  input: import_css_normalize.input
+  input: [
+    ...import_css_normalize.input,
+    {
+      property: "display",
+      value: { type: "keyword", value: "block" }
+    }
+  ]
 };
 const meta = {
   category: "forms",
+  invalidAncestors: ["Button"],
   type: "control",
   label: "Text Input",
   icon: import_svg.FormTextFieldIcon,
@@ -51,5 +58,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_input.props,
-  initialProps: ["name", "type", "placeholder", "required", "autoFocus"]
+  initialProps: ["id", "name", "type", "placeholder", "required", "autoFocus"]
 };

package/lib/cjs/italic.ws.js

@@ -43,5 +43,6 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props: import_italic.props
+  props: import_italic.props,
+  initialProps: ["id"]
 };

package/lib/cjs/label.ws.js

@@ -34,6 +34,7 @@ const presetStyle = {
 };
 const meta = {
   category: "forms",
+  invalidAncestors: ["Button"],
   type: "container",
   label: "Input Label",
   icon: import_svg.TextIcon,
@@ -56,5 +57,5 @@ const propsMeta = {
       label: "For"
     }
   },
-  initialProps: ["htmlFor"]
+  initialProps: ["id", "htmlFor"]
 };

package/lib/cjs/link.ws.js

@@ -75,5 +75,5 @@ const propsMeta = {
       required: false
     }
   },
-  initialProps: ["href", "target"]
+  initialProps: ["id", "href", "target"]
 };

package/lib/cjs/list-item.ws.js

@@ -47,5 +47,6 @@ const meta = {
   order: 4
 };
 const propsMeta = {
-  props: import_list_item.props
+  props: import_list_item.props,
+  initialProps: ["id"]
 };

package/lib/cjs/list.ws.js

@@ -69,5 +69,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_list.props,
-  initialProps: ["ordered", "type", "start", "reversed"]
+  initialProps: ["id", "ordered", "type", "start", "reversed"]
 };

package/lib/cjs/paragraph.ws.js

@@ -46,5 +46,6 @@ const meta = {
   order: 2
 };
 const propsMeta = {
-  props: import_paragraph.props
+  props: import_paragraph.props,
+  initialProps: ["id"]
 };

package/lib/cjs/radio-button.ws.js

@@ -37,6 +37,7 @@ const presetStyle = {
 };
 const meta = {
   category: "forms",
+  invalidAncestors: ["Button"],
   type: "control",
   label: "Radio",
   icon: import_svg.RadioCheckedIcon,
@@ -72,5 +73,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_radio_button.props,
-  initialProps: ["name"]
+  initialProps: ["id", "name"]
 };

package/lib/cjs/separator.ws.js

@@ -66,5 +66,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_separator.props,
-  initialProps: []
+  initialProps: ["id"]
 };

package/lib/cjs/span.ws.js

@@ -37,5 +37,6 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props: import_span.props
+  props: import_span.props,
+  initialProps: ["id"]
 };

package/lib/cjs/subscript.ws.js

@@ -37,5 +37,6 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props: import_subscript.props
+  props: import_subscript.props,
+  initialProps: ["id"]
 };

package/lib/cjs/superscript.ws.js

@@ -37,5 +37,6 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props: import_superscript.props
+  props: import_superscript.props,
+  initialProps: ["id"]
 };

package/lib/cjs/text.ws.js

@@ -53,5 +53,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_text.props,
-  initialProps: ["tag"]
+  initialProps: ["id", "tag"]
 };

package/lib/cjs/textarea.ws.js

@@ -30,7 +30,11 @@ const presetStyle = {
   textarea: [
     ...import_css_normalize.textarea,
     // resize doesn't work well while on canvas
-    { property: "resize", value: { type: "keyword", value: "none" } }
+    { property: "resize", value: { type: "keyword", value: "none" } },
+    {
+      property: "display",
+      value: { type: "keyword", value: "block" }
+    }
   ]
 };
 const meta = {
@@ -55,5 +59,5 @@ const meta = {
 };
 const propsMeta = {
   props: import_textarea.props,
-  initialProps: ["name", "placeholder", "required", "autoFocus"]
+  initialProps: ["id", "name", "placeholder", "required", "autoFocus"]
 };

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

@@ -40,5 +40,6 @@ const meta = {
   states: import_react_sdk.defaultStates
 };
 const propsMeta = {
-  props: import_vimeo_play_button.props
+  props: import_vimeo_play_button.props,
+  initialProps: ["id"]
 };

package/lib/cjs/vimeo-spinner.ws.js

@@ -39,5 +39,6 @@ const meta = {
   requiredAncestors: ["Vimeo"]
 };
 const propsMeta = {
-  props: import_vimeo_spinner.props
+  props: import_vimeo_spinner.props,
+  initialProps: ["id"]
 };

package/lib/cjs/vimeo.js

@@ -282,7 +282,7 @@ const EmptyState = () => {
         justifyContent: "center",
         fontSize: "1.2em"
       },
-      children: "Open the Properties panel and paste a video URL, e.g. https://vimeo.com/831343124."
+      children: 'Open the "Settings" panel and paste a video URL, e.g. https://vimeo.com/831343124.'
     }
   );
 };

package/lib/cjs/vimeo.ws.js

@@ -325,6 +325,7 @@ const meta = {
   ]
 };
 const initialProps = [
+  "id",
   "url",
   "quality",
   "showPreview",

package/lib/code-text.ws.js

@@ -48,7 +48,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: ["inline", "lang", "meta"]
+  initialProps: ["id", "inline", "lang", "meta"]
 };
 export {
   meta,

package/lib/form.ws.js

@@ -57,7 +57,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: []
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/heading.ws.js

@@ -30,7 +30,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: ["tag"]
+  initialProps: ["id", "tag"]
 };
 export {
   meta,

package/lib/html-embed.js

@@ -46,7 +46,7 @@ const InnerHtml = (props) => {
 };
 const Placeholder = (props) => {
   const { code, innerRef, ...rest } = props;
-  return /* @__PURE__ */ jsx("div", { ref: innerRef, ...rest, style: { padding: "20px" }, children: 'Open "Properties" panel to insert HTML code' });
+  return /* @__PURE__ */ jsx("div", { ref: innerRef, ...rest, style: { padding: "20px" }, children: 'Open the "Settings" panel to insert HTML code' });
 };
 const HtmlEmbed = forwardRef((props, ref) => {
   const { renderer } = useContext(ReactSdkContext);

package/lib/html-embed.ws.js

@@ -17,7 +17,8 @@ const propsMeta = {
       type: "string",
       rows: 10
     }
-  }
+  },
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/image.ws.js

@@ -42,7 +42,7 @@ const propsMeta = {
     ...props,
     ...propsOverrides
   },
-  initialProps: ["src", "width", "height", "alt", "loading"]
+  initialProps: ["id", "src", "width", "height", "alt", "loading"]
 };
 export {
   meta,

package/lib/input.ws.js

@@ -5,10 +5,17 @@ import {
 import { input } from "@webstudio-is/react-sdk/css-normalize";
 import { props } from "./__generated__/input.props";
 const presetStyle = {
-  input
+  input: [
+    ...input,
+    {
+      property: "display",
+      value: { type: "keyword", value: "block" }
+    }
+  ]
 };
 const meta = {
   category: "forms",
+  invalidAncestors: ["Button"],
   type: "control",
   label: "Text Input",
   icon: FormTextFieldIcon,
@@ -29,7 +36,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: ["name", "type", "placeholder", "required", "autoFocus"]
+  initialProps: ["id", "name", "type", "placeholder", "required", "autoFocus"]
 };
 export {
   meta,

package/lib/italic.ws.js

@@ -21,7 +21,8 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props
+  props,
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/label.ws.js

@@ -12,6 +12,7 @@ const presetStyle = {
 };
 const meta = {
   category: "forms",
+  invalidAncestors: ["Button"],
   type: "container",
   label: "Input Label",
   icon: TextIcon,
@@ -34,7 +35,7 @@ const propsMeta = {
       label: "For"
     }
   },
-  initialProps: ["htmlFor"]
+  initialProps: ["id", "htmlFor"]
 };
 export {
   meta,

package/lib/link.ws.js

@@ -53,7 +53,7 @@ const propsMeta = {
       required: false
     }
   },
-  initialProps: ["href", "target"]
+  initialProps: ["id", "href", "target"]
 };
 export {
   meta,

package/lib/list-item.ws.js

@@ -25,7 +25,8 @@ const meta = {
   order: 4
 };
 const propsMeta = {
-  props
+  props,
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/list.ws.js

@@ -47,7 +47,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: ["ordered", "type", "start", "reversed"]
+  initialProps: ["id", "ordered", "type", "start", "reversed"]
 };
 export {
   meta,

package/lib/paragraph.ws.js

@@ -24,7 +24,8 @@ const meta = {
   order: 2
 };
 const propsMeta = {
-  props
+  props,
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/radio-button.ws.js

@@ -15,6 +15,7 @@ const presetStyle = {
 };
 const meta = {
   category: "forms",
+  invalidAncestors: ["Button"],
   type: "control",
   label: "Radio",
   icon: RadioCheckedIcon,
@@ -50,7 +51,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: ["name"]
+  initialProps: ["id", "name"]
 };
 export {
   meta,

package/lib/separator.ws.js

@@ -44,7 +44,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: []
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/span.ws.js

@@ -15,7 +15,8 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props
+  props,
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/subscript.ws.js

@@ -15,7 +15,8 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props
+  props,
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/superscript.ws.js

@@ -15,7 +15,8 @@ const meta = {
   presetStyle
 };
 const propsMeta = {
-  props
+  props,
+  initialProps: ["id"]
 };
 export {
   meta,

package/lib/text.ws.js

@@ -31,7 +31,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: ["tag"]
+  initialProps: ["id", "tag"]
 };
 export {
   meta,

package/lib/textarea.ws.js

@@ -8,7 +8,11 @@ const presetStyle = {
   textarea: [
     ...textarea,
     // resize doesn't work well while on canvas
-    { property: "resize", value: { type: "keyword", value: "none" } }
+    { property: "resize", value: { type: "keyword", value: "none" } },
+    {
+      property: "display",
+      value: { type: "keyword", value: "block" }
+    }
   ]
 };
 const meta = {
@@ -33,7 +37,7 @@ const meta = {
 };
 const propsMeta = {
   props,
-  initialProps: ["name", "placeholder", "required", "autoFocus"]
+  initialProps: ["id", "name", "placeholder", "required", "autoFocus"]
 };
 export {
   meta,

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

@@ -18,7 +18,8 @@ const meta = {
   states: defaultStates
 };
 const propsMeta = {
-  props
+  props,
+  initialProps: ["id"]
 };
 export {
   meta,