@intlayer/docs 9.0.0-canary.3 → 9.0.0-canary.5

package/docs/vi/packages/react-intlayer/exports.md

@@ -14,6 +14,9 @@ slugs:
   - react-intlayer
   - exports
 history:
+  - version: 10.0.0
+    date: 2026-06-23
+    changes: "Thêm tiện ích usePathname"
   - version: 7.5.14
     date: 2026-01-21
     changes: "Hợp nhất tài liệu cho tất cả các exports"
@@ -54,22 +57,23 @@ Nhập:
 import "react-intlayer";
 ```
 
-| Hook                   | Mô tả                                                                                                                          | Tài liệu liên quan                                                                                                      |
-| ---------------------- | ------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------- |
-| `useIntlayer`          | Hook phía client chọn một dictionary theo khóa và trả về nội dung của nó. Sử dụng locale từ context nếu không được cung cấp.   | [useIntlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useIntlayer.md)     |
-| `useDictionary`        | Hook chuyển đổi một đối tượng dictionary và trả về nội dung cho locale hiện tại. Xử lý các bản dịch `t()`, enumerations, v.v.  | [useDictionary](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useDictionary.md) |
-| `useDictionaryAsync`   | Hook xử lý các dictionary bất đồng bộ. Chấp nhận một map dictionary dựa trên Promise và giải quyết nó cho locale hiện tại.     | -                                                                                                                       |
-| `useDictionaryDynamic` | Hook xử lý các từ điển động được tải theo khóa. Sử dụng React Suspense nội bộ để xử lý trạng thái tải.                         | -                                                                                                                       |
-| `useLocale`            | Hook phía client để lấy locale hiện tại, default locale, các locale khả dụng, và một hàm để cập nhật locale.                   | [useLocale](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useLocale.md)         |
-| `useLocaleBase`        | Hook để lấy locale hiện tại và tất cả các trường liên quan (locale, defaultLocale, availableLocales, setLocale) từ context.    | -                                                                                                                       |
-| `useRewriteURL`        | Hook phía client để quản lý việc rewrite URL. Nếu tồn tại quy tắc rewrite cho pathname và locale hiện tại, nó sẽ cập nhật URL. | [useRewriteURL](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useRewriteURL.md) |
-| `useI18n`              | Hook cung cấp một hàm dịch `t()` để truy cập nội dung lồng nhau theo khóa. Bắt chước mẫu i18next/next-intl.                    | [useI18n](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useI18n.md)             |
-| `useIntl`              | Hook cung cấp một đối tượng `Intl` liên kết với locale. Tự động chèn locale hiện tại và sử dụng bộ nhớ đệm tối ưu.             | -                                                                                                                       |
-| `useLocaleStorage`     | Hook cung cấp khả năng lưu trữ locale trong localStorage hoặc cookies. Trả về các hàm getter và setter.                        | -                                                                                                                       |
-| `useLocaleCookie`      | Không còn được khuyến nghị (Deprecated). Sử dụng `useLocaleStorage` thay thế. Hook quản lý việc lưu trữ locale trong cookies.  | -                                                                                                                       |
-| `useLoadDynamic`       | Hook để tải các từ điển động sử dụng React Suspense. Nhận một key và một Promise, lưu kết quả vào cache.                       | -                                                                                                                       |
-| `useIntlayerContext`   | Hook cung cấp các giá trị context hiện tại của client Intlayer (locale, setLocale, v.v.).                                      | -                                                                                                                       |
-| `useHTMLContext`       | Hook để truy cập các override (ghi đè) của component HTML từ context HTMLProvider.                                             | -                                                                                                                       |
+| Hook                   | Mô tả                                                                                                                                       | Tài liệu liên quan                                                                                                      |
+| ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------- |
+| `useIntlayer`          | Hook phía client chọn một dictionary theo khóa và trả về nội dung của nó. Sử dụng locale từ context nếu không được cung cấp.                | [useIntlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useIntlayer.md)     |
+| `useDictionary`        | Hook chuyển đổi một đối tượng dictionary và trả về nội dung cho locale hiện tại. Xử lý các bản dịch `t()`, enumerations, v.v.               | [useDictionary](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useDictionary.md) |
+| `useDictionaryAsync`   | Hook xử lý các dictionary bất đồng bộ. Chấp nhận một map dictionary dựa trên Promise và giải quyết nó cho locale hiện tại.                  | -                                                                                                                       |
+| `useDictionaryDynamic` | Hook xử lý các từ điển động được tải theo khóa. Sử dụng React Suspense nội bộ để xử lý trạng thái tải.                                      | -                                                                                                                       |
+| `useLocale`            | Hook phía client để lấy locale hiện tại, default locale, các locale khả dụng, và một hàm để cập nhật locale.                                | [useLocale](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useLocale.md)         |
+| `useLocaleBase`        | Hook để lấy locale hiện tại và tất cả các trường liên quan (locale, defaultLocale, availableLocales, setLocale) từ context.                 | -                                                                                                                       |
+| `usePathname`          | Hook trả về đường dẫn hiện tại (pathname) đã được loại bỏ phân đoạn locale. Có tính phản hồi với điều hướng của trình duyệt qua `popstate`. | [usePathname](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/usePathname.md)     |
+| `useRewriteURL`        | Hook phía client để quản lý việc rewrite URL. Nếu tồn tại quy tắc rewrite cho pathname và locale hiện tại, nó sẽ cập nhật URL.              | [useRewriteURL](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useRewriteURL.md) |
+| `useI18n`              | Hook cung cấp một hàm dịch `t()` để truy cập nội dung lồng nhau theo khóa. Bắt chước mẫu i18next/next-intl.                                 | [useI18n](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useI18n.md)             |
+| `useIntl`              | Hook cung cấp một đối tượng `Intl` liên kết với locale. Tự động chèn locale hiện tại và sử dụng bộ nhớ đệm tối ưu.                          | -                                                                                                                       |
+| `useLocaleStorage`     | Hook cung cấp khả năng lưu trữ locale trong localStorage hoặc cookies. Trả về các hàm getter và setter.                                     | -                                                                                                                       |
+| `useLocaleCookie`      | Không còn được khuyến nghị (Deprecated). Sử dụng `useLocaleStorage` thay thế. Hook quản lý việc lưu trữ locale trong cookies.               | -                                                                                                                       |
+| `useLoadDynamic`       | Hook để tải các từ điển động sử dụng React Suspense. Nhận một key và một Promise, lưu kết quả vào cache.                                    | -                                                                                                                       |
+| `useIntlayerContext`   | Hook cung cấp các giá trị context hiện tại của client Intlayer (locale, setLocale, v.v.).                                                   | -                                                                                                                       |
+| `useHTMLContext`       | Hook để truy cập các override (ghi đè) của component HTML từ context HTMLProvider.                                                          | -                                                                                                                       |
 
 ### Hàm
 

package/docs/vi/packages/react-intlayer/useDictionary.md

@@ -28,98 +28,6 @@ author: aymericzip
 
 Phần này cung cấp hướng dẫn chi tiết về cách sử dụng hook `useDictionary` trong các ứng dụng React, cho phép xử lý hiệu quả nội dung đa ngôn ngữ mà không cần trình chỉnh sửa trực quan.
 
-## Nhập `useDictionary` trong React
-
-Hook `useDictionary` có thể được tích hợp vào các ứng dụng React bằng cách nhập nó tùy theo ngữ cảnh:
-
-- **Component phía Client:**
-
-  ```typescript codeFormat="typescript"
-  import { useDictionary } from "react-intlayer"; // Sử dụng trong các component React phía client
-  ```
-
-  ```javascript codeFormat="esm"
-  import { useDictionary } from "react-intlayer"; // Sử dụng trong các component React phía client
-  ```
-
-  ```javascript codeFormat="commonjs"
-  const { useDictionary } = require("react-intlayer"); // Sử dụng trong các component React phía client
-  ```
-
-- **Component phía Server:**
-
-  ```typescript codeFormat="typescript"
-  import { useDictionary } from "react-intlayer/server"; // Sử dụng trong các component React phía server
-  ```
-
-  ```javascript codeFormat="esm"
-  import { useDictionary } from "react-intlayer/server"; // Sử dụng trong các component React phía server
-  ```
-
-  ```javascript codeFormat="commonjs"
-  const { useDictionary } = require("react-intlayer/server"); // Sử dụng trong các component React phía server
-  ```
-
-## Tham số
-
-Hook nhận hai tham số:
-
-1. **`dictionary`**: Một đối tượng từ điển đã được khai báo chứa nội dung được bản địa hóa cho các khóa cụ thể.
-2. **`locale`** (tùy chọn): Ngôn ngữ mong muốn. Mặc định là ngôn ngữ của ngữ cảnh hiện tại nếu không được chỉ định.
-
-## Từ điển
-
-Tất cả các đối tượng từ điển nên được khai báo trong các tệp nội dung có cấu trúc để đảm bảo an toàn kiểu và ngăn ngừa lỗi trong thời gian chạy. Bạn có thể tìm thấy [hướng dẫn thiết lập tại đây](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/dictionary/content_file.md). Dưới đây là một ví dụ về khai báo nội dung:
-
-```typescript fileName="./component.content.ts" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
-import { t, type Dictionary } from "intlayer";
-
-const componentContent = {
-  key: "component-example",
-  content: {
-    title: t({
-      en: "Client Component Example",
-      fr: "Exemple de composant client",
-      es: "Ejemplo de componente cliente",
-    }),
-    content: t({
-      en: "This is the content of a client component example",
-      fr: "Ceci est le contenu d'un exemple de composant client",
-      es: "Este es el contenido de un ejemplo de componente cliente",
-    }),
-  },
-} satisfies Dictionary;
-
-export default componentContent;
-```
-
-```json fileName="./component.content.json" contentDeclarationFormat="json"
-{
-  "$schema": "https://intlayer.org/schema.json",
-  "key": "component-example",
-  "content": {
-    "title": {
-      "nodeType": "translation",
-      "translation": {
-        "en": "Client Component Example",
-        "fr": "Exemple de composant client",
-        "es": "Ejemplo de componente cliente",
-        "vi": "Ví dụ về Component Client"
-      }
-    },
-    "content": {
-      "nodeType": "translation",
-      "translation": {
-        "en": "This is the content of a client component example",
-        "fr": "Ceci est le contenu d'un exemple de composant client",
-        "es": "Este es el contenido de un ejemplo de componente cliente",
-        "vi": "Đây là nội dung của một ví dụ về component client"
-      }
-    }
-  }
-}
-```
-
 ## Ví dụ sử dụng trong React
 
 Dưới đây là ví dụ về cách sử dụng hook `useDictionary` trong một component React:
@@ -141,35 +49,6 @@ const ComponentExample: FC = () => {
 };
 ```
 
-## Tích hợp Server
-
-Nếu bạn sử dụng hook `useDictionary` bên ngoài `IntlayerProvider`, locale phải được cung cấp rõ ràng như một tham số khi render component:
-
-```tsx fileName="./ServerComponentExample.tsx" codeFormat={["typescript", "esm"]}
-import type { FC } from "react";
-import { useDictionary } from "react-intlayer/server";
-import clientComponentExampleContent from "./component.content";
-
-const ServerComponentExample: FC<{ locale: string }> = ({ locale }) => {
-  const { content } = useDictionary(clientComponentExampleContent, locale);
-
-  return (
-    <div>
-      <h1>{content.title}</h1>
-      <p>{content.content}</p>
-    </div>
-  );
-};
-```
-
-## Ghi chú về Thuộc tính
-
-Không giống như các tích hợp sử dụng trình chỉnh sửa trực quan, các thuộc tính như `buttonTitle.value` không áp dụng ở đây. Thay vào đó, truy cập trực tiếp các chuỗi đã được địa phương hóa như đã khai báo trong nội dung của bạn.
-
-```jsx
-<button title={content.title}>{content.content}</button>
-```
-
 ## Mẹo bổ sung
 
 - **An toàn kiểu**: Luôn sử dụng `Dictionary` để định nghĩa các từ điển của bạn nhằm đảm bảo an toàn kiểu.

package/docs/vi/packages/react-intlayer/useI18n.md

@@ -133,34 +133,6 @@ const ServerComponentExample = () => {
 };
 ```
 
-## Xử lý thuộc tính
-
-Khi bản địa hóa các thuộc tính, truy cập giá trị dịch một cách thích hợp:
-
-```html
-<!-- Đối với các thuộc tính hỗ trợ truy cập (ví dụ: aria-label), sử dụng .value vì cần chuỗi thuần túy -->
-<button aria-label={t("button.ariaLabel").value}>{t("button.text")}</button>
-```
-
-## Tài nguyên bổ sung
-
-- **Trình chỉnh sửa trực quan Intlayer**: Để có trải nghiệm quản lý nội dung trực quan hơn, tham khảo tài liệu trình chỉnh sửa trực quan [tại đây](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/intlayer_visual_editor.md).
-
-```tsx
-const { useI18n } = require("react-intlayer/server");
-
-const ServerComponentExample = () => {
-  const t = useI18n("server-component");
-
-  return (
-    <div>
-      <h1>{t("title")}</h1>
-      <p>{t("description")}</p>
-    </div>
-  );
-};
-```
-
 ## Xử lý Thuộc tính
 
 Khi bản địa hóa các thuộc tính, truy cập giá trị dịch một cách thích hợp:

package/docs/vi/packages/react-intlayer/useIntlayer.md

@@ -25,49 +25,6 @@ history:
 author: aymericzip
 ---
 
-# Tích hợp React: Tài liệu Hook `useIntlayer`
-
-Phần này cung cấp hướng dẫn chi tiết về cách sử dụng hook `useIntlayer` trong các ứng dụng React, cho phép bản địa hóa nội dung hiệu quả.
-
-## Nhập `useIntlayer` trong React
-
-Hook `useIntlayer` có thể được tích hợp vào các ứng dụng React bằng cách nhập nó tùy theo ngữ cảnh:
-
-- **Component phía Client:**
-
-  ```typescript codeFormat="typescript"
-  import { useIntlayer } from "react-intlayer"; // Sử dụng trong các component React phía client
-  ```
-
-  ```javascript codeFormat="esm"
-  import { useIntlayer } from "react-intlayer"; // Sử dụng trong các component React phía client
-  ```
-
-  ```javascript codeFormat="commonjs"
-  const { useIntlayer } = require("react-intlayer"); // Sử dụng trong các component React phía client
-  ```
-
-- **Component phía Server:**
-
-  ```typescript codeFormat="commonjs"
-  import { useIntlayer } from "react-intlayer/server"; // Sử dụng trong các component React phía server
-  ```
-
-  ```javascript codeFormat="esm"
-  import { useIntlayer } from "react-intlayer/server"; // Sử dụng trong các component React phía server
-  ```
-
-  ```javascript codeFormat="commonjs"
-  const { useIntlayer } = require("react-intlayer/server"); // Sử dụng trong các component React phía server
-  ```
-
-## Tham số
-
-Hook nhận hai tham số:
-
-1. **`key`**: Khóa từ điển để lấy nội dung đã được bản địa hóa.
-2. **`locale`** (tùy chọn): Ngôn ngữ mong muốn. Mặc định là ngôn ngữ của ngữ cảnh nếu không được chỉ định.
-
 ## Từ điển
 
 Tất cả các khóa từ điển phải được khai báo trong các tệp khai báo nội dung để tăng tính an toàn kiểu và tránh lỗi. Bạn có thể tìm thấy [hướng dẫn thiết lập tại đây](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/dictionary/content_file.md).
@@ -131,14 +88,6 @@ const ServerComponentExample = () => {
 };
 ```
 
-## Xử lý Thuộc tính
-
-Khi bản địa hóa các thuộc tính, truy cập giá trị nội dung một cách thích hợp:
-
-```jsx
-<button title={content.buttonTitle.value}>{content.buttonText}</button>
-```
-
 ## Tài nguyên Bổ sung
 
 - **Trình chỉnh sửa trực quan Intlayer**: Để có trải nghiệm quản lý nội dung trực quan hơn, hãy tham khảo tài liệu trình chỉnh sửa trực quan [tại đây](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/intlayer_visual_editor.md).

package/docs/vi/packages/react-intlayer/usePathname.md

@@ -0,0 +1,87 @@
+---
+createdAt: 2026-06-22
+updatedAt: 2026-06-22
+title: Tài liệu usePathname Hook | react-intlayer
+description: Tìm hiểu cách sử dụng hook usePathname từ gói react-intlayer để lấy đường dẫn (pathname) của URL hiện tại mà không có phân đoạn locale.
+keywords:
+  - usePathname
+  - pathname
+  - react
+  - intlayer
+  - routing
+  - quốc tế hóa
+slugs:
+  - doc
+  - packages
+  - react-intlayer
+  - usePathname
+history:
+  - version: 10.0.0
+    date: 2026-06-23
+    changes: "Thêm tiện ích usePathname"
+  - version: 8.2.0
+    date: 2026-06-22
+    changes: "Khởi tạo lịch sử"
+author: aymericzip
+---
+
+# Tích hợp React: Tài liệu Hook `usePathname`
+
+Hook `usePathname` từ `react-intlayer` trả về đường dẫn hiện tại của trình duyệt (pathname) với phân đoạn ngôn ngữ (locale) đã được loại bỏ. Nó dựa trên thuộc tính `window.location.pathname` gốc và phản hồi các sự kiện điều hướng của trình duyệt qua `popstate`.
+
+## Nhập `usePathname`
+
+```typescript
+import { usePathname } from "react-intlayer";
+```
+
+## Tổng quan
+
+Không giống như các hook định tuyến dành riêng cho framework (như trong `next-intlayer` hoặc `react-router`), hook này là một giải pháp gọn nhẹ, độc lập với framework dành cho các ứng dụng React thuần túy. Nó trích xuất URL hiện tại và loại bỏ bất kỳ tiền tố locale nào phù hợp (ví dụ: `/vi/about` trở thành `/about`).
+
+## Sử dụng
+
+```tsx fileName="src/components/Navigation.tsx" codeFormat={["typescript", "esm"]}
+import type { FC } from "react";
+import { usePathname } from "react-intlayer";
+
+const Navigation: FC = () => {
+  const pathname = usePathname();
+
+  return (
+    <nav>
+      <a
+        href="/home"
+        style={{ fontWeight: pathname === "/home" ? "bold" : "normal" }}
+      >
+        Trang chủ
+      </a>
+      <a
+        href="/about"
+        style={{ fontWeight: pathname === "/about" ? "bold" : "normal" }}
+      >
+        Giới thiệu
+      </a>
+    </nav>
+  );
+};
+
+export default Navigation;
+```
+
+## Giá trị Trả về
+
+| Kiểu     | Mô tả                                                                                                        |
+| -------- | ------------------------------------------------------------------------------------------------------------ |
+| `string` | Đường dẫn hiện tại của trình duyệt với tiền tố locale đã bị loại bỏ (ví dụ: `/vi/dashboard` → `/dashboard`). |
+
+## Hành vi
+
+- **Loại bỏ Locale**: Bên dưới, nó sử dụng tiện ích `getPathWithoutLocale` để tự động phát hiện và loại bỏ locale khỏi pathname dựa trên cấu hình Intlayer của ứng dụng.
+- **Khả năng Phản hồi (Reactivity)**: Lắng nghe sự kiện `popstate`. Khi người dùng điều hướng bằng các nút tiến/lùi của trình duyệt hoặc khi gọi `pushState`/`replaceState`, hook sẽ cập nhật pathname được trả về.
+- **SSR Fallback**: Trên server (nơi `window` là undefined), mặc định nó trả về `/` vì trong ngữ cảnh React thuần túy, mặc định nó không thể truy cập vào request URL.
+
+## Tài liệu Liên quan
+
+- [`useLocale`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/react-intlayer/useLocale.md)
+- [`getPathWithoutLocale`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/intlayer/getPathWithoutLocale.md)

package/docs/vi/packages/solid-intlayer/exports.md

@@ -14,6 +14,9 @@ slugs:
   - solid-intlayer
   - exports
 history:
+  - version: 10.0.0
+    date: 2026-06-23
+    changes: "Thêm tiện ích usePathname"
   - version: 8.0.0
     date: 2026-01-21
     changes: "Hợp nhất tài liệu cho tất cả các exports"
@@ -52,17 +55,18 @@ Nhập:
 import "solid-intlayer";
 ```
 
-| Hook                   | Mô tả                                                                                                              | Tài liệu liên quan                                                                                                      |
-| ---------------------- | ------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------- |
-| `useIntlayer`          | Dựa trên `useDictionary`, nhưng injects một phiên bản tối ưu hóa của dictionary từ khai báo được sinh.             | [useIntlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/solid-intlayer/useIntlayer.md)     |
-| `useDictionary`        | Xử lý các đối tượng có cấu trúc giống từ điển (key, content). Nó xử lý các bản dịch `t()`, enumerations, v.v.      | -                                                                                                                       |
-| `useDictionaryAsync`   | Tương tự `useDictionary`, nhưng xử lý các từ điển bất đồng bộ.                                                     | -                                                                                                                       |
-| `useDictionaryDynamic` | Tương tự `useDictionary`, nhưng xử lý các từ điển động.                                                            | -                                                                                                                       |
-| `useLocale`            | Trả về locale hiện tại và một hàm để thiết lập nó.                                                                 | [useLocale](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/solid-intlayer/useLocale.md)         |
-| `useRewriteURL`        | Hook phía client để quản lý việc viết lại URL. Tự động cập nhật URL nếu tồn tại quy tắc viết lại được bản địa hóa. | [useRewriteURL](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/solid-intlayer/useRewriteURL.md) |
-| `useIntl`              | Trả về đối tượng Intl cho locale hiện tại.                                                                         | -                                                                                                                       |
-| `useLoadDynamic`       | Hook để tải từ điển động.                                                                                          | -                                                                                                                       |
-| `t`                    | Chọn nội dung dựa trên locale hiện tại.                                                                            | [translation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/dictionary/translation.md)                  |
+| Hook                   | Mô tả                                                                                                                    | Tài liệu liên quan                                                                                                      |
+| ---------------------- | ------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------- |
+| `useIntlayer`          | Dựa trên `useDictionary`, nhưng injects một phiên bản tối ưu hóa của dictionary từ khai báo được sinh.                   | [useIntlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/solid-intlayer/useIntlayer.md)     |
+| `useDictionary`        | Xử lý các đối tượng có cấu trúc giống từ điển (key, content). Nó xử lý các bản dịch `t()`, enumerations, v.v.            | -                                                                                                                       |
+| `useDictionaryAsync`   | Tương tự `useDictionary`, nhưng xử lý các từ điển bất đồng bộ.                                                           | -                                                                                                                       |
+| `useDictionaryDynamic` | Tương tự `useDictionary`, nhưng xử lý các từ điển động.                                                                  | -                                                                                                                       |
+| `useLocale`            | Trả về locale hiện tại và một hàm để thiết lập nó.                                                                       | [useLocale](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/solid-intlayer/useLocale.md)         |
+| `usePathname`          | Trả về pathname hiện tại dưới dạng `Accessor<string>` với phần locale đã bị loại bỏ. Reactive (phản ứng) với `popstate`. | [usePathname](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/solid-intlayer/usePathname.md)     |
+| `useRewriteURL`        | Hook phía client để quản lý việc viết lại URL. Tự động cập nhật URL nếu tồn tại quy tắc viết lại được bản địa hóa.       | [useRewriteURL](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/solid-intlayer/useRewriteURL.md) |
+| `useIntl`              | Trả về đối tượng Intl cho locale hiện tại.                                                                               | -                                                                                                                       |
+| `useLoadDynamic`       | Hook để tải từ điển động.                                                                                                | -                                                                                                                       |
+| `t`                    | Chọn nội dung dựa trên locale hiện tại.                                                                                  | [translation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/dictionary/translation.md)                  |
 
 ### Thành phần
 

package/docs/vi/packages/solid-intlayer/usePathname.md

@@ -0,0 +1,119 @@
+---
+createdAt: 2026-06-22
+updatedAt: 2026-06-22
+title: Tài liệu Hook usePathname | solid-intlayer
+description: Tìm hiểu cách sử dụng hook usePathname từ gói solid-intlayer
+keywords:
+  - usePathname
+  - pathname
+  - locale
+  - Intlayer
+  - Quốc tế hóa
+  - Tài liệu
+  - Solid
+  - Solid.js
+  - JavaScript
+slugs:
+  - doc
+  - packages
+  - solid-intlayer
+  - usePathname
+history:
+  - version: 10.0.0
+    date: 2026-06-23
+    changes: "Thêm tiện ích usePathname"
+  - version: 8.2.0
+    date: 2026-06-22
+    changes: "Khởi tạo lịch sử"
+author: aymericzip
+---
+
+# Tích hợp Solid: Tài liệu Hook `usePathname`
+
+Hook `usePathname` trả về pathname của trình duyệt hiện tại với phần locale đã bị loại bỏ, dưới dạng một `Accessor<string>` của Solid. Nó hữu ích cho việc xây dựng điều hướng nhận biết locale — ví dụ, xác định mục điều hướng nào đang hoạt động — mà không cần phải loại bỏ tiền tố locale theo cách thủ công.
+
+## Import `usePathname` trong Solid
+
+```typescript
+import { usePathname } from "solid-intlayer";
+```
+
+## Tổng quan
+
+`usePathname` tạo ra một reactive signal được khởi tạo từ `window.location.pathname`, loại bỏ tiền tố locale thông qua `getPathWithoutLocale`, và cập nhật signal mỗi khi trình duyệt kích hoạt sự kiện `popstate` (điều hướng quay lại/tiến lên). Event listener sẽ tự động được dọn dẹp thông qua `onCleanup`.
+
+## Sử dụng
+
+```tsx fileName="src/components/NavItem.tsx"
+import type { Component } from "solid-js";
+import { usePathname } from "solid-intlayer";
+
+type NavItemProps = {
+  href: string;
+  label: string;
+};
+
+const NavItem: Component<NavItemProps> = ({ href, label }) => {
+  const pathname = usePathname();
+
+  return (
+    <a href={href} aria-current={pathname() === href ? "page" : undefined}>
+      {label}
+    </a>
+  );
+};
+
+export default NavItem;
+```
+
+## Giá trị trả về
+
+| Kiểu dữ liệu       | Mô tả                                                                                       |
+| ------------------ | ------------------------------------------------------------------------------------------- |
+| `Accessor<string>` | Accessor của Solid (reactive getter) trả về pathname hiện tại không bao gồm tiền tố locale. |
+
+## Hành vi
+
+- **Loại bỏ locale**: Xóa bỏ phần locale ở đầu pathname (ví dụ: `/vi/dashboard` → `/dashboard`).
+- **Reactive (Phản ứng)**: Tự động cập nhật dựa trên các sự kiện `popstate` (điều hướng quay lại / tiến lên của trình duyệt).
+- **An toàn cho SSR**: Trả về `""` khi `window` không có sẵn.
+- **Dọn dẹp**: `popstate` listener được loại bỏ tự động thông qua hàm `onCleanup` của Solid.
+
+## Ví dụ
+
+```tsx fileName="src/components/Sidebar.tsx"
+import type { Component } from "solid-js";
+import { For } from "solid-js";
+import { usePathname } from "solid-intlayer";
+
+const links = [
+  { href: "/dashboard", label: "Bảng điều khiển" },
+  { href: "/settings", label: "Cài đặt" },
+];
+
+const Sidebar: Component = () => {
+  const pathname = usePathname();
+
+  return (
+    <nav>
+      <For each={links}>
+        {({ href, label }) => (
+          <a
+            href={href}
+            style={{ "font-weight": pathname() === href ? "bold" : "normal" }}
+          >
+            {label}
+          </a>
+        )}
+      </For>
+    </nav>
+  );
+};
+
+export default Sidebar;
+```
+
+## Các tài liệu liên quan
+
+- [`useLocale`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/solid-intlayer/useLocale.md) — locale hiện tại + bộ chuyển đổi locale
+- [`getPathWithoutLocale`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/intlayer/getPathWithoutLocale.md) — tiện ích nền tảng được sử dụng bởi hook này

package/docs/vi/packages/svelte-intlayer/exports.md

@@ -14,6 +14,9 @@ slugs:
   - svelte-intlayer
   - exports
 history:
+  - version: 10.0.0
+    date: 2026-06-23
+    changes: "Thêm tiện ích usePathname"
   - version: 8.0.0
     date: 2026-01-21
     changes: "Hợp nhất tài liệu cho tất cả các exports"
@@ -64,15 +67,16 @@ Nhập:
 import "svelte-intlayer";
 ```
 
-| Hàm                    | Mô tả                                                                                                                  | Tài liệu liên quan                                                                                                       |
-| ---------------------- | ---------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ |
-| `useIntlayer`          | Dựa trên `useDictionary`, nhưng chèn một phiên bản tối ưu của dictionary từ khai báo được sinh ra.                     | -                                                                                                                        |
-| `useDictionary`        | Xử lý các đối tượng có dạng dictionary (key, content). Nó xử lý các bản dịch `t()`, các enumeration, v.v.              | -                                                                                                                        |
-| `useDictionaryAsync`   | Tương tự `useDictionary`, nhưng xử lý các dictionary bất đồng bộ.                                                      | -                                                                                                                        |
-| `useDictionaryDynamic` | Tương tự `useDictionary`, nhưng xử lý các dictionary động.                                                             | -                                                                                                                        |
-| `useLocale`            | Trả về locale hiện tại và một hàm để thiết lập nó.                                                                     | -                                                                                                                        |
-| `useRewriteURL`        | Hàm phía client để quản lý việc rewrite URL. Tự động cập nhật URL nếu tồn tại một quy tắc rewrite đã được bản địa hóa. | [useRewriteURL](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/svelte-intlayer/useRewriteURL.md) |
-| `useIntl`              | Trả về đối tượng Intl cho locale hiện tại.                                                                             | -                                                                                                                        |
+| Hàm                    | Mô tả                                                                                                                      | Tài liệu liên quan                                                                                                       |
+| ---------------------- | -------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ |
+| `useIntlayer`          | Dựa trên `useDictionary`, nhưng chèn một phiên bản tối ưu của dictionary từ khai báo được sinh ra.                         | -                                                                                                                        |
+| `useDictionary`        | Xử lý các đối tượng có dạng dictionary (key, content). Nó xử lý các bản dịch `t()`, các enumeration, v.v.                  | -                                                                                                                        |
+| `useDictionaryAsync`   | Tương tự `useDictionary`, nhưng xử lý các dictionary bất đồng bộ.                                                          | -                                                                                                                        |
+| `useDictionaryDynamic` | Tương tự `useDictionary`, nhưng xử lý các dictionary động.                                                                 | -                                                                                                                        |
+| `useLocale`            | Trả về locale hiện tại và một hàm để thiết lập nó.                                                                         | -                                                                                                                        |
+| `usePathname`          | Trả về pathname hiện tại dưới dạng một `Readable<string>` store với phần locale đã bị loại bỏ. Có phản ứng với `popstate`. | [usePathname](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/svelte-intlayer/usePathname.md)     |
+| `useRewriteURL`        | Hàm phía client để quản lý việc rewrite URL. Tự động cập nhật URL nếu tồn tại một quy tắc rewrite đã được bản địa hóa.     | [useRewriteURL](https://github.com/aymericzip/intlayer/blob/main/docs/docs/vi/packages/svelte-intlayer/useRewriteURL.md) |
+| `useIntl`              | Trả về đối tượng Intl cho locale hiện tại.                                                                                 | -                                                                                                                        |
 
 ### Markdown