Merge branch 'master' into feature/circular-tabs

change/@fluentui-react-link-f1cc3696-e769-47fc-9fed-2ed37e12c28b.json

@@ -0,0 +1,7 @@
+{
+  "type": "minor",
+  "comment": "feat: add LinkContextProvider",
+  "packageName": "@fluentui/react-link",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

change/@fluentui-react-message-bar-331d1242-9c7c-49c1-84f0-53757e5e2f45.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix: use LinkContextProvider to force all links inside MessageBody to be underlined",
+  "packageName": "@fluentui/react-message-bar",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

package.json

@@ -306,7 +306,7 @@
     "request-promise-native": "1.0.9",
     "resolve": "1.22.8",
     "riceburn": "1.3.1",
-    "rollup": "2.71.0",
+    "rollup": "2.79.2",
     "rollup-plugin-commonjs": "10.1.0",
     "rollup-plugin-esbuild": "6.1.1",
     "rollup-plugin-node-resolve": "5.2.0",

packages/react-components/react-link/library/etc/react-link.api.md

@@ -18,6 +18,17 @@ export const Link: ForwardRefComponent<LinkProps>;
 // @public (undocumented)
 export const linkClassNames: SlotClassNames<LinkSlots>;
 
+// @public (undocumented)
+export const linkContextDefaultValue: LinkContextValue;
+
+// @public (undocumented)
+export const LinkContextProvider: React_2.Provider<LinkContextValue | undefined>;
+
+// @public (undocumented)
+export type LinkContextValue = {
+    inline?: boolean;
+};
+
 // @public (undocumented)
 export type LinkProps = ComponentProps<LinkSlots> & {
     appearance?: 'default' | 'subtle';
@@ -42,6 +53,9 @@ export const renderLink_unstable: (state: LinkState) => JSX.Element;
 // @public
 export const useLink_unstable: (props: LinkProps, ref: React_2.Ref<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement>) => LinkState;
 
+// @public (undocumented)
+export const useLinkContext: () => LinkContextValue;
+
 // @public
 export const useLinkState_unstable: (state: LinkState) => LinkState;
 

packages/react-components/react-link/library/src/Link.ts

@@ -1 +1,2 @@
 export * from './components/Link/index';
+export * from './contexts';

packages/react-components/react-link/library/src/components/Link/useLink.ts

@@ -3,6 +3,7 @@ import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
 import { useBackgroundAppearance } from '@fluentui/react-shared-contexts';
 import { useLinkState_unstable } from './useLinkState';
 import type { LinkProps, LinkState } from './Link.types';
+import { useLinkContext } from '../../contexts/linkContext';
 
 /**
  * Given user props, defines default props for the Link, calls useLinkState_unstable, and returns processed state.
@@ -14,6 +15,7 @@ export const useLink_unstable = (
   ref: React.Ref<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement>,
 ): LinkState => {
   const backgroundAppearance = useBackgroundAppearance();
+  const { inline: inlineContext } = useLinkContext();
   const { appearance = 'default', disabled = false, disabledFocusable = false, inline = false } = props;
 
   const elementType = props.as || (props.href ? 'a' : 'button');
@@ -31,7 +33,7 @@ export const useLink_unstable = (
     appearance,
     disabled,
     disabledFocusable,
-    inline,
+    inline: inline ?? !!inlineContext,
 
     // Slots definition
     components: {

packages/react-components/react-link/library/src/contexts/index.ts

@@ -0,0 +1 @@
+export * from './linkContext';

packages/react-components/react-link/library/src/contexts/linkContext.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+
+export type LinkContextValue = {
+  inline?: boolean;
+};
+
+const LinkContext = React.createContext<LinkContextValue | undefined>(undefined);
+
+export const linkContextDefaultValue: LinkContextValue = {
+  inline: false,
+};
+
+export const LinkContextProvider = LinkContext.Provider;
+export const useLinkContext = () => React.useContext(LinkContext) ?? linkContextDefaultValue;

packages/react-components/react-link/library/src/index.ts

@@ -7,3 +7,5 @@ export {
   useLink_unstable,
 } from './Link';
 export type { LinkProps, LinkSlots, LinkState } from './Link';
+export { linkContextDefaultValue, LinkContextProvider, useLinkContext } from './contexts';
+export type { LinkContextValue } from './contexts';

packages/react-components/react-message-bar/library/etc/react-message-bar.api.md

@@ -163,7 +163,7 @@ export const renderMessageBar_unstable: (state: MessageBarState, contexts: Messa
 export const renderMessageBarActions_unstable: (state: MessageBarActionsState, contexts: MessageBarActionsContextValues) => JSX.Element;
 
 // @public
-export const renderMessageBarBody_unstable: (state: MessageBarBodyState) => JSX.Element;
+export const renderMessageBarBody_unstable: (state: MessageBarBodyState, contextValues: MessageBarBodyContextValues) => JSX.Element;
 
 // @public
 export const renderMessageBarGroup_unstable: (state: MessageBarGroupState) => JSX.Element;

packages/react-components/react-message-bar/library/package.json

@@ -34,6 +34,7 @@
     "@fluentui/react-icons": "^2.0.245",
     "@fluentui/react-jsx-runtime": "^9.0.44",
     "@fluentui/react-shared-contexts": "^9.20.1",
+    "@fluentui/react-link": "^9.2.32",
     "@fluentui/react-theme": "^9.1.20",
     "@fluentui/react-utilities": "^9.18.15",
     "@griffel/react": "^1.5.22",

packages/react-components/react-message-bar/library/src/components/MessageBarBody/MessageBarBody.tsx

@@ -4,17 +4,19 @@ import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
 import { useMessageBarBody_unstable } from './useMessageBarBody';
 import { renderMessageBarBody_unstable } from './renderMessageBarBody';
 import { useMessageBarBodyStyles_unstable } from './useMessageBarBodyStyles.styles';
+import { useMessageBarBodyContextValues_unstable } from './useMessageBarBodyContextValues';
 import type { MessageBarBodyProps } from './MessageBarBody.types';
 
 /**
  * MessageBarBody component
  */
 export const MessageBarBody: ForwardRefComponent<MessageBarBodyProps> = React.forwardRef((props, ref) => {
   const state = useMessageBarBody_unstable(props, ref);
+  const ctx = useMessageBarBodyContextValues_unstable(state);
 
   useMessageBarBodyStyles_unstable(state);
   useCustomStyleHook_unstable('useMessageBarBodyStyles_unstable')(state);
-  return renderMessageBarBody_unstable(state);
+  return renderMessageBarBody_unstable(state, ctx);
 });
 
 MessageBarBody.displayName = 'MessageBarBody';

packages/react-components/react-message-bar/library/src/components/MessageBarBody/MessageBarBody.types.ts

@@ -1,5 +1,11 @@
 import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
 
+export type MessageBarBodyContextValues = {
+  link: {
+    inline?: boolean;
+  };
+};
+
 export type MessageBarBodySlots = {
   root: Slot<'div'>;
 };

packages/react-components/react-message-bar/library/src/components/MessageBarBody/renderMessageBarBody.tsx

@@ -2,13 +2,21 @@
 /** @jsxImportSource @fluentui/react-jsx-runtime */
 
 import { assertSlots } from '@fluentui/react-utilities';
-import type { MessageBarBodyState, MessageBarBodySlots } from './MessageBarBody.types';
+import type { MessageBarBodyState, MessageBarBodySlots, MessageBarBodyContextValues } from './MessageBarBody.types';
+import { LinkContextProvider } from '@fluentui/react-link';
 
 /**
  * Render the final JSX of MessageBarBody
  */
-export const renderMessageBarBody_unstable = (state: MessageBarBodyState) => {
+export const renderMessageBarBody_unstable = (
+  state: MessageBarBodyState,
+  contextValues: MessageBarBodyContextValues,
+) => {
   assertSlots<MessageBarBodySlots>(state);
 
-  return <state.root />;
+  return (
+    <LinkContextProvider value={contextValues.link}>
+      <state.root />
+    </LinkContextProvider>
+  );
 };

packages/react-components/react-message-bar/library/src/components/MessageBarBody/useMessageBarBodyContextValues.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { MessageBarBodyState, MessageBarBodyContextValues } from './MessageBarBody.types';
+
+export function useMessageBarBodyContextValues_unstable(state: MessageBarBodyState): MessageBarBodyContextValues {
+  const link = React.useMemo(
+    () => ({
+      inline: true,
+    }),
+    [],
+  );
+
+  return {
+    link,
+  };
+}

yarn.lock

@@ -20487,10 +20487,10 @@ rollup-pluginutils@^2.8.1, rollup-pluginutils@^2.8.2:
   dependencies:
     estree-walker "^0.6.1"
 
-rollup@2.71.0:
-  version "2.71.0"
-  resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.71.0.tgz#d61e26b95481867d796da255a43fffeadb754cfd"
-  integrity sha512-kZWB4FA9N/iZU/O9tVp08pPdxLM0i2iUDvcS77XT92DI81s3wYQcU/cA2FCXWj+HgJj8RUC2M0dXECwoOfDBYA==
+rollup@2.79.2:
+  version "2.79.2"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.79.2.tgz#f150e4a5db4b121a21a747d762f701e5e9f49090"
+  integrity sha512-fS6iqSPZDs3dr/y7Od6y5nha8dW1YnbgtsyotCVvoFGKbERG++CVRFv1meyGDE1SNItQA8BrnCw7ScdAhRJ3XQ==
   optionalDependencies:
     fsevents "~2.3.2"
 
@@ -21456,7 +21456,7 @@ string-length@^5.0.1:
     char-regex "^2.0.0"
     strip-ansi "^7.0.1"
 
-"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
+"string-width-cjs@npm:string-width@^4.2.0":
   version "4.2.3"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
   integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -21491,6 +21491,15 @@ string-width@^3.0.0, string-width@^3.1.0:
     is-fullwidth-code-point "^2.0.0"
     strip-ansi "^5.1.0"
 
+string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
+  version "4.2.3"
+  resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
+  integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
+  dependencies:
+    emoji-regex "^8.0.0"
+    is-fullwidth-code-point "^3.0.0"
+    strip-ansi "^6.0.1"
+
 string-width@^5.0.1, string-width@^5.1.2:
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-5.1.2.tgz#14f8daec6d81e7221d2a357e668cab73bdbca794"
@@ -21591,7 +21600,7 @@ stringify-object@^3.3.0:
     is-obj "^1.0.1"
     is-regexp "^1.0.0"
 
-"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1:
+"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
   version "6.0.1"
   resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
   integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
@@ -21626,6 +21635,13 @@ strip-ansi@^5.0.0, strip-ansi@^5.1.0, strip-ansi@^5.2.0:
   dependencies:
     ansi-regex "^4.1.0"
 
+strip-ansi@^6.0.0, strip-ansi@^6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
+  integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
+  dependencies:
+    ansi-regex "^5.0.1"
+
 strip-ansi@^7.0.1, strip-ansi@^7.1.0:
   version "7.1.0"
   resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-7.1.0.tgz#d5b6568ca689d8561370b0707685d22434faff45"
@@ -23870,7 +23886,7 @@ workspace-tools@^0.27.0:
     js-yaml "^4.1.0"
     micromatch "^4.0.0"
 
-"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0:
+"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0":
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
   integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
@@ -23905,6 +23921,15 @@ wrap-ansi@^6.2.0:
     string-width "^4.1.0"
     strip-ansi "^6.0.0"
 
+wrap-ansi@^7.0.0:
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
+  integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
+  dependencies:
+    ansi-styles "^4.0.0"
+    string-width "^4.1.0"
+    strip-ansi "^6.0.0"
+
 wrap-ansi@^8.1.0:
   version "8.1.0"
   resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"