@intlayer/docs 5.7.2-canary.3 → 5.7.3

package/docs/hi/dictionary/gender.md

@@ -0,0 +1,276 @@
+---
+createdAt: 2025-07-27
+updatedAt: 2025-07-27
+title: लिंग-आधारित सामग्री
+description: जानें कि Intlayer में लिंग-आधारित सामग्री का उपयोग कैसे करें ताकि लिंग के आधार पर सामग्री को गतिशील रूप से प्रदर्शित किया जा सके। इस दस्तावेज़ का पालन करें ताकि आप अपने प्रोजेक्ट में लिंग-विशिष्ट सामग्री को प्रभावी ढंग से लागू कर सकें।
+keywords:
+  - लिंग-आधारित सामग्री
+  - गतिशील रेंडरिंग
+  - दस्तावेज़ीकरण
+  - Intlayer
+  - Next.js
+  - JavaScript
+  - React
+slugs:
+  - doc
+  - concept
+  - content
+  - gender
+---
+
+# लिंग-आधारित सामग्री / Intlayer में लिंग
+
+## लिंग कैसे काम करता है
+
+Intlayer में, लिंग-आधारित सामग्री `gender` फ़ंक्शन के माध्यम से प्राप्त की जाती है, जो विशिष्ट लिंग मानों ('male', 'female') को उनके संबंधित सामग्री से मैप करता है। यह तरीका आपको दिए गए लिंग के आधार पर सामग्री को गतिशील रूप से चुनने में सक्षम बनाता है। जब इसे React Intlayer या Next Intlayer के साथ एकीकृत किया जाता है, तो रनटाइम पर प्रदान किए गए लिंग के अनुसार उपयुक्त सामग्री स्वचालित रूप से चुनी जाती है।
+
+## लिंग-आधारित सामग्री सेटअप करना
+
+अपने Intlayer प्रोजेक्ट में लिंग-आधारित सामग्री सेटअप करने के लिए, एक सामग्री मॉड्यूल बनाएं जिसमें आपके लिंग-विशिष्ट परिभाषाएँ शामिल हों। नीचे विभिन्न प्रारूपों में उदाहरण दिए गए हैं।
+
+```typescript fileName="**/*.content.ts" contentDeclarationFormat="typescript"
+import { gender, type Dictionary } from "intlayer";
+
+const myGenderContent = {
+  key: "my_key",
+  content: {
+    myGender: gender({
+      male: "पुरुष उपयोगकर्ताओं के लिए मेरी सामग्री",
+      female: "महिला उपयोगकर्ताओं के लिए मेरी सामग्री",
+      fallback: "जब लिंग निर्दिष्ट नहीं होता है तो मेरी सामग्री", // वैकल्पिक
+    }),
+  },
+} satisfies Dictionary;
+
+export default myGenderContent;
+```
+
+```javascript fileName="**/*.content.mjs" contentDeclarationFormat="esm"
+import { gender } from "intlayer";
+
+/** @type {import('intlayer').Dictionary} */
+const myGenderContent = {
+  key: "my_key",
+  content: {
+    myGender: gender({
+      male: "पुरुष उपयोगकर्ताओं के लिए मेरी सामग्री",
+      female: "महिला उपयोगकर्ताओं के लिए मेरी सामग्री",
+      fallback: "जब लिंग निर्दिष्ट नहीं होता है तो मेरी सामग्री", // वैकल्पिक
+    }),
+  },
+};
+
+export default myGenderContent;
+```
+
+```javascript fileName="**/*.content.cjs" contentDeclarationFormat="commonjs"
+const { gender } = require("intlayer");
+
+/** @type {import('intlayer').Dictionary} */
+const myGenderContent = {
+  key: "my_key",
+  content: {
+    myGender: gender({
+      male: "पुरुष उपयोगकर्ताओं के लिए मेरी सामग्री",
+      female: "महिला उपयोगकर्ताओं के लिए मेरी सामग्री",
+      fallback: "जब लिंग निर्दिष्ट नहीं होता है तो मेरी सामग्री", // वैकल्पिक
+    }),
+  },
+};
+
+module.exports = myGenderContent;
+```
+
+```json5 fileName="**/*.content.json" contentDeclarationFormat="json"
+{
+  "$schema": "https://intlayer.org/schema.json",
+  "key": "my_key",
+  "content": {
+    "myGender": {
+      "nodeType": "gender",
+      "gender": {
+        "male": "पुरुष उपयोगकर्ताओं के लिए मेरी सामग्री",
+        "female": "महिला उपयोगकर्ताओं के लिए मेरी सामग्री",
+        "fallback": "जब लिंग निर्दिष्ट नहीं होता है तो मेरी सामग्री", // वैकल्पिक
+      },
+    },
+  },
+}
+```
+
+> यदि कोई फॉलबैक घोषित नहीं किया गया है, तो अंतिम घोषित कुंजी को फॉलबैक के रूप में लिया जाएगा यदि लिंग निर्दिष्ट नहीं है या किसी परिभाषित लिंग से मेल नहीं खाता है।
+
+## React Intlayer के साथ लिंग-आधारित सामग्री का उपयोग करना
+
+React घटक के भीतर लिंग-आधारित सामग्री का उपयोग करने के लिए, `react-intlayer` पैकेज से `useIntlayer` हुक को आयात करें और उपयोग करें। यह हुक निर्दिष्ट कुंजी के लिए सामग्री प्राप्त करता है और आपको उपयुक्त आउटपुट चुनने के लिए लिंग पास करने की अनुमति देता है।
+
+```tsx fileName="**/*.tsx" codeFormat="typescript"
+import type { FC } from "react";
+import { useIntlayer } from "react-intlayer";
+
+const GenderComponent: FC = () => {
+  const { myGender } = useIntlayer("my_key");
+
+  return (
+    <div>
+      <p>
+        {
+          /* आउटपुट: पुरुष उपयोगकर्ताओं के लिए मेरी सामग्री */
+          myGender("male")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: मेरे महिला उपयोगकर्ताओं के लिए सामग्री */
+          myGender("female")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: मेरे पुरुष उपयोगकर्ताओं के लिए सामग्री */
+          myGender("m")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: मेरे महिला उपयोगकर्ताओं के लिए सामग्री */
+          myGender("f")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: जब लिंग निर्दिष्ट नहीं होता है तब मेरी सामग्री */
+          myGender("")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: जब लिंग निर्दिष्ट नहीं होता है तब मेरी सामग्री */
+          myGender(undefined)
+        }
+      </p>
+    </div>
+  );
+};
+
+export default GenderComponent;
+```
+
+```javascript fileName="**/*.mjx" codeFormat="esm"
+import { useIntlayer } from "react-intlayer";
+
+const GenderComponent = () => {
+  const { myGender } = useIntlayer("my_key");
+
+  return (
+    <div>
+      <p>
+        {
+          /* आउटपुट: मेरे पुरुष उपयोगकर्ताओं के लिए सामग्री */
+          myGender("male")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: मेरे महिला उपयोगकर्ताओं के लिए सामग्री */
+          myGender("female")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: मेरे पुरुष उपयोगकर्ताओं के लिए सामग्री */
+          myGender("m")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: मेरे महिला उपयोगकर्ताओं के लिए सामग्री */
+          myGender("f")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: जब लिंग निर्दिष्ट नहीं होता है तब मेरी सामग्री */
+          myGender("")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: जब लिंग निर्दिष्ट नहीं होता है तब मेरी सामग्री */
+          /* आउटपुट: मेरे पुरुष उपयोगकर्ताओं के लिए सामग्री */
+          myGender(undefined)
+        }
+      </p>
+    </div>
+  );
+};
+
+export default GenderComponent;
+```
+
+```javascript fileName="**/*.cjs" codeFormat="commonjs"
+const { useIntlayer } = require("react-intlayer");
+
+const GenderComponent = () => {
+  const { myGender } = useIntlayer("my_key");
+
+  return (
+    <div>
+      <p>
+        {
+          /* आउटपुट: मेरे पुरुष उपयोगकर्ताओं के लिए सामग्री */
+          myGender("male")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: मेरी महिला उपयोगकर्ताओं के लिए सामग्री */
+          myGender("female")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: मेरे पुरुष उपयोगकर्ताओं के लिए सामग्री */
+          myGender("m")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: मेरी महिला उपयोगकर्ताओं के लिए सामग्री */
+          myGender("f")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: जब लिंग निर्दिष्ट नहीं किया गया हो तो मेरी सामग्री */
+          myGender("")
+        }
+      </p>
+      <p>
+        {
+          /* आउटपुट: जब लिंग निर्दिष्ट नहीं किया गया हो तो मेरी सामग्री */
+          myGender(undefined)
+        }
+      </p>
+    </div>
+  );
+};
+
+module.exports = GenderComponent;
+```
+
+## अतिरिक्त संसाधन
+
+कॉन्फ़िगरेशन और उपयोग के बारे में अधिक विस्तृत जानकारी के लिए, निम्नलिखित संसाधनों को देखें:
+
+- [Intlayer CLI दस्तावेज़](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/intlayer_cli.md)
+- [React Intlayer दस्तावेज़](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/intlayer_with_create_react_app.md)
+- [Next Intlayer दस्तावेज़](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/intlayer_with_nextjs_15.md)
+
+ये संसाधन विभिन्न वातावरणों और फ्रेमवर्क्स में Intlayer की सेटअप और उपयोग के बारे में और अधिक जानकारी प्रदान करते हैं।
+
+## दस्तावेज़ इतिहास
+
+| संस्करण | तिथि       | परिवर्तन                      |
+| ------- | ---------- | ----------------------------- |
+| 5.7.2   | 2025-07-27 | लिंग आधारित सामग्री पेश की गई |

package/docs/hi/how_works_intlayer.md

@@ -93,7 +93,7 @@ Intlayer एक दृश्य संपादक भी प्रदान क
 
 - सर्वर एक सरल Express एप्लिकेशन है जो क्लाइंट से अनुरोध सुनता है और आपकी एप्लिकेशन की सामग्री, जैसे कि `dictionaries` और कॉन्फ़िगरेशन, को पुनः प्राप्त करता है ताकि इसे क्लाइंट साइड पर सुलभ बनाया जा सके।
 - दूसरी ओर, क्लाइंट एक React एप्लिकेशन है जिसका उपयोग दृश्य इंटरफ़ेस के माध्यम से आपकी सामग्री के साथ इंटरैक्ट करने के लिए किया जाता है।
-  जब आप `useIntlayer` का उपयोग करके अपनी सामग्री को कॉल करते हैं और संपादक सक्षम होता है, तो यह स्वचालित रूप से आपकी स्ट्रिंग्स को `IntlayerNode` नामक एक Proxy ऑब्जेक्ट के साथ लपेट देता है। यह नोड `window.sendMessage` का उपयोग करता है ताकि एक रैप्ड iframe के साथ संवाद किया जा सके जिसमें विज़ुअल एडिटर इंटरफ़ेस होता है।  
+  जब आप `useIntlayer` का उपयोग करके अपनी सामग्री को कॉल करते हैं और संपादक सक्षम होता है, तो यह स्वचालित रूप से आपकी स्ट्रिंग्स को `IntlayerNode` नामक एक Proxy ऑब्जेक्ट के साथ लपेट देता है। यह नोड `window.postMessage` का उपयोग करता है ताकि एक रैप्ड iframe के साथ संवाद किया जा सके जिसमें विज़ुअल एडिटर इंटरफ़ेस होता है।  
   संपादक की ओर, संपादक इन संदेशों को सुनता है और आपकी सामग्री के साथ वास्तविक इंटरैक्शन का अनुकरण करता है, जिससे आप सीधे अपने एप्लिकेशन के संदर्भ में टेक्स्ट संपादित कर सकते हैं।
 
 ## ऐप निर्माण अनुकूलन

package/docs/hi/locale_mapper.md

@@ -0,0 +1,244 @@
+---
+createdAt: 2025-07-27
+updatedAt: 2025-07-27
+title: लोकल मैपर
+description: जानें कि लोकल मैपर कैसे काम करता है। अपने एप्लिकेशन में लोकल मैपर द्वारा उपयोग किए गए चरण देखें। जानें कि विभिन्न पैकेज क्या करते हैं।
+keywords:
+  - लोकल मैपर
+  - शुरू करें
+  - इंटलेयर
+  - एप्लिकेशन
+  - पैकेज
+slugs:
+  - doc
+  - locale-mapper
+---
+
+# लोकल मैपर
+
+लोकल मैपर एक शक्तिशाली उपकरण है जो आपके इंटलेयर एप्लिकेशन में अंतरराष्ट्रीयकरण डेटा के साथ काम करने में मदद करता है। यह लोकल-विशिष्ट डेटा को परिवर्तित और व्यवस्थित करने के लिए तीन मुख्य फ़ंक्शन प्रदान करता है: `localeMap`, `localeFlatMap`, और `localeRecord`।
+
+## लोकल मैपर कैसे काम करता है
+
+लोकल मैपर एक `LocaleData` ऑब्जेक्ट पर काम करता है जिसमें किसी लोकल के बारे में सभी आवश्यक जानकारी होती है:
+
+```typescript
+type LocaleData = {
+  locale: LocalesValues; // वर्तमान लोकल कोड (जैसे, 'en', 'fr')
+  defaultLocale: LocalesValues; // डिफ़ॉल्ट लोकल कोड
+  isDefault: boolean; // क्या यह डिफ़ॉल्ट लोकल है
+  locales: LocalesValues[]; // सभी उपलब्ध लोकल्स की सूची
+  urlPrefix: string; // इस लोकल के लिए URL उपसर्ग (जैसे, '/fr' या '')
+};
+```
+
+मैपर फ़ंक्शन आपके कॉन्फ़िगरेशन में प्रत्येक लोकल के लिए यह डेटा स्वचालित रूप से उत्पन्न करते हैं, निम्न बातों को ध्यान में रखते हुए:
+
+- आपके कॉन्फ़िगर किए गए लोकल्स की सूची
+- डिफ़ॉल्ट लोकल सेटिंग
+- क्या डिफ़ॉल्ट लोकल को URL में उपसर्गित किया जाना चाहिए
+
+## मुख्य फ़ंक्शन
+
+### `localeMap`
+
+एक मैपर फ़ंक्शन का उपयोग करके प्रत्येक लोकल को एक एकल ऑब्जेक्ट में परिवर्तित करता है।
+
+```typescript
+localeMap<T>(
+  mapper: (locale: LocaleData) => T,
+  locales?: LocalesValues[],
+  defaultLocale?: LocalesValues,
+  prefixDefault?: boolean
+): T[]
+```
+
+**उदाहरण: रूट ऑब्जेक्ट्स बनाना**
+
+```typescript
+import { localeMap } from "intlayer";
+
+const routes = localeMap((localizedData) => ({
+  path: localizedData.urlPrefix,
+  name: localizedData.locale,
+  isDefault: localizedData.isDefault,
+  locales: localizedData.locales,
+  defaultLocale: localizedData.defaultLocale,
+}));
+
+// परिणाम:
+// [
+//   { path: '/', name: 'en', isDefault: true, locales: ['en', 'fr', 'es'], defaultLocale: 'en' },
+//   { path: '/fr', name: 'fr', isDefault: false, locales: ['en', 'fr', 'es'], defaultLocale: 'en' },
+//   { path: '/es', name: 'es', isDefault: false, locales: ['en', 'fr', 'es'], defaultLocale: 'en' }
+// ]
+```
+
+### `localeFlatMap`
+
+`localeMap` के समान, लेकिन मैपर फ़ंक्शन ऑब्जेक्ट्स की एक सरणी लौटाता है जिसे एक एकल सरणी में समतल किया जाता है।
+
+```typescript
+localeFlatMap<T>(
+  mapper: (locale: LocaleData) => T[],
+  locales?: LocalesValues[],
+  defaultLocale?: LocalesValues,
+  prefixDefault?: boolean
+): T[]
+```
+
+**उदाहरण: प्रत्येक लोकल के लिए कई रूट बनाना**
+
+```typescript
+import { localeFlatMap } from "intlayer";
+
+const routes = localeFlatMap((localizedData) => [
+  {
+    path: localizedData.urlPrefix,
+    name: localizedData.locale,
+    isDefault: localizedData.isDefault,
+  },
+  {
+    path: `${localizedData.urlPrefix}/about`,
+    name: `${localizedData.locale}-about`,
+    isDefault: localizedData.isDefault,
+  },
+]);
+
+// परिणाम:
+// [
+//   { path: '/', name: 'en', isDefault: true },
+//   { path: '/about', name: 'en-about', isDefault: true },
+//   { path: '/fr', name: 'fr', isDefault: false },
+//   { path: '/fr/about', name: 'fr-about', isDefault: false },
+//   { path: '/es', name: 'es', isDefault: false },
+//   { path: '/es/about', name: 'es-about', isDefault: false }
+// ]
+```
+
+### `localeRecord`
+
+एक रिकॉर्ड ऑब्जेक्ट बनाता है जहाँ प्रत्येक लोकल एक कुंजी होती है जो मैपर फ़ंक्शन द्वारा परिवर्तित मान से मैप होती है।
+
+```typescript
+localeRecord<T>(
+  mapper: (locale: LocaleData) => T,
+  locales?: Locales[],
+  defaultLocale?: Locales,
+  prefixDefault?: boolean
+): Record<Locales, T>
+```
+
+**उदाहरण: अनुवाद फ़ाइलें लोड करना**
+
+```typescript
+import { localeRecord } from "intlayer";
+
+const translations = localeRecord(({ locale }) =>
+  require(`./translations/${locale}.json`)
+);
+
+// परिणाम:
+// {
+//   en: { welcome: 'स्वागत है', hello: 'नमस्ते' },
+//   fr: { welcome: 'Bienvenue', hello: 'Bonjour' },
+//   es: { welcome: 'Bienvenido', hello: 'Hola' }
+// }
+```
+
+## लोकल मैपर सेट करना
+
+लोकल मैपर स्वचालित रूप से आपके Intlayer कॉन्फ़िगरेशन का उपयोग करता है, लेकिन आप पैरामीटर पास करके डिफ़ॉल्ट सेटिंग्स को ओवरराइड कर सकते हैं:
+
+### डिफ़ॉल्ट कॉन्फ़िगरेशन का उपयोग करना
+
+```typescript
+import { localeMap } from "intlayer";
+
+// intlayer.config.ts से कॉन्फ़िगरेशन का उपयोग करता है
+const routes = localeMap((data) => ({
+  path: data.urlPrefix,
+  locale: data.locale,
+}));
+```
+
+### कॉन्फ़िगरेशन ओवरराइड करना
+
+```typescript
+import { localeMap } from "intlayer";
+
+// लोकल और डिफ़ॉल्ट लोकल को ओवरराइड करें
+const customRoutes = localeMap(
+  (data) => ({ path: data.urlPrefix, locale: data.locale }),
+  ["en", "fr", "de"], // कस्टम लोकल
+  "en", // कस्टम डिफ़ॉल्ट लोकल
+  true // URLs में डिफ़ॉल्ट लोकल का प्रीफिक्स जोड़ें
+);
+```
+
+## उन्नत उपयोग के उदाहरण
+
+### नेविगेशन मेनू बनाना
+
+```typescript
+import { localeMap } from "intlayer";
+
+const navigationItems = localeMap((data) => ({
+  label: data.locale.toUpperCase(),
+  href: data.urlPrefix || "/",
+  isActive: data.isDefault,
+  flag: `/flags/${data.locale}.svg`,
+}));
+```
+
+### साइटमैप डेटा जनरेट करना
+
+```typescript
+import { localeFlatMap } from "intlayer";
+
+const sitemapUrls = localeFlatMap((data) => [
+  {
+    url: `${data.urlPrefix}/`,
+    lastmod: new Date().toISOString(),
+    changefreq: "daily",
+    priority: data.isDefault ? 1.0 : 0.8,
+  },
+  {
+    url: `${data.urlPrefix}/about`,
+    lastmod: new Date().toISOString(),
+    changefreq: "मासिक",
+    priority: data.isDefault ? 0.8 : 0.6,
+  },
+]);
+```
+
+### डायनेमिक अनुवाद लोडिंग
+
+```typescript
+import { localeRecord } from "intlayer";
+
+const translationModules = localeRecord(({ locale }) => ({
+  messages: import(`./locales/${locale}/messages.json`),
+  validation: import(`./locales/${locale}/validation.json`),
+  metadata: {
+    locale,
+    direction: ["ar", "he", "fa"].includes(locale) ? "rtl" : "ltr",
+  },
+}));
+```
+
+## कॉन्फ़िगरेशन एकीकरण
+
+Locale Mapper आपके Intlayer कॉन्फ़िगरेशन के साथ सहजता से एकीकृत होता है:
+
+- **लोकल**: स्वचालित रूप से `configuration.internationalization.locales` का उपयोग करता है
+- **डिफ़ॉल्ट लोकल**: `configuration.internationalization.defaultLocale` का उपयोग करता है
+- **URL प्रीफिक्सिंग**: `configuration.middleware.prefixDefault` का सम्मान करता है
+
+यह आपके एप्लिकेशन में स्थिरता सुनिश्चित करता है और कॉन्फ़िगरेशन की पुनरावृत्ति को कम करता है।
+
+## दस्तावेज़ इतिहास
+
+| संस्करण | तिथि       | परिवर्तन                   |
+| ------- | ---------- | -------------------------- |
+| 5.7.2   | 2025-07-27 | लोकल मैपर दस्तावेज़ जोड़ें |