Allow setting default locale for DatePicker

Summary

Is it possible to set default locale for DatePicker? Then we don’t need to pass locale to each DatePicker component.

Justification

No.

Desired UX and success metrics

Probably we can add a function to set default locale?

import { DatePicker } from "carbon-components-react";

DatePicker.setDefaultLocale("zh_tw");

“Must have” functionality

Set default locale for DatePicker

Specific timeline issues / requests

We have a GVT defect in our backlog. It’s up to this ticket to decide whether we should directly fix this defect by adding locale prop to each DatePicker.

Available extra resources

What resources do you have to assist this effort?

I guess we probably can discuss the better way to do this. If needed, I can create a PR for it.

[tay1orjones]

Hi @fred104 sorry for the delay in responding. If I understand correctly, you’d like to set a new default locale for all DatePickers in your application.

If this is the case, I’d recommend creating a lightweight wrapper around DatePicker that would set the locale to your preferred locale. You can then reuse this wrapper throughout your application in place of DatePicker. Something like this might work:

import { DatePicker as CarbonDatePicker } from "carbon-components-react";

export function DatePicker(props) {
  return (
    // `fr` is used here, but can be whatever locale you'd like the new "default" to be
    <CarbonDatePicker locale={props?.locale || "fr"} {...props}>
      {props?.children}
    </CarbonDatePicker>
  );
};

Here’s a quick codesandbox example I cooked up.

[jnm2377]

Closing this issue, since this is not a bug and no enhancement is needed. For anyone else wanting to do a similar thing, we’ve provided the recommended solution above for setting the same prop value to more than one component without having to explicitly add the prop to each component instance (see https://github.com/carbon-design-system/carbon/issues/9248#issuecomment-916371174)