---
title: "Multi-Column Sorting"
output: rmarkdown::html_vignette
vignette: >
  %\VignetteIndexEntry{Multi-Column Sorting}
  %\VignetteEngine{knitr::rmarkdown}
  %\VignetteEncoding{UTF-8}
---

```{r, include = FALSE}
knitr::opts_chunk$set(
  collapse = TRUE,
  comment = "#>"
)
```

`dtsmartr` supports modern, spreadsheet-like multi-column sorting natively by interacting with column headers.

## 1. Single Column Sort
Clicking directly anywhere on a column header card triggers sorting:
- **First Click**: Sorts the column ascending (`↑`).
- **Second Click**: Sorts the column descending (`↓`).
- **Third Click**: Clears the sort state for that column.

---

## 2. Multi-Column Sort Chain
To sort by multiple columns sequentially (e.g., sort by `cyl` first, then by `mpg` within each cylinder class):
- Click the first column header (e.g., `cyl`) to set the primary sort.
- **Hold `Shift` and click** the second column header (e.g., `mpg`) to append it to the sort chain.
- The UI displays numbered emoji badges (e.g., `1️⃣ ↑`, `2️⃣ ↓`) next to the column names to show the sorting priority and direction.
- The active sort chain is also printed in the grid's top toolbar (e.g., `↕ cyl asc (1) -> mpg desc (2)`).

---

## 3. Clearing Sorts
- **Clear a Single Column**: Simply `Shift + Click` the sorted column header until its sort direction indicator disappears.
- **Clear All Sorts**: Click the **Clear sort** button (refresh icon) inside the top-right toolbar.

## 4. Live Multi-Column Sorting Example
Try sorting by cylinders (`cyl`) first, and then sorting by miles-per-gallon (`mpg`) inside the cylinder groups:

```{r}
library(dtsmartr)
dtsmartr(mtcars)
```