@dxos/plugin-transcription 0.8.3 → 0.8.4-main.1da679c

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-transcription",
-  "version": "0.8.3",
+  "version": "0.8.4-main.1da679c",
   "description": "Voice transcription.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -9,11 +9,13 @@
   "type": "module",
   "exports": {
     ".": {
+      "source": "./src/index.ts",
       "types": "./dist/types/src/index.d.ts",
       "browser": "./dist/lib/browser/index.mjs",
       "node": "./dist/lib/node-esm/index.mjs"
     },
     "./types": {
+      "source": "./src/types/index.ts",
       "types": "./dist/types/src/types/index.d.ts",
       "browser": "./dist/lib/browser/types/index.mjs",
       "node": "./dist/lib/node-esm/types/index.mjs"
@@ -32,85 +34,85 @@
     "src"
   ],
   "dependencies": {
-    "@codemirror/state": "^6.4.1",
-    "@codemirror/view": "^6.34.1",
+    "@codemirror/state": "^6.5.2",
+    "@codemirror/view": "^6.38.2",
     "@preact-signals/safe-react": "^0.9.0",
     "@preact/signals-core": "^1.9.0",
     "date-fns": "^3.3.1",
     "extendable-media-recorder": "^9.2.19",
     "extendable-media-recorder-wav-encoder": "^7.0.123",
     "main-thread-scheduling": "^14.1.1",
-    "react-resize-detector": "^12.0.2",
+    "react-resize-detector": "^11.0.1",
     "react-router-dom": "^6.4.0",
     "react-use": "^17.5.1",
     "wavefile": "^11.0.0",
-    "@dxos/ai": "0.8.3",
-    "@dxos/app-framework": "0.8.3",
-    "@dxos/artifact": "0.8.3",
-    "@dxos/assistant": "0.8.3",
-    "@dxos/async": "0.8.3",
-    "@dxos/client": "0.8.3",
-    "@dxos/codec-protobuf": "0.8.3",
-    "@dxos/context": "0.8.3",
-    "@dxos/debug": "0.8.3",
-    "@dxos/display-name": "0.8.3",
-    "@dxos/echo": "0.8.3",
-    "@dxos/echo-db": "0.8.3",
-    "@dxos/echo-schema": "0.8.3",
-    "@dxos/invariant": "0.8.3",
-    "@dxos/functions": "0.8.3",
-    "@dxos/live-object": "0.8.3",
-    "@dxos/keys": "0.8.3",
-    "@dxos/local-storage": "0.8.3",
-    "@dxos/log": "0.8.3",
-    "@dxos/plugin-client": "0.8.3",
-    "@dxos/plugin-deck": "0.8.3",
-    "@dxos/plugin-graph": "0.8.3",
-    "@dxos/plugin-markdown": "0.8.3",
-    "@dxos/plugin-thread": "0.8.3",
-    "@dxos/protocols": "0.8.3",
-    "@dxos/react-client": "0.8.3",
-    "@dxos/react-edge-client": "0.8.3",
-    "@dxos/plugin-space": "0.8.3",
-    "@dxos/react-ui-attention": "0.8.3",
-    "@dxos/react-ui-editor": "0.8.3",
-    "@dxos/react-ui-components": "0.8.3",
-    "@dxos/react-ui-stack": "0.8.3",
-    "@dxos/react-ui-grid": "0.8.3",
-    "@dxos/schema": "0.8.3",
-    "@dxos/tracing": "0.8.3",
-    "@dxos/react-ui-sfx": "0.8.3",
-    "@dxos/react-ui-form": "0.8.3",
-    "@dxos/util": "0.8.3"
+    "@dxos/ai": "0.8.4-main.1da679c",
+    "@dxos/app-framework": "0.8.4-main.1da679c",
+    "@dxos/assistant": "0.8.4-main.1da679c",
+    "@dxos/async": "0.8.4-main.1da679c",
+    "@dxos/codec-protobuf": "0.8.4-main.1da679c",
+    "@dxos/blueprints": "0.8.4-main.1da679c",
+    "@dxos/context": "0.8.4-main.1da679c",
+    "@dxos/debug": "0.8.4-main.1da679c",
+    "@dxos/display-name": "0.8.4-main.1da679c",
+    "@dxos/echo": "0.8.4-main.1da679c",
+    "@dxos/echo-db": "0.8.4-main.1da679c",
+    "@dxos/echo-schema": "0.8.4-main.1da679c",
+    "@dxos/functions": "0.8.4-main.1da679c",
+    "@dxos/invariant": "0.8.4-main.1da679c",
+    "@dxos/client": "0.8.4-main.1da679c",
+    "@dxos/keys": "0.8.4-main.1da679c",
+    "@dxos/live-object": "0.8.4-main.1da679c",
+    "@dxos/local-storage": "0.8.4-main.1da679c",
+    "@dxos/plugin-client": "0.8.4-main.1da679c",
+    "@dxos/plugin-deck": "0.8.4-main.1da679c",
+    "@dxos/log": "0.8.4-main.1da679c",
+    "@dxos/plugin-graph": "0.8.4-main.1da679c",
+    "@dxos/plugin-markdown": "0.8.4-main.1da679c",
+    "@dxos/plugin-space": "0.8.4-main.1da679c",
+    "@dxos/plugin-thread": "0.8.4-main.1da679c",
+    "@dxos/react-client": "0.8.4-main.1da679c",
+    "@dxos/react-edge-client": "0.8.4-main.1da679c",
+    "@dxos/react-ui-attention": "0.8.4-main.1da679c",
+    "@dxos/protocols": "0.8.4-main.1da679c",
+    "@dxos/react-ui-editor": "0.8.4-main.1da679c",
+    "@dxos/react-ui-form": "0.8.4-main.1da679c",
+    "@dxos/react-ui-sfx": "0.8.4-main.1da679c",
+    "@dxos/react-ui-grid": "0.8.4-main.1da679c",
+    "@dxos/react-ui-components": "0.8.4-main.1da679c",
+    "@dxos/schema": "0.8.4-main.1da679c",
+    "@dxos/tracing": "0.8.4-main.1da679c",
+    "@dxos/util": "0.8.4-main.1da679c",
+    "@dxos/react-ui-stack": "0.8.4-main.1da679c"
   },
   "devDependencies": {
-    "@effect-rx/rx-react": "^0.34.1",
-    "@effect/platform": "0.80.12",
+    "@effect-rx/rx-react": "0.38.0",
+    "@effect/platform": "0.90.2",
     "@types/dom-speech-recognition": "^0.0.6",
     "@types/react": "~18.2.0",
-    "effect": "3.14.21",
+    "effect": "3.17.7",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "tailwindcss": "~3.4.1",
-    "@dxos/plugin-preview": "0.8.3",
-    "@dxos/react-ui": "0.8.3",
-    "@dxos/random": "0.8.3",
-    "@dxos/plugin-storybook-layout": "0.8.3",
-    "@dxos/react-ui-form": "0.8.3",
-    "@dxos/react-ui-syntax-highlighter": "0.8.3",
-    "@dxos/plugin-theme": "0.8.3",
-    "@dxos/react-ui-theme": "0.8.3",
-    "@dxos/storybook-utils": "0.8.3",
-    "@dxos/test-utils": "0.8.3"
+    "@dxos/plugin-preview": "0.8.4-main.1da679c",
+    "@dxos/plugin-storybook-layout": "0.8.4-main.1da679c",
+    "@dxos/random": "0.8.4-main.1da679c",
+    "@dxos/react-ui": "0.8.4-main.1da679c",
+    "@dxos/plugin-theme": "0.8.4-main.1da679c",
+    "@dxos/react-ui-form": "0.8.4-main.1da679c",
+    "@dxos/react-ui-syntax-highlighter": "0.8.4-main.1da679c",
+    "@dxos/react-ui-theme": "0.8.4-main.1da679c",
+    "@dxos/storybook-utils": "0.8.4-main.1da679c",
+    "@dxos/test-utils": "0.8.4-main.1da679c"
   },
-  "optionalDependencies": {
+  "peerDependencies": {
     "@effect-rx/rx-react": "^0.34.1",
-    "@effect/platform": "0.80.12",
+    "@effect/platform": "^0.80.12",
     "effect": "^3.13.3",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "@dxos/react-ui-theme": "0.8.3",
-    "@dxos/react-ui": "0.8.3"
+    "@dxos/react-ui": "0.8.4-main.1da679c",
+    "@dxos/react-ui-theme": "0.8.4-main.1da679c"
   },
   "publishConfig": {
     "access": "public"

package/src/TranscriptionPlugin.tsx

@@ -8,11 +8,11 @@ import { ClientCapabilities, ClientEvents } from '@dxos/plugin-client';
 import { getSpace } from '@dxos/react-client/echo';
 import { DataType } from '@dxos/schema';
 
-import { IntentResolver, ReactSurface, Transcriber } from './capabilities';
-import { renderMarkdown } from './components';
+import { BlueprintDefinition, IntentResolver, ReactSurface, Transcriber } from './capabilities';
+import { renderByline } from './components';
 import { meta } from './meta';
-import translations from './translations';
-import { TranscriptType } from './types';
+import { translations } from './translations';
+import { Transcript } from './types';
 
 export const TranscriptionPlugin = () =>
   definePlugin(meta, [
@@ -26,18 +26,18 @@ export const TranscriptionPlugin = () =>
       activatesOn: Events.SetupMetadata,
       activate: (context) =>
         contributes(Capabilities.Metadata, {
-          id: TranscriptType.typename,
+          id: Transcript.Transcript.typename,
           metadata: {
             icon: 'ph--subtitles--regular',
             // TODO(wittjosiah): Factor out. Artifact? Separate capability?
-            getTextContent: async (transcript: TranscriptType) => {
+            getTextContent: async (transcript: Transcript.Transcript) => {
               const space = getSpace(transcript);
               const members = space?.members.get().map((member) => member.identity) ?? [];
               const queue = space?.queues.get<DataType.Message>(transcript.queue.dxn);
               await queue?.refresh();
               const content = queue?.objects
                 .filter((message) => Obj.instanceOf(DataType.Message, message))
-                .flatMap((message, index) => renderMarkdown(members)(message, index))
+                .flatMap((message, index) => renderByline(members)(message, index))
                 .join('\n\n');
               return content;
             },
@@ -47,7 +47,7 @@ export const TranscriptionPlugin = () =>
     defineModule({
       id: `${meta.id}/module/schema`,
       activatesOn: ClientEvents.SetupSchema,
-      activate: () => [contributes(ClientCapabilities.Schema, [TranscriptType])],
+      activate: () => [contributes(ClientCapabilities.Schema, [Transcript.Transcript])],
     }),
     defineModule({
       id: `${meta.id}/module/react-surface`,
@@ -64,4 +64,9 @@ export const TranscriptionPlugin = () =>
       activatesOn: Events.SetupAppGraph,
       activate: Transcriber,
     }),
+    defineModule({
+      id: `${meta.id}/module/blueprint`,
+      activatesOn: Events.SetupArtifactDefinition,
+      activate: BlueprintDefinition,
+    }),
   ]);

package/src/capabilities/blueprint-definition.ts

@@ -0,0 +1,31 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { Capabilities, contributes } from '@dxos/app-framework';
+import { Blueprint, Template } from '@dxos/blueprints';
+import { type FunctionDefinition } from '@dxos/functions';
+import { trim } from '@dxos/util';
+
+import { open, summarize } from '../functions';
+
+const functions: FunctionDefinition[] = [open, summarize];
+
+export default () => {
+  return [
+    contributes(Capabilities.Functions, functions),
+    contributes(
+      Capabilities.BlueprintDefinition,
+      Blueprint.make({
+        key: 'dxos.org/blueprint/transcription',
+        name: 'Transcription',
+        tools: Blueprint.toolDefinitions({ functions }),
+        instructions: Template.make({
+          source: trim`
+            You can open and summarize a meeting transcript.
+          `,
+        }),
+      }),
+    ),
+  ];
+};

package/src/capabilities/capabilities.ts

@@ -6,19 +6,19 @@ import { defineCapability } from '@dxos/app-framework';
 
 import { TRANSCRIPTION_PLUGIN } from '../meta';
 import {
-  type TranscriberParams,
+  type MediaStreamRecorderParams,
   type Transcriber,
-  type TranscriptionManager,
+  type TranscriberParams,
   type TranscriptMessageEnricher,
-  type MediaStreamRecorderParams,
+  type TranscriptionManager,
 } from '../transcriber';
 
 export namespace TranscriptionCapabilities {
   export type GetTranscriberProps = {
     audioStreamTrack: MediaStreamTrack;
-    onSegments: TranscriberParams['onSegments'];
-    transcriberConfig?: Partial<TranscriberParams['config']>;
     recorderConfig?: Partial<MediaStreamRecorderParams['config']>;
+    transcriberConfig?: Partial<TranscriberParams['config']>;
+    onSegments: TranscriberParams['onSegments'];
   };
   export type GetTranscriber = (props: GetTranscriberProps) => Transcriber;
   export const Transcriber = defineCapability<GetTranscriber>(`${TRANSCRIPTION_PLUGIN}/capability/transcriber`);

package/src/capabilities/index.ts

@@ -4,6 +4,7 @@
 
 import { lazy } from '@dxos/app-framework';
 
+export const BlueprintDefinition = lazy(() => import('./blueprint-definition'));
 export const IntentResolver = lazy(() => import('./intent-resolver'));
 export const ReactSurface = lazy(() => import('./react-surface'));
 export const Transcriber = lazy(() => import('./transcriber'));

package/src/capabilities/intent-resolver.ts

@@ -2,22 +2,16 @@
 // Copyright 2025 DXOS.org
 //
 
-import { Capabilities, contributes, createResolver, type PluginContext } from '@dxos/app-framework';
-import { type Key, Obj, Ref } from '@dxos/echo';
-import { createQueueDXN } from '@dxos/echo-schema';
+import { Capabilities, type PluginContext, contributes, createResolver } from '@dxos/app-framework';
 
-import { TranscriptionAction, TranscriptType } from '../types';
+import { Transcript, TranscriptAction } from '../types';
 
 export default (context: PluginContext) =>
   contributes(Capabilities.IntentResolver, [
     createResolver({
-      intent: TranscriptionAction.Create,
-      resolve: ({ name, spaceId }) => {
-        const transcript = Obj.make(TranscriptType, {
-          // TODO(dmaretskyi): Use space.queues.create() instead.
-          queue: Ref.fromDXN(createQueueDXN(spaceId as Key.SpaceId)),
-        });
-
+      intent: TranscriptAction.Create,
+      resolve: ({ name, space }) => {
+        const transcript = Transcript.makeTranscript(space.queues.create().dxn);
         return { data: { object: transcript } };
       },
     }),

package/src/capabilities/react-surface.tsx

@@ -9,14 +9,14 @@ import { Obj } from '@dxos/echo';
 
 import { TranscriptionContainer } from '../components';
 import { meta } from '../meta';
-import { TranscriptType } from '../types';
+import { Transcript } from '../types';
 
 export default () =>
   contributes(Capabilities.ReactSurface, [
     createSurface({
       id: `${meta.id}/article/transcript`,
       role: ['article', 'section'],
-      filter: (data): data is { subject: TranscriptType } => Obj.instanceOf(TranscriptType, data.subject),
+      filter: (data): data is { subject: Transcript.Transcript } => Obj.instanceOf(Transcript.Transcript, data.subject),
       component: ({ data, role }) => <TranscriptionContainer transcript={data.subject} role={role} />,
     }),
   ]);

package/src/capabilities/transcriber.ts

@@ -2,12 +2,13 @@
 // Copyright 2025 DXOS.org
 //
 
-import { contributes, type PluginContext } from '@dxos/app-framework';
+import { type PluginContext, contributes } from '@dxos/app-framework';
 import { ClientCapabilities } from '@dxos/plugin-client';
 
-import { TranscriptionCapabilities } from './capabilities';
 import { MediaStreamRecorder, Transcriber, TranscriptionManager } from '../transcriber';
 
+import { TranscriptionCapabilities } from './capabilities';
+
 // TODO(burdon): Move to config?
 
 /**

package/src/components/Transcript/Transcript.stories.tsx

@@ -4,7 +4,7 @@
 
 import '@dxos-theme';
 
-import { type Meta, type StoryObj } from '@storybook/react';
+import { type Meta, type StoryObj } from '@storybook/react-vite';
 import React, { type FC, useEffect, useMemo, useState } from 'react';
 
 import { IntentPlugin, SettingsPlugin } from '@dxos/app-framework';
@@ -24,7 +24,6 @@ import { DataType } from '@dxos/schema';
 import { Testing } from '@dxos/schema/testing';
 import { withLayout } from '@dxos/storybook-utils';
 
-import { renderMarkdown, Transcript, type TranscriptProps } from './Transcript';
 import { useQueueModelAdapter } from '../../hooks';
 import { SerializationModel } from '../../model';
 import {
@@ -33,7 +32,9 @@ import {
   useTestTranscriptionQueue,
   useTestTranscriptionQueueWithEntityExtraction,
 } from '../../testing';
-import translations from '../../translations';
+import { translations } from '../../translations';
+
+import { TranscriptView, type TranscriptViewProps, renderByline } from './Transcript';
 
 faker.seed(1);
 
@@ -41,7 +42,7 @@ faker.seed(1);
  * Story wrapper with test controls.
  */
 const TranscriptContainer: FC<
-  TranscriptProps & {
+  TranscriptViewProps & {
     running: boolean;
     onRunningChange: (running: boolean) => void;
     onReset?: () => void;
@@ -49,7 +50,7 @@ const TranscriptContainer: FC<
 > = ({ space, model, running, onRunningChange, onReset }) => {
   return (
     <div className='grid grid-rows-[1fr_40px] grow divide-y divide-separator'>
-      <Transcript space={space} model={model} />
+      <TranscriptView space={space} model={model} />
       <div className='grid grid-cols-[1fr_16rem] overflow-hidden'>
         <div className='flex items-center'>
           <SyntaxHighlighter language='json' className='text-sm'>
@@ -69,7 +70,7 @@ const TranscriptContainer: FC<
   );
 };
 
-type StoryProps = { messages?: DataType.Message[] } & Pick<TranscriptProps, 'ignoreAttention' | 'attendableId'>;
+type StoryProps = { messages?: DataType.Message[] } & Pick<TranscriptViewProps, 'ignoreAttention' | 'attendableId'>;
 
 /**
  * Basic story mutates array of messages.
@@ -78,7 +79,7 @@ const BasicStory = ({ messages: initialMessages = [], ...props }: StoryProps) =>
   const [reset, setReset] = useState({});
   const builder = useMemo(() => new MessageBuilder(), []);
   const model = useMemo(
-    () => new SerializationModel<DataType.Message>(renderMarkdown([]), initialMessages),
+    () => new SerializationModel<DataType.Message>(renderByline([]), initialMessages),
     [initialMessages, reset],
   );
   const [running, setRunning] = useState(true);
@@ -140,7 +141,7 @@ const QueueStory = ({
   const space = useSpace();
   const members = useMembers(space?.key).map((member) => member.identity);
   const queue = useTestTranscriptionQueue(space, queueId, running, 2_000);
-  const model = useQueueModelAdapter(renderMarkdown(members), queue, initialMessages);
+  const model = useQueueModelAdapter(renderByline(members), queue, initialMessages);
 
   return (
     <TranscriptContainer
@@ -160,7 +161,7 @@ const EntityExtractionQueueStory = () => {
   const space = useSpace();
   const members = useMembers(space?.key).map((member) => member.identity);
   const queue = useTestTranscriptionQueueWithEntityExtraction(space, undefined, running, 2_000);
-  const model = useQueueModelAdapter(renderMarkdown(members), queue, []);
+  const model = useQueueModelAdapter(renderByline(members), queue, []);
 
   return <TranscriptContainer space={space} model={model} running={running} onRunningChange={setRunning} />;
 };
@@ -178,7 +179,7 @@ const QueueStoryWrapper = () => {
   return <QueueStory key={key} queueId={queueId} onReset={handleReset} />;
 };
 
-const meta: Meta<typeof QueueStory> = {
+const meta = {
   title: 'plugins/plugin-transcription/Transcript',
   decorators: [
     withPluginManager({
@@ -187,7 +188,7 @@ const meta: Meta<typeof QueueStory> = {
         StorybookLayoutPlugin(),
         ClientPlugin({
           types: [TestItem, Testing.DocumentType, DataType.Person, DataType.Organization],
-          onClientInitialized: async (_, client) => {
+          onClientInitialized: async ({ client }) => {
             await client.halo.createIdentity();
           },
         }),
@@ -202,13 +203,11 @@ const meta: Meta<typeof QueueStory> = {
   parameters: {
     translations,
   },
-};
+} satisfies Meta;
 
 export default meta;
 
-type Story = StoryObj<typeof QueueStory>;
-
-export const Default: Story = {
+export const Default: StoryObj<typeof BasicStory> = {
   render: BasicStory,
   args: {
     ignoreAttention: true,
@@ -217,7 +216,7 @@ export const Default: Story = {
   },
 };
 
-export const Empty: Story = {
+export const Empty: StoryObj<typeof BasicStory> = {
   render: BasicStory,
   args: {
     ignoreAttention: true,
@@ -225,7 +224,7 @@ export const Empty: Story = {
   },
 };
 
-export const WithQueue: Story = {
+export const WithQueue: StoryObj<typeof QueueStoryWrapper> = {
   render: QueueStoryWrapper,
   args: {
     ignoreAttention: true,
@@ -233,10 +232,13 @@ export const WithQueue: Story = {
   },
 };
 
-export const WithEntityExtractionQueue: Story = {
-  render: EntityExtractionQueueStory,
-  args: {
-    ignoreAttention: true,
-    attendableId: 'story',
-  },
-};
+// NOTE: We are running out of free quota on hugging face entity extraction.
+// TODO(mykola): Fix AI service in entity extraction function.
+// TODO(mykola): Fix hugging face quota issues.
+// export const WithEntityExtractionQueue: StoryObj<typeof EntityExtractionQueueStory> = {
+//   render: EntityExtractionQueueStory,
+//   args: {
+//     ignoreAttention: true,
+//     attendableId: 'story',
+//   },
+// };

package/src/components/Transcript/Transcript.tsx

@@ -6,14 +6,13 @@ import React from 'react';
 
 import { type Space } from '@dxos/react-client/echo';
 import { type Identity } from '@dxos/react-client/halo';
-import { IconButton, type ThemedClassName, useThemeContext } from '@dxos/react-ui';
+import { type ThemedClassName, useThemeContext } from '@dxos/react-ui';
 import {
+  autoScroll,
   createBasicExtensions,
   createMarkdownExtensions,
-  createRenderer,
   createThemeExtensions,
   decorateMarkdown,
-  editorWidth,
   preview,
   useTextEditor,
 } from '@dxos/react-ui-editor';
@@ -21,16 +20,18 @@ import { mx } from '@dxos/react-ui-theme';
 import { type DataType } from '@dxos/schema';
 import { isNotFalsy } from '@dxos/util';
 
-import { transcript } from './transcript-extension';
 import { type SerializationModel } from '../../model';
-import { type TranscriptType } from '../../types';
+import { type Transcript } from '../../types';
+
+import { transcript } from './transcript-extension';
 
-export const renderMarkdown =
+// TODO(thure): Move this?
+export const renderByline =
   (identities: Identity[]) =>
   (message: DataType.Message, index: number, debug = false): string[] => {
     if (message.sender.role === 'assistant') {
       // Start/stop block.
-      return [message.blocks.find((block) => block.type === 'transcription')?.text ?? '', ''];
+      return [message.blocks.find((block) => block._tag === 'transcript')?.text ?? '', ''];
     }
 
     // TODO(burdon): Use link/reference markup for users (with popover).
@@ -42,19 +43,20 @@ export const renderMarkdown =
       message.sender.name ??
       message.sender.email ??
       message.sender.identityDid;
-    const blocks = message.blocks.filter((block) => block.type === 'transcription');
+    const blocks = message.blocks.filter((block) => block._tag === 'transcript');
     return [
+      // TODO(thure): Use an XML tag with the bits needed here.
       `###### ${name}` + (debug ? ` [${index}]:${message.id}` : ''),
       blocks.map((block) => block.text.trim()).join(' '),
       '',
     ];
   };
 
-export type TranscriptProps = ThemedClassName<{
-  transcript?: TranscriptType;
+export type TranscriptViewProps = ThemedClassName<{
   space?: Space;
+  transcript?: Transcript.Transcript;
   model: SerializationModel<DataType.Message>;
-  // TODO(wittjosiah): Move to container.
+  // TODO(burdon): Are these still in use?
   attendableId?: string;
   ignoreAttention?: boolean;
 }>;
@@ -62,30 +64,21 @@ export type TranscriptProps = ThemedClassName<{
 /**
  * Transcript component implemented using the editor.
  */
-export const Transcript = ({
-  classNames,
-  transcript: object,
-  space,
-  model,
-  attendableId,
-  ignoreAttention,
-}: TranscriptProps) => {
+export const TranscriptView = ({ classNames, space, transcript: object, model }: TranscriptViewProps) => {
   const { themeMode } = useThemeContext();
   const { parentRef } = useTextEditor(() => {
     return {
       extensions: [
-        createBasicExtensions({ readOnly: true, lineWrapping: true }),
-        createMarkdownExtensions({ themeMode }),
+        createBasicExtensions({ readOnly: true, lineWrapping: true, search: true }),
+        createMarkdownExtensions(),
         createThemeExtensions({ themeMode }),
         decorateMarkdown(),
-        space && preview(),
+        preview(),
         transcript({
           model,
           started: object?.started ? new Date(object.started) : undefined,
-          renderButton: createRenderer(({ onClick }) => (
-            <IconButton icon='ph--arrow-line-down--regular' iconOnly label='Scroll to bottom' onClick={onClick} />
-          )),
         }),
+        autoScroll(),
       ].filter(isNotFalsy),
     };
   }, [space, model]);
@@ -93,8 +86,8 @@ export const Transcript = ({
   return (
     <div
       ref={parentRef}
-      className={mx('flex grow overflow-hidden', editorWidth, classNames)}
-      data-popover-collision-boundary={true}
+      className={mx('flex grow overflow-hidden container-max-width', classNames)}
+      data-popover-collision-boundary={true /* TODO(thure): Make this a constant and document it. */}
     />
   );
 };

package/src/components/Transcript/deprecated/OldTranscript.tsx

@@ -5,16 +5,16 @@
 import { intervalToDuration } from 'date-fns/intervalToDuration';
 import { Schema } from 'effect';
 import { yieldOrContinue } from 'main-thread-scheduling';
-import React, { type FC, useCallback, useEffect, useMemo, useRef, useState, type WheelEvent } from 'react';
+import React, { type FC, type WheelEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { type OnResizeCallback, useResizeDetector } from 'react-resize-detector';
 
 import { Type } from '@dxos/echo';
 import { IconButton, type ThemedClassName, useTranslation } from '@dxos/react-ui';
 import { useAttention } from '@dxos/react-ui-attention';
 import {
+  type DxGridAxisMeta,
   type DxGridCellValue,
   type DxGridElement,
-  type DxGridAxisMeta,
   type DxGridPlaneCells,
   Grid,
   toPlaneCellIndex,
@@ -115,7 +115,7 @@ const measureRows = async (
   return result;
 };
 
-export type TranscriptProps = ThemedClassName<{
+export type TranscriptViewProps = ThemedClassName<{
   blocks?: TranscriptBlock[];
   attendableId?: string;
   ignoreAttention?: boolean;
@@ -124,7 +124,7 @@ export type TranscriptProps = ThemedClassName<{
 /**
  * @@deprecated
  */
-export const Transcript: FC<TranscriptProps> = ({ classNames, blocks, attendableId, ignoreAttention }) => {
+export const Transcript: FC<TranscriptViewProps> = ({ classNames, blocks, attendableId, ignoreAttention }) => {
   const { t } = useTranslation(TRANSCRIPTION_PLUGIN);
   const [dxGrid, setDxGrid] = useState<DxGridElement | null>(null);
   const [rows, setRows] = useState<DxGridAxisMeta | undefined>(undefined);