import { jsxs as p, jsx as t } from "react/jsx-runtime";
import { styled as x } from "../Theme/index.js";
import s from "./images/logo-light-top.svg.js";
import f from "./images/logo-light-text.svg.js";
import u from "./images/logo-dark-top.svg.js";
import h from "./images/logo-dark-text.svg.js";
function j({
  showText: o = !0,
  showLogo: n = !0,
  mode: a = "dark",
  layout: l = "vertical",
  size: r = void 0,
  style: i = {},
  ...g
}) {
  const e = a === "light", m = e ? /* @__PURE__ */ t(s, {}) : /* @__PURE__ */ t(u, {}), c = e ? /* @__PURE__ */ t(f, { className: "logo-text" }) : /* @__PURE__ */ t(h, { className: "logo-text" });
  return r && (i.width = `${r}px`, i.height = `${r}px`), /* @__PURE__ */ p(d, { layout: l, style: i, ...g, children: [
    n && m,
    o && c
  ] });
}
const d = x("span")`
  display: inline-flex;
  flex-direction: ${(o) => o.layout === "horizontal" ? "row" : "column"};
  justify-content: center;
  align-items: center;

  .logo-text {
    ${(o) => o.layout === "vertical" ? "margin-top: 8px;" : ""}
    ${(o) => o.layout === "vertical" ? "" : "margin-left: 8px;"};
  }
`;
export {
  j as default
};
