@fluentui/react-badge 0.0.0-nightlyff78d1e27a20220217.1 → 0.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (91) hide show
  1. package/CHANGELOG.json +407 -12
  2. package/CHANGELOG.md +238 -104
  3. package/MIGRATION.md +59 -0
  4. package/README.md +40 -2
  5. package/Spec.md +11 -74
  6. package/dist/{react-badge.d.ts → index.d.ts} +42 -42
  7. package/{lib → dist}/tsdoc-metadata.json +0 -0
  8. package/lib/components/Badge/Badge.js.map +1 -1
  9. package/lib/components/Badge/Badge.types.js.map +1 -1
  10. package/lib/components/Badge/renderBadge.js.map +1 -1
  11. package/lib/components/Badge/useBadge.js +0 -1
  12. package/lib/components/Badge/useBadge.js.map +1 -1
  13. package/lib/components/Badge/useBadgeStyles.js +6 -3
  14. package/lib/components/Badge/useBadgeStyles.js.map +1 -1
  15. package/lib/components/CounterBadge/CounterBadge.js.map +1 -1
  16. package/lib/components/CounterBadge/CounterBadge.types.js.map +1 -1
  17. package/lib/components/CounterBadge/useCounterBadge.js +1 -2
  18. package/lib/components/CounterBadge/useCounterBadge.js.map +1 -1
  19. package/lib/components/CounterBadge/useCounterBadgeStyles.js +10 -2
  20. package/lib/components/CounterBadge/useCounterBadgeStyles.js.map +1 -1
  21. package/lib/components/PresenceBadge/PresenceBadge.js.map +1 -1
  22. package/lib/components/PresenceBadge/PresenceBadge.types.js.map +1 -1
  23. package/lib/components/PresenceBadge/presenceIcons.js.map +1 -1
  24. package/lib/components/PresenceBadge/usePresenceBadge.js +23 -7
  25. package/lib/components/PresenceBadge/usePresenceBadge.js.map +1 -1
  26. package/lib/components/PresenceBadge/usePresenceBadgeStyles.js +19 -2
  27. package/lib/components/PresenceBadge/usePresenceBadgeStyles.js.map +1 -1
  28. package/lib/index.js +3 -5
  29. package/lib/index.js.map +1 -1
  30. package/lib-commonjs/components/Badge/Badge.js.map +1 -1
  31. package/lib-commonjs/components/Badge/renderBadge.js.map +1 -1
  32. package/lib-commonjs/components/Badge/useBadge.js +0 -1
  33. package/lib-commonjs/components/Badge/useBadge.js.map +1 -1
  34. package/lib-commonjs/components/Badge/useBadgeStyles.js +7 -4
  35. package/lib-commonjs/components/Badge/useBadgeStyles.js.map +1 -1
  36. package/lib-commonjs/components/CounterBadge/CounterBadge.js.map +1 -1
  37. package/lib-commonjs/components/CounterBadge/useCounterBadge.js +1 -2
  38. package/lib-commonjs/components/CounterBadge/useCounterBadge.js.map +1 -1
  39. package/lib-commonjs/components/CounterBadge/useCounterBadgeStyles.js +11 -3
  40. package/lib-commonjs/components/CounterBadge/useCounterBadgeStyles.js.map +1 -1
  41. package/lib-commonjs/components/PresenceBadge/PresenceBadge.js.map +1 -1
  42. package/lib-commonjs/components/PresenceBadge/presenceIcons.js.map +1 -1
  43. package/lib-commonjs/components/PresenceBadge/usePresenceBadge.js +23 -7
  44. package/lib-commonjs/components/PresenceBadge/usePresenceBadge.js.map +1 -1
  45. package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.js +20 -3
  46. package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.js.map +1 -1
  47. package/lib-commonjs/index.js +82 -6
  48. package/lib-commonjs/index.js.map +1 -1
  49. package/package.json +18 -23
  50. package/lib/Badge.d.ts +0 -1
  51. package/lib/CounterBadge.d.ts +0 -1
  52. package/lib/PresenceBadge.d.ts +0 -1
  53. package/lib/components/Badge/Badge.d.ts +0 -6
  54. package/lib/components/Badge/Badge.types.d.ts +0 -34
  55. package/lib/components/Badge/index.d.ts +0 -5
  56. package/lib/components/Badge/renderBadge.d.ts +0 -2
  57. package/lib/components/Badge/useBadge.d.ts +0 -6
  58. package/lib/components/Badge/useBadgeStyles.d.ts +0 -6
  59. package/lib/components/CounterBadge/CounterBadge.d.ts +0 -6
  60. package/lib/components/CounterBadge/CounterBadge.types.d.ts +0 -41
  61. package/lib/components/CounterBadge/index.d.ts +0 -4
  62. package/lib/components/CounterBadge/useCounterBadge.d.ts +0 -6
  63. package/lib/components/CounterBadge/useCounterBadgeStyles.d.ts +0 -6
  64. package/lib/components/PresenceBadge/PresenceBadge.d.ts +0 -6
  65. package/lib/components/PresenceBadge/PresenceBadge.types.d.ts +0 -19
  66. package/lib/components/PresenceBadge/index.d.ts +0 -4
  67. package/lib/components/PresenceBadge/presenceIcons.d.ts +0 -11
  68. package/lib/components/PresenceBadge/usePresenceBadge.d.ts +0 -6
  69. package/lib/components/PresenceBadge/usePresenceBadgeStyles.d.ts +0 -6
  70. package/lib/index.d.ts +0 -5
  71. package/lib-commonjs/Badge.d.ts +0 -1
  72. package/lib-commonjs/CounterBadge.d.ts +0 -1
  73. package/lib-commonjs/PresenceBadge.d.ts +0 -1
  74. package/lib-commonjs/components/Badge/Badge.d.ts +0 -6
  75. package/lib-commonjs/components/Badge/Badge.types.d.ts +0 -34
  76. package/lib-commonjs/components/Badge/index.d.ts +0 -5
  77. package/lib-commonjs/components/Badge/renderBadge.d.ts +0 -2
  78. package/lib-commonjs/components/Badge/useBadge.d.ts +0 -6
  79. package/lib-commonjs/components/Badge/useBadgeStyles.d.ts +0 -6
  80. package/lib-commonjs/components/CounterBadge/CounterBadge.d.ts +0 -6
  81. package/lib-commonjs/components/CounterBadge/CounterBadge.types.d.ts +0 -41
  82. package/lib-commonjs/components/CounterBadge/index.d.ts +0 -4
  83. package/lib-commonjs/components/CounterBadge/useCounterBadge.d.ts +0 -6
  84. package/lib-commonjs/components/CounterBadge/useCounterBadgeStyles.d.ts +0 -6
  85. package/lib-commonjs/components/PresenceBadge/PresenceBadge.d.ts +0 -6
  86. package/lib-commonjs/components/PresenceBadge/PresenceBadge.types.d.ts +0 -19
  87. package/lib-commonjs/components/PresenceBadge/index.d.ts +0 -4
  88. package/lib-commonjs/components/PresenceBadge/presenceIcons.d.ts +0 -11
  89. package/lib-commonjs/components/PresenceBadge/usePresenceBadge.d.ts +0 -6
  90. package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.d.ts +0 -6
  91. package/lib-commonjs/index.d.ts +0 -5
@@ -24,33 +24,49 @@ const iconMap = (status, outOfOffice, size) => {
24
24
  case 'busy':
25
25
  return outOfOffice ? presenceIcons_1.presenceUnknownRegular[size] : presenceIcons_1.presenceBusyFilled[size];
26
26
 
27
- case 'doNotDisturb':
27
+ case 'do-not-disturb':
28
28
  return outOfOffice ? presenceIcons_1.presenceDndRegular[size] : presenceIcons_1.presenceDndFilled[size];
29
29
 
30
30
  case 'offline':
31
31
  return presenceIcons_1.presenceOfflineRegular[size];
32
32
 
33
- case 'outOfOffice':
33
+ case 'out-of-office':
34
34
  return presenceIcons_1.presenceOofRegular[size];
35
+
36
+ case 'unknown':
37
+ return presenceIcons_1.presenceUnknownRegular[size];
35
38
  }
36
39
  };
40
+
41
+ const DEFAULT_STRINGS = {
42
+ busy: 'busy',
43
+ 'out-of-office': 'out of office',
44
+ away: 'away',
45
+ available: 'available',
46
+ offline: 'offline',
47
+ 'do-not-disturb': 'do not disturb',
48
+ unknown: 'unknown'
49
+ };
37
50
  /**
38
51
  * Returns the props and state required to render the component
39
52
  */
40
53
 
41
-
42
54
  const usePresenceBadge_unstable = (props, ref) => {
43
- var _a, _b;
55
+ var _a, _b, _c;
44
56
 
57
+ const statusText = DEFAULT_STRINGS[(_a = props.status) !== null && _a !== void 0 ? _a : 'available'];
58
+ const oofText = props.outOfOffice && props.status !== 'out-of-office' ? ` ${DEFAULT_STRINGS['out-of-office']}` : '';
45
59
  const state = { ...index_1.useBadge_unstable({
46
60
  size: 'medium',
61
+ 'aria-label': statusText + oofText,
62
+ role: 'img',
47
63
  ...props,
48
- icon: react_utilities_1.resolveShorthand(undefined, {
64
+ icon: react_utilities_1.resolveShorthand(props.icon, {
49
65
  required: true
50
66
  })
51
67
  }, ref),
52
- status: (_a = props.status) !== null && _a !== void 0 ? _a : 'available',
53
- outOfOffice: (_b = props.outOfOffice) !== null && _b !== void 0 ? _b : false
68
+ status: (_b = props.status) !== null && _b !== void 0 ? _b : 'available',
69
+ outOfOffice: (_c = props.outOfOffice) !== null && _c !== void 0 ? _c : false
54
70
  };
55
71
  const IconElement = iconMap(state.status, state.outOfOffice, state.size);
56
72
 
@@ -1 +1 @@
1
- {"version":3,"sources":["components/PresenceBadge/usePresenceBadge.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AAWA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AAGA,MAAM,OAAO,GAAG,CACd,MADc,EAEd,WAFc,EAGd,IAHc,KAIoB;AAClC,UAAQ,MAAR;AACE,SAAK,WAAL;AACE,aAAO,WAAW,GAAG,eAAA,CAAA,wBAAA,CAAyB,IAAzB,CAAH,GAAoC,eAAA,CAAA,uBAAA,CAAwB,IAAxB,CAAtD;;AACF,SAAK,MAAL;AACE,aAAO,WAAW,GAAG,eAAA,CAAA,sBAAA,CAAuB,IAAvB,CAAH,GAAkC,eAAA,CAAA,kBAAA,CAAmB,IAAnB,CAApD;;AACF,SAAK,MAAL;AACE,aAAO,WAAW,GAAG,eAAA,CAAA,sBAAA,CAAuB,IAAvB,CAAH,GAAkC,eAAA,CAAA,kBAAA,CAAmB,IAAnB,CAApD;;AACF,SAAK,cAAL;AACE,aAAO,WAAW,GAAG,eAAA,CAAA,kBAAA,CAAmB,IAAnB,CAAH,GAA8B,eAAA,CAAA,iBAAA,CAAkB,IAAlB,CAAhD;;AACF,SAAK,SAAL;AACE,aAAO,eAAA,CAAA,sBAAA,CAAuB,IAAvB,CAAP;;AACF,SAAK,aAAL;AACE,aAAO,eAAA,CAAA,kBAAA,CAAmB,IAAnB,CAAP;AAZJ;AAcD,CAnBD;AAqBA;;AAEG;;;AACI,MAAM,yBAAyB,GAAG,CACvC,KADuC,EAEvC,GAFuC,KAGjB;;;AACtB,QAAM,KAAK,GAAuB,EAChC,GAAG,OAAA,CAAA,iBAAA,CACD;AACE,MAAA,IAAI,EAAE,QADR;AAEE,SAAG,KAFL;AAGE,MAAA,IAAI,EAAE,iBAAA,CAAA,gBAAA,CAAiB,SAAjB,EAAkD;AACtD,QAAA,QAAQ,EAAE;AAD4C,OAAlD;AAHR,KADC,EAQD,GARC,CAD6B;AAWhC,IAAA,MAAM,EAAE,CAAA,EAAA,GAAA,KAAK,CAAC,MAAN,MAAY,IAAZ,IAAY,EAAA,KAAA,KAAA,CAAZ,GAAY,EAAZ,GAAgB,WAXQ;AAYhC,IAAA,WAAW,EAAE,CAAA,EAAA,GAAA,KAAK,CAAC,WAAN,MAAiB,IAAjB,IAAiB,EAAA,KAAA,KAAA,CAAjB,GAAiB,EAAjB,GAAqB;AAZF,GAAlC;AAeA,QAAM,WAAW,GAAG,OAAO,CAAC,KAAK,CAAC,MAAP,EAAe,KAAK,CAAC,WAArB,EAAkC,KAAK,CAAC,IAAxC,CAA3B;;AACA,MAAI,WAAJ,EAAiB;AACf,IAAA,KAAK,CAAC,IAAN,CAAY,QAAZ,GAAuB,KAAA,CAAA,aAAA,CAAC,WAAD,EAAY,IAAZ,CAAvB;AACD;;AAED,SAAO,KAAP;AACD,CAzBM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport {\n presenceAvailableFilled,\n presenceAvailableRegular,\n presenceAwayFilled,\n presenceBusyFilled,\n presenceDndFilled,\n presenceDndRegular,\n presenceOfflineRegular,\n presenceOofRegular,\n presenceUnknownRegular,\n} from './presenceIcons';\nimport { useBadge_unstable, BadgeProps } from '../Badge/index';\nimport type { PresenceBadgeProps, PresenceBadgeState } from './PresenceBadge.types';\n\nconst iconMap = (\n status: PresenceBadgeState['status'],\n outOfOffice: boolean,\n size: PresenceBadgeState['size'],\n): React.FunctionComponent | null => {\n switch (status) {\n case 'available':\n return outOfOffice ? presenceAvailableRegular[size] : presenceAvailableFilled[size];\n case 'away':\n return outOfOffice ? presenceOfflineRegular[size] : presenceAwayFilled[size];\n case 'busy':\n return outOfOffice ? presenceUnknownRegular[size] : presenceBusyFilled[size];\n case 'doNotDisturb':\n return outOfOffice ? presenceDndRegular[size] : presenceDndFilled[size];\n case 'offline':\n return presenceOfflineRegular[size];\n case 'outOfOffice':\n return presenceOofRegular[size];\n }\n};\n\n/**\n * Returns the props and state required to render the component\n */\nexport const usePresenceBadge_unstable = (\n props: PresenceBadgeProps,\n ref: React.Ref<HTMLElement>,\n): PresenceBadgeState => {\n const state: PresenceBadgeState = {\n ...useBadge_unstable(\n {\n size: 'medium',\n ...props,\n icon: resolveShorthand(undefined as BadgeProps['icon'], {\n required: true,\n }),\n },\n ref,\n ),\n status: props.status ?? 'available',\n outOfOffice: props.outOfOffice ?? false,\n };\n\n const IconElement = iconMap(state.status, state.outOfOffice, state.size);\n if (IconElement) {\n state.icon!.children = <IconElement />;\n }\n\n return state;\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["components/PresenceBadge/usePresenceBadge.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport {\n presenceAvailableFilled,\n presenceAvailableRegular,\n presenceAwayFilled,\n presenceBusyFilled,\n presenceDndFilled,\n presenceDndRegular,\n presenceOfflineRegular,\n presenceOofRegular,\n presenceUnknownRegular,\n} from './presenceIcons';\nimport { useBadge_unstable } from '../Badge/index';\nimport type { PresenceBadgeProps, PresenceBadgeState } from './PresenceBadge.types';\n\nconst iconMap = (\n status: PresenceBadgeState['status'],\n outOfOffice: boolean,\n size: PresenceBadgeState['size'],\n): React.FunctionComponent | null => {\n switch (status) {\n case 'available':\n return outOfOffice ? presenceAvailableRegular[size] : presenceAvailableFilled[size];\n case 'away':\n return outOfOffice ? presenceOfflineRegular[size] : presenceAwayFilled[size];\n case 'busy':\n return outOfOffice ? presenceUnknownRegular[size] : presenceBusyFilled[size];\n case 'do-not-disturb':\n return outOfOffice ? presenceDndRegular[size] : presenceDndFilled[size];\n case 'offline':\n return presenceOfflineRegular[size];\n case 'out-of-office':\n return presenceOofRegular[size];\n case 'unknown':\n return presenceUnknownRegular[size];\n }\n};\n\nconst DEFAULT_STRINGS = {\n busy: 'busy',\n 'out-of-office': 'out of office',\n away: 'away',\n available: 'available',\n offline: 'offline',\n 'do-not-disturb': 'do not disturb',\n unknown: 'unknown',\n};\n\n/**\n * Returns the props and state required to render the component\n */\nexport const usePresenceBadge_unstable = (\n props: PresenceBadgeProps,\n ref: React.Ref<HTMLElement>,\n): PresenceBadgeState => {\n const statusText = DEFAULT_STRINGS[props.status ?? 'available'];\n const oofText = props.outOfOffice && props.status !== 'out-of-office' ? ` ${DEFAULT_STRINGS['out-of-office']}` : '';\n const state: PresenceBadgeState = {\n ...useBadge_unstable(\n {\n size: 'medium',\n 'aria-label': statusText + oofText,\n role: 'img',\n ...props,\n icon: resolveShorthand(props.icon, {\n required: true,\n }),\n },\n ref,\n ),\n status: props.status ?? 'available',\n outOfOffice: props.outOfOffice ?? false,\n };\n\n const IconElement = iconMap(state.status, state.outOfOffice, state.size);\n if (IconElement) {\n state.icon!.children = <IconElement />;\n }\n\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -3,13 +3,24 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.usePresenceBadgeStyles_unstable = exports.presenceBadgeClassName = void 0;
6
+ exports.usePresenceBadgeStyles_unstable = exports.presenceBadgeClassNames = void 0;
7
7
 
8
8
  const react_1 = /*#__PURE__*/require("@griffel/react");
9
9
 
10
10
  const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
11
11
 
12
- exports.presenceBadgeClassName = 'fui-PresenceBadge';
12
+ exports.presenceBadgeClassNames = {
13
+ root: 'fui-PresenceBadge',
14
+ icon: 'fui-PresenceBadge__icon'
15
+ };
16
+
17
+ const getIsBusy = status => {
18
+ if (status === 'busy' || status === 'do-not-disturb' || status === 'unknown') {
19
+ return true;
20
+ }
21
+
22
+ return false;
23
+ };
13
24
 
14
25
  const useStyles = /*#__PURE__*/react_1.__styles({
15
26
  "root": {
@@ -83,7 +94,13 @@ const useStyles = /*#__PURE__*/react_1.__styles({
83
94
 
84
95
  const usePresenceBadgeStyles_unstable = state => {
85
96
  const styles = useStyles();
86
- state.root.className = react_1.mergeClasses(exports.presenceBadgeClassName, styles.root, (state.status === 'busy' || state.status === 'doNotDisturb') && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'outOfOffice' && styles.statusOutOfOffice, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && (state.status === 'busy' || state.status === 'doNotDisturb') && styles.outOfOfficeBusy, state.outOfOffice && state.status === 'away' && styles.outOfOfficeAway, state.outOfOffice && state.status === 'offline' && styles.statusOffline, state.outOfOffice && state.status === 'outOfOffice' && styles.statusOutOfOffice, state.size === 'tiny' && styles.tiny, state.size === 'large' && styles.large, state.size === 'extra-large' && styles.extraLarge, state.root.className);
97
+ const isBusy = getIsBusy(state.status);
98
+ state.root.className = react_1.mergeClasses(exports.presenceBadgeClassNames.root, styles.root, isBusy && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'out-of-office' && styles.statusOutOfOffice, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && isBusy && styles.outOfOfficeBusy, state.outOfOffice && state.status === 'away' && styles.outOfOfficeAway, state.outOfOffice && state.status === 'offline' && styles.statusOffline, state.outOfOffice && state.status === 'out-of-office' && styles.statusOutOfOffice, state.size === 'tiny' && styles.tiny, state.size === 'large' && styles.large, state.size === 'extra-large' && styles.extraLarge, state.root.className);
99
+
100
+ if (state.icon) {
101
+ state.icon.className = react_1.mergeClasses(exports.presenceBadgeClassNames.icon, state.icon.className);
102
+ }
103
+
87
104
  return state;
88
105
  };
89
106
 
@@ -1 +1 @@
1
- {"version":3,"sources":["components/PresenceBadge/usePresenceBadgeStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAGa,OAAA,CAAA,sBAAA,GAAyB,mBAAzB;;AAEb,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAuEA;;AAEG;;;AACI,MAAM,+BAA+B,GAAI,KAAD,IAAkD;AAC/F,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,sBADqB,EAErB,MAAM,CAAC,IAFc,EAGrB,CAAC,KAAK,CAAC,MAAN,KAAiB,MAAjB,IAA2B,KAAK,CAAC,MAAN,KAAiB,cAA7C,KAAgE,MAAM,CAAC,UAHlD,EAIrB,KAAK,CAAC,MAAN,KAAiB,MAAjB,IAA2B,MAAM,CAAC,UAJb,EAKrB,KAAK,CAAC,MAAN,KAAiB,WAAjB,IAAgC,MAAM,CAAC,eALlB,EAMrB,KAAK,CAAC,MAAN,KAAiB,SAAjB,IAA8B,MAAM,CAAC,aANhB,EAOrB,KAAK,CAAC,MAAN,KAAiB,aAAjB,IAAkC,MAAM,CAAC,iBAPpB,EAQrB,KAAK,CAAC,WAAN,IAAqB,MAAM,CAAC,WARP,EASrB,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,WAAtC,IAAqD,MAAM,CAAC,oBATvC,EAUrB,KAAK,CAAC,WAAN,KAAsB,KAAK,CAAC,MAAN,KAAiB,MAAjB,IAA2B,KAAK,CAAC,MAAN,KAAiB,cAAlE,KAAqF,MAAM,CAAC,eAVvE,EAWrB,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,MAAtC,IAAgD,MAAM,CAAC,eAXlC,EAYrB,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,SAAtC,IAAmD,MAAM,CAAC,aAZrC,EAarB,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,aAAtC,IAAuD,MAAM,CAAC,iBAbzC,EAcrB,KAAK,CAAC,IAAN,KAAe,MAAf,IAAyB,MAAM,CAAC,IAdX,EAerB,KAAK,CAAC,IAAN,KAAe,OAAf,IAA0B,MAAM,CAAC,KAfZ,EAgBrB,KAAK,CAAC,IAAN,KAAe,aAAf,IAAgC,MAAM,CAAC,UAhBlB,EAiBrB,KAAK,CAAC,IAAN,CAAW,SAjBU,CAAvB;AAoBA,SAAO,KAAP;AACD,CAvBM;;AAAM,OAAA,CAAA,+BAAA,GAA+B,+BAA/B","sourcesContent":["import { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { PresenceBadgeState } from './PresenceBadge.types';\n\nexport const presenceBadgeClassName = 'fui-PresenceBadge';\n\nconst useStyles = makeStyles({\n root: {\n ...shorthands.padding(0),\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n\n '& span': {\n display: 'flex',\n },\n ...shorthands.borderRadius('50%'),\n backgroundColor: tokens.colorNeutralBackground1,\n },\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 outOfOffice: {\n color: tokens.colorNeutralBackground1,\n },\n outOfOfficeAvailable: {\n color: tokens.colorPaletteLightGreenForeground3,\n },\n outOfOfficeBusy: {\n color: tokens.colorPaletteRedBackground3,\n },\n outOfOfficeAway: {\n color: tokens.colorPaletteMarigoldBackground3,\n },\n\n // Icons are not resizeable, and these sizes are currently missing\n // use `!important` to size the currently available icons to the missing ones\n //\n tiny: {\n aspectRatio: '1',\n width: '6px',\n '& svg': {\n width: '6px !important',\n height: '6px !important',\n },\n },\n large: {\n aspectRatio: '1',\n width: '20px',\n '& svg': {\n width: '20px !important',\n height: '20px !important',\n },\n },\n extraLarge: {\n aspectRatio: '1',\n width: '28px',\n '& svg': {\n width: '28px !important',\n height: '28px !important',\n },\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const usePresenceBadgeStyles_unstable = (state: PresenceBadgeState): PresenceBadgeState => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n presenceBadgeClassName,\n styles.root,\n (state.status === 'busy' || state.status === 'doNotDisturb') && styles.statusBusy,\n state.status === 'away' && styles.statusAway,\n state.status === 'available' && styles.statusAvailable,\n state.status === 'offline' && styles.statusOffline,\n state.status === 'outOfOffice' && styles.statusOutOfOffice,\n state.outOfOffice && styles.outOfOffice,\n state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable,\n state.outOfOffice && (state.status === 'busy' || state.status === 'doNotDisturb') && styles.outOfOfficeBusy,\n state.outOfOffice && state.status === 'away' && styles.outOfOfficeAway,\n state.outOfOffice && state.status === 'offline' && styles.statusOffline,\n state.outOfOffice && state.status === 'outOfOffice' && styles.statusOutOfOffice,\n state.size === 'tiny' && styles.tiny,\n state.size === 'large' && styles.large,\n state.size === 'extra-large' && styles.extraLarge,\n state.root.className,\n );\n\n return state;\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["components/PresenceBadge/usePresenceBadgeStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAKa,OAAA,CAAA,uBAAA,GAAsD;EACjE,IAAI,EAAE,mBAD2D;EAEjE,IAAI,EAAE;AAF2D,CAAtD;;AAKb,MAAM,SAAS,GAAI,MAAD,IAAyC;EACzD,IAAI,MAAM,KAAK,MAAX,IAAqB,MAAM,KAAK,gBAAhC,IAAoD,MAAM,KAAK,SAAnE,EAA8E;IAC5E,OAAO,IAAP;EACD;;EAED,OAAO,KAAP;AACD,CAND;;AAQA,MAAM,SAAS,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAlB;AAuEA;;AAEG;;;AACI,MAAM,+BAA+B,GAAI,KAAD,IAAkD;EAC/F,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,MAAM,MAAM,GAAG,SAAS,CAAC,KAAK,CAAC,MAAP,CAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,uBAAA,CAAwB,IADH,EAErB,MAAM,CAAC,IAFc,EAGrB,MAAM,IAAI,MAAM,CAAC,UAHI,EAIrB,KAAK,CAAC,MAAN,KAAiB,MAAjB,IAA2B,MAAM,CAAC,UAJb,EAKrB,KAAK,CAAC,MAAN,KAAiB,WAAjB,IAAgC,MAAM,CAAC,eALlB,EAMrB,KAAK,CAAC,MAAN,KAAiB,SAAjB,IAA8B,MAAM,CAAC,aANhB,EAOrB,KAAK,CAAC,MAAN,KAAiB,eAAjB,IAAoC,MAAM,CAAC,iBAPtB,EAQrB,KAAK,CAAC,WAAN,IAAqB,MAAM,CAAC,WARP,EASrB,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,WAAtC,IAAqD,MAAM,CAAC,oBATvC,EAUrB,KAAK,CAAC,WAAN,IAAqB,MAArB,IAA+B,MAAM,CAAC,eAVjB,EAWrB,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,MAAtC,IAAgD,MAAM,CAAC,eAXlC,EAYrB,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,SAAtC,IAAmD,MAAM,CAAC,aAZrC,EAarB,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,eAAtC,IAAyD,MAAM,CAAC,iBAb3C,EAcrB,KAAK,CAAC,IAAN,KAAe,MAAf,IAAyB,MAAM,CAAC,IAdX,EAerB,KAAK,CAAC,IAAN,KAAe,OAAf,IAA0B,MAAM,CAAC,KAfZ,EAgBrB,KAAK,CAAC,IAAN,KAAe,aAAf,IAAgC,MAAM,CAAC,UAhBlB,EAiBrB,KAAK,CAAC,IAAN,CAAW,SAjBU,CAAvB;;EAoBA,IAAI,KAAK,CAAC,IAAV,EAAgB;IACd,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,uBAAA,CAAwB,IAArC,EAA2C,KAAK,CAAC,IAAN,CAAW,SAAtD,CAAvB;EACD;;EAED,OAAO,KAAP;AACD,CA5BM;;AAAM,OAAA,CAAA,+BAAA,GAA+B,+BAA/B","sourcesContent":["import { mergeClasses, makeStyles, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { BadgeSlots } from '../Badge/Badge.types';\nimport type { PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\n\nexport const presenceBadgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon',\n};\n\nconst getIsBusy = (status: PresenceBadgeStatus): boolean => {\n if (status === 'busy' || status === 'do-not-disturb' || status === 'unknown') {\n return true;\n }\n\n return false;\n};\n\nconst useStyles = makeStyles({\n root: {\n ...shorthands.padding(0),\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n\n '& span': {\n display: 'flex',\n },\n ...shorthands.borderRadius('50%'),\n backgroundColor: tokens.colorNeutralBackground1,\n },\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 outOfOffice: {\n color: tokens.colorNeutralBackground1,\n },\n outOfOfficeAvailable: {\n color: tokens.colorPaletteLightGreenForeground3,\n },\n outOfOfficeBusy: {\n color: tokens.colorPaletteRedBackground3,\n },\n outOfOfficeAway: {\n color: tokens.colorPaletteMarigoldBackground3,\n },\n\n // Icons are not resizeable, and these sizes are currently missing\n // use `!important` to size the currently available icons to the missing ones\n //\n tiny: {\n aspectRatio: '1',\n width: '6px',\n '& svg': {\n width: '6px !important',\n height: '6px !important',\n },\n },\n large: {\n aspectRatio: '1',\n width: '20px',\n '& svg': {\n width: '20px !important',\n height: '20px !important',\n },\n },\n extraLarge: {\n aspectRatio: '1',\n width: '28px',\n '& svg': {\n width: '28px !important',\n height: '28px !important',\n },\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const usePresenceBadgeStyles_unstable = (state: PresenceBadgeState): PresenceBadgeState => {\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n state.root.className = mergeClasses(\n presenceBadgeClassNames.root,\n styles.root,\n isBusy && styles.statusBusy,\n state.status === 'away' && styles.statusAway,\n state.status === 'available' && styles.statusAvailable,\n state.status === 'offline' && styles.statusOffline,\n state.status === 'out-of-office' && styles.statusOutOfOffice,\n state.outOfOffice && styles.outOfOffice,\n state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable,\n state.outOfOffice && isBusy && styles.outOfOfficeBusy,\n state.outOfOffice && state.status === 'away' && styles.outOfOfficeAway,\n state.outOfOffice && state.status === 'offline' && styles.statusOffline,\n state.outOfOffice && state.status === 'out-of-office' && styles.statusOutOfOffice,\n state.size === 'tiny' && styles.tiny,\n state.size === 'large' && styles.large,\n state.size === 'extra-large' && styles.extraLarge,\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, state.icon.className);\n }\n\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -3,16 +3,92 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
+ exports.useCounterBadge_unstable = exports.useCounterBadgeStyles_unstable = exports.counterBadgeClassNames = exports.CounterBadge = exports.usePresenceBadge_unstable = exports.usePresenceBadgeStyles_unstable = exports.presenceBadgeClassNames = exports.PresenceBadge = exports.useBadge_unstable = exports.useBadgeStyles_unstable = exports.renderBadge_unstable = exports.badgeClassNames = exports.Badge = void 0;
6
7
 
7
- const tslib_1 = /*#__PURE__*/require("tslib");
8
+ var Badge_1 = /*#__PURE__*/require("./Badge");
8
9
 
9
- tslib_1.__exportStar(require("./components/Badge/index"), exports);
10
+ Object.defineProperty(exports, "Badge", {
11
+ enumerable: true,
12
+ get: function () {
13
+ return Badge_1.Badge;
14
+ }
15
+ });
16
+ Object.defineProperty(exports, "badgeClassNames", {
17
+ enumerable: true,
18
+ get: function () {
19
+ return Badge_1.badgeClassNames;
20
+ }
21
+ });
22
+ Object.defineProperty(exports, "renderBadge_unstable", {
23
+ enumerable: true,
24
+ get: function () {
25
+ return Badge_1.renderBadge_unstable;
26
+ }
27
+ });
28
+ Object.defineProperty(exports, "useBadgeStyles_unstable", {
29
+ enumerable: true,
30
+ get: function () {
31
+ return Badge_1.useBadgeStyles_unstable;
32
+ }
33
+ });
34
+ Object.defineProperty(exports, "useBadge_unstable", {
35
+ enumerable: true,
36
+ get: function () {
37
+ return Badge_1.useBadge_unstable;
38
+ }
39
+ });
10
40
 
11
- tslib_1.__exportStar(require("./Badge"), exports);
41
+ var PresenceBadge_1 = /*#__PURE__*/require("./PresenceBadge");
12
42
 
13
- tslib_1.__exportStar(require("./PresenceBadge"), exports);
43
+ Object.defineProperty(exports, "PresenceBadge", {
44
+ enumerable: true,
45
+ get: function () {
46
+ return PresenceBadge_1.PresenceBadge;
47
+ }
48
+ });
49
+ Object.defineProperty(exports, "presenceBadgeClassNames", {
50
+ enumerable: true,
51
+ get: function () {
52
+ return PresenceBadge_1.presenceBadgeClassNames;
53
+ }
54
+ });
55
+ Object.defineProperty(exports, "usePresenceBadgeStyles_unstable", {
56
+ enumerable: true,
57
+ get: function () {
58
+ return PresenceBadge_1.usePresenceBadgeStyles_unstable;
59
+ }
60
+ });
61
+ Object.defineProperty(exports, "usePresenceBadge_unstable", {
62
+ enumerable: true,
63
+ get: function () {
64
+ return PresenceBadge_1.usePresenceBadge_unstable;
65
+ }
66
+ });
14
67
 
15
- tslib_1.__exportStar(require("./components/CounterBadge/index"), exports);
68
+ var CounterBadge_1 = /*#__PURE__*/require("./CounterBadge");
16
69
 
17
- tslib_1.__exportStar(require("./CounterBadge"), exports);
70
+ Object.defineProperty(exports, "CounterBadge", {
71
+ enumerable: true,
72
+ get: function () {
73
+ return CounterBadge_1.CounterBadge;
74
+ }
75
+ });
76
+ Object.defineProperty(exports, "counterBadgeClassNames", {
77
+ enumerable: true,
78
+ get: function () {
79
+ return CounterBadge_1.counterBadgeClassNames;
80
+ }
81
+ });
82
+ Object.defineProperty(exports, "useCounterBadgeStyles_unstable", {
83
+ enumerable: true,
84
+ get: function () {
85
+ return CounterBadge_1.useCounterBadgeStyles_unstable;
86
+ }
87
+ });
88
+ Object.defineProperty(exports, "useCounterBadge_unstable", {
89
+ enumerable: true,
90
+ get: function () {
91
+ return CounterBadge_1.useCounterBadge_unstable;
92
+ }
93
+ });
18
94
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,0BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iCAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/Badge/index';\nexport * from './Badge';\nexport * from './PresenceBadge';\nexport * from './components/CounterBadge/index';\nexport * from './CounterBadge';\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,OAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,OAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,KAAA;EAAK;AAAL,CAAA;AAAO,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,iBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,eAAA;EAAe;AAAf,CAAA;AAAiB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,oBAAA;EAAoB;AAApB,CAAA;AAAsB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,uBAAA;EAAuB;AAAvB,CAAA;AAAyB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,iBAAA;EAAiB;AAAjB,CAAA;;AAEhF,IAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,eAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,eAAA,CAAA,aAAA;EAAa;AAAb,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,eAAA,CAAA,uBAAA;EAAuB;AAAvB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,iCAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,eAAA,CAAA,+BAAA;EAA+B;AAA/B,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,2BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,eAAA,CAAA,yBAAA;EAAyB;AAAzB,CAAA;;AAGF,IAAA,cAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,cAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,cAAA,CAAA,YAAA;EAAY;AAAZ,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,wBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,cAAA,CAAA,sBAAA;EAAsB;AAAtB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,gCAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,cAAA,CAAA,8BAAA;EAA8B;AAA9B,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,0BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,cAAA,CAAA,wBAAA;EAAwB;AAAxB,CAAA","sourcesContent":["export { Badge, badgeClassNames, renderBadge_unstable, useBadgeStyles_unstable, useBadge_unstable } from './Badge';\nexport type { BadgeProps, BadgeSlots, BadgeState } from './Badge';\nexport {\n PresenceBadge,\n presenceBadgeClassNames,\n usePresenceBadgeStyles_unstable,\n usePresenceBadge_unstable,\n} from './PresenceBadge';\nexport type { PresenceBadgeProps, PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge';\nexport {\n CounterBadge,\n counterBadgeClassNames,\n useCounterBadgeStyles_unstable,\n useCounterBadge_unstable,\n} from './CounterBadge';\nexport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge';\n"],"sourceRoot":"../src/"}
package/package.json CHANGED
@@ -1,10 +1,10 @@
1
1
  {
2
2
  "name": "@fluentui/react-badge",
3
- "version": "0.0.0-nightlyff78d1e27a20220217.1",
3
+ "version": "0.0.0",
4
4
  "description": "React components for building web experiences",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
7
- "typings": "lib/index.d.ts",
7
+ "typings": "dist/index.d.ts",
8
8
  "sideEffects": false,
9
9
  "repository": {
10
10
  "type": "git",
@@ -21,31 +21,21 @@
21
21
  "start": "yarn storybook",
22
22
  "test": "jest --passWithNoTests",
23
23
  "docs": "api-extractor run --config=config/api-extractor.local.json --local",
24
- "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output ./dist/packages/react-badge/src && yarn docs",
25
- "storybook": "node ../../scripts/storybook/runner",
24
+ "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../../scripts/typescript/normalize-import --output ./dist/types/packages/react-components/react-badge/src && yarn docs",
25
+ "storybook": "node ../../../scripts/storybook/runner",
26
26
  "type-check": "tsc -b tsconfig.json"
27
27
  },
28
28
  "devDependencies": {
29
29
  "@fluentui/eslint-plugin": "*",
30
30
  "@fluentui/react-conformance": "*",
31
- "@fluentui/react-conformance-griffel": "0.0.0-nightlyff78d1e27a20220217.1",
32
- "@fluentui/scripts": "^1.0.0",
33
- "@types/enzyme": "3.10.3",
34
- "@types/enzyme-adapter-react-16": "1.0.3",
35
- "@types/react": "16.9.42",
36
- "@types/react-dom": "16.9.10",
37
- "@types/react-test-renderer": "^16.0.0",
38
- "enzyme": "~3.10.0",
39
- "enzyme-adapter-react-16": "^1.15.0",
40
- "react": "16.8.6",
41
- "react-dom": "16.8.6",
42
- "react-test-renderer": "^16.3.0"
31
+ "@fluentui/react-conformance-griffel": "0.0.0-nightly-20220628-0417.1",
32
+ "@fluentui/scripts": "^1.0.0"
43
33
  },
44
34
  "dependencies": {
45
- "@fluentui/react-icons": "^2.0.159-beta.10",
46
- "@griffel/react": "1.0.0",
47
- "@fluentui/react-theme": "0.0.0-nightlyff78d1e27a20220217.1",
48
- "@fluentui/react-utilities": "0.0.0-nightlyff78d1e27a20220217.1",
35
+ "@fluentui/react-icons": "^2.0.172-rc.8",
36
+ "@griffel/react": "1.2.0",
37
+ "@fluentui/react-theme": "^0.0.0",
38
+ "@fluentui/react-utilities": "^0.0.0",
49
39
  "tslib": "^2.1.0"
50
40
  },
51
41
  "peerDependencies": {
@@ -56,9 +46,14 @@
56
46
  },
57
47
  "beachball": {
58
48
  "disallowedChangeTypes": [
59
- "major",
60
- "minor",
61
- "patch"
49
+ "major"
62
50
  ]
51
+ },
52
+ "exports": {
53
+ ".": {
54
+ "types": "./lib/index.d.ts",
55
+ "import": "./lib/index.js",
56
+ "require": "./lib-commonjs/index.js"
57
+ }
63
58
  }
64
59
  }
package/lib/Badge.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from './components/Badge/index';
@@ -1 +0,0 @@
1
- export * from './components/CounterBadge/index';
@@ -1 +0,0 @@
1
- export * from './components/PresenceBadge/index';
@@ -1,6 +0,0 @@
1
- import type { BadgeProps } from './Badge.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * Define a styled Badge, using the `useBadge_unstable` hook.
5
- */
6
- export declare const Badge: ForwardRefComponent<BadgeProps>;
@@ -1,34 +0,0 @@
1
- import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
2
- export declare type BadgeSlots = {
3
- root: Slot<'div'>;
4
- icon?: Slot<'span'>;
5
- };
6
- export declare type BadgeCommons = {
7
- /**
8
- * A Badge can be filled, outline, ghost, inverted
9
- * @defaultvalue filled
10
- */
11
- appearance: 'filled' | 'ghost' | 'outline' | 'tint';
12
- /**
13
- * A Badge can be one of preset colors
14
- * @defaultvalue brand
15
- */
16
- color: 'brand' | 'danger' | 'important' | 'informative' | 'severe' | 'subtle' | 'success' | 'warning';
17
- /**
18
- * A Badge can position the icon before or after the content.
19
- * @defaultvalue before
20
- */
21
- iconPosition: 'before' | 'after';
22
- /**
23
- * A Badge can be square, circular or rounded.
24
- * @defaultvalue circular
25
- */
26
- shape: 'circular' | 'rounded' | 'square';
27
- /**
28
- * A Badge can be on of several preset sizes.
29
- * @defaultvalue medium
30
- */
31
- size: 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large';
32
- };
33
- export declare type BadgeProps = Omit<ComponentProps<BadgeSlots>, 'color'> & Partial<BadgeCommons>;
34
- export declare type BadgeState = ComponentState<BadgeSlots> & BadgeCommons;
@@ -1,5 +0,0 @@
1
- export * from './Badge';
2
- export type { BadgeProps, BadgeSlots, BadgeState } from './Badge.types';
3
- export * from './renderBadge';
4
- export * from './useBadge';
5
- export * from './useBadgeStyles';
@@ -1,2 +0,0 @@
1
- import type { BadgeState } from './Badge.types';
2
- export declare const renderBadge_unstable: (state: BadgeState) => JSX.Element;
@@ -1,6 +0,0 @@
1
- import * as React from 'react';
2
- import type { BadgeProps, BadgeState } from './Badge.types';
3
- /**
4
- * Returns the props and state required to render the component
5
- */
6
- export declare const useBadge_unstable: (props: BadgeProps, ref: React.Ref<HTMLElement>) => BadgeState;
@@ -1,6 +0,0 @@
1
- import type { BadgeState } from './Badge.types';
2
- export declare const badgeClassName = "fui-Badge";
3
- /**
4
- * Applies style classnames to slots
5
- */
6
- export declare const useBadgeStyles_unstable: (state: BadgeState) => BadgeState;
@@ -1,6 +0,0 @@
1
- import type { CounterBadgeProps } from './CounterBadge.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * Define a styled CounterBadge, using the `useCounterBadge_unstable` hook.
5
- */
6
- export declare const CounterBadge: ForwardRefComponent<CounterBadgeProps>;
@@ -1,41 +0,0 @@
1
- import type { BadgeProps, BadgeState } from '../Badge/index';
2
- declare type CounterBadgeCommons = {
3
- /**
4
- * Max number to be displayed
5
- * @default 99
6
- */
7
- overflowCount: number;
8
- /**
9
- * Value displayed by the Badge
10
- * @default 0
11
- */
12
- count: number;
13
- /**
14
- * If the badge should be shown when count is 0
15
- * @default false
16
- */
17
- showZero: boolean;
18
- /**
19
- * If a dot should be displayed without the count
20
- * @default false
21
- */
22
- dot: boolean;
23
- /**
24
- * A Badge can be circular or rounded
25
- * @default circular
26
- */
27
- shape: 'circular' | 'rounded';
28
- /**
29
- * A Badge can be filled, ghost
30
- * @default filled
31
- */
32
- appearance: 'filled' | 'ghost';
33
- /**
34
- * Semantic colors for a counter badge
35
- * @default brand
36
- */
37
- color: Extract<BadgeProps['color'], 'brand' | 'danger' | 'important' | 'informative'>;
38
- };
39
- export declare type CounterBadgeProps = Omit<BadgeProps, 'appearance' | 'shape' | 'color'> & Partial<CounterBadgeCommons>;
40
- export declare type CounterBadgeState = Omit<BadgeState, 'appearance' | 'shape' | 'color'> & CounterBadgeCommons;
41
- export {};
@@ -1,4 +0,0 @@
1
- export * from './CounterBadge';
2
- export * from './CounterBadge.types';
3
- export * from './useCounterBadge';
4
- export * from './useCounterBadgeStyles';
@@ -1,6 +0,0 @@
1
- import * as React from 'react';
2
- import type { CounterBadgeProps, CounterBadgeState } from './CounterBadge.types';
3
- /**
4
- * Returns the props and state required to render the component
5
- */
6
- export declare const useCounterBadge_unstable: (props: CounterBadgeProps, ref: React.Ref<HTMLElement>) => CounterBadgeState;
@@ -1,6 +0,0 @@
1
- import type { CounterBadgeState } from './CounterBadge.types';
2
- export declare const counterBadgeClassName = "fui-CounterBadge";
3
- /**
4
- * Applies style classnames to slots
5
- */
6
- export declare const useCounterBadgeStyles_unstable: (state: CounterBadgeState) => CounterBadgeState;
@@ -1,6 +0,0 @@
1
- import type { PresenceBadgeProps } from './PresenceBadge.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * Define a styled Badge, using the `useBadge_unstable` hook.
5
- */
6
- export declare const PresenceBadge: ForwardRefComponent<PresenceBadgeProps>;
@@ -1,19 +0,0 @@
1
- import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';
2
- import type { BadgeCommons, BadgeSlots } from '../Badge/Badge.types';
3
- export declare type PresenceBadgeStatus = 'busy' | 'outOfOffice' | 'away' | 'available' | 'offline' | 'doNotDisturb';
4
- declare type PresenceBadgeCommons = {
5
- /**
6
- * Represents several status
7
- * @default available
8
- */
9
- status: PresenceBadgeStatus;
10
- /**
11
- * Modifies the display to indicate that the user is out of office.
12
- * This can be combined with any status to display an out-of-office version of that status
13
- * @default false
14
- */
15
- outOfOffice: boolean;
16
- } & BadgeCommons;
17
- export declare type PresenceBadgeProps = Omit<ComponentProps<Pick<BadgeSlots, 'root'>>, 'color'> & Partial<Pick<PresenceBadgeCommons, 'status' | 'outOfOffice' | 'size'>>;
18
- export declare type PresenceBadgeState = PresenceBadgeCommons & ComponentState<BadgeSlots>;
19
- export {};
@@ -1,4 +0,0 @@
1
- export * from './PresenceBadge';
2
- export * from './PresenceBadge.types';
3
- export * from './usePresenceBadge';
4
- export * from './usePresenceBadgeStyles';
@@ -1,11 +0,0 @@
1
- import * as React from 'react';
2
- import type { PresenceBadgeState } from './PresenceBadge.types';
3
- export declare const presenceAwayFilled: Record<PresenceBadgeState['size'], React.FunctionComponent | null>;
4
- export declare const presenceAvailableRegular: Record<PresenceBadgeState['size'], React.FunctionComponent | null>;
5
- export declare const presenceAvailableFilled: Record<PresenceBadgeState['size'], React.FunctionComponent | null>;
6
- export declare const presenceBusyFilled: Record<PresenceBadgeState['size'], React.FunctionComponent | null>;
7
- export declare const presenceDndFilled: Record<PresenceBadgeState['size'], React.FunctionComponent | null>;
8
- export declare const presenceDndRegular: Record<PresenceBadgeState['size'], React.FunctionComponent | null>;
9
- export declare const presenceOofRegular: Record<PresenceBadgeState['size'], React.FunctionComponent | null>;
10
- export declare const presenceOfflineRegular: Record<PresenceBadgeState['size'], React.FunctionComponent | null>;
11
- export declare const presenceUnknownRegular: Record<PresenceBadgeState['size'], React.FunctionComponent | null>;
@@ -1,6 +0,0 @@
1
- import * as React from 'react';
2
- import type { PresenceBadgeProps, PresenceBadgeState } from './PresenceBadge.types';
3
- /**
4
- * Returns the props and state required to render the component
5
- */
6
- export declare const usePresenceBadge_unstable: (props: PresenceBadgeProps, ref: React.Ref<HTMLElement>) => PresenceBadgeState;
@@ -1,6 +0,0 @@
1
- import type { PresenceBadgeState } from './PresenceBadge.types';
2
- export declare const presenceBadgeClassName = "fui-PresenceBadge";
3
- /**
4
- * Applies style classnames to slots
5
- */
6
- export declare const usePresenceBadgeStyles_unstable: (state: PresenceBadgeState) => PresenceBadgeState;
package/lib/index.d.ts DELETED
@@ -1,5 +0,0 @@
1
- export * from './components/Badge/index';
2
- export * from './Badge';
3
- export * from './PresenceBadge';
4
- export * from './components/CounterBadge/index';
5
- export * from './CounterBadge';
@@ -1 +0,0 @@
1
- export * from './components/Badge/index';
@@ -1 +0,0 @@
1
- export * from './components/CounterBadge/index';
@@ -1 +0,0 @@
1
- export * from './components/PresenceBadge/index';
@@ -1,6 +0,0 @@
1
- import type { BadgeProps } from './Badge.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * Define a styled Badge, using the `useBadge_unstable` hook.
5
- */
6
- export declare const Badge: ForwardRefComponent<BadgeProps>;
@@ -1,34 +0,0 @@
1
- import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
2
- export declare type BadgeSlots = {
3
- root: Slot<'div'>;
4
- icon?: Slot<'span'>;
5
- };
6
- export declare type BadgeCommons = {
7
- /**
8
- * A Badge can be filled, outline, ghost, inverted
9
- * @defaultvalue filled
10
- */
11
- appearance: 'filled' | 'ghost' | 'outline' | 'tint';
12
- /**
13
- * A Badge can be one of preset colors
14
- * @defaultvalue brand
15
- */
16
- color: 'brand' | 'danger' | 'important' | 'informative' | 'severe' | 'subtle' | 'success' | 'warning';
17
- /**
18
- * A Badge can position the icon before or after the content.
19
- * @defaultvalue before
20
- */
21
- iconPosition: 'before' | 'after';
22
- /**
23
- * A Badge can be square, circular or rounded.
24
- * @defaultvalue circular
25
- */
26
- shape: 'circular' | 'rounded' | 'square';
27
- /**
28
- * A Badge can be on of several preset sizes.
29
- * @defaultvalue medium
30
- */
31
- size: 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large';
32
- };
33
- export declare type BadgeProps = Omit<ComponentProps<BadgeSlots>, 'color'> & Partial<BadgeCommons>;
34
- export declare type BadgeState = ComponentState<BadgeSlots> & BadgeCommons;
@@ -1,5 +0,0 @@
1
- export * from './Badge';
2
- export type { BadgeProps, BadgeSlots, BadgeState } from './Badge.types';
3
- export * from './renderBadge';
4
- export * from './useBadge';
5
- export * from './useBadgeStyles';