Reader progress bars

src/modules/reader/components/overlay/progress-bar/ReaderProgressBarSlot.tsx

@@ -0,0 +1,31 @@
+/*
+ * Copyright (C) Contributors to the Suwayomi project
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+
+import Box from '@mui/material/Box';
+import Tooltip from '@mui/material/Tooltip';
+import { ReactNode } from 'react';
+import { ReaderProgressBarSlotProps } from '@/modules/reader/types/ReaderProgressBar.types.ts';
+import { READER_PROGRESS_BAR_POSITION_TO_PLACEMENT } from '@/modules/reader/constants/ReaderProgressBar.constants.ts';
+
+export const ReaderProgressBarSlot = ({
+    pageName,
+    progressBarPosition,
+    slotProps,
+    children,
+}: ReaderProgressBarSlotProps & { children?: ReactNode }) => (
+    <Tooltip
+        {...slotProps?.tooltip}
+        key={pageName}
+        title={pageName}
+        placement={READER_PROGRESS_BAR_POSITION_TO_PLACEMENT[progressBarPosition]}
+    >
+        <Box {...slotProps?.box} sx={{ width: '100%', height: '100%', ...slotProps?.box?.sx }}>
+            {children}
+        </Box>
+    </Tooltip>
+);