quran/.next/server/chunks/73273.js

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

/***/ 69457:
/***/ ((__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;
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 SvgBook = function SvgBook(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"
  }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "M4 19.5A2.5 2.5 0 0 1 6.5 17H20"
  })), _path2 || (_path2 = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    d: "M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgBook);

/***/ }),

/***/ 49880:
/***/ ((__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 SvgChevronLeft = function SvgChevronLeft(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.842 3.135a.5.5 0 0 1 .023.707L5.435 7.5l3.43 3.658a.5.5 0 0 1-.73.684l-3.75-4a.5.5 0 0 1 0-.684l3.75-4a.5.5 0 0 1 .707-.023Z",
    fill: "currentColor",
    fillRule: "evenodd",
    clipRule: "evenodd"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgChevronLeft);

/***/ }),

/***/ 3932:
/***/ ((__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 SvgChevronRight = function SvgChevronRight(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: "M6.158 3.135a.5.5 0 0 1 .707.023l3.75 4a.5.5 0 0 1 0 .684l-3.75 4a.5.5 0 1 1-.73-.684L9.566 7.5l-3.43-3.658a.5.5 0 0 1 .023-.707Z",
    fill: "currentColor",
    fillRule: "evenodd",
    clipRule: "evenodd"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgChevronRight);

/***/ }),

/***/ 8674:
/***/ ((__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 SvgClock = function SvgClock(props) {
  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
    xmlns: "http://www.w3.org/2000/svg",
    fill: "none",
    viewBox: "0 0 24 24",
    strokeWidth: 1.5,
    stroke: "currentColor",
    className: "w-6 h-6"
  }, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
    strokeLinecap: "round",
    strokeLinejoin: "round",
    d: "M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0z"
  })));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SvgClock);

/***/ }),

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

// Exports
module.exports = {
	"rangeInputContainer": "ReadingGoalInput_rangeInputContainer__ZEAD_",
	"inputContainer": "ReadingGoalInput_inputContainer__I_R3M",
	"fullWidth": "ReadingGoalInput_fullWidth__MyI06",
	"input": "ReadingGoalInput_input__PtUNh",
	"label": "ReadingGoalInput_label__lxzo1"
};


/***/ }),

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

// Exports
module.exports = {
	"label": "Combobox_label__0IpZG",
	"disabledSearch": "Combobox_disabledSearch__8rVdt",
	"comboboxContainer": "Combobox_comboboxContainer__kgP9M",
	"fixedWidth": "Combobox_fixedWidth__CVwtY",
	"enabled": "Combobox_enabled__N0Xzz",
	"select": "Combobox_select__RdEEM",
	"selector": "Combobox_selector__w5Qy_",
	"activeSelector": "Combobox_activeSelector__87gl9",
	"disabledSelector": "Combobox_disabledSelector__f7dH_",
	"hasError": "Combobox_hasError__btZox",
	"placeholder": "Combobox_placeholder__KxuIs",
	"overflow": "Combobox_overflow__wDx9g",
	"multiSelectSearchInput": "Combobox_multiSelectSearchInput__50i6f",
	"smallSearchInput": "Combobox_smallSearchInput__Fp22X",
	"mediumSearchInput": "Combobox_mediumSearchInput__rHPbe",
	"largeSearchInput": "Combobox_largeSearchInput__B6SoL",
	"overflowItem": "Combobox_overflowItem__3lo49",
	"tagContainer": "Combobox_tagContainer__2pMfb",
	"search": "Combobox_search__7gUOl",
	"fullWidth": "Combobox_fullWidth__pBxh_"
};


/***/ }),

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

// Exports
module.exports = {
	"input": "ComboboxItem_input__tPkeb",
	"itemLabel": "ComboboxItem_itemLabel__i2tdo",
	"itemContainer": "ComboboxItem_itemContainer__B_pz1",
	"enabledItem": "ComboboxItem_enabledItem__nMWDe",
	"disabledItem": "ComboboxItem_disabledItem__Wk3vx",
	"checkedItem": "ComboboxItem_checkedItem__fltvV",
	"prefix": "ComboboxItem_prefix__iu_PS",
	"labelContainer": "ComboboxItem_labelContainer__sYcB_",
	"prefixContainer": "ComboboxItem_prefixContainer__bFcOl",
	"suffixContainer": "ComboboxItem_suffixContainer__Fof34"
};


/***/ }),

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

// Exports
module.exports = {
	"comboboxBodyContainer": "ComboboxItems_comboboxBodyContainer__U8FV9",
	"fixedWidth": "ComboboxItems_fixedWidth__Ja9N8",
	"largeComboboxBodyContainer": "ComboboxItems_largeComboboxBodyContainer__yEoGv",
	"openedComboboxBodyContainer": "ComboboxItems_openedComboboxBodyContainer__FTC8W",
	"itemsContainer": "ComboboxItems_itemsContainer__gSdDs"
};


/***/ }),

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

// Exports
module.exports = {
	"caretIconButton": "CaretInputIcon_caretIconButton__CFt6U",
	"openedCaretIconButton": "CaretInputIcon_openedCaretIconButton__xrU_c"
};


/***/ }),

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

// Exports
module.exports = {
	"clearIconContainer": "ClearInputIcon_clearIconContainer__SJWTP",
	"icon": "ClearInputIcon_icon__m6i8c"
};


/***/ }),

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

// Exports
module.exports = {
	"iconContainer": "SearchInputIcon_iconContainer__z7b2G",
	"icon": "SearchInputIcon_icon__t1nGp",
	"selectSearch": "SearchInputIcon_selectSearch__Gdqtn"
};


/***/ }),

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

// Exports
module.exports = {
	"item": "Tag_item__0hGuv",
	"largeItem": "Tag_largeItem__hrrwN",
	"itemContent": "Tag_itemContent__Pxwpg",
	"itemRemove": "Tag_itemRemove__9cr6J"
};


/***/ }),

/***/ 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"
};


/***/ }),

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

"use strict";

// EXPORTS
__webpack_require__.d(__webpack_exports__, {
  "Z": () => (/* binding */ ReadingGoalInput_VerseRangeInput)
});

// EXTERNAL MODULE: external "react/jsx-runtime"
var jsx_runtime_ = __webpack_require__(20997);
// EXTERNAL MODULE: external "react"
var external_react_ = __webpack_require__(16689);
// EXTERNAL MODULE: external "next-translate/useTranslation"
var useTranslation_ = __webpack_require__(60866);
var useTranslation_default = /*#__PURE__*/__webpack_require__.n(useTranslation_);
// EXTERNAL MODULE: ./src/components/ReadingGoal/ReadingGoalInput/ReadingGoalInput.module.scss
var ReadingGoalInput_module = __webpack_require__(13646);
var ReadingGoalInput_module_default = /*#__PURE__*/__webpack_require__.n(ReadingGoalInput_module);
// EXTERNAL MODULE: ./src/contexts/DataContext.ts
var DataContext = __webpack_require__(70813);
// EXTERNAL MODULE: external "classnames"
var external_classnames_ = __webpack_require__(59003);
var external_classnames_default = /*#__PURE__*/__webpack_require__.n(external_classnames_);
// EXTERNAL MODULE: external "react-hotkeys-hook"
var external_react_hotkeys_hook_ = __webpack_require__(2784);
// EXTERNAL MODULE: ./src/components/dls/Forms/Combobox/Combobox.module.scss
var Combobox_module = __webpack_require__(72549);
var Combobox_module_default = /*#__PURE__*/__webpack_require__.n(Combobox_module);
// EXTERNAL MODULE: ./src/components/dls/Forms/Combobox/ComboboxItems/ComboboxItems.module.scss
var ComboboxItems_module = __webpack_require__(47973);
var ComboboxItems_module_default = /*#__PURE__*/__webpack_require__.n(ComboboxItems_module);
// EXTERNAL MODULE: ./src/components/dls/Forms/Combobox/ComboboxItem/ComboboxItem.module.scss
var ComboboxItem_module = __webpack_require__(92460);
var ComboboxItem_module_default = /*#__PURE__*/__webpack_require__.n(ComboboxItem_module);
;// CONCATENATED MODULE: ./src/components/dls/Forms/Combobox/ComboboxItem/index.tsx




const ComboboxItem = ({ checked , disabled , itemId , selectedItemRef , item , onItemSelectedChange , isNotFound =false , emptyMessage ,  })=>{
    if (isNotFound) {
        return /*#__PURE__*/ jsx_runtime_.jsx("div", {
            className: external_classnames_default()((ComboboxItem_module_default()).itemContainer, (ComboboxItem_module_default()).disabledItem),
            children: emptyMessage
        });
    }
    return /*#__PURE__*/ jsx_runtime_.jsx("label", {
        htmlFor: itemId,
        children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
            ref: checked ? selectedItemRef : null,
            className: external_classnames_default()((ComboboxItem_module_default()).itemContainer, {
                [(ComboboxItem_module_default()).disabledItem]: disabled
            }, {
                [(ComboboxItem_module_default()).enabledItem]: !disabled
            }, {
                [(ComboboxItem_module_default()).checkedItem]: checked
            }),
            children: [
                /*#__PURE__*/ jsx_runtime_.jsx("input", {
                    type: "checkbox",
                    className: (ComboboxItem_module_default()).input,
                    id: itemId,
                    name: item.name,
                    disabled: disabled,
                    checked: checked,
                    onChange: onItemSelectedChange,
                    "data-item-label": item.label
                }),
                /*#__PURE__*/ (0,jsx_runtime_.jsxs)("label", {
                    htmlFor: itemId,
                    className: external_classnames_default()((ComboboxItem_module_default()).labelContainer, {
                        [(ComboboxItem_module_default()).itemLabel]: !disabled
                    }),
                    children: [
                        /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                            className: (ComboboxItem_module_default()).prefixContainer,
                            children: [
                                item.prefix && /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                    className: (ComboboxItem_module_default()).prefix,
                                    children: item.prefix
                                }),
                                " ",
                                item.label
                            ]
                        }),
                        item.suffix && /*#__PURE__*/ jsx_runtime_.jsx("div", {
                            className: (ComboboxItem_module_default()).suffixContainer,
                            children: item.suffix
                        })
                    ]
                })
            ]
        })
    }, itemId);
};
/* harmony default export */ const Combobox_ComboboxItem = (/*#__PURE__*/(0,external_react_.memo)(ComboboxItem));

;// CONCATENATED MODULE: ./src/components/dls/Forms/Combobox/types/ComboboxSize.ts
var ComboboxSize;
(function(ComboboxSize) {
    ComboboxSize["Small"] = "small";
    ComboboxSize["Medium"] = "medium";
    ComboboxSize["Large"] = "large";
})(ComboboxSize || (ComboboxSize = {}));
/* harmony default export */ const types_ComboboxSize = (ComboboxSize);

// EXTERNAL MODULE: ./src/hooks/useScrollToElement.ts
var useScrollToElement = __webpack_require__(56748);
;// CONCATENATED MODULE: ./src/components/dls/Forms/Combobox/ComboboxItems/index.tsx







const SCROLL_TO_SELECTED_ELEMENT_OPTIONS = {
    block: "nearest"
};
const ComboboxItems = ({ isOpened , disabled , size , filteredItems , isMultiSelect , preventSelecting , emptyMessage , id , onItemSelectedChange , selectedValue , fixedWidth ,  })=>{
    const [scrollToSelectedItem, selectedItemRef] = (0,useScrollToElement/* default */.ZP)(SCROLL_TO_SELECTED_ELEMENT_OPTIONS);
    // once the dropdown is opened, scroll to the selected item.
    (0,external_react_.useEffect)(()=>{
        if (isOpened) {
            scrollToSelectedItem();
        }
    }, [
        isOpened,
        scrollToSelectedItem
    ]);
    return /*#__PURE__*/ jsx_runtime_.jsx("div", {
        className: external_classnames_default()((ComboboxItems_module_default()).comboboxBodyContainer, {
            [(ComboboxItems_module_default()).openedComboboxBodyContainer]: isOpened,
            [(ComboboxItems_module_default()).largeComboboxBodyContainer]: size === types_ComboboxSize.Large,
            [(ComboboxItems_module_default()).fixedWidth]: fixedWidth
        }),
        "aria-modal": "true",
        role: "dialog",
        children: /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
            className: (ComboboxItems_module_default()).itemsContainer,
            role: "listbox",
            children: [
                filteredItems.map((item)=>{
                    let checked = false;
                    if (selectedValue) {
                        if (!isMultiSelect && selectedValue === item.name) {
                            checked = true;
                        } else if (isMultiSelect && selectedValue[item.name] !== undefined) {
                            checked = true;
                        }
                    }
                    const isItemDisabled = disabled === true || item.disabled === true || preventSelecting;
                    const itemId = `${id}-${item.id}`;
                    return /*#__PURE__*/ jsx_runtime_.jsx(Combobox_ComboboxItem, {
                        onItemSelectedChange: onItemSelectedChange,
                        checked: checked,
                        disabled: isItemDisabled,
                        itemId: itemId,
                        selectedItemRef: selectedItemRef,
                        item: item
                    }, itemId);
                }),
                !filteredItems.length && /*#__PURE__*/ jsx_runtime_.jsx(Combobox_ComboboxItem, {
                    emptyMessage: emptyMessage,
                    checked: false,
                    disabled: true,
                    isNotFound: true
                })
            ]
        })
    });
};
/* harmony default export */ const Combobox_ComboboxItems = (ComboboxItems);

// EXTERNAL MODULE: ./src/components/dls/Forms/Combobox/Icons/CaretInputIcon.module.scss
var CaretInputIcon_module = __webpack_require__(82601);
var CaretInputIcon_module_default = /*#__PURE__*/__webpack_require__.n(CaretInputIcon_module);
// EXTERNAL MODULE: ./public/icons/caret-down.svg
var caret_down = __webpack_require__(85970);
;// CONCATENATED MODULE: ./src/components/dls/Forms/Combobox/Icons/CaretInputIcon.tsx





const CaretInputIcon = ({ shouldShowIcon , isOpened  })=>{
    if (!shouldShowIcon) {
        return null;
    }
    return /*#__PURE__*/ jsx_runtime_.jsx("div", {
        className: external_classnames_default()((CaretInputIcon_module_default()).caretIconButton, {
            [(CaretInputIcon_module_default()).openedCaretIconButton]: isOpened
        }),
        "aria-label": "Show more",
        children: /*#__PURE__*/ jsx_runtime_.jsx(caret_down/* default */.Z, {})
    });
};
/* harmony default export */ const Icons_CaretInputIcon = (CaretInputIcon);

// EXTERNAL MODULE: ./src/components/dls/Forms/Combobox/Icons/ClearInputIcon.module.scss
var ClearInputIcon_module = __webpack_require__(80899);
var ClearInputIcon_module_default = /*#__PURE__*/__webpack_require__.n(ClearInputIcon_module);
// EXTERNAL MODULE: ./public/icons/close.svg
var icons_close = __webpack_require__(51053);
;// CONCATENATED MODULE: ./src/components/dls/Forms/Combobox/Icons/ClearInputIcon.tsx




const ClearInputIcon = ({ shouldShowIcon , onClearButtonClicked  })=>{
    if (!shouldShowIcon) {
        return null;
    }
    return /*#__PURE__*/ jsx_runtime_.jsx("span", {
        className: (ClearInputIcon_module_default()).clearIconContainer,
        // eslint-disable-next-line react/no-unknown-property
        unselectable: "on",
        "aria-hidden": "true",
        onClick: onClearButtonClicked,
        children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
            role: "img",
            "aria-label": "close-circle",
            className: (ClearInputIcon_module_default()).icon,
            children: /*#__PURE__*/ jsx_runtime_.jsx(icons_close/* default */.Z, {})
        })
    });
};
/* harmony default export */ const Icons_ClearInputIcon = (ClearInputIcon);

// EXTERNAL MODULE: ./src/components/dls/Forms/Combobox/Icons/SearchInputIcon.module.scss
var SearchInputIcon_module = __webpack_require__(24899);
var SearchInputIcon_module_default = /*#__PURE__*/__webpack_require__.n(SearchInputIcon_module);
// EXTERNAL MODULE: ./public/icons/search.svg
var search = __webpack_require__(29033);
;// CONCATENATED MODULE: ./src/components/dls/Forms/Combobox/Icons/SearchInputIcon.tsx
/* eslint-disable react/no-unknown-property */ 




const SearchInputIcon = ()=>/*#__PURE__*/ jsx_runtime_.jsx("span", {
        className: external_classnames_default()((SearchInputIcon_module_default()).iconContainer, (SearchInputIcon_module_default()).selectSearch),
        unselectable: "on",
        "aria-hidden": "true",
        children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
            role: "img",
            className: (SearchInputIcon_module_default()).icon,
            children: /*#__PURE__*/ jsx_runtime_.jsx(search/* default */.Z, {})
        })
    });
/* harmony default export */ const Icons_SearchInputIcon = (SearchInputIcon);

// EXTERNAL MODULE: ./src/components/dls/Forms/Combobox/Tag/Tag.module.scss
var Tag_module = __webpack_require__(17874);
var Tag_module_default = /*#__PURE__*/__webpack_require__.n(Tag_module);
;// CONCATENATED MODULE: ./src/components/dls/Forms/Combobox/Tag/index.tsx
/* eslint-disable react/no-unknown-property */ 





const Tag = ({ onRemoveTagClicked , size , tag  })=>/*#__PURE__*/ (0,jsx_runtime_.jsxs)("span", {
        className: external_classnames_default()((Tag_module_default()).item, {
            [(Tag_module_default()).largeItem]: size === types_ComboboxSize.Large
        }),
        children: [
            /*#__PURE__*/ jsx_runtime_.jsx("span", {
                className: (Tag_module_default()).itemContent,
                children: tag
            }),
            /*#__PURE__*/ jsx_runtime_.jsx("span", {
                className: (Tag_module_default()).itemRemove,
                unselectable: "on",
                "aria-hidden": "true",
                onClick: (event)=>{
                    onRemoveTagClicked(event, tag);
                },
                children: /*#__PURE__*/ jsx_runtime_.jsx("span", {
                    role: "img",
                    "aria-label": "close",
                    className: (Tag_module_default()).icon,
                    children: /*#__PURE__*/ jsx_runtime_.jsx(icons_close/* default */.Z, {})
                })
            })
        ]
    });
/* harmony default export */ const Combobox_Tag = (/*#__PURE__*/(0,external_react_.memo)(Tag));

// EXTERNAL MODULE: ./src/hooks/useFocusElement.ts
var useFocusElement = __webpack_require__(79862);
// EXTERNAL MODULE: ./src/hooks/useOutsideClickDetector.ts
var useOutsideClickDetector = __webpack_require__(38646);
;// CONCATENATED MODULE: ./src/components/dls/Forms/Combobox/index.tsx
/* eslint-disable react/no-unknown-property */ /* eslint-disable max-lines */ /* eslint-disable jsx-a11y/role-has-required-aria-props */ /* eslint-disable jsx-a11y/click-events-have-key-events */ /* eslint-disable jsx-a11y/no-static-element-interactions */ 












const Combobox = ({ items , placeholder ="Search..." , hasError =false , value , initialInputValue , disabled =false , clearable =true , isMultiSelect =false , emptyMessage ="No results" , tagsLimit , label , id , size =types_ComboboxSize.Medium , minimumRequiredItems =0 , onChange , fixedWidth =true ,  })=>{
    const { 0: isOpened , 1: setIsOpened  } = (0,external_react_.useState)(false);
    const { 0: inputValue , 1: setInputValue  } = (0,external_react_.useState)(initialInputValue || "");
    const { 0: selectedValue , 1: setSelectedValue  } = (0,external_react_.useState)(()=>{
        if (!value) {
            return getDefaultValue(isMultiSelect);
        }
        if (!isMultiSelect) {
            return value;
        }
        return convertArrayToObject(value);
    });
    const { 0: filteredItems , 1: setFilteredItems  } = (0,external_react_.useState)(items);
    const [focusInput, inputRef] = (0,useFocusElement/* default */.Z)();
    const comboBoxRef = (0,external_react_.useRef)(null);
    // instead of running items.find in the closeCombobox function, we can create a map to memoize the result
    const valueToLabelMap = (0,external_react_.useMemo)(()=>{
        const map = {};
        items.forEach((item)=>{
            map[item.value] = item.label;
        });
        return map;
    }, [
        items
    ]);
    const closeCombobox = (0,external_react_.useCallback)(()=>{
        if (!isMultiSelect) {
            const currentValue = selectedValue;
            setInputValue(valueToLabelMap[currentValue] ?? currentValue);
        } else {
            setInputValue("");
        }
        setIsOpened(false);
    }, [
        isMultiSelect,
        selectedValue,
        valueToLabelMap
    ]);
    (0,useOutsideClickDetector/* default */.Z)(comboBoxRef, closeCombobox, isOpened);
    (0,external_react_hotkeys_hook_.useHotkeys)("Escape", closeCombobox, {
        enabled: isOpened,
        enableOnTags: [
            "INPUT"
        ]
    });
    // if there are any changes in the items, we should update the filteredItems.
    // this is necessary when the parent items are have initial empty value and
    // the actual values are fetched remotely and by the time they have a value,
    // filteredItems would have already been initialized with the initial items value
    // and the actual values wouldn't reflect.
    (0,external_react_.useEffect)(()=>{
        setFilteredItems(items);
    }, [
        items
    ]);
    // filter items when the search query changes
    (0,external_react_.useEffect)(()=>{
        // if the search query is empty it means it has been cleared so we set the original items back.
        setFilteredItems(!inputValue ? items : items.filter((item)=>// we convert the search query and the item's label to lowercase first then check if the label contains a part/all of the search query.
            item.label.toLowerCase().includes(inputValue.toLowerCase())));
    }, [
        inputValue,
        items
    ]);
    // if there are any changes in the value, we should update the selectedValue.
    (0,external_react_.useEffect)(()=>{
        if (!value) {
            setSelectedValue(getDefaultValue(isMultiSelect));
        } else {
            setSelectedValue(isMultiSelect ? convertArrayToObject(value) : value);
        }
    }, [
        value,
        isMultiSelect
    ]);
    // if there are any changes in the initialInputValue, we should update the inputValue.
    (0,external_react_.useEffect)(()=>{
        setInputValue(initialInputValue);
    }, [
        initialInputValue
    ]);
    const tags = (0,external_react_.useMemo)(()=>{
        if (!isMultiSelect) {
            return null;
        }
        // get the labels of the selected items by looking inside items array
        return items.filter((item)=>Object.keys(selectedValue).includes(item.name)).map((item)=>item.label);
    }, [
        isMultiSelect,
        items,
        selectedValue
    ]);
    /**
   * By default we can un-select any items. We disallow unselecting items when
   * we meet the the following conditions:
   *
   * 1. minimumRequiredItems has a value above 0.
   * 2. if it's isMultiSelect:
   *    2.1 there should be some selected items already.
   *    2.2 the number of selected items are either equal to
   *        or below the minimum required selected items.
   * 3. if it's not isMultiSelect: there should already be a selected value.
   */ const hasMinimumRequiredItems = minimumRequiredItems > 0;
    const preventUnselectingItems = hasMinimumRequiredItems && (tags && tags.length <= minimumRequiredItems || !isMultiSelect && selectedValue);
    const invokeOnChangeCallback = (0,external_react_.useCallback)((newValue)=>{
        if (onChange) {
            onChange(isMultiSelect ? Object.keys(newValue) : newValue, id);
        }
    }, [
        id,
        isMultiSelect,
        onChange
    ]);
    /**
   * We detect whether we should allow to delete the last selected tag when clicking
   * the backspace key based on the following conditions:
   *
   * 1. it it's multiSelect.
   * 2. The input value doesn't have a value otherwise, backspace key should be used to remove the input value and not the present tags.
   * 3. We at least have 1 tag present.
   * 4. We allow un-selecting items.
   */ (0,external_react_hotkeys_hook_.useHotkeys)("Backspace", ()=>{
        setSelectedValue((prevSelectedValue)=>{
            const newSelectedValues = {
                ...prevSelectedValue
            };
            const lastTag = Object.keys(newSelectedValues).pop();
            delete newSelectedValues[lastTag];
            invokeOnChangeCallback(newSelectedValues);
            return newSelectedValues;
        });
    }, {
        enabled: isOpened && isMultiSelect && !inputValue && !!tags.length && !preventUnselectingItems,
        enableOnTags: [
            "INPUT"
        ]
    }, [
        invokeOnChangeCallback
    ]);
    const onSelectorClicked = ()=>{
        setIsOpened((prevIsOpened)=>!prevIsOpened);
        // we need to focus on the input field whenever the user clicks anywhere inside the component.
        if (isMultiSelect) {
            focusInput();
        }
    };
    /**
   * Handle when an item is selected.
   *
   * @param {ChangeEvent<HTMLInputElement>} event
   */ const onItemSelectedChange = (0,external_react_.useCallback)((event)=>{
        const { itemLabel  } = event.target.dataset;
        const selectedItemName = event.target.name;
        const isUnSelect = !event.currentTarget.checked;
        /*
          only change the selected value if:
          1. we are selecting.
          2. we are un-selecting and we are not prevented from un-selecting.
        */ const shouldProcessChange = !isUnSelect || isUnSelect && !preventUnselectingItems;
        if (isMultiSelect) {
            if (shouldProcessChange) {
                setSelectedValue((prevSelectedValues)=>{
                    const newSelectedValues = {
                        ...prevSelectedValues
                    };
                    if (isUnSelect) {
                        delete newSelectedValues[selectedItemName];
                    } else {
                        newSelectedValues[selectedItemName] = true;
                    }
                    invokeOnChangeCallback(newSelectedValues);
                    return newSelectedValues;
                });
            }
            setInputValue(""); // reset the input value even if it's selecting.
        } else if (shouldProcessChange) {
            setInputValue(isUnSelect ? "" : itemLabel);
            setSelectedValue(()=>{
                const newSelectedValue = isUnSelect ? "" : selectedItemName;
                invokeOnChangeCallback(newSelectedValue);
                return newSelectedValue;
            });
        }
        setIsOpened(false); // close the items container
    }, [
        preventUnselectingItems,
        invokeOnChangeCallback,
        isMultiSelect
    ]);
    /**
   * Handle when the user searches for an item.
   *
   * @param {React.FormEvent<HTMLInputElement>} event
   * @returns {void}
   */ const onInputValueChange = (event)=>{
        const newInputValue = event.currentTarget.value;
        setInputValue(newInputValue);
        setIsOpened(true);
    };
    /**
   * Handle when the clear button is clicked.
   * We will reset the input value, the selected value
   * and the filtered items.
   *
   * @param {React.MouseEvent<HTMLSpanElement>} event
   */ const onClearButtonClicked = (event)=>{
        event.stopPropagation();
        /*
      Don't allow the clearing of the selected items when:

      1. it's multiSelect.
      2. has minimum required items set.
      This is done to avoid clearing all items while the minimum amount of items 
      that should be selected is set. 
    */ if (!(hasMinimumRequiredItems && isMultiSelect)) {
            setInputValue("");
            // if it's allowed to un-select items.
            if (!preventUnselectingItems) {
                setSelectedValue(()=>{
                    const defaultSelectedValue = getDefaultValue(isMultiSelect);
                    invokeOnChangeCallback(defaultSelectedValue);
                    return defaultSelectedValue;
                });
            }
        }
    };
    /**
   * Handle when removing a tag.
   *
   * @param {React.MouseEvent<HTMLSpanElement>} event
   * @param {string} tag
   */ const onRemoveTagClicked = (0,external_react_.useCallback)((event, tag)=>{
        event.stopPropagation();
        // if it's allowed to un-select items.
        if (!preventUnselectingItems) {
            const toBeRemovedTag = items.find((item)=>item.label === tag);
            setSelectedValue((prevSelectedValues)=>{
                const newSelectedValues = {
                    ...prevSelectedValues
                };
                delete newSelectedValues[toBeRemovedTag.name];
                invokeOnChangeCallback(newSelectedValues);
                return newSelectedValues;
            });
        }
    }, [
        invokeOnChangeCallback,
        items,
        preventUnselectingItems
    ]);
    const shouldShowCaret = !isMultiSelect && !inputValue || isMultiSelect && !inputValue && !tags.length;
    const shouldShowClear = clearable && !shouldShowCaret;
    // if we should prevent selecting when the tags limit has been reached.
    const preventSelecting = tagsLimit && tags && tags.length >= tagsLimit;
    return /*#__PURE__*/ (0,jsx_runtime_.jsxs)(jsx_runtime_.Fragment, {
        children: [
            label && /*#__PURE__*/ jsx_runtime_.jsx("p", {
                className: (Combobox_module_default()).label,
                children: label
            }),
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                ref: comboBoxRef,
                className: external_classnames_default()((Combobox_module_default()).comboboxContainer, {
                    [(Combobox_module_default()).enabled]: !disabled,
                    [(Combobox_module_default()).fixedWidth]: fixedWidth
                }),
                children: [
                    /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                        onClick: onSelectorClicked,
                        className: external_classnames_default()((Combobox_module_default()).select, {
                            [(Combobox_module_default()).disabledSearch]: disabled
                        }),
                        children: [
                            /*#__PURE__*/ jsx_runtime_.jsx(Icons_SearchInputIcon, {}),
                            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                                className: external_classnames_default()((Combobox_module_default()).selector, {
                                    [(Combobox_module_default()).disabledSelector]: disabled,
                                    [(Combobox_module_default()).activeSelector]: !disabled && !hasError && isOpened,
                                    [(Combobox_module_default()).hasError]: hasError
                                }),
                                children: [
                                    /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                                        className: external_classnames_default()({
                                            [(Combobox_module_default()).overflow]: isMultiSelect,
                                            [(Combobox_module_default()).fullWidth]: !isMultiSelect
                                        }),
                                        children: [
                                            isMultiSelect && tags.map((tag)=>/*#__PURE__*/ jsx_runtime_.jsx("div", {
                                                    className: external_classnames_default()((Combobox_module_default()).overflowItem, (Combobox_module_default()).tagContainer),
                                                    children: /*#__PURE__*/ jsx_runtime_.jsx(Combobox_Tag, {
                                                        tag: tag,
                                                        onRemoveTagClicked: onRemoveTagClicked,
                                                        size: size
                                                    })
                                                }, tag)),
                                            /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                                className: (Combobox_module_default()).overflowItem,
                                                children: /*#__PURE__*/ jsx_runtime_.jsx("div", {
                                                    className: external_classnames_default()((Combobox_module_default()).search, {
                                                        [(Combobox_module_default()).fullWidth]: !isMultiSelect
                                                    }),
                                                    style: {
                                                        ...isMultiSelect && inputValue && {
                                                            width: `${inputValue.length}rem`
                                                        }
                                                    },
                                                    children: /*#__PURE__*/ jsx_runtime_.jsx("input", {
                                                        ref: inputRef,
                                                        autoComplete: "off",
                                                        type: "search",
                                                        className: external_classnames_default()((Combobox_module_default()).multiSelectSearchInput, {
                                                            [(Combobox_module_default()).smallSearchInput]: size === types_ComboboxSize.Small,
                                                            [(Combobox_module_default()).mediumSearchInput]: size === types_ComboboxSize.Medium,
                                                            [(Combobox_module_default()).largeSearchInput]: size === types_ComboboxSize.Large
                                                        }),
                                                        role: "combobox",
                                                        "aria-haspopup": "listbox",
                                                        "aria-expanded": isOpened,
                                                        "aria-owns": id,
                                                        "aria-autocomplete": "list",
                                                        onChange: onInputValueChange,
                                                        value: inputValue,
                                                        disabled: disabled,
                                                        readOnly: false,
                                                        unselectable: "on",
                                                        ...!isMultiSelect && {
                                                            placeholder
                                                        }
                                                    })
                                                })
                                            })
                                        ]
                                    }),
                                    isMultiSelect && !tags.length && !inputValue && /*#__PURE__*/ jsx_runtime_.jsx("span", {
                                        className: (Combobox_module_default()).placeholder,
                                        children: placeholder
                                    })
                                ]
                            }),
                            /*#__PURE__*/ jsx_runtime_.jsx(Icons_CaretInputIcon, {
                                isOpened: isOpened,
                                shouldShowIcon: shouldShowCaret
                            }),
                            /*#__PURE__*/ jsx_runtime_.jsx(Icons_ClearInputIcon, {
                                shouldShowIcon: shouldShowClear,
                                onClearButtonClicked: onClearButtonClicked
                            })
                        ]
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx(Combobox_ComboboxItems, {
                        onItemSelectedChange: onItemSelectedChange,
                        isOpened: isOpened,
                        disabled: disabled,
                        size: size,
                        filteredItems: filteredItems,
                        isMultiSelect: isMultiSelect,
                        preventSelecting: preventSelecting,
                        selectedValue: selectedValue,
                        id: id,
                        emptyMessage: emptyMessage,
                        fixedWidth: fixedWidth
                    })
                ]
            })
        ]
    });
};
/**
 * Get the default value based on the type:
 *
 * - if it's multi-select, it's an empty object.
 * - if it's single-select, it's an empty string.
 *
 * @param {boolean} isMultiSelect
 * @returns {Value}
 */ const getDefaultValue = (isMultiSelect)=>isMultiSelect ? {} : "";
/**
 * Convert the initial values array of strings to an object.
 *
 * @param {InitialSelectedItems} array
 * @returns {MultiSelectValue}
 */ const convertArrayToObject = (array)=>{
    const multiSelectValue = {};
    array.forEach((selectedItem)=>{
        multiSelectValue[selectedItem] = true;
    });
    return multiSelectValue;
};
/* harmony default export */ const Forms_Combobox = (Combobox);

// EXTERNAL MODULE: ./types/Range.ts
var Range = __webpack_require__(70725);
// EXTERNAL MODULE: ./src/utils/generators.ts
var generators = __webpack_require__(49184);
// EXTERNAL MODULE: ./src/utils/verse.ts
var verse = __webpack_require__(44519);
;// CONCATENATED MODULE: ./src/components/ReadingGoal/ReadingGoalInput/VerseRangeInput.tsx
/* eslint-disable max-lines */ 









const VerseRangeInput = ({ rangeStartVerse , rangeEndVerse , onRangeChange , logChange  })=>{
    const { t , lang  } = useTranslation_default()("reading-goal");
    const chaptersData = (0,external_react_.useContext)(DataContext/* default */.Z);
    const { 0: startChapter , 1: setStartChapter  } = (0,external_react_.useState)(rangeStartVerse ? (0,verse/* getChapterNumberFromKey */.Tc)(rangeStartVerse).toString() : undefined);
    const { 0: endChapter , 1: setEndChapter  } = (0,external_react_.useState)(rangeEndVerse ? (0,verse/* getChapterNumberFromKey */.Tc)(rangeEndVerse).toString() : undefined);
    const chapterOptions = (0,external_react_.useMemo)(()=>(0,generators/* generateChapterOptions */.IU)(chaptersData, lang), [
        chaptersData,
        lang
    ]);
    const startingVerseOptions = (0,external_react_.useMemo)(()=>(0,generators/* generateVerseOptions */.ZK)(chaptersData, t, lang, startChapter), [
        t,
        lang,
        chaptersData,
        startChapter
    ]);
    const endingVerseOptions = (0,external_react_.useMemo)(()=>(0,generators/* generateVerseOptions */.ZK)(chaptersData, t, lang, endChapter), [
        t,
        lang,
        chaptersData,
        endChapter
    ]);
    // useEffect(() => {
    //   if (!rangeStartVerse) {
    //     setStartChapter(undefined);
    //   }
    // }, [rangeStartVerse]);
    // useEffect(() => {
    //   if (!rangeEndVerse) {
    //     setEndChapter(undefined);
    //   }
    // }, [rangeEndVerse]);
    const endingVerse = (0,external_react_.useMemo)(()=>{
        if (!rangeEndVerse) return undefined;
        return (0,verse/* getVerseNumberFromKey */.tR)(rangeEndVerse).toString();
    }, [
        rangeEndVerse
    ]);
    const startingVerse = (0,external_react_.useMemo)(()=>{
        if (!rangeStartVerse) return undefined;
        return (0,verse/* getVerseNumberFromKey */.tR)(rangeStartVerse).toString();
    }, [
        rangeStartVerse
    ]);
    // eslint-disable-next-line react-func/max-lines-per-function
    const onChapterChange = (chapterPosition)=>(chapterId)=>{
            const isStartChapter = chapterPosition === Range/* RangeItemPosition.Start */.EQ.Start;
            const oldChapterId = isStartChapter ? startChapter : endChapter;
            const setChapter = isStartChapter ? setStartChapter : setEndChapter;
            if (!chapterId || chapterId !== oldChapterId) {
                onRangeChange(isStartChapter ? {
                    startVerse: null,
                    endVerse: rangeEndVerse
                } : {
                    startVerse: rangeStartVerse,
                    endVerse: null
                });
            }
            // if the current value is null, we don't need to log it
            const currentVerse = isStartChapter ? rangeStartVerse : rangeEndVerse;
            if (currentVerse && logChange) {
                logChange(isStartChapter ? "start_verse" : "end_verse", {
                    currentValue: currentVerse,
                    newValue: null
                }, {
                    chapter: chapterId || null,
                    verse: (isStartChapter ? startingVerse : endingVerse) || null
                });
            }
            if (!chapterId) {
                setChapter(undefined);
            } else {
                setChapter(chapterId);
            }
        };
    const startChapterOptions = (0,external_react_.useMemo)(()=>{
        if (!endChapter) return chapterOptions;
        const endChapterIdx = Number(endChapter) - 1;
        return chapterOptions.slice(0, endChapterIdx + 1);
    }, [
        chapterOptions,
        endChapter
    ]);
    const endChapterOptions = (0,external_react_.useMemo)(()=>{
        if (!startChapter) return chapterOptions;
        const startChapterIdx = Number(startChapter) - 1;
        return chapterOptions.slice(startChapterIdx);
    }, [
        chapterOptions,
        startChapter
    ]);
    const onVerseChange = (versePosition)=>(verseId)=>{
            const isStartVerse = versePosition === Range/* RangeItemPosition.Start */.EQ.Start;
            const newVerseKey = verseId ? (0,verse/* makeVerseKey */.u)(isStartVerse ? startChapter : endChapter, verseId) : null;
            onRangeChange(isStartVerse ? {
                startVerse: newVerseKey,
                endVerse: rangeEndVerse
            } : {
                startVerse: rangeStartVerse,
                endVerse: newVerseKey
            });
            if (logChange) {
                logChange(isStartVerse ? "start_verse" : "end_verse", {
                    currentValue: isStartVerse ? rangeStartVerse : rangeEndVerse,
                    newValue: newVerseKey
                }, {
                    chapter: (isStartVerse ? startChapter : endChapter) || null,
                    verse: verseId || null
                });
            }
        };
    const getInitialInputValue = (inputType)=>{
        if (inputType === Range/* RangeItem.StartingChapter */.JF.StartingChapter || inputType === Range/* RangeItem.EndingChapter */.JF.EndingChapter) {
            const chapterId = inputType === Range/* RangeItem.StartingChapter */.JF.StartingChapter ? startChapter : endChapter;
            if (!chapterId) return undefined;
            return chapterOptions[Number(chapterId) - 1]?.label;
        }
        const verseId = inputType === Range/* RangeItem.StartingVerse */.JF.StartingVerse ? startingVerse : endingVerse;
        if (!verseId) return "";
        const verseOptions = inputType === Range/* RangeItem.StartingVerse */.JF.StartingVerse ? startingVerseOptions : endingVerseOptions;
        return verseOptions[Number(verseId) - 1]?.label;
    };
    return /*#__PURE__*/ (0,jsx_runtime_.jsxs)(jsx_runtime_.Fragment, {
        children: [
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                className: (ReadingGoalInput_module_default()).rangeInputContainer,
                children: [
                    /*#__PURE__*/ jsx_runtime_.jsx("div", {
                        children: /*#__PURE__*/ jsx_runtime_.jsx(Forms_Combobox, {
                            id: "start-chapter",
                            size: types_ComboboxSize.Large,
                            fixedWidth: false,
                            label: /*#__PURE__*/ jsx_runtime_.jsx("p", {
                                className: (ReadingGoalInput_module_default()).label,
                                children: t("starting-chapter")
                            }),
                            items: startChapterOptions,
                            value: startChapter,
                            initialInputValue: getInitialInputValue(Range/* RangeItem.StartingChapter */.JF.StartingChapter),
                            onChange: onChapterChange(Range/* RangeItemPosition.Start */.EQ.Start)
                        })
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx("div", {
                        children: /*#__PURE__*/ jsx_runtime_.jsx(Forms_Combobox, {
                            id: "starting-verse",
                            size: types_ComboboxSize.Large,
                            fixedWidth: false,
                            disabled: !startChapter,
                            label: /*#__PURE__*/ jsx_runtime_.jsx("p", {
                                className: (ReadingGoalInput_module_default()).label,
                                children: t("starting-verse")
                            }),
                            items: startingVerseOptions,
                            value: startingVerse,
                            initialInputValue: getInitialInputValue(Range/* RangeItem.StartingVerse */.JF.StartingVerse),
                            onChange: onVerseChange(Range/* RangeItemPosition.Start */.EQ.Start)
                        })
                    })
                ]
            }),
            /*#__PURE__*/ (0,jsx_runtime_.jsxs)("div", {
                className: (ReadingGoalInput_module_default()).rangeInputContainer,
                children: [
                    /*#__PURE__*/ jsx_runtime_.jsx("div", {
                        children: /*#__PURE__*/ jsx_runtime_.jsx(Forms_Combobox, {
                            id: "end-chapter",
                            size: types_ComboboxSize.Large,
                            fixedWidth: false,
                            label: /*#__PURE__*/ jsx_runtime_.jsx("p", {
                                className: (ReadingGoalInput_module_default()).label,
                                children: t("ending-chapter")
                            }),
                            items: endChapterOptions,
                            value: endChapter,
                            initialInputValue: getInitialInputValue(Range/* RangeItem.EndingChapter */.JF.EndingChapter),
                            onChange: onChapterChange(Range/* RangeItemPosition.End */.EQ.End)
                        })
                    }),
                    /*#__PURE__*/ jsx_runtime_.jsx("div", {
                        children: /*#__PURE__*/ jsx_runtime_.jsx(Forms_Combobox, {
                            id: "end-verse",
                            size: types_ComboboxSize.Large,
                            fixedWidth: false,
                            label: /*#__PURE__*/ jsx_runtime_.jsx("p", {
                                className: (ReadingGoalInput_module_default()).label,
                                children: t("ending-verse")
                            }),
                            items: endingVerseOptions,
                            value: endingVerse,
                            disabled: !endChapter,
                            initialInputValue: getInitialInputValue(Range/* RangeItem.EndingVerse */.JF.EndingVerse),
                            onChange: onVerseChange(Range/* RangeItemPosition.End */.EQ.End)
                        })
                    })
                ]
            })
        ]
    });
};
/* harmony default export */ const ReadingGoalInput_VerseRangeInput = (VerseRangeInput);


/***/ }),

/***/ 93272:
/***/ ((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 _ReadingGoalInput_module_scss__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(13646);
/* harmony import */ var _ReadingGoalInput_module_scss__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_ReadingGoalInput_module_scss__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _VerseRangeInput__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(37326);
/* harmony import */ var _dls_Forms_Input__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(91308);
/* harmony import */ var _dls_Forms_Select__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(58087);
/* harmony import */ var _types_auth_Goal__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(63196);
/* harmony import */ var _utils_generators__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(49184);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([_dls_Forms_Input__WEBPACK_IMPORTED_MODULE_5__]);
_dls_Forms_Input__WEBPACK_IMPORTED_MODULE_5__ = (__webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__)[0];
/* eslint-disable react-func/max-lines-per-function */ /* eslint-disable max-lines */ 









const ReadingGoalInput = ({ type , rangeStartVerse , rangeEndVerse , pages , seconds , onRangeChange , onPagesChange , onSecondsChange , widthFull =true , logChange ,  })=>{
    const { t , lang  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default()("reading-goal");
    const timeOptions = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(()=>(0,_utils_generators__WEBPACK_IMPORTED_MODULE_8__/* .generateTimeOptions */ .Ph)(t, lang), [
        t,
        lang
    ]);
    if (type === _types_auth_Goal__WEBPACK_IMPORTED_MODULE_7__/* .GoalType.RANGE */ .lC.RANGE) {
        return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_VerseRangeInput__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
            rangeStartVerse: rangeStartVerse,
            rangeEndVerse: rangeEndVerse,
            onRangeChange: onRangeChange,
            logChange: logChange
        });
    }
    if (type === _types_auth_Goal__WEBPACK_IMPORTED_MODULE_7__/* .GoalType.PAGES */ .lC.PAGES) {
        return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
            className: (_ReadingGoalInput_module_scss__WEBPACK_IMPORTED_MODULE_9___default().inputContainer),
            children: [
                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("label", {
                    htmlFor: "pages",
                    className: (_ReadingGoalInput_module_scss__WEBPACK_IMPORTED_MODULE_9___default().label),
                    children: t("goal-types.pages.title")
                }),
                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Forms_Input__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .ZP, {
                    id: "pages",
                    containerClassName: classnames__WEBPACK_IMPORTED_MODULE_2___default()((_ReadingGoalInput_module_scss__WEBPACK_IMPORTED_MODULE_9___default().input), widthFull && (_ReadingGoalInput_module_scss__WEBPACK_IMPORTED_MODULE_9___default().fullWidth)),
                    size: _dls_Forms_Input__WEBPACK_IMPORTED_MODULE_5__/* .InputSize.Large */ .fz.Large,
                    value: pages.toString(),
                    fixedWidth: false,
                    htmlType: "number",
                    // prevent users from entering decimal value
                    onKeyDown: (e)=>e.key === "." && e.preventDefault(),
                    inputMode: "numeric",
                    onChange: (p)=>{
                        const parsedPages = Number(p);
                        onPagesChange(parsedPages);
                        logChange("pages", {
                            currentValue: pages,
                            newValue: parsedPages
                        });
                    }
                })
            ]
        });
    }
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: (_ReadingGoalInput_module_scss__WEBPACK_IMPORTED_MODULE_9___default().inputContainer),
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("label", {
                htmlFor: "seconds",
                className: (_ReadingGoalInput_module_scss__WEBPACK_IMPORTED_MODULE_9___default().label),
                children: t("goal-types.time.title")
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_dls_Forms_Select__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                id: "seconds",
                name: "seconds",
                size: _dls_Forms_Select__WEBPACK_IMPORTED_MODULE_6__/* .SelectSize.Large */ .h.Large,
                className: (_ReadingGoalInput_module_scss__WEBPACK_IMPORTED_MODULE_9___default().input),
                options: timeOptions,
                value: seconds.toString(),
                onChange: (s)=>{
                    const parsedSeconds = Number(s);
                    onSecondsChange(parsedSeconds);
                    logChange("seconds", {
                        currentValue: seconds,
                        newValue: parsedSeconds
                    });
                }
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReadingGoalInput);

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

/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "I": () => (/* binding */ isValidVerseRange),
/* harmony export */   "w": () => (/* binding */ validateReadingGoalData)
/* harmony export */ });
/* harmony import */ var _utils_validator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(41051);
/* harmony import */ var _utils_verse__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(44519);
/* harmony import */ var types_auth_Goal__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(63196);
/* eslint-disable import/prefer-default-export */ 


const SECONDS_LIMIT = 4 * 60 * 60; // 4 hours
const MIN_SECONDS = 60; // 1 minute
/**
 * A utility function to validate the reading goal data
 *
 * @param {ChaptersData} chaptersData
 * @param {ReadingGoalPayload} payload
 * @returns {boolean} is the payload valid
 */ const validateReadingGoalData = (chaptersData, { type , pages , seconds , range  }, mushafId)=>{
    // if the user selected a pages goal and didn't enter a valid amount of pages, disable the next button
    if (type === types_auth_Goal__WEBPACK_IMPORTED_MODULE_2__/* .GoalType.PAGES */ .lC.PAGES && !(0,_utils_validator__WEBPACK_IMPORTED_MODULE_0__/* .isValidPageNumber */ .vU)(pages, mushafId)) return false;
    // if the user selected a time goal and didn't enter a valid amount of seconds, disable the next button
    // in theory, this should never happen because the input is a select, but just in case
    if (type === types_auth_Goal__WEBPACK_IMPORTED_MODULE_2__/* .GoalType.TIME */ .lC.TIME && (Number.isNaN(seconds) || seconds > SECONDS_LIMIT || seconds < MIN_SECONDS)) {
        return false;
    }
    // if the user selected a range goal and didn't enter a valid range, disable the next button
    if (type === types_auth_Goal__WEBPACK_IMPORTED_MODULE_2__/* .GoalType.RANGE */ .lC.RANGE) {
        return isValidVerseRange(chaptersData, range);
    }
    return true;
};
/**
 * Check wether the ranges are valid or not.
 *
 * @param {ChaptersData} chaptersData
 * @param {Range} range
 * @returns {boolean}
 */ const isValidVerseRange = (chaptersData, range)=>{
    if (!range?.startVerse || !range?.endVerse) return false;
    if (!(0,_utils_validator__WEBPACK_IMPORTED_MODULE_0__/* .isValidVerseKey */ .CG)(chaptersData, range.startVerse) || !(0,_utils_validator__WEBPACK_IMPORTED_MODULE_0__/* .isValidVerseKey */ .CG)(chaptersData, range.endVerse)) {
        return false;
    }
    // check if the starting verse key is greater than the ending verse key
    const [startingChapter, startingVerse] = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_1__/* .getVerseAndChapterNumbersFromKey */ .bV)(range.startVerse);
    const [endingChapter, endingVerse] = (0,_utils_verse__WEBPACK_IMPORTED_MODULE_1__/* .getVerseAndChapterNumbersFromKey */ .bV)(range.endVerse);
    // if it's the same Surah but in reverse order
    if (startingChapter === endingChapter && Number(startingVerse) > Number(endingVerse)) {
        return false;
    }
    // if it's the range Surahs are in reverse order
    if (Number(startingChapter) > Number(endingChapter)) {
        return false;
    }
    return true;
};


/***/ }),

/***/ 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);


/***/ }),

/***/ 23830:
/***/ ((__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_redux__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(6022);
/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(62093);
/* harmony import */ var _utils_api__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(4917);



/**
 * Instead of repeating using multiple selectors to get the MushafId
 * in multiple components, we are introducing this hook to keep it DRY.
 *
 * TODO: apply it to everywhere using the mushafId
 *
 * @returns {Mushaf}
 */ const useGetMushaf = ()=>{
    const quranFont = (0,react_redux__WEBPACK_IMPORTED_MODULE_0__.useSelector)(_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_1__/* .selectQuranFont */ .Ho, react_redux__WEBPACK_IMPORTED_MODULE_0__.shallowEqual);
    const mushafLines = (0,react_redux__WEBPACK_IMPORTED_MODULE_0__.useSelector)(_redux_slices_QuranReader_styles__WEBPACK_IMPORTED_MODULE_1__/* .selectQuranMushafLines */ .z$, react_redux__WEBPACK_IMPORTED_MODULE_0__.shallowEqual);
    const { mushaf  } = (0,_utils_api__WEBPACK_IMPORTED_MODULE_2__/* .getMushafId */ .$P)(quranFont, mushafLines);
    return mushaf;
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useGetMushaf);


/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Oz": () => (/* binding */ useScrollToElement),
/* harmony export */   "ZP": () => (__WEBPACK_DEFAULT_EXPORT__),
/* harmony export */   "gZ": () => (/* binding */ SMOOTH_SCROLL_TO_TOP),
/* harmony export */   "lT": () => (/* binding */ SCROLL_TO_NEAREST_ELEMENT),
/* harmony export */   "nv": () => (/* binding */ SMOOTH_SCROLL_TO_CENTER)
/* 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__);

/**
 * A hook that scrolls to a specific element in the DOM.
 * The scrolling will only happen when executeScroll function
 * is invoked.
 *
 * @param {ScrollIntoViewOptions} options
 * @returns {[() => void, RefObject<T>]}
 */ const useScrollToElement = (options)=>{
    const elementRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
    // a function that will be invoked by the component using this hook to scroll to the element being referenced (if found).
    const executeScroll = ()=>{
        // only scroll when the ref has a value
        if (elementRef.current) {
            elementRef.current.scrollIntoView(options);
        }
    };
    return [
        executeScroll,
        elementRef
    ];
};
const SMOOTH_SCROLL_TO_CENTER = {
    block: "center",
    behavior: "smooth"
};
const SMOOTH_SCROLL_TO_TOP = {
    block: "start",
    behavior: "smooth"
};
const SCROLL_TO_NEAREST_ELEMENT = {
    block: "nearest"
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useScrollToElement);


/***/ }),

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

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "IU": () => (/* binding */ generateChapterOptions),
/* harmony export */   "Ph": () => (/* binding */ generateTimeOptions),
/* harmony export */   "ZK": () => (/* binding */ generateVerseOptions),
/* harmony export */   "zQ": () => (/* binding */ generateDurationDaysOptions)
/* harmony export */ });
/* harmony import */ var _utils_chapter__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(95892);
/* harmony import */ var _utils_datetime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(76410);
/* harmony import */ var _utils_locale__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(24709);
/* eslint-disable import/prefer-default-export */ 


const TIME_OPTIONS_LIMIT = 4 * 60; // 4 hours
const DURATION_DAYS_LIMIT = 365; // 1 year, 365 days
/**
 * Generates options for the reading goal time input.
 *
 * The options are within a range of 1 minute to 4 hours.
 * - From 1 to 10 minutes (first 10 options), increment by 1 minute
 * - From > 10 minutes to 4 hours, increment by 5 minutes
 *
 * @param {Translate} t
 * @param {string} locale
 * @returns {SelectOption[]}
 */ const generateTimeOptions = (t, locale)=>{
    // for the first 10 minutes, we want to show 1 until 10
    // but after that, we want to increment by 5 minutes
    // and our limit is TIME_OPTIONS_LIMIT
    const options = new Array(10 + (TIME_OPTIONS_LIMIT - 10) / 5).fill(null)// eslint-disable-next-line @typescript-eslint/naming-convention
    .map((_, i)=>{
        let minutes;
        if (i < 10) {
            minutes = i + 1;
        } else {
            minutes = (i - 9) * 5 + 10;
        }
        const seconds = minutes * 60;
        return {
            value: seconds,
            label: (0,_utils_datetime__WEBPACK_IMPORTED_MODULE_1__/* .secondsToReadableFormat */ .by)(seconds, t, locale)
        };
    });
    return options;
};
/**
 * Generates options for the reading goal chapter input.
 *
 * @param {ChaptersData} chaptersData
 * @param {string} locale
 * @returns {DropdownItem[]}
 */ const generateChapterOptions = (chaptersData, locale)=>{
    const data = Object.keys(chaptersData).map((chapterId)=>{
        const chapter = (0,_utils_chapter__WEBPACK_IMPORTED_MODULE_0__/* .getChapterData */ .dy)(chaptersData, chapterId);
        const localizedChapterId = (0,_utils_locale__WEBPACK_IMPORTED_MODULE_2__/* .toLocalizedNumber */ .rQ)(Number(chapterId), locale);
        return {
            id: chapterId,
            name: chapterId,
            value: chapterId,
            label: `${localizedChapterId} - ${chapter.transliteratedName}`
        };
    });
    return data;
};
/**
 * Generates verse options for a certain chapter in the reading goal verse input.
 *
 * @param {ChaptersData} chaptersData
 * @param {Translate} t
 * @param {string} locale
 * @param {string?} chapterId
 * @returns {DropdownItem[]}
 */ const generateVerseOptions = (chaptersData, t, locale, chapterId)=>{
    if (!chapterId) return [];
    const chapter = (0,_utils_chapter__WEBPACK_IMPORTED_MODULE_0__/* .getChapterData */ .dy)(chaptersData, chapterId);
    // eslint-disable-next-line @typescript-eslint/naming-convention
    const options = new Array(chapter.versesCount).fill(null).map((_, index)=>{
        const localizedVerseId = (0,_utils_locale__WEBPACK_IMPORTED_MODULE_2__/* .toLocalizedNumber */ .rQ)(index + 1, locale);
        const verseId = String(index + 1);
        return {
            id: verseId,
            name: verseId,
            value: verseId,
            label: `${t("common:ayah")} ${localizedVerseId}`
        };
    });
    return options;
};
/**
 * Generates options for the reading goal duration input.
 *
 * The options are within a range of 1 day to 365 days in this format:
 * "1 day", "2 days", "3 days", etc...
 *
 * @param {Translate} t
 * @param {string} locale
 * @returns {SelectOption[]}
 */ const generateDurationDaysOptions = (t, locale)=>{
    // for the first 10 days, we want to show 1 until 10
    // but after that, we want to increment by 5 days
    // and our limit is DURATION_DAYS_LIMIT
    const options = new Array(10 + (DURATION_DAYS_LIMIT - 10) / 5).fill(null)// eslint-disable-next-line @typescript-eslint/naming-convention
    .map((_, i)=>{
        let day;
        if (i < 10) {
            day = i + 1;
        } else {
            day = (i - 9) * 5 + 10;
        }
        return {
            value: day.toString(),
            label: t("reading-goal:x-days", {
                count: day,
                days: (0,_utils_locale__WEBPACK_IMPORTED_MODULE_2__/* .toLocalizedNumber */ .rQ)(day, locale)
            })
        };
    });
    return options;
};


/***/ })

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