UNPKG

2.49 kBJavaScriptView Raw
1import { __rest } from "tslib";
2import * as React from 'react';
3import { css } from '@patternfly/react-styles';
4import styles from '@patternfly/react-styles/css/components/Wizard/wizard';
5import AngleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-right-icon';
6export const WizardNavItem = (_a) => {
7 var { children = null, content = '', isCurrent = false, isDisabled = false, step, onNavItemClick = () => undefined, navItemComponent = 'button', href = null, isExpandable = false, id } = _a, rest = __rest(_a, ["children", "content", "isCurrent", "isDisabled", "step", "onNavItemClick", "navItemComponent", "href", "isExpandable", "id"]);
8 const NavItemComponent = navItemComponent;
9 const [isExpanded, setIsExpanded] = React.useState(false);
10 React.useEffect(() => {
11 setIsExpanded(isCurrent);
12 }, [isCurrent]);
13 if (navItemComponent === 'a' && !href && process.env.NODE_ENV !== 'production') {
14 // eslint-disable-next-line no-console
15 console.error('WizardNavItem: When using an anchor, please provide an href');
16 }
17 const btnProps = {
18 disabled: isDisabled
19 };
20 const linkProps = {
21 tabIndex: isDisabled ? -1 : undefined,
22 href
23 };
24 return (React.createElement("li", { className: css(styles.wizardNavItem, isExpandable && styles.modifiers.expandable, isExpandable && isExpanded && styles.modifiers.expanded) },
25 React.createElement(NavItemComponent, Object.assign({}, rest, (navItemComponent === 'a' ? Object.assign({}, linkProps) : Object.assign({}, btnProps)), (id && { id: id.toString() }), { onClick: () => (isExpandable ? setIsExpanded(!isExpanded || isCurrent) : onNavItemClick(step)), className: css(styles.wizardNavLink, isCurrent && styles.modifiers.current, isDisabled && styles.modifiers.disabled), "aria-disabled": isDisabled ? true : null, "aria-current": isCurrent && !children ? 'step' : false }, (isExpandable && { 'aria-expanded': isExpanded })), isExpandable ? (React.createElement(React.Fragment, null,
26 React.createElement("span", { className: css(styles.wizardNavLinkText) }, content),
27 React.createElement("span", { className: css(styles.wizardNavLinkToggle) },
28 React.createElement("span", { className: css(styles.wizardNavLinkToggleIcon) },
29 React.createElement(AngleRightIcon, null))))) : (content)),
30 children));
31};
32WizardNavItem.displayName = 'WizardNavItem';
33//# sourceMappingURL=WizardNavItem.js.map
\No newline at end of file