diff --git a/change/@fluentui-react-badge-ddd7ad34-0c86-4cbf-8df7-498ff221cfbf.json b/change/@fluentui-react-badge-ddd7ad34-0c86-4cbf-8df7-498ff221cfbf.json new file mode 100644 index 0000000000000..a600d25cb770b --- /dev/null +++ b/change/@fluentui-react-badge-ddd7ad34-0c86-4cbf-8df7-498ff221cfbf.json @@ -0,0 +1,7 @@ +{ + "type": "prerelease", + "comment": "pass in icon props to presence badge icon slot, and use default strings", + "packageName": "@fluentui/react-badge", + "email": "mgodbolt@microsoft.com", + "dependentChangeType": "patch" +} diff --git a/packages/react-badge/etc/react-badge.api.md b/packages/react-badge/etc/react-badge.api.md index f6d98bd18ce39..e391ea4bec006 100644 --- a/packages/react-badge/etc/react-badge.api.md +++ b/packages/react-badge/etc/react-badge.api.md @@ -71,7 +71,7 @@ export const presenceBadgeClassName = "fui-PresenceBadge"; export const presenceBadgeClassNames: SlotClassNames; // @public (undocumented) -export type PresenceBadgeProps = Omit>, 'color'> & Pick & { +export type PresenceBadgeProps = Omit>, 'color'> & Pick & { status?: PresenceBadgeStatus; outOfOffice?: boolean; }; diff --git a/packages/react-badge/src/components/PresenceBadge/PresenceBadge.types.ts b/packages/react-badge/src/components/PresenceBadge/PresenceBadge.types.ts index e378866ad06af..7c81496ace84a 100644 --- a/packages/react-badge/src/components/PresenceBadge/PresenceBadge.types.ts +++ b/packages/react-badge/src/components/PresenceBadge/PresenceBadge.types.ts @@ -10,7 +10,7 @@ export type PresenceBadgeStatus = | 'doNotDisturb' | 'unknown'; -export type PresenceBadgeProps = Omit>, 'color'> & +export type PresenceBadgeProps = Omit>, 'color'> & Pick & { /** * Represents several status diff --git a/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx b/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx index 3a7de3ea25a20..4a703a48fc664 100644 --- a/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx +++ b/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx @@ -11,7 +11,7 @@ import { presenceOofRegular, presenceUnknownRegular, } from './presenceIcons'; -import { useBadge_unstable, BadgeProps } from '../Badge/index'; +import { useBadge_unstable } from '../Badge/index'; import type { PresenceBadgeProps, PresenceBadgeState } from './PresenceBadge.types'; const iconMap = ( @@ -37,6 +37,16 @@ const iconMap = ( } }; +const DEFAULT_STRINGS = { + busy: 'busy', + outOfOffice: 'out of office', + away: 'away', + available: 'available', + offline: 'offline', + doNotDisturb: 'do not disturb', + unknown: 'unknown', +}; + /** * Returns the props and state required to render the component */ @@ -49,8 +59,11 @@ export const usePresenceBadge_unstable = ( { size: 'medium', ...props, - icon: resolveShorthand(undefined as BadgeProps['icon'], { + icon: resolveShorthand(props.icon, { required: true, + defaultProps: { + 'aria-label': props.status && DEFAULT_STRINGS[props.status], + }, }), }, ref,