agent-canvas 0.2.0 → 0.6.0

package/daemon/review-widget/styles.css

@@ -0,0 +1,359 @@
+:host {
+	all: initial;
+	--bg: #ffffff;
+	--bg-muted: #f4f4f5;
+	--text: #18181b;
+	--text-muted: #71717a;
+	--border: #e4e4e7;
+	--accent: #6d28d9;
+	--accent-text: #ffffff;
+	--accent-soft: #ede9fe;
+	--ok: #15803d;
+	--ok-soft: #dcfce7;
+	--warn: #b45309;
+	--warn-soft: #fef3c7;
+	--shadow: 0 8px 28px rgba(24, 24, 27, 0.18), 0 1px 3px rgba(24, 24, 27, 0.12);
+	font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
+	font-size: 13px;
+	line-height: 1.45;
+	color: var(--text);
+}
+
+@media (prefers-color-scheme: dark) {
+	:host {
+		--bg: #18181b;
+		--bg-muted: #27272a;
+		--text: #f4f4f5;
+		--text-muted: #a1a1aa;
+		--border: #3f3f46;
+		--accent: #a78bfa;
+		--accent-text: #18181b;
+		--accent-soft: #2e1065;
+		--ok: #4ade80;
+		--ok-soft: #14532d;
+		--warn: #fbbf24;
+		--warn-soft: #451a03;
+	}
+}
+
+* {
+	box-sizing: border-box;
+}
+
+button {
+	font: inherit;
+	color: inherit;
+	cursor: pointer;
+	border: 1px solid var(--border);
+	background: var(--bg);
+	border-radius: 6px;
+	padding: 4px 10px;
+}
+
+button:hover {
+	background: var(--bg-muted);
+}
+
+button.primary {
+	background: var(--accent);
+	border-color: var(--accent);
+	color: var(--accent-text);
+}
+
+button.primary:hover {
+	filter: brightness(1.08);
+}
+
+button.ghost {
+	border-color: transparent;
+	background: transparent;
+	color: var(--text-muted);
+}
+
+button:disabled {
+	opacity: 0.5;
+	cursor: default;
+}
+
+textarea {
+	font: inherit;
+	color: inherit;
+	width: 100%;
+	min-height: 72px;
+	resize: vertical;
+	padding: 8px;
+	border: 1px solid var(--border);
+	border-radius: 6px;
+	background: var(--bg);
+}
+
+textarea:focus {
+	outline: 2px solid var(--accent);
+	outline-offset: -1px;
+}
+
+.toolbar {
+	position: fixed;
+	right: 16px;
+	bottom: 16px;
+	z-index: 2147483646;
+	display: flex;
+	align-items: center;
+	gap: 6px;
+	padding: 6px;
+	background: var(--bg);
+	border: 1px solid var(--border);
+	border-radius: 10px;
+	box-shadow: var(--shadow);
+}
+
+.toolbar.beside-panel {
+	right: calc(min(380px, 100vw) + 16px);
+}
+
+.toolbar button.active {
+	background: var(--accent);
+	border-color: var(--accent);
+	color: var(--accent-text);
+}
+
+.presence {
+	display: flex;
+	align-items: center;
+	gap: 6px;
+	padding: 0 6px;
+	color: var(--text-muted);
+	font-size: 12px;
+}
+
+.dot {
+	width: 8px;
+	height: 8px;
+	border-radius: 50%;
+	background: var(--text-muted);
+}
+
+.dot.on {
+	background: var(--ok);
+}
+
+.dot.off-line {
+	background: var(--warn);
+}
+
+.highlight {
+	position: fixed;
+	z-index: 2147483644;
+	pointer-events: none;
+	border: 2px solid var(--accent);
+	background: color-mix(in srgb, var(--accent) 10%, transparent);
+	border-radius: 3px;
+}
+
+.highlight.flash {
+	animation: flash 1.2s ease-out;
+}
+
+@keyframes flash {
+	from {
+		background: color-mix(in srgb, var(--accent) 35%, transparent);
+	}
+}
+
+.pin {
+	position: fixed;
+	z-index: 2147483645;
+	min-width: 22px;
+	height: 22px;
+	padding: 0 6px;
+	border-radius: 11px 11px 11px 2px;
+	border: 2px solid var(--bg);
+	background: var(--accent);
+	color: var(--accent-text);
+	font-size: 11px;
+	font-weight: 600;
+	line-height: 18px;
+	text-align: center;
+	box-shadow: var(--shadow);
+}
+
+.pin.queued,
+.pin.working {
+	background: var(--warn);
+	color: var(--bg);
+}
+
+.pin.resolved {
+	background: var(--ok);
+	color: var(--bg);
+	opacity: 0.7;
+}
+
+.popover {
+	position: fixed;
+	z-index: 2147483647;
+	width: 320px;
+	padding: 10px;
+	background: var(--bg);
+	border: 1px solid var(--border);
+	border-radius: 10px;
+	box-shadow: var(--shadow);
+	display: flex;
+	flex-direction: column;
+	gap: 8px;
+}
+
+.target {
+	color: var(--text-muted);
+	font-size: 12px;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.actions {
+	display: flex;
+	justify-content: flex-end;
+	gap: 6px;
+	flex-wrap: wrap;
+}
+
+.option {
+	display: flex;
+	align-items: center;
+	gap: 6px;
+	color: var(--text-muted);
+	font-size: 12px;
+	cursor: pointer;
+}
+
+.hint {
+	color: var(--text-muted);
+	font-size: 11px;
+}
+
+.panel {
+	position: fixed;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	z-index: 2147483646;
+	width: min(380px, 100vw);
+	display: flex;
+	flex-direction: column;
+	background: var(--bg);
+	border-left: 1px solid var(--border);
+	box-shadow: var(--shadow);
+}
+
+.panel header {
+	display: flex;
+	align-items: center;
+	gap: 8px;
+	padding: 12px;
+	border-bottom: 1px solid var(--border);
+}
+
+.panel header h2 {
+	flex: 1;
+	margin: 0;
+	font-size: 14px;
+	font-weight: 600;
+}
+
+.tabs {
+	display: flex;
+	gap: 4px;
+	padding: 8px 12px;
+	border-bottom: 1px solid var(--border);
+}
+
+.tabs button.active {
+	background: var(--bg-muted);
+	font-weight: 600;
+}
+
+.threads {
+	flex: 1;
+	overflow-y: auto;
+	padding: 12px;
+	display: flex;
+	flex-direction: column;
+	gap: 10px;
+}
+
+.empty {
+	color: var(--text-muted);
+	text-align: center;
+	padding: 24px 8px;
+}
+
+.thread {
+	border: 1px solid var(--border);
+	border-radius: 8px;
+	padding: 10px;
+	display: flex;
+	flex-direction: column;
+	gap: 8px;
+}
+
+.thread.current {
+	border-color: var(--accent);
+}
+
+.thread-head {
+	display: flex;
+	align-items: center;
+	gap: 6px;
+}
+
+.thread-head .target {
+	flex: 1;
+}
+
+.badge {
+	font-size: 11px;
+	font-weight: 600;
+	padding: 1px 6px;
+	border-radius: 4px;
+	background: var(--bg-muted);
+	color: var(--text-muted);
+	white-space: nowrap;
+}
+
+.badge.queued,
+.badge.working {
+	background: var(--warn-soft);
+	color: var(--warn);
+}
+
+.badge.resolved {
+	background: var(--ok-soft);
+	color: var(--ok);
+}
+
+.comment {
+	display: flex;
+	flex-direction: column;
+	gap: 2px;
+}
+
+.comment .author {
+	font-size: 11px;
+	font-weight: 600;
+	color: var(--text-muted);
+}
+
+.comment.agent .author {
+	color: var(--accent);
+}
+
+.comment .body {
+	white-space: pre-wrap;
+	overflow-wrap: anywhere;
+}
+
+.error {
+	color: var(--warn);
+	font-size: 12px;
+}

package/daemon/review-widget/text-modules.d.ts

@@ -0,0 +1,4 @@
+declare module '*.css' {
+	const text: string
+	export default text
+}

package/daemon/review-widget/tsconfig.json

@@ -0,0 +1,16 @@
+{
+	"compilerOptions": {
+		"target": "ES2022",
+		"module": "ESNext",
+		"moduleResolution": "bundler",
+		"lib": ["ES2022", "DOM", "DOM.Iterable"],
+		"jsx": "react-jsx",
+		"jsxImportSource": "preact",
+		"strict": true,
+		"noUncheckedIndexedAccess": true,
+		"skipLibCheck": true,
+		"noEmit": true,
+		"types": []
+	},
+	"include": ["**/*.ts", "**/*.tsx", "../src/review/model.ts"]
+}