From 787936b28ff53439932298460ed3d1a3526cc24c Mon Sep 17 00:00:00 2001 From: Micah Godbolt Date: Mon, 9 May 2022 10:58:01 -0700 Subject: [PATCH 1/6] pass in icon props to presence badge icon slot, and use default strings --- .../PresenceBadge/PresenceBadge.types.ts | 2 +- .../PresenceBadge/usePresenceBadge.tsx | 18 ++++++++++++++++-- .../stories/PresenceBadgeStatus.stories.tsx | 1 + 3 files changed, 18 insertions(+), 3 deletions(-) diff --git a/packages/react-badge/src/components/PresenceBadge/PresenceBadge.types.ts b/packages/react-badge/src/components/PresenceBadge/PresenceBadge.types.ts index b8977d4ad6291f..77aab24ed899bd 100644 --- a/packages/react-badge/src/components/PresenceBadge/PresenceBadge.types.ts +++ b/packages/react-badge/src/components/PresenceBadge/PresenceBadge.types.ts @@ -24,7 +24,7 @@ type PresenceBadgeCommons = { outOfOffice: boolean; } & BadgeCommons; -export type PresenceBadgeProps = Omit>, 'color'> & +export type PresenceBadgeProps = Omit, 'color'> & Partial>; export type PresenceBadgeState = PresenceBadgeCommons & ComponentState; diff --git a/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx b/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx index 3a7de3ea25a20a..61228f08d6a149 100644 --- a/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx +++ b/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx @@ -11,8 +11,9 @@ 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'; +import { StatusRegular } from '@fluentui/react-icons'; const iconMap = ( status: PresenceBadgeState['status'], @@ -37,6 +38,16 @@ const iconMap = ( } }; +export 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 +60,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, diff --git a/packages/react-badge/src/stories/PresenceBadgeStatus.stories.tsx b/packages/react-badge/src/stories/PresenceBadgeStatus.stories.tsx index 25bc537d6f7278..2d1d469fea4ec0 100644 --- a/packages/react-badge/src/stories/PresenceBadgeStatus.stories.tsx +++ b/packages/react-badge/src/stories/PresenceBadgeStatus.stories.tsx @@ -11,6 +11,7 @@ export const Status = () => { + ); From d842ad18279e96103ca67c18a0423dfbecbd3eac Mon Sep 17 00:00:00 2001 From: Micah Godbolt Date: Mon, 9 May 2022 11:03:03 -0700 Subject: [PATCH 2/6] change file --- ...i-react-badge-ddd7ad34-0c86-4cbf-8df7-498ff221cfbf.json | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 change/@fluentui-react-badge-ddd7ad34-0c86-4cbf-8df7-498ff221cfbf.json 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 00000000000000..a600d25cb770b9 --- /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" +} From 6ea50bff1cc4b4ccb4cdb11580d5114cbfabaf68 Mon Sep 17 00:00:00 2001 From: Micah Godbolt Date: Wed, 11 May 2022 10:20:50 -0700 Subject: [PATCH 3/6] remove unused import --- .../src/components/PresenceBadge/usePresenceBadge.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx b/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx index 61228f08d6a149..ef47228d6c7c99 100644 --- a/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx +++ b/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx @@ -13,7 +13,6 @@ import { } from './presenceIcons'; import { useBadge_unstable } from '../Badge/index'; import type { PresenceBadgeProps, PresenceBadgeState } from './PresenceBadge.types'; -import { StatusRegular } from '@fluentui/react-icons'; const iconMap = ( status: PresenceBadgeState['status'], From ea8c890bd94138a711bb1f80d232be05ced16f13 Mon Sep 17 00:00:00 2001 From: Micah Godbolt Date: Wed, 11 May 2022 10:43:03 -0700 Subject: [PATCH 4/6] update api file --- packages/react-badge/etc/react-badge.api.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-badge/etc/react-badge.api.md b/packages/react-badge/etc/react-badge.api.md index fe7209d1001b83..5d626ea5875979 100644 --- a/packages/react-badge/etc/react-badge.api.md +++ b/packages/react-badge/etc/react-badge.api.md @@ -57,7 +57,7 @@ export const presenceBadgeClassName = "fui-PresenceBadge"; export const presenceBadgeClassNames: SlotClassNames; // @public (undocumented) -export type PresenceBadgeProps = Omit>, 'color'> & Partial>; +export type PresenceBadgeProps = Omit, 'color'> & Partial>; // @public (undocumented) export type PresenceBadgeState = PresenceBadgeCommons & ComponentState; From fd84c7ee7722e118162d176e44e8a7e0b2a1dad9 Mon Sep 17 00:00:00 2001 From: Micah Godbolt Date: Fri, 13 May 2022 12:20:52 -0700 Subject: [PATCH 5/6] Update packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx Co-authored-by: Makoto Morimoto --- .../src/components/PresenceBadge/usePresenceBadge.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx b/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx index ef47228d6c7c99..4a703a48fc6647 100644 --- a/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx +++ b/packages/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx @@ -37,7 +37,7 @@ const iconMap = ( } }; -export const DEFAULT_STRINGS = { +const DEFAULT_STRINGS = { busy: 'busy', outOfOffice: 'out of office', away: 'away', From d0df13b03d5f68844ab364427196c22d7d0fced3 Mon Sep 17 00:00:00 2001 From: Micah Godbolt Date: Fri, 13 May 2022 12:21:56 -0700 Subject: [PATCH 6/6] Update packages/react-badge/src/stories/PresenceBadgeStatus.stories.tsx Co-authored-by: Makoto Morimoto --- packages/react-badge/src/stories/PresenceBadgeStatus.stories.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/react-badge/src/stories/PresenceBadgeStatus.stories.tsx b/packages/react-badge/src/stories/PresenceBadgeStatus.stories.tsx index 2d1d469fea4ec0..25bc537d6f7278 100644 --- a/packages/react-badge/src/stories/PresenceBadgeStatus.stories.tsx +++ b/packages/react-badge/src/stories/PresenceBadgeStatus.stories.tsx @@ -11,7 +11,6 @@ export const Status = () => { - );