@webstudio-is/sdk-components-react 0.253.0 → 0.255.0

package/lib/head-slot.template.js

@@ -1,8 +1,8 @@
 import { jsxs as i, jsx as t } from "react/jsx-runtime";
 import { $ as e } from "@webstudio-is/template";
-const l = {
+const s = {
   category: "general",
-  description: "The Head Slot component lets you customize page-specific head elements (like canonical URLs), which merge with your site's global head settings, with Head Slot definitions taking priority over Page Settings. For site-wide head changes, use Project Settings instead.",
+  description: "The Head Slot component lets you customize page-specific head elements (like canonical URLs), which merge with your site's global head settings, with Head Slot definitions taking priority over Page Settings. For site-wide head changes, use project settings instead.",
   order: 5,
   template: /* @__PURE__ */ i(e.HeadSlot, { children: [
     /* @__PURE__ */ t(e.HeadTitle, { "ws:label": "Title", children: "Title" }),
@@ -11,5 +11,5 @@ const l = {
   ] })
 };
 export {
-  l as meta
+  s as meta
 };

package/lib/html-embed.js

@@ -1,15 +1,15 @@
-import { jsx as i } from "react/jsx-runtime";
-import { forwardRef as R, useContext as S, useState as b, useSyncExternalStore as x, useRef as f, useMemo as E, useEffect as k } from "react";
-import { mergeRefs as T } from "@react-aria/utils";
-import { ReactSdkContext as g } from "@webstudio-is/react-sdk/runtime";
-import { patchDomEvents as L, executeDomEvents as _ } from "./html-embed-patchers.js";
-const C = {
+import { jsx as s } from "react/jsx-runtime";
+import { forwardRef as b, useContext as x, useState as E, useSyncExternalStore as k, useRef as f, useMemo as T, useEffect as g } from "react";
+import { mergeRefs as L } from "@react-aria/utils";
+import { ReactSdkContext as _ } from "@webstudio-is/react-sdk/runtime";
+import { patchDomEvents as C, executeDomEvents as w } from "./html-embed-patchers.js";
+const M = {
   scriptTestIdPrefix: "client-"
-}, w = (e) => new Promise((t, n) => {
-  const r = document.createElement("script"), s = e.hasAttribute("src"), a = e.type === "module";
+}, O = (e) => new Promise((t, n) => {
+  const r = document.createElement("script"), i = e.hasAttribute("src"), a = e.type === "module";
   for (const { name: c, value: o } of e.attributes)
     r.setAttribute(c, o);
-  if (r.dataset.testid !== void 0 && (r.dataset.testid = `${C.scriptTestIdPrefix}${r.dataset.testid}`), s)
+  if (r.dataset.testid !== void 0 && (r.dataset.testid = `${M.scriptTestIdPrefix}${r.dataset.testid}`), i)
     r.addEventListener("load", () => {
       t();
     }), r.addEventListener("error", n);
@@ -28,55 +28,55 @@ const C = {
     }
     r.textContent = e.innerText;
   }
-  e.replaceWith(r), s === !1 && t();
-}), l = [];
-let d = !1;
-const O = async (e) => {
-  if (l.push(...e), await Promise.resolve(), !d) {
-    for (L(), d = !0; l.length > 0; )
-      await l.shift()();
-    _(), d = !1;
+  e.replaceWith(r), i === !1 && t();
+}), d = [];
+let u = !1;
+const H = async (e) => {
+  if (d.push(...e), await Promise.resolve(), !u) {
+    for (C(), u = !0; d.length > 0; )
+      await d.shift()();
+    w(), u = !1;
   }
-}, H = (e) => {
+}, I = (e) => {
   const t = e.querySelectorAll("script"), n = [], r = [];
-  t.forEach((s) => {
-    (s.hasAttribute("async") ? r : n).push(() => w(s));
+  t.forEach((i) => {
+    (i.hasAttribute("async") ? r : n).push(() => O(i));
   });
-  for (const s of r)
-    s();
-  O(n);
-}, I = (e) => {
+  for (const i of r)
+    i();
+  H(n);
+}, P = (e) => {
   const { code: t, innerRef: n, ...r } = e;
-  return /* @__PURE__ */ i("div", { ref: n, ...r, style: { display: "block", padding: 20 }, children: 'Open the "Settings" panel to insert HTML code.' });
-}, h = () => x(
+  return /* @__PURE__ */ s("div", { ref: n, ...r, style: { display: "block", padding: 20 }, children: 'Open the "Settings" panel to insert HTML code.' });
+}, p = () => k(
   () => () => {
   },
   () => !1,
   () => !0
-), u = (e) => {
-  if (!h())
+), l = (e) => {
+  if (!p())
     return e.children;
 }, m = (e) => {
-  const { code: t, innerRef: n, ...r } = e, s = f(null), a = f(!0), c = E(
+  const { code: t, innerRef: n, ...r } = e, i = f(null), a = f(!0), c = T(
     () => ({
       __html: t ?? ""
     }),
     [t]
   );
-  return k(() => {
-    const o = s.current;
-    o && a.current && (a.current = !1, H(o));
-  }, []), /* @__PURE__ */ i(
+  return g(() => {
+    const o = i.current;
+    o && a.current && (a.current = !1, I(o));
+  }, []), /* @__PURE__ */ s(
     "div",
     {
       ...r,
-      ref: T(n, s),
+      ref: L(n, i),
       dangerouslySetInnerHTML: c
     }
   );
-}, p = (e) => {
+}, v = (e) => {
   const { code: t, innerRef: n, ...r } = e;
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ s(
     "div",
     {
       ...r,
@@ -84,17 +84,24 @@ const O = async (e) => {
       dangerouslySetInnerHTML: { __html: t ?? "" }
     }
   );
-}, M = p, P = R(
+}, h = v, A = b(
   (e, t) => {
-    const { code: n, executeScriptOnCanvas: r, clientOnly: s, children: a, ...c } = e, { renderer: o } = S(g), v = h(), [y] = b(v);
-    return n === void 0 || String(n).trim().length === 0 ? /* @__PURE__ */ i(I, { innerRef: t, ...c }) : y ? s !== !0 ? /* @__PURE__ */ i(p, { innerRef: t, code: n, ...c }) : /* @__PURE__ */ i(u, { children: /* @__PURE__ */ i(m, { innerRef: t, code: n, ...c }) }) : o === "canvas" && r !== !0 ? /* @__PURE__ */ i(u, { children: /* @__PURE__ */ i(
-      M,
+    const { code: n, executeScriptOnCanvas: r, clientOnly: i, children: a, ...c } = e, { renderer: o, isSafeMode: y } = x(_), R = p(), [S] = E(R);
+    return n === void 0 || String(n).trim().length === 0 ? /* @__PURE__ */ s(P, { innerRef: t, ...c }) : S ? i !== !0 ? /* @__PURE__ */ s(v, { innerRef: t, code: n, ...c }) : /* @__PURE__ */ s(l, { children: /* @__PURE__ */ s(m, { innerRef: t, code: n, ...c }) }) : y ? /* @__PURE__ */ s(l, { children: /* @__PURE__ */ s(
+      h,
+      {
+        innerRef: t,
+        code: n,
+        ...c
+      }
+    ) }) : o === "canvas" && r !== !0 ? /* @__PURE__ */ s(l, { children: /* @__PURE__ */ s(
+      h,
       {
         innerRef: t,
         code: n,
         ...c
       }
-    ) }) : /* @__PURE__ */ i(u, { children: /* @__PURE__ */ i(
+    ) }) : /* @__PURE__ */ s(l, { children: /* @__PURE__ */ s(
       m,
       {
         innerRef: t,
@@ -105,8 +112,8 @@ const O = async (e) => {
     ) });
   }
 );
-P.displayName = "HtmlEmbed";
+A.displayName = "HtmlEmbed";
 export {
-  P as HtmlEmbed,
-  C as __testing__
+  A as HtmlEmbed,
+  M as __testing__
 };

package/lib/time.js

@@ -291,7 +291,7 @@ const N = [
   if (Number.isNaN(e.getTime()) === !1)
     return e;
 }, Y = (t, e, n = "en-US") => {
-  const r = (o, s = 2) => String(o).padStart(s, "0"), D = new Intl.DateTimeFormat(n, {
+  const s = (r, o = 2) => String(r).padStart(o, "0"), D = new Intl.DateTimeFormat(n, {
     weekday: "long"
   }).format(t), T = new Intl.DateTimeFormat(n, {
     weekday: "short"
@@ -304,26 +304,26 @@ const N = [
     YY: String(t.getFullYear()).slice(-2),
     MMMM: l,
     MMM: M,
-    MM: r(t.getMonth() + 1),
+    MM: s(t.getMonth() + 1),
     M: t.getMonth() + 1,
     DDDD: D,
     DDD: T,
-    DD: r(t.getDate()),
+    DD: s(t.getDate()),
     D: t.getDate(),
-    HH: r(t.getHours()),
+    HH: s(t.getHours()),
     H: t.getHours(),
-    mm: r(t.getMinutes()),
+    mm: s(t.getMinutes()),
     m: t.getMinutes(),
-    ss: r(t.getSeconds()),
+    ss: s(t.getSeconds()),
     s: t.getSeconds()
-  }, a = Object.keys(m).sort((o, s) => s.length - o.length), i = new RegExp(`\\b(${a.join("|")})\\b`, "g");
-  return e.replace(i, (o) => String(m[o]));
+  }, a = Object.keys(m).sort((r, o) => o.length - r.length), i = new RegExp(`\\b(${a.join("|")})\\b`, "g");
+  return e.replace(i, (r) => String(m[r]));
 }, H = A(
   ({
     language: t = c,
     country: e = u,
     dateStyle: n = G,
-    timeStyle: r = I,
+    timeStyle: s = I,
     format: D,
     // native html attribute in react style
     dateTime: T = f,
@@ -333,21 +333,21 @@ const N = [
       e
     )}`, a = {
       dateStyle: B(n),
-      timeStyle: R(r)
-    }, i = T === null ? E : T.toString(), o = U(i);
-    let s = i;
-    if (o)
+      timeStyle: R(s)
+    }, i = T === null ? E : T.toString(), r = U(i);
+    let o = i;
+    if (r)
       if (D)
         try {
-          s = Y(o, D, m);
+          o = Y(r, D, m);
         } catch {
         }
       else
         try {
-          s = new Intl.DateTimeFormat(m, a).format(o);
+          o = new Intl.DateTimeFormat(m, a).format(r);
         } catch {
         }
-    return /* @__PURE__ */ S("time", { ref: M, dateTime: i, ...l, children: s });
+    return /* @__PURE__ */ S("time", { ref: M, dateTime: i, ...l, children: o });
   }
 );
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webstudio-is/sdk-components-react",
-  "version": "0.253.0",
+  "version": "0.255.0",
   "description": "Webstudio default library for react",
   "author": "Webstudio <github@webstudio.is>",
   "homepage": "https://webstudio.is",
@@ -44,10 +44,10 @@
     "colord": "^2.9.3",
     "micromark": "^4.0.2",
     "micromark-extension-gfm-table": "^2.1.1",
-    "@webstudio-is/icons": "0.253.0",
-    "@webstudio-is/react-sdk": "0.253.0",
-    "@webstudio-is/image": "0.253.0",
-    "@webstudio-is/sdk": "0.253.0"
+    "@webstudio-is/icons": "0.255.0",
+    "@webstudio-is/image": "0.255.0",
+    "@webstudio-is/react-sdk": "0.255.0",
+    "@webstudio-is/sdk": "0.255.0"
   },
   "devDependencies": {
     "@testing-library/dom": "^10.4.0",
@@ -60,8 +60,8 @@
     "vitest": "^3.1.2",
     "@webstudio-is/generate-arg-types": "0.0.0",
     "@webstudio-is/sdk-cli": "0.94.0",
-    "@webstudio-is/tsconfig": "1.0.7",
-    "@webstudio-is/template": "0.253.0"
+    "@webstudio-is/template": "0.255.0",
+    "@webstudio-is/tsconfig": "1.0.7"
   },
   "scripts": {
     "build": "vite build --config ../../vite.sdk-components.config.ts",