willsprod/ux-fullcalendar

FullCalendar integration for Symfony

1.0.0 2025-08-12 13:41 UTC

Requires

• php: >=8.1
• symfony/config: ^5.4|^6.0|^7.0
• symfony/dependency-injection: ^5.4|^6.0|^7.0
• symfony/http-kernel: ^5.4|^6.0|^7.0
• symfony/stimulus-bundle: ^2.9.1

Requires (Dev)

• symfony/framework-bundle: ^5.4|^6.0|^7.0
• symfony/phpunit-bridge: ^5.4|^6.0|^7.0
• symfony/twig-bundle: ^5.4|^6.0|^7.0
• symfony/var-dumper: ^5.4|^6.0|^7.0

Conflicts

• symfony/flex: <1.13

MIT

• WillsProd

• symfony-ux

README

A modern Symfony UX bundle that simplifies FullCalendar integration with smart plugin management and a clean architecture.

✨ Features

• 🔥 Dynamic loading of FullCalendar plugins
• 🎨 Easy configuration entirely in PHP
• 📱 Native drag & drop with event handling
• 🚀 Perfect Stimulus integration with Symfony UX
• ⚡ Optimized performance - only loads necessary plugins
• 🛠️ Error handling with toast notifications
• 📦 Smart default plugins (dayGrid, timeGrid, interaction)

🚀 Installation

composer require willsprod/ux-fullcalendar

💻 Basic usage

1. In your controller

use WillsProd\UX\FullCalendar\Builder\CalendarBuilderInterface;

#[Route('/calendar', name: 'app_calendar')]
public function calendar(CalendarBuilderInterface $builder): Response
{
    $calendar = $builder->createCalendar("my-calendar");
    
    // Options configuration
    $calendar->setOptions([
        'initialView' => 'timeGridWeek',
        'events' => $this->generateUrl('api_events'),
        'locale' => 'fr',
        'editable' => true,
        'selectable' => true,
    ]);
    
    // Actions for drag & drop events
    $calendar->setEventActions([
        'eventDropUrl' => $this->generateUrl('app_event_drop'),
        'eventResizeUrl' => $this->generateUrl('app_event_resize')
    ]);
    
    return $this->render('calendar/index.html.twig', [
        'calendar' => $calendar
    ]);
}

2. In your twig template

{# templates/calendar/index.html.twig #}
{% extends 'base.html.twig' %}

{% block body %}
    <div class="container">
        <h1>My Calendar</h1>
        {{ render_calendar(calendar) }}
    </div>
{% endblock %}

3. Endpoint API for events

#[Route('/api/events', name: 'api_events')]
public function getEvents(): JsonResponse
{
    return $this->json([
        [
            'id' => 1,
            'title' => 'Meeting',
            'start' => '2025-08-12T10:00:00',
            'end' => '2025-08-12T11:00:00',
        ],
        // ... other events
    ]);
}

🔧 Advanced configuration

Plugin management

// Default plugins : dayGrid, timeGrid, interaction
$calendar = $builder->createCalendar("advanced");

// Add plugins
$calendar->addPlugin('list');
$calendar->addPlugin('rrule');

// Or défine completely
$calendar->setEnabledPlugins(['dayGrid', 'timeGrid', 'list']);

// Check if a plugin is active
if ($calendar->hasPlugin('interaction')) {
    // Your specific configuration
}

Drag & Drop Event Management

#[Route('/event/drop', name: 'app_event_drop', methods: ['POST'])]
public function eventDrop(Request $request): JsonResponse
{
    $data = json_decode($request->getContent(), true);
    
    // Process the event move
    // $data['eventId'], $data['newStart'], $data['newEnd']
    
    return $this->json([
        'success' => true,
        'message' => 'Event successfully moved'
    ]);
}

#[Route('/event/resize', name: 'app_event_resize', methods: ['POST'])]
public function eventResize(Request $request): JsonResponse
{
    $data = json_decode($request->getContent(), true);
    
    // Process resizing
    // $data['eventId'], $data['newStart'], $data['newEnd']
    
    return $this->json([
        'success' => true,
        'message' => 'Event successfully resized'
    ]);
}

Advanced options

$calendar->setOptions([
    'initialView' => 'timeGridWeek',
    'headerToolbar' => [
        'left' => 'prev,next today',
        'center' => 'title',
        'right' => 'dayGridMonth,timeGridWeek,timeGridDay'
    ],
    'locale' => 'fr',
    'timeZone' => 'Europe/Paris',
    'slotMinTime' => '08:00:00',
    'slotMaxTime' => '20:00:00',
    'weekends' => true,
    'nowIndicator' => true,
    'height' => 'auto',
    'buttonText' => [
        'today' => "Aujourd'hui",
        'month' => 'Mois',
        'week' => 'Semaine',
        'day' => 'Jour',
    ]
]);

🎨 Available plugins

Plugin	Description
dayGrid	Classic monthly view
timeGrid	Weekly and daily views with time slots
interaction	Drag & drop, selection, resizing
list	List view
rrule	Support for recurring events

🤝 Contribution

Contributions are welcome! Feel free to:

• 🐛 Report bugs
• 💡 Suggest features
• 📖 Improve the documentation
• 🔧 Submit pull requests

📄 License

This project is licensed under the MIT.

👨‍💻 Author

Created By Willy Natan - Feel free to follow me for more Symfony projects!

⭐ If this bundle helps you with your projects, please give it a star!