feat(menu): add scrollableblock type definitions

src/components/menu/index.d.ts

@@ -3,3 +3,4 @@ export { default as MenuItem } from "./menu-item/menu-item";
 export { default as SubmenuBlock } from "./submenu-block/submenu-block";
 export { default as MenuDivider } from "./menu-divider/menu-divider";
 export { default as MenuSegmentTitle } from "./menu-segment-title/menu-segment-title";
+export { default as ScrollableBlock } from "./scrollable-block/scrollable-block";

src/components/menu/menu-item/menu-item.d.ts

@@ -1,22 +1,46 @@
 import * as React from "react";
-import { IconTypes } from "../../../utils/helpers/options-helper/options-helper";
+import * as OptionsHelper from "../../../utils/helpers/options-helper/options-helper";
+import { BoxProps } from "../../box/box";
 
-export interface MenuItemProps {
-  children: React.ReactNode;
+export interface MenuItemBaseProps extends BoxProps {
+  /** Custom className */
   className?: string;
-  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
-  icon?: IconTypes;
+  /** onClick handler */
+  onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
+  /** Defines which direction the submenu will hang eg. left/right */
   submenuDirection?: string;
+  /** Is the menu item the currently selected item. */
   selected?: boolean;
+  /** A title for the menu item that has a submenu. */
   submenu?: React.ReactNode | boolean;
+  /** The href to use for the menu item. */
   href?: string;
-  onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;
+  /** onKeyDown handler */
+  onKeyDown?: (event: React.KeyboardEvent<HTMLAnchorElement>) => void;
+  /** The target to use for the menu item. */
   target?: string;
+  /** set the colour variant for a menuType */
   variant?: "default" | "alternate";
+  /** Flag to display the dropdown arrow when an item has a submenu */
   showDropdownArrow?: boolean;
+  /** If no text is provided an ariaLabel should be given to facilitate accessibility. */
   ariaLabel?: string;
 }
 
+export interface MenuWithChildren extends MenuItemBaseProps {
+  children: React.ReactNode;
+  /** Either prop `icon` must be defined or this node must have children. */
+  icon?: OptionsHelper.IconTypes;
+}
+
+export interface MenuWithIcon extends MenuItemBaseProps {
+  /** Either prop `icon` must be defined or this node must have children. */
+  icon: OptionsHelper.IconTypes;
+  children?: React.ReactNode;
+}
+
+export type MenuItemProps = MenuWithChildren | MenuWithIcon;
+
 declare function MenuItem(props: MenuItemProps): JSX.Element;
 
 export default MenuItem;

src/components/menu/menu.d.ts

@@ -9,7 +9,9 @@ interface MenuContextProps {
 }
 
 export interface MenuProps {
+  /** Children elements */
   children: React.ReactNode;
+  /** Defines the color scheme of the component */
   menuType?: "light" | "dark";
 }
 

src/components/menu/scrollable-block/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./scrollable-block";

src/components/menu/scrollable-block/scrollable-block.d.ts

@@ -0,0 +1,10 @@
+export interface ScrollableBlockProps {
+  /** Children elements */
+  children: React.ReactNode;
+  /** set the colour variant for a menuType */
+  variant?: "default" | "alternate";
+}
+
+declare function ScrollableBlock(props: ScrollableBlockProps): JSX.Element;
+
+export default ScrollableBlock;

src/components/menu/submenu-block/submenu-block.d.ts

@@ -1,7 +1,10 @@
 import * as React from "react";
 
 export interface SubmenuBlockProps {
+  /** Children elements */
   children: React.ReactNode;
+  /** set the colour variant for a menuType */
+  variant?: "default" | "alternate";
 }
 
 declare function SubmenuBlock(props: SubmenuBlockProps): JSX.Element;