@backstage/plugin-search-react 0.1.0 → 0.2.0-next.2

package/CHANGELOG.md

@@ -1,5 +1,47 @@
 # @backstage/plugin-search-react
 
+## 0.2.0-next.2
+
+### Patch Changes
+
+- 3a74e203a8: Updated search result components to support rendering content with highlighted matched terms
+- Updated dependencies
+  - @backstage/plugin-search-common@0.3.4-next.0
+  - @backstage/core-plugin-api@1.0.2-next.1
+
+## 0.2.0-next.1
+
+### Minor Changes
+
+- bdbe620797: **BREAKING**: `SearchContextProviderForStorybook` and `SearchApiProviderForStorybook` has been deleted. New mock implementation of the `SearchApi` introduced. If you need to mock the api we recommend you to do the following:
+
+  ```tsx
+  import {
+    searchApiRef,
+    MockSearchApi,
+    SearchContextProvider,
+  } from '@backstage/plugin-search-react';
+  import { TestApiProvider } from '@backstage/test-utils';
+
+  <TestApiProvider apis={[[searchApiRef, new MockSearchApi()]]}>
+    <SearchContextProvider>
+      <Component />
+    </SearchContextProvider>
+  </TestApiProvider>;
+  ```
+
+### Patch Changes
+
+- Updated dependencies
+  - @backstage/core-plugin-api@1.0.2-next.0
+
+## 0.1.1-next.0
+
+### Patch Changes
+
+- 11a46863de: Export `useSearchContextCheck` hook to check if the search context is available
+- a307a14be0: Removed dependency on `@backstage/core-app-api`.
+
 ## 0.1.0
 
 ### Minor Changes

package/dist/index.d.ts

@@ -1,7 +1,8 @@
+/// <reference types="react" />
 import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
 import { SearchQuery, SearchResultSet } from '@backstage/plugin-search-common';
 import { JsonObject } from '@backstage/types';
-import React, { PropsWithChildren, ComponentProps } from 'react';
+import React, { PropsWithChildren } from 'react';
 import { AsyncState } from 'react-use/lib/useAsync';
 
 /**
@@ -14,6 +15,29 @@ declare const searchApiRef: _backstage_core_plugin_api.ApiRef<SearchApi>;
 interface SearchApi {
     query(query: SearchQuery): Promise<SearchResultSet>;
 }
+/**
+ * @public
+ *
+ * Search Api Mock that can be used in tests and storybooks
+ */
+declare class MockSearchApi implements SearchApi {
+    mockedResults?: SearchResultSet | undefined;
+    constructor(mockedResults?: SearchResultSet | undefined);
+    query(): Promise<SearchResultSet>;
+}
+
+/**
+ * @public
+ */
+declare type HighlightedSearchResultTextProps = {
+    text: string;
+    preTag: string;
+    postTag: string;
+};
+/**
+ * @public
+ */
+declare const HighlightedSearchResultText: ({ text, preTag, postTag, }: HighlightedSearchResultTextProps) => JSX.Element;
 
 /**
  *
@@ -44,6 +68,12 @@ declare type SearchContextState = {
  * React hook which provides the search context
  */
 declare const useSearch: () => SearchContextValue;
+/**
+ * @public
+ *
+ * React hook which checks for an existing search context
+ */
+declare const useSearchContextCheck: () => boolean;
 /**
  * Props for {@link SearchContextProvider}
  *
@@ -59,34 +89,4 @@ declare type SearchContextProviderProps = PropsWithChildren<{
  */
 declare const SearchContextProvider: (props: SearchContextProviderProps) => JSX.Element;
 
-/**
- * Props for {@link SearchApiProviderForStorybook}
- * @public
- */
-declare type SearchApiProviderForStorybookProps = ComponentProps<typeof SearchContextProvider> & {
-    mockedResults?: SearchResultSet;
-};
-/**
- * Props for {@link SearchContextProviderForStorybook}
- * @public
- */
-declare type SearchContextProviderForStorybookProps = PropsWithChildren<{
-    mockedResults?: SearchResultSet;
-}>;
-/**
- * Utility api provider only for use in Storybook stories.
- *
- * @public
- */
-declare function SearchApiProviderForStorybook(props: SearchApiProviderForStorybookProps): JSX.Element;
-/**
- * Utility context provider only for use in Storybook stories. You should use
- * the real `<SearchContextProvider>` exported by `@backstage/plugin-search-react` in
- * your app instead of this! In some cases (like the search page) it may
- * already be provided on your behalf.
- *
- * @public
- */
-declare const SearchContextProviderForStorybook: (props: SearchContextProviderForStorybookProps) => JSX.Element;
-
-export { SearchApi, SearchApiProviderForStorybook, SearchApiProviderForStorybookProps, SearchContextProvider, SearchContextProviderForStorybook, SearchContextProviderForStorybookProps, SearchContextProviderProps, SearchContextState, SearchContextValue, searchApiRef, useSearch };
+export { HighlightedSearchResultText, HighlightedSearchResultTextProps, MockSearchApi, SearchApi, SearchContextProvider, SearchContextProviderProps, SearchContextState, SearchContextValue, searchApiRef, useSearch, useSearchContextCheck };

package/dist/index.esm.js

@@ -1,14 +1,37 @@
 import { createApiRef, useApi, AnalyticsContext } from '@backstage/core-plugin-api';
+import React, { useMemo, useContext, useState, useCallback, useEffect } from 'react';
+import { makeStyles } from '@material-ui/core';
 import { createVersionedContext, createVersionedValueMap } from '@backstage/version-bridge';
-import React, { useContext, useState, useCallback, useEffect } from 'react';
 import useAsync from 'react-use/lib/useAsync';
 import usePrevious from 'react-use/lib/usePrevious';
-import { ApiProvider } from '@backstage/core-app-api';
-import { TestApiRegistry } from '@backstage/test-utils';
 
 const searchApiRef = createApiRef({
   id: "plugin.search.queryservice"
 });
+class MockSearchApi {
+  constructor(mockedResults) {
+    this.mockedResults = mockedResults;
+  }
+  query() {
+    return Promise.resolve(this.mockedResults || { results: [] });
+  }
+}
+
+const useStyles = makeStyles(() => ({
+  highlight: {}
+}), { name: "BackstageHighlightedSearchResultText" });
+const HighlightedSearchResultText = ({
+  text,
+  preTag,
+  postTag
+}) => {
+  const classes = useStyles();
+  const terms = useMemo(() => text.split(new RegExp(`(${preTag}.+?${postTag})`)), [postTag, preTag, text]);
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, terms.map((t, idx) => t.includes(preTag) ? /* @__PURE__ */ React.createElement("mark", {
+    className: classes.highlight,
+    key: idx
+  }, t.replace(new RegExp(`${preTag}|${postTag}`, "g"), "")) : t));
+};
 
 const SearchContext = createVersionedContext("search-context");
 const useSearch = () => {
@@ -22,6 +45,10 @@ const useSearch = () => {
   }
   return value;
 };
+const useSearchContextCheck = () => {
+  const context = useContext(SearchContext);
+  return context !== void 0;
+};
 const searchInitialState = {
   term: "",
   pageCursor: void 0,
@@ -80,22 +107,5 @@ const SearchContextProvider = (props) => {
   }));
 };
 
-function SearchApiProviderForStorybook(props) {
-  const { mockedResults, children } = props;
-  const query = () => Promise.resolve(mockedResults || {});
-  const apiRegistry = TestApiRegistry.from([searchApiRef, { query }]);
-  return /* @__PURE__ */ React.createElement(ApiProvider, {
-    apis: apiRegistry,
-    children
-  });
-}
-const SearchContextProviderForStorybook = (props) => {
-  return /* @__PURE__ */ React.createElement(SearchApiProviderForStorybook, {
-    ...props
-  }, /* @__PURE__ */ React.createElement(SearchContextProvider, {
-    children: props.children
-  }));
-};
-
-export { SearchApiProviderForStorybook, SearchContextProvider, SearchContextProviderForStorybook, searchApiRef, useSearch };
+export { HighlightedSearchResultText, MockSearchApi, SearchContextProvider, searchApiRef, useSearch, useSearchContextCheck };
 //# sourceMappingURL=index.esm.js.map

package/dist/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../src/api.ts","../src/context/SearchContext.tsx","../src/context/SearchContextForStorybook.stories.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { SearchQuery, SearchResultSet } from '@backstage/plugin-search-common';\nimport { createApiRef } from '@backstage/core-plugin-api';\n\n/**\n * @public\n */\nexport const searchApiRef = createApiRef<SearchApi>({\n  id: 'plugin.search.queryservice',\n});\n\n/**\n * @public\n */\nexport interface SearchApi {\n  query(query: SearchQuery): Promise<SearchResultSet>;\n}\n","/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { JsonObject } from '@backstage/types';\nimport { useApi, AnalyticsContext } from '@backstage/core-plugin-api';\nimport { SearchResultSet } from '@backstage/plugin-search-common';\nimport {\n  createVersionedContext,\n  createVersionedValueMap,\n} from '@backstage/version-bridge';\nimport React, {\n  PropsWithChildren,\n  useCallback,\n  useContext,\n  useEffect,\n  useState,\n} from 'react';\nimport useAsync, { AsyncState } from 'react-use/lib/useAsync';\nimport usePrevious from 'react-use/lib/usePrevious';\nimport { searchApiRef } from '../api';\n\n/**\n *\n * @public\n */\nexport type SearchContextValue = {\n  result: AsyncState<SearchResultSet>;\n  setTerm: React.Dispatch<React.SetStateAction<string>>;\n  setTypes: React.Dispatch<React.SetStateAction<string[]>>;\n  setFilters: React.Dispatch<React.SetStateAction<JsonObject>>;\n  setPageCursor: React.Dispatch<React.SetStateAction<string | undefined>>;\n  fetchNextPage?: React.DispatchWithoutAction;\n  fetchPreviousPage?: React.DispatchWithoutAction;\n} & SearchContextState;\n\n/**\n *\n * @public\n */\nexport type SearchContextState = {\n  term: string;\n  types: string[];\n  filters: JsonObject;\n  pageCursor?: string;\n};\n\nconst SearchContext = createVersionedContext<{\n  1: SearchContextValue;\n}>('search-context');\n\n/**\n * @public\n *\n * React hook which provides the search context\n */\nexport const useSearch = () => {\n  const context = useContext(SearchContext);\n  if (!context) {\n    throw new Error('useSearch must be used within a SearchContextProvider');\n  }\n\n  const value = context.atVersion(1);\n  if (!value) {\n    throw new Error('No SearchContext v1 found');\n  }\n  return value;\n};\n\n/**\n * The initial state of `SearchContextProvider`.\n *\n */\nconst searchInitialState: SearchContextState = {\n  term: '',\n  pageCursor: undefined,\n  filters: {},\n  types: [],\n};\n\n/**\n * Props for {@link SearchContextProvider}\n *\n * @public\n */\nexport type SearchContextProviderProps = PropsWithChildren<{\n  initialState?: SearchContextState;\n}>;\n\n/**\n * @public\n *\n * Search context provider which gives you access to shared state between search components\n */\nexport const SearchContextProvider = (props: SearchContextProviderProps) => {\n  const { initialState = searchInitialState, children } = props;\n  const searchApi = useApi(searchApiRef);\n  const [pageCursor, setPageCursor] = useState<string | undefined>(\n    initialState.pageCursor,\n  );\n  const [filters, setFilters] = useState<JsonObject>(initialState.filters);\n  const [term, setTerm] = useState<string>(initialState.term);\n  const [types, setTypes] = useState<string[]>(initialState.types);\n\n  const prevTerm = usePrevious(term);\n\n  const result = useAsync(\n    () =>\n      searchApi.query({\n        term,\n        filters,\n        pageCursor,\n        types,\n      }),\n    [term, filters, types, pageCursor],\n  );\n\n  const hasNextPage =\n    !result.loading && !result.error && result.value?.nextPageCursor;\n  const hasPreviousPage =\n    !result.loading && !result.error && result.value?.previousPageCursor;\n  const fetchNextPage = useCallback(() => {\n    setPageCursor(result.value?.nextPageCursor);\n  }, [result.value?.nextPageCursor]);\n  const fetchPreviousPage = useCallback(() => {\n    setPageCursor(result.value?.previousPageCursor);\n  }, [result.value?.previousPageCursor]);\n\n  useEffect(() => {\n    // Any time a term is reset, we want to start from page 0.\n    if (term && prevTerm && term !== prevTerm) {\n      setPageCursor(undefined);\n    }\n  }, [term, prevTerm, initialState.pageCursor]);\n\n  const value: SearchContextValue = {\n    result,\n    filters,\n    setFilters,\n    term,\n    setTerm,\n    types,\n    setTypes,\n    pageCursor,\n    setPageCursor,\n    fetchNextPage: hasNextPage ? fetchNextPage : undefined,\n    fetchPreviousPage: hasPreviousPage ? fetchPreviousPage : undefined,\n  };\n\n  const versionedValue = createVersionedValueMap({ 1: value });\n\n  return (\n    <AnalyticsContext attributes={{ searchTypes: types.sort().join(',') }}>\n      <SearchContext.Provider value={versionedValue} children={children} />\n    </AnalyticsContext>\n  );\n};\n","/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { ApiProvider } from '@backstage/core-app-api';\nimport { SearchResultSet } from '@backstage/plugin-search-common';\nimport { TestApiRegistry } from '@backstage/test-utils';\nimport React, { ComponentProps, PropsWithChildren } from 'react';\nimport { searchApiRef } from '../api';\nimport { SearchContextProvider } from './SearchContext';\n\n/**\n * Props for {@link SearchApiProviderForStorybook}\n * @public\n */\nexport type SearchApiProviderForStorybookProps = ComponentProps<\n  typeof SearchContextProvider\n> & {\n  mockedResults?: SearchResultSet;\n};\n\n/**\n * Props for {@link SearchContextProviderForStorybook}\n * @public\n */\nexport type SearchContextProviderForStorybookProps = PropsWithChildren<{\n  mockedResults?: SearchResultSet;\n}>;\n\n/**\n * Utility api provider only for use in Storybook stories.\n *\n * @public\n */\nexport function SearchApiProviderForStorybook(\n  props: SearchApiProviderForStorybookProps,\n) {\n  const { mockedResults, children } = props;\n  const query: any = () => Promise.resolve(mockedResults || {});\n  const apiRegistry = TestApiRegistry.from([searchApiRef, { query }]);\n  return <ApiProvider apis={apiRegistry} children={children} />;\n}\n\n/**\n * Utility context provider only for use in Storybook stories. You should use\n * the real `<SearchContextProvider>` exported by `@backstage/plugin-search-react` in\n * your app instead of this! In some cases (like the search page) it may\n * already be provided on your behalf.\n *\n * @public\n */\nexport const SearchContextProviderForStorybook = (\n  props: SearchContextProviderForStorybookProps,\n) => {\n  return (\n    <SearchApiProviderForStorybook {...props}>\n      <SearchContextProvider children={props.children} />\n    </SearchApiProviderForStorybook>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../src/api.ts","../src/components/HighlightedSearchResultText/HighlightedSearchResultText.tsx","../src/context/SearchContext.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { SearchQuery, SearchResultSet } from '@backstage/plugin-search-common';\nimport { createApiRef } from '@backstage/core-plugin-api';\n\n/**\n * @public\n */\nexport const searchApiRef = createApiRef<SearchApi>({\n  id: 'plugin.search.queryservice',\n});\n\n/**\n * @public\n */\nexport interface SearchApi {\n  query(query: SearchQuery): Promise<SearchResultSet>;\n}\n\n/**\n * @public\n *\n * Search Api Mock that can be used in tests and storybooks\n */\nexport class MockSearchApi implements SearchApi {\n  constructor(public mockedResults?: SearchResultSet) {}\n\n  query(): Promise<SearchResultSet> {\n    return Promise.resolve(this.mockedResults || { results: [] });\n  }\n}\n","/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useMemo } from 'react';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles(\n  () => ({\n    highlight: {},\n  }),\n  { name: 'BackstageHighlightedSearchResultText' },\n);\n\n/**\n * @public\n */\nexport type HighlightedSearchResultTextProps = {\n  text: string;\n  preTag: string;\n  postTag: string;\n};\n\n/**\n * @public\n */\nexport const HighlightedSearchResultText = ({\n  text,\n  preTag,\n  postTag,\n}: HighlightedSearchResultTextProps) => {\n  const classes = useStyles();\n  const terms = useMemo(\n    () => text.split(new RegExp(`(${preTag}.+?${postTag})`)),\n    [postTag, preTag, text],\n  );\n  return (\n    <>\n      {terms.map((t, idx) =>\n        t.includes(preTag) ? (\n          <mark className={classes.highlight} key={idx}>\n            {t.replace(new RegExp(`${preTag}|${postTag}`, 'g'), '')}\n          </mark>\n        ) : (\n          t\n        ),\n      )}\n    </>\n  );\n};\n","/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { JsonObject } from '@backstage/types';\nimport { useApi, AnalyticsContext } from '@backstage/core-plugin-api';\nimport { SearchResultSet } from '@backstage/plugin-search-common';\nimport {\n  createVersionedContext,\n  createVersionedValueMap,\n} from '@backstage/version-bridge';\nimport React, {\n  PropsWithChildren,\n  useCallback,\n  useContext,\n  useEffect,\n  useState,\n} from 'react';\nimport useAsync, { AsyncState } from 'react-use/lib/useAsync';\nimport usePrevious from 'react-use/lib/usePrevious';\nimport { searchApiRef } from '../api';\n\n/**\n *\n * @public\n */\nexport type SearchContextValue = {\n  result: AsyncState<SearchResultSet>;\n  setTerm: React.Dispatch<React.SetStateAction<string>>;\n  setTypes: React.Dispatch<React.SetStateAction<string[]>>;\n  setFilters: React.Dispatch<React.SetStateAction<JsonObject>>;\n  setPageCursor: React.Dispatch<React.SetStateAction<string | undefined>>;\n  fetchNextPage?: React.DispatchWithoutAction;\n  fetchPreviousPage?: React.DispatchWithoutAction;\n} & SearchContextState;\n\n/**\n *\n * @public\n */\nexport type SearchContextState = {\n  term: string;\n  types: string[];\n  filters: JsonObject;\n  pageCursor?: string;\n};\n\nconst SearchContext = createVersionedContext<{\n  1: SearchContextValue;\n}>('search-context');\n\n/**\n * @public\n *\n * React hook which provides the search context\n */\nexport const useSearch = () => {\n  const context = useContext(SearchContext);\n  if (!context) {\n    throw new Error('useSearch must be used within a SearchContextProvider');\n  }\n\n  const value = context.atVersion(1);\n  if (!value) {\n    throw new Error('No SearchContext v1 found');\n  }\n  return value;\n};\n\n/**\n * @public\n *\n * React hook which checks for an existing search context\n */\nexport const useSearchContextCheck = () => {\n  const context = useContext(SearchContext);\n  return context !== undefined;\n};\n\n/**\n * The initial state of `SearchContextProvider`.\n *\n */\nconst searchInitialState: SearchContextState = {\n  term: '',\n  pageCursor: undefined,\n  filters: {},\n  types: [],\n};\n\n/**\n * Props for {@link SearchContextProvider}\n *\n * @public\n */\nexport type SearchContextProviderProps = PropsWithChildren<{\n  initialState?: SearchContextState;\n}>;\n\n/**\n * @public\n *\n * Search context provider which gives you access to shared state between search components\n */\nexport const SearchContextProvider = (props: SearchContextProviderProps) => {\n  const { initialState = searchInitialState, children } = props;\n  const searchApi = useApi(searchApiRef);\n  const [pageCursor, setPageCursor] = useState<string | undefined>(\n    initialState.pageCursor,\n  );\n  const [filters, setFilters] = useState<JsonObject>(initialState.filters);\n  const [term, setTerm] = useState<string>(initialState.term);\n  const [types, setTypes] = useState<string[]>(initialState.types);\n\n  const prevTerm = usePrevious(term);\n\n  const result = useAsync(\n    () =>\n      searchApi.query({\n        term,\n        filters,\n        pageCursor,\n        types,\n      }),\n    [term, filters, types, pageCursor],\n  );\n\n  const hasNextPage =\n    !result.loading && !result.error && result.value?.nextPageCursor;\n  const hasPreviousPage =\n    !result.loading && !result.error && result.value?.previousPageCursor;\n  const fetchNextPage = useCallback(() => {\n    setPageCursor(result.value?.nextPageCursor);\n  }, [result.value?.nextPageCursor]);\n  const fetchPreviousPage = useCallback(() => {\n    setPageCursor(result.value?.previousPageCursor);\n  }, [result.value?.previousPageCursor]);\n\n  useEffect(() => {\n    // Any time a term is reset, we want to start from page 0.\n    if (term && prevTerm && term !== prevTerm) {\n      setPageCursor(undefined);\n    }\n  }, [term, prevTerm, initialState.pageCursor]);\n\n  const value: SearchContextValue = {\n    result,\n    filters,\n    setFilters,\n    term,\n    setTerm,\n    types,\n    setTypes,\n    pageCursor,\n    setPageCursor,\n    fetchNextPage: hasNextPage ? fetchNextPage : undefined,\n    fetchPreviousPage: hasPreviousPage ? fetchPreviousPage : undefined,\n  };\n\n  const versionedValue = createVersionedValueMap({ 1: value });\n\n  return (\n    <AnalyticsContext attributes={{ searchTypes: types.sort().join(',') }}>\n      <SearchContext.Provider value={versionedValue} children={children} />\n    </AnalyticsContext>\n  );\n};\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-search-react",
-  "version": "0.1.0",
+  "version": "0.2.0-next.2",
   "main": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "license": "Apache-2.0",
@@ -31,11 +31,11 @@
     "start": "backstage-cli package start"
   },
   "dependencies": {
-    "@backstage/core-app-api": "^1.0.1",
-    "@backstage/core-plugin-api": "^1.0.1",
-    "@backstage/plugin-search-common": "^0.3.3",
+    "@backstage/core-plugin-api": "^1.0.2-next.1",
+    "@backstage/plugin-search-common": "^0.3.4-next.0",
     "@backstage/types": "^1.0.0",
     "@backstage/version-bridge": "^1.0.1",
+    "@material-ui/core": "^4.12.2",
     "react-use": "^17.3.2"
   },
   "peerDependencies": {
@@ -43,7 +43,8 @@
     "react": "^16.13.1 || ^17.0.0"
   },
   "devDependencies": {
-    "@backstage/test-utils": "^1.0.1",
+    "@backstage/core-app-api": "^1.0.2-next.1",
+    "@backstage/test-utils": "^1.1.0-next.2",
     "@testing-library/jest-dom": "^5.10.1",
     "@testing-library/react": "^12.1.3",
     "@testing-library/react-hooks": "^8.0.0"
@@ -51,5 +52,5 @@
   "files": [
     "dist"
   ],
-  "gitHead": "e0e44c433319711c2fb8b175db411a621f7aaec2"
+  "gitHead": "cfbf5762d7d91eee18999306b21d63840400ee29"
 }