C
CalendoPro

Mini Widget Calendar

Ultra-compact floating calendar widget for toolbars and sidebars

Toolbar Integration
🏠
📁
⚙️
🔔

Click the calendar icon in the toolbar above to open the widget.

Selected Date
Click calendar to select
Sidebar Integration
Floating Button

A floating action button that reveals the calendar on click.

Selected Date
Click floating button
Inline Mini

A compact inline calendar for tight spaces.

Selected Date
Select a date

Usage Example

// Initialize Mini Widget const widget = new CalendoPro.MiniWidget('#my-widget', { theme: 'light', position: 'bottom-left', // bottom-left, bottom-right, top-left, top-right autoClose: true, buttonIcon: '📅', buttonSize: 44, onDateSelect: (data) => { console.log('Selected:', data.formatted); } }); // Toggle calendar visibility widget.toggle(); widget.open(); widget.close(); // Get selected date const date = widget.getValue();
🔘

Compact Design

Ultra-small footprint, perfect for any UI.

📍

Flexible Position

Position the popup in any direction.

🎨

Customizable

Custom icons, sizes, and colors.

Auto Close

Closes automatically on selection.