@vishu1301/script-writing 1.6.1 → 1.6.3

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,5 +1,5 @@
1
1
  import React4, { useState, useRef, useEffect, useMemo, useCallback } from 'react';
2
- import { ArrowRight, User, ChevronRight, Sparkles, Check, Users, Box, Shirt, Car, Armchair, UserPlus, MapPin, Map as Map$1, MessageCircle, Parentheses, Clapperboard, Mountain, Loader2, Save, Lock, Unlock, Cog, Upload, FileDown, Languages, Keyboard, AlignLeft, Tags, ChevronDown, X, Video, Settings2, Eye, Pencil, BookOpen, Search, Zap, Info, Frame, BookText, AsteriskIcon, Target, Activity, MonitorPlay, Crosshair, Clock, Camera, Aperture, SlidersHorizontal, Sun, Wand2, Volume2, Layers } from 'lucide-react';
2
+ import { ArrowRight, User, ChevronRight, Sparkles, Check, Users, Box, Shirt, Car, Armchair, UserPlus, MapPin, Map as Map$1, MessageCircle, Parentheses, Clapperboard, Mountain, Loader2, Save, Lock, Unlock, Cog, Upload, FileDown, Languages, Keyboard, AlignLeft, Tags, X, ChevronDown, Video, Settings2, Eye, Pencil, BookOpen, Search, Zap, Info, Frame, BookText, AsteriskIcon, Target, Activity, MonitorPlay, Crosshair, Clock, Camera, Aperture, SlidersHorizontal, Sun, Wand2, Volume2, Layers } from 'lucide-react';
3
3
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
4
4
  import * as pdfjs from 'pdfjs-dist';
5
5
  import jsPDF from 'jspdf';
@@ -3086,6 +3086,9 @@ function useScreenplayEditor(options) {
3086
3086
  }
3087
3087
  }
3088
3088
  }
3089
+ if (onSaveRef.current && !isInitialLoad) {
3090
+ onSaveRef.current(finalizedBlocks);
3091
+ }
3089
3092
  setTimeout(() => {
3090
3093
  var _a2;
3091
3094
  const firstId = parsedBlocks[0].id;
@@ -4286,12 +4289,12 @@ function ScriptBreakdownSceneView({
4286
4289
  ))
4287
4290
  }
4288
4291
  ),
4289
- /* @__PURE__ */ 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: [
4290
- /* @__PURE__ */ jsxs("h3", { className: "text-xs font-extrabold text-slate-800 uppercase tracking-[0.25em] mb-6 flex items-center gap-3 font-sans", children: [
4291
- /* @__PURE__ */ 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__ */ jsx(AlignLeft, { className: "w-3.5 h-3.5 text-slate-500" }) }),
4292
+ /* @__PURE__ */ jsxs("div", { className: "relative bg-[#fdfdfc] shadow-2xl shadow-zinc-300/50 border border-zinc-100/80 rounded-sm md:rounded-md flex flex-col w-[210mm] shrink-0 p-8 md:p-12 lg:p-16", children: [
4293
+ /* @__PURE__ */ jsxs("h3", { className: "text-xs font-bold text-blumine-800 uppercase tracking-widest mb-6 flex items-center gap-3 font-sans", children: [
4294
+ /* @__PURE__ */ jsx("span", { className: "flex items-center justify-center w-8 h-8 rounded-xl bg-gradient-to-b from-white to-blumine-50/60 shadow-inner border border-blumine-200/50 text-blumine-600", children: /* @__PURE__ */ jsx(AlignLeft, { className: "w-4 h-4" }) }),
4292
4295
  "Scene Brief"
4293
4296
  ] }),
4294
- /* @__PURE__ */ 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: [
4297
+ /* @__PURE__ */ jsxs("div", { className: "relative bg-zinc-50/30 border border-zinc-200/50 rounded-xl p-4 md:p-6 shadow-[inset_0_1.5px_3px_rgba(0,0,0,0.02)] focus-within:bg-white focus-within:border-blumine-300/70 focus-within:shadow-[0_8px_30px_rgba(16,43,60,0.03)] transition-all duration-300", children: [
4295
4298
  /* @__PURE__ */ jsx(
4296
4299
  "textarea",
4297
4300
  {
@@ -4309,7 +4312,7 @@ function ScriptBreakdownSceneView({
4309
4312
  {
4310
4313
  onClick: onUpdateBrief,
4311
4314
  disabled: !sceneBrief || sceneBrief.trim() === "",
4312
- 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",
4315
+ className: "rounded-xl bg-gradient-to-b from-blumine-500 to-blumine-600 px-6 py-2.5 text-[13px] font-bold text-white shadow-md shadow-blumine-500/10 transition-all hover:from-blumine-600 hover:to-blumine-700 active:scale-95 disabled:from-zinc-100 disabled:to-zinc-200 disabled:text-zinc-400 disabled:border-zinc-200/50 disabled:shadow-none disabled:cursor-not-allowed cursor-pointer",
4313
4316
  children: "Update"
4314
4317
  }
4315
4318
  ) })
@@ -4320,41 +4323,54 @@ function ScriptBreakdownSceneView({
4320
4323
  "button",
4321
4324
  {
4322
4325
  onClick: () => setIsSidebarOpen(true),
4323
- 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",
4326
+ className: "fixed bottom-6 right-6 z-40 flex h-14 w-14 items-center justify-center rounded-full bg-gradient-to-b from-blumine-500 to-blumine-600 text-white shadow-[0_8px_30px_rgba(32,146,186,0.35)] transition-all duration-200 hover:scale-105 active:scale-95 hover:shadow-[0_10px_35px_rgba(32,146,186,0.45)] xl:hidden border border-white/10",
4324
4327
  children: [
4325
- /* @__PURE__ */ jsx(Tags, { className: "h-6 w-6" }),
4326
- tags.length > 0 && /* @__PURE__ */ 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 })
4328
+ /* @__PURE__ */ jsx(Tags, { className: "h-5.5 w-5.5", strokeWidth: 2 }),
4329
+ tags.length > 0 && /* @__PURE__ */ 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-md border-2 border-white animate-pulse", children: tags.length })
4327
4330
  ]
4328
4331
  }
4329
4332
  ),
4330
4333
  isSidebarOpen && /* @__PURE__ */ jsx(
4331
4334
  "div",
4332
4335
  {
4333
- className: "fixed inset-0 z-40 bg-slate-900/20 backdrop-blur-sm transition-opacity xl:hidden",
4336
+ className: "fixed inset-0 z-40 bg-blumine-950/20 backdrop-blur-xs transition-all duration-300 xl:hidden",
4334
4337
  onClick: () => setIsSidebarOpen(false)
4335
4338
  }
4336
4339
  ),
4337
4340
  /* @__PURE__ */ jsx(
4338
4341
  "div",
4339
4342
  {
4340
- 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"}`,
4341
- children: /* @__PURE__ */ 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: [
4342
- !aiSummarized && /* @__PURE__ */ jsx(
4343
+ className: `fixed xl:absolute top-0 right-0 z-50 h-full w-80 transform transition-transform duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] xl:translate-x-0 ${isSidebarOpen ? "translate-x-0 shadow-[-10px_0_40px_rgba(16,43,60,0.08)]" : "translate-x-full"}`,
4344
+ children: /* @__PURE__ */ jsxs("div", { className: "sticky top-0 flex h-[100dvh] max-h-screen w-full flex-col border-l border-blumine-100/50 bg-white/95 backdrop-blur-xl p-4 py-6", children: [
4345
+ !aiSummarized && /* @__PURE__ */ jsx("div", { className: "mb-4 shrink-0 flex justify-center", children: /* @__PURE__ */ jsx(
4343
4346
  summarize_button_default,
4344
4347
  {
4345
4348
  isSummarizing,
4346
4349
  onSummarize
4347
4350
  }
4348
- ),
4349
- /* @__PURE__ */ jsxs("div", { className: "relative flex flex-col gap-3 py-5 my-5 border-t border-t-[#eefafd] flex-1 overflow-hidden", children: [
4350
- /* @__PURE__ */ jsxs("div", { className: "relative flex items-center justify-between mb-6 shrink-0", children: [
4351
+ ) }),
4352
+ /* @__PURE__ */ jsxs("div", { className: "relative flex flex-col gap-3 py-4 border-t border-blumine-100/40 flex-1 overflow-hidden", children: [
4353
+ /* @__PURE__ */ jsxs("div", { className: "relative flex items-center justify-between mb-4 shrink-0 px-1", children: [
4351
4354
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
4352
- /* @__PURE__ */ 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__ */ jsx(Tags, { className: "h-4 w-4 text-[#15607b]" }) }),
4353
- /* @__PURE__ */ jsx("h3", { className: "text-[12px] font-semibold uppercase tracking-[0.28em] text-[#134a61]", children: "Breakdown" })
4355
+ /* @__PURE__ */ jsx("div", { className: "relative flex h-10 w-10 items-center justify-center rounded-xl border border-blumine-200/60 bg-gradient-to-b from-white to-blumine-50/50 shadow-inner", children: /* @__PURE__ */ jsx(Tags, { className: "h-5 w-5 text-blumine-600", strokeWidth: 1.5 }) }),
4356
+ /* @__PURE__ */ jsxs("div", { children: [
4357
+ /* @__PURE__ */ jsx("h3", { className: "text-[14px] font-bold uppercase tracking-wider text-blumine-800 leading-none", children: "Breakdown" }),
4358
+ /* @__PURE__ */ jsx("p", { className: "text-[11px] text-blumine-400 mt-1 font-medium", children: "Scene element tags" })
4359
+ ] })
4354
4360
  ] }),
4355
- /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ 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 }) })
4361
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
4362
+ /* @__PURE__ */ jsx("span", { className: "rounded-full border border-blumine-200/50 bg-blumine-50/80 px-2.5 py-0.5 text-[11px] font-bold text-blumine-700 shadow-sm", children: tags.length }),
4363
+ /* @__PURE__ */ jsx(
4364
+ "button",
4365
+ {
4366
+ onClick: () => setIsSidebarOpen(false),
4367
+ className: "flex xl:hidden h-8 w-8 items-center justify-center rounded-lg text-blumine-400 hover:bg-blumine-100 hover:text-blumine-700 transition duration-150 active:scale-95",
4368
+ children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
4369
+ }
4370
+ )
4371
+ ] })
4356
4372
  ] }),
4357
- /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4 overflow-y-auto overflow-x-hidden pb-4 pr-1 custom-scrollbar", children: CATEGORIES.map((cat) => {
4373
+ /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-3.5 overflow-y-auto overflow-x-hidden pb-4 pr-1 custom-scrollbar", children: CATEGORIES.map((cat) => {
4358
4374
  const catTags = tags.filter((t) => t.category_id === cat.id);
4359
4375
  if (!catTags.length) return null;
4360
4376
  const isExpanded = expandedCategories[cat.id];
@@ -4365,114 +4381,145 @@ function ScriptBreakdownSceneView({
4365
4381
  );
4366
4382
  return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
4367
4383
  /* @__PURE__ */ jsxs(
4368
- "div",
4384
+ "button",
4369
4385
  {
4370
4386
  onClick: () => setExpandedCategories((prev) => ({
4371
4387
  [cat.id]: !prev[cat.id]
4372
4388
  })),
4373
- 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]",
4389
+ className: "w-full group relative flex cursor-pointer items-center gap-3 overflow-hidden rounded-2xl border px-4 py-3 transition-all duration-300 hover:-translate-y-[1px] hover:shadow-md active:scale-[0.98] text-left outline-none",
4374
4390
  style: {
4375
- background: `linear-gradient(135deg, rgba(255,255,255,0.92), ${cat.hex}18)`,
4376
- boxShadow: `0 16px 36px ${cat.hex}14, inset 0 1px 0 rgba(255,255,255,0.9)`,
4377
- border: `1px solid ${cat.hex}50`
4391
+ borderColor: `${cat.color}25`,
4392
+ background: `linear-gradient(135deg, #ffffff, ${cat.color}08)`
4378
4393
  },
4379
4394
  children: [
4380
4395
  /* @__PURE__ */ jsx(
4381
4396
  "div",
4382
4397
  {
4383
- className: "absolute inset-0 opacity-0 transition-opacity duration-300 group-hover:opacity-100",
4398
+ className: "absolute inset-0 opacity-0 group-hover:opacity-100 transition-opacity duration-300 pointer-events-none",
4384
4399
  style: {
4385
- background: `radial-gradient(circle at 15% 20%, ${cat.hex}24, transparent 38%)`
4400
+ background: `radial-gradient(circle at 12% 50%, ${cat.color}15, transparent 40%)`
4386
4401
  }
4387
4402
  }
4388
4403
  ),
4389
4404
  /* @__PURE__ */ jsx(
4390
4405
  "div",
4391
4406
  {
4392
- className: "relative flex h-9 w-9 shrink-0 items-center justify-center rounded-xl border border-white/70 backdrop-blur-md",
4407
+ className: "relative flex h-8 w-8 shrink-0 items-center justify-center rounded-xl border border-white/80 shadow-inner transition-transform duration-300 group-hover:scale-105",
4393
4408
  style: {
4394
- background: `linear-gradient(135deg, ${cat.color}22, rgba(255,255,255,0.75))`,
4395
- boxShadow: `0 10px 22px ${cat.color}14`
4409
+ background: `linear-gradient(135deg, ${cat.color}12, ${cat.color}05)`,
4410
+ borderColor: `${cat.color}20`
4396
4411
  },
4397
- children: /* @__PURE__ */ jsx(cat.icon, { className: "h-4 w-4", color: cat.color })
4412
+ children: /* @__PURE__ */ jsx(cat.icon, { className: "h-4 w-4", style: { color: cat.color } })
4398
4413
  }
4399
4414
  ),
4400
4415
  /* @__PURE__ */ jsx(
4401
4416
  "span",
4402
4417
  {
4403
- className: "relative text-[13px] font-semibold tracking-[0.01em]",
4418
+ className: "relative text-xs font-bold tracking-wide transition-colors duration-200",
4404
4419
  style: { color: cat.color },
4405
4420
  children: cat.label
4406
4421
  }
4407
4422
  ),
4408
- /* @__PURE__ */ 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 }),
4409
- /* @__PURE__ */ jsx(
4410
- ChevronDown,
4411
- {
4412
- className: `relative h-4 w-4 transition-transform duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "rotate-180" : ""}`,
4413
- style: { color: cat.color }
4414
- }
4415
- )
4423
+ /* @__PURE__ */ jsxs("div", { className: "ml-auto flex items-center gap-1.5 relative", children: [
4424
+ /* @__PURE__ */ jsx(
4425
+ "span",
4426
+ {
4427
+ className: "rounded-full px-2 py-0.5 text-[10px] font-bold transition-all duration-200",
4428
+ style: {
4429
+ color: cat.color,
4430
+ backgroundColor: `${cat.color}10`,
4431
+ border: `1px solid ${cat.color}15`
4432
+ },
4433
+ children: catTags.length
4434
+ }
4435
+ ),
4436
+ /* @__PURE__ */ jsx(
4437
+ ChevronDown,
4438
+ {
4439
+ className: `h-3.5 w-3.5 transition-transform duration-300 ease-[cubic-bezier(0.2,0,0,1)] ${isExpanded ? "rotate-180" : ""}`,
4440
+ style: { color: cat.color },
4441
+ strokeWidth: 2.5
4442
+ }
4443
+ )
4444
+ ] })
4416
4445
  ]
4417
4446
  }
4418
4447
  ),
4419
4448
  /* @__PURE__ */ jsx(
4420
4449
  "div",
4421
4450
  {
4422
- 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"}`,
4423
- children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-wrap justify-start gap-2 py-2", children: uniqueTags.map((tag, index) => /* @__PURE__ */ jsx(
4451
+ className: `grid transition-all duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "grid-rows-[1fr] opacity-100 mt-2.5" : "grid-rows-[0fr] opacity-0"}`,
4452
+ children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx(
4424
4453
  "div",
4425
4454
  {
4426
- className: "relative flex flex-col items-start",
4427
- children: /* @__PURE__ */ jsxs(
4428
- "span",
4455
+ className: "flex flex-wrap justify-start gap-2 py-2 pl-3 border-l ml-4",
4456
+ style: { borderColor: `${cat.color}18` },
4457
+ children: uniqueTags.map((tag, index) => /* @__PURE__ */ jsx(
4458
+ "div",
4429
4459
  {
4430
- title: tag.name,
4431
- onClick: (e) => {
4432
- e.stopPropagation();
4433
- if (cat.id !== "PROP" && cat.id !== "SET_PROP" && cat.id !== "CAST" && cat.id !== "EXTRA")
4434
- return;
4435
- if ((editingTagData == null ? void 0 : editingTagData.tag.id) === tag.id) {
4436
- setEditingTagData(null);
4437
- } else {
4438
- const rect = e.currentTarget.getBoundingClientRect();
4439
- setPopupPlacement({
4440
- alignRight: rect.left > window.innerWidth - 240,
4441
- alignBottom: rect.bottom > window.innerHeight - 250
4442
- });
4443
- setTagForm({
4444
- quantity: tag.quantity || 1,
4445
- look: tag.look || "",
4446
- age: tag.age || "",
4447
- age_range: tag.age_range || [],
4448
- crowd_type: tag.crowd_type || []
4449
- });
4450
- setEditingTagData({
4451
- tag,
4452
- catId: cat.id,
4453
- catColor: cat.color,
4454
- rect
4455
- });
4460
+ className: "relative flex flex-col items-start max-w-full",
4461
+ children: /* @__PURE__ */ jsxs(
4462
+ "span",
4463
+ {
4464
+ title: tag.name,
4465
+ onClick: (e) => {
4466
+ e.stopPropagation();
4467
+ if (cat.id !== "PROP" && cat.id !== "SET_PROP" && cat.id !== "CAST" && cat.id !== "EXTRA")
4468
+ return;
4469
+ if ((editingTagData == null ? void 0 : editingTagData.tag.id) === tag.id) {
4470
+ setEditingTagData(null);
4471
+ } else {
4472
+ const rect = e.currentTarget.getBoundingClientRect();
4473
+ setPopupPlacement({
4474
+ alignRight: rect.left > window.innerWidth - 240,
4475
+ alignBottom: rect.bottom > window.innerHeight - 250
4476
+ });
4477
+ setTagForm({
4478
+ quantity: tag.quantity || 1,
4479
+ look: tag.look || "",
4480
+ age: tag.age || "",
4481
+ age_range: tag.age_range || [],
4482
+ crowd_type: tag.crowd_type || []
4483
+ });
4484
+ setEditingTagData({
4485
+ tag,
4486
+ catId: cat.id,
4487
+ catColor: cat.color,
4488
+ rect
4489
+ });
4490
+ }
4491
+ },
4492
+ className: `inline-block max-w-full truncate text-[11px] font-bold px-3 py-1.5 rounded-full border transition-all duration-200 select-none ${cat.id === "PROP" || cat.id === "SET_PROP" || cat.id === "CAST" || cat.id === "EXTRA" ? "cursor-pointer hover:scale-[1.03] hover:shadow-sm" : "cursor-default"}`,
4493
+ style: {
4494
+ color: cat.color,
4495
+ background: `linear-gradient(135deg, ${cat.color}08, ${cat.color}03)`,
4496
+ borderColor: `${cat.color}18`
4497
+ },
4498
+ children: [
4499
+ tag.name,
4500
+ (cat.id === "PROP" || cat.id === "SET_PROP") && tag.quantity && tag.quantity > 1 ? /* @__PURE__ */ jsxs(
4501
+ "span",
4502
+ {
4503
+ className: "ml-1.5 font-extrabold px-1 py-0.5 rounded text-[9px] border inline-block",
4504
+ style: {
4505
+ color: cat.color,
4506
+ backgroundColor: `${cat.color}10`,
4507
+ borderColor: `${cat.color}15`
4508
+ },
4509
+ children: [
4510
+ "x",
4511
+ tag.quantity
4512
+ ]
4513
+ }
4514
+ ) : null
4515
+ ]
4456
4516
  }
4457
- },
4458
- 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 cursor-pointer! ${cat.id === "PROP" || cat.id === "SET_PROP" || cat.id === "CAST" ? "cursor-pointer hover:scale-105 shadow-sm" : ""}`,
4459
- style: {
4460
- color: cat.color,
4461
- background: `linear-gradient(145deg, ${cat.color}18, rgba(255,255,255,0.88))`,
4462
- borderColor: `${cat.color}28`
4463
- },
4464
- children: [
4465
- tag.name,
4466
- (cat.id === "PROP" || cat.id === "SET_PROP") && tag.quantity && tag.quantity > 1 ? /* @__PURE__ */ jsxs("span", { className: "ml-1.5 opacity-80 font-bold", children: [
4467
- "x",
4468
- tag.quantity
4469
- ] }) : null
4470
- ]
4471
- }
4472
- )
4473
- },
4474
- index
4475
- )) }) })
4517
+ )
4518
+ },
4519
+ index
4520
+ ))
4521
+ }
4522
+ ) })
4476
4523
  }
4477
4524
  )
4478
4525
  ] }, cat.id);
@@ -4486,7 +4533,7 @@ function ScriptBreakdownSceneView({
4486
4533
  /* @__PURE__ */ jsx(
4487
4534
  "div",
4488
4535
  {
4489
- className: "fixed inset-0 z-[100]",
4536
+ className: "fixed inset-0 z-[100] bg-blumine-950/5 backdrop-blur-[1px]",
4490
4537
  onClick: (e) => {
4491
4538
  e.stopPropagation();
4492
4539
  setEditingTagData(null);
@@ -4496,7 +4543,7 @@ function ScriptBreakdownSceneView({
4496
4543
  /* @__PURE__ */ jsxs(
4497
4544
  "div",
4498
4545
  {
4499
- 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`,
4546
+ className: `p-3.5 bg-white/90 backdrop-blur-2xl rounded-[1.25rem] shadow-[0_10px_40px_rgba(16,43,60,0.12)] border border-blumine-100/40 z-[101] w-56 animate-in fade-in zoom-in-95 duration-200 ease-out fixed`,
4500
4547
  style: {
4501
4548
  top: popupPlacement.alignBottom ? "auto" : editingTagData.rect.bottom + 8,
4502
4549
  bottom: popupPlacement.alignBottom ? window.innerHeight - editingTagData.rect.top + 8 : "auto",
@@ -4505,19 +4552,19 @@ function ScriptBreakdownSceneView({
4505
4552
  },
4506
4553
  onClick: (e) => e.stopPropagation(),
4507
4554
  children: [
4508
- /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center mb-3 border-b border-slate-100 pb-2.5", children: [
4509
- /* @__PURE__ */ jsx("span", { className: "text-[10px] font-extrabold text-slate-400 uppercase tracking-widest drop-shadow-sm", children: "Details" }),
4555
+ /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center mb-3 border-b border-blumine-100/30 pb-2.5", children: [
4556
+ /* @__PURE__ */ jsx("span", { className: "text-[10px] font-extrabold text-blumine-400 uppercase tracking-widest drop-shadow-sm", children: "Details" }),
4510
4557
  /* @__PURE__ */ jsx(
4511
4558
  "button",
4512
4559
  {
4513
4560
  onClick: () => setEditingTagData(null),
4514
- className: "hover:bg-slate-100/80 p-1.5 rounded-full transition-colors active:scale-95",
4515
- children: /* @__PURE__ */ jsx(X, { className: "w-3.5 h-3.5 text-slate-500" })
4561
+ className: "hover:bg-blumine-100/40 p-1.5 rounded-full transition-colors active:scale-95 text-blumine-500",
4562
+ children: /* @__PURE__ */ jsx(X, { className: "w-3.5 h-3.5" })
4516
4563
  }
4517
4564
  )
4518
4565
  ] }),
4519
4566
  (editingTagData.catId === "PROP" || editingTagData.catId === "SET_PROP") && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
4520
- /* @__PURE__ */ jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Quantity" }),
4567
+ /* @__PURE__ */ jsx("label", { className: "text-[11px] font-bold text-blumine-700 ml-1", children: "Quantity" }),
4521
4568
  /* @__PURE__ */ jsx(
4522
4569
  "input",
4523
4570
  {
@@ -4530,13 +4577,13 @@ function ScriptBreakdownSceneView({
4530
4577
  quantity: val
4531
4578
  }));
4532
4579
  },
4533
- 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"
4580
+ className: "w-full text-[13px] px-3 py-2 rounded-xl border border-blumine-100 bg-zinc-50/30 outline-none focus:border-blumine-400 focus:bg-white focus:ring-2 focus:ring-blumine-500/10 transition-all font-semibold text-blumine-800"
4534
4581
  }
4535
4582
  )
4536
4583
  ] }),
4537
4584
  editingTagData.catId === "CAST" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
4538
4585
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
4539
- /* @__PURE__ */ jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Look" }),
4586
+ /* @__PURE__ */ jsx("label", { className: "text-[11px] font-bold text-blumine-700 ml-1", children: "Look" }),
4540
4587
  /* @__PURE__ */ jsx(
4541
4588
  "input",
4542
4589
  {
@@ -4548,12 +4595,12 @@ function ScriptBreakdownSceneView({
4548
4595
  look: e.target.value
4549
4596
  }));
4550
4597
  },
4551
- 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"
4598
+ className: "w-full text-[13px] px-3 py-2 rounded-xl border border-blumine-100 bg-zinc-50/30 outline-none focus:border-blumine-400 focus:bg-white focus:ring-2 focus:ring-blumine-500/10 transition-all font-semibold text-blumine-800 placeholder:text-blumine-300 placeholder:font-normal"
4552
4599
  }
4553
4600
  )
4554
4601
  ] }),
4555
4602
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
4556
- /* @__PURE__ */ jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Age" }),
4603
+ /* @__PURE__ */ jsx("label", { className: "text-[11px] font-bold text-blumine-700 ml-1", children: "Age" }),
4557
4604
  /* @__PURE__ */ jsx(
4558
4605
  "input",
4559
4606
  {
@@ -4574,7 +4621,7 @@ function ScriptBreakdownSceneView({
4574
4621
  age: val.toString()
4575
4622
  }));
4576
4623
  },
4577
- 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"
4624
+ className: "w-full text-[13px] px-3 py-2 rounded-xl border border-blumine-100 bg-zinc-50/30 outline-none focus:border-blumine-400 focus:bg-white focus:ring-2 focus:ring-blumine-500/10 transition-all font-semibold text-blumine-800"
4578
4625
  }
4579
4626
  )
4580
4627
  ] })
@@ -4614,7 +4661,7 @@ function ScriptBreakdownSceneView({
4614
4661
  }
4615
4662
  setEditingTagData(null);
4616
4663
  },
4617
- 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]",
4664
+ className: "w-full bg-gradient-to-b from-blumine-500 to-blumine-600 hover:from-blumine-600 hover:to-blumine-700 text-white text-[12px] font-bold py-2.5 rounded-xl transition-all shadow-[0_4px_12px_rgba(32,146,186,0.2)] hover:shadow-[0_6px_16px_rgba(32,146,186,0.3)] active:scale-[0.98]",
4618
4665
  children: "Update Details"
4619
4666
  }
4620
4667
  ) })
@@ -4697,72 +4744,80 @@ function useScriptBreakdownScene(options) {
4697
4744
  }, [blocks]);
4698
4745
  const handleAISummarize = async () => {
4699
4746
  var _a;
4747
+ if (!scene || !scene.content) {
4748
+ console.error("Cannot summarize scene: Scene data is not loaded yet.");
4749
+ return;
4750
+ }
4700
4751
  setIsSummarizing(true);
4701
- const res = await ((_a = options.onAISummarize) == null ? void 0 : _a.call(options, scene.content));
4702
- if (res.ok) {
4703
- const data = await res.json();
4704
- setIsSummarizing(false);
4705
- let parsedData = [];
4706
- let parsedSummaryData = {};
4707
- try {
4708
- const normalData = JSON.parse(data.data);
4709
- if (Array.isArray(normalData)) {
4710
- parsedData = Array.isArray(normalData[0]) ? normalData[0] : [];
4711
- const summary = Array.isArray(normalData[1]) ? normalData[1] : [];
4712
- parsedSummaryData = summary[0] || {};
4713
- }
4714
- } catch (error2) {
4715
- console.error("Error parsing AI summary data:", error2);
4716
- }
4717
- setSceneBrief(parsedSummaryData.summarise || "");
4718
- const newTags = [];
4719
- parsedData.forEach((aiTag) => {
4720
- if (!aiTag.block_id || !aiTag.category_id || typeof aiTag.start_index !== "number" || typeof aiTag.end_index !== "number") {
4721
- return;
4722
- }
4723
- const newTag = {
4724
- id: aiTag.id || uuid(),
4725
- block_id: String(aiTag.block_id).startsWith("par") ? String(aiTag.block_id).substring(3) : String(aiTag.block_id),
4726
- category_id: aiTag.category_id,
4727
- name: aiTag.name,
4728
- start_index: aiTag.start_index,
4729
- end_index: aiTag.end_index
4730
- };
4731
- if (aiTag.category_id === "PROP" || aiTag.category_id === "SET_PROP") {
4732
- newTag.quantity = 1;
4733
- } else if (aiTag.category_id === "CAST") {
4734
- newTag.look = "";
4735
- newTag.age = "";
4736
- }
4737
- newTags.push(newTag);
4738
- });
4739
- if (newTags.length > 0) {
4740
- const originalTags = tags;
4741
- setTags((prev) => {
4742
- const merged = [...prev];
4743
- newTags.forEach((newTag) => {
4744
- const isOverlapping = merged.some(
4745
- (t) => t.block_id === newTag.block_id && newTag.end_index > t.start_index && newTag.start_index < t.end_index
4746
- );
4747
- if (!isOverlapping) {
4748
- merged.push(newTag);
4749
- }
4750
- });
4751
- return merged;
4752
- });
4752
+ try {
4753
+ const res = await ((_a = options.onAISummarize) == null ? void 0 : _a.call(options, scene.content));
4754
+ if (res && res.ok) {
4755
+ const data = await res.json();
4756
+ let parsedData = [];
4757
+ let parsedSummaryData = {};
4753
4758
  try {
4754
- if (options.onTagsBulkAdded) {
4755
- await options.onTagsBulkAdded(newTags, parsedSummaryData.summarise);
4759
+ const normalData = JSON.parse(data.data);
4760
+ if (Array.isArray(normalData)) {
4761
+ parsedData = Array.isArray(normalData[0]) ? normalData[0] : [];
4762
+ const summary = Array.isArray(normalData[1]) ? normalData[1] : [];
4763
+ parsedSummaryData = summary[0] || {};
4756
4764
  }
4757
4765
  } catch (error2) {
4758
- console.error("Failed to bulk add AI-generated tags:", error2);
4759
- setTags(originalTags);
4766
+ console.error("Error parsing AI summary data:", error2);
4760
4767
  }
4768
+ setSceneBrief(parsedSummaryData.summarise || "");
4769
+ const newTags = [];
4770
+ parsedData.forEach((aiTag) => {
4771
+ if (!aiTag.block_id || !aiTag.category_id || typeof aiTag.start_index !== "number" || typeof aiTag.end_index !== "number") {
4772
+ return;
4773
+ }
4774
+ const newTag = {
4775
+ id: aiTag.id || uuid(),
4776
+ block_id: String(aiTag.block_id).startsWith("par") ? String(aiTag.block_id).substring(3) : String(aiTag.block_id),
4777
+ category_id: aiTag.category_id,
4778
+ name: aiTag.name,
4779
+ start_index: aiTag.start_index,
4780
+ end_index: aiTag.end_index
4781
+ };
4782
+ if (aiTag.category_id === "PROP" || aiTag.category_id === "SET_PROP") {
4783
+ newTag.quantity = 1;
4784
+ } else if (aiTag.category_id === "CAST") {
4785
+ newTag.look = "";
4786
+ newTag.age = "";
4787
+ }
4788
+ newTags.push(newTag);
4789
+ });
4790
+ if (newTags.length > 0) {
4791
+ const originalTags = tags;
4792
+ setTags((prev) => {
4793
+ const merged = [...prev];
4794
+ newTags.forEach((newTag) => {
4795
+ const isOverlapping = merged.some(
4796
+ (t) => t.block_id === newTag.block_id && newTag.end_index > t.start_index && newTag.start_index < t.end_index
4797
+ );
4798
+ if (!isOverlapping) {
4799
+ merged.push(newTag);
4800
+ }
4801
+ });
4802
+ return merged;
4803
+ });
4804
+ try {
4805
+ if (options.onTagsBulkAdded) {
4806
+ await options.onTagsBulkAdded(newTags, parsedSummaryData.summarise);
4807
+ }
4808
+ } catch (error2) {
4809
+ console.error("Failed to bulk add AI-generated tags:", error2);
4810
+ setTags(originalTags);
4811
+ }
4812
+ }
4813
+ return data;
4814
+ } else {
4815
+ console.error("Failed to summarize scene:", res);
4761
4816
  }
4762
- return data;
4763
- } else {
4817
+ } catch (error2) {
4818
+ console.error("An error occurred during scene summarization:", error2);
4819
+ } finally {
4764
4820
  setIsSummarizing(false);
4765
- console.error("Failed to summarize scene:", res);
4766
4821
  }
4767
4822
  };
4768
4823
  const bulkCreateTags = useCallback(async () => {
@@ -6383,39 +6438,39 @@ function ShotBreakdownView({
6383
6438
  "button",
6384
6439
  {
6385
6440
  onClick: () => setIsSidebarOpen(true),
6386
- 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",
6441
+ className: "fixed bottom-6 right-6 z-40 flex h-14 w-14 items-center justify-center rounded-full bg-gradient-to-b from-blumine-500 to-blumine-600 text-white shadow-[0_8px_30px_rgba(32,146,186,0.35)] transition-all duration-200 hover:scale-105 active:scale-95 hover:shadow-[0_10px_35px_rgba(32,146,186,0.45)] xl:hidden border border-white/10",
6387
6442
  children: [
6388
- /* @__PURE__ */ jsx(Video, { className: "h-6 w-6" }),
6389
- shots.length > 0 && /* @__PURE__ */ 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: shots.length })
6443
+ /* @__PURE__ */ jsx(Video, { className: "h-5.5 w-5.5", strokeWidth: 2 }),
6444
+ shots.length > 0 && /* @__PURE__ */ 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-md border-2 border-white animate-pulse", children: shots.length })
6390
6445
  ]
6391
6446
  }
6392
6447
  ),
6393
6448
  isSidebarOpen && /* @__PURE__ */ jsx(
6394
6449
  "div",
6395
6450
  {
6396
- className: "fixed inset-0 z-40 bg-slate-900/20 backdrop-blur-sm transition-opacity xl:hidden",
6451
+ className: "fixed inset-0 z-40 bg-blumine-950/20 backdrop-blur-xs transition-all duration-300 xl:hidden",
6397
6452
  onClick: () => setIsSidebarOpen(false)
6398
6453
  }
6399
6454
  ),
6400
6455
  /* @__PURE__ */ jsx(
6401
6456
  "div",
6402
6457
  {
6403
- 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"}`,
6404
- children: /* @__PURE__ */ 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: [
6405
- !aiSummarized && /* @__PURE__ */ jsx(
6458
+ className: `fixed xl:absolute top-0 right-0 z-50 h-full w-80 transform transition-transform duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] xl:translate-x-0 ${isSidebarOpen ? "translate-x-0 shadow-[-10px_0_40px_rgba(16,43,60,0.08)]" : "translate-x-full"}`,
6459
+ children: /* @__PURE__ */ jsxs("div", { className: "sticky top-0 flex h-[100dvh] max-h-screen w-full flex-col border-l border-blumine-100/50 bg-white/95 backdrop-blur-xl p-4 py-6", children: [
6460
+ !aiSummarized && /* @__PURE__ */ jsx("div", { className: "mb-4 shrink-0 flex justify-center", children: /* @__PURE__ */ jsx(
6406
6461
  summarize_button_default,
6407
6462
  {
6408
6463
  onSummarize: handleAISummarize,
6409
6464
  isSummarizing
6410
6465
  }
6411
- ),
6412
- /* @__PURE__ */ jsxs("div", { className: "relative flex flex-col gap-3 py-5 my-5 border-t border-t-[#eefafd] flex-1 overflow-hidden", children: [
6413
- /* @__PURE__ */ jsxs("div", { className: "relative flex items-center justify-between mb-6 shrink-0 px-1", children: [
6466
+ ) }),
6467
+ /* @__PURE__ */ jsxs("div", { className: "relative flex flex-col gap-3 py-4 border-t border-blumine-100/40 flex-1 overflow-hidden", children: [
6468
+ /* @__PURE__ */ jsxs("div", { className: "relative flex items-center justify-between mb-4 shrink-0 px-1", children: [
6414
6469
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
6415
- /* @__PURE__ */ 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__ */ jsx(Video, { className: "h-4 w-4 text-[#15607b]" }) }),
6470
+ /* @__PURE__ */ jsx("div", { className: "relative flex h-10 w-10 items-center justify-center rounded-xl border border-blumine-200/60 bg-gradient-to-b from-white to-blumine-50/50 shadow-inner", children: /* @__PURE__ */ jsx(Video, { className: "h-5 w-5 text-blumine-600", strokeWidth: 1.5 }) }),
6416
6471
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
6417
- /* @__PURE__ */ jsx("h3", { className: "text-[12px] font-semibold uppercase tracking-[0.28em] text-[#134a61]", children: "Shots" }),
6418
- sceneType && /* @__PURE__ */ jsx("span", { className: "text-[9px] font-bold text-[#15607b] uppercase tracking-tighter opacity-80 mt-0.5", children: sceneType })
6472
+ /* @__PURE__ */ jsx("h3", { className: "text-[14px] font-bold uppercase tracking-wider text-blumine-800 leading-none", children: "Shots" }),
6473
+ sceneType && /* @__PURE__ */ jsx("span", { className: "text-[9px] font-bold text-blumine-500 uppercase tracking-wide opacity-80 mt-1", children: sceneType })
6419
6474
  ] })
6420
6475
  ] }),
6421
6476
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
@@ -6423,19 +6478,27 @@ function ShotBreakdownView({
6423
6478
  "button",
6424
6479
  {
6425
6480
  onClick: () => setIsInitModalOpen(true),
6426
- className: "flex h-7 w-7 items-center justify-center rounded-md border border-slate-200 bg-white shadow-sm transition-colors hover:bg-slate-50",
6481
+ className: "flex h-8 w-8 items-center justify-center rounded-lg border border-blumine-200/60 bg-gradient-to-b from-white to-blumine-50/50 text-blumine-600 shadow-sm transition duration-150 active:scale-95 hover:bg-blumine-100/60 hover:text-blumine-700",
6427
6482
  title: "Project Setup",
6428
- children: /* @__PURE__ */ jsx(Settings2, { className: "h-3.5 w-3.5 text-slate-600" })
6483
+ children: /* @__PURE__ */ jsx(Settings2, { className: "h-4 w-4", strokeWidth: 1.5 })
6429
6484
  }
6430
6485
  ),
6431
- shots.length > 0 && /* @__PURE__ */ jsx("span", { className: "rounded-md border border-slate-200 bg-white px-2 py-0.5 text-[10px] font-semibold text-slate-600 shadow-sm", children: shots.length })
6486
+ shots.length > 0 && /* @__PURE__ */ jsx("span", { className: "rounded-full border border-blumine-200/50 bg-blumine-50/80 px-2.5 py-0.5 text-[11px] font-bold text-blumine-700 shadow-sm", children: shots.length }),
6487
+ /* @__PURE__ */ jsx(
6488
+ "button",
6489
+ {
6490
+ onClick: () => setIsSidebarOpen(false),
6491
+ className: "flex xl:hidden h-8 w-8 items-center justify-center rounded-lg text-blumine-400 hover:bg-blumine-100 hover:text-blumine-700 transition duration-150 active:scale-95",
6492
+ children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
6493
+ }
6494
+ )
6432
6495
  ] })
6433
6496
  ] }),
6434
- shots.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center py-10 px-4 text-center", children: [
6435
- /* @__PURE__ */ jsx("div", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-slate-50 border border-slate-100 mb-3", children: /* @__PURE__ */ jsx(Video, { className: "h-4 w-4 text-slate-300" }) }),
6436
- /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold text-slate-700", children: "No shots created" }),
6437
- /* @__PURE__ */ jsx("p", { className: "text-[11px] text-slate-500 mt-1 max-w-[160px] leading-relaxed", children: "Highlight text in the screenplay to add your first shot." })
6438
- ] }) : /* @__PURE__ */ jsx("div", { className: "flex h-full max-h-[calc(100vh-200px)] flex-col gap-2.5 overflow-y-auto overflow-x-hidden pb-4 pr-2 custom-scrollbar", children: shots.map((shot) => {
6497
+ shots.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center py-12 px-4 text-center", children: [
6498
+ /* @__PURE__ */ jsx("div", { className: "flex h-12 w-12 items-center justify-center rounded-xl bg-gradient-to-b from-white to-blumine-50/30 border border-blumine-100/60 shadow-inner mb-4", children: /* @__PURE__ */ jsx(Video, { className: "h-5 w-5 text-blumine-400", strokeWidth: 1.5 }) }),
6499
+ /* @__PURE__ */ jsx("p", { className: "text-xs font-bold text-blumine-800 tracking-wide", children: "No Shots Created Yet" }),
6500
+ /* @__PURE__ */ jsx("p", { className: "text-[11px] text-blumine-400 mt-2 max-w-[180px] leading-relaxed font-medium", children: "Highlight text in the screenplay to add your first camera shot." })
6501
+ ] }) : /* @__PURE__ */ jsx("div", { className: "flex h-full max-h-[calc(100vh-200px)] flex-col gap-3 overflow-y-auto overflow-x-hidden pb-4 pr-1 custom-scrollbar", children: shots.map((shot) => {
6439
6502
  const isActive = toggledShotId === shot.id;
6440
6503
  return /* @__PURE__ */ jsxs(
6441
6504
  "div",
@@ -6444,48 +6507,46 @@ function ShotBreakdownView({
6444
6507
  var _a2;
6445
6508
  return setToggledShotId(isActive ? null : (_a2 = shot.id) != null ? _a2 : null);
6446
6509
  },
6447
- className: `group relative flex-shrink-0 cursor-pointer rounded-xl border transition-all duration-300 overflow-hidden ${isActive ? "border-slate-900 bg-slate-50 shadow-[0_6px_20px_rgba(0,0,0,0.06)]" : "border-slate-200 bg-white hover:border-slate-300 hover:shadow-[0_4px_14px_rgba(0,0,0,0.05)]"}`,
6510
+ className: `group relative flex-shrink-0 cursor-pointer rounded-2xl border transition-all duration-300 overflow-hidden ${isActive ? "border-blumine-500 bg-blumine-50/30 shadow-[0_6px_20px_rgba(16,43,60,0.06)]" : "border-blumine-100/50 bg-white hover:border-blumine-300 hover:shadow-[0_4px_14px_rgba(16,43,60,0.03)]"}`,
6448
6511
  children: [
6449
6512
  /* @__PURE__ */ jsx(
6450
6513
  "div",
6451
6514
  {
6452
- className: `absolute left-0 top-0 h-full w-[3px] transition-all duration-300
6453
- ${isActive ? "bg-slate-900" : "bg-transparent group-hover:bg-slate-300"}`
6515
+ className: `absolute left-0 top-0 h-full w-[3px] transition-all duration-300 ${isActive ? "bg-blumine-500" : "bg-transparent group-hover:bg-blumine-300"}`
6454
6516
  }
6455
6517
  ),
6456
- /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 px-4 py-3.5", children: [
6518
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2.5 px-4 py-3.5", children: [
6457
6519
  /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between", children: [
6458
6520
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
6459
6521
  /* @__PURE__ */ jsxs(
6460
6522
  "span",
6461
6523
  {
6462
- className: `text-[11px] font-semibold tracking-wide uppercase
6463
- ${isActive ? "text-slate-900" : "text-slate-500"}`,
6524
+ className: `text-[10px] font-bold tracking-wider uppercase ${isActive ? "text-blumine-500" : "text-blumine-400"}`,
6464
6525
  children: [
6465
6526
  "Shot ",
6466
6527
  shot.shot_number
6467
6528
  ]
6468
6529
  }
6469
6530
  ),
6470
- /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-slate-800 leading-tight", children: shot.camera_name || "Unknown Camera" })
6531
+ /* @__PURE__ */ jsx("span", { className: "text-xs font-extrabold text-blumine-800 leading-tight mt-1", children: shot.camera_name || "Unknown Camera" })
6471
6532
  ] }),
6472
6533
  /* @__PURE__ */ jsx(
6473
6534
  "span",
6474
6535
  {
6475
- className: `rounded-md px-2 py-0.5 text-[8px] font-bold uppercase tracking-wider ${isActive ? "bg-slate-900 text-white" : "bg-slate-100 text-slate-500 group-hover:bg-slate-200"}`,
6536
+ className: `rounded-lg px-2.5 py-1 text-[9px] font-bold uppercase tracking-wider transition-colors duration-200 ${isActive ? "bg-blumine-600 text-white shadow-sm" : "bg-blumine-50/60 text-blumine-600 group-hover:bg-blumine-100"}`,
6476
6537
  children: shot.shot_type
6477
6538
  }
6478
6539
  )
6479
6540
  ] }),
6480
- /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-[11px] text-slate-500", children: [
6541
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-[11px] font-medium text-blumine-400", children: [
6481
6542
  /* @__PURE__ */ jsx("span", { children: shot.lens_mm ? `${shot.lens_mm}mm Lens` : "\u2014" }),
6482
- /* @__PURE__ */ jsx("span", { className: "opacity-60", children: "Tap to expand" })
6543
+ /* @__PURE__ */ jsx("span", { className: "text-[10px] font-bold text-blumine-300 opacity-0 group-hover:opacity-100 transition-opacity duration-200", children: "Tap to expand" })
6483
6544
  ] }),
6484
6545
  /* @__PURE__ */ jsx(
6485
6546
  "div",
6486
6547
  {
6487
- className: `grid transition-all duration-300 ease-in-out ${isActive ? "grid-rows-[1fr] opacity-100 mt-2" : "grid-rows-[0fr] opacity-0"}`,
6488
- children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsxs("div", { className: "py-3 pb-1 border-t border-slate-200/70 flex gap-2", children: [
6548
+ className: `grid transition-all duration-300 ease-in-out ${isActive ? "grid-rows-[1fr] opacity-100 mt-1" : "grid-rows-[0fr] opacity-0"}`,
6549
+ children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsxs("div", { className: "pt-3 pb-1 border-t border-blumine-100/50 flex gap-2", children: [
6489
6550
  /* @__PURE__ */ jsxs(
6490
6551
  "button",
6491
6552
  {
@@ -6494,7 +6555,7 @@ function ShotBreakdownView({
6494
6555
  e.stopPropagation();
6495
6556
  setViewingShotId((_a2 = shot.id) != null ? _a2 : null);
6496
6557
  },
6497
- className: "flex flex-1 items-center justify-center gap-1.5 rounded-md border border-slate-200 bg-white py-2 text-[11px] font-semibold text-slate-700 transition-all hover:bg-slate-50 hover:text-slate-900",
6558
+ className: "flex flex-1 items-center justify-center gap-1.5 rounded-xl border border-blumine-200/60 bg-white py-2 text-[11px] font-bold text-blumine-700 transition-all hover:bg-blumine-50 hover:text-blumine-900 shadow-sm active:scale-[0.97]",
6498
6559
  children: [
6499
6560
  /* @__PURE__ */ jsx(Eye, { className: "h-3.5 w-3.5" }),
6500
6561
  "View"
@@ -6509,7 +6570,7 @@ function ShotBreakdownView({
6509
6570
  e.stopPropagation();
6510
6571
  setUpdatingShotId((_a2 = shot.id) != null ? _a2 : null);
6511
6572
  },
6512
- className: "flex flex-1 items-center justify-center gap-1.5 rounded-md bg-slate-900 py-2 text-[11px] font-semibold text-white transition-all hover:bg-slate-800",
6573
+ className: "flex flex-1 items-center justify-center gap-1.5 rounded-xl bg-gradient-to-b from-blumine-500 to-blumine-600 py-2 text-[11px] font-bold text-white transition-all hover:from-blumine-600 hover:to-blumine-700 shadow-md shadow-blumine-500/10 active:scale-[0.97]",
6513
6574
  children: [
6514
6575
  /* @__PURE__ */ jsx(Pencil, { className: "h-3.5 w-3.5" }),
6515
6576
  "Edit"