@intlayer/docs 8.12.5-canary.0 → 9.0.0-canary.3

package/docs/tr/configuration.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-08-13
-updatedAt: 2026-05-12
+updatedAt: 2026-06-17
 title: Yapılandırma (Configuration)
 description: Uygulamanız için Intlayer'ı nasıl yapılandıracağınızı öğrenin. Intlayer'ı ihtiyaçlarınıza göre özelleştirmek için çeşitli ayarları ve seçenekleri anlayın.
 keywords:
@@ -14,6 +14,9 @@ slugs:
   - concept
   - configuration
 history:
+  - version: 8.10.0
+    date: 2026-06-17
+    changes: "Sözlük yapılandırmasına `format` seçeneği eklendi"
   - version: 8.9.4
     date: 2026-05-12
     changes: "LM Studio sağlayıcısı için destek eklendi"
@@ -135,6 +138,7 @@ Intlayer, JSON, JS, MJS ve TS yapılandırma dosyası formatlarını kabul eder:
 ````typescript fileName="intlayer.config.ts" codeFormat="typescript"
 import { Locales, type IntlayerConfig } from "intlayer";
 import { nextjsRewrite } from "intlayer/routing";
+import { syncJSON } from "@intlayer/sync-json-plugin";
 import { z } from "zod";
 
 /**
@@ -582,10 +586,38 @@ const config: IntlayerConfig = {
     }),
   },
 
+  /**
+   * Sözlük yapılandırması.
+   */
+  dictionary: {
+    /**
+     * Sözlüklerin nasıl içe aktarıldığını kontrol eder.
+     * - "static": Derleme zamanında statik olarak içe aktarılır.
+     * - "dynamic": Suspense kullanılarak dinamik olarak içe aktarılır.
+     * - "fetch": Canlı senkronizasyon API'si aracılığıyla dinamik olarak alınır.
+     */
+    importMode: "static",
+
+    /**
+     * Projedeki tüm sözlükler için varsayılan mesaj biçimi.
+     * - 'intlayer': Yerel intlayer biçimi (varsayılan).
+     * - 'icu': ICU mesaj biçimi.
+     * - 'i18next': i18next biçimi.
+     * - 'vue-i18n': Vue I18n biçimi.
+     * - 'po': GNU Gettext PO biçimi.
+     */
+    format: "icu",
+  },
+
   /**
    * Eklenti yapılandırması.
    */
-  plugins: [],
+  plugins: [
+    syncJSON({
+      format: "icu",
+      source: ({ locale }) => `./messages/${locale}.json`,
+    }),
+  ],
 };
 
 export default config;
@@ -862,6 +894,7 @@ Otomatik doldurma davranışı ve içerik oluşturma dahil olmak üzere sözlük
 | `contentAutoTransformation` | İçerik dizelerini otomatik olarak tiplendirilmiş düğümlere (markdown, HTML veya ekleme) dönüştürür.                                                                         | `boolean` &#124; <br/> `{ markdown?: boolean; html?: boolean; insertion?: boolean }`                            | `false`              | `true`                                                                                      | • Markdown : `### Title` → `md('### Title')`.<br/>• HTML : `<div>Title</div>` → `html('<div>Title</div>')`.<br/>• Ekleme : `Merhaba {{name}}` → `insert('Merhaba {{name}}')`.                                                                                                                                                                                                                                                          |
 | `location`                  | Sözlük dosyalarının nerede saklandığını ve CMS ile nasıl senkronize edildiğini belirtir.                                                                                    | `'local'` &#124; <br/> `'remote'` &#124; <br/> `'hybrid'` &#124; <br/> `'plugin'` &#124; <br/> `string`         | `'local'`            | `'hybrid'`                                                                                  | • `'local'`: sadece yerel olarak yönetilir.<br/>• `'remote'`: sadece uzaktan yönetilir (CMS).<br/>• `'hybrid'`: hem yerel hem de uzaktan yönetilir.<br/>• `'plugin'` veya özel dize: bir eklenti veya özel bir kaynak tarafından yönetilir.                                                                                                                                                                                            |
 | `importMode`                | Sözlüklerin nasıl içe aktarılacağını kontrol eder.                                                                                                                          | `'static'` &#124; <br/> `'dynamic'` &#124; <br/> `'fetch'`                                                      | `'static'`           | `'dynamic'`                                                                                 | • `'static'`: statik olarak içe aktarılır.<br/>• `'dynamic'`: Suspense kullanılarak dinamik olarak içe aktarılır.<br/>• `'fetch'`: Live Sync API aracılığıyla getirilir; başarısız olursa `'dynamic'`e geri döner.<br/>• `@intlayer/babel` ve `@intlayer/swc` eklentilerini gerektirir.<br/>• Anahtarlar statik olarak bildirilmelidir.<br/>• `optimize` kapalıysa yok sayılır.<br/>• `getIntlayer`, `getDictionary` vb.'ni etkilemez. |
+| `format`                    | Projedeki tüm sözlükler için varsayılan mesaj biçimi.                                                                                                                       | `'intlayer'` &#124; <br/> `'icu'` &#124; <br/> `'i18next'` &#124; <br/> `'vue-i18n'` &#124; <br/> `'po'`        | `'intlayer'`         | `'icu'`                                                                                     | • `'intlayer'`: Yerel intlayer biçimi.<br/>• `'icu'`: ICU mesaj biçimi.<br/>• `'i18next'`: i18next biçimi.<br/>• `'vue-i18n'`: Vue I18n biçimi.<br/>• `'po'`: GNU Gettext PO biçimi.                                                                                                                                                                                                                                                   |
 | `priority`                  | Sözlüğün önceliği. Sözlükler arasındaki çatışmaları çözerken yüksek değerler düşük değerleri yener.                                                                         | `number`                                                                                                        | `undefined`          | `1`                                                                                         |                                                                                                                                                                                                                                                                                                                                                                                                                                        |
 | `live`                      | Kullanımdan kaldırıldı - bunun yerine `importMode: 'fetch'` kullanın. Sözlük içeriğinin Live Sync API aracılığıyla dinamik olarak getirilip getirilmeyeceğini belirtiyordu. | `boolean`                                                                                                       | `undefined`          |                                                                                             | v8.0.0'da `importMode: 'fetch'` olarak yeniden adlandırıldı.                                                                                                                                                                                                                                                                                                                                                                           |
 | `schema`                    | JSON şema doğrulaması için Intlayer tarafından otomatik olarak oluşturulur.                                                                                                 | `'https://intlayer.org/schema.json'`                                                                            | otomatik oluşturulur |                                                                                             | Manuel olarak düzenlemeyin.                                                                                                                                                                                                                                                                                                                                                                                                            |

package/docs/tr/dictionary/condition.md

@@ -71,7 +71,10 @@ export default myConditionalContent;
 
 ## React Intlayer ile Koşullu İçeriği Kullanma
 
-Bir React bileşeninde koşullu içeriği kullanmak için, `react-intlayer` paketinden `useIntlayer` hook'unu içe aktarın ve kullanın. Bu hook, belirtilen anahtar için içeriği getirir ve uygun çıktıyı seçmek için bir koşul geçmenizi sağlar.
+<Tabs group="framework">
+  <Tab label="React" value="react">
+
+To utilize conditional content within a React component, import and use the `useIntlayer` hook from the `react-intlayer` package. This hook fetches the content for the specified key and allows you to pass in a condition to select the appropriate output.
 
 ```tsx fileName="**/*.tsx" codeFormat={["typescript", "esm"]}
 import type { FC } from "react";
@@ -84,25 +87,25 @@ const ConditionalComponent: FC = () => {
     <div>
       <p>
         {
-          /* Çıktı: doğru olduğunda içeriğim */
+          /* Output: my content when it's true */
           myCondition(true)
         }
       </p>
       <p>
         {
-          /* Çıktı: yanlış olduğunda içeriğim */
+          /* Output: my content when it's false */
           myCondition(false)
         }
       </p>
       <p>
         {
-          /* Çıktı: koşul başarısız olduğunda içeriğim */
+          /* Output: my content when the condition fails */
           myCondition("")
         }
       </p>
       <p>
         {
-          /* Çıktı: koşul başarısız olduğunda içeriğim */
+          /* Output: my content when the condition fails */
           myCondition(undefined)
         }
       </p>
@@ -113,6 +116,165 @@ const ConditionalComponent: FC = () => {
 export default ConditionalComponent;
 ```
 
+  </Tab>
+  <Tab label="Next.js" value="nextjs">
+
+To utilize conditional content in Next.js Client Components, retrieve it via the `useIntlayer` hook. Here's an example:
+
+```tsx fileName="**/*.tsx" codeFormat={["typescript", "esm"]}
+"use client";
+
+import type { FC } from "react";
+import { useIntlayer } from "next-intlayer";
+
+const ConditionalComponent: FC = () => {
+  const { myCondition } = useIntlayer("my_key");
+
+  return (
+    <div>
+      <p>{myCondition(true)}</p>
+      <p>{myCondition(false)}</p>
+    </div>
+  );
+};
+
+export default ConditionalComponent;
+```
+
+  </Tab>
+  <Tab label="Vue" value="vue">
+
+To utilize conditional content in Vue components, retrieve it via the `useIntlayer` hook. Here's an example:
+
+```vue fileName="**/*.vue"
+<script setup lang="ts">
+import { useIntlayer } from "vue-intlayer";
+
+const { myCondition } = useIntlayer("my_key");
+</script>
+
+<template>
+  <div>
+    <p>{{ myCondition(true) }}</p>
+    <p>{{ myCondition(false) }}</p>
+  </div>
+</template>
+```
+
+  </Tab>
+  <Tab label="Svelte" value="svelte">
+
+To utilize conditional content in Svelte components, retrieve it via the `useIntlayer` hook. The store is accessed with `$`. Here's an example:
+
+```svelte fileName="**/*.svelte"
+<script lang="ts">
+import { useIntlayer } from "svelte-intlayer";
+
+const content = useIntlayer("my_key");
+</script>
+
+<div>
+  <p>{$content.myCondition(true)}</p>
+  <p>{$content.myCondition(false)}</p>
+</div>
+```
+
+  </Tab>
+  <Tab label="Preact" value="preact">
+
+To utilize conditional content in Preact components, retrieve it via the `useIntlayer` hook. Here's an example:
+
+```tsx fileName="**/*.tsx" codeFormat={["typescript", "esm"]}
+import type { FC } from "preact";
+import { useIntlayer } from "preact-intlayer";
+
+const ConditionalComponent: FC = () => {
+  const { myCondition } = useIntlayer("my_key");
+
+  return (
+    <div>
+      <p>{myCondition(true)}</p>
+      <p>{myCondition(false)}</p>
+    </div>
+  );
+};
+
+export default ConditionalComponent;
+```
+
+  </Tab>
+  <Tab label="Solid" value="solid">
+
+To utilize conditional content in SolidJS components, retrieve it via the `useIntlayer` hook. Here's an example:
+
+```tsx fileName="**/*.tsx" codeFormat={["typescript", "esm"]}
+import type { Component } from "solid-js";
+import { useIntlayer } from "solid-intlayer";
+
+const ConditionalComponent: Component = () => {
+  const { myCondition } = useIntlayer("my_key");
+
+  return (
+    <div>
+      <p>{myCondition(true)}</p>
+      <p>{myCondition(false)}</p>
+    </div>
+  );
+};
+
+export default ConditionalComponent;
+```
+
+  </Tab>
+  <Tab label="Angular" value="angular">
+
+To utilize conditional content in Angular components, retrieve it via the `useIntlayer` hook. Here's an example:
+
+```typescript fileName="app.component.ts" codeFormat="typescript"
+import { Component } from "@angular/core";
+import { useIntlayer } from "angular-intlayer";
+
+@Component({
+  selector: "app-conditional",
+  template: `
+    <div>
+      <p>{{ content().myCondition(true) }}</p>
+      <p>{{ content().myCondition(false) }}</p>
+    </div>
+  `,
+})
+export class ConditionalComponent {
+  content = useIntlayer("my_key");
+}
+```
+
+  </Tab>
+  <Tab label="Vanilla JS" value="vanilla">
+
+To utilize conditional content with `vanilla-intlayer`, retrieve it via the `useIntlayer` hook. Here's an example:
+
+```typescript fileName="**/*.ts" codeFormat={["typescript", "esm"]}
+import { installIntlayer, useIntlayer } from "vanilla-intlayer";
+
+installIntlayer();
+
+const content = useIntlayer("my_key").onChange((newContent) => {
+  document.getElementById("true-content")!.textContent =
+    newContent.myCondition(true);
+  document.getElementById("false-content")!.textContent =
+    newContent.myCondition(false);
+});
+
+// Initial render
+document.getElementById("true-content")!.textContent =
+  content.myCondition(true);
+document.getElementById("false-content")!.textContent =
+  content.myCondition(false);
+```
+
+  </Tab>
+</Tabs>
+
 ## Ek Kaynaklar
 
 Yapılandırma ve kullanım hakkında daha detaylı bilgi için aşağıdaki kaynaklara başvurun: