Una barra di scorrimento, per ogni pergamena nell'app

Featurekamo-internal
Spegnimento
5 settembre 2026 alle ore 18:45 UTC
Autore
Kamo
Impegno
b1bc689

La finestra dello strumento terminale aveva una barra di scorrimento che vale la pena di tenere — 32px, con un pulsante per ogni END del rotolo e le solite frecce passo, perché in un documento lungo le due estremità non sono altre due posizioni, sono i due posti Tu vuoi davvero. Il resto dell'app aveva trentaquattro copie scritte a mano di una idea minore: 138 `:-webkit-scrollbar` dichiarazioni a sei larghezze diverse (4, 6, 8, 12, 14, 20px), più tre classi globali ad un settimo. Un test di guardia già esisteva perché quattro finestre di chat erano alla deriva a tre larghezze; poteva solo riparare un dodicesimo del problema. La barra è ora un componente, dipinto sopra l'elemento che scorre piuttosto che posto al suo interno. Questa è la decisione che tutto il resto segue da. Sfruttamento ogni pergamena per posizionare una barra accanto al contenuto sarebbe una modifica del layout in tutti 228 di loro — bambini flessosi, bambini di griglia, `minHeight: 0` colonne — e sarebbe ancora non raggiungere i portali di scorrimento questa applicazione non possiede: ag-Grid's, il Da DataGrid, da Lexical. Dipingere su di loro è un cambiamento di layout in nessuno. Il prezzo viene pagato in overlayGeometry.ts: clipping intersecando la clipping gli antenati, impilando dal più vicino ancestor z-index più uno (che mette un barra della pagina sotto una finestra di dialogo aperta e una barra di dialogo su di esso, da una regola), e in piedi giù quando MUI segna il contenuto dietro un modal aria-hidden. L'adozione è da marcatore classe, non spazzando il documento per `overflow: auto`. Entrambi raggiungono ogni pergamena; solo uno è debuggable, e solo uno mantiene la barra da ogni menu Seleziona e 40px popper nell'app. script/codemod-kamo-scroll.mjs applicato — parsing con il proprio parser di TypeScript e splicing a byte offsets, così la formattazione e CRLF sopravvivere — e spogliato le dichiarazioni che ha fatto morto. Si degrada, perché ora si blocca un popover 250px emoji così come una pagina: pulsanti e traccia a 140px o più, tracciare da solo sotto quello, niente affatto quando l'elemento non è traboccante. Horizontal è lo stesso componente con il icone girato un quarto turno piuttosto che un secondo set che andrebbe alla deriva. Un pergamena che vuole NO bar — la rotaia nav crollata, le testate della console, il filmtrip, il profilo ferroviario su un telefono — ora lo dice una volta, con `data-kamo-scrollbar="off"`, invece che in sei modi diversi era ha detto. Solo TerminalTool nomina ancora una barra di scorrimento in CSS, per nascondere la propria xterm. TerminalScrollbar è lasciato come adattatore: un buffer xterm nel modello, in LINEE piuttosto che pixel, e si sposta indietro come chiamate xterm o la ruota relazioni tmux lega. Mantiene la presa indeterminata per un rotolo che non si può dire dove si trova, e il pulsante salta-to-end acceso per l'output sotto piega. Guardie: unoScrollbar.test.ts non riesce se qualcosa al di fuori di globals.css stili un barra di scorrimento, se la larghezza del componente e il foglio di stile non sono d'accordo, o se l'elenco dei marcatori dello strato e l'elenco di nascondiglio del foglio di stile cadono dal passo — un elemento su uno e non l'altro ottiene due barre o nessuno, e entrambi leggono come un rendering glitch piuttosto che una linea mancante. scrollbarView.test.tsx guida il barra dalla tastiera, che è il punto dei pulsanti essendo pulsanti.

Tutte le modifiche

Come quello che vedi la spedizione?

Ognuno di questi aggiornamenti atterra automaticamente nello spazio di lavoro. Inizia gratis e guardalo crescere settimana dopo settimana.

Inizia gratis per sempreVisualizza il prezzo