Claude Artifacts UI: Audio, Media & Artifact Interaction

// audioSinkWorklet.js: Atomics 驱动的环形无锁缓冲区
var RD = 0;
var WR = 1;
var UNDERRUNS = 2;
var PLAYED = 3;
var HEADER_SLOTS = 4;
var HEADER_BYTES = HEADER_SLOTS * Uint32Array.BYTES_PER_ELEMENT;

var RingBuffer = class {
  constructor(sab) {
    this.indices = new Uint32Array(sab, 0, HEADER_SLOTS);
    this.storage = new Float32Array(sab, HEADER_BYTES);
    this.capacity = this.storage.length;
  }

  static allocate(capacity) {
    const bytes = HEADER_BYTES + capacity * Float32Array.BYTES_PER_ELEMENT;
    const Ctor = typeof SharedArrayBuffer !== "undefined" ? SharedArrayBuffer : ArrayBuffer;
    return new Ctor(bytes);
  }

  // 生产者（主线程 / Opus 解码器写入 PCM 样本）
  push(input) {
    const wr = Atomics.load(this.indices, WR);
    const rd = Atomics.load(this.indices, RD);
    const n = Math.min(input.length, this._availableWrite(rd, wr));
    if (n === 0) return 0;

    const tail = this.capacity - wr;
    if (n <= tail) {
      this.storage.set(input.subarray(0, n), wr);
    } else {
      this.storage.set(input.subarray(0, tail), wr);
      this.storage.set(input.subarray(tail, n), 0);
    }
    Atomics.store(this.indices, WR, (wr + n) % this.capacity);
    return n;
  }

  // 消费者（AudioWorklet 高优先级线程以约 375Hz 频率读取，每帧 128 样本）
  pop(output) {
    const rd = Atomics.load(this.indices, RD);
    const wr = Atomics.load(this.indices, WR);
    const n = Math.min(output.length, this._availableRead(rd, wr));
    if (n === 0) return 0;

    const tail = this.capacity - rd;
    if (n <= tail) {
      output.set(this.storage.subarray(rd, rd + n));
    } else {
      output.set(this.storage.subarray(rd, this.capacity));
      output.set(this.storage.subarray(0, n - tail), tail);
    }
    Atomics.store(this.indices, RD, (rd + n) % this.capacity);
    return n;
  }

  _availableRead(rd, wr) {
    return (wr - rd + this.capacity) % this.capacity;
  }
  _availableWrite(rd, wr) {
    return this.capacity - 1 - this._availableRead(rd, wr);
  }
};

// 音频帧处理器 (以 128 样本为一量度，48kHz 下每秒执行 375 次)
var AUDIO_SINK_PROCESSOR_NAME = "audio-sink-processor";
class AudioSinkProcessor extends AudioWorkletProcessor {
  process(_inputs, outputs) {
    const channel = outputs[0]?.[0];
    if (!channel) return true;

    const read = this.ring.pop(channel);
    if (read < channel.length) {
      // 欠载保护：不足部分用 0 填充静音，并触发欠载检测，绝不输出爆音
      channel.fill(0, read);
      if (this.hasStarted && this.gapReady) {
        this.dryGapPending = true;
        if (read === 0 && !this.drainPosted) {
          this.notifyDrained();
        }
      }
    }
    return true;
  }
}
registerProcessor(AUDIO_SINK_PROCESSOR_NAME, AudioSinkProcessor);

// shared-8-4Jj8qhmU.js: 官方音效调度器
function createSoundElement(url, volume = 0.3) {
  if (typeof window === "undefined") return null;
  let audio = new Audio(url);
  // 核心声学标准：全局固定 30% 音量，温和舒适，绝不产生惊吓感
  audio.volume = volume;
  return audio;
}

async function initClaudeSoundPipeline() {
  let AudioContextClass = window.AudioContext || window.webkitAudioContext;
  let ctx = new AudioContextClass();
  
  // 四大官方交互音效矩阵（实际存储于 /audio/voice/sfx/）
  let sfxMap = {
    "enter_voice_mode":     createSoundElement("/audio/voice/sfx/enter_voice_mode.mp3", 0.3),
    "exit_voice_mode":      createSoundElement("/audio/voice/sfx/exit_voice_mode.mp3", 0.3),
    "disconnected":         createSoundElement("/audio/voice/sfx/disconnected.mp3", 0.3),
    "tool_approval_needed": createSoundElement("/audio/voice/sfx/tool_approval_needed.mp3", 0.3)
  };

  // 通过 AudioContext 目的节点进行直通低延迟连接
  Object.values(sfxMap).forEach(audio => {
    if (audio && ctx) {
      ctx.createMediaElementSource(audio).connect(ctx.destination);
      audio.load();
    }
  });

  // 支持 setSinkId 独立选择外接会议扬声器或耳机
  let selectedSpeakerId = getSelectedSpeakerDevice();
  if (selectedSpeakerId && typeof ctx.setSinkId === "function") {
    await ctx.setSinkId(selectedSpeakerId);
  }
}

flowchart LR
    Mic["麦克风音频流"] --> FFT["512 点 FFT 频域分析 (smoothing=0.5)"]
    FFT --> DecibelClamp["动态分贝截断 (-70dB 至 -10dB)"]
    NoiseGate["8% 噪声门限过滤 (Math.max(0, u - 0.08) / 0.92)"]
    DecibelClamp --> NoiseGate
    NoiseGate --> GammaComp["0.7 次幂非线性 Gamma 压缩 (f^0.7 * 1.5 * weight)"]
    GammaComp --> MotionInterpolate["Framer Motion 弹性高度映射 (4px - 24px)"]

// c4a1e6da6-B9dxf4-D.js
// 1. Web Audio AnalyserNode 配置
analyser.fftSize = 512;
analyser.smoothingTimeConstant = 0.5; // 消除帧间视觉毛刺
analyser.minDecibels = -70;          // 静音底噪基准线
analyser.maxDecibels = -10;          // 正常说话饱和上限

// 2. 核心 6 频段能量提取与 Gamma 幂律映射公式
for (let b = 0; b < 6; b++) {
  let rawEnergy = computeAverageBinEnergy(dataArray, b); // [0.0, 1.0]
  let noiseFloor = 0.08; // 8% 噪声门限：彻底消除空调背景杂音引发的虚假微动
  let gated = Math.max(0, rawEnergy - noiseFloor) / (1 - noiseFloor);
  
  // 核心视觉物理学：0.7 次幂非线性 Gamma 压缩
  // 放大微弱的人声细语，同时压制高分贝爆音，使波形动态范围分布极度均匀
  let compressed = Math.min(1, Math.pow(gated, 0.7) * 1.5 * bandWeights[b]);
  
  // 映射至 4px - 24px 物理高度
  let targetHeight = 4 + (24 - 4) * compressed;
  motionValues[b].set(targetHeight);
}

voice-personas/
├── airy                     # 空灵柔和 (Airy): 呼吸感强、语速适中，适合深度思考与陪伴
├── buttery                  # 醇厚顺滑 (Buttery): 磁性饱满、亲和力强，默认主推人格
├── glassy                   # 清澈明朗 (Glassy): 咬字清晰、高频透亮，适合代码讲解与教学
├── mellow                   # 沉稳温润 (Mellow): 语调舒缓、低频共鸣，适合夜间阅读与长文本
└── rounded                  # 饱满圆润 (Rounded): 节奏轻快、干脆利落，适合效率型问答

// frame-shell-dictate-C9D4b04p.js
var WORKLET_URL = "/assets/v1/cb2b919a8-BamlKQVF.js";
var MAX_DICTATION_DURATION = 36e5; // 3,600,000ms = 严格 1 小时持续听写上限

// 核心前缀差分增量结算算法：仅向输入框发射新增 Delta，消除光标闪烁
function computeDictationDelta(lastSettled, currentText) {
  if (!currentText.startsWith(lastSettled)) {
    return { add: "", settled: currentText };
  }
  let delta = currentText.slice(lastSettled.length);
  return delta.trim() === ""
    ? { add: "", settled: lastSettled }
    : { add: delta, settled: currentText };
}

async function openDictation(options) {
  let session = audioPipeline.dictation({
    language: options.language,
    maxDuration: MAX_DICTATION_DURATION,
    settleAtPauses: true, // 核心声学断句：说话停顿时自动触发物理沉降
  });

  let settledText = "";

  session.on("result", (event) => {
    // 分离暂态推测文本 (interim) 与已定稿文本 (settled)
    let { add, settled } = computeDictationDelta(settledText, event.settled);
    settledText = settled;
    if (add !== "") options.onFinal(add);
    options.onPartial(event.interim);
  });

  session.on("state", (state) => {
    if (state === "idle") {
      options.onEnded("completed");
    }
  });

  await session.start();
  return {
    stop: async () => session.stop(),
    cancel: () => session.cancel(),
  };
}

// frame-shell-speak-CBGDxR0k.js
var TTS_WIDEBAND_SAMPLE_RATE = 24000; // 24kHz 超高采样率，达到广播级人声解析度

function openReading(options) {
  let reader = getVoiceSession(options.organizationId).readAloud({
    voice: options.voice,
    sampleRate: TTS_WIDEBAND_SAMPLE_RATE,
  });

  // 核心视觉与声学联动：实时高频捕获朗读光标位置 (Karaoke 字词高亮)
  reader.on("position", (pos) => {
    options.onPosition({
      charIndex: pos.charIndex,
      wordLength: pos.wordLength,
    });
  });

  reader.on("state", (state) => {
    if (state.name === "speaking") {
      options.onSpeaking();
    }
  });

  return {
    ended: reader.speak(options.text),
    stop: () => reader.stop(),
  };
}

// c4b054ed5-BGjH-Uu6.js: 核心物理学与阻尼常数
var ae = 2;        // 最小最大缩放倍数 (Math.max(naturalWidth / fitWidth, 2))
var oe = 4;        // 手势死区过滤阈值 (Math.hypot(dx, dy) < 4px 判定为手部微抖，不触发拖拽)
var se = 0.01;     // 滚轮缩放指数因子 (Math.exp(-deltaY * 0.01))
var v = 1.05;      // 缩放吸附下限 (当 scale <= 1.05 时自动顺滑吸附回 1.0)
var ce = 1.25;     // 单次触击/跳变放大默认比例
var y = 0.7;       // 视口阻尼溢出系数
var le = 2;        // 虚拟画廊跑道预加载跨度 (Math.abs(t - O) <= 2，前后仅预载 2 帧)

.animate-lightbox-backdrop-in { animation: .2s ease-out fade-in; }
.animate-lightbox-content-in  { animation: .25s ease-out scale-in; }

// 1. 动态提取生效圆角 (向上穿透 5 层 DOM 捕获真实裁剪半边距)
function S(element, fallbackRadius) {
  let curr = element;
  for (let i = 0; curr && i < 5; i++) {
    let style = getComputedStyle(curr);
    if ((curr.tagName === "IMG" || style.overflow === "hidden" || style.overflow === "clip") 
        && style.borderRadius !== "0px" && style.borderRadius !== "") {
      return style.borderRadius;
    }
    curr = curr.parentElement;
  }
  return fallbackRadius;
}

// 2. 针对 object-fit: contain 图像的精确内切剪裁百分比算法
function T(img) {
  if (img.tagName !== "IMG") return null;
  let { naturalWidth: nw, naturalHeight: nh } = img;
  if (!(nw > 0 && nh > 0)) return null;
  let style = getComputedStyle(img);
  if (style.objectFit !== "contain" && style.objectFit !== "scale-down") return null;

  let rect = img.getBoundingClientRect();
  let padL = parseFloat(style.paddingLeft) || 0, padT = parseFloat(style.paddingTop) || 0;
  let padR = parseFloat(style.paddingRight) || 0, padB = parseFloat(style.paddingBottom) || 0;
  let availW = rect.width - padL - padR, availH = rect.height - padT - padB;
  if (!(availW > 0 && availH > 0)) return null;

  let scale = Math.min(availW / nw, availH / nh);
  if (style.objectFit === "scale-down") scale = Math.min(scale, 1);

  let renderW = nw * scale, renderH = nh * scale;
  let insetTop = (availH - renderH) / 2 + padT;
  let insetRight = (availW - renderW) / 2 + padR;
  let insetBottom = (availH - renderH) / 2 + padB;
  let insetLeft = (availW - renderW) / 2 + padL;

  let toPercent = (val, total) => `${Number((100 * val / total).toFixed(3))}%`;
  return {
    inset: `${toPercent(insetTop, rect.height)} ${toPercent(insetRight, rect.width)} ${toPercent(insetBottom, rect.height)} ${toPercent(insetLeft, rect.width)}`
  };
}

// 核心锚点平移缩放方程
function pe(fitInfo, currentPos, targetScale, pointerPos) {
  let maxTx = calcMaxTranslate(fitInfo.fitWidth, fitInfo.viewportWidth, targetScale);
  let maxTy = calcMaxTranslate(fitInfo.fitHeight, fitInfo.viewportHeight, targetScale);
  let offsetX = pointerPos ? pointerPos.clientX - fitInfo.fitCenterX : 0;
  let offsetY = pointerPos ? pointerPos.clientY - fitInfo.fitCenterY : 0;

  let c = targetScale / currentPos.scale;
  let idealTx = offsetX - (offsetX - currentPos.idealTx) * c;
  let idealTy = offsetY - (offsetY - currentPos.idealTy) * c;

  let tx = clamp(idealTx, maxTx);
  let ty = clamp(idealTy, maxTy);
  return { ...fitInfo, scale: targetScale, idealTx, idealTy, tx, ty, maxTx, maxTy };
}

// 滚轮指数缩放监听与 4px 拖拽死区捕获
function handleWheel(e) {
  if (e.ctrlKey) {
    e.preventDefault();
    let zoomRatio = Math.exp(-e.deltaY * 0.01);
    let newScale = Math.min(Math.max(currentScale * zoomRatio, 1), maxScale);
    if (newScale <= 1.05) {
      resetZoom(); // 自动吸附回归 1.0
    } else {
      applyAnchorZoom(newScale, e.clientX, e.clientY);
    }
  }
}

/* 跑道滑动位移方程 */
.gallery-runway {
  gap: 32px;
  transform: translateX(calc(12.5vw - var(--active-index) * 75vw - var(--active-index) * 32px));
  transition: transform 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.gallery-slide {
  width: 75vw;
}
.gallery-slide[data-active="true"] {
  opacity: 1;
}
.gallery-slide[data-active="false"] {
  opacity: 0.4;
  cursor: pointer;
}
.gallery-slide[data-active="false"]:hover {
  opacity: 0.75;
}

// 拖拽激活与光标指针跟随
w = e => {
  if (e.pointerId !== u) return;
  if (!p.current) {
    if (Math.abs(t) < qM && Math.abs(r) < qM) return; // qM 为 4px 移动死区
    p.current = !0;
    d(!0);
    l.setAttribute("data-pane-dragging", String(c.current));
    y.showCursor("move");
  }
  // 计算基于容器宽度的浮点比例，默认锚定 0.5 (50%)
  let i = oN(n, c.current, BM(XM(l), parseFloat(getComputedStyle(l).getPropertyValue("--df-pane-row")) || .5, e.clientX, e.clientY));
  m.current = i;
  iN(i);
};

// Escape 键拦截与快速回滚
C = e => {
  if (e.key === "Escape" && p.current) {
    e.preventDefault();
    e.stopImmediatePropagation();
    // 立即终止拖拽并恢复原分割比例
    _.abort();
    x("cancelled");
  }
};

// c58115fda-BKnbLmi3.js: Epitaxy 权限隔离与通信门禁
// 生产环境严格排除 allow-same-origin，切断同源父 DOM 穿透逃逸路径
var EPITAXY_IFRAME_SANDBOX = [
  "allow-scripts",
  "allow-forms",
  "allow-popups",
  "allow-modals"
].join(" ");

// 7 种专有 MIME 协议分发器
var EPITAXY_MIME_REGISTRY = {
  "application/vnd.ant.react":    "renderReactComponent",
  "application/vnd.ant.code":     "renderCodeHighlighter",
  "application/vnd.ant.markdown": "renderMarkdownDoc",
  "application/vnd.ant.mermaid":  "renderMermaidChart",
  "application/vnd.ant.svg":      "renderRawSvg",
  "application/vnd.ant.html":     "renderSandboxedHtml",
  "application/vnd.ant.latex":    "renderKatexMath"
};

// 用户手势激活门禁安全过滤器
window.addEventListener("message", function(event) {
  var data = event.data;
  if (!data || typeof data !== "object") return;

  // 严格校验消息来源源域与结构签名
  if (data.channel === "epitaxy_mcp_app") {
    // 核心安全防御：基于浏览器原生 userActivation 拦截未经真实用户手势激发的合成事件
    var hasActivation = (event.userActivation && event.userActivation.hasBeenActive) || false;
    if (!event.isTrusted || !hasActivation) {
      console.warn("[Epitaxy MCP App] ui/message without iframe-originated user activation blocked");
      return;
    }
    dispatchAppMessage(data.payload);
  }
});

.epitaxy-root .epitaxy-diff {
  --diffs-font-size: var(--cds-font-size-code);
  --diffs-line-height: var(--cds-leading-code);
  --diffs-font-family: var(--cds-font-mono);
  --diffs-header-font-family: var(--cds-font-sans);
  --diffs-addition-color-override: var(--cds-text-git-added);
  --diffs-deletion-color-override: var(--cds-text-git-removed);
  --diffs-modified-color-override: var(--cds-text-accent);
  --diffs-gap-inline: var(--cds-pad-md);
  --diffs-gap-block: var(--cds-pad-xs);
}

// Shadow DOM 隔离与双栏 Grid 锁定挂载
function Xh(e, t, n, r, i) {
  let a = e.ownerDocument,
      o = a.createElement("div"),
      s = o.shadowRoot ?? o.attachShadow({ mode: "open" });
  
  let c = a.createElement("style");
  let l = a.createElement("style");
  
  // 建立双栏网格 (gutter 行号栏与 content 代码内容栏)
  let f = a.createElement("div"); f.dataset.gutter = "";
  let p = a.createElement("div"); p.dataset.content = "";
  
  let v = 0;
  let b = () => {
    v += 1;
    // 左右两栏强制锁定相同网格跨度
    f.style.gridRow = p.style.gridRow = `span ${v}`;
  };

  // 增量消费 Worker 传递的 Tokens
  let x = Kh({
    lang: t,
    themes: n,
    onTokens: ({ recall: t, tokens: n, caughtUp: r, plain: a }) => {
      // 增量追加 span 节点，不重绘旧行
    }
  });

  return {
    accepts(e, r, i) {
      return r === t && e.startsWith(m); // 判定前缀是否承接，承接则增量追加
    },
    feed(e) {
      let t = e.slice(m.length);
      m = e;
      t && x.push(t); // 仅向 Worker 传递新增 Delta
    },
    settle() {
      x.closeWhenIdle();
    }
  };
}