misraj-mushaf-renderer 1.0.0

package/dist/types/MushafReader.d.ts

@@ -0,0 +1,16 @@
+export declare enum MushafReaderDataType {
+    Page = "page"
+}
+export declare enum MushafFont {
+    MadaniV1 = "code_v1",
+    MadaniV2 = "code_v2",
+    Uthmani = "text_uthmani",
+    IndoPak = "text_indopak",
+    QPCHafs = "qpc_uthmani_hafs",
+    Tajweed = "tajweed"
+}
+export declare const FALLBACK_FONT = MushafFont.QPCHafs;
+export declare enum MushafLines {
+    FifteenLines = "15_lines",
+    SixteenLines = "16_lines"
+}

package/dist/types/Word.d.ts

@@ -0,0 +1,3 @@
+import { Word as WordVerse } from './verses';
+export type Word = WordVerse;
+export default Word;

package/dist/utils/fontFaceHelper.d.ts

@@ -0,0 +1,13 @@
+import { MushafLines, MushafFont } from '../types/MushafReader';
+/**
+ * Dynamically generate the className of the combination between the font
+ * name + size + mushafLines(when its Indopak) that will match the output of
+ * generate-font-scales function inside {@see _utility.scss}.
+ *
+ * @param {MushafFont} mushafFont
+ * @param {number} fontScale
+ * @param {MushafLines} mushafLines
+ * @param {boolean} isFallbackFont
+ * @returns {string}
+ */
+export declare const getFontClassName: (mushafFont: MushafFont, fontScale: number, mushafLines: MushafLines, isFallbackFont?: boolean) => string;

package/dist/utils/narration-name.d.ts

@@ -0,0 +1 @@
+export declare const narrationIdentifierFromReciterId: (identifier: string | undefined) => string;

package/dist/utils/verse.d.ts

@@ -0,0 +1,41 @@
+import { Ayah } from '../types/verses';
+import { default as Word } from '../types/Word';
+/**
+ * Split the word's location and get the surahNumber, verseNumber and wordNumber.
+ *
+ * @param {string} wordLocation the word location {surahNumber}:{verseNumber}:{wordNumber}
+ * @returns {[string, string, string]}
+ */
+export declare const getWordDataByLocation: (wordLocation: string) => [string, string, string];
+/**
+ * Extract the data related to a word. The first is the chapter Id,
+ * the second is whether the word is the first word of the first verse
+ * of the Surah. To do that we will have to split the word location
+ * which comes in the following format: {surahNumber}:{verseNumber}:{wordNumber}.
+ * For this to be true, the combination of {verseNumber}:{wordNumber} has to be
+ * 1:1.
+ *
+ * @param {string} wordLocation whose format is {surahNumber}:{verseNumber}:{wordNumber} e.g. "112:1:1"
+ * @returns {{ chapterId: string; isFirstWordOfSurah: boolean }}
+ */
+export declare const getFirstWordOfSurah: (wordLocation: string) => {
+    chapterId: string;
+    isFirstWordOfSurah: boolean;
+};
+/**
+ * Get the words of each verse. This can be used to extend
+ * the BE response of each word to add custom fields.
+ *
+ * @param {Verse} verse
+ * @param {boolean} isReadingView
+ * @returns {Word[]}
+ */
+export declare const getVerseWords: (verse: Ayah, isReadingView?: boolean) => Word[];
+/**
+ * make wordLocation from verseKey and wordPosition, example "1:1:2"
+ *
+ * @param {string} verseKey
+ * @param {string} wordPosition
+ * @returns {string} wordLocation
+ */
+export declare const makeWordLocation: (verseKey: string, wordPosition: number) => string;

package/package.json

@@ -0,0 +1,79 @@
+{
+  "name": "misraj-mushaf-renderer",
+  "version": "1.0.0",
+  "license": "CC BY-NC 4.0",
+  "description": "A customizable React component for rendering Mushaf pages.",
+  "type": "module",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.es.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.cjs.js"
+    },
+    "./styles": {
+      "types": "./dist/styles.d.ts",
+      "import": "./dist/styles.css",
+      "require": "./dist/styles.css"
+    }
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "lint": "eslint .",
+    "preview": "vite preview"
+  },
+  "peerDependencies": {
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1"
+  },
+  "dependencies": {
+    "@eslint/compat": "^1.4.0",
+    "@rollup/plugin-url": "^8.0.2",
+    "@types/lodash": "^4.17.20",
+    "classnames": "^2.5.1",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "lodash": "^4.17.21",
+    "vite-plugin-svgr": "^4.5.0"
+  },
+  "devDependencies": {
+    "@babel/eslint-parser": "^7.28.4",
+    "@eslint/eslintrc": "^3.3.1",
+    "@eslint/js": "^9.36.0",
+    "@types/node": "^24.5.2",
+    "@types/react": "^19.1.13",
+    "@types/react-dom": "^19.1.9",
+    "@typescript-eslint/eslint-plugin": "^8.45.0",
+    "@typescript-eslint/parser": "^8.45.0",
+    "@vitejs/plugin-react": "^5.0.3",
+    "eslint": "^9.36.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-import-resolver-typescript": "^4.4.4",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-jsdoc": "^60.3.1",
+    "eslint-plugin-prettier": "^5.5.4",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-func": "^0.1.18",
+    "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-react-refresh": "^0.4.22",
+    "eslint-plugin-sonarjs": "^3.0.5",
+    "eslint-plugin-unicorn": "^61.0.2",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1",
+    "sass": "^1.93.2",
+    "typescript": "^5.9.2",
+    "typescript-eslint": "^8.45.0",
+    "vite": "^7.1.7",
+    "vite-plugin-dts": "^4.5.4",
+    "vitest": "^3.2.4"
+  }
+}