@patternfly/react-core 5.0.0-alpha.80 → 5.0.0-alpha.81

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-core",
-  "version": "5.0.0-alpha.80",
+  "version": "5.0.0-alpha.81",
   "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",
@@ -71,5 +71,5 @@
     "react": "^17 || ^18",
     "react-dom": "^17 || ^18"
   },
-  "gitHead": "b550566ea35ea90c25974d5d3d2f987badb5b397"
+  "gitHead": "ec98f5c600339cc7a20dc1142fe33092e743bfe4"
 }

package/src/components/ExpandableSection/ExpandableSection.tsx

@@ -38,7 +38,7 @@ export interface ExpandableSectionProps extends React.HTMLProps<HTMLDivElement>
   /** Callback function to toggle the expandable section. Detached expandable sections should
    * use the onToggle property of the expandable section toggle sub-component.
    */
-  onToggle?: (isExpanded: boolean) => void;
+  onToggle?: (event: React.MouseEvent, isExpanded: boolean) => void;
   /** React node that appears in the attached toggle in place of the toggleText property. */
   toggleContent?: React.ReactNode;
   /** Text that appears in the attached toggle. */
@@ -96,7 +96,7 @@ export class ExpandableSection extends React.Component<ExpandableSectionProps, E
     toggleTextExpanded: '',
     toggleTextCollapsed: '',
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    onToggle: (isExpanded): void => undefined,
+    onToggle: (event, isExpanded): void => undefined,
     isActive: false,
     isDetached: false,
     displaySize: 'default',
@@ -202,8 +202,8 @@ export class ExpandableSection extends React.Component<ExpandableSectionProps, E
     // uncontrolled
     if (isExpanded === undefined) {
       propOrStateIsExpanded = this.state.isExpanded;
-      onToggle = isOpen => {
-        this.setState({ isExpanded: isOpen }, () => onToggleProp(this.state.isExpanded));
+      onToggle = (event, isOpen) => {
+        this.setState({ isExpanded: isOpen }, () => onToggleProp(event, this.state.isExpanded));
       };
     }
 
@@ -219,7 +219,7 @@ export class ExpandableSection extends React.Component<ExpandableSectionProps, E
         className={css(styles.expandableSectionToggle)}
         type="button"
         aria-expanded={propOrStateIsExpanded}
-        onClick={() => onToggle(!propOrStateIsExpanded)}
+        onClick={(event) => onToggle(event, !propOrStateIsExpanded)}
       >
         {variant !== ExpandableSectionVariant.truncate && (
           <span className={css(styles.expandableSectionToggleIcon)}>

package/src/components/ExpandableSection/examples/ExpandableSectionBasic.tsx

@@ -4,7 +4,7 @@ import { ExpandableSection } from '@patternfly/react-core';
 export const ExpandableSectionBasic: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
 
-  const onToggle = (isExpanded: boolean) => {
+  const onToggle = (_event: React.MouseEvent, isExpanded: boolean) => {
     setIsExpanded(isExpanded);
   };
 

package/src/components/ExpandableSection/examples/ExpandableSectionCustomToggle.tsx

@@ -5,7 +5,7 @@ import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle
 export const ExpandableSectionCustomToggle: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
 
-  const onToggle = (isExpanded: boolean) => {
+  const onToggle = (_event: React.MouseEvent, isExpanded: boolean) => {
     setIsExpanded(isExpanded);
   };
 

package/src/components/ExpandableSection/examples/ExpandableSectionDisclosure.tsx

@@ -4,7 +4,7 @@ import { ExpandableSection } from '@patternfly/react-core';
 export const ExpandableSectionDisclosure: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
 
-  const onToggle = (isExpanded: boolean) => {
+  const onToggle = (_event: React.MouseEvent, isExpanded: boolean) => {
     setIsExpanded(isExpanded);
   };
 

package/src/components/ExpandableSection/examples/ExpandableSectionIndented.tsx

@@ -4,7 +4,7 @@ import { ExpandableSection } from '@patternfly/react-core';
 export const ExpandableSectionIndented: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
 
-  const onToggle = (isExpanded: boolean) => {
+  const onToggle = (_event: React.MouseEvent, isExpanded: boolean) => {
     setIsExpanded(isExpanded);
   };
 

package/src/components/ExpandableSection/examples/ExpandableSectionTruncateExpansion.tsx

@@ -4,7 +4,7 @@ import { ExpandableSection, ExpandableSectionVariant } from '@patternfly/react-c
 export const ExpandableSectionTruncateExpansion: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
 
-  const onToggle = (isExpanded: boolean) => {
+  const onToggle = (_event: React.MouseEvent, isExpanded: boolean) => {
     setIsExpanded(isExpanded);
   };
 

package/src/components/FileUpload/FileUpload.tsx

@@ -68,13 +68,13 @@ export interface FileUploadProps
   /** Clear button was clicked. */
   onClearClick?: React.MouseEventHandler<HTMLButtonElement>;
   /** On data changed - if type='text' or type='dataURL' and file was loaded it will call this method */
-  onDataChange?: (data: string) => void;
+  onDataChange?: (event: DropEvent, data: string) => void;
   /** A callback for when the FileReader API fails. */
-  onReadFailed?: (error: DOMException, fileHandle: File) => void;
+  onReadFailed?: (event: DropEvent, error: DOMException, fileHandle: File) => void;
   /** A callback for when a selected file finishes loading. */
-  onReadFinished?: (fileHandle: File) => void;
+  onReadFinished?: (event: DropEvent, fileHandle: File) => void;
   /** A callback for when a selected file starts loading. */
-  onReadStarted?: (fileHandle: File) => void;
+  onReadStarted?: (event: DropEvent, fileHandle: File) => void;
   /** Text area text changed. */
   onTextChange?: (event: React.ChangeEvent<HTMLTextAreaElement>, text: string) => void;
 }
@@ -102,16 +102,16 @@ export const FileUpload: React.FunctionComponent<FileUploadProps> = ({
       onFileInputChange?.(event, fileHandle);
 
       if (type === fileReaderType.text || type === fileReaderType.dataURL) {
-        onReadStarted(fileHandle);
+        onReadStarted(event, fileHandle);
         readFile(fileHandle, type as fileReaderType)
           .then(data => {
-            onReadFinished(fileHandle);
-            onDataChange?.(data as string);
+            onReadFinished(event, fileHandle);
+            onDataChange?.(event, data as string);
           })
           .catch((error: DOMException) => {
-            onReadFailed(error, fileHandle);
-            onReadFinished(fileHandle);
-            onDataChange?.('');
+            onReadFailed(event, error, fileHandle);
+            onReadFinished(event, fileHandle);
+            onDataChange?.(event, '');
           });
       }
     }

package/src/components/FileUpload/examples/FileUploadSimpleText.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { FileUpload } from '@patternfly/react-core';
+import { DropEvent } from 'react-dropzone';
 
 export const SimpleTextFileUpload: React.FunctionComponent = () => {
   const [value, setValue] = React.useState('');
@@ -14,7 +15,7 @@ export const SimpleTextFileUpload: React.FunctionComponent = () => {
     setValue(value);
   };
 
-  const handleDataChange = (value: string) => {
+  const handleDataChange = (_event: DropEvent, value: string) => {
     setValue(value);
   };
 
@@ -23,11 +24,11 @@ export const SimpleTextFileUpload: React.FunctionComponent = () => {
     setValue('');
   };
 
-  const handleFileReadStarted = (_fileHandle: File) => {
+  const handleFileReadStarted = (_event: DropEvent, _fileHandle: File) => {
     setIsLoading(true);
   };
 
-  const handleFileReadFinished = (_fileHandle: File) => {
+  const handleFileReadFinished = (_event: DropEvent, _fileHandle: File) => {
     setIsLoading(false);
   };
 

package/src/components/FileUpload/examples/FileUploadTextWithEdits.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { FileUpload } from '@patternfly/react-core';
+import { DropEvent } from 'react-dropzone';
 
 export const TextFileWithEditsAllowed: React.FunctionComponent = () => {
   const [value, setValue] = React.useState('');
@@ -14,7 +15,7 @@ export const TextFileWithEditsAllowed: React.FunctionComponent = () => {
     setValue(value);
   };
 
-  const handleDataChange = (value: string) => {
+  const handleDataChange = (_event: DropEvent, value: string) => {
     setValue(value);
   };
 
@@ -23,11 +24,11 @@ export const TextFileWithEditsAllowed: React.FunctionComponent = () => {
     setValue('');
   };
 
-  const handleFileReadStarted = (_fileHandle: File) => {
+  const handleFileReadStarted = (_event: DropEvent, _fileHandle: File) => {
     setIsLoading(true);
   };
 
-  const handleFileReadFinished = (_fileHandle: File) => {
+  const handleFileReadFinished = (_event: DropEvent, _fileHandle: File) => {
     setIsLoading(false);
   };
 

package/src/components/FileUpload/examples/FileUploadTextWithRestrictions.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { FileUpload, Form, FormGroup, FormHelperText, HelperText, HelperTextItem } from '@patternfly/react-core';
+import { DropEvent } from 'react-dropzone';
 
 export const TextFileUploadWithRestrictions: React.FunctionComponent = () => {
   const [value, setValue] = React.useState('');
@@ -15,7 +16,7 @@ export const TextFileUploadWithRestrictions: React.FunctionComponent = () => {
     setValue(value);
   };
 
-  const handleDataChange = (value: string) => {
+  const handleDataChange = (_event: DropEvent, value: string) => {
     setValue(value);
   };
 
@@ -29,11 +30,11 @@ export const TextFileUploadWithRestrictions: React.FunctionComponent = () => {
     setIsRejected(true);
   };
 
-  const handleFileReadStarted = (_fileHandle: File) => {
+  const handleFileReadStarted = (_event: DropEvent, _fileHandle: File) => {
     setIsLoading(true);
   };
 
-  const handleFileReadFinished = (_fileHandle: File) => {
+  const handleFileReadFinished = (_event: DropEvent, _fileHandle: File) => {
     setIsLoading(false);
   };