react-intlayer 3.5.11 → 4.0.2
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/README.md +97 -193
- package/dist/esm/client/IntlayerProvider.mjs +0 -1
- package/dist/esm/client/IntlayerProvider.mjs.map +1 -1
- package/dist/esm/client/getBrowserLocale.mjs +0 -1
- package/dist/esm/client/getBrowserLocale.mjs.map +1 -1
- package/dist/esm/client/index.mjs +0 -1
- package/dist/esm/client/index.mjs.map +1 -1
- package/dist/esm/client/t.mjs +0 -1
- package/dist/esm/client/t.mjs.map +1 -1
- package/dist/esm/client/useContent.mjs +0 -1
- package/dist/esm/client/useContent.mjs.map +1 -1
- package/dist/esm/client/useDictionary.mjs +0 -1
- package/dist/esm/client/useDictionary.mjs.map +1 -1
- package/dist/esm/client/useIntlayer.mjs +0 -1
- package/dist/esm/client/useIntlayer.mjs.map +1 -1
- package/dist/esm/client/useIntlayerAsync.mjs +0 -1
- package/dist/esm/client/useIntlayerAsync.mjs.map +1 -1
- package/dist/esm/client/useLocale.mjs +0 -1
- package/dist/esm/client/useLocale.mjs.map +1 -1
- package/dist/esm/client/useLocaleBase.mjs +0 -1
- package/dist/esm/client/useLocaleBase.mjs.map +1 -1
- package/dist/esm/client/useLocaleCookie.mjs +0 -1
- package/dist/esm/client/useLocaleCookie.mjs.map +1 -1
- package/dist/esm/client/useTraduction.mjs +0 -1
- package/dist/esm/client/useTraduction.mjs.map +1 -1
- package/dist/esm/distantDictionary/fetchDistantDictionary.mjs +0 -1
- package/dist/esm/distantDictionary/fetchDistantDictionary.mjs.map +1 -1
- package/dist/esm/editor/ContentSelectorConnector.mjs +0 -1
- package/dist/esm/editor/ContentSelectorConnector.mjs.map +1 -1
- package/dist/esm/editor/ContentSelectorWrapper.mjs +0 -1
- package/dist/esm/editor/ContentSelectorWrapper.mjs.map +1 -1
- package/dist/esm/editor/IntlayerEditorProvider.mjs +0 -1
- package/dist/esm/editor/IntlayerEditorProvider.mjs.map +1 -1
- package/dist/esm/editor/renderContentEditor.mjs +0 -1
- package/dist/esm/editor/renderContentEditor.mjs.map +1 -1
- package/dist/esm/getDictionary.mjs +0 -1
- package/dist/esm/getDictionary.mjs.map +1 -1
- package/dist/esm/getEnumeration.mjs +0 -1
- package/dist/esm/getEnumeration.mjs.map +1 -1
- package/dist/esm/getIntlayer.mjs +0 -1
- package/dist/esm/getIntlayer.mjs.map +1 -1
- package/dist/esm/getIntlayerAsync.mjs +0 -1
- package/dist/esm/getIntlayerAsync.mjs.map +1 -1
- package/dist/esm/getTranslation.mjs +0 -1
- package/dist/esm/getTranslation.mjs.map +1 -1
- package/dist/esm/index.mjs +0 -1
- package/dist/esm/index.mjs.map +1 -1
- package/dist/esm/processDictionary/index.mjs +0 -1
- package/dist/esm/processDictionary/index.mjs.map +1 -1
- package/dist/esm/server/IntlayerServerProvider.mjs +0 -1
- package/dist/esm/server/IntlayerServerProvider.mjs.map +1 -1
- package/dist/esm/server/getLocaleTranslation.mjs +0 -1
- package/dist/esm/server/getLocaleTranslation.mjs.map +1 -1
- package/dist/esm/server/index.mjs +0 -1
- package/dist/esm/server/index.mjs.map +1 -1
- package/dist/esm/server/serverContext.mjs +0 -1
- package/dist/esm/server/serverContext.mjs.map +1 -1
- package/dist/esm/server/t.mjs +0 -1
- package/dist/esm/server/t.mjs.map +1 -1
- package/dist/esm/server/useDictionary.mjs +0 -1
- package/dist/esm/server/useDictionary.mjs.map +1 -1
- package/dist/esm/server/useIntlayer.mjs +0 -1
- package/dist/esm/server/useIntlayer.mjs.map +1 -1
- package/dist/esm/server/useTraduction.mjs +0 -1
- package/dist/esm/server/useTraduction.mjs.map +1 -1
- package/dist/esm/utils/PoweredByMeta/index.mjs +0 -1
- package/dist/esm/utils/PoweredByMeta/index.mjs.map +1 -1
- package/package.json +10 -37
- package/dist/cjs/cli/react-intlayer.cjs +0 -73
- package/dist/cjs/cli/react-intlayer.cjs.map +0 -1
- package/dist/cjs/craco/craco.config.cjs +0 -32
- package/dist/cjs/craco/craco.config.cjs.map +0 -1
- package/dist/cjs/craco/intlayerCracoPlugin.cjs +0 -93
- package/dist/cjs/craco/intlayerCracoPlugin.cjs.map +0 -1
- package/dist/cjs/utils/removeUndefinedValueObject.cjs +0 -38
- package/dist/cjs/utils/removeUndefinedValueObject.cjs.map +0 -1
- package/dist/cjs/vite/index.cjs +0 -25
- package/dist/cjs/vite/index.cjs.map +0 -1
- package/dist/cjs/vite/intlayerMiddlewarePlugin.cjs +0 -224
- package/dist/cjs/vite/intlayerMiddlewarePlugin.cjs.map +0 -1
- package/dist/cjs/vite/intlayerPlugin.cjs +0 -88
- package/dist/cjs/vite/intlayerPlugin.cjs.map +0 -1
- package/dist/esm/chunk-ZD7AOCMD.mjs +0 -9
- package/dist/esm/chunk-ZD7AOCMD.mjs.map +0 -1
- package/dist/esm/cli/react-intlayer.mjs +0 -50
- package/dist/esm/cli/react-intlayer.mjs.map +0 -1
- package/dist/esm/craco/craco.config.mjs +0 -17
- package/dist/esm/craco/craco.config.mjs.map +0 -1
- package/dist/esm/craco/intlayerCracoPlugin.mjs +0 -74
- package/dist/esm/craco/intlayerCracoPlugin.mjs.map +0 -1
- package/dist/esm/utils/removeUndefinedValueObject.mjs +0 -15
- package/dist/esm/utils/removeUndefinedValueObject.mjs.map +0 -1
- package/dist/esm/vite/index.mjs +0 -3
- package/dist/esm/vite/index.mjs.map +0 -1
- package/dist/esm/vite/intlayerMiddlewarePlugin.mjs +0 -201
- package/dist/esm/vite/intlayerMiddlewarePlugin.mjs.map +0 -1
- package/dist/esm/vite/intlayerPlugin.mjs +0 -55
- package/dist/esm/vite/intlayerPlugin.mjs.map +0 -1
- package/dist/types/cli/react-intlayer.d.ts +0 -9
- package/dist/types/cli/react-intlayer.d.ts.map +0 -1
- package/dist/types/craco/craco.config.d.ts +0 -2
- package/dist/types/craco/craco.config.d.ts.map +0 -1
- package/dist/types/craco/intlayerCracoPlugin.d.ts +0 -24
- package/dist/types/craco/intlayerCracoPlugin.d.ts.map +0 -1
- package/dist/types/utils/removeUndefinedValueObject.d.ts +0 -2
- package/dist/types/utils/removeUndefinedValueObject.d.ts.map +0 -1
- package/dist/types/vite/index.d.ts +0 -3
- package/dist/types/vite/index.d.ts.map +0 -1
- package/dist/types/vite/intlayerMiddlewarePlugin.d.ts +0 -6
- package/dist/types/vite/intlayerMiddlewarePlugin.d.ts.map +0 -1
- package/dist/types/vite/intlayerPlugin.d.ts +0 -16
- package/dist/types/vite/intlayerPlugin.d.ts.map +0 -1
package/README.md
CHANGED
|
@@ -17,259 +17,163 @@
|
|
|
17
17
|
</a>
|
|
18
18
|
</div>
|
|
19
19
|
|
|
20
|
-
#
|
|
20
|
+
# react-intlayer: NPM Package to internationalize (i18n) an React application
|
|
21
21
|
|
|
22
|
-
**Intlayer** is
|
|
22
|
+
**Intlayer** is a suite of packages designed specifically for JavaScript developers. It is compatible with frameworks like React, React, and Express.js.
|
|
23
23
|
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
```bash
|
|
27
|
-
.
|
|
28
|
-
├── Component1
|
|
29
|
-
│ ├── index.content.ts
|
|
30
|
-
│ └── index.tsx
|
|
31
|
-
└── Component2
|
|
32
|
-
├── index.content.ts
|
|
33
|
-
└── index.tsx
|
|
34
|
-
```
|
|
35
|
-
|
|
36
|
-
```tsx
|
|
37
|
-
// ./Component1/index.content.ts
|
|
38
|
-
|
|
39
|
-
import { type DeclarationContent, t } from "intlayer";
|
|
40
|
-
|
|
41
|
-
const component1Content = {
|
|
42
|
-
key: "component1",
|
|
43
|
-
content: {
|
|
44
|
-
myTranslatedContent: t({
|
|
45
|
-
en: "Hello World",
|
|
46
|
-
fr: "Bonjour le monde",
|
|
47
|
-
es: "Hola Mundo",
|
|
48
|
-
}),
|
|
49
|
-
},
|
|
50
|
-
} satisfies DeclarationContent;
|
|
51
|
-
```
|
|
52
|
-
|
|
53
|
-
```tsx
|
|
54
|
-
// ./Component1/index.tsx
|
|
55
|
-
|
|
56
|
-
import { useIntlayer } from "react-intlayer";
|
|
24
|
+
**The `react-intlayer` package** allows you to internationalize your React application. It provides context providers and hooks for React internationalization.
|
|
57
25
|
|
|
58
|
-
|
|
59
|
-
const { myTranslatedContent } = useIntlayer("component1");
|
|
26
|
+
## Why Internationalize Your React Application?
|
|
60
27
|
|
|
61
|
-
|
|
62
|
-
};
|
|
63
|
-
```
|
|
28
|
+
Internationalizing your React application is essential for serving a global audience effectively. It allows your application to deliver content and messages in the preferred language of each user. This capability enhances user experience and broadens your application's reach by making it more accessible and relevant to people from different linguistic backgrounds.
|
|
64
29
|
|
|
65
|
-
## Why
|
|
30
|
+
## Why to integrate Intlayer?
|
|
66
31
|
|
|
67
32
|
- **JavaScript-Powered Content Management**: Harness the flexibility of JavaScript to define and manage your content efficiently.
|
|
68
33
|
- **Type-Safe Environment**: Leverage TypeScript to ensure all your content definitions are precise and error-free.
|
|
69
34
|
- **Integrated Content Files**: Keep your translations close to their respective components, enhancing maintainability and clarity.
|
|
70
|
-
- **Simplified Setup**: Get up and running quickly with minimal configuration, especially optimized for Next.js projects.
|
|
71
|
-
- **Server Component Support**: Perfectly suited for Next.js server components, ensuring smooth server-side rendering.
|
|
72
|
-
- **Enhanced Routing**: Full support for Next.js app routing, adapting seamlessly to complex application structures.
|
|
73
|
-
|
|
74
|
-
# Getting Started with Intlayer and React Create App
|
|
75
|
-
|
|
76
|
-
Setting up Intlayer in a Create React App application is straightforward:
|
|
77
35
|
|
|
78
|
-
##
|
|
36
|
+
## Installation
|
|
79
37
|
|
|
80
|
-
Install the necessary
|
|
38
|
+
Install the necessary package using your preferred package manager:
|
|
81
39
|
|
|
82
|
-
```bash
|
|
83
|
-
npm install
|
|
40
|
+
```bash packageManager="npm"
|
|
41
|
+
npm install react-intlayer
|
|
84
42
|
```
|
|
85
43
|
|
|
86
|
-
```bash
|
|
87
|
-
yarn add
|
|
44
|
+
```bash packageManager="yarn"
|
|
45
|
+
yarn add react-intlayer
|
|
88
46
|
```
|
|
89
47
|
|
|
90
|
-
```bash
|
|
91
|
-
pnpm add
|
|
48
|
+
```bash packageManager="pnpm"
|
|
49
|
+
pnpm add react-intlayer
|
|
92
50
|
```
|
|
93
51
|
|
|
94
|
-
##
|
|
95
|
-
|
|
96
|
-
Create a config file to configure the languages of your application:
|
|
97
|
-
|
|
98
|
-
```typescript
|
|
99
|
-
// intlayer.config.ts
|
|
100
|
-
|
|
101
|
-
import { Locales, type IntlayerConfig } from "intlayer";
|
|
102
|
-
|
|
103
|
-
const config: IntlayerConfig = {
|
|
104
|
-
internationalization: {
|
|
105
|
-
locales: [
|
|
106
|
-
Locales.ENGLISH,
|
|
107
|
-
Locales.FRENCH,
|
|
108
|
-
Locales.SPANISH,
|
|
109
|
-
// Your other locales
|
|
110
|
-
],
|
|
111
|
-
defaultLocale: Locales.ENGLISH,
|
|
112
|
-
},
|
|
113
|
-
};
|
|
114
|
-
|
|
115
|
-
export default config;
|
|
116
|
-
```
|
|
52
|
+
## Example of usage
|
|
117
53
|
|
|
118
|
-
|
|
54
|
+
With Intlayer, you can declare your content in a structured way anywhere in your codebase.
|
|
119
55
|
|
|
120
|
-
|
|
56
|
+
By default, Intlayer scans for files with the extension `.content.{ts,tsx,js,jsx,mjs,cjs}`.
|
|
121
57
|
|
|
122
|
-
|
|
58
|
+
> You can modify the default extension by setting the `contentDir` property in the [configuration file](https://github.com/aymericzip/intlayer/blob/main/docs/en/configuration.md).
|
|
123
59
|
|
|
124
|
-
```
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
60
|
+
```bash codeFormat="typescript"
|
|
61
|
+
.
|
|
62
|
+
├── intlayer.config.ts
|
|
63
|
+
└── src
|
|
64
|
+
└── components
|
|
65
|
+
├── Component1
|
|
66
|
+
│ ├── index.content.ts
|
|
67
|
+
│ └── index.tsx
|
|
68
|
+
└── Component2
|
|
69
|
+
├── index.content.ts
|
|
70
|
+
└── index.tsx
|
|
130
71
|
```
|
|
131
72
|
|
|
132
|
-
|
|
73
|
+
### Declare your content
|
|
133
74
|
|
|
134
|
-
|
|
75
|
+
`react-intlayer` is made to work with the [`intlayer` package](https://github.com/aymericzip/intlayer/blob/main/docs/en/packages/intlayer/index.md).`intlayer` is a package that allows you to declare your content anywhere in your code. It converts multilingual content declarations into structured dictionaries that integrate seamlessly into your application.
|
|
135
76
|
|
|
136
|
-
|
|
77
|
+
Here’s an example of content declaration:
|
|
137
78
|
|
|
138
|
-
```tsx
|
|
139
|
-
|
|
140
|
-
import { t, type DeclarationContent } from "intlayer";
|
|
141
|
-
import { type ReactNode } from "react";
|
|
79
|
+
```tsx filePath="src/Component1/index.content.ts" codeFormat="typescript"
|
|
80
|
+
import { type DeclarationContent, t } from "intlayer";
|
|
142
81
|
|
|
143
|
-
const
|
|
144
|
-
key: "
|
|
82
|
+
const component1Content = {
|
|
83
|
+
key: "component-1",
|
|
145
84
|
content: {
|
|
146
|
-
|
|
147
|
-
en:
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
<>
|
|
159
|
-
Edita <code>src/App.tsx</code> y guarda para recargar
|
|
160
|
-
</>
|
|
161
|
-
),
|
|
85
|
+
myTranslatedContent: t({
|
|
86
|
+
en: "Hello World",
|
|
87
|
+
fr: "Bonjour le monde",
|
|
88
|
+
es: "Hola Mundo",
|
|
89
|
+
}),
|
|
90
|
+
numberOfCar: enu({
|
|
91
|
+
"<-1": "Less than minus one car",
|
|
92
|
+
"-1": "Minus one car",
|
|
93
|
+
"0": "No cars",
|
|
94
|
+
"1": "One car",
|
|
95
|
+
">5": "Some cars",
|
|
96
|
+
">19": "Many cars",
|
|
162
97
|
}),
|
|
163
|
-
reactLink: {
|
|
164
|
-
href: "https://reactjs.org",
|
|
165
|
-
content: t({
|
|
166
|
-
en: "Learn React",
|
|
167
|
-
fr: "Apprendre React",
|
|
168
|
-
es: "Aprender React",
|
|
169
|
-
}),
|
|
170
|
-
},
|
|
171
98
|
},
|
|
172
99
|
} satisfies DeclarationContent;
|
|
173
100
|
|
|
174
|
-
export default
|
|
101
|
+
export default component1Content;
|
|
175
102
|
```
|
|
176
103
|
|
|
177
|
-
|
|
104
|
+
### Utilize Content in Your Code
|
|
178
105
|
|
|
179
|
-
|
|
106
|
+
Once you have declared your content, you can use it in your code. Here's an example of how to use the content in a React component:
|
|
180
107
|
|
|
181
|
-
|
|
108
|
+
```tsx {4,7} fileName="src/components/Component1Example.tsx" codeFormat="typescript"
|
|
109
|
+
"use client";
|
|
182
110
|
|
|
183
|
-
|
|
184
|
-
import
|
|
185
|
-
import "./App.css";
|
|
186
|
-
import { IntlayerProvider, useIntlayer } from "react-intlayer";
|
|
187
|
-
import { LocaleSwitcher } from "./components/LangSwitcherDropDown";
|
|
111
|
+
import type { FC } from "react";
|
|
112
|
+
import { useIntlayer } from "react-intlayer";
|
|
188
113
|
|
|
189
|
-
|
|
190
|
-
const
|
|
114
|
+
export const Component1Example: FC = () => {
|
|
115
|
+
const { myTranslatedContent } = useIntlayer("component-1"); // Create related content declaration
|
|
191
116
|
|
|
192
117
|
return (
|
|
193
|
-
<
|
|
194
|
-
<
|
|
195
|
-
|
|
196
|
-
{content.getStarted}
|
|
197
|
-
<a
|
|
198
|
-
className="App-link"
|
|
199
|
-
href={content.reactLink.href.value}
|
|
200
|
-
target="_blank"
|
|
201
|
-
rel="noopener noreferrer"
|
|
202
|
-
>
|
|
203
|
-
{content.reactLink.content}
|
|
204
|
-
</a>
|
|
205
|
-
</header>
|
|
118
|
+
<div>
|
|
119
|
+
<p>{myTranslatedContent}</p>
|
|
120
|
+
</div>
|
|
206
121
|
);
|
|
207
|
-
}
|
|
122
|
+
};
|
|
123
|
+
```
|
|
208
124
|
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
<IntlayerProvider>
|
|
212
|
-
<div className="App">
|
|
213
|
-
{/* To use the useIntlayer hook properly, you should access your data in a children component */}
|
|
214
|
-
<AppContent />
|
|
215
|
-
</div>
|
|
216
|
-
<div className="absolute bottom-5 right-5 z-50">
|
|
217
|
-
<LocaleSwitcher />
|
|
218
|
-
</div>
|
|
219
|
-
</IntlayerProvider>
|
|
220
|
-
);
|
|
221
|
-
}
|
|
125
|
+
```jsx {3,6} fileName="src/components/Component1Example.mjx" codeFormat="esm"
|
|
126
|
+
"use client";
|
|
222
127
|
|
|
223
|
-
|
|
224
|
-
```
|
|
128
|
+
import { useIntlayer } from "react-intlayer";
|
|
225
129
|
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
> ```tsx
|
|
229
|
-
> <img src={content.image.src.value} alt={content.image.value} />
|
|
230
|
-
> ```
|
|
130
|
+
const Component1Example = () => {
|
|
131
|
+
const { myTranslatedContent } = useIntlayer("component-1"); // Create related content declaration
|
|
231
132
|
|
|
232
|
-
|
|
133
|
+
return (
|
|
134
|
+
<div>
|
|
135
|
+
<p>{myTranslatedContent}</p>
|
|
136
|
+
</div>
|
|
137
|
+
);
|
|
138
|
+
};
|
|
139
|
+
```
|
|
233
140
|
|
|
234
|
-
|
|
141
|
+
```jsx {3,6} fileName="src/components/Component1Example.csx" codeFormat="commonjs"
|
|
142
|
+
"use client";
|
|
235
143
|
|
|
236
|
-
|
|
237
|
-
import { Locales } from "intlayer";
|
|
238
|
-
import { useLocale } from "react-intlayer";
|
|
144
|
+
const { useIntlayer } = require("react-intlayer");
|
|
239
145
|
|
|
240
|
-
const
|
|
241
|
-
const {
|
|
146
|
+
const Component1Example = () => {
|
|
147
|
+
const { myTranslatedContent } = useIntlayer("component-1"); // Create related content declaration
|
|
242
148
|
|
|
243
149
|
return (
|
|
244
|
-
<
|
|
245
|
-
|
|
246
|
-
</
|
|
150
|
+
<div>
|
|
151
|
+
<p>{myTranslatedContent}</p>
|
|
152
|
+
</div>
|
|
247
153
|
);
|
|
248
154
|
};
|
|
249
155
|
```
|
|
250
156
|
|
|
251
|
-
##
|
|
157
|
+
## Mastering the internationalization of your React application
|
|
252
158
|
|
|
253
|
-
Intlayer
|
|
159
|
+
Intlayer provides a lot of features to help you internationalize your React application.
|
|
254
160
|
|
|
255
|
-
|
|
161
|
+
**To learn more about these features, refer to the [React Internationalization (i18n) with Intlayer and Vite and React](https://github.com/aymericzip/intlayer/blob/main/docs/en/intlayer_with_vite+react.md) guide for Vite and React Application, or the [React Internationalization (i18n) with Intlayer and React (CRA)](https://github.com/aymericzip/intlayer/blob/main/docs/en/intlayer_with_create_react_app.md) guide for React Create App.**
|
|
256
162
|
|
|
257
|
-
|
|
163
|
+
## Functions provided by `react-intlayer` package
|
|
258
164
|
|
|
259
|
-
|
|
165
|
+
The `react-intlayer` package also provides some functions to help you to internationalize your application.
|
|
260
166
|
|
|
261
|
-
|
|
262
|
-
|
|
167
|
+
- [`t()`](https://github.com/aymericzip/intlayer/blob/main/docs/en/packages/react-intlayer/t.md)
|
|
168
|
+
- [`useIntlayer()`](https://github.com/aymericzip/intlayer/blob/main/docs/en/packages/react-intlayer/useIntlayer.md)
|
|
169
|
+
- [`useDictionary()`](https://github.com/aymericzip/intlayer/blob/main/docs/en/packages/react-intlayer/useDictionary.md)
|
|
170
|
+
- [`useLocale()`](https://github.com/aymericzip/intlayer/blob/main/docs/en/packages/react-intlayer/useLocale.md)
|
|
171
|
+
- [`useIntlayerAsync()`](https://github.com/aymericzip/intlayer/blob/main/docs/en/packages/react-intlayer/useIntlayerAsync.md)
|
|
263
172
|
|
|
264
|
-
|
|
265
|
-
// your custom config
|
|
266
|
-
"include": [
|
|
267
|
-
"src",
|
|
268
|
-
"types", // <- Include the auto generated types
|
|
269
|
-
],
|
|
270
|
-
}
|
|
271
|
-
```
|
|
173
|
+
## Read about Intlayer
|
|
272
174
|
|
|
273
|
-
|
|
175
|
+
- [Intlayer Website](https://intlayer.org)
|
|
176
|
+
- [Intlayer Documentation](https://intlayer.org/docs)
|
|
177
|
+
- [Intlayer GitHub](https://github.com/aymericzip/intlayer)
|
|
274
178
|
|
|
275
|
-
|
|
179
|
+
- [Ask your questions to our smart documentation](https://intlayer.org/docs/chat)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/IntlayerProvider.tsx"],"sourcesContent":["'use client';\n\nimport { getConfiguration, type Locales } from '@intlayer/config/client';\nimport {\n type PropsWithChildren,\n createContext,\n useContext,\n useMemo,\n type FC,\n useState,\n useCallback,\n} from 'react';\nimport { localeCookie, setLocaleCookie } from './useLocaleCookie';\nimport { IntlayerEditorProvider } from '../editor/IntlayerEditorProvider';\n\ntype IntlayerValue = {\n locale: Locales;\n setLocale: (newLocale: Locales) => void;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const IntlayerClientContext = createContext<IntlayerValue>({\n locale: localeCookie ?? getConfiguration().internationalization.defaultLocale,\n setLocale: () => null,\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayerContext = () => useContext(IntlayerClientContext);\n\nexport type IntlayerProviderProps = PropsWithChildren & {\n locale?: Locales;\n setLocale?: (locale: Locales) => void;\n};\n\n/**\n * Provider that store the current locale on the client side\n */\nexport const IntlayerProvider: FC<IntlayerProviderProps> = ({\n locale,\n children,\n setLocale: setLocaleProp,\n}) => {\n const { internationalization } = getConfiguration();\n const { defaultLocale, locales: availableLocales } = internationalization;\n\n const [currentLocale, setCurrentLocale] = useState(\n locale ?? localeCookie ?? defaultLocale\n );\n\n const setLocaleBase = useCallback(\n (newLocale: Locales) => {\n if (currentLocale.toString() === newLocale.toString()) return;\n\n if (!availableLocales.includes(newLocale)) {\n console.error(`Locale ${locale} is not available`);\n return;\n }\n\n setCurrentLocale(newLocale); // Update state\n setLocaleCookie(newLocale); // Optionally set cookie for persistence\n },\n [availableLocales, currentLocale, locale]\n );\n\n const setLocale = setLocaleProp ?? setLocaleBase;\n\n const value: IntlayerValue = useMemo<IntlayerValue>(\n () => ({ locale: currentLocale, setLocale: setLocale }),\n [currentLocale, setLocale]\n );\n\n return (\n <IntlayerClientContext.Provider value={value}>\n <IntlayerEditorProvider>{children}</IntlayerEditorProvider>\n </IntlayerClientContext.Provider>\n );\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/IntlayerProvider.tsx"],"sourcesContent":["'use client';\n\nimport { getConfiguration, type Locales } from '@intlayer/config/client';\nimport {\n type PropsWithChildren,\n createContext,\n useContext,\n useMemo,\n type FC,\n useState,\n useCallback,\n} from 'react';\nimport { localeCookie, setLocaleCookie } from './useLocaleCookie';\nimport { IntlayerEditorProvider } from '../editor/IntlayerEditorProvider';\n\ntype IntlayerValue = {\n locale: Locales;\n setLocale: (newLocale: Locales) => void;\n};\n\n/**\n * Context that store the current locale on the client side\n */\nexport const IntlayerClientContext = createContext<IntlayerValue>({\n locale: localeCookie ?? getConfiguration().internationalization.defaultLocale,\n setLocale: () => null,\n});\n\n/**\n * Hook that provides the current locale\n */\nexport const useIntlayerContext = () => useContext(IntlayerClientContext);\n\nexport type IntlayerProviderProps = PropsWithChildren & {\n locale?: Locales;\n setLocale?: (locale: Locales) => void;\n};\n\n/**\n * Provider that store the current locale on the client side\n */\nexport const IntlayerProvider: FC<IntlayerProviderProps> = ({\n locale,\n children,\n setLocale: setLocaleProp,\n}) => {\n const { internationalization } = getConfiguration();\n const { defaultLocale, locales: availableLocales } = internationalization;\n\n const [currentLocale, setCurrentLocale] = useState(\n locale ?? localeCookie ?? defaultLocale\n );\n\n const setLocaleBase = useCallback(\n (newLocale: Locales) => {\n if (currentLocale.toString() === newLocale.toString()) return;\n\n if (!availableLocales.includes(newLocale)) {\n console.error(`Locale ${locale} is not available`);\n return;\n }\n\n setCurrentLocale(newLocale); // Update state\n setLocaleCookie(newLocale); // Optionally set cookie for persistence\n },\n [availableLocales, currentLocale, locale]\n );\n\n const setLocale = setLocaleProp ?? setLocaleBase;\n\n const value: IntlayerValue = useMemo<IntlayerValue>(\n () => ({ locale: currentLocale, setLocale: setLocale }),\n [currentLocale, setLocale]\n );\n\n return (\n <IntlayerClientContext.Provider value={value}>\n <IntlayerEditorProvider>{children}</IntlayerEditorProvider>\n </IntlayerClientContext.Provider>\n );\n};\n"],"mappings":";AA6EM;AA3EN,SAAS,wBAAsC;AAC/C;AAAA,EAEE;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,OACK;AACP,SAAS,cAAc,uBAAuB;AAC9C,SAAS,8BAA8B;AAUhC,MAAM,wBAAwB,cAA6B;AAAA,EAChE,QAAQ,gBAAgB,iBAAiB,EAAE,qBAAqB;AAAA,EAChE,WAAW,MAAM;AACnB,CAAC;AAKM,MAAM,qBAAqB,MAAM,WAAW,qBAAqB;AAUjE,MAAM,mBAA8C,CAAC;AAAA,EAC1D;AAAA,EACA;AAAA,EACA,WAAW;AACb,MAAM;AACJ,QAAM,EAAE,qBAAqB,IAAI,iBAAiB;AAClD,QAAM,EAAE,eAAe,SAAS,iBAAiB,IAAI;AAErD,QAAM,CAAC,eAAe,gBAAgB,IAAI;AAAA,IACxC,UAAU,gBAAgB;AAAA,EAC5B;AAEA,QAAM,gBAAgB;AAAA,IACpB,CAAC,cAAuB;AACtB,UAAI,cAAc,SAAS,MAAM,UAAU,SAAS,EAAG;AAEvD,UAAI,CAAC,iBAAiB,SAAS,SAAS,GAAG;AACzC,gBAAQ,MAAM,UAAU,MAAM,mBAAmB;AACjD;AAAA,MACF;AAEA,uBAAiB,SAAS;AAC1B,sBAAgB,SAAS;AAAA,IAC3B;AAAA,IACA,CAAC,kBAAkB,eAAe,MAAM;AAAA,EAC1C;AAEA,QAAM,YAAY,iBAAiB;AAEnC,QAAM,QAAuB;AAAA,IAC3B,OAAO,EAAE,QAAQ,eAAe,UAAqB;AAAA,IACrD,CAAC,eAAe,SAAS;AAAA,EAC3B;AAEA,SACE,oBAAC,sBAAsB,UAAtB,EAA+B,OAC9B,8BAAC,0BAAwB,UAAS,GACpC;AAEJ;","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/getBrowserLocale.tsx"],"sourcesContent":["import { getConfiguration, type Locales } from '@intlayer/config/client';\nimport { localeList } from '@intlayer/core';\n\nexport enum LanguageDetector {\n Querystring = 'querystring',\n Cookie = 'cookie',\n LocalStorage = 'localStorage',\n SessionStorage = 'sessionStorage',\n Navigator = 'navigator',\n HtmlTag = 'htmlTag',\n}\n\n// Default settings for the language detector\ntype LanguageDetectorOptions = {\n order?: LanguageDetector[];\n lookupQuerystring?: string;\n lookupCookie?: string;\n lookupLocalStorage?: string;\n lookupSessionStorage?: string;\n excludeCacheFor?: string[];\n htmlTag?: HTMLElement | null;\n};\n\nconst getDefaultsOptions = (): LanguageDetectorOptions => {\n const { middleware } = getConfiguration();\n\n return {\n order: [\n LanguageDetector.Querystring,\n LanguageDetector.Cookie,\n LanguageDetector.Navigator,\n LanguageDetector.HtmlTag,\n ],\n lookupQuerystring: 'locale',\n lookupCookie: middleware.cookieName,\n htmlTag: document.documentElement,\n };\n};\n\n// Helper functions for various checks and operations\nconst isLocalStorageAvailable = (): boolean => {\n try {\n if (typeof window === 'undefined') return false;\n const testKey = 'intlayer.translate.boo';\n window.localStorage.setItem(testKey, 'foo');\n window.localStorage.removeItem(testKey);\n return true;\n } catch {\n return false;\n }\n};\n\nconst isSessionStorageAvailable = (): boolean => {\n try {\n if (typeof window === 'undefined') return false;\n const testKey = 'intlayer.translate.boo';\n window.sessionStorage.setItem(testKey, 'foo');\n window.sessionStorage.removeItem(testKey);\n return true;\n } catch {\n return false;\n }\n};\n\n// Function to detect language using different detectors\nconst detectLanguage = (\n order: string[],\n options: LanguageDetectorOptions\n): Record<LanguageDetector, Locales | Locales[]> => {\n const detected: Record<LanguageDetector, Locales | Locales[]> = {} as Record<\n LanguageDetector,\n Locales | Locales[]\n >;\n\n const queryStringDetector = () => {\n if (typeof window === 'undefined') return;\n const search = window.location.search || '';\n const params = new URLSearchParams(search);\n const value = params.get(options.lookupQuerystring ?? '');\n if (value) {\n detected[LanguageDetector.Querystring] = value as Locales;\n }\n };\n\n const cookieDetector = () => {\n if (typeof document === 'undefined') return;\n const cookies = document.cookie.split(';');\n const cookieName = `${options.lookupCookie ?? ''}=`;\n const cookie = cookies.find((c) => c.trim().startsWith(cookieName));\n if (cookie) {\n const value = cookie.split('=')[1].trim();\n\n detected[LanguageDetector.Cookie] = value as Locales;\n }\n };\n\n const localStorageDetector = () => {\n if (!isLocalStorageAvailable()) return;\n const value = window.localStorage.getItem(options.lookupLocalStorage ?? '');\n if (value) {\n detected[LanguageDetector.LocalStorage] = value as Locales;\n }\n };\n\n const sessionStorageDetector = () => {\n if (!isSessionStorageAvailable()) return;\n const value = window.sessionStorage.getItem(\n options.lookupSessionStorage ?? ''\n );\n if (value) {\n detected[LanguageDetector.SessionStorage] = value as Locales;\n }\n };\n\n const navigatorDetector = () => {\n if (typeof navigator === 'undefined') return;\n\n if (navigator.language) {\n detected[LanguageDetector.Navigator] = navigator.language as Locales;\n }\n };\n\n const htmlTagDetector = () => {\n const htmlTag = options.htmlTag;\n if (htmlTag && typeof htmlTag.getAttribute === 'function') {\n const lang = htmlTag.getAttribute('lang');\n if (lang) {\n detected[LanguageDetector.HtmlTag] = lang as Locales;\n }\n }\n };\n\n // Map detector names to their corresponding functions\n const detectors: Record<string, () => void> = {\n [LanguageDetector.Querystring]: queryStringDetector,\n [LanguageDetector.Cookie]: cookieDetector,\n [LanguageDetector.LocalStorage]: localStorageDetector,\n [LanguageDetector.SessionStorage]: sessionStorageDetector,\n [LanguageDetector.Navigator]: navigatorDetector,\n [LanguageDetector.HtmlTag]: htmlTagDetector,\n };\n\n // Use the provided order to run each detector\n order.forEach((detectorName) => {\n detectors[detectorName]?.();\n });\n\n return detected;\n};\n\nconst getFirstAvailableLocale = (\n locales: Record<LanguageDetector, Locales | Locales[]>,\n order: LanguageDetector[]\n): Locales => {\n const { internationalization } = getConfiguration();\n\n for (const detector of order) {\n const localesArray = [locales[detector]].flat();\n\n for (const locale of localesArray) {\n if (\n locale &&\n (internationalization.locales ?? localeList).includes(locale)\n ) {\n return locale;\n } else if (\n locale?.includes('-') &&\n (internationalization.locales ?? localeList).includes(\n locale.split('-')[0] as Locales\n )\n ) {\n return locale.split('-')[0] as Locales;\n }\n }\n }\n\n return internationalization.defaultLocale;\n};\n\n/**\n * Core language detector function\n * const detectedLanguages = detectLanguage(['LanguageDetector.Cookie', 'LanguageDetector.LocalStorage'], { lookupCookie: 'myCookie' });\n */\nexport const getBrowserLocale = (\n userOptions: LanguageDetectorOptions | undefined = {}\n): Locales => {\n const options = { ...getDefaultsOptions(), ...userOptions };\n\n const locales = detectLanguage(options.order ?? [], options);\n\n return getFirstAvailableLocale(locales, options.order ?? []);\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/getBrowserLocale.tsx"],"sourcesContent":["import { getConfiguration, type Locales } from '@intlayer/config/client';\nimport { localeList } from '@intlayer/core';\n\nexport enum LanguageDetector {\n Querystring = 'querystring',\n Cookie = 'cookie',\n LocalStorage = 'localStorage',\n SessionStorage = 'sessionStorage',\n Navigator = 'navigator',\n HtmlTag = 'htmlTag',\n}\n\n// Default settings for the language detector\ntype LanguageDetectorOptions = {\n order?: LanguageDetector[];\n lookupQuerystring?: string;\n lookupCookie?: string;\n lookupLocalStorage?: string;\n lookupSessionStorage?: string;\n excludeCacheFor?: string[];\n htmlTag?: HTMLElement | null;\n};\n\nconst getDefaultsOptions = (): LanguageDetectorOptions => {\n const { middleware } = getConfiguration();\n\n return {\n order: [\n LanguageDetector.Querystring,\n LanguageDetector.Cookie,\n LanguageDetector.Navigator,\n LanguageDetector.HtmlTag,\n ],\n lookupQuerystring: 'locale',\n lookupCookie: middleware.cookieName,\n htmlTag: document.documentElement,\n };\n};\n\n// Helper functions for various checks and operations\nconst isLocalStorageAvailable = (): boolean => {\n try {\n if (typeof window === 'undefined') return false;\n const testKey = 'intlayer.translate.boo';\n window.localStorage.setItem(testKey, 'foo');\n window.localStorage.removeItem(testKey);\n return true;\n } catch {\n return false;\n }\n};\n\nconst isSessionStorageAvailable = (): boolean => {\n try {\n if (typeof window === 'undefined') return false;\n const testKey = 'intlayer.translate.boo';\n window.sessionStorage.setItem(testKey, 'foo');\n window.sessionStorage.removeItem(testKey);\n return true;\n } catch {\n return false;\n }\n};\n\n// Function to detect language using different detectors\nconst detectLanguage = (\n order: string[],\n options: LanguageDetectorOptions\n): Record<LanguageDetector, Locales | Locales[]> => {\n const detected: Record<LanguageDetector, Locales | Locales[]> = {} as Record<\n LanguageDetector,\n Locales | Locales[]\n >;\n\n const queryStringDetector = () => {\n if (typeof window === 'undefined') return;\n const search = window.location.search || '';\n const params = new URLSearchParams(search);\n const value = params.get(options.lookupQuerystring ?? '');\n if (value) {\n detected[LanguageDetector.Querystring] = value as Locales;\n }\n };\n\n const cookieDetector = () => {\n if (typeof document === 'undefined') return;\n const cookies = document.cookie.split(';');\n const cookieName = `${options.lookupCookie ?? ''}=`;\n const cookie = cookies.find((c) => c.trim().startsWith(cookieName));\n if (cookie) {\n const value = cookie.split('=')[1].trim();\n\n detected[LanguageDetector.Cookie] = value as Locales;\n }\n };\n\n const localStorageDetector = () => {\n if (!isLocalStorageAvailable()) return;\n const value = window.localStorage.getItem(options.lookupLocalStorage ?? '');\n if (value) {\n detected[LanguageDetector.LocalStorage] = value as Locales;\n }\n };\n\n const sessionStorageDetector = () => {\n if (!isSessionStorageAvailable()) return;\n const value = window.sessionStorage.getItem(\n options.lookupSessionStorage ?? ''\n );\n if (value) {\n detected[LanguageDetector.SessionStorage] = value as Locales;\n }\n };\n\n const navigatorDetector = () => {\n if (typeof navigator === 'undefined') return;\n\n if (navigator.language) {\n detected[LanguageDetector.Navigator] = navigator.language as Locales;\n }\n };\n\n const htmlTagDetector = () => {\n const htmlTag = options.htmlTag;\n if (htmlTag && typeof htmlTag.getAttribute === 'function') {\n const lang = htmlTag.getAttribute('lang');\n if (lang) {\n detected[LanguageDetector.HtmlTag] = lang as Locales;\n }\n }\n };\n\n // Map detector names to their corresponding functions\n const detectors: Record<string, () => void> = {\n [LanguageDetector.Querystring]: queryStringDetector,\n [LanguageDetector.Cookie]: cookieDetector,\n [LanguageDetector.LocalStorage]: localStorageDetector,\n [LanguageDetector.SessionStorage]: sessionStorageDetector,\n [LanguageDetector.Navigator]: navigatorDetector,\n [LanguageDetector.HtmlTag]: htmlTagDetector,\n };\n\n // Use the provided order to run each detector\n order.forEach((detectorName) => {\n detectors[detectorName]?.();\n });\n\n return detected;\n};\n\nconst getFirstAvailableLocale = (\n locales: Record<LanguageDetector, Locales | Locales[]>,\n order: LanguageDetector[]\n): Locales => {\n const { internationalization } = getConfiguration();\n\n for (const detector of order) {\n const localesArray = [locales[detector]].flat();\n\n for (const locale of localesArray) {\n if (\n locale &&\n (internationalization.locales ?? localeList).includes(locale)\n ) {\n return locale;\n } else if (\n locale?.includes('-') &&\n (internationalization.locales ?? localeList).includes(\n locale.split('-')[0] as Locales\n )\n ) {\n return locale.split('-')[0] as Locales;\n }\n }\n }\n\n return internationalization.defaultLocale;\n};\n\n/**\n * Core language detector function\n * const detectedLanguages = detectLanguage(['LanguageDetector.Cookie', 'LanguageDetector.LocalStorage'], { lookupCookie: 'myCookie' });\n */\nexport const getBrowserLocale = (\n userOptions: LanguageDetectorOptions | undefined = {}\n): Locales => {\n const options = { ...getDefaultsOptions(), ...userOptions };\n\n const locales = detectLanguage(options.order ?? [], options);\n\n return getFirstAvailableLocale(locales, options.order ?? []);\n};\n"],"mappings":"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","names":["LanguageDetector"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/index.ts"],"sourcesContent":["export {\n type IntlayerProviderProps,\n IntlayerClientContext,\n useIntlayerContext,\n IntlayerProvider,\n} from './IntlayerProvider';\nexport { useIntlayer } from './useIntlayer';\nexport { useIntlayerAsync } from './useIntlayerAsync';\nexport { useDictionary } from './useDictionary';\nexport { useLocaleBase } from './useLocaleBase';\nexport { useLocale } from './useLocale';\nexport { useTraduction } from './useTraduction';\nexport {\n useLocaleCookie,\n localeCookie,\n setLocaleCookie,\n} from './useLocaleCookie';\nexport { getBrowserLocale } from './getBrowserLocale';\nexport { t } from './t';\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/index.ts"],"sourcesContent":["export {\n type IntlayerProviderProps,\n IntlayerClientContext,\n useIntlayerContext,\n IntlayerProvider,\n} from './IntlayerProvider';\nexport { useIntlayer } from './useIntlayer';\nexport { useIntlayerAsync } from './useIntlayerAsync';\nexport { useDictionary } from './useDictionary';\nexport { useLocaleBase } from './useLocaleBase';\nexport { useLocale } from './useLocale';\nexport { useTraduction } from './useTraduction';\nexport {\n useLocaleCookie,\n localeCookie,\n setLocaleCookie,\n} from './useLocaleCookie';\nexport { getBrowserLocale } from './getBrowserLocale';\nexport { t } from './t';\n"],"mappings":"AAAA;AAAA,EAEE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,mBAAmB;AAC5B,SAAS,wBAAwB;AACjC,SAAS,qBAAqB;AAC9B,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB;AAC1B,SAAS,qBAAqB;AAC9B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,wBAAwB;AACjC,SAAS,SAAS;","names":[]}
|
package/dist/esm/client/t.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/t.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport type { LanguageContent } from '@intlayer/core';\nimport { useContext } from 'react';\nimport { getTranslation } from '../getTranslation';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the client side, this function returns the translation of the provided multilang content.\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const t = <Content = string>(\n multilangContent: LanguageContent<Content>,\n locale?: Locales\n) => {\n const { locale: currentLocale } = useContext(IntlayerClientContext);\n const localeTarget = locale ?? currentLocale;\n\n return getTranslation<Content>(multilangContent, localeTarget);\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/t.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport type { LanguageContent } from '@intlayer/core';\nimport { useContext } from 'react';\nimport { getTranslation } from '../getTranslation';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the client side, this function returns the translation of the provided multilang content.\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const t = <Content = string>(\n multilangContent: LanguageContent<Content>,\n locale?: Locales\n) => {\n const { locale: currentLocale } = useContext(IntlayerClientContext);\n const localeTarget = locale ?? currentLocale;\n\n return getTranslation<Content>(multilangContent, localeTarget);\n};\n"],"mappings":";AAIA,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAC/B,SAAS,6BAA6B;AAO/B,MAAM,IAAI,CACf,kBACA,WACG;AACH,QAAM,EAAE,QAAQ,cAAc,IAAI,WAAW,qBAAqB;AAClE,QAAM,eAAe,UAAU;AAE/B,SAAO,eAAwB,kBAAkB,YAAY;AAC/D;","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/useContent.ts"],"sourcesContent":["import type { LanguageContent } from '@intlayer/core';\nimport { useLocaleBase } from './useLocaleBase';\nimport { useTraduction } from './useTraduction';\n\n/**\n * On the client side, hook to get the translation content based on the locale\n */\nexport const useContent = <Content>(\n languageContent: LanguageContent<Content>\n) => {\n const { locale } = useLocaleBase();\n\n const content = useTraduction(languageContent);\n\n return {\n locale,\n content,\n t: useTraduction,\n };\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/useContent.ts"],"sourcesContent":["import type { LanguageContent } from '@intlayer/core';\nimport { useLocaleBase } from './useLocaleBase';\nimport { useTraduction } from './useTraduction';\n\n/**\n * On the client side, hook to get the translation content based on the locale\n */\nexport const useContent = <Content>(\n languageContent: LanguageContent<Content>\n) => {\n const { locale } = useLocaleBase();\n\n const content = useTraduction(languageContent);\n\n return {\n locale,\n content,\n t: useTraduction,\n };\n};\n"],"mappings":"AACA,SAAS,qBAAqB;AAC9B,SAAS,qBAAqB;AAKvB,MAAM,aAAa,CACxB,oBACG;AACH,QAAM,EAAE,OAAO,IAAI,cAAc;AAEjC,QAAM,UAAU,cAAc,eAAe;AAE7C,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACF;","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/useDictionary.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport type { DeclarationContent } from '@intlayer/core';\nimport { useContext } from 'react';\nimport { getDictionary, type UseDictionary } from '../getDictionary';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const useDictionary: UseDictionary = <T extends DeclarationContent>(\n dictionary: T,\n locale?: Locales,\n isRenderEditor = false\n) => {\n const { locale: currentLocale } = useContext(IntlayerClientContext);\n const localeTarget = locale ?? currentLocale;\n\n return getDictionary(dictionary, localeTarget, isRenderEditor);\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/useDictionary.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport type { DeclarationContent } from '@intlayer/core';\nimport { useContext } from 'react';\nimport { getDictionary, type UseDictionary } from '../getDictionary';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the server side, Hook that transform a dictionary and return the content\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const useDictionary: UseDictionary = <T extends DeclarationContent>(\n dictionary: T,\n locale?: Locales,\n isRenderEditor = false\n) => {\n const { locale: currentLocale } = useContext(IntlayerClientContext);\n const localeTarget = locale ?? currentLocale;\n\n return getDictionary(dictionary, localeTarget, isRenderEditor);\n};\n"],"mappings":";AAIA,SAAS,kBAAkB;AAC3B,SAAS,qBAAyC;AAClD,SAAS,6BAA6B;AAO/B,MAAM,gBAA+B,CAC1C,YACA,QACA,iBAAiB,UACd;AACH,QAAM,EAAE,QAAQ,cAAc,IAAI,WAAW,qBAAqB;AAClE,QAAM,eAAe,UAAU;AAE/B,SAAO,cAAc,YAAY,cAAc,cAAc;AAC/D;","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/useIntlayer.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport { useContext } from 'react';\nimport {\n type DictionaryKeys,\n getIntlayer,\n type UseIntlayerEditable,\n} from '../getIntlayer';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the client side, Hook that picking one dictionary by its key and return the content\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const useIntlayer: UseIntlayerEditable = <T extends DictionaryKeys>(\n key: T,\n locale?: Locales,\n isRenderEditor = true\n) => {\n const { locale: currentLocale } = useContext(IntlayerClientContext);\n const localeTarget = locale ?? currentLocale;\n\n return getIntlayer(key, localeTarget, isRenderEditor);\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/useIntlayer.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport { useContext } from 'react';\nimport {\n type DictionaryKeys,\n getIntlayer,\n type UseIntlayerEditable,\n} from '../getIntlayer';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the client side, Hook that picking one dictionary by its key and return the content\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const useIntlayer: UseIntlayerEditable = <T extends DictionaryKeys>(\n key: T,\n locale?: Locales,\n isRenderEditor = true\n) => {\n const { locale: currentLocale } = useContext(IntlayerClientContext);\n const localeTarget = locale ?? currentLocale;\n\n return getIntlayer(key, localeTarget, isRenderEditor);\n};\n"],"mappings":";AAGA,SAAS,kBAAkB;AAC3B;AAAA,EAEE;AAAA,OAEK;AACP,SAAS,6BAA6B;AAO/B,MAAM,cAAmC,CAC9C,KACA,QACA,iBAAiB,SACd;AACH,QAAM,EAAE,QAAQ,cAAc,IAAI,WAAW,qBAAqB;AAClE,QAAM,eAAe,UAAU;AAE/B,SAAO,YAAY,KAAK,cAAc,cAAc;AACtD;","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/useIntlayerAsync.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport { useContext, useEffect, useMemo, useState } from 'react';\nimport {\n DataFromDictionaryKey,\n type DictionaryKeys,\n getIntlayer,\n} from '../getIntlayer';\nimport { getIntlayerAsync } from '../getIntlayerAsync';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\nexport type UseIntlayerAsync = <\n T extends DictionaryKeys,\n L extends Locales,\n R extends boolean = true,\n>(\n key: T,\n locale?: L,\n isRenderEditor?: R\n) => DataFromDictionaryKey<T, L, R> & { isLoading: boolean };\n\n/**\n * On the client side, Hook that picking one dictionary by its key and return the content\n *\n * This hook will prerender the locale dictionary and fetch simultaneously the distant dictionaries to hydrate it.\n *\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const useIntlayerAsync: UseIntlayerAsync = <T extends DictionaryKeys>(\n key: T,\n locale?: Locales,\n isRenderEditor = true\n) => {\n const { locale: currentLocale } = useContext(IntlayerClientContext);\n const localeTarget = locale ?? currentLocale;\n const localeDictionary = getIntlayer(key, localeTarget, isRenderEditor);\n const [distantDictionary, setDistantDictionary] = useState<\n typeof localeDictionary | null | undefined\n >(undefined);\n const [isLoading, setIsLoading] = useState(false);\n\n useEffect(() => {\n setIsLoading(true);\n\n getIntlayerAsync(key)\n .then((distantDictionary) => {\n if (distantDictionary) {\n setDistantDictionary(distantDictionary);\n }\n })\n .finally(() => {\n setIsLoading(false);\n });\n }, []);\n\n const dictionary = useMemo(\n () => distantDictionary ?? localeDictionary,\n [distantDictionary, localeDictionary]\n );\n\n return { ...dictionary, isLoading };\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/useIntlayerAsync.ts"],"sourcesContent":["'use client';\n\nimport type { Locales } from '@intlayer/config/client';\nimport { useContext, useEffect, useMemo, useState } from 'react';\nimport {\n DataFromDictionaryKey,\n type DictionaryKeys,\n getIntlayer,\n} from '../getIntlayer';\nimport { getIntlayerAsync } from '../getIntlayerAsync';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\nexport type UseIntlayerAsync = <\n T extends DictionaryKeys,\n L extends Locales,\n R extends boolean = true,\n>(\n key: T,\n locale?: L,\n isRenderEditor?: R\n) => DataFromDictionaryKey<T, L, R> & { isLoading: boolean };\n\n/**\n * On the client side, Hook that picking one dictionary by its key and return the content\n *\n * This hook will prerender the locale dictionary and fetch simultaneously the distant dictionaries to hydrate it.\n *\n *\n * If the locale is not provided, it will use the locale from the client context\n */\nexport const useIntlayerAsync: UseIntlayerAsync = <T extends DictionaryKeys>(\n key: T,\n locale?: Locales,\n isRenderEditor = true\n) => {\n const { locale: currentLocale } = useContext(IntlayerClientContext);\n const localeTarget = locale ?? currentLocale;\n const localeDictionary = getIntlayer(key, localeTarget, isRenderEditor);\n const [distantDictionary, setDistantDictionary] = useState<\n typeof localeDictionary | null | undefined\n >(undefined);\n const [isLoading, setIsLoading] = useState(false);\n\n useEffect(() => {\n setIsLoading(true);\n\n getIntlayerAsync(key)\n .then((distantDictionary) => {\n if (distantDictionary) {\n setDistantDictionary(distantDictionary);\n }\n })\n .finally(() => {\n setIsLoading(false);\n });\n }, []);\n\n const dictionary = useMemo(\n () => distantDictionary ?? localeDictionary,\n [distantDictionary, localeDictionary]\n );\n\n return { ...dictionary, isLoading };\n};\n"],"mappings":";AAGA,SAAS,YAAY,WAAW,SAAS,gBAAgB;AACzD;AAAA,EAGE;AAAA,OACK;AACP,SAAS,wBAAwB;AACjC,SAAS,6BAA6B;AAoB/B,MAAM,mBAAqC,CAChD,KACA,QACA,iBAAiB,SACd;AACH,QAAM,EAAE,QAAQ,cAAc,IAAI,WAAW,qBAAqB;AAClE,QAAM,eAAe,UAAU;AAC/B,QAAM,mBAAmB,YAAY,KAAK,cAAc,cAAc;AACtE,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAEhD,MAAS;AACX,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,YAAU,MAAM;AACd,iBAAa,IAAI;AAEjB,qBAAiB,GAAG,EACjB,KAAK,CAACA,uBAAsB;AAC3B,UAAIA,oBAAmB;AACrB,6BAAqBA,kBAAiB;AAAA,MACxC;AAAA,IACF,CAAC,EACA,QAAQ,MAAM;AACb,mBAAa,KAAK;AAAA,IACpB,CAAC;AAAA,EACL,GAAG,CAAC,CAAC;AAEL,QAAM,aAAa;AAAA,IACjB,MAAM,qBAAqB;AAAA,IAC3B,CAAC,mBAAmB,gBAAgB;AAAA,EACtC;AAEA,SAAO,EAAE,GAAG,YAAY,UAAU;AACpC;","names":["distantDictionary"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/useLocale.ts"],"sourcesContent":["'use client';\n\nimport { type Locales } from '@intlayer/config';\nimport { getConfiguration } from '@intlayer/config/client';\nimport { localeList } from '@intlayer/core';\nimport { useCallback, useContext } from 'react';\nimport { IntlayerClientContext } from './IntlayerProvider';\nimport { useLocaleCookie } from './useLocaleCookie';\n\ntype useLocaleProps = {\n onLocaleChange?: (locale: Locales) => void;\n};\n\n/**\n * On the client side, hook to get the current locale and all related fields\n */\nexport const useLocale = ({ onLocaleChange }: useLocaleProps = {}) => {\n const {\n /**\n * Prefix default prefix the default locale to the path as other locales.\n *\n * Example with prefixDefault = true and defaultLocale = 'en':\n * path = /en/dashboard or /fr/dashboard\n *\n * Example with prefixDefault = false and defaultLocale = 'en':\n * path = /dashboard or /fr/dashboard\n *\n */\n prefixDefault,\n } = getConfiguration().middleware;\n const { defaultLocale, locales: availableLocales } =\n getConfiguration().internationalization;\n const { locale, setLocale: setLocaleState } = useContext(\n IntlayerClientContext\n );\n const { setLocaleCookie } = useLocaleCookie();\n\n const setLocale = useCallback(\n (locale: Locales) => {\n if (!availableLocales.includes(locale)) {\n console.error(`Locale ${locale} is not available`);\n return;\n }\n\n setLocaleState(locale);\n setLocaleCookie(locale);\n onLocaleChange?.(locale);\n },\n [\n onLocaleChange,\n availableLocales,\n setLocaleState,\n prefixDefault,\n defaultLocale,\n ]\n );\n\n return {\n locale, // Current locale\n defaultLocale, // Principal locale defined in config\n availableLocales, // List of the available locales defined in config\n localeList, // List of all available locales\n setLocale, // Function to set the locale\n };\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/useLocale.ts"],"sourcesContent":["'use client';\n\nimport { type Locales } from '@intlayer/config';\nimport { getConfiguration } from '@intlayer/config/client';\nimport { localeList } from '@intlayer/core';\nimport { useCallback, useContext } from 'react';\nimport { IntlayerClientContext } from './IntlayerProvider';\nimport { useLocaleCookie } from './useLocaleCookie';\n\ntype useLocaleProps = {\n onLocaleChange?: (locale: Locales) => void;\n};\n\n/**\n * On the client side, hook to get the current locale and all related fields\n */\nexport const useLocale = ({ onLocaleChange }: useLocaleProps = {}) => {\n const {\n /**\n * Prefix default prefix the default locale to the path as other locales.\n *\n * Example with prefixDefault = true and defaultLocale = 'en':\n * path = /en/dashboard or /fr/dashboard\n *\n * Example with prefixDefault = false and defaultLocale = 'en':\n * path = /dashboard or /fr/dashboard\n *\n */\n prefixDefault,\n } = getConfiguration().middleware;\n const { defaultLocale, locales: availableLocales } =\n getConfiguration().internationalization;\n const { locale, setLocale: setLocaleState } = useContext(\n IntlayerClientContext\n );\n const { setLocaleCookie } = useLocaleCookie();\n\n const setLocale = useCallback(\n (locale: Locales) => {\n if (!availableLocales.includes(locale)) {\n console.error(`Locale ${locale} is not available`);\n return;\n }\n\n setLocaleState(locale);\n setLocaleCookie(locale);\n onLocaleChange?.(locale);\n },\n [\n onLocaleChange,\n availableLocales,\n setLocaleState,\n prefixDefault,\n defaultLocale,\n ]\n );\n\n return {\n locale, // Current locale\n defaultLocale, // Principal locale defined in config\n availableLocales, // List of the available locales defined in config\n localeList, // List of all available locales\n setLocale, // Function to set the locale\n };\n};\n"],"mappings":";AAGA,SAAS,wBAAwB;AACjC,SAAS,kBAAkB;AAC3B,SAAS,aAAa,kBAAkB;AACxC,SAAS,6BAA6B;AACtC,SAAS,uBAAuB;AASzB,MAAM,YAAY,CAAC,EAAE,eAAe,IAAoB,CAAC,MAAM;AACpE,QAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWJ;AAAA,EACF,IAAI,iBAAiB,EAAE;AACvB,QAAM,EAAE,eAAe,SAAS,iBAAiB,IAC/C,iBAAiB,EAAE;AACrB,QAAM,EAAE,QAAQ,WAAW,eAAe,IAAI;AAAA,IAC5C;AAAA,EACF;AACA,QAAM,EAAE,gBAAgB,IAAI,gBAAgB;AAE5C,QAAM,YAAY;AAAA,IAChB,CAACA,YAAoB;AACnB,UAAI,CAAC,iBAAiB,SAASA,OAAM,GAAG;AACtC,gBAAQ,MAAM,UAAUA,OAAM,mBAAmB;AACjD;AAAA,MACF;AAEA,qBAAeA,OAAM;AACrB,sBAAgBA,OAAM;AACtB,uBAAiBA,OAAM;AAAA,IACzB;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO;AAAA,IACL;AAAA;AAAA,IACA;AAAA;AAAA,IACA;AAAA;AAAA,IACA;AAAA;AAAA,IACA;AAAA;AAAA,EACF;AACF;","names":["locale"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/useLocaleBase.ts"],"sourcesContent":["'use client';\n\nimport { getConfiguration } from '@intlayer/config/client';\nimport { localeList } from '@intlayer/core';\nimport { useContext } from 'react';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\nconst { defaultLocale, locales: availableLocales } =\n getConfiguration().internationalization;\n\n/**\n * On the client side, hook to get the current locale and all related fields\n */\nexport const useLocaleBase = () => {\n const { locale, setLocale } = useContext(IntlayerClientContext);\n\n return {\n locale, // Current locale\n defaultLocale, // Principal locale defined in config\n availableLocales, // List of the available locales defined in config\n localeList, // List of all available locales\n setLocale, // Function to set the locale\n };\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/useLocaleBase.ts"],"sourcesContent":["'use client';\n\nimport { getConfiguration } from '@intlayer/config/client';\nimport { localeList } from '@intlayer/core';\nimport { useContext } from 'react';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\nconst { defaultLocale, locales: availableLocales } =\n getConfiguration().internationalization;\n\n/**\n * On the client side, hook to get the current locale and all related fields\n */\nexport const useLocaleBase = () => {\n const { locale, setLocale } = useContext(IntlayerClientContext);\n\n return {\n locale, // Current locale\n defaultLocale, // Principal locale defined in config\n availableLocales, // List of the available locales defined in config\n localeList, // List of all available locales\n setLocale, // Function to set the locale\n };\n};\n"],"mappings":";AAEA,SAAS,wBAAwB;AACjC,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,6BAA6B;AAEtC,MAAM,EAAE,eAAe,SAAS,iBAAiB,IAC/C,iBAAiB,EAAE;AAKd,MAAM,gBAAgB,MAAM;AACjC,QAAM,EAAE,QAAQ,UAAU,IAAI,WAAW,qBAAqB;AAE9D,SAAO;AAAA,IACL;AAAA;AAAA,IACA;AAAA;AAAA,IACA;AAAA;AAAA,IACA;AAAA;AAAA,IACA;AAAA;AAAA,EACF;AACF;","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/useLocaleCookie.ts"],"sourcesContent":["import { type Locales, getConfiguration } from '@intlayer/config/client';\nimport Cookies from 'js-cookie';\n\nconst { cookieName } = getConfiguration().middleware;\n\nconst cookieAttributes: Cookies.CookieAttributes = {\n path: '/',\n expires: undefined,\n domain: undefined,\n secure: false,\n sameSite: 'strict',\n};\n\n/**\n * Get the locale cookie\n */\nexport const localeCookie = Cookies.get(cookieName) as unknown as\n | Locales\n | undefined;\n\n/**\n * Set the locale cookie\n */\nexport const setLocaleCookie = (locale: Locales) => {\n Cookies.set(cookieName, locale, cookieAttributes);\n};\n\n/**\n * Hook that provides the locale cookie and a function to set it\n */\nexport const useLocaleCookie = () => ({\n localeCookie,\n setLocaleCookie,\n});\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/useLocaleCookie.ts"],"sourcesContent":["import { type Locales, getConfiguration } from '@intlayer/config/client';\nimport Cookies from 'js-cookie';\n\nconst { cookieName } = getConfiguration().middleware;\n\nconst cookieAttributes: Cookies.CookieAttributes = {\n path: '/',\n expires: undefined,\n domain: undefined,\n secure: false,\n sameSite: 'strict',\n};\n\n/**\n * Get the locale cookie\n */\nexport const localeCookie = Cookies.get(cookieName) as unknown as\n | Locales\n | undefined;\n\n/**\n * Set the locale cookie\n */\nexport const setLocaleCookie = (locale: Locales) => {\n Cookies.set(cookieName, locale, cookieAttributes);\n};\n\n/**\n * Hook that provides the locale cookie and a function to set it\n */\nexport const useLocaleCookie = () => ({\n localeCookie,\n setLocaleCookie,\n});\n"],"mappings":"AAAA,SAAuB,wBAAwB;AAC/C,OAAO,aAAa;AAEpB,MAAM,EAAE,WAAW,IAAI,iBAAiB,EAAE;AAE1C,MAAM,mBAA6C;AAAA,EACjD,MAAM;AAAA,EACN,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,UAAU;AACZ;AAKO,MAAM,eAAe,QAAQ,IAAI,UAAU;AAO3C,MAAM,kBAAkB,CAAC,WAAoB;AAClD,UAAQ,IAAI,YAAY,QAAQ,gBAAgB;AAClD;AAKO,MAAM,kBAAkB,OAAO;AAAA,EACpC;AAAA,EACA;AACF;","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/client/useTraduction.ts"],"sourcesContent":["import type { LanguageContent } from '@intlayer/core';\nimport { useContext } from 'react';\nimport { getTranslation } from '../getTranslation';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the client side, Hook that picking one dictionary by its id and return the content.\n *\n * If not locale found, it will return the content related to the default locale.\n *\n * Return either the content editor, or the content itself depending on the configuration.\n *\n * Usage:\n *\n * ```tsx\n * const content = useTraduction<string>({\n * en: 'Hello',\n * fr: 'Bonjour',\n * }, 'fr');\n * // 'Bonjour'\n * ```\n *\n * Using TypeScript:\n * - this function will require each locale to be defined if defined in the project configuration.\n * - If a locale is missing, it will make each existing locale optional and raise an error if the locale is not found.\n */\nexport const useTraduction = <Content = string>(\n languageContent: LanguageContent<Content>\n): Content => {\n const { locale } = useContext(IntlayerClientContext);\n\n return getTranslation(languageContent, locale);\n};\n"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/client/useTraduction.ts"],"sourcesContent":["import type { LanguageContent } from '@intlayer/core';\nimport { useContext } from 'react';\nimport { getTranslation } from '../getTranslation';\nimport { IntlayerClientContext } from './IntlayerProvider';\n\n/**\n * On the client side, Hook that picking one dictionary by its id and return the content.\n *\n * If not locale found, it will return the content related to the default locale.\n *\n * Return either the content editor, or the content itself depending on the configuration.\n *\n * Usage:\n *\n * ```tsx\n * const content = useTraduction<string>({\n * en: 'Hello',\n * fr: 'Bonjour',\n * }, 'fr');\n * // 'Bonjour'\n * ```\n *\n * Using TypeScript:\n * - this function will require each locale to be defined if defined in the project configuration.\n * - If a locale is missing, it will make each existing locale optional and raise an error if the locale is not found.\n */\nexport const useTraduction = <Content = string>(\n languageContent: LanguageContent<Content>\n): Content => {\n const { locale } = useContext(IntlayerClientContext);\n\n return getTranslation(languageContent, locale);\n};\n"],"mappings":"AACA,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAC/B,SAAS,6BAA6B;AAuB/B,MAAM,gBAAgB,CAC3B,oBACY;AACZ,QAAM,EAAE,OAAO,IAAI,WAAW,qBAAqB;AAEnD,SAAO,eAAe,iBAAiB,MAAM;AAC/C;","names":[]}
|