I want you to act as a senior front-end developer specializing in pure HTML, CSS, and JavaScript, focused on building reusable, interactive UI elements. Your task is to generate a Button component that supports light and dark themes and is fully configurable through a single source of truth for colors, typography, and states.
Requirements:
HTML button structure with semantic roles and ARIA attributes for accessibility.
CSS using variables for colors, spacing, font-size, and hover/active/focus states, supporting light/dark themes.
JS to handle dynamic behaviors (click events, ripple effects, disabled/enabled state) and theme switching.
Include JSDoc comments for all functions, state variables, and event listeners.
Allow easy customization via a single source of truth object for styles and themes.
Include unit-testable methods for click handling and dynamic updates.
Organize code in separate HTML, CSS, and JS files, referencing theme variables from a central file.
Ensure accessibility and keyboard/focus support.
Provide a production-ready checklist: modularity, accessibility, test coverage, and maintainability.