1 | import { __rest } from "tslib";
|
2 | import * as React from 'react';
|
3 | import { css } from '@patternfly/react-styles';
|
4 | import styles from '@patternfly/react-styles/css/components/AppLauncher/app-launcher';
|
5 | import formStyles from '@patternfly/react-styles/css/components/FormControl/form-control';
|
6 | import ThIcon from '@patternfly/react-icons/dist/esm/icons/th-icon';
|
7 | import { DropdownDirection, DropdownPosition, DropdownToggle, DropdownContext } from '../Dropdown';
|
8 | import { DropdownWithContext } from '../Dropdown/DropdownWithContext';
|
9 | import { ApplicationLauncherGroup } from './ApplicationLauncherGroup';
|
10 | import { ApplicationLauncherSeparator } from './ApplicationLauncherSeparator';
|
11 | import { ApplicationLauncherItem } from './ApplicationLauncherItem';
|
12 | import { ApplicationLauncherContext } from './ApplicationLauncherContext';
|
13 | import { createRenderableFavorites, extendItemsWithFavorite } from '../../helpers/favorites';
|
14 | export class ApplicationLauncher extends React.Component {
|
15 | constructor() {
|
16 | super(...arguments);
|
17 | this.createSearchBox = () => {
|
18 | const { onSearch, searchPlaceholderText, searchProps } = this.props;
|
19 | return (React.createElement("div", { key: "search", className: css(styles.appLauncherMenuSearch) },
|
20 | React.createElement(ApplicationLauncherItem, { customChild: React.createElement("input", Object.assign({ type: "search", className: css(formStyles.formControl), placeholder: searchPlaceholderText, onChange: e => onSearch(e.target.value) }, searchProps)) })));
|
21 | };
|
22 | }
|
23 | render() {
|
24 | const _a = this.props, { 'aria-label': ariaLabel, isOpen, onToggle, toggleIcon, toggleId, onSelect, isDisabled, className, isGrouped, favorites, onFavorite, onSearch, items,
|
25 |
|
26 | searchPlaceholderText, searchProps, ref,
|
27 |
|
28 | favoritesLabel, searchNoResultsText, menuAppendTo } = _a, props = __rest(_a, ['aria-label', "isOpen", "onToggle", "toggleIcon", "toggleId", "onSelect", "isDisabled", "className", "isGrouped", "favorites", "onFavorite", "onSearch", "items", "searchPlaceholderText", "searchProps", "ref", "favoritesLabel", "searchNoResultsText", "menuAppendTo"]);
|
29 | let renderableItems = [];
|
30 | if (onFavorite) {
|
31 | let favoritesGroup = [];
|
32 | let renderableFavorites = [];
|
33 | if (favorites.length > 0) {
|
34 | renderableFavorites = createRenderableFavorites(items, isGrouped, favorites, true);
|
35 | favoritesGroup = [
|
36 | React.createElement(ApplicationLauncherGroup, { key: "favorites", label: favoritesLabel },
|
37 | renderableFavorites,
|
38 | React.createElement(ApplicationLauncherSeparator, { key: "separator" }))
|
39 | ];
|
40 | }
|
41 | if (renderableFavorites.length > 0) {
|
42 | renderableItems = favoritesGroup.concat(extendItemsWithFavorite(items, isGrouped, favorites));
|
43 | }
|
44 | else {
|
45 | renderableItems = extendItemsWithFavorite(items, isGrouped, favorites);
|
46 | }
|
47 | }
|
48 | else {
|
49 | renderableItems = items;
|
50 | }
|
51 | if (items.length === 0) {
|
52 | renderableItems = [
|
53 | React.createElement(ApplicationLauncherGroup, { key: "no-results-group" },
|
54 | React.createElement(ApplicationLauncherItem, { key: "no-results" }, searchNoResultsText))
|
55 | ];
|
56 | }
|
57 | if (onSearch) {
|
58 | renderableItems = [this.createSearchBox(), ...renderableItems];
|
59 | }
|
60 | return (React.createElement(ApplicationLauncherContext.Provider, { value: { onFavorite } },
|
61 | React.createElement(DropdownContext.Provider, { value: {
|
62 | onSelect,
|
63 | menuClass: styles.appLauncherMenu,
|
64 | itemClass: styles.appLauncherMenuItem,
|
65 | toggleClass: styles.appLauncherToggle,
|
66 | baseClass: styles.appLauncher,
|
67 | baseComponent: 'nav',
|
68 | sectionClass: styles.appLauncherGroup,
|
69 | sectionTitleClass: styles.appLauncherGroupTitle,
|
70 | sectionComponent: 'section',
|
71 | disabledClass: styles.modifiers.disabled,
|
72 | ouiaComponentType: ApplicationLauncher.displayName
|
73 | } },
|
74 | React.createElement(DropdownWithContext, Object.assign({}, props, { dropdownItems: renderableItems, isOpen: isOpen, className: className, "aria-label": ariaLabel, menuAppendTo: menuAppendTo, toggle: React.createElement(DropdownToggle, { id: toggleId, toggleIndicator: null, isOpen: isOpen, onToggle: onToggle, isDisabled: isDisabled, "aria-label": ariaLabel }, toggleIcon), isGrouped: isGrouped })))));
|
75 | }
|
76 | }
|
77 | ApplicationLauncher.displayName = 'ApplicationLauncher';
|
78 | ApplicationLauncher.defaultProps = {
|
79 | className: '',
|
80 | isDisabled: false,
|
81 | direction: DropdownDirection.down,
|
82 | favorites: [],
|
83 | isOpen: false,
|
84 | position: DropdownPosition.left,
|
85 |
|
86 | onSelect: (_event) => undefined,
|
87 | onToggle: (_value) => undefined,
|
88 |
|
89 | 'aria-label': 'Application launcher',
|
90 | isGrouped: false,
|
91 | toggleIcon: React.createElement(ThIcon, null),
|
92 | searchPlaceholderText: 'Filter by name...',
|
93 | searchNoResultsText: 'No results found',
|
94 | favoritesLabel: 'Favorites',
|
95 | menuAppendTo: 'inline'
|
96 | };
|
97 |
|
\ | No newline at end of file |