refactor: use named export for everything except pages

Next expect a default export for pages so only those components should
use default exports. Everything else should use named exports to
reduce the number of import statements.

7 files changed, 31 insertions, 22 deletions

diff --git a/src/components/molecules/modals/index.ts b/src/components/molecules/modals/index.ts
new file mode 100644
index 0000000..595be13
--- /dev/null
+++ b/src/components/molecules/modals/index.ts
@@ -0,0 +1,2 @@
+export * from './modal';
+export * from './tooltip';
diff --git a/src/components/molecules/modals/modal.stories.tsx b/src/components/molecules/modals/modal.stories.tsx
index f6dd364..36e6bfc 100644
--- a/src/components/molecules/modals/modal.stories.tsx
+++ b/src/components/molecules/modals/modal.stories.tsx
@@ -1,5 +1,5 @@
 import { ComponentMeta, ComponentStory } from '@storybook/react';
-import Modal from './modal';
+import { Modal } from './modal';
 
 /**
  * Widget - Storybook Meta
diff --git a/src/components/molecules/modals/modal.test.tsx b/src/components/molecules/modals/modal.test.tsx
index 9297662..5d55b3d 100644
--- a/src/components/molecules/modals/modal.test.tsx
+++ b/src/components/molecules/modals/modal.test.tsx
@@ -1,5 +1,5 @@
 import { render, screen } from '../../../../tests/utils';
-import Modal from './modal';
+import { Modal } from './modal';
 
 const title = 'A custom title';
 const children =
diff --git a/src/components/molecules/modals/modal.tsx b/src/components/molecules/modals/modal.tsx
index 76dab55..344d5b9 100644
--- a/src/components/molecules/modals/modal.tsx
+++ b/src/components/molecules/modals/modal.tsx
@@ -1,8 +1,11 @@
 import dynamic from 'next/dynamic';
 import { FC, ReactNode } from 'react';
-import Heading, { type HeadingProps } from '../../atoms/headings/heading';
-import { type CogProps } from '../../atoms/icons/cog';
-import { type MagnifyingGlassProps } from '../../atoms/icons/magnifying-glass';
+import {
+  type CogProps,
+  Heading,
+  type HeadingProps,
+  type MagnifyingGlassProps,
+} from '../../atoms';
 import styles from './modal.module.scss';
 
 export type Icons = 'cogs' | 'search';
@@ -30,11 +33,17 @@ export type ModalProps = {
   title?: string;
 };
 
-const CogIcon = dynamic<CogProps>(() => import('../../atoms/icons/cog'), {
-  ssr: false,
-});
+const CogIcon = dynamic<CogProps>(
+  () => import('../../atoms/icons/cog').then((mod) => mod.Cog),
+  {
+    ssr: false,
+  }
+);
 const SearchIcon = dynamic<MagnifyingGlassProps>(
-  () => import('../../atoms/icons/magnifying-glass'),
+  () =>
+    import('../../atoms/icons/magnifying-glass').then(
+      (mod) => mod.MagnifyingGlass
+    ),
   { ssr: false }
 );
 
@@ -43,7 +52,7 @@ const SearchIcon = dynamic<MagnifyingGlassProps>(
  *
  * Render a modal component with an optional title and icon.
  */
-const Modal: FC<ModalProps> = ({
+export const Modal: FC<ModalProps> = ({
   children,
   className = '',
   headingClassName = '',
@@ -77,5 +86,3 @@ const Modal: FC<ModalProps> = ({
     </div>
   );
 };
-
-export default Modal;
diff --git a/src/components/molecules/modals/tooltip.stories.tsx b/src/components/molecules/modals/tooltip.stories.tsx
index a3dfa9f..abc3526 100644
--- a/src/components/molecules/modals/tooltip.stories.tsx
+++ b/src/components/molecules/modals/tooltip.stories.tsx
@@ -1,5 +1,5 @@
 import { ComponentMeta, ComponentStory } from '@storybook/react';
-import Tooltip from './tooltip';
+import { Tooltip } from './tooltip';
 import { content, icon, title } from './tooltip.fixture';
 
 /**
diff --git a/src/components/molecules/modals/tooltip.test.tsx b/src/components/molecules/modals/tooltip.test.tsx
index 6bca281..eb23334 100644
--- a/src/components/molecules/modals/tooltip.test.tsx
+++ b/src/components/molecules/modals/tooltip.test.tsx
@@ -1,5 +1,5 @@
 import { render, screen } from '../../../../tests/utils';
-import Tooltip from './tooltip';
+import { Tooltip } from './tooltip';
 import { content, icon, title } from './tooltip.fixture';
 
 describe('Tooltip', () => {
diff --git a/src/components/molecules/modals/tooltip.tsx b/src/components/molecules/modals/tooltip.tsx
index 9beab86..3c8a5df 100644
--- a/src/components/molecules/modals/tooltip.tsx
+++ b/src/components/molecules/modals/tooltip.tsx
@@ -1,5 +1,5 @@
 import { forwardRef, ForwardRefRenderFunction, ReactNode } from 'react';
-import List, { type ListItem } from '../../atoms/lists/list';
+import { List, type ListItem } from '../../atoms';
 import styles from './tooltip.module.scss';
 
 export type TooltipProps = {
@@ -25,12 +25,7 @@ export type TooltipProps = {
   title: string;
 };
 
-/**
- * Tooltip component
- *
- * Render a tooltip modal.
- */
-const Tooltip: ForwardRefRenderFunction<HTMLDivElement, TooltipProps> = (
+const TooltipWithRef: ForwardRefRenderFunction<HTMLDivElement, TooltipProps> = (
   { cloneClassName = '', className = '', content, icon, title },
   ref
 ) => {
@@ -64,4 +59,9 @@ const Tooltip: ForwardRefRenderFunction<HTMLDivElement, TooltipProps> = (
   );
 };
 
-export default forwardRef(Tooltip);
+/**
+ * Tooltip component
+ *
+ * Render a tooltip modal.
+ */
+export const Tooltip = forwardRef(TooltipWithRef);