@octanejs/aria 0.0.5 → 0.0.6

package/src/grid/useGridRow.ts

@@ -0,0 +1,108 @@
+// Ported from react-aria (source: .react-spectrum/packages/react-aria/src/grid/useGridRow.ts).
+// octane adaptations:
+// - `GridState`/`IGridCollection`/`GridNode` come from the ported stately grid hooks;
+//   `DOMAttributes` is a local structural prop-bag alias.
+// - Public-hook slot threading (splitSlot/subSlot).
+import { chain } from '../utils/chain';
+
+import type { FocusableElement, RefObject } from '@react-types/shared';
+import type { IGridCollection as GridCollection, GridNode } from '../stately/grid/GridCollection';
+import { gridMap } from './utils';
+import type { GridState } from '../stately/grid/useGridState';
+import { SelectableItemStates, useSelectableItem } from '../selection/useSelectableItem';
+
+import { S, splitSlot, subSlot } from '../internal';
+
+// octane adaptation: minimal structural DOMAttributes (upstream's drags React's synthetic
+// handler types along).
+type DOMAttributes = Record<string, any>;
+
+export interface GridRowProps<T> {
+	/**
+	 * An object representing the grid row. Contains all the relevant information that makes up the
+	 * grid row.
+	 */
+	node: GridNode<T>;
+	/** Whether the grid row is contained in a virtual scroller. */
+	isVirtualized?: boolean;
+	/** Whether selection should occur on press up instead of press down. */
+	shouldSelectOnPressUp?: boolean;
+	/**
+	 * Handler that is called when a user performs an action on the row.
+	 * Please use onCellAction at the collection level instead.
+	 *
+	 * @deprecated
+	 */
+	onAction?: () => void;
+}
+
+export interface GridRowAria extends SelectableItemStates {
+	/** Props for the grid row element. */
+	rowProps: DOMAttributes;
+	/** Whether the row is currently in a pressed state. */
+	isPressed: boolean;
+}
+
+/**
+ * Provides the behavior and accessibility implementation for a row in a grid.
+ *
+ * @param props - Props for the row.
+ * @param state - State of the parent grid, as returned by `useGridState`.
+ */
+export function useGridRow<T, C extends GridCollection<T>, S extends GridState<T, C>>(
+	props: GridRowProps<T>,
+	state: S,
+	ref: RefObject<FocusableElement | null>,
+): GridRowAria;
+// Slot-threading form: sibling ported hooks pass their derived sub-slot as the trailing arg.
+export function useGridRow<T, C extends GridCollection<T>, S extends GridState<T, C>>(
+	props: GridRowProps<T>,
+	state: S,
+	ref: RefObject<FocusableElement | null>,
+	slot: symbol | undefined,
+): GridRowAria;
+export function useGridRow(...args: any[]): GridRowAria {
+	const [user, slotArg] = splitSlot(args);
+	const slot = slotArg ?? S('useGridRow');
+	const props = user[0] as GridRowProps<any>;
+	const state = user[1] as GridState<any, GridCollection<any>>;
+	const ref = user[2] as RefObject<FocusableElement | null>;
+
+	let { node, isVirtualized, shouldSelectOnPressUp, onAction } = props;
+
+	let { actions, shouldSelectOnPressUp: gridShouldSelectOnPressUp } = gridMap.get(state)!;
+	let onRowAction = actions.onRowAction ? () => actions.onRowAction?.(node.key) : onAction;
+	let { itemProps, ...states } = useSelectableItem(
+		{
+			selectionManager: state.selectionManager,
+			key: node.key,
+			ref,
+			isVirtualized,
+			shouldSelectOnPressUp: gridShouldSelectOnPressUp || shouldSelectOnPressUp,
+			onAction:
+				onRowAction || node?.props?.onAction
+					? chain(node?.props?.onAction, onRowAction)
+					: undefined,
+			isDisabled: state.collection.size === 0,
+		},
+		subSlot(slot, 'selectableItem'),
+	);
+
+	let isSelected = state.selectionManager.isSelected(node.key);
+
+	let rowProps: DOMAttributes = {
+		role: 'row',
+		'aria-selected': state.selectionManager.selectionMode !== 'none' ? isSelected : undefined,
+		'aria-disabled': states.isDisabled || undefined,
+		...itemProps,
+	};
+
+	if (isVirtualized) {
+		rowProps['aria-rowindex'] = node.index + 1; // aria-rowindex is 1 based
+	}
+
+	return {
+		rowProps,
+		...states,
+	};
+}

package/src/grid/useGridRowGroup.ts

@@ -0,0 +1,29 @@
+// Ported from react-aria (source: .react-spectrum/packages/react-aria/src/grid/useGridRowGroup.ts).
+// octane adaptations: `DOMAttributes` is a local structural prop-bag alias. The hook
+// composes no base hooks, so the optional trailing slot is accepted (uniform calling
+// convention) and unused.
+import { splitSlot } from '../internal';
+
+// octane adaptation: minimal structural DOMAttributes (upstream's drags React's synthetic
+// handler types along).
+type DOMAttributes = Record<string, any>;
+
+export interface GridRowGroupAria {
+	/** Props for the row group element. */
+	rowGroupProps: DOMAttributes;
+}
+
+/**
+ * Provides the accessibility implementation for a row group in a grid.
+ */
+export function useGridRowGroup(): GridRowGroupAria;
+// Slot-threading form: sibling ported hooks pass their derived sub-slot as the trailing arg.
+export function useGridRowGroup(slot: symbol | undefined): GridRowGroupAria;
+export function useGridRowGroup(...args: any[]): GridRowGroupAria {
+	splitSlot(args);
+	return {
+		rowGroupProps: {
+			role: 'rowgroup',
+		},
+	};
+}

package/src/grid/utils.ts

@@ -0,0 +1,24 @@
+// Ported from react-aria (source: .react-spectrum/packages/react-aria/src/grid/utils.ts).
+// octane adaptations: `GridState`/`IGridCollection` types come from the ported stately
+// grid hooks.
+import type { IGridCollection as GridCollection } from '../stately/grid/GridCollection';
+
+import type { GridState } from '../stately/grid/useGridState';
+import type { Key, KeyboardDelegate } from '@react-types/shared';
+
+interface GridMapShared {
+	keyboardDelegate: KeyboardDelegate;
+	actions: {
+		onRowAction?: (key: Key) => void;
+		onCellAction?: (key: Key) => void;
+	};
+	shouldSelectOnPressUp?: boolean;
+}
+
+// Used to share:
+// keyboard delegate between useGrid and useGridCell
+// onRowAction/onCellAction across hooks
+export const gridMap: WeakMap<
+	GridState<unknown, GridCollection<unknown>>,
+	GridMapShared
+> = new WeakMap<GridState<unknown, GridCollection<unknown>>, GridMapShared>();

package/src/index.ts

@@ -318,3 +318,41 @@ export type {
 // combobox — mirrors the @react-aria/combobox shim surface.
 export { useComboBox } from './combobox/useComboBox';
 export type { AriaComboBoxProps, AriaComboBoxOptions, ComboBoxAria } from './combobox/useComboBox';
+
+// tree — mirrors the @react-aria/tree shim surface.
+export { useTree } from './tree/useTree';
+export { useTreeItem } from './tree/useTreeItem';
+export type { AriaTreeOptions, AriaTreeProps, TreeAria, TreeProps } from './tree/useTree';
+export type { AriaTreeItemOptions, TreeItemAria } from './tree/useTreeItem';
+
+// table — mirrors the @react-aria/table shim surface.
+export { useTable } from './table/useTable';
+export { useTableColumnHeader } from './table/useTableColumnHeader';
+export { useTableRow } from './table/useTableRow';
+export { useTableHeaderRow } from './table/useTableHeaderRow';
+export { useTableCell } from './table/useTableCell';
+export {
+	useTableSelectionCheckbox,
+	useTableSelectAllCheckbox,
+} from './table/useTableSelectionCheckbox';
+export { useTableColumnResize } from './table/useTableColumnResize';
+export { useTableRowGroup } from './table/useTableRowGroup';
+export type { AriaTableProps } from './table/useTable';
+export type {
+	AriaTableColumnHeaderProps,
+	TableColumnHeaderAria,
+} from './table/useTableColumnHeader';
+export type { TableRowAria } from './table/useTableRow';
+export type { TableHeaderRowAria } from './table/useTableHeaderRow';
+export type { AriaTableCellProps, TableCellAria } from './table/useTableCell';
+export type {
+	AriaTableSelectionCheckboxProps,
+	TableSelectionCheckboxAria,
+	TableSelectAllCheckboxAria,
+} from './table/useTableSelectionCheckbox';
+export type {
+	AriaTableColumnResizeProps,
+	TableColumnResizeAria,
+} from './table/useTableColumnResize';
+export type { GridAria, GridProps } from './grid/useGrid';
+export type { GridRowAria, GridRowProps } from './grid/useGridRow';

package/src/intl/autocomplete/index.ts

@@ -2,6 +2,13 @@
 // upstream's Parcel glob import (`import intlMessages from '../../intl/autocomplete/*.json'`).
 // The JSON files are copied VERBATIM from .react-spectrum/packages/react-aria/intl/autocomplete/;
 // refresh them from the pinned checkout on version bumps, never hand-edit.
+//
+// Upstream's Parcel build additionally compiles each message through
+// @internationalized/string-compiler, so `{variable}` placeholders and plural/select
+// ICU arguments become message FUNCTIONS (LocalizedStringFormatter interpolates only
+// function messages — plain strings are returned verbatim). `compileDictionaries`
+// applies the equivalent compile step here at module init.
+import { compileDictionaries } from '../compileMessages';
 import ar_AE from './ar-AE.json';
 import bg_BG from './bg-BG.json';
 import cs_CZ from './cs-CZ.json';
@@ -37,7 +44,7 @@ import uk_UA from './uk-UA.json';
 import zh_CN from './zh-CN.json';
 import zh_TW from './zh-TW.json';
 
-export default {
+export default compileDictionaries({
 	'ar-AE': ar_AE,
 	'bg-BG': bg_BG,
 	'cs-CZ': cs_CZ,
@@ -72,4 +79,4 @@ export default {
 	'uk-UA': uk_UA,
 	'zh-CN': zh_CN,
 	'zh-TW': zh_TW,
-} as Record<string, Record<string, string>>;
+});

package/src/intl/breadcrumbs/index.ts

@@ -2,6 +2,13 @@
 // upstream's Parcel glob import (`import intlMessages from '../../intl/breadcrumbs/*.json'`).
 // The JSON files are copied VERBATIM from .react-spectrum/packages/react-aria/intl/breadcrumbs/;
 // refresh them from the pinned checkout on version bumps, never hand-edit.
+//
+// Upstream's Parcel build additionally compiles each message through
+// @internationalized/string-compiler, so `{variable}` placeholders and plural/select
+// ICU arguments become message FUNCTIONS (LocalizedStringFormatter interpolates only
+// function messages — plain strings are returned verbatim). `compileDictionaries`
+// applies the equivalent compile step here at module init.
+import { compileDictionaries } from '../compileMessages';
 import ar_AE from './ar-AE.json';
 import bg_BG from './bg-BG.json';
 import cs_CZ from './cs-CZ.json';
@@ -37,7 +44,7 @@ import uk_UA from './uk-UA.json';
 import zh_CN from './zh-CN.json';
 import zh_TW from './zh-TW.json';
 
-export default {
+export default compileDictionaries({
 	'ar-AE': ar_AE,
 	'bg-BG': bg_BG,
 	'cs-CZ': cs_CZ,
@@ -72,4 +79,4 @@ export default {
 	'uk-UA': uk_UA,
 	'zh-CN': zh_CN,
 	'zh-TW': zh_TW,
-} as Record<string, Record<string, string>>;
+});

package/src/intl/combobox/index.ts

@@ -2,6 +2,13 @@
 // upstream's Parcel glob import (`import intlMessages from '../../intl/combobox/*.json'`).
 // The JSON files are copied VERBATIM from .react-spectrum/packages/react-aria/intl/combobox/;
 // refresh them from the pinned checkout on version bumps, never hand-edit.
+//
+// Upstream's Parcel build additionally compiles each message through
+// @internationalized/string-compiler, so `{variable}` placeholders and plural/select
+// ICU arguments become message FUNCTIONS (LocalizedStringFormatter interpolates only
+// function messages — plain strings are returned verbatim). `compileDictionaries`
+// applies the equivalent compile step here at module init.
+import { compileDictionaries } from '../compileMessages';
 import ar_AE from './ar-AE.json';
 import bg_BG from './bg-BG.json';
 import cs_CZ from './cs-CZ.json';
@@ -37,7 +44,7 @@ import uk_UA from './uk-UA.json';
 import zh_CN from './zh-CN.json';
 import zh_TW from './zh-TW.json';
 
-export default {
+export default compileDictionaries({
 	'ar-AE': ar_AE,
 	'bg-BG': bg_BG,
 	'cs-CZ': cs_CZ,
@@ -72,4 +79,4 @@ export default {
 	'uk-UA': uk_UA,
 	'zh-CN': zh_CN,
 	'zh-TW': zh_TW,
-} as Record<string, Record<string, string>>;
+});

package/src/intl/compileMessages.ts

@@ -0,0 +1,356 @@
+// Shared runtime ICU message compiler for the generated src/intl/*/index.ts
+// locale-dictionary indexes.
+//
+// Upstream react-aria loads its intl JSON through a Parcel transform that runs every
+// message through @internationalized/string-compiler at BUILD time, turning any message
+// with arguments into a function `(args, formatter) => string`.
+// LocalizedStringFormatter.format only interpolates function messages — plain strings
+// are returned verbatim — so exporting the raw JSON would render `Increase {fieldLabel}`
+// and raw ICU plural source literally. This module is the runtime equivalent of that
+// build step; each generated index applies it once at module init via
+// `compileDictionaries`.
+//
+// It supports the ICU MessageFormat constructs the vendored dictionaries use: literal
+// text (with ICU apostrophe quoting), `{argument}` interpolation, `{arg, number}`,
+// `{arg, plural, …}` / `{arg, selectordinal, …}` (`offset:`, exact `=N` and category
+// selectors, `#`), and `{arg, select, …}`, all arbitrarily nestable. Anything else
+// (date/time arguments, number styles) throws at module init so a dictionary refresh
+// that introduces a new construct fails loudly instead of silently rendering raw ICU
+// source. Evaluation mirrors @internationalized/string-compiler's generated code
+// exactly: `{argument}` coerces like a template literal, plural/select branches without
+// arguments stay plain strings while branches with arguments become thunks over the
+// current args, and `#` formats the nearest enclosing plural's value (select branches
+// inherit it) through `formatter.number`.
+import type {
+	LocalizedString,
+	LocalizedStringFormatter,
+	Variables,
+} from '@internationalized/string';
+
+// Structural view of LocalizedStringFormatter's plural/select/number helpers. They are
+// `protected` in the published types, but compiled messages — upstream's and these —
+// call them: format() passes the formatter itself as the message function's second
+// argument for exactly this purpose.
+interface MessageFormatter {
+	plural(
+		count: number,
+		options: Record<string, string | (() => string)>,
+		type?: Intl.PluralRuleType,
+	): string;
+	select(options: Record<string, string | (() => string)>, value: string): string;
+	number(value: number): string;
+}
+
+type Part =
+	| { type: 'literal'; value: string }
+	| { type: 'argument'; name: string }
+	| { type: 'number'; name: string }
+	| { type: 'pound' }
+	| {
+			type: 'plural';
+			name: string;
+			offset: number;
+			pluralType: Intl.PluralRuleType;
+			options: Option[];
+	  }
+	| { type: 'select'; name: string; options: Option[] };
+
+// A plural/select branch. Literal-only branches pre-join to a plain string (`text`),
+// matching upstream's compiled string-literal options; branches with arguments keep
+// their parts and are rendered through a per-call thunk that captures the current args.
+type Option = { key: string; text: string | null; parts: Part[] };
+
+class MessageParser {
+	private pos = 0;
+
+	constructor(private message: string) {}
+
+	parse(): Part[] {
+		const parts = this.parseParts(false, false);
+		if (this.pos < this.message.length) {
+			throw this.error('unmatched `}`');
+		}
+		return parts;
+	}
+
+	private error(reason: string): Error {
+		return new Error(`unsupported ICU message (${reason} at offset ${this.pos}): ${this.message}`);
+	}
+
+	// Parses parts until end of input, or until an unconsumed `}` when `nested`.
+	private parseParts(nested: boolean, inPlural: boolean): Part[] {
+		const msg = this.message;
+		const parts: Part[] = [];
+		let literal = '';
+		const flush = () => {
+			if (literal !== '') {
+				parts.push({ type: 'literal', value: literal });
+				literal = '';
+			}
+		};
+		while (this.pos < msg.length) {
+			const ch = msg[this.pos];
+			if (ch === '}') {
+				if (nested) {
+					break;
+				}
+				throw this.error('unmatched `}`');
+			} else if (ch === '{') {
+				flush();
+				parts.push(this.parseArgument(inPlural));
+			} else if (ch === '#' && inPlural) {
+				flush();
+				parts.push({ type: 'pound' });
+				this.pos++;
+			} else if (ch === "'") {
+				literal += this.parseQuoted(inPlural);
+			} else {
+				literal += ch;
+				this.pos++;
+			}
+		}
+		flush();
+		return parts;
+	}
+
+	// ICU apostrophe quoting: `''` is a literal apostrophe; an apostrophe immediately
+	// before a syntax character (`{`, `}`, or `#` inside plural) quotes literal text up
+	// to the next lone apostrophe (an unterminated quote runs to end of message); any
+	// other apostrophe is plain text.
+	private parseQuoted(inPlural: boolean): string {
+		const msg = this.message;
+		const next = msg[this.pos + 1];
+		if (next === "'") {
+			this.pos += 2;
+			return "'";
+		}
+		if (next === '{' || next === '}' || (inPlural && next === '#')) {
+			this.pos += 2;
+			let out = next;
+			while (this.pos < msg.length) {
+				if (msg[this.pos] === "'") {
+					if (msg[this.pos + 1] === "'") {
+						out += "'";
+						this.pos += 2;
+						continue;
+					}
+					this.pos++;
+					return out;
+				}
+				out += msg[this.pos++];
+			}
+			return out;
+		}
+		this.pos++;
+		return "'";
+	}
+
+	private parseArgument(inPlural: boolean): Part {
+		this.pos++; // consume `{`
+		const name = this.parseToken();
+		if (!/^\w+$/.test(name)) {
+			throw this.error('invalid argument name');
+		}
+		if (this.consume('}')) {
+			return { type: 'argument', name };
+		}
+		this.expect(',');
+		const kind = this.parseToken();
+		switch (kind) {
+			case 'number':
+				if (this.consume('}')) {
+					return { type: 'number', name };
+				}
+				throw this.error('number format styles are unsupported');
+			case 'plural':
+			case 'selectordinal': {
+				this.expect(',');
+				this.skipWs();
+				let offset = 0;
+				if (this.message.startsWith('offset:', this.pos)) {
+					this.pos += 'offset:'.length;
+					this.skipWs();
+					let digits = '';
+					while (/\d/.test(this.message[this.pos] ?? '')) {
+						digits += this.message[this.pos++];
+					}
+					if (digits === '') {
+						throw this.error('invalid plural offset');
+					}
+					offset = parseInt(digits, 10);
+				}
+				// `#` binds to this plural inside every branch, including nested selects.
+				const options = this.parseOptions(true);
+				this.expect('}');
+				return {
+					type: 'plural',
+					name,
+					offset,
+					pluralType: kind === 'plural' ? 'cardinal' : 'ordinal',
+					options,
+				};
+			}
+			case 'select': {
+				this.expect(',');
+				// Select branches inherit the surrounding plural context for `#`.
+				const options = this.parseOptions(inPlural);
+				this.expect('}');
+				return { type: 'select', name, options };
+			}
+			default:
+				throw this.error(`unsupported argument type \`${kind}\``);
+		}
+	}
+
+	private parseOptions(branchInPlural: boolean): Option[] {
+		const options: Option[] = [];
+		for (;;) {
+			this.skipWs();
+			if (this.pos >= this.message.length || this.message[this.pos] === '}') {
+				break;
+			}
+			let key = '';
+			while (
+				this.pos < this.message.length &&
+				!'{}'.includes(this.message[this.pos]) &&
+				!/\s/.test(this.message[this.pos])
+			) {
+				key += this.message[this.pos++];
+			}
+			if (key === '') {
+				throw this.error('invalid option selector');
+			}
+			this.skipWs();
+			this.expect('{');
+			const parts = this.parseParts(true, branchInPlural);
+			this.expect('}');
+			options.push(
+				parts.every((p) => p.type === 'literal')
+					? { key, text: parts.map((p) => (p as { value: string }).value).join(''), parts }
+					: { key, text: null, parts },
+			);
+		}
+		if (options.length === 0) {
+			throw this.error('missing option selectors');
+		}
+		return options;
+	}
+
+	private parseToken(): string {
+		let out = '';
+		while (this.pos < this.message.length && !',}'.includes(this.message[this.pos])) {
+			out += this.message[this.pos++];
+		}
+		return out.trim();
+	}
+
+	private consume(ch: string): boolean {
+		if (this.message[this.pos] === ch) {
+			this.pos++;
+			return true;
+		}
+		return false;
+	}
+
+	private expect(ch: string): void {
+		if (!this.consume(ch)) {
+			throw this.error(`expected \`${ch}\``);
+		}
+	}
+
+	private skipWs(): void {
+		while (/\s/.test(this.message[this.pos] ?? '')) {
+			this.pos++;
+		}
+	}
+}
+
+function renderParts(
+	parts: Part[],
+	args: Variables,
+	formatter: MessageFormatter,
+	pluralValue: number | undefined,
+): string {
+	let res = '';
+	for (const part of parts) {
+		switch (part.type) {
+			case 'literal':
+				res += part.value;
+				break;
+			case 'argument':
+				// Matches the compiled `${args.name}` template hole (String coercion).
+				res += String(args?.[part.name]);
+				break;
+			case 'number':
+				res += formatter.number(args?.[part.name] as number);
+				break;
+			case 'pound':
+				res += formatter.number(pluralValue as number);
+				break;
+			case 'plural': {
+				const value =
+					part.offset === 0
+						? (args?.[part.name] as number)
+						: (args?.[part.name] as number) - part.offset;
+				res += formatter.plural(
+					value,
+					buildOptions(part.options, args, formatter, value),
+					part.pluralType === 'cardinal' ? undefined : part.pluralType,
+				);
+				break;
+			}
+			case 'select':
+				res += formatter.select(
+					buildOptions(part.options, args, formatter, pluralValue),
+					args?.[part.name] as string,
+				);
+				break;
+		}
+	}
+	return res;
+}
+
+function buildOptions(
+	options: Option[],
+	args: Variables,
+	formatter: MessageFormatter,
+	pluralValue: number | undefined,
+): Record<string, string | (() => string)> {
+	const out: Record<string, string | (() => string)> = {};
+	for (const option of options) {
+		out[option.key] =
+			option.text !== null
+				? option.text
+				: () => renderParts(option.parts, args, formatter, pluralValue);
+	}
+	return out;
+}
+
+export function compileString(message: string): LocalizedString {
+	const parts = new MessageParser(message).parse();
+	if (parts.every((p) => p.type === 'literal')) {
+		// No arguments: stays a plain (de-quoted) string, like upstream's compiled output.
+		return parts.map((p) => (p as { value: string }).value).join('');
+	}
+	return (args: Variables, formatter?: LocalizedStringFormatter<any, any>) =>
+		renderParts(parts, args, formatter as unknown as MessageFormatter, undefined);
+}
+
+export function compileDictionaries(
+	dictionaries: Record<string, Record<string, string>>,
+): Record<string, Record<string, LocalizedString>> {
+	const compiled: Record<string, Record<string, LocalizedString>> = {};
+	for (const locale in dictionaries) {
+		const strings = dictionaries[locale];
+		const out: Record<string, LocalizedString> = {};
+		for (const key in strings) {
+			try {
+				out[key] = compileString(strings[key]);
+			} catch (e) {
+				throw new Error(`Failed to compile intl message ${locale}/${key}: ${(e as Error).message}`);
+			}
+		}
+		compiled[locale] = out;
+	}
+	return compiled;
+}

package/src/intl/grid/index.ts

@@ -2,6 +2,13 @@
 // upstream's Parcel glob import (`import intlMessages from '../../intl/grid/*.json'`).
 // The JSON files are copied VERBATIM from .react-spectrum/packages/react-aria/intl/grid/;
 // refresh them from the pinned checkout on version bumps, never hand-edit.
+//
+// Upstream's Parcel build additionally compiles each message through
+// @internationalized/string-compiler, so `{variable}` placeholders and plural/select
+// ICU arguments become message FUNCTIONS (LocalizedStringFormatter interpolates only
+// function messages — plain strings are returned verbatim). `compileDictionaries`
+// applies the equivalent compile step here at module init.
+import { compileDictionaries } from '../compileMessages';
 import ar_AE from './ar-AE.json';
 import bg_BG from './bg-BG.json';
 import cs_CZ from './cs-CZ.json';
@@ -37,7 +44,7 @@ import uk_UA from './uk-UA.json';
 import zh_CN from './zh-CN.json';
 import zh_TW from './zh-TW.json';
 
-export default {
+export default compileDictionaries({
 	'ar-AE': ar_AE,
 	'bg-BG': bg_BG,
 	'cs-CZ': cs_CZ,
@@ -72,4 +79,4 @@ export default {
 	'uk-UA': uk_UA,
 	'zh-CN': zh_CN,
 	'zh-TW': zh_TW,
-} as Record<string, Record<string, string>>;
+});