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

package/lib/es/chunks/{index-D3m-37ll.js → index-DrqhF7Qu.js}

@@ -1,37 +1,37 @@
-import { jsx as r, jsxs as w, Fragment as q } from "react/jsx-runtime";
-import { ErrorOutline as Ot } from "@mui/icons-material";
-import { Box as g, styled as Ut, Typography as L, Container as Ft, useTheme as Ht, useMediaQuery as Dt, Card as Gt, CircularProgress as Yt, Grid as ut, CardMedia as Vt, CardContent as Jt, Alert as Kt } from "@mui/material";
-import Xt from "lodash/isEmpty";
+import { jsx as r, jsxs as w, Fragment as Q } from "react/jsx-runtime";
+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 qt, { createContext as vt, useMemo as N, useCallback as F, useContext as kt, useState as Z, useEffect as H, Fragment as Qt, isValidElement as _t, useRef as ct } from "react";
-import j from "lodash/keyBy";
-import { styled as _, useTheme as $t } from "@arcblock/ux/lib/Theme";
+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 B from "lodash/omit";
-import { Link as Zt, NavLink as te, useNavigate as ee } from "react-router-dom";
-import oe from "@arcblock/ux/lib/Button";
+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 St } from "@iconify-icon/react";
-import { e as z, f as M, i as dt, l as mt } from "./state-DSo43FAB.js";
-import ne from "@blocklet/pages-kit/builtin/markdown/markdown-renderer";
-import { useColorConvert as Ct } from "@blocklet/pages-kit/contexts/color";
-import { materialDark as re } from "react-syntax-highlighter/dist/esm/styles/prism";
-import ie from "@arcblock/react-hooks/lib/useBrowser";
-import ht from "@arcblock/ux/lib/Colors";
-import { ResponsiveImage as Nt, CustomComponentRenderer as ae } from "@blocklet/pages-kit/components";
-import { isGradient as se, isColorString as le } from "@blocklet/pages-kit/utils/style";
-import Bt from "@mui/material/useMediaQuery";
-import { join as K } from "pathe";
-import { withoutTrailingSlash as rt, isRelative as ce, parseURL as de } from "ufo";
-import { useMessage as me } from "@blocklet/embed/message";
-import { useLatest as pe } from "ahooks";
-import ue from "lodash/isEqual";
-import { EmbedIframe as he } from "@blocklet/embed/react";
-import { useLocaleContext as ge } from "@arcblock/ux/lib/Locale/context";
-import fe from "@arcblock/ux/lib/Screenshot";
-import { TwitterTimelineEmbed as xe } from "react-twitter-embed";
-import { useUpdate as be, useMount as ye } from "react-use";
-const Mt = "{{CUSTOM_VALUE}}", we = [
+import { Icon as Bt } from "@iconify-icon/react";
+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";
+import le from "@arcblock/react-hooks/lib/useBrowser";
+import ft from "@arcblock/ux/lib/Colors";
+import { ResponsiveImage as Pt, CustomComponentRenderer as ce } from "@blocklet/pages-kit/components";
+import { isGradient as de, isColorString as me } from "@blocklet/pages-kit/utils/style";
+import It from "@mui/material/useMediaQuery";
+import { join as X } from "pathe";
+import { withoutTrailingSlash as rt, isRelative as pe, parseURL as ue } from "ufo";
+import { useMessage as ge } from "@blocklet/embed/message";
+import { useLatest as he } from "ahooks";
+import fe from "lodash/isEqual";
+import { EmbedIframe as xe } from "@blocklet/embed/react";
+import { useLocaleContext as be } from "@arcblock/ux/lib/Locale/context";
+import ye from "@arcblock/ux/lib/Screenshot";
+import { TwitterTimelineEmbed as we } from "react-twitter-embed";
+import { useUpdate as ve, useMount as ke } from "react-use";
+const Wt = "{{CUSTOM_VALUE}}", _e = [
   {
     title: "None",
     value: "none",
@@ -52,7 +52,7 @@ const Mt = "{{CUSTOM_VALUE}}", we = [
     value: "large",
     sx: { py: { xs: 7.5, md: 10, lg: 12.5, xl: 15 } }
   }
-], ve = [
+], $e = [
   {
     title: "None",
     value: "none",
@@ -73,7 +73,7 @@ const Mt = "{{CUSTOM_VALUE}}", we = [
     value: "large",
     sx: { py: { xs: 6, md: 9, lg: 9, xl: 11 } }
   }
-], ke = [
+], Ce = [
   {
     title: "None",
     value: "none",
@@ -94,17 +94,17 @@ const Mt = "{{CUSTOM_VALUE}}", we = [
     value: "large",
     sx: { px: { xs: 2.5, md: 10, lg: 12.5, xl: 15 } }
   }
-], X = (t, e, o) => {
+], q = (t, e, o) => {
   const n = t.breakpoints.values[o];
   return `${e}${n ? ` (${n}px)` : ""}`;
-}, _e = [
+}, Se = [
   {
     title: "100%",
     value: "full",
     sx: { maxWidth: "100%" }
   },
   {
-    title: (t) => X(t, "Small", "sm"),
+    title: (t) => q(t, "Small", "sm"),
     value: "sm",
     sx: {
       maxWidth: (t) => t.breakpoints.values.sm,
@@ -113,17 +113,17 @@ const Mt = "{{CUSTOM_VALUE}}", we = [
     }
   },
   {
-    title: (t) => X(t, "Normal", "md"),
+    title: (t) => q(t, "Normal", "md"),
     value: "md",
     sx: { maxWidth: (t) => t.breakpoints.values.md, width: "100%", mx: "auto" }
   },
   {
-    title: (t) => X(t, "Large", "lg"),
+    title: (t) => q(t, "Large", "lg"),
     value: "lg",
     sx: { maxWidth: (t) => t.breakpoints.values.lg, width: "100%", mx: "auto" }
   },
   {
-    title: (t) => X(t, "Extra Large", "xl"),
+    title: (t) => q(t, "Extra Large", "xl"),
     value: "xl",
     sx: { maxWidth: (t) => t.breakpoints.values.xl, width: "100%", mx: "auto" }
   },
@@ -131,16 +131,17 @@ const Mt = "{{CUSTOM_VALUE}}", we = [
     title: "Custom",
     value: "custom",
     sx: {
-      maxWidth: Mt,
+      maxWidth: Wt,
       width: "100%",
       mx: "auto"
     }
   }
-], $e = [
+], Ne = [
   {
     title: "None",
     value: "none",
-    sx: { gap: 0 }
+    sx: { gap: 0 },
+    containerSx: { gap: 0 }
   },
   {
     title: "Small",
@@ -150,14 +151,14 @@ const Mt = "{{CUSTOM_VALUE}}", we = [
   {
     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 } }
   }
-], Se = [
+], Be = [
   {
     title: "None",
     value: "none",
@@ -178,16 +179,48 @@ const Mt = "{{CUSTOM_VALUE}}", we = [
     value: "large",
     sx: { p: { xs: 3, md: 6, lg: 6, xl: 9 } }
   }
-], Ce = j(we, "value"), Ne = j(ve, "value"), Be = j(ke, "value"), Me = j(_e, "value"), Pe = j($e, "value"), Ie = j(Se, "value"), We = /* @__PURE__ */ new Map([
-  ["baseSectionPaddingY", Ce],
-  ["maxWidth", Me],
-  ["paddingY", Ne],
-  ["paddingX", Be],
-  ["layoutBlockGap", Pe],
-  ["layoutBlockPadding", Ie]
+], Me = [
+  {
+    title: "Start",
+    value: "start",
+    sx: { alignContent: "start" }
+  },
+  {
+    title: "End",
+    value: "end",
+    sx: { alignContent: "end" }
+  },
+  {
+    title: "Center",
+    value: "center",
+    sx: { alignContent: "center" }
+  },
+  {
+    title: "Space Between",
+    value: "space-between",
+    sx: { alignContent: "space-between" }
+  },
+  {
+    title: "Space Around",
+    value: "space-around",
+    sx: { alignContent: "space-around" }
+  },
+  {
+    title: "Space Evenly",
+    value: "space-evenly",
+    sx: { alignContent: "space-evenly" }
+  }
+], 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", je]
 ]);
-function Q(t) {
-  const { type: e, value: o, format: n = "sx", defaultValue: i = null } = t, a = We.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;
@@ -196,7 +229,7 @@ function Q(t) {
     if (c) {
       const d = o.replace("custom:", "");
       try {
-        return JSON.parse(JSON.stringify(l || {}).replaceAll(Mt, d));
+        return JSON.parse(JSON.stringify(l || {}).replaceAll(Wt, d));
       } catch {
       }
     }
@@ -204,33 +237,33 @@ function Q(t) {
   }
   return i;
 }
-const Pt = vt({
+const Lt = $t({
   page: null,
   getPageMeta: () => ({}),
   getPageMetaStyle: () => ({})
 });
-function Le() {
-  return kt(Pt);
+function Ee() {
+  return Ct(Lt);
 }
-function Cn({
+function In({
   page: t,
   children: e,
   defaultLocale: o = "en",
   currentLocale: n
 }) {
-  const i = N(() => t ? JSON.parse(JSON.stringify(t)) : null, [JSON.stringify(t)]), a = F(() => {
+  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 = F(
+  }, [i, o, n]), c = Y(
     (l = "sx") => {
       const d = a();
-      return !d || !d.style ? {} : Object.entries(d.style || {}).reduce((m, [h, u]) => {
+      return !d || !d.style ? {} : Object.entries(d.style || {}).reduce((m, [g, u]) => {
         if (!u) return m;
-        const b = `${h}Custom`;
+        const b = `${g}Custom`;
         d.style[b];
-        const f = Q({
-          type: h,
+        const f = D({
+          type: g,
           value: u,
           format: l
         });
@@ -238,7 +271,7 @@ function Cn({
       }, {});
     },
     [a]
-  ), s = N(
+  ), s = B(
     () => ({
       page: i,
       getPageMeta: a,
@@ -246,39 +279,39 @@ function Cn({
     }),
     [i, a, c]
   );
-  return /* @__PURE__ */ r(Pt.Provider, { value: s, children: e });
+  return /* @__PURE__ */ r(Lt.Provider, { value: s, children: e });
 }
 const tt = ["editing", "height", "locale", "dev", "sx"];
-function ze(t) {
+function Te(t) {
   const { className: e, ...o } = t;
-  return /* @__PURE__ */ r(Re, { ...o, className: x("BlockBase-root", e) });
+  return /* @__PURE__ */ r(Oe, { ...o, className: x("BlockBase-root", e) });
 }
-const Re = _(g)`
+const Oe = _(h)`
   position: relative;
   color: ${({ theme: t }) => t.palette.text.primary};
-`, It = vt({
+`, At = $t({
   pages: [],
   project: void 0
-}), { Provider: Nn, Consumer: Bn } = It;
-function Wt() {
-  return kt(It);
+}), { Provider: Wn, Consumer: Ln } = At;
+function zt() {
+  return Ct(At);
 }
-function je({ icon: t, ...e }) {
-  return /* @__PURE__ */ r(St, { icon: t, ...e, ref: null });
+function Ue({ icon: t, ...e }) {
+  return /* @__PURE__ */ r(Bt, { icon: t, ...e, ref: null });
 }
-function Ae({ icon: t, className: e = "", size: o = "1rem", ...n }) {
-  return /* @__PURE__ */ r(Ee, { component: je, className: x("css-icon", e), size: o, ...n, icon: t });
+function Fe({ icon: t, className: e = "", size: o = "1rem", ...n }) {
+  return /* @__PURE__ */ r(Ge, { component: Ue, className: x("css-icon", e), size: o, ...n, icon: t });
 }
-const Ee = _(g)`
+const Ge = _(h)`
   &.css-icon {
     display: inline-block;
     width: ${({ size: t }) => t};
     height: ${({ size: t }) => t};
   }
 `;
-function Te({ icon: t, className: e = "", size: o = "1rem", imageMeta: n, ...i }) {
-  const a = z(M(t), 540), [c, s] = Z(!1), l = $t();
-  return c ? /* @__PURE__ */ r(Ae, { icon: "i-mdi:image", color: l.palette.grey[500], size: o, className: e, ...i }) : /* @__PURE__ */ r(Oe, { className: x("image-icon", e), size: o, ...i, children: /* @__PURE__ */ r(
+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",
     {
       className: "image-icon__image",
@@ -291,7 +324,7 @@ function Te({ icon: t, className: e = "", size: o = "1rem", imageMeta: n, ...i }
     }
   ) });
 }
-const Oe = _(g)`
+const He = _(h)`
   display: inline-block;
   width: ${({ size: t }) => t};
   height: ${({ size: t }) => t};
@@ -303,28 +336,28 @@ const Oe = _(g)`
 `, 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(St, { icon: t }) : /* @__PURE__ */ r(Ue, { component: Te, 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 Ue = _(g)`
+const Ye = _(h)`
   flex-shrink: 0;
 `;
-function U({ 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(oe, { startIcon: l, endIcon: d, color: i, ...m, children: t || e });
+  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 Lt({ editing: t, text: e, ...o }) {
-  const { pages: n = [] } = Wt(), i = n.find((a) => a.id === (o.link || o.linkId));
+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(U, { ...B(o, ["link", "linkId"]), children: e });
+    return /* @__PURE__ */ r(H, { ...M(o, ["link", "linkId"]), children: e });
   if (i) {
     const a = i.path || "/";
-    return /* @__PURE__ */ r(Zt, { to: a, children: /* @__PURE__ */ r(U, { ...B(o, ["link", "linkId"]), children: e }) });
+    return /* @__PURE__ */ r(oe, { to: a, children: /* @__PURE__ */ r(H, { ...M(o, ["link", "linkId"]), children: e }) });
   }
-  return /* @__PURE__ */ r(U, { ...B(o, "linkId"), children: e });
+  return /* @__PURE__ */ r(H, { ...M(o, "linkId"), children: e });
 }
-function A({ actions: t, center: e, className: o, align: n }) {
+function T({ actions: t, center: e, className: o, align: n }) {
   return t && t?.length ? /* @__PURE__ */ r(
-    g,
+    h,
     {
       className: x(
         "flex gap-4 flex-wrap",
@@ -339,7 +372,7 @@ function A({ actions: t, center: e, className: o, align: n }) {
     }
   ) : null;
 }
-const Fe = "section", He = Ut(g)`
+const Ve = "section", Je = Dt(h)`
   overflow: hidden;
 
   .section__title {
@@ -390,7 +423,7 @@ const Fe = "section", He = Ut(g)`
       margin-bottom: 0.5rem;
     }
   }
-  @media (min-width: ${({ theme: t }) => t.breakpoints.values[Fe]}px) {
+  @media (min-width: ${({ theme: t }) => t.breakpoints.values[Ve]}px) {
     .section__tag {
       margin-bottom: 32px;
     }
@@ -415,27 +448,27 @@ function et({
   tag: d,
   badge: p,
   center: m,
-  logo: h,
+  logo: g,
   titleAppearance: u,
   descriptionAppearance: b,
   ...f
 }) {
-  const y = Ct();
-  if (!t && !e && !n && !p && !d && !c && !s && !h) return null;
-  const k = Math.max(Math.min(5, l + 1), 1), $ = {
+  const y = Mt();
+  if (!t && !e && !n && !p && !d && !c && !s && !g) return null;
+  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"
-  }, C = l === 0 ? "big" : `h${k}`, S = l === 0;
-  return /* @__PURE__ */ w(He, { className: x("base-info", "lg:text-left", m && "!text-center", i), ...f, children: [
+  }, 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 }),
-    h && /* @__PURE__ */ r("img", { className: "w-[120px] m-auto mb-8", src: h, alt: "info", loading: "lazy" }),
+    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",
@@ -451,12 +484,12 @@ function et({
           S ? "" : "section__title_non_big"
         ),
         component: `h${Math.max(l, 1)}`,
-        variant: C,
+        variant: W,
         children: t
       }
     ),
     e && (o ? /* @__PURE__ */ r(
-      g,
+      h,
       {
         sx: {
           ...b?.color && { color: `${y(b.color)} !important` }
@@ -465,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(ne, { codeOptions: { showActionButton: !1, theme: re }, children: e })
+        children: /* @__PURE__ */ r(ae, { codeOptions: { showActionButton: !1, theme: se }, children: e })
       }
     ) : /* @__PURE__ */ r(
-      L,
+      z,
       {
         sx: {
           whiteSpace: "pre-wrap",
@@ -482,7 +515,7 @@ function et({
           "section__description",
           "text-gray-800",
           "dark:text-gray-100",
-          $[k],
+          $[v],
           a.description,
           "page-kit-section__description"
         ),
@@ -492,7 +525,7 @@ function et({
         children: e
       }
     )),
-    /* @__PURE__ */ r(A, { actions: n, center: m, className: "mt-8" }),
+    /* @__PURE__ */ r(T, { actions: n, center: m, className: "mt-8" }),
     s && /* @__PURE__ */ r("div", { children: s })
   ] });
 }
@@ -511,28 +544,28 @@ const ot = [
   "titleAppearance",
   "descriptionAppearance"
 ];
-function De() {
+function Ke() {
   const t = navigator.userAgent.toLowerCase();
   return t.includes("safari") && !t.includes("chrome");
 }
-function Ge(t = "") {
+function Xe(t = "") {
   if (t.startsWith("data:image/svg+xml,")) return !0;
   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 Ye(t) {
+function qe(t) {
   return t?.endsWith(".mp4") || t?.endsWith(".m4v") ? "video/mp4" : t?.endsWith(".webm") ? "video/webm" : void 0;
 }
-function Ve(t) {
+function Qe(t) {
   let e = {};
-  return typeof t == "string" ? se(t) ? e.image = t : (e.image = M(t), le(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 Je() {
+function Ze() {
   const [t, e] = Z(Date.now());
-  return H(() => {
+  return V(() => {
     const o = () => {
       e(Date.now());
     };
@@ -541,14 +574,14 @@ function Je() {
     };
   }, []), t;
 }
-function gt(t, e, o, n, i) {
+function xt(t, e, o, n, i) {
   let a = null;
-  const { color: c = "", image: s } = Ve(e);
-  if (s && Ge(s)) {
+  const { color: c = "", image: s } = Qe(e);
+  if (s && Xe(s)) {
     delete o.backgroundColor;
-    const l = !(t.mobile.apple.device || De()) && O(s), d = O(s) && n ? z(M(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(
-      g,
+      h,
       {
         component: "video",
         className: "section-bg",
@@ -558,7 +591,7 @@ function gt(t, e, o, n, i) {
         controls: !1,
         playsInline: !0,
         poster: d,
-        src: O(s) ? s : z(s, 1200, "quality"),
+        src: G(s) ? s : j(s, 1200, "quality"),
         sx: {
           width: "100%",
           position: "absolute",
@@ -572,9 +605,9 @@ function gt(t, e, o, n, i) {
       },
       s
     ) : a = /* @__PURE__ */ r(
-      Nt,
+      Pt,
       {
-        src: O(s) && n ? d : s,
+        src: G(s) && n ? d : s,
         sizesAttr: {
           sm: 600,
           md: 900,
@@ -600,9 +633,9 @@ function gt(t, e, o, n, i) {
   } else s ? o.backgroundImage = `${s} !important` : c && (o.backgroundColor = `${c} !important`);
   return a;
 }
-function Ke({ autoWidth: t, children: e, ...o }) {
+function to({ autoWidth: t, children: e, ...o }) {
   return t ? /* @__PURE__ */ r(
-    g,
+    h,
     {
       ...o,
       sx: [
@@ -613,7 +646,7 @@ function Ke({ autoWidth: t, children: e, ...o }) {
       ],
       children: e
     }
-  ) : /* @__PURE__ */ r(Ft, { ...o, children: e });
+  ) : /* @__PURE__ */ r(Ht, { ...o, children: e });
 }
 function nt({
   dark: t = !1,
@@ -626,30 +659,30 @@ function nt({
   type: s,
   ...l
 }) {
-  const d = { ...n }, p = Bt((u) => u.breakpoints.down("md"));
-  t && (d.color = ht.common.white, d.backgroundColor = `${ht.grey[900]} !important`), i.show && (d.display = "flex");
-  const m = N(() => !Number(l.boxMaxWidth) || p ? {
+  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 = B(() => !Number(l.boxMaxWidth) || p ? {
     width: "100%"
   } : s === "wall" && l.boxMaxWidth ? {
     maxWidth: `${l.boxMaxWidth}px !important`,
     width: "100%"
   } : {
     width: "100%"
-  }, [l.boxMaxWidth, p, s]), h = Q({
+  }, [l.boxMaxWidth, p, s]), g = D({
     type: "baseSectionPaddingY",
     value: a || "normal",
     // section default is normal
     defaultValue: ""
   });
   return /* @__PURE__ */ r(
-    Xe,
+    eo,
     {
       component: "section",
-      styles: { ...d, ...h },
+      styles: { ...d, ...g },
       className: x("base-section", "px-2 md:px-5 lg:px-5 xl:px-10", o, {
         dark: t
       }),
-      ...B(
+      ...M(
         l,
         "hoverStyle",
         "boxMaxWidth",
@@ -660,11 +693,11 @@ function nt({
         "titleAppearance",
         "descriptionAppearance"
       ),
-      children: /* @__PURE__ */ r(Ke, { autoWidth: l?.autoWidth, className: x("section-content h-full"), sx: m, children: i.show ? /* @__PURE__ */ r(zt, { ...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 zt({
+function Rt({
   background: t = "",
   backgroundVideoPoster: e,
   children: o,
@@ -674,23 +707,23 @@ function zt({
   styles: c = {},
   ...s
 }) {
-  const l = { ...c, ...n }, d = Ct();
+  const l = { ...c, ...n }, d = Mt();
   let p = null;
-  const m = Bt((b) => b.breakpoints.up("sm")), h = ie(), u = Je();
-  return t && (p = gt(
-    h,
+  const m = It((b) => b.breakpoints.up("sm")), g = le(), u = Ze();
+  return t && (p = xt(
+    g,
     typeof t == "string" ? d(t) : t,
     l,
     e,
     u
-  )), i.show && (l.borderRadius = "10px", l.padding === void 0 && (l.padding = m ? "50px" : "20px"), i?.border && (l.border = "1px solid #c0c0c0"), i?.background && (p = gt(
-    h,
+  )), i.show && (l.borderRadius = "10px", l.padding === void 0 && (l.padding = m ? "50px" : "20px"), i?.border && (l.border = "1px solid #c0c0c0"), i?.background && (p = xt(
+    g,
     typeof i?.background == "string" ? d(i?.background) : i?.background,
     l,
     i?.backgroundVideoPoster,
     u
   ))), /* @__PURE__ */ w(
-    g,
+    h,
     {
       ...s,
       sx: {
@@ -705,7 +738,7 @@ function zt({
     }
   );
 }
-const Xe = _(zt)`
+const eo = _(Rt)`
   &:nth-of-type(even) {
     background: #f8f8f8;
   }
@@ -722,15 +755,15 @@ const Xe = _(zt)`
     }
   }
 `;
-function Rt(t) {
-  if (t.type === Qt) {
-    const o = (t.props.children || []).filter((n) => _t(n));
-    return o.length === 1 ? Rt(o[0]) : o.length > 1;
+function Et(t) {
+  if (t.type === ee) {
+    const o = (t.props.children || []).filter((n) => St(n));
+    return o.length === 1 ? Et(o[0]) : o.length > 1;
   }
   return Array.isArray(t);
 }
-const I = "&>*";
-function jt({ children: t, col: e, gap: o, className: n, align: i, sx: a, type: c, ...s } = {
+const A = "&>*";
+function Tt({ children: t, col: e, gap: o, className: n, align: i, sx: a, type: c, ...s } = {
   children: null,
   className: "",
   col: 3,
@@ -739,7 +772,7 @@ function jt({ children: t, col: e, gap: o, className: n, align: i, sx: a, type:
   align: "center",
   type: "default"
 }) {
-  const l = $t(), d = Number(Math.floor(100 / e * 100) / 100), p = {
+  const l = Nt(), d = Number(Math.floor(100 / e * 100) / 100), p = {
     center: "justify-center items-center",
     left: "justify-start items-center",
     right: "justify-end items-center",
@@ -757,31 +790,31 @@ function jt({ children: t, col: e, gap: o, className: n, align: i, sx: a, type:
     5: 3,
     6: 3
   }[e] || 0);
-  Rt(t) || (u = 0);
+  Et(t) || (u = 0);
   const f = (e - 1) * u / e;
   let y = { ...a, gap: `${u}rem` };
-  const k = { [I]: { width: "100%" } }, $ = {}, C = {}, S = {};
-  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)`
-      }, C[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)`] = S, y[`@media (max-width: ${l.breakpoints.values.lg}px)`] = C, 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(g, { 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,
     {
@@ -793,7 +826,7 @@ function E({ type: t = "", icon: e = "", size: o = "3rem", className: n = "", ..
     }
   );
 }
-function qe({
+function oo({
   to: t,
   base: e,
   children: o,
@@ -804,33 +837,33 @@ function qe({
   useRouterLink: s,
   ...l
 }) {
-  const { pages: d = [], locale: p = "" } = {}, m = e ? K("/", e) : e || "";
-  let h = a === "auto" ? "_self" : a, u = K(m, t);
+  const { pages: d = [], locale: p = "" } = {}, m = e ? X("/", e) : e || "";
+  let g = a === "auto" ? "_self" : a, u = X(m, t);
   const b = c ? at(u) : !1;
   if (e)
-    return u = K(m, p, t), /* @__PURE__ */ r(
+    return u = X(m, p, t), /* @__PURE__ */ r(
       "a",
       {
         className: `no-underline ${n}`,
         href: rt(u),
         rel: "noreferrer noopener",
-        target: h,
+        target: g,
         ...l,
         children: o
       }
     );
   if (at(t))
-    a === "auto" && (h = "_blank"), u = t;
+    a === "auto" && (g = "_blank"), u = t;
   else {
-    ce(u) && (u = K(window.location.pathname, u));
-    const f = de(`${window.location.origin}${u}`), y = d.some((k) => k.pathname === f.pathname);
+    pe(u) && (u = X(window.location.pathname, u));
+    const f = ue(`${window.location.origin}${u}`), y = d.some((v) => v.pathname === f.pathname);
     if (s || y)
       return /* @__PURE__ */ r(
-        te,
+        ne,
         {
           end: !0,
           to: rt(u),
-          className: ({ isActive: k }) => x(n, k ? i : ""),
+          className: ({ isActive: v }) => x(n, v ? i : ""),
           ...l,
           children: o
         }
@@ -842,16 +875,16 @@ function qe({
       className: `no-underline ${n}`,
       href: rt(u),
       rel: "noreferrer noopener",
-      target: h,
+      target: g,
       ...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 D({
+function J({
   prepend: t,
   append: e,
   children: o,
@@ -861,22 +894,22 @@ function D({
   ...c
 }) {
   let s = {};
-  const { pages: l = [] } = Wt(), d = l.find((h) => h.id === c.link), p = !o || qt.Children.toArray(o).every((h) => h === null);
+  const { pages: l = [] } = zt(), d = l.find((g) => g.id === c.link), p = !o || te.Children.toArray(o).every((g) => g === null);
   c.link && (s = {
-    component: qe,
+    component: oo,
     to: d?.path || c.link,
     useRouterLink: !0
   });
-  const m = Ht();
+  const m = Yt();
   return /* @__PURE__ */ w(
-    Qe,
+    no,
     {
       className: x("base-card card", { dark: i, "border-transparent": !a }, n),
       sx: {
         borderColor: m.palette.divider
       },
       ...s,
-      ...B(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 }),
@@ -885,7 +918,7 @@ function D({
     }
   );
 }
-const Qe = _(g)`
+const no = _(h)`
   &.base-card {
     text-align: left;
     border-width: 1px;
@@ -901,16 +934,16 @@ const Qe = _(g)`
     padding: 15px 15px;
   }
 `;
-function G({
+function K({
   align: t = "left",
   title: e,
   titleProps: o = {},
   description: n,
   descriptionProps: i = {}
 }) {
-  return /* @__PURE__ */ w(q, { children: [
+  return /* @__PURE__ */ w(Q, { children: [
     e && /* @__PURE__ */ r(
-      L,
+      z,
       {
         className: x("card__title text-gray-800", "dark:text-gray-50"),
         component: "h5",
@@ -922,7 +955,7 @@ function G({
       }
     ),
     n && /* @__PURE__ */ r(
-      L,
+      z,
       {
         className: x("card__description", "text-gray-500", "dark:text-gray-400"),
         component: "div",
@@ -935,7 +968,7 @@ function G({
     )
   ] });
 }
-function Ze({
+function ro({
   image: t,
   title: e,
   description: o,
@@ -948,14 +981,14 @@ function Ze({
   align: d,
   ...p
 }) {
-  const m = pt(t), h = z(M(t), 540);
+  const m = pt(t), g = j(P(t), 540);
   return /* @__PURE__ */ w(
-    to,
+    io,
     {
       className: "card-article",
       ...p,
       prepend: /* @__PURE__ */ r("div", { className: "card__image__wrap", children: m && t ? /* @__PURE__ */ r(
-        g,
+        h,
         {
           sx: {
             position: "absolute",
@@ -967,13 +1000,13 @@ function Ze({
             alignItems: "center",
             justifyContent: "center"
           },
-          children: /* @__PURE__ */ r(E, { icon: t, color: "primary.main" })
+          children: /* @__PURE__ */ r(O, { icon: t, color: "primary.main" })
         }
-      ) : h && /* @__PURE__ */ r(
+      ) : g && /* @__PURE__ */ r(
         "img",
         {
           className: "card__image",
-          src: h,
+          src: g,
           ...n,
           alt: n.alt || i?.filename || "card-image",
           width: i?.naturalWidth,
@@ -984,7 +1017,7 @@ function Ze({
       ) }),
       children: [
         e || o ? /* @__PURE__ */ r(
-          G,
+          K,
           {
             align: d,
             title: e,
@@ -993,12 +1026,12 @@ function Ze({
             descriptionProps: s
           }
         ) : null,
-        l?.length ? /* @__PURE__ */ r(A, { align: d, actions: l, className: "mt-4" }) : null
+        l?.length ? /* @__PURE__ */ r(T, { align: d, actions: l, className: "mt-4" }) : null
       ]
     }
   );
 }
-const to = _(D)`
+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);
@@ -1032,8 +1065,8 @@ const to = _(D)`
     height: 100%;
     object-position: top center;
   }
-`, ft = "section";
-function xt({
+`, bt = "section";
+function yt({
   title: t,
   image: e,
   imageMeta: o,
@@ -1044,9 +1077,9 @@ function xt({
   className: s = "",
   ...l
 }) {
-  return /* @__PURE__ */ w(eo, { className: x("card", `list-type-${c}`, s), align: a, ...l, children: [
+  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",
@@ -1054,18 +1087,18 @@ function xt({
         imageMeta: o
       }
     ),
-    t || n ? /* @__PURE__ */ r(G, { align: a, title: t, description: n }) : null,
-    i?.length ? /* @__PURE__ */ r(A, { 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 eo = _(D)`
+const ao = _(J)`
   padding: 5vw 4vw;
   box-sizing: border-box;
   /* min-height: 320px; */
   color: inherit !important;
   border-radius: 0.5rem;
   /* ${({ dark: t, theme: e }) => `background-color:${t ? e.palette.grey[900] : e.palette.common.white};`} */
-  @media (max-width: ${({ theme: t }) => t.breakpoints.values[ft]}px) {
+  @media (max-width: ${({ theme: t }) => t.breakpoints.values[bt]}px) {
     padding: 1.5rem 2rem;
   }
   @media (max-width: ${({ theme: t }) => t.breakpoints.values.sm}px) {
@@ -1113,13 +1146,13 @@ const eo = _(D)`
     }
   }
 
-  @media (min-width: ${({ theme: t }) => t.breakpoints.values[ft]}px) {
+  @media (min-width: ${({ theme: t }) => t.breakpoints.values[bt]}px) {
     padding: 2rem 2rem;
     text-align: left;
     box-sizing: border-box;
   }
 `;
-function oo({
+function so({
   image: t,
   title: e,
   description: o,
@@ -1132,14 +1165,14 @@ function oo({
   align: d,
   ...p
 }) {
-  const m = pt(t), h = z(M(t), 540);
+  const m = pt(t), g = j(P(t), 540);
   return /* @__PURE__ */ w(
-    no,
+    lo,
     {
       className: "card-article",
       ...p,
       prepend: /* @__PURE__ */ r("div", { className: "card__image__wrap", children: m && t ? /* @__PURE__ */ r(
-        g,
+        h,
         {
           sx: {
             position: "absolute",
@@ -1151,14 +1184,14 @@ function oo({
             alignItems: "center",
             justifyContent: "center"
           },
-          children: /* @__PURE__ */ r(E, { icon: t, color: "primary.main" })
+          children: /* @__PURE__ */ r(O, { icon: t, color: "primary.main" })
         }
-      ) : h && /* @__PURE__ */ r(
-        g,
+      ) : g && /* @__PURE__ */ r(
+        h,
         {
           component: "img",
           className: "card__image",
-          src: h,
+          src: g,
           ...n,
           alt: n.alt || i?.filename || "card-image",
           style: { width: "100%", height: "100%", objectFit: a || "contain", objectPosition: "center" },
@@ -1174,7 +1207,7 @@ function oo({
       ) }),
       children: [
         e || o ? /* @__PURE__ */ r(
-          G,
+          K,
           {
             align: d,
             title: e,
@@ -1183,12 +1216,12 @@ function oo({
             descriptionProps: s
           }
         ) : null,
-        l?.length ? /* @__PURE__ */ r(A, { align: d, actions: l, className: "mt-4" }) : null
+        l?.length ? /* @__PURE__ */ r(T, { align: d, actions: l, className: "mt-4" }) : null
       ]
     }
   );
 }
-const no = _(D)`
+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);
@@ -1212,8 +1245,8 @@ const no = _(D)`
   .card__image {
     max-height: 60px;
   }
-`, bt = "section";
-function ro({
+`, wt = "section";
+function co({
   title: t,
   image: e,
   imageMeta: o,
@@ -1224,15 +1257,15 @@ function ro({
   className: s = "",
   ...l
 }) {
-  return /* @__PURE__ */ r(io, { className: x("card", s), ...l, children: /* @__PURE__ */ w(g, { className: "flex items-center", children: [
-    e && /* @__PURE__ */ r(E, { icon: e, color: "primary.main", size: n, imageMeta: o }),
-    /* @__PURE__ */ w(g, { className: "flex-1 ml-4", children: [
-      /* @__PURE__ */ r(G, { align: c, title: t, description: i }),
-      /* @__PURE__ */ r(A, { align: c, actions: a, className: "mt-4" })
+  return /* @__PURE__ */ r(mo, { className: x("card", s), ...l, children: /* @__PURE__ */ w(h, { className: "flex items-center", children: [
+    e && /* @__PURE__ */ r(O, { icon: e, color: "primary.main", size: n, imageMeta: o }),
+    /* @__PURE__ */ w(h, { className: "flex-1 ml-4", children: [
+      /* @__PURE__ */ r(K, { align: c, title: t, description: i }),
+      /* @__PURE__ */ r(T, { align: c, actions: a, className: "mt-4" })
     ] })
   ] }) });
 }
-const io = _(D)`
+const mo = _(J)`
   padding: 5vw 4vw;
   text-align: left;
   box-sizing: border-box;
@@ -1240,7 +1273,7 @@ const io = _(D)`
   color: inherit !important;
   border-radius: 0.5rem;
   /* ${({ dark: t, theme: e }) => `background-color:${t ? e.palette.grey[900] : e.palette.common.white};`} */
-  @media (max-width: ${({ theme: t }) => t.breakpoints.values[bt]}px) {
+  @media (max-width: ${({ theme: t }) => t.breakpoints.values[wt]}px) {
     padding: 1.5rem 2rem;
   }
   @media (max-width: ${({ theme: t }) => t.breakpoints.values.sm}px) {
@@ -1285,13 +1318,13 @@ const io = _(D)`
     }
   }
 
-  @media (min-width: ${({ theme: t }) => t.breakpoints.values[bt]}px) {
+  @media (min-width: ${({ theme: t }) => t.breakpoints.values[wt]}px) {
     padding: 2rem 2rem;
     text-align: left;
     box-sizing: border-box;
   }
 `;
-function ao({
+function po({
   title: t,
   titleProps: e = {},
   description: o,
@@ -1303,10 +1336,10 @@ function ao({
   hoverStyle: l,
   ...d
 }) {
-  return /* @__PURE__ */ w(so, { className: x("card-simple", c, `hover-style__${l}`), align: s, ...d, children: [
-    i && /* @__PURE__ */ r(E, { icon: i, color: "primary.main", imageMeta: a }),
+  return /* @__PURE__ */ w(uo, { className: x("card-simple", c, `hover-style__${l}`), align: s, ...d, children: [
+    i && /* @__PURE__ */ r(O, { icon: i, color: "primary.main", imageMeta: a }),
     t || o ? /* @__PURE__ */ r(
-      G,
+      K,
       {
         align: s,
         title: t,
@@ -1317,7 +1350,7 @@ function ao({
     ) : null
   ] });
 }
-const so = _(D)`
+const uo = _(J)`
   .card__title {
     color: ${({ theme: t }) => t.palette.text.primary};
     a {
@@ -1414,17 +1447,17 @@ const so = _(D)`
     }
   }
 `;
-function lo({ type: t = "default", ...e }) {
+function go({ type: t = "default", ...e }) {
   const n = {
-    article: Ze,
-    simple: ao,
-    news: ro,
-    default: xt,
-    wall: oo
-  }[t] || xt;
-  return /* @__PURE__ */ r(n, { ...t === "news" ? e : B(e, "iconSize") });
+    article: ro,
+    simple: po,
+    news: co,
+    default: yt,
+    wall: so
+  }[t] || yt;
+  return /* @__PURE__ */ r(n, { ...t === "news" ? e : M(e, "iconSize") });
 }
-function co({
+function ho({
   list: t = [],
   align: e = "top",
   cards: o,
@@ -1437,11 +1470,11 @@ function co({
   type: d = "default",
   dark: p = !1,
   textAlign: m = "left",
-  hoverStyle: h,
+  hoverStyle: g,
   ...u
 }) {
   return /* @__PURE__ */ r(
-    jt,
+    Tt,
     {
       type: d,
       className: x("card-list py-1", l, "items-stretch"),
@@ -1450,7 +1483,7 @@ function co({
       align: e,
       ...u,
       children: o || t.map((b) => /* @__PURE__ */ r(
-        lo,
+        go,
         {
           borderColor: n,
           iconColor: s,
@@ -1470,7 +1503,7 @@ function co({
     }
   );
 }
-const mo = [
+const fo = [
   "align",
   "cards",
   "list",
@@ -1482,11 +1515,11 @@ const mo = [
   "type",
   "textAlign"
 ];
-function P(t, e) {
-  const o = lt(t, e), n = B(t, e);
+function I(t, e) {
+  const o = lt(t, e), n = M(t, e);
   return [o, n];
 }
-const po = _(nt)`
+const xo = _(nt)`
   a .card {
     color: #404040;
     cursor: pointer;
@@ -1502,14 +1535,14 @@ const po = _(nt)`
     color: #404040;
   }
 `;
-function uo({ className: t, ...e }) {
-  const [o, n] = P(e, ot), [i, a] = P(n, mo);
-  return /* @__PURE__ */ w(po, { className: x("section--card-list", t), type: e.type, ...a, children: [
+function bo({ className: t, ...e }) {
+  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(co, { ...i, dark: !!e.dark })
+    /* @__PURE__ */ r(ho, { ...i, dark: !!e.dark })
   ] });
 }
-const ho = _(uo)`
+const yo = _(bo)`
   .card__description {
     white-space: pre-wrap;
   }
@@ -1525,29 +1558,29 @@ const ho = _(uo)`
     background: inherit !important;
   }
 `;
-function go({ section: t, ...e }) {
-  const [{ editing: o }, n] = P(e, tt), i = N(() => ({
-    ...B(n, ["listBorder", "list", "iconSize", "imageSize"]),
+function wo({ section: t, ...e }) {
+  const [{ editing: o }, n] = I(e, tt), i = B(() => ({
+    ...M(n, ["listBorder", "list", "iconSize", "imageSize"]),
     list: n.list?.map((a) => ({
-      ...B(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(Lt, { ...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,
       hoverStyle: n.hoverStyle
     }))
   }), [n]);
-  return /* @__PURE__ */ r(ho, { style: o ? { pointerEvents: "none" } : {}, ...i });
+  return /* @__PURE__ */ r(yo, { style: o ? { pointerEvents: "none" } : {}, ...i });
 }
-function fo({
+function vo({
   properties: t,
   section: e,
   locale: o,
   dev: n
 }) {
   return e?.config?.componentId ? /* @__PURE__ */ r(
-    ae,
+    ce,
     {
       instanceId: e.id,
       componentId: e.config.componentId,
@@ -1559,14 +1592,14 @@ function fo({
       dev: n
     }
   ) : /* @__PURE__ */ r(
-    g,
+    h,
     {
       sx: {
         textAlign: "center",
         py: 2
       },
       children: /* @__PURE__ */ r(
-        L,
+        z,
         {
           variant: "caption",
           sx: {
@@ -1578,7 +1611,7 @@ function fo({
     }
   );
 }
-function xo({
+function ko({
   src: t,
   dataId: e,
   isEdit: o = !1,
@@ -1587,7 +1620,7 @@ function xo({
   }
 }) {
   return /* @__PURE__ */ r(
-    he,
+    xe,
     {
       isEdit: o,
       embedId: e,
@@ -1599,12 +1632,12 @@ function xo({
     }
   );
 }
-function bo({ dataId: t, src: e, actions: o, center: n, onLoad: i, ...a }) {
-  const [c, s] = P(a, ot);
+function _o({ dataId: t, src: e, actions: o, center: n, onLoad: i, ...a }) {
+  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(
-      xo,
+      ko,
       {
         dataId: t,
         src: e,
@@ -1612,10 +1645,10 @@ function bo({ dataId: t, src: e, actions: o, center: n, onLoad: i, ...a }) {
         height: a.iframeHeight ? `${a.iframeHeight}px` : "100%"
       }
     ),
-    /* @__PURE__ */ r(A, { actions: o, center: n })
+    /* @__PURE__ */ r(T, { actions: o, center: n })
   ] });
 }
-const Mn = {
+const An = {
   src: "",
   embedUrl: "",
   title: "",
@@ -1626,21 +1659,21 @@ const Mn = {
   config: {},
   id: ""
 };
-function yo({ section: t, id: e, src: o, ...n }) {
-  const i = `${e}-${n.locale}`, [{ editing: a }, c] = P(n, tt), s = ct({}), l = JSON.parse(JSON.stringify(c)), { message: d } = me(i, "server"), p = pe(JSON.parse(JSON.stringify(c.config) || "{}"));
-  return H(() => {
+function $o({ section: t, id: e, src: o, ...n }) {
+  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]), H(() => {
+  }, [d]), V(() => {
     const m = JSON.parse(JSON.stringify(c.config) || "{}");
-    ue(s.current, m) || (s.current = m, d?.send("config-set", m));
-  }, [d, c.config]), o ? /* @__PURE__ */ r(bo, { ...l, dataId: i, src: o, style: a ? { pointerEvents: "none" } : {} }) : /* @__PURE__ */ r(wo, { children: 'Please set the "src" attribute for this block' });
+    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' });
 }
-const wo = _("div")`
+const Co = _("div")`
   user-select: none;
   color: #999;
   padding: 8px;
   height: 200px;
-`, vo = "none", ko = "none", _o = "transparent", $o = 12, So = ({
+`, So = "none", No = "none", Bo = "transparent", vt = "start", Mo = 12, Po = ({
   gridSettings: t,
   section: e,
   index: o,
@@ -1648,7 +1681,7 @@ const wo = _("div")`
   simulateMode: i = "desktop",
   isBackground: a
 }) => {
-  const c = t?.[i] ?? {}, s = c[e.id], l = Co(c);
+  const c = t?.[i] ?? {}, s = c[e.id], l = Io(c);
   return {
     i: e.id,
     static: e?.locked || a,
@@ -1669,37 +1702,51 @@ const wo = _("div")`
     maxH: 1,
     maxY: l
   };
-}, Co = (t) => Object.values(t).reduce((e, o) => Math.max(e, o.y || 0), 0) || 0, No = (t) => {
-  const { dev: e, id: o, section: n, onBlockRender: i } = t, a = e?.mode, c = Dt((v) => v.breakpoints.down("sm")), { t: s } = ge(), { sections: l, sectionIds: d, config: p } = n, { columns: m = $o, gridSettings: h, gap: u, padding: b, background: f } = p || {}, y = N(() => Q({
-    type: "layoutBlockGap",
-    value: u ?? vo,
-    format: "sx"
-  }), [u]), k = N(() => Q({
+}, 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((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 ?? ko,
+    value: b ?? No,
     format: "sx"
-  }), [b]), $ = F(
-    (v, R = !1, Y = 0) => {
-      if (!i || !v || !v.component || v.visibility === "hidden")
+  }), [b]), W = B(() => D({
+    type: "layoutBlockAlignContent",
+    // 使用类型断言避免类型错误
+    value: y ?? vt,
+    format: "sx"
+  }), [y]), S = Y(
+    (k, C = !1, E = 0) => {
+      if (!i || !k || !k.component || k.visibility === "hidden")
         return null;
-      const W = So({
-        gridSettings: h,
-        section: v,
-        index: Y,
+      const N = Po({
+        gridSettings: g,
+        section: k,
+        index: E,
         columns: m,
         simulateMode: c ? "mobile" : "desktop",
-        isBackground: R
-      }), V = W?.x ?? 0, J = W?.y ?? 0, T = W?.w ?? m, At = W?.h ?? 1, Et = W?.maxY ?? 0, Tt = !!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(
-        g,
+        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 / ${Et + 1}`,
+              gridRow: `1 / ${Ut + 1}`,
               zIndex: 0,
               width: "100%",
               height: "100%",
@@ -1710,9 +1757,9 @@ const wo = _("div")`
             } : {
               position: "relative",
               // 使用 grid 定位普通元素
-              gridColumn: `${V + 1} / span ${T}`,
+              gridColumn: `${L + 1} / span ${F}`,
               // hasBackground 的话，不再 + 1，因为 background 会占用第一行
-              gridRow: `${J + (Tt ? 0 : 1)} / span ${At}`,
+              gridRow: `${U + (Ft ? 0 : 1)} / span ${Ot}`,
               zIndex: 1,
               // Ensure content is above background
               minWidth: 0,
@@ -1721,6 +1768,10 @@ const wo = _("div")`
               // 防止内容撑开网格项
               overflow: "hidden",
               // 防止子内容溢出网格项
+              // 只给非第一行添加上边距
+              ...U > 0 ? { mt: v?.item?.gap } : {},
+              // 只给非第一列添加左边距
+              ...L > 0 ? { ml: v?.item?.gap } : {},
               "& > .BlockBase-root": {
                 height: "100%",
                 width: "100%",
@@ -1729,32 +1780,32 @@ const wo = _("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, h, m, c]
-  ), { backgroundElements: C, contentElements: S } = N(() => {
+    [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((Y, W) => {
-      const V = l[Y];
-      if (!V) return;
-      const J = n?.config?.backgroundSectionId === Y, T = $(V, J, W);
-      T && (J ? v.push(T) : R.push(T));
-    }), { backgroundElements: v, contentElements: R };
-  }, [$, l, d]);
-  return a === "draft" && !C?.length && !S?.length ? /* @__PURE__ */ w(
-    g,
+    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,
     {
       sx: {
         gridColumn: "1 / -1",
@@ -1764,7 +1815,7 @@ const wo = _("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",
@@ -1773,7 +1824,7 @@ const wo = _("div")`
       },
       children: [
         /* @__PURE__ */ r(
-          g,
+          h,
           {
             sx: {
               fontSize: "48px",
@@ -1783,7 +1834,7 @@ const wo = _("div")`
           }
         ),
         /* @__PURE__ */ r(
-          g,
+          h,
           {
             sx: {
               fontSize: "16px",
@@ -1794,7 +1845,7 @@ const wo = _("div")`
           }
         ),
         /* @__PURE__ */ r(
-          g,
+          h,
           {
             sx: {
               opacity: 0.7,
@@ -1804,7 +1855,7 @@ const wo = _("div")`
           }
         ),
         /* @__PURE__ */ r(
-          g,
+          h,
           {
             sx: {
               position: "absolute",
@@ -1814,13 +1865,13 @@ const wo = _("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})
                 )
               `
             }
@@ -1829,32 +1880,31 @@ const wo = _("div")`
       ]
     }
   ) : /* @__PURE__ */ w(
-    g,
+    h,
     {
       sx: {
         position: "relative",
         display: "grid",
         gridTemplateColumns: `repeat(${m}, minmax(0, 1fr))`,
         alignItems: "stretch",
-        alignContent: "start",
         width: "100%",
         height: "100%",
         minWidth: 0,
-        bgcolor: f ?? _o,
+        bgcolor: f ?? Bo,
         boxSizing: "border-box",
         overflow: "hidden",
         // Prevent content overflow
-        ...y,
-        ...k
+        ...$,
+        alignContent: W?.alignContent ?? vt
       },
       children: [
-        C,
-        S
+        ut,
+        gt
       ]
     }
   );
-}, Bo = ["title", "description", "actions", "badge", "tag", "prepend", "append", "logo"];
-function Mo({
+}, Lo = ["title", "description", "actions", "badge", "tag", "prepend", "append", "logo"];
+function Ao({
   image: t,
   imageBorder: e,
   imageShadow: o,
@@ -1863,8 +1913,8 @@ function Mo({
   fullSizeImage: a,
   ...c
 }) {
-  const [s, l] = P(c, ot), d = Object.keys(s).length > 0 && Object.values(lt(s, Bo)).filter(Boolean).length > 0 && /* @__PURE__ */ r(et, { ...s }), p = _t(t) ? t : /* @__PURE__ */ r(g, { component: "img", src: t, alt: "", className: "block" }), m = ["phone", "macbook"].includes(e), h = t && /* @__PURE__ */ r(
-    g,
+  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(
         "section__image",
@@ -1881,7 +1931,7 @@ function Mo({
       },
       children: m ? (
         // @ts-ignore
-        /* @__PURE__ */ r(fe, { type: e, sx: { width: "100%" }, children: p })
+        /* @__PURE__ */ r(ye, { type: e, sx: { width: "100%" }, children: p })
       ) : p
     }
   );
@@ -1900,7 +1950,7 @@ function Mo({
       ...l,
       boxProps: a ? { sx: { padding: 0, overflow: "hidden" } } : void 0,
       children: /* @__PURE__ */ r(
-        jt,
+        Tt,
         {
           col: t ? 2 : 1,
           className: a ? it`
@@ -1917,19 +1967,19 @@ function Mo({
                   }
                 }
               ` : void 0,
-          children: i ? /* @__PURE__ */ w(q, { children: [
-            h,
+          children: i ? /* @__PURE__ */ w(Q, { children: [
+            g,
             d
-          ] }) : /* @__PURE__ */ w(q, { children: [
+          ] }) : /* @__PURE__ */ w(Q, { children: [
             d,
-            h
+            g
           ] })
         }
       )
     }
   );
 }
-const Po = [
+const zo = [
   /youtu\.be\/([^#&?]{11})/,
   // youtu.be/<id>
   /\?v=([^#&?]{11})/,
@@ -1941,51 +1991,51 @@ const Po = [
   /\/v\/([^#&?]{11})/
   // /v/<id>
 ];
-function Io(t) {
+function jo(t) {
   if (/youtu\.?be/.test(t))
-    for (const e of Po) {
+    for (const e of zo) {
       const o = e.exec(t)?.[1];
       if (o)
         return o;
     }
 }
-function Wo(t) {
-  const e = Io(t);
+function Ro(t) {
+  const e = jo(t);
   if (e)
     return `https://youtube.com/embed/${e}`;
 }
-function Lo({ src: t }) {
-  return H(() => {
+function Eo({ src: t }) {
+  return V(() => {
     import("@lottiefiles/lottie-player");
   }, []), /* @__PURE__ */ r("lottie-player", { autoplay: !0, loop: !0, mode: "normal", src: t });
 }
-function zo(t) {
+function To(t) {
   return /* @__PURE__ */ r(
-    g,
+    h,
     {
       sx: {
         maxHeight: 400,
         overflow: "hidden auto"
       },
-      children: /* @__PURE__ */ r(xe, { ...t })
+      children: /* @__PURE__ */ r(we, { ...t })
     }
   );
 }
-function Ro({ url: t }) {
+function Oo({ url: t }) {
   const e = ct(null), o = 495, [n, i] = Z(
     e.current ? e.current.offsetWidth * 0.5625 : o
-  ), a = F(() => {
+  ), 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 H(() => {
+  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() {
       window.removeEventListener("resize", a);
     };
   }, [n, a]), /* @__PURE__ */ r(
-    g,
+    h,
     {
       component: "iframe",
       ref: e,
@@ -2002,7 +2052,7 @@ function Ro({ url: t }) {
     }
   );
 }
-const Pn = {
+const zn = {
   image: "https://www.arcblock.io/static/ead0cabde7f2b7ff34db8f3e8ceca271/afc4b/builder.png",
   badge: "Develop · Deploy · Run",
   title: "The Future is Here: Blockchain and Decentralized Application Development",
@@ -2013,11 +2063,11 @@ const Pn = {
   actions: void 0,
   hasImage: !0,
   center: !1
-}, jo = _(Mo)`
+}, Uo = _(Ao)`
   .section__description {
   }
 `;
-function Ao({
+function Fo({
   hasImage: t,
   fullSizeImage: e,
   boxed: o,
@@ -2028,32 +2078,32 @@ function Ao({
   section: s,
   ...l
 }) {
-  const [{ editing: d }, p] = P({ ...l, boxed: e ? void 0 : o }, tt);
-  let m = Eo(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 h = null;
-  return p.actions && (h = p.actions?.map?.((u, b) => /* @__PURE__ */ r(Lt, { ...u, editing: d }, b))), /* @__PURE__ */ r(
-    jo,
+  let g = null;
+  return p.actions && (g = p.actions?.map?.((u, b) => /* @__PURE__ */ r(jt, { ...u, editing: d }, b))), /* @__PURE__ */ r(
+    Uo,
     {
       ...p,
       style: d ? { pointerEvents: "none" } : {},
       image: m,
       fullSizeImage: t && e,
-      actions: h
+      actions: g
     }
   );
 }
-function Eo(t, e, o, n, i, a) {
+function Go(t, e, o, n, i, a) {
   if (t) {
     if (t.endsWith(".json"))
-      return /* @__PURE__ */ r(Lo, { src: t });
+      return /* @__PURE__ */ r(Eo, { src: t });
     if (t.indexOf("twitter.com") !== -1)
-      return /* @__PURE__ */ r(zo, { sourceType: "url", url: t });
-    const c = Wo(t);
+      return /* @__PURE__ */ r(To, { sourceType: "url", url: t });
+    const c = Ro(t);
     if (c)
-      return /* @__PURE__ */ r(Ro, { url: 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",
         {
@@ -2069,16 +2119,16 @@ function Eo(t, e, o, n, i, a) {
             width: "100%",
             height: "100%"
           },
-          poster: z(M(e), o ? 1200 : 540, i),
-          children: /* @__PURE__ */ r("source", { src: M(t), type: Ye(t) })
+          poster: j(P(e), o ? 1200 : 540, i),
+          children: /* @__PURE__ */ r("source", { src: P(t), type: qe(t) })
         },
         t
       );
     const p = i === "quality" ? 1 : 0.6;
     return /* @__PURE__ */ r(
-      Nt,
+      Pt,
       {
-        src: M(t),
+        src: P(t),
         sizesAttr: {
           sm: 600 * p,
           md: 450 * p,
@@ -2098,15 +2148,15 @@ function Eo(t, e, o, n, i, a) {
   }
   return null;
 }
-const In = ["production", "draft"];
-function Wn({ 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 Ln({ mode: t, routes: e }) {
+function En({ mode: t, routes: e }) {
   return dt.post(`/api/${mt()}/pages/publish`, { mode: t, routes: e }).then((o) => o.data);
 }
-function To({
+function Do({
   locale: t,
   sort: e,
   page: o,
@@ -2115,32 +2165,32 @@ function To({
 } = {}) {
   return dt.get(`/api/${mt()}/pages/toc`, { params: { locale: t, sort: e, page: o, limit: n, mode: i } }).then((a) => a.data);
 }
-const zn = {
+const Tn = {
   style: "list",
   sort: "-updatedAt"
-}, yt = 20;
-function Oo({ style: t, sort: e, section: o, ...n }) {
-  const [{ editing: i, locale: a }, c] = P(n, tt), [s, l] = P(c, ot), [d, p] = Z(), m = ct(!1), h = be(), u = ee(), b = F(async () => {
+}, kt = 20;
+function Ho({ style: t, sort: e, section: o, ...n }) {
+  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, h();
+      m.current = !0, g();
       try {
-        const f = d ? Math.floor(d.list.length / yt) + 1 : 1, { list: y, total: k } = await To({ locale: a, sort: e, page: f, limit: yt });
+        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, h();
+        m.current = !1, g();
       }
     }
-  }, [d, a, e, h]);
-  return ye(() => {
+  }, [d, a, e, g]);
+  return ke(() => {
     b();
   }), /* @__PURE__ */ w(nt, { ...l, sx: i ? { pointerEvents: "none" } : {}, children: [
     Object.keys(s).length > 0 && /* @__PURE__ */ r(et, { ...s }),
-    d ? /* @__PURE__ */ w(q, { children: [
+    d ? /* @__PURE__ */ w(Q, { children: [
       /* @__PURE__ */ r(
-        ut,
+        ht,
         {
           container: !0,
           spacing: 2,
@@ -2148,7 +2198,7 @@ function Oo({ style: t, sort: e, section: o, ...n }) {
             justifyContent: "center"
           },
           children: d?.list.map((f) => /* @__PURE__ */ r(
-            ut,
+            ht,
             {
               size: {
                 xs: 12,
@@ -2156,24 +2206,24 @@ function Oo({ style: t, sort: e, section: o, ...n }) {
                 md: t === "card" ? 3 : 12
               },
               children: /* @__PURE__ */ w(
-                Uo,
+                Yo,
                 {
                   elevation: 0,
                   className: x(t === "card" && "style-card"),
                   onClick: i ? void 0 : () => u(f.slug),
                   children: [
                     !!f.image && /* @__PURE__ */ r(
-                      Vt,
+                      Xt,
                       {
                         component: "img",
                         alt: "",
-                        image: z(M(f.image), 540),
+                        image: j(P(f.image), 540),
                         loading: "lazy"
                       }
                     ),
-                    /* @__PURE__ */ w(Jt, { children: [
-                      /* @__PURE__ */ r(L, { variant: "h6", component: "div", className: wt, children: f.title || f.id }),
-                      /* @__PURE__ */ r(L, { variant: "body2", className: wt, children: f.description })
+                    /* @__PURE__ */ w(qt, { children: [
+                      /* @__PURE__ */ r(z, { variant: "h6", component: "div", className: _t, children: f.title || f.id }),
+                      /* @__PURE__ */ r(z, { variant: "body2", className: _t, children: f.description })
                     ] })
                   ]
                 }
@@ -2184,34 +2234,34 @@ function Oo({ style: t, sort: e, section: o, ...n }) {
         }
       ),
       /* @__PURE__ */ r(
-        g,
+        h,
         {
           sx: {
             textAlign: "center",
             mt: 2
           },
-          children: d.total > d.list.length ? /* @__PURE__ */ r(U, { variant: "outlined", color: "secondary", onClick: b, loading: m.current, children: "More" }) : /* @__PURE__ */ r(U, { 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(
-      g,
+      h,
       {
         sx: {
           p: 2,
           textAlign: "center"
         },
-        children: /* @__PURE__ */ r(Yt, { size: 24 })
+        children: /* @__PURE__ */ r(Kt, { size: 24 })
       }
     )
   ] });
 }
-const wt = it`
+const _t = it`
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   overflow: hidden;
   text-overflow: ellipsis;
-`, Uo = _(Gt)`
+`, Yo = _(Jt)`
   border: 1px solid #e0e0e0;
   background-color: transparent;
   cursor: pointer;
@@ -2231,15 +2281,15 @@ const wt = it`
       max-height: 50vw;
     }
   }
-`, Fo = {
-  iframe: yo,
-  section: Ao,
-  "section-card-list": go,
-  toc: Oo,
-  "custom-component": fo,
-  "layout-block": No
+`, Vo = {
+  iframe: $o,
+  section: Fo,
+  "section-card-list": wo,
+  toc: Ho,
+  "custom-component": vo,
+  "layout-block": Wo
 };
-function Ho({
+function Jo({
   id: t,
   type: e,
   mode: o,
@@ -2249,20 +2299,20 @@ function Ho({
   page: c,
   ...s
 }) {
-  const l = Fo[e], { getPageMetaStyle: d } = Le(), p = N(() => {
+  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: C } = $;
-      let S = c?.dataSource?.[f?.id]?.[C];
-      return Xt(S) && (S = c?.dataSource?.[f?.id]?.[k ?? "en"]), /* @__PURE__ */ r(
-        Ho,
+      }, { locale: W } = $;
+      let S = c?.dataSource?.[f?.id]?.[W];
+      return Zt(S) && (S = c?.dataSource?.[f?.id]?.[v ?? "en"]), /* @__PURE__ */ r(
+        Jo,
         {
           ...f,
           config: {
@@ -2275,20 +2325,20 @@ function Ho({
         }
       );
     }), b;
-  }, [n, e]), m = N(() => {
+  }, [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]), h = l && /* @__PURE__ */ r(l, { mode: o, ...p, id: t, section: i });
-  return h ? /* @__PURE__ */ r(ze, { ...s, ...m, children: h }) : /* @__PURE__ */ r(Do, { type: e });
+  }, [n.height, a, e, d]), g = l && /* @__PURE__ */ r(l, { mode: o, ...p, id: t, section: i });
+  return g ? /* @__PURE__ */ r(Te, { ...s, ...m, children: g }) : /* @__PURE__ */ r(Ko, { type: e });
 }
-function Do({ type: t }) {
+function Ko({ type: t }) {
   return /* @__PURE__ */ r(
-    g,
+    h,
     {
       sx: {
         p: 2
       },
-      children: /* @__PURE__ */ w(Kt, { icon: /* @__PURE__ */ r(Ot, {}), color: "error", children: [
+      children: /* @__PURE__ */ w(Qt, { icon: /* @__PURE__ */ r(Gt, {}), color: "error", children: [
         "Unsupported Block `",
         t,
         "`"
@@ -2297,13 +2347,13 @@ function Do({ type: t }) {
   );
 }
 export {
-  Ho as B,
-  Mn as I,
-  Nn as P,
-  In as S,
-  zn as T,
-  Cn as a,
-  Pn as b,
-  Wn as g,
-  Ln as p
+  Jo as B,
+  An as I,
+  Wn as P,
+  jn as S,
+  Tn as T,
+  In as a,
+  zn as b,
+  Rn as g,
+  En as p
 };