@webstudio-is/sdk-components-react 0.218.0 → 0.220.0

package/lib/list.ws.js

@@ -1,10 +1,9 @@
-import { ListIcon as e } from "@webstudio-is/icons/svg";
-import { defaultStates as t } from "@webstudio-is/sdk";
-import { ol as r, ul as o } from "@webstudio-is/sdk/normalize.css";
+import { defaultStates as e } from "@webstudio-is/sdk";
+import { ul as r, ol as t } from "@webstudio-is/sdk/normalize.css";
 import { props as p } from "./__generated__/list.props.js";
-const a = {
+const o = {
   ol: [
-    ...r,
+    ...t,
     {
       property: "margin-top",
       value: { type: "keyword", value: "0" }
@@ -19,7 +18,7 @@ const a = {
     }
   ],
   ul: [
-    ...o,
+    ...r,
     {
       property: "margin-top",
       value: { type: "keyword", value: "0" }
@@ -34,14 +33,11 @@ const a = {
     }
   ]
 }, d = {
-  icon: e,
-  states: t,
-  presetStyle: a
-}, s = {
-  props: p,
-  initialProps: ["id", "className", "ordered", "start", "reversed"]
+  states: e,
+  presetStyle: o,
+  initialProps: ["id", "class", "ordered", "start", "reversed"],
+  props: p
 };
 export {
-  d as meta,
-  s as propsMeta
+  d as meta
 };

package/lib/markdown-embed.js

@@ -1,14 +1,14 @@
 import { jsx as n } from "react/jsx-runtime";
 import { micromark as s } from "micromark";
-import { gfmTable as l, gfmTableHtml as i } from "micromark-extension-gfm-table";
+import { gfmTableHtml as l, gfmTable as i } from "micromark-extension-gfm-table";
 import { forwardRef as a, useMemo as f } from "react";
 const h = /* @__PURE__ */ a((r, e) => {
   const { code: o, children: c, ...t } = r, m = f(
     // support data uri protocol in images
     () => s(o ?? "", {
       allowDangerousProtocol: !0,
-      extensions: [l()],
-      htmlExtensions: [i()]
+      extensions: [i()],
+      htmlExtensions: [l()]
     }),
     [o]
   );

package/lib/markdown-embed.ws.js

@@ -1,6 +1,6 @@
 import { MarkdownEmbedIcon as e } from "@webstudio-is/icons/svg";
 import { descendantComponent as o } from "@webstudio-is/sdk";
-import { props as t } from "./__generated__/markdown-embed.props.js";
+import { props as r } from "./__generated__/markdown-embed.props.js";
 const a = {
   icon: e,
   contentModel: {
@@ -18,20 +18,18 @@ const a = {
         value: { type: "keyword", value: "collapse" }
       }
     ]
-  }
-}, c = {
+  },
+  initialProps: ["class"],
   props: {
-    ...t,
+    ...r,
     code: {
       required: !0,
       control: "code",
       language: "markdown",
       type: "string"
     }
-  },
-  initialProps: ["className"]
+  }
 };
 export {
-  a as meta,
-  c as propsMeta
+  a as meta
 };

package/lib/option.ws.js

@@ -1,5 +1,4 @@
-import { ItemIcon as e } from "@webstudio-is/icons/svg";
-import { props as t } from "./__generated__/option.props.js";
+import { props as e } from "./__generated__/option.props.js";
 const l = {
   option: [
     {
@@ -14,10 +13,9 @@ const l = {
       }
     }
   ]
-}, r = {
+}, a = {
   category: "hidden",
   description: "An item within a drop-down menu that users can select as their chosen value.",
-  icon: e,
   presetStyle: l,
   states: [
     // Applies when option is being activated (clicked)
@@ -28,12 +26,10 @@ const l = {
     { selector: ":default", label: "Default" },
     { selector: ":hover", label: "Hover" },
     { selector: ":disabled", label: "Disabled" }
-  ]
-}, c = {
-  props: t,
-  initialProps: ["label", "selected", "value", "label", "disabled"]
+  ],
+  initialProps: ["label", "selected", "value", "label", "disabled"],
+  props: e
 };
 export {
-  r as meta,
-  c as propsMeta
+  a as meta
 };

package/lib/paragraph.ws.js

@@ -1,19 +1,12 @@
-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 p = {
-  p: r
-}, c = {
-  placeholder: "Paragraph",
-  icon: t,
-  states: o,
-  presetStyle: p
-}, l = {
-  props: e,
-  initialProps: ["id", "className"]
+import { defaultStates as t } from "@webstudio-is/sdk";
+import { p as o } from "@webstudio-is/sdk/normalize.css";
+import { props as r } from "./__generated__/paragraph.props.js";
+const i = {
+  states: t,
+  presetStyle: { p: o },
+  initialProps: ["id", "class"],
+  props: r
 };
 export {
-  c as meta,
-  l as propsMeta
+  i as meta
 };

package/lib/radio-button.ws.js

@@ -2,7 +2,7 @@ import { RadioCheckedIcon as e } from "@webstudio-is/icons/svg";
 import { defaultStates as t } from "@webstudio-is/sdk";
 import { radio as o } from "@webstudio-is/sdk/normalize.css";
 import { props as r } from "./__generated__/radio-button.props.js";
-const a = {
+const i = {
   input: [
     ...o,
     {
@@ -13,7 +13,7 @@ const a = {
 }, s = {
   label: "Radio",
   icon: e,
-  presetStyle: a,
+  presetStyle: i,
   states: [
     ...t,
     { selector: ":checked", label: "Checked" },
@@ -24,12 +24,10 @@ const a = {
     //{ selector: ":enabled", label: "Enabled" },
     //{ selector: ":read-only", label: "Read Only" },
     //{ selector: ":read-write", label: "Read Write" },
-  ]
-}, m = {
-  props: r,
-  initialProps: ["id", "className", "name", "value", "required", "checked"]
+  ],
+  initialProps: ["id", "class", "name", "value", "required", "checked"],
+  props: r
 };
 export {
-  s as meta,
-  m as propsMeta
+  s as meta
 };

package/lib/rich-text-link.ws.js

@@ -1,6 +1,5 @@
-import { meta as t, propsMeta as a } from "./link.ws.js";
-const p = t, e = a;
+import { meta as t } from "./link.ws.js";
+const a = t;
 export {
-  p as meta,
-  e as propsMeta
+  a as meta
 };

package/lib/select.ws.js

@@ -1,39 +1,35 @@
-import { SelectIcon as e } from "@webstudio-is/icons/svg";
-import { defaultStates as l } from "@webstudio-is/sdk";
-import { select as o } from "@webstudio-is/sdk/normalize.css";
+import { defaultStates as e } from "@webstudio-is/sdk";
+import { select as l } from "@webstudio-is/sdk/normalize.css";
 import { props as t } from "./__generated__/select.props.js";
-const r = {
+const o = {
   select: [
-    ...o,
+    ...l,
     {
       property: "display",
       value: { type: "keyword", value: "block" }
     }
   ]
-}, c = {
-  icon: e,
-  presetStyle: r,
+}, s = {
+  presetStyle: o,
   states: [
-    ...l,
+    ...e,
     { selector: "::placeholder", label: "Placeholder" },
     { selector: ":valid", label: "Valid" },
     { selector: ":invalid", label: "Invalid" },
     { selector: ":required", label: "Required" },
     { selector: ":optional", label: "Optional" }
-  ]
-}, d = {
-  props: t,
+  ],
   initialProps: [
     "id",
-    "className",
+    "class",
     "name",
     "value",
     "multiple",
     "required",
-    "autoFocus"
-  ]
+    "autofocus"
+  ],
+  props: t
 };
 export {
-  c as meta,
-  d as propsMeta
+  s as meta
 };

package/lib/separator.ws.js

@@ -1,8 +1,7 @@
-import { MinusIcon as e } from "@webstudio-is/icons/svg";
-import { defaultStates as o } from "@webstudio-is/sdk";
+import { defaultStates as e } from "@webstudio-is/sdk";
 import { hr as r } from "@webstudio-is/sdk/normalize.css";
-import { props as t } from "./__generated__/separator.props.js";
-const p = {
+import { props as o } from "./__generated__/separator.props.js";
+const t = {
   hr: [
     ...r,
     {
@@ -30,18 +29,15 @@ const p = {
       value: { type: "keyword", value: "none" }
     }
   ]
-}, n = {
+}, y = {
   category: "general",
   description: "Used to visually divide sections of content, helping to improve readability and organization within a webpage.",
-  icon: e,
-  states: o,
-  presetStyle: p,
-  order: 3
-}, s = {
-  props: t,
-  initialProps: ["id", "className"]
+  states: e,
+  presetStyle: t,
+  order: 3,
+  initialProps: ["id", "class"],
+  props: o
 };
 export {
-  n as meta,
-  s as propsMeta
+  y as meta
 };

package/lib/shared/video.js

@@ -0,0 +1,13 @@
+import { createContext as o } from "react";
+const s = (t) => {
+  const e = "ontouchstart" in window;
+  (window.matchMedia("(max-width: 1024px)").matches || e) && t.requestFullscreen();
+}, c = o({
+  onInitPlayer: () => {
+  },
+  status: "initial"
+});
+export {
+  c as VideoContext,
+  s as requestFullscreen
+};

package/lib/slot.ws.js

@@ -1,13 +1,10 @@
-import { SlotComponentIcon as o } from "@webstudio-is/icons/svg";
-const e = {
+import { SlotComponentIcon as t } from "@webstudio-is/icons/svg";
+const o = {
   category: "general",
   description: "Slot is a container for content that you want to reference across the project. Changes made to a Slot's children will be reflected in all other instances of that Slot.",
-  icon: o,
+  icon: t,
   order: 5
-}, n = {
-  props: {}
 };
 export {
-  e as meta,
-  n as propsMeta
+  o as meta
 };

package/lib/span.ws.js

@@ -2,18 +2,14 @@ import { PaintBrushIcon as t } from "@webstudio-is/icons/svg";
 import { defaultStates as o } from "@webstudio-is/sdk";
 import { span as r } from "@webstudio-is/sdk/normalize.css";
 import { props as s } from "./__generated__/span.props.js";
-const e = {
-  span: r
-}, n = {
+const m = {
   label: "Text",
   icon: t,
   states: o,
-  presetStyle: e
-}, c = {
-  props: s,
-  initialProps: ["id", "className"]
+  presetStyle: { span: r },
+  initialProps: ["id", "class"],
+  props: s
 };
 export {
-  n as meta,
-  c as propsMeta
+  m as meta
 };

package/lib/subscript.ws.js

@@ -1,19 +1,13 @@
-import { SubscriptIcon as t } from "@webstudio-is/icons/svg";
-import { defaultStates as o } from "@webstudio-is/sdk";
+import { defaultStates as t } from "@webstudio-is/sdk";
 import { sub as r } from "@webstudio-is/sdk/normalize.css";
 import { props as s } from "./__generated__/subscript.props.js";
-const p = {
-  sub: r
-}, c = {
+const i = {
   label: "Subscript Text",
-  icon: t,
-  states: o,
-  presetStyle: p
-}, l = {
-  props: s,
-  initialProps: ["id", "className"]
+  states: t,
+  presetStyle: { sub: r },
+  initialProps: ["id", "class"],
+  props: s
 };
 export {
-  c as meta,
-  l as propsMeta
+  i as meta
 };

package/lib/superscript.ws.js

@@ -1,19 +1,13 @@
-import { SuperscriptIcon as t } from "@webstudio-is/icons/svg";
-import { defaultStates as o } from "@webstudio-is/sdk";
+import { defaultStates as t } from "@webstudio-is/sdk";
 import { sup as r } from "@webstudio-is/sdk/normalize.css";
-import { props as p } from "./__generated__/superscript.props.js";
-const s = {
-  sup: r
-}, c = {
+import { props as e } from "./__generated__/superscript.props.js";
+const i = {
   label: "Superscript Text",
-  icon: t,
-  states: o,
-  presetStyle: s
-}, l = {
-  props: p,
-  initialProps: ["id", "className"]
+  states: t,
+  presetStyle: { sup: r },
+  initialProps: ["id", "class"],
+  props: e
 };
 export {
-  c as meta,
-  l as propsMeta
+  i as meta
 };

package/lib/text.ws.js

@@ -1,32 +1,30 @@
 import { TextIcon as t } from "@webstudio-is/icons/svg";
-import { defaultStates as o } from "@webstudio-is/sdk";
-import { div as e } from "@webstudio-is/sdk/normalize.css";
-import { props as i } from "./__generated__/text.props.js";
+import { defaultStates as i } from "@webstudio-is/sdk";
+import { div as o } from "@webstudio-is/sdk/normalize.css";
+import { props as e } from "./__generated__/text.props.js";
 const n = {
   icon: t,
-  states: o,
+  states: i,
   presetStyle: {
     div: [
-      ...e,
+      ...o,
       {
         property: "min-height",
         value: { type: "unit", unit: "em", value: 1 }
       }
     ]
-  }
-}, m = {
+  },
+  initialProps: ["tag", "id", "class"],
   props: {
-    ...i,
+    ...e,
     tag: {
       required: !0,
       control: "tag",
       type: "string",
       options: ["div", "cite", "figcaption", "span"]
     }
-  },
-  initialProps: ["tag", "id", "className"]
+  }
 };
 export {
-  n as meta,
-  m as propsMeta
+  n as meta
 };

package/lib/textarea.ws.js

@@ -1,10 +1,9 @@
-import { FormTextAreaIcon as e } from "@webstudio-is/icons/svg";
-import { defaultStates as r } from "@webstudio-is/sdk";
-import { textarea as o } from "@webstudio-is/sdk/normalize.css";
-import { props as t } from "./__generated__/textarea.props.js";
-const l = {
+import { defaultStates as e } from "@webstudio-is/sdk";
+import { textarea as l } from "@webstudio-is/sdk/normalize.css";
+import { props as r } from "./__generated__/textarea.props.js";
+const t = {
   textarea: [
-    ...o,
+    ...l,
     // resize doesn't work well while on canvas
     { property: "resize", value: { type: "keyword", value: "none" } },
     {
@@ -12,19 +11,18 @@ const l = {
       value: { type: "keyword", value: "block" }
     }
   ]
-}, n = {
+}, s = {
   category: "forms",
   label: "Text Area",
   description: "A multi-line text input for collecting longer string data from your users.",
-  icon: e,
-  presetStyle: l,
+  presetStyle: t,
   order: 4,
   contentModel: {
     category: "instance",
     children: []
   },
   states: [
-    ...r,
+    ...e,
     { selector: "::placeholder", label: "Placeholder" },
     { selector: ":valid", label: "Valid" },
     { selector: ":invalid", label: "Invalid" },
@@ -35,20 +33,18 @@ const l = {
     //{ selector: ":enabled", label: "Enabled" },
     //{ selector: ":read-only", label: "Read Only" },
     //{ selector: ":read-write", label: "Read Write" },
-  ]
-}, p = {
-  props: t,
+  ],
   initialProps: [
     "id",
-    "className",
+    "class",
     "name",
     "value",
     "placeholder",
     "required",
-    "autoFocus"
-  ]
+    "autofocus"
+  ],
+  props: r
 };
 export {
-  n as meta,
-  p as propsMeta
+  s as meta
 };

package/lib/time.js

@@ -296,7 +296,8 @@ const c = [
     country: e = A,
     dateStyle: n = L,
     timeStyle: l = f,
-    datetime: s = D,
+    // native html attribute in react style
+    dateTime: s = D,
     ...a
   }, u) => {
     const S = `${I(t)}-${B(

package/lib/time.ws.js

@@ -1,20 +1,20 @@
-import { CalendarIcon as t } from "@webstudio-is/icons/svg";
-import { defaultStates as e } from "@webstudio-is/sdk";
-import { time as a } from "@webstudio-is/sdk/normalize.css";
-import { props as o } from "./__generated__/time.props.js";
-const r = {
-  time: a
-}, s = {
+import { defaultStates as t } from "@webstudio-is/sdk";
+import { time as e } from "@webstudio-is/sdk/normalize.css";
+import { props as a } from "./__generated__/time.props.js";
+const n = {
   category: "localization",
   description: "Converts machine-readable date and time to a human-readable format.",
-  icon: t,
-  states: e,
-  presetStyle: r
-}, l = {
-  props: o,
-  initialProps: ["datetime", "language", "country", "dateStyle", "timeStyle"]
+  contentModel: {
+    category: "instance",
+    children: []
+  },
+  states: t,
+  presetStyle: {
+    time: e
+  },
+  initialProps: ["datetime", "language", "country", "dateStyle", "timeStyle"],
+  props: a
 };
 export {
-  s as meta,
-  l as propsMeta
+  n as meta
 };

package/lib/types/blockquote.ws.d.ts

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

package/lib/types/body.ws.d.ts

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

package/lib/types/bold.ws.d.ts

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

package/lib/types/box.ws.d.ts

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

package/lib/types/button.ws.d.ts

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

package/lib/types/checkbox.ws.d.ts

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

package/lib/types/code-text.ws.d.ts

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

package/lib/types/form.ws.d.ts

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

package/lib/types/fragment.ws.d.ts

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

package/lib/types/head-link.ws.d.ts

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

package/lib/types/head-meta.ws.d.ts

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

package/lib/types/head-slot.ws.d.ts

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

package/lib/types/head-title.ws.d.ts

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