@vishu1301/script-writing 1.5.7 → 1.5.8

package/dist/index.cjs

@@ -6286,8 +6286,182 @@ function useShotBreakdownScene(options) {
     menuRef
   };
 }
+function SceneScriptView({
+  blocks,
+  isLoading = false,
+  sceneNumber,
+  title
+}) {
+  const COURIER_STACK = "'Courier Prime', 'Courier', monospace";
+  react.useEffect(() => {
+    const fontId = "google-font-courier-prime";
+    const styleId = "screenplay-editor-force-v4";
+    if (!document.getElementById(fontId)) {
+      const link = document.createElement("link");
+      link.id = fontId;
+      link.rel = "stylesheet";
+      link.href = "https://fonts.googleapis.com/css2?family=Courier+Prime:ital,wght@0,400;0,700;1,400;1,700&display=swap";
+      document.head.appendChild(link);
+    }
+    if (!document.getElementById(styleId)) {
+      const style = document.createElement("style");
+      style.id = styleId;
+      style.textContent = `
+        [data-scene-script-view] *, 
+        [data-scene-script-view] div, 
+        [data-scene-script-view] span {
+          font-family: ${COURIER_STACK} !important;
+          -webkit-font-smoothing: antialiased;
+        }
+      `;
+      document.head.appendChild(style);
+    }
+  }, [COURIER_STACK]);
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center py-32 gap-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "w-8 h-8 animate-spin text-zinc-400" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-zinc-500 animate-pulse", children: "Loading script..." })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: "relative bg-[#fdfdfc] shadow-[0_10px_30px_rgba(0,0,0,0.04),0_1px_8px_rgba(0,0,0,0.02)] border border-zinc-100 rounded-sm md:rounded-md flex flex-col w-full max-w-[210mm] min-h-auto shrink-0 pb-24",
+      style: {
+        fontFamily: COURIER_STACK,
+        paddingLeft: "1.5in",
+        paddingRight: "1in",
+        paddingTop: "1in",
+        paddingBottom: "1in",
+        lineHeight: "1.2"
+      },
+      "data-scene-script-view": "true",
+      children: blocks.map((block) => /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: `relative break-words w-full px-4 py-2 ${blockStyles[block.type].className}`,
+          style: __spreadProps(__spreadValues({}, blockStyles[block.type].inputStyle), {
+            minHeight: "1.5rem"
+          }),
+          children: block.type === "SCENE_HEADING" ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+            block.sceneNumber && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -left-16 text-zinc-400 font-bold select-none", children: block.sceneNumber }),
+            block.sceneType && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-bold", children: block.sceneType }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-bold", children: block.text }),
+            block.timeOfDay && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-400", children: "-" }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-bold", children: block.timeOfDay })
+            ] })
+          ] }) : block.text
+        },
+        block.id
+      ))
+    }
+  );
+}
+function useSceneScript(options) {
+  const [sceneContent, setSceneContent] = react.useState(null);
+  const [isLoading, setIsLoading] = react.useState(true);
+  const [error, setError] = react.useState(null);
+  react.useEffect(() => {
+    let isMounted = true;
+    setIsLoading(true);
+    setError(null);
+    const fetchScene = async () => {
+      try {
+        const response = await fetch(options.scene_url, options.fetchOptions);
+        if (response.ok) {
+          const text = await response.text();
+          if (isMounted) {
+            setSceneContent(text);
+          }
+        } else {
+          if (isMounted) {
+            setError(`Failed to fetch scene: ${response.statusText}`);
+          }
+        }
+      } catch (err) {
+        if (isMounted) {
+          setError(err instanceof Error ? err.message : "An unknown error occurred");
+        }
+      } finally {
+        if (isMounted) {
+          setIsLoading(false);
+        }
+      }
+    };
+    fetchScene();
+    return () => {
+      isMounted = false;
+    };
+  }, [options.scene_url]);
+  const blocks = react.useMemo(() => {
+    if (!sceneContent) return [];
+    const parser = new DOMParser();
+    const doc = parser.parseFromString(sceneContent, "text/html");
+    const divs = Array.from(doc.querySelectorAll("div"));
+    const parsedBlocks = [];
+    const typeMap = {
+      divtype0: "SCENE_HEADING",
+      divtype2: "ACTION",
+      divtype3: "CHARACTER",
+      divtype4: "PARENTHETICAL",
+      divtype5: "DIALOGUE",
+      divtype6: "TRANSITION"
+    };
+    divs.forEach((div) => {
+      var _a;
+      const divText = ((_a = div.textContent) == null ? void 0 : _a.trim()) || "";
+      if (!divText && !div.classList.contains("divtype0")) return;
+      let type = "ACTION";
+      for (const className of Array.from(div.classList)) {
+        if (typeMap[className]) {
+          type = typeMap[className];
+          break;
+        }
+      }
+      const idAttr = div.getAttribute("id");
+      const blockId = idAttr && idAttr.startsWith("par") ? idAttr.substring(3) : idAttr || uuid();
+      let sceneNumber;
+      let sceneType;
+      let timeOfDay;
+      let blockText = divText;
+      if (type === "SCENE_HEADING") {
+        const typeMatch = blockText.match(/^(INT\.?\/EXT\.?|INT\.?|EXT\.?|I\/E)\s+/i);
+        if (typeMatch) {
+          const matchedType = typeMatch[1].toUpperCase();
+          if (matchedType.includes("INT") && matchedType.includes("EXT")) sceneType = "INT/EXT.";
+          else if (matchedType.includes("EXT")) sceneType = "EXT.";
+          else sceneType = "INT.";
+          blockText = blockText.substring(typeMatch[0].length).trim();
+        }
+        const timeMatch = blockText.match(/\s+-\s+(DAY|NIGHT|MORNING|EVENING|AFTERNOON|LATER|MOMENTS LATER|CONTINUOUS)$/i);
+        if (timeMatch) {
+          timeOfDay = timeMatch[1].toUpperCase();
+          blockText = blockText.substring(0, timeMatch.index).trim();
+        }
+        blockText = blockText.replace(/^-+\s*|\s*-+$/g, "").trim();
+      }
+      parsedBlocks.push({
+        id: blockId,
+        type,
+        text: blockText,
+        sceneNumber,
+        sceneType,
+        timeOfDay
+      });
+    });
+    return parsedBlocks;
+  }, [sceneContent]);
+  return {
+    blocks,
+    isLoading,
+    error,
+    sceneContent
+  };
+}
 
 exports.CATEGORIES = CATEGORIES;
+exports.SceneScriptView = SceneScriptView;
 exports.ScreenplayEditorView = ScreenplayEditorView;
 exports.ScriptBreakdownSceneView = ScriptBreakdownSceneView;
 exports.ShotBreakdownView = ShotBreakdownView;
@@ -6306,6 +6480,7 @@ exports.lens_options = lens_options;
 exports.scene_types = scene_types;
 exports.shot_types = shot_types;
 exports.timeOfDayOptions = timeOfDayOptions;
+exports.useSceneScript = useSceneScript;
 exports.useScreenplayEditor = useScreenplayEditor;
 exports.useScriptBreakdownScene = useScriptBreakdownScene;
 exports.useShotBreakdownScene = useShotBreakdownScene;