Use a V2 variant style for Notification's action button (#2472)

* Use V2 font variant for notification action button

* Update Podfile

* Change files

Co-authored-by: Adam Gleitman <[email protected]>

Author: amgleitman

apps/fluent-tester/ios/Podfile.lock

@@ -10,10 +10,10 @@ PODS:
     - React-jsi (= 0.68.5)
     - ReactCommon/turbomodule/core (= 0.68.5)
   - fmt (6.2.1)
-  - FRNAvatar (0.16.30):
+  - FRNAvatar (0.17.2):
     - MicrosoftFluentUI (= 0.10.0)
     - React
-  - FRNDatePicker (0.7.3):
+  - FRNDatePicker (0.7.4):
     - MicrosoftFluentUI (= 0.10.0)
     - React
   - FRNFontMetrics (0.3.0):
@@ -603,8 +603,8 @@ SPEC CHECKSUMS:
   FBLazyVector: 2b47ff52037bd9ae07cc9b051c9975797814b736
   FBReactNativeSpec: dd89c4a5591e20015aa55c6efbf9c7740a83efbf
   fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
-  FRNAvatar: b57500ffd4955a077c6318e7485de44f4a663042
-  FRNDatePicker: 898a7629602571ab16ba018407397608874bca2e
+  FRNAvatar: 6b0c2d8a484aa0829f64397cf23ef5c56feefa63
+  FRNDatePicker: 009ab6e4e003a9e5d720fb4aea27b94e6cc8a946
   FRNFontMetrics: c756b9bb1627909a7673b68caf7a7b14239c212e
   glog: 476ee3e89abb49e07f822b48323c51c57124b572
   MicrosoftFluentUI: f6db695718efb93f4ca9bdc366c00b80a1f91dba

change/@fluentui-react-native-notification-21a40bbc-e8e6-43b5-8a9f-4651e01412ec.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Use V2 font variant for notification action button",
+  "packageName": "@fluentui-react-native/notification",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

change/@fluentui-react-native-tester-4eca7b3a-45a3-4527-89cc-93a84e53e579.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Update Podfile",
+  "packageName": "@fluentui-react-native/tester",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

packages/components/Notification/src/Notification.helper.tsx

@@ -60,10 +60,6 @@ export const NotificationButton = stagedComponent((props: NotificationButtonProp
       backgroundColor: 'transparent',
       color: props.color,
       iconColor: props.color,
-      fontSize: 15,
-      fontWeight: '600',
-      fontLineHeight: 20,
-      fontLetterSpacing: -0.23, // iOS only prop
       disabled: {
         color: props.disabledColor,
       },
@@ -76,6 +72,7 @@ export const NotificationButton = stagedComponent((props: NotificationButtonProp
         minWidth: 0,
         padding: globalTokens.sizeNone,
         paddingHorizontal: globalTokens.sizeNone,
+        variant: 'body2Strong',
       },
     },
   });

packages/components/Notification/src/__tests__/__snapshots__/Notification.test.tsx.snap

@@ -218,8 +218,6 @@ exports[`Notification component tests Notification default 1`] = `
             "fontFamily": "System",
             "fontSize": 15,
             "fontWeight": "600",
-            "letterSpacing": -0.23,
-            "lineHeight": 20,
             "margin": 0,
             "marginBottom": 0,
             "marginEnd": 0,