@backstage/plugin-search 1.4.25-next.0 → 1.4.25-next.2

package/dist/components/SearchModal/useSearchModal.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSearchModal.esm.js","sources":["../../../src/components/SearchModal/useSearchModal.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 React, { ReactNode, useCallback, useContext, useState } from 'react';\nimport { useLocation } from 'react-router-dom';\nimport {\n  createVersionedContext,\n  createVersionedValueMap,\n} from '@backstage/version-bridge';\nimport useUpdateEffect from 'react-use/esm/useUpdateEffect';\n\n/**\n * The state of the search modal, as well as functions for changing the modal's\n * visibility.\n *\n * @public\n */\nexport type SearchModalValue = {\n  state: {\n    hidden: boolean;\n    open: boolean;\n  };\n  toggleModal: () => void;\n  setOpen: (open: boolean) => void;\n};\n\nconst SearchModalContext = createVersionedContext<{\n  1: SearchModalValue | undefined;\n}>('search-modal-context');\n\n/**\n * Props for the SearchModalProvider.\n * @public\n */\nexport type SearchModalProviderProps = {\n  /**\n   * Children which should have access to the SearchModal context and the\n   * associated useSearchModal() hook.\n   */\n  children: ReactNode;\n\n  /**\n   * Pass true if the modal should be rendered initially.\n   */\n  showInitially?: boolean;\n};\n\n/**\n * A context provider responsible for storing and managing state related to the\n * search modal.\n *\n * @remarks\n * If you need to control visibility of the search toggle outside of the modal\n * itself, you can optionally place this higher up in the react tree where your\n * custom code and the search modal share the same context.\n *\n * @example\n * ```tsx\n * import {\n *   SearchModalProvider,\n *   SidebarSearchModal,\n * } from '@backstage/plugin-search';\n *\n * // ...\n *\n * <SearchModalProvider>\n *   <KeyboardShortcutSearchToggler />\n *   <SidebarSearchModal>\n *     {({ toggleModal }) => <SearchModal toggleModal={toggleModal} />}\n *   </SidebarSearchModal>\n * </SearchModalProvider>\n * ```\n *\n * @public\n */\nexport const SearchModalProvider = (props: SearchModalProviderProps) => {\n  const value = useSearchModal(props.showInitially);\n  const versionedValue = createVersionedValueMap({ 1: value });\n  return (\n    <SearchModalContext.Provider value={versionedValue}>\n      {props.children}\n    </SearchModalContext.Provider>\n  );\n};\n\n/**\n * Use this hook to manage the state of {@link SearchModal}\n * and change its visibility. Monitors route changes setting the hidden state\n * to avoid having to call toggleModal on every result click.\n *\n * @public\n *\n * @param initialState - pass `true` to make the modal initially visible\n * @returns an object containing the state of the modal together with\n * functions for changing the visibility of the modal.\n */\nexport function useSearchModal(initialState = false) {\n  const [state, setState] = useState({\n    hidden: !initialState,\n    open: initialState,\n  });\n\n  const toggleModal = useCallback(\n    () =>\n      setState(prevState => ({\n        open: true,\n        hidden: !prevState.hidden,\n      })),\n    [],\n  );\n\n  const setOpen = useCallback(\n    (open: boolean) =>\n      setState(prevState => ({\n        open: prevState.open || open,\n        hidden: !open,\n      })),\n    [],\n  );\n\n  // Check for any existing parent context.\n  const parentContext = useContext(SearchModalContext);\n  const parentContextValue = parentContext?.atVersion(1);\n  const isParentContextPresent = !!parentContextValue?.state;\n\n  // Monitor route changes to automatically hide the modal.\n  const location = useLocation();\n  const locationKey = `${location.pathname}${location.search}${location.hash}`;\n  useUpdateEffect(() => {\n    setState(prevState => ({\n      open: prevState.open,\n      hidden: true,\n    }));\n  }, [locationKey]);\n\n  // Inherit from parent context, if set.\n  return isParentContextPresent\n    ? parentContextValue\n    : { state, toggleModal, setOpen };\n}\n"],"names":[],"mappings":";;;;;AAuCA,MAAM,kBAAA,GAAqB,uBAExB,sBAAsB,CAAA;AA+CZ,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AACtE,EAAM,MAAA,KAAA,GAAQ,cAAe,CAAA,KAAA,CAAM,aAAa,CAAA;AAChD,EAAA,MAAM,cAAiB,GAAA,uBAAA,CAAwB,EAAE,CAAA,EAAG,OAAO,CAAA;AAC3D,EAAA,2CACG,kBAAmB,CAAA,QAAA,EAAnB,EAA4B,KAAO,EAAA,cAAA,EAAA,EACjC,MAAM,QACT,CAAA;AAEJ;AAagB,SAAA,cAAA,CAAe,eAAe,KAAO,EAAA;AACnD,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,QAAS,CAAA;AAAA,IACjC,QAAQ,CAAC,YAAA;AAAA,IACT,IAAM,EAAA;AAAA,GACP,CAAA;AAED,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,MACE,SAAS,CAAc,SAAA,MAAA;AAAA,MACrB,IAAM,EAAA,IAAA;AAAA,MACN,MAAA,EAAQ,CAAC,SAAU,CAAA;AAAA,KACnB,CAAA,CAAA;AAAA,IACJ;AAAC,GACH;AAEA,EAAA,MAAM,OAAU,GAAA,WAAA;AAAA,IACd,CAAC,IACC,KAAA,QAAA,CAAS,CAAc,SAAA,MAAA;AAAA,MACrB,IAAA,EAAM,UAAU,IAAQ,IAAA,IAAA;AAAA,MACxB,QAAQ,CAAC;AAAA,KACT,CAAA,CAAA;AAAA,IACJ;AAAC,GACH;AAGA,EAAM,MAAA,aAAA,GAAgB,WAAW,kBAAkB,CAAA;AACnD,EAAM,MAAA,kBAAA,GAAqB,aAAe,EAAA,SAAA,CAAU,CAAC,CAAA;AACrD,EAAM,MAAA,sBAAA,GAAyB,CAAC,CAAC,kBAAoB,EAAA,KAAA;AAGrD,EAAA,MAAM,WAAW,WAAY,EAAA;AAC7B,EAAM,MAAA,WAAA,GAAc,GAAG,QAAS,CAAA,QAAQ,GAAG,QAAS,CAAA,MAAM,CAAG,EAAA,QAAA,CAAS,IAAI,CAAA,CAAA;AAC1E,EAAA,eAAA,CAAgB,MAAM;AACpB,IAAA,QAAA,CAAS,CAAc,SAAA,MAAA;AAAA,MACrB,MAAM,SAAU,CAAA,IAAA;AAAA,MAChB,MAAQ,EAAA;AAAA,KACR,CAAA,CAAA;AAAA,GACJ,EAAG,CAAC,WAAW,CAAC,CAAA;AAGhB,EAAA,OAAO,sBACH,GAAA,kBAAA,GACA,EAAE,KAAA,EAAO,aAAa,OAAQ,EAAA;AACpC;;;;"}
+{"version":3,"file":"useSearchModal.esm.js","sources":["../../../src/components/SearchModal/useSearchModal.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 { ReactNode, useCallback, useContext, useState } from 'react';\nimport { useLocation } from 'react-router-dom';\nimport {\n  createVersionedContext,\n  createVersionedValueMap,\n} from '@backstage/version-bridge';\nimport useUpdateEffect from 'react-use/esm/useUpdateEffect';\n\n/**\n * The state of the search modal, as well as functions for changing the modal's\n * visibility.\n *\n * @public\n */\nexport type SearchModalValue = {\n  state: {\n    hidden: boolean;\n    open: boolean;\n  };\n  toggleModal: () => void;\n  setOpen: (open: boolean) => void;\n};\n\nconst SearchModalContext = createVersionedContext<{\n  1: SearchModalValue | undefined;\n}>('search-modal-context');\n\n/**\n * Props for the SearchModalProvider.\n * @public\n */\nexport type SearchModalProviderProps = {\n  /**\n   * Children which should have access to the SearchModal context and the\n   * associated useSearchModal() hook.\n   */\n  children: ReactNode;\n\n  /**\n   * Pass true if the modal should be rendered initially.\n   */\n  showInitially?: boolean;\n};\n\n/**\n * A context provider responsible for storing and managing state related to the\n * search modal.\n *\n * @remarks\n * If you need to control visibility of the search toggle outside of the modal\n * itself, you can optionally place this higher up in the react tree where your\n * custom code and the search modal share the same context.\n *\n * @example\n * ```tsx\n * import {\n *   SearchModalProvider,\n *   SidebarSearchModal,\n * } from '@backstage/plugin-search';\n *\n * // ...\n *\n * <SearchModalProvider>\n *   <KeyboardShortcutSearchToggler />\n *   <SidebarSearchModal>\n *     {({ toggleModal }) => <SearchModal toggleModal={toggleModal} />}\n *   </SidebarSearchModal>\n * </SearchModalProvider>\n * ```\n *\n * @public\n */\nexport const SearchModalProvider = (props: SearchModalProviderProps) => {\n  const value = useSearchModal(props.showInitially);\n  const versionedValue = createVersionedValueMap({ 1: value });\n  return (\n    <SearchModalContext.Provider value={versionedValue}>\n      {props.children}\n    </SearchModalContext.Provider>\n  );\n};\n\n/**\n * Use this hook to manage the state of {@link SearchModal}\n * and change its visibility. Monitors route changes setting the hidden state\n * to avoid having to call toggleModal on every result click.\n *\n * @public\n *\n * @param initialState - pass `true` to make the modal initially visible\n * @returns an object containing the state of the modal together with\n * functions for changing the visibility of the modal.\n */\nexport function useSearchModal(initialState = false) {\n  const [state, setState] = useState({\n    hidden: !initialState,\n    open: initialState,\n  });\n\n  const toggleModal = useCallback(\n    () =>\n      setState(prevState => ({\n        open: true,\n        hidden: !prevState.hidden,\n      })),\n    [],\n  );\n\n  const setOpen = useCallback(\n    (open: boolean) =>\n      setState(prevState => ({\n        open: prevState.open || open,\n        hidden: !open,\n      })),\n    [],\n  );\n\n  // Check for any existing parent context.\n  const parentContext = useContext(SearchModalContext);\n  const parentContextValue = parentContext?.atVersion(1);\n  const isParentContextPresent = !!parentContextValue?.state;\n\n  // Monitor route changes to automatically hide the modal.\n  const location = useLocation();\n  const locationKey = `${location.pathname}${location.search}${location.hash}`;\n  useUpdateEffect(() => {\n    setState(prevState => ({\n      open: prevState.open,\n      hidden: true,\n    }));\n  }, [locationKey]);\n\n  // Inherit from parent context, if set.\n  return isParentContextPresent\n    ? parentContextValue\n    : { state, toggleModal, setOpen };\n}\n"],"names":[],"mappings":";;;;;;AAuCA,MAAM,kBAAA,GAAqB,uBAExB,sBAAsB,CAAA;AA+CZ,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AACtE,EAAM,MAAA,KAAA,GAAQ,cAAe,CAAA,KAAA,CAAM,aAAa,CAAA;AAChD,EAAA,MAAM,cAAiB,GAAA,uBAAA,CAAwB,EAAE,CAAA,EAAG,OAAO,CAAA;AAC3D,EAAA,2BACG,kBAAmB,CAAA,QAAA,EAAnB,EAA4B,KAAO,EAAA,cAAA,EACjC,gBAAM,QACT,EAAA,CAAA;AAEJ;AAagB,SAAA,cAAA,CAAe,eAAe,KAAO,EAAA;AACnD,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,QAAS,CAAA;AAAA,IACjC,QAAQ,CAAC,YAAA;AAAA,IACT,IAAM,EAAA;AAAA,GACP,CAAA;AAED,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,MACE,SAAS,CAAc,SAAA,MAAA;AAAA,MACrB,IAAM,EAAA,IAAA;AAAA,MACN,MAAA,EAAQ,CAAC,SAAU,CAAA;AAAA,KACnB,CAAA,CAAA;AAAA,IACJ;AAAC,GACH;AAEA,EAAA,MAAM,OAAU,GAAA,WAAA;AAAA,IACd,CAAC,IACC,KAAA,QAAA,CAAS,CAAc,SAAA,MAAA;AAAA,MACrB,IAAA,EAAM,UAAU,IAAQ,IAAA,IAAA;AAAA,MACxB,QAAQ,CAAC;AAAA,KACT,CAAA,CAAA;AAAA,IACJ;AAAC,GACH;AAGA,EAAM,MAAA,aAAA,GAAgB,WAAW,kBAAkB,CAAA;AACnD,EAAM,MAAA,kBAAA,GAAqB,aAAe,EAAA,SAAA,CAAU,CAAC,CAAA;AACrD,EAAM,MAAA,sBAAA,GAAyB,CAAC,CAAC,kBAAoB,EAAA,KAAA;AAGrD,EAAA,MAAM,WAAW,WAAY,EAAA;AAC7B,EAAM,MAAA,WAAA,GAAc,GAAG,QAAS,CAAA,QAAQ,GAAG,QAAS,CAAA,MAAM,CAAG,EAAA,QAAA,CAAS,IAAI,CAAA,CAAA;AAC1E,EAAA,eAAA,CAAgB,MAAM;AACpB,IAAA,QAAA,CAAS,CAAc,SAAA,MAAA;AAAA,MACrB,MAAM,SAAU,CAAA,IAAA;AAAA,MAChB,MAAQ,EAAA;AAAA,KACR,CAAA,CAAA;AAAA,GACJ,EAAG,CAAC,WAAW,CAAC,CAAA;AAGhB,EAAA,OAAO,sBACH,GAAA,kBAAA,GACA,EAAE,KAAA,EAAO,aAAa,OAAQ,EAAA;AACpC;;;;"}

package/dist/components/SearchPage/SearchPage.esm.js

@@ -1,4 +1,5 @@
-import React, { useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useEffect } from 'react';
 import usePrevious from 'react-use/esm/usePrevious';
 import qs from 'qs';
 import { useOutlet, useLocation } from 'react-router-dom';
@@ -52,7 +53,10 @@ const UrlUpdater = () => {
 };
 const SearchPage = () => {
   const outlet = useOutlet();
-  return /* @__PURE__ */ React.createElement(SearchContextProvider, null, /* @__PURE__ */ React.createElement(UrlUpdater, null), outlet);
+  return /* @__PURE__ */ jsxs(SearchContextProvider, { children: [
+    /* @__PURE__ */ jsx(UrlUpdater, {}),
+    outlet
+  ] });
 };
 
 export { SearchPage, UrlUpdater };

package/dist/components/SearchPage/SearchPage.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchPage.esm.js","sources":["../../../src/components/SearchPage/SearchPage.tsx"],"sourcesContent":["/*\n * Copyright 2020 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, { useEffect } from 'react';\nimport usePrevious from 'react-use/esm/usePrevious';\nimport qs from 'qs';\nimport { useLocation, useOutlet } from 'react-router-dom';\nimport {\n  SearchContextProvider,\n  useSearch,\n} from '@backstage/plugin-search-react';\nimport { JsonObject } from '@backstage/types';\n\nexport const UrlUpdater = () => {\n  const location = useLocation();\n  const {\n    term,\n    setTerm,\n    types,\n    setTypes,\n    pageCursor,\n    setPageCursor,\n    filters,\n    setFilters,\n  } = useSearch();\n\n  const prevQueryParams = usePrevious(location.search);\n  useEffect(() => {\n    // Only respond to changes to url query params\n    if (location.search === prevQueryParams) {\n      return;\n    }\n\n    const query =\n      qs.parse(location.search.substring(1), { arrayLimit: 0 }) || {};\n\n    if (query.filters) {\n      setFilters(query.filters as JsonObject);\n    }\n\n    if (query.query) {\n      setTerm(query.query as string);\n    }\n\n    if (query.pageCursor) {\n      setPageCursor(query.pageCursor as string);\n    }\n\n    if (query.types) {\n      setTypes(query.types as string[]);\n    }\n  }, [prevQueryParams, location, setTerm, setTypes, setPageCursor, setFilters]);\n\n  useEffect(() => {\n    const newParams = qs.stringify(\n      {\n        query: term,\n        types,\n        pageCursor,\n        filters,\n      },\n      { arrayFormat: 'brackets' },\n    );\n    const newUrl = `${window.location.pathname}?${newParams}`;\n\n    // We directly manipulate window history here in order to not re-render\n    // infinitely (state => location => state => etc). The intention of this\n    // code is just to ensure the right query/filters are loaded when a user\n    // clicks the \"back\" button after clicking a result.\n    window.history.replaceState(null, document.title, newUrl);\n  }, [term, types, pageCursor, filters]);\n\n  return null;\n};\n\n/**\n * @public\n */\nexport const SearchPage = () => {\n  const outlet = useOutlet();\n\n  return (\n    <SearchContextProvider>\n      <UrlUpdater />\n      {outlet}\n    </SearchContextProvider>\n  );\n};\n"],"names":[],"mappings":";;;;;;AA0BO,MAAM,aAAa,MAAM;AAC9B,EAAA,MAAM,WAAW,WAAY,EAAA;AAC7B,EAAM,MAAA;AAAA,IACJ,IAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA;AAAA,MACE,SAAU,EAAA;AAEd,EAAM,MAAA,eAAA,GAAkB,WAAY,CAAA,QAAA,CAAS,MAAM,CAAA;AACnD,EAAA,SAAA,CAAU,MAAM;AAEd,IAAI,IAAA,QAAA,CAAS,WAAW,eAAiB,EAAA;AACvC,MAAA;AAAA;AAGF,IAAA,MAAM,KACJ,GAAA,EAAA,CAAG,KAAM,CAAA,QAAA,CAAS,MAAO,CAAA,SAAA,CAAU,CAAC,CAAA,EAAG,EAAE,UAAA,EAAY,CAAE,EAAC,KAAK,EAAC;AAEhE,IAAA,IAAI,MAAM,OAAS,EAAA;AACjB,MAAA,UAAA,CAAW,MAAM,OAAqB,CAAA;AAAA;AAGxC,IAAA,IAAI,MAAM,KAAO,EAAA;AACf,MAAA,OAAA,CAAQ,MAAM,KAAe,CAAA;AAAA;AAG/B,IAAA,IAAI,MAAM,UAAY,EAAA;AACpB,MAAA,aAAA,CAAc,MAAM,UAAoB,CAAA;AAAA;AAG1C,IAAA,IAAI,MAAM,KAAO,EAAA;AACf,MAAA,QAAA,CAAS,MAAM,KAAiB,CAAA;AAAA;AAClC,GACF,EAAG,CAAC,eAAiB,EAAA,QAAA,EAAU,SAAS,QAAU,EAAA,aAAA,EAAe,UAAU,CAAC,CAAA;AAE5E,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,YAAY,EAAG,CAAA,SAAA;AAAA,MACnB;AAAA,QACE,KAAO,EAAA,IAAA;AAAA,QACP,KAAA;AAAA,QACA,UAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,EAAE,aAAa,UAAW;AAAA,KAC5B;AACA,IAAA,MAAM,SAAS,CAAG,EAAA,MAAA,CAAO,QAAS,CAAA,QAAQ,IAAI,SAAS,CAAA,CAAA;AAMvD,IAAA,MAAA,CAAO,OAAQ,CAAA,YAAA,CAAa,IAAM,EAAA,QAAA,CAAS,OAAO,MAAM,CAAA;AAAA,KACvD,CAAC,IAAA,EAAM,KAAO,EAAA,UAAA,EAAY,OAAO,CAAC,CAAA;AAErC,EAAO,OAAA,IAAA;AACT;AAKO,MAAM,aAAa,MAAM;AAC9B,EAAA,MAAM,SAAS,SAAU,EAAA;AAEzB,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,qBAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,IAAW,GACX,MACH,CAAA;AAEJ;;;;"}
+{"version":3,"file":"SearchPage.esm.js","sources":["../../../src/components/SearchPage/SearchPage.tsx"],"sourcesContent":["/*\n * Copyright 2020 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 { useEffect } from 'react';\nimport usePrevious from 'react-use/esm/usePrevious';\nimport qs from 'qs';\nimport { useLocation, useOutlet } from 'react-router-dom';\nimport {\n  SearchContextProvider,\n  useSearch,\n} from '@backstage/plugin-search-react';\nimport { JsonObject } from '@backstage/types';\n\nexport const UrlUpdater = () => {\n  const location = useLocation();\n  const {\n    term,\n    setTerm,\n    types,\n    setTypes,\n    pageCursor,\n    setPageCursor,\n    filters,\n    setFilters,\n  } = useSearch();\n\n  const prevQueryParams = usePrevious(location.search);\n  useEffect(() => {\n    // Only respond to changes to url query params\n    if (location.search === prevQueryParams) {\n      return;\n    }\n\n    const query =\n      qs.parse(location.search.substring(1), { arrayLimit: 0 }) || {};\n\n    if (query.filters) {\n      setFilters(query.filters as JsonObject);\n    }\n\n    if (query.query) {\n      setTerm(query.query as string);\n    }\n\n    if (query.pageCursor) {\n      setPageCursor(query.pageCursor as string);\n    }\n\n    if (query.types) {\n      setTypes(query.types as string[]);\n    }\n  }, [prevQueryParams, location, setTerm, setTypes, setPageCursor, setFilters]);\n\n  useEffect(() => {\n    const newParams = qs.stringify(\n      {\n        query: term,\n        types,\n        pageCursor,\n        filters,\n      },\n      { arrayFormat: 'brackets' },\n    );\n    const newUrl = `${window.location.pathname}?${newParams}`;\n\n    // We directly manipulate window history here in order to not re-render\n    // infinitely (state => location => state => etc). The intention of this\n    // code is just to ensure the right query/filters are loaded when a user\n    // clicks the \"back\" button after clicking a result.\n    window.history.replaceState(null, document.title, newUrl);\n  }, [term, types, pageCursor, filters]);\n\n  return null;\n};\n\n/**\n * @public\n */\nexport const SearchPage = () => {\n  const outlet = useOutlet();\n\n  return (\n    <SearchContextProvider>\n      <UrlUpdater />\n      {outlet}\n    </SearchContextProvider>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AA0BO,MAAM,aAAa,MAAM;AAC9B,EAAA,MAAM,WAAW,WAAY,EAAA;AAC7B,EAAM,MAAA;AAAA,IACJ,IAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA;AAAA,MACE,SAAU,EAAA;AAEd,EAAM,MAAA,eAAA,GAAkB,WAAY,CAAA,QAAA,CAAS,MAAM,CAAA;AACnD,EAAA,SAAA,CAAU,MAAM;AAEd,IAAI,IAAA,QAAA,CAAS,WAAW,eAAiB,EAAA;AACvC,MAAA;AAAA;AAGF,IAAA,MAAM,KACJ,GAAA,EAAA,CAAG,KAAM,CAAA,QAAA,CAAS,MAAO,CAAA,SAAA,CAAU,CAAC,CAAA,EAAG,EAAE,UAAA,EAAY,CAAE,EAAC,KAAK,EAAC;AAEhE,IAAA,IAAI,MAAM,OAAS,EAAA;AACjB,MAAA,UAAA,CAAW,MAAM,OAAqB,CAAA;AAAA;AAGxC,IAAA,IAAI,MAAM,KAAO,EAAA;AACf,MAAA,OAAA,CAAQ,MAAM,KAAe,CAAA;AAAA;AAG/B,IAAA,IAAI,MAAM,UAAY,EAAA;AACpB,MAAA,aAAA,CAAc,MAAM,UAAoB,CAAA;AAAA;AAG1C,IAAA,IAAI,MAAM,KAAO,EAAA;AACf,MAAA,QAAA,CAAS,MAAM,KAAiB,CAAA;AAAA;AAClC,GACF,EAAG,CAAC,eAAiB,EAAA,QAAA,EAAU,SAAS,QAAU,EAAA,aAAA,EAAe,UAAU,CAAC,CAAA;AAE5E,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,YAAY,EAAG,CAAA,SAAA;AAAA,MACnB;AAAA,QACE,KAAO,EAAA,IAAA;AAAA,QACP,KAAA;AAAA,QACA,UAAA;AAAA,QACA;AAAA,OACF;AAAA,MACA,EAAE,aAAa,UAAW;AAAA,KAC5B;AACA,IAAA,MAAM,SAAS,CAAG,EAAA,MAAA,CAAO,QAAS,CAAA,QAAQ,IAAI,SAAS,CAAA,CAAA;AAMvD,IAAA,MAAA,CAAO,OAAQ,CAAA,YAAA,CAAa,IAAM,EAAA,QAAA,CAAS,OAAO,MAAM,CAAA;AAAA,KACvD,CAAC,IAAA,EAAM,KAAO,EAAA,UAAA,EAAY,OAAO,CAAC,CAAA;AAErC,EAAO,OAAA,IAAA;AACT;AAKO,MAAM,aAAa,MAAM;AAC9B,EAAA,MAAM,SAAS,SAAU,EAAA;AAEzB,EAAA,4BACG,qBACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,UAAW,EAAA,EAAA,CAAA;AAAA,IACX;AAAA,GACH,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/SearchType/SearchType.Accordion.esm.js

@@ -1,4 +1,5 @@
-import React, { useState, useEffect, Fragment, cloneElement } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState, useEffect, Fragment, cloneElement } from 'react';
 import { useApi } from '@backstage/core-plugin-api';
 import { useSearch, searchApiRef } from '@backstage/plugin-search-react';
 import Accordion from '@material-ui/core/Accordion';
@@ -68,7 +69,7 @@ const SearchTypeAccordion = (props) => {
     {
       value: "",
       name: "All",
-      icon: /* @__PURE__ */ React.createElement(AllIcon, null)
+      icon: /* @__PURE__ */ jsx(AllIcon, {})
     },
     ...givenTypes
   ];
@@ -93,54 +94,64 @@ const SearchTypeAccordion = (props) => {
     );
     return Object.fromEntries(counts);
   }, [filters, showCounts, term, types]);
-  return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Typography, { variant: "body2", component: "h2" }, name), /* @__PURE__ */ React.createElement(
-    Accordion,
-    {
-      className: classes.accordion,
-      expanded,
-      onChange: toggleExpanded
-    },
-    /* @__PURE__ */ React.createElement(
-      AccordionSummary,
-      {
-        classes: {
-          root: classes.accordionSummary,
-          content: classes.accordionSummaryContent
-        },
-        expandIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, { className: classes.icon }),
-        IconButtonProps: { size: "small" }
-      },
-      expanded ? "Collapse" : definedTypes.filter((t) => t.value === selected)[0].name
-    ),
-    /* @__PURE__ */ React.createElement(AccordionDetails, { classes: { root: classes.accordionDetails } }, /* @__PURE__ */ React.createElement(
-      List,
+  return /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsx(Typography, { variant: "body2", component: "h2", children: name }),
+    /* @__PURE__ */ jsxs(
+      Accordion,
       {
-        className: classes.list,
-        component: "nav",
-        "aria-label": "filter by type",
-        disablePadding: true,
-        dense: true
-      },
-      definedTypes.map((type) => /* @__PURE__ */ React.createElement(Fragment, { key: type.value }, /* @__PURE__ */ React.createElement(Divider, null), /* @__PURE__ */ React.createElement(
-        ListItem,
-        {
-          selected: types[0] === type.value || types.length === 0 && type.value === "",
-          onClick: handleClick(type.value),
-          button: true
-        },
-        /* @__PURE__ */ React.createElement(ListItemIcon, null, cloneElement(type.icon, {
-          className: classes.listItemIcon
-        })),
-        /* @__PURE__ */ React.createElement(
-          ListItemText,
-          {
-            primary: type.name,
-            secondary: resultCounts && resultCounts[type.value]
-          }
-        )
-      )))
-    ))
-  ));
+        className: classes.accordion,
+        expanded,
+        onChange: toggleExpanded,
+        children: [
+          /* @__PURE__ */ jsx(
+            AccordionSummary,
+            {
+              classes: {
+                root: classes.accordionSummary,
+                content: classes.accordionSummaryContent
+              },
+              expandIcon: /* @__PURE__ */ jsx(ExpandMoreIcon, { className: classes.icon }),
+              IconButtonProps: { size: "small" },
+              children: expanded ? "Collapse" : definedTypes.filter((t) => t.value === selected)[0].name
+            }
+          ),
+          /* @__PURE__ */ jsx(AccordionDetails, { classes: { root: classes.accordionDetails }, children: /* @__PURE__ */ jsx(
+            List,
+            {
+              className: classes.list,
+              component: "nav",
+              "aria-label": "filter by type",
+              disablePadding: true,
+              dense: true,
+              children: definedTypes.map((type) => /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(Divider, {}),
+                /* @__PURE__ */ jsxs(
+                  ListItem,
+                  {
+                    selected: types[0] === type.value || types.length === 0 && type.value === "",
+                    onClick: handleClick(type.value),
+                    button: true,
+                    children: [
+                      /* @__PURE__ */ jsx(ListItemIcon, { children: cloneElement(type.icon, {
+                        className: classes.listItemIcon
+                      }) }),
+                      /* @__PURE__ */ jsx(
+                        ListItemText,
+                        {
+                          primary: type.name,
+                          secondary: resultCounts && resultCounts[type.value]
+                        }
+                      )
+                    ]
+                  }
+                )
+              ] }, type.value))
+            }
+          ) })
+        ]
+      }
+    )
+  ] });
 };
 
 export { SearchTypeAccordion };

package/dist/components/SearchType/SearchType.Accordion.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchType.Accordion.esm.js","sources":["../../../src/components/SearchType/SearchType.Accordion.tsx"],"sourcesContent":["/*\n * Copyright 2021 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, { cloneElement, Fragment, useEffect, useState } from 'react';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { searchApiRef, useSearch } from '@backstage/plugin-search-react';\nimport Accordion from '@material-ui/core/Accordion';\nimport AccordionSummary from '@material-ui/core/AccordionSummary';\nimport AccordionDetails from '@material-ui/core/AccordionDetails';\nimport Box from '@material-ui/core/Box';\nimport Divider from '@material-ui/core/Divider';\nimport List from '@material-ui/core/List';\nimport ListItem from '@material-ui/core/ListItem';\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport { makeStyles } from '@material-ui/core/styles';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport Typography from '@material-ui/core/Typography';\nimport AllIcon from '@material-ui/icons/FontDownload';\nimport useAsync from 'react-use/esm/useAsync';\n\nconst useStyles = makeStyles(theme => ({\n  icon: {\n    color: theme.palette.text.primary,\n  },\n  list: {\n    width: '100%',\n  },\n  listItemIcon: {\n    width: '24px',\n    height: '24px',\n  },\n  accordion: {\n    backgroundColor: theme.palette.background.paper,\n  },\n  accordionSummary: {\n    minHeight: 'auto',\n    '&.Mui-expanded': {\n      minHeight: 'auto',\n    },\n  },\n  accordionSummaryContent: {\n    margin: theme.spacing(2, 0),\n    '&.Mui-expanded': {\n      margin: theme.spacing(2, 0),\n    },\n  },\n  accordionDetails: {\n    padding: theme.spacing(0, 0, 1),\n  },\n}));\n\n/**\n * @public\n */\nexport type SearchTypeAccordionProps = {\n  name: string;\n  types: Array<{\n    value: string;\n    name: string;\n    icon: JSX.Element;\n  }>;\n  defaultValue?: string;\n  showCounts?: boolean;\n};\n\nexport const SearchTypeAccordion = (props: SearchTypeAccordionProps) => {\n  const classes = useStyles();\n  const { filters, setPageCursor, setTypes, term, types } = useSearch();\n  const searchApi = useApi(searchApiRef);\n  const [expanded, setExpanded] = useState(true);\n  const { defaultValue, name, showCounts, types: givenTypes } = props;\n\n  const toggleExpanded = () => setExpanded(prevState => !prevState);\n  const handleClick = (type: string) => {\n    return () => {\n      setTypes(type !== '' ? [type] : []);\n      setPageCursor(undefined);\n    };\n  };\n\n  // Handle any provided defaultValue\n  useEffect(() => {\n    if (defaultValue) {\n      setTypes([defaultValue]);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const definedTypes = [\n    {\n      value: '',\n      name: 'All',\n      icon: <AllIcon />,\n    },\n    ...givenTypes,\n  ];\n  const selected = types[0] || '';\n\n  const { value: resultCounts } = useAsync(async () => {\n    if (!showCounts) {\n      return {};\n    }\n\n    const counts = await Promise.all(\n      definedTypes\n        .map(t => t.value)\n        .map(async type => {\n          const { numberOfResults } = await searchApi.query({\n            term,\n            types: type ? [type] : [],\n            filters:\n              types.includes(type) || (!types.length && !type) ? filters : {},\n            pageLimit: 0,\n          });\n\n          return [\n            type,\n            numberOfResults !== undefined\n              ? `${\n                  numberOfResults >= 10000 ? `>10000` : numberOfResults\n                } results`\n              : ' -- ',\n          ];\n        }),\n    );\n\n    return Object.fromEntries(counts);\n  }, [filters, showCounts, term, types]);\n\n  return (\n    <Box>\n      <Typography variant=\"body2\" component=\"h2\">\n        {name}\n      </Typography>\n      <Accordion\n        className={classes.accordion}\n        expanded={expanded}\n        onChange={toggleExpanded}\n      >\n        <AccordionSummary\n          classes={{\n            root: classes.accordionSummary,\n            content: classes.accordionSummaryContent,\n          }}\n          expandIcon={<ExpandMoreIcon className={classes.icon} />}\n          IconButtonProps={{ size: 'small' }}\n        >\n          {expanded\n            ? 'Collapse'\n            : definedTypes.filter(t => t.value === selected)[0]!.name}\n        </AccordionSummary>\n        <AccordionDetails classes={{ root: classes.accordionDetails }}>\n          <List\n            className={classes.list}\n            component=\"nav\"\n            aria-label=\"filter by type\"\n            disablePadding\n            dense\n          >\n            {definedTypes.map(type => (\n              <Fragment key={type.value}>\n                <Divider />\n                <ListItem\n                  selected={\n                    types[0] === type.value ||\n                    (types.length === 0 && type.value === '')\n                  }\n                  onClick={handleClick(type.value)}\n                  button\n                >\n                  <ListItemIcon>\n                    {cloneElement(type.icon, {\n                      className: classes.listItemIcon,\n                    })}\n                  </ListItemIcon>\n                  <ListItemText\n                    primary={type.name}\n                    secondary={resultCounts && resultCounts[type.value]}\n                  />\n                </ListItem>\n              </Fragment>\n            ))}\n          </List>\n        </AccordionDetails>\n      </Accordion>\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SearchType.Accordion.esm.js","sources":["../../../src/components/SearchType/SearchType.Accordion.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 { cloneElement, Fragment, useEffect, useState } from 'react';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { searchApiRef, useSearch } from '@backstage/plugin-search-react';\nimport Accordion from '@material-ui/core/Accordion';\nimport AccordionSummary from '@material-ui/core/AccordionSummary';\nimport AccordionDetails from '@material-ui/core/AccordionDetails';\nimport Box from '@material-ui/core/Box';\nimport Divider from '@material-ui/core/Divider';\nimport List from '@material-ui/core/List';\nimport ListItem from '@material-ui/core/ListItem';\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport { makeStyles } from '@material-ui/core/styles';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport Typography from '@material-ui/core/Typography';\nimport AllIcon from '@material-ui/icons/FontDownload';\nimport useAsync from 'react-use/esm/useAsync';\n\nconst useStyles = makeStyles(theme => ({\n  icon: {\n    color: theme.palette.text.primary,\n  },\n  list: {\n    width: '100%',\n  },\n  listItemIcon: {\n    width: '24px',\n    height: '24px',\n  },\n  accordion: {\n    backgroundColor: theme.palette.background.paper,\n  },\n  accordionSummary: {\n    minHeight: 'auto',\n    '&.Mui-expanded': {\n      minHeight: 'auto',\n    },\n  },\n  accordionSummaryContent: {\n    margin: theme.spacing(2, 0),\n    '&.Mui-expanded': {\n      margin: theme.spacing(2, 0),\n    },\n  },\n  accordionDetails: {\n    padding: theme.spacing(0, 0, 1),\n  },\n}));\n\n/**\n * @public\n */\nexport type SearchTypeAccordionProps = {\n  name: string;\n  types: Array<{\n    value: string;\n    name: string;\n    icon: JSX.Element;\n  }>;\n  defaultValue?: string;\n  showCounts?: boolean;\n};\n\nexport const SearchTypeAccordion = (props: SearchTypeAccordionProps) => {\n  const classes = useStyles();\n  const { filters, setPageCursor, setTypes, term, types } = useSearch();\n  const searchApi = useApi(searchApiRef);\n  const [expanded, setExpanded] = useState(true);\n  const { defaultValue, name, showCounts, types: givenTypes } = props;\n\n  const toggleExpanded = () => setExpanded(prevState => !prevState);\n  const handleClick = (type: string) => {\n    return () => {\n      setTypes(type !== '' ? [type] : []);\n      setPageCursor(undefined);\n    };\n  };\n\n  // Handle any provided defaultValue\n  useEffect(() => {\n    if (defaultValue) {\n      setTypes([defaultValue]);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const definedTypes = [\n    {\n      value: '',\n      name: 'All',\n      icon: <AllIcon />,\n    },\n    ...givenTypes,\n  ];\n  const selected = types[0] || '';\n\n  const { value: resultCounts } = useAsync(async () => {\n    if (!showCounts) {\n      return {};\n    }\n\n    const counts = await Promise.all(\n      definedTypes\n        .map(t => t.value)\n        .map(async type => {\n          const { numberOfResults } = await searchApi.query({\n            term,\n            types: type ? [type] : [],\n            filters:\n              types.includes(type) || (!types.length && !type) ? filters : {},\n            pageLimit: 0,\n          });\n\n          return [\n            type,\n            numberOfResults !== undefined\n              ? `${\n                  numberOfResults >= 10000 ? `>10000` : numberOfResults\n                } results`\n              : ' -- ',\n          ];\n        }),\n    );\n\n    return Object.fromEntries(counts);\n  }, [filters, showCounts, term, types]);\n\n  return (\n    <Box>\n      <Typography variant=\"body2\" component=\"h2\">\n        {name}\n      </Typography>\n      <Accordion\n        className={classes.accordion}\n        expanded={expanded}\n        onChange={toggleExpanded}\n      >\n        <AccordionSummary\n          classes={{\n            root: classes.accordionSummary,\n            content: classes.accordionSummaryContent,\n          }}\n          expandIcon={<ExpandMoreIcon className={classes.icon} />}\n          IconButtonProps={{ size: 'small' }}\n        >\n          {expanded\n            ? 'Collapse'\n            : definedTypes.filter(t => t.value === selected)[0]!.name}\n        </AccordionSummary>\n        <AccordionDetails classes={{ root: classes.accordionDetails }}>\n          <List\n            className={classes.list}\n            component=\"nav\"\n            aria-label=\"filter by type\"\n            disablePadding\n            dense\n          >\n            {definedTypes.map(type => (\n              <Fragment key={type.value}>\n                <Divider />\n                <ListItem\n                  selected={\n                    types[0] === type.value ||\n                    (types.length === 0 && type.value === '')\n                  }\n                  onClick={handleClick(type.value)}\n                  button\n                >\n                  <ListItemIcon>\n                    {cloneElement(type.icon, {\n                      className: classes.listItemIcon,\n                    })}\n                  </ListItemIcon>\n                  <ListItemText\n                    primary={type.name}\n                    secondary={resultCounts && resultCounts[type.value]}\n                  />\n                </ListItem>\n              </Fragment>\n            ))}\n          </List>\n        </AccordionDetails>\n      </Accordion>\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/SearchType/SearchType.Tabs.esm.js

@@ -1,4 +1,5 @@
-import React, { useEffect } from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { useEffect } from 'react';
 import { useSearch } from '@backstage/plugin-search-react';
 import Tab from '@material-ui/core/Tab';
 import Tabs from '@material-ui/core/Tabs';
@@ -36,24 +37,24 @@ const SearchTypeTabs = (props) => {
     },
     ...givenTypes
   ];
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Tabs,
     {
       "aria-label": "List of search types tabs",
       className: classes.tabs,
       indicatorColor: "primary",
       value: types.length === 0 ? "" : types[0],
-      onChange: changeTab
-    },
-    definedTypes.map((type, idx) => /* @__PURE__ */ React.createElement(
-      Tab,
-      {
-        key: idx,
-        className: classes.tab,
-        label: type.name,
-        value: type.value
-      }
-    ))
+      onChange: changeTab,
+      children: definedTypes.map((type, idx) => /* @__PURE__ */ jsx(
+        Tab,
+        {
+          className: classes.tab,
+          label: type.name,
+          value: type.value
+        },
+        idx
+      ))
+    }
   );
 };
 

package/dist/components/SearchType/SearchType.Tabs.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchType.Tabs.esm.js","sources":["../../../src/components/SearchType/SearchType.Tabs.tsx"],"sourcesContent":["/*\n * Copyright 2021 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, { useEffect } from 'react';\nimport { useSearch } from '@backstage/plugin-search-react';\nimport Tab from '@material-ui/core/Tab';\nimport Tabs from '@material-ui/core/Tabs';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { Theme } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles((theme: Theme) => ({\n  tabs: {\n    borderBottom: `1px solid ${theme.palette.textVerySubtle}`,\n  },\n  tab: {\n    height: '50px',\n    fontWeight: theme.typography.fontWeightBold,\n    fontSize: theme.typography.pxToRem(13),\n    color: theme.palette.text.primary,\n    minWidth: '130px',\n  },\n}));\n\n/**\n * @public\n */\nexport type SearchTypeTabsProps = {\n  types: Array<{\n    value: string;\n    name: string;\n  }>;\n  defaultValue?: string;\n};\n\nexport const SearchTypeTabs = (props: SearchTypeTabsProps) => {\n  const classes = useStyles();\n  const { setPageCursor, setTypes, types } = useSearch();\n  const { defaultValue, types: givenTypes } = props;\n\n  const changeTab = (_: React.ChangeEvent<{}>, newType: string) => {\n    setTypes(newType !== '' ? [newType] : []);\n    setPageCursor(undefined);\n  };\n\n  // Handle any provided defaultValue\n  useEffect(() => {\n    if (defaultValue) {\n      setTypes([defaultValue]);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const definedTypes = [\n    {\n      value: '',\n      name: 'All',\n    },\n    ...givenTypes,\n  ];\n\n  return (\n    <Tabs\n      aria-label=\"List of search types tabs\"\n      className={classes.tabs}\n      indicatorColor=\"primary\"\n      value={types.length === 0 ? '' : types[0]}\n      onChange={changeTab}\n    >\n      {definedTypes.map((type, idx) => (\n        <Tab\n          key={idx}\n          className={classes.tab}\n          label={type.name}\n          value={type.value}\n        />\n      ))}\n    </Tabs>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAuBA,MAAM,SAAA,GAAY,UAAW,CAAA,CAAC,KAAkB,MAAA;AAAA,EAC9C,IAAM,EAAA;AAAA,IACJ,YAAc,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,cAAc,CAAA;AAAA,GACzD;AAAA,EACA,GAAK,EAAA;AAAA,IACH,MAAQ,EAAA,MAAA;AAAA,IACR,UAAA,EAAY,MAAM,UAAW,CAAA,cAAA;AAAA,IAC7B,QAAU,EAAA,KAAA,CAAM,UAAW,CAAA,OAAA,CAAQ,EAAE,CAAA;AAAA,IACrC,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA;AAAA,IAC1B,QAAU,EAAA;AAAA;AAEd,CAAE,CAAA,CAAA;AAaW,MAAA,cAAA,GAAiB,CAAC,KAA+B,KAAA;AAC5D,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EAAA,MAAM,EAAE,aAAA,EAAe,QAAU,EAAA,KAAA,KAAU,SAAU,EAAA;AACrD,EAAA,MAAM,EAAE,YAAA,EAAc,KAAO,EAAA,UAAA,EAAe,GAAA,KAAA;AAE5C,EAAM,MAAA,SAAA,GAAY,CAAC,CAAA,EAA0B,OAAoB,KAAA;AAC/D,IAAA,QAAA,CAAS,YAAY,EAAK,GAAA,CAAC,OAAO,CAAA,GAAI,EAAE,CAAA;AACxC,IAAA,aAAA,CAAc,KAAS,CAAA,CAAA;AAAA,GACzB;AAGA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,YAAc,EAAA;AAChB,MAAS,QAAA,CAAA,CAAC,YAAY,CAAC,CAAA;AAAA;AACzB,GAEF,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,YAAe,GAAA;AAAA,IACnB;AAAA,MACE,KAAO,EAAA,EAAA;AAAA,MACP,IAAM,EAAA;AAAA,KACR;AAAA,IACA,GAAG;AAAA,GACL;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,YAAW,EAAA,2BAAA;AAAA,MACX,WAAW,OAAQ,CAAA,IAAA;AAAA,MACnB,cAAe,EAAA,SAAA;AAAA,MACf,OAAO,KAAM,CAAA,MAAA,KAAW,CAAI,GAAA,EAAA,GAAK,MAAM,CAAC,CAAA;AAAA,MACxC,QAAU,EAAA;AAAA,KAAA;AAAA,IAET,YAAa,CAAA,GAAA,CAAI,CAAC,IAAA,EAAM,GACvB,qBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,GAAA;AAAA,MAAA;AAAA,QACC,GAAK,EAAA,GAAA;AAAA,QACL,WAAW,OAAQ,CAAA,GAAA;AAAA,QACnB,OAAO,IAAK,CAAA,IAAA;AAAA,QACZ,OAAO,IAAK,CAAA;AAAA;AAAA,KAEf;AAAA,GACH;AAEJ;;;;"}
+{"version":3,"file":"SearchType.Tabs.esm.js","sources":["../../../src/components/SearchType/SearchType.Tabs.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 { ChangeEvent, useEffect } from 'react';\nimport { useSearch } from '@backstage/plugin-search-react';\nimport Tab from '@material-ui/core/Tab';\nimport Tabs from '@material-ui/core/Tabs';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { Theme } from '@material-ui/core/styles';\n\nconst useStyles = makeStyles((theme: Theme) => ({\n  tabs: {\n    borderBottom: `1px solid ${theme.palette.textVerySubtle}`,\n  },\n  tab: {\n    height: '50px',\n    fontWeight: theme.typography.fontWeightBold,\n    fontSize: theme.typography.pxToRem(13),\n    color: theme.palette.text.primary,\n    minWidth: '130px',\n  },\n}));\n\n/**\n * @public\n */\nexport type SearchTypeTabsProps = {\n  types: Array<{\n    value: string;\n    name: string;\n  }>;\n  defaultValue?: string;\n};\n\nexport const SearchTypeTabs = (props: SearchTypeTabsProps) => {\n  const classes = useStyles();\n  const { setPageCursor, setTypes, types } = useSearch();\n  const { defaultValue, types: givenTypes } = props;\n\n  const changeTab = (_: ChangeEvent<{}>, newType: string) => {\n    setTypes(newType !== '' ? [newType] : []);\n    setPageCursor(undefined);\n  };\n\n  // Handle any provided defaultValue\n  useEffect(() => {\n    if (defaultValue) {\n      setTypes([defaultValue]);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const definedTypes = [\n    {\n      value: '',\n      name: 'All',\n    },\n    ...givenTypes,\n  ];\n\n  return (\n    <Tabs\n      aria-label=\"List of search types tabs\"\n      className={classes.tabs}\n      indicatorColor=\"primary\"\n      value={types.length === 0 ? '' : types[0]}\n      onChange={changeTab}\n    >\n      {definedTypes.map((type, idx) => (\n        <Tab\n          key={idx}\n          className={classes.tab}\n          label={type.name}\n          value={type.value}\n        />\n      ))}\n    </Tabs>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAuBA,MAAM,SAAA,GAAY,UAAW,CAAA,CAAC,KAAkB,MAAA;AAAA,EAC9C,IAAM,EAAA;AAAA,IACJ,YAAc,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,cAAc,CAAA;AAAA,GACzD;AAAA,EACA,GAAK,EAAA;AAAA,IACH,MAAQ,EAAA,MAAA;AAAA,IACR,UAAA,EAAY,MAAM,UAAW,CAAA,cAAA;AAAA,IAC7B,QAAU,EAAA,KAAA,CAAM,UAAW,CAAA,OAAA,CAAQ,EAAE,CAAA;AAAA,IACrC,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA;AAAA,IAC1B,QAAU,EAAA;AAAA;AAEd,CAAE,CAAA,CAAA;AAaW,MAAA,cAAA,GAAiB,CAAC,KAA+B,KAAA;AAC5D,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EAAA,MAAM,EAAE,aAAA,EAAe,QAAU,EAAA,KAAA,KAAU,SAAU,EAAA;AACrD,EAAA,MAAM,EAAE,YAAA,EAAc,KAAO,EAAA,UAAA,EAAe,GAAA,KAAA;AAE5C,EAAM,MAAA,SAAA,GAAY,CAAC,CAAA,EAAoB,OAAoB,KAAA;AACzD,IAAA,QAAA,CAAS,YAAY,EAAK,GAAA,CAAC,OAAO,CAAA,GAAI,EAAE,CAAA;AACxC,IAAA,aAAA,CAAc,KAAS,CAAA,CAAA;AAAA,GACzB;AAGA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,YAAc,EAAA;AAChB,MAAS,QAAA,CAAA,CAAC,YAAY,CAAC,CAAA;AAAA;AACzB,GAEF,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,YAAe,GAAA;AAAA,IACnB;AAAA,MACE,KAAO,EAAA,EAAA;AAAA,MACP,IAAM,EAAA;AAAA,KACR;AAAA,IACA,GAAG;AAAA,GACL;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,YAAW,EAAA,2BAAA;AAAA,MACX,WAAW,OAAQ,CAAA,IAAA;AAAA,MACnB,cAAe,EAAA,SAAA;AAAA,MACf,OAAO,KAAM,CAAA,MAAA,KAAW,CAAI,GAAA,EAAA,GAAK,MAAM,CAAC,CAAA;AAAA,MACxC,QAAU,EAAA,SAAA;AAAA,MAET,QAAa,EAAA,YAAA,CAAA,GAAA,CAAI,CAAC,IAAA,EAAM,GACvB,qBAAA,GAAA;AAAA,QAAC,GAAA;AAAA,QAAA;AAAA,UAEC,WAAW,OAAQ,CAAA,GAAA;AAAA,UACnB,OAAO,IAAK,CAAA,IAAA;AAAA,UACZ,OAAO,IAAK,CAAA;AAAA,SAAA;AAAA,QAHP;AAAA,OAKR;AAAA;AAAA,GACH;AAEJ;;;;"}

package/dist/components/SearchType/SearchType.esm.js

@@ -1,3 +1,4 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
 import Checkbox from '@material-ui/core/Checkbox';
 import Chip from '@material-ui/core/Chip';
 import FormControl from '@material-ui/core/FormControl';
@@ -6,7 +7,6 @@ import ListItemText from '@material-ui/core/ListItemText';
 import MenuItem from '@material-ui/core/MenuItem';
 import Select from '@material-ui/core/Select';
 import { makeStyles } from '@material-ui/core/styles';
-import React from 'react';
 import useEffectOnce from 'react-use/esm/useEffectOnce';
 import { SearchTypeAccordion } from './SearchType.Accordion.esm.js';
 import { SearchTypeTabs } from './SearchType.Tabs.esm.js';
@@ -42,42 +42,47 @@ const SearchType = (props) => {
     const value = e.target.value;
     setTypes(value);
   };
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxs(
     FormControl,
     {
       className,
       variant: "filled",
       fullWidth: true,
-      "data-testid": "search-typefilter-next"
-    },
-    /* @__PURE__ */ React.createElement(InputLabel, { className: classes.label, margin: "dense" }, name),
-    /* @__PURE__ */ React.createElement(
-      Select,
-      {
-        multiple: true,
-        variant: "outlined",
-        value: types,
-        onChange: handleChange,
-        placeholder: "All Results",
-        renderValue: (selected) => /* @__PURE__ */ React.createElement("div", { className: classes.chips }, selected.map((value) => /* @__PURE__ */ React.createElement(
-          Chip,
+      "data-testid": "search-typefilter-next",
+      children: [
+        /* @__PURE__ */ jsx(InputLabel, { className: classes.label, margin: "dense", children: name }),
+        /* @__PURE__ */ jsx(
+          Select,
           {
-            key: value,
-            label: value,
-            className: classes.chip,
-            size: "small"
+            multiple: true,
+            variant: "outlined",
+            value: types,
+            onChange: handleChange,
+            placeholder: "All Results",
+            renderValue: (selected) => /* @__PURE__ */ jsx("div", { className: classes.chips, children: selected.map((value) => /* @__PURE__ */ jsx(
+              Chip,
+              {
+                label: value,
+                className: classes.chip,
+                size: "small"
+              },
+              value
+            )) }),
+            children: values.map((value) => /* @__PURE__ */ jsxs(MenuItem, { value, children: [
+              /* @__PURE__ */ jsx(Checkbox, { checked: types.indexOf(value) > -1 }),
+              /* @__PURE__ */ jsx(ListItemText, { primary: value })
+            ] }, value))
           }
-        )))
-      },
-      values.map((value) => /* @__PURE__ */ React.createElement(MenuItem, { key: value, value }, /* @__PURE__ */ React.createElement(Checkbox, { checked: types.indexOf(value) > -1 }), /* @__PURE__ */ React.createElement(ListItemText, { primary: value })))
-    )
+        )
+      ]
+    }
   );
 };
 SearchType.Accordion = (props) => {
-  return /* @__PURE__ */ React.createElement(SearchTypeAccordion, { ...props });
+  return /* @__PURE__ */ jsx(SearchTypeAccordion, { ...props });
 };
 SearchType.Tabs = (props) => {
-  return /* @__PURE__ */ React.createElement(SearchTypeTabs, { ...props });
+  return /* @__PURE__ */ jsx(SearchTypeTabs, { ...props });
 };
 
 export { SearchType };

package/dist/components/SearchType/SearchType.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchType.esm.js","sources":["../../../src/components/SearchType/SearchType.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 Checkbox from '@material-ui/core/Checkbox';\nimport Chip from '@material-ui/core/Chip';\nimport FormControl from '@material-ui/core/FormControl';\nimport InputLabel from '@material-ui/core/InputLabel';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport Select from '@material-ui/core/Select';\nimport { makeStyles } from '@material-ui/core/styles';\nimport React, { ChangeEvent } from 'react';\nimport useEffectOnce from 'react-use/esm/useEffectOnce';\nimport {\n  SearchTypeAccordion,\n  SearchTypeAccordionProps,\n} from './SearchType.Accordion';\nimport { SearchTypeTabs, SearchTypeTabsProps } from './SearchType.Tabs';\nimport { useSearch } from '@backstage/plugin-search-react';\n\nconst useStyles = makeStyles(theme => ({\n  label: {\n    textTransform: 'capitalize',\n  },\n  chips: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    marginTop: theme.spacing(1),\n  },\n  chip: {\n    margin: 2,\n  },\n}));\n\n/**\n * Props for {@link SearchType}.\n *\n * @public\n */\nexport type SearchTypeProps = {\n  className?: string;\n  name: string;\n  values?: string[];\n  defaultValue?: string[] | string | null;\n};\n\n/**\n * @public\n */\nconst SearchType = (props: SearchTypeProps) => {\n  const { className, defaultValue, name, values = [] } = props;\n  const classes = useStyles();\n  const { types, setTypes } = useSearch();\n\n  useEffectOnce(() => {\n    if (!types.length) {\n      if (defaultValue && Array.isArray(defaultValue)) {\n        setTypes(defaultValue);\n      } else if (defaultValue) {\n        setTypes([defaultValue]);\n      }\n    }\n  });\n\n  const handleChange = (e: ChangeEvent<{ value: unknown }>) => {\n    const value = e.target.value as string[];\n    setTypes(value as string[]);\n  };\n\n  return (\n    <FormControl\n      className={className}\n      variant=\"filled\"\n      fullWidth\n      data-testid=\"search-typefilter-next\"\n    >\n      <InputLabel className={classes.label} margin=\"dense\">\n        {name}\n      </InputLabel>\n      <Select\n        multiple\n        variant=\"outlined\"\n        value={types}\n        onChange={handleChange}\n        placeholder=\"All Results\"\n        renderValue={selected => (\n          <div className={classes.chips}>\n            {(selected as string[]).map(value => (\n              <Chip\n                key={value}\n                label={value}\n                className={classes.chip}\n                size=\"small\"\n              />\n            ))}\n          </div>\n        )}\n      >\n        {values.map((value: string) => (\n          <MenuItem key={value} value={value}>\n            <Checkbox checked={types.indexOf(value) > -1} />\n            <ListItemText primary={value} />\n          </MenuItem>\n        ))}\n      </Select>\n    </FormControl>\n  );\n};\n\n/**\n * A control surface for the search query's \"types\" property, displayed as a\n * single-select collapsible accordion suitable for use in faceted search UIs.\n * @public\n */\nSearchType.Accordion = (props: SearchTypeAccordionProps) => {\n  return <SearchTypeAccordion {...props} />;\n};\n\n/**\n * A control surface for the search query's \"types\" property, displayed as a\n * tabs suitable for use in faceted search UIs.\n * @public\n */\nSearchType.Tabs = (props: SearchTypeTabsProps) => {\n  return <SearchTypeTabs {...props} />;\n};\n\nexport { SearchType };\nexport type { SearchTypeAccordionProps, SearchTypeTabsProps };\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SearchType.esm.js","sources":["../../../src/components/SearchType/SearchType.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 Checkbox from '@material-ui/core/Checkbox';\nimport Chip from '@material-ui/core/Chip';\nimport FormControl from '@material-ui/core/FormControl';\nimport InputLabel from '@material-ui/core/InputLabel';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport MenuItem from '@material-ui/core/MenuItem';\nimport Select from '@material-ui/core/Select';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { ChangeEvent } from 'react';\nimport useEffectOnce from 'react-use/esm/useEffectOnce';\nimport {\n  SearchTypeAccordion,\n  SearchTypeAccordionProps,\n} from './SearchType.Accordion';\nimport { SearchTypeTabs, SearchTypeTabsProps } from './SearchType.Tabs';\nimport { useSearch } from '@backstage/plugin-search-react';\n\nconst useStyles = makeStyles(theme => ({\n  label: {\n    textTransform: 'capitalize',\n  },\n  chips: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    marginTop: theme.spacing(1),\n  },\n  chip: {\n    margin: 2,\n  },\n}));\n\n/**\n * Props for {@link SearchType}.\n *\n * @public\n */\nexport type SearchTypeProps = {\n  className?: string;\n  name: string;\n  values?: string[];\n  defaultValue?: string[] | string | null;\n};\n\n/**\n * @public\n */\nconst SearchType = (props: SearchTypeProps) => {\n  const { className, defaultValue, name, values = [] } = props;\n  const classes = useStyles();\n  const { types, setTypes } = useSearch();\n\n  useEffectOnce(() => {\n    if (!types.length) {\n      if (defaultValue && Array.isArray(defaultValue)) {\n        setTypes(defaultValue);\n      } else if (defaultValue) {\n        setTypes([defaultValue]);\n      }\n    }\n  });\n\n  const handleChange = (e: ChangeEvent<{ value: unknown }>) => {\n    const value = e.target.value as string[];\n    setTypes(value as string[]);\n  };\n\n  return (\n    <FormControl\n      className={className}\n      variant=\"filled\"\n      fullWidth\n      data-testid=\"search-typefilter-next\"\n    >\n      <InputLabel className={classes.label} margin=\"dense\">\n        {name}\n      </InputLabel>\n      <Select\n        multiple\n        variant=\"outlined\"\n        value={types}\n        onChange={handleChange}\n        placeholder=\"All Results\"\n        renderValue={selected => (\n          <div className={classes.chips}>\n            {(selected as string[]).map(value => (\n              <Chip\n                key={value}\n                label={value}\n                className={classes.chip}\n                size=\"small\"\n              />\n            ))}\n          </div>\n        )}\n      >\n        {values.map((value: string) => (\n          <MenuItem key={value} value={value}>\n            <Checkbox checked={types.indexOf(value) > -1} />\n            <ListItemText primary={value} />\n          </MenuItem>\n        ))}\n      </Select>\n    </FormControl>\n  );\n};\n\n/**\n * A control surface for the search query's \"types\" property, displayed as a\n * single-select collapsible accordion suitable for use in faceted search UIs.\n * @public\n */\nSearchType.Accordion = (props: SearchTypeAccordionProps) => {\n  return <SearchTypeAccordion {...props} />;\n};\n\n/**\n * A control surface for the search query's \"types\" property, displayed as a\n * tabs suitable for use in faceted search UIs.\n * @public\n */\nSearchType.Tabs = (props: SearchTypeTabsProps) => {\n  return <SearchTypeTabs {...props} />;\n};\n\nexport { SearchType };\nexport type { SearchTypeAccordionProps, SearchTypeTabsProps };\n"],"names":[],"mappings":"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"}

package/dist/components/SidebarSearch/SidebarSearch.esm.js

@@ -1,5 +1,6 @@
+import { jsx } from 'react/jsx-runtime';
 import qs from 'qs';
-import React, { useCallback } from 'react';
+import { useCallback } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { rootRouteRef } from '../../plugin.esm.js';
 import { useRouteRef } from '@backstage/core-plugin-api';
@@ -17,7 +18,7 @@ const SidebarSearch = (props) => {
     },
     [focusContent, navigate, searchRoute]
   );
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     SidebarSearchField,
     {
       icon: props.icon,

package/dist/components/SidebarSearch/SidebarSearch.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarSearch.esm.js","sources":["../../../src/components/SidebarSearch/SidebarSearch.tsx"],"sourcesContent":["/*\n * Copyright 2020 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 qs from 'qs';\nimport React, { useCallback } from 'react';\nimport { useNavigate } from 'react-router-dom';\nimport { rootRouteRef } from '../../plugin';\n\nimport { useRouteRef, IconComponent } from '@backstage/core-plugin-api';\nimport { SidebarSearchField, useContent } from '@backstage/core-components';\n\n/**\n * Props for {@link SidebarSearch}.\n *\n * @public\n */\nexport type SidebarSearchProps = {\n  icon?: IconComponent;\n};\n\n/**\n * @public\n */\nexport const SidebarSearch = (props: SidebarSearchProps) => {\n  const searchRoute = useRouteRef(rootRouteRef);\n  const { focusContent } = useContent();\n  const navigate = useNavigate();\n  const handleSearch = useCallback(\n    (query: string): void => {\n      const queryString = qs.stringify({ query }, { addQueryPrefix: true });\n      focusContent();\n      navigate(`${searchRoute()}${queryString}`);\n    },\n    [focusContent, navigate, searchRoute],\n  );\n\n  return (\n    <SidebarSearchField\n      icon={props.icon}\n      onSearch={handleSearch}\n      to=\"/search\"\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAmCa,MAAA,aAAA,GAAgB,CAAC,KAA8B,KAAA;AAC1D,EAAM,MAAA,WAAA,GAAc,YAAY,YAAY,CAAA;AAC5C,EAAM,MAAA,EAAE,YAAa,EAAA,GAAI,UAAW,EAAA;AACpC,EAAA,MAAM,WAAW,WAAY,EAAA;AAC7B,EAAA,MAAM,YAAe,GAAA,WAAA;AAAA,IACnB,CAAC,KAAwB,KAAA;AACvB,MAAM,MAAA,WAAA,GAAc,GAAG,SAAU,CAAA,EAAE,OAAS,EAAA,EAAE,cAAgB,EAAA,IAAA,EAAM,CAAA;AACpE,MAAa,YAAA,EAAA;AACb,MAAA,QAAA,CAAS,CAAG,EAAA,WAAA,EAAa,CAAA,EAAG,WAAW,CAAE,CAAA,CAAA;AAAA,KAC3C;AAAA,IACA,CAAC,YAAc,EAAA,QAAA,EAAU,WAAW;AAAA,GACtC;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,kBAAA;AAAA,IAAA;AAAA,MACC,MAAM,KAAM,CAAA,IAAA;AAAA,MACZ,QAAU,EAAA,YAAA;AAAA,MACV,EAAG,EAAA;AAAA;AAAA,GACL;AAEJ;;;;"}
+{"version":3,"file":"SidebarSearch.esm.js","sources":["../../../src/components/SidebarSearch/SidebarSearch.tsx"],"sourcesContent":["/*\n * Copyright 2020 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 qs from 'qs';\nimport { useCallback } from 'react';\nimport { useNavigate } from 'react-router-dom';\nimport { rootRouteRef } from '../../plugin';\n\nimport { useRouteRef, IconComponent } from '@backstage/core-plugin-api';\nimport { SidebarSearchField, useContent } from '@backstage/core-components';\n\n/**\n * Props for {@link SidebarSearch}.\n *\n * @public\n */\nexport type SidebarSearchProps = {\n  icon?: IconComponent;\n};\n\n/**\n * @public\n */\nexport const SidebarSearch = (props: SidebarSearchProps) => {\n  const searchRoute = useRouteRef(rootRouteRef);\n  const { focusContent } = useContent();\n  const navigate = useNavigate();\n  const handleSearch = useCallback(\n    (query: string): void => {\n      const queryString = qs.stringify({ query }, { addQueryPrefix: true });\n      focusContent();\n      navigate(`${searchRoute()}${queryString}`);\n    },\n    [focusContent, navigate, searchRoute],\n  );\n\n  return (\n    <SidebarSearchField\n      icon={props.icon}\n      onSearch={handleSearch}\n      to=\"/search\"\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAmCa,MAAA,aAAA,GAAgB,CAAC,KAA8B,KAAA;AAC1D,EAAM,MAAA,WAAA,GAAc,YAAY,YAAY,CAAA;AAC5C,EAAM,MAAA,EAAE,YAAa,EAAA,GAAI,UAAW,EAAA;AACpC,EAAA,MAAM,WAAW,WAAY,EAAA;AAC7B,EAAA,MAAM,YAAe,GAAA,WAAA;AAAA,IACnB,CAAC,KAAwB,KAAA;AACvB,MAAM,MAAA,WAAA,GAAc,GAAG,SAAU,CAAA,EAAE,OAAS,EAAA,EAAE,cAAgB,EAAA,IAAA,EAAM,CAAA;AACpE,MAAa,YAAA,EAAA;AACb,MAAA,QAAA,CAAS,CAAG,EAAA,WAAA,EAAa,CAAA,EAAG,WAAW,CAAE,CAAA,CAAA;AAAA,KAC3C;AAAA,IACA,CAAC,YAAc,EAAA,QAAA,EAAU,WAAW;AAAA,GACtC;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,kBAAA;AAAA,IAAA;AAAA,MACC,MAAM,KAAM,CAAA,IAAA;AAAA,MACZ,QAAU,EAAA,YAAA;AAAA,MACV,EAAG,EAAA;AAAA;AAAA,GACL;AAEJ;;;;"}

package/dist/components/SidebarSearchModal/SidebarSearchModal.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import SearchIcon from '@material-ui/icons/Search';
 import { SidebarItem } from '@backstage/core-components';
 import { SearchModal } from '../SearchModal/SearchModal.esm.js';
@@ -7,26 +7,29 @@ import { SearchModalProvider, useSearchModal } from '../SearchModal/useSearchMod
 const SidebarSearchModalContent = (props) => {
   const { state, toggleModal } = useSearchModal();
   const Icon = props.icon ? props.icon : SearchIcon;
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    SidebarItem,
-    {
-      className: "search-icon",
-      icon: Icon,
-      text: "Search",
-      onClick: toggleModal
-    }
-  ), /* @__PURE__ */ React.createElement(
-    SearchModal,
-    {
-      ...state,
-      toggleModal,
-      resultItemComponents: props.resultItemComponents,
-      children: props.children
-    }
-  ));
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      SidebarItem,
+      {
+        className: "search-icon",
+        icon: Icon,
+        text: "Search",
+        onClick: toggleModal
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      SearchModal,
+      {
+        ...state,
+        toggleModal,
+        resultItemComponents: props.resultItemComponents,
+        children: props.children
+      }
+    )
+  ] });
 };
 const SidebarSearchModal = (props) => {
-  return /* @__PURE__ */ React.createElement(SearchModalProvider, null, /* @__PURE__ */ React.createElement(SidebarSearchModalContent, { ...props }));
+  return /* @__PURE__ */ jsx(SearchModalProvider, { children: /* @__PURE__ */ jsx(SidebarSearchModalContent, { ...props }) });
 };
 
 export { SidebarSearchModal };

package/dist/components/SidebarSearchModal/SidebarSearchModal.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarSearchModal.esm.js","sources":["../../../src/components/SidebarSearchModal/SidebarSearchModal.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 React from 'react';\nimport SearchIcon from '@material-ui/icons/Search';\nimport { SidebarItem } from '@backstage/core-components';\nimport { IconComponent } from '@backstage/core-plugin-api';\nimport {\n  SearchModal,\n  SearchModalProps,\n  SearchModalProvider,\n  useSearchModal,\n} from '../SearchModal';\n\n/**\n * Props for {@link SidebarSearchModal}.\n *\n * @public\n */\nexport type SidebarSearchModalProps = Pick<\n  SearchModalProps,\n  'children' | 'resultItemComponents'\n> & {\n  icon?: IconComponent;\n};\n\nconst SidebarSearchModalContent = (props: SidebarSearchModalProps) => {\n  const { state, toggleModal } = useSearchModal();\n  const Icon = props.icon ? props.icon : SearchIcon;\n\n  return (\n    <>\n      <SidebarItem\n        className=\"search-icon\"\n        icon={Icon}\n        text=\"Search\"\n        onClick={toggleModal}\n      />\n      <SearchModal\n        {...state}\n        toggleModal={toggleModal}\n        resultItemComponents={props.resultItemComponents}\n        children={props.children}\n      />\n    </>\n  );\n};\n\nexport const SidebarSearchModal = (props: SidebarSearchModalProps) => {\n  return (\n    <SearchModalProvider>\n      <SidebarSearchModalContent {...props} />\n    </SearchModalProvider>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAsCA,MAAM,yBAAA,GAA4B,CAAC,KAAmC,KAAA;AACpE,EAAA,MAAM,EAAE,KAAA,EAAO,WAAY,EAAA,GAAI,cAAe,EAAA;AAC9C,EAAA,MAAM,IAAO,GAAA,KAAA,CAAM,IAAO,GAAA,KAAA,CAAM,IAAO,GAAA,UAAA;AAEvC,EAAA,uBAEI,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,SAAU,EAAA,aAAA;AAAA,MACV,IAAM,EAAA,IAAA;AAAA,MACN,IAAK,EAAA,QAAA;AAAA,MACL,OAAS,EAAA;AAAA;AAAA,GAEX,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,WAAA;AAAA,MACA,sBAAsB,KAAM,CAAA,oBAAA;AAAA,MAC5B,UAAU,KAAM,CAAA;AAAA;AAAA,GAEpB,CAAA;AAEJ,CAAA;AAEa,MAAA,kBAAA,GAAqB,CAAC,KAAmC,KAAA;AACpE,EAAA,2CACG,mBACC,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,yBAA2B,EAAA,EAAA,GAAG,OAAO,CACxC,CAAA;AAEJ;;;;"}
+{"version":3,"file":"SidebarSearchModal.esm.js","sources":["../../../src/components/SidebarSearchModal/SidebarSearchModal.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 SearchIcon from '@material-ui/icons/Search';\nimport { SidebarItem } from '@backstage/core-components';\nimport { IconComponent } from '@backstage/core-plugin-api';\nimport {\n  SearchModal,\n  SearchModalProps,\n  SearchModalProvider,\n  useSearchModal,\n} from '../SearchModal';\n\n/**\n * Props for {@link SidebarSearchModal}.\n *\n * @public\n */\nexport type SidebarSearchModalProps = Pick<\n  SearchModalProps,\n  'children' | 'resultItemComponents'\n> & {\n  icon?: IconComponent;\n};\n\nconst SidebarSearchModalContent = (props: SidebarSearchModalProps) => {\n  const { state, toggleModal } = useSearchModal();\n  const Icon = props.icon ? props.icon : SearchIcon;\n\n  return (\n    <>\n      <SidebarItem\n        className=\"search-icon\"\n        icon={Icon}\n        text=\"Search\"\n        onClick={toggleModal}\n      />\n      <SearchModal\n        {...state}\n        toggleModal={toggleModal}\n        resultItemComponents={props.resultItemComponents}\n        children={props.children}\n      />\n    </>\n  );\n};\n\nexport const SidebarSearchModal = (props: SidebarSearchModalProps) => {\n  return (\n    <SearchModalProvider>\n      <SidebarSearchModalContent {...props} />\n    </SearchModalProvider>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAqCA,MAAM,yBAAA,GAA4B,CAAC,KAAmC,KAAA;AACpE,EAAA,MAAM,EAAE,KAAA,EAAO,WAAY,EAAA,GAAI,cAAe,EAAA;AAC9C,EAAA,MAAM,IAAO,GAAA,KAAA,CAAM,IAAO,GAAA,KAAA,CAAM,IAAO,GAAA,UAAA;AAEvC,EAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,WAAA;AAAA,MAAA;AAAA,QACC,SAAU,EAAA,aAAA;AAAA,QACV,IAAM,EAAA,IAAA;AAAA,QACN,IAAK,EAAA,QAAA;AAAA,QACL,OAAS,EAAA;AAAA;AAAA,KACX;AAAA,oBACA,GAAA;AAAA,MAAC,WAAA;AAAA,MAAA;AAAA,QACE,GAAG,KAAA;AAAA,QACJ,WAAA;AAAA,QACA,sBAAsB,KAAM,CAAA,oBAAA;AAAA,QAC5B,UAAU,KAAM,CAAA;AAAA;AAAA;AAClB,GACF,EAAA,CAAA;AAEJ,CAAA;AAEa,MAAA,kBAAA,GAAqB,CAAC,KAAmC,KAAA;AACpE,EAAA,2BACG,mBACC,EAAA,EAAA,QAAA,kBAAA,GAAA,CAAC,yBAA2B,EAAA,EAAA,GAAG,OAAO,CACxC,EAAA,CAAA;AAEJ;;;;"}