# shadix v0.0.1 - Table of Contents

> shadcn-style copy-paste UI components for Phoenix LiveView

## Pages

- [Shadix](readme.md)

## Modules

- [Shadix](Shadix.md): Documentation for `Shadix`.

- [Shadix.Cn](Shadix.Cn.md): Class-name composition for Shadix components.
- [Shadix.Components.Accordion](Shadix.Components.Accordion.md): A vertically stacked set of collapsible sections, built purely on client-side
JS commands and CSS — no LiveView hook and no server round-trip.
- [Shadix.Components.Alert](Shadix.Components.Alert.md): Alert component translated from the shadcn-ui "alert" component.
- [Shadix.Components.AlertDialog](Shadix.Components.AlertDialog.md): A modal alert dialog for destructive or otherwise consequential confirmations.
- [Shadix.Components.AspectRatio](Shadix.Components.AspectRatio.md): Aspect ratio component, translated from the shadcn/ui (new-york-v4) aspect-ratio.
- [Shadix.Components.Avatar](Shadix.Components.Avatar.md): Avatar, translated from the shadcn/ui (new-york-v4) avatar.
- [Shadix.Components.Badge](Shadix.Components.Badge.md): A badge styled with the shadcn variant system.
- [Shadix.Components.Breadcrumb](Shadix.Components.Breadcrumb.md): Breadcrumb component, translated from the shadcn/ui `breadcrumb` component.
- [Shadix.Components.Button](Shadix.Components.Button.md): A button styled with the shadcn variant/size system.
- [Shadix.Components.Card](Shadix.Components.Card.md): Card component, translated from the shadcn/ui (new-york-v4) card.
- [Shadix.Components.Carousel](Shadix.Components.Carousel.md): A horizontal carousel built on native CSS scroll-snap and a small LiveView hook.
- [Shadix.Components.Checkbox](Shadix.Components.Checkbox.md): Checkbox component adapted from shadcn/ui (new-york-v4).
- [Shadix.Components.Collapsible](Shadix.Components.Collapsible.md): An interactive disclosure that shows or hides a region of content.
- [Shadix.Components.Combobox](Shadix.Components.Combobox.md): A searchable select, built on client-side JS commands, Floating UI, and a small
LiveView hook.
- [Shadix.Components.Command](Shadix.Components.Command.md): A command palette / filterable list adapted from shadcn/ui (new-york-v4).
- [Shadix.Components.ContextMenu](Shadix.Components.ContextMenu.md): A right-click context menu built on client-side JS commands, Floating UI, and a
small LiveView hook.
- [Shadix.Components.DataTable](Shadix.Components.DataTable.md): A styling and sorting **recipe** layered over `Shadix.Components.Table`.
- [Shadix.Components.Dialog](Shadix.Components.Dialog.md): A modal dialog built on client-side JS commands and a small LiveView hook.
- [Shadix.Components.Drawer](Shadix.Components.Drawer.md): A bottom sheet ("drawer") built on client-side JS commands and a small
LiveView hook.
- [Shadix.Components.DropdownMenu](Shadix.Components.DropdownMenu.md): A dropdown menu built on client-side JS commands, Floating UI, and a small
LiveView hook.
- [Shadix.Components.Empty](Shadix.Components.Empty.md): Empty state components, ported from shadcn/ui (new-york-v4) "empty".
- [Shadix.Components.HoverCard](Shadix.Components.HoverCard.md): A hover-triggered rich card built on client-side JS commands, Floating UI, and
a small LiveView hook.
- [Shadix.Components.Input](Shadix.Components.Input.md): Input component translated from shadcn/ui (new-york-v4).
- [Shadix.Components.InputOtp](Shadix.Components.InputOtp.md): A segmented one-time-code input.
- [Shadix.Components.Kbd](Shadix.Components.Kbd.md): Kbd component translated from the shadcn-ui "kbd" component.
- [Shadix.Components.Label](Shadix.Components.Label.md): Label component translated from the shadcn/ui `label` component.
- [Shadix.Components.Menubar](Shadix.Components.Menubar.md): 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).
- [Shadix.Components.NavigationMenu](Shadix.Components.NavigationMenu.md): A site navigation menu with dropdown panels, built on client-side JS commands,
Floating UI, and a small LiveView hook.
- [Shadix.Components.Pagination](Shadix.Components.Pagination.md): Pagination components translated from the shadcn/ui `pagination` component.
- [Shadix.Components.Popover](Shadix.Components.Popover.md): A click-triggered popover with arbitrary content, built on client-side JS
commands, Floating UI, and a small LiveView hook.
- [Shadix.Components.Progress](Shadix.Components.Progress.md): Progress bar, translated from the shadcn/ui `progress` component.
- [Shadix.Components.RadioGroup](Shadix.Components.RadioGroup.md): Radio group component translated from shadcn/ui (new-york-v4).
- [Shadix.Components.Resizable](Shadix.Components.Resizable.md): Draggable split panes for a two-panel horizontal or vertical layout.
- [Shadix.Components.ScrollArea](Shadix.Components.ScrollArea.md): Scroll area component, translated from the shadcn/ui (new-york-v4) scroll-area.
- [Shadix.Components.Select](Shadix.Components.Select.md): A field-aware select (listbox) built on client-side JS commands, Floating UI,
and the `ShadixSelect` hook.
- [Shadix.Components.Separator](Shadix.Components.Separator.md): A visual separator (divider) between content.
- [Shadix.Components.Sheet](Shadix.Components.Sheet.md): A side panel ("sheet") built on client-side JS commands and a small LiveView hook.
- [Shadix.Components.Sidebar](Shadix.Components.Sidebar.md): A collapsible application sidebar built from a small set of composable parts.
- [Shadix.Components.Skeleton](Shadix.Components.Skeleton.md): Skeleton component, translated from the shadcn/ui `skeleton` component.
- [Shadix.Components.Slider](Shadix.Components.Slider.md): Slider component adapted from shadcn/ui (new-york-v4) to a native
`<input type="range">`.
- [Shadix.Components.Sonner](Shadix.Components.Sonner.md): Toast notifications, the Shadix take on shadcn's `sonner` integration.
- [Shadix.Components.Switch](Shadix.Components.Switch.md): Switch component translated from shadcn/ui (new-york-v4).
- [Shadix.Components.Table](Shadix.Components.Table.md): A responsive table component, translated from shadcn/ui.
- [Shadix.Components.Tabs](Shadix.Components.Tabs.md): A fully client-driven, uncontrolled tabs component.
- [Shadix.Components.Textarea](Shadix.Components.Textarea.md): Textarea component translated from the shadcn-ui "textarea" component.
- [Shadix.Components.Toggle](Shadix.Components.Toggle.md): Toggle component translated from shadcn/ui (new-york-v4).
- [Shadix.Components.ToggleGroup](Shadix.Components.ToggleGroup.md): Toggle group component translated from shadcn/ui (new-york-v4).
- [Shadix.Components.Tooltip](Shadix.Components.Tooltip.md): A hover/focus tooltip built on client-side JS commands, Floating UI, and a
small LiveView hook.
- [Shadix.Form](Shadix.Form.md): Form-integration helpers shared by Shadix form controls.
- [Shadix.Generator](Shadix.Generator.md): Pure helpers for the Shadix generator tooling.
- [Shadix.Registry](Shadix.Registry.md): Loads and resolves Shadix component manifests from `priv/registry/*.json`.
- [Shadix.Website.Application](Shadix.Website.Application.md): OTP application for the deployable Shadix docs site (compiled only outside
`:prod`; wired as the release `mod:` only when `MIX_ENV=docs`).
- [Shadix.Website.Components.Catalog](Shadix.Website.Components.Catalog.md): 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.
- [Shadix.Website.Components.CodeGen](Shadix.Website.Components.CodeGen.md): 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).

- [Shadix.Website.Components.ComponentDoc](Shadix.Website.Components.ComponentDoc.md): Behaviour + `demo` macro for per-component documentation modules.
- [Shadix.Website.Components.ComponentLive](Shadix.Website.Components.ComponentLive.md): 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`.

- [Shadix.Website.Components.Highlight](Shadix.Website.Components.Highlight.md): 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.
- [Shadix.Website.Components.Introspect](Shadix.Website.Components.Introspect.md): Derives configurator controls and props-table rows from a Phoenix function
component's compile-time attr/slot metadata (`module.__components__/0`).
- [Shadix.Website.Endpoint](Shadix.Website.Endpoint.md): Phoenix endpoint for the Shadix docs site (compiled only outside :prod).
Serves the LiveView pages plus the locally-built CSS/JS bundles.

- [Shadix.Website.ErrorHTML](Shadix.Website.ErrorHTML.md): 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.

- [Shadix.Website.HomeLive](Shadix.Website.HomeLive.md): 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`.

- [Shadix.Website.Layout](Shadix.Website.Layout.md): Root HTML layout for the Shadix docs site.
- [Shadix.Website.Nav](Shadix.Website.Nav.md): 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.
- [Shadix.Website.Router](Shadix.Website.Router.md): Router for the Shadix docs site (compiled only outside :prod).

- Exceptions
  - [Shadix.Website.NotFoundError](Shadix.Website.NotFoundError.md): Raised for an unknown component slug; renders as a 404.

## Mix Tasks

- [mix shadix.add](Mix.Tasks.Shadix.Add.md): Copies one or more Shadix components into your Phoenix application,
rewriting `Shadix.*` module namespaces to match your app.
- [mix shadix.gen.registry](Mix.Tasks.Shadix.Gen.Registry.md): 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`).
- [mix shadix.init](Mix.Tasks.Shadix.Init.md): Bootstraps Shadix in your Phoenix application by

