skills.rest
obaDev95
obaDev95COMMUNITY
Explore all skills by this author →
GitHub

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
One-click install
npx skills add https://github.com/obaDev95/myf-agent-skills --skill html-table-components
Or copy as Structured Prompt for Agent▼
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.

Related Skills

Explore More Software Engineering Skills→
obaDev95obaDev95

invoice-html-table-migration

Migrate invoice-domain tables from mc-table to semantic HTML with .mds-table.

Community
Advanced
IgniteUIIgniteUI
169

update-component-styles

Update component styles across themes using the SCSS to Lit CSS workflow.

Official
Intermediate
sinfinsinfin
10

folio-scss

Define Sass/SCSS conventions for Folio component styling with BEM and responsive design.

Official
Intermediate
indykishindykish
2

frontend-design

Plan and implement accessible React and TypeScript frontend interfaces with token-based theming.

Community
Advanced