laravel-raptor-page-layouts

Generate Laravel, Inertia, and Vue 3 page layouts and UI components.

Updated Mar 19, 2026

Search Tags:#vue #laravel #design-system #composables #inertia #page-layouts

Ready to run

npx skills add https://github.com/callcocam/raptor-skils --skill laravel-raptor-page-layouts

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: laravel-raptor-page-layouts
Source: https://github.com/callcocam/raptor-skils/tree/main/laravel-raptor-page-layouts
Command: npx skills add https://github.com/callcocam/raptor-skils --skill laravel-raptor-page-layouts

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Este Skill facilita a geração de componentes de página reutilizáveis (ListPage, FormPage) e de composables TypeScript para projetos Laravel + Inertia + Vue 3 + Tailwind, partindo de um tema base.

Core Features & Use Cases

Geração de ListPage e FormPage com subcomponentes de suporte (PageShell, PageHeader, PageFilters, PagePagination, PageEmptyState, PageBulkActionBar).
Composables TypeScript para filtros, seleção e ações de página.
Padronização de layouts a partir de um tema de design ou documento de tema, com tokenização de cores, tipografia e espaçamentos.

Quick Start

Crie ou aponte a pasta do tema base (design-system) e inicie a geração dos componentes e da documentação.

Frequently Asked Questions about laravel-raptor-page-layouts

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I generate Laravel Inertia Vue 3 page layouts automatically?▼

You generate Laravel Inertia Vue 3 page layouts by using a theme-driven automation process that outputs Vue components and TypeScript composables into a defined resources/js directory structure without requiring external dependencies.

What is the best way to structure reusable ListPage and FormPage components in Laravel Inertia?▼

The best way to structure reusable ListPage and FormPage components in Laravel Inertia is to generate them with supporting subcomponents like PageShell, PageHeader, and PageFilters alongside TypeScript composables for filters and pagination.

Can I use a base design system to standardize Vue 3 page layouts in Laravel?▼

Yes, you can use a base design system to standardize Vue 3 page layouts in Laravel by tokenizing colors, typography, and spacings from your theme document to enforce consistent styling across generated components.

How do I manage filters and bulk selection in Vue 3 Inertia pages?▼

You manage filters and bulk selection in Vue 3 Inertia pages by utilizing generated TypeScript composables that handle page filters, row selection, and pagination logic alongside a PageBulkActionBar component.

Do I need external dependencies to create Vue 3 composables for Laravel pagination?▼

No, you do not need external dependencies to create Vue 3 composables for Laravel pagination, as the generation process outputs standalone TypeScript composables and components directly into your project.