@dialiq/calendar-component 1.1.2 → 1.1.3

package/dist/BookingDetailsModal.d.ts

@@ -4,7 +4,10 @@ import './BookingDetailsModal.css';
 interface BookingDetailsModalProps {
     booking: Booking;
     timezone: string;
+    businessId: string;
+    apiBaseUrl?: string;
     onClose: () => void;
+    onBookingDeleted: () => void;
 }
 declare const BookingDetailsModal: React.FC<BookingDetailsModalProps>;
 export default BookingDetailsModal;

package/dist/BookingDetailsModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BookingDetailsModal.d.ts","sourceRoot":"","sources":["../src/BookingDetailsModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAClC,OAAO,2BAA2B,CAAC;AAEnC,UAAU,wBAAwB;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAyF3D,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"BookingDetailsModal.d.ts","sourceRoot":"","sources":["../src/BookingDetailsModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAElC,OAAO,2BAA2B,CAAC;AAEnC,UAAU,wBAAwB;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,gBAAgB,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,QAAA,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAkJ3D,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/Calendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../src/Calendar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,aAAa,EAAW,MAAM,SAAS,CAAC;AAQjD,OAAO,gBAAgB,CAAC;AAIxB,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA+NrC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../src/Calendar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,aAAa,EAAW,MAAM,SAAS,CAAC;AAQjD,OAAO,gBAAgB,CAAC;AAIxB,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAqOrC,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/api.d.ts

@@ -3,4 +3,7 @@ export declare const createBooking: (businessId: string, booking: CreateBookingR
 export declare const getResourceSchedule: (businessId: string, resourceId: string, startDate: string, endDate: string, timezone?: string, apiBaseUrl?: string) => Promise<Booking[]>;
 export declare const getAllBookings: (businessId: string, startDate: string, endDate: string, timezone?: string, apiBaseUrl?: string) => Promise<Booking[]>;
 export declare const getMeetingDetails: (businessId: string, meetingId: string, timezone?: string, apiBaseUrl?: string) => Promise<Booking>;
+export declare const deleteMeeting: (businessId: string, meetingId: string, apiBaseUrl?: string) => Promise<{
+    success: boolean;
+}>;
 //# sourceMappingURL=api.d.ts.map

package/dist/api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"api.d.ts","sourceRoot":"","sources":["../src/api.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAYxD,eAAO,MAAM,aAAa,GACxB,YAAY,MAAM,EAClB,SAAS,oBAAoB,EAC7B,aAAa,MAAM,KAClB,OAAO,CAAC,OAAO,CAgBjB,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAC9B,YAAY,MAAM,EAClB,YAAY,MAAM,EAClB,WAAW,MAAM,EACjB,SAAS,MAAM,EACf,WAAW,MAAM,EACjB,aAAa,MAAM,KAClB,OAAO,CAAC,OAAO,EAAE,CAiBnB,CAAC;AAEF,eAAO,MAAM,cAAc,GACzB,YAAY,MAAM,EAClB,WAAW,MAAM,EACjB,SAAS,MAAM,EACf,WAAW,MAAM,EACjB,aAAa,MAAM,KAClB,OAAO,CAAC,OAAO,EAAE,CAiBnB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC5B,YAAY,MAAM,EAClB,WAAW,MAAM,EACjB,WAAW,MAAM,EACjB,aAAa,MAAM,KAClB,OAAO,CAAC,OAAO,CAejB,CAAC"}
+{"version":3,"file":"api.d.ts","sourceRoot":"","sources":["../src/api.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAYxD,eAAO,MAAM,aAAa,GACxB,YAAY,MAAM,EAClB,SAAS,oBAAoB,EAC7B,aAAa,MAAM,KAClB,OAAO,CAAC,OAAO,CAgBjB,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAC9B,YAAY,MAAM,EAClB,YAAY,MAAM,EAClB,WAAW,MAAM,EACjB,SAAS,MAAM,EACf,WAAW,MAAM,EACjB,aAAa,MAAM,KAClB,OAAO,CAAC,OAAO,EAAE,CAiBnB,CAAC;AAEF,eAAO,MAAM,cAAc,GACzB,YAAY,MAAM,EAClB,WAAW,MAAM,EACjB,SAAS,MAAM,EACf,WAAW,MAAM,EACjB,aAAa,MAAM,KAClB,OAAO,CAAC,OAAO,EAAE,CAiBnB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC5B,YAAY,MAAM,EAClB,WAAW,MAAM,EACjB,WAAW,MAAM,EACjB,aAAa,MAAM,KAClB,OAAO,CAAC,OAAO,CAejB,CAAC;AAEF,eAAO,MAAM,aAAa,GACxB,YAAY,MAAM,EAClB,WAAW,MAAM,EACjB,aAAa,MAAM,KAClB,OAAO,CAAC;IAAE,OAAO,EAAE,OAAO,CAAA;CAAE,CAY9B,CAAC"}

package/dist/index.esm.js

@@ -7398,6 +7398,17 @@ const getMeetingDetails = (businessId, meetingId, timezone, apiBaseUrl) => __awa
     }
     return response.json();
 });
+const deleteMeeting = (businessId, meetingId, apiBaseUrl) => __awaiter(void 0, void 0, void 0, function* () {
+    const baseUrl = apiBaseUrl || getBaseUrl();
+    const response = yield fetch(`${baseUrl}/businesses/${businessId}/meetings/${meetingId}`, {
+        method: 'DELETE',
+    });
+    if (!response.ok) {
+        const error = yield response.json();
+        throw new Error(error.error || 'Failed to delete meeting');
+    }
+    return response.json();
+});
 
 function styleInject(css, ref) {
   if ( ref === void 0 ) ref = {};
@@ -7539,20 +7550,48 @@ const CreateBookingModal = ({ businessId, apiBaseUrl, initialDate, participants:
                     React.createElement("button", { type: "submit", className: "modal-btn modal-btn-primary", disabled: loading }, loading ? 'Creating...' : 'Create Booking'))))));
 };
 
-var css_248z$1 = "/* BookingDetailsModal - extends base modal styles from CreateBookingModal.css */\r\n\r\n.booking-details-modal {\r\n  max-width: 500px;\r\n}\r\n\r\n.detail-section {\r\n  padding: 12px 0;\r\n  border-bottom: 1px solid #e9ecef;\r\n}\r\n\r\n.detail-section:last-child {\r\n  border-bottom: none;\r\n}\r\n\r\n.detail-row {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: flex-start;\r\n  margin-bottom: 8px;\r\n}\r\n\r\n.detail-row:last-child {\r\n  margin-bottom: 0;\r\n}\r\n\r\n.detail-row.full-width {\r\n  flex-direction: column;\r\n}\r\n\r\n.detail-label {\r\n  font-weight: 500;\r\n  color: #6c757d;\r\n  font-size: 14px;\r\n  min-width: 100px;\r\n}\r\n\r\n.detail-label-muted {\r\n  color: #adb5bd;\r\n  font-size: 12px;\r\n}\r\n\r\n.detail-value {\r\n  font-weight: 500;\r\n  color: #212529;\r\n  font-size: 14px;\r\n  text-align: right;\r\n}\r\n\r\n.detail-value-muted {\r\n  color: #adb5bd;\r\n  font-size: 12px;\r\n  font-family: monospace;\r\n}\r\n\r\n.detail-description {\r\n  margin: 8px 0 0 0;\r\n  color: #495057;\r\n  font-size: 14px;\r\n  line-height: 1.5;\r\n  white-space: pre-wrap;\r\n}\r\n\r\n.participants-list {\r\n  margin: 8px 0 0 0;\r\n  padding-left: 20px;\r\n  list-style-type: disc;\r\n}\r\n\r\n.participant-item {\r\n  color: #495057;\r\n  font-size: 14px;\r\n  margin-bottom: 4px;\r\n}\r\n\r\n@media (max-width: 576px) {\r\n  .booking-details-modal {\r\n    max-width: 100%;\r\n  }\r\n\r\n  .detail-row {\r\n    flex-direction: column;\r\n    gap: 4px;\r\n  }\r\n\r\n  .detail-value {\r\n    text-align: left;\r\n  }\r\n}\r\n";
+var css_248z$1 = "/* BookingDetailsModal - extends base modal styles from CreateBookingModal.css */\n\n.booking-details-modal {\n  max-width: 500px;\n}\n\n.detail-section {\n  padding: 12px 0;\n  border-bottom: 1px solid #e9ecef;\n}\n\n.detail-section:last-child {\n  border-bottom: none;\n}\n\n.detail-row {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 8px;\n}\n\n.detail-row:last-child {\n  margin-bottom: 0;\n}\n\n.detail-row.full-width {\n  flex-direction: column;\n}\n\n.detail-label {\n  font-weight: 500;\n  color: #6c757d;\n  font-size: 14px;\n  min-width: 100px;\n}\n\n.detail-label-muted {\n  color: #adb5bd;\n  font-size: 12px;\n}\n\n.detail-value {\n  font-weight: 500;\n  color: #212529;\n  font-size: 14px;\n  text-align: right;\n}\n\n.detail-value-muted {\n  color: #adb5bd;\n  font-size: 12px;\n  font-family: monospace;\n}\n\n.detail-description {\n  margin: 8px 0 0 0;\n  color: #495057;\n  font-size: 14px;\n  line-height: 1.5;\n  white-space: pre-wrap;\n}\n\n.participants-list {\n  margin: 8px 0 0 0;\n  padding-left: 20px;\n  list-style-type: disc;\n}\n\n.participant-item {\n  color: #495057;\n  font-size: 14px;\n  margin-bottom: 4px;\n}\n\n.modal-header-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.modal-delete-btn {\n  background: none;\n  border: none;\n  color: #dc3545;\n  cursor: pointer;\n  padding: 6px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 4px;\n  transition: background-color 0.2s;\n}\n\n.modal-delete-btn:hover:not(:disabled) {\n  background: #f8d7da;\n}\n\n.modal-delete-btn:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.delete-confirm-box {\n  background: #fff3cd;\n  border: 1px solid #ffc107;\n  border-radius: 4px;\n  padding: 16px;\n  margin-bottom: 16px;\n}\n\n.delete-confirm-box p {\n  margin: 0 0 12px 0;\n  font-size: 14px;\n  color: #856404;\n}\n\n.delete-confirm-actions {\n  display: flex;\n  gap: 8px;\n  justify-content: flex-end;\n}\n\n.modal-btn-danger {\n  background: #dc3545;\n  color: #ffffff;\n}\n\n.modal-btn-danger:hover:not(:disabled) {\n  background: #bb2d3b;\n}\n\n@media (max-width: 576px) {\n  .booking-details-modal {\n    max-width: 100%;\n  }\n\n  .detail-row {\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .detail-value {\n    text-align: left;\n  }\n}\n";
 styleInject(css_248z$1);
 
-const BookingDetailsModal = ({ booking, timezone, onClose, }) => {
+const BookingDetailsModal = ({ booking, timezone, businessId, apiBaseUrl, onClose, onBookingDeleted, }) => {
     var _a, _b, _c, _d, _e, _f, _g, _h;
+    const [showConfirm, setShowConfirm] = useState(false);
+    const [deleting, setDeleting] = useState(false);
+    const [error, setError] = useState(null);
     const startMoment = moment$1(booking.start).tz(timezone);
     const endMoment = moment$1(booking.end).tz(timezone);
     const durationMinutes = endMoment.diff(startMoment, 'minutes');
+    const handleDelete = () => __awaiter(void 0, void 0, void 0, function* () {
+        setDeleting(true);
+        setError(null);
+        try {
+            yield deleteMeeting(businessId, booking.meeting_id, apiBaseUrl);
+            onBookingDeleted();
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : 'Failed to delete meeting');
+            setDeleting(false);
+        }
+    });
     return (React.createElement("div", { className: "modal-overlay", onClick: onClose },
         React.createElement("div", { className: "modal-content booking-details-modal", onClick: (e) => e.stopPropagation() },
             React.createElement("div", { className: "modal-header" },
                 React.createElement("h3", null, ((_a = booking.metadata) === null || _a === void 0 ? void 0 : _a.title) || 'Untitled Booking'),
-                React.createElement("button", { className: "modal-close-btn", onClick: onClose }, "\u00D7")),
+                React.createElement("div", { className: "modal-header-actions" },
+                    React.createElement("button", { className: "modal-delete-btn", onClick: () => setShowConfirm(true), title: "Delete meeting", disabled: deleting },
+                        React.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" },
+                            React.createElement("polyline", { points: "3 6 5 6 21 6" }),
+                            React.createElement("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }),
+                            React.createElement("line", { x1: "10", y1: "11", x2: "10", y2: "17" }),
+                            React.createElement("line", { x1: "14", y1: "11", x2: "14", y2: "17" }))),
+                    React.createElement("button", { className: "modal-close-btn", onClick: onClose }, "\u00D7"))),
             React.createElement("div", { className: "modal-body" },
+                error && React.createElement("div", { className: "modal-error" }, error),
+                showConfirm && (React.createElement("div", { className: "delete-confirm-box" },
+                    React.createElement("p", null, "Are you sure you want to delete this meeting?"),
+                    React.createElement("div", { className: "delete-confirm-actions" },
+                        React.createElement("button", { className: "modal-btn modal-btn-secondary", onClick: () => setShowConfirm(false), disabled: deleting }, "Cancel"),
+                        React.createElement("button", { className: "modal-btn modal-btn-danger", onClick: handleDelete, disabled: deleting }, deleting ? 'Deleting...' : 'Delete')))),
                 React.createElement("div", { className: "detail-section" },
                     React.createElement("div", { className: "detail-row" },
                         React.createElement("span", { className: "detail-label" }, "Date:"),
@@ -8114,7 +8153,10 @@ const Calendar = ({ businessId, resourceId, title = 'Calendar', apiBaseUrl, defa
         loading && React.createElement("div", { className: "calendar-loading" }, "Loading..."),
         React.createElement("div", { className: "calendar-content" }, currentView === 'month' ? (React.createElement(MonthView, { currentDate: currentDate, bookings: bookings, timezone: timezone, onBookingClick: handleInternalBookingClick, onDateClick: handleDateClick, businessHours: businessHours })) : (React.createElement(TimeGrid, { currentDate: currentDate, view: currentView, bookings: bookings, timezone: timezone, onBookingClick: handleInternalBookingClick, onTimeSlotClick: handleDateClick, businessHours: businessHours }))),
         showCreateModal && selectedDate && (React.createElement(CreateBookingModal, { businessId: businessId, apiBaseUrl: apiBaseUrl, initialDate: selectedDate, participants: participants, onClose: () => setShowCreateModal(false), onBookingCreated: handleBookingCreated, timezone: timezone, businessHours: businessHours })),
-        selectedBooking && (React.createElement(BookingDetailsModal, { booking: selectedBooking, timezone: timezone, onClose: () => setSelectedBooking(null) }))));
+        selectedBooking && (React.createElement(BookingDetailsModal, { booking: selectedBooking, timezone: timezone, businessId: businessId, apiBaseUrl: apiBaseUrl, onClose: () => setSelectedBooking(null), onBookingDeleted: () => __awaiter(void 0, void 0, void 0, function* () {
+                setSelectedBooking(null);
+                yield fetchBookings();
+            }) }))));
 };
 
 export { Calendar, createBooking, getAllBookings, getMeetingDetails, getResourceSchedule };