@blocklet/ui-react 3.1.44 → 3.1.45

package/lib/UserCenter/components/user-center.js

@@ -1,7 +1,7 @@
 import { jsx as r, jsxs as m } from "react/jsx-runtime";
 import { use as we, useMemo as ye, isValidElement as X, cloneElement as Y, Children as ke } from "react";
-import { Box as c, Typography as Ce, CircularProgress as Pe, Divider as Se } from "@mui/material";
-import { useMemoizedFn as k, useCreation as u, useRequest as Z } from "ahooks";
+import { Box as d, Typography as Ce, CircularProgress as Pe, Divider as Se } from "@mui/material";
+import { useMemoizedFn as k, useCreation as c, useRequest as Z } from "ahooks";
 import Me from "p-wait-for";
 import ee from "react-helmet";
 import { SessionContext as De } from "@arcblock/did-connect-react/lib/Session";
@@ -42,7 +42,7 @@ import Ge from "./storage/index.js";
 import Qe from "./nft.js";
 import { UserFollowersProvider as le } from "../../contexts/user-followers.js";
 import Ve from "./fallback.js";
-const T = C(P, "/nfts"), F = C(P, "/settings"), z = C(P, "/did-spaces"), ae = C(P, "/user-followers"), ue = ce(c)(({ theme: v }) => ({
+const T = C(P, "/nfts"), F = C(P, "/settings"), z = C(P, "/did-spaces"), ae = C(P, "/user-followers"), ue = ce(d)(({ theme: v }) => ({
   flex: 1,
   boxSizing: "border-box",
   padding: "0 16px",
@@ -56,7 +56,7 @@ const T = C(P, "/nfts"), F = C(P, "/settings"), z = C(P, "/did-spaces"), ae = C(
   [v.breakpoints.up("md")]: {
     flexDirection: "row"
   }
-})), W = ce(c)(({ theme: v }) => ({
+})), W = ce(d)(({ theme: v }) => ({
   overflow: "hidden",
   flex: "revert",
   [v.breakpoints.up("md")]: {
@@ -84,12 +84,12 @@ function _r({
   // 只显示 profile 页面，用于 ArcSphere 只需要显示 Profile 的内容
   onDestroySelf: me = void 0
 }) {
-  const { locale: h } = Ue(), d = $e({ key: "md" }), p = k((e, t = {}) => Ae(Ne, e, h, "en", t)), o = we(De)?.session, x = u(() => {
+  const { locale: h } = Ue(), l = $e({ key: "md" }), p = k((e, t = {}) => Ae(Ne, e, h, "en", t)), o = we(De)?.session, x = c(() => {
     if (M)
       return M;
     const e = window.location.href, t = Ie(e);
     return t?.did ? Array.isArray(t.did) ? t.did[0] : t.did : o?.user?.did;
-  }, [o?.user?.did, M]), i = u(() => o?.user ? x === o?.user?.did : !1, [x, o?.user?.did]), w = ye(() => je(), []), n = Z(
+  }, [o?.user?.did, M]), i = c(() => o?.user ? x === o?.user?.did : !1, [x, o?.user?.did]), w = ye(() => je(), []), n = Z(
     // eslint-disable-next-line consistent-return
     async () => {
       if (await Me(() => o?.initialized), i)
@@ -107,7 +107,7 @@ function _r({
       loadingDelay: 300
     }
   ), { confirmHolder: H } = We({
-    fullScreen: d,
+    fullScreen: l,
     sx: {
       ".MuiDialog-paper": {
         borderRadius: 1,
@@ -126,14 +126,14 @@ function _r({
         }
       }
     }
-  }), N = u(() => {
+  }), N = c(() => {
     const e = Be(window.blocklet);
     try {
       return Ee(e);
     } catch (t) {
       return console.error("Failed to format blocklet info", t, e), e;
     }
-  }, []), E = u(() => {
+  }, []), E = c(() => {
     const e = {
       label: p("common.nft"),
       protected: !1,
@@ -150,7 +150,7 @@ function _r({
     };
     let f = w ? [e, t] : [e];
     if (i) {
-      const a = [
+      const u = [
         e,
         {
           label: p("common.setting"),
@@ -167,52 +167,52 @@ function _r({
           url: S(z, h)
         }
       ];
-      f = w ? [...a, t] : a;
+      f = w ? [...u, t] : u;
     }
     return f;
-  }, [i, h, w]), l = u(() => {
+  }, [i, h, w]), a = c(() => {
     const e = N?.navigation?.userCenter || [];
-    return (_e(e, h) || []).concat(E).map((a) => {
-      const K = a.value ?? a._rawLink ?? a.link ?? a.url;
+    return (_e(e, h) || []).concat(E).map((u) => {
+      const K = u.value ?? u._rawLink ?? u.link ?? u.url;
       return {
         value: K,
-        label: a.title || a.label,
-        url: a.link || a.url,
+        label: u.title || u.label,
+        url: u.link || u.url,
         protected: g?.data?.[K] ?? !1,
-        isPrivate: a.isPrivate || a.private || (a?._rawLink?.includes("/customer") ?? !1),
+        isPrivate: u.isPrivate || u.private || (u?._rawLink?.includes("/customer") ?? !1),
         // FIXME: HACK: 隐藏 /customer 菜单, 需要一个通用的解决方案，在嵌入的时候就决定是否是私有的
-        followersOnly: a.component === "did-comments"
+        followersOnly: u.component === "did-comments"
         // 是否开启仅粉丝可查看的功能，目前只对 discuss kit 开启
         // icon: x.icon,
       };
-    }).filter((a) => i || !a.isPrivate);
-  }, [N, n.data, g?.data, h, E, i]), s = u(() => l.find((e) => te(e.value) === te(b)), [l]), _ = u(() => {
+    }).filter((u) => i || !u.isPrivate);
+  }, [N, n.data, g?.data, h, E, i]), s = c(() => a.find((e) => te(e.value) === te(b)), [a]), _ = c(() => {
     const e = window.blocklet?.appName, f = [s?.label, p("userCenter.title")].filter(Boolean).join("-");
     return e ? `${f} | ${e}` : f;
   }, [s, p]), he = k((e) => e && (X(e) ? Y(e, {
     ...e.props || {},
-    userCenterTabs: l
+    userCenterTabs: a
   }) : ke.map(e, (t) => X(t) ? Y(t, {
     ...t.props || {},
-    userCenterTabs: l
+    userCenterTabs: a
   }) : t))), xe = k((e) => {
-    const t = l.find((f) => f.value === e);
+    const t = a.find((f) => f.value === e);
     t && (window.location.href = ie(t.url, {
       did: i ? void 0 : x
     }));
-  }), O = u(() => /* @__PURE__ */ r(
+  }), O = c(() => /* @__PURE__ */ r(
     Re,
     {
       user: n.data,
-      settings: { userCenterTabs: l },
+      settings: { userCenterTabs: a },
       onSave: async (e) => e === "privacy" ? (await g.runAsync(), g.data) : (e === "profile" && await o.refresh(), null),
-      isMobile: d,
+      isMobile: l,
       onDestroySelf: me
     }
-  ), [n.data, l, g.data, g.runAsync]), R = u(() => s && s?.value === F, [s]), $ = u(() => s && s?.value === C(P, "/profile") || s?.value === T, [s]), ge = u(() => s && s?.value === z, [s]), be = o.useOAuth(), ve = o.usePasskey(), q = k(() => {
+  ), [n.data, a, g.data, g.runAsync]), R = c(() => s && s?.value === F, [s]), $ = c(() => s && s?.value === C(P, "/profile") || s?.value === T, [s]), ge = c(() => s && s?.value === z, [s]), be = o.useOAuth(), ve = o.usePasskey(), q = k(() => {
     o?.user?.sourceProvider === "passkey" ? ve.switchPassport(o.user) : ["google", "apple", "email", "github"].includes(o?.user?.sourceProvider ?? "") ? be.switchOAuthPassport(o.user) : o && o.switchPassport();
-  }), D = u(() => $ ? /* @__PURE__ */ m(
-    c,
+  }), D = c(() => $ ? /* @__PURE__ */ m(
+    d,
     {
       sx: {
         display: "flex",
@@ -220,7 +220,7 @@ function _r({
         gap: 2.5
       },
       children: [
-        i ? /* @__PURE__ */ m(c, { sx: { border: "1px solid", borderColor: "divider", borderRadius: 1.5, p: 2 }, children: [
+        i ? /* @__PURE__ */ m(d, { sx: { border: "1px solid", borderColor: "divider", borderRadius: 1.5, p: 2 }, children: [
           /* @__PURE__ */ r(
             Ce,
             {
@@ -237,8 +237,8 @@ function _r({
         /* @__PURE__ */ r(Qe, { user: n.data })
       ]
     }
-  ) : R && i ? O : ge && i ? /* @__PURE__ */ r(qe, { children: /* @__PURE__ */ r(Ge, {}) }) : null, [R, $, n, i, B, O]), G = u(() => /* @__PURE__ */ r(
-    c,
+  ) : R && i ? O : ge && i ? /* @__PURE__ */ r(qe, { children: /* @__PURE__ */ r(Ge, {}) }) : null, [R, $, n, i, B, O]), G = c(() => /* @__PURE__ */ r(
+    d,
     {
       sx: {
         display: {
@@ -249,8 +249,8 @@ function _r({
       },
       children: /* @__PURE__ */ r(re, { children: p("emptyContent") })
     }
-  ), [i, h]), Q = u(() => !g.data || g.loading ? /* @__PURE__ */ r(
-    c,
+  ), [i, h]), Q = c(() => !g.data || g.loading ? /* @__PURE__ */ r(
+    d,
     {
       sx: {
         height: "100%",
@@ -263,27 +263,27 @@ function _r({
       },
       children: /* @__PURE__ */ r(Pe, {})
     }
-  ) : /* @__PURE__ */ r(c, { sx: { flex: 1 }, children: /* @__PURE__ */ r(
+  ) : /* @__PURE__ */ r(d, { sx: { flex: 1 }, children: /* @__PURE__ */ r(
     Ve,
     {
       isSupportFollow: w,
       currentActiveTab: s,
       isMyself: i,
-      children: v ? /* @__PURE__ */ r(c, { ...U, children: he(v) }) : D
+      children: v ? /* @__PURE__ */ r(d, { ...U, children: he(v) }) : D
     }
-  ) }), [g, s, i, v, U, D, h]), V = u(() => {
+  ) }), [g, s, i, v, U, D, h]), V = c(() => {
     if (n.loading || o.loading)
       return null;
     if (n.error) {
       if (n.error?.response?.status === 404)
-        return /* @__PURE__ */ r(c, { sx: { width: "100%" }, children: /* @__PURE__ */ r(ze, { status: 404, description: p("noUserFound") }) });
+        return /* @__PURE__ */ r(d, { sx: { width: "100%" }, children: /* @__PURE__ */ r(ze, { status: 404, description: p("noUserFound") }) });
       const f = {
         message: n.error.response?.data?.error || n.error.message || "error occurred"
       };
-      return /* @__PURE__ */ r(c, { sx: { width: "100%" }, children: /* @__PURE__ */ r(Le, { error: f }) });
+      return /* @__PURE__ */ r(d, { sx: { width: "100%" }, children: /* @__PURE__ */ r(Le, { error: f }) });
     }
-    return !x && !n.data ? A || /* @__PURE__ */ r(c, { sx: { width: "100%" }, children: /* @__PURE__ */ m(
-      c,
+    return !x && !n.data ? A || /* @__PURE__ */ r(d, { sx: { width: "100%" }, children: /* @__PURE__ */ m(
+      d,
       {
         sx: {
           display: "flex",
@@ -298,11 +298,11 @@ function _r({
         ]
       }
     ) }) : I ? /* @__PURE__ */ m(W, { children: [
-      l.length > 0 && b ? /* @__PURE__ */ r(
-        c,
+      a.length > 0 && b ? /* @__PURE__ */ r(
+        d,
         {
           sx: {
-            display: d ? "block" : "flex",
+            display: l ? "block" : "flex",
             height: "100%",
             overflow: "auto",
             padding: "1px"
@@ -310,12 +310,12 @@ function _r({
           children: Q
         }
       ) : null,
-      l.length === 0 && G
-    ] }) : y ? /* @__PURE__ */ r(W, { display: "flex", flexDirection: d ? "column" : "row", children: /* @__PURE__ */ r(
+      a.length === 0 && G
+    ] }) : y ? /* @__PURE__ */ r(W, { display: "flex", flexDirection: l ? "column" : "row", children: /* @__PURE__ */ r(
       ne,
       {
-        isMobile: d,
-        order: d ? 1 : "unset",
+        isMobile: l,
+        order: l ? 1 : "unset",
         isMyself: i,
         switchPassport: q,
         switchProfile: o.switchProfile,
@@ -325,23 +325,24 @@ function _r({
         refreshProfile: j,
         isShowSocialActions: w,
         sx: {
-          padding: d ? "16px 0 0 0" : "40px 24px 24px 40px",
-          ...d ? {} : { width: 320, maxWidth: 320, flexShrink: 0 },
+          padding: l ? "16px 0 0 0" : "40px 24px 24px 40px",
+          ...l ? {} : { width: 320, maxWidth: 320, flexShrink: 0 },
           boxSizing: "content-box"
         }
       }
-    ) }) : /* @__PURE__ */ m(W, { display: "flex", flexDirection: d ? "column" : "row", children: [
+    ) }) : /* @__PURE__ */ m(W, { display: "flex", flexDirection: l ? "column" : "row", children: [
       /* @__PURE__ */ m(
-        c,
+        d,
         {
           className: "user-center-tabs",
           sx: {
             flex: "1",
-            order: d ? 2 : "unset"
+            order: l ? 2 : "unset",
+            width: l ? "unset" : "calc(100% - 424px)"
           },
           children: [
-            l.length > 0 && b ? /* @__PURE__ */ m(
-              c,
+            a.length > 0 && b ? /* @__PURE__ */ m(
+              d,
               {
                 sx: {
                   display: "flex",
@@ -356,7 +357,7 @@ function _r({
                     {
                       orientation: "horizontal",
                       variant: "line",
-                      tabs: l,
+                      tabs: a,
                       current: s?.value ?? b,
                       onChange: xe,
                       enableTabClick: !0,
@@ -365,7 +366,7 @@ function _r({
                         ".MuiTabs-flexContainer": {
                           gap: 3,
                           ".MuiButtonBase-root": {
-                            padding: d ? "16px 4px" : "32px 4px 16px 4px",
+                            padding: l ? "16px 4px" : "32px 4px 16px 4px",
                             fontSize: 16
                           },
                           ".MuiTab-root": {
@@ -399,16 +400,16 @@ function _r({
                 ]
               }
             ) : null,
-            l.length === 0 && G
+            a.length === 0 && G
           ]
         }
       ),
-      !d && /* @__PURE__ */ r(Se, { orientation: "vertical", sx: { ml: 5 } }),
+      !l && /* @__PURE__ */ r(Se, { orientation: "vertical", sx: { ml: 5 } }),
       /* @__PURE__ */ r(
         ne,
         {
-          isMobile: d,
-          order: d ? 1 : "unset",
+          isMobile: l,
+          order: l ? 1 : "unset",
           isMyself: i,
           switchPassport: q,
           switchProfile: o.switchProfile,
@@ -417,8 +418,8 @@ function _r({
           showFullDid: !1,
           isShowSocialActions: w,
           sx: {
-            padding: d ? "16px 0 0 0" : "40px 24px 24px 40px",
-            ...d ? {} : { width: 320, maxWidth: 320, flexShrink: 0 },
+            padding: l ? "16px 0 0 0" : "40px 24px 24px 40px",
+            ...l ? {} : { width: 320, maxWidth: 320, flexShrink: 0 },
             boxSizing: "content-box"
           }
         }
@@ -426,23 +427,23 @@ function _r({
     ] });
   }, [
     n,
-    l,
+    a,
     i,
     s,
     g,
     b,
     B,
     D
-  ]), J = u(() => i ? !1 : s?.isPrivate, [i, s]);
-  if (u(() => y ? !1 : !L && !b && l?.length > 0 || !s || J, [L, b, l, s, J, y])) {
-    const e = l[0]?.url, t = l.find((f) => f.value === e);
+  ]), J = c(() => i ? !1 : s?.isPrivate, [i, s]);
+  if (c(() => y ? !1 : !L && !b && a?.length > 0 || !s || J, [L, b, a, s, J, y])) {
+    const e = a[0]?.url, t = a.find((f) => f.value === e);
     return e && !t?.isPrivate && window.location.replace(
       ie(e, {
         did: i ? void 0 : x
       })
     ), null;
   }
-  return I || y ? /* @__PURE__ */ m(c, { children: [
+  return I || y ? /* @__PURE__ */ m(d, { children: [
     /* @__PURE__ */ r(ee, { children: /* @__PURE__ */ r("title", { children: _ }) }),
     /* @__PURE__ */ r(oe, { style: { display: "none" } }),
     /* @__PURE__ */ m(ue, { children: [
@@ -450,7 +451,7 @@ function _r({
       H
     ] })
   ] }) : /* @__PURE__ */ m(
-    c,
+    d,
     {
       sx: {
         minHeight: "100vh",

package/lib/common/header-addons.js

@@ -1,47 +1,55 @@
-import { jsx as s, Fragment as v } from "react/jsx-runtime";
+import { jsx as i, Fragment as A } from "react/jsx-runtime";
 import "iconify-icon";
-import r from "prop-types";
-import { use as b, createElement as k } from "react";
-import { SessionContext as w } from "@arcblock/did-connect-react/lib/Session";
-import L from "@arcblock/ux/lib/Config/theme-mode-toggle";
-import { useLocaleContext as N } from "@arcblock/ux/lib/Locale/context";
-import T from "@arcblock/ux/lib/Locale/selector";
+import a from "prop-types";
+import { use as b, createElement as L } from "react";
+import { SessionContext as v } from "@arcblock/did-connect-react/lib/Session";
+import N from "@arcblock/ux/lib/Config/theme-mode-toggle";
+import { useLocaleContext as T } from "@arcblock/ux/lib/Locale/context";
+import k from "@arcblock/ux/lib/Locale/selector";
 import C from "@arcblock/ux/lib/SessionBlocklet";
-import R from "@arcblock/ux/lib/SessionUser";
-import { getLocalizedNavigation as S, filterNavByRole as M } from "../blocklets.js";
-import { SessionManagerProps as B } from "../types.js";
-import D from "./domain-warning.js";
-import P from "./notification-addon.js";
-const j = () => !!(window?.blocklet?.navigation ?? []).find((o) => o.id === "/userCenter/notification");
+import S from "@arcblock/ux/lib/SessionUser";
+import { WELLKNOWN_BLOCKLET_ADMIN_PATH as D } from "@abtnode/constant";
+import { getLocalizedNavigation as E, filterNavByRole as M } from "../blocklets.js";
+import { SessionManagerProps as O } from "../types.js";
+import R from "./domain-warning.js";
+import W from "./notification-addon.js";
+import P from "./org-switch/index.js";
+const B = () => !!(window?.blocklet?.navigation ?? []).find((o) => o.id === "/userCenter/notification"), _ = (n) => {
+  const { settings: o = {} } = n ?? window?.blocklet ?? {};
+  return o?.org?.enabled || !1;
+}, j = () => {
+  const { pathname: n = "" } = window.location || {};
+  return n.startsWith(D);
+};
 function x({
-  formattedBlocklet: l,
+  formattedBlocklet: n,
   addons: o = null,
   showDomainWarningDialog: m = !0,
   sessionManagerProps: u = { showRole: !0 }
 }) {
-  const n = b(w), { locale: i, languages: p } = N() || {}, { enableConnect: g = !0, enableLocale: d = !0 } = l, h = !!n?.session?.user;
-  let a = S(l?.navigation?.sessionManager, i) || [];
-  a = M(a, n?.session?.user?.role);
+  const e = b(v), { locale: t, languages: p } = T() || {}, { enableConnect: g = !0, enableLocale: d = !0 } = n, h = !!e?.session?.user;
+  let l = E(n?.navigation?.sessionManager, t) || [];
+  l = M(l, e?.session?.user?.role);
   const c = (() => {
     if (o && typeof o != "function")
       return Array.isArray(o) ? o : [o];
-    let e = [];
-    if (j() && e.push(/* @__PURE__ */ s(P, { session: n.session }, "notification-addon")), d && i && p.length > 1 && e.push(/* @__PURE__ */ s(T, { showText: !1 }, "locale-selector")), e.push(/* @__PURE__ */ s(L, {}, "theme-mode-toggle")), g && n) {
+    let s = [];
+    if (B() && s.push(/* @__PURE__ */ i(W, { session: e.session }, "notification-addon")), d && t && p.length > 1 && s.push(/* @__PURE__ */ i(k, { showText: !1 }, "locale-selector")), s.push(/* @__PURE__ */ i(N, {}, "theme-mode-toggle")), g && e) {
       const f = [];
-      h && (a ? a.slice(0, 5) : []).forEach((t) => {
+      h && (l ? l.slice(0, 5) : []).forEach((r) => {
         f.push({
-          label: t.title,
-          icon: t.icon ? /* @__PURE__ */ s("iconify-icon", { icon: t.icon, height: 24, style: { marginRight: 8 } }) : null,
+          label: r.title,
+          icon: r.icon ? /* @__PURE__ */ i("iconify-icon", { icon: r.icon, height: 24, style: { marginRight: 8 } }) : null,
           component: "a",
-          href: t.link,
-          key: t.link
+          href: r.link,
+          key: r.link
         });
-      }), e.push(/* @__PURE__ */ s(C, { session: n.session, locale: i }, "session-blocklet")), e.push(
-        /* @__PURE__ */ s(
-          R,
+      }), s.push(/* @__PURE__ */ i(C, { session: e.session, locale: t }, "session-blocklet")), s.push(
+        /* @__PURE__ */ i(
+          S,
           {
-            session: n.session,
-            locale: i,
+            session: e.session,
+            locale: t,
             menu: f,
             showRole: !0,
             ...u
@@ -50,21 +58,21 @@ function x({
         )
       );
     }
-    return typeof o == "function" && (e = o(e) || []), e;
-  })(), y = Array.isArray(c) ? c : [c], A = [
-    m ? /* @__PURE__ */ s(D, { session: n?.session, locale: i }) : null,
+    return !j() && _(n) && e?.session?.user && s.unshift(/* @__PURE__ */ i(P, { session: e.session, locale: t }, "orgs-switch")), typeof o == "function" && (s = o(s) || []), s;
+  })(), y = Array.isArray(c) ? c : [c], w = [
+    m ? /* @__PURE__ */ i(R, { session: e?.session, locale: t }) : null,
     ...y
   ].filter(Boolean);
-  return k(v, null, ...A);
+  return L(A, null, ...w);
 }
 x.propTypes = {
-  formattedBlocklet: r.object.isRequired,
+  formattedBlocklet: a.object.isRequired,
   // 需要考虑 定制的 addons 与内置的 连接钱包/选择语言 addons 共存的情况
   // - PropTypes.func: 可以把自定义 addons 插在 session-manager 或 locale-selector (如果存在的话) 前/中/后
   // - PropTypes.node: 将 addons 原样传给 UX Header 组件
-  addons: r.oneOfType([r.func, r.node]),
-  sessionManagerProps: B,
-  showDomainWarningDialog: r.bool
+  addons: a.oneOfType([a.func, a.node]),
+  sessionManagerProps: O,
+  showDomainWarningDialog: a.bool
 };
 export {
   x as default

package/lib/common/org-switch/create.d.ts

@@ -0,0 +1,14 @@
+import { default as PropTypes } from 'prop-types';
+declare function CreateOrgDialog({ onSuccess, onCancel, locale }: {
+    onSuccess?: ((...args: any[]) => void) | undefined;
+    onCancel?: ((...args: any[]) => void) | undefined;
+    locale?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace CreateOrgDialog {
+    namespace propTypes {
+        let onSuccess: PropTypes.Requireable<(...args: any[]) => any>;
+        let onCancel: PropTypes.Requireable<(...args: any[]) => any>;
+        let locale: PropTypes.Requireable<string>;
+    }
+}
+export default CreateOrgDialog;

package/lib/common/org-switch/create.js

@@ -0,0 +1,124 @@
+import { jsxs as m, jsx as o, Fragment as w } from "react/jsx-runtime";
+import { useState as f } from "react";
+import l from "prop-types";
+import { useMemoizedFn as S, useReactive as B } from "ahooks";
+import g from "lodash/noop";
+import D from "@arcblock/ux/lib/Dialog";
+import E from "@mui/material/CircularProgress";
+import L from "@mui/material/DialogContentText";
+import h from "@mui/material/Typography";
+import y from "@mui/material/TextField";
+import O from "@mui/material/Alert";
+import W from "@arcblock/ux/lib/Toast";
+import v from "@arcblock/ux/lib/Button";
+import { translate as j } from "@arcblock/ux/lib/Locale/util";
+import { formatAxiosError as k } from "../../UserCenter/libs/utils.js";
+import z from "./use-org.js";
+import A from "./locales.js";
+function M({ onSuccess: C = g, onCancel: s = g, locale: T = "en" }) {
+  const [i, c] = f(!1), [p, r] = f(""), { createOrg: b } = z(), t = S((e, a = {}) => j(A, e, T, "en", a)), n = B({
+    name: "",
+    description: ""
+  }), x = async () => {
+    const e = n.name.trim();
+    if (!e) {
+      r(t("nameEmpty"));
+      return;
+    }
+    if (e.length > 25) {
+      r(t("nameTooLong", { length: 25 }));
+      return;
+    }
+    const a = n.description.trim();
+    if (a.length > 255) {
+      r(t("descriptionTooLong", { length: 25 }));
+      return;
+    }
+    r(""), c(!0);
+    try {
+      await b({ name: e, description: a }), C();
+    } catch (u) {
+      console.error(u);
+      const d = k(u);
+      r(d), W.error(d);
+    } finally {
+      c(!1);
+    }
+  }, F = /* @__PURE__ */ m("div", { children: [
+    /* @__PURE__ */ o(h, { component: "div", style: { marginTop: 16 }, children: /* @__PURE__ */ o(
+      y,
+      {
+        label: t("mutate.name"),
+        autoComplete: "off",
+        variant: "outlined",
+        name: "name",
+        "data-cy": "mutate-org-input-name",
+        fullWidth: !0,
+        autoFocus: !0,
+        value: n.name,
+        onChange: (e) => {
+          r(""), n.name = e.target.value;
+        },
+        disabled: i
+      }
+    ) }),
+    /* @__PURE__ */ o(h, { component: "div", style: { marginTop: 16, marginBottom: 16 }, children: /* @__PURE__ */ o(
+      y,
+      {
+        label: t("mutate.description"),
+        autoComplete: "off",
+        variant: "outlined",
+        name: "description",
+        "data-cy": "mutate-org-input-description",
+        fullWidth: !0,
+        value: n.description,
+        onChange: (e) => {
+          r(""), n.description = e.target.value;
+        },
+        disabled: i,
+        multiline: !0,
+        rows: 3
+      }
+    ) })
+  ] });
+  return /* @__PURE__ */ m(
+    D,
+    {
+      title: t("mutate.title", { mode: t("create") }),
+      fullWidth: !0,
+      open: !0,
+      onClose: s,
+      showCloseButton: !1,
+      actions: /* @__PURE__ */ m(w, { children: [
+        /* @__PURE__ */ o(v, { onClick: s, color: "inherit", children: t("cancel") }),
+        /* @__PURE__ */ m(
+          v,
+          {
+            "data-cy": "mutate-org-confirm",
+            onClick: x,
+            color: "primary",
+            disabled: i,
+            variant: "contained",
+            autoFocus: !0,
+            children: [
+              i && /* @__PURE__ */ o(E, { size: 16 }),
+              t("create")
+            ]
+          }
+        )
+      ] }),
+      children: [
+        /* @__PURE__ */ o(L, { component: "div", children: F }),
+        !!p && /* @__PURE__ */ o(O, { severity: "error", style: { width: "100%", margin: 0 }, children: p })
+      ]
+    }
+  );
+}
+M.propTypes = {
+  onSuccess: l.func,
+  onCancel: l.func,
+  locale: l.string
+};
+export {
+  M as default
+};

package/lib/common/org-switch/index.d.ts

@@ -0,0 +1,12 @@
+import { default as PropTypes } from 'prop-types';
+declare function OrgsSwitch({ session, locale }: {
+    session: any;
+    locale?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace OrgsSwitch {
+    namespace propTypes {
+        let session: PropTypes.Validator<object>;
+        let locale: PropTypes.Requireable<string>;
+    }
+}
+export default OrgsSwitch;