@discord/intl 0.2.2 → 0.4.0

package/dist/formatters/ast.d.ts

@@ -8,9 +8,9 @@ export type AstFunctionTypes = FunctionTypes<RichTextNode, object>;
 export declare enum RichTextNodeType {
     Text = "text",
     Strong = "strong",
-    Emphasis = "emphasis",
-    Strikethrough = "strikethrough",
-    Code = "code",
+    Emphasis = "em",
+    Strikethrough = "s",
+    Code = "inlineCode",
     Link = "link",
     Paragraph = "paragraph",
     /**

package/dist/formatters/ast.js

@@ -50,9 +50,9 @@ var RichTextNodeType;
 (function (RichTextNodeType) {
     RichTextNodeType["Text"] = "text";
     RichTextNodeType["Strong"] = "strong";
-    RichTextNodeType["Emphasis"] = "emphasis";
-    RichTextNodeType["Strikethrough"] = "strikethrough";
-    RichTextNodeType["Code"] = "code";
+    RichTextNodeType["Emphasis"] = "em";
+    RichTextNodeType["Strikethrough"] = "s";
+    RichTextNodeType["Code"] = "inlineCode";
     RichTextNodeType["Link"] = "link";
     RichTextNodeType["Paragraph"] = "paragraph";
     /**

package/dist/formatters/index.d.ts

@@ -1,4 +1,4 @@
 export { astFormatter, type AstFunctionTypes, type RichTextNode, RichTextNodeType } from './ast';
 export { markdownFormatter, type MarkdownFunctionTypes } from './markdown';
-export { reactFormatter, makeReactFormatter, DEFAULT_REACT_RICH_TEXT_ELEMENTS, type ReactFunctionTypes, } from './react';
+export { reactFormatter, makeReactFormatter, DEFAULT_REACT_RICH_TEXT_ELEMENTS, type ReactFunctionTypes, ReactIntlMessage, } from './react';
 export { stringFormatter, type StringFunctionTypes } from './string';

package/dist/formatters/react.d.ts

@@ -18,9 +18,9 @@ export type ReactFunctionTypes = FunctionTypes<React.ReactNode, ReactClickHandle
     onContextMenu: ReactClickHandler;
 }>;
 export declare const DEFAULT_REACT_RICH_TEXT_ELEMENTS: RichTextFormattingMap<ReactFunctionTypes['hook']>;
-export type ReactIntlMessage = React.ReactElement<{}, typeof React.Fragment & {
+export type ReactIntlMessage = Array<React.ReactElement | string> & {
     __brand: 'discord-intl';
-}>;
+};
 export declare function formatReact(this: IntlManager, message: AnyIntlMessage, values: object, Builder: FormatBuilderConstructor<React.ReactElement>): ReactIntlMessage;
 /**
  * Create a new React formatter with the given rich text elements replacing the defaults. Use this

package/dist/formatters/react.js

@@ -94,10 +94,10 @@ function createReactBuilder(richTextElements) {
 }
 function formatReact(message, values, Builder) {
     if (typeof message === 'string') {
-        return React.createElement(React.Fragment, undefined, message);
+        return [message];
     }
     var parts = this.bindFormatValues(Builder, message, values);
-    return React.createElement(React.Fragment, undefined, parts);
+    return parts;
 }
 /**
  * Create a new React formatter with the given rich text elements replacing the defaults. Use this

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { RichTextNode } from './formatters';
 export * from './formatters';
+export { FormatBuilder, FormatBuilderConstructor, bindFormatValues } from './format';
 export { runtimeHashMessageKey } from './hash';
 export { IntlManager, DEFAULT_LOCALE, type FormatFunction } from './intl-manager';
 export { createLoader, loadAllMessagesInLocale, waitForAllDefaultIntlMessagesLoaded, MessageLoader, } from './message-loader';
@@ -20,7 +21,7 @@ export type * from './types.d.ts';
  * intl message, even if the actual value comes from elsewhere (like a
  * user-generated string).
  */
-export type ReactIntlMessage = string | React.ReactElement;
+export type ReactIntlMessage = string | React.ReactElement | Array<string | React.ReactElement>;
 /**
  * The return value of `formatToParts` from `@discord/intl`, this type
  * represents any AST structure for a message rendered using this system.

package/dist/index.js

@@ -14,8 +14,11 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MessageLoader = exports.waitForAllDefaultIntlMessagesLoaded = exports.loadAllMessagesInLocale = exports.createLoader = exports.DEFAULT_LOCALE = exports.IntlManager = exports.runtimeHashMessageKey = void 0;
+exports.MessageLoader = exports.waitForAllDefaultIntlMessagesLoaded = exports.loadAllMessagesInLocale = exports.createLoader = exports.DEFAULT_LOCALE = exports.IntlManager = exports.runtimeHashMessageKey = exports.bindFormatValues = exports.FormatBuilder = void 0;
 __exportStar(require("./formatters"), exports);
+var format_1 = require("./format");
+Object.defineProperty(exports, "FormatBuilder", { enumerable: true, get: function () { return format_1.FormatBuilder; } });
+Object.defineProperty(exports, "bindFormatValues", { enumerable: true, get: function () { return format_1.bindFormatValues; } });
 var hash_1 = require("./hash");
 Object.defineProperty(exports, "runtimeHashMessageKey", { enumerable: true, get: function () { return hash_1.runtimeHashMessageKey; } });
 var intl_manager_1 = require("./intl-manager");

package/dist/intl-manager.js

@@ -49,7 +49,6 @@ var IntlManager = /** @class */ (function () {
         };
         this.defaultLocale = defaultLocale;
         this.currentLocale = defaultLocale;
-        console.log(intl_messageformat_1.IntlMessageFormat.formats);
         this.intl = (0, intl_1.createIntl)({
             formats: intl_messageformat_1.IntlMessageFormat.formats,
             defaultLocale: defaultLocale,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@discord/intl",
-  "version": "0.2.2",
+  "version": "0.4.0",
   "license": "MIT",
   "description": "Client runtime for managing messages and translations in a React project.",
   "main": "./dist/index.js",

package/src/formatters/ast.ts

@@ -20,9 +20,9 @@ export type AstFunctionTypes = FunctionTypes<RichTextNode, object>;
 export enum RichTextNodeType {
   Text = 'text',
   Strong = 'strong',
-  Emphasis = 'emphasis',
-  Strikethrough = 'strikethrough',
-  Code = 'code',
+  Emphasis = 'em',
+  Strikethrough = 's',
+  Code = 'inlineCode',
   Link = 'link',
   Paragraph = 'paragraph',
   /**

package/src/formatters/index.ts

@@ -5,5 +5,6 @@ export {
   makeReactFormatter,
   DEFAULT_REACT_RICH_TEXT_ELEMENTS,
   type ReactFunctionTypes,
+  ReactIntlMessage,
 } from './react';
 export { stringFormatter, type StringFunctionTypes } from './string';

package/src/formatters/react.ts

@@ -71,10 +71,9 @@ function createReactBuilder(richTextElements: RichTextFormattingMap<ReactFunctio
   };
 }
 
-export type ReactIntlMessage = React.ReactElement<
-  {},
-  typeof React.Fragment & { __brand: 'discord-intl' }
->;
+// This is explicitly `ReactElement | string` and _not_ `ReactNode`, because nullish values and any
+// other type that ReactNode accepts (boolean, number, etc.) are _not_ valid children of a message.
+export type ReactIntlMessage = Array<React.ReactElement | string> & { __brand: 'discord-intl' };
 
 export function formatReact(
   this: IntlManager,
@@ -83,11 +82,11 @@ export function formatReact(
   Builder: FormatBuilderConstructor<React.ReactElement>,
 ): ReactIntlMessage {
   if (typeof message === 'string') {
-    return React.createElement(React.Fragment, undefined, message) as ReactIntlMessage;
+    return [message] as ReactIntlMessage;
   }
 
   const parts = this.bindFormatValues(Builder, message, values);
-  return React.createElement(React.Fragment, undefined, parts) as ReactIntlMessage;
+  return parts as ReactIntlMessage;
 }
 
 /**

package/src/index.ts

@@ -2,6 +2,7 @@ import * as React from 'react';
 import { RichTextNode } from './formatters';
 
 export * from './formatters';
+export { FormatBuilder, FormatBuilderConstructor, bindFormatValues } from './format';
 export { runtimeHashMessageKey } from './hash';
 export { IntlManager, DEFAULT_LOCALE, type FormatFunction } from './intl-manager';
 export {
@@ -28,7 +29,7 @@ export type * from './types.d.ts';
  * user-generated string).
  */
 // TODO: Replace this with ReactIntlMessage from `formatters/react`.
-export type ReactIntlMessage = string | React.ReactElement;
+export type ReactIntlMessage = string | React.ReactElement | Array<string | React.ReactElement>;
 
 /**
  * The return value of `formatToParts` from `@discord/intl`, this type

package/src/intl-manager.ts

@@ -47,7 +47,6 @@ export class IntlManager {
   constructor(defaultLocale: string = DEFAULT_LOCALE) {
     this.defaultLocale = defaultLocale;
     this.currentLocale = defaultLocale;
-    console.log(IntlMessageFormat.formats);
     this.intl = createIntl({
       formats: IntlMessageFormat.formats,
       defaultLocale,