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-components/SKILL.md
---
name: corex-components
description: >-
Load when adding Corex HEEx in lib/*_web/, registering phx-hooks in app.js,
importing assets/corex/components/*.css, Corex.Content.new Corex.List.new
Corex.Tree.new Corex.Image.new, compound slots with meta: and :let={item},
or accordion combobox dialog timer select tabs. Call MCP list_components and
get_component before guessing attrs or slots.
---
# Corex components
## MCP-first
1. `list_components` → 2. `get_component { id: "<id>" }`
## Data builders
| Builder | Components |
|---------|------------|
| `Corex.Content.new/1` | accordion, tabs |
| `Corex.List.new/1` | select, combobox, menu |
| `Corex.Tree.new/1` | tree-view |
| `Corex.Image.new/2` | carousel |
## Compound slots
```heex
<.accordion id="faq" class="accordion accordion--accent accordion--sm sm:accordion--md" items={Corex.Content.new([…])}>
<:trigger :let={item}>
<.heroicon name={item.meta.icon} />
{item.label}
</:trigger>
</.accordion>
```
Hooks: **PascalCase** (`Accordion`, `Dialog`). Stable `id` required.
Full checklist: sub-rule `corex:components`.