[Select], [TablePagination] Use more descriptive parameter names (#37064

)
mui · May 9, 2023 · 8acb5dd · 8acb5dd
1 parent e916b0f
commit 8acb5dd
Show file tree

Hide file tree

Showing 9 changed files with 19 additions and 18 deletions.
diff --git a/docs/data/base/components/select/UnstyledSelectControlled.js b/docs/data/base/components/select/UnstyledSelectControlled.js
@@ -9,7 +9,7 @@ export default function UnstyledSelectControlled() {
   const [value, setValue] = React.useState(10);
   return (
     <div>
-      <CustomSelect value={value} onChange={(e, newValue) => setValue(newValue)}>
+      <CustomSelect value={value} onChange={(_, newValue) => setValue(newValue)}>
         <StyledOption value={10}>Ten</StyledOption>
         <StyledOption value={20}>Twenty</StyledOption>
         <StyledOption value={30}>Thirty</StyledOption>

diff --git a/docs/data/base/components/select/UnstyledSelectControlled.tsx b/docs/data/base/components/select/UnstyledSelectControlled.tsx
@@ -8,7 +8,7 @@ export default function UnstyledSelectControlled() {
   const [value, setValue] = React.useState<number | null>(10);
   return (
     <div>
-      <CustomSelect value={value} onChange={(e, newValue) => setValue(newValue)}>
+      <CustomSelect value={value} onChange={(_, newValue) => setValue(newValue)}>
         <StyledOption value={10}>Ten</StyledOption>
         <StyledOption value={20}>Twenty</StyledOption>
         <StyledOption value={30}>Thirty</StyledOption>

diff --git a/docs/data/base/components/select/UnstyledSelectControlled.tsx.preview b/docs/data/base/components/select/UnstyledSelectControlled.tsx.preview
@@ -1,4 +1,4 @@
-<CustomSelect value={value} onChange={(e, newValue) => setValue(newValue)}>
+<CustomSelect value={value} onChange={(_, newValue) => setValue(newValue)}>
   <StyledOption value={10}>Ten</StyledOption>
   <StyledOption value={20}>Twenty</StyledOption>
   <StyledOption value={30}>Thirty</StyledOption>

diff --git a/packages/mui-base/src/Select/Select.types.ts b/packages/mui-base/src/Select/Select.types.ts
@@ -64,7 +64,7 @@ export interface SelectOwnProps<OptionValue extends {}, Multiple extends boolean
    * Callback fired when an option is selected.
    */
   onChange?: (
-    e: React.MouseEvent | React.KeyboardEvent | React.FocusEvent | null,
+    event: React.MouseEvent | React.KeyboardEvent | React.FocusEvent | null,
     value: SelectValue<OptionValue, Multiple>,
   ) => void;
   /**

diff --git a/packages/mui-base/src/TablePagination/TablePagination.tsx b/packages/mui-base/src/TablePagination/TablePagination.tsx
@@ -117,8 +117,8 @@ const TablePagination = React.forwardRef(function TablePagination<
     additionalProps: {
       value: rowsPerPage,
       id: selectId,
-      onChange: (e: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) =>
-        onRowsPerPageChange && onRowsPerPageChange(e),
+      onChange: (event: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) =>
+        onRowsPerPageChange && onRowsPerPageChange(event),
       'aria-label': rowsPerPage.toString(),
       'aria-labelledby': [labelId, selectId].filter(Boolean).join(' ') || undefined,
     },

diff --git a/packages/mui-base/src/TablePagination/TablePagination.types.ts b/packages/mui-base/src/TablePagination/TablePagination.types.ts
@@ -222,7 +222,7 @@ export type TablePaginationSelectSlotProps = {
   children?: React.ReactNode;
   className?: string;
   id?: string;
-  onChange: (e: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) => void;
+  onChange: (event: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) => void;
   ownerState: TablePaginationOwnerState;
   value: React.SelectHTMLAttributes<HTMLSelectElement>['value'];
 };

diff --git a/packages/mui-base/src/useSelect/useSelect.ts b/packages/mui-base/src/useSelect/useSelect.ts
@@ -198,10 +198,10 @@ function useSelect<OptionValue, Multiple extends boolean = false>(
   );
 
   const handleStateChange = React.useCallback(
-    (e: React.SyntheticEvent | null, field: string, fieldValue: any) => {
+    (event: React.SyntheticEvent | null, field: string, fieldValue: any) => {
       if (field === 'open') {
         onOpenChange?.(fieldValue as boolean);
-        if (fieldValue === false && e?.type !== 'blur') {
+        if (fieldValue === false && event?.type !== 'blur') {
           buttonRef.current?.focus();
         }
       }

diff --git a/packages/mui-base/src/utils/useSlotProps.test.tsx b/packages/mui-base/src/utils/useSlotProps.test.tsx
@@ -162,14 +162,15 @@ describe('useSlotProps', () => {
     const externalClickHandler = spy();
     const externalForwardedClickHandler = spy();
 
-    const createInternalClickHandler = (otherHandlers: EventHandlers) => (e: React.MouseEvent) => {
-      expect(otherHandlers).to.deep.equal({
-        onClick: externalClickHandler,
-      });
-
-      otherHandlers.onClick(e);
-      internalClickHandler(e);
-    };
+    const createInternalClickHandler =
+      (otherHandlers: EventHandlers) => (event: React.MouseEvent) => {
+        expect(otherHandlers).to.deep.equal({
+          onClick: externalClickHandler,
+        });
+
+        otherHandlers.onClick(event);
+        internalClickHandler(event);
+      };
 
     // usually provided by the hook:
     const getSlotProps = (otherHandlers: EventHandlers) => ({

diff --git a/packages/mui-joy/src/Select/SelectProps.ts b/packages/mui-joy/src/Select/SelectProps.ts
@@ -178,7 +178,7 @@ export type SelectOwnProps<TValue extends {}> = SelectStaticProps &
      * Callback fired when an option is selected.
      */
     onChange?: (
-      e: React.MouseEvent | React.KeyboardEvent | React.FocusEvent | null,
+      event: React.MouseEvent | React.KeyboardEvent | React.FocusEvent | null,
       value: TValue | null,
     ) => void;
     /**