@linto-ai/transcript-ui-webcomponent 0.9.14 → 0.9.16

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.
@@ -9758,6 +9758,10 @@ const Minimize = createLucideIcon("minimize", [
9758
9758
  ["path", { d: "M3 16h3a2 2 0 0 1 2 2v3", key: "198tvr" }],
9759
9759
  ["path", { d: "M16 21v-3a2 2 0 0 1 2-2h3", key: "ph8mxp" }]
9760
9760
  ]);
9761
+ const PanelRight = createLucideIcon("panel-right", [
9762
+ ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
9763
+ ["path", { d: "M15 3v18", key: "14nvp0" }]
9764
+ ]);
9761
9765
  const Pause = createLucideIcon("pause", [
9762
9766
  ["rect", { x: "14", y: "3", width: "5", height: "18", rx: "1", key: "kaeet6" }],
9763
9767
  ["rect", { x: "5", y: "3", width: "5", height: "18", rx: "1", key: "1wsw3u" }]
@@ -9986,7 +9990,8 @@ const iconMap = {
9986
9990
  "file-text": FileText,
9987
9991
  "message-circle": MessageCircle,
9988
9992
  "refresh-cw": RefreshCw,
9989
- sparkles: Sparkles
9993
+ sparkles: Sparkles,
9994
+ "panel-right": PanelRight
9990
9995
  };
9991
9996
  function resolveIcon(name) {
9992
9997
  if (!name) return void 0;
@@ -10254,6 +10259,7 @@ const fr = {
10254
10259
  "tabs.moreSelect": "Sélectionner…",
10255
10260
  "llmService.regenerate": "Régénérer",
10256
10261
  "llmService.download": "Télécharger",
10262
+ "llmService.split": "Afficher le verbatim à côté",
10257
10263
  "llmService.generated": "Généré par IA",
10258
10264
  "llmService.processing": "Génération en cours…",
10259
10265
  "llmService.queued": "En file d'attente…",
@@ -10391,6 +10397,7 @@ const en = {
10391
10397
  "tabs.moreSelect": "Select…",
10392
10398
  "llmService.regenerate": "Regenerate",
10393
10399
  "llmService.download": "Download",
10400
+ "llmService.split": "Show verbatim alongside",
10394
10401
  "llmService.generated": "AI-generated",
10395
10402
  "llmService.processing": "Generating…",
10396
10403
  "llmService.queued": "Queued…",
@@ -10487,7 +10494,7 @@ function useI18n() {
10487
10494
  }
10488
10495
  const _hoisted_1$E = { class: "code-block" };
10489
10496
  const _hoisted_2$u = ["innerHTML"];
10490
- const _hoisted_3$o = { key: 1 };
10497
+ const _hoisted_3$n = { key: 1 };
10491
10498
  const _sfc_main$K = /* @__PURE__ */ defineComponent({
10492
10499
  __name: "CodeBlock",
10493
10500
  props: {
@@ -10511,7 +10518,7 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
10511
10518
  highlighted.value = null;
10512
10519
  return;
10513
10520
  }
10514
- const { highlightCode } = await import("./highlight-BWR22PHo.js");
10521
+ const { highlightCode } = await import("./highlight-DcaGiZlF.js");
10515
10522
  if (run === seq) highlighted.value = highlightCode(code, lang ?? "");
10516
10523
  },
10517
10524
  { immediate: true }
@@ -10530,7 +10537,7 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
10530
10537
  highlighted.value ? (openBlock(), createElementBlock("code", {
10531
10538
  key: 0,
10532
10539
  innerHTML: highlighted.value
10533
- }, null, 8, _hoisted_2$u)) : (openBlock(), createElementBlock("code", _hoisted_3$o, toDisplayString(__props.code), 1))
10540
+ }, null, 8, _hoisted_2$u)) : (openBlock(), createElementBlock("code", _hoisted_3$n, toDisplayString(__props.code), 1))
10534
10541
  ])
10535
10542
  ]);
10536
10543
  };
@@ -10668,7 +10675,7 @@ const _hoisted_1$D = {
10668
10675
  class: "form-field__header"
10669
10676
  };
10670
10677
  const _hoisted_2$t = ["for"];
10671
- const _hoisted_3$n = {
10678
+ const _hoisted_3$m = {
10672
10679
  key: 0,
10673
10680
  class: "form-field__required",
10674
10681
  "aria-hidden": "true"
@@ -10804,7 +10811,7 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
10804
10811
  for: id.value
10805
10812
  }, [
10806
10813
  createTextVNode(toDisplayString(__props.field.label) + " ", 1),
10807
- isRequired.value ? (openBlock(), createElementBlock("span", _hoisted_3$n, "*")) : createCommentVNode("", true)
10814
+ isRequired.value ? (openBlock(), createElementBlock("span", _hoisted_3$m, "*")) : createCommentVNode("", true)
10808
10815
  ], 8, _hoisted_2$t),
10809
10816
  renderSlot(_ctx.$slots, "content-after-label", {}, void 0, true)
10810
10817
  ])) : createCommentVNode("", true),
@@ -21141,7 +21148,7 @@ function getShadowRootSelection(root2) {
21141
21148
  }
21142
21149
  const _hoisted_1$A = { class: "markdown-editor" };
21143
21150
  const _hoisted_2$s = ["aria-label"];
21144
- const _hoisted_3$m = ["contenteditable"];
21151
+ const _hoisted_3$l = ["contenteditable"];
21145
21152
  const _sfc_main$G = /* @__PURE__ */ defineComponent({
21146
21153
  __name: "MarkdownEditor",
21147
21154
  props: {
@@ -21484,13 +21491,13 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
21484
21491
  onPaste,
21485
21492
  onFocus: startSelectionListener,
21486
21493
  onBlur: stopSelectionListener
21487
- }, null, 40, _hoisted_3$m)
21494
+ }, null, 40, _hoisted_3$l)
21488
21495
  ]);
21489
21496
  };
21490
21497
  }
21491
21498
  });
21492
- const _style_0$y = "\n.markdown-editor[data-v-e5fdd0e6] {\n display: flex;\n flex-direction: column;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n line-height: var(--line-height);\n color: var(--color-text-primary);\n}\n.markdown-editor__toolbar[data-v-e5fdd0e6] {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: var(--spacing-xs);\n padding: var(--spacing-xs) var(--spacing-md);\n border-bottom: 1px solid var(--color-border);\n background-color: var(--color-surface);\n position: sticky;\n top: 0;\n z-index: 1;\n}\n.markdown-editor__separator[data-v-e5fdd0e6] {\n width: 1px;\n height: 20px;\n background-color: var(--color-border);\n margin: 0 var(--spacing-xs);\n}\n.markdown-editor__content[data-v-e5fdd0e6] {\n padding: var(--spacing-md) var(--spacing-md);\n outline: none;\n min-height: 200px;\n}\n.markdown-editor__content[data-v-e5fdd0e6] > *:first-child {\n margin-top: 0;\n}\n.markdown-editor__content[data-v-e5fdd0e6] h1,\n.markdown-editor__content[data-v-e5fdd0e6] h2,\n.markdown-editor__content[data-v-e5fdd0e6] h3,\n.markdown-editor__content[data-v-e5fdd0e6] h4 {\n margin: var(--spacing-lg) 0 var(--spacing-sm);\n font-weight: 700;\n color: var(--color-text-primary);\n}\n.markdown-editor__content[data-v-e5fdd0e6] h1 {\n font-size: var(--font-size-xl);\n}\n.markdown-editor__content[data-v-e5fdd0e6] h2 {\n font-size: var(--font-size-lg);\n}\n.markdown-editor__content[data-v-e5fdd0e6] h3 {\n font-size: var(--font-size-base);\n}\n.markdown-editor__content[data-v-e5fdd0e6] h4 {\n font-size: var(--font-size-sm);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: var(--color-text-secondary);\n}\n.markdown-editor__content[data-v-e5fdd0e6] p {\n margin: 0 0 var(--spacing-md);\n}\n.markdown-editor__content[data-v-e5fdd0e6] ul,\n.markdown-editor__content[data-v-e5fdd0e6] ol {\n margin: 0 0 var(--spacing-md);\n padding-left: var(--spacing-lg);\n}\n.markdown-editor__content[data-v-e5fdd0e6] li {\n margin: var(--spacing-xs) 0;\n}\n.markdown-editor__content[data-v-e5fdd0e6] blockquote {\n margin: var(--spacing-md) 0;\n padding: var(--spacing-sm) var(--spacing-md);\n border-left: 3px solid var(--color-border);\n color: var(--color-text-secondary);\n font-style: italic;\n}\n.markdown-editor__content[data-v-e5fdd0e6] code {\n font-family: var(--font-family-mono);\n font-size: 0.9em;\n padding: 1px 4px;\n background-color: var(--color-surface);\n border-radius: var(--radius-sm);\n}\n.markdown-editor__content[data-v-e5fdd0e6] pre {\n margin: var(--spacing-md) 0;\n padding: var(--spacing-md);\n background-color: var(--color-surface);\n border-radius: var(--radius-md);\n overflow-x: auto;\n}\n.markdown-editor__content[data-v-e5fdd0e6] pre code {\n padding: 0;\n background: none;\n}\n.markdown-editor__content[data-v-e5fdd0e6] a {\n color: var(--color-primary);\n text-decoration: underline;\n}\n.markdown-editor__content[data-v-e5fdd0e6] hr {\n border: 0;\n border-top: 1px solid var(--color-border);\n margin: var(--spacing-lg) 0;\n}\n.markdown-editor__content[data-v-e5fdd0e6] strong {\n font-weight: 700;\n}\n.markdown-editor__content[data-v-e5fdd0e6] table {\n border-collapse: collapse;\n margin: var(--spacing-md) 0;\n}\n.markdown-editor__content[data-v-e5fdd0e6] th,\n.markdown-editor__content[data-v-e5fdd0e6] td {\n border: 1px solid var(--color-border);\n padding: var(--spacing-xs) var(--spacing-sm);\n}\n.markdown-editor__content[data-v-e5fdd0e6] th {\n background-color: var(--color-surface);\n font-weight: 600;\n}\n";
21493
- const MarkdownEditor = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["styles", [_style_0$y]], ["__scopeId", "data-v-e5fdd0e6"]]);
21499
+ const _style_0$y = "\n.markdown-editor[data-v-b3d64419] {\n display: flex;\n flex-direction: column;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n line-height: var(--line-height);\n color: var(--color-text-primary);\n}\n.markdown-editor__toolbar[data-v-b3d64419] {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: var(--spacing-xs);\n padding: var(--spacing-xs) var(--spacing-md);\n border-bottom: 1px solid var(--color-border);\n background-color: var(--color-surface);\n position: sticky;\n top: 49px;\n z-index: 1;\n}\n.markdown-editor__separator[data-v-b3d64419] {\n width: 1px;\n height: 20px;\n background-color: var(--color-border);\n margin: 0 var(--spacing-xs);\n}\n.markdown-editor__content[data-v-b3d64419] {\n padding: 4rem clamp(1.5rem, 6rem, 8%);\n outline: none;\n min-height: 200px;\n}\n.markdown-editor__content[data-v-b3d64419] > *:first-child {\n margin-top: 0;\n}\n.markdown-editor__content[data-v-b3d64419] h1,\n.markdown-editor__content[data-v-b3d64419] h2,\n.markdown-editor__content[data-v-b3d64419] h3,\n.markdown-editor__content[data-v-b3d64419] h4 {\n margin: var(--spacing-lg) 0 var(--spacing-sm);\n font-weight: 700;\n color: var(--color-text-primary);\n}\n.markdown-editor__content[data-v-b3d64419] h1 {\n font-size: var(--font-size-xl);\n}\n.markdown-editor__content[data-v-b3d64419] h2 {\n font-size: var(--font-size-lg);\n}\n.markdown-editor__content[data-v-b3d64419] h3 {\n font-size: var(--font-size-base);\n}\n.markdown-editor__content[data-v-b3d64419] h4 {\n font-size: var(--font-size-sm);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: var(--color-text-secondary);\n}\n.markdown-editor__content[data-v-b3d64419] p {\n margin: 0 0 var(--spacing-md);\n}\n.markdown-editor__content[data-v-b3d64419] ul,\n.markdown-editor__content[data-v-b3d64419] ol {\n margin: 0 0 var(--spacing-md);\n padding-left: var(--spacing-lg);\n}\n.markdown-editor__content[data-v-b3d64419] li {\n margin: var(--spacing-xs) 0;\n}\n.markdown-editor__content[data-v-b3d64419] blockquote {\n margin: var(--spacing-md) 0;\n padding: var(--spacing-sm) var(--spacing-md);\n border-left: 3px solid var(--color-border);\n color: var(--color-text-secondary);\n font-style: italic;\n}\n.markdown-editor__content[data-v-b3d64419] code {\n font-family: var(--font-family-mono);\n font-size: 0.9em;\n padding: 1px 4px;\n background-color: var(--color-surface);\n border-radius: var(--radius-sm);\n}\n.markdown-editor__content[data-v-b3d64419] pre {\n margin: var(--spacing-md) 0;\n padding: var(--spacing-md);\n background-color: var(--color-surface);\n border-radius: var(--radius-md);\n overflow-x: auto;\n}\n.markdown-editor__content[data-v-b3d64419] pre code {\n padding: 0;\n background: none;\n}\n.markdown-editor__content[data-v-b3d64419] a {\n color: var(--color-primary);\n text-decoration: underline;\n}\n.markdown-editor__content[data-v-b3d64419] hr {\n border: 0;\n border-top: 1px solid var(--color-border);\n margin: var(--spacing-lg) 0;\n}\n.markdown-editor__content[data-v-b3d64419] strong {\n font-weight: 700;\n}\n.markdown-editor__content[data-v-b3d64419] table {\n border-collapse: collapse;\n margin: var(--spacing-md) 0;\n}\n.markdown-editor__content[data-v-b3d64419] th,\n.markdown-editor__content[data-v-b3d64419] td {\n border: 1px solid var(--color-border);\n padding: var(--spacing-xs) var(--spacing-sm);\n}\n.markdown-editor__content[data-v-b3d64419] th {\n background-color: var(--color-surface);\n font-weight: 600;\n}\n";
21500
+ const MarkdownEditor = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["styles", [_style_0$y]], ["__scopeId", "data-v-b3d64419"]]);
21494
21501
  const _hoisted_1$z = { class: "markdown-view" };
21495
21502
  const _hoisted_2$r = ["innerHTML"];
21496
21503
  const _sfc_main$F = /* @__PURE__ */ defineComponent({
@@ -21532,7 +21539,7 @@ const _hoisted_2$q = {
21532
21539
  key: 0,
21533
21540
  class: "transcript-ui-popover-list__divider"
21534
21541
  };
21535
- const _hoisted_3$l = { class: "transcript-ui-popover-list__footer" };
21542
+ const _hoisted_3$k = { class: "transcript-ui-popover-list__footer" };
21536
21543
  const _sfc_main$E = /* @__PURE__ */ defineComponent({
21537
21544
  __name: "PopoverList",
21538
21545
  props: {
@@ -21603,7 +21610,7 @@ const _sfc_main$E = /* @__PURE__ */ defineComponent({
21603
21610
  ])) : createCommentVNode("", true),
21604
21611
  _ctx.$slots.footer ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
21605
21612
  __props.items.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_2$q)) : createCommentVNode("", true),
21606
- createBaseVNode("div", _hoisted_3$l, [
21613
+ createBaseVNode("div", _hoisted_3$k, [
21607
21614
  renderSlot(_ctx.$slots, "footer")
21608
21615
  ])
21609
21616
  ], 64)) : createCommentVNode("", true)
@@ -21624,7 +21631,7 @@ const _hoisted_2$p = {
21624
21631
  key: 0,
21625
21632
  class: "selectable-list-item__leading"
21626
21633
  };
21627
- const _hoisted_3$k = { class: "selectable-list-item__label" };
21634
+ const _hoisted_3$j = { class: "selectable-list-item__label" };
21628
21635
  const _hoisted_4$b = {
21629
21636
  key: 1,
21630
21637
  class: "selectable-list-item__trailing"
@@ -21661,7 +21668,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
21661
21668
  _ctx.$slots.leading ? (openBlock(), createElementBlock("span", _hoisted_2$p, [
21662
21669
  renderSlot(_ctx.$slots, "leading", {}, void 0, true)
21663
21670
  ])) : createCommentVNode("", true),
21664
- createBaseVNode("span", _hoisted_3$k, [
21671
+ createBaseVNode("span", _hoisted_3$j, [
21665
21672
  renderSlot(_ctx.$slots, "default", {}, () => [
21666
21673
  createTextVNode(toDisplayString(__props.label), 1)
21667
21674
  ], true)
@@ -21698,7 +21705,7 @@ const _style_0$v = "\n.speaker-indicator[data-v-324978c0] {\n display: inline-b
21698
21705
  const SpeakerIndicator = /* @__PURE__ */ _export_sfc(_sfc_main$C, [["styles", [_style_0$v]], ["__scopeId", "data-v-324978c0"]]);
21699
21706
  const _hoisted_1$w = { class: "switch" };
21700
21707
  const _hoisted_2$o = ["id", "checked", "disabled"];
21701
- const _hoisted_3$j = ["for"];
21708
+ const _hoisted_3$i = ["for"];
21702
21709
  const _sfc_main$B = /* @__PURE__ */ defineComponent({
21703
21710
  __name: "SwitchToggle",
21704
21711
  props: {
@@ -21722,7 +21729,7 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
21722
21729
  }, null, 40, _hoisted_2$o),
21723
21730
  createBaseVNode("label", { for: unref(inputId) }, [..._cache[1] || (_cache[1] = [
21724
21731
  createBaseVNode("div", { class: "switch-slider" }, null, -1)
21725
- ])], 8, _hoisted_3$j)
21732
+ ])], 8, _hoisted_3$i)
21726
21733
  ]);
21727
21734
  };
21728
21735
  }
@@ -21763,7 +21770,7 @@ const _hoisted_2$n = {
21763
21770
  class: "document-article__toolbar",
21764
21771
  role: "toolbar"
21765
21772
  };
21766
- const _hoisted_3$i = { class: "document-article__toolbar-left" };
21773
+ const _hoisted_3$h = { class: "document-article__toolbar-left" };
21767
21774
  const _hoisted_4$a = { class: "document-article__toolbar-center" };
21768
21775
  const _hoisted_5$9 = { class: "document-article__toolbar-right" };
21769
21776
  const _hoisted_6$8 = { class: "document-article__body" };
@@ -21810,7 +21817,7 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
21810
21817
  "data-status": props.status
21811
21818
  }, [
21812
21819
  _ctx.$slots["toolbar-left"] || _ctx.$slots["toolbar-center"] || _ctx.$slots["toolbar-right"] ? (openBlock(), createElementBlock("div", _hoisted_2$n, [
21813
- createBaseVNode("div", _hoisted_3$i, [
21820
+ createBaseVNode("div", _hoisted_3$h, [
21814
21821
  renderSlot(_ctx.$slots, "toolbar-left", {}, void 0, true)
21815
21822
  ]),
21816
21823
  createBaseVNode("div", _hoisted_4$a, [
@@ -21851,8 +21858,8 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
21851
21858
  };
21852
21859
  }
21853
21860
  });
21854
- const _style_0$s = "\n.document-article[data-v-c606ad2f] {\n width: 100%;\n max-width: 760px;\n margin: var(--spacing-lg) auto;\n background-color: var(--color-surface);\n border: 1px solid var(--color-border);\n border-radius: var(--radius-md);\n display: flex;\n flex-direction: column;\n}\n.document-article__toolbar[data-v-c606ad2f] {\n display: flex;\n align-items: center;\n gap: var(--spacing-sm);\n padding: var(--spacing-sm) var(--spacing-md);\n border-bottom: 1px solid var(--color-border);\n position: sticky;\n top: 0;\n background-color: var(--color-surface);\n border-radius: var(--radius-md) var(--radius-md) 0 0;\n z-index: 1;\n}\n.document-article__toolbar-left[data-v-c606ad2f],\n.document-article__toolbar-right[data-v-c606ad2f] {\n display: flex;\n align-items: center;\n gap: var(--spacing-xs);\n flex-shrink: 0;\n}\n.document-article__toolbar-center[data-v-c606ad2f] {\n flex: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n min-width: 0;\n}\n.document-article__body[data-v-c606ad2f] {\n flex: 1;\n min-height: 0;\n}\n.document-article__center[data-v-c606ad2f] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-sm);\n padding: var(--spacing-xl) var(--spacing-md);\n text-align: center;\n}\n.document-article__center--processing[data-v-c606ad2f] {\n color: var(--color-primary);\n}\n.document-article__center--error[data-v-c606ad2f] {\n color: var(--color-danger, #d33);\n}\n.document-article__progress[data-v-c606ad2f] {\n width: min(280px, 100%);\n height: 6px;\n}\n.document-article__progress-value[data-v-c606ad2f] {\n font-size: var(--font-size-xs);\n font-variant-numeric: tabular-nums;\n color: var(--color-text-muted);\n}\n.document-article__error-text[data-v-c606ad2f] {\n margin: 0;\n max-width: 480px;\n font-size: var(--font-size-sm);\n line-height: var(--line-height);\n color: var(--color-text-secondary);\n}\n";
21855
- const DocumentArticle = /* @__PURE__ */ _export_sfc(_sfc_main$z, [["styles", [_style_0$s]], ["__scopeId", "data-v-c606ad2f"]]);
21861
+ const _style_0$s = "\n.document-article[data-v-e3f4ca33] {\n width: min(1088px, calc(100% - 16px));\n max-width: 1088px;\n margin: var(--spacing-lg) auto;\n background-color: var(--color-surface);\n border: 1px solid var(--color-border);\n border-radius: var(--radius-md);\n display: flex;\n flex-direction: column;\n}\n.document-article__toolbar[data-v-e3f4ca33] {\n display: flex;\n align-items: center;\n gap: var(--spacing-sm);\n padding: var(--spacing-sm) var(--spacing-md);\n border-bottom: 1px solid var(--color-border);\n position: sticky;\n top: 0;\n background-color: var(--color-surface);\n border-radius: var(--radius-md) var(--radius-md) 0 0;\n z-index: 1;\n}\n.document-article__toolbar-left[data-v-e3f4ca33],\n.document-article__toolbar-right[data-v-e3f4ca33] {\n display: flex;\n align-items: center;\n gap: var(--spacing-xs);\n flex-shrink: 0;\n}\n.document-article__toolbar-center[data-v-e3f4ca33] {\n flex: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n min-width: 0;\n}\n.document-article__body[data-v-e3f4ca33] {\n flex: 1;\n min-height: 0;\n}\n.document-article__center[data-v-e3f4ca33] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-sm);\n padding: var(--spacing-xl) var(--spacing-md);\n text-align: center;\n}\n.document-article__center--processing[data-v-e3f4ca33] {\n color: var(--color-primary);\n}\n.document-article__center--error[data-v-e3f4ca33] {\n color: var(--color-danger, #d33);\n}\n.document-article__progress[data-v-e3f4ca33] {\n width: min(280px, 100%);\n height: 6px;\n}\n.document-article__progress-value[data-v-e3f4ca33] {\n font-size: var(--font-size-xs);\n font-variant-numeric: tabular-nums;\n color: var(--color-text-muted);\n}\n.document-article__error-text[data-v-e3f4ca33] {\n margin: 0;\n max-width: 480px;\n font-size: var(--font-size-sm);\n line-height: var(--line-height);\n color: var(--color-text-secondary);\n}\n";
21862
+ const DocumentArticle = /* @__PURE__ */ _export_sfc(_sfc_main$z, [["styles", [_style_0$s]], ["__scopeId", "data-v-e3f4ca33"]]);
21856
21863
  const _sfc_main$y = /* @__PURE__ */ defineComponent({
21857
21864
  __name: "DownloadMenu",
21858
21865
  props: {
@@ -21933,7 +21940,7 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
21933
21940
  });
21934
21941
  const _hoisted_1$t = ["aria-label"];
21935
21942
  const _hoisted_2$m = ["aria-selected", "aria-disabled", "disabled", "onClick"];
21936
- const _hoisted_3$h = { class: "tab__label" };
21943
+ const _hoisted_3$g = { class: "tab__label" };
21937
21944
  const _sfc_main$w = /* @__PURE__ */ defineComponent({
21938
21945
  __name: "Tabs",
21939
21946
  props: {
@@ -21973,7 +21980,7 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
21973
21980
  size: 16,
21974
21981
  class: "tab__icon"
21975
21982
  }, null, 8, ["name"])) : createCommentVNode("", true),
21976
- createBaseVNode("span", _hoisted_3$h, toDisplayString(tab.label), 1),
21983
+ createBaseVNode("span", _hoisted_3$g, toDisplayString(tab.label), 1),
21977
21984
  tab.badge ? (openBlock(), createBlock(Badge, {
21978
21985
  key: 1,
21979
21986
  class: "tab__badge"
@@ -22110,7 +22117,7 @@ const _style_0$q = "\n.turn-text-editor[data-v-597e2575] {\n margin: 0;\n whit
22110
22117
  const TurnTextEditor = /* @__PURE__ */ _export_sfc(_sfc_main$v, [["styles", [_style_0$q]], ["__scopeId", "data-v-597e2575"]]);
22111
22118
  const _hoisted_1$r = { class: "editor-header" };
22112
22119
  const _hoisted_2$l = { class: "header-main" };
22113
- const _hoisted_3$g = { class: "document-title" };
22120
+ const _hoisted_3$f = { class: "document-title" };
22114
22121
  const _hoisted_4$9 = {
22115
22122
  key: 0,
22116
22123
  class: "document-meta"
@@ -22153,7 +22160,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
22153
22160
  return (_ctx, _cache) => {
22154
22161
  return openBlock(), createElementBlock("header", _hoisted_1$r, [
22155
22162
  createBaseVNode("div", _hoisted_2$l, [
22156
- createBaseVNode("h1", _hoisted_3$g, toDisplayString(formattedTitle.value), 1),
22163
+ createBaseVNode("h1", _hoisted_3$f, toDisplayString(formattedTitle.value), 1),
22157
22164
  metaParts.value.length ? (openBlock(), createElementBlock("div", _hoisted_4$9, [
22158
22165
  (openBlock(true), createElementBlock(Fragment, null, renderList(metaParts.value, (part, i2) => {
22159
22166
  return openBlock(), createElementBlock("span", {
@@ -23164,7 +23171,7 @@ const _hoisted_2$i = {
23164
23171
  key: 4,
23165
23172
  class: "turn-edit-actions"
23166
23173
  };
23167
- const _hoisted_3$f = ["role", "tabindex", "aria-label", "aria-disabled"];
23174
+ const _hoisted_3$e = ["role", "tabindex", "aria-label", "aria-disabled"];
23168
23175
  const _hoisted_4$8 = ["data-word-active"];
23169
23176
  const _sfc_main$p = /* @__PURE__ */ defineComponent({
23170
23177
  __name: "TranscriptionTurn",
@@ -23408,7 +23415,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
23408
23415
  }), 128)) : __props.turn.text ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
23409
23416
  createTextVNode(toDisplayString(__props.turn.text), 1)
23410
23417
  ], 64)) : createCommentVNode("", true)
23411
- ], 42, _hoisted_3$f))
23418
+ ], 42, _hoisted_3$e))
23412
23419
  ], 14, _hoisted_1$m);
23413
23420
  };
23414
23421
  }
@@ -23583,7 +23590,7 @@ const _hoisted_2$g = {
23583
23590
  ref: "scrollContainer",
23584
23591
  class: "scroll-container"
23585
23592
  };
23586
- const _hoisted_3$e = { class: "turns-container" };
23593
+ const _hoisted_3$d = { class: "turns-container" };
23587
23594
  const _hoisted_4$7 = {
23588
23595
  key: 0,
23589
23596
  class: "history-loading",
@@ -23692,7 +23699,7 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
23692
23699
  return (_ctx, _cache) => {
23693
23700
  return openBlock(), createElementBlock("article", _hoisted_1$j, [
23694
23701
  createBaseVNode("div", _hoisted_2$g, [
23695
- createBaseVNode("div", _hoisted_3$e, [
23702
+ createBaseVNode("div", _hoisted_3$d, [
23696
23703
  isLoadingHistory.value ? (openBlock(), createElementBlock("div", _hoisted_4$7, [..._cache[2] || (_cache[2] = [
23697
23704
  createBaseVNode("progress", null, null, -1)
23698
23705
  ])])) : createCommentVNode("", true),
@@ -23753,7 +23760,7 @@ const _style_0$j = "\n.transcription-panel[data-v-7f4303ed] {\n min-height: 0;\
23753
23760
  const TranscriptionPanel = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["styles", [_style_0$j]], ["__scopeId", "data-v-7f4303ed"]]);
23754
23761
  const _hoisted_1$i = { class: "verbatim-panel" };
23755
23762
  const _hoisted_2$f = { class: "verbatim-panel__content" };
23756
- const _hoisted_3$d = { class: "verbatim-panel__header" };
23763
+ const _hoisted_3$c = { class: "verbatim-panel__header" };
23757
23764
  const _hoisted_4$6 = { class: "verbatim-panel__doc-title" };
23758
23765
  const _hoisted_5$6 = { class: "verbatim-panel__turns" };
23759
23766
  const _hoisted_6$6 = { class: "verbatim-panel__turn-header" };
@@ -23823,7 +23830,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
23823
23830
  ]),
23824
23831
  default: withCtx(() => [
23825
23832
  createBaseVNode("article", _hoisted_2$f, [
23826
- createBaseVNode("header", _hoisted_3$d, [
23833
+ createBaseVNode("header", _hoisted_3$c, [
23827
23834
  createBaseVNode("h1", _hoisted_4$6, toDisplayString(title.value), 1)
23828
23835
  ]),
23829
23836
  createBaseVNode("ul", _hoisted_5$6, [
@@ -23861,8 +23868,8 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
23861
23868
  };
23862
23869
  }
23863
23870
  });
23864
- const _style_0$i = "\n.verbatim-panel[data-v-86e548c0] {\n display: flex;\n flex-direction: column;\n min-width: 0;\n min-height: 0;\n overflow-y: auto;\n}\n.verbatim-panel__content[data-v-86e548c0] {\n padding: var(--spacing-md) var(--spacing-lg);\n}\n.verbatim-panel__header[data-v-86e548c0] {\n margin-bottom: var(--spacing-lg);\n padding-bottom: var(--spacing-md);\n border-bottom: 1px solid var(--color-border);\n}\n.verbatim-panel__doc-title[data-v-86e548c0] {\n font-size: var(--font-size-xl);\n font-weight: 700;\n margin: 0;\n color: var(--color-text-primary);\n}\n.verbatim-panel__turns[data-v-86e548c0] {\n list-style: none;\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n gap: var(--spacing-lg);\n}\n.verbatim-panel__turn[data-v-86e548c0] {\n display: block;\n}\n.verbatim-panel__turn-header[data-v-86e548c0] {\n margin: 0 0 var(--spacing-xs);\n font-size: var(--font-size-base);\n line-height: 1.4;\n}\n.verbatim-panel__speaker-name[data-v-86e548c0] {\n font-weight: 700;\n color: var(--color-text-primary);\n}\n.verbatim-panel__meta[data-v-86e548c0] {\n color: var(--color-text-muted);\n font-weight: 400;\n}\n.verbatim-panel__sep[data-v-86e548c0] {\n margin: 0 0.35em;\n}\n.verbatim-panel__text[data-v-86e548c0] {\n margin: 0;\n font-size: var(--font-size-base);\n line-height: 1.6;\n color: var(--color-text-primary);\n}\n@media (max-width: 767px) {\n.verbatim-panel[data-v-86e548c0] {\n padding: var(--spacing-md);\n}\n}\n";
23865
- const VerbatimPanel = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["styles", [_style_0$i]], ["__scopeId", "data-v-86e548c0"]]);
23871
+ const _style_0$i = "\n.verbatim-panel[data-v-4bbe16ed] {\n display: flex;\n flex-direction: column;\n min-width: 0;\n min-height: 0;\n overflow-y: auto;\n}\n.verbatim-panel__content[data-v-4bbe16ed] {\n padding: 4rem clamp(1.5rem, 6rem, 8%);\n}\n.verbatim-panel__header[data-v-4bbe16ed] {\n margin-bottom: var(--spacing-lg);\n padding-bottom: var(--spacing-md);\n border-bottom: 1px solid var(--color-border);\n}\n.verbatim-panel__doc-title[data-v-4bbe16ed] {\n font-size: var(--font-size-xl);\n font-weight: 700;\n margin: 0;\n color: var(--color-text-primary);\n}\n.verbatim-panel__turns[data-v-4bbe16ed] {\n list-style: none;\n margin: 0;\n padding: 0;\n display: flex;\n flex-direction: column;\n gap: var(--spacing-lg);\n}\n.verbatim-panel__turn[data-v-4bbe16ed] {\n display: block;\n}\n.verbatim-panel__turn-header[data-v-4bbe16ed] {\n margin: 0 0 var(--spacing-xs);\n font-size: var(--font-size-base);\n line-height: 1.4;\n}\n.verbatim-panel__speaker-name[data-v-4bbe16ed] {\n font-weight: 700;\n color: var(--color-text-primary);\n}\n.verbatim-panel__meta[data-v-4bbe16ed] {\n color: var(--color-text-muted);\n font-weight: 400;\n}\n.verbatim-panel__sep[data-v-4bbe16ed] {\n margin: 0 0.35em;\n}\n.verbatim-panel__text[data-v-4bbe16ed] {\n margin: 0;\n font-size: var(--font-size-base);\n line-height: 1.6;\n color: var(--color-text-primary);\n}\n\n";
23872
+ const VerbatimPanel = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["styles", [_style_0$i]], ["__scopeId", "data-v-4bbe16ed"]]);
23866
23873
  const _sfc_main$k = /* @__PURE__ */ defineComponent({
23867
23874
  __name: "ChannelSelector",
23868
23875
  props: {
@@ -23923,7 +23930,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
23923
23930
  });
23924
23931
  const _hoisted_1$h = { class: "merge-dialog-title" };
23925
23932
  const _hoisted_2$e = { class: "merge-dialog-description" };
23926
- const _hoisted_3$c = { class: "merge-dialog-actions" };
23933
+ const _hoisted_3$b = { class: "merge-dialog-actions" };
23927
23934
  const _sfc_main$i = /* @__PURE__ */ defineComponent({
23928
23935
  __name: "MergeDialog",
23929
23936
  props: {
@@ -24004,7 +24011,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
24004
24011
  modelValue: targetId.value,
24005
24012
  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => targetId.value = $event)
24006
24013
  }, null, 8, ["field", "options", "modelValue"]),
24007
- createBaseVNode("div", _hoisted_3$c, [
24014
+ createBaseVNode("div", _hoisted_3$b, [
24008
24015
  createVNode(unref(Button), {
24009
24016
  variant: "tertiary",
24010
24017
  type: "button",
@@ -24038,7 +24045,7 @@ const _hoisted_2$d = {
24038
24045
  key: 0,
24039
24046
  class: "sidebar-section sidebar-section--selector"
24040
24047
  };
24041
- const _hoisted_3$b = { class: "sidebar-title" };
24048
+ const _hoisted_3$a = { class: "sidebar-title" };
24042
24049
  const _hoisted_4$5 = {
24043
24050
  key: 1,
24044
24051
  class: "sidebar-section sidebar-section--selector"
@@ -24173,7 +24180,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
24173
24180
  return (_ctx, _cache) => {
24174
24181
  return openBlock(), createElementBlock("aside", _hoisted_1$g, [
24175
24182
  __props.channels.length > 1 ? (openBlock(), createElementBlock("section", _hoisted_2$d, [
24176
- createBaseVNode("h2", _hoisted_3$b, toDisplayString(unref(t2)("sidebar.channel")), 1),
24183
+ createBaseVNode("h2", _hoisted_3$a, toDisplayString(unref(t2)("sidebar.channel")), 1),
24177
24184
  createVNode(_sfc_main$k, {
24178
24185
  channels: __props.channels,
24179
24186
  "selected-channel-id": __props.selectedChannelId,
@@ -24399,7 +24406,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
24399
24406
  });
24400
24407
  const _hoisted_1$f = ["aria-label"];
24401
24408
  const _hoisted_2$c = { class: "selection-count" };
24402
- const _hoisted_3$a = { class: "selection-actions" };
24409
+ const _hoisted_3$9 = { class: "selection-actions" };
24403
24410
  const _sfc_main$f = /* @__PURE__ */ defineComponent({
24404
24411
  __name: "SelectionActionBar",
24405
24412
  setup(__props) {
@@ -24413,7 +24420,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
24413
24420
  "aria-label": unref(t2)("selection.count")
24414
24421
  }, [
24415
24422
  createBaseVNode("span", _hoisted_2$c, toDisplayString(unref(selection).count.value) + " " + toDisplayString(unref(t2)("selection.count")), 1),
24416
- createBaseVNode("div", _hoisted_3$a, [
24423
+ createBaseVNode("div", _hoisted_3$9, [
24417
24424
  createVNode(unref(CopyButton), {
24418
24425
  icon: "clipboard-type",
24419
24426
  "copy-fn": unref(selection).copyText,
@@ -24468,8 +24475,7 @@ function useIsMobile() {
24468
24475
  return { isMobile };
24469
24476
  }
24470
24477
  const _hoisted_1$e = { class: "editor-layout" };
24471
- const _hoisted_2$b = { class: "editor-body" };
24472
- const _hoisted_3$9 = {
24478
+ const _hoisted_2$b = {
24473
24479
  key: 6,
24474
24480
  class: "mobile-selectors"
24475
24481
  };
@@ -24483,7 +24489,22 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
24483
24489
  const core = useCore();
24484
24490
  const { isMobile } = useIsMobile();
24485
24491
  const isSidebarOpen = /* @__PURE__ */ ref(false);
24486
- const activeTab = /* @__PURE__ */ ref(TRANSCRIPTION_TAB);
24492
+ const shownPanels = /* @__PURE__ */ ref([TRANSCRIPTION_TAB]);
24493
+ const activeTab = computed(() => shownPanels.value[0] ?? TRANSCRIPTION_TAB);
24494
+ const isSplit = computed({
24495
+ get: () => shownPanels.value.length > 1,
24496
+ set: (value) => {
24497
+ shownPanels.value = value ? [...shownPanels.value, VERBATIM_TAB] : shownPanels.value.filter((id) => id !== VERBATIM_TAB);
24498
+ }
24499
+ });
24500
+ const panels = computed(
24501
+ () => shownPanels.value.map((id) => {
24502
+ if (id === TRANSCRIPTION_TAB) return { id, kind: "transcription" };
24503
+ if (id === VERBATIM_TAB) return { id, kind: "verbatim" };
24504
+ const service = core.llmServices?.get(id);
24505
+ return service ? { id, kind: "service", service } : { id, kind: "transcription" };
24506
+ })
24507
+ );
24487
24508
  const activeTurns = computed(
24488
24509
  () => core.activeChannel.value?.activeTranslation.value.turns.value ?? []
24489
24510
  );
@@ -24498,11 +24519,6 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
24498
24519
  );
24499
24520
  const speakerList = computed(() => Array.from(speakers.values()));
24500
24521
  const showTranscription = computed(() => activeTab.value === TRANSCRIPTION_TAB);
24501
- const showVerbatim = computed(() => activeTab.value === VERBATIM_TAB);
24502
- const activeService = computed(() => {
24503
- if (showTranscription.value || showVerbatim.value) return null;
24504
- return core.llmServices?.get(activeTab.value) ?? null;
24505
- });
24506
24522
  watch(activeTab, (id) => {
24507
24523
  if (!core.llmServices) return;
24508
24524
  if (id === TRANSCRIPTION_TAB || id === VERBATIM_TAB) {
@@ -24515,7 +24531,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
24515
24531
  () => core.llmServices?.list.value.map((s2) => s2.id).join("|"),
24516
24532
  () => {
24517
24533
  if (activeTab.value !== TRANSCRIPTION_TAB && activeTab.value !== VERBATIM_TAB && !core.llmServices?.get(activeTab.value)) {
24518
- activeTab.value = TRANSCRIPTION_TAB;
24534
+ shownPanels.value = [TRANSCRIPTION_TAB];
24519
24535
  }
24520
24536
  }
24521
24537
  );
@@ -24557,25 +24573,35 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
24557
24573
  onRedo: _cache[3] || (_cache[3] = ($event) => unref(core).transcriptionEditor?.redo())
24558
24574
  }, null, 8, ["title", "date", "duration", "speaker-count", "is-mobile", "can-ask", "can-undo", "can-redo"])) : createCommentVNode("", true),
24559
24575
  createVNode(_sfc_main$t, {
24560
- modelValue: activeTab.value,
24561
- "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => activeTab.value = $event)
24562
- }, null, 8, ["modelValue"]),
24576
+ "model-value": activeTab.value,
24577
+ "onUpdate:modelValue": _cache[4] || (_cache[4] = (tab) => shownPanels.value = [tab])
24578
+ }, null, 8, ["model-value"]),
24563
24579
  showTranscription.value ? (openBlock(), createBlock(SelectionActionBar, { key: 1 })) : createCommentVNode("", true),
24564
- createBaseVNode("main", _hoisted_2$b, [
24565
- showTranscription.value ? (openBlock(), createBlock(TranscriptionPanel, {
24580
+ createBaseVNode("main", {
24581
+ class: normalizeClass(["editor-body", { "editor-body--no-sidebar": panels.value.length > 1 }])
24582
+ }, [
24583
+ createBaseVNode("div", {
24584
+ class: normalizeClass(["editor-body__panels", { "editor-body__panels--split": panels.value.length > 1 }])
24585
+ }, [
24586
+ (openBlock(true), createElementBlock(Fragment, null, renderList(panels.value, (panel) => {
24587
+ return openBlock(), createElementBlock(Fragment, {
24588
+ key: panel.id
24589
+ }, [
24590
+ panel.kind === "transcription" ? (openBlock(), createBlock(TranscriptionPanel, {
24591
+ key: 0,
24592
+ turns: activeTurns.value,
24593
+ speakers: unref(speakers)
24594
+ }, null, 8, ["turns", "speakers"])) : panel.kind === "verbatim" ? (openBlock(), createBlock(VerbatimPanel, { key: 1 })) : (openBlock(), createBlock(resolveDynamicComponent(unref(core).components.llmServicePanel), {
24595
+ key: 2,
24596
+ service: panel.service,
24597
+ split: isSplit.value,
24598
+ "onUpdate:split": _cache[5] || (_cache[5] = ($event) => isSplit.value = $event)
24599
+ }, null, 40, ["service", "split"]))
24600
+ ], 64);
24601
+ }), 128))
24602
+ ], 2),
24603
+ !unref(isMobile) && panels.value.length === 1 ? (openBlock(), createBlock(SpeakerSidebar, {
24566
24604
  key: 0,
24567
- turns: activeTurns.value,
24568
- speakers: unref(speakers)
24569
- }, null, 8, ["turns", "speakers"])) : showVerbatim.value ? (openBlock(), createBlock(VerbatimPanel, { key: 1 })) : activeService.value ? (openBlock(), createBlock(resolveDynamicComponent(unref(core).components.llmServicePanel), {
24570
- key: activeService.value.id,
24571
- service: activeService.value
24572
- }, null, 8, ["service"])) : (openBlock(), createBlock(TranscriptionPanel, {
24573
- key: 3,
24574
- turns: activeTurns.value,
24575
- speakers: unref(speakers)
24576
- }, null, 8, ["turns", "speakers"])),
24577
- !unref(isMobile) ? (openBlock(), createBlock(SpeakerSidebar, {
24578
- key: 4,
24579
24605
  speakers: speakerList.value,
24580
24606
  channels: channels.value,
24581
24607
  "selected-channel-id": unref(core).activeChannelId.value,
@@ -24585,10 +24611,10 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
24585
24611
  "onUpdate:selectedChannelId": onChannelChange,
24586
24612
  "onUpdate:selectedTranslationId": onTranslationChange
24587
24613
  }, null, 8, ["speakers", "channels", "selected-channel-id", "translations", "selected-translation-id", "show-speakers"])) : createCommentVNode("", true),
24588
- unref(isMobile) ? (openBlock(), createBlock(_sfc_main$g, {
24589
- key: 5,
24614
+ unref(isMobile) && panels.value.length === 1 ? (openBlock(), createBlock(_sfc_main$g, {
24615
+ key: 1,
24590
24616
  open: isSidebarOpen.value,
24591
- "onUpdate:open": _cache[5] || (_cache[5] = ($event) => isSidebarOpen.value = $event)
24617
+ "onUpdate:open": _cache[6] || (_cache[6] = ($event) => isSidebarOpen.value = $event)
24592
24618
  }, {
24593
24619
  default: withCtx(() => [
24594
24620
  createVNode(SpeakerSidebar, {
@@ -24604,7 +24630,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
24604
24630
  ]),
24605
24631
  _: 1
24606
24632
  }, 8, ["open"])) : createCommentVNode("", true)
24607
- ]),
24633
+ ], 2),
24608
24634
  unref(core).audio?.src.value ? withDirectives((openBlock(), createBlock(resolveDynamicComponent(unref(core).components.player), {
24609
24635
  key: 2,
24610
24636
  "audio-src": unref(core).audio.src.value
@@ -24614,7 +24640,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
24614
24640
  unref(core).subtitle?.isVisible.value && !unref(isMobile) && !unref(core).subtitle.isFullscreen.value ? (openBlock(), createBlock(resolveDynamicComponent(unref(core).components.subtitleBanner), { key: 3 })) : createCommentVNode("", true),
24615
24641
  unref(core).subtitle?.isFullscreen.value ? (openBlock(), createBlock(resolveDynamicComponent(unref(core).components.subtitleFullscreen), { key: 4 })) : createCommentVNode("", true),
24616
24642
  unref(core).chat ? (openBlock(), createBlock(resolveDynamicComponent(unref(core).components.chatDrawer), { key: 5 })) : createCommentVNode("", true),
24617
- unref(isMobile) && (channels.value.length > 1 || translations.value.length > 1) ? (openBlock(), createElementBlock("div", _hoisted_3$9, [
24643
+ unref(isMobile) && (channels.value.length > 1 || translations.value.length > 1) ? (openBlock(), createElementBlock("div", _hoisted_2$b, [
24618
24644
  channels.value.length > 1 ? (openBlock(), createBlock(_sfc_main$k, {
24619
24645
  key: 0,
24620
24646
  channels: channels.value,
@@ -24632,8 +24658,8 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
24632
24658
  };
24633
24659
  }
24634
24660
  });
24635
- const _style_0$e = "\n.editor-layout[data-v-70777145] {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden;\n background-color: var(--color-background);\n}\n.editor-body[data-v-70777145] {\n display: grid;\n grid-template-columns: 1fr var(--sidebar-width);\n flex: 1;\n min-height: 0;\n}\n.mobile-selectors[data-v-70777145] {\n display: flex;\n gap: var(--spacing-sm);\n padding: var(--spacing-sm) var(--spacing-md);\n border-top: 1px solid var(--color-border);\n background-color: var(--color-surface);\n flex-shrink: 0;\n box-shadow: var(--shadow-md);\n align-items: end;\n}\n.mobile-selectors[data-v-70777145] > * {\n flex: 1;\n min-width: 0;\n}\n@media (max-width: 767px) {\n.editor-body[data-v-70777145] {\n grid-template-columns: 1fr;\n}\n}\n";
24636
- const Layout = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["styles", [_style_0$e]], ["__scopeId", "data-v-70777145"]]);
24661
+ const _style_0$e = "\n.editor-layout[data-v-ca7b1d66] {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden;\n background-color: var(--color-background);\n}\n.editor-body[data-v-ca7b1d66] {\n display: grid;\n grid-template-columns: 1fr var(--sidebar-width);\n flex: 1;\n min-height: 0;\n}\n\n/* Split mode: two panels already share the body between them, no room (or\n need) for the speaker sidebar too — see Layout's panels/isSplit state. */\n.editor-body--no-sidebar[data-v-ca7b1d66] {\n grid-template-columns: 1fr;\n}\n.editor-body__panels[data-v-ca7b1d66] {\n display: flex;\n min-width: 0;\n min-height: 0;\n}\n.editor-body__panels[data-v-ca7b1d66] > * {\n flex: 1;\n min-width: 0;\n}\n.editor-body__panels--split[data-v-ca7b1d66] > * + * {\n border-left: 1px solid var(--color-border);\n}\n.mobile-selectors[data-v-ca7b1d66] {\n display: flex;\n gap: var(--spacing-sm);\n padding: var(--spacing-sm) var(--spacing-md);\n border-top: 1px solid var(--color-border);\n background-color: var(--color-surface);\n flex-shrink: 0;\n box-shadow: var(--shadow-md);\n align-items: end;\n}\n.mobile-selectors[data-v-ca7b1d66] > * {\n flex: 1;\n min-width: 0;\n}\n@media (max-width: 767px) {\n.editor-body[data-v-ca7b1d66] {\n grid-template-columns: 1fr;\n}\n}\n";
24662
+ const Layout = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["styles", [_style_0$e]], ["__scopeId", "data-v-ca7b1d66"]]);
24637
24663
  const _hoisted_1$d = {
24638
24664
  class: "editor-loading",
24639
24665
  role: "status",
@@ -24757,7 +24783,333 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
24757
24783
  };
24758
24784
  }
24759
24785
  });
24760
- const _style_0$b = '/* Atkinson Hyperlegible Next — main font */\n@font-face {\n font-family: "Atkinson Hyperlegible Next";\n font-style: normal;\n font-weight: 400;\n font-display: swap;\n src: url("/fonts/AtkinsonHyperlegibleNext-Regular.woff2") format("woff2");\n}\n@font-face {\n font-family: "Atkinson Hyperlegible Next";\n font-style: normal;\n font-weight: 500;\n font-display: swap;\n src: url("/fonts/AtkinsonHyperlegibleNext-Medium.woff2") format("woff2");\n}\n@font-face {\n font-family: "Atkinson Hyperlegible Next";\n font-style: normal;\n font-weight: 600;\n font-display: swap;\n src: url("/fonts/AtkinsonHyperlegibleNext-SemiBold.woff2") format("woff2");\n}\n@font-face {\n font-family: "Atkinson Hyperlegible Next";\n font-style: normal;\n font-weight: 700;\n font-display: swap;\n src: url("/fonts/AtkinsonHyperlegibleNext-Bold.woff2") format("woff2");\n}\n\n/* Atkinson Hyperlegible Mono — monospace font */\n@font-face {\n font-family: "Atkinson Hyperlegible Mono";\n font-style: normal;\n font-weight: 400;\n font-display: swap;\n src: url("/fonts/AtkinsonHyperlegibleMono-Regular.woff2") format("woff2");\n}\n@font-face {\n font-family: "Atkinson Hyperlegible Mono";\n font-style: normal;\n font-weight: 500;\n font-display: swap;\n src: url("/fonts/AtkinsonHyperlegibleMono-Medium.woff2") format("woff2");\n}\n/*\n * Design tokens\n *\n * Public theming API — these CSS custom properties can be overridden from\n * outside the web component by setting them on the <linto-editor> element:\n *\n * linto-editor {\n * --color-primary: #e63946;\n * --color-background: #fafafa;\n * }\n *\n * Colors:\n * --color-primary Accent / brand color\n * --color-primary-hover Primary hover state\n * --color-background Page background\n * --color-surface Cards, panels, player\n * --color-surface-hover Hover on surfaces\n * --color-text-primary Main text\n * --color-text-secondary Secondary text (timestamps…)\n * --color-text-muted Muted text (labels)\n * --color-border Borders\n * --color-border-light Light borders\n *\n * Typography, spacing, radius, and shadows are also overridable.\n *\n * Scoped to .transcript-ui-root (the embedder\'s root element) instead of\n * :root — until the web-component wrapper puts this behind a real Shadow\n * DOM, `:root`/`body`/`*` here would leak straight onto the host app\'s own\n * page (its tokens, its font, its box-sizing reset on every element). :host\n * stays for that future shadow-root case.\n */\n.transcript-ui-root,\n:host {\n /* Colors — light theme */\n --color-background: #f8f9fa;\n --color-surface: #ffffff;\n --color-surface-hover: #f1f3f5;\n --color-text-primary: #1a1d21;\n --color-text-secondary: #495057;\n --color-text-muted: #6c757d;\n --color-primary: #4263eb;\n --color-primary-hover: #3b5bdb;\n --color-border: #dee2e6;\n --color-border-light: #e9ecef;\n --color-white: #ffffff;\n --color-black: #000000;\n --color-danger: #e53935;\n --color-danger-hover: #c62828;\n --color-danger-soft: #fdecea;\n\n /* Typography */\n --font-family:\n "Atkinson Hyperlegible Next", system-ui, -apple-system, sans-serif;\n --font-family-mono: "Atkinson Hyperlegible Mono", ui-monospace, monospace;\n --font-size-xs: 0.875rem;\n --font-size-sm: 1rem;\n --font-size-base: 1.125rem;\n --font-size-lg: 1.25rem;\n --font-size-xl: 1.75rem;\n --line-height: 1.6;\n\n /* Spacing */\n --spacing-xxs: 0.125rem;\n --spacing-xs: 0.25rem;\n --spacing-sm: 0.5rem;\n --spacing-md: 1rem;\n --spacing-lg: 1.5rem;\n --spacing-xl: 2rem;\n\n /* Radius */\n --radius-sm: 4px;\n --radius-md: 8px;\n --radius-lg: 12px;\n\n /* Layout */\n --sidebar-width: 300px;\n --header-height: 56px;\n\n /* Shadows */\n --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.1);\n --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.15);\n\n /* Transitions */\n --transition-duration: 150ms;\n\n /* Z-index scale */\n --z-sticky: 10;\n --z-overlay: 50;\n --z-drawer: 1000;\n --z-dropdown: 1100;\n\n /* Glass effect — backdrop blur intentionally removed: each backdrop-filter\n forces a WebRender render target, which on long transcripts (one waveform\n region per turn, tall scroll container) balloons GPU memory to several GB\n and freezes weaker machines. Keep the semi-opaque background only. */\n --glass-background: rgba(255, 255, 255, 0.8);\n --glass-border: rgba(255, 255, 255, 0.3);\n}\n.transcript-ui-root,\n:host {\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n line-height: var(--line-height);\n color: var(--color-text-primary);\n background-color: var(--color-background);\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n:host {\n display: block;\n height: 100%;\n overflow: hidden;\n}\n\n/* Reset, scoped to our own subtree so the host app\'s elements outside\n .transcript-ui-root keep their own margin/padding/box-sizing. */\n.transcript-ui-root,\n.transcript-ui-root *,\n.transcript-ui-root *::before,\n.transcript-ui-root *::after {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n}\n\n/* Dev mode SPA (ignored in Shadow DOM — these elements don\'t exist) */\nhtml,\nbody {\n height: 100%;\n overflow: hidden;\n}\n#app {\n height: 100%;\n overflow: hidden;\n}\n/* Utility */\n.transcript-ui-sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n}\n\n/* Overlay (shared by sidebar drawer + sheet select) */\n.transcript-ui-overlay {\n position: fixed;\n inset: 0;\n background-color: rgba(0, 0, 0, 0.4);\n z-index: var(--z-overlay);\n animation: transcript-ui-overlay-fade-in 200ms ease;\n}\n\n/* Drawer mobile (sidebar) */\n.transcript-ui-sidebar-drawer {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n width: min(320px, 85vw);\n z-index: var(--z-drawer);\n background-color: var(--color-surface);\n box-shadow: var(--shadow-md);\n animation: transcript-ui-drawer-slide-in 250ms ease;\n overflow-y: auto;\n display: flex;\n flex-direction: column;\n}\n.transcript-ui-sidebar-close {\n position: absolute;\n top: var(--spacing-sm);\n right: var(--spacing-sm);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n border: none;\n background: none;\n color: var(--color-text-muted);\n border-radius: var(--radius-md);\n cursor: pointer;\n z-index: 1;\n}\n.transcript-ui-sidebar-close:hover {\n background-color: var(--color-surface-hover);\n color: var(--color-text-primary);\n}\n\n/* Keyframes */\n@keyframes transcript-ui-overlay-fade-in {\nfrom {\n opacity: 0;\n}\nto {\n opacity: 1;\n}\n}\n@keyframes transcript-ui-drawer-slide-in {\nfrom {\n translate: 100% 0;\n}\nto {\n translate: 0 0;\n}\n}\n@media (prefers-reduced-motion: reduce) {\n.transcript-ui-overlay,\n .transcript-ui-sidebar-drawer {\n animation: none;\n}\n}\n\n/* Wavesurfer ::part (cannot work in scoped styles) */\n/* No backdrop-filter: there is one region per turn (hundreds on a long\n transcript), and each backdrop-filter forces a separate WebRender backdrop\n render target — on a multi-hour document this balloons GPU/GTT memory to\n several GB and freezes weaker machines. The border/shadow alone read fine. */\n.transcript-ui-waveform-container ::part(region) {\n border-top: 2px solid var(--region-color, rgba(255, 255, 255, 0.4));\n border-bottom: 1px solid var(--region-color, rgba(255, 255, 255, 0.4));\n box-shadow:\n inset 0 1px 0 rgba(255, 255, 255, 0.2),\n 0 1px 4px rgba(0, 0, 0, 0.1);\n}\n\n/* Turn nodes use `content-visibility: auto` for long-document perf, which\n implies paint containment and clips any overflow to the turn\'s box. The\n speaker popover floats out of the turn, so it gets cut off at the turn\'s\n bottom edge. While its trigger is open (Reka sets data-state="open"), drop\n the containment on that turn so the popover can overflow freely. The turn is\n on-screen when open, so lifting content-visibility causes no layout shift.\n Global (not scoped) because the open trigger is rendered by another\n component, so a scoped :has() selector would not match it. */\nsection.turn:has([data-state="open"]) {\n content-visibility: visible;\n}\n/* Shared surface and row styles for PopoverList and similar anchored panels.\n Kept global because Reka portals render outside the component\'s scoped\n CSS boundary. */\n.transcript-ui-root .transcript-ui-popover-list {\n min-width: 180px;\n padding: var(--spacing-xs);\n background-color: var(--color-surface);\n border: 1px solid var(--color-border);\n border-radius: var(--radius-md);\n box-shadow: 0 8px 24px\n color-mix(in srgb, var(--color-text-primary) 15%, transparent);\n z-index: 50;\n}\n.transcript-ui-root .transcript-ui-popover-list__items {\n list-style: none;\n display: flex;\n flex-direction: column;\n gap: 2px;\n margin: 0;\n padding: 0;\n max-height: 280px;\n overflow-y: auto;\n}\n.transcript-ui-root .transcript-ui-popover-list__item {\n all: unset;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n gap: var(--spacing-sm);\n width: 100%;\n padding: var(--spacing-xs) var(--spacing-sm);\n border-radius: var(--radius-sm);\n font-size: var(--font-size-sm);\n color: var(--color-text-primary);\n cursor: pointer;\n}\n.transcript-ui-root .transcript-ui-popover-list__item:hover,\n.transcript-ui-root .transcript-ui-popover-list__item[data-highlighted] {\n background-color: var(--color-surface-hover);\n}\n.transcript-ui-root .transcript-ui-popover-list__item:focus-visible {\n outline: 2px solid var(--color-primary);\n outline-offset: -2px;\n}\n.transcript-ui-root .transcript-ui-popover-list__item--current {\n background-color: color-mix(\n in srgb,\n var(--color-primary) 10%,\n transparent\n );\n}\n.transcript-ui-root .transcript-ui-popover-list__divider {\n height: 1px;\n background-color: var(--color-border);\n margin: var(--spacing-xs) 0;\n}\n.transcript-ui-root .transcript-ui-popover-list__footer {\n padding: var(--spacing-xs);\n}\n\n/* Positioning context for the absolute loading overlay. */\n.transcript-ui-root {\n position: relative;\n height: 100%;\n}\n';
24786
+ const _style_0$b = `
24787
+ /* NOT fonts.css: a @font-face declared inside a shadow root isn't reliably
24788
+ * applied by browsers (document.fonts never registers it) — dead weight in
24789
+ * the webcomponent bundle specifically, which always runs shadow-DOM'd. The
24790
+ * host declares --font-family's actual font at document level instead (see
24791
+ * variables.css's token doc). A direct, non-shadow-DOM Vue embedder of this
24792
+ * package (no such limitation) can still opt in: \`@import
24793
+ * "@linto-ai/transcript-ui-ui/styles/fonts.css"\` themselves. */
24794
+ /*
24795
+ * Design tokens
24796
+ *
24797
+ * Public theming API — these CSS custom properties can be overridden from
24798
+ * outside the web component by setting them on the <linto-editor> element:
24799
+ *
24800
+ * linto-editor {
24801
+ * --color-primary: #e63946;
24802
+ * --color-background: #fafafa;
24803
+ * }
24804
+ *
24805
+ * Colors:
24806
+ * --color-primary Accent / brand color
24807
+ * --color-primary-hover Primary hover state
24808
+ * --color-background Page background
24809
+ * --color-surface Cards, panels, player
24810
+ * --color-surface-hover Hover on surfaces
24811
+ * --color-text-primary Main text
24812
+ * --color-text-secondary Secondary text (timestamps…)
24813
+ * --color-text-muted Muted text (labels)
24814
+ * --color-border Borders
24815
+ * --color-border-light Light borders
24816
+ *
24817
+ * Typography, spacing, radius, and shadows are also overridable.
24818
+ *
24819
+ * --font-family names "Atkinson Hyperlegible Next" as the design's actual
24820
+ * font, but this package does NOT ship or load it (see fonts.css, an opt-in
24821
+ * file for a direct — non-shadow-DOM — Vue embedder; the webcomponent
24822
+ * doesn't import it at all). A @font-face declared inside a shadow root
24823
+ * isn't reliably applied by browsers, so shipping it there was dead weight.
24824
+ * A host that wants the exact intended look declares the @font-face itself,
24825
+ * at document level (outside any shadow root) — see fonts.css for the
24826
+ * ready-made rules to copy, and studio-frontend's public/fonts/atkinson.css
24827
+ * for a real example. Without it, --font-family's own fallback chain
24828
+ * (system-ui, -apple-system, sans-serif) applies — never broken, just not
24829
+ * the exact intended type.
24830
+ *
24831
+ * Scoped to .transcript-ui-root (the embedder's root element) instead of
24832
+ * :root — until the web-component wrapper puts this behind a real Shadow
24833
+ * DOM, \`:root\`/\`body\`/\`*\` here would leak straight onto the host app's own
24834
+ * page (its tokens, its font, its box-sizing reset on every element). :host
24835
+ * stays for that future shadow-root case.
24836
+ */
24837
+ .transcript-ui-root,
24838
+ :host {
24839
+ /* Colors — light theme */
24840
+ --color-background: #f8f9fa;
24841
+ --color-surface: #ffffff;
24842
+ --color-surface-hover: #f1f3f5;
24843
+ --color-text-primary: #1a1d21;
24844
+ --color-text-secondary: #495057;
24845
+ --color-text-muted: #6c757d;
24846
+ --color-primary: #4263eb;
24847
+ --color-primary-hover: #3b5bdb;
24848
+ --color-border: #dee2e6;
24849
+ --color-border-light: #e9ecef;
24850
+ --color-white: #ffffff;
24851
+ --color-black: #000000;
24852
+ --color-danger: #e53935;
24853
+ --color-danger-hover: #c62828;
24854
+ --color-danger-soft: #fdecea;
24855
+
24856
+ /* Typography */
24857
+ --font-family:
24858
+ "Atkinson Hyperlegible Next", system-ui, -apple-system, sans-serif;
24859
+ --font-family-mono: "Atkinson Hyperlegible Mono", ui-monospace, monospace;
24860
+ --font-size-xs: 0.875rem;
24861
+ --font-size-sm: 1rem;
24862
+ --font-size-base: 1.125rem;
24863
+ --font-size-lg: 1.25rem;
24864
+ --font-size-xl: 1.75rem;
24865
+ --line-height: 1.6;
24866
+
24867
+ /* Spacing */
24868
+ --spacing-xxs: 0.125rem;
24869
+ --spacing-xs: 0.25rem;
24870
+ --spacing-sm: 0.5rem;
24871
+ --spacing-md: 1rem;
24872
+ --spacing-lg: 1.5rem;
24873
+ --spacing-xl: 2rem;
24874
+
24875
+ /* Radius */
24876
+ --radius-sm: 4px;
24877
+ --radius-md: 8px;
24878
+ --radius-lg: 12px;
24879
+
24880
+ /* Layout */
24881
+ --sidebar-width: 300px;
24882
+ --header-height: 56px;
24883
+
24884
+ /* Shadows */
24885
+ --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.1);
24886
+ --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.15);
24887
+
24888
+ /* Transitions */
24889
+ --transition-duration: 150ms;
24890
+
24891
+ /* Z-index scale */
24892
+ --z-sticky: 10;
24893
+ --z-overlay: 50;
24894
+ --z-drawer: 1000;
24895
+ --z-dropdown: 1100;
24896
+
24897
+ /* Glass effect — backdrop blur intentionally removed: each backdrop-filter
24898
+ forces a WebRender render target, which on long transcripts (one waveform
24899
+ region per turn, tall scroll container) balloons GPU memory to several GB
24900
+ and freezes weaker machines. Keep the semi-opaque background only. */
24901
+ --glass-background: rgba(255, 255, 255, 0.8);
24902
+ --glass-border: rgba(255, 255, 255, 0.3);
24903
+ }
24904
+ .transcript-ui-root,
24905
+ :host {
24906
+ font-family: var(--font-family);
24907
+ font-size: var(--font-size-base);
24908
+ line-height: var(--line-height);
24909
+ color: var(--color-text-primary);
24910
+ background-color: var(--color-background);
24911
+ -webkit-font-smoothing: antialiased;
24912
+ -moz-osx-font-smoothing: grayscale;
24913
+ }
24914
+ :host {
24915
+ display: block;
24916
+ height: 100%;
24917
+ overflow: hidden;
24918
+ }
24919
+
24920
+ /* Reset, scoped to our own subtree so the host app's elements outside
24921
+ .transcript-ui-root keep their own margin/padding/box-sizing. */
24922
+ .transcript-ui-root,
24923
+ .transcript-ui-root *,
24924
+ .transcript-ui-root *::before,
24925
+ .transcript-ui-root *::after {
24926
+ box-sizing: border-box;
24927
+ margin: 0;
24928
+ padding: 0;
24929
+ }
24930
+
24931
+ /* Dev mode SPA (ignored in Shadow DOM — these elements don't exist) */
24932
+ html,
24933
+ body {
24934
+ height: 100%;
24935
+ overflow: hidden;
24936
+ }
24937
+ #app {
24938
+ height: 100%;
24939
+ overflow: hidden;
24940
+ }
24941
+ /* Utility */
24942
+ .transcript-ui-sr-only {
24943
+ position: absolute;
24944
+ width: 1px;
24945
+ height: 1px;
24946
+ padding: 0;
24947
+ margin: -1px;
24948
+ overflow: hidden;
24949
+ clip: rect(0, 0, 0, 0);
24950
+ white-space: nowrap;
24951
+ border-width: 0;
24952
+ }
24953
+
24954
+ /* Overlay (shared by sidebar drawer + sheet select) */
24955
+ .transcript-ui-overlay {
24956
+ position: fixed;
24957
+ inset: 0;
24958
+ background-color: rgba(0, 0, 0, 0.4);
24959
+ z-index: var(--z-overlay);
24960
+ animation: transcript-ui-overlay-fade-in 200ms ease;
24961
+ }
24962
+
24963
+ /* Drawer mobile (sidebar) */
24964
+ .transcript-ui-sidebar-drawer {
24965
+ position: fixed;
24966
+ top: 0;
24967
+ right: 0;
24968
+ bottom: 0;
24969
+ width: min(320px, 85vw);
24970
+ z-index: var(--z-drawer);
24971
+ background-color: var(--color-surface);
24972
+ box-shadow: var(--shadow-md);
24973
+ animation: transcript-ui-drawer-slide-in 250ms ease;
24974
+ overflow-y: auto;
24975
+ display: flex;
24976
+ flex-direction: column;
24977
+ }
24978
+ .transcript-ui-sidebar-close {
24979
+ position: absolute;
24980
+ top: var(--spacing-sm);
24981
+ right: var(--spacing-sm);
24982
+ display: inline-flex;
24983
+ align-items: center;
24984
+ justify-content: center;
24985
+ width: 32px;
24986
+ height: 32px;
24987
+ border: none;
24988
+ background: none;
24989
+ color: var(--color-text-muted);
24990
+ border-radius: var(--radius-md);
24991
+ cursor: pointer;
24992
+ z-index: 1;
24993
+ }
24994
+ .transcript-ui-sidebar-close:hover {
24995
+ background-color: var(--color-surface-hover);
24996
+ color: var(--color-text-primary);
24997
+ }
24998
+
24999
+ /* Keyframes */
25000
+ @keyframes transcript-ui-overlay-fade-in {
25001
+ from {
25002
+ opacity: 0;
25003
+ }
25004
+ to {
25005
+ opacity: 1;
25006
+ }
25007
+ }
25008
+ @keyframes transcript-ui-drawer-slide-in {
25009
+ from {
25010
+ translate: 100% 0;
25011
+ }
25012
+ to {
25013
+ translate: 0 0;
25014
+ }
25015
+ }
25016
+ @media (prefers-reduced-motion: reduce) {
25017
+ .transcript-ui-overlay,
25018
+ .transcript-ui-sidebar-drawer {
25019
+ animation: none;
25020
+ }
25021
+ }
25022
+
25023
+ /* Wavesurfer ::part (cannot work in scoped styles) */
25024
+ /* No backdrop-filter: there is one region per turn (hundreds on a long
25025
+ transcript), and each backdrop-filter forces a separate WebRender backdrop
25026
+ render target — on a multi-hour document this balloons GPU/GTT memory to
25027
+ several GB and freezes weaker machines. The border/shadow alone read fine. */
25028
+ .transcript-ui-waveform-container ::part(region) {
25029
+ border-top: 2px solid var(--region-color, rgba(255, 255, 255, 0.4));
25030
+ border-bottom: 1px solid var(--region-color, rgba(255, 255, 255, 0.4));
25031
+ box-shadow:
25032
+ inset 0 1px 0 rgba(255, 255, 255, 0.2),
25033
+ 0 1px 4px rgba(0, 0, 0, 0.1);
25034
+ }
25035
+
25036
+ /* Turn nodes use \`content-visibility: auto\` for long-document perf, which
25037
+ implies paint containment and clips any overflow to the turn's box. The
25038
+ speaker popover floats out of the turn, so it gets cut off at the turn's
25039
+ bottom edge. While its trigger is open (Reka sets data-state="open"), drop
25040
+ the containment on that turn so the popover can overflow freely. The turn is
25041
+ on-screen when open, so lifting content-visibility causes no layout shift.
25042
+ Global (not scoped) because the open trigger is rendered by another
25043
+ component, so a scoped :has() selector would not match it. */
25044
+ section.turn:has([data-state="open"]) {
25045
+ content-visibility: visible;
25046
+ }
25047
+ /* Shared surface and row styles for PopoverList and similar anchored panels.
25048
+ Kept global because Reka portals render outside the component's scoped
25049
+ CSS boundary. */
25050
+ .transcript-ui-root .transcript-ui-popover-list {
25051
+ min-width: 180px;
25052
+ padding: var(--spacing-xs);
25053
+ background-color: var(--color-surface);
25054
+ border: 1px solid var(--color-border);
25055
+ border-radius: var(--radius-md);
25056
+ box-shadow: 0 8px 24px
25057
+ color-mix(in srgb, var(--color-text-primary) 15%, transparent);
25058
+ z-index: 50;
25059
+ }
25060
+ .transcript-ui-root .transcript-ui-popover-list__items {
25061
+ list-style: none;
25062
+ display: flex;
25063
+ flex-direction: column;
25064
+ gap: 2px;
25065
+ margin: 0;
25066
+ padding: 0;
25067
+ max-height: 280px;
25068
+ overflow-y: auto;
25069
+ }
25070
+ .transcript-ui-root .transcript-ui-popover-list__item {
25071
+ all: unset;
25072
+ box-sizing: border-box;
25073
+ display: flex;
25074
+ align-items: center;
25075
+ gap: var(--spacing-sm);
25076
+ width: 100%;
25077
+ padding: var(--spacing-xs) var(--spacing-sm);
25078
+ border-radius: var(--radius-sm);
25079
+ font-size: var(--font-size-sm);
25080
+ color: var(--color-text-primary);
25081
+ cursor: pointer;
25082
+ }
25083
+ .transcript-ui-root .transcript-ui-popover-list__item:hover,
25084
+ .transcript-ui-root .transcript-ui-popover-list__item[data-highlighted] {
25085
+ background-color: var(--color-surface-hover);
25086
+ }
25087
+ .transcript-ui-root .transcript-ui-popover-list__item:focus-visible {
25088
+ outline: 2px solid var(--color-primary);
25089
+ outline-offset: -2px;
25090
+ }
25091
+ .transcript-ui-root .transcript-ui-popover-list__item--current {
25092
+ background-color: color-mix(
25093
+ in srgb,
25094
+ var(--color-primary) 10%,
25095
+ transparent
25096
+ );
25097
+ }
25098
+ .transcript-ui-root .transcript-ui-popover-list__divider {
25099
+ height: 1px;
25100
+ background-color: var(--color-border);
25101
+ margin: var(--spacing-xs) 0;
25102
+ }
25103
+ .transcript-ui-root .transcript-ui-popover-list__footer {
25104
+ padding: var(--spacing-xs);
25105
+ }
25106
+
25107
+ /* Positioning context for the absolute loading overlay. */
25108
+ .transcript-ui-root {
25109
+ position: relative;
25110
+ height: 100%;
25111
+ }
25112
+ `;
24761
25113
  const TranscriptUI = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["styles", [_style_0$b]]]);
24762
25114
  function mapApiTurns(apiTurns) {
24763
25115
  return apiTurns.map((t2) => {
@@ -28977,12 +29329,18 @@ const _hoisted_3$5 = { class: "llm-service-panel__empty-text" };
28977
29329
  const _sfc_main$5 = /* @__PURE__ */ defineComponent({
28978
29330
  __name: "LLMServicePanel",
28979
29331
  props: {
28980
- service: { type: Object }
29332
+ service: { type: Object },
29333
+ split: { type: Boolean }
28981
29334
  },
28982
- setup(__props) {
29335
+ emits: ["update:split"],
29336
+ setup(__props, { emit: __emit }) {
28983
29337
  const props = __props;
29338
+ const emit2 = __emit;
28984
29339
  const core = useCore();
28985
29340
  const { t: t2 } = useI18n();
29341
+ function toggleSplit() {
29342
+ emit2("update:split", !props.split);
29343
+ }
28986
29344
  const articleStatus = computed(() => {
28987
29345
  const s2 = props.service.status.value;
28988
29346
  if (s2 === "queued" || s2 === "processing") return "processing";
@@ -29089,7 +29447,15 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
29089
29447
  createTextVNode(toDisplayString(unref(t2)("llmService.download")), 1)
29090
29448
  ]),
29091
29449
  _: 1
29092
- }, 8, ["disabled", "aria-label", "title"])
29450
+ }, 8, ["disabled", "aria-label", "title"]),
29451
+ createVNode(unref(Button), {
29452
+ variant: __props.split ? "primary" : "secondary",
29453
+ icon: "panel-right",
29454
+ "aria-pressed": !!__props.split,
29455
+ "aria-label": unref(t2)("llmService.split"),
29456
+ title: unref(t2)("llmService.split"),
29457
+ onClick: toggleSplit
29458
+ }, null, 8, ["variant", "aria-pressed", "aria-label", "title"])
29093
29459
  ]),
29094
29460
  default: withCtx(() => [
29095
29461
  isEmpty.value ? (openBlock(), createElementBlock("div", _hoisted_2$5, [
@@ -29118,8 +29484,8 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
29118
29484
  };
29119
29485
  }
29120
29486
  });
29121
- const _style_0$5 = "\n.llm-service-panel[data-v-85d1396e] {\n display: flex;\n flex-direction: column;\n min-width: 0;\n min-height: 0;\n overflow-y: auto;\n}\n.llm-service-panel__status[data-v-85d1396e] {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-xs);\n font-size: var(--font-size-xs);\n font-weight: 500;\n}\n.llm-service-panel__status--ok[data-v-85d1396e] {\n color: var(--color-success, #2e7d32);\n}\n.llm-service-panel__status--warn[data-v-85d1396e] {\n color: var(--color-warning, #ed6c02);\n}\n.llm-service-panel__empty[data-v-85d1396e] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-md);\n padding: var(--spacing-xl) var(--spacing-md);\n text-align: center;\n}\n.llm-service-panel__empty-text[data-v-85d1396e] {\n margin: 0;\n max-width: 400px;\n font-size: var(--font-size-sm);\n color: var(--color-text-secondary);\n}\n@media (max-width: 767px) {\n.llm-service-panel[data-v-85d1396e] {\n padding: var(--spacing-md);\n}\n}\n";
29122
- const LLMServicePanel = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["styles", [_style_0$5]], ["__scopeId", "data-v-85d1396e"]]);
29487
+ const _style_0$5 = "\n.llm-service-panel[data-v-b3e9aba7] {\n display: flex;\n flex-direction: column;\n min-width: 0;\n min-height: 0;\n overflow-y: auto;\n}\n.llm-service-panel__status[data-v-b3e9aba7] {\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-xs);\n font-size: var(--font-size-xs);\n font-weight: 500;\n}\n.llm-service-panel__status--ok[data-v-b3e9aba7] {\n color: var(--color-success, #2e7d32);\n}\n.llm-service-panel__status--warn[data-v-b3e9aba7] {\n color: var(--color-warning, #ed6c02);\n}\n.llm-service-panel__empty[data-v-b3e9aba7] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-md);\n padding: var(--spacing-xl) var(--spacing-md);\n text-align: center;\n}\n.llm-service-panel__empty-text[data-v-b3e9aba7] {\n margin: 0;\n max-width: 400px;\n font-size: var(--font-size-sm);\n color: var(--color-text-secondary);\n}\n@media (max-width: 767px) {\n.llm-service-panel[data-v-b3e9aba7] {\n padding: var(--spacing-md);\n}\n}\n";
29488
+ const LLMServicePanel = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["styles", [_style_0$5]], ["__scopeId", "data-v-b3e9aba7"]]);
29123
29489
  function createService(init) {
29124
29490
  return {
29125
29491
  id: init.id,
@@ -29908,4 +30274,4 @@ export {
29908
30274
  purify as p,
29909
30275
  register as r
29910
30276
  };
29911
- //# sourceMappingURL=index--DNvC8BA.js.map
30277
+ //# sourceMappingURL=index-DQ9v_akJ.js.map