quran/.next/server/chunks/17543.js

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

/***/ 29537:
/***/ ((__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__);
var _path;
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }

var SvgBookOpen = function SvgBookOpen(props) {
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
    xmlns: "http://www.w3.org/2000/svg",
    width: 24,
    height: 24,
    viewBox: "0 0 24 24",
    fill: "none",
    stroke: "currentColor",
    strokeWidth: 2,
    strokeLinecap: "round",
    strokeLinejoin: "round",
    className: "feather feather-book-open"
  }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2zM22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgBookOpen);

/***/ }),

/***/ 85970:
/***/ ((__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__);
var _path;
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }

var SvgCaretDown = function SvgCaretDown(props) {
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
    viewBox: "0 0 24 24",
    width: 18,
    height: 18,
    stroke: "currentColor",
    strokeWidth: 1.5,
    strokeLinecap: "round",
    strokeLinejoin: "round",
    fill: "none",
    shapeRendering: "geometricPrecision",
    style: {
      color: "currentcolor"
    }
  }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "m6 9 6 6 6-6"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgCaretDown);

/***/ }),

/***/ 44356:
/***/ ((__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__);
var _path;
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }

var SvgChat = function SvgChat(props) {
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
    width: 24,
    height: 24,
    viewBox: "0 0 24 24",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.379 8.379 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5Z",
    stroke: "currentColor",
    strokeWidth: 2,
    strokeLinecap: "round",
    strokeLinejoin: "round"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgChat);

/***/ }),

/***/ 80275:
/***/ ((__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__);
var _path;
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }

var SvgMenuMoreHoriz = function SvgMenuMoreHoriz(props) {
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
    width: 24,
    height: 24,
    viewBox: "0 0 24 24",
    fill: "currentColor",
    xmlns: "http://www.w3.org/2000/svg"
  }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "M12 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2ZM19 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2ZM5 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z",
    stroke: "currentColor",
    strokeWidth: 2,
    strokeLinecap: "round",
    strokeLinejoin: "round"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgMenuMoreHoriz);

/***/ }),

/***/ 49039:
/***/ ((__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__);
var _path;
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }

var SvgMinus = function SvgMinus(props) {
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
    width: 15,
    height: 15,
    viewBox: "0 0 15 15",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "M2.25 7.5a.5.5 0 0 1 .5-.5h9.5a.5.5 0 0 1 0 1h-9.5a.5.5 0 0 1-.5-.5Z",
    fill: "currentColor",
    fillRule: "evenodd",
    clipRule: "evenodd"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgMinus);

/***/ }),

/***/ 68973:
/***/ ((__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__);
var _path;
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }

var SvgPlayOutline = function SvgPlayOutline(props) {
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
    width: 24,
    height: 24,
    viewBox: "0 0 24 24",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "m5 3 14 9-14 9V3Z",
    stroke: "currentColor",
    strokeWidth: 2,
    strokeLinecap: "round",
    strokeLinejoin: "round"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgPlayOutline);

/***/ }),

/***/ 4474:
/***/ ((__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__);
var _path;
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }

var SvgPlus = function SvgPlus(props) {
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
    width: 15,
    height: 15,
    viewBox: "0 0 15 15",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "M8 2.75a.5.5 0 0 0-1 0V7H2.75a.5.5 0 0 0 0 1H7v4.25a.5.5 0 0 0 1 0V8h4.25a.5.5 0 0 0 0-1H8V2.75Z",
    fill: "currentColor",
    fillRule: "evenodd",
    clipRule: "evenodd"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgPlus);

/***/ }),

/***/ 14133:
/***/ ((__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__);
var _path, _path2, _path3, _path4;
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }

var SvgTranslation = function SvgTranslation(props) {
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
    width: 21,
    height: 21,
    viewBox: "0 0 21 21",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    clipRule: "evenodd",
    d: "M20 10.499V3.374A2.375 2.375 0 0 0 17.625.999H10.5a2.375 2.375 0 0 0-2.375 2.375v7.125a2.375 2.375 0 0 0 2.375 2.375h7.125A2.375 2.375 0 0 0 20 10.499Z",
    stroke: "currentColor",
    strokeWidth: 1.188,
    strokeLinecap: "round",
    strokeLinejoin: "round"
  })), _path2 || (_path2 = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "M6.938 12.878H3.374m2.375-4.75H3.375A2.375 2.375 0 0 0 1 10.503v7.125a2.375 2.375 0 0 0 2.375 2.375h.004l7.125-.012a2.375 2.375 0 0 0 2.371-2.375V15.25L5.75 8.128Z",
    stroke: "currentColor",
    strokeWidth: 1.188,
    strokeLinecap: "round",
    strokeLinejoin: "round"
  })), _path3 || (_path3 = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "M8.719 14.655 7.53 15.843c-.396.395-1.384.989-2.968 1.781",
    stroke: "currentColor",
    strokeWidth: 1.188,
    strokeLinecap: "round",
    strokeLinejoin: "round"
  })), _path4 || (_path4 = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "M16.438 8.124h-4.75m-7.126 4.754c.397 1.384.99 2.375 1.782 2.967.79.593 1.781 1.185 2.968 1.779l-4.75-4.746Zm9.5-9.504L10.5 10.499l3.563-7.125Zm0 0 3.563 7.125-3.563-7.125Z",
    stroke: "currentColor",
    strokeWidth: 1.188,
    strokeLinecap: "round",
    strokeLinejoin: "round"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgTranslation);

/***/ }),

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

// Exports
module.exports = {
	"header": "TranslationsButton_header__j_OPB",
	"iconContainer": "TranslationsButton_iconContainer__pukLN",
	"verseAction": "TranslationsButton_verseAction__JoZly",
	"icon": "TranslationsButton_icon__eqexD"
};


/***/ }),

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

// Exports
module.exports = {
	"separatorContainer": "TranslationsView_separatorContainer__oM4LZ",
	"arabicVerseContainer": "TranslationsView_arabicVerseContainer__VriiJ",
	"verseTranslationContainer": "TranslationsView_verseTranslationContainer__kDX0e"
};


/***/ }),

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

// Exports
module.exports = {
	"readingViewOverflowVerseActionsMenu": "WordActionsMenu_readingViewOverflowVerseActionsMenu__hYXeV",
	"container": "WordActionsMenu_container__fBtQg"
};


/***/ }),

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

// Exports
module.exports = {
	"content": "WordPopover_content__Qf_Ne",
	"trigger": "WordPopover_trigger__aNSSt"
};


/***/ }),

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

// Exports
module.exports = {
	"container": "TafsirEndOfScrollingActions_container__tcWLj"
};


/***/ }),

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

// Exports
module.exports = {
	"tafsirMessage": "TafsirMessage_tafsirMessage__Gr_S9"
};


/***/ }),

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

// Exports
module.exports = {
	"counter": "TafsirText_counter__xlNaF",
	"xs": "TafsirText_xs__P5Qjv",
	"sm": "TafsirText_sm__BbfQ0",
	"md": "TafsirText_md__mJWtv",
	"lg": "TafsirText_lg__t_oGB",
	"xl": "TafsirText_xl__3hmwr"
};


/***/ }),

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

// Exports
module.exports = {
	"container": "TafsirView_container__R9G7I",
	"tafsirName": "TafsirView_tafsirName__QPOiO",
	"tafsirContainer": "TafsirView_tafsirContainer__g2rhW",
	"rtl": "TafsirView_rtl__8pRLP",
	"surahAndAyahSelectionContainer": "TafsirView_surahAndAyahSelectionContainer__W96nf",
	"tafsirSelectionContainer": "TafsirView_tafsirSelectionContainer__QSkE3",
	"tafsirSelectionItem": "TafsirView_tafsirSelectionItem__GTJvw",
	"tafsirItemSelected": "TafsirView_tafsirItemSelected__SXceL",
	"separatorContainer": "TafsirView_separatorContainer__diS8n",
	"verseTextContainer": "TafsirView_verseTextContainer__A7tZ_",
	"selectionItem": "TafsirView_selectionItem__FJdhi",
	"ayahSelection": "TafsirView_ayahSelection__jWULb",
	"tafsirSkeletonItem": "TafsirView_tafsirSkeletonItem__q5sNk",
	"ayahSekletonItem": "TafsirView_ayahSekletonItem__B_nJN",
	"tafsirSkeletonItem1": "TafsirView_tafsirSkeletonItem1__nLGRk",
	"tafsirSkeletonItem2": "TafsirView_tafsirSkeletonItem2__aaEJy",
	"tafsirSkeletonItem3": "TafsirView_tafsirSkeletonItem3__NqYKV",
	"tafsirSelectionSkeleton": "TafsirView_tafsirSelectionSkeleton__3oq7k",
	"languageSelection": "TafsirView_languageSelection__8EFqZ",
	"tafsir-font-size-1": "TafsirView_tafsir-font-size-1__sLRnq",
	"tafsir-font-size-2": "TafsirView_tafsir-font-size-2__JLiR2",
	"tafsir-font-size-3": "TafsirView_tafsir-font-size-3__K0LBa",
	"tafsir-font-size-4": "TafsirView_tafsir-font-size-4__KrD1k",
	"tafsir-font-size-5": "TafsirView_tafsir-font-size-5__ri_Mr",
	"tafsir-font-size-6": "TafsirView_tafsir-font-size-6__FvBko",
	"tafsir-font-size-7": "TafsirView_tafsir-font-size-7__oS0XU",
	"tafsir-font-size-8": "TafsirView_tafsir-font-size-8__1U_43",
	"tafsir-font-size-9": "TafsirView_tafsir-font-size-9__6VJC2",
	"tafsir-font-size-10": "TafsirView_tafsir-font-size-10__zRYWI"
};


/***/ }),

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

// Exports
module.exports = {
	"footnoteContainer": "FootnoteText_footnoteContainer__2GrJa",
	"text": "FootnoteText_text__o_c03",
	"header": "FootnoteText_header__M_Q2C"
};


/***/ }),

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

// Exports
module.exports = {
	"text": "TranslationText_text__4atf8",
	"translation-font-size-1": "TranslationText_translation-font-size-1__TqSPj",
	"translation-font-size-2": "TranslationText_translation-font-size-2__AW2i1",
	"translation-font-size-3": "TranslationText_translation-font-size-3__ww3t4",
	"translation-font-size-4": "TranslationText_translation-font-size-4__TKdKv",
	"translation-font-size-5": "TranslationText_translation-font-size-5__5bjGX",
	"translation-font-size-6": "TranslationText_translation-font-size-6__6SMJi",
	"translation-font-size-7": "TranslationText_translation-font-size-7__03ez5",
	"translation-font-size-8": "TranslationText_translation-font-size-8__IA0Tr",
	"translation-font-size-9": "TranslationText_translation-font-size-9__tq3IG",
	"translation-font-size-10": "TranslationText_translation-font-size-10__A9YEa",
	"ltr": "TranslationText_ltr__146rZ",
	"rtl": "TranslationText_rtl__ytrpw",
	"urdu": "TranslationText_urdu__9N37Y",
	"kurdish": "TranslationText_kurdish__je0yf",
	"divehi": "TranslationText_divehi__e3rqQ",
	"translationName": "TranslationText_translationName__Vm9Sj"
};


/***/ }),

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

// Exports
module.exports = {
	"cellContainer": "TranslationViewCell_cellContainer__rhs1_",
	"highlightedContainer": "TranslationViewCell_highlightedContainer__iR1i_",
	"contentContainer": "TranslationViewCell_contentContainer__MzrKa",
	"actionContainer": "TranslationViewCell_actionContainer__HsBR4",
	"arabicVerseContainer": "TranslationViewCell_arabicVerseContainer__1PutS",
	"verseTranslationsContainer": "TranslationViewCell_verseTranslationsContainer__TrT0u",
	"verseTranslationContainer": "TranslationViewCell_verseTranslationContainer__FzCJX",
	"actionContainerLeft": "TranslationViewCell_actionContainerLeft__W_dFh",
	"actionContainerRight": "TranslationViewCell_actionContainerRight__PYURw",
	"iconContainer": "TranslationViewCell_iconContainer__7hDOA",
	"verseAction": "TranslationViewCell_verseAction__oJZAI",
	"fadedVerseAction": "TranslationViewCell_fadedVerseAction__5D_Z9",
	"icon": "TranslationViewCell_icon__x_dPx",
	"playIcon": "TranslationViewCell_playIcon__ON4ZG",
	"priorityAction": "TranslationViewCell_priorityAction__YBhF5",
	"actionItem": "TranslationViewCell_actionItem__joebg"
};


/***/ }),

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

// Exports
module.exports = {
	"cellContainer": "TranslationViewSkeleton_cellContainer__sBy6V",
	"verseContainer": "TranslationViewSkeleton_verseContainer__VxNMX",
	"translationText": "TranslationViewSkeleton_translationText__x_kjw",
	"translationAuthor": "TranslationViewSkeleton_translationAuthor__xU1HK",
	"actionItem": "TranslationViewSkeleton_actionItem__QsY3x",
	"translation-font-size-1": "TranslationViewSkeleton_translation-font-size-1__kGXZP",
	"translation-font-size-2": "TranslationViewSkeleton_translation-font-size-2__LnbhT",
	"translation-font-size-3": "TranslationViewSkeleton_translation-font-size-3__1GsaL",
	"translation-font-size-4": "TranslationViewSkeleton_translation-font-size-4__87NbS",
	"translation-font-size-5": "TranslationViewSkeleton_translation-font-size-5__eMUdE",
	"translation-font-size-6": "TranslationViewSkeleton_translation-font-size-6__lNNK7",
	"translation-font-size-7": "TranslationViewSkeleton_translation-font-size-7__It5hp",
	"translation-font-size-8": "TranslationViewSkeleton_translation-font-size-8___c0mR",
	"translation-font-size-9": "TranslationViewSkeleton_translation-font-size-9__AYCn0",
	"translation-font-size-10": "TranslationViewSkeleton_translation-font-size-10__WpttO"
};


/***/ }),

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

// Exports
module.exports = {
	"container": "OverflowVerseActionsMenuBody_container__MmTNa"
};


/***/ }),

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

// Exports
module.exports = {
	"modalContainer": "ContentModal_modalContainer__i7bo0",
	"contentContainer": "ContentModal_contentContainer___ciX5",
	"overlay": "ContentModal_overlay__qZfQY",
	"contentWrapper": "ContentModal_contentWrapper__VaiRB",
	"autoHeight": "ContentModal_autoHeight__A3IW7",
	"medium": "ContentModal_medium__EKB5h",
	"small": "ContentModal_small__YBKtM",
	"fadeIn": "ContentModal_fadeIn__JGh_A",
	"fadeOut": "ContentModal_fadeOut__36m_B",
	"contentIn": "ContentModal_contentIn__EAwQw",
	"contentOut": "ContentModal_contentOut__2x8WN",
	"closeIcon": "ContentModal_closeIcon__xppin",
	"header": "ContentModal_header__384F2",
	"content": "ContentModal_content__9M2Iy"
};


/***/ }),

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

// Exports
module.exports = {
	"container": "Counter_container__WfR1A",
	"count": "Counter_count__Q6LdA"
};


/***/ }),

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

// Exports
module.exports = {
	"container": "Select_container___DCC_",
	"withBackground": "Select_withBackground__rpdEL",
	"defaultStyledContainer": "Select_defaultStyledContainer__b32Mm",
	"smallContainer": "Select_smallContainer__L2Lff",
	"mediumContainer": "Select_mediumContainer__MF_Vq",
	"largeContainer": "Select_largeContainer___qGs0",
	"disabledContainer": "Select_disabledContainer__gi7YD",
	"arrow": "Select_arrow__WAbAk",
	"disabledArrow": "Select_disabledArrow__V4nEO",
	"select": "Select_select__BnH2G",
	"defaultStyledSelect": "Select_defaultStyledSelect__LmeKj",
	"disabledSelect": "Select_disabledSelect___R3Jd"
};


/***/ }),

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

// Exports
module.exports = {
	"container": "Popover_container__GOha0",
	"trigger": "Popover_trigger__qKXNN",
	"content": "Popover_content__gu5L4",
	"tooltipContent": "Popover_tooltipContent__AMPpT"
};


/***/ }),

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

// Exports
module.exports = {
	"container": "QuranWord_container__lmBE_",
	"additionalWordGap": "QuranWord_additionalWordGap__wEsc5",
	"tajweedWord": "QuranWord_tajweedWord__gTxER",
	"highlighted": "QuranWord_highlighted__YfsNt",
	"secondaryHighlight": "QuranWord_secondaryHighlight__rOvv4",
	"wbwContainer": "QuranWord_wbwContainer__REUuI",
	"highlightOnHover": "QuranWord_highlightOnHover__l3KmK",
	"tooltipText": "QuranWord_tooltipText___d04R",
	"popoverTrigger": "QuranWord_popoverTrigger__fGtvj"
};


/***/ }),

/***/ 87920:
/***/ ((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 next_router__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(71853);
/* harmony import */ var next_router__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(next_router__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 _components_dls_ContentModal_ContentModal__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(66606);
/* harmony import */ var _components_QuranReader_ReflectionView_ReflectionBodyContainer__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(86325);
/* harmony import */ var _components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(40608);
/* harmony import */ var _components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_12___default = /*#__PURE__*/__webpack_require__.n(_components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_12__);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(50497);
/* harmony import */ var _icons_chat_svg__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(44356);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(55943);
/* harmony import */ var _utils_navigation__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(57933);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(44519);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_components_dls_ContentModal_ContentModal__WEBPACK_IMPORTED_MODULE_5__, _components_QuranReader_ReflectionView_ReflectionBodyContainer__WEBPACK_IMPORTED_MODULE_6__, _dls_Button_Button__WEBPACK_IMPORTED_MODULE_7__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_9__, _utils_navigation__WEBPACK_IMPORTED_MODULE_10__]);
([_components_dls_ContentModal_ContentModal__WEBPACK_IMPORTED_MODULE_5__, _components_QuranReader_ReflectionView_ReflectionBodyContainer__WEBPACK_IMPORTED_MODULE_6__, _dls_Button_Button__WEBPACK_IMPORTED_MODULE_7__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_9__, _utils_navigation__WEBPACK_IMPORTED_MODULE_10__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);













const QuranReflectButton = ({ verseKey , isTranslationView =true , onActionTriggered  })=>{
    const { t , lang  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4___default()("common");
    const router = (0,next_router__WEBPACK_IMPORTED_MODULE_3__.useRouter)();
    const { 0: isContentModalOpen , 1: setIsContentModalOpen  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const onButtonClicked = ()=>{
        // eslint-disable-next-line i18next/no-literal-string
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_9__/* .logButtonClick */ .MY)(`${isTranslationView ? "translation_view" : "reading_view"}_reflect`);
        setIsContentModalOpen(true);
        (0,_utils_navigation__WEBPACK_IMPORTED_MODULE_10__/* .fakeNavigate */ ._V)((0,_utils_navigation__WEBPACK_IMPORTED_MODULE_10__/* .getVerseReflectionNavigationUrl */ .HT)(verseKey), lang);
    };
    const contentModalRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);
    const onModalClose = ()=>{
        setIsContentModalOpen(false);
        (0,_utils_navigation__WEBPACK_IMPORTED_MODULE_10__/* .fakeNavigate */ ._V)(router.asPath, lang);
        if (onActionTriggered) {
            onActionTriggered();
        }
    };
    const [initialChapterId, verseNumber] = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_11__/* .getVerseAndChapterNumbersFromKey */ .bV)(verseKey);
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .ZP, {
                variant: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_7__/* .ButtonVariant.Ghost */ .Wu.Ghost,
                onClick: onButtonClicked,
                size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_7__/* .ButtonSize.Small */ .qE.Small,
                tooltip: t("reflections"),
                shouldFlipOnRTL: false,
                shape: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_7__/* .ButtonShape.Circle */ .jL.Circle,
                className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_12___default().iconContainer), (_components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_12___default().verseAction), {
                    [(_components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_12___default().fadedVerseAction)]: isTranslationView
                }, "reflection-verse-button"),
                ariaLabel: t("quran-reader:aria.read-ayah-refls"),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
                    className: (_components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_12___default().icon),
                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_chat_svg__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {})
                })
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_QuranReader_ReflectionView_ReflectionBodyContainer__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                initialChapterId: initialChapterId,
                initialVerseNumber: verseNumber,
                scrollToTop: ()=>{
                    contentModalRef.current.scrollToTop();
                },
                render: ({ surahAndAyahSelection , body  })=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_dls_ContentModal_ContentModal__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                        innerRef: contentModalRef,
                        isOpen: isContentModalOpen,
                        hasCloseButton: true,
                        onClose: onModalClose,
                        onEscapeKeyDown: onModalClose,
                        header: surahAndAyahSelection,
                        children: body
                    })
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (QuranReflectButton);

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

/***/ }),

/***/ 96886:
/***/ ((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 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_redux__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(6022);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _TranslationsButton_module_scss__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(92337);
/* harmony import */ var _TranslationsButton_module_scss__WEBPACK_IMPORTED_MODULE_16___default = /*#__PURE__*/__webpack_require__.n(_TranslationsButton_module_scss__WEBPACK_IMPORTED_MODULE_16__);
/* harmony import */ var _components_DataFetcher__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(12951);
/* harmony import */ var _components_QuranReader_ReadingView_TranslationsView__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(45951);
/* harmony import */ var _components_QuranReader_TranslationView_TranslationViewCellSkeleton__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(80587);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(50497);
/* harmony import */ var _icons_translation_svg__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(14133);
/* harmony import */ var _redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(62093);
/* harmony import */ var _redux_slices_QuranReader_translations__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(88548);
/* harmony import */ var _utils_api__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(4917);
/* harmony import */ var _utils_apiPaths__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(46127);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(55943);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_components_DataFetcher__WEBPACK_IMPORTED_MODULE_6__, _components_QuranReader_ReadingView_TranslationsView__WEBPACK_IMPORTED_MODULE_7__, _components_QuranReader_TranslationView_TranslationViewCellSkeleton__WEBPACK_IMPORTED_MODULE_8__, _dls_Button_Button__WEBPACK_IMPORTED_MODULE_9__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_15__]);
([_components_DataFetcher__WEBPACK_IMPORTED_MODULE_6__, _components_QuranReader_ReadingView_TranslationsView__WEBPACK_IMPORTED_MODULE_7__, _components_QuranReader_TranslationView_TranslationViewCellSkeleton__WEBPACK_IMPORTED_MODULE_8__, _dls_Button_Button__WEBPACK_IMPORTED_MODULE_9__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_15__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);

















const ContentModal = next_dynamic__WEBPACK_IMPORTED_MODULE_3___default()(null, {
    loadableGenerated: {
        modules: [
            "../components/QuranReader/ReadingView/TranslationsButton/index.tsx -> " + "@/dls/ContentModal/ContentModal"
        ]
    },
    ssr: false
});
const CLOSE_POPOVER_AFTER_MS = 200;
const TranslationsButton = ({ verse , onActionTriggered  })=>{
    const { 0: isContentModalOpen , 1: setIsContentModalOpen  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const { t  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4___default()("common");
    const selectedTranslations = (0,react_redux__WEBPACK_IMPORTED_MODULE_5__.useSelector)(_redux_slices_QuranReader_translations__WEBPACK_IMPORTED_MODULE_12__/* .selectSelectedTranslations */ .qw);
    const quranReaderStyles = (0,react_redux__WEBPACK_IMPORTED_MODULE_5__.useSelector)(_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_11__/* .selectQuranReaderStyles */ .Pt);
    const contentModalRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)();
    const translationsQueryKey = (0,_utils_apiPaths__WEBPACK_IMPORTED_MODULE_14__/* .makeByVerseKeyUrl */ .v2)(`${verse.chapterId}:${verse.verseNumber}`, {
        words: true,
        translationFields: "resource_name,language_id",
        translations: selectedTranslations.join(","),
        ...(0,_utils_api__WEBPACK_IMPORTED_MODULE_13__/* .getDefaultWordFields */ .hD)(quranReaderStyles.quranFont),
        ...(0,_utils_api__WEBPACK_IMPORTED_MODULE_13__/* .getMushafId */ .$P)(quranReaderStyles.quranFont, quranReaderStyles.mushafLines)
    });
    const renderTranslationsView = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)((data)=>{
        if (!data) return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_QuranReader_TranslationView_TranslationViewCellSkeleton__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {
            hasActionMenuItems: false
        });
        const { verse: responseVerse  } = data;
        return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_QuranReader_ReadingView_TranslationsView__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .Z, {
            verse: responseVerse,
            quranReaderStyles: quranReaderStyles
        });
    }, [
        quranReaderStyles
    ]);
    const onButtonClicked = ()=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_15__/* .logButtonClick */ .MY)(// eslint-disable-next-line i18next/no-literal-string
        `reading_view_translations_modal_open`);
        setIsContentModalOpen(true);
    };
    const onModalClosed = ()=>{
        // eslint-disable-next-line i18next/no-literal-string
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_15__/* .logEvent */ .Kz)(`reading_view_translations_modal_close`);
        setIsContentModalOpen(false);
        setTimeout(()=>{
            // we set a really short timeout to close the popover after the modal has been closed to allow enough time for the fadeout css effect to apply.
            onActionTriggered();
        }, CLOSE_POPOVER_AFTER_MS);
    };
    const loading = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(()=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_QuranReader_TranslationView_TranslationViewCellSkeleton__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {
            hasActionMenuItems: false
        }), []);
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_9__/* ["default"] */ .ZP, {
                onClick: onButtonClicked,
                variant: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_9__/* .ButtonVariant.Ghost */ .Wu.Ghost,
                size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_9__/* .ButtonSize.Small */ .qE.Small,
                tooltip: t("translations"),
                shouldFlipOnRTL: false,
                shape: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_9__/* .ButtonShape.Circle */ .jL.Circle,
                className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_TranslationsButton_module_scss__WEBPACK_IMPORTED_MODULE_16___default().iconContainer), (_TranslationsButton_module_scss__WEBPACK_IMPORTED_MODULE_16___default().verseAction)),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
                    className: (_TranslationsButton_module_scss__WEBPACK_IMPORTED_MODULE_16___default().icon),
                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_translation_svg__WEBPACK_IMPORTED_MODULE_10__/* ["default"] */ .Z, {})
                })
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(ContentModal, {
                innerRef: contentModalRef,
                isOpen: isContentModalOpen,
                header: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("p", {
                    className: (_TranslationsButton_module_scss__WEBPACK_IMPORTED_MODULE_16___default().header),
                    children: t("translations")
                }),
                hasCloseButton: true,
                onClose: onModalClosed,
                onEscapeKeyDown: onModalClosed,
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_DataFetcher__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                    loading: loading,
                    queryKey: translationsQueryKey,
                    render: renderTranslationsView
                })
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TranslationsButton);

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

/***/ }),

/***/ 45951:
/***/ ((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 _TranslationsView_module_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(29367);
/* harmony import */ var _TranslationsView_module_scss__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_TranslationsView_module_scss__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _components_QuranReader_TranslationView_TranslationText__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(18809);
/* harmony import */ var _components_Verse_PlainVerseText__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(21044);
/* harmony import */ var _dls_Separator_Separator__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(94400);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(44519);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_components_QuranReader_TranslationView_TranslationText__WEBPACK_IMPORTED_MODULE_2__, _dls_Separator_Separator__WEBPACK_IMPORTED_MODULE_4__]);
([_components_QuranReader_TranslationView_TranslationText__WEBPACK_IMPORTED_MODULE_2__, _dls_Separator_Separator__WEBPACK_IMPORTED_MODULE_4__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);







const TranslationsView = ({ verse , quranReaderStyles  })=>{
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                className: (_TranslationsView_module_scss__WEBPACK_IMPORTED_MODULE_6___default().arabicVerseContainer),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_Verse_PlainVerseText__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
                    words: (0,_utils_verse__WEBPACK_IMPORTED_MODULE_5__/* .getVerseWords */ .LQ)(verse)
                })
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                className: (_TranslationsView_module_scss__WEBPACK_IMPORTED_MODULE_6___default().separatorContainer),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Separator_Separator__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {})
            }),
            verse.translations?.map((translation)=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                    className: (_TranslationsView_module_scss__WEBPACK_IMPORTED_MODULE_6___default().verseTranslationContainer),
                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_QuranReader_TranslationView_TranslationText__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .Z, {
                        translationFontScale: quranReaderStyles.translationFontScale,
                        text: translation.text,
                        languageId: translation.languageId,
                        resourceName: translation.resourceName
                    })
                }, translation.id))
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TranslationsView);

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

/***/ }),

/***/ 28472:
/***/ ((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 _QuranReflectButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(87920);
/* harmony import */ var _WordActionsMenu_module_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(6222);
/* harmony import */ var _WordActionsMenu_module_scss__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_WordActionsMenu_module_scss__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _components_QuranReader_ReadingView_TranslationsButton__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(96886);
/* harmony import */ var _components_QuranReader_TafsirButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(5369);
/* harmony import */ var _components_Verse_OverflowVerseActionsMenu__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(35527);
/* harmony import */ var _components_Verse_PlayVerseAudioButton__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(70256);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_QuranReflectButton__WEBPACK_IMPORTED_MODULE_2__, _components_QuranReader_ReadingView_TranslationsButton__WEBPACK_IMPORTED_MODULE_3__, _components_QuranReader_TafsirButton__WEBPACK_IMPORTED_MODULE_4__, _components_Verse_OverflowVerseActionsMenu__WEBPACK_IMPORTED_MODULE_5__, _components_Verse_PlayVerseAudioButton__WEBPACK_IMPORTED_MODULE_6__]);
([_QuranReflectButton__WEBPACK_IMPORTED_MODULE_2__, _components_QuranReader_ReadingView_TranslationsButton__WEBPACK_IMPORTED_MODULE_3__, _components_QuranReader_TafsirButton__WEBPACK_IMPORTED_MODULE_4__, _components_Verse_OverflowVerseActionsMenu__WEBPACK_IMPORTED_MODULE_5__, _components_Verse_PlayVerseAudioButton__WEBPACK_IMPORTED_MODULE_6__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);








const ReadingViewWordActionsMenu = ({ word , onActionTriggered  })=>{
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: (_WordActionsMenu_module_scss__WEBPACK_IMPORTED_MODULE_7___default().container),
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_QuranReader_TafsirButton__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
                verseKey: word.verseKey,
                isTranslationView: false,
                onActionTriggered: onActionTriggered
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_QuranReflectButton__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .Z, {
                verseKey: word.verseKey,
                isTranslationView: false,
                onActionTriggered: onActionTriggered
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_QuranReader_ReadingView_TranslationsButton__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
                verse: word.verse,
                onActionTriggered: onActionTriggered
            }),
            word?.verse?.timestamps && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_Verse_PlayVerseAudioButton__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                verseKey: word.verseKey,
                isTranslationView: false,
                onActionTriggered: onActionTriggered
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                className: (_WordActionsMenu_module_scss__WEBPACK_IMPORTED_MODULE_7___default().readingViewOverflowVerseActionsMenu),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_Verse_OverflowVerseActionsMenu__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                    isTranslationView: false,
                    verse: word.verse,
                    onActionTriggered: onActionTriggered
                })
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReadingViewWordActionsMenu);

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

/***/ }),

/***/ 90127:
/***/ ((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 react_redux__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(6022);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _WordActionsMenu__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(28472);
/* harmony import */ var _WordPopover_module_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(41921);
/* harmony import */ var _WordPopover_module_scss__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_WordPopover_module_scss__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _dls_Popover__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(25914);
/* harmony import */ var _redux_slices_QuranReader_readingViewVerse__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(31922);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(55943);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_WordActionsMenu__WEBPACK_IMPORTED_MODULE_3__, _dls_Popover__WEBPACK_IMPORTED_MODULE_4__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_6__]);
([_WordActionsMenu__WEBPACK_IMPORTED_MODULE_3__, _dls_Popover__WEBPACK_IMPORTED_MODULE_4__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_6__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);








const ReadingViewWordPopover = ({ word , children  })=>{
    const { 0: isTooltipOpened , 1: setIsTooltipOpened  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const dispatch = (0,react_redux__WEBPACK_IMPORTED_MODULE_2__.useDispatch)();
    const onOpenChange = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)((isOpen)=>{
        setIsTooltipOpened(isOpen);
        // eslint-disable-next-line i18next/no-literal-string
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_6__/* .logEvent */ .Kz)(`reading_view_overflow_menu_${isOpen ? "open" : "close"}`);
        dispatch((0,_redux_slices_QuranReader_readingViewVerse__WEBPACK_IMPORTED_MODULE_5__/* .setReadingViewSelectedVerseKey */ .E9)(isOpen ? word.verseKey : null));
    }, [
        dispatch,
        word.verseKey
    ]);
    const onHoverChange = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)((isHovering)=>{
        dispatch((0,_redux_slices_QuranReader_readingViewVerse__WEBPACK_IMPORTED_MODULE_5__/* .setReadingViewHoveredVerseKey */ .Ob)(isHovering ? word.verseKey : null));
    }, [
        dispatch,
        word.verseKey
    ]);
    const onActionTriggered = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(()=>{
        onOpenChange(false);
    }, [
        onOpenChange
    ]);
    const onMouseEnter = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(()=>{
        onHoverChange(true);
    }, [
        onHoverChange
    ]);
    const onMouseLeave = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(()=>{
        onHoverChange(false);
    }, [
        onHoverChange
    ]);
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Popover__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .ZP, {
        contentSide: _dls_Popover__WEBPACK_IMPORTED_MODULE_4__/* .ContentSide.TOP */ .iw.TOP,
        contentSideOffset: -10,
        trigger: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
            onMouseEnter: onMouseEnter,
            onMouseLeave: onMouseLeave,
            children: children
        }),
        tip: true,
        isModal: true,
        open: isTooltipOpened,
        onOpenChange: onOpenChange,
        triggerStyles: (_WordPopover_module_scss__WEBPACK_IMPORTED_MODULE_7___default().trigger),
        contentStyles: (_WordPopover_module_scss__WEBPACK_IMPORTED_MODULE_7___default().content),
        defaultStyling: false,
        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_WordActionsMenu__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
            word: word,
            onActionTriggered: onActionTriggered
        })
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReadingViewWordPopover);

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

/***/ }),

/***/ 86325:
/***/ ((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_dynamic__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(96954);
/* harmony import */ var next_dynamic__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(next_dynamic__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _components_DataFetcher__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(12951);
/* harmony import */ var _components_QuranReader_observer__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(94082);
/* harmony import */ var _components_QuranReader_TafsirView_TafsirSkeleton__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(1627);
/* harmony import */ var _hooks_useGlobalIntersectionObserverWithDelay__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(91398);
/* harmony import */ var _utils_auth_login__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(22197);
/* harmony import */ var _utils_auth_qf_api__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(91450);
/* harmony import */ var _utils_quranReflect_apiPaths__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(36342);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_components_DataFetcher__WEBPACK_IMPORTED_MODULE_4__, _utils_auth_login__WEBPACK_IMPORTED_MODULE_7__]);
([_components_DataFetcher__WEBPACK_IMPORTED_MODULE_4__, _utils_auth_login__WEBPACK_IMPORTED_MODULE_7__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);











const ReflectionSurahAndAyahSelection = next_dynamic__WEBPACK_IMPORTED_MODULE_2___default()(null, {
    loadableGenerated: {
        modules: [
            "../components/QuranReader/ReflectionView/ReflectionBodyContainer/index.tsx -> " + "./ReflectionSurahAndAyahSelection"
        ]
    },
    ssr: false
});
const ReflectionBody = next_dynamic__WEBPACK_IMPORTED_MODULE_2___default()(null, {
    loadableGenerated: {
        modules: [
            "../components/QuranReader/ReflectionView/ReflectionBodyContainer/index.tsx -> " + "./ReflectionBody"
        ]
    },
    ssr: false,
    loading: _components_QuranReader_TafsirView_TafsirSkeleton__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z
});
const ReflectionBodyContainer = ({ render , initialChapterId , initialVerseNumber , scrollToTop  })=>{
    const { 0: selectedChapterId , 1: setSelectedChapterId  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(initialChapterId);
    const { 0: selectedVerseNumber , 1: setSelectedVerseNumber  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(initialVerseNumber);
    const { lang  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default()();
    /**
   * Handle when the reflection is viewed:
   *
   * 1. If the user is logged in, we will call QDC's backend API.
   * 2. Otherwise, we will call QR's API directly.
   */ const onReflectionViewed = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)((reflectionContainer)=>{
        const postId = reflectionContainer.getAttribute("data-post-id");
        if ((0,_utils_auth_login__WEBPACK_IMPORTED_MODULE_7__/* .isLoggedIn */ .jl)()) {
            // eslint-disable-next-line @typescript-eslint/no-empty-function
            (0,_utils_auth_qf_api__WEBPACK_IMPORTED_MODULE_8__/* .postReflectionViews */ .GG)(postId).catch(()=>{});
        } else {
            // eslint-disable-next-line @typescript-eslint/no-empty-function
            (0,_utils_quranReflect_apiPaths__WEBPACK_IMPORTED_MODULE_9__/* .postReflectionViews */ .GG)(postId).catch(()=>{});
        }
    }, []);
    (0,_hooks_useGlobalIntersectionObserverWithDelay__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z)({
        threshold: 1
    }, onReflectionViewed, _components_QuranReader_observer__WEBPACK_IMPORTED_MODULE_10__/* .REFLECTIONS_OBSERVER_ID */ .yG, "postId", "countAsViewedAfter");
    const renderBody = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)((data)=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(ReflectionBody, {
            data: data,
            selectedChapterId: selectedChapterId,
            selectedVerseNumber: selectedVerseNumber,
            setSelectedVerseNumber: setSelectedVerseNumber,
            scrollToTop: scrollToTop
        }), [
        scrollToTop,
        selectedChapterId,
        selectedVerseNumber
    ]);
    const body = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_DataFetcher__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
        loading: _components_QuranReader_TafsirView_TafsirSkeleton__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z,
        queryKey: (0,_utils_quranReflect_apiPaths__WEBPACK_IMPORTED_MODULE_9__/* .makeAyahReflectionsUrl */ .pZ)({
            surahId: selectedChapterId,
            ayahNumber: selectedVerseNumber,
            locale: lang
        }),
        render: renderBody
    });
    return render({
        surahAndAyahSelection: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(ReflectionSurahAndAyahSelection, {
            selectedChapterId: selectedChapterId,
            selectedVerseNumber: selectedVerseNumber,
            setSelectedChapterId: setSelectedChapterId,
            setSelectedVerseNumber: setSelectedVerseNumber
        }),
        body
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReflectionBodyContainer);

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

/***/ }),

/***/ 5369:
/***/ ((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 next_router__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(71853);
/* harmony import */ var next_router__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(next_router__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_redux__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(6022);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _components_dls_ContentModal_ContentModal__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(66606);
/* harmony import */ var _components_QuranReader_TafsirView_TafsirBody__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(47261);
/* harmony import */ var _components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(40608);
/* harmony import */ var _components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_14___default = /*#__PURE__*/__webpack_require__.n(_components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_14__);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(50497);
/* harmony import */ var _icons_book_open_svg__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(29537);
/* harmony import */ var _redux_slices_QuranReader_tafsirs__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(11983);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(55943);
/* harmony import */ var _utils_navigation__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(57933);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(44519);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_components_dls_ContentModal_ContentModal__WEBPACK_IMPORTED_MODULE_6__, _components_QuranReader_TafsirView_TafsirBody__WEBPACK_IMPORTED_MODULE_7__, _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_11__, _utils_navigation__WEBPACK_IMPORTED_MODULE_12__]);
([_components_dls_ContentModal_ContentModal__WEBPACK_IMPORTED_MODULE_6__, _components_QuranReader_TafsirView_TafsirBody__WEBPACK_IMPORTED_MODULE_7__, _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_11__, _utils_navigation__WEBPACK_IMPORTED_MODULE_12__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);















const TafsirButton = ({ verseKey , isTranslationView =true , onActionTriggered ,  })=>{
    const { t , lang  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4___default()("common");
    const router = (0,next_router__WEBPACK_IMPORTED_MODULE_3__.useRouter)();
    const tafsirs = (0,react_redux__WEBPACK_IMPORTED_MODULE_5__.useSelector)(_redux_slices_QuranReader_tafsirs__WEBPACK_IMPORTED_MODULE_10__/* .selectSelectedTafsirs */ .XG);
    const { 0: isContentModalOpen , 1: setIsContentModalOpen  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [chapterId, verseNumber] = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_13__/* .getVerseAndChapterNumbersFromKey */ .bV)(verseKey);
    const onButtonClicked = ()=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_11__/* .logButtonClick */ .MY)(`${isTranslationView ? "translation_view" : "reading_view"}_verse_actions_menu_tafsir`);
        setIsContentModalOpen(true);
        (0,_utils_navigation__WEBPACK_IMPORTED_MODULE_12__/* .fakeNavigate */ ._V)((0,_utils_navigation__WEBPACK_IMPORTED_MODULE_12__/* .getVerseSelectedTafsirNavigationUrl */ .I8)(chapterId, Number(verseNumber), tafsirs[0]), lang);
    };
    const contentModalRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);
    const onModalClose = ()=>{
        if (isTranslationView) {
            (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_11__/* .logEvent */ .Kz)("translation_view_tafsir_modal_close");
        } else {
            (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_11__/* .logEvent */ .Kz)("reading_view_tafsir_modal_close");
        }
        setIsContentModalOpen(false);
        (0,_utils_navigation__WEBPACK_IMPORTED_MODULE_12__/* .fakeNavigate */ ._V)(router.asPath, router.locale);
        if (onActionTriggered) {
            onActionTriggered();
        }
    };
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .ZP, {
                variant: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* .ButtonVariant.Ghost */ .Wu.Ghost,
                onClick: onButtonClicked,
                size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* .ButtonSize.Small */ .qE.Small,
                tooltip: t("quran-reader:tafsirs"),
                shouldFlipOnRTL: false,
                shape: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* .ButtonShape.Circle */ .jL.Circle,
                className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_14___default().iconContainer), (_components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_14___default().verseAction), {
                    [(_components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_14___default().fadedVerseAction)]: isTranslationView
                }, "tafsir-verse-button"),
                ariaLabel: t("quran-reader:aria.read-tafsirs"),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
                    className: (_components_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_14___default().icon),
                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_book_open_svg__WEBPACK_IMPORTED_MODULE_9__/* ["default"] */ .Z, {})
                })
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_QuranReader_TafsirView_TafsirBody__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .Z, {
                shouldRender: isContentModalOpen,
                initialChapterId: chapterId.toString(),
                initialVerseNumber: verseNumber.toString(),
                scrollToTop: ()=>{
                    contentModalRef.current.scrollToTop();
                },
                render: ({ body , languageAndTafsirSelection , surahAndAyahSelection  })=>{
                    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_components_dls_ContentModal_ContentModal__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                        innerRef: contentModalRef,
                        isOpen: isContentModalOpen,
                        hasCloseButton: true,
                        onClose: onModalClose,
                        onEscapeKeyDown: onModalClose,
                        header: surahAndAyahSelection,
                        children: [
                            languageAndTafsirSelection,
                            body
                        ]
                    });
                }
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TafsirButton);

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

/***/ }),

/***/ 28137:
/***/ ((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 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 _TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(5293);
/* harmony import */ var _TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(50497);
/* harmony import */ var _dls_Forms_Select__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(58087);
/* harmony import */ var _dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(77048);
/* harmony import */ var _dls_Spinner_SpinnerContainer__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(18470);
/* harmony import */ var _utils_locale__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(24709);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__]);
_dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];








const LanguageAndTafsirSelection = ({ selectedTafsirIdOrSlug , onTafsirSelected , selectedLanguage , onSelectLanguage , languageOptions , data , isLoading  })=>{
    if (!data) {
        return /*#__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()((_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default().tafsirSkeletonItem), (_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default().tafsirSelectionSkeleton))
        });
    }
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Spinner_SpinnerContainer__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
        isLoading: isLoading,
        children: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
            className: (_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default().tafsirSelectionContainer),
            children: [
                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Forms_Select__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
                    className: (_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default().languageSelection),
                    size: _dls_Forms_Select__WEBPACK_IMPORTED_MODULE_3__/* .SelectSize.Small */ .h.Small,
                    id: "lang-selection",
                    name: "lang-selection",
                    options: languageOptions.map((lng)=>({
                            label: (0,_utils_locale__WEBPACK_IMPORTED_MODULE_6__/* .getLocaleNameByFullName */ .Dl)(lng),
                            value: lng
                        })),
                    onChange: onSelectLanguage,
                    value: selectedLanguage
                }),
                data.tafsirs.filter((tafsir)=>tafsir.languageName === selectedLanguage || selectedTafsirIdOrSlug === tafsir.slug || Number(selectedTafsirIdOrSlug) === tafsir.id).map((tafsir)=>{
                    const selected = selectedTafsirIdOrSlug === tafsir.slug || Number(selectedTafsirIdOrSlug) === tafsir.id;
                    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .ZP, {
                        onClick: ()=>onTafsirSelected(tafsir.id, tafsir.slug),
                        size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__/* .ButtonSize.Small */ .qE.Small,
                        className: classnames__WEBPACK_IMPORTED_MODULE_1___default()((_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default().tafsirSelectionItem), {
                            [(_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default().tafsirItemSelected)]: selected
                        }),
                        children: tafsir.translatedName.name
                    }, tafsir.id);
                })
            ]
        })
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (LanguageAndTafsirSelection);

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

/***/ }),

/***/ 62727:
/***/ ((__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 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 _TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(5293);
/* harmony import */ var _TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _dls_Forms_Select__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(58087);
/* harmony import */ var _utils_locale__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(24709);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(44519);
/* harmony import */ var src_contexts_DataContext__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(70813);








const SurahAndAyahSelection = ({ selectedChapterId , selectedVerseNumber , onChapterIdChange , onVerseNumberChange ,  })=>{
    const { lang  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_2___default()();
    const chaptersData = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(src_contexts_DataContext__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z);
    const verses = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_5__/* .generateChapterVersesKeys */ .qB)(chaptersData, selectedChapterId);
    const surahOptions = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(()=>Object.entries(chaptersData).map(([id, chapter])=>({
                label: chapter.transliteratedName,
                value: id
            })), [
        chaptersData
    ]);
    const ayahOptions = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(()=>verses.map((verseKey)=>{
            const verseNumber = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_5__/* .getVerseNumberFromKey */ .tR)(verseKey).toString();
            return {
                label: (0,_utils_locale__WEBPACK_IMPORTED_MODULE_4__/* .toLocalizedNumber */ .rQ)(Number(verseNumber), lang),
                value: verseNumber
            };
        }), [
        lang,
        verses
    ]);
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: (_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default().surahAndAyahSelectionContainer),
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Forms_Select__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
                size: _dls_Forms_Select__WEBPACK_IMPORTED_MODULE_3__/* .SelectSize.Small */ .h.Small,
                id: "surah-selection",
                name: "surah-selection",
                options: surahOptions,
                onChange: onChapterIdChange,
                value: selectedChapterId
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                className: (_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default().selectionItem),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Forms_Select__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
                    className: (_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_7___default().ayahSelection),
                    size: _dls_Forms_Select__WEBPACK_IMPORTED_MODULE_3__/* .SelectSize.Small */ .h.Small,
                    id: "ayah-selection",
                    name: "ayah-selection",
                    options: ayahOptions,
                    onChange: onVerseNumberChange,
                    value: selectedVerseNumber
                })
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SurahAndAyahSelection);


/***/ }),

/***/ 47261:
/***/ ((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 next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__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 swr_immutable__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(79847);
/* harmony import */ var _VerseTextPreview__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(57072);
/* harmony import */ var _LanguageAndTafsirSelection__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(28137);
/* harmony import */ var _SurahAndAyahSelection__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(62727);
/* harmony import */ var _TafsirEndOfScrollingActions__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(52760);
/* harmony import */ var _TafsirGroupMessage__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(78153);
/* harmony import */ var _TafsirMessage__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(32068);
/* harmony import */ var _TafsirSkeleton__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(1627);
/* harmony import */ var _TafsirText__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(20301);
/* harmony import */ var _TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(5293);
/* harmony import */ var _TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_28___default = /*#__PURE__*/__webpack_require__.n(_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_28__);
/* harmony import */ var _components_DataFetcher__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(12951);
/* harmony import */ var _dls_Separator_Separator__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(94400);
/* harmony import */ var _hooks_auth_usePersistPreferenceGroup__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(19583);
/* harmony import */ var _redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(62093);
/* harmony import */ var _redux_slices_QuranReader_tafsirs__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(11983);
/* harmony import */ var _utils_apiPaths__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(46127);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(55943);
/* harmony import */ var _utils_locale__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(24709);
/* harmony import */ var _utils_navigation__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(57933);
/* harmony import */ var _utils_tafsir__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(17773);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(44519);
/* harmony import */ var src_api__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(92684);
/* harmony import */ var src_contexts_DataContext__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(70813);
/* harmony import */ var types_auth_PreferenceGroup__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(13591);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([swr_immutable__WEBPACK_IMPORTED_MODULE_5__, _LanguageAndTafsirSelection__WEBPACK_IMPORTED_MODULE_7__, _TafsirEndOfScrollingActions__WEBPACK_IMPORTED_MODULE_9__, _TafsirText__WEBPACK_IMPORTED_MODULE_13__, _components_DataFetcher__WEBPACK_IMPORTED_MODULE_14__, _dls_Separator_Separator__WEBPACK_IMPORTED_MODULE_15__, _hooks_auth_usePersistPreferenceGroup__WEBPACK_IMPORTED_MODULE_16__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_20__, _utils_navigation__WEBPACK_IMPORTED_MODULE_22__]);
([swr_immutable__WEBPACK_IMPORTED_MODULE_5__, _LanguageAndTafsirSelection__WEBPACK_IMPORTED_MODULE_7__, _TafsirEndOfScrollingActions__WEBPACK_IMPORTED_MODULE_9__, _TafsirText__WEBPACK_IMPORTED_MODULE_13__, _components_DataFetcher__WEBPACK_IMPORTED_MODULE_14__, _dls_Separator_Separator__WEBPACK_IMPORTED_MODULE_15__, _hooks_auth_usePersistPreferenceGroup__WEBPACK_IMPORTED_MODULE_16__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_20__, _utils_navigation__WEBPACK_IMPORTED_MODULE_22__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);
/* eslint-disable react-func/max-lines-per-function */ /* eslint-disable max-lines */ /* eslint-disable i18next/no-literal-string */ 




























const TafsirBody = ({ initialChapterId , initialVerseNumber , initialTafsirIdOrSlug , render , scrollToTop , shouldRender  })=>{
    const quranReaderStyles = (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_17__/* .selectQuranReaderStyles */ .Pt, react_redux__WEBPACK_IMPORTED_MODULE_4__.shallowEqual);
    const { lang , t  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default()("common");
    const tafsirsState = (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(_redux_slices_QuranReader_tafsirs__WEBPACK_IMPORTED_MODULE_18__/* .selectTafsirs */ .OW);
    const { selectedTafsirs: userPreferredTafsirIds  } = tafsirsState;
    const chaptersData = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(src_contexts_DataContext__WEBPACK_IMPORTED_MODULE_26__/* ["default"] */ .Z);
    const { actions: { onSettingsChange  } , isLoading ,  } = (0,_hooks_auth_usePersistPreferenceGroup__WEBPACK_IMPORTED_MODULE_16__/* ["default"] */ .Z)();
    const { 0: selectedChapterId , 1: setSelectedChapterId  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(initialChapterId);
    const { 0: selectedVerseNumber , 1: setSelectedVerseNumber  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(initialVerseNumber);
    const { 0: selectedLanguage , 1: setSelectedLanguage  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)("");
    const selectedVerseKey = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_24__/* .makeVerseKey */ .u)(Number(selectedChapterId), Number(selectedVerseNumber));
    const { 0: selectedTafsirIdOrSlug , 1: setSelectedTafsirIdOrSlug  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(initialTafsirIdOrSlug || userPreferredTafsirIds?.[0]);
    // if user opened tafsirBody via a url, we will have initialTafsirIdOrSlug
    // we need to set this `initialTafsirIdOrSlug` as a selectedTafsirIdOrSlug
    // we did not use `useState(initialTafsirIdOrSlug)` because `useRouter`'s query string is undefined on first render
    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(()=>{
        if (initialTafsirIdOrSlug) {
            (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_20__/* .logEvent */ .Kz)("tafsir_url_access");
            setSelectedTafsirIdOrSlug(initialTafsirIdOrSlug);
        }
    }, [
        initialTafsirIdOrSlug
    ]);
    const onTafsirSelected = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)((id, slug)=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_20__/* .logItemSelectionChange */ .u8)("tafsir", id);
        setSelectedTafsirIdOrSlug(slug);
        (0,_utils_navigation__WEBPACK_IMPORTED_MODULE_22__/* .fakeNavigate */ ._V)((0,_utils_navigation__WEBPACK_IMPORTED_MODULE_22__/* .getVerseSelectedTafsirNavigationUrl */ .I8)(Number(selectedChapterId), Number(selectedVerseNumber), slug), lang);
        onSettingsChange("selectedTafsirs", [
            slug
        ], (0,_redux_slices_QuranReader_tafsirs__WEBPACK_IMPORTED_MODULE_18__/* .setSelectedTafsirs */ .ZY)({
            tafsirs: [
                slug
            ],
            locale: lang
        }), (0,_redux_slices_QuranReader_tafsirs__WEBPACK_IMPORTED_MODULE_18__/* .setSelectedTafsirs */ .ZY)({
            tafsirs: tafsirsState.selectedTafsirs,
            locale: lang
        }), types_auth_PreferenceGroup__WEBPACK_IMPORTED_MODULE_27__/* ["default"].TAFSIRS */ .Z.TAFSIRS);
    }, [
        lang,
        onSettingsChange,
        selectedChapterId,
        selectedVerseNumber,
        tafsirsState
    ]);
    const { data: tafsirSelectionList  } = (0,swr_immutable__WEBPACK_IMPORTED_MODULE_5__["default"])(shouldRender ? (0,_utils_apiPaths__WEBPACK_IMPORTED_MODULE_19__/* .makeTafsirsUrl */ .A9)(lang) : null, src_api__WEBPACK_IMPORTED_MODULE_25__/* .fetcher */ ._i);
    // selectedLanguage is based on selectedTafsir's language
    // but we need to fetch the data from the API first to know what is the language of `selectedTafsirIdOrSlug`
    // so we get the data from the API and set the selectedLanguage once it is loaded
    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(()=>{
        if (tafsirSelectionList) {
            setSelectedLanguage((prevSelectedLanguage)=>{
                // if we haven't set the language already, we need to detect which language the current tafsir is in.
                return prevSelectedLanguage || (0,_utils_tafsir__WEBPACK_IMPORTED_MODULE_23__/* .getSelectedTafsirLanguage */ .BF)(tafsirSelectionList, selectedTafsirIdOrSlug);
            });
        }
    }, [
        onTafsirSelected,
        selectedTafsirIdOrSlug,
        tafsirSelectionList
    ]);
    // there's no 1:1 data that can map our locale options to the tafsir language options
    // so we're using options that's available from tafsir for now
    // TODO: update language options, to use the same options as our LanguageSelector
    const languageOptions = tafsirSelectionList ? (0,_utils_tafsir__WEBPACK_IMPORTED_MODULE_23__/* .getTafsirsLanguageOptions */ .O3)(tafsirSelectionList.tafsirs) : [];
    /**
   * Handle when the language of the Tafsir is changed. When it does,
   * we auto-select the first Tafsir of the new language based on the
   * response from BE.
   *
   * @param {string} newLang
   */ const onLanguageSelected = (newLang)=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_20__/* .logValueChange */ .Q8)("tafsir_locale", selectedLanguage, newLang);
        setSelectedLanguage(newLang);
        if (tafsirSelectionList) {
            const firstTafsirOfLanguage = (0,_utils_tafsir__WEBPACK_IMPORTED_MODULE_23__/* .getFirstTafsirOfLanguage */ .K8)(tafsirSelectionList, newLang);
            if (firstTafsirOfLanguage) {
                const { id , slug  } = firstTafsirOfLanguage;
                onTafsirSelected(id, slug);
            }
        }
    };
    const renderTafsir = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)((data)=>{
        if (!data || !data.tafsir) return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_TafsirSkeleton__WEBPACK_IMPORTED_MODULE_12__/* ["default"] */ .Z, {});
        const { verses , text , languageId  } = data.tafsir;
        const langData = (0,_utils_locale__WEBPACK_IMPORTED_MODULE_21__/* .getLanguageDataById */ .j2)(languageId);
        const [firstVerseKey, lastVerseKey] = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_24__/* .getFirstAndLastVerseKeys */ .cI)(verses);
        const [chapterNumber, verseNumber] = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_24__/* .getVerseAndChapterNumbersFromKey */ .bV)(lastVerseKey);
        const hasNextVerseGroup = !(0,_utils_verse__WEBPACK_IMPORTED_MODULE_24__/* .isLastVerseOfSurah */ .kC)(chaptersData, chapterNumber, Number(verseNumber));
        const hasPrevVerseGroup = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_24__/* .getVerseNumberFromKey */ .tR)(firstVerseKey) !== 1;
        const loadNextVerseGroup = ()=>{
            (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_20__/* .logButtonClick */ .MY)("tafsir_next_verse");
            scrollToTop();
            const newVerseNumber = String(Number((0,_utils_verse__WEBPACK_IMPORTED_MODULE_24__/* .getVerseNumberFromKey */ .tR)(lastVerseKey)) + 1);
            (0,_utils_navigation__WEBPACK_IMPORTED_MODULE_22__/* .fakeNavigate */ ._V)((0,_utils_navigation__WEBPACK_IMPORTED_MODULE_22__/* .getVerseSelectedTafsirNavigationUrl */ .I8)(Number(selectedChapterId), Number(newVerseNumber), selectedTafsirIdOrSlug), lang);
            setSelectedVerseNumber(newVerseNumber);
        };
        const loadPrevVerseGroup = ()=>{
            const newVerseNumber = String(Number((0,_utils_verse__WEBPACK_IMPORTED_MODULE_24__/* .getVerseNumberFromKey */ .tR)(firstVerseKey)) - 1);
            (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_20__/* .logButtonClick */ .MY)("tafsir_prev_verse");
            scrollToTop();
            (0,_utils_navigation__WEBPACK_IMPORTED_MODULE_22__/* .fakeNavigate */ ._V)((0,_utils_navigation__WEBPACK_IMPORTED_MODULE_22__/* .getVerseSelectedTafsirNavigationUrl */ .I8)(Number(selectedChapterId), Number(newVerseNumber), selectedTafsirIdOrSlug), lang);
            setSelectedVerseNumber(newVerseNumber);
        };
        return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
            children: [
                !text && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_TafsirMessage__WEBPACK_IMPORTED_MODULE_11__/* ["default"] */ .Z, {
                    children: t("tafsir.no-text", {
                        tafsirName: data.tafsir.translatedName.name
                    })
                }),
                Object.values(verses).length > 1 && !!text && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_TafsirGroupMessage__WEBPACK_IMPORTED_MODULE_10__/* ["default"] */ .Z, {
                    from: firstVerseKey,
                    to: lastVerseKey
                }),
                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                    className: (_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_28___default().verseTextContainer),
                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_VerseTextPreview__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                        verses: Object.values(verses)
                    })
                }),
                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                    className: (_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_28___default().separatorContainer),
                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Separator_Separator__WEBPACK_IMPORTED_MODULE_15__/* ["default"] */ .Z, {})
                }),
                !!text && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_TafsirText__WEBPACK_IMPORTED_MODULE_13__/* ["default"] */ .Z, {
                    direction: langData.direction,
                    languageCode: langData.code,
                    text: text
                }),
                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_TafsirEndOfScrollingActions__WEBPACK_IMPORTED_MODULE_9__/* ["default"] */ .Z, {
                    hasNextVerseGroup: hasNextVerseGroup,
                    hasPrevVerseGroup: hasPrevVerseGroup,
                    onNextButtonClicked: loadNextVerseGroup,
                    onPreviousButtonClicked: loadPrevVerseGroup
                })
            ]
        });
    }, [
        chaptersData,
        lang,
        scrollToTop,
        selectedChapterId,
        selectedTafsirIdOrSlug,
        t
    ]);
    const onChapterIdChange = (newChapterId)=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_20__/* .logItemSelectionChange */ .u8)("tafsir_chapter_id", newChapterId);
        (0,_utils_navigation__WEBPACK_IMPORTED_MODULE_22__/* .fakeNavigate */ ._V)((0,_utils_navigation__WEBPACK_IMPORTED_MODULE_22__/* .getVerseSelectedTafsirNavigationUrl */ .I8)(Number(newChapterId), Number(1), selectedTafsirIdOrSlug), lang);
        setSelectedChapterId(newChapterId.toString());
        setSelectedVerseNumber("1"); // reset verse number to 1 every time chapter changes
    };
    const onVerseNumberChange = (newVerseNumber)=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_20__/* .logItemSelectionChange */ .u8)("tafsir_verse_number", newVerseNumber);
        setSelectedVerseNumber(newVerseNumber);
        (0,_utils_navigation__WEBPACK_IMPORTED_MODULE_22__/* .fakeNavigate */ ._V)((0,_utils_navigation__WEBPACK_IMPORTED_MODULE_22__/* .getVerseSelectedTafsirNavigationUrl */ .I8)(Number(selectedChapterId), Number(newVerseNumber), selectedTafsirIdOrSlug), lang);
    };
    const surahAndAyahSelection = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_SurahAndAyahSelection__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {
        selectedChapterId: selectedChapterId,
        selectedVerseNumber: selectedVerseNumber,
        onChapterIdChange: onChapterIdChange,
        onVerseNumberChange: onVerseNumberChange
    });
    const languageAndTafsirSelection = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_LanguageAndTafsirSelection__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .Z, {
        selectedTafsirIdOrSlug: selectedTafsirIdOrSlug,
        selectedLanguage: selectedLanguage,
        onTafsirSelected: onTafsirSelected,
        onSelectLanguage: onLanguageSelected,
        languageOptions: languageOptions,
        data: tafsirSelectionList,
        isLoading: isLoading
    });
    const body = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
        className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_28___default().tafsirContainer), (_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_28___default())[`tafsir-font-size-${quranReaderStyles.tafsirFontScale}`]),
        // disable browser translation for tafsir content
        // @see {https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/translate}
        translate: "no",
        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_DataFetcher__WEBPACK_IMPORTED_MODULE_14__/* ["default"] */ .Z, {
            loading: _TafsirSkeleton__WEBPACK_IMPORTED_MODULE_12__/* ["default"] */ .Z,
            queryKey: (0,_utils_apiPaths__WEBPACK_IMPORTED_MODULE_19__/* .makeTafsirContentUrl */ .Wy)(selectedTafsirIdOrSlug, selectedVerseKey, {
                lang,
                quranFont: quranReaderStyles.quranFont,
                mushafLines: quranReaderStyles.mushafLines
            }),
            render: renderTafsir
        })
    });
    return render({
        surahAndAyahSelection,
        languageAndTafsirSelection,
        body
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TafsirBody);

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

/***/ }),

/***/ 52760:
/***/ ((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 next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _TafsirEndOfScrollingActions_module_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(40574);
/* harmony import */ var _TafsirEndOfScrollingActions_module_scss__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_TafsirEndOfScrollingActions_module_scss__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(50497);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__]);
_dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];




const TafsirEndOfScrollingActions = ({ hasNextVerseGroup , hasPrevVerseGroup , onNextButtonClicked , onPreviousButtonClicked  })=>{
    const { t  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1___default()("common");
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: (_TafsirEndOfScrollingActions_module_scss__WEBPACK_IMPORTED_MODULE_3___default().container),
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                children: hasPrevVerseGroup && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .ZP, {
                    type: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__/* .ButtonType.Secondary */ .L$.Secondary,
                    onClick: onPreviousButtonClicked,
                    children: t("previous-ayah")
                })
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                children: hasNextVerseGroup && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .ZP, {
                    type: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_2__/* .ButtonType.Secondary */ .L$.Secondary,
                    onClick: onNextButtonClicked,
                    children: t("next-ayah")
                })
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TafsirEndOfScrollingActions);

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

/***/ }),

/***/ 78153:
/***/ ((__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 next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _TafsirMessage__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(32068);



const TafsirGroupMessage = ({ from , to  })=>{
    const { t  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1___default()("common");
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_TafsirMessage__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .Z, {
        children: t("tafsir.group-message", {
            from,
            to
        })
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TafsirGroupMessage);


/***/ }),

/***/ 32068:
/***/ ((__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 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 _TafsirMessage_module_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(43576);
/* harmony import */ var _TafsirMessage_module_scss__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_TafsirMessage_module_scss__WEBPACK_IMPORTED_MODULE_2__);



const TafsirMessage = ({ children  })=>{
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
        className: (_TafsirMessage_module_scss__WEBPACK_IMPORTED_MODULE_2___default().tafsirMessage),
        children: children
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TafsirMessage);


/***/ }),

/***/ 1627:
/***/ ((__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 _TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(5293);
/* harmony import */ var _TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(77048);





const TafsirSkeleton = ()=>{
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
                className: ((_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_4___default().tafsirSkeletonItem), (_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_4___default().ayahSekletonItem))
            }),
            lodash_range__WEBPACK_IMPORTED_MODULE_2___default()(1, 15).map((i)=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
                    className: classnames__WEBPACK_IMPORTED_MODULE_1___default()((_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_4___default().tafsirSkeletonItem), {
                        [(_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_4___default().tafsirSkeletonItem1)]: i % 1 === 0,
                        [(_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_4___default().tafsirSkeletonItem2)]: i % 2 === 0,
                        [(_TafsirView_module_scss__WEBPACK_IMPORTED_MODULE_4___default().tafsirSkeletonItem3)]: i % 3 === 0
                    })
                }, i))
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TafsirSkeleton);


/***/ }),

/***/ 20301:
/***/ ((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 react_redux__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(6022);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _TafsirText_module_scss__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(99719);
/* harmony import */ var _TafsirText_module_scss__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_TafsirText_module_scss__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _dls_Counter_Counter__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(12550);
/* harmony import */ var _dls_Spinner_SpinnerContainer__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(18470);
/* harmony import */ var _hooks_auth_usePersistPreferenceGroup__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(19583);
/* harmony import */ var _redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(62093);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(55943);
/* harmony import */ var types_auth_PreferenceGroup__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(13591);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Counter_Counter__WEBPACK_IMPORTED_MODULE_3__, _hooks_auth_usePersistPreferenceGroup__WEBPACK_IMPORTED_MODULE_5__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_7__]);
([_dls_Counter_Counter__WEBPACK_IMPORTED_MODULE_3__, _hooks_auth_usePersistPreferenceGroup__WEBPACK_IMPORTED_MODULE_5__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_7__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);
/* eslint-disable react/no-danger */ 









const FONT_SIZE_CLASS_MAP = {
    1: (_TafsirText_module_scss__WEBPACK_IMPORTED_MODULE_9___default().xs),
    2: (_TafsirText_module_scss__WEBPACK_IMPORTED_MODULE_9___default().sm),
    3: (_TafsirText_module_scss__WEBPACK_IMPORTED_MODULE_9___default().md),
    4: (_TafsirText_module_scss__WEBPACK_IMPORTED_MODULE_9___default().lg),
    5: (_TafsirText_module_scss__WEBPACK_IMPORTED_MODULE_9___default().xl)
};
const TafsirText = ({ direction , languageCode , text  })=>{
    const quranReaderStyles = (0,react_redux__WEBPACK_IMPORTED_MODULE_2__.useSelector)(_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_6__/* .selectQuranReaderStyles */ .Pt);
    const { actions: { onSettingsChange  } , isLoading ,  } = (0,_hooks_auth_usePersistPreferenceGroup__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z)();
    const { tafsirFontScale  } = quranReaderStyles;
    /**
   * Persist settings in the DB if the user is logged in before dispatching
   * Redux action, otherwise just dispatch it.
   *
   * @param {string} key
   * @param {number} value
   * @param {Action} action
   */ const onTafsirsSettingsChange = (key, value, action, undoAction)=>{
        onSettingsChange(key, value, action, undoAction, types_auth_PreferenceGroup__WEBPACK_IMPORTED_MODULE_8__/* ["default"].QURAN_READER_STYLES */ .Z.QURAN_READER_STYLES);
    };
    const onFontScaleDecreaseClicked = ()=>{
        const newValue = tafsirFontScale - 1;
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_7__/* .logValueChange */ .Q8)("tafsir_font_scale", tafsirFontScale, newValue);
        onTafsirsSettingsChange("tafsirFontScale", newValue, (0,_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_6__/* .decreaseTafsirFontScale */ .fT)(), (0,_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_6__/* .increaseTafsirFontScale */ .$U)());
    };
    const onFontScaleIncreaseClicked = ()=>{
        const newValue = tafsirFontScale + 1;
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_7__/* .logValueChange */ .Q8)("tafsir_font_scale", tafsirFontScale, newValue);
        onTafsirsSettingsChange("tafsirFontScale", newValue, (0,_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_6__/* .increaseTafsirFontScale */ .$U)(), (0,_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_6__/* .decreaseTafsirFontScale */ .fT)());
    };
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                dir: direction,
                className: (_TafsirText_module_scss__WEBPACK_IMPORTED_MODULE_9___default().counter),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Spinner_SpinnerContainer__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
                    isLoading: isLoading,
                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Counter_Counter__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {
                        count: tafsirFontScale,
                        onDecrement: tafsirFontScale === _redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_6__/* .MINIMUM_FONT_STEP */ .P0 ? null : onFontScaleDecreaseClicked,
                        onIncrement: tafsirFontScale === _redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_6__/* .MAXIMUM_TAFSIR_FONT_STEP */ .Jf ? null : onFontScaleIncreaseClicked
                    })
                })
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                className: FONT_SIZE_CLASS_MAP[tafsirFontScale],
                dir: direction,
                lang: languageCode,
                dangerouslySetInnerHTML: {
                    __html: text
                }
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TafsirText);

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

/***/ }),

/***/ 23575:
/***/ ((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 next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _FootnoteText_module_scss__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(61821);
/* harmony import */ var _FootnoteText_module_scss__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_FootnoteText_module_scss__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(68505);
/* harmony import */ var _TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(50497);
/* harmony import */ var _dls_Spinner_Spinner__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(7190);
/* harmony import */ var _icons_close_svg__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(51053);
/* harmony import */ var _utils_locale__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(24709);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__]);
_dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];
/* eslint-disable react/no-danger */ 









const FootnoteText = ({ footnoteName , footnote , onCloseClicked , onTextClicked , isLoading ,  })=>{
    const { t , lang  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default()("quran-reader");
    const languageId = footnote?.languageId || (0,_utils_locale__WEBPACK_IMPORTED_MODULE_7__/* .findLanguageIdByLocale */ .zi)(lang);
    const landData = (0,_utils_locale__WEBPACK_IMPORTED_MODULE_7__/* .getLanguageDataById */ .j2)(languageId);
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: (_FootnoteText_module_scss__WEBPACK_IMPORTED_MODULE_8___default().footnoteContainer),
        children: [
            /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
                className: (_FootnoteText_module_scss__WEBPACK_IMPORTED_MODULE_8___default().header),
                children: [
                    /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("p", {
                        children: [
                            t("footnote"),
                            " ",
                            footnoteName ? `- ${footnoteName}` : null
                        ]
                    }),
                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .ZP, {
                        size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__/* .ButtonSize.Small */ .qE.Small,
                        variant: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__/* .ButtonVariant.Ghost */ .Wu.Ghost,
                        shape: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__/* .ButtonShape.Circle */ .jL.Circle,
                        onClick: onCloseClicked,
                        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_close_svg__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {})
                    })
                ]
            }),
            isLoading ? /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Spinner_Spinner__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {}) : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_FootnoteText_module_scss__WEBPACK_IMPORTED_MODULE_8___default().text), (_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_9___default())[landData.direction], (_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_9___default())[landData.font]),
                dangerouslySetInnerHTML: {
                    __html: footnote.text
                },
                ...onTextClicked && {
                    onClick: onTextClicked
                }
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FootnoteText);

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

/***/ }),

/***/ 18809:
/***/ ((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 next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _FootnoteText__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(23575);
/* harmony import */ var _TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(68505);
/* harmony import */ var _TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(55943);
/* harmony import */ var _utils_locale__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(24709);
/* harmony import */ var src_api__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(92684);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_FootnoteText__WEBPACK_IMPORTED_MODULE_4__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_5__]);
([_FootnoteText__WEBPACK_IMPORTED_MODULE_4__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_5__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);
/* eslint-disable react-func/max-lines-per-function */ /* eslint-disable jsx-a11y/no-static-element-interactions */ /* eslint-disable jsx-a11y/click-events-have-key-events */ /* eslint-disable react/no-danger */ 








const TranslationText = ({ translationFontScale , text , languageId , resourceName ,  })=>{
    const { t  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default()("quran-reader");
    const { 0: isLoading , 1: setIsLoading  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const { 0: showFootnote , 1: setShowFootnote  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(true);
    const { 0: footnote , 1: setFootnote  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(null);
    const { 0: activeFootnoteName , 1: setActiveFootnoteName  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(null);
    const { 0: activeSubFootnoteName , 1: setActiveSubFootnoteName  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(null);
    const { 0: subFootnote , 1: setSubFootnote  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(null);
    const PRE_DEFINED_FOOTNOTES = {
        sg: t("footnote-sg"),
        pl: t("footnote-pl"),
        dl: t("footnote-dl")
    };
    const resetFootnote = ()=>{
        setFootnote(null);
        setSubFootnote(null);
        setIsLoading(false);
        setActiveFootnoteName(null);
        setActiveSubFootnoteName(null);
    };
    const resetSubFootnote = ()=>{
        setSubFootnote(null);
        setActiveSubFootnoteName(null);
    };
    /**
   * Handle when the translation text is clicked. This is needed to handle when a footnote
   * is clicked since we receive the translation text as HTML from BE. Any footnote will
   * be inside an <sup>...</sup> element. so when the translation container is clicked
   * we check whether the clicked element is of tag name SUP and if so, we handle showing the
   * footnote as following:
   *
   * 1. If it's not a sub-footnote (a footnote inside a footnote) which is all translations
   *    except Bridge's Foundation translation:
   *    1. check if the sup element has foot_note attribute (the ID) and if it has:
   *        1. Check if we already have a footnote in the local state with the same ID:
   *            1. if yes, it means this is the second time the user clicks on the
   *               footnote so we should close the footnote.
   *            2. if no, it means we need to call BE to fetch the footnote text by its ID.
   *    2. if not, it means it's a pre-defined footnote and in this case, we access the text
   *       inside the element and check if it's in the list of pre-defined footnotes and if it
   *       is, we get the value from the pre-defined footnotes and assign it as the footnote
   *       text without having to call BE (only happens with Bridge's Foundation translation)
   * 2. If it's a sub-footnote it will only have pre-defined footnotes so we handle it the same
   *    way as above (only happens with Bridge's Foundation translation, ex: Surah 30, Verse 11).
   *
   * @param {MouseEvent} event
   * @param {boolean} isSubFootnote whether we are handling a footnote or a sub-footnote (only happens
   *                                with Bridge's Foundation translation).
   */ const onTextClicked = (event, isSubFootnote = false)=>{
        const target = event.target;
        // if we just clicked on anything other than a footnote element, return early.
        if (target.tagName !== "SUP") {
            return;
        }
        // we get the text inside the sup element and trim the extra spaces.
        const footnoteText = target.innerText.trim();
        // if it's the main footnote and not the sub footnote.
        if (!isSubFootnote) {
            const footNoteId = target.getAttribute("foot_note");
            // Set the activeFootnoteNumber to the current number of the footnote from the <sup> innerHTML
            setActiveFootnoteName(footnoteText);
            // if it's the normal case that needs us to call BE and not a fixed footnote like the ones found for Bridge's translation.
            if (footNoteId) {
                // if this is the second time to click the footnote, close it
                if (showFootnote && footnote && footnote.id === Number(footNoteId)) {
                    (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_5__/* .logButtonClick */ .MY)("translation_footnote_double_click_to_close");
                    resetFootnote();
                } else {
                    (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_5__/* .logButtonClick */ .MY)("translation_show_footnote");
                    resetSubFootnote();
                    setShowFootnote(true);
                    setIsLoading(true);
                    (0,src_api__WEBPACK_IMPORTED_MODULE_7__/* .getFootnote */ .ei)(footNoteId).then((res)=>{
                        if (res.status !== 500) {
                            setFootnote(res.footNote);
                        }
                    }).finally(()=>{
                        setIsLoading(false);
                    });
                }
            } else if (footnote && footnote.id === footnoteText) {
                // if this is the second time we are clicking on the footnote, we close it.
                (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_5__/* .logButtonClick */ .MY)("translation_pre_defined_footnote_double_click_to_close");
                resetFootnote();
            } else if (PRE_DEFINED_FOOTNOTES[footnoteText]) {
                (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_5__/* .logButtonClick */ .MY)("translation_pre_defined_footnote");
                resetSubFootnote();
                setFootnote({
                    id: footnoteText,
                    text: PRE_DEFINED_FOOTNOTES[footnoteText]
                });
            }
        } else {
            // Set the activeSubFootnoteNumber to the current number of the footnote from the <sup> innerHTML
            setActiveSubFootnoteName(footnoteText);
            const subFootnoteId = `${footnote.id} - ${footnoteText}`;
            // if this is the second time we are clicking on the sub footnote, we close it.
            if (subFootnote && subFootnote.id === subFootnoteId) {
                (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_5__/* .logButtonClick */ .MY)("translation_sub_footnote_double_click_to_close");
                resetSubFootnote();
            } else if (PRE_DEFINED_FOOTNOTES[footnoteText]) {
                (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_5__/* .logButtonClick */ .MY)("translation_show_sub_footnote");
                setSubFootnote({
                    id: subFootnoteId,
                    text: PRE_DEFINED_FOOTNOTES[footnoteText]
                });
            }
        }
    };
    const hideFootnote = ()=>setShowFootnote(false);
    const langData = (0,_utils_locale__WEBPACK_IMPORTED_MODULE_6__/* .getLanguageDataById */ .j2)(languageId);
    const shouldShowFootnote = showFootnote && (footnote || isLoading);
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: (_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_8___default())[`translation-font-size-${translationFontScale}`],
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                onClick: (event)=>onTextClicked(event),
                className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_8___default().text), (_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_8___default())[langData.direction], (_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_8___default())[langData.font]),
                dangerouslySetInnerHTML: {
                    __html: text
                }
            }),
            shouldShowFootnote && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_FootnoteText__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
                footnoteName: activeFootnoteName || undefined,
                footnote: footnote,
                isLoading: isLoading,
                onCloseClicked: ()=>{
                    (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_5__/* .logButtonClick */ .MY)("translation_footnote_close");
                    if (isLoading) {
                        hideFootnote();
                    } else {
                        resetFootnote();
                    }
                },
                onTextClicked: (event)=>onTextClicked(event, true)
            }),
            subFootnote && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_FootnoteText__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
                footnoteName: activeSubFootnoteName || undefined,
                footnote: subFootnote,
                onCloseClicked: resetSubFootnote
            }),
            resourceName && /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("p", {
                className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_8___default().translationName), (_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_8___default())[langData.direction], (_TranslationText_module_scss__WEBPACK_IMPORTED_MODULE_8___default())[langData.font]),
                children: [
                    "— ",
                    resourceName
                ]
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TranslationText);

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

/***/ }),

/***/ 80587:
/***/ ((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 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 _TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(40608);
/* harmony import */ var _TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11__);
/* harmony import */ var _TranslationViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(24791);
/* harmony import */ var _TranslationViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_12___default = /*#__PURE__*/__webpack_require__.n(_TranslationViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_12__);
/* harmony import */ var _components_Verse_VerseText_module_scss__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(29702);
/* harmony import */ var _components_Verse_VerseText_module_scss__WEBPACK_IMPORTED_MODULE_13___default = /*#__PURE__*/__webpack_require__.n(_components_Verse_VerseText_module_scss__WEBPACK_IMPORTED_MODULE_13__);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(50497);
/* harmony import */ var _dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(77048);
/* harmony import */ var _hooks_useGetQueryParamOrReduxValue__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(80211);
/* harmony import */ var _redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(62093);
/* harmony import */ var _utils_fontFaceHelper__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(64198);
/* harmony import */ var types_QueryParam__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(11721);
/* harmony import */ var types_QuranReader__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(50467);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__]);
_dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];














const TRANSLATION_TEXT_SAMPLE = "He has revealed to you ˹O Prophet˺ the Book in truth, confirming what came before it, as He revealed the Torah and the Gospel";
const TRANSLATION_AUTHOR_SAMPLE = "— Dr. Mustafa Khattab, the Clear Quran";
const TranslationViewCellSkeleton = ({ hasActionMenuItems =true  })=>{
    const { value: selectedTranslations  } = (0,_hooks_useGetQueryParamOrReduxValue__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z)(types_QueryParam__WEBPACK_IMPORTED_MODULE_9__/* ["default"].Translations */ .Z.Translations);
    const { quranFont , quranTextFontScale , translationFontScale , mushafLines  } = (0,react_redux__WEBPACK_IMPORTED_MODULE_3__.useSelector)(_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_7__/* .selectQuranReaderStyles */ .Pt, react_redux__WEBPACK_IMPORTED_MODULE_3__.shallowEqual);
    const isTajweedFont = quranFont === types_QuranReader__WEBPACK_IMPORTED_MODULE_10__/* .QuranFont.Tajweed */ .fr.Tajweed;
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: classnames__WEBPACK_IMPORTED_MODULE_1___default()((_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().cellContainer), (_TranslationViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_12___default().cellContainer)),
        children: [
            /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
                className: (_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().actionContainer),
                children: [
                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                        className: (_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().actionContainerLeft),
                        children: lodash_range__WEBPACK_IMPORTED_MODULE_2___default()(0, 4).map((index)=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                                className: (_TranslationViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_12___default().actionItem),
                                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .ZP, {
                                    size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__/* .ButtonSize.Small */ .qE.Small
                                })
                            }, index))
                    }),
                    hasActionMenuItems && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                        className: (_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().actionContainerRight),
                        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                            className: (_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().actionItem),
                            children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .ZP, {
                                size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_4__/* .ButtonSize.Small */ .qE.Small
                            })
                        })
                    })
                ]
            }),
            /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
                className: (_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().contentContainer),
                children: [
                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                        className: classnames__WEBPACK_IMPORTED_MODULE_1___default()((_TranslationViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_12___default().verseContainer), (_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().arabicVerseContainer), {
                            [(_components_Verse_VerseText_module_scss__WEBPACK_IMPORTED_MODULE_13___default())[(0,_utils_fontFaceHelper__WEBPACK_IMPORTED_MODULE_8__/* .getFontClassName */ .bZ)(quranFont, quranTextFontScale, mushafLines)]]: !isTajweedFont
                        })
                    }),
                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                        className: classnames__WEBPACK_IMPORTED_MODULE_1___default()((_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().verseTranslationsContainer), (_TranslationViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_12___default())[`translation-font-size-${translationFontScale}`]),
                        children: selectedTranslations.map((translation)=>/*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("span", {
                                children: [
                                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                                        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                                            className: classnames__WEBPACK_IMPORTED_MODULE_1___default()((_TranslationViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_12___default().translationText)),
                                            children: TRANSLATION_TEXT_SAMPLE
                                        })
                                    }),
                                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                                        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Skeleton_Skeleton__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                                            className: classnames__WEBPACK_IMPORTED_MODULE_1___default()((_TranslationViewSkeleton_module_scss__WEBPACK_IMPORTED_MODULE_12___default().translationAuthor)),
                                            children: TRANSLATION_AUTHOR_SAMPLE
                                        })
                                    })
                                ]
                            }, translation))
                    })
                ]
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TranslationViewCellSkeleton);

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

/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "FW": () => (/* binding */ getOptions),
/* harmony export */   "NM": () => (/* binding */ QURAN_READER_OBSERVER_ID),
/* harmony export */   "s$": () => (/* binding */ getObservedVersePayload),
/* harmony export */   "yG": () => (/* binding */ REFLECTIONS_OBSERVER_ID)
/* harmony export */ });
/**
 * The top -131.6px was calculated based on:
 *
 * 1. the height of emptySpacePlaceholder of navbar (3.6rem).
 * 2. the top padding of the QuranReader container (2rem).
 * 3. the top and bottom margin of the ReadingPreferenceSwitcher container (1.625rem).
 * 4. the top margin of the TranslationView container (1rem).
 *
 * and the total is 8.225rem around 131.6 pixels.
 */ const DEFAULT_ROOT_MARGIN = "-131.6px 0px -68% 0px";
const OBSERVER_THRESHOLD = 0.1;
const QURAN_READER_OBSERVER_ID = "quranReaderObserver";
const REFLECTIONS_OBSERVER_ID = "reflectionsObserver";
/**
 * the top -115.6px was calculated based on:
 *
 * 1. the height of emptySpacePlaceholder of navbar (3.6rem).
 * 2. the top padding of the QuranReader container (2rem).
 * 3. the top and bottom margin of the ReadingPreferenceSwitcher container (1.625rem).
 *
 * and the total is 7.225rem around 115.6 pixels.
 */ const READING_MODE_ROOT_MARGIN = "-115.6px 0px -70% 0px";
/**
 * Get the observer options based on the reading preference.
 *
 * @param {boolean} isReadingPreference
 * @returns {{rootMargin: string, threshold: number | number[]}}
 */ const getOptions = (isReadingPreference)=>({
        rootMargin: isReadingPreference ? READING_MODE_ROOT_MARGIN : DEFAULT_ROOT_MARGIN,
        threshold: OBSERVER_THRESHOLD
    });
/**
 * Get the payload that will be dispatched to Redux to set the last read verse.
 *
 * @param {Element} element
 * @returns {{verseKey: string,chapterId: string,page: string,hizb: string}}
 */ const getObservedVersePayload = (element)=>({
        verseKey: element.getAttribute("data-verse-key"),
        chapterId: element.getAttribute("data-chapter-id"),
        page: element.getAttribute("data-page"),
        hizb: element.getAttribute("data-hizb")
    });


/***/ }),

/***/ 35527:
/***/ ((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 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 _QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(40608);
/* harmony import */ var _QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11__);
/* harmony import */ var _OverflowVerseActionsMenuBody_module_scss__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(89019);
/* harmony import */ var _OverflowVerseActionsMenuBody_module_scss__WEBPACK_IMPORTED_MODULE_10___default = /*#__PURE__*/__webpack_require__.n(_OverflowVerseActionsMenuBody_module_scss__WEBPACK_IMPORTED_MODULE_10__);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(50497);
/* harmony import */ var _dls_PopoverMenu_PopoverMenu__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(99163);
/* harmony import */ var _dls_Spinner_Spinner__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(7190);
/* harmony import */ var _icons_menu_more_horiz_svg__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(80275);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(55943);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__, _dls_PopoverMenu_PopoverMenu__WEBPACK_IMPORTED_MODULE_6__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_9__]);
([_dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__, _dls_PopoverMenu_PopoverMenu__WEBPACK_IMPORTED_MODULE_6__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_9__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);
/* eslint-disable react/no-multi-comp */ 











const OverflowVerseActionsMenuBody = next_dynamic__WEBPACK_IMPORTED_MODULE_3___default()(null, {
    loadableGenerated: {
        modules: [
            "../components/Verse/OverflowVerseActionsMenu.tsx -> " + "./OverflowVerseActionsMenuBody"
        ]
    },
    ssr: false,
    loading: ()=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Spinner_Spinner__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .Z, {})
});
const OverflowVerseActionsMenu = ({ verse , isTranslationView =true , onActionTriggered , bookmarksRangeUrl ,  })=>{
    const { t  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4___default()("common");
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
        className: (_OverflowVerseActionsMenuBody_module_scss__WEBPACK_IMPORTED_MODULE_10___default().container),
        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_PopoverMenu_PopoverMenu__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
            trigger: /*#__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,
                tooltip: t("more"),
                variant: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__/* .ButtonVariant.Ghost */ .Wu.Ghost,
                shape: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_5__/* .ButtonShape.Circle */ .jL.Circle,
                className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().iconContainer), (_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().verseAction), {
                    [(_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().fadedVerseAction)]: isTranslationView
                }, "overflow-verse-actions-menu-trigger"),
                ariaLabel: t("more"),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
                    className: (_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_11___default().icon),
                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_menu_more_horiz_svg__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z, {})
                })
            }),
            isModal: true,
            isPortalled: true,
            onOpenChange: (open)=>{
                (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_9__/* .logEvent */ .Kz)(`${isTranslationView ? "translation_view" : "reading_view"}_verse_actions_menu_${open ? "open" : "close"}`);
            },
            children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(OverflowVerseActionsMenuBody, {
                verse: verse,
                isTranslationView: isTranslationView,
                onActionTriggered: onActionTriggered,
                bookmarksRangeUrl: bookmarksRangeUrl
            })
        })
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (OverflowVerseActionsMenu);

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

/***/ }),

/***/ 70256:
/***/ ((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 _QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(40608);
/* harmony import */ var _QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_19___default = /*#__PURE__*/__webpack_require__.n(_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_19__);
/* harmony import */ var _components_dls_Spinner_Spinner__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(7190);
/* harmony import */ var _components_Onboarding_OnboardingChecklist_hooks_OnboardingEvent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(74008);
/* harmony import */ var _components_Onboarding_OnboardingProvider__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(51879);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(50497);
/* harmony import */ var _hooks_useGetQueryParamOrXstateValue__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(93134);
/* harmony import */ var _icons_play_outline_svg__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(68973);
/* harmony import */ var _types_OnboardingGroup__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(20661);
/* harmony import */ var _types_QueryParam__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(11721);
/* harmony import */ var _utils_chapter__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(95892);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(55943);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(44519);
/* harmony import */ var src_contexts_DataContext__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(70813);
/* harmony import */ var src_xstate_actors_audioPlayer_selectors__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(16119);
/* harmony import */ var src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(64564);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_components_Onboarding_OnboardingProvider__WEBPACK_IMPORTED_MODULE_7__, _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__, _hooks_useGetQueryParamOrXstateValue__WEBPACK_IMPORTED_MODULE_9__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_14__, src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_18__]);
([_components_Onboarding_OnboardingProvider__WEBPACK_IMPORTED_MODULE_7__, _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__, _hooks_useGetQueryParamOrXstateValue__WEBPACK_IMPORTED_MODULE_9__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_14__, src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_18__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);




















const PlayVerseAudioButton = ({ verseKey , isTranslationView =true , onActionTriggered ,  })=>{
    const audioService = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_18__/* .AudioPlayerMachineContext */ .c);
    const { t  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_4___default()("common");
    const { value: reciterId , isQueryParamDifferent: reciterQueryParamDifferent ,  } = (0,_hooks_useGetQueryParamOrXstateValue__WEBPACK_IMPORTED_MODULE_9__/* ["default"] */ .Z)(_types_QueryParam__WEBPACK_IMPORTED_MODULE_12__/* ["default"].Reciter */ .Z.Reciter);
    const isVisible = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_2__.useSelector)(audioService, (state)=>state.matches("VISIBLE"));
    const { isActive , activeStepGroup , nextStep  } = (0,_components_Onboarding_OnboardingProvider__WEBPACK_IMPORTED_MODULE_7__/* .useOnboarding */ .P)();
    const isVerseLoading = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_2__.useSelector)(audioService, (state)=>(0,src_xstate_actors_audioPlayer_selectors__WEBPACK_IMPORTED_MODULE_17__/* .selectIsVerseLoading */ .eU)(state, verseKey));
    const chapterId = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_15__/* .getChapterNumberFromKey */ .Tc)(verseKey);
    const verseNumber = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_15__/* .getVerseNumberFromKey */ .tR)(verseKey);
    const chaptersData = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(src_contexts_DataContext__WEBPACK_IMPORTED_MODULE_16__/* ["default"] */ .Z);
    const chapterData = (0,_utils_chapter__WEBPACK_IMPORTED_MODULE_13__/* .getChapterData */ .dy)(chaptersData, chapterId.toString());
    const onPlayClicked = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(()=>{
        // eslint-disable-next-line i18next/no-literal-string
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_14__/* .logButtonClick */ .MY)(`${isTranslationView ? "translation_view" : "reading_view"}_play_verse`);
        audioService.send({
            type: "PLAY_AYAH",
            surah: chapterId,
            ayahNumber: verseNumber,
            reciterId: reciterQueryParamDifferent ? reciterId : undefined
        });
        if (onActionTriggered) {
            onActionTriggered();
        }
        // if the user clicks on the play button while the onboarding is active, we should automatically go to the next step
        if (isActive && activeStepGroup === _types_OnboardingGroup__WEBPACK_IMPORTED_MODULE_11__/* ["default"].READING_EXPERIENCE */ .Z.READING_EXPERIENCE && isVisible) {
            // audio player menu item step
            nextStep();
        }
    }, [
        activeStepGroup,
        audioService,
        chapterId,
        isActive,
        isTranslationView,
        isVisible,
        nextStep,
        onActionTriggered,
        reciterId,
        reciterQueryParamDifferent,
        verseNumber, 
    ]);
    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(()=>{
        const handlePlayAudioStep = ()=>{
            onPlayClicked();
        };
        window.addEventListener(_components_Onboarding_OnboardingChecklist_hooks_OnboardingEvent__WEBPACK_IMPORTED_MODULE_6__/* ["default"].STEP_AFTER_PLAY_AUDIO_CLICK */ .Z.STEP_AFTER_PLAY_AUDIO_CLICK, handlePlayAudioStep);
        return ()=>{
            window.removeEventListener(_components_Onboarding_OnboardingChecklist_hooks_OnboardingEvent__WEBPACK_IMPORTED_MODULE_6__/* ["default"].STEP_AFTER_PLAY_AUDIO_CLICK */ .Z.STEP_AFTER_PLAY_AUDIO_CLICK, handlePlayAudioStep);
        };
    }, [
        nextStep,
        onPlayClicked
    ]);
    if (isVerseLoading) {
        return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .ZP, {
            size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* .ButtonSize.Small */ .qE.Small,
            tooltip: t("loading"),
            type: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* .ButtonType.Success */ .L$.Success,
            shape: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* .ButtonShape.Circle */ .jL.Circle,
            variant: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* .ButtonVariant.Ghost */ .Wu.Ghost,
            className: "play-audio-button" // this class is for onboarding
            ,
            children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_dls_Spinner_Spinner__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {})
        });
    }
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .ZP, {
        size: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* .ButtonSize.Small */ .qE.Small,
        tooltip: t("audio.player.play"),
        variant: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* .ButtonVariant.Ghost */ .Wu.Ghost,
        onClick: onPlayClicked,
        shouldFlipOnRTL: false,
        shape: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_8__/* .ButtonShape.Circle */ .jL.Circle,
        id: "play-verse-button" // this ID is for onboarding
        ,
        className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_19___default().iconContainer), (_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_19___default().verseAction), {
            [(_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_19___default().fadedVerseAction)]: isTranslationView
        }),
        ariaLabel: t("aria.play-surah", {
            surahName: chapterData.transliteratedName
        }),
        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
            className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_19___default().icon), (_QuranReader_TranslationView_TranslationViewCell_module_scss__WEBPACK_IMPORTED_MODULE_19___default().playIcon)),
            children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_play_outline_svg__WEBPACK_IMPORTED_MODULE_10__/* ["default"] */ .Z, {})
        })
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PlayVerseAudioButton);

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

/***/ }),

/***/ 66606:
/***/ ((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 */   "S": () => (/* binding */ ContentModalSize),
/* 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 _radix_ui_react_dialog__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(77715);
/* 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_router__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(71853);
/* harmony import */ var next_router__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(next_router__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _Button_Button__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(50497);
/* harmony import */ var _ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(19426);
/* harmony import */ var _ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _icons_close_svg__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(51053);
/* harmony import */ var _utils_locale__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(24709);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_radix_ui_react_dialog__WEBPACK_IMPORTED_MODULE_2__, _Button_Button__WEBPACK_IMPORTED_MODULE_5__]);
([_radix_ui_react_dialog__WEBPACK_IMPORTED_MODULE_2__, _Button_Button__WEBPACK_IMPORTED_MODULE_5__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);









var ContentModalSize;
(function(ContentModalSize) {
    ContentModalSize["SMALL"] = "small";
    ContentModalSize["MEDIUM"] = "medium";
})(ContentModalSize || (ContentModalSize = {}));
const SCROLLBAR_WIDTH = 15;
const ContentModal = ({ isOpen , onClose , onEscapeKeyDown , hasCloseButton , children , header , innerRef , contentClassName , size =ContentModalSize.MEDIUM , isFixedHeight , hasHeader =true  })=>{
    const overlayRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)();
    const { locale  } = (0,next_router__WEBPACK_IMPORTED_MODULE_4__.useRouter)();
    (0,react__WEBPACK_IMPORTED_MODULE_1__.useImperativeHandle)(innerRef, ()=>({
            scrollToTop: ()=>{
                if (overlayRef.current) overlayRef.current.scrollTop = 0;
            }
        }));
    /**
   * We need to manually check what the user is targeting. If it lies at the
   * area where the scroll bar is (assuming the scrollbar width is equivalent
   * to SCROLLBAR_WIDTH), then we don't close the Modal, otherwise we do.
   * We also need to check if the current locale is RTL or LTR because the side
   * where the scrollbar is will be different and therefor the value of
   * {e.detail.originalEvent.offsetX} will be different.
   *
   * inspired by {@see https://github.com/radix-ui/primitives/issues/1280#issuecomment-1198248523}
   *
   * @param {any} e
   */ const onPointerDownOutside = (e)=>{
        const currentTarget = e.currentTarget;
        const shouldPreventOnClose = (0,_utils_locale__WEBPACK_IMPORTED_MODULE_7__/* .isRTLLocale */ .iS)(locale) ? e.detail.originalEvent.offsetX < SCROLLBAR_WIDTH // left side of the screen clicked
         : e.detail.originalEvent.offsetX > currentTarget.clientWidth - SCROLLBAR_WIDTH; // right side of the screen clicked
        if (shouldPreventOnClose) {
            e.preventDefault();
            return;
        }
        if (onClose) {
            onClose();
        }
    };
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_radix_ui_react_dialog__WEBPACK_IMPORTED_MODULE_2__.Root, {
        open: isOpen,
        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_radix_ui_react_dialog__WEBPACK_IMPORTED_MODULE_2__.Portal, {
            children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_radix_ui_react_dialog__WEBPACK_IMPORTED_MODULE_2__.Overlay, {
                className: (_ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8___default().overlay),
                ref: overlayRef,
                children: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_radix_ui_react_dialog__WEBPACK_IMPORTED_MODULE_2__.Content, {
                    className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8___default().contentWrapper), {
                        [contentClassName]: contentClassName,
                        [(_ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8___default().small)]: size === ContentModalSize.SMALL,
                        [(_ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8___default().medium)]: size === ContentModalSize.MEDIUM,
                        [(_ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8___default().autoHeight)]: !isFixedHeight
                    }),
                    onEscapeKeyDown: onEscapeKeyDown,
                    onPointerDownOutside: onPointerDownOutside,
                    children: [
                        hasHeader && /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
                            className: (_ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8___default().header),
                            children: [
                                hasCloseButton && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_radix_ui_react_dialog__WEBPACK_IMPORTED_MODULE_2__.Close, {
                                    className: (_ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8___default().closeIcon),
                                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_Button_Button__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .ZP, {
                                        variant: _Button_Button__WEBPACK_IMPORTED_MODULE_5__/* .ButtonVariant.Ghost */ .Wu.Ghost,
                                        shape: _Button_Button__WEBPACK_IMPORTED_MODULE_5__/* .ButtonShape.Circle */ .jL.Circle,
                                        onClick: onClose,
                                        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_close_svg__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {})
                                    })
                                }),
                                header
                            ]
                        }),
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                            className: (_ContentModal_module_scss__WEBPACK_IMPORTED_MODULE_8___default().content),
                            children: children
                        })
                    ]
                })
            })
        })
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ContentModal);

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

/***/ }),

/***/ 12550:
/***/ ((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 _Counter_module_scss__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(16962);
/* harmony import */ var _Counter_module_scss__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_Counter_module_scss__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _dls_Button_Button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(50497);
/* harmony import */ var _icons_minus_svg__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(49039);
/* harmony import */ var _icons_plus_svg__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(4474);
/* harmony import */ var _utils_locale__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(24709);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Button_Button__WEBPACK_IMPORTED_MODULE_3__]);
_dls_Button_Button__WEBPACK_IMPORTED_MODULE_3__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];








/**
 *
 * @param {CounterProps} props - the props of the this component
 * @param {number} props.count - the current count
 * @param {() => void} props.onIncrement - the function to call when the increment button is clicked.
 * Button is disabled when  the value is `undefined` or `null`
 * @param {() => void} props.onDecrement - the function to call when the decrement button is clicked.
 * Button is disabled when  the value is `undefined` or `null`
 * @returns {JSX.Element}
 */ const Counter = ({ count , onIncrement , onDecrement  })=>{
    const { t , lang  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_2___default()("common");
    const localizedCount = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(()=>(0,_utils_locale__WEBPACK_IMPORTED_MODULE_6__/* .toLocalizedNumber */ .rQ)(Number(count), lang), [
        count,
        lang
    ]);
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: (_Counter_module_scss__WEBPACK_IMPORTED_MODULE_7___default().container),
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .ZP, {
                tooltip: t("counter.decrease"),
                shape: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_3__/* .ButtonShape.Circle */ .jL.Circle,
                variant: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_3__/* .ButtonVariant.Ghost */ .Wu.Ghost,
                isDisabled: !onDecrement,
                onClick: onDecrement,
                ariaLabel: t("counter.decrease"),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_minus_svg__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {})
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
                className: (_Counter_module_scss__WEBPACK_IMPORTED_MODULE_7___default().count),
                children: localizedCount
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Button_Button__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .ZP, {
                tooltip: t("counter.increase"),
                variant: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_3__/* .ButtonVariant.Ghost */ .Wu.Ghost,
                shape: _dls_Button_Button__WEBPACK_IMPORTED_MODULE_3__/* .ButtonShape.Circle */ .jL.Circle,
                isDisabled: !onIncrement,
                onClick: onIncrement,
                ariaLabel: t("counter.increase"),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_plus_svg__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {})
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Counter);

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

/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__),
/* harmony export */   "h": () => (/* binding */ SelectSize)
/* 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 _Select_module_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(40458);
/* harmony import */ var _Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_Select_module_scss__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _icons_caret_down_svg__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(85970);





var SelectSize;
(function(SelectSize) {
    SelectSize["Small"] = "small";
    SelectSize["Medium"] = "medium";
    SelectSize["Large"] = "large";
})(SelectSize || (SelectSize = {}));
const Select = ({ name , id , onChange , options , value , disabled =false , required =false , size =SelectSize.Medium , placeholder ="Select an option" , defaultStyle =true , className , withBackground =true ,  })=>{
    const onSelectChange = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)((e)=>{
        if (onChange) {
            onChange(e.target.value);
        }
    }, [
        onChange
    ]);
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().container), {
            [(_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().defaultStyledContainer)]: defaultStyle,
            [className]: className,
            [(_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().disabledContainer)]: disabled,
            [(_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().smallContainer)]: size === SelectSize.Small,
            [(_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().mediumContainer)]: size === SelectSize.Medium,
            [(_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().largeContainer)]: size === SelectSize.Large,
            [(_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().withBackground)]: withBackground
        }),
        children: [
            /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("select", {
                className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().select), {
                    [(_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().defaultStyledSelect)]: defaultStyle,
                    [(_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().disabledSelect)]: disabled
                }),
                name: name,
                id: id,
                onChange: onSelectChange,
                disabled: disabled,
                required: required,
                ...value ? {
                    value
                } : {
                    defaultValue: ""
                },
                children: [
                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("option", {
                        value: "",
                        disabled: true,
                        hidden: true,
                        children: placeholder
                    }),
                    options.map((option)=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("option", {
                            value: option.value,
                            disabled: option.disabled || false,
                            children: option.label
                        }, option.value))
                ]
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                className: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().arrow), {
                    [(_Select_module_scss__WEBPACK_IMPORTED_MODULE_4___default().disabledArrow)]: disabled
                }),
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_icons_caret_down_svg__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z, {})
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Select);


/***/ }),

/***/ 74306:
/***/ ((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 _dls_Popover__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(25914);
/* harmony import */ var _dls_Tooltip__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(8884);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Popover__WEBPACK_IMPORTED_MODULE_2__, _dls_Tooltip__WEBPACK_IMPORTED_MODULE_3__]);
([_dls_Popover__WEBPACK_IMPORTED_MODULE_2__, _dls_Tooltip__WEBPACK_IMPORTED_MODULE_3__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);




/**
 * A component that combines the functionality of a Popover and a Tooltip together.
 * This is needed to handle the case when we want to show a Tooltip on mobile but
 * since Tooltip is only hoverable and there is no hovering on mobile devices,
 * we provide the same functionality by using a Popover which handles clicking.
 *
 * @param {Props} props
 * @returns {JSX.Element}
 */ const HoverablePopover = ({ content , children , onOpenChange , contentSide =_dls_Popover__WEBPACK_IMPORTED_MODULE_2__/* .ContentSide.TOP */ .iw.TOP , tip =true , tooltipDelay =0 , defaultStyling =true , isOpen , triggerStyles , isContainerSpan =false  })=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Popover__WEBPACK_IMPORTED_MODULE_2__/* ["default"] */ .ZP, {
        open: isOpen,
        triggerStyles: triggerStyles,
        contentSide: contentSide,
        useTooltipStyles: true,
        ...onOpenChange && {
            onOpenChange
        },
        defaultStyling: defaultStyling,
        isContainerSpan: isContainerSpan,
        trigger: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Tooltip__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .ZP, {
            open: isOpen,
            tip: tip,
            text: content,
            contentSide: contentSide,
            delay: tooltipDelay,
            ...onOpenChange && {
                onOpenChange
            },
            children: children
        }),
        tip: tip,
        children: content
    });
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (HoverablePopover);

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

/***/ }),

/***/ 25914:
/***/ ((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 */   "ZP": () => (__WEBPACK_DEFAULT_EXPORT__),
/* harmony export */   "iw": () => (/* binding */ ContentSide)
/* harmony export */ });
/* unused harmony export ContentAlign */
/* 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 _radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(98680);
/* 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 _Popover_module_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(29267);
/* harmony import */ var _Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4__);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__]);
_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];





var ContentSide;
(function(ContentSide) {
    ContentSide["TOP"] = "top";
    ContentSide["RIGHT"] = "right";
    ContentSide["BOTTOM"] = "bottom";
    ContentSide["LEFT"] = "left";
})(ContentSide || (ContentSide = {}));
var ContentAlign;
(function(ContentAlign) {
    ContentAlign["START"] = "start";
    ContentAlign["CENTER"] = "center";
    ContentAlign["END"] = "end";
})(ContentAlign || (ContentAlign = {}));
const Popover = ({ children , trigger , onOpenChange , open , isModal =false , contentSide =ContentSide.BOTTOM , contentAlign =ContentAlign.CENTER , avoidCollisions =true , tip =false , useTooltipStyles =false , defaultStyling =true , isPortalled =true , contentSideOffset =2 , triggerStyles , contentStyles , isContainerSpan =false ,  })=>{
    const content = /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__.Content, {
        sideOffset: contentSideOffset,
        side: contentSide,
        align: contentAlign,
        avoidCollisions: avoidCollisions,
        className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default().content), {
            [(_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default().tooltipContent)]: useTooltipStyles,
            [contentStyles]: contentStyles
        }),
        children: [
            children,
            tip && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__.Arrow, {})
        ]
    });
    const containerChild = /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__.Root, {
        modal: isModal,
        ...typeof open !== "undefined" && {
            open
        },
        ...onOpenChange && {
            onOpenChange
        },
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__.Trigger, {
                "aria-label": "Open popover",
                asChild: true,
                children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
                    className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default().trigger), {
                        [triggerStyles]: triggerStyles
                    }),
                    children: trigger
                })
            }),
            isPortalled ? /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_radix_ui_react_popover__WEBPACK_IMPORTED_MODULE_2__.Portal, {
                children: content
            }) : content
        ]
    });
    if (isContainerSpan) {
        return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
            className: classnames__WEBPACK_IMPORTED_MODULE_3___default()({
                [(_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default().container)]: defaultStyling
            }),
            children: containerChild
        });
    }
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
        className: classnames__WEBPACK_IMPORTED_MODULE_3___default()({
            [(_Popover_module_scss__WEBPACK_IMPORTED_MODULE_4___default().container)]: defaultStyling
        }),
        children: containerChild
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Popover);

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

/***/ }),

/***/ 17543:
/***/ ((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 */   "q": () => (/* binding */ DATA_ATTRIBUTE_WORD_LOCATION)
/* 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 _InlineWordByWord__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(77296);
/* harmony import */ var _getToolTipText__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(99600);
/* harmony import */ var _GlyphWord__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(72214);
/* harmony import */ var _playWordAudio__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(72898);
/* harmony import */ var _QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(16527);
/* harmony import */ var _QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_24___default = /*#__PURE__*/__webpack_require__.n(_QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_24__);
/* harmony import */ var _TajweedWordImage__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(28542);
/* harmony import */ var _TextWord__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(72816);
/* harmony import */ var _components_QuranReader_ReadingView_WordPopover__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(90127);
/* harmony import */ var _components_Wrapper_Wrapper__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(41701);
/* harmony import */ var _dls_Popover_HoverablePopover__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(74306);
/* harmony import */ var _redux_slices_AudioPlayer_state__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(53800);
/* harmony import */ var _redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(90264);
/* harmony import */ var _utils_array__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(5639);
/* harmony import */ var _utils_datetime__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(76410);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(55943);
/* harmony import */ var _utils_fontFaceHelper__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(64198);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(44519);
/* harmony import */ var src_xstate_actors_audioPlayer_audioPlayerMachineHelper__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(93608);
/* harmony import */ var src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(64564);
/* harmony import */ var types_QuranReader__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(50467);
/* harmony import */ var types_Word__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(42217);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_playWordAudio__WEBPACK_IMPORTED_MODULE_8__, _components_QuranReader_ReadingView_WordPopover__WEBPACK_IMPORTED_MODULE_11__, _dls_Popover_HoverablePopover__WEBPACK_IMPORTED_MODULE_12__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_16__, src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_20__]);
([_playWordAudio__WEBPACK_IMPORTED_MODULE_8__, _components_QuranReader_ReadingView_WordPopover__WEBPACK_IMPORTED_MODULE_11__, _dls_Popover_HoverablePopover__WEBPACK_IMPORTED_MODULE_12__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_16__, src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_20__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);
/* eslint-disable max-lines */ 

























const DATA_ATTRIBUTE_WORD_LOCATION = "data-word-location";
const QuranWord = ({ word , font , isWordByWordAllowed =true , isAudioHighlightingAllowed =true , isHighlighted , shouldShowSecondaryHighlight =false , isFontLoaded =true  })=>{
    const wordClickFunctionality = (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(_redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_14__/* .selectWordClickFunctionality */ .N9);
    const audioService = (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_20__/* .AudioPlayerMachineContext */ .c);
    const showTooltipWhenPlayingAudio = (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(_redux_slices_AudioPlayer_state__WEBPACK_IMPORTED_MODULE_13__/* .selectShowTooltipWhenPlayingAudio */ .ow);
    const { 0: isTooltipOpened , 1: setIsTooltipOpened  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const { showWordByWordTranslation , showWordByWordTransliteration  } = (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(_redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_14__/* .selectInlineDisplayWordByWordPreferences */ .eB, react_redux__WEBPACK_IMPORTED_MODULE_4__.shallowEqual);
    const readingPreference = (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(_redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_14__/* .selectReadingPreference */ .EA);
    const showTooltipFor = (0,react_redux__WEBPACK_IMPORTED_MODULE_4__.useSelector)(_redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_14__/* .selectTooltipContentType */ .SV, _utils_array__WEBPACK_IMPORTED_MODULE_23__/* .areArraysEqual */ .Hj);
    // creating wordLocation instead of using `word.location` because
    // the value of `word.location` is `1:3:5-7`, but we want `1:3:5`
    const wordLocation = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_18__/* .makeWordLocation */ .G$)(word.verseKey, word.position);
    // Determine if the audio player is currently playing the word
    const isAudioPlayingWord = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_2__.useSelector)(audioService, (state)=>{
        const { surah , ayahNumber , wordLocation: wordPosition  } = state.context;
        return `${surah}:${ayahNumber}:${wordPosition}` === wordLocation;
    });
    const isWordByWordLayout = showWordByWordTranslation || showWordByWordTransliteration;
    let wordText = null;
    if ((0,_utils_fontFaceHelper__WEBPACK_IMPORTED_MODULE_17__/* .isQCFFont */ .Fy)(font)) {
        wordText = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_GlyphWord__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .Z, {
            font: font,
            qpcUthmaniHafs: word.qpcUthmaniHafs,
            pageNumber: word.pageNumber,
            textCodeV1: word.codeV1,
            textCodeV2: word.codeV2,
            isFontLoaded: isFontLoaded
        });
    } else if (font === types_QuranReader__WEBPACK_IMPORTED_MODULE_21__/* .QuranFont.Tajweed */ .fr.Tajweed) {
        wordText = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_TajweedWordImage__WEBPACK_IMPORTED_MODULE_9__/* ["default"] */ .Z, {
            path: word.text,
            alt: word.textUthmani
        });
    } else if (word.charTypeName !== types_Word__WEBPACK_IMPORTED_MODULE_22__/* .CharType.Pause */ .H.Pause) {
        wordText = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_TextWord__WEBPACK_IMPORTED_MODULE_10__/* ["default"] */ .Z, {
            font: font,
            text: word.text,
            charType: word.charTypeName
        });
    }
    /*
    Only show the tooltip when the following conditions are met:

    1. When the current character is of type Word.
    2. When it's allowed to have word by word (won't be allowed for search results as of now).
    3. When the tooltip settings are set to either translation or transliteration or both.
  */ const showTooltip = word.charTypeName === types_Word__WEBPACK_IMPORTED_MODULE_22__/* .CharType.Word */ .H.Word && isWordByWordAllowed && !!showTooltipFor.length;
    const shouldBeHighLighted = isHighlighted || isTooltipOpened || isAudioHighlightingAllowed && isAudioPlayingWord;
    const translationViewTooltipContent = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(()=>isWordByWordAllowed ? (0,_getToolTipText__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z)(showTooltipFor, word) : null, [
        isWordByWordAllowed,
        showTooltipFor,
        word
    ]);
    const isRecitationEnabled = wordClickFunctionality === types_QuranReader__WEBPACK_IMPORTED_MODULE_21__/* .WordClickFunctionality.PlayAudio */ .MB.PlayAudio;
    const onClick = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(()=>{
        if (isRecitationEnabled) {
            (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_16__/* .logButtonClick */ .MY)("quran_word_pronounce");
            const currentState = audioService.getSnapshot();
            const isPlaying = currentState.matches("VISIBLE.AUDIO_PLAYER_INITIATED.PLAYING");
            const currentSurah = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_18__/* .getChapterNumberFromKey */ .Tc)(word.verseKey);
            const isSameSurah = currentState.context.surah === Number(currentSurah);
            const shouldSeekTo = isPlaying && isSameSurah;
            if (shouldSeekTo) {
                const wordSegment = (0,src_xstate_actors_audioPlayer_audioPlayerMachineHelper__WEBPACK_IMPORTED_MODULE_19__/* .getWordTimeSegment */ .Po)(currentState.context.audioData.verseTimings, word);
                if (!wordSegment) return;
                const [startTime] = wordSegment;
                audioService.send({
                    type: "SEEK_TO",
                    timestamp: (0,_utils_datetime__WEBPACK_IMPORTED_MODULE_15__/* .milliSecondsToSeconds */ .Rp)(startTime)
                });
            } else {
                (0,_playWordAudio__WEBPACK_IMPORTED_MODULE_8__/* ["default"] */ .Z)(word);
            }
        } else {
            (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_16__/* .logButtonClick */ .MY)("quran_word");
        }
    }, [
        audioService,
        isRecitationEnabled,
        word
    ]);
    const shouldHandleWordClicking = readingPreference === types_QuranReader__WEBPACK_IMPORTED_MODULE_21__/* .ReadingPreference.Translation */ .m3.Translation && word.charTypeName !== types_Word__WEBPACK_IMPORTED_MODULE_22__/* .CharType.End */ .H.End;
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        ...shouldHandleWordClicking && {
            onClick,
            onKeyPress: onClick
        },
        role: "button",
        tabIndex: 0,
        [DATA_ATTRIBUTE_WORD_LOCATION]: wordLocation,
        className: classnames__WEBPACK_IMPORTED_MODULE_3___default()((_QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_24___default().container), {
            [(_QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_24___default().highlightOnHover)]: isRecitationEnabled,
            [(_QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_24___default().highlighted)]: shouldBeHighLighted,
            [(_QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_24___default().secondaryHighlight)]: shouldShowSecondaryHighlight,
            [(_QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_24___default().wbwContainer)]: isWordByWordLayout,
            [(_QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_24___default().additionalWordGap)]: readingPreference === types_QuranReader__WEBPACK_IMPORTED_MODULE_21__/* .ReadingPreference.Translation */ .m3.Translation,
            [(_QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_24___default().tajweedWord)]: font === types_QuranReader__WEBPACK_IMPORTED_MODULE_21__/* .QuranFont.Tajweed */ .fr.Tajweed
        }),
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_Wrapper_Wrapper__WEBPACK_IMPORTED_MODULE_25__/* ["default"] */ .Z, {
                shouldWrap: showTooltip,
                wrapper: (children)=>readingPreference === types_QuranReader__WEBPACK_IMPORTED_MODULE_21__/* .ReadingPreference.Translation */ .m3.Translation ? /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Popover_HoverablePopover__WEBPACK_IMPORTED_MODULE_12__/* ["default"] */ .Z, {
                        isOpen: isAudioPlayingWord && showTooltipWhenPlayingAudio ? true : undefined,
                        defaultStyling: false,
                        content: translationViewTooltipContent,
                        onOpenChange: setIsTooltipOpened,
                        children: children
                    }) : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_components_QuranReader_ReadingView_WordPopover__WEBPACK_IMPORTED_MODULE_11__/* ["default"] */ .Z, {
                        word: word,
                        children: children
                    }),
                children: wordText
            }),
            isWordByWordAllowed && /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
                children: [
                    showWordByWordTransliteration && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_InlineWordByWord__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                        text: word.transliteration?.text
                    }),
                    showWordByWordTranslation && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_InlineWordByWord__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
                        text: word.translation?.text
                    })
                ]
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (/*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.memo)(QuranWord));

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

/***/ }),

/***/ 99600:
/***/ ((__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 _QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16527);
/* harmony import */ var _QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_1__);


/**
 * Generate the Tooltip content based on the settings.
 *
 * @param {WordByWordType[]} showTooltipFor
 * @param {Word} word
 * @returns {ReactNode}
 */ const getTooltipText = (showTooltipFor, word)=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
        children: showTooltipFor.map((tooltipTextType)=>/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("p", {
                className: (_QuranWord_module_scss__WEBPACK_IMPORTED_MODULE_1___default().tooltipText),
                children: word[tooltipTextType].text
            }, tooltipTextType))
    });
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (getTooltipText);


/***/ }),

/***/ 72898:
/***/ ((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 _utils_audio__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(83073);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(55943);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_utils_eventLogger__WEBPACK_IMPORTED_MODULE_0__]);
_utils_eventLogger__WEBPACK_IMPORTED_MODULE_0__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];


const playWordAudio = (word)=>{
    playWordByWordAudio(`${_utils_audio__WEBPACK_IMPORTED_MODULE_1__/* .QURANCDN_AUDIO_BASE_URL */ .HN}${word.audioUrl}`);
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (playWordAudio);
/**
 * Given an audio url
 * 1) stop the word by word audio player if it's currently playing
 * 2) pause the main audio player if it's currently playing
 * 3) play the word by word audio
 * 4) resume the main audio player it it's previously was playing
 *
 * Terms
 * - main audio player refer to the audio player in the bottom navbar, this audio player plays the entire chapter
 * - word by word audio player refer to the audio player that play the clicked word
 *
 * @param {string} url
 */ const playWordByWordAudio = (url)=>{
    // stop the audio and remove the DOM if it exists
    if (window.wordByWordAudioPlayerEl) {
        window.wordByWordAudioPlayerEl.pause();
        window.wordByWordAudioPlayerEl.remove();
        window.wordByWordAudioPlayerEl = null;
    }
    const removeDOM = ()=>{
        window.wordByWordAudioPlayerEl.removeEventListener("ended", removeDOM);
        window.wordByWordAudioPlayerEl.remove();
    };
    window.wordByWordAudioPlayerEl = new Audio(url);
    (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_0__/* .logEvent */ .Kz)("load_audio_file", {
        audioUrl: url
    });
    window.wordByWordAudioPlayerEl.play();
    window.wordByWordAudioPlayerEl.addEventListener("ended", removeDOM);
};

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

/***/ }),

/***/ 80211:
/***/ ((__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 next_router__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(71853);
/* harmony import */ var next_router__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(next_router__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6022);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(90264);
/* harmony import */ var _redux_slices_QuranReader_translations__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(88548);
/* harmony import */ var _utils_array__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(5639);
/* harmony import */ var _utils_query_params__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(61927);
/* harmony import */ var _utils_queryParamValidator__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(88584);
/* harmony import */ var types_QueryParam__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(11721);
/* eslint-disable @typescript-eslint/no-explicit-any */ 







const QUERY_PARAMS_DATA = {
    [types_QueryParam__WEBPACK_IMPORTED_MODULE_5__/* ["default"].Translations */ .Z.Translations]: {
        reduxSelector: _redux_slices_QuranReader_translations__WEBPACK_IMPORTED_MODULE_3__/* .selectSelectedTranslations */ .qw,
        reduxEqualityFunction: _utils_array__WEBPACK_IMPORTED_MODULE_6__/* .areArraysEqual */ .Hj,
        valueType: _utils_query_params__WEBPACK_IMPORTED_MODULE_4__/* .QueryParamValueType.ArrayOfNumbers */ .dp.ArrayOfNumbers,
        validate: (val)=>(0,_utils_queryParamValidator__WEBPACK_IMPORTED_MODULE_7__/* .isValidTranslationsQueryParamValue */ .W)(val)
    },
    [types_QueryParam__WEBPACK_IMPORTED_MODULE_5__/* ["default"].WBW_LOCALE */ .Z.WBW_LOCALE]: {
        reduxSelector: _redux_slices_QuranReader_readingPreferences__WEBPACK_IMPORTED_MODULE_2__/* .selectWordByWordLocale */ .lt,
        reduxEqualityFunction: react_redux__WEBPACK_IMPORTED_MODULE_1__.shallowEqual,
        valueType: _utils_query_params__WEBPACK_IMPORTED_MODULE_4__/* .QueryParamValueType.String */ .dp.String,
        // eslint-disable-next-line @typescript-eslint/no-unused-vars
        validate: (val)=>true
    }
};
/**
 * A hook that searches the query params of the url for specific values,
 * parses them if found and if not, falls back to the Redux value and detects
 * when there is a mismatch between the query param value and the Redux value.
 *
 * @param {QueryParam} queryParam
 * @returns {{value: any, isQueryParamDifferent: boolean}}
 */ const useGetQueryParamOrReduxValue = (queryParam)=>{
    const { query , isReady  } = (0,next_router__WEBPACK_IMPORTED_MODULE_0__.useRouter)();
    let useSelectorArguments = [
        QUERY_PARAMS_DATA[queryParam].reduxSelector
    ];
    if (QUERY_PARAMS_DATA[queryParam].reduxEqualityFunction) {
        useSelectorArguments = [
            QUERY_PARAMS_DATA[queryParam].reduxSelector,
            // @ts-ignore
            QUERY_PARAMS_DATA[queryParam].reduxEqualityFunction, 
        ];
    }
    // @ts-ignore
    const selectedValue = (0,react_redux__WEBPACK_IMPORTED_MODULE_1__.useSelector)(...useSelectorArguments);
    const valueDetails = {
        value: selectedValue,
        isQueryParamDifferent: false
    };
    // TODO: this bit is identical to the one in useGetQueryParamOrXstateValue.ts, keep it DRY
    // if the param exists in the url
    if (isReady && query[queryParam]) {
        const { validate , valueType  } = QUERY_PARAMS_DATA[queryParam];
        const paramStringValue = String(query[queryParam]);
        const isValidValue = validate(paramStringValue);
        if (!isValidValue) {
            return {
                isQueryParamDifferent: false,
                value: selectedValue
            };
        }
        const parsedQueryParamValue = (0,_utils_query_params__WEBPACK_IMPORTED_MODULE_4__/* .getQueryParamValueByType */ .jr)(paramStringValue, valueType);
        const checkEquality = _utils_query_params__WEBPACK_IMPORTED_MODULE_4__/* .equalityCheckerByType */ .bq[valueType];
        const isQueryParamDifferent = !checkEquality(parsedQueryParamValue, selectedValue);
        return {
            value: parsedQueryParamValue,
            isQueryParamDifferent
        };
    }
    return valueDetails;
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useGetQueryParamOrReduxValue);


/***/ }),

/***/ 93134:
/***/ ((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__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 _xstate_react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(59456);
/* harmony import */ var _xstate_react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_xstate_react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var next_router__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(71853);
/* harmony import */ var next_router__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(next_router__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _utils_query_params__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(61927);
/* harmony import */ var _utils_queryParamValidator__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(88584);
/* harmony import */ var src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(64564);
/* harmony import */ var types_QueryParam__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(11721);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_4__]);
src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_4__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];
/* eslint-disable @typescript-eslint/no-explicit-any */ 






const QUERY_PARAMS_DATA = {
    [types_QueryParam__WEBPACK_IMPORTED_MODULE_5__/* ["default"].Reciter */ .Z.Reciter]: {
        selector: (state)=>state.context.reciterId,
        valueType: _utils_query_params__WEBPACK_IMPORTED_MODULE_3__/* .QueryParamValueType.Number */ .dp.Number,
        validate: _utils_queryParamValidator__WEBPACK_IMPORTED_MODULE_6__/* .isValidReciterId */ .o
    }
};
/**
 * A hook that searches the query params of the url for specific values,
 * parses them if found and if not, falls back to the Redux value and detects
 * when there is a mismatch between the query param value and the Redux value.
 *
 * @param {QueryParam} queryParam
 * @returns {{value: any, isQueryParamDifferent: boolean}}
 */ const useGetQueryParamOrXstateValue = (queryParam)=>{
    const { query , isReady  } = (0,next_router__WEBPACK_IMPORTED_MODULE_2__.useRouter)();
    const audioService = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(src_xstate_AudioPlayerMachineContext__WEBPACK_IMPORTED_MODULE_4__/* .AudioPlayerMachineContext */ .c);
    const { selector  } = QUERY_PARAMS_DATA[queryParam];
    const selectedValue = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_1__.useSelector)(audioService, selector);
    const defaultValueDetails = {
        value: selectedValue,
        isQueryParamDifferent: false
    };
    // if the param exists in the url
    if (isReady && query[queryParam]) {
        const { validate , valueType  } = QUERY_PARAMS_DATA[queryParam];
        const paramStringValue = String(query[queryParam]);
        const isValidValue = validate(paramStringValue);
        if (!isValidValue) {
            return {
                isQueryParamDifferent: false,
                value: selectedValue
            };
        }
        const parsedQueryParamValue = (0,_utils_query_params__WEBPACK_IMPORTED_MODULE_3__/* .getQueryParamValueByType */ .jr)(paramStringValue, valueType);
        const checkEquality = _utils_query_params__WEBPACK_IMPORTED_MODULE_3__/* .equalityCheckerByType */ .bq[valueType];
        const isQueryParamDifferent = !checkEquality(parsedQueryParamValue, selectedValue);
        return {
            value: parsedQueryParamValue,
            isQueryParamDifferent
        };
    }
    return defaultValueDetails;
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useGetQueryParamOrXstateValue);

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

/***/ }),

/***/ 91398:
/***/ ((__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 _hooks_useBrowserLayoutEffect__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(44063);
/* eslint-disable react-func/max-lines-per-function */ 

const isDev = process.env.NEXT_PUBLIC_VERCEL_ENV === "development";
/**
 * Sets a debugging text to element debugger node if we are in a dev environment
 * and the element debugger paragraph node exists.
 *
 * @param {string} text
 * @param {HTMLElement} intersectionDebuggerNode
 *
 */ const setIntersectionDebuggerNodeText = (text, intersectionDebuggerNode)=>{
    if (!isDev || !intersectionDebuggerNode) {
        return;
    }
    // eslint-disable-next-line no-param-reassign
    intersectionDebuggerNode.textContent = `OBSERVER DEBUGGER: ${text}`;
};
/**
 * A hook that will create a global observer and inject it into window so that it's
 * globally available. Once it's created, it can be used by any element that would like
 * to be observed using that observer using {@see useObserverElement} hook. This hook
 * is meant to be used for delayed element visibility callback.
 *
 * @param {IntersectionObserverInit} options
 * @param {(element:Element)=>void} onElementVisible
 * @param {string} observerId the name of the observer
 * @param {string} elementIdKey the key of the unique identifier of each element.
 * @param {string} delayForMSKey the key holding the number of milliseconds after which the observer should trigger the callback
 */ const useGlobalIntersectionObserverWithDelay = ({ threshold =1 , root =null , rootMargin ="0%"  }, onElementVisible, observerId, elementIdKey, delayForMSKey)=>{
    /**
   * An object that will hold a reference of each unique identifier and
   * the ID of the timeout function that will trigger when the element
   * is visible for delayForMS number of seconds.
   */ const timeouts = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(new Map());
    const updateEntry = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)((entries)=>{
        entries.forEach((visibleEntry)=>{
            let elementIntersectionDebuggerNode;
            if (isDev) {
                const nodes = visibleEntry.target.getElementsByClassName("debugger");
                // if at least one debugger node was found (should always be there but just to be extra sure)
                if (nodes.length) {
                    elementIntersectionDebuggerNode = nodes[0];
                }
            }
            const targetNode = visibleEntry.target;
            const elementId = targetNode.dataset[elementIdKey];
            const delayForMS = Number(targetNode.dataset[delayForMSKey]);
            // if the element content container is interacting
            if (visibleEntry.isIntersecting) {
                setIntersectionDebuggerNodeText(`Element is fully visible, triggering callback in ${delayForMS / 1000} seconds...`, elementIntersectionDebuggerNode);
                // Call the API after delayForMS
                timeouts.current.set(elementId, window.setTimeout(()=>{
                    onElementVisible(visibleEntry.target);
                    setIntersectionDebuggerNodeText(`Element callback triggered`, elementIntersectionDebuggerNode);
                }, delayForMS));
            } else {
                // if it's no longer intersecting, clear the timeout
                clearTimeout(timeouts.current.get(elementId));
                /**
           * Delete the timeout function's ID from the global array since it's no longer
           * needed and next time if the same element intersects, a new ID will be generated
           * for that element.
           */ timeouts.current.delete(elementId);
                setIntersectionDebuggerNodeText(`Element is not fully visible, won't trigger callback`, elementIntersectionDebuggerNode);
            }
        });
    }, [
        delayForMSKey,
        elementIdKey,
        onElementVisible
    ]);
    /**
   * We need to assign to window before render is done since we want to the observer to be available by the time rendering is done so that the elements to be observed can use it.
   * {@see https://kentcdodds.com/blog/useeffect-vs-uselayouteffect}
   */ (0,_hooks_useBrowserLayoutEffect__WEBPACK_IMPORTED_MODULE_1__/* ["default"] */ .Z)(()=>{
        const hasIOSupport = !!window.IntersectionObserver;
        if (!hasIOSupport) return undefined;
        // no need to create a new observer if it already exists.
        if (!window[observerId]) {
            window[observerId] = new IntersectionObserver(updateEntry, {
                threshold,
                root,
                rootMargin
            });
        }
        return ()=>{
            // manually clear all the timeouts (if any are still around)
            timeouts.current.forEach((value)=>{
                clearTimeout(value);
            });
            if (window[observerId]) {
                window[observerId].disconnect();
                window[observerId] = undefined;
            }
        };
    }, [
        root,
        rootMargin,
        threshold,
        updateEntry,
        observerId
    ]);
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useGlobalIntersectionObserverWithDelay);


/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "HN": () => (/* binding */ QURANCDN_AUDIO_BASE_URL)
/* harmony export */ });
/* unused harmony exports getVerseTimingByVerseKey, getWordByWordAudioUrl */
const getVerseTimingByVerseKey = (verseKey, verseTimings)=>{
    return verseTimings.find((verseTiming)=>verseTiming.verseKey === verseKey);
};
// format the number to match the the mp3 file name structure
// e.g formatNumber(3) => '003'
//     formatNumber(10) => '010'
const formatNumber = (num)=>num.toString().padStart(3, "0");
const QURANCDN_AUDIO_BASE_URL = "https://audio.qurancdn.com/";
/**
 * Given chapter, verse, and wordLocation. Get the mp3 audio url
 * For example
 * getWordByWordAudioUrl(1,2,1) => `'https://audio.qurancdn.com/wbw/001_002_001.mp3';
 *
 * @param {number} chapter the chapterId
 * @param {number} verse the verse number
 * @param {number} wordLocation the location of the word within a verse
 * @returns {string} audio url
 */ const getWordByWordAudioUrl = (chapter, verse, wordLocation)=>{
    const formattedChapter = formatNumber(chapter);
    const formattedVerse = formatNumber(verse);
    const formattedWordLocation = formatNumber(wordLocation);
    return `${QURANCDN_AUDIO_BASE_URL}wbw/${formattedChapter}_${formattedVerse}_${formattedWordLocation}.mp3`;
};


/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Fp": () => (/* binding */ getQuranicCalendarPostOfWeek),
/* harmony export */   "GG": () => (/* binding */ postReflectionViews),
/* harmony export */   "P_": () => (/* binding */ followUser),
/* harmony export */   "ST": () => (/* binding */ isUserFollowed)
/* harmony export */ });
/* unused harmony export getAllUserReflections */
/* harmony import */ var _apiPaths__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(65899);
/* harmony import */ var _utils_auth_api__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(37883);


const postReflectionViews = async (postId)=>(0,_utils_auth_api__WEBPACK_IMPORTED_MODULE_1__/* .postRequest */ .j0)((0,_apiPaths__WEBPACK_IMPORTED_MODULE_0__/* .makePostReflectionViewsUrl */ .PI)(postId), {});
const followUser = async (usernameOrId)=>(0,_utils_auth_api__WEBPACK_IMPORTED_MODULE_1__/* .postRequest */ .j0)((0,_apiPaths__WEBPACK_IMPORTED_MODULE_0__/* .makeFollowUserUrl */ .bE)(usernameOrId), {});
const isUserFollowed = async (usernameOrId)=>{
    return (0,_utils_auth_api__WEBPACK_IMPORTED_MODULE_1__/* .privateFetcher */ .UK)((0,_apiPaths__WEBPACK_IMPORTED_MODULE_0__/* .makeIsUserFollowedUrl */ .BC)(usernameOrId));
};
const getAllUserReflections = async (params)=>{
    return privateFetcher(makeGetUserReflectionsUrl(params));
};
const getQuranicCalendarPostOfWeek = async (weekNumber)=>{
    return (0,_utils_auth_api__WEBPACK_IMPORTED_MODULE_1__/* .privateFetcher */ .UK)((0,_apiPaths__WEBPACK_IMPORTED_MODULE_0__/* .makeQuranicCalendarPostOfWeekUrl */ .Sv)(weekNumber));
};


/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "BC": () => (/* binding */ makeIsUserFollowedUrl),
/* harmony export */   "PI": () => (/* binding */ makePostReflectionViewsUrl),
/* harmony export */   "Sv": () => (/* binding */ makeQuranicCalendarPostOfWeekUrl),
/* harmony export */   "YV": () => (/* binding */ makeGetUserReflectionsUrl),
/* harmony export */   "bE": () => (/* binding */ makeFollowUserUrl)
/* harmony export */ });
/* harmony import */ var _utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(13830);

const getPrefixedUrl = (url)=>`qf/${url}`;
const makePostReflectionViewsUrl = (postId)=>(0,_utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_0__/* .makeUrl */ .bf)(getPrefixedUrl(`posts/${postId}/views`));
const makeFollowUserUrl = (userNameOrId)=>(0,_utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_0__/* .makeUrl */ .bf)(getPrefixedUrl(`users/${userNameOrId}/follow`));
const makeIsUserFollowedUrl = (userNameOrId)=>(0,_utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_0__/* .makeUrl */ .bf)(getPrefixedUrl(`users/${userNameOrId}/is-followed`));
const makeGetUserReflectionsUrl = (params)=>(0,_utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_0__/* .makeUrl */ .bf)(getPrefixedUrl("posts"), params);
const makeQuranicCalendarPostOfWeekUrl = (weekNumber)=>(0,_utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_0__/* .makeUrl */ .bf)(getPrefixedUrl(`quranic-calendar/${weekNumber}`));


/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "bq": () => (/* binding */ equalityCheckerByType),
/* harmony export */   "dp": () => (/* binding */ QueryParamValueType),
/* harmony export */   "jr": () => (/* binding */ getQueryParamValueByType)
/* harmony export */ });
/* harmony import */ var _array__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5639);

var QueryParamValueType;
(function(QueryParamValueType) {
    QueryParamValueType["String"] = "String";
    QueryParamValueType["Number"] = "Number";
    QueryParamValueType["ArrayOfNumbers"] = "ArrayOfNumbers";
    QueryParamValueType["ArrayOfStrings"] = "ArrayOfStrings";
})(QueryParamValueType || (QueryParamValueType = {}));
const paramValueParser = {
    [QueryParamValueType.ArrayOfNumbers]: (paramStringValue)=>paramStringValue.split(",").map((stringValue)=>Number(stringValue)),
    [QueryParamValueType.ArrayOfStrings]: (paramStringValue)=>paramStringValue.split(",").map((stringValue)=>stringValue),
    [QueryParamValueType.Number]: (paramStringValue)=>Number(paramStringValue),
    [QueryParamValueType.String]: (paramStringValue)=>paramStringValue
};
const equalityCheckerByType = {
    [QueryParamValueType.ArrayOfNumbers]: _array__WEBPACK_IMPORTED_MODULE_0__/* .areArraysEqual */ .Hj,
    [QueryParamValueType.ArrayOfStrings]: _array__WEBPACK_IMPORTED_MODULE_0__/* .areArraysEqual */ .Hj,
    [QueryParamValueType.String]: (a, b)=>a === b,
    [QueryParamValueType.Number]: (a, b)=>a === b
};
const getQueryParamValueByType = (paramStringValue, valueType)=>{
    const parse = paramValueParser[valueType];
    const parsedValue = parse(paramStringValue);
    return parsedValue;
};


/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "W": () => (/* binding */ isValidTranslationsQueryParamValue),
/* harmony export */   "o": () => (/* binding */ isValidReciterId)
/* harmony export */ });
const isValidTranslationsQueryParamValue = (value)=>{
    // if it's empty string, we shouldn't consider it as a valid translation
    if (!value) {
        return false;
    }
    const translationIds = value.split(",");
    let isValid = true;
    for(let index = 0; index < translationIds.length; index += 1){
        // if the value is empty
        if (!translationIds[index]) {
            isValid = false;
            break;
        }
        const translationId = Number(translationIds[index]);
        // if the translation Id is empty or is not a number
        if (!translationId && Number.isNaN(translationId)) {
            isValid = false;
            break;
        }
    }
    return isValid;
};
/**
 * Check whether the value of the query param is a valid
 * reciter Id.
 *
 * @param {string} value
 * @returns {boolean}
 */ const isValidReciterId = (value)=>{
    // if it's empty string, we shouldn't consider it as a valid reciter id
    if (!value) {
        return false;
    }
    const reciterId = Number(value);
    if (reciterId === 0 || Number.isNaN(reciterId)) {
        return false;
    }
    return true;
};


/***/ }),

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

"use strict";

// EXPORTS
__webpack_require__.d(__webpack_exports__, {
  "Jc": () => (/* binding */ getAyahReflections),
  "pZ": () => (/* binding */ makeAyahReflectionsUrl),
  "GG": () => (/* binding */ postReflectionViews)
});

// UNUSED EXPORTS: API_HOST, makeQuranReflectApiUrl

// EXTERNAL MODULE: ./src/api.ts
var api = __webpack_require__(92684);
// EXTERNAL MODULE: ./src/utils/qs-stringify.ts
var qs_stringify = __webpack_require__(99921);
;// CONCATENATED MODULE: ./types/QuranReflect/Tab.ts
var Tab;
(function(Tab) {
    Tab["MostPopular"] = "most_popular";
    Tab["Newest"] = "newest";
    Tab["Feed"] = "feed";
    Tab["Public"] = "public";
})(Tab || (Tab = {}));
/* harmony default export */ const QuranReflect_Tab = (Tab);

;// CONCATENATED MODULE: ./src/utils/quranReflect/apiPaths.ts
/* eslint-disable @typescript-eslint/naming-convention */ 


const STAGING_API_HOST = "https://quranreflect.org";
const PRODUCTION_API_HOST = "https://quranreflect.com";
const isProd = process.env.NEXT_PUBLIC_VERCEL_ENV === "production";
// env variables in Vercel can't be dynamic, we have to hardcode the urls here. https://stackoverflow.com/questions/44342226/next-js-error-only-absolute-urls-are-supported
const API_HOST = isProd ? PRODUCTION_API_HOST : STAGING_API_HOST;
const makeQuranReflectApiUrl = (path, parameters = {})=>{
    const params = {
        client_auth_token: process.env.NEXT_PUBLIC_QURAN_REFLECT_TOKEN,
        ...parameters
    };
    return `${API_HOST}/${path}?${(0,qs_stringify/* default */.Z)(params)}`;
};
/* eslint-disable import/prefer-default-export */ const makeAyahReflectionsUrl = ({ surahId , ayahNumber , locale , page =1 , tab =QuranReflect_Tab.MostPopular  })=>{
    const surahNumber = Number(surahId) + 1;
    return makeQuranReflectApiUrl("posts.json", {
        "q[filters_attributes][0][chapter_id]": surahNumber,
        "q[filters_attributes][0][from]": ayahNumber,
        "q[filters_attributes][0][to]": ayahNumber,
        "q[filters_operation]": "OR",
        page,
        tab,
        lang: locale,
        feed: true
    });
};
const makeReflectionViewsUrl = (postId)=>{
    return makeQuranReflectApiUrl(`v1/posts/${postId}/views`);
};
const postReflectionViews = async (postId)=>(0,api/* fetcher */._i)(makeReflectionViewsUrl(postId), {
        method: "POST",
        headers: {
            "Content-Type": "application/json"
        }
    });
const getAyahReflections = async (ayahReflectionsUrl)=>(0,api/* fetcher */._i)(ayahReflectionsUrl);


/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "BF": () => (/* binding */ getSelectedTafsirLanguage),
/* harmony export */   "K8": () => (/* binding */ getFirstTafsirOfLanguage),
/* harmony export */   "O3": () => (/* binding */ getTafsirsLanguageOptions)
/* harmony export */ });
/* harmony import */ var lodash_uniq__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(18459);
/* harmony import */ var lodash_uniq__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash_uniq__WEBPACK_IMPORTED_MODULE_0__);

/**
 * Get the language of the selected Tafsir.
 *
 * @param {TafsirsResponse} tafsirListData
 * @param {number|string} selectedTafsirIdOrSlug
 * @returns {string}
 */ const getSelectedTafsirLanguage = (tafsirListData, selectedTafsirIdOrSlug)=>{
    const selectedTafsir = tafsirListData?.tafsirs.find((tafsir)=>tafsir.slug === selectedTafsirIdOrSlug || tafsir.id === Number(selectedTafsirIdOrSlug));
    return selectedTafsir?.languageName;
};
/**
 * Get the first Tafsir of a language.
 *
 * @param {TafsirsResponse} tafsirListData
 * @param {string} language
 * @returns {TafsirInfo}
 */ const getFirstTafsirOfLanguage = (tafsirListData, language)=>{
    const selectedTafsir = tafsirListData?.tafsirs.find((tafsir)=>tafsir.languageName === language);
    return selectedTafsir;
};
/**
 * Given list of tafsirs, get all available language options
 *
 * @param {Tafsir[]} tafsirs
 * @returns {string[]} list of available language options
 */ const getTafsirsLanguageOptions = (tafsirs)=>lodash_uniq__WEBPACK_IMPORTED_MODULE_0___default()(tafsirs.map((tafsir)=>tafsir.languageName));


/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "BP": () => (/* binding */ selectCurrentAudioReciterId),
/* harmony export */   "XL": () => (/* binding */ selectIsLoadingCurrentChapter),
/* harmony export */   "eU": () => (/* binding */ selectIsVerseLoading),
/* harmony export */   "iX": () => (/* binding */ selectIsUsingDefaultReciter),
/* harmony export */   "sI": () => (/* binding */ selectIsPlayingCurrentChapter),
/* harmony export */   "xU": () => (/* binding */ selectIsLoading)
/* harmony export */ });
/* unused harmony exports selectIsAudioPlaying, selectIsVerseBeingPlayed */
/* harmony import */ var _redux_defaultSettings_defaultSettings__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(11854);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(44519);
/* eslint-disable import/prefer-default-export */ 

const selectIsUsingDefaultReciter = (state)=>state.context.reciterId === _redux_defaultSettings_defaultSettings__WEBPACK_IMPORTED_MODULE_0__/* .DEFAULT_RECITER.id */ .YS.id;
const selectCurrentAudioReciterId = (state)=>state.context.audioData?.reciterId;
const selectIsLoading = (state)=>state.hasTag("loading");
const selectIsAudioPlaying = (state)=>state.matches("VISIBLE.AUDIO_PLAYER_INITIATED.PLAYING");
const selectIsPlayingCurrentChapter = (state, chapterId)=>{
    const isAudioPlaying = selectIsAudioPlaying(state);
    const currentSurah = state.context.surah;
    return isAudioPlaying && currentSurah === chapterId;
};
const selectIsLoadingCurrentChapter = (state, chapterId)=>{
    const isLoading = selectIsLoading(state);
    const currentSurah = state.context.surah;
    return isLoading && currentSurah === chapterId;
};
const selectIsVerseBeingPlayed = (state, verseKey)=>{
    const { surah , ayahNumber  } = state.context;
    return state.matches("VISIBLE.AUDIO_PLAYER_INITIATED.PLAYING") && makeVerseKey(surah, ayahNumber) === verseKey;
};
const selectIsVerseLoading = (state, verseKey)=>{
    const { surah , ayahNumber  } = state.context;
    return selectIsLoading(state) && (0,_utils_verse__WEBPACK_IMPORTED_MODULE_1__/* .makeVerseKey */ .u)(surah, ayahNumber) === verseKey;
};


/***/ })

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