@payfit/unity-components
Version:
42 lines (41 loc) • 1.34 kB
JavaScript
import { CircularIconButton as e } from "../../icon-button/CircularIconButton.js";
import { forwardRef as t } from "react";
import { uyTv as n } from "@payfit/unity-themes";
import { jsx as r, jsxs as i } from "react/jsx-runtime";
import { Heading as a } from "react-aria-components/Heading";
//#region src/components/side-panel/parts/SidePanelHeader.tsx
var o = n({ slots: {
base: [
"uy:py-200 uy:px-300 uy:w-full",
"uy:flex uy:flex-col uy:shrink-0",
"uy:bg-surface-neutral uy:rounded-tl-200 uy:rounded-tr-200 uy:shadow-raising",
"uy:sticky uy:top-0 uy:z-10"
],
content: ["uy:flex uy:items-center uy:justify-between uy:w-full"],
heading: ["uy:typography-h2 uy:md:typography-h3 uy:text-content-neutral uy:truncate"]
} }), s = t(({ children: t, ...n }, s) => {
let { base: c, content: l, heading: u } = o();
return /* @__PURE__ */ r("header", {
ref: s,
className: c(),
...n,
children: /* @__PURE__ */ i("div", {
className: l(),
children: [/* @__PURE__ */ r(a, {
slot: "title",
className: u(),
children: t
}), /* @__PURE__ */ r(e, {
asElement: "button",
slot: "close",
icon: "CloseOutlined",
title: "Close",
size: "large",
color: "content.neutral.low"
})]
})
});
});
s.displayName = "SidePanelHeader";
//#endregion
export { s as SidePanelHeader, o as sidePanelHeader };