[base] Improve some types (#33270)

mui · Jun 23, 2022 · e93f876 · e93f876
1 parent a1ce9c2
commit e93f876
Show file tree

Hide file tree

Showing 7 changed files with 14 additions and 10 deletions.
diff --git a/packages/mui-base/src/FormControlUnstyled/FormControlUnstyled.spec.tsx b/packages/mui-base/src/FormControlUnstyled/FormControlUnstyled.spec.tsx
@@ -36,8 +36,12 @@ const FormControlUnstyledTest = () => (
 );
 
 function Root(props: FormControlUnstyledRootSlotProps) {
-  const { ownerState, ...other } = props;
-  return <div data-filled={ownerState.filled} {...other} />;
+  const { ownerState, children, ...other } = props;
+  return (
+    <div data-filled={ownerState.filled} {...other}>
+      {children as React.ReactNode}
+    </div>
+  );
 }
 
 const StyledFormControl = <FormControlUnstyled components={{ Root }} />;
diff --git a/packages/mui-base/src/InputUnstyled/useInput.ts b/packages/mui-base/src/InputUnstyled/useInput.ts
@@ -61,7 +61,7 @@ export default function useInput(parameters: UseInputParameters) {
 
   const { current: isControlled } = React.useRef(value != null);
 
-  const handleInputRefWarning = React.useCallback((instance) => {
+  const handleInputRefWarning = React.useCallback((instance: HTMLElement) => {
     if (process.env.NODE_ENV !== 'production') {
       if (instance && instance.nodeName !== 'INPUT' && !instance.focus) {
         console.error(

diff --git a/packages/mui-base/src/MenuUnstyled/useMenu.ts b/packages/mui-base/src/MenuUnstyled/useMenu.ts
@@ -51,15 +51,15 @@ export default function useMenu(parameters: UseMenuParameters = {}) {
   const listboxRef = React.useRef<HTMLElement | null>(null);
   const handleRef = useForkRef(listboxRef, listboxRefProp);
 
-  const registerItem = React.useCallback((id, metadata) => {
+  const registerItem = React.useCallback((id: string, metadata: MenuItemMetadata) => {
     setMenuItems((previousState) => {
       const newState = { ...previousState };
       newState[id] = metadata;
       return newState;
     });
   }, []);
 
-  const unregisterItem = React.useCallback((id) => {
+  const unregisterItem = React.useCallback((id: string) => {
     setMenuItems((previousState) => {
       const newState = { ...previousState };
       delete newState[id];

diff --git a/packages/mui-base/src/MultiSelectUnstyled/MultiSelectUnstyled.types.ts b/packages/mui-base/src/MultiSelectUnstyled/MultiSelectUnstyled.types.ts
@@ -77,7 +77,7 @@ export type MultiSelectUnstyledListboxSlotProps<TValue> = Simplify<
 
 export type MultiSelectUnstyledPopperSlotProps<TValue> = {
   anchorEl: PopperUnstyledProps['anchorEl'];
-  children?: React.ReactNode;
+  children?: PopperUnstyledProps['children'];
   className: string | undefined;
   disablePortal: PopperUnstyledProps['disablePortal'];
   open: boolean;

diff --git a/packages/mui-base/src/SelectUnstyled/SelectUnstyled.types.ts b/packages/mui-base/src/SelectUnstyled/SelectUnstyled.types.ts
@@ -106,7 +106,7 @@ export type SelectUnstyledListboxSlotProps<TValue> = Simplify<
 
 export type SelectUnstyledPopperSlotProps<TValue> = {
   anchorEl: PopperUnstyledProps['anchorEl'];
-  children?: React.ReactNode;
+  children?: PopperUnstyledProps['children'];
   className: string | undefined;
   disablePortal: PopperUnstyledProps['disablePortal'];
   open: boolean;

diff --git a/packages/mui-base/src/TabsUnstyled/TabsUnstyled.types.ts b/packages/mui-base/src/TabsUnstyled/TabsUnstyled.types.ts
@@ -50,7 +50,7 @@ export interface TabsUnstyledOwnProps {
   /**
    * Callback invoked when new value is being set.
    */
-  onChange?: (event: React.SyntheticEvent, value: number | string) => void;
+  onChange?: (event: React.SyntheticEvent, value: number | string | boolean) => void;
   /**
    * If `true` the selected tab changes on focus. Otherwise it only
    * changes on activation.

diff --git a/packages/mui-base/src/TabsUnstyled/useTabs.ts b/packages/mui-base/src/TabsUnstyled/useTabs.ts
@@ -24,7 +24,7 @@ export interface UseTabsParameters {
   /**
    * Callback invoked when new value is being set.
    */
-  onChange?: (event: React.SyntheticEvent, value: number | string) => void;
+  onChange?: (event: React.SyntheticEvent, value: number | string | boolean) => void;
   /**
    * If `true` the selected tab changes on focus. Otherwise it only
    * changes on activation.
@@ -52,7 +52,7 @@ const useTabs = (parameters: UseTabsParameters) => {
   const idPrefix = useId();
 
   const onSelected = React.useCallback(
-    (e, newValue) => {
+    (e: React.SyntheticEvent, newValue: string | number | false) => {
       setValue(newValue);
       if (onChange) {
         onChange(e, newValue);