## Date Selection

The date selection interface allows setting a **date** or a **date range**.

![Date selection interface](images/Selection_Date_Range.png)

| № | Element | Description |
|---|---------|-------------|
| **1** | Left panel | Calendar for selecting the start date |
| **2** | Right panel | Calendar for selecting the end date |
| **3** | Selected month indicator | Display of the current month in the panel |
| **4** | Selected year indicator | Display of the current year in the panel |
| **5** | Month or year selection | Navigation by months |
| **6** | Range start date | Start date of the selected period |
| **7** | Range end date | End date of the selected period |
| **8** | Selected range | Visual highlighting of the period |
| **9** | Cancel (**Cancel**) | Cancel selection, exit the calendar |
| **10** | Current date | Highlighting of today's date |
| **11** | Apply (**Apply**) | Apply the selection |
| **12** | Clear (**Clear**) | Reset the selection |
| **13** | Selected range |  |

### Date selection procedure
#### Selecting a date
1. **Select the month** in the corresponding panel
2. **Double-click** the left mouse button on the date
   - For touch screen: **double-tap**
3. The date will be **highlighted with a rounded background**

#### Selecting a date range
1. In the **left panel**, select the **start date** of the range
2. In the **right panel**, select the **end date** of the range
3. The selected interval will be **highlighted**
4. **Confirm** the range selection with the **"Apply"** button

### Selection controls
- **"Apply"** button — confirms the selected range
- **"Clear"** button — resets the selection
- Press to **select month** ![](images/Select_Mounth.png)
- Press to **select year** ![](images/Select_Year.png)

```{note}
To select a date range, use the left panel for the start date and the right panel for the end date. The selected period will be visually highlighted.
```

```{note}
Selecting a date range within a single month is possible on either panel
```
