@backstage/plugin-search-react 1.7.14-next.3 → 1.8.0-next.0

package/CHANGELOG.md

@@ -1,5 +1,42 @@
 # @backstage/plugin-search-react
 
+## 1.8.0-next.0
+
+### Minor Changes
+
+- 9d66d8c: Make use of the `useApp` hook to retrieve the specified search icon in the SearchBar
+
+### Patch Changes
+
+- fec8b57: Updated exports to use the new type parameters for extensions and extension blueprints.
+- f26ff99: Slight type tweak to match newer React versions better
+- 5446061: The `/alpha` export no longer export extension creators for the new frontend system, existing usage should be switched to use the equivalent extension blueprint instead. For more information see the [new frontend system 1.30 migration documentation](https://backstage.io/docs/frontend-system/architecture/migrations#130).
+- Updated dependencies
+  - @backstage/frontend-plugin-api@0.8.0-next.0
+  - @backstage/core-components@0.14.10
+  - @backstage/core-plugin-api@1.9.3
+  - @backstage/theme@0.5.6
+  - @backstage/types@1.1.1
+  - @backstage/version-bridge@1.0.8
+  - @backstage/plugin-search-common@1.2.14
+
+## 1.7.14
+
+### Patch Changes
+
+- 7bd27e1: Deprecate the old pattern of `create*Extension`, and replace it with the equivalent Blueprint implementation instead.
+- 31bfc44: Updated alpha definitions of extension data references.
+- 3123c16: Fix package metadata
+- 6349099: Added config input type to the extensions
+- Updated dependencies
+  - @backstage/frontend-plugin-api@0.7.0
+  - @backstage/core-components@0.14.10
+  - @backstage/plugin-search-common@1.2.14
+  - @backstage/core-plugin-api@1.9.3
+  - @backstage/theme@0.5.6
+  - @backstage/types@1.1.1
+  - @backstage/version-bridge@1.0.8
+
 ## 1.7.14-next.3
 
 ### Patch Changes

package/alpha/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-search-react__alpha",
-  "version": "1.7.14-next.3",
+  "version": "1.8.0-next.0",
   "main": "../dist/alpha.esm.js",
   "module": "../dist/alpha.esm.js",
   "types": "../dist/alpha.d.ts"

package/dist/alpha/blueprints/SearchResultListItemBlueprint.esm.js

@@ -0,0 +1,41 @@
+import React, { lazy } from 'react';
+import { createExtensionBlueprint, ExtensionBoundary } from '@backstage/frontend-plugin-api';
+import { searchResultListItemDataRef } from './types.esm.js';
+import { SearchResultListItemExtension } from '../../extensions.esm.js';
+
+const SearchResultListItemBlueprint = createExtensionBlueprint({
+  kind: "search-result-list-item",
+  attachTo: {
+    id: "page:search",
+    input: "items"
+  },
+  config: {
+    schema: {
+      noTrack: (z) => z.boolean().default(false)
+    }
+  },
+  output: [searchResultListItemDataRef],
+  dataRefs: {
+    item: searchResultListItemDataRef
+  },
+  *factory(params, { config, node }) {
+    const ExtensionComponent = lazy(
+      () => params.component({ config }).then((component) => ({ default: component }))
+    );
+    yield searchResultListItemDataRef({
+      predicate: params.predicate,
+      component: (props) => /* @__PURE__ */ React.createElement(ExtensionBoundary, { node }, /* @__PURE__ */ React.createElement(
+        SearchResultListItemExtension,
+        {
+          rank: props.rank,
+          result: props.result,
+          noTrack: config.noTrack
+        },
+        /* @__PURE__ */ React.createElement(ExtensionComponent, { ...props })
+      ))
+    });
+  }
+});
+
+export { SearchResultListItemBlueprint };
+//# sourceMappingURL=SearchResultListItemBlueprint.esm.js.map

package/dist/alpha/blueprints/SearchResultListItemBlueprint.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchResultListItemBlueprint.esm.js","sources":["../../../src/alpha/blueprints/SearchResultListItemBlueprint.tsx"],"sourcesContent":["/*\n * Copyright 2024 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, { lazy } from 'react';\nimport {\n  createExtensionBlueprint,\n  ExtensionBoundary,\n} from '@backstage/frontend-plugin-api';\nimport {\n  SearchResultItemExtensionComponent,\n  SearchResultItemExtensionPredicate,\n  searchResultListItemDataRef,\n} from './types';\nimport {\n  SearchResultListItemExtension,\n  SearchResultListItemExtensionProps,\n} from '../../extensions';\n\n/** @alpha */\nexport interface SearchResultListItemBlueprintParams {\n  /**\n   * The extension component.\n   */\n  component: (options: {\n    config: { noTrack?: boolean };\n  }) => Promise<SearchResultItemExtensionComponent>;\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?: SearchResultItemExtensionPredicate;\n}\n\n/**\n * @alpha\n * Creates SearchResultListItem extensions\n */\nexport const SearchResultListItemBlueprint = createExtensionBlueprint({\n  kind: 'search-result-list-item',\n  attachTo: {\n    id: 'page:search',\n    input: 'items',\n  },\n  config: {\n    schema: {\n      noTrack: z => z.boolean().default(false),\n    },\n  },\n  output: [searchResultListItemDataRef],\n  dataRefs: {\n    item: searchResultListItemDataRef,\n  },\n  *factory(params: SearchResultListItemBlueprintParams, { config, node }) {\n    const ExtensionComponent = lazy(() =>\n      params.component({ config }).then(component => ({ default: component })),\n    );\n\n    yield searchResultListItemDataRef({\n      predicate: params.predicate,\n      component: (props: SearchResultListItemExtensionProps) => (\n        <ExtensionBoundary node={node}>\n          <SearchResultListItemExtension\n            rank={props.rank}\n            result={props.result}\n            noTrack={config.noTrack}\n          >\n            <ExtensionComponent {...props} />\n          </SearchResultListItemExtension>\n        </ExtensionBoundary>\n      ),\n    });\n  },\n});\n"],"names":[],"mappings":";;;;;AAkDO,MAAM,gCAAgC,wBAAyB,CAAA;AAAA,EACpE,IAAM,EAAA,yBAAA;AAAA,EACN,QAAU,EAAA;AAAA,IACR,EAAI,EAAA,aAAA;AAAA,IACJ,KAAO,EAAA,OAAA;AAAA,GACT;AAAA,EACA,MAAQ,EAAA;AAAA,IACN,MAAQ,EAAA;AAAA,MACN,SAAS,CAAK,CAAA,KAAA,CAAA,CAAE,OAAQ,EAAA,CAAE,QAAQ,KAAK,CAAA;AAAA,KACzC;AAAA,GACF;AAAA,EACA,MAAA,EAAQ,CAAC,2BAA2B,CAAA;AAAA,EACpC,QAAU,EAAA;AAAA,IACR,IAAM,EAAA,2BAAA;AAAA,GACR;AAAA,EACA,CAAC,OAAQ,CAAA,MAAA,EAA6C,EAAE,MAAA,EAAQ,MAAQ,EAAA;AACtE,IAAA,MAAM,kBAAqB,GAAA,IAAA;AAAA,MAAK,MAC9B,MAAA,CAAO,SAAU,CAAA,EAAE,MAAO,EAAC,CAAE,CAAA,IAAA,CAAK,CAAc,SAAA,MAAA,EAAE,OAAS,EAAA,SAAA,EAAY,CAAA,CAAA;AAAA,KACzE,CAAA;AAEA,IAAA,MAAM,2BAA4B,CAAA;AAAA,MAChC,WAAW,MAAO,CAAA,SAAA;AAAA,MAClB,SAAW,EAAA,CAAC,KACV,qBAAA,KAAA,CAAA,aAAA,CAAC,qBAAkB,IACjB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,6BAAA;AAAA,QAAA;AAAA,UACC,MAAM,KAAM,CAAA,IAAA;AAAA,UACZ,QAAQ,KAAM,CAAA,MAAA;AAAA,UACd,SAAS,MAAO,CAAA,OAAA;AAAA,SAAA;AAAA,wBAEhB,KAAA,CAAA,aAAA,CAAC,kBAAoB,EAAA,EAAA,GAAG,KAAO,EAAA,CAAA;AAAA,OAEnC,CAAA;AAAA,KAEH,CAAA,CAAA;AAAA,GACH;AACF,CAAC;;;;"}

package/dist/alpha/blueprints/types.esm.js

@@ -0,0 +1,6 @@
+import { createExtensionDataRef } from '@backstage/frontend-plugin-api';
+
+const searchResultListItemDataRef = createExtensionDataRef().with({ id: "search.search-result-list-item.item" });
+
+export { searchResultListItemDataRef };
+//# sourceMappingURL=types.esm.js.map

package/dist/alpha/blueprints/types.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.esm.js","sources":["../../../src/alpha/blueprints/types.ts"],"sourcesContent":["/*\n * Copyright 2024 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 { ListItemProps } from '@material-ui/core/ListItem';\nimport { SearchDocument, SearchResult } from '@backstage/plugin-search-common';\nimport { createExtensionDataRef } from '@backstage/frontend-plugin-api';\n\n/** @alpha */\nexport type BaseSearchResultListItemProps<T = {}> = T & {\n  rank?: number;\n  result?: SearchDocument;\n} & Omit<ListItemProps, 'button'>;\n\n/** @alpha */\nexport type SearchResultItemExtensionComponent = <\n  P extends BaseSearchResultListItemProps,\n>(\n  props: P,\n) => JSX.Element | null;\n\n/** @alpha */\nexport type SearchResultItemExtensionPredicate = (\n  result: SearchResult,\n) => boolean;\n\nexport const searchResultListItemDataRef = createExtensionDataRef<{\n  predicate?: SearchResultItemExtensionPredicate;\n  component: SearchResultItemExtensionComponent;\n}>().with({ id: 'search.search-result-list-item.item' });\n"],"names":[],"mappings":";;AAsCO,MAAM,8BAA8B,sBAGxC,EAAA,CAAE,KAAK,EAAE,EAAA,EAAI,uCAAuC;;;;"}

package/dist/alpha.d.ts

@@ -1,6 +1,5 @@
 /// <reference types="react" />
 import * as _backstage_frontend_plugin_api from '@backstage/frontend-plugin-api';
-import { PortableSchema } from '@backstage/frontend-plugin-api';
 import { ListItemProps } from '@material-ui/core/ListItem';
 import { SearchDocument, SearchResult } from '@backstage/plugin-search-common';
 
@@ -13,51 +12,49 @@ type BaseSearchResultListItemProps<T = {}> = T & {
 type SearchResultItemExtensionComponent = <P extends BaseSearchResultListItemProps>(props: P) => JSX.Element | null;
 /** @alpha */
 type SearchResultItemExtensionPredicate = (result: SearchResult) => boolean;
+
 /** @alpha */
-type SearchResultItemExtensionOptions<TConfig extends {
-    noTrack?: boolean;
-}> = {
-    /**
-     * The extension namespace.
-     */
-    namespace?: string;
-    /**
-     * The extension name.
-     */
-    name?: string;
-    /**
-     * The extension attachment point (e.g., search modal or page).
-     */
-    attachTo?: {
-        id: string;
-        input: string;
-    };
-    /**
-     * Optional extension config schema.
-     */
-    configSchema?: PortableSchema<TConfig>;
+interface SearchResultListItemBlueprintParams {
     /**
      * The extension component.
      */
     component: (options: {
-        config: TConfig;
+        config: {
+            noTrack?: boolean;
+        };
     }) => Promise<SearchResultItemExtensionComponent>;
     /**
      * When an extension defines a predicate, it returns true if the result should be rendered by that extension.
      * Defaults to a predicate that returns true, which means it renders all sorts of results.
      */
     predicate?: SearchResultItemExtensionPredicate;
-};
-/** @alpha */
-declare function createSearchResultListItemExtension<TConfig extends {
-    noTrack?: boolean;
-}>(options: SearchResultItemExtensionOptions<TConfig>): _backstage_frontend_plugin_api.ExtensionDefinition<TConfig, TConfig, never, never, string | undefined, string | undefined, string | undefined>;
-/** @alpha */
-declare namespace createSearchResultListItemExtension {
-    const itemDataRef: _backstage_frontend_plugin_api.ConfigurableExtensionDataRef<{
+}
+/**
+ * @alpha
+ * Creates SearchResultListItem extensions
+ */
+declare const SearchResultListItemBlueprint: _backstage_frontend_plugin_api.ExtensionBlueprint<{
+    kind: "search-result-list-item";
+    namespace: undefined;
+    name: undefined;
+    params: SearchResultListItemBlueprintParams;
+    output: _backstage_frontend_plugin_api.ConfigurableExtensionDataRef<{
         predicate?: SearchResultItemExtensionPredicate | undefined;
         component: SearchResultItemExtensionComponent;
     }, "search.search-result-list-item.item", {}>;
-}
+    inputs: {};
+    config: {
+        noTrack: boolean;
+    };
+    configInput: {
+        noTrack?: boolean | undefined;
+    };
+    dataRefs: {
+        item: _backstage_frontend_plugin_api.ConfigurableExtensionDataRef<{
+            predicate?: SearchResultItemExtensionPredicate | undefined;
+            component: SearchResultItemExtensionComponent;
+        }, "search.search-result-list-item.item", {}>;
+    };
+}>;
 
-export { type BaseSearchResultListItemProps, type SearchResultItemExtensionComponent, type SearchResultItemExtensionOptions, type SearchResultItemExtensionPredicate, createSearchResultListItemExtension };
+export { type BaseSearchResultListItemProps, type SearchResultItemExtensionComponent, type SearchResultItemExtensionPredicate, SearchResultListItemBlueprint, type SearchResultListItemBlueprintParams };

package/dist/alpha.esm.js

@@ -1,49 +1,2 @@
-import React, { lazy } from 'react';
-import { createExtensionDataRef, createSchemaFromZod, createExtension, ExtensionBoundary } from '@backstage/frontend-plugin-api';
-import { SearchResultListItemExtension } from './extensions.esm.js';
-
-function createSearchResultListItemExtension(options) {
-  const configSchema = "configSchema" in options ? options.configSchema : createSchemaFromZod(
-    (z) => z.object({
-      noTrack: z.boolean().default(false)
-    })
-  );
-  return createExtension({
-    kind: "search-result-list-item",
-    namespace: options.namespace,
-    name: options.name,
-    attachTo: options.attachTo ?? {
-      id: "page:search",
-      input: "items"
-    },
-    configSchema,
-    output: {
-      item: createSearchResultListItemExtension.itemDataRef
-    },
-    factory({ config, node }) {
-      const ExtensionComponent = lazy(
-        () => options.component({ config }).then((component) => ({ default: component }))
-      );
-      return {
-        item: {
-          predicate: options.predicate,
-          component: (props) => /* @__PURE__ */ React.createElement(ExtensionBoundary, { node }, /* @__PURE__ */ React.createElement(
-            SearchResultListItemExtension,
-            {
-              rank: props.rank,
-              result: props.result,
-              noTrack: config.noTrack
-            },
-            /* @__PURE__ */ React.createElement(ExtensionComponent, { ...props })
-          ))
-        }
-      };
-    }
-  });
-}
-((createSearchResultListItemExtension2) => {
-  createSearchResultListItemExtension2.itemDataRef = createExtensionDataRef().with({ id: "search.search-result-list-item.item" });
-})(createSearchResultListItemExtension || (createSearchResultListItemExtension = {}));
-
-export { createSearchResultListItemExtension };
+export { SearchResultListItemBlueprint } from './alpha/blueprints/SearchResultListItemBlueprint.esm.js';
 //# sourceMappingURL=alpha.esm.js.map

package/dist/alpha.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"alpha.esm.js","sources":["../src/alpha.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, { lazy } from 'react';\n\nimport { ListItemProps } from '@material-ui/core/ListItem';\n\nimport {\n  ExtensionBoundary,\n  PortableSchema,\n  createExtension,\n  createExtensionDataRef,\n  createSchemaFromZod,\n} from '@backstage/frontend-plugin-api';\nimport { SearchDocument, SearchResult } from '@backstage/plugin-search-common';\n\nimport { SearchResultListItemExtension } from './extensions';\n\n/** @alpha */\nexport type BaseSearchResultListItemProps<T = {}> = T & {\n  rank?: number;\n  result?: SearchDocument;\n} & Omit<ListItemProps, 'button'>;\n\n/** @alpha */\nexport type SearchResultItemExtensionComponent = <\n  P extends BaseSearchResultListItemProps,\n>(\n  props: P,\n) => JSX.Element | null;\n\n/** @alpha */\nexport type SearchResultItemExtensionPredicate = (\n  result: SearchResult,\n) => boolean;\n\n/** @alpha */\nexport type SearchResultItemExtensionOptions<\n  TConfig extends { noTrack?: boolean },\n> = {\n  /**\n   * The extension namespace.\n   */\n  namespace?: string;\n  /**\n   * The extension name.\n   */\n  name?: string;\n  /**\n   * The extension attachment point (e.g., search modal or page).\n   */\n  attachTo?: { id: string; input: string };\n  /**\n   * Optional extension config schema.\n   */\n  configSchema?: PortableSchema<TConfig>;\n  /**\n   * The extension component.\n   */\n  component: (options: {\n    config: TConfig;\n  }) => Promise<SearchResultItemExtensionComponent>;\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?: SearchResultItemExtensionPredicate;\n};\n\n/** @alpha */\nexport function createSearchResultListItemExtension<\n  TConfig extends { noTrack?: boolean },\n>(options: SearchResultItemExtensionOptions<TConfig>) {\n  const configSchema =\n    'configSchema' in options\n      ? options.configSchema\n      : (createSchemaFromZod(z =>\n          z.object({\n            noTrack: z.boolean().default(false),\n          }),\n        ) as PortableSchema<TConfig>);\n\n  return createExtension({\n    kind: 'search-result-list-item',\n    namespace: options.namespace,\n    name: options.name,\n    attachTo: options.attachTo ?? {\n      id: 'page:search',\n      input: 'items',\n    },\n    configSchema,\n    output: {\n      item: createSearchResultListItemExtension.itemDataRef,\n    },\n    factory({ config, node }) {\n      const ExtensionComponent = lazy(() =>\n        options\n          .component({ config })\n          .then(component => ({ default: component })),\n      ) as unknown as SearchResultItemExtensionComponent;\n\n      return {\n        item: {\n          predicate: options.predicate,\n          component: props => (\n            <ExtensionBoundary node={node}>\n              <SearchResultListItemExtension\n                rank={props.rank}\n                result={props.result}\n                noTrack={config.noTrack}\n              >\n                <ExtensionComponent {...props} />\n              </SearchResultListItemExtension>\n            </ExtensionBoundary>\n          ),\n        },\n      };\n    },\n  });\n}\n\n/** @alpha */\nexport namespace createSearchResultListItemExtension {\n  export const itemDataRef = createExtensionDataRef<{\n    predicate?: SearchResultItemExtensionPredicate;\n    component: SearchResultItemExtensionComponent;\n  }>().with({ id: 'search.search-result-list-item.item' });\n}\n"],"names":["createSearchResultListItemExtension"],"mappings":";;;;AAmFO,SAAS,oCAEd,OAAoD,EAAA;AACpD,EAAA,MAAM,YACJ,GAAA,cAAA,IAAkB,OACd,GAAA,OAAA,CAAQ,YACP,GAAA,mBAAA;AAAA,IAAoB,CAAA,CAAA,KACnB,EAAE,MAAO,CAAA;AAAA,MACP,OAAS,EAAA,CAAA,CAAE,OAAQ,EAAA,CAAE,QAAQ,KAAK,CAAA;AAAA,KACnC,CAAA;AAAA,GACH,CAAA;AAEN,EAAA,OAAO,eAAgB,CAAA;AAAA,IACrB,IAAM,EAAA,yBAAA;AAAA,IACN,WAAW,OAAQ,CAAA,SAAA;AAAA,IACnB,MAAM,OAAQ,CAAA,IAAA;AAAA,IACd,QAAA,EAAU,QAAQ,QAAY,IAAA;AAAA,MAC5B,EAAI,EAAA,aAAA;AAAA,MACJ,KAAO,EAAA,OAAA;AAAA,KACT;AAAA,IACA,YAAA;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,MAAM,mCAAoC,CAAA,WAAA;AAAA,KAC5C;AAAA,IACA,OAAQ,CAAA,EAAE,MAAQ,EAAA,IAAA,EAAQ,EAAA;AACxB,MAAA,MAAM,kBAAqB,GAAA,IAAA;AAAA,QAAK,MAC9B,OAAA,CACG,SAAU,CAAA,EAAE,MAAO,EAAC,CACpB,CAAA,IAAA,CAAK,CAAc,SAAA,MAAA,EAAE,OAAS,EAAA,SAAA,EAAY,CAAA,CAAA;AAAA,OAC/C,CAAA;AAEA,MAAO,OAAA;AAAA,QACL,IAAM,EAAA;AAAA,UACJ,WAAW,OAAQ,CAAA,SAAA;AAAA,UACnB,SAAW,EAAA,CAAA,KAAA,qBACR,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA,EAAkB,IACjB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,YAAC,6BAAA;AAAA,YAAA;AAAA,cACC,MAAM,KAAM,CAAA,IAAA;AAAA,cACZ,QAAQ,KAAM,CAAA,MAAA;AAAA,cACd,SAAS,MAAO,CAAA,OAAA;AAAA,aAAA;AAAA,4BAEhB,KAAA,CAAA,aAAA,CAAC,kBAAoB,EAAA,EAAA,GAAG,KAAO,EAAA,CAAA;AAAA,WAEnC,CAAA;AAAA,SAEJ;AAAA,OACF,CAAA;AAAA,KACF;AAAA,GACD,CAAA,CAAA;AACH,CAAA;AAAA,CAGO,CAAUA,oCAAV,KAAA;AACE,EAAMA,oCAAAA,CAAA,cAAc,sBAGxB,EAAA,CAAE,KAAK,EAAE,EAAA,EAAI,uCAAuC,CAAA,CAAA;AAAA,CAJxC,EAAA,mCAAA,KAAA,mCAAA,GAAA,EAAA,CAAA,CAAA;;;;"}
+{"version":3,"file":"alpha.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/SearchBar/SearchBar.esm.js

@@ -1,9 +1,9 @@
-import { useApi, configApiRef, AnalyticsContext } from '@backstage/core-plugin-api';
+import { useApi, configApiRef, useApp, AnalyticsContext } from '@backstage/core-plugin-api';
 import IconButton from '@material-ui/core/IconButton';
 import InputAdornment from '@material-ui/core/InputAdornment';
 import TextField from '@material-ui/core/TextField';
 import Button from '@material-ui/core/Button';
-import SearchIcon from '@material-ui/icons/Search';
+import DefaultSearchIcon from '@material-ui/icons/Search';
 import React, { forwardRef, useState, useRef, useEffect, useCallback } from 'react';
 import useDebounce from 'react-use/esm/useDebounce';
 import { useSearch, SearchContextProvider } from '../../context/SearchContext.esm.js';
@@ -76,6 +76,7 @@ const SearchBarBase = withContext(
     }, [onChange, onClear]);
     const ariaLabel = label ? void 0 : "Search";
     const inputPlaceholder = placeholder ?? `Search in ${configApi.getOptionalString("app.title") || "Backstage"}`;
+    const SearchIcon = useApp().getSystemIcon("search") || DefaultSearchIcon;
     const startAdornment = /* @__PURE__ */ React.createElement(InputAdornment, { position: "start" }, /* @__PURE__ */ React.createElement(IconButton, { "aria-label": "Query", size: "small", disabled: true }, /* @__PURE__ */ React.createElement(SearchIcon, null)));
     const clearButtonEndAdornment = /* @__PURE__ */ React.createElement(InputAdornment, { position: "end" }, /* @__PURE__ */ React.createElement(
       Button,

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

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.esm.js","sources":["../../../src/components/SearchBar/SearchBar.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 {\n  AnalyticsContext,\n  configApiRef,\n  useApi,\n} from '@backstage/core-plugin-api';\nimport IconButton from '@material-ui/core/IconButton';\nimport InputAdornment from '@material-ui/core/InputAdornment';\nimport TextField from '@material-ui/core/TextField';\nimport Button from '@material-ui/core/Button';\nimport { TextFieldProps } from '@material-ui/core/TextField';\nimport SearchIcon from '@material-ui/icons/Search';\nimport React, {\n  ChangeEvent,\n  ComponentType,\n  forwardRef,\n  ForwardRefExoticComponent,\n  KeyboardEvent,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport useDebounce from 'react-use/esm/useDebounce';\n\nimport { SearchContextProvider, useSearch } from '../../context';\n\nfunction withContext<T>(Component: ComponentType<T>) {\n  return forwardRef<HTMLDivElement, T>((props, ref) => (\n    <SearchContextProvider inheritParentContextIfAvailable>\n      <Component {...props} ref={ref} />\n    </SearchContextProvider>\n  ));\n}\n\n/**\n * Props for {@link SearchBarBase}.\n *\n * @public\n */\nexport type SearchBarBaseProps = Omit<TextFieldProps, 'onChange'> & {\n  debounceTime?: number;\n  clearButton?: boolean;\n  onClear?: () => void;\n  onSubmit?: () => void;\n  onChange: (value: string) => void;\n  endAdornment?: React.ReactNode;\n};\n\n/**\n * All search boxes exported by the search plugin are based on the <SearchBarBase />,\n * and this one is based on the <InputBase /> component from Material UI.\n * Recommended if you don't use Search Provider or Search Context.\n *\n * @public\n */\nexport const SearchBarBase: ForwardRefExoticComponent<SearchBarBaseProps> =\n  withContext(\n    forwardRef((props, ref) => {\n      const {\n        onChange,\n        onKeyDown = () => {},\n        onClear = () => {},\n        onSubmit = () => {},\n        debounceTime = 200,\n        clearButton = true,\n        fullWidth = true,\n        value: defaultValue,\n        label,\n        placeholder,\n        inputProps = {},\n        InputProps = {},\n        endAdornment,\n        ...rest\n      } = props;\n\n      const configApi = useApi(configApiRef);\n      const [value, setValue] = useState<string>('');\n      const forwardedValueRef = useRef<string>('');\n\n      useEffect(() => {\n        setValue(prevValue => {\n          // We only update the value if our current value is the same as it was\n          // for the most recent onChange call. Otherwise it means that the users\n          // has continued typing and we should not replace their input.\n          if (prevValue === forwardedValueRef.current) {\n            return String(defaultValue);\n          }\n          return prevValue;\n        });\n      }, [defaultValue, forwardedValueRef]);\n\n      useDebounce(\n        () => {\n          forwardedValueRef.current = value;\n          onChange(value);\n        },\n        debounceTime,\n        [value],\n      );\n\n      const handleChange = useCallback(\n        (e: ChangeEvent<HTMLInputElement>) => {\n          setValue(e.target.value);\n        },\n        [setValue],\n      );\n\n      const handleKeyDown = useCallback(\n        (e: KeyboardEvent<HTMLDivElement>) => {\n          if (onKeyDown) onKeyDown(e);\n          if (onSubmit && e.key === 'Enter') {\n            onSubmit();\n          }\n        },\n        [onKeyDown, onSubmit],\n      );\n\n      const handleClear = useCallback(() => {\n        forwardedValueRef.current = '';\n        onChange('');\n        setValue('');\n        if (onClear) {\n          onClear();\n        }\n      }, [onChange, onClear]);\n\n      const ariaLabel: string | undefined = label ? undefined : 'Search';\n\n      const inputPlaceholder =\n        placeholder ??\n        `Search in ${configApi.getOptionalString('app.title') || 'Backstage'}`;\n\n      const startAdornment = (\n        <InputAdornment position=\"start\">\n          <IconButton aria-label=\"Query\" size=\"small\" disabled>\n            <SearchIcon />\n          </IconButton>\n        </InputAdornment>\n      );\n\n      const clearButtonEndAdornment = (\n        <InputAdornment position=\"end\">\n          <Button\n            aria-label=\"Clear\"\n            size=\"small\"\n            onClick={handleClear}\n            onKeyDown={event => {\n              if (event.key === 'Enter') {\n                // write your functionality here\n                event.stopPropagation();\n              }\n            }}\n          >\n            Clear\n          </Button>\n        </InputAdornment>\n      );\n\n      return (\n        <TextField\n          id=\"search-bar-text-field\"\n          data-testid=\"search-bar-next\"\n          variant=\"outlined\"\n          margin=\"normal\"\n          inputRef={ref}\n          value={value}\n          label={label}\n          placeholder={inputPlaceholder}\n          InputProps={{\n            startAdornment,\n            endAdornment: clearButton ? clearButtonEndAdornment : endAdornment,\n            ...InputProps,\n          }}\n          inputProps={{\n            'aria-label': ariaLabel,\n            ...inputProps,\n          }}\n          fullWidth={fullWidth}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          {...rest}\n        />\n      );\n    }),\n  );\n\n/**\n * Props for {@link SearchBar}.\n *\n * @public\n */\nexport type SearchBarProps = Partial<SearchBarBaseProps>;\n\n/**\n * Recommended search bar when you use the Search Provider or Search Context.\n *\n * @public\n */\nexport const SearchBar: ForwardRefExoticComponent<SearchBarProps> = withContext(\n  forwardRef((props, ref) => {\n    const { value: initialValue = '', onChange, ...rest } = props;\n\n    const { term, setTerm } = useSearch();\n\n    useEffect(() => {\n      if (initialValue) {\n        setTerm(String(initialValue));\n      }\n    }, [initialValue, setTerm]);\n\n    const handleChange = useCallback(\n      (newValue: string) => {\n        if (onChange) {\n          onChange(newValue);\n        } else {\n          setTerm(newValue);\n        }\n      },\n      [onChange, setTerm],\n    );\n\n    return (\n      <AnalyticsContext\n        attributes={{ pluginId: 'search', extension: 'SearchBar' }}\n      >\n        <SearchBarBase\n          {...rest}\n          ref={ref}\n          value={term}\n          onChange={handleChange}\n        />\n      </AnalyticsContext>\n    );\n  }),\n);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SearchBar.esm.js","sources":["../../../src/components/SearchBar/SearchBar.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 {\n  AnalyticsContext,\n  configApiRef,\n  useApi,\n  useApp,\n} from '@backstage/core-plugin-api';\nimport IconButton from '@material-ui/core/IconButton';\nimport InputAdornment from '@material-ui/core/InputAdornment';\nimport TextField from '@material-ui/core/TextField';\nimport Button from '@material-ui/core/Button';\nimport { TextFieldProps } from '@material-ui/core/TextField';\nimport DefaultSearchIcon from '@material-ui/icons/Search';\nimport React, {\n  ChangeEvent,\n  ComponentType,\n  forwardRef,\n  KeyboardEvent,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport useDebounce from 'react-use/esm/useDebounce';\n\nimport { SearchContextProvider, useSearch } from '../../context';\n\nfunction withContext<T>(Component: ComponentType<T>) {\n  return forwardRef<HTMLDivElement, T>((props, ref) => (\n    <SearchContextProvider inheritParentContextIfAvailable>\n      <Component {...props} ref={ref} />\n    </SearchContextProvider>\n  ));\n}\n\n/**\n * Props for {@link SearchBarBase}.\n *\n * @public\n */\nexport type SearchBarBaseProps = Omit<TextFieldProps, 'onChange'> & {\n  debounceTime?: number;\n  clearButton?: boolean;\n  onClear?: () => void;\n  onSubmit?: () => void;\n  onChange: (value: string) => void;\n  endAdornment?: React.ReactNode;\n};\n\n/**\n * All search boxes exported by the search plugin are based on the <SearchBarBase />,\n * and this one is based on the <InputBase /> component from Material UI.\n * Recommended if you don't use Search Provider or Search Context.\n *\n * @public\n */\nexport const SearchBarBase = withContext(\n  forwardRef<HTMLDivElement, SearchBarBaseProps>((props, ref) => {\n    const {\n      onChange,\n      onKeyDown = () => {},\n      onClear = () => {},\n      onSubmit = () => {},\n      debounceTime = 200,\n      clearButton = true,\n      fullWidth = true,\n      value: defaultValue,\n      label,\n      placeholder,\n      inputProps = {},\n      InputProps = {},\n      endAdornment,\n      ...rest\n    } = props;\n\n    const configApi = useApi(configApiRef);\n    const [value, setValue] = useState<string>('');\n    const forwardedValueRef = useRef<string>('');\n\n    useEffect(() => {\n      setValue(prevValue => {\n        // We only update the value if our current value is the same as it was\n        // for the most recent onChange call. Otherwise it means that the users\n        // has continued typing and we should not replace their input.\n        if (prevValue === forwardedValueRef.current) {\n          return String(defaultValue);\n        }\n        return prevValue;\n      });\n    }, [defaultValue, forwardedValueRef]);\n\n    useDebounce(\n      () => {\n        forwardedValueRef.current = value;\n        onChange(value);\n      },\n      debounceTime,\n      [value],\n    );\n\n    const handleChange = useCallback(\n      (e: ChangeEvent<HTMLInputElement>) => {\n        setValue(e.target.value);\n      },\n      [setValue],\n    );\n\n    const handleKeyDown = useCallback(\n      (e: KeyboardEvent<HTMLDivElement>) => {\n        if (onKeyDown) onKeyDown(e);\n        if (onSubmit && e.key === 'Enter') {\n          onSubmit();\n        }\n      },\n      [onKeyDown, onSubmit],\n    );\n\n    const handleClear = useCallback(() => {\n      forwardedValueRef.current = '';\n      onChange('');\n      setValue('');\n      if (onClear) {\n        onClear();\n      }\n    }, [onChange, onClear]);\n\n    const ariaLabel: string | undefined = label ? undefined : 'Search';\n\n    const inputPlaceholder =\n      placeholder ??\n      `Search in ${configApi.getOptionalString('app.title') || 'Backstage'}`;\n\n    const SearchIcon = useApp().getSystemIcon('search') || DefaultSearchIcon;\n\n    const startAdornment = (\n      <InputAdornment position=\"start\">\n        <IconButton aria-label=\"Query\" size=\"small\" disabled>\n          <SearchIcon />\n        </IconButton>\n      </InputAdornment>\n    );\n\n    const clearButtonEndAdornment = (\n      <InputAdornment position=\"end\">\n        <Button\n          aria-label=\"Clear\"\n          size=\"small\"\n          onClick={handleClear}\n          onKeyDown={event => {\n            if (event.key === 'Enter') {\n              // write your functionality here\n              event.stopPropagation();\n            }\n          }}\n        >\n          Clear\n        </Button>\n      </InputAdornment>\n    );\n\n    return (\n      <TextField\n        id=\"search-bar-text-field\"\n        data-testid=\"search-bar-next\"\n        variant=\"outlined\"\n        margin=\"normal\"\n        inputRef={ref}\n        value={value}\n        label={label}\n        placeholder={inputPlaceholder}\n        InputProps={{\n          startAdornment,\n          endAdornment: clearButton ? clearButtonEndAdornment : endAdornment,\n          ...InputProps,\n        }}\n        inputProps={{\n          'aria-label': ariaLabel,\n          ...inputProps,\n        }}\n        fullWidth={fullWidth}\n        onChange={handleChange}\n        onKeyDown={handleKeyDown}\n        {...rest}\n      />\n    );\n  }),\n);\n\n/**\n * Props for {@link SearchBar}.\n *\n * @public\n */\nexport type SearchBarProps = Partial<SearchBarBaseProps>;\n\n/**\n * Recommended search bar when you use the Search Provider or Search Context.\n *\n * @public\n */\nexport const SearchBar = withContext(\n  forwardRef<HTMLDivElement, SearchBarProps>((props, ref) => {\n    const { value: initialValue = '', onChange, ...rest } = props;\n\n    const { term, setTerm } = useSearch();\n\n    useEffect(() => {\n      if (initialValue) {\n        setTerm(String(initialValue));\n      }\n    }, [initialValue, setTerm]);\n\n    const handleChange = useCallback(\n      (newValue: string) => {\n        if (onChange) {\n          onChange(newValue);\n        } else {\n          setTerm(newValue);\n        }\n      },\n      [onChange, setTerm],\n    );\n\n    return (\n      <AnalyticsContext\n        attributes={{ pluginId: 'search', extension: 'SearchBar' }}\n      >\n        <SearchBarBase\n          {...rest}\n          ref={ref}\n          value={term}\n          onChange={handleChange}\n        />\n      </AnalyticsContext>\n    );\n  }),\n);\n"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -2,7 +2,7 @@
 import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
 import { Extension } from '@backstage/core-plugin-api';
 import { SearchQuery, SearchResultSet, SearchDocument, SearchResult as SearchResult$1, ResultHighlight } from '@backstage/plugin-search-common';
-import React, { PropsWithChildren, ReactNode, ForwardRefExoticComponent, ReactElement } from 'react';
+import React, { PropsWithChildren, ReactNode, ReactElement } from 'react';
 import { ListProps } from '@material-ui/core/List';
 import { ListItemProps } from '@material-ui/core/ListItem';
 import { TextFieldProps } from '@material-ui/core/TextField';
@@ -125,7 +125,7 @@ type SearchBarBaseProps = Omit<TextFieldProps, 'onChange'> & {
  *
  * @public
  */
-declare const SearchBarBase: ForwardRefExoticComponent<SearchBarBaseProps>;
+declare const SearchBarBase: React.ForwardRefExoticComponent<Omit<Omit<SearchBarBaseProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 /**
  * Props for {@link SearchBar}.
  *
@@ -137,7 +137,7 @@ type SearchBarProps = Partial<SearchBarBaseProps>;
  *
  * @public
  */
-declare const SearchBar: ForwardRefExoticComponent<SearchBarProps>;
+declare const SearchBar: React.ForwardRefExoticComponent<Omit<Omit<Partial<SearchBarBaseProps>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 
 /**
  * Props for {@link SearchAutocomplete}.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-search-react",
-  "version": "1.7.14-next.3",
+  "version": "1.8.0-next.0",
   "backstage": {
     "role": "web-library",
     "pluginId": "search",
@@ -55,10 +55,10 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/core-components": "^0.14.10-next.0",
+    "@backstage/core-components": "^0.14.10",
     "@backstage/core-plugin-api": "^1.9.3",
-    "@backstage/frontend-plugin-api": "^0.7.0-next.3",
-    "@backstage/plugin-search-common": "^1.2.14-next.1",
+    "@backstage/frontend-plugin-api": "^0.8.0-next.0",
+    "@backstage/plugin-search-common": "^1.2.14",
     "@backstage/theme": "^0.5.6",
     "@backstage/types": "^1.1.1",
     "@backstage/version-bridge": "^1.0.8",
@@ -71,11 +71,11 @@
     "react-use": "^17.3.2"
   },
   "devDependencies": {
-    "@backstage/cli": "^0.27.0-next.4",
-    "@backstage/core-app-api": "^1.14.2-next.0",
-    "@backstage/frontend-app-api": "^0.7.5-next.3",
-    "@backstage/frontend-test-utils": "^0.1.12-next.3",
-    "@backstage/test-utils": "^1.5.10-next.2",
+    "@backstage/cli": "^0.27.1-next.0",
+    "@backstage/core-app-api": "^1.14.2",
+    "@backstage/frontend-app-api": "^0.9.0-next.0",
+    "@backstage/frontend-test-utils": "^0.2.0-next.0",
+    "@backstage/test-utils": "^1.6.0-next.0",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^15.0.0",