@vishu1301/script-writing 1.3.3 → 1.3.5

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.
Files changed (7) hide show
  1. package/dist/index.cjs +598 -400
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +8 -4
  4. package/dist/index.d.ts +8 -4
  5. package/dist/index.js +599 -401
  6. package/dist/index.js.map +1 -1
  7. package/package.json +1 -1
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,10 +1835,16 @@ function ScriptBreakdownSceneView({
1837
1835
  setSceneBrief,
1838
1836
  onSummarize,
1839
1837
  isSummarizing,
1840
- aiSummarized = false
1838
+ aiSummarized = false,
1839
+ onUpdateBrief
1841
1840
  }) {
1842
- const [expanded, setExpanded] = react.useState(false);
1843
1841
  const [expandedCategories, setExpandedCategories] = react.useState({});
1842
+ const [editingTagData, setEditingTagData] = react.useState(null);
1843
+ const [tagForm, setTagForm] = react.useState({ quantity: 1, look: "", age: "" });
1844
+ const [popupPlacement, setPopupPlacement] = react.useState({
1845
+ alignRight: false,
1846
+ alignBottom: false
1847
+ });
1844
1848
  const [isSidebarOpen, setIsSidebarOpen] = react.useState(false);
1845
1849
  const COURIER_STACK = "'Courier Prime', 'Courier', monospace";
1846
1850
  react.useEffect(() => {
@@ -1931,273 +1935,438 @@ function ScriptBreakdownSceneView({
1931
1935
  }
1932
1936
  return nodes;
1933
1937
  };
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 xl:max-w-full", children: [
1935
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 min-h-screen", children: [
1938
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative p-8 md:p-12 mx-auto w-full min-h-screen flex flex-col gap-8 xl:pr-[20rem]", children: [
1939
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center max-w-6xl xl:max-w-full", children: [
1940
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 min-h-screen", children: [
1941
+ /* @__PURE__ */ jsxRuntime.jsx(
1942
+ "div",
1943
+ {
1944
+ className: "relative bg-[#fdfdfc] shadow-md 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-auto shrink-0",
1945
+ style: {
1946
+ fontFamily: COURIER_STACK,
1947
+ paddingLeft: "1.5in",
1948
+ paddingRight: "1in",
1949
+ paddingTop: "1in",
1950
+ paddingBottom: "1in",
1951
+ lineHeight: "1.2"
1952
+ },
1953
+ "data-screenplay-editor": "true",
1954
+ onMouseUp: handleMouseUp,
1955
+ children: blocks.map((block) => /* @__PURE__ */ jsxRuntime.jsxs(
1956
+ "div",
1957
+ {
1958
+ "data-block-id": block.id,
1959
+ className: `relative break-words w-full px-4 py-2 ${blockStyles[block.type].className}`,
1960
+ style: __spreadProps(__spreadValues({}, blockStyles[block.type].inputStyle), {
1961
+ minHeight: "2.5rem"
1962
+ }),
1963
+ children: [
1964
+ renderBlockText(block),
1965
+ (selectionMenu == null ? void 0 : selectionMenu.blockId) === block.id && /* @__PURE__ */ jsxRuntime.jsxs(
1966
+ "div",
1967
+ {
1968
+ ref: menuRef,
1969
+ "data-screenplay-editor": "false",
1970
+ className: `tag-menu absolute z-50 bg-white/70 backdrop-blur-2xl shadow-[0_10px_40px_rgb(0,0,0,0.06)] border border-white rounded-[1.5rem] p-2 flex flex-col w-56 animate-in fade-in zoom-in-95 duration-300 ease-out ${menuPlacement === "top" ? "origin-bottom" : "origin-top"}`,
1971
+ style: {
1972
+ top: selectionMenu.top,
1973
+ left: selectionMenu.left,
1974
+ transform: menuPlacement === "top" ? "translate(-50%, calc(-100% - 12px))" : "translate(-50%, 32px)"
1975
+ },
1976
+ children: [
1977
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 px-3 py-2.5 border-b border-white/60 mb-1.5", children: [
1978
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[9px] font-extrabold tracking-[0.2em] text-slate-400 uppercase mb-1", children: "Tag Element" }),
1979
+ /* @__PURE__ */ jsxRuntime.jsxs(
1980
+ "p",
1981
+ {
1982
+ className: "text-xs font-bold text-slate-700 truncate drop-shadow-sm",
1983
+ title: selectionMenu.text,
1984
+ children: [
1985
+ '"',
1986
+ selectionMenu.text,
1987
+ '"'
1988
+ ]
1989
+ }
1990
+ )
1991
+ ] }),
1992
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex flex-col gap-1", children: [
1993
+ CATEGORIES.filter(
1994
+ (cat) => !(cat.id === "LOCATION" && hasLocationTag) && !(cat.id === "SUBLOCATION" && !hasLocationTag)
1995
+ ).map((cat) => /* @__PURE__ */ jsxRuntime.jsxs(
1996
+ "button",
1997
+ {
1998
+ onClick: () => {
1999
+ const existingTag = tags.find(
2000
+ (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
2001
+ );
2002
+ if (existingTag && existingTag.id) {
2003
+ updateTag == null ? void 0 : updateTag(existingTag.id, cat.id);
2004
+ } else {
2005
+ addTag(cat.id);
2006
+ }
2007
+ },
2008
+ 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]",
2009
+ style: { color: cat.color },
2010
+ children: [
2011
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2012
+ /* @__PURE__ */ jsxRuntime.jsx(
2013
+ cat.icon,
2014
+ {
2015
+ className: "w-4 h-4 group-hover:scale-110 transition-transform duration-300",
2016
+ style: { color: cat.color }
2017
+ }
2018
+ ),
2019
+ cat.label
2020
+ ] }),
2021
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-slate-400 opacity-0 group-hover:opacity-100 transition-all duration-300 translate-x-1 group-hover:translate-x-0", children: "Select" })
2022
+ ]
2023
+ },
2024
+ cat.id
2025
+ )),
2026
+ tags.some(
2027
+ (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
2028
+ ) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 pt-1 border-t border-white/60", children: /* @__PURE__ */ jsxRuntime.jsxs(
2029
+ "button",
2030
+ {
2031
+ onClick: (e) => {
2032
+ const tagToRemove = tags.find(
2033
+ (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
2034
+ );
2035
+ if (tagToRemove) {
2036
+ removeTag(e, tagToRemove.id);
2037
+ clearSelection();
2038
+ }
2039
+ },
2040
+ 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-rose-50 hover:text-rose-600 hover:shadow-[0_2px_10px_rgb(225,29,72,0.04)] active:scale-[0.98] text-slate-500 border border-transparent hover:border-rose-100",
2041
+ children: [
2042
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2043
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 h-2 rounded-full shadow-sm bg-rose-400 group-hover:scale-125 transition-transform duration-300" }),
2044
+ "Remove Tag"
2045
+ ] }),
2046
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-rose-400 opacity-0 group-hover:opacity-100 transition-all duration-300 translate-x-1 group-hover:translate-x-0", children: "Remove" })
2047
+ ]
2048
+ }
2049
+ ) })
2050
+ ] })
2051
+ ]
2052
+ }
2053
+ )
2054
+ ]
2055
+ },
2056
+ block.id
2057
+ ))
2058
+ }
2059
+ ),
2060
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative bg-[#fdfdfc] shadow-md shadow-zinc-300/60 border border-zinc-100 rounded-sm md:rounded-md flex flex-col w-[210mm] shrink-0 p-8 md:p-12 lg:p-16", children: [
2061
+ /* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "text-xs font-extrabold text-slate-800 uppercase tracking-[0.25em] mb-6 flex items-center gap-3 font-sans", children: [
2062
+ /* @__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" }) }),
2063
+ "Scene Brief"
2064
+ ] }),
2065
+ /* @__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: [
2066
+ /* @__PURE__ */ jsxRuntime.jsx(
2067
+ "textarea",
2068
+ {
2069
+ value: sceneBrief,
2070
+ onChange: (e) => setSceneBrief(e.target.value),
2071
+ placeholder: "Write a brief description or notes for this scene...",
2072
+ 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",
2073
+ style: {
2074
+ lineHeight: "1.6"
2075
+ }
2076
+ }
2077
+ ),
2078
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex justify-end", children: /* @__PURE__ */ jsxRuntime.jsx(
2079
+ "button",
2080
+ {
2081
+ onClick: onUpdateBrief,
2082
+ disabled: !sceneBrief || sceneBrief.trim() === "",
2083
+ 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",
2084
+ children: "Update"
2085
+ }
2086
+ ) })
2087
+ ] })
2088
+ ] })
2089
+ ] }),
2090
+ /* @__PURE__ */ jsxRuntime.jsxs(
2091
+ "button",
2092
+ {
2093
+ onClick: () => setIsSidebarOpen(true),
2094
+ className: "fixed bottom-6 right-6 z-40 flex h-14 w-14 items-center justify-center rounded-full bg-[#15607b] text-white shadow-[0_8px_30px_rgba(21,96,123,0.3)] transition-transform hover:scale-105 active:scale-95 xl:hidden",
2095
+ children: [
2096
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-6 w-6" }),
2097
+ tags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -top-1 -right-1 flex h-5 w-5 items-center justify-center rounded-full bg-rose-500 text-[10px] font-bold text-white shadow-sm border-2 border-white", children: tags.length })
2098
+ ]
2099
+ }
2100
+ ),
2101
+ isSidebarOpen && /* @__PURE__ */ jsxRuntime.jsx(
2102
+ "div",
2103
+ {
2104
+ className: "fixed inset-0 z-40 bg-slate-900/20 backdrop-blur-sm transition-opacity xl:hidden",
2105
+ onClick: () => setIsSidebarOpen(false)
2106
+ }
2107
+ ),
1936
2108
  /* @__PURE__ */ jsxRuntime.jsx(
1937
2109
  "div",
1938
2110
  {
1939
- className: "relative bg-[#fdfdfc] shadow-md 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-auto shrink-0",
1940
- style: {
1941
- fontFamily: COURIER_STACK,
1942
- paddingLeft: "1.5in",
1943
- paddingRight: "1in",
1944
- paddingTop: "1in",
1945
- paddingBottom: "1in",
1946
- lineHeight: "1.2"
1947
- },
1948
- "data-screenplay-editor": "true",
1949
- onMouseUp: handleMouseUp,
1950
- children: blocks.map((block) => /* @__PURE__ */ jsxRuntime.jsxs(
1951
- "div",
1952
- {
1953
- "data-block-id": block.id,
1954
- className: `relative break-words w-full px-4 py-2 ${blockStyles[block.type].className}`,
1955
- style: __spreadProps(__spreadValues({}, blockStyles[block.type].inputStyle), {
1956
- minHeight: "2.5rem"
1957
- }),
1958
- children: [
1959
- renderBlockText(block),
1960
- (selectionMenu == null ? void 0 : selectionMenu.blockId) === block.id && /* @__PURE__ */ jsxRuntime.jsxs(
1961
- "div",
1962
- {
1963
- ref: menuRef,
1964
- "data-screenplay-editor": "false",
1965
- className: `tag-menu absolute z-50 bg-white/70 backdrop-blur-2xl shadow-[0_10px_40px_rgb(0,0,0,0.06)] border border-white rounded-[1.5rem] p-2 flex flex-col w-56 animate-in fade-in zoom-in-95 duration-300 ease-out ${menuPlacement === "top" ? "origin-bottom" : "origin-top"}`,
1966
- style: {
1967
- top: selectionMenu.top,
1968
- left: selectionMenu.left,
1969
- transform: menuPlacement === "top" ? "translate(-50%, calc(-100% - 12px))" : "translate(-50%, 32px)"
1970
- },
1971
- children: [
1972
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 px-3 py-2.5 border-b border-white/60 mb-1.5", children: [
1973
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[9px] font-extrabold tracking-[0.2em] text-slate-400 uppercase mb-1", children: "Tag Element" }),
1974
- /* @__PURE__ */ jsxRuntime.jsxs(
1975
- "p",
2111
+ className: `fixed xl:absolute top-0 right-0 z-50 h-full w-72 transform transition-transform duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] xl:translate-x-0 ${isSidebarOpen ? "translate-x-0 shadow-[0_0_40px_rgba(0,0,0,0.1)]" : "translate-x-full"}`,
2112
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sticky top-0 flex h-[100dvh] max-h-screen w-full flex-col border-l border-l-[#eefafd] bg-white p-3 py-5", children: [
2113
+ !aiSummarized && /* @__PURE__ */ jsxRuntime.jsx(
2114
+ summarize_button_default,
2115
+ {
2116
+ isSummarizing,
2117
+ onSummarize
2118
+ }
2119
+ ),
2120
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col gap-3 py-5 my-5 border-t border-t-[#eefafd] flex-1 overflow-hidden", children: [
2121
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center justify-between mb-6 shrink-0", children: [
2122
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2123
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex h-8 w-8 items-center justify-center rounded-[10px] border border-[#15607b]/20 bg-white shadow-sm", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-4 w-4 text-[#15607b]" }) }),
2124
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[12px] font-semibold uppercase tracking-[0.28em] text-[#134a61]", children: "Breakdown" })
2125
+ ] }),
2126
+ /* @__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 }) })
2127
+ ] }),
2128
+ /* @__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) => {
2129
+ const catTags = tags.filter((t) => t.category_id === cat.id);
2130
+ if (!catTags.length) return null;
2131
+ const isExpanded = expandedCategories[cat.id];
2132
+ const uniqueTags = Array.from(
2133
+ new Map(
2134
+ catTags.map((tag) => [tag.name.toLowerCase(), tag])
2135
+ ).values()
2136
+ );
2137
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
2138
+ /* @__PURE__ */ jsxRuntime.jsxs(
2139
+ "div",
2140
+ {
2141
+ onClick: () => setExpandedCategories((prev) => ({
2142
+ [cat.id]: !prev[cat.id]
2143
+ })),
2144
+ 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]",
2145
+ style: {
2146
+ background: `linear-gradient(135deg, rgba(255,255,255,0.92), ${cat.hex}18)`,
2147
+ boxShadow: `0 16px 36px ${cat.hex}14, inset 0 1px 0 rgba(255,255,255,0.9)`,
2148
+ border: `1px solid ${cat.hex}50`
2149
+ },
2150
+ children: [
2151
+ /* @__PURE__ */ jsxRuntime.jsx(
2152
+ "div",
1976
2153
  {
1977
- className: "text-xs font-bold text-slate-700 truncate drop-shadow-sm",
1978
- title: selectionMenu.text,
1979
- children: [
1980
- '"',
1981
- selectionMenu.text,
1982
- '"'
1983
- ]
2154
+ className: "absolute inset-0 opacity-0 transition-opacity duration-300 group-hover:opacity-100",
2155
+ style: {
2156
+ background: `radial-gradient(circle at 15% 20%, ${cat.hex}24, transparent 38%)`
2157
+ }
1984
2158
  }
1985
- )
1986
- ] }),
1987
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex flex-col gap-1", children: [
1988
- CATEGORIES.filter(
1989
- (cat) => !(cat.id === "LOCATION" && hasLocationTag) && !(cat.id === "SUBLOCATION" && !hasLocationTag)
1990
- ).map((cat) => /* @__PURE__ */ jsxRuntime.jsxs(
1991
- "button",
2159
+ ),
2160
+ /* @__PURE__ */ jsxRuntime.jsx(
2161
+ "div",
1992
2162
  {
1993
- onClick: () => {
1994
- const existingTag = tags.find(
1995
- (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
1996
- );
1997
- if (existingTag && existingTag.id) {
1998
- updateTag == null ? void 0 : updateTag(existingTag.id, cat.id);
1999
- } else {
2000
- addTag(cat.id);
2001
- }
2163
+ className: "relative flex h-9 w-9 shrink-0 items-center justify-center rounded-xl border border-white/70 backdrop-blur-md",
2164
+ style: {
2165
+ background: `linear-gradient(135deg, ${cat.color}22, rgba(255,255,255,0.75))`,
2166
+ boxShadow: `0 10px 22px ${cat.color}14`
2002
2167
  },
2003
- 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]",
2168
+ children: /* @__PURE__ */ jsxRuntime.jsx(cat.icon, { className: "h-4 w-4", color: cat.color })
2169
+ }
2170
+ ),
2171
+ /* @__PURE__ */ jsxRuntime.jsx(
2172
+ "span",
2173
+ {
2174
+ className: "relative text-[13px] font-semibold tracking-[0.01em]",
2004
2175
  style: { color: cat.color },
2005
- children: [
2006
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2007
- /* @__PURE__ */ jsxRuntime.jsx(
2008
- cat.icon,
2009
- {
2010
- className: "w-4 h-4 group-hover:scale-110 transition-transform duration-300",
2011
- style: { color: cat.color }
2012
- }
2013
- ),
2014
- cat.label
2015
- ] }),
2016
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-slate-400 opacity-0 group-hover:opacity-100 transition-all duration-300 translate-x-1 group-hover:translate-x-0", children: "Select" })
2017
- ]
2018
- },
2019
- cat.id
2020
- )),
2021
- tags.some(
2022
- (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
2023
- ) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 pt-1 border-t border-white/60", children: /* @__PURE__ */ jsxRuntime.jsxs(
2024
- "button",
2176
+ children: cat.label
2177
+ }
2178
+ ),
2179
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative ml-auto rounded-full border border-white/70 bg-white/75 px-2.5 py-1 text-[11px] font-semibold text-[#456575] backdrop-blur-md", children: catTags.length }),
2180
+ /* @__PURE__ */ jsxRuntime.jsx(
2181
+ lucideReact.ChevronDown,
2025
2182
  {
2026
- onClick: (e) => {
2027
- const tagToRemove = tags.find(
2028
- (t) => t.block_id === block.id && t.start_index === selectionMenu.startIndex && t.end_index === selectionMenu.endIndex
2029
- );
2030
- if (tagToRemove) {
2031
- removeTag(e, tagToRemove.id);
2032
- clearSelection();
2033
- }
2034
- },
2035
- 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-rose-50 hover:text-rose-600 hover:shadow-[0_2px_10px_rgb(225,29,72,0.04)] active:scale-[0.98] text-slate-500 border border-transparent hover:border-rose-100",
2036
- children: [
2037
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2038
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-2 h-2 rounded-full shadow-sm bg-rose-400 group-hover:scale-125 transition-transform duration-300" }),
2039
- "Remove Tag"
2040
- ] }),
2041
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-rose-400 opacity-0 group-hover:opacity-100 transition-all duration-300 translate-x-1 group-hover:translate-x-0", children: "Remove" })
2042
- ]
2183
+ className: `relative h-4 w-4 transition-transform duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "rotate-180" : ""}`,
2184
+ style: { color: cat.color }
2043
2185
  }
2044
- ) })
2045
- ] })
2046
- ]
2047
- }
2048
- )
2049
- ]
2050
- },
2051
- block.id
2052
- ))
2186
+ )
2187
+ ]
2188
+ }
2189
+ ),
2190
+ /* @__PURE__ */ jsxRuntime.jsx(
2191
+ "div",
2192
+ {
2193
+ className: `grid transition-all duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "grid-rows-[1fr] opacity-100 mt-3" : "grid-rows-[0fr] opacity-0"}`,
2194
+ 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(
2195
+ "div",
2196
+ {
2197
+ className: "relative flex flex-col items-start",
2198
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
2199
+ "span",
2200
+ {
2201
+ title: tag.name,
2202
+ onClick: (e) => {
2203
+ e.stopPropagation();
2204
+ if (cat.id !== "PROP" && cat.id !== "SET_PROP" && cat.id !== "CAST")
2205
+ return;
2206
+ if ((editingTagData == null ? void 0 : editingTagData.tag.id) === tag.id) {
2207
+ setEditingTagData(null);
2208
+ } else {
2209
+ const rect = e.currentTarget.getBoundingClientRect();
2210
+ setPopupPlacement({
2211
+ alignRight: rect.left > window.innerWidth - 240,
2212
+ alignBottom: rect.bottom > window.innerHeight - 250
2213
+ });
2214
+ setTagForm({
2215
+ quantity: tag.quantity || 1,
2216
+ look: tag.look || "",
2217
+ age: tag.age || ""
2218
+ });
2219
+ setEditingTagData({
2220
+ tag,
2221
+ catId: cat.id,
2222
+ catColor: cat.color,
2223
+ rect
2224
+ });
2225
+ }
2226
+ },
2227
+ 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 ${cat.id === "PROP" || cat.id === "SET_PROP" || cat.id === "CAST" ? "cursor-pointer hover:scale-105 shadow-sm" : ""}`,
2228
+ style: {
2229
+ color: cat.color,
2230
+ background: `linear-gradient(145deg, ${cat.color}18, rgba(255,255,255,0.88))`,
2231
+ borderColor: `${cat.color}28`
2232
+ },
2233
+ children: [
2234
+ tag.name,
2235
+ (cat.id === "PROP" || cat.id === "SET_PROP") && tag.quantity && tag.quantity > 1 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-1.5 opacity-80 font-bold", children: [
2236
+ "x",
2237
+ tag.quantity
2238
+ ] }) : null
2239
+ ]
2240
+ }
2241
+ )
2242
+ },
2243
+ index
2244
+ )) }) })
2245
+ }
2246
+ )
2247
+ ] }, cat.id);
2248
+ }) })
2249
+ ] })
2250
+ ] })
2053
2251
  }
2054
- ),
2055
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative bg-[#fdfdfc] shadow-md shadow-zinc-300/60 border border-zinc-100 rounded-sm md:rounded-md flex flex-col w-[210mm] shrink-0 p-8 md:p-12 lg:p-16", children: [
2056
- /* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "text-xs font-extrabold text-slate-800 uppercase tracking-[0.25em] mb-6 flex items-center gap-3 font-sans", children: [
2057
- /* @__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
- "Scene Brief"
2059
- ] }),
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"
2069
- }
2070
- }
2071
- ) })
2072
- ] })
2252
+ )
2073
2253
  ] }),
2074
- /* @__PURE__ */ jsxRuntime.jsxs(
2075
- "button",
2076
- {
2077
- onClick: () => setIsSidebarOpen(true),
2078
- className: "fixed bottom-6 right-6 z-40 flex h-14 w-14 items-center justify-center rounded-full bg-[#15607b] text-white shadow-[0_8px_30px_rgba(21,96,123,0.3)] transition-transform hover:scale-105 active:scale-95 xl:hidden",
2079
- children: [
2080
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-6 w-6" }),
2081
- tags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -top-1 -right-1 flex h-5 w-5 items-center justify-center rounded-full bg-rose-500 text-[10px] font-bold text-white shadow-sm border-2 border-white", children: tags.length })
2082
- ]
2083
- }
2084
- ),
2085
- isSidebarOpen && /* @__PURE__ */ jsxRuntime.jsx(
2086
- "div",
2087
- {
2088
- className: "fixed inset-0 z-40 bg-slate-900/20 backdrop-blur-sm transition-opacity xl:hidden",
2089
- onClick: () => setIsSidebarOpen(false)
2090
- }
2091
- ),
2092
- /* @__PURE__ */ jsxRuntime.jsx(
2093
- "div",
2094
- {
2095
- className: `fixed xl:absolute top-0 right-0 z-50 h-full w-72 transform transition-transform duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] xl:translate-x-0 ${isSidebarOpen ? "translate-x-0 shadow-[0_0_40px_rgba(0,0,0,0.1)]" : "translate-x-full"}`,
2096
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "sticky top-0 flex h-[100dvh] max-h-screen w-full flex-col border-l border-l-[#eefafd] bg-white p-3 py-5", children: [
2097
- !aiSummarized && /* @__PURE__ */ jsxRuntime.jsx(
2098
- summarize_button_default,
2099
- {
2100
- isSummarizing,
2101
- onSummarize
2102
- }
2103
- ),
2104
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col gap-3 py-5 my-5 border-t border-t-[#eefafd] flex-1 overflow-hidden", children: [
2105
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center justify-between mb-6 shrink-0", children: [
2106
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
2107
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex h-8 w-8 items-center justify-center rounded-[10px] border border-[#15607b]/20 bg-white shadow-sm", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-4 w-4 text-[#15607b]" }) }),
2108
- /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[12px] font-semibold uppercase tracking-[0.28em] text-[#134a61]", children: "Breakdown" })
2109
- ] }),
2110
- /* @__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 }) })
2254
+ editingTagData && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2255
+ /* @__PURE__ */ jsxRuntime.jsx(
2256
+ "div",
2257
+ {
2258
+ className: "fixed inset-0 z-[100]",
2259
+ onClick: (e) => {
2260
+ e.stopPropagation();
2261
+ setEditingTagData(null);
2262
+ }
2263
+ }
2264
+ ),
2265
+ /* @__PURE__ */ jsxRuntime.jsxs(
2266
+ "div",
2267
+ {
2268
+ className: `p-3.5 bg-white/90 backdrop-blur-2xl rounded-[1.25rem] shadow-[0_10px_40px_rgb(0,0,0,0.12)] border border-white/60 z-[101] w-56 animate-in fade-in zoom-in-95 duration-200 ease-out fixed`,
2269
+ style: {
2270
+ top: popupPlacement.alignBottom ? "auto" : editingTagData.rect.bottom + 8,
2271
+ bottom: popupPlacement.alignBottom ? window.innerHeight - editingTagData.rect.top + 8 : "auto",
2272
+ left: popupPlacement.alignRight ? "auto" : editingTagData.rect.left,
2273
+ right: popupPlacement.alignRight ? window.innerWidth - editingTagData.rect.right : "auto"
2274
+ },
2275
+ onClick: (e) => e.stopPropagation(),
2276
+ children: [
2277
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center mb-3 border-b border-slate-100 pb-2.5", children: [
2278
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-extrabold text-slate-400 uppercase tracking-widest drop-shadow-sm", children: "Details" }),
2279
+ /* @__PURE__ */ jsxRuntime.jsx(
2280
+ "button",
2281
+ {
2282
+ onClick: () => setEditingTagData(null),
2283
+ className: "hover:bg-slate-100/80 p-1.5 rounded-full transition-colors active:scale-95",
2284
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-3.5 h-3.5 text-slate-500" })
2285
+ }
2286
+ )
2111
2287
  ] }),
2112
- /* @__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
- const catTags = tags.filter((t) => t.category_id === cat.id);
2114
- if (!catTags.length) return null;
2115
- const isExpanded = expandedCategories[cat.id];
2116
- const uniqueTags = Array.from(
2117
- new Map(
2118
- catTags.map((tag) => [tag.name.toLowerCase(), tag])
2119
- ).values()
2120
- );
2121
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
2122
- /* @__PURE__ */ jsxRuntime.jsxs(
2123
- "div",
2288
+ (editingTagData.catId === "PROP" || editingTagData.catId === "SET_PROP") && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
2289
+ /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Quantity" }),
2290
+ /* @__PURE__ */ jsxRuntime.jsx(
2291
+ "input",
2292
+ {
2293
+ type: "number",
2294
+ min: "1",
2295
+ value: tagForm.quantity,
2296
+ onChange: (e) => {
2297
+ const val = Math.max(1, parseInt(e.target.value) || 1);
2298
+ setTagForm((prev) => __spreadProps(__spreadValues({}, prev), {
2299
+ quantity: val
2300
+ }));
2301
+ },
2302
+ className: "w-full text-[13px] px-3 py-2 rounded-xl border border-slate-200/80 outline-none focus:border-[#15607b] focus:ring-2 focus:ring-[#15607b]/20 transition-all bg-slate-50/50 focus:bg-white font-semibold text-slate-700"
2303
+ }
2304
+ )
2305
+ ] }),
2306
+ editingTagData.catId === "CAST" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
2307
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
2308
+ /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Look" }),
2309
+ /* @__PURE__ */ jsxRuntime.jsx(
2310
+ "input",
2124
2311
  {
2125
- onClick: () => setExpandedCategories((prev) => ({
2126
- [cat.id]: !prev[cat.id]
2127
- })),
2128
- 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]",
2129
- style: {
2130
- background: `linear-gradient(135deg, rgba(255,255,255,0.92), ${cat.hex}18)`,
2131
- boxShadow: `0 16px 36px ${cat.hex}14, inset 0 1px 0 rgba(255,255,255,0.9)`,
2132
- border: `1px solid ${cat.hex}50`
2312
+ type: "text",
2313
+ placeholder: "e.g. Dirty, Formal",
2314
+ value: tagForm.look,
2315
+ onChange: (e) => {
2316
+ setTagForm((prev) => __spreadProps(__spreadValues({}, prev), {
2317
+ look: e.target.value
2318
+ }));
2133
2319
  },
2134
- children: [
2135
- /* @__PURE__ */ jsxRuntime.jsx(
2136
- "div",
2137
- {
2138
- className: "absolute inset-0 opacity-0 transition-opacity duration-300 group-hover:opacity-100",
2139
- style: {
2140
- background: `radial-gradient(circle at 15% 20%, ${cat.hex}24, transparent 38%)`
2141
- }
2142
- }
2143
- ),
2144
- /* @__PURE__ */ jsxRuntime.jsx(
2145
- "div",
2146
- {
2147
- className: "relative flex h-9 w-9 shrink-0 items-center justify-center rounded-xl border border-white/70 backdrop-blur-md",
2148
- style: {
2149
- background: `linear-gradient(135deg, ${cat.color}22, rgba(255,255,255,0.75))`,
2150
- boxShadow: `0 10px 22px ${cat.color}14`
2151
- },
2152
- children: /* @__PURE__ */ jsxRuntime.jsx(cat.icon, { className: "h-4 w-4", color: cat.color })
2153
- }
2154
- ),
2155
- /* @__PURE__ */ jsxRuntime.jsx(
2156
- "span",
2157
- {
2158
- className: "relative text-[13px] font-semibold tracking-[0.01em]",
2159
- style: { color: cat.color },
2160
- children: cat.label
2161
- }
2162
- ),
2163
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative ml-auto rounded-full border border-white/70 bg-white/75 px-2.5 py-1 text-[11px] font-semibold text-[#456575] backdrop-blur-md", children: catTags.length }),
2164
- /* @__PURE__ */ jsxRuntime.jsx(
2165
- lucideReact.ChevronDown,
2166
- {
2167
- className: `relative h-4 w-4 transition-transform duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "rotate-180" : ""}`,
2168
- style: { color: cat.color }
2169
- }
2170
- )
2171
- ]
2320
+ className: "w-full text-[13px] px-3 py-2 rounded-xl border border-slate-200/80 outline-none focus:border-[#15607b] focus:ring-2 focus:ring-[#15607b]/20 transition-all bg-slate-50/50 focus:bg-white font-semibold text-slate-700 placeholder:text-slate-400 placeholder:font-normal"
2172
2321
  }
2173
- ),
2322
+ )
2323
+ ] }),
2324
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
2325
+ /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Age" }),
2174
2326
  /* @__PURE__ */ jsxRuntime.jsx(
2175
- "div",
2327
+ "input",
2176
2328
  {
2177
- className: `grid transition-all duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "grid-rows-[1fr] opacity-100 mt-3" : "grid-rows-[0fr] opacity-0"}`,
2178
- 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
- "span",
2180
- {
2181
- title: tag.name,
2182
- 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",
2183
- style: {
2184
- color: cat.color,
2185
- background: `linear-gradient(145deg, ${cat.color}18, rgba(255,255,255,0.88))`,
2186
- borderColor: `${cat.color}28`
2187
- },
2188
- children: tag.name
2189
- },
2190
- index
2191
- )) }) })
2329
+ type: "number",
2330
+ min: "0",
2331
+ max: "100",
2332
+ value: tagForm.age,
2333
+ onChange: (e) => {
2334
+ let val = parseInt(e.target.value);
2335
+ if (isNaN(val)) {
2336
+ setTagForm((prev) => __spreadProps(__spreadValues({}, prev), {
2337
+ age: ""
2338
+ }));
2339
+ return;
2340
+ }
2341
+ val = Math.max(0, Math.min(100, val));
2342
+ setTagForm((prev) => __spreadProps(__spreadValues({}, prev), {
2343
+ age: val.toString()
2344
+ }));
2345
+ },
2346
+ className: "w-full text-[13px] px-3 py-2 rounded-xl border border-slate-200/80 outline-none focus:border-[#15607b] focus:ring-2 focus:ring-[#15607b]/20 transition-all bg-slate-50/50 focus:bg-white font-semibold text-slate-700"
2192
2347
  }
2193
2348
  )
2194
- ] }, cat.id);
2195
- }) })
2196
- ] })
2197
- ] })
2198
- }
2199
- )
2200
- ] }) });
2349
+ ] })
2350
+ ] }),
2351
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children: /* @__PURE__ */ jsxRuntime.jsx(
2352
+ "button",
2353
+ {
2354
+ onClick: (e) => {
2355
+ e.stopPropagation();
2356
+ if (editingTagData.tag.id) {
2357
+ updateTag == null ? void 0 : updateTag(editingTagData.tag.id, null, __spreadValues(__spreadValues({}, editingTagData.catId === "PROP" || editingTagData.catId === "SET_PROP" ? { quantity: tagForm.quantity } : {}), editingTagData.catId === "CAST" ? { look: tagForm.look, age: tagForm.age } : {}));
2358
+ }
2359
+ setEditingTagData(null);
2360
+ },
2361
+ className: "w-full bg-[#15607b] hover:bg-[#134a61] text-white text-[12px] font-bold py-2.5 rounded-xl transition-all shadow-[0_4px_12px_rgba(21,96,123,0.2)] hover:shadow-[0_6px_16px_rgba(21,96,123,0.3)] active:scale-[0.98]",
2362
+ children: "Update Details"
2363
+ }
2364
+ ) })
2365
+ ]
2366
+ }
2367
+ )
2368
+ ] })
2369
+ ] });
2201
2370
  }
2202
2371
  function useScriptBreakdownScene(options) {
2203
2372
  const [tags, setTags] = react.useState(options.preLoadedTags || []);
@@ -2295,14 +2464,21 @@ function useScriptBreakdownScene(options) {
2295
2464
  if (!aiTag.block_id || !aiTag.category_id || typeof aiTag.start_index !== "number" || typeof aiTag.end_index !== "number") {
2296
2465
  return;
2297
2466
  }
2298
- newTags.push({
2467
+ const newTag = {
2299
2468
  id: aiTag.id || uuid(),
2300
2469
  block_id: String(aiTag.block_id).startsWith("par") ? String(aiTag.block_id).substring(3) : String(aiTag.block_id),
2301
2470
  category_id: aiTag.category_id,
2302
2471
  name: aiTag.name,
2303
2472
  start_index: aiTag.start_index,
2304
2473
  end_index: aiTag.end_index
2305
- });
2474
+ };
2475
+ if (aiTag.category_id === "PROP" || aiTag.category_id === "SET_PROP") {
2476
+ newTag.quantity = 1;
2477
+ } else if (aiTag.category_id === "CAST") {
2478
+ newTag.look = "";
2479
+ newTag.age = "";
2480
+ }
2481
+ newTags.push(newTag);
2306
2482
  });
2307
2483
  if (newTags.length > 0) {
2308
2484
  const originalTags = tags;
@@ -2354,7 +2530,9 @@ function useScriptBreakdownScene(options) {
2354
2530
  category_id: "CAST",
2355
2531
  name: charName,
2356
2532
  start_index: startIndex,
2357
- end_index: startIndex + charName.length
2533
+ end_index: startIndex + charName.length,
2534
+ look: "",
2535
+ age: ""
2358
2536
  });
2359
2537
  }
2360
2538
  }
@@ -2567,6 +2745,12 @@ function useScriptBreakdownScene(options) {
2567
2745
  start_index: selectionMenu.startIndex,
2568
2746
  end_index: selectionMenu.endIndex
2569
2747
  };
2748
+ if (categoryId === "PROP" || categoryId === "SET_PROP") {
2749
+ newTag.quantity = 1;
2750
+ } else if (categoryId === "CAST") {
2751
+ newTag.look = "";
2752
+ newTag.age = "";
2753
+ }
2570
2754
  setTags((prev) => {
2571
2755
  const filtered = prev.filter(
2572
2756
  (t) => t.block_id !== newTag.block_id || !(newTag.end_index > t.start_index && newTag.start_index < t.end_index)
@@ -2596,22 +2780,36 @@ function useScriptBreakdownScene(options) {
2596
2780
  setTags((prev) => [...prev, tagToRemove]);
2597
2781
  }
2598
2782
  };
2599
- const updateTag = async (id, categoryId) => {
2600
- var _a;
2783
+ const updateTag = async (id, categoryId, details) => {
2784
+ var _a, _b, _c, _d;
2601
2785
  const tagToUpdate = tags.find((t) => t.id === id);
2602
2786
  if (!tagToUpdate) return;
2787
+ const updatedFields = __spreadValues({}, details);
2788
+ if (categoryId) {
2789
+ updatedFields.category_id = categoryId;
2790
+ if (categoryId === "PROP" || categoryId === "SET_PROP") {
2791
+ updatedFields.quantity = (_a = tagToUpdate.quantity) != null ? _a : 1;
2792
+ } else if (categoryId === "CAST") {
2793
+ updatedFields.look = (_b = tagToUpdate.look) != null ? _b : "";
2794
+ updatedFields.age = (_c = tagToUpdate.age) != null ? _c : "";
2795
+ }
2796
+ }
2603
2797
  setTags(
2604
- (prev) => prev.map((t) => t.id === id ? __spreadProps(__spreadValues({}, t), { category_id: categoryId }) : t)
2798
+ (prev) => prev.map((t) => {
2799
+ if (t.id === id) return __spreadValues(__spreadValues({}, t), updatedFields);
2800
+ if (details && t.name === tagToUpdate.name && t.category_id === tagToUpdate.category_id) {
2801
+ return __spreadValues(__spreadValues({}, t), details);
2802
+ }
2803
+ return t;
2804
+ })
2605
2805
  );
2606
- clearSelection();
2806
+ if (categoryId) clearSelection();
2607
2807
  try {
2608
- await ((_a = options.onTagUpdated) == null ? void 0 : _a.call(options, id, categoryId));
2808
+ await ((_d = options.onTagUpdated) == null ? void 0 : _d.call(options, id, categoryId || null, details));
2609
2809
  } catch (error2) {
2610
2810
  console.error("Failed to update tag:", error2);
2611
2811
  setTags(
2612
- (prev) => prev.map(
2613
- (t) => t.id === id ? __spreadProps(__spreadValues({}, t), { category_id: tagToUpdate.category_id }) : t
2614
- )
2812
+ (prev) => prev.map((t) => t.id === id ? tagToUpdate : t)
2615
2813
  );
2616
2814
  }
2617
2815
  };