@docusaurus/theme-search-algolia 2.0.0-beta.0e652730d → 2.0.0-beta.10

package/copyUntypedFiles.js

@@ -0,0 +1,20 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+const path = require('path');
+const fs = require('fs-extra');
+
+/**
+ * Copy all untyped and static assets files to lib.
+ */
+const srcDir = path.resolve(__dirname, 'src');
+const libDir = path.resolve(__dirname, 'lib');
+fs.copySync(srcDir, libDir, {
+  filter(filepath) {
+    return !/__tests__/.test(filepath) && !/\.tsx?$/.test(filepath);
+  },
+});

package/lib/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import type { DocusaurusContext, Plugin } from '@docusaurus/types';
+export default function theme(context: DocusaurusContext & {
+    baseUrl: string;
+}): Plugin<void>;
+export { validateThemeConfig } from './validateThemeConfig';

package/lib/index.js

@@ -0,0 +1,85 @@
+"use strict";
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateThemeConfig = void 0;
+const tslib_1 = require("tslib");
+const path_1 = (0, tslib_1.__importDefault)(require("path"));
+const fs_1 = (0, tslib_1.__importDefault)(require("fs"));
+const eta_1 = require("eta");
+const utils_1 = require("@docusaurus/utils");
+const theme_translations_1 = require("@docusaurus/theme-translations");
+const opensearch_1 = (0, tslib_1.__importDefault)(require("./templates/opensearch"));
+const lodash_1 = require("lodash");
+const getCompiledOpenSearchTemplate = (0, lodash_1.memoize)(() => (0, eta_1.compile)(opensearch_1.default.trim()));
+function renderOpenSearchTemplate(data) {
+    const compiled = getCompiledOpenSearchTemplate();
+    return compiled(data, eta_1.defaultConfig);
+}
+const OPEN_SEARCH_FILENAME = 'opensearch.xml';
+function theme(context) {
+    const { baseUrl, siteConfig: { title, url, favicon }, i18n: { currentLocale }, } = context;
+    const pageComponent = './theme/SearchPage/index.js';
+    const pagePath = (0, utils_1.getSwizzledComponent)(pageComponent) ||
+        path_1.default.resolve(__dirname, pageComponent);
+    return {
+        name: 'docusaurus-theme-search-algolia',
+        getPathsToWatch() {
+            return [pagePath];
+        },
+        getThemePath() {
+            return path_1.default.resolve(__dirname, './theme');
+        },
+        getTypeScriptThemePath() {
+            return path_1.default.resolve(__dirname, '..', 'src', 'theme');
+        },
+        getDefaultCodeTranslationMessages() {
+            return (0, theme_translations_1.readDefaultCodeTranslationMessages)({
+                locale: currentLocale,
+                name: 'theme-search-algolia',
+            });
+        },
+        async contentLoaded({ actions: { addRoute } }) {
+            addRoute({
+                path: (0, utils_1.normalizeUrl)([baseUrl, 'search']),
+                component: pagePath,
+                exact: true,
+            });
+        },
+        async postBuild({ outDir }) {
+            try {
+                fs_1.default.writeFileSync(path_1.default.join(outDir, OPEN_SEARCH_FILENAME), renderOpenSearchTemplate({
+                    title,
+                    url: url + baseUrl,
+                    favicon: favicon ? (0, utils_1.normalizeUrl)([url, baseUrl, favicon]) : null,
+                }));
+            }
+            catch (err) {
+                console.error(err);
+                throw new Error(`Generating OpenSearch file failed: ${err}`);
+            }
+        },
+        injectHtmlTags() {
+            return {
+                headTags: [
+                    {
+                        tagName: 'link',
+                        attributes: {
+                            rel: 'search',
+                            type: 'application/opensearchdescription+xml',
+                            title,
+                            href: (0, utils_1.normalizeUrl)([baseUrl, OPEN_SEARCH_FILENAME]),
+                        },
+                    },
+                ],
+            };
+        },
+    };
+}
+exports.default = theme;
+var validateThemeConfig_1 = require("./validateThemeConfig");
+Object.defineProperty(exports, "validateThemeConfig", { enumerable: true, get: function () { return validateThemeConfig_1.validateThemeConfig; } });

package/lib/templates/opensearch.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+declare const _default: "\n<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<OpenSearchDescription xmlns=\"http://a9.com/-/spec/opensearch/1.1/\"\n                       xmlns:moz=\"http://www.mozilla.org/2006/browser/search/\">\n  <ShortName><%= it.title %></ShortName>\n  <Description>Search <%= it.title %></Description>\n  <InputEncoding>UTF-8</InputEncoding>\n  <% if (it.favicon) { _%>\n    <Image width=\"16\" height=\"16\" type=\"image/x-icon\"><%= it.favicon %></Image>\n  <% } _%>\n  <Url type=\"text/html\" method=\"get\" template=\"<%= it.url %>search?q={searchTerms}\"/>\n  <Url type=\"application/opensearchdescription+xml\" rel=\"self\" template=\"<%= it.url %>opensearch.xml\" />\n  <moz:SearchForm><%= it.url %></moz:SearchForm>\n</OpenSearchDescription>\n";
+export default _default;

package/lib/templates/opensearch.js

@@ -0,0 +1,23 @@
+"use strict";
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = `
+<?xml version="1.0" encoding="UTF-8"?>
+<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/"
+                       xmlns:moz="http://www.mozilla.org/2006/browser/search/">
+  <ShortName><%= it.title %></ShortName>
+  <Description>Search <%= it.title %></Description>
+  <InputEncoding>UTF-8</InputEncoding>
+  <% if (it.favicon) { _%>
+    <Image width="16" height="16" type="image/x-icon"><%= it.favicon %></Image>
+  <% } _%>
+  <Url type="text/html" method="get" template="<%= it.url %>search?q={searchTerms}"/>
+  <Url type="application/opensearchdescription+xml" rel="self" template="<%= it.url %>opensearch.xml" />
+  <moz:SearchForm><%= it.url %></moz:SearchForm>
+</OpenSearchDescription>
+`;

package/lib/theme/SearchBar/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/// <reference types="react" />
+declare function SearchBar(): JSX.Element;
+export default SearchBar;

package/lib/theme/SearchBar/index.js

@@ -0,0 +1,153 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+import React, { useState, useRef, useCallback, useMemo } from 'react';
+import { createPortal } from 'react-dom';
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+import { useHistory } from '@docusaurus/router';
+import { useBaseUrlUtils } from '@docusaurus/useBaseUrl';
+import Link from '@docusaurus/Link';
+import Head from '@docusaurus/Head';
+import useSearchQuery from '@theme/hooks/useSearchQuery';
+import { isRegexpStringMatch } from '@docusaurus/theme-common';
+import { DocSearchButton, useDocSearchKeyboardEvents } from '@docsearch/react';
+import useAlgoliaContextualFacetFilters from '@theme/hooks/useAlgoliaContextualFacetFilters';
+import { translate } from '@docusaurus/Translate';
+import styles from './styles.module.css';
+let DocSearchModal = null;
+function Hit({ hit, children, }) {
+    return <Link to={hit.url}>{children}</Link>;
+}
+function ResultsFooter({ state, onClose }) {
+    const { generateSearchPageLink } = useSearchQuery();
+    return (<Link to={generateSearchPageLink(state.query)} onClick={onClose}>
+      See all {state.context.nbHits} results
+    </Link>);
+}
+function DocSearch({ contextualSearch, externalUrlRegex, ...props }) {
+    var _a, _b;
+    const { siteMetadata } = useDocusaurusContext();
+    const contextualSearchFacetFilters = useAlgoliaContextualFacetFilters();
+    const configFacetFilters = (_b = (_a = props.searchParameters) === null || _a === void 0 ? void 0 : _a.facetFilters) !== null && _b !== void 0 ? _b : [];
+    const facetFilters = contextualSearch
+        ? // Merge contextual search filters with config filters
+            [...contextualSearchFacetFilters, ...configFacetFilters]
+        : // ... or use config facetFilters
+            configFacetFilters;
+    // we let user override default searchParameters if he wants to
+    const searchParameters = {
+        ...props.searchParameters,
+        facetFilters,
+    };
+    const { withBaseUrl } = useBaseUrlUtils();
+    const history = useHistory();
+    const searchContainer = useRef(null);
+    const searchButtonRef = useRef(null);
+    const [isOpen, setIsOpen] = useState(false);
+    const [initialQuery, setInitialQuery] = useState(undefined);
+    const importDocSearchModalIfNeeded = useCallback(() => {
+        if (DocSearchModal) {
+            return Promise.resolve();
+        }
+        return Promise.all([
+            // @ts-ignore
+            import('@docsearch/react/modal'),
+            // @ts-ignore
+            import('@docsearch/react/style'),
+            import('./styles.css'),
+        ]).then(([{ DocSearchModal: Modal }]) => {
+            DocSearchModal = Modal;
+        });
+    }, []);
+    const onOpen = useCallback(() => {
+        importDocSearchModalIfNeeded().then(() => {
+            searchContainer.current = document.createElement('div');
+            document.body.insertBefore(searchContainer.current, document.body.firstChild);
+            setIsOpen(true);
+        });
+    }, [importDocSearchModalIfNeeded, setIsOpen]);
+    const onClose = useCallback(() => {
+        var _a;
+        setIsOpen(false);
+        (_a = searchContainer.current) === null || _a === void 0 ? void 0 : _a.remove();
+    }, [setIsOpen]);
+    const onInput = useCallback((event) => {
+        importDocSearchModalIfNeeded().then(() => {
+            setIsOpen(true);
+            setInitialQuery(event.key);
+        });
+    }, [importDocSearchModalIfNeeded, setIsOpen, setInitialQuery]);
+    const navigator = useRef({
+        navigate({ itemUrl }) {
+            // Algolia results could contain URL's from other domains which cannot
+            // be served through history and should navigate with window.location
+            if (isRegexpStringMatch(externalUrlRegex, itemUrl)) {
+                window.location.href = itemUrl;
+            }
+            else {
+                history.push(itemUrl);
+            }
+        },
+    }).current;
+    const transformItems = useRef((items) => items.map((item) => {
+        // If Algolia contains a external domain, we should navigate without relative URL
+        if (isRegexpStringMatch(externalUrlRegex, item.url)) {
+            return item;
+        }
+        // We transform the absolute URL into a relative URL.
+        const url = new URL(item.url);
+        return {
+            ...item,
+            url: withBaseUrl(`${url.pathname}${url.hash}`),
+        };
+    })).current;
+    const resultsFooterComponent = useMemo(
+    // eslint-disable-next-line react/no-unstable-nested-components
+    () => (footerProps) => <ResultsFooter {...footerProps} onClose={onClose}/>, [onClose]);
+    const transformSearchClient = useCallback((searchClient) => {
+        searchClient.addAlgoliaAgent('docusaurus', siteMetadata.docusaurusVersion);
+        return searchClient;
+    }, [siteMetadata.docusaurusVersion]);
+    useDocSearchKeyboardEvents({
+        isOpen,
+        onOpen,
+        onClose,
+        onInput,
+        searchButtonRef,
+    });
+    const translatedSearchLabel = translate({
+        id: 'theme.SearchBar.label',
+        message: 'Search',
+        description: 'The ARIA label and placeholder for search button',
+    });
+    return (<>
+      <Head>
+        {/* This hints the browser that the website will load data from Algolia,
+        and allows it to preconnect to the DocSearch cluster. It makes the first
+        query faster, especially on mobile. */}
+        <link rel="preconnect" href={`https://${props.appId}-dsn.algolia.net`} crossOrigin="anonymous"/>
+      </Head>
+
+      <div className={styles.searchBox}>
+        <DocSearchButton onTouchStart={importDocSearchModalIfNeeded} onFocus={importDocSearchModalIfNeeded} onMouseOver={importDocSearchModalIfNeeded} onClick={onOpen} ref={searchButtonRef} translations={{
+            buttonText: translatedSearchLabel,
+            buttonAriaLabel: translatedSearchLabel,
+        }}/>
+      </div>
+
+      {isOpen &&
+            DocSearchModal &&
+            searchContainer.current &&
+            createPortal(<DocSearchModal onClose={onClose} initialScrollY={window.scrollY} initialQuery={initialQuery} navigator={navigator} transformItems={transformItems} hitComponent={Hit} resultsFooterComponent={resultsFooterComponent} transformSearchClient={transformSearchClient} {...props} searchParameters={searchParameters}/>, searchContainer.current)}
+    </>);
+}
+function SearchBar() {
+    const { siteConfig } = useDocusaurusContext();
+    // @ts-ignore
+    return <DocSearch {...siteConfig.themeConfig.algolia}/>;
+}
+export default SearchBar;

package/lib/theme/SearchBar/styles.css

@@ -0,0 +1,21 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+:root {
+  --docsearch-primary-color: var(--ifm-color-primary);
+  --docsearch-text-color: var(--ifm-font-color-base);
+}
+
+.DocSearch-Button {
+  margin: 0;
+  transition: all var(--ifm-transition-fast)
+    var(--ifm-transition-timing-default);
+}
+
+.DocSearch-Container {
+  z-index: calc(var(--ifm-z-index-fixed) + 1);
+}

package/lib/theme/SearchBar/styles.module.css

@@ -0,0 +1,20 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+@media (max-width: 996px) {
+  .searchBox {
+    position: absolute;
+    right: var(--ifm-navbar-padding-horizontal);
+  }
+}
+
+@media (min-width: 997px) {
+  .searchBox {
+    padding: var(--ifm-navbar-item-padding-vertical)
+      var(--ifm-navbar-item-padding-horizontal);
+  }
+}

package/lib/theme/SearchMetadata/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/// <reference types="react" />
+import type { SearchMetadataProps } from '@theme/SearchMetadata';
+declare function SearchMetadata({ locale, version, tag, }: SearchMetadataProps): JSX.Element;
+export default SearchMetadata;

package/lib/theme/SearchMetadata/index.js

@@ -0,0 +1,20 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import Head from '@docusaurus/Head';
+// Override default/agnostic SearchMetas to use Algolia-specific metadata
+function SearchMetadata({ locale, version, tag, }) {
+    // Seems safe to consider here the locale is the language,
+    // as the existing docsearch:language filter is afaik a regular string-based filter
+    const language = locale;
+    return (<Head>
+      {language && <meta name="docsearch:language" content={language}/>}
+      {version && <meta name="docsearch:version" content={version}/>}
+      {tag && <meta name="docsearch:docusaurus_tag" content={tag}/>}
+    </Head>);
+}
+export default SearchMetadata;

package/lib/theme/SearchPage/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/// <reference types="react" />
+declare function SearchPage(): JSX.Element;
+export default SearchPage;