import { jsxs as p, jsx as t } from "react/jsx-runtime";
import { Box as a } from "@mui/material";
import { useSize as m, useCreation as c } from "ahooks";
import { useRef as d } from "react";
import b from "@arcblock/react-hooks/lib/useBrowser";
import h from "./powered-by.js";
import x from "./app-info-item.js";
import g from "./app-icon.js";
import { hexToRgba as u, getDIDColor as w } from "../Util/index.js";
import { mergeSx as C } from "../Util/style.js";
import { DID_CONNECT_MEDIUM_WIDTH as I } from "../Util/constant.js";
function N({
  currentAppInfo: r = globalThis.blocklet,
  currentAppColor: s = globalThis.blocklet?.appPid ? w(globalThis.blocklet?.appPid) : "#fff",
  sx: i = {}
}) {
  const e = globalThis?.blocklet, l = b(), n = d(null), o = m(n), f = c(() => o ? o.width < I - 50 : !0, [o, o?.width]);
  return /* @__PURE__ */ p(
    a,
    {
      ref: n,
      sx: C(
        {
          display: "flex",
          justifyContent: e?.settings?.didConnect?.showAppInfo === !1 ? "center" : "space-between",
          alignItems: "center",
          gap: 1,
          fontSize: 12,
          backgroundColor: e?.settings?.didConnect?.showDidColor === !1 ? "grey.50" : u(s, 0.08),
          // 需要保持跟 .did-connect__root 的规则一样
          mx: -3,
          // eslint-disable-next-line no-nested-ternary
          px: f && l.arcSphere ? 1 : 3,
          py: 1.5,
          // HACK: 极限条件下，footer 会溢出，使用隐藏的滚动条来处理这种情况（屏幕宽度小于 360 时会出现）
          overflow: "auto",
          "&::-webkit-scrollbar": {
            display: "none"
            // 隐藏滚动条 (Webkit 浏览器)
          },
          "-ms-overflow-style": "none",
          // 隐藏滚动条 (IE 浏览器)
          "scrollbar-width": "none"
          // 隐藏滚动条 (Firefox)
        },
        i
      ),
      className: "did-connect__footer",
      children: [
        e?.settings?.didConnect?.showAppInfo === !1 ? null : /* @__PURE__ */ t(
          x,
          {
            appInfo: r,
            appLogo: /* @__PURE__ */ t(g, { appInfo: r, size: 24, sx: { flexShrink: 0 } }),
            sx: {
              flex: 1,
              overflow: "hidden"
            }
          }
        ),
        /* @__PURE__ */ t(h, { sx: { maxWidth: "100%", justifyContent: "end" } })
      ]
    }
  );
}
export {
  N as default
};
