feat: implement PageLoader component and register maritime loader as the default theme loader

libs/ui/src/lib/theme/maritime-loader-theme.ts

@@ -0,0 +1,31 @@
+import { Button, createTheme, Loader, type MantineLoaderComponent } from '@mantine/core';
+import { MaritimeLoader } from '../components/MaritimeLoader';
+
+/**
+ * Registers the branded ship loader as the default Mantine `Loader` type, and
+ * opts `Button`'s inline loading state back out to the stock oval — a 1.88:1
+ * ship does not fit a button's loader slot.
+ *
+ * Merge into an app theme with `mergeThemeOverrides(appTheme, maritimeLoaderTheme)`
+ * rather than importing this in `libs/shared`: `libs/ui` already depends on
+ * `libs/shared`, so the reverse import would be circular.
+ */
+export const maritimeLoaderTheme = createTheme({
+  components: {
+    Loader: Loader.extend({
+      defaultProps: {
+        // Mantine types custom loaders as ForwardRefExoticComponent; a plain
+        // function component satisfies the runtime contract (it forwards a
+        // ref as a normal prop under React 19) but not the structural type.
+        loaders: {
+          ...Loader.defaultLoaders,
+          maritime: MaritimeLoader as unknown as MantineLoaderComponent,
+        },
+        type: 'maritime',
+      },
+    }),
+    Button: Button.extend({
+      defaultProps: { loaderProps: { type: 'oval' } },
+    }),
+  },
+});