- How do I install the Jetax design system in a Laravel 12 application?
- Require the package with Composer using jksantos/jetax, then run Jetax's installer command, which publishes the sidebar, topbar, workspace and 60+ Blade/Livewire components. Tailwind CSS 4 must already be configured with @tailwindcss/vite before installing, because every component depends on Tailwind 4 utilities and theme tokens. Alpine.js is loaded automatically through @livewireScripts, so there is no extra JavaScript setup.
- Which Laravel, Livewire, PHP and Tailwind versions does Jetax require?
- Jetax requires PHP 8.4+, Laravel 12+, Livewire 4+, Tailwind CSS 4+, Alpine.js 3+ and Vite 5+. Tailwind 4 is mandatory and there is no Tailwind 3 fallback, so upgrading Tailwind is a hard prerequisite. Alpine 3 arrives bundled with Livewire, leaving Tailwind via the Vite plugin as the main dependency you configure yourself.
- Does Jetax support dark mode out of the box?
- Yes. Dark mode is class-based and persisted with Alpine.js, and the package ships an anti-FOUC script so the wrong theme never flashes on page load. Version 4.0.0 replaced hardcoded palette literals with theme tokens such as bg-surface-container-lowest and text-outline-variant, keeping offcanvas, rating, toast, tooltip and upload components consistent across themes.
- How do I customize Jetax components, config and assets?
- Everything is publishable: run vendor:publish to copy Blade views, config files and assets into your application and edit them freely. Publishing is granular, so you can override only the components you need while the rest keep receiving package updates. For deeper theming, such as fonts beyond Manrope and Inter, you still need manual CSS overrides.
- What breaks when upgrading Jetax from 3.x to 4.0.0?
- Version 4.0.0 is a visual release: 19 breaking items change default appearance and behavior, yet no SIZES, STYLES, COLORS or GLYPH_SIZES keys were removed, so it is a pixel-level break rather than an API break. Expect shifts in button heights, input, select and textarea radii and padding, card and table borders, badge rounding, modal widths, pagination button sizes, and the layout widths (sidebar w-64 to w-[246px], topbar sidebar-width 16rem to 246px). Grep your app for w-64, 16rem, 256px, max-w-xl, max-w-4xl, border-2 and rounded-full before upgrading, then re-run snapshot or E2E visual tests and manual QA.
- Does Jetax work with Inertia.js, Vue or React?
- No. Jetax is an opinionated TALL Stack design system built on Tailwind, Alpine, Laravel and Livewire, and there is no Inertia.js support. Its 60+ components are Blade and Livewire components using props, attributes and slots, so they do not apply to Vue or React single-file components.
- How do I change the typography in Jetax from Manrope and Inter?
- Jetax ships Manrope for headlines and Inter for body text as part of its design tokens and Tailwind theme setup. Font theming is not exposed as a first-class config option, so switching typefaces requires publishing assets and applying manual CSS overrides on the token layer. Update the font families in your Tailwind theme and load the new fonts through Vite.
- How do I add icons inside Jetax components?
- Jetax uses Material Symbols Outlined and exposes an x-jetax-icon Blade component. Use it anywhere in your views, including inside the sidebar and topbar, passing the icon name as an attribute. Make sure the Material Symbols stylesheet or font is loaded in your layout or the glyphs will not render.
- How does Jetax handle invalid component prop values, and how do I test for them?
- Enumerated props such as state, text-case, size, bordered and flush all follow one rule: an exception is thrown in local and testing environments, and a Log::warning fallback is used everywhere else. Your test suite therefore catches typos loudly while production degrades gracefully instead of crashing. Add a log alert on that channel in production so silent enum fallbacks do not go unnoticed.
- Is Jetax ready for production use on a new Laravel project?
- For greenfield Laravel 12+ apps running Livewire 4, Tailwind 4 and Vite 5, feasibility is high: the component contract is stable, dark mode is native, and publishing is granular. Existing 3.x adopters face a medium-effort migration because 4.0.0 changes default visuals and layout widths even though no public keys were removed. Remember that Jetax is a design system rather than an admin panel generator, so you still compose your own pages and forms from the published components.