• Installation
• Screenshots
  • Nepali DateTime Picker in Form
  • Nepali Date Picker in Form
  • CLock TimePicker
  • Nepali Functions
• Usage
  • 1. NepaliDateTimePicker
  • Configuring the locale
  • Configuring the first day of the week
  • Disable Navigation When Out Of Range
  • Saving Date in Nepali Format
  • Methods Supporting NepaliDate
  • DatePicker Key Bindings
    • Navigation
    • Month / Year Shortcuts
    • Page Navigation
    • Week Navigation
    • Selection & Clearing
  • 2. ClockTimePicker
    • Usage
    • Close picker after selecting time
    • Disable Second Selection
  • 3. Nepali Functions
  • nepaliDate()
  • toNepaliDate()
  • nepaliSince()
  • nepaliNumber()
  • nepaliWord()
  • nepaliMoney()
  • nepaliNumeric()
  • NepaliFunctions for Tooltip
• Contributing
• Security Vulnerabilities
• Credits
• License

A FilamentPHP plugin that adds support for Nepali Date (Bikram Sambat - BS) in Filament’s form, infolist and table components.

#Installation

Require the package using Composer:

composer require rohanadhikari/filament-nepali-datetime

#Screenshots

#Nepali DateTime Picker in Form

#Nepali Date Picker in Form

#CLock TimePicker

#Nepali Functions

#Usage

To use NepaliDate, please refer to the documentation of NepaliDate.

#1. NepaliDateTimePicker

[!WARNING]
If you are using timestamp and datetime column type consider using ADAsNepaliDate or datetime cast in model.

It extends Filament DateTimePicker to support Nepali Date (BS).

use RohanAdhikari\FilamentNepaliDatetime\NepaliDatetimePicker;
use RohanAdhikari\FilamentNepaliDatetime\NepaliDatePicker;
 
NepaliDatetimePicker::make('dob')
    ->label('Date of Birth (BS)')
    ->weekStartsOnSaturday()
    ->dehydrateStateInNepali()
    ->locale(NepaliDate::NEPALI)
    ->maxDate(NepaliDate::now())
    ->minDate(now()->subYear(20)), // Suport NepaliDate/ Carbon / Nepalidate string
 
    //or for date only
NepaliDatePicker::make('dob')
    ->format('d-m-Y')
    ->locale(NepaliDate::NEPALI)
    ->maxDate(NepaliDate::now()),

#Configuring the locale

The picker supports two locales:

• 'en' – English
• 'np' – Nepali

NepaliDatetimePicker::make('dob')
    ->locale(NepaliDate::NEPALI);

#Configuring the first day of the week

Similar to Filament Datetime Picker. New convenient helper method is added.

NepaliDatePicker::make('dob')
    ->weekStartsOnSaturday()

#Disable Navigation When Out Of Range

By Default, Navigation is disabled when date is out of range(like after maxdate or before mindate). To enable navigation even Date is Out of Range You can use ->disableNavWhenOutOfRange(false).

NepaliDatePicker::make('dob')
    ->disableNavWhenOutOfRange(false)

#Saving Date in Nepali Format

By Default, Datetime is saved in english format even locale is 'np'. You can configure it to save in Nepali Unicode in the database.

[!WARNING]
In Laravel migrations, don’t use timestamp for Nepali dates. Instead, use string, because timestamp and datetime cannot store Unicode characters.

[!NOTE]
If you are using any cast from NepaliDate in model, date will automatically be converted to the English locale.

NepaliDatetimePicker::make('dob')
    ->dehydrateStateInNepali()

#Methods Supporting NepaliDate

These methods support NepaliDate, Carbon, or NepaliDate string:

#DatePicker Key Bindings

The DatePicker supports keyboard navigation for accessibility and ease of use.

#Navigation

• Arrow Left → Move focus to the previous day
• Arrow Right → Move focus to the next day
• Arrow Up → Move focus to the same week day in the previous week
• Arrow Down → Move focus to the same week day in the next week

#Month / Year Shortcuts

• Alt + Arrow Left → Focus the previous month
• Alt + Arrow Right → Focus the next month
• Alt + Arrow Up → Focus the previous year
• Alt + Arrow Down → Focus the next year

#Page Navigation

• Page Up → Previous month
• Page Down → Next month
• Shift + Page Up → Previous year
• Shift + Page Down → Next year

#Week Navigation

• Home → Jump to the start of the week
• End → Jump to the end of the week

#Selection & Clearing

• Enter → Select the currently focused day
• Backspace / Delete / Clear → Clear the selected date

#2. ClockTimePicker

ClockTimePicker provides an interactive clock interface that allows users to select a time visually. It offers a more intuitive way to pick hours, minutes and seconds compared to traditional input fields.

[!Important] IF you are using Filament Panels, you must have to set up a custom theme. to setup follow the instruction in the Filament Custom Theme Doc

After setting up custom theme add the Clocktime picker css to your theme css file.

@import '../../../../vendor/rohanadhikari/filament-nepali-datetime/resources/css/clock-time-picker.css';

#Usage

ClockTimePicker::make('nepali_time')
   ->label('Nepali Time')
   ->defaultFocusedTime(NepaliDate::now())
   ->disabledTimes(['09:00 AM', '10:00 AM'])
   ->maxTime('01:00 PM')
   ->seconds(false)
   ->closeOnTimeSelection()
   ->locale('np')
   ->suffixAction(
       Action::make('now')
        ->action(fn(Set $set) => $set('nepali_time', NepaliDate::now()))
   ),

#Close picker after selecting time

Use ->closeOnTimeSelection() to automatically close the picker once a time is selected:

ClockTimePicker::make('nepali_time')
       ->label('Nepali Time')
       ->closeOnTimeSelection()

#Disable Second Selection

Use ->seconds(false) to disable seconds selection:

ClockTimePicker::make('nepali_time')
       ->label('Nepali Time')
       ->seconds(false)

#3. Nepali Functions

The following functions are available on TextColumn and TextEntry.

#nepaliDate()

Formats a stored BS (Bikram Sambat) date into English or Nepali locale.

[!NOTE]
This does not convert AD → BS. If you want conversion, use toNepaliDate().

TextColumn::make('dob')
    ->nepaliDate(
        locale: 'np'
    );
    //or
TextEntry::make('dob')
    ->nepaliDateTime(
        locale: 'en'
    );
        //or
TextEntry::make('dob')
    ->nepaliTime(
        locale: 'en'
    );

#toNepaliDate()

Converts a stored AD date into BS date, then formats it.

// Table Column
TextColumn::make('dob')
    ->toNepaliDate(format: 'd M, Y', locale: 'np');
// Infolist Text Entry
TextEntry::make('dob')
    ->toNepaliDate(format: 'd M, Y', locale: 'en');
    //also
TextColumn::make('dob')
    ->toNepaliDateTime(locale: 'np');
TextEntry::make('dob')
    ->toNepaliTime(locale: 'en');

#nepaliSince()

Displays a human-readable difference (e.g., “2 days ago”) between a stored BS date-time and the current time.

TextColumn::make('published_at')
    ->nepaliSince();

#nepaliNumber()

Converts numbers into Nepali numerals or formatted currency representations.

TextEntry::make('salary')
    ->nepaliNumber(currencySymbol: true, locale: 'np');

#nepaliWord()

Converts numeric values into Nepali or English words, optionally as currency words.

TextEntry::make('amount')
    ->nepaliWord(locale: 'en');

#nepaliMoney()

Formats numeric values as Nepali currency, complete with symbols, localization, and optional unit division.

TextEntry::make('total')
    ->nepaliMoney(currencySymbol: true, divideBy: 100, locale: 'np');

#nepaliNumeric()

Display numeric values using Nepali digit formatting (commas, symbols).

TextEntry::make('population')
    ->nepaliNumeric(locale: 'np');

#NepaliFunctions for Tooltip

You can append Tooltip to any Nepali function to display formatted tooltips.

TextColumn::make('created_at')->nepaliSinceTooltip();

For example:

• nepaliDate() → nepaliDateTooltip()
• nepaliSince() → nepaliSinceTooltip()
• nepaliMoney() → nepaliMoneyTooltip()

#Contributing

Please see CONTRIBUTING for details.

#Security Vulnerabilities

Please review our security policy on how to report security vulnerabilities.

#Credits

• Rohan Adhikari

#License

The MIT License (MIT). Please see License File for more information.