html-table-components

Convert legacy mc-table widgets into standard HTML tables with mds-table.

Updated Apr 15, 2026

Search Tags:#a11y #css #migration #composables #semantics #html-table #ui-myfinance

Ready to run

npx skills add https://github.com/obaDev95/myf-agent-skills --skill html-table-components

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: html-table-components
Source: https://github.com/obaDev95/myf-agent-skills/tree/main/skills/html-table-components
Command: npx skills add https://github.com/obaDev95/myf-agent-skills --skill html-table-components

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Migrate from legacy <mc-table> to semantic HTML tables with .mds-table, ensuring parity in behavior and appearance across the ui-myfinance ecosystem.

Core Features & Use Cases

Establish canonical single-file HTML table component structure for invoice tables.
Preserve logic and accessibility while migrating to standard HTML tables.
Use for any <mc-table> migration to <table class="mds-table"> and for related table DOM/SCSS work.

Quick Start

Start by locating the HtmlTable migration path for ui-myfinance and apply the canonical table template to the target component.

Frequently Asked Questions about html-table-components

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

FAQPage Schema

How do I migrate legacy mc-table widgets to semantic HTML tables?▼

Migrate legacy mc-table widgets to semantic HTML tables by converting them to standard <table class="mds-table"> structures, preserving selection, sorting, and expansion behavior through a composable-driven model.

What is the canonical structure for invoice table migration in ui-myfinance?▼

The canonical structure for invoice table migration in ui-myfinance is a single-file HTML table component using .mds-table classes, enforcing data-attribute conventions and shared SCSS for deterministic output.

How do I preserve accessibility when converting legacy tables to standard HTML?▼

Preserve accessibility when converting legacy tables to standard HTML by applying semantic table elements and a composable-driven model that enforces a11y conventions, ensuring parity in behavior and appearance.

Does the HTML table migration workflow support responsive behavior and sorting?▼

The HTML table migration workflow supports responsive behavior, sorting, and selection by applying a unified composable-driven model that preserves the original mc-table logic through deterministic output and testability.

What are the limitations of the composable-driven model for table migration?▼

Limitations of the composable-driven model include strict adherence to repository-defined migration workflow rules, data-attribute conventions, and shared SCSS usage to ensure deterministic output and testability.