@vishu1301/script-writing 1.2.2 → 1.2.3

package/dist/index.d.cts

@@ -72,7 +72,7 @@ interface ScriptBreakdown {
     scene_number: string;
     content: string;
 }
-type ElementCategory = "CAST" | "PROP" | "COSTUME" | "VEHICLE" | "SET_PROP" | "EXTRA" | "LOCATION" | "OTHER";
+type ElementCategory = "CAST" | "PROP" | "COSTUME" | "VEHICLE" | "SET_PROP" | "EXTRA" | "LOCATION" | "SUBLOCATION" | "OTHER";
 interface Tag {
     id?: string;
     scene_id?: string | number;
@@ -91,7 +91,7 @@ declare const CATEGORIES: {
     hex: string;
 }[];
 
-declare function ScriptBreakdownSceneView({ blocks, characters, isLoading, sceneNumber, tags, selectionMenu, handleMouseUp, addTag, removeTag, clearSelection, menuPlacement, menuRef, subLocations, addSubLocation, removeSubLocation, sceneBrief, setSceneBrief, onSummarize, isSummarizing, }: {
+declare function ScriptBreakdownSceneView({ blocks, characters, isLoading, sceneNumber, tags, selectionMenu, handleMouseUp, addTag, updateTag, removeTag, clearSelection, menuPlacement, menuRef, sceneBrief, setSceneBrief, onSummarize, isSummarizing, }: {
     blocks: Block[];
     characters: string[];
     isLoading: boolean;
@@ -107,13 +107,11 @@ declare function ScriptBreakdownSceneView({ blocks, characters, isLoading, scene
     } | null;
     handleMouseUp: () => void;
     addTag: (c: ElementCategory) => void;
+    updateTag?: (id: string, categoryId: ElementCategory) => void;
     removeTag: (e: React__default.MouseEvent, id?: string) => void;
     clearSelection: () => void;
     menuPlacement: "top" | "bottom";
     menuRef: React__default.RefObject<HTMLDivElement | null>;
-    subLocations: string[];
-    addSubLocation: (loc: string) => void;
-    removeSubLocation: (loc: string) => void;
     sceneBrief: string;
     setSceneBrief: (brief: string) => void;
     onSummarize?: () => void;
@@ -126,6 +124,7 @@ interface UseScriptBreakdownSceneOptions {
     onAISummarize?: (scene: any) => void;
     onTagAdded?: (tag: Tag) => void;
     onTagRemoved?: (tagId: string) => void;
+    onTagUpdated?: (tagId: string, categoryId: ElementCategory) => void;
     preLoadedTags?: Tag[];
 }
 declare function useScriptBreakdownScene(options: UseScriptBreakdownSceneOptions): {
@@ -145,13 +144,11 @@ declare function useScriptBreakdownScene(options: UseScriptBreakdownSceneOptions
     } | null;
     handleMouseUp: () => void;
     addTag: (categoryId: ElementCategory) => Promise<void>;
+    updateTag: (id: string, categoryId: ElementCategory) => Promise<void>;
     removeTag: (e: React.MouseEvent, id: string) => Promise<void>;
     clearSelection: () => void;
     menuPlacement: "bottom" | "top";
     menuRef: React$1.RefObject<HTMLDivElement | null>;
-    subLocations: string[];
-    addSubLocation: (subLocation: string) => void;
-    removeSubLocation: (subLocation: string) => void;
     sceneBrief: string;
     setSceneBrief: React$1.Dispatch<React$1.SetStateAction<string>>;
     handleAISummarize: () => Promise<any>;

package/dist/index.d.ts

@@ -72,7 +72,7 @@ interface ScriptBreakdown {
     scene_number: string;
     content: string;
 }
-type ElementCategory = "CAST" | "PROP" | "COSTUME" | "VEHICLE" | "SET_PROP" | "EXTRA" | "LOCATION" | "OTHER";
+type ElementCategory = "CAST" | "PROP" | "COSTUME" | "VEHICLE" | "SET_PROP" | "EXTRA" | "LOCATION" | "SUBLOCATION" | "OTHER";
 interface Tag {
     id?: string;
     scene_id?: string | number;
@@ -91,7 +91,7 @@ declare const CATEGORIES: {
     hex: string;
 }[];
 
-declare function ScriptBreakdownSceneView({ blocks, characters, isLoading, sceneNumber, tags, selectionMenu, handleMouseUp, addTag, removeTag, clearSelection, menuPlacement, menuRef, subLocations, addSubLocation, removeSubLocation, sceneBrief, setSceneBrief, onSummarize, isSummarizing, }: {
+declare function ScriptBreakdownSceneView({ blocks, characters, isLoading, sceneNumber, tags, selectionMenu, handleMouseUp, addTag, updateTag, removeTag, clearSelection, menuPlacement, menuRef, sceneBrief, setSceneBrief, onSummarize, isSummarizing, }: {
     blocks: Block[];
     characters: string[];
     isLoading: boolean;
@@ -107,13 +107,11 @@ declare function ScriptBreakdownSceneView({ blocks, characters, isLoading, scene
     } | null;
     handleMouseUp: () => void;
     addTag: (c: ElementCategory) => void;
+    updateTag?: (id: string, categoryId: ElementCategory) => void;
     removeTag: (e: React__default.MouseEvent, id?: string) => void;
     clearSelection: () => void;
     menuPlacement: "top" | "bottom";
     menuRef: React__default.RefObject<HTMLDivElement | null>;
-    subLocations: string[];
-    addSubLocation: (loc: string) => void;
-    removeSubLocation: (loc: string) => void;
     sceneBrief: string;
     setSceneBrief: (brief: string) => void;
     onSummarize?: () => void;
@@ -126,6 +124,7 @@ interface UseScriptBreakdownSceneOptions {
     onAISummarize?: (scene: any) => void;
     onTagAdded?: (tag: Tag) => void;
     onTagRemoved?: (tagId: string) => void;
+    onTagUpdated?: (tagId: string, categoryId: ElementCategory) => void;
     preLoadedTags?: Tag[];
 }
 declare function useScriptBreakdownScene(options: UseScriptBreakdownSceneOptions): {
@@ -145,13 +144,11 @@ declare function useScriptBreakdownScene(options: UseScriptBreakdownSceneOptions
     } | null;
     handleMouseUp: () => void;
     addTag: (categoryId: ElementCategory) => Promise<void>;
+    updateTag: (id: string, categoryId: ElementCategory) => Promise<void>;
     removeTag: (e: React.MouseEvent, id: string) => Promise<void>;
     clearSelection: () => void;
     menuPlacement: "bottom" | "top";
     menuRef: React$1.RefObject<HTMLDivElement | null>;
-    subLocations: string[];
-    addSubLocation: (subLocation: string) => void;
-    removeSubLocation: (subLocation: string) => void;
     sceneBrief: string;
     setSceneBrief: React$1.Dispatch<React$1.SetStateAction<string>>;
     handleAISummarize: () => Promise<any>;

package/dist/index.js

@@ -1,5 +1,5 @@
 import { useState, useRef, useEffect, useMemo, useCallback } from 'react';
-import { ArrowRightLeft, MessageCircle, Brackets, UserRound, Sparkles, Clapperboard, Upload, Lock, Unlock, Save, FileDown, RefreshCcw, Cog, ArrowRight, User, ChevronRight, Loader2, AlignLeft, Tags, Plus, X } from 'lucide-react';
+import { ArrowRightLeft, MessageCircle, Brackets, UserRound, Sparkles, Clapperboard, Upload, Lock, Unlock, Save, FileDown, RefreshCcw, Cog, ArrowRight, User, ChevronRight, Loader2, AlignLeft, Tags } from 'lucide-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as pdfjs from 'pdfjs-dist';
 import jsPDF from 'jspdf';
@@ -1728,6 +1728,7 @@ var CATEGORIES = [
   { id: "SET_PROP", label: "Set Prop", color: "#00C853", hex: "#69F0AE" },
   { id: "EXTRA", label: "Extra", color: "#00B8D4", hex: "#62EFFF" },
   { id: "LOCATION", label: "Location", color: "#FFB300", hex: "#FFE082" },
+  { id: "SUBLOCATION", label: "Sublocation", color: "#004CFF", hex: "#004CFF" },
   { id: "OTHER", label: "Other", color: "#9E9E9E", hex: "#E0E0E0" }
 ];
 var PopcornIcon = ({ isSummarizing }) => /* @__PURE__ */ jsxs(
@@ -1915,31 +1916,17 @@ function ScriptBreakdownSceneView({
   selectionMenu,
   handleMouseUp,
   addTag,
+  updateTag,
   removeTag,
   clearSelection,
   menuPlacement,
   menuRef,
-  subLocations,
-  addSubLocation,
-  removeSubLocation,
   sceneBrief,
   setSceneBrief,
   onSummarize,
   isSummarizing
 }) {
   const COURIER_STACK = "'Courier Prime', 'Courier', monospace";
-  const [isSubLocOpen, setIsSubLocOpen] = useState(false);
-  const [subLocInput, setSubLocInput] = useState("");
-  const subLocPopoverRef = useRef(null);
-  useEffect(() => {
-    const handleClickOutside = (e) => {
-      if (isSubLocOpen && subLocPopoverRef.current && !subLocPopoverRef.current.contains(e.target)) {
-        setIsSubLocOpen(false);
-      }
-    };
-    document.addEventListener("mousedown", handleClickOutside);
-    return () => document.removeEventListener("mousedown", handleClickOutside);
-  }, [isSubLocOpen]);
   useEffect(() => {
     const fontId = "google-font-courier-prime";
     const styleId = "screenplay-editor-force-v4";
@@ -2083,11 +2070,20 @@ function ScriptBreakdownSceneView({
                       ] }),
                       /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex flex-col gap-1", children: [
                         CATEGORIES.filter(
-                          (cat) => !(cat.id === "LOCATION" && hasLocationTag)
+                          (cat) => !(cat.id === "LOCATION" && hasLocationTag) && !(cat.id === "SUBLOCATION" && !hasLocationTag)
                         ).map((cat) => /* @__PURE__ */ jsxs(
                           "button",
                           {
-                            onClick: () => addTag(cat.id),
+                            onClick: () => {
+                              const existingTag = tags.find(
+                                (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
+                              );
+                              if (existingTag && existingTag.id) {
+                                updateTag == null ? void 0 : updateTag(existingTag.id, cat.id);
+                              } else {
+                                addTag(cat.id);
+                              }
+                            },
                             className: "group w-full text-[12px] font-bold px-3 py-2 rounded-xl transition-all duration-300 text-left flex items-center justify-between hover:bg-white/80 hover:shadow-[0_2px_10px_rgb(0,0,0,0.02)] active:scale-[0.98]",
                             style: { color: cat.color },
                             children: [
@@ -2174,6 +2170,7 @@ function ScriptBreakdownSceneView({
           /* @__PURE__ */ jsx("span", { className: "ml-auto bg-slate-100/80 text-slate-500 px-2.5 py-1 rounded-lg text-[10px] font-bold tracking-widest border border-slate-200/50 shadow-inner", children: tags.length })
         ] }),
         tags.length > 0 ? /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-8", children: CATEGORIES.map((cat) => {
+          if (cat.id === "SUBLOCATION" && !hasLocationTag) return null;
           const catTags = Array.from(
             new Map(
               tags.filter((t) => t.category_id === cat.id).map((tag) => [tag.name.toLowerCase(), tag])
@@ -2191,88 +2188,15 @@ function ScriptBreakdownSceneView({
               ),
               cat.label
             ] }),
-            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2", children: [
-              catTags.map((tag, index) => /* @__PURE__ */ jsx(
-                "span",
-                {
-                  className: "text-[11px] font-bold px-3 py-1.5 rounded-xl bg-white/80 backdrop-blur-md border border-white shadow-[0_4px_15px_rgb(0,0,0,0.03)] hover:shadow-[0_4px_20px_rgb(0,0,0,0.06)] hover:-translate-y-0.5 transition-all duration-300 cursor-default",
-                  style: { color: cat.color },
-                  children: tag.name
-                },
-                index
-              )),
-              cat.id === "LOCATION" && /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  className: "relative flex items-center",
-                  ref: subLocPopoverRef,
-                  children: [
-                    /* @__PURE__ */ jsx(
-                      "button",
-                      {
-                        onClick: () => setIsSubLocOpen(!isSubLocOpen),
-                        className: "flex items-center justify-center w-5 h-5 rounded-full hover:bg-slate-200 transition-colors",
-                        title: "Add Sub Location",
-                        children: /* @__PURE__ */ jsx(Plus, { className: "w-3 h-3 text-slate-500" })
-                      }
-                    ),
-                    isSubLocOpen && /* @__PURE__ */ jsxs("div", { className: "absolute left-0 top-full mt-2 w-56 bg-white backdrop-blur-2xl shadow-[0_10px_40px_rgb(0,0,0,0.06)] border border-white rounded-[1.5rem] p-3 z-50 animate-in fade-in zoom-in-95", children: [
-                      /* @__PURE__ */ jsx("p", { className: "text-[9px] font-extrabold tracking-[0.2em] text-slate-400 uppercase mb-2 px-1", children: "Add Sub Location" }),
-                      /* @__PURE__ */ jsxs("div", { className: "flex gap-2 items-center", children: [
-                        /* @__PURE__ */ jsx(
-                          "input",
-                          {
-                            type: "text",
-                            value: subLocInput,
-                            onChange: (e) => setSubLocInput(e.target.value),
-                            onKeyDown: (e) => {
-                              if (e.key === "Enter") {
-                                addSubLocation(subLocInput);
-                                setSubLocInput("");
-                                setIsSubLocOpen(false);
-                              }
-                            },
-                            className: "w-full text-xs px-3 py-2 bg-white/50 border border-white/60 rounded-xl outline-none focus:bg-white/80 focus:border-white transition-all text-slate-700 font-bold shadow-[0_2px_10px_rgb(0,0,0,0.02)] placeholder:font-medium placeholder:text-slate-400",
-                            placeholder: "Sub location...",
-                            autoFocus: true
-                          }
-                        ),
-                        /* @__PURE__ */ jsx(
-                          "button",
-                          {
-                            onClick: () => {
-                              addSubLocation(subLocInput);
-                              setSubLocInput("");
-                              setIsSubLocOpen(false);
-                            },
-                            className: "flex items-center justify-center shrink-0 bg-slate-800 text-white px-3.5 py-2 rounded-xl text-[11px] font-bold hover:bg-slate-700 hover:shadow-md transition-all active:scale-95",
-                            children: "Add"
-                          }
-                        )
-                      ] })
-                    ] })
-                  ]
-                }
-              ),
-              cat.id === "LOCATION" && subLocations.map((subLoc) => /* @__PURE__ */ jsxs(
-                "span",
-                {
-                  className: "group flex items-center gap-1.5 text-[11px] font-bold px-3 py-1.5 rounded-xl bg-white backdrop-blur-md border border-slate-200/50 shadow-[0_4px_15px_rgb(0,0,0,0.03)] transition-all duration-300 cursor-default text-slate-500",
-                  children: [
-                    subLoc,
-                    /* @__PURE__ */ jsx(
-                      "button",
-                      {
-                        onClick: () => removeSubLocation(subLoc),
-                        className: "w-3.5 h-3.5 rounded-full hover:bg-slate-300/50 flex items-center justify-center transition-colors opacity-0 group-hover:opacity-100",
-                        children: /* @__PURE__ */ jsx(X, { className: "w-2.5 h-2.5" })
-                      }
-                    )
-                  ]
-                },
-                `sub-${subLoc}`
-              ))
-            ] })
+            /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: catTags.map((tag, index) => /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: "text-[11px] font-bold px-3 py-1.5 rounded-xl bg-white/80 backdrop-blur-md border border-white shadow-[0_4px_15px_rgb(0,0,0,0.03)] hover:shadow-[0_4px_20px_rgb(0,0,0,0.06)] hover:-translate-y-0.5 transition-all duration-300 cursor-default",
+                style: { color: cat.color },
+                children: tag.name
+              },
+              index
+            )) })
           ] }, cat.id);
         }) }) : /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-slate-400 italic bg-white/40 p-6 rounded-[2rem] border border-white border-dashed text-center shadow-[0_4px_20px_rgb(0,0,0,0.02)]", children: "Highlight text to tag elements." })
       ] })
@@ -2285,7 +2209,6 @@ function useScriptBreakdownScene(options) {
   const autoTaggedSceneRef = useRef(null);
   const [scene, setScene] = useState(null);
   const [menuPlacement, setMenuPlacement] = useState("top");
-  const [subLocations, setSubLocations] = useState([]);
   const [sceneBrief, setSceneBrief] = useState("");
   const [isSummarizing, setIsSummarizing] = useState(false);
   const [isLoading, setIsLoading] = useState(true);
@@ -2403,20 +2326,7 @@ function useScriptBreakdownScene(options) {
       console.error("Failed to summarize scene:", res);
     }
   };
-  const addSubLocation = useCallback(
-    (subLocation) => {
-      const trimmed = subLocation.trim();
-      if (trimmed && !subLocations.includes(trimmed)) {
-        setSubLocations((prev) => [...prev, trimmed]);
-      }
-    },
-    [subLocations]
-  );
-  const removeSubLocation = useCallback((subLocation) => {
-    setSubLocations((prev) => prev.filter((loc) => loc !== subLocation));
-  }, []);
   useEffect(() => {
-    setSubLocations([]);
     setSceneBrief("");
     autoTaggedSceneRef.current = null;
   }, [options.scene_url]);
@@ -2556,6 +2466,25 @@ function useScriptBreakdownScene(options) {
       setTags((prev) => [...prev, tagToRemove]);
     }
   };
+  const updateTag = async (id, categoryId) => {
+    var _a;
+    const tagToUpdate = tags.find((t) => t.id === id);
+    if (!tagToUpdate) return;
+    setTags(
+      (prev) => prev.map((t) => t.id === id ? __spreadProps(__spreadValues({}, t), { category_id: categoryId }) : t)
+    );
+    clearSelection();
+    try {
+      await ((_a = options.onTagUpdated) == null ? void 0 : _a.call(options, id, categoryId));
+    } catch (error2) {
+      console.error("Failed to update tag:", error2);
+      setTags(
+        (prev) => prev.map(
+          (t) => t.id === id ? __spreadProps(__spreadValues({}, t), { category_id: tagToUpdate.category_id }) : t
+        )
+      );
+    }
+  };
   return {
     scene,
     blocks,
@@ -2566,13 +2495,11 @@ function useScriptBreakdownScene(options) {
     selectionMenu,
     handleMouseUp,
     addTag,
+    updateTag,
     removeTag,
     clearSelection,
     menuPlacement,
     menuRef,
-    subLocations,
-    addSubLocation,
-    removeSubLocation,
     sceneBrief,
     setSceneBrief,
     handleAISummarize,