@backstage/plugin-app-react 0.2.1-next.0 → 0.2.1

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @backstage/plugin-app-react
 
+## 0.2.1
+
+### Patch Changes
+
+- 5f3f5d2: `NavContentBlueprint` nav item collections now keep previously collected `rest()` results in sync when additional items are taken later in the same render, making it easier to place items across multiple sidebar sections.
+- 2c383b5: Added `AnalyticsImplementationBlueprint` and `AnalyticsImplementationFactory`, migrated from `@backstage/frontend-plugin-api`.
+- Updated dependencies
+  - @backstage/core-plugin-api@1.12.4
+  - @backstage/frontend-plugin-api@0.15.0
+
+## 0.2.1-next.1
+
+### Patch Changes
+
+- 2c383b5: Added `AnalyticsImplementationBlueprint` and `AnalyticsImplementationFactory`, migrated from `@backstage/frontend-plugin-api`.
+- Updated dependencies
+  - @backstage/frontend-plugin-api@0.15.0-next.1
+  - @backstage/core-plugin-api@1.12.4-next.1
+
 ## 0.2.1-next.0
 
 ### Patch Changes

package/dist/blueprints/AnalyticsImplementationBlueprint.esm.js

@@ -0,0 +1,20 @@
+import { createExtensionDataRef, createExtensionBlueprint, createExtensionBlueprintParams } from '@backstage/frontend-plugin-api';
+
+const factoryDataRef = createExtensionDataRef().with({
+  id: "core.analytics.factory"
+});
+const AnalyticsImplementationBlueprint = createExtensionBlueprint({
+  kind: "analytics",
+  attachTo: { id: "api:app/analytics", input: "implementations" },
+  output: [factoryDataRef],
+  dataRefs: {
+    factory: factoryDataRef
+  },
+  defineParams: (params) => createExtensionBlueprintParams(params),
+  *factory(params) {
+    yield factoryDataRef(params);
+  }
+});
+
+export { AnalyticsImplementationBlueprint };
+//# sourceMappingURL=AnalyticsImplementationBlueprint.esm.js.map

package/dist/blueprints/AnalyticsImplementationBlueprint.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnalyticsImplementationBlueprint.esm.js","sources":["../../src/blueprints/AnalyticsImplementationBlueprint.ts"],"sourcesContent":["/*\n * Copyright 2025 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  AnalyticsImplementation,\n  TypesToApiRefs,\n  createExtensionBlueprint,\n  createExtensionBlueprintParams,\n  createExtensionDataRef,\n} from '@backstage/frontend-plugin-api';\n\n/** @public */\nexport type AnalyticsImplementationFactory<\n  Deps extends { [name in string]: unknown } = {},\n> = {\n  deps: TypesToApiRefs<Deps>;\n  factory(deps: Deps): AnalyticsImplementation;\n};\n\nconst factoryDataRef =\n  createExtensionDataRef<AnalyticsImplementationFactory>().with({\n    id: 'core.analytics.factory',\n  });\n\n/**\n * Creates analytics implementations.\n *\n * @public\n */\nexport const AnalyticsImplementationBlueprint = createExtensionBlueprint({\n  kind: 'analytics',\n  attachTo: { id: 'api:app/analytics', input: 'implementations' },\n  output: [factoryDataRef],\n  dataRefs: {\n    factory: factoryDataRef,\n  },\n  defineParams: <TDeps extends { [name in string]: unknown }>(\n    params: AnalyticsImplementationFactory<TDeps>,\n  ) => createExtensionBlueprintParams(params as AnalyticsImplementationFactory),\n  *factory(params) {\n    yield factoryDataRef(params);\n  },\n});\n"],"names":[],"mappings":";;AAgCA,MAAM,cAAA,GACJ,sBAAA,EAAuD,CAAE,IAAA,CAAK;AAAA,EAC5D,EAAA,EAAI;AACN,CAAC,CAAA;AAOI,MAAM,mCAAmC,wBAAA,CAAyB;AAAA,EACvE,IAAA,EAAM,WAAA;AAAA,EACN,QAAA,EAAU,EAAE,EAAA,EAAI,mBAAA,EAAqB,OAAO,iBAAA,EAAkB;AAAA,EAC9D,MAAA,EAAQ,CAAC,cAAc,CAAA;AAAA,EACvB,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,GACX;AAAA,EACA,YAAA,EAAc,CACZ,MAAA,KACG,8BAAA,CAA+B,MAAwC,CAAA;AAAA,EAC5E,CAAC,QAAQ,MAAA,EAAQ;AACf,IAAA,MAAM,eAAe,MAAM,CAAA;AAAA,EAC7B;AACF,CAAC;;;;"}

package/dist/blueprints/NavContentBlueprint.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavContentBlueprint.esm.js","sources":["../../src/blueprints/NavContentBlueprint.ts"],"sourcesContent":["/*\n * Copyright 2026 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 { ComponentType } from 'react';\nimport {\n  AppNode,\n  IconComponent,\n  IconElement,\n  RouteRef,\n} from '@backstage/frontend-plugin-api';\nimport {\n  createExtensionBlueprint,\n  createExtensionDataRef,\n} from '@backstage/frontend-plugin-api';\n\n/**\n * A navigation item auto-discovered from a page extension in the app.\n *\n * @public\n */\nexport interface NavContentNavItem {\n  /** The app node of the page extension that this nav item points to */\n  node: AppNode;\n  /** The resolved route path */\n  href: string;\n  /** The display title */\n  title: string;\n  /** The display icon */\n  icon: IconElement;\n  /** The route ref of the source page */\n  routeRef: RouteRef;\n}\n\n/**\n * A pre-bound renderer that wraps {@link NavContentNavItems} with a component,\n * so that `take` and `rest` return rendered elements directly.\n *\n * @public\n */\nexport interface NavContentNavItemsWithComponent {\n  /** Render and take a specific item by extension ID. Returns null if not found. */\n  take(id: string): JSX.Element | null;\n  /** Render all remaining items not yet taken, optionally sorted. */\n  rest(options?: { sortBy?: 'title' }): JSX.Element[];\n}\n\n/**\n * A collection of nav items that supports picking specific items by ID\n * and retrieving whatever remains. Created fresh for each render.\n *\n * @public\n */\nexport interface NavContentNavItems {\n  /** Take an item by extension ID, removing it from the collection. */\n  take(id: string): NavContentNavItem | undefined;\n  /** All items not yet taken. */\n  rest(): NavContentNavItem[];\n  /** Create a copy of the collection preserving the current taken state. */\n  clone(): NavContentNavItems;\n  /** Create a renderer that wraps take/rest to return pre-rendered elements. */\n  withComponent(\n    Component: ComponentType<NavContentNavItem>,\n  ): NavContentNavItemsWithComponent;\n}\n\n/**\n * The props for the {@link NavContentComponent}.\n *\n * @public\n */\nexport interface NavContentComponentProps {\n  /**\n   * Nav items auto-discovered from page extensions, with take/rest semantics\n   * for placing specific items in specific positions.\n   */\n  navItems: NavContentNavItems;\n\n  /**\n   * Flat list of nav items for simple rendering. Use `navItems` for more\n   * control over item placement.\n   *\n   * @deprecated Use `navItems` instead.\n   */\n  items: Array<{\n    icon: IconComponent;\n    title: string;\n    routeRef: RouteRef<undefined>;\n    to: string;\n    text: string;\n  }>;\n}\n\n/**\n * A component that renders the nav bar content, to be passed to the {@link NavContentBlueprint}.\n *\n * @public\n */\nexport type NavContentComponent = (\n  props: NavContentComponentProps,\n) => JSX.Element | null;\n\nconst componentDataRef = createExtensionDataRef<NavContentComponent>().with({\n  id: 'core.nav-content.component',\n});\n\n/**\n * Creates an extension that replaces the entire nav bar with your own component. This blueprint is limited to use by the app plugin.\n *\n * @public\n */\nexport const NavContentBlueprint = createExtensionBlueprint({\n  kind: 'nav-content',\n  attachTo: { id: 'app/nav', input: 'content' },\n  output: [componentDataRef],\n  dataRefs: {\n    component: componentDataRef,\n  },\n  *factory(params: { component: NavContentComponent }) {\n    yield componentDataRef(params.component);\n  },\n});\n"],"names":[],"mappings":";;AAkHA,MAAM,gBAAA,GAAmB,sBAAA,EAA4C,CAAE,IAAA,CAAK;AAAA,EAC1E,EAAA,EAAI;AACN,CAAC,CAAA;AAOM,MAAM,sBAAsB,wBAAA,CAAyB;AAAA,EAC1D,IAAA,EAAM,aAAA;AAAA,EACN,QAAA,EAAU,EAAE,EAAA,EAAI,SAAA,EAAW,OAAO,SAAA,EAAU;AAAA,EAC5C,MAAA,EAAQ,CAAC,gBAAgB,CAAA;AAAA,EACzB,QAAA,EAAU;AAAA,IACR,SAAA,EAAW;AAAA,GACb;AAAA,EACA,CAAC,QAAQ,MAAA,EAA4C;AACnD,IAAA,MAAM,gBAAA,CAAiB,OAAO,SAAS,CAAA;AAAA,EACzC;AACF,CAAC;;;;"}
+{"version":3,"file":"NavContentBlueprint.esm.js","sources":["../../src/blueprints/NavContentBlueprint.ts"],"sourcesContent":["/*\n * Copyright 2026 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 { ComponentType } from 'react';\nimport {\n  AppNode,\n  IconComponent,\n  IconElement,\n  RouteRef,\n} from '@backstage/frontend-plugin-api';\nimport {\n  createExtensionBlueprint,\n  createExtensionDataRef,\n} from '@backstage/frontend-plugin-api';\n\n/**\n * A navigation item auto-discovered from a page extension in the app.\n *\n * @public\n */\nexport interface NavContentNavItem {\n  /** The app node of the page extension that this nav item points to */\n  node: AppNode;\n  /** The resolved route path */\n  href: string;\n  /** The display title */\n  title: string;\n  /** The display icon */\n  icon: IconElement;\n  /** The route ref of the source page */\n  routeRef: RouteRef;\n}\n\n/**\n * A pre-bound renderer that wraps {@link NavContentNavItems} with a component,\n * so that `take` and `rest` return rendered elements directly.\n *\n * @public\n */\nexport interface NavContentNavItemsWithComponent {\n  /** Render and take a specific item by extension ID. Returns null if not found. */\n  take(id: string): JSX.Element | null;\n  /**\n   * Render all remaining items not yet taken, optionally sorted.\n   *\n   * The returned array is live and is updated when later `take` calls remove\n   * items from the collection.\n   */\n  rest(options?: { sortBy?: 'title' }): JSX.Element[];\n}\n\n/**\n * A collection of nav items that supports picking specific items by ID\n * and retrieving whatever remains. Created fresh for each render.\n *\n * @public\n */\nexport interface NavContentNavItems {\n  /** Take an item by extension ID, removing it from the collection. */\n  take(id: string): NavContentNavItem | undefined;\n  /**\n   * All items not yet taken.\n   *\n   * The returned array is live and is updated when later `take` calls remove\n   * items from the collection.\n   */\n  rest(): NavContentNavItem[];\n  /** Create a copy of the collection preserving the current taken state. */\n  clone(): NavContentNavItems;\n  /** Create a renderer that wraps take/rest to return pre-rendered elements. */\n  withComponent(\n    Component: ComponentType<NavContentNavItem>,\n  ): NavContentNavItemsWithComponent;\n}\n\n/**\n * The props for the {@link NavContentComponent}.\n *\n * @public\n */\nexport interface NavContentComponentProps {\n  /**\n   * Nav items auto-discovered from page extensions, with take/rest semantics\n   * for placing specific items in specific positions.\n   */\n  navItems: NavContentNavItems;\n\n  /**\n   * Flat list of nav items for simple rendering. Use `navItems` for more\n   * control over item placement.\n   *\n   * @deprecated Use `navItems` instead.\n   */\n  items: Array<{\n    icon: IconComponent;\n    title: string;\n    routeRef: RouteRef<undefined>;\n    to: string;\n    text: string;\n  }>;\n}\n\n/**\n * A component that renders the nav bar content, to be passed to the {@link NavContentBlueprint}.\n *\n * @public\n */\nexport type NavContentComponent = (\n  props: NavContentComponentProps,\n) => JSX.Element | null;\n\nconst componentDataRef = createExtensionDataRef<NavContentComponent>().with({\n  id: 'core.nav-content.component',\n});\n\n/**\n * Creates an extension that replaces the entire nav bar with your own component. This blueprint is limited to use by the app plugin.\n *\n * @public\n */\nexport const NavContentBlueprint = createExtensionBlueprint({\n  kind: 'nav-content',\n  attachTo: { id: 'app/nav', input: 'content' },\n  output: [componentDataRef],\n  dataRefs: {\n    component: componentDataRef,\n  },\n  *factory(params: { component: NavContentComponent }) {\n    yield componentDataRef(params.component);\n  },\n});\n"],"names":[],"mappings":";;AA4HA,MAAM,gBAAA,GAAmB,sBAAA,EAA4C,CAAE,IAAA,CAAK;AAAA,EAC1E,EAAA,EAAI;AACN,CAAC,CAAA;AAOM,MAAM,sBAAsB,wBAAA,CAAyB;AAAA,EAC1D,IAAA,EAAM,aAAA;AAAA,EACN,QAAA,EAAU,EAAE,EAAA,EAAI,SAAA,EAAW,OAAO,SAAA,EAAU;AAAA,EAC5C,MAAA,EAAQ,CAAC,gBAAgB,CAAA;AAAA,EACzB,QAAA,EAAU;AAAA,IACR,SAAA,EAAW;AAAA,GACb;AAAA,EACA,CAAC,QAAQ,MAAA,EAA4C;AACnD,IAAA,MAAM,gBAAA,CAAiB,OAAO,SAAS,CAAA;AAAA,EACzC;AACF,CAAC;;;;"}

package/dist/index.d.ts

@@ -1,7 +1,31 @@
 import * as _backstage_frontend_plugin_api from '@backstage/frontend-plugin-api';
-import { IconComponent, IconElement, AppNode, RouteRef, IdentityApi, SwappableComponentRef, AppTheme, TranslationResource, TranslationMessages } from '@backstage/frontend-plugin-api';
+import { TypesToApiRefs, AnalyticsImplementation, IconComponent, IconElement, AppNode, RouteRef, IdentityApi, SwappableComponentRef, AppTheme, TranslationResource, TranslationMessages } from '@backstage/frontend-plugin-api';
 import { ReactNode, ComponentType } from 'react';
 
+/** @public */
+type AnalyticsImplementationFactory<Deps extends {
+    [name in string]: unknown;
+} = {}> = {
+    deps: TypesToApiRefs<Deps>;
+    factory(deps: Deps): AnalyticsImplementation;
+};
+/**
+ * Creates analytics implementations.
+ *
+ * @public
+ */
+declare const AnalyticsImplementationBlueprint: _backstage_frontend_plugin_api.ExtensionBlueprint<{
+    kind: "analytics";
+    params: <TDeps extends { [name in string]: unknown; }>(params: AnalyticsImplementationFactory<TDeps>) => _backstage_frontend_plugin_api.ExtensionBlueprintParams<AnalyticsImplementationFactory<{}>>;
+    output: _backstage_frontend_plugin_api.ExtensionDataRef<AnalyticsImplementationFactory<{}>, "core.analytics.factory", {}>;
+    inputs: {};
+    config: {};
+    configInput: {};
+    dataRefs: {
+        factory: _backstage_frontend_plugin_api.ConfigurableExtensionDataRef<AnalyticsImplementationFactory<{}>, "core.analytics.factory", {}>;
+    };
+}>;
+
 /**
  * Creates a extensions that render a React wrapper at the app root, enclosing
  * the app layout. This is useful for example for adding global React contexts
@@ -80,7 +104,12 @@ interface NavContentNavItem {
 interface NavContentNavItemsWithComponent {
     /** Render and take a specific item by extension ID. Returns null if not found. */
     take(id: string): JSX.Element | null;
-    /** Render all remaining items not yet taken, optionally sorted. */
+    /**
+     * Render all remaining items not yet taken, optionally sorted.
+     *
+     * The returned array is live and is updated when later `take` calls remove
+     * items from the collection.
+     */
     rest(options?: {
         sortBy?: 'title';
     }): JSX.Element[];
@@ -94,7 +123,12 @@ interface NavContentNavItemsWithComponent {
 interface NavContentNavItems {
     /** Take an item by extension ID, removing it from the collection. */
     take(id: string): NavContentNavItem | undefined;
-    /** All items not yet taken. */
+    /**
+     * All items not yet taken.
+     *
+     * The returned array is live and is updated when later `take` calls remove
+     * items from the collection.
+     */
     rest(): NavContentNavItem[];
     /** Create a copy of the collection preserving the current taken state. */
     clone(): NavContentNavItems;
@@ -287,5 +321,5 @@ declare const TranslationBlueprint: _backstage_frontend_plugin_api.ExtensionBlue
     };
 }>;
 
-export { AppRootWrapperBlueprint, IconBundleBlueprint, NavContentBlueprint, RouterBlueprint, SignInPageBlueprint, SwappableComponentBlueprint, ThemeBlueprint, TranslationBlueprint };
-export type { NavContentComponent, NavContentComponentProps, NavContentNavItem, NavContentNavItems, NavContentNavItemsWithComponent, SignInPageProps };
+export { AnalyticsImplementationBlueprint, AppRootWrapperBlueprint, IconBundleBlueprint, NavContentBlueprint, RouterBlueprint, SignInPageBlueprint, SwappableComponentBlueprint, ThemeBlueprint, TranslationBlueprint };
+export type { AnalyticsImplementationFactory, NavContentComponent, NavContentComponentProps, NavContentNavItem, NavContentNavItems, NavContentNavItemsWithComponent, SignInPageProps };

package/dist/index.esm.js

@@ -1,3 +1,4 @@
+export { AnalyticsImplementationBlueprint } from './blueprints/AnalyticsImplementationBlueprint.esm.js';
 export { AppRootWrapperBlueprint } from './blueprints/AppRootWrapperBlueprint.esm.js';
 export { IconBundleBlueprint } from './blueprints/IconBundleBlueprint.esm.js';
 export { NavContentBlueprint } from './blueprints/NavContentBlueprint.esm.js';

package/dist/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
+{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-app-react",
-  "version": "0.2.1-next.0",
+  "version": "0.2.1",
   "description": "Web library for the app plugin",
   "backstage": {
     "role": "web-library",
@@ -39,14 +39,14 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/core-plugin-api": "1.12.4-next.0",
-    "@backstage/frontend-plugin-api": "0.14.2-next.0",
+    "@backstage/core-plugin-api": "^1.12.4",
+    "@backstage/frontend-plugin-api": "^0.15.0",
     "@material-ui/core": "^4.9.13"
   },
   "devDependencies": {
-    "@backstage/cli": "0.35.5-next.0",
-    "@backstage/frontend-test-utils": "0.5.1-next.0",
-    "@backstage/test-utils": "1.7.16-next.0",
+    "@backstage/cli": "^0.36.0",
+    "@backstage/frontend-test-utils": "^0.5.1",
+    "@backstage/test-utils": "^1.7.16",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^16.0.0",
     "@types/react": "^18.0.0",