@payfit/unity-components
Version:
45 lines (44 loc) • 1.67 kB
JavaScript
import { useBreakpointListener as e } from "../../../hooks/use-breakpoint-listener.js";
import { useTaskMenuContext as t } from "../TaskMenu.context.js";
import { uyTv as n } from "@payfit/unity-themes";
import { jsx as r } from "react/jsx-runtime";
import { mergeProps as i } from "react-aria/mergeProps";
import { useOverlay as a } from "react-aria/useOverlay";
import { FocusScope as o } from "react-aria/FocusScope";
//#region src/components/task-menu/parts/Content.tsx
var s = n({ base: [
"uy:flex uy:flex-col uy:mt-100",
"uy:flex uy:md:flex-col uy:md:gap-200 uy:md:list-none uy:md:mt-0",
"uy:focus-visible:outline-2 uy:focus-visible:outline uy:focus-visible:outline-offset-2 uy:focus-visible:outline-utility-focus-ring"
] }), c = ({ children: n }) => {
let { taskMenuContentId: o, state: c, overlayProps: l, overlayRef: u } = t(), d = e(), f = d === "xs" || d === "sm", { overlayProps: p } = a({
onClose: () => c?.close(),
isOpen: c?.isOpen,
isDismissable: !1
}, u);
return /* @__PURE__ */ r("ol", {
...i(p, l),
ref: u,
className: s(),
id: o,
...f && { "data-mobile-open": c?.isOpen },
children: n
});
}, l = ({ children: e }) => {
let { state: n } = t();
return !!n?.isOpen && /* @__PURE__ */ r("div", {
className: "uy:absolute uy:z-9 uy:top-full uy:inset-x-0 uy:h-[100dvh] uy:bg-surface-neutral",
children: /* @__PURE__ */ r(o, {
contain: !0,
restoreFocus: !0,
autoFocus: !0,
children: /* @__PURE__ */ r(c, { children: e })
})
});
}, u = ({ children: t }) => {
let n = e();
return r(n === "xs" || n === "sm" ? l : c, { children: t });
};
u.displayName = "TaskMenuContent";
//#endregion
export { u as Content };