@patternfly/react-core 4.276.6 → 5.0.0-alpha.10

package/src/components/Pagination/examples/Pagination.md

@@ -2,7 +2,7 @@
 id: Pagination
 section: components
 cssPrefix: null
-propComponents: ['Pagination', PaginationTitles, PerPageOptions, ToggleTemplateProps]
+propComponents: ['Pagination', PaginationTitles, PerPageOptions, PaginationToggleTemplateProps]
 ouia: true
 ---
 

package/src/components/Pagination/examples/PaginationBottom.tsx

@@ -20,7 +20,6 @@ export const PaginationBottom: React.FunctionComponent = () => {
 
   return (
     <Pagination
-      perPageComponent="button"
       itemCount={333}
       widgetId="bottom-example"
       perPage={perPage}

package/src/components/Pagination/examples/PaginationCompact.tsx

@@ -20,7 +20,6 @@ export const PaginationCompact: React.FunctionComponent = () => {
 
   return (
     <Pagination
-      perPageComponent="button"
       itemCount={523}
       perPage={perPage}
       page={page}

package/src/components/Pagination/examples/PaginationDisabled.tsx

@@ -20,7 +20,6 @@ export const PaginationDisabled: React.FunctionComponent = () => {
 
   return (
     <Pagination
-      perPageComponent="button"
       itemCount={523}
       perPage={perPage}
       page={page}

package/src/components/Pagination/examples/PaginationIndeterminate.tsx

@@ -20,7 +20,6 @@ export const PaginationIndeterminate: React.FunctionComponent = () => {
 
   return (
     <Pagination
-      perPageComponent="button"
       toggleTemplate={({ firstIndex, lastIndex }) => (
         <React.Fragment>
           <b>

package/src/components/Pagination/examples/PaginationInset.tsx

@@ -20,7 +20,6 @@ export const PaginationInset: React.FunctionComponent = () => {
 
   return (
     <Pagination
-      perPageComponent="button"
       itemCount={523}
       perPage={perPage}
       page={page}

package/src/components/Pagination/examples/PaginationNoItems.tsx

@@ -20,7 +20,6 @@ export const PaginationNoItems: React.FunctionComponent = () => {
 
   return (
     <Pagination
-      perPageComponent="button"
       itemCount={0}
       perPage={perPage}
       page={page}

package/src/components/Pagination/examples/PaginationOnePage.tsx

@@ -20,7 +20,6 @@ export const PaginationOnePage: React.FunctionComponent = () => {
 
   return (
     <Pagination
-      perPageComponent="button"
       itemCount={15}
       perPage={perPage}
       page={page}

package/src/components/Pagination/examples/PaginationSticky.tsx

@@ -39,7 +39,6 @@ export const PaginationSticky: React.FunctionComponent = () => {
   return isTopSticky ? (
     <React.Fragment>
       <Pagination
-        perPageComponent="button"
         itemCount={itemCount}
         perPage={perPage}
         page={page}
@@ -56,7 +55,6 @@ export const PaginationSticky: React.FunctionComponent = () => {
     <React.Fragment>
       <Gallery hasGutter>{buildCards()}</Gallery>
       <Pagination
-        perPageComponent="button"
         itemCount={itemCount}
         perPage={perPage}
         page={page}

package/src/components/Pagination/examples/PaginationTop.tsx

@@ -20,7 +20,6 @@ export const PaginationTop: React.FunctionComponent = () => {
 
   return (
     <Pagination
-      perPageComponent="button"
       itemCount={523}
       perPage={perPage}
       page={page}

package/src/components/Popover/Popover.tsx

@@ -16,7 +16,6 @@ import { ReactElement } from 'react';
 import { FocusTrap } from '../../helpers';
 import { Popper, getOpacityTransition } from '../../helpers/Popper/Popper';
 import { getUniqueId } from '../../helpers/util';
-import { Instance as TippyInstance, Props as TippyProps } from '../../helpers/Popper/DeprecatedTippyTypes';
 
 export enum PopoverPosition {
   auto = 'auto',
@@ -60,10 +59,6 @@ export interface PopoverProps {
    * bodyContent={hide => <Button onClick={() => hide()}>Close</Button>}
    */
   bodyContent: React.ReactNode | ((hide: () => void) => React.ReactNode);
-  /** @deprecated - no longer used. if you want to constrain the popper to a specific element
-   * use the appendTo prop instead.
-   */
-  boundary?: 'scrollParent' | 'window' | 'viewport' | HTMLElement;
   /**
    * The reference element to which the popover is relatively placed to. If you cannot wrap
    * the reference with the Popover, you can use the reference prop instead.
@@ -151,29 +146,24 @@ export interface PopoverProps {
   minWidth?: string;
   /**
    * Lifecycle function invoked when the popover has fully transitioned out.
-   * Note: The tip argument is no longer passed and has been deprecated.
    */
-  onHidden?: (tip?: TippyInstance) => void;
+  onHidden?: () => void;
   /**
    * Lifecycle function invoked when the popover begins to transition out.
-   * Note: The tip argument is no longer passed and has been deprecated.
    */
-  onHide?: (tip?: TippyInstance) => void;
+  onHide?: () => void;
   /**
    * Lifecycle function invoked when the popover has been mounted to the DOM.
-   * Note: The tip argument is no longer passed and has been deprecated.
    */
-  onMount?: (tip?: TippyInstance) => void;
+  onMount?: () => void;
   /**
    * Lifecycle function invoked when the popover begins to transition in.
-   * Note: The tip argument is no longer passed and has been deprecated.
    */
-  onShow?: (tip?: TippyInstance) => void;
+  onShow?: () => void;
   /**
    * Lifecycle function invoked when the popover has fully transitioned in.
-   * Note: The tip argument is no longer passed and has been deprecated.
    */
-  onShown?: (tip?: TippyInstance) => void;
+  onShown?: () => void;
   /**
    * Popover position. Note: With the enableFlip property set to true, it will change the
    * position if there is not enough space for the starting position. The behavior of where it
@@ -200,14 +190,11 @@ export interface PopoverProps {
    * Usage: <Popover reference={() => document.getElementById('reference-element')} />
    */
   reference?: HTMLElement | (() => HTMLElement) | React.RefObject<any>;
-  /** @beta Opt-in for updated popper that does not use findDOMNode. */
-  removeFindDomNode?: boolean;
   /**
    * Callback function that is only invoked when isVisible is also controlled. Called when the
    * popover close button is clicked, the enter key was used on it, or the escape key is used.
-   * Note: The tip argument is no longer passed and has been deprecated.
    */
-  shouldClose?: (tip?: TippyInstance, hideFunction?: () => void, event?: MouseEvent | KeyboardEvent) => void;
+  shouldClose?: (hideFunction?: () => void, event?: MouseEvent | KeyboardEvent) => void;
   /**
    * Callback function that is only invoked when isVisible is also controlled. Called when the
    * enter key is used on the focused trigger.
@@ -215,8 +202,6 @@ export interface PopoverProps {
   shouldOpen?: (showFunction?: () => void, event?: MouseEvent | KeyboardEvent) => void;
   /** Flag indicating whether the close button should be shown. */
   showClose?: boolean;
-  /** @deprecated - no longer used. */
-  tippyProps?: Partial<TippyProps>;
   /** Whether to trap focus in the popover. */
   withFocusTrap?: boolean;
   /** The z-index of the popover. */
@@ -277,21 +262,11 @@ export const Popover: React.FunctionComponent<PopoverProps> = ({
   animationDuration = 300,
   id,
   withFocusTrap: propWithFocusTrap,
-  boundary,
-  tippyProps,
   reference,
   hasNoPadding = false,
   hasAutoWidth = false,
-  removeFindDomNode = false,
   ...rest
 }: PopoverProps) => {
-  if (process.env.NODE_ENV !== 'production') {
-    boundary !== undefined &&
-      console.warn(
-        'The Popover boundary prop has been deprecated. If you want to constrain the popper to a specific element use the appendTo prop instead.'
-      );
-    tippyProps !== undefined && console.warn('The Popover tippyProps prop has been deprecated and is no longer used.');
-  }
   // could make this a prop in the future (true | false | 'toggle')
   // const hideOnClick = true;
   const uniqueId = id || getUniqueId();
@@ -363,7 +338,7 @@ export const Popover: React.FunctionComponent<PopoverProps> = ({
   const onDocumentKeyDown = (event: KeyboardEvent) => {
     if (event.key === KeyTypes.Escape && visible) {
       if (triggerManually) {
-        shouldClose(null, hide, event);
+        shouldClose(hide, event);
       } else {
         hide();
       }
@@ -378,7 +353,7 @@ export const Popover: React.FunctionComponent<PopoverProps> = ({
         return;
       }
       if (triggerManually) {
-        shouldClose(null, hide, event);
+        shouldClose(hide, event);
       } else {
         hide();
       }
@@ -387,7 +362,7 @@ export const Popover: React.FunctionComponent<PopoverProps> = ({
   const onTriggerClick = (event: MouseEvent) => {
     if (triggerManually) {
       if (visible) {
-        shouldClose(null, hide, event);
+        shouldClose(hide, event);
       } else {
         shouldOpen(show, event);
       }
@@ -407,7 +382,7 @@ export const Popover: React.FunctionComponent<PopoverProps> = ({
   const closePopover = (event: any) => {
     event.stopPropagation();
     if (triggerManually) {
-      shouldClose(null, hide, event);
+      shouldClose(hide, event);
     } else {
       hide();
     }
@@ -497,7 +472,6 @@ export const Popover: React.FunctionComponent<PopoverProps> = ({
         enableFlip={enableFlip}
         zIndex={zIndex}
         flipBehavior={flipBehavior}
-        removeFindDomNode={removeFindDomNode}
       />
     </PopoverContext.Provider>
   );

package/src/components/Popover/__tests__/__snapshots__/Popover.test.tsx.snap

@@ -2,34 +2,50 @@
 
 exports[`popover can close from content (uncontrolled) 1`] = `
 <DocumentFragment>
-  <button
-    id="uncontrolled-toggle"
+  <div
+    style="display: contents;"
   >
-    Toggle Popover
-  </button>
+    <button
+      id="uncontrolled-toggle"
+    >
+      Toggle Popover
+    </button>
+  </div>
 </DocumentFragment>
 `;
 
 exports[`popover can have a custom minimum width 1`] = `
 <DocumentFragment>
-  <div>
-    Toggle Popover
+  <div
+    style="display: contents;"
+  >
+    <div>
+      Toggle Popover
+    </div>
   </div>
 </DocumentFragment>
 `;
 
 exports[`popover can specify position as object value 1`] = `
 <DocumentFragment>
-  <div>
-    Toggle Popover
+  <div
+    style="display: contents;"
+  >
+    <div>
+      Toggle Popover
+    </div>
   </div>
 </DocumentFragment>
 `;
 
 exports[`popover renders close-button, header and body 1`] = `
 <DocumentFragment>
-  <div>
-    Toggle Popover
+  <div
+    style="display: contents;"
+  >
+    <div>
+      Toggle Popover
+    </div>
   </div>
 </DocumentFragment>
 `;

package/src/components/SearchInput/SearchInput.tsx

@@ -117,8 +117,6 @@ export interface SearchInputProps extends Omit<React.HTMLProps<HTMLDivElement>,
   placeholder?: string;
   /** Accessible label for the button to navigate to previous result. */
   previousNavigationButtonAriaLabel?: string;
-  /** @beta Opt-in for updated popper that does not use findDOMNode. */
-  removeFindDomNode?: boolean;
   /** z-index of the advanced search form when appendTo is not inline. */
   zIndex?: number;
   /** Label for the button which resets the advanced search form and clears the search input. */
@@ -163,7 +161,6 @@ const SearchInputBase: React.FunctionComponent<SearchInputProps> = ({
   submitSearchButtonLabel = 'Search',
   isDisabled = false,
   appendTo,
-  removeFindDomNode = false,
   zIndex = 9999,
   type = 'text',
   name,
@@ -394,7 +391,7 @@ const SearchInputBase: React.FunctionComponent<SearchInputProps> = ({
           variant={ButtonVariant.control}
           aria-label={submitSearchButtonLabel}
           onClick={onSearchHandler}
-          isDisabled={isDisabled || !searchValue}
+          isDisabled={isDisabled}
         >
           <ArrowRightIcon />
         </Button>
@@ -445,7 +442,6 @@ const SearchInputBase: React.FunctionComponent<SearchInputProps> = ({
             isVisible={isSearchMenuOpen}
             enableFlip={true}
             appendTo={() => appendTo || searchInputRef.current}
-            removeFindDomNode={removeFindDomNode}
             zIndex={zIndex}
           />
         </div>

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

@@ -49,7 +49,6 @@ describe('SearchInput', () => {
           onChange={props.onChange}
           onSearch={props.onSearch}
           onClear={props.onClear}
-          removeFindDomNode
         />
       </React.StrictMode>
     );