Fix conflicts (based on Sync with react.dev @ 2c7798dc)

src/components/DocsFooter.tsx

@@ -87,11 +87,7 @@ function FooterLink({
       />
       <div className="flex flex-col overflow-hidden">
         <span className="text-sm font-bold tracking-wide no-underline uppercase text-secondary dark:text-secondary-dark group-focus:text-link dark:group-focus:text-link-dark group-focus:text-opacity-100">
-<<<<<<< HEAD
           {type === 'Previous' ? 'Предыдущая глава' : 'Следующая глава'}
-=======
-          {type === 'Previous' ? 'Previous' : 'Next'}
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
         </span>
         <span className="text-lg break-words group-hover:underline">
           {title}

src/content/learn/referencing-values-with-refs.md

@@ -464,11 +464,7 @@ export default function Toggle() {
 
 #### Исправьте debouncing {/*fix-debouncing*/}
 
-<<<<<<< HEAD
-В данном примере все обработчики событий для кнопок являются ["debounced".](https://redd.one/blog/debounce-vs-throttle) Чтобы понять, как это работает, кликните на одну из кнопок. Обратите внимание, что сообщение появляется через секунду. Если нажать на кнопку во время ожидания сообщения, таймер сбросится. Таким образом, если вы продолжите кликать одну и ту же кнопку много раз, сообщение не появится до тех пор, пока не пройдёт секунда _после_ последнего клика. Debouncing позволяет вам установить задержку до тех пор, пока пользователь «не прекратит делать что-то», прежде чем произойдёт какое-то действие.
-=======
-In this example, all button click handlers are ["debounced".](https://kettanaito.com/blog/debounce-vs-throttle) To see what this means, press one of the buttons. Notice how the message appears a second later. If you press the button while waiting for the message, the timer will reset. So if you keep clicking the same button fast many times, the message won't appear until a second *after* you stop clicking. Debouncing lets you delay some action until the user "stops doing things".
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
+В данном примере все обработчики событий для кнопок являются ["debounced".](hhttps://kettanaito.com/blog/debounce-vs-throttle) Чтобы понять, как это работает, кликните на одну из кнопок. Обратите внимание, что сообщение появляется через секунду. Если нажать на кнопку во время ожидания сообщения, таймер сбросится. Таким образом, если вы продолжите кликать одну и ту же кнопку много раз, сообщение не появится до тех пор, пока не пройдёт секунда _после_ последнего клика. Debouncing позволяет вам установить задержку до тех пор, пока пользователь «не прекратит делать что-то», прежде чем произойдёт какое-то действие.
 
 Этот пример работает, но не совсем как было задумано. Кнопки не являются независимыми. Чтобы увидеть проблему, кликните на одну из кнопок и затем кликните на другую кнопку. Мы ожидаем увидеть два сообщения, которые привязаны к каждой кнопке. Но мы увидим только сообщение последней. Сообщение первой кнопки потерялось.
 

src/content/learn/synchronizing-with-effects.md

@@ -617,11 +617,7 @@ React намеренно повторно монтирует ваши компо
 
 Это позволяет видеть "✅ Подключение..." только один раз в режиме разработки, но не решает проблему.
 
-<<<<<<< HEAD
 Когда пользователь уходит со страницы, соединение всё равно не закрывается, и когда он возвращается, создаётся новое соединение. По мере того как пользователь перемещается по приложению, соединения будут накапливаться, так же как и до "исправления".
-=======
-When the user navigates away, the connection still isn't closed and when they navigate back, a new connection is created. As the user navigates across the app, the connections would keep piling up, the same as it would before the "fix".
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
 
 Чтобы устранить ошибку, недостаточно просто сделать так, чтобы Эффект срабатывал один раз. Эффект должен корректно работать после повторного монтирования, что означает, что соединение должно быть очищено, как в решении выше.
 
@@ -736,13 +732,8 @@ function TodoList() {
 
 Этот список недостатков не специфичен для React. Он применим к получению данных при монтировании с любой библиотекой. Как и с маршрутизацией, получение данных не является тривиальной задачей, поэтому мы рекомендуем следующие подходы:
 
-<<<<<<< HEAD
-- **Если вы используете [фреймворк](/learn/start-a-new-react-project#production-grade-react-frameworks), используйте его встроенный механизм получения данных.** Современные React-фреймворки имеют интегрированные механизмы получения данных, которые эффективны и не страдают от вышеупомянутых недостатков.
+- **Если вы используете [фреймворк](//learn/start-a-new-react-project#full-stack-frameworks), используйте его встроенный механизм получения данных.** Современные React-фреймворки имеют интегрированные механизмы получения данных, которые эффективны и не страдают от вышеупомянутых недостатков.
 - **В противном случае рассмотрите возможность использования или создания кэша на стороне клиента.** Популярные решения с открытым исходным кодом включают [React Query](https://tanstack.com/query/latest), [useSWR](https://swr.vercel.app/) и [React Router 6.4+.](https://beta.reactrouter.com/en/main/start/overview) Вы также можете создать собственное решение, в этом случае вы будете использовать Эффекты под капотом, но добавите логику, чтобы устранить дублирование запросов, кэширования ответов и избежать сетевые водопады (предзагружая данные или поднимая требования к данным к маршрутам).
-=======
-- **If you use a [framework](/learn/start-a-new-react-project#full-stack-frameworks), use its built-in data fetching mechanism.** Modern React frameworks have integrated data fetching mechanisms that are efficient and don't suffer from the above pitfalls.
-- **Otherwise, consider using or building a client-side cache.** Popular open source solutions include [React Query](https://tanstack.com/query/latest), [useSWR](https://swr.vercel.app/), and [React Router 6.4+.](https://beta.reactrouter.com/en/main/start/overview) You can build your own solution too, in which case you would use Effects under the hood, but add logic for deduplicating requests, caching responses, and avoiding network waterfalls (by preloading data or hoisting data requirements to routes).
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
 
 Вы можете продолжать получать данные напрямую в Эффектах, если ни один из этих подходов вам не подходит.
 
@@ -1013,13 +1004,8 @@ import { useEffect, useRef } from 'react';
 export default function MyInput({ value, onChange }) {
   const ref = useRef(null);
 
-<<<<<<< HEAD
   // TODO: Это не совсем работает. Исправьте это.
-  // ref.current.focus()    
-=======
-  // TODO: This doesn't quite work. Fix it.
   // ref.current.focus()
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
 
   return (
     <input

src/content/learn/thinking-in-react.md

@@ -37,15 +37,9 @@ JSON API возвращает данные, которые выглядят та
 
 Вы можете подходить к разбиению дизайна на компоненты по-разному, основываясь на вашем опыте:
 
-<<<<<<< HEAD
-* **Программирование** -- используйте тот же подход, как при решении создать простую функцию или целый объект. Можно применить [принцип единственной ответственности:](https://ru.wikipedia.org/wiki/%D0%9F%D1%80%D0%B8%D0%BD%D1%86%D0%B8%D0%BF_%D0%B5%D0%B4%D0%B8%D0%BD%D1%81%D1%82%D0%B2%D0%B5%D0%BD%D0%BD%D0%BE%D0%B9_%D0%BE%D1%82%D0%B2%D0%B5%D1%82%D1%81%D1%82%D0%B2%D0%B5%D0%BD%D0%BD%D0%BE%D1%81%D1%82%D0%B8) каждый компонент должен заниматься какой-то одной задачей. Если функциональность компонента увеличивается с течением времени, его следует разбить на более мелкие подкомпоненты.
+* **Программирование** -- используйте тот же подход, как при решении создать простую функцию или целый объект. Можно применить [принцип единственной ответственности:](https://ru.wikipedia.org/wiki/%D0%A0%D0%B0%D0%B7%D0%B4%D0%B5%D0%BB%D0%B5%D0%BD%D0%B8%D0%B5_%D0%BE%D1%82%D0%B2%D0%B5%D1%82%D1%81%D1%82%D0%B2%D0%B5%D0%BD%D0%BD%D0%BE%D1%81%D1%82%D0%B8) каждый компонент должен заниматься какой-то одной задачей. Если функциональность компонента увеличивается с течением времени, его следует разбить на более мелкие подкомпоненты.
 * **CSS** -- подумайте, для чего бы вы сделали селекторы класса. (Помните, что компоненты не настолько узкие.)
 * **Дизайн** -- подумайте, как бы вы организовали слои дизайна.
-=======
-* **Programming**--use the same techniques for deciding if you should create a new function or object. One such technique is the [separation of concerns](https://en.wikipedia.org/wiki/Separation_of_concerns), that is, a component should ideally only be concerned with one thing. If it ends up growing, it should be decomposed into smaller subcomponents. 
-* **CSS**--consider what you would make class selectors for. (However, components are a bit less granular.)
-* **Design**--consider how you would organize the design's layers.
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
 
 Хорошая структура у JSON часто уже отражает структуру компонентов на вашем UI. Это происходит из-за того, что у UI и модели данных часто похожая информационная архитектура. Разбейте UI на компоненты, каждый из которых отображает часть модели данных.
 

src/content/learn/understanding-your-ui-as-a-tree.md

@@ -20,11 +20,7 @@ React, как и многие другие библиотеки, моделир
 
 ## UI в виде дерева {/*your-ui-as-a-tree*/}
 
-<<<<<<< HEAD
 Дерево — это модель отношений между элементами, и UI часто использует эту структуру. Например, браузеры используют тот же подход для построения HTML ([DOM](https://developer.mozilla.org/docs/Web/API/Document_Object_Model/Introduction)) и CSS ([CSSOM](https://developer.mozilla.org/docs/Web/API/CSS_Object_Model)). Мобильные платформы так же используют структуру дерева для своей иерархии.
-=======
-Trees are a relationship model between items. The UI is often represented using tree structures. For example, browsers use tree structures to model HTML ([DOM](https://developer.mozilla.org/docs/Web/API/Document_Object_Model/Introduction)) and CSS ([CSSOM](https://developer.mozilla.org/docs/Web/API/CSS_Object_Model)). Mobile platforms also use trees to represent their view hierarchy.
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
 
 <Diagram name="preserving_state_dom_tree" height={193} width={864} alt="Схема с тремя горизонтально расположенными секциями. В первом разделе вертикально расположены три прямоугольника: 'Component A', 'Component B', и 'Component C'. Переход к следующей панели — это стрелка с логотипом React сверху и надписью 'React'. Средний раздел содержит дерево компонентов с корнем, обозначенным 'A', и двумя дочерними элементами, обозначенными 'B' и 'C'. Переход к следующему разделу снова осуществляется с помощью стрелки с логотипом React сверху и надписью 'React'. Последний, третий раздел, представляет собой каркас браузера, содержащий дерево из 8 узлов, в котором выделено только подмножество (с указанием поддерева из среднего раздела).">
 

src/content/reference/react-dom/components/option.md

@@ -36,11 +36,7 @@ title: "<option>"
 
 #### Пропсы {/*props*/}
 
-<<<<<<< HEAD
-`<option>` поддерживает все [пропсы общих HTML-элементов.](/reference/react-dom/components/common#props)
-=======
-`<option>` supports all [common element props.](/reference/react-dom/components/common#common-props)
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
+`<option>` поддерживает все [пропсы общих HTML-элементов.](/reference/react-dom/components/common#common-props)
 
 Кроме того, `<option>` поддерживает следующие пропсы:
 

src/content/reference/react-dom/components/progress.md

@@ -30,11 +30,7 @@ title: "<progress>"
 
 #### Пропсы {/*props*/}
 
-<<<<<<< HEAD
-`<progress>` поддерживает все [пропсы общих HTML-элементов.](/reference/react-dom/components/common#props)
-=======
-`<progress>` supports all [common element props.](/reference/react-dom/components/common#common-props)
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
+`<progress>` поддерживает все [пропсы общих HTML-элементов.](/reference/react-dom/components/common#common-props)
 
 Кроме того, `<progress>` поддерживает следующие пропсы:
 

src/content/reference/react-dom/createPortal.md

@@ -50,11 +50,7 @@ import { createPortal } from 'react-dom';
 
 * `domNode`: DOM-элемент (например, возвращённый `document.getElementById()`). Он должен существовать к моменту рендера. Если при обновлении передать другой DOM-узел — содержимое портала будет пересоздано.
 
-<<<<<<< HEAD
-* **необязательный** `key`: Уникальная строка или число, используемые как [key](/learn/rendering-lists/#keeping-list-items-in-order-with-key) для портала.
-=======
-* **optional** `key`: A unique string or number to be used as the portal's [key.](/learn/rendering-lists#keeping-list-items-in-order-with-key)
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
+* **необязательный** `key`: Уникальная строка или число, используемые как [key](/learn/rendering-lists#keeping-list-items-in-order-with-key) для портала.
 
 #### Возвращаемое значение {/*returns*/}
 
@@ -245,11 +241,7 @@ export default function ModalContent({ onClose }) {
 
 Важно убедиться, что при использовании порталов ваше приложение остаётся доступным. Например, вам может потребоваться управлять фокусом клавиатуры, чтобы пользователь мог перемещать фокус внутрь и наружу из портала естественным способом.
 
-<<<<<<< HEAD
 Следуйте [рекомендациям WAI-ARIA по созданию модальных окон](https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal). Если вы используете готовую библиотеку, убедитесь, что она поддерживает доступность и следует этим рекомендациям.
-=======
-Follow the [WAI-ARIA Modal Authoring Practices](https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal) when creating modals. If you use a community package, ensure that it is accessible and follows these guidelines.
->>>>>>> 2c7798dcc51fbd07ebe41f49e5ded4839a029f72
 
 </Pitfall>