svelte-intlayer 8.5.0 → 8.5.2

package/dist/IntlayerNodeWrapper.svelte

@@ -1,10 +1,18 @@
 <script lang="ts">
-export let Renderer: any;
-export let rendererProps: Record<string, any>;
-export let value: any;
+  export let Renderer: any = undefined;
+  export let rendererProps: Record<string, any> = {};
+  export let value: any = undefined;
 </script>
 
-<svelte:component this={Renderer} {...rendererProps}>
+{#if typeof Renderer === 'string'}
+  <svelte:element this={Renderer} {...rendererProps}>
+    {value}
+  </svelte:element>
+{:else if typeof Renderer === 'function'}
+  <svelte:component this={Renderer} {...rendererProps}>
+    {value}
+  </svelte:component>
+{:else}
   {value}
-</svelte:component>
+{/if}
 

package/dist/IntlayerNodeWrapper.svelte.d.ts

@@ -12,9 +12,9 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     z_$$bindings?: Bindings;
 }
 declare const IntlayerNodeWrapper: $$__sveltets_2_IsomorphicComponent<{
-    Renderer: any;
-    rendererProps: Record<string, any>;
-    value: any;
+    Renderer?: any;
+    rendererProps?: Record<string, any>;
+    value?: any;
 }, {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, string>;

package/dist/client/index.d.ts

@@ -6,7 +6,6 @@ export { setupIntlayer } from './setupIntlayer.svelte';
 export { useDictionary } from './useDictionary';
 export { useDictionaryAsync } from './useDictionaryAsync';
 export { useDictionaryDynamic } from './useDictionaryDynamic';
-export { useIntl } from './useIntl';
 export { useIntlayer } from './useIntlayer';
 export { useLocale } from './useLocale';
 export { useRewriteURL } from './useRewriteURL';

package/dist/client/index.js

@@ -5,7 +5,6 @@ export { setupIntlayer } from './setupIntlayer.svelte';
 export { useDictionary } from './useDictionary';
 export { useDictionaryAsync } from './useDictionaryAsync';
 export { useDictionaryDynamic } from './useDictionaryDynamic';
-export { useIntl } from './useIntl';
 export { useIntlayer } from './useIntlayer';
 export { useLocale } from './useLocale';
 export { useRewriteURL } from './useRewriteURL';

package/dist/format/index.d.ts

@@ -0,0 +1,9 @@
+export { useCompact } from './useCompact';
+export { useCurrency } from './useCurrency';
+export { useDate } from './useDate';
+export { useIntl } from './useIntl';
+export { useList } from './useList';
+export { useNumber } from './useNumber';
+export { usePercentage } from './usePercentage';
+export { useRelativeTime } from './useRelativeTime';
+export { useUnit } from './useUnit';

package/dist/format/index.js

@@ -0,0 +1,9 @@
+export { useCompact } from './useCompact';
+export { useCurrency } from './useCurrency';
+export { useDate } from './useDate';
+export { useIntl } from './useIntl';
+export { useList } from './useList';
+export { useNumber } from './useNumber';
+export { usePercentage } from './usePercentage';
+export { useRelativeTime } from './useRelativeTime';
+export { useUnit } from './useUnit';

package/dist/format/useCompact.d.ts

@@ -0,0 +1,3 @@
+export declare const useCompact: () => import("svelte/store").Readable<(value: string | number, options?: (Intl.NumberFormatOptions & {
+    locale?: import("@intlayer/types/module_augmentation").LocalesValues;
+}) | undefined) => string>;

package/dist/format/useCompact.js

@@ -0,0 +1,10 @@
+import { compact } from '@intlayer/core/formatters';
+import { derived } from 'svelte/store';
+import { useLocale } from '../client/useLocale';
+export const useCompact = () => {
+    const { locale } = useLocale();
+    return derived(locale, ($locale) => (...args) => compact(args[0], {
+        ...args[1],
+        locale: args[1]?.locale ?? $locale,
+    }));
+};

package/dist/format/useCurrency.d.ts

@@ -0,0 +1,3 @@
+export declare const useCurrency: () => import("svelte/store").Readable<(value: string | number, options?: (Intl.NumberFormatOptions & {
+    locale?: import("@intlayer/types/module_augmentation").LocalesValues;
+}) | undefined) => string>;

package/dist/format/useCurrency.js

@@ -0,0 +1,10 @@
+import { currency } from '@intlayer/core/formatters';
+import { derived } from 'svelte/store';
+import { useLocale } from '../client/useLocale';
+export const useCurrency = () => {
+    const { locale } = useLocale();
+    return derived(locale, ($locale) => (...args) => currency(args[0], {
+        ...args[1],
+        locale: args[1]?.locale ?? $locale,
+    }));
+};

package/dist/format/useDate.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Svelte store that provides a localized date/time formatter.
+ *
+ * @returns {import('svelte/store').Readable<(...args: Parameters<typeof date>) => string>}
+ * A store containing a date/time formatting function bound to the active locale.
+ */
+export declare const useDate: () => import("svelte/store").Readable<(date: string | number | Date, options?: import("@intlayer/core/formatters").DateTimePreset | (Intl.DateTimeFormatOptions & {
+    locale?: import("@intlayer/types/module_augmentation").LocalesValues;
+}) | undefined) => string>;

package/dist/format/useDate.js

@@ -0,0 +1,18 @@
+import { date, presets } from '@intlayer/core/formatters';
+import { derived } from 'svelte/store';
+import { useLocale } from '../client/useLocale';
+/**
+ * Svelte store that provides a localized date/time formatter.
+ *
+ * @returns {import('svelte/store').Readable<(...args: Parameters<typeof date>) => string>}
+ * A store containing a date/time formatting function bound to the active locale.
+ */
+export const useDate = () => {
+    const { locale } = useLocale();
+    return derived(locale, ($locale) => (...args) => {
+        const options = typeof args[1] === 'string'
+            ? { ...presets[args[1]], locale: $locale }
+            : { ...args[1], locale: args[1]?.locale ?? $locale };
+        return date(args[0], options);
+    });
+};

package/dist/format/useIntl.d.ts

@@ -0,0 +1,6 @@
+import { type WrappedIntl } from '@intlayer/core/formatters';
+import type { LocalesValues } from '@intlayer/types/module_augmentation';
+/**
+ * Svelte store that provides a locale-bound `Intl` object.
+ */
+export declare const useIntl: (locale?: LocalesValues) => import("svelte/store").Readable<WrappedIntl>;

package/dist/format/useIntl.js

@@ -0,0 +1,13 @@
+import { bindIntl } from '@intlayer/core/formatters';
+import { derived } from 'svelte/store';
+import { useLocale } from '../client/useLocale';
+/**
+ * Svelte store that provides a locale-bound `Intl` object.
+ */
+export const useIntl = (locale) => {
+    const { locale: contextLocale } = useLocale();
+    return derived(contextLocale, ($locale) => {
+        const currentLocale = locale ?? $locale;
+        return bindIntl(currentLocale);
+    });
+};

package/dist/format/useList.d.ts

@@ -0,0 +1,7 @@
+export declare const useList: () => import("svelte/store").Readable<(values: (string | number)[], options?: ({
+    localeMatcher?: "lookup" | "best fit";
+    type?: "conjunction" | "disjunction" | "unit";
+    style?: "long" | "short" | "narrow";
+} & {
+    locale?: import("@intlayer/types/module_augmentation").LocalesValues;
+}) | undefined) => string>;

package/dist/format/useList.js

@@ -0,0 +1,10 @@
+import { list } from '@intlayer/core/formatters';
+import { derived } from 'svelte/store';
+import { useLocale } from '../client/useLocale';
+export const useList = () => {
+    const { locale } = useLocale();
+    return derived(locale, ($locale) => (...args) => list(args[0], {
+        ...args[1],
+        locale: args[1]?.locale ?? $locale,
+    }));
+};

package/dist/format/useNumber.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Svelte store that provides a localized number formatter.
+ *
+ * @returns {import('svelte/store').Readable<(...args: Parameters<typeof number>) => string>}
+ * A store containing a number formatting function bound to the active locale.
+ */
+export declare const useNumber: () => import("svelte/store").Readable<(value: string | number, options?: (Intl.NumberFormatOptions & {
+    locale?: import("@intlayer/types/module_augmentation").LocalesValues;
+}) | undefined) => string>;

package/dist/format/useNumber.js

@@ -0,0 +1,16 @@
+import { number } from '@intlayer/core/formatters';
+import { derived } from 'svelte/store';
+import { useLocale } from '../client/useLocale';
+/**
+ * Svelte store that provides a localized number formatter.
+ *
+ * @returns {import('svelte/store').Readable<(...args: Parameters<typeof number>) => string>}
+ * A store containing a number formatting function bound to the active locale.
+ */
+export const useNumber = () => {
+    const { locale } = useLocale();
+    return derived(locale, ($locale) => (...args) => number(args[0], {
+        ...args[1],
+        locale: args[1]?.locale ?? $locale,
+    }));
+};

package/dist/format/usePercentage.d.ts

@@ -0,0 +1,3 @@
+export declare const usePercentage: () => import("svelte/store").Readable<(value: string | number, options?: (Intl.NumberFormatOptions & {
+    locale?: import("@intlayer/types/module_augmentation").LocalesValues;
+}) | undefined) => string>;

package/dist/format/usePercentage.js

@@ -0,0 +1,10 @@
+import { percentage } from '@intlayer/core/formatters';
+import { derived } from 'svelte/store';
+import { useLocale } from '../client/useLocale';
+export const usePercentage = () => {
+    const { locale } = useLocale();
+    return derived(locale, ($locale) => (...args) => percentage(args[0], {
+        ...args[1],
+        locale: args[1]?.locale ?? $locale,
+    }));
+};

package/dist/format/useRelativeTime.d.ts

@@ -0,0 +1,4 @@
+export declare const useRelativeTime: () => import("svelte/store").Readable<(from: string | number | Date, to?: string | number | Date | undefined, options?: (Intl.RelativeTimeFormatOptions & {
+    locale?: import("@intlayer/types/module_augmentation").LocalesValues;
+    unit?: Intl.RelativeTimeFormatUnit;
+}) | undefined) => string>;

package/dist/format/useRelativeTime.js

@@ -0,0 +1,10 @@
+import { relativeTime } from '@intlayer/core/formatters';
+import { derived } from 'svelte/store';
+import { useLocale } from '../client/useLocale';
+export const useRelativeTime = () => {
+    const { locale } = useLocale();
+    return derived(locale, ($locale) => (...args) => relativeTime(args[0], args[1], {
+        ...args[2],
+        locale: args[2]?.locale ?? $locale,
+    }));
+};

package/dist/format/useUnit.d.ts

@@ -0,0 +1,3 @@
+export declare const useUnit: () => import("svelte/store").Readable<(value: string | number, options?: (Intl.NumberFormatOptions & {
+    locale?: import("@intlayer/types/module_augmentation").LocalesValues;
+}) | undefined) => string>;

package/dist/format/useUnit.js

@@ -0,0 +1,10 @@
+import { units } from '@intlayer/core/formatters';
+import { derived } from 'svelte/store';
+import { useLocale } from '../client/useLocale';
+export const useUnit = () => {
+    const { locale } = useLocale();
+    return derived(locale, ($locale) => (...args) => units(args[0], {
+        ...args[1],
+        locale: args[1]?.locale ?? $locale,
+    }));
+};

package/dist/plugins.js

@@ -35,7 +35,7 @@ export const intlayerNodePlugins = {
         typeof node === 'number',
     transform: (node, { children, ...rest }) => renderIntlayerNode({
         value: children ?? node,
-        component: isEnabled ? ContentSelector : (children ?? node),
+        component: isEnabled ? ContentSelector : undefined,
         props: rest,
     }),
 };

package/dist/renderIntlayerNode.js

@@ -20,14 +20,12 @@ export const renderIntlayerNode = (args) => {
     }
     else {
         // Functional component (Svelte 5)
-        Node = (anchor, props) => {
-            const mergedProps = {
-                ...props,
+        Node = (props) => {
+            return IntlayerNodeWrapper(props, {
                 Renderer: args.component,
                 rendererProps: args.props,
                 value: args.value,
-            };
-            return IntlayerNodeWrapper(anchor, mergedProps);
+            });
         };
     }
     Object.defineProperty(Node, 'value', {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svelte-intlayer",
-  "version": "8.5.0",
+  "version": "8.5.2",
   "description": "Easily internationalize i18n your Svelte applications with type-safe multilingual content management.",
   "keywords": [
     "intlayer",
@@ -49,6 +49,11 @@
       "svelte": "./dist/html/index.js",
       "default": "./dist/html/index.js"
     },
+    "./format": {
+      "types": "./dist/format/index.d.ts",
+      "svelte": "./dist/format/index.js",
+      "default": "./dist/format/index.js"
+    },
     "./package.json": "./package.json"
   },
   "main": "dist/index.js",
@@ -77,11 +82,11 @@
     "typecheck": "tsc --noEmit --project tsconfig.types.json"
   },
   "dependencies": {
-    "@intlayer/api": "8.5.0",
-    "@intlayer/config": "8.5.0",
-    "@intlayer/core": "8.5.0",
-    "@intlayer/editor": "8.5.0",
-    "@intlayer/types": "8.5.0"
+    "@intlayer/api": "8.5.2",
+    "@intlayer/config": "8.5.2",
+    "@intlayer/core": "8.5.2",
+    "@intlayer/editor": "8.5.2",
+    "@intlayer/types": "8.5.2"
   },
   "devDependencies": {
     "@sveltejs/adapter-auto": "7.0.1",

package/dist/client/useIntl.d.ts

@@ -1,25 +0,0 @@
-import { type WrappedIntl } from '@intlayer/core/formatters';
-import type { LocalesValues } from '@intlayer/types/module_augmentation';
-/**
- * Svelte hook that provides a locale-bound `Intl` object.
- *
- * It acts exactly like the native `Intl` object, but acts as a proxy to:
- * 1. Inject the current locale automatically if none is provided.
- * 2. Use the performance-optimized `CachedIntl` under the hood.
- *
- * @example
- * ```svelte
- * <script>
- *   import { useIntl } from "svelte-intlayer";
- *
- *   const intl = useIntl();
- *
- *   // Standard API, but no need to pass locale as the first argument
- *   $: formatted = new $intl.NumberFormat({
- *     style: 'currency',
- *     currency: 'USD'
- *   }).format(123.45);
- * </script>
- * ```
- */
-export declare const useIntl: (locale?: LocalesValues) => import("svelte/store").Readable<WrappedIntl>;

package/dist/client/useIntl.js

@@ -1,32 +0,0 @@
-import { bindIntl } from '@intlayer/core/formatters';
-import { derived } from 'svelte/store';
-import { useLocale } from './useLocale';
-/**
- * Svelte hook that provides a locale-bound `Intl` object.
- *
- * It acts exactly like the native `Intl` object, but acts as a proxy to:
- * 1. Inject the current locale automatically if none is provided.
- * 2. Use the performance-optimized `CachedIntl` under the hood.
- *
- * @example
- * ```svelte
- * <script>
- *   import { useIntl } from "svelte-intlayer";
- *
- *   const intl = useIntl();
- *
- *   // Standard API, but no need to pass locale as the first argument
- *   $: formatted = new $intl.NumberFormat({
- *     style: 'currency',
- *     currency: 'USD'
- *   }).format(123.45);
- * </script>
- * ```
- */
-export const useIntl = (locale) => {
-    const { locale: contextLocale } = useLocale();
-    return derived(contextLocale, ($locale) => {
-        const currentLocale = locale ?? $locale;
-        return bindIntl(currentLocale);
-    });
-};