@vishu1301/script-writing 1.3.6 → 1.3.7

package/README.md

@@ -1,24 +1,61 @@
-# Script Writing & Breakdown Library
-
-An advanced, React and Next.js-based script writing and breakdown analysis library for the web. 
-
-This package provides developers with an intuitive suite of tools to draft, edit, and format scripts according to industry standards, alongside powerful script breakdown utilities to highlight, tag, and analyze scene elements.
-
-## Features
-
-- **Screenplay Editor Component:** Fully-featured WYSIWYG editor for screenplays.
-- **Industry-Standard Formatting:** Automatically formats text to screenplay guidelines including Scene Headings, Action, Character, Parenthetical, Dialogue, and Transitions.
-- **Smart Auto-Suggestions:** Intelligently suggests previously used Characters, Locations, and Character Extensions (like V.O., O.S.) as you type.
-- **PDF Import & Export:** Built-in tools to import and parse existing scripts from PDFs (`pdfjs-dist`) and export your drafts into perfectly formatted screenplay PDFs (`jsPDF`).
-- **Scene Management:** Easily toggle Scene Types (INT./EXT.) and Time of Day (DAY/NIGHT) alongside Scene Numbering features.
-- **Script Breakdown & Tagging:** Interactive scene viewer with auto-character tagging, text selection, and customizable element tagging (e.g., Cast, Props, Wardrobe).
-- **Keyboard Shortcuts:** Fluid writing experience using keyboard shortcuts (e.g., `Ctrl + ↑/↓` to change block types, `Enter` to create new blocks).
-- **Headless Architecture:** Core logic is exposed via hooks (`useScreenplayEditor` and `useScriptBreakdownScene`), allowing complete customizability over the UI.
-
-
-## Installation
-
-Install the package via npm or yarn:
-
-```bash
-npm install @vishu1301/script-writing
+# Script Writing & Breakdown Library
+
+An advanced, React and Next.js-based script writing and breakdown analysis library for the web.
+
+This package provides developers with an intuitive suite of tools to draft, edit, and format scripts according to industry standards, alongside powerful script and shot breakdown utilities to highlight, tag, and analyze scene elements for pre-production.
+
+## Core Modules
+
+The library is divided into three primary modules: **Screenplay Editor**, **Script Breakdown**, and **Shot Breakdown**. Each module exposes headless hooks for robust state management and pre-built React views for rapid UI integration.
+
+### 1. Screenplay Editor
+Draft, edit, and format screenplays with an intuitive WYSIWYG editor.
+- **Industry-Standard Formatting:** Automatically formats text to screenplay guidelines, dynamically handling Scene Headings, Action, Character, Parenthetical, Dialogue, and Transitions.
+- **Smart Auto-Suggestions:** Intelligently suggests previously used Characters, Locations, and Character Extensions (like V.O., O.S.) as you type.
+- **PDF Import & Export:** Built-in utilities to import existing scripts from PDFs (`pdfjs-dist`) and export drafts into beautifully formatted screenplay PDFs (`html2canvas-pro` & `jsPDF`).
+- **Keyboard Shortcuts:** Fluid writing experience utilizing familiar keyboard shortcuts (e.g., `Ctrl + ↑/↓` to change block types, `Enter` for smart block transitions).
+- **Core Exports:** `useScreenplayEditor` (Hook), `ScreenplayEditorView` (Component).
+
+### 2. Script Breakdown
+Analyze and tag script elements to prepare for scheduling and production.
+- **Interactive Scene Viewer:** View parsed scripts in breakdown mode where text is immutable but fully interactive.
+- **Element Tagging:** Select blocks of text to tag them as Cast, Props, Wardrobe, VFX, Vehicles, Extras, etc.
+- **Color-Coded Analysis:** Industry-standard color-coded highlighting applied automatically as elements are tagged.
+- **Core Exports:** `useScriptBreakdownScene` (Hook), `ScriptBreakdownSceneView` (Component).
+
+### 3. Shot Breakdown
+Visually plan camera work, cinematography, and storyboarding shot-by-shot linked directly to the screenplay text.
+- **Multi-Camera Management:** Initialize your digital production with multiple cameras and easily swap between them when assigning shots.
+- **Extensive Shot Configuration:** Detailed properties for each shot covering Core Identification, Optics & Mechanics (Lens, Movement, Support, Aperture), Visual Composition (Framing, Depth of Field), and Narrative Context (Lighting, Sound, VFX, Emotional Purpose).
+- **Text-to-Shot Mapping:** Highlight specific script sections on the editor space to directly bind them to newly created shots, dynamically overlaying shot durations on the script.
+- **Core Exports:** `useShotBreakdownScene` (Hook), `ShotBreakdownSceneView` (Component).
+
+## Installation
+
+Install the package via npm, yarn, or pnpm:
+
+```bash
+npm install @vishu1301/script-writing
+```
+
+## Quick Start
+*Note: The UI views utilize standard Tailwind CSS utility classes and Lucide React icons.*
+
+### Screenplay Editor Example
+```tsx
+import { ScreenplayEditorView, useScreenplayEditor } from "@vishu1301/script-writing";
+
+export default function ScriptApp() {
+  const editorProps = useScreenplayEditor();
+  
+  return (
+    <div className="w-full min-h-screen bg-zinc-50">
+      <ScreenplayEditorView {...editorProps} />
+    </div>
+  );
+}
+```
+
+## Developer Notes
+
+This package relies heavily on data attributes and high-specificity style injection to force screenplay fonts (Courier Prime). For customized font integration or headless implementation, utilize the provided hooks to map output block objects into your custom interface.