# MUK Ranger Calendar

## Usage

```html

 <lib-muk-ranger-calendar label="Date Picker" [selectedRangeValue]="null"
  (selectedRangeValueChange)="onChangeDate($event)"> 
  </lib-muk-ranger-calendar>
```

```typescript
import {Component} from '@angular/core';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html'
})
export class AppComponent {

 onChangeDate(event: any) {
   console.log(event);
  }
}
```

### Properties

| Name            | Type        | Description                                    |
|-----------------|-------------|------------------------------------------------|
| label           | string      | The label of the input                         |
| selectedRangeValue  | DateRange<Date>  | The selected Range Value of the input |

### Events

| Name                  | Type             | Description                                                                                                 |
|-----------------------|------------------|-------------------------------------------------------------------------------------------------------------|
| selectedRangeValueChange      | DateRange<Date> | The event emitted when the value of the input changes. The event contains the new value of the input.       |