Skip to content

yii2-extensions/datetime-picker

Repository files navigation

Tempus Dominus Date/Time Picker.


php-version PHPUnit PHPUnit Codecov Infection

Installation

The preferred way to install this extension is through composer.

Either run

composer require --dev --prefer-dist yii2-extensions/datetime-picker:^0.1

or add

"yii2-extensions/datetime-picker": "^0.1"

to the require section of your composer.json file.

Usage

Name

use Yii2\Extensions\DateTimePicker\DateTimePicker;

echo DateTimePicker::widget(['name' => 'datetime-picker']);

Active Field

use Yii2\Extensions\DateTimePicker\DateTimePicker;

echo $form
    ->field($formModel, 'date')
    ->widget(
        DateTimePicker::class,
        [
            'icon' => Icon::renderIcon('solid', 'calendar', ['class' => 'me-2 fa-solid'])
        ]
    );

Active Field Floating Label

use Yii2\Extensions\DateTimePicker\DateTimePicker;

echo $form
    ->field($formModel, 'date', ['options' => ['class' => 'mt-3']])
    ->label(false)
    ->widget(
        DateTimePicker::class,
        [
            'floatingLabel' => true,
            'icon' => Icon::renderIcon('solid', 'calendar', ['class' => 'me-2 fa-solid'])
        ]
    )

Dynamic Theme Configuration for tempusDominus Widget Library

This library provides functionality to dynamically configure the tempusDominus widget's theme based on user preferences or predefined settings.

Functionality Overview

The library introduces a feature to automatically set up the tempusDominus widget with a theme determined by the user's preference or specified configurations.

Automatic Theme Configuration

Upon initialization, the library checks for theme configuration settings. If the user has specified a theme in the library's configuration, it takes precedence.

Browser-Based Theme Detection

If no specific theme is set or the attribute data-bs-theme is absent: The library uses the prefers-color-scheme media query to detect the user's system preference for light or dark mode.

Applying Theme Configuration to tempusDominus Widget

The library sets the theme configuration (theme: 'dark' or theme: 'light') based on the detected or specified theme. This configuration is then applied to the tempusDominus widget using the library's internal functionalities.

Properties of the widget

Property Type Description Default
config array The configuration of the widget. []
containerClass string The class of the container. input-group
cdn boolean Whether to use the CDN. true
floatingLabel boolean Whether to use the floating label. false
format string The format of the date. yyyy/MM/dd HH:mm:ss
formatMonth string The format of the month. long
formatYear string The format of the year. numeric
icon string The icon of the widget. ''
id string The ID of the widget. datetimepicker1
labelClass string The class of the label. form-label
labelContent string The content of the label. ''
spanClass string The class of the span. input-group-text
startOfTheWeek integer The start of the week. 1
template string The template of the widget. '{label}\n{input}\n{span}'

Translation support

The extension supports translation. You can translate the extension into your language, for default the extension supports the following languages.

  • Chinese
  • English
  • French
  • German
  • Portuguese
  • Russian
  • Spanish

Quality code

static-analysis phpstan-level StyleCI

Support versions Yii2

Yii20 Yii22

Testing

Check the documentation testing to learn about testing.

Our social networks

Twitter

License

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