@blocklet/pages-kit-inner-components 0.6.20 → 0.6.21

package/lib/es/chunks/{index-aeMNll_R.js → index-DrqhF7Qu.js}

@@ -1,18 +1,18 @@
 import { jsx as r, jsxs as w, Fragment as Q } from "react/jsx-runtime";
-import { ErrorOutline as Dt } from "@mui/icons-material";
-import { Box as h, styled as Gt, Typography as L, Container as Ht, useTheme as Yt, useMediaQuery as Vt, Card as Jt, CircularProgress as Kt, Grid as ht, CardMedia as Xt, CardContent as qt, Alert as Qt } from "@mui/material";
+import { ErrorOutline as Gt } from "@mui/icons-material";
+import { Box as h, styled as Dt, Typography as z, Container as Ht, useTheme as Yt, useMediaQuery as Vt, Card as Jt, CircularProgress as Kt, Grid as ht, CardMedia as Xt, CardContent as qt, Alert as Qt } from "@mui/material";
 import Zt from "lodash/isEmpty";
 import lt from "lodash/pick";
-import te, { createContext as $t, useMemo as S, useCallback as D, useContext as Ct, useState as Z, useEffect as G, Fragment as ee, isValidElement as St, useRef as ct } from "react";
-import z from "lodash/keyBy";
+import te, { createContext as $t, useMemo as B, useCallback as Y, useContext as Ct, useState as Z, useEffect as V, Fragment as ee, isValidElement as St, useRef as ct } from "react";
+import R from "lodash/keyBy";
 import { styled as _, useTheme as Nt } from "@arcblock/ux/lib/Theme";
 import { cx as x, css as it } from "@emotion/css";
-import N from "lodash/omit";
+import M from "lodash/omit";
 import { Link as oe, NavLink as ne, useNavigate as re } from "react-router-dom";
 import ie from "@arcblock/ux/lib/Button";
 import at from "is-uri";
 import { Icon as Bt } from "@iconify-icon/react";
-import { e as A, f as B, i as dt, l as mt } from "./state-DSo43FAB.js";
+import { e as j, f as P, i as dt, l as mt } from "./state-DSo43FAB.js";
 import ae from "@blocklet/pages-kit/builtin/markdown/markdown-renderer";
 import { useColorConvert as Mt } from "@blocklet/pages-kit/contexts/color";
 import { materialDark as se } from "react-syntax-highlighter/dist/esm/styles/prism";
@@ -140,7 +140,8 @@ const Wt = "{{CUSTOM_VALUE}}", _e = [
   {
     title: "None",
     value: "none",
-    sx: { gap: 0 }
+    sx: { gap: 0 },
+    containerSx: { gap: 0 }
   },
   {
     title: "Small",
@@ -150,12 +151,12 @@ const Wt = "{{CUSTOM_VALUE}}", _e = [
   {
     title: "Normal",
     value: "normal",
-    sx: { gap: { xs: 2, md: 4, lg: 4, xl: 6 } }
+    sx: { gap: { xs: 2, md: 3.5, lg: 3.5, xl: 5 } }
   },
   {
     title: "Large",
     value: "large",
-    sx: { gap: { xs: 3, md: 5, lg: 5, xl: 7 } }
+    sx: { gap: { xs: 3, md: 5, lg: 5, xl: 6.5 } }
   }
 ], Be = [
   {
@@ -209,17 +210,17 @@ const Wt = "{{CUSTOM_VALUE}}", _e = [
     value: "space-evenly",
     sx: { alignContent: "space-evenly" }
   }
-], Pe = z(_e, "value"), Ie = z($e, "value"), We = z(Ce, "value"), Le = z(Se, "value"), Ae = z(Ne, "value"), ze = z(Be, "value"), Re = z(Me, "value"), je = /* @__PURE__ */ new Map([
+], Pe = R(_e, "value"), Ie = R($e, "value"), We = R(Ce, "value"), Le = R(Se, "value"), Ae = R(Ne, "value"), ze = R(Be, "value"), je = R(Me, "value"), Re = /* @__PURE__ */ new Map([
   ["baseSectionPaddingY", Pe],
   ["maxWidth", Le],
   ["paddingY", Ie],
   ["paddingX", We],
   ["layoutBlockGap", Ae],
   ["layoutBlockPadding", ze],
-  ["layoutBlockAlignContent", Re]
+  ["layoutBlockAlignContent", je]
 ]);
-function U(t) {
-  const { type: e, value: o, format: n = "sx", defaultValue: i = null } = t, a = je.get(e);
+function D(t) {
+  const { type: e, value: o, format: n = "sx", defaultValue: i = null } = t, a = Re.get(e);
   if (!a || typeof o != "string" || !o)
     return i;
   const c = o.startsWith("custom:"), s = c ? "custom" : o;
@@ -250,18 +251,18 @@ function In({
   defaultLocale: o = "en",
   currentLocale: n
 }) {
-  const i = S(() => t ? JSON.parse(JSON.stringify(t)) : null, [JSON.stringify(t)]), a = D(() => {
+  const i = B(() => t ? JSON.parse(JSON.stringify(t)) : null, [JSON.stringify(t)]), a = Y(() => {
     if (!i) return {};
     const l = n || o;
     return i.locales?.[l] ?? {};
-  }, [i, o, n]), c = D(
+  }, [i, o, n]), c = Y(
     (l = "sx") => {
       const d = a();
       return !d || !d.style ? {} : Object.entries(d.style || {}).reduce((m, [g, u]) => {
         if (!u) return m;
         const b = `${g}Custom`;
         d.style[b];
-        const f = U({
+        const f = D({
           type: g,
           value: u,
           format: l
@@ -270,7 +271,7 @@ function In({
       }, {});
     },
     [a]
-  ), s = S(
+  ), s = B(
     () => ({
       page: i,
       getPageMeta: a,
@@ -299,17 +300,17 @@ function Ue({ icon: t, ...e }) {
   return /* @__PURE__ */ r(Bt, { icon: t, ...e, ref: null });
 }
 function Fe({ icon: t, className: e = "", size: o = "1rem", ...n }) {
-  return /* @__PURE__ */ r(De, { component: Ue, className: x("css-icon", e), size: o, ...n, icon: t });
+  return /* @__PURE__ */ r(Ge, { component: Ue, className: x("css-icon", e), size: o, ...n, icon: t });
 }
-const De = _(h)`
+const Ge = _(h)`
   &.css-icon {
     display: inline-block;
     width: ${({ size: t }) => t};
     height: ${({ size: t }) => t};
   }
 `;
-function Ge({ icon: t, className: e = "", size: o = "1rem", imageMeta: n, ...i }) {
-  const a = A(B(t), 540), [c, s] = Z(!1), l = Nt();
+function De({ icon: t, className: e = "", size: o = "1rem", imageMeta: n, ...i }) {
+  const a = j(P(t), 540), [c, s] = Z(!1), l = Nt();
   return c ? /* @__PURE__ */ r(Fe, { icon: "i-mdi:image", color: l.palette.grey[500], size: o, className: e, ...i }) : /* @__PURE__ */ r(He, { className: x("image-icon", e), size: o, ...i, children: /* @__PURE__ */ r(
     "img",
     {
@@ -335,26 +336,26 @@ const He = _(h)`
 `, pt = (t) => typeof t == "string" && /^[\w-_]+:[\w-_]+$/.test(t);
 function st({ icon: t, size: e = "1rem", imageMeta: o, ...n }) {
   const i = window.isNaN(e) ? e : `${e}px`;
-  return pt(t) ? /* @__PURE__ */ r(Bt, { icon: t }) : /* @__PURE__ */ r(Ye, { component: Ge, imageMeta: o, className: "base-icon", icon: t, size: i, ...n });
+  return pt(t) ? /* @__PURE__ */ r(Bt, { icon: t }) : /* @__PURE__ */ r(Ye, { component: De, imageMeta: o, className: "base-icon", icon: t, size: i, ...n });
 }
 const Ye = _(h)`
   flex-shrink: 0;
 `;
-function F({ text: t, children: e, icon: o = "", endIcon: n, color: i = "primary", link: a = "", href: c = "", ...s }) {
+function H({ text: t, children: e, icon: o = "", endIcon: n, color: i = "primary", link: a = "", href: c = "", ...s }) {
   const l = o ? /* @__PURE__ */ r(st, { icon: o }) : null, d = n ? /* @__PURE__ */ r(st, { icon: n }) : null, p = a || c, m = { ...s };
   return p && (m.href = p, at(p) && (m.target = m.target || "_blank")), /* @__PURE__ */ r(ie, { startIcon: l, endIcon: d, color: i, ...m, children: t || e });
 }
-function Rt({ editing: t, text: e, ...o }) {
+function jt({ editing: t, text: e, ...o }) {
   const { pages: n = [] } = zt(), i = n.find((a) => a.id === (o.link || o.linkId));
   if (t)
-    return /* @__PURE__ */ r(F, { ...N(o, ["link", "linkId"]), children: e });
+    return /* @__PURE__ */ r(H, { ...M(o, ["link", "linkId"]), children: e });
   if (i) {
     const a = i.path || "/";
-    return /* @__PURE__ */ r(oe, { to: a, children: /* @__PURE__ */ r(F, { ...N(o, ["link", "linkId"]), children: e }) });
+    return /* @__PURE__ */ r(oe, { to: a, children: /* @__PURE__ */ r(H, { ...M(o, ["link", "linkId"]), children: e }) });
   }
-  return /* @__PURE__ */ r(F, { ...N(o, "linkId"), children: e });
+  return /* @__PURE__ */ r(H, { ...M(o, "linkId"), children: e });
 }
-function j({ actions: t, center: e, className: o, align: n }) {
+function T({ actions: t, center: e, className: o, align: n }) {
   return t && t?.length ? /* @__PURE__ */ r(
     h,
     {
@@ -371,7 +372,7 @@ function j({ actions: t, center: e, className: o, align: n }) {
     }
   ) : null;
 }
-const Ve = "section", Je = Gt(h)`
+const Ve = "section", Je = Dt(h)`
   overflow: hidden;
 
   .section__title {
@@ -454,20 +455,20 @@ function et({
 }) {
   const y = Mt();
   if (!t && !e && !n && !p && !d && !c && !s && !g) return null;
-  const k = Math.max(Math.min(5, l + 1), 1), $ = {
+  const v = Math.max(Math.min(5, l + 1), 1), $ = {
     1: "xl:!text-3xl lg:!text-2xl md:!text-xl",
     2: "xl:!text-2xl lg:!text-xl md:!text-lg",
     3: "xl:!text-2xl lg:!text-xl md:!text-lg",
     4: "xl:!text-xl lg:!text-lg md:!text-md",
     5: "xl:!text-lg md:!text-md sm:!text-sm",
     6: "!text-sm"
-  }, P = l === 0 ? "big" : `h${k}`, C = l === 0;
+  }, W = l === 0 ? "big" : `h${v}`, S = l === 0;
   return /* @__PURE__ */ w(Je, { className: x("base-info", "lg:text-left", m && "!text-center", i), ...f, children: [
     c && /* @__PURE__ */ r("div", { children: c }),
     (d || p) && /* @__PURE__ */ r("div", { className: x("section__tag", a?.tag || a?.badge), children: d || p }),
     g && /* @__PURE__ */ r("img", { className: "w-[120px] m-auto mb-8", src: g, alt: "info", loading: "lazy" }),
     t && /* @__PURE__ */ r(
-      L,
+      z,
       {
         sx: {
           whiteSpace: "pre-wrap",
@@ -480,10 +481,10 @@ function et({
           "dark:text-gray-50",
           a.title,
           "page-kit-section__title",
-          C ? "" : "section__title_non_big"
+          S ? "" : "section__title_non_big"
         ),
         component: `h${Math.max(l, 1)}`,
-        variant: P,
+        variant: W,
         children: t
       }
     ),
@@ -497,14 +498,14 @@ function et({
           "section__description",
           "text-gray-800",
           "dark:text-gray-100",
-          $[k],
+          $[v],
           a.description,
           "page-kit-section__description"
         ),
         children: /* @__PURE__ */ r(ae, { codeOptions: { showActionButton: !1, theme: se }, children: e })
       }
     ) : /* @__PURE__ */ r(
-      L,
+      z,
       {
         sx: {
           whiteSpace: "pre-wrap",
@@ -514,7 +515,7 @@ function et({
           "section__description",
           "text-gray-800",
           "dark:text-gray-100",
-          $[k],
+          $[v],
           a.description,
           "page-kit-section__description"
         ),
@@ -524,7 +525,7 @@ function et({
         children: e
       }
     )),
-    /* @__PURE__ */ r(j, { actions: n, center: m, className: "mt-8" }),
+    /* @__PURE__ */ r(T, { actions: n, center: m, className: "mt-8" }),
     s && /* @__PURE__ */ r("div", { children: s })
   ] });
 }
@@ -552,7 +553,7 @@ function Xe(t = "") {
   const e = /^(((ht|f)tps?):\/\/)?([^!@#$%^&*?.\s-]([^!@#$%^&*?.\s]{0,63}[^!@#$%^&*?.\s])?\.)+[a-z]{2,6}\/?/, o = /^(\/|\.\/|\.\.\/)(?:[^/]+\/)*[^/]+$/;
   return e.test(t) || o.test(t);
 }
-function O(t) {
+function G(t) {
   return t?.endsWith(".mp4") || t?.endsWith(".m4v") || t?.endsWith(".webm");
 }
 function qe(t) {
@@ -560,11 +561,11 @@ function qe(t) {
 }
 function Qe(t) {
   let e = {};
-  return typeof t == "string" ? de(t) ? e.image = t : (e.image = B(t), me(t) && (e.color = t, e.image = "")) : e = t, e;
+  return typeof t == "string" ? de(t) ? e.image = t : (e.image = P(t), me(t) && (e.color = t, e.image = "")) : e = t, e;
 }
 function Ze() {
   const [t, e] = Z(Date.now());
-  return G(() => {
+  return V(() => {
     const o = () => {
       e(Date.now());
     };
@@ -578,7 +579,7 @@ function xt(t, e, o, n, i) {
   const { color: c = "", image: s } = Qe(e);
   if (s && Xe(s)) {
     delete o.backgroundColor;
-    const l = !(t.mobile.apple.device || Ke()) && O(s), d = O(s) && n ? A(B(n), 1200, "quality") : "";
+    const l = !(t.mobile.apple.device || Ke()) && G(s), d = G(s) && n ? j(P(n), 1200, "quality") : "";
     l ? a = /* @__PURE__ */ r(
       h,
       {
@@ -590,7 +591,7 @@ function xt(t, e, o, n, i) {
         controls: !1,
         playsInline: !0,
         poster: d,
-        src: O(s) ? s : A(s, 1200, "quality"),
+        src: G(s) ? s : j(s, 1200, "quality"),
         sx: {
           width: "100%",
           position: "absolute",
@@ -606,7 +607,7 @@ function xt(t, e, o, n, i) {
     ) : a = /* @__PURE__ */ r(
       Pt,
       {
-        src: O(s) && n ? d : s,
+        src: G(s) && n ? d : s,
         sizesAttr: {
           sm: 600,
           md: 900,
@@ -660,14 +661,14 @@ function nt({
 }) {
   const d = { ...n }, p = It((u) => u.breakpoints.down("md"));
   t && (d.color = ft.common.white, d.backgroundColor = `${ft.grey[900]} !important`), i.show && (d.display = "flex");
-  const m = S(() => !Number(l.boxMaxWidth) || p ? {
+  const m = B(() => !Number(l.boxMaxWidth) || p ? {
     width: "100%"
   } : s === "wall" && l.boxMaxWidth ? {
     maxWidth: `${l.boxMaxWidth}px !important`,
     width: "100%"
   } : {
     width: "100%"
-  }, [l.boxMaxWidth, p, s]), g = U({
+  }, [l.boxMaxWidth, p, s]), g = D({
     type: "baseSectionPaddingY",
     value: a || "normal",
     // section default is normal
@@ -681,7 +682,7 @@ function nt({
       className: x("base-section", "px-2 md:px-5 lg:px-5 xl:px-10", o, {
         dark: t
       }),
-      ...N(
+      ...M(
         l,
         "hoverStyle",
         "boxMaxWidth",
@@ -692,11 +693,11 @@ function nt({
         "titleAppearance",
         "descriptionAppearance"
       ),
-      children: /* @__PURE__ */ r(to, { autoWidth: l?.autoWidth, className: x("section-content h-full"), sx: m, children: i.show ? /* @__PURE__ */ r(jt, { ...c, boxed: i, children: e }) : e })
+      children: /* @__PURE__ */ r(to, { autoWidth: l?.autoWidth, className: x("section-content h-full"), sx: m, children: i.show ? /* @__PURE__ */ r(Rt, { ...c, boxed: i, children: e }) : e })
     }
   );
 }
-function jt({
+function Rt({
   background: t = "",
   backgroundVideoPoster: e,
   children: o,
@@ -737,7 +738,7 @@ function jt({
     }
   );
 }
-const eo = _(jt)`
+const eo = _(Rt)`
   &:nth-of-type(even) {
     background: #f8f8f8;
   }
@@ -761,7 +762,7 @@ function Et(t) {
   }
   return Array.isArray(t);
 }
-const I = "&>*";
+const A = "&>*";
 function Tt({ children: t, col: e, gap: o, className: n, align: i, sx: a, type: c, ...s } = {
   children: null,
   className: "",
@@ -792,28 +793,28 @@ function Tt({ children: t, col: e, gap: o, className: n, align: i, sx: a, type:
   Et(t) || (u = 0);
   const f = (e - 1) * u / e;
   let y = { ...a, gap: `${u}rem` };
-  const k = { [I]: { width: "100%" } }, $ = {}, P = {}, C = {};
-  switch (k.gap = "1rem", $.gap = `${u / 2}rem`, e) {
+  const v = { [A]: { width: "100%" } }, $ = {}, W = {}, S = {};
+  switch (v.gap = "1rem", $.gap = `${u / 2}rem`, e) {
     case 3:
     case 4:
-      $[I] = {
+      $[A] = {
         width: `calc(50% - ${u / 2}rem)`
       };
       break;
     case 5:
     case 6:
-      k[I] = {
+      v[A] = {
         width: `calc(50% - ${u / 2 / 2}rem)`
-      }, $[I] = {
+      }, $[A] = {
         width: `calc(50% - ${u / 2 / 2}rem)`
-      }, P[I] = {
+      }, W[A] = {
         width: `calc(33.33% - ${u * 2 / 3}rem)`
       };
       break;
   }
-  return y[I] = { width: `calc(${d}% - ${f}rem)` }, y[`@media (max-width: ${l.breakpoints.values.xl}px)`] = C, y[`@media (max-width: ${l.breakpoints.values.lg}px)`] = P, y[`@media (max-width: ${l.breakpoints.values.md}px)`] = $, y[`@media (max-width: ${l.breakpoints.values.sm}px)`] = k, c === "wall" && (y = { ...a, gap: `${u}rem` }, y[I] = { width: `calc(${d}% - ${f}rem)` }, k[I] = { width: `calc(45% - ${u / 2 / 2}rem)` }, y[`@media (max-width: ${l.breakpoints.values.sm}px)`] = k), /* @__PURE__ */ r(h, { className: x("flex flex-wrap flex-row h-full", m, n), sx: y, ...s, children: t });
+  return y[A] = { width: `calc(${d}% - ${f}rem)` }, y[`@media (max-width: ${l.breakpoints.values.xl}px)`] = S, y[`@media (max-width: ${l.breakpoints.values.lg}px)`] = W, y[`@media (max-width: ${l.breakpoints.values.md}px)`] = $, y[`@media (max-width: ${l.breakpoints.values.sm}px)`] = v, c === "wall" && (y = { ...a, gap: `${u}rem` }, y[A] = { width: `calc(${d}% - ${f}rem)` }, v[A] = { width: `calc(45% - ${u / 2 / 2}rem)` }, y[`@media (max-width: ${l.breakpoints.values.sm}px)`] = v), /* @__PURE__ */ r(h, { className: x("flex flex-wrap flex-row h-full", m, n), sx: y, ...s, children: t });
 }
-function E({ type: t = "", icon: e = "", size: o = "3rem", className: n = "", ...i }) {
+function O({ type: t = "", icon: e = "", size: o = "3rem", className: n = "", ...i }) {
   return /* @__PURE__ */ r(
     st,
     {
@@ -855,14 +856,14 @@ function oo({
     a === "auto" && (g = "_blank"), u = t;
   else {
     pe(u) && (u = X(window.location.pathname, u));
-    const f = ue(`${window.location.origin}${u}`), y = d.some((k) => k.pathname === f.pathname);
+    const f = ue(`${window.location.origin}${u}`), y = d.some((v) => v.pathname === f.pathname);
     if (s || y)
       return /* @__PURE__ */ r(
         ne,
         {
           end: !0,
           to: rt(u),
-          className: ({ isActive: k }) => x(n, k ? i : ""),
+          className: ({ isActive: v }) => x(n, v ? i : ""),
           ...l,
           children: o
         }
@@ -878,12 +879,12 @@ function oo({
       ...l,
       children: [
         o,
-        b && /* @__PURE__ */ r(E, { icon: "i-mdi:arrow-top-right", size: "0.9em", className: "smart-link__mark", style: { marginLeft: 5 } })
+        b && /* @__PURE__ */ r(O, { icon: "i-mdi:arrow-top-right", size: "0.9em", className: "smart-link__mark", style: { marginLeft: 5 } })
       ]
     }
   );
 }
-function H({
+function J({
   prepend: t,
   append: e,
   children: o,
@@ -908,7 +909,7 @@ function H({
         borderColor: m.palette.divider
       },
       ...s,
-      ...N(c, ["listType", "dark", "iconColor", "link", "hoverStyle", "imageSize"]),
+      ...M(c, ["listType", "dark", "iconColor", "link", "hoverStyle", "imageSize"]),
       children: [
         t,
         !p && /* @__PURE__ */ r("div", { className: "card__body", children: o }),
@@ -933,7 +934,7 @@ const no = _(h)`
     padding: 15px 15px;
   }
 `;
-function Y({
+function K({
   align: t = "left",
   title: e,
   titleProps: o = {},
@@ -942,7 +943,7 @@ function Y({
 }) {
   return /* @__PURE__ */ w(Q, { children: [
     e && /* @__PURE__ */ r(
-      L,
+      z,
       {
         className: x("card__title text-gray-800", "dark:text-gray-50"),
         component: "h5",
@@ -954,7 +955,7 @@ function Y({
       }
     ),
     n && /* @__PURE__ */ r(
-      L,
+      z,
       {
         className: x("card__description", "text-gray-500", "dark:text-gray-400"),
         component: "div",
@@ -980,7 +981,7 @@ function ro({
   align: d,
   ...p
 }) {
-  const m = pt(t), g = A(B(t), 540);
+  const m = pt(t), g = j(P(t), 540);
   return /* @__PURE__ */ w(
     io,
     {
@@ -999,7 +1000,7 @@ function ro({
             alignItems: "center",
             justifyContent: "center"
           },
-          children: /* @__PURE__ */ r(E, { icon: t, color: "primary.main" })
+          children: /* @__PURE__ */ r(O, { icon: t, color: "primary.main" })
         }
       ) : g && /* @__PURE__ */ r(
         "img",
@@ -1016,7 +1017,7 @@ function ro({
       ) }),
       children: [
         e || o ? /* @__PURE__ */ r(
-          Y,
+          K,
           {
             align: d,
             title: e,
@@ -1025,12 +1026,12 @@ function ro({
             descriptionProps: s
           }
         ) : null,
-        l?.length ? /* @__PURE__ */ r(j, { align: d, actions: l, className: "mt-4" }) : null
+        l?.length ? /* @__PURE__ */ r(T, { align: d, actions: l, className: "mt-4" }) : null
       ]
     }
   );
 }
-const io = _(H)`
+const io = _(J)`
   ${(t) => t.hoverStyle === "none" ? "" : t.link ? `transition: box-shadow ease .3s;
               &:hover {
                 box-shadow: 0 0 10px rgba(95, 142, 244, 0.42);
@@ -1078,7 +1079,7 @@ function yt({
 }) {
   return /* @__PURE__ */ w(ao, { className: x("card", `list-type-${c}`, s), align: a, ...l, children: [
     e && /* @__PURE__ */ r(
-      E,
+      O,
       {
         icon: e,
         color: "primary.main",
@@ -1086,11 +1087,11 @@ function yt({
         imageMeta: o
       }
     ),
-    t || n ? /* @__PURE__ */ r(Y, { align: a, title: t, description: n }) : null,
-    i?.length ? /* @__PURE__ */ r(j, { align: a, actions: i, className: "mt-4" }) : null
+    t || n ? /* @__PURE__ */ r(K, { align: a, title: t, description: n }) : null,
+    i?.length ? /* @__PURE__ */ r(T, { align: a, actions: i, className: "mt-4" }) : null
   ] });
 }
-const ao = _(H)`
+const ao = _(J)`
   padding: 5vw 4vw;
   box-sizing: border-box;
   /* min-height: 320px; */
@@ -1164,7 +1165,7 @@ function so({
   align: d,
   ...p
 }) {
-  const m = pt(t), g = A(B(t), 540);
+  const m = pt(t), g = j(P(t), 540);
   return /* @__PURE__ */ w(
     lo,
     {
@@ -1183,7 +1184,7 @@ function so({
             alignItems: "center",
             justifyContent: "center"
           },
-          children: /* @__PURE__ */ r(E, { icon: t, color: "primary.main" })
+          children: /* @__PURE__ */ r(O, { icon: t, color: "primary.main" })
         }
       ) : g && /* @__PURE__ */ r(
         h,
@@ -1206,7 +1207,7 @@ function so({
       ) }),
       children: [
         e || o ? /* @__PURE__ */ r(
-          Y,
+          K,
           {
             align: d,
             title: e,
@@ -1215,12 +1216,12 @@ function so({
             descriptionProps: s
           }
         ) : null,
-        l?.length ? /* @__PURE__ */ r(j, { align: d, actions: l, className: "mt-4" }) : null
+        l?.length ? /* @__PURE__ */ r(T, { align: d, actions: l, className: "mt-4" }) : null
       ]
     }
   );
 }
-const lo = _(H)`
+const lo = _(J)`
   ${(t) => t.hoverStyle === "none" ? "" : t.link ? `transition: box-shadow ease .3s;
               &:hover {
                 box-shadow: 0 0 10px rgba(95, 142, 244, 0.42);
@@ -1257,14 +1258,14 @@ function co({
   ...l
 }) {
   return /* @__PURE__ */ r(mo, { className: x("card", s), ...l, children: /* @__PURE__ */ w(h, { className: "flex items-center", children: [
-    e && /* @__PURE__ */ r(E, { icon: e, color: "primary.main", size: n, imageMeta: o }),
+    e && /* @__PURE__ */ r(O, { icon: e, color: "primary.main", size: n, imageMeta: o }),
     /* @__PURE__ */ w(h, { className: "flex-1 ml-4", children: [
-      /* @__PURE__ */ r(Y, { align: c, title: t, description: i }),
-      /* @__PURE__ */ r(j, { align: c, actions: a, className: "mt-4" })
+      /* @__PURE__ */ r(K, { align: c, title: t, description: i }),
+      /* @__PURE__ */ r(T, { align: c, actions: a, className: "mt-4" })
     ] })
   ] }) });
 }
-const mo = _(H)`
+const mo = _(J)`
   padding: 5vw 4vw;
   text-align: left;
   box-sizing: border-box;
@@ -1336,9 +1337,9 @@ function po({
   ...d
 }) {
   return /* @__PURE__ */ w(uo, { className: x("card-simple", c, `hover-style__${l}`), align: s, ...d, children: [
-    i && /* @__PURE__ */ r(E, { icon: i, color: "primary.main", imageMeta: a }),
+    i && /* @__PURE__ */ r(O, { icon: i, color: "primary.main", imageMeta: a }),
     t || o ? /* @__PURE__ */ r(
-      Y,
+      K,
       {
         align: s,
         title: t,
@@ -1349,7 +1350,7 @@ function po({
     ) : null
   ] });
 }
-const uo = _(H)`
+const uo = _(J)`
   .card__title {
     color: ${({ theme: t }) => t.palette.text.primary};
     a {
@@ -1454,7 +1455,7 @@ function go({ type: t = "default", ...e }) {
     default: yt,
     wall: so
   }[t] || yt;
-  return /* @__PURE__ */ r(n, { ...t === "news" ? e : N(e, "iconSize") });
+  return /* @__PURE__ */ r(n, { ...t === "news" ? e : M(e, "iconSize") });
 }
 function ho({
   list: t = [],
@@ -1514,8 +1515,8 @@ const fo = [
   "type",
   "textAlign"
 ];
-function M(t, e) {
-  const o = lt(t, e), n = N(t, e);
+function I(t, e) {
+  const o = lt(t, e), n = M(t, e);
   return [o, n];
 }
 const xo = _(nt)`
@@ -1535,7 +1536,7 @@ const xo = _(nt)`
   }
 `;
 function bo({ className: t, ...e }) {
-  const [o, n] = M(e, ot), [i, a] = M(n, fo);
+  const [o, n] = I(e, ot), [i, a] = I(n, fo);
   return /* @__PURE__ */ w(xo, { className: x("section--card-list", t), type: e.type, ...a, children: [
     Object.keys(o).length > 0 && /* @__PURE__ */ r(et, { center: !0, ...o, className: "mb-[2.5vw]" }),
     /* @__PURE__ */ r(ho, { ...i, dark: !!e.dark })
@@ -1558,12 +1559,12 @@ const yo = _(bo)`
   }
 `;
 function wo({ section: t, ...e }) {
-  const [{ editing: o }, n] = M(e, tt), i = S(() => ({
-    ...N(n, ["listBorder", "list", "iconSize", "imageSize"]),
+  const [{ editing: o }, n] = I(e, tt), i = B(() => ({
+    ...M(n, ["listBorder", "list", "iconSize", "imageSize"]),
     list: n.list?.map((a) => ({
-      ...N(a, "icon", "iconColor"),
+      ...M(a, "icon", "iconColor"),
       image: ["news", "simple", "default"].includes(n.type) && a.icon ? a.icon : a.image,
-      actions: a.actions?.map?.((c) => /* @__PURE__ */ r(Rt, { ...c, editing: o }, c.id)),
+      actions: a.actions?.map?.((c) => /* @__PURE__ */ r(jt, { ...c, editing: o }, c.id)),
       border: n.listBorder,
       iconSize: n.iconSize,
       imageSize: n.imageSize,
@@ -1598,7 +1599,7 @@ function vo({
         py: 2
       },
       children: /* @__PURE__ */ r(
-        L,
+        z,
         {
           variant: "caption",
           sx: {
@@ -1632,7 +1633,7 @@ function ko({
   );
 }
 function _o({ dataId: t, src: e, actions: o, center: n, onLoad: i, ...a }) {
-  const [c, s] = M(a, ot);
+  const [c, s] = I(a, ot);
   return /* @__PURE__ */ w(nt, { ...s, children: [
     Object.keys(c).length > 0 && /* @__PURE__ */ r(et, { center: n, ...c }),
     /* @__PURE__ */ r(
@@ -1644,7 +1645,7 @@ function _o({ dataId: t, src: e, actions: o, center: n, onLoad: i, ...a }) {
         height: a.iframeHeight ? `${a.iframeHeight}px` : "100%"
       }
     ),
-    /* @__PURE__ */ r(j, { actions: o, center: n })
+    /* @__PURE__ */ r(T, { actions: o, center: n })
   ] });
 }
 const An = {
@@ -1659,10 +1660,10 @@ const An = {
   id: ""
 };
 function $o({ section: t, id: e, src: o, ...n }) {
-  const i = `${e}-${n.locale}`, [{ editing: a }, c] = M(n, tt), s = ct({}), l = JSON.parse(JSON.stringify(c)), { message: d } = ge(i, "server"), p = he(JSON.parse(JSON.stringify(c.config) || "{}"));
-  return G(() => {
+  const i = `${e}-${n.locale}`, [{ editing: a }, c] = I(n, tt), s = ct({}), l = JSON.parse(JSON.stringify(c)), { message: d } = ge(i, "server"), p = he(JSON.parse(JSON.stringify(c.config) || "{}"));
+  return V(() => {
     d && d.onInit(() => p.current);
-  }, [d]), G(() => {
+  }, [d]), V(() => {
     const m = JSON.parse(JSON.stringify(c.config) || "{}");
     fe(s.current, m) || (s.current = m, d?.send("config-set", m));
   }, [d, c.config]), o ? /* @__PURE__ */ r(_o, { ...l, dataId: i, src: o, style: a ? { pointerEvents: "none" } : {} }) : /* @__PURE__ */ r(Co, { children: 'Please set the "src" attribute for this block' });
@@ -1702,38 +1703,47 @@ const Co = _("div")`
     maxY: l
   };
 }, Io = (t) => Object.values(t).reduce((e, o) => Math.max(e, o.y || 0), 0) || 0, Wo = (t) => {
-  const { dev: e, id: o, section: n, onBlockRender: i } = t, a = e?.mode, c = Vt((v) => v.breakpoints.down("sm")), { t: s } = be(), { sections: l, sectionIds: d, config: p } = n, { columns: m = Mo, gridSettings: g, gap: u, padding: b, background: f, alignContent: y } = p || {}, k = S(() => U({
-    type: "layoutBlockGap",
-    value: u ?? So,
-    format: "sx"
-  }), [u]), $ = S(() => U({
+  const { dev: e, id: o, section: n, onBlockRender: i } = t, a = e?.mode, c = Vt((k) => k.breakpoints.down("sm")), { t: s } = be(), { sections: l, sectionIds: d, config: p } = n, { columns: m = Mo, gridSettings: g, gap: u, padding: b, background: f, alignContent: y } = p || {}, v = B(() => {
+    const C = D({
+      type: "layoutBlockGap",
+      value: u ?? So,
+      format: "sx"
+    }), E = {
+      ...C,
+      gap: Object.keys(C.gap).reduce((N, L) => (N[L] = -C.gap[L], N), {})
+    };
+    return {
+      item: C,
+      container: E
+    };
+  }, [u]), $ = B(() => D({
     type: "layoutBlockPadding",
     value: b ?? No,
     format: "sx"
-  }), [b]), P = S(() => U({
+  }), [b]), W = B(() => D({
     type: "layoutBlockAlignContent",
     // 使用类型断言避免类型错误
     value: y ?? vt,
     format: "sx"
-  }), [y]), C = D(
-    (v, R = !1, V = 0) => {
-      if (!i || !v || !v.component || v.visibility === "hidden")
+  }), [y]), S = Y(
+    (k, C = !1, E = 0) => {
+      if (!i || !k || !k.component || k.visibility === "hidden")
         return null;
-      const W = Po({
+      const N = Po({
         gridSettings: g,
-        section: v,
-        index: V,
+        section: k,
+        index: E,
         columns: m,
         simulateMode: c ? "mobile" : "desktop",
-        isBackground: R
-      }), J = W?.x ?? 0, K = W?.y ?? 0, T = W?.w ?? m, Ot = W?.h ?? 1, Ut = W?.maxY ?? 0, Ft = !!n?.config?.backgroundSectionId;
+        isBackground: C
+      }), L = N?.x ?? 0, U = N?.y ?? 0, F = N?.w ?? m, Ot = N?.h ?? 1, Ut = N?.maxY ?? 0, Ft = !!n?.config?.backgroundSectionId;
       return /* @__PURE__ */ r(
         h,
         {
-          className: R ? "layout-block-background" : "layout-block-section",
+          className: C ? "layout-block-background" : "layout-block-section",
           sx: {
             // 背景元素和普通元素都使用 grid 布局
-            ...R ? {
+            ...C ? {
               // 背景元素覆盖整个网格区域
               gridColumn: "1 / -1",
               gridRow: `1 / ${Ut + 1}`,
@@ -1747,9 +1757,9 @@ const Co = _("div")`
             } : {
               position: "relative",
               // 使用 grid 定位普通元素
-              gridColumn: `${J + 1} / span ${T}`,
+              gridColumn: `${L + 1} / span ${F}`,
               // hasBackground 的话，不再 + 1，因为 background 会占用第一行
-              gridRow: `${K + (Ft ? 0 : 1)} / span ${Ot}`,
+              gridRow: `${U + (Ft ? 0 : 1)} / span ${Ot}`,
               zIndex: 1,
               // Ensure content is above background
               minWidth: 0,
@@ -1758,6 +1768,10 @@ const Co = _("div")`
               // 防止内容撑开网格项
               overflow: "hidden",
               // 防止子内容溢出网格项
+              // 只给非第一行添加上边距
+              ...U > 0 ? { mt: v?.item?.gap } : {},
+              // 只给非第一列添加左边距
+              ...L > 0 ? { ml: v?.item?.gap } : {},
               "& > .BlockBase-root": {
                 height: "100%",
                 width: "100%",
@@ -1766,30 +1780,30 @@ const Co = _("div")`
             }
           },
           children: i({
-            id: v.id,
-            type: v.component,
+            id: k.id,
+            type: k.component,
             config: {},
             section: {
-              ...v
+              ...k
             },
             mode: a
           })
         },
-        v.id
+        k.id
       );
     },
-    [o, a, i, g, m, c]
-  ), { backgroundElements: ut, contentElements: gt } = S(() => {
+    [o, a, i, g, m, c, v]
+  ), { backgroundElements: ut, contentElements: gt } = B(() => {
     if (!d || !d.length || !l || !Object.keys(l).length)
       return { backgroundElements: [], contentElements: [] };
-    const v = [], R = [];
-    return d?.forEach((V, W) => {
-      const J = l[V];
-      if (!J) return;
-      const K = n?.config?.backgroundSectionId === V, T = C(J, K, W);
-      T && (K ? v.push(T) : R.push(T));
-    }), { backgroundElements: v, contentElements: R };
-  }, [C, l, d]);
+    const k = [], C = [];
+    return d?.forEach((E, N) => {
+      const L = l[E];
+      if (!L) return;
+      const U = n?.config?.backgroundSectionId === E, F = S(L, U, N);
+      F && (U ? k.push(F) : C.push(F));
+    }), { backgroundElements: k, contentElements: C };
+  }, [S, l, d]);
   return a === "draft" && !ut?.length && !gt?.length ? /* @__PURE__ */ w(
     h,
     {
@@ -1801,7 +1815,7 @@ const Co = _("div")`
         alignItems: "center",
         justifyContent: "center",
         gap: 2,
-        border: (v) => `2px dashed ${v.palette.divider}`,
+        border: (k) => `2px dashed ${k.palette.divider}`,
         borderRadius: 2,
         padding: 4,
         color: "text.secondary",
@@ -1851,13 +1865,13 @@ const Co = _("div")`
               bottom: 0,
               pointerEvents: "none",
               opacity: 0.1,
-              background: (v) => `
+              background: (k) => `
                 repeating-linear-gradient(
                   90deg,
                   transparent,
                   transparent calc(100% / ${m} - 1px),
-                  ${v.palette.grey[400]} calc(100% / ${m} - 1px),
-                  ${v.palette.grey[400]} calc(100% / ${m})
+                  ${k.palette.grey[400]} calc(100% / ${m} - 1px),
+                  ${k.palette.grey[400]} calc(100% / ${m})
                 )
               `
             }
@@ -1880,9 +1894,8 @@ const Co = _("div")`
         boxSizing: "border-box",
         overflow: "hidden",
         // Prevent content overflow
-        ...k,
         ...$,
-        alignContent: P?.alignContent ?? vt
+        alignContent: W?.alignContent ?? vt
       },
       children: [
         ut,
@@ -1900,7 +1913,7 @@ function Ao({
   fullSizeImage: a,
   ...c
 }) {
-  const [s, l] = M(c, ot), d = Object.keys(s).length > 0 && Object.values(lt(s, Lo)).filter(Boolean).length > 0 && /* @__PURE__ */ r(et, { ...s }), p = St(t) ? t : /* @__PURE__ */ r(h, { component: "img", src: t, alt: "", className: "block" }), m = ["phone", "macbook"].includes(e), g = t && /* @__PURE__ */ r(
+  const [s, l] = I(c, ot), d = Object.keys(s).length > 0 && Object.values(lt(s, Lo)).filter(Boolean).length > 0 && /* @__PURE__ */ r(et, { ...s }), p = St(t) ? t : /* @__PURE__ */ r(h, { component: "img", src: t, alt: "", className: "block" }), m = ["phone", "macbook"].includes(e), g = t && /* @__PURE__ */ r(
     h,
     {
       className: x(
@@ -1978,7 +1991,7 @@ const zo = [
   /\/v\/([^#&?]{11})/
   // /v/<id>
 ];
-function Ro(t) {
+function jo(t) {
   if (/youtu\.?be/.test(t))
     for (const e of zo) {
       const o = e.exec(t)?.[1];
@@ -1986,13 +1999,13 @@ function Ro(t) {
         return o;
     }
 }
-function jo(t) {
-  const e = Ro(t);
+function Ro(t) {
+  const e = jo(t);
   if (e)
     return `https://youtube.com/embed/${e}`;
 }
 function Eo({ src: t }) {
-  return G(() => {
+  return V(() => {
     import("@lottiefiles/lottie-player");
   }, []), /* @__PURE__ */ r("lottie-player", { autoplay: !0, loop: !0, mode: "normal", src: t });
 }
@@ -2011,11 +2024,11 @@ function To(t) {
 function Oo({ url: t }) {
   const e = ct(null), o = 495, [n, i] = Z(
     e.current ? e.current.offsetWidth * 0.5625 : o
-  ), a = D(() => {
+  ), a = Y(() => {
     const c = window.innerWidth > 990 ? 1 : window.innerWidth > 522 ? 1.2 : window.innerWidth > 400 ? 1.45 : 1.85, s = e.current ? e.current.offsetWidth * 0.5625 : o;
     return i(Math.floor(s * c));
   }, []);
-  return G(() => {
+  return V(() => {
     window.addEventListener("resize", a);
     const c = window.innerWidth > 990 ? 1 : window.innerWidth > 522 ? 1.2 : window.innerWidth > 400 ? 1.45 : 1.85, s = e.current ? e.current.offsetWidth * 0.5625 : o;
     return i(Math.floor(s * c)), function() {
@@ -2065,11 +2078,11 @@ function Fo({
   section: s,
   ...l
 }) {
-  const [{ editing: d }, p] = M({ ...l, boxed: e ? void 0 : o }, tt);
-  let m = Do(p.image, n, e, i, a, c);
+  const [{ editing: d }, p] = I({ ...l, boxed: e ? void 0 : o }, tt);
+  let m = Go(p.image, n, e, i, a, c);
   t || (m = null);
   let g = null;
-  return p.actions && (g = p.actions?.map?.((u, b) => /* @__PURE__ */ r(Rt, { ...u, editing: d }, b))), /* @__PURE__ */ r(
+  return p.actions && (g = p.actions?.map?.((u, b) => /* @__PURE__ */ r(jt, { ...u, editing: d }, b))), /* @__PURE__ */ r(
     Uo,
     {
       ...p,
@@ -2080,17 +2093,17 @@ function Fo({
     }
   );
 }
-function Do(t, e, o, n, i, a) {
+function Go(t, e, o, n, i, a) {
   if (t) {
     if (t.endsWith(".json"))
       return /* @__PURE__ */ r(Eo, { src: t });
     if (t.indexOf("twitter.com") !== -1)
       return /* @__PURE__ */ r(To, { sourceType: "url", url: t });
-    const c = jo(t);
+    const c = Ro(t);
     if (c)
       return /* @__PURE__ */ r(Oo, { url: c });
     const { naturalWidth: s, naturalHeight: l, filename: d } = n || {};
-    if (O(t))
+    if (G(t))
       return /* @__PURE__ */ r(
         "video",
         {
@@ -2106,8 +2119,8 @@ function Do(t, e, o, n, i, a) {
             width: "100%",
             height: "100%"
           },
-          poster: A(B(e), o ? 1200 : 540, i),
-          children: /* @__PURE__ */ r("source", { src: B(t), type: qe(t) })
+          poster: j(P(e), o ? 1200 : 540, i),
+          children: /* @__PURE__ */ r("source", { src: P(t), type: qe(t) })
         },
         t
       );
@@ -2115,7 +2128,7 @@ function Do(t, e, o, n, i, a) {
     return /* @__PURE__ */ r(
       Pt,
       {
-        src: B(t),
+        src: P(t),
         sizesAttr: {
           sm: 600 * p,
           md: 450 * p,
@@ -2135,15 +2148,15 @@ function Do(t, e, o, n, i, a) {
   }
   return null;
 }
-const Rn = ["production", "draft"];
-function jn({ mode: t, version: e } = {}) {
+const jn = ["production", "draft"];
+function Rn({ mode: t, version: e } = {}) {
   const o = e && typeof e == "number" ? { mode: t, version: e } : { mode: t };
   return dt.get(`/api/${mt()}/pages`, { params: o }).then((n) => n.data);
 }
 function En({ mode: t, routes: e }) {
   return dt.post(`/api/${mt()}/pages/publish`, { mode: t, routes: e }).then((o) => o.data);
 }
-function Go({
+function Do({
   locale: t,
   sort: e,
   page: o,
@@ -2157,14 +2170,14 @@ const Tn = {
   sort: "-updatedAt"
 }, kt = 20;
 function Ho({ style: t, sort: e, section: o, ...n }) {
-  const [{ editing: i, locale: a }, c] = M(n, tt), [s, l] = M(c, ot), [d, p] = Z(), m = ct(!1), g = ve(), u = re(), b = D(async () => {
+  const [{ editing: i, locale: a }, c] = I(n, tt), [s, l] = I(c, ot), [d, p] = Z(), m = ct(!1), g = ve(), u = re(), b = Y(async () => {
     if (!m.current) {
       m.current = !0, g();
       try {
-        const f = d ? Math.floor(d.list.length / kt) + 1 : 1, { list: y, total: k } = await Go({ locale: a, sort: e, page: f, limit: kt });
+        const f = d ? Math.floor(d.list.length / kt) + 1 : 1, { list: y, total: v } = await Do({ locale: a, sort: e, page: f, limit: kt });
         p(($) => ({
           list: ($?.list ?? []).concat(y),
-          total: k
+          total: v
         }));
       } finally {
         m.current = !1, g();
@@ -2204,13 +2217,13 @@ function Ho({ style: t, sort: e, section: o, ...n }) {
                       {
                         component: "img",
                         alt: "",
-                        image: A(B(f.image), 540),
+                        image: j(P(f.image), 540),
                         loading: "lazy"
                       }
                     ),
                     /* @__PURE__ */ w(qt, { children: [
-                      /* @__PURE__ */ r(L, { variant: "h6", component: "div", className: _t, children: f.title || f.id }),
-                      /* @__PURE__ */ r(L, { variant: "body2", className: _t, children: f.description })
+                      /* @__PURE__ */ r(z, { variant: "h6", component: "div", className: _t, children: f.title || f.id }),
+                      /* @__PURE__ */ r(z, { variant: "body2", className: _t, children: f.description })
                     ] })
                   ]
                 }
@@ -2227,7 +2240,7 @@ function Ho({ style: t, sort: e, section: o, ...n }) {
             textAlign: "center",
             mt: 2
           },
-          children: d.total > d.list.length ? /* @__PURE__ */ r(F, { variant: "outlined", color: "secondary", onClick: b, loading: m.current, children: "More" }) : /* @__PURE__ */ r(F, { variant: "outlined", color: "secondary", disabled: !0, children: "No More" })
+          children: d.total > d.list.length ? /* @__PURE__ */ r(H, { variant: "outlined", color: "secondary", onClick: b, loading: m.current, children: "More" }) : /* @__PURE__ */ r(H, { variant: "outlined", color: "secondary", disabled: !0, children: "No More" })
         }
       )
     ] }) : /* @__PURE__ */ r(
@@ -2286,25 +2299,25 @@ function Jo({
   page: c,
   ...s
 }) {
-  const l = Vo[e], { getPageMetaStyle: d } = Ee(), p = S(() => {
+  const l = Vo[e], { getPageMetaStyle: d } = Ee(), p = B(() => {
     const { height: u, ...b } = n;
     return e === "layout-block" && (b.onBlockRender = (f) => {
       const y = {
         ...n?.dev,
         ...f?.config?.dev
-      }, { defaultLocale: k } = y, $ = {
+      }, { defaultLocale: v } = y, $ = {
         ...lt(n, ["locale", "editing"]),
         ...f?.config,
         dev: y
-      }, { locale: P } = $;
-      let C = c?.dataSource?.[f?.id]?.[P];
-      return Zt(C) && (C = c?.dataSource?.[f?.id]?.[k ?? "en"]), /* @__PURE__ */ r(
+      }, { locale: W } = $;
+      let S = c?.dataSource?.[f?.id]?.[W];
+      return Zt(S) && (S = c?.dataSource?.[f?.id]?.[v ?? "en"]), /* @__PURE__ */ r(
         Jo,
         {
           ...f,
           config: {
             ...f?.section?.properties,
-            ...C,
+            ...S,
             ...$
           },
           page: c,
@@ -2312,7 +2325,7 @@ function Jo({
         }
       );
     }), b;
-  }, [n, e]), m = S(() => {
+  }, [n, e]), m = B(() => {
     const u = {};
     return e !== "custom-component" && (u.height = n.height), u.sx = a ? void 0 : d("sx"), u.id = `BlockBase-${t}`, u;
   }, [n.height, a, e, d]), g = l && /* @__PURE__ */ r(l, { mode: o, ...p, id: t, section: i });
@@ -2325,7 +2338,7 @@ function Ko({ type: t }) {
       sx: {
         p: 2
       },
-      children: /* @__PURE__ */ w(Qt, { icon: /* @__PURE__ */ r(Dt, {}), color: "error", children: [
+      children: /* @__PURE__ */ w(Qt, { icon: /* @__PURE__ */ r(Gt, {}), color: "error", children: [
         "Unsupported Block `",
         t,
         "`"
@@ -2337,10 +2350,10 @@ export {
   Jo as B,
   An as I,
   Wn as P,
-  Rn as S,
+  jn as S,
   Tn as T,
   In as a,
   zn as b,
-  jn as g,
+  Rn as g,
   En as p
 };