skills.rest
callcocam
callcocamCOMMUNITY
Explore all skills by this author ā†’
Websiteš•@callcocamGitHub

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
One-click install
npx skills add https://github.com/callcocam/raptor-skils --skill laravel-raptor-page-layouts
Or copy as Structured Prompt for Agentā–¼
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.

Related Skills

Explore More Software Engineering Skillsā†’
jamesulipjamesulip

shadcn-app-shell

Build a persistent Laravel + Inertia + Vue application shell with navigation and CRUD conventions.

Community
Intermediate
incubrainincubrain
78

motion

Automate hardware-accelerated animations in Vue 3 and Nuxt with motion-v.

Official
Intermediate
mgkyawzayyamgkyawzayya
1

fullstack-implementation

Implement end-to-end Laravel 12, Inertia.js, React 19, and TypeScript features.

Community
Advanced
majesticlabs-devmajesticlabs-dev
47

inertia-coder

Set up Inertia.js with Rails and build page components in React, Vue, or Svelte.

Official
Advanced