> For the complete documentation index, see [llms.txt](https://docs.airdev.co/canvas-pages-and-modules/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.airdev.co/canvas-pages-and-modules/2.0.0/modules/to-do-list.md).

# To-do List

## Overview

This is a fully-responsive block that includes a to-do list UI for displaying a task name, description, due date, labels, and assignees. Users can check the box in front of the task name to mark a task as completed. No workflows are associated with this block.

## Structure

* When this block is added to a page, it is placed within a group called ***Blocks container 860 (do not rename)*** on the page. This group contains the responsive settings for all blocks.
* ***Group Main header*** contains the title, description, sort by dropdown, and a button for adding a task.
* ***Group Main task tile*** contains the ***RepeatingGroup Dummy*** for displaying a list of things.
* ***Group Main empty state*** will be shown when there are no tasks to display.
* You can add additional UI components to the group by resizing ***Group Main PLACEHOLDER***. Please ensure the placeholder group is not overlapping with any other elements. Any overlapping elements will lead to an error in page responsiveness.

## How to set up

* Update the data source of ***Dropdown Sort by*** and add workflows to ***Button Add task***.
* Update the data source of ***RepeatingGroup Dummy*** and update all the elements within the repeating group to refer to current cell's data.
* Add additional workflows to ***IonicIcon complete task***.
* Update the ***Multidropdown tags's*** data source (if applicable)
* Hide or show any of the following groups depending on your to-do list needs:
  * ***Group Inner task details*** - shows the task description
  * ***Group Collapsible multidropdown*** - shows a list of tags
  * ***Group Collapsible task assignees*** - shows a list of users assigned to the task
  * Note: You can hide a group by selecting the group name and unchecking the box for *This element is visible on page load*
* You can add additional UI components to the group by resizing ***Group content PLACEHOLDER***. Please ensure the placeholder group is not overlapping with any other elements. Any overlapping elements will lead to an error in page responsiveness.
