docs(Combobox): add example: opening by focus (#3727)

closes #3724

src/components/Combobox/__stand__/Combobox.dev.stand.mdx

@@ -23,6 +23,7 @@ import { ComboboxExampleSelectAll } from './examples/ComboboxExampleSelectAll/Co
 import { ComboboxExampleSearchValue } from './examples/ComboboxExampleSearchValue/ComboboxExampleSearchValue';
 import { ComboboxExampleVirtualScroll } from './examples/ComboboxExampleVirtualScroll/ComboboxExampleVirtualScroll';
 import { ComboboxExampleDropdownOpen } from './examples/ComboboxExampleDropdownOpen/ComboboxExampleDropdownOpen';
+import { ComboboxExampleOpenByFocus } from './examples/ComboboxExampleOpenByFocus/ComboboxExampleOpenByFocus';
 import {
   ComboboxExampleIsLoading,
   ComboboxExampleIsLoadingOnScrollBottom,
@@ -1084,6 +1085,8 @@ const ComboboxExampleSelectAll = () => {
 - `onDropdownOpen` - колбек отрабатывающий каждый раз при открытии/закрытии
 - `ignoreOutsideClicksRefs` - список ссылок на элементы по которым игнорируется клики
 
+### Пример с расскрытием списка по кнопке
+
 ```tsx
 type Item = {
   label: string;
@@ -1151,6 +1154,67 @@ const ComboboxExampleDropdownOpen = () => {
 
 <ComboboxExampleDropdownOpen />
 
+### Пример с расскрытием списка по фокусу
+
+```tsx
+type Item = {
+  label: string;
+  id: number;
+};
+
+const items: Item[] = [
+  {
+    label: 'Первый',
+    id: 1,
+  },
+  {
+    label: 'Второй',
+    id: 2,
+  },
+  {
+    label: 'Третий',
+    id: 3,
+  },
+];
+
+export function ComboboxExampleOpenByFocus() {
+  const [value, setValue] = useState<Item | null>();
+  const [isOpened, setIsOpened] = useFlag();
+  const inputRef = useRef<HTMLInputElement>(null);
+
+  const handleFocus = () => {
+    inputRef.current?.focus();
+  };
+
+  // Запрещаем всплытие клика c input, чтобы предотвратить рассинхронизацию isOpened
+  // с внутренним состоянием раскрытия списка. Так как клик по компоненту переключает состояние скрыт/раскрыт,
+  // нам при фокусе требуется не переключение (toggle), а включение (setTrue)
+  useEffect(() => {
+    if (inputRef.current) {
+      inputRef.current.onclick = (e) => e.stopPropagation();
+    }
+  }, [inputRef.current]);
+
+  return (
+    <Example col={1}>
+      <Button onClick={handleFocus} label="Эмулировать фокус на элемент" />
+      <Combobox
+        inputRef={inputRef}
+        items={items}
+        value={value}
+        onChange={setValue}
+        placeholder="Выберите элемент"
+        dropdownOpen={isOpened}
+        onDropdownOpen={setIsOpened.set}
+        onFocus={setIsOpened.on}
+      />
+    </Example>
+  );
+}
+```
+
+<ComboboxExampleOpenByFocus />
+
 ## Кастомизация
 
 ### Кастомный элемент списка

src/components/Combobox/__stand__/examples/ComboboxExampleOpenByFocus/ComboboxExampleOpenByFocus.tsx

@@ -0,0 +1,61 @@
+import { Example } from '@consta/stand';
+import React, { useEffect, useRef, useState } from 'react';
+
+import { Button } from '##/components/Button';
+import { Combobox } from '##/components/Combobox';
+import { useFlag } from '##/hooks/useFlag';
+
+type Item = {
+  label: string;
+  id: number;
+};
+
+const items: Item[] = [
+  {
+    label: 'Первый',
+    id: 1,
+  },
+  {
+    label: 'Второй',
+    id: 2,
+  },
+  {
+    label: 'Третий',
+    id: 3,
+  },
+];
+
+export function ComboboxExampleOpenByFocus() {
+  const [value, setValue] = useState<Item | null>();
+  const [isOpened, setIsOpened] = useFlag();
+  const inputRef = useRef<HTMLInputElement>(null);
+
+  const handleFocus = () => {
+    inputRef.current?.focus();
+  };
+
+  // Запрещаем всплытие клика c input, чтобы предотвратить рассинхронизацию isOpened
+  // с внутренним состоянием раскрытия списка. Так как клик по компоненту переключает состояние скрыт/раскрыт,
+  // нам при фокусе требуется не переключение (toggle), а включение (setTrue)
+  useEffect(() => {
+    if (inputRef.current) {
+      inputRef.current.onclick = (e) => e.stopPropagation();
+    }
+  }, [inputRef.current]);
+
+  return (
+    <Example col={1}>
+      <Button onClick={handleFocus} label="Эмулировать фокус на элемент" />
+      <Combobox
+        inputRef={inputRef}
+        items={items}
+        value={value}
+        onChange={setValue}
+        placeholder="Выберите элемент"
+        dropdownOpen={isOpened}
+        onDropdownOpen={setIsOpened.set}
+        onFocus={setIsOpened.on}
+      />
+    </Example>
+  );
+}