Laravel Inertia Toast

Laravel Inertia Toast

Laravel Inertia Toast is a robust package designed to integrate visually appealing toast notifications into Laravel + Inertia.js applications. It offers a fluent PHP API, supports multiple toasts, ensures redirect safety, and provides dedicated adapters for Vue 3 and React.

Key Features

• Fluent PHP API: Easily trigger toast notifications using commands like Toast::success('Saved!') or toast('Profile updated!')->success().
• Frontend Adaptability: Utilize Vue 3 and React adapters with TypeScript support for seamless integration.
• Customizable Positions: Position toasts conveniently with six available placements: top-right, top-left, top-center, bottom-right, bottom-left, and bottom-center.
• Tailwind CSS Compatibility: Tailwind CSS styling support, compatible with versions 3 and 4.
• Client-Side API: Trigger notifications using the useToast() composable/hook on the frontend.
• Smooth Animations: Enjoy elegant entrance and exit animations for toast notifications.

Usage Examples

Server-Side PHP

use InertiaToast\Facades\Toast;

// Triggering toast notifications in a controller
Toast::success('Profile updated!');
Toast::error('Something went wrong.');
Toast::info('Check your email for a confirmation link.');
Toast::warning('Your subscription is about to expire.');

return redirect()->route('dashboard');

Client-Side with Vue 3

<script setup>
import { useToast } from '@laravel-inertia-toast/vue';

const { success } = useToast();

function handleClick() {
  success('Copied to clipboard!');
}
</script>

Client-Side with React

import { useToast } from '@laravel-inertia-toast/react';

function MyComponent() {
  const { success } = useToast();

  return (
    <button onClick={() => success('Copied to clipboard!')}>Copy</button>
  );
}

Additional Information

For a demo, visit the repository's examples showcasing the PHP backend, React, and Vue frontend implementations. The interactive element demonstrates the toast notifications in action, providing users with a hands-on understanding of its capabilities.

Requirements

• PHP 8.1+
• Laravel 10, 11, or 12
• Inertia.js v2.3.3+
• Vue 3.3+ or React 18+
• Tailwind v3 or v4

Integrate Laravel Inertia Toast into your application to enhance user experience with elegant and responsive toast notifications.