Task Management with Custom Actions

Build a task management mobile application that provides accessible custom actions for screen reader users to efficiently manage their tasks.

Requirements

Create a task list component that allows users to view and interact with tasks. Each task should support custom accessibility actions that enable screen reader users to:

1. Toggle task completion status (mark complete/incomplete)
2. Delete tasks from the list

The application should be fully accessible to users with visual impairments, allowing them to perform these task management operations through screen reader custom actions without requiring multiple taps or navigation steps.

Implementation Details

• Create a task list that displays at least 3 sample tasks
• Each task should show a title and completion status
• Implement custom accessibility actions that appear in the screen reader's actions rotor/menu
• Actions should have clear, descriptive labels
• When actions are performed, provide appropriate feedback (e.g., updating task state, showing confirmation)

Test Cases

• Launching the app displays a list of tasks with proper accessibility labels @test
• Each task has custom accessibility actions available for screen readers @test
• Activating the "Mark Complete" action updates the task's completion status @test
• Activating the "Delete" action removes the task from the list @test

Implementation

@generates

API

interface Task {
  id: string;
  title: string;
  completed: boolean;
}

interface TaskListProps {
  initialTasks: Task[];
}

export default function TaskList(props: TaskListProps): JSX.Element;

Dependencies { .dependencies }

react-native { .dependency }

A framework for building native mobile applications using React and JavaScript/TypeScript.