chore: not provide data-menu-id when not ready

Author: zombieJ

src/MenuItem.tsx

@@ -200,7 +200,7 @@ const InternalMenuItem = (props: MenuItemProps) => {
       elementRef={elementRef}
       role={role === null ? 'none' : role || 'menuitem'}
       tabIndex={disabled ? null : -1}
-      data-menu-id={overflowDisabled ? null : domDataId}
+      data-menu-id={overflowDisabled && domDataId ? null : domDataId}
       {...restProps}
       {...activeProps}
       {...optionRoleProps}

src/SubMenu/index.tsx

@@ -230,7 +230,7 @@ const InternalSubMenu = (props: SubMenuProps) => {
   };
 
   // =============================== Render ===============================
-  const popupId = `${domDataId}-popup`;
+  const popupId = domDataId && `${domDataId}-popup`;
 
   // >>>>> Title
   let titleNode: React.ReactElement = (
@@ -241,7 +241,7 @@ const InternalSubMenu = (props: SubMenuProps) => {
       tabIndex={mergedDisabled ? null : -1}
       ref={elementRef}
       title={typeof title === 'string' ? title : null}
-      data-menu-id={overflowDisabled ? null : domDataId}
+      data-menu-id={overflowDisabled && domDataId ? null : domDataId}
       aria-expanded={open}
       aria-haspopup
       aria-controls={popupId}

src/context/IdContext.ts

@@ -3,6 +3,9 @@ import * as React from 'react';
 export const IdContext = React.createContext<string>(null);
 
 export function getMenuId(uuid: string, eventKey: string) {
+  if (uuid === undefined) {
+    return null;
+  }
   return `${uuid}-${eventKey}`;
 }