@webstudio-is/sdk-components-react 0.204.0 → 0.206.0

package/lib/blockquote.ws.js

@@ -4,60 +4,61 @@ import { props as p } from "./__generated__/blockquote.props.js";
 const r = {
   blockquote: [
     {
-      property: "marginTop",
+      property: "margin-top",
       value: { type: "unit", value: 0, unit: "number" }
     },
     {
-      property: "marginRight",
+      property: "margin-right",
       value: { type: "unit", value: 0, unit: "number" }
     },
     {
-      property: "marginBottom",
+      property: "margin-bottom",
       value: { type: "unit", value: 10, unit: "px" }
     },
     {
-      property: "marginLeft",
+      property: "margin-left",
       value: { type: "unit", value: 0, unit: "number" }
     },
     {
-      property: "paddingTop",
+      property: "padding-top",
       value: { type: "unit", value: 10, unit: "px" }
     },
     {
-      property: "paddingBottom",
+      property: "padding-bottom",
       value: { type: "unit", value: 10, unit: "px" }
     },
     {
-      property: "paddingLeft",
+      property: "padding-left",
       value: { type: "unit", value: 20, unit: "px" }
     },
     {
-      property: "paddingRight",
+      property: "padding-right",
       value: { type: "unit", value: 20, unit: "px" }
     },
     {
-      property: "borderLeftWidth",
+      property: "border-left-width",
       value: { type: "unit", value: 5, unit: "px" }
     },
     {
-      property: "borderLeftStyle",
+      property: "border-left-style",
       value: { type: "keyword", value: "solid" }
     },
     {
-      property: "borderLeftColor",
+      property: "border-left-color",
       value: { type: "rgb", r: 226, g: 226, b: 226, alpha: 1 }
     }
   ]
 }, i = {
   type: "container",
+  placeholder: "Blockquote",
   icon: t,
   states: e,
   presetStyle: r
-}, n = {
+}, l = {
   props: p,
   initialProps: ["id", "className", "cite"]
 };
 export {
   i as meta,
-  n as propsMeta
+  l as propsMeta
 };

package/lib/body.ws.js

@@ -6,15 +6,15 @@ const a = {
   body: [
     ...e,
     {
-      property: "WebkitFontSmoothing",
+      property: "-webkit-font-smoothing",
       value: { type: "keyword", value: "antialiased" }
     },
     {
-      property: "MozOsxFontSmoothing",
+      property: "-moz-osx-font-smoothing",
       value: { type: "keyword", value: "grayscale" }
     }
   ]
-}, m = {
+}, n = {
   type: "container",
   icon: o,
   states: t,
@@ -24,6 +24,6 @@ const a = {
   initialProps: ["id", "className"]
 };
 export {
-  m as meta,
+  n as meta,
   y as propsMeta
 };

package/lib/checkbox.ws.js

@@ -6,7 +6,7 @@ const r = {
   input: [
     ...o,
     {
-      property: "marginRight",
+      property: "margin-right",
       value: { type: "unit", unit: "em", value: 0.5 }
     }
   ]

package/lib/code-text.ws.js

@@ -10,27 +10,27 @@ const p = {
       value: { type: "keyword", value: "block" }
     },
     {
-      property: "whiteSpaceCollapse",
+      property: "white-space-collapse",
       value: { type: "keyword", value: "preserve" }
     },
     {
-      property: "textWrapMode",
+      property: "text-wrap-mode",
       value: { type: "keyword", value: "wrap" }
     },
     {
-      property: "paddingLeft",
+      property: "padding-left",
       value: { type: "unit", value: 0.2, unit: "em" }
     },
     {
-      property: "paddingRight",
+      property: "padding-right",
       value: { type: "unit", value: 0.2, unit: "em" }
     },
     {
-      property: "backgroundColor",
+      property: "background-color",
       value: { type: "rgb", r: 238, g: 238, b: 238, alpha: 1 }
     }
   ]
-}, s = {
+}, i = {
   category: "general",
   type: "embed",
   description: "Use this component when you want to display code as text on the page.",
@@ -42,7 +42,7 @@ const p = {
   states: t,
   presetStyle: p,
   order: 5
-}, d = {
+}, c = {
   props: {
     ...r,
     code: {
@@ -54,6 +54,6 @@ const p = {
   initialProps: ["id", "className", "lang", "code"]
 };
 export {
-  s as meta,
-  d as propsMeta
+  i as meta,
+  c as propsMeta
 };

package/lib/form.ws.js

@@ -5,7 +5,7 @@ import { props as e } from "./__generated__/form.props.js";
 const n = {
   form: [
     ...r,
-    { property: "minHeight", value: { type: "unit", unit: "px", value: 20 } }
+    { property: "min-height", value: { type: "unit", unit: "px", value: 20 } }
   ]
 }, p = {
   category: "forms",

package/lib/heading.ws.js

@@ -1,28 +1,29 @@
 import { HeadingIcon as t } from "@webstudio-is/icons/svg";
 import { defaultStates as o } from "@webstudio-is/sdk";
-import { h1 as e, h2 as n, h3 as r, h4 as a, h5 as s, h6 as i } from "@webstudio-is/sdk/normalize.css";
+import { h1 as e, h2 as n, h3 as r, h4 as a, h5 as i, h6 as s } from "@webstudio-is/sdk/normalize.css";
 import { props as p } from "./__generated__/heading.props.js";
-const m = {
+const c = {
   h1: e,
   h2: n,
   h3: r,
   h4: a,
-  h5: s,
-  h6: i
-}, d = {
+  h5: i,
+  h6: s
+}, f = {
   type: "container",
+  placeholder: "Heading",
   icon: t,
   constraints: {
     relation: "ancestor",
     component: { $neq: "Heading" }
   },
   states: o,
-  presetStyle: m
+  presetStyle: c
 }, g = {
   props: p,
   initialProps: ["id", "className", "tag"]
 };
 export {
-  d as meta,
+  f as meta,
   g as propsMeta
 };

package/lib/html-embed.ws.js

@@ -7,7 +7,7 @@ const i = {
       value: { type: "keyword", value: "contents" }
     },
     {
-      property: "whiteSpaceCollapse",
+      property: "white-space-collapse",
       value: { type: "keyword", value: "collapse" }
     }
   ]
@@ -19,7 +19,7 @@ const i = {
   icon: t,
   presetStyle: i,
   order: 2
-}, r = {
+}, s = {
   props: {
     ...e,
     clientOnly: {
@@ -42,5 +42,5 @@ const i = {
 };
 export {
   a as meta,
-  r as propsMeta
+  s as propsMeta
 };

package/lib/image.ws.js

@@ -7,7 +7,7 @@ const a = {
     ...o,
     // Otherwise on new image insert onto canvas it can overfit screen size multiple times
     {
-      property: "maxWidth",
+      property: "max-width",
       value: { type: "unit", unit: "%", value: 100 }
     },
     // inline | inline-block is not suitable because without line-height: 0 on the parent you get unsuitable spaces/margins

package/lib/italic.ws.js

@@ -6,7 +6,7 @@ const r = {
   i: [
     ...o,
     {
-      property: "fontStyle",
+      property: "font-style",
       value: { type: "keyword", value: "italic" }
     }
   ]

package/lib/link.ws.js

@@ -12,6 +12,7 @@ const a = {
   ]
 }, l = {
   type: "container",
+  placeholder: "Link",
   icon: e,
   constraints: {
     relation: "ancestor",

package/lib/list-item.ws.js

@@ -6,6 +6,7 @@ const s = {
   li: e
 }, m = {
   type: "container",
+  placeholder: "List item",
   constraints: {
     // cannot use parent relation here
     // because list item can be put inside of collection or slot

package/lib/list.ws.js

@@ -1,42 +1,42 @@
 import { ListIcon as e } from "@webstudio-is/icons/svg";
-import { defaultStates as r } from "@webstudio-is/sdk";
-import { ol as t, ul as o } from "@webstudio-is/sdk/normalize.css";
+import { defaultStates as t } from "@webstudio-is/sdk";
+import { ol as r, ul as o } from "@webstudio-is/sdk/normalize.css";
 import { props as p } from "./__generated__/list.props.js";
 const a = {
   ol: [
-    ...t,
+    ...r,
     {
-      property: "marginTop",
+      property: "margin-top",
       value: { type: "keyword", value: "0" }
     },
     {
-      property: "marginBottom",
+      property: "margin-bottom",
       value: { type: "keyword", value: "10px" }
     },
     {
-      property: "paddingLeft",
+      property: "padding-left",
       value: { type: "keyword", value: "40px" }
     }
   ],
   ul: [
     ...o,
     {
-      property: "marginTop",
+      property: "margin-top",
       value: { type: "keyword", value: "0" }
     },
     {
-      property: "marginBottom",
+      property: "margin-bottom",
       value: { type: "keyword", value: "10px" }
     },
     {
-      property: "paddingLeft",
+      property: "padding-left",
       value: { type: "keyword", value: "40px" }
     }
   ]
 }, d = {
   type: "container",
   icon: e,
-  states: r,
+  states: t,
   presetStyle: a
 }, s = {
   props: p,

package/lib/markdown-embed.ws.js

@@ -10,7 +10,7 @@ const t = {
         value: { type: "keyword", value: "contents" }
       },
       {
-        property: "whiteSpaceCollapse",
+        property: "white-space-collapse",
         value: { type: "keyword", value: "collapse" }
       }
     ]

package/lib/option.ws.js

@@ -3,7 +3,7 @@ import { props as t } from "./__generated__/option.props.js";
 const o = {
   option: [
     {
-      property: "backgroundColor",
+      property: "background-color",
       state: ":checked",
       value: {
         type: "rgb",

package/lib/paragraph.ws.js

@@ -2,22 +2,23 @@ import { TextAlignLeftIcon as t } from "@webstudio-is/icons/svg";
 import { defaultStates as o } from "@webstudio-is/sdk";
 import { p as r } from "@webstudio-is/sdk/normalize.css";
 import { props as e } from "./__generated__/paragraph.props.js";
-const n = {
+const a = {
   p: r
-}, m = {
+}, c = {
   type: "container",
+  placeholder: "Paragraph",
   icon: t,
   constraints: {
     relation: "ancestor",
     component: { $neq: "Paragraph" }
   },
   states: o,
-  presetStyle: n
-}, c = {
+  presetStyle: a
+}, m = {
   props: e,
   initialProps: ["id", "className"]
 };
 export {
-  m as meta,
-  c as propsMeta
+  c as meta,
+  m as propsMeta
 };

package/lib/radio-button.ws.js

@@ -6,7 +6,7 @@ const i = {
   input: [
     ...o,
     {
-      property: "marginRight",
+      property: "margin-right",
       value: { type: "unit", unit: "em", value: 0.5 }
     }
   ]

package/lib/separator.ws.js

@@ -10,23 +10,23 @@ const p = {
       value: { type: "keyword", value: "1px" }
     },
     {
-      property: "backgroundColor",
+      property: "background-color",
       value: { type: "keyword", value: "gray" }
     },
     {
-      property: "borderTopStyle",
+      property: "border-top-style",
       value: { type: "keyword", value: "none" }
     },
     {
-      property: "borderRightStyle",
+      property: "border-right-style",
       value: { type: "keyword", value: "none" }
     },
     {
-      property: "borderLeftStyle",
+      property: "border-left-style",
       value: { type: "keyword", value: "none" }
     },
     {
-      property: "borderBottomStyle",
+      property: "border-bottom-style",
       value: { type: "keyword", value: "none" }
     }
   ]
@@ -38,11 +38,11 @@ const p = {
   states: o,
   presetStyle: p,
   order: 3
-}, d = {
+}, s = {
   props: t,
   initialProps: ["id", "className"]
 };
 export {
   n as meta,
-  d as propsMeta
+  s as propsMeta
 };

package/lib/text.ws.js

@@ -6,7 +6,7 @@ const r = {
   div: [
     ...o,
     {
-      property: "minHeight",
+      property: "min-height",
       value: { type: "unit", unit: "em", value: 1 }
     }
   ]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webstudio-is/sdk-components-react",
-  "version": "0.204.0",
+  "version": "0.206.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.1",
     "micromark-extension-gfm-table": "^2.1.0",
-    "@webstudio-is/icons": "0.204.0",
-    "@webstudio-is/image": "0.204.0",
-    "@webstudio-is/react-sdk": "0.204.0",
-    "@webstudio-is/sdk": "0.204.0"
+    "@webstudio-is/icons": "0.206.0",
+    "@webstudio-is/image": "0.206.0",
+    "@webstudio-is/react-sdk": "0.206.0",
+    "@webstudio-is/sdk": "0.206.0"
   },
   "devDependencies": {
     "@testing-library/react": "^14.2.2",
@@ -63,7 +63,7 @@
     "vitest": "^3.0.4",
     "@webstudio-is/generate-arg-types": "0.0.0",
     "@webstudio-is/sdk-cli": "0.94.0",
-    "@webstudio-is/template": "0.204.0",
+    "@webstudio-is/template": "0.206.0",
     "@webstudio-is/tsconfig": "1.0.7"
   },
   "scripts": {