import "../Breadcrumb.css";
import { jsx, jsxs } from "react/jsx-runtime";
import { Breadcrumb as Breadcrumb$1 } from "antd";
import Button from "./Button.js";
import Column from "./Column.js";
import Dropdown from "./Dropdown.js";
import Icon from "./Icon.js";
import { Row } from "./Row.js";
import { useTheme } from "./Theme/UI.js";
import "./Theme/themeUtils.js";
import "./Theme/themes.js";
const base = "Breadcrumb_base_cef89";
const css = {
  base
};
const Breadcrumb = (props) => {
  const {
    themeSettings: { className: themeClass }
  } = useTheme();
  const classes = [css.base, themeClass];
  return /* @__PURE__ */ jsx("div", { className: classes.join(" "), children: /* @__PURE__ */ jsxs(Row, { children: [
    /* @__PURE__ */ jsx(Column, { children: /* @__PURE__ */ jsx(Breadcrumb$1, { separator: props.separator, children: props.children }) }),
    props.menuItems && /* @__PURE__ */ jsx(Column, { align: "left", children: /* @__PURE__ */ jsx(Dropdown, { menu: props.menuItems, onClick: props.onClickMenu, children: /* @__PURE__ */ jsx(
      Button,
      {
        icon: /* @__PURE__ */ jsx(Icon, { name: "arrow-down", size: "tiny", title: "Action menu" }),
        size: "small",
        type: "text"
      }
    ) }) })
  ] }) });
};
Breadcrumb.Item = Breadcrumb$1.Item;
Breadcrumb.Separator = Breadcrumb$1.Separator;
export {
  Breadcrumb as default
};
