From 25f57c6310839aa2ccb1dd1107b00d1c5e2fb9c7 Mon Sep 17 00:00:00 2001
From: RedrockJS <smb.sochi@gmail.com>
Date: Sat, 1 Nov 2025 13:20:27 +0300
Subject: [PATCH] fix: update hoc

---
 docs/react/06-hocs.md | 36 ++++++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/docs/react/06-hocs.md b/docs/react/06-hocs.md
index a917685..d94bc79 100644
--- a/docs/react/06-hocs.md
+++ b/docs/react/06-hocs.md
@@ -41,4 +41,40 @@ Higher-Order Components (HOC) — это продвинутая техника 
 
 В остальных случаях, особенно в новых проектах, рекомендуется использовать хуки, так как они проще и удобнее.
 
+## Пример
+
+```jsx
+import React from 'react';
+
+// HOC: принимает компонент и возвращает новый
+function withLogger(WrappedComponent) {
+  return function WithLogger(props) {
+    console.log('Props:', props);
+
+    // можно добавить любую доп. логику
+    return <WrappedComponent {...props} />;
+  };
+}
+
+// Базовый компонент
+function Hello({ name }) {
+  return <h1>Hello, {name}!</h1>;
+}
+
+// Оборачиваем в HOC
+const HelloWithLogger = withLogger(Hello);
+
+// Использование
+export default function App() {
+  return <HelloWithLogger name="Tomas" />;
+}
+```
+🔍 Что здесь происходит:
+1. `withLogger` — это HOC, который принимает компонент `WrappedComponent`.
+2. Он возвращает новый компонент `WithLogger`, который:
+   - Логирует входящие props; 
+   - Рендерит исходный компонент, передавая ему те же `props`.
+3. В итоге `HelloWithLogger` ведёт себя как `Hello`, но с дополнительной функциональностью (логированием).
+
+
 🚀 **_Источник: DeepSeek_**
\ No newline at end of file