@homecode/ui 5.20.16 → 5.20.17

package/dist/esm/index.js

@@ -15,7 +15,7 @@ export { getDisplayContent, getDisplayParts, isPlanMessageContent, parseSystemEv
 export { Container } from './src/components/Container/Container.js';
 export { DatePicker } from './src/components/DatePicker/DatePicker.js';
 export { DatePickerInput } from './src/components/DatePickerInput/DatePickerInput.js';
-export { DateTime, formatDate } from './src/components/DateTime/DateTime.js';
+export { DateTime, formatDate, toMomentLocale } from './src/components/DateTime/DateTime.js';
 export { Dialogue } from './src/components/Dialogue/Dialogue.js';
 export { Draggable } from './src/components/Draggable/Draggable.js';
 export { DropZone } from './src/components/DropZone/DropZone.js';

package/dist/esm/src/components/Autocomplete/Autocomplete.js

@@ -45,6 +45,7 @@ import '../Chat/ChatView.styl.js';
 import '../Container/Container.js';
 import '../DatePicker/DatePicker.styl.js';
 import 'moment';
+import '../../services/i18n.js';
 import '../DatePickerInput/DatePickerInput.styl.js';
 import '../Dialogue/Dialogue.js';
 import '../../tools/queryParams.js';
@@ -70,7 +71,6 @@ import '@tiptap/extension-mention';
 import '@tiptap/pm/state';
 import '@tiptap/react';
 import '../../tiptap/slash-mention/SlashSuggestionList.styl.js';
-import '../../services/i18n.js';
 import '../LightBox/LightBox.styl.js';
 import '../NestedMenu/NestedMenu.js';
 import '../Notifications/store.js';

package/dist/esm/src/components/DateTime/DateTime.js

@@ -1,8 +1,25 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
 import moment from 'moment';
+import { useStore } from 'justorm/react';
+import { store } from '../../services/i18n.js';
 
-function formatDate({ value, format, locale = 'en' }) {
-    const d = moment(value).locale(locale);
+// Only app language codes that differ from moment's locale ids. Any other
+// code (de, fr, ar, th, ...) already is a moment id and is passed through.
+const MOMENT_LOCALE_ALIASES = {
+    ua: 'uk',
+    jp: 'ja',
+    zh: 'zh-cn',
+};
+/** Moment locale id for an app language code ("ua" -> "uk"). */
+function toMomentLocale(lang) {
+    if (!lang)
+        return 'en';
+    const code = lang.toLowerCase();
+    return MOMENT_LOCALE_ALIASES[code] ?? code;
+}
+function formatDate({ value, format, locale, }) {
+    // Moment keeps English when the locale's data isn't loaded by the app.
+    const d = moment(value).locale(locale ?? toMomentLocale(store.lang));
     if (format) {
         if (d[format])
             return d[format]();
@@ -11,7 +28,9 @@ function formatDate({ value, format, locale = 'en' }) {
     return d.toString();
 }
 function DateTime({ value = new Date(), format, locale }) {
+    // Re-render on a language switch when no explicit locale is given.
+    useStore({ i18n: ['lang'] });
     return jsx(Fragment, { children: formatDate({ value, format, locale }) });
 }
 
-export { DateTime, formatDate };
+export { DateTime, formatDate, toMomentLocale };

package/dist/esm/src/components/InputFile/InputFile.js

@@ -48,6 +48,7 @@ import '../Chat/ChatView.styl.js';
 import '../Container/Container.js';
 import '../DatePicker/DatePicker.styl.js';
 import 'moment';
+import '../../services/i18n.js';
 import '../DatePickerInput/DatePickerInput.styl.js';
 import '../Dialogue/Dialogue.js';
 import { Draggable } from '../Draggable/Draggable.js';
@@ -65,7 +66,6 @@ import '../VideoPlayer/VideoPlayer.styl.js';
 import '../Gallery/Gallery.styl.js';
 import '../GridLayout/GridLayout.styl.js';
 import '../Heading/Heading.js';
-import '../../services/i18n.js';
 import '../LightBox/LightBox.styl.js';
 import '../NestedMenu/NestedMenu.js';
 import '../Notifications/store.js';

package/dist/esm/src/components/Router/Router.js

@@ -1,5 +1,5 @@
 import { jsx, Fragment } from 'react/jsx-runtime';
-import { useContext, useEffect, useMemo } from 'react';
+import { useContext, useEffect, useMemo, Children, isValidElement } from 'react';
 import { useStore } from 'justorm/react';
 import { parseQueryParams } from '../../tools/queryParams.js';
 import STORE from './store.js';
@@ -29,8 +29,8 @@ const Router = (props) => {
         const childs = [];
         let noMatchRoute;
         let isRouteMatched = false;
-        for (const child of React.Children.toArray(children)) {
-            if (!React.isValidElement(child)) {
+        for (const child of Children.toArray(children)) {
+            if (!isValidElement(child)) {
                 childs.push(child);
                 continue;
             }

package/dist/esm/types/src/components/DateTime/DateTime.d.ts

@@ -1,7 +1,9 @@
 import * as T from './DateTime.types';
-export declare function formatDate({ value, format, locale }: {
-    value: any;
-    format: any;
+/** Moment locale id for an app language code ("ua" -> "uk"). */
+export declare function toMomentLocale(lang?: string | null | void): string;
+export declare function formatDate({ value, format, locale, }: {
+    value?: T.Props['value'];
+    format?: string;
     locale?: string;
 }): any;
 export declare function DateTime({ value, format, locale }: T.Props): import("react").JSX.Element;

package/dist/esm/types/src/components/DateTime/DateTime.test.d.ts

@@ -0,0 +1 @@
+import 'moment/locale/uk';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homecode/ui",
-  "version": "5.20.16",
+  "version": "5.20.17",
   "description": "React UI components library",
   "scripts": {
     "tests": "jest",