diff options
-rw-r--r-- | docs/astro.config.mjs | 5 | ||||
-rw-r--r-- | docs/src/components/Search.css | 2 | ||||
-rw-r--r-- | docs/src/components/Search.tsx | 57 |
3 files changed, 26 insertions, 38 deletions
diff --git a/docs/astro.config.mjs b/docs/astro.config.mjs index 7ca85bf1b..b3e06ce66 100644 --- a/docs/astro.config.mjs +++ b/docs/astro.config.mjs @@ -2,8 +2,5 @@ export default { buildOptions: { site: 'https://docs.astro.build/', }, - renderers: [ - '@astrojs/renderer-preact', - '@astrojs/renderer-react', - ], + renderers: ['@astrojs/renderer-preact', '@astrojs/renderer-react'], }; diff --git a/docs/src/components/Search.css b/docs/src/components/Search.css index 53ca9bfd0..0b85299e9 100644 --- a/docs/src/components/Search.css +++ b/docs/src/components/Search.css @@ -90,4 +90,4 @@ .search-hint { display: flex; } -}
\ No newline at end of file +} diff --git a/docs/src/components/Search.tsx b/docs/src/components/Search.tsx index 066699fc1..af04829e9 100644 --- a/docs/src/components/Search.tsx +++ b/docs/src/components/Search.tsx @@ -1,31 +1,30 @@ /* jsxImportSource: react */ -import { useState, useCallback, useRef } from 'react' -import { createPortal } from 'react-dom' -import { DocSearchModal, useDocSearchKeyboardEvents } from '@docsearch/react' +import { useState, useCallback, useRef } from 'react'; +import { createPortal } from 'react-dom'; +import { DocSearchModal, useDocSearchKeyboardEvents } from '@docsearch/react'; import '@docsearch/css//dist/style.css'; import './Search.css'; - export 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]) + setIsOpen(true); + }, [setIsOpen]); const onClose = useCallback(() => { - setIsOpen(false) - }, [setIsOpen]) + setIsOpen(false); + }, [setIsOpen]); const onInput = useCallback( (e) => { - setIsOpen(true) - setInitialQuery(e.key) + setIsOpen(true); + setInitialQuery(e.key); }, [setIsOpen, setInitialQuery] - ) + ); useDocSearchKeyboardEvents({ isOpen, @@ -33,7 +32,7 @@ export function Search() { onClose, onInput, searchButtonRef, - }) + }); return ( <> @@ -43,11 +42,7 @@ export function Search() { onClick={onOpen} className="search-input" > - <svg - width="24" - height="24" - fill="none" - > + <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" @@ -56,12 +51,8 @@ export function Search() { strokeLinejoin="round" /> </svg> - <span> - Search - </span> - <span - className="search-hint" - > + <span>Search</span> + <span className="search-hint"> <span className="sr-only">Press </span> <kbd>/</kbd> <span className="sr-only"> to search</span> @@ -79,19 +70,19 @@ export function Search() { 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 a = document.createElement('a'); + a.href = item.url; console.log(a.hash); - const hash = a.hash === '#overview' ? '' : a.hash + const hash = a.hash === '#overview' ? '' : a.hash; return { ...item, url: `${a.pathname}${hash}`, - } - }) + }; + }); }} />, document.body )} </> - ) -}
\ No newline at end of file + ); +} |