> ## Documentation Index
> Fetch the complete documentation index at: https://docs.codenullapp.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Calendar list

> Add a control Type CalendarList

Add a control Type **CalendarList**

<img src="https://mintcdn.com/codenull/fUND-Qmj85v5Oam-/images/zFHe1znVrynzp0QrueU7.png?fit=max&auto=format&n=fUND-Qmj85v5Oam-&q=85&s=ea1d31069f67d5eb9521ba6d3e9c2d05" alt="" width="686" height="542" data-path="images/zFHe1znVrynzp0QrueU7.png" />

<img src="https://mintcdn.com/codenull/fUND-Qmj85v5Oam-/images/w2rimJz45OuKn5sMtKZL.png?fit=max&auto=format&n=fUND-Qmj85v5Oam-&q=85&s=e5f7852c99e51ed665c8c169d483869f" alt="" width="1642" height="830" data-path="images/w2rimJz45OuKn5sMtKZL.png" />

#### Datasource configuration:

This configuration works the same as the other datasources, but we have to set up a new section

#### Calendar Configuration:

* ***Label Field***: Field used to render item info in the calendar component
* ***Start Date Field***: Field to determine the start date of the item
* ***End Date Field:*** Field to determine the end date of the item

#### Default click action:

Set up a default click when the event/item is selected like navigate to the detail.

<img src="https://mintcdn.com/codenull/9RtgKoAtzvpYtN-c/images/5qeQzKZIX7BkYItsaXjs.png?fit=max&auto=format&n=9RtgKoAtzvpYtN-c&q=85&s=588de56a15da8b5648e0df5300dfe505" alt="" width="661" height="374" data-path="images/5qeQzKZIX7BkYItsaXjs.png" />

#### Item actions:

Add extra actions for every item, like delete, or navigate to other feature

<img src="https://mintcdn.com/codenull/fUND-Qmj85v5Oam-/images/eTTpyL2x9O6cb3WJYPnA.png?fit=max&auto=format&n=fUND-Qmj85v5Oam-&q=85&s=764386f14298fa75d2a249c1063daf49" alt="" width="659" height="187" data-path="images/eTTpyL2x9O6cb3WJYPnA.png" />

<img src="https://mintcdn.com/codenull/9RtgKoAtzvpYtN-c/images/bVSAk5WvOmJRTkH0rQyx.png?fit=max&auto=format&n=9RtgKoAtzvpYtN-c&q=85&s=6c33c44f07ce10c8fceebb6c01cd28db" alt="" width="298" height="224" data-path="images/bVSAk5WvOmJRTkH0rQyx.png" />

**Global actions:**

Add an action that is valid globally in the complete control and not for a specific item

<img src="https://mintcdn.com/codenull/9RtgKoAtzvpYtN-c/images/CeNkurYOcdEcNNknTkXo.png?fit=max&auto=format&n=9RtgKoAtzvpYtN-c&q=85&s=fa1af5106428578cf2d312f08fc4ff65" alt="" width="666" height="176" data-path="images/CeNkurYOcdEcNNknTkXo.png" />

<img src="https://mintcdn.com/codenull/fUND-Qmj85v5Oam-/images/tst2DMcPV6m7DvdVNvWV.png?fit=max&auto=format&n=fUND-Qmj85v5Oam-&q=85&s=2e39f6152f18ba72699589aa3aa7f9ae" alt="" width="411" height="193" data-path="images/tst2DMcPV6m7DvdVNvWV.png" />
