# `FrappeUIPhx.Components.Anchor`
[🔗](https://github.com/moacirbishopcamata/frappe_ui_phx/blob/v0.3.1/lib/frappe_ui_phx/components/anchor.ex#L1)

Posicionamento de flutuantes por CSS Anchor Positioning (sem JS).

Funções puras compartilhadas por Dropdown, Popover e afins: o `id` entra em
CSS inline, então tem pré-condição de formato (falha alto se inválido).

# `panel_classes`

```elixir
@spec panel_classes() :: String.t()
```

Casca visual comum dos painéis flutuantes (Dropdown, Popover, ContextMenu, DatePicker,
OptionList): fundo elevado, borda, raio e sombra. Cada componente soma só o que é seu
(largura, espaçamento).

# `panel_style`

```elixir
@spec panel_style(term(), atom()) :: String.t()
```

Estilo do painel, ancorado ao gatilho e invertendo quando falta espaço.

# `placements`

Placements aceitos.

# `trigger_style`

```elixir
@spec trigger_style(term()) :: String.t()
```

Estilo do gatilho: define o nome da âncora.

# `valid_id!`

```elixir
@spec valid_id!(term(), String.t()) :: String.t()
```

Valida o `id` (vira parte de CSS inline) e o devolve.

---

*Consult [api-reference.md](api-reference.md) for complete listing*