From 23cf7fca4764178e91dc4e054677a316d2e44f8e Mon Sep 17 00:00:00 2001 From: Evan Date: Thu, 5 Mar 2020 10:01:33 -0500 Subject: [PATCH 01/73] fix(ouia): don't omit ouiaContext (#3872) --- packages/react-core/src/components/withOuia/withOuia.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/react-core/src/components/withOuia/withOuia.tsx b/packages/react-core/src/components/withOuia/withOuia.tsx index d8f169fc177..4721736b70d 100644 --- a/packages/react-core/src/components/withOuia/withOuia.tsx +++ b/packages/react-core/src/components/withOuia/withOuia.tsx @@ -17,11 +17,11 @@ export interface OuiaContextProps { /** * @param { React.ComponentClass | React.FunctionComponent } WrappedComponent - React component */ -export function withOuiaContext

>( +export function withOuiaContext

( WrappedComponent: React.ComponentClass

| React.FunctionComponent

-): React.FunctionComponent { +): React.FunctionComponent

{ /* eslint-disable react/display-name */ - return (props: R) => ( + return (props: P) => ( {(value: OuiaContextProps) => ( From c7bfe03c54caf2ffcc215ab359c98cf0359c035e Mon Sep 17 00:00:00 2001 From: zallen <47335686+redallen@users.noreply.github.com> Date: Thu, 5 Mar 2020 10:55:23 -0500 Subject: [PATCH 02/73] feat(Modal): add description property (#3821) * feat(Modal): add description property, update id location when desc exists * fix(Modal): lint error * feat(Modal): add description to Modal * feat(Modal): add description example to integration and cypress * feat(Modal): update docs --- .../react-core/src/components/Modal/Modal.tsx | 2 + .../src/components/Modal/ModalContent.tsx | 11 ++- .../Modal/__tests__/ModalContent.test.tsx | 9 ++ .../__snapshots__/ModalContent.test.tsx.snap | 46 +++++++++++ .../src/components/Modal/examples/Modal.md | 82 +++++++++++++++---- .../cypress/integration/modal.spec.ts | 19 +++++ .../components/demos/ModalDemo/ModalDemo.tsx | 46 +++++++++++ 7 files changed, 197 insertions(+), 18 deletions(-) diff --git a/packages/react-core/src/components/Modal/Modal.tsx b/packages/react-core/src/components/Modal/Modal.tsx index c88e3562625..00427055c2e 100644 --- a/packages/react-core/src/components/Modal/Modal.tsx +++ b/packages/react-core/src/components/Modal/Modal.tsx @@ -44,6 +44,8 @@ export interface ModalProps extends React.HTMLProps { appendTo?: HTMLElement | (() => HTMLElement); /** Flag to disable focus trap */ disableFocusTrap?: boolean; + /** Description of the modal */ + description?: React.ReactNode; } interface ModalState { diff --git a/packages/react-core/src/components/Modal/ModalContent.tsx b/packages/react-core/src/components/Modal/ModalContent.tsx index d6412558875..e7e3e0fa319 100644 --- a/packages/react-core/src/components/Modal/ModalContent.tsx +++ b/packages/react-core/src/components/Modal/ModalContent.tsx @@ -7,6 +7,7 @@ const FocusTrap: any = require('focus-trap-react'); import styles from '@patternfly/react-styles/css/layouts/Bullseye/bullseye'; import titleStyles from '@patternfly/react-styles/css/components/Title/title'; +import modalStyles from '@patternfly/react-styles/css/components/ModalBox/modal-box'; import { css } from '@patternfly/react-styles'; import { Backdrop } from '../Backdrop/Backdrop'; @@ -29,6 +30,8 @@ export interface ModalContentProps { isOpen?: boolean; /** Complex header (more than just text), supersedes title for header content */ header?: React.ReactNode; + /** Description of the modal */ + description?: React.ReactNode; /** Simple text content of the Modal Header, also used for aria-label on the body */ title: string; /** Flag to show the title (ignored for custom headers) */ @@ -58,6 +61,7 @@ export const ModalContent: React.FunctionComponent = ({ className = '', isOpen = false, header = null, + description = null, title, hideTitle = false, showClose = true, @@ -100,7 +104,12 @@ export const ModalContent: React.FunctionComponent = ({ > {showClose && } {modalBoxHeader} - + {description && ( +

+ {description} +
+ )} + {children} {modalBoxFooter} diff --git a/packages/react-core/src/components/Modal/__tests__/ModalContent.test.tsx b/packages/react-core/src/components/Modal/__tests__/ModalContent.test.tsx index b37b08c477d..b479d065103 100644 --- a/packages/react-core/src/components/Modal/__tests__/ModalContent.test.tsx +++ b/packages/react-core/src/components/Modal/__tests__/ModalContent.test.tsx @@ -21,6 +21,15 @@ test('Modal Content Test isOpen', () => { expect(view).toMatchSnapshot(); }); +test('Modal Content Test description', () => { + const view = shallow( + + This is a ModalBox header + + ); + expect(view).toMatchSnapshot(); +}); + test('Modal Content Test with footer', () => { const view = shallow( diff --git a/packages/react-core/src/components/Modal/__tests__/__snapshots__/ModalContent.test.tsx.snap b/packages/react-core/src/components/Modal/__tests__/__snapshots__/ModalContent.test.tsx.snap index ab1f5e8d564..a20dadff1bf 100644 --- a/packages/react-core/src/components/Modal/__tests__/__snapshots__/ModalContent.test.tsx.snap +++ b/packages/react-core/src/components/Modal/__tests__/__snapshots__/ModalContent.test.tsx.snap @@ -1,5 +1,51 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`Modal Content Test description 1`] = ` + + + + + + + Test Modal Content title + + +
+ This is a test description. +
+ + This is a ModalBox header + +
+
+
+`; + exports[`Modal Content Test isOpen 1`] = ` { + this.setState(({ isModalOpen }) => ({ + isModalOpen: !isModalOpen + })); + }; + } + + render() { + const { isModalOpen } = this.state; + + return ( + + + + Confirm + , + + ]} + isFooterLeftAligned + > + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore + magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo + consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla + pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id + est laborum. + + + ); + } +} +``` + ```js title=Small import React from 'react'; import { Modal, Button } from '@patternfly/react-core'; @@ -241,19 +295,17 @@ class CustomHeaderFooter extends React.Component { const header = ( - + <Title headingLevel={TitleLevel.h1} size={BaseSizes['2xl']}> Custom Modal Header/Footer -

- Allows for custom content in the header and/or footer by passing components. -

+

Allows for custom content in the header and/or footer by passing components.

); const footer = ( <WarningTriangleIcon /> - <span className="pf-u-pl-sm">Custom modal footer.</span> + <span className="pf-u-pl-sm">Custom modal footer.</span> ); @@ -278,9 +330,9 @@ class CustomHeaderFooter extends React.Component {

- Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. - Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. - Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. + Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis + aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint + occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. ); @@ -307,11 +359,7 @@ class NoHeader extends React.Component { render() { const { isModalOpen } = this.state; - const footer = ( - - Modal Footer - - ); + const footer = Modal Footer; return ( @@ -335,9 +383,9 @@ class NoHeader extends React.Component {

- Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. - Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. - Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. + Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis + aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint + occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
); diff --git a/packages/react-integration/cypress/integration/modal.spec.ts b/packages/react-integration/cypress/integration/modal.spec.ts index 920d484ef48..2c0bf3bc4ee 100644 --- a/packages/react-integration/cypress/integration/modal.spec.ts +++ b/packages/react-integration/cypress/integration/modal.spec.ts @@ -24,6 +24,25 @@ describe('Modal Test', () => { }); }); + it('Verify Description Modal', () => { + cy.get('#showDescriptionModalButton').then((modalButton: JQuery) => { + cy.wrap(modalButton).click(); + cy.get('.pf-c-modal-box') + .then(() => { + cy.get('.pf-c-modal-box .pf-c-button[aria-label="Close"]').then(closeButton => { + cy.wrap(closeButton).click(); + cy.get('.pf-c-modal-box').should('not.exist'); + }); + }) + .then(() => { + cy.wrap(modalButton).click(); + cy.get('.pf-c-modal-box').should('exist'); + cy.get('body').trigger('keydown', { keyCode: 27, which: 27 }); + cy.get('.pf-c-modal-box').should('not.exist'); + }); + }); + }); + it('Verify Small Modal', () => { cy.get('#showSmallModalButton').then((modalButton: JQuery) => { cy.wrap(modalButton).click(); diff --git a/packages/react-integration/demo-app-ts/src/components/demos/ModalDemo/ModalDemo.tsx b/packages/react-integration/demo-app-ts/src/components/demos/ModalDemo/ModalDemo.tsx index c4f2b512788..c532c2574fb 100644 --- a/packages/react-integration/demo-app-ts/src/components/demos/ModalDemo/ModalDemo.tsx +++ b/packages/react-integration/demo-app-ts/src/components/demos/ModalDemo/ModalDemo.tsx @@ -4,6 +4,7 @@ import WarningTriangleIcon from '@patternfly/react-icons/dist/js/icons/warning-t interface ModalDemoState { isModalOpen: boolean; + isModalDescriptionOpen: boolean; isSmallModalOpen: boolean; isLargeModalOpen: boolean; isHalfWidthModalOpen: boolean; @@ -14,6 +15,7 @@ interface ModalDemoState { export class ModalDemo extends React.Component, ModalDemoState> { state = { isModalOpen: false, + isModalDescriptionOpen: false, isSmallModalOpen: false, isLargeModalOpen: false, isHalfWidthModalOpen: false, @@ -27,6 +29,12 @@ export class ModalDemo extends React.Component, })); }; + handleModalDescriptionToggle = () => { + this.setState(({ isModalDescriptionOpen }) => ({ + isModalDescriptionOpen: !isModalDescriptionOpen + })); + }; + handleSmallModalToggle = () => { this.setState(({ isSmallModalOpen }) => ({ isSmallModalOpen: !isSmallModalOpen @@ -88,6 +96,35 @@ export class ModalDemo extends React.Component, ); } + renderModalWithDescription() { + const { isModalDescriptionOpen } = this.state; + + return ( + + Cancel + , + + ]} + isFooterLeftAligned + > + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore + magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo + consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla + pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est + laborum. + + ); + } + renderSmallModal() { const { isSmallModalOpen } = this.state; @@ -283,6 +320,14 @@ export class ModalDemo extends React.Component, > Show No Header Modal + {this.renderModal()} {this.renderSmallModal()} @@ -290,6 +335,7 @@ export class ModalDemo extends React.Component, {this.renderHalfWidthModal()} {this.renderCustomHeaderFooterModal()} {this.renderNoHeaderModal()} + {this.renderModalWithDescription()} ); } From 18d9b7b756e985304864e52b09f5f1d1789791f8 Mon Sep 17 00:00:00 2001 From: zallen <47335686+redallen@users.noreply.github.com> Date: Thu, 5 Mar 2020 10:55:53 -0500 Subject: [PATCH 03/73] feat(DataList): add compact data list (#3807) * feat(DataList): add compact flag * feat(DataList): update tests, snapshots * feat(DataList): add compact demo to integration * feat(DataList): move integration demo back to integration * docs(DataList): update aria label on example --- .../src/components/DataList/DataList.tsx | 9 +- .../DataList/__tests__/DataList.test.tsx | 5 + .../__snapshots__/DataList.test.tsx.snap | 17 +++ .../components/DataList/examples/DataList.md | 128 ++++++++++++++---- .../cypress/integration/datalist.spec.ts | 34 +++++ .../demo-app-ts/src/Demos.ts | 5 + .../DataListDemo/DataListCompactDemo.tsx | 66 +++++++++ .../demo-app-ts/src/components/demos/index.ts | 1 + 8 files changed, 240 insertions(+), 25 deletions(-) create mode 100644 packages/react-integration/demo-app-ts/src/components/demos/DataListDemo/DataListCompactDemo.tsx diff --git a/packages/react-core/src/components/DataList/DataList.tsx b/packages/react-core/src/components/DataList/DataList.tsx index 788cd14a695..aebf6758fe6 100644 --- a/packages/react-core/src/components/DataList/DataList.tsx +++ b/packages/react-core/src/components/DataList/DataList.tsx @@ -15,6 +15,8 @@ export interface DataListProps extends React.HTMLProps { onSelectDataListItem?: (id: string) => void; /* Id of DataList item currently selected */ selectedDataListItemId?: string; + /** Flag indicating if DataList should have compact styling */ + isCompact?: boolean; } interface DataListContextProps { @@ -33,6 +35,7 @@ export const DataList: React.FunctionComponent = ({ 'aria-label': ariaLabel, selectedDataListItemId = '', onSelectDataListItem, + isCompact = false, ...props }: DataListProps) => { const isSelectable = !isUndefined(onSelectDataListItem); @@ -49,7 +52,11 @@ export const DataList: React.FunctionComponent = ({ updateSelectedDataListItem }} > -
    +
      {children}
    diff --git a/packages/react-core/src/components/DataList/__tests__/DataList.test.tsx b/packages/react-core/src/components/DataList/__tests__/DataList.test.tsx index fef16bad9aa..6ebb33d023f 100644 --- a/packages/react-core/src/components/DataList/__tests__/DataList.test.tsx +++ b/packages/react-core/src/components/DataList/__tests__/DataList.test.tsx @@ -18,6 +18,11 @@ describe('DataList', () => { expect(view).toMatchSnapshot(); }); + test('List compact', () => { + const view = shallow(); + expect(view).toMatchSnapshot(); + }); + test('List', () => { const view = shallow(); expect(view).toMatchSnapshot(); diff --git a/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataList.test.tsx.snap b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataList.test.tsx.snap index d509507f326..a1458165bf7 100644 --- a/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataList.test.tsx.snap +++ b/packages/react-core/src/components/DataList/__tests__/__snapshots__/DataList.test.tsx.snap @@ -128,6 +128,23 @@ exports[`DataList List 1`] = ` `; +exports[`DataList List compact 1`] = ` + +
      + +`; + exports[`DataList List default 1`] = ` ( + + + + + Primary content + , + Secondary content + ]} + /> + + + + + + Secondary content (pf-m-no-fill) + , + + Secondary content (pf-m-align-right pf-m-no-fill) + + ]} + /> + + + +); +``` + +```js title=Compact import React from 'react'; import { Button, @@ -45,7 +108,7 @@ import { } from '@patternfly/react-core'; SimpleDataList = () => ( - + } dropdownItems={[ - Primary, - Secondary, + + Primary + , + + Secondary + ]} /> @@ -249,10 +316,18 @@ class CheckboxActionDataList extends React.Component { onSelect={this.onSelect3} toggle={} dropdownItems={[ - Primary, - Secondary, - Secondary, - Secondary, + + Primary + , + + Secondary + , + + Secondary + , + + Secondary + ]} /> @@ -825,6 +900,7 @@ class ModifiersDataList extends React.Component { } } ``` + ```js title=Selectable-rows import React from 'react'; import { @@ -845,17 +921,17 @@ import { class SelectableDataList extends React.Component { constructor(props) { super(props); - this.state = { + this.state = { isOpen1: false, isOpen2: false, selectedDataListItemId: '' }; - this.onToggle1 = isOpen1 => { + this.onToggle1 = isOpen1 => { this.setState({ isOpen1 }); }; - - this.onToggle2 = isOpen2 => { + + this.onToggle2 = isOpen2 => { this.setState({ isOpen2 }); }; @@ -864,22 +940,26 @@ class SelectableDataList extends React.Component { isOpen1: !prevState.isOpen1 })); }; - + this.onSelect2 = event => { this.setState(prevState => ({ isOpen2: !prevState.isOpen2 })); }; - - this.onSelectDataListItem = (id) => { + + this.onSelectDataListItem = id => { this.setState({ selectedDataListItemId: id }); - } + }; } render() { return ( - + {!this.state.isDeleted && ( diff --git a/packages/react-integration/cypress/integration/datalist.spec.ts b/packages/react-integration/cypress/integration/datalist.spec.ts index 75a5120abff..3c398bfbd14 100644 --- a/packages/react-integration/cypress/integration/datalist.spec.ts +++ b/packages/react-integration/cypress/integration/datalist.spec.ts @@ -31,3 +31,37 @@ describe('Data List Demo Test', () => { cy.get('#row2.pf-m-selected').should('be.visible'); }); }); + +describe('Data List Compact Demo Test', () => { + it('Navigate to demo section', () => { + cy.visit('http://localhost:3000/'); + cy.get('#data-list-compact-demo-nav-item-link').click(); + cy.url().should('eq', 'http://localhost:3000/data-list-compact-demo-nav-link'); + }); + + it('Verify header', () => { + cy.get('#simple-item1').contains('Primary content'); + cy.get('#simple-item2').contains('Secondary content'); + }); + + it('Verify body content', () => { + cy.get('#simple-item3').contains('Secondary content (pf-m-no-fill)'); + cy.get('#simple-item4').contains('Secondary content (pf-m-align-right pf-m-no-fill)'); + }); + + it('Verify rows selectable', () => { + cy.get('#row1.pf-m-selectable').should('be.visible'); + cy.get('#row2.pf-m-selectable').should('be.visible'); + + cy.get('#row1.pf-m-selected').should('not.be.visible'); + cy.get('#row2.pf-m-selected').should('not.be.visible'); + + cy.get('#row1').click(); + cy.get('#row1.pf-m-selected').should('be.visible'); + cy.get('#row2.pf-m-selected').should('not.be.visible'); + + cy.get('#row2').click(); + cy.get('#row1.pf-m-selected').should('not.be.visible'); + cy.get('#row2.pf-m-selected').should('be.visible'); + }); +}); diff --git a/packages/react-integration/demo-app-ts/src/Demos.ts b/packages/react-integration/demo-app-ts/src/Demos.ts index 6434212fb3d..fa4512cd961 100644 --- a/packages/react-integration/demo-app-ts/src/Demos.ts +++ b/packages/react-integration/demo-app-ts/src/Demos.ts @@ -160,6 +160,11 @@ export const Demos: DemoInterface[] = [ name: 'Data List Demo', componentType: Examples.DataListDemo }, + { + id: 'data-list-compact-demo', + name: 'Data List Compact Demo', + componentType: Examples.DataListCompactDemo + }, { id: 'data-toolbar-demo', name: 'Data Toolbar Demo', diff --git a/packages/react-integration/demo-app-ts/src/components/demos/DataListDemo/DataListCompactDemo.tsx b/packages/react-integration/demo-app-ts/src/components/demos/DataListDemo/DataListCompactDemo.tsx new file mode 100644 index 00000000000..02159612d03 --- /dev/null +++ b/packages/react-integration/demo-app-ts/src/components/demos/DataListDemo/DataListCompactDemo.tsx @@ -0,0 +1,66 @@ +import React from 'react'; +import { + DataList, + DataListProps, + DataListItem, + DataListItemRow, + DataListItemCells, + DataListCell +} from '@patternfly/react-core'; + +interface DataListState { + selectedDataListItemId: string; +} + +export class DataListCompactDemo extends React.Component { + constructor(props) { + super(props); + this.state = { + selectedDataListItemId: '' + }; + } + + onSelectDataListItem = id => { + this.setState({ selectedDataListItemId: id }); + }; + + render() { + return ( + + + + + Primary content + , + + Secondary content + + ]} + /> + + + + + + Secondary content (pf-m-no-fill) + , + + Secondary content (pf-m-align-right pf-m-no-fill) + + ]} + /> + + + + ); + } +} diff --git a/packages/react-integration/demo-app-ts/src/components/demos/index.ts b/packages/react-integration/demo-app-ts/src/components/demos/index.ts index 657195f5efc..5e36aa3d9d3 100644 --- a/packages/react-integration/demo-app-ts/src/components/demos/index.ts +++ b/packages/react-integration/demo-app-ts/src/components/demos/index.ts @@ -27,6 +27,7 @@ export * from './ContextSelectorDemo/ContextSelectorDemo'; export * from './ClipboardCopyDemo/ClipboardCopyDemo'; export * from './ClipboardCopyDemo/ClipboardCopyExpandedDemo'; export * from './DataListDemo/DataListDemo'; +export * from './DataListDemo/DataListCompactDemo'; export * from './DataToolbarDemo/DataToolbarDemo'; export * from './DividerDemo/DividerDemo'; export * from './DonutChartDemo/DonutBottomAlignedLegendDemo'; From d3924790ca2df0d410a665de20d7ac010e395a7d Mon Sep 17 00:00:00 2001 From: Dan Labrecque Date: Thu, 5 Mar 2020 13:03:04 -0500 Subject: [PATCH 04/73] bump react-docs version (#3879) --- packages/react-docs/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-docs/package.json b/packages/react-docs/package.json index 3ce54a12e99..47e6e979249 100644 --- a/packages/react-docs/package.json +++ b/packages/react-docs/package.json @@ -1,7 +1,7 @@ { "name": "@patternfly/react-docs", "description": "PatternFly React Docs", - "version": "4.20.24", + "version": "4.20.25", "author": "Red Hat", "license": "MIT", "private": true, From 0295597a091def71d979ec4db7ade8e493d421f3 Mon Sep 17 00:00:00 2001 From: Titani Labaj <39532947+tlabaj@users.noreply.github.com> Date: Thu, 5 Mar 2020 20:13:26 -0500 Subject: [PATCH 05/73] fix(wizard): use patternfly-styles to set the no padding modifier (#3871) Signed-off-by: Boaz Shuster --- packages/react-core/src/components/Wizard/WizardBody.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-core/src/components/Wizard/WizardBody.tsx b/packages/react-core/src/components/Wizard/WizardBody.tsx index 644b5d7bd69..df327631141 100644 --- a/packages/react-core/src/components/Wizard/WizardBody.tsx +++ b/packages/react-core/src/components/Wizard/WizardBody.tsx @@ -13,7 +13,7 @@ export const WizardBody: React.FunctionComponent = ({ children, hasBodyPadding = true }: WizardBodyProps) => ( -
      +
      {children}
      ); From fda2b578fa0e0de1831a8b881b8b50502f9455a0 Mon Sep 17 00:00:00 2001 From: zallen <47335686+redallen@users.noreply.github.com> Date: Fri, 6 Mar 2020 09:18:40 -0500 Subject: [PATCH 06/73] chore(react): bump to current tagged version in git (#3881) * bump to current tagged version * bump other problematic packages --- packages/react-charts/package.json | 2 +- packages/react-core/package.json | 2 +- packages/react-docs/package.json | 6 +++--- packages/react-icons/package.json | 2 +- packages/react-inline-edit-extension/package.json | 2 +- packages/react-table/package.json | 2 +- packages/react-topology/package.json | 2 +- packages/react-virtualized-extension/package.json | 2 +- 8 files changed, 10 insertions(+), 10 deletions(-) diff --git a/packages/react-charts/package.json b/packages/react-charts/package.json index cd98272f7f6..91ffa16e1d5 100644 --- a/packages/react-charts/package.json +++ b/packages/react-charts/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-charts", - "version": "5.3.7", + "version": "5.3.9", "description": "This library provides a set of React chart components for use with the PatternFly reference implementation.", "main": "dist/js/index.js", "module": "dist/esm/index.js", diff --git a/packages/react-core/package.json b/packages/react-core/package.json index be9b968e397..301735d2b9f 100644 --- a/packages/react-core/package.json +++ b/packages/react-core/package.json @@ -40,7 +40,7 @@ "gen:tests": "yo tsx-docgen" }, "dependencies": { - "@patternfly/react-icons": "^3.15.5", + "@patternfly/react-icons": "^3.15.7", "@patternfly/react-styles": "^3.7.6", "@patternfly/react-tokens": "^2.8.6", "emotion": "^9.2.9", diff --git a/packages/react-docs/package.json b/packages/react-docs/package.json index 47e6e979249..3bcfb721ba5 100644 --- a/packages/react-docs/package.json +++ b/packages/react-docs/package.json @@ -1,7 +1,7 @@ { "name": "@patternfly/react-docs", "description": "PatternFly React Docs", - "version": "4.20.25", + "version": "4.20.27", "author": "Red Hat", "license": "MIT", "private": true, @@ -20,9 +20,9 @@ "@mdx-js/react": "^1.1.5", "@patternfly/patternfly": "2.65.3", "@patternfly/react-catalog-view-extension": "^1.4.21", - "@patternfly/react-charts": "^5.3.7", + "@patternfly/react-charts": "^5.3.9", "@patternfly/react-core": "^3.142.2", - "@patternfly/react-icons": "^3.15.5", + "@patternfly/react-icons": "^3.15.7", "@patternfly/react-inline-edit-extension": "^2.17.21", "@patternfly/react-styled-system": "^3.8.8", "@patternfly/react-styles": "^3.7.6", diff --git a/packages/react-icons/package.json b/packages/react-icons/package.json index 3a789c1b2d3..f343125a93a 100644 --- a/packages/react-icons/package.json +++ b/packages/react-icons/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-icons", - "version": "3.15.5", + "version": "3.15.7", "description": "PatternFly 4 Icons as React Components", "main": "dist/js/index.js", "module": "dist/esm/index.js", diff --git a/packages/react-inline-edit-extension/package.json b/packages/react-inline-edit-extension/package.json index ab6f09f4f0a..746040b9f6a 100644 --- a/packages/react-inline-edit-extension/package.json +++ b/packages/react-inline-edit-extension/package.json @@ -29,7 +29,7 @@ "dependencies": { "@patternfly/patternfly": "2.65.3", "@patternfly/react-core": "^3.142.2", - "@patternfly/react-icons": "^3.15.5", + "@patternfly/react-icons": "^3.15.7", "@patternfly/react-styles": "^3.7.6", "@patternfly/react-table": "^2.28.2", "classnames": "^2.2.5", diff --git a/packages/react-table/package.json b/packages/react-table/package.json index 7ed19da6f78..3de52bd988e 100644 --- a/packages/react-table/package.json +++ b/packages/react-table/package.json @@ -29,7 +29,7 @@ "dependencies": { "@patternfly/patternfly": "2.65.3", "@patternfly/react-core": "^3.142.2", - "@patternfly/react-icons": "^3.15.5", + "@patternfly/react-icons": "^3.15.7", "@patternfly/react-styles": "^3.7.6", "@patternfly/react-tokens": "^2.8.6", "classnames": "^2.2.5", diff --git a/packages/react-topology/package.json b/packages/react-topology/package.json index 1c1cbe5785d..2df227880f3 100644 --- a/packages/react-topology/package.json +++ b/packages/react-topology/package.json @@ -27,7 +27,7 @@ "dependencies": { "@patternfly/patternfly": "2.65.3", "@patternfly/react-core": "^3.142.2", - "@patternfly/react-icons": "^3.15.5", + "@patternfly/react-icons": "^3.15.7", "@patternfly/react-styles": "^3.7.6" }, "peerDependencies": { diff --git a/packages/react-virtualized-extension/package.json b/packages/react-virtualized-extension/package.json index f7e1f34d316..06999d6575a 100644 --- a/packages/react-virtualized-extension/package.json +++ b/packages/react-virtualized-extension/package.json @@ -29,7 +29,7 @@ "dependencies": { "@patternfly/patternfly": "2.65.3", "@patternfly/react-core": "^3.142.2", - "@patternfly/react-icons": "^3.15.5", + "@patternfly/react-icons": "^3.15.7", "@patternfly/react-styles": "^3.7.6", "@types/react-virtualized": "^9.21.5", "clsx": "^1.0.1", From d8464e2e5576b8af1727813e6b946bba07970852 Mon Sep 17 00:00:00 2001 From: patternfly-build Date: Fri, 6 Mar 2020 14:40:02 +0000 Subject: [PATCH 07/73] chore(release): releasing packages [ci skip] - @patternfly/react-catalog-view-extension@1.4.22 - @patternfly/react-charts@5.3.10 - @patternfly/react-core@3.143.0 - @patternfly/react-docs@4.20.28 - @patternfly/react-icons@3.15.8 - @patternfly/react-inline-edit-extension@2.17.22 - demo-app-ts@3.26.0 - @patternfly/react-integration@3.26.0 - @patternfly/react-table@2.28.3 - @patternfly/react-topology@2.14.22 - @patternfly/react-virtualized-extension@1.4.23 --- .../react-catalog-view-extension/CHANGELOG.md | 8 ++++++++ .../react-catalog-view-extension/package.json | 4 ++-- packages/react-charts/CHANGELOG.md | 8 ++++++++ packages/react-charts/package.json | 2 +- packages/react-core/CHANGELOG.md | 18 ++++++++++++++++++ packages/react-core/package.json | 4 ++-- packages/react-docs/CHANGELOG.md | 8 ++++++++ packages/react-docs/package.json | 18 +++++++++--------- packages/react-icons/CHANGELOG.md | 8 ++++++++ packages/react-icons/package.json | 2 +- .../react-inline-edit-extension/CHANGELOG.md | 8 ++++++++ .../react-inline-edit-extension/package.json | 8 ++++---- packages/react-integration/CHANGELOG.md | 12 ++++++++++++ .../react-integration/demo-app-ts/CHANGELOG.md | 12 ++++++++++++ .../react-integration/demo-app-ts/package.json | 4 ++-- packages/react-integration/package.json | 2 +- packages/react-table/CHANGELOG.md | 8 ++++++++ packages/react-table/package.json | 6 +++--- packages/react-topology/CHANGELOG.md | 8 ++++++++ packages/react-topology/package.json | 6 +++--- .../react-virtualized-extension/CHANGELOG.md | 8 ++++++++ .../react-virtualized-extension/package.json | 6 +++--- 22 files changed, 137 insertions(+), 31 deletions(-) diff --git a/packages/react-catalog-view-extension/CHANGELOG.md b/packages/react-catalog-view-extension/CHANGELOG.md index f9bac0b3a60..5093b8ef6e3 100644 --- a/packages/react-catalog-view-extension/CHANGELOG.md +++ b/packages/react-catalog-view-extension/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [1.4.22](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-catalog-view-extension@1.4.21...@patternfly/react-catalog-view-extension@1.4.22) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-catalog-view-extension + + + + + ## [1.4.21](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-catalog-view-extension@1.4.20...@patternfly/react-catalog-view-extension@1.4.21) (2020-03-03) **Note:** Version bump only for package @patternfly/react-catalog-view-extension diff --git a/packages/react-catalog-view-extension/package.json b/packages/react-catalog-view-extension/package.json index e98895a7c5e..c9a527125a0 100644 --- a/packages/react-catalog-view-extension/package.json +++ b/packages/react-catalog-view-extension/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-catalog-view-extension", - "version": "1.4.21", + "version": "1.4.22", "description": "This library provides catalog view extensions for PatternFly 4 React.", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -41,7 +41,7 @@ }, "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.142.2", + "@patternfly/react-core": "^3.143.0", "@patternfly/react-styles": "^3.7.6", "classnames": "^2.2.5", "patternfly": "^3.59.4" diff --git a/packages/react-charts/CHANGELOG.md b/packages/react-charts/CHANGELOG.md index 5041301af8c..2361f802d65 100644 --- a/packages/react-charts/CHANGELOG.md +++ b/packages/react-charts/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [5.3.10](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-charts@5.3.7...@patternfly/react-charts@5.3.10) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-charts + + + + + ## [5.3.7](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-charts@5.3.6...@patternfly/react-charts@5.3.7) (2020-03-03) **Note:** Version bump only for package @patternfly/react-charts diff --git a/packages/react-charts/package.json b/packages/react-charts/package.json index 91ffa16e1d5..620dd2ecc89 100644 --- a/packages/react-charts/package.json +++ b/packages/react-charts/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-charts", - "version": "5.3.9", + "version": "5.3.10", "description": "This library provides a set of React chart components for use with the PatternFly reference implementation.", "main": "dist/js/index.js", "module": "dist/esm/index.js", diff --git a/packages/react-core/CHANGELOG.md b/packages/react-core/CHANGELOG.md index 819c12cc811..9e4c65573dd 100644 --- a/packages/react-core/CHANGELOG.md +++ b/packages/react-core/CHANGELOG.md @@ -3,6 +3,24 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [3.143.0](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@3.142.2...@patternfly/react-core@3.143.0) (2020-03-06) + + +### Bug Fixes + +* **ouia:** don't omit ouiaContext ([#3872](https://github.com/patternfly/patternfly-react/issues/3872)) ([23cf7fc](https://github.com/patternfly/patternfly-react/commit/23cf7fca4764178e91dc4e054677a316d2e44f8e)) +* **wizard:** use patternfly-styles to set the no padding modifier ([#3871](https://github.com/patternfly/patternfly-react/issues/3871)) ([0295597](https://github.com/patternfly/patternfly-react/commit/0295597a091def71d979ec4db7ade8e493d421f3)) + + +### Features + +* **DataList:** add compact data list ([#3807](https://github.com/patternfly/patternfly-react/issues/3807)) ([18d9b7b](https://github.com/patternfly/patternfly-react/commit/18d9b7b756e985304864e52b09f5f1d1789791f8)) +* **Modal:** add description property ([#3821](https://github.com/patternfly/patternfly-react/issues/3821)) ([c7bfe03](https://github.com/patternfly/patternfly-react/commit/c7bfe03c54caf2ffcc215ab359c98cf0359c035e)) + + + + + ## [3.142.2](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@3.142.1...@patternfly/react-core@3.142.2) (2020-03-03) **Note:** Version bump only for package @patternfly/react-core diff --git a/packages/react-core/package.json b/packages/react-core/package.json index 301735d2b9f..4258b612163 100644 --- a/packages/react-core/package.json +++ b/packages/react-core/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-core", - "version": "3.142.2", + "version": "3.143.0", "description": "This library provides a set of common React components for use with the PatternFly reference implementation.", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -40,7 +40,7 @@ "gen:tests": "yo tsx-docgen" }, "dependencies": { - "@patternfly/react-icons": "^3.15.7", + "@patternfly/react-icons": "^3.15.8", "@patternfly/react-styles": "^3.7.6", "@patternfly/react-tokens": "^2.8.6", "emotion": "^9.2.9", diff --git a/packages/react-docs/CHANGELOG.md b/packages/react-docs/CHANGELOG.md index e6ef2212b94..8845ecb13ca 100644 --- a/packages/react-docs/CHANGELOG.md +++ b/packages/react-docs/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [4.20.28](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-docs@4.20.24...@patternfly/react-docs@4.20.28) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-docs + + + + + ## [4.20.24](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-docs@4.20.23...@patternfly/react-docs@4.20.24) (2020-03-03) **Note:** Version bump only for package @patternfly/react-docs diff --git a/packages/react-docs/package.json b/packages/react-docs/package.json index 3bcfb721ba5..2736307b133 100644 --- a/packages/react-docs/package.json +++ b/packages/react-docs/package.json @@ -1,7 +1,7 @@ { "name": "@patternfly/react-docs", "description": "PatternFly React Docs", - "version": "4.20.27", + "version": "4.20.28", "author": "Red Hat", "license": "MIT", "private": true, @@ -19,17 +19,17 @@ "@mdx-js/mdx": "^1.1.5", "@mdx-js/react": "^1.1.5", "@patternfly/patternfly": "2.65.3", - "@patternfly/react-catalog-view-extension": "^1.4.21", - "@patternfly/react-charts": "^5.3.9", - "@patternfly/react-core": "^3.142.2", - "@patternfly/react-icons": "^3.15.7", - "@patternfly/react-inline-edit-extension": "^2.17.21", + "@patternfly/react-catalog-view-extension": "^1.4.22", + "@patternfly/react-charts": "^5.3.10", + "@patternfly/react-core": "^3.143.0", + "@patternfly/react-icons": "^3.15.8", + "@patternfly/react-inline-edit-extension": "^2.17.22", "@patternfly/react-styled-system": "^3.8.8", "@patternfly/react-styles": "^3.7.6", - "@patternfly/react-table": "^2.28.2", + "@patternfly/react-table": "^2.28.3", "@patternfly/react-tokens": "^2.8.6", - "@patternfly/react-topology": "^2.14.21", - "@patternfly/react-virtualized-extension": "^1.4.22", + "@patternfly/react-topology": "^2.14.22", + "@patternfly/react-virtualized-extension": "^1.4.23", "gatsby": "2.19.12", "gatsby-cli": "2.8.29", "gatsby-theme-patternfly-org": "^1.4.1", diff --git a/packages/react-icons/CHANGELOG.md b/packages/react-icons/CHANGELOG.md index 772e9774cea..44c745c6f10 100644 --- a/packages/react-icons/CHANGELOG.md +++ b/packages/react-icons/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [3.15.8](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-icons@3.15.5...@patternfly/react-icons@3.15.8) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-icons + + + + + ## [3.15.5](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-icons@3.15.4...@patternfly/react-icons@3.15.5) (2020-03-03) **Note:** Version bump only for package @patternfly/react-icons diff --git a/packages/react-icons/package.json b/packages/react-icons/package.json index f343125a93a..a0e29c7e005 100644 --- a/packages/react-icons/package.json +++ b/packages/react-icons/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-icons", - "version": "3.15.7", + "version": "3.15.8", "description": "PatternFly 4 Icons as React Components", "main": "dist/js/index.js", "module": "dist/esm/index.js", diff --git a/packages/react-inline-edit-extension/CHANGELOG.md b/packages/react-inline-edit-extension/CHANGELOG.md index 5c3432c9d89..f02cebb5f42 100644 --- a/packages/react-inline-edit-extension/CHANGELOG.md +++ b/packages/react-inline-edit-extension/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [2.17.22](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-inline-edit-extension@2.17.21...@patternfly/react-inline-edit-extension@2.17.22) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-inline-edit-extension + + + + + ## [2.17.21](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-inline-edit-extension@2.17.20...@patternfly/react-inline-edit-extension@2.17.21) (2020-03-03) **Note:** Version bump only for package @patternfly/react-inline-edit-extension diff --git a/packages/react-inline-edit-extension/package.json b/packages/react-inline-edit-extension/package.json index 746040b9f6a..cdcc9d14f1b 100644 --- a/packages/react-inline-edit-extension/package.json +++ b/packages/react-inline-edit-extension/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-inline-edit-extension", - "version": "2.17.21", + "version": "2.17.22", "description": "This library provides inline editing support for PatternFly 4 React table", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -28,10 +28,10 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/patternfly-4/", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.142.2", - "@patternfly/react-icons": "^3.15.7", + "@patternfly/react-core": "^3.143.0", + "@patternfly/react-icons": "^3.15.8", "@patternfly/react-styles": "^3.7.6", - "@patternfly/react-table": "^2.28.2", + "@patternfly/react-table": "^2.28.3", "classnames": "^2.2.5", "exenv": "^1.2.2", "reactabular-table": "^8.14.0" diff --git a/packages/react-integration/CHANGELOG.md b/packages/react-integration/CHANGELOG.md index 42023480077..d58365f99cf 100644 --- a/packages/react-integration/CHANGELOG.md +++ b/packages/react-integration/CHANGELOG.md @@ -3,6 +3,18 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [3.26.0](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-integration@3.25.2...@patternfly/react-integration@3.26.0) (2020-03-06) + + +### Features + +* **DataList:** add compact data list ([#3807](https://github.com/patternfly/patternfly-react/issues/3807)) ([18d9b7b](https://github.com/patternfly/patternfly-react/commit/18d9b7b756e985304864e52b09f5f1d1789791f8)) +* **Modal:** add description property ([#3821](https://github.com/patternfly/patternfly-react/issues/3821)) ([c7bfe03](https://github.com/patternfly/patternfly-react/commit/c7bfe03c54caf2ffcc215ab359c98cf0359c035e)) + + + + + ## [3.25.2](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-integration@3.25.1...@patternfly/react-integration@3.25.2) (2020-03-03) **Note:** Version bump only for package @patternfly/react-integration diff --git a/packages/react-integration/demo-app-ts/CHANGELOG.md b/packages/react-integration/demo-app-ts/CHANGELOG.md index 3f833501114..1b93d6c9926 100644 --- a/packages/react-integration/demo-app-ts/CHANGELOG.md +++ b/packages/react-integration/demo-app-ts/CHANGELOG.md @@ -3,6 +3,18 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [3.26.0](https://github.com/patternfly/patternfly-react/compare/demo-app-ts@3.25.9...demo-app-ts@3.26.0) (2020-03-06) + + +### Features + +* **DataList:** add compact data list ([#3807](https://github.com/patternfly/patternfly-react/issues/3807)) ([18d9b7b](https://github.com/patternfly/patternfly-react/commit/18d9b7b756e985304864e52b09f5f1d1789791f8)) +* **Modal:** add description property ([#3821](https://github.com/patternfly/patternfly-react/issues/3821)) ([c7bfe03](https://github.com/patternfly/patternfly-react/commit/c7bfe03c54caf2ffcc215ab359c98cf0359c035e)) + + + + + ## [3.25.9](https://github.com/patternfly/patternfly-react/compare/demo-app-ts@3.25.8...demo-app-ts@3.25.9) (2020-03-03) **Note:** Version bump only for package demo-app-ts diff --git a/packages/react-integration/demo-app-ts/package.json b/packages/react-integration/demo-app-ts/package.json index e0d1f3b975b..30e5f6f9eff 100644 --- a/packages/react-integration/demo-app-ts/package.json +++ b/packages/react-integration/demo-app-ts/package.json @@ -1,13 +1,13 @@ { "name": "demo-app-ts", "private": true, - "version": "3.25.9", + "version": "3.26.0", "scripts": { "build:demo-app": "react-scripts build", "start:demo-app": "react-scripts start" }, "dependencies": { - "@patternfly/react-core": "^3.142.2", + "@patternfly/react-core": "^3.143.0", "react": "^16.8.0", "react-dom": "^16.8.0", "react-router": "^4.3.1", diff --git a/packages/react-integration/package.json b/packages/react-integration/package.json index dbc70e448f0..ce945417b63 100644 --- a/packages/react-integration/package.json +++ b/packages/react-integration/package.json @@ -1,7 +1,7 @@ { "name": "@patternfly/react-integration", "private": true, - "version": "3.25.2", + "version": "3.26.0", "description": "Integration testing for PF4 using demo applications", "main": "lib/index.js", "sideEffects": false, diff --git a/packages/react-table/CHANGELOG.md b/packages/react-table/CHANGELOG.md index 5b05b17e951..76f8cf4016d 100644 --- a/packages/react-table/CHANGELOG.md +++ b/packages/react-table/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [2.28.3](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-table@2.28.2...@patternfly/react-table@2.28.3) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-table + + + + + ## [2.28.2](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-table@2.28.1...@patternfly/react-table@2.28.2) (2020-03-03) **Note:** Version bump only for package @patternfly/react-table diff --git a/packages/react-table/package.json b/packages/react-table/package.json index 3de52bd988e..56b6d4ea983 100644 --- a/packages/react-table/package.json +++ b/packages/react-table/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-table", - "version": "2.28.2", + "version": "2.28.3", "description": "This library provides a set of React table components for use with the PatternFly 4", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -28,8 +28,8 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/react-table#readme", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.142.2", - "@patternfly/react-icons": "^3.15.7", + "@patternfly/react-core": "^3.143.0", + "@patternfly/react-icons": "^3.15.8", "@patternfly/react-styles": "^3.7.6", "@patternfly/react-tokens": "^2.8.6", "classnames": "^2.2.5", diff --git a/packages/react-topology/CHANGELOG.md b/packages/react-topology/CHANGELOG.md index fc66c3bea2f..6ffc73acb86 100644 --- a/packages/react-topology/CHANGELOG.md +++ b/packages/react-topology/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [2.14.22](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-topology@2.14.21...@patternfly/react-topology@2.14.22) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-topology + + + + + ## [2.14.21](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-topology@2.14.20...@patternfly/react-topology@2.14.21) (2020-03-03) **Note:** Version bump only for package @patternfly/react-topology diff --git a/packages/react-topology/package.json b/packages/react-topology/package.json index 2df227880f3..fb864e5b867 100644 --- a/packages/react-topology/package.json +++ b/packages/react-topology/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-topology", - "version": "2.14.21", + "version": "2.14.22", "description": "This library provides a set of React topology view components for use with the PatternFly 4", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -26,8 +26,8 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/react-topology#readme", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.142.2", - "@patternfly/react-icons": "^3.15.7", + "@patternfly/react-core": "^3.143.0", + "@patternfly/react-icons": "^3.15.8", "@patternfly/react-styles": "^3.7.6" }, "peerDependencies": { diff --git a/packages/react-virtualized-extension/CHANGELOG.md b/packages/react-virtualized-extension/CHANGELOG.md index 4f29d96ccf3..37386ad6252 100644 --- a/packages/react-virtualized-extension/CHANGELOG.md +++ b/packages/react-virtualized-extension/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [1.4.23](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-virtualized-extension@1.4.22...@patternfly/react-virtualized-extension@1.4.23) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-virtualized-extension + + + + + ## [1.4.22](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-virtualized-extension@1.4.21...@patternfly/react-virtualized-extension@1.4.22) (2020-03-03) **Note:** Version bump only for package @patternfly/react-virtualized-extension diff --git a/packages/react-virtualized-extension/package.json b/packages/react-virtualized-extension/package.json index 06999d6575a..55b8004555b 100644 --- a/packages/react-virtualized-extension/package.json +++ b/packages/react-virtualized-extension/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-virtualized-extension", - "version": "1.4.22", + "version": "1.4.23", "description": "This library provides efficient rendering extensions for PatternFly 4 React tables and lists.", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -28,8 +28,8 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/react-virtualized-extension/", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.142.2", - "@patternfly/react-icons": "^3.15.7", + "@patternfly/react-core": "^3.143.0", + "@patternfly/react-icons": "^3.15.8", "@patternfly/react-styles": "^3.7.6", "@types/react-virtualized": "^9.21.5", "clsx": "^1.0.1", From d25c80b68795c44d46eaf261b335c5f088d71e96 Mon Sep 17 00:00:00 2001 From: Titani Labaj <39532947+tlabaj@users.noreply.github.com> Date: Fri, 6 Mar 2020 13:52:09 -0500 Subject: [PATCH 08/73] feat(ChipGroup): Added a tooltip to the Chipgroup label (#3826) * feat(ChipGroup): Added a tooltip to the Chipgroup label #3490 * fix linting errors * add tabindex * fix tabindex * remove redundant code Co-authored-by: Titani --- .../src/components/ChipGroup/Chip.tsx | 1 + .../ChipGroup/ChipGroupToolbarItem.tsx | 127 ++++++++++++------ .../ChipGroup/__tests__/ChipGroup.test.tsx | 11 ++ .../__snapshots__/ChipGroup.test.tsx.snap | 44 +++++- .../ChipGroup/examples/ChipGroup.md | 2 +- .../__snapshots__/DataToolbar.test.tsx.snap | 10 ++ .../integration/chipgrouptoolbar.spec.ts | 14 ++ .../ChipGroupDemo/ChipGroupToolbarDemo.tsx | 3 +- 8 files changed, 169 insertions(+), 43 deletions(-) diff --git a/packages/react-core/src/components/ChipGroup/Chip.tsx b/packages/react-core/src/components/ChipGroup/Chip.tsx index e8a70205e0c..99dfe3b8194 100644 --- a/packages/react-core/src/components/ChipGroup/Chip.tsx +++ b/packages/react-core/src/components/ChipGroup/Chip.tsx @@ -91,6 +91,7 @@ class Chip extends React.Component { void; /** Aria label for close button */ closeBtnAriaLabel?: string; + /** Position of the tooltip which is displayed if the category name text is longer */ + tooltipPosition?: 'auto' | 'top' | 'bottom' | 'left' | 'right'; } -export const ChipGroupToolbarItem: React.FunctionComponent = ({ - categoryName = '', - children = null, - className = '', - isClosable = false, - // eslint-disable-next-line @typescript-eslint/no-unused-vars - onClick = (_e: React.MouseEvent) => undefined as any, - closeBtnAriaLabel = 'Close chip group', - ...props -}: ChipGroupToolbarItemProps) => { - if (React.Children.count(children)) { - const renderChipGroup = (id: string, HeadingLevel: any) => ( -
        -
      • - - {categoryName} - -
          {children}
        - {isClosable && ( -
        - - -
        - )} -
      • -
      - ); +interface ChipGroupToolbarItemState { + isTooltipVisible: boolean; +} + +export class ChipGroupToolbarItem extends React.Component { + constructor(props: ChipGroupToolbarItemProps) { + super(props); + this.state = { + isTooltipVisible: false + }; + } + + heading = React.createRef(); + + static defaultProps: ChipGroupToolbarItemProps = { + categoryName: '', + children: null, + className: '', + isClosable: false, + // eslint-disable-next-line @typescript-eslint/no-unused-vars + onClick: (_e: React.MouseEvent) => undefined as any, + closeBtnAriaLabel: 'Close chip group', + tooltipPosition: 'top' + }; - return ( - - {(HeadingLevel: any) => {randomId => renderChipGroup(randomId, HeadingLevel)}} - - ); + componentDidMount() { + this.setState({ + isTooltipVisible: Boolean( + this.heading.current && this.heading.current.offsetWidth < this.heading.current.scrollWidth + ) + }); } - return null; -}; + + render() { + const { + categoryName, + children, + className, + isClosable, + closeBtnAriaLabel, + onClick, + tooltipPosition, + ...rest + } = this.props; + + if (React.Children.count(children)) { + const renderChipGroup = (id: string, HeadingLevel: any) => ( +
        +
      • + {this.state.isTooltipVisible ? ( + + + {categoryName} + + + ) : ( + + {categoryName} + + )} +
          {children}
        + {isClosable && ( +
        + + +
        + )} +
      • +
      + ); + + return ( + + {(HeadingLevel: any) => {randomId => renderChipGroup(randomId, HeadingLevel)}} + + ); + } + return null; + } +} diff --git a/packages/react-core/src/components/ChipGroup/__tests__/ChipGroup.test.tsx b/packages/react-core/src/components/ChipGroup/__tests__/ChipGroup.test.tsx index 0c58ea39507..b1d4d29e452 100644 --- a/packages/react-core/src/components/ChipGroup/__tests__/ChipGroup.test.tsx +++ b/packages/react-core/src/components/ChipGroup/__tests__/ChipGroup.test.tsx @@ -54,4 +54,15 @@ describe('ChipGroup', () => { const view = shallow(); expect(view.html()).toBeNull(); }); + + test('chip group with toolbar and tooltip', () => { + const view = shallow( + + + 1.1 + + + ); + expect(view).toMatchSnapshot(); + }); }); diff --git a/packages/react-core/src/components/ChipGroup/__tests__/__snapshots__/ChipGroup.test.tsx.snap b/packages/react-core/src/components/ChipGroup/__tests__/__snapshots__/ChipGroup.test.tsx.snap index 5eca64b3158..e40ce7ecbb6 100644 --- a/packages/react-core/src/components/ChipGroup/__tests__/__snapshots__/ChipGroup.test.tsx.snap +++ b/packages/react-core/src/components/ChipGroup/__tests__/__snapshots__/ChipGroup.test.tsx.snap @@ -36,7 +36,12 @@ exports[`ChipGroup chip group with closable toolbar 1`] = ` withToolbar={true} > 1.1 @@ -60,7 +65,44 @@ exports[`ChipGroup chip group with toolbar 1`] = ` onToggleCollapse={[Function]} withToolbar={true} > - + + + 1.1 + + + + +`; + +exports[`ChipGroup chip group with toolbar and tooltip 1`] = ` + + + 1.1 diff --git a/packages/react-core/src/components/ChipGroup/examples/ChipGroup.md b/packages/react-core/src/components/ChipGroup/examples/ChipGroup.md index 9f914c07c85..1f4b2e32286 100644 --- a/packages/react-core/src/components/ChipGroup/examples/ChipGroup.md +++ b/packages/react-core/src/components/ChipGroup/examples/ChipGroup.md @@ -85,7 +85,7 @@ class ToolbarChipGroup extends React.Component { this.state = { chipGroups: [ { - category: 'Category 1', + category: 'Category 1 has a very long name', chips: ['Chip 1', 'Chip 2'] }, { diff --git a/packages/react-core/src/components/DataToolbar/__tests__/__snapshots__/DataToolbar.test.tsx.snap b/packages/react-core/src/components/DataToolbar/__tests__/__snapshots__/DataToolbar.test.tsx.snap index 4acda4e3df0..abc4d845bdc 100644 --- a/packages/react-core/src/components/DataToolbar/__tests__/__snapshots__/DataToolbar.test.tsx.snap +++ b/packages/react-core/src/components/DataToolbar/__tests__/__snapshots__/DataToolbar.test.tsx.snap @@ -530,7 +530,12 @@ exports[`data toolbar DataToolbarFilter 1`] = ` > { chipGroupButton.click(); chipGroup.should('not.exist'); }); + + it('Displays Tooltip', () => { + cy.get('.pf-c-chip-group__label') + .last() + .then((tooltipLink: JQuery) => { + cy.get('.tippy-popper').should('not.exist'); + cy.wrap(tooltipLink) + .trigger('mouseenter') + .get('.tippy-popper') + .should('exist') + .get('.tippy-popper') + .contains('Category 3 has a very long name'); + }); + }); }); diff --git a/packages/react-integration/demo-app-ts/src/components/demos/ChipGroupDemo/ChipGroupToolbarDemo.tsx b/packages/react-integration/demo-app-ts/src/components/demos/ChipGroupDemo/ChipGroupToolbarDemo.tsx index 1ece2379e28..44f581dc8ce 100644 --- a/packages/react-integration/demo-app-ts/src/components/demos/ChipGroupDemo/ChipGroupToolbarDemo.tsx +++ b/packages/react-integration/demo-app-ts/src/components/demos/ChipGroupDemo/ChipGroupToolbarDemo.tsx @@ -25,7 +25,7 @@ export class ToolbarChipGroupDemo extends Component<{}, ToolbarChipGroupState> { chips: ['Chip 3', 'Chip 4'] }, { - category: 'Category 3', + category: 'Category 3 has a very long name', chips: ['Chip 5', 'Chip 6', 'Chip 7', 'Chip 8'] } ] @@ -70,6 +70,7 @@ export class ToolbarChipGroupDemo extends Component<{}, ToolbarChipGroupState> { isClosable onClick={() => this.deleteCategory(currentGroup.category)} closeBtnAriaLabel="Close category demo" + tooltipPosition="bottom" > {currentGroup.chips.map(chip => ( this.deleteItem(chip)}> From dabbaa5ac2f0989b2ce0e791dca2ba45aab428ea Mon Sep 17 00:00:00 2001 From: patternfly-build Date: Fri, 6 Mar 2020 19:11:41 +0000 Subject: [PATCH 09/73] chore(release): releasing packages [ci skip] - @patternfly/react-catalog-view-extension@1.4.23 - @patternfly/react-core@3.144.0 - @patternfly/react-docs@4.20.29 - @patternfly/react-inline-edit-extension@2.17.23 - demo-app-ts@3.27.0 - @patternfly/react-integration@3.27.0 - @patternfly/react-table@2.28.4 - @patternfly/react-topology@2.14.23 - @patternfly/react-virtualized-extension@1.4.24 --- packages/react-catalog-view-extension/CHANGELOG.md | 8 ++++++++ packages/react-catalog-view-extension/package.json | 4 ++-- packages/react-core/CHANGELOG.md | 11 +++++++++++ packages/react-core/package.json | 2 +- packages/react-docs/CHANGELOG.md | 8 ++++++++ packages/react-docs/package.json | 14 +++++++------- packages/react-inline-edit-extension/CHANGELOG.md | 8 ++++++++ packages/react-inline-edit-extension/package.json | 6 +++--- packages/react-integration/CHANGELOG.md | 11 +++++++++++ .../react-integration/demo-app-ts/CHANGELOG.md | 11 +++++++++++ .../react-integration/demo-app-ts/package.json | 4 ++-- packages/react-integration/package.json | 2 +- packages/react-table/CHANGELOG.md | 8 ++++++++ packages/react-table/package.json | 4 ++-- packages/react-topology/CHANGELOG.md | 8 ++++++++ packages/react-topology/package.json | 4 ++-- packages/react-virtualized-extension/CHANGELOG.md | 8 ++++++++ packages/react-virtualized-extension/package.json | 4 ++-- 18 files changed, 103 insertions(+), 22 deletions(-) diff --git a/packages/react-catalog-view-extension/CHANGELOG.md b/packages/react-catalog-view-extension/CHANGELOG.md index 5093b8ef6e3..feaececb488 100644 --- a/packages/react-catalog-view-extension/CHANGELOG.md +++ b/packages/react-catalog-view-extension/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [1.4.23](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-catalog-view-extension@1.4.22...@patternfly/react-catalog-view-extension@1.4.23) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-catalog-view-extension + + + + + ## [1.4.22](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-catalog-view-extension@1.4.21...@patternfly/react-catalog-view-extension@1.4.22) (2020-03-06) **Note:** Version bump only for package @patternfly/react-catalog-view-extension diff --git a/packages/react-catalog-view-extension/package.json b/packages/react-catalog-view-extension/package.json index c9a527125a0..60293c2178b 100644 --- a/packages/react-catalog-view-extension/package.json +++ b/packages/react-catalog-view-extension/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-catalog-view-extension", - "version": "1.4.22", + "version": "1.4.23", "description": "This library provides catalog view extensions for PatternFly 4 React.", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -41,7 +41,7 @@ }, "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.143.0", + "@patternfly/react-core": "^3.144.0", "@patternfly/react-styles": "^3.7.6", "classnames": "^2.2.5", "patternfly": "^3.59.4" diff --git a/packages/react-core/CHANGELOG.md b/packages/react-core/CHANGELOG.md index 9e4c65573dd..6b433a04900 100644 --- a/packages/react-core/CHANGELOG.md +++ b/packages/react-core/CHANGELOG.md @@ -3,6 +3,17 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [3.144.0](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@3.143.0...@patternfly/react-core@3.144.0) (2020-03-06) + + +### Features + +* **ChipGroup:** Added a tooltip to the Chipgroup label ([#3826](https://github.com/patternfly/patternfly-react/issues/3826)) ([d25c80b](https://github.com/patternfly/patternfly-react/commit/d25c80b68795c44d46eaf261b335c5f088d71e96)), closes [#3490](https://github.com/patternfly/patternfly-react/issues/3490) + + + + + # [3.143.0](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@3.142.2...@patternfly/react-core@3.143.0) (2020-03-06) diff --git a/packages/react-core/package.json b/packages/react-core/package.json index 4258b612163..4a9928d56b9 100644 --- a/packages/react-core/package.json +++ b/packages/react-core/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-core", - "version": "3.143.0", + "version": "3.144.0", "description": "This library provides a set of common React components for use with the PatternFly reference implementation.", "main": "dist/js/index.js", "module": "dist/esm/index.js", diff --git a/packages/react-docs/CHANGELOG.md b/packages/react-docs/CHANGELOG.md index 8845ecb13ca..f6ed2827848 100644 --- a/packages/react-docs/CHANGELOG.md +++ b/packages/react-docs/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [4.20.29](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-docs@4.20.28...@patternfly/react-docs@4.20.29) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-docs + + + + + ## [4.20.28](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-docs@4.20.24...@patternfly/react-docs@4.20.28) (2020-03-06) **Note:** Version bump only for package @patternfly/react-docs diff --git a/packages/react-docs/package.json b/packages/react-docs/package.json index 2736307b133..0dac43eb552 100644 --- a/packages/react-docs/package.json +++ b/packages/react-docs/package.json @@ -1,7 +1,7 @@ { "name": "@patternfly/react-docs", "description": "PatternFly React Docs", - "version": "4.20.28", + "version": "4.20.29", "author": "Red Hat", "license": "MIT", "private": true, @@ -19,17 +19,17 @@ "@mdx-js/mdx": "^1.1.5", "@mdx-js/react": "^1.1.5", "@patternfly/patternfly": "2.65.3", - "@patternfly/react-catalog-view-extension": "^1.4.22", + "@patternfly/react-catalog-view-extension": "^1.4.23", "@patternfly/react-charts": "^5.3.10", - "@patternfly/react-core": "^3.143.0", + "@patternfly/react-core": "^3.144.0", "@patternfly/react-icons": "^3.15.8", - "@patternfly/react-inline-edit-extension": "^2.17.22", + "@patternfly/react-inline-edit-extension": "^2.17.23", "@patternfly/react-styled-system": "^3.8.8", "@patternfly/react-styles": "^3.7.6", - "@patternfly/react-table": "^2.28.3", + "@patternfly/react-table": "^2.28.4", "@patternfly/react-tokens": "^2.8.6", - "@patternfly/react-topology": "^2.14.22", - "@patternfly/react-virtualized-extension": "^1.4.23", + "@patternfly/react-topology": "^2.14.23", + "@patternfly/react-virtualized-extension": "^1.4.24", "gatsby": "2.19.12", "gatsby-cli": "2.8.29", "gatsby-theme-patternfly-org": "^1.4.1", diff --git a/packages/react-inline-edit-extension/CHANGELOG.md b/packages/react-inline-edit-extension/CHANGELOG.md index f02cebb5f42..dc06c18867e 100644 --- a/packages/react-inline-edit-extension/CHANGELOG.md +++ b/packages/react-inline-edit-extension/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [2.17.23](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-inline-edit-extension@2.17.22...@patternfly/react-inline-edit-extension@2.17.23) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-inline-edit-extension + + + + + ## [2.17.22](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-inline-edit-extension@2.17.21...@patternfly/react-inline-edit-extension@2.17.22) (2020-03-06) **Note:** Version bump only for package @patternfly/react-inline-edit-extension diff --git a/packages/react-inline-edit-extension/package.json b/packages/react-inline-edit-extension/package.json index cdcc9d14f1b..ab893a8182f 100644 --- a/packages/react-inline-edit-extension/package.json +++ b/packages/react-inline-edit-extension/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-inline-edit-extension", - "version": "2.17.22", + "version": "2.17.23", "description": "This library provides inline editing support for PatternFly 4 React table", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -28,10 +28,10 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/patternfly-4/", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.143.0", + "@patternfly/react-core": "^3.144.0", "@patternfly/react-icons": "^3.15.8", "@patternfly/react-styles": "^3.7.6", - "@patternfly/react-table": "^2.28.3", + "@patternfly/react-table": "^2.28.4", "classnames": "^2.2.5", "exenv": "^1.2.2", "reactabular-table": "^8.14.0" diff --git a/packages/react-integration/CHANGELOG.md b/packages/react-integration/CHANGELOG.md index d58365f99cf..e6a8e892279 100644 --- a/packages/react-integration/CHANGELOG.md +++ b/packages/react-integration/CHANGELOG.md @@ -3,6 +3,17 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [3.27.0](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-integration@3.26.0...@patternfly/react-integration@3.27.0) (2020-03-06) + + +### Features + +* **ChipGroup:** Added a tooltip to the Chipgroup label ([#3826](https://github.com/patternfly/patternfly-react/issues/3826)) ([d25c80b](https://github.com/patternfly/patternfly-react/commit/d25c80b68795c44d46eaf261b335c5f088d71e96)), closes [#3490](https://github.com/patternfly/patternfly-react/issues/3490) + + + + + # [3.26.0](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-integration@3.25.2...@patternfly/react-integration@3.26.0) (2020-03-06) diff --git a/packages/react-integration/demo-app-ts/CHANGELOG.md b/packages/react-integration/demo-app-ts/CHANGELOG.md index 1b93d6c9926..f98aafc92b9 100644 --- a/packages/react-integration/demo-app-ts/CHANGELOG.md +++ b/packages/react-integration/demo-app-ts/CHANGELOG.md @@ -3,6 +3,17 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [3.27.0](https://github.com/patternfly/patternfly-react/compare/demo-app-ts@3.26.0...demo-app-ts@3.27.0) (2020-03-06) + + +### Features + +* **ChipGroup:** Added a tooltip to the Chipgroup label ([#3826](https://github.com/patternfly/patternfly-react/issues/3826)) ([d25c80b](https://github.com/patternfly/patternfly-react/commit/d25c80b68795c44d46eaf261b335c5f088d71e96)), closes [#3490](https://github.com/patternfly/patternfly-react/issues/3490) + + + + + # [3.26.0](https://github.com/patternfly/patternfly-react/compare/demo-app-ts@3.25.9...demo-app-ts@3.26.0) (2020-03-06) diff --git a/packages/react-integration/demo-app-ts/package.json b/packages/react-integration/demo-app-ts/package.json index 30e5f6f9eff..9ba2a6ce573 100644 --- a/packages/react-integration/demo-app-ts/package.json +++ b/packages/react-integration/demo-app-ts/package.json @@ -1,13 +1,13 @@ { "name": "demo-app-ts", "private": true, - "version": "3.26.0", + "version": "3.27.0", "scripts": { "build:demo-app": "react-scripts build", "start:demo-app": "react-scripts start" }, "dependencies": { - "@patternfly/react-core": "^3.143.0", + "@patternfly/react-core": "^3.144.0", "react": "^16.8.0", "react-dom": "^16.8.0", "react-router": "^4.3.1", diff --git a/packages/react-integration/package.json b/packages/react-integration/package.json index ce945417b63..6ee8178b64c 100644 --- a/packages/react-integration/package.json +++ b/packages/react-integration/package.json @@ -1,7 +1,7 @@ { "name": "@patternfly/react-integration", "private": true, - "version": "3.26.0", + "version": "3.27.0", "description": "Integration testing for PF4 using demo applications", "main": "lib/index.js", "sideEffects": false, diff --git a/packages/react-table/CHANGELOG.md b/packages/react-table/CHANGELOG.md index 76f8cf4016d..b95bb2bdf43 100644 --- a/packages/react-table/CHANGELOG.md +++ b/packages/react-table/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [2.28.4](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-table@2.28.3...@patternfly/react-table@2.28.4) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-table + + + + + ## [2.28.3](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-table@2.28.2...@patternfly/react-table@2.28.3) (2020-03-06) **Note:** Version bump only for package @patternfly/react-table diff --git a/packages/react-table/package.json b/packages/react-table/package.json index 56b6d4ea983..4c3855492ee 100644 --- a/packages/react-table/package.json +++ b/packages/react-table/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-table", - "version": "2.28.3", + "version": "2.28.4", "description": "This library provides a set of React table components for use with the PatternFly 4", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -28,7 +28,7 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/react-table#readme", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.143.0", + "@patternfly/react-core": "^3.144.0", "@patternfly/react-icons": "^3.15.8", "@patternfly/react-styles": "^3.7.6", "@patternfly/react-tokens": "^2.8.6", diff --git a/packages/react-topology/CHANGELOG.md b/packages/react-topology/CHANGELOG.md index 6ffc73acb86..7b60190eb1a 100644 --- a/packages/react-topology/CHANGELOG.md +++ b/packages/react-topology/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [2.14.23](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-topology@2.14.22...@patternfly/react-topology@2.14.23) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-topology + + + + + ## [2.14.22](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-topology@2.14.21...@patternfly/react-topology@2.14.22) (2020-03-06) **Note:** Version bump only for package @patternfly/react-topology diff --git a/packages/react-topology/package.json b/packages/react-topology/package.json index fb864e5b867..eef70f6458b 100644 --- a/packages/react-topology/package.json +++ b/packages/react-topology/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-topology", - "version": "2.14.22", + "version": "2.14.23", "description": "This library provides a set of React topology view components for use with the PatternFly 4", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -26,7 +26,7 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/react-topology#readme", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.143.0", + "@patternfly/react-core": "^3.144.0", "@patternfly/react-icons": "^3.15.8", "@patternfly/react-styles": "^3.7.6" }, diff --git a/packages/react-virtualized-extension/CHANGELOG.md b/packages/react-virtualized-extension/CHANGELOG.md index 37386ad6252..1d8aefe5164 100644 --- a/packages/react-virtualized-extension/CHANGELOG.md +++ b/packages/react-virtualized-extension/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [1.4.24](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-virtualized-extension@1.4.23...@patternfly/react-virtualized-extension@1.4.24) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-virtualized-extension + + + + + ## [1.4.23](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-virtualized-extension@1.4.22...@patternfly/react-virtualized-extension@1.4.23) (2020-03-06) **Note:** Version bump only for package @patternfly/react-virtualized-extension diff --git a/packages/react-virtualized-extension/package.json b/packages/react-virtualized-extension/package.json index 55b8004555b..ac24d3238b6 100644 --- a/packages/react-virtualized-extension/package.json +++ b/packages/react-virtualized-extension/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-virtualized-extension", - "version": "1.4.23", + "version": "1.4.24", "description": "This library provides efficient rendering extensions for PatternFly 4 React tables and lists.", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -28,7 +28,7 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/react-virtualized-extension/", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.143.0", + "@patternfly/react-core": "^3.144.0", "@patternfly/react-icons": "^3.15.8", "@patternfly/react-styles": "^3.7.6", "@types/react-virtualized": "^9.21.5", From 3bfcc002a7b73dd4d8e6595966f7049d8341ffb1 Mon Sep 17 00:00:00 2001 From: zallen <47335686+redallen@users.noreply.github.com> Date: Fri, 6 Mar 2020 15:18:54 -0500 Subject: [PATCH 10/73] chore(react-core): remove exenv and lodash (#3882) * chore(react-core): remove exenv and lodash * remove accidental focus-trap change * fix lint * fix lint --- packages/react-codemods/transforms/pf3-pf4.button.test.js | 1 - packages/react-codemods/transforms/pf3-pf4.js | 2 +- packages/react-codemods/transforms/pf3-pf4.test.js | 1 - packages/react-core/src/components/AboutModal/AboutModal.tsx | 2 +- packages/react-core/src/components/AlertGroup/AlertGroup.tsx | 2 +- packages/react-core/src/components/DataList/DataList.tsx | 3 +-- packages/react-core/src/components/DataToolbar/DataToolbar.tsx | 3 +-- packages/react-core/src/components/Modal/Modal.tsx | 2 +- packages/react-core/src/components/Tabs/Tab.tsx | 2 +- packages/react-core/src/components/Wizard/Wizard.tsx | 2 +- packages/react-core/src/components/withOuia/withOuia.tsx | 1 - packages/react-core/src/helpers/safeHTMLElement.js | 2 +- packages/react-core/src/helpers/util.ts | 2 ++ packages/react-icons/src/createIcon.js | 1 + 14 files changed, 12 insertions(+), 14 deletions(-) diff --git a/packages/react-codemods/transforms/pf3-pf4.button.test.js b/packages/react-codemods/transforms/pf3-pf4.button.test.js index a4b04757af1..14879f24bec 100644 --- a/packages/react-codemods/transforms/pf3-pf4.button.test.js +++ b/packages/react-codemods/transforms/pf3-pf4.button.test.js @@ -1,4 +1,3 @@ -import { EOL as SYSTEM_EOL } from 'os'; import prettier from 'prettier'; import { defineInlineTest } from 'jscodeshift/dist/testUtils'; import transform from './pf3-pf4'; diff --git a/packages/react-codemods/transforms/pf3-pf4.js b/packages/react-codemods/transforms/pf3-pf4.js index 22c5b820cee..942e0a0be21 100644 --- a/packages/react-codemods/transforms/pf3-pf4.js +++ b/packages/react-codemods/transforms/pf3-pf4.js @@ -1,4 +1,4 @@ -/* eslint-disable no-console */ +/* eslint-disable no-console,jsdoc/require-jsdoc */ const colors = require('colors'); const componentConfigs = require('../componentConfig'); diff --git a/packages/react-codemods/transforms/pf3-pf4.test.js b/packages/react-codemods/transforms/pf3-pf4.test.js index 1f305e2ba19..b879360dd3c 100644 --- a/packages/react-codemods/transforms/pf3-pf4.test.js +++ b/packages/react-codemods/transforms/pf3-pf4.test.js @@ -1,4 +1,3 @@ -import { EOL as SYSTEM_EOL } from 'os'; import prettier from 'prettier'; import { defineInlineTest, runInlineTest } from 'jscodeshift/dist/testUtils'; import transform from './pf3-pf4'; diff --git a/packages/react-core/src/components/AboutModal/AboutModal.tsx b/packages/react-core/src/components/AboutModal/AboutModal.tsx index acd11cfff74..29c8a57a7cb 100644 --- a/packages/react-core/src/components/AboutModal/AboutModal.tsx +++ b/packages/react-core/src/components/AboutModal/AboutModal.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import * as ReactDOM from 'react-dom'; import { css } from '@patternfly/react-styles'; import styles from '@patternfly/react-styles/css/components/Backdrop/backdrop'; -import { canUseDOM } from 'exenv'; +import { canUseDOM } from '../../helpers'; import { KEY_CODES } from '../../helpers/constants'; import { AboutModalContainer } from './AboutModalContainer'; import { PickOptional } from '../../helpers/typeUtils'; diff --git a/packages/react-core/src/components/AlertGroup/AlertGroup.tsx b/packages/react-core/src/components/AlertGroup/AlertGroup.tsx index 1a0839d86ea..f4a48e321bb 100644 --- a/packages/react-core/src/components/AlertGroup/AlertGroup.tsx +++ b/packages/react-core/src/components/AlertGroup/AlertGroup.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import * as ReactDOM from 'react-dom'; -import { canUseDOM } from 'exenv'; +import { canUseDOM } from '../../helpers'; import { Omit } from '../../helpers/typeUtils'; import { AlertGroupInline } from './AlertGroupInline'; diff --git a/packages/react-core/src/components/DataList/DataList.tsx b/packages/react-core/src/components/DataList/DataList.tsx index aebf6758fe6..6439d6b653b 100644 --- a/packages/react-core/src/components/DataList/DataList.tsx +++ b/packages/react-core/src/components/DataList/DataList.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; -import { isUndefined } from 'lodash'; import { css } from '@patternfly/react-styles'; import styles from '@patternfly/react-styles/css/components/DataList/data-list'; @@ -38,7 +37,7 @@ export const DataList: React.FunctionComponent = ({ isCompact = false, ...props }: DataListProps) => { - const isSelectable = !isUndefined(onSelectDataListItem); + const isSelectable = onSelectDataListItem !== undefined; const updateSelectedDataListItem = (id: string) => { onSelectDataListItem(id); diff --git a/packages/react-core/src/components/DataToolbar/DataToolbar.tsx b/packages/react-core/src/components/DataToolbar/DataToolbar.tsx index b8b76d1daf6..d90e7c04987 100644 --- a/packages/react-core/src/components/DataToolbar/DataToolbar.tsx +++ b/packages/react-core/src/components/DataToolbar/DataToolbar.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; -import { sum, values } from 'lodash'; import styles from '@patternfly/react-styles/css/components/DataToolbar/data-toolbar'; import { css } from '@patternfly/react-styles'; import { DataToolbarContext } from './DataToolbarUtils'; @@ -91,7 +90,7 @@ export class DataToolbar extends React.Component sum(values(this.state.filterInfo)); + getNumberOfFilters = () => Object.values(this.state.filterInfo).reduce((acc, cur) => acc + cur, 0); render() { const { diff --git a/packages/react-core/src/components/Modal/Modal.tsx b/packages/react-core/src/components/Modal/Modal.tsx index 00427055c2e..09fdccfc281 100644 --- a/packages/react-core/src/components/Modal/Modal.tsx +++ b/packages/react-core/src/components/Modal/Modal.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import * as ReactDOM from 'react-dom'; -import { canUseDOM } from 'exenv'; +import { canUseDOM } from '../../helpers'; import { css } from '@patternfly/react-styles'; import styles from '@patternfly/react-styles/css/components/Backdrop/backdrop'; diff --git a/packages/react-core/src/components/Tabs/Tab.tsx b/packages/react-core/src/components/Tabs/Tab.tsx index aca5294a085..1625f7a3200 100644 --- a/packages/react-core/src/components/Tabs/Tab.tsx +++ b/packages/react-core/src/components/Tabs/Tab.tsx @@ -18,4 +18,4 @@ export interface TabProps extends Omit; } -export const Tab: React.FunctionComponent = ({ className = '' }: TabProps) => null; +export const Tab: React.FunctionComponent = (_props: TabProps) => null; diff --git a/packages/react-core/src/components/Wizard/Wizard.tsx b/packages/react-core/src/components/Wizard/Wizard.tsx index c711201ed0e..051aad76017 100644 --- a/packages/react-core/src/components/Wizard/Wizard.tsx +++ b/packages/react-core/src/components/Wizard/Wizard.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import * as ReactDOM from 'react-dom'; -import { canUseDOM } from 'exenv'; +import { canUseDOM } from '../../helpers'; import { KEY_CODES } from '../../helpers/constants'; import { css } from '@patternfly/react-styles'; import styles from '@patternfly/react-styles/css/components/Wizard/wizard'; diff --git a/packages/react-core/src/components/withOuia/withOuia.tsx b/packages/react-core/src/components/withOuia/withOuia.tsx index 4721736b70d..2808a47c9a8 100644 --- a/packages/react-core/src/components/withOuia/withOuia.tsx +++ b/packages/react-core/src/components/withOuia/withOuia.tsx @@ -1,6 +1,5 @@ import * as React from 'react'; import { isOUIAEnvironment, getUniqueId, generateOUIAId } from './ouia'; -import { Omit } from '../../helpers/typeUtils'; export const OuiaContext = React.createContext(null); diff --git a/packages/react-core/src/helpers/safeHTMLElement.js b/packages/react-core/src/helpers/safeHTMLElement.js index 9f7aed3808e..1c26646dbba 100644 --- a/packages/react-core/src/helpers/safeHTMLElement.js +++ b/packages/react-core/src/helpers/safeHTMLElement.js @@ -1,4 +1,4 @@ // https://github.com/reactjs/react-modal/blob/master/src/helpers/safeHTMLElement.js -import { canUseDOM } from 'exenv'; +import { canUseDOM } from './util'; export default canUseDOM ? window.HTMLElement : {}; diff --git a/packages/react-core/src/helpers/util.ts b/packages/react-core/src/helpers/util.ts index 2631b4f6583..24a27b9eb58 100644 --- a/packages/react-core/src/helpers/util.ts +++ b/packages/react-core/src/helpers/util.ts @@ -247,3 +247,5 @@ export const formatBreakpointMods = ( `${acc}${acc && ' '}${getModifier(styles, `${curr.modifier}${curr.breakpoint ? `-on-${curr.breakpoint}` : ''}`)}`, '' ); + +export const canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement); diff --git a/packages/react-icons/src/createIcon.js b/packages/react-icons/src/createIcon.js index 6d059c8bdd7..40b9042e170 100644 --- a/packages/react-icons/src/createIcon.js +++ b/packages/react-icons/src/createIcon.js @@ -19,6 +19,7 @@ const createIcon = iconDefinition => { id = `icon-title-${currentId++}`; render() { + // eslint-disable-next-line @typescript-eslint/no-unused-vars const { size, color, title, noStyle, noVerticalAlign, ...props } = this.props; const hasTitle = Boolean(title); From 68df602f055713cf389c44f7b0746bd94322d724 Mon Sep 17 00:00:00 2001 From: patternfly-build Date: Fri, 6 Mar 2020 20:32:08 +0000 Subject: [PATCH 11/73] chore(release): releasing packages [ci skip] - @patternfly/react-catalog-view-extension@1.4.24 - @patternfly/react-codemods@1.1.5 - @patternfly/react-core@3.144.1 - @patternfly/react-docs@4.20.30 - @patternfly/react-icons@3.15.9 - @patternfly/react-inline-edit-extension@2.17.24 - demo-app-ts@3.27.1 - @patternfly/react-table@2.28.5 - @patternfly/react-topology@2.14.24 - @patternfly/react-virtualized-extension@1.4.25 --- .../react-catalog-view-extension/CHANGELOG.md | 8 ++++++++ .../react-catalog-view-extension/package.json | 4 ++-- packages/react-codemods/CHANGELOG.md | 8 ++++++++ packages/react-codemods/package.json | 2 +- packages/react-core/CHANGELOG.md | 8 ++++++++ packages/react-core/package.json | 4 ++-- packages/react-docs/CHANGELOG.md | 8 ++++++++ packages/react-docs/package.json | 16 ++++++++-------- packages/react-icons/CHANGELOG.md | 8 ++++++++ packages/react-icons/package.json | 2 +- .../react-inline-edit-extension/CHANGELOG.md | 8 ++++++++ .../react-inline-edit-extension/package.json | 8 ++++---- .../react-integration/demo-app-ts/CHANGELOG.md | 8 ++++++++ .../react-integration/demo-app-ts/package.json | 4 ++-- packages/react-table/CHANGELOG.md | 8 ++++++++ packages/react-table/package.json | 6 +++--- packages/react-topology/CHANGELOG.md | 8 ++++++++ packages/react-topology/package.json | 6 +++--- .../react-virtualized-extension/CHANGELOG.md | 8 ++++++++ .../react-virtualized-extension/package.json | 6 +++--- 20 files changed, 109 insertions(+), 29 deletions(-) diff --git a/packages/react-catalog-view-extension/CHANGELOG.md b/packages/react-catalog-view-extension/CHANGELOG.md index feaececb488..b9cc28d8404 100644 --- a/packages/react-catalog-view-extension/CHANGELOG.md +++ b/packages/react-catalog-view-extension/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [1.4.24](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-catalog-view-extension@1.4.23...@patternfly/react-catalog-view-extension@1.4.24) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-catalog-view-extension + + + + + ## [1.4.23](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-catalog-view-extension@1.4.22...@patternfly/react-catalog-view-extension@1.4.23) (2020-03-06) **Note:** Version bump only for package @patternfly/react-catalog-view-extension diff --git a/packages/react-catalog-view-extension/package.json b/packages/react-catalog-view-extension/package.json index 60293c2178b..77608fa34a2 100644 --- a/packages/react-catalog-view-extension/package.json +++ b/packages/react-catalog-view-extension/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-catalog-view-extension", - "version": "1.4.23", + "version": "1.4.24", "description": "This library provides catalog view extensions for PatternFly 4 React.", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -41,7 +41,7 @@ }, "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.144.0", + "@patternfly/react-core": "^3.144.1", "@patternfly/react-styles": "^3.7.6", "classnames": "^2.2.5", "patternfly": "^3.59.4" diff --git a/packages/react-codemods/CHANGELOG.md b/packages/react-codemods/CHANGELOG.md index 0e2bd411715..78c2aea87a2 100644 --- a/packages/react-codemods/CHANGELOG.md +++ b/packages/react-codemods/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [1.1.5](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-codemods@1.1.4...@patternfly/react-codemods@1.1.5) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-codemods + + + + + ## 1.1.4 (2019-04-15) diff --git a/packages/react-codemods/package.json b/packages/react-codemods/package.json index 01e25494846..ad33d073a35 100644 --- a/packages/react-codemods/package.json +++ b/packages/react-codemods/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-codemods", - "version": "1.1.4", + "version": "1.1.5", "private": false, "license": "MIT", "publishConfig": { diff --git a/packages/react-core/CHANGELOG.md b/packages/react-core/CHANGELOG.md index 6b433a04900..ad328fb6efd 100644 --- a/packages/react-core/CHANGELOG.md +++ b/packages/react-core/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [3.144.1](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@3.144.0...@patternfly/react-core@3.144.1) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-core + + + + + # [3.144.0](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@3.143.0...@patternfly/react-core@3.144.0) (2020-03-06) diff --git a/packages/react-core/package.json b/packages/react-core/package.json index 4a9928d56b9..681a4559562 100644 --- a/packages/react-core/package.json +++ b/packages/react-core/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-core", - "version": "3.144.0", + "version": "3.144.1", "description": "This library provides a set of common React components for use with the PatternFly reference implementation.", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -40,7 +40,7 @@ "gen:tests": "yo tsx-docgen" }, "dependencies": { - "@patternfly/react-icons": "^3.15.8", + "@patternfly/react-icons": "^3.15.9", "@patternfly/react-styles": "^3.7.6", "@patternfly/react-tokens": "^2.8.6", "emotion": "^9.2.9", diff --git a/packages/react-docs/CHANGELOG.md b/packages/react-docs/CHANGELOG.md index f6ed2827848..00f184143ef 100644 --- a/packages/react-docs/CHANGELOG.md +++ b/packages/react-docs/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [4.20.30](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-docs@4.20.29...@patternfly/react-docs@4.20.30) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-docs + + + + + ## [4.20.29](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-docs@4.20.28...@patternfly/react-docs@4.20.29) (2020-03-06) **Note:** Version bump only for package @patternfly/react-docs diff --git a/packages/react-docs/package.json b/packages/react-docs/package.json index 0dac43eb552..3764d8b7943 100644 --- a/packages/react-docs/package.json +++ b/packages/react-docs/package.json @@ -1,7 +1,7 @@ { "name": "@patternfly/react-docs", "description": "PatternFly React Docs", - "version": "4.20.29", + "version": "4.20.30", "author": "Red Hat", "license": "MIT", "private": true, @@ -19,17 +19,17 @@ "@mdx-js/mdx": "^1.1.5", "@mdx-js/react": "^1.1.5", "@patternfly/patternfly": "2.65.3", - "@patternfly/react-catalog-view-extension": "^1.4.23", + "@patternfly/react-catalog-view-extension": "^1.4.24", "@patternfly/react-charts": "^5.3.10", - "@patternfly/react-core": "^3.144.0", - "@patternfly/react-icons": "^3.15.8", - "@patternfly/react-inline-edit-extension": "^2.17.23", + "@patternfly/react-core": "^3.144.1", + "@patternfly/react-icons": "^3.15.9", + "@patternfly/react-inline-edit-extension": "^2.17.24", "@patternfly/react-styled-system": "^3.8.8", "@patternfly/react-styles": "^3.7.6", - "@patternfly/react-table": "^2.28.4", + "@patternfly/react-table": "^2.28.5", "@patternfly/react-tokens": "^2.8.6", - "@patternfly/react-topology": "^2.14.23", - "@patternfly/react-virtualized-extension": "^1.4.24", + "@patternfly/react-topology": "^2.14.24", + "@patternfly/react-virtualized-extension": "^1.4.25", "gatsby": "2.19.12", "gatsby-cli": "2.8.29", "gatsby-theme-patternfly-org": "^1.4.1", diff --git a/packages/react-icons/CHANGELOG.md b/packages/react-icons/CHANGELOG.md index 44c745c6f10..e97184efb47 100644 --- a/packages/react-icons/CHANGELOG.md +++ b/packages/react-icons/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [3.15.9](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-icons@3.15.8...@patternfly/react-icons@3.15.9) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-icons + + + + + ## [3.15.8](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-icons@3.15.5...@patternfly/react-icons@3.15.8) (2020-03-06) **Note:** Version bump only for package @patternfly/react-icons diff --git a/packages/react-icons/package.json b/packages/react-icons/package.json index a0e29c7e005..127bc8f376a 100644 --- a/packages/react-icons/package.json +++ b/packages/react-icons/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-icons", - "version": "3.15.8", + "version": "3.15.9", "description": "PatternFly 4 Icons as React Components", "main": "dist/js/index.js", "module": "dist/esm/index.js", diff --git a/packages/react-inline-edit-extension/CHANGELOG.md b/packages/react-inline-edit-extension/CHANGELOG.md index dc06c18867e..dd39b725011 100644 --- a/packages/react-inline-edit-extension/CHANGELOG.md +++ b/packages/react-inline-edit-extension/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [2.17.24](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-inline-edit-extension@2.17.23...@patternfly/react-inline-edit-extension@2.17.24) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-inline-edit-extension + + + + + ## [2.17.23](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-inline-edit-extension@2.17.22...@patternfly/react-inline-edit-extension@2.17.23) (2020-03-06) **Note:** Version bump only for package @patternfly/react-inline-edit-extension diff --git a/packages/react-inline-edit-extension/package.json b/packages/react-inline-edit-extension/package.json index ab893a8182f..87bc5d84b39 100644 --- a/packages/react-inline-edit-extension/package.json +++ b/packages/react-inline-edit-extension/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-inline-edit-extension", - "version": "2.17.23", + "version": "2.17.24", "description": "This library provides inline editing support for PatternFly 4 React table", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -28,10 +28,10 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/patternfly-4/", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.144.0", - "@patternfly/react-icons": "^3.15.8", + "@patternfly/react-core": "^3.144.1", + "@patternfly/react-icons": "^3.15.9", "@patternfly/react-styles": "^3.7.6", - "@patternfly/react-table": "^2.28.4", + "@patternfly/react-table": "^2.28.5", "classnames": "^2.2.5", "exenv": "^1.2.2", "reactabular-table": "^8.14.0" diff --git a/packages/react-integration/demo-app-ts/CHANGELOG.md b/packages/react-integration/demo-app-ts/CHANGELOG.md index f98aafc92b9..56de986ee1d 100644 --- a/packages/react-integration/demo-app-ts/CHANGELOG.md +++ b/packages/react-integration/demo-app-ts/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [3.27.1](https://github.com/patternfly/patternfly-react/compare/demo-app-ts@3.27.0...demo-app-ts@3.27.1) (2020-03-06) + +**Note:** Version bump only for package demo-app-ts + + + + + # [3.27.0](https://github.com/patternfly/patternfly-react/compare/demo-app-ts@3.26.0...demo-app-ts@3.27.0) (2020-03-06) diff --git a/packages/react-integration/demo-app-ts/package.json b/packages/react-integration/demo-app-ts/package.json index 9ba2a6ce573..83ba4f62745 100644 --- a/packages/react-integration/demo-app-ts/package.json +++ b/packages/react-integration/demo-app-ts/package.json @@ -1,13 +1,13 @@ { "name": "demo-app-ts", "private": true, - "version": "3.27.0", + "version": "3.27.1", "scripts": { "build:demo-app": "react-scripts build", "start:demo-app": "react-scripts start" }, "dependencies": { - "@patternfly/react-core": "^3.144.0", + "@patternfly/react-core": "^3.144.1", "react": "^16.8.0", "react-dom": "^16.8.0", "react-router": "^4.3.1", diff --git a/packages/react-table/CHANGELOG.md b/packages/react-table/CHANGELOG.md index b95bb2bdf43..ec850980c69 100644 --- a/packages/react-table/CHANGELOG.md +++ b/packages/react-table/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [2.28.5](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-table@2.28.4...@patternfly/react-table@2.28.5) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-table + + + + + ## [2.28.4](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-table@2.28.3...@patternfly/react-table@2.28.4) (2020-03-06) **Note:** Version bump only for package @patternfly/react-table diff --git a/packages/react-table/package.json b/packages/react-table/package.json index 4c3855492ee..bb9fae262b2 100644 --- a/packages/react-table/package.json +++ b/packages/react-table/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-table", - "version": "2.28.4", + "version": "2.28.5", "description": "This library provides a set of React table components for use with the PatternFly 4", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -28,8 +28,8 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/react-table#readme", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.144.0", - "@patternfly/react-icons": "^3.15.8", + "@patternfly/react-core": "^3.144.1", + "@patternfly/react-icons": "^3.15.9", "@patternfly/react-styles": "^3.7.6", "@patternfly/react-tokens": "^2.8.6", "classnames": "^2.2.5", diff --git a/packages/react-topology/CHANGELOG.md b/packages/react-topology/CHANGELOG.md index 7b60190eb1a..e702e7f6fa3 100644 --- a/packages/react-topology/CHANGELOG.md +++ b/packages/react-topology/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [2.14.24](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-topology@2.14.23...@patternfly/react-topology@2.14.24) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-topology + + + + + ## [2.14.23](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-topology@2.14.22...@patternfly/react-topology@2.14.23) (2020-03-06) **Note:** Version bump only for package @patternfly/react-topology diff --git a/packages/react-topology/package.json b/packages/react-topology/package.json index eef70f6458b..4c3d8594004 100644 --- a/packages/react-topology/package.json +++ b/packages/react-topology/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-topology", - "version": "2.14.23", + "version": "2.14.24", "description": "This library provides a set of React topology view components for use with the PatternFly 4", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -26,8 +26,8 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/react-topology#readme", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.144.0", - "@patternfly/react-icons": "^3.15.8", + "@patternfly/react-core": "^3.144.1", + "@patternfly/react-icons": "^3.15.9", "@patternfly/react-styles": "^3.7.6" }, "peerDependencies": { diff --git a/packages/react-virtualized-extension/CHANGELOG.md b/packages/react-virtualized-extension/CHANGELOG.md index 1d8aefe5164..8f4ed612877 100644 --- a/packages/react-virtualized-extension/CHANGELOG.md +++ b/packages/react-virtualized-extension/CHANGELOG.md @@ -3,6 +3,14 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [1.4.25](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-virtualized-extension@1.4.24...@patternfly/react-virtualized-extension@1.4.25) (2020-03-06) + +**Note:** Version bump only for package @patternfly/react-virtualized-extension + + + + + ## [1.4.24](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-virtualized-extension@1.4.23...@patternfly/react-virtualized-extension@1.4.24) (2020-03-06) **Note:** Version bump only for package @patternfly/react-virtualized-extension diff --git a/packages/react-virtualized-extension/package.json b/packages/react-virtualized-extension/package.json index ac24d3238b6..3872422badf 100644 --- a/packages/react-virtualized-extension/package.json +++ b/packages/react-virtualized-extension/package.json @@ -1,6 +1,6 @@ { "name": "@patternfly/react-virtualized-extension", - "version": "1.4.24", + "version": "1.4.25", "description": "This library provides efficient rendering extensions for PatternFly 4 React tables and lists.", "main": "dist/js/index.js", "module": "dist/esm/index.js", @@ -28,8 +28,8 @@ "homepage": "https://github.com/patternfly/patternfly-react/tree/master/packages/react-virtualized-extension/", "dependencies": { "@patternfly/patternfly": "2.65.3", - "@patternfly/react-core": "^3.144.0", - "@patternfly/react-icons": "^3.15.8", + "@patternfly/react-core": "^3.144.1", + "@patternfly/react-icons": "^3.15.9", "@patternfly/react-styles": "^3.7.6", "@types/react-virtualized": "^9.21.5", "clsx": "^1.0.1", From 2263de8361b196f4421a3adcbb01b4b2dd410d4a Mon Sep 17 00:00:00 2001 From: kmcfaul <45077788+kmcfaul@users.noreply.github.com> Date: Mon, 9 Mar 2020 09:33:25 -0400 Subject: [PATCH 12/73] feat(Select): add inline filtering to checkbox select (#3843) * feat(Select): add inline filtering * feat(Select): add unit test * feat(Select): add filtering select demo to integration * feat(Select): add clear button, fix lint, update wider snapshots * fix(integration): fix lint * fix(docs): add missing import * feat(Select): update integration tests with clear button changes * feat(Select): move integration demos back to integration * feat(Select): remove typeahead restriction on clear button * docs(Select): update docs example --- .../__snapshots__/DataToolbar.test.tsx.snap | 16 + .../src/components/Select/Select.tsx | 107 +- .../src/components/Select/SelectMenu.tsx | 51 +- .../src/components/Select/SelectOption.tsx | 31 +- .../src/components/Select/SelectToggle.tsx | 7 +- .../Select/__tests__/Select.test.tsx | 16 + .../__snapshots__/Select.test.tsx.snap | 1085 ++++++++++++++--- .../__snapshots__/SelectOption.test.tsx.snap | 14 +- .../__snapshots__/SelectToggle.test.tsx.snap | 3 + .../src/components/Select/examples/Select.md | 115 +- packages/react-core/src/helpers/util.ts | 2 +- .../integration/selectfiltering.spec.ts | 28 + .../demo-app-ts/src/Demos.ts | 5 + .../demos/SelectDemo/FilteringSelectDemo.tsx | 107 ++ .../demo-app-ts/src/components/demos/index.ts | 1 + 15 files changed, 1340 insertions(+), 248 deletions(-) create mode 100644 packages/react-integration/cypress/integration/selectfiltering.spec.ts create mode 100644 packages/react-integration/demo-app-ts/src/components/demos/SelectDemo/FilteringSelectDemo.tsx diff --git a/packages/react-core/src/components/DataToolbar/__tests__/__snapshots__/DataToolbar.test.tsx.snap b/packages/react-core/src/components/DataToolbar/__tests__/__snapshots__/DataToolbar.test.tsx.snap index abc4d845bdc..9cf9983e513 100644 --- a/packages/react-core/src/components/DataToolbar/__tests__/__snapshots__/DataToolbar.test.tsx.snap +++ b/packages/react-core/src/components/DataToolbar/__tests__/__snapshots__/DataToolbar.test.tsx.snap @@ -171,6 +171,7 @@ exports[`data toolbar DataToolbarFilter 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -185,6 +186,7 @@ exports[`data toolbar DataToolbarFilter 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -213,6 +215,7 @@ exports[`data toolbar DataToolbarFilter 1`] = ` createText="Create" customContent={null} direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={false} @@ -250,6 +253,7 @@ exports[`data toolbar DataToolbarFilter 1`] = ` ariaLabelledBy=" pf-toggle-id-4" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-4" isActive={false} isDisabled={false} @@ -889,6 +893,7 @@ exports[`data toolbar DataToolbarFilter 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -903,6 +908,7 @@ exports[`data toolbar DataToolbarFilter 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -931,6 +937,7 @@ exports[`data toolbar DataToolbarFilter 1`] = ` createText="Create" customContent={null} direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={false} @@ -968,6 +975,7 @@ exports[`data toolbar DataToolbarFilter 1`] = ` ariaLabelledBy=" pf-toggle-id-5" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-5" isActive={false} isDisabled={false} @@ -2355,6 +2363,7 @@ exports[`data toolbar DataToolbarToggleGroup 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -2369,6 +2378,7 @@ exports[`data toolbar DataToolbarToggleGroup 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -2397,6 +2407,7 @@ exports[`data toolbar DataToolbarToggleGroup 1`] = ` createText="Create" customContent={null} direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={false} @@ -2434,6 +2445,7 @@ exports[`data toolbar DataToolbarToggleGroup 1`] = ` ariaLabelledBy=" pf-toggle-id-0" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-0" isActive={false} isDisabled={false} @@ -2569,6 +2581,7 @@ exports[`data toolbar DataToolbarToggleGroup 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -2583,6 +2596,7 @@ exports[`data toolbar DataToolbarToggleGroup 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -2611,6 +2625,7 @@ exports[`data toolbar DataToolbarToggleGroup 1`] = ` createText="Create" customContent={null} direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={false} @@ -2648,6 +2663,7 @@ exports[`data toolbar DataToolbarToggleGroup 1`] = ` ariaLabelledBy=" pf-toggle-id-1" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-1" isActive={false} isDisabled={false} diff --git a/packages/react-core/src/components/Select/Select.tsx b/packages/react-core/src/components/Select/Select.tsx index e0b7dcb52f4..b88dc766e82 100644 --- a/packages/react-core/src/components/Select/Select.tsx +++ b/packages/react-core/src/components/Select/Select.tsx @@ -8,11 +8,12 @@ import TimesCircleIcon from '@patternfly/react-icons/dist/js/icons/times-circle- import { SelectMenu } from './SelectMenu'; import { SelectOption, SelectOptionObject } from './SelectOption'; import { SelectToggle } from './SelectToggle'; -import { SelectContext, SelectVariant, SelectDirection } from './selectConstants'; +import { SelectContext, SelectVariant, SelectDirection, KeyTypes } from './selectConstants'; import { Chip, ChipGroup } from '../ChipGroup'; import { keyHandler, getNextIndex } from '../../helpers/util'; import { Omit, PickOptional } from '../../helpers/typeUtils'; import { InjectedOuiaProps, withOuiaContext } from '../withOuia'; +import { Divider } from '../Divider'; // seed for the aria-labelledby ID let currentId = 0; @@ -81,6 +82,8 @@ export interface SelectProps toggleIcon?: React.ReactElement; /** Custom content to render in the select menu. If this prop is defined, the variant prop will be ignored and the select will render with a single select toggle */ customContent?: React.ReactNode; + /** Flag indicating if select should have an inline text input for filtering */ + hasInlineFilter?: boolean; } export interface SelectState { @@ -94,6 +97,7 @@ export interface SelectState { class Select extends React.Component { private parentRef = React.createRef(); + private filterRef = React.createRef(); private refCollection: HTMLElement[] = []; static defaultProps: PickOptional = { @@ -122,7 +126,8 @@ class Select extends React.Component undefined as void, toggleIcon: null as React.ReactElement, onFilter: null, - customContent: null + customContent: null, + hasInlineFilter: false }; state: SelectState = { @@ -135,6 +140,10 @@ class Select extends React.Component { + if (this.props.hasInlineFilter) { + this.refCollection[0] = this.filterRef.current; + } + if (!prevState.openedOnEnter && this.state.openedOnEnter) { this.refCollection[0].focus(); } @@ -190,7 +199,10 @@ class Select extends React.Component); + !isCreatable && + typeaheadFilteredChildren.push( + + ); } if (isCreatable && e.target.value !== '') { const newValue = e.target.value; @@ -357,10 +369,11 @@ class Select extends React.Component 0 ? true : false) : selections !== ''); + const clearBtn = ( + + ); + let selectedChips = null; if (variant === SelectVariant.typeaheadMulti) { selectedChips = ( @@ -385,6 +417,36 @@ class Select extends React.Component +
      + { + if (event.key === KeyTypes.ArrowUp) { + this.handleArrowKeys(0, 'up'); + } else if (event.key === KeyTypes.ArrowDown) { + this.handleArrowKeys(0, 'down'); + } + }} + ref={this.filterRef} + autoComplete="off" + > +
      + + + ); + this.refCollection[0] = this.filterRef.current; + filterWithChildren = [filterBox, ...(typeaheadFilteredChildren as React.ReactElement[])].map((option, index) => + React.cloneElement(option, { key: index }) + ); + } + return (
      {customContent && (
      @@ -427,6 +490,7 @@ class Select extends React.Component {this.getDisplay(selections as string, 'node') || placeholderText || childPlaceholderText} + {hasOnClear && hasAnySelections && clearBtn}
      )} {variant === SelectVariant.checkbox && !customContent && ( @@ -440,6 +504,7 @@ class Select extends React.Component )}
      + {hasOnClear && hasAnySelections && clearBtn} )} {variant === SelectVariant.typeahead && !customContent && ( @@ -465,20 +530,7 @@ class Select extends React.Component - {(selections || typeaheadInputValue) && ( - - )} + {(selections || typeaheadInputValue) && clearBtn} )} {variant === SelectVariant.typeaheadMulti && !customContent && ( @@ -501,20 +553,8 @@ class Select extends React.Component - {((selections && (Array.isArray(selections) && selections.length > 0)) || typeaheadInputValue) && ( - - )} + {((selections && (Array.isArray(selections) && selections.length > 0)) || typeaheadInputValue) && + clearBtn} )} @@ -557,8 +597,9 @@ class Select extends React.Component - {children} + {filterWithChildren} )} {(variant === SelectVariant.typeahead || variant === SelectVariant.typeaheadMulti) && diff --git a/packages/react-core/src/components/Select/SelectMenu.tsx b/packages/react-core/src/components/Select/SelectMenu.tsx index 725d2b1d815..8e485aba094 100644 --- a/packages/react-core/src/components/Select/SelectMenu.tsx +++ b/packages/react-core/src/components/Select/SelectMenu.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import styles from '@patternfly/react-styles/css/components/Select/select'; import { default as formStyles } from '@patternfly/react-styles/css/components/Form/form'; import { css } from '@patternfly/react-styles'; -import { SelectOptionObject } from './SelectOption'; +import { SelectOptionObject, SelectOption } from './SelectOption'; import { SelectConsumer, SelectVariant } from './selectConstants'; import { Omit, PickOptional } from '../../helpers/typeUtils'; @@ -36,6 +36,8 @@ export interface SelectMenuProps extends Omit, 'che sendRef?: (ref: React.ReactNode, index: number) => void; /** Internal callback for keyboard navigation */ keyHandler?: (index: number, position: string) => void; + /** Flag indicating select has an inline text input for filtering */ + hasInlineFilter?: boolean; } export class SelectMenu extends React.Component { @@ -48,7 +50,8 @@ export class SelectMenu extends React.Component { maxHeight: '', sendRef: () => {}, keyHandler: () => {}, - isCustomContent: false + isCustomContent: false, + hasInlineFilter: false }; extendChildren() { @@ -83,13 +86,15 @@ export class SelectMenu extends React.Component { }); } - extendCheckboxChildren() { - const { children, isGrouped, checked, sendRef, keyHandler } = this.props; - const childrenArray = children as React.ReactElement[]; + extendCheckboxChildren(children: React.ReactElement[]) { + const { isGrouped, checked, sendRef, keyHandler, hasInlineFilter } = this.props; + let index = hasInlineFilter ? 1 : 0; if (isGrouped) { - let index = 0; - return React.Children.map(childrenArray, (group: React.ReactElement) => - React.cloneElement(group, { + return React.Children.map(children, (group: React.ReactElement) => { + if (group.type === SelectOption) { + return group; + } + return React.cloneElement(group, { titleId: group.props.label.replace(/\W/g, '-'), children: (
      { )}
      ) - }) - ); + }); + }); } - return ( - - {React.Children.map(childrenArray, (child: React.ReactElement, index: number) => - React.cloneElement(child, { - isChecked: checked && checked.includes(child.props.value), - sendRef, - keyHandler, - index - }) - )} - + return React.Children.map(children, (child: React.ReactElement) => + React.cloneElement(child, { + isChecked: checked && checked.includes(child.props.value), + sendRef, + keyHandler, + index: index++ + }) ); } @@ -141,10 +142,10 @@ export class SelectMenu extends React.Component { createText, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, + hasInlineFilter, ...props } = this.props; /* eslint-enable @typescript-eslint/no-unused-vars */ - return ( {({ variant }) => ( @@ -180,7 +181,11 @@ export class SelectMenu extends React.Component { aria-labelledby={(!ariaLabel && ariaLabelledBy) || null} className={css(formStyles.formFieldset)} > - {this.extendCheckboxChildren()} + {hasInlineFilter && [ + (children as React.ReactElement[]).shift(), + ...this.extendCheckboxChildren(children as React.ReactElement[]) + ]} + {!hasInlineFilter && this.extendCheckboxChildren(children as React.ReactElement[])} diff --git a/packages/react-core/src/components/Select/SelectOption.tsx b/packages/react-core/src/components/Select/SelectOption.tsx index 556ab52413b..ed8f071591e 100644 --- a/packages/react-core/src/components/Select/SelectOption.tsx +++ b/packages/react-core/src/components/Select/SelectOption.tsx @@ -27,6 +27,8 @@ export interface SelectOptionProps extends Omit, 't isDisabled?: boolean; /** Flag indicating if the option acts as a placeholder */ isPlaceholder?: boolean; + /** Flad indicating if the option acts as a "no results" indicator */ + isNoResultsOption?: boolean; /** Internal flag indicating if the option is selected */ isSelected?: boolean; /** Internal flag indicating if the option is checked */ @@ -52,6 +54,7 @@ export class SelectOption extends React.Component { isSelected: false, isChecked: false, isFocused: false, + isNoResultsOption: false, component: 'button', onClick: () => {}, sendRef: () => {}, @@ -59,11 +62,11 @@ export class SelectOption extends React.Component { }; componentDidMount() { - this.props.sendRef(this.ref.current, this.props.index); + this.props.sendRef(this.props.isDisabled ? null : this.ref.current, this.props.index); } componentDidUpdate() { - this.props.sendRef(this.ref.current, this.props.index); + this.props.sendRef(this.props.isDisabled ? null : this.ref.current, this.props.index); } onKeyDown = (event: React.KeyboardEvent) => { @@ -92,6 +95,7 @@ export class SelectOption extends React.Component { onClick, isDisabled, isPlaceholder, + isNoResultsOption, isSelected, isChecked, isFocused, @@ -136,7 +140,7 @@ export class SelectOption extends React.Component {
      )} - {variant === SelectVariant.checkbox && ( + {variant === SelectVariant.checkbox && !isNoResultsOption && ( )} + {variant === SelectVariant.checkbox && isNoResultsOption && ( +
      + + {children || value.toString()} + +
      + )} )} diff --git a/packages/react-core/src/components/Select/SelectToggle.tsx b/packages/react-core/src/components/Select/SelectToggle.tsx index d0f7d309700..286de1b997e 100644 --- a/packages/react-core/src/components/Select/SelectToggle.tsx +++ b/packages/react-core/src/components/Select/SelectToggle.tsx @@ -43,6 +43,8 @@ export interface SelectToggleProps extends React.HTMLProps { ariaLabelToggle?: string; /** Flag for variant, determines toggle rules and interaction */ variant?: 'single' | 'checkbox' | 'typeahead' | 'typeaheadmulti'; + /** Flag indicating if select toggle has an clear button */ + hasClearButton?: boolean; } export class SelectToggle extends React.Component { @@ -56,6 +58,7 @@ export class SelectToggle extends React.Component { isActive: false, isPlain: false, isDisabled: false, + hasClearButton: false, variant: 'single', ariaLabelledBy: '', ariaLabelToggle: '', @@ -168,12 +171,14 @@ export class SelectToggle extends React.Component { parentRef, id, type, + hasClearButton, ariaLabelledBy, ariaLabelToggle, ...props } = this.props; /* eslint-enable @typescript-eslint/no-unused-vars */ - const isTypeahead = variant === SelectVariant.typeahead || variant === SelectVariant.typeaheadMulti; + const isTypeahead = + variant === SelectVariant.typeahead || variant === SelectVariant.typeaheadMulti || hasClearButton; const toggleProps: { id: string; 'aria-labelledby': string; diff --git a/packages/react-core/src/components/Select/__tests__/Select.test.tsx b/packages/react-core/src/components/Select/__tests__/Select.test.tsx index a87e4469e79..300fdcf2fb3 100644 --- a/packages/react-core/src/components/Select/__tests__/Select.test.tsx +++ b/packages/react-core/src/components/Select/__tests__/Select.test.tsx @@ -170,6 +170,22 @@ describe('checkbox select', () => { expect(view).toMatchSnapshot(); }); + test('renders expanded with filtering successfully', () => { + const view = mount( + + ); + expect(view).toMatchSnapshot(); + }); + test('renders expanded successfully with custom objects', () => { const view = mount( + + Mr: User One + + + + + + + + + + + + + + + + + +
      +`; + +exports[`checkbox select renders expanded with filtering successfully 1`] = ` + + , + , + , + , + ], + "hasInlineFilter": true, + "isExpanded": true, + "onClear": [MockFunction], + "onSelect": [MockFunction], + "onToggle": [MockFunction], + "variant": "checkbox", + } + } + consumerContext={null} + > + + +
      + + + + @@ -3146,16 +3690,10 @@ exports[`checkbox select renders expanded successfully with custom objects 1`] = type="button" variant="checkbox" > - + + + + + + +
      + +
      + +
      +
      + + + @@ -3385,6 +3970,7 @@ exports[`select custom select filter filters properly 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3399,6 +3985,7 @@ exports[`select custom select filter filters properly 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3413,6 +4000,7 @@ exports[`select custom select filter filters properly 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3427,6 +4015,7 @@ exports[`select custom select filter filters properly 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3455,6 +4044,7 @@ exports[`select custom select filter filters properly 1`] = ` createText="Create" customContent={null} direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={true} @@ -3492,6 +4082,7 @@ exports[`select custom select filter filters properly 1`] = ` ariaLabelledBy=" pf-toggle-id-6" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-6" isActive={false} isDisabled={false} @@ -3720,6 +4311,7 @@ exports[`select custom select filter filters properly 1`] = ` aria-label="" aria-labelledby="" className="" + hasInlineFilter={false} isCustomContent={false} isExpanded={false} isGrouped={false} @@ -3741,6 +4333,7 @@ exports[`select custom select filter filters properly 1`] = ` isChecked={false} isDisabled={false} isFocused={null} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key=".$00" @@ -3773,6 +4366,7 @@ exports[`select custom select filter filters properly 1`] = ` isChecked={false} isDisabled={false} isFocused={null} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key=".$01" @@ -3805,6 +4399,7 @@ exports[`select custom select filter filters properly 1`] = ` isChecked={false} isDisabled={false} isFocused={null} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key=".$03" @@ -3860,6 +4455,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3874,6 +4470,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3888,6 +4485,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3902,6 +4500,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3920,6 +4519,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3934,6 +4534,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3948,6 +4549,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3962,6 +4564,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -3991,6 +4594,7 @@ exports[`select renders select groups successfully 1`] = ` createText="Create" customContent={null} direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={true} @@ -4028,6 +4632,7 @@ exports[`select renders select groups successfully 1`] = ` ariaLabelledBy=" pf-toggle-id-7" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-7" isActive={false} isDisabled={false} @@ -4251,6 +4856,7 @@ exports[`select renders select groups successfully 1`] = ` aria-label="" aria-labelledby="" className="" + hasInlineFilter={false} isCustomContent={false} isExpanded={false} isGrouped={false} @@ -4295,6 +4901,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key="00" @@ -4325,6 +4932,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key="01" @@ -4355,6 +4963,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key="02" @@ -4385,6 +4994,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key="03" @@ -4441,6 +5051,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key="00" @@ -4471,6 +5082,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key="01" @@ -4501,6 +5113,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key="02" @@ -4531,6 +5144,7 @@ exports[`select renders select groups successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key="03" @@ -4583,6 +5197,7 @@ exports[`select renders up drection successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -4597,6 +5212,7 @@ exports[`select renders up drection successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -4611,6 +5227,7 @@ exports[`select renders up drection successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -4625,6 +5242,7 @@ exports[`select renders up drection successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -4652,6 +5270,7 @@ exports[`select renders up drection successfully 1`] = ` createText="Create" customContent={null} direction="up" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={false} @@ -4689,6 +5308,7 @@ exports[`select renders up drection successfully 1`] = ` ariaLabelledBy=" pf-toggle-id-4" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-4" isActive={false} isDisabled={false} @@ -4817,6 +5437,7 @@ exports[`select single select renders closed successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -4831,6 +5452,7 @@ exports[`select single select renders closed successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -4845,6 +5467,7 @@ exports[`select single select renders closed successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -4859,6 +5482,7 @@ exports[`select single select renders closed successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -4885,6 +5509,7 @@ exports[`select single select renders closed successfully 1`] = ` createText="Create" customContent={null} direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={false} @@ -4922,6 +5547,7 @@ exports[`select single select renders closed successfully 1`] = ` ariaLabelledBy=" pf-toggle-id-0" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-0" isActive={false} isDisabled={false} @@ -5051,6 +5677,7 @@ exports[`select single select renders disabled successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5065,6 +5692,7 @@ exports[`select single select renders disabled successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5079,6 +5707,7 @@ exports[`select single select renders disabled successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5093,6 +5722,7 @@ exports[`select single select renders disabled successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5120,6 +5750,7 @@ exports[`select single select renders disabled successfully 1`] = ` createText="Create" customContent={null} direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={true} isExpanded={false} @@ -5157,6 +5788,7 @@ exports[`select single select renders disabled successfully 1`] = ` ariaLabelledBy=" pf-toggle-id-1" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-1" isActive={false} isDisabled={true} @@ -5287,6 +5919,7 @@ exports[`select single select renders expanded successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5301,6 +5934,7 @@ exports[`select single select renders expanded successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5315,6 +5949,7 @@ exports[`select single select renders expanded successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5329,6 +5964,7 @@ exports[`select single select renders expanded successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5356,6 +5992,7 @@ exports[`select single select renders expanded successfully 1`] = ` createText="Create" customContent={null} direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={true} @@ -5393,6 +6030,7 @@ exports[`select single select renders expanded successfully 1`] = ` ariaLabelledBy=" pf-toggle-id-2" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-2" isActive={false} isDisabled={false} @@ -5554,6 +6192,7 @@ exports[`select single select renders expanded successfully 1`] = ` aria-label="" aria-labelledby="" className="" + hasInlineFilter={false} isCustomContent={false} isExpanded={false} isGrouped={false} @@ -5575,6 +6214,7 @@ exports[`select single select renders expanded successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key=".$00" @@ -5607,6 +6247,7 @@ exports[`select single select renders expanded successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key=".$01" @@ -5639,6 +6280,7 @@ exports[`select single select renders expanded successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key=".$02" @@ -5671,6 +6313,7 @@ exports[`select single select renders expanded successfully 1`] = ` isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key=".$03" @@ -5722,6 +6365,7 @@ exports[`select single select renders expanded successfully with custom objects isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5744,6 +6388,7 @@ exports[`select single select renders expanded successfully with custom objects isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5766,6 +6411,7 @@ exports[`select single select renders expanded successfully with custom objects isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} keyHandler={[Function]} @@ -5801,6 +6447,7 @@ exports[`select single select renders expanded successfully with custom objects createText="Create" customContent={null} direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={true} @@ -5838,6 +6485,7 @@ exports[`select single select renders expanded successfully with custom objects ariaLabelledBy=" pf-toggle-id-3" className="" handleTypeaheadKeys={[Function]} + hasClearButton={false} id="pf-toggle-id-3" isActive={false} isDisabled={false} @@ -5987,6 +6635,7 @@ exports[`select single select renders expanded successfully with custom objects aria-label="" aria-labelledby="" className="" + hasInlineFilter={false} isCustomContent={false} isExpanded={false} isGrouped={false} @@ -6008,6 +6657,7 @@ exports[`select single select renders expanded successfully with custom objects isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key=".$0" @@ -6048,6 +6698,7 @@ exports[`select single select renders expanded successfully with custom objects isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key=".$1" @@ -6088,6 +6739,7 @@ exports[`select single select renders expanded successfully with custom objects isChecked={false} isDisabled={false} isFocused={false} + isNoResultsOption={false} isPlaceholder={false} isSelected={false} key=".$2" @@ -6154,6 +6806,7 @@ exports[`select with custom content renders closed successfully 1`] = ` createText="Create" customContent="testing custom" direction="down" + hasInlineFilter={false} isCreatable={false} isDisabled={false} isExpanded={false} @@ -6187,10 +6840,11 @@ exports[`select with custom content renders closed successfully 1`] = ` >