@trail-ui/react
Version:
28 lines (26 loc) • 974 B
JavaScript
// src/listbox/listbox-section.tsx
import { clsx } from "@trail-ui/shared-utils";
import { menuSection } from "@trail-ui/theme";
import { useMemo } from "react";
import { Header, ListBoxSection as AriaListBoxSection } from "react-aria-components";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
function ListBoxSection(props) {
const { title, children, className, classNames, ...otherProps } = props;
const slots = useMemo(() => menuSection(), []);
const baseStyles = clsx(classNames == null ? void 0 : classNames.base, className);
return /* @__PURE__ */ jsxs(
AriaListBoxSection,
{
"data-group": "true",
className: slots.base({ class: baseStyles }),
...otherProps,
children: [
/* @__PURE__ */ jsx(Header, { className: slots.header({ class: classNames == null ? void 0 : classNames.header }), children: title }),
/* @__PURE__ */ jsx(Fragment, { children })
]
}
);
}
export {
ListBoxSection
};