go/lem-chat/index.html
Claude e6cd676278
feat: add lem-chat TypeScript web components
Standalone chat UI built with vanilla Web Components (Custom Elements +
Shadow DOM) that connects to the MLX inference server's SSE streaming
endpoint. Zero framework dependencies, single JS bundle output.

Components:
- <lem-chat>: Container with SSE client, config via attributes
- <lem-messages>: Scrollable message list with auto-scroll
- <lem-message>: Single message bubble with streaming + <think> tag support
- <lem-input>: Textarea with Enter to send, Shift+Enter for newline

Build: esbuild src/lem-chat.ts → dist/lem-chat.js (15KB ESM)
Replaces the monolithic chat.js in core/go-ml.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-24 18:23:59 +00:00

34 lines
844 B
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LEM Chat</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; background: #111; }
body {
display: flex;
align-items: center;
justify-content: center;
font-family: system-ui, -apple-system, sans-serif;
}
lem-chat {
width: 720px;
height: 85vh;
max-height: 800px;
}
@media (max-width: 768px) {
lem-chat { width: 100%; height: 100%; max-height: none; border-radius: 0; }
}
</style>
</head>
<body>
<lem-chat
endpoint="http://localhost:8090"
model="local"
max-tokens="2048"
></lem-chat>
<script type="module" src="dist/lem-chat.js"></script>
</body>
</html>