collabmd 0.1.43 → 0.1.44

package/src/client/presentation/comments-panel.js

@@ -1,578 +0,0 @@
-import { COMMENT_BODY_MAX_LENGTH } from '../../domain/comment-threads.js';
-import { buttonClassNames } from './components/ui/button.js';
-import { inputClassNames } from './components/ui/input.js';
-
-function isLeafSourceBlock(element) {
-  return !element.querySelector('[data-source-line]');
-}
-
-function isCommentablePreviewBlock(element) {
-  if (!element) {
-    return false;
-  }
-
-  const interactiveEmbedSelector = '.mermaid-shell, .plantuml-shell, .drawio-embed, .drawio-embed-placeholder, .excalidraw-embed, .excalidraw-embed-placeholder';
-  return !element.matches(interactiveEmbedSelector) && !element.querySelector(interactiveEmbedSelector);
-}
-
-function parseLineNumber(value) {
-  const parsed = Number.parseInt(value || '', 10);
-  return Number.isFinite(parsed) ? parsed : null;
-}
-
-function formatLineLabel(anchor) {
-  if (!anchor) {
-    return 'No source anchor';
-  }
-
-  return anchor.startLine === anchor.endLine
-    ? `Line ${anchor.startLine}`
-    : `Lines ${anchor.startLine}-${anchor.endLine}`;
-}
-
-function sortThreads(threads = []) {
-  return [...threads].sort((left, right) => (
-    (left.anchor?.startLine ?? 0) - (right.anchor?.startLine ?? 0)
-      || left.createdAt - right.createdAt
-  ));
-}
-
-export function countThreadsForSourceBlocks(blocks = [], threads = []) {
-  const normalizedBlocks = blocks
-    .map((block, index) => {
-      const startLine = Number(block?.startLine);
-      const endLine = Number(block?.endLine ?? startLine);
-      if (!Number.isFinite(startLine) || startLine <= 0) {
-        return null;
-      }
-
-      return {
-        endExclusive: Math.max(endLine, startLine + 1),
-        index,
-        startLine,
-      };
-    })
-    .filter(Boolean)
-    .sort((left, right) => (
-      left.startLine - right.startLine
-        || left.endExclusive - right.endExclusive
-        || left.index - right.index
-    ));
-  const counts = new Array(blocks.length).fill(0);
-  let threadIndex = 0;
-
-  normalizedBlocks.forEach((block) => {
-    while (threadIndex < threads.length && (threads[threadIndex]?.anchor?.startLine ?? 0) < block.startLine) {
-      threadIndex += 1;
-    }
-
-    let countIndex = threadIndex;
-    while (countIndex < threads.length && (threads[countIndex]?.anchor?.startLine ?? 0) < block.endExclusive) {
-      countIndex += 1;
-    }
-
-    counts[block.index] = countIndex - threadIndex;
-    threadIndex = countIndex;
-  });
-
-  return counts;
-}
-
-export class CommentsPanel {
-  constructor({
-    panelElement,
-    previewContainer,
-    previewElement,
-    toggleButton,
-    onCreateThread,
-    onNavigateToLine,
-    onReplyToThread,
-    onResolveThread,
-  }) {
-    this.panel = panelElement;
-    this.previewContainer = previewContainer;
-    this.previewElement = previewElement;
-    this.toggleButton = toggleButton;
-    this.onCreateThread = onCreateThread;
-    this.onNavigateToLine = onNavigateToLine;
-    this.onReplyToThread = onReplyToThread;
-    this.onResolveThread = onResolveThread;
-
-    this.header = this.panel?.querySelector('.comments-header');
-    this.toggle = this.panel?.querySelector('.comments-toggle');
-    this.countBadge = this.panel?.querySelector('.comments-count');
-    this.body = this.panel?.querySelector('.comments-body');
-    this.emptyState = this.panel?.querySelector('.comments-empty-state');
-    this.list = this.panel?.querySelector('.comments-list');
-    this.composer = this.panel?.querySelector('.comment-composer');
-    this.composerForm = this.panel?.querySelector('#commentComposerForm');
-    this.composerLabel = this.panel?.querySelector('#commentComposerLabel');
-    this.composerInput = this.panel?.querySelector('#commentComposerInput');
-    this.composerCancel = this.panel?.querySelector('#commentComposerCancel');
-    this.replyDraftThreadId = null;
-    this.currentFile = null;
-    this.draftAnchor = null;
-    this.expanded = false;
-    this.pendingFocusTarget = null;
-    this.supported = false;
-    this.threads = [];
-    this.timeFormatter = new Intl.DateTimeFormat(undefined, {
-      day: 'numeric',
-      hour: 'numeric',
-      minute: '2-digit',
-      month: 'short',
-    });
-
-    if (this.composerInput) {
-      this.composerInput.setAttribute('maxlength', String(COMMENT_BODY_MAX_LENGTH));
-    }
-
-    this.bindEvents();
-    this.render();
-  }
-
-  bindEvents() {
-    this.header?.addEventListener('click', () => {
-      if (!this.currentFile || !this.supported) {
-        return;
-      }
-
-      this.expanded = !this.expanded;
-      this.render();
-      if (this.expanded) {
-        this.scrollIntoView();
-      }
-    });
-
-    this.header?.addEventListener('keydown', (event) => {
-      if (event.key !== 'Enter' && event.key !== ' ') {
-        return;
-      }
-
-      event.preventDefault();
-      this.header.click();
-    });
-
-    this.toggleButton?.addEventListener('click', (event) => {
-      event.preventDefault();
-      if (!this.currentFile || !this.supported) {
-        return;
-      }
-
-      this.expanded = !this.expanded;
-      this.render();
-      if (this.expanded) {
-        this.scrollIntoView();
-      }
-    });
-
-    this.composerCancel?.addEventListener('click', () => {
-      this.clearDraft();
-    });
-
-    this.composerForm?.addEventListener('submit', async (event) => {
-      event.preventDefault();
-      if (!this.draftAnchor || !this.composerInput) {
-        return;
-      }
-
-      const threadId = await this.onCreateThread?.({
-        body: this.composerInput.value,
-        endLine: this.draftAnchor.endLine,
-        startLine: this.draftAnchor.startLine,
-      });
-
-      if (!threadId) {
-        this.composerInput.focus();
-        return;
-      }
-
-      this.composerInput.value = '';
-      this.clearDraft({ keepExpanded: true });
-    });
-  }
-
-  setCurrentFile(filePath, { supported = false } = {}) {
-    const didChangeFile = this.currentFile !== filePath;
-    this.currentFile = filePath;
-    this.supported = Boolean(filePath && supported);
-
-    if (!this.supported) {
-      this.draftAnchor = null;
-      this.replyDraftThreadId = null;
-      this.expanded = false;
-      this.threads = [];
-    } else if (didChangeFile) {
-      this.draftAnchor = null;
-      this.replyDraftThreadId = null;
-      this.expanded = false;
-    }
-
-    this.render();
-    this.decoratePreviewAnchors();
-  }
-
-  setThreads(threads = []) {
-    this.threads = sortThreads(threads);
-    if (this.replyDraftThreadId && !this.threads.some((thread) => thread.id === this.replyDraftThreadId)) {
-      this.replyDraftThreadId = null;
-    }
-
-    this.render();
-    this.decoratePreviewAnchors();
-  }
-
-  openComposerForRange(anchor, { scrollIntoView = true } = {}) {
-    if (!this.supported) {
-      return;
-    }
-
-    this.draftAnchor = {
-      endLine: Math.max(Math.round(anchor?.endLine ?? anchor?.startLine ?? 1), 1),
-      startLine: Math.max(Math.round(anchor?.startLine ?? 1), 1),
-    };
-    if (this.draftAnchor.endLine < this.draftAnchor.startLine) {
-      this.draftAnchor.endLine = this.draftAnchor.startLine;
-    }
-
-    this.replyDraftThreadId = null;
-    this.expanded = true;
-    this.pendingFocusTarget = 'composer';
-    this.render();
-    this.decoratePreviewAnchors();
-
-    if (scrollIntoView) {
-      this.scrollIntoView();
-    }
-  }
-
-  clearDraft({ keepExpanded = false } = {}) {
-    this.draftAnchor = null;
-    this.pendingFocusTarget = null;
-    if (!keepExpanded) {
-      this.expanded = false;
-    }
-
-    this.render();
-    this.decoratePreviewAnchors();
-  }
-
-  decoratePreviewAnchors() {
-    if (!this.previewElement) {
-      return;
-    }
-
-    Array.from(this.previewElement.querySelectorAll('.comment-anchor-btn')).forEach((button) => button.remove());
-    Array.from(this.previewElement.querySelectorAll('.comment-anchor-target')).forEach((element) => {
-      element.classList.remove('comment-anchor-target', 'has-comments', 'is-comment-target');
-    });
-
-    if (!this.supported) {
-      return;
-    }
-
-    if (this.previewElement.querySelector('.mermaid-shell, .plantuml-shell, .drawio-embed, .drawio-embed-placeholder, .excalidraw-embed, .excalidraw-embed-placeholder')) {
-      return;
-    }
-
-    const blocks = Array.from(this.previewElement.querySelectorAll('[data-source-line]'))
-      .filter((element) => isLeafSourceBlock(element) && isCommentablePreviewBlock(element));
-    const threadCounts = countThreadsForSourceBlocks(
-      blocks.map((block) => ({
-        endLine: parseLineNumber(block.getAttribute('data-source-line-end')) ?? parseLineNumber(block.getAttribute('data-source-line')) ?? 1,
-        startLine: parseLineNumber(block.getAttribute('data-source-line')),
-      })),
-      this.threads,
-    );
-
-    blocks.forEach((block, index) => {
-      const startLine = parseLineNumber(block.getAttribute('data-source-line'));
-      const endLine = parseLineNumber(block.getAttribute('data-source-line-end')) ?? (startLine ?? 1);
-      if (!startLine) {
-        return;
-      }
-
-      const totalCount = threadCounts[index] ?? 0;
-      const button = document.createElement('button');
-      button.type = 'button';
-      button.className = 'comment-anchor-btn';
-      button.setAttribute('aria-label', totalCount > 0
-        ? `${totalCount} comments on ${formatLineLabel({ endLine, startLine })}`
-        : `Add comment on ${formatLineLabel({ endLine, startLine })}`);
-      button.title = totalCount > 0
-        ? `${totalCount} comments`
-        : `Add comment on ${formatLineLabel({ endLine, startLine })}`;
-      button.dataset.count = totalCount > 0 ? String(totalCount) : '+';
-
-      button.addEventListener('click', (event) => {
-        event.preventDefault();
-        event.stopPropagation();
-        this.openComposerForRange({ endLine, startLine });
-      });
-
-      block.classList.add('comment-anchor-target');
-      block.classList.toggle('has-comments', totalCount > 0);
-      block.classList.toggle(
-        'is-comment-target',
-        this.draftAnchor?.startLine === startLine && this.draftAnchor?.endLine === endLine,
-      );
-      button.classList.toggle('has-comments', totalCount > 0);
-      button.classList.toggle('has-open-comments', totalCount > 0);
-      block.appendChild(button);
-    });
-  }
-
-  render() {
-    if (!this.panel) {
-      return;
-    }
-
-    const totalCount = this.threads.length;
-    const label = totalCount === 0
-      ? 'Comments'
-      : `${totalCount} comment${totalCount === 1 ? '' : 's'}`;
-    const shouldShowPanel = Boolean(
-      this.currentFile && this.supported && (this.expanded || this.draftAnchor || totalCount > 0),
-    );
-
-    this.panel.classList.toggle('hidden', !shouldShowPanel);
-    this.panel.classList.toggle('expanded', this.expanded);
-    this.body?.setAttribute('aria-hidden', String(!this.expanded));
-    this.header?.setAttribute('aria-expanded', String(this.expanded));
-
-    if (this.body) {
-      this.body.toggleAttribute('inert', !this.expanded);
-    }
-
-    if (this.toggle) {
-      this.toggle.textContent = label;
-    }
-
-    if (this.countBadge) {
-      this.countBadge.textContent = totalCount > 0 ? String(totalCount) : '';
-    }
-
-    if (this.toggleButton) {
-      this.toggleButton.classList.toggle('hidden', !this.currentFile || !this.supported);
-      this.toggleButton.classList.toggle('active', this.expanded);
-      this.toggleButton.setAttribute('aria-expanded', String(this.expanded));
-      this.toggleButton.textContent = totalCount > 0 ? `Comments ${totalCount}` : 'Comments';
-    }
-
-    this.renderComposer();
-    this.renderThreads();
-    this.focusPendingTarget();
-  }
-
-  renderComposer() {
-    if (!this.composer || !this.composerLabel || !this.composerInput) {
-      return;
-    }
-
-    const visible = Boolean(this.draftAnchor);
-    this.composer.classList.toggle('hidden', !visible);
-    this.composerLabel.textContent = visible
-      ? `New comment on ${formatLineLabel(this.draftAnchor)}`
-      : '';
-    this.composerInput.disabled = !visible;
-
-    if (!visible) {
-      this.composerInput.value = '';
-    }
-
-    if (this.emptyState) {
-      this.emptyState.classList.toggle('hidden', visible || this.threads.length > 0);
-    }
-  }
-
-  renderThreads() {
-    if (!this.list) {
-      return;
-    }
-
-    this.list.replaceChildren();
-    if (this.threads.length === 0) {
-      return;
-    }
-
-    const fragment = document.createDocumentFragment();
-    this.threads.forEach((thread) => {
-      fragment.appendChild(this.createThreadElement(thread));
-    });
-    this.list.appendChild(fragment);
-  }
-
-  createThreadElement(thread) {
-    const article = document.createElement('article');
-    article.className = 'comment-thread';
-
-    const header = document.createElement('div');
-    header.className = 'comment-thread-header';
-
-    const meta = document.createElement('div');
-    meta.className = 'comment-thread-meta';
-
-    const anchorButton = document.createElement('button');
-    anchorButton.type = 'button';
-    anchorButton.className = 'comment-thread-anchor';
-    anchorButton.textContent = formatLineLabel(thread.anchor);
-    anchorButton.addEventListener('click', () => {
-      this.onNavigateToLine?.(thread.anchor?.startLine ?? 1);
-    });
-
-    const status = document.createElement('span');
-    status.className = 'comment-thread-status';
-    status.textContent = 'Open';
-
-    meta.append(anchorButton, status);
-
-    const actions = document.createElement('div');
-    actions.className = 'comment-thread-actions';
-
-    const replyButton = document.createElement('button');
-    replyButton.type = 'button';
-    replyButton.className = 'comment-thread-action';
-    replyButton.textContent = this.replyDraftThreadId === thread.id ? 'Cancel reply' : 'Reply';
-    replyButton.addEventListener('click', () => {
-      this.replyDraftThreadId = this.replyDraftThreadId === thread.id ? null : thread.id;
-      this.pendingFocusTarget = this.replyDraftThreadId ? thread.id : null;
-      this.render();
-    });
-
-    const resolveButton = document.createElement('button');
-    resolveButton.type = 'button';
-    resolveButton.className = 'comment-thread-action';
-    resolveButton.textContent = 'Resolve';
-    resolveButton.addEventListener('click', async () => {
-      await this.onResolveThread?.(thread.id, true);
-    });
-
-    actions.append(replyButton, resolveButton);
-    header.append(meta, actions);
-
-    const excerpt = document.createElement('p');
-    excerpt.className = 'comment-thread-excerpt';
-    excerpt.textContent = thread.anchor?.excerpt || 'No source excerpt';
-
-    const messages = document.createElement('div');
-    messages.className = 'comment-thread-messages';
-    thread.messages.forEach((message) => {
-      messages.appendChild(this.createMessageElement(message));
-    });
-
-    article.append(header, excerpt, messages);
-
-    if (this.replyDraftThreadId === thread.id) {
-      article.appendChild(this.createReplyComposer(thread));
-    }
-
-    return article;
-  }
-
-  createMessageElement(message) {
-    const container = document.createElement('div');
-    container.className = 'comment-message';
-
-    const meta = document.createElement('div');
-    meta.className = 'comment-message-meta';
-
-    const author = document.createElement('span');
-    author.className = 'comment-message-author';
-    author.textContent = message.userName;
-
-    const time = document.createElement('span');
-    time.className = 'comment-message-time';
-    time.textContent = this.formatTimestamp(message.createdAt);
-
-    meta.append(author, time);
-
-    const body = document.createElement('p');
-    body.className = 'comment-message-body';
-    body.textContent = message.body;
-
-    container.append(meta, body);
-    return container;
-  }
-
-  createReplyComposer(thread) {
-    const form = document.createElement('form');
-    form.className = 'comment-reply-form';
-
-    const textarea = document.createElement('textarea');
-    textarea.className = inputClassNames({ extra: 'comment-reply-input' });
-    textarea.rows = 3;
-    textarea.placeholder = `Reply on ${formatLineLabel(thread.anchor)}...`;
-    textarea.maxLength = COMMENT_BODY_MAX_LENGTH;
-    textarea.dataset.replyThreadId = thread.id;
-
-    const actions = document.createElement('div');
-    actions.className = 'comment-reply-actions';
-
-    const cancelButton = document.createElement('button');
-    cancelButton.type = 'button';
-    cancelButton.className = buttonClassNames({ variant: 'secondary' });
-    cancelButton.textContent = 'Cancel';
-    cancelButton.addEventListener('click', () => {
-      this.replyDraftThreadId = null;
-      this.render();
-    });
-
-    const submitButton = document.createElement('button');
-    submitButton.type = 'submit';
-    submitButton.className = buttonClassNames({ variant: 'primary' });
-    submitButton.textContent = 'Reply';
-
-    actions.append(cancelButton, submitButton);
-    form.append(textarea, actions);
-
-    form.addEventListener('submit', async (event) => {
-      event.preventDefault();
-      const messageId = await this.onReplyToThread?.(thread.id, textarea.value);
-      if (!messageId) {
-        textarea.focus();
-        return;
-      }
-
-      this.replyDraftThreadId = null;
-      this.render();
-    });
-
-    return form;
-  }
-
-  focusPendingTarget() {
-    if (!this.pendingFocusTarget) {
-      return;
-    }
-
-    const target = this.pendingFocusTarget;
-    this.pendingFocusTarget = null;
-    requestAnimationFrame(() => {
-      if (target === 'composer') {
-        this.composerInput?.focus();
-        return;
-      }
-
-      this.panel?.querySelector(`textarea[data-reply-thread-id="${target}"]`)?.focus();
-    });
-  }
-
-  formatTimestamp(value) {
-    if (!Number.isFinite(value)) {
-      return '';
-    }
-
-    try {
-      return this.timeFormatter.format(new Date(value));
-    } catch {
-      return '';
-    }
-  }
-
-  scrollIntoView() {
-    this.panel?.scrollIntoView({
-      behavior: 'smooth',
-      block: 'start',
-    });
-  }
-}

package/src/client/presentation/components/ui/badge.js

@@ -1,24 +0,0 @@
-import { classNames } from './class-names.js';
-
-/**
- * @param {{ tone?: 'accent'|'solid'|'muted'|'code', count?: boolean, hidden?: boolean, extra?: string|string[] }} [options]
- * @returns {string}
- */
-export function badgeClassNames(options = {}) {
-  const {
-    tone = 'accent',
-    count = false,
-    hidden = false,
-    extra = [],
-  } = options;
-
-  return classNames(
-    'ui-pill-badge',
-    tone && `ui-pill-badge--${tone}`,
-    {
-      'ui-pill-badge--count': count,
-      hidden,
-    },
-    extra,
-  );
-}

package/src/client/presentation/components/ui/ensure-ui-component-styles.js

@@ -1,18 +0,0 @@
-let uiComponentStylesPromise = null;
-
-export function ensureUiComponentStyles() {
-  if (typeof document === 'undefined') {
-    return Promise.resolve();
-  }
-
-  if (!uiComponentStylesPromise) {
-    uiComponentStylesPromise = Promise.all([
-      import('../../../styles/primitives/controls.css'),
-      import('../../../styles/components/actions.css'),
-      import('../../../styles/components/navigation.css'),
-      import('../../../styles/components/states.css'),
-    ]).then(() => undefined);
-  }
-
-  return uiComponentStylesPromise;
-}

package/src/client/presentation/components/ui/input.js

@@ -1,9 +0,0 @@
-import { classNames } from './class-names.js';
-
-/**
- * @param {{ extra?: string|string[] }} [options]
- * @returns {string}
- */
-export function inputClassNames(options = {}) {
-  return classNames('ui-input', options.extra ?? []);
-}

package/src/client/styles/features/collaboration-ui.css

@@ -1,3 +0,0 @@
-@import './collaboration-presence.css';
-@import './collaboration-chat.css';
-@import './collaboration-dialogs.css';

package/src/client/styles/features/comments.css

@@ -1,5 +0,0 @@
-@import './comments-drawer.css';
-@import './comment-overview.css';
-@import './comment-overlays.css';
-@import './comment-card.css';
-@import './comment-markdown.css';

package/src/client/styles/features/diff.css

@@ -1,3 +0,0 @@
-@import './diff-toolbar.css';
-@import './diff-commit.css';
-@import './diff-lines.css';

package/src/client/styles/features/git.css

@@ -1,3 +0,0 @@
-@import './git-branch.css';
-@import './git-files.css';
-@import './git-history.css';

package/src/client/styles/features/preview-content.css

@@ -1,3 +0,0 @@
-@import './preview-markdown.css';
-@import './media-lightbox.css';
-@import './embedded-preview.css';

package/src/client/styles/features/preview-sidebars.css

@@ -1,2 +0,0 @@
-@import './backlinks.css';
-@import './outline.css';

package/src/client/styles/overrides/vendor.css

@@ -1,2 +0,0 @@
-@import './highlightjs.css';
-@import './codemirror.css';

package/src/server/domain/collaboration/room-client-state-store.js

@@ -1,29 +0,0 @@
-function createClientState() {
-  return {
-    backpressureCloseIssued: false,
-    controlledClientIds: new Set(),
-    transportCloseIssued: false,
-  };
-}
-
-export class RoomClientStateStore {
-  constructor() {
-    this.clientState = new WeakMap();
-  }
-
-  register(client) {
-    const state = createClientState();
-    this.clientState.set(client, state);
-    return state;
-  }
-
-  unregister(client) {
-    const state = this.get(client);
-    this.clientState.delete(client);
-    return state;
-  }
-
-  get(client) {
-    return this.clientState.get(client) ?? null;
-  }
-}

package/src/server/domain/git-service.js

@@ -1 +0,0 @@
-export { GitService } from '../infrastructure/git/git-service.js';

package/src/server/domain/plantuml-renderer.js

@@ -1 +0,0 @@
-export { PlantUmlRenderer } from '../infrastructure/plantuml/plantuml-renderer.js';