diff --git a/packages/dev/docs/package.json b/packages/dev/docs/package.json index 0671825634e..6b00f50750a 100644 --- a/packages/dev/docs/package.json +++ b/packages/dev/docs/package.json @@ -24,9 +24,7 @@ "@spectrum-icons/illustrations": "^3.1.0", "@spectrum-icons/ui": "^3.1.0", "@spectrum-icons/workflow": "^4.0.0", - "algoliasearch": "^4.14.1", "clsx": "^2.0.0", - "dompurify": "^3.2.4", "globals-docs": "^2.4.1", "highlight.js": "9.18.1", "markdown-to-jsx": "^6.11.0", diff --git a/packages/dev/docs/src/DocSearch.js b/packages/dev/docs/src/DocSearch.js deleted file mode 100644 index d23099eea71..00000000000 --- a/packages/dev/docs/src/DocSearch.js +++ /dev/null @@ -1,337 +0,0 @@ -import algoliasearch from 'algoliasearch/lite'; -import docsStyle from './docs.css'; -import DocumentOutline from '@spectrum-icons/workflow/DocumentOutline'; -import DOMPurify from 'dompurify'; -import {Icon} from '@react-spectrum/icon'; -import {Item, SearchAutocomplete, Section} from '@react-spectrum/autocomplete'; -import News from '@spectrum-icons/workflow/News'; -import React, {useEffect, useRef, useState} from 'react'; -import {Text} from '@adobe/react-spectrum'; -import {ThemeProvider} from './ThemeSwitcher'; - -let client = algoliasearch('1V1Q59JVTR', '44a7e2e7508ff185f25ac64c0a675f98'); -let searchIndex = client.initIndex('react-spectrum'); - -const searchOptions = { - distinct: 1, - attributesToRetrieve: [ - 'hierarchy.lvl0', - 'hierarchy.lvl1', - 'hierarchy.lvl2', - 'hierarchy.lvl3', - 'hierarchy.lvl4', - 'hierarchy.lvl5', - 'hierarchy.lvl6', - 'content', - 'type', - 'url' - ], - attributesToSnippet: [ - 'hierarchy.lvl1:10', - 'hierarchy.lvl2:10', - 'hierarchy.lvl3:10', - 'hierarchy.lvl4:10', - 'hierarchy.lvl5:10', - 'hierarchy.lvl6:10', - 'content:10' - ], - snippetEllipsisText: '…', - highlightPreTag: ``, - highlightPostTag: '', - hitsPerPage: 20 -}; - -const sectionTitles = { - 'react-aria': 'React Aria', - 'react-spectrum': 'React Spectrum', - 'react-stately': 'React Stately', - 'internationalized': 'Internationalized', - 'blog': 'Blog', - 'architecture': 'Architecture', - 'contribute': 'Contribute', - 'releases': 'Releases', - 'support': 'Support' -}; - -function sectionTitlePredicate(hit) { - let sectionTitle; - for (const [path, title] of Object.entries(sectionTitles)) { - let regexp = new RegExp('^.+//.+/' + path + '[/.].+$', 'i'); - if (hit.url.match(regexp)) { - sectionTitle = title; - break; - } - } - if (!sectionTitle) { - sectionTitle = 'Documentation'; - } - return sectionTitle; -} - -export default function DocSearch() { - const [searchValue, setSearchValue] = useState(''); - const [loadingState, setLoadingState] = useState(null); - const [predictions, setPredictions] = useState(null); - const [suggestions, setSuggestions] = useState([]); - - const searchAutocompleteRef = useRef(); - - useEffect(() => { - // Focus search input when user presses Ctrl/Cmd + K - let handleKeyDown = (e) => { - if ((e.ctrlKey || e.metaKey) && e.key === 'k') { - e.preventDefault(); - searchAutocompleteRef.current.focus(); - } - }; - - document.addEventListener('keydown', handleKeyDown); - - return () => { - document.removeEventListener('keydown', handleKeyDown); - }; - }, []); - - let updatePredictions = ({hits}) => { - setPredictions(hits); - - const groupedBySection = groupBy(hits, (hit) => sectionTitlePredicate(hit)); - let sections = []; - for (const [title, hits] of Object.entries(groupedBySection)) { - const items = Object.values( - groupBy(hits, (hit) => hit.hierarchy.lvl1) - ) - .map( - groupedHits => - groupedHits.map((hit) => { - const hierarchy = hit.hierarchy; - const objectID = hit.objectID; - const docsearchParent = hit.type !== 'lvl1' && - groupedHits.find( - (siblingItem) => - siblingItem.type === 'lvl1' && - siblingItem.hierarchy.lvl1 === - hit.hierarchy.lvl1 - ); - - return { - key: objectID, - hit, - hierarchy, - docsearchParent, - textValue: hit.type === 'content' ? hit[hit.type] : hierarchy[hit.type], - href: `${window.location.hostname === 'reactspectrum.blob.core.windows.net' ? window.location.href.replace(/(.+\/docs\/)(.+)/, '$1') : '/'}${hit.url.replace('https://react-spectrum.adobe.com/', '')}` - }; - } - )); - - sections.push({title, items: items.map((item) => item[0])}); - } - let newSuggestions = sections.map((section) => ({key: section.title, title: section.title, children: section.items})); - newSuggestions.push({ - key: 'algolia-footer', - title: 'Search by', - children: [ - { - key: 'algolia-footer-logo', - textValue: 'Algolia', - href: 'https://www.algolia.com/ref/docsearch/?utm_source=react-spectrum.adobe.com&utm_medium=referral&utm_content=powered_by&utm_campaign=docsearch' - } - ] - }); - setSuggestions(newSuggestions); - setLoadingState(null); - }; - - let onInputChange = (query) => { - setSearchValue(query); - if (!query && predictions) { - setPredictions(null); - setSuggestions([]); - setLoadingState(null); - return; - } - setLoadingState('filtering'); - searchIndex - .search( - query, - searchOptions - ) - .then(updatePredictions); - }; - - return ( - - - { - if (isOpen) { - document.body.classList.add(docsStyle['docsearch-open']); - } else { - document.body.classList.remove(docsStyle['docsearch-open']); - } - }}> - {(section) => ( -
- {(item) => ( - - {item.key === 'algolia-footer-logo' && ( - - - - - - )} - { - item.hierarchy && - item.hierarchy[item.hit.type] && - item.hit.type === 'lvl1' && ( - <> - { - section.title === 'Blog' || section.title === 'Releases' ? - : - - } - - - - {item.hit.content && ( - - - - )} - - ) - } - - { - item.hierarchy && item.hierarchy[item.hit.type] && - ( - item.hit.type === 'lvl2' || - item.hit.type === 'lvl3' || - item.hit.type === 'lvl4' || - item.hit.type === 'lvl5' || - item.hit.type === 'lvl6' - ) && ( - <> - - - - - - - - - ) - } - - { - item.hit && item.hit.type === 'content' && ( - <> - - - - - - - - - ) - } - - )} -
- )} -
-
-
- ); -} - -function Hash(props) { - return ( - - - - - - ); -} - -function groupBy(values, predicate = (value) => value) { - return values.reduce((accumulator, item) => { - const key = predicate(item); - - if (!Object.prototype.hasOwnProperty.call(accumulator, key)) { - accumulator[key] = []; - } - - // We limit each section to show 20 hits maximum. - // This acts as a frontend alternative to `distinct`. - if (accumulator[key].length < 21) { - accumulator[key].push(item); - } - - return accumulator; - }, {}); -} - -function getPropertyByPath(object, path) { - const parts = path.split('.'); - - return parts.reduce((prev, current) => { - if (prev?.[current]) { - return prev[current]; - } - return null; - }, object); -} - -function Snippet({ - hit, - attribute, - tagName = 'span', - ...rest -}) { - return React.createElement(tagName, { - ...rest, - dangerouslySetInnerHTML: { - __html: - DOMPurify.sanitize( - getPropertyByPath(hit, `_snippetResult.${attribute}.value`) || - getPropertyByPath(hit, attribute) - ) - } - }); -} - - diff --git a/packages/dev/docs/src/client.js b/packages/dev/docs/src/client.js index f92f63fa291..c709e3ed8bc 100644 --- a/packages/dev/docs/src/client.js +++ b/packages/dev/docs/src/client.js @@ -11,7 +11,6 @@ */ import {ActionButton, Flex, Link} from '@adobe/react-spectrum'; -import DocSearch from './DocSearch'; import docsStyle from './docs.css'; import LinkOut from '@spectrum-icons/workflow/LinkOut'; import {listen} from 'quicklink'; @@ -192,7 +191,6 @@ let pageHeader = document.querySelector('.' + docsStyle.pageHeader); if (pageHeader) { ReactDOM.createRoot(pageHeader).render(<> - ); } else { diff --git a/yarn.lock b/yarn.lock index 9de9e8eb17e..a2ec3563340 100644 --- a/yarn.lock +++ b/yarn.lock @@ -184,138 +184,6 @@ __metadata: languageName: node linkType: hard -"@algolia/cache-browser-local-storage@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/cache-browser-local-storage@npm:4.14.1" - dependencies: - "@algolia/cache-common": "npm:4.14.1" - checksum: 10c0/a4fbfd2d27fcb3043259a1dd32e03439fffef0f3e52219cc4178adb3a7a2c2be0220683501b3c51a416ae391751b3d00fdd90967b6e1e1c03c8b3ce5da879bb2 - languageName: node - linkType: hard - -"@algolia/cache-common@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/cache-common@npm:4.14.1" - checksum: 10c0/37c9fe19e01306bb3e309fc3a0bd35b2254f0c42ffe7b52127653cda2f4cda4c2216907d8ebeebc67be8be5ee8be2aa0d8bdcf1ec172b139b34ef74d778dea39 - languageName: node - linkType: hard - -"@algolia/cache-in-memory@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/cache-in-memory@npm:4.14.1" - dependencies: - "@algolia/cache-common": "npm:4.14.1" - checksum: 10c0/50aff0b8dac58c80272db71ef0788f074f692f1029ead29579069919c398674569fef81fa81d695e59d96fe34e6882b4b882ffbc8b2cbe40a864d83b711d1b07 - languageName: node - linkType: hard - -"@algolia/client-account@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/client-account@npm:4.14.1" - dependencies: - "@algolia/client-common": "npm:4.14.1" - "@algolia/client-search": "npm:4.14.1" - "@algolia/transporter": "npm:4.14.1" - checksum: 10c0/ae791faa36d7bcea4dfc58604116e9765143b6d3abb351ac4065102069115bd41eb712e40b65a1508c9b31e323646750580b1b72db241cc4a4f8f3608e96a221 - languageName: node - linkType: hard - -"@algolia/client-analytics@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/client-analytics@npm:4.14.1" - dependencies: - "@algolia/client-common": "npm:4.14.1" - "@algolia/client-search": "npm:4.14.1" - "@algolia/requester-common": "npm:4.14.1" - "@algolia/transporter": "npm:4.14.1" - checksum: 10c0/06c3b12cf9465075785ed54d628aa03fb337972ae6374be5565b5a05e22b6a30f037b3af76612b126f277df541532e74d3068dd9bf4ac2d2c15b5d56220e43df - languageName: node - linkType: hard - -"@algolia/client-common@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/client-common@npm:4.14.1" - dependencies: - "@algolia/requester-common": "npm:4.14.1" - "@algolia/transporter": "npm:4.14.1" - checksum: 10c0/5bc46d43f06bfa0b6c0327ed0170d2fc25beb801fc0e29d85e55f546c1c08e55da12bc89c99899e676ffe08051b052ed9e35a3860250c5369af50294a8d2707d - languageName: node - linkType: hard - -"@algolia/client-personalization@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/client-personalization@npm:4.14.1" - dependencies: - "@algolia/client-common": "npm:4.14.1" - "@algolia/requester-common": "npm:4.14.1" - "@algolia/transporter": "npm:4.14.1" - checksum: 10c0/9ee854dc086dae60ef985b4d5ef4bcd429bdb85e986d1aa22dd04dc4f0cbee2001989179ccb1e8ee98baf7b597974f31b209a07d1d88bceaddf7d8ac3764b127 - languageName: node - linkType: hard - -"@algolia/client-search@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/client-search@npm:4.14.1" - dependencies: - "@algolia/client-common": "npm:4.14.1" - "@algolia/requester-common": "npm:4.14.1" - "@algolia/transporter": "npm:4.14.1" - checksum: 10c0/ebb277bbc338feeff202268c9f4447ba3cba3fadd640c842d5c412689d63de941368fd93fb976ca3a2ee10be1782376d8223ca1103227c1db99dc122329d01c1 - languageName: node - linkType: hard - -"@algolia/logger-common@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/logger-common@npm:4.14.1" - checksum: 10c0/ae639def009e7e59d2d6e21bd1976712eb885826ee34e67966db1579ef92d56d11f671c887f2a859c8ad6353806437d51b7f9216ffddf0c8462bbd9aeeb2788f - languageName: node - linkType: hard - -"@algolia/logger-console@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/logger-console@npm:4.14.1" - dependencies: - "@algolia/logger-common": "npm:4.14.1" - checksum: 10c0/4401fac1deccfe543731612d2815313510eb36b71ebe4f31c80f2b7b223078bd50fbcc5b7a63d787dac09594f28530475f890779303e6924d6436527bd250d9f - languageName: node - linkType: hard - -"@algolia/requester-browser-xhr@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/requester-browser-xhr@npm:4.14.1" - dependencies: - "@algolia/requester-common": "npm:4.14.1" - checksum: 10c0/e400e28ab5970fe7c8033160142d9834f61262854b981a2da8d977b8ccb2011a75892ac096116192c273f09739ebd3cf3673e176a5f2f696a03f71b23959e6d8 - languageName: node - linkType: hard - -"@algolia/requester-common@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/requester-common@npm:4.14.1" - checksum: 10c0/3c4735866e23f24775b60e04cf1103bd36782e372ee056359430323e49b64e02d9e7d6c28a36cf38dc1630a3516b50a3d1d7f8f5bb6b4b302b2ef89daf988201 - languageName: node - linkType: hard - -"@algolia/requester-node-http@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/requester-node-http@npm:4.14.1" - dependencies: - "@algolia/requester-common": "npm:4.14.1" - checksum: 10c0/356a0f68f8c7f2e76c2e7b8e8ea6b3b5667d2cf432071259ae48785c0c4eb8875ef3e9fcca699dbee6b8d78ada13e4658720b70b22a6d667ba20bf44e70ca1f1 - languageName: node - linkType: hard - -"@algolia/transporter@npm:4.14.1": - version: 4.14.1 - resolution: "@algolia/transporter@npm:4.14.1" - dependencies: - "@algolia/cache-common": "npm:4.14.1" - "@algolia/logger-common": "npm:4.14.1" - "@algolia/requester-common": "npm:4.14.1" - checksum: 10c0/da408667e24b30003f6e7db46a07ba0f00787fbb6dcafab97051bdd9904f2b25e2dcaadd181bee7bbdecdd282585abc431358a0d24e7b212b99a6c319cb32af3 - languageName: node - linkType: hard - "@alloc/quick-lru@npm:^5.2.0": version: 5.2.0 resolution: "@alloc/quick-lru@npm:5.2.0" @@ -6951,9 +6819,7 @@ __metadata: "@spectrum-icons/illustrations": "npm:^3.1.0" "@spectrum-icons/ui": "npm:^3.1.0" "@spectrum-icons/workflow": "npm:^4.0.0" - algoliasearch: "npm:^4.14.1" clsx: "npm:^2.0.0" - dompurify: "npm:^3.2.4" globals-docs: "npm:^2.4.1" highlight.js: "npm:9.18.1" markdown-to-jsx: "npm:^6.11.0" @@ -10698,13 +10564,6 @@ __metadata: languageName: node linkType: hard -"@types/trusted-types@npm:^2.0.7": - version: 2.0.7 - resolution: "@types/trusted-types@npm:2.0.7" - checksum: 10c0/4c4855f10de7c6c135e0d32ce462419d8abbbc33713b31d294596c0cc34ae1fa6112a2f9da729c8f7a20707782b0d69da3b1f8df6645b0366d08825ca1522e0c - languageName: node - linkType: hard - "@types/unist@npm:*, @types/unist@npm:^2.0.0": version: 2.0.6 resolution: "@types/unist@npm:2.0.6" @@ -11487,28 +11346,6 @@ __metadata: languageName: node linkType: hard -"algoliasearch@npm:^4.14.1": - version: 4.14.1 - resolution: "algoliasearch@npm:4.14.1" - dependencies: - "@algolia/cache-browser-local-storage": "npm:4.14.1" - "@algolia/cache-common": "npm:4.14.1" - "@algolia/cache-in-memory": "npm:4.14.1" - "@algolia/client-account": "npm:4.14.1" - "@algolia/client-analytics": "npm:4.14.1" - "@algolia/client-common": "npm:4.14.1" - "@algolia/client-personalization": "npm:4.14.1" - "@algolia/client-search": "npm:4.14.1" - "@algolia/logger-common": "npm:4.14.1" - "@algolia/logger-console": "npm:4.14.1" - "@algolia/requester-browser-xhr": "npm:4.14.1" - "@algolia/requester-common": "npm:4.14.1" - "@algolia/requester-node-http": "npm:4.14.1" - "@algolia/transporter": "npm:4.14.1" - checksum: 10c0/020c0038e23af4ff239c54ec927c937d299c7d99434f67acd12671d92a85faae94c66cd18851330cd99f55288c69cff33e75ffa0c2aa77ded1292001d5175898 - languageName: node - linkType: hard - "almost-equal@npm:^1.1.0": version: 1.1.0 resolution: "almost-equal@npm:1.1.0" @@ -14885,18 +14722,6 @@ __metadata: languageName: node linkType: hard -"dompurify@npm:^3.2.4": - version: 3.3.0 - resolution: "dompurify@npm:3.3.0" - dependencies: - "@types/trusted-types": "npm:^2.0.7" - dependenciesMeta: - "@types/trusted-types": - optional: true - checksum: 10c0/66b1787b0bc8250d8f58e13284cf7f5f6bb400a0a55515e7a2a030316a4bb0d8306fdb669c17ed86ed58ff7e53c62b5da4488c2f261d11c58870fe01b8fcc486 - languageName: node - linkType: hard - "domutils@npm:^1.5.1": version: 1.7.0 resolution: "domutils@npm:1.7.0"