⚠️ Mixin UI is currently in alpha stage
Documentation
Customization
Components

Input Date

Used to enter or select a date value.

Import

import {
  XInputDate,
  XControl,
  XPopover,
  XCalendar
} from '@mixin-ui/kit';

Usage

@Component({
  template: `
    <x-input-date>
      <input x-control [(ngModel)]="value" />
      <x-calendar *x-popover />
    </x-input-date>
  `
})
export class Usage {
  readonly value = signal(new Date());
}

API

Inputs

NameTypeDefault
variant
enum
outline
size
enum
md
radius
enum
md
pattern
string
"dd/MM/yyyy"
min
Date
Date(1900, 0, 1)
min
Date
Date(2100, 11, 31)
showFiller
boolean
false
fillerChar
string
"_"
popoverOnFocus
boolean
true
popoverStretch
enum
auto
popoverMinWidth
number
popoverMaxWidth
number
Previous
Icon