@vocab/react 1.1.13 → 1.1.14-fix-messageformat-import-20250923014407

package/dist/index.d.mts

@@ -0,0 +1,73 @@
+import React, { ReactNode } from "react";
+import { LanguageName, ParsedFormatFn, ParsedFormatFnByKey, TranslationFile } from "@vocab/core";
+
+//#region src/components.d.ts
+type Locale = string;
+interface TranslationsContextValue {
+  /**
+   * The `language` passed in to your `VocabProvider`
+   */
+  language: LanguageName;
+  /**
+   * The `locale` passed in to your `VocabProvider`
+   *
+   * Please note that this value will be `undefined` if you have not passed a `locale` to your `VocabProvider`.
+   * If your languages are named with IETF language tags, you should just use `language` instead of
+   * this value, unless you specifically need to access your `locale` override.
+   */
+  locale?: Locale;
+}
+interface VocabProviderProps {
+  /**
+   * The language to load translations for. Must be one of the language names defined in your `vocab.config.js`.
+   */
+  language: TranslationsContextValue['language'];
+  /**
+   * A locale override. By default, Vocab will use the `language` as the locale when formatting messages if
+   * `locale` is not set. If your languages are named with IETF language tags, you probably don't need to
+   * set this value.
+   *
+   * You may want to override the locale for a specific language if the default formatting for that locale
+   * is not desired.
+   *
+   * @example
+   * // Override the locale for th-TH to use the Gregorian calendar instead of the default Buddhist calendar
+   * <VocabProvider language="th-TH" locale="th-TH-u-ca-gregory">
+   *   </App>
+   * <VocabProvider />
+   */
+  locale?: TranslationsContextValue['locale'];
+  children: ReactNode;
+}
+/**
+ * Provides a translation context for your application
+ *
+ * @example
+ * import { VocabProvider } from '@vocab/react';
+ *
+ * <VocabProvider language="en">
+ *   <App />
+ * <VocabProvider />
+ */
+declare const VocabProvider: ({
+  children,
+  language,
+  locale
+}: VocabProviderProps) => React.JSX.Element;
+/**
+ * @returns The `language` and `locale` values passed in to your `VocabProvider`
+ */
+declare const useLanguage: () => TranslationsContextValue;
+type FormatXMLElementReactNodeFn = (parts: ReactNode[]) => ReactNode;
+type MapToReactNodeFunction<Params extends Record<string, any>> = { [key in keyof Params]: Params[key] extends ParsedFormatFn ? FormatXMLElementReactNodeFn : Params[key] };
+type TranslateFn<FormatFnByKey extends ParsedFormatFnByKey> = {
+  <TranslationKey extends keyof FormatFnByKey>(key: TranslationKey, params: MapToReactNodeFunction<Parameters<FormatFnByKey[TranslationKey]>[0]>): ReturnType<FormatFnByKey[TranslationKey]> extends string ? string : ReactNode | string | Array<ReactNode | string>;
+  <TranslationKey extends keyof FormatFnByKey>(key: Parameters<FormatFnByKey[TranslationKey]>[0] extends Record<string, any> ? never : TranslationKey): string;
+};
+declare function useTranslations<Language extends string, FormatFnByKey extends ParsedFormatFnByKey>(translations: TranslationFile<Language, FormatFnByKey>): {
+  ready: boolean;
+  t: TranslateFn<FormatFnByKey>;
+};
+//#endregion
+export { VocabProvider, useLanguage, useTranslations };
+//# sourceMappingURL=index.d.mts.map

package/dist/index.d.ts

@@ -0,0 +1,73 @@
+import { LanguageName, ParsedFormatFn, ParsedFormatFnByKey, TranslationFile } from "@vocab/core";
+import React, { ReactNode } from "react";
+
+//#region src/components.d.ts
+type Locale = string;
+interface TranslationsContextValue {
+  /**
+   * The `language` passed in to your `VocabProvider`
+   */
+  language: LanguageName;
+  /**
+   * The `locale` passed in to your `VocabProvider`
+   *
+   * Please note that this value will be `undefined` if you have not passed a `locale` to your `VocabProvider`.
+   * If your languages are named with IETF language tags, you should just use `language` instead of
+   * this value, unless you specifically need to access your `locale` override.
+   */
+  locale?: Locale;
+}
+interface VocabProviderProps {
+  /**
+   * The language to load translations for. Must be one of the language names defined in your `vocab.config.js`.
+   */
+  language: TranslationsContextValue['language'];
+  /**
+   * A locale override. By default, Vocab will use the `language` as the locale when formatting messages if
+   * `locale` is not set. If your languages are named with IETF language tags, you probably don't need to
+   * set this value.
+   *
+   * You may want to override the locale for a specific language if the default formatting for that locale
+   * is not desired.
+   *
+   * @example
+   * // Override the locale for th-TH to use the Gregorian calendar instead of the default Buddhist calendar
+   * <VocabProvider language="th-TH" locale="th-TH-u-ca-gregory">
+   *   </App>
+   * <VocabProvider />
+   */
+  locale?: TranslationsContextValue['locale'];
+  children: ReactNode;
+}
+/**
+ * Provides a translation context for your application
+ *
+ * @example
+ * import { VocabProvider } from '@vocab/react';
+ *
+ * <VocabProvider language="en">
+ *   <App />
+ * <VocabProvider />
+ */
+declare const VocabProvider: ({
+  children,
+  language,
+  locale
+}: VocabProviderProps) => React.JSX.Element;
+/**
+ * @returns The `language` and `locale` values passed in to your `VocabProvider`
+ */
+declare const useLanguage: () => TranslationsContextValue;
+type FormatXMLElementReactNodeFn = (parts: ReactNode[]) => ReactNode;
+type MapToReactNodeFunction<Params extends Record<string, any>> = { [key in keyof Params]: Params[key] extends ParsedFormatFn ? FormatXMLElementReactNodeFn : Params[key] };
+type TranslateFn<FormatFnByKey extends ParsedFormatFnByKey> = {
+  <TranslationKey extends keyof FormatFnByKey>(key: TranslationKey, params: MapToReactNodeFunction<Parameters<FormatFnByKey[TranslationKey]>[0]>): ReturnType<FormatFnByKey[TranslationKey]> extends string ? string : ReactNode | string | Array<ReactNode | string>;
+  <TranslationKey extends keyof FormatFnByKey>(key: Parameters<FormatFnByKey[TranslationKey]>[0] extends Record<string, any> ? never : TranslationKey): string;
+};
+declare function useTranslations<Language extends string, FormatFnByKey extends ParsedFormatFnByKey>(translations: TranslationFile<Language, FormatFnByKey>): {
+  ready: boolean;
+  t: TranslateFn<FormatFnByKey>;
+};
+//#endregion
+export { VocabProvider, useLanguage, useTranslations };
+//# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -0,0 +1,92 @@
+//#region rolldown:runtime
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+
+//#endregion
+let react = require("react");
+react = __toESM(react);
+
+//#region src/components.tsx
+const TranslationsContext = react.default.createContext(void 0);
+/**
+* Provides a translation context for your application
+*
+* @example
+* import { VocabProvider } from '@vocab/react';
+*
+* <VocabProvider language="en">
+*   <App />
+* <VocabProvider />
+*/
+const VocabProvider = ({ children, language, locale }) => {
+	const value = (0, react.useMemo)(() => ({
+		language,
+		locale
+	}), [language, locale]);
+	return /* @__PURE__ */ react.default.createElement(TranslationsContext.Provider, { value }, children);
+};
+/**
+* @returns The `language` and `locale` values passed in to your `VocabProvider`
+*/
+const useLanguage = () => {
+	const context = (0, react.useContext)(TranslationsContext);
+	if (!context) throw new Error("Attempted to access translation without Vocab context set. Did you forget to render VocabProvider?");
+	if (!context.language) throw new Error("Attempted to access translation without language set. Did you forget to pass language to VocabProvider?");
+	return context;
+};
+const SERVER_RENDERING = typeof window === "undefined";
+function useTranslations(translations) {
+	const { language, locale } = useLanguage();
+	const [, forceRender] = (0, react.useReducer)((s) => s + 1, 0);
+	const translationsObject = translations.getLoadedMessages(language, locale || language);
+	let ready = true;
+	if (!translationsObject) {
+		if (SERVER_RENDERING) throw new Error(`Translations not synchronously available on server render. Applying translations dynamically server-side is not supported.`);
+		translations.load(language).then(() => {
+			forceRender();
+		});
+		ready = false;
+	}
+	const t = (0, react.useCallback)((key, params) => {
+		if (!translationsObject) return " ";
+		const message = translationsObject?.[key];
+		if (!message) {
+			console.error(`Unable to find translation for key "${key}". Possible keys are ${Object.keys(translationsObject).map((v) => `"${v}"`).join(", ")}`);
+			return "";
+		}
+		const result = message.format(params);
+		if (Array.isArray(result)) for (let i = 0; i < result.length; i++) {
+			const item = result[i];
+			if (typeof item === "object" && item && !item.key && (0, react.isValidElement)(item)) result[i] = (0, react.cloneElement)(item, { key: `_vocab-${i}` });
+		}
+		return result;
+	}, [translationsObject]);
+	return {
+		ready,
+		t
+	};
+}
+
+//#endregion
+exports.VocabProvider = VocabProvider;
+exports.useLanguage = useLanguage;
+exports.useTranslations = useTranslations;
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["React"],"sources":["../src/components.tsx"],"sourcesContent":["import type {\n  TranslationFile,\n  LanguageName,\n  ParsedFormatFnByKey,\n  ParsedFormatFn,\n} from '@vocab/core';\n\nimport React, {\n  type ReactNode,\n  useContext,\n  useMemo,\n  useReducer,\n  isValidElement,\n  cloneElement,\n  useCallback,\n} from 'react';\n\ntype Locale = string;\n\ninterface TranslationsContextValue {\n  /**\n   * The `language` passed in to your `VocabProvider`\n   */\n  language: LanguageName;\n  /**\n   * The `locale` passed in to your `VocabProvider`\n   *\n   * Please note that this value will be `undefined` if you have not passed a `locale` to your `VocabProvider`.\n   * If your languages are named with IETF language tags, you should just use `language` instead of\n   * this value, unless you specifically need to access your `locale` override.\n   */\n  locale?: Locale;\n}\n\nconst TranslationsContext = React.createContext<\n  TranslationsContextValue | undefined\n>(undefined);\n\n// Not extending TranslationsContextValue so we can tailor the docs for each prop to be better\n// suited to the provider, rather than for the useLanguage hook\ninterface VocabProviderProps {\n  /**\n   * The language to load translations for. Must be one of the language names defined in your `vocab.config.js`.\n   */\n  language: TranslationsContextValue['language'];\n  /**\n   * A locale override. By default, Vocab will use the `language` as the locale when formatting messages if\n   * `locale` is not set. If your languages are named with IETF language tags, you probably don't need to\n   * set this value.\n   *\n   * You may want to override the locale for a specific language if the default formatting for that locale\n   * is not desired.\n   *\n   * @example\n   * // Override the locale for th-TH to use the Gregorian calendar instead of the default Buddhist calendar\n   * <VocabProvider language=\"th-TH\" locale=\"th-TH-u-ca-gregory\">\n   *   </App>\n   * <VocabProvider />\n   */\n  locale?: TranslationsContextValue['locale'];\n  children: ReactNode;\n}\n\n/**\n * Provides a translation context for your application\n *\n * @example\n * import { VocabProvider } from '@vocab/react';\n *\n * <VocabProvider language=\"en\">\n *   <App />\n * <VocabProvider />\n */\nexport const VocabProvider = ({\n  children,\n  language,\n  locale,\n}: VocabProviderProps) => {\n  const value = useMemo(() => ({ language, locale }), [language, locale]);\n\n  return (\n    <TranslationsContext.Provider value={value}>\n      {children}\n    </TranslationsContext.Provider>\n  );\n};\n\n/**\n * @returns The `language` and `locale` values passed in to your `VocabProvider`\n */\nexport const useLanguage = (): TranslationsContextValue => {\n  const context = useContext(TranslationsContext);\n  if (!context) {\n    throw new Error(\n      'Attempted to access translation without Vocab context set. Did you forget to render VocabProvider?',\n    );\n  }\n  if (!context.language) {\n    throw new Error(\n      'Attempted to access translation without language set. Did you forget to pass language to VocabProvider?',\n    );\n  }\n\n  return context;\n};\n\nconst SERVER_RENDERING = typeof window === 'undefined';\n\ntype FormatXMLElementReactNodeFn = (parts: ReactNode[]) => ReactNode;\n\ntype MapToReactNodeFunction<Params extends Record<string, any>> = {\n  [key in keyof Params]: Params[key] extends ParsedFormatFn\n    ? FormatXMLElementReactNodeFn\n    : Params[key];\n};\n\ntype TranslateFn<FormatFnByKey extends ParsedFormatFnByKey> = {\n  <TranslationKey extends keyof FormatFnByKey>(\n    key: TranslationKey,\n    params: MapToReactNodeFunction<\n      Parameters<FormatFnByKey[TranslationKey]>[0]\n    >,\n  ): ReturnType<FormatFnByKey[TranslationKey]> extends string\n    ? string\n    : ReactNode | string | Array<ReactNode | string>;\n  <TranslationKey extends keyof FormatFnByKey>(\n    key: Parameters<FormatFnByKey[TranslationKey]>[0] extends Record<\n      string,\n      any\n    >\n      ? never\n      : TranslationKey,\n  ): string;\n};\n\nexport function useTranslations<\n  Language extends string,\n  FormatFnByKey extends ParsedFormatFnByKey,\n>(\n  translations: TranslationFile<Language, FormatFnByKey>,\n): {\n  ready: boolean;\n  t: TranslateFn<FormatFnByKey>;\n} {\n  const { language, locale } = useLanguage();\n  const [, forceRender] = useReducer((s: number) => s + 1, 0);\n\n  const translationsObject = translations.getLoadedMessages(\n    language as any,\n    locale || language,\n  );\n\n  let ready = true;\n\n  if (!translationsObject) {\n    if (SERVER_RENDERING) {\n      throw new Error(\n        `Translations not synchronously available on server render. Applying translations dynamically server-side is not supported.`,\n      );\n    }\n\n    translations.load(language as any).then(() => {\n      forceRender();\n    });\n    ready = false;\n  }\n\n  const t = useCallback(\n    (key: string, params?: any) => {\n      if (!translationsObject) {\n        return ' ';\n      }\n\n      const message = translationsObject?.[key];\n\n      if (!message) {\n        // eslint-disable-next-line no-console\n        console.error(\n          `Unable to find translation for key \"${key}\". Possible keys are ${Object.keys(\n            translationsObject,\n          )\n            .map((v) => `\"${v}\"`)\n            .join(', ')}`,\n        );\n        return '';\n      }\n\n      const result = message.format(params);\n\n      if (Array.isArray(result)) {\n        for (let i = 0; i < result.length; i++) {\n          const item = result[i];\n          if (\n            typeof item === 'object' &&\n            item &&\n            !item.key &&\n            isValidElement(item)\n          ) {\n            result[i] = cloneElement(item, { key: `_vocab-${i}` });\n          }\n        }\n      }\n\n      return result;\n    },\n    [translationsObject],\n  );\n\n  return {\n    ready,\n    t,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCA,MAAM,sBAAsBA,cAAM,cAEhC,OAAU;;;;;;;;;;;AAqCZ,MAAa,iBAAiB,EAC5B,UACA,UACA,aACwB;CACxB,MAAM,kCAAuB;EAAE;EAAU;EAAQ,GAAG,CAAC,UAAU,OAAO,CAAC;AAEvE,QACE,4CAAC,oBAAoB,YAAgB,SAClC,SAC4B;;;;;AAOnC,MAAa,oBAA8C;CACzD,MAAM,gCAAqB,oBAAoB;AAC/C,KAAI,CAAC,QACH,OAAM,IAAI,MACR,qGACD;AAEH,KAAI,CAAC,QAAQ,SACX,OAAM,IAAI,MACR,0GACD;AAGH,QAAO;;AAGT,MAAM,mBAAmB,OAAO,WAAW;AA6B3C,SAAgB,gBAId,cAIA;CACA,MAAM,EAAE,UAAU,WAAW,aAAa;CAC1C,MAAM,GAAG,sCAA2B,MAAc,IAAI,GAAG,EAAE;CAE3D,MAAM,qBAAqB,aAAa,kBACtC,UACA,UAAU,SACX;CAED,IAAI,QAAQ;AAEZ,KAAI,CAAC,oBAAoB;AACvB,MAAI,iBACF,OAAM,IAAI,MACR,6HACD;AAGH,eAAa,KAAK,SAAgB,CAAC,WAAW;AAC5C,gBAAa;IACb;AACF,UAAQ;;CAGV,MAAM,4BACH,KAAa,WAAiB;AAC7B,MAAI,CAAC,mBACH,QAAO;EAGT,MAAM,UAAU,qBAAqB;AAErC,MAAI,CAAC,SAAS;AAEZ,WAAQ,MACN,uCAAuC,IAAI,uBAAuB,OAAO,KACvE,mBACD,CACE,KAAK,MAAM,IAAI,EAAE,GAAG,CACpB,KAAK,KAAK,GACd;AACD,UAAO;;EAGT,MAAM,SAAS,QAAQ,OAAO,OAAO;AAErC,MAAI,MAAM,QAAQ,OAAO,CACvB,MAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK;GACtC,MAAM,OAAO,OAAO;AACpB,OACE,OAAO,SAAS,YAChB,QACA,CAAC,KAAK,iCACS,KAAK,CAEpB,QAAO,6BAAkB,MAAM,EAAE,KAAK,UAAU,KAAK,CAAC;;AAK5D,SAAO;IAET,CAAC,mBAAmB,CACrB;AAED,QAAO;EACL;EACA;EACD"}

package/dist/index.mjs

@@ -0,0 +1,66 @@
+import React, { cloneElement, isValidElement, useCallback, useContext, useMemo, useReducer } from "react";
+
+//#region src/components.tsx
+const TranslationsContext = React.createContext(void 0);
+/**
+* Provides a translation context for your application
+*
+* @example
+* import { VocabProvider } from '@vocab/react';
+*
+* <VocabProvider language="en">
+*   <App />
+* <VocabProvider />
+*/
+const VocabProvider = ({ children, language, locale }) => {
+	const value = useMemo(() => ({
+		language,
+		locale
+	}), [language, locale]);
+	return /* @__PURE__ */ React.createElement(TranslationsContext.Provider, { value }, children);
+};
+/**
+* @returns The `language` and `locale` values passed in to your `VocabProvider`
+*/
+const useLanguage = () => {
+	const context = useContext(TranslationsContext);
+	if (!context) throw new Error("Attempted to access translation without Vocab context set. Did you forget to render VocabProvider?");
+	if (!context.language) throw new Error("Attempted to access translation without language set. Did you forget to pass language to VocabProvider?");
+	return context;
+};
+const SERVER_RENDERING = typeof window === "undefined";
+function useTranslations(translations) {
+	const { language, locale } = useLanguage();
+	const [, forceRender] = useReducer((s) => s + 1, 0);
+	const translationsObject = translations.getLoadedMessages(language, locale || language);
+	let ready = true;
+	if (!translationsObject) {
+		if (SERVER_RENDERING) throw new Error(`Translations not synchronously available on server render. Applying translations dynamically server-side is not supported.`);
+		translations.load(language).then(() => {
+			forceRender();
+		});
+		ready = false;
+	}
+	const t = useCallback((key, params) => {
+		if (!translationsObject) return " ";
+		const message = translationsObject?.[key];
+		if (!message) {
+			console.error(`Unable to find translation for key "${key}". Possible keys are ${Object.keys(translationsObject).map((v) => `"${v}"`).join(", ")}`);
+			return "";
+		}
+		const result = message.format(params);
+		if (Array.isArray(result)) for (let i = 0; i < result.length; i++) {
+			const item = result[i];
+			if (typeof item === "object" && item && !item.key && isValidElement(item)) result[i] = cloneElement(item, { key: `_vocab-${i}` });
+		}
+		return result;
+	}, [translationsObject]);
+	return {
+		ready,
+		t
+	};
+}
+
+//#endregion
+export { VocabProvider, useLanguage, useTranslations };
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":[],"sources":["../src/components.tsx"],"sourcesContent":["import type {\n  TranslationFile,\n  LanguageName,\n  ParsedFormatFnByKey,\n  ParsedFormatFn,\n} from '@vocab/core';\n\nimport React, {\n  type ReactNode,\n  useContext,\n  useMemo,\n  useReducer,\n  isValidElement,\n  cloneElement,\n  useCallback,\n} from 'react';\n\ntype Locale = string;\n\ninterface TranslationsContextValue {\n  /**\n   * The `language` passed in to your `VocabProvider`\n   */\n  language: LanguageName;\n  /**\n   * The `locale` passed in to your `VocabProvider`\n   *\n   * Please note that this value will be `undefined` if you have not passed a `locale` to your `VocabProvider`.\n   * If your languages are named with IETF language tags, you should just use `language` instead of\n   * this value, unless you specifically need to access your `locale` override.\n   */\n  locale?: Locale;\n}\n\nconst TranslationsContext = React.createContext<\n  TranslationsContextValue | undefined\n>(undefined);\n\n// Not extending TranslationsContextValue so we can tailor the docs for each prop to be better\n// suited to the provider, rather than for the useLanguage hook\ninterface VocabProviderProps {\n  /**\n   * The language to load translations for. Must be one of the language names defined in your `vocab.config.js`.\n   */\n  language: TranslationsContextValue['language'];\n  /**\n   * A locale override. By default, Vocab will use the `language` as the locale when formatting messages if\n   * `locale` is not set. If your languages are named with IETF language tags, you probably don't need to\n   * set this value.\n   *\n   * You may want to override the locale for a specific language if the default formatting for that locale\n   * is not desired.\n   *\n   * @example\n   * // Override the locale for th-TH to use the Gregorian calendar instead of the default Buddhist calendar\n   * <VocabProvider language=\"th-TH\" locale=\"th-TH-u-ca-gregory\">\n   *   </App>\n   * <VocabProvider />\n   */\n  locale?: TranslationsContextValue['locale'];\n  children: ReactNode;\n}\n\n/**\n * Provides a translation context for your application\n *\n * @example\n * import { VocabProvider } from '@vocab/react';\n *\n * <VocabProvider language=\"en\">\n *   <App />\n * <VocabProvider />\n */\nexport const VocabProvider = ({\n  children,\n  language,\n  locale,\n}: VocabProviderProps) => {\n  const value = useMemo(() => ({ language, locale }), [language, locale]);\n\n  return (\n    <TranslationsContext.Provider value={value}>\n      {children}\n    </TranslationsContext.Provider>\n  );\n};\n\n/**\n * @returns The `language` and `locale` values passed in to your `VocabProvider`\n */\nexport const useLanguage = (): TranslationsContextValue => {\n  const context = useContext(TranslationsContext);\n  if (!context) {\n    throw new Error(\n      'Attempted to access translation without Vocab context set. Did you forget to render VocabProvider?',\n    );\n  }\n  if (!context.language) {\n    throw new Error(\n      'Attempted to access translation without language set. Did you forget to pass language to VocabProvider?',\n    );\n  }\n\n  return context;\n};\n\nconst SERVER_RENDERING = typeof window === 'undefined';\n\ntype FormatXMLElementReactNodeFn = (parts: ReactNode[]) => ReactNode;\n\ntype MapToReactNodeFunction<Params extends Record<string, any>> = {\n  [key in keyof Params]: Params[key] extends ParsedFormatFn\n    ? FormatXMLElementReactNodeFn\n    : Params[key];\n};\n\ntype TranslateFn<FormatFnByKey extends ParsedFormatFnByKey> = {\n  <TranslationKey extends keyof FormatFnByKey>(\n    key: TranslationKey,\n    params: MapToReactNodeFunction<\n      Parameters<FormatFnByKey[TranslationKey]>[0]\n    >,\n  ): ReturnType<FormatFnByKey[TranslationKey]> extends string\n    ? string\n    : ReactNode | string | Array<ReactNode | string>;\n  <TranslationKey extends keyof FormatFnByKey>(\n    key: Parameters<FormatFnByKey[TranslationKey]>[0] extends Record<\n      string,\n      any\n    >\n      ? never\n      : TranslationKey,\n  ): string;\n};\n\nexport function useTranslations<\n  Language extends string,\n  FormatFnByKey extends ParsedFormatFnByKey,\n>(\n  translations: TranslationFile<Language, FormatFnByKey>,\n): {\n  ready: boolean;\n  t: TranslateFn<FormatFnByKey>;\n} {\n  const { language, locale } = useLanguage();\n  const [, forceRender] = useReducer((s: number) => s + 1, 0);\n\n  const translationsObject = translations.getLoadedMessages(\n    language as any,\n    locale || language,\n  );\n\n  let ready = true;\n\n  if (!translationsObject) {\n    if (SERVER_RENDERING) {\n      throw new Error(\n        `Translations not synchronously available on server render. Applying translations dynamically server-side is not supported.`,\n      );\n    }\n\n    translations.load(language as any).then(() => {\n      forceRender();\n    });\n    ready = false;\n  }\n\n  const t = useCallback(\n    (key: string, params?: any) => {\n      if (!translationsObject) {\n        return ' ';\n      }\n\n      const message = translationsObject?.[key];\n\n      if (!message) {\n        // eslint-disable-next-line no-console\n        console.error(\n          `Unable to find translation for key \"${key}\". Possible keys are ${Object.keys(\n            translationsObject,\n          )\n            .map((v) => `\"${v}\"`)\n            .join(', ')}`,\n        );\n        return '';\n      }\n\n      const result = message.format(params);\n\n      if (Array.isArray(result)) {\n        for (let i = 0; i < result.length; i++) {\n          const item = result[i];\n          if (\n            typeof item === 'object' &&\n            item &&\n            !item.key &&\n            isValidElement(item)\n          ) {\n            result[i] = cloneElement(item, { key: `_vocab-${i}` });\n          }\n        }\n      }\n\n      return result;\n    },\n    [translationsObject],\n  );\n\n  return {\n    ready,\n    t,\n  };\n}\n"],"mappings":";;;AAkCA,MAAM,sBAAsB,MAAM,cAEhC,OAAU;;;;;;;;;;;AAqCZ,MAAa,iBAAiB,EAC5B,UACA,UACA,aACwB;CACxB,MAAM,QAAQ,eAAe;EAAE;EAAU;EAAQ,GAAG,CAAC,UAAU,OAAO,CAAC;AAEvE,QACE,oCAAC,oBAAoB,YAAgB,SAClC,SAC4B;;;;;AAOnC,MAAa,oBAA8C;CACzD,MAAM,UAAU,WAAW,oBAAoB;AAC/C,KAAI,CAAC,QACH,OAAM,IAAI,MACR,qGACD;AAEH,KAAI,CAAC,QAAQ,SACX,OAAM,IAAI,MACR,0GACD;AAGH,QAAO;;AAGT,MAAM,mBAAmB,OAAO,WAAW;AA6B3C,SAAgB,gBAId,cAIA;CACA,MAAM,EAAE,UAAU,WAAW,aAAa;CAC1C,MAAM,GAAG,eAAe,YAAY,MAAc,IAAI,GAAG,EAAE;CAE3D,MAAM,qBAAqB,aAAa,kBACtC,UACA,UAAU,SACX;CAED,IAAI,QAAQ;AAEZ,KAAI,CAAC,oBAAoB;AACvB,MAAI,iBACF,OAAM,IAAI,MACR,6HACD;AAGH,eAAa,KAAK,SAAgB,CAAC,WAAW;AAC5C,gBAAa;IACb;AACF,UAAQ;;CAGV,MAAM,IAAI,aACP,KAAa,WAAiB;AAC7B,MAAI,CAAC,mBACH,QAAO;EAGT,MAAM,UAAU,qBAAqB;AAErC,MAAI,CAAC,SAAS;AAEZ,WAAQ,MACN,uCAAuC,IAAI,uBAAuB,OAAO,KACvE,mBACD,CACE,KAAK,MAAM,IAAI,EAAE,GAAG,CACpB,KAAK,KAAK,GACd;AACD,UAAO;;EAGT,MAAM,SAAS,QAAQ,OAAO,OAAO;AAErC,MAAI,MAAM,QAAQ,OAAO,CACvB,MAAK,IAAI,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK;GACtC,MAAM,OAAO,OAAO;AACpB,OACE,OAAO,SAAS,YAChB,QACA,CAAC,KAAK,OACN,eAAe,KAAK,CAEpB,QAAO,KAAK,aAAa,MAAM,EAAE,KAAK,UAAU,KAAK,CAAC;;AAK5D,SAAO;IAET,CAAC,mBAAmB,CACrB;AAED,QAAO;EACL;EACA;EACD"}

package/package.json

@@ -1,13 +1,21 @@
 {
   "name": "@vocab/react",
-  "version": "1.1.13",
+  "version": "1.1.14-fix-messageformat-import-20250923014407",
   "repository": {
     "type": "git",
     "url": "https://github.com/seek-oss/vocab.git",
     "directory": "packages/react"
   },
-  "main": "dist/vocab-react.cjs.js",
-  "module": "dist/vocab-react.esm.js",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
   "author": "SEEK",
   "license": "MIT",
   "peerDependencies": {
@@ -18,10 +26,10 @@
   ],
   "dependencies": {
     "intl-messageformat": "^10.0.0",
-    "@vocab/core": "^1.6.4"
+    "@vocab/core": "^1.6.5-fix-messageformat-import-20250923014407"
   },
   "devDependencies": {
-    "@types/react": "^18.0.9",
-    "react": "^18.1.0"
+    "@types/react": "^19.1.8",
+    "react": "^19.1.0"
   }
 }