diff --git a/README.md b/README.md
index bdffcf8..b4ba272 100644
--- a/README.md
+++ b/README.md
@@ -1,33 +1,38 @@
-# The Most Popular JavaScript Calendar integrated with Filament 💛
+# The Most Popular JavaScript Calendar as a Filament Widget 💛
+
+![Monthly Calendar](./art/fullcalendar-widget.png)
[![Latest Version on Packagist](https://img.shields.io/packagist/v/saade/filament-fullcalendar.svg?style=flat-square)](https://packagist.org/packages/saade/filament-fullcalendar)
[![GitHub Tests Action Status](https://img.shields.io/github/workflow/status/saade/filament-fullcalendar/run-tests?label=tests)](https://github.com/saade/filament-fullcalendar/actions?query=workflow%3Arun-tests+branch%3Amain)
[![GitHub Code Style Action Status](https://img.shields.io/github/workflow/status/saade/filament-fullcalendar/Check%20&%20fix%20styling?label=code%20style)](https://github.com/saade/filament-fullcalendar/actions?query=workflow%3A"Check+%26+fix+styling"+branch%3Amain)
[![Total Downloads](https://img.shields.io/packagist/dt/saade/filament-fullcalendar.svg?style=flat-square)](https://packagist.org/packages/saade/filament-fullcalendar)
-This is where your description should go. Limit it to a paragraph or two. Consider adding a small example.
+# Features
-## Support us
+- Accepts all configurations from [FullCalendar](https://fullcalendar.io/docs#toc)
+- Event click and drop events
-[](https://spatie.be/github-ad-click/filament-fullcalendar)
+### Upcoming
+- Modal view when clicking on an event
+- Tailwindcss theme 💙
-We invest a lot of resources into creating [best in class open source packages](https://spatie.be/open-source). You can support us by [buying one of our paid products](https://spatie.be/open-source/support-us).
+
-We highly appreciate you sending us a postcard from your hometown, mentioning which of our package(s) you are using. You'll find our address on [our contact page](https://spatie.be/about-us). We publish all received postcards on [our virtual postcard wall](https://spatie.be/open-source/postcards).
+## Support Filament
-## Installation
+
+
+
-You can install the package via composer:
-```bash
-composer require saade/filament-fullcalendar
-```
+
+
+# Installation
-You can publish and run the migrations with:
+You can install the package via composer:
```bash
-php artisan vendor:publish --tag="filament-fullcalendar-migrations"
-php artisan migrate
+composer require saade/filament-fullcalendar
```
You can publish the config file with:
@@ -39,23 +44,156 @@ php artisan vendor:publish --tag="filament-fullcalendar-config"
This is the contents of the published config file:
```php
+ config('app.timezone'),
+
+ 'locale' => config('app.locale'),
+
+ 'headerToolbar' => [
+ 'left' => 'prev,next today',
+ 'center' => 'title',
+ 'right' => 'dayGridMonth,dayGridWeek,dayGridDay'
+ ],
+
+ 'navLinks' => true,
+
+ 'editable' => true,
+
+ 'dayMaxEvents' => true
];
```
-Optionally, you can publish the views using
+
+
+# Usage
+
+Since the package **does not** automatically add the `FullCalendarWidget` widget to your Filament panel, you are free to extend the widget and customise it yourself.
+
+
+1. First, create a [Filament Widget](https://filamentadmin.com/docs/2.x/admin/dashboard#getting-started):
```bash
-php artisan vendor:publish --tag="filament-fullcalendar-views"
+php artisan make:filament-widget CalendarWidget
+```
+
+> This will create a new `App\Filament\Widgets\CalendarWidget` class in your project.
+
+
+
+2. Your newly created widget should extends the `Saade\FilamentFullCalendar\Widgets\FullCalendarWidget` class of this package
+
+```php
+ 1,
+ 'title' => 'Breakfast!',
+ 'start' => now()
+ ],
+ [
+ 'id' => 2,
+ 'title' => 'Meeting with Pamela',
+ 'start' => now()->addDay(),
+ 'url' => MeetingResource::getUrl('view', ['record' => 2])
+ ]
+ ];
+ }
+}
```
-## Usage
+> You should return an array of FullCalendar [EventObject](https://fullcalendar.io/docs/event-object).
+
+
+
+
+# Configuration
+This is the contents of the default config file.
+
+You can use any property that FullCalendar uses on its root object.
+Please refer to: [FullCalendar Docs](https://fullcalendar.io/docs#toc) to see the available options. It supports all of them, really.
```php
-$filamentFullCalendar = new Saade\FilamentFullCalendar();
-echo $filamentFullCalendar->echoPhrase('Hello, Saade!');
+ config('app.timezone'),
+
+ 'locale' => config('app.locale'),
+
+ 'headerToolbar' => [
+ 'left' => 'prev,next today',
+ 'center' => 'title',
+ 'right' => 'dayGridMonth,dayGridWeek,dayGridDay'
+ ],
+
+ 'navLinks' => true,
+
+ 'editable' => true,
+
+ 'dayMaxEvents' => true
+];
```
+
+
+# Listening for events
+
+The only events supported right now are: [EventClick](https://fullcalendar.io/docs/eventClick) and [EventDrop](https://fullcalendar.io/docs/eventDrop)
+
+They're commented out by default so livewire does not spam requests without they being used. You are free to paste them in your `CalendarWidget` class. See: [FiresEvents](https://github.com/saade/filament-fullcalendar/blob/main/src/Widgets/Concerns/FiresEvents.php)
+
+```php
+/**
+ * Triggered when the user clicks an event.
+ *
+ * Commented out so we can save some requests :) Feel free to extend it.
+ * @see https://fullcalendar.io/docs/eventClick
+ */
+public function onEventClick($event): void
+{
+ //
+}
+
+/**
+ * Triggered when dragging stops and the event has moved to a different day/time.
+ *
+ * Commented out so we can save some requests :) Feel free to extend it.
+ * @see https://fullcalendar.io/docs/eventDrop
+ */
+public function onEventDrop($oldEvent, $newEvent, $relatedEvents): void
+{
+ //
+}
+```
+
+
+
## Testing
```bash
diff --git a/art/fullcalendar-widget.png b/art/fullcalendar-widget.png
new file mode 100644
index 0000000..745dfc3
Binary files /dev/null and b/art/fullcalendar-widget.png differ
diff --git a/art/fullcalendar-widget.png:Zone.Identifier b/art/fullcalendar-widget.png:Zone.Identifier
new file mode 100644
index 0000000..a831910
--- /dev/null
+++ b/art/fullcalendar-widget.png:Zone.Identifier
@@ -0,0 +1,3 @@
+[ZoneTransfer]
+LastWriterPackageFamilyName=Microsoft.ScreenSketch_8wekyb3d8bbwe
+ZoneId=3