
# Käyttö

Ydintyönkulku koostuu yhdestä kutsusta: anna TailwindPHP-toiminnolle sisältösi ja halutessasi CSS-kokoonpano, niin se palauttaa löytämilleen luokille kuuluvan CSS-tulosteen. Luokkien nimet poimitaan merkintäkielestä, käännetään ratkaistua teemaa vasten, ja tulos sisältää vain todella käyttämäsi apuohjelmat.

```php
use TailwindPHP\tw;

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

Ilman toista argumenttia `generate()` käyttää oletusarvoista `@import "tailwindcss"`-kokoonpanoa (teema + [Preflight](https://tailwindphp.inline0.dev/fi/docs/usage/imports) + apuohjelmat). Mukautusta varten anna CSS-merkkijono tai taulukko.

## Sisällön skannaus

TailwindPHP löytää luokkien nimet lukemalla sisältösi attribuutit `class` ja `className`. Voit tarkastella poimittuja nimiä komennolla `tw::extractCandidates()`:

```php
use TailwindPHP\tw;

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

Sekä attribuutit `class` että `className` skannataan, ja palautetusta luettelosta poistetaan kaksoiskappaleet. Muita ehdokkaita (kuten `[mask-type:luminance]` tai `bg-[#1da1f2]`) käsitellään samalla tavalla, ja ne käännetään, jos ne ovat kelvollisia. Tässä näkyvät arvot ovat täsmälleen ne, jotka `generate()` kääntää.

## Syötemuodot

Jokainen staattinen metodi hyväksyy samat kolme syötemuotoa:

| Muoto | Allekirjoitus | Käyttötilanne |
|--------|-----------|----------|
| Vain merkkijono | `tw::generate($content)` | Oletusteema ilman mukautuksia. |
| Merkkijono + CSS-merkkijono | `tw::generate($content, $css)` | Nopeat teemamuutokset tai direktiivit suoraan merkkijonossa. |
| Taulukko | `tw::generate(['content' => ..., 'css' => ...])` | Tarvitset vaihtoehdot `minify`, `importPaths` tai `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,
]);
```

Vain taulukkomuoto hyväksyy asetuksia. `css`- ja `minify`-arvojen lisäksi se hyväksyy asetukset `importPaths` (katso [Imports](https://tailwindphp.inline0.dev/fi/docs/usage/imports)), `cache` ja `cacheTtl` (katso [Caching](https://tailwindphp.inline0.dev/fi/docs/advanced/caching)).

## Uudelleenkäytettävä kääntäjä

Kun kokoat monia katkelmia samoilla asetuksilla — pyyntöketjussa, mallipohjien erässä tai komponenttikirjastossa — yksi kääntäjäinstanssi on tehokkaampi. `tw::compile()` ratkaisee teeman ja suunnittelujärjestelmän kerran ja käyttää niitä sitten uudelleen:

```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);
```

Kääntäjä tarjoaa myös ominaisuuksien tarkastelutoiminnot (`properties()`, `computedProperties()`, `value()`, `computedValue()`) ja teeman käyttötoiminnot (`colors()`, `breakpoints()`, `spacing()`). Kaikki metodit löytyvät täydellisestä [API](https://tailwindphp.inline0.dev/fi/docs/api)-viitteestä.

## Syötteen CSS määrittäminen

Suurin osa TailwindPHP-toiminnon tehosta perustuu kokoonpanona annettavaan CSS-merkkijonoon. Jatka osioihin:

- [Theme](https://tailwindphp.inline0.dev/fi/docs/usage/theme) — `@theme`-muuttujat ja nimiavaruudet.
- [Directives](https://tailwindphp.inline0.dev/fi/docs/usage/directives) — `@apply`, `@utility`, `@layer` ja `@custom-variant`.
- [Imports](https://tailwindphp.inline0.dev/fi/docs/usage/imports) — `@import`, virtuaalimoduulit, `importPaths` ja Preflight.
- [@source](https://tailwindphp.inline0.dev/fi/docs/usage/source) — määritä, mitä tiedostoja ja luokkia skannataan.
