UNPKG

3.21 kBJavaScriptView Raw
1import { __rest } from "tslib";
2import * as React from 'react';
3import * as ReactDOM from 'react-dom';
4import { ToolbarItem } from './ToolbarItem';
5import { ChipGroup } from '../ChipGroup';
6import { Chip } from '../Chip';
7import { ToolbarContentContext, ToolbarContext } from './ToolbarUtils';
8export class ToolbarFilter extends React.Component {
9 constructor(props) {
10 super(props);
11 this.state = {
12 isMounted: false
13 };
14 }
15 componentDidMount() {
16 const { categoryName, chips } = this.props;
17 this.context.updateNumberFilters(typeof categoryName !== 'string' && categoryName.hasOwnProperty('key')
18 ? categoryName.key
19 : categoryName.toString(), chips.length);
20 this.setState({ isMounted: true });
21 }
22 componentDidUpdate() {
23 const { categoryName, chips } = this.props;
24 this.context.updateNumberFilters(typeof categoryName !== 'string' && categoryName.hasOwnProperty('key')
25 ? categoryName.key
26 : categoryName.toString(), chips.length);
27 }
28 render() {
29 const _a = this.props, { children, chips, deleteChipGroup, deleteChip, chipGroupExpandedText, chipGroupCollapsedText, categoryName, showToolbarItem } = _a, props = __rest(_a, ["children", "chips", "deleteChipGroup", "deleteChip", "chipGroupExpandedText", "chipGroupCollapsedText", "categoryName", "showToolbarItem"]);
30 const { isExpanded, chipGroupContentRef } = this.context;
31 const categoryKey = typeof categoryName !== 'string' && categoryName.hasOwnProperty('key')
32 ? categoryName.key
33 : categoryName.toString();
34 const chipGroup = chips.length ? (React.createElement(ToolbarItem, { variant: "chip-group" },
35 React.createElement(ChipGroup, { key: categoryKey, categoryName: typeof categoryName === 'string' ? categoryName : categoryName.name, isClosable: deleteChipGroup !== undefined, onClick: () => deleteChipGroup(categoryName), collapsedText: chipGroupCollapsedText, expandedText: chipGroupExpandedText }, chips.map(chip => typeof chip === 'string' ? (React.createElement(Chip, { key: chip, onClick: () => deleteChip(categoryKey, chip) }, chip)) : (React.createElement(Chip, { key: chip.key, onClick: () => deleteChip(categoryKey, chip) }, chip.node)))))) : null;
36 if (!isExpanded && this.state.isMounted) {
37 return (React.createElement(React.Fragment, null,
38 showToolbarItem && React.createElement(ToolbarItem, Object.assign({}, props), children),
39 ReactDOM.createPortal(chipGroup, chipGroupContentRef.current.firstElementChild)));
40 }
41 return (React.createElement(ToolbarContentContext.Consumer, null, ({ chipContainerRef }) => (React.createElement(React.Fragment, null,
42 showToolbarItem && React.createElement(ToolbarItem, Object.assign({}, props), children),
43 chipContainerRef.current && ReactDOM.createPortal(chipGroup, chipContainerRef.current)))));
44 }
45}
46ToolbarFilter.displayName = 'ToolbarFilter';
47ToolbarFilter.contextType = ToolbarContext;
48ToolbarFilter.defaultProps = {
49 chips: [],
50 showToolbarItem: true
51};
52//# sourceMappingURL=ToolbarFilter.js.map
\No newline at end of file