Packages
corex
0.1.0
0.1.2
0.1.1
0.1.0
0.1.0-rc.1
0.1.0-rc.0
0.1.0-beta.5
0.1.0-beta.4
0.1.0-beta.3
0.1.0-beta.2
0.1.0-beta.1
0.1.0-alpha.33
0.1.0-alpha.32
0.1.0-alpha.31
0.1.0-alpha.30
0.1.0-alpha.29
0.1.0-alpha.28
0.1.0-alpha.27
0.1.0-alpha.26
0.1.0-alpha.25
0.1.0-alpha.24
0.1.0-alpha.23
0.1.0-alpha.22
0.1.0-alpha.21
0.1.0-alpha.20
0.1.0-alpha.19
0.1.0-alpha.18
0.1.0-alpha.17
0.1.0-alpha.16
0.1.0-alpha.15
0.1.0-alpha.14
0.1.0-alpha.13
0.1.0-alpha.12
0.1.0-alpha.11
0.1.0-alpha.10
0.1.0-alpha.9
0.1.0-alpha.8
0.1.0-alpha.7
0.1.0-alpha.6
0.1.0-alpha.5
0.1.0-alpha.4
0.1.0-alpha.3
0.1.0-alpha.2
0.1.0-alpha.1
Accessible and unstyled UI components library written in Elixir and TypeScript that integrates Zag.js state machines into the Phoenix Framework.
Current section
Files
Jump to
Current section
Files
usage-rules/skills/corex-navigation/SKILL.md
---
name: corex-navigation
description: >-
Load when using .navigate with type navigate or patch, .action for buttons,
redirect on select menu combobox listbox pagination, Corex.List.Item.new with
to redirect :href :navigate :patch, language_switch locale paths, or
guides/localize language switcher pattern.
---
# Corex navigation
Three patterns: links, buttons, redirect-on-select.
## Links
```heex
<.navigate to={~p"/dashboard"} type="navigate" class="link link--accent">Dashboard</.navigate>
<.navigate to={~p"/items?page=2"} type="patch" class="link">Page 2</.navigate>
```
## Redirect on select
```heex
<.select id="language-switch" class="select select--sm" items={items} value={[dest]} redirect>
<:item :let={item}>{item.label}</:item>
</.select>
```
```elixir
Corex.List.Item.new(%{value: dest, label: "English", to: dest, redirect: :navigate})
```
Per-item `:redirect` — `:href`, `:patch`, `:navigate`, or `false`. Server logic before navigate → `on_value_change` + `redirect/2` instead.
Full checklist: sub-rule `corex:navigation`.