@backstage/plugin-search-react 1.7.10 → 1.7.11-next.0

package/dist/extensions.esm.js

@@ -0,0 +1,123 @@
+import React, { useCallback, createElement, Fragment, isValidElement, cloneElement } from 'react';
+import { useAnalytics, createReactExtension, useElementFilter, getComponentData } from '@backstage/core-plugin-api';
+import List from '@material-ui/core/List';
+import ListItem from '@material-ui/core/ListItem';
+import { DefaultResultListItem as HigherOrderDefaultResultListItem } from './components/DefaultResultListItem/DefaultResultListItem.esm.js';
+
+const SEARCH_RESULT_LIST_ITEM_EXTENSION = "search.results.list.items.extensions.v1";
+const findSearchResultListItemExtensionElement = (elements, result) => {
+  for (const element of elements) {
+    if (!isValidElement(element))
+      continue;
+    const predicate = getComponentData(
+      element,
+      SEARCH_RESULT_LIST_ITEM_EXTENSION
+    );
+    if (!(predicate == null ? void 0 : predicate(result)))
+      continue;
+    return cloneElement(element, {
+      rank: result.rank,
+      highlight: result.highlight,
+      result: result.document,
+      // Use props in situations where a consumer is manually rendering the extension
+      ...element.props
+    });
+  }
+  return null;
+};
+const SearchResultListItemExtension = (props) => {
+  const {
+    rank,
+    result,
+    noTrack,
+    children,
+    alignItems = "flex-start",
+    ...rest
+  } = props;
+  const analytics = useAnalytics();
+  const handleClickCapture = useCallback(() => {
+    if (noTrack)
+      return;
+    if (!result)
+      return;
+    analytics.captureEvent("discover", result.title, {
+      attributes: { to: result.location },
+      value: rank
+    });
+  }, [rank, result, noTrack, analytics]);
+  return /* @__PURE__ */ React.createElement(
+    ListItem,
+    {
+      divider: true,
+      alignItems,
+      onClickCapture: handleClickCapture,
+      ...rest
+    },
+    children
+  );
+};
+const createSearchResultListItemExtension = (options) => {
+  const { name, component, predicate = () => true } = options;
+  return createReactExtension({
+    name,
+    component: {
+      lazy: () => component().then(
+        (type) => (props) => /* @__PURE__ */ React.createElement(
+          SearchResultListItemExtension,
+          {
+            rank: props.rank,
+            result: props.result,
+            noTrack: props.noTrack
+          },
+          createElement(type, props)
+        )
+      )
+    },
+    data: {
+      [SEARCH_RESULT_LIST_ITEM_EXTENSION]: predicate
+    }
+  });
+};
+const useSearchResultListItemExtensions = (children) => {
+  const elements = useElementFilter(
+    children,
+    (collection) => {
+      return collection.selectByComponentData({
+        key: SEARCH_RESULT_LIST_ITEM_EXTENSION
+      }).getElements();
+    },
+    [children]
+  );
+  return useCallback(
+    (result, key) => {
+      const element = findSearchResultListItemExtensionElement(
+        elements,
+        result
+      );
+      return /* @__PURE__ */ React.createElement(Fragment, { key }, element != null ? element : /* @__PURE__ */ React.createElement(
+        SearchResultListItemExtension,
+        {
+          rank: result.rank,
+          result: result.document
+        },
+        /* @__PURE__ */ React.createElement(
+          HigherOrderDefaultResultListItem,
+          {
+            rank: result.rank,
+            highlight: result.highlight,
+            result: result.document
+          }
+        )
+      ));
+    },
+    [elements]
+  );
+};
+const SearchResultListItemExtensions = (props) => {
+  const { results, children, ...rest } = props;
+  const render = useSearchResultListItemExtensions(children);
+  return /* @__PURE__ */ React.createElement(List, { ...rest }, results.map(render));
+};
+
+export { SearchResultListItemExtension, SearchResultListItemExtensions, createSearchResultListItemExtension, useSearchResultListItemExtensions };
+//# sourceMappingURL=extensions.esm.js.map

package/dist/extensions.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"extensions.esm.js","sources":["../src/extensions.tsx"],"sourcesContent":["/*\n * Copyright 2023 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, {\n  Fragment,\n  ReactNode,\n  PropsWithChildren,\n  isValidElement,\n  createElement,\n  cloneElement,\n  useCallback,\n} from 'react';\n\nimport {\n  getComponentData,\n  useElementFilter,\n  Extension,\n  createReactExtension,\n  useAnalytics,\n} from '@backstage/core-plugin-api';\nimport { SearchDocument, SearchResult } from '@backstage/plugin-search-common';\n\nimport List, { ListProps } from '@material-ui/core/List';\nimport ListItem, { ListItemProps } from '@material-ui/core/ListItem';\n\nimport { DefaultResultListItem } from './components/DefaultResultListItem';\n\n/**\n * @internal\n * Key for result extensions.\n */\nconst SEARCH_RESULT_LIST_ITEM_EXTENSION =\n  'search.results.list.items.extensions.v1';\n\n/**\n * @internal\n * Returns the first extension element found for a given result, and null otherwise.\n * @param elements - All extension elements.\n * @param result - The search result.\n */\nconst findSearchResultListItemExtensionElement = (\n  elements: ReactNode[],\n  result: SearchResult,\n) => {\n  for (const element of elements) {\n    if (!isValidElement(element)) continue;\n    const predicate = getComponentData<(result: SearchResult) => boolean>(\n      element,\n      SEARCH_RESULT_LIST_ITEM_EXTENSION,\n    );\n    if (!predicate?.(result)) continue;\n    return cloneElement(element, {\n      rank: result.rank,\n      highlight: result.highlight,\n      result: result.document,\n      // Use props in situations where a consumer is manually rendering the extension\n      ...element.props,\n    });\n  }\n  return null;\n};\n\n/**\n * @public\n * Extends props for any search result list item extension\n */\nexport type SearchResultListItemExtensionProps<Props extends {} = {}> = Props &\n  PropsWithChildren<\n    {\n      rank?: number;\n      result?: SearchDocument;\n      noTrack?: boolean;\n    } & Omit<ListItemProps, 'button'>\n  >;\n\n/**\n * @internal\n * Extends children with extension capabilities.\n * @param props - see {@link SearchResultListItemExtensionProps}.\n */\nexport const SearchResultListItemExtension = (\n  props: SearchResultListItemExtensionProps,\n) => {\n  const {\n    rank,\n    result,\n    noTrack,\n    children,\n    alignItems = 'flex-start',\n    ...rest\n  } = props;\n  const analytics = useAnalytics();\n\n  const handleClickCapture = useCallback(() => {\n    if (noTrack) return;\n    if (!result) return;\n    analytics.captureEvent('discover', result.title, {\n      attributes: { to: result.location },\n      value: rank,\n    });\n  }, [rank, result, noTrack, analytics]);\n\n  return (\n    <ListItem\n      divider\n      alignItems={alignItems}\n      onClickCapture={handleClickCapture}\n      {...rest}\n    >\n      {children}\n    </ListItem>\n  );\n};\n\n/**\n * @public\n * Options for {@link createSearchResultListItemExtension}.\n */\nexport type SearchResultListItemExtensionOptions<\n  Component extends (props: any) => JSX.Element | null,\n> = {\n  /**\n   * The extension name.\n   */\n  name: string;\n  /**\n   * The extension component.\n   */\n  component: () => Promise<Component>;\n  /**\n   * When an extension defines a predicate, it returns true if the result should be rendered by that extension.\n   * Defaults to a predicate that returns true, which means it renders all sorts of results.\n   */\n  predicate?: (result: SearchResult) => boolean;\n};\n\n/**\n * @public\n * Creates a search result item extension.\n * @param options - The extension options, see {@link SearchResultListItemExtensionOptions} for more details.\n */\nexport const createSearchResultListItemExtension = <\n  Component extends (props: any) => JSX.Element | null,\n>(\n  options: SearchResultListItemExtensionOptions<Component>,\n): Extension<Component> => {\n  const { name, component, predicate = () => true } = options;\n\n  return createReactExtension<Component>({\n    name,\n    component: {\n      lazy: () =>\n        component().then(\n          type =>\n            (props => (\n              <SearchResultListItemExtension\n                rank={props.rank}\n                result={props.result}\n                noTrack={props.noTrack}\n              >\n                {createElement(type, props)}\n              </SearchResultListItemExtension>\n            )) as Component,\n        ),\n    },\n    data: {\n      [SEARCH_RESULT_LIST_ITEM_EXTENSION]: predicate,\n    },\n  });\n};\n\n/**\n * @public\n * Returns a function that renders a result using extensions.\n */\nexport const useSearchResultListItemExtensions = (children: ReactNode) => {\n  const elements = useElementFilter(\n    children,\n    collection => {\n      return collection\n        .selectByComponentData({\n          key: SEARCH_RESULT_LIST_ITEM_EXTENSION,\n        })\n        .getElements();\n    },\n    [children],\n  );\n\n  return useCallback(\n    (result: SearchResult, key?: number) => {\n      const element = findSearchResultListItemExtensionElement(\n        elements,\n        result,\n      );\n\n      return (\n        <Fragment key={key}>\n          {element ?? (\n            <SearchResultListItemExtension\n              rank={result.rank}\n              result={result.document}\n            >\n              <DefaultResultListItem\n                rank={result.rank}\n                highlight={result.highlight}\n                result={result.document}\n              />\n            </SearchResultListItemExtension>\n          )}\n        </Fragment>\n      );\n    },\n    [elements],\n  );\n};\n\n/**\n * @public\n * Props for {@link SearchResultListItemExtensions}\n */\nexport type SearchResultListItemExtensionsProps = Omit<ListProps, 'results'> & {\n  /**\n   * Search result list.\n   */\n  results: SearchResult[];\n};\n\n/**\n * @public\n * Render results using search extensions.\n * @param props - see {@link SearchResultListItemExtensionsProps}\n */\nexport const SearchResultListItemExtensions = (\n  props: SearchResultListItemExtensionsProps,\n) => {\n  const { results, children, ...rest } = props;\n  const render = useSearchResultListItemExtensions(children);\n  return <List {...rest}>{results.map(render)}</List>;\n};\n"],"names":["DefaultResultListItem"],"mappings":"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"}