@patternfly/react-core 5.0.0-alpha.94 → 5.0.0-alpha.95

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-core",
-  "version": "5.0.0-alpha.94",
+  "version": "5.0.0-alpha.95",
   "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": "4f593bd8942e59802d2d8e04b776a112c51d2304"
+  "gitHead": "90ba49c9bb04467b5482738c8102546ad70c662f"
 }

package/src/components/Switch/Switch.tsx

@@ -28,8 +28,8 @@ export interface SwitchProps
   hasCheckIcon?: boolean;
   /** Flag to show if the switch is disabled. */
   isDisabled?: boolean;
-  /** A callback for when the switch selection changes. (isChecked, event) => {} */
-  onChange?: (checked: boolean, event: React.FormEvent<HTMLInputElement>) => void;
+  /** A callback for when the switch selection changes. (event, isChecked) => {} */
+  onChange?: (event: React.FormEvent<HTMLInputElement>, checked: boolean) => void;
   /** Adds accessible text to the switch, and should describe the isChecked="true" state. When label is defined, aria-label should be set to the text string that is visible when isChecked is true. */
   'aria-label'?: string;
   /** Flag to reverse the layout of toggle and label (toggle on right). */
@@ -94,7 +94,7 @@ export class Switch extends React.Component<SwitchProps & OUIAProps, { ouiaState
           id={this.id}
           className={css(styles.switchInput)}
           type="checkbox"
-          onChange={event => onChange(event.target.checked, event)}
+          onChange={event => onChange(event, event.target.checked)}
           {...(defaultChecked !== undefined ? { defaultChecked } : { checked: isChecked })}
           disabled={isDisabled}
           aria-labelledby={!isAriaLabelledBy ? null : `${this.id}-${isChecked !== true ? 'off' : 'on'}`}

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

@@ -81,7 +81,7 @@ describe('Switch', () => {
     render(<Switch id="onChange-switch" {...props} aria-label="Switch label" />);
 
     await user.click(screen.getByLabelText('Switch label'));
-    expect(props.onChange).toHaveBeenCalledWith(true, expect.any(Object));
+    expect(props.onChange).toHaveBeenCalledWith(expect.any(Object), true);
   });
 
   test('should throw console error when no aria-label or label is given', () => {

package/src/components/Switch/examples/SwitchBasic.tsx

@@ -4,7 +4,7 @@ import { Switch } from '@patternfly/react-core';
 export const SwitchBasic: React.FunctionComponent = () => {
   const [isChecked, setIsChecked] = React.useState<boolean>(true);
 
-  const handleChange = (checked: boolean, _event: React.FormEvent<HTMLInputElement>) => {
+  const handleChange = (_event: React.FormEvent<HTMLInputElement>, checked: boolean) => {
     setIsChecked(checked);
   };
 

package/src/components/Switch/examples/SwitchCheckedWithLabel.tsx

@@ -4,7 +4,7 @@ import { Switch } from '@patternfly/react-core';
 export const SwitchCheckedWithLabel: React.FunctionComponent = () => {
   const [isChecked, setIsChecked] = React.useState<boolean>(true);
 
-  const handleChange = (checked: boolean, _event: React.FormEvent<HTMLInputElement>) => {
+  const handleChange = (_event: React.FormEvent<HTMLInputElement>, checked: boolean) => {
     setIsChecked(checked);
   };
 

package/src/components/Switch/examples/SwitchReversed.tsx

@@ -4,7 +4,7 @@ import { Switch } from '@patternfly/react-core';
 export const SwitchReversed: React.FunctionComponent = () => {
   const [isChecked, setIsChecked] = React.useState<boolean>(true);
 
-  const handleChange = (checked: boolean, _event: React.FormEvent<HTMLInputElement>) => {
+  const handleChange = (_event: React.FormEvent<HTMLInputElement>, checked: boolean) => {
     setIsChecked(checked);
   };
 

package/src/components/Switch/examples/SwitchWithoutLabel.tsx

@@ -4,7 +4,7 @@ import { Switch } from '@patternfly/react-core';
 export const SwitchWithoutLabel: React.FunctionComponent = () => {
   const [isChecked, setIsChecked] = React.useState<boolean>(true);
 
-  const handleChange = (checked: boolean, _event: React.FormEvent<HTMLInputElement>) => {
+  const handleChange = (_event: React.FormEvent<HTMLInputElement>, checked: boolean) => {
     setIsChecked(checked);
   };
 

package/src/demos/JumpLinks.md

@@ -72,7 +72,7 @@ ScrollspyH2 = () => {
           label="Vertical"
           labelOff="Horizontal"
           isChecked={isVertical}
-          onChange={check => setIsVertical(check)}
+          onChange={(_event, check) => setIsVertical(check)}
         />
       </PageSection>
       <PageSection padding={{ default: 'noPadding' }}>

package/src/demos/examples/BackToTop/BackToTopNameDemo.tsx

@@ -17,7 +17,7 @@ import DashboardWrapper from '@patternfly/react-core/src/demos/examples/Dashboar
 export const Name = () => {
   const [isAlwaysVisible, setIsAlwaysVisible] = React.useState(false);
 
-  const handleChange = isChecked => {
+  const handleChange = (_event, isChecked) => {
     setIsAlwaysVisible(isChecked);
   };