UNPKG

3.34 kBJavaScriptView Raw
1"use strict";
2Object.defineProperty(exports, "__esModule", { value: true });
3exports.Nav = exports.NavContext = exports.navContextDefaults = void 0;
4const tslib_1 = require("tslib");
5const React = tslib_1.__importStar(require("react"));
6const nav_1 = tslib_1.__importDefault(require("@patternfly/react-styles/css/components/Nav/nav"));
7const react_styles_1 = require("@patternfly/react-styles");
8const helpers_1 = require("../../helpers");
9exports.navContextDefaults = {};
10exports.NavContext = React.createContext(exports.navContextDefaults);
11class Nav extends React.Component {
12 constructor() {
13 super(...arguments);
14 this.state = {
15 isScrollable: false,
16 ouiaStateId: helpers_1.getDefaultOUIAId(Nav.displayName, this.props.variant),
17 flyoutRef: null
18 };
19 }
20 // Callback from NavItem
21 onSelect(event, groupId, itemId, to, preventDefault, onClick) {
22 if (preventDefault) {
23 event.preventDefault();
24 }
25 this.props.onSelect({ groupId, itemId, event, to });
26 if (onClick) {
27 onClick(event, itemId, groupId, to);
28 }
29 }
30 // Callback from NavExpandable
31 onToggle(event, groupId, toggleValue) {
32 this.props.onToggle({
33 event,
34 groupId,
35 isExpanded: toggleValue
36 });
37 }
38 render() {
39 const _a = this.props, { 'aria-label': ariaLabel, children, className,
40 // eslint-disable-next-line @typescript-eslint/no-unused-vars
41 onSelect,
42 // eslint-disable-next-line @typescript-eslint/no-unused-vars
43 onToggle, theme, ouiaId, ouiaSafe, variant } = _a, props = tslib_1.__rest(_a, ['aria-label', "children", "className", "onSelect", "onToggle", "theme", "ouiaId", "ouiaSafe", "variant"]);
44 const isHorizontal = ['horizontal', 'tertiary'].includes(variant);
45 return (React.createElement(exports.NavContext.Provider, { value: {
46 onSelect: (event, groupId, itemId, to, preventDefault, onClick) => this.onSelect(event, groupId, itemId, to, preventDefault, onClick),
47 onToggle: (event, groupId, expanded) => this.onToggle(event, groupId, expanded),
48 updateIsScrollable: (isScrollable) => this.setState({ isScrollable }),
49 isHorizontal: ['horizontal', 'tertiary', 'horizontal-subnav'].includes(variant),
50 flyoutRef: this.state.flyoutRef,
51 setFlyoutRef: flyoutRef => this.setState({ flyoutRef })
52 } },
53 React.createElement("nav", Object.assign({ className: react_styles_1.css(nav_1.default.nav, theme === 'light' && nav_1.default.modifiers.light, isHorizontal && nav_1.default.modifiers.horizontal, variant === 'tertiary' && nav_1.default.modifiers.tertiary, variant === 'horizontal-subnav' && nav_1.default.modifiers.horizontalSubnav, this.state.isScrollable && nav_1.default.modifiers.scrollable, className), "aria-label": ariaLabel || (variant === 'tertiary' ? 'Local' : 'Global') }, helpers_1.getOUIAProps(Nav.displayName, ouiaId !== undefined ? ouiaId : this.state.ouiaStateId, ouiaSafe), props), children)));
54 }
55}
56exports.Nav = Nav;
57Nav.displayName = 'Nav';
58Nav.defaultProps = {
59 onSelect: () => undefined,
60 onToggle: () => undefined,
61 theme: 'dark',
62 ouiaSafe: true
63};
64//# sourceMappingURL=Nav.js.map
\No newline at end of file