@dxos/plugin-transcription 0.8.1-main.ba2dec9 → 0.8.1-staging.31c3ee1

package/dist/lib/node/{chunk-UIHEGU6Q.cjs → chunk-P4VVD6ZO.cjs}

@@ -16,18 +16,17 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var chunk_UIHEGU6Q_exports = {};
-__export(chunk_UIHEGU6Q_exports, {
-  TRANSCRIPTION_PLUGIN: () => TRANSCRIPTION_PLUGIN,
+var chunk_P4VVD6ZO_exports = {};
+__export(chunk_P4VVD6ZO_exports, {
   TRANSCRIPTION_URL: () => TRANSCRIPTION_URL,
   TranscriptBlock: () => TranscriptBlock,
   TranscriptSchema: () => TranscriptSchema,
   TranscriptType: () => TranscriptType,
   TranscriptionAction: () => TranscriptionAction,
-  isTranscript: () => isTranscript,
-  meta: () => meta
+  isTranscript: () => isTranscript
 });
-module.exports = __toCommonJS(chunk_UIHEGU6Q_exports);
+module.exports = __toCommonJS(chunk_P4VVD6ZO_exports);
+var import_chunk_NVZWGFJL = require("./chunk-NVZWGFJL.cjs");
 var import_echo_schema = require("@dxos/echo-schema");
 var import_echo_schema2 = require("@dxos/echo-schema");
 var import_echo = require("@dxos/react-client/echo");
@@ -39,7 +38,8 @@ var TranscriptSchema = import_echo_schema.S.Struct({
   /**
   * Queue containing TranscriptBlock objects.
   */
-  queue: import_echo_schema.S.optional(import_echo_schema.S.String)
+  // TODO(wittjosiah): Should be a ref to a queue.
+  queue: (0, import_echo_schema.Ref)(import_echo_schema.Expando)
 });
 var TranscriptType = class extends (0, import_echo_schema.TypedObject)({
   typename: "dxos.org/type/Transcript",
@@ -55,32 +55,26 @@ var TranscriptSegment = import_echo_schema.S.Struct({
   text: import_echo_schema.S.String
 });
 var TranscriptBlock = import_echo_schema.S.Struct({
-  id: import_echo_schema.ObjectId,
-  author: import_echo_schema.S.optional(import_echo_schema.S.String),
+  id: import_echo_schema.S.String,
+  authorName: import_echo_schema.S.optional(import_echo_schema.S.String),
+  authorHue: import_echo_schema.S.optional(import_echo_schema.S.String),
   segments: import_echo_schema.S.Array(TranscriptSegment)
-}).pipe((0, import_echo_schema.EchoObject)("dxos.org/type/TranscriptBlock", "0.1.0"));
-var TRANSCRIPTION_PLUGIN = "dxos.org/plugin/transcription";
-var meta = {
-  id: TRANSCRIPTION_PLUGIN,
-  name: "Transcription",
-  description: "Voice transcription.",
-  icon: "ph--microphone--regular",
-  source: "https://github.com/dxos/dxos/tree/main/packages/plugins/experimental/plugin-transcription",
-  tags: [
-    "experimental"
-  ],
-  screenshots: []
-};
+}).pipe((0, import_echo_schema.EchoObject)({
+  typename: "dxos.org/type/TranscriptBlock",
+  version: "0.1.0"
+}));
 var TRANSCRIPTION_URL = "https://calls-service.dxos.workers.dev";
 var TranscriptionAction;
 (function(TranscriptionAction2) {
-  const TRANSCRIPTION_ACTION = `${TRANSCRIPTION_PLUGIN}/action`;
+  const TRANSCRIPTION_ACTION = `${import_chunk_NVZWGFJL.TRANSCRIPTION_PLUGIN}/action`;
   class Create extends import_echo_schema2.S.TaggedClass()(`${TRANSCRIPTION_ACTION}/create`, {
     input: import_echo_schema2.S.Struct({
-      name: import_echo_schema2.S.optional(import_echo_schema2.S.String)
+      name: import_echo_schema2.S.optional(import_echo_schema2.S.String),
+      // TODO(wittjosiah): SpaceId.
+      spaceId: import_echo_schema2.S.String
     }),
     output: import_echo_schema2.S.Struct({
-      object: TranscriptSchema
+      object: TranscriptType
     })
   }) {
   }
@@ -91,13 +85,11 @@ var isTranscript = (object) => {
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  TRANSCRIPTION_PLUGIN,
   TRANSCRIPTION_URL,
   TranscriptBlock,
   TranscriptSchema,
   TranscriptType,
   TranscriptionAction,
-  isTranscript,
-  meta
+  isTranscript
 });
-//# sourceMappingURL=chunk-UIHEGU6Q.cjs.map
+//# sourceMappingURL=chunk-P4VVD6ZO.cjs.map

package/dist/lib/node/chunk-P4VVD6ZO.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/types/schema.ts", "../../../src/types/types.ts"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { EchoObject, Expando, Ref, S, TypedObject } from '@dxos/echo-schema';\n\n/**\n * Root transcript object created when the user starts a transcription.\n */\nexport const TranscriptSchema = S.Struct({\n  name: S.String,\n\n  // TODO(burdon): Use string for dates?\n  started: S.optional(S.Date),\n  ended: S.optional(S.Date),\n\n  /**\n   * Queue containing TranscriptBlock objects.\n   */\n  // TODO(wittjosiah): Should be a ref to a queue.\n  queue: Ref(Expando),\n});\n\nexport class TranscriptType extends TypedObject({\n  typename: 'dxos.org/type/Transcript',\n  version: '0.1.0',\n})(TranscriptSchema.fields) {}\n\n// TODO(burdon): Do these need to be kept in sync with EDGE?\n\n/**\n * First message in queue.\n * Contains metadata for the recording and transcript.\n */\nconst TranscriptHeader = S.Struct({\n  started: S.optional(S.Date),\n});\n\nexport type TranscriptHeader = S.Schema.Type<typeof TranscriptHeader>;\n\n/**\n * Transcription fragment.\n */\nconst TranscriptSegment = S.Struct({\n  // TODO(burdon): TS from service is not Unix TS (x1000).\n  started: S.Date,\n  text: S.String,\n});\n\nexport type TranscriptSegment = S.Schema.Type<typeof TranscriptSegment>;\n\n/**\n * Transcription block (from single speaker).\n */\nexport const TranscriptBlock = S.Struct({\n  id: S.String,\n  authorName: S.optional(S.String), // TODO(burdon): IdentityDid.\n  authorHue: S.optional(S.String),\n  segments: S.Array(TranscriptSegment),\n}).pipe(EchoObject({ typename: 'dxos.org/type/TranscriptBlock', version: '0.1.0' }));\n\nexport type TranscriptBlock = S.Schema.Type<typeof TranscriptBlock>;\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { S, isInstanceOf } from '@dxos/echo-schema';\nimport { isReactiveObject } from '@dxos/react-client/echo';\n\nimport { TranscriptType } from './schema';\nimport { TRANSCRIPTION_PLUGIN } from '../meta';\n\n// TODO(burdon): Move to separate proto.\n\n/**\n * Endpoint to the calls service.\n */\n// TODO(burdon): Reconfigure/move.\nexport const TRANSCRIPTION_URL = 'https://calls-service.dxos.workers.dev';\n\nexport namespace TranscriptionAction {\n  const TRANSCRIPTION_ACTION = `${TRANSCRIPTION_PLUGIN}/action`;\n\n  export class Create extends S.TaggedClass<Create>()(`${TRANSCRIPTION_ACTION}/create`, {\n    input: S.Struct({\n      name: S.optional(S.String),\n      // TODO(wittjosiah): SpaceId.\n      spaceId: S.String,\n    }),\n    output: S.Struct({\n      object: TranscriptType,\n    }),\n  }) {}\n}\n\nexport const isTranscript = (object: unknown): object is typeof TranscriptType => {\n  return isReactiveObject(object) && isInstanceOf(TranscriptType, object);\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,yBAAyD;ACAzD,IAAAA,sBAAgC;AAChC,kBAAiC;ADI1B,IAAMC,mBAAmBC,qBAAEC,OAAO;EACvCC,MAAMF,qBAAEG;;EAGRC,SAASJ,qBAAEK,SAASL,qBAAEM,IAAI;EAC1BC,OAAOP,qBAAEK,SAASL,qBAAEM,IAAI;;;;;EAMxBE,WAAOC,wBAAIC,0BAAAA;AACb,CAAA;AAEO,IAAMC,iBAAN,kBAA6BC,gCAAY;EAC9CC,UAAU;EACVC,SAAS;AACX,CAAA,EAAGf,iBAAiBgB,MAAM,EAAA;AAAG;AAQ7B,IAAMC,mBAAmBhB,qBAAEC,OAAO;EAChCG,SAASJ,qBAAEK,SAASL,qBAAEM,IAAI;AAC5B,CAAA;AAOA,IAAMW,oBAAoBjB,qBAAEC,OAAO;;EAEjCG,SAASJ,qBAAEM;EACXY,MAAMlB,qBAAEG;AACV,CAAA;AAOO,IAAMgB,kBAAkBnB,qBAAEC,OAAO;EACtCmB,IAAIpB,qBAAEG;EACNkB,YAAYrB,qBAAEK,SAASL,qBAAEG,MAAM;EAC/BmB,WAAWtB,qBAAEK,SAASL,qBAAEG,MAAM;EAC9BoB,UAAUvB,qBAAEwB,MAAMP,iBAAAA;AACpB,CAAA,EAAGQ,SAAKC,+BAAW;EAAEb,UAAU;EAAiCC,SAAS;AAAQ,CAAA,CAAA;AC3C1E,IAAMa,oBAAoB;;UAEhBC,sBAAAA;AACf,QAAMC,uBAAuB,GAAGC,0CAAAA;EAEzB,MAAMC,eAAe/B,oBAAAA,EAAEgC,YAAW,EAAW,GAAGH,oBAAAA,WAA+B;IACpFI,OAAOjC,oBAAAA,EAAEC,OAAO;MACdC,MAAMF,oBAAAA,EAAEK,SAASL,oBAAAA,EAAEG,MAAM;;MAEzB+B,SAASlC,oBAAAA,EAAEG;IACb,CAAA;IACAgC,QAAQnC,oBAAAA,EAAEC,OAAO;MACfmC,QAAQzB;IACV,CAAA;EACF,CAAA,EAAA;EAAI;uBATSoB,SAAAA;AAUf,GAbiBH,wBAAAA,sBAAAA,CAAAA,EAAAA;AAeV,IAAMS,eAAe,CAACD,WAAAA;AAC3B,aAAOE,8BAAiBF,MAAAA,SAAWG,kCAAa5B,gBAAgByB,MAAAA;AAClE;",
+  "names": ["import_echo_schema", "TranscriptSchema", "S", "Struct", "name", "String", "started", "optional", "Date", "ended", "queue", "Ref", "Expando", "TranscriptType", "TypedObject", "typename", "version", "fields", "TranscriptHeader", "TranscriptSegment", "text", "TranscriptBlock", "id", "authorName", "authorHue", "segments", "Array", "pipe", "EchoObject", "TRANSCRIPTION_URL", "TranscriptionAction", "TRANSCRIPTION_ACTION", "TRANSCRIPTION_PLUGIN", "Create", "TaggedClass", "input", "spaceId", "output", "object", "isTranscript", "isReactiveObject", "isInstanceOf"]
+}

package/dist/lib/node/chunk-UOFHT4GZ.cjs

@@ -0,0 +1,280 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var chunk_UOFHT4GZ_exports = {};
+__export(chunk_UOFHT4GZ_exports, {
+  Transcript: () => Transcript,
+  TranscriptContainer_default: () => TranscriptContainer_default,
+  TranscriptionContainer: () => TranscriptionContainer
+});
+module.exports = __toCommonJS(chunk_UOFHT4GZ_exports);
+var import_chunk_NVZWGFJL = require("./chunk-NVZWGFJL.cjs");
+var import_react = __toESM(require("react"));
+var import_echo = require("@dxos/client/echo");
+var import_echo2 = require("@dxos/react-client/echo");
+var import_react_ui_stack = require("@dxos/react-ui-stack");
+var import_intervalToDuration = require("date-fns/intervalToDuration");
+var import_main_thread_scheduling = require("main-thread-scheduling");
+var import_react2 = __toESM(require("react"));
+var import_react_resize_detector = require("react-resize-detector");
+var import_react_ui = require("@dxos/react-ui");
+var import_react_ui_attention = require("@dxos/react-ui-attention");
+var import_react_ui_grid = require("@dxos/react-ui-grid");
+var import_react_ui_theme = require("@dxos/react-ui-theme");
+var lineHeight = 20;
+var cellSpacing = 8 + 2;
+var timestampColumnWidth = 68;
+var authorClasses = "font-medium text-base leading-[20px]";
+var timestampClasses = "text-xs leading-[20px] text-description pie-0 tabular-nums";
+var segmentTextClasses = "text-sm whitespace-normal hyphens-auto";
+var measureClasses = (0, import_react_ui_theme.mx)(
+  // NOTE(thure): The `inline-start` value must equal `timestampColumnWidth` plus grid’s gap (1px)
+  "absolute inline-start-[69px] inline-end-0 invisible z-[-1] border",
+  "pli-[--dx-grid-cell-padding-inline] plb-[--dx-grid-cell-padding-block] leading-[20px]",
+  segmentTextClasses
+);
+var rowDefault = {
+  grid: {
+    size: lineHeight + cellSpacing
+  }
+};
+var mapTranscriptQueue = (blocks) => {
+  if (!blocks || !Array.isArray(blocks) || blocks.length === 0) {
+    return [];
+  } else {
+    return blocks.flatMap((block, blockIndex) => {
+      return [
+        [
+          blockIndex,
+          -1
+        ],
+        ...block.segments.map((segment, segmentIndex) => {
+          return [
+            blockIndex,
+            segmentIndex
+          ];
+        })
+      ];
+    });
+  }
+};
+var pad = (n = 0) => String(n).padStart(2, "0");
+var formatTimestamp = (start, end) => {
+  const { hours, minutes, seconds } = (0, import_intervalToDuration.intervalToDuration)({
+    start,
+    end
+  });
+  return `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`;
+};
+var measureRows = async (host, blocks, queueMap, signal) => {
+  const result = {
+    grid: {}
+  };
+  for (let row = 0; row < queueMap.length; row++) {
+    await (0, import_main_thread_scheduling.yieldOrContinue)("smooth", signal);
+    const [blockIndex, segmentIndex] = queueMap[row];
+    if (segmentIndex < 0) {
+      result.grid[row] = {
+        size: lineHeight + cellSpacing
+      };
+    } else {
+      host.textContent = blocks[blockIndex].segments[segmentIndex].text;
+      result.grid[row] = {
+        size: host.offsetHeight
+      };
+    }
+  }
+  return result;
+};
+var Transcript = ({ classNames, blocks, attendableId, ignoreAttention }) => {
+  const { t } = (0, import_react_ui.useTranslation)(import_chunk_NVZWGFJL.TRANSCRIPTION_PLUGIN);
+  const { hasAttention } = (0, import_react_ui_attention.useAttention)(attendableId);
+  const [dxGrid, setDxGrid] = (0, import_react2.useState)(null);
+  const [rows, setRows] = (0, import_react2.useState)(void 0);
+  const [columns, setColumns] = (0, import_react2.useState)(void 0);
+  const [autoScroll, setAutoScroll] = (0, import_react2.useState)(true);
+  const queueMap = (0, import_react2.useMemo)(() => mapTranscriptQueue(blocks), [
+    blocks
+  ]);
+  const handleWheel = (0, import_react2.useCallback)((event) => {
+    setAutoScroll(false);
+    if (!ignoreAttention && !hasAttention) {
+      event.stopPropagation();
+    }
+  }, [
+    hasAttention,
+    ignoreAttention
+  ]);
+  const abortControllerRef = (0, import_react2.useRef)();
+  const handleResize = (0, import_react2.useCallback)(async ({ entry }) => {
+    if (entry?.target && Array.isArray(blocks) && blocks[0] && queueMap) {
+      abortControllerRef.current?.abort();
+      abortControllerRef.current = new AbortController();
+      setColumns({
+        grid: {
+          0: {
+            size: timestampColumnWidth
+          },
+          1: {
+            size: entry.target.offsetWidth
+          }
+        }
+      });
+      return measureRows(entry.target, blocks, queueMap, abortControllerRef.current.signal).then(setRows).catch(() => {
+      });
+    }
+  }, [
+    blocks,
+    queueMap
+  ]);
+  const { width, ref: measureRef } = (0, import_react_resize_detector.useResizeDetector)({
+    onResize: handleResize,
+    refreshOptions: {
+      leading: true
+    }
+  });
+  (0, import_react2.useEffect)(() => {
+    if (queueMap.length !== Object.keys(rows?.grid ?? {}).length) {
+      void handleResize({
+        entry: {
+          target: measureRef.current
+        }
+      }).then(() => {
+        if (autoScroll) {
+          setTimeout(() => dxGrid?.scrollToEndRow(), 50);
+        }
+      });
+    }
+  }, [
+    blocks,
+    queueMap,
+    width,
+    autoScroll
+  ]);
+  (0, import_react2.useEffect)(() => {
+    if (dxGrid && Array.isArray(blocks) && blocks[0]) {
+      const transcriptStart = blocks[0].segments[0].started;
+      dxGrid.getCells = (range, plane) => {
+        switch (plane) {
+          case "grid": {
+            const cells = {};
+            for (let row = range.start.row; row <= range.end.row && row < queueMap.length; row++) {
+              const [blockIndex, segmentIndex] = queueMap[row];
+              cells[(0, import_react_ui_grid.toPlaneCellIndex)({
+                col: 0,
+                row
+              })] = {
+                readonly: true,
+                value: segmentIndex < 0 ? formatTimestamp(transcriptStart, blocks[blockIndex].segments[Math.max(0, segmentIndex)].started) : "",
+                className: timestampClasses
+              };
+              cells[(0, import_react_ui_grid.toPlaneCellIndex)({
+                col: 1,
+                row
+              })] = segmentIndex < 0 ? {
+                readonly: true,
+                accessoryHtml: `<span data-hue="${blocks[blockIndex].authorHue}" class="dx-text-hue">${blocks[blockIndex].authorName}</span>`,
+                className: authorClasses
+              } : {
+                readonly: true,
+                value: blocks[blockIndex].segments[segmentIndex].text,
+                className: segmentTextClasses
+              };
+            }
+            return cells;
+          }
+          default:
+            return {};
+        }
+      };
+    }
+  }, [
+    dxGrid,
+    blocks
+  ]);
+  const handleScrollToEnd = (0, import_react2.useCallback)(() => {
+    setAutoScroll(true);
+    dxGrid?.scrollToEndRow();
+  }, [
+    dxGrid,
+    autoScroll
+  ]);
+  return /* @__PURE__ */ import_react2.default.createElement("div", {
+    role: "none",
+    className: (0, import_react_ui_theme.mx)("relative min-bs-0", classNames)
+  }, /* @__PURE__ */ import_react2.default.createElement(import_react_ui_grid.Grid.Root, {
+    id: `${attendableId}--transcript`
+  }, /* @__PURE__ */ import_react2.default.createElement(import_react_ui_grid.Grid.Content, {
+    limitColumns: 2,
+    limitRows: queueMap.length,
+    columns,
+    rows,
+    rowDefault,
+    onWheel: handleWheel,
+    className: "[--dx-grid-base:var(--dx-baseSurface)] [--dx-grid-lines:var(--dx-baseSurface)] [&_.dx-grid]:min-bs-0 [&_.dx-grid]:min-is-0 [&_.dx-grid]:select-auto",
+    ref: setDxGrid
+  })), /* @__PURE__ */ import_react2.default.createElement("div", {
+    role: "none",
+    inert: "",
+    "aria-hidden": true,
+    className: measureClasses,
+    ref: measureRef
+  }), /* @__PURE__ */ import_react2.default.createElement(import_react_ui.IconButton, {
+    icon: "ph--arrow-line-down--regular",
+    iconOnly: true,
+    label: t("scroll to end label"),
+    tooltipSide: "left",
+    "data-state": autoScroll ? "invisible" : "visible",
+    classNames: [
+      "absolute inline-end-2 block-end-2 opacity-0 pointer-events-none",
+      'data-[state="visible"]:pointer-events-auto data-[state="visible"]:opacity-100 transition-opacity'
+    ],
+    onClick: handleScrollToEnd
+  }));
+};
+var TranscriptionContainer = ({ role, transcript }) => {
+  const attendableId = (0, import_echo.fullyQualifiedId)(transcript);
+  const queue = (0, import_echo2.useQueue)(transcript.queue.dxn, {
+    pollInterval: 1e3
+  });
+  return /* @__PURE__ */ import_react.default.createElement(import_react_ui_stack.StackItem.Content, {
+    role,
+    classNames: "container-max-width pli-2"
+  }, /* @__PURE__ */ import_react.default.createElement(Transcript, {
+    attendableId,
+    blocks: queue?.items
+  }));
+};
+var TranscriptContainer_default = TranscriptionContainer;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Transcript,
+  TranscriptContainer_default,
+  TranscriptionContainer
+});
+//# sourceMappingURL=chunk-UOFHT4GZ.cjs.map

package/dist/lib/node/chunk-UOFHT4GZ.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/TranscriptContainer.tsx", "../../../src/components/Transcript/Transcript.tsx"],
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { type FC } from 'react';\n\nimport { fullyQualifiedId } from '@dxos/client/echo';\nimport { useQueue } from '@dxos/react-client/echo';\nimport { StackItem } from '@dxos/react-ui-stack';\n\nimport { Transcript } from './Transcript';\nimport { type TranscriptBlock, type TranscriptType } from '../types';\n\nexport const TranscriptionContainer: FC<{ role: string; transcript: TranscriptType }> = ({ role, transcript }) => {\n  const attendableId = fullyQualifiedId(transcript);\n  const queue = useQueue<TranscriptBlock>(transcript.queue.dxn, { pollInterval: 1_000 });\n\n  return (\n    <StackItem.Content role={role} classNames='container-max-width pli-2'>\n      <Transcript attendableId={attendableId} blocks={queue?.items} />\n    </StackItem.Content>\n  );\n};\n\nexport default TranscriptionContainer;\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { intervalToDuration } from 'date-fns/intervalToDuration';\nimport { yieldOrContinue } from 'main-thread-scheduling';\nimport React, { type FC, useCallback, useEffect, useMemo, useRef, useState, type WheelEvent } from 'react';\nimport { type OnResizeCallback, useResizeDetector } from 'react-resize-detector';\n\nimport { IconButton, type ThemedClassName, useTranslation } from '@dxos/react-ui';\nimport { useAttention } from '@dxos/react-ui-attention';\nimport {\n  type DxGridCellValue,\n  type DxGridElement,\n  type DxGridAxisMeta,\n  type DxGridPlaneCells,\n  Grid,\n  toPlaneCellIndex,\n} from '@dxos/react-ui-grid';\nimport { mx } from '@dxos/react-ui-theme';\n\nimport { TRANSCRIPTION_PLUGIN } from '../../meta';\nimport { type TranscriptBlock } from '../../types';\n\n// TODO(burdon): Actions (e.g., mark, summarize, translate, label, delete).\n\nconst lineHeight = 20;\nconst cellSpacing = 8 + 2;\nconst timestampColumnWidth = 68;\n\nconst authorClasses = 'font-medium text-base leading-[20px]';\nconst timestampClasses = 'text-xs leading-[20px] text-description pie-0 tabular-nums';\nconst segmentTextClasses = 'text-sm whitespace-normal hyphens-auto';\nconst measureClasses = mx(\n  // NOTE(thure): The `inline-start` value must equal `timestampColumnWidth` plus grid’s gap (1px)\n  'absolute inline-start-[69px] inline-end-0 invisible z-[-1] border',\n  'pli-[--dx-grid-cell-padding-inline] plb-[--dx-grid-cell-padding-block] leading-[20px]',\n  segmentTextClasses,\n);\n\nconst rowDefault = {\n  grid: { size: lineHeight + cellSpacing },\n};\n\ntype QueueRows = [number, number][];\n\nconst mapTranscriptQueue = (blocks?: TranscriptBlock[]): QueueRows => {\n  if (!blocks || !Array.isArray(blocks) || blocks.length === 0) {\n    return [];\n  } else {\n    return blocks.flatMap((block, blockIndex) => {\n      return [\n        [blockIndex, -1],\n        ...block.segments.map((segment, segmentIndex) => {\n          return [blockIndex, segmentIndex] as [number, number];\n        }),\n      ];\n    });\n  }\n};\n\nconst pad = (n = 0) => String(n).padStart(2, '0');\n\nconst formatTimestamp = (start: Date, end: Date) => {\n  const { hours, minutes, seconds } = intervalToDuration({ start, end });\n  return `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`;\n};\n\nconst measureRows = async (\n  host: HTMLDivElement,\n  blocks: TranscriptBlock[],\n  queueMap: QueueRows,\n  signal: AbortSignal,\n) => {\n  const result: DxGridAxisMeta = { grid: {} };\n  for (let row = 0; row < queueMap.length; row++) {\n    await yieldOrContinue('smooth', signal);\n    const [blockIndex, segmentIndex] = queueMap[row];\n    if (segmentIndex < 0) {\n      result.grid[row] = { size: lineHeight + cellSpacing };\n    } else {\n      host.textContent = blocks[blockIndex]!.segments[segmentIndex]!.text;\n      result.grid[row] = { size: host.offsetHeight };\n    }\n  }\n  return result;\n};\n\nexport type TranscriptProps = ThemedClassName<{\n  blocks?: TranscriptBlock[];\n  attendableId?: string;\n  ignoreAttention?: boolean;\n}>;\n\nexport const Transcript: FC<TranscriptProps> = ({ classNames, blocks, attendableId, ignoreAttention }) => {\n  const { t } = useTranslation(TRANSCRIPTION_PLUGIN);\n  const { hasAttention } = useAttention(attendableId);\n  const [dxGrid, setDxGrid] = useState<DxGridElement | null>(null);\n  const [rows, setRows] = useState<DxGridAxisMeta | undefined>(undefined);\n  const [columns, setColumns] = useState<DxGridAxisMeta | undefined>(undefined);\n  const [autoScroll, setAutoScroll] = useState(true);\n\n  const queueMap = useMemo(() => mapTranscriptQueue(blocks), [blocks]);\n\n  const handleWheel = useCallback(\n    (event: WheelEvent) => {\n      setAutoScroll(false);\n      if (!ignoreAttention && !hasAttention) {\n        event.stopPropagation();\n      }\n    },\n    [hasAttention, ignoreAttention],\n  );\n\n  const abortControllerRef = useRef<AbortController>();\n\n  const handleResize = useCallback(\n    async ({ entry }: { entry: { target: HTMLDivElement } | null }) => {\n      if (entry?.target && Array.isArray(blocks) && blocks[0] && queueMap) {\n        abortControllerRef.current?.abort();\n        abortControllerRef.current = new AbortController();\n        setColumns({ grid: { 0: { size: timestampColumnWidth }, 1: { size: entry.target.offsetWidth } } });\n        return measureRows(entry.target, blocks, queueMap, abortControllerRef.current.signal)\n          .then(setRows)\n          .catch(() => {\n            // Aborted mid-measurement by new size.\n          });\n      }\n    },\n    [blocks, queueMap],\n  );\n\n  const { width, ref: measureRef } = useResizeDetector({\n    onResize: handleResize as OnResizeCallback,\n    refreshOptions: { leading: true },\n  });\n\n  useEffect(() => {\n    if (queueMap.length !== Object.keys(rows?.grid ?? {}).length) {\n      void handleResize({ entry: { target: measureRef.current } }).then(() => {\n        if (autoScroll) {\n          // TODO(thure): Implement a deterministic way to do this when `rows` has fully settled and grid has a new `maxPosBlock`.\n          setTimeout(() => dxGrid?.scrollToEndRow(), 50);\n        }\n      });\n    }\n  }, [blocks, queueMap, width, autoScroll]);\n\n  useEffect(() => {\n    if (dxGrid && Array.isArray(blocks) && blocks[0]) {\n      const transcriptStart = blocks[0]!.segments[0]!.started;\n      dxGrid.getCells = (range, plane) => {\n        switch (plane) {\n          case 'grid': {\n            const cells: DxGridPlaneCells = {};\n            for (let row = range.start.row; row <= range.end.row && row < queueMap.length; row++) {\n              const [blockIndex, segmentIndex] = queueMap[row];\n\n              cells[toPlaneCellIndex({ col: 0, row })] = {\n                readonly: true,\n                value:\n                  segmentIndex < 0\n                    ? formatTimestamp(transcriptStart, blocks[blockIndex]!.segments[Math.max(0, segmentIndex)]!.started)\n                    : '',\n                className: timestampClasses,\n              } satisfies DxGridCellValue;\n\n              cells[toPlaneCellIndex({ col: 1, row })] = (\n                segmentIndex < 0\n                  ? {\n                      readonly: true,\n                      accessoryHtml: `<span data-hue=\"${blocks[blockIndex]!.authorHue}\" class=\"dx-text-hue\">${blocks[blockIndex]!.authorName}</span>`,\n                      className: authorClasses,\n                    }\n                  : {\n                      readonly: true,\n                      value: blocks[blockIndex]!.segments[segmentIndex]!.text,\n                      className: segmentTextClasses,\n                    }\n              ) satisfies DxGridCellValue;\n            }\n            return cells;\n          }\n          default:\n            return {};\n        }\n      };\n    }\n  }, [dxGrid, blocks]);\n\n  const handleScrollToEnd = useCallback(() => {\n    setAutoScroll(true);\n    dxGrid?.scrollToEndRow();\n  }, [dxGrid, autoScroll]);\n\n  return (\n    <div role='none' className={mx('relative min-bs-0', classNames)}>\n      <Grid.Root id={`${attendableId}--transcript`}>\n        <Grid.Content\n          limitColumns={2}\n          limitRows={queueMap.length}\n          columns={columns}\n          rows={rows}\n          rowDefault={rowDefault}\n          onWheel={handleWheel}\n          className='[--dx-grid-base:var(--dx-baseSurface)] [--dx-grid-lines:var(--dx-baseSurface)] [&_.dx-grid]:min-bs-0 [&_.dx-grid]:min-is-0 [&_.dx-grid]:select-auto'\n          ref={setDxGrid}\n        />\n      </Grid.Root>\n      <div role='none' {...{ inert: '' }} aria-hidden className={measureClasses} ref={measureRef} />\n      <IconButton\n        icon='ph--arrow-line-down--regular'\n        iconOnly\n        label={t('scroll to end label')}\n        tooltipSide='left'\n        data-state={autoScroll ? 'invisible' : 'visible'}\n        classNames={[\n          'absolute inline-end-2 block-end-2 opacity-0 pointer-events-none',\n          'data-[state=\"visible\"]:pointer-events-auto data-[state=\"visible\"]:opacity-100 transition-opacity',\n        ]}\n        onClick={handleScrollToEnd}\n      />\n    </div>\n  );\n};\n"],
+  "mappings": "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",
+  "names": ["import_echo", "import_react", "lineHeight", "cellSpacing", "timestampColumnWidth", "authorClasses", "timestampClasses", "segmentTextClasses", "measureClasses", "mx", "rowDefault", "grid", "size", "mapTranscriptQueue", "blocks", "Array", "isArray", "length", "flatMap", "block", "blockIndex", "segments", "map", "segment", "segmentIndex", "pad", "n", "String", "padStart", "formatTimestamp", "start", "end", "hours", "minutes", "seconds", "intervalToDuration", "measureRows", "host", "queueMap", "signal", "result", "row", "yieldOrContinue", "textContent", "text", "offsetHeight", "Transcript", "classNames", "attendableId", "ignoreAttention", "t", "useTranslation", "TRANSCRIPTION_PLUGIN", "hasAttention", "useAttention", "dxGrid", "setDxGrid", "useState", "rows", "setRows", "undefined", "columns", "setColumns", "autoScroll", "setAutoScroll", "useMemo", "handleWheel", "useCallback", "event", "stopPropagation", "abortControllerRef", "useRef", "handleResize", "entry", "target", "current", "abort", "AbortController", "offsetWidth", "then", "catch", "width", "ref", "measureRef", "useResizeDetector", "onResize", "refreshOptions", "leading", "useEffect", "Object", "keys", "setTimeout", "scrollToEndRow", "transcriptStart", "started", "getCells", "range", "plane", "cells", "toPlaneCellIndex", "col", "readonly", "value", "Math", "max", "className", "accessoryHtml", "authorHue", "authorName", "handleScrollToEnd", "React", "div", "role", "Grid", "Root", "id", "Content", "limitColumns", "limitRows", "onWheel", "inert", "aria-hidden", "IconButton", "icon", "iconOnly", "label", "tooltipSide", "data-state", "onClick", "TranscriptionContainer", "transcript", "fullyQualifiedId", "queue", "useQueue", "dxn", "pollInterval", "StackItem", "items"]
+}