@dxos/react-ui-thread 0.10.0 → 0.11.0

package/dist/lib/browser/index.mjs

@@ -1,554 +0,0 @@
-import {
-  translationKey
-} from "./chunk-QFRRLZVL.mjs";
-
-// src/Thread/Thread.tsx
-import React2, { forwardRef as forwardRef2, useCallback as useCallback2, useEffect as useEffect2, useMemo, useRef as useRef2, useState as useState2 } from "react";
-import { Obj as Obj2 } from "@dxos/echo";
-import { Icon, IconButton as IconButton2, ScrollArea, composable, composableProps, useThemeContext as useThemeContext2, useTranslation as useTranslation2 } from "@dxos/react-ui";
-import { Mosaic } from "@dxos/react-ui-mosaic";
-import { createBasicExtensions as createBasicExtensions2, createThemeExtensions as createThemeExtensions2, listener as listener2 } from "@dxos/ui-editor";
-import { hoverableControlItem as hoverableControlItem2, hoverableControls as hoverableControls2, hoverableFocusedWithinControls as hoverableFocusedWithinControls2, mx as mx3 } from "@dxos/ui-theme";
-
-// src/command.ts
-import { HighlightStyle, StreamLanguage, syntaxHighlighting } from "@codemirror/language";
-import { EditorView } from "@codemirror/view";
-import { tags } from "@dxos/ui-editor";
-import { mx } from "@dxos/ui-theme";
-var parser = StreamLanguage.define({
-  startState: () => ({
-    count: 0
-  }),
-  token: (stream, state) => {
-    state.count++;
-    if (stream.eatSpace()) {
-      return null;
-    }
-    if (state.count === 1 && stream.match(/^\/\w+/)) {
-      return "tagName";
-    }
-    if (stream.match(/^@\w+/)) {
-      return "labelName";
-    }
-    stream.next();
-    return null;
-  }
-});
-var styles = HighlightStyle.define([
-  {
-    tag: tags.tagName,
-    class: mx("dx-tag dx-tag--indigo")
-  },
-  {
-    tag: tags.labelName,
-    class: mx("dx-tag dx-tag--blue")
-  }
-]);
-var theme = EditorView.theme({
-  ".dx-tag": {
-    verticalAlign: "bottom"
-  }
-});
-var command = [
-  parser,
-  syntaxHighlighting(styles),
-  theme
-];
-
-// src/context.ts
-import { createContext } from "@radix-ui/react-context";
-var [ThreadContextProvider, useThreadContext] = createContext("Thread");
-
-// src/Message/Message.tsx
-import { EditorView as EditorView2 } from "@codemirror/view";
-import { formatDistanceToNow } from "date-fns/formatDistanceToNow";
-import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState } from "react";
-import { Obj, Ref } from "@dxos/echo";
-import { Avatar, IconButton, useOnTransition, useThemeContext, useTranslation } from "@dxos/react-ui";
-import { useTextEditor } from "@dxos/react-ui-editor";
-import { createBasicExtensions, createThemeExtensions, keymap, listener } from "@dxos/ui-editor";
-import { hoverableControlItem, hoverableControls, hoverableFocusedWithinControls, mx as mx2 } from "@dxos/ui-theme";
-import { hexToEmoji, hexToHue, isTruthy } from "@dxos/util";
-var avatarSize = 7;
-var buttonGroupClassNames = "flex flex-row items-center gap-0.5 pe-2";
-var buttonClassNames = "p-1! transition-opacity";
-var MessageRoot = /* @__PURE__ */ forwardRef(({ authorImgSrc, authorId, authorName, authorAvatarProps, continues = true, controls, children, classNames, ...rootProps }, forwardedRef) => {
-  return /* @__PURE__ */ React.createElement(Avatar.Root, null, /* @__PURE__ */ React.createElement("div", {
-    "data-testid": "thread.message",
-    ...rootProps,
-    className: mx2("grid grid-cols-[var(--dx-rail-size)_1fr_min-content] w-full", classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ React.createElement("div", {
-    className: "flex flex-col items-center gap-2 pt-1"
-  }, /* @__PURE__ */ React.createElement(Avatar.Content, {
-    size: avatarSize,
-    hue: authorAvatarProps?.hue || hexToHue(authorId ?? "0"),
-    fallback: authorAvatarProps?.emoji || hexToEmoji(authorId ?? "0"),
-    ...authorImgSrc && {
-      imgSrc: authorImgSrc
-    }
-  }), continues && /* @__PURE__ */ React.createElement("div", {
-    className: "w-px grow bg-separator"
-  })), /* @__PURE__ */ React.createElement("div", {
-    className: "py-1 min-w-0"
-  }, children), controls && /* @__PURE__ */ React.createElement("div", {
-    className: "self-start"
-  }, controls)));
-});
-MessageRoot.displayName = "Message.Root";
-var MessageHeading = ({ children, classNames, timestamp, authorName, ...props }) => {
-  return /* @__PURE__ */ React.createElement("div", {
-    ...props,
-    className: mx2("flex gap-2 items-start", classNames)
-  }, /* @__PURE__ */ React.createElement("p", {
-    className: "grow"
-  }, /* @__PURE__ */ React.createElement(MessageAuthorName, {
-    authorName
-  }), timestamp && /* @__PURE__ */ React.createElement(MessageTime, {
-    timestamp
-  })), children);
-};
-MessageHeading.displayName = "Message.Heading";
-var MessageAuthorName = ({ authorName }) => {
-  const { t } = useTranslation(translationKey);
-  return /* @__PURE__ */ React.createElement(Avatar.Label, {
-    classNames: "block truncate text-sm text-subdued"
-  }, authorName ?? t("anonymous.label"));
-};
-MessageAuthorName.displayName = "Message.AuthorName";
-var MessageTime = ({ timestamp }) => {
-  const { dtLocale } = useTranslation(translationKey);
-  const dt = timestamp ? new Date(timestamp) : void 0;
-  return /* @__PURE__ */ React.createElement("time", {
-    className: "block text-subdued text-xs pb-0.5",
-    dateTime: dt?.toISOString()
-  }, dt ? formatDistanceToNow(dt, {
-    locale: dtLocale,
-    addSuffix: true
-  }) : "");
-};
-MessageTime.displayName = "Message.Time";
-var MessageBody = ({ message, isAuthor, editing, onSave }) => {
-  const { components } = useThreadContext("Message.Body");
-  const textBlockIndex = message.blocks.findIndex((block) => block._tag === "text");
-  const textBlock = textBlockIndex !== -1 ? message.blocks[textBlockIndex] : void 0;
-  const proposalBlock = message.blocks.find((block) => block._tag === "proposal");
-  const references = message.blocks.filter((block) => block._tag === "reference").map((block) => block.reference);
-  const Object = components.Object;
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, textBlock && /* @__PURE__ */ React.createElement(TextBlock, {
-    block: textBlock,
-    isAuthor,
-    editing,
-    onSave
-  }), proposalBlock && /* @__PURE__ */ React.createElement("div", {
-    className: "me-4 italic"
-  }, proposalBlock.text), Object && Ref.Array.targets(references).map((reference, index) => /* @__PURE__ */ React.createElement(Object, {
-    key: index,
-    subject: reference
-  })));
-};
-MessageBody.displayName = "Message.Body";
-var TextBlock = ({ block, isAuthor, editing, onSave }) => {
-  const { themeMode } = useThemeContext();
-  const inMemoryContentRef = useRef(block.text);
-  const handleDocumentChange = useCallback((next) => {
-    inMemoryContentRef.current = next;
-  }, []);
-  const saveDocumentChange = useCallback(() => {
-    onSave?.(inMemoryContentRef.current);
-  }, [
-    onSave
-  ]);
-  useOnTransition(editing, true, false, saveDocumentChange);
-  const { parentRef, focusAttributes, view } = useTextEditor(() => ({
-    initialValue: block.text,
-    extensions: [
-      createBasicExtensions({
-        readOnly: !isAuthor || !editing
-      }),
-      createThemeExtensions({
-        themeMode
-      }),
-      command,
-      EditorView2.updateListener.of((update) => {
-        if (update.docChanged) {
-          handleDocumentChange(update.state.doc.toString());
-        }
-      })
-    ]
-  }), [
-    block.text,
-    editing,
-    isAuthor,
-    themeMode,
-    handleDocumentChange
-  ]);
-  useEffect(() => {
-    if (editing) {
-      view?.focus();
-    }
-  }, [
-    editing,
-    view
-  ]);
-  return /* @__PURE__ */ React.createElement("div", {
-    ref: parentRef,
-    className: "me-4",
-    ...focusAttributes
-  });
-};
-var keyBindings = ({ onSend, onClear }) => [
-  {
-    key: "Enter",
-    run: () => {
-      if (onSend) {
-        onSend();
-        return true;
-      }
-      return false;
-    }
-  },
-  {
-    key: "Meta+Backspace",
-    run: () => {
-      if (onClear) {
-        onClear();
-        return true;
-      }
-      return false;
-    }
-  }
-];
-var MessageTextbox = /* @__PURE__ */ forwardRef(({ id, authorId, authorName, authorImgSrc, authorAvatarProps, disabled, extensions, onSend, onClear, onEditorFocus, ...editorProps }, forwardedRef) => {
-  const { parentRef, focusAttributes, view } = useTextEditor(() => ({
-    id,
-    extensions: [
-      keymap.of(keyBindings({
-        onSend,
-        onClear
-      })),
-      listener({
-        onFocus: ({ focusing }) => {
-          if (focusing) {
-            onEditorFocus?.();
-          }
-        }
-      }),
-      extensions
-    ].filter(isTruthy),
-    ...editorProps
-  }), [
-    id,
-    extensions
-  ]);
-  useImperativeHandle(forwardedRef, () => ({
-    focus: () => view?.focus()
-  }), [
-    view
-  ]);
-  return /* @__PURE__ */ React.createElement(MessageRoot, {
-    id,
-    authorId,
-    authorName,
-    authorImgSrc,
-    authorAvatarProps,
-    continues: false
-  }, /* @__PURE__ */ React.createElement("div", {
-    ref: parentRef,
-    className: mx2("py-0.5 me-1 rounded-xs dx-focus-ring", disabled && "opacity-50"),
-    ...focusAttributes
-  }));
-});
-MessageTextbox.displayName = "Message.Textbox";
-var MessageTile = ({ message, classNames }) => {
-  const { t } = useTranslation(translationKey);
-  const { getMetadata, identityDid, editable, onMessageDelete, onAcceptProposal } = useThreadContext("Message.Tile");
-  const [editing, setEditing] = useState(false);
-  const metadata = getMetadata(message);
-  const isAuthor = !!identityDid && identityDid === metadata.authorId;
-  const hasProposal = message.blocks.some((block) => block._tag === "proposal");
-  const handleEdit = useCallback(() => setEditing((value) => !value), []);
-  const handleDelete = useCallback(() => onMessageDelete?.(message.id), [
-    onMessageDelete,
-    message.id
-  ]);
-  const handleAcceptProposal = useCallback(() => onAcceptProposal?.(message.id), [
-    onAcceptProposal,
-    message.id
-  ]);
-  const handleSave = useCallback((text) => {
-    Obj.update(message, (message2) => {
-      const block = message2.blocks.find((block2) => block2._tag === "text");
-      if (block && block._tag === "text") {
-        block.text = text;
-      }
-    });
-  }, [
-    message
-  ]);
-  const showEdit = isAuthor && editable;
-  const showAccept = hasProposal && !!onAcceptProposal;
-  const showDelete = !!onMessageDelete;
-  const controls = showEdit || showAccept || showDelete ? /* @__PURE__ */ React.createElement("div", {
-    className: buttonGroupClassNames
-  }, showEdit && /* @__PURE__ */ React.createElement(IconButton, {
-    "data-testid": editing ? "thread.message.save" : "thread.message.edit",
-    variant: "ghost",
-    icon: editing ? "ph--check--regular" : "ph--pencil-simple--regular",
-    iconOnly: true,
-    label: t(editing ? "save-message.label" : "edit-message.label"),
-    classNames: [
-      buttonClassNames,
-      hoverableControlItem
-    ],
-    onClick: handleEdit
-  }), showAccept && /* @__PURE__ */ React.createElement(IconButton, {
-    "data-testid": "thread.message.accept",
-    variant: "ghost",
-    icon: "ph--check--regular",
-    iconOnly: true,
-    label: t("accept-proposal.label"),
-    classNames: [
-      buttonClassNames,
-      hoverableControlItem
-    ],
-    onClick: handleAcceptProposal
-  }), showDelete && /* @__PURE__ */ React.createElement(IconButton, {
-    "data-testid": "thread.message.delete",
-    variant: "ghost",
-    icon: "ph--x--regular",
-    iconOnly: true,
-    label: t("delete-message.label"),
-    classNames: [
-      buttonClassNames,
-      hoverableControlItem
-    ],
-    onClick: handleDelete
-  })) : void 0;
-  return /* @__PURE__ */ React.createElement(MessageRoot, {
-    ...metadata,
-    controls,
-    classNames: [
-      hoverableControls,
-      hoverableFocusedWithinControls,
-      classNames
-    ]
-  }, /* @__PURE__ */ React.createElement(MessageHeading, {
-    authorName: metadata.authorName,
-    timestamp: metadata.timestamp
-  }), /* @__PURE__ */ React.createElement(MessageBody, {
-    message,
-    isAuthor,
-    editing,
-    onSave: handleSave
-  }));
-};
-MessageTile.displayName = "Message.Tile";
-var Message = {
-  Root: MessageRoot,
-  Heading: MessageHeading,
-  AuthorName: MessageAuthorName,
-  Time: MessageTime,
-  Body: MessageBody,
-  Textbox: MessageTextbox,
-  Tile: MessageTile
-};
-
-// src/Thread/Thread.tsx
-var getMessageId = (message) => Obj2.getURI(message);
-var ThreadRoot = ({ children, getMetadata, components, identityDid, editable, onMessageDelete, onAcceptProposal }) => {
-  const composerFocus = useRef2(void 0);
-  const registerComposerFocus = useCallback2((focus) => {
-    composerFocus.current = focus;
-  }, []);
-  const focusComposer = useCallback2(() => composerFocus.current?.(), []);
-  return /* @__PURE__ */ React2.createElement(ThreadContextProvider, {
-    getMetadata,
-    components: components ?? {},
-    identityDid,
-    editable,
-    registerComposerFocus,
-    focusComposer,
-    onMessageDelete,
-    onAcceptProposal
-  }, /* @__PURE__ */ React2.createElement(Mosaic.Root, null, children));
-};
-ThreadRoot.displayName = "Thread.Root";
-var ThreadContent = composable(({ children, current, id, ...props }, forwardedRef) => {
-  return /* @__PURE__ */ React2.createElement("div", {
-    ...composableProps(props, {
-      role: "group",
-      classNames: [
-        "flex flex-col bg-[var(--surface-bg)] current-related dx-attention-surface [--controls-opacity:0]",
-        hoverableFocusedWithinControls2
-      ]
-    }),
-    "data-testid": "thread",
-    id,
-    "aria-current": current ? "location" : void 0,
-    ref: forwardedRef
-  }, children);
-});
-ThreadContent.displayName = "Thread.Content";
-var ThreadHeader = composable(({ title, detached, current, controls, onSelect, ...props }, forwardedRef) => {
-  const { t } = useTranslation2(translationKey);
-  const { focusComposer } = useThreadContext("Thread.Header");
-  const handleSelect = useCallback2(() => {
-    onSelect?.();
-    focusComposer();
-  }, [
-    onSelect,
-    focusComposer
-  ]);
-  return /* @__PURE__ */ React2.createElement("div", {
-    ...composableProps(props, {
-      classNames: [
-        "grid grid-cols-[var(--dx-rail-size)_1fr_min-content] items-center",
-        hoverableControls2,
-        hoverableFocusedWithinControls2
-      ]
-    }),
-    ref: forwardedRef
-  }, /* @__PURE__ */ React2.createElement("div", {
-    className: "flex items-center justify-center"
-  }, /* @__PURE__ */ React2.createElement(IconButton2, {
-    iconOnly: true,
-    variant: "ghost",
-    density: "sm",
-    icon: "ph--caret-double-right--regular",
-    label: t("select-thread.label"),
-    classNames: "text-description",
-    onClick: handleSelect
-  })), /* @__PURE__ */ React2.createElement("div", {
-    className: "flex items-center overflow-hidden"
-  }, /* @__PURE__ */ React2.createElement("p", {
-    role: "heading",
-    "data-testid": "thread.heading",
-    className: mx3("me-2 font-medium truncate italic", current ? "text-accent-text" : "text-description", detached && "line-through decoration-1")
-  }, title)), controls);
-});
-ThreadHeader.displayName = "Thread.Header";
-var MessageTileAdapter = ({ id, data, location, draggable, current, selected }) => /* @__PURE__ */ React2.createElement(Mosaic.Tile, {
-  id,
-  data,
-  location,
-  draggable,
-  current,
-  selected
-}, /* @__PURE__ */ React2.createElement(Message.Tile, {
-  message: data
-}));
-var ThreadMessages = ({ messages, estimateSize = 80, currentId, classNames }) => {
-  const [viewport, setViewport] = useState2(null);
-  const items = useMemo(() => messages.filter(Boolean), [
-    messages
-  ]);
-  return /* @__PURE__ */ React2.createElement(Mosaic.Container, {
-    asChild: true,
-    orientation: "vertical",
-    autoScroll: viewport,
-    currentId,
-    eventHandler: {
-      id: "thread",
-      canDrop: () => false
-    }
-  }, /* @__PURE__ */ React2.createElement(ScrollArea.Root, {
-    classNames: mx3("col-span-2", classNames),
-    orientation: "vertical"
-  }, /* @__PURE__ */ React2.createElement(ScrollArea.Viewport, {
-    ref: setViewport
-  }, /* @__PURE__ */ React2.createElement(Mosaic.VirtualStack, {
-    items,
-    getId: getMessageId,
-    Tile: MessageTileAdapter,
-    draggable: false,
-    getScrollElement: () => viewport,
-    estimateSize: () => estimateSize
-  }))));
-};
-ThreadMessages.displayName = "Thread.Messages";
-var ThreadTextbox = ({ placeholder, autoFocus, disabled, extensions, onSend, ...metadata }) => {
-  const { t } = useTranslation2(translationKey);
-  const { themeMode } = useThemeContext2();
-  const { registerComposerFocus } = useThreadContext("Thread.Textbox");
-  const composerRef = useRef2(null);
-  const messageRef = useRef2("");
-  const [count, setCount] = useState2(0);
-  useEffect2(() => {
-    registerComposerFocus(() => composerRef.current?.focus());
-    return () => registerComposerFocus(void 0);
-  }, [
-    registerComposerFocus
-  ]);
-  const editorExtensions = useMemo(() => [
-    createBasicExtensions2({
-      placeholder: placeholder ?? t("message.placeholder")
-    }),
-    createThemeExtensions2({
-      themeMode
-    }),
-    listener2({
-      onChange: ({ text }) => messageRef.current = text
-    }),
-    command,
-    extensions
-  ].filter(Boolean), [
-    themeMode,
-    placeholder,
-    t,
-    extensions,
-    count
-  ]);
-  const handleSend = useCallback2(() => {
-    const text = messageRef.current;
-    if (!text?.length || !onSend) {
-      return;
-    }
-    if (onSend(text)) {
-      messageRef.current = "";
-      setCount((value) => value + 1);
-    }
-  }, []);
-  return /* @__PURE__ */ React2.createElement(Message.Textbox, {
-    ref: composerRef,
-    ...metadata,
-    autoFocus,
-    disabled,
-    extensions: editorExtensions,
-    onSend: handleSend
-  });
-};
-ThreadTextbox.displayName = "Thread.Textbox";
-var ThreadStatus = /* @__PURE__ */ forwardRef2(({ activity, classNames, children, ...props }, forwardedRef) => {
-  const { t } = useTranslation2(translationKey);
-  return /* @__PURE__ */ React2.createElement("div", {
-    ...props,
-    className: mx3("col-start-2 grid grid-cols-[min-content_1fr_max-content] pb-2 pe-2 text-xs text-description", classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ React2.createElement(Icon, {
-    icon: "ph--spinner--bold",
-    classNames: "w-6 h-4 invisible data-[visible=show]:visible animate-spin-slow",
-    "data-visible": activity ? "show" : "hide"
-  }), /* @__PURE__ */ React2.createElement("span", {
-    className: "truncate min-w-0",
-    "aria-live": "polite"
-  }, activity ? children : null), /* @__PURE__ */ React2.createElement("span", {
-    className: mx3("text-end", hoverableControlItem2)
-  }, t("enter-to-send.message")));
-});
-ThreadStatus.displayName = "Thread.Status";
-var Thread = {
-  Root: ThreadRoot,
-  Content: ThreadContent,
-  Header: ThreadHeader,
-  Messages: ThreadMessages,
-  Textbox: ThreadTextbox,
-  Status: ThreadStatus
-};
-export {
-  Message,
-  Thread,
-  command,
-  useThreadContext
-};
-//# sourceMappingURL=index.mjs.map

package/dist/lib/browser/index.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/Thread/Thread.tsx", "../../../src/command.ts", "../../../src/context.ts", "../../../src/Message/Message.tsx"],
-  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React, {\n  type ComponentPropsWithRef,\n  type PropsWithChildren,\n  type ReactNode,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Obj } from '@dxos/echo';\nimport {\n  type ComposableProps,\n  Icon,\n  IconButton,\n  ScrollArea,\n  type ThemedClassName,\n  composable,\n  composableProps,\n  useThemeContext,\n  useTranslation,\n} from '@dxos/react-ui';\nimport { Mosaic, type MosaicTileProps } from '@dxos/react-ui-mosaic';\nimport { type Message as MessageType } from '@dxos/types';\nimport { type Extension, createBasicExtensions, createThemeExtensions, listener } from '@dxos/ui-editor';\nimport { hoverableControlItem, hoverableControls, hoverableFocusedWithinControls, mx } from '@dxos/ui-theme';\n\nimport { command } from '../command';\nimport { ThreadContextProvider, useThreadContext } from '../context';\nimport { Message } from '../Message';\nimport { translationKey } from '../translations';\nimport { type MessageMetadata, type ThreadContextValue } from '../types';\n\nconst getMessageId = (message: MessageType.Message) => Obj.getURI(message);\n\n//\n// Root\n//\n\nexport type ThreadRootProps = PropsWithChildren<\n  Omit<ThreadContextValue, 'components'> & Partial<Pick<ThreadContextValue, 'components'>>\n>;\n\n/**\n * Headless root of a thread. Provides message-tile context (metadata resolver,\n * injected renderers, callbacks) and the Mosaic root that `Thread.Messages`\n * renders its virtual stack within. Renders no DOM of its own — wrap the visible\n * thread chrome in `Thread.Content`.\n */\nconst ThreadRoot = ({\n  children,\n  getMetadata,\n  components,\n  identityDid,\n  editable,\n  onMessageDelete,\n  onAcceptProposal,\n}: ThreadRootProps) => {\n  // Composer focus handler registered by Thread.Textbox; invoked by Thread.Header's caret.\n  const composerFocus = useRef<(() => void) | undefined>(undefined);\n\n  const registerComposerFocus = useCallback((focus: (() => void) | undefined) => {\n    composerFocus.current = focus;\n  }, []);\n\n  const focusComposer = useCallback(() => composerFocus.current?.(), []);\n\n  return (\n    <ThreadContextProvider\n      getMetadata={getMetadata}\n      components={components ?? {}}\n      identityDid={identityDid}\n      editable={editable}\n      registerComposerFocus={registerComposerFocus}\n      focusComposer={focusComposer}\n      onMessageDelete={onMessageDelete}\n      onAcceptProposal={onAcceptProposal}\n    >\n      <Mosaic.Root>{children}</Mosaic.Root>\n    </ThreadContextProvider>\n  );\n};\n\nThreadRoot.displayName = 'Thread.Root';\n\n//\n// Content\n//\n\ntype ThreadContentExtra = {\n  id?: string;\n  current?: boolean | string;\n} & Pick<ComponentPropsWithRef<'div'>, 'onClickCapture' | 'onFocusCapture'>;\n\nexport type ThreadContentProps = ComposableProps<ThreadContentExtra>;\n\n/** Visible thread container (the attention surface that hosts header / messages / composer). */\nconst ThreadContent = composable<HTMLDivElement, ThreadContentExtra>(\n  ({ children, current, id, ...props }, forwardedRef) => {\n    return (\n      <div\n        {...composableProps(props, {\n          role: 'group',\n          classNames: [\n            'flex flex-col bg-[var(--surface-bg)] current-related dx-attention-surface [--controls-opacity:0]',\n            hoverableFocusedWithinControls,\n          ],\n        })}\n        data-testid='thread'\n        id={id}\n        aria-current={current ? 'location' : undefined}\n        ref={forwardedRef}\n      >\n        {children}\n      </div>\n    );\n  },\n);\n\nThreadContent.displayName = 'Thread.Content';\n\n//\n// Header\n//\n\nexport type ThreadHeaderProps = Omit<\n  ComposableProps<{\n    /** Snippet text rendered inside a `<p>` (a string, not a DOM element). */\n    title?: string;\n    detached?: boolean;\n    /** Whether this is the current/selected thread; accents the title. */\n    current?: boolean;\n    /** Trailing controls rendered in the right column (aligns with message-tile controls). */\n    controls?: ReactNode;\n    /** Invoked when the caret affordance is activated to select/focus this thread. */\n    onSelect?: () => void;\n  }>,\n  'children'\n>;\n\n/**\n * Thread header row: caret (rail) · snippet (content) · controls. Owns its own\n * `[rail · 1fr · controls]` grid so the trailing controls align with message-tile\n * controls (which use the same template) — no grid is leaked in from the caller.\n */\nconst ThreadHeader = composable<HTMLDivElement, ThreadHeaderProps>(\n  ({ title, detached, current, controls, onSelect, ...props }, forwardedRef) => {\n    const { t } = useTranslation(translationKey);\n    const { focusComposer } = useThreadContext('Thread.Header');\n    const handleSelect = useCallback(() => {\n      onSelect?.();\n      focusComposer();\n    }, [onSelect, focusComposer]);\n\n    return (\n      <div\n        {...composableProps(props, {\n          classNames: [\n            'grid grid-cols-[var(--dx-rail-size)_1fr_min-content] items-center',\n            hoverableControls,\n            hoverableFocusedWithinControls,\n          ],\n        })}\n        ref={forwardedRef}\n      >\n        <div className='flex items-center justify-center'>\n          <IconButton\n            iconOnly\n            variant='ghost'\n            density='sm'\n            icon='ph--caret-double-right--regular'\n            label={t('select-thread.label')}\n            classNames='text-description'\n            onClick={handleSelect}\n          />\n        </div>\n        <div className='flex items-center overflow-hidden'>\n          <p\n            role='heading'\n            data-testid='thread.heading'\n            className={mx(\n              'me-2 font-medium truncate italic',\n              current ? 'text-accent-text' : 'text-description',\n              detached && 'line-through decoration-1',\n            )}\n          >\n            {title}\n          </p>\n        </div>\n        {controls}\n      </div>\n    );\n  },\n);\n\nThreadHeader.displayName = 'Thread.Header';\n\n//\n// Messages\n//\n\nconst MessageTileAdapter = ({\n  id,\n  data,\n  location,\n  draggable,\n  current,\n  selected,\n}: MosaicTileProps<MessageType.Message>) => (\n  <Mosaic.Tile id={id} data={data} location={location} draggable={draggable} current={current} selected={selected}>\n    <Message.Tile message={data} />\n  </Mosaic.Tile>\n);\n\nexport type ThreadMessagesProps = ThemedClassName<{\n  messages: readonly MessageType.Message[];\n  /** Estimated tile height for the virtualizer. */\n  estimateSize?: number;\n  currentId?: string;\n}>;\n\n/** Virtualized stack of message tiles (via Mosaic), within an internal scroll area. */\nconst ThreadMessages = ({ messages, estimateSize = 80, currentId, classNames }: ThreadMessagesProps) => {\n  const [viewport, setViewport] = useState<HTMLElement | null>(null);\n  const items = useMemo(() => messages.filter(Boolean), [messages]);\n\n  return (\n    <Mosaic.Container\n      asChild\n      orientation='vertical'\n      autoScroll={viewport}\n      currentId={currentId}\n      eventHandler={{ id: 'thread', canDrop: () => false }}\n    >\n      <ScrollArea.Root classNames={mx('col-span-2', classNames)} orientation='vertical'>\n        <ScrollArea.Viewport ref={setViewport}>\n          <Mosaic.VirtualStack\n            items={items}\n            getId={getMessageId}\n            Tile={MessageTileAdapter}\n            draggable={false}\n            getScrollElement={() => viewport}\n            estimateSize={() => estimateSize}\n          />\n        </ScrollArea.Viewport>\n      </ScrollArea.Root>\n    </Mosaic.Container>\n  );\n};\n\nThreadMessages.displayName = 'Thread.Messages';\n\n//\n// Textbox\n//\n\nexport type ThreadTextboxProps = MessageMetadata & {\n  placeholder?: string;\n  autoFocus?: boolean;\n  disabled?: boolean;\n  extensions?: Extension;\n  /**\n   * Called with the composer content on send. Return `true` to accept (the\n   * editor is cleared and remounted), `false` to reject.\n   */\n  onSend?: (text: string) => boolean;\n};\n\n/** Message composer pinned at the foot of a thread. */\nconst ThreadTextbox = ({ placeholder, autoFocus, disabled, extensions, onSend, ...metadata }: ThreadTextboxProps) => {\n  const { t } = useTranslation(translationKey);\n  const { themeMode } = useThemeContext();\n  const { registerComposerFocus } = useThreadContext('Thread.Textbox');\n  const composerRef = useRef<{ focus: () => void } | null>(null);\n  const messageRef = useRef('');\n  const [count, setCount] = useState(0);\n\n  // Expose the composer's focus to Thread.Root so the header caret can focus it.\n  useEffect(() => {\n    registerComposerFocus(() => composerRef.current?.focus());\n    return () => registerComposerFocus(undefined);\n  }, [registerComposerFocus]);\n\n  const editorExtensions = useMemo(\n    () =>\n      [\n        createBasicExtensions({ placeholder: placeholder ?? t('message.placeholder') }),\n        createThemeExtensions({ themeMode }),\n        listener({ onChange: ({ text }) => (messageRef.current = text) }),\n        command,\n        extensions,\n      ].filter(Boolean) as Extension[],\n    [themeMode, placeholder, t, extensions, count],\n  );\n\n  const handleSend = useCallback(() => {\n    const text = messageRef.current;\n    if (!text?.length || !onSend) {\n      return;\n    }\n    if (onSend(text)) {\n      messageRef.current = '';\n      setCount((value) => value + 1);\n    }\n  }, []);\n\n  return (\n    <Message.Textbox\n      ref={composerRef}\n      {...metadata}\n      autoFocus={autoFocus}\n      disabled={disabled}\n      extensions={editorExtensions}\n      onSend={handleSend}\n    />\n  );\n};\n\nThreadTextbox.displayName = 'Thread.Textbox';\n\n//\n// Status\n//\n\nexport type ThreadStatusProps = ThemedClassName<PropsWithChildren> & {\n  activity?: boolean;\n};\n\nconst ThreadStatus = forwardRef<HTMLDivElement, ThreadStatusProps>(\n  ({ activity, classNames, children, ...props }, forwardedRef) => {\n    const { t } = useTranslation(translationKey);\n    return (\n      <div\n        {...props}\n        className={mx(\n          'col-start-2 grid grid-cols-[min-content_1fr_max-content] pb-2 pe-2 text-xs text-description',\n          classNames,\n        )}\n        ref={forwardedRef}\n      >\n        <Icon\n          icon='ph--spinner--bold'\n          classNames='w-6 h-4 invisible data-[visible=show]:visible animate-spin-slow'\n          data-visible={activity ? 'show' : 'hide'}\n        />\n        <span className='truncate min-w-0' aria-live='polite'>\n          {activity ? children : null}\n        </span>\n        <span className={mx('text-end', hoverableControlItem)}>{t('enter-to-send.message')}</span>\n      </div>\n    );\n  },\n);\n\nThreadStatus.displayName = 'Thread.Status';\n\n//\n// Thread\n//\n\nexport const Thread = {\n  Root: ThreadRoot,\n  Content: ThreadContent,\n  Header: ThreadHeader,\n  Messages: ThreadMessages,\n  Textbox: ThreadTextbox,\n  Status: ThreadStatus,\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { HighlightStyle, StreamLanguage, syntaxHighlighting } from '@codemirror/language';\nimport { type Extension } from '@codemirror/state';\nimport { EditorView } from '@codemirror/view';\n\nimport { tags } from '@dxos/ui-editor';\nimport { mx } from '@dxos/ui-theme';\n\n/**\n * Highlights leading slash-commands (e.g. `/resolve`) and `@mention` tags\n * (e.g. `@Kai`, anywhere) in the message composer.\n * https://github.com/codemirror/stream-parser/blob/main/test/test-stream-parser.ts\n */\nconst parser = StreamLanguage.define<{ count: number }>({\n  startState: () => ({ count: 0 }),\n  token: (stream, state) => {\n    state.count++;\n    if (stream.eatSpace()) {\n      return null;\n    }\n    // Leading slash-command (first token only).\n    if (state.count === 1 && stream.match(/^\\/\\w+/)) {\n      return 'tagName';\n    }\n    // @mention (anywhere).\n    if (stream.match(/^@\\w+/)) {\n      return 'labelName';\n    }\n    stream.next();\n    return null;\n  },\n});\n\nconst styles = HighlightStyle.define([\n  {\n    tag: tags.tagName,\n    class: mx('dx-tag dx-tag--indigo'),\n  },\n  {\n    tag: tags.labelName,\n    class: mx('dx-tag dx-tag--blue'),\n  },\n]);\n\n// Center the inline `.dx-tag` pills on the text line. `.dx-tag` is `inline-block`\n// with vertical padding, so on a CodeMirror line it baseline-aligns and rides\n// high; overriding `vertical-align` recentres it (cf. the `cm-reference-pill`\n// precedent in `@dxos/react-ui-chat`).\nconst theme = EditorView.theme({\n  '.dx-tag': {\n    verticalAlign: 'bottom',\n  },\n});\n\nexport const command: Extension = [parser, syntaxHighlighting(styles), theme];\n", "//\n// Copyright 2026 DXOS.org\n//\n\nimport { createContext } from '@radix-ui/react-context';\nimport { type FC, type ReactNode } from 'react';\n\n// Imported so TypeScript can name this type in the emitted .d.ts (ThreadContext → Message).\n// eslint-disable-next-line unused-imports/no-unused-imports\nimport { type Message } from '@dxos/types';\n\nimport { type ThreadContextValue } from './types';\n\n/**\n * Context provided by `Thread.Root` and consumed by its parts. Extends the\n * consumer-facing {@link ThreadContextValue} with internal coordination (e.g.\n * focusing the composer from the header's select affordance).\n */\nexport type ThreadContext = ThreadContextValue & {\n  /** Register the composer's focus handler (set by `Thread.Textbox`). */\n  registerComposerFocus: (focus: (() => void) | undefined) => void;\n  /** Focus the thread composer (used by `Thread.Header`'s select affordance). */\n  focusComposer: () => void;\n};\n\nexport const [ThreadContextProvider, useThreadContext]: readonly [\n  FC<ThreadContext & { children: ReactNode }>,\n  (consumerName: string) => ThreadContext,\n] = createContext<ThreadContext>('Thread');\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { EditorView } from '@codemirror/view';\nimport { formatDistanceToNow } from 'date-fns/formatDistanceToNow';\nimport React, {\n  type ComponentPropsWithoutRef,\n  type ComponentPropsWithRef,\n  type ReactNode,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Obj, Ref } from '@dxos/echo';\nimport {\n  Avatar,\n  IconButton,\n  type ThemedClassName,\n  useOnTransition,\n  useThemeContext,\n  useTranslation,\n} from '@dxos/react-ui';\nimport { type UseTextEditorProps, useTextEditor } from '@dxos/react-ui-editor';\nimport { type ContentBlock, type Message as MessageType } from '@dxos/types';\nimport { createBasicExtensions, createThemeExtensions, keymap, listener } from '@dxos/ui-editor';\nimport { hoverableControlItem, hoverableControls, hoverableFocusedWithinControls, mx } from '@dxos/ui-theme';\nimport { hexToEmoji, hexToHue, isTruthy } from '@dxos/util';\n\nimport { command } from '../command';\nimport { useThreadContext } from '../context';\nimport { translationKey } from '../translations';\nimport { type MessageMetadata } from '../types';\n\nconst avatarSize = 7;\n\nconst buttonGroupClassNames = 'flex flex-row items-center gap-0.5 pe-2';\nconst buttonClassNames = 'p-1! transition-opacity';\n\n//\n// Root\n//\n\nexport type MessageRootProps = ThemedClassName<\n  ComponentPropsWithRef<'div'> & MessageMetadata & Partial<{ continues: boolean; controls: ReactNode }>\n>;\n\n// TODO(burdon): Show authorName on tooltip.\nconst MessageRoot = forwardRef<HTMLDivElement, MessageRootProps>(\n  (\n    {\n      authorImgSrc,\n      authorId,\n      authorName,\n      authorAvatarProps,\n      continues = true,\n      controls,\n      children,\n      classNames,\n      ...rootProps\n    },\n    forwardedRef,\n  ) => {\n    // Must wrap the message since Avatar.Label may be used in the content.\n    // Columns mirror Thread.Header (avatar/rail · content · controls) so trailing\n    // controls align with the thread header's controls.\n    return (\n      <Avatar.Root>\n        <div\n          data-testid='thread.message'\n          {...rootProps}\n          className={mx('grid grid-cols-[var(--dx-rail-size)_1fr_min-content] w-full', classNames)}\n          ref={forwardedRef}\n        >\n          <div className='flex flex-col items-center gap-2 pt-1'>\n            <Avatar.Content\n              size={avatarSize}\n              hue={authorAvatarProps?.hue || hexToHue(authorId ?? '0')}\n              fallback={authorAvatarProps?.emoji || hexToEmoji(authorId ?? '0')}\n              {...(authorImgSrc && { imgSrc: authorImgSrc })}\n            />\n            {continues && <div className='w-px grow bg-separator' />}\n          </div>\n          <div className='py-1 min-w-0'>{children}</div>\n          {controls && <div className='self-start'>{controls}</div>}\n        </div>\n      </Avatar.Root>\n    );\n  },\n);\n\nMessageRoot.displayName = 'Message.Root';\n\n//\n// Heading\n//\n\nexport type MessageHeadingProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> &\n  Pick<MessageMetadata, 'authorName' | 'timestamp'>;\n\nconst MessageHeading = ({ children, classNames, timestamp, authorName, ...props }: MessageHeadingProps) => {\n  return (\n    <div {...props} className={mx('flex gap-2 items-start', classNames)}>\n      <p className='grow'>\n        <MessageAuthorName authorName={authorName} />\n        {timestamp && <MessageTime timestamp={timestamp} />}\n      </p>\n      {children}\n    </div>\n  );\n};\n\nMessageHeading.displayName = 'Message.Heading';\n\nexport type MessageAuthorNameProps = Pick<MessageMetadata, 'authorName'>;\n\nconst MessageAuthorName = ({ authorName }: MessageAuthorNameProps) => {\n  const { t } = useTranslation(translationKey);\n  return (\n    <Avatar.Label classNames='block truncate text-sm text-subdued'>{authorName ?? t('anonymous.label')}</Avatar.Label>\n  );\n};\n\nMessageAuthorName.displayName = 'Message.AuthorName';\n\nexport type MessageTimeProps = Pick<MessageMetadata, 'timestamp'>;\n\nconst MessageTime = ({ timestamp }: MessageTimeProps) => {\n  const { dtLocale } = useTranslation(translationKey);\n  const dt = timestamp ? new Date(timestamp) : undefined;\n  return (\n    <time className='block text-subdued text-xs pb-0.5' dateTime={dt?.toISOString()}>\n      {dt ? formatDistanceToNow(dt, { locale: dtLocale, addSuffix: true }) : ''}\n    </time>\n  );\n};\n\nMessageTime.displayName = 'Message.Time';\n\n//\n// Body\n//\n\nexport type MessageBodyProps = {\n  /** The message whose content blocks are rendered. */\n  message: MessageType.Message;\n  /** When true, the local user authored this message. */\n  isAuthor?: boolean;\n  /** When true, the text block is editable. */\n  editing?: boolean;\n  /** Persist an edited text block. */\n  onSave?: (text: string) => void;\n};\n\n/**\n * Renders a message's content blocks: text (via editor), proposal, and\n * object/reference tiles (delegated to the injected `Object` component).\n */\nconst MessageBody = ({ message, isAuthor, editing, onSave }: MessageBodyProps) => {\n  const { components } = useThreadContext('Message.Body');\n  const textBlockIndex = message.blocks.findIndex((block) => block._tag === 'text');\n  const textBlock = textBlockIndex !== -1 ? (message.blocks[textBlockIndex] as ContentBlock.Text) : undefined;\n  const proposalBlock = message.blocks.find((block) => block._tag === 'proposal') as ContentBlock.Proposal | undefined;\n  const references = message.blocks\n    .filter((block) => block._tag === 'reference')\n    .map((block) => (block as ContentBlock.Reference).reference);\n  const Object = components.Object;\n\n  return (\n    <>\n      {textBlock && <TextBlock block={textBlock} isAuthor={isAuthor} editing={editing} onSave={onSave} />}\n      {proposalBlock && <div className='me-4 italic'>{proposalBlock.text}</div>}\n      {Object &&\n        Ref.Array.targets(references).map((reference, index) => (\n          <Object key={index} subject={reference as Obj.Unknown} />\n        ))}\n    </>\n  );\n};\n\nMessageBody.displayName = 'Message.Body';\n\nconst TextBlock = ({\n  block,\n  isAuthor,\n  editing,\n  onSave,\n}: {\n  block: ContentBlock.Text;\n  isAuthor?: boolean;\n  editing?: boolean;\n  onSave?: (text: string) => void;\n}) => {\n  const { themeMode } = useThemeContext();\n  const inMemoryContentRef = useRef(block.text);\n\n  const handleDocumentChange = useCallback((next: string) => {\n    inMemoryContentRef.current = next;\n  }, []);\n\n  const saveDocumentChange = useCallback(() => {\n    onSave?.(inMemoryContentRef.current);\n  }, [onSave]);\n\n  useOnTransition(editing, true, false, saveDocumentChange);\n\n  const { parentRef, focusAttributes, view } = useTextEditor(\n    () => ({\n      initialValue: block.text,\n      extensions: [\n        createBasicExtensions({ readOnly: !isAuthor || !editing }),\n        createThemeExtensions({ themeMode }),\n        command,\n        EditorView.updateListener.of((update) => {\n          if (update.docChanged) {\n            handleDocumentChange(update.state.doc.toString());\n          }\n        }),\n      ],\n    }),\n    [block.text, editing, isAuthor, themeMode, handleDocumentChange],\n  );\n\n  useEffect(() => {\n    if (editing) {\n      view?.focus();\n    }\n  }, [editing, view]);\n\n  return <div ref={parentRef} className='me-4' {...focusAttributes} />;\n};\n\n//\n// Textbox\n//\n\nexport type MessageTextboxProps = {\n  disabled?: boolean;\n  onSend?: () => void;\n  onClear?: () => void;\n  onEditorFocus?: () => void;\n} & MessageMetadata &\n  UseTextEditorProps;\n\nconst keyBindings = ({ onSend, onClear }: Pick<MessageTextboxProps, 'onSend' | 'onClear'>) => [\n  {\n    key: 'Enter',\n    run: () => {\n      if (onSend) {\n        onSend();\n        return true;\n      }\n      return false;\n    },\n  },\n  {\n    key: 'Meta+Backspace',\n    run: () => {\n      if (onClear) {\n        onClear();\n        return true;\n      }\n      return false;\n    },\n  },\n];\n\nexport type MessageTextboxHandle = { focus: () => void };\n\nconst MessageTextbox = forwardRef<MessageTextboxHandle, MessageTextboxProps>(\n  (\n    {\n      id,\n      authorId,\n      authorName,\n      authorImgSrc,\n      authorAvatarProps,\n      disabled,\n      extensions,\n      onSend,\n      onClear,\n      onEditorFocus,\n      ...editorProps\n    },\n    forwardedRef,\n  ) => {\n    const { parentRef, focusAttributes, view } = useTextEditor(\n      () => ({\n        id,\n        extensions: [\n          keymap.of(keyBindings({ onSend, onClear })),\n          listener({\n            onFocus: ({ focusing }) => {\n              if (focusing) {\n                onEditorFocus?.();\n              }\n            },\n          }),\n          extensions,\n        ].filter(isTruthy),\n        ...editorProps,\n      }),\n      [id, extensions],\n    );\n\n    useImperativeHandle(forwardedRef, () => ({ focus: () => view?.focus() }), [view]);\n\n    return (\n      <MessageRoot {...{ id, authorId, authorName, authorImgSrc, authorAvatarProps }} continues={false}>\n        <div\n          ref={parentRef}\n          className={mx('py-0.5 me-1 rounded-xs dx-focus-ring', disabled && 'opacity-50')}\n          {...focusAttributes}\n        />\n      </MessageRoot>\n    );\n  },\n);\n\nMessageTextbox.displayName = 'Message.Textbox';\n\n//\n// Tile\n//\n\nexport type MessageTileProps = {\n  message: MessageType.Message;\n  classNames?: MessageRootProps['classNames'];\n};\n\n/**\n * Full message tile (frame + heading + controls + body). Reads `Thread.Root`\n * context for metadata resolution, injected renderers, and callbacks. This is\n * the unit rendered by `Thread.Messages`.\n */\nconst MessageTile = ({ message, classNames }: MessageTileProps) => {\n  const { t } = useTranslation(translationKey);\n  const { getMetadata, identityDid, editable, onMessageDelete, onAcceptProposal } = useThreadContext('Message.Tile');\n  const [editing, setEditing] = useState(false);\n\n  const metadata = getMetadata(message);\n  const isAuthor = !!identityDid && identityDid === metadata.authorId;\n  const hasProposal = message.blocks.some((block) => block._tag === 'proposal');\n\n  const handleEdit = useCallback(() => setEditing((value) => !value), []);\n  const handleDelete = useCallback(() => onMessageDelete?.(message.id), [onMessageDelete, message.id]);\n  const handleAcceptProposal = useCallback(() => onAcceptProposal?.(message.id), [onAcceptProposal, message.id]);\n  const handleSave = useCallback(\n    (text: string) => {\n      Obj.update(message, (message) => {\n        const block = message.blocks.find((block) => block._tag === 'text');\n        if (block && block._tag === 'text') {\n          block.text = text;\n        }\n      });\n    },\n    [message],\n  );\n\n  const showEdit = isAuthor && editable;\n  const showAccept = hasProposal && !!onAcceptProposal;\n  const showDelete = !!onMessageDelete;\n  const controls =\n    showEdit || showAccept || showDelete ? (\n      <div className={buttonGroupClassNames}>\n        {showEdit && (\n          <IconButton\n            data-testid={editing ? 'thread.message.save' : 'thread.message.edit'}\n            variant='ghost'\n            icon={editing ? 'ph--check--regular' : 'ph--pencil-simple--regular'}\n            iconOnly\n            label={t(editing ? 'save-message.label' : 'edit-message.label')}\n            classNames={[buttonClassNames, hoverableControlItem]}\n            onClick={handleEdit}\n          />\n        )}\n        {showAccept && (\n          <IconButton\n            data-testid='thread.message.accept'\n            variant='ghost'\n            icon='ph--check--regular'\n            iconOnly\n            label={t('accept-proposal.label')}\n            classNames={[buttonClassNames, hoverableControlItem]}\n            onClick={handleAcceptProposal}\n          />\n        )}\n        {showDelete && (\n          <IconButton\n            data-testid='thread.message.delete'\n            variant='ghost'\n            icon='ph--x--regular'\n            iconOnly\n            label={t('delete-message.label')}\n            classNames={[buttonClassNames, hoverableControlItem]}\n            onClick={handleDelete}\n          />\n        )}\n      </div>\n    ) : undefined;\n\n  return (\n    <MessageRoot\n      {...metadata}\n      controls={controls}\n      classNames={[hoverableControls, hoverableFocusedWithinControls, classNames]}\n    >\n      <MessageHeading authorName={metadata.authorName} timestamp={metadata.timestamp} />\n      <MessageBody message={message} isAuthor={isAuthor} editing={editing} onSave={handleSave} />\n    </MessageRoot>\n  );\n};\n\nMessageTile.displayName = 'Message.Tile';\n\n//\n// Message\n//\n\nexport const Message = {\n  Root: MessageRoot,\n  Heading: MessageHeading,\n  AuthorName: MessageAuthorName,\n  Time: MessageTime,\n  Body: MessageBody,\n  Textbox: MessageTextbox,\n  Tile: MessageTile,\n};\n"],
-  "mappings": "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",
-  "names": ["React", "forwardRef", "useCallback", "useEffect", "useMemo", "useRef", "useState", "Obj", "Icon", "IconButton", "ScrollArea", "composable", "composableProps", "useThemeContext", "useTranslation", "Mosaic", "createBasicExtensions", "createThemeExtensions", "listener", "hoverableControlItem", "hoverableControls", "hoverableFocusedWithinControls", "mx", "HighlightStyle", "StreamLanguage", "syntaxHighlighting", "EditorView", "tags", "mx", "parser", "define", "startState", "count", "token", "stream", "state", "eatSpace", "match", "next", "styles", "tag", "tagName", "class", "labelName", "theme", "verticalAlign", "command", "createContext", "ThreadContextProvider", "useThreadContext", "EditorView", "formatDistanceToNow", "React", "forwardRef", "useCallback", "useEffect", "useImperativeHandle", "useRef", "useState", "Obj", "Ref", "Avatar", "IconButton", "useOnTransition", "useThemeContext", "useTranslation", "useTextEditor", "createBasicExtensions", "createThemeExtensions", "keymap", "listener", "hoverableControlItem", "hoverableControls", "hoverableFocusedWithinControls", "mx", "hexToEmoji", "hexToHue", "isTruthy", "avatarSize", "buttonGroupClassNames", "buttonClassNames", "MessageRoot", "forwardRef", "authorImgSrc", "authorId", "authorName", "authorAvatarProps", "continues", "controls", "children", "classNames", "rootProps", "forwardedRef", "Avatar", "Root", "div", "data-testid", "className", "mx", "ref", "Content", "size", "hue", "hexToHue", "fallback", "emoji", "hexToEmoji", "imgSrc", "displayName", "MessageHeading", "timestamp", "props", "p", "MessageAuthorName", "MessageTime", "t", "useTranslation", "translationKey", "Label", "dtLocale", "dt", "Date", "undefined", "time", "dateTime", "toISOString", "formatDistanceToNow", "locale", "addSuffix", "MessageBody", "message", "isAuthor", "editing", "onSave", "components", "useThreadContext", "textBlockIndex", "blocks", "findIndex", "block", "_tag", "textBlock", "proposalBlock", "find", "references", "filter", "map", "reference", "Object", "TextBlock", "text", "Ref", "Array", "targets", "index", "key", "subject", "themeMode", "useThemeContext", "inMemoryContentRef", "useRef", "handleDocumentChange", "useCallback", "next", "current", "saveDocumentChange", "useOnTransition", "parentRef", "focusAttributes", "view", "useTextEditor", "initialValue", "extensions", "createBasicExtensions", "readOnly", "createThemeExtensions", "command", "EditorView", "updateListener", "of", "update", "docChanged", "state", "doc", "toString", "useEffect", "focus", "keyBindings", "onSend", "onClear", "run", "MessageTextbox", "id", "disabled", "onEditorFocus", "editorProps", "keymap", "listener", "onFocus", "focusing", "isTruthy", "useImperativeHandle", "MessageTile", "getMetadata", "identityDid", "editable", "onMessageDelete", "onAcceptProposal", "setEditing", "useState", "metadata", "hasProposal", "some", "handleEdit", "value", "handleDelete", "handleAcceptProposal", "handleSave", "Obj", "showEdit", "showAccept", "showDelete", "IconButton", "variant", "icon", "iconOnly", "label", "hoverableControlItem", "onClick", "hoverableControls", "hoverableFocusedWithinControls", "Message", "Heading", "AuthorName", "Time", "Body", "Textbox", "Tile", "getMessageId", "message", "Obj", "getURI", "ThreadRoot", "children", "getMetadata", "components", "identityDid", "editable", "onMessageDelete", "onAcceptProposal", "composerFocus", "useRef", "undefined", "registerComposerFocus", "useCallback", "focus", "current", "focusComposer", "React", "ThreadContextProvider", "Mosaic", "Root", "displayName", "ThreadContent", "composable", "id", "props", "forwardedRef", "div", "composableProps", "role", "classNames", "hoverableFocusedWithinControls", "data-testid", "aria-current", "ref", "ThreadHeader", "title", "detached", "controls", "onSelect", "t", "useTranslation", "translationKey", "useThreadContext", "handleSelect", "hoverableControls", "className", "IconButton", "iconOnly", "variant", "density", "icon", "label", "onClick", "p", "mx", "MessageTileAdapter", "data", "location", "draggable", "selected", "Tile", "Message", "ThreadMessages", "messages", "estimateSize", "currentId", "viewport", "setViewport", "useState", "items", "useMemo", "filter", "Boolean", "Container", "asChild", "orientation", "autoScroll", "eventHandler", "canDrop", "ScrollArea", "Viewport", "VirtualStack", "getId", "getScrollElement", "ThreadTextbox", "placeholder", "autoFocus", "disabled", "extensions", "onSend", "metadata", "themeMode", "useThemeContext", "composerRef", "messageRef", "count", "setCount", "useEffect", "editorExtensions", "createBasicExtensions", "createThemeExtensions", "listener", "onChange", "text", "command", "handleSend", "length", "value", "Textbox", "ThreadStatus", "forwardRef", "activity", "Icon", "data-visible", "span", "aria-live", "hoverableControlItem", "Thread", "Content", "Header", "Messages", "Status"]
-}