Skip to content

Updated demo samples and highcontrast theme changes for Blazor Toolkit - #85

Merged
Indhumathy-Loganathan merged 13 commits into
syncfusion:readiness-correctionsfrom
JafarAli3783:main
Sep 24, 2026
Merged

Updated demo samples and highcontrast theme changes for Blazor Toolkit#85
Indhumathy-Loganathan merged 13 commits into
syncfusion:readiness-correctionsfrom
JafarAli3783:main

Conversation

@JafarAli3783

@JafarAli3783 JafarAli3783 commented Sep 24, 2026 •
edited
Loading

Copy link
Copy Markdown

Summary

This PR introduces comprehensive High Contrast theme accessibility enhancements across Syncfusion components, improving keyboard navigation, focus visibility, interaction states, and overall alignment with Windows High Contrast behavior and Microsoft accessibility guidelines.

Additionally, this update includes template support for the Getting Started page, enabling users to quickly configure and adopt High Contrast accessibility features, along with updates to Toolkit component samples to showcase the latest accessibility improvements and theme behavior.

The changes focus on the following areas:

  • Enhanced High Contrast rendering across components using semantic system color tokens and improved forced-colors support.
  • Improved accessibility experience by refining hover, focus, active, selected, and disabled interaction states for keyboard and assistive technology users.
  • Added template support for the Getting Started page to streamline High Contrast theme onboarding and configuration.
  • Updated Syncfusion Toolkit component samples to reflect the latest High Contrast styling, accessibility behavior, and interaction patterns.
  • Improved maintainability of the High Contrast theme architecture through better token usage, reduced duplication, and consistent styling patterns.

Key Changes

High Contrast Theme Improvements

  • Standardized High Contrast styling across supported Syncfusion components
  • Improved focus indicators using system colors such as Highlight, HighlightText, CanvasText, and ButtonText
  • Enhanced hover, focus, active, selected, and disabled state rendering
  • Reduced reliance on hardcoded color values in favor of semantic system color tokens
  • Improved consistency of component behavior in forced-colors environments
  • Better alignment with Windows High Contrast accessibility expectations

Component Enhancements

Button

  • Refined High Contrast styles for:
    • Default
    • Primary
    • Success
    • Warning
    • Danger
    • Info
  • Improved visual feedback during keyboard and mouse interactions
  • Enhanced outline button accessibility behavior

ButtonGroup / MultiSelection

  • Improved focus and selection state visibility
  • Enhanced keyboard navigation experience
  • Updated outline button styling for selected and focused states
  • Improved consistency between hover, focus, and selected interactions

RadioButton

  • Improved High Contrast rendering for enabled and disabled states
  • Enhanced keyboard focus visibility
  • Better visual distinction between interaction states

Calendar

  • Updated focused-date styling
  • Improved keyboard navigation indicators
  • Enhanced visibility using accessible outline treatments and system colors
  • Preserved existing today-date behavior while improving focus cues

Theme Architecture Improvements

  • Consolidated High Contrast theme variables and tokens
  • Reduced duplicate color definitions
  • Improved variable naming consistency
  • Established a clearer source of truth for High Contrast theme styling
  • Improved scalability and maintainability for future accessibility enhancements

Validation

  • Verify High Contrast rendering across all updated components
  • Validate hover, focus, active, selected, and disabled states
  • Test keyboard navigation and focus visibility
  • Verify behavior in Windows High Contrast mode
  • Confirm correct rendering of system color tokens in forced-colors environments
  • Verify Button, ButtonGroup, MultiSelection, RadioButton, and Calendar interactions
  • Ensure no regressions in other themes
  • Validate accessibility improvements against expected Microsoft High Contrast behavior
  • Smoke-test affected samples and demos

JafarAli3783 and others added 13 commits August 26, 2026 22:49
@JafarAli3783
1047327: Temp commit for highcontrast theme
68dce77
@dependabot @Indhumathy-Loganathan @PrinceOliver
deps(npm): bump braces and gulp (syncfusion#52)
6144892 
* deps(npm): bump braces and gulp

Bumps [braces](https://github.com/micromatch/braces) to 3.0.3 and updates ancestor dependency [gulp](https://github.com/gulpjs/gulp). These dependencies need to be updated together.


Updates `braces` from 2.3.2 to 3.0.3
- [Changelog](https://github.com/micromatch/braces/blob/master/CHANGELOG.md)
- [Commits](https://github.com/micromatch/braces/commits/3.0.3)

Updates `gulp` from 4.0.2 to 5.0.1
- [Release notes](https://github.com/gulpjs/gulp/releases)
- [Changelog](https://github.com/gulpjs/gulp/blob/master/CHANGELOG.md)
- [Commits](gulpjs/gulp@v4.0.2...v5.0.1)

---
updated-dependencies:
- dependency-name: braces
  dependency-version: 3.0.3
  dependency-type: indirect
- dependency-name: gulp
  dependency-version: 5.0.1
  dependency-type: direct:development
...

Signed-off-by: dependabot[bot] <support@github.com>

* Resolved the issues in the ESLint security job.

* fix(npm): regenerate package-lock.json for gulp 5.0.1

* fix(npm): add glob as direct dep for gulpfile (gulp 5)

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Indhumathy-Loganathan <indhumathy.loganathan@syncfusion.com>
Co-authored-by: Indhumathy-Loganathan <58062424+Indhumathy-Loganathan@users.noreply.github.com>
Co-authored-by: Prince Oliver <31838171+PrinceOliver@users.noreply.github.com>
@dependabot
deps(npm): bump sass from 1.104.0 to 1.104.1 (syncfusion#75)
0ffb155 
Bumps [sass](https://github.com/sass/dart-sass) from 1.104.0 to 1.104.1.
- [Release notes](https://github.com/sass/dart-sass/releases)
- [Changelog](https://github.com/sass/dart-sass/blob/main/CHANGELOG.md)
- [Commits](sass/dart-sass@1.104.0...1.104.1)

---
updated-dependencies:
- dependency-name: sass
  dependency-version: 1.104.1
  dependency-type: direct:development
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
@dependabot @PrinceOliver
deps(npm): bump glob from 7.2.3 to 13.0.6 (syncfusion#76)
025c2b3 
* deps(npm): bump glob from 7.2.3 to 13.0.6

Bumps [glob](https://github.com/isaacs/node-glob) from 7.2.3 to 13.0.6.
- [Changelog](https://github.com/isaacs/node-glob/blob/main/changelog.md)
- [Commits](isaacs/node-glob@v7.2.3...v13.0.6)

---
updated-dependencies:
- dependency-name: glob
  dependency-version: 13.0.6
  dependency-type: direct:development
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>

* Refactor SCSS processing in gulpfile.js

* Refactor gulp task execution in project file

Updated the RunGulpOnceBeforeBuild target to use 'npx' for gulp execution and modified the message text.

* Updated package-lock.json

* updated gulpfile.js

* updated codeql.yml

* updated working directory in codeql.yml

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Prince Oliver <31838171+PrinceOliver@users.noreply.github.com>
Co-authored-by: PrinceOliver <prince.rajarathinam@syncfusion.com>
@JafarAli3783
1047327: Reverted temp commit for highcontrast theme.
f822c83
@JafarAli3783
Merge branch 'syncfusion:main' into main
bbde82b
@JafarAli3783
1055862: Migrating samples folder and gulpfile changes from master to…
9c5b392 
… forked main branch.
@JafarAli3783
1055862: Migrating source and styles folder changes from master to fo…
28df85d 
…rked main branch.
@JafarAli3783
1055862: Migrating the fixes resolved in master branch to github main…
028f58d 
… branch.
@JafarAli3783
1055862: Migrating the missed fixes in previous commit from master br…
80b4152 
…anch to github main branch.
@JafarAli3783
1055862: Migrated dialog component related fixes and button component…
7f8bb53 
… changes from master to github main branch.
@JafarAli3783
1055862: Migrated numerictextbox and removed release notes changes fr…
4f8d9df 
…om master to github main branch.
@JafarAli3783
1055862: Migrated removing the release notes file from master to gith…
5d5e921 
…ub main branch.
@Indhumathy-Loganathan
Indhumathy-Loganathan merged commit 67971ad into syncfusion:readiness-corrections Sep 24, 2026
PrinceOliver added a commit that referenced this pull request Sep 30, 2026
@Indhumathy-Loganathan @PrinceOliver
CodeStudio @JafarAli3783 @dependabot
Included Contrast theme support, readiness reports and updated sample…
5c11f9c 
… browser UI (#86)

* Readiness validation related corrections included.

* Readiness validation related corrections added.

* Documents added.

* Fixed the defects identified in the audit.

* Fixed the defects identified in the audit.

* CSS isolation related corrections included.

* CycloneDX arguments corrected.

* Evidence documents for performance category included.

* Add VPAT 2.5 INT (EN 301 549) accessibility conformance report (#80)

* Add VPAT 2.5 INT (EN 301 549) accessibility conformance report

Documents the degree of conformance of the Syncfusion Toolkit for Blazor
component library to EN 301 549 v3.2.1 / WCAG 2.1 Levels A and AA.

Grounded in a static code review of all 17 public components across
six categories (Buttons, Calendars, Charts, Inputs, Popups, Notifications),
covering ARIA semantics, keyboard models, focus management, live regions,
forced-colors, and reduced-motion support. Records per-criterion
conformance levels, consumer-vs-library responsibilities, known gaps,
and an evidence index with source file paths.

* VPAT 2.5 INT v2: address evaluation-method, metadata, and standard-coverage gaps

- Add Contact Information, specific Report Date (2026-09-21), commit pin
  (3ba5024), and Applicable Standards/Guidelines table to the header
- Add Evaluation Methods section (§7) with four methods: static code review,
  Accessibility Insights FastPass+Assessment (axe-core, Edge 130, 2026-09-06),
  Playwright manual keyboard testing (23 spec files), and AT testing
  (NVDA 2024.x, JAWS 2025, Narrator on Windows 11/Edge 130)
- Add Method Limitations & Caveats and Evaluation Team Qualifications
  subsections; explicitly state no independent third-party audit was conducted
- Add WCAG 2.2 additional criteria (§8.3): 2.4.13 Focus Appearance,
  2.5.7 Dragging Movements, 2.5.8 Target Size — Minimum, 3.2.6 Consistent Help,
  3.3.7 Redundant Entry, 3.3.8 Accessible Authentication
- Add Revised Section 508 cross-reference (§8.5) mapping Chapters 3, 5, 6
  to EN 301 549 results
- Update Executive Summary with WCAG 2.2 and Section 508 conformance rows,
  evaluation-methods summary, and third-party-audit caveat
- Corroborate key criterion remarks (1.1.1, 2.1.1, 2.4.7, 4.1.2, 4.1.3) with
  runtime evidence: Playwright spec citations, NVDA/JAWS/Narrator smoke-test
  results, and Accessibility Insights FastPass findings
- Add Appendix C: Document Maintenance & Version Control (version pinning,
  document accessibility/format note, update cadence, change log)
- Add Appendix D: Remaining Manual Work Items (D1-D8) with actionable tasks
  for stale AT data re-runs, target-size measurement, VoiceOver sweep,
  contrast measurement, ITI Word template transfer, third-party audit,
  and keyboard-shortcut reference doc)
- Update TOC to reflect new sections (§7 Evaluation Methods, §8.3 WCAG 2.2,
  §8.5 Section 508, Appendices C and D)
- Fix component count (16 → 17) in About section

Report version 2 addresses all critical gaps identified in review of v1.

---------

Co-authored-by: CodeStudio <agent@codestudio.dev>

* Updated demo samples and highcontrast theme changes for Blazor Toolkit (#85)

* 1047327: Temp commit for highcontrast theme

* deps(npm): bump braces and gulp (#52)

* deps(npm): bump braces and gulp

Bumps [braces](https://github.com/micromatch/braces) to 3.0.3 and updates ancestor dependency [gulp](https://github.com/gulpjs/gulp). These dependencies need to be updated together.


Updates `braces` from 2.3.2 to 3.0.3
- [Changelog](https://github.com/micromatch/braces/blob/master/CHANGELOG.md)
- [Commits](https://github.com/micromatch/braces/commits/3.0.3)

Updates `gulp` from 4.0.2 to 5.0.1
- [Release notes](https://github.com/gulpjs/gulp/releases)
- [Changelog](https://github.com/gulpjs/gulp/blob/master/CHANGELOG.md)
- [Commits](gulpjs/gulp@v4.0.2...v5.0.1)

---
updated-dependencies:
- dependency-name: braces
  dependency-version: 3.0.3
  dependency-type: indirect
- dependency-name: gulp
  dependency-version: 5.0.1
  dependency-type: direct:development
...

Signed-off-by: dependabot[bot] <support@github.com>

* Resolved the issues in the ESLint security job.

* fix(npm): regenerate package-lock.json for gulp 5.0.1

* fix(npm): add glob as direct dep for gulpfile (gulp 5)

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Indhumathy-Loganathan <indhumathy.loganathan@syncfusion.com>
Co-authored-by: Indhumathy-Loganathan <58062424+Indhumathy-Loganathan@users.noreply.github.com>
Co-authored-by: Prince Oliver <31838171+PrinceOliver@users.noreply.github.com>

* deps(npm): bump sass from 1.104.0 to 1.104.1 (#75)

Bumps [sass](https://github.com/sass/dart-sass) from 1.104.0 to 1.104.1.
- [Release notes](https://github.com/sass/dart-sass/releases)
- [Changelog](https://github.com/sass/dart-sass/blob/main/CHANGELOG.md)
- [Commits](sass/dart-sass@1.104.0...1.104.1)

---
updated-dependencies:
- dependency-name: sass
  dependency-version: 1.104.1
  dependency-type: direct:development
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

* deps(npm): bump glob from 7.2.3 to 13.0.6 (#76)

* deps(npm): bump glob from 7.2.3 to 13.0.6

Bumps [glob](https://github.com/isaacs/node-glob) from 7.2.3 to 13.0.6.
- [Changelog](https://github.com/isaacs/node-glob/blob/main/changelog.md)
- [Commits](isaacs/node-glob@v7.2.3...v13.0.6)

---
updated-dependencies:
- dependency-name: glob
  dependency-version: 13.0.6
  dependency-type: direct:development
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>

* Refactor SCSS processing in gulpfile.js

* Refactor gulp task execution in project file

Updated the RunGulpOnceBeforeBuild target to use 'npx' for gulp execution and modified the message text.

* Updated package-lock.json

* updated gulpfile.js

* updated codeql.yml

* updated working directory in codeql.yml

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Prince Oliver <31838171+PrinceOliver@users.noreply.github.com>
Co-authored-by: PrinceOliver <prince.rajarathinam@syncfusion.com>

* 1047327: Reverted temp commit for highcontrast theme.

* 1055862: Migrating samples folder and gulpfile changes from master to forked main branch.

* 1055862: Migrating source and styles folder changes from master to forked main branch.

* 1055862: Migrating the fixes resolved in master branch to github main branch.

* 1055862: Migrating the missed fixes in previous commit from master branch to github main branch.

* 1055862: Migrated dialog component related fixes and button component changes from master to github main branch.

* 1055862: Migrated numerictextbox and removed release notes changes from master to github main branch.

* 1055862: Migrated removing the release notes file from master to github main branch.

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Indhumathy-Loganathan <indhumathy.loganathan@syncfusion.com>
Co-authored-by: Indhumathy-Loganathan <58062424+Indhumathy-Loganathan@users.noreply.github.com>
Co-authored-by: Prince Oliver <31838171+PrinceOliver@users.noreply.github.com>
Co-authored-by: PrinceOliver <prince.rajarathinam@syncfusion.com>

* Report corrections updated.

* Resolved Button issues and CI failure.

* Resolved CI failure.

* CI failure related changes included.

* CI failure resolved.

* BUnit failure resolved.

* BUnit issues resolved.

* BUnit issues resolved.

* BUnit related corrections added.

* BUnit test case failures cleared.

* BUnit and playwright test case failures cleared.

* Playwright test case failures cleared.

* Playwright test case issues cleared.

* Pack test issue resolved.

* Pack failures resolved.

* Documents were updated.

* navigation time delay reduced.

* Resolved warnings in calendar file.

* Resolved the warning in calendar day cell.

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Prince Oliver <31838171+PrinceOliver@users.noreply.github.com>
Co-authored-by: CodeStudio <agent@codestudio.dev>
Co-authored-by: JafarAli3783 <106724001+JafarAli3783@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: PrinceOliver <prince.rajarathinam@syncfusion.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@Indhumathy-Loganathan Indhumathy-Loganathan Indhumathy-Loganathan approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@JafarAli3783 @Indhumathy-Loganathan