@webstudio-is/sdk-components-react 0.194.0 → 0.196.0

package/lib/code-text.ws.js

@@ -1,4 +1,4 @@
-import { CodeTextIcon as e } from "@webstudio-is/icons/svg";
+import { BracesIcon as e } from "@webstudio-is/icons/svg";
 import { defaultStates as t } from "@webstudio-is/react-sdk";
 import { code as o } from "@webstudio-is/sdk/normalize.css";
 import { props as r } from "./__generated__/code-text.props.js";
@@ -30,7 +30,7 @@ const p = {
       value: { type: "rgb", r: 238, g: 238, b: 238, alpha: 1 }
     }
   ]
-}, d = {
+}, s = {
   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: 9
-}, s = {
+}, d = {
   props: {
     ...r,
     code: {
@@ -54,6 +54,6 @@ const p = {
   initialProps: ["id", "className", "lang", "code"]
 };
 export {
-  d as meta,
-  s as propsMeta
+  s as meta,
+  d as propsMeta
 };

package/lib/components.js

@@ -4,24 +4,24 @@ import { HtmlEmbed as x } from "./html-embed.js";
 import { MarkdownEmbed as i } from "./markdown-embed.js";
 import { Body as n } from "./body.js";
 import { Box as d } from "./box.js";
-import { Text as u } from "./text.js";
-import { Heading as S } from "./heading.js";
-import { Paragraph as b } from "./paragraph.js";
-import { Link as k } from "./link.js";
-import { RichTextLink as I } from "./rich-text-link.js";
+import { Text as k } from "./text.js";
+import { Heading as u } from "./heading.js";
+import { Paragraph as S } from "./paragraph.js";
+import { Link as L, Link as T } from "./link.js";
 import { Span as F } from "./span.js";
 import { Bold as h } from "./bold.js";
-import { Italic as R } from "./italic.js";
-import { Superscript as y } from "./superscript.js";
-import { Subscript as E } from "./subscript.js";
-import { Button as X } from "./button.js";
-import { Input as v } from "./input.js";
-import { Form as N, Form as O } from "./form.js";
-import { Image as z } from "./image.js";
-import { Blockquote as D } from "./blockquote.js";
-import { List as J } from "./list.js";
-import { ListItem as Q } from "./list-item.js";
-import { Separator as W } from "./separator.js";
+import { Italic as P } from "./italic.js";
+import { Superscript as w } from "./superscript.js";
+import { Subscript as C } from "./subscript.js";
+import { Button as H } from "./button.js";
+import { Input as q } from "./input.js";
+import { WebhookForm as M } from "./webhook-form.js";
+import { Form as O } from "./form.js";
+import { Image as j } from "./image.js";
+import { Blockquote as A } from "./blockquote.js";
+import { List as G } from "./list.js";
+import { ListItem as K } from "./list-item.js";
+import { Separator as U } from "./separator.js";
 import { CodeText as Z } from "./code-text.js";
 import { Label as $ } from "./label.js";
 import { Textarea as ro } from "./textarea.js";
@@ -30,50 +30,50 @@ import { Checkbox as po } from "./checkbox.js";
 import { Vimeo as fo } from "./vimeo.js";
 import { VimeoPreviewImage as ao } from "./vimeo-preview-image.js";
 import { VimeoPlayButton as lo } from "./vimeo-play-button.js";
-import { VimeoSpinner as uo } from "./vimeo-spinner.js";
-import { XmlNode as So } from "./xml-node.js";
-import { XmlTime as bo } from "./xml-time.js";
-import { Time as ko } from "./time.js";
-import { Select as Io } from "./select.js";
-import { Option as Fo } from "./option.js";
+import { VimeoSpinner as ko } from "./vimeo-spinner.js";
+import { XmlNode as uo } from "./xml-node.js";
+import { XmlTime as So } from "./xml-time.js";
+import { Time as Lo } from "./time.js";
+import { Select as go } from "./select.js";
+import { Option as Io } from "./option.js";
 export {
-  D as Blockquote,
+  A as Blockquote,
   n as Body,
   h as Bold,
   d as Box,
-  X as Button,
+  H as Button,
   po as Checkbox,
   Z as CodeText,
-  N as Form,
+  M as Form,
   m as Fragment,
-  S as Heading,
+  u as Heading,
   x as HtmlEmbed,
-  z as Image,
-  v as Input,
-  R as Italic,
+  j as Image,
+  q as Input,
+  P as Italic,
   $ as Label,
-  k as Link,
-  J as List,
-  Q as ListItem,
+  L as Link,
+  G as List,
+  K as ListItem,
   i as MarkdownEmbed,
-  Fo as Option,
-  b as Paragraph,
+  Io as Option,
+  S as Paragraph,
   to as RadioButton,
   O as RemixForm,
-  I as RichTextLink,
-  Io as Select,
-  W as Separator,
+  T as RichTextLink,
+  go as Select,
+  U as Separator,
   e as Slot,
   F as Span,
-  E as Subscript,
-  y as Superscript,
-  u as Text,
+  C as Subscript,
+  w as Superscript,
+  k as Text,
   ro as Textarea,
-  ko as Time,
+  Lo as Time,
   fo as Vimeo,
   lo as VimeoPlayButton,
   ao as VimeoPreviewImage,
-  uo as VimeoSpinner,
-  So as XmlNode,
-  bo as XmlTime
+  ko as VimeoSpinner,
+  uo as XmlNode,
+  So as XmlTime
 };

package/lib/heading.ws.js

@@ -1,16 +1,16 @@
 import { HeadingIcon as t } from "@webstudio-is/icons/svg";
 import { defaultStates as e } from "@webstudio-is/react-sdk";
-import { h1 as n, h2 as o, h3 as a, h4 as r, h5 as i, h6 as s } from "@webstudio-is/sdk/normalize.css";
+import { h1 as o, 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 c = {
-  h1: n,
-  h2: o,
-  h3: a,
-  h4: r,
+  h1: o,
+  h2: n,
+  h3: r,
+  h4: a,
   h5: i,
   h6: s
 }, l = {
-  category: "text",
+  category: "typography",
   type: "container",
   description: "Use HTML headings to structure and organize content. Use the Tag property in settings to change the heading level (h1-h6).",
   icon: t,
@@ -25,13 +25,7 @@ const c = {
     {
       type: "instance",
       component: "Heading",
-      children: [
-        {
-          type: "text",
-          value: "Heading text you can edit",
-          placeholder: !0
-        }
-      ]
+      children: []
     }
   ]
 }, y = {

package/lib/link.ws.js

@@ -5,10 +5,6 @@ import { props as o } from "./__generated__/link.props.js";
 const n = {
   a: [
     ...r,
-    {
-      property: "minHeight",
-      value: { type: "unit", unit: "em", value: 1 }
-    },
     {
       property: "display",
       value: { type: "keyword", value: "inline-block" }
@@ -41,13 +37,7 @@ const n = {
     {
       type: "instance",
       component: "Link",
-      children: [
-        {
-          type: "text",
-          value: "Link text you can edit",
-          placeholder: !0
-        }
-      ]
+      children: []
     }
   ]
 }, c = {
@@ -59,7 +49,7 @@ const n = {
       required: !1
     }
   },
-  initialProps: ["id", "className", "href", "target", "download"]
+  initialProps: ["id", "className", "href", "target", "prefetch", "download"]
 };
 export {
   l as meta,

package/lib/list-item.ws.js

@@ -4,8 +4,8 @@ import { li as o } from "@webstudio-is/sdk/normalize.css";
 import { props as i } from "./__generated__/list-item.props.js";
 const n = {
   li: o
-}, c = {
-  category: "general",
+}, m = {
+  category: "typography",
   type: "container",
   constraints: {
     // cannot use parent relation here
@@ -18,25 +18,19 @@ const n = {
   icon: t,
   states: e,
   presetStyle: n,
-  order: 4,
+  order: 5,
   template: [
     {
       type: "instance",
       component: "ListItem",
-      children: [
-        {
-          type: "text",
-          value: "List Item text you can edit",
-          placeholder: !0
-        }
-      ]
+      children: []
     }
   ]
-}, m = {
+}, c = {
   props: i,
   initialProps: ["id", "className"]
 };
 export {
-  c as meta,
-  m as propsMeta
+  m as meta,
+  c as propsMeta
 };

package/lib/list.template.js

@@ -0,0 +1,15 @@
+import { jsxs as n, jsx as t } from "react/jsx-runtime";
+import { $ as e, PlaceholderValue as i } from "@webstudio-is/template";
+const s = {
+  category: "typography",
+  description: "Groups content, like links in a menu or steps in a recipe.",
+  order: 4,
+  template: /* @__PURE__ */ n(e.List, { children: [
+    /* @__PURE__ */ t(e.ListItem, { children: new i("List Item text you can edit") }),
+    /* @__PURE__ */ t(e.ListItem, { children: new i("List Item text you can edit") }),
+    /* @__PURE__ */ t(e.ListItem, { children: new i("List Item text you can edit") })
+  ] })
+};
+export {
+  s as meta
+};

package/lib/list.ws.js

@@ -1,10 +1,10 @@
 import { ListIcon as e } from "@webstudio-is/icons/svg";
-import { defaultStates as t } from "@webstudio-is/react-sdk";
-import { ol as o, ul as r } from "@webstudio-is/sdk/normalize.css";
+import { defaultStates as r } from "@webstudio-is/react-sdk";
+import { ol as t, ul as o } from "@webstudio-is/sdk/normalize.css";
 import { props as p } from "./__generated__/list.props.js";
 const a = {
   ol: [
-    ...o,
+    ...t,
     {
       property: "marginTop",
       value: { type: "keyword", value: "0" }
@@ -19,7 +19,7 @@ const a = {
     }
   ],
   ul: [
-    ...r,
+    ...o,
     {
       property: "marginTop",
       value: { type: "keyword", value: "0" }
@@ -33,60 +33,16 @@ const a = {
       value: { type: "keyword", value: "40px" }
     }
   ]
-}, y = {
-  category: "general",
+}, d = {
   type: "container",
-  description: "Groups content, like links in a menu or steps in a recipe.",
   icon: e,
-  states: t,
-  presetStyle: a,
-  order: 3,
-  template: [
-    {
-      type: "instance",
-      component: "List",
-      children: [
-        {
-          type: "instance",
-          component: "ListItem",
-          children: [
-            {
-              type: "text",
-              value: "List Item text you can edit",
-              placeholder: !0
-            }
-          ]
-        },
-        {
-          type: "instance",
-          component: "ListItem",
-          children: [
-            {
-              type: "text",
-              value: "List Item text you can edit",
-              placeholder: !0
-            }
-          ]
-        },
-        {
-          type: "instance",
-          component: "ListItem",
-          children: [
-            {
-              type: "text",
-              value: "List Item text you can edit",
-              placeholder: !0
-            }
-          ]
-        }
-      ]
-    }
-  ]
-}, c = {
+  states: r,
+  presetStyle: a
+}, s = {
   props: p,
   initialProps: ["id", "className", "ordered", "start", "reversed"]
 };
 export {
-  y as meta,
-  c as propsMeta
+  d as meta,
+  s as propsMeta
 };

package/lib/metas.js

@@ -17,65 +17,66 @@ import { meta as y } from "./superscript.ws.js";
 import { meta as X } from "./subscript.ws.js";
 import { meta as v } from "./button.ws.js";
 import { meta as N } from "./input.ws.js";
-import { meta as j, meta as z } from "./form.ws.js";
-import { meta as D } from "./image.ws.js";
-import { meta as J } from "./blockquote.ws.js";
-import { meta as Q } from "./list.ws.js";
-import { meta as W } from "./list-item.ws.js";
-import { meta as Z } from "./separator.ws.js";
-import { meta as $ } from "./code-text.ws.js";
-import { meta as te } from "./label.ws.js";
-import { meta as me } from "./textarea.ws.js";
-import { meta as re } from "./radio-button.ws.js";
-import { meta as xe } from "./checkbox.ws.js";
-import { meta as fe } from "./vimeo.ws.js";
-import { meta as ne } from "./vimeo-preview-image.ws.js";
-import { meta as le } from "./vimeo-play-button.ws.js";
-import { meta as ue } from "./vimeo-spinner.ws.js";
-import { meta as Se } from "./xml-node.ws.js";
-import { meta as Te } from "./xml-time.ws.js";
-import { meta as ke } from "./time.ws.js";
-import { meta as Le } from "./select.ws.js";
-import { meta as he } from "./option.ws.js";
+import { meta as j } from "./webhook-form.ws.js";
+import { meta as A } from "./form.ws.js";
+import { meta as G } from "./image.ws.js";
+import { meta as K } from "./blockquote.ws.js";
+import { meta as U } from "./list.ws.js";
+import { meta as Y } from "./list-item.ws.js";
+import { meta as _ } from "./separator.ws.js";
+import { meta as ee } from "./code-text.ws.js";
+import { meta as oe } from "./label.ws.js";
+import { meta as ae } from "./textarea.ws.js";
+import { meta as pe } from "./radio-button.ws.js";
+import { meta as se } from "./checkbox.ws.js";
+import { meta as ie } from "./vimeo.ws.js";
+import { meta as de } from "./vimeo-preview-image.ws.js";
+import { meta as ce } from "./vimeo-play-button.ws.js";
+import { meta as Be } from "./vimeo-spinner.ws.js";
+import { meta as be } from "./xml-node.ws.js";
+import { meta as ge } from "./xml-time.ws.js";
+import { meta as Ie } from "./time.ws.js";
+import { meta as Ve } from "./select.ws.js";
+import { meta as Ce } from "./option.ws.js";
 export {
-  J as Blockquote,
+  K as Blockquote,
   d as Body,
   F as Bold,
   c as Box,
   v as Button,
-  xe as Checkbox,
-  $ as CodeText,
+  se as Checkbox,
+  ee as CodeText,
   i as ContentEmbed,
   j as Form,
   a as Fragment,
   b as Heading,
   p as HtmlEmbed,
-  D as Image,
+  G as Image,
   N as Input,
   R as Italic,
-  te as Label,
+  oe as Label,
   I as Link,
-  Q as List,
-  W as ListItem,
+  U as List,
+  Y as ListItem,
   s as MarkdownEmbed,
-  he as Option,
+  Ce as Option,
   g as Paragraph,
-  re as RadioButton,
-  z as RemixForm,
+  pe as RadioButton,
+  A as RemixForm,
   V as RichTextLink,
-  Le as Select,
-  Z as Separator,
+  Ve as Select,
+  _ as Separator,
   o as Slot,
   C as Span,
   X as Subscript,
   y as Superscript,
   B as Text,
-  me as Textarea,
-  ke as Time,
-  fe as Vimeo,
-  le as VimeoPlayButton,
-  ne as VimeoPreviewImage,
-  ue as VimeoSpinner,
-  Se as XmlNode,
-  Te as XmlTime
+  ae as Textarea,
+  Ie as Time,
+  ie as Vimeo,
+  ce as VimeoPlayButton,
+  de as VimeoPreviewImage,
+  Be as VimeoSpinner,
+  be as XmlNode,
+  ge as XmlTime
 };

package/lib/paragraph.ws.js

@@ -1,11 +1,11 @@
 import { TextAlignLeftIcon as t } from "@webstudio-is/icons/svg";
-import { defaultStates as e } from "@webstudio-is/react-sdk";
-import { p as o } from "@webstudio-is/sdk/normalize.css";
+import { defaultStates as o } from "@webstudio-is/react-sdk";
+import { p as e } from "@webstudio-is/sdk/normalize.css";
 import { props as r } from "./__generated__/paragraph.props.js";
-const a = {
-  p: o
-}, s = {
-  category: "text",
+const n = {
+  p: e
+}, c = {
+  category: "typography",
   type: "container",
   description: "A container for multi-line text.",
   icon: t,
@@ -13,20 +13,14 @@ const a = {
     relation: "ancestor",
     component: { $neq: "Paragraph" }
   },
-  states: e,
-  presetStyle: a,
+  states: o,
+  presetStyle: n,
   order: 2,
   template: [
     {
       type: "instance",
       component: "Paragraph",
-      children: [
-        {
-          type: "text",
-          value: "Paragraph text you can edit",
-          placeholder: !0
-        }
-      ]
+      children: []
     }
   ]
 }, m = {
@@ -34,6 +28,6 @@ const a = {
   initialProps: ["id", "className"]
 };
 export {
-  s as meta,
+  c as meta,
   m as propsMeta
 };

package/lib/props.js

@@ -16,64 +16,65 @@ import { propsMeta as w } from "./superscript.ws.js";
 import { propsMeta as C } from "./subscript.ws.js";
 import { propsMeta as H } from "./button.ws.js";
 import { propsMeta as q } from "./input.ws.js";
-import { propsMeta as N, propsMeta as O } from "./form.ws.js";
-import { propsMeta as z } from "./image.ws.js";
-import { propsMeta as D } from "./blockquote.ws.js";
-import { propsMeta as J } from "./list.ws.js";
-import { propsMeta as Q } from "./list-item.ws.js";
-import { propsMeta as W } from "./separator.ws.js";
-import { propsMeta as Z } from "./code-text.ws.js";
-import { propsMeta as $ } from "./label.ws.js";
-import { propsMeta as ro } from "./textarea.ws.js";
-import { propsMeta as eo } from "./radio-button.ws.js";
-import { propsMeta as ao } from "./checkbox.ws.js";
-import { propsMeta as mo } from "./vimeo.ws.js";
-import { propsMeta as Mo } from "./vimeo-preview-image.ws.js";
-import { propsMeta as io } from "./vimeo-play-button.ws.js";
-import { propsMeta as lo } from "./vimeo-spinner.ws.js";
-import { propsMeta as uo } from "./xml-node.ws.js";
-import { propsMeta as So } from "./xml-time.ws.js";
-import { propsMeta as bo } from "./time.ws.js";
-import { propsMeta as ko } from "./select.ws.js";
-import { propsMeta as Lo } from "./option.ws.js";
+import { propsMeta as N } from "./webhook-form.ws.js";
+import { propsMeta as j } from "./form.ws.js";
+import { propsMeta as A } from "./image.ws.js";
+import { propsMeta as G } from "./blockquote.ws.js";
+import { propsMeta as K } from "./list.ws.js";
+import { propsMeta as U } from "./list-item.ws.js";
+import { propsMeta as Y } from "./separator.ws.js";
+import { propsMeta as _ } from "./code-text.ws.js";
+import { propsMeta as oo } from "./label.ws.js";
+import { propsMeta as po } from "./textarea.ws.js";
+import { propsMeta as to } from "./radio-button.ws.js";
+import { propsMeta as so } from "./checkbox.ws.js";
+import { propsMeta as xo } from "./vimeo.ws.js";
+import { propsMeta as fo } from "./vimeo-preview-image.ws.js";
+import { propsMeta as no } from "./vimeo-play-button.ws.js";
+import { propsMeta as co } from "./vimeo-spinner.ws.js";
+import { propsMeta as Bo } from "./xml-node.ws.js";
+import { propsMeta as To } from "./xml-time.ws.js";
+import { propsMeta as go } from "./time.ws.js";
+import { propsMeta as Io } from "./select.ws.js";
+import { propsMeta as Vo } from "./option.ws.js";
 export {
-  D as Blockquote,
+  G as Blockquote,
   f as Body,
   h as Bold,
   n as Box,
   H as Button,
-  ao as Checkbox,
-  Z as CodeText,
+  so as Checkbox,
+  _ as CodeText,
   N as Form,
   t as Fragment,
   u as Heading,
   s as HtmlEmbed,
-  z as Image,
+  A as Image,
   q as Input,
   P as Italic,
-  $ as Label,
+  oo as Label,
   b as Link,
-  J as List,
-  Q as ListItem,
+  K as List,
+  U as ListItem,
   x as MarkdownEmbed,
-  Lo as Option,
+  Vo as Option,
   S as Paragraph,
-  eo as RadioButton,
-  O as RemixForm,
+  to as RadioButton,
+  j as RemixForm,
   k as RichTextLink,
-  ko as Select,
-  W as Separator,
+  Io as Select,
+  Y as Separator,
   p as Slot,
   L as Span,
   C as Subscript,
   w as Superscript,
   d as Text,
-  ro as Textarea,
-  bo as Time,
-  mo as Vimeo,
-  io as VimeoPlayButton,
-  Mo as VimeoPreviewImage,
-  lo as VimeoSpinner,
-  uo as XmlNode,
-  So as XmlTime
+  po as Textarea,
+  go as Time,
+  xo as Vimeo,
+  no as VimeoPlayButton,
+  fo as VimeoPreviewImage,
+  co as VimeoSpinner,
+  Bo as XmlNode,
+  To as XmlTime
 };

package/lib/separator.ws.js

@@ -1,4 +1,4 @@
-import { DashIcon as e } from "@webstudio-is/icons/svg";
+import { MinusIcon as e } from "@webstudio-is/icons/svg";
 import { defaultStates as o } from "@webstudio-is/react-sdk";
 import { hr as r } from "@webstudio-is/sdk/normalize.css";
 import { props as t } from "./__generated__/separator.props.js";

package/lib/templates.js

@@ -0,0 +1,8 @@
+import { meta as e } from "./button.template.js";
+import { meta as a } from "./list.template.js";
+import { meta as s } from "./vimeo.template.js";
+export {
+  e as Button,
+  a as List,
+  s as Vimeo
+};