Changing icon imports. Also, standardised names.

changelog.md

@@ -1,6 +1,12 @@
 SciReactUI Changelog
 ====================
 
+[v0.4.2] - unreleased
+---------------------
+
+### Fixed
+- Icon imports were causing issues downstream when components are unit tested.
+
 [v0.4.1] - 2026-02-24
 ---------------------
 

src/components/controls/ColourSchemeButton.tsx

@@ -1,8 +1,10 @@
 import { useColorScheme, useTheme } from "@mui/material";
 import { IconButton, IconButtonProps } from "@mui/material";
 
-import LightMode from "@mui/icons-material/LightMode";
-import Bedtime from "@mui/icons-material/Bedtime";
+import {
+  LightMode as LightModeIcon,
+  Bedtime as BedtimeIcon,
+} from "@mui/icons-material";
 
 import { ColourSchemes } from "../../utils/globals";
 
@@ -38,7 +40,7 @@ const ColourSchemeButton = (props: IconButtonProps) => {
         if (props.onClick) props.onClick(event);
       }}
     >
-      {isDark() ? <Bedtime /> : <LightMode />}
+      {isDark() ? <BedtimeIcon /> : <LightModeIcon />}
     </IconButton>
   );
 };

src/components/controls/ScrollableImages.tsx

@@ -1,9 +1,12 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 import { Box, Button, IconButton, Slider, Stack } from "@mui/material";
-import ArrowBackIcon from "@mui/icons-material/ArrowBack";
-import ArrowForwardIcon from "@mui/icons-material/ArrowForward";
-import ArrowBackIosNewIcon from "@mui/icons-material/ArrowBackIosNew";
-import ArrowForwardIosIcon from "@mui/icons-material/ArrowForwardIos";
+import {
+  ArrowBack as ArrowBackIcon,
+  ArrowForward as ArrowForwardIcon,
+  ArrowBackIosNew as ArrowBackIosNewIcon,
+  ArrowForwardIos as ArrowForwardIosIcon,
+} from "@mui/icons-material";
+
 import { extractFramesFromTiff, isTiff } from "../../utils/TiffUtils";
 
 interface ScrollableImagesProps {

src/components/navigation/Breadcrumbs.tsx

@@ -6,9 +6,12 @@ import {
   styled,
   Typography,
 } from "@mui/material";
-import HomeIcon from "@mui/icons-material/Home";
-import NavigateNextIcon from "@mui/icons-material/NavigateNext";
+import {
+  Home as HomeIcon,
+  NavigateNext as NavigateNextIcon,
+} from "@mui/icons-material";
 import { CustomLink } from "types/links";
+
 import { Bar, BarProps } from "../controls/Bar";
 
 interface BreadcrumbsProps extends BarProps {

src/components/navigation/NavMenu.tsx

@@ -8,7 +8,7 @@ import {
   type MenuItemProps,
 } from "@mui/material";
 import React, { useState, forwardRef, useId } from "react";
-import { ExpandMore } from "@mui/icons-material";
+import { ExpandMore as ExpandMoreIcon } from "@mui/icons-material";
 import { NavLink, NavLinkProps } from "./Navbar";
 
 type NavMenuLinkProps = MenuItemProps & NavLinkProps;
@@ -108,7 +108,7 @@ const NavMenu = ({ label, children }: NavMenuProps) => {
         }}
       >
         <Typography>{label}</Typography>
-        <ExpandMore
+        <ExpandMoreIcon
           sx={{
             transition: "transform .25s",
             transform: `rotate(${open ? -180 : 0}deg)`,