NumberFormat/DateTimeFormat getters, with support for named formats.

[skoging]

Is your feature request related to a problem? Please describe.
There is currently no well supported way to use named formats from react-intl, in combination with formatToParts() or resolvedOptions() (or any other methods on the format objects other than format()).

There have been requests for adding these functions before, but it is reasonable that that is out of the scope of this project.

Describe the solution you'd like

const intl = useIntl();
const formatter = intl.getNumberFormatter({ format: "currency" }); // <--

// const parts = formatter.formatToParts(100.12);
// const opts = formatter.resolvedOptions();

Instead, exporting getter functions for creating the NumberFormat/DateTimeFormat objects with support for named formats is sufficient, and would not introduce breaking changes or add too much noise to the API.

Describe alternatives you've considered
While this is possible to achieve now, without any changes to react-intl, it's not pretty. We've gone through a few iterations on this in our app, but our current implementation boils down to replicating the internal functionality of react-intl, to implement these getter functions ourself.

Additional context
A central part of our app is forms with a lot of currency and percent fields, and also some date fields. These are formatted and masked, and should ideally be configured the same way as plain number formatting. It should ideally be as simple as

<NumberInput format="currency_input" value={val} onChange={handleChange} />

or even

function CurrencyInput(props) {
  return <NumberInput format="currency_input" {...props} />;
}

This is not something that is in scope for react-intl itself, and should be relegated to complimentary packages.

With this getter feature in place I'd feel confident enough to open source our formatted input logic, and make it available as complementary packages to react-intl.

[skoging]

If this feature is welcome, I'd be open to contributing it myself.

[longlho]

I think this already exists (intl.getNumberFormat() gives u the instance)

[skoging]

If you're thinking of

intl.formatters.getNumberFormat(locale: string, options: Intl.NumberFormatOptions)

then yes, that takes the same arguments as the Intl.NumberFormatter constructor and returns a memoized instance. However, it does not handle react-intl named formats. This is handled in the implementation of the formatter functions themselves

intl.formatNumber(value: number, options: FormatNumberOptions)

The only way I've managed to combine named formats with other formatter methods like formatToParts or resolvedOptions is to reimplement the logic for getting a named format. I also implemented the same logic for filtering props, but that's more of a convenience.

[longlho]

hmm gotcha. Yeah I'll think about how to maybe extract that out. The imperative APIs do need some enhancement in that aspect.