From 72e966103574ac7c59434b8b92be236f036519fa Mon Sep 17 00:00:00 2001 From: mcarrano Date: Mon, 17 Apr 2023 16:44:21 -0400 Subject: [PATCH 1/8] combine chip and chipGroup docs --- .../{ChipGroup => Chip}/ChipGroup.tsx | 0 .../__tests__/ChipGroup.test.tsx | 0 .../__snapshots__/ChipGroup.test.tsx.snap | 0 .../src/components/Chip/examples/Chip.md | 25 ++++++++++++++++--- .../examples/ChipGroupInline.tsx | 0 .../examples/ChipGroupRemovableCategories.tsx | 0 .../examples/ChipGroupWithCategories.tsx | 0 .../react-core/src/components/Chip/index.ts | 1 + .../ChipGroup/examples/ChipGroup.md | 24 ------------------ .../src/components/ChipGroup/index.ts | 1 - packages/react-core/src/components/index.ts | 1 - 11 files changed, 23 insertions(+), 29 deletions(-) rename packages/react-core/src/components/{ChipGroup => Chip}/ChipGroup.tsx (100%) rename packages/react-core/src/components/{ChipGroup => Chip}/__tests__/ChipGroup.test.tsx (100%) rename packages/react-core/src/components/{ChipGroup => Chip}/__tests__/__snapshots__/ChipGroup.test.tsx.snap (100%) rename packages/react-core/src/components/{ChipGroup => Chip}/examples/ChipGroupInline.tsx (100%) rename packages/react-core/src/components/{ChipGroup => Chip}/examples/ChipGroupRemovableCategories.tsx (100%) rename packages/react-core/src/components/{ChipGroup => Chip}/examples/ChipGroupWithCategories.tsx (100%) delete mode 100644 packages/react-core/src/components/ChipGroup/examples/ChipGroup.md delete mode 100644 packages/react-core/src/components/ChipGroup/index.ts diff --git a/packages/react-core/src/components/ChipGroup/ChipGroup.tsx b/packages/react-core/src/components/Chip/ChipGroup.tsx similarity index 100% rename from packages/react-core/src/components/ChipGroup/ChipGroup.tsx rename to packages/react-core/src/components/Chip/ChipGroup.tsx diff --git a/packages/react-core/src/components/ChipGroup/__tests__/ChipGroup.test.tsx b/packages/react-core/src/components/Chip/__tests__/ChipGroup.test.tsx similarity index 100% rename from packages/react-core/src/components/ChipGroup/__tests__/ChipGroup.test.tsx rename to packages/react-core/src/components/Chip/__tests__/ChipGroup.test.tsx diff --git a/packages/react-core/src/components/ChipGroup/__tests__/__snapshots__/ChipGroup.test.tsx.snap b/packages/react-core/src/components/Chip/__tests__/__snapshots__/ChipGroup.test.tsx.snap similarity index 100% rename from packages/react-core/src/components/ChipGroup/__tests__/__snapshots__/ChipGroup.test.tsx.snap rename to packages/react-core/src/components/Chip/__tests__/__snapshots__/ChipGroup.test.tsx.snap diff --git a/packages/react-core/src/components/Chip/examples/Chip.md b/packages/react-core/src/components/Chip/examples/Chip.md index c740435a418..a66eef7a1d6 100644 --- a/packages/react-core/src/components/Chip/examples/Chip.md +++ b/packages/react-core/src/components/Chip/examples/Chip.md @@ -2,13 +2,32 @@ id: Chip section: components cssPrefix: pf-c-chip -propComponents: ['Chip'] +propComponents: ['Chip', 'ChipGroup'] ouia: true --- -## Examples +## Chip examples -### Default +### 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 group examples +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. + +### Simple inline + +```ts file='./ChipGroupInline.tsx' +``` + +### With categories + +```ts file='./ChipGroupWithCategories.tsx' +``` + +### With removable categories + +```ts file='./ChipGroupRemovableCategories.tsx' +``` diff --git a/packages/react-core/src/components/ChipGroup/examples/ChipGroupInline.tsx b/packages/react-core/src/components/Chip/examples/ChipGroupInline.tsx similarity index 100% rename from packages/react-core/src/components/ChipGroup/examples/ChipGroupInline.tsx rename to packages/react-core/src/components/Chip/examples/ChipGroupInline.tsx diff --git a/packages/react-core/src/components/ChipGroup/examples/ChipGroupRemovableCategories.tsx b/packages/react-core/src/components/Chip/examples/ChipGroupRemovableCategories.tsx similarity index 100% rename from packages/react-core/src/components/ChipGroup/examples/ChipGroupRemovableCategories.tsx rename to packages/react-core/src/components/Chip/examples/ChipGroupRemovableCategories.tsx diff --git a/packages/react-core/src/components/ChipGroup/examples/ChipGroupWithCategories.tsx b/packages/react-core/src/components/Chip/examples/ChipGroupWithCategories.tsx similarity index 100% rename from packages/react-core/src/components/ChipGroup/examples/ChipGroupWithCategories.tsx rename to packages/react-core/src/components/Chip/examples/ChipGroupWithCategories.tsx diff --git a/packages/react-core/src/components/Chip/index.ts b/packages/react-core/src/components/Chip/index.ts index 99a3b024126..f933380d874 100644 --- a/packages/react-core/src/components/Chip/index.ts +++ b/packages/react-core/src/components/Chip/index.ts @@ -1 +1,2 @@ export * from './Chip'; +export * from './ChipGroup'; diff --git a/packages/react-core/src/components/ChipGroup/examples/ChipGroup.md b/packages/react-core/src/components/ChipGroup/examples/ChipGroup.md deleted file mode 100644 index 05da15f952c..00000000000 --- a/packages/react-core/src/components/ChipGroup/examples/ChipGroup.md +++ /dev/null @@ -1,24 +0,0 @@ ---- -id: Chip group -section: components -cssPrefix: pf-c-chip-group -propComponents: ['Chip', 'ChipGroup'] -ouia: true ---- - -## Examples - -### Simple inline - -```ts file='./ChipGroupInline.tsx' -``` - -### With categories - -```ts file='./ChipGroupWithCategories.tsx' -``` - -### With removable categories - -```ts file='./ChipGroupRemovableCategories.tsx' -``` diff --git a/packages/react-core/src/components/ChipGroup/index.ts b/packages/react-core/src/components/ChipGroup/index.ts deleted file mode 100644 index 8cee49e3dc5..00000000000 --- a/packages/react-core/src/components/ChipGroup/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './ChipGroup'; diff --git a/packages/react-core/src/components/index.ts b/packages/react-core/src/components/index.ts index 2966f26f337..356b93ed497 100644 --- a/packages/react-core/src/components/index.ts +++ b/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'; From 9fe0719d28873974bd66e0cebb0482ef9217a416 Mon Sep 17 00:00:00 2001 From: mcarrano Date: Thu, 20 Apr 2023 14:09:55 -0400 Subject: [PATCH 2/8] Change ChipGroup imports to /Chips folder --- packages/react-core/src/components/Toolbar/ToolbarFilter.tsx | 2 +- packages/react-core/src/deprecated/components/Select/Select.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react-core/src/components/Toolbar/ToolbarFilter.tsx b/packages/react-core/src/components/Toolbar/ToolbarFilter.tsx index 5e7c85044b2..e467e208b3c 100644 --- a/packages/react-core/src/components/Toolbar/ToolbarFilter.tsx +++ b/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'; diff --git a/packages/react-core/src/deprecated/components/Select/Select.tsx b/packages/react-core/src/deprecated/components/Select/Select.tsx index 74f9ea49158..c0f0853089a 100644 --- a/packages/react-core/src/deprecated/components/Select/Select.tsx +++ b/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 { From ec778d22a6bf97fbc5f1cb1bac68271939a02cf2 Mon Sep 17 00:00:00 2001 From: mcarrano Date: Fri, 21 Apr 2023 16:20:37 -0400 Subject: [PATCH 3/8] fix Chip import --- packages/react-core/src/components/Chip/ChipGroup.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-core/src/components/Chip/ChipGroup.tsx b/packages/react-core/src/components/Chip/ChipGroup.tsx index e6ddf7a27b7..242a45ce706 100644 --- a/packages/react-core/src/components/Chip/ChipGroup.tsx +++ b/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'; From fad5139102a2b0d839dbbd961f5591deff8b2135 Mon Sep 17 00:00:00 2001 From: mcarrano Date: Mon, 24 Apr 2023 15:55:38 -0400 Subject: [PATCH 4/8] Fix text styling --- packages/react-core/src/components/Chip/examples/Chip.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-core/src/components/Chip/examples/Chip.md b/packages/react-core/src/components/Chip/examples/Chip.md index a66eef7a1d6..2499f224301 100644 --- a/packages/react-core/src/components/Chip/examples/Chip.md +++ b/packages/react-core/src/components/Chip/examples/Chip.md @@ -15,7 +15,7 @@ Chips can be removable or read-only. The Overflow chip is a special chip that is ``` ## Chip group examples -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. +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. ### Simple inline From ceefc91ce19b213f7cde99f8fc78d6743300aa0c Mon Sep 17 00:00:00 2001 From: mcarrano Date: Tue, 25 Apr 2023 14:20:46 -0400 Subject: [PATCH 5/8] Update packages/react-core/src/components/Chip/examples/Chip.md Co-authored-by: edonehoo <105813956+edonehoo@users.noreply.github.com> --- packages/react-core/src/components/Chip/examples/Chip.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-core/src/components/Chip/examples/Chip.md b/packages/react-core/src/components/Chip/examples/Chip.md index 2499f224301..9fbf2aa22ff 100644 --- a/packages/react-core/src/components/Chip/examples/Chip.md +++ b/packages/react-core/src/components/Chip/examples/Chip.md @@ -22,7 +22,7 @@ A chip group is a collection of chips that can be grouped by category and used t ```ts file='./ChipGroupInline.tsx' ``` -### With categories +### Chip groups with categories ```ts file='./ChipGroupWithCategories.tsx' ``` From 5556c325b2050ffcfe9c51fc69ef04aed7f0093b Mon Sep 17 00:00:00 2001 From: mcarrano Date: Tue, 25 Apr 2023 14:21:40 -0400 Subject: [PATCH 6/8] Update packages/react-core/src/components/Chip/examples/Chip.md Co-authored-by: edonehoo <105813956+edonehoo@users.noreply.github.com> --- packages/react-core/src/components/Chip/examples/Chip.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-core/src/components/Chip/examples/Chip.md b/packages/react-core/src/components/Chip/examples/Chip.md index 9fbf2aa22ff..47d02bc4c59 100644 --- a/packages/react-core/src/components/Chip/examples/Chip.md +++ b/packages/react-core/src/components/Chip/examples/Chip.md @@ -27,7 +27,7 @@ A chip group is a collection of chips that can be grouped by category and used t ```ts file='./ChipGroupWithCategories.tsx' ``` -### With removable categories +### Chip groups with removable categories ```ts file='./ChipGroupRemovableCategories.tsx' ``` From b67473dd039c374c47f5c9738d9488f4aa7f1543 Mon Sep 17 00:00:00 2001 From: mcarrano Date: Tue, 25 Apr 2023 14:24:23 -0400 Subject: [PATCH 7/8] Update packages/react-core/src/components/Chip/examples/Chip.md Co-authored-by: edonehoo <105813956+edonehoo@users.noreply.github.com> --- packages/react-core/src/components/Chip/examples/Chip.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-core/src/components/Chip/examples/Chip.md b/packages/react-core/src/components/Chip/examples/Chip.md index 47d02bc4c59..14341188b62 100644 --- a/packages/react-core/src/components/Chip/examples/Chip.md +++ b/packages/react-core/src/components/Chip/examples/Chip.md @@ -8,7 +8,7 @@ ouia: true ## Chip examples -### Variants +### 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' From 1b591513e9216661cc01de711fc5b17bd869f6e0 Mon Sep 17 00:00:00 2001 From: mcarrano Date: Mon, 1 May 2023 10:14:30 -0400 Subject: [PATCH 8/8] More text updates --- packages/react-core/src/components/Chip/examples/Chip.md | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/packages/react-core/src/components/Chip/examples/Chip.md b/packages/react-core/src/components/Chip/examples/Chip.md index 14341188b62..10c452cbb83 100644 --- a/packages/react-core/src/components/Chip/examples/Chip.md +++ b/packages/react-core/src/components/Chip/examples/Chip.md @@ -6,7 +6,7 @@ propComponents: ['Chip', 'ChipGroup'] ouia: true --- -## Chip examples +## Examples ### 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. @@ -14,10 +14,9 @@ Chips can be removable or read-only. The Overflow chip is a special chip that is ```ts file='./ChipDefault.tsx' ``` -## Chip group examples -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. +### Chip groups -### Simple inline +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' ```