Skip to content

Releases: palcarazm/bs-darkmode-toggle

v1.1.0

Choose a tag to compare

@palcarazm palcarazm released this 19 Jun 18:03
cc581b9

ℹ️ What's Changed

🆕 Added

  • Dark Mode Debug Monitoring - Introduces a global debug monitor singleton (DarkModeMonitor) that logs darkmode:change events at DEBUG level for easier troubleshooting.

    • Exposes window.Darkmode.MONITOR in both jQuery and ECMAScript builds.
    • implements #66 by @palcarazm in 60ffc03
  • Configurable ARIA Labels for Accessibility - Adds lightAriaLabel and darkAriaLabel options to set descriptive text for the toggle's state, improving screen reader support. Labels update dynamically when the theme changes.

    • Defaults: "Switch to dark mode" and "Switch to light mode".
    • implements #65 by @palcarazm in 6f99280
  • Complete Instance Cleanup (destroy API) - Adds a destroy() method to completely remove a plugin instance, its DOM elements, and event listeners.

    • Prevents memory leaks and allows for safe re-initialization.
    • implements #64 by @palcarazm in 7a0d54e
  • Cross-Instance Synchronization - Multiple toggle instances on the same page now automatically synchronize their visual state when the theme changes. A single global state is shared via darkmode:change events.

  • Custom darkmode:change Event - Dispatches a rich custom event on both the toggle element and all root elements. The event detail contains isLight, theme, source, and roots.

🔁 Changed

  • Refactored to Extend component-lifecycle Library - The DarkModeToggle class now extends Component<"darkmode">, delegating lifecycle management (initialization, attachment, disposal, destruction) to the library's deterministic state machine. Replaces manual _destroyed flag.

    • Public API surface remains unchanged.
    • implements #92 by @palcarazm in 25a41fd
  • Refactored Event System - Replaced manual event managers with the Component's native emit() and EventFactory. Events now use proper typing via ExtendableEventMap and include runtime validation for external events.

  • Refactored Root Element Handling - Changed root element selection from a static, constructor-time choice to a dynamic runtime query. This ensures that elements added or removed from the DOM after initialization are always accurately reflected.

  • Centralized Theme String Derivation - The theme string (e.g., "light" or "dark") is now calculated once within the StateReducer, rather than being derived via duplicate ternary operations across multiple files. This reduces coupling and improves consistency.

  • Migrated Build Toolchain from Grunt to Rollup - Removed all Grunt dependencies and implemented a modern build system with npm scripts and Rollup. This provides better performance, modern distribution outputs (CJS, ESM, TypeScript types), and improved maintainability.

  • Refactored StateReducer Action Handling - The OVERRIDE action now includes runtime validation to ensure it receives a correctly-formatted payload, preventing crashes from malformed external events.

  • Refactored Bootstrap Toggle Integration - Switched from a custom local RENDERER method to the official Methods.RERENDER from the bootstrap5-toggle package for better compatibility.

  • Renamed Cypress Config File - Renamed cypress.config.js to cypress.config.cjs to resolve a module type mismatch that was causing pipeline failures.

  • Updated ARIA Label Handling - ToggleLayout now only calls rerender when the ARIA label changes, improving performance.

✅ Fixed

  • Cancel Initialization on Storage Error - Prevents the plugin from initializing if a storage error occurs (e.g., when localStorage is unavailable or full). The initialization is cancelled with a clear, explicit reason instead of falling back to system preferences.

  • Add Guard Clause for Malformed Payload in StateReducer.OVERRIDE - Adds a runtime check to prevent crashes when the OVERRIDE action receives an undefined, null, or malformed payload. The action now safely returns false.

  • Fixed Unreadable Footer in Dark Mode - The documentation site's footer background color has been updated to ensure it is readable in dark mode.

  • Removed Unused Imports - Cleaned up an unused import to satisfy code quality checks.

🆙 Dependencies, CI/CD, and Others

  • Dependency updates:
    • @commitlint/cli from 20.5.3 to 21.0.2
    • @commitlint/config-conventional from 20.5.3 to 21.0.2
    • commitlint from 20.5.3 to 21.0.2
    • bootstrap5-toggle (for docs) from 5.3.0 to 5.3.3
  • GitHub Actions updates:
    • actions/upload-pages-artifact from 3 to 4 (and then 4 to 5)
    • actions/setup-node from 3 to 6
    • actions/deploy-pages from 4 to 5
    • actions/checkout from 3 to 6
    • actions/configure-pages from 5 to 6
    • cypress-io/github-action from 7.1.9 to 7.1.10 (and then to 7.3.0)
    • SonarSource/sonarqube-scan-action from 7.1.0 to 8.0.0
  • CI/CD improvements:
    • Added Dependabot configuration for version updates in the docs directory.

Full Changelog: v1.0.0...v1.1.0

v1.0.0

Choose a tag to compare

@palcarazm palcarazm released this 07 Apr 07:14
f415e88

ℹ️ What's Changed

🆕 Added

  • Native Button Layout - Added a new layout option that creates a native Bootstrap 5 button instead of the bootstrap-toggle slider component, reducing external dependencies and bundle size.
  • SVG Icons for Toggle - Replaced default text labels with SVG icons (sun/moon) using CSS mask-image technique, including built-in variants for light/dark mode.
  • Local Storage Support - Replaced cookie-only persistence with a flexible storage system supporting multiple providers (cookie, localStorage, none).
  • System Color Scheme Preference - Implemented automatic detection of the user's operating system color scheme preference as a fallback when no saved state exists.
  • Extended Bootstrap 5 Button Styles - Extended the style option to support all Bootstrap 5 button variants (solid and outline).

🔁 Changed

  • Complete TypeScript Rewrite - Rewrote the entire library in TypeScript with a modular architecture for better maintainability and type safety.
  • Refactored Test Architecture - Restructured the test app and Cypress E2E tests into a modular, maintainable architecture using Page Object pattern.
  • Updated Build Target - Changed TypeScript target from ES5 to ES2016 for modern browser support.

✅ Fixed

🆙 Dependencies management, CI/CD and Others

  • Dependency updates:
    • typescript from 5.9.3 to 6.0.2
    • @rollup/plugin-terser from 0.4.4 to 1.0.0
    • cypress-plugin-tab from 1.0.5 to 2.0.0
    • @types/jquery from 3.5.34 to 4.0.0
    • jquery from 3.6.3 to 3.7.0
    • dompurify from 2.4.1 to 3.0.3
    • bootstrap from 5.3.0-alpha1 to 5.3.0-alpha3
    • bootstrap5-toggle from 5.0.4 to 5.0.6
    • cypress from 12.2.0 to 12.12.0
    • grunt from 1.5.3 to 1.6.1
  • GitHub Actions updates:
    • actions/upload-artifact from 6 to 7
    • actions/download-artifact from 7 to 8
    • cypress-io/github-action from 7.1.2 to 7.1.9
    • SonarSource/sonarqube-scan-action from 7.0.0 to 7.1.0
  • CI/CD improvements:
    • Updated docs deployment to trigger on version tags or manually.
    • Added Sonar coverage exclusion patterns for config files.
    • Refactored Gruntfile and Rollup configurations for better build process.
    • Added PostCSS build pipeline to process and minify CSS.
    • Updated GitHub workflows, issue templates, and PR templates.

Full Changelog: v1.0.0-rc1...v1.0.0

v1.0.0-rc1

v1.0.0-rc1 Pre-release
Pre-release

Choose a tag to compare

@palcarazm palcarazm released this 04 Apr 11:36

ℹ️ What's Changed

🆕 Added

  • New CI/CD pipeline with parallel build, unit tests, e2e tests, and coverage reporting (Coveralls, SonarCloud, CodeQL).
    • by @palcarazm
    • in commits across .github/workflows/ci.yml
  • New issue templates for bug reports and feature requests.
    • by @palcarazm
    • in .github/ISSUE_TEMPLATE/01-BUG_REPORT.yml and 02-FEATURE_REQUEST.yml
  • New pull request template.
    • by @palcarazm
    • in .github/PULL_REQUEST_TEMPLATE.md
  • Integrated Dependabot for NPM and GitHub Actions with grouped updates.
  • Added Git hooks with Husky for linting, building, and testing on commit/push.
  • Full TypeScript rewrite of the core plugin logic.
  • Unit tests with Jest for all core modules (StateReducer, OptionResolver, DOMBuilder, CookieManager, Tools).
  • End-to-end tests with Cypress using a custom test application.
  • Official documentation site with GitHub Pages deployment.
  • New build system using Rollup and Grunt tasks for TypeScript compilation and bundling.
    • by @palcarazm
    • in rollup.config.js and Gruntfile.cjs
  • Added ESLint and Commitlint for code and commit message consistency.
    • by @palcarazm
    • in eslint.config.js and commitlint.config.js
  • SonarCloud project configuration for static analysis.

🔁 Changed

  • Migrated from JavaScript to TypeScript for better maintainability and type safety.
  • Replaced UglifyJS with Rollup & Terser for minification.
    • by @palcarazm
    • in rollup.config.js and Gruntfile.cjs
  • Default labels changed from sun/moon SVGs to plain text ("Light"/"Dark").
    • by @palcarazm
    • in src/main/ts/core/OptionResolver.ts and README.md
  • Improved sanitization logic for labels and attributes to prevent XSS.
  • Updated Bootstrap peer dependency to >=5.3.0 <6.
  • Updated jQuery optional dependency to ^4.0.0.
  • Refactored state management into a dedicated StateReducer class.
    • by @palcarazm
    • in src/main/ts/core/StateReducer.ts
  • Refactored cookie handling into a CookieManager class.
    • by @palcarazm
    • in src/main/ts/core/CookieManager.ts
  • Refactored DOM manipulation into a DOMBuilder class.
  • Updated test application to use new test structure and remove DOMPurify dependency.

✅ Fixed

  • Fixed issue where cookie was not being properly deleted when denied.
    • by @palcarazm
    • in src/main/ts/DarkModeToggle.ts and src/main/ts/core/CookieManager.ts
  • Fixed event propagation so change event fires correctly from the toggle element.
  • Fixed silent mode for light, dark, and toggle methods to prevent event triggering.
  • Fixed XSS vulnerability in label rendering by implementing HTML sanitization.
  • Fixed data attribute naming to use kebab-case (e.g., data-light-label instead of data-lightLabel).
    • by @palcarazm
    • in src/main/ts/core/OptionResolver.ts and test/
  • Fixed root element not updating correctly when custom root is specified.

🆙 Bump

  • Updated Node.js versions in CI to 22.x and 24.x.
  • Updated GitHub Actions to latest versions (checkout@v6, setup-node@v6, upload-artifact@v7, etc.).
  • Updated Cypress to ^15.8.1.
  • Updated Jest to ^30.2.0.
  • Updated TypeScript to ^5.9.3.
  • Updated various dev dependencies including ESLint, Rollup, and Grunt plugins.
  • Updated Bootstrap to 5.3.8 in documentation.
  • Updated FontAwesome to 7.2.0 in documentation.

Full Changelog: v1.0.0-alpha2...v1.0.0-rc1

v1.0.0-alpha2

v1.0.0-alpha2 Pre-release
Pre-release

Choose a tag to compare

@palcarazm palcarazm released this 10 Jan 08:21
bca071b

What's Changed

Initial release

Full Changelog: https://github.com/palcarazm/bs-darkmode-toggle/commits/v1.0.0-alpha2