# @angular-mobile/ui

Componentes mobile do Angular Mobile Kit. Standalone, signal-based, `OnPush`.

## Componentes

| Componente | Descrição |
|---|---|
| `<m-page>`  | Container raiz da página (flex column, viewport completo). |
| `<m-header>` | Cabeçalho fixo no topo, respeita `safe-area-inset-top`. |
| `<m-title>` | Título dentro do header. |
| `<m-content>` | Área de conteúdo rolável. |
| `<m-fab>` | Floating Action Button (`icon` input). |

## Uso

```ts
import { Component } from '@angular/core';
import {
  MPageComponent, MHeaderComponent, MTitleComponent,
  MContentComponent, MFabComponent
} from '@angular-mobile/ui';

@Component({
  standalone: true,
  imports: [MPageComponent, MHeaderComponent, MTitleComponent, MContentComponent, MFabComponent],
  template: `
    <m-page>
      <m-header><m-title>Tarefas</m-title></m-header>
      <m-content>Conteúdo</m-content>
      <m-fab icon="add" />
    </m-page>
  `
})
export class AppComponent {}
```

Importe os tokens CSS no estilo global:

```css
@import '@angular-mobile/ui/src/styles/tokens.css';
```
