@fluentui/react-badge 0.0.0-nightly-20240823-1802.1 → 0.0.0-nightly-20240827-0406.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.
Files changed (10) hide show
  1. package/CHANGELOG.md +10 -10
  2. package/lib/components/Badge/useBadgeStyles.styles.js +56 -56
  3. package/lib/components/Badge/useBadgeStyles.styles.js.map +1 -1
  4. package/lib/components/PresenceBadge/usePresenceBadgeStyles.styles.js +12 -12
  5. package/lib/components/PresenceBadge/usePresenceBadgeStyles.styles.js.map +1 -1
  6. package/lib-commonjs/components/Badge/useBadgeStyles.styles.js +90 -107
  7. package/lib-commonjs/components/Badge/useBadgeStyles.styles.js.map +1 -1
  8. package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.styles.js +18 -22
  9. package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.styles.js.map +1 -1
  10. package/package.json +7 -7
package/CHANGELOG.md CHANGED
@@ -1,23 +1,23 @@
1
1
  # Change Log - @fluentui/react-badge
2
2
 
3
- This log was last generated on Fri, 23 Aug 2024 18:07:44 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 27 Aug 2024 04:11:24 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly-20240823-1802.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-badge_v0.0.0-nightly-20240823-1802.1)
7
+ ## [0.0.0-nightly-20240827-0406.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-badge_v0.0.0-nightly-20240827-0406.1)
8
8
 
9
- Fri, 23 Aug 2024 18:07:44 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-badge_v9.2.41..@fluentui/react-badge_v0.0.0-nightly-20240823-1802.1)
9
+ Tue, 27 Aug 2024 04:11:24 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-badge_v9.2.41..@fluentui/react-badge_v0.0.0-nightly-20240827-0406.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-jsx-runtime to v0.0.0-nightly-20240823-1802.1 ([commit](https://github.com/microsoft/fluentui/commit/5dea0aaa8bad5a9e5744195db91ffbc60b7cfa93) by beachball)
16
- - Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20240823-1802.1 ([commit](https://github.com/microsoft/fluentui/commit/5dea0aaa8bad5a9e5744195db91ffbc60b7cfa93) by beachball)
17
- - Bump @fluentui/react-theme to v0.0.0-nightly-20240823-1802.1 ([commit](https://github.com/microsoft/fluentui/commit/5dea0aaa8bad5a9e5744195db91ffbc60b7cfa93) by beachball)
18
- - Bump @fluentui/react-utilities to v0.0.0-nightly-20240823-1802.1 ([commit](https://github.com/microsoft/fluentui/commit/5dea0aaa8bad5a9e5744195db91ffbc60b7cfa93) by beachball)
19
- - Bump @fluentui/react-conformance to v0.0.0-nightly-20240823-1802.1 ([commit](https://github.com/microsoft/fluentui/commit/5dea0aaa8bad5a9e5744195db91ffbc60b7cfa93) by beachball)
20
- - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20240823-1802.1 ([commit](https://github.com/microsoft/fluentui/commit/5dea0aaa8bad5a9e5744195db91ffbc60b7cfa93) by beachball)
15
+ - Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20240827-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/5a6f69fd471c4b095918294fdcb29b449231907f) by beachball)
16
+ - Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20240827-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/5a6f69fd471c4b095918294fdcb29b449231907f) by beachball)
17
+ - Bump @fluentui/react-theme to v0.0.0-nightly-20240827-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/5a6f69fd471c4b095918294fdcb29b449231907f) by beachball)
18
+ - Bump @fluentui/react-utilities to v0.0.0-nightly-20240827-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/5a6f69fd471c4b095918294fdcb29b449231907f) by beachball)
19
+ - Bump @fluentui/react-conformance to v0.0.0-nightly-20240827-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/5a6f69fd471c4b095918294fdcb29b449231907f) by beachball)
20
+ - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20240827-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/5a6f69fd471c4b095918294fdcb29b449231907f) by beachball)
21
21
 
22
22
  ## [9.2.41](https://github.com/microsoft/fluentui/tree/@fluentui/react-badge_v9.2.41)
23
23
 
package/lib/components/Badge/useBadgeStyles.styles.js CHANGED
@@ -7,7 +7,7 @@ export const badgeClassNames = {
7
7
  // The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.
8
8
  // Instead, add extra padding to the root, and a negative margin on the icon to "remove" the extra padding on the icon.
9
9
  const textPadding = tokens.spacingHorizontalXXS;
10
- const useRootClassName = /*#__PURE__*/__resetStyles("r10nfv4h", "ruauajt", [".r10nfv4h{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;position:relative;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);height:20px;width:20px;min-width:max-content;padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));border-radius:var(--341, var(--342, var(--borderRadiusCircular)));border-color:var(--343, var(--344, var(--colorTransparentStroke)));}", ".r10nfv4h::after{content:\"\";position:absolute;top:0;left:0;bottom:0;right:0;border-style:solid;border-color:inherit;border-width:var(--345, var(--346, var(--strokeWidthThin)));border-radius:inherit;}", ".ruauajt{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;position:relative;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);height:20px;width:20px;min-width:max-content;padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));border-radius:var(--341, var(--342, var(--borderRadiusCircular)));border-color:var(--343, var(--344, var(--colorTransparentStroke)));}", ".ruauajt::after{content:\"\";position:absolute;top:0;right:0;bottom:0;left:0;border-style:solid;border-color:inherit;border-width:var(--345, var(--346, var(--strokeWidthThin)));border-radius:inherit;}"]);
10
+ const useRootClassName = /*#__PURE__*/__resetStyles("r1l7mb74", "rntuq2r", [".r1l7mb74{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;position:relative;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);height:20px;width:20px;min-width:max-content;padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));border-radius:var(--borderRadiusCircular);border-color:var(--colorTransparentStroke);}", ".r1l7mb74::after{content:\"\";position:absolute;top:0;left:0;bottom:0;right:0;border-style:solid;border-color:inherit;border-width:var(--strokeWidthThin);border-radius:inherit;}", ".rntuq2r{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;position:relative;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);height:20px;width:20px;min-width:max-content;padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));border-radius:var(--borderRadiusCircular);border-color:var(--colorTransparentStroke);}", ".rntuq2r::after{content:\"\";position:absolute;top:0;right:0;bottom:0;left:0;border-style:solid;border-color:inherit;border-width:var(--strokeWidthThin);border-radius:inherit;}"]);
11
11
  const useRootStyles = /*#__PURE__*/__styles({
12
12
  fontSmallToTiny: {
13
13
  Bahqtrf: "fk6fouc",
@@ -72,21 +72,21 @@ const useRootStyles = /*#__PURE__*/__styles({
72
72
  Bbmb7ep: 0,
73
73
  Btl43ni: 0,
74
74
  B7oj6ja: 0,
75
- Dimara: "fai50ut"
75
+ Dimara: "f1fabniw"
76
76
  },
77
77
  rounded: {
78
78
  Beyfa6y: 0,
79
79
  Bbmb7ep: 0,
80
80
  Btl43ni: 0,
81
81
  B7oj6ja: 0,
82
- Dimara: "f1e5tea3"
82
+ Dimara: "ft85np5"
83
83
  },
84
84
  roundedSmallToTiny: {
85
85
  Beyfa6y: 0,
86
86
  Bbmb7ep: 0,
87
87
  Btl43ni: 0,
88
88
  B7oj6ja: 0,
89
- Dimara: "f1mplvw1"
89
+ Dimara: "fq9zq91"
90
90
  },
91
91
  circular: {},
92
92
  borderGhost: {
@@ -94,61 +94,61 @@ const useRootStyles = /*#__PURE__*/__styles({
94
94
  },
95
95
  filled: {},
96
96
  "filled-brand": {
97
- De3pzq: "f19hwuml",
98
- sj55zd: "f7ou5un"
97
+ De3pzq: "ffp7eso",
98
+ sj55zd: "f1phragk"
99
99
  },
100
100
  "filled-danger": {
101
- De3pzq: "frr1ynz",
102
- sj55zd: "fs397sr"
101
+ De3pzq: "fdl5y0r",
102
+ sj55zd: "f1phragk"
103
103
  },
104
104
  "filled-important": {
105
- De3pzq: "f1vkul9e",
106
- sj55zd: "f10deorr"
105
+ De3pzq: "f1c73kur",
106
+ sj55zd: "fr0bkrk"
107
107
  },
108
108
  "filled-informative": {
109
- De3pzq: "f12mr7aq",
110
- sj55zd: "fc1lalz"
109
+ De3pzq: "f3vzo32",
110
+ sj55zd: "f11d4kpn"
111
111
  },
112
112
  "filled-severe": {
113
- De3pzq: "fso1mzb",
114
- sj55zd: "f1apyimk"
113
+ De3pzq: "f1s438gw",
114
+ sj55zd: "f1phragk"
115
115
  },
116
116
  "filled-subtle": {
117
- De3pzq: "f1570tmq",
118
- sj55zd: "f1ih66gz"
117
+ De3pzq: "fxugw4r",
118
+ sj55zd: "f19n0e5"
119
119
  },
120
120
  "filled-success": {
121
- De3pzq: "f1xvu00u",
122
- sj55zd: "f1a2a3s"
121
+ De3pzq: "flxk52p",
122
+ sj55zd: "f1phragk"
123
123
  },
124
124
  "filled-warning": {
125
- De3pzq: "fopv15x",
126
- sj55zd: "fyehek6"
125
+ De3pzq: "ffq97bm",
126
+ sj55zd: "ff5vbop"
127
127
  },
128
128
  ghost: {},
129
129
  "ghost-brand": {
130
- sj55zd: "fapxi05"
130
+ sj55zd: "f16muhyy"
131
131
  },
132
132
  "ghost-danger": {
133
- sj55zd: "fr2bi5m"
133
+ sj55zd: "f1whyuy6"
134
134
  },
135
135
  "ghost-important": {
136
- sj55zd: "fkcwhv5"
136
+ sj55zd: "f19n0e5"
137
137
  },
138
138
  "ghost-informative": {
139
- sj55zd: "f1m2rgkd"
139
+ sj55zd: "f11d4kpn"
140
140
  },
141
141
  "ghost-severe": {
142
- sj55zd: "f9r2fi"
142
+ sj55zd: "f1l8vj45"
143
143
  },
144
144
  "ghost-subtle": {
145
- sj55zd: "f18ujb"
145
+ sj55zd: "fonrgv7"
146
146
  },
147
147
  "ghost-success": {
148
- sj55zd: "f1ip27zr"
148
+ sj55zd: "f1m7fhi8"
149
149
  },
150
150
  "ghost-warning": {
151
- sj55zd: "f1g3245m"
151
+ sj55zd: "fpti2h4"
152
152
  },
153
153
  outline: {
154
154
  g2u3we: "f23ftbb",
@@ -157,105 +157,105 @@ const useRootStyles = /*#__PURE__*/__styles({
157
157
  zhjwy3: ["f1p1bl80", "f1gkuv52"]
158
158
  },
159
159
  "outline-brand": {
160
- sj55zd: "f18fr6fe"
160
+ sj55zd: "f16muhyy"
161
161
  },
162
162
  "outline-danger": {
163
- sj55zd: "febqro7",
163
+ sj55zd: "f1whyuy6",
164
164
  g2u3we: "fyqpifd",
165
165
  h3c5rm: ["f3ukxca", "f1k7dugc"],
166
166
  B9xav0g: "f1njxb2b",
167
167
  zhjwy3: ["f1k7dugc", "f3ukxca"]
168
168
  },
169
169
  "outline-important": {
170
- sj55zd: "ffs1hx6",
170
+ sj55zd: "f11d4kpn",
171
171
  g2u3we: "fq0vr37",
172
172
  h3c5rm: ["f1byw159", "f11cr0be"],
173
173
  B9xav0g: "f1c1zstj",
174
174
  zhjwy3: ["f11cr0be", "f1byw159"]
175
175
  },
176
176
  "outline-informative": {
177
- sj55zd: "f13yqyjw",
177
+ sj55zd: "f11d4kpn",
178
178
  g2u3we: "f68mrw8",
179
179
  h3c5rm: ["f7pw515", "fw35ms5"],
180
180
  B9xav0g: "frpde29",
181
181
  zhjwy3: ["fw35ms5", "f7pw515"]
182
182
  },
183
183
  "outline-severe": {
184
- sj55zd: "f1ckjb0u"
184
+ sj55zd: "f1l8vj45"
185
185
  },
186
186
  "outline-subtle": {
187
- sj55zd: "f12iazmu"
187
+ sj55zd: "fonrgv7"
188
188
  },
189
189
  "outline-success": {
190
- sj55zd: "f1sja6nl",
190
+ sj55zd: "f1m7fhi8",
191
191
  g2u3we: "f1mmhl11",
192
192
  h3c5rm: ["f1tjpp2f", "f1ocn5n7"],
193
193
  B9xav0g: "f1gjv25d",
194
194
  zhjwy3: ["f1ocn5n7", "f1tjpp2f"]
195
195
  },
196
196
  "outline-warning": {
197
- sj55zd: "f867xiw"
197
+ sj55zd: "fpti2h4"
198
198
  },
199
199
  tint: {},
200
200
  "tint-brand": {
201
- De3pzq: "f146wntt",
202
- sj55zd: "f1bfvynb",
201
+ De3pzq: "f16xkysk",
202
+ sj55zd: "faj9fo0",
203
203
  g2u3we: "f161y7kd",
204
204
  h3c5rm: ["f1c8dzaj", "f1sl6hi9"],
205
205
  B9xav0g: "f1619yhw",
206
206
  zhjwy3: ["f1sl6hi9", "f1c8dzaj"]
207
207
  },
208
208
  "tint-danger": {
209
- De3pzq: "f1j7js5g",
210
- sj55zd: "f88p1ow",
209
+ De3pzq: "ff0poqj",
210
+ sj55zd: "f1hcrxcs",
211
211
  g2u3we: "f1oqjm8o",
212
212
  h3c5rm: ["fkgrb8g", "frb5wm0"],
213
213
  B9xav0g: "f1iai1ph",
214
214
  zhjwy3: ["frb5wm0", "fkgrb8g"]
215
215
  },
216
216
  "tint-important": {
217
- De3pzq: "fevsi08",
218
- sj55zd: "foodvkd",
217
+ De3pzq: "f945g0u",
218
+ sj55zd: "fr0bkrk",
219
219
  g2u3we: "fghlq4f",
220
220
  h3c5rm: ["f1gn591s", "fjscplz"],
221
221
  B9xav0g: "fb073pr",
222
222
  zhjwy3: ["fjscplz", "f1gn591s"]
223
223
  },
224
224
  "tint-informative": {
225
- De3pzq: "f13o4ny3",
226
- sj55zd: "f1kyw6sm",
225
+ De3pzq: "f1ctqxl6",
226
+ sj55zd: "f11d4kpn",
227
227
  g2u3we: "f68mrw8",
228
228
  h3c5rm: ["f7pw515", "fw35ms5"],
229
229
  B9xav0g: "frpde29",
230
230
  zhjwy3: ["fw35ms5", "f7pw515"]
231
231
  },
232
232
  "tint-severe": {
233
- De3pzq: "fdxi31b",
234
- sj55zd: "f1le075t",
233
+ De3pzq: "f1xzsg4",
234
+ sj55zd: "f1k5f75o",
235
235
  g2u3we: "fxy9dsj",
236
236
  h3c5rm: ["f54u6j2", "fcm23ze"],
237
237
  B9xav0g: "f4vf0uq",
238
238
  zhjwy3: ["fcm23ze", "f54u6j2"]
239
239
  },
240
240
  "tint-subtle": {
241
- De3pzq: "f1f72teq",
242
- sj55zd: "f76hxaz",
241
+ De3pzq: "fxugw4r",
242
+ sj55zd: "f11d4kpn",
243
243
  g2u3we: "f68mrw8",
244
244
  h3c5rm: ["f7pw515", "fw35ms5"],
245
245
  B9xav0g: "frpde29",
246
246
  zhjwy3: ["fw35ms5", "f7pw515"]
247
247
  },
248
248
  "tint-success": {
249
- De3pzq: "f1xeb5ba",
250
- sj55zd: "f17js1cg",
249
+ De3pzq: "f2vsrz6",
250
+ sj55zd: "ffmvakt",
251
251
  g2u3we: "fdmic9h",
252
252
  h3c5rm: ["f196y6m", "fetptd8"],
253
253
  B9xav0g: "f1pev5xq",
254
254
  zhjwy3: ["fetptd8", "f196y6m"]
255
255
  },
256
256
  "tint-warning": {
257
- De3pzq: "f1wkb02k",
258
- sj55zd: "f5u1fiz",
257
+ De3pzq: "f10s6hli",
258
+ sj55zd: "f42v8de",
259
259
  g2u3we: "fn9i3n",
260
260
  h3c5rm: ["f1aw8cx4", "f51if14"],
261
261
  B9xav0g: "fvq8iai",
@@ -272,13 +272,13 @@ const useRootStyles = /*#__PURE__*/__styles({
272
272
  p: -1
273
273
  }], ".f1szoe96{width:32px;}", ".f1d2rq10{height:32px;}", [".fty64o7{padding:0 calc(var(--spacingHorizontalSNudge) + var(--spacingHorizontalXXS));}", {
274
274
  p: -1
275
- }], [".fai50ut{border-radius:var(--347, var(--348, var(--borderRadiusNone)));}", {
275
+ }], [".f1fabniw{border-radius:var(--borderRadiusNone);}", {
276
276
  p: -1
277
- }], [".f1e5tea3{border-radius:var(--349, var(--350, var(--borderRadiusMedium)));}", {
277
+ }], [".ft85np5{border-radius:var(--borderRadiusMedium);}", {
278
278
  p: -1
279
- }], [".f1mplvw1{border-radius:var(--351, var(--352, var(--borderRadiusSmall)));}", {
279
+ }], [".fq9zq91{border-radius:var(--borderRadiusSmall);}", {
280
280
  p: -1
281
- }], ".f10ludwy::after{display:none;}", ".f19hwuml{background-color:var(--353, var(--354, var(--colorBrandBackground)));}", ".f7ou5un{color:var(--355, var(--356, var(--colorNeutralForegroundOnBrand)));}", ".frr1ynz{background-color:var(--357, var(--358, var(--colorPaletteRedBackground3)));}", ".fs397sr{color:var(--359, var(--360, var(--colorNeutralForegroundOnBrand)));}", ".f1vkul9e{background-color:var(--361, var(--362, var(--colorNeutralForeground1)));}", ".f10deorr{color:var(--363, var(--364, var(--colorNeutralBackground1)));}", ".f12mr7aq{background-color:var(--365, var(--366, var(--colorNeutralBackground5)));}", ".fc1lalz{color:var(--367, var(--368, var(--colorNeutralForeground3)));}", ".fso1mzb{background-color:var(--369, var(--370, var(--colorPaletteDarkOrangeBackground3)));}", ".f1apyimk{color:var(--371, var(--372, var(--colorNeutralForegroundOnBrand)));}", ".f1570tmq{background-color:var(--373, var(--374, var(--colorNeutralBackground1)));}", ".f1ih66gz{color:var(--375, var(--376, var(--colorNeutralForeground1)));}", ".f1xvu00u{background-color:var(--377, var(--378, var(--colorPaletteGreenBackground3)));}", ".f1a2a3s{color:var(--379, var(--380, var(--colorNeutralForegroundOnBrand)));}", ".fopv15x{background-color:var(--381, var(--382, var(--colorPaletteYellowBackground3)));}", ".fyehek6{color:var(--383, var(--384, var(--colorNeutralForeground1Static)));}", ".fapxi05{color:var(--385, var(--386, var(--colorBrandForeground1)));}", ".fr2bi5m{color:var(--387, var(--388, var(--colorPaletteRedForeground3)));}", ".fkcwhv5{color:var(--389, var(--390, var(--colorNeutralForeground1)));}", ".f1m2rgkd{color:var(--391, var(--392, var(--colorNeutralForeground3)));}", ".f9r2fi{color:var(--393, var(--394, var(--colorPaletteDarkOrangeForeground3)));}", ".f18ujb{color:var(--395, var(--396, var(--colorNeutralForegroundStaticInverted)));}", ".f1ip27zr{color:var(--397, var(--398, var(--colorPaletteGreenForeground3)));}", ".f1g3245m{color:var(--399, var(--400, var(--colorPaletteYellowForeground2)));}", ".f23ftbb{border-top-color:currentColor;}", ".f1gkuv52{border-right-color:currentColor;}", ".f1p1bl80{border-left-color:currentColor;}", ".fioka3i{border-bottom-color:currentColor;}", ".f18fr6fe{color:var(--401, var(--402, var(--colorBrandForeground1)));}", ".febqro7{color:var(--403, var(--404, var(--colorPaletteRedForeground3)));}", ".fyqpifd{border-top-color:var(--colorPaletteRedBorder2);}", ".f3ukxca{border-right-color:var(--colorPaletteRedBorder2);}", ".f1k7dugc{border-left-color:var(--colorPaletteRedBorder2);}", ".f1njxb2b{border-bottom-color:var(--colorPaletteRedBorder2);}", ".ffs1hx6{color:var(--405, var(--406, var(--colorNeutralForeground3)));}", ".fq0vr37{border-top-color:var(--colorNeutralStrokeAccessible);}", ".f1byw159{border-right-color:var(--colorNeutralStrokeAccessible);}", ".f11cr0be{border-left-color:var(--colorNeutralStrokeAccessible);}", ".f1c1zstj{border-bottom-color:var(--colorNeutralStrokeAccessible);}", ".f13yqyjw{color:var(--407, var(--408, var(--colorNeutralForeground3)));}", ".f68mrw8{border-top-color:var(--colorNeutralStroke2);}", ".f7pw515{border-right-color:var(--colorNeutralStroke2);}", ".fw35ms5{border-left-color:var(--colorNeutralStroke2);}", ".frpde29{border-bottom-color:var(--colorNeutralStroke2);}", ".f1ckjb0u{color:var(--409, var(--410, var(--colorPaletteDarkOrangeForeground3)));}", ".f12iazmu{color:var(--411, var(--412, var(--colorNeutralForegroundStaticInverted)));}", ".f1sja6nl{color:var(--413, var(--414, var(--colorPaletteGreenForeground3)));}", ".f1mmhl11{border-top-color:var(--colorPaletteGreenBorder2);}", ".f1tjpp2f{border-right-color:var(--colorPaletteGreenBorder2);}", ".f1ocn5n7{border-left-color:var(--colorPaletteGreenBorder2);}", ".f1gjv25d{border-bottom-color:var(--colorPaletteGreenBorder2);}", ".f867xiw{color:var(--415, var(--416, var(--colorPaletteYellowForeground2)));}", ".f146wntt{background-color:var(--417, var(--418, var(--colorBrandBackground2)));}", ".f1bfvynb{color:var(--419, var(--420, var(--colorBrandForeground2)));}", ".f161y7kd{border-top-color:var(--colorBrandStroke2);}", ".f1c8dzaj{border-right-color:var(--colorBrandStroke2);}", ".f1sl6hi9{border-left-color:var(--colorBrandStroke2);}", ".f1619yhw{border-bottom-color:var(--colorBrandStroke2);}", ".f1j7js5g{background-color:var(--421, var(--422, var(--colorPaletteRedBackground1)));}", ".f88p1ow{color:var(--423, var(--424, var(--colorPaletteRedForeground1)));}", ".f1oqjm8o{border-top-color:var(--colorPaletteRedBorder1);}", ".fkgrb8g{border-right-color:var(--colorPaletteRedBorder1);}", ".frb5wm0{border-left-color:var(--colorPaletteRedBorder1);}", ".f1iai1ph{border-bottom-color:var(--colorPaletteRedBorder1);}", ".fevsi08{background-color:var(--425, var(--426, var(--colorNeutralForeground3)));}", ".foodvkd{color:var(--427, var(--428, var(--colorNeutralBackground1)));}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".f13o4ny3{background-color:var(--429, var(--430, var(--colorNeutralBackground4)));}", ".f1kyw6sm{color:var(--431, var(--432, var(--colorNeutralForeground3)));}", ".fdxi31b{background-color:var(--433, var(--434, var(--colorPaletteDarkOrangeBackground1)));}", ".f1le075t{color:var(--435, var(--436, var(--colorPaletteDarkOrangeForeground1)));}", ".fxy9dsj{border-top-color:var(--colorPaletteDarkOrangeBorder1);}", ".f54u6j2{border-right-color:var(--colorPaletteDarkOrangeBorder1);}", ".fcm23ze{border-left-color:var(--colorPaletteDarkOrangeBorder1);}", ".f4vf0uq{border-bottom-color:var(--colorPaletteDarkOrangeBorder1);}", ".f1f72teq{background-color:var(--437, var(--438, var(--colorNeutralBackground1)));}", ".f76hxaz{color:var(--439, var(--440, var(--colorNeutralForeground3)));}", ".f1xeb5ba{background-color:var(--441, var(--442, var(--colorPaletteGreenBackground1)));}", ".f17js1cg{color:var(--443, var(--444, var(--colorPaletteGreenForeground1)));}", ".fdmic9h{border-top-color:var(--colorPaletteGreenBorder1);}", ".f196y6m{border-right-color:var(--colorPaletteGreenBorder1);}", ".fetptd8{border-left-color:var(--colorPaletteGreenBorder1);}", ".f1pev5xq{border-bottom-color:var(--colorPaletteGreenBorder1);}", ".f1wkb02k{background-color:var(--445, var(--446, var(--colorPaletteYellowBackground1)));}", ".f5u1fiz{color:var(--447, var(--448, var(--colorPaletteYellowForeground1)));}", ".fn9i3n{border-top-color:var(--colorPaletteYellowBorder1);}", ".f1aw8cx4{border-right-color:var(--colorPaletteYellowBorder1);}", ".f51if14{border-left-color:var(--colorPaletteYellowBorder1);}", ".fvq8iai{border-bottom-color:var(--colorPaletteYellowBorder1);}"]
281
+ }], ".f10ludwy::after{display:none;}", ".ffp7eso{background-color:var(--colorBrandBackground);}", ".f1phragk{color:var(--colorNeutralForegroundOnBrand);}", ".fdl5y0r{background-color:var(--colorPaletteRedBackground3);}", ".f1c73kur{background-color:var(--colorNeutralForeground1);}", ".fr0bkrk{color:var(--colorNeutralBackground1);}", ".f3vzo32{background-color:var(--colorNeutralBackground5);}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".f1s438gw{background-color:var(--colorPaletteDarkOrangeBackground3);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".flxk52p{background-color:var(--colorPaletteGreenBackground3);}", ".ffq97bm{background-color:var(--colorPaletteYellowBackground3);}", ".ff5vbop{color:var(--colorNeutralForeground1Static);}", ".f16muhyy{color:var(--colorBrandForeground1);}", ".f1whyuy6{color:var(--colorPaletteRedForeground3);}", ".f1l8vj45{color:var(--colorPaletteDarkOrangeForeground3);}", ".fonrgv7{color:var(--colorNeutralForegroundStaticInverted);}", ".f1m7fhi8{color:var(--colorPaletteGreenForeground3);}", ".fpti2h4{color:var(--colorPaletteYellowForeground2);}", ".f23ftbb{border-top-color:currentColor;}", ".f1gkuv52{border-right-color:currentColor;}", ".f1p1bl80{border-left-color:currentColor;}", ".fioka3i{border-bottom-color:currentColor;}", ".fyqpifd{border-top-color:var(--colorPaletteRedBorder2);}", ".f3ukxca{border-right-color:var(--colorPaletteRedBorder2);}", ".f1k7dugc{border-left-color:var(--colorPaletteRedBorder2);}", ".f1njxb2b{border-bottom-color:var(--colorPaletteRedBorder2);}", ".fq0vr37{border-top-color:var(--colorNeutralStrokeAccessible);}", ".f1byw159{border-right-color:var(--colorNeutralStrokeAccessible);}", ".f11cr0be{border-left-color:var(--colorNeutralStrokeAccessible);}", ".f1c1zstj{border-bottom-color:var(--colorNeutralStrokeAccessible);}", ".f68mrw8{border-top-color:var(--colorNeutralStroke2);}", ".f7pw515{border-right-color:var(--colorNeutralStroke2);}", ".fw35ms5{border-left-color:var(--colorNeutralStroke2);}", ".frpde29{border-bottom-color:var(--colorNeutralStroke2);}", ".f1mmhl11{border-top-color:var(--colorPaletteGreenBorder2);}", ".f1tjpp2f{border-right-color:var(--colorPaletteGreenBorder2);}", ".f1ocn5n7{border-left-color:var(--colorPaletteGreenBorder2);}", ".f1gjv25d{border-bottom-color:var(--colorPaletteGreenBorder2);}", ".f16xkysk{background-color:var(--colorBrandBackground2);}", ".faj9fo0{color:var(--colorBrandForeground2);}", ".f161y7kd{border-top-color:var(--colorBrandStroke2);}", ".f1c8dzaj{border-right-color:var(--colorBrandStroke2);}", ".f1sl6hi9{border-left-color:var(--colorBrandStroke2);}", ".f1619yhw{border-bottom-color:var(--colorBrandStroke2);}", ".ff0poqj{background-color:var(--colorPaletteRedBackground1);}", ".f1hcrxcs{color:var(--colorPaletteRedForeground1);}", ".f1oqjm8o{border-top-color:var(--colorPaletteRedBorder1);}", ".fkgrb8g{border-right-color:var(--colorPaletteRedBorder1);}", ".frb5wm0{border-left-color:var(--colorPaletteRedBorder1);}", ".f1iai1ph{border-bottom-color:var(--colorPaletteRedBorder1);}", ".f945g0u{background-color:var(--colorNeutralForeground3);}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".f1ctqxl6{background-color:var(--colorNeutralBackground4);}", ".f1xzsg4{background-color:var(--colorPaletteDarkOrangeBackground1);}", ".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}", ".fxy9dsj{border-top-color:var(--colorPaletteDarkOrangeBorder1);}", ".f54u6j2{border-right-color:var(--colorPaletteDarkOrangeBorder1);}", ".fcm23ze{border-left-color:var(--colorPaletteDarkOrangeBorder1);}", ".f4vf0uq{border-bottom-color:var(--colorPaletteDarkOrangeBorder1);}", ".f2vsrz6{background-color:var(--colorPaletteGreenBackground1);}", ".ffmvakt{color:var(--colorPaletteGreenForeground1);}", ".fdmic9h{border-top-color:var(--colorPaletteGreenBorder1);}", ".f196y6m{border-right-color:var(--colorPaletteGreenBorder1);}", ".fetptd8{border-left-color:var(--colorPaletteGreenBorder1);}", ".f1pev5xq{border-bottom-color:var(--colorPaletteGreenBorder1);}", ".f10s6hli{background-color:var(--colorPaletteYellowBackground1);}", ".f42v8de{color:var(--colorPaletteYellowForeground1);}", ".fn9i3n{border-top-color:var(--colorPaletteYellowBorder1);}", ".f1aw8cx4{border-right-color:var(--colorPaletteYellowBorder1);}", ".f51if14{border-left-color:var(--colorPaletteYellowBorder1);}", ".fvq8iai{border-bottom-color:var(--colorPaletteYellowBorder1);}"]
282
282
  });
283
283
  const useIconRootClassName = /*#__PURE__*/__resetStyles("rttl5z0", null, [".rttl5z0{display:flex;line-height:1;margin:0 calc(-1 * var(--spacingHorizontalXXS));font-size:12px;}"]);
284
284
  const useIconStyles = /*#__PURE__*/__styles({
package/lib/components/Badge/useBadgeStyles.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["shorthands","__resetStyles","__styles","mergeClasses","tokens","typographyStyles","badgeClassNames","root","icon","textPadding","spacingHorizontalXXS","useRootClassName","useRootStyles","fontSmallToTiny","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","tiny","a9b677","Bqenvij","Bf4jedk","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","small","medium","large","square","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","rounded","roundedSmallToTiny","circular","borderGhost","ap17g6","filled","De3pzq","sj55zd","ghost","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","tint","d","p","useIconRootClassName","useIconStyles","beforeText","t21cq0","afterText","Frg6f3","beforeTextXL","afterTextXL","useBadgeStyles_unstable","state","rootClassName","rootStyles","smallToTiny","size","className","shape","appearance","color","iconRootClassName","iconStyles","iconPositionClass","children","iconPosition"],"sources":["useBadgeStyles.styles.js"],"sourcesContent":["import { shorthands, makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const badgeClassNames = {\n root: 'fui-Badge',\n icon: 'fui-Badge__icon'\n};\n// The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.\n// Instead, add extra padding to the root, and a negative margin on the icon to \"remove\" the extra padding on the icon.\nconst textPadding = tokens.spacingHorizontalXXS;\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n ...typographyStyles.caption1Strong,\n height: '20px',\n width: '20px',\n minWidth: 'max-content',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n borderRadius: `var(--341, var(--342, ${tokens.borderRadiusCircular}))`,\n // Use a transparent stroke (rather than no border) so the border is visible in high contrast\n borderColor: `var(--343, var(--344, ${tokens.colorTransparentStroke}))`,\n '::after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n borderStyle: 'solid',\n borderColor: 'inherit',\n borderWidth: `var(--345, var(--346, ${tokens.strokeWidthThin}))`,\n borderRadius: 'inherit'\n }\n});\nconst useRootStyles = makeStyles({\n fontSmallToTiny: {\n ...typographyStyles.caption2Strong\n },\n // size\n tiny: {\n width: '6px',\n height: '6px',\n fontSize: '4px',\n lineHeight: '4px',\n minWidth: 'unset',\n padding: 'unset'\n },\n 'extra-small': {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n lineHeight: '6px',\n minWidth: 'unset',\n padding: 'unset'\n },\n small: {\n width: '16px',\n height: '16px',\n padding: `0 calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n medium: {\n },\n large: {\n width: '24px',\n height: '24px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n 'extra-large': {\n width: '32px',\n height: '32px',\n padding: `0 calc(${tokens.spacingHorizontalSNudge} + ${textPadding})`\n },\n // shape\n square: {\n borderRadius: `var(--347, var(--348, ${tokens.borderRadiusNone}))`\n },\n rounded: {\n borderRadius: `var(--349, var(--350, ${tokens.borderRadiusMedium}))`\n },\n roundedSmallToTiny: {\n borderRadius: `var(--351, var(--352, ${tokens.borderRadiusSmall}))`\n },\n circular: {\n },\n // hide the boder when appearance is \"ghost\"\n borderGhost: {\n // The border is applied in an ::after pseudo-element because it should not affect layout.\n // The padding and size of the badge should be the same regardless of whether or not it has a border.\n '::after': {\n display: 'none'\n }\n },\n // appearance: filled\n filled: {\n },\n 'filled-brand': {\n backgroundColor: `var(--353, var(--354, ${tokens.colorBrandBackground}))`,\n color: `var(--355, var(--356, ${tokens.colorNeutralForegroundOnBrand}))`\n },\n 'filled-danger': {\n backgroundColor: `var(--357, var(--358, ${tokens.colorPaletteRedBackground3}))`,\n color: `var(--359, var(--360, ${tokens.colorNeutralForegroundOnBrand}))`\n },\n 'filled-important': {\n backgroundColor: `var(--361, var(--362, ${tokens.colorNeutralForeground1}))`,\n color: `var(--363, var(--364, ${tokens.colorNeutralBackground1}))`\n },\n 'filled-informative': {\n backgroundColor: `var(--365, var(--366, ${tokens.colorNeutralBackground5}))`,\n color: `var(--367, var(--368, ${tokens.colorNeutralForeground3}))`\n },\n 'filled-severe': {\n backgroundColor: `var(--369, var(--370, ${tokens.colorPaletteDarkOrangeBackground3}))`,\n color: `var(--371, var(--372, ${tokens.colorNeutralForegroundOnBrand}))`\n },\n 'filled-subtle': {\n backgroundColor: `var(--373, var(--374, ${tokens.colorNeutralBackground1}))`,\n color: `var(--375, var(--376, ${tokens.colorNeutralForeground1}))`\n },\n 'filled-success': {\n backgroundColor: `var(--377, var(--378, ${tokens.colorPaletteGreenBackground3}))`,\n color: `var(--379, var(--380, ${tokens.colorNeutralForegroundOnBrand}))`\n },\n 'filled-warning': {\n backgroundColor: `var(--381, var(--382, ${tokens.colorPaletteYellowBackground3}))`,\n color: `var(--383, var(--384, ${tokens.colorNeutralForeground1Static}))`\n },\n // appearance: ghost\n ghost: {\n },\n 'ghost-brand': {\n color: `var(--385, var(--386, ${tokens.colorBrandForeground1}))`\n },\n 'ghost-danger': {\n color: `var(--387, var(--388, ${tokens.colorPaletteRedForeground3}))`\n },\n 'ghost-important': {\n color: `var(--389, var(--390, ${tokens.colorNeutralForeground1}))`\n },\n 'ghost-informative': {\n color: `var(--391, var(--392, ${tokens.colorNeutralForeground3}))`\n },\n 'ghost-severe': {\n color: `var(--393, var(--394, ${tokens.colorPaletteDarkOrangeForeground3}))`\n },\n 'ghost-subtle': {\n color: `var(--395, var(--396, ${tokens.colorNeutralForegroundStaticInverted}))`\n },\n 'ghost-success': {\n color: `var(--397, var(--398, ${tokens.colorPaletteGreenForeground3}))`\n },\n 'ghost-warning': {\n color: `var(--399, var(--400, ${tokens.colorPaletteYellowForeground2}))`\n },\n // appearance: outline\n outline: {\n ...shorthands.borderColor('currentColor')\n },\n 'outline-brand': {\n color: `var(--401, var(--402, ${tokens.colorBrandForeground1}))`\n },\n 'outline-danger': {\n color: `var(--403, var(--404, ${tokens.colorPaletteRedForeground3}))`,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n },\n 'outline-important': {\n color: `var(--405, var(--406, ${tokens.colorNeutralForeground3}))`,\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible)\n },\n 'outline-informative': {\n color: `var(--407, var(--408, ${tokens.colorNeutralForeground3}))`,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'outline-severe': {\n color: `var(--409, var(--410, ${tokens.colorPaletteDarkOrangeForeground3}))`\n },\n 'outline-subtle': {\n color: `var(--411, var(--412, ${tokens.colorNeutralForegroundStaticInverted}))`\n },\n 'outline-success': {\n color: `var(--413, var(--414, ${tokens.colorPaletteGreenForeground3}))`,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder2)\n },\n 'outline-warning': {\n color: `var(--415, var(--416, ${tokens.colorPaletteYellowForeground2}))`\n },\n // appearance: tint\n tint: {\n },\n 'tint-brand': {\n backgroundColor: `var(--417, var(--418, ${tokens.colorBrandBackground2}))`,\n color: `var(--419, var(--420, ${tokens.colorBrandForeground2}))`,\n ...shorthands.borderColor(tokens.colorBrandStroke2)\n },\n 'tint-danger': {\n backgroundColor: `var(--421, var(--422, ${tokens.colorPaletteRedBackground1}))`,\n color: `var(--423, var(--424, ${tokens.colorPaletteRedForeground1}))`,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder1)\n },\n 'tint-important': {\n backgroundColor: `var(--425, var(--426, ${tokens.colorNeutralForeground3}))`,\n color: `var(--427, var(--428, ${tokens.colorNeutralBackground1}))`,\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n 'tint-informative': {\n backgroundColor: `var(--429, var(--430, ${tokens.colorNeutralBackground4}))`,\n color: `var(--431, var(--432, ${tokens.colorNeutralForeground3}))`,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-severe': {\n backgroundColor: `var(--433, var(--434, ${tokens.colorPaletteDarkOrangeBackground1}))`,\n color: `var(--435, var(--436, ${tokens.colorPaletteDarkOrangeForeground1}))`,\n ...shorthands.borderColor(tokens.colorPaletteDarkOrangeBorder1)\n },\n 'tint-subtle': {\n backgroundColor: `var(--437, var(--438, ${tokens.colorNeutralBackground1}))`,\n color: `var(--439, var(--440, ${tokens.colorNeutralForeground3}))`,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-success': {\n backgroundColor: `var(--441, var(--442, ${tokens.colorPaletteGreenBackground1}))`,\n color: `var(--443, var(--444, ${tokens.colorPaletteGreenForeground1}))`,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder1)\n },\n 'tint-warning': {\n backgroundColor: `var(--445, var(--446, ${tokens.colorPaletteYellowBackground1}))`,\n color: `var(--447, var(--448, ${tokens.colorPaletteYellowForeground1}))`,\n ...shorthands.borderColor(tokens.colorPaletteYellowBorder1)\n }\n});\nconst useIconRootClassName = makeResetStyles({\n display: 'flex',\n lineHeight: '1',\n margin: `0 calc(-1 * ${textPadding})`,\n fontSize: '12px'\n});\nconst useIconStyles = makeStyles({\n beforeText: {\n marginRight: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n afterText: {\n marginLeft: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n beforeTextXL: {\n marginRight: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n afterTextXL: {\n marginLeft: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n // size\n tiny: {\n fontSize: '6px'\n },\n 'extra-small': {\n fontSize: '10px'\n },\n small: {\n fontSize: '12px'\n },\n medium: {\n },\n large: {\n fontSize: '16px'\n },\n 'extra-large': {\n fontSize: '20px'\n }\n});\n/**\n * Applies style classnames to slots\n */ export const useBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const rootStyles = useRootStyles();\n const smallToTiny = state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny';\n state.root.className = mergeClasses(badgeClassNames.root, rootClassName, smallToTiny && rootStyles.fontSmallToTiny, rootStyles[state.size], rootStyles[state.shape], state.shape === 'rounded' && smallToTiny && rootStyles.roundedSmallToTiny, state.appearance === 'ghost' && rootStyles.borderGhost, rootStyles[state.appearance], rootStyles[`${state.appearance}-${state.color}`], state.root.className);\n const iconRootClassName = useIconRootClassName();\n const iconStyles = useIconStyles();\n if (state.icon) {\n let iconPositionClass;\n if (state.root.children) {\n if (state.size === 'extra-large') {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterTextXL : iconStyles.beforeTextXL;\n } else {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterText : iconStyles.beforeText;\n }\n }\n state.icon.className = mergeClasses(badgeClassNames.icon, iconRootClassName, iconPositionClass, iconStyles[state.size], state.icon.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["shorthands","__resetStyles","__styles","mergeClasses","tokens","typographyStyles","badgeClassNames","root","icon","textPadding","spacingHorizontalXXS","useRootClassName","useRootStyles","fontSmallToTiny","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","tiny","a9b677","Bqenvij","Bf4jedk","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","small","medium","large","square","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","rounded","roundedSmallToTiny","circular","borderGhost","ap17g6","filled","De3pzq","sj55zd","ghost","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","tint","d","p","useIconRootClassName","useIconStyles","beforeText","t21cq0","afterText","Frg6f3","beforeTextXL","afterTextXL","useBadgeStyles_unstable","state","rootClassName","rootStyles","smallToTiny","size","className","shape","appearance","color","iconRootClassName","iconStyles","iconPositionClass","children","iconPosition"],"sources":["useBadgeStyles.styles.js"],"sourcesContent":["import { shorthands, makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const badgeClassNames = {\n root: 'fui-Badge',\n icon: 'fui-Badge__icon'\n};\n// The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.\n// Instead, add extra padding to the root, and a negative margin on the icon to \"remove\" the extra padding on the icon.\nconst textPadding = tokens.spacingHorizontalXXS;\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n ...typographyStyles.caption1Strong,\n height: '20px',\n width: '20px',\n minWidth: 'max-content',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n borderRadius: tokens.borderRadiusCircular,\n // Use a transparent stroke (rather than no border) so the border is visible in high contrast\n borderColor: tokens.colorTransparentStroke,\n '::after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n borderStyle: 'solid',\n borderColor: 'inherit',\n borderWidth: tokens.strokeWidthThin,\n borderRadius: 'inherit'\n }\n});\nconst useRootStyles = makeStyles({\n fontSmallToTiny: {\n ...typographyStyles.caption2Strong\n },\n // size\n tiny: {\n width: '6px',\n height: '6px',\n fontSize: '4px',\n lineHeight: '4px',\n minWidth: 'unset',\n padding: 'unset'\n },\n 'extra-small': {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n lineHeight: '6px',\n minWidth: 'unset',\n padding: 'unset'\n },\n small: {\n width: '16px',\n height: '16px',\n padding: `0 calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n medium: {\n },\n large: {\n width: '24px',\n height: '24px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n 'extra-large': {\n width: '32px',\n height: '32px',\n padding: `0 calc(${tokens.spacingHorizontalSNudge} + ${textPadding})`\n },\n // shape\n square: {\n borderRadius: tokens.borderRadiusNone\n },\n rounded: {\n borderRadius: tokens.borderRadiusMedium\n },\n roundedSmallToTiny: {\n borderRadius: tokens.borderRadiusSmall\n },\n circular: {\n },\n // hide the boder when appearance is \"ghost\"\n borderGhost: {\n // The border is applied in an ::after pseudo-element because it should not affect layout.\n // The padding and size of the badge should be the same regardless of whether or not it has a border.\n '::after': {\n display: 'none'\n }\n },\n // appearance: filled\n filled: {\n },\n 'filled-brand': {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-danger': {\n backgroundColor: tokens.colorPaletteRedBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-important': {\n backgroundColor: tokens.colorNeutralForeground1,\n color: tokens.colorNeutralBackground1\n },\n 'filled-informative': {\n backgroundColor: tokens.colorNeutralBackground5,\n color: tokens.colorNeutralForeground3\n },\n 'filled-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1\n },\n 'filled-success': {\n backgroundColor: tokens.colorPaletteGreenBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground3,\n color: tokens.colorNeutralForeground1Static\n },\n // appearance: ghost\n ghost: {\n },\n 'ghost-brand': {\n color: tokens.colorBrandForeground1\n },\n 'ghost-danger': {\n color: tokens.colorPaletteRedForeground3\n },\n 'ghost-important': {\n color: tokens.colorNeutralForeground1\n },\n 'ghost-informative': {\n color: tokens.colorNeutralForeground3\n },\n 'ghost-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3\n },\n 'ghost-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted\n },\n 'ghost-success': {\n color: tokens.colorPaletteGreenForeground3\n },\n 'ghost-warning': {\n color: tokens.colorPaletteYellowForeground2\n },\n // appearance: outline\n outline: {\n ...shorthands.borderColor('currentColor')\n },\n 'outline-brand': {\n color: tokens.colorBrandForeground1\n },\n 'outline-danger': {\n color: tokens.colorPaletteRedForeground3,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n },\n 'outline-important': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible)\n },\n 'outline-informative': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'outline-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3\n },\n 'outline-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted\n },\n 'outline-success': {\n color: tokens.colorPaletteGreenForeground3,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder2)\n },\n 'outline-warning': {\n color: tokens.colorPaletteYellowForeground2\n },\n // appearance: tint\n tint: {\n },\n 'tint-brand': {\n backgroundColor: tokens.colorBrandBackground2,\n color: tokens.colorBrandForeground2,\n ...shorthands.borderColor(tokens.colorBrandStroke2)\n },\n 'tint-danger': {\n backgroundColor: tokens.colorPaletteRedBackground1,\n color: tokens.colorPaletteRedForeground1,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder1)\n },\n 'tint-important': {\n backgroundColor: tokens.colorNeutralForeground3,\n color: tokens.colorNeutralBackground1,\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n 'tint-informative': {\n backgroundColor: tokens.colorNeutralBackground4,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground1,\n color: tokens.colorPaletteDarkOrangeForeground1,\n ...shorthands.borderColor(tokens.colorPaletteDarkOrangeBorder1)\n },\n 'tint-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-success': {\n backgroundColor: tokens.colorPaletteGreenBackground1,\n color: tokens.colorPaletteGreenForeground1,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder1)\n },\n 'tint-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground1,\n color: tokens.colorPaletteYellowForeground1,\n ...shorthands.borderColor(tokens.colorPaletteYellowBorder1)\n }\n});\nconst useIconRootClassName = makeResetStyles({\n display: 'flex',\n lineHeight: '1',\n margin: `0 calc(-1 * ${textPadding})`,\n fontSize: '12px'\n});\nconst useIconStyles = makeStyles({\n beforeText: {\n marginRight: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n afterText: {\n marginLeft: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n beforeTextXL: {\n marginRight: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n afterTextXL: {\n marginLeft: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n // size\n tiny: {\n fontSize: '6px'\n },\n 'extra-small': {\n fontSize: '10px'\n },\n small: {\n fontSize: '12px'\n },\n medium: {\n },\n large: {\n fontSize: '16px'\n },\n 'extra-large': {\n fontSize: '20px'\n }\n});\n/**\n * Applies style classnames to slots\n */ export const useBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const rootStyles = useRootStyles();\n const smallToTiny = state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny';\n state.root.className = mergeClasses(badgeClassNames.root, rootClassName, smallToTiny && rootStyles.fontSmallToTiny, rootStyles[state.size], rootStyles[state.shape], state.shape === 'rounded' && smallToTiny && rootStyles.roundedSmallToTiny, state.appearance === 'ghost' && rootStyles.borderGhost, rootStyles[state.appearance], rootStyles[`${state.appearance}-${state.color}`], state.root.className);\n const iconRootClassName = useIconRootClassName();\n const iconStyles = useIconStyles();\n if (state.icon) {\n let iconPositionClass;\n if (state.root.children) {\n if (state.size === 'extra-large') {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterTextXL : iconStyles.beforeTextXL;\n } else {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterText : iconStyles.beforeText;\n }\n }\n state.icon.className = mergeClasses(badgeClassNames.icon, iconRootClassName, iconPositionClass, iconStyles[state.size], state.icon.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
package/lib/components/PresenceBadge/usePresenceBadgeStyles.styles.js CHANGED
@@ -10,38 +10,38 @@ const getIsBusy = status => {
10
10
  }
11
11
  return false;
12
12
  };
13
- const useRootClassName = /*#__PURE__*/__resetStyles("r1711c1n", null, [".r1711c1n{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;border-radius:var(--449, var(--450, var(--borderRadiusCircular)));background-color:var(--451, var(--452, var(--colorNeutralBackground1)));padding:1px;background-clip:content-box;}"]);
13
+ const useRootClassName = /*#__PURE__*/__resetStyles("r832ydo", null, [".r832ydo{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;border-radius:var(--borderRadiusCircular);background-color:var(--colorNeutralBackground1);padding:1px;background-clip:content-box;}"]);
14
14
  const useIconClassName = /*#__PURE__*/__resetStyles("r11ag4qr", null, [".r11ag4qr{display:flex;margin:-1px;}"]);
15
15
  const useStyles = /*#__PURE__*/__styles({
16
16
  statusBusy: {
17
- sj55zd: "f12aalvp"
17
+ sj55zd: "fvi85wt"
18
18
  },
19
19
  statusAway: {
20
- sj55zd: "f10owiir"
20
+ sj55zd: "f14k8a89"
21
21
  },
22
22
  statusAvailable: {
23
- sj55zd: "fahcler"
23
+ sj55zd: "fqa5hgp"
24
24
  },
25
25
  statusOffline: {
26
- sj55zd: "f11odu81"
26
+ sj55zd: "f11d4kpn"
27
27
  },
28
28
  statusOutOfOffice: {
29
- sj55zd: "f1ovxq8r"
29
+ sj55zd: "fdce8r3"
30
30
  },
31
31
  statusUnknown: {
32
- sj55zd: "f16r53qq"
32
+ sj55zd: "f11d4kpn"
33
33
  },
34
34
  outOfOffice: {
35
- sj55zd: "f1lneuuo"
35
+ sj55zd: "fr0bkrk"
36
36
  },
37
37
  outOfOfficeAvailable: {
38
- sj55zd: "f187kc00"
38
+ sj55zd: "fqa5hgp"
39
39
  },
40
40
  outOfOfficeBusy: {
41
- sj55zd: "f1vz3tl8"
41
+ sj55zd: "fvi85wt"
42
42
  },
43
43
  outOfOfficeUnknown: {
44
- sj55zd: "f13mef6d"
44
+ sj55zd: "f11d4kpn"
45
45
  },
46
46
  tiny: {
47
47
  Bubjx69: "f9ikmtg",
@@ -63,7 +63,7 @@ const useStyles = /*#__PURE__*/__styles({
63
63
  p4uzdd: "fhipgdu"
64
64
  }
65
65
  }, {
66
- d: [".f12aalvp{color:var(--453, var(--454, var(--colorPaletteRedBackground3)));}", ".f10owiir{color:var(--455, var(--456, var(--colorPaletteMarigoldBackground3)));}", ".fahcler{color:var(--457, var(--458, var(--colorPaletteLightGreenForeground3)));}", ".f11odu81{color:var(--459, var(--460, var(--colorNeutralForeground3)));}", ".f1ovxq8r{color:var(--461, var(--462, var(--colorPaletteBerryForeground3)));}", ".f16r53qq{color:var(--463, var(--464, var(--colorNeutralForeground3)));}", ".f1lneuuo{color:var(--465, var(--466, var(--colorNeutralBackground1)));}", ".f187kc00{color:var(--467, var(--468, var(--colorPaletteLightGreenForeground3)));}", ".f1vz3tl8{color:var(--469, var(--470, var(--colorPaletteRedBackground3)));}", ".f13mef6d{color:var(--471, var(--472, var(--colorNeutralForeground3)));}", ".f9ikmtg{aspect-ratio:1;}", ".f16dn6v3{width:6px;}", ".f1w2irj7{background-clip:unset;}", ".fab5kbq svg{width:6px!important;}", ".f1ms1d91 svg{height:6px!important;}", ".f64fuq3{width:20px;}", ".f1vfi1yj svg{width:20px!important;}", ".f15s34gz svg{height:20px!important;}", ".f1w9dchk{width:28px;}", ".f14efy9b svg{width:28px!important;}", ".fhipgdu svg{height:28px!important;}"]
66
+ d: [".fvi85wt{color:var(--colorPaletteRedBackground3);}", ".f14k8a89{color:var(--colorPaletteMarigoldBackground3);}", ".fqa5hgp{color:var(--colorPaletteLightGreenForeground3);}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".fdce8r3{color:var(--colorPaletteBerryForeground3);}", ".fr0bkrk{color:var(--colorNeutralBackground1);}", ".f9ikmtg{aspect-ratio:1;}", ".f16dn6v3{width:6px;}", ".f1w2irj7{background-clip:unset;}", ".fab5kbq svg{width:6px!important;}", ".f1ms1d91 svg{height:6px!important;}", ".f64fuq3{width:20px;}", ".f1vfi1yj svg{width:20px!important;}", ".f15s34gz svg{height:20px!important;}", ".f1w9dchk{width:28px;}", ".f14efy9b svg{width:28px!important;}", ".fhipgdu svg{height:28px!important;}"]
67
67
  });
68
68
  /**
69
69
  * Applies style classnames to slots
package/lib/components/PresenceBadge/usePresenceBadgeStyles.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["__resetStyles","__styles","mergeClasses","tokens","presenceBadgeClassNames","root","icon","getIsBusy","status","useRootClassName","useIconClassName","useStyles","statusBusy","sj55zd","statusAway","statusAvailable","statusOffline","statusOutOfOffice","statusUnknown","outOfOffice","outOfOfficeAvailable","outOfOfficeBusy","outOfOfficeUnknown","tiny","Bubjx69","a9b677","B2eet1l","B5pe6w7","p4uzdd","large","extraLarge","d","usePresenceBadgeStyles_unstable","state","rootClassName","iconClassName","styles","isBusy","className","size"],"sources":["usePresenceBadgeStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const presenceBadgeClassNames = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon'\n};\nconst getIsBusy = (status)=>{\n if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {\n return true;\n }\n return false;\n};\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: `var(--449, var(--450, ${tokens.borderRadiusCircular}))`,\n backgroundColor: `var(--451, var(--452, ${tokens.colorNeutralBackground1}))`,\n // The background color bleeds around the edge of the icon due to antialiasing on the svg and element background.\n // Since all presence icons have a border around the edge that is at least 1px wide*, we can inset the background\n // using padding and backgroundClip. The icon has margin: -1px to account for the padding.\n // (* except size=\"tiny\", where backgroundClip is unset)\n padding: '1px',\n backgroundClip: 'content-box'\n});\nconst useIconClassName = makeResetStyles({\n display: 'flex',\n margin: '-1px'\n});\nconst useStyles = makeStyles({\n statusBusy: {\n color: `var(--453, var(--454, ${tokens.colorPaletteRedBackground3}))`\n },\n statusAway: {\n color: `var(--455, var(--456, ${tokens.colorPaletteMarigoldBackground3}))`\n },\n statusAvailable: {\n color: `var(--457, var(--458, ${tokens.colorPaletteLightGreenForeground3}))`\n },\n statusOffline: {\n color: `var(--459, var(--460, ${tokens.colorNeutralForeground3}))`\n },\n statusOutOfOffice: {\n color: `var(--461, var(--462, ${tokens.colorPaletteBerryForeground3}))`\n },\n statusUnknown: {\n color: `var(--463, var(--464, ${tokens.colorNeutralForeground3}))`\n },\n outOfOffice: {\n color: `var(--465, var(--466, ${tokens.colorNeutralBackground1}))`\n },\n outOfOfficeAvailable: {\n color: `var(--467, var(--468, ${tokens.colorPaletteLightGreenForeground3}))`\n },\n outOfOfficeBusy: {\n color: `var(--469, var(--470, ${tokens.colorPaletteRedBackground3}))`\n },\n outOfOfficeUnknown: {\n color: `var(--471, var(--472, ${tokens.colorNeutralForeground3}))`\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 backgroundClip: 'unset',\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 * Applies style classnames to slots\n */ export const usePresenceBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const iconClassName = useIconClassName();\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n 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 === 'out-of-office' || state.status === 'away' || state.status === 'offline') && 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);\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, iconClassName, state.icon.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["__resetStyles","__styles","mergeClasses","tokens","presenceBadgeClassNames","root","icon","getIsBusy","status","useRootClassName","useIconClassName","useStyles","statusBusy","sj55zd","statusAway","statusAvailable","statusOffline","statusOutOfOffice","statusUnknown","outOfOffice","outOfOfficeAvailable","outOfOfficeBusy","outOfOfficeUnknown","tiny","Bubjx69","a9b677","B2eet1l","B5pe6w7","p4uzdd","large","extraLarge","d","usePresenceBadgeStyles_unstable","state","rootClassName","iconClassName","styles","isBusy","className","size"],"sources":["usePresenceBadgeStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const presenceBadgeClassNames = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon'\n};\nconst getIsBusy = (status)=>{\n if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {\n return true;\n }\n return false;\n};\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: tokens.borderRadiusCircular,\n backgroundColor: tokens.colorNeutralBackground1,\n // The background color bleeds around the edge of the icon due to antialiasing on the svg and element background.\n // Since all presence icons have a border around the edge that is at least 1px wide*, we can inset the background\n // using padding and backgroundClip. The icon has margin: -1px to account for the padding.\n // (* except size=\"tiny\", where backgroundClip is unset)\n padding: '1px',\n backgroundClip: 'content-box'\n});\nconst useIconClassName = makeResetStyles({\n display: 'flex',\n margin: '-1px'\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 // 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 backgroundClip: 'unset',\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 * Applies style classnames to slots\n */ export const usePresenceBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const iconClassName = useIconClassName();\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n 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 === 'out-of-office' || state.status === 'away' || state.status === 'offline') && 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);\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, iconClassName, state.icon.className);\n }\n return state;\n};\n"],"mappings":"AAAA,SAAAA,aAAA,EAAAC,QAAA,EAAsCC,YAAY,QAAQ,gBAAgB;AAC1E,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,uBAAuB,GAAG;EACnCC,IAAI,EAAE,mBAAmB;EACzBC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,GAAIC,MAAM,IAAG;EACxB,IAAIA,MAAM,KAAK,MAAM,IAAIA,MAAM,KAAK,gBAAgB,IAAIA,MAAM,KAAK,SAAS,EAAE;IAC1E,OAAO,IAAI;EACf;EACA,OAAO,KAAK;AAChB,CAAC;AACD,MAAMC,gBAAgB,gBAAGT,aAAA,sPAaxB,CAAC;AACF,MAAMU,gBAAgB,gBAAGV,aAAA,2DAGxB,CAAC;AACF,MAAMW,SAAS,gBAAGV,QAAA;EAAAW,UAAA;IAAAC,MAAA;EAAA;EAAAC,UAAA;IAAAD,MAAA;EAAA;EAAAE,eAAA;IAAAF,MAAA;EAAA;EAAAG,aAAA;IAAAH,MAAA;EAAA;EAAAI,iBAAA;IAAAJ,MAAA;EAAA;EAAAK,aAAA;IAAAL,MAAA;EAAA;EAAAM,WAAA;IAAAN,MAAA;EAAA;EAAAO,oBAAA;IAAAP,MAAA;EAAA;EAAAQ,eAAA;IAAAR,MAAA;EAAA;EAAAS,kBAAA;IAAAT,MAAA;EAAA;EAAAU,IAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,KAAA;IAAAL,OAAA;IAAAC,MAAA;IAAAE,OAAA;IAAAC,MAAA;EAAA;EAAAE,UAAA;IAAAN,OAAA;IAAAC,MAAA;IAAAE,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAG,CAAA;AAAA,CA2DjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,+BAA+B,GAAIC,KAAK,IAAG;EACxD,aAAa;;EACb,MAAMC,aAAa,GAAGzB,gBAAgB,CAAC,CAAC;EACxC,MAAM0B,aAAa,GAAGzB,gBAAgB,CAAC,CAAC;EACxC,MAAM0B,MAAM,GAAGzB,SAAS,CAAC,CAAC;EAC1B,MAAM0B,MAAM,GAAG9B,SAAS,CAAC0B,KAAK,CAACzB,MAAM,CAAC;EACtCyB,KAAK,CAAC5B,IAAI,CAACiC,SAAS,GAAGpC,YAAY,CAACE,uBAAuB,CAACC,IAAI,EAAE6B,aAAa,EAAEG,MAAM,IAAID,MAAM,CAACxB,UAAU,EAAEqB,KAAK,CAACzB,MAAM,KAAK,MAAM,IAAI4B,MAAM,CAACtB,UAAU,EAAEmB,KAAK,CAACzB,MAAM,KAAK,WAAW,IAAI4B,MAAM,CAACrB,eAAe,EAAEkB,KAAK,CAACzB,MAAM,KAAK,SAAS,IAAI4B,MAAM,CAACpB,aAAa,EAAEiB,KAAK,CAACzB,MAAM,KAAK,eAAe,IAAI4B,MAAM,CAACnB,iBAAiB,EAAEgB,KAAK,CAACzB,MAAM,KAAK,SAAS,IAAI4B,MAAM,CAAClB,aAAa,EAAEe,KAAK,CAACd,WAAW,IAAIiB,MAAM,CAACjB,WAAW,EAAEc,KAAK,CAACd,WAAW,IAAIc,KAAK,CAACzB,MAAM,KAAK,WAAW,IAAI4B,MAAM,CAAChB,oBAAoB,EAAEa,KAAK,CAACd,WAAW,IAAIkB,MAAM,IAAID,MAAM,CAACf,eAAe,EAAEY,KAAK,CAACd,WAAW,KAAKc,KAAK,CAACzB,MAAM,KAAK,eAAe,IAAIyB,KAAK,CAACzB,MAAM,KAAK,MAAM,IAAIyB,KAAK,CAACzB,MAAM,KAAK,SAAS,CAAC,IAAI4B,MAAM,CAACnB,iBAAiB,EAAEgB,KAAK,CAACd,WAAW,IAAIc,KAAK,CAACzB,MAAM,KAAK,SAAS,IAAI4B,MAAM,CAACd,kBAAkB,EAAEW,KAAK,CAACM,IAAI,KAAK,MAAM,IAAIH,MAAM,CAACb,IAAI,EAAEU,KAAK,CAACM,IAAI,KAAK,OAAO,IAAIH,MAAM,CAACP,KAAK,EAAEI,KAAK,CAACM,IAAI,KAAK,aAAa,IAAIH,MAAM,CAACN,UAAU,EAAEG,KAAK,CAAC5B,IAAI,CAACiC,SAAS,CAAC;EAC95B,IAAIL,KAAK,CAAC3B,IAAI,EAAE;IACZ2B,KAAK,CAAC3B,IAAI,CAACgC,SAAS,GAAGpC,YAAY,CAACE,uBAAuB,CAACE,IAAI,EAAE6B,aAAa,EAAEF,KAAK,CAAC3B,IAAI,CAACgC,SAAS,CAAC;EAC1G;EACA,OAAOL,KAAK;AAChB,CAAC","ignoreList":[]}
package/lib-commonjs/components/Badge/useBadgeStyles.styles.js CHANGED
@@ -25,11 +25,11 @@ const badgeClassNames = {
25
25
  // The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.
26
26
  // Instead, add extra padding to the root, and a negative margin on the icon to "remove" the extra padding on the icon.
27
27
  const textPadding = _reacttheme.tokens.spacingHorizontalXXS;
28
- const useRootClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r10nfv4h", "ruauajt", [
29
- ".r10nfv4h{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;position:relative;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);height:20px;width:20px;min-width:max-content;padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));border-radius:var(--341, var(--342, var(--borderRadiusCircular)));border-color:var(--343, var(--344, var(--colorTransparentStroke)));}",
30
- ".r10nfv4h::after{content:\"\";position:absolute;top:0;left:0;bottom:0;right:0;border-style:solid;border-color:inherit;border-width:var(--345, var(--346, var(--strokeWidthThin)));border-radius:inherit;}",
31
- ".ruauajt{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;position:relative;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);height:20px;width:20px;min-width:max-content;padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));border-radius:var(--341, var(--342, var(--borderRadiusCircular)));border-color:var(--343, var(--344, var(--colorTransparentStroke)));}",
32
- ".ruauajt::after{content:\"\";position:absolute;top:0;right:0;bottom:0;left:0;border-style:solid;border-color:inherit;border-width:var(--345, var(--346, var(--strokeWidthThin)));border-radius:inherit;}"
28
+ const useRootClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r1l7mb74", "rntuq2r", [
29
+ ".r1l7mb74{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;position:relative;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);height:20px;width:20px;min-width:max-content;padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));border-radius:var(--borderRadiusCircular);border-color:var(--colorTransparentStroke);}",
30
+ ".r1l7mb74::after{content:\"\";position:absolute;top:0;left:0;bottom:0;right:0;border-style:solid;border-color:inherit;border-width:var(--strokeWidthThin);border-radius:inherit;}",
31
+ ".rntuq2r{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;position:relative;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);height:20px;width:20px;min-width:max-content;padding:0 calc(var(--spacingHorizontalXS) + var(--spacingHorizontalXXS));border-radius:var(--borderRadiusCircular);border-color:var(--colorTransparentStroke);}",
32
+ ".rntuq2r::after{content:\"\";position:absolute;top:0;right:0;bottom:0;left:0;border-style:solid;border-color:inherit;border-width:var(--strokeWidthThin);border-radius:inherit;}"
33
33
  ]);
34
34
  const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
35
35
  fontSmallToTiny: {
@@ -95,21 +95,21 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
95
95
  Bbmb7ep: 0,
96
96
  Btl43ni: 0,
97
97
  B7oj6ja: 0,
98
- Dimara: "fai50ut"
98
+ Dimara: "f1fabniw"
99
99
  },
100
100
  rounded: {
101
101
  Beyfa6y: 0,
102
102
  Bbmb7ep: 0,
103
103
  Btl43ni: 0,
104
104
  B7oj6ja: 0,
105
- Dimara: "f1e5tea3"
105
+ Dimara: "ft85np5"
106
106
  },
107
107
  roundedSmallToTiny: {
108
108
  Beyfa6y: 0,
109
109
  Bbmb7ep: 0,
110
110
  Btl43ni: 0,
111
111
  B7oj6ja: 0,
112
- Dimara: "f1mplvw1"
112
+ Dimara: "fq9zq91"
113
113
  },
114
114
  circular: {},
115
115
  borderGhost: {
@@ -117,61 +117,61 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
117
117
  },
118
118
  filled: {},
119
119
  "filled-brand": {
120
- De3pzq: "f19hwuml",
121
- sj55zd: "f7ou5un"
120
+ De3pzq: "ffp7eso",
121
+ sj55zd: "f1phragk"
122
122
  },
123
123
  "filled-danger": {
124
- De3pzq: "frr1ynz",
125
- sj55zd: "fs397sr"
124
+ De3pzq: "fdl5y0r",
125
+ sj55zd: "f1phragk"
126
126
  },
127
127
  "filled-important": {
128
- De3pzq: "f1vkul9e",
129
- sj55zd: "f10deorr"
128
+ De3pzq: "f1c73kur",
129
+ sj55zd: "fr0bkrk"
130
130
  },
131
131
  "filled-informative": {
132
- De3pzq: "f12mr7aq",
133
- sj55zd: "fc1lalz"
132
+ De3pzq: "f3vzo32",
133
+ sj55zd: "f11d4kpn"
134
134
  },
135
135
  "filled-severe": {
136
- De3pzq: "fso1mzb",
137
- sj55zd: "f1apyimk"
136
+ De3pzq: "f1s438gw",
137
+ sj55zd: "f1phragk"
138
138
  },
139
139
  "filled-subtle": {
140
- De3pzq: "f1570tmq",
141
- sj55zd: "f1ih66gz"
140
+ De3pzq: "fxugw4r",
141
+ sj55zd: "f19n0e5"
142
142
  },
143
143
  "filled-success": {
144
- De3pzq: "f1xvu00u",
145
- sj55zd: "f1a2a3s"
144
+ De3pzq: "flxk52p",
145
+ sj55zd: "f1phragk"
146
146
  },
147
147
  "filled-warning": {
148
- De3pzq: "fopv15x",
149
- sj55zd: "fyehek6"
148
+ De3pzq: "ffq97bm",
149
+ sj55zd: "ff5vbop"
150
150
  },
151
151
  ghost: {},
152
152
  "ghost-brand": {
153
- sj55zd: "fapxi05"
153
+ sj55zd: "f16muhyy"
154
154
  },
155
155
  "ghost-danger": {
156
- sj55zd: "fr2bi5m"
156
+ sj55zd: "f1whyuy6"
157
157
  },
158
158
  "ghost-important": {
159
- sj55zd: "fkcwhv5"
159
+ sj55zd: "f19n0e5"
160
160
  },
161
161
  "ghost-informative": {
162
- sj55zd: "f1m2rgkd"
162
+ sj55zd: "f11d4kpn"
163
163
  },
164
164
  "ghost-severe": {
165
- sj55zd: "f9r2fi"
165
+ sj55zd: "f1l8vj45"
166
166
  },
167
167
  "ghost-subtle": {
168
- sj55zd: "f18ujb"
168
+ sj55zd: "fonrgv7"
169
169
  },
170
170
  "ghost-success": {
171
- sj55zd: "f1ip27zr"
171
+ sj55zd: "f1m7fhi8"
172
172
  },
173
173
  "ghost-warning": {
174
- sj55zd: "f1g3245m"
174
+ sj55zd: "fpti2h4"
175
175
  },
176
176
  outline: {
177
177
  g2u3we: "f23ftbb",
@@ -186,10 +186,10 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
186
186
  ]
187
187
  },
188
188
  "outline-brand": {
189
- sj55zd: "f18fr6fe"
189
+ sj55zd: "f16muhyy"
190
190
  },
191
191
  "outline-danger": {
192
- sj55zd: "febqro7",
192
+ sj55zd: "f1whyuy6",
193
193
  g2u3we: "fyqpifd",
194
194
  h3c5rm: [
195
195
  "f3ukxca",
@@ -202,7 +202,7 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
202
202
  ]
203
203
  },
204
204
  "outline-important": {
205
- sj55zd: "ffs1hx6",
205
+ sj55zd: "f11d4kpn",
206
206
  g2u3we: "fq0vr37",
207
207
  h3c5rm: [
208
208
  "f1byw159",
@@ -215,7 +215,7 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
215
215
  ]
216
216
  },
217
217
  "outline-informative": {
218
- sj55zd: "f13yqyjw",
218
+ sj55zd: "f11d4kpn",
219
219
  g2u3we: "f68mrw8",
220
220
  h3c5rm: [
221
221
  "f7pw515",
@@ -228,13 +228,13 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
228
228
  ]
229
229
  },
230
230
  "outline-severe": {
231
- sj55zd: "f1ckjb0u"
231
+ sj55zd: "f1l8vj45"
232
232
  },
233
233
  "outline-subtle": {
234
- sj55zd: "f12iazmu"
234
+ sj55zd: "fonrgv7"
235
235
  },
236
236
  "outline-success": {
237
- sj55zd: "f1sja6nl",
237
+ sj55zd: "f1m7fhi8",
238
238
  g2u3we: "f1mmhl11",
239
239
  h3c5rm: [
240
240
  "f1tjpp2f",
@@ -247,12 +247,12 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
247
247
  ]
248
248
  },
249
249
  "outline-warning": {
250
- sj55zd: "f867xiw"
250
+ sj55zd: "fpti2h4"
251
251
  },
252
252
  tint: {},
253
253
  "tint-brand": {
254
- De3pzq: "f146wntt",
255
- sj55zd: "f1bfvynb",
254
+ De3pzq: "f16xkysk",
255
+ sj55zd: "faj9fo0",
256
256
  g2u3we: "f161y7kd",
257
257
  h3c5rm: [
258
258
  "f1c8dzaj",
@@ -265,8 +265,8 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
265
265
  ]
266
266
  },
267
267
  "tint-danger": {
268
- De3pzq: "f1j7js5g",
269
- sj55zd: "f88p1ow",
268
+ De3pzq: "ff0poqj",
269
+ sj55zd: "f1hcrxcs",
270
270
  g2u3we: "f1oqjm8o",
271
271
  h3c5rm: [
272
272
  "fkgrb8g",
@@ -279,8 +279,8 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
279
279
  ]
280
280
  },
281
281
  "tint-important": {
282
- De3pzq: "fevsi08",
283
- sj55zd: "foodvkd",
282
+ De3pzq: "f945g0u",
283
+ sj55zd: "fr0bkrk",
284
284
  g2u3we: "fghlq4f",
285
285
  h3c5rm: [
286
286
  "f1gn591s",
@@ -293,8 +293,8 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
293
293
  ]
294
294
  },
295
295
  "tint-informative": {
296
- De3pzq: "f13o4ny3",
297
- sj55zd: "f1kyw6sm",
296
+ De3pzq: "f1ctqxl6",
297
+ sj55zd: "f11d4kpn",
298
298
  g2u3we: "f68mrw8",
299
299
  h3c5rm: [
300
300
  "f7pw515",
@@ -307,8 +307,8 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
307
307
  ]
308
308
  },
309
309
  "tint-severe": {
310
- De3pzq: "fdxi31b",
311
- sj55zd: "f1le075t",
310
+ De3pzq: "f1xzsg4",
311
+ sj55zd: "f1k5f75o",
312
312
  g2u3we: "fxy9dsj",
313
313
  h3c5rm: [
314
314
  "f54u6j2",
@@ -321,8 +321,8 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
321
321
  ]
322
322
  },
323
323
  "tint-subtle": {
324
- De3pzq: "f1f72teq",
325
- sj55zd: "f76hxaz",
324
+ De3pzq: "fxugw4r",
325
+ sj55zd: "f11d4kpn",
326
326
  g2u3we: "f68mrw8",
327
327
  h3c5rm: [
328
328
  "f7pw515",
@@ -335,8 +335,8 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
335
335
  ]
336
336
  },
337
337
  "tint-success": {
338
- De3pzq: "f1xeb5ba",
339
- sj55zd: "f17js1cg",
338
+ De3pzq: "f2vsrz6",
339
+ sj55zd: "ffmvakt",
340
340
  g2u3we: "fdmic9h",
341
341
  h3c5rm: [
342
342
  "f196y6m",
@@ -349,8 +349,8 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
349
349
  ]
350
350
  },
351
351
  "tint-warning": {
352
- De3pzq: "f1wkb02k",
353
- sj55zd: "f5u1fiz",
352
+ De3pzq: "f10s6hli",
353
+ sj55zd: "f42v8de",
354
354
  g2u3we: "fn9i3n",
355
355
  h3c5rm: [
356
356
  "f1aw8cx4",
@@ -414,112 +414,95 @@ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
414
414
  }
415
415
  ],
416
416
  [
417
- ".fai50ut{border-radius:var(--347, var(--348, var(--borderRadiusNone)));}",
417
+ ".f1fabniw{border-radius:var(--borderRadiusNone);}",
418
418
  {
419
419
  p: -1
420
420
  }
421
421
  ],
422
422
  [
423
- ".f1e5tea3{border-radius:var(--349, var(--350, var(--borderRadiusMedium)));}",
423
+ ".ft85np5{border-radius:var(--borderRadiusMedium);}",
424
424
  {
425
425
  p: -1
426
426
  }
427
427
  ],
428
428
  [
429
- ".f1mplvw1{border-radius:var(--351, var(--352, var(--borderRadiusSmall)));}",
429
+ ".fq9zq91{border-radius:var(--borderRadiusSmall);}",
430
430
  {
431
431
  p: -1
432
432
  }
433
433
  ],
434
434
  ".f10ludwy::after{display:none;}",
435
- ".f19hwuml{background-color:var(--353, var(--354, var(--colorBrandBackground)));}",
436
- ".f7ou5un{color:var(--355, var(--356, var(--colorNeutralForegroundOnBrand)));}",
437
- ".frr1ynz{background-color:var(--357, var(--358, var(--colorPaletteRedBackground3)));}",
438
- ".fs397sr{color:var(--359, var(--360, var(--colorNeutralForegroundOnBrand)));}",
439
- ".f1vkul9e{background-color:var(--361, var(--362, var(--colorNeutralForeground1)));}",
440
- ".f10deorr{color:var(--363, var(--364, var(--colorNeutralBackground1)));}",
441
- ".f12mr7aq{background-color:var(--365, var(--366, var(--colorNeutralBackground5)));}",
442
- ".fc1lalz{color:var(--367, var(--368, var(--colorNeutralForeground3)));}",
443
- ".fso1mzb{background-color:var(--369, var(--370, var(--colorPaletteDarkOrangeBackground3)));}",
444
- ".f1apyimk{color:var(--371, var(--372, var(--colorNeutralForegroundOnBrand)));}",
445
- ".f1570tmq{background-color:var(--373, var(--374, var(--colorNeutralBackground1)));}",
446
- ".f1ih66gz{color:var(--375, var(--376, var(--colorNeutralForeground1)));}",
447
- ".f1xvu00u{background-color:var(--377, var(--378, var(--colorPaletteGreenBackground3)));}",
448
- ".f1a2a3s{color:var(--379, var(--380, var(--colorNeutralForegroundOnBrand)));}",
449
- ".fopv15x{background-color:var(--381, var(--382, var(--colorPaletteYellowBackground3)));}",
450
- ".fyehek6{color:var(--383, var(--384, var(--colorNeutralForeground1Static)));}",
451
- ".fapxi05{color:var(--385, var(--386, var(--colorBrandForeground1)));}",
452
- ".fr2bi5m{color:var(--387, var(--388, var(--colorPaletteRedForeground3)));}",
453
- ".fkcwhv5{color:var(--389, var(--390, var(--colorNeutralForeground1)));}",
454
- ".f1m2rgkd{color:var(--391, var(--392, var(--colorNeutralForeground3)));}",
455
- ".f9r2fi{color:var(--393, var(--394, var(--colorPaletteDarkOrangeForeground3)));}",
456
- ".f18ujb{color:var(--395, var(--396, var(--colorNeutralForegroundStaticInverted)));}",
457
- ".f1ip27zr{color:var(--397, var(--398, var(--colorPaletteGreenForeground3)));}",
458
- ".f1g3245m{color:var(--399, var(--400, var(--colorPaletteYellowForeground2)));}",
435
+ ".ffp7eso{background-color:var(--colorBrandBackground);}",
436
+ ".f1phragk{color:var(--colorNeutralForegroundOnBrand);}",
437
+ ".fdl5y0r{background-color:var(--colorPaletteRedBackground3);}",
438
+ ".f1c73kur{background-color:var(--colorNeutralForeground1);}",
439
+ ".fr0bkrk{color:var(--colorNeutralBackground1);}",
440
+ ".f3vzo32{background-color:var(--colorNeutralBackground5);}",
441
+ ".f11d4kpn{color:var(--colorNeutralForeground3);}",
442
+ ".f1s438gw{background-color:var(--colorPaletteDarkOrangeBackground3);}",
443
+ ".fxugw4r{background-color:var(--colorNeutralBackground1);}",
444
+ ".f19n0e5{color:var(--colorNeutralForeground1);}",
445
+ ".flxk52p{background-color:var(--colorPaletteGreenBackground3);}",
446
+ ".ffq97bm{background-color:var(--colorPaletteYellowBackground3);}",
447
+ ".ff5vbop{color:var(--colorNeutralForeground1Static);}",
448
+ ".f16muhyy{color:var(--colorBrandForeground1);}",
449
+ ".f1whyuy6{color:var(--colorPaletteRedForeground3);}",
450
+ ".f1l8vj45{color:var(--colorPaletteDarkOrangeForeground3);}",
451
+ ".fonrgv7{color:var(--colorNeutralForegroundStaticInverted);}",
452
+ ".f1m7fhi8{color:var(--colorPaletteGreenForeground3);}",
453
+ ".fpti2h4{color:var(--colorPaletteYellowForeground2);}",
459
454
  ".f23ftbb{border-top-color:currentColor;}",
460
455
  ".f1gkuv52{border-right-color:currentColor;}",
461
456
  ".f1p1bl80{border-left-color:currentColor;}",
462
457
  ".fioka3i{border-bottom-color:currentColor;}",
463
- ".f18fr6fe{color:var(--401, var(--402, var(--colorBrandForeground1)));}",
464
- ".febqro7{color:var(--403, var(--404, var(--colorPaletteRedForeground3)));}",
465
458
  ".fyqpifd{border-top-color:var(--colorPaletteRedBorder2);}",
466
459
  ".f3ukxca{border-right-color:var(--colorPaletteRedBorder2);}",
467
460
  ".f1k7dugc{border-left-color:var(--colorPaletteRedBorder2);}",
468
461
  ".f1njxb2b{border-bottom-color:var(--colorPaletteRedBorder2);}",
469
- ".ffs1hx6{color:var(--405, var(--406, var(--colorNeutralForeground3)));}",
470
462
  ".fq0vr37{border-top-color:var(--colorNeutralStrokeAccessible);}",
471
463
  ".f1byw159{border-right-color:var(--colorNeutralStrokeAccessible);}",
472
464
  ".f11cr0be{border-left-color:var(--colorNeutralStrokeAccessible);}",
473
465
  ".f1c1zstj{border-bottom-color:var(--colorNeutralStrokeAccessible);}",
474
- ".f13yqyjw{color:var(--407, var(--408, var(--colorNeutralForeground3)));}",
475
466
  ".f68mrw8{border-top-color:var(--colorNeutralStroke2);}",
476
467
  ".f7pw515{border-right-color:var(--colorNeutralStroke2);}",
477
468
  ".fw35ms5{border-left-color:var(--colorNeutralStroke2);}",
478
469
  ".frpde29{border-bottom-color:var(--colorNeutralStroke2);}",
479
- ".f1ckjb0u{color:var(--409, var(--410, var(--colorPaletteDarkOrangeForeground3)));}",
480
- ".f12iazmu{color:var(--411, var(--412, var(--colorNeutralForegroundStaticInverted)));}",
481
- ".f1sja6nl{color:var(--413, var(--414, var(--colorPaletteGreenForeground3)));}",
482
470
  ".f1mmhl11{border-top-color:var(--colorPaletteGreenBorder2);}",
483
471
  ".f1tjpp2f{border-right-color:var(--colorPaletteGreenBorder2);}",
484
472
  ".f1ocn5n7{border-left-color:var(--colorPaletteGreenBorder2);}",
485
473
  ".f1gjv25d{border-bottom-color:var(--colorPaletteGreenBorder2);}",
486
- ".f867xiw{color:var(--415, var(--416, var(--colorPaletteYellowForeground2)));}",
487
- ".f146wntt{background-color:var(--417, var(--418, var(--colorBrandBackground2)));}",
488
- ".f1bfvynb{color:var(--419, var(--420, var(--colorBrandForeground2)));}",
474
+ ".f16xkysk{background-color:var(--colorBrandBackground2);}",
475
+ ".faj9fo0{color:var(--colorBrandForeground2);}",
489
476
  ".f161y7kd{border-top-color:var(--colorBrandStroke2);}",
490
477
  ".f1c8dzaj{border-right-color:var(--colorBrandStroke2);}",
491
478
  ".f1sl6hi9{border-left-color:var(--colorBrandStroke2);}",
492
479
  ".f1619yhw{border-bottom-color:var(--colorBrandStroke2);}",
493
- ".f1j7js5g{background-color:var(--421, var(--422, var(--colorPaletteRedBackground1)));}",
494
- ".f88p1ow{color:var(--423, var(--424, var(--colorPaletteRedForeground1)));}",
480
+ ".ff0poqj{background-color:var(--colorPaletteRedBackground1);}",
481
+ ".f1hcrxcs{color:var(--colorPaletteRedForeground1);}",
495
482
  ".f1oqjm8o{border-top-color:var(--colorPaletteRedBorder1);}",
496
483
  ".fkgrb8g{border-right-color:var(--colorPaletteRedBorder1);}",
497
484
  ".frb5wm0{border-left-color:var(--colorPaletteRedBorder1);}",
498
485
  ".f1iai1ph{border-bottom-color:var(--colorPaletteRedBorder1);}",
499
- ".fevsi08{background-color:var(--425, var(--426, var(--colorNeutralForeground3)));}",
500
- ".foodvkd{color:var(--427, var(--428, var(--colorNeutralBackground1)));}",
486
+ ".f945g0u{background-color:var(--colorNeutralForeground3);}",
501
487
  ".fghlq4f{border-top-color:var(--colorTransparentStroke);}",
502
488
  ".f1gn591s{border-right-color:var(--colorTransparentStroke);}",
503
489
  ".fjscplz{border-left-color:var(--colorTransparentStroke);}",
504
490
  ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}",
505
- ".f13o4ny3{background-color:var(--429, var(--430, var(--colorNeutralBackground4)));}",
506
- ".f1kyw6sm{color:var(--431, var(--432, var(--colorNeutralForeground3)));}",
507
- ".fdxi31b{background-color:var(--433, var(--434, var(--colorPaletteDarkOrangeBackground1)));}",
508
- ".f1le075t{color:var(--435, var(--436, var(--colorPaletteDarkOrangeForeground1)));}",
491
+ ".f1ctqxl6{background-color:var(--colorNeutralBackground4);}",
492
+ ".f1xzsg4{background-color:var(--colorPaletteDarkOrangeBackground1);}",
493
+ ".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}",
509
494
  ".fxy9dsj{border-top-color:var(--colorPaletteDarkOrangeBorder1);}",
510
495
  ".f54u6j2{border-right-color:var(--colorPaletteDarkOrangeBorder1);}",
511
496
  ".fcm23ze{border-left-color:var(--colorPaletteDarkOrangeBorder1);}",
512
497
  ".f4vf0uq{border-bottom-color:var(--colorPaletteDarkOrangeBorder1);}",
513
- ".f1f72teq{background-color:var(--437, var(--438, var(--colorNeutralBackground1)));}",
514
- ".f76hxaz{color:var(--439, var(--440, var(--colorNeutralForeground3)));}",
515
- ".f1xeb5ba{background-color:var(--441, var(--442, var(--colorPaletteGreenBackground1)));}",
516
- ".f17js1cg{color:var(--443, var(--444, var(--colorPaletteGreenForeground1)));}",
498
+ ".f2vsrz6{background-color:var(--colorPaletteGreenBackground1);}",
499
+ ".ffmvakt{color:var(--colorPaletteGreenForeground1);}",
517
500
  ".fdmic9h{border-top-color:var(--colorPaletteGreenBorder1);}",
518
501
  ".f196y6m{border-right-color:var(--colorPaletteGreenBorder1);}",
519
502
  ".fetptd8{border-left-color:var(--colorPaletteGreenBorder1);}",
520
503
  ".f1pev5xq{border-bottom-color:var(--colorPaletteGreenBorder1);}",
521
- ".f1wkb02k{background-color:var(--445, var(--446, var(--colorPaletteYellowBackground1)));}",
522
- ".f5u1fiz{color:var(--447, var(--448, var(--colorPaletteYellowForeground1)));}",
504
+ ".f10s6hli{background-color:var(--colorPaletteYellowBackground1);}",
505
+ ".f42v8de{color:var(--colorPaletteYellowForeground1);}",
523
506
  ".fn9i3n{border-top-color:var(--colorPaletteYellowBorder1);}",
524
507
  ".f1aw8cx4{border-right-color:var(--colorPaletteYellowBorder1);}",
525
508
  ".f51if14{border-left-color:var(--colorPaletteYellowBorder1);}",
package/lib-commonjs/components/Badge/useBadgeStyles.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["useBadgeStyles.styles.js"],"sourcesContent":["import { shorthands, makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const badgeClassNames = {\n root: 'fui-Badge',\n icon: 'fui-Badge__icon'\n};\n// The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.\n// Instead, add extra padding to the root, and a negative margin on the icon to \"remove\" the extra padding on the icon.\nconst textPadding = tokens.spacingHorizontalXXS;\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n ...typographyStyles.caption1Strong,\n height: '20px',\n width: '20px',\n minWidth: 'max-content',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n borderRadius: `var(--341, var(--342, ${tokens.borderRadiusCircular}))`,\n // Use a transparent stroke (rather than no border) so the border is visible in high contrast\n borderColor: `var(--343, var(--344, ${tokens.colorTransparentStroke}))`,\n '::after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n borderStyle: 'solid',\n borderColor: 'inherit',\n borderWidth: `var(--345, var(--346, ${tokens.strokeWidthThin}))`,\n borderRadius: 'inherit'\n }\n});\nconst useRootStyles = makeStyles({\n fontSmallToTiny: {\n ...typographyStyles.caption2Strong\n },\n // size\n tiny: {\n width: '6px',\n height: '6px',\n fontSize: '4px',\n lineHeight: '4px',\n minWidth: 'unset',\n padding: 'unset'\n },\n 'extra-small': {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n lineHeight: '6px',\n minWidth: 'unset',\n padding: 'unset'\n },\n small: {\n width: '16px',\n height: '16px',\n padding: `0 calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n medium: {\n },\n large: {\n width: '24px',\n height: '24px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n 'extra-large': {\n width: '32px',\n height: '32px',\n padding: `0 calc(${tokens.spacingHorizontalSNudge} + ${textPadding})`\n },\n // shape\n square: {\n borderRadius: `var(--347, var(--348, ${tokens.borderRadiusNone}))`\n },\n rounded: {\n borderRadius: `var(--349, var(--350, ${tokens.borderRadiusMedium}))`\n },\n roundedSmallToTiny: {\n borderRadius: `var(--351, var(--352, ${tokens.borderRadiusSmall}))`\n },\n circular: {\n },\n // hide the boder when appearance is \"ghost\"\n borderGhost: {\n // The border is applied in an ::after pseudo-element because it should not affect layout.\n // The padding and size of the badge should be the same regardless of whether or not it has a border.\n '::after': {\n display: 'none'\n }\n },\n // appearance: filled\n filled: {\n },\n 'filled-brand': {\n backgroundColor: `var(--353, var(--354, ${tokens.colorBrandBackground}))`,\n color: `var(--355, var(--356, ${tokens.colorNeutralForegroundOnBrand}))`\n },\n 'filled-danger': {\n backgroundColor: `var(--357, var(--358, ${tokens.colorPaletteRedBackground3}))`,\n color: `var(--359, var(--360, ${tokens.colorNeutralForegroundOnBrand}))`\n },\n 'filled-important': {\n backgroundColor: `var(--361, var(--362, ${tokens.colorNeutralForeground1}))`,\n color: `var(--363, var(--364, ${tokens.colorNeutralBackground1}))`\n },\n 'filled-informative': {\n backgroundColor: `var(--365, var(--366, ${tokens.colorNeutralBackground5}))`,\n color: `var(--367, var(--368, ${tokens.colorNeutralForeground3}))`\n },\n 'filled-severe': {\n backgroundColor: `var(--369, var(--370, ${tokens.colorPaletteDarkOrangeBackground3}))`,\n color: `var(--371, var(--372, ${tokens.colorNeutralForegroundOnBrand}))`\n },\n 'filled-subtle': {\n backgroundColor: `var(--373, var(--374, ${tokens.colorNeutralBackground1}))`,\n color: `var(--375, var(--376, ${tokens.colorNeutralForeground1}))`\n },\n 'filled-success': {\n backgroundColor: `var(--377, var(--378, ${tokens.colorPaletteGreenBackground3}))`,\n color: `var(--379, var(--380, ${tokens.colorNeutralForegroundOnBrand}))`\n },\n 'filled-warning': {\n backgroundColor: `var(--381, var(--382, ${tokens.colorPaletteYellowBackground3}))`,\n color: `var(--383, var(--384, ${tokens.colorNeutralForeground1Static}))`\n },\n // appearance: ghost\n ghost: {\n },\n 'ghost-brand': {\n color: `var(--385, var(--386, ${tokens.colorBrandForeground1}))`\n },\n 'ghost-danger': {\n color: `var(--387, var(--388, ${tokens.colorPaletteRedForeground3}))`\n },\n 'ghost-important': {\n color: `var(--389, var(--390, ${tokens.colorNeutralForeground1}))`\n },\n 'ghost-informative': {\n color: `var(--391, var(--392, ${tokens.colorNeutralForeground3}))`\n },\n 'ghost-severe': {\n color: `var(--393, var(--394, ${tokens.colorPaletteDarkOrangeForeground3}))`\n },\n 'ghost-subtle': {\n color: `var(--395, var(--396, ${tokens.colorNeutralForegroundStaticInverted}))`\n },\n 'ghost-success': {\n color: `var(--397, var(--398, ${tokens.colorPaletteGreenForeground3}))`\n },\n 'ghost-warning': {\n color: `var(--399, var(--400, ${tokens.colorPaletteYellowForeground2}))`\n },\n // appearance: outline\n outline: {\n ...shorthands.borderColor('currentColor')\n },\n 'outline-brand': {\n color: `var(--401, var(--402, ${tokens.colorBrandForeground1}))`\n },\n 'outline-danger': {\n color: `var(--403, var(--404, ${tokens.colorPaletteRedForeground3}))`,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n },\n 'outline-important': {\n color: `var(--405, var(--406, ${tokens.colorNeutralForeground3}))`,\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible)\n },\n 'outline-informative': {\n color: `var(--407, var(--408, ${tokens.colorNeutralForeground3}))`,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'outline-severe': {\n color: `var(--409, var(--410, ${tokens.colorPaletteDarkOrangeForeground3}))`\n },\n 'outline-subtle': {\n color: `var(--411, var(--412, ${tokens.colorNeutralForegroundStaticInverted}))`\n },\n 'outline-success': {\n color: `var(--413, var(--414, ${tokens.colorPaletteGreenForeground3}))`,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder2)\n },\n 'outline-warning': {\n color: `var(--415, var(--416, ${tokens.colorPaletteYellowForeground2}))`\n },\n // appearance: tint\n tint: {\n },\n 'tint-brand': {\n backgroundColor: `var(--417, var(--418, ${tokens.colorBrandBackground2}))`,\n color: `var(--419, var(--420, ${tokens.colorBrandForeground2}))`,\n ...shorthands.borderColor(tokens.colorBrandStroke2)\n },\n 'tint-danger': {\n backgroundColor: `var(--421, var(--422, ${tokens.colorPaletteRedBackground1}))`,\n color: `var(--423, var(--424, ${tokens.colorPaletteRedForeground1}))`,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder1)\n },\n 'tint-important': {\n backgroundColor: `var(--425, var(--426, ${tokens.colorNeutralForeground3}))`,\n color: `var(--427, var(--428, ${tokens.colorNeutralBackground1}))`,\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n 'tint-informative': {\n backgroundColor: `var(--429, var(--430, ${tokens.colorNeutralBackground4}))`,\n color: `var(--431, var(--432, ${tokens.colorNeutralForeground3}))`,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-severe': {\n backgroundColor: `var(--433, var(--434, ${tokens.colorPaletteDarkOrangeBackground1}))`,\n color: `var(--435, var(--436, ${tokens.colorPaletteDarkOrangeForeground1}))`,\n ...shorthands.borderColor(tokens.colorPaletteDarkOrangeBorder1)\n },\n 'tint-subtle': {\n backgroundColor: `var(--437, var(--438, ${tokens.colorNeutralBackground1}))`,\n color: `var(--439, var(--440, ${tokens.colorNeutralForeground3}))`,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-success': {\n backgroundColor: `var(--441, var(--442, ${tokens.colorPaletteGreenBackground1}))`,\n color: `var(--443, var(--444, ${tokens.colorPaletteGreenForeground1}))`,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder1)\n },\n 'tint-warning': {\n backgroundColor: `var(--445, var(--446, ${tokens.colorPaletteYellowBackground1}))`,\n color: `var(--447, var(--448, ${tokens.colorPaletteYellowForeground1}))`,\n ...shorthands.borderColor(tokens.colorPaletteYellowBorder1)\n }\n});\nconst useIconRootClassName = makeResetStyles({\n display: 'flex',\n lineHeight: '1',\n margin: `0 calc(-1 * ${textPadding})`,\n fontSize: '12px'\n});\nconst useIconStyles = makeStyles({\n beforeText: {\n marginRight: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n afterText: {\n marginLeft: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n beforeTextXL: {\n marginRight: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n afterTextXL: {\n marginLeft: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n // size\n tiny: {\n fontSize: '6px'\n },\n 'extra-small': {\n fontSize: '10px'\n },\n small: {\n fontSize: '12px'\n },\n medium: {\n },\n large: {\n fontSize: '16px'\n },\n 'extra-large': {\n fontSize: '20px'\n }\n});\n/**\n * Applies style classnames to slots\n */ export const useBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const rootStyles = useRootStyles();\n const smallToTiny = state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny';\n state.root.className = mergeClasses(badgeClassNames.root, rootClassName, smallToTiny && rootStyles.fontSmallToTiny, rootStyles[state.size], rootStyles[state.shape], state.shape === 'rounded' && smallToTiny && rootStyles.roundedSmallToTiny, state.appearance === 'ghost' && rootStyles.borderGhost, rootStyles[state.appearance], rootStyles[`${state.appearance}-${state.color}`], state.root.className);\n const iconRootClassName = useIconRootClassName();\n const iconStyles = useIconStyles();\n if (state.icon) {\n let iconPositionClass;\n if (state.root.children) {\n if (state.size === 'extra-large') {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterTextXL : iconStyles.beforeTextXL;\n } else {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterText : iconStyles.beforeText;\n }\n }\n state.icon.className = mergeClasses(badgeClassNames.icon, iconRootClassName, iconPositionClass, iconStyles[state.size], state.icon.className);\n }\n return state;\n};\n"],"names":["badgeClassNames","useBadgeStyles_unstable","root","icon","textPadding","tokens","spacingHorizontalXXS","useRootClassName","__resetStyles","useRootStyles","__styles","fontSmallToTiny","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","tiny","a9b677","Bqenvij","Bf4jedk","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","small","medium","large","square","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","rounded","roundedSmallToTiny","circular","borderGhost","ap17g6","filled","De3pzq","sj55zd","ghost","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","tint","d","p","useIconRootClassName","useIconStyles","beforeText","t21cq0","afterText","Frg6f3","beforeTextXL","afterTextXL","state","rootClassName","rootStyles","smallToTiny","size","className","mergeClasses","shape","appearance","color","iconRootClassName","iconStyles","iconPositionClass","children","iconPosition"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["useBadgeStyles.styles.js"],"sourcesContent":["import { shorthands, makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const badgeClassNames = {\n root: 'fui-Badge',\n icon: 'fui-Badge__icon'\n};\n// The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.\n// Instead, add extra padding to the root, and a negative margin on the icon to \"remove\" the extra padding on the icon.\nconst textPadding = tokens.spacingHorizontalXXS;\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n ...typographyStyles.caption1Strong,\n height: '20px',\n width: '20px',\n minWidth: 'max-content',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n borderRadius: tokens.borderRadiusCircular,\n // Use a transparent stroke (rather than no border) so the border is visible in high contrast\n borderColor: tokens.colorTransparentStroke,\n '::after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n borderStyle: 'solid',\n borderColor: 'inherit',\n borderWidth: tokens.strokeWidthThin,\n borderRadius: 'inherit'\n }\n});\nconst useRootStyles = makeStyles({\n fontSmallToTiny: {\n ...typographyStyles.caption2Strong\n },\n // size\n tiny: {\n width: '6px',\n height: '6px',\n fontSize: '4px',\n lineHeight: '4px',\n minWidth: 'unset',\n padding: 'unset'\n },\n 'extra-small': {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n lineHeight: '6px',\n minWidth: 'unset',\n padding: 'unset'\n },\n small: {\n width: '16px',\n height: '16px',\n padding: `0 calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n medium: {\n },\n large: {\n width: '24px',\n height: '24px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n 'extra-large': {\n width: '32px',\n height: '32px',\n padding: `0 calc(${tokens.spacingHorizontalSNudge} + ${textPadding})`\n },\n // shape\n square: {\n borderRadius: tokens.borderRadiusNone\n },\n rounded: {\n borderRadius: tokens.borderRadiusMedium\n },\n roundedSmallToTiny: {\n borderRadius: tokens.borderRadiusSmall\n },\n circular: {\n },\n // hide the boder when appearance is \"ghost\"\n borderGhost: {\n // The border is applied in an ::after pseudo-element because it should not affect layout.\n // The padding and size of the badge should be the same regardless of whether or not it has a border.\n '::after': {\n display: 'none'\n }\n },\n // appearance: filled\n filled: {\n },\n 'filled-brand': {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-danger': {\n backgroundColor: tokens.colorPaletteRedBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-important': {\n backgroundColor: tokens.colorNeutralForeground1,\n color: tokens.colorNeutralBackground1\n },\n 'filled-informative': {\n backgroundColor: tokens.colorNeutralBackground5,\n color: tokens.colorNeutralForeground3\n },\n 'filled-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1\n },\n 'filled-success': {\n backgroundColor: tokens.colorPaletteGreenBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground3,\n color: tokens.colorNeutralForeground1Static\n },\n // appearance: ghost\n ghost: {\n },\n 'ghost-brand': {\n color: tokens.colorBrandForeground1\n },\n 'ghost-danger': {\n color: tokens.colorPaletteRedForeground3\n },\n 'ghost-important': {\n color: tokens.colorNeutralForeground1\n },\n 'ghost-informative': {\n color: tokens.colorNeutralForeground3\n },\n 'ghost-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3\n },\n 'ghost-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted\n },\n 'ghost-success': {\n color: tokens.colorPaletteGreenForeground3\n },\n 'ghost-warning': {\n color: tokens.colorPaletteYellowForeground2\n },\n // appearance: outline\n outline: {\n ...shorthands.borderColor('currentColor')\n },\n 'outline-brand': {\n color: tokens.colorBrandForeground1\n },\n 'outline-danger': {\n color: tokens.colorPaletteRedForeground3,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n },\n 'outline-important': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible)\n },\n 'outline-informative': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'outline-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3\n },\n 'outline-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted\n },\n 'outline-success': {\n color: tokens.colorPaletteGreenForeground3,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder2)\n },\n 'outline-warning': {\n color: tokens.colorPaletteYellowForeground2\n },\n // appearance: tint\n tint: {\n },\n 'tint-brand': {\n backgroundColor: tokens.colorBrandBackground2,\n color: tokens.colorBrandForeground2,\n ...shorthands.borderColor(tokens.colorBrandStroke2)\n },\n 'tint-danger': {\n backgroundColor: tokens.colorPaletteRedBackground1,\n color: tokens.colorPaletteRedForeground1,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder1)\n },\n 'tint-important': {\n backgroundColor: tokens.colorNeutralForeground3,\n color: tokens.colorNeutralBackground1,\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n 'tint-informative': {\n backgroundColor: tokens.colorNeutralBackground4,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground1,\n color: tokens.colorPaletteDarkOrangeForeground1,\n ...shorthands.borderColor(tokens.colorPaletteDarkOrangeBorder1)\n },\n 'tint-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-success': {\n backgroundColor: tokens.colorPaletteGreenBackground1,\n color: tokens.colorPaletteGreenForeground1,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder1)\n },\n 'tint-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground1,\n color: tokens.colorPaletteYellowForeground1,\n ...shorthands.borderColor(tokens.colorPaletteYellowBorder1)\n }\n});\nconst useIconRootClassName = makeResetStyles({\n display: 'flex',\n lineHeight: '1',\n margin: `0 calc(-1 * ${textPadding})`,\n fontSize: '12px'\n});\nconst useIconStyles = makeStyles({\n beforeText: {\n marginRight: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n afterText: {\n marginLeft: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n beforeTextXL: {\n marginRight: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n afterTextXL: {\n marginLeft: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n // size\n tiny: {\n fontSize: '6px'\n },\n 'extra-small': {\n fontSize: '10px'\n },\n small: {\n fontSize: '12px'\n },\n medium: {\n },\n large: {\n fontSize: '16px'\n },\n 'extra-large': {\n fontSize: '20px'\n }\n});\n/**\n * Applies style classnames to slots\n */ export const useBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const rootStyles = useRootStyles();\n const smallToTiny = state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny';\n state.root.className = mergeClasses(badgeClassNames.root, rootClassName, smallToTiny && rootStyles.fontSmallToTiny, rootStyles[state.size], rootStyles[state.shape], state.shape === 'rounded' && smallToTiny && rootStyles.roundedSmallToTiny, state.appearance === 'ghost' && rootStyles.borderGhost, rootStyles[state.appearance], rootStyles[`${state.appearance}-${state.color}`], state.root.className);\n const iconRootClassName = useIconRootClassName();\n const iconStyles = useIconStyles();\n if (state.icon) {\n let iconPositionClass;\n if (state.root.children) {\n if (state.size === 'extra-large') {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterTextXL : iconStyles.beforeTextXL;\n } else {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterText : iconStyles.beforeText;\n }\n }\n state.icon.className = mergeClasses(badgeClassNames.icon, iconRootClassName, iconPositionClass, iconStyles[state.size], state.icon.className);\n }\n return state;\n};\n"],"names":["badgeClassNames","useBadgeStyles_unstable","root","icon","textPadding","tokens","spacingHorizontalXXS","useRootClassName","__resetStyles","useRootStyles","__styles","fontSmallToTiny","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","tiny","a9b677","Bqenvij","Bf4jedk","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","small","medium","large","square","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","rounded","roundedSmallToTiny","circular","borderGhost","ap17g6","filled","De3pzq","sj55zd","ghost","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","tint","d","p","useIconRootClassName","useIconStyles","beforeText","t21cq0","afterText","Frg6f3","beforeTextXL","afterTextXL","state","rootClassName","rootStyles","smallToTiny","size","className","mergeClasses","shape","appearance","color","iconRootClassName","iconStyles","iconPositionClass","children","iconPosition"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.styles.js CHANGED
@@ -27,42 +27,42 @@ const getIsBusy = (status)=>{
27
27
  }
28
28
  return false;
29
29
  };
30
- const useRootClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r1711c1n", null, [
31
- ".r1711c1n{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;border-radius:var(--449, var(--450, var(--borderRadiusCircular)));background-color:var(--451, var(--452, var(--colorNeutralBackground1)));padding:1px;background-clip:content-box;}"
30
+ const useRootClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r832ydo", null, [
31
+ ".r832ydo{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;border-radius:var(--borderRadiusCircular);background-color:var(--colorNeutralBackground1);padding:1px;background-clip:content-box;}"
32
32
  ]);
33
33
  const useIconClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r11ag4qr", null, [
34
34
  ".r11ag4qr{display:flex;margin:-1px;}"
35
35
  ]);
36
36
  const useStyles = /*#__PURE__*/ (0, _react.__styles)({
37
37
  statusBusy: {
38
- sj55zd: "f12aalvp"
38
+ sj55zd: "fvi85wt"
39
39
  },
40
40
  statusAway: {
41
- sj55zd: "f10owiir"
41
+ sj55zd: "f14k8a89"
42
42
  },
43
43
  statusAvailable: {
44
- sj55zd: "fahcler"
44
+ sj55zd: "fqa5hgp"
45
45
  },
46
46
  statusOffline: {
47
- sj55zd: "f11odu81"
47
+ sj55zd: "f11d4kpn"
48
48
  },
49
49
  statusOutOfOffice: {
50
- sj55zd: "f1ovxq8r"
50
+ sj55zd: "fdce8r3"
51
51
  },
52
52
  statusUnknown: {
53
- sj55zd: "f16r53qq"
53
+ sj55zd: "f11d4kpn"
54
54
  },
55
55
  outOfOffice: {
56
- sj55zd: "f1lneuuo"
56
+ sj55zd: "fr0bkrk"
57
57
  },
58
58
  outOfOfficeAvailable: {
59
- sj55zd: "f187kc00"
59
+ sj55zd: "fqa5hgp"
60
60
  },
61
61
  outOfOfficeBusy: {
62
- sj55zd: "f1vz3tl8"
62
+ sj55zd: "fvi85wt"
63
63
  },
64
64
  outOfOfficeUnknown: {
65
- sj55zd: "f13mef6d"
65
+ sj55zd: "f11d4kpn"
66
66
  },
67
67
  tiny: {
68
68
  Bubjx69: "f9ikmtg",
@@ -85,16 +85,12 @@ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
85
85
  }
86
86
  }, {
87
87
  d: [
88
- ".f12aalvp{color:var(--453, var(--454, var(--colorPaletteRedBackground3)));}",
89
- ".f10owiir{color:var(--455, var(--456, var(--colorPaletteMarigoldBackground3)));}",
90
- ".fahcler{color:var(--457, var(--458, var(--colorPaletteLightGreenForeground3)));}",
91
- ".f11odu81{color:var(--459, var(--460, var(--colorNeutralForeground3)));}",
92
- ".f1ovxq8r{color:var(--461, var(--462, var(--colorPaletteBerryForeground3)));}",
93
- ".f16r53qq{color:var(--463, var(--464, var(--colorNeutralForeground3)));}",
94
- ".f1lneuuo{color:var(--465, var(--466, var(--colorNeutralBackground1)));}",
95
- ".f187kc00{color:var(--467, var(--468, var(--colorPaletteLightGreenForeground3)));}",
96
- ".f1vz3tl8{color:var(--469, var(--470, var(--colorPaletteRedBackground3)));}",
97
- ".f13mef6d{color:var(--471, var(--472, var(--colorNeutralForeground3)));}",
88
+ ".fvi85wt{color:var(--colorPaletteRedBackground3);}",
89
+ ".f14k8a89{color:var(--colorPaletteMarigoldBackground3);}",
90
+ ".fqa5hgp{color:var(--colorPaletteLightGreenForeground3);}",
91
+ ".f11d4kpn{color:var(--colorNeutralForeground3);}",
92
+ ".fdce8r3{color:var(--colorPaletteBerryForeground3);}",
93
+ ".fr0bkrk{color:var(--colorNeutralBackground1);}",
98
94
  ".f9ikmtg{aspect-ratio:1;}",
99
95
  ".f16dn6v3{width:6px;}",
100
96
  ".f1w2irj7{background-clip:unset;}",
package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["usePresenceBadgeStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const presenceBadgeClassNames = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon'\n};\nconst getIsBusy = (status)=>{\n if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {\n return true;\n }\n return false;\n};\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: `var(--449, var(--450, ${tokens.borderRadiusCircular}))`,\n backgroundColor: `var(--451, var(--452, ${tokens.colorNeutralBackground1}))`,\n // The background color bleeds around the edge of the icon due to antialiasing on the svg and element background.\n // Since all presence icons have a border around the edge that is at least 1px wide*, we can inset the background\n // using padding and backgroundClip. The icon has margin: -1px to account for the padding.\n // (* except size=\"tiny\", where backgroundClip is unset)\n padding: '1px',\n backgroundClip: 'content-box'\n});\nconst useIconClassName = makeResetStyles({\n display: 'flex',\n margin: '-1px'\n});\nconst useStyles = makeStyles({\n statusBusy: {\n color: `var(--453, var(--454, ${tokens.colorPaletteRedBackground3}))`\n },\n statusAway: {\n color: `var(--455, var(--456, ${tokens.colorPaletteMarigoldBackground3}))`\n },\n statusAvailable: {\n color: `var(--457, var(--458, ${tokens.colorPaletteLightGreenForeground3}))`\n },\n statusOffline: {\n color: `var(--459, var(--460, ${tokens.colorNeutralForeground3}))`\n },\n statusOutOfOffice: {\n color: `var(--461, var(--462, ${tokens.colorPaletteBerryForeground3}))`\n },\n statusUnknown: {\n color: `var(--463, var(--464, ${tokens.colorNeutralForeground3}))`\n },\n outOfOffice: {\n color: `var(--465, var(--466, ${tokens.colorNeutralBackground1}))`\n },\n outOfOfficeAvailable: {\n color: `var(--467, var(--468, ${tokens.colorPaletteLightGreenForeground3}))`\n },\n outOfOfficeBusy: {\n color: `var(--469, var(--470, ${tokens.colorPaletteRedBackground3}))`\n },\n outOfOfficeUnknown: {\n color: `var(--471, var(--472, ${tokens.colorNeutralForeground3}))`\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 backgroundClip: 'unset',\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 * Applies style classnames to slots\n */ export const usePresenceBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const iconClassName = useIconClassName();\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n 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 === 'out-of-office' || state.status === 'away' || state.status === 'offline') && 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);\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, iconClassName, state.icon.className);\n }\n return state;\n};\n"],"names":["presenceBadgeClassNames","usePresenceBadgeStyles_unstable","root","icon","getIsBusy","status","useRootClassName","__resetStyles","useIconClassName","useStyles","__styles","statusBusy","sj55zd","statusAway","statusAvailable","statusOffline","statusOutOfOffice","statusUnknown","outOfOffice","outOfOfficeAvailable","outOfOfficeBusy","outOfOfficeUnknown","tiny","Bubjx69","a9b677","B2eet1l","B5pe6w7","p4uzdd","large","extraLarge","d","state","rootClassName","iconClassName","styles","isBusy","className","mergeClasses","size"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["usePresenceBadgeStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const presenceBadgeClassNames = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon'\n};\nconst getIsBusy = (status)=>{\n if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {\n return true;\n }\n return false;\n};\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: tokens.borderRadiusCircular,\n backgroundColor: tokens.colorNeutralBackground1,\n // The background color bleeds around the edge of the icon due to antialiasing on the svg and element background.\n // Since all presence icons have a border around the edge that is at least 1px wide*, we can inset the background\n // using padding and backgroundClip. The icon has margin: -1px to account for the padding.\n // (* except size=\"tiny\", where backgroundClip is unset)\n padding: '1px',\n backgroundClip: 'content-box'\n});\nconst useIconClassName = makeResetStyles({\n display: 'flex',\n margin: '-1px'\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 // 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 backgroundClip: 'unset',\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 * Applies style classnames to slots\n */ export const usePresenceBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const iconClassName = useIconClassName();\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n 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 === 'out-of-office' || state.status === 'away' || state.status === 'offline') && 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);\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, iconClassName, state.icon.className);\n }\n return state;\n};\n"],"names":["presenceBadgeClassNames","usePresenceBadgeStyles_unstable","root","icon","getIsBusy","status","useRootClassName","__resetStyles","useIconClassName","useStyles","__styles","statusBusy","sj55zd","statusAway","statusAvailable","statusOffline","statusOutOfOffice","statusUnknown","outOfOffice","outOfOfficeAvailable","outOfOfficeBusy","outOfOfficeUnknown","tiny","Bubjx69","a9b677","B2eet1l","B5pe6w7","p4uzdd","large","extraLarge","d","state","rootClassName","iconClassName","styles","isBusy","className","mergeClasses","size"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","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-20240823-1802.1",
3
+ "version": "0.0.0-nightly-20240827-0406.1",
4
4
  "description": "React components for building web experiences",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -26,17 +26,17 @@
26
26
  },
27
27
  "devDependencies": {
28
28
  "@fluentui/eslint-plugin": "*",
29
- "@fluentui/react-conformance": "0.0.0-nightly-20240823-1802.1",
30
- "@fluentui/react-conformance-griffel": "0.0.0-nightly-20240823-1802.1",
29
+ "@fluentui/react-conformance": "0.0.0-nightly-20240827-0406.1",
30
+ "@fluentui/react-conformance-griffel": "0.0.0-nightly-20240827-0406.1",
31
31
  "@fluentui/scripts-api-extractor": "*",
32
32
  "@fluentui/scripts-tasks": "*"
33
33
  },
34
34
  "dependencies": {
35
35
  "@fluentui/react-icons": "^2.0.245",
36
- "@fluentui/react-jsx-runtime": "0.0.0-nightly-20240823-1802.1",
37
- "@fluentui/react-shared-contexts": "0.0.0-nightly-20240823-1802.1",
38
- "@fluentui/react-theme": "0.0.0-nightly-20240823-1802.1",
39
- "@fluentui/react-utilities": "0.0.0-nightly-20240823-1802.1",
36
+ "@fluentui/react-jsx-runtime": "0.0.0-nightly-20240827-0406.1",
37
+ "@fluentui/react-shared-contexts": "0.0.0-nightly-20240827-0406.1",
38
+ "@fluentui/react-theme": "0.0.0-nightly-20240827-0406.1",
39
+ "@fluentui/react-utilities": "0.0.0-nightly-20240827-0406.1",
40
40
  "@griffel/react": "^1.5.22",
41
41
  "@swc/helpers": "^0.5.1"
42
42
  },