Components

Checklist

An interactive checklist component for tracking completion of tasks and requirements in government applications, with progress indicators and bilingual support.

Basic Checklist

Simple checklist with progress tracking for task completion.

Setup Tasks

0%
Install dependencies
Configure environment
Setup database
Deploy application

Government Application Requirements

Document checklist for government service applications with bilingual labels and requirement indicators.

Trade License Application / ট্রেড লাইসেন্স আবেদন

Complete all required documents / সকল আবশ্যক কাগজপত্র সংগ্রহ করুন

Required documents completed: 0/4In Progress

Required Documents

0%
National ID Card / জাতীয় পরিচয়পত্র
Upload clear copy of both sides
Required
Birth Certificate / জন্ম নিবন্ধন
Certified copy from registrar office
Required
Address Proof / ঠিকানার প্রমাণ
Utility bill not older than 3 months
Required
Passport Size Photo / পাসপোর্ট সাইজ ছবি
Recent photograph with white background
Required
Income Certificate / আয়ের সনদ
From competent authority (if applicable)

Process Status Tracking

Step-by-step process tracking for application status with visual progress indicators.

Application Processing Status / আবেদন প্রক্রিয়াকরণের অবস্থা

Application Received / আবেদন গৃহীত

Your application has been submitted

2

Document Verification / কাগজপত্র যাচাই

Checking submitted documents

3

Background Check / পটভূমি যাচাই

Verifying information

4

Approval Process / অনুমোদন প্রক্রিয়া

Final review and approval

5

Certificate Ready / সনদ প্রস্তুত

Ready for collection

Use Cases

Document Collection

Track required documents for applications, ensure completeness before submission

Process Tracking

Monitor application status, verification stages, approval processes

User Onboarding

Guide new users through setup steps, profile completion, verification tasks

Compliance Audits

Ensure regulatory compliance, track mandatory requirements, audit trails

Best Practices

Organization & Structure

  • • Group related items logically and use clear section headers
  • • Show progress indicators to motivate completion
  • • Distinguish between required and optional items clearly
  • • Provide estimated completion times for complex tasks

User Experience

  • • Provide immediate visual feedback for completed items
  • • Allow users to easily undo completed items if needed
  • • Use descriptive labels and helpful context information
  • • Support keyboard navigation and screen readers

Government Standards

  • • Include bilingual labels for citizen accessibility
  • • Maintain audit trails for compliance tracking
  • • Provide clear status updates and next steps
  • • Follow accessibility guidelines for inclusive design

Usage Guidelines

Do

  • Use clear, action-oriented labels for each item
  • Show progress indicators to motivate completion
  • Distinguish between required and optional items
  • Provide context and helpful descriptions
  • Save progress automatically to prevent data loss
  • Use bilingual labels for government applications

Don't

  • Make checklists too long without logical grouping
  • Use vague or ambiguous item descriptions
  • Hide required items among optional ones
  • Allow users to proceed without required items
  • Forget to save user progress between sessions
  • Overwhelm users with too many items at once

Component Specifications

Detailed specifications and characteristics of the Checklist component for implementation guidance.

SpecificationDetailsPurpose & Usage
Component TypeSelection ControlAllows users to select multiple options from a list of choices
Complexity LevelMediumModerate complexity with state management and validation features
Selection TypesMultiple selection, Indeterminate state, Required validationFlexible selection patterns for various government form requirements
State ManagementChecked, Unchecked, Indeterminate, Disabled, ErrorClear visual feedback for different selection states and validation
Layout OptionsVertical list, Horizontal group, Grid layout, Nested structureAdaptable layouts for different form sections and space constraints
Accessibility FeaturesKeyboard navigation, Screen reader support, Focus management, ARIA labelsEnsures usability for all citizens including those with disabilities
Language SupportEnglish, Bengali (বাংলা)Bilingual label and description support for government applications
Design SystemColor tokens, Typography scale, Spacing units, Icon systemConsistent with CivixUI design principles and government branding
Validation FeaturesRequired selection, Minimum/Maximum selection, Custom rulesEnsures proper selection validation for government form requirements
Use CasesMulti-select forms, Preference selection, Terms agreement, Document requirementsEssential for collecting multiple selections in government service applications

Accessibility

  • • Full keyboard navigation support with Tab and Space keys
  • • Screen reader announcements for completion status changes
  • • ARIA labels and roles for proper component identification
  • • High contrast mode support for all visual states
  • • Clear focus indicators that meet WCAG standards
  • • Progress updates announced to assistive technologies
  • • Required field indicators accessible to screen readers
  • • Logical tab order through checklist items