@fluentui/react-badge 9.1.14 → 9.1.16

Sign up to get free protection for your applications and to get access to all the features.
Files changed (84) hide show
  1. package/CHANGELOG.json +79 -1
  2. package/CHANGELOG.md +28 -2
  3. package/lib/Badge.js +0 -1
  4. package/lib/Badge.js.map +1 -1
  5. package/lib/CounterBadge.js +0 -1
  6. package/lib/CounterBadge.js.map +1 -1
  7. package/lib/PresenceBadge.js +0 -1
  8. package/lib/PresenceBadge.js.map +1 -1
  9. package/lib/components/Badge/Badge.js +5 -7
  10. package/lib/components/Badge/Badge.js.map +1 -1
  11. package/lib/components/Badge/Badge.types.js +1 -2
  12. package/lib/components/Badge/Badge.types.js.map +1 -1
  13. package/lib/components/Badge/index.js +0 -1
  14. package/lib/components/Badge/index.js.map +1 -1
  15. package/lib/components/Badge/renderBadge.js +4 -8
  16. package/lib/components/Badge/renderBadge.js.map +1 -1
  17. package/lib/components/Badge/useBadge.js +19 -27
  18. package/lib/components/Badge/useBadge.js.map +1 -1
  19. package/lib/components/Badge/useBadgeStyles.styles.js.map +1 -1
  20. package/lib/components/CounterBadge/CounterBadge.js +5 -7
  21. package/lib/components/CounterBadge/CounterBadge.js.map +1 -1
  22. package/lib/components/CounterBadge/CounterBadge.types.js +1 -2
  23. package/lib/components/CounterBadge/CounterBadge.types.js.map +1 -1
  24. package/lib/components/CounterBadge/index.js +0 -1
  25. package/lib/components/CounterBadge/index.js.map +1 -1
  26. package/lib/components/CounterBadge/useCounterBadge.js +14 -23
  27. package/lib/components/CounterBadge/useCounterBadge.js.map +1 -1
  28. package/lib/components/CounterBadge/useCounterBadgeStyles.styles.js.map +1 -1
  29. package/lib/components/PresenceBadge/PresenceBadge.js +5 -7
  30. package/lib/components/PresenceBadge/PresenceBadge.js.map +1 -1
  31. package/lib/components/PresenceBadge/PresenceBadge.types.js +1 -2
  32. package/lib/components/PresenceBadge/PresenceBadge.types.js.map +1 -1
  33. package/lib/components/PresenceBadge/index.js +0 -1
  34. package/lib/components/PresenceBadge/index.js.map +1 -1
  35. package/lib/components/PresenceBadge/presenceIcons.js +110 -111
  36. package/lib/components/PresenceBadge/presenceIcons.js.map +1 -1
  37. package/lib/components/PresenceBadge/usePresenceBadge.js +49 -55
  38. package/lib/components/PresenceBadge/usePresenceBadge.js.map +1 -1
  39. package/lib/components/PresenceBadge/usePresenceBadgeStyles.styles.js.map +1 -1
  40. package/lib/index.js +0 -1
  41. package/lib/index.js.map +1 -1
  42. package/lib-commonjs/Badge.js +0 -3
  43. package/lib-commonjs/Badge.js.map +1 -1
  44. package/lib-commonjs/CounterBadge.js +0 -3
  45. package/lib-commonjs/CounterBadge.js.map +1 -1
  46. package/lib-commonjs/PresenceBadge.js +0 -3
  47. package/lib-commonjs/PresenceBadge.js.map +1 -1
  48. package/lib-commonjs/components/Badge/Badge.js +1 -3
  49. package/lib-commonjs/components/Badge/Badge.js.map +1 -1
  50. package/lib-commonjs/components/Badge/Badge.types.js +0 -3
  51. package/lib-commonjs/components/Badge/Badge.types.js.map +1 -1
  52. package/lib-commonjs/components/Badge/index.js +0 -3
  53. package/lib-commonjs/components/Badge/index.js.map +1 -1
  54. package/lib-commonjs/components/Badge/renderBadge.js +1 -3
  55. package/lib-commonjs/components/Badge/renderBadge.js.map +1 -1
  56. package/lib-commonjs/components/Badge/useBadge.js +1 -3
  57. package/lib-commonjs/components/Badge/useBadge.js.map +1 -1
  58. package/lib-commonjs/components/Badge/useBadgeStyles.styles.js +0 -2
  59. package/lib-commonjs/components/Badge/useBadgeStyles.styles.js.map +1 -1
  60. package/lib-commonjs/components/CounterBadge/CounterBadge.js +1 -3
  61. package/lib-commonjs/components/CounterBadge/CounterBadge.js.map +1 -1
  62. package/lib-commonjs/components/CounterBadge/CounterBadge.types.js +0 -3
  63. package/lib-commonjs/components/CounterBadge/CounterBadge.types.js.map +1 -1
  64. package/lib-commonjs/components/CounterBadge/index.js +0 -3
  65. package/lib-commonjs/components/CounterBadge/index.js.map +1 -1
  66. package/lib-commonjs/components/CounterBadge/useCounterBadge.js +1 -3
  67. package/lib-commonjs/components/CounterBadge/useCounterBadge.js.map +1 -1
  68. package/lib-commonjs/components/CounterBadge/useCounterBadgeStyles.styles.js +0 -2
  69. package/lib-commonjs/components/CounterBadge/useCounterBadgeStyles.styles.js.map +1 -1
  70. package/lib-commonjs/components/PresenceBadge/PresenceBadge.js +1 -3
  71. package/lib-commonjs/components/PresenceBadge/PresenceBadge.js.map +1 -1
  72. package/lib-commonjs/components/PresenceBadge/PresenceBadge.types.js +0 -3
  73. package/lib-commonjs/components/PresenceBadge/PresenceBadge.types.js.map +1 -1
  74. package/lib-commonjs/components/PresenceBadge/index.js +0 -3
  75. package/lib-commonjs/components/PresenceBadge/index.js.map +1 -1
  76. package/lib-commonjs/components/PresenceBadge/presenceIcons.js +1 -3
  77. package/lib-commonjs/components/PresenceBadge/presenceIcons.js.map +1 -1
  78. package/lib-commonjs/components/PresenceBadge/usePresenceBadge.js +1 -3
  79. package/lib-commonjs/components/PresenceBadge/usePresenceBadge.js.map +1 -1
  80. package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.styles.js +0 -2
  81. package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.styles.js.map +1 -1
  82. package/lib-commonjs/index.js +0 -3
  83. package/lib-commonjs/index.js.map +1 -1
  84. package/package.json +8 -8
package/CHANGELOG.json CHANGED
@@ -2,7 +2,85 @@
2
2
  "name": "@fluentui/react-badge",
3
3
  "entries": [
4
4
  {
5
- "date": "Thu, 25 May 2023 09:57:45 GMT",
5
+ "date": "Tue, 20 Jun 2023 12:34:39 GMT",
6
+ "tag": "@fluentui/react-badge_v9.1.16",
7
+ "version": "9.1.16",
8
+ "comments": {
9
+ "patch": [
10
+ {
11
+ "author": "ololubek@microsoft.com",
12
+ "package": "@fluentui/react-badge",
13
+ "commit": "8a5ae3aa00faa327c58887a99a5698b18f2930ee",
14
+ "comment": "chore: update @fluentui/react-icons to 2.0.203"
15
+ },
16
+ {
17
+ "author": "beachball",
18
+ "package": "@fluentui/react-badge",
19
+ "comment": "Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.7",
20
+ "commit": "81c9b35e0830297b2aca2cece2ae67b3899c4647"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-badge",
25
+ "comment": "Bump @fluentui/react-shared-contexts to v9.5.1",
26
+ "commit": "81c9b35e0830297b2aca2cece2ae67b3899c4647"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-badge",
31
+ "comment": "Bump @fluentui/react-theme to v9.1.9",
32
+ "commit": "81c9b35e0830297b2aca2cece2ae67b3899c4647"
33
+ },
34
+ {
35
+ "author": "beachball",
36
+ "package": "@fluentui/react-badge",
37
+ "comment": "Bump @fluentui/react-utilities to v9.9.3",
38
+ "commit": "81c9b35e0830297b2aca2cece2ae67b3899c4647"
39
+ },
40
+ {
41
+ "author": "beachball",
42
+ "package": "@fluentui/react-badge",
43
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.23",
44
+ "commit": "81c9b35e0830297b2aca2cece2ae67b3899c4647"
45
+ }
46
+ ]
47
+ }
48
+ },
49
+ {
50
+ "date": "Wed, 31 May 2023 06:46:09 GMT",
51
+ "tag": "@fluentui/react-badge_v9.1.15",
52
+ "version": "9.1.15",
53
+ "comments": {
54
+ "patch": [
55
+ {
56
+ "author": "seanmonahan@microsoft.com",
57
+ "package": "@fluentui/react-badge",
58
+ "commit": "d640b972d7ac86bfb76ae6c6329f12cdd33b3b7c",
59
+ "comment": "chore: Update Griffel to v1.5.7."
60
+ },
61
+ {
62
+ "author": "beachball",
63
+ "package": "@fluentui/react-badge",
64
+ "comment": "Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.6",
65
+ "commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
66
+ },
67
+ {
68
+ "author": "beachball",
69
+ "package": "@fluentui/react-badge",
70
+ "comment": "Bump @fluentui/react-utilities to v9.9.2",
71
+ "commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
72
+ },
73
+ {
74
+ "author": "beachball",
75
+ "package": "@fluentui/react-badge",
76
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.22",
77
+ "commit": "17ca96c6b7f684f36a5c63e40e78b4986a86c713"
78
+ }
79
+ ]
80
+ }
81
+ },
82
+ {
83
+ "date": "Thu, 25 May 2023 10:00:48 GMT",
6
84
  "tag": "@fluentui/react-badge_v9.1.14",
7
85
  "version": "9.1.14",
8
86
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,38 @@
1
1
  # Change Log - @fluentui/react-badge
2
2
 
3
- This log was last generated on Thu, 25 May 2023 09:57:45 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 20 Jun 2023 12:34:39 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.1.16](https://github.com/microsoft/fluentui/tree/@fluentui/react-badge_v9.1.16)
8
+
9
+ Tue, 20 Jun 2023 12:34:39 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-badge_v9.1.15..@fluentui/react-badge_v9.1.16)
11
+
12
+ ### Patches
13
+
14
+ - chore: update @fluentui/react-icons to 2.0.203 ([PR #28203](https://github.com/microsoft/fluentui/pull/28203) by ololubek@microsoft.com)
15
+ - Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.7 ([PR #28229](https://github.com/microsoft/fluentui/pull/28229) by beachball)
16
+ - Bump @fluentui/react-shared-contexts to v9.5.1 ([PR #28229](https://github.com/microsoft/fluentui/pull/28229) by beachball)
17
+ - Bump @fluentui/react-theme to v9.1.9 ([PR #28229](https://github.com/microsoft/fluentui/pull/28229) by beachball)
18
+ - Bump @fluentui/react-utilities to v9.9.3 ([PR #28229](https://github.com/microsoft/fluentui/pull/28229) by beachball)
19
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.23 ([PR #28229](https://github.com/microsoft/fluentui/pull/28229) by beachball)
20
+
21
+ ## [9.1.15](https://github.com/microsoft/fluentui/tree/@fluentui/react-badge_v9.1.15)
22
+
23
+ Wed, 31 May 2023 06:46:09 GMT
24
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-badge_v9.1.14..@fluentui/react-badge_v9.1.15)
25
+
26
+ ### Patches
27
+
28
+ - chore: Update Griffel to v1.5.7. ([PR #27925](https://github.com/microsoft/fluentui/pull/27925) by seanmonahan@microsoft.com)
29
+ - Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.6 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
30
+ - Bump @fluentui/react-utilities to v9.9.2 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
31
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.22 ([PR #28054](https://github.com/microsoft/fluentui/pull/28054) by beachball)
32
+
7
33
  ## [9.1.14](https://github.com/microsoft/fluentui/tree/@fluentui/react-badge_v9.1.14)
8
34
 
9
- Thu, 25 May 2023 09:57:45 GMT
35
+ Thu, 25 May 2023 10:00:48 GMT
10
36
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-badge_v9.1.13..@fluentui/react-badge_v9.1.14)
11
37
 
12
38
  ### Patches
package/lib/Badge.js CHANGED
@@ -1,2 +1 @@
1
1
  export * from './components/Badge/index';
2
- //# sourceMappingURL=Badge.js.map
package/lib/Badge.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../src/Badge.ts"],"sourcesContent":["export * from './components/Badge/index';\n"],"mappings":"AAAA,cAAc"}
1
+ {"version":3,"sources":["Badge.ts"],"sourcesContent":["export * from './components/Badge/index';\n"],"names":[],"mappings":"AAAA,cAAc,2BAA2B"}
@@ -1,2 +1 @@
1
1
  export * from './components/CounterBadge/index';
2
- //# sourceMappingURL=CounterBadge.js.map
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../src/CounterBadge.ts"],"sourcesContent":["export * from './components/CounterBadge/index';\n"],"mappings":"AAAA,cAAc"}
1
+ {"version":3,"sources":["CounterBadge.ts"],"sourcesContent":["export * from './components/CounterBadge/index';\n"],"names":[],"mappings":"AAAA,cAAc,kCAAkC"}
@@ -1,2 +1 @@
1
1
  export * from './components/PresenceBadge/index';
2
- //# sourceMappingURL=PresenceBadge.js.map
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../src/PresenceBadge.ts"],"sourcesContent":["export * from './components/PresenceBadge/index';\n"],"mappings":"AAAA,cAAc"}
1
+ {"version":3,"sources":["PresenceBadge.ts"],"sourcesContent":["export * from './components/PresenceBadge/index';\n"],"names":[],"mappings":"AAAA,cAAc,mCAAmC"}
@@ -5,12 +5,10 @@ import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
5
5
  import { renderBadge_unstable } from './renderBadge';
6
6
  /**
7
7
  * Define a styled Badge, using the `useBadge_unstable` hook.
8
- */
9
- export const Badge = /*#__PURE__*/React.forwardRef((props, ref) => {
10
- const state = useBadge_unstable(props, ref);
11
- useBadgeStyles_unstable(state);
12
- useCustomStyleHook_unstable('useBadgeStyles_unstable')(state);
13
- return renderBadge_unstable(state);
8
+ */ export const Badge = /*#__PURE__*/ React.forwardRef((props, ref)=>{
9
+ const state = useBadge_unstable(props, ref);
10
+ useBadgeStyles_unstable(state);
11
+ useCustomStyleHook_unstable('useBadgeStyles_unstable')(state);
12
+ return renderBadge_unstable(state);
14
13
  });
15
14
  Badge.displayName = 'Badge';
16
- //# sourceMappingURL=Badge.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","useBadge_unstable","useBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","Badge","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useBadge_unstable } from './useBadge';\nimport { useBadgeStyles_unstable } from './useBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from './renderBadge';\nimport type { BadgeProps } from './Badge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled Badge, using the `useBadge_unstable` hook.\n */\nexport const Badge: ForwardRefComponent<BadgeProps> = React.forwardRef((props, ref) => {\n const state = useBadge_unstable(props, ref);\n\n useBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('useBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nBadge.displayName = 'Badge';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,iBAAiB,QAAQ;AAClC,SAASC,uBAAuB,QAAQ;AACxC,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,oBAAoB,QAAQ;AAIrC;;;AAGA,OAAO,MAAMC,KAAA,gBAAyCL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACrF,MAAMC,KAAA,GAAQR,iBAAA,CAAkBM,KAAA,EAAOC,GAAA;EAEvCN,uBAAA,CAAwBO,KAAA;EAExBN,2BAAA,CAA4B,2BAA2BM,KAAA;EAEvD,OAAOL,oBAAA,CAAqBK,KAAA;AAC9B;AAEAJ,KAAA,CAAMK,WAAW,GAAG"}
1
+ {"version":3,"sources":["Badge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useBadge_unstable } from './useBadge';\nimport { useBadgeStyles_unstable } from './useBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from './renderBadge';\nimport type { BadgeProps } from './Badge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled Badge, using the `useBadge_unstable` hook.\n */\nexport const Badge: ForwardRefComponent<BadgeProps> = React.forwardRef((props, ref) => {\n const state = useBadge_unstable(props, ref);\n\n useBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('useBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nBadge.displayName = 'Badge';\n"],"names":["React","useBadge_unstable","useBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","Badge","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,iBAAiB,QAAQ,aAAa;AAC/C,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,oBAAoB,QAAQ,gBAAgB;AAIrD;;CAEC,GACD,OAAO,MAAMC,sBAAyCL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACrF,MAAMC,QAAQR,kBAAkBM,OAAOC;IAEvCN,wBAAwBO;IAExBN,4BAA4B,2BAA2BM;IAEvD,OAAOL,qBAAqBK;AAC9B,GAAG;AAEHJ,MAAMK,WAAW,GAAG"}
@@ -1,2 +1 @@
1
- export {};
2
- //# sourceMappingURL=Badge.types.js.map
1
+ export { };
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../../../src/components/Badge/Badge.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type BadgeSlots = {\n root: Slot<'div'>;\n icon?: Slot<'span'>;\n};\n\n// react has a non-standard `color` attribute in its types\n// https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a4ab0fa432320e70da9e51c8ae2e47377f65804b/types/react/index.d.ts#L1868\nexport type BadgeProps = Omit<ComponentProps<BadgeSlots>, 'color'> & {\n /**\n * A Badge can be filled, outline, ghost, inverted\n * @defaultvalue filled\n */\n appearance?: 'filled' | 'ghost' | 'outline' | 'tint';\n\n /**\n * A Badge can be one of preset colors\n * @defaultvalue brand\n */\n color?: 'brand' | 'danger' | 'important' | 'informative' | 'severe' | 'subtle' | 'success' | 'warning';\n\n /**\n * A Badge can position the icon before or after the content.\n * @defaultvalue before\n */\n iconPosition?: 'before' | 'after';\n\n /**\n * A Badge can be square, circular or rounded.\n * @defaultvalue circular\n */\n shape?: 'circular' | 'rounded' | 'square';\n\n /**\n * A Badge can be on of several preset sizes.\n * @defaultvalue medium\n */\n size?: 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large';\n};\n\nexport type BadgeState = ComponentState<BadgeSlots> &\n Required<Pick<BadgeProps, 'appearance' | 'color' | 'iconPosition' | 'shape' | 'size'>>;\n"],"mappings":"AAAA"}
1
+ {"version":3,"sources":["Badge.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type BadgeSlots = {\n root: Slot<'div'>;\n icon?: Slot<'span'>;\n};\n\n// react has a non-standard `color` attribute in its types\n// https://github.com/DefinitelyTyped/DefinitelyTyped/blob/a4ab0fa432320e70da9e51c8ae2e47377f65804b/types/react/index.d.ts#L1868\nexport type BadgeProps = Omit<ComponentProps<BadgeSlots>, 'color'> & {\n /**\n * A Badge can be filled, outline, ghost, inverted\n * @defaultvalue filled\n */\n appearance?: 'filled' | 'ghost' | 'outline' | 'tint';\n\n /**\n * A Badge can be one of preset colors\n * @defaultvalue brand\n */\n color?: 'brand' | 'danger' | 'important' | 'informative' | 'severe' | 'subtle' | 'success' | 'warning';\n\n /**\n * A Badge can position the icon before or after the content.\n * @defaultvalue before\n */\n iconPosition?: 'before' | 'after';\n\n /**\n * A Badge can be square, circular or rounded.\n * @defaultvalue circular\n */\n shape?: 'circular' | 'rounded' | 'square';\n\n /**\n * A Badge can be on of several preset sizes.\n * @defaultvalue medium\n */\n size?: 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large';\n};\n\nexport type BadgeState = ComponentState<BadgeSlots> &\n Required<Pick<BadgeProps, 'appearance' | 'color' | 'iconPosition' | 'shape' | 'size'>>;\n"],"names":[],"mappings":"AAAA,WA0CyF"}
@@ -2,4 +2,3 @@ export * from './Badge';
2
2
  export * from './renderBadge';
3
3
  export * from './useBadge';
4
4
  export * from './useBadgeStyles.styles';
5
- //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../../../src/components/Badge/index.ts"],"sourcesContent":["export * from './Badge';\n// Explicit exports to omit BadgeCommons\nexport type { BadgeProps, BadgeSlots, BadgeState } from './Badge.types';\nexport * from './renderBadge';\nexport * from './useBadge';\nexport * from './useBadgeStyles.styles';\n"],"mappings":"AAAA,cAAc;AAGd,cAAc;AACd,cAAc;AACd,cAAc"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Badge';\n// Explicit exports to omit BadgeCommons\nexport type { BadgeProps, BadgeSlots, BadgeState } from './Badge.types';\nexport * from './renderBadge';\nexport * from './useBadge';\nexport * from './useBadgeStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,UAAU;AAGxB,cAAc,gBAAgB;AAC9B,cAAc,aAAa;AAC3B,cAAc,0BAA0B"}
@@ -1,10 +1,6 @@
1
- /** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
1
+ /** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
2
2
  import { getSlotsNext } from '@fluentui/react-utilities';
3
- export const renderBadge_unstable = state => {
4
- const {
5
- slots,
6
- slotProps
7
- } = getSlotsNext(state);
8
- return /*#__PURE__*/createElement(slots.root, slotProps.root, state.iconPosition === 'before' && slots.icon && /*#__PURE__*/createElement(slots.icon, slotProps.icon), state.root.children, state.iconPosition === 'after' && slots.icon && /*#__PURE__*/createElement(slots.icon, slotProps.icon));
3
+ export const renderBadge_unstable = (state)=>{
4
+ const { slots , slotProps } = getSlotsNext(state);
5
+ return /*#__PURE__*/ createElement(slots.root, slotProps.root, state.iconPosition === 'before' && slots.icon && /*#__PURE__*/ createElement(slots.icon, slotProps.icon), state.root.children, state.iconPosition === 'after' && slots.icon && /*#__PURE__*/ createElement(slots.icon, slotProps.icon));
9
6
  };
10
- //# sourceMappingURL=renderBadge.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["createElement","getSlotsNext","renderBadge_unstable","state","slots","slotProps","root","iconPosition","icon","children"],"sources":["../../../src/components/Badge/renderBadge.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { BadgeState, BadgeSlots } from './Badge.types';\n\nexport const renderBadge_unstable = (state: BadgeState) => {\n const { slots, slotProps } = getSlotsNext<BadgeSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {state.iconPosition === 'before' && slots.icon && <slots.icon {...slotProps.icon} />}\n {state.root.children}\n {state.iconPosition === 'after' && slots.icon && <slots.icon {...slotProps.icon} />}\n </slots.root>\n );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAE9B,SAASC,YAAY,QAAQ;AAG7B,OAAO,MAAMC,oBAAA,GAAwBC,KAAA,IAAsB;EACzD,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,YAAA,CAAyBE,KAAA;EAEtD,oBACEH,aAXJ,CAWKI,KAAA,CAAME,IAAI,EAAKD,SAAA,CAAUC,IAAI,EAC3BH,KAAA,CAAMI,YAAY,KAAK,YAAYH,KAAA,CAAMI,IAAI,iBAAIR,aAZxD,CAYyDI,KAAA,CAAMI,IAAI,EAAKH,SAAA,CAAUG,IAAI,GAC/EL,KAAA,CAAMG,IAAI,CAACG,QAAQ,EACnBN,KAAA,CAAMI,YAAY,KAAK,WAAWH,KAAA,CAAMI,IAAI,iBAAIR,aAdvD,CAcwDI,KAAA,CAAMI,IAAI,EAAKH,SAAA,CAAUG,IAAI;AAGrF"}
1
+ {"version":3,"sources":["renderBadge.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { BadgeState, BadgeSlots } from './Badge.types';\n\nexport const renderBadge_unstable = (state: BadgeState) => {\n const { slots, slotProps } = getSlotsNext<BadgeSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {state.iconPosition === 'before' && slots.icon && <slots.icon {...slotProps.icon} />}\n {state.root.children}\n {state.iconPosition === 'after' && slots.icon && <slots.icon {...slotProps.icon} />}\n </slots.root>\n );\n};\n"],"names":["createElement","getSlotsNext","renderBadge_unstable","state","slots","slotProps","root","iconPosition","icon","children"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAE5D,SAASC,YAAY,QAAQ,4BAA4B;AAGzD,OAAO,MAAMC,uBAAuB,CAACC,QAAsB;IACzD,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGJ,aAAyBE;IAEtD,qBACE,AAXJ,cAWKC,MAAME,IAAI,EAAKD,UAAUC,IAAI,EAC3BH,MAAMI,YAAY,KAAK,YAAYH,MAAMI,IAAI,kBAAI,AAZxD,cAYyDJ,MAAMI,IAAI,EAAKH,UAAUG,IAAI,GAC/EL,MAAMG,IAAI,CAACG,QAAQ,EACnBN,MAAMI,YAAY,KAAK,WAAWH,MAAMI,IAAI,kBAAI,AAdvD,cAcwDJ,MAAMI,IAAI,EAAKH,UAAUG,IAAI;AAGrF,EAAE"}
@@ -2,31 +2,23 @@ import * as React from 'react';
2
2
  import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';
3
3
  /**
4
4
  * Returns the props and state required to render the component
5
- */
6
- export const useBadge_unstable = (props, ref) => {
7
- const {
8
- shape = 'circular',
9
- size = 'medium',
10
- iconPosition = 'before',
11
- appearance = 'filled',
12
- color = 'brand'
13
- } = props;
14
- const state = {
15
- shape,
16
- size,
17
- iconPosition,
18
- appearance,
19
- color,
20
- components: {
21
- root: 'div',
22
- icon: 'span'
23
- },
24
- root: getNativeElementProps('div', {
25
- ref,
26
- ...props
27
- }),
28
- icon: resolveShorthand(props.icon)
29
- };
30
- return state;
5
+ */ export const useBadge_unstable = (props, ref)=>{
6
+ const { shape ='circular' , size ='medium' , iconPosition ='before' , appearance ='filled' , color ='brand' } = props;
7
+ const state = {
8
+ shape,
9
+ size,
10
+ iconPosition,
11
+ appearance,
12
+ color,
13
+ components: {
14
+ root: 'div',
15
+ icon: 'span'
16
+ },
17
+ root: getNativeElementProps('div', {
18
+ ref,
19
+ ...props
20
+ }),
21
+ icon: resolveShorthand(props.icon)
22
+ };
23
+ return state;
31
24
  };
32
- //# sourceMappingURL=useBadge.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","getNativeElementProps","resolveShorthand","useBadge_unstable","props","ref","shape","size","iconPosition","appearance","color","state","components","root","icon"],"sources":["../../../src/components/Badge/useBadge.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState } from './Badge.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useBadge_unstable = (props: BadgeProps, ref: React.Ref<HTMLElement>): BadgeState => {\n const {\n shape = 'circular',\n size = 'medium',\n iconPosition = 'before',\n appearance = 'filled',\n color = 'brand',\n } = props;\n\n const state: BadgeState = {\n shape,\n size,\n iconPosition,\n appearance,\n color,\n components: {\n root: 'div',\n icon: 'span',\n },\n root: getNativeElementProps('div', {\n ref,\n ...props,\n }),\n icon: resolveShorthand(props.icon),\n };\n\n return state;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ;AAGxD;;;AAGA,OAAO,MAAMC,iBAAA,GAAoBA,CAACC,KAAA,EAAmBC,GAAA,KAA4C;EAC/F,MAAM;IACJC,KAAA,GAAQ;IACRC,IAAA,GAAO;IACPC,YAAA,GAAe;IACfC,UAAA,GAAa;IACbC,KAAA,GAAQ;EAAO,CAChB,GAAGN,KAAA;EAEJ,MAAMO,KAAA,GAAoB;IACxBL,KAAA;IACAC,IAAA;IACAC,YAAA;IACAC,UAAA;IACAC,KAAA;IACAE,UAAA,EAAY;MACVC,IAAA,EAAM;MACNC,IAAA,EAAM;IACR;IACAD,IAAA,EAAMZ,qBAAA,CAAsB,OAAO;MACjCI,GAAA;MACA,GAAGD;IACL;IACAU,IAAA,EAAMZ,gBAAA,CAAiBE,KAAA,CAAMU,IAAI;EACnC;EAEA,OAAOH,KAAA;AACT"}
1
+ {"version":3,"sources":["useBadge.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState } from './Badge.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useBadge_unstable = (props: BadgeProps, ref: React.Ref<HTMLElement>): BadgeState => {\n const {\n shape = 'circular',\n size = 'medium',\n iconPosition = 'before',\n appearance = 'filled',\n color = 'brand',\n } = props;\n\n const state: BadgeState = {\n shape,\n size,\n iconPosition,\n appearance,\n color,\n components: {\n root: 'div',\n icon: 'span',\n },\n root: getNativeElementProps('div', {\n ref,\n ...props,\n }),\n icon: resolveShorthand(props.icon),\n };\n\n return state;\n};\n"],"names":["React","getNativeElementProps","resolveShorthand","useBadge_unstable","props","ref","shape","size","iconPosition","appearance","color","state","components","root","icon"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ,4BAA4B;AAGpF;;CAEC,GACD,OAAO,MAAMC,oBAAoB,CAACC,OAAmBC,MAA4C;IAC/F,MAAM,EACJC,OAAQ,WAAU,EAClBC,MAAO,SAAQ,EACfC,cAAe,SAAQ,EACvBC,YAAa,SAAQ,EACrBC,OAAQ,QAAO,EAChB,GAAGN;IAEJ,MAAMO,QAAoB;QACxBL;QACAC;QACAC;QACAC;QACAC;QACAE,YAAY;YACVC,MAAM;YACNC,MAAM;QACR;QACAD,MAAMZ,sBAAsB,OAAO;YACjCI;YACA,GAAGD,KAAK;QACV;QACAU,MAAMZ,iBAAiBE,MAAMU,IAAI;IACnC;IAEA,OAAOH;AACT,EAAE"}
@@ -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","z8tnut","z189sj","Byoj8tv","uwmqm3","small","medium","large","square","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","rounded","roundedSmallToTiny","circular","borderGhost","ap17g6","filled","De3pzq","sj55zd","ghost","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","tint","d","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":["../../../src/components/Badge/useBadgeStyles.styles.ts"],"sourcesContent":["import { shorthands, makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { BadgeSlots, BadgeState } from './Badge.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const badgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-Badge',\n icon: 'fui-Badge__icon',\n};\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;\n\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\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});\n\nconst useRootStyles = makeStyles({\n fontSmallToTiny: {\n ...typographyStyles.caption2Strong,\n },\n\n // size\n\n tiny: {\n width: '6px',\n height: '6px',\n fontSize: '4px',\n lineHeight: '4px',\n minWidth: 'unset',\n ...shorthands.padding('unset'),\n },\n 'extra-small': {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n lineHeight: '6px',\n minWidth: 'unset',\n ...shorthands.padding('unset'),\n },\n small: {\n width: '16px',\n height: '16px',\n ...shorthands.padding(0, `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`),\n },\n medium: {\n // Set by useRootClassName\n },\n large: {\n width: '24px',\n height: '24px',\n ...shorthands.padding(0, `calc(${tokens.spacingHorizontalXS} + ${textPadding})`),\n },\n 'extra-large': {\n width: '32px',\n height: '32px',\n ...shorthands.padding(0, `calc(${tokens.spacingHorizontalSNudge} + ${textPadding})`),\n },\n\n // shape\n\n square: {\n ...shorthands.borderRadius(tokens.borderRadiusNone),\n },\n rounded: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n },\n roundedSmallToTiny: {\n ...shorthands.borderRadius(tokens.borderRadiusSmall),\n },\n circular: {\n // Set by useRootClassName\n },\n\n // hide the boder when appearance is \"ghost\"\n\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\n // appearance: filled\n\n filled: {\n // Set by useRootClassName\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\n // appearance: ghost\n\n ghost: {\n // No shared colors between ghost appearances\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\n // appearance: outline\n\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\n // appearance: tint\n\n tint: {\n // No shared colors between tint appearances\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});\n\nconst useIconRootClassName = makeResetStyles({\n display: 'flex',\n lineHeight: '1',\n margin: `0 calc(-1 * ${textPadding})`, // Remove text padding added to root\n fontSize: '12px',\n});\n\nconst useIconStyles = makeStyles({\n beforeText: {\n marginRight: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`,\n },\n afterText: {\n marginLeft: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`,\n },\n\n beforeTextXL: {\n marginRight: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n },\n afterTextXL: {\n marginLeft: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n },\n\n // size\n\n tiny: {\n fontSize: '6px',\n },\n 'extra-small': {\n fontSize: '10px',\n },\n small: {\n fontSize: '12px',\n },\n medium: {\n // Set by useIconRootClassName\n },\n large: {\n fontSize: '16px',\n },\n 'extra-large': {\n fontSize: '20px',\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const useBadgeStyles_unstable = (state: BadgeState): BadgeState => {\n const rootClassName = useRootClassName();\n const rootStyles = useRootStyles();\n\n const smallToTiny = state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny';\n\n state.root.className = mergeClasses(\n badgeClassNames.root,\n rootClassName,\n smallToTiny && rootStyles.fontSmallToTiny,\n rootStyles[state.size],\n rootStyles[state.shape],\n state.shape === 'rounded' && smallToTiny && rootStyles.roundedSmallToTiny,\n state.appearance === 'ghost' && rootStyles.borderGhost,\n rootStyles[state.appearance],\n rootStyles[`${state.appearance}-${state.color}` as const],\n state.root.className,\n );\n\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\n state.icon.className = mergeClasses(\n badgeClassNames.icon,\n iconRootClassName,\n iconPositionClass,\n iconStyles[state.size],\n state.icon.className,\n );\n }\n\n return state;\n};\n"],"mappings":"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"}
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","z8tnut","z189sj","Byoj8tv","uwmqm3","small","medium","large","square","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","rounded","roundedSmallToTiny","circular","borderGhost","ap17g6","filled","De3pzq","sj55zd","ghost","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","tint","d","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 ...shorthands.padding('unset')\n },\n 'extra-small': {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n lineHeight: '6px',\n minWidth: 'unset',\n ...shorthands.padding('unset')\n },\n small: {\n width: '16px',\n height: '16px',\n ...shorthands.padding(0, `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`)\n },\n medium: {\n },\n large: {\n width: '24px',\n height: '24px',\n ...shorthands.padding(0, `calc(${tokens.spacingHorizontalXS} + ${textPadding})`)\n },\n 'extra-large': {\n width: '32px',\n height: '32px',\n ...shorthands.padding(0, `calc(${tokens.spacingHorizontalSNudge} + ${textPadding})`)\n },\n // shape\n square: {\n ...shorthands.borderRadius(tokens.borderRadiusNone)\n },\n rounded: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium)\n },\n roundedSmallToTiny: {\n ...shorthands.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 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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"}
@@ -5,12 +5,10 @@ import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
5
5
  import { renderBadge_unstable } from '../Badge/index';
6
6
  /**
7
7
  * Define a styled CounterBadge, using the `useCounterBadge_unstable` hook.
8
- */
9
- export const CounterBadge = /*#__PURE__*/React.forwardRef((props, ref) => {
10
- const state = useCounterBadge_unstable(props, ref);
11
- useCounterBadgeStyles_unstable(state);
12
- useCustomStyleHook_unstable('useCounterBadgeStyles_unstable')(state);
13
- return renderBadge_unstable(state);
8
+ */ export const CounterBadge = /*#__PURE__*/ React.forwardRef((props, ref)=>{
9
+ const state = useCounterBadge_unstable(props, ref);
10
+ useCounterBadgeStyles_unstable(state);
11
+ useCustomStyleHook_unstable('useCounterBadgeStyles_unstable')(state);
12
+ return renderBadge_unstable(state);
14
13
  });
15
14
  CounterBadge.displayName = 'CounterBadge';
16
- //# sourceMappingURL=CounterBadge.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","useCounterBadge_unstable","useCounterBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","CounterBadge","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/CounterBadge/CounterBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCounterBadge_unstable } from './useCounterBadge';\nimport { useCounterBadgeStyles_unstable } from './useCounterBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from '../Badge/index';\nimport type { CounterBadgeProps } from './CounterBadge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled CounterBadge, using the `useCounterBadge_unstable` hook.\n */\nexport const CounterBadge: ForwardRefComponent<CounterBadgeProps> = React.forwardRef((props, ref) => {\n const state = useCounterBadge_unstable(props, ref);\n\n useCounterBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCounterBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nCounterBadge.displayName = 'CounterBadge';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,wBAAwB,QAAQ;AACzC,SAASC,8BAA8B,QAAQ;AAC/C,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,oBAAoB,QAAQ;AAIrC;;;AAGA,OAAO,MAAMC,YAAA,gBAAuDL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACnG,MAAMC,KAAA,GAAQR,wBAAA,CAAyBM,KAAA,EAAOC,GAAA;EAE9CN,8BAAA,CAA+BO,KAAA;EAE/BN,2BAAA,CAA4B,kCAAkCM,KAAA;EAE9D,OAAOL,oBAAA,CAAqBK,KAAA;AAC9B;AAEAJ,YAAA,CAAaK,WAAW,GAAG"}
1
+ {"version":3,"sources":["CounterBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCounterBadge_unstable } from './useCounterBadge';\nimport { useCounterBadgeStyles_unstable } from './useCounterBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from '../Badge/index';\nimport type { CounterBadgeProps } from './CounterBadge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled CounterBadge, using the `useCounterBadge_unstable` hook.\n */\nexport const CounterBadge: ForwardRefComponent<CounterBadgeProps> = React.forwardRef((props, ref) => {\n const state = useCounterBadge_unstable(props, ref);\n\n useCounterBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCounterBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nCounterBadge.displayName = 'CounterBadge';\n"],"names":["React","useCounterBadge_unstable","useCounterBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","CounterBadge","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,8BAA8B,QAAQ,iCAAiC;AAChF,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,oBAAoB,QAAQ,iBAAiB;AAItD;;CAEC,GACD,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACnG,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CN,+BAA+BO;IAE/BN,4BAA4B,kCAAkCM;IAE9D,OAAOL,qBAAqBK;AAC9B,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
@@ -1,2 +1 @@
1
- export {};
2
- //# sourceMappingURL=CounterBadge.types.js.map
1
+ export { };
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../../../src/components/CounterBadge/CounterBadge.types.ts"],"sourcesContent":["import type { BadgeProps, BadgeState } from '../Badge/index';\n\nexport type CounterBadgeProps = Omit<BadgeProps, 'appearance' | 'color' | 'shape'> & {\n /**\n * A Badge can have different appearances that emphasize certain parts of it:\n * - filled: The default appearance if one is not specified.\n * The badge background is filled with color with a contrasting foreground text to match.\n * - ghost: The badge background is transparent, with the foreground text taking color to emphasize it.\n * @default filled\n */\n appearance?: 'filled' | 'ghost';\n\n /**\n * Semantic colors for a counter badge\n * @default brand\n */\n color?: Extract<BadgeProps['color'], 'brand' | 'danger' | 'important' | 'informative'>;\n\n /**\n * Value displayed by the Badge\n * @default 0\n */\n count?: number;\n\n /**\n * If a dot should be displayed without the count\n * @default false\n */\n dot?: boolean;\n\n /**\n * Max number to be displayed\n * @default 99\n */\n overflowCount?: number;\n\n /**\n * A Badge can be circular or rounded\n * @default circular\n */\n shape?: 'circular' | 'rounded';\n\n /**\n * If the badge should be shown when count is 0\n * @default false\n */\n showZero?: boolean;\n};\n\nexport type CounterBadgeState = Omit<BadgeState, 'appearance' | 'color' | 'shape'> &\n Required<Pick<CounterBadgeProps, 'appearance' | 'color' | 'count' | 'dot' | 'shape' | 'showZero'>>;\n"],"mappings":"AAAA"}
1
+ {"version":3,"sources":["CounterBadge.types.ts"],"sourcesContent":["import type { BadgeProps, BadgeState } from '../Badge/index';\n\nexport type CounterBadgeProps = Omit<BadgeProps, 'appearance' | 'color' | 'shape'> & {\n /**\n * A Badge can have different appearances that emphasize certain parts of it:\n * - filled: The default appearance if one is not specified.\n * The badge background is filled with color with a contrasting foreground text to match.\n * - ghost: The badge background is transparent, with the foreground text taking color to emphasize it.\n * @default filled\n */\n appearance?: 'filled' | 'ghost';\n\n /**\n * Semantic colors for a counter badge\n * @default brand\n */\n color?: Extract<BadgeProps['color'], 'brand' | 'danger' | 'important' | 'informative'>;\n\n /**\n * Value displayed by the Badge\n * @default 0\n */\n count?: number;\n\n /**\n * If a dot should be displayed without the count\n * @default false\n */\n dot?: boolean;\n\n /**\n * Max number to be displayed\n * @default 99\n */\n overflowCount?: number;\n\n /**\n * A Badge can be circular or rounded\n * @default circular\n */\n shape?: 'circular' | 'rounded';\n\n /**\n * If the badge should be shown when count is 0\n * @default false\n */\n showZero?: boolean;\n};\n\nexport type CounterBadgeState = Omit<BadgeState, 'appearance' | 'color' | 'shape'> &\n Required<Pick<CounterBadgeProps, 'appearance' | 'color' | 'count' | 'dot' | 'shape' | 'showZero'>>;\n"],"names":[],"mappings":"AAAA,WAkDqG"}
@@ -2,4 +2,3 @@ export * from './CounterBadge';
2
2
  export * from './CounterBadge.types';
3
3
  export * from './useCounterBadge';
4
4
  export * from './useCounterBadgeStyles.styles';
5
- //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../../../src/components/CounterBadge/index.ts"],"sourcesContent":["export * from './CounterBadge';\nexport * from './CounterBadge.types';\nexport * from './useCounterBadge';\nexport * from './useCounterBadgeStyles.styles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './CounterBadge';\nexport * from './CounterBadge.types';\nexport * from './useCounterBadge';\nexport * from './useCounterBadgeStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,iBAAiB;AAC/B,cAAc,uBAAuB;AACrC,cAAc,oBAAoB;AAClC,cAAc,iCAAiC"}
@@ -2,27 +2,18 @@ import * as React from 'react';
2
2
  import { useBadge_unstable } from '../Badge/index';
3
3
  /**
4
4
  * Returns the props and state required to render the component
5
- */
6
- export const useCounterBadge_unstable = (props, ref) => {
7
- const {
8
- shape = 'circular',
9
- appearance = 'filled',
10
- showZero = false,
11
- overflowCount = 99,
12
- count = 0,
13
- dot = false
14
- } = props;
15
- const state = {
16
- ...useBadge_unstable(props, ref),
17
- shape,
18
- appearance,
19
- showZero,
20
- count,
21
- dot
22
- };
23
- if ((count !== 0 || showZero) && !dot && !state.root.children) {
24
- state.root.children = count > overflowCount ? `${overflowCount}+` : `${count}`;
25
- }
26
- return state;
5
+ */ export const useCounterBadge_unstable = (props, ref)=>{
6
+ const { shape ='circular' , appearance ='filled' , showZero =false , overflowCount =99 , count =0 , dot =false } = props;
7
+ const state = {
8
+ ...useBadge_unstable(props, ref),
9
+ shape,
10
+ appearance,
11
+ showZero,
12
+ count,
13
+ dot
14
+ };
15
+ if ((count !== 0 || showZero) && !dot && !state.root.children) {
16
+ state.root.children = count > overflowCount ? `${overflowCount}+` : `${count}`;
17
+ }
18
+ return state;
27
19
  };
28
- //# sourceMappingURL=useCounterBadge.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","useBadge_unstable","useCounterBadge_unstable","props","ref","shape","appearance","showZero","overflowCount","count","dot","state","root","children"],"sources":["../../../src/components/CounterBadge/useCounterBadge.ts"],"sourcesContent":["import * as React from 'react';\nimport type { BadgeState } from '../Badge/index';\nimport { useBadge_unstable } from '../Badge/index';\nimport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useCounterBadge_unstable = (props: CounterBadgeProps, ref: React.Ref<HTMLElement>): CounterBadgeState => {\n const {\n shape = 'circular',\n appearance = 'filled',\n showZero = false,\n overflowCount = 99,\n count = 0,\n dot = false,\n } = props;\n\n const state: CounterBadgeState = {\n ...(useBadge_unstable(props, ref) as Pick<CounterBadgeState, keyof BadgeState>),\n shape,\n appearance,\n showZero,\n count,\n dot,\n };\n\n if ((count !== 0 || showZero) && !dot && !state.root.children) {\n state.root.children = count > overflowCount ? `${overflowCount}+` : `${count}`;\n }\n\n return state;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAEvB,SAASC,iBAAiB,QAAQ;AAGlC;;;AAGA,OAAO,MAAMC,wBAAA,GAA2BA,CAACC,KAAA,EAA0BC,GAAA,KAAmD;EACpH,MAAM;IACJC,KAAA,GAAQ;IACRC,UAAA,GAAa;IACbC,QAAA,GAAW,KAAK;IAChBC,aAAA,GAAgB;IAChBC,KAAA,GAAQ;IACRC,GAAA,GAAM;EAAK,CACZ,GAAGP,KAAA;EAEJ,MAAMQ,KAAA,GAA2B;IAC/B,GAAIV,iBAAA,CAAkBE,KAAA,EAAOC,GAAA,CAAI;IACjCC,KAAA;IACAC,UAAA;IACAC,QAAA;IACAE,KAAA;IACAC;EACF;EAEA,IAAI,CAACD,KAAA,KAAU,KAAKF,QAAO,KAAM,CAACG,GAAA,IAAO,CAACC,KAAA,CAAMC,IAAI,CAACC,QAAQ,EAAE;IAC7DF,KAAA,CAAMC,IAAI,CAACC,QAAQ,GAAGJ,KAAA,GAAQD,aAAA,GAAiB,GAAEA,aAAc,GAAE,GAAI,GAAEC,KAAM,EAAC;EAChF;EAEA,OAAOE,KAAA;AACT"}
1
+ {"version":3,"sources":["useCounterBadge.ts"],"sourcesContent":["import * as React from 'react';\nimport type { BadgeState } from '../Badge/index';\nimport { useBadge_unstable } from '../Badge/index';\nimport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useCounterBadge_unstable = (props: CounterBadgeProps, ref: React.Ref<HTMLElement>): CounterBadgeState => {\n const {\n shape = 'circular',\n appearance = 'filled',\n showZero = false,\n overflowCount = 99,\n count = 0,\n dot = false,\n } = props;\n\n const state: CounterBadgeState = {\n ...(useBadge_unstable(props, ref) as Pick<CounterBadgeState, keyof BadgeState>),\n shape,\n appearance,\n showZero,\n count,\n dot,\n };\n\n if ((count !== 0 || showZero) && !dot && !state.root.children) {\n state.root.children = count > overflowCount ? `${overflowCount}+` : `${count}`;\n }\n\n return state;\n};\n"],"names":["React","useBadge_unstable","useCounterBadge_unstable","props","ref","shape","appearance","showZero","overflowCount","count","dot","state","root","children"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,iBAAiB,QAAQ,iBAAiB;AAGnD;;CAEC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC,MAAmD;IACpH,MAAM,EACJC,OAAQ,WAAU,EAClBC,YAAa,SAAQ,EACrBC,UAAW,KAAK,CAAA,EAChBC,eAAgB,GAAE,EAClBC,OAAQ,EAAC,EACTC,KAAM,KAAK,CAAA,EACZ,GAAGP;IAEJ,MAAMQ,QAA2B;QAC/B,GAAIV,kBAAkBE,OAAOC,IAAI;QACjCC;QACAC;QACAC;QACAE;QACAC;IACF;IAEA,IAAI,AAACD,CAAAA,UAAU,KAAKF,QAAO,KAAM,CAACG,OAAO,CAACC,MAAMC,IAAI,CAACC,QAAQ,EAAE;QAC7DF,MAAMC,IAAI,CAACC,QAAQ,GAAGJ,QAAQD,gBAAgB,CAAC,EAAEA,cAAc,CAAC,CAAC,GAAG,CAAC,EAAEC,MAAM,CAAC;IAChF,CAAC;IAED,OAAOE;AACT,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"names":["shorthands","mergeClasses","__styles","useBadgeStyles_unstable","counterBadgeClassNames","root","icon","useStyles","dot","Bf4jedk","a9b677","Bqenvij","z8tnut","z189sj","Byoj8tv","uwmqm3","hide","mc9l5x","d","useCounterBadgeStyles_unstable","state","styles","className","children"],"sources":["../../../src/components/CounterBadge/useCounterBadgeStyles.styles.ts"],"sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { useBadgeStyles_unstable } from '../Badge/useBadgeStyles.styles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { BadgeSlots } from '../Badge/Badge.types';\nimport type { CounterBadgeState } from './CounterBadge.types';\n\nexport const counterBadgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-CounterBadge',\n icon: 'fui-CounterBadge__icon',\n};\n\nconst useStyles = makeStyles({\n dot: {\n minWidth: 'auto',\n width: '6px',\n height: '6px',\n ...shorthands.padding('0'),\n },\n hide: {\n display: 'none',\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const useCounterBadgeStyles_unstable = (state: CounterBadgeState): CounterBadgeState => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n counterBadgeClassNames.root,\n state.dot && styles.dot,\n !state.root.children && !state.dot && styles.hide,\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(counterBadgeClassNames.icon, state.icon.className);\n }\n\n return useBadgeStyles_unstable(state) as CounterBadgeState;\n};\n"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,EAAAC,QAAA,QAAoB;AACrD,SAASC,uBAAuB,QAAQ;AAKxC,OAAO,MAAMC,sBAAA,GAAqD;EAChEC,IAAA,EAAM;EACNC,IAAA,EAAM;AACR;AAEA,MAAMC,SAAA,gBAAYL,QAAA;EAAAM,GAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,IAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,EAUlB;AAEA;;;AAGA,OAAO,MAAMC,8BAAA,GAAkCC,KAAA,IAAgD;EAC7F,MAAMC,MAAA,GAASd,SAAA;EACfa,KAAA,CAAMf,IAAI,CAACiB,SAAS,GAAGrB,YAAA,CACrBG,sBAAA,CAAuBC,IAAI,EAC3Be,KAAA,CAAMZ,GAAG,IAAIa,MAAA,CAAOb,GAAG,EACvB,CAACY,KAAA,CAAMf,IAAI,CAACkB,QAAQ,IAAI,CAACH,KAAA,CAAMZ,GAAG,IAAIa,MAAA,CAAOL,IAAI,EACjDI,KAAA,CAAMf,IAAI,CAACiB,SAAS;EAGtB,IAAIF,KAAA,CAAMd,IAAI,EAAE;IACdc,KAAA,CAAMd,IAAI,CAACgB,SAAS,GAAGrB,YAAA,CAAaG,sBAAA,CAAuBE,IAAI,EAAEc,KAAA,CAAMd,IAAI,CAACgB,SAAS;EACvF;EAEA,OAAOnB,uBAAA,CAAwBiB,KAAA;AACjC"}
1
+ {"version":3,"names":["shorthands","mergeClasses","__styles","useBadgeStyles_unstable","counterBadgeClassNames","root","icon","useStyles","dot","Bf4jedk","a9b677","Bqenvij","z8tnut","z189sj","Byoj8tv","uwmqm3","hide","mc9l5x","d","useCounterBadgeStyles_unstable","state","styles","className","children"],"sources":["useCounterBadgeStyles.styles.js"],"sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { useBadgeStyles_unstable } from '../Badge/useBadgeStyles.styles';\nexport const counterBadgeClassNames = {\n root: 'fui-CounterBadge',\n icon: 'fui-CounterBadge__icon'\n};\nconst useStyles = makeStyles({\n dot: {\n minWidth: 'auto',\n width: '6px',\n height: '6px',\n ...shorthands.padding('0')\n },\n hide: {\n display: 'none'\n }\n});\n/**\n * Applies style classnames to slots\n */ export const useCounterBadgeStyles_unstable = (state)=>{\n const styles = useStyles();\n state.root.className = mergeClasses(counterBadgeClassNames.root, state.dot && styles.dot, !state.root.children && !state.dot && styles.hide, state.root.className);\n if (state.icon) {\n state.icon.className = mergeClasses(counterBadgeClassNames.icon, state.icon.className);\n }\n return useBadgeStyles_unstable(state);\n};\n"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,EAAAC,QAAA,QAAoB,gBAAgB;AACrE,SAASC,uBAAuB,QAAQ,gCAAgC;AACxE,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE,kBAAkB;EACxBC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGL,QAAA;EAAAM,GAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,IAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAUjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,8BAA8B,GAAIC,KAAK,IAAG;EACvD,MAAMC,MAAM,GAAGd,SAAS,CAAC,CAAC;EAC1Ba,KAAK,CAACf,IAAI,CAACiB,SAAS,GAAGrB,YAAY,CAACG,sBAAsB,CAACC,IAAI,EAAEe,KAAK,CAACZ,GAAG,IAAIa,MAAM,CAACb,GAAG,EAAE,CAACY,KAAK,CAACf,IAAI,CAACkB,QAAQ,IAAI,CAACH,KAAK,CAACZ,GAAG,IAAIa,MAAM,CAACL,IAAI,EAAEI,KAAK,CAACf,IAAI,CAACiB,SAAS,CAAC;EAClK,IAAIF,KAAK,CAACd,IAAI,EAAE;IACZc,KAAK,CAACd,IAAI,CAACgB,SAAS,GAAGrB,YAAY,CAACG,sBAAsB,CAACE,IAAI,EAAEc,KAAK,CAACd,IAAI,CAACgB,SAAS,CAAC;EAC1F;EACA,OAAOnB,uBAAuB,CAACiB,KAAK,CAAC;AACzC,CAAC"}
@@ -5,12 +5,10 @@ import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
5
5
  import { renderBadge_unstable } from '../../Badge';
6
6
  /**
7
7
  * Define a styled Badge, using the `useBadge_unstable` hook.
8
- */
9
- export const PresenceBadge = /*#__PURE__*/React.forwardRef((props, ref) => {
10
- const state = usePresenceBadge_unstable(props, ref);
11
- usePresenceBadgeStyles_unstable(state);
12
- useCustomStyleHook_unstable('usePresenceBadgeStyles_unstable')(state);
13
- return renderBadge_unstable(state);
8
+ */ export const PresenceBadge = /*#__PURE__*/ React.forwardRef((props, ref)=>{
9
+ const state = usePresenceBadge_unstable(props, ref);
10
+ usePresenceBadgeStyles_unstable(state);
11
+ useCustomStyleHook_unstable('usePresenceBadgeStyles_unstable')(state);
12
+ return renderBadge_unstable(state);
14
13
  });
15
14
  PresenceBadge.displayName = 'PresenceBadge';
16
- //# sourceMappingURL=PresenceBadge.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","usePresenceBadge_unstable","usePresenceBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","PresenceBadge","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/PresenceBadge/PresenceBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePresenceBadge_unstable } from './usePresenceBadge';\nimport { usePresenceBadgeStyles_unstable } from './usePresenceBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from '../../Badge';\nimport type { PresenceBadgeProps } from './PresenceBadge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled Badge, using the `useBadge_unstable` hook.\n */\nexport const PresenceBadge: ForwardRefComponent<PresenceBadgeProps> = React.forwardRef((props, ref) => {\n const state = usePresenceBadge_unstable(props, ref);\n\n usePresenceBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('usePresenceBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nPresenceBadge.displayName = 'PresenceBadge';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,+BAA+B,QAAQ;AAChD,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,oBAAoB,QAAQ;AAIrC;;;AAGA,OAAO,MAAMC,aAAA,gBAAyDL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACrG,MAAMC,KAAA,GAAQR,yBAAA,CAA0BM,KAAA,EAAOC,GAAA;EAE/CN,+BAAA,CAAgCO,KAAA;EAEhCN,2BAAA,CAA4B,mCAAmCM,KAAA;EAE/D,OAAOL,oBAAA,CAAqBK,KAAA;AAC9B;AAEAJ,aAAA,CAAcK,WAAW,GAAG"}
1
+ {"version":3,"sources":["PresenceBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePresenceBadge_unstable } from './usePresenceBadge';\nimport { usePresenceBadgeStyles_unstable } from './usePresenceBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from '../../Badge';\nimport type { PresenceBadgeProps } from './PresenceBadge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled Badge, using the `useBadge_unstable` hook.\n */\nexport const PresenceBadge: ForwardRefComponent<PresenceBadgeProps> = React.forwardRef((props, ref) => {\n const state = usePresenceBadge_unstable(props, ref);\n\n usePresenceBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('usePresenceBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nPresenceBadge.displayName = 'PresenceBadge';\n"],"names":["React","usePresenceBadge_unstable","usePresenceBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","PresenceBadge","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,+BAA+B,QAAQ,kCAAkC;AAClF,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,oBAAoB,QAAQ,cAAc;AAInD;;CAEC,GACD,OAAO,MAAMC,8BAAyDL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACrG,MAAMC,QAAQR,0BAA0BM,OAAOC;IAE/CN,gCAAgCO;IAEhCN,4BAA4B,mCAAmCM;IAE/D,OAAOL,qBAAqBK;AAC9B,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}
@@ -1,2 +1 @@
1
- export {};
2
- //# sourceMappingURL=PresenceBadge.types.js.map
1
+ export { };
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../../../src/components/PresenceBadge/PresenceBadge.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState, BadgeSlots } from '../Badge/Badge.types';\n\nexport type PresenceBadgeStatus =\n | 'busy'\n | 'out-of-office'\n | 'away'\n | 'available'\n | 'offline'\n | 'do-not-disturb'\n | 'unknown'\n | 'blocked';\n\nexport type PresenceBadgeProps = Omit<ComponentProps<Pick<BadgeSlots, 'root' | 'icon'>>, 'color'> &\n Pick<BadgeProps, 'size'> & {\n /**\n * Represents several status\n * @default available\n */\n status?: PresenceBadgeStatus;\n\n /**\n * Modifies the display to indicate that the user is out of office.\n * This can be combined with any status to display an out-of-office version of that status\n * @default false\n */\n outOfOffice?: boolean;\n };\n\nexport type PresenceBadgeState = ComponentState<BadgeSlots> &\n BadgeState &\n Required<Pick<PresenceBadgeProps, 'status' | 'outOfOffice'>>;\n"],"mappings":"AAAA"}
1
+ {"version":3,"sources":["PresenceBadge.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState, BadgeSlots } from '../Badge/Badge.types';\n\nexport type PresenceBadgeStatus =\n | 'busy'\n | 'out-of-office'\n | 'away'\n | 'available'\n | 'offline'\n | 'do-not-disturb'\n | 'unknown'\n | 'blocked';\n\nexport type PresenceBadgeProps = Omit<ComponentProps<Pick<BadgeSlots, 'root' | 'icon'>>, 'color'> &\n Pick<BadgeProps, 'size'> & {\n /**\n * Represents several status\n * @default available\n */\n status?: PresenceBadgeStatus;\n\n /**\n * Modifies the display to indicate that the user is out of office.\n * This can be combined with any status to display an out-of-office version of that status\n * @default false\n */\n outOfOffice?: boolean;\n };\n\nexport type PresenceBadgeState = ComponentState<BadgeSlots> &\n BadgeState &\n Required<Pick<PresenceBadgeProps, 'status' | 'outOfOffice'>>;\n"],"names":[],"mappings":"AAAA,WA+B+D"}
@@ -2,4 +2,3 @@ export * from './PresenceBadge';
2
2
  export * from './PresenceBadge.types';
3
3
  export * from './usePresenceBadge';
4
4
  export * from './usePresenceBadgeStyles.styles';
5
- //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../../../src/components/PresenceBadge/index.ts"],"sourcesContent":["export * from './PresenceBadge';\nexport * from './PresenceBadge.types';\nexport * from './usePresenceBadge';\nexport * from './usePresenceBadgeStyles.styles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './PresenceBadge';\nexport * from './PresenceBadge.types';\nexport * from './usePresenceBadge';\nexport * from './usePresenceBadgeStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,kBAAkB;AAChC,cAAc,wBAAwB;AACtC,cAAc,qBAAqB;AACnC,cAAc,kCAAkC"}