Use accessible indentation (#2253)

1 files changed, 62 insertions, 62 deletions

diff --git a/examples/docs/src/components/Header/Search.tsx b/examples/docs/src/components/Header/Search.tsx
index 158f6fe29..cfee83d04 100644
--- a/examples/docs/src/components/Header/Search.tsx
+++ b/examples/docs/src/components/Header/Search.tsx
@@ -7,71 +7,71 @@ import '@docsearch/css/dist/style.css';
 import './Search.css';
 
 export default function Search() {
-  const [isOpen, setIsOpen] = useState(false);
-  const searchButtonRef = useRef();
-  const [initialQuery, setInitialQuery] = useState(null);
+	const [isOpen, setIsOpen] = useState(false);
+	const searchButtonRef = useRef();
+	const [initialQuery, setInitialQuery] = useState(null);
 
-  const onOpen = useCallback(() => {
-    setIsOpen(true);
-  }, [setIsOpen]);
+	const onOpen = useCallback(() => {
+		setIsOpen(true);
+	}, [setIsOpen]);
 
-  const onClose = useCallback(() => {
-    setIsOpen(false);
-  }, [setIsOpen]);
+	const onClose = useCallback(() => {
+		setIsOpen(false);
+	}, [setIsOpen]);
 
-  const onInput = useCallback(
-    (e) => {
-      setIsOpen(true);
-      setInitialQuery(e.key);
-    },
-    [setIsOpen, setInitialQuery]
-  );
+	const onInput = useCallback(
+		(e) => {
+			setIsOpen(true);
+			setInitialQuery(e.key);
+		},
+		[setIsOpen, setInitialQuery]
+	);
 
-  useDocSearchKeyboardEvents({
-    isOpen,
-    onOpen,
-    onClose,
-    onInput,
-    searchButtonRef,
-  });
+	useDocSearchKeyboardEvents({
+		isOpen,
+		onOpen,
+		onClose,
+		onInput,
+		searchButtonRef,
+	});
 
-  return (
-    <>
-      <button type="button" ref={searchButtonRef} onClick={onOpen} className="search-input">
-        <svg width="24" height="24" fill="none">
-          <path d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
-        </svg>
-        <span>Search</span>
-        <span className="search-hint">
-          <span className="sr-only">Press </span>
-          <kbd>/</kbd>
-          <span className="sr-only"> to search</span>
-        </span>
-      </button>
-      {isOpen &&
-        createPortal(
-          <DocSearchModal
-            initialQuery={initialQuery}
-            initialScrollY={window.scrollY}
-            onClose={onClose}
-            indexName={(CONFIG as any).ALGOLIA.indexName}
-            apiKey={(CONFIG as any).ALGOLIA.apiKey}
-            transformItems={(items) => {
-              return items.map((item) => {
-                // We transform the absolute URL into a relative URL to
-                // work better on localhost, preview URLS.
-                const a = document.createElement('a');
-                a.href = item.url;
-                const hash = a.hash === '#overview' ? '' : a.hash;
-                return {
-                  ...item,
-                  url: `${a.pathname}${hash}`,
-                };
-              });
-            }}
-          />,
-          document.body
-        )}
-    </>
-  );
+	return (
+		<>
+			<button type="button" ref={searchButtonRef} onClick={onOpen} className="search-input">
+				<svg width="24" height="24" fill="none">
+					<path d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+				</svg>
+				<span>Search</span>
+				<span className="search-hint">
+					<span className="sr-only">Press </span>
+					<kbd>/</kbd>
+					<span className="sr-only"> to search</span>
+				</span>
+			</button>
+			{isOpen &&
+				createPortal(
+					<DocSearchModal
+						initialQuery={initialQuery}
+						initialScrollY={window.scrollY}
+						onClose={onClose}
+						indexName={(CONFIG as any).ALGOLIA.indexName}
+						apiKey={(CONFIG as any).ALGOLIA.apiKey}
+						transformItems={(items) => {
+							return items.map((item) => {
+								// We transform the absolute URL into a relative URL to
+								// work better on localhost, preview URLS.
+								const a = document.createElement('a');
+								a.href = item.url;
+								const hash = a.hash === '#overview' ? '' : a.hash;
+								return {
+									...item,
+									url: `${a.pathname}${hash}`,
+								};
+							});
+						}}
+					/>,
+					document.body
+				)}
+		</>
+	);
 }