@vishu1301/script-writing 0.4.2 → 0.4.4

package/dist/index.cjs

@@ -3,6 +3,27 @@
 var react = require('react');
 var lucideReact = require('lucide-react');
 var jsxRuntime = require('react/jsx-runtime');
+var pdfjs = require('pdfjs-dist');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var pdfjs__namespace = /*#__PURE__*/_interopNamespace(pdfjs);
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -126,6 +147,99 @@ var blockStyles = {
     }
   }
 };
+pdfjs__namespace.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs__namespace.version}/build/pdf.worker.min.mjs`;
+function PdfImporter({ onScriptImported, children }) {
+  const [isProcessing, setIsProcessing] = react.useState(false);
+  const [error, setError] = react.useState(null);
+  const fileInputRef = react.useRef(null);
+  const handleFileChange = async (event) => {
+    var _a;
+    const file = (_a = event.target.files) == null ? void 0 : _a[0];
+    if (!file) {
+      return;
+    }
+    setIsProcessing(true);
+    setError(null);
+    try {
+      const arrayBuffer = await file.arrayBuffer();
+      const pdf = await pdfjs__namespace.getDocument(arrayBuffer).promise;
+      const processPage = async (pageNumber) => {
+        const page = await pdf.getPage(pageNumber);
+        const content = await page.getTextContent();
+        const items = content.items.filter((item) => "str" in item && item.str.trim().length > 0);
+        if (items.length === 0) return "";
+        const lines = [];
+        for (const item of items) {
+          let found = false;
+          for (const line of lines) {
+            if (Math.abs(line.y - item.transform[5]) < 5) {
+              line.items.push({ x: item.transform[4], text: item.str });
+              found = true;
+              break;
+            }
+          }
+          if (!found) {
+            lines.push({ y: item.transform[5], items: [{ x: item.transform[4], text: item.str }] });
+          }
+        }
+        lines.sort((a, b) => b.y - a.y);
+        return lines.map((line) => {
+          line.items.sort((a, b) => a.x - b.x);
+          return line.items.map((item) => item.text).join(" ");
+        }).join("\n");
+      };
+      let title = "";
+      if (pdf.numPages > 0) {
+        title = await processPage(1);
+      }
+      let scriptContent = "";
+      for (let i = 2; i <= pdf.numPages; i++) {
+        scriptContent += await processPage(i) + "\n\n";
+      }
+      onScriptImported(title.trim(), scriptContent);
+    } catch (err) {
+      console.error("Error processing PDF:", err);
+      setError(err instanceof Error ? `Error processing PDF: ${err.message}` : "An unknown error occurred.");
+    } finally {
+      setIsProcessing(false);
+      if (event.target) {
+        event.target.value = "";
+      }
+    }
+  };
+  const handleClick = () => {
+    var _a;
+    (_a = fileInputRef.current) == null ? void 0 : _a.click();
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "input",
+      {
+        ref: fileInputRef,
+        type: "file",
+        accept: "application/pdf",
+        onChange: handleFileChange,
+        disabled: isProcessing,
+        className: "hidden",
+        id: "pdf-importer-input"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        onClick: handleClick,
+        disabled: isProcessing,
+        className: "flex items-center justify-center gap-2 w-auto px-4 h-12 rounded-full bg-zinc-950 text-white shadow-xl shadow-zinc-900/20 border border-white/10 hover:bg-zinc-800 hover:scale-105 active:scale-95 transition-all duration-300",
+        "aria-label": "Import Script from PDF",
+        children: isProcessing ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold", children: "Processing..." }) : children
+      }
+    ),
+    error && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "sr-only", children: [
+      "Error: ",
+      error
+    ] })
+  ] });
+}
 function ScreenplayEditorView({
   blocks,
   pages,
@@ -147,9 +261,11 @@ function ScreenplayEditorView({
   handleKeyDown,
   handleFocus,
   handleBlur,
+  handleScriptImport,
   onSave,
   onSaveAsPdf,
-  onSyncWithCloud
+  onSyncWithCloud,
+  handleSceneNumberChange
 }) {
   const [isRulesOpen, setIsRulesOpen] = react.useState(false);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -208,7 +324,26 @@ function ScreenplayEditorView({
                 className: `relative rounded-sm transition-all duration-200 outline-none ${focusedBlockId === block.id ? "bg-zinc-100/50" : "bg-transparent"}`,
                 children: block.type === "SCENE_HEADING" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
                   /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-4 py-1 bg-transparent", children: [
-                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -left-16 top-2 w-12 text-right text-zinc-400 font-semibold select-none", children: String(sceneNumbers[block.id] || 0) }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "input",
+                      {
+                        className: "absolute -left-16 top-2 w-12 text-right text-zinc-400 font-semibold select-none bg-transparent outline-none focus:ring-1 focus:ring-blue-400 rounded-sm",
+                        spellCheck: false,
+                        value: block.sceneNumber || "",
+                        onChange: (e) => handleSceneNumberChange(
+                          block.id,
+                          e.target.value.toUpperCase()
+                        ),
+                        onFocus: () => handleFocus(block.id),
+                        onBlur: () => handleBlur(block.id),
+                        onKeyDown: (e) => {
+                          if (e.key === "Enter" || e.key === "Backspace") {
+                            e.stopPropagation();
+                          }
+                        },
+                        "aria-label": "Scene Number"
+                      }
+                    ),
                     /* @__PURE__ */ jsxRuntime.jsxs(
                       "select",
                       {
@@ -401,6 +536,10 @@ function ScreenplayEditorView({
       pageIndex
     )) }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "fixed bottom-6 right-6 flex flex-col items-end gap-4 z-50", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(PdfImporter, { onScriptImported: handleScriptImport, children: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Upload, { className: "w-5 h-5" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold", children: "Import" })
+      ] }) }),
       onSave && /* @__PURE__ */ jsxRuntime.jsxs(
         "button",
         {
@@ -503,6 +642,7 @@ function createNewBlock(type) {
   if (type === "SCENE_HEADING") {
     newBlock.sceneType = "INT.";
     newBlock.timeOfDay = "DAY";
+    newBlock.sceneNumber = "";
   } else if (type === "PARENTHETICAL") {
     newBlock.text = "()";
   }
@@ -510,12 +650,12 @@ function createNewBlock(type) {
 }
 function addBlockAfter(blocks, currentBlockId) {
   const currentIndex = blocks.findIndex((b) => b.id === currentBlockId);
-  if (currentIndex === -1) {
-    return { newBlocks: blocks, newBlockId: "" };
-  }
-  const currentBlock = blocks[currentIndex];
-  const nextType = getNextBlockType(currentBlock.type);
+  if (currentIndex === -1) return { newBlocks: blocks, newBlockId: "" };
+  const nextType = getNextBlockType(blocks[currentIndex].type);
   const newBlock = createNewBlock(nextType);
+  if (nextType === "SCENE_HEADING") {
+    newBlock.sceneNumber = generateNextSceneNumber(blocks, currentIndex);
+  }
   const newBlocks = [
     ...blocks.slice(0, currentIndex + 1),
     newBlock,
@@ -540,10 +680,150 @@ function deleteBlock(blocks, blockIdToDelete) {
 function updateBlock(blocks, id, key, value) {
   return blocks.map((b) => b.id === id ? __spreadProps(__spreadValues({}, b), { [key]: value }) : b);
 }
+var generateNextSceneNumber = (blocks, currentIndex) => {
+  const prevScenes = blocks.slice(0, currentIndex + 1).filter((b) => b.type === "SCENE_HEADING");
+  if (prevScenes.length === 0) return "1";
+  const lastScene = prevScenes[prevScenes.length - 1];
+  const lastNum = lastScene.sceneNumber || "1";
+  const match = lastNum.match(/^(\d+)([A-Z]*)$/);
+  if (!match) return "1";
+  const baseNumber = match[1];
+  const currentSuffix = match[2];
+  const scenesAfter = blocks.slice(currentIndex + 1).filter((b) => b.type === "SCENE_HEADING");
+  if (scenesAfter.length > 0) {
+    if (currentSuffix === "") {
+      return `${baseNumber}A`;
+    } else {
+      return `${baseNumber}${incrementChar(currentSuffix)}`;
+    }
+  }
+  return String(parseInt(baseNumber) + 1);
+};
+function incrementChar(text) {
+  if (text === "") return "A";
+  const lastChar = text.slice(-1);
+  const remaining = text.slice(0, -1);
+  if (lastChar === "Z") {
+    return incrementChar(remaining) + "A";
+  }
+  return remaining + String.fromCharCode(lastChar.charCodeAt(0) + 1);
+}
 function changeBlockType(blocks, id, newType) {
+  const currentIndex = blocks.findIndex((b) => b.id === id);
+  if (currentIndex === -1) return blocks;
+  const currentBlock = blocks[currentIndex];
   const newBlock = createNewBlock(newType);
+  if (newType === "PARENTHETICAL") {
+    const cleanText = currentBlock.text.replace(/[()]/g, "");
+    newBlock.text = `(${cleanText})`;
+  } else {
+    newBlock.text = currentBlock.text;
+  }
+  if (newType === "SCENE_HEADING") {
+    newBlock.sceneNumber = generateNextSceneNumber(blocks, currentIndex);
+    newBlock.text = newBlock.text.toUpperCase();
+  }
   return blocks.map((b) => b.id === id ? __spreadProps(__spreadValues({}, newBlock), { id: b.id }) : b);
 }
+function parseScreenplayText(content) {
+  const lines = content.split("\n");
+  const blocks = [];
+  let lastBlock = null;
+  let activeSpeaker = null;
+  for (let i = 0; i < lines.length; i++) {
+    let originalLine = lines[i];
+    let trimmedLine = lines[i].trim().replace(/\s+/g, " ");
+    const leadingSpaces = originalLine.search(/\S/);
+    if (lines[i].trim() === "") {
+      activeSpeaker = null;
+      continue;
+    }
+    const isPageNumber = /^\d+$/.test(trimmedLine) || /^(PAGE|pg\.?)\s?\d+$/i.test(trimmedLine) || /^[\d]+\.$/.test(trimmedLine);
+    if (trimmedLine.length === 0 || isPageNumber) continue;
+    let currentBlockType = null;
+    const isAllUpperCase = trimmedLine === trimmedLine.toUpperCase() && /[A-Z]/.test(trimmedLine);
+    const sceneHeadingStartRegex = /^(?:\d+[A-Z]?\.?\s*)?(INT\.?\/EXT\.?|I\/E|INT|EXT|EST\.)\b/i;
+    const isTransition = isAllUpperCase && (trimmedLine.endsWith(" TO:") || ["FADE IN:", "FADE OUT.", "CUT TO BLACK."].includes(trimmedLine));
+    if (sceneHeadingStartRegex.test(trimmedLine)) {
+      currentBlockType = "SCENE_HEADING";
+      activeSpeaker = null;
+    } else if (isTransition) {
+      currentBlockType = "TRANSITION";
+      activeSpeaker = null;
+    } else if (isAllUpperCase && !trimmedLine.startsWith("(")) {
+      let nextLine = "";
+      for (let j = i + 1; j < lines.length; j++) {
+        const nextTrimmed = lines[j].trim();
+        const nextIsPage = /^\d+$/.test(nextTrimmed) || /^(PAGE|pg\.?)\s?\d+$/i.test(nextTrimmed);
+        if (nextTrimmed.length > 0 && !nextIsPage) {
+          nextLine = nextTrimmed;
+          break;
+        }
+      }
+      if (nextLine && (nextLine.startsWith("(") || nextLine !== nextLine.toUpperCase()) || /\s\(.*\)$/.test(trimmedLine)) {
+        currentBlockType = "CHARACTER";
+        activeSpeaker = trimmedLine;
+      } else {
+        currentBlockType = "ACTION";
+        activeSpeaker = null;
+      }
+    } else if (trimmedLine.startsWith("(") && trimmedLine.endsWith(")")) {
+      currentBlockType = "PARENTHETICAL";
+    } else if (activeSpeaker && ((lastBlock == null ? void 0 : lastBlock.type) === "CHARACTER" || (lastBlock == null ? void 0 : lastBlock.type) === "PARENTHETICAL" || (lastBlock == null ? void 0 : lastBlock.type) === "DIALOGUE")) {
+      const isLastLineComplete = /[.!?]"?$/.test(lastBlock.text.trim());
+      if (leadingSpaces < 15 && (lastBlock == null ? void 0 : lastBlock.type) !== "CHARACTER" && isLastLineComplete) {
+        currentBlockType = "ACTION";
+        activeSpeaker = null;
+      } else {
+        currentBlockType = "DIALOGUE";
+      }
+    } else {
+      currentBlockType = "ACTION";
+      activeSpeaker = null;
+    }
+    if (lastBlock && lastBlock.type === currentBlockType && (currentBlockType === "ACTION" || currentBlockType === "DIALOGUE") && !(currentBlockType === "DIALOGUE" && !activeSpeaker)) {
+      lastBlock.text += " " + trimmedLine;
+    } else {
+      const newBlock = createNewBlock(currentBlockType);
+      if (currentBlockType === "SCENE_HEADING") {
+        let workingLine = trimmedLine;
+        const sceneNumMatch = workingLine.match(/^(\d+[A-Z]*)\.?\s+/i);
+        if (sceneNumMatch) {
+          newBlock.sceneNumber = String(sceneNumMatch[1]).toUpperCase();
+          workingLine = workingLine.replace(/^(\d+[A-Z]*)\.?\s+/i, "").trim();
+        } else {
+          newBlock.sceneNumber = "";
+        }
+        const typeMatch = workingLine.match(
+          /^(INT\.?\/EXT\.?|I\/E|INT|EXT|EST\.)/i
+        );
+        if (typeMatch) {
+          let sType = typeMatch[0].toUpperCase().replace(/[^A-Z/.]/g, "");
+          if (!sType.endsWith(".")) sType += ".";
+          newBlock.sceneType = sType;
+          workingLine = workingLine.substring(typeMatch[0].length).trim();
+        }
+        const suffixRegex = /[.\-\s]+(DAY|NIGHT|CONTINUOUS|LATER|MORNING|EVENING|DUSK|DAWN|MORN|AFT|SUNSET|SUNRISE)(?:\s+.*)*$/i;
+        const suffixMatch = workingLine.match(suffixRegex);
+        if (suffixMatch) {
+          const rawTime = suffixMatch[1].toUpperCase();
+          const nightKeys = ["NIGHT", "EVENING", "DUSK", "SUNSET"];
+          newBlock.timeOfDay = nightKeys.includes(rawTime) ? "NIGHT" : "DAY";
+          workingLine = workingLine.substring(0, suffixMatch.index).trim();
+        } else {
+          workingLine = workingLine.replace(/\s+\d+(\s+\d+)*$/, "").trim();
+          newBlock.timeOfDay = "DAY";
+        }
+        newBlock.text = workingLine.replace(/^[-.\s]+/, "").replace(/[-.\s]+$/, "").toUpperCase();
+      } else {
+        newBlock.text = trimmedLine;
+      }
+      blocks.push(newBlock);
+      lastBlock = newBlock;
+    }
+  }
+  return blocks.length > 0 ? blocks : [createNewBlock("SCENE_HEADING")];
+}
 
 // app/hook/use-screenplay-editor.ts
 var initialBlocks = [
@@ -551,6 +831,7 @@ var initialBlocks = [
     id: uuid(),
     type: "SCENE_HEADING",
     text: "",
+    sceneNumber: "1",
     sceneType: "INT.",
     timeOfDay: "DAY"
   }
@@ -629,6 +910,16 @@ function useScreenplayEditor() {
     () => ["(V.O.)", "(O.S.)", "(O.C.)", "(SUBTITLE)", "(CONT'D)"],
     []
   );
+  const handleSceneNumberChange = react.useCallback(
+    (id, newNumber) => {
+      setBlocks(
+        (prevBlocks) => prevBlocks.map(
+          (block) => block.id === id ? __spreadProps(__spreadValues({}, block), { sceneNumber: newNumber.toUpperCase() }) : block
+        )
+      );
+    },
+    []
+  );
   const locations = react.useMemo(() => {
     const locs = blocks.filter((b) => b.type === "SCENE_HEADING" && b.text.trim() !== "").map((b) => b.text.trim().toUpperCase());
     return [...new Set(locs)];
@@ -646,15 +937,32 @@ function useScreenplayEditor() {
   }, [blocks]);
   const sceneNumbers = react.useMemo(() => {
     const map = {};
-    let count = 0;
+    let fallbackCount = 0;
     blocks.forEach((block) => {
       if (block.type === "SCENE_HEADING") {
-        count++;
-        map[block.id] = count;
+        if (block.sceneNumber) {
+          map[block.id] = block.sceneNumber;
+          const base = parseInt(block.sceneNumber);
+          if (!isNaN(base)) fallbackCount = Math.max(fallbackCount, base);
+        } else {
+          fallbackCount++;
+          map[block.id] = String(fallbackCount);
+        }
       }
     });
     return map;
   }, [blocks]);
+  react.useCallback(() => {
+    let count = 1;
+    setBlocks(
+      (prev) => prev.map((b) => {
+        if (b.type === "SCENE_HEADING") {
+          return __spreadProps(__spreadValues({}, b), { sceneNumber: String(count++) });
+        }
+        return b;
+      })
+    );
+  }, []);
   react.useEffect(() => {
     if (newBlockId && refs.current[newBlockId]) {
       const block = blocks.find((b) => b.id === newBlockId);
@@ -675,11 +983,13 @@ function useScreenplayEditor() {
   react.useEffect(() => {
     blocks.forEach((block) => {
       const element = refs.current[block.id];
-      if (element && element.innerText !== block.text && document.activeElement !== element) {
-        element.innerText = block.text;
+      if (element) {
+        if (element.innerText !== block.text && document.activeElement !== element) {
+          element.innerText = block.text;
+        }
       }
     });
-  }, [blocks, isPageSplitEnabled, pageBreaks]);
+  }, [blocks]);
   react.useEffect(() => {
     const handleClickOutside = (e) => {
       const target = e.target;
@@ -859,17 +1169,15 @@ function useScreenplayEditor() {
         const el = refs.current[focusedBlockId];
         if (el) {
           el.focus();
-          const newBlock = createNewBlock(newType);
-          el.innerText = newBlock.text;
-          if (newType === "PARENTHETICAL") {
-            setCaretPosition(el, 1);
-          } else {
-            setCaretPosition(el, newBlock.text.length);
+          const currentBlock = blocks.find((b) => b.id === focusedBlockId);
+          if (currentBlock) {
+            const pos = newType === "PARENTHETICAL" ? el.innerText.length - 1 : el.innerText.length;
+            setCaretPosition(el, Math.max(0, pos));
           }
         }
-      }, 0);
+      }, 10);
     },
-    [focusedBlockId]
+    [focusedBlockId, blocks]
   );
   const handleSelectCharacterExtension = react.useCallback(
     (extension) => {
@@ -925,8 +1233,6 @@ function useScreenplayEditor() {
       const el = refs.current[id];
       if (el) {
         el.focus();
-        const newBlock = createNewBlock(newType);
-        el.innerText = newBlock.text;
         if (newType === "PARENTHETICAL") {
           setCaretPosition(el, 1);
         } else {
@@ -1057,28 +1363,62 @@ function useScreenplayEditor() {
     },
     [blocks, handleBlockTextChange]
   );
-  const handleFocus = react.useCallback((id) => {
-    if (blurTimeout.current) {
-      clearTimeout(blurTimeout.current);
-    }
-    setFocusedBlockId(id);
-    const block = blocks.find((b) => b.id === id);
-    if ((block == null ? void 0 : block.type) === "CHARACTER") {
-      const trimmedText = block.text.trim();
-      const openParenIndex = trimmedText.lastIndexOf("(");
-      const closeParenIndex = trimmedText.lastIndexOf(")");
-      if (openParenIndex !== -1 && openParenIndex > closeParenIndex) {
-        setShowExtensionSuggestions(true);
-        setShowSuggestions(false);
+  const handleScriptImport = react.useCallback(
+    (title, content) => {
+      const parsedBlocks = parseScreenplayText(content);
+      if (parsedBlocks.length > 0) {
+        let fallbackCount = 1;
+        const finalizedBlocks = parsedBlocks.map((block) => {
+          if (block.type === "SCENE_HEADING") {
+            if (block.sceneNumber && block.sceneNumber.trim().length > 0) {
+              const isPureNumber = /^\d+$/.test(block.sceneNumber);
+              if (isPureNumber) {
+                fallbackCount = parseInt(block.sceneNumber) + 1;
+              }
+              return block;
+            }
+            return __spreadProps(__spreadValues({}, block), { sceneNumber: String(fallbackCount++) });
+          }
+          return block;
+        });
+        setBlocks(finalizedBlocks);
+        setTimeout(() => {
+          var _a;
+          const firstId = parsedBlocks[0].id;
+          if (firstId && refs.current[firstId]) {
+            setFocusedBlockId(firstId);
+            (_a = refs.current[firstId]) == null ? void 0 : _a.focus();
+          }
+        }, 100);
+      }
+    },
+    [refs]
+  );
+  const handleFocus = react.useCallback(
+    (id) => {
+      if (blurTimeout.current) {
+        clearTimeout(blurTimeout.current);
+      }
+      setFocusedBlockId(id);
+      const block = blocks.find((b) => b.id === id);
+      if ((block == null ? void 0 : block.type) === "CHARACTER") {
+        const trimmedText = block.text.trim();
+        const openParenIndex = trimmedText.lastIndexOf("(");
+        const closeParenIndex = trimmedText.lastIndexOf(")");
+        if (openParenIndex !== -1 && openParenIndex > closeParenIndex) {
+          setShowExtensionSuggestions(true);
+          setShowSuggestions(false);
+        } else {
+          setShowExtensionSuggestions(false);
+          setShowSuggestions(openParenIndex === -1);
+        }
       } else {
+        setShowSuggestions(true);
         setShowExtensionSuggestions(false);
-        setShowSuggestions(openParenIndex === -1);
       }
-    } else {
-      setShowSuggestions(true);
-      setShowExtensionSuggestions(false);
-    }
-  }, [blocks]);
+    },
+    [blocks]
+  );
   const handleBlur = react.useCallback((id) => {
     if (document.activeElement === refs.current[id]) return;
     blurTimeout.current = setTimeout(() => {
@@ -1105,6 +1445,8 @@ function useScreenplayEditor() {
     handleBlockTypeChange,
     handleSelectCharacterExtension,
     handleKeyDown,
+    handleScriptImport,
+    handleSceneNumberChange,
     handleFocus,
     handleBlur
   };