Features
Column Types

Column Types

Sunday supports 17 different column types to track various types of data.

Available Column Types

TypeDescriptionExample Value
statusProgress statusDone, Working, Stuck
personTeam member assignmentUser ID(s)
dateSingle date2025-01-15
priorityImportance levelCritical, High, Medium, Low
textFree-form text"Meeting notes..."
numberNumeric value42
timelineDate rangeJan 15 - Jan 30
timeTrackingTime entries2h 30m
labelsTags/categories["Frontend", "Urgent"]
dropdownSelect from options"Option A"
linkURLhttps://example.com (opens in a new tab)
emailEmail addressjohn@example.com
phonePhone number+1-555-0123
checkboxBoolean toggletrue/false
ratingStar rating4/5
progressPercentage75%
locationLocation/address"New York, NY"
filesFile attachments[...files]

Status Column

Track task progress with predefined statuses.

Default Statuses

StatusColorMeaning
DoneGreenCompleted
WorkingBlueIn progress
StuckRedBlocked
PendingGrayNot started
ReviewYellowNeeds review

Custom Color Rules

Add colors for custom values:

{
  type: "status",
  colorRules: [
    { value: "done", color: "#22C55E" },
    { value: "working", color: "#3B82F6" },
    { value: "stuck", color: "#EF4444" }
  ]
}

Person Column

Assign team members to tasks.

  • Multiple assignees supported
  • Displays user avatars
  • Click to add/remove people

Date Column

Single date picker for deadlines, milestones, etc.

  • Calendar picker UI
  • Relative date display (Today, Tomorrow, etc.)
  • Overdue highlighting

Priority Column

Mark task importance.

PriorityColorUse Case
CriticalRedUrgent, blocking issues
HighOrangeImportant tasks
MediumYellowNormal priority
LowGrayNice-to-have

Text Column

Free-form text input for notes, descriptions, or any text data.

  • Supports multi-line text
  • Expandable on click

Number Column

Numeric data entry.

  • Supports integers and decimals
  • Optional unit suffix
  • Sortable

Timeline Column

Date range for task duration.

{
  startDate: "2025-01-15",
  endDate: "2025-01-30"
}
  • Visualized as bars in Timeline view
  • Drag to adjust duration
  • Shows in calendar views

Time Tracking Column

Track time spent on tasks.

  • Start/stop timer
  • Manual time entries
  • Displays total duration

See Time Tracking for more details.

Labels Column

Tag tasks with multiple labels.

  • Predefined label options
  • Color-coded tags
  • Filter by labels

Dropdown Column

Select from predefined options.

{
  type: "dropdown",
  options: ["Option A", "Option B", "Option C"]
}

Link Column

Store URLs with clickable links.

  • Auto-detects URLs
  • Opens in new tab

Email Column

Email addresses with mailto: link.

  • Click to compose email
  • Validation for email format

Phone Column

Phone numbers with tel: link.

  • Click to call
  • Supports international formats

Checkbox Column

Simple boolean toggle.

  • Check/uncheck via click
  • Filter by checked/unchecked

Rating Column

Star rating (1-5).

  • Click to set rating
  • Visual star display

Progress Column

Percentage progress bar.

  • 0-100% range
  • Visual progress indicator
  • Drag to adjust

Location Column

Address or location text.

  • Free-form text
  • Could integrate with maps

Files Column

File attachments.

  • Multiple files per task
  • Upload/download
  • Preview support

Adding Columns

Via UI

  1. Click + in the table header
  2. Select column type
  3. Configure settings
  4. Enter column name

Via API

POST /api/boards/[boardId]/columns
Content-Type: application/json
 
{
  "name": "Deadline",
  "type": "date",
  "required": false,
  "description": "Task deadline"
}

Column Configuration

interface Column {
  id: string
  name: string
  type: ColumnType
  width?: number           // Pixel width
  visible?: boolean        // Show/hide
  required?: boolean       // Required field
  defaultValue?: string    // Default value
  options?: string[]       // For dropdown
  colorRules?: {           // Custom colors
    value: string
    color: string
  }[]
  description?: string     // Help text
}

Store Actions

import { useAppStore } from '@/lib/store'
 
// Column actions
const addColumn = useAppStore((s) => s.addColumn)
const updateColumn = useAppStore((s) => s.updateColumn)
const deleteColumn = useAppStore((s) => s.deleteColumn)
const reorderColumns = useAppStore((s) => s.reorderColumns)
 
// Add column
addColumn(boardId, {
  name: 'Priority',
  type: 'priority'
})
 
// Update column
updateColumn(boardId, columnId, {
  name: 'New Name',
  width: 150
})
 
// Reorder columns
reorderColumns(boardId, ['col-1', 'col-3', 'col-2'])