@arcblock/ux 3.0.7 → 3.0.8

package/lib/AnimationWaiter/index.js

@@ -1,10 +1,10 @@
 import { jsxs as b, jsx as o } from "react/jsx-runtime";
 import { useState as l, useRef as $, useEffect as c } from "react";
-import { Skeleton as M } from "@mui/material";
+import { useTheme as M, Skeleton as E } from "@mui/material";
 import n from "prop-types";
-import E from "react-lottie-player";
-import F from "lodash/noop";
-import { styled as P, useTheme as R } from "../Theme";
+import F from "react-lottie-player";
+import P from "lodash/noop";
+import { styled as R } from "../Theme/index.js";
 function W({
   animationData: m = null,
   size: s = 256,
@@ -18,11 +18,11 @@ function W({
   increaseSpeed: x = 0,
   ...I
 }) {
-  const g = R(), [d, N] = l(0), [y, k] = l(h), [w, A] = l(0), [O, S] = l(null), [j, p] = l(!m), C = $((/* @__PURE__ */ new Date()).getTime());
+  const g = M(), [d, N] = l(0), [y, k] = l(h), [w, A] = l(0), [O, S] = l(null), [j, p] = l(!m), C = $((/* @__PURE__ */ new Date()).getTime());
   Array.isArray(r) || (r = [r]), c(() => {
     m || (p(!0), (async () => {
       try {
-        const e = await (g.palette.mode === "dark" ? import("./dark-animation.json") : import("./default-animation.json"));
+        const e = await (g.palette.mode === "dark" ? import("./dark-animation.json.js") : import("./default-animation.json.js"));
         S(e.default || e), p(!1);
       } catch (e) {
         console.error("Failed to load animation:", e), p(!1);
@@ -40,7 +40,7 @@ function W({
     };
   }, [r, f]), c(() => {
     if (!a.length)
-      return F;
+      return P;
     const t = setTimeout(() => {
       let e = d + 1;
       e >= a.length && (e = 0), N(e);
@@ -60,8 +60,8 @@ function W({
     return w === t ? e = "show-message" : w < t && (e = "message-after"), e;
   };
   return /* @__PURE__ */ b(q, { ...I, children: [
-    j ? /* @__PURE__ */ o("div", { style: { width: s, height: s, display: "flex", justifyContent: "center", alignItems: "center" }, children: /* @__PURE__ */ o(M, { variant: "rounded", width: s * 0.4, height: s * 0.4 }) }) : /* @__PURE__ */ o(
-      E,
+    j ? /* @__PURE__ */ o("div", { style: { width: s, height: s, display: "flex", justifyContent: "center", alignItems: "center" }, children: /* @__PURE__ */ o(E, { variant: "rounded", width: s * 0.4, height: s * 0.4 }) }) : /* @__PURE__ */ o(
+      F,
       {
         loop: !0,
         animationData: m || O,
@@ -108,7 +108,7 @@ W.propTypes = {
   maybeDuration: n.number,
   increaseSpeed: n.number
 };
-const q = P("div")`
+const q = R("div")`
   display: flex;
   justify-content: center;
   align-items: center;

package/lib/Async/index.js

@@ -1,7 +1,7 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as e } from "react/jsx-runtime";
 import m from "react";
 import { CircularProgress as p } from "@mui/material";
-function d(e, n = "default", s = !0) {
+function d(r, n = "default", s = !0) {
   class a extends m.Component {
     constructor(t) {
       super(t), this.state = {
@@ -10,11 +10,11 @@ function d(e, n = "default", s = !0) {
       };
     }
     componentDidMount() {
-      e().then((t) => this.setState({ Component: t[n] })).catch((t) => this.setState({ error: `Failed to load async component: ${t.message}` }));
+      r().then((t) => this.setState({ Component: t[n] })).catch((t) => this.setState({ error: `Failed to load async component: ${t.message}` }));
     }
     render() {
       const { Component: t, error: o } = this.state;
-      return o || (t ? /* @__PURE__ */ r(t, { ...this.props }) : s ? /* @__PURE__ */ r(p, { color: "primary" }) : null);
+      return o || (t ? /* @__PURE__ */ e(t, { ...this.props }) : s ? /* @__PURE__ */ e(p, { color: "primary" }) : null);
     }
   }
   return a;

package/lib/Avatar/etherscan-blockies.js

@@ -5,20 +5,20 @@ function g(t) {
   for (let o = 0; o < t.length; o++)
     n[o % 4] = (n[o % 4] << 5) - n[o % 4] + t.charCodeAt(o);
 }
-function i() {
+function h() {
   const t = n[0] ^ n[0] << 11;
   return n[0] = n[1], n[1] = n[2], n[2] = n[3], n[3] = n[3] ^ n[3] >> 19 ^ t ^ t >> 8, (n[3] >>> 0) / (1 << 31 >>> 0);
 }
 function d() {
-  const t = Math.floor(i() * 360), o = `${i() * 60 + 40}%`, e = `${(i() + i() + i() + i()) * 25}%`;
+  const t = Math.floor(h() * 360), o = `${h() * 60 + 40}%`, e = `${(h() + h() + h() + h()) * 25}%`;
   return `hsl(${t},${o},${e})`;
 }
 function w(t) {
-  const o = t, e = t, h = Math.ceil(o / 2), f = o - h, r = [];
-  for (let a = 0; a < e; a++) {
+  const o = t, e = t, a = Math.ceil(o / 2), f = o - a, r = [];
+  for (let i = 0; i < e; i++) {
     let c = [];
-    for (let s = 0; s < h; s++)
-      c[s] = Math.floor(i() * 2.3);
+    for (let s = 0; s < a; s++)
+      c[s] = Math.floor(h() * 2.3);
     const l = c.slice(0, f);
     l.reverse(), c = c.concat(l);
     for (let s = 0; s < c.length; s++)
@@ -26,23 +26,23 @@ function w(t) {
   }
   return r;
 }
-function M(t, o, e, h, f) {
-  const r = document.createElement("canvas"), a = Math.sqrt(t.length);
-  r.width = r.height = a * e;
+function M(t, o, e, a, f) {
+  const r = document.createElement("canvas"), i = Math.sqrt(t.length);
+  r.width = r.height = i * e;
   const c = r.getContext("2d");
-  c.fillStyle = h, c.fillRect(0, 0, r.width, r.height), c.fillStyle = o;
+  c.fillStyle = a, c.fillRect(0, 0, r.width, r.height), c.fillStyle = o;
   for (let l = 0; l < t.length; l++) {
-    const s = Math.floor(l / a), u = l % a;
+    const s = Math.floor(l / i), u = l % i;
     c.fillStyle = t[l] === 1 ? o : f, t[l] && c.fillRect(u * e, s * e, e, e);
   }
   return r;
 }
 function v(t) {
   t = t || {};
-  const o = t.size || 8, e = t.scale || 4, h = t.seed || Math.floor(Math.random() * 10 ** 16).toString(16);
-  g(h);
-  const f = t.color || d(), r = t.bgcolor || d(), a = t.spotcolor || d(), c = w(o);
-  return M(c, f, e, r, a);
+  const o = t.size || 8, e = t.scale || 4, a = t.seed || Math.floor(Math.random() * 10 ** 16).toString(16);
+  g(a);
+  const f = t.color || d(), r = t.bgcolor || d(), i = t.spotcolor || d(), c = w(o);
+  return M(c, f, e, r, i);
 }
 const y = { createIcon: v };
 export {

package/lib/Avatar/index.js

@@ -5,11 +5,11 @@ import { ErrorBoundary as z } from "react-error-boundary";
 import { Shape as D } from "@arcblock/did-motif";
 import { Box as u } from "@mui/material";
 import n from "lodash/isUndefined";
-import m from "../Img";
-import { mergeProps as E, isEthereumDid as R } from "../Util";
-import M from "./did-motif";
-import T from "./etherscan-blockies";
-import { DID_PREFIX as f } from "../Util/constant";
+import m from "../Img/index.js";
+import { mergeProps as E, isEthereumDid as R } from "../Util/index.js";
+import M from "./did-motif.js";
+import T from "./etherscan-blockies.js";
+import { DID_PREFIX as f } from "../Util/constant.js";
 function d({ ...s }) {
   const r = Object.assign({}, s);
   n(r.did) && (r.did = ""), n(r.size) && (r.size = 36), n(r.variant) && (r.variant = "default"), n(r.animation) && (r.animation = !1), n(r.shape) && (r.shape = ""), n(r.blockiesPadding) && (r.blockiesPadding = !0), n(r.responsive) && (r.responsive = !1);

package/lib/Badge/index.js

@@ -2,10 +2,10 @@ import { jsx as c } from "react/jsx-runtime";
 import r from "prop-types";
 import { Typography as u } from "@mui/material";
 import n from "lodash/isUndefined";
-import o from "../Colors";
-import { mergeProps as b } from "../Util";
-import { withDeprecated as w } from "../Util/deprecate";
-import { styled as x } from "../Theme";
+import o from "../Colors/themes/default.js";
+import { mergeProps as b } from "../Util/index.js";
+import { withDeprecated as w } from "../Util/deprecate.js";
+import { styled as x } from "../Theme/index.js";
 const s = {
   error: {
     color: o.common.white,

package/lib/Blocklet/blocklet.js

@@ -1,13 +1,13 @@
 import { jsx as o, jsxs as r } from "react/jsx-runtime";
 import { isValidElement as f } from "react";
 import t from "prop-types";
-import { useMediaQuery as S, Typography as n, CircularProgress as C } from "@mui/material";
-import I from "../Avatar";
-import P from "../Button";
-import A from "../Img";
-import { styled as B, useTheme as D } from "../Theme";
-import { strippedString as g } from "./utils";
-const F = B("div")`
+import { useTheme as C, useMediaQuery as S, Typography as n, CircularProgress as I } from "@mui/material";
+import B from "../Avatar/index.js";
+import P from "../Button/index.js";
+import A from "../Img/index.js";
+import { styled as D } from "../Theme/index.js";
+import { strippedString as g } from "./utils.js";
+const F = D("div")`
   &.arcblock-blocklet {
     padding: ${(e) => e.theme.spacing(2)} ${(e) => e.theme.spacing(2)} 0
       ${(e) => e.theme.spacing(2)};
@@ -135,9 +135,9 @@ function H({
 }) {
   const h = (k, M = () => !1) => (i, ...T) => {
     M() ? (i.preventDefault(), i.stopPropagation()) : k instanceof Function && (i.preventDefault(), i.stopPropagation(), k(...T));
-  }, w = h(b, () => !!(m || d || a)), y = D(), $ = S(y.breakpoints.up("sm")), N = h(v), z = $ ? 80 : 64;
+  }, w = h(b, () => !!(m || d || a)), y = C(), $ = S(y.breakpoints.up("sm")), N = h(v), z = $ ? 80 : 64;
   return /* @__PURE__ */ o(F, { className: `${_} arcblock-blocklet`, ...x, children: /* @__PURE__ */ r("div", { className: "arcblock-blocklet__content", onClick: N, children: [
-    s ? /* @__PURE__ */ o("div", { className: "arcblock-blocklet__cover", children: /* @__PURE__ */ o(A, { src: s }) }) : c && /* @__PURE__ */ o("div", { className: "arcblock-blocklet__cover", children: /* @__PURE__ */ o(I, { did: c, size: z }) }),
+    s ? /* @__PURE__ */ o("div", { className: "arcblock-blocklet__cover", children: /* @__PURE__ */ o(A, { src: s }) }) : c && /* @__PURE__ */ o("div", { className: "arcblock-blocklet__cover", children: /* @__PURE__ */ o(B, { did: c, size: z }) }),
     /* @__PURE__ */ r("div", { className: "arcblock-blocklet__info", children: [
       /* @__PURE__ */ r("div", { className: "arcblock-blocklet__text", children: [
         f(e) ? /* @__PURE__ */ o(n, { component: "h3", variant: "h3", className: "arcblock-blocklet__title", children: e }) : /* @__PURE__ */ o(
@@ -186,7 +186,7 @@ function H({
                   textAlign: "center"
                 },
                 children: [
-                  a && /* @__PURE__ */ o(C, { size: 15, style: { marginRight: 3, color: "inherit" } }),
+                  a && /* @__PURE__ */ o(I, { size: 15, style: { marginRight: 3, color: "inherit" } }),
                   u
                 ]
               }

package/lib/Blocklet/index.js

@@ -1,8 +1,7 @@
-import { default as f, strippedString as p } from "./utils";
-import "./blocklet";
-import { default as l } from "./blocklet";
+import { default as p, strippedString as a } from "./utils.js";
+import o from "./blocklet.js";
 export {
-  f as ActionButton,
-  l as default,
-  p as strippedString
+  p as ActionButton,
+  o as default,
+  a as strippedString
 };

package/lib/Blocklet/utils.js

@@ -1,4 +1,4 @@
-import { styled as o } from "../Theme";
+import { styled as o } from "../Theme/index.js";
 const e = o("div")`
   background-color: transparent !important;
   & > :not(.Mui-disabled) {

package/lib/BlockletContext/index.js

@@ -1,7 +1,7 @@
 import { jsx as B } from "react/jsx-runtime";
 import { useMemoizedFn as d, useAsyncEffect as h } from "ahooks";
 import { createContext as D, useState as c, use as p } from "react";
-import { getBlockletData as r, getFederatedEnabled as w, getMaster as b } from "../Util/federated";
+import { getBlockletData as r, getFederatedEnabled as w, getMaster as b } from "../Util/federated.js";
 const s = D({
   blocklet: null,
   masterBlocklet: null

package/lib/BlockletNFT/index.js

@@ -1,13 +1,13 @@
 import { jsxs as a, jsx as t, Fragment as F } from "react/jsx-runtime";
 import { useRef as I } from "react";
 import o from "prop-types";
-import { useMediaQuery as m, Typography as f, Portal as q, CircularProgress as A } from "@mui/material";
-import O from "../Avatar";
-import Z from "../Icon";
-import H from "../Button";
-import Q from "../Img";
-import { styled as U, useTheme as W } from "../Theme";
-function E(e, s = 1) {
+import { useTheme as q, useMediaQuery as m, Typography as f, Portal as A, CircularProgress as O } from "@mui/material";
+import W from "../Avatar/index.js";
+import Z from "../Icon/index.js";
+import E from "../Button/index.js";
+import H from "../Img/index.js";
+import { styled as Q } from "../Theme/index.js";
+function U(e, s = 1) {
   let c = e;
   const r = ["", "k", "m", "b"];
   let i = 0;
@@ -15,7 +15,7 @@ function E(e, s = 1) {
     c = (c / 1e3).toFixed(s), i += 1;
   return e && `${c}${r[i]}`;
 }
-const G = U("div")`
+const G = Q("div")`
   &.arcblock-blocklet {
     padding: 0 16px;
     background: ${(e) => e.theme.palette.common.white};
@@ -201,33 +201,33 @@ function J({
   isStickyButton: z = !1,
   onButtonClick: _ = null,
   onMainClick: N = null,
-  className: $ = null,
-  scaleClickZone: C = 1.5,
+  className: C = null,
+  scaleClickZone: $ = 1.5,
   ...M
 }) {
   const x = (l, k = () => !1) => (d, ...j) => {
     k() ? (d.preventDefault(), d.stopPropagation()) : l instanceof Function && (d.preventDefault(), d.stopPropagation(), l(...j));
-  }, S = x(_, () => !!(h || u || b)), T = x(N), p = W(), P = m(p.breakpoints.down("md")), B = m(p.breakpoints.down("lg")), D = m(p.breakpoints.up("lg")), n = i === "auto" ? P ? "xs" : B ? "sm" : "md" : i, R = i === "auto" ? D ? 80 : 40 : i === "md" ? 80 : 40, g = I(null);
+  }, S = x(_, () => !!(h || u || b)), T = x(N), p = q(), B = m(p.breakpoints.down("md")), P = m(p.breakpoints.down("lg")), D = m(p.breakpoints.up("lg")), n = i === "auto" ? B ? "xs" : P ? "sm" : "md" : i, R = i === "auto" ? D ? 80 : 40 : i === "md" ? 80 : 40, g = I(null);
   return /* @__PURE__ */ a(
     G,
     {
       ...M,
-      scaleClickZone: C,
-      className: `${$} arcblock-blocklet arcblock-blocklet--size-${n}`,
+      scaleClickZone: $,
+      className: `${C} arcblock-blocklet arcblock-blocklet--size-${n}`,
       children: [
         /* @__PURE__ */ t("div", { className: "arcblock-blocklet__content", children: /* @__PURE__ */ t("div", { className: "arcblock-blocklet__content--main", onClick: T, ref: g, children: /* @__PURE__ */ a("div", { className: "arcblock-blocklet__content--body", children: [
-          r ? /* @__PURE__ */ t("div", { className: "arcblock-blocklet__cover", children: /* @__PURE__ */ t(Q, { src: r }) }) : s && /* @__PURE__ */ t("div", { className: "arcblock-blocklet__cover", children: /* @__PURE__ */ t(O, { did: s, size: R }) }),
+          r ? /* @__PURE__ */ t("div", { className: "arcblock-blocklet__cover", children: /* @__PURE__ */ t(H, { src: r }) }) : s && /* @__PURE__ */ t("div", { className: "arcblock-blocklet__cover", children: /* @__PURE__ */ t(W, { did: s, size: R }) }),
           /* @__PURE__ */ a("div", { className: "arcblock-blocklet__info", children: [
             /* @__PURE__ */ t(f, { component: "h3", variant: "h3", className: "arcblock-blocklet__title", title: e, children: e }),
             c && /* @__PURE__ */ t(f, { component: "div", variant: "body2", className: "arcblock-blocklet__describe", title: c, children: c }),
-            ["md", "sm", "xs"].includes(n) && /* @__PURE__ */ t(q, { container: g.current, disablePortal: n === "md", children: /* @__PURE__ */ t(
+            ["md", "sm", "xs"].includes(n) && /* @__PURE__ */ t(A, { container: g.current, disablePortal: n === "md", children: /* @__PURE__ */ t(
               "div",
               {
                 className: "arcblock-blocklet__button",
                 onClick: S,
                 style: { display: z ? "block" : "" },
                 children: h || _ && /* @__PURE__ */ a(
-                  H,
+                  E,
                   {
                     className: "arcblock-blocklet__button--hover",
                     variant: "outlined",
@@ -237,7 +237,7 @@ function J({
                     style: n === "md" ? { padding: "3px 20px", fontSize: "14px" } : { padding: "3px 15px", minWidth: "54px", fontSize: "13px" },
                     children: [
                       b && /* @__PURE__ */ t(
-                        A,
+                        O,
                         {
                           size: n === "md" ? 15 : 13,
                           style: { marginRight: 3, color: "inherit" }
@@ -260,7 +260,7 @@ function J({
             title: l.title,
             children: l.empty ? null : /* @__PURE__ */ a(F, { children: [
               /* @__PURE__ */ t(v, { name: l.icon }),
-              l.pretty ? E(l.value) : l.value
+              l.pretty ? U(l.value) : l.value
             ] })
           },
           k

package/lib/BlockletV2/blocklet.js

@@ -1,15 +1,16 @@
 import { jsxs as r, jsx as t } from "react/jsx-runtime";
-import { isValidElement as W } from "react";
-import F from "@iconify-icons/tabler/cloud-download";
+import { isValidElement as S } from "react";
+import E from "@iconify-icons/tabler/cloud-download";
 import { Icon as s } from "@iconify/react";
-import { Verified as O } from "@mui/icons-material";
-import { Card as V, Stack as h, Typography as I, Box as z, CircularProgress as E } from "@mui/material";
-import T from "../Avatar";
-import q from "../Button";
-import { useTheme as G } from "../Theme";
-import d from "./components/icon-text";
-import B from "./components/tooltip-icon";
-import { strippedString as M, formatDownloadCount as J } from "./utils";
+import { Verified as F } from "@mui/icons-material";
+import { useTheme as O, Card as V, Stack as x, Typography as I, Box as z, CircularProgress as q } from "@mui/material";
+import B from "../Avatar/index.js";
+import G from "../Button/index.js";
+import "../Theme/theme.js";
+import "../Theme/theme-provider.js";
+import d from "./components/icon-text.js";
+import T from "./components/tooltip-icon.js";
+import { strippedString as M, formatDownloadCount as J } from "./utils.js";
 function co({ ...A }) {
   const {
     title: e,
@@ -21,9 +22,9 @@ function co({ ...A }) {
     did: u,
     official: l,
     buttonText: R = "Install",
-    buttonDisabled: g,
+    buttonDisabled: y,
     buttonLoading: p,
-    button: y,
+    button: g,
     onButtonClick: k = () => {
     },
     onMainClick: b,
@@ -32,10 +33,10 @@ function co({ ...A }) {
     icons: f,
     status: i,
     ...v
-  } = A, x = G(), w = (o, H = () => !1) => (C, ...N) => {
-    const S = o instanceof Function;
-    (H() || S) && (C.preventDefault(), C.stopPropagation(), S && o(...N));
-  }, _ = b && w(b), j = w(k, () => !!(y || g || p)), c = W(e) ? { children: e } : { title: M(e), dangerouslySetInnerHTML: { __html: e } }, a = W(n) ? { children: n } : { title: M(n), dangerouslySetInnerHTML: { __html: n } };
+  } = A, h = O(), w = (o, H = () => !1) => (C, ...N) => {
+    const W = o instanceof Function;
+    (H() || W) && (C.preventDefault(), C.stopPropagation(), W && o(...N));
+  }, _ = b && w(b), j = w(k, () => !!(g || y || p)), a = S(e) ? { children: e } : { title: M(e), dangerouslySetInnerHTML: { __html: e } }, c = S(n) ? { children: n } : { title: M(n), dangerouslySetInnerHTML: { __html: n } };
   return /* @__PURE__ */ r(
     V,
     {
@@ -45,7 +46,7 @@ function co({ ...A }) {
       sx: { p: { xs: 2, md: 3 }, borderRadius: 1, ...v.sx },
       children: [
         /* @__PURE__ */ r(
-          h,
+          x,
           {
             direction: "row",
             sx: {
@@ -56,12 +57,12 @@ function co({ ...A }) {
               "& > *": { flexShrink: 0 }
             },
             children: [
-              /* @__PURE__ */ t(T, { src: D, did: u, size: 48, variant: "rounded", style: { borderRadius: "8px", overflow: "hidden" } }),
+              /* @__PURE__ */ t(B, { src: D, did: u, size: 48, variant: "rounded", style: { borderRadius: "8px", overflow: "hidden" } }),
               /* @__PURE__ */ t(
                 I,
                 {
                   className: "blocklet-title",
-                  ...c,
+                  ...a,
                   sx: [
                     {
                       fontWeight: "fontWeightMedium",
@@ -73,7 +74,7 @@ function co({ ...A }) {
                       pl: 0.5,
                       "&&": { flexShrink: 1 }
                     },
-                    ...Array.isArray(c.sx) ? c.sx : [c.sx]
+                    ...Array.isArray(a.sx) ? a.sx : [a.sx]
                   ]
                 }
               ),
@@ -88,37 +89,37 @@ function co({ ...A }) {
                     gap: 1
                   },
                   children: [
-                    l && /* @__PURE__ */ t(B, { title: l.tooltip, children: /* @__PURE__ */ t(O, { sx: { color: l.color || "#D97706", fontSize: l.size || 18 } }) }),
-                    f == null ? void 0 : f.map((o) => /* @__PURE__ */ t(B, { title: o.title, children: typeof o.icon == "string" ? /* @__PURE__ */ t(s, { icon: o.icon, style: { color: o.color } }) : o.icon }, o.key))
+                    l && /* @__PURE__ */ t(T, { title: l.tooltip, children: /* @__PURE__ */ t(F, { sx: { color: l.color || "#D97706", fontSize: l.size || 18 } }) }),
+                    f == null ? void 0 : f.map((o) => /* @__PURE__ */ t(T, { title: o.title, children: typeof o.icon == "string" ? /* @__PURE__ */ t(s, { icon: o.icon, style: { color: o.color } }) : o.icon }, o.key))
                   ]
                 }
               ),
               k && /* @__PURE__ */ r(
-                q,
+                G,
                 {
                   variant: "outlined",
                   size: "small",
-                  disabled: g || p,
+                  disabled: y || p,
                   style: {
-                    color: x.palette.text.primary,
-                    borderColor: x.palette.grey[300],
+                    color: h.palette.text.primary,
+                    borderColor: h.palette.grey[300],
                     borderRadius: 8,
                     fontSize: 13,
-                    fontWeight: x.typography.fontWeightMedium
+                    fontWeight: h.typography.fontWeightMedium
                   },
                   onClick: j,
                   children: [
-                    p && /* @__PURE__ */ t(E, { size: 15, style: { marginRight: 3, color: "inherit" } }),
+                    p && /* @__PURE__ */ t(q, { size: 15, style: { marginRight: 3, color: "inherit" } }),
                     R
                   ]
                 }
               ),
-              y
+              g
             ]
           }
         ),
         /* @__PURE__ */ t(
-          h,
+          x,
           {
             sx: {
               py: 2
@@ -128,7 +129,7 @@ function co({ ...A }) {
               {
                 className: "blocklet-description",
                 variant: "body2",
-                ...a,
+                ...c,
                 sx: [
                   {
                     color: "text.secondary",
@@ -140,14 +141,14 @@ function co({ ...A }) {
                     cursor: "default",
                     height: 40
                   },
-                  ...Array.isArray(a.sx) ? a.sx : [a.sx]
+                  ...Array.isArray(c.sx) ? c.sx : [c.sx]
                 ]
               }
             )
           }
         ),
         /* @__PURE__ */ r(
-          h,
+          x,
           {
             direction: "row",
             sx: {
@@ -156,8 +157,8 @@ function co({ ...A }) {
               color: "text.secondary"
             },
             children: [
-              /* @__PURE__ */ t(d, { icon: /* @__PURE__ */ t(T, { src: L, did: u, size: 20, variant: "circle" }), maxWidth: 200, children: P }),
-              /* @__PURE__ */ t(d, { icon: /* @__PURE__ */ t(s, { icon: F }), title: m, children: J(m) }),
+              /* @__PURE__ */ t(d, { icon: /* @__PURE__ */ t(B, { src: L, did: u, size: 20, variant: "circle" }), maxWidth: 200, children: P }),
+              /* @__PURE__ */ t(d, { icon: /* @__PURE__ */ t(s, { icon: E }), title: m, children: J(m) }),
               i == null ? void 0 : i.filter((o) => o.align !== "right").map((o) => /* @__PURE__ */ t(
                 d,
                 {

package/lib/BlockletV2/components/icon-text.js

@@ -1,6 +1,6 @@
 import { jsxs as l, jsx as t } from "react/jsx-runtime";
 import { Stack as n, Typography as p } from "@mui/material";
-import f from "./tooltip-icon";
+import f from "./tooltip-icon.js";
 function u({
   icon: e = null,
   children: o = null,

package/lib/BlockletV2/components/tooltip-icon.js

@@ -1,6 +1,6 @@
 import { jsx as x } from "react/jsx-runtime";
 import { Tooltip as n, tooltipClasses as f } from "@mui/material";
-import { mergeSx as u } from "../../Util/style";
+import { mergeSx as u } from "../../Util/style.js";
 function I({
   title: t,
   sx: c,

package/lib/BlockletV2/index.js

@@ -1,10 +1,9 @@
-import { default as f, strippedString as p } from "./utils";
-import "./blocklet";
-import { default as a } from "./blocklet";
-import { default as m } from "./components/tooltip-icon";
+import { default as p, strippedString as a } from "./utils.js";
+import o from "./blocklet.js";
+import { default as l } from "./components/tooltip-icon.js";
 export {
-  f as ActionButton,
-  m as TooltipIcon,
-  a as default,
-  p as strippedString
+  p as ActionButton,
+  l as TooltipIcon,
+  o as default,
+  a as strippedString
 };

package/lib/BlockletV2/utils.js

@@ -1,4 +1,4 @@
-import { styled as r } from "../Theme";
+import { styled as r } from "../Theme/index.js";
 const i = r("div")`
   background-color: transparent !important;
   & > :not(.Mui-disabled) {

package/lib/Button/index.js

@@ -1,5 +1,5 @@
 import { Button as o } from "@mui/material";
-import t from "./wrap";
+import t from "./wrap.js";
 const n = t(o);
 export {
   n as default

package/lib/Button/wrap.js

@@ -2,8 +2,8 @@ import { jsx as u, jsxs as x } from "react/jsx-runtime";
 import r from "prop-types";
 import i from "lodash/isUndefined";
 import { CircularProgress as j } from "@mui/material";
-import o from "../Colors";
-import { mergeProps as k } from "../Util";
+import o from "../Colors/themes/default.js";
+import { mergeProps as k } from "../Util/index.js";
 const y = {
   did: {
     contained: { backgroundColor: o.did.primary, color: o.common.white },

package/lib/ButtonGroup/index.js

@@ -1,5 +1,5 @@
 import { ButtonGroup as o } from "@mui/material";
-import t from "../Button/wrap";
+import t from "../Button/wrap.js";
 const m = t(o);
 export {
   m as default

package/lib/Center/index.js

@@ -1,5 +1,5 @@
 import { jsx as n } from "react/jsx-runtime";
-import { styled as r } from "../Theme";
+import { styled as r } from "../Theme/index.js";
 function o({
   children: e = null,
   relative: i = "screen"

package/lib/ClickToCopy/copy-button.js

@@ -2,7 +2,7 @@ import { jsx as o } from "react/jsx-runtime";
 import { Tooltip as u } from "@mui/material";
 import { green as y } from "@mui/material/colors";
 import { Check as a, ContentCopy as C } from "@mui/icons-material";
-import d from "./hook";
+import d from "./hook.js";
 function S({
   content: c = "",
   locale: m = "en",

package/lib/ClickToCopy/index.js

@@ -3,11 +3,11 @@ import { useSize as F } from "ahooks";
 import { Tooltip as S } from "@mui/material";
 import t from "lodash/isUndefined";
 import { useSnackbar as U } from "notistack";
-import _ from "./hook";
-import B, { ToastProvider as L } from "../Toast";
-import { mergeProps as O } from "../Util";
-import { styled as s } from "../Theme";
-import { default as X } from "./copy-button";
+import _ from "./hook.js";
+import B, { ToastProvider as L } from "../Toast/index.js";
+import { mergeProps as O } from "../Util/index.js";
+import { styled as s } from "../Theme/index.js";
+import { default as X } from "./copy-button.js";
 const R = s("span")`
   display: inline;
   white-space: pre-wrap;

package/lib/CloseButton/index.js

@@ -3,7 +3,7 @@ import { Box as e } from "@mui/material";
 import { Icon as i } from "@iconify/react";
 import m from "@iconify-icons/material-symbols/close-rounded";
 import s from "lodash/noop";
-import { mergeSx as f } from "../Util/style";
+import { mergeSx as f } from "../Util/style.js";
 function x({
   onClose: r = s,
   sx: t = {},