@blocklet/pages-kit-inner-components 0.4.109 → 0.4.111

package/lib/es/chunks/{array-CVceCpS9.js → array-nAv4MiIp.js}

@@ -1,40 +1,40 @@
 import { jsx as o, jsxs as w, Fragment as J } from "react/jsx-runtime";
 import "@mui/icons-material";
-import { Box as x, Tooltip as Ft, styled as bt, Stack as yt, Typography as P, Container as At, useTheme as Ht, createTheme as Dt, ThemeProvider as Vt, Card as Ut, CircularProgress as Yt, Grid as lt, CardMedia as Mt, CardContent as Jt } from "@mui/material";
-import wt, { createContext as vt, useMemo as R, useCallback as E, useContext as kt, forwardRef as Gt, useState as j, useRef as G, Fragment as Xt, isValidElement as _t, useEffect as O } from "react";
-import X from "lodash/keyBy";
-import { a as z, b as S, E as Kt, f as ot, k as nt } from "./state-DsXKwImw.js";
+import { Box as g, Tooltip as Ft, styled as bt, Stack as yt, Typography as P, Container as Vt, useTheme as Ut, createTheme as Ht, ThemeProvider as Dt, Card as Mt, CircularProgress as Yt, Grid as lt, CardMedia as Jt, CardContent as Gt } from "@mui/material";
+import wt, { createContext as vt, useMemo as R, useCallback as E, useContext as kt, forwardRef as Kt, useState as T, useRef as G, Fragment as Xt, isValidElement as _t, useEffect as O } from "react";
+import K from "lodash/keyBy";
+import { h as j, b as N, E as qt, i as ot, m as nt } from "./state-BgKqNapt.js";
 import { AIForm as ct, AIFormResult as dt } from "@blocklet/ai-runtime/components";
-import { deepmerge as qt } from "@mui/utils";
+import { deepmerge as Qt } from "@mui/utils";
 import rt from "lodash/pick";
-import { ErrorBoundary as Qt } from "react-error-boundary";
+import { ErrorBoundary as Zt } from "react-error-boundary";
 import { useColorConvert as $t } from "@blocklet/pages-kit/contexts/color";
 import { cx as b, css as q } from "@emotion/css";
 import { Icon as Q } from "@iconify/react";
-import Zt from "react-markdown";
-import te from "remark-gfm";
-import { LoadingButton as ee } from "@mui/lab";
-import { useTheme as Nt, styled as _ } from "@arcblock/ux/lib/Theme";
-import oe from "@arcblock/react-hooks/lib/useBrowser";
+import te from "react-markdown";
+import ee from "remark-gfm";
+import { LoadingButton as oe } from "@mui/lab";
+import { useTheme as St, styled as _ } from "@arcblock/ux/lib/Theme";
+import ne from "@arcblock/react-hooks/lib/useBrowser";
 import mt from "@arcblock/ux/lib/Colors";
-import { ResponsiveImage as St, CustomComponentRenderer as ne } from "@blocklet/pages-kit/components";
-import { isGradient as re, isColorString as ie } from "@blocklet/pages-kit/utils/style";
+import { ResponsiveImage as Nt, CustomComponentRenderer as re } from "@blocklet/pages-kit/components";
+import { isGradient as ie, isColorString as ae } from "@blocklet/pages-kit/utils/style";
 import Ct from "@mui/material/useMediaQuery";
 import C from "lodash/omit";
 import { Icon as Pt } from "@iconify-icon/react";
-import ae from "@arcblock/ux/lib/Screenshot";
-import { Link as se, NavLink as le, useNavigate as ce } from "react-router-dom";
-import de from "@arcblock/ux/lib/Button";
+import se from "@arcblock/ux/lib/Screenshot";
+import { Link as le, NavLink as ce, useNavigate as de } from "react-router-dom";
+import me from "@arcblock/ux/lib/Button";
 import Z from "is-uri";
-import { join as Y } from "pathe";
-import { withoutTrailingSlash as K, isRelative as me, parseURL as pe } from "ufo";
-import { useMessage as ue } from "@blocklet/embed/message";
-import { useLatest as he } from "ahooks";
-import fe from "lodash/isEqual";
-import { EmbedIframe as ge } from "@blocklet/embed/react";
-import { TwitterTimelineEmbed as xe } from "react-twitter-embed";
-import { useUpdate as be, useMount as ye } from "react-use";
-const we = [
+import { join as M } from "pathe";
+import { withoutTrailingSlash as X, isRelative as ue, parseURL as pe } from "ufo";
+import { useMessage as he } from "@blocklet/embed/message";
+import { useLatest as fe } from "ahooks";
+import ge from "lodash/isEqual";
+import { EmbedIframe as xe } from "@blocklet/embed/react";
+import { TwitterTimelineEmbed as be } from "react-twitter-embed";
+import { useUpdate as ye, useMount as we } from "react-use";
+const Bt = "{{CUSTOM_VALUE}}", ve = [
   {
     title: "None",
     value: "none",
@@ -55,7 +55,7 @@ const we = [
     value: "large",
     sx: { py: { xs: 7.5, md: 10, lg: 12.5, xl: 15 } }
   }
-], ve = [
+], ke = [
   {
     title: "None",
     value: "none",
@@ -76,7 +76,7 @@ const we = [
     value: "large",
     sx: { py: { xs: 6, md: 9, lg: 9, xl: 11 } }
   }
-], ke = [
+], _e = [
   {
     title: "None",
     value: "none",
@@ -97,17 +97,17 @@ const we = [
     value: "large",
     sx: { px: { xs: 7.5, md: 10, lg: 12.5, xl: 15 } }
   }
-], M = (t, e, n) => {
+], Y = (t, e, n) => {
   const i = t.breakpoints.values[n];
   return `${e}${i ? ` (${i}px)` : ""}`;
-}, _e = [
+}, $e = [
   {
     title: "100%",
     value: "full",
     sx: { maxWidth: "100%" }
   },
   {
-    title: (t) => M(t, "Small", "sm"),
+    title: (t) => Y(t, "Small", "sm"),
     value: "sm",
     sx: {
       maxWidth: (t) => t.breakpoints.values.sm,
@@ -116,40 +116,63 @@ const we = [
     }
   },
   {
-    title: (t) => M(t, "Normal", "md"),
+    title: (t) => Y(t, "Normal", "md"),
     value: "md",
     sx: { maxWidth: (t) => t.breakpoints.values.md, width: "100%", mx: "auto" }
   },
   {
-    title: (t) => M(t, "Large", "lg"),
+    title: (t) => Y(t, "Large", "lg"),
     value: "lg",
     sx: { maxWidth: (t) => t.breakpoints.values.lg, width: "100%", mx: "auto" }
   },
   {
-    title: (t) => M(t, "Extra Large", "xl"),
+    title: (t) => Y(t, "Extra Large", "xl"),
     value: "xl",
     sx: { maxWidth: (t) => t.breakpoints.values.xl, width: "100%", mx: "auto" }
+  },
+  {
+    title: "Custom",
+    value: "custom",
+    sx: {
+      maxWidth: Bt,
+      width: "100%",
+      mx: "auto"
+    }
   }
-], $e = X(we, "value"), Ne = X(ve, "value"), Se = X(ke, "value"), Ce = X(_e, "value"), Pe = /* @__PURE__ */ new Map([
-  ["baseSectionPaddingY", $e],
-  ["maxWidth", Ce],
+], Se = K(ve, "value"), Ne = K(ke, "value"), Ce = K(_e, "value"), Pe = K($e, "value"), Be = /* @__PURE__ */ new Map([
+  ["baseSectionPaddingY", Se],
+  ["maxWidth", Pe],
   ["paddingY", Ne],
-  ["paddingX", Se]
+  ["paddingX", Ce]
 ]);
-function Bt(t) {
-  var c;
-  const { type: e, value: n, format: i = "sx", defaultValue: r = null } = t, a = Pe.get(e);
-  return a && a != null && a[n] && (c = a == null ? void 0 : a[n]) != null && c[i] ? a[n][i] : r;
+function It(t) {
+  var l;
+  const { type: e, value: n, format: i = "sx", defaultValue: r = null } = t, a = Be.get(e);
+  if (!a)
+    return r;
+  const c = n.startsWith("custom:"), s = c ? "custom" : n;
+  if (a != null && a[s] && ((l = a == null ? void 0 : a[s]) != null && l[i])) {
+    const d = a[s][i];
+    if (c) {
+      const m = n.replace("custom:", "");
+      try {
+        return JSON.parse(JSON.stringify(d || {}).replaceAll(Bt, m));
+      } catch {
+      }
+    }
+    return d;
+  }
+  return r;
 }
-const It = vt({
+const Wt = vt({
   page: null,
   getPageMeta: () => ({}),
   getPageMetaStyle: () => ({})
 });
-function Be() {
-  return kt(It);
+function Ie() {
+  return kt(Wt);
 }
-function yn({
+function wn({
   page: t,
   children: e,
   defaultLocale: n = "en",
@@ -163,14 +186,16 @@ function yn({
   }, [r, n, i]), c = E(
     (l = "sx") => {
       const d = a();
-      return !d || !d.style ? {} : Object.entries(d.style || {}).reduce((p, [h, u]) => {
-        if (!u) return p;
-        const f = Bt({
+      return !d || !d.style ? {} : Object.entries(d.style || {}).reduce((u, [h, p]) => {
+        if (!p) return u;
+        const x = `${h}Custom`;
+        d.style[x];
+        const y = It({
           type: h,
-          value: u,
+          value: p,
           format: l
         });
-        return f ? { ...p, ...f } : p;
+        return y ? { ...u, ...y } : u;
       }, {});
     },
     [a]
@@ -182,10 +207,10 @@ function yn({
     }),
     [r, a, c]
   );
-  return /* @__PURE__ */ o(It.Provider, { value: s, children: e });
+  return /* @__PURE__ */ o(Wt.Provider, { value: s, children: e });
 }
-const Ie = Gt(({ onClick: t, ...e }, n) => {
-  const [i, r] = j(!1), a = E(
+const We = Kt(({ onClick: t, ...e }, n) => {
+  const [i, r] = T(!1), a = E(
     async (c) => {
       try {
         r(!0), await (t == null ? void 0 : t(c));
@@ -195,9 +220,9 @@ const Ie = Gt(({ onClick: t, ...e }, n) => {
     },
     [t]
   );
-  return /* @__PURE__ */ o(ee, { ref: n, ...e, loading: e.loading || i, onClick: a });
+  return /* @__PURE__ */ o(oe, { ref: n, ...e, loading: e.loading || i, onClick: a });
 });
-function We({
+function Re({
   tip: t,
   tipSucceed: e,
   title: n,
@@ -208,23 +233,23 @@ function We({
   placement: s = "top",
   ...l
 }) {
-  const [d, m] = j(!1), [p, h] = j(), u = G(), f = () => {
-    h(void 0), c && (u.current = window.setTimeout(() => {
+  const [d, m] = T(!1), [u, h] = T(), p = G(), x = () => {
+    h(void 0), c && (p.current = window.setTimeout(() => {
       m(!1);
     }, 3e3));
   }, y = () => {
-    clearTimeout(u.current);
-  }, g = d ? a : r, v = p ? /* @__PURE__ */ o(x, { color: "error", children: p.message }) : d && e || t;
-  return /* @__PURE__ */ o(Ft, { title: v, disableInteractive: !0, placement: s, onClose: f, onOpen: y, children: /* @__PURE__ */ o("span", { children: /* @__PURE__ */ o(
-    Ie,
+    clearTimeout(p.current);
+  }, f = d ? a : r, v = u ? /* @__PURE__ */ o(g, { color: "error", children: u.message }) : d && e || t;
+  return /* @__PURE__ */ o(Ft, { title: v, disableInteractive: !0, placement: s, onClose: x, onOpen: y, children: /* @__PURE__ */ o("span", { children: /* @__PURE__ */ o(
+    We,
     {
-      startIcon: g && (typeof g == "string" ? /* @__PURE__ */ o(Q, { icon: g }) : g),
-      loadingPosition: g ? "start" : void 0,
+      startIcon: f && (typeof f == "string" ? /* @__PURE__ */ o(Q, { icon: f }) : f),
+      loadingPosition: f ? "start" : void 0,
       ...l,
-      onClick: async (N) => {
+      onClick: async (S) => {
         if (l.onClick)
           try {
-            await l.onClick(N), m(!0);
+            await l.onClick(S), m(!0);
           } catch (B) {
             h(B);
           }
@@ -233,19 +258,19 @@ function We({
     }
   ) }) });
 }
-const Re = wt.lazy(() => import("react-syntax-highlighter").then((t) => ({ default: t.Prism }))), je = bt((t) => /* @__PURE__ */ o(
-  Zt,
+const Te = wt.lazy(() => import("react-syntax-highlighter").then((t) => ({ default: t.Prism }))), je = bt((t) => /* @__PURE__ */ o(
+  te,
   {
     ...t,
-    remarkPlugins: [te],
+    remarkPlugins: [ee],
     components: {
       pre: ze,
       code: ({ node: e, inline: n, className: i, children: r, ...a }) => {
         if (!r) return null;
         const c = /language-(\w+)/.exec(i || "");
-        return n ? /* @__PURE__ */ o(x, { component: "code", className: i, ...a, children: r }) : /* @__PURE__ */ o(x, { component: Re, language: c == null ? void 0 : c[1], ...a, sx: { borderRadius: 1 }, children: String(r).replace(/\n$/, "") });
+        return n ? /* @__PURE__ */ o(g, { component: "code", className: i, ...a, children: r }) : /* @__PURE__ */ o(g, { component: Te, language: c == null ? void 0 : c[1], ...a, sx: { borderRadius: 1 }, children: String(r).replace(/\n$/, "") });
       },
-      table: ({ className: e, children: n }) => /* @__PURE__ */ o(x, { sx: { overflow: "auto", my: 1 }, children: /* @__PURE__ */ o("table", { className: e, children: n }) })
+      table: ({ className: e, children: n }) => /* @__PURE__ */ o(g, { sx: { overflow: "auto", my: 1 }, children: /* @__PURE__ */ o("table", { className: e, children: n }) })
     }
   }
 ))`
@@ -326,7 +351,7 @@ function ze({ children: t }) {
   if (!(e != null && e.children)) return null;
   const n = /language-(\w+)/.exec(e.className || ""), i = n == null ? void 0 : n[1];
   return /* @__PURE__ */ w(
-    x,
+    g,
     {
       component: "div",
       sx: {
@@ -337,10 +362,10 @@ function ze({ children: t }) {
       },
       children: [
         /* @__PURE__ */ w(yt, { direction: "row", alignItems: "center", p: 0.5, pl: 1.5, borderBottom: 1, borderColor: "grey.200", children: [
-          /* @__PURE__ */ o(x, { children: i }),
-          /* @__PURE__ */ o(x, { flex: 1 }),
+          /* @__PURE__ */ o(g, { children: i }),
+          /* @__PURE__ */ o(g, { flex: 1 }),
           /* @__PURE__ */ o(
-            We,
+            Re,
             {
               autoReset: !0,
               title: /* @__PURE__ */ o(Q, { icon: "tabler:copy" }),
@@ -357,9 +382,9 @@ function ze({ children: t }) {
     }
   );
 }
-function T({ actions: t, center: e, className: n, align: i }) {
+function z({ actions: t, center: e, className: n, align: i }) {
   return t && (t != null && t.length) ? /* @__PURE__ */ o(
-    x,
+    g,
     {
       className: b(
         "flex gap-4 flex-wrap",
@@ -374,7 +399,7 @@ function T({ actions: t, center: e, className: n, align: i }) {
     }
   ) : null;
 }
-const Te = "section", Le = bt(x)`
+const Le = "section", Ee = bt(g)`
   overflow: hidden;
 
   .section__title {
@@ -423,7 +448,7 @@ const Te = "section", Le = bt(x)`
       margin-bottom: 0.5rem;
     }
   }
-  @media (min-width: ${({ theme: t }) => t.breakpoints.values[Te]}px) {
+  @media (min-width: ${({ theme: t }) => t.breakpoints.values[Le]}px) {
     .section__tag {
       margin-bottom: 32px;
     }
@@ -435,7 +460,7 @@ const Te = "section", Le = bt(x)`
     }
   }
 `;
-function F({
+function A({
   title: t,
   description: e,
   descriptionMarkdown: n,
@@ -447,13 +472,13 @@ function F({
   level: l = 2,
   tag: d,
   badge: m,
-  center: p,
+  center: u,
   logo: h,
-  titleAppearance: u,
-  descriptionAppearance: f,
+  titleAppearance: p,
+  descriptionAppearance: x,
   ...y
 }) {
-  const g = $t();
+  const f = $t();
   if (!t && !e && !i && !m && !d && !c && !s && !h) return null;
   const v = Math.max(Math.min(5, l + 1), 1), k = {
     1: "xl:!text-3xl lg:!text-2xl md:!text-xl",
@@ -462,8 +487,8 @@ function F({
     4: "xl:!text-xl lg:!text-lg md:!text-md",
     5: "xl:!text-lg md:!text-md sm:!text-sm",
     6: "!text-sm"
-  }, N = l === 0 ? "big" : `h${v}`, B = l === 0;
-  return /* @__PURE__ */ w(Le, { className: b("base-info", "lg:text-left", p && "!text-center", r), ...y, children: [
+  }, S = l === 0 ? "big" : `h${v}`, B = l === 0;
+  return /* @__PURE__ */ w(Ee, { className: b("base-info", "lg:text-left", u && "!text-center", r), ...y, children: [
     c && /* @__PURE__ */ o("div", { children: c }),
     (d || m) && /* @__PURE__ */ o("div", { className: b("section__tag", (a == null ? void 0 : a.tag) || (a == null ? void 0 : a.badge)), children: d || m }),
     h && /* @__PURE__ */ o("img", { className: "w-[120px] m-auto mb-8", src: h, alt: "info", loading: "lazy" }),
@@ -473,7 +498,7 @@ function F({
         sx: {
           whiteSpace: "pre-wrap",
           mb: e ? "2vw" : 0,
-          ...(u == null ? void 0 : u.color) && { color: `${g(u.color)} !important` }
+          ...(p == null ? void 0 : p.color) && { color: `${f(p.color)} !important` }
         },
         className: b(
           "section__title",
@@ -484,15 +509,15 @@ function F({
           B ? "" : "section__title_non_big"
         ),
         component: `h${Math.max(l, 1)}`,
-        variant: N,
+        variant: S,
         children: t
       }
     ),
     e && (n ? /* @__PURE__ */ o(
-      x,
+      g,
       {
         sx: {
-          ...(f == null ? void 0 : f.color) && { color: `${g(f.color)} !important` }
+          ...(x == null ? void 0 : x.color) && { color: `${f(x.color)} !important` }
         },
         component: je,
         className: b(
@@ -510,7 +535,7 @@ function F({
       {
         sx: {
           whiteSpace: "pre-wrap",
-          ...(f == null ? void 0 : f.color) && { color: `${g(f.color)} !important` }
+          ...(x == null ? void 0 : x.color) && { color: `${f(x.color)} !important` }
         },
         className: b(
           "section__description",
@@ -526,11 +551,11 @@ function F({
         children: e
       }
     )),
-    /* @__PURE__ */ o(T, { actions: i, center: p, className: "mt-8" }),
+    /* @__PURE__ */ o(z, { actions: i, center: u, className: "mt-8" }),
     s && /* @__PURE__ */ o("div", { children: s })
   ] });
 }
-const A = [
+const F = [
   "actions",
   "append",
   "badge",
@@ -545,10 +570,10 @@ const A = [
   "titleAppearance",
   "descriptionAppearance"
 ];
-function Wt(t) {
+function Rt(t) {
   if (t.type === Xt) {
     const n = (t.props.children || []).filter((i) => _t(i));
-    return n.length === 1 ? Wt(n[0]) : n.length > 1;
+    return n.length === 1 ? Rt(n[0]) : n.length > 1;
   }
   return Array.isArray(t);
 }
@@ -562,7 +587,7 @@ function it({ children: t, col: e, gap: n, className: i, align: r, sx: a, type:
   align: "center",
   type: "default"
 }) {
-  const l = Nt(), d = Number(Math.floor(100 / e * 100) / 100), m = {
+  const l = St(), d = Number(Math.floor(100 / e * 100) / 100), m = {
     center: "justify-center items-center",
     left: "justify-start items-center",
     right: "justify-end items-center",
@@ -572,43 +597,43 @@ function it({ children: t, col: e, gap: n, className: i, align: r, sx: a, type:
     "top-right": "justify-end items-start",
     "bottom-left": "justify-start items-end",
     "bottom-right": "justify-end items-end"
-  }, p = m[r] || m.center;
-  let u = n ?? ({
+  }, u = m[r] || m.center;
+  let p = n ?? ({
     2: 6,
     3: 4,
     4: 4,
     5: 3,
     6: 3
   }[e] || 0);
-  Wt(t) || (u = 0);
-  const y = (e - 1) * u / e;
-  let g = { ...a, gap: `${u}rem` };
-  const v = { [I]: { width: "100%" } }, k = {}, N = {}, B = {};
-  switch (v.gap = "1rem", k.gap = `${u / 2}rem`, e) {
+  Rt(t) || (p = 0);
+  const y = (e - 1) * p / e;
+  let f = { ...a, gap: `${p}rem` };
+  const v = { [I]: { width: "100%" } }, k = {}, S = {}, B = {};
+  switch (v.gap = "1rem", k.gap = `${p / 2}rem`, e) {
     case 3:
     case 4:
       k[I] = {
-        width: `calc(50% - ${u / 2}rem)`
+        width: `calc(50% - ${p / 2}rem)`
       };
       break;
     case 5:
     case 6:
       v[I] = {
-        width: `calc(50% - ${u / 2 / 2}rem)`
+        width: `calc(50% - ${p / 2 / 2}rem)`
       }, k[I] = {
-        width: `calc(50% - ${u / 2 / 2}rem)`
-      }, N[I] = {
-        width: `calc(33.33% - ${u * 2 / 3}rem)`
+        width: `calc(50% - ${p / 2 / 2}rem)`
+      }, S[I] = {
+        width: `calc(33.33% - ${p * 2 / 3}rem)`
       };
       break;
   }
-  return g[I] = { width: `calc(${d}% - ${y}rem)` }, g[`@media (max-width: ${l.breakpoints.values.xl}px)`] = B, g[`@media (max-width: ${l.breakpoints.values.lg}px)`] = N, g[`@media (max-width: ${l.breakpoints.values.md}px)`] = k, g[`@media (max-width: ${l.breakpoints.values.sm}px)`] = v, c === "wall" && (g = { ...a, gap: `${u}rem` }, g[I] = { width: `calc(${d}% - ${y}rem)` }, v[I] = { width: `calc(45% - ${u / 2 / 2}rem)` }, g[`@media (max-width: ${l.breakpoints.values.sm}px)`] = v), /* @__PURE__ */ o(x, { className: b("flex flex-wrap flex-row h-full", p, i), sx: g, ...s, children: t });
+  return f[I] = { width: `calc(${d}% - ${y}rem)` }, f[`@media (max-width: ${l.breakpoints.values.xl}px)`] = B, f[`@media (max-width: ${l.breakpoints.values.lg}px)`] = S, f[`@media (max-width: ${l.breakpoints.values.md}px)`] = k, f[`@media (max-width: ${l.breakpoints.values.sm}px)`] = v, c === "wall" && (f = { ...a, gap: `${p}rem` }, f[I] = { width: `calc(${d}% - ${y}rem)` }, v[I] = { width: `calc(45% - ${p / 2 / 2}rem)` }, f[`@media (max-width: ${l.breakpoints.values.sm}px)`] = v), /* @__PURE__ */ o(g, { className: b("flex flex-wrap flex-row h-full", u, i), sx: f, ...s, children: t });
 }
-function Ee() {
+function Oe() {
   const t = navigator.userAgent.toLowerCase();
   return t.includes("safari") && !t.includes("chrome");
 }
-function Oe(t = "") {
+function Ae(t = "") {
   if (t.startsWith("data:image/svg+xml,")) return !0;
   const e = /^(((ht|f)tps?):\/\/)?([^!@#$%^&*?.\s-]([^!@#$%^&*?.\s]{0,63}[^!@#$%^&*?.\s])?\.)+[a-z]{2,6}\/?/, n = /^(\/|\.\/|\.\.\/)(?:[^/]+\/)*[^/]+$/;
   return e.test(t) || n.test(t);
@@ -619,12 +644,12 @@ function tt(t) {
 function Fe(t) {
   return t != null && t.endsWith(".mp4") || t != null && t.endsWith(".m4v") ? "video/mp4" : t != null && t.endsWith(".webm") ? "video/webm" : void 0;
 }
-function Ae(t) {
+function Ve(t) {
   let e = {};
-  return typeof t == "string" ? re(t) ? e.image = t : (e.image = S(t), ie(t) && (e.color = t, e.image = "")) : e = t, e;
+  return typeof t == "string" ? ie(t) ? e.image = t : (e.image = N(t), ae(t) && (e.color = t, e.image = "")) : e = t, e;
 }
-function He() {
-  const [t, e] = j(Date.now());
+function Ue() {
+  const [t, e] = T(Date.now());
   return O(() => {
     const n = () => {
       e(Date.now());
@@ -634,11 +659,11 @@ function He() {
     };
   }, []), t;
 }
-function pt(t, e, n, i, r) {
+function ut(t, e, n, i, r) {
   let a = null;
-  const { color: c = "", image: s } = Ae(e);
-  return s && Oe(s) ? (delete n.backgroundColor, !(t.mobile.apple.device || Ee()) && tt(s) ? a = /* @__PURE__ */ o(
-    x,
+  const { color: c = "", image: s } = Ve(e);
+  return s && Ae(s) ? (delete n.backgroundColor, !(t.mobile.apple.device || Oe()) && tt(s) ? a = /* @__PURE__ */ o(
+    g,
     {
       component: "video",
       className: "section-bg",
@@ -648,8 +673,8 @@ function pt(t, e, n, i, r) {
       muted: !0,
       controls: !1,
       playsInline: !0,
-      poster: z(S(i), 1200, "quality"),
-      src: tt(s) ? s : z(s, 1200, "quality"),
+      poster: j(N(i), 1200, "quality"),
+      src: tt(s) ? s : j(s, 1200, "quality"),
       sx: {
         position: "absolute",
         zIndex: -9999,
@@ -663,7 +688,7 @@ function pt(t, e, n, i, r) {
     },
     s
   ) : a = /* @__PURE__ */ o(
-    St,
+    Nt,
     {
       src: s,
       sizesAttr: {
@@ -689,10 +714,10 @@ function pt(t, e, n, i, r) {
     r || s
   )) : s ? n.backgroundImage = `${s} !important` : c && (n.backgroundColor = `${c} !important`), a;
 }
-function De({ autoWidth: t, children: e, ...n }) {
-  return t ? /* @__PURE__ */ o(x, { display: "flex", ...n, children: e }) : /* @__PURE__ */ o(At, { ...n, children: e });
+function He({ autoWidth: t, children: e, ...n }) {
+  return t ? /* @__PURE__ */ o(g, { display: "flex", ...n, children: e }) : /* @__PURE__ */ o(Vt, { ...n, children: e });
 }
-function H({
+function V({
   dark: t = !1,
   children: e,
   className: n,
@@ -703,23 +728,23 @@ function H({
   type: s,
   ...l
 }) {
-  const d = { ...i }, m = Ct((u) => u.breakpoints.down("md"));
+  const d = { ...i }, m = Ct((p) => p.breakpoints.down("md"));
   t && (d.color = mt.common.white, d.backgroundColor = `${mt.grey[900]} !important`), r.show && (d.display = "flex");
-  const p = R(() => !Number(l.boxMaxWidth) || m ? {
+  const u = R(() => !Number(l.boxMaxWidth) || m ? {
     width: "100%"
   } : s === "wall" && l.boxMaxWidth ? {
     maxWidth: `${l.boxMaxWidth}px !important`,
     width: "100%"
   } : {
     width: "100%"
-  }, [l.boxMaxWidth, m, s]), h = Bt({
+  }, [l.boxMaxWidth, m, s]), h = It({
     type: "baseSectionPaddingY",
     value: a || "normal",
     // section default is normal
     defaultValue: ""
   });
   return /* @__PURE__ */ o(
-    Ve,
+    De,
     {
       component: "section",
       styles: { ...d, ...h },
@@ -737,11 +762,11 @@ function H({
         "titleAppearance",
         "descriptionAppearance"
       ),
-      children: /* @__PURE__ */ o(De, { autoWidth: l == null ? void 0 : l.autoWidth, className: b("section-content h-full"), sx: p, children: r.show ? /* @__PURE__ */ o(Rt, { ...c, boxed: r, children: e }) : e })
+      children: /* @__PURE__ */ o(He, { autoWidth: l == null ? void 0 : l.autoWidth, className: b("section-content h-full"), sx: u, children: r.show ? /* @__PURE__ */ o(Tt, { ...c, boxed: r, children: e }) : e })
     }
   );
 }
-function Rt({
+function Tt({
   background: t = "",
   backgroundVideoPoster: e,
   children: n,
@@ -753,21 +778,21 @@ function Rt({
 }) {
   const l = { ...c, ...i }, d = $t();
   let m = null;
-  const p = Ct((f) => f.breakpoints.up("sm")), h = oe(), u = He();
-  return t && (m = pt(
+  const u = Ct((x) => x.breakpoints.up("sm")), h = ne(), p = Ue();
+  return t && (m = ut(
     h,
     typeof t == "string" ? d(t) : t,
     l,
     e,
-    u
-  )), r.show && (l.borderRadius = "10px", l.padding === void 0 && (l.padding = p ? "50px" : "20px"), r != null && r.border && (l.border = "1px solid #c0c0c0"), r != null && r.background && (m = pt(
+    p
+  )), r.show && (l.borderRadius = "10px", l.padding === void 0 && (l.padding = u ? "50px" : "20px"), r != null && r.border && (l.border = "1px solid #c0c0c0"), r != null && r.background && (m = ut(
     h,
     typeof (r == null ? void 0 : r.background) == "string" ? d(r == null ? void 0 : r.background) : r == null ? void 0 : r.background,
     l,
     r == null ? void 0 : r.backgroundVideoPoster,
-    u
+    p
   ))), /* @__PURE__ */ w(
-    x,
+    g,
     {
       ...s,
       sx: {
@@ -782,7 +807,7 @@ function Rt({
     }
   );
 }
-const Ve = _(Rt)`
+const De = _(Tt)`
   &:nth-of-type(even) {
     background: #f8f8f8;
   }
@@ -807,7 +832,7 @@ function $(t, e) {
   return [n, i];
 }
 const zt = ["title", "description", "actions", "badge", "tag", "prepend", "append", "logo"];
-function Ue({
+function Me({
   image: t,
   imageBorder: e,
   imageShadow: n,
@@ -816,8 +841,8 @@ function Ue({
   fullSizeImage: a,
   ...c
 }) {
-  const [s, l] = $(c, A), d = Object.keys(s).length > 0 && Object.values(rt(s, zt)).filter(Boolean).length > 0 && /* @__PURE__ */ o(F, { ...s }), m = _t(t) ? t : /* @__PURE__ */ o(x, { component: "img", src: t, alt: "", className: "block" }), p = ["phone", "macbook"].includes(e), h = t && /* @__PURE__ */ o(
-    x,
+  const [s, l] = $(c, F), d = Object.keys(s).length > 0 && Object.values(rt(s, zt)).filter(Boolean).length > 0 && /* @__PURE__ */ o(A, { ...s }), m = _t(t) ? t : /* @__PURE__ */ o(g, { component: "img", src: t, alt: "", className: "block" }), u = ["phone", "macbook"].includes(e), h = t && /* @__PURE__ */ o(
+    g,
     {
       className: b(
         "section__image",
@@ -830,16 +855,16 @@ function Ue({
         borderRadius: 2,
         overflow: "hidden",
         // FIXME: Screenshot 组件无法设置最外层 div 的样式，只能通过父元素设置
-        "> div": p ? { width: "100%", video: { borderRadius: "0 !important" } } : void 0
+        "> div": u ? { width: "100%", video: { borderRadius: "0 !important" } } : void 0
       },
-      children: p ? (
+      children: u ? (
         // @ts-ignore
-        /* @__PURE__ */ o(ae, { type: e, sx: { width: "100%" }, children: m })
+        /* @__PURE__ */ o(se, { type: e, sx: { width: "100%" }, children: m })
       ) : m
     }
   );
   return /* @__PURE__ */ o(
-    H,
+    V,
     {
       className: b(
         "section--block",
@@ -882,15 +907,15 @@ function Ue({
     }
   );
 }
-const D = ["editing", "height", "locale", "dev", "sx"];
+const U = ["editing", "height", "locale", "dev", "sx"];
 function Ye(t) {
   const { className: e, ...n } = t;
-  return /* @__PURE__ */ o(Me, { ...n, className: b("BlockBase-root", e) });
+  return /* @__PURE__ */ o(Je, { ...n, className: b("BlockBase-root", e) });
 }
-const Me = _(x)`
+const Je = _(g)`
   position: relative;
 `;
-function Je({
+function Ge({
   widget: t,
   reverse: e,
   projectId: n,
@@ -902,9 +927,9 @@ function Je({
   placeholder: l,
   loadingIndicator: d,
   section: m,
-  ...p
+  ...u
 }) {
-  const [{ editing: h }, u] = $(p, D), [f, y] = $(u, A), g = n && i ? { projectId: n, gitRef: "main", assistantId: i, working: !0 } : void 0, v = {
+  const [{ editing: h }, p] = $(u, U), [x, y] = $(p, F), f = n && i ? { projectId: n, gitRef: "main", assistantId: i, working: !0 } : void 0, v = {
     children: a,
     endIcon: c ? /* @__PURE__ */ o(jt, { icon: c }) : void 0,
     sx: {
@@ -914,57 +939,57 @@ function Je({
         opacity: 0.8
       }
     }
-  }, k = [], N = l && /* @__PURE__ */ o(P, { variant: "caption", color: "text.disabled", children: l }), B = d && /* @__PURE__ */ o(P, { variant: "caption", color: "text.disabled", children: d });
-  Object.keys(f).length > 0 && Object.values(rt(f, zt)).filter(Boolean).length > 0 && k.push(/* @__PURE__ */ o(F, { ...f }, "base-info")), g && (t === "form" ? k.push(/* @__PURE__ */ o(ct, { identifier: g, SubmitProps: v }, "form")) : t === "result" ? k.push(
+  }, k = [], S = l && /* @__PURE__ */ o(P, { variant: "caption", color: "text.disabled", children: l }), B = d && /* @__PURE__ */ o(P, { variant: "caption", color: "text.disabled", children: d });
+  Object.keys(x).length > 0 && Object.values(rt(x, zt)).filter(Boolean).length > 0 && k.push(/* @__PURE__ */ o(A, { ...x }, "base-info")), f && (t === "form" ? k.push(/* @__PURE__ */ o(ct, { identifier: f, SubmitProps: v }, "form")) : t === "result" ? k.push(
     /* @__PURE__ */ o(
       dt,
       {
-        identifier: g,
-        placeholder: N,
+        identifier: f,
+        placeholder: S,
         loadingIndicator: B
       },
       "result"
     )
   ) : k.push(
     /* @__PURE__ */ w(yt, { width: "100%", gap: 2, direction: "row", children: [
-      /* @__PURE__ */ o(ct, { identifier: g, BoxProps: { flex: 1 }, SubmitProps: v }),
+      /* @__PURE__ */ o(ct, { identifier: f, BoxProps: { flex: 1 }, SubmitProps: v }),
       /* @__PURE__ */ o(
         dt,
         {
-          identifier: g,
+          identifier: f,
           BoxProps: { flex: 1 },
-          placeholder: N,
+          placeholder: S,
           loadingIndicator: B
         }
       )
     ] }, "form-result")
   )), e && k.reverse();
-  const st = Ht(), Ot = R(
-    () => Dt(qt(st, { palette: { primary: s ? { main: s } : void 0 } })),
+  const st = Ut(), At = R(
+    () => Ht(Qt(st, { palette: { primary: s ? { main: s } : void 0 } })),
     [s, st]
   );
-  return /* @__PURE__ */ o(Qt, { fallbackRender: Kt, children: /* @__PURE__ */ o(Vt, { theme: Ot, children: /* @__PURE__ */ o(H, { ...y, sx: h ? { pointerEvents: "none" } : {}, children: /* @__PURE__ */ o(it, { col: k.length, children: k }) }) }) });
+  return /* @__PURE__ */ o(Zt, { fallbackRender: qt, children: /* @__PURE__ */ o(Dt, { theme: At, children: /* @__PURE__ */ o(V, { ...y, sx: h ? { pointerEvents: "none" } : {}, children: /* @__PURE__ */ o(it, { col: k.length, children: k }) }) }) });
 }
-const Tt = vt({
+const Lt = vt({
   pages: [],
   project: void 0
-}), { Provider: wn, Consumer: vn } = Tt;
-function Lt() {
-  return kt(Tt);
+}), { Provider: vn, Consumer: kn } = Lt;
+function Et() {
+  return kt(Lt);
 }
-function Ge({ icon: t, className: e = "", size: n = "1rem", ...i }) {
+function Ke({ icon: t, className: e = "", size: n = "1rem", ...i }) {
   return /* @__PURE__ */ o(Xe, { component: jt, className: b("css-icon", e), size: n, ...i, icon: t });
 }
-const Xe = _(x)`
+const Xe = _(g)`
   &.css-icon {
     display: inline-block;
     width: ${({ size: t }) => t};
     height: ${({ size: t }) => t};
   }
 `;
-function Ke({ icon: t, className: e = "", size: n = "1rem", imageMeta: i, ...r }) {
-  const a = z(S(t), 540), [c, s] = j(!1), l = Nt();
-  return c ? /* @__PURE__ */ o(Ge, { icon: "i-mdi:image", color: l.palette.grey[500], size: n, className: e, ...r }) : /* @__PURE__ */ o(qe, { className: b("image-icon", e), size: n, ...r, children: /* @__PURE__ */ o(
+function qe({ icon: t, className: e = "", size: n = "1rem", imageMeta: i, ...r }) {
+  const a = j(N(t), 540), [c, s] = T(!1), l = St();
+  return c ? /* @__PURE__ */ o(Ke, { icon: "i-mdi:image", color: l.palette.grey[500], size: n, className: e, ...r }) : /* @__PURE__ */ o(Qe, { className: b("image-icon", e), size: n, ...r, children: /* @__PURE__ */ o(
     "img",
     {
       className: "image-icon__image",
@@ -977,7 +1002,7 @@ function Ke({ icon: t, className: e = "", size: n = "1rem", imageMeta: i, ...r }
     }
   ) });
 }
-const qe = _(x)`
+const Qe = _(g)`
   display: inline-block;
   width: ${({ size: t }) => t};
   height: ${({ size: t }) => t};
@@ -989,22 +1014,22 @@ const qe = _(x)`
 `, at = (t) => typeof t == "string" && /^[\w-_]+:[\w-_]+$/.test(t);
 function et({ icon: t, size: e = "1rem", imageMeta: n, ...i }) {
   const r = window.isNaN(e) ? e : `${e}px`;
-  return at(t) ? /* @__PURE__ */ o(Pt, { icon: t }) : /* @__PURE__ */ o(Qe, { component: Ke, imageMeta: n, className: "base-icon", icon: t, size: r, ...i });
+  return at(t) ? /* @__PURE__ */ o(Pt, { icon: t }) : /* @__PURE__ */ o(Ze, { component: qe, imageMeta: n, className: "base-icon", icon: t, size: r, ...i });
 }
-const Qe = _(x)`
+const Ze = _(g)`
   flex-shrink: 0;
 `;
 function L({ text: t, children: e, icon: n = "", endIcon: i, color: r = "primary", link: a = "", href: c = "", ...s }) {
-  const l = n ? /* @__PURE__ */ o(et, { icon: n }) : null, d = i ? /* @__PURE__ */ o(et, { icon: i }) : null, m = a || c, p = { ...s };
-  return m && (p.href = m, Z(m) && (p.target = p.target || "_blank")), /* @__PURE__ */ o(de, { startIcon: l, endIcon: d, color: r, ...p, children: t || e });
+  const l = n ? /* @__PURE__ */ o(et, { icon: n }) : null, d = i ? /* @__PURE__ */ o(et, { icon: i }) : null, m = a || c, u = { ...s };
+  return m && (u.href = m, Z(m) && (u.target = u.target || "_blank")), /* @__PURE__ */ o(me, { startIcon: l, endIcon: d, color: r, ...u, children: t || e });
 }
-function Et({ editing: t, text: e, ...n }) {
-  const { pages: i = [] } = Lt(), r = i.find((a) => a.id === (n.link || n.linkId));
+function Ot({ editing: t, text: e, ...n }) {
+  const { pages: i = [] } = Et(), r = i.find((a) => a.id === (n.link || n.linkId));
   if (t)
     return /* @__PURE__ */ o(L, { ...C(n, ["link", "linkId"]), children: e });
   if (r) {
     const a = r.path || "/";
-    return /* @__PURE__ */ o(se, { to: a, children: /* @__PURE__ */ o(L, { ...C(n, ["link", "linkId"]), children: e }) });
+    return /* @__PURE__ */ o(le, { to: a, children: /* @__PURE__ */ o(L, { ...C(n, ["link", "linkId"]), children: e }) });
   }
   return /* @__PURE__ */ o(L, { ...C(n, "linkId"), children: e });
 }
@@ -1019,7 +1044,7 @@ W.defaultProps = {
   color: "inherit",
   className: ""
 };
-function Ze({
+function to({
   to: t,
   base: e,
   children: n,
@@ -1030,15 +1055,15 @@ function Ze({
   useRouterLink: s,
   ...l
 }) {
-  const { pages: d = [], locale: m = "" } = {}, p = e ? Y("/", e) : e || "";
-  let h = a === "auto" ? "_self" : a, u = Y(p, t);
-  const f = c ? Z(u) : !1;
+  const { pages: d = [], locale: m = "" } = {}, u = e ? M("/", e) : e || "";
+  let h = a === "auto" ? "_self" : a, p = M(u, t);
+  const x = c ? Z(p) : !1;
   if (e)
-    return u = Y(p, m, t), /* @__PURE__ */ o(
+    return p = M(u, m, t), /* @__PURE__ */ o(
       "a",
       {
         className: `no-underline ${i}`,
-        href: K(u),
+        href: X(p),
         rel: "noreferrer noopener",
         target: h,
         ...l,
@@ -1046,16 +1071,16 @@ function Ze({
       }
     );
   if (Z(t))
-    a === "auto" && (h = "_blank"), u = t;
+    a === "auto" && (h = "_blank"), p = t;
   else {
-    me(u) && (u = Y(window.location.pathname, u));
-    const y = pe(`${window.location.origin}${u}`), g = d.some((v) => v.pathname === y.pathname);
-    if (s || g)
+    ue(p) && (p = M(window.location.pathname, p));
+    const y = pe(`${window.location.origin}${p}`), f = d.some((v) => v.pathname === y.pathname);
+    if (s || f)
       return /* @__PURE__ */ o(
-        le,
+        ce,
         {
           end: !0,
-          to: K(u),
+          to: X(p),
           className: ({ isActive: v }) => b(i, v ? r : ""),
           ...l,
           children: n
@@ -1066,18 +1091,18 @@ function Ze({
     "a",
     {
       className: `no-underline ${i}`,
-      href: K(u),
+      href: X(p),
       rel: "noreferrer noopener",
       target: h,
       ...l,
       children: [
         n,
-        f && /* @__PURE__ */ o(W, { icon: "i-mdi:arrow-top-right", size: "0.9em", className: "smart-link__mark", style: { marginLeft: 5 } })
+        x && /* @__PURE__ */ o(W, { icon: "i-mdi:arrow-top-right", size: "0.9em", className: "smart-link__mark", style: { marginLeft: 5 } })
       ]
     }
   );
 }
-function V({
+function H({
   prepend: t,
   append: e,
   children: n,
@@ -1087,13 +1112,13 @@ function V({
   ...c
 }) {
   let s = {};
-  const { pages: l = [] } = Lt(), d = l.find((h) => h.id === c.link), m = !n || wt.Children.toArray(n).every((h) => h === null);
+  const { pages: l = [] } = Et(), d = l.find((h) => h.id === c.link), m = !n || wt.Children.toArray(n).every((h) => h === null);
   return c.link && (s = {
-    component: Ze,
+    component: to,
     to: (d == null ? void 0 : d.path) || c.link,
     useRouterLink: !0
   }), /* @__PURE__ */ w(
-    to,
+    eo,
     {
       className: b(
         "base-card card",
@@ -1112,7 +1137,7 @@ function V({
     }
   );
 }
-const to = _(x)`
+const eo = _(g)`
   &.base-card {
     text-align: left;
     border-width: 1px;
@@ -1128,7 +1153,7 @@ const to = _(x)`
     padding: 15px 15px;
   }
 `;
-function U({
+function D({
   align: t = "left",
   title: e,
   titleProps: n = {},
@@ -1162,7 +1187,7 @@ function U({
     )
   ] });
 }
-function eo({
+function oo({
   image: t,
   title: e,
   description: n,
@@ -1175,14 +1200,14 @@ function eo({
   align: d,
   ...m
 }) {
-  const p = at(t), h = z(S(t), 540);
+  const u = at(t), h = j(N(t), 540);
   return /* @__PURE__ */ w(
-    oo,
+    no,
     {
       className: "card-article",
       ...m,
-      prepend: /* @__PURE__ */ o("div", { className: "card__image__wrap", children: p && t ? /* @__PURE__ */ o(
-        x,
+      prepend: /* @__PURE__ */ o("div", { className: "card__image__wrap", children: u && t ? /* @__PURE__ */ o(
+        g,
         {
           sx: {
             position: "absolute",
@@ -1211,7 +1236,7 @@ function eo({
       ) }),
       children: [
         e || n ? /* @__PURE__ */ o(
-          U,
+          D,
           {
             align: d,
             title: e,
@@ -1220,12 +1245,12 @@ function eo({
             descriptionProps: s
           }
         ) : null,
-        l != null && l.length ? /* @__PURE__ */ o(T, { align: d, actions: l, className: "mt-4" }) : null
+        l != null && l.length ? /* @__PURE__ */ o(z, { align: d, actions: l, className: "mt-4" }) : null
       ]
     }
   );
 }
-const oo = _(V)`
+const no = _(H)`
   ${(t) => t.hoverStyle === "none" ? "" : t.link ? `transition: box-shadow ease .3s;
               &:hover {
                 box-shadow: 0 0 10px rgba(95, 142, 244, 0.42);
@@ -1246,7 +1271,7 @@ const oo = _(V)`
     height: 100%;
     object-position: top center;
   }
-`, ut = "section";
+`, pt = "section";
 function ht({
   title: t,
   image: e,
@@ -1258,7 +1283,7 @@ function ht({
   className: s = "",
   ...l
 }) {
-  return /* @__PURE__ */ w(no, { className: b("card", `list-type-${c}`, s), align: a, ...l, children: [
+  return /* @__PURE__ */ w(ro, { className: b("card", `list-type-${c}`, s), align: a, ...l, children: [
     e && /* @__PURE__ */ o(
       W,
       {
@@ -1268,18 +1293,18 @@ function ht({
         imageMeta: n
       }
     ),
-    t || i ? /* @__PURE__ */ o(U, { align: a, title: t, description: i }) : null,
-    r != null && r.length ? /* @__PURE__ */ o(T, { align: a, actions: r, className: "mt-4" }) : null
+    t || i ? /* @__PURE__ */ o(D, { align: a, title: t, description: i }) : null,
+    r != null && r.length ? /* @__PURE__ */ o(z, { align: a, actions: r, className: "mt-4" }) : null
   ] });
 }
-const no = _(V)`
+const ro = _(H)`
   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[ut]}px) {
+  @media (max-width: ${({ theme: t }) => t.breakpoints.values[pt]}px) {
     padding: 1.5rem 2rem;
   }
   @media (max-width: ${({ theme: t }) => t.breakpoints.values.sm}px) {
@@ -1324,13 +1349,13 @@ const no = _(V)`
     }
   }
 
-  @media (min-width: ${({ theme: t }) => t.breakpoints.values[ut]}px) {
+  @media (min-width: ${({ theme: t }) => t.breakpoints.values[pt]}px) {
     padding: 2rem 2rem;
     text-align: left;
     box-sizing: border-box;
   }
 `;
-function ro({
+function io({
   image: t,
   title: e,
   description: n,
@@ -1343,14 +1368,14 @@ function ro({
   align: d,
   ...m
 }) {
-  const p = at(t), h = z(S(t), 540);
+  const u = at(t), h = j(N(t), 540);
   return /* @__PURE__ */ w(
-    io,
+    ao,
     {
       className: "card-article",
       ...m,
-      prepend: /* @__PURE__ */ o("div", { className: "card__image__wrap", children: p && t ? /* @__PURE__ */ o(
-        x,
+      prepend: /* @__PURE__ */ o("div", { className: "card__image__wrap", children: u && t ? /* @__PURE__ */ o(
+        g,
         {
           sx: {
             position: "absolute",
@@ -1365,7 +1390,7 @@ function ro({
           children: /* @__PURE__ */ o(W, { icon: t, color: "primary.main" })
         }
       ) : h && /* @__PURE__ */ o(
-        x,
+        g,
         {
           component: "img",
           className: "card__image",
@@ -1380,7 +1405,7 @@ function ro({
       ) }),
       children: [
         e || n ? /* @__PURE__ */ o(
-          U,
+          D,
           {
             align: d,
             title: e,
@@ -1389,12 +1414,12 @@ function ro({
             descriptionProps: s
           }
         ) : null,
-        l != null && l.length ? /* @__PURE__ */ o(T, { align: d, actions: l, className: "mt-4" }) : null
+        l != null && l.length ? /* @__PURE__ */ o(z, { align: d, actions: l, className: "mt-4" }) : null
       ]
     }
   );
 }
-const io = _(V)`
+const ao = _(H)`
   ${(t) => t.hoverStyle === "none" ? "" : t.link ? `transition: box-shadow ease .3s;
               &:hover {
                 box-shadow: 0 0 10px rgba(95, 142, 244, 0.42);
@@ -1419,7 +1444,7 @@ const io = _(V)`
     max-height: 60px;
   }
 `, ft = "section";
-function ao({
+function so({
   title: t,
   image: e,
   imageMeta: n,
@@ -1430,15 +1455,15 @@ function ao({
   className: s = "",
   ...l
 }) {
-  return /* @__PURE__ */ o(so, { className: b("card", s), ...l, children: /* @__PURE__ */ w(x, { className: "flex items-center", children: [
+  return /* @__PURE__ */ o(lo, { className: b("card", s), ...l, children: /* @__PURE__ */ w(g, { className: "flex items-center", children: [
     e && /* @__PURE__ */ o(W, { icon: e, color: "primary.main", size: i, imageMeta: n }),
-    /* @__PURE__ */ w(x, { className: "flex-1 ml-4", children: [
-      /* @__PURE__ */ o(U, { align: c, title: t, description: r }),
-      /* @__PURE__ */ o(T, { align: c, actions: a, className: "mt-4" })
+    /* @__PURE__ */ w(g, { className: "flex-1 ml-4", children: [
+      /* @__PURE__ */ o(D, { align: c, title: t, description: r }),
+      /* @__PURE__ */ o(z, { align: c, actions: a, className: "mt-4" })
     ] })
   ] }) });
 }
-const so = _(V)`
+const lo = _(H)`
   padding: 5vw 4vw;
   text-align: left;
   box-sizing: border-box;
@@ -1495,7 +1520,7 @@ const so = _(V)`
     box-sizing: border-box;
   }
 `;
-function lo({
+function co({
   title: t,
   titleProps: e = {},
   description: n,
@@ -1507,10 +1532,10 @@ function lo({
   hoverStyle: l,
   ...d
 }) {
-  return /* @__PURE__ */ w(co, { className: b("card-simple", c, `hover-style__${l}`), align: s, ...d, children: [
+  return /* @__PURE__ */ w(mo, { className: b("card-simple", c, `hover-style__${l}`), align: s, ...d, children: [
     r && /* @__PURE__ */ o(W, { icon: r, color: "primary.main", imageMeta: a }),
     t || n ? /* @__PURE__ */ o(
-      U,
+      D,
       {
         align: s,
         title: t,
@@ -1521,7 +1546,7 @@ function lo({
     ) : null
   ] });
 }
-const co = _(V)`
+const mo = _(H)`
   ${({ dark: t, theme: e }) => `background-color:${t ? e.palette.grey[900] : e.palette.common.white};`}
 
   &.hover-style__default {
@@ -1607,13 +1632,13 @@ const co = _(V)`
     }
   }
 `;
-function mo({ type: t = "default", ...e }) {
+function uo({ type: t = "default", ...e }) {
   const i = {
-    article: eo,
-    simple: lo,
-    news: ao,
+    article: oo,
+    simple: co,
+    news: so,
     default: ht,
-    wall: ro
+    wall: io
   }[t] || ht;
   return /* @__PURE__ */ o(i, { ...t === "news" ? e : C(e, "iconSize") });
 }
@@ -1629,9 +1654,9 @@ function po({
   className: l = "",
   type: d = "default",
   dark: m = !1,
-  textAlign: p = "left",
+  textAlign: u = "left",
   hoverStyle: h,
-  ...u
+  ...p
 }) {
   return /* @__PURE__ */ o(
     it,
@@ -1641,17 +1666,17 @@ function po({
       col: a,
       gap: c,
       align: e,
-      ...u,
-      children: n || t.map((f) => /* @__PURE__ */ o(
-        mo,
+      ...p,
+      children: n || t.map((x) => /* @__PURE__ */ o(
+        uo,
         {
           borderColor: i,
           iconColor: s,
           type: d,
           listType: r,
           dark: m,
-          ...f,
-          align: p,
+          ...x,
+          align: u,
           sx: {
             bgcolor: d === "wall" ? void 0 : m ? "grey.900" : "common.white"
           },
@@ -1661,12 +1686,12 @@ function po({
             marginBottom: "-1px"
           } : {}
         },
-        f.id
+        x.id
       ))
     }
   );
 }
-const uo = [
+const ho = [
   "align",
   "cards",
   "list",
@@ -1677,7 +1702,7 @@ const uo = [
   "iconColor",
   "type",
   "textAlign"
-], ho = _(H)`
+], fo = _(V)`
   a .card {
     color: #404040;
     cursor: pointer;
@@ -1693,14 +1718,14 @@ const uo = [
     color: #404040;
   }
 `;
-function fo({ className: t, ...e }) {
-  const [n, i] = $(e, A), [r, a] = $(i, uo);
-  return /* @__PURE__ */ w(ho, { className: b("section--card-list", t), type: e.type, ...a, children: [
-    Object.keys(n).length > 0 && /* @__PURE__ */ o(F, { center: !0, ...n, className: "mb-[2.5vw]" }),
+function go({ className: t, ...e }) {
+  const [n, i] = $(e, F), [r, a] = $(i, ho);
+  return /* @__PURE__ */ w(fo, { className: b("section--card-list", t), type: e.type, ...a, children: [
+    Object.keys(n).length > 0 && /* @__PURE__ */ o(A, { center: !0, ...n, className: "mb-[2.5vw]" }),
     /* @__PURE__ */ o(po, { ...r, dark: !!e.dark })
   ] });
 }
-const go = _(fo)`
+const xo = _(go)`
   .card__description {
     white-space: pre-wrap;
   }
@@ -1716,8 +1741,8 @@ const go = _(fo)`
     background: inherit !important;
   }
 `;
-function xo({ section: t, ...e }) {
-  const [{ editing: n }, i] = $(e, D), r = R(() => {
+function bo({ section: t, ...e }) {
+  const [{ editing: n }, i] = $(e, U), r = R(() => {
     var a;
     return {
       ...C(i, ["listBorder", "list", "iconSize", "imageSize"]),
@@ -1726,7 +1751,7 @@ function xo({ section: t, ...e }) {
         return {
           ...C(c, "icon", "iconColor"),
           image: ["news", "simple", "default"].includes(i.type) && c.icon ? c.icon : c.image,
-          actions: (l = (s = c.actions) == null ? void 0 : s.map) == null ? void 0 : l.call(s, (d) => /* @__PURE__ */ o(Et, { ...d, editing: n }, d.id)),
+          actions: (l = (s = c.actions) == null ? void 0 : s.map) == null ? void 0 : l.call(s, (d) => /* @__PURE__ */ o(Ot, { ...d, editing: n }, d.id)),
           border: i.listBorder,
           iconSize: i.iconSize,
           imageSize: i.imageSize,
@@ -1735,9 +1760,9 @@ function xo({ section: t, ...e }) {
       })
     };
   }, [i]);
-  return /* @__PURE__ */ o(go, { style: n ? { pointerEvents: "none" } : {}, ...r });
+  return /* @__PURE__ */ o(xo, { style: n ? { pointerEvents: "none" } : {}, ...r });
 }
-function bo({
+function yo({
   properties: t,
   section: e,
   locale: n,
@@ -1745,7 +1770,7 @@ function bo({
 }) {
   var r;
   return (r = e == null ? void 0 : e.config) != null && r.componentId ? /* @__PURE__ */ o(
-    ne,
+    re,
     {
       instanceId: e.id,
       componentId: e.config.componentId,
@@ -1756,9 +1781,9 @@ function bo({
       properties: t,
       dev: i
     }
-  ) : /* @__PURE__ */ o(x, { textAlign: "center", py: 2, children: /* @__PURE__ */ o(P, { variant: "caption", color: "text.secondary", children: "Please select component to render" }) });
+  ) : /* @__PURE__ */ o(g, { textAlign: "center", py: 2, children: /* @__PURE__ */ o(P, { variant: "caption", color: "text.secondary", children: "Please select component to render" }) });
 }
-function yo({
+function wo({
   src: t,
   dataId: e,
   isEdit: n = !1,
@@ -1767,7 +1792,7 @@ function yo({
   }
 }) {
   return /* @__PURE__ */ o(
-    ge,
+    xe,
     {
       isEdit: n,
       embedId: e,
@@ -1779,12 +1804,12 @@ function yo({
     }
   );
 }
-function wo({ dataId: t, src: e, actions: n, center: i, onLoad: r, ...a }) {
-  const [c, s] = $(a, A);
-  return /* @__PURE__ */ w(H, { ...s, children: [
-    Object.keys(c).length > 0 && /* @__PURE__ */ o(F, { center: i, ...c }),
+function vo({ dataId: t, src: e, actions: n, center: i, onLoad: r, ...a }) {
+  const [c, s] = $(a, F);
+  return /* @__PURE__ */ w(V, { ...s, children: [
+    Object.keys(c).length > 0 && /* @__PURE__ */ o(A, { center: i, ...c }),
     /* @__PURE__ */ o(
-      yo,
+      wo,
       {
         dataId: t,
         src: e,
@@ -1792,10 +1817,10 @@ function wo({ dataId: t, src: e, actions: n, center: i, onLoad: r, ...a }) {
         height: a.iframeHeight ? `${a.iframeHeight}px` : "100%"
       }
     ),
-    /* @__PURE__ */ o(T, { actions: n, center: i })
+    /* @__PURE__ */ o(z, { actions: n, center: i })
   ] });
 }
-const kn = {
+const _n = {
   src: "",
   embedUrl: "",
   title: "",
@@ -1806,21 +1831,21 @@ const kn = {
   config: {},
   id: ""
 };
-function vo({ section: t, id: e, src: n, ...i }) {
-  const r = `${e}-${i.locale}`, [{ editing: a }, c] = $(i, D), s = G({}), l = JSON.parse(JSON.stringify(c)), { message: d } = ue(r, "server"), m = he(JSON.parse(JSON.stringify(c.config) || "{}"));
+function ko({ section: t, id: e, src: n, ...i }) {
+  const r = `${e}-${i.locale}`, [{ editing: a }, c] = $(i, U), s = G({}), l = JSON.parse(JSON.stringify(c)), { message: d } = he(r, "server"), m = fe(JSON.parse(JSON.stringify(c.config) || "{}"));
   return O(() => {
     d && d.onInit(() => m.current);
   }, [d]), O(() => {
-    const p = JSON.parse(JSON.stringify(c.config) || "{}");
-    fe(s.current, p) || (s.current = p, d == null || d.send("config-set", p));
-  }, [d, c.config]), n ? /* @__PURE__ */ o(wo, { ...l, dataId: r, src: n, style: a ? { pointerEvents: "none" } : {} }) : /* @__PURE__ */ o(ko, { children: 'Please set the "src" attribute for this block' });
+    const u = JSON.parse(JSON.stringify(c.config) || "{}");
+    ge(s.current, u) || (s.current = u, d == null || d.send("config-set", u));
+  }, [d, c.config]), n ? /* @__PURE__ */ o(vo, { ...l, dataId: r, src: n, style: a ? { pointerEvents: "none" } : {} }) : /* @__PURE__ */ o(_o, { children: 'Please set the "src" attribute for this block' });
 }
-const ko = _("div")`
+const _o = _("div")`
   user-select: none;
   color: #999;
   padding: 8px;
   height: 200px;
-`, _o = [
+`, $o = [
   /youtu\.be\/([^#&?]{11})/,
   // youtu.be/<id>
   /\?v=([^#&?]{11})/,
@@ -1832,30 +1857,30 @@ const ko = _("div")`
   /\/v\/([^#&?]{11})/
   // /v/<id>
 ];
-function $o(t) {
+function So(t) {
   var e;
   if (/youtu\.?be/.test(t))
-    for (const n of _o) {
+    for (const n of $o) {
       const i = (e = n.exec(t)) == null ? void 0 : e[1];
       if (i)
         return i;
     }
 }
 function No(t) {
-  const e = $o(t);
+  const e = So(t);
   if (e)
     return `https://youtube.com/embed/${e}`;
 }
-function So({ src: t }) {
+function Co({ src: t }) {
   return O(() => {
     import("@lottiefiles/lottie-player");
   }, []), /* @__PURE__ */ o("lottie-player", { autoplay: !0, loop: !0, mode: "normal", src: t });
 }
-function Co(t) {
-  return /* @__PURE__ */ o(x, { maxHeight: 400, overflow: "hidden auto", children: /* @__PURE__ */ o(xe, { ...t }) });
+function Po(t) {
+  return /* @__PURE__ */ o(g, { maxHeight: 400, overflow: "hidden auto", children: /* @__PURE__ */ o(be, { ...t }) });
 }
-function Po({ url: t }) {
-  const e = G(null), n = 495, [i, r] = j(
+function Bo({ url: t }) {
+  const e = G(null), n = 495, [i, r] = T(
     e.current ? e.current.offsetWidth * 0.5625 : n
   ), a = E(() => {
     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 : n;
@@ -1868,7 +1893,7 @@ function Po({ url: t }) {
       window.removeEventListener("resize", a);
     };
   }, [i, a]), /* @__PURE__ */ o(
-    x,
+    g,
     {
       component: "iframe",
       ref: e,
@@ -1883,7 +1908,7 @@ function Po({ url: t }) {
     }
   );
 }
-const _n = {
+const $n = {
   image: "https://www.arcblock.io/static/ead0cabde7f2b7ff34db8f3e8ceca271/afc4b/builder.png",
   badge: "Develop · Deploy · Run",
   title: "The Future is Here: Blockchain and Decentralized Application Development",
@@ -1894,11 +1919,11 @@ const _n = {
   actions: void 0,
   hasImage: !0,
   center: !1
-}, Bo = _(Ue)`
+}, Io = _(Me)`
   .section__description {
   }
 `;
-function Io({
+function Wo({
   hasImage: t,
   fullSizeImage: e,
   boxed: n,
@@ -1909,31 +1934,31 @@ function Io({
   section: s,
   ...l
 }) {
-  var u, f;
-  const [{ editing: d }, m] = $({ ...l, boxed: e ? void 0 : n }, D);
-  let p = Wo(m.image, i, e, r, a, c);
-  t || (p = null);
+  var p, x;
+  const [{ editing: d }, m] = $({ ...l, boxed: e ? void 0 : n }, U);
+  let u = Ro(m.image, i, e, r, a, c);
+  t || (u = null);
   let h = null;
-  return m.actions && (h = (f = (u = m.actions) == null ? void 0 : u.map) == null ? void 0 : f.call(u, (y, g) => /* @__PURE__ */ o(Et, { ...y, editing: d }, g))), /* @__PURE__ */ o(
-    Bo,
+  return m.actions && (h = (x = (p = m.actions) == null ? void 0 : p.map) == null ? void 0 : x.call(p, (y, f) => /* @__PURE__ */ o(Ot, { ...y, editing: d }, f))), /* @__PURE__ */ o(
+    Io,
     {
       ...m,
       style: d ? { pointerEvents: "none" } : {},
-      image: p,
+      image: u,
       fullSizeImage: t && e,
       actions: h
     }
   );
 }
-function Wo(t, e, n, i, r, a) {
+function Ro(t, e, n, i, r, a) {
   if (t) {
     if (t.endsWith(".json"))
-      return /* @__PURE__ */ o(So, { src: t });
+      return /* @__PURE__ */ o(Co, { src: t });
     if (t.indexOf("twitter.com") !== -1)
-      return /* @__PURE__ */ o(Co, { sourceType: "url", url: t });
+      return /* @__PURE__ */ o(Po, { sourceType: "url", url: t });
     const c = No(t);
     if (c)
-      return /* @__PURE__ */ o(Po, { url: c });
+      return /* @__PURE__ */ o(Bo, { url: c });
     const { naturalWidth: s, naturalHeight: l, filename: d } = i || {};
     if (tt(t))
       return /* @__PURE__ */ o(
@@ -1951,16 +1976,16 @@ function Wo(t, e, n, i, r, a) {
             width: "100%",
             height: "100%"
           },
-          poster: z(S(e), n ? 1200 : 540, r),
-          children: /* @__PURE__ */ o("source", { src: S(t), type: Fe(t) })
+          poster: j(N(e), n ? 1200 : 540, r),
+          children: /* @__PURE__ */ o("source", { src: N(t), type: Fe(t) })
         },
         t
       );
     const m = r === "quality" ? 1 : 0.6;
     return /* @__PURE__ */ o(
-      St,
+      Nt,
       {
-        src: S(t),
+        src: N(t),
         sizesAttr: {
           sm: 600 * m,
           md: 450 * m,
@@ -1980,15 +2005,15 @@ function Wo(t, e, n, i, r, a) {
   }
   return null;
 }
-const $n = ["production", "draft"];
+const Sn = ["production", "draft"];
 function Nn({ mode: t, version: e } = {}) {
   const n = e && typeof e == "number" ? { mode: t, version: e } : { mode: t };
   return ot.get(`/api/${nt()}/pages`, { params: n }).then((i) => i.data);
 }
-function Sn({ mode: t, pages: e }) {
+function Cn({ mode: t, pages: e }) {
   return ot.post(`/api/${nt()}/pages/publish`, { mode: t, pages: e }).then((n) => n.data);
 }
-function Ro({
+function To({
   locale: t,
   sort: e,
   page: n,
@@ -1997,55 +2022,55 @@ function Ro({
 } = {}) {
   return ot.get(`/api/${nt()}/pages/toc`, { params: { locale: t, sort: e, page: n, limit: i, mode: r } }).then((a) => a.data);
 }
-const Cn = {
+const Pn = {
   style: "list",
   sort: "-updatedAt"
 }, gt = 20;
 function jo({ style: t, sort: e, section: n, ...i }) {
-  const [{ editing: r, locale: a }, c] = $(i, D), [s, l] = $(c, A), [d, m] = j(), p = G(!1), h = be(), u = ce(), f = E(async () => {
-    if (!p.current) {
-      p.current = !0, h();
+  const [{ editing: r, locale: a }, c] = $(i, U), [s, l] = $(c, F), [d, m] = T(), u = G(!1), h = ye(), p = de(), x = E(async () => {
+    if (!u.current) {
+      u.current = !0, h();
       try {
-        const y = d ? Math.floor(d.list.length / gt) + 1 : 1, { list: g, total: v } = await Ro({ locale: a, sort: e, page: y, limit: gt });
+        const y = d ? Math.floor(d.list.length / gt) + 1 : 1, { list: f, total: v } = await To({ locale: a, sort: e, page: y, limit: gt });
         m((k) => ({
-          list: ((k == null ? void 0 : k.list) ?? []).concat(g),
+          list: ((k == null ? void 0 : k.list) ?? []).concat(f),
           total: v
         }));
       } finally {
-        p.current = !1, h();
+        u.current = !1, h();
       }
     }
   }, [d, a, e, h]);
-  return ye(() => {
-    f();
-  }), /* @__PURE__ */ w(H, { ...l, sx: r ? { pointerEvents: "none" } : {}, children: [
-    Object.keys(s).length > 0 && /* @__PURE__ */ o(F, { ...s }),
+  return we(() => {
+    x();
+  }), /* @__PURE__ */ w(V, { ...l, sx: r ? { pointerEvents: "none" } : {}, children: [
+    Object.keys(s).length > 0 && /* @__PURE__ */ o(A, { ...s }),
     d ? /* @__PURE__ */ w(J, { children: [
       /* @__PURE__ */ o(lt, { container: !0, spacing: 2, justifyContent: "center", children: d == null ? void 0 : d.list.map((y) => /* @__PURE__ */ o(lt, { item: !0, xs: 12, sm: t === "card" ? 6 : 12, md: t === "card" ? 3 : 12, children: /* @__PURE__ */ w(
         zo,
         {
           elevation: 0,
           className: b(t === "card" && "style-card"),
-          onClick: r ? void 0 : () => u(y.slug),
+          onClick: r ? void 0 : () => p(y.slug),
           children: [
             !!y.image && /* @__PURE__ */ o(
-              Mt,
+              Jt,
               {
                 component: "img",
                 alt: "",
-                image: z(S(y.image), 540),
+                image: j(N(y.image), 540),
                 loading: "lazy"
               }
             ),
-            /* @__PURE__ */ w(Jt, { children: [
+            /* @__PURE__ */ w(Gt, { children: [
               /* @__PURE__ */ o(P, { variant: "h6", component: "div", className: xt, children: y.title || y.id }),
               /* @__PURE__ */ o(P, { variant: "body2", className: xt, children: y.description })
             ] })
           ]
         }
       ) }, y.id)) }),
-      /* @__PURE__ */ o(x, { textAlign: "center", mt: 2, children: d.total > d.list.length ? /* @__PURE__ */ o(L, { variant: "outlined", color: "secondary", onClick: f, loading: p.current, children: "More" }) : /* @__PURE__ */ o(L, { variant: "outlined", color: "secondary", disabled: !0, children: "No More" }) })
-    ] }) : /* @__PURE__ */ o(x, { p: 2, textAlign: "center", children: /* @__PURE__ */ o(Yt, { size: 24 }) })
+      /* @__PURE__ */ o(g, { textAlign: "center", mt: 2, children: d.total > d.list.length ? /* @__PURE__ */ o(L, { variant: "outlined", color: "secondary", onClick: x, loading: u.current, children: "More" }) : /* @__PURE__ */ o(L, { variant: "outlined", color: "secondary", disabled: !0, children: "No More" }) })
+    ] }) : /* @__PURE__ */ o(g, { p: 2, textAlign: "center", children: /* @__PURE__ */ o(Yt, { size: 24 }) })
   ] });
 }
 const xt = q`
@@ -2054,7 +2079,7 @@ const xt = q`
   -webkit-line-clamp: 2;
   overflow: hidden;
   text-overflow: ellipsis;
-`, zo = _(Ut)`
+`, zo = _(Mt)`
   border: 1px solid #e0e0e0;
   background-color: transparent;
   cursor: pointer;
@@ -2074,38 +2099,38 @@ const xt = q`
       max-height: 50vw;
     }
   }
-`, To = {
-  iframe: vo,
-  section: Io,
-  "section-card-list": xo,
+`, Lo = {
+  iframe: ko,
+  section: Wo,
+  "section-card-list": bo,
   toc: jo,
-  "ai-runtime": Je,
-  "custom-component": bo
+  "ai-runtime": Ge,
+  "custom-component": yo
 };
-function Pn({ id: t, type: e, mode: n, config: i, section: r, ...a }) {
-  const c = To[e], { getPageMetaStyle: s } = Be(), l = R(() => {
-    const { height: p, ...h } = i;
+function Bn({ id: t, type: e, mode: n, config: i, section: r, ...a }) {
+  const c = Lo[e], { getPageMetaStyle: s } = Ie(), l = R(() => {
+    const { height: u, ...h } = i;
     return h;
   }, [i]), d = R(() => {
-    const p = {};
-    return e !== "custom-component" && (p.height = i.height), p.sx = s("sx"), p;
+    const u = {};
+    return e !== "custom-component" && (u.height = i.height), u.sx = s("sx"), u;
   }, [i.height, e, s]), m = c && /* @__PURE__ */ o(c, { mode: n, ...l, id: t, section: r });
   return /* @__PURE__ */ o(Ye, { ...a, ...d, children: m });
 }
-function Bn(t) {
+function In(t) {
   return t != null;
 }
 export {
-  Et as A,
-  Pn as B,
+  Ot as A,
+  Bn as B,
   jt as I,
-  wn as P,
-  $n as S,
-  Cn as T,
-  yn as a,
-  kn as b,
-  _n as c,
+  vn as P,
+  Sn as S,
+  Pn as T,
+  wn as a,
+  _n as b,
+  $n as c,
   Nn as g,
-  Bn as n,
-  Sn as p
+  In as n,
+  Cn as p
 };