svelte-intlayer 8.5.0 → 8.5.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/IntlayerNodeWrapper.svelte +13 -5
- package/dist/IntlayerNodeWrapper.svelte.d.ts +3 -3
- package/dist/client/index.d.ts +0 -1
- package/dist/client/index.js +0 -1
- package/dist/client/useLocale.d.ts +2 -2
- package/dist/client/useLocaleStorage.d.ts +2 -2
- package/dist/format/index.d.ts +9 -0
- package/dist/format/index.js +9 -0
- package/dist/format/useCompact.d.ts +3 -0
- package/dist/format/useCompact.js +10 -0
- package/dist/format/useCurrency.d.ts +3 -0
- package/dist/format/useCurrency.js +10 -0
- package/dist/format/useDate.d.ts +9 -0
- package/dist/format/useDate.js +18 -0
- package/dist/format/useIntl.d.ts +6 -0
- package/dist/format/useIntl.js +13 -0
- package/dist/format/useList.d.ts +7 -0
- package/dist/format/useList.js +10 -0
- package/dist/format/useNumber.d.ts +9 -0
- package/dist/format/useNumber.js +16 -0
- package/dist/format/usePercentage.d.ts +3 -0
- package/dist/format/usePercentage.js +10 -0
- package/dist/format/useRelativeTime.d.ts +4 -0
- package/dist/format/useRelativeTime.js +10 -0
- package/dist/format/useUnit.d.ts +3 -0
- package/dist/format/useUnit.js +10 -0
- package/dist/plugins.js +1 -1
- package/dist/renderIntlayerNode.js +3 -5
- package/package.json +11 -6
- package/dist/client/useIntl.d.ts +0 -25
- package/dist/client/useIntl.js +0 -32
|
@@ -1,10 +1,18 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
-
export let Renderer: any;
|
|
3
|
-
export let rendererProps: Record<string, any
|
|
4
|
-
export let value: any;
|
|
2
|
+
export let Renderer: any = undefined;
|
|
3
|
+
export let rendererProps: Record<string, any> = {};
|
|
4
|
+
export let value: any = undefined;
|
|
5
5
|
</script>
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
{#if typeof Renderer === 'string'}
|
|
8
|
+
<svelte:element this={Renderer} {...rendererProps}>
|
|
9
|
+
{value}
|
|
10
|
+
</svelte:element>
|
|
11
|
+
{:else if typeof Renderer === 'function'}
|
|
12
|
+
<svelte:component this={Renderer} {...rendererProps}>
|
|
13
|
+
{value}
|
|
14
|
+
</svelte:component>
|
|
15
|
+
{:else}
|
|
8
16
|
{value}
|
|
9
|
-
|
|
17
|
+
{/if}
|
|
10
18
|
|
|
@@ -12,9 +12,9 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
|
|
|
12
12
|
z_$$bindings?: Bindings;
|
|
13
13
|
}
|
|
14
14
|
declare const IntlayerNodeWrapper: $$__sveltets_2_IsomorphicComponent<{
|
|
15
|
-
Renderer
|
|
16
|
-
rendererProps
|
|
17
|
-
value
|
|
15
|
+
Renderer?: any;
|
|
16
|
+
rendererProps?: Record<string, any>;
|
|
17
|
+
value?: any;
|
|
18
18
|
}, {
|
|
19
19
|
[evt: string]: CustomEvent<any>;
|
|
20
20
|
}, {}, {}, string>;
|
package/dist/client/index.d.ts
CHANGED
|
@@ -6,7 +6,6 @@ export { setupIntlayer } from './setupIntlayer.svelte';
|
|
|
6
6
|
export { useDictionary } from './useDictionary';
|
|
7
7
|
export { useDictionaryAsync } from './useDictionaryAsync';
|
|
8
8
|
export { useDictionaryDynamic } from './useDictionaryDynamic';
|
|
9
|
-
export { useIntl } from './useIntl';
|
|
10
9
|
export { useIntlayer } from './useIntlayer';
|
|
11
10
|
export { useLocale } from './useLocale';
|
|
12
11
|
export { useRewriteURL } from './useRewriteURL';
|
package/dist/client/index.js
CHANGED
|
@@ -5,7 +5,6 @@ export { setupIntlayer } from './setupIntlayer.svelte';
|
|
|
5
5
|
export { useDictionary } from './useDictionary';
|
|
6
6
|
export { useDictionaryAsync } from './useDictionaryAsync';
|
|
7
7
|
export { useDictionaryDynamic } from './useDictionaryDynamic';
|
|
8
|
-
export { useIntl } from './useIntl';
|
|
9
8
|
export { useIntlayer } from './useIntlayer';
|
|
10
9
|
export { useLocale } from './useLocale';
|
|
11
10
|
export { useRewriteURL } from './useRewriteURL';
|
|
@@ -26,7 +26,7 @@ type useLocaleProps = {
|
|
|
26
26
|
export declare const useLocale: ({ isCookieEnabled, onLocaleChange, }?: useLocaleProps) => {
|
|
27
27
|
locale: import("svelte/store").Readable<LocalesValues>;
|
|
28
28
|
setLocale: (locale: LocalesValues) => void;
|
|
29
|
-
defaultLocale: import("
|
|
30
|
-
availableLocales: import("
|
|
29
|
+
defaultLocale: import("intlayer").Locale;
|
|
30
|
+
availableLocales: import("intlayer").Locale[];
|
|
31
31
|
};
|
|
32
32
|
export {};
|
|
@@ -2,13 +2,13 @@ import type { LocalesValues } from '@intlayer/types/module_augmentation';
|
|
|
2
2
|
/**
|
|
3
3
|
* Get the locale cookie
|
|
4
4
|
*/
|
|
5
|
-
export declare const localeInStorage: import("
|
|
5
|
+
export declare const localeInStorage: import("intlayer").Locale | undefined;
|
|
6
6
|
/**
|
|
7
7
|
* @deprecated Use localeInStorage instead
|
|
8
8
|
*
|
|
9
9
|
* Get the locale cookie
|
|
10
10
|
*/
|
|
11
|
-
export declare const localeCookie: import("
|
|
11
|
+
export declare const localeCookie: import("intlayer").Locale | undefined;
|
|
12
12
|
/**
|
|
13
13
|
* Set the locale cookie
|
|
14
14
|
*/
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export { useCompact } from './useCompact';
|
|
2
|
+
export { useCurrency } from './useCurrency';
|
|
3
|
+
export { useDate } from './useDate';
|
|
4
|
+
export { useIntl } from './useIntl';
|
|
5
|
+
export { useList } from './useList';
|
|
6
|
+
export { useNumber } from './useNumber';
|
|
7
|
+
export { usePercentage } from './usePercentage';
|
|
8
|
+
export { useRelativeTime } from './useRelativeTime';
|
|
9
|
+
export { useUnit } from './useUnit';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export { useCompact } from './useCompact';
|
|
2
|
+
export { useCurrency } from './useCurrency';
|
|
3
|
+
export { useDate } from './useDate';
|
|
4
|
+
export { useIntl } from './useIntl';
|
|
5
|
+
export { useList } from './useList';
|
|
6
|
+
export { useNumber } from './useNumber';
|
|
7
|
+
export { usePercentage } from './usePercentage';
|
|
8
|
+
export { useRelativeTime } from './useRelativeTime';
|
|
9
|
+
export { useUnit } from './useUnit';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { compact } from '@intlayer/core/formatters';
|
|
2
|
+
import { derived } from 'svelte/store';
|
|
3
|
+
import { useLocale } from '../client/useLocale';
|
|
4
|
+
export const useCompact = () => {
|
|
5
|
+
const { locale } = useLocale();
|
|
6
|
+
return derived(locale, ($locale) => (...args) => compact(args[0], {
|
|
7
|
+
...args[1],
|
|
8
|
+
locale: args[1]?.locale ?? $locale,
|
|
9
|
+
}));
|
|
10
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { currency } from '@intlayer/core/formatters';
|
|
2
|
+
import { derived } from 'svelte/store';
|
|
3
|
+
import { useLocale } from '../client/useLocale';
|
|
4
|
+
export const useCurrency = () => {
|
|
5
|
+
const { locale } = useLocale();
|
|
6
|
+
return derived(locale, ($locale) => (...args) => currency(args[0], {
|
|
7
|
+
...args[1],
|
|
8
|
+
locale: args[1]?.locale ?? $locale,
|
|
9
|
+
}));
|
|
10
|
+
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Svelte store that provides a localized date/time formatter.
|
|
3
|
+
*
|
|
4
|
+
* @returns {import('svelte/store').Readable<(...args: Parameters<typeof date>) => string>}
|
|
5
|
+
* A store containing a date/time formatting function bound to the active locale.
|
|
6
|
+
*/
|
|
7
|
+
export declare const useDate: () => import("svelte/store").Readable<(date: string | number | Date, options?: import("@intlayer/core/formatters").DateTimePreset | (Intl.DateTimeFormatOptions & {
|
|
8
|
+
locale?: import("intlayer").LocalesValues;
|
|
9
|
+
}) | undefined) => string>;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { date, presets } from '@intlayer/core/formatters';
|
|
2
|
+
import { derived } from 'svelte/store';
|
|
3
|
+
import { useLocale } from '../client/useLocale';
|
|
4
|
+
/**
|
|
5
|
+
* Svelte store that provides a localized date/time formatter.
|
|
6
|
+
*
|
|
7
|
+
* @returns {import('svelte/store').Readable<(...args: Parameters<typeof date>) => string>}
|
|
8
|
+
* A store containing a date/time formatting function bound to the active locale.
|
|
9
|
+
*/
|
|
10
|
+
export const useDate = () => {
|
|
11
|
+
const { locale } = useLocale();
|
|
12
|
+
return derived(locale, ($locale) => (...args) => {
|
|
13
|
+
const options = typeof args[1] === 'string'
|
|
14
|
+
? { ...presets[args[1]], locale: $locale }
|
|
15
|
+
: { ...args[1], locale: args[1]?.locale ?? $locale };
|
|
16
|
+
return date(args[0], options);
|
|
17
|
+
});
|
|
18
|
+
};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { type WrappedIntl } from '@intlayer/core/formatters';
|
|
2
|
+
import type { LocalesValues } from '@intlayer/types/module_augmentation';
|
|
3
|
+
/**
|
|
4
|
+
* Svelte store that provides a locale-bound `Intl` object.
|
|
5
|
+
*/
|
|
6
|
+
export declare const useIntl: (locale?: LocalesValues) => import("svelte/store").Readable<WrappedIntl>;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { bindIntl } from '@intlayer/core/formatters';
|
|
2
|
+
import { derived } from 'svelte/store';
|
|
3
|
+
import { useLocale } from '../client/useLocale';
|
|
4
|
+
/**
|
|
5
|
+
* Svelte store that provides a locale-bound `Intl` object.
|
|
6
|
+
*/
|
|
7
|
+
export const useIntl = (locale) => {
|
|
8
|
+
const { locale: contextLocale } = useLocale();
|
|
9
|
+
return derived(contextLocale, ($locale) => {
|
|
10
|
+
const currentLocale = locale ?? $locale;
|
|
11
|
+
return bindIntl(currentLocale);
|
|
12
|
+
});
|
|
13
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare const useList: () => import("svelte/store").Readable<(values: (string | number)[], options?: ({
|
|
2
|
+
localeMatcher?: "lookup" | "best fit";
|
|
3
|
+
type?: "conjunction" | "disjunction" | "unit";
|
|
4
|
+
style?: "long" | "short" | "narrow";
|
|
5
|
+
} & {
|
|
6
|
+
locale?: import("intlayer").LocalesValues;
|
|
7
|
+
}) | undefined) => string>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { list } from '@intlayer/core/formatters';
|
|
2
|
+
import { derived } from 'svelte/store';
|
|
3
|
+
import { useLocale } from '../client/useLocale';
|
|
4
|
+
export const useList = () => {
|
|
5
|
+
const { locale } = useLocale();
|
|
6
|
+
return derived(locale, ($locale) => (...args) => list(args[0], {
|
|
7
|
+
...args[1],
|
|
8
|
+
locale: args[1]?.locale ?? $locale,
|
|
9
|
+
}));
|
|
10
|
+
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Svelte store that provides a localized number formatter.
|
|
3
|
+
*
|
|
4
|
+
* @returns {import('svelte/store').Readable<(...args: Parameters<typeof number>) => string>}
|
|
5
|
+
* A store containing a number formatting function bound to the active locale.
|
|
6
|
+
*/
|
|
7
|
+
export declare const useNumber: () => import("svelte/store").Readable<(value: string | number, options?: (Intl.NumberFormatOptions & {
|
|
8
|
+
locale?: import("intlayer").LocalesValues;
|
|
9
|
+
}) | undefined) => string>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { number } from '@intlayer/core/formatters';
|
|
2
|
+
import { derived } from 'svelte/store';
|
|
3
|
+
import { useLocale } from '../client/useLocale';
|
|
4
|
+
/**
|
|
5
|
+
* Svelte store that provides a localized number formatter.
|
|
6
|
+
*
|
|
7
|
+
* @returns {import('svelte/store').Readable<(...args: Parameters<typeof number>) => string>}
|
|
8
|
+
* A store containing a number formatting function bound to the active locale.
|
|
9
|
+
*/
|
|
10
|
+
export const useNumber = () => {
|
|
11
|
+
const { locale } = useLocale();
|
|
12
|
+
return derived(locale, ($locale) => (...args) => number(args[0], {
|
|
13
|
+
...args[1],
|
|
14
|
+
locale: args[1]?.locale ?? $locale,
|
|
15
|
+
}));
|
|
16
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { percentage } from '@intlayer/core/formatters';
|
|
2
|
+
import { derived } from 'svelte/store';
|
|
3
|
+
import { useLocale } from '../client/useLocale';
|
|
4
|
+
export const usePercentage = () => {
|
|
5
|
+
const { locale } = useLocale();
|
|
6
|
+
return derived(locale, ($locale) => (...args) => percentage(args[0], {
|
|
7
|
+
...args[1],
|
|
8
|
+
locale: args[1]?.locale ?? $locale,
|
|
9
|
+
}));
|
|
10
|
+
};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export declare const useRelativeTime: () => import("svelte/store").Readable<(from: string | number | Date, to?: string | number | Date | undefined, options?: (Intl.RelativeTimeFormatOptions & {
|
|
2
|
+
locale?: import("intlayer").LocalesValues;
|
|
3
|
+
unit?: Intl.RelativeTimeFormatUnit;
|
|
4
|
+
}) | undefined) => string>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { relativeTime } from '@intlayer/core/formatters';
|
|
2
|
+
import { derived } from 'svelte/store';
|
|
3
|
+
import { useLocale } from '../client/useLocale';
|
|
4
|
+
export const useRelativeTime = () => {
|
|
5
|
+
const { locale } = useLocale();
|
|
6
|
+
return derived(locale, ($locale) => (...args) => relativeTime(args[0], args[1], {
|
|
7
|
+
...args[2],
|
|
8
|
+
locale: args[2]?.locale ?? $locale,
|
|
9
|
+
}));
|
|
10
|
+
};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { units } from '@intlayer/core/formatters';
|
|
2
|
+
import { derived } from 'svelte/store';
|
|
3
|
+
import { useLocale } from '../client/useLocale';
|
|
4
|
+
export const useUnit = () => {
|
|
5
|
+
const { locale } = useLocale();
|
|
6
|
+
return derived(locale, ($locale) => (...args) => units(args[0], {
|
|
7
|
+
...args[1],
|
|
8
|
+
locale: args[1]?.locale ?? $locale,
|
|
9
|
+
}));
|
|
10
|
+
};
|
package/dist/plugins.js
CHANGED
|
@@ -35,7 +35,7 @@ export const intlayerNodePlugins = {
|
|
|
35
35
|
typeof node === 'number',
|
|
36
36
|
transform: (node, { children, ...rest }) => renderIntlayerNode({
|
|
37
37
|
value: children ?? node,
|
|
38
|
-
component: isEnabled ? ContentSelector :
|
|
38
|
+
component: isEnabled ? ContentSelector : undefined,
|
|
39
39
|
props: rest,
|
|
40
40
|
}),
|
|
41
41
|
};
|
|
@@ -20,14 +20,12 @@ export const renderIntlayerNode = (args) => {
|
|
|
20
20
|
}
|
|
21
21
|
else {
|
|
22
22
|
// Functional component (Svelte 5)
|
|
23
|
-
Node = (
|
|
24
|
-
|
|
25
|
-
...props,
|
|
23
|
+
Node = (props) => {
|
|
24
|
+
return IntlayerNodeWrapper(props, {
|
|
26
25
|
Renderer: args.component,
|
|
27
26
|
rendererProps: args.props,
|
|
28
27
|
value: args.value,
|
|
29
|
-
};
|
|
30
|
-
return IntlayerNodeWrapper(anchor, mergedProps);
|
|
28
|
+
});
|
|
31
29
|
};
|
|
32
30
|
}
|
|
33
31
|
Object.defineProperty(Node, 'value', {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "svelte-intlayer",
|
|
3
|
-
"version": "8.5.
|
|
3
|
+
"version": "8.5.1",
|
|
4
4
|
"description": "Easily internationalize i18n your Svelte applications with type-safe multilingual content management.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"intlayer",
|
|
@@ -49,6 +49,11 @@
|
|
|
49
49
|
"svelte": "./dist/html/index.js",
|
|
50
50
|
"default": "./dist/html/index.js"
|
|
51
51
|
},
|
|
52
|
+
"./format": {
|
|
53
|
+
"types": "./dist/format/index.d.ts",
|
|
54
|
+
"svelte": "./dist/format/index.js",
|
|
55
|
+
"default": "./dist/format/index.js"
|
|
56
|
+
},
|
|
52
57
|
"./package.json": "./package.json"
|
|
53
58
|
},
|
|
54
59
|
"main": "dist/index.js",
|
|
@@ -77,11 +82,11 @@
|
|
|
77
82
|
"typecheck": "tsc --noEmit --project tsconfig.types.json"
|
|
78
83
|
},
|
|
79
84
|
"dependencies": {
|
|
80
|
-
"@intlayer/api": "8.5.
|
|
81
|
-
"@intlayer/config": "8.5.
|
|
82
|
-
"@intlayer/core": "8.5.
|
|
83
|
-
"@intlayer/editor": "8.5.
|
|
84
|
-
"@intlayer/types": "8.5.
|
|
85
|
+
"@intlayer/api": "8.5.1",
|
|
86
|
+
"@intlayer/config": "8.5.1",
|
|
87
|
+
"@intlayer/core": "8.5.1",
|
|
88
|
+
"@intlayer/editor": "8.5.1",
|
|
89
|
+
"@intlayer/types": "8.5.1"
|
|
85
90
|
},
|
|
86
91
|
"devDependencies": {
|
|
87
92
|
"@sveltejs/adapter-auto": "7.0.1",
|
package/dist/client/useIntl.d.ts
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import { type WrappedIntl } from '@intlayer/core/formatters';
|
|
2
|
-
import type { LocalesValues } from '@intlayer/types/module_augmentation';
|
|
3
|
-
/**
|
|
4
|
-
* Svelte hook that provides a locale-bound `Intl` object.
|
|
5
|
-
*
|
|
6
|
-
* It acts exactly like the native `Intl` object, but acts as a proxy to:
|
|
7
|
-
* 1. Inject the current locale automatically if none is provided.
|
|
8
|
-
* 2. Use the performance-optimized `CachedIntl` under the hood.
|
|
9
|
-
*
|
|
10
|
-
* @example
|
|
11
|
-
* ```svelte
|
|
12
|
-
* <script>
|
|
13
|
-
* import { useIntl } from "svelte-intlayer";
|
|
14
|
-
*
|
|
15
|
-
* const intl = useIntl();
|
|
16
|
-
*
|
|
17
|
-
* // Standard API, but no need to pass locale as the first argument
|
|
18
|
-
* $: formatted = new $intl.NumberFormat({
|
|
19
|
-
* style: 'currency',
|
|
20
|
-
* currency: 'USD'
|
|
21
|
-
* }).format(123.45);
|
|
22
|
-
* </script>
|
|
23
|
-
* ```
|
|
24
|
-
*/
|
|
25
|
-
export declare const useIntl: (locale?: LocalesValues) => import("svelte/store").Readable<WrappedIntl>;
|
package/dist/client/useIntl.js
DELETED
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
import { bindIntl } from '@intlayer/core/formatters';
|
|
2
|
-
import { derived } from 'svelte/store';
|
|
3
|
-
import { useLocale } from './useLocale';
|
|
4
|
-
/**
|
|
5
|
-
* Svelte hook that provides a locale-bound `Intl` object.
|
|
6
|
-
*
|
|
7
|
-
* It acts exactly like the native `Intl` object, but acts as a proxy to:
|
|
8
|
-
* 1. Inject the current locale automatically if none is provided.
|
|
9
|
-
* 2. Use the performance-optimized `CachedIntl` under the hood.
|
|
10
|
-
*
|
|
11
|
-
* @example
|
|
12
|
-
* ```svelte
|
|
13
|
-
* <script>
|
|
14
|
-
* import { useIntl } from "svelte-intlayer";
|
|
15
|
-
*
|
|
16
|
-
* const intl = useIntl();
|
|
17
|
-
*
|
|
18
|
-
* // Standard API, but no need to pass locale as the first argument
|
|
19
|
-
* $: formatted = new $intl.NumberFormat({
|
|
20
|
-
* style: 'currency',
|
|
21
|
-
* currency: 'USD'
|
|
22
|
-
* }).format(123.45);
|
|
23
|
-
* </script>
|
|
24
|
-
* ```
|
|
25
|
-
*/
|
|
26
|
-
export const useIntl = (locale) => {
|
|
27
|
-
const { locale: contextLocale } = useLocale();
|
|
28
|
-
return derived(contextLocale, ($locale) => {
|
|
29
|
-
const currentLocale = locale ?? $locale;
|
|
30
|
-
return bindIntl(currentLocale);
|
|
31
|
-
});
|
|
32
|
-
};
|