react-intlayer
Version:
Easily internationalize i18n your React applications with type-safe multilingual content management.
36 lines (33 loc) • 1.1 kB
JavaScript
'use client';
import { IntlayerClientContext } from "../IntlayerProvider.mjs";
import { useCallback, useContext } from "react";
import { percentage } from "@intlayer/core";
//#region src/client/format/usePercentage.ts
/**
* React hook to provide a percentage formatter function
* based on the current application locale.
*
* This hook retrieves the active locale using {@link useLocaleBase}
* and memoizes a `createPercentage` instance for that locale.
*
* @example
* ```tsx
* const formatPercentage = usePercentage();
*
* const result = formatPercentage(0.875, { maximumFractionDigits: 1 });
* // "87.5%" (depending on locale)
* ```
*
* @returns {(value: string | number, options?: Omit<PercentageOptions, "value">) => string}
* A function that formats numbers or numeric strings into localized percentages.
*/
const usePercentage = () => {
const { locale } = useContext(IntlayerClientContext);
return useCallback((...args) => percentage(args[0], {
...args[1],
locale: args[1]?.locale ?? locale
}), [locale]);
};
//#endregion
export { usePercentage };
//# sourceMappingURL=usePercentage.mjs.map