@frontify/fondue
Version:
Design system of Frontify
36 lines (35 loc) • 1.16 kB
JavaScript
import { jsx as e } from "react/jsx-runtime";
import { FOCUS_VISIBLE_STYLE as d } from "../../../utilities/focusStyle.es.js";
import { merge as r } from "../../../utilities/merge.es.js";
const m = ({ active: n, onClick: o, expanded: w, disabled: t, className: a, ...i }) => /* @__PURE__ */ e(
"button",
{
type: "button",
onClick: o,
disabled: t,
"aria-label": "expand item",
tabIndex: t ? -1 : 0,
"data-test-id": "tree-item-toggle",
className: r([
"tw-p-1.5 first:tw-ml-2 tw-min-h-[20px] tw-min-w-[20px] tw-h-5 tw-w-5 tw-flex tw-justify-center tw-rounded-sm disabled:tw-invisible",
n ? "tw-text-white tw-text-opacity-50" : "tw-text-line-strong",
d,
a
]),
...i,
children: /* @__PURE__ */ e(
"div",
{
className: r([
"tw-transition-transform tw-w-0 tw-h-0 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-line-mid",
w && "tw-rotate-90"
])
}
)
}
);
m.displayName = "FondueExpandButton";
export {
m as ExpandButton
};
//# sourceMappingURL=ExpandButton.es.js.map