@uxf/localize 10.0.0-beta.25 → 10.0.0-beta.30

package/README.md

@@ -14,14 +14,15 @@ yarn add @uxf/localize
 npm install @uxf/localize
 ```
 
-## Basic usage
+## Initialize and configure package
 
-### Initialize and configure package
+### Configure package
 
 ```ts
+// localize.ts
 import { createLocalize } from "@uxf/localize";
-import cs from "@uxf/localize/locale/cs";
-import en from "@uxf/localize/locale/en";
+import cs from "@uxf/localize/locale/cs"; // LocalizeConfig
+import en from "@uxf/localize/locale/en"; // LocalizeConfig
 
 export const { 
     LocalizeProvider,
@@ -36,31 +37,124 @@ export const {
 } = createLocale({ cs, en });
 ```
 
-### Implement context provider
+### Localize config examples
 
-use LocalizeProvider in **_app.tsx**
+```ts
+import {DateTimes, LocalizeConfig} from "@uxf/localize";
+
+const en: LocalizeConfig = {
+    number: {
+        thousandsSeparator: ",",
+        decimalSeparator: ".",
+    },
+    currency: {
+        thousandsSeparator: ",",
+        decimalSeparator: ".",
+        pattern: "!#",
+        negativePattern: "-!#",
+    },
+    dateTime: {
+        timeShort: "H:mm A",
+        timeFull: "H:mm:ss A",
+        dateShort: "M/D/YY",
+        dateMedium: "M/D/YYYY",
+        dateLong: "MMMM D. YYYY",
+        dateShortNoYear: "M/D",
+        dateLongNoYear: "MMMM D.",
+        dateTimeShort: "M/D/YY H:mm A",
+        dateTimeMedium: "M/D/YYYY H:mm A",
+        dateTimeLong: "MMMM D. YYYY H:mm:ss A",
+    },
+};
+
+const cs: LocalizeConfig<DateTimes> = {
+    number: {
+        thousandsSeparator: "\xa0",
+        decimalSeparator: ",",
+    },
+    currency: {
+        thousandsSeparator: "\xa0",
+        decimalSeparator: ",",
+        pattern: "#\xa0!",
+        negativePattern: "-#\xa0!",
+    },
+    dateTime: {
+        timeShort: "H:mm",
+        timeFull: "H:mm:ss",
+        dateShort: "D. M. YY",
+        dateMedium: "D. M. YYYY",
+        dateLong: "D. MMMM YYYY",
+        dateShortNoYear: "D. M.",
+        dateLongNoYear: "D. MMMM",
+        dateTimeShort: "D. M. YY, H:mm",
+        dateTimeMedium: "D. M. YYYY, H:mm",
+        dateTimeLong: "D. MMMM YYYY, H:mm:ss",
+    },
+};
+```
+
+### Add LocalizeProvider to _app.tsx
 
 ```tsx
-<LocalizeProvider locale="en">{props.children}</LocalizeProvider>
+// _app.tsx
+
+<LocalizeProvider locale="cs">{props.children}</LocalizeProvider>
 ```
 
-### Format for default locale
+## Format number
+```tsx
+const { useFormatNumber } from "./localize";
 
-```ts
-import { useFormatMoney } from "...";
+const formatNumber = useFormatNumber();
+
+formatNumber(1000.23); // 1 000
+formatNumber(1000.23, { precision: 2 }); // 1 000,23
+```
+
+## Format datetime
+```tsx
+const { useFormatDateTime } from "./localize";
+
+const formatDateTime = useFormatDateTime();
+
+formatDateTime(new Date('2000-01-01'), "dateShort") // 1. 1. 20
+formatDateTime(new Date('2000-01-01'), "dateTimeMedium") // 1. 1. 2000 00:00
+formatDateTime(new Date('2000-01-01'), "timeFull") // 00:00:00
+```
+
+## Format money
+```tsx
+const { useFormatMoney } from "./localize";
 
 const formatMoney = useFormatMoney();
 
-formatMoney(5800, "EUR"); // €5.800
+formatMoney(1000, "CZK") // 1 000 Kč
+formatMoney(1000, "USD") // 1 000 $
+formatMoney(1000.23, "CZK", { precision: 1 }) // 1 000,2 Kč
+formatMoney(1000.23, "CZK", { preferIsoCode: true }) // 1 000,23 CZK
+formatMoney(1000.23, "CZK", { hideSymbol: true }) // 1 000,23
 ```
 
-### Format for another locale
+## Format percentage
 
-```ts
-import { formatMoney } from "...";
+```tsx
+const { useFormatPercentage } from "./localize";
 
-formatMoney("cs", 5800, "EUR"); // 5 800 €
-formatMoney("cs", 5800, "EUR", { preferIsoCode: true }); // 5 800 EUR
+const formatPercentage = useFormatPercentage();
+
+formatPercentage(0.782) // 78,2 %
+formatPercentage(0.782, "nearest") // 78,2 %
+formatPercentage(0.782, "up") // 78,2 %
+formatPercentage(0.782, "down") // 78,2 %
 ```
 
-This approach is consistent for all the methods, so you can format numbers, money, percentage and date times.
+## Format another locale
+
+```tsx
+const { formatNumber, formatDateTime, formatMoney, formatPercentage } from "./localize";
+
+formatNumber("cs", 1000.23); // 1 000
+formatDateTime("cs", new Date('2000-01-01'), "dateMedium") // 1. 1. 2000
+formatMoney("cs", 1000, "CZK") // 1 000 Kč
+formatPercentage("cs", 0.782) // 78,2 %
+```

package/locale/cs.d.ts

@@ -1,3 +1,3 @@
-import { LocalizeConfig } from "../src/types";
-declare const locale: LocalizeConfig;
+import { DateTimes, LocalizeConfig } from "../src/types";
+declare const locale: LocalizeConfig<DateTimes>;
 export default locale;

package/locale/de.d.ts

@@ -1,3 +1,3 @@
-import { LocalizeConfig } from "../src/types";
-declare const locale: LocalizeConfig;
+import { DateTimes, LocalizeConfig } from "../src/types";
+declare const locale: LocalizeConfig<DateTimes>;
 export default locale;

package/locale/en.d.ts

@@ -1,3 +1,3 @@
-import { LocalizeConfig } from "../src/types";
-declare const locale: LocalizeConfig;
+import { DateTimes, LocalizeConfig } from "../src/types";
+declare const locale: LocalizeConfig<DateTimes>;
 export default locale;

package/locale/es.d.ts

@@ -1,3 +1,3 @@
-import { LocalizeConfig } from "../src/types";
-declare const locale: LocalizeConfig;
+import { DateTimes, LocalizeConfig } from "../src/types";
+declare const locale: LocalizeConfig<DateTimes>;
 export default locale;

package/locale/fr.d.ts

@@ -1,3 +1,3 @@
-import { LocalizeConfig } from "../src/types";
-declare const locale: LocalizeConfig;
+import { DateTimes, LocalizeConfig } from "../src/types";
+declare const locale: LocalizeConfig<DateTimes>;
 export default locale;

package/locale/pl.d.ts

@@ -1,3 +1,3 @@
-import { LocalizeConfig } from "../src/types";
-declare const locale: LocalizeConfig;
+import { DateTimes, LocalizeConfig } from "../src/types";
+declare const locale: LocalizeConfig<DateTimes>;
 export default locale;

package/locale/sk.d.ts

@@ -1,3 +1,3 @@
-import { LocalizeConfig } from "../src/types";
-declare const locale: LocalizeConfig;
+import { DateTimes, LocalizeConfig } from "../src/types";
+declare const locale: LocalizeConfig<DateTimes>;
 export default locale;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/localize",
-  "version": "10.0.0-beta.25",
+  "version": "10.0.0-beta.30",
   "description": "",
   "main": "index.js",
   "scripts": {

package/src/context/context.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { CreateLocalizeProps, DateTimes } from "../types";
+import { LocalizeConfigMap, DateTimes } from "../types";
 export declare const _useLocalizeContext: () => string;
 export declare const _LocalizeProvider: import("react").Provider<string>;
-export declare const getLocaleConfigHook: <DT extends string = DateTimes>(allConfigurations: CreateLocalizeProps<DT>) => () => import("../types").LocalizeConfig<DT>;
+export declare const getLocaleConfigHook: <DT extends DateTimes, Locales extends string>(allConfigurations: LocalizeConfigMap<DT, Locales>) => () => LocalizeConfigMap<DT, Locales>[Locales];

package/src/format-datetime/format-datetime.d.ts

@@ -1,3 +1,3 @@
-import { DateTimes, FormatDatetimeFunction, LocalizeConfig } from "../types";
-export declare const _formatDatetime: <DT extends string = DateTimes, Locales extends string = string>(localizeConfigs: Record<Locales, LocalizeConfig<DT>>) => FormatDatetimeFunction<DT, Locales>;
-export declare const _useFormatDatetime: <DT extends string = DateTimes>(localizeConfigs: Record<string, LocalizeConfig<DT>>) => () => (value: Date, format: DT) => string;
+import { DateTimes, FormatDatetimeFunction, LocalizeConfigMap } from "../types";
+export declare function createFormatDatetime<DT extends DateTimes, Locales extends string>(localizeConfigs: LocalizeConfigMap<DT, Locales>): FormatDatetimeFunction<DT, Locales>;
+export declare function createUseFormatDatetime<DT extends DateTimes, Locales extends string>(localizeConfigs: LocalizeConfigMap<DT, Locales>): () => (value: Date, format: DT) => string;

package/src/format-datetime/format-datetime.js

@@ -3,17 +3,22 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports._useFormatDatetime = exports._formatDatetime = void 0;
+exports.createUseFormatDatetime = exports.createFormatDatetime = void 0;
 const context_1 = require("../context/context");
 const curry_1 = require("../utils/curry");
 const dayjs_1 = __importDefault(require("dayjs"));
-const _formatDatetime = (localizeConfigs) => (locale, value, format) => {
-    const localeDateTimes = localizeConfigs[locale].dateTime;
-    return (0, dayjs_1.default)(value).format(localeDateTimes[format]);
-};
-exports._formatDatetime = _formatDatetime;
-const _useFormatDatetime = (localizeConfigs) => () => {
-    const locale = (0, context_1._useLocalizeContext)();
-    return (0, curry_1._curry)((0, exports._formatDatetime)(localizeConfigs))(locale);
-};
-exports._useFormatDatetime = _useFormatDatetime;
+const react_1 = require("react");
+function createFormatDatetime(localizeConfigs) {
+    return (locale, value, format) => {
+        const localeDateTimes = localizeConfigs[locale].dateTime;
+        return (0, dayjs_1.default)(value).format(localeDateTimes[format]);
+    };
+}
+exports.createFormatDatetime = createFormatDatetime;
+function createUseFormatDatetime(localizeConfigs) {
+    return () => {
+        const locale = (0, context_1._useLocalizeContext)();
+        return (0, react_1.useMemo)(() => (0, curry_1._curry)(createFormatDatetime(localizeConfigs))(locale), [locale]);
+    };
+}
+exports.createUseFormatDatetime = createUseFormatDatetime;

package/src/format-datetime/format-datetime.test.js

@@ -8,7 +8,7 @@ const cs_1 = __importDefault(require("../../locale/cs"));
 const en_1 = __importDefault(require("../../locale/en"));
 const date = new Date("2023-07-21T07:58:35");
 describe("datetime formatter", function () {
-    const formatDatetimeWithLocales = (0, format_datetime_1._formatDatetime)({ cs: cs_1.default, en: en_1.default });
+    const formatDatetimeWithLocales = (0, format_datetime_1.createFormatDatetime)({ cs: cs_1.default, en: en_1.default });
     it("format datetime with 'en' locale", function () {
         expect(formatDatetimeWithLocales("cs", date, "dateShort")).toBe("21. 7. 23");
         expect(formatDatetimeWithLocales("cs", date, "dateMedium")).toBe("21. 7. 2023");

package/src/format-money/format-money.d.ts

@@ -1,3 +1,3 @@
-import { DateTimes, FormatMoneyFunction, LocalizeConfig } from "../types";
-export declare const _formatMoney: <DT extends string = DateTimes, Locales extends string = string>(localizeConfigs: Record<Locales, LocalizeConfig<DT>>) => FormatMoneyFunction<Locales>;
-export declare const _useFormatMoney: <DT extends string = DateTimes>(localizeConfigs: Record<string, LocalizeConfig<DT>>) => () => (value: number, currency: "CHF" | "AED" | "AFN" | "AMD" | "ANG" | "ARS" | "AUD" | "AWG" | "AZN" | "BDT" | "BGN" | "BHD" | "BIF" | "BRL" | "BTN" | "BYN" | "CAD" | "CLP" | "CNY" | "COP" | "CRC" | "CUP" | "CVE" | "CZK" | "DJF" | "DKK" | "EGP" | "ERN" | "EUR" | "FJD" | "GBP" | "GEL" | "GMD" | "GNF" | "HKD" | "HRK" | "HTG" | "HUF" | "IDR" | "INR" | "IQD" | "ISK" | "JPY" | "KGS" | "KHR" | "KMF" | "KRW" | "KWD" | "KZT" | "LKR" | "LRD" | "LSL" | "MDL" | "MMK" | "MNT" | "MRO" | "MWK" | "MXN" | "MYR" | "MZN" | "NGN" | "NOK" | "NPR" | "NZD" | "PEN" | "PGK" | "PHP" | "PKR" | "PLN" | "PYG" | "RON" | "RSD" | "RUB" | "SBD" | "SDG" | "SEK" | "SGD" | "SLL" | "SRD" | "SYP" | "SZL" | "THB" | "TJS" | "TMT" | "TRY" | "TZS" | "UGX" | "USD" | "UYU" | "UZS" | "VES" | "VND" | "VUV" | "WST" | "XOF" | "XPF" | "YER" | "ZAR" | "ZMW", options?: import("../types").FormatMoneyOptions | undefined) => string;
+import { DateTimes, FormatMoneyFunction, LocalizeConfigMap } from "../types";
+export declare function createFormatMoney<DT extends DateTimes, Locales extends string>(localizeConfigs: LocalizeConfigMap<DT, Locales>): FormatMoneyFunction<Locales>;
+export declare function createUseFormatMoney<DT extends DateTimes, Locales extends string>(localizeConfigs: LocalizeConfigMap<DT, Locales>): () => (value: number, currency: "CHF" | "AED" | "AFN" | "AMD" | "ANG" | "ARS" | "AUD" | "AWG" | "AZN" | "BDT" | "BGN" | "BHD" | "BIF" | "BRL" | "BTN" | "BYN" | "CAD" | "CLP" | "CNY" | "COP" | "CRC" | "CUP" | "CVE" | "CZK" | "DJF" | "DKK" | "EGP" | "ERN" | "EUR" | "FJD" | "GBP" | "GEL" | "GMD" | "GNF" | "HKD" | "HRK" | "HTG" | "HUF" | "IDR" | "INR" | "IQD" | "ISK" | "JPY" | "KGS" | "KHR" | "KMF" | "KRW" | "KWD" | "KZT" | "LKR" | "LRD" | "LSL" | "MDL" | "MMK" | "MNT" | "MRO" | "MWK" | "MXN" | "MYR" | "MZN" | "NGN" | "NOK" | "NPR" | "NZD" | "PEN" | "PGK" | "PHP" | "PKR" | "PLN" | "PYG" | "RON" | "RSD" | "RUB" | "SBD" | "SDG" | "SEK" | "SGD" | "SLL" | "SRD" | "SYP" | "SZL" | "THB" | "TJS" | "TMT" | "TRY" | "TZS" | "UGX" | "USD" | "UYU" | "UZS" | "VES" | "VND" | "VUV" | "WST" | "XOF" | "XPF" | "YER" | "ZAR" | "ZMW", options?: import("../types").FormatMoneyOptions | undefined) => string;

package/src/format-money/format-money.js

@@ -3,26 +3,31 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports._useFormatMoney = exports._formatMoney = void 0;
+exports.createUseFormatMoney = exports.createFormatMoney = void 0;
 const context_1 = require("../context/context");
 const curry_1 = require("../utils/curry");
 const currency_js_1 = __importDefault(require("currency.js"));
 const map_options_1 = require("../utils/map-options");
 const data_1 = require("../utils/data");
-const _formatMoney = (localizeConfigs) => (locale, value, currency, options) => {
-    var _a, _b, _c;
-    const precision = (_a = options === null || options === void 0 ? void 0 : options.precision) !== null && _a !== void 0 ? _a : 0;
-    const symbol = (options === null || options === void 0 ? void 0 : options.preferIsoCode) ? currency : data_1.CURRENCIES[currency].symbol;
-    const formatOptions = { ...(0, map_options_1._mapOptions)(localizeConfigs[locale].currency), precision, symbol };
-    if (options === null || options === void 0 ? void 0 : options.hideSymbol) {
-        formatOptions.pattern = (_b = formatOptions.pattern) === null || _b === void 0 ? void 0 : _b.replace("!", "").trim();
-        formatOptions.negativePattern = (_c = formatOptions.negativePattern) === null || _c === void 0 ? void 0 : _c.replace("!", "").trim();
-    }
-    return (0, currency_js_1.default)(value, { precision }).format(formatOptions);
-};
-exports._formatMoney = _formatMoney;
-const _useFormatMoney = (localizeConfigs) => () => {
-    const locale = (0, context_1._useLocalizeContext)();
-    return (0, curry_1._curry)((0, exports._formatMoney)(localizeConfigs))(locale);
-};
-exports._useFormatMoney = _useFormatMoney;
+const react_1 = require("react");
+function createFormatMoney(localizeConfigs) {
+    return (locale, value, currency, options) => {
+        var _a, _b, _c;
+        const precision = (_a = options === null || options === void 0 ? void 0 : options.precision) !== null && _a !== void 0 ? _a : 0;
+        const symbol = (options === null || options === void 0 ? void 0 : options.preferIsoCode) ? currency : data_1.CURRENCIES[currency].symbol;
+        const formatOptions = { ...(0, map_options_1._mapOptions)(localizeConfigs[locale].currency), precision, symbol };
+        if (options === null || options === void 0 ? void 0 : options.hideSymbol) {
+            formatOptions.pattern = (_b = formatOptions.pattern) === null || _b === void 0 ? void 0 : _b.replace("!", "").trim();
+            formatOptions.negativePattern = (_c = formatOptions.negativePattern) === null || _c === void 0 ? void 0 : _c.replace("!", "").trim();
+        }
+        return (0, currency_js_1.default)(value, { precision }).format(formatOptions);
+    };
+}
+exports.createFormatMoney = createFormatMoney;
+function createUseFormatMoney(localizeConfigs) {
+    return () => {
+        const locale = (0, context_1._useLocalizeContext)();
+        return (0, react_1.useMemo)(() => (0, curry_1._curry)(createFormatMoney(localizeConfigs))(locale), [locale]);
+    };
+}
+exports.createUseFormatMoney = createUseFormatMoney;

package/src/format-money/format-money.test.js

@@ -7,7 +7,7 @@ const format_money_1 = require("./format-money");
 const cs_1 = __importDefault(require("../../locale/cs"));
 const en_1 = __importDefault(require("../../locale/en"));
 describe("money formatter", function () {
-    const formatMoneyWithLocales = (0, format_money_1._formatMoney)({ cs: cs_1.default, en: en_1.default });
+    const formatMoneyWithLocales = (0, format_money_1.createFormatMoney)({ cs: cs_1.default, en: en_1.default });
     it("format money with 'cs' locale", function () {
         expect(formatMoneyWithLocales("cs", 2000.78, "CZK")).toBe("2\xa0001\xa0Kč");
         expect(formatMoneyWithLocales("cs", 2000.78, "CZK", { precision: 1 })).toBe("2\xa0000,8\xa0Kč");

package/src/format-number/format-number.d.ts

@@ -1,3 +1,3 @@
-import { DateTimes, FormatNumberFunction, LocalizeConfig } from "../types";
-export declare const _formatNumber: <DT extends string = DateTimes, Locales extends string = string>(localizeConfigs: Record<Locales, LocalizeConfig<DT>>) => FormatNumberFunction<Locales>;
-export declare const _useFormatNumber: <DT extends string = DateTimes>(localizeConfigs: Record<string, LocalizeConfig<DT>>) => () => (value: number, options?: import("../types").FormatNumberOptions | undefined) => string;
+import { DateTimes, FormatNumberFunction, LocalizeConfigMap } from "../types";
+export declare function createFormatNumber<DT extends DateTimes, Locales extends string>(localizeConfigs: LocalizeConfigMap<DT, Locales>): FormatNumberFunction<Locales>;
+export declare function createUseFormatNumber<DT extends DateTimes, Locales extends string>(localizeConfigs: LocalizeConfigMap<DT, Locales>): () => (value: number, options?: import("../types").FormatNumberOptions | undefined) => string;

package/src/format-number/format-number.js

@@ -3,20 +3,25 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports._useFormatNumber = exports._formatNumber = void 0;
+exports.createUseFormatNumber = exports.createFormatNumber = void 0;
 const currency_js_1 = __importDefault(require("currency.js"));
 const context_1 = require("../context/context");
 const curry_1 = require("../utils/curry");
 const map_options_1 = require("../utils/map-options");
-const _formatNumber = (localizeConfigs) => (locale, value, options) => {
-    var _a;
-    const precision = (_a = options === null || options === void 0 ? void 0 : options.precision) !== null && _a !== void 0 ? _a : 0;
-    const formatOptions = { ...(0, map_options_1._mapOptions)(localizeConfigs[locale].number), precision };
-    return (0, currency_js_1.default)(value, { precision }).format(formatOptions);
-};
-exports._formatNumber = _formatNumber;
-const _useFormatNumber = (localizeConfigs) => () => {
-    const locale = (0, context_1._useLocalizeContext)();
-    return (0, curry_1._curry)((0, exports._formatNumber)(localizeConfigs))(locale);
-};
-exports._useFormatNumber = _useFormatNumber;
+const react_1 = require("react");
+function createFormatNumber(localizeConfigs) {
+    return (locale, value, options) => {
+        var _a;
+        const precision = (_a = options === null || options === void 0 ? void 0 : options.precision) !== null && _a !== void 0 ? _a : 0;
+        const formatOptions = { ...(0, map_options_1._mapOptions)(localizeConfigs[locale].number), precision };
+        return (0, currency_js_1.default)(value, { precision }).format(formatOptions);
+    };
+}
+exports.createFormatNumber = createFormatNumber;
+function createUseFormatNumber(localizeConfigs) {
+    return () => {
+        const locale = (0, context_1._useLocalizeContext)();
+        return (0, react_1.useMemo)(() => (0, curry_1._curry)(createFormatNumber(localizeConfigs))(locale), [locale]);
+    };
+}
+exports.createUseFormatNumber = createUseFormatNumber;

package/src/format-number/format-number.test.js

@@ -7,7 +7,7 @@ const format_number_1 = require("./format-number");
 const cs_1 = __importDefault(require("../../locale/cs"));
 const en_1 = __importDefault(require("../../locale/en"));
 describe("number formatter", function () {
-    const formatNumberWithLocales = (0, format_number_1._formatNumber)({ cs: cs_1.default, en: en_1.default });
+    const formatNumberWithLocales = (0, format_number_1.createFormatNumber)({ cs: cs_1.default, en: en_1.default });
     it("format number with 'cs' locale", function () {
         expect(formatNumberWithLocales("cs", 2000.78)).toBe("2\xa0001");
         expect(formatNumberWithLocales("cs", 2000.78, { precision: 2 })).toBe("2\xa0000,78");

package/src/format-percentage/format-percentage.d.ts

@@ -1,3 +1,3 @@
-import { DateTimes, FormatPercentageFunction, LocalizeConfig, RoundingType } from "../types";
-export declare const _formatPercentage: <DT extends string = DateTimes, Locales extends string = string>(localizeConfigs: Record<Locales, LocalizeConfig<DT>>) => FormatPercentageFunction<Locales>;
-export declare const _useFormatPercentage: <DT extends string = DateTimes>(localizeConfigs: Record<string, LocalizeConfig<DT>>) => () => (value: number, roundingType?: RoundingType | null | undefined, options?: import("../types").FormatPercentageOptions | undefined) => string;
+import { DateTimes, FormatPercentageFunction, LocalizeConfigMap, RoundingType } from "../types";
+export declare function createFormatPercentage<DT extends DateTimes, Locales extends string>(localizeConfigs: LocalizeConfigMap<DT, Locales>): FormatPercentageFunction<Locales>;
+export declare function createUseFormatPercentage<DT extends DateTimes, Locales extends string>(localizeConfigs: LocalizeConfigMap<DT, Locales>): () => (value: number, roundingType?: RoundingType | null | undefined, options?: import("../types").FormatPercentageOptions | undefined) => string;

package/src/format-percentage/format-percentage.js

@@ -1,23 +1,28 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports._useFormatPercentage = exports._formatPercentage = void 0;
+exports.createUseFormatPercentage = exports.createFormatPercentage = void 0;
 const format_number_1 = require("../format-number/format-number");
 const context_1 = require("../context/context");
 const curry_1 = require("../utils/curry");
+const react_1 = require("react");
 const ROUND_FUNCTION_MAP = {
     nearest: Math.round,
     up: Math.ceil,
     down: Math.floor,
 };
 const PERCENTAGE_MULTIPLIER = 100;
-const _formatPercentage = (localizeConfigs) => (locale, value, roundingType = null, options) => {
-    const percentage = value * PERCENTAGE_MULTIPLIER;
-    const percentageValue = roundingType ? ROUND_FUNCTION_MAP[roundingType](percentage) : percentage;
-    return `${(0, format_number_1._formatNumber)(localizeConfigs)(locale, percentageValue, options)}\xa0%`;
-};
-exports._formatPercentage = _formatPercentage;
-const _useFormatPercentage = (localizeConfigs) => () => {
-    const locale = (0, context_1._useLocalizeContext)();
-    return (0, curry_1._curry)((0, exports._formatPercentage)(localizeConfigs))(locale);
-};
-exports._useFormatPercentage = _useFormatPercentage;
+function createFormatPercentage(localizeConfigs) {
+    return (locale, value, roundingType = null, options) => {
+        const percentage = value * PERCENTAGE_MULTIPLIER;
+        const percentageValue = roundingType ? ROUND_FUNCTION_MAP[roundingType](percentage) : percentage;
+        return `${(0, format_number_1.createFormatNumber)(localizeConfigs)(locale, percentageValue, options)}\xa0%`;
+    };
+}
+exports.createFormatPercentage = createFormatPercentage;
+function createUseFormatPercentage(localizeConfigs) {
+    return () => {
+        const locale = (0, context_1._useLocalizeContext)();
+        return (0, react_1.useMemo)(() => (0, curry_1._curry)(createFormatPercentage(localizeConfigs))(locale), [locale]);
+    };
+}
+exports.createUseFormatPercentage = createUseFormatPercentage;

package/src/format-percentage/format-percentage.test.js

@@ -7,7 +7,7 @@ const format_percentage_1 = require("./format-percentage");
 const cs_1 = __importDefault(require("../../locale/cs"));
 const en_1 = __importDefault(require("../../locale/en"));
 describe("percentage formatter", function () {
-    const formatPercentageWithLocales = (0, format_percentage_1._formatPercentage)({ cs: cs_1.default, en: en_1.default });
+    const formatPercentageWithLocales = (0, format_percentage_1.createFormatPercentage)({ cs: cs_1.default, en: en_1.default });
     it("format percentage with 'cs' locale", function () {
         expect(formatPercentageWithLocales("cs", 0.782)).toBe("78\xa0%");
         expect(formatPercentageWithLocales("cs", 0.782, null, { precision: 2 })).toBe("78,20\xa0%");

package/src/index.d.ts

@@ -1,3 +1,3 @@
-import { CreateLocalizeProps, CreateLocalizeReturn, DateTimes } from "./types";
+import { LocalizeConfigMap, CreateLocalizeReturn, DateTimes } from "./types";
 export * from "./get-currency-symbol/get-currency-symbol";
-export declare function createLocalize<DT extends string = DateTimes, Locales extends string = string>(props: CreateLocalizeProps<DT, Locales>): CreateLocalizeReturn<DT, Locales>;
+export declare function createLocalize<DT extends DateTimes, Locales extends string>(config: LocalizeConfigMap<DT, Locales>): CreateLocalizeReturn<DT, Locales>;

package/src/index.js

@@ -21,18 +21,18 @@ const format_percentage_1 = require("./format-percentage/format-percentage");
 const format_datetime_1 = require("./format-datetime/format-datetime");
 const format_money_1 = require("./format-money/format-money");
 __exportStar(require("./get-currency-symbol/get-currency-symbol"), exports);
-function createLocalize(props) {
+function createLocalize(config) {
     return {
         LocalizeProvider: context_1._LocalizeProvider,
-        formatDateTime: (0, format_datetime_1._formatDatetime)(props),
-        formatNumber: (0, format_number_1._formatNumber)(props),
-        formatPercentage: (0, format_percentage_1._formatPercentage)(props),
-        formatMoney: (0, format_money_1._formatMoney)(props),
-        useFormatDateTime: (0, format_datetime_1._useFormatDatetime)(props),
-        useFormatNumber: (0, format_number_1._useFormatNumber)(props),
-        useFormatPercentage: (0, format_percentage_1._useFormatPercentage)(props),
-        useFormatMoney: (0, format_money_1._useFormatMoney)(props),
-        useLocaleConfig: (0, context_1.getLocaleConfigHook)(props),
+        formatDateTime: (0, format_datetime_1.createFormatDatetime)(config),
+        formatNumber: (0, format_number_1.createFormatNumber)(config),
+        formatPercentage: (0, format_percentage_1.createFormatPercentage)(config),
+        formatMoney: (0, format_money_1.createFormatMoney)(config),
+        useFormatDateTime: (0, format_datetime_1.createUseFormatDatetime)(config),
+        useFormatNumber: (0, format_number_1.createUseFormatNumber)(config),
+        useFormatPercentage: (0, format_percentage_1.createUseFormatPercentage)(config),
+        useFormatMoney: (0, format_money_1.createUseFormatMoney)(config),
+        useLocaleConfig: (0, context_1.getLocaleConfigHook)(config),
     };
 }
 exports.createLocalize = createLocalize;

package/src/types.d.ts

@@ -1,7 +1,7 @@
 import { CURRENCIES } from "./utils/data";
 import { Provider } from "react";
 export type DateTimes = "timeShort" | "timeFull" | "dateShort" | "dateMedium" | "dateLong" | "dateShortNoYear" | "dateLongNoYear" | "dateTimeShort" | "dateTimeMedium" | "dateTimeLong";
-export type LocalizeConfig<DT extends string = DateTimes> = {
+export type LocalizeConfig<DT extends DateTimes> = {
     number: {
         thousandsSeparator: string;
         decimalSeparator: string;
@@ -14,18 +14,18 @@ export type LocalizeConfig<DT extends string = DateTimes> = {
     };
     dateTime: Record<DT, string>;
 };
+export type LocalizeConfigMap<DT extends DateTimes, Locales extends string> = Record<Locales, LocalizeConfig<DT>>;
 export type LocalizeProviderType = Provider<string>;
-export type UseLocaleConfigType<DT extends string = DateTimes> = () => LocalizeConfig<DT>;
+export type UseLocaleConfigType<DT extends DateTimes> = () => LocalizeConfig<DT>;
 export type FormatNumberFunction<Locales extends string> = (locale: Locales, value: number, options?: FormatNumberOptions) => string;
 export type UseFormatNumberFunction = () => (value: number, options?: FormatNumberOptions) => string;
 export type FormatMoneyFunction<Locales extends string> = (locale: Locales, value: number, currency: Currency, options?: FormatMoneyOptions) => string;
 export type UseFormatMoneyFunction = () => (value: number, currency: Currency, options?: FormatMoneyOptions) => string;
 export type FormatPercentageFunction<Locales extends string> = (locale: Locales, value: number, roundingType?: RoundingType | null, options?: FormatPercentageOptions) => string;
 export type UseFormatPercentageFunction = () => (value: number, roundingType?: RoundingType | null, options?: FormatPercentageOptions) => string;
-export type FormatDatetimeFunction<DT extends string = DateTimes, Locales extends string = string> = (locale: Locales, value: Date, format: DT) => string;
-export type UseFormatDatetimeFunction<DT extends string = DateTimes> = () => (value: Date, format: DT) => string;
-export type CreateLocalizeProps<DT extends string = DateTimes, Locales extends string = string> = Record<Locales, LocalizeConfig<DT>>;
-export type CreateLocalizeReturn<DT extends string = DateTimes, Locales extends string = string> = {
+export type FormatDatetimeFunction<DT extends DateTimes, Locales extends string> = (locale: Locales, value: Date, format: DT) => string;
+export type UseFormatDatetimeFunction<DT extends DateTimes> = () => (value: Date, format: DT) => string;
+export type CreateLocalizeReturn<DT extends DateTimes, Locales extends string> = {
     LocalizeProvider: LocalizeProviderType;
     useLocaleConfig: UseLocaleConfigType<DT>;
     formatNumber: FormatNumberFunction<Locales>;

package/src/utils/map-options.d.ts

@@ -1,3 +1,3 @@
-import { LocalizeConfig } from "../types";
+import { DateTimes, LocalizeConfig } from "../types";
 import currencyjs from "currency.js";
-export declare const _mapOptions: (options: LocalizeConfig["number"] | LocalizeConfig["currency"]) => currencyjs.Options;
+export declare const _mapOptions: (options: LocalizeConfig<DateTimes>["number"] | LocalizeConfig<DateTimes>["currency"]) => currencyjs.Options;