Combine chip and chipGroup docs

packages/react-core/src/components/ChipGroup/ChipGroup.tsx → packages/react-core/src/components/Chip/ChipGroup.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import styles from '@patternfly/react-styles/css/components/ChipGroup/chip-group';
 import { css } from '@patternfly/react-styles';
 import { Button } from '../Button';
-import { Chip } from '../Chip';
+import { Chip } from './Chip';
 import { Tooltip, TooltipPosition } from '../Tooltip';
 import TimesCircleIcon from '@patternfly/react-icons/dist/esm/icons/times-circle-icon';
 import { fillTemplate } from '../../helpers';

packages/react-core/src/components/Chip/examples/Chip.md

@@ -2,13 +2,31 @@
 id: Chip
 section: components
 cssPrefix: pf-c-chip
-propComponents: ['Chip']
+propComponents: ['Chip', 'ChipGroup']
 ouia: true
 ---
 
 ## Examples
 
-### Default
+### Chip variants
+Chips can be removable or read-only. The Overflow chip is a special chip that is used to expand or collapse the content of a chip group.
 
 ```ts file='./ChipDefault.tsx'
 ```
+
+### Chip groups
+
+A chip group is a collection of chips that can be grouped by category and used to represent one or more values assigned to a single attribute. When the value of `numChips` is exceeded, additional chips will be hidden using an overflow chip.
+
+```ts file='./ChipGroupInline.tsx'
+```
+
+### Chip groups with categories
+
+```ts file='./ChipGroupWithCategories.tsx'
+```
+
+### Chip groups with removable categories
+
+```ts file='./ChipGroupRemovableCategories.tsx'
+```

packages/react-core/src/components/Chip/index.ts

@@ -1 +1,2 @@
 export * from './Chip';
+export * from './ChipGroup';

packages/react-core/src/components/Toolbar/ToolbarFilter.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { ToolbarItem, ToolbarItemProps } from './ToolbarItem';
-import { ChipGroup } from '../ChipGroup';
+import { ChipGroup } from '../Chip';
 import { Chip } from '../Chip';
 import { ToolbarContentContext, ToolbarContext } from './ToolbarUtils';
 import { PickOptional } from '../../helpers/typeUtils';

packages/react-core/src/components/index.ts

@@ -16,7 +16,6 @@ export * from './CalendarMonth';
 export * from './Card';
 export * from './Checkbox';
 export * from './Chip';
-export * from './ChipGroup';
 export * from './ClipboardCopy';
 export * from './CodeBlock';
 export * from './DataList';

packages/react-core/src/deprecated/components/Select/Select.tsx

@@ -19,7 +19,7 @@ import {
   SelectDirection,
   SelectFooterTabbableItems
 } from './selectConstants';
-import { ChipGroup, ChipGroupProps } from '../../../components/ChipGroup';
+import { ChipGroup, ChipGroupProps } from '../../../components/Chip';
 import { Chip } from '../../../components/Chip';
 import { Spinner } from '../../../components/Spinner';
 import {