Uso

Ver como Markdown Editar no GitHub Documentação em 3843abd

O fluxo de trabalho principal consiste em uma única chamada: forneça a TailwindPHP seu conteúdo e uma configuração CSS opcional, e ela retornará o CSS das classes encontradas. Os nomes das classes são extraídos da marcação e compilados com base no tema resolvido; o resultado contém apenas as utilidades que você realmente usa.

PHP

use TailwindPHP\tw;

$css = tw::generate('<div class="flex items-center p-4 bg-blue-500">Hello</div>');

Sem um segundo argumento, generate() usa um @import "tailwindcss" padrão (tema + Preflight + utilidades). Passe uma string CSS ou um array para personalizar.

Análise de conteúdo

TailwindPHP encontra nomes de classes lendo os atributos class e className do seu conteúdo. Para inspecionar o que é extraído, use tw::extractCandidates():

PHP

use TailwindPHP\tw;

tw::extractCandidates('<div class="flex p-4" className="bg-blue-500">');
// ['flex', 'p-4', 'bg-blue-500']

Os atributos class e className são analisados, e a lista retornada é desduplicada. Candidatos arbitrários (como [mask-type:luminance] ou bg-[#1da1f2]) são extraídos da mesma forma e compilados se forem válidos. Tudo o que aparecer aqui é exatamente o que generate() compilará.

Formatos de entrada

Cada método estático aceita os mesmos três formatos de entrada:

Formato	Assinatura	Use quando
Apenas string	`tw::generate($content)`	Tema padrão, sem personalização.
String + string CSS	`tw::generate($content, $css)`	Ajustes rápidos no tema ou diretivas em linha.
Array	`tw::generate(['content' => ..., 'css' => ...])`	Você precisa de `minify`, `importPaths` ou `cache`.

PHP

use TailwindPHP\tw;

// Format 1: String only
tw::generate('<div class="flex">');

// Format 2: String + CSS string
tw::generate('<div class="flex">', '@import "tailwindcss"; @theme { --color-brand: #3b82f6; }');

// Format 3: Array with content, css, and options
tw::generate([
    'content' => '<div class="flex p-4">',
    'css'     => '@import "tailwindcss";',
    'minify'  => true,
]);

O formato de array é o único que aceita opções. Além de css e minify, ele aceita importPaths (veja Importações), cache e cacheTtl (veja Cache).

Compilador reutilizável

Compilar vários fragmentos com a mesma configuração — um ciclo de requisições, um lote de modelos ou uma biblioteca de componentes — é mais eficiente com uma única instância do compilador. tw::compile() resolve o tema e o sistema de design uma vez e depois os reutiliza:

PHP

use TailwindPHP\tw;

$compiler = tw::compile('@import "tailwindcss"; @theme { --color-brand: #3b82f6; }');

$css        = $compiler->generate('<div class="flex p-4 bg-brand">');
$candidates = $compiler->extractCandidates('<div class="flex p-4 bg-brand">');
$minified   = $compiler->minify($css);

O compilador também oferece inspeção de propriedades (properties(), computedProperties(), value(), computedValue()) e métodos de acesso ao tema (colors(), breakpoints(), spacing()). Consulte a API completa para ver todos os métodos.

Configurando a entrada CSS

A maior parte dos recursos de TailwindPHP está na string CSS que você passa como configuração. Continue com:

Tema — @theme variáveis e namespaces.
Diretivas — @apply, @utility, @layer, @custom-variant.
Importações — @import, módulos virtuais, importPaths e Preflight.
@source — controle quais arquivos e classes são analisados.