Telas a partir de React

O NoWayOS não tem navegador, e nunca terá: essa é a ideia. Mas designers e desenvolvedores front-end podem continuar com as suas ferramentas. O Screen Compiler converte telas React, escritas em TSX dentro de um subconjunto declarado, em Rust para o runtime de UI do NoWayOS. Ele roda em tempo de build, na sua máquina ou na CI, e nunca vai para o dispositivo.

Disto

export function WelcomeScreen({ onStart, onHelp }: WelcomeProps) {
 return (
 <Screen>
 <Column gap={SPACE_SM} padding={SPACE_LG}>
 <Text id="title">Welcome</Text>
 <Text>Touch Start to begin.</Text>
 <Spacer />
 <Button id="start" onPress={onStart}>Start</Button>
 <Button onPress={onHelp}>Help &amp; accessibility</Button>
 </Column>
 </Screen>
 );
}

Para isto

pub fn build<B: ui::UiBuilder>(b: &mut B) -> Result<Nodes<B::Node>, B::Error> {
 let n1 = b.text("Welcome")?; // welcome.tsx:17:9 <Text>
 let n2 = b.text("Touch Start to begin.")?; // welcome.tsx:18:9 <Text>
 let n4 = b.spacer(None)?; // welcome.tsx:20:9 <Spacer>
 let n5 = b.button("Start", actions::START)?; // welcome.tsx:21:9 <Button>
 let n6 = b.button("Help & accessibility", actions::HELP)?; // welcome.tsx:24:9 <Button>
 let n0 = b.column(ui::Layout::new().gap(super::tokens::SPACE_SM).padding(super::tokens::SPACE_LG), &[n1, n2, n4, n5, n6])?; // welcome.tsx:16:7 <Column>
 Ok(Nodes { root: n0, title: n1, start: n5 })
}

Cada nó aponta de volta para a linha e a coluna do TSX de onde veio. A tela convertida é então desenhada pelo renderizador do NoWayOS e precisa corresponder à sua imagem aprovada, pixel a pixel. (Trecho resumido de fixtures/welcome.tsx, do repositório, e do Rust gerado a partir dele.)

O que ele converte

Telas construídas com o kit do Screen Compiler: Screen, Column, Row, Text, Button, TextInput, Checkbox, RadioGroup, Spacer, Card, Notice, HeaderBar, ProgressBar e Icon. Também design tokens como constantes, props de callback que viram ações, textos que a aplicação define em tempo de execução e partes que a aplicação mostra ou esconde ({cond && <X/>}).

Exato ou nada. Tudo o que estiver fora do subconjunto é recusado, com arquivo, linha e coluna, e nunca aproximado. A mesma tela gera Rust idêntico byte a byte em qualquer máquina. O código gerado não tem unsafe, nem unwrap, nem panic.

Experimente

O contêiner de desenvolvimento do Screen Compiler e a sua verificação de contrato vêm do NoWayOS, então clone os dois lado a lado:

mkdir nowayos-work && cd nowayos-work
git clone https://github.com/NoWayOS/nowayos.git
git clone https://github.com/NoWayOS/screen-compiler.git screen-compiler
make -C nowayos container # the dev image, once
cd screen-compiler
make test # unit, property, snapshot and command-line tests
make run ARGS="check fixtures/welcome.tsx" # check one screen against the subset
make contract-check # build every screen against NoWayOS's UI, and draw it

Imagens aprovadas

Toda tela convertida tem uma imagem aprovada. Quando uma mudança numa tela, ou no layout ou no desenho do NoWayOS, altera a aparência dela, redesenhe as imagens com make bless-images em screen-compiler. Uma pessoa olha cada uma e a aprova antes do commit. Do lado do nowayos, make screen-compiler-check mostra quais imagens aprovadas uma mudança alteraria.

Use só em telas suas

O Screen Compiler é uma ferramenta de build, não um sandbox. Converta TSX em que você confia, como faria ao compilar código em que confia.

Licença

O Screen Compiler é MIT. O Rust que ele gera a partir das suas telas é seu, para licenciar como quiser.