refactor: converted index.js to index.ts for OverflowMenu (#16494)

* refactor: converted index.js to index.ts for overflowmenu * feat: exported props for overflowmenu
carbon-design-system · May 21, 2024 · 96ef1a3 · 96ef1a3
1 parent 19f1400
commit 96ef1a3
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 8 deletions.
diff --git a/packages/react/src/components/OverflowMenu/OverflowMenu.tsx b/packages/react/src/components/OverflowMenu/OverflowMenu.tsx
@@ -7,7 +7,7 @@
 
 import invariant from 'invariant';
 import PropTypes from 'prop-types';
-import React from 'react';
+import React, { ComponentType } from 'react';
 import classNames from 'classnames';
 import ClickListener from '../../internal/ClickListener';
 import FloatingMenu, {
@@ -97,15 +97,20 @@ export const getMenuOffset = (menuBody, direction, trigger, flip) => {
 };
 
 interface Offset {
-  top: number;
-  left: number;
+  top?: number | null | undefined;
+  left?: number | null | undefined;
 }
 
-interface OverflowMenuProps {
+type IconProps = {
+  className?: string;
+  'aria-label'?: string;
+};
+
+export interface OverflowMenuProps {
   /**
    * Specify a label to be read by screen readers on the container node
    */
-  ['aria-label']: string;
+  ['aria-label']?: string;
 
   /**
    * Deprecated, please use `aria-label` instead.
@@ -198,7 +203,7 @@ interface OverflowMenuProps {
   /**
    * Function called to override icon rendering.
    */
-  renderIcon?: React.ElementType;
+  renderIcon?: ComponentType<IconProps>;
 
   /**
    * Specify a CSS selector that matches the DOM element that should

diff --git a/...eact/src/components/OverflowMenu/index.js → ...act/src/components/OverflowMenu/index.tsx b/...eact/src/components/OverflowMenu/index.js → ...act/src/components/OverflowMenu/index.tsx
@@ -7,13 +7,16 @@
 
 import React from 'react';
 import { useFeatureFlag } from '../FeatureFlags';
+import { type OverflowMenuProps } from './OverflowMenu';
 
 import { OverflowMenu as OverflowMenuV12 } from './next';
 
 import { OverflowMenu as OverflowMenuComponent } from './OverflowMenu';
 import { createClassWrapper } from '../../internal/createClassWrapper';
 
-const OverflowMenuV11 = createClassWrapper(OverflowMenuComponent);
+const OverflowMenuV11 = createClassWrapper(
+  OverflowMenuComponent as typeof React.Component
+);
 
 function OverflowMenu(props) {
   const enableV12OverflowMenu = useFeatureFlag('enable-v12-overflowmenu');
@@ -28,4 +31,4 @@ function OverflowMenu(props) {
 OverflowMenu.displayName = 'OverflowMenu';
 
 export default OverflowMenu;
-export { OverflowMenu };
+export { OverflowMenu, type OverflowMenuProps };