@vishu1301/script-writing 0.3.4 → 0.3.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,4 +1,7 @@
1
- "use client";
1
+ import { useState, useRef, useCallback, useMemo, useEffect } from 'react';
2
+ import { ArrowRightLeft, MessageCircle, Brackets, UserRound, Sparkles, Clapperboard, ArrowRight, User, ChevronRight, Save, FileDown, Cog } from 'lucide-react';
3
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
4
+
2
5
  var __defProp = Object.defineProperty;
3
6
  var __defProps = Object.defineProperties;
4
7
  var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
@@ -18,20 +21,6 @@ var __spreadValues = (a, b) => {
18
21
  return a;
19
22
  };
20
23
  var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
21
-
22
- // app/view/screenplay-editor.view.tsx
23
- import { useState } from "react";
24
-
25
- // app/types/screenplay-editor.types.tsx
26
- import {
27
- Clapperboard,
28
- Sparkles,
29
- UserRound,
30
- Brackets,
31
- MessageCircle,
32
- ArrowRightLeft
33
- } from "lucide-react";
34
- import { jsx } from "react/jsx-runtime";
35
24
  var timeOfDayOptions = ["DAY", "NIGHT"];
36
25
  var blockTypes = [
37
26
  "SCENE_HEADING",
@@ -131,17 +120,6 @@ var blockStyles = {
131
120
  }
132
121
  }
133
122
  };
134
-
135
- // app/view/screenplay-editor.view.tsx
136
- import {
137
- ArrowRight,
138
- ChevronRight,
139
- User,
140
- Cog,
141
- Save,
142
- FileDown
143
- } from "lucide-react";
144
- import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
145
123
  function ScreenplayEditorView({
146
124
  blocks,
147
125
  pages,
@@ -166,7 +144,7 @@ function ScreenplayEditorView({
166
144
  }) {
167
145
  const [isRulesOpen, setIsRulesOpen] = useState(false);
168
146
  return /* @__PURE__ */ jsxs(Fragment, { children: [
169
- /* @__PURE__ */ jsx2("div", { className: "sticky top-6 z-50 bg-white backdrop-blur-xl border border-white/10 rounded-full shadow-2xl flex gap-1 max-w-fit p-1.5 mb-12 select-none overflow-x-auto custom-scrollbar", children: blockTypes.map((type) => {
147
+ /* @__PURE__ */ jsx("div", { className: "sticky top-6 z-50 bg-white backdrop-blur-xl border border-white/10 rounded-full shadow-2xl flex gap-1 max-w-fit p-1.5 mb-12 select-none overflow-x-auto custom-scrollbar", children: blockTypes.map((type) => {
170
148
  var _a;
171
149
  const selected = ((_a = blocks.find((b) => b.id === focusedBlockId)) == null ? void 0 : _a.type) === type;
172
150
  return /* @__PURE__ */ jsxs(
@@ -176,7 +154,7 @@ function ScreenplayEditorView({
176
154
  className: `flex items-center gap-2 px-4 py-2.5 rounded-full font-medium text-sm transition-all duration-300 ${selected ? "bg-zinc-900 text-white shadow-sm" : "text-zinc-400 hover:bg-zinc-800/10 hover:text-zinc-800"}`,
177
155
  onClick: () => handleBlockTypeChange(type),
178
156
  children: [
179
- /* @__PURE__ */ jsx2(
157
+ /* @__PURE__ */ jsx(
180
158
  "input",
181
159
  {
182
160
  type: "radio",
@@ -195,7 +173,7 @@ function ScreenplayEditorView({
195
173
  className: "flex items-center gap-2 cursor-pointer",
196
174
  children: [
197
175
  icons[type],
198
- /* @__PURE__ */ jsx2("span", { className: "whitespace-nowrap hidden sm:inline", children: blockStyles[type].label })
176
+ /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap hidden sm:inline", children: blockStyles[type].label })
199
177
  ]
200
178
  }
201
179
  )
@@ -204,7 +182,7 @@ function ScreenplayEditorView({
204
182
  type
205
183
  );
206
184
  }) }),
207
- /* @__PURE__ */ jsx2("div", { className: "flex flex-col gap-12 w-full items-center pb-24", children: pages.map((pageBlocks, pageIndex) => /* @__PURE__ */ jsxs(
185
+ /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-12 w-full items-center pb-24", children: pages.map((pageBlocks, pageIndex) => /* @__PURE__ */ jsxs(
208
186
  "div",
209
187
  {
210
188
  className: "relative bg-[#fdfdfc] shadow-2xl shadow-zinc-300/60 ring-1 ring-zinc-200/50 rounded-sm md:rounded-md p-16 md:p-20 flex flex-col w-[210mm] min-h-[297mm] shrink-0",
@@ -214,14 +192,14 @@ function ScreenplayEditorView({
214
192
  children: [
215
193
  pageBlocks.map((block) => {
216
194
  var _a, _b;
217
- return /* @__PURE__ */ jsx2(
195
+ return /* @__PURE__ */ jsx(
218
196
  "div",
219
197
  {
220
198
  "data-block-id": block.id,
221
199
  className: `relative rounded-sm transition-all duration-200 outline-none ${focusedBlockId === block.id ? "bg-zinc-100/50" : "bg-transparent"}`,
222
200
  children: block.type === "SCENE_HEADING" ? /* @__PURE__ */ jsxs(Fragment, { children: [
223
201
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-4 py-1 bg-transparent", children: [
224
- /* @__PURE__ */ jsx2("span", { className: "absolute -left-16 top-2 w-12 text-right text-zinc-400 font-semibold select-none", children: String(sceneNumbers[block.id] || 0) }),
202
+ /* @__PURE__ */ 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) }),
225
203
  /* @__PURE__ */ jsxs(
226
204
  "select",
227
205
  {
@@ -230,13 +208,13 @@ function ScreenplayEditorView({
230
208
  value: (_a = block.sceneType) != null ? _a : "INT.",
231
209
  onChange: (e) => handleSceneTypeChange(block.id, e.target.value),
232
210
  children: [
233
- /* @__PURE__ */ jsx2("option", { children: "INT." }),
234
- /* @__PURE__ */ jsx2("option", { children: "EXT." }),
235
- /* @__PURE__ */ jsx2("option", { children: "INT/EXT." })
211
+ /* @__PURE__ */ jsx("option", { children: "INT." }),
212
+ /* @__PURE__ */ jsx("option", { children: "EXT." }),
213
+ /* @__PURE__ */ jsx("option", { children: "INT/EXT." })
236
214
  ]
237
215
  }
238
216
  ),
239
- /* @__PURE__ */ jsx2(
217
+ /* @__PURE__ */ jsx(
240
218
  "div",
241
219
  {
242
220
  ref: (el) => {
@@ -259,25 +237,25 @@ function ScreenplayEditorView({
259
237
  onBlur: () => handleBlur(block.id)
260
238
  }
261
239
  ),
262
- /* @__PURE__ */ jsx2("span", { className: "text-zinc-400/80 font-bold", children: "-" }),
263
- /* @__PURE__ */ jsx2(
240
+ /* @__PURE__ */ jsx("span", { className: "text-zinc-400/80 font-bold", children: "-" }),
241
+ /* @__PURE__ */ jsx(
264
242
  "select",
265
243
  {
266
244
  className: "rounded-md text-zinc-800 font-bold px-1.5 py-1 appearance-none bg-transparent hover:bg-zinc-200/50 outline-none cursor-pointer transition-colors",
267
245
  "aria-label": "Time of Day",
268
246
  value: (_b = block.timeOfDay) != null ? _b : "DAY",
269
247
  onChange: (e) => handleTimeOfDayChange(block.id, e.target.value),
270
- children: timeOfDayOptions.map((t) => /* @__PURE__ */ jsx2("option", { children: t }, t))
248
+ children: timeOfDayOptions.map((t) => /* @__PURE__ */ jsx("option", { children: t }, t))
271
249
  }
272
250
  )
273
251
  ] }),
274
- focusedBlockId === block.id && showSuggestions && locations.length > 0 && /* @__PURE__ */ jsx2(
252
+ focusedBlockId === block.id && showSuggestions && locations.length > 0 && /* @__PURE__ */ jsx(
275
253
  "div",
276
254
  {
277
255
  role: "listbox",
278
256
  id: `suggestions-${block.id}`,
279
257
  className: "absolute top-[calc(100%+6px)] left-0 min-w-[240px] z-50 bg-white border border-slate-200/80 shadow-xl shadow-slate-200/40 rounded-xl py-1 overflow-hidden animate-in fade-in zoom-in-95 duration-150",
280
- children: /* @__PURE__ */ jsx2("div", { className: "max-h-60 overflow-y-auto custom-scrollbar", children: locations.filter(
258
+ children: /* @__PURE__ */ jsx("div", { className: "max-h-60 overflow-y-auto custom-scrollbar", children: locations.filter(
281
259
  (loc) => loc.startsWith(block.text.toUpperCase()) && loc !== block.text.toUpperCase()
282
260
  ).map((loc) => /* @__PURE__ */ jsxs(
283
261
  "div",
@@ -301,8 +279,8 @@ function ScreenplayEditorView({
301
279
  handleBlur(block.id);
302
280
  },
303
281
  children: [
304
- /* @__PURE__ */ jsx2("span", { className: "text-[12px] font-semibold tracking-wide text-slate-600 uppercase line-clamp-1", children: loc }),
305
- /* @__PURE__ */ jsx2(ArrowRight, { className: "w-3.5 h-3.5 text-slate-300 opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-200" })
282
+ /* @__PURE__ */ jsx("span", { className: "text-[12px] font-semibold tracking-wide text-slate-600 uppercase line-clamp-1", children: loc }),
283
+ /* @__PURE__ */ jsx(ArrowRight, { className: "w-3.5 h-3.5 text-slate-300 opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-200" })
306
284
  ]
307
285
  },
308
286
  loc
@@ -310,7 +288,7 @@ function ScreenplayEditorView({
310
288
  }
311
289
  )
312
290
  ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
313
- /* @__PURE__ */ jsx2(
291
+ /* @__PURE__ */ jsx(
314
292
  "div",
315
293
  {
316
294
  ref: (el) => {
@@ -333,13 +311,13 @@ function ScreenplayEditorView({
333
311
  style: blockStyles[block.type].inputStyle
334
312
  }
335
313
  ),
336
- focusedBlockId === block.id && block.type === "CHARACTER" && showSuggestions && characters.length > 0 && /* @__PURE__ */ jsx2(
314
+ focusedBlockId === block.id && block.type === "CHARACTER" && showSuggestions && characters.length > 0 && /* @__PURE__ */ jsx(
337
315
  "div",
338
316
  {
339
317
  role: "listbox",
340
318
  id: `suggestions-${block.id}`,
341
319
  className: "absolute top-[calc(100%+8px)] left-1/2 -translate-x-1/2 w-72 z-50 bg-white border border-slate-200 shadow-2xl shadow-slate-200/60 rounded-xl py-2 overflow-hidden animate-in fade-in zoom-in-95 duration-200",
342
- children: /* @__PURE__ */ jsx2("div", { className: "max-h-56 overflow-y-auto custom-scrollbar", children: characters.filter(
320
+ children: /* @__PURE__ */ jsx("div", { className: "max-h-56 overflow-y-auto custom-scrollbar", children: characters.filter(
343
321
  (char) => char.startsWith(block.text.toUpperCase()) && char !== block.text.toUpperCase()
344
322
  ).map((char) => /* @__PURE__ */ jsxs(
345
323
  "div",
@@ -363,9 +341,9 @@ function ScreenplayEditorView({
363
341
  handleBlur(block.id);
364
342
  },
365
343
  children: [
366
- /* @__PURE__ */ jsx2(User, { className: "w-3.5 h-3.5 text-slate-300 group-hover:text-sky-500 transition-colors mr-3" }),
367
- /* @__PURE__ */ jsx2("span", { className: "flex-1 text-[11px] font-bold tracking-[0.1em] text-slate-600 uppercase text-left", children: char }),
368
- /* @__PURE__ */ jsx2(ChevronRight, { className: "w-3 h-3 text-slate-200 opacity-0 group-hover:opacity-100 transition-all -translate-x-1 group-hover:translate-x-0" })
344
+ /* @__PURE__ */ jsx(User, { className: "w-3.5 h-3.5 text-slate-300 group-hover:text-sky-500 transition-colors mr-3" }),
345
+ /* @__PURE__ */ jsx("span", { className: "flex-1 text-[11px] font-bold tracking-[0.1em] text-slate-600 uppercase text-left", children: char }),
346
+ /* @__PURE__ */ jsx(ChevronRight, { className: "w-3 h-3 text-slate-200 opacity-0 group-hover:opacity-100 transition-all -translate-x-1 group-hover:translate-x-0" })
369
347
  ]
370
348
  },
371
349
  char
@@ -393,8 +371,8 @@ function ScreenplayEditorView({
393
371
  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",
394
372
  "aria-label": "Save Script",
395
373
  children: [
396
- /* @__PURE__ */ jsx2(Save, { className: "w-5 h-5" }),
397
- /* @__PURE__ */ jsx2("span", { className: "text-sm font-semibold", children: "Save" })
374
+ /* @__PURE__ */ jsx(Save, { className: "w-5 h-5" }),
375
+ /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: "Save" })
398
376
  ]
399
377
  }
400
378
  ),
@@ -405,17 +383,17 @@ function ScreenplayEditorView({
405
383
  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",
406
384
  "aria-label": "Save Script as PDF",
407
385
  children: [
408
- /* @__PURE__ */ jsx2(FileDown, { className: "w-5 h-5" }),
409
- /* @__PURE__ */ jsx2("span", { className: "text-sm font-semibold", children: "Save as PDF" })
386
+ /* @__PURE__ */ jsx(FileDown, { className: "w-5 h-5" }),
387
+ /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: "Save as PDF" })
410
388
  ]
411
389
  }
412
390
  ),
413
391
  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: [
414
- /* @__PURE__ */ jsx2("h4", { className: "font-bold text-zinc-800 mb-3 text-sm", children: "Settings & Shortcuts" }),
392
+ /* @__PURE__ */ jsx("h4", { className: "font-bold text-zinc-800 mb-3 text-sm", children: "Settings & Shortcuts" }),
415
393
  /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
416
394
  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-6", children: [
417
- /* @__PURE__ */ jsx2("span", { className: "font-semibold text-zinc-800", children: "A4 Page Split" }),
418
- /* @__PURE__ */ jsx2(
395
+ /* @__PURE__ */ jsx("span", { className: "font-semibold text-zinc-800", children: "A4 Page Split" }),
396
+ /* @__PURE__ */ jsx(
419
397
  "button",
420
398
  {
421
399
  type: "button",
@@ -423,7 +401,7 @@ function ScreenplayEditorView({
423
401
  "aria-checked": isPageSplitEnabled,
424
402
  onClick: togglePageSplit,
425
403
  className: `${isPageSplitEnabled ? "bg-zinc-900" : "bg-zinc-300"} relative inline-flex h-5 w-9 shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none`,
426
- children: /* @__PURE__ */ jsx2(
404
+ children: /* @__PURE__ */ jsx(
427
405
  "span",
428
406
  {
429
407
  "aria-hidden": "true",
@@ -433,48 +411,39 @@ function ScreenplayEditorView({
433
411
  }
434
412
  )
435
413
  ] }),
436
- /* @__PURE__ */ jsx2("div", { className: "space-y-1.5 pt-3 border-t border-zinc-200/50", children: /* @__PURE__ */ jsxs("ul", { className: "space-y-1.5", children: [
414
+ /* @__PURE__ */ jsx("div", { className: "space-y-1.5 pt-3 border-t border-zinc-200/50", children: /* @__PURE__ */ jsxs("ul", { className: "space-y-1.5", children: [
437
415
  /* @__PURE__ */ jsxs("li", { className: "flex items-center justify-between gap-6", children: [
438
- /* @__PURE__ */ jsx2("span", { children: "New Block" }),
439
- /* @__PURE__ */ jsx2("kbd", { className: "px-2 py-1 text-xs font-semibold text-zinc-800 bg-zinc-200/70 border border-zinc-300/70 rounded-md", children: "Enter" })
416
+ /* @__PURE__ */ jsx("span", { children: "New Block" }),
417
+ /* @__PURE__ */ jsx("kbd", { className: "px-2 py-1 text-xs font-semibold text-zinc-800 bg-zinc-200/70 border border-zinc-300/70 rounded-md", children: "Enter" })
440
418
  ] }),
441
419
  /* @__PURE__ */ jsxs("li", { className: "flex items-center justify-between gap-6", children: [
442
- /* @__PURE__ */ jsx2("span", { children: "Delete Block" }),
443
- /* @__PURE__ */ jsx2("kbd", { className: "px-2 py-1 text-xs font-semibold text-zinc-800 bg-zinc-200/70 border border-zinc-300/70 rounded-md", children: "Backspace" })
420
+ /* @__PURE__ */ jsx("span", { children: "Delete Block" }),
421
+ /* @__PURE__ */ jsx("kbd", { className: "px-2 py-1 text-xs font-semibold text-zinc-800 bg-zinc-200/70 border border-zinc-300/70 rounded-md", children: "Backspace" })
444
422
  ] }),
445
423
  /* @__PURE__ */ jsxs("li", { className: "flex items-center justify-between gap-6", children: [
446
- /* @__PURE__ */ jsx2("span", { children: "Change Type" }),
424
+ /* @__PURE__ */ jsx("span", { children: "Change Type" }),
447
425
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
448
- /* @__PURE__ */ jsx2("kbd", { className: "px-2 py-1 text-xs font-semibold text-zinc-800 bg-zinc-200/70 border border-zinc-300/70 rounded-md", children: "Ctrl" }),
449
- /* @__PURE__ */ jsx2("span", { children: "+" }),
450
- /* @__PURE__ */ jsx2("kbd", { className: "px-2 py-1 text-xs font-semibold text-zinc-800 bg-zinc-200/70 border border-zinc-300/70 rounded-md", children: "\u2191/\u2193" })
426
+ /* @__PURE__ */ jsx("kbd", { className: "px-2 py-1 text-xs font-semibold text-zinc-800 bg-zinc-200/70 border border-zinc-300/70 rounded-md", children: "Ctrl" }),
427
+ /* @__PURE__ */ jsx("span", { children: "+" }),
428
+ /* @__PURE__ */ jsx("kbd", { className: "px-2 py-1 text-xs font-semibold text-zinc-800 bg-zinc-200/70 border border-zinc-300/70 rounded-md", children: "\u2191/\u2193" })
451
429
  ] })
452
430
  ] })
453
431
  ] }) })
454
432
  ] })
455
433
  ] }),
456
- /* @__PURE__ */ jsx2(
434
+ /* @__PURE__ */ jsx(
457
435
  "button",
458
436
  {
459
437
  onClick: () => setIsRulesOpen(!isRulesOpen),
460
438
  className: `flex items-center justify-center w-12 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 ${isRulesOpen ? "rotate-90" : "rotate-0"}`,
461
439
  "aria-label": "Toggle Settings",
462
- children: /* @__PURE__ */ jsx2(Cog, { className: "w-5 h-5" })
440
+ children: /* @__PURE__ */ jsx(Cog, { className: "w-5 h-5" })
463
441
  }
464
442
  )
465
443
  ] })
466
444
  ] });
467
445
  }
468
446
 
469
- // app/hook/use-screenplay-editor.ts
470
- import {
471
- useState as useState2,
472
- useRef,
473
- useEffect,
474
- useMemo,
475
- useCallback
476
- } from "react";
477
-
478
447
  // app/service/screenplay-editor.service.ts
479
448
  function getNextBlockType(currentType) {
480
449
  switch (currentType) {
@@ -595,16 +564,16 @@ function setCaretPosition(element, offset) {
595
564
  sel.addRange(range);
596
565
  }
597
566
  function useScreenplayEditor() {
598
- const [blocks, setBlocks] = useState2(initialBlocks);
567
+ const [blocks, setBlocks] = useState(initialBlocks);
599
568
  const refs = useRef({});
600
- const [focusedBlockId, setFocusedBlockId] = useState2(
569
+ const [focusedBlockId, setFocusedBlockId] = useState(
601
570
  initialBlocks[0].id
602
571
  );
603
- const [newBlockId, setNewBlockId] = useState2(null);
604
- const [showSuggestions, setShowSuggestions] = useState2(false);
572
+ const [newBlockId, setNewBlockId] = useState(null);
573
+ const [showSuggestions, setShowSuggestions] = useState(false);
605
574
  const blurTimeout = useRef(null);
606
- const [isPageSplitEnabled, setIsPageSplitEnabled] = useState2(false);
607
- const [pageBreaks, setPageBreaks] = useState2([]);
575
+ const [isPageSplitEnabled, setIsPageSplitEnabled] = useState(false);
576
+ const [pageBreaks, setPageBreaks] = useState([]);
608
577
  const focusStateRef = useRef(null);
609
578
  const togglePageSplit = useCallback(() => {
610
579
  if (focusedBlockId && document.activeElement && document.activeElement.hasAttribute("contenteditable")) {
@@ -948,13 +917,7 @@ function useScreenplayEditor() {
948
917
  handleBlur
949
918
  };
950
919
  }
951
- export {
952
- ScreenplayEditorView,
953
- blockStyles,
954
- blockTypes,
955
- icons,
956
- timeOfDayOptions,
957
- useScreenplayEditor,
958
- uuid
959
- };
920
+
921
+ export { ScreenplayEditorView, blockStyles, blockTypes, icons, timeOfDayOptions, useScreenplayEditor, uuid };
922
+ //# sourceMappingURL=index.js.map
960
923
  //# sourceMappingURL=index.js.map