quran/.next/server/chunks/29078.js

exports.id = 29078;
exports.ids = [29078];
exports.modules = {

/***/ 33126:
/***/ ((module) => {

// Exports
module.exports = {
	"line": "Line_line__3jPyY",
	"container": "Line_container__CApVP",
	"mobileInline": "Line_mobileInline__jEjq9",
	"fixedWidth": "Line_fixedWidth__AHk9W"
};


/***/ }),

/***/ 84619:
/***/ ((module) => {

// Exports
module.exports = {
	"fallback_qpc_uthmani_hafs-line-width-1": "Page_fallback_qpc_uthmani_hafs-line-width-1__X9dUi",
	"fallback_qpc_uthmani_hafs-line-width-2": "Page_fallback_qpc_uthmani_hafs-line-width-2__prdZQ",
	"fallback_qpc_uthmani_hafs-line-width-3": "Page_fallback_qpc_uthmani_hafs-line-width-3__CpdkI",
	"fallback_qpc_uthmani_hafs-line-width-4": "Page_fallback_qpc_uthmani_hafs-line-width-4__bpdKT",
	"fallback_qpc_uthmani_hafs-line-width-5": "Page_fallback_qpc_uthmani_hafs-line-width-5__r0dhC",
	"fallback_qpc_uthmani_hafs-line-width-6": "Page_fallback_qpc_uthmani_hafs-line-width-6__hNehk",
	"fallback_qpc_uthmani_hafs-line-width-7": "Page_fallback_qpc_uthmani_hafs-line-width-7__W627r",
	"fallback_qpc_uthmani_hafs-line-width-8": "Page_fallback_qpc_uthmani_hafs-line-width-8__obMGX",
	"fallback_qpc_uthmani_hafs-line-width-9": "Page_fallback_qpc_uthmani_hafs-line-width-9__uE3Np",
	"fallback_qpc_uthmani_hafs-line-width-10": "Page_fallback_qpc_uthmani_hafs-line-width-10__g_Coa",
	"container": "Page_container__hkXnW",
	"mobileCenterText": "Page_mobileCenterText__WB1en"
};


/***/ }),

/***/ 7994:
/***/ ((module) => {

// Exports
module.exports = {
	"pageText": "PageFooter_pageText__YdcIS",
	"pageLink": "PageFooter_pageLink__YT3wq"
};


/***/ }),

/***/ 15426:
/***/ ((module) => {

// Exports
module.exports = {
	"buttonsContainer": "PageNavigationButtons_buttonsContainer__fomTO",
	"prevButton": "PageNavigationButtons_prevButton__OOwCQ",
	"audioPlayerOpen": "PageNavigationButtons_audioPlayerOpen__sIOdL"
};


/***/ }),

/***/ 27374:
/***/ ((module) => {

// Exports
module.exports = {
	"code_v1-line-width-1": "ReadingView_code_v1-line-width-1__u_hC8",
	"code_v1-line-width-2": "ReadingView_code_v1-line-width-2__Hf8MJ",
	"code_v1-line-width-3": "ReadingView_code_v1-line-width-3__C3GX9",
	"code_v1-line-width-4": "ReadingView_code_v1-line-width-4__JF_zd",
	"code_v1-line-width-5": "ReadingView_code_v1-line-width-5__6kO9e",
	"code_v1-line-width-6": "ReadingView_code_v1-line-width-6__Xmg9T",
	"code_v1-line-width-7": "ReadingView_code_v1-line-width-7__5DID0",
	"code_v1-line-width-8": "ReadingView_code_v1-line-width-8__QSPjI",
	"code_v1-line-width-9": "ReadingView_code_v1-line-width-9__g4KUg",
	"code_v1-line-width-10": "ReadingView_code_v1-line-width-10__EbYvu",
	"code_v2-line-width-1": "ReadingView_code_v2-line-width-1__LKGTJ",
	"code_v2-line-width-2": "ReadingView_code_v2-line-width-2__XxvSm",
	"code_v2-line-width-3": "ReadingView_code_v2-line-width-3__boomP",
	"code_v2-line-width-4": "ReadingView_code_v2-line-width-4__jii3F",
	"code_v2-line-width-5": "ReadingView_code_v2-line-width-5__yh418",
	"code_v2-line-width-6": "ReadingView_code_v2-line-width-6__PmlQ_",
	"code_v2-line-width-7": "ReadingView_code_v2-line-width-7__L3zwX",
	"code_v2-line-width-8": "ReadingView_code_v2-line-width-8__fodHn",
	"code_v2-line-width-9": "ReadingView_code_v2-line-width-9__R51Sk",
	"code_v2-line-width-10": "ReadingView_code_v2-line-width-10__aRnmF",
	"text_indopak_15_lines-line-width-1": "ReadingView_text_indopak_15_lines-line-width-1__HIvVb",
	"text_indopak_15_lines-line-width-2": "ReadingView_text_indopak_15_lines-line-width-2__COw_J",
	"text_indopak_15_lines-line-width-3": "ReadingView_text_indopak_15_lines-line-width-3__x0I0x",
	"text_indopak_15_lines-line-width-4": "ReadingView_text_indopak_15_lines-line-width-4__oxtcz",
	"text_indopak_15_lines-line-width-5": "ReadingView_text_indopak_15_lines-line-width-5__CIg5C",
	"text_indopak_15_lines-line-width-6": "ReadingView_text_indopak_15_lines-line-width-6__e8_Zq",
	"text_indopak_15_lines-line-width-7": "ReadingView_text_indopak_15_lines-line-width-7__R1c56",
	"text_indopak_15_lines-line-width-8": "ReadingView_text_indopak_15_lines-line-width-8__f1hhH",
	"text_indopak_15_lines-line-width-9": "ReadingView_text_indopak_15_lines-line-width-9__e_Fhh",
	"text_indopak_15_lines-line-width-10": "ReadingView_text_indopak_15_lines-line-width-10__av8qG",
	"text_indopak_16_lines-line-width-1": "ReadingView_text_indopak_16_lines-line-width-1__wEGW4",
	"text_indopak_16_lines-line-width-2": "ReadingView_text_indopak_16_lines-line-width-2__AeVXj",
	"text_indopak_16_lines-line-width-3": "ReadingView_text_indopak_16_lines-line-width-3__UEeqd",
	"text_indopak_16_lines-line-width-4": "ReadingView_text_indopak_16_lines-line-width-4__2Nw2u",
	"text_indopak_16_lines-line-width-5": "ReadingView_text_indopak_16_lines-line-width-5__r2tKN",
	"text_indopak_16_lines-line-width-6": "ReadingView_text_indopak_16_lines-line-width-6__ybw6l",
	"text_indopak_16_lines-line-width-7": "ReadingView_text_indopak_16_lines-line-width-7____CTX",
	"text_indopak_16_lines-line-width-8": "ReadingView_text_indopak_16_lines-line-width-8__ymIE0",
	"text_indopak_16_lines-line-width-9": "ReadingView_text_indopak_16_lines-line-width-9__MKM2y",
	"text_indopak_16_lines-line-width-10": "ReadingView_text_indopak_16_lines-line-width-10__XhBAV",
	"qpc_uthmani_hafs-line-width-1": "ReadingView_qpc_uthmani_hafs-line-width-1__1ArHr",
	"qpc_uthmani_hafs-line-width-2": "ReadingView_qpc_uthmani_hafs-line-width-2__I6rKn",
	"qpc_uthmani_hafs-line-width-3": "ReadingView_qpc_uthmani_hafs-line-width-3__jIQg8",
	"qpc_uthmani_hafs-line-width-4": "ReadingView_qpc_uthmani_hafs-line-width-4__RXw5a",
	"qpc_uthmani_hafs-line-width-5": "ReadingView_qpc_uthmani_hafs-line-width-5__eO8Fo",
	"qpc_uthmani_hafs-line-width-6": "ReadingView_qpc_uthmani_hafs-line-width-6__TbgkW",
	"qpc_uthmani_hafs-line-width-7": "ReadingView_qpc_uthmani_hafs-line-width-7__RoJmi",
	"qpc_uthmani_hafs-line-width-8": "ReadingView_qpc_uthmani_hafs-line-width-8__m_AJa",
	"qpc_uthmani_hafs-line-width-9": "ReadingView_qpc_uthmani_hafs-line-width-9___DGtD",
	"qpc_uthmani_hafs-line-width-10": "ReadingView_qpc_uthmani_hafs-line-width-10__uNVi7",
	"tajweed-line-width-1": "ReadingView_tajweed-line-width-1__XzcHo",
	"tajweed-line-width-2": "ReadingView_tajweed-line-width-2__qI_3N",
	"tajweed-line-width-3": "ReadingView_tajweed-line-width-3__iPATb",
	"tajweed-line-width-4": "ReadingView_tajweed-line-width-4___gTZv",
	"tajweed-line-width-5": "ReadingView_tajweed-line-width-5__8creJ",
	"tajweed-line-width-6": "ReadingView_tajweed-line-width-6__mqO8v",
	"tajweed-line-width-7": "ReadingView_tajweed-line-width-7__p1Oi4",
	"tajweed-line-width-8": "ReadingView_tajweed-line-width-8__js74h",
	"tajweed-line-width-9": "ReadingView_tajweed-line-width-9__gjjDU",
	"tajweed-line-width-10": "ReadingView_tajweed-line-width-10__xBOUh",
	"container": "ReadingView_container__99RFM",
	"virtuosoScroller": "ReadingView_virtuosoScroller__Y3HA6"
};


/***/ }),

/***/ 82877:
/***/ ((module) => {

// Exports
module.exports = {
	"skeletonContainer": "ReadingViewSkeleton_skeletonContainer__h5Sb2",
	"skeleton": "ReadingViewSkeleton_skeleton__hw8ZE",
	"fixedWidth": "ReadingViewSkeleton_fixedWidth__fIRzb"
};


/***/ }),

/***/ 5950:
/***/ ((module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _xstate_react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(59456);
/* harmony import */ var _xstate_react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_xstate_react__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(59003);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(6022);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _utils_memoization__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(52544);
/* harmony import */ var _Line_module_scss__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(33126);
/* harmony import */ var _Line_module_scss__WEBPACK_IMPORTED_MODULE_13___default = /*#__PURE__*/__webpack_require__.n(_Line_module_scss__WEBPACK_IMPORTED_MODULE_13__);
/* harmony import */ var _components_chapters_ChapterHeader__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(59459);
/* harmony import */ var _components_Onboarding_OnboardingProvider__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(51879);
/* harmony import */ var _components_Verse_VerseText__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(36716);
/* harmony import */ var _hooks_useScrollToElement__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(56748);
/* harmony import */ var _redux_slices_AudioPlayer_state__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(53800);
/* harmony import */ var _redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(90264);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(44519);
/* harmony import */ var src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(64564);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_components_chapters_ChapterHeader__WEBPACK_IMPORTED_MODULE_5__, _components_Onboarding_OnboardingProvider__WEBPACK_IMPORTED_MODULE_6__, _components_Verse_VerseText__WEBPACK_IMPORTED_MODULE_7__, src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_12__]);
([_components_chapters_ChapterHeader__WEBPACK_IMPORTED_MODULE_5__, _components_Onboarding_OnboardingProvider__WEBPACK_IMPORTED_MODULE_6__, _components_Verse_VerseText__WEBPACK_IMPORTED_MODULE_7__, src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_12__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);















const Line = ({ lineKey , words , isBigTextLayout , pageIndex , lineIndex  })=>{
    const audioService = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_12__/* .AudioPlayerMachineContext */ .c);
    const isHighlighted = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_2__.useSelector)(audioService, (state)=>{
        const { surah , ayahNumber  } = state.context;
        const verseKeys = words.map((word)=>word.verseKey);
        return verseKeys.includes(`${surah}:${ayahNumber}`);
    });
    const [scrollToSelectedItem, selectedItemRef] = (0,_hooks_useScrollToElement__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .ZP)(_hooks_useScrollToElement__WEBPACK_IMPORTED_MODULE_8__/* .SMOOTH_SCROLL_TO_CENTER */ .nv);
    const { isActive  } = (0,_components_Onboarding_OnboardingProvider__WEBPACK_IMPORTED_MODULE_6__/* .useOnboarding */ .P)();
    // disable auto scrolling when the user is onboarding
    const enableAutoScrolling = (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(_redux_slices_AudioPlayer_state__WEBPACK_IMPORTED_MODULE_9__/* .selectEnableAutoScrolling */ .Mj, react_redux__WEBPACK_IMPORTED_MODULE_4__.shallowEqual) && !isActive;
    const { showWordByWordTranslation , showWordByWordTransliteration  } = (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(_redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_10__/* .selectInlineDisplayWordByWordPreferences */ .eB, react_redux__WEBPACK_IMPORTED_MODULE_4__.shallowEqual);
    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(()=>{
        if (isHighlighted && enableAutoScrolling) {
            scrollToSelectedItem();
        }
    }, [
        isHighlighted,
        scrollToSelectedItem,
        enableAutoScrolling
    ]);
    const firstWordData = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_11__/* .getWordDataByLocation */ .TO)(words[0].location);
    const shouldShowChapterHeader = firstWordData[1] === "1" && firstWordData[2] === "1";
    const isWordByWordLayout = showWordByWordTranslation || showWordByWordTransliteration;
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        ref: selectedItemRef,
        id: lineKey,
        className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_Line_module_scss__WEBPACK_IMPORTED_MODULE_13___default().container), {
            [(_Line_module_scss__WEBPACK_IMPORTED_MODULE_13___default().highlighted)]: isHighlighted,
            [(_Line_module_scss__WEBPACK_IMPORTED_MODULE_13___default().mobileInline)]: isBigTextLayout
        }),
        children: [
            shouldShowChapterHeader && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_chapters_ChapterHeader__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                chapterId: firstWordData[0],
                pageNumber: words[0].pageNumber,
                hizbNumber: words[0].hizbNumber
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_Line_module_scss__WEBPACK_IMPORTED_MODULE_13___default().line), {
                    [(_Line_module_scss__WEBPACK_IMPORTED_MODULE_13___default().mobileInline)]: isBigTextLayout,
                    [(_Line_module_scss__WEBPACK_IMPORTED_MODULE_13___default().fixedWidth)]: !isWordByWordLayout
                }),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_Verse_VerseText__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .Z, {
                    words: words,
                    isReadingMode: true,
                    isHighlighted: isHighlighted,
                    shouldShowH1ForSEO: pageIndex === 0 && lineIndex === 0
                })
            })
        ]
    });
};
/**
 * Since we are passing words and it's an array
 * even if the same words are passed, their reference will change
 * on fetching a new page and since Memo only does shallow comparison,
 * we need to use custom comparing logic:
 *
 *  1. Check if the line keys are the same.
 *  2. Check if the number of words are the same.
 *  3. Check if isBigTextLayout values are the same.
 *  4. Check if the font changed.
 *
 * If the above conditions are met, it's safe to assume that the result
 * of both renders are the same.
 *
 * @param {LineProps} prevProps
 * @param {LineProps} nextProps
 * @returns {boolean}
 */ const areLinesEqual = (prevProps, nextProps)=>prevProps.lineKey === nextProps.lineKey && prevProps.isBigTextLayout === nextProps.isBigTextLayout && !(0,_utils_memoization__WEBPACK_IMPORTED_MODULE_14__/* .verseFontChanged */ .RG)(prevProps.quranReaderStyles, nextProps.quranReaderStyles, prevProps.words, nextProps.words);
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (/*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.memo)(Line, areLinesEqual));

__webpack_async_result__();
} catch(e) { __webpack_async_result__(e); } });

/***/ }),

/***/ 82783:
/***/ ((module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(59003);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6022);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _groupLinesByVerses__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(45211);
/* harmony import */ var _Line__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(5950);
/* harmony import */ var _Page_module_scss__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(84619);
/* harmony import */ var _Page_module_scss__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(_Page_module_scss__WEBPACK_IMPORTED_MODULE_11__);
/* harmony import */ var _PageFooter__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(4535);
/* harmony import */ var _components_QuranReader_hooks_useIsFontLoaded__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(97226);
/* harmony import */ var _redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(90264);
/* harmony import */ var _utils_fontFaceHelper__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(64198);
/* harmony import */ var types_QuranReader__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(50467);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_Line__WEBPACK_IMPORTED_MODULE_5__, _PageFooter__WEBPACK_IMPORTED_MODULE_6__]);
([_Line__WEBPACK_IMPORTED_MODULE_5__, _PageFooter__WEBPACK_IMPORTED_MODULE_6__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);












const Page = ({ verses , pageNumber , quranReaderStyles , pageIndex  })=>{
    const lines = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(()=>verses && verses.length ? (0,_groupLinesByVerses__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z)(verses) : {}, [
        verses
    ]);
    const { quranTextFontScale , quranFont , mushafLines  } = quranReaderStyles;
    const { showWordByWordTranslation , showWordByWordTransliteration  } = (0,react_redux__WEBPACK_IMPORTED_MODULE_3__.useSelector)(_redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_8__/* .selectInlineDisplayWordByWordPreferences */ .eB, react_redux__WEBPACK_IMPORTED_MODULE_3__.shallowEqual);
    const isWordByWordLayout = showWordByWordTranslation || showWordByWordTransliteration;
    const isBigTextLayout = isWordByWordLayout || quranTextFontScale > 3 || quranFont === types_QuranReader__WEBPACK_IMPORTED_MODULE_10__/* .QuranFont.Tajweed */ .fr.Tajweed;
    const isFontLoaded = (0,_components_QuranReader_hooks_useIsFontLoaded__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .Z)(pageNumber, quranFont);
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        id: `page-${pageNumber}`,
        className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_Page_module_scss__WEBPACK_IMPORTED_MODULE_11___default().container), {
            [(_Page_module_scss__WEBPACK_IMPORTED_MODULE_11___default().mobileCenterText)]: isBigTextLayout,
            [(_Page_module_scss__WEBPACK_IMPORTED_MODULE_11___default())[(0,_utils_fontFaceHelper__WEBPACK_IMPORTED_MODULE_9__/* .getLineWidthClassName */ .oj)(types_QuranReader__WEBPACK_IMPORTED_MODULE_10__/* .FALLBACK_FONT */ .v3, quranTextFontScale, mushafLines, true)]]: !isFontLoaded
        }),
        children: [
            Object.keys(lines).map((key, lineIndex)=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_Line__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                    pageIndex: pageIndex,
                    lineIndex: lineIndex,
                    lineKey: key,
                    words: lines[key],
                    isBigTextLayout: isBigTextLayout,
                    quranReaderStyles: quranReaderStyles
                }, key)),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_PageFooter__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                page: pageNumber
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Page);

__webpack_async_result__();
} catch(e) { __webpack_async_result__(e); } });

/***/ }),

/***/ 92296:
/***/ ((module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var swr_immutable__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(79847);
/* harmony import */ var _utils_page__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(95871);
/* harmony import */ var _Page__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(82783);
/* harmony import */ var _ReadingViewSkeleton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(87065);
/* harmony import */ var _components_QuranReader_api__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(96435);
/* harmony import */ var _hooks_useIsUsingDefaultSettings__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(35507);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([swr_immutable__WEBPACK_IMPORTED_MODULE_2__, _Page__WEBPACK_IMPORTED_MODULE_3__, _hooks_useIsUsingDefaultSettings__WEBPACK_IMPORTED_MODULE_6__]);
([swr_immutable__WEBPACK_IMPORTED_MODULE_2__, _Page__WEBPACK_IMPORTED_MODULE_3__, _hooks_useIsUsingDefaultSettings__WEBPACK_IMPORTED_MODULE_6__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);








const getPageVersesRange = (currentMushafPage, apiPagesVersesRange)=>{
    const lookupRecord = {
        ...apiPagesVersesRange[currentMushafPage]
    };
    // TODO: remove this from BE
    // we remove firstVerseKey and lastVerseKey before we send the params to BE as BE doesn't need them
    delete lookupRecord.firstVerseKey;
    delete lookupRecord.lastVerseKey;
    return lookupRecord;
};
/**
 * Get the verses returned from the initialData of the first page.
 * This function will filter out all the words that don't
 * belong to the first page in-case we have some verses
 * that contain words that don't belong to the first page
 * (applies to 16-line Indopak Mushaf e.g. /ur/haji/25 or /ur/2/211-216)
 *
 * @param {number} pageNumber
 * @param {Verse[]} initialVerses
 * @returns {Verse[]}
 */ const getInitialVerses = (pageNumber, initialVerses)=>initialVerses.map((verse)=>({
            ...verse,
            words: verse.words.filter((word)=>word.pageNumber === pageNumber)
        }));
/**
 * A component that will fetch the verses of the current mushaf page
 * and will render a skeleton while it's loading.
 *
 * @param {Props} param0
 * @returns {JSX.Element}
 */ const PageContainer = ({ pagesVersesRange , quranReaderStyles , reciterId , lang , wordByWordLocale , pageIndex , setMushafPageToVersesMap , initialData  })=>{
    const pageNumber = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(()=>(0,_utils_page__WEBPACK_IMPORTED_MODULE_7__/* .getPageNumberByPageIndex */ .L8)(pageIndex, pagesVersesRange), [
        pageIndex,
        pagesVersesRange
    ]);
    const initialVerses = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(()=>pageIndex === 0 ? getInitialVerses(pageNumber, initialData.verses) : initialData.verses, [
        initialData.verses,
        pageIndex,
        pageNumber
    ]);
    const isUsingDefaultSettings = (0,_hooks_useIsUsingDefaultSettings__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z)();
    const shouldUseInitialData = pageIndex === 0 && isUsingDefaultSettings;
    const { data: verses , isValidating  } = (0,swr_immutable__WEBPACK_IMPORTED_MODULE_2__["default"])((0,_components_QuranReader_api__WEBPACK_IMPORTED_MODULE_5__/* .getReaderViewRequestKey */ .oA)({
        pageNumber,
        pageVersesRange: getPageVersesRange(pageNumber, pagesVersesRange),
        quranReaderStyles,
        reciter: reciterId,
        locale: lang,
        wordByWordLocale
    }), _components_QuranReader_api__WEBPACK_IMPORTED_MODULE_5__/* .verseFetcher */ .f3, {
        fallbackData: shouldUseInitialData ? initialVerses : null,
        revalidateOnMount: !shouldUseInitialData
    });
    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(()=>{
        if (verses) {
            // @ts-ignore
            setMushafPageToVersesMap((prevMushafPageToVersesMap)=>({
                    ...prevMushafPageToVersesMap,
                    [pageNumber]: verses
                }));
        }
    }, [
        pageNumber,
        setMushafPageToVersesMap,
        verses
    ]);
    if (!verses || isValidating) {
        return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_ReadingViewSkeleton__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {});
    }
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_Page__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
        verses: verses,
        pageNumber: Number(pageNumber),
        quranReaderStyles: quranReaderStyles,
        pageIndex: pageIndex
    }, `page-${pageNumber}`);
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PageContainer);

__webpack_async_result__();
} catch(e) { __webpack_async_result__(e); } });

/***/ }),

/***/ 4535:
/***/ ((module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _PageFooter_module_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(7994);
/* harmony import */ var _PageFooter_module_scss__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_PageFooter_module_scss__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _dls_Link_Link__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(61239);
/* harmony import */ var _utils_locale__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(24709);
/* harmony import */ var _utils_navigation__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(57933);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_utils_navigation__WEBPACK_IMPORTED_MODULE_5__]);
_utils_navigation__WEBPACK_IMPORTED_MODULE_5__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];







const PageFooter = ({ page  })=>{
    const { lang  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_2___default()("quran-reader");
    const pageUrl = (0,_utils_navigation__WEBPACK_IMPORTED_MODULE_5__/* .getPageNavigationUrl */ .GK)(page);
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
        className: (_PageFooter_module_scss__WEBPACK_IMPORTED_MODULE_6___default().pageText),
        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Link_Link__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
            href: pageUrl,
            shouldPassHref: true,
            shouldPrefetch: false,
            children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("p", {
                className: (_PageFooter_module_scss__WEBPACK_IMPORTED_MODULE_6___default().pageLink),
                children: (0,_utils_locale__WEBPACK_IMPORTED_MODULE_4__/* .toLocalizedNumber */ .rQ)(page, lang)
            })
        })
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PageFooter);

__webpack_async_result__();
} catch(e) { __webpack_async_result__(e); } });

/***/ }),

/***/ 60178:
/***/ ((module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _xstate_react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(59456);
/* harmony import */ var _xstate_react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_xstate_react__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(59003);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _PageNavigationButtons_module_scss__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(15426);
/* harmony import */ var _PageNavigationButtons_module_scss__WEBPACK_IMPORTED_MODULE_10___default = /*#__PURE__*/__webpack_require__.n(_PageNavigationButtons_module_scss__WEBPACK_IMPORTED_MODULE_10__);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(50497);
/* harmony import */ var _dls_KeyboardInput__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(55557);
/* harmony import */ var _dls_Tooltip__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(8884);
/* harmony import */ var _icons_chevron_down_svg__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(24868);
/* harmony import */ var src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(64564);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__, _dls_Tooltip__WEBPACK_IMPORTED_MODULE_7__, src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_9__]);
([_dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__, _dls_Tooltip__WEBPACK_IMPORTED_MODULE_7__, src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_9__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);











const PageNavigationButtons = ({ scrollToNextPage , scrollToPreviousPage  })=>{
    const { t  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4___default()("quran-reader");
    const audioService = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_9__/* .AudioPlayerMachineContext */ .c);
    const isAudioPlayerHidden = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_2__.useSelector)(audioService, (state)=>state.matches("HIDDEN"));
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_PageNavigationButtons_module_scss__WEBPACK_IMPORTED_MODULE_10___default().buttonsContainer), {
            [(_PageNavigationButtons_module_scss__WEBPACK_IMPORTED_MODULE_10___default().audioPlayerOpen)]: !isAudioPlayerHidden
        }),
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .ZP, {
                size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__/* .ButtonSize.Small */ .qE.Small,
                className: (_PageNavigationButtons_module_scss__WEBPACK_IMPORTED_MODULE_10___default().prevButton),
                onClick: scrollToPreviousPage,
                shouldFlipOnRTL: false,
                tooltip: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
                    children: [
                        t("prev-page"),
                        " ",
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_KeyboardInput__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                            invertColors: true,
                            keyboardKey: "⬆"
                        })
                    ]
                }),
                tooltipContentSide: _dls_Tooltip__WEBPACK_IMPORTED_MODULE_7__/* .ContentSide.LEFT */ .iw.LEFT,
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_chevron_down_svg__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {})
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .ZP, {
                size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__/* .ButtonSize.Small */ .qE.Small,
                onClick: scrollToNextPage,
                tooltip: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
                    children: [
                        t("next-page"),
                        " ",
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_KeyboardInput__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                            invertColors: true,
                            keyboardKey: "⬇"
                        })
                    ]
                }),
                tooltipContentSide: _dls_Tooltip__WEBPACK_IMPORTED_MODULE_7__/* .ContentSide.LEFT */ .iw.LEFT,
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_chevron_down_svg__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {})
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PageNavigationButtons);

__webpack_async_result__();
} catch(e) { __webpack_async_result__(e); } });

/***/ }),

/***/ 87065:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(59003);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var lodash_range__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(64042);
/* harmony import */ var lodash_range__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(lodash_range__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6022);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _ReadingViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(82877);
/* harmony import */ var _ReadingViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_ReadingViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _components_Verse_VerseText_module_scss__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(29702);
/* harmony import */ var _components_Verse_VerseText_module_scss__WEBPACK_IMPORTED_MODULE_10___default = /*#__PURE__*/__webpack_require__.n(_components_Verse_VerseText_module_scss__WEBPACK_IMPORTED_MODULE_10__);
/* harmony import */ var _dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(77048);
/* harmony import */ var _redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(90264);
/* harmony import */ var _redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(62093);
/* harmony import */ var _utils_fontFaceHelper__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(64198);
/* harmony import */ var _utils_page__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(94007);











const ReadingViewSkeleton = ()=>{
    const { quranFont , quranTextFontScale , mushafLines  } = (0,react_redux__WEBPACK_IMPORTED_MODULE_3__.useSelector)(_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_6__/* .selectQuranReaderStyles */ .Pt, react_redux__WEBPACK_IMPORTED_MODULE_3__.shallowEqual);
    const { showWordByWordTranslation , showWordByWordTransliteration  } = (0,react_redux__WEBPACK_IMPORTED_MODULE_3__.useSelector)(_redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_5__/* .selectInlineDisplayWordByWordPreferences */ .eB, react_redux__WEBPACK_IMPORTED_MODULE_3__.shallowEqual);
    const numberOfLines = (0,_utils_page__WEBPACK_IMPORTED_MODULE_8__/* .getMushafLinesNumber */ .Nl)(quranFont, mushafLines);
    const isWordByWordLayout = showWordByWordTranslation || showWordByWordTransliteration;
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
        className: (_ReadingViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_9___default().skeletonContainer),
        children: lodash_range__WEBPACK_IMPORTED_MODULE_2___default()(numberOfLines).map((i)=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
                className: classnames__WEBPACK_IMPORTED_MODULE_1___default()((_ReadingViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_9___default().skeleton), (_components_Verse_VerseText_module_scss__WEBPACK_IMPORTED_MODULE_10___default())[(0,_utils_fontFaceHelper__WEBPACK_IMPORTED_MODULE_7__/* .getFontClassName */ .bZ)(quranFont, quranTextFontScale, mushafLines)], {
                    [(_ReadingViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_9___default().fixedWidth)]: !isWordByWordLayout
                })
            }, i))
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReadingViewSkeleton);


/***/ }),

/***/ 45211:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var lodash_groupBy__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(98492);
/* harmony import */ var lodash_groupBy__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash_groupBy__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(44519);


/**
 * Groups verses into lines to match the Quran Page (Madani Mushaf) layout
 * The returning value is an object containing the page and line number as a key,
 * and array of word for the value. E.g.
 * {
 *  Page1-Line2: [words],
 *  Page1-Line3: [words]
 *  ...
 * }
 *
 * @returns {Record<string, Word[]}
 */ const groupLinesByVerses = (verses)=>{
    let words = [];
    // Flattens the verses into an array of words
    verses.forEach((verse)=>{
        words = [
            ...words,
            ...(0,_utils_verse__WEBPACK_IMPORTED_MODULE_1__/* .getVerseWords */ .LQ)(verse, true)
        ];
    });
    // Groups the words based on their (page and) line number
    const lines = lodash_groupBy__WEBPACK_IMPORTED_MODULE_0___default()(words, (word)=>`Page${word.pageNumber}-Line${word.lineNumber}`);
    return lines;
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (groupLinesByVerses);


/***/ }),

/***/ 82651:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(16689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var next_router__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(71853);
/* harmony import */ var next_router__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(next_router__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _utils_api__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(4917);
/* harmony import */ var _utils_apiPaths__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(46127);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(44519);
/* harmony import */ var src_api__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(92684);
/* harmony import */ var types_QuranReader__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(50467);
/* harmony import */ var types_ScrollAlign__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(57070);








/**
 * Get where a verse lies in a mushaf page. This is achieved by:
 *
 * 1. Checking where the index of the current verse is within the page.
 * 2. Calculating how far the index is from the beginning of the array of verses of that page.
 * 3. If it lies in the first third portion, then its position is 'start', the second
 *    third of the page, its position is 'center', the last third of the page its position
 *    is 'end'.
 *
 * @param {string} startingVerseKey
 * @param {number} mushafPageNumber
 * @param {Record<number, LookupRecord>} pagesVersesRange
 * @returns {ScrollAlign}
 */ const getVersePositionWithinAMushafPage = (startingVerseKey, mushafPageNumber, pagesVersesRange)=>{
    const pageStartVerseNumber = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_4__/* .getVerseNumberFromKey */ .tR)(pagesVersesRange[mushafPageNumber].from);
    const pageEndVerseNumber = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_4__/* .getVerseNumberFromKey */ .tR)(pagesVersesRange[mushafPageNumber].to);
    const verseOrderWithinPage = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_4__/* .getVerseNumberFromKey */ .tR)(startingVerseKey) - pageStartVerseNumber + 1;
    const totalPageNumberOfVerses = pageEndVerseNumber - pageStartVerseNumber + 1;
    const verseKeyPosition = verseOrderWithinPage * 100 / totalPageNumberOfVerses;
    if (verseKeyPosition <= 33.3) {
        return types_ScrollAlign__WEBPACK_IMPORTED_MODULE_7__/* ["default"].Start */ .Z.Start;
    }
    if (verseKeyPosition <= 66.6) {
        return types_ScrollAlign__WEBPACK_IMPORTED_MODULE_7__/* ["default"].Center */ .Z.Center;
    }
    return types_ScrollAlign__WEBPACK_IMPORTED_MODULE_7__/* ["default"].End */ .Z.End;
};
/**
 * This hook listens to startingVerse query param and navigate to the
 * location where the page of that verse is in the virtualized list if we
 * already have the data of that verse; otherwise, we will call BE to fetch
 * the page number of the verse we want to navigate to.
 *
 * [NOTE]: This is meant to be used by ReadingView only.
 *
 * @param {QuranReaderDataType} quranReaderDataType
 * @param {React.MutableRefObject<VirtuosoHandle>} virtuosoRef
 * @param {VersesResponse} initialData
 * @param {QuranReaderStyles} quranReaderStyles
 * @param {Verse[]} verses
 * @param {Record<number, LookupRecord>} pagesVersesRange
 * @param {boolean} isUsingDefaultFont
 * @param {QuranFont} quranFont
 * @param {MushafLines} mushafLines
 * @param {boolean} isPagesLookupLoading
 */ const useScrollToVirtualizedReadingView = (quranReaderDataType, virtuosoRef, initialData, quranReaderStyles, verses, pagesVersesRange, isUsingDefaultFont, quranFont, mushafLines, isPagesLookupLoading)=>{
    const router = (0,next_router__WEBPACK_IMPORTED_MODULE_1__.useRouter)();
    const { startingVerse , chapterId  } = router.query;
    const shouldScroll = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(true);
    /**
   * We need to scroll again when we have just changed the font since the same
   * verse might lie on another page/position. Same for when we change the
   * verse.
   */ (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(()=>{
        shouldScroll.current = true;
    }, [
        quranFont,
        mushafLines,
        startingVerse
    ]);
    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(// eslint-disable-next-line react-func/max-lines-per-function
    ()=>{
        // if we have the data of the page lookup
        if (!isPagesLookupLoading && virtuosoRef.current && Object.keys(pagesVersesRange).length) {
            // if startingVerse is present in the url
            if (quranReaderDataType === types_QuranReader__WEBPACK_IMPORTED_MODULE_6__/* .QuranReaderDataType.Chapter */ .Qi.Chapter && startingVerse) {
                const startingVerseNumber = Number(startingVerse);
                // if the startingVerse is a valid integer and is above 1
                if (Number.isInteger(startingVerseNumber) && startingVerseNumber > 0) {
                    const firstPageOfCurrentChapter = isUsingDefaultFont ? initialData.verses[0].pageNumber : Number(Object.keys(pagesVersesRange)[0]);
                    // search for the verse number in the already fetched verses first
                    const startFromVerseData = verses.find((verse)=>verse.verseNumber === startingVerseNumber);
                    if (startFromVerseData && shouldScroll.current === true && pagesVersesRange[startFromVerseData.pageNumber]) {
                        const scrollToPageIndex = startFromVerseData.pageNumber - firstPageOfCurrentChapter;
                        virtuosoRef.current.scrollToIndex({
                            index: scrollToPageIndex,
                            align: getVersePositionWithinAMushafPage(`${chapterId}:${startingVerseNumber}`, startFromVerseData.pageNumber, pagesVersesRange)
                        });
                        shouldScroll.current = false;
                    } else {
                        // get the page number by the verse key and the mushafId (because the page will be different for Indopak Mushafs)
                        (0,src_api__WEBPACK_IMPORTED_MODULE_5__/* .fetcher */ ._i)((0,_utils_apiPaths__WEBPACK_IMPORTED_MODULE_3__/* .makeVersesFilterUrl */ .Wq)({
                            filters: `${chapterId}:${startingVerseNumber}`,
                            fields: `page_number`,
                            ...(0,_utils_api__WEBPACK_IMPORTED_MODULE_2__/* .getMushafId */ .$P)(quranReaderStyles.quranFont, quranReaderStyles.mushafLines)
                        })).then((response)=>{
                            if (response.verses.length && shouldScroll.current === true) {
                                const scrollToPageIndex = response.verses[0].pageNumber - firstPageOfCurrentChapter;
                                if (pagesVersesRange[response.verses[0].pageNumber]) {
                                    virtuosoRef.current.scrollToIndex({
                                        index: scrollToPageIndex,
                                        align: getVersePositionWithinAMushafPage(`${chapterId}:${startingVerseNumber}`, response.verses[0].pageNumber, pagesVersesRange)
                                    });
                                    shouldScroll.current = false;
                                }
                            }
                        });
                    }
                }
            }
        }
    }, [
        chapterId,
        initialData.verses,
        isPagesLookupLoading,
        isUsingDefaultFont,
        pagesVersesRange,
        quranReaderDataType,
        quranReaderStyles.mushafLines,
        quranReaderStyles.quranFont,
        startingVerse,
        verses,
        virtuosoRef, 
    ]);
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useScrollToVirtualizedReadingView);


/***/ }),

/***/ 29078:
/***/ ((module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(59003);
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var next_dynamic__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(96954);
/* harmony import */ var next_dynamic__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(next_dynamic__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var react_hotkeys_hook__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(2784);
/* harmony import */ var react_hotkeys_hook__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_hotkeys_hook__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(6022);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var react_virtuoso__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(78404);
/* harmony import */ var react_virtuoso__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(react_virtuoso__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _utils_page__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(95871);
/* harmony import */ var _hooks_useScrollToVirtualizedVerse__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(82651);
/* harmony import */ var _PageContainer__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(92296);
/* harmony import */ var _PageNavigationButtons__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(60178);
/* harmony import */ var _ReadingView_module_scss__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(27374);
/* harmony import */ var _ReadingView_module_scss__WEBPACK_IMPORTED_MODULE_26___default = /*#__PURE__*/__webpack_require__.n(_ReadingView_module_scss__WEBPACK_IMPORTED_MODULE_26__);
/* harmony import */ var _ReadingViewSkeleton__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(87065);
/* harmony import */ var _components_QuranReader_hooks_useFetchPagesLookup__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(24881);
/* harmony import */ var _components_QuranReader_onCopyQuranWords__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(12383);
/* harmony import */ var _components_QuranReader_QueryParamMessage__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(61269);
/* harmony import */ var _dls_Spinner_Spinner__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(7190);
/* harmony import */ var _hooks_useGetQueryParamOrReduxValue__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(80211);
/* harmony import */ var _hooks_useGetQueryParamOrXstateValue__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(93134);
/* harmony import */ var _hooks_useQcfFont__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(38102);
/* harmony import */ var _redux_slices_QuranReader_readingTracker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(16143);
/* harmony import */ var _redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(62093);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(55943);
/* harmony import */ var _utils_fontFaceHelper__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(64198);
/* harmony import */ var src_pages_error__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(36049);
/* harmony import */ var types_QueryParam__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(11721);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_PageContainer__WEBPACK_IMPORTED_MODULE_9__, _PageNavigationButtons__WEBPACK_IMPORTED_MODULE_10__, _components_QuranReader_hooks_useFetchPagesLookup__WEBPACK_IMPORTED_MODULE_12__, _components_QuranReader_onCopyQuranWords__WEBPACK_IMPORTED_MODULE_13__, _components_QuranReader_QueryParamMessage__WEBPACK_IMPORTED_MODULE_14__, _hooks_useGetQueryParamOrXstateValue__WEBPACK_IMPORTED_MODULE_17__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_21__, src_pages_error__WEBPACK_IMPORTED_MODULE_23__]);
([_PageContainer__WEBPACK_IMPORTED_MODULE_9__, _PageNavigationButtons__WEBPACK_IMPORTED_MODULE_10__, _components_QuranReader_hooks_useFetchPagesLookup__WEBPACK_IMPORTED_MODULE_12__, _components_QuranReader_onCopyQuranWords__WEBPACK_IMPORTED_MODULE_13__, _components_QuranReader_QueryParamMessage__WEBPACK_IMPORTED_MODULE_14__, _hooks_useGetQueryParamOrXstateValue__WEBPACK_IMPORTED_MODULE_17__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_21__, src_pages_error__WEBPACK_IMPORTED_MODULE_23__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);
/* eslint-disable max-lines */ /* eslint-disable react-func/max-lines-per-function */ /* eslint-disable react/no-multi-comp */ 


























const EndOfScrollingControls = next_dynamic__WEBPACK_IMPORTED_MODULE_3___default()(null, {
    loadableGenerated: {
        modules: [
            "../components/QuranReader/ReadingView/index.tsx -> " + "@/components/QuranReader/EndOfScrollingControls"
        ]
    },
    ssr: false,
    loading: ()=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Spinner_Spinner__WEBPACK_IMPORTED_MODULE_15__/* ["default"] */ .Z, {})
});
const INCREASE_VIEWPORT_BY_PIXELS = 1200;
const ReadingView = ({ quranReaderStyles , quranReaderDataType , initialData , resourceId  })=>{
    const { 0: mushafPageToVersesMap , 1: setMushafPageToVersesMap  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)({
        [initialData.verses[0].pageNumber]: initialData.verses
    });
    const { lang  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4___default()("quran-reader");
    const isUsingDefaultFont = (0,react_redux__WEBPACK_IMPORTED_MODULE_6__.useSelector)(_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_20__/* .selectIsUsingDefaultFont */ .i9);
    const lastReadPageNumber = (0,react_redux__WEBPACK_IMPORTED_MODULE_6__.useSelector)(_redux_slices_QuranReader_readingTracker__WEBPACK_IMPORTED_MODULE_19__/* .selectedLastReadPage */ .E9, react_redux__WEBPACK_IMPORTED_MODULE_6__.shallowEqual);
    const verses = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(()=>Object.values(mushafPageToVersesMap).flat(), [
        mushafPageToVersesMap
    ]);
    const { value: reciterId , isQueryParamDifferent: reciterQueryParamDifferent ,  } = (0,_hooks_useGetQueryParamOrXstateValue__WEBPACK_IMPORTED_MODULE_17__/* ["default"] */ .Z)(types_QueryParam__WEBPACK_IMPORTED_MODULE_24__/* ["default"].Reciter */ .Z.Reciter);
    const { value: wordByWordLocale , isQueryParamDifferent: wordByWordLocaleQueryParamDifferent ,  } = (0,_hooks_useGetQueryParamOrReduxValue__WEBPACK_IMPORTED_MODULE_16__/* ["default"] */ .Z)(types_QueryParam__WEBPACK_IMPORTED_MODULE_24__/* ["default"].WBW_LOCALE */ .Z.WBW_LOCALE);
    const { quranFont , mushafLines , quranTextFontScale  } = quranReaderStyles;
    (0,_hooks_useQcfFont__WEBPACK_IMPORTED_MODULE_18__/* ["default"] */ .Z)(quranFont, verses);
    const { pagesCount , hasError , pagesVersesRange , isLoading  } = (0,_components_QuranReader_hooks_useFetchPagesLookup__WEBPACK_IMPORTED_MODULE_12__/* ["default"] */ .Z)(resourceId, quranReaderDataType, initialData, quranReaderStyles, isUsingDefaultFont);
    const currentPageIndex = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(()=>(0,_utils_page__WEBPACK_IMPORTED_MODULE_25__/* .getPageIndexByPageNumber */ .u7)(Number(lastReadPageNumber), pagesVersesRange), [
        lastReadPageNumber,
        pagesVersesRange
    ]);
    const virtuosoRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);
    (0,_hooks_useScrollToVirtualizedVerse__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z)(quranReaderDataType, virtuosoRef, initialData, quranReaderStyles, verses, pagesVersesRange, isUsingDefaultFont, quranFont, mushafLines, isLoading);
    const scrollToPreviousPage = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(()=>{
        virtuosoRef.current.scrollToIndex({
            index: currentPageIndex - 1,
            align: "start",
            offset: -35
        });
    }, [
        currentPageIndex
    ]);
    const scrollToNextPage = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(()=>{
        virtuosoRef.current.scrollToIndex({
            index: currentPageIndex + 1,
            align: "start",
            offset: 25
        });
    }, [
        currentPageIndex
    ]);
    const onPrevPageClicked = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(()=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_21__/* .logButtonClick */ .MY)("reading_view_prev_page_button");
        scrollToPreviousPage();
    }, [
        scrollToPreviousPage
    ]);
    const onNextPageClicked = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(()=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_21__/* .logButtonClick */ .MY)("reading_view_next_page_button");
        scrollToNextPage();
    }, [
        scrollToNextPage
    ]);
    const allowKeyboardNavigation = quranTextFontScale <= 5;
    const onUpClicked = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)((event)=>{
        event.preventDefault();
        scrollToPreviousPage();
    }, [
        scrollToPreviousPage
    ]);
    const onDownClicked = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)((event)=>{
        event.preventDefault();
        scrollToNextPage();
    }, [
        scrollToNextPage
    ]);
    (0,react_hotkeys_hook__WEBPACK_IMPORTED_MODULE_5__.useHotkeys)("Up", onUpClicked, {
        enabled: allowKeyboardNavigation
    }, [
        scrollToPreviousPage
    ]);
    (0,react_hotkeys_hook__WEBPACK_IMPORTED_MODULE_5__.useHotkeys)("Down", onDownClicked, {
        enabled: allowKeyboardNavigation
    }, [
        scrollToNextPage
    ]);
    const itemContentRenderer = (pageIndex)=>{
        if (pageIndex === pagesCount) {
            const pageVerses = mushafPageToVersesMap[lastReadPageNumber];
            const lastVerse = pageVerses?.[pageVerses.length - 1];
            if (!lastVerse) return null;
            return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(EndOfScrollingControls, {
                quranReaderDataType: quranReaderDataType,
                lastVerse: lastVerse,
                initialData: initialData
            });
        }
        return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_PageContainer__WEBPACK_IMPORTED_MODULE_9__/* ["default"] */ .Z, {
            pagesVersesRange: pagesVersesRange,
            quranReaderStyles: quranReaderStyles,
            reciterId: reciterId,
            lang: lang,
            wordByWordLocale: wordByWordLocale,
            pageIndex: pageIndex,
            setMushafPageToVersesMap: setMushafPageToVersesMap,
            initialData: initialData
        });
    };
    if (hasError) {
        return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(src_pages_error__WEBPACK_IMPORTED_MODULE_23__["default"], {});
    }
    const shouldShowQueryParamMessage = reciterQueryParamDifferent || wordByWordLocaleQueryParamDifferent;
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
        children: [
            shouldShowQueryParamMessage && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_QuranReader_QueryParamMessage__WEBPACK_IMPORTED_MODULE_14__/* ["default"] */ .Z, {
                translationsQueryParamDifferent: false,
                reciterQueryParamDifferent: reciterQueryParamDifferent,
                wordByWordLocaleQueryParamDifferent: wordByWordLocaleQueryParamDifferent
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                onCopy: (event)=>(0,_components_QuranReader_onCopyQuranWords__WEBPACK_IMPORTED_MODULE_13__/* ["default"] */ .Z)(event, verses, quranFont),
                className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_ReadingView_module_scss__WEBPACK_IMPORTED_MODULE_26___default().container), (_ReadingView_module_scss__WEBPACK_IMPORTED_MODULE_26___default())[(0,_utils_fontFaceHelper__WEBPACK_IMPORTED_MODULE_22__/* .getLineWidthClassName */ .oj)(quranFont, quranTextFontScale, mushafLines)]),
                children: isLoading ? /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                    className: (_ReadingView_module_scss__WEBPACK_IMPORTED_MODULE_26___default().virtuosoScroller),
                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_ReadingViewSkeleton__WEBPACK_IMPORTED_MODULE_11__/* ["default"] */ .Z, {})
                }) : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(react_virtuoso__WEBPACK_IMPORTED_MODULE_7__.Virtuoso, {
                    ref: virtuosoRef,
                    useWindowScroll: true,
                    increaseViewportBy: INCREASE_VIEWPORT_BY_PIXELS,
                    className: (_ReadingView_module_scss__WEBPACK_IMPORTED_MODULE_26___default().virtuosoScroller),
                    initialItemCount: 1,
                    totalCount: pagesCount + 1,
                    itemContent: itemContentRenderer
                })
            }),
            allowKeyboardNavigation && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_PageNavigationButtons__WEBPACK_IMPORTED_MODULE_10__/* ["default"] */ .Z, {
                scrollToNextPage: onNextPageClicked,
                scrollToPreviousPage: onPrevPageClicked
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReadingView);

__webpack_async_result__();
} catch(e) { __webpack_async_result__(e); } });

/***/ }),

/***/ 95871:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "L8": () => (/* binding */ getPageNumberByPageIndex),
/* harmony export */   "u7": () => (/* binding */ getPageIndexByPageNumber)
/* harmony export */ });
/* unused harmony exports getNumberOfPages, verseIndexToApiPageNumber */
/**
 * Get the page number by adding the first page number of the current
 * resource e.g. chapter to the item (page) index from the virtualized list.
 *
 * @param {number} pageIndex
 * @param {Record<number, LookupRecord>} pagesVersesRange
 * @returns {number}
 */ const getPageNumberByPageIndex = (pageIndex, pagesVersesRange)=>Number(Object.keys(pagesVersesRange)[0]) + pageIndex;
/**
 * Get the page index by the page number.
 *
 * @param {number} pageNumber
 * @param {Record<number, LookupRecord>} pagesVersesRange
 * @returns {number}
 */ const getPageIndexByPageNumber = (pageNumber, pagesVersesRange)=>Number(pageNumber) - Number(Object.keys(pagesVersesRange)[0]);
/**
 * Get the number of pages of the current resource e.g. chapter.
 *
 * @param {number} numberOfVerses
 * @param {number} versesPerPage
 * @returns {number}
 */ const getNumberOfPages = (numberOfVerses, versesPerPage)=>Math.ceil(numberOfVerses / versesPerPage);
/**
 * Convert a verse index to a page number by dividing the index
 * by how many items there are in a page.
 *
 * @param {number} verseNumber
 * @param {number} versesPerPage
 * @returns {number}
 */ const verseIndexToApiPageNumber = (verseNumber, versesPerPage)=>Math.floor(verseNumber / versesPerPage) + 1;


/***/ })

};
;
//# sourceMappingURL=29078.js.map