Docs

Docs

Build Laravel interfaces with code you own

Velyx ships Blade, Alpine.js, and Tailwind CSS components through a registry API. The docs now run inside the same Laravel app that serves the registry, so the product uses its own components.

CLI

Install from the registry

Use the CLI to fetch components, resolve dependencies, and copy files into your Laravel app.

Quick start
Components

Dogfooded UI

Docs pages render with the same Blade components distributed by Velyx.

View button
Registry

One source of truth

Metadata, previews, API responses, and documentation live in one Laravel project boundary.

API index

Available components

37 components
Accordion

Collapsible accordion with animated height via Alpine.js x-collapse. Sub-components: item, trigger, content.

Alert

Composable alert with variants (default, destructive, success, warning, info). Sub-components: title, description, action.

Avatar

Composable avatar with image, fallback initials, badge overlay, and size variants (sm, default, lg).

Avatar Group

Stacked avatar group with negative spacing and optional overflow count.

Badge

Inline badge with variants: default, secondary, destructive, outline, success.

Breadcrumbs

Navigation breadcrumb component with customizable separators and links.

Button

Versatile button with variants (default, destructive, outline, secondary, ghost, link), sizes, icon support (left/right/only), href for anchor rendering, and wire:loading state.

Card

Composable card with header, title, description, content, footer, and action sub-components.

Carousel

Image carousel with autoplay, navigation arrows, dots indicator, and captions.

Checkbox

Accessible checkbox using native input with custom visual layer. Supports wire:model, x-model, disabled and aria-invalid states.

Command Palette

Command palette with keyboard shortcuts, search, and command execution.

Date Picker

Date picker with calendar interface, date formatting, and validation.

Dialog

Accessible modal dialog with backdrop, transition animations, and size options.

Drawer

Slide-out drawer panel with multiple positions and overlay support.

Dropdown Menu

Dropdown menu primitives with groups, labels, items, shortcuts, separators, and nested submenus.

Empty

Composable empty state with header, media (icon/image), title, description and actions.

Field

Composable form field primitives: Field, FieldSet, FieldLegend, FieldGroup, FieldContent, FieldLabel, FieldTitle, FieldDescription, FieldSeparator, FieldError.

File Upload

File upload component with drag-and-drop, image previews, and progress tracking.

Input

Text input primitive with focus ring, aria-invalid state, file input support, and dark mode.

Kbd

Keyboard key component with icon support and multiple variants.

Label

Form label with optional required asterisk and hint text. Aware of disabled peer and group context.

Markdown Viewer

Markdown viewer component rendered as rich prose content.

Popover

Popover component with configurable positioning and trigger options.

Progress Bar

Progress bar component with variants, sizes, and percentage display.

Progress Steps

Progress steps component with clickable steps, labels, and descriptions.

Range Slider

Range slider component with single and double handle modes, custom styling.

Rating

Star rating component with half-star support, hover effects, and value display.

Separator

Visually or semantically separates content, horizontal or vertical.

Skeleton

Animated loading placeholder with pulse animation.

Sortable List

Drag-and-drop sortable list component with handles and animations.

Stepper

Multi-step stepper component with horizontal and vertical layouts.

Table

Composable table primitives with caption, header, body, footer, row, head, and cell.

Tabs

A tabs component with main container and sub-components.

Timeline

Timeline component with vertical/horizontal layouts, animations, and multiple event types.

Toast

Toast notification system with multiple variants, positions, and auto-dismissal.

Toggle

Toggle switch component with multiple sizes and accessibility features.

Tooltip

Tooltip component with configurable positioning and delay settings.