Skip to content

docs: Fix callout formatting - #6549

Merged
KevinVandy merged 2 commits into
TanStack:mainfrom
mootari:patch-1
Aug 13, 2026
Merged

docs: Fix callout formatting#6549
KevinVandy merged 2 commits into
TanStack:mainfrom
mootari:patch-1

Conversation

@mootari

@mootari mootari commented Aug 13, 2026

Copy link
Copy Markdown
Contributor

🎯 Changes

The callout at the start of https://tanstack.com/table/latest/docs/framework/svelte/quick-start currently uses a plain blockquote, which causes it to get wrapped in additional quotes.

This PR matches the markup to what is used in the devtools docs, with the assumption that it is also supported in the table docs.

The change was made through GitHub's editor and not tested locally.

✅ Checklist

  • I have followed the steps in the Contributing guide.
  • I have tested this code locally with pnpm run test:pr.

🚀 Release Impact

  • This change affects published code, and I have generated a changeset.
  • This change is docs/CI/dev-only (no release).

Summary by CodeRabbit

  • Documentation
    • Standardized notes, tips, and warnings across framework and core guides with consistent Markdown callouts.
    • Improved the visibility and readability of guidance covering filtering, sorting, pagination, selection, state, columns, and other features.
    • Preserved existing instructional content, compatibility guidance, API details, and behavior notes.
    • Clarified selected setup, migration, performance, and deprecation notices.

@coderabbitai

coderabbitai Bot commented Aug 13, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 91acfc18-837d-4f36-a701-808fc58322ed

📥 Commits

Reviewing files that changed from the base of the PR and between 24c202d and 1fa533d.

📒 Files selected for processing (146)
  • docs/framework/alpine/guide/cell-selection.md
  • docs/framework/alpine/guide/column-filtering.md
  • docs/framework/alpine/guide/column-ordering.md
  • docs/framework/alpine/guide/column-pinning.md
  • docs/framework/alpine/guide/column-resizing.md
  • docs/framework/alpine/guide/column-visibility.md
  • docs/framework/alpine/guide/expanding.md
  • docs/framework/alpine/guide/fuzzy-filtering.md
  • docs/framework/alpine/guide/global-filtering.md
  • docs/framework/alpine/guide/grouping.md
  • docs/framework/alpine/guide/pagination.md
  • docs/framework/alpine/guide/row-selection.md
  • docs/framework/alpine/guide/sorting.md
  • docs/framework/alpine/guide/table-state.md
  • docs/framework/angular/guide/cell-selection.md
  • docs/framework/angular/guide/column-filtering.md
  • docs/framework/angular/guide/column-ordering.md
  • docs/framework/angular/guide/column-pinning.md
  • docs/framework/angular/guide/column-visibility.md
  • docs/framework/angular/guide/expanding.md
  • docs/framework/angular/guide/fuzzy-filtering.md
  • docs/framework/angular/guide/global-filtering.md
  • docs/framework/angular/guide/grouping.md
  • docs/framework/angular/guide/migrating.md
  • docs/framework/angular/guide/pagination.md
  • docs/framework/angular/guide/row-selection.md
  • docs/framework/angular/guide/sorting.md
  • docs/framework/angular/guide/table-state.md
  • docs/framework/ember/guide/cell-selection.md
  • docs/framework/ember/guide/column-filtering.md
  • docs/framework/ember/guide/column-ordering.md
  • docs/framework/ember/guide/column-pinning.md
  • docs/framework/ember/guide/column-visibility.md
  • docs/framework/ember/guide/expanding.md
  • docs/framework/ember/guide/fuzzy-filtering.md
  • docs/framework/ember/guide/global-filtering.md
  • docs/framework/ember/guide/grouping.md
  • docs/framework/ember/guide/pagination.md
  • docs/framework/ember/guide/row-selection.md
  • docs/framework/ember/guide/sorting.md
  • docs/framework/ember/guide/table-state.md
  • docs/framework/lit/guide/cell-selection.md
  • docs/framework/lit/guide/column-filtering.md
  • docs/framework/lit/guide/column-ordering.md
  • docs/framework/lit/guide/column-pinning.md
  • docs/framework/lit/guide/column-visibility.md
  • docs/framework/lit/guide/expanding.md
  • docs/framework/lit/guide/fuzzy-filtering.md
  • docs/framework/lit/guide/global-filtering.md
  • docs/framework/lit/guide/grouping.md
  • docs/framework/lit/guide/pagination.md
  • docs/framework/lit/guide/row-selection.md
  • docs/framework/lit/guide/sorting.md
  • docs/framework/lit/guide/table-state.md
  • docs/framework/octane/guide/cell-selection.md
  • docs/framework/octane/guide/column-filtering.md
  • docs/framework/octane/guide/column-ordering.md
  • docs/framework/octane/guide/column-pinning.md
  • docs/framework/octane/guide/column-visibility.md
  • docs/framework/octane/guide/expanding.md
  • docs/framework/octane/guide/fuzzy-filtering.md
  • docs/framework/octane/guide/global-filtering.md
  • docs/framework/octane/guide/grouping.md
  • docs/framework/octane/guide/pagination.md
  • docs/framework/octane/guide/row-selection.md
  • docs/framework/octane/guide/sorting.md
  • docs/framework/octane/guide/table-state.md
  • docs/framework/preact/guide/cell-selection.md
  • docs/framework/preact/guide/column-filtering.md
  • docs/framework/preact/guide/column-ordering.md
  • docs/framework/preact/guide/column-pinning.md
  • docs/framework/preact/guide/column-visibility.md
  • docs/framework/preact/guide/expanding.md
  • docs/framework/preact/guide/fuzzy-filtering.md
  • docs/framework/preact/guide/global-filtering.md
  • docs/framework/preact/guide/grouping.md
  • docs/framework/preact/guide/pagination.md
  • docs/framework/preact/guide/row-selection.md
  • docs/framework/preact/guide/sorting.md
  • docs/framework/preact/guide/table-state.md
  • docs/framework/react/guide/cell-selection.md
  • docs/framework/react/guide/column-filtering.md
  • docs/framework/react/guide/column-ordering.md
  • docs/framework/react/guide/column-pinning.md
  • docs/framework/react/guide/column-visibility.md
  • docs/framework/react/guide/expanding.md
  • docs/framework/react/guide/fuzzy-filtering.md
  • docs/framework/react/guide/global-filtering.md
  • docs/framework/react/guide/grouping.md
  • docs/framework/react/guide/pagination.md
  • docs/framework/react/guide/row-selection.md
  • docs/framework/react/guide/sorting.md
  • docs/framework/react/guide/table-state.md
  • docs/framework/react/guide/use-legacy-table.md
  • docs/framework/solid/guide/cell-selection.md
  • docs/framework/solid/guide/column-filtering.md
  • docs/framework/solid/guide/column-ordering.md
  • docs/framework/solid/guide/column-pinning.md
  • docs/framework/solid/guide/column-visibility.md
  • docs/framework/solid/guide/expanding.md
  • docs/framework/solid/guide/fuzzy-filtering.md
  • docs/framework/solid/guide/global-filtering.md
  • docs/framework/solid/guide/grouping.md
  • docs/framework/solid/guide/pagination.md
  • docs/framework/solid/guide/row-selection.md
  • docs/framework/solid/guide/sorting.md
  • docs/framework/solid/guide/table-state.md
  • docs/framework/svelte/guide/cell-selection.md
  • docs/framework/svelte/guide/column-filtering.md
  • docs/framework/svelte/guide/column-ordering.md
  • docs/framework/svelte/guide/column-pinning.md
  • docs/framework/svelte/guide/column-visibility.md
  • docs/framework/svelte/guide/expanding.md
  • docs/framework/svelte/guide/fuzzy-filtering.md
  • docs/framework/svelte/guide/global-filtering.md
  • docs/framework/svelte/guide/grouping.md
  • docs/framework/svelte/guide/pagination.md
  • docs/framework/svelte/guide/row-selection.md
  • docs/framework/svelte/guide/sorting.md
  • docs/framework/svelte/guide/table-state.md
  • docs/framework/svelte/quick-start.md
  • docs/framework/vanilla/guide/table-state.md
  • docs/framework/vue/guide/cell-selection.md
  • docs/framework/vue/guide/column-filtering.md
  • docs/framework/vue/guide/column-ordering.md
  • docs/framework/vue/guide/column-pinning.md
  • docs/framework/vue/guide/column-visibility.md
  • docs/framework/vue/guide/expanding.md
  • docs/framework/vue/guide/fuzzy-filtering.md
  • docs/framework/vue/guide/global-filtering.md
  • docs/framework/vue/guide/grouping.md
  • docs/framework/vue/guide/pagination.md
  • docs/framework/vue/guide/row-selection.md
  • docs/framework/vue/guide/sorting.md
  • docs/framework/vue/guide/table-state.md
  • docs/guide/cells.md
  • docs/guide/client-side-vs-server-side.md
  • docs/guide/column-defs.md
  • docs/guide/columns.md
  • docs/guide/data.md
  • docs/guide/headers.md
  • docs/guide/helpers.md
  • docs/guide/row-models.md
  • docs/guide/rows.md
  • docs/guide/table-and-column-meta.md
  • docs/overview.md

📝 Walkthrough

Walkthrough

The pull request standardizes documentation callouts across framework guides and core guides. It converts legacy note, tip, warning, and important text to Markdown admonition syntax without changing the documented guidance.

Changes

Documentation admonition standardization

Layer / File(s) Summary
Standardize framework guide callouts
docs/framework/*/guide/...
Replaces legacy note and tip formatting with Markdown admonitions across Alpine, Angular, Ember, Lit, Octane, Preact, React, Solid, Svelte, and Vue guides.
Standardize core documentation callouts
docs/guide/..., docs/overview.md
Converts core guide notes and the overview upgrade notice to [!NOTE] admonitions.
Preserve special callout types
docs/framework/svelte/quick-start.md, docs/framework/react/guide/use-legacy-table.md
Uses IMPORTANT for the Svelte compatibility notice and WARNING for the React deprecation notice.

Estimated code review effort: 2 (Simple) | ~10 minutes

Possibly related PRs

  • TanStack/table#6455: Adds the cell-selection feature and related guides updated by this documentation-formatting change.

Suggested reviewers: kevinvandy

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
Description check ✅ Passed The description includes the required Changes, Checklist, and Release Impact sections and explains the documentation-only change.
Title check ✅ Passed The title clearly and concisely describes the documentation change to callout formatting.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@mootari

mootari commented Aug 13, 2026

Copy link
Copy Markdown
Contributor Author

I spotted another instance on https://tanstack.com/table/latest/docs/guide/data, and there are likely several more. Moving to draft until I get the chance to include all of them.

@mootari
mootari marked this pull request as draft August 13, 2026 10:10
@mootari

mootari commented Aug 13, 2026

Copy link
Copy Markdown
Contributor Author

I see 251 instances across 125 files where callouts use the wrong formatting (matched with ^> (\*\*|)(note|warning|tip|caution|important):\1 and sgm flags).

@KevinVandy That's going to be a rather large PR. Should I include those fixes anyway or would you prefer to make the changes yourself?

Or would you like to see a solution that coerces the blocks into the expected format during build, without changing the actual files?

Edit: Here's a code search link.

Converts all 341 remaining old-style callouts (> **Note:**, > NOTE:,
> **NOTE**:, > Tip:, > **Warning:**, etc.) across the docs to the
GitHub markdown alert syntax ([!NOTE], [!TIP], [!WARNING], [!IMPORTANT])
that tanstack.com renders as styled callouts.

Also fixes one pre-existing alert in client-side-vs-server-side.md that
had its content on the same line as the marker, and trailing whitespace
on the alert marker in the svelte quick-start.

Qualified callouts with custom titles (TypeScript Note, Framework note,
Naming note) are intentionally left as plain blockquotes since the alert
syntax does not support custom titles.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

> Note: a drag emits one change per cell boundary the pointer crosses, so `onCellSelectionChange` fires repeatedly during a drag. If you are syncing selection to a server or a URL, debounce it or commit on `mouseup`.
> [!NOTE]
> a drag emits one change per cell boundary the pointer crosses, so `onCellSelectionChange` fires repeatedly during a drag. If you are syncing selection to a server or a URL, debounce it or commit on `mouseup`.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: Should start with an uppercase letter (there are a few more places).

@mootari mootari changed the title Fix callout formatting in quick start docs docs: Fix callout formatting Aug 13, 2026
@mootari
mootari marked this pull request as ready for review August 13, 2026 13:58
@KevinVandy
KevinVandy merged commit ba704b4 into TanStack:main Aug 13, 2026
2 of 3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants