@blocklet/launcher-layout 3.0.8 → 3.0.10

package/lib/header.js

@@ -1,39 +1,39 @@
-import { jsxs as l, jsx as t } from "react/jsx-runtime";
-import v from "@arcblock/ux/lib/Img";
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import b from "@arcblock/ux/lib/Img";
 import f from "@emotion/styled";
-import { useMediaQuery as b, Skeleton as p } from "@mui/material";
-import $ from "is-empty";
+import { useMediaQuery as v, Skeleton as p } from "@mui/material";
+import k from "is-empty";
 import o from "prop-types";
-import { useRef as k, useState as N, useEffect as j } from "react";
+import { useRef as $, useState as N, useEffect as j } from "react";
 import A from "url-join";
 import S from "./assets/blocklet-default-logo.png";
 import { getLaunchingText as z } from "./locale.js";
-const g = (e) => (e == null ? void 0 : e.title) || (e == null ? void 0 : e.name) || "";
-function T({ blockletMeta: e = {}, subTitle: n = "", logoUrl: i = "", locale: m = "", navLogo: d = "", loading: a = !1 }) {
-  const r = b((y) => y.breakpoints.down("md")), c = r ? 18 : 48, h = k(null), [s, x] = N("");
+const g = (e) => e?.title || e?.name || "";
+function T({ blockletMeta: e = {}, subTitle: i = "", logoUrl: n = "", locale: m = "", navLogo: c = "", loading: a = !1 }) {
+  const l = v((y) => y.breakpoints.down("md")), d = l ? 18 : 48, h = $(null), [r, x] = N("");
   return j(() => {
-    h.current && h.current.offsetHeight > 34 && (s === "" ? x("middle") : s === "middle" && x("small"));
-  }, [s]), /* @__PURE__ */ l(R, { className: s === "small" ? "center-mode" : "", children: [
-    r ? /* @__PURE__ */ t("div", { className: "app-icon", children: d }) : /* @__PURE__ */ l("div", { className: "app-icon", children: [
-      a && /* @__PURE__ */ t(I, { blockletSize: c, isMobile: r }),
-      !a && /* @__PURE__ */ t(u, { blockletSize: c, logoUrl: i })
+    h.current && h.current.offsetHeight > 34 && (r === "" ? x("middle") : r === "middle" && x("small"));
+  }, [r]), /* @__PURE__ */ s(R, { className: r === "small" ? "center-mode" : "", children: [
+    l ? /* @__PURE__ */ t("div", { className: "app-icon", children: c }) : /* @__PURE__ */ s("div", { className: "app-icon", children: [
+      a && /* @__PURE__ */ t(I, { blockletSize: d, isMobile: l }),
+      !a && /* @__PURE__ */ t(u, { blockletSize: d, logoUrl: n })
     ] }),
-    /* @__PURE__ */ l("div", { className: "header-title", children: [
-      r && n && /* @__PURE__ */ t("div", { className: "header-title-sub", children: n }),
-      /* @__PURE__ */ l("div", { className: "app-name-content", children: [
-        !r && /* @__PURE__ */ t("div", { className: "launching-context", children: n || z(m) }),
+    /* @__PURE__ */ s("div", { className: "header-title", children: [
+      l && i && /* @__PURE__ */ t("div", { className: "header-title-sub", children: i }),
+      /* @__PURE__ */ s("div", { className: "app-name-content", children: [
+        !l && /* @__PURE__ */ t("div", { className: "launching-context", children: i || z(m) }),
         /* @__PURE__ */ t(
           "div",
           {
-            className: `header-title-name ${s === "middle" || s === "small" ? "middle-size" : ""}`,
+            className: `header-title-name ${r === "middle" || r === "small" ? "middle-size" : ""}`,
             ref: h,
             children: /* @__PURE__ */ t(
               w,
               {
-                logoUrl: i,
-                isMobile: r,
+                logoUrl: n,
+                isMobile: l,
                 blockletMeta: e,
-                blockletSize: c,
+                blockletSize: d,
                 loading: a
               }
             )
@@ -51,15 +51,15 @@ T.propTypes = {
   navLogo: o.any,
   loading: o.bool
 };
-function I({ blockletSize: e, isMobile: n }) {
-  return n ? /* @__PURE__ */ t(p, { variant: "rectangular", width: 100, height: 16, alt: "icon", style: { marginTop: 4 } }) : /* @__PURE__ */ t(p, { variant: "rectangular", width: e, height: e });
+function I({ blockletSize: e, isMobile: i }) {
+  return i ? /* @__PURE__ */ t(p, { variant: "rectangular", width: 100, height: 16, alt: "icon", style: { marginTop: 4 } }) : /* @__PURE__ */ t(p, { variant: "rectangular", width: e, height: e });
 }
-function u({ logoUrl: e, blockletSize: n }) {
+function u({ logoUrl: e, blockletSize: i }) {
   return /* @__PURE__ */ t(
-    v,
+    b,
     {
-      width: n,
-      height: n,
+      width: i,
+      height: i,
       src: e,
       alt: "blocklet icon",
       fallback: S,
@@ -68,17 +68,17 @@ function u({ logoUrl: e, blockletSize: n }) {
     `layout-app-icon-${e}`
   );
 }
-function w({ isMobile: e, logoUrl: n, blockletMeta: i = {}, blockletSize: m, loading: d }) {
-  const a = g(i);
-  return d ? /* @__PURE__ */ t(p, { variant: "rectangular", width: 100, height: 16, alt: "icon", style: { marginTop: 4 } }) : $(i) ? /* @__PURE__ */ t(p, { variant: "rectangular", animation: !1, width: 100, height: 16, alt: "icon", style: { marginTop: 4 } }) : e ? /* @__PURE__ */ l(L, { children: [
-    /* @__PURE__ */ t(u, { blockletSize: m, logoUrl: n }),
-    /* @__PURE__ */ t("span", { className: "ellipsis-title", children: g(i) })
+function w({ isMobile: e, logoUrl: i, blockletMeta: n = {}, blockletSize: m, loading: c }) {
+  const a = g(n);
+  return c ? /* @__PURE__ */ t(p, { variant: "rectangular", width: 100, height: 16, alt: "icon", style: { marginTop: 4 } }) : k(n) ? /* @__PURE__ */ t(p, { variant: "rectangular", animation: !1, width: 100, height: 16, alt: "icon", style: { marginTop: 4 } }) : e ? /* @__PURE__ */ s(L, { children: [
+    /* @__PURE__ */ t(u, { blockletSize: m, logoUrl: i }),
+    /* @__PURE__ */ t("span", { className: "ellipsis-title", children: g(n) })
   ] }) : /* @__PURE__ */ t(
     E,
     {
       className: "app-link",
       target: "_blank",
-      href: A((i == null ? void 0 : i.registryUrl) || "", `/blocklets/${i == null ? void 0 : i.did}`),
+      href: A(n?.registryUrl || "", `/blocklets/${n?.did}`),
       title: a,
       children: a
     }

package/lib/nav.js

@@ -1,22 +1,21 @@
 import { jsxs as l, jsx as o } from "react/jsx-runtime";
-import k from "@emotion/styled";
-import { Check as B } from "@mui/icons-material";
-import { Box as x, Skeleton as A, Tooltip as P, Button as g, Typography as I } from "@mui/material";
+import b from "@emotion/styled";
+import { Check as T } from "@mui/icons-material";
+import { Box as g, Skeleton as j, Tooltip as B, Button as m, Typography as A } from "@mui/material";
 import s from "prop-types";
-import { useStepContext as M } from "./context/step.js";
-import N from "./header.js";
-function _({
+import { useStepContext as P } from "./context/step.js";
+import I from "./header.js";
+function M({
   blockletMeta: e,
-  logoUrl: f = "",
-  locale: u = "",
-  useOfSkeleton: y = !1,
-  subTitle: w = "",
+  logoUrl: k = "",
+  locale: x = "",
+  useOfSkeleton: f = !1,
+  subTitle: u = "",
   loading: d = !1,
   extraNav: t = null,
-  sx: v
+  sx: y
 }) {
-  var m, b;
-  const { steps: $, activeStep: S, setActiveStepByKey: C, setActiveStepByIndex: z, getStepStatus: h, canBackToStep: T } = M(), c = y ? d : !1, j = (i, p) => {
+  const { steps: w, activeStep: v, setActiveStepByKey: $, setActiveStepByIndex: S, getStepStatus: h, canBackToStep: C } = P(), c = f ? d : !1, z = (i, p) => {
     const n = ["step-block"], a = h(i.key);
     switch (a) {
       case "current":
@@ -37,14 +36,14 @@ function _({
         n.push("always-step-child");
         break;
     }
-    return i.optional === !0 && S < p && n.push("step-optional"), n.join(" ");
+    return i.optional === !0 && v < p && n.push("step-optional"), n.join(" ");
   };
-  return /* @__PURE__ */ l(q, { sx: v, children: [
-    /* @__PURE__ */ o(N, { blockletMeta: e, loading: d, logoUrl: f, locale: u, subTitle: w }),
-    /* @__PURE__ */ o(D, { className: `${c ? "hide-child-step-desc" : ""}`, children: $.map((i, p) => {
-      const n = !c && T(p);
-      return /* @__PURE__ */ l("div", { className: j(i, p), children: [
-        /* @__PURE__ */ o("div", { className: "step-icon", children: /* @__PURE__ */ o(B, { style: { fontSize: 16 } }) }),
+  return /* @__PURE__ */ l(N, { sx: y, children: [
+    /* @__PURE__ */ o(I, { blockletMeta: e, loading: d, logoUrl: k, locale: x, subTitle: u }),
+    /* @__PURE__ */ o(_, { className: `${c ? "hide-child-step-desc" : ""}`, children: w.map((i, p) => {
+      const n = !c && C(p);
+      return /* @__PURE__ */ l("div", { className: z(i, p), children: [
+        /* @__PURE__ */ o("div", { className: "step-icon", children: /* @__PURE__ */ o(T, { style: { fontSize: 16 } }) }),
         /* @__PURE__ */ o("div", { className: "step-line" }),
         /* @__PURE__ */ l("div", { className: "step-content", title: i.name, children: [
           /* @__PURE__ */ o(
@@ -54,13 +53,13 @@ function _({
               onClick: () => {
                 if (n) {
                   if (i.key) {
-                    C(i.key);
+                    $(i.key);
                     return;
                   }
-                  z(p);
+                  S(p);
                 }
               },
-              children: c ? /* @__PURE__ */ o(A, { variant: "text", width: 100 }) : i.name
+              children: c ? /* @__PURE__ */ o(j, { variant: "text", width: 100 }) : i.name
             }
           ),
           i.description && /* @__PURE__ */ o("div", { className: "step-desc", children: i.description }),
@@ -80,10 +79,10 @@ function _({
       ] }, i.key);
     }) }),
     t && /* @__PURE__ */ l("div", { className: "extra-nav", children: [
-      t.tooltipText ? /* @__PURE__ */ o(P, { title: t.tooltipText, children: /* @__PURE__ */ o(
-        g,
+      t.tooltipText ? /* @__PURE__ */ o(B, { title: t.tooltipText, children: /* @__PURE__ */ o(
+        m,
         {
-          variant: ((m = t.buttonProps) == null ? void 0 : m.variant) || "text",
+          variant: t.buttonProps?.variant || "text",
           onClick: () => {
             t.link && window.open(t.link, "_blank");
           },
@@ -94,9 +93,9 @@ function _({
           children: t.text
         }
       ) }) : /* @__PURE__ */ o(
-        g,
+        m,
         {
-          variant: ((b = t.buttonProps) == null ? void 0 : b.variant) || "text",
+          variant: t.buttonProps?.variant || "text",
           onClick: () => {
             t.link && window.open(t.link, "_blank");
           },
@@ -108,7 +107,7 @@ function _({
         }
       ),
       t.description && /* @__PURE__ */ o(
-        I,
+        A,
         {
           variant: "caption",
           sx: { color: "text.secondary", mt: 0.5 },
@@ -120,7 +119,7 @@ function _({
     ] })
   ] });
 }
-const q = k(x)`
+const N = b(g)`
   overflow-y: auto;
   display: flex;
   flex-direction: column;
@@ -168,7 +167,7 @@ const q = k(x)`
   .extra-nav-button {
     cursor: pointer;
   }
-`, D = k(x)`
+`, _ = b(g)`
   display: flex;
   flex-direction: column;
   margin-top: 60px;
@@ -372,7 +371,7 @@ const q = k(x)`
     }
   }
 `;
-_.propTypes = {
+M.propTypes = {
   blockletMeta: s.object.isRequired,
   logoUrl: s.string,
   locale: s.string,
@@ -383,5 +382,5 @@ _.propTypes = {
   sx: s.any
 };
 export {
-  _ as default
+  M as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/launcher-layout",
-  "version": "3.0.8",
+  "version": "3.0.10",
   "description": "Common ux components of launcher",
   "publishConfig": {
     "access": "public"
@@ -36,14 +36,14 @@
     "url": "https://github.com/ArcBlock/ux/issues"
   },
   "peerDependencies": {
-    "@arcblock/did-connect": "workspace:*",
-    "@arcblock/ux": "workspace:*",
+    "@arcblock/did-connect": "^3.0.8",
+    "@arcblock/ux": "^3.0.8",
     "@mui/icons-material": "^7.1.2",
     "@mui/material": "^7.1.2",
     "react": "^19.0.0"
   },
   "dependencies": {
-    "@arcblock/icons": "3.0.8",
+    "@arcblock/icons": "3.0.10",
     "@blocklet/meta": "^1.16.44",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.0",
@@ -55,5 +55,5 @@
     "rehype-react": "^7.2.0",
     "url-join": "^4.0.1"
   },
-  "gitHead": "30b21395b2f3ef6824df728aeafd10e9dea173d9"
+  "gitHead": "8e4b3b4f9cc52c8f1f1d270ab03a3c566073617a"
 }