Hide lead signals, add state to them, scanner and list fixes
This commit is contained in:
Ian Gulliver
Vendored
+6
-16
@@ -158,36 +158,26 @@ export function mountChat(root, src, makeHead) {
|
||||
let ctx = newCtx();
|
||||
let context = new Map();
|
||||
const headImpl = makeHead(() => renderHead());
|
||||
const spinner = h("div", { class: "spinner", hidden: true });
|
||||
const scanner = h("div", { class: "scanner", hidden: true });
|
||||
const setRunning = (running) => {
|
||||
transcript.classList.toggle("running", running);
|
||||
if (running === !spinner.hidden) {
|
||||
return;
|
||||
}
|
||||
spinner.hidden = !running;
|
||||
pin();
|
||||
scanner.hidden = !running;
|
||||
};
|
||||
const putBefore = (el, anchor) => {
|
||||
if (anchor?.parentNode === transcript) {
|
||||
transcript.insertBefore(el, anchor);
|
||||
}
|
||||
else if (spinner.parentNode === transcript) {
|
||||
transcript.insertBefore(el, spinner);
|
||||
}
|
||||
else {
|
||||
transcript.append(el);
|
||||
}
|
||||
};
|
||||
const syncRunning = () => setRunning(src.session()?.state === "running" && ctx.open);
|
||||
const release = () => {
|
||||
const el = ctx.held;
|
||||
if (!el) {
|
||||
if (!ctx.held) {
|
||||
return;
|
||||
}
|
||||
ctx.held = undefined;
|
||||
ctx.open = true;
|
||||
ctx.drawn?.push(el);
|
||||
putBefore(el, stream?.el ?? pending[0]?.el);
|
||||
syncRunning();
|
||||
};
|
||||
const put = (el, keepHeld = false) => {
|
||||
@@ -250,7 +240,7 @@ export function mountChat(root, src, makeHead) {
|
||||
const entry = { el, text, imgs };
|
||||
pending.push(entry);
|
||||
ctx.run = undefined;
|
||||
putBefore(el, spinner);
|
||||
putBefore(el, undefined);
|
||||
stuck = true;
|
||||
pin();
|
||||
return () => {
|
||||
@@ -459,7 +449,7 @@ export function mountChat(root, src, makeHead) {
|
||||
replace(transcript, h("div", { class: "empty" }, src.empty));
|
||||
return;
|
||||
}
|
||||
replace(transcript, spinner);
|
||||
replace(transcript);
|
||||
appendEvents(src.events());
|
||||
renderComposer();
|
||||
};
|
||||
@@ -473,7 +463,7 @@ export function mountChat(root, src, makeHead) {
|
||||
onEach([src.streamTopic], (ev) => appendDelta(ev)),
|
||||
onEach(["tasks", "sessions"], () => fillTodoLinks(transcript, models[0])),
|
||||
];
|
||||
replace(root, h("div", { class: "transcript-view" }, head, transcript, composer));
|
||||
replace(root, h("div", { class: "transcript-view" }, head, transcript, scanner, composer));
|
||||
renderAll();
|
||||
return () => {
|
||||
for (const off of offs) {
|
||||
|
||||
Vendored
+1
-1
File diff suppressed because one or more lines are too long
+6
-15
@@ -228,34 +228,25 @@ export function mountChat(root: HTMLElement, src: ChatSource, makeHead: (rerende
|
||||
let context = new Map<string, Usage>();
|
||||
const headImpl = makeHead(() => renderHead());
|
||||
|
||||
const spinner = h("div", { class: "spinner", hidden: true });
|
||||
const scanner = h("div", { class: "scanner", hidden: true });
|
||||
const setRunning = (running: boolean) => {
|
||||
transcript.classList.toggle("running", running);
|
||||
if (running === !spinner.hidden) {
|
||||
return;
|
||||
}
|
||||
spinner.hidden = !running;
|
||||
pin();
|
||||
scanner.hidden = !running;
|
||||
};
|
||||
const putBefore = (el: HTMLElement, anchor: HTMLElement | undefined) => {
|
||||
if (anchor?.parentNode === transcript) {
|
||||
transcript.insertBefore(el, anchor);
|
||||
} else if (spinner.parentNode === transcript) {
|
||||
transcript.insertBefore(el, spinner);
|
||||
} else {
|
||||
transcript.append(el);
|
||||
}
|
||||
};
|
||||
const syncRunning = () => setRunning(src.session()?.state === "running" && ctx.open);
|
||||
const release = () => {
|
||||
const el = ctx.held;
|
||||
if (!el) {
|
||||
if (!ctx.held) {
|
||||
return;
|
||||
}
|
||||
ctx.held = undefined;
|
||||
ctx.open = true;
|
||||
ctx.drawn?.push(el);
|
||||
putBefore(el, stream?.el ?? pending[0]?.el);
|
||||
syncRunning();
|
||||
};
|
||||
const put = (el: HTMLElement, keepHeld = false) => {
|
||||
@@ -326,7 +317,7 @@ export function mountChat(root: HTMLElement, src: ChatSource, makeHead: (rerende
|
||||
const entry = { el, text, imgs };
|
||||
pending.push(entry);
|
||||
ctx.run = undefined;
|
||||
putBefore(el, spinner);
|
||||
putBefore(el, undefined);
|
||||
stuck = true;
|
||||
pin();
|
||||
return () => {
|
||||
@@ -540,7 +531,7 @@ export function mountChat(root: HTMLElement, src: ChatSource, makeHead: (rerende
|
||||
replace(transcript, h("div", { class: "empty" }, src.empty));
|
||||
return;
|
||||
}
|
||||
replace(transcript, spinner);
|
||||
replace(transcript);
|
||||
appendEvents(src.events());
|
||||
renderComposer();
|
||||
};
|
||||
@@ -556,7 +547,7 @@ export function mountChat(root: HTMLElement, src: ChatSource, makeHead: (rerende
|
||||
onEach(["tasks", "sessions"], () => fillTodoLinks(transcript, models[0]!)),
|
||||
];
|
||||
|
||||
replace(root, h("div", { class: "transcript-view" }, head, transcript, composer));
|
||||
replace(root, h("div", { class: "transcript-view" }, head, transcript, scanner, composer));
|
||||
renderAll();
|
||||
return () => {
|
||||
for (const off of offs) {
|
||||
|
||||
+33
-13
@@ -633,6 +633,31 @@ button.compact.danger {
|
||||
border-color: var(--task);
|
||||
}
|
||||
|
||||
.scanner {
|
||||
position: relative;
|
||||
height: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.scanner::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: -11px;
|
||||
left: 17px;
|
||||
width: 84px;
|
||||
height: 2px;
|
||||
background: linear-gradient(90deg, transparent, var(--task), transparent) 0 0 / 30px 100% no-repeat;
|
||||
-webkit-mask: linear-gradient(90deg, #000 2px, transparent 2px) 0 0 / 5px 2px repeat-x;
|
||||
mask: linear-gradient(90deg, #000 2px, transparent 2px) 0 0 / 5px 2px repeat-x;
|
||||
animation: cylon 1.2s ease-in-out infinite alternate;
|
||||
}
|
||||
|
||||
@keyframes cylon {
|
||||
to {
|
||||
background-position: 100% 0;
|
||||
}
|
||||
}
|
||||
|
||||
.spinner {
|
||||
--frames: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='10'%3E%3Cg%3E%3Ccircle cx='1' cy='1' r='1'/%3E%3Ccircle cx='1' cy='5' r='1'/%3E%3Ccircle cx='4' cy='1' r='1'/%3E%3Ccircle cx='6' cy='1' r='1'/%3E%3Ccircle cx='9' cy='1' r='1'/%3E%3Ccircle cx='9' cy='5' r='1'/%3E%3Ccircle cx='11' cy='1' r='1'/%3E%3Ccircle cx='14' cy='1' r='1'/%3E%3Ccircle cx='14' cy='5' r='1'/%3E%3Ccircle cx='14' cy='9' r='1'/%3E%3Ccircle cx='19' cy='1' r='1'/%3E%3Ccircle cx='19' cy='5' r='1'/%3E%3Ccircle cx='19' cy='9' r='1'/%3E%3Ccircle cx='21' cy='9' r='1'/%3E%3Ccircle cx='24' cy='1' r='1'/%3E%3Ccircle cx='24' cy='5' r='1'/%3E%3Ccircle cx='24' cy='9' r='1'/%3E%3Ccircle cx='26' cy='9' r='1'/%3E%3Ccircle cx='29' cy='5' r='1'/%3E%3Ccircle cx='29' cy='9' r='1'/%3E%3Ccircle cx='31' cy='5' r='1'/%3E%3Ccircle cx='31' cy='9' r='1'/%3E%3Ccircle cx='34' cy='9' r='1'/%3E%3Ccircle cx='36' cy='1' r='1'/%3E%3Ccircle cx='36' cy='5' r='1'/%3E%3Ccircle cx='36' cy='9' r='1'/%3E%3Ccircle cx='39' cy='9' r='1'/%3E%3Ccircle cx='41' cy='1' r='1'/%3E%3Ccircle cx='41' cy='5' r='1'/%3E%3Ccircle cx='41' cy='9' r='1'/%3E%3Ccircle cx='46' cy='1' r='1'/%3E%3Ccircle cx='46' cy='5' r='1'/%3E%3Ccircle cx='46' cy='9' r='1'/%3E%3Ccircle cx='49' cy='1' r='1'/%3E%3C/g%3E%3C/svg%3E");
|
||||
flex-shrink: 0;
|
||||
@@ -684,22 +709,21 @@ button.compact.danger {
|
||||
margin: 0 0 8px;
|
||||
}
|
||||
|
||||
.md ul {
|
||||
padding-left: 3ch;
|
||||
}
|
||||
|
||||
.md ol {
|
||||
padding-left: 4ch;
|
||||
}
|
||||
|
||||
.md li .copyable,
|
||||
.md li .md-table {
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.md ol,
|
||||
.md ul {
|
||||
padding-left: 0;
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
.md li > ul,
|
||||
.md li > ol {
|
||||
margin: 2px 0;
|
||||
padding-left: 3ch;
|
||||
}
|
||||
|
||||
.md h3,
|
||||
@@ -1584,14 +1608,10 @@ pre.file-text .line::before {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.md li.choice + li.choice {
|
||||
.md li + li.choice {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.md ul:has(> li.choice) {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.choice-box,
|
||||
.pick.choice-box {
|
||||
display: block;
|
||||
|
||||
Reference in New Issue
Block a user