Add stories for MUI Navigation components

src/components/MUI/DataDisplay/Badge.stories.tsx

@@ -65,7 +65,7 @@ export const InvisibleNumber: Story = {
   render: (args) => <Badge {...args} invisible={true} />,
 };
 
-export const Colors: Story = {
+export const Colours: Story = {
   args: { badgeContent: 7 },
   render: (args) => (
     <>

src/components/MUI/MuiWrapped.tsx

@@ -4,14 +4,23 @@ import MuiAddIcon from "@mui/icons-material/Add";
 import MuiAssignmentIcon from "@mui/icons-material/Assignment";
 import MuiDeleteIcon from "@mui/icons-material/Delete";
 import MuiExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import MuiFavoriteIcon from "@mui/icons-material/Favorite";
+import MuiFileCopyIcon from "@mui/icons-material/FileCopy";
 import MuiFolderIcon from "@mui/icons-material/Folder";
+import MuiGrainIcon from "@mui/icons-material/Grain";
+import MuiHomeIcon from "@mui/icons-material/Home";
 import MuiInboxIcon from "@mui/icons-material/Inbox";
+import MuiLocationOnIcon from "@mui/icons-material/LocationOn";
 import MuiMailIcon from "@mui/icons-material/Mail";
 import MuiMenuIcon from "@mui/icons-material/Menu";
 import MuiNotificationsIcon from "@mui/icons-material/Notifications";
 import MuiPageviewIcon from "@mui/icons-material/Pageview";
+import MuiPrintIcon from "@mui/icons-material/Print";
+import MuiRestoreIcon from "@mui/icons-material/Restore";
 import MuiSaveIcon from "@mui/icons-material/Save";
 import MuiSendIcon from "@mui/icons-material/Send";
+import MuiShareIcon from "@mui/icons-material/Share";
+import MuiWhatshotIcon from "@mui/icons-material/Whatshot";
 import MuiWorkIcon from "@mui/icons-material/Work";
 
 import MuiAccordion, {
@@ -29,8 +38,20 @@ import MuiAvatar, { AvatarProps as MuiAvatarProps } from "@mui/material/Avatar";
 import MuiAvatarGroup, {
   AvatarGroupProps as MuiAvatarGroupProps,
 } from "@mui/material/AvatarGroup";
+import MuiBackdrop, {
+  BackdropProps as MuiBackdropProps,
+} from "@mui/material/Backdrop";
 import MuiBadge, { BadgeProps as MuiBadgeProps } from "@mui/material/Badge";
+import MuiBottomNavigation, {
+  BottomNavigationProps as MuiBottomNavigationProps,
+} from "@mui/material/BottomNavigation";
+import MuiBottomNavigationAction, {
+  BottomNavigationActionProps as MuiBottomNavigationActionProps,
+} from "@mui/material/BottomNavigationAction";
 import MuiBox, { BoxProps as MuiBoxProps } from "@mui/material/Box";
+import MuiBreadcrumbs, {
+  BreadcrumbsProps as MuiBreadcrumbsProps,
+} from "@mui/material/Breadcrumbs";
 import MuiButton, { ButtonProps as MuiButtonProps } from "@mui/material/Button";
 import MuiCard, { CardProps as MuiCardProps } from "@mui/material/Card";
 import MuiCardActions, {
@@ -43,13 +64,31 @@ import MuiCardMedia, {
   CardMediaProps as MuiCardMediaProps,
 } from "@mui/material/CardMedia";
 import MuiChip, { ChipProps as MuiChipProps } from "@mui/material/Chip";
+import MuiCircularProgress, {
+  CircularProgressProps as MuiCircularProgressProps,
+} from "@mui/material/CircularProgress";
+import MuiDialog, { DialogProps as MuiDialogProps } from "@mui/material/Dialog";
+import MuiDialogActions, {
+  DialogActionsProps as MuiDialogActionsProps,
+} from "@mui/material/DialogActions";
+import MuiDialogContent, {
+  DialogContentProps as MuiDialogContentProps,
+} from "@mui/material/DialogContent";
+import MuiDialogTitle, {
+  DialogTitleProps as MuiDialogTitleProps,
+} from "@mui/material/DialogTitle";
 import MuiDivider, {
   DividerProps as MuiDividerProps,
 } from "@mui/material/Divider";
+import MuiDrawer, { DrawerProps as MuiDrawerProps } from "@mui/material/Drawer";
 import MuiIcon, { IconProps as MuiIconProps } from "@mui/material/Icon";
 import MuiIconButton, {
   IconButtonProps as MuiIconButtonProps,
 } from "@mui/material/IconButton";
+import MuiLinearProgress, {
+  LinearProgressProps as MuiLinearProgressProps,
+} from "@mui/material/LinearProgress";
+import MuiLink, { LinkProps as MuiLinkProps } from "@mui/material/Link";
 import MuiList, { ListProps as MuiListProps } from "@mui/material/List";
 import MuiListItem, {
   ListItemProps as MuiListItemProps,
@@ -69,36 +108,42 @@ import MuiListItemText, {
 import MuiListSubheader, {
   ListSubheaderProps as MuiListSubheaderProps,
 } from "@mui/material/ListSubheader";
-import MuiBackdrop, {
-  BackdropProps as MuiBackdropProps,
-} from "@mui/material/Backdrop";
-import MuiCircularProgress, {
-  CircularProgressProps as MuiCircularProgressProps,
-} from "@mui/material/CircularProgress";
-import MuiDialog, { DialogProps as MuiDialogProps } from "@mui/material/Dialog";
-import MuiDialogTitle, {
-  DialogTitleProps as MuiDialogTitleProps,
-} from "@mui/material/DialogTitle";
-import MuiDialogActions, {
-  DialogActionsProps as MuiDialogActionsProps,
-} from "@mui/material/DialogActions";
-import MuiDialogContent, {
-  DialogContentProps as MuiDialogContentProps,
-} from "@mui/material/DialogContent";
-import MuiLinearProgress, {
-  LinearProgressProps as MuiLinearProgressProps,
-} from "@mui/material/LinearProgress";
+import MuiMenu, { MenuProps as MuiMenuProps } from "@mui/material/Menu";
+import MuiMenuItem, {
+  MenuItemProps as MuiMenuItemProps,
+} from "@mui/material/MenuItem";
+import MuiPagination, {
+  PaginationProps as MuiPaginationProps,
+} from "@mui/material/Pagination";
 import MuiPaper, { PaperProps as MuiPaperProps } from "@mui/material/Paper";
 import MuiSkeleton, {
   SkeletonProps as MuiSkeletonProps,
 } from "@mui/material/Skeleton";
 import MuiSnackbar, {
   SnackbarProps as MuiSnackbarProps,
 } from "@mui/material/Snackbar";
+import MuiSpeedDial, {
+  SpeedDialProps as MuiSpeedDialProps,
+} from "@mui/material/SpeedDial";
+import MuiSpeedDialAction, {
+  SpeedDialActionProps as MuiSpeedDialActionProps,
+} from "@mui/material/SpeedDialAction";
+import MuiSpeedDialIcon from "@mui/material/SpeedDial";
 import MuiStack, { StackProps as MuiStackProps } from "@mui/material/Stack";
+import MuiStepper, {
+  StepperProps as MuiStepperProps,
+} from "@mui/material/Stepper";
+import MuiStep, { StepProps as MuiStepProps } from "@mui/material/Step";
+import MuiStepLabel, {
+  StepLabelProps as MuiStepLabelProps,
+} from "@mui/material/StepLabel";
+import MuiStepContent, {
+  StepContentProps as MuiStepContentProps,
+} from "@mui/material/StepContent";
 import MuiSvgIcon, {
   SvgIconProps as MuiSvgIconProps,
 } from "@mui/material/SvgIcon";
+import MuiTab, { TabProps as MuiTabProps } from "@mui/material/Tab";
 import MuiTable, { TableProps as MuiTableProps } from "@mui/material/Table";
 import MuiTableBody, {
   TableBodyProps as MuiTableBodyProps,
@@ -124,13 +169,107 @@ import MuiTableRow, {
 import MuiTableSortLabel, {
   TableSortLabelProps as MuiTableSortLabelProps,
 } from "@mui/material/TableSortLabel";
+import MuiTabs, { TabsProps as MuiTabsProps } from "@mui/material/Tabs";
 import MuiToolbar, {
   ToolbarProps as MuiToolbarProps,
 } from "@mui/material/Toolbar";
 import MuiTypography, {
   TypographyProps as MuiTypographyProps,
 } from "@mui/material/Typography";
 
+export const AddIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiAddIcon,
+  "AddIcon",
+);
+export const AssignmentIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiAssignmentIcon,
+  "AssignmentIcon",
+);
+export const DeleteIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiDeleteIcon,
+  "DeleteIcon",
+);
+export const ExpandMoreIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiExpandMoreIcon,
+  "ExpandMoreIcon",
+);
+export const FavoriteIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiFavoriteIcon,
+  "FavoriteIcon",
+);
+export const FileCopyIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiFileCopyIcon,
+  "FileCopyIcon",
+);
+export const FolderIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiFolderIcon,
+  "FolderIcon",
+);
+export const GrainIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiGrainIcon,
+  "GrainIcon",
+);
+export const HomeIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiHomeIcon,
+  "HomeIcon",
+);
+export const InboxIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiInboxIcon,
+  "InboxIcon",
+);
+export const LocationOnIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiLocationOnIcon,
+  "LocationOnIcon",
+);
+export const MailIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiMailIcon,
+  "MailIcon",
+);
+export const MenuIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiMenuIcon,
+  "MenuIcon",
+);
+export const NotificationsIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiNotificationsIcon,
+  "NotificationIcon",
+);
+export const PageviewIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiPageviewIcon,
+  "PageviewIcon",
+);
+export const PrintIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiPrintIcon,
+  "PrintIcon",
+);
+export const RestoreIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiRestoreIcon,
+  "RestoreIcon",
+);
+export const SaveIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiSaveIcon,
+  "SaveIcon",
+);
+export const SendIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiSendIcon,
+  "SendIcon",
+);
+export const ShareIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiShareIcon,
+  "ShareIcon",
+);
+export const SpeedDialIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiSpeedDialIcon,
+  "SpeedDialIcon",
+);
+export const WhatshotIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiWhatshotIcon,
+  "WhatshotIcon",
+);
+export const WorkIcon = MuiWrapper<MuiSvgIconProps, SVGSVGElement>(
+  MuiWorkIcon,
+  "WorkIcon",
+);
+
 export const Accordion = MuiWrapper<MuiAccordionProps>(
   MuiAccordion,
   "Accordion",
@@ -143,18 +282,29 @@ export const AccordionSummary = MuiWrapper<MuiAccordionSummaryProps>(
   MuiAccordionSummary,
   "AccordionSummary",
 );
-export const AddIcon = MuiWrapper(MuiAddIcon, "AddIcon");
 export const Alert = MuiWrapper<MuiAlertProps>(MuiAlert, "Alert");
 export const AppBar = MuiWrapper<MuiAppBarProps>(MuiAppBar, "AppBar");
-export const AssignmentIcon = MuiWrapper(MuiAssignmentIcon, "AssignmentIcon");
 export const Avatar = MuiWrapper<MuiAvatarProps>(MuiAvatar, "Avatar");
 export const AvatarGroup = MuiWrapper<MuiAvatarGroupProps>(
   MuiAvatarGroup,
   "AvatarGroup",
 );
-export const Badge = MuiWrapper<MuiBadgeProps>(MuiBadge, "Badge");
 export const Backdrop = MuiWrapper<MuiBackdropProps>(MuiBackdrop, "Backdrop");
+export const Badge = MuiWrapper<MuiBadgeProps>(MuiBadge, "Badge");
+export const BottomNavigation = MuiWrapper<MuiBottomNavigationProps>(
+  MuiBottomNavigation,
+  "BottomNavigation",
+);
+export const BottomNavigationAction =
+  MuiWrapper<MuiBottomNavigationActionProps>(
+    MuiBottomNavigationAction,
+    "BottomNavigationAction",
+  );
 export const Box = MuiWrapper<MuiBoxProps>(MuiBox, "Box");
+export const Breadcrumbs = MuiWrapper<MuiBreadcrumbsProps>(
+  MuiBreadcrumbs,
+  "Breadcrumbs",
+);
 export const Button = MuiWrapper<MuiButtonProps>(MuiButton, "Button");
 export const Card = MuiWrapper<MuiCardProps>(MuiCard, "Card");
 export const CardActions = MuiWrapper<MuiCardActionsProps>(
@@ -170,8 +320,6 @@ export const CardMedia = MuiWrapper<MuiCardMediaProps>(
   "CardMedia",
 );
 export const Chip = MuiWrapper<MuiChipProps>(MuiChip, "Chip");
-export const DeleteIcon = MuiWrapper(MuiDeleteIcon, "DeleteIcon");
-export const Divider = MuiWrapper<MuiDividerProps>(MuiDivider, "Divider");
 export const CircularProgress = MuiWrapper<
   MuiCircularProgressProps,
   HTMLSpanElement
@@ -189,14 +337,18 @@ export const DialogTitle = MuiWrapper<MuiDialogTitleProps>(
   MuiDialogTitle,
   "DialogTitle",
 );
-export const ExpandMoreIcon = MuiWrapper(MuiExpandMoreIcon, "ExpandMoreIcon");
-export const FolderIcon = MuiWrapper(MuiFolderIcon, "FolderIcon");
+export const Divider = MuiWrapper<MuiDividerProps>(MuiDivider, "Divider");
+export const Drawer = MuiWrapper<MuiDrawerProps>(MuiDrawer, "Drawer");
 export const Icon = MuiWrapper<MuiIconProps>(MuiIcon, "Icon");
 export const IconButton = MuiWrapper<MuiIconButtonProps>(
   MuiIconButton,
   "IconButton",
 );
-export const InboxIcon = MuiWrapper(MuiInboxIcon, "InboxIcon");
+export const LinearProgress = MuiWrapper<MuiLinearProgressProps>(
+  MuiLinearProgress,
+  "LinearProgress",
+);
+export const Link = MuiWrapper<MuiLinkProps>(MuiLink, "Link");
 export const List = MuiWrapper<MuiListProps>(MuiList, "List");
 export const ListItem = MuiWrapper<MuiListItemProps>(MuiListItem, "ListItem");
 export const ListItemAvatar = MuiWrapper<MuiListItemAvatarProps>(
@@ -219,25 +371,36 @@ export const ListSubheader = MuiWrapper<MuiListSubheaderProps>(
   MuiListSubheader,
   "ListSubheader",
 );
-export const MailIcon = MuiWrapper(MuiMailIcon, "MailIcon");
-
-export const LinearProgress = MuiWrapper<MuiLinearProgressProps>(
-  MuiLinearProgress,
-  "LinearProgress",
-);
-export const MenuIcon = MuiWrapper(MuiMenuIcon, "MenuIcon");
-export const NotificationsIcon = MuiWrapper(
-  MuiNotificationsIcon,
-  "NotificationIcon",
+export const Menu = MuiWrapper<MuiMenuProps>(MuiMenu, "Menu");
+export const MenuItem = MuiWrapper<MuiMenuItemProps>(MuiMenuItem, "MenuItem");
+export const Pagination = MuiWrapper<MuiPaginationProps>(
+  MuiPagination,
+  "Pagination",
 );
-export const PageviewIcon = MuiWrapper(MuiPageviewIcon, "PageviewIcon");
 export const Paper = MuiWrapper<MuiPaperProps>(MuiPaper, "Paper");
-export const SaveIcon = MuiWrapper(MuiSaveIcon, "SaveIcon");
-export const SendIcon = MuiWrapper(MuiSendIcon, "SendIcon");
 export const Skeleton = MuiWrapper<MuiSkeletonProps>(MuiSkeleton, "Skeleton");
 export const Snackbar = MuiWrapper<MuiSnackbarProps>(MuiSnackbar, "Snackbar");
+export const SpeedDial = MuiWrapper<MuiSpeedDialProps>(
+  MuiSpeedDial,
+  "SpeedDial",
+);
+export const SpeedDialAction = MuiWrapper<MuiSpeedDialActionProps>(
+  MuiSpeedDialAction,
+  "SpeedDialAction",
+);
 export const Stack = MuiWrapper<MuiStackProps>(MuiStack, "Stack");
+export const Stepper = MuiWrapper<MuiStepperProps>(MuiStepper, "Stepper");
+export const Step = MuiWrapper<MuiStepProps>(MuiStep, "Step");
+export const StepLabel = MuiWrapper<MuiStepLabelProps>(
+  MuiStepLabel,
+  "StepLabel",
+);
+export const StepContent = MuiWrapper<MuiStepContentProps>(
+  MuiStepContent,
+  "StepContent",
+);
 export const SvgIcon = MuiWrapper<MuiSvgIconProps>(MuiSvgIcon, "SvgIcon");
+export const Tab = MuiWrapper<MuiTabProps>(MuiTab, "Tab");
 export const Table = MuiWrapper<MuiTableProps>(MuiTable, "Table");
 export const TableBody = MuiWrapper<MuiTableBodyProps>(
   MuiTableBody,
@@ -268,9 +431,9 @@ export const TableSortLabel = MuiWrapper<MuiTableSortLabelProps>(
   MuiTableSortLabel,
   "TableSortLabel",
 );
+export const Tabs = MuiWrapper<MuiTabsProps>(MuiTabs, "Tabs");
 export const Toolbar = MuiWrapper<MuiToolbarProps>(MuiToolbar, "Toolbar");
 export const Typography = MuiWrapper<MuiTypographyProps>(
   MuiTypography,
   "Typography",
 );
-export const WorkIcon = MuiWrapper(MuiWorkIcon, "WorkIcon");