@payfit/unity-components
Version:
54 lines (53 loc) • 1.73 kB
JavaScript
import { Icon as e } from "../../icon/Icon.js";
import { Text as t } from "../../text/Text.js";
import { forwardRef as n, useContext as r } from "react";
import { uyTv as i } from "@payfit/unity-themes";
import { jsx as a, jsxs as o } from "react/jsx-runtime";
import { Button as s } from "react-aria-components/Button";
import { Heading as c } from "react-aria-components/Heading";
import { DisclosureStateContext as l } from "react-aria-components/Disclosure";
//#region src/components/collapsible/parts/CollapsibleTitle.tsx
var u = i({
slots: {
base: "uy:w-full",
button: ["uy:flex uy:gap-50 uy:pb-100 uy:pt-100 uy:w-full uy:cursor-pointer uy:hover:text-content-neutral-hover uy:focus-visible:outline-none"],
title: "uy:flex uy:grow uy:text-left uy:items-center",
icon: "uy:mr-100 uy:transition-transform uy:duration-150 uy:ease-linear uy:origin-center"
},
variants: { isExpanded: {
true: { icon: "uy:rotate-180" },
false: { icon: "uy:rotate-0" }
} },
defaultVariants: { isExpanded: !1 }
}), d = n(({ children: n, suffix: i, ...d }, f) => {
let { base: p, button: m, title: h, icon: g } = u({ isExpanded: r(l)?.isExpanded });
return /* @__PURE__ */ a(c, {
"data-dd-privacy": "allow",
...d,
ref: f,
className: p(),
children: /* @__PURE__ */ o(s, {
className: m(),
slot: "trigger",
children: [
/* @__PURE__ */ a(e, {
src: "CaretDownOutlined",
className: g(),
role: "presentation"
}),
/* @__PURE__ */ a(t, {
variant: "bodyStrong",
className: h(),
children: n
}),
i ? /* @__PURE__ */ a(t, {
variant: "body",
children: i
}) : null
]
})
});
});
d.displayName = "CollapsibleTitle";
//#endregion
export { d as CollapsibleTitle };