(
container: HTMLDivElement,
current: Element | undefined,
block: Extract<RenderedBlock, { mode: "code" }>,
labels: CopyLabels,
)
| 594 | } |
| 595 | |
| 596 | function updateCodeBlock( |
| 597 | container: HTMLDivElement, |
| 598 | current: Element | undefined, |
| 599 | block: Extract<RenderedBlock, { mode: "code" }>, |
| 600 | labels: CopyLabels, |
| 601 | ) { |
| 602 | const existing = current instanceof HTMLDivElement && current.dataset.markdownKey === block.key ? current : undefined |
| 603 | const next = existing ?? document.createElement("div") |
| 604 | next.dataset.markdownBlock = "" |
| 605 | next.dataset.markdownKey = block.key |
| 606 | next.dataset.markdownHash = block.hash |
| 607 | next.dataset.markdownComplete = block.complete ? "true" : "false" |
| 608 | next.style.display = "contents" |
| 609 | |
| 610 | const code = existing?.querySelector("code") |
| 611 | if (code instanceof HTMLElement) { |
| 612 | const wrapper = code.closest('[data-component="markdown-code"]') |
| 613 | if (wrapper instanceof HTMLElement) applyCodeMetadata(wrapper, block.language) |
| 614 | code.className = `language-${block.language}` |
| 615 | const previous = renderedCodeTokens.get(next) |
| 616 | const reset = shouldResetCodeTokens(previous, { |
| 617 | language: block.language, |
| 618 | generation: block.generation, |
| 619 | stableCount: block.stable.length, |
| 620 | raw: block.raw, |
| 621 | }) |
| 622 | const stableCount = reset ? 0 : previous!.stableCount |
| 623 | const tail = [...block.stable.slice(stableCount), ...block.unstable] |
| 624 | const prior = reset ? [] : previous!.unstable |
| 625 | const prefix = prior.findIndex((token, index) => !sameToken(token, tail[index])) |
| 626 | const keep = stableCount + (prefix < 0 ? Math.min(prior.length, tail.length) : prefix) |
| 627 | while (code.children.length > keep) code.lastElementChild?.remove() |
| 628 | tail |
| 629 | .slice(keep - stableCount) |
| 630 | .map(createTokenSpan) |
| 631 | .forEach((span) => code.appendChild(span)) |
| 632 | renderedCodeTokens.set(next, { |
| 633 | language: block.language, |
| 634 | generation: block.generation, |
| 635 | stableCount: block.stable.length, |
| 636 | unstable: block.unstable, |
| 637 | raw: block.raw, |
| 638 | }) |
| 639 | return |
| 640 | } |
| 641 | |
| 642 | const wrapper = document.createElement("div") |
| 643 | wrapper.setAttribute("data-component", "markdown-code") |
| 644 | applyCodeMetadata(wrapper, block.language) |
| 645 | const pre = document.createElement("pre") |
| 646 | pre.className = "shiki OpenCode" |
| 647 | const codeElement = document.createElement("code") |
| 648 | codeElement.className = `language-${block.language}` |
| 649 | ;[...block.stable, ...block.unstable].map(createTokenSpan).forEach((span) => codeElement.appendChild(span)) |
| 650 | pre.appendChild(codeElement) |
| 651 | wrapper.appendChild(pre) |
| 652 | wrapper.appendChild(createCopyButton(labels)) |
| 653 | next.appendChild(wrapper) |
no test coverage detected