@oar-sh/oar 0.9.1 → 0.9.3

package/server/public/app/pwa-install.js

@@ -1,16 +1,21 @@
 import { BASE, IS_SHARED_VIEW, showTransientRelayNotice } from './store.js';
+import { loadPwaAppNameSetting, updatePwaAppNameSetting } from './api-client.js';
 
 const THEME_COLOR_BASE = '#0d1117';
 const THEME_COLOR_IMMERSIVE = '#161b22';
+// Legacy per-browser storage of the app name; kept only so adoptLegacyPwaAppName
+// can move an existing value to the server once. The name itself now lives in
+// app_settings and is served by /manifest.webmanifest.
 const PWA_APP_NAME_STORAGE_KEY = 'copilot_pwa_app_name';
-const PWA_APP_NAME_DEFAULT = 'OAR';
-const PWA_APP_NAME_MAX_LENGTH = 60;
 const INSTALLED_DISPLAY_MODE_QUERIES = ['(display-mode: standalone)', '(display-mode: fullscreen)'];
 
 let deferredInstallPrompt = null;
 let pendingInstalledFullscreenGesture = false;
-let manifestTemplateCache = null;
-let customManifestUrl = null;
+let pwaAppName = '';
+// Monotonic sequence so overlapping loads/saves resolve latest-wins: a stale
+// background GET must never repaint over a just-saved name, and a second edit
+// must never be dropped in favor of an older in-flight save.
+let pwaAppNameRequestSeq = 0;
 
 function matchesDisplayMode(query) {
   try {
@@ -298,152 +303,75 @@ export function initFullscreenButton() {
   updateFullscreenButton();
 }
 
-function normalizePwaAppName(rawValue, { allowEmpty = true } = {}) {
-  const normalized = String(rawValue || '').replace(/\s+/g, ' ').trim();
-  if (!normalized) {
-    return allowEmpty
-      ? { value: '', error: null }
-      : { value: '', error: 'App name cannot be empty.' };
-  }
-  if (normalized.length > PWA_APP_NAME_MAX_LENGTH) {
-    return { value: '', error: `App name must be ${PWA_APP_NAME_MAX_LENGTH} characters or fewer.` };
-  }
-  return { value: normalized, error: null };
-}
-
-function derivePwaShortName(name) {
-  const text = String(name || '').trim();
-  if (!text) return 'Copilot';
-  const firstWord = text.split(/\s+/)[0] || text;
-  if (firstWord.length <= 12) return firstWord;
-  return text.slice(0, 12).trim() || 'Copilot';
-}
-
-function resolveManifestUrlValue(rawValue, baseHref) {
-  const value = String(rawValue || '').trim();
-  if (!value || value.startsWith('data:') || value.startsWith('blob:')) return value;
-  try {
-    return new URL(value, baseHref).href;
-  } catch {
-    return value;
-  }
-}
-
-function normalizeManifestForBlob(manifest, defaultHref) {
-  const baseHref = new URL(String(defaultHref || '').trim(), window.location.href).href;
-  const next = { ...(manifest || {}) };
-  next.id = resolveManifestUrlValue(next.id, baseHref);
-  next.start_url = resolveManifestUrlValue(next.start_url, baseHref);
-  next.scope = resolveManifestUrlValue(next.scope, baseHref);
-  if (Array.isArray(next.icons)) {
-    next.icons = next.icons.map((icon) => {
-      if (!icon || typeof icon !== 'object') return icon;
-      const source = resolveManifestUrlValue(icon.src, baseHref);
-      return { ...icon, src: source };
-    });
-  }
-  return next;
-}
-
-function readStoredPwaAppName() {
-  const { value } = normalizePwaAppName(localStorage.getItem(PWA_APP_NAME_STORAGE_KEY), { allowEmpty: true });
-  return value;
-}
+// The app name is stored on the relay and baked into /manifest.webmanifest by
+// the server, so every manifest fetch — including Android's out-of-page WebAPK
+// update checks — sees the same name. The client only edits the setting.
 
-export function syncPwaAppNameInput() {
+function paintPwaAppNameInput() {
   const input = document.getElementById('pwa-app-name-input');
   if (!input) return;
-  input.value = readStoredPwaAppName();
+  // Don't clobber typing when a background refresh lands mid-edit.
+  if (document.activeElement === input) return;
+  input.value = pwaAppName;
 }
 
-async function loadManifestTemplate(defaultHref) {
-  if (manifestTemplateCache) return { ...manifestTemplateCache };
-  const fallback = {
-    name: PWA_APP_NAME_DEFAULT,
-    short_name: derivePwaShortName(PWA_APP_NAME_DEFAULT),
-    description: 'OAR — Open Agent Relay: drive your local coding agents from any browser.',
-    id: './__copilot_remote_pwa__',
-    start_url: './',
-    scope: './',
-    display_override: ['standalone'],
-    display: 'standalone',
-    background_color: '#161b22',
-    theme_color: '#161b22',
-    icons: [
-      { src: 'app-icon.svg', sizes: 'any', type: 'image/svg+xml', purpose: 'any' },
-      { src: 'app-icon-192.png', sizes: '192x192', type: 'image/png', purpose: 'any' },
-      { src: 'app-icon-512.png', sizes: '512x512', type: 'image/png', purpose: 'any' },
-    ],
-  };
-  try {
-    const response = await fetch(defaultHref, { cache: 'no-store' });
-    const manifest = response.ok ? await response.json() : null;
-    if (manifest && typeof manifest === 'object' && !Array.isArray(manifest)) {
-      manifestTemplateCache = manifest;
-      return { ...manifestTemplateCache };
-    }
-  } catch (error) {
-    console.warn('Failed to load manifest template; using fallback.', error);
-  }
-  manifestTemplateCache = fallback;
-  return { ...manifestTemplateCache };
+export function syncPwaAppNameInput() {
+  paintPwaAppNameInput();
+  const seq = ++pwaAppNameRequestSeq;
+  void loadPwaAppNameSetting().then((result) => {
+    if (seq !== pwaAppNameRequestSeq) return; // superseded by a newer load/save
+    if (!result || typeof result.appName !== 'string') return;
+    pwaAppName = result.appName;
+    paintPwaAppNameInput();
+  });
 }
 
-export async function applyPwaManifestFromSettings() {
-  const manifestLink = document.querySelector('link[rel="manifest"]');
-  if (!manifestLink) return;
-
-  const defaultHref = String(manifestLink.dataset.defaultHref || manifestLink.getAttribute('href') || '').trim();
-  if (!defaultHref) return;
-  if (!manifestLink.dataset.defaultHref) manifestLink.dataset.defaultHref = defaultHref;
-
-  const customName = readStoredPwaAppName();
-  if (!customName) {
-    if (customManifestUrl) {
-      URL.revokeObjectURL(customManifestUrl);
-      customManifestUrl = null;
-    }
-    manifestLink.setAttribute('href', defaultHref);
+export async function updatePwaAppName(rawValue) {
+  const seq = ++pwaAppNameRequestSeq;
+  const result = await updatePwaAppNameSetting(rawValue);
+  if (!result || typeof result.appName !== 'string') {
+    alert('Failed to update the install app name.');
+    if (seq === pwaAppNameRequestSeq) paintPwaAppNameInput();
     return;
   }
-
-  const baseManifest = await loadManifestTemplate(defaultHref);
-  const nextManifest = {
-    ...baseManifest,
-    name: customName,
-    short_name: derivePwaShortName(customName),
-  };
-  const normalizedManifest = normalizeManifestForBlob(nextManifest, defaultHref);
-  const manifestBlob = new Blob([JSON.stringify(normalizedManifest, null, 2)], { type: 'application/manifest+json' });
-  const objectUrl = URL.createObjectURL(manifestBlob);
-  if (customManifestUrl) URL.revokeObjectURL(customManifestUrl);
-  customManifestUrl = objectUrl;
-  manifestLink.setAttribute('href', objectUrl);
+  if (seq !== pwaAppNameRequestSeq) return; // a newer edit owns the UI now
+  pwaAppName = result.appName;
+  showTransientRelayNotice(result.appName
+    ? `Install app name updated to "${result.appName}".`
+    : 'Install app name reset to default.');
+  paintPwaAppNameInput();
 }
 
-export function updatePwaAppName(rawValue) {
-  const normalized = normalizePwaAppName(rawValue, { allowEmpty: true });
-  if (normalized.error) {
-    alert(normalized.error);
-    syncPwaAppNameInput();
+/**
+ * One-time move of a legacy per-browser name into the relay's settings. The
+ * key is removed whether the value is adopted or the server already has a
+ * name — either way it is dead weight; only a network/auth failure keeps it
+ * so the next boot can retry.
+ */
+export async function adoptLegacyPwaAppName() {
+  if (IS_SHARED_VIEW) return;
+  let stored = '';
+  try {
+    stored = String(localStorage.getItem(PWA_APP_NAME_STORAGE_KEY) || '').trim();
+  } catch {
     return;
   }
-  if (normalized.value) {
-    localStorage.setItem(PWA_APP_NAME_STORAGE_KEY, normalized.value);
-  } else {
-    localStorage.removeItem(PWA_APP_NAME_STORAGE_KEY);
+  if (!stored) return;
+  // A legacy over-long value would 400 forever; best-effort truncate instead.
+  if (stored.length > 60) stored = stored.slice(0, 60).trim();
+  const seq = ++pwaAppNameRequestSeq;
+  const current = await loadPwaAppNameSetting();
+  if (!current || typeof current.appName !== 'string') return; // offline/unauthed: retry next boot
+  let adoptedName = current.appName;
+  if (!current.appName) {
+    const adopted = await updatePwaAppNameSetting(stored);
+    if (!adopted || typeof adopted.appName !== 'string') return; // POST failed: keep the key
+    adoptedName = adopted.appName;
   }
-  applyPwaManifestFromSettings()
-    .then(() => {
-      syncPwaAppNameInput();
-      showTransientRelayNotice(normalized.value
-        ? `Install app name updated to "${normalized.value}".`
-        : 'Install app name reset to default.');
-    })
-    .catch((error) => {
-      alert(error?.message || 'Failed to apply install app name');
-      syncPwaAppNameInput();
-    });
+  try { localStorage.removeItem(PWA_APP_NAME_STORAGE_KEY); } catch {}
+  if (seq !== pwaAppNameRequestSeq) return; // the user already edited; their state wins
+  pwaAppName = adoptedName;
+  paintPwaAppNameInput();
 }
 
 export function registerPwaShell() {

package/server/public/app/question-multi-select.mjs

@@ -0,0 +1,52 @@
+// Multi-select question cards: the pure rules the card renderer and its
+// submit path share, kept DOM-free so they are unit-testable.
+//
+// Two card hints ride the question's `context` (kept by the relay's
+// services/relay-question-context.mjs allow-list):
+//  - `multiSelect: true` — several answers are allowed. Claude states this on
+//    every AskUserQuestion question; Copilot models declare it through the
+//    relay's own `ask_user` (`multi_select`), and the worker falls back to the
+//    wording ("select all that apply").
+//  - `allowMultiSelect: true` — the provider cannot always tell (Copilot), so
+//    the card offers a "Select several" switch. Claude cards never carry it:
+//    they follow Claude's flag strictly (maintainer decision, 2026-09-25).
+// A multi-select card offers checkmarks and one "Reply with selection"; the
+// answer is the selected labels joined with ", " — plus whatever the user
+// typed as an extra answer — which is Claude's own multi-select answer format.
+
+function choiceCount(question) {
+  return Array.isArray(question?.choices) ? question.choices.length : 0;
+}
+
+/** Whether the card offers the "Select several" switch. */
+export function offersMultiSelectToggle(question) {
+  if (!question || typeof question !== 'object') return false;
+  return choiceCount(question) >= 2 && question?.context?.allowMultiSelect === true;
+}
+
+/**
+ * Whether the card renders checkmarks. `override` is the user's switch
+ * position for this card (true/false), or undefined while untouched — then the
+ * provider's flag decides. The switch only counts on cards that offer it.
+ */
+export function isMultiSelectQuestion(question, override = undefined) {
+  if (!question || typeof question !== 'object') return false;
+  if (choiceCount(question) < 2) return false;
+  if (typeof override === 'boolean' && offersMultiSelectToggle(question)) return override;
+  return question?.context?.multiSelect === true;
+}
+
+/**
+ * The answer string for a multi-select card: the selected labels in offer
+ * order, then the free-text answer (if any) as one more item. Empty when
+ * nothing was selected or typed.
+ */
+export function composeMultiSelectAnswer(selectedLabels, freeText = '') {
+  const labels = (Array.isArray(selectedLabels) ? selectedLabels : [])
+    .map((label) => String(label ?? '').trim())
+    .filter(Boolean)
+    .filter((label, index, all) => all.indexOf(label) === index);
+  const extra = String(freeText ?? '').trim();
+  if (extra && !labels.includes(extra)) labels.push(extra);
+  return labels.join(', ');
+}

package/server/public/app/reasoning-effort-labels.mjs

@@ -27,16 +27,26 @@ export const ULTRACODE_EFFORT_LABEL = 'Ultracode';
 export const ULTRACODE_EFFORT_OPTION_TITLE =
   'xhigh effort plus multi-agent workflow orchestration — expect much higher token use';
 
+// Gemini and some OpenAI models offer a rung under "low". It reads like the
+// other plain tiers (lowercase, no rename): an "Off"-style label would promise
+// a switch the runtime does not have, and Title Case would single it out from
+// its neighbours. The tooltip explains the rung instead.
+export const MINIMAL_EFFORT = 'minimal';
+export const MINIMAL_EFFORT_LABEL = 'minimal';
+export const MINIMAL_EFFORT_OPTION_TITLE = 'Lowest reasoning tier this model offers — faster and cheaper than low';
+
 export function reasoningEffortOptionLabel(effort, { reasoningOffUnsupported = false } = {}) {
   const value = String(effort || '').trim().toLowerCase();
   if (!value) return '';
   if (value === 'none' && reasoningOffUnsupported) return PROVIDER_DEFAULT_EFFORT_LABEL;
   if (value === CLAUDE_ULTRACODE_EFFORT) return ULTRACODE_EFFORT_LABEL;
+  if (value === MINIMAL_EFFORT) return MINIMAL_EFFORT_LABEL;
   return value;
 }
 
 export function reasoningEffortOptionTitle(effort) {
-  return String(effort || '').trim().toLowerCase() === CLAUDE_ULTRACODE_EFFORT
-    ? ULTRACODE_EFFORT_OPTION_TITLE
-    : '';
+  const value = String(effort || '').trim().toLowerCase();
+  if (value === CLAUDE_ULTRACODE_EFFORT) return ULTRACODE_EFFORT_OPTION_TITLE;
+  if (value === MINIMAL_EFFORT) return MINIMAL_EFFORT_OPTION_TITLE;
+  return '';
 }

package/server/public/app/relay-prompt-sanitizer.mjs

@@ -102,13 +102,36 @@ function stripAttachmentPromptArtifacts(text) {
     .trim();
 }
 
+// The once-per-worker media-embed guidance (shared/media-embed-instructions.mjs)
+// can precede the mode marker on the Cursor/Grok prompt paths. This module is
+// served to the browser and cannot import shared/, so the block is matched
+// structurally — the heading plus its single paragraph — rather than verbatim.
+const MEDIA_EMBED_BLOCK_PATTERN = /##\s*Embedding media in replies\s+[\s\S]*?(?=\n\s*\n|$)/gi;
+
+// A steered message's hidden note (shared/steer-note.mjs) leads the prompt the
+// runtime stored, right after any mode marker. Matched by its stable opening
+// words, because the browser copy of this module cannot import shared/.
+const STEER_NOTE_PATTERN = /^\s*\[Sent while you were still working on my previous message\.[^\]\n]*\]\s*/;
+
+// The Claude worker's slash-command guard (shared/slash-command-guard.mjs): a
+// zero-width space in front of a "/x" it delivers as text. trim() keeps it, so
+// it is matched on its own, and only where it guards a "/".
+const SLASH_COMMAND_GUARD_PATTERN = /^\u200B(?=\s*\/)/;
+
+function stripLeadingRelayNotes(text) {
+  const stripped = String(text || '').replace(STEER_NOTE_PATTERN, '').replace(SLASH_COMMAND_GUARD_PATTERN, '');
+  return stripped.trim() ? stripped.trim() : String(text || '').trim();
+}
+
 export function stripRelayPromptContext(text, relayMode = '') {
-  const value = stripAttachmentPromptArtifacts(text);
+  const value = stripAttachmentPromptArtifacts(text)
+    .replace(MEDIA_EMBED_BLOCK_PATTERN, '')
+    .trim();
   if (!value) return '';
   const patterns = buildPromptPrefixPatterns(relayMode);
   for (const pattern of patterns) {
     const stripped = value.replace(pattern, '').trim();
-    if (stripped && stripped !== value) return stripped;
+    if (stripped && stripped !== value) return stripLeadingRelayNotes(stripped);
   }
-  return value;
+  return stripLeadingRelayNotes(value);
 }

package/server/public/app/router.js

@@ -121,6 +121,45 @@ export function driveFileHrefFromPath(rawPath) {
   return `${BASE}/api/drives/file?path=${encodeURIComponent(normalized)}`;
 }
 
+/**
+ * Recognize this app's own file-serving hrefs (the shapes
+ * driveFileHrefFromPath / workspaceFileHrefFromPath emit, which embedded
+ * message media points at after rewriting) and give back the original file
+ * path, so a click on an inline image can reopen it in the file viewer.
+ */
+export function parseAppFileHref(rawSrc) {
+  const value = String(rawSrc || '').trim();
+  if (!value) return null;
+  let parsed = null;
+  try {
+    parsed = new URL(value, window.location.origin);
+  } catch {
+    return null;
+  }
+  if (parsed.origin !== window.location.origin) return null;
+  const base = String(BASE || '');
+  const pathname = parsed.pathname || '';
+  const appPath = base && pathname.startsWith(base) ? pathname.slice(base.length) : pathname;
+  if (appPath === '/api/drives/file') {
+    const path = String(parsed.searchParams.get('path') || '').trim();
+    return path ? { kind: 'drive', path } : null;
+  }
+  if (appPath.startsWith('/api/files/')) {
+    const path = appPath.slice('/api/files/'.length)
+      .split('/')
+      .map((segment) => {
+        try {
+          return decodeURIComponent(segment);
+        } catch {
+          return segment;
+        }
+      })
+      .join('/');
+    return path ? { kind: 'workspace', path } : null;
+  }
+  return null;
+}
+
 export function drivePreviewApiPath(rawPath) {
   const normalized = normalizeDriveBrowserPath(rawPath);
   if (!normalized) return '';
@@ -196,10 +235,10 @@ export function isSafePreviewUrl(url, allowDataImage = false) {
 }
 
 const PREVIEW_ALLOWED_TAGS = new Set([
-  'a', 'article', 'b', 'blockquote', 'br', 'code', 'del', 'details', 'div', 'em',
+  'a', 'article', 'audio', 'b', 'blockquote', 'br', 'code', 'del', 'details', 'div', 'em',
   'figcaption', 'figure', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'hr', 'i', 'img',
   'kbd', 'li', 'mark', 'ol', 'p', 'pre', 's', 'small', 'span', 'strong', 'sub',
-  'summary', 'sup', 'table', 'tbody', 'td', 'tfoot', 'th', 'thead', 'tr', 'u', 'ul',
+  'summary', 'sup', 'table', 'tbody', 'td', 'tfoot', 'th', 'thead', 'tr', 'u', 'ul', 'video',
 ]);
 const PREVIEW_GLOBAL_ATTRIBUTES = new Set(['dir', 'lang', 'title']);
 const PREVIEW_ALIGNMENT_VALUES = new Set(['left', 'center', 'right', 'justify']);
@@ -210,15 +249,24 @@ const PREVIEW_SPAN_VALUE = /^[1-9]\d{0,2}$/;
 function isAllowedPreviewAttribute(tagName, name, value) {
   if (PREVIEW_GLOBAL_ATTRIBUTES.has(name)) return true;
   if (name === 'href') return tagName === 'a' && isSafePreviewUrl(value, false);
-  if (name === 'src') return tagName === 'img' && isSafePreviewUrl(value, true);
+  if (name === 'src') {
+    if (tagName === 'img') return isSafePreviewUrl(value, true);
+    return (tagName === 'video' || tagName === 'audio') && isSafePreviewUrl(value, false);
+  }
   if (name === 'alt') return tagName === 'img';
+  if (name === 'controls' || name === 'muted' || name === 'loop') {
+    return (tagName === 'video' || tagName === 'audio') && value === '';
+  }
+  if (name === 'playsinline') return tagName === 'video' && value === '';
+  if (name === 'preload') return (tagName === 'video' || tagName === 'audio')
+    && ['none', 'metadata', 'auto'].includes(value.toLowerCase());
   if (name === 'target') return tagName === 'a' && value === '_blank';
   if (name === 'rel') return tagName === 'a';
   if (name === 'align') return ['div', 'p', 'table', 'td', 'th', 'tr'].includes(tagName)
     && PREVIEW_ALIGNMENT_VALUES.has(value.toLowerCase());
   if (name === 'valign') return ['td', 'th', 'tr'].includes(tagName)
     && PREVIEW_VERTICAL_ALIGNMENT_VALUES.has(value.toLowerCase());
-  if (name === 'width' || name === 'height') return ['img', 'table', 'td', 'th'].includes(tagName)
+  if (name === 'width' || name === 'height') return ['img', 'table', 'td', 'th', 'video'].includes(tagName)
     && PREVIEW_DIMENSION_VALUE.test(value);
   if (name === 'rowspan' || name === 'colspan') return ['td', 'th'].includes(tagName)
     && PREVIEW_SPAN_VALUE.test(value);
@@ -230,27 +278,88 @@ function isAllowedPreviewAttribute(tagName, name, value) {
   return false;
 }
 
+const EMBED_VIDEO_EXTENSIONS = new Set(['mp4', 'webm', 'm4v', 'mov']);
+const EMBED_AUDIO_EXTENSIONS = new Set(['mp3', 'm4a', 'ogg', 'opus', 'wav', 'flac']);
+
+// 'video' | 'audio' | '' for an already-safe embed src; drive/workspace hrefs
+// carry the real file path in their `path` query parameter.
+function mediaKindForEmbedSource(src) {
+  const value = String(src || '').trim();
+  if (!value || value.toLowerCase().startsWith('data:')) return '';
+  let candidate = value;
+  try {
+    const parsed = new URL(value, window.location.origin);
+    candidate = parsed.searchParams.get('path') || parsed.pathname;
+  } catch {}
+  const match = /\.([A-Za-z0-9]{1,5})$/.exec(String(candidate || '').trim());
+  const extension = match ? match[1].toLowerCase() : '';
+  if (EMBED_VIDEO_EXTENSIONS.has(extension)) return 'video';
+  if (EMBED_AUDIO_EXTENSIONS.has(extension)) return 'audio';
+  return '';
+}
+
+function convertImageToMediaElement(img, mediaTag, src) {
+  const media = document.createElement(mediaTag);
+  media.setAttribute('src', src);
+  media.setAttribute('controls', '');
+  media.setAttribute('preload', 'metadata');
+  const alt = String(img.getAttribute('alt') || '').trim();
+  if (alt) media.setAttribute('title', alt);
+  if (mediaTag === 'video') {
+    for (const dimension of ['width', 'height']) {
+      const value = String(img.getAttribute(dimension) || '').trim();
+      if (value) media.setAttribute(dimension, value);
+    }
+  }
+  img.replaceWith(media);
+  return media;
+}
+
 export function sanitizePreviewHtml(html) {
   const template = document.createElement('template');
   template.innerHTML = String(html || '');
   const nodes = Array.from(template.content.querySelectorAll('*'));
   for (const el of nodes) {
-    const tagName = String(el.tagName || '').toLowerCase();
+    let element = el;
+    let tagName = String(element.tagName || '').toLowerCase();
+    if (tagName === 'img' || tagName === 'video' || tagName === 'audio') {
+      // Bare local absolute paths (C:\...\shot.png, /home/user/shot.png) are
+      // resolved to the drive/workspace file route HERE, before the generic
+      // attribute filter would strip them — this is what lets agents embed
+      // media by plain path instead of a hand-encoded /api/drives/file URL.
+      const rawSrc = String(element.getAttribute('src') || '').trim();
+      // Only genuine local-path shapes may be resolved; anything else that
+      // fails the safe-URL check (javascript:, vbscript:, …) must simply die,
+      // not be laundered into a workspace href by the resolver.
+      const looksLocalAbsolute = /^[A-Za-z]:[\\/]/.test(rawSrc) || rawSrc.startsWith('\\');
+      const safeSrc = rawSrc && isSafePreviewUrl(rawSrc, tagName === 'img')
+        ? rawSrc
+        : (looksLocalAbsolute ? resolveLocalAssetUrl(rawSrc) : '');
+      if (safeSrc && safeSrc !== rawSrc) element.setAttribute('src', safeSrc);
+      else if (!safeSrc && rawSrc) element.removeAttribute('src');
+      if (tagName === 'img') {
+        const mediaTag = mediaKindForEmbedSource(safeSrc);
+        if (mediaTag) {
+          element = convertImageToMediaElement(element, mediaTag, safeSrc);
+          tagName = mediaTag;
+        }
+      }
+    }
     if (!PREVIEW_ALLOWED_TAGS.has(tagName)) {
-      el.replaceWith(document.createTextNode(el.textContent || ''));
+      element.replaceWith(document.createTextNode(element.textContent || ''));
       continue;
     }
-    const attrs = Array.from(el.attributes || []);
+    const attrs = Array.from(element.attributes || []);
     for (const attr of attrs) {
       const name = String(attr.name || '').toLowerCase();
       const value = String(attr.value || '').trim();
       if (!isAllowedPreviewAttribute(tagName, name, value)) {
-        el.removeAttribute(attr.name);
+        element.removeAttribute(attr.name);
       }
     }
     if (tagName === 'a') {
-      el.setAttribute('target', '_blank');
-      el.setAttribute('rel', 'noopener noreferrer');
+      element.setAttribute('target', '_blank');
+      element.setAttribute('rel', 'noopener noreferrer');
     }
   }
   return template.innerHTML;
@@ -616,7 +725,7 @@ export function rewriteLocalAssetUrlsInNode(root, options = {}) {
   if (!(root instanceof Element)) return;
   const preferDrive = options?.preferDrive === true;
   const rewriteAnchors = options?.rewriteAnchors !== false;
-  const images = Array.from(root.querySelectorAll('img[src]'));
+  const images = Array.from(root.querySelectorAll('img[src], video[src], audio[src]'));
   for (const img of images) {
     const rawSrc = img.getAttribute('src') || '';
     const nextSrc = resolveLocalAssetUrl(rawSrc, { preferDrive });