What problem does it solve?
This Skill prevents table UI drift by standardizing the core table primitives (modes, theming, layout invariants, and idempotent enhancement) so every visual-communicator page uses the same interactive table foundation.
Core Features & Use Cases
- Mode contract (readonly/form/edit-ready): applies the correct
data-ve-mode semantics to ensure rows/cells behave as selectable atoms.
- Light + dark theme conformance: renders with a token-driven approach so visuals repaint correctly on theme toggle.
- No-nested-scrollbars invariant: ensures wide/tall tables expand the page instead of introducing inner scroll containers.
- Idempotent initialization: safely re-runs enhancement without duplicating injected chrome (sort UI, matrix glyphs, CSV wrappers/buttons).
- Baseline zebra/borders styling: applies consistent separators and zebra tinting aligned with the runtime’s design rules.
- Ready-to-inspect sample content: includes a token-spec demo table and a sample readability dataset to validate readability and styling quickly.
Quick Start
Ask your agent to scaffold the base table layer by creating a table with the desired mode (for example, data or matrix) and ensuring amvcp-tables.js is loaded for enhancement.