[slider] Support for marks

[mj12albert]

Feature request

Summary

Introduce a new API consistent with component-per-node design to support rendering marks on the slider Track, as the marks prop and Mark component/slot was removed in #216

While it's quite simple to implement this (including "inverted track", demo) using useSliderContext, we have decided that all the hooks are private for now

In the native <input type='range' />, we can do it by adding a and linking it with the id.

<input type="range" min="-100" max="100" value="0" step="10" name="power" list="powers">
<datalist id="powers">
   <option value="0">
   <option value="-30">
   <option value="30">
   <option value="++50">
</datalist>

The Slider should also snap to the closest marker/indicator.

Examples in other libraries

MUI - https://mui.com/material-ui/react-slider/#discrete-sliders

Mantine - https://mantine.dev/core/slider/#marks

ARK UI - https://ark-ui.com/react/docs/components/slider#adding-marks

Chakra UI - https://www.chakra-ui.com/docs/components/slider#marks

[mj12albert]

@siriwatknp suggested exposing the slider's percentage value(s) as CSS vars as alternative to providing a marks subcomponent, it would be enough to enable adding visual marks on the track using CSS alone

This would nicely sidestep the problem of defining an arbitrary number of marks with a composition API without using (mandatory) loops/function children