@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.
Files changed (5) hide show
  1. package/dist/index.cjs +257 -196
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +258 -197
  4. package/dist/index.js.map +1 -1
  5. package/package.json +1 -1
package/dist/index.cjs CHANGED
@@ -3114,6 +3114,9 @@ function useScreenplayEditor(options) {
3114
3114
  }
3115
3115
  }
3116
3116
  }
3117
+ if (onSaveRef.current && !isInitialLoad) {
3118
+ onSaveRef.current(finalizedBlocks);
3119
+ }
3117
3120
  setTimeout(() => {
3118
3121
  var _a2;
3119
3122
  const firstId = parsedBlocks[0].id;
@@ -4314,12 +4317,12 @@ function ScriptBreakdownSceneView({
4314
4317
  ))
4315
4318
  }
4316
4319
  ),
4317
- /* @__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: [
4318
- /* @__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: [
4319
- /* @__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" }) }),
4320
+ /* @__PURE__ */ jsxRuntime.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: [
4321
+ /* @__PURE__ */ jsxRuntime.jsxs("h3", { className: "text-xs font-bold text-blumine-800 uppercase tracking-widest mb-6 flex items-center gap-3 font-sans", children: [
4322
+ /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(lucideReact.AlignLeft, { className: "w-4 h-4" }) }),
4320
4323
  "Scene Brief"
4321
4324
  ] }),
4322
- /* @__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: [
4325
+ /* @__PURE__ */ jsxRuntime.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: [
4323
4326
  /* @__PURE__ */ jsxRuntime.jsx(
4324
4327
  "textarea",
4325
4328
  {
@@ -4337,7 +4340,7 @@ function ScriptBreakdownSceneView({
4337
4340
  {
4338
4341
  onClick: onUpdateBrief,
4339
4342
  disabled: !sceneBrief || sceneBrief.trim() === "",
4340
- 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",
4343
+ 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",
4341
4344
  children: "Update"
4342
4345
  }
4343
4346
  ) })
@@ -4348,41 +4351,54 @@ function ScriptBreakdownSceneView({
4348
4351
  "button",
4349
4352
  {
4350
4353
  onClick: () => setIsSidebarOpen(true),
4351
- 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",
4354
+ 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",
4352
4355
  children: [
4353
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-6 w-6" }),
4354
- 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 })
4356
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-5.5 w-5.5", strokeWidth: 2 }),
4357
+ 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-md border-2 border-white animate-pulse", children: tags.length })
4355
4358
  ]
4356
4359
  }
4357
4360
  ),
4358
4361
  isSidebarOpen && /* @__PURE__ */ jsxRuntime.jsx(
4359
4362
  "div",
4360
4363
  {
4361
- className: "fixed inset-0 z-40 bg-slate-900/20 backdrop-blur-sm transition-opacity xl:hidden",
4364
+ className: "fixed inset-0 z-40 bg-blumine-950/20 backdrop-blur-xs transition-all duration-300 xl:hidden",
4362
4365
  onClick: () => setIsSidebarOpen(false)
4363
4366
  }
4364
4367
  ),
4365
4368
  /* @__PURE__ */ jsxRuntime.jsx(
4366
4369
  "div",
4367
4370
  {
4368
- 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"}`,
4369
- 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: [
4370
- !aiSummarized && /* @__PURE__ */ jsxRuntime.jsx(
4371
+ 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"}`,
4372
+ children: /* @__PURE__ */ jsxRuntime.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: [
4373
+ !aiSummarized && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 shrink-0 flex justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
4371
4374
  summarize_button_default,
4372
4375
  {
4373
4376
  isSummarizing,
4374
4377
  onSummarize
4375
4378
  }
4376
- ),
4377
- /* @__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: [
4378
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center justify-between mb-6 shrink-0", children: [
4379
+ ) }),
4380
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col gap-3 py-4 border-t border-blumine-100/40 flex-1 overflow-hidden", children: [
4381
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center justify-between mb-4 shrink-0 px-1", children: [
4379
4382
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
4380
- /* @__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]" }) }),
4381
- /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[12px] font-semibold uppercase tracking-[0.28em] text-[#134a61]", children: "Breakdown" })
4383
+ /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(lucideReact.Tags, { className: "h-5 w-5 text-blumine-600", strokeWidth: 1.5 }) }),
4384
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
4385
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[14px] font-bold uppercase tracking-wider text-blumine-800 leading-none", children: "Breakdown" }),
4386
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[11px] text-blumine-400 mt-1 font-medium", children: "Scene element tags" })
4387
+ ] })
4382
4388
  ] }),
4383
- /* @__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 }) })
4389
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
4390
+ /* @__PURE__ */ jsxRuntime.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 }),
4391
+ /* @__PURE__ */ jsxRuntime.jsx(
4392
+ "button",
4393
+ {
4394
+ onClick: () => setIsSidebarOpen(false),
4395
+ 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",
4396
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
4397
+ }
4398
+ )
4399
+ ] })
4384
4400
  ] }),
4385
- /* @__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) => {
4401
+ /* @__PURE__ */ jsxRuntime.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) => {
4386
4402
  const catTags = tags.filter((t) => t.category_id === cat.id);
4387
4403
  if (!catTags.length) return null;
4388
4404
  const isExpanded = expandedCategories[cat.id];
@@ -4393,114 +4409,145 @@ function ScriptBreakdownSceneView({
4393
4409
  );
4394
4410
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
4395
4411
  /* @__PURE__ */ jsxRuntime.jsxs(
4396
- "div",
4412
+ "button",
4397
4413
  {
4398
4414
  onClick: () => setExpandedCategories((prev) => ({
4399
4415
  [cat.id]: !prev[cat.id]
4400
4416
  })),
4401
- 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]",
4417
+ 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",
4402
4418
  style: {
4403
- background: `linear-gradient(135deg, rgba(255,255,255,0.92), ${cat.hex}18)`,
4404
- boxShadow: `0 16px 36px ${cat.hex}14, inset 0 1px 0 rgba(255,255,255,0.9)`,
4405
- border: `1px solid ${cat.hex}50`
4419
+ borderColor: `${cat.color}25`,
4420
+ background: `linear-gradient(135deg, #ffffff, ${cat.color}08)`
4406
4421
  },
4407
4422
  children: [
4408
4423
  /* @__PURE__ */ jsxRuntime.jsx(
4409
4424
  "div",
4410
4425
  {
4411
- className: "absolute inset-0 opacity-0 transition-opacity duration-300 group-hover:opacity-100",
4426
+ className: "absolute inset-0 opacity-0 group-hover:opacity-100 transition-opacity duration-300 pointer-events-none",
4412
4427
  style: {
4413
- background: `radial-gradient(circle at 15% 20%, ${cat.hex}24, transparent 38%)`
4428
+ background: `radial-gradient(circle at 12% 50%, ${cat.color}15, transparent 40%)`
4414
4429
  }
4415
4430
  }
4416
4431
  ),
4417
4432
  /* @__PURE__ */ jsxRuntime.jsx(
4418
4433
  "div",
4419
4434
  {
4420
- className: "relative flex h-9 w-9 shrink-0 items-center justify-center rounded-xl border border-white/70 backdrop-blur-md",
4435
+ 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",
4421
4436
  style: {
4422
- background: `linear-gradient(135deg, ${cat.color}22, rgba(255,255,255,0.75))`,
4423
- boxShadow: `0 10px 22px ${cat.color}14`
4437
+ background: `linear-gradient(135deg, ${cat.color}12, ${cat.color}05)`,
4438
+ borderColor: `${cat.color}20`
4424
4439
  },
4425
- children: /* @__PURE__ */ jsxRuntime.jsx(cat.icon, { className: "h-4 w-4", color: cat.color })
4440
+ children: /* @__PURE__ */ jsxRuntime.jsx(cat.icon, { className: "h-4 w-4", style: { color: cat.color } })
4426
4441
  }
4427
4442
  ),
4428
4443
  /* @__PURE__ */ jsxRuntime.jsx(
4429
4444
  "span",
4430
4445
  {
4431
- className: "relative text-[13px] font-semibold tracking-[0.01em]",
4446
+ className: "relative text-xs font-bold tracking-wide transition-colors duration-200",
4432
4447
  style: { color: cat.color },
4433
4448
  children: cat.label
4434
4449
  }
4435
4450
  ),
4436
- /* @__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 }),
4437
- /* @__PURE__ */ jsxRuntime.jsx(
4438
- lucideReact.ChevronDown,
4439
- {
4440
- className: `relative h-4 w-4 transition-transform duration-500 ease-[cubic-bezier(0.22,1,0.36,1)] ${isExpanded ? "rotate-180" : ""}`,
4441
- style: { color: cat.color }
4442
- }
4443
- )
4451
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-auto flex items-center gap-1.5 relative", children: [
4452
+ /* @__PURE__ */ jsxRuntime.jsx(
4453
+ "span",
4454
+ {
4455
+ className: "rounded-full px-2 py-0.5 text-[10px] font-bold transition-all duration-200",
4456
+ style: {
4457
+ color: cat.color,
4458
+ backgroundColor: `${cat.color}10`,
4459
+ border: `1px solid ${cat.color}15`
4460
+ },
4461
+ children: catTags.length
4462
+ }
4463
+ ),
4464
+ /* @__PURE__ */ jsxRuntime.jsx(
4465
+ lucideReact.ChevronDown,
4466
+ {
4467
+ className: `h-3.5 w-3.5 transition-transform duration-300 ease-[cubic-bezier(0.2,0,0,1)] ${isExpanded ? "rotate-180" : ""}`,
4468
+ style: { color: cat.color },
4469
+ strokeWidth: 2.5
4470
+ }
4471
+ )
4472
+ ] })
4444
4473
  ]
4445
4474
  }
4446
4475
  ),
4447
4476
  /* @__PURE__ */ jsxRuntime.jsx(
4448
4477
  "div",
4449
4478
  {
4450
- 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"}`,
4451
- 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(
4479
+ 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"}`,
4480
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
4452
4481
  "div",
4453
4482
  {
4454
- className: "relative flex flex-col items-start",
4455
- children: /* @__PURE__ */ jsxRuntime.jsxs(
4456
- "span",
4483
+ className: "flex flex-wrap justify-start gap-2 py-2 pl-3 border-l ml-4",
4484
+ style: { borderColor: `${cat.color}18` },
4485
+ children: uniqueTags.map((tag, index) => /* @__PURE__ */ jsxRuntime.jsx(
4486
+ "div",
4457
4487
  {
4458
- title: tag.name,
4459
- onClick: (e) => {
4460
- e.stopPropagation();
4461
- if (cat.id !== "PROP" && cat.id !== "SET_PROP" && cat.id !== "CAST" && cat.id !== "EXTRA")
4462
- return;
4463
- if ((editingTagData == null ? void 0 : editingTagData.tag.id) === tag.id) {
4464
- setEditingTagData(null);
4465
- } else {
4466
- const rect = e.currentTarget.getBoundingClientRect();
4467
- setPopupPlacement({
4468
- alignRight: rect.left > window.innerWidth - 240,
4469
- alignBottom: rect.bottom > window.innerHeight - 250
4470
- });
4471
- setTagForm({
4472
- quantity: tag.quantity || 1,
4473
- look: tag.look || "",
4474
- age: tag.age || "",
4475
- age_range: tag.age_range || [],
4476
- crowd_type: tag.crowd_type || []
4477
- });
4478
- setEditingTagData({
4479
- tag,
4480
- catId: cat.id,
4481
- catColor: cat.color,
4482
- rect
4483
- });
4488
+ className: "relative flex flex-col items-start max-w-full",
4489
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
4490
+ "span",
4491
+ {
4492
+ title: tag.name,
4493
+ onClick: (e) => {
4494
+ e.stopPropagation();
4495
+ if (cat.id !== "PROP" && cat.id !== "SET_PROP" && cat.id !== "CAST" && cat.id !== "EXTRA")
4496
+ return;
4497
+ if ((editingTagData == null ? void 0 : editingTagData.tag.id) === tag.id) {
4498
+ setEditingTagData(null);
4499
+ } else {
4500
+ const rect = e.currentTarget.getBoundingClientRect();
4501
+ setPopupPlacement({
4502
+ alignRight: rect.left > window.innerWidth - 240,
4503
+ alignBottom: rect.bottom > window.innerHeight - 250
4504
+ });
4505
+ setTagForm({
4506
+ quantity: tag.quantity || 1,
4507
+ look: tag.look || "",
4508
+ age: tag.age || "",
4509
+ age_range: tag.age_range || [],
4510
+ crowd_type: tag.crowd_type || []
4511
+ });
4512
+ setEditingTagData({
4513
+ tag,
4514
+ catId: cat.id,
4515
+ catColor: cat.color,
4516
+ rect
4517
+ });
4518
+ }
4519
+ },
4520
+ 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"}`,
4521
+ style: {
4522
+ color: cat.color,
4523
+ background: `linear-gradient(135deg, ${cat.color}08, ${cat.color}03)`,
4524
+ borderColor: `${cat.color}18`
4525
+ },
4526
+ children: [
4527
+ tag.name,
4528
+ (cat.id === "PROP" || cat.id === "SET_PROP") && tag.quantity && tag.quantity > 1 ? /* @__PURE__ */ jsxRuntime.jsxs(
4529
+ "span",
4530
+ {
4531
+ className: "ml-1.5 font-extrabold px-1 py-0.5 rounded text-[9px] border inline-block",
4532
+ style: {
4533
+ color: cat.color,
4534
+ backgroundColor: `${cat.color}10`,
4535
+ borderColor: `${cat.color}15`
4536
+ },
4537
+ children: [
4538
+ "x",
4539
+ tag.quantity
4540
+ ]
4541
+ }
4542
+ ) : null
4543
+ ]
4484
4544
  }
4485
- },
4486
- 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" : ""}`,
4487
- style: {
4488
- color: cat.color,
4489
- background: `linear-gradient(145deg, ${cat.color}18, rgba(255,255,255,0.88))`,
4490
- borderColor: `${cat.color}28`
4491
- },
4492
- children: [
4493
- tag.name,
4494
- (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: [
4495
- "x",
4496
- tag.quantity
4497
- ] }) : null
4498
- ]
4499
- }
4500
- )
4501
- },
4502
- index
4503
- )) }) })
4545
+ )
4546
+ },
4547
+ index
4548
+ ))
4549
+ }
4550
+ ) })
4504
4551
  }
4505
4552
  )
4506
4553
  ] }, cat.id);
@@ -4514,7 +4561,7 @@ function ScriptBreakdownSceneView({
4514
4561
  /* @__PURE__ */ jsxRuntime.jsx(
4515
4562
  "div",
4516
4563
  {
4517
- className: "fixed inset-0 z-[100]",
4564
+ className: "fixed inset-0 z-[100] bg-blumine-950/5 backdrop-blur-[1px]",
4518
4565
  onClick: (e) => {
4519
4566
  e.stopPropagation();
4520
4567
  setEditingTagData(null);
@@ -4524,7 +4571,7 @@ function ScriptBreakdownSceneView({
4524
4571
  /* @__PURE__ */ jsxRuntime.jsxs(
4525
4572
  "div",
4526
4573
  {
4527
- 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`,
4574
+ 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`,
4528
4575
  style: {
4529
4576
  top: popupPlacement.alignBottom ? "auto" : editingTagData.rect.bottom + 8,
4530
4577
  bottom: popupPlacement.alignBottom ? window.innerHeight - editingTagData.rect.top + 8 : "auto",
@@ -4533,19 +4580,19 @@ function ScriptBreakdownSceneView({
4533
4580
  },
4534
4581
  onClick: (e) => e.stopPropagation(),
4535
4582
  children: [
4536
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center mb-3 border-b border-slate-100 pb-2.5", children: [
4537
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-extrabold text-slate-400 uppercase tracking-widest drop-shadow-sm", children: "Details" }),
4583
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between items-center mb-3 border-b border-blumine-100/30 pb-2.5", children: [
4584
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-extrabold text-blumine-400 uppercase tracking-widest drop-shadow-sm", children: "Details" }),
4538
4585
  /* @__PURE__ */ jsxRuntime.jsx(
4539
4586
  "button",
4540
4587
  {
4541
4588
  onClick: () => setEditingTagData(null),
4542
- className: "hover:bg-slate-100/80 p-1.5 rounded-full transition-colors active:scale-95",
4543
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-3.5 h-3.5 text-slate-500" })
4589
+ className: "hover:bg-blumine-100/40 p-1.5 rounded-full transition-colors active:scale-95 text-blumine-500",
4590
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-3.5 h-3.5" })
4544
4591
  }
4545
4592
  )
4546
4593
  ] }),
4547
4594
  (editingTagData.catId === "PROP" || editingTagData.catId === "SET_PROP") && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
4548
- /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Quantity" }),
4595
+ /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-blumine-700 ml-1", children: "Quantity" }),
4549
4596
  /* @__PURE__ */ jsxRuntime.jsx(
4550
4597
  "input",
4551
4598
  {
@@ -4558,13 +4605,13 @@ function ScriptBreakdownSceneView({
4558
4605
  quantity: val
4559
4606
  }));
4560
4607
  },
4561
- 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"
4608
+ 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"
4562
4609
  }
4563
4610
  )
4564
4611
  ] }),
4565
4612
  editingTagData.catId === "CAST" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
4566
4613
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
4567
- /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Look" }),
4614
+ /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-blumine-700 ml-1", children: "Look" }),
4568
4615
  /* @__PURE__ */ jsxRuntime.jsx(
4569
4616
  "input",
4570
4617
  {
@@ -4576,12 +4623,12 @@ function ScriptBreakdownSceneView({
4576
4623
  look: e.target.value
4577
4624
  }));
4578
4625
  },
4579
- 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"
4626
+ 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"
4580
4627
  }
4581
4628
  )
4582
4629
  ] }),
4583
4630
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
4584
- /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-slate-600 ml-1", children: "Age" }),
4631
+ /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-[11px] font-bold text-blumine-700 ml-1", children: "Age" }),
4585
4632
  /* @__PURE__ */ jsxRuntime.jsx(
4586
4633
  "input",
4587
4634
  {
@@ -4602,7 +4649,7 @@ function ScriptBreakdownSceneView({
4602
4649
  age: val.toString()
4603
4650
  }));
4604
4651
  },
4605
- 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"
4652
+ 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"
4606
4653
  }
4607
4654
  )
4608
4655
  ] })
@@ -4642,7 +4689,7 @@ function ScriptBreakdownSceneView({
4642
4689
  }
4643
4690
  setEditingTagData(null);
4644
4691
  },
4645
- 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]",
4692
+ 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]",
4646
4693
  children: "Update Details"
4647
4694
  }
4648
4695
  ) })
@@ -4725,72 +4772,80 @@ function useScriptBreakdownScene(options) {
4725
4772
  }, [blocks]);
4726
4773
  const handleAISummarize = async () => {
4727
4774
  var _a;
4775
+ if (!scene || !scene.content) {
4776
+ console.error("Cannot summarize scene: Scene data is not loaded yet.");
4777
+ return;
4778
+ }
4728
4779
  setIsSummarizing(true);
4729
- const res = await ((_a = options.onAISummarize) == null ? void 0 : _a.call(options, scene.content));
4730
- if (res.ok) {
4731
- const data = await res.json();
4732
- setIsSummarizing(false);
4733
- let parsedData = [];
4734
- let parsedSummaryData = {};
4735
- try {
4736
- const normalData = JSON.parse(data.data);
4737
- if (Array.isArray(normalData)) {
4738
- parsedData = Array.isArray(normalData[0]) ? normalData[0] : [];
4739
- const summary = Array.isArray(normalData[1]) ? normalData[1] : [];
4740
- parsedSummaryData = summary[0] || {};
4741
- }
4742
- } catch (error2) {
4743
- console.error("Error parsing AI summary data:", error2);
4744
- }
4745
- setSceneBrief(parsedSummaryData.summarise || "");
4746
- const newTags = [];
4747
- parsedData.forEach((aiTag) => {
4748
- if (!aiTag.block_id || !aiTag.category_id || typeof aiTag.start_index !== "number" || typeof aiTag.end_index !== "number") {
4749
- return;
4750
- }
4751
- const newTag = {
4752
- id: aiTag.id || uuid(),
4753
- block_id: String(aiTag.block_id).startsWith("par") ? String(aiTag.block_id).substring(3) : String(aiTag.block_id),
4754
- category_id: aiTag.category_id,
4755
- name: aiTag.name,
4756
- start_index: aiTag.start_index,
4757
- end_index: aiTag.end_index
4758
- };
4759
- if (aiTag.category_id === "PROP" || aiTag.category_id === "SET_PROP") {
4760
- newTag.quantity = 1;
4761
- } else if (aiTag.category_id === "CAST") {
4762
- newTag.look = "";
4763
- newTag.age = "";
4764
- }
4765
- newTags.push(newTag);
4766
- });
4767
- if (newTags.length > 0) {
4768
- const originalTags = tags;
4769
- setTags((prev) => {
4770
- const merged = [...prev];
4771
- newTags.forEach((newTag) => {
4772
- const isOverlapping = merged.some(
4773
- (t) => t.block_id === newTag.block_id && newTag.end_index > t.start_index && newTag.start_index < t.end_index
4774
- );
4775
- if (!isOverlapping) {
4776
- merged.push(newTag);
4777
- }
4778
- });
4779
- return merged;
4780
- });
4780
+ try {
4781
+ const res = await ((_a = options.onAISummarize) == null ? void 0 : _a.call(options, scene.content));
4782
+ if (res && res.ok) {
4783
+ const data = await res.json();
4784
+ let parsedData = [];
4785
+ let parsedSummaryData = {};
4781
4786
  try {
4782
- if (options.onTagsBulkAdded) {
4783
- await options.onTagsBulkAdded(newTags, parsedSummaryData.summarise);
4787
+ const normalData = JSON.parse(data.data);
4788
+ if (Array.isArray(normalData)) {
4789
+ parsedData = Array.isArray(normalData[0]) ? normalData[0] : [];
4790
+ const summary = Array.isArray(normalData[1]) ? normalData[1] : [];
4791
+ parsedSummaryData = summary[0] || {};
4784
4792
  }
4785
4793
  } catch (error2) {
4786
- console.error("Failed to bulk add AI-generated tags:", error2);
4787
- setTags(originalTags);
4794
+ console.error("Error parsing AI summary data:", error2);
4788
4795
  }
4796
+ setSceneBrief(parsedSummaryData.summarise || "");
4797
+ const newTags = [];
4798
+ parsedData.forEach((aiTag) => {
4799
+ if (!aiTag.block_id || !aiTag.category_id || typeof aiTag.start_index !== "number" || typeof aiTag.end_index !== "number") {
4800
+ return;
4801
+ }
4802
+ const newTag = {
4803
+ id: aiTag.id || uuid(),
4804
+ block_id: String(aiTag.block_id).startsWith("par") ? String(aiTag.block_id).substring(3) : String(aiTag.block_id),
4805
+ category_id: aiTag.category_id,
4806
+ name: aiTag.name,
4807
+ start_index: aiTag.start_index,
4808
+ end_index: aiTag.end_index
4809
+ };
4810
+ if (aiTag.category_id === "PROP" || aiTag.category_id === "SET_PROP") {
4811
+ newTag.quantity = 1;
4812
+ } else if (aiTag.category_id === "CAST") {
4813
+ newTag.look = "";
4814
+ newTag.age = "";
4815
+ }
4816
+ newTags.push(newTag);
4817
+ });
4818
+ if (newTags.length > 0) {
4819
+ const originalTags = tags;
4820
+ setTags((prev) => {
4821
+ const merged = [...prev];
4822
+ newTags.forEach((newTag) => {
4823
+ const isOverlapping = merged.some(
4824
+ (t) => t.block_id === newTag.block_id && newTag.end_index > t.start_index && newTag.start_index < t.end_index
4825
+ );
4826
+ if (!isOverlapping) {
4827
+ merged.push(newTag);
4828
+ }
4829
+ });
4830
+ return merged;
4831
+ });
4832
+ try {
4833
+ if (options.onTagsBulkAdded) {
4834
+ await options.onTagsBulkAdded(newTags, parsedSummaryData.summarise);
4835
+ }
4836
+ } catch (error2) {
4837
+ console.error("Failed to bulk add AI-generated tags:", error2);
4838
+ setTags(originalTags);
4839
+ }
4840
+ }
4841
+ return data;
4842
+ } else {
4843
+ console.error("Failed to summarize scene:", res);
4789
4844
  }
4790
- return data;
4791
- } else {
4845
+ } catch (error2) {
4846
+ console.error("An error occurred during scene summarization:", error2);
4847
+ } finally {
4792
4848
  setIsSummarizing(false);
4793
- console.error("Failed to summarize scene:", res);
4794
4849
  }
4795
4850
  };
4796
4851
  const bulkCreateTags = React4.useCallback(async () => {
@@ -6411,39 +6466,39 @@ function ShotBreakdownView({
6411
6466
  "button",
6412
6467
  {
6413
6468
  onClick: () => setIsSidebarOpen(true),
6414
- 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",
6469
+ 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",
6415
6470
  children: [
6416
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Video, { className: "h-6 w-6" }),
6417
- shots.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: shots.length })
6471
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Video, { className: "h-5.5 w-5.5", strokeWidth: 2 }),
6472
+ shots.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-md border-2 border-white animate-pulse", children: shots.length })
6418
6473
  ]
6419
6474
  }
6420
6475
  ),
6421
6476
  isSidebarOpen && /* @__PURE__ */ jsxRuntime.jsx(
6422
6477
  "div",
6423
6478
  {
6424
- className: "fixed inset-0 z-40 bg-slate-900/20 backdrop-blur-sm transition-opacity xl:hidden",
6479
+ className: "fixed inset-0 z-40 bg-blumine-950/20 backdrop-blur-xs transition-all duration-300 xl:hidden",
6425
6480
  onClick: () => setIsSidebarOpen(false)
6426
6481
  }
6427
6482
  ),
6428
6483
  /* @__PURE__ */ jsxRuntime.jsx(
6429
6484
  "div",
6430
6485
  {
6431
- 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"}`,
6432
- 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: [
6433
- !aiSummarized && /* @__PURE__ */ jsxRuntime.jsx(
6486
+ 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"}`,
6487
+ children: /* @__PURE__ */ jsxRuntime.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: [
6488
+ !aiSummarized && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 shrink-0 flex justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
6434
6489
  summarize_button_default,
6435
6490
  {
6436
6491
  onSummarize: handleAISummarize,
6437
6492
  isSummarizing
6438
6493
  }
6439
- ),
6440
- /* @__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: [
6441
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center justify-between mb-6 shrink-0 px-1", children: [
6494
+ ) }),
6495
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col gap-3 py-4 border-t border-blumine-100/40 flex-1 overflow-hidden", children: [
6496
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center justify-between mb-4 shrink-0 px-1", children: [
6442
6497
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
6443
- /* @__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.Video, { className: "h-4 w-4 text-[#15607b]" }) }),
6498
+ /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(lucideReact.Video, { className: "h-5 w-5 text-blumine-600", strokeWidth: 1.5 }) }),
6444
6499
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
6445
- /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[12px] font-semibold uppercase tracking-[0.28em] text-[#134a61]", children: "Shots" }),
6446
- sceneType && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[9px] font-bold text-[#15607b] uppercase tracking-tighter opacity-80 mt-0.5", children: sceneType })
6500
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-[14px] font-bold uppercase tracking-wider text-blumine-800 leading-none", children: "Shots" }),
6501
+ sceneType && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[9px] font-bold text-blumine-500 uppercase tracking-wide opacity-80 mt-1", children: sceneType })
6447
6502
  ] })
6448
6503
  ] }),
6449
6504
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
@@ -6451,19 +6506,27 @@ function ShotBreakdownView({
6451
6506
  "button",
6452
6507
  {
6453
6508
  onClick: () => setIsInitModalOpen(true),
6454
- 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",
6509
+ 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",
6455
6510
  title: "Project Setup",
6456
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Settings2, { className: "h-3.5 w-3.5 text-slate-600" })
6511
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Settings2, { className: "h-4 w-4", strokeWidth: 1.5 })
6457
6512
  }
6458
6513
  ),
6459
- shots.length > 0 && /* @__PURE__ */ jsxRuntime.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 })
6514
+ shots.length > 0 && /* @__PURE__ */ jsxRuntime.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 }),
6515
+ /* @__PURE__ */ jsxRuntime.jsx(
6516
+ "button",
6517
+ {
6518
+ onClick: () => setIsSidebarOpen(false),
6519
+ 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",
6520
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
6521
+ }
6522
+ )
6460
6523
  ] })
6461
6524
  ] }),
6462
- shots.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center py-10 px-4 text-center", children: [
6463
- /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(lucideReact.Video, { className: "h-4 w-4 text-slate-300" }) }),
6464
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold text-slate-700", children: "No shots created" }),
6465
- /* @__PURE__ */ jsxRuntime.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." })
6466
- ] }) : /* @__PURE__ */ jsxRuntime.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) => {
6525
+ shots.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center py-12 px-4 text-center", children: [
6526
+ /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx(lucideReact.Video, { className: "h-5 w-5 text-blumine-400", strokeWidth: 1.5 }) }),
6527
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-bold text-blumine-800 tracking-wide", children: "No Shots Created Yet" }),
6528
+ /* @__PURE__ */ jsxRuntime.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." })
6529
+ ] }) : /* @__PURE__ */ jsxRuntime.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) => {
6467
6530
  const isActive = toggledShotId === shot.id;
6468
6531
  return /* @__PURE__ */ jsxRuntime.jsxs(
6469
6532
  "div",
@@ -6472,48 +6535,46 @@ function ShotBreakdownView({
6472
6535
  var _a2;
6473
6536
  return setToggledShotId(isActive ? null : (_a2 = shot.id) != null ? _a2 : null);
6474
6537
  },
6475
- 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)]"}`,
6538
+ 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)]"}`,
6476
6539
  children: [
6477
6540
  /* @__PURE__ */ jsxRuntime.jsx(
6478
6541
  "div",
6479
6542
  {
6480
- className: `absolute left-0 top-0 h-full w-[3px] transition-all duration-300
6481
- ${isActive ? "bg-slate-900" : "bg-transparent group-hover:bg-slate-300"}`
6543
+ 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"}`
6482
6544
  }
6483
6545
  ),
6484
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 px-4 py-3.5", children: [
6546
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2.5 px-4 py-3.5", children: [
6485
6547
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between", children: [
6486
6548
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
6487
6549
  /* @__PURE__ */ jsxRuntime.jsxs(
6488
6550
  "span",
6489
6551
  {
6490
- className: `text-[11px] font-semibold tracking-wide uppercase
6491
- ${isActive ? "text-slate-900" : "text-slate-500"}`,
6552
+ className: `text-[10px] font-bold tracking-wider uppercase ${isActive ? "text-blumine-500" : "text-blumine-400"}`,
6492
6553
  children: [
6493
6554
  "Shot ",
6494
6555
  shot.shot_number
6495
6556
  ]
6496
6557
  }
6497
6558
  ),
6498
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold text-slate-800 leading-tight", children: shot.camera_name || "Unknown Camera" })
6559
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-extrabold text-blumine-800 leading-tight mt-1", children: shot.camera_name || "Unknown Camera" })
6499
6560
  ] }),
6500
6561
  /* @__PURE__ */ jsxRuntime.jsx(
6501
6562
  "span",
6502
6563
  {
6503
- 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"}`,
6564
+ 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"}`,
6504
6565
  children: shot.shot_type
6505
6566
  }
6506
6567
  )
6507
6568
  ] }),
6508
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-[11px] text-slate-500", children: [
6569
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-[11px] font-medium text-blumine-400", children: [
6509
6570
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: shot.lens_mm ? `${shot.lens_mm}mm Lens` : "\u2014" }),
6510
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "opacity-60", children: "Tap to expand" })
6571
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-bold text-blumine-300 opacity-0 group-hover:opacity-100 transition-opacity duration-200", children: "Tap to expand" })
6511
6572
  ] }),
6512
6573
  /* @__PURE__ */ jsxRuntime.jsx(
6513
6574
  "div",
6514
6575
  {
6515
- className: `grid transition-all duration-300 ease-in-out ${isActive ? "grid-rows-[1fr] opacity-100 mt-2" : "grid-rows-[0fr] opacity-0"}`,
6516
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "py-3 pb-1 border-t border-slate-200/70 flex gap-2", children: [
6576
+ className: `grid transition-all duration-300 ease-in-out ${isActive ? "grid-rows-[1fr] opacity-100 mt-1" : "grid-rows-[0fr] opacity-0"}`,
6577
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-3 pb-1 border-t border-blumine-100/50 flex gap-2", children: [
6517
6578
  /* @__PURE__ */ jsxRuntime.jsxs(
6518
6579
  "button",
6519
6580
  {
@@ -6522,7 +6583,7 @@ function ShotBreakdownView({
6522
6583
  e.stopPropagation();
6523
6584
  setViewingShotId((_a2 = shot.id) != null ? _a2 : null);
6524
6585
  },
6525
- 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",
6586
+ 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]",
6526
6587
  children: [
6527
6588
  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Eye, { className: "h-3.5 w-3.5" }),
6528
6589
  "View"
@@ -6537,7 +6598,7 @@ function ShotBreakdownView({
6537
6598
  e.stopPropagation();
6538
6599
  setUpdatingShotId((_a2 = shot.id) != null ? _a2 : null);
6539
6600
  },
6540
- 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",
6601
+ 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]",
6541
6602
  children: [
6542
6603
  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Pencil, { className: "h-3.5 w-3.5" }),
6543
6604
  "Edit"