PHPackages                             flat-duck/livewire-datepicker - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. flat-duck/livewire-datepicker

ActiveLibrary[Utility & Helpers](/categories/utility)

flat-duck/livewire-datepicker
=============================

A standalone livewire datepicker component without dependencies

04PHP

Since Jul 31Pushed 2y agoCompare

[ Source](https://github.com/Flat-Duck/livewire-datepicker)[ Packagist](https://packagist.org/packages/flat-duck/livewire-datepicker)[ RSS](/packages/flat-duck-livewire-datepicker/feed)WikiDiscussions main Synced 1mo ago

READMEChangelogDependenciesVersions (1)Used By (0)

LivewireDatepicker
==================

[](#livewiredatepicker)

Livewire datepicker is a standalone livewire component that gives you a calendar, datepicker and date-range picker.

This is not yet a stable release.

Range pickerDate picker[![Range picker](./.github/range-picker.gif)](./.github/range-picker.gif)[![Date picker](./.github/date-picker.gif)](./.github/date-picker.gif)Installation
------------

[](#installation)

Via Composer

```
$ composer require flat-duck/livewire-datepicker
```

Usage
-----

[](#usage)

This package uses tailwindcss.

You need to add `./vendor/flat-duck/livewire-datepicker/resources/**/*.blade.php` to the purge list of your tailwind.config.json

To use this, create a new livewire component and extend the `DatePickerComponent` class:

```
use FlatDuck\LivewireDatepicker\Http\Livewire\DatePickerComponent;

class TestCalendar extends DatePickerComponent
{
    // Pick any of the 3 options.
    public string $type = self::TYPE_RANGE_PICKER;
    public string $type = self::TYPE_DATEPICKER;
    public string $type = self::TYPE_DISPLAY_ONLY;
}
```

Then depending on the needs, add availability data:

```
public function getAvailabilityData(): Collection
{
    return collect([
        new DatePickerDayData(Carbon::yesterday(), classes: 'bg-red-500 text-white'),
        new DatePickerDayData(Carbon::tomorrow(), classes: 'bg-yellow-500 text-white'),
        new DatePickerDayData(Carbon::today(), classes: 'bg-green-500 text-white'),
        new DatePickerDayData(date: Carbon::now()->setDay(31), disabled: true, cannotPickOver: true),
        new DatePickerDayData(date: Carbon::now()->setDay(26), disabled: true, cannotPickOver: true),
    ]);
}
```

And finally emit your events to other components (if needed) (example):

```
    /**
     * This method is called whenever the date range or a new date is set.
     */
    public function onDatesSet(): void
    {
        $this->emit('rangeSet', ['from' => $this->startRange->format('Y-m-d'), 'till' => $this->endRange->format('Y-m-d')]);
    }

    /**
     * This method is called whenever the date range or a new date is unset.
     */
    public function onDatesUnSet(): void
    {
        $this->emit('rangeUnset');
    }
```

More documentation will follow but you can always have a look at the component to see what options are available.

Change log
----------

[](#change-log)

Please see the [changelog](changelog.md) for more information on what has changed recently.

Testing
-------

[](#testing)

```
$ composer test
```

Contributing
------------

[](#contributing)

Please see [contributing.md](contributing.md) for details and a todolist.

Security
--------

[](#security)

If you discover any security related issues, please email  instead of using the issue tracker.

License
-------

[](#license)

MIT. Please see the [license file](license.md) for more information.

###  Health Score

14

—

LowBetter than 2% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity3

Limited adoption so far

Community10

Small or concentrated contributor base

Maturity21

Early-stage or recently created project

 Bus Factor1

Top contributor holds 78.6% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

### Community

Maintainers

![](https://www.gravatar.com/avatar/a01d60c415dc231ce7626e52a399b00ba2b132b1b480ae7c50e8bb51f9fa72a2?d=identicon)[Bithive](/maintainers/Bithive)

---

Top Contributors

[![haringsrob](https://avatars.githubusercontent.com/u/866743?v=4)](https://github.com/haringsrob "haringsrob (22 commits)")[![a-mahidwei](https://avatars.githubusercontent.com/u/45355351?v=4)](https://github.com/a-mahidwei "a-mahidwei (4 commits)")[![astalpaert](https://avatars.githubusercontent.com/u/5843790?v=4)](https://github.com/astalpaert "astalpaert (1 commits)")[![dannydehaan](https://avatars.githubusercontent.com/u/1867494?v=4)](https://github.com/dannydehaan "dannydehaan (1 commits)")

### Embed Badge

![Health badge](/badges/flat-duck-livewire-datepicker/health.svg)

```
[![Health](https://phpackages.com/badges/flat-duck-livewire-datepicker/health.svg)](https://phpackages.com/packages/flat-duck-livewire-datepicker)
```

###  Alternatives

[yii2mod/yii2-markdown

Markdown Widget for Yii2

1347.7k5](/packages/yii2mod-yii2-markdown)[splitbrain/php-ringicon

A indenticon/glyphicon like avatar generator

1613.3k1](/packages/splitbrain-php-ringicon)[willywes/agora-sdk-php

Agora.io SDK PHP

1023.2k2](/packages/willywes-agora-sdk-php)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)