data-table

Name: data-table
Availability: InStock
Author: twofoldtech-dakota

Render accessible data tables with sorting, filtering, and pagination in SvelteKit.

1|Updated Feb 20, 2026

Search Tags:#tailwind #pagination #sorting #sveltekit #data-table #neo-brutalist

Ready to run

npx skills add https://github.com/twofoldtech-dakota/plugin-migration-planner --skill data-table

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: data-table
Source: https://github.com/twofoldtech-dakota/plugin-migration-planner/tree/main/.claude/skills/data-table
Command: npx skills add https://github.com/twofoldtech-dakota/plugin-migration-planner --skill data-table

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Data-table engineering to render datasets as accessible, well-structured tables in SvelteKit apps, automatically choosing layouts and interactions based on data shape.

Core Features & Use Cases

Analyze data shape and automatically select table mode (static, client, server).
Configure columns with alignment, formatting, and responsive priority.
Implement sorting, filtering, and pagination with semantic markup and keyboard navigation.
Support responsive patterns like priority-based column hiding and mobile card layouts.
Ensure accessibility with proper table semantics, captions, and keyboard interactions.

Quick Start

Render a responsive, accessible data table for the given dataset with sorting, pagination, and keyboard navigation.

Frequently Asked Questions about data-table

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I create accessible data tables in SvelteKit with sorting and pagination?▼

To create accessible data tables in SvelteKit, use a server-first approach with Svelte 5 stores that automatically implements semantic markup, sorting, pagination, and keyboard navigation for your web app datasets.

How does a data table automatically choose between client and server modes?▼

A data table automatically selects between static, client, and server modes by analyzing the shape of your dataset, optimizing rendering and interactions for API responses, arrays, or database queries.

Can I implement responsive column hiding and mobile card layouts for data tables?▼

Yes, you can implement responsive patterns for data tables including priority-based column hiding and mobile card layouts, ensuring datasets remain accessible and well-structured across different screen sizes.

What is the best way to configure table columns for dashboards and admin panels?▼

The best way to configure table columns for dashboards and admin panels is through smart column configuration, allowing you to set alignment, formatting, and responsive priority for well-formatted data displays.

Does this data table approach support keyboard navigation and semantic markup?▼

Yes, this data table approach fully supports keyboard navigation and semantic markup, including proper table semantics and captions to ensure accessibility compliance for data-rich web pages.

When should I use a server-first approach for data tables?▼

Use a server-first approach for data tables when handling large datasets from API responses or database queries in SvelteKit apps, with optional client interactivity via Svelte 5 stores for sorting and filtering.