@fluentui/react-badge 0.0.0-nightly-20230302-0419.1 → 0.0.0-nightly-20230306-0424.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +9 -9
- package/CHANGELOG.md +7 -7
- package/lib/components/PresenceBadge/usePresenceBadgeStyles.js +8 -2
- package/lib/components/PresenceBadge/usePresenceBadgeStyles.js.map +1 -1
- package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.js +8 -2
- package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.js.map +1 -1
- package/package.json +4 -4
package/CHANGELOG.json
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
"name": "@fluentui/react-badge",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
6
|
-
"tag": "@fluentui/react-badge_v0.0.0-nightly-
|
|
7
|
-
"version": "0.0.0-nightly-
|
|
5
|
+
"date": "Mon, 06 Mar 2023 04:33:12 GMT",
|
|
6
|
+
"tag": "@fluentui/react-badge_v0.0.0-nightly-20230306-0424.1",
|
|
7
|
+
"version": "0.0.0-nightly-20230306-0424.1",
|
|
8
8
|
"comments": {
|
|
9
9
|
"prerelease": [
|
|
10
10
|
{
|
|
@@ -16,20 +16,20 @@
|
|
|
16
16
|
{
|
|
17
17
|
"author": "beachball",
|
|
18
18
|
"package": "@fluentui/react-badge",
|
|
19
|
-
"comment": "Bump @fluentui/react-theme to v0.0.0-nightly-
|
|
20
|
-
"commit": "
|
|
19
|
+
"comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20230306-0424.1",
|
|
20
|
+
"commit": "21155fb094f73d947066cedf7577d2483dfab473"
|
|
21
21
|
},
|
|
22
22
|
{
|
|
23
23
|
"author": "beachball",
|
|
24
24
|
"package": "@fluentui/react-badge",
|
|
25
|
-
"comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-
|
|
26
|
-
"commit": "
|
|
25
|
+
"comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20230306-0424.1",
|
|
26
|
+
"commit": "21155fb094f73d947066cedf7577d2483dfab473"
|
|
27
27
|
},
|
|
28
28
|
{
|
|
29
29
|
"author": "beachball",
|
|
30
30
|
"package": "@fluentui/react-badge",
|
|
31
|
-
"comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-
|
|
32
|
-
"commit": "
|
|
31
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230306-0424.1",
|
|
32
|
+
"commit": "21155fb094f73d947066cedf7577d2483dfab473"
|
|
33
33
|
}
|
|
34
34
|
]
|
|
35
35
|
}
|
package/CHANGELOG.md
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-badge
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Mon, 06 Mar 2023 04:33:12 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
-
## [0.0.0-nightly-
|
|
7
|
+
## [0.0.0-nightly-20230306-0424.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-badge_v0.0.0-nightly-20230306-0424.1)
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-badge_v9.0.26..@fluentui/react-badge_v0.0.0-nightly-
|
|
9
|
+
Mon, 06 Mar 2023 04:33:12 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-badge_v9.0.26..@fluentui/react-badge_v0.0.0-nightly-20230306-0424.1)
|
|
11
11
|
|
|
12
12
|
### Changes
|
|
13
13
|
|
|
14
14
|
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
|
|
15
|
-
- Bump @fluentui/react-theme to v0.0.0-nightly-
|
|
16
|
-
- Bump @fluentui/react-utilities to v0.0.0-nightly-
|
|
17
|
-
- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-
|
|
15
|
+
- Bump @fluentui/react-theme to v0.0.0-nightly-20230306-0424.1 ([commit](https://github.com/microsoft/fluentui/commit/21155fb094f73d947066cedf7577d2483dfab473) by beachball)
|
|
16
|
+
- Bump @fluentui/react-utilities to v0.0.0-nightly-20230306-0424.1 ([commit](https://github.com/microsoft/fluentui/commit/21155fb094f73d947066cedf7577d2483dfab473) by beachball)
|
|
17
|
+
- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230306-0424.1 ([commit](https://github.com/microsoft/fluentui/commit/21155fb094f73d947066cedf7577d2483dfab473) by beachball)
|
|
18
18
|
|
|
19
19
|
## [9.0.26](https://github.com/microsoft/fluentui/tree/@fluentui/react-badge_v9.0.26)
|
|
20
20
|
|
|
@@ -5,7 +5,7 @@ export const presenceBadgeClassNames = {
|
|
|
5
5
|
icon: 'fui-PresenceBadge__icon'
|
|
6
6
|
};
|
|
7
7
|
const getIsBusy = status => {
|
|
8
|
-
if (status === 'busy' || status === 'do-not-disturb' || status === '
|
|
8
|
+
if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {
|
|
9
9
|
return true;
|
|
10
10
|
}
|
|
11
11
|
return false;
|
|
@@ -27,6 +27,9 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
27
27
|
statusOutOfOffice: {
|
|
28
28
|
sj55zd: "fdce8r3"
|
|
29
29
|
},
|
|
30
|
+
statusUnknown: {
|
|
31
|
+
sj55zd: "f11d4kpn"
|
|
32
|
+
},
|
|
30
33
|
outOfOffice: {
|
|
31
34
|
sj55zd: "fr0bkrk"
|
|
32
35
|
},
|
|
@@ -36,6 +39,9 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
36
39
|
outOfOfficeBusy: {
|
|
37
40
|
sj55zd: "fvi85wt"
|
|
38
41
|
},
|
|
42
|
+
outOfOfficeUnknown: {
|
|
43
|
+
sj55zd: "f11d4kpn"
|
|
44
|
+
},
|
|
39
45
|
tiny: {
|
|
40
46
|
Bubjx69: "f9ikmtg",
|
|
41
47
|
a9b677: "f16dn6v3",
|
|
@@ -64,7 +70,7 @@ export const usePresenceBadgeStyles_unstable = state => {
|
|
|
64
70
|
const rootClassName = useRootClassName();
|
|
65
71
|
const styles = useStyles();
|
|
66
72
|
const isBusy = getIsBusy(state.status);
|
|
67
|
-
state.root.className = mergeClasses(presenceBadgeClassNames.root, rootClassName, isBusy && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'out-of-office' && styles.statusOutOfOffice, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && isBusy && styles.outOfOfficeBusy, state.outOfOffice && state.status === 'away' && styles.statusOutOfOffice, state.outOfOffice && state.status === 'offline' && styles.statusOffline, state.outOfOffice && state.status === 'out-of-office' && styles.statusOutOfOffice, state.size === 'tiny' && styles.tiny, state.size === 'large' && styles.large, state.size === 'extra-large' && styles.extraLarge, state.root.className);
|
|
73
|
+
state.root.className = mergeClasses(presenceBadgeClassNames.root, rootClassName, isBusy && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'out-of-office' && styles.statusOutOfOffice, state.status === 'unknown' && styles.statusUnknown, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && isBusy && styles.outOfOfficeBusy, state.outOfOffice && state.status === 'away' && styles.statusOutOfOffice, state.outOfOffice && state.status === 'offline' && styles.statusOffline, state.outOfOffice && state.status === 'out-of-office' && styles.statusOutOfOffice, state.outOfOffice && state.status === 'unknown' && styles.outOfOfficeUnknown, state.size === 'tiny' && styles.tiny, state.size === 'large' && styles.large, state.size === 'extra-large' && styles.extraLarge, state.root.className);
|
|
68
74
|
if (state.icon) {
|
|
69
75
|
state.icon.className = mergeClasses(presenceBadgeClassNames.icon, state.icon.className);
|
|
70
76
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__resetStyles","__styles","mergeClasses","tokens","presenceBadgeClassNames","root","icon","getIsBusy","status","useRootClassName","useStyles","statusBusy","sj55zd","statusAway","statusAvailable","statusOffline","statusOutOfOffice","outOfOffice","outOfOfficeAvailable","outOfOfficeBusy","tiny","Bubjx69","a9b677","B5pe6w7","p4uzdd","large","extraLarge","d","usePresenceBadgeStyles_unstable","state","rootClassName","styles","isBusy","className","size"],"sources":["../../../../../../../../../packages/react-components/react-badge/src/components/PresenceBadge/usePresenceBadgeStyles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { BadgeSlots } from '../Badge/Badge.types';\nimport type { PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\n\nexport const presenceBadgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon',\n};\n\nconst getIsBusy = (status: PresenceBadgeStatus): boolean => {\n if (status === 'busy' || status === 'do-not-disturb' || status === '
|
|
1
|
+
{"version":3,"names":["__resetStyles","__styles","mergeClasses","tokens","presenceBadgeClassNames","root","icon","getIsBusy","status","useRootClassName","useStyles","statusBusy","sj55zd","statusAway","statusAvailable","statusOffline","statusOutOfOffice","statusUnknown","outOfOffice","outOfOfficeAvailable","outOfOfficeBusy","outOfOfficeUnknown","tiny","Bubjx69","a9b677","B5pe6w7","p4uzdd","large","extraLarge","d","usePresenceBadgeStyles_unstable","state","rootClassName","styles","isBusy","className","size"],"sources":["../../../../../../../../../packages/react-components/react-badge/src/components/PresenceBadge/usePresenceBadgeStyles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { BadgeSlots } from '../Badge/Badge.types';\nimport type { PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\n\nexport const presenceBadgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon',\n};\n\nconst getIsBusy = (status: PresenceBadgeStatus): boolean => {\n if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {\n return true;\n }\n\n return false;\n};\n\nconst useRootClassName = makeResetStyles({\n padding: 0,\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n\n '& span': {\n display: 'flex',\n },\n borderRadius: tokens.borderRadiusCircular,\n backgroundColor: tokens.colorNeutralBackground1,\n});\n\nconst useStyles = makeStyles({\n statusBusy: {\n color: tokens.colorPaletteRedBackground3,\n },\n statusAway: {\n color: tokens.colorPaletteMarigoldBackground3,\n },\n statusAvailable: {\n color: tokens.colorPaletteLightGreenForeground3,\n },\n statusOffline: {\n color: tokens.colorNeutralForeground3,\n },\n statusOutOfOffice: {\n color: tokens.colorPaletteBerryForeground3,\n },\n statusUnknown: {\n color: tokens.colorNeutralForeground3,\n },\n outOfOffice: {\n color: tokens.colorNeutralBackground1,\n },\n outOfOfficeAvailable: {\n color: tokens.colorPaletteLightGreenForeground3,\n },\n outOfOfficeBusy: {\n color: tokens.colorPaletteRedBackground3,\n },\n outOfOfficeUnknown: {\n color: tokens.colorNeutralForeground3,\n },\n\n // Icons are not resizeable, and these sizes are currently missing\n // use `!important` to size the currently available icons to the missing ones\n //\n tiny: {\n aspectRatio: '1',\n width: '6px',\n '& svg': {\n width: '6px !important',\n height: '6px !important',\n },\n },\n large: {\n aspectRatio: '1',\n width: '20px',\n '& svg': {\n width: '20px !important',\n height: '20px !important',\n },\n },\n extraLarge: {\n aspectRatio: '1',\n width: '28px',\n '& svg': {\n width: '28px !important',\n height: '28px !important',\n },\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const usePresenceBadgeStyles_unstable = (state: PresenceBadgeState): PresenceBadgeState => {\n const rootClassName = useRootClassName();\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n state.root.className = mergeClasses(\n presenceBadgeClassNames.root,\n rootClassName,\n isBusy && styles.statusBusy,\n state.status === 'away' && styles.statusAway,\n state.status === 'available' && styles.statusAvailable,\n state.status === 'offline' && styles.statusOffline,\n state.status === 'out-of-office' && styles.statusOutOfOffice,\n state.status === 'unknown' && styles.statusUnknown,\n state.outOfOffice && styles.outOfOffice,\n state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable,\n state.outOfOffice && isBusy && styles.outOfOfficeBusy,\n state.outOfOffice && state.status === 'away' && styles.statusOutOfOffice,\n state.outOfOffice && state.status === 'offline' && styles.statusOffline,\n state.outOfOffice && state.status === 'out-of-office' && styles.statusOutOfOffice,\n state.outOfOffice && state.status === 'unknown' && styles.outOfOfficeUnknown,\n state.size === 'tiny' && styles.tiny,\n state.size === 'large' && styles.large,\n state.size === 'extra-large' && styles.extraLarge,\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, state.icon.className);\n }\n\n return state;\n};\n"],"mappings":"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"}
|
|
@@ -11,7 +11,7 @@ exports.presenceBadgeClassNames = {
|
|
|
11
11
|
icon: 'fui-PresenceBadge__icon'
|
|
12
12
|
};
|
|
13
13
|
const getIsBusy = status => {
|
|
14
|
-
if (status === 'busy' || status === 'do-not-disturb' || status === '
|
|
14
|
+
if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {
|
|
15
15
|
return true;
|
|
16
16
|
}
|
|
17
17
|
return false;
|
|
@@ -33,6 +33,9 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
|
33
33
|
statusOutOfOffice: {
|
|
34
34
|
sj55zd: "fdce8r3"
|
|
35
35
|
},
|
|
36
|
+
statusUnknown: {
|
|
37
|
+
sj55zd: "f11d4kpn"
|
|
38
|
+
},
|
|
36
39
|
outOfOffice: {
|
|
37
40
|
sj55zd: "fr0bkrk"
|
|
38
41
|
},
|
|
@@ -42,6 +45,9 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
|
42
45
|
outOfOfficeBusy: {
|
|
43
46
|
sj55zd: "fvi85wt"
|
|
44
47
|
},
|
|
48
|
+
outOfOfficeUnknown: {
|
|
49
|
+
sj55zd: "f11d4kpn"
|
|
50
|
+
},
|
|
45
51
|
tiny: {
|
|
46
52
|
Bubjx69: "f9ikmtg",
|
|
47
53
|
a9b677: "f16dn6v3",
|
|
@@ -70,7 +76,7 @@ const usePresenceBadgeStyles_unstable = state => {
|
|
|
70
76
|
const rootClassName = useRootClassName();
|
|
71
77
|
const styles = useStyles();
|
|
72
78
|
const isBusy = getIsBusy(state.status);
|
|
73
|
-
state.root.className = react_1.mergeClasses(exports.presenceBadgeClassNames.root, rootClassName, isBusy && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'out-of-office' && styles.statusOutOfOffice, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && isBusy && styles.outOfOfficeBusy, state.outOfOffice && state.status === 'away' && styles.statusOutOfOffice, state.outOfOffice && state.status === 'offline' && styles.statusOffline, state.outOfOffice && state.status === 'out-of-office' && styles.statusOutOfOffice, state.size === 'tiny' && styles.tiny, state.size === 'large' && styles.large, state.size === 'extra-large' && styles.extraLarge, state.root.className);
|
|
79
|
+
state.root.className = react_1.mergeClasses(exports.presenceBadgeClassNames.root, rootClassName, isBusy && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'out-of-office' && styles.statusOutOfOffice, state.status === 'unknown' && styles.statusUnknown, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && isBusy && styles.outOfOfficeBusy, state.outOfOffice && state.status === 'away' && styles.statusOutOfOffice, state.outOfOffice && state.status === 'offline' && styles.statusOffline, state.outOfOffice && state.status === 'out-of-office' && styles.statusOutOfOffice, state.outOfOffice && state.status === 'unknown' && styles.outOfOfficeUnknown, state.size === 'tiny' && styles.tiny, state.size === 'large' && styles.large, state.size === 'extra-large' && styles.extraLarge, state.root.className);
|
|
74
80
|
if (state.icon) {
|
|
75
81
|
state.icon.className = react_1.mergeClasses(exports.presenceBadgeClassNames.icon, state.icon.className);
|
|
76
82
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["react_1","require","react_theme_1","exports","presenceBadgeClassNames","root","icon","getIsBusy","status","useRootClassName","__resetStyles","useStyles","__styles","statusBusy","sj55zd","statusAway","statusAvailable","statusOffline","statusOutOfOffice","outOfOffice","outOfOfficeAvailable","outOfOfficeBusy","tiny","Bubjx69","a9b677","B5pe6w7","p4uzdd","large","extraLarge","d","usePresenceBadgeStyles_unstable","state","rootClassName","styles","isBusy","className","mergeClasses","size"],"sources":["../../../../../../../../../packages/react-components/react-badge/src/components/PresenceBadge/usePresenceBadgeStyles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { BadgeSlots } from '../Badge/Badge.types';\nimport type { PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\n\nexport const presenceBadgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon',\n};\n\nconst getIsBusy = (status: PresenceBadgeStatus): boolean => {\n if (status === 'busy' || status === 'do-not-disturb' || status === '
|
|
1
|
+
{"version":3,"names":["react_1","require","react_theme_1","exports","presenceBadgeClassNames","root","icon","getIsBusy","status","useRootClassName","__resetStyles","useStyles","__styles","statusBusy","sj55zd","statusAway","statusAvailable","statusOffline","statusOutOfOffice","statusUnknown","outOfOffice","outOfOfficeAvailable","outOfOfficeBusy","outOfOfficeUnknown","tiny","Bubjx69","a9b677","B5pe6w7","p4uzdd","large","extraLarge","d","usePresenceBadgeStyles_unstable","state","rootClassName","styles","isBusy","className","mergeClasses","size"],"sources":["../../../../../../../../../packages/react-components/react-badge/src/components/PresenceBadge/usePresenceBadgeStyles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { BadgeSlots } from '../Badge/Badge.types';\nimport type { PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\n\nexport const presenceBadgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon',\n};\n\nconst getIsBusy = (status: PresenceBadgeStatus): boolean => {\n if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {\n return true;\n }\n\n return false;\n};\n\nconst useRootClassName = makeResetStyles({\n padding: 0,\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n\n '& span': {\n display: 'flex',\n },\n borderRadius: tokens.borderRadiusCircular,\n backgroundColor: tokens.colorNeutralBackground1,\n});\n\nconst useStyles = makeStyles({\n statusBusy: {\n color: tokens.colorPaletteRedBackground3,\n },\n statusAway: {\n color: tokens.colorPaletteMarigoldBackground3,\n },\n statusAvailable: {\n color: tokens.colorPaletteLightGreenForeground3,\n },\n statusOffline: {\n color: tokens.colorNeutralForeground3,\n },\n statusOutOfOffice: {\n color: tokens.colorPaletteBerryForeground3,\n },\n statusUnknown: {\n color: tokens.colorNeutralForeground3,\n },\n outOfOffice: {\n color: tokens.colorNeutralBackground1,\n },\n outOfOfficeAvailable: {\n color: tokens.colorPaletteLightGreenForeground3,\n },\n outOfOfficeBusy: {\n color: tokens.colorPaletteRedBackground3,\n },\n outOfOfficeUnknown: {\n color: tokens.colorNeutralForeground3,\n },\n\n // Icons are not resizeable, and these sizes are currently missing\n // use `!important` to size the currently available icons to the missing ones\n //\n tiny: {\n aspectRatio: '1',\n width: '6px',\n '& svg': {\n width: '6px !important',\n height: '6px !important',\n },\n },\n large: {\n aspectRatio: '1',\n width: '20px',\n '& svg': {\n width: '20px !important',\n height: '20px !important',\n },\n },\n extraLarge: {\n aspectRatio: '1',\n width: '28px',\n '& svg': {\n width: '28px !important',\n height: '28px !important',\n },\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const usePresenceBadgeStyles_unstable = (state: PresenceBadgeState): PresenceBadgeState => {\n const rootClassName = useRootClassName();\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n state.root.className = mergeClasses(\n presenceBadgeClassNames.root,\n rootClassName,\n isBusy && styles.statusBusy,\n state.status === 'away' && styles.statusAway,\n state.status === 'available' && styles.statusAvailable,\n state.status === 'offline' && styles.statusOffline,\n state.status === 'out-of-office' && styles.statusOutOfOffice,\n state.status === 'unknown' && styles.statusUnknown,\n state.outOfOffice && styles.outOfOffice,\n state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable,\n state.outOfOffice && isBusy && styles.outOfOfficeBusy,\n state.outOfOffice && state.status === 'away' && styles.statusOutOfOffice,\n state.outOfOffice && state.status === 'offline' && styles.statusOffline,\n state.outOfOffice && state.status === 'out-of-office' && styles.statusOutOfOffice,\n state.outOfOffice && state.status === 'unknown' && styles.outOfOfficeUnknown,\n state.size === 'tiny' && styles.tiny,\n state.size === 'large' && styles.large,\n state.size === 'extra-large' && styles.extraLarge,\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, state.icon.className);\n }\n\n return state;\n};\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-badge",
|
|
3
|
-
"version": "0.0.0-nightly-
|
|
3
|
+
"version": "0.0.0-nightly-20230306-0424.1",
|
|
4
4
|
"description": "React components for building web experiences",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -27,15 +27,15 @@
|
|
|
27
27
|
"devDependencies": {
|
|
28
28
|
"@fluentui/eslint-plugin": "*",
|
|
29
29
|
"@fluentui/react-conformance": "*",
|
|
30
|
-
"@fluentui/react-conformance-griffel": "0.0.0-nightly-
|
|
30
|
+
"@fluentui/react-conformance-griffel": "0.0.0-nightly-20230306-0424.1",
|
|
31
31
|
"@fluentui/scripts-api-extractor": "*",
|
|
32
32
|
"@fluentui/scripts-tasks": "*"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@fluentui/react-icons": "^2.0.175",
|
|
36
36
|
"@griffel/react": "^1.5.2",
|
|
37
|
-
"@fluentui/react-theme": "0.0.0-nightly-
|
|
38
|
-
"@fluentui/react-utilities": "0.0.0-nightly-
|
|
37
|
+
"@fluentui/react-theme": "0.0.0-nightly-20230306-0424.1",
|
|
38
|
+
"@fluentui/react-utilities": "0.0.0-nightly-20230306-0424.1",
|
|
39
39
|
"tslib": "^2.1.0"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|