@frontify/fondue
Version:
Design system of Frontify
48 lines (47 loc) • 1.67 kB
JavaScript
import { jsxs as r, jsx as n } from "react/jsx-runtime";
import { cloneElement as c } from "react";
import { merge as l } from "../../utilities/merge.es.js";
import { MenuItemContentSize as t } from "./types.es.js";
const d = {
[t.XSmall]: "tw-pr-1.5",
[t.Small]: "tw-pr-1.5",
[t.Large]: "tw-pr-2"
}, p = ({
title: a,
decorator: s,
switchComponent: m,
subtitle: i,
ariaProps: o,
size: e = t.Small,
children: w
}) => /* @__PURE__ */ r(
"div",
{
...o,
"data-test-id": "menu-item-content",
className: "tw-flex tw-box-border tw-items-center tw-font-sans tw-text-s tw-flex-auto tw-min-w-0",
children: [
s && /* @__PURE__ */ n("span", { className: l(["tw-shrink-0", d[e]]), "data-test-id": "menu-item-decorator", children: c(s, {
size: e === t.Large ? 24 : 16
}) }),
/* @__PURE__ */ r("div", { className: "tw-flex-1 tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap", children: [
/* @__PURE__ */ n(
"div",
{
"data-test-id": "menu-item-title",
className: "tw-select-none tw-text-ellipsis tw-overflow-hidden",
title: typeof a == "string" ? a : "",
children: w || a
}
),
i && e === t.Large && /* @__PURE__ */ n("div", { "data-test-id": "menu-item-subtitle", className: "tw-select-none tw-text-xxs", title: i, children: i })
] }),
m && /* @__PURE__ */ n("span", { className: l(["tw-shrink-0", d[e]]), "data-test-id": "menu-item-decorator", children: m })
]
}
);
p.displayName = "FondueMenuItemContent";
export {
p as MenuItemContent
};
//# sourceMappingURL=MenuItemContent.es.js.map