fix: bootstrap5 theme: update chevron in validation-state dropdown to support dark theme

[theParitet]

Fixes #1061

The problem

The chevron of a dropdown does not reflect the data-bs-theme used by the Bootstrap, when being validated. This covers .is-valid, .is-invalid and container with .was-validated class. It currently only has light theme version - dark gray which can be hard to notice with dark theme.

The problem targets Bootstrap versions 5.3.x.

What changed

Small tom-select.bootstrap5.scss one line change:

background-image: escape-svg($form-select-indicator), escape-svg($icon);

changed to

background-image: var(--bs-form-select-bg-img, escape-svg($form-select-indicator)), escape-svg($icon);

in the ts-form-validation-state-selector mixin.

It gives preference to the dynamic Bootstrap variable for the chevron image that depends on the data-bs-theme directly. The fix also ensures there are no regressions, so there's the fallback for the older versions that do not offer the dark theme and --bs-form-select-bg-img Bootstrap variable.

Before/After

This was run locally before and after the change, with the CSS link pointing to dist/css/tom-select.bootstrap5.css (after running npm run build) at the project root.

Before

After

From the dev tools:

Tests

Steps passed locally (node 22):

• npm test - all tests passed
• npm run build - successful build
• npm run stylelint - successful, no output

[theParitet]

One clarification. Since I didn't mention how the light theme interacted with the change at all, here's additional manual check with the latest build on the 3 cases after my change. No regressions:

[NicolasCARPi]

👍