Fontes

@textjs/font analisa arquivos FIGfont 2 (.flf) e organiza seu layout exatamente como o programa figlet. Cada fonte é um módulo ES, então apenas as fontes que você importa são incluídas.

import { FigletText } from "@textjs/font/react";import { slant } from "@textjs/font/slant";export default function Page() {  return <FigletText font={slant} color="accent">Text.js</FigletText>;}

#Instalação

bun add @textjs/font

#Uso

<FigletText> recebe uma fonte e uma string. As linhas são medidas em células, então as letras se encaixam em layouts flexbox como qualquer outro <Text>.

import { FigletText } from "@textjs/font/react";import { big } from "@textjs/font/big";<FigletText font={big} layout="fitted" columns={60} align="center" color="muted">  Deployed</FigletText>

<AsciiFont> aceita as mesmas fontes, mantendo seus estilos de letras integrados block e compact:

<AsciiFont text="Text.js" font={slant} color="accent" />

Fora do React, renderFiglet retorna uma string por linha:

import { renderFiglet } from "@textjs/font";import { standard } from "@textjs/font/standard";renderFiglet(standard, "Hello", { layout: "full" });// ["  _   _          _   _         ", " | | | |   ___  | | | |   ___  ", …]

#Layout

O layout horizontal segue as flags do FIGlet.

Todas as seis regras de fusão horizontal estão implementadas: caractere igual, sublinhado, hierarquia, par oposto, X grande e hardblank.

verticalLayout se aplica a textos com várias linhas. O FIGlet 2.2.5 nunca aproxima as linhas verticalmente, então o padrão é "full"; "fitted", "smushed" e "universal" implementam as cinco regras verticais, incluindo a superfusão de linhas verticais, e "default" usa as regras da fonte.

#Quebra de linha e alinhamento

columns (ou width em renderFiglet) quebra as linhas entre palavras e, depois, no meio delas, exatamente onde figlet -w faria. align pode ser "left", "center" ou "right"; sem uma largura, as linhas se alinham dentro da largura da maior linha. Fontes da direita para a esquerda, como ivrit, imprimem da direita para a esquerda e se alinham à direita; sobrescreva esse comportamento com direction.

#Fontes incluídas

Todo glifo usa ASCII imprimível ou Latin-1, então cada subcaractere ocupa exatamente uma célula na fonte Menlo do DevTools. @textjs/font/all exporta todas as fontes, além de BUNDLED_FONTS para galerias. A análise das fontes ocorre na primeira renderização, não na importação.

#Fontes personalizadas

Qualquer FIGfont funciona. Busque o arquivo e depois analise-o:

import { parseFont } from "@textjs/font";const doom = parseFont(await (await fetch("/fonts/doom.flf")).text(), "Doom");

O analisador lê o cabeçalho, as linhas de comentários, os hardblanks, os marcadores de fim, os 102 caracteres obrigatórios e os caracteres identificados por código em decimal, octal ou hexadecimal. Fontes TOIlet .tlf são renderizadas como texto simples. Prefira fontes desenhadas com ASCII ou caracteres de desenho de caixas; braille e emoji não têm largura de uma célula em Menlo.

#Licenciamento

As fontes incluídas são as fontes da distribuição FIGlet 2.2.5, byte por byte, sob a licença BSD de 3 cláusulas do FIGlet. Cada uma mantém seus créditos nas linhas de comentários, disponíveis em tempo de execução como font.comment. Fontes populares sem permissão de redistribuição, como Doom, Larry 3D, ANSI Shadow e Calvin S, não estão incluídas.

#Verificação com figlet

A suíte de testes reproduz 273 saídas gravadas do binário real do figlet 2.2.5: todas as fontes incluídas em todos os modos de layout, quebra de linha, justificação, texto da direita para a esquerda, modo de parágrafo e a própria entrada de regressão do FIGlet. Todas correspondem exatamente.