From 4e7562877f21b97f06b929b55af08783ca44da36 Mon Sep 17 00:00:00 2001
From: Material Web Team <material-web-copybara@google.com>
Date: Wed, 8 Jul 2026 11:41:34 -0700
Subject: [PATCH] chore(labs): rename md-* elements to md-gb-*

PiperOrigin-RevId: 944614369
---
 .../badge/{md-badge.ts => badge-element.ts}   | 14 +++----------
 labs/gb/components/badge/demo/stories.ts      |  5 +++--
 labs/gb/components/badge/md-gb-badge.ts       | 21 +++++++++++++++++++
 3 files changed, 27 insertions(+), 13 deletions(-)
 rename labs/gb/components/badge/{md-badge.ts => badge-element.ts} (76%)
 create mode 100644 labs/gb/components/badge/md-gb-badge.ts

diff --git a/labs/gb/components/badge/md-badge.ts b/labs/gb/components/badge/badge-element.ts
similarity index 76%
rename from labs/gb/components/badge/md-badge.ts
rename to labs/gb/components/badge/badge-element.ts
index 27fe0fa565..dca42132e4 100644
--- a/labs/gb/components/badge/md-badge.ts
+++ b/labs/gb/components/badge/badge-element.ts
@@ -5,22 +5,14 @@
  */
 
 import {css, CSSResultOrNative, html, LitElement} from 'lit';
-import {customElement, state} from 'lit/decorators.js';
+import {state} from 'lit/decorators.js';
 import {badge} from './badge.js';
 import {styles as badgeStyles} from './badge.cssresult.js';
 
-declare global {
-  interface HTMLElementTagNameMap {
-    /** A Material Design badge component. */
-    'md-gb-badge': Badge;
-  }
-}
-
 /**
- * A Material Design badge component.
+ * A Material Design badge component class without custom element registration.
  */
-@customElement('md-gb-badge')
-export class Badge extends LitElement {
+export class BadgeElement extends LitElement {
   static override styles: CSSResultOrNative[] = [
     badgeStyles,
     css`
diff --git a/labs/gb/components/badge/demo/stories.ts b/labs/gb/components/badge/demo/stories.ts
index 4ba644ed64..96d3143990 100644
--- a/labs/gb/components/badge/demo/stories.ts
+++ b/labs/gb/components/badge/demo/stories.ts
@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import '@material/web/labs/gb/components/badge/md-badge.js';
+import '@material/web/labs/gb/components/badge/md-gb-badge.js';
 
 import {MaterialStoryInit} from './material-collection.js';
 import {adoptStyles} from '@material/web/labs/gb/styles/adopt-styles.js';
@@ -35,7 +35,8 @@ const anchored: MaterialStoryInit<StoryKnobs> = {
   name: 'Anchored',
   render() {
     return html`
-      <div style="display: flex; gap: 32px; align-items: center; padding: 16px;">
+      <div
+        style="display: flex; gap: 32px; align-items: center; padding: 16px;">
         <!-- Small badge (dot) -->
         <div style="display: inline-block;">
           <div
diff --git a/labs/gb/components/badge/md-gb-badge.ts b/labs/gb/components/badge/md-gb-badge.ts
new file mode 100644
index 0000000000..02fb962114
--- /dev/null
+++ b/labs/gb/components/badge/md-gb-badge.ts
@@ -0,0 +1,21 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import {customElement} from 'lit/decorators.js';
+import {BadgeElement} from './badge-element.js';
+
+declare global {
+  interface HTMLElementTagNameMap {
+    /** A Material Design badge component. */
+    'md-gb-badge': Badge;
+  }
+}
+
+/**
+ * A Material Design badge component.
+ */
+@customElement('md-gb-badge')
+export class Badge extends BadgeElement {}