From bdf9f5c2df4fec02690cd53f3b01814a67d8f454 Mon Sep 17 00:00:00 2001 From: TJ Egan Date: Fri, 19 Feb 2021 11:05:54 -0800 Subject: [PATCH] fix(DatePicker): allow locale object to be passed in to flatpickr (#7834) * fix(DatePicker): allow locale object to be passed in to flatpickr * chore(tests): update snapshots Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com> --- .../__snapshots__/PublicAPI-test.js.snap | 134 +++++++++-------- .../src/components/DatePicker/DatePicker.js | 137 ++++++++++-------- 2 files changed, 146 insertions(+), 125 deletions(-) diff --git a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap index 18082a608cb9..4d5f4890c890 100644 --- a/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap +++ b/packages/react/__tests__/__snapshots__/PublicAPI-test.js.snap @@ -2095,70 +2095,80 @@ Map { "locale": Object { "args": Array [ Array [ - "ar", - "at", - "az", - "be", - "bg", - "bn", - "bs", - "cat", - "cs", - "cy", - "da", - "de", - "en", - "eo", - "es", - "et", - "fa", - "fi", - "fo", - "fr", - "ga", - "gr", - "he", - "hi", - "hr", - "hu", - "id", - "is", - "it", - "ja", - "ka", - "km", - "ko", - "kz", - "lt", - "lv", - "mk", - "mn", - "ms", - "my", - "nl", - "no", - "pa", - "pl", - "pt", - "ro", - "ru", - "si", - "sk", - "sl", - "sq", - "sr-cyr", - "sr", - "sv", - "th", - "tr", - "uk", - "uz", - "vn", - "zh-tw", - "zh", + Object { + "type": "object", + }, + Object { + "args": Array [ + Array [ + "ar", + "at", + "az", + "be", + "bg", + "bn", + "bs", + "cat", + "cs", + "cy", + "da", + "de", + "en", + "eo", + "es", + "et", + "fa", + "fi", + "fo", + "fr", + "ga", + "gr", + "he", + "hi", + "hr", + "hu", + "id", + "is", + "it", + "ja", + "ka", + "km", + "ko", + "kz", + "lt", + "lv", + "mk", + "mn", + "ms", + "my", + "nl", + "no", + "pa", + "pl", + "pt", + "ro", + "ru", + "si", + "sk", + "sl", + "sq", + "sr-cyr", + "sr", + "sv", + "th", + "tr", + "uk", + "uz", + "vn", + "zh-tw", + "zh", + ], + ], + "type": "oneOf", + }, ], ], - "type": "oneOf", + "type": "oneOfType", }, "maxDate": Object { "type": "string", diff --git a/packages/react/src/components/DatePicker/DatePicker.js b/packages/react/src/components/DatePicker/DatePicker.js index 8d3a541331b9..3df3548f01df 100644 --- a/packages/react/src/components/DatePicker/DatePicker.js +++ b/packages/react/src/components/DatePicker/DatePicker.js @@ -161,68 +161,71 @@ export default class DatePicker extends Component { /** * The language locale used to format the days of the week, months, and numbers. The full list of supported locales can be found here https://github.com/flatpickr/flatpickr/tree/master/src/l10n */ - locale: PropTypes.oneOf([ - 'ar', // Arabic - 'at', // Austria - 'az', // Azerbaijan - 'be', // Belarusian - 'bg', // Bulgarian - 'bn', // Bangla - 'bs', // Bosnia - 'cat', // Catalan - 'cs', // Czech - 'cy', // Welsh - 'da', // Danish - 'de', // German - 'en', // English - 'eo', // Esperanto - 'es', // Spanish - 'et', // Estonian - 'fa', // Persian - 'fi', // Finnish - 'fo', // Faroese - 'fr', // French - 'ga', // Gaelic - 'gr', // Greek - 'he', // Hebrew - 'hi', // Hindi - 'hr', // Croatian - 'hu', // Hungarian - 'id', // Indonesian - 'is', // Icelandic - 'it', // Italian - 'ja', // Japanese - 'ka', // Georgian - 'km', // Khmer - 'ko', // Korean - 'kz', // Kazakh - 'lt', // Lithuanian - 'lv', // Latvian - 'mk', // Macedonian - 'mn', // Mongolian - 'ms', // Malaysian - 'my', // Burmese - 'nl', // Dutch - 'no', // Norwegian - 'pa', // Punjabi - 'pl', // Polish - 'pt', // Portuguese - 'ro', // Romanian - 'ru', // Russian - 'si', // Sinhala - 'sk', // Slovak - 'sl', // Slovenian - 'sq', // Albanian - 'sr-cyr', // Serbian Cyrillic - 'sr', // Serbian - 'sv', // Swedish - 'th', // Thai - 'tr', // Turkish - 'uk', // Ukrainian - 'uz', // Uzbek - 'vn', // Vietnamese - 'zh-tw', // Mandarin Traditional - 'zh', // Mandarin + locale: PropTypes.oneOfType([ + PropTypes.object, + PropTypes.oneOf([ + 'ar', // Arabic + 'at', // Austria + 'az', // Azerbaijan + 'be', // Belarusian + 'bg', // Bulgarian + 'bn', // Bangla + 'bs', // Bosnia + 'cat', // Catalan + 'cs', // Czech + 'cy', // Welsh + 'da', // Danish + 'de', // German + 'en', // English + 'eo', // Esperanto + 'es', // Spanish + 'et', // Estonian + 'fa', // Persian + 'fi', // Finnish + 'fo', // Faroese + 'fr', // French + 'ga', // Gaelic + 'gr', // Greek + 'he', // Hebrew + 'hi', // Hindi + 'hr', // Croatian + 'hu', // Hungarian + 'id', // Indonesian + 'is', // Icelandic + 'it', // Italian + 'ja', // Japanese + 'ka', // Georgian + 'km', // Khmer + 'ko', // Korean + 'kz', // Kazakh + 'lt', // Lithuanian + 'lv', // Latvian + 'mk', // Macedonian + 'mn', // Mongolian + 'ms', // Malaysian + 'my', // Burmese + 'nl', // Dutch + 'no', // Norwegian + 'pa', // Punjabi + 'pl', // Polish + 'pt', // Portuguese + 'ro', // Romanian + 'ru', // Russian + 'si', // Sinhala + 'sk', // Slovak + 'sl', // Slovenian + 'sq', // Albanian + 'sr-cyr', // Serbian Cyrillic + 'sr', // Serbian + 'sv', // Swedish + 'th', // Thai + 'tr', // Turkish + 'uk', // Ukrainian + 'uz', // Uzbek + 'vn', // Vietnamese + 'zh-tw', // Mandarin Traditional + 'zh', // Mandarin + ]), ]), /** @@ -292,6 +295,14 @@ export default class DatePicker extends Component { this.updateClassNames(instance); }; + let localeData; + if (typeof locale === 'object') { + let location = locale.locale ? locale.locale : 'en'; + localeData = { ...l10n[location], ...locale }; + } else { + localeData = l10n[locale]; + } + // inputField ref might not be set in enzyme tests if (this.inputField) { this.cal = new flatpickr(this.inputField, { @@ -300,7 +311,7 @@ export default class DatePicker extends Component { mode: datePickerType, allowInput: allowInput ?? true, dateFormat: dateFormat, - locale: l10n[locale], + locale: localeData, minDate: minDate, maxDate: maxDate, plugins: [