UNPKG

@wordpress/components

Version:
8 lines (7 loc) 6.88 kB
{ "version": 3, "sources": ["../../../src/calendar/utils/use-localization-props.ts"], "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useMemo } from '@wordpress/element';\n/**\n * Internal dependencies\n */\n\nfunction isLocaleRTL(localeCode) {\n const localeObj = new Intl.Locale(localeCode);\n if ('getTextInfo' in localeObj) {\n // @ts-expect-error - getTextInfo is not typed yet\n // see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/getTextInfo\n return localeObj.getTextInfo().direction === 'rtl';\n }\n return ['ar',\n // Arabic\n 'he',\n // Hebrew\n 'fa',\n // Persian (Farsi)\n 'ur',\n // Urdu\n 'ps',\n // Pashto\n 'syr',\n // Syriac\n 'dv',\n // Divehi\n 'ku',\n // Kurdish (Sorani)\n 'yi' // Yiddish\n ].includes(localeObj.language);\n}\n\n/**\n * Returns localization props for the calendar components.\n *\n * Notes:\n * - the following props should be intended as defaults, and should\n * be overridden by consumer props if listed as public props.\n * - It is possible for the translated strings to use a different locale\n * than the formatted dates and the computed `dir`. This is because the\n * translation function doesn't expose the locale used for the translated\n * strings, meaning that the dates are formatted using the `locale` prop.\n * For a correct localized experience, consumers should make sure that\n * translation context and `locale` prop are consistent.\n * @param props\n * @param props.locale\n * @param props.timeZone\n * @param props.mode\n */\nexport const useLocalizationProps = ({\n locale,\n timeZone,\n mode\n}) => {\n return useMemo(() => {\n // ie. April 2025\n const monthNameFormatter = new Intl.DateTimeFormat(locale.code, {\n year: 'numeric',\n month: 'long',\n timeZone\n });\n // ie. M, T, W, T, F, S, S\n const weekdayNarrowFormatter = new Intl.DateTimeFormat(locale.code, {\n weekday: 'narrow',\n timeZone\n });\n // ie. Monday, Tuesday, Wednesday, Thursday, Friday, Saturday, Sunday\n const weekdayLongFormatter = new Intl.DateTimeFormat(locale.code, {\n weekday: 'long',\n timeZone\n });\n // ie. Monday, April 29, 2025\n const fullDateFormatter = new Intl.DateTimeFormat(locale.code, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n timeZone\n });\n\n // Note: the following props should be intended as defaults, and should\n // be overridden by consumer props if listed as public props.\n return {\n 'aria-label': mode === 'single' ? __('Date calendar') : __('Date range calendar'),\n labels: {\n /**\n * The label for the month grid.\n * @param date\n */\n labelGrid: date => monthNameFormatter.format(date),\n /**\n * The label for the gridcell, when the calendar is not interactive.\n * @param date\n * @param modifiers\n */\n labelGridcell: (date, modifiers) => {\n const formattedDate = fullDateFormatter.format(date);\n let label = formattedDate;\n if (modifiers?.today) {\n label = sprintf(\n // translators: %s is the full date (e.g. \"Monday, April 29, 2025\")\n __('Today, %s'), formattedDate);\n }\n return label;\n },\n /** The label for the \"next month\" button. */\n labelNext: () => __('Go to the Next Month'),\n /** The label for the \"previous month\" button. */\n labelPrevious: () => __('Go to the Previous Month'),\n /**\n * The label for the day button.\n * @param date\n * @param modifiers\n */\n labelDayButton: (date, modifiers) => {\n const formattedDate = fullDateFormatter.format(date);\n let label = formattedDate;\n if (modifiers?.today) {\n label = sprintf(\n // translators: %s is the full date (e.g. \"Monday, April 29, 2025\")\n __('Today, %s'), formattedDate);\n }\n if (modifiers?.selected) {\n label = sprintf(\n // translators: %s is the full date (e.g. \"Monday, April 29, 2025\")\n __('%s, selected'), formattedDate);\n }\n return label;\n },\n /**\n * The label for the weekday.\n * @param date\n */\n labelWeekday: date => weekdayLongFormatter.format(date)\n },\n locale,\n dir: isLocaleRTL(locale.code) ? 'rtl' : 'ltr',\n formatters: {\n formatWeekdayName: date => {\n return weekdayNarrowFormatter.format(date);\n },\n formatCaption: date => {\n return monthNameFormatter.format(date);\n }\n },\n timeZone\n };\n }, [locale, timeZone, mode]);\n};"], "mappings": ";AAGA,SAAS,IAAI,eAAe;AAC5B,SAAS,eAAe;AAKxB,SAAS,YAAY,YAAY;AAC/B,QAAM,YAAY,IAAI,KAAK,OAAO,UAAU;AAC5C,MAAI,iBAAiB,WAAW;AAG9B,WAAO,UAAU,YAAY,EAAE,cAAc;AAAA,EAC/C;AACA,SAAO;AAAA,IAAC;AAAA;AAAA,IAER;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA;AAAA,IAEA;AAAA;AAAA,EACA,EAAE,SAAS,UAAU,QAAQ;AAC/B;AAmBO,IAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,SAAO,QAAQ,MAAM;AAEnB,UAAM,qBAAqB,IAAI,KAAK,eAAe,OAAO,MAAM;AAAA,MAC9D,MAAM;AAAA,MACN,OAAO;AAAA,MACP;AAAA,IACF,CAAC;AAED,UAAM,yBAAyB,IAAI,KAAK,eAAe,OAAO,MAAM;AAAA,MAClE,SAAS;AAAA,MACT;AAAA,IACF,CAAC;AAED,UAAM,uBAAuB,IAAI,KAAK,eAAe,OAAO,MAAM;AAAA,MAChE,SAAS;AAAA,MACT;AAAA,IACF,CAAC;AAED,UAAM,oBAAoB,IAAI,KAAK,eAAe,OAAO,MAAM;AAAA,MAC7D,SAAS;AAAA,MACT,MAAM;AAAA,MACN,OAAO;AAAA,MACP,KAAK;AAAA,MACL;AAAA,IACF,CAAC;AAID,WAAO;AAAA,MACL,cAAc,SAAS,WAAW,GAAG,eAAe,IAAI,GAAG,qBAAqB;AAAA,MAChF,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,QAKN,WAAW,UAAQ,mBAAmB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMjD,eAAe,CAAC,MAAM,cAAc;AAClC,gBAAM,gBAAgB,kBAAkB,OAAO,IAAI;AACnD,cAAI,QAAQ;AACZ,cAAI,WAAW,OAAO;AACpB,oBAAQ;AAAA;AAAA,cAER,GAAG,WAAW;AAAA,cAAG;AAAA,YAAa;AAAA,UAChC;AACA,iBAAO;AAAA,QACT;AAAA;AAAA,QAEA,WAAW,MAAM,GAAG,sBAAsB;AAAA;AAAA,QAE1C,eAAe,MAAM,GAAG,0BAA0B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMlD,gBAAgB,CAAC,MAAM,cAAc;AACnC,gBAAM,gBAAgB,kBAAkB,OAAO,IAAI;AACnD,cAAI,QAAQ;AACZ,cAAI,WAAW,OAAO;AACpB,oBAAQ;AAAA;AAAA,cAER,GAAG,WAAW;AAAA,cAAG;AAAA,YAAa;AAAA,UAChC;AACA,cAAI,WAAW,UAAU;AACvB,oBAAQ;AAAA;AAAA,cAER,GAAG,cAAc;AAAA,cAAG;AAAA,YAAa;AAAA,UACnC;AACA,iBAAO;AAAA,QACT;AAAA;AAAA;AAAA;AAAA;AAAA,QAKA,cAAc,UAAQ,qBAAqB,OAAO,IAAI;AAAA,MACxD;AAAA,MACA;AAAA,MACA,KAAK,YAAY,OAAO,IAAI,IAAI,QAAQ;AAAA,MACxC,YAAY;AAAA,QACV,mBAAmB,UAAQ;AACzB,iBAAO,uBAAuB,OAAO,IAAI;AAAA,QAC3C;AAAA,QACA,eAAe,UAAQ;AACrB,iBAAO,mBAAmB,OAAO,IAAI;AAAA,QACvC;AAAA,MACF;AAAA,MACA;AAAA,IACF;AAAA,EACF,GAAG,CAAC,QAAQ,UAAU,IAAI,CAAC;AAC7B;", "names": [] }