mirror of
https://github.com/getcompanion-ai/co-mono.git
synced 2026-04-16 13:04:08 +00:00
Add reload button to HTML artifact header
Adds a reload button with RefreshCw icon to HTML artifact header buttons. Clicking the button clears logs and re-executes the HTML content, useful for manually refreshing when developing HTML artifacts or testing changes. Changes: - Import Button, icon from mini-lit and RefreshCw from lucide - Add reload button to getHeaderButtons() that clears logs and calls executeContent() - Add "Reload HTML" i18n key in English and German translations
This commit is contained in:
parent
92ce5a342f
commit
2d5054e6c0
2 changed files with 15 additions and 1 deletions
|
|
@ -1,9 +1,10 @@
|
|||
import { CopyButton, DownloadButton, PreviewCodeToggle } from "@mariozechner/mini-lit";
|
||||
import { Button, CopyButton, DownloadButton, icon, PreviewCodeToggle } from "@mariozechner/mini-lit";
|
||||
import hljs from "highlight.js";
|
||||
import { html } from "lit";
|
||||
import { customElement, property, state } from "lit/decorators.js";
|
||||
import { createRef, type Ref, ref } from "lit/directives/ref.js";
|
||||
import { unsafeHTML } from "lit/directives/unsafe-html.js";
|
||||
import { RefreshCw } from "lucide";
|
||||
import type { SandboxIframe } from "../../components/SandboxedIframe.js";
|
||||
import { type MessageConsumer, RUNTIME_MESSAGE_ROUTER } from "../../components/sandbox/RuntimeMessageRouter.js";
|
||||
import type { SandboxRuntimeProvider } from "../../components/sandbox/SandboxRuntimeProvider.js";
|
||||
|
|
@ -56,6 +57,16 @@ export class HtmlArtifact extends ArtifactElement {
|
|||
return html`
|
||||
<div class="flex items-center gap-2">
|
||||
${toggle}
|
||||
${Button({
|
||||
variant: "ghost",
|
||||
size: "sm",
|
||||
onClick: () => {
|
||||
this.logs = [];
|
||||
this.executeContent(this._content);
|
||||
},
|
||||
title: i18n("Reload HTML"),
|
||||
children: icon(RefreshCw, "sm"),
|
||||
})}
|
||||
${copyButton}
|
||||
${DownloadButton({ content: downloadContent, filename: this.filename, mimeType: "text/html", title: i18n("Download HTML") })}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue