Keegan George dfea784fc4
DEV: Improve diff streaming accuracy with safety checker (#1338)
This update adds a safety checker which scans the streamed updates. It ensures that incomplete segments of text are not sent yet over message bus as this will cause breakage with the diff streamer. It also updates the diff streamer to handle a thinking state for when we are waiting for message bus updates.
2025-05-15 11:38:46 -07:00

97 lines
1.6 KiB
SCSS

@keyframes flashing {
0%,
100% {
opacity: 0;
}
50% {
opacity: 1;
}
}
@mixin progress-dot {
content: "\25CF";
font-family:
"Söhne Circle",
system-ui,
-apple-system,
"Segoe UI",
Roboto,
Ubuntu,
Cantarell,
"Noto Sans",
sans-serif;
line-height: normal;
margin-left: 0.25rem;
vertical-align: baseline;
animation: flashing 1.5s 3s infinite;
display: inline-block;
font-size: 1rem;
color: var(--tertiary-medium);
}
.streamable-content.streaming .cooked p:last-child::after {
@include progress-dot;
}
article.streaming .cooked {
.progress-dot::after {
@include progress-dot;
}
> .progress-dot:only-child::after {
// if the progress dot is the only content
// we are likely waiting longer for a response
// so it can start animating instantly
animation: flashing 1.5s infinite;
}
}
@keyframes ai-indicator-wave {
0%,
60%,
100% {
transform: initial;
}
30% {
transform: translateY(-0.2em);
}
}
.ai-indicator-wave {
flex: 0 0 auto;
display: inline-flex;
&__dot {
display: inline-block;
@media (prefers-reduced-motion: no-preference) {
animation: ai-indicator-wave 1.8s linear infinite;
}
&:nth-child(2) {
animation-delay: -1.6s;
}
&:nth-child(3) {
animation-delay: -1.4s;
}
}
}
@keyframes mark-blink {
0%,
100% {
border-color: var(--highlight-high);
}
50% {
border-color: transparent;
}
}
.composer-ai-helper-modal__suggestion.thinking mark.highlight {
animation: mark-blink 1s step-start 0s infinite;
}