feat(slider): add section labels support

[scharinger]

Describe your changes

We need a slider with sections that have labels and customable track colors.

Checklist before requesting a review

• I have performed a self-review of my own code
• I have verified that the code builds perfectly fine on my local system
• I have added tests that prove my fix is effective or that my feature works
• I have commented my code, particularly in hard-to-understand areas
• I have verified that my code follows the style already available in the repository
• I have made corresponding changes to the documentation

[trew]

Overall it looks nice. Some changes required though. I defer to other maintainers whether or not changes such as changeset.js/ts should be included or not. They are good changes but have nothing to do with the PR.

[trew]

The range slider doesn't seems to work that well with sections. The track goes out of bounds. Also the mark label highlighting doesn't work properly when multiple marks have values that equal them.

[scharinger]

The range slider doesn't seems to work that well with sections. The track goes out of bounds. Also the mark label highlighting doesn't work properly when multiple marks have values that equal them.

Updated the gradient color logic to work for the range slider also.

Now also upgraded the logic on the section label active state. Only problem is that the thumb color on range sliders act oddly. But it's hard to fix currently as there is no support to handle style props on individual thumbs easily. We currently don't have a use case for range sliders using sections so maybe it could wait until we need it?

[trew]

Only problem is that the thumb color on range sliders act oddly. ... We currently don't have a use case for range sliders using sections so maybe it could wait until we need it?

Yes. That one is ok for me to skip with this PR.

One final thing I noticed behavior-wise is that the active state for mark labels (when activeEqual is true) only works for the max value. That should probably test for all values.

Only "Boiling" is active. "Freezing" should be as well.

[scharinger]

Only problem is that the thumb color on range sliders act oddly. ... We currently don't have a use case for range sliders using sections so maybe it could wait until we need it?

Yes. That one is ok for me to skip with this PR.

One final thing I noticed behavior-wise is that the active state for mark labels (when activeEqual is true) only works for the max value. That should probably test for all values.

Only "Boiling" is active. "Freezing" should be as well.

Updated the that the lower range value also is set as active.

[trew]

Only 2 minor things left!

[trew]

@axis-d0op The unresolved conversations blocks merging. How do I resolve them?

[axis-d0op]

@scharinger så, nu ska alla kommentarer vara resolved. du behöver synca in main och pusha, samt se till att alla kommits är signerade. (signed commits).

[scharinger]

Rebased.

[axis-d0op]

LGTM / samuel & jimmy