From 477d9f6d64d777f857dedec6a71e58baa31fbe30 Mon Sep 17 00:00:00 2001
From: Bernardo Sunderhus <bsunderhus@microsoft.com>
Date: Tue, 18 Apr 2023 21:28:54 +0200
Subject: [PATCH] chore(react-badge): adopt custom JSX pragma (#27603)

---
 ...act-badge-7120f87c-f58b-4261-a2c7-445a9baf3007.json |  7 +++++++
 packages/react-components/react-badge/package.json     |  1 +
 .../react-badge/src/components/Badge/renderBadge.tsx   | 10 +++++++---
 3 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 change/@fluentui-react-badge-7120f87c-f58b-4261-a2c7-445a9baf3007.json

diff --git a/change/@fluentui-react-badge-7120f87c-f58b-4261-a2c7-445a9baf3007.json b/change/@fluentui-react-badge-7120f87c-f58b-4261-a2c7-445a9baf3007.json
new file mode 100644
index 00000000000000..0c44c7e507b4ae
--- /dev/null
+++ b/change/@fluentui-react-badge-7120f87c-f58b-4261-a2c7-445a9baf3007.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "chore: adopt custom JSX pragma",
+  "packageName": "@fluentui/react-badge",
+  "email": "bernardo.sunderhus@gmail.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react-components/react-badge/package.json b/packages/react-components/react-badge/package.json
index 92e18b56e91e1c..0120ad6331c8ef 100644
--- a/packages/react-components/react-badge/package.json
+++ b/packages/react-components/react-badge/package.json
@@ -33,6 +33,7 @@
   },
   "dependencies": {
     "@fluentui/react-icons": "^2.0.196",
+    "@fluentui/react-jsx-runtime": "9.0.0-alpha.1",
     "@fluentui/react-shared-contexts": "^9.3.3",
     "@fluentui/react-theme": "^9.1.7",
     "@fluentui/react-utilities": "^9.8.0",
diff --git a/packages/react-components/react-badge/src/components/Badge/renderBadge.tsx b/packages/react-components/react-badge/src/components/Badge/renderBadge.tsx
index cae7c4e7c57cbc..5783fbb51bb67a 100644
--- a/packages/react-components/react-badge/src/components/Badge/renderBadge.tsx
+++ b/packages/react-components/react-badge/src/components/Badge/renderBadge.tsx
@@ -1,9 +1,13 @@
-import * as React from 'react';
-import { getSlots } from '@fluentui/react-utilities';
+/** @jsxRuntime classic */
+/** @jsx createElement */
+
+import { createElement } from '@fluentui/react-jsx-runtime';
+
+import { getSlotsNext } from '@fluentui/react-utilities';
 import type { BadgeState, BadgeSlots } from './Badge.types';
 
 export const renderBadge_unstable = (state: BadgeState) => {
-  const { slots, slotProps } = getSlots<BadgeSlots>(state);
+  const { slots, slotProps } = getSlotsNext<BadgeSlots>(state);
 
   return (
     <slots.root {...slotProps.root}>