customized-calendar 1.0.0

package/LICENSE

@@ -0,0 +1,23 @@
+MIT License
+
+Copyright (c) 2024
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+

package/README.md

@@ -0,0 +1,238 @@
+# Customized Calendar Component
+
+A modern, elegant, and highly customizable calendar component built with React, TypeScript, and FullCalendar. Perfect for any application that needs a beautiful, flexible calendar interface.
+
+## Features
+
+✨ **Modern Design**
+- Clean, elegant UI with gradient accents
+- Responsive layout for all screen sizes
+- Customizable theme colors
+- Smooth animations and transitions
+
+📅 **Multiple Views**
+- Month view
+- Week view
+- Day view
+
+🎯 **Event Management**
+- Color-coded events by type (SESSION, EVENT, EXAM, HOLIDAY)
+- Batch information display
+- Drag & drop support
+- Event resizing
+- Click to view/edit events
+
+📚 **Batch Support**
+- Display batch information for each event
+- Group events by batch
+- Batch-specific filtering
+
+🎨 **Customizable**
+- Theme color support
+- Custom event colors
+- Flexible styling with Tailwind CSS
+
+## Installation
+
+### NPM Package (Recommended)
+
+```bash
+npm install customized-calendar
+# or
+yarn add customized-calendar
+```
+
+**Note:** This component uses Tailwind CSS classes. Make sure Tailwind CSS is configured in your project. See [Styling](#styling) section below for setup instructions.
+
+### Manual Installation
+
+If you prefer to copy the component files directly:
+
+1. Copy the `components/classroom-calendar` folder to your project
+2. Install peer dependencies:
+```bash
+npm install @fullcalendar/react @fullcalendar/core @fullcalendar/daygrid @fullcalendar/timegrid @fullcalendar/interaction react react-dom
+```
+
+## Quick Start
+
+### Using NPM Package
+
+```tsx
+import { CustomizedCalendar, CalendarEvent, EventType } from 'customized-calendar';
+
+function MyCalendar() {
+  const events: CalendarEvent[] = [
+    {
+      id: '1',
+      title: 'Mathematics Session',
+      start: new Date(),
+      end: new Date(Date.now() + 90 * 60 * 1000),
+      batchId: 'batch-001',
+      batchName: 'Batch A - Morning',
+      type: EventType.SESSION,
+    },
+  ];
+
+  return (
+    <CustomizedCalendar
+      events={events}
+      onDateClick={(date) => console.log('Date:', date)}
+      onEventClick={(event) => console.log('Event:', event)}
+      themeColor="#3b82f6"
+    />
+  );
+}
+```
+
+### Using Copied Component Files
+
+```tsx
+import { CustomizedCalendar, CalendarEvent, EventType } from '@/components/classroom-calendar';
+
+function MyCalendar() {
+  const events: CalendarEvent[] = [
+    {
+      id: '1',
+      title: 'Mathematics Session',
+      start: new Date(),
+      end: new Date(Date.now() + 90 * 60 * 1000),
+      batchId: 'batch-001',
+      batchName: 'Batch A - Morning',
+      type: EventType.SESSION,
+    },
+  ];
+
+  return (
+    <CustomizedCalendar
+      events={events}
+      onDateClick={(date) => console.log('Date:', date)}
+      onEventClick={(event) => console.log('Event:', event)}
+      themeColor="#3b82f6"
+    />
+  );
+}
+```
+
+## Documentation
+
+- **[NPM Publish Guide](./NPM_PUBLISH_GUIDE.md)** - How to publish to NPM
+- **[Quick Integration Guide](./QUICK_INTEGRATION.md)** - 5-minute setup guide
+- **[Reusable Package Guide](./REUSABLE_PACKAGE_GUIDE.md)** - Use in other projects & backend integration
+- **[Quick Start Guide](./QUICK_START.md)** - Get started in 5 minutes
+- **[Integration Guide](./INTEGRATION_GUIDE.md)** - Complete integration documentation
+- **[API Contract](./API_CONTRACT.md)** - Backend API requirements
+- **[Data Structure](./data/README.md)** - Data models and types
+
+## Component Structure
+
+```
+components/classroom-calendar/
+├── CustomizedCalendar.tsx      # Main calendar component
+├── AddEventModal.tsx           # Add event modal
+├── EventDetailsModal.tsx       # Event details modal
+├── DateEventsList.tsx          # Date events list modal
+├── calendar.types.ts           # TypeScript types
+├── calendar.utils.ts          # Utility functions
+└── index.ts                   # Exports
+```
+
+## Props
+
+### CustomizedCalendar
+
+| Prop | Type | Required | Default | Description |
+|------|------|----------|---------|-------------|
+| `events` | `CalendarEvent[]` | ✅ | - | Array of calendar events |
+| `onDateClick` | `(date: string) => void` | ✅ | - | Callback when date is clicked |
+| `onEventClick` | `(event: CalendarEvent) => void` | ✅ | - | Callback when event is clicked |
+| `height` | `string \| number` | ❌ | `'auto'` | Calendar height |
+| `initialView` | `'dayGridMonth' \| 'timeGridWeek' \| 'timeGridDay'` | ❌ | `'dayGridMonth'` | Initial view |
+| `themeColor` | `string` | ❌ | `'#3b82f6'` | Primary theme color (hex) |
+| `editable` | `boolean` | ❌ | `true` | Enable drag & drop |
+| `selectable` | `boolean` | ❌ | `true` | Enable date selection |
+
+## Event Types
+
+- **SESSION**: Regular class sessions (Blue: `#4f46e5`)
+- **EVENT**: Special events, labs, workshops (Green: `#059669`)
+- **EXAM**: Examinations (Red: `#dc2626`)
+- **HOLIDAY**: Holidays (Amber: `#d97706`)
+
+## Examples
+
+See `components/classroom-calendar/example-usage.tsx` for complete examples.
+
+## Backend Integration
+
+The component can work with any backend that provides calendar events. It's flexible and can be adapted to different API structures.
+
+### Quick Setup
+1. Copy component files to your project (see [QUICK_INTEGRATION.md](./QUICK_INTEGRATION.md))
+2. Configure API service (see `services/calendarApi.configurable.ts`)
+3. Connect to your backend
+
+### Backend Options
+- **REST API** - Standard REST endpoints (see [INTEGRATION_GUIDE.md](./INTEGRATION_GUIDE.md))
+- **GraphQL** - Use GraphQL queries (see [REUSABLE_PACKAGE_GUIDE.md](./REUSABLE_PACKAGE_GUIDE.md))
+- **Firebase/Supabase** - Direct database integration (examples included)
+- **Custom Format** - Adapt to any API structure (see `examples/api-config-examples.ts`)
+
+### Required Endpoints
+- `GET /api/calendar/events` - Get events with date range
+- `POST /api/calendar/events` - Create event
+- `PUT /api/calendar/events/:id` - Update event
+- `DELETE /api/calendar/events/:id` - Delete event
+
+See [API_CONTRACT.md](./API_CONTRACT.md) for detailed API documentation and [REUSABLE_PACKAGE_GUIDE.md](./REUSABLE_PACKAGE_GUIDE.md) for backend integration strategies.
+
+## Styling
+
+The component uses Tailwind CSS. Ensure Tailwind is configured in your project:
+
+```js
+// tailwind.config.js
+module.exports = {
+  content: [
+    './components/**/*.{js,ts,jsx,tsx}',
+    './node_modules/customized-calendar/dist/**/*.{js,jsx}', // Include package files
+    './app/**/*.{js,ts,jsx,tsx}', // Your app files
+  ],
+  // ... rest of config
+};
+```
+
+**Important:** The component includes inline styles for FullCalendar customization, but Tailwind CSS classes are used for layout and responsive design. Make sure your Tailwind configuration includes the package files in the `content` array.
+
+## Browser Support
+
+- Chrome (latest)
+- Firefox (latest)
+- Safari (latest)
+- Edge (latest)
+
+## License
+
+MIT
+
+## Using in Other Projects
+
+Want to use this calendar in another project? See the comprehensive guide:
+
+- **[REUSABLE_PACKAGE_GUIDE.md](./REUSABLE_PACKAGE_GUIDE.md)** - Complete guide for using in other projects
+  - Copy component files
+  - Configure for different backends
+  - API service examples
+  - Firebase/GraphQL/Custom backend examples
+
+Quick start: Copy `components/classroom-calendar` folder and install dependencies.
+
+## Support
+
+For issues or questions:
+1. Check the [Quick Integration Guide](./QUICK_INTEGRATION.md) for fast setup
+2. See [Reusable Package Guide](./REUSABLE_PACKAGE_GUIDE.md) for backend integration
+3. Review [Integration Guide](./INTEGRATION_GUIDE.md) for complete documentation
+4. Check [API Contract](./API_CONTRACT.md) for backend requirements
+5. See example implementations in `examples/` folder
+

package/dist/components/classroom-calendar/AddEventModal.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { Batch, Room, Subject, CalendarEventExtended } from '@/data/mock-calendar-data';
+interface AddEventModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onSave: (event: CalendarEventExtended) => void;
+    initialDate?: string;
+    batches: Batch[];
+    rooms: Room[];
+    subjects: Subject[];
+}
+declare const AddEventModal: React.FC<AddEventModalProps>;
+export default AddEventModal;
+//# sourceMappingURL=AddEventModal.d.ts.map

package/dist/components/classroom-calendar/AddEventModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddEventModal.d.ts","sourceRoot":"","sources":["../../../components/classroom-calendar/AddEventModal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAExF,UAAU,kBAAkB;IAC1B,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,KAAK,EAAE,CAAC;IACjB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,QAAQ,EAAE,OAAO,EAAE,CAAC;CACrB;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAyZ/C,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/classroom-calendar/AddEventModal.js

@@ -0,0 +1,131 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { EventType } from './calendar.types';
+const AddEventModal = ({ isOpen, onClose, onSave, initialDate, batches, rooms, subjects, }) => {
+    const [formData, setFormData] = useState({
+        title: '',
+        description: '',
+        date: initialDate || new Date().toISOString().split('T')[0],
+        startTime: '10:00',
+        endTime: '11:30',
+        batchId: batches[0]?.id || '',
+        type: EventType.SESSION,
+        roomId: '',
+        subjectId: '',
+        color: '',
+        isAllDay: false,
+    });
+    const [errors, setErrors] = useState({});
+    if (!isOpen)
+        return null;
+    const handleChange = (e) => {
+        const { name, value, type } = e.target;
+        const checked = e.target.checked;
+        setFormData((prev) => ({
+            ...prev,
+            [name]: type === 'checkbox' ? checked : value,
+        }));
+        // Clear error when user starts typing
+        if (errors[name]) {
+            setErrors((prev) => {
+                const newErrors = { ...prev };
+                delete newErrors[name];
+                return newErrors;
+            });
+        }
+    };
+    const validateForm = () => {
+        const newErrors = {};
+        if (!formData.title.trim()) {
+            newErrors.title = 'Title is required';
+        }
+        if (!formData.batchId) {
+            newErrors.batchId = 'Batch is required';
+        }
+        if (!formData.isAllDay) {
+            if (!formData.startTime) {
+                newErrors.startTime = 'Start time is required';
+            }
+            if (!formData.endTime) {
+                newErrors.endTime = 'End time is required';
+            }
+            // Validate end time is after start time
+            if (formData.startTime && formData.endTime) {
+                const [startHour, startMin] = formData.startTime.split(':').map(Number);
+                const [endHour, endMin] = formData.endTime.split(':').map(Number);
+                const startMinutes = startHour * 60 + startMin;
+                const endMinutes = endHour * 60 + endMin;
+                if (endMinutes <= startMinutes) {
+                    newErrors.endTime = 'End time must be after start time';
+                }
+            }
+        }
+        setErrors(newErrors);
+        return Object.keys(newErrors).length === 0;
+    };
+    const handleSubmit = (e) => {
+        e.preventDefault();
+        if (!validateForm()) {
+            return;
+        }
+        const selectedBatch = batches.find((b) => b.id === formData.batchId);
+        const selectedRoom = formData.roomId ? rooms.find((r) => r.id === formData.roomId) : null;
+        const selectedSubject = formData.subjectId ? subjects.find((s) => s.id === formData.subjectId) : null;
+        // Create event dates
+        let start;
+        let end;
+        if (formData.isAllDay) {
+            start = formData.date;
+            end = formData.date;
+        }
+        else {
+            start = `${formData.date}T${formData.startTime}:00`;
+            end = `${formData.date}T${formData.endTime}:00`;
+        }
+        const newEvent = {
+            id: `event-${Date.now()}`,
+            title: formData.title,
+            description: formData.description || undefined,
+            start,
+            end,
+            batchId: formData.batchId,
+            batchName: selectedBatch?.name || '',
+            type: formData.type,
+            color: formData.color || undefined,
+            room: selectedRoom || null,
+            instructor: selectedBatch?.instructor || null,
+            subject: selectedSubject || null,
+            status: 'SCHEDULED',
+            createdAt: new Date().toISOString(),
+            updatedAt: new Date().toISOString(),
+        };
+        onSave(newEvent);
+        // Reset form
+        setFormData({
+            title: '',
+            description: '',
+            date: initialDate || new Date().toISOString().split('T')[0],
+            startTime: '10:00',
+            endTime: '11:30',
+            batchId: batches[0]?.id || '',
+            type: EventType.SESSION,
+            roomId: '',
+            subjectId: '',
+            color: '',
+            isAllDay: false,
+        });
+        onClose();
+    };
+    const getEventTypeColor = (type) => {
+        const colorMap = {
+            [EventType.SESSION]: '#4f46e5',
+            [EventType.EVENT]: '#059669',
+            [EventType.EXAM]: '#dc2626',
+            [EventType.HOLIDAY]: '#d97706',
+        };
+        return colorMap[type] || '#6366f1';
+    };
+    return (_jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50 backdrop-blur-sm", children: _jsxs("div", { className: "bg-white rounded-2xl shadow-2xl max-w-2xl w-full mx-4 max-h-[90vh] overflow-y-auto", children: [_jsx("div", { className: "sticky top-0 bg-gradient-to-r from-blue-600 to-purple-600 text-white p-6 rounded-t-2xl", children: _jsxs("div", { className: "flex justify-between items-center", children: [_jsx("h2", { className: "text-2xl font-bold", children: "Add New Event" }), _jsx("button", { onClick: onClose, className: "text-white hover:text-gray-200 transition-colors p-2 hover:bg-white/20 rounded-lg", children: _jsx("svg", { className: "w-6 h-6", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })] }) }), _jsxs("form", { onSubmit: handleSubmit, className: "p-6 space-y-6", children: [_jsxs("div", { children: [_jsxs("label", { className: "block text-sm font-semibold text-gray-700 mb-2", children: ["Event Title ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsx("input", { type: "text", name: "title", value: formData.title, onChange: handleChange, className: `w-full px-4 py-2 border rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent ${errors.title ? 'border-red-500' : 'border-gray-300'}`, placeholder: "e.g., Mathematics Session" }), errors.title && _jsx("p", { className: "text-red-500 text-sm mt-1", children: errors.title })] }), _jsxs("div", { children: [_jsx("label", { className: "block text-sm font-semibold text-gray-700 mb-2", children: "Description" }), _jsx("textarea", { name: "description", value: formData.description, onChange: handleChange, rows: 3, className: "w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent", placeholder: "Event description..." })] }), _jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [_jsxs("div", { children: [_jsxs("label", { className: "block text-sm font-semibold text-gray-700 mb-2", children: ["Date ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsx("input", { type: "date", name: "date", value: formData.date, onChange: handleChange, className: "w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent" })] }), _jsx("div", { className: "flex items-end", children: _jsxs("label", { className: "flex items-center space-x-2 cursor-pointer", children: [_jsx("input", { type: "checkbox", name: "isAllDay", checked: formData.isAllDay, onChange: handleChange, className: "w-5 h-5 text-blue-600 rounded focus:ring-blue-500" }), _jsx("span", { className: "text-sm font-semibold text-gray-700", children: "All Day Event" })] }) })] }), !formData.isAllDay && (_jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs("div", { children: [_jsxs("label", { className: "block text-sm font-semibold text-gray-700 mb-2", children: ["Start Time ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsx("input", { type: "time", name: "startTime", value: formData.startTime, onChange: handleChange, className: `w-full px-4 py-2 border rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent ${errors.startTime ? 'border-red-500' : 'border-gray-300'}` }), errors.startTime && _jsx("p", { className: "text-red-500 text-sm mt-1", children: errors.startTime })] }), _jsxs("div", { children: [_jsxs("label", { className: "block text-sm font-semibold text-gray-700 mb-2", children: ["End Time ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsx("input", { type: "time", name: "endTime", value: formData.endTime, onChange: handleChange, className: `w-full px-4 py-2 border rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent ${errors.endTime ? 'border-red-500' : 'border-gray-300'}` }), errors.endTime && _jsx("p", { className: "text-red-500 text-sm mt-1", children: errors.endTime })] })] })), _jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [_jsxs("div", { children: [_jsxs("label", { className: "block text-sm font-semibold text-gray-700 mb-2", children: ["Batch ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsxs("select", { name: "batchId", value: formData.batchId, onChange: handleChange, className: `w-full px-4 py-2 border rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent ${errors.batchId ? 'border-red-500' : 'border-gray-300'}`, children: [_jsx("option", { value: "", children: "Select a batch" }), batches.map((batch) => (_jsxs("option", { value: batch.id, children: [batch.name, " (", batch.code, ")"] }, batch.id)))] }), errors.batchId && _jsx("p", { className: "text-red-500 text-sm mt-1", children: errors.batchId })] }), _jsxs("div", { children: [_jsxs("label", { className: "block text-sm font-semibold text-gray-700 mb-2", children: ["Event Type ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsx("select", { name: "type", value: formData.type, onChange: handleChange, className: "w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent", children: Object.values(EventType).map((type) => (_jsx("option", { value: type, children: type }, type))) })] })] }), _jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [_jsxs("div", { children: [_jsx("label", { className: "block text-sm font-semibold text-gray-700 mb-2", children: "Room" }), _jsxs("select", { name: "roomId", value: formData.roomId, onChange: handleChange, className: "w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent", children: [_jsx("option", { value: "", children: "Select a room (optional)" }), rooms.map((room) => (_jsxs("option", { value: room.id, children: [room.name, " - ", room.building, " (Floor ", room.floor, ")"] }, room.id)))] })] }), _jsxs("div", { children: [_jsx("label", { className: "block text-sm font-semibold text-gray-700 mb-2", children: "Subject" }), _jsxs("select", { name: "subjectId", value: formData.subjectId, onChange: handleChange, className: "w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent", children: [_jsx("option", { value: "", children: "Select a subject (optional)" }), subjects.map((subject) => (_jsxs("option", { value: subject.id, children: [subject.name, " (", subject.code, ")"] }, subject.id)))] })] })] }), _jsxs("div", { children: [_jsx("label", { className: "block text-sm font-semibold text-gray-700 mb-2", children: "Custom Color (optional)" }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsx("input", { type: "color", name: "color", value: formData.color || getEventTypeColor(formData.type), onChange: handleChange, className: "w-16 h-10 border border-gray-300 rounded-lg cursor-pointer" }), _jsx("input", { type: "text", name: "color", value: formData.color, onChange: handleChange, placeholder: "#4f46e5", className: "flex-1 px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent" }), _jsx("button", { type: "button", onClick: () => setFormData((prev) => ({ ...prev, color: '' })), className: "px-4 py-2 text-sm text-gray-600 hover:text-gray-800 border border-gray-300 rounded-lg hover:bg-gray-50", children: "Use Default" })] }), _jsxs("p", { className: "text-xs text-gray-500 mt-1", children: ["Default: ", getEventTypeColor(formData.type), " for ", formData.type] })] }), _jsxs("div", { className: "flex justify-end gap-3 pt-4 border-t", children: [_jsx("button", { type: "button", onClick: onClose, className: "px-6 py-2 bg-gray-200 text-gray-700 rounded-lg font-semibold hover:bg-gray-300 transition-colors", children: "Cancel" }), _jsx("button", { type: "submit", className: "px-6 py-2 bg-gradient-to-r from-blue-600 to-purple-600 text-white rounded-lg font-semibold hover:from-blue-700 hover:to-purple-700 transition-all shadow-lg", children: "Add Event" })] })] })] }) }));
+};
+export default AddEventModal;

package/dist/components/classroom-calendar/CustomizedCalendar.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { CustomizedCalendarProps } from './calendar.types';
+/**
+ * CustomizedCalendar Component
+ *
+ * A modern, reusable calendar component with customizable theme
+ * and support for multiple views, event management, and advanced interactions.
+ */
+declare const CustomizedCalendar: React.FC<CustomizedCalendarProps>;
+export default CustomizedCalendar;
+//# sourceMappingURL=CustomizedCalendar.d.ts.map

package/dist/components/classroom-calendar/CustomizedCalendar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomizedCalendar.d.ts","sourceRoot":"","sources":["../../../components/classroom-calendar/CustomizedCalendar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAK3D,OAAO,EACL,uBAAuB,EAExB,MAAM,kBAAkB,CAAC;AAY1B;;;;;GAKG;AACH,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAshBzD,CAAC;AAEF,eAAe,kBAAkB,CAAC"}