Files
my-pi/packages/web-ui/src/tools/artifacts/ArtifactPill.ts
T
Mario Zechner 58b9c36268 Make renderHeader and renderCollapsibleHeader accept string | TemplateResult
- Update renderHeader and renderCollapsibleHeader in renderer-registry.ts to accept `text: string | TemplateResult`
- Remove duplicated renderCollapsibleHeaderWithPill helper in artifacts-tool-renderer.ts
- Update all artifact renderer calls to use renderHeaderWithPill() inline
- Remove all separate pill rendering below headers

This allows artifact pills to be rendered inline with header text without code duplication.
2025-10-08 14:12:02 +02:00

24 lines
823 B
TypeScript

import { html, icon, type TemplateResult } from "@mariozechner/mini-lit";
import { FileCode2 } from "lucide";
import type { ArtifactsPanel } from "./artifacts.js";
export function ArtifactPill(filename: string, artifactsPanel?: ArtifactsPanel): TemplateResult {
const handleClick = () => {
if (!artifactsPanel) return;
// openArtifact will show the artifact and call onOpen() to open the panel if needed
(artifactsPanel as any).openArtifact(filename);
};
return html`
<span
class="inline-flex items-center gap-1 px-2 py-0.5 text-xs bg-muted/50 border border-border rounded ${
artifactsPanel ? "cursor-pointer hover:bg-muted transition-colors" : ""
}"
@click=${artifactsPanel ? handleClick : null}
>
${icon(FileCode2, "sm")}
<span class="text-foreground">${filename}</span>
</span>
`;
}