@intlayer/chokidar 8.1.0 → 8.1.2

package/dist/assets/installSkills/skills/next_js.md

@@ -1,10 +1,53 @@
 ---
-name: NextJS
-description: Next.js-specific usage (Server & Client components)
+name: intlayer-next-js
+description: Integrates Intlayer internationalization with Next.js App Router and Pages Router. Use when the user asks to "setup Next.js i18n", use "useIntlayer" in Server Components, or handle client-side translations in Next.js.
+metadata:
+  author: Intlayer
+  url: https://intlayer.org
+  license: Apache-2.0
+  mcp-server: "@intlayer/mcp"
+  category: productivity
+  tags: [i18n, nextjs]
+  documentation: https://intlayer.org/doc
+  support: contact@intlayer.org
 ---
 
 # Intlayer Next.js Usage
 
+## Core Philosophy
+
+Intlayer promotes **Component-Level Content Declaration**. Instead of a massive global translation file, content is declared in `*.content.ts` files adjacent to the Next.js components that use them.
+
+## Workflow
+
+To create a translated component, you need two files:
+
+1.  **Declaration:** A content file (e.g., `myComponent.content.ts`) defining the dictionary.
+2.  **Implementation:** A Next.js component (Server or Client) using the `useIntlayer` hook.
+
+### 1. Declare Content
+
+Create a content file using `t()` for translations.
+**File:** `src/components/MyComponent/myComponent.content.ts`
+
+```typescript
+import { t, type Dictionary } from "intlayer";
+
+const content = {
+  // The 'key' must be unique and matches what you pass to useIntlayer()
+  key: "my-component",
+  content: {
+    text: t({
+      en: "Welcome",
+      fr: "Bienvenue",
+      es: "Hola",
+    }),
+  },
+} satisfies Dictionary;
+
+export default content;
+```
+
 ## Setup
 
 - [Next.js](https://intlayer.org/doc/environment/nextjs.md)
@@ -15,34 +58,71 @@ description: Next.js-specific usage (Server & Client components)
 
 ## Server Components
 
+To use Intlayer in Server Components, use `IntlayerServerProvider` to provide the locale and `useIntlayer` from `next-intlayer/server`.
+
 ```tsx
-import { useIntlayer } from "next-intlayer/server";
-const MyComponent = async () => {
-  const content = await useIntlayer("my-dictionary-key");
+import { IntlayerServerProvider, useIntlayer } from "next-intlayer/server";
+
+const MyServerComponent = () => {
+  const content = useIntlayer("my-component");
   return (
     <div>
-      <h1>{content.title}</h1>
-      <img src={content.image.src.value} alt={content.image.alt.value} />
+      <h1>{content.text}</h1>
     </div>
   );
 };
+
+const Page = async ({ params }) => {
+  const { locale } = await params;
+  return (
+    <IntlayerServerProvider locale={locale}>
+      <MyServerComponent />
+    </IntlayerServerProvider>
+  );
+};
+
+export default Page;
 ```
 
 ## Client Components
 
+For Client Components, add the `"use client"` directive and use `useIntlayer` from `next-intlayer`. Ensure the component is wrapped in an `IntlayerClientProvider`.
+
 ```tsx
 "use client";
+
 import { useIntlayer } from "next-intlayer";
-const MyComponent = async () => {
-  const content = await useIntlayer("my-dictionary-key");
+
+export const MyClientComponent = () => {
+  const content = useIntlayer("my-component");
+
   return (
     <div>
-      <h1>{content.title}</h1>
-      <img src={content.image.src.value} alt={content.image.alt.value} />
+      <h1>{content.text}</h1>
     </div>
   );
 };
 ```
 
-Use `useIntlayer` from `next-intlayer` exactly like in React.
-[Next.js Documentation](https://intlayer.org/doc/packages/next-intlayer.md)
+[Next.js package Documentation](https://intlayer.org/doc/packages/next-intlayer.md)
+[Next.js package Documentation](https://intlayer.org/doc/packages/next-intlayer.md)
+
+## References
+
+### Environments
+
+- [Next.js](https://intlayer.org/doc/environment/nextjs.md)
+- [Next.js 14](https://intlayer.org/doc/environment/nextjs/14.md)
+- [Next.js 15](https://intlayer.org/doc/environment/nextjs/15.md)
+- [Next.js No Locale Path](https://intlayer.org/doc/environment/nextjs/no-locale-path.md)
+- [Next.js with Page Router](https://intlayer.org/doc/environment/nextjs/next-with-page-router.md)
+
+### Packages
+
+- [Intlayer Exports](https://intlayer.org/doc/packages/intlayer/exports.md)
+- [Next Intlayer Exports](https://intlayer.org/doc/packages/next-intlayer/exports.md)
+- [Next Intlayer Middleware](https://intlayer.org/doc/packages/next-intlayer/intlayerMiddleware.md)
+- [Next Intlayer T](https://intlayer.org/doc/packages/next-intlayer/t.md)
+- [Next Intlayer useDictionary](https://intlayer.org/doc/packages/next-intlayer/useDictionary.md)
+- [Next Intlayer useIntlayer](https://intlayer.org/doc/packages/next-intlayer/useIntlayer.md)
+- [Next Intlayer useLocale](https://intlayer.org/doc/packages/next-intlayer/useLocale.md)

package/dist/assets/installSkills/skills/preact.md

@@ -0,0 +1,82 @@
+---
+name: intlayer-preact
+description: Integrates Intlayer internationalization with Preact applications. Use when the user asks to "setup Preact i18n", create a new translated component, use the "useIntlayer" hook in Preact, or configure providers.
+metadata:
+  author: Intlayer
+  url: https://intlayer.org
+  license: Apache-2.0
+  mcp-server: "@intlayer/mcp"
+  category: productivity
+  tags: [i18n, preact, vite]
+  documentation: https://intlayer.org/doc
+  support: contact@intlayer.org
+---
+
+# Intlayer Preact Usage
+
+## Core Philosophy
+
+Intlayer promotes **Component-Level Content Declaration**. Instead of a massive global translation file, content is declared in `*.content.ts` files adjacent to the Preact components that use them.
+
+## Workflow
+
+To create a translated component, you need two files:
+
+1.  **Declaration:** A content file (e.g., `myComponent.content.ts`) defining the dictionary.
+2.  **Implementation:** A Preact component (e.g., `MyComponent.tsx`) using the `useIntlayer` hook.
+
+### Declare Content
+
+Create a content file using `t()` for translations.
+**File:** `src/components/MyComponent/myComponent.content.ts`
+
+```typescript
+import { t, type Dictionary } from "intlayer";
+
+const content = {
+  // The 'key' must be unique and matches what you pass to useIntlayer()
+  key: "my-component",
+  content: {
+    text: t({
+      en: "Welcome",
+      fr: "Bienvenue",
+      es: "Hola",
+    }),
+  },
+} satisfies Dictionary;
+
+export default content;
+```
+
+## Setup
+
+- [Vite and Preact](https://intlayer.org/doc/environment/vite-and-preact.md)
+
+## useIntlayer Hook
+
+```tsx
+import { useIntlayer } from "preact-intlayer";
+
+const MyComponent = () => {
+  const content = useIntlayer("my-component");
+
+  return (
+    <div>
+      <h1>
+        {/* Return content */}
+        {content.text}
+      </h1>
+      {/* Return string (.value) */}
+      <img src={content.text.value} alt={content.text.value} />
+    </div>
+  );
+};
+```
+
+[Preact package Documentation](https://intlayer.org/doc/packages/preact-intlayer.md)
+
+## References
+
+- [Vite and Preact](https://intlayer.org/doc/environment/vite-and-preact.md)
+- [Intlayer Exports](https://intlayer.org/doc/packages/intlayer/exports.md)
+- [Preact Intlayer Exports](https://intlayer.org/doc/packages/preact-intlayer/exports.md)

package/dist/assets/installSkills/skills/react.md

@@ -1,20 +1,65 @@
 ---
-name: React
-description: React-specific syntax and hooks usage
+name: intlayer-react
+description: Integrates Intlayer internationalization with React component. Use when the user asks to "setup React i18n", create a new translated component, use the "useIntlayer" hook, or configure providers.
+metadata:
+  author: Intlayer
+  url: https://intlayer.org
+  license: Apache-2.0
+  mcp-server: "@intlayer/mcp"
+  category: productivity
+  tags: [i18n, react, vite]
+  documentation: https://intlayer.org/doc
+  support: contact@intlayer.org
 ---
 
 # Intlayer React Usage
 
+## Core Philosophy
+
+Intlayer promotes **Component-Level Content Declaration**. Instead of a massive global translation file, content is declared in `*.content.ts` files adjacent to the React components that use them.
+
+## Workflow
+
+To create a translated component, you need two files:
+
+1.  **Declaration:** A content file (e.g., `myComponent.content.ts`) defining the dictionary.
+2.  **Implementation:** A React component (e.g., `MyComponent.tsx`) using the `useIntlayer` hook.
+
+### 1. Declare Content
+
+Create a content file using `t()` for translations.
+**File:** `src/components/MyComponent/myComponent.content.ts`
+
+```typescript
+import { t, type Dictionary } from "intlayer";
+
+const content = {
+  // The 'key' must be unique and matches what you pass to useIntlayer()
+  key: "my-component",
+  content: {
+    text: t({
+      en: "Welcome",
+      fr: "Bienvenue",
+      es: "Hola",
+      // ... All other locales set in intlayer config file
+    }),
+  },
+} satisfies Dictionary;
+
+export default content;
+```
+
+# Intlayer React Usage
+
 ## Setup
 
 - [Vite and React](https://intlayer.org/doc/environment/vite-and-react.md)
 - [Create React App](https://intlayer.org/doc/environment/create-react-app.md)
+- [React Router v7](https://intlayer.org/doc/environment/vite-and-react/react-router-v7.md)
+- [React Router v7 (fs routes)](https://intlayer.org/doc/environment/vite-and-react/react-router-v7-fs-routes.md)
+- [Tanstack Start](https://intlayer.org/doc/environment/tanstack-start.md)
 - [React Native and Expo](https://intlayer.org/doc/environment/react-native-and-expo.md)
-- [Vite and React (React Router v7)](https://intlayer.org/doc/environment/vite-and-react/react-router-v7.md)
 - [Lynx and React](https://intlayer.org/doc/environment/lynx-and-react.md)
-- [Page Metadata](https://intlayer.org/doc/environment/react-intlayer/page-metadata.md)
-- [Sitemap](https://intlayer.org/doc/environment/react-intlayer/sitemap.md)
-- [Server Actions](https://intlayer.org/doc/environment/react-intlayer/server-actions.md)
 
 ## useIntlayer Hook
 
@@ -24,11 +69,34 @@ const MyComponent = () => {
   const content = useIntlayer("my-dictionary-key");
   return (
     <div>
-      <h1>{content.title}</h1>
-      <img src={content.image.src.value} alt={content.image.alt.value} />
+      <h1>
+        {/* Return react node */}
+        {content.text}
+      </h1>
+      {/* Return string (.value) */}
+      <img src={content.text.value} alt={content.text.value} />
     </div>
   );
 };
 ```
 
-[React Documentation](https://intlayer.org/doc/packages/react-intlayer.md)
+## References
+
+### Environments
+
+- [Vite and React](https://intlayer.org/doc/environment/vite-and-react.md)
+- [Create React App](https://intlayer.org/doc/environment/create-react-app.md)
+- [Vite and React (React Router v7)](https://intlayer.org/doc/environment/vite-and-react/react-router-v7.md)
+- [Vite and React (React Router v7 FS Routes)](https://intlayer.org/doc/environment/vite-and-react/react-router-v7-fs-routes.md)
+
+### Packages
+
+- [Intlayer Exports](https://intlayer.org/doc/packages/intlayer/exports.md)
+- [React Intlayer Provider](https://intlayer.org/doc/packages/react-intlayer/IntlayerProvider.md)
+- [React Intlayer MarkdownRenderer](https://intlayer.org/doc/packages/react-intlayer/MarkdownRenderer.md)
+- [React Intlayer Exports](https://intlayer.org/doc/packages/react-intlayer/exports.md)
+- [React Intlayer T](https://intlayer.org/doc/packages/react-intlayer/t.md)
+- [React Intlayer useDictionary](https://intlayer.org/doc/packages/react-intlayer/useDictionary.md)
+- [React Intlayer useI18n](https://intlayer.org/doc/packages/react-intlayer/useI18n.md)
+- [React Intlayer useIntlayer](https://intlayer.org/doc/packages/react-intlayer/useIntlayer.md)
+- [React Intlayer useLocale](https://intlayer.org/doc/packages/react-intlayer/useLocale.md)

package/dist/assets/installSkills/skills/remote_content.md

@@ -1,6 +1,15 @@
 ---
-name: RemoteContent
-description: How to use Intlayer with Remote/CMS/Server-side content
+name: intlayer-cms
+description: Manages remote content and server-side dictionaries using the Intlayer CMS. Use when the user asks to "fetch remote translations", "use Intlayer CMS", or "handle server-side content".
+metadata:
+  author: Intlayer
+  url: https://intlayer.org
+  license: Apache-2.0
+  mcp-server: "@intlayer/mcp"
+  category: productivity
+  tags: [i18n]
+  documentation: https://intlayer.org/doc
+  support: contact@intlayer.org
 ---
 
 # Intlayer Server Content & CMS
@@ -8,3 +17,15 @@ description: How to use Intlayer with Remote/CMS/Server-side content
 For managing server-side content and using the Intlayer CMS:
 
 - [Intlayer CMS Documentation](https://intlayer.org/cms.md)
+
+## References
+
+### Concepts
+
+- [CMS Concept](https://intlayer.org/doc/concept/cms.md)
+- [Editor Concept](https://intlayer.org/doc/concept/editor.md)
+
+### Links
+
+- [CMS](https://intlayer.org/cms)
+- [TMS](https://intlayer.org/tms)

package/dist/assets/installSkills/skills/solid.md

@@ -0,0 +1,87 @@
+---
+name: intlayer-solid-js
+description: Integrates Intlayer internationalization with SolidJS components. Use when the user asks to "setup SolidJS i18n", create a new translated component, use the "useIntlayer" hook in Solid, or configure providers.
+metadata:
+  author: Intlayer
+  url: https://intlayer.org
+  license: Apache-2.0
+  mcp-server: "@intlayer/mcp"
+  category: productivity
+  tags: [i18n, solid, vite]
+  documentation: https://intlayer.org/doc
+  support: contact@intlayer.org
+---
+
+# Intlayer Solid Usage
+
+## Core Philosophy
+
+Intlayer promotes **Component-Level Content Declaration**. Instead of a massive global translation file, content is declared in `*.content.ts` files adjacent to the Solid components that use them.
+
+## Workflow
+
+To create a translated component, you need two files:
+
+1.  **Declaration:** A content file (e.g., `myComponent.content.ts`) defining the dictionary.
+2.  **Implementation:** A Solid component (e.g., `MyComponent.tsx`) using the `useIntlayer` hook.
+
+### Declare Content
+
+Create a content file using `t()` for translations.
+**File:** `src/components/MyComponent/myComponent.content.ts`
+
+```typescript
+import { t, type Dictionary } from "intlayer";
+
+const content = {
+  // The 'key' must be unique and matches what you pass to useIntlayer()
+  key: "my-component",
+  content: {
+    text: t({
+      en: "Welcome",
+      fr: "Bienvenue",
+      es: "Hola",
+    }),
+  },
+} satisfies Dictionary;
+
+export default content;
+```
+
+## Setup
+
+- [Vite and Solid](https://intlayer.org/doc/environment/vite-and-solid.md)
+
+## useIntlayer Hook
+
+> [!IMPORTANT]
+> In Solid, `useIntlayer` returns an **accessor** function (e.g., `content()`). You must call this function to access the reactive content.
+
+```tsx
+import { useIntlayer } from "solid-intlayer";
+
+const MyComponent = () => {
+  const content = useIntlayer("my-component");
+
+  return (
+    <div>
+      <h1>
+        {/* Return content */}
+        {content().text}
+      </h1>
+      {/* Return string (.value) */}
+      <img src={content().text.value} alt={content().text.value} />
+    </div>
+  );
+};
+```
+
+## References
+
+### Environments
+
+- [Vite and Solid](https://intlayer.org/doc/environment/vite-and-solid.md)
+
+### Packages
+
+- [Solid Intlayer Exports](https://intlayer.org/doc/packages/solid-intlayer/exports.md)

package/dist/assets/installSkills/skills/svelte.md

@@ -1,30 +1,81 @@
 ---
-name: Svelte
-description: Svelte-specific stores and syntax
+name: intlayer-svelte
+description: Integrates Intlayer internationalization with Svelte and SvelteKit applications. Use when the user asks to "setup Svelte i18n", create a new translated component, use the "useIntlayer" store, or configure providers.
+metadata:
+  author: Intlayer
+  url: https://intlayer.org
+  license: Apache-2.0
+  mcp-server: "@intlayer/mcp"
+  category: productivity
+  tags: [i18n, svelte, vite]
+  documentation: https://intlayer.org/doc
+  support: contact@intlayer.org
 ---
 
 # Intlayer Svelte Usage
 
+## Core Philosophy
+
+Intlayer promotes **Component-Level Content Declaration**. Instead of a massive global translation file, content is declared in `*.content.ts` files adjacent to the Svelte components that use them.
+
+## Workflow
+
+To create a translated component, you need two files:
+
+1.  **Declaration:** A content file (e.g., `myComponent.content.ts`) defining the dictionary.
+2.  **Implementation:** A Svelte component (e.g., `MyComponent.svelte`) using the `useIntlayer` store.
+
+### 1. Declare Content
+
+Create a content file using `t()` for translations.
+**File:** `src/components/MyComponent/myComponent.content.ts`
+
+```typescript
+import { t, type Dictionary } from "intlayer";
+
+const content = {
+  // The 'key' must be unique and matches what you pass to useIntlayer()
+  key: "my-component",
+  content: {
+    text: t({
+      en: "Welcome",
+      fr: "Bienvenue",
+      es: "Hola",
+    }),
+  },
+} satisfies Dictionary;
+
+export default content;
+```
+
 ## Setup
 
 - [SvelteKit](https://intlayer.org/doc/environment/sveltekit.md)
 - [Vite and Svelte](https://intlayer.org/doc/environment/vite-and-svelte.md)
-- [Page Metadata](https://intlayer.org/doc/environment/svelte-intlayer/page-metadata.md)
-- [Sitemap](https://intlayer.org/doc/environment/svelte-intlayer/sitemap.md)
-- [Server Actions](https://intlayer.org/doc/environment/svelte-intlayer/server-actions.md)
 
 ## useIntlayer Hook
 
+In Svelte, `useIntlayer` returns a **store**. You must use the `$` prefix to access its value.
+
 ```svelte
 <script>
   import { useIntlayer } from "svelte-intlayer";
-  const content = useIntlayer("my-dictionary-key");
+  const content = useIntlayer("my-component");
 </script>
+
 <div>
-  <h1>{$content.title}</h1>
-  <div aria-label={$content.title.value}></div>
-  <svelte:component this={$content.title} />
+  <h1>
+    {/* Return content */}
+    {$content.text}
+  </h1>
+  {/* Return string (.value) */}
+  <div aria-label={$content.text.value}></div>
 </div>
 ```
 
-[Svelte Documentation](https://intlayer.org/doc/intlayer_with_svelte_kit.md)
+## References
+
+- [Intlayer Exports](https://intlayer.org/doc/packages/intlayer/exports.md)
+- [Vite and Svelte](https://intlayer.org/doc/environment/vite-and-svelte.md)
+- [SvelteKit](https://intlayer.org/doc/environment/sveltekit.md)
+- [Svelte Intlayer Exports](https://intlayer.org/doc/packages/svelte-intlayer/exports.md)

package/dist/assets/installSkills/skills/usage.md

@@ -1,6 +1,15 @@
 ---
-name: Usage
-description: How to use Intlayer in your project
+name: intlayer-usage
+description: Provides general guidelines for using Intlayer in any project. Use when the user asks to "get started with Intlayer", "declare content files", or understand the "project structure" for internationalization.
+metadata:
+  author: Intlayer
+  url: https://intlayer.org
+  license: Apache-2.0
+  mcp-server: "@intlayer/mcp"
+  category: productivity
+  tags: [i18n]
+  documentation: https://intlayer.org/doc
+  support: contact@intlayer.org
 ---
 
 # Intlayer Usage
@@ -12,87 +21,6 @@ To use Intlayer effectively:
 2.  **Declare Content**:
     We recommend creating one content declaration file per component, located alongside the component file. This keeps translations close to the code.
 
-    **Example Directory Structure:**
-
-    ```
-    src/
-    ├── components/
-    │   ├── MyComponent/
-    │   │   ├── index.content.ts          # Content declaration
-    │   │   └── index.tsx                 # Component
-    │   ├── MyOtherComponent.content.ts   # Content declaration
-    │   └── MyOtherComponent.tsx          # Component
-    ```
-
-    **Content Templates:**
-
-    _TypeScript (.content.ts)_
-
-    ```typescript
-    import { t, type Dictionary } from "intlayer";
-
-    const content = {
-      key: "my-component-key",
-      content: {
-        title: t({
-          en: "Hello World",
-          es: "Hola Mundo",
-        }),
-        description: "My description text",
-      },
-    } satisfies Dictionary;
-
-    export default content;
-    ```
-
-    _TypeScript with React (.content.tsx)_
-
-    ```tsx
-    import { t, type Dictionary } from "intlayer";
-    import { ReactNode } from "react";
-
-    const content = {
-      key: "my-component-key",
-      content: {
-        description: t<ReactNode>({
-          en: <>My description text</>,
-          es: <>Mi descripción de texto</>,
-        }),
-      },
-    } satisfies Dictionary;
-
-    export default content;
-    ```
-
-    ```json
-    {
-      "key": "my-component-key",
-      "content": {
-        "title": {
-          "en": "Hello World",
-          "fr": "Bonjour le monde"
-        }
-      }
-    }
-    ```
-
-    ```javascript
-    import { t } from "intlayer";
-
-    export default {
-      key: "my-component-key",
-      content: {
-        title: t({
-          en: "Hello World",
-          fr: "Bonjour le monde",
-        }),
-      },
-    };
-    ```
-
-    - [Content Declaration Documentation](https://intlayer.org/doc/concept/content.md)
-    - [Content File Format](https://intlayer.org/doc/concept/content/file.md)
-
 3.  **Consume Content**: Use the provided hooks and functions to access your content.
     - [Intlayer Exports](https://intlayer.org/doc/packages/intlayer/exports.md)
     - [React Intlayer Exports](https://intlayer.org/doc/packages/react-intlayer/exports.md)
@@ -105,3 +33,10 @@ To use Intlayer effectively:
 4.  **CLI Commands**:
     Useful commands for managing your content:
     - `npx intlayer build`: Build the dictionaries from your content declarations.
+
+## References
+
+- [Get Started](https://intlayer.org/doc/get-started.md)
+- [How Intlayer Works](https://intlayer.org/doc/concept/how-works-intlayer.md)
+- [Why Intlayer](https://intlayer.org/doc/why.md)
+- [Per-locale File](https://intlayer.org/doc/concept/per-locale-file.md)