RAC Slider should support custom formatters

[staticshock]

Provide a general summary of the feature here

Slider has a formatOptions prop, which is constrained to Intl.NumberFormat values. I find this puzzling: I'd like to produce a thumb label of "10 teachers", but with the current constraint I can only produce one that uses one of the supported unit identifiers, e.g. "10 hours" or "10 stones".

🤔 Expected Behavior?

There's a bunch of existing machinery in sliders that lets you turn a number into a label using a preconfigured formatter:

<Slider formatOptions={{ style: 'unit', unit: 'hour' }}>
  <SliderTrack>
    {({ state }) =>
      state.values.map((_, ix) => (
        <SliderThumb
          aria-label={state.getThumbValueLabel(ix)}
          index={ix}
          key={ix}
        />
      ))
    }
  </SliderTrack>
</Slider>

😯 Current Behavior

The fact that I can use the existing plumbing is great. Unfortunately, it also feels unnecessarily rigid. If I want my own noun in the output, I have to bypass all the available plumbing and handroll an alternative.

💁 Possible Solution

Maybe in addition to formatOptions, support a formatter function?

🔦 Context

I ran into this issue working on a pricing slider for a product checkout flow.

💻 Examples

No response

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response