GitHub/outline
1
0
Fork 0
mirror of https://github.com/outline/outline.git synced 2026-06-13 11:25:03 +03:00
Code Issues Packages Projects Releases Wiki Activity

Autofocus search input when opening icon picker (#9839)

Browse Source
This commit is contained in:
Hemachandar
2025-08-05 18:17:16 +05:30
committed by GitHub
parent b4757dfc6c
commit bf87f2dfee
3 changed files with 11 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/IconPicker/components/ColorPicker.tsx
+1
View File
@@ -136,6 +136,7 @@ const CustomColor = ({
maxLength={7}
value={value}
onChange={handleInputChange}
autoFocus
/>
</Flex>
);
app/components/IconPicker/components/EmojiPanel.tsx
+5 -4
View File
@@ -136,11 +136,12 @@ const EmojiPanel = ({
freqEmojis,
});
React.useEffect(() => {
if (scrollableRef.current) {
scrollableRef.current.scrollTop = 0;
React.useLayoutEffect(() => {
if (!panelActive) {
return;
}
searchRef.current?.focus();
scrollableRef.current?.scroll({ top: 0 });
requestAnimationFrame(() => searchRef.current?.focus());
}, [panelActive]);
return (
app/components/IconPicker/components/IconPanel.tsx
+5 -4
View File
@@ -155,11 +155,12 @@ const IconPanel = ({
baseIcons,
];
React.useEffect(() => {
if (scrollableRef.current) {
scrollableRef.current.scrollTop = 0;
React.useLayoutEffect(() => {
if (!panelActive) {
return;
}
searchRef.current?.focus();
scrollableRef.current?.scroll({ top: 0 });
requestAnimationFrame(() => searchRef.current?.focus());
}, [panelActive]);
return (