@patternfly/react-core 6.0.0-prerelease.12 → 6.0.0-prerelease.14

package/helpers/package.json

@@ -1 +1 @@
-{"name":"@patternfly/react-core-helpers","main":"../dist/js/helpers/index.js","module":"../dist/esm/helpers/index.js","typings":"../dist/esm/helpers/index.d.ts","version":"6.0.0-prerelease.11","private":true}
+{"name":"@patternfly/react-core-helpers","main":"../dist/js/helpers/index.js","module":"../dist/esm/helpers/index.js","typings":"../dist/esm/helpers/index.d.ts","version":"6.0.0-prerelease.13","private":true}

package/layouts/package.json

@@ -1 +1 @@
-{"name":"@patternfly/react-core-layouts","main":"../dist/js/layouts/index.js","module":"../dist/esm/layouts/index.js","typings":"../dist/esm/layouts/index.d.ts","version":"6.0.0-prerelease.11","private":true}
+{"name":"@patternfly/react-core-layouts","main":"../dist/js/layouts/index.js","module":"../dist/esm/layouts/index.js","typings":"../dist/esm/layouts/index.d.ts","version":"6.0.0-prerelease.13","private":true}

package/next/package.json

@@ -1 +1 @@
-{"name":"@patternfly/react-core-next","main":"../dist/js/next/index.js","module":"../dist/esm/next/index.js","typings":"../dist/esm/next/index.d.ts","version":"6.0.0-prerelease.11","private":true}
+{"name":"@patternfly/react-core-next","main":"../dist/js/next/index.js","module":"../dist/esm/next/index.js","typings":"../dist/esm/next/index.d.ts","version":"6.0.0-prerelease.13","private":true}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-core",
-  "version": "6.0.0-prerelease.12",
+  "version": "6.0.0-prerelease.14",
   "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",
@@ -63,5 +63,5 @@
     "react": "^17 || ^18",
     "react-dom": "^17 || ^18"
   },
-  "gitHead": "137a5467319706c5022300bcba71f0aed899c57a"
+  "gitHead": "9a679a4df32c7246c085c895acb3c4ab1c28472f"
 }

package/src/components/Modal/Modal.tsx

@@ -114,12 +114,7 @@ class Modal extends React.Component<ModalProps, ModalState> {
   isEmpty = (value: string | null | undefined) => value === null || value === undefined || value === '';
 
   componentDidMount() {
-    const {
-      appendTo,
-      'aria-describedby': ariaDescribedby,
-      'aria-label': ariaLabel,
-      'aria-labelledby': ariaLabelledby
-    } = this.props;
+    const { appendTo } = this.props;
     const target: HTMLElement = this.getElement(appendTo);
     const container = document.createElement('div');
     this.setState({ container });
@@ -131,11 +126,6 @@ class Modal extends React.Component<ModalProps, ModalState> {
     } else {
       target.classList.remove(css(styles.backdropOpen));
     }
-
-    if (!ariaDescribedby && !ariaLabel && !ariaLabelledby) {
-      // eslint-disable-next-line no-console
-      console.error('Modal: Specify at least one of: aria-describedby, aria-label, aria-labelledby.');
-    }
   }
 
   componentDidUpdate() {

package/src/components/Modal/ModalContent.tsx

@@ -70,19 +70,14 @@ export const ModalContent: React.FunctionComponent<ModalContentProps> = ({
     return null;
   }
 
-  const ariaLabelledbyFormatted = (): string => {
-    const idRefList: string[] = [];
-    if (ariaLabel && boxId) {
-      idRefList.push(ariaLabel && boxId);
-    }
+  const getAriaLabelledBy = (): string | undefined => {
     if (ariaLabelledby) {
-      idRefList.push(ariaLabelledby);
+      return ariaLabelledby;
     }
-    if (idRefList.length === 0) {
+    if (ariaLabel) {
       return undefined;
-    } else {
-      return idRefList.join(' ');
     }
+    return boxId;
   };
 
   const modalBox = (
@@ -92,7 +87,7 @@ export const ModalContent: React.FunctionComponent<ModalContentProps> = ({
       position={position}
       positionOffset={positionOffset}
       aria-label={ariaLabel}
-      aria-labelledby={ariaLabelledbyFormatted()}
+      aria-labelledby={getAriaLabelledBy()}
       aria-describedby={ariaDescribedby}
       {...getOUIAProps(ModalContent.displayName, ouiaId, ouiaSafe)}
       style={

package/src/components/Modal/__tests__/Modal.test.tsx

@@ -83,20 +83,6 @@ describe('Modal', () => {
     expect(screen.queryByRole('button', { name: 'Close' })).toBeNull();
   });
 
-  test('modal generates console error when no accessible name is provided', () => {
-    const props = {
-      onClose: jest.fn(),
-      isOpen: true,
-      children: 'modal content'
-    };
-    const consoleErrorMock = jest.fn();
-    global.console = { error: consoleErrorMock } as any;
-
-    render(<Modal {...props} />);
-
-    expect(consoleErrorMock).toHaveBeenCalled();
-  });
-
   test('modal adds aria-hidden attribute to its siblings when open', () => {
     render(<ModalWithSiblings />, { container: document.body.appendChild(target) });
 

package/src/components/Modal/__tests__/__snapshots__/ModalContent.test.tsx.snap

@@ -9,6 +9,7 @@ exports[`Modal Content Test description 1`] = `
       class="pf-v6-l-bullseye"
     >
       <div
+        aria-labelledby="boxId"
         aria-modal="true"
         class="pf-v6-c-modal-box"
         data-ouia-component-type="PF6/ModalContent"
@@ -34,6 +35,7 @@ exports[`Modal Content Test isOpen 1`] = `
       class="pf-v6-l-bullseye"
     >
       <div
+        aria-labelledby="boxId"
         aria-modal="true"
         class="pf-v6-c-modal-box"
         data-ouia-component-type="PF6/ModalContent"
@@ -59,6 +61,7 @@ exports[`Modal Content Test only body 1`] = `
       class="pf-v6-l-bullseye"
     >
       <div
+        aria-labelledby="boxId"
         aria-modal="true"
         class="pf-v6-c-modal-box"
         data-ouia-component-type="PF6/ModalContent"
@@ -84,6 +87,7 @@ exports[`Modal Content Test with onclose 1`] = `
       class="pf-v6-l-bullseye"
     >
       <div
+        aria-labelledby="boxId"
         aria-modal="true"
         class="pf-v6-c-modal-box pf-m-lg"
         data-ouia-component-type="PF6/ModalContent"

package/src/components/TextInputGroup/examples/TextInputGroup.md

@@ -10,19 +10,27 @@ import TimesIcon from '@patternfly/react-icons/dist/esm/icons/times-icon';
 
 ## Examples
 
-### Basic
+### Basic text input group 
+
+A basic text input group updates its contents as users enter text.
 
 ```ts file="./TextInputGroupBasic.tsx"
 
 ```
 
-### Disabled
+### Disabled text input group
+
+To prevent users from making edits to a text input group, you can disable it using `isDisabled`.
 
 ```ts file="./TextInputGroupDisabled.tsx"
 
 ```
 
-### Utilities and icon
+### With icon and utilities
+
+To help users identify the purpose of an input group, you can add an icon. To do this, import your icon and pass it to `icon` within `<TextInputGroupMain>`.
+
+You can also add additional actions or utilities via `<TextInputGroupUtilities>`. The following example includes a clear button that allows users to remove their previous input. 
 
 ```ts file="./TextInputGroupUtilitiesAndIcon.tsx"
 
@@ -36,7 +44,9 @@ You can add a validation status to a `<TextInputGroup>` by passing the `validate
 
 ```
 
-### Filters
+### With filters
+
+When a text input group is used within a data view, like a table, you can nest filter labels within the group. To do this, pass a `<LabelGroup>` to `<TextInputGroupMain>`, with all of the labels that a user has selected. Users can interact with these labels as needed.
 
 ```ts file="./TextInputGroupFilters.tsx"