Merge pull request #265 from qualcomm/feature/configurable-nav-badges

feature/configurable-nav-badges

Author: R-Bower

package.json

@@ -52,15 +52,15 @@
     "check-updates": "ncu -c 2 -w",
     "doc-gen": "turbo run build:typedoc",
     "publish:all": "pnpm changeset publish && pnpm -r run publish-angular-package",
-    "bump": "pnpm qui-changesets prep-release --include-commit-links"
+    "bump": "pnpm qui-changesets prep-release --include-commit-links && pnpm qui-changesets update-jsdoc-since-tags"
   },
   "devDependencies": {
     "@changesets/cli": "^2.29.7",
     "@clack/prompts": "1.0.0-alpha.6",
     "@commander-js/extra-typings": "catalog:",
     "@eslint/js": "catalog:",
     "@manypkg/get-packages": "^3.1.0",
-    "@qualcomm-ui/changesets-cli": "^1.0.4",
+    "@qualcomm-ui/changesets-cli": "^1.1.0",
     "@qualcomm-ui/eslint-config-angular": "workspace:*",
     "@qualcomm-ui/eslint-config-mdx": "workspace:*",
     "@qualcomm-ui/eslint-config-react": "workspace:*",

packages/common/mdx-common/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @qualcomm-ui/mdx-common Changelog
 
+## 2.4.0
+
+May 14th, 2026
+
+### Features
+
+- [docs-layout]: add configurable badge renderers ([b2e87d5](https://github.com/qualcomm/qualcomm-ui/commit/b2e87d5))
+
 ## 2.3.0
 
 Apr 29th, 2026

packages/common/mdx-common/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qualcomm-ui/mdx-common",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "description": "MDX common types and utilities",
   "author": "Ryan Bower",
   "license": "BSD-3-Clause-Clear",

packages/common/mdx-common/src/docs-plugin.types.ts

@@ -560,6 +560,15 @@ export interface NavBadge {
    */
   label: string
 
+  /**
+   * Optional label override for the side nav. Set to false to prevent the badge from
+   * appearing in the side nav. When not defined, the side nav will render the
+   * {@link label}.
+   *
+   * @since 2.4.0
+   */
+  sideNavLabel?: string | false
+
   /**
    * Optional HTML title attribute to show on hover.
    */

packages/common/mdx-vite/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @qualcomm-ui/mdx-vite Changelog
 
+## 3.7.3
+
+May 14th, 2026
+
+### Miscellaneous Chores
+
+- **deps:** update dependencies [@qualcomm-ui/mdx-common]
+
 ## 3.7.2
 
 May 10th, 2026

packages/common/mdx-vite/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qualcomm-ui/mdx-vite",
-  "version": "3.7.2",
+  "version": "3.7.3",
   "description": "Vite documentation plugin for applications that use MDX",
   "author": "Ryan Bower",
   "license": "BSD-3-Clause-Clear",
@@ -90,7 +90,7 @@
   "devDependencies": {
     "@qualcomm-ui/cli": "catalog:",
     "@qualcomm-ui/esbuild": "catalog:",
-    "@qualcomm-ui/mdx-common": "workspace:^2.3.0",
+    "@qualcomm-ui/mdx-common": "workspace:^2.4.0",
     "@qualcomm-ui/utils": "workspace:^1.2.4",
     "@qualcomm-ui/tsconfig": "catalog:",
     "@qualcomm-ui/tailwind-plugin": "workspace:^1.7.1",
@@ -125,7 +125,7 @@
     "zod": "^4.1.13"
   },
   "peerDependencies": {
-    "@qualcomm-ui/mdx-common": "workspace:^2.3.0",
+    "@qualcomm-ui/mdx-common": "workspace:^2.4.0",
     "@qualcomm-ui/typedoc-common": "workspace:^1.0.6",
     "@qualcomm-ui/utils": "workspace:^1.2.4",
     "lodash-es": ">=4.17.21 <5",

packages/docs/angular-docs/qui-docs.config.ts

@@ -16,6 +16,9 @@ const navConfig: NavConfig[] = [
   {
     id: "installation",
   },
+  {
+    id: "versioning",
+  },
 
   {separator: true},
   {sectionTitle: "Integrations"},
@@ -47,9 +50,6 @@ const navConfig: NavConfig[] = [
   {
     id: "pitfalls",
   },
-  {
-    id: "developer-previews",
-  },
   {
     separator: true,
   },

packages/docs/angular-docs/src/components/layout/app-docs-layout.tsx

@@ -15,9 +15,12 @@ import {
   HeaderAiLink,
   HeaderLogo,
   HeaderRepositoryLink,
+  PageHeaderBadges,
   QuiEcosystemMenu,
+  SideNavBadges,
   ThemeToggle,
 } from "@qualcomm-ui/react-internal/layout"
+import type {LayoutComponents} from "@qualcomm-ui/react-mdx/context"
 import {
   DocsLayout,
   type DocsLayoutSettings,
@@ -32,6 +35,11 @@ import {useAngularDemoReloader} from "./use-angular-demo-reloader"
 import {useRouterLinkInterceptor} from "./use-router-link-interceptor"
 import {useThemeSwitchInterceptor} from "./use-theme-switch-interceptor"
 
+const layoutComponents: LayoutComponents = {
+  PageHeaderBadges,
+  SideNavBadges,
+}
+
 interface Props extends Partial<DocsLayoutSettings> {
   /**
    * React {@link https://react.dev/learn/passing-props-to-a-component#passing-jsx-as-children children} prop.
@@ -96,6 +104,7 @@ export function AppDocsLayout({children, ...props}: Props): ReactNode {
           </HeaderBar.Root>
         </div>
       }
+      layoutComponents={layoutComponents}
       pathname={location.pathname}
       renderLink={DocLink}
       rootBreadcrumb={{

packages/docs/angular-docs/src/routes/components+/card+/_card.mdx

@@ -6,9 +6,9 @@ aliases: [tile, panel, content card, media card, container]
 badges:
   - id: since
     label: 2.4.0
-  - id: developerPreview
-    label: Developer Preview
-    url: /developer-previews
+  - id: beta
+    label: Beta
+    url: /versioning#beta
 ---
 
 import {

packages/docs/angular-docs/src/routes/components+/stepper+/_stepper.mdx

@@ -6,9 +6,9 @@ badges:
   - id: since
     label: 2.3.0
     url: https://github.com/qualcomm/qualcomm-ui/blob/main/packages/frameworks/angular/CHANGELOG.md#230
-  - id: developerPreview
-    label: Developer Preview
-    url: /developer-previews
+  - id: beta
+    label: Beta
+    url: /versioning#beta
 ---
 
 import {QdsDemo, ComponentExplorer} from "~components/demo"