@arcblock/ux 3.0.5 → 3.0.7

package/lib/UserCard/components.js

@@ -1,25 +1,25 @@
 import { jsx as a } from "react/jsx-runtime";
-import { Box as o, Avatar as f } from "@mui/material";
-import p from "../Avatar/index.js";
-import { createNameOnlyAvatar as u } from "./utils.js";
-const _ = (r, t = 48, n = void 0, e = void 0, s = !1) => {
-  const c = (i) => {
-    e == null || e(r, i);
+import { Avatar as f, Box as l } from "@mui/material";
+import p from "../Avatar";
+import { createNameOnlyAvatar as x } from "./utils";
+const _ = (t, r = 48, s = void 0, e = void 0, c = !1) => {
+  const n = (i) => {
+    e == null || e(t, i);
   };
-  if (!r.avatar) {
-    const i = u(r), { className: d, style: l, alt: m } = n || {};
+  if (!t.avatar) {
+    const i = x(t), { className: d, style: o, alt: m } = s || {};
     return /* @__PURE__ */ a(
       f,
       {
-        onClick: c,
+        onClick: n,
         className: d,
-        style: l,
+        style: o,
         alt: m,
         sx: {
-          width: t,
-          height: t,
-          fontSize: t * 0.4,
-          cursor: s || e ? "pointer" : "default"
+          width: r,
+          height: r,
+          fontSize: r * 0.4,
+          cursor: c || e ? "pointer" : "default"
         },
         variant: "circular",
         children: i
@@ -27,7 +27,7 @@ const _ = (r, t = 48, n = void 0, e = void 0, s = !1) => {
     );
   }
   return /* @__PURE__ */ a(
-    o,
+    l,
     {
       className: "user-card__avatar",
       sx: {
@@ -36,21 +36,21 @@ const _ = (r, t = 48, n = void 0, e = void 0, s = !1) => {
       children: /* @__PURE__ */ a(
         p,
         {
-          size: t,
-          did: r.did,
+          size: r,
+          did: t.did,
           variant: "circle",
           style: {
-            cursor: s || e ? "pointer" : "default"
+            cursor: c || e ? "pointer" : "default"
           },
-          onClick: c,
-          src: r.avatar,
-          alt: r.fullName || "",
-          ...n || {}
+          onClick: n,
+          src: t.avatar,
+          alt: t.fullName || "",
+          ...s || {}
         }
       )
     }
   );
-}, g = (r, t = 120) => r ? /* @__PURE__ */ a(o, { sx: { maxWidth: t }, className: "user-card__top-right-content", children: r() }) : null;
+}, g = (t, r = 120) => t ? /* @__PURE__ */ a(l, { sx: { maxWidth: r }, className: "user-card__top-right-content", children: t() }) : null;
 export {
   _ as renderAvatar,
   g as renderTopRight

package/lib/UserCard/index.js

@@ -1,12 +1,12 @@
 import { jsx as t } from "react/jsx-runtime";
 import { useRef as c, useState as h, useEffect as C } from "react";
-import { CardType as i } from "./types.js";
-import v from "./Cards/avatar-only.js";
-import f from "./Cards/index.js";
-import y from "./Container/dialog.js";
-import A from "./Container/card.js";
-import D from "../Avatar/index.js";
-import { isUserDid as P, getUserByDid as S } from "./utils.js";
+import { CardType as i } from "./types";
+import v from "./Cards/avatar-only";
+import u from "./Cards";
+import y from "./Container/dialog";
+import A from "./Container/card";
+import D from "../Avatar";
+import { isUserDid as P, getUserByDid as S } from "./utils";
 function L(e) {
   if (!e) return null;
   let r = "";
@@ -15,16 +15,16 @@ function L(e) {
 function g(e) {
   const { cardType: r = i.Detailed, showHoverCard: d } = e, n = d !== void 0 ? d : r === i.AvatarOnly, m = c(null), [a, o] = h(() => e.user || null);
   if (C(() => {
-    let u = !0;
+    let f = !0;
     return e.user ? o(e.user) : e.did && P(e.did) && !e.user && S(e.did).then((s) => {
-      u && o(s || { fullName: "Anonymous", did: e.did, avatar: "" });
+      f && o(s || { fullName: "Anonymous", did: e.did, avatar: "" });
     }), () => {
-      u = !1;
+      f = !1;
     };
   }, [e.did, e.user]), !a)
     return /* @__PURE__ */ t(D, { did: e.did, size: e.avatarSize, ...e.avatarProps });
   const l = () => /* @__PURE__ */ t(y, { sx: e.popupSx, children: /* @__PURE__ */ t(
-    f,
+    u,
     {
       ...e,
       shouldShowHoverCard: !1,
@@ -47,7 +47,7 @@ function g(e) {
       user: a
     }
   ) : /* @__PURE__ */ t(A, { containerRef: m, cardType: r, sx: e.sx, children: /* @__PURE__ */ t(
-    f,
+    u,
     {
       ...e,
       shouldShowHoverCard: n,

package/lib/Util/index.js

@@ -14,8 +14,8 @@ import O from "dayjs/plugin/timezone";
 import R from "dayjs/plugin/relativeTime";
 import W from "dayjs/plugin/updateLocale";
 import L from "dayjs/plugin/localizedFormat";
-import { DID_PREFIX as P, BLOCKLET_SERVICE_PATH_PREFIX as v } from "./constant.js";
-import { getFederatedEnabled as C } from "./federated.js";
+import { DID_PREFIX as P, BLOCKLET_SERVICE_PATH_PREFIX as v } from "./constant";
+import { getFederatedEnabled as C } from "./federated";
 let f = null;
 const V = /^(\d{1,3}\.){3}\d{1,3}(:\d+)?$/, _ = /* @__PURE__ */ new Set(["co", "com", "net", "org", "gov", "edu", "ac"]), M = /* @__PURE__ */ new Set(["uk", "au", "cn", "nz", "za", "in", "br", "mx", "fr", "it", "ca"]);
 function z(e) {

package/lib/VerificationCode/index.js

@@ -3,14 +3,14 @@ import { useEffect as c } from "react";
 import { Box as l, TextField as y } from "@mui/material";
 import n from "lodash/trim";
 import a from "lodash/noop";
-import { mergeSx as b } from "../Util/style.js";
+import { mergeSx as b } from "../Util/style";
 const d = 6;
 function j({
   length: i = d,
   code: e,
   onChange: u = a,
   onComplete: p = a,
-  sx: s
+  sx: s = {}
 }) {
   return c(() => {
     e.length === i && (p == null || p(e));

package/lib/Video/index.js

@@ -3,8 +3,8 @@ import { useState as u } from "react";
 import h from "react-player";
 import { CircularProgress as m } from "@mui/material";
 import l from "lodash/isUndefined";
-import { mergeProps as g } from "../Util/index.js";
-import { styled as b } from "../Theme/index.js";
+import { mergeProps as g } from "../Util";
+import { styled as b } from "../Theme";
 function x(p) {
   const e = Object.assign({}, p);
   l(e.width) && (e.width = 640), l(e.height) && (e.height = 400), l(e.style) && (e.style = {});

package/lib/Wallet/Action.js

@@ -2,10 +2,10 @@ import { jsx as l, jsxs as o } from "react/jsx-runtime";
 import { Typography as g } from "@mui/material";
 import i from "lodash/isUndefined";
 import x from "./images/abtwallet.png";
-import { mergeProps as y } from "../Util/index.js";
-import c from "../Colors/themes/default.js";
-import _ from "../Button/index.js";
-import { styled as h } from "../Theme/index.js";
+import { mergeProps as y } from "../Util";
+import c from "../Colors";
+import _ from "../Button";
+import { styled as h } from "../Theme";
 function u(t) {
   const e = Object.assign({}, t);
   i(e.action) && (e.action = "Login"), i(e.textLayout) && (e.textLayout = "vertical"), i(e.size) && (e.size = "medium"), i(e.style) && (e.style = {});

package/lib/Wallet/Download.js

@@ -2,12 +2,12 @@ import { jsxs as r, jsx as e } from "react/jsx-runtime";
 import g from "@arcblock/react-hooks/lib/useBrowser";
 import { Typography as f } from "@mui/material";
 import a from "lodash/isUndefined";
-import v from "./images/app-store.svg.js";
-import b from "./images/google-play.svg.js";
-import L from "./images/android_download.svg.js";
-import i from "../Button/index.js";
-import { mergeProps as k } from "../Util/index.js";
-import { styled as x } from "../Theme/index.js";
+import v from "./images/app-store.svg";
+import b from "./images/google-play.svg";
+import L from "./images/android_download.svg";
+import i from "../Button";
+import { mergeProps as k } from "../Util";
+import { styled as x } from "../Theme";
 function D(t) {
   const l = g(), o = Object.assign({}, t);
   a(o.title) && (o.title = "Download DID Wallet"), a(o.layout) && (o.layout = "vertical"), a(o.storeLayout) && (o.storeLayout = "horizontal"), a(o.locale) && (o.locale = "zh"), a(o.iosLink) && (o.iosLink = "https://itunes.apple.com/app/id1460083542"), a(o.androidLink) && (o.androidLink = "https://play.google.com/store/apps/details?id=com.arcblock.wallet.app.product"), a(o.androidDownLoadUrl) && (o.androidDownLoadUrl = "https://releases.arcblockio.cn/arcwallet_android/latest/abtwallet.apk"), a(o.style) && (o.style = {});

package/lib/Wallet/Open.js

@@ -1,7 +1,7 @@
 import { jsx as l } from "react/jsx-runtime";
 import a from "@arcblock/react-hooks/lib/useBrowser";
 import { Fab as i } from "@mui/material";
-import { styled as s } from "../Theme/index.js";
+import { styled as s } from "../Theme";
 function c({ link: e, locale: n = "zh" }) {
   const o = n === "zh" ? "在 DID Wallet 打开" : "Open in DID Wallet", t = a();
   if (t.mobile.any && !(t.wallet || t.arcSphere) && !t.wechat) {

package/lib/WalletOSIcon/index.d.ts

@@ -1,7 +1,7 @@
 export interface WalletOSIconProps {
     loading?: false | true;
-    walletOS?: string;
+    walletOS: string;
     provider?: string;
     color?: string;
 }
-export default function WalletOSIcon({ loading, walletOS, provider, color }: WalletOSIconProps): import("react/jsx-runtime").JSX.Element | null;
+export default function WalletOSIcon({ loading, walletOS, provider, color, }: WalletOSIconProps): import("react/jsx-runtime").JSX.Element | null;

package/lib/WalletOSIcon/index.js

@@ -6,9 +6,14 @@ import s from "@iconify-icons/material-symbols/language";
 import a from "@iconify-icons/material-symbols/android";
 import c from "@iconify-icons/material-symbols/question-mark-rounded";
 import u from "@iconify-icons/material-symbols/mail-outline-rounded";
-import { LOGIN_PROVIDER as p } from "../Util/constant.js";
-function x({ loading: t = !1, walletOS: i, provider: e, color: n = "black" }) {
-  return t ? /* @__PURE__ */ r(o, { icon: c, style: { color: "transparent" } }) : e === p.AUTH0 ? /* @__PURE__ */ r(o, { icon: u, style: { color: n, transform: "scale(0.85)" } }) : i === "ios" ? /* @__PURE__ */ r(o, { icon: f, style: { color: n, transform: "scale(1.1)" } }) : i === "android" ? /* @__PURE__ */ r(o, { icon: a, style: { color: n } }) : i === "web" ? /* @__PURE__ */ r(o, { icon: s, style: { color: n } }) : i === "api" ? /* @__PURE__ */ r(o, { icon: m, style: { color: n, transform: "scale(1.05)" } }) : null;
+import { LOGIN_PROVIDER as p } from "../Util/constant";
+function x({
+  loading: i = !1,
+  walletOS: t,
+  provider: e = "wallet",
+  color: n = "black"
+}) {
+  return i ? /* @__PURE__ */ r(o, { icon: c, style: { color: "transparent" } }) : e === p.AUTH0 ? /* @__PURE__ */ r(o, { icon: u, style: { color: n, transform: "scale(0.85)" } }) : t === "ios" ? /* @__PURE__ */ r(o, { icon: f, style: { color: n, transform: "scale(1.1)" } }) : t === "android" ? /* @__PURE__ */ r(o, { icon: a, style: { color: n } }) : t === "web" ? /* @__PURE__ */ r(o, { icon: s, style: { color: n } }) : t === "api" ? /* @__PURE__ */ r(o, { icon: m, style: { color: n, transform: "scale(1.05)" } }) : null;
 }
 export {
   x as default

package/lib/WebWalletSWKeeper/index.d.ts

@@ -2,7 +2,9 @@ interface WebWalletSWKeeperProps {
     webWalletUrl: string;
     maxIdleTime: number;
 }
-declare function WebWalletSWKeeper({ webWalletUrl, maxIdleTime }: WebWalletSWKeeperProps): null;
+declare function WebWalletSWKeeper({ webWalletUrl, maxIdleTime, }: WebWalletSWKeeperProps & {
+    maxIdleTime?: number;
+}): null;
 export declare const withWebWalletSWKeeper: <P extends {
     webWalletUrl: string;
 }>(Component: React.ComponentType<P>) => ({ webWalletUrl, maxIdleTime, ...rest }: WebWalletSWKeeperProps & P) => import("react/jsx-runtime").JSX.Element;

package/lib/WebWalletSWKeeper/index.js

@@ -3,8 +3,8 @@ import { useRef as b, useEffect as l } from "react";
 import E from "react-use/lib/useIdle";
 import { useLocalStorageState as W } from "ahooks";
 import h from "@arcblock/react-hooks/lib/useBrowser";
-import { getWebWalletUrl as y, checkSameProtocol as S } from "../Util/wallet.js";
-import { detectWalletExtension as w } from "../Util/index.js";
+import { getWebWalletUrl as y, checkSameProtocol as S } from "../Util/wallet";
+import { detectWalletExtension as w } from "../Util";
 const I = 1e3 * 60 * 30, x = "wallet_sw_keeper_disabled";
 let s;
 const g = (t) => {
@@ -18,7 +18,10 @@ const g = (t) => {
 }, A = (t) => {
   s || (s = `web_wallet_sw_keeper_${Date.now()}`, g(t));
 };
-function K({ webWalletUrl: t, maxIdleTime: e = I }) {
+function K({
+  webWalletUrl: t,
+  maxIdleTime: e = I
+}) {
   const o = b(!!s), n = E(e), r = () => {
     o.current || k();
   };

package/lib/WechatPrompt/index.js

@@ -3,7 +3,7 @@ import { Dialog as a, Typography as r } from "@mui/material";
 import l from "@arcblock/react-hooks/lib/useBrowser";
 import n from "./images/ios.png";
 import o from "./images/android.png";
-import { styled as s } from "../Theme/index.js";
+import { styled as s } from "../Theme";
 function u() {
   const i = l();
   return !i.mobile.any || !i.wechat ? null : i.android ? /* @__PURE__ */ e(a, { open: !0, fullScreen: !0, children: /* @__PURE__ */ t(c, { children: [

package/lib/global.d.ts

@@ -0,0 +1,28 @@
+declare module '@arcblock/did-motif';
+declare module 'd3-geo';
+declare module 'topojson-client';
+declare module 'versor';
+declare module 'axios/*';
+
+// ux svg 由 babel-plugin-inline-react-svg 处理
+declare module '*.svg?react' {
+  import React from 'react';
+  const SVG: React.FC<React.SVGProps<SVGSVGElement>>;
+  export default SVG;
+}
+
+declare module '*.png' {
+  export default string;
+}
+
+type Blocklet = import('./type').Blocklet;
+
+interface Window {
+  blocklet?: Blocklet;
+  env?: Blocklet;
+}
+
+declare module globalThis {
+  var blocklet: Blocklet;
+  var env: Blocklet;
+}

package/lib/hooks/use-blocklet-logo.js

@@ -1,23 +1,21 @@
-import { useCreation as l } from "ahooks";
-import { useTheme as u } from "@mui/material";
-import "../Theme/theme.js";
-import "../Theme/theme-provider.js";
-import f from "./use-mobile.js";
-function d({
-  key: L = "sm",
-  meta: p = {},
+import { useCreation as L } from "ahooks";
+import { useTheme as f } from "../Theme";
+import m from "./use-mobile";
+function M({
+  key: i = "sm",
+  meta: n = {},
   theme: t = {},
-  square: n
+  square: p
 } = {}) {
-  const c = f({ key: L }), a = u(), e = l(() => {
+  const c = m({ key: i }), a = f(), e = L(() => {
     var o;
     return ((o = t == null ? void 0 : t.palette) == null ? void 0 : o.mode) || a.palette.mode;
   }, [a, t]);
-  return l(() => {
-    const { appLogo: o, appLogoDark: s, appLogoRect: r, appLogoRectDark: m } = Object.assign({}, window.blocklet ?? {}, p), g = e === "dark", i = (g ? s : o) || o;
-    return c || n ? i : (g ? m || s : r) || r || i || "";
-  }, [e, p, c, n]);
+  return L(() => {
+    const { appLogo: o, appLogoDark: s, appLogoRect: g, appLogoRectDark: u } = Object.assign({}, window.blocklet ?? {}, n), l = e === "dark", r = (l ? s : o) || o;
+    return c || p ? r : (l ? u || s : g) || g || r || "";
+  }, [e, n, c, p]);
 }
 export {
-  d as default
+  M as default
 };

package/lib/hooks/use-clock.js

@@ -5,7 +5,7 @@ import T from "dayjs/plugin/timezone";
 import z from "dayjs/plugin/localizedFormat";
 import "dayjs/locale/zh-cn";
 import "dayjs/locale/en";
-import { formatToDatetime as I } from "../Util/index.js";
+import { formatToDatetime as I } from "../Util";
 e.extend(h);
 e.extend(T);
 e.extend(z);

package/lib/index.js

@@ -1,81 +1,76 @@
-import { default as s } from "./ActionButton/index.js";
-import { default as x } from "./ActivityIndicator/index.js";
-import { default as i } from "./Address/index.js";
-import { default as c } from "./Alert/index.js";
-import { default as A } from "./AnimationWaiter/index.js";
-import { default as W } from "./Async/index.js";
-import { default as C } from "./Avatar/index.js";
-import { default as w } from "./Badge/index.js";
-import { default as b } from "./Button/index.js";
-import { default as v } from "./ClickToCopy/index.js";
-import { default as I } from "./CodeBlock/index.js";
-import { default as S } from "./ContactForm/index.js";
-import { default as E } from "./CountDown/index.js";
-import { default as M } from "./Earth/index.js";
-import { default as R } from "./Footer/index.js";
-import { default as V } from "./Icon/index.js";
-import { default as j } from "./Locale/selector.js";
-import { default as z } from "./Logo/index.js";
-import { default as H } from "./RelativeTime/index.js";
-import { default as N } from "./SessionUser/index.js";
-import { default as Q } from "./Datatable/index.js";
-import { default as Y } from "./Dialog/dialog.js";
-import "./Dialog/confirm.js";
-import "react/jsx-runtime";
-import "react";
-import "ahooks";
-import "lodash/noop";
-import { default as _ } from "./DidLogo/index.js";
-import { default as to } from "./Tabs/index.js";
-import { default as ao } from "./Tag/index.js";
-import { default as fo } from "./TextCollapse/index.js";
-import * as f from "./Theme/index.js";
-import { default as mo } from "./Toast/index.js";
-import * as l from "./Util/index.js";
-import { default as so } from "./Video/index.js";
-import { default as uo } from "./WebWalletSWKeeper/index.js";
-import { default as no } from "./Wallet/Action.js";
-import { default as To } from "./Wallet/Download.js";
-import { default as go } from "./WechatPrompt/index.js";
-import { default as ho } from "./withTheme/index.js";
-import { default as Do } from "./withTracker/index.js";
-import { default as Bo } from "./Img/index.js";
+import { default as r } from "./ActionButton";
+import { default as l } from "./ActivityIndicator";
+import { default as s } from "./Address";
+import { default as p } from "./Alert";
+import { default as x } from "./AnimationWaiter";
+import { default as n } from "./Async";
+import { default as T } from "./Avatar";
+import { default as g } from "./Badge";
+import { default as h } from "./Button";
+import { default as D } from "./ClickToCopy";
+import { default as B } from "./CodeBlock";
+import { default as k } from "./ContactForm";
+import { default as y } from "./CountDown";
+import { default as L } from "./Earth";
+import { default as F } from "./Footer";
+import { default as K } from "./Icon";
+import { default as P } from "./Locale/selector";
+import { default as U } from "./Logo";
+import { default as j } from "./RelativeTime";
+import { default as z } from "./SessionManager";
+import { default as H } from "./Datatable";
+import { default as N } from "./Dialog";
+import { default as Q } from "./DidLogo";
+import { default as Y } from "./Tabs";
+import { default as _ } from "./Tag";
+import { default as oo } from "./TextCollapse";
+import * as o from "./Theme";
+import { default as eo } from "./Toast";
+import * as t from "./Util";
+import { default as ro } from "./Video";
+import { default as lo } from "./WebWalletSWKeeper";
+import { default as so } from "./Wallet/Action";
+import { default as uo } from "./Wallet/Download";
+import { default as io } from "./WechatPrompt";
+import { default as co } from "./withTheme";
+import { default as Ao } from "./withTracker";
+import { default as Wo } from "./Img";
 export {
-  s as ActionButton,
-  x as ActivityIndicator,
-  i as Address,
-  c as Alert,
-  A as AnimationWaiter,
-  W as Async,
-  C as Avatar,
-  w as Badge,
-  b as Button,
-  v as ClickToCopy,
-  I as CodeBlock,
-  S as ContactForm,
-  E as CountDown,
-  Q as Datatable,
-  Y as Dialog,
-  _ as DidLogo,
-  M as Earth,
-  R as Footer,
-  V as Icon,
-  Bo as Img,
-  j as LocaleSelector,
-  z as Logo,
-  H as RelativeTime,
-  N as SessionManager,
-  to as Tabs,
-  ao as Tag,
-  fo as TextCollapse,
-  f as Theme,
-  mo as Toast,
-  l as Util,
-  so as Video,
-  no as WalletAction,
-  To as WalletDownload,
-  uo as WebWalletSWKeeper,
-  go as WechatPrompt,
-  ho as withTheme,
-  Do as withTracker
+  r as ActionButton,
+  l as ActivityIndicator,
+  s as Address,
+  p as Alert,
+  x as AnimationWaiter,
+  n as Async,
+  T as Avatar,
+  g as Badge,
+  h as Button,
+  D as ClickToCopy,
+  B as CodeBlock,
+  k as ContactForm,
+  y as CountDown,
+  H as Datatable,
+  N as Dialog,
+  Q as DidLogo,
+  L as Earth,
+  F as Footer,
+  K as Icon,
+  Wo as Img,
+  P as LocaleSelector,
+  U as Logo,
+  j as RelativeTime,
+  z as SessionManager,
+  Y as Tabs,
+  _ as Tag,
+  oo as TextCollapse,
+  o as Theme,
+  eo as Toast,
+  t as Util,
+  ro as Video,
+  so as WalletAction,
+  uo as WalletDownload,
+  lo as WebWalletSWKeeper,
+  io as WechatPrompt,
+  co as withTheme,
+  Ao as withTracker
 };

package/lib/type.d.ts

@@ -0,0 +1,44 @@
+import type { Theme } from '@mui/material';
+import type { LiteralUnion } from 'type-fest';
+
+export type $TSFixMe = any;
+export type Translations = Record<string, Record<string, any>>;
+export type Locale = LiteralUnion<'en' | 'zh', string>;
+
+// TODO: 以下为 blocklet 应用专属的全局对象类型，可以更加具体
+export type User = Record<string, any>;
+export type Session = Record<string, any>;
+export type Passport = Record<string, any>;
+export type Blocklet = {
+  appId: string;
+  appIds: string[];
+  appPid: string;
+  appName: string;
+  appDescription: string;
+  appLogo: string;
+  appLogoRect: string;
+  appUrl: string;
+  isComponent: boolean;
+  prefix: string;
+  groupPrefix: string;
+  pageGroup: string;
+  version: string;
+  mode: string;
+  tenantMode: 'single' | 'multiple';
+  theme: {
+    prefer?: 'light' | 'dark' | 'system';
+    light: Theme;
+    dark: Theme;
+  };
+  navigation: $TSFixMe[];
+  preferences: Record<string, any>;
+  languages: {
+    code: string;
+    name: string;
+  }[];
+  passportColor: string;
+  componentMountPoints: $TSFixMe[];
+  alsoKnownAs: string[];
+  trustedFactories: string[];
+  [x: string]: any;
+};

package/lib/withTheme/index.d.ts

@@ -1,8 +1,9 @@
-import { Breakpoint, PaletteMode, PaletteOptions, TypographyOptions } from '@mui/material';
+import { Breakpoint, PaletteMode, PaletteOptions } from '@mui/material';
+import { TypographyStyleOptions } from '@mui/material/styles/createTypography';
 declare function withTheme<P extends object>(Component: React.ComponentType<P>, { mode, pageWidth, palette, typography, }?: {
     mode?: PaletteMode;
     pageWidth?: Breakpoint;
     palette?: PaletteOptions;
-    typography?: TypographyOptions;
+    typography?: TypographyStyleOptions;
 }): (props: P) => import("react/jsx-runtime").JSX.Element;
 export default withTheme;

package/lib/withTheme/index.js

@@ -1,18 +1,17 @@
-import { jsxs as c, jsx as e } from "react/jsx-runtime";
-import { useEffect as p } from "react";
-import { css as f, Global as h } from "@emotion/react";
-import { CssBaseline as d } from "@mui/material";
-import { createTheme as y } from "../Theme/theme.js";
-import u from "../Theme/theme-provider.js";
+import { jsxs as p, jsx as e } from "react/jsx-runtime";
+import { useEffect as f } from "react";
+import { css as h, Global as d } from "@emotion/react";
+import { CssBaseline as y } from "@mui/material";
+import { createTheme as u, ThemeProvider as g } from "../Theme";
 function S(r, {
   mode: i = "light",
   pageWidth: n = "md",
   palette: s,
   typography: a
 } = {}) {
-  const o = y({ mode: i, pageWidth: n, palette: s, typography: a }), m = f`
+  const o = u({ mode: i, pageWidth: n, palette: s, typography: a }), l = o.typography.color.main, m = h`
     font-family: ${o.typography.fontFamily};
-    color: ${o.typography.color.main};
+    color: ${l};
 
     a,
     a:hover,
@@ -43,14 +42,14 @@ function S(r, {
       }
     }
   `;
-  return function(l) {
-    return p(() => {
+  return function(c) {
+    return f(() => {
       const t = document.querySelector("#jss-server-side");
       t && t.parentNode && t.parentNode.removeChild(t);
-    }, []), /* @__PURE__ */ c(u, { theme: o, children: [
-      /* @__PURE__ */ e(d, {}),
-      /* @__PURE__ */ e(h, { styles: m }),
-      /* @__PURE__ */ e(r, { ...l })
+    }, []), /* @__PURE__ */ p(g, { theme: o, children: [
+      /* @__PURE__ */ e(y, {}),
+      /* @__PURE__ */ e(d, { styles: m }),
+      /* @__PURE__ */ e(r, { ...c })
     ] });
   };
 }