Modules
Class-name composition for Shadix components.
A vertically stacked set of collapsible sections, built purely on client-side JS commands and CSS — no LiveView hook and no server round-trip.
Alert component translated from the shadcn-ui "alert" component.
A modal alert dialog for destructive or otherwise consequential confirmations.
Aspect ratio component, translated from the shadcn/ui (new-york-v4) aspect-ratio.
Avatar, translated from the shadcn/ui (new-york-v4) avatar.
A badge styled with the shadcn variant system.
Breadcrumb component, translated from the shadcn/ui breadcrumb component.
A button styled with the shadcn variant/size system.
Card component, translated from the shadcn/ui (new-york-v4) card.
A horizontal carousel built on native CSS scroll-snap and a small LiveView hook.
Checkbox component adapted from shadcn/ui (new-york-v4).
An interactive disclosure that shows or hides a region of content.
A searchable select, built on client-side JS commands, Floating UI, and a small LiveView hook.
A command palette / filterable list adapted from shadcn/ui (new-york-v4).
A right-click context menu built on client-side JS commands, Floating UI, and a small LiveView hook.
A styling and sorting recipe layered over Shadix.Components.Table.
A modal dialog built on client-side JS commands and a small LiveView hook.
A bottom sheet ("drawer") built on client-side JS commands and a small LiveView hook.
A dropdown menu built on client-side JS commands, Floating UI, and a small LiveView hook.
Empty state components, ported from shadcn/ui (new-york-v4) "empty".
A hover-triggered rich card built on client-side JS commands, Floating UI, and a small LiveView hook.
Input component translated from shadcn/ui (new-york-v4).
A segmented one-time-code input.
Kbd component translated from the shadcn-ui "kbd" component.
Label component translated from the shadcn/ui label component.
A horizontal bar of menus, like a desktop application's menubar (File, Edit,
View, ...), built on client-side JS commands, Floating UI, and the
ShadixMenubar LiveView hook (assets/ts/menubar.ts).
A site navigation menu with dropdown panels, built on client-side JS commands, Floating UI, and a small LiveView hook.
Pagination components translated from the shadcn/ui pagination component.
A click-triggered popover with arbitrary content, built on client-side JS commands, Floating UI, and a small LiveView hook.
Progress bar, translated from the shadcn/ui progress component.
Radio group component translated from shadcn/ui (new-york-v4).
Draggable split panes for a two-panel horizontal or vertical layout.
Scroll area component, translated from the shadcn/ui (new-york-v4) scroll-area.
A field-aware select (listbox) built on client-side JS commands, Floating UI,
and the ShadixSelect hook.
A visual separator (divider) between content.
A side panel ("sheet") built on client-side JS commands and a small LiveView hook.
A collapsible application sidebar built from a small set of composable parts.
Skeleton component, translated from the shadcn/ui skeleton component.
Slider component adapted from shadcn/ui (new-york-v4) to a native
<input type="range">.
Toast notifications, the Shadix take on shadcn's sonner integration.
Switch component translated from shadcn/ui (new-york-v4).
A responsive table component, translated from shadcn/ui.
A fully client-driven, uncontrolled tabs component.
Textarea component translated from the shadcn-ui "textarea" component.
Toggle component translated from shadcn/ui (new-york-v4).
Toggle group component translated from shadcn/ui (new-york-v4).
A hover/focus tooltip built on client-side JS commands, Floating UI, and a small LiveView hook.
Form-integration helpers shared by Shadix form controls.
Pure helpers for the Shadix generator tooling.
Loads and resolves Shadix component manifests from priv/registry/*.json.
OTP application for the deployable Shadix docs site (compiled only outside
:prod; wired as the release mod: only when MIX_ENV=docs).
Registry of documented components for the website. Maps a URL slug to the component module/function, its category (for the sidebar), and its doc module.
Builds the HEEx source string shown in the configurator's live code block from the current prop values. Pure string-building — no rendering, no eval. Emits only props that differ from their default (Mantine-style minimal snippets).
Behaviour + demo macro for per-component documentation modules.
Generic documentation page for a single component: live configurator, live
code snippet, curated demos, and an auto-generated props table. The component
to render is chosen by the :slug route param via Catalog.
Server-side HEEx syntax highlighting via makeup_eex's HEEx lexer. The lexer
is looked up from Makeup's registry by name ("heex"), so we don't hardcode its
module. On any lexing error we fall back to HTML-escaped plain text.
Derives configurator controls and props-table rows from a Phoenix function
component's compile-time attr/slot metadata (module.__components__/0).
Phoenix endpoint for the Shadix docs site (compiled only outside :prod). Serves the LiveView pages plus the locally-built CSS/JS bundles.
Minimal error view for the docs site. Renders the plain status message ("Not Found", "Internal Server Error", …) so unknown routes return a clean 404 instead of crashing the error-rendering path.
Landing page for the Shadix docs site: a short hero + install snippet inside
the shared docs chrome (top nav + component sidebar). The per-component pages
live in Shadix.Website.Components.ComponentLive at /components/:slug.
Root HTML layout for the Shadix docs site.
Shared site chrome for the docs website: the sticky top navigation bar and the
left-hand component sidebar. Used by both Shadix.Website.HomeLive and
Shadix.Website.Components.ComponentLive so the two share one header/sidebar.
Raised for an unknown component slug; renders as a 404.
Router for the Shadix docs site (compiled only outside :prod).
Mix Tasks
Copies one or more Shadix components into your Phoenix application,
rewriting Shadix.* module namespaces to match your app.
Reads lib/shadix/cn.ex, lib/shadix/form.ex, and all
lib/shadix/components/*.ex, then writes priv/registry/<name>.json
(one per component, plus one each for cn and form).
Bootstraps Shadix in your Phoenix application by