@hitachivantara/uikit-react-core
Version:
Core React components for the NEXT Design System.
66 lines (65 loc) • 2.65 kB
JavaScript
;
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
const icons = require("../../icons.cjs");
const NavigationSlider_styles = require("./NavigationSlider.styles.cjs");
const Button = require("../../Button/Button.cjs");
const ListContainer = require("../../ListContainer/ListContainer.cjs");
const ListItem = require("../../ListContainer/ListItem/ListItem.cjs");
const OverflowTooltip = require("../../OverflowTooltip/OverflowTooltip.cjs");
const HvVerticalNavigationSlider = (props) => {
const {
className,
classes: classesProp,
data,
selected,
onNavigateToTarget,
onNavigateToChild,
forwardButtonAriaLabel = "Navigate to submenu",
...others
} = uikitReactUtils.useDefaultProps("HvVerticalNavigationSlider", props);
const { classes, cx } = NavigationSlider_styles.useClasses(classesProp);
return /* @__PURE__ */ jsxRuntime.jsx(
ListContainer.HvListContainer,
{
interactive: true,
className: cx(classes.listContainer, className),
...others,
children: data?.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
ListItem.HvListItem,
{
classes: {
root: classes.root,
selected: classes.listItemSelected,
focus: classes.listItemFocus,
disabled: classes.listItemDisabled
},
onClick: (event) => {
onNavigateToTarget?.(event, item);
},
"aria-label": item.label,
"aria-current": selected === item.id ? item.href ? "page" : true : void 0,
selected: selected === item.id,
startAdornment: item.icon ? /* @__PURE__ */ jsxRuntime.jsx("div", { children: item.icon }) : void 0,
endAdornment: item.data && item.data.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
Button.HvButton,
{
icon: true,
onClick: (event) => {
onNavigateToChild?.(event, item);
},
className: classes.forwardButton,
"aria-label": forwardButtonAriaLabel,
children: /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "CaretRight", size: "xs" })
}
) : void 0,
children: /* @__PURE__ */ jsxRuntime.jsx(OverflowTooltip.HvOverflowTooltip, { data: item.label })
},
item.id
))
}
);
};
exports.verticalNavigationSliderClasses = NavigationSlider_styles.staticClasses;
exports.HvVerticalNavigationSlider = HvVerticalNavigationSlider;