UNPKG

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