@vishu1301/script-writing 1.3.2 → 1.3.4

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.cjs CHANGED
@@ -295,9 +295,9 @@ function PdfImporter({ onScriptImported, disabled, children }) {
295
295
  {
296
296
  onClick: handleClick,
297
297
  disabled: isProcessing || disabled,
298
- 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 disabled:cursor-not-allowed disabled:bg-zinc-700 disabled:shadow-none disabled:border-zinc-600/50",
298
+ className: `flex items-center justify-center transition-all duration-200 active:scale-95 disabled:cursor-not-allowed disabled:opacity-50 ${isProcessing ? "w-auto px-3 sm:px-4 h-8 sm:h-10 rounded-full text-sm font-semibold bg-zinc-100 text-zinc-500" : "w-8 h-8 sm:w-10 sm:h-10 rounded-full text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900"}`,
299
299
  "aria-label": "Import Script",
300
- children: isProcessing ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold", children: "Processing..." }) : children
300
+ children: isProcessing ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs sm:text-sm font-semibold", children: "Processing..." }) : children
301
301
  }
302
302
  ),
303
303
  error && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "sr-only", children: [
@@ -378,150 +378,148 @@ function ScreenplayEditorView({
378
378
  }
379
379
  }, [COURIER_STACK]);
380
380
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
381
- /* @__PURE__ */ jsxRuntime.jsxs(
382
- "div",
383
- {
384
- className: "sticky top-6 z-50 mx-auto bg-white/70 backdrop-blur-2xl border border-white/60 shadow-[0_8px_30px_rgb(0,0,0,0.04)] rounded-[2rem] flex items-center justify-between p-2 mb-12 select-none transition-all",
385
- style: {
386
- maxWidth: "1240px"
387
- },
388
- children: [
389
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-1 overflow-x-auto custom-scrollbar pr-2 items-center", children: blockTypes.map((type) => {
390
- var _a;
391
- const selected = ((_a = blocks.find((b) => b.id === focusedBlockId)) == null ? void 0 : _a.type) === type;
392
- return /* @__PURE__ */ jsxRuntime.jsxs(
393
- "button",
394
- {
395
- type: "button",
396
- disabled: isLocked,
397
- className: `group flex items-center gap-2.5 px-4 py-2 rounded-full font-semibold text-sm transition-all duration-300 ease-out active:scale-95 ${selected ? "bg-zinc-900 text-white shadow-md shadow-zinc-900/20" : "text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900"} ${isLocked ? "opacity-50 cursor-not-allowed" : ""}`,
398
- onClick: () => handleBlockTypeChange(type),
399
- children: [
400
- /* @__PURE__ */ jsxRuntime.jsx(
401
- "input",
402
- {
403
- type: "radio",
404
- name: "blockType",
405
- id: `block-type-${type}`,
406
- className: "sr-only",
407
- "aria-label": blockStyles[type].label,
408
- checked: selected,
409
- readOnly: true
410
- }
411
- ),
412
- /* @__PURE__ */ jsxRuntime.jsxs(
413
- "label",
414
- {
415
- htmlFor: `block-type-${type}`,
416
- className: "flex items-center gap-2 cursor-pointer pointer-events-none",
417
- children: [
418
- /* @__PURE__ */ jsxRuntime.jsx(
419
- "div",
420
- {
421
- className: `${selected ? "opacity-100" : "opacity-70 group-hover:opacity-100"} transition-opacity duration-200`,
422
- children: icons[type]
423
- }
424
- ),
425
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "whitespace-nowrap hidden sm:inline tracking-wide", children: blockStyles[type].label })
426
- ]
427
- }
428
- )
429
- ]
430
- },
431
- type
432
- );
433
- }) }),
434
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 shrink-0 relative px-1", children: [
435
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[1px] h-6 bg-zinc-200/80 mx-2 hidden sm:block rounded-full" }),
436
- showPdfImport && !isLocked && /* @__PURE__ */ jsxRuntime.jsx(
437
- PdfImporter,
438
- {
439
- disabled: isLocked,
440
- onScriptImported: handleScriptImport,
441
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { title: "Import Script", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Upload, { className: "w-[18px] h-[18px]" }) })
442
- }
443
- ),
444
- onToggleLock && /* @__PURE__ */ jsxRuntime.jsx(
445
- "button",
446
- {
447
- onClick: onToggleLock,
448
- className: `flex items-center justify-center w-10 h-10 rounded-full transition-all duration-200 active:scale-95 ${isLocked ? "text-rose-500 hover:bg-rose-50" : "text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900"}`,
449
- title: isLocked ? "Unlock Script" : "Lock Script",
450
- "aria-label": isLocked ? "Unlock Script" : "Lock Script",
451
- children: isLocked ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Lock, { className: "w-[18px] h-[18px]" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Unlock, { className: "w-[18px] h-[18px]" })
452
- }
453
- ),
454
- onSave && showSaveButton && !isLocked && /* @__PURE__ */ jsxRuntime.jsx(
455
- "button",
456
- {
457
- onClick: onSave,
458
- className: "flex items-center justify-center w-10 h-10 rounded-full text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900 transition-all duration-200 active:scale-95",
459
- title: "Save Script",
460
- "aria-label": "Save Script",
461
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Save, { className: "w-[18px] h-[18px]" })
462
- }
463
- ),
464
- onSaveAsPdf && showSaveButton && /* @__PURE__ */ jsxRuntime.jsx(
465
- "button",
466
- {
467
- onClick: onSaveAsPdf,
468
- className: "flex items-center justify-center w-10 h-10 rounded-full text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900 transition-all duration-200 active:scale-95",
469
- title: "Save as PDF",
470
- "aria-label": "Save Script as PDF",
471
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileDown, { className: "w-[18px] h-[18px]" })
472
- }
473
- ),
474
- onSyncWithCloud && showSyncButton && !isLocked && /* @__PURE__ */ jsxRuntime.jsx(
475
- "button",
476
- {
477
- onClick: onSyncWithCloud,
478
- className: "flex items-center justify-center w-10 h-10 rounded-full text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900 transition-all duration-200 active:scale-95",
479
- title: "Sync with Cloud",
480
- "aria-label": "Sync with Cloud",
481
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RefreshCcw, { className: "w-[18px] h-[18px]" })
482
- }
483
- ),
484
- /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: rulesRef, className: "relative flex items-center", children: [
381
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sticky top-2 sm:top-6 z-50 mx-auto w-full max-w-5xl bg-white/80 backdrop-blur-2xl border border-white/60 shadow-[0_8px_30px_rgb(0,0,0,0.06)] rounded-[1.5rem] sm:rounded-[2rem] flex items-center justify-between p-1.5 sm:p-2 mb-6 sm:mb-12 select-none transition-all", children: [
382
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center gap-1 overflow-x-auto custom-scrollbar pr-2 flex-1 [mask-image:linear-gradient(to_right,white_90%,transparent_100%)] sm:[mask-image:none] no-scrollbar", children: blockTypes.map((type) => {
383
+ var _a;
384
+ const selected = ((_a = blocks.find((b) => b.id === focusedBlockId)) == null ? void 0 : _a.type) === type;
385
+ return /* @__PURE__ */ jsxRuntime.jsxs(
386
+ "button",
387
+ {
388
+ type: "button",
389
+ disabled: isLocked,
390
+ className: `group flex shrink-0 items-center gap-2 sm:gap-2.5 px-3 py-1.5 sm:px-4 sm:py-2 rounded-full font-semibold text-xs sm:text-sm transition-all duration-300 ease-out active:scale-95 ${selected ? "bg-zinc-900 text-white shadow-md shadow-zinc-900/20" : "text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900"} ${isLocked ? "opacity-50 cursor-not-allowed" : ""}`,
391
+ onClick: () => handleBlockTypeChange(type),
392
+ children: [
485
393
  /* @__PURE__ */ jsxRuntime.jsx(
486
- "button",
394
+ "input",
487
395
  {
488
- onClick: () => setIsRulesOpen(!isRulesOpen),
489
- className: `flex items-center justify-center w-10 h-10 rounded-full transition-all duration-200 active:scale-95 ${isRulesOpen ? "bg-zinc-900 text-white shadow-md shadow-zinc-900/20" : "text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900"}`,
490
- title: "Settings & Shortcuts",
491
- "aria-label": "Toggle Settings",
492
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Cog, { className: "w-[18px] h-[18px]" })
396
+ type: "radio",
397
+ name: "blockType",
398
+ id: `block-type-${type}`,
399
+ className: "sr-only",
400
+ "aria-label": blockStyles[type].label,
401
+ checked: selected,
402
+ readOnly: true
493
403
  }
494
404
  ),
495
- isRulesOpen && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute top-full mt-2 right-0 bg-white/95 backdrop-blur-3xl rounded-[1.5rem] shadow-[0_20px_60px_-15px_rgba(0,0,0,0.1)] p-5 text-sm text-zinc-700 select-none font-sans overflow-hidden transition-all duration-300 w-72 origin-top-right animate-in fade-in zoom-in-95 z-50", children: [
496
- /* @__PURE__ */ jsxRuntime.jsxs("h4", { className: "font-bold text-zinc-900 mb-4 text-sm flex items-center gap-2", children: [
497
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Cog, { className: "w-4 h-4 text-zinc-400" }),
498
- "Settings & Shortcuts"
499
- ] }),
500
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsxs("ul", { className: "space-y-2.5", children: [
501
- /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center justify-between gap-6", children: [
502
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-zinc-600", children: "New Block" }),
503
- /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "px-2 py-1 text-[11px] font-bold text-zinc-700 bg-white border border-zinc-200/80 shadow-[0_2px_4px_rgb(0,0,0,0.02)] rounded-md", children: "Enter" })
504
- ] }),
505
- /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center justify-between gap-6", children: [
506
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-zinc-600", children: "Delete Block" }),
507
- /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "px-2 py-1 text-[11px] font-bold text-zinc-700 bg-white border border-zinc-200/80 shadow-[0_2px_4px_rgb(0,0,0,0.02)] rounded-md", children: "Backspace" })
508
- ] }),
509
- /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center justify-between gap-6", children: [
510
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-zinc-600", children: "Change Type" }),
511
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
512
- /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "px-2 py-1 text-[11px] font-bold text-zinc-700 bg-white border border-zinc-200/80 shadow-[0_2px_4px_rgb(0,0,0,0.02)] rounded-md", children: "Ctrl" }),
513
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-400 font-medium", children: "+" }),
514
- /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "px-2 py-1 text-[11px] font-bold text-zinc-700 bg-white border border-zinc-200/80 shadow-[0_2px_4px_rgb(0,0,0,0.02)] rounded-md", children: "\u2191/\u2193" })
515
- ] })
516
- ] })
517
- ] }) })
405
+ /* @__PURE__ */ jsxRuntime.jsxs(
406
+ "label",
407
+ {
408
+ htmlFor: `block-type-${type}`,
409
+ className: "flex items-center gap-2 cursor-pointer pointer-events-none",
410
+ children: [
411
+ /* @__PURE__ */ jsxRuntime.jsx(
412
+ "div",
413
+ {
414
+ className: `${selected ? "opacity-100" : "opacity-70 group-hover:opacity-100"} transition-opacity duration-200 flex items-center justify-center`,
415
+ children: icons[type]
416
+ }
417
+ ),
418
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "whitespace-nowrap hidden lg:inline tracking-wide", children: blockStyles[type].label })
419
+ ]
420
+ }
421
+ )
422
+ ]
423
+ },
424
+ type
425
+ );
426
+ }) }),
427
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-0.5 sm:gap-1 shrink-0 relative px-1 sm:px-2 ml-2 sm:ml-0 border-l border-zinc-200/80 sm:border-none pl-2 sm:pl-1", children: [
428
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[1px] h-6 bg-zinc-200/80 mx-1 sm:mx-2 hidden sm:block rounded-full" }),
429
+ showPdfImport && !isLocked && /* @__PURE__ */ jsxRuntime.jsx(
430
+ PdfImporter,
431
+ {
432
+ disabled: isLocked,
433
+ onScriptImported: handleScriptImport,
434
+ children: /* @__PURE__ */ jsxRuntime.jsx(
435
+ "div",
436
+ {
437
+ title: "Import Script",
438
+ className: "flex items-center justify-center",
439
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Upload, { className: "w-4 h-4 sm:w-[18px] sm:h-[18px]" })
440
+ }
441
+ )
442
+ }
443
+ ),
444
+ onToggleLock && /* @__PURE__ */ jsxRuntime.jsx(
445
+ "button",
446
+ {
447
+ onClick: onToggleLock,
448
+ className: `flex items-center justify-center w-8 h-8 sm:w-10 sm:h-10 rounded-full transition-all duration-200 active:scale-95 ${isLocked ? "text-rose-500 hover:bg-rose-50" : "text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900"}`,
449
+ title: isLocked ? "Unlock Script" : "Lock Script",
450
+ "aria-label": isLocked ? "Unlock Script" : "Lock Script",
451
+ children: isLocked ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Lock, { className: "w-4 h-4 sm:w-[18px] sm:h-[18px]" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Unlock, { className: "w-4 h-4 sm:w-[18px] sm:h-[18px]" })
452
+ }
453
+ ),
454
+ onSave && showSaveButton && !isLocked && /* @__PURE__ */ jsxRuntime.jsx(
455
+ "button",
456
+ {
457
+ onClick: onSave,
458
+ className: "flex items-center justify-center w-8 h-8 sm:w-10 sm:h-10 rounded-full text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900 transition-all duration-200 active:scale-95",
459
+ title: "Save Script",
460
+ "aria-label": "Save Script",
461
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Save, { className: "w-4 h-4 sm:w-[18px] sm:h-[18px]" })
462
+ }
463
+ ),
464
+ onSaveAsPdf && showSaveButton && /* @__PURE__ */ jsxRuntime.jsx(
465
+ "button",
466
+ {
467
+ onClick: onSaveAsPdf,
468
+ className: "flex items-center justify-center w-8 h-8 sm:w-10 sm:h-10 rounded-full text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900 transition-all duration-200 active:scale-95",
469
+ title: "Save as PDF",
470
+ "aria-label": "Save Script as PDF",
471
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileDown, { className: "w-4 h-4 sm:w-[18px] sm:h-[18px]" })
472
+ }
473
+ ),
474
+ onSyncWithCloud && showSyncButton && !isLocked && /* @__PURE__ */ jsxRuntime.jsx(
475
+ "button",
476
+ {
477
+ onClick: onSyncWithCloud,
478
+ className: "flex items-center justify-center w-8 h-8 sm:w-10 sm:h-10 rounded-full text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900 transition-all duration-200 active:scale-95",
479
+ title: "Sync with Cloud",
480
+ "aria-label": "Sync with Cloud",
481
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RefreshCcw, { className: "w-4 h-4 sm:w-[18px] sm:h-[18px]" })
482
+ }
483
+ ),
484
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: rulesRef, className: "relative flex items-center", children: [
485
+ /* @__PURE__ */ jsxRuntime.jsx(
486
+ "button",
487
+ {
488
+ onClick: () => setIsRulesOpen(!isRulesOpen),
489
+ className: `flex items-center justify-center w-8 h-8 sm:w-10 sm:h-10 rounded-full transition-all duration-200 active:scale-95 ${isRulesOpen ? "bg-zinc-900 text-white shadow-md shadow-zinc-900/20" : "text-zinc-500 hover:bg-zinc-100 hover:text-zinc-900"}`,
490
+ title: "Settings & Shortcuts",
491
+ "aria-label": "Toggle Settings",
492
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Cog, { className: "w-4 h-4 sm:w-[18px] sm:h-[18px]" })
493
+ }
494
+ ),
495
+ isRulesOpen && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute top-full mt-2 right-0 sm:-right-2 bg-white/95 backdrop-blur-3xl rounded-[1.5rem] shadow-[0_20px_60px_-15px_rgba(0,0,0,0.1)] p-4 sm:p-5 text-sm text-zinc-700 select-none font-sans overflow-hidden transition-all duration-300 w-[calc(100vw-2rem)] sm:w-72 max-w-[18rem] origin-top-right animate-in fade-in zoom-in-95 z-50", children: [
496
+ /* @__PURE__ */ jsxRuntime.jsxs("h4", { className: "font-bold text-zinc-900 mb-4 text-sm flex items-center gap-2", children: [
497
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Cog, { className: "w-4 h-4 text-zinc-400" }),
498
+ "Settings & Shortcuts"
499
+ ] }),
500
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsxs("ul", { className: "space-y-2.5", children: [
501
+ /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center justify-between gap-6", children: [
502
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-zinc-600", children: "New Block" }),
503
+ /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "px-2 py-1 text-[11px] font-bold text-zinc-700 bg-white border border-zinc-200/80 shadow-[0_2px_4px_rgb(0,0,0,0.02)] rounded-md", children: "Enter" })
504
+ ] }),
505
+ /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center justify-between gap-6", children: [
506
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-zinc-600", children: "Delete Block" }),
507
+ /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "px-2 py-1 text-[11px] font-bold text-zinc-700 bg-white border border-zinc-200/80 shadow-[0_2px_4px_rgb(0,0,0,0.02)] rounded-md", children: "Backspace" })
508
+ ] }),
509
+ /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center justify-between gap-6", children: [
510
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-zinc-600", children: "Change Type" }),
511
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
512
+ /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "px-2 py-1 text-[11px] font-bold text-zinc-700 bg-white border border-zinc-200/80 shadow-[0_2px_4px_rgb(0,0,0,0.02)] rounded-md", children: "Ctrl" }),
513
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-400 font-medium", children: "+" }),
514
+ /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: "px-2 py-1 text-[11px] font-bold text-zinc-700 bg-white border border-zinc-200/80 shadow-[0_2px_4px_rgb(0,0,0,0.02)] rounded-md", children: "\u2191/\u2193" })
515
+ ] })
518
516
  ] })
519
- ] })
517
+ ] }) })
520
518
  ] })
521
- ]
522
- }
523
- ),
524
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-12 w-full items-center pb-24", children: /* @__PURE__ */ jsxRuntime.jsx(
519
+ ] })
520
+ ] })
521
+ ] }),
522
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-12 pb-24 w-full items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
525
523
  "div",
526
524
  {
527
525
  className: "relative bg-[#fdfdfc] shadow-2xl shadow-zinc-300/60 border border-zinc-100 rounded-sm md:rounded-md pl-[1.5in] py-[1in] pr-[1in] flex flex-col w-[210mm] min-h-[297mm] shrink-0",
@@ -1837,7 +1835,8 @@ function ScriptBreakdownSceneView({
1837
1835
  setSceneBrief,
1838
1836
  onSummarize,
1839
1837
  isSummarizing,
1840
- aiSummarized = false
1838
+ aiSummarized = false,
1839
+ onUpdateBrief
1841
1840
  }) {
1842
1841
  const [expanded, setExpanded] = react.useState(false);
1843
1842
  const [expandedCategories, setExpandedCategories] = react.useState({});
@@ -1931,7 +1930,7 @@ function ScriptBreakdownSceneView({
1931
1930
  }
1932
1931
  return nodes;
1933
1932
  };
1934
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative p-8 md:p-12 mx-auto w-full min-h-screen flex flex-col gap-8 xl:pr-[20rem]", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center max-w-6xl", children: [
1933
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative p-8 md:p-12 mx-auto w-full min-h-screen flex flex-col gap-8 xl:pr-[20rem]", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center max-w-6xl xl:max-w-full", children: [
1935
1934
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 min-h-screen", children: [
1936
1935
  /* @__PURE__ */ jsxRuntime.jsx(
1937
1936
  "div",
@@ -2057,18 +2056,29 @@ function ScriptBreakdownSceneView({
2057
2056
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex items-center justify-center w-8 h-8 rounded-full bg-slate-100/80 shadow-inner border border-slate-200/50", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlignLeft, { className: "w-3.5 h-3.5 text-slate-500" }) }),
2058
2057
  "Scene Brief"
2059
2058
  ] }),
2060
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative bg-zinc-50/50 border border-zinc-200/60 rounded-xl p-4 md:p-6 shadow-inner focus-within:bg-white focus-within:border-zinc-300 focus-within:shadow-[0_8px_30px_rgb(0,0,0,0.04)] transition-all duration-300", children: /* @__PURE__ */ jsxRuntime.jsx(
2061
- "textarea",
2062
- {
2063
- value: sceneBrief,
2064
- onChange: (e) => setSceneBrief(e.target.value),
2065
- placeholder: "Write a brief description or notes for this scene...",
2066
- className: "w-full min-h-[120px] bg-transparent outline-none resize-y text-zinc-700 placeholder:text-zinc-400 text-sm md:text-base custom-scrollbar font-sans select-none",
2067
- style: {
2068
- lineHeight: "1.6"
2059
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative bg-zinc-50/50 border border-zinc-200/60 rounded-xl p-4 md:p-6 shadow-inner focus-within:bg-white focus-within:border-zinc-300 focus-within:shadow-[0_8px_30px_rgb(0,0,0,0.04)] transition-all duration-300", children: [
2060
+ /* @__PURE__ */ jsxRuntime.jsx(
2061
+ "textarea",
2062
+ {
2063
+ value: sceneBrief,
2064
+ onChange: (e) => setSceneBrief(e.target.value),
2065
+ placeholder: "Write a brief description or notes for this scene...",
2066
+ className: "w-full min-h-[120px] bg-transparent outline-none resize-y text-zinc-700 placeholder:text-zinc-400 text-sm md:text-base custom-scrollbar font-sans select-none",
2067
+ style: {
2068
+ lineHeight: "1.6"
2069
+ }
2069
2070
  }
2070
- }
2071
- ) })
2071
+ ),
2072
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex justify-end", children: /* @__PURE__ */ jsxRuntime.jsx(
2073
+ "button",
2074
+ {
2075
+ onClick: onUpdateBrief,
2076
+ disabled: !sceneBrief || sceneBrief.trim() === "",
2077
+ className: "rounded-full bg-[#15607b] px-6 py-3 text-[13px] font-semibold tracking-wide text-white shadow-md transition-all hover:bg-[#134a61] hover:shadow-lg active:scale-95 disabled:bg-gray-200 disabled:cursor-not-allowed disabled:opacity-95 disabled:text-black disabled:shadow-none",
2078
+ children: "Update"
2079
+ }
2080
+ ) })
2081
+ ] })
2072
2082
  ] })
2073
2083
  ] }),
2074
2084
  /* @__PURE__ */ jsxRuntime.jsxs(
@@ -2109,7 +2119,7 @@ function ScriptBreakdownSceneView({
2109
2119
  ] }),
2110
2120
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "rounded-full border border-slate-200/60 bg-slate-50 px-2.5 py-1 text-[11px] font-semibold text-[#134a61] shadow-sm backdrop-blur-md", children: tags.length }) })
2111
2121
  ] }),
2112
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 overflow-y-auto custom-scrollbar", children: CATEGORIES.map((cat) => {
2122
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 overflow-y-auto overflow-x-hidden pb-4 pr-1 custom-scrollbar", children: CATEGORIES.map((cat) => {
2113
2123
  const catTags = tags.filter((t) => t.category_id === cat.id);
2114
2124
  if (!catTags.length) return null;
2115
2125
  const isExpanded = expandedCategories[cat.id];
@@ -2122,7 +2132,7 @@ function ScriptBreakdownSceneView({
2122
2132
  /* @__PURE__ */ jsxRuntime.jsxs(
2123
2133
  "div",
2124
2134
  {
2125
- onClick: () => setExpandedCategories((prev) => __spreadProps(__spreadValues({}, prev), {
2135
+ onClick: () => setExpandedCategories((prev) => ({
2126
2136
  [cat.id]: !prev[cat.id]
2127
2137
  })),
2128
2138
  className: "group relative flex cursor-pointer items-center gap-3 overflow-hidden rounded-[24px] border border-white/70 px-4 py-3.5 transition-all duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] hover:-translate-y-[1px]",
@@ -2178,7 +2188,8 @@ function ScriptBreakdownSceneView({
2178
2188
  children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap justify-start gap-2 py-2", children: uniqueTags.map((tag, index) => /* @__PURE__ */ jsxRuntime.jsx(
2179
2189
  "span",
2180
2190
  {
2181
- className: "text-[11px] font-semibold px-3 py-1.5 rounded-full border backdrop-blur-md transition-all duration-300",
2191
+ title: tag.name,
2192
+ className: "inline-block max-w-full truncate text-[11px] font-semibold px-3 py-1.5 rounded-full border backdrop-blur-md transition-all duration-300",
2182
2193
  style: {
2183
2194
  color: cat.color,
2184
2195
  background: `linear-gradient(145deg, ${cat.color}18, rgba(255,255,255,0.88))`,