/* * 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 { styled } from '@mui/material/styles'; import { shouldForwardProp } from '@/modules/core/utils/ShouldForwardProp.ts'; import { IReaderSettings } from '@/modules/reader/types/Reader.types.ts'; import { applyStyles } from '@/modules/core/utils/ApplyStyles.ts'; import { getProgressBarPositionInfo } from '@/modules/reader/utils/ReaderProgressBar.utils.tsx'; type ProgressBarHighlightReadPagesProps = Pick & { currentPagesIndex: number; pagesLength: number; }; export const ProgressBarHighlightReadPages = styled(Box, { shouldForwardProp: shouldForwardProp([ 'currentPagesIndex', 'pagesLength', 'progressBarPosition', ]), })(({ currentPagesIndex, pagesLength, progressBarPosition }) => ({ position: 'absolute', pointerEvents: 'none', ...applyStyles(getProgressBarPositionInfo(progressBarPosition).isHorizontal, { left: 0, width: `${((currentPagesIndex + 1) / pagesLength) * 100}%`, height: '100%', }), ...applyStyles(getProgressBarPositionInfo(progressBarPosition).isVertical, { top: 0, width: '100%', height: `${((currentPagesIndex + 1) / pagesLength) * 100}%`, }), }));