@vishu1301/script-writing 0.4.6 → 0.4.8

package/dist/index.d.cts

@@ -37,7 +37,7 @@ declare function useScreenplayEditor(): {
     handleBlockTypeChange: (newType: BlockType) => void;
     handleSelectCharacterExtension: (extension: string) => void;
     handleKeyDown: (e: KeyboardEvent<HTMLDivElement>, id: string, text: string) => void;
-    handleScriptImport: (title: string, content: string) => void;
+    handleScriptImport: (title: string, content: string, preParsedBlocks?: Partial<Block>[]) => void;
     handleSceneNumberChange: (id: string, newNumber: string) => void;
     handleFocus: (id: string) => void;
     handleBlur: (id: string) => void;
@@ -46,9 +46,13 @@ declare function useScreenplayEditor(): {
 type ScreenplayEditorViewProps = ReturnType<typeof useScreenplayEditor> & {
     onSave?: () => void;
     onSaveAsPdf?: () => void;
+    onSaveAsSbx?: () => void;
     onSyncWithCloud?: () => void;
     handleSceneNumberChange: (blockId: string, value: string) => void;
 };
-declare function ScreenplayEditorView({ blocks, refs, focusedBlockId, showSuggestions, showExtensionSuggestions, characterExtensions, locations, characters, handleBlockTextChange, handleSceneTypeChange, handleTimeOfDayChange, handleBlockTypeChange, handleSelectCharacterExtension, handleKeyDown, handleFocus, handleBlur, handleScriptImport, onSave, onSaveAsPdf, onSyncWithCloud, handleSceneNumberChange, }: ScreenplayEditorViewProps): react_jsx_runtime.JSX.Element;
+declare function ScreenplayEditorView({ blocks, refs, focusedBlockId, showSuggestions, showExtensionSuggestions, characterExtensions, locations, characters, handleBlockTextChange, handleSceneTypeChange, handleTimeOfDayChange, handleBlockTypeChange, handleSelectCharacterExtension, handleKeyDown, handleFocus, handleBlur, handleScriptImport, onSave, onSaveAsPdf, onSaveAsSbx, onSyncWithCloud, handleSceneNumberChange, }: ScreenplayEditorViewProps): react_jsx_runtime.JSX.Element;
 
-export { type Block, type BlockType, ScreenplayEditorView, type TimeOfDay, blockStyles, blockTypes, icons, timeOfDayOptions, useScreenplayEditor, uuid };
+declare const handleSaveAsPdf: (blocks: Block[], sceneNumbers: Record<string, string>) => void;
+declare const handleSaveAsSbx: (blocks: Block[], sceneNumbers: Record<string, string>, onSaveAsSbx?: (file: File) => void) => void;
+
+export { type Block, type BlockType, ScreenplayEditorView, type TimeOfDay, blockStyles, blockTypes, handleSaveAsPdf, handleSaveAsSbx, icons, timeOfDayOptions, useScreenplayEditor, uuid };

package/dist/index.d.ts

@@ -37,7 +37,7 @@ declare function useScreenplayEditor(): {
     handleBlockTypeChange: (newType: BlockType) => void;
     handleSelectCharacterExtension: (extension: string) => void;
     handleKeyDown: (e: KeyboardEvent<HTMLDivElement>, id: string, text: string) => void;
-    handleScriptImport: (title: string, content: string) => void;
+    handleScriptImport: (title: string, content: string, preParsedBlocks?: Partial<Block>[]) => void;
     handleSceneNumberChange: (id: string, newNumber: string) => void;
     handleFocus: (id: string) => void;
     handleBlur: (id: string) => void;
@@ -46,9 +46,13 @@ declare function useScreenplayEditor(): {
 type ScreenplayEditorViewProps = ReturnType<typeof useScreenplayEditor> & {
     onSave?: () => void;
     onSaveAsPdf?: () => void;
+    onSaveAsSbx?: () => void;
     onSyncWithCloud?: () => void;
     handleSceneNumberChange: (blockId: string, value: string) => void;
 };
-declare function ScreenplayEditorView({ blocks, refs, focusedBlockId, showSuggestions, showExtensionSuggestions, characterExtensions, locations, characters, handleBlockTextChange, handleSceneTypeChange, handleTimeOfDayChange, handleBlockTypeChange, handleSelectCharacterExtension, handleKeyDown, handleFocus, handleBlur, handleScriptImport, onSave, onSaveAsPdf, onSyncWithCloud, handleSceneNumberChange, }: ScreenplayEditorViewProps): react_jsx_runtime.JSX.Element;
+declare function ScreenplayEditorView({ blocks, refs, focusedBlockId, showSuggestions, showExtensionSuggestions, characterExtensions, locations, characters, handleBlockTextChange, handleSceneTypeChange, handleTimeOfDayChange, handleBlockTypeChange, handleSelectCharacterExtension, handleKeyDown, handleFocus, handleBlur, handleScriptImport, onSave, onSaveAsPdf, onSaveAsSbx, onSyncWithCloud, handleSceneNumberChange, }: ScreenplayEditorViewProps): react_jsx_runtime.JSX.Element;
 
-export { type Block, type BlockType, ScreenplayEditorView, type TimeOfDay, blockStyles, blockTypes, icons, timeOfDayOptions, useScreenplayEditor, uuid };
+declare const handleSaveAsPdf: (blocks: Block[], sceneNumbers: Record<string, string>) => void;
+declare const handleSaveAsSbx: (blocks: Block[], sceneNumbers: Record<string, string>, onSaveAsSbx?: (file: File) => void) => void;
+
+export { type Block, type BlockType, ScreenplayEditorView, type TimeOfDay, blockStyles, blockTypes, handleSaveAsPdf, handleSaveAsSbx, icons, timeOfDayOptions, useScreenplayEditor, uuid };

package/dist/index.js

@@ -1,7 +1,8 @@
 import { useState, useRef, useMemo, useCallback, useEffect } from 'react';
-import { ArrowRightLeft, MessageCircle, Brackets, UserRound, Sparkles, Clapperboard, ArrowRight, User, ChevronRight, Upload, Save, FileDown, Cog } from 'lucide-react';
+import { ArrowRightLeft, MessageCircle, Brackets, UserRound, Sparkles, Clapperboard, ArrowRight, User, ChevronRight, Upload, Save, FileDown, RefreshCcw, Cog } from 'lucide-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as pdfjs from 'pdfjs-dist';
+import jsPDF from 'jspdf';
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -139,45 +140,107 @@ function PdfImporter({ onScriptImported, children }) {
     setIsProcessing(true);
     setError(null);
     try {
-      const arrayBuffer = await file.arrayBuffer();
-      const pdf = await pdfjs.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;
+      if (file.name.toLowerCase().endsWith(".sbx")) {
+        let text = await file.text();
+        if (text.includes("&lt;div")) {
+          const textarea = document.createElement("textarea");
+          textarea.innerHTML = text;
+          text = textarea.value;
+        }
+        const parser = new DOMParser();
+        const doc = parser.parseFromString(text, "text/html");
+        const divs = Array.from(doc.querySelectorAll("div"));
+        const preParsedBlocks = [];
+        const typeMap = {
+          divtype0: "SCENE_HEADING",
+          divtype2: "ACTION",
+          divtype3: "CHARACTER",
+          divtype4: "PARENTHETICAL",
+          divtype5: "DIALOGUE",
+          divtype6: "TRANSITION"
+        };
+        divs.forEach((div) => {
+          var _a2;
+          let divText = ((_a2 = div.textContent) == null ? void 0 : _a2.trim()) || "";
+          if (!divText) return;
+          let type = "ACTION";
+          for (const className of Array.from(div.classList)) {
+            if (typeMap[className]) {
+              type = typeMap[className];
               break;
             }
           }
-          if (!found) {
-            lines.push({ y: item.transform[5], items: [{ x: item.transform[4], text: item.str }] });
+          const block = { type, text: divText };
+          if (type === "SCENE_HEADING") {
+            const sceneNum = div.getAttribute("data-scene");
+            if (sceneNum) block.sceneNumber = sceneNum;
+            let parsedText = divText;
+            const typeMatch = parsedText.match(/^(INT\/EXT|INT|EXT)\.?\s+/i);
+            if (typeMatch) {
+              let sType = typeMatch[1].toUpperCase();
+              if (!sType.endsWith(".")) sType += ".";
+              block.sceneType = sType;
+              parsedText = parsedText.substring(typeMatch[0].length).trim();
+            }
+            const timeMatch = parsedText.match(/\s+-\s+([^-]+)$/);
+            if (timeMatch) {
+              block.timeOfDay = timeMatch[1].trim().toUpperCase();
+              parsedText = parsedText.substring(0, timeMatch.index).trim();
+            }
+            block.text = parsedText;
+          }
+          preParsedBlocks.push(block);
+        });
+        const title = file.name.replace(/\.sbx$/i, "");
+        onScriptImported(title.trim(), "", preParsedBlocks);
+      } else {
+        const arrayBuffer = await file.arrayBuffer();
+        const pdf = await pdfjs.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);
         }
-        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";
+        let scriptContent = "";
+        for (let i = 2; i <= pdf.numPages; i++) {
+          scriptContent += await processPage(i) + "\n\n";
+        }
+        onScriptImported(title.trim(), scriptContent);
       }
-      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.");
+      setError(
+        err instanceof Error ? `Error processing PDF: ${err.message}` : "An unknown error occurred."
+      );
     } finally {
       setIsProcessing(false);
       if (event.target) {
@@ -195,7 +258,7 @@ function PdfImporter({ onScriptImported, children }) {
       {
         ref: fileInputRef,
         type: "file",
-        accept: "application/pdf",
+        accept: ".pdf,.sbx,application/pdf",
         onChange: handleFileChange,
         disabled: isProcessing,
         className: "hidden",
@@ -208,7 +271,7 @@ function PdfImporter({ onScriptImported, children }) {
         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",
+        "aria-label": "Import Script",
         children: isProcessing ? /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: "Processing..." }) : children
       }
     ),
@@ -238,6 +301,7 @@ function ScreenplayEditorView({
   handleScriptImport,
   onSave,
   onSaveAsPdf,
+  onSaveAsSbx,
   onSyncWithCloud,
   handleSceneNumberChange
 }) {
@@ -531,6 +595,18 @@ function ScreenplayEditorView({
           ]
         }
       ),
+      onSaveAsSbx && /* @__PURE__ */ jsxs(
+        "button",
+        {
+          onClick: onSaveAsSbx,
+          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": "Save Script as SBX",
+          children: [
+            /* @__PURE__ */ jsx(RefreshCcw, { className: "w-5 h-5" }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: "Save" })
+          ]
+        }
+      ),
       isRulesOpen && /* @__PURE__ */ jsxs("div", { className: "bg-white/80 backdrop-blur-md rounded-xl shadow-lg border border-zinc-200/50 p-4 text-xs text-zinc-700 select-none font-sans overflow-hidden transition-all duration-300 w-64 origin-bottom-right animate-in fade-in zoom-in-95", children: [
         /* @__PURE__ */ jsx("h4", { className: "font-bold text-zinc-800 mb-3 text-sm", children: "Settings & Shortcuts" }),
         /* @__PURE__ */ jsx("div", { className: "space-y-4", children: /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children: /* @__PURE__ */ jsxs("ul", { className: "space-y-1.5", children: [
@@ -1193,8 +1269,20 @@ function useScreenplayEditor() {
     [blocks, handleBlockTextChange]
   );
   const handleScriptImport = useCallback(
-    (title, content) => {
-      const parsedBlocks = parseScreenplayText(content);
+    (title, content, preParsedBlocks) => {
+      let parsedBlocks = [];
+      if (preParsedBlocks && preParsedBlocks.length > 0) {
+        parsedBlocks = preParsedBlocks.map((b) => ({
+          id: uuid(),
+          type: b.type || "ACTION",
+          text: b.text || "",
+          sceneNumber: b.sceneNumber,
+          sceneType: b.sceneType,
+          timeOfDay: b.timeOfDay
+        }));
+      } else {
+        parsedBlocks = parseScreenplayText(content);
+      }
       if (parsedBlocks.length > 0) {
         let fallbackCount = 1;
         const finalizedBlocks = parsedBlocks.map((block) => {
@@ -1277,7 +1365,133 @@ function useScreenplayEditor() {
     handleBlur
   };
 }
+var handleSaveAsPdf = (blocks, sceneNumbers) => {
+  if (document.activeElement instanceof HTMLElement) {
+    document.activeElement.blur();
+  }
+  const doc = new jsPDF({
+    orientation: "portrait",
+    unit: "mm",
+    format: "letter"
+  });
+  const FONT_SIZE = 12;
+  const LINE_HEIGHT = 4.233;
+  const PAGE_WIDTH = doc.internal.pageSize.getWidth();
+  const PAGE_HEIGHT = doc.internal.pageSize.getHeight();
+  const MARGIN_LEFT = 38.1;
+  const MARGIN_RIGHT = 25.4;
+  const MARGIN_TOP = 25.4;
+  const MARGIN_BOTTOM = 25.4;
+  const blockDimensions = {
+    SCENE_HEADING: { indent: 0, width: 152.4, upper: true, bold: true },
+    ACTION: { indent: 0, width: 152.4, upper: false, bold: false },
+    CHARACTER: { indent: 50.8, width: 101.6, upper: true, bold: false },
+    PARENTHETICAL: { indent: 38.1, width: 50.8, upper: false, bold: false },
+    DIALOGUE: { indent: 25.4, width: 88.9, upper: false, bold: false },
+    TRANSITION: {
+      indent: 0,
+      width: 152.4,
+      upper: true,
+      bold: false,
+      align: "right"
+    },
+    GENERAL: { indent: 0, width: 152.4, upper: false, bold: false }
+  };
+  let y = MARGIN_TOP;
+  let pageNumber = 1;
+  const drawPageNumber = (num) => {
+    if (num > 1) {
+      doc.setFont("Courier", "normal");
+      doc.setFontSize(12);
+      doc.text(`${num}.`, PAGE_WIDTH - MARGIN_RIGHT, 12.7, {
+        align: "right"
+      });
+    }
+  };
+  blocks.forEach((block, index) => {
+    const config = blockDimensions[block.type] || blockDimensions.GENERAL;
+    let text = block.text || "";
+    if (config.upper) text = text.toUpperCase();
+    if (block.type === "SCENE_HEADING") {
+      text = `${block.sceneType || "INT."} ${text} - ${block.timeOfDay || "DAY"}`.toUpperCase();
+    }
+    doc.setFont("Courier", config.bold ? "bold" : "normal");
+    doc.setFontSize(FONT_SIZE);
+    const lines = doc.splitTextToSize(text, config.width);
+    const blockHeight = lines.length * LINE_HEIGHT;
+    let safetyBuffer = 0;
+    if (block.type === "CHARACTER") safetyBuffer = LINE_HEIGHT * 3;
+    if (y + blockHeight + safetyBuffer > PAGE_HEIGHT - MARGIN_BOTTOM) {
+      doc.addPage();
+      pageNumber++;
+      drawPageNumber(pageNumber);
+      y = MARGIN_TOP;
+      doc.setFont("Courier", config.bold ? "bold" : "normal");
+      doc.setFontSize(FONT_SIZE);
+    }
+    if (y > MARGIN_TOP) {
+      if (block.type === "SCENE_HEADING" || block.type === "ACTION" || block.type === "CHARACTER") {
+        y += LINE_HEIGHT;
+      }
+    }
+    const xPos = MARGIN_LEFT + config.indent;
+    if (config.align === "right") {
+      doc.text(lines, PAGE_WIDTH - MARGIN_RIGHT, y, { align: "right" });
+    } else {
+      doc.text(lines, xPos, y);
+    }
+    if (block.type === "SCENE_HEADING" && (sceneNumbers == null ? void 0 : sceneNumbers[block.id])) {
+      const sNum = String(sceneNumbers[block.id]);
+      doc.setFont("Courier", "normal");
+      doc.setFontSize(FONT_SIZE);
+      doc.text(sNum, MARGIN_LEFT - 12, y);
+      doc.text(sNum, PAGE_WIDTH - MARGIN_RIGHT + 5, y);
+      doc.setFont("Courier", config.bold ? "bold" : "normal");
+    }
+    y += blockHeight;
+  });
+  doc.save("screenplay_export.pdf");
+};
+var handleSaveAsSbx = (blocks, sceneNumbers, onSaveAsSbx) => {
+  const typeToDivClass = {
+    SCENE_HEADING: "divtype0",
+    ACTION: "divtype2",
+    CHARACTER: "divtype3",
+    PARENTHETICAL: "divtype4",
+    DIALOGUE: "divtype5",
+    TRANSITION: "divtype6",
+    GENERAL: "divtype2"
+  };
+  const sbxData = blocks.map((block) => {
+    const divClass = typeToDivClass[block.type] || "divtype2";
+    let text = block.text || "";
+    let extraAttributes = "";
+    if (block.type === "SCENE_HEADING") {
+      text = `${block.sceneType || "INT."} ${text} - ${block.timeOfDay || "DAY"}`.toUpperCase();
+      const sceneNum = sceneNumbers == null ? void 0 : sceneNumbers[block.id];
+      if (sceneNum) {
+        extraAttributes = ` data-scene="${sceneNum}"`;
+      }
+    } else if (block.type === "CHARACTER" || block.type === "TRANSITION") {
+      text = text.toUpperCase();
+    }
+    return `<div class="${divClass}" id="par${block.id}"${extraAttributes}>${text}</div>`;
+  }).join("");
+  const blob = new Blob([sbxData], { type: "text/plain" });
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = "screenplay.sbx";
+  document.body.appendChild(a);
+  a.click();
+  document.body.removeChild(a);
+  URL.revokeObjectURL(url);
+  if (onSaveAsSbx) {
+    const file = new File([blob], "screenplay.sbx", { type: "text/plain" });
+    onSaveAsSbx(file);
+  }
+};
 
-export { ScreenplayEditorView, blockStyles, blockTypes, icons, timeOfDayOptions, useScreenplayEditor, uuid };
+export { ScreenplayEditorView, blockStyles, blockTypes, handleSaveAsPdf, handleSaveAsSbx, icons, timeOfDayOptions, useScreenplayEditor, uuid };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map