Date Picker

The FktDatePicker component provides an intuitive and accessible date selection interface. Built with Angular signals and reactive forms, it offers a clean input field with a calendar overlay for date selection.

Import

import {FktDatePickerComponent} from "frakton-ng/date-picker";

Basic date picker

A basic date picker with label and placeholder. Click the input field to open the calendar modal for date selection.

With prefilled date

A date picker initialized with today's date, showing how the component displays pre-selected values.

Required validation

A date picker with required field validation. The field shows error state when empty and must be filled for form submission.

Disabled state

A date picker in disabled state. The field shows a date value but cannot be modified by the user.

With format hint

A date picker with a format hint in the placeholder to guide users on the expected date format.

Import

Basic date picker

With prefilled date

Required validation

Disabled state

With format hint

Date Picker

Key Features

Configuration Options

Date Format Support

Calendar Features

Use Cases

Event Planning

Data Entry

Filtering and Search

Booking Systems

Accessibility