Modules
PhiaUI — a shadcn/ui-inspired component library for Phoenix LiveView.
OTP Application entry-point for PhiaUi.
Native Tailwind CSS class merger for PhiaUi.
ETS-backed cache for memoising resolved Tailwind class strings.
Maps Tailwind CSS utility class tokens to their conflict group.
Phoenix.Presence wrapper for collaborative editing sessions.
GenServer managing a single collaboration room session.
Manages collaboration room lifecycles via DynamicSupervisor.
Top-level supervisor for PhiaUI collaboration infrastructure.
Source of truth for all 829 PhiaUI components.
Accordion component using exclusively Phoenix.LiveView.JS — no JS hooks required.
Specialized action buttons for common UI interaction patterns.
Mobile-style action sheet component — a sliding bottom panel.
Activity feed / audit log component for PhiaUI.
Advanced select components for PhiaUI.
Inline feedback alert for communicating status, errors, and warnings.
Alert Dialog component for critical confirmations requiring explicit user action.
Animated surface components for PhiaUI — 5 components covering rotating border beams, shine effects, cursor-tracked gradients, spotlights, and moving gradient borders.
Animation primitives for PhiaUI — 22 components covering infinite loops, background effects, text effects, entry/scroll animations, interactive hover, counter animations, decorative borders, CSS loaders, and canvas effects.
Application shell layout component providing a full-page grid structure.
Apple App Store and Google Play Store badge buttons.
Arc diagram — pure SVG, zero JS.
Filled area chart — pure SVG, zero JS.
Semantic article component with structured title, meta, lead, body, and footer.
ArticleCard — a blog post / article preview card.
Utility component that maintains a fixed aspect ratio for any child content.
AudioPlayer component for playing audio with play/pause, progress bar and timestamp.
Text input with HTML5 datalist suggestions.
Circular user avatar with automatic image-fallback to initials.
AvatarGroup — an overlapping stack of avatars with built-in overflow badge.
Circular or square profile photo uploader with overlay edit icon.
Floating "back to top" button that appears after scrolling past a threshold.
BackTop component — a floating "scroll to top" button.
Background pattern and decoration components for PhiaUI.
Compact inline label for status indicators, tags, version numbers, and counts.
Month calendar where each day cell can show a small badge count at the top and the day number at the bottom.
Delta badge — a colored pill showing a metric trend with an icon.
Badge + text description combo component.
Full-width page-level feedback banners inspired by Atlassian Design System Banner, Bootstrap Alerts, and GitHub's site-wide announcement banners.
Vertical grouped / stacked / horizontal bar chart — pure SVG, zero JS.
Horizontal bar list — ranks items by value with proportional bars.
Bento grid components for PhiaUI — 4 components for Apple-style modular grid layouts with varying cell spans.
Full-page monthly calendar with colored event pills and a view switcher.
Airbnb-style booking calendar with per-cell availability states.
BottomNavigation component — a fixed bottom tab bar for mobile/PWA apps.
Box-and-whisker plot — pure SVG, zero JS.
Breadcrumb navigation component following the shadcn/ui Breadcrumb anatomy.
XY bubble chart with variable-radius circles — pure SVG, zero JS.
BulkActionBar component for PhiaUI.
Bullet chart — progress toward target with colored range bands — pure SVG, zero JS.
Stateless Button component with 6 variants and 7 sizes.
Groups multiple buttons into a unified bar with shared borders.
Server-rendered calendar component for date selection with keyboard navigation.
Calendar + scrollable time slot picker for date-and-time selection.
Week-view calendar with time axis and absolute-positioned event blocks.
Candlestick chart for financial OHLC data — pure SVG, zero JS.
Composable Card component with 6 independent sub-components.
Carousel component with touch swipe, button navigation, and keyboard support.
Stacked category bar — normalizes values to 100% and renders colored segments.
Chart integration component powered by the PhiaChart vanilla JS hook.
Titled card container for charts and data visualisations.
Chat interface components for PhiaUI.
Native HTML checkbox component styled with Tailwind CSS.
Interactive Chip component for tags, filters, and multi-select interfaces.
Chip-style filter/tag navigation component.
Chord diagram — pure SVG, zero JS.
Circle packing chart — pure SVG, zero JS.
Radial/circular progress indicator rendered as an SVG arc.
Text input with an inline × clear button.
Code display card with filename header, language badge, copy button, and line numbers.
Collaboration Comment Suite — 6 components for rendering and interacting with comments in a collaborative editing context.
Composite collaborative editor widget.
Shared helper functions for collaboration components.
Collaborative notification components for real-time multi-user interfaces.
Composer Suite — 3 components for comment input with @mention support.
Collaborative cursor and selection components for real-time multiplayer UIs.
Helper functions for @mention parsing and rendering.
Collaborative presence components for real-time multi-user interfaces.
Thread Suite — 5 components for managing comment threads in collaborative contexts.
Helper functions for thread management in collaboration components.
Helper functions for document version history and diffing.
Version history components for collaborative document editing.
Collapsible section component using exclusively Phoenix.LiveView.JS — no JS hooks required.
Color picker component with native <input type="color">, optional swatches,
and a live value display.
Color swatch card component for displaying a named color with its hex, RGB, and HSL values, plus an optional one-click copy button.
Combobox component with search/filter for PhiaUI.
Command palette component powered by the PhiaCommand vanilla JavaScript hook.
Command palette (Cmd+K) overlay component.
Blog-style comment with avatar, author, date, body, actions, and nested replies.
Comparison table — feature-by-feature grid for plan/product comparison.
Context menu component triggered by right-click (contextmenu browser event).
Secondary in-page horizontal navigation strip (sub-navigation).
Copy-to-clipboard button component powered by the PhiaCopyButton vanilla JS hook.
Read-only input with an inline copy-to-clipboard button.
Display-only countdown timer widget rendered in two variants.
Call-to-action card: illustration/icon + headline + description + CTA buttons.
DailyAgenda — daily schedule view with a large day header, compact week strip, and an event list with dotted separators.
Dark mode toggle button component powered by the PhiaDarkMode vanilla JS hook.
Leader lines from pie/donut slices to external labels — pure SVG, zero JS.
Sum labels rendered above stacked bar groups — pure SVG, zero JS.
Hover-expanding shape component for chart elements.
SVG annotation overlays for charts — reference lines, bands, and point markers.
Composable SVG axis components for charts.
Crosshair component for chart hover interaction.
Drilldown component for click-to-explore-data pattern.
Error bar component for chart uncertainty visualization.
Composable SVG grid components for charts.
Flexible SVG text label component with 13 positioning modes.
SVG grouping component with z-index convention for chart layering.
Composable chart legend components.
Empty state placeholder for charts — displays when no data is available.
Reusable SVG <defs> building blocks for chart gradients, patterns, and clip paths.
Multi-chart synchronization wrapper.
Chart utilities toolbar.
Chart tooltip components — pre-positioned SVG tooltip shell and HTML tooltip composition.
Range slider for chart data zooming.
Horizontal bar showing positive/negative delta from a center point.
Statistical reference line component for charts.
Data point marker component for charts.
Progress bar with a positioned marker indicator.
CSS aspect-ratio wrapper for responsive charts — zero JS.
Minimal inline chart components for sparkline visualizations.
Status tracker visualization — a row of colored blocks representing status over time.
Color scale legend component for charts.
Composable XY chart container with auto-scaling.
Feature-rich data table with server-side sorting, pagination, toolbar, column visibility toggling, and row selection — all stateless.
All-in-one declarative table — define columns once, render everything.
DateCard component — a single selectable day card showing the day number and short weekday abbreviation.
Form-aware standalone date input component for Phoenix LiveView.
Date picker component that composes Calendar and a popover-style dropdown.
Date range picker with dual-calendar server-side rendering.
Preset date range picker with sidebar shortcuts and a calendar grid.
DateStrip — a horizontal scrollable strip of day cards (week selector).
Date-and-time selection input — styled native <input type="datetime-local">.
Accessible Dialog (Modal) component following the WAI-ARIA Dialog pattern.
Text direction utility component for LTR and RTL content.
Vertical activity timeline for document edit history.
Connection status indicator for real-time collaboration.
Overlapping avatar stack showing online collaborators (Google Docs-style).
macOS-style icon dock navigation component.
Document-specific upload dropzone with file-type icons.
Donut chart with a center slot — pure SVG, zero JS.
Dot-style page indicator navigation component.
Dot plot — pure SVG, zero JS.
Draggable tree hierarchy components for PhiaUI.
Drawer component — a sliding panel that enters from any edge of the screen.
Drop zone and drag transfer list components for PhiaUI.
Dropdown menu component with smart positioning, click-outside detection, and full WAI-ARIA keyboard navigation.
Dumbbell chart — pure SVG, zero JS.
Inline-editable field component — click to edit, Enter to submit, Escape to cancel.
Editor Suite — 19 components for building rich text editing experiences.
Editor Academic Suite — 6 components for academic and scholarly writing tools.
Editor Advanced Block Components — 5 specialized blocks for power-user editing workflows: synced (reusable) blocks, multi-column layouts with drag-resize dividers, executable code sandboxes, A4 page containers, and page header/footer chrome.
AI Assistant Suite — 10 components for integrating AI capabilities into the PhiaUI rich text editor.
Editor Block Control Components — 4 components for manipulating, converting, and reordering content blocks within a rich text editor.
Editor Block Components — 9 structural block primitives for rich text editors.
Editor Content Block Components — 14 rich content blocks for embedding interactive and media elements inside a rich text editor.
Document Shell Suite — 6 components for building full-page document editors.
Pure Elixir utilities for working with editor JSON content.
Export Suite — 6 components for importing, exporting, and printing editor content.
Extensions Suite — 10 components for extending the PhiaUI rich text editor with plugins, emoji, special characters, and block-level controls.
Editor Formatting Suite — 16 components for text formatting controls.
Pre-composed formatting toolbars — 4 components for common toolbar layouts.
Language Tools Suite — 4 components for grammar checking, spell check control, and custom dictionary management within the PhiaUI rich text editor.
Editor Media Block Components — 9 rich media blocks for embedding images, tables, equations, attachments, diagrams, and drawings inside a rich text editor.
Editor Presets — 10 pre-composed editor configurations for common use cases.
Editor References Suite — 8 components for footnotes, citations, bookmarks, cross-references, bibliographies, and abbreviations.
Rich Editor Suite — 8 components for building rich text editing experiences with Phoenix LiveView.
Editor Search & Navigation Suite — 6 components for document search, outline navigation, keyboard shortcuts, and minimap visualization.
Text Direction Suite — 2 components for bidirectional (BiDi) text support in the PhiaUI rich text editor.
TipTap Editor Suite — 8 components for building ProseMirror-powered rich text editing experiences with Phoenix LiveView.
Pure Elixir utilities for working with TipTap JSON content.
Track Changes Suite — 7 components for document revision tracking and collaboration.
Editor Writing Tools Suite — 8 components for writing productivity, readability analysis, focus mode, voice input, text-to-speech, statistics, and grammar checking.
Editor highlight (realce) color picker with curated academic-friendly colors.
Empty state component for displaying when a list, table, or view has no data.
Structured error display components for showing application errors, API failures, and standard HTTP error pages.
Full-month event calendar with colored event badges per day.
Card component for displaying an event with a colored date badge, time, location, attendee avatar stack, and optional actions slot.
Expandable table rows with collapsible detail panels.
Visually enhanced button variants for hero sections, landing pages, and attention-grabbing CTAs.
Icon + title + description — the standard landing page feature block.
Micro-feedback collection components for gathering quick user feedback without interrupting the user's workflow.
Standalone field layout primitives for composing form fields without Phoenix.HTML.FormField.
File attachment card with type-based icon and color coding.
File upload component for PhiaUI.
FilterBar component for PhiaUI.
FilterBuilder component for PhiaUI.
Floating Action Button (FAB) component with optional speed-dial.
Floating pill navigation bar — fixed or sticky pill anchored to the viewport.
Form Integration Components for Phoenix LiveView.
Composable form field wrapper for Phoenix LiveView.
Form layout structure components for grouping, organizing, and collecting feedback within complex forms.
Selection group components: multi-checkbox groups, card-style radio groups, cascading selects, and dual-panel transfer lists.
Full-viewport drop overlay that appears when the user drags files over the browser window.
Funnel chart — visualizes stage-by-stage drop-off in a conversion pipeline.
Week-view calendar (Google Calendar style) with hourly time slots.
Semi-circular (180°) SVG gauge chart.
Glass and frosted-surface components for PhiaUI — 5 components covering glassmorphism, acrylic noise textures, Apple Liquid Glass, and neon glow effects.
Global message component for top-center auto-dismissing feedback messages.
Heatmap calendar grid component for PhiaUI.
Two-dimensional color-coded grid heatmap — pure SVG, zero JS.
Frequency distribution histogram — pure SVG, zero JS.
HoverCard component — a rich floating panel revealed on hover with configurable delays.
Icicle chart — pure SVG, zero JS.
Inline SVG icon component backed by a Lucide icon sprite file.
Icon-only button with a required accessible label and an optional CSS tooltip.
Hero image (top-cover) + card content below.
Image comparison slider — drag to reveal before/after images.
Multi-image upload with a grid thumbnail gallery.
Image upload component for PhiaUI.
Inline-editable table row components for in-place data editing.
Expandable search — collapses to an icon button, expands to a full input.
Form-aware text input component integrating with Phoenix.HTML.FormField.
InputAddon component — wraps an input with optional prefix and suffix decorators.
Horizontal group of connected inputs sharing a unified border.
One-time password (OTP) input component with individual digit slots.
Versatile list item component with media, title, description, and trailing actions.
Kanban board component for PhiaUI.
Keyboard shortcut display component.
Accessible label component for form inputs.
Semantic HTML wrapper component with configurable element tag.
Centers content both horizontally and vertically.
Max-width content constrainer with responsive size presets.
Container query wrapper component.
Full-bleed image or video background with content overlay.
Semantic <dl>/<dt>/<dd> key-value display component.
Enhanced separator with optional centered text label.
Fixed-positioned bar anchored to the top or bottom of the viewport.
Full flexbox control component.
CSS Grid container with column, row, gap and auto-flow control.
CSS columns masonry grid — items flow top-to-bottom in columns like a
Pinterest board or photo wall.
Classic media-object layout: a fixed media element (image/icon/avatar) alongside a flexible body content block.
Vertical navigation list with groups, icons, nested subnav, and active state.
Page title bar with breadcrumb, title, description, and actions slots.
Full-page layout composition: header / pane (sidebar) / main / footer slots.
A responsive flex stack that switches from vertical (column) on mobile to horizontal (row) at a configurable breakpoint.
Responsive visibility components for declaratively showing or hiding content at specific breakpoints.
Semantic <section> wrapper with size-based vertical padding.
Section-ending divider with action row.
Section heading with optional description and action area.
Auto-responsive equal-width grid — no manual breakpoints required.
Flex spacer that grows to fill remaining space in a flex container.
Two-column layout: a fixed-width pane alongside flexible main content.
Vertical or horizontal flex stack with consistent gap.
Sticky-positioned container that adheres to the top or bottom of the viewport as the user scrolls.
Flex-wrap container for tags, chips, and button groups.
Leaderboard — ranked list with medals, avatars, metrics, and delta badges.
Modal image/video gallery with keyboard navigation and touch swipe.
Single / multi-series line chart — pure SVG, zero JS.
Organized footer / help-column navigation links.
Card component for displaying an Open Graph-style link preview with a title, description, image, favicon, site name, and extracted domain.
Loading state components for blocking operations, animated loaders, and top-of-page progress indicators.
Lollipop chart — pure SVG, zero JS.
Point-of-interest indicator positioned absolutely on images or maps.
Marketing page section components.
Grid section for displaying feature cards with heading and description.
Structured hero section with heading, subheading, CTA buttons, and optional media.
Full-width mega menu navigation component.
Mention input component for PhiaUI.
Menubar component — a horizontal bar of menus for application-level navigation.
Meter group — a labeled collection of progress meters.
Responsive CSS Grid wrapper for stat_card/1 KPI widgets.
Mobile hamburger button that toggles the sidebar via Phoenix.LiveView.JS.
Month selection input — styled native <input type="month">.
Multi-select drag-and-drop list component for PhiaUI.
Airbnb-style multi-month calendar showing 2 or 3 months side by side.
Multi-select form component for Phoenix LiveView.
A full-month calendar grid where multiple individual (non-contiguous) dates can be toggled on/off.
Styled native <select> wrapper without Phoenix.HTML.FormField dependency.
Versatile navigation link component (Mantine-style).
Material Design 3-style icon-strip sidebar navigation rail.
Horizontal navigation menu with optional dropdown panels.
Rich in-app notification components inspired by Ant Design Notification, Mantine Notifications, and Atlassian Flag system.
Notification/alert card with type-based color coding and dismiss support.
Net Promoter Score widget — SVG half-circle arc gauge + breakdown bars.
Numeric stepper input component with optional prefix/suffix and form integration.
Overlay surface components for PhiaUI — 6 components for scrims, image overlays, gradient overlays, spotlights, and bottom sheets.
Reading progress bar fixed at the top or bottom of the page.
Pagination navigation component for paginating large data sets.
Pareto chart — pure SVG, zero JS.
Parliament chart — pure SVG, zero JS.
Password input with a visibility toggle button.
Form-aware standalone input component for Phoenix LiveView.
Phone number input with a country dial-code prefix selector.
Pictogram chart — pure SVG, zero JS.
Pie chart with arc-path slices — pure SVG, zero JS.
Cross-tabulation (pivot) table — rows × columns matrix display.
Polar area chart — pure SVG, zero JS.
Popconfirm — inline confirmation popup attached to a trigger element.
Popover component powered by the PhiaPopover vanilla JavaScript hook.
Pricing plan card for displaying subscription tiers.
E-commerce product card with image, rating, pricing, and add-to-cart action.
ProfileCard — a user profile display card with avatar, name, role, online status, and composable slots.
Linear progress bar for displaying completion of a task or process.
Card component that displays a titled progress bar with optional description, value label, variant coloring, size, icon slot, and footer slot.
Enhanced progress components extending the basic Progress component with
labeled, multi-segment, quota, and step-based variants.
QrCode component — server-side SVG QR code generation.
Spider / radar chart — pure SVG, zero JS.
Radial bar chart with concentric arc rings — pure SVG, zero JS.
Mutually-exclusive radio button group component for Phoenix LiveView.
A full-month calendar grid with range selection visualised as a continuous band.
Star Rating component for PhiaUI.
Ticket/receipt styled card with a perforated CSS divider.
Drag-to-resize split panel component.
Horizontally scrollable table with responsive data-label field metadata.
Result state — centered page-level feedback with icon, title, description, and actions.
Rich text editor component for PhiaUI.
Ridgeline chart (joy plot) — pure SVG, zero JS.
Sankey flow diagram — pure SVG, zero JS.
XY scatter chart — pure SVG, zero JS.
ScheduleEventCard component — an event card with a colored left border, title, date/time range, optional avatar group, and a category badge.
Calendly-style availability schedule grid.
ScrollArea component — a styled, accessible scrollable container. Zero JavaScript.
Search input component with icon, optional clear button, and shortcut badge.
Segmented control component for Phoenix LiveView.
Native HTML select form component for Phoenix LiveView.
SelectableCard component — a card that acts as a radio button for visually rich option selection.
Thin divider line for separating content regions.
Sheet component — a sliding side panel that enters from any edge of the screen.
Full-height application shell with a responsive sidebar and topbar.
Sidebar navigation component with brand area, scrollable nav, and pinned footer.
Animated loading placeholder components (shimmer / skeleton screens).
Range slider component for continuous numeric value selection.
Slope chart — before/after comparison with diagonal lines — pure SVG, zero JS.
Smart and interactive input components for PhiaUI.
Floating bottom action bar for bulk-selection feedback.
Platform-branded OAuth / social sign-in buttons.
Sonner-style toast notification component powered by the PhiaSonner vanilla
JavaScript hook.
Sortable drag-and-drop list components for PhiaUI.
Sortable grid drag-and-drop components for PhiaUI.
Compact metric card with an inline SVG sparkline.
Special entry input components for PhiaUI.
Specialized form input components: currency, masked input, two-thumb range slider, signature pad, floating labels, swatch picker, form stepper, and country selector.
Floating Action Button (FAB) speed dial component.
Animated loading spinner component.
Split button: primary action (left) + dropdown caret (right).
Dashboard KPI widget built on top of the Card and Badge primitives.
Status indicator components for displaying live system status, user presence, connection state, and service health.
Multi-step progress indicator (stepper / wizard) component.
Visual step progress indicator for onboarding, checkout, and wizard flows.
Duolingo/Fitbit-style habit streak calendar.
Stream graph (ThemeRiver) — pure SVG, zero JS.
Sunburst chart for hierarchical data — pure SVG, zero JS.
Surface primitives for PhiaUI — 5 components covering elevation, tonality, inset depth, scrollable containers, and tonal color layers.
Accessible on/off switch component for Phoenix LiveView.
Composable table component following the shadcn/ui anatomy.
Grouped table body with a sticky-ish group header row.
Loading skeleton, empty state, and error state for table components.
Accessible content-switching Tabs component — fully server-rendered.
Horizontal tab navigation component for page-level and section-level routing.
Removable tag component with dot indicator and close button.
Tags input component for PhiaUI.
TeamCard — displays a team member with avatar, name, role, department, email, and optional badge/action slots.
TestimonialCard — a customer quote card with author info, optional star rating, and three layout variants.
Multi-line textarea form component for Phoenix LiveView.
Textarea with a character counter and optional max-length enforcement.
Enhanced textarea components for PhiaUI.
Scoped CSS theme provider using a CSS-first, data-attribute approach.
Thumbnail navigation strip for image galleries and slideshows.
Time selection input — styled native <input type="time">.
TimeSliderPicker — horizontal time ruler/scrubber display.
TimeSlotGrid component — a responsive grid of time-slot buttons for appointment booking.
TimeSlotList component — a vertical scrollable list of time slots with an optional AM/PM toggle.
Vertical timeline / activity feed component.
Horizontal event timeline — pure SVG, zero JS.
Timeline / activity log display component.
Toast notification component powered by the PhiaToast vanilla JavaScript hook.
Sticky table of contents with scroll-spy via IntersectionObserver.
Pressable toggle button component with aria-pressed semantics.
Coordinated group of toggle buttons for single or multi-select interactions.
Toolbar component — a horizontal row of action buttons with separators and groups.
Tooltip component powered by the PhiaTooltip vanilla JavaScript hook.
Standalone sticky top navigation bar (h-14, border-b, bg-background).
Tree component for displaying hierarchical data with expandable/collapsible nodes.
Enhanced tree view components for PhiaUI.
Hierarchical treemap with squarified tile layout — pure SVG, zero JS.
Typography primitives for PhiaUI — 18 components covering headings, text, code, lists, and prose containers.
Dot/dash leader fill between two inline elements.
Number input with a semantic unit prefix or suffix.
Button-style file picker — triggers the file dialog without a drop zone.
Card for displaying a completed file upload.
Standalone upload progress component with status states.
Ordered upload queue showing per-file progress for multiple entries.
Uptime status bar — a row of colored segments indicating service health over time.
URL input with a lockable protocol prefix selector.
General-purpose utility display components for PhiaUI.
Vertical navigation component for sidebars and side panels.
HTML5 video player with custom controls and aspect ratio support.
Violin plot showing kernel density estimation distributions — pure SVG, zero JS.
Waffle chart — pure SVG, zero JS.
Waterfall chart — cumulative positive/negative bars — pure SVG, zero JS.
Watermark — repeating text overlay using an inline SVG <pattern>.
WeekCalendar — compact week navigator with prev/next header and day strip.
WeekDayPicker — a compact horizontal day-of-week selector.
Week selection input — styled native <input type="week">.
Drum roll / iOS-style scroll wheel picker component.
Word cloud chart — pure SVG, zero JS.
Year selection input — styled <input type="number"> scoped to year ranges.
Behaviour for AI-powered editor operations.
Default no-op AI bridge implementation.
Pure Elixir utilities for formatting citations and parsing BibTeX.
Phoenix Channel for Yjs collaborative editing via TipTap.
GenServer managing a single collaborative document via Operational Transform.
Pure Elixir helpers for converting editor JSON documents to and from various text formats.
Pure Elixir Operational Transform (OT) engine for collaborative text editing.
Shared helpers for converting per-breakpoint responsive maps into Tailwind CSS class strings.
Static linter that enforces the PhiaUI theming contract on component templates.
Theme definition struct and API for PhiaUI.
Generates CSS custom property declarations from a %PhiaUi.Theme{} struct.
The Blue color preset — enterprise blue with a vibrant primary.
Green preset — success green.
Neutral preset — pure grey.
Orange preset — energetic orange.
The Rose color preset — modern rose/pink, warm and expressive.
The Slate color preset — cool blue-grey.
Violet preset — premium violet.
The Zinc color preset — neutral dark, the shadcn/ui default.
Command-pattern undo/redo stack for scene operations.
Converts node layout properties to Tailwind CSS v4 classes.
Represents a single node in the design canvas scene graph.
Save and load design scenes to/from .phia.json files.
ETS-backed scene graph for the design canvas.
Manages selection state for the design canvas.
Variable/token system for the PhiaUI Design canvas.
GenServer that caches introspected component data in ETS for fast access. Refreshes on demand.
Detects composable component families by analyzing which components share the same module and have naming prefix patterns.
Introspects Phoenix component modules to extract attrs, slots, and metadata.
Formats Elixir values for HEEx template attributes.
Converts a scene graph into a valid HEEx template string.
Generates a complete Phoenix LiveView module source string from a scene graph.
Execute multiple design operations atomically with bindings and rollback.
Pattern-based search and batch retrieval of nodes from the scene graph.
MCP (Model Context Protocol) server for Claude Code integration.
Computes approximate bounding boxes from layout properties.
Defines all MCP tool specifications with JSON Schema input definitions.
Implements all 15 MCP tool handlers for the PhiaUI Design server.
Pre-built page scaffolds for the PhiaUI Design editor.
Role-based defaults for components used in page templates.
Renders real PhiaUI components dynamically for the design canvas.
Main LiveView for the PhiaUI Design visual editor.
Phoenix Endpoint for the PhiaUI Design tool.
Inline layout module for the PhiaUI Design tool.
Router for the PhiaUI Design tool.
Mix Tasks
Ejects a PhiaUI component into the current Phoenix project as an editable source file.
Starts the PhiaUI Design tool — a visual component editor.
Analyze a saved PhiaUI design file.
Export a saved PhiaUI design to HEEx or LiveView source files.
Starts the PhiaUI Design MCP server for Claude Code integration.
Generates the Lucide SVG sprite used by PhiaUi.Components.Icon.
Sets up PhiaUI in the current Phoenix project.
Manage PhiaUI color theme presets from the command line.
Removes all DaisyUI references from a Phoenix LiveView project.