attempting to add events

nicegui/elements/fullcalendar.js

@@ -1,31 +1,26 @@
-// fullcalendar.js
-import FullCalendar from './lib/fullcalendar/index.global.min.js';
 export default {
-    template: "<div></div>",
-    props: {
-      eventsData: Array,
-      elementId: String,
-    },
-    mounted() {
-      this.renderFullCalendar();
-    },
-    methods: {
-      renderFullCalendar() {
-        var calendarEl = this.$el;
-  
-        if (calendarEl) {
-          window.calendarInstance = new FullCalendar.Calendar(calendarEl, {
-            initialView: 'timeGridWeek',
-            slotMinTime: "05:00:00",
-            slotMaxTime: "22:00:00",
-            allDaySlot: false,
-            timeZone: 'local',
-            height: 'auto',
-            events: this.eventsData,
-          });
-  
-          window.calendarInstance.render();
-        }
-      },
-    },
-  };
+  template: "<div></div>",
+  props: {
+    eventsData: Array,
+  },
+  mounted() {
+    this.calendar = new FullCalendar.Calendar(this.$el, {
+      initialView: "timeGridWeek",
+      slotMinTime: "05:00:00",
+      slotMaxTime: "22:00:00",
+      allDaySlot: false,
+      timeZone: "local",
+      height: "auto",
+      events: this.eventsData,
+      eventClick: function(info) {
+          alert('Event: ' + info.event.title);
+          this.$emit("click", {"click":info});
+        
+      }
+    });
+
+    this.calendar.render();
+  },
+  methods: {
+  },
+};

nicegui/elements/fullcalendar.py

@@ -1,9 +1,20 @@
+from typing import Dict, List, Optional, Callable
 
-from typing import List, Dict
 from ..element import Element
+from ..events import GenericEventArguments, handle_event
 
-class FullCalendar(Element, component="fullcalendar.js", exposed_libraries=["https://cdn.jsdelivr.net/npm/fullcalendar@6.1.9/main.min.css", "https://cdn.jsdelivr.net/npm/fullcalendar@6.1.9/index.global.min.js"]):
-    def __init__(self, events_data: List[Dict], element_id: str = 'full-calendar') -> None:
-        super().__init__('fullcalendar.js')
+class FullCalendar(Element, component='fullcalendar.js', libraries=['lib/fullcalendar/index.global.min.js']):
+    def __init__(self, events_data: List[Dict], on_click: Optional[Callable] = None) -> None:
+        super().__init__()
         self._props['eventsData'] = events_data
-        self._props['elementId'] = element_id
+        if on_click:
+            def handle_on_click(e: GenericEventArguments):
+                print(e)
+                handle_event(on_click, e)
+        
+            self.on("click", handle_on_click, ['click'])
+
+
+    def on_event_clicked(self, event_info):
+        # Implement your logic to handle the clicked event in Python
+        print("Event clicked in Python:", event_info)