@veracity/vui/dist/header/headerServices.js

Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.

import { useStyleConfig } from "../core/theme.js";
import { RenderOnScreen } from "../core/media.js";
import { List } from "../list/list.js";
import { Menu } from "../menu/menu.js";
import { useHeaderContext } from "./context.js";
import { HeaderServicesMessage } from "./headerServicesMessage.js";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";

//#region src/header/headerServices.tsx
/** Supporting internal component to avoid code duplication. */
function ListContent({ links = [] }) {
	const styles = useStyleConfig("Header", useHeaderContext()).services;
	return /* @__PURE__ */ jsx(Fragment, { children: links.length > 0 ? links.map(({ text, url }, index) => /* @__PURE__ */ jsx(Menu.Item, {
		isTruncated: true,
		linkProps: { href: url },
		text,
		title: text,
		...styles.item
	}, index)) : /* @__PURE__ */ jsx(HeaderServicesMessage, {}) });
}
/** Displays a list of services available to the user. */
function HeaderServices(props) {
	const { buttonProps, isApplication = false, links = [], showTopBorder = false, ...rest } = props;
	const styles = useStyleConfig("Header", useHeaderContext()).services;
	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(RenderOnScreen, {
		minWidth: "lg",
		children: /* @__PURE__ */ jsxs(Menu, {
			isLazy: false,
			offset: [isApplication ? 179 : 135, 17],
			placement: "bottom-end",
			size: "lg",
			...rest,
			children: [/* @__PURE__ */ jsx(Menu.Button, {
				className: "vui-services-trigger",
				icon: "uiTh",
				ml: 1,
				size: "lg",
				title: "My services",
				...styles.button,
				...buttonProps
			}), /* @__PURE__ */ jsx(Menu.List, {
				heading: "My Services",
				maxH: 295,
				right: 0,
				w: 320,
				...styles.list,
				children: /* @__PURE__ */ jsx(ListContent, { links })
			})]
		})
	}), /* @__PURE__ */ jsx(RenderOnScreen, {
		maxWidth: "lg",
		children: /* @__PURE__ */ jsx(List, {
			heading: "My Services",
			...styles.list,
			borderTop: showTopBorder ? 1 : 0,
			borderTopColor: "sandstone.main",
			maxH: 295,
			pt: 1,
			children: /* @__PURE__ */ jsx(ListContent, { links })
		})
	})] });
}
HeaderServices.displayName = "HeaderServices";

//#endregion
export { HeaderServices, HeaderServices as default };
globalThis.__vuiVersion__ = "5.3.1"
//# sourceMappingURL=headerServices.js.map