@webstudio-is/sdk-components-react 0.88.0 → 0.90.0

package/lib/__generated__/vimeo-spinner.props.js

@@ -1,6 +1,11 @@
 const props = {
   about: { required: false, control: "text", type: "string" },
-  accessKey: { required: false, control: "text", type: "string" },
+  accessKey: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Keyboard shortcut to activate or add focus to the element."
+  },
   "aria-activedescendant": {
     description: "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.",
     required: false,
@@ -156,7 +161,7 @@ const props = {
     type: "string"
   },
   "aria-label": {
-    description: "Defines a string value that labels the current element.\n@see aria-labelledby.",
+    description: "Provides the accessible name that describes an interactive element if no other accessible name exists, for example in a button that contains an image with no text.",
     required: false,
     control: "text",
     type: "string"
@@ -332,20 +337,65 @@ const props = {
     control: "text",
     type: "string"
   },
-  autoCapitalize: { required: false, control: "text", type: "string" },
+  autoCapitalize: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Sets whether input is automatically capitalized when entered by user."
+  },
   autoCorrect: { required: false, control: "text", type: "string" },
-  autoFocus: { required: false, control: "boolean", type: "boolean" },
+  autoFocus: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Indicates that an element should be focused on page load, or when its parent dialog is displayed."
+  },
   autoSave: { required: false, control: "text", type: "string" },
   className: { required: false, control: "text", type: "string" },
-  color: { required: false, control: "color", type: "string" },
-  content: { required: false, control: "text", type: "string" },
-  contextMenu: { required: false, control: "text", type: "string" },
+  color: {
+    required: false,
+    control: "color",
+    type: "string",
+    description: "This attribute sets the text color using either a named color or a  color specified in the hexadecimal #RRGGBB format. Note: This is a legacy attribute. Please use the CSS color property instead."
+  },
+  content: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "A value associated with http-equiv orname depending on the context."
+  },
+  contextMenu: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines the ID of a menu element which willserve as the element's context menu."
+  },
   datatype: { required: false, control: "text", type: "string" },
   defaultChecked: { required: false, control: "boolean", type: "boolean" },
-  dir: { required: false, control: "text", type: "string" },
-  draggable: { required: false, control: "boolean", type: "boolean" },
-  hidden: { required: false, control: "boolean", type: "boolean" },
-  id: { required: false, control: "text", type: "string" },
+  dir: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)"
+  },
+  draggable: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Defines whether the element can be dragged."
+  },
+  hidden: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Prevents rendering of given element, while keeping child elements, e.g. script elements, active."
+  },
+  id: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Often used with CSS to style a specific element. The value of this attribute must be unique."
+  },
   inputMode: {
     description: "Hints at the type of data that might be entered by the user while editing the element or its contents\n@see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute",
     required: false,
@@ -373,20 +423,50 @@ const props = {
   itemRef: { required: false, control: "text", type: "string" },
   itemScope: { required: false, control: "boolean", type: "boolean" },
   itemType: { required: false, control: "text", type: "string" },
-  lang: { required: false, control: "text", type: "string" },
+  lang: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines the language used in the element."
+  },
   nonce: { required: false, control: "text", type: "string" },
-  placeholder: { required: false, control: "text", type: "string" },
+  placeholder: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Provides a hint to the user of what can be entered in the field."
+  },
   prefix: { required: false, control: "text", type: "string" },
   property: { required: false, control: "text", type: "string" },
   radioGroup: { required: false, control: "text", type: "string" },
-  rel: { required: false, control: "text", type: "string" },
+  rel: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Specifies the relationship of the target object to the link object."
+  },
   resource: { required: false, control: "text", type: "string" },
   results: { required: false, control: "number", type: "number" },
   rev: { required: false, control: "text", type: "string" },
-  role: { required: false, control: "text", type: "string" },
+  role: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines an explicit role for an element for use by assistive technologies."
+  },
   security: { required: false, control: "text", type: "string" },
-  slot: { required: false, control: "text", type: "string" },
-  spellCheck: { required: false, control: "boolean", type: "boolean" },
+  slot: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Assigns a slot in a shadow DOM shadow tree to an element."
+  },
+  spellCheck: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Indicates whether spell checking is allowed for the element."
+  },
   suppressContentEditableWarning: {
     required: false,
     control: "boolean",
@@ -397,13 +477,24 @@ const props = {
     control: "boolean",
     type: "boolean"
   },
-  tabIndex: { required: false, control: "number", type: "number" },
-  title: { required: false, control: "text", type: "string" },
+  tabIndex: {
+    required: false,
+    control: "number",
+    type: "number",
+    description: "Overrides the browser's default tab order and follows the one specified instead."
+  },
+  title: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Text to be displayed in a tooltip when hovering over the element."
+  },
   translate: {
     required: false,
     control: "radio",
     type: "string",
-    options: ["yes", "no"]
+    options: ["yes", "no"],
+    description: "Specify whether an element's attribute values and the values of its text node children are to be translated when the page is localized, or whether to leave them unchanged."
   },
   typeof: { required: false, control: "text", type: "string" },
   unselectable: {

package/lib/__generated__/vimeo.props.js

@@ -1,6 +1,11 @@
 const props = {
   about: { required: false, control: "text", type: "string" },
-  accessKey: { required: false, control: "text", type: "string" },
+  accessKey: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Keyboard shortcut to activate or add focus to the element."
+  },
   "aria-activedescendant": {
     description: "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.",
     required: false,
@@ -156,7 +161,7 @@ const props = {
     type: "string"
   },
   "aria-label": {
-    description: "Defines a string value that labels the current element.\n@see aria-labelledby.",
+    description: "Provides the accessible name that describes an interactive element if no other accessible name exists, for example in a button that contains an image with no text.",
     required: false,
     control: "text",
     type: "string"
@@ -332,9 +337,19 @@ const props = {
     control: "text",
     type: "string"
   },
-  autoCapitalize: { required: false, control: "text", type: "string" },
+  autoCapitalize: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Sets whether input is automatically capitalized when entered by user."
+  },
   autoCorrect: { required: false, control: "text", type: "string" },
-  autoFocus: { required: false, control: "boolean", type: "boolean" },
+  autoFocus: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Indicates that an element should be focused on page load, or when its parent dialog is displayed."
+  },
   autopause: {
     description: "Whether to pause the current video when another Vimeo video on the same page starts to play. Set this value to false to permit simultaneous playback of all the videos on the page. This option has no effect if you've disabled cookies in your browser, either through browser settings or with an extension or plugin.",
     required: false,
@@ -364,9 +379,24 @@ const props = {
     defaultValue: false
   },
   className: { required: false, control: "text", type: "string" },
-  color: { required: false, control: "color", type: "string" },
-  content: { required: false, control: "text", type: "string" },
-  contextMenu: { required: false, control: "text", type: "string" },
+  color: {
+    required: false,
+    control: "color",
+    type: "string",
+    description: "This attribute sets the text color using either a named color or a  color specified in the hexadecimal #RRGGBB format. Note: This is a legacy attribute. Please use the CSS color property instead."
+  },
+  content: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "A value associated with http-equiv orname depending on the context."
+  },
+  contextMenu: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines the ID of a menu element which willserve as the element's context menu."
+  },
   controlsColor: {
     description: "A color value of the playback controls, which is normally #00ADEF. The embed settings of the video might override this value.",
     required: false,
@@ -375,7 +405,12 @@ const props = {
   },
   datatype: { required: false, control: "text", type: "string" },
   defaultChecked: { required: false, control: "boolean", type: "boolean" },
-  dir: { required: false, control: "text", type: "string" },
+  dir: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)"
+  },
   doNotTrack: {
     description: "Whether to prevent the player from tracking session data, including cookies. Keep in mind that setting this argument to true also blocks video stats.",
     required: false,
@@ -383,9 +418,24 @@ const props = {
     type: "boolean",
     defaultValue: false
   },
-  draggable: { required: false, control: "boolean", type: "boolean" },
-  hidden: { required: false, control: "boolean", type: "boolean" },
-  id: { required: false, control: "text", type: "string" },
+  draggable: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Defines whether the element can be dragged."
+  },
+  hidden: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Prevents rendering of given element, while keeping child elements, e.g. script elements, active."
+  },
+  id: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Often used with CSS to style a specific element. The value of this attribute must be unique."
+  },
   inputMode: {
     description: "Hints at the type of data that might be entered by the user while editing the element or its contents\n@see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute",
     required: false,
@@ -426,7 +476,12 @@ const props = {
     type: "boolean",
     defaultValue: true
   },
-  lang: { required: false, control: "text", type: "string" },
+  lang: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines the language used in the element."
+  },
   loop: {
     description: "Whether to restart the video automatically after reaching the end.",
     required: false,
@@ -449,7 +504,12 @@ const props = {
     type: "boolean",
     defaultValue: false
   },
-  placeholder: { required: false, control: "text", type: "string" },
+  placeholder: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Provides a hint to the user of what can be entered in the field."
+  },
   playsinline: {
     description: "Whether the video plays inline on supported mobile devices. To force the device to play the video in fullscreen mode instead, set this value to false.",
     required: false,
@@ -468,7 +528,12 @@ const props = {
     options: ["auto", "360p", "540p", "720p", "1080p", "2k", "4k"]
   },
   radioGroup: { required: false, control: "text", type: "string" },
-  rel: { required: false, control: "text", type: "string" },
+  rel: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Specifies the relationship of the target object to the link object."
+  },
   resource: { required: false, control: "text", type: "string" },
   responsive: {
     description: "Whether to return a responsive embed code, or one that provides intelligent adjustments based on viewing conditions. We recommend this option for mobile-optimized sites.",
@@ -479,7 +544,12 @@ const props = {
   },
   results: { required: false, control: "number", type: "number" },
   rev: { required: false, control: "text", type: "string" },
-  role: { required: false, control: "text", type: "string" },
+  role: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines an explicit role for an element for use by assistive technologies."
+  },
   security: { required: false, control: "text", type: "string" },
   showByline: {
     description: "Whether to display the video owner's name.",
@@ -516,7 +586,12 @@ const props = {
     type: "boolean",
     defaultValue: false
   },
-  slot: { required: false, control: "text", type: "string" },
+  slot: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Assigns a slot in a shadow DOM shadow tree to an element."
+  },
   speed: {
     description: "Whether the player displays speed controls in the preferences menu and enables the playback rate API.",
     required: false,
@@ -524,7 +599,12 @@ const props = {
     type: "boolean",
     defaultValue: false
   },
-  spellCheck: { required: false, control: "boolean", type: "boolean" },
+  spellCheck: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Indicates whether spell checking is allowed for the element."
+  },
   suppressContentEditableWarning: {
     required: false,
     control: "boolean",
@@ -535,19 +615,30 @@ const props = {
     control: "boolean",
     type: "boolean"
   },
-  tabIndex: { required: false, control: "number", type: "number" },
+  tabIndex: {
+    required: false,
+    control: "number",
+    type: "number",
+    description: "Overrides the browser's default tab order and follows the one specified instead."
+  },
   texttrack: {
     description: "The text track to display with the video. Specify the text track by its language code (en), the language code and locale (en-US), or the language code and kind (en.captions). For this argument to work, the video must already have a text track of the given type; see our Help Center or Working with Text Track Uploads for more information.\nTo enable automatically generated closed captions instead, provide the value en-x-autogen. Please note that, at the present time, automatic captions are always in English.",
     required: false,
     control: "text",
     type: "string"
   },
-  title: { required: false, control: "text", type: "string" },
+  title: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Text to be displayed in a tooltip when hovering over the element."
+  },
   translate: {
     required: false,
     control: "radio",
     type: "string",
-    options: ["yes", "no"]
+    options: ["yes", "no"],
+    description: "Specify whether an element's attribute values and the values of its text node children are to be translated when the page is localized, or whether to leave them unchanged."
   },
   transparent: {
     description: "Whether the responsive player and transparent background are enabled.",
@@ -564,7 +655,7 @@ const props = {
     options: ["on", "off"]
   },
   url: {
-    description: "The ID or the URL of the video on Vimeo. You must supply one of these values to identify the video. When the video's privacy setting is Private, you must use the URL, and the URL must include the h parameter. For more information, see our introductory guide.",
+    description: "The ID or the URL of the video on Vimeo. You must supply one of these values to identify the video. When the video's privacy setting is Private, you must use the URL, and the URL must include the h parameter. For more information, see Vimeo\u2019s introductory guide.",
     required: false,
     control: "text",
     type: "string"

package/lib/blockquote.ws.js

@@ -55,6 +55,7 @@ const meta = {
   category: "text",
   type: "container",
   label: "Blockquote",
+  description: "Use to style a quote from an external source like an article or book.",
   icon: BlockquoteIcon,
   states: defaultStates,
   presetStyle,

package/lib/box.ws.js

@@ -31,6 +31,7 @@ const meta = {
   category: "general",
   type: "container",
   label: "Box",
+  description: "A container for content. By default this is a Div, but the tag can be changed in settings.",
   icon: BoxIcon,
   states: defaultStates,
   presetStyle,

package/lib/button.ws.js

@@ -12,6 +12,7 @@ const meta = {
   type: "container",
   invalidAncestors: ["Button"],
   label: "Button",
+  description: "Use a button to submit forms or trigger actions within a page. Do not use a button to navigate users to another resource or another page - that\u2019s what a link is used for.",
   icon: ButtonElementIcon,
   presetStyle,
   states: [

package/lib/checkbox.ws.js

@@ -18,6 +18,7 @@ const meta = {
   invalidAncestors: ["Button"],
   type: "control",
   label: "Checkbox",
+  description: "Use within a form to allow your users to toggle between checked and not checked. Group checkboxes by matching their \u201CName\u201D properties. Unlike radios, any number of checkboxes in a group can be checked.",
   icon: CheckboxCheckedIcon,
   presetStyle,
   order: 6,

package/lib/cjs/__generated__/blockquote.props.js

@@ -23,7 +23,12 @@ __export(blockquote_props_exports, {
 module.exports = __toCommonJS(blockquote_props_exports);
 const props = {
   about: { required: false, control: "text", type: "string" },
-  accessKey: { required: false, control: "text", type: "string" },
+  accessKey: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Keyboard shortcut to activate or add focus to the element."
+  },
   "aria-activedescendant": {
     description: "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.",
     required: false,
@@ -179,7 +184,7 @@ const props = {
     type: "string"
   },
   "aria-label": {
-    description: "Defines a string value that labels the current element.\n@see aria-labelledby.",
+    description: "Provides the accessible name that describes an interactive element if no other accessible name exists, for example in a button that contains an image with no text.",
     required: false,
     control: "text",
     type: "string"
@@ -355,21 +360,71 @@ const props = {
     control: "text",
     type: "string"
   },
-  autoCapitalize: { required: false, control: "text", type: "string" },
+  autoCapitalize: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Sets whether input is automatically capitalized when entered by user."
+  },
   autoCorrect: { required: false, control: "text", type: "string" },
-  autoFocus: { required: false, control: "boolean", type: "boolean" },
+  autoFocus: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Indicates that an element should be focused on page load, or when its parent dialog is displayed."
+  },
   autoSave: { required: false, control: "text", type: "string" },
-  cite: { required: false, control: "text", type: "string" },
+  cite: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Contains a URI which points to the source of the quote or change."
+  },
   className: { required: false, control: "text", type: "string" },
-  color: { required: false, control: "color", type: "string" },
-  content: { required: false, control: "text", type: "string" },
-  contextMenu: { required: false, control: "text", type: "string" },
+  color: {
+    required: false,
+    control: "color",
+    type: "string",
+    description: "This attribute sets the text color using either a named color or a  color specified in the hexadecimal #RRGGBB format. Note: This is a legacy attribute. Please use the CSS color property instead."
+  },
+  content: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "A value associated with http-equiv orname depending on the context."
+  },
+  contextMenu: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines the ID of a menu element which willserve as the element's context menu."
+  },
   datatype: { required: false, control: "text", type: "string" },
   defaultChecked: { required: false, control: "boolean", type: "boolean" },
-  dir: { required: false, control: "text", type: "string" },
-  draggable: { required: false, control: "boolean", type: "boolean" },
-  hidden: { required: false, control: "boolean", type: "boolean" },
-  id: { required: false, control: "text", type: "string" },
+  dir: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)"
+  },
+  draggable: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Defines whether the element can be dragged."
+  },
+  hidden: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Prevents rendering of given element, while keeping child elements, e.g. script elements, active."
+  },
+  id: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Often used with CSS to style a specific element. The value of this attribute must be unique."
+  },
   inputMode: {
     description: "Hints at the type of data that might be entered by the user while editing the element or its contents\n@see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute",
     required: false,
@@ -397,20 +452,50 @@ const props = {
   itemRef: { required: false, control: "text", type: "string" },
   itemScope: { required: false, control: "boolean", type: "boolean" },
   itemType: { required: false, control: "text", type: "string" },
-  lang: { required: false, control: "text", type: "string" },
+  lang: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines the language used in the element."
+  },
   nonce: { required: false, control: "text", type: "string" },
-  placeholder: { required: false, control: "text", type: "string" },
+  placeholder: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Provides a hint to the user of what can be entered in the field."
+  },
   prefix: { required: false, control: "text", type: "string" },
   property: { required: false, control: "text", type: "string" },
   radioGroup: { required: false, control: "text", type: "string" },
-  rel: { required: false, control: "text", type: "string" },
+  rel: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Specifies the relationship of the target object to the link object."
+  },
   resource: { required: false, control: "text", type: "string" },
   results: { required: false, control: "number", type: "number" },
   rev: { required: false, control: "text", type: "string" },
-  role: { required: false, control: "text", type: "string" },
+  role: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Defines an explicit role for an element for use by assistive technologies."
+  },
   security: { required: false, control: "text", type: "string" },
-  slot: { required: false, control: "text", type: "string" },
-  spellCheck: { required: false, control: "boolean", type: "boolean" },
+  slot: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Assigns a slot in a shadow DOM shadow tree to an element."
+  },
+  spellCheck: {
+    required: false,
+    control: "boolean",
+    type: "boolean",
+    description: "Indicates whether spell checking is allowed for the element."
+  },
   suppressContentEditableWarning: {
     required: false,
     control: "boolean",
@@ -421,13 +506,24 @@ const props = {
     control: "boolean",
     type: "boolean"
   },
-  tabIndex: { required: false, control: "number", type: "number" },
-  title: { required: false, control: "text", type: "string" },
+  tabIndex: {
+    required: false,
+    control: "number",
+    type: "number",
+    description: "Overrides the browser's default tab order and follows the one specified instead."
+  },
+  title: {
+    required: false,
+    control: "text",
+    type: "string",
+    description: "Text to be displayed in a tooltip when hovering over the element."
+  },
   translate: {
     required: false,
     control: "radio",
     type: "string",
-    options: ["yes", "no"]
+    options: ["yes", "no"],
+    description: "Specify whether an element's attribute values and the values of its text node children are to be translated when the page is localized, or whether to leave them unchanged."
   },
   typeof: { required: false, control: "text", type: "string" },
   unselectable: {