feat(docs): add collaborative example

Author: Ni55aN

content/en/examples/10.collaborative.md

@@ -0,0 +1,22 @@
+---
+image:
+  src: collaborative.gif
+description: Rreal-time collaborative node editor with this example featuring synchronized editing, live updates, and multi-user interactions. Enable multiple users to work together on the same node graph simultaneously
+keywords: collaborative,real-time,synchronization,multi-user
+navigation:
+  pro: true
+  preview: collaborative.gif
+---
+
+# Collaborative
+
+This example demonstrates a real-time collaborative node editor where multiple users can work on the same graph simultaneously. The implementation includes:
+
+- Real-time synchronization of node and connection changes
+- Live cursor tracking and user presence indicators
+
+The collaborative features are built using the Broadcast Channel API, enabling efficient real-time communication between multiple browser tabs or windows, ensuring smooth multi-user interactions without compromising the editor's performance.
+
+:proExample{src="https://retejs-colla.netlify.app"}
+
+Although this example was originally designed for React.js, the showcased feature is completely framework-agnostic. You can seamlessly integrate it into your application on a different stack by copying the feature module and connecting it into your editor.

content/uk/examples/10.collaborative.md

@@ -0,0 +1,22 @@
+---
+image:
+  src: collaborative.gif
+description: Редактор вузлів з можливостями колективної роботи в реальному часі з цим прикладом, що включає синхронізоване редагування, оновлення в режимі реального часу та багатокористувацькі взаємодії. Дозвольте кільком користувачам працювати разом над одним графом вузлів одночасно
+keywords: колективна робота,реальний час,синхронізація,багато користувачів
+navigation:
+  pro: true
+  preview: collaborative.gif
+---
+
+# Колективна робота
+
+Цей приклад демонструє редактор вузлів з колективною роботою в реальному часі, де кілька користувачів можуть працювати над одним графом одночасно. Реалізація включає:
+
+- Синхронізацію змін вузлів і з'єднань в реальному часі
+- Відстеження курсорів в реальному часі та індикатори присутності користувачів
+
+Функції колективної роботи побудовані з використанням Broadcast Channel API, що забезпечує ефективну комунікацію в реальному часі між кількома вкладками браузера або вікнами, гарантуючи плавну багатокористувацьку взаємодію без погіршення продуктивності редактора.
+
+:proExample{src="https://retejs-colla.netlify.app"}
+
+Хоча цей приклад був спочатку розроблений для React.js, продемонстрована функція є повністю незалежною від фреймворку. Ви можете легко інтегрувати її у свій додаток на іншому стеку, скопіювавши модуль функції та підключивши його до свого редактора.