@fluentui/react-badge 9.0.0-alpha.80 → 9.0.0-alpha.84

Sign up to get free protection for your applications and to get access to all the features.
Files changed (155) hide show
  1. package/CHANGELOG.json +137 -1
  2. package/CHANGELOG.md +48 -2
  3. package/Spec.md +7 -22
  4. package/dist/react-badge.d.ts +57 -137
  5. package/lib/Badge.js.map +1 -1
  6. package/lib/CounterBadge.js.map +1 -1
  7. package/lib/PresenceBadge.js.map +1 -1
  8. package/lib/common/isConformant.js +2 -0
  9. package/lib/common/isConformant.js.map +1 -1
  10. package/lib/components/Badge/Badge.d.ts +1 -2
  11. package/lib/components/Badge/Badge.js +0 -1
  12. package/lib/components/Badge/Badge.js.map +1 -1
  13. package/lib/components/Badge/Badge.types.d.ts +19 -46
  14. package/lib/components/Badge/Badge.types.js.map +1 -1
  15. package/lib/components/Badge/index.js.map +1 -1
  16. package/lib/components/Badge/renderBadge.js +3 -4
  17. package/lib/components/Badge/renderBadge.js.map +1 -1
  18. package/lib/components/Badge/useBadge.d.ts +1 -5
  19. package/lib/components/Badge/useBadge.js +29 -18
  20. package/lib/components/Badge/useBadge.js.map +1 -1
  21. package/lib/components/Badge/useBadgeStyles.js +1 -1
  22. package/lib/components/Badge/useBadgeStyles.js.map +1 -1
  23. package/lib/components/CounterBadge/CounterBadge.d.ts +1 -2
  24. package/lib/components/CounterBadge/CounterBadge.js +0 -1
  25. package/lib/components/CounterBadge/CounterBadge.js.map +1 -1
  26. package/lib/components/CounterBadge/CounterBadge.types.d.ts +24 -44
  27. package/lib/components/CounterBadge/CounterBadge.types.js.map +1 -1
  28. package/lib/components/CounterBadge/index.js.map +1 -1
  29. package/lib/components/CounterBadge/useCounterBadge.d.ts +1 -5
  30. package/lib/components/CounterBadge/useCounterBadge.js +25 -19
  31. package/lib/components/CounterBadge/useCounterBadge.js.map +1 -1
  32. package/lib/components/CounterBadge/useCounterBadgeStyles.js +1 -1
  33. package/lib/components/CounterBadge/useCounterBadgeStyles.js.map +1 -1
  34. package/lib/components/PresenceBadge/DefaultPresenceBadgeIcons.js.map +1 -1
  35. package/lib/components/PresenceBadge/PresenceBadge.d.ts +1 -2
  36. package/lib/components/PresenceBadge/PresenceBadge.js +0 -1
  37. package/lib/components/PresenceBadge/PresenceBadge.js.map +1 -1
  38. package/lib/components/PresenceBadge/PresenceBadge.types.d.ts +5 -25
  39. package/lib/components/PresenceBadge/PresenceBadge.types.js.map +1 -1
  40. package/lib/components/PresenceBadge/index.js.map +1 -1
  41. package/lib/components/PresenceBadge/usePresenceBadge.d.ts +1 -5
  42. package/lib/components/PresenceBadge/usePresenceBadge.js +15 -21
  43. package/lib/components/PresenceBadge/usePresenceBadge.js.map +1 -1
  44. package/lib/components/PresenceBadge/usePresenceBadgeStyles.js +1 -1
  45. package/lib/components/PresenceBadge/usePresenceBadgeStyles.js.map +1 -1
  46. package/lib/index.js.map +1 -1
  47. package/lib-commonjs/Badge.js.map +1 -1
  48. package/lib-commonjs/CounterBadge.js.map +1 -1
  49. package/lib-commonjs/PresenceBadge.js.map +1 -1
  50. package/lib-commonjs/common/isConformant.js +2 -0
  51. package/lib-commonjs/common/isConformant.js.map +1 -1
  52. package/lib-commonjs/components/Badge/Badge.d.ts +1 -2
  53. package/lib-commonjs/components/Badge/Badge.js +0 -1
  54. package/lib-commonjs/components/Badge/Badge.js.map +1 -1
  55. package/lib-commonjs/components/Badge/Badge.types.d.ts +19 -46
  56. package/lib-commonjs/components/Badge/Badge.types.js.map +1 -1
  57. package/lib-commonjs/components/Badge/index.js.map +1 -1
  58. package/lib-commonjs/components/Badge/renderBadge.js +2 -4
  59. package/lib-commonjs/components/Badge/renderBadge.js.map +1 -1
  60. package/lib-commonjs/components/Badge/useBadge.d.ts +1 -5
  61. package/lib-commonjs/components/Badge/useBadge.js +30 -19
  62. package/lib-commonjs/components/Badge/useBadge.js.map +1 -1
  63. package/lib-commonjs/components/Badge/useBadgeStyles.js +1 -1
  64. package/lib-commonjs/components/Badge/useBadgeStyles.js.map +1 -1
  65. package/lib-commonjs/components/CounterBadge/CounterBadge.d.ts +1 -2
  66. package/lib-commonjs/components/CounterBadge/CounterBadge.js +0 -1
  67. package/lib-commonjs/components/CounterBadge/CounterBadge.js.map +1 -1
  68. package/lib-commonjs/components/CounterBadge/CounterBadge.types.d.ts +24 -44
  69. package/lib-commonjs/components/CounterBadge/CounterBadge.types.js.map +1 -1
  70. package/lib-commonjs/components/CounterBadge/index.js.map +1 -1
  71. package/lib-commonjs/components/CounterBadge/useCounterBadge.d.ts +1 -5
  72. package/lib-commonjs/components/CounterBadge/useCounterBadge.js +27 -21
  73. package/lib-commonjs/components/CounterBadge/useCounterBadge.js.map +1 -1
  74. package/lib-commonjs/components/CounterBadge/useCounterBadgeStyles.js +1 -1
  75. package/lib-commonjs/components/CounterBadge/useCounterBadgeStyles.js.map +1 -1
  76. package/lib-commonjs/components/PresenceBadge/DefaultPresenceBadgeIcons.js.map +1 -1
  77. package/lib-commonjs/components/PresenceBadge/PresenceBadge.d.ts +1 -2
  78. package/lib-commonjs/components/PresenceBadge/PresenceBadge.js +0 -1
  79. package/lib-commonjs/components/PresenceBadge/PresenceBadge.js.map +1 -1
  80. package/lib-commonjs/components/PresenceBadge/PresenceBadge.types.d.ts +5 -25
  81. package/lib-commonjs/components/PresenceBadge/PresenceBadge.types.js.map +1 -1
  82. package/lib-commonjs/components/PresenceBadge/index.js.map +1 -1
  83. package/lib-commonjs/components/PresenceBadge/usePresenceBadge.d.ts +1 -5
  84. package/lib-commonjs/components/PresenceBadge/usePresenceBadge.js +16 -22
  85. package/lib-commonjs/components/PresenceBadge/usePresenceBadge.js.map +1 -1
  86. package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.js +1 -1
  87. package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.js.map +1 -1
  88. package/lib-commonjs/index.js.map +1 -1
  89. package/package.json +9 -9
  90. package/lib-amd/Badge.d.ts +0 -1
  91. package/lib-amd/Badge.js +0 -6
  92. package/lib-amd/Badge.js.map +0 -1
  93. package/lib-amd/CounterBadge.d.ts +0 -1
  94. package/lib-amd/CounterBadge.js +0 -6
  95. package/lib-amd/CounterBadge.js.map +0 -1
  96. package/lib-amd/PresenceBadge.d.ts +0 -1
  97. package/lib-amd/PresenceBadge.js +0 -6
  98. package/lib-amd/PresenceBadge.js.map +0 -1
  99. package/lib-amd/common/isConformant.d.ts +0 -4
  100. package/lib-amd/common/isConformant.js +0 -15
  101. package/lib-amd/common/isConformant.js.map +0 -1
  102. package/lib-amd/components/Badge/Badge.d.ts +0 -7
  103. package/lib-amd/components/Badge/Badge.js +0 -16
  104. package/lib-amd/components/Badge/Badge.js.map +0 -1
  105. package/lib-amd/components/Badge/Badge.types.d.ts +0 -65
  106. package/lib-amd/components/Badge/Badge.types.js +0 -5
  107. package/lib-amd/components/Badge/Badge.types.js.map +0 -1
  108. package/lib-amd/components/Badge/index.d.ts +0 -5
  109. package/lib-amd/components/Badge/index.js +0 -10
  110. package/lib-amd/components/Badge/index.js.map +0 -1
  111. package/lib-amd/components/Badge/renderBadge.d.ts +0 -2
  112. package/lib-amd/components/Badge/renderBadge.js +0 -14
  113. package/lib-amd/components/Badge/renderBadge.js.map +0 -1
  114. package/lib-amd/components/Badge/useBadge.d.ts +0 -10
  115. package/lib-amd/components/Badge/useBadge.js +0 -25
  116. package/lib-amd/components/Badge/useBadge.js.map +0 -1
  117. package/lib-amd/components/Badge/useBadgeStyles.d.ts +0 -5
  118. package/lib-amd/components/Badge/useBadgeStyles.js +0 -234
  119. package/lib-amd/components/Badge/useBadgeStyles.js.map +0 -1
  120. package/lib-amd/components/CounterBadge/CounterBadge.d.ts +0 -7
  121. package/lib-amd/components/CounterBadge/CounterBadge.js +0 -16
  122. package/lib-amd/components/CounterBadge/CounterBadge.js.map +0 -1
  123. package/lib-amd/components/CounterBadge/CounterBadge.types.d.ts +0 -61
  124. package/lib-amd/components/CounterBadge/CounterBadge.types.js +0 -5
  125. package/lib-amd/components/CounterBadge/CounterBadge.types.js.map +0 -1
  126. package/lib-amd/components/CounterBadge/index.d.ts +0 -4
  127. package/lib-amd/components/CounterBadge/index.js +0 -9
  128. package/lib-amd/components/CounterBadge/index.js.map +0 -1
  129. package/lib-amd/components/CounterBadge/useCounterBadge.d.ts +0 -10
  130. package/lib-amd/components/CounterBadge/useCounterBadge.js +0 -28
  131. package/lib-amd/components/CounterBadge/useCounterBadge.js.map +0 -1
  132. package/lib-amd/components/CounterBadge/useCounterBadgeStyles.d.ts +0 -5
  133. package/lib-amd/components/CounterBadge/useCounterBadgeStyles.js +0 -46
  134. package/lib-amd/components/CounterBadge/useCounterBadgeStyles.js.map +0 -1
  135. package/lib-amd/components/PresenceBadge/DefaultPresenceBadgeIcons.d.ts +0 -10
  136. package/lib-amd/components/PresenceBadge/DefaultPresenceBadgeIcons.js +0 -64
  137. package/lib-amd/components/PresenceBadge/DefaultPresenceBadgeIcons.js.map +0 -1
  138. package/lib-amd/components/PresenceBadge/PresenceBadge.d.ts +0 -7
  139. package/lib-amd/components/PresenceBadge/PresenceBadge.js +0 -16
  140. package/lib-amd/components/PresenceBadge/PresenceBadge.js.map +0 -1
  141. package/lib-amd/components/PresenceBadge/PresenceBadge.types.d.ts +0 -37
  142. package/lib-amd/components/PresenceBadge/PresenceBadge.types.js +0 -5
  143. package/lib-amd/components/PresenceBadge/PresenceBadge.types.js.map +0 -1
  144. package/lib-amd/components/PresenceBadge/index.d.ts +0 -4
  145. package/lib-amd/components/PresenceBadge/index.js +0 -9
  146. package/lib-amd/components/PresenceBadge/index.js.map +0 -1
  147. package/lib-amd/components/PresenceBadge/usePresenceBadge.d.ts +0 -10
  148. package/lib-amd/components/PresenceBadge/usePresenceBadge.js +0 -37
  149. package/lib-amd/components/PresenceBadge/usePresenceBadge.js.map +0 -1
  150. package/lib-amd/components/PresenceBadge/usePresenceBadgeStyles.d.ts +0 -5
  151. package/lib-amd/components/PresenceBadge/usePresenceBadgeStyles.js +0 -58
  152. package/lib-amd/components/PresenceBadge/usePresenceBadgeStyles.js.map +0 -1
  153. package/lib-amd/index.d.ts +0 -5
  154. package/lib-amd/index.js +0 -10
  155. package/lib-amd/index.js.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"file":"isConformant.js","sourceRoot":"../src/","sources":["common/isConformant.ts"],"names":[],"mappings":";;;;IAIA,SAAgB,YAAY,CAC1B,QAAyF;QAEzF,IAAM,cAAc,GAAyC;YAC3D,gBAAgB,EAAE,IAAI;YACtB,aAAa,EAAE,MAAO,CAAC,MAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE,EAAE,CAAC;YAC5D,UAAU,EAAE,uCAAqC;SAClD,CAAC;QAEF,gCAAgB,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAC;IAC7C,CAAC;IAVD,oCAUC","sourcesContent":["import { isConformant as baseIsConformant } from '@fluentui/react-conformance';\nimport makeStylesTests from '@fluentui/react-conformance-make-styles';\nimport type { IsConformantOptions, TestObject } from '@fluentui/react-conformance';\n\nexport function isConformant<TProps = {}>(\n testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & { componentPath?: string },\n) {\n const defaultOptions: Partial<IsConformantOptions<TProps>> = {\n asPropHandlesRef: true,\n componentPath: module!.parent!.filename.replace('.test', ''),\n extraTests: makeStylesTests as TestObject<TProps>,\n };\n\n baseIsConformant(defaultOptions, testInfo);\n}\n"]}
@@ -1,7 +0,0 @@
1
- import * as React from 'react';
2
- import type { BadgeProps } from './Badge.types';
3
- /**
4
- * Define a styled Badge, using the `useBadge` hook.
5
- * {@docCategory Badge}
6
- */
7
- export declare const Badge: React.FunctionComponent<BadgeProps & React.RefAttributes<HTMLElement>>;
@@ -1,16 +0,0 @@
1
- define(["require", "exports", "react", "./useBadge", "./useBadgeStyles", "./renderBadge"], function (require, exports, React, useBadge_1, useBadgeStyles_1, renderBadge_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- exports.Badge = void 0;
5
- /**
6
- * Define a styled Badge, using the `useBadge` hook.
7
- * {@docCategory Badge}
8
- */
9
- exports.Badge = React.forwardRef(function (props, ref) {
10
- var state = useBadge_1.useBadge(props, ref);
11
- useBadgeStyles_1.useBadgeStyles(state);
12
- return renderBadge_1.renderBadge(state);
13
- });
14
- exports.Badge.displayName = 'Badge';
15
- });
16
- //# sourceMappingURL=Badge.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Badge.js","sourceRoot":"../src/","sources":["components/Badge/Badge.tsx"],"names":[],"mappings":";;;;IAMA;;;OAGG;IACU,QAAA,KAAK,GAA2E,KAAK,CAAC,UAAU,CAG3G,UAAC,KAAK,EAAE,GAAG;QACX,IAAM,KAAK,GAAG,mBAAQ,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QACnC,+BAAc,CAAC,KAAK,CAAC,CAAC;QAEtB,OAAO,yBAAW,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,CAAC,CAAC;IAEH,aAAK,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["import * as React from 'react';\nimport { useBadge } from './useBadge';\nimport { useBadgeStyles } from './useBadgeStyles';\nimport { renderBadge } from './renderBadge';\nimport type { BadgeProps } from './Badge.types';\n\n/**\n * Define a styled Badge, using the `useBadge` hook.\n * {@docCategory Badge}\n */\nexport const Badge: React.FunctionComponent<BadgeProps & React.RefAttributes<HTMLElement>> = React.forwardRef<\n HTMLElement,\n BadgeProps\n>((props, ref) => {\n const state = useBadge(props, ref);\n useBadgeStyles(state);\n\n return renderBadge(state);\n});\n\nBadge.displayName = 'Badge';\n"]}
@@ -1,65 +0,0 @@
1
- import * as React from 'react';
2
- import type { ComponentPropsCompat, ShorthandPropsCompat, ObjectShorthandPropsCompat } from '@fluentui/react-utilities';
3
- /**
4
- * {@docCategory Badge}
5
- */
6
- export declare type BadgeSize = 'smallest' | 'smaller' | 'small' | 'medium' | 'large' | 'larger' | 'largest';
7
- /**
8
- * {@docCategory Badge}
9
- */
10
- export declare type BadgeAppearance = 'filled' | 'outline' | 'ghost' | 'tint';
11
- /**
12
- * {@docCategory Badge}
13
- */
14
- export declare type BadgeShape = 'rounded' | 'square' | 'circular';
15
- /**
16
- * {@docCategory Badge}
17
- */
18
- export declare type BadgeColors = 'brand' | 'danger' | 'severe' | 'warning' | 'success' | 'important' | 'informative' | 'subtle';
19
- /**
20
- * {@docCategory Badge}
21
- */
22
- export interface BadgeProps extends ComponentPropsCompat, React.HTMLAttributes<HTMLElement> {
23
- /**
24
- * A Badge can be sized.
25
- * @defaultvalue medium
26
- */
27
- size?: BadgeSize;
28
- /**
29
- * A Badge can be square, circular or rounded
30
- * @defaultvalue circular
31
- */
32
- shape?: BadgeShape;
33
- /**
34
- * A Badge can be filled, outline, ghost, inverted
35
- * @defaultvalue filled
36
- */
37
- appearance?: BadgeAppearance;
38
- /**
39
- * A Badge has a preset of colors
40
- * @defaultvalue filled
41
- */
42
- color?: BadgeColors;
43
- /**
44
- * Icon slot
45
- */
46
- icon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
47
- /**
48
- * Position for Icon to be rendered
49
- * @defaultvalue before
50
- */
51
- iconPosition?: 'before' | 'after';
52
- }
53
- /**
54
- * {@docCategory Badge}
55
- */
56
- export interface BadgeState extends BadgeProps {
57
- /**
58
- * Ref to the root slot
59
- */
60
- ref: React.RefObject<HTMLElement>;
61
- /**
62
- * Icon slot when processed by internal state
63
- */
64
- icon?: ObjectShorthandPropsCompat<React.HTMLAttributes<HTMLSpanElement>>;
65
- }
@@ -1,5 +0,0 @@
1
- define(["require", "exports"], function (require, exports) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- });
5
- //# sourceMappingURL=Badge.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Badge.types.js","sourceRoot":"../src/","sources":["components/Badge/Badge.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentPropsCompat, ShorthandPropsCompat, ObjectShorthandPropsCompat } from '@fluentui/react-utilities';\n\n/**\n * {@docCategory Badge}\n */\nexport type BadgeSize = 'smallest' | 'smaller' | 'small' | 'medium' | 'large' | 'larger' | 'largest';\n\n/**\n * {@docCategory Badge}\n */\nexport type BadgeAppearance = 'filled' | 'outline' | 'ghost' | 'tint';\n\n/**\n * {@docCategory Badge}\n */\nexport type BadgeShape = 'rounded' | 'square' | 'circular';\n\n/**\n * {@docCategory Badge}\n */\nexport type BadgeColors =\n | 'brand'\n | 'danger'\n | 'severe'\n | 'warning'\n | 'success'\n | 'important'\n | 'informative'\n | 'subtle';\n\n/**\n * {@docCategory Badge}\n */\nexport interface BadgeProps extends ComponentPropsCompat, React.HTMLAttributes<HTMLElement> {\n /**\n * A Badge can be sized.\n * @defaultvalue medium\n */\n size?: BadgeSize;\n\n /**\n * A Badge can be square, circular or rounded\n * @defaultvalue circular\n */\n shape?: BadgeShape;\n\n /**\n * A Badge can be filled, outline, ghost, inverted\n * @defaultvalue filled\n */\n appearance?: BadgeAppearance;\n\n /**\n * A Badge has a preset of colors\n * @defaultvalue filled\n */\n color?: BadgeColors;\n\n /**\n * Icon slot\n */\n icon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n\n /**\n * Position for Icon to be rendered\n * @defaultvalue before\n */\n iconPosition?: 'before' | 'after';\n}\n\n/**\n * {@docCategory Badge}\n */\nexport interface BadgeState extends BadgeProps {\n /**\n * Ref to the root slot\n */\n ref: React.RefObject<HTMLElement>;\n /**\n * Icon slot when processed by internal state\n */\n icon?: ObjectShorthandPropsCompat<React.HTMLAttributes<HTMLSpanElement>>;\n}\n"]}
@@ -1,5 +0,0 @@
1
- export * from './Badge';
2
- export * from './Badge.types';
3
- export * from './renderBadge';
4
- export * from './useBadge';
5
- export * from './useBadgeStyles';
@@ -1,10 +0,0 @@
1
- define(["require", "exports", "tslib", "./Badge", "./Badge.types", "./renderBadge", "./useBadge", "./useBadgeStyles"], function (require, exports, tslib_1, Badge_1, Badge_types_1, renderBadge_1, useBadge_1, useBadgeStyles_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- tslib_1.__exportStar(Badge_1, exports);
5
- tslib_1.__exportStar(Badge_types_1, exports);
6
- tslib_1.__exportStar(renderBadge_1, exports);
7
- tslib_1.__exportStar(useBadge_1, exports);
8
- tslib_1.__exportStar(useBadgeStyles_1, exports);
9
- });
10
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Badge/index.ts"],"names":[],"mappings":";;;IAAA,uCAAwB;IACxB,6CAA8B;IAC9B,6CAA8B;IAC9B,0CAA2B;IAC3B,gDAAiC","sourcesContent":["export * from './Badge';\nexport * from './Badge.types';\nexport * from './renderBadge';\nexport * from './useBadge';\nexport * from './useBadgeStyles';\n"]}
@@ -1,2 +0,0 @@
1
- import type { BadgeState } from './Badge.types';
2
- export declare const renderBadge: (state: BadgeState) => JSX.Element;
@@ -1,14 +0,0 @@
1
- define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "./useBadge"], function (require, exports, tslib_1, React, react_utilities_1, useBadge_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- exports.renderBadge = void 0;
5
- var renderBadge = function (state) {
6
- var _a = react_utilities_1.getSlotsCompat(state, useBadge_1.badgeShorthandPropsCompat), slots = _a.slots, slotProps = _a.slotProps;
7
- return (React.createElement(slots.root, tslib_1.__assign({}, slotProps.root),
8
- state.iconPosition === 'before' && React.createElement(slots.icon, tslib_1.__assign({}, slotProps.icon)),
9
- state.children,
10
- state.iconPosition === 'after' && React.createElement(slots.icon, tslib_1.__assign({}, slotProps.icon))));
11
- };
12
- exports.renderBadge = renderBadge;
13
- });
14
- //# sourceMappingURL=renderBadge.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"renderBadge.js","sourceRoot":"../src/","sources":["components/Badge/renderBadge.tsx"],"names":[],"mappings":";;;;IAKO,IAAM,WAAW,GAAG,UAAC,KAAiB;QACrC,IAAA,KAAuB,gCAAc,CAAC,KAAK,EAAE,oCAAyB,CAAC,EAArE,KAAK,WAAA,EAAE,SAAS,eAAqD,CAAC;QAE9E,OAAO,CACL,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI;YAC3B,KAAK,CAAC,YAAY,KAAK,QAAQ,IAAI,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI,EAAI;YACrE,KAAK,CAAC,QAAQ;YACd,KAAK,CAAC,YAAY,KAAK,OAAO,IAAI,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI,EAAI,CAC1D,CACd,CAAC;IACJ,CAAC,CAAC;IAVW,QAAA,WAAW,eAUtB","sourcesContent":["import * as React from 'react';\nimport { getSlotsCompat } from '@fluentui/react-utilities';\nimport { badgeShorthandPropsCompat } from './useBadge';\nimport type { BadgeState } from './Badge.types';\n\nexport const renderBadge = (state: BadgeState) => {\n const { slots, slotProps } = getSlotsCompat(state, badgeShorthandPropsCompat);\n\n return (\n <slots.root {...slotProps.root}>\n {state.iconPosition === 'before' && <slots.icon {...slotProps.icon} />}\n {state.children}\n {state.iconPosition === 'after' && <slots.icon {...slotProps.icon} />}\n </slots.root>\n );\n};\n"]}
@@ -1,10 +0,0 @@
1
- import * as React from 'react';
2
- import type { BadgeProps, BadgeState } from './Badge.types';
3
- /**
4
- * Consts listing which props are shorthand props.
5
- */
6
- export declare const badgeShorthandPropsCompat: readonly ["icon"];
7
- /**
8
- * Returns the props and state required to render the component
9
- */
10
- export declare const useBadge: (props: BadgeProps, ref: React.Ref<HTMLElement>, defaultProps?: BadgeProps | undefined) => BadgeState;
@@ -1,25 +0,0 @@
1
- define(["require", "exports", "react", "@fluentui/react-utilities"], function (require, exports, React, react_utilities_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- exports.useBadge = exports.badgeShorthandPropsCompat = void 0;
5
- /**
6
- * Consts listing which props are shorthand props.
7
- */
8
- exports.badgeShorthandPropsCompat = ['icon'];
9
- var mergeProps = react_utilities_1.makeMergeProps({ deepMerge: exports.badgeShorthandPropsCompat });
10
- /**
11
- * Returns the props and state required to render the component
12
- */
13
- var useBadge = function (props, ref, defaultProps) {
14
- var state = mergeProps({
15
- ref: react_utilities_1.useMergedRefs(ref, React.useRef(null)),
16
- shape: 'circular',
17
- size: 'medium',
18
- iconPosition: 'before',
19
- 'aria-hidden': true,
20
- }, defaultProps && react_utilities_1.resolveShorthandProps(defaultProps, exports.badgeShorthandPropsCompat), react_utilities_1.resolveShorthandProps(props, exports.badgeShorthandPropsCompat));
21
- return state;
22
- };
23
- exports.useBadge = useBadge;
24
- });
25
- //# sourceMappingURL=useBadge.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useBadge.js","sourceRoot":"../src/","sources":["components/Badge/useBadge.ts"],"names":[],"mappings":";;;;IAIA;;OAEG;IACU,QAAA,yBAAyB,GAAG,CAAC,MAAM,CAAU,CAAC;IAE3D,IAAM,UAAU,GAAG,gCAAc,CAAa,EAAE,SAAS,EAAE,iCAAyB,EAAE,CAAC,CAAC;IAExF;;OAEG;IACI,IAAM,QAAQ,GAAG,UAAC,KAAiB,EAAE,GAA2B,EAAE,YAAyB;QAChG,IAAM,KAAK,GAAG,UAAU,CACtB;YACE,GAAG,EAAE,+BAAa,CAAC,GAAG,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;YAC3C,KAAK,EAAE,UAAU;YACjB,IAAI,EAAE,QAAQ;YACd,YAAY,EAAE,QAAQ;YACtB,aAAa,EAAE,IAAI;SACpB,EACD,YAAY,IAAI,uCAAqB,CAAC,YAAY,EAAE,iCAAyB,CAAC,EAC9E,uCAAqB,CAAC,KAAK,EAAE,iCAAyB,CAAC,CACxD,CAAC;QAEF,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IAdW,QAAA,QAAQ,YAcnB","sourcesContent":["import * as React from 'react';\nimport { makeMergeProps, resolveShorthandProps, useMergedRefs } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState } from './Badge.types';\n\n/**\n * Consts listing which props are shorthand props.\n */\nexport const badgeShorthandPropsCompat = ['icon'] as const;\n\nconst mergeProps = makeMergeProps<BadgeState>({ deepMerge: badgeShorthandPropsCompat });\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useBadge = (props: BadgeProps, ref: React.Ref<HTMLElement>, defaultProps?: BadgeProps): BadgeState => {\n const state = mergeProps(\n {\n ref: useMergedRefs(ref, React.useRef(null)),\n shape: 'circular',\n size: 'medium',\n iconPosition: 'before',\n 'aria-hidden': true,\n },\n defaultProps && resolveShorthandProps(defaultProps, badgeShorthandPropsCompat),\n resolveShorthandProps(props, badgeShorthandPropsCompat),\n );\n\n return state;\n};\n"]}
@@ -1,5 +0,0 @@
1
- import type { BadgeState } from './Badge.types';
2
- /**
3
- * Applies style classnames to slots
4
- */
5
- export declare const useBadgeStyles: (state: BadgeState) => BadgeState;
@@ -1,234 +0,0 @@
1
- define(["require", "exports", "@fluentui/react-make-styles"], function (require, exports, react_make_styles_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- exports.useBadgeStyles = void 0;
5
- var useStyles = react_make_styles_1.makeStyles({
6
- root: function (theme) { return ({
7
- display: 'inline-flex',
8
- boxSizing: 'border-box',
9
- alignItems: 'center',
10
- justifyContent: 'center',
11
- backgroundColor: theme.alias.color.neutral.brandBackground,
12
- borderColor: theme.alias.color.neutral.brandBackground,
13
- color: theme.alias.color.neutral.neutralForegroundOnBrand,
14
- fontWeight: theme.global.type.fontWeights.semibold,
15
- borderWidth: theme.global.strokeWidth.thin,
16
- borderStyle: 'solid',
17
- fontFamily: theme.global.type.fontFamilies.base,
18
- position: 'relative',
19
- }); },
20
- rootSmallest: {
21
- width: '6px',
22
- height: '6px',
23
- fontSize: '4px',
24
- },
25
- rootSmaller: {
26
- width: '10px',
27
- height: '10px',
28
- fontSize: '6px',
29
- },
30
- rootSmall: {
31
- minWidth: '16px',
32
- height: '16px',
33
- paddingRight: '6px',
34
- paddingLeft: '6px',
35
- gap: '4px',
36
- fontSize: '8px',
37
- },
38
- rootMedium: {
39
- height: '20px',
40
- minWidth: '20px',
41
- gap: '4px',
42
- paddingRight: '8px',
43
- paddingLeft: '8px',
44
- fontSize: '10px',
45
- },
46
- rootLarge: {
47
- minWidth: '24px',
48
- height: '24px',
49
- paddingRight: '8px',
50
- paddingLeft: '8px',
51
- fontSize: '12px',
52
- gap: '6px',
53
- },
54
- rootLargerLargest: function (theme) { return ({
55
- minWidth: '32px',
56
- height: '32px',
57
- paddingRight: '12px',
58
- paddingLeft: '12px',
59
- gap: '6px',
60
- fontSize: '12px',
61
- borderWidth: theme.global.strokeWidth.thick,
62
- }); },
63
- rootRounded: function (theme) { return ({ borderRadius: theme.global.borderRadius.medium }); },
64
- rootRoundedSmallSmallerSmallest: function (theme) { return ({ borderRadius: theme.global.borderRadius.small }); },
65
- rootCircular: { borderRadius: '99px' },
66
- rootGhost: function (theme) { return ({
67
- background: 'transparent',
68
- border: 'none',
69
- color: theme.alias.color.neutral.brandBackground,
70
- }); },
71
- rootOutline: function (theme) { return ({
72
- background: 'transparent',
73
- borderColor: theme.alias.color.neutral.brandBackground,
74
- color: theme.alias.color.neutral.brandBackground,
75
- }); },
76
- rootTint: function (theme) { return ({
77
- backgroundColor: theme.global.palette.brand.tint60,
78
- color: theme.global.palette.brand.shade40,
79
- borderColor: 'none',
80
- }); },
81
- rootFilledDanger: function (theme) { return ({
82
- backgroundColor: theme.alias.color.red.background3,
83
- color: theme.alias.color.neutral.neutralForegroundOnBrand,
84
- borderColor: theme.alias.color.red.background3,
85
- }); },
86
- rootOutlineDanger: function (theme) { return ({
87
- color: theme.alias.color.red.foreground3,
88
- borderColor: theme.alias.color.red.foreground3,
89
- }); },
90
- rootTintDanger: function (theme) { return ({
91
- backgroundColor: theme.alias.color.red.background1,
92
- color: theme.alias.color.red.foreground1,
93
- borderColor: theme.alias.color.red.foreground2,
94
- }); },
95
- rootGhostDanger: function (theme) { return ({
96
- color: theme.alias.color.red.foreground3,
97
- }); },
98
- rootFilledSevere: function (theme) { return ({
99
- backgroundColor: theme.alias.color.darkOrange.background3,
100
- color: theme.alias.color.neutral.neutralForegroundOnBrand,
101
- borderColor: 'none',
102
- }); },
103
- rootOutlineSevere: function (theme) { return ({
104
- color: theme.alias.color.darkOrange.foreground3,
105
- borderColor: theme.alias.color.darkOrange.foreground3,
106
- }); },
107
- rootTintSevere: function (theme) { return ({
108
- backgroundColor: theme.alias.color.darkOrange.background1,
109
- color: theme.alias.color.darkOrange.foreground1,
110
- borderColor: theme.alias.color.darkOrange.foreground2,
111
- }); },
112
- rootGhostSevere: function (theme) { return ({
113
- color: theme.alias.color.darkOrange.foreground3,
114
- }); },
115
- rootFilledWarning: function (theme) { return ({
116
- backgroundColor: theme.alias.color.yellow.background3,
117
- color: theme.alias.color.neutral.neutralForeground1,
118
- borderColor: theme.alias.color.yellow.background3,
119
- }); },
120
- rootOutlineWarning: function (theme) { return ({
121
- color: theme.alias.color.yellow.foreground2,
122
- borderColor: theme.alias.color.yellow.foreground2,
123
- }); },
124
- rootTintWarning: function (theme) { return ({
125
- backgroundColor: theme.alias.color.yellow.background1,
126
- color: theme.alias.color.yellow.foreground2,
127
- borderColor: theme.alias.color.yellow.background2,
128
- }); },
129
- rootGhostWarning: function (theme) { return ({
130
- color: theme.alias.color.yellow.foreground2,
131
- }); },
132
- rootFilledSuccess: function (theme) { return ({
133
- backgroundColor: theme.alias.color.green.background3,
134
- color: theme.alias.color.neutral.neutralForegroundOnBrand,
135
- borderColor: 'none',
136
- }); },
137
- rootOutlineSuccess: function (theme) { return ({
138
- color: theme.alias.color.green.foreground2,
139
- borderColor: theme.alias.color.green.foreground2,
140
- }); },
141
- rootTintSuccess: function (theme) { return ({
142
- backgroundColor: theme.alias.color.green.background1,
143
- color: theme.alias.color.green.foreground1,
144
- borderColor: theme.alias.color.green.background2,
145
- }); },
146
- rootGhostSuccess: function (theme) { return ({
147
- color: theme.alias.color.green.foreground3,
148
- }); },
149
- rootFilledImportant: function (theme) { return ({
150
- backgroundColor: theme.alias.color.neutral.neutralForeground1,
151
- color: theme.alias.color.neutral.neutralBackground1,
152
- borderColor: theme.alias.color.neutral.transparentStroke,
153
- }); },
154
- rootOutlineImportant: function (theme) { return ({
155
- color: theme.alias.color.neutral.neutralForeground1,
156
- borderColor: theme.alias.color.neutral.neutralForeground1,
157
- }); },
158
- rootTintImportant: function (theme) { return ({
159
- backgroundColor: theme.alias.color.neutral.neutralForeground3,
160
- color: theme.alias.color.neutral.neutralBackground1,
161
- borderColor: theme.alias.color.neutral.transparentStroke,
162
- }); },
163
- rootGhostImportant: function (theme) { return ({
164
- color: theme.alias.color.neutral.neutralForeground1,
165
- }); },
166
- rootFilledInformative: function (theme) { return ({
167
- backgroundColor: theme.alias.color.neutral.neutralBackground5,
168
- color: theme.alias.color.neutral.neutralForeground3,
169
- borderColor: theme.alias.color.neutral.transparentStroke,
170
- }); },
171
- rootOutlineInformative: function (theme) { return ({
172
- backgroundColor: theme.alias.color.darkOrange.background3,
173
- color: theme.alias.color.neutral.neutralBackground5,
174
- borderColor: theme.alias.color.neutral.neutralBackground5,
175
- }); },
176
- rootTintInformative: function (theme) { return ({
177
- backgroundColor: theme.alias.color.neutral.neutralBackground4,
178
- color: theme.alias.color.neutral.neutralForeground3,
179
- borderColor: theme.alias.color.neutral.neutralStroke2,
180
- }); },
181
- rootGhostInformative: function (theme) { return ({
182
- color: theme.alias.color.neutral.neutralBackground5,
183
- }); },
184
- rootFilledSubtle: function (theme) { return ({
185
- backgroundColor: theme.alias.color.neutral.neutralBackground1,
186
- color: theme.alias.color.neutral.neutralForeground1,
187
- borderColor: theme.alias.color.neutral.transparentStroke,
188
- }); },
189
- rootOutlineSubtle: function (theme) { return ({
190
- color: theme.alias.color.neutral.neutralForegroundOnBrand,
191
- borderColor: theme.alias.color.neutral.neutralForegroundOnBrand,
192
- }); },
193
- rootTintSubtle: function (theme) { return ({
194
- backgroundColor: theme.alias.color.neutral.neutralBackground1,
195
- color: theme.alias.color.neutral.neutralForeground3,
196
- borderColor: theme.alias.color.neutral.neutralStroke2,
197
- }); },
198
- rootGhostSubtle: function (theme) { return ({
199
- color: theme.alias.color.neutral.neutralForegroundOnBrand,
200
- }); },
201
- icon: {
202
- display: 'flex',
203
- alignContent: 'center',
204
- alignItems: 'center',
205
- height: '100%',
206
- },
207
- });
208
- /**
209
- * Applies style classnames to slots
210
- */
211
- var useBadgeStyles = function (state) {
212
- var styles = useStyles();
213
- var isGhost = state.appearance === 'ghost';
214
- var isOutline = state.appearance === 'outline';
215
- var isTint = state.appearance === 'tint';
216
- var isFilled = state.appearance === 'filled';
217
- var isDanger = state.color === 'danger';
218
- var isSevere = state.color === 'severe';
219
- var isWarning = state.color === 'warning';
220
- var isSuccess = state.color === 'success';
221
- var isImportant = state.color === 'important';
222
- var isInformative = state.color === 'informative';
223
- var isSubtle = state.color === 'subtle';
224
- state.className = react_make_styles_1.mergeClasses(styles.root, state.size === 'smallest' && styles.rootSmallest, state.size === 'smaller' && styles.rootSmaller, state.size === 'small' && styles.rootSmall, state.size === 'medium' && styles.rootMedium, state.size === 'large' && styles.rootLarge, (state.size === 'larger' || state.size === 'largest') && styles.rootLargerLargest, state.shape === 'circular' && styles.rootCircular, state.shape === 'rounded' && styles.rootRounded, state.shape === 'rounded' &&
225
- (state.size === 'small' || state.size === 'smaller' || state.size === 'smallest') &&
226
- styles.rootRoundedSmallSmallerSmallest, isGhost && styles.rootGhost, isOutline && styles.rootOutline, isTint && styles.rootTint, isFilled && isDanger && styles.rootFilledDanger, isOutline && isDanger && styles.rootOutlineDanger, isTint && isDanger && styles.rootTintDanger, isGhost && isDanger && styles.rootGhostDanger, isFilled && isSevere && styles.rootFilledSevere, isOutline && isSevere && styles.rootOutlineSevere, isTint && isSevere && styles.rootTintSevere, isGhost && isSevere && styles.rootGhostSevere, isFilled && isWarning && styles.rootFilledWarning, isOutline && isWarning && styles.rootOutlineWarning, isTint && isWarning && styles.rootTintWarning, isGhost && isWarning && styles.rootGhostWarning, isFilled && isSuccess && styles.rootFilledSuccess, isOutline && isSuccess && styles.rootOutlineSuccess, isTint && isSuccess && styles.rootTintSuccess, isGhost && isSuccess && styles.rootGhostSuccess, isFilled && isImportant && styles.rootFilledImportant, isOutline && isImportant && styles.rootOutlineImportant, isTint && isImportant && styles.rootTintImportant, isGhost && isImportant && styles.rootGhostImportant, isFilled && isInformative && styles.rootFilledInformative, isOutline && isInformative && styles.rootOutlineInformative, isTint && isInformative && styles.rootTintInformative, isGhost && isInformative && styles.rootGhostInformative, isFilled && isSubtle && styles.rootFilledSubtle, isOutline && isSubtle && styles.rootOutlineSubtle, isTint && isSubtle && styles.rootTintSubtle, isGhost && isSubtle && styles.rootGhostSubtle, state.className);
227
- if (state.icon) {
228
- state.icon.className = react_make_styles_1.mergeClasses(styles.icon, state.icon.className);
229
- }
230
- return state;
231
- };
232
- exports.useBadgeStyles = useBadgeStyles;
233
- });
234
- //# sourceMappingURL=useBadgeStyles.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useBadgeStyles.js","sourceRoot":"../src/","sources":["components/Badge/useBadgeStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { mergeClasses, makeStyles } from '@fluentui/react-make-styles';\nimport type { BadgeState } from './Badge.types';\n\nconst useStyles = makeStyles({\n root: theme => ({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: theme.alias.color.neutral.brandBackground,\n borderColor: theme.alias.color.neutral.brandBackground,\n color: theme.alias.color.neutral.neutralForegroundOnBrand,\n fontWeight: theme.global.type.fontWeights.semibold,\n borderWidth: theme.global.strokeWidth.thin,\n borderStyle: 'solid',\n fontFamily: theme.global.type.fontFamilies.base,\n position: 'relative',\n }),\n rootSmallest: {\n width: '6px',\n height: '6px',\n fontSize: '4px',\n },\n rootSmaller: {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n },\n rootSmall: {\n minWidth: '16px',\n height: '16px',\n paddingRight: '6px',\n paddingLeft: '6px',\n gap: '4px',\n fontSize: '8px',\n },\n rootMedium: {\n height: '20px',\n minWidth: '20px',\n gap: '4px',\n paddingRight: '8px',\n paddingLeft: '8px',\n fontSize: '10px',\n },\n rootLarge: {\n minWidth: '24px',\n height: '24px',\n paddingRight: '8px',\n paddingLeft: '8px',\n fontSize: '12px',\n gap: '6px',\n },\n rootLargerLargest: theme => ({\n minWidth: '32px',\n height: '32px',\n paddingRight: '12px',\n paddingLeft: '12px',\n gap: '6px',\n fontSize: '12px',\n borderWidth: theme.global.strokeWidth.thick,\n }),\n rootRounded: theme => ({ borderRadius: theme.global.borderRadius.medium }),\n rootRoundedSmallSmallerSmallest: theme => ({ borderRadius: theme.global.borderRadius.small }),\n rootCircular: { borderRadius: '99px' },\n rootGhost: theme => ({\n background: 'transparent',\n border: 'none',\n color: theme.alias.color.neutral.brandBackground,\n }),\n rootOutline: theme => ({\n background: 'transparent',\n borderColor: theme.alias.color.neutral.brandBackground,\n color: theme.alias.color.neutral.brandBackground,\n }),\n rootTint: theme => ({\n backgroundColor: theme.global.palette.brand.tint60,\n color: theme.global.palette.brand.shade40,\n borderColor: 'none',\n }),\n rootFilledDanger: theme => ({\n backgroundColor: theme.alias.color.red.background3,\n color: theme.alias.color.neutral.neutralForegroundOnBrand,\n borderColor: theme.alias.color.red.background3,\n }),\n rootOutlineDanger: theme => ({\n color: theme.alias.color.red.foreground3,\n borderColor: theme.alias.color.red.foreground3,\n }),\n rootTintDanger: theme => ({\n backgroundColor: theme.alias.color.red.background1,\n color: theme.alias.color.red.foreground1,\n borderColor: theme.alias.color.red.foreground2,\n }),\n rootGhostDanger: theme => ({\n color: theme.alias.color.red.foreground3,\n }),\n rootFilledSevere: theme => ({\n backgroundColor: theme.alias.color.darkOrange.background3,\n color: theme.alias.color.neutral.neutralForegroundOnBrand,\n borderColor: 'none',\n }),\n rootOutlineSevere: theme => ({\n color: theme.alias.color.darkOrange.foreground3,\n borderColor: theme.alias.color.darkOrange.foreground3,\n }),\n rootTintSevere: theme => ({\n backgroundColor: theme.alias.color.darkOrange.background1,\n color: theme.alias.color.darkOrange.foreground1,\n borderColor: theme.alias.color.darkOrange.foreground2,\n }),\n rootGhostSevere: theme => ({\n color: theme.alias.color.darkOrange.foreground3,\n }),\n rootFilledWarning: theme => ({\n backgroundColor: theme.alias.color.yellow.background3,\n color: theme.alias.color.neutral.neutralForeground1,\n borderColor: theme.alias.color.yellow.background3,\n }),\n rootOutlineWarning: theme => ({\n color: theme.alias.color.yellow.foreground2,\n borderColor: theme.alias.color.yellow.foreground2,\n }),\n rootTintWarning: theme => ({\n backgroundColor: theme.alias.color.yellow.background1,\n color: theme.alias.color.yellow.foreground2,\n borderColor: theme.alias.color.yellow.background2,\n }),\n rootGhostWarning: theme => ({\n color: theme.alias.color.yellow.foreground2,\n }),\n rootFilledSuccess: theme => ({\n backgroundColor: theme.alias.color.green.background3,\n color: theme.alias.color.neutral.neutralForegroundOnBrand,\n borderColor: 'none',\n }),\n rootOutlineSuccess: theme => ({\n color: theme.alias.color.green.foreground2,\n borderColor: theme.alias.color.green.foreground2,\n }),\n rootTintSuccess: theme => ({\n backgroundColor: theme.alias.color.green.background1,\n color: theme.alias.color.green.foreground1,\n borderColor: theme.alias.color.green.background2,\n }),\n rootGhostSuccess: theme => ({\n color: theme.alias.color.green.foreground3,\n }),\n rootFilledImportant: theme => ({\n backgroundColor: theme.alias.color.neutral.neutralForeground1,\n color: theme.alias.color.neutral.neutralBackground1,\n borderColor: theme.alias.color.neutral.transparentStroke,\n }),\n rootOutlineImportant: theme => ({\n color: theme.alias.color.neutral.neutralForeground1,\n borderColor: theme.alias.color.neutral.neutralForeground1,\n }),\n rootTintImportant: theme => ({\n backgroundColor: theme.alias.color.neutral.neutralForeground3,\n color: theme.alias.color.neutral.neutralBackground1,\n borderColor: theme.alias.color.neutral.transparentStroke,\n }),\n rootGhostImportant: theme => ({\n color: theme.alias.color.neutral.neutralForeground1,\n }),\n rootFilledInformative: theme => ({\n backgroundColor: theme.alias.color.neutral.neutralBackground5,\n color: theme.alias.color.neutral.neutralForeground3,\n borderColor: theme.alias.color.neutral.transparentStroke,\n }),\n rootOutlineInformative: theme => ({\n backgroundColor: theme.alias.color.darkOrange.background3,\n color: theme.alias.color.neutral.neutralBackground5,\n borderColor: theme.alias.color.neutral.neutralBackground5,\n }),\n rootTintInformative: theme => ({\n backgroundColor: theme.alias.color.neutral.neutralBackground4,\n color: theme.alias.color.neutral.neutralForeground3,\n borderColor: theme.alias.color.neutral.neutralStroke2,\n }),\n rootGhostInformative: theme => ({\n color: theme.alias.color.neutral.neutralBackground5,\n }),\n rootFilledSubtle: theme => ({\n backgroundColor: theme.alias.color.neutral.neutralBackground1,\n color: theme.alias.color.neutral.neutralForeground1,\n borderColor: theme.alias.color.neutral.transparentStroke,\n }),\n rootOutlineSubtle: theme => ({\n color: theme.alias.color.neutral.neutralForegroundOnBrand,\n borderColor: theme.alias.color.neutral.neutralForegroundOnBrand,\n }),\n rootTintSubtle: theme => ({\n backgroundColor: theme.alias.color.neutral.neutralBackground1,\n color: theme.alias.color.neutral.neutralForeground3,\n borderColor: theme.alias.color.neutral.neutralStroke2,\n }),\n rootGhostSubtle: theme => ({\n color: theme.alias.color.neutral.neutralForegroundOnBrand,\n }),\n icon: {\n display: 'flex',\n alignContent: 'center',\n alignItems: 'center',\n height: '100%',\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const useBadgeStyles = (state: BadgeState): BadgeState => {\n const styles = useStyles();\n const isGhost = state.appearance === 'ghost';\n const isOutline = state.appearance === 'outline';\n const isTint = state.appearance === 'tint';\n const isFilled = state.appearance === 'filled';\n const isDanger = state.color === 'danger';\n const isSevere = state.color === 'severe';\n const isWarning = state.color === 'warning';\n const isSuccess = state.color === 'success';\n const isImportant = state.color === 'important';\n const isInformative = state.color === 'informative';\n const isSubtle = state.color === 'subtle';\n\n state.className = mergeClasses(\n styles.root,\n state.size === 'smallest' && styles.rootSmallest,\n state.size === 'smaller' && styles.rootSmaller,\n state.size === 'small' && styles.rootSmall,\n state.size === 'medium' && styles.rootMedium,\n state.size === 'large' && styles.rootLarge,\n (state.size === 'larger' || state.size === 'largest') && styles.rootLargerLargest,\n state.shape === 'circular' && styles.rootCircular,\n state.shape === 'rounded' && styles.rootRounded,\n state.shape === 'rounded' &&\n (state.size === 'small' || state.size === 'smaller' || state.size === 'smallest') &&\n styles.rootRoundedSmallSmallerSmallest,\n isGhost && styles.rootGhost,\n isOutline && styles.rootOutline,\n isTint && styles.rootTint,\n isFilled && isDanger && styles.rootFilledDanger,\n isOutline && isDanger && styles.rootOutlineDanger,\n isTint && isDanger && styles.rootTintDanger,\n isGhost && isDanger && styles.rootGhostDanger,\n isFilled && isSevere && styles.rootFilledSevere,\n isOutline && isSevere && styles.rootOutlineSevere,\n isTint && isSevere && styles.rootTintSevere,\n isGhost && isSevere && styles.rootGhostSevere,\n isFilled && isWarning && styles.rootFilledWarning,\n isOutline && isWarning && styles.rootOutlineWarning,\n isTint && isWarning && styles.rootTintWarning,\n isGhost && isWarning && styles.rootGhostWarning,\n isFilled && isSuccess && styles.rootFilledSuccess,\n isOutline && isSuccess && styles.rootOutlineSuccess,\n isTint && isSuccess && styles.rootTintSuccess,\n isGhost && isSuccess && styles.rootGhostSuccess,\n isFilled && isImportant && styles.rootFilledImportant,\n isOutline && isImportant && styles.rootOutlineImportant,\n isTint && isImportant && styles.rootTintImportant,\n isGhost && isImportant && styles.rootGhostImportant,\n isFilled && isInformative && styles.rootFilledInformative,\n isOutline && isInformative && styles.rootOutlineInformative,\n isTint && isInformative && styles.rootTintInformative,\n isGhost && isInformative && styles.rootGhostInformative,\n isFilled && isSubtle && styles.rootFilledSubtle,\n isOutline && isSubtle && styles.rootOutlineSubtle,\n isTint && isSubtle && styles.rootTintSubtle,\n isGhost && isSubtle && styles.rootGhostSubtle,\n state.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(styles.icon, state.icon.className);\n }\n\n return state;\n};\n"]}
@@ -1,7 +0,0 @@
1
- import * as React from 'react';
2
- import type { CounterBadgeProps } from './CounterBadge.types';
3
- /**
4
- * Define a styled CounterBadge, using the `useCounterBadge` hook.
5
- * {@docCategory CounterBadge}
6
- */
7
- export declare const CounterBadge: React.ForwardRefExoticComponent<CounterBadgeProps & React.RefAttributes<HTMLElement>>;
@@ -1,16 +0,0 @@
1
- define(["require", "exports", "react", "./useCounterBadge", "./useCounterBadgeStyles", "../Badge/index"], function (require, exports, React, useCounterBadge_1, useCounterBadgeStyles_1, index_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- exports.CounterBadge = void 0;
5
- /**
6
- * Define a styled CounterBadge, using the `useCounterBadge` hook.
7
- * {@docCategory CounterBadge}
8
- */
9
- exports.CounterBadge = React.forwardRef(function (props, ref) {
10
- var state = useCounterBadge_1.useCounterBadge(props, ref);
11
- useCounterBadgeStyles_1.useCounterBadgeStyles(state);
12
- return index_1.renderBadge(state);
13
- });
14
- exports.CounterBadge.displayName = 'CounterBadge';
15
- });
16
- //# sourceMappingURL=CounterBadge.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CounterBadge.js","sourceRoot":"../src/","sources":["components/CounterBadge/CounterBadge.tsx"],"names":[],"mappings":";;;;IAMA;;;OAGG;IACU,QAAA,YAAY,GAAG,KAAK,CAAC,UAAU,CAAiC,UAAC,KAAK,EAAE,GAAG;QACtF,IAAM,KAAK,GAAG,iCAAe,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAC1C,6CAAqB,CAAC,KAAK,CAAC,CAAC;QAE7B,OAAO,mBAAW,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,CAAC,CAAC;IAEH,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import * as React from 'react';\nimport { useCounterBadge } from './useCounterBadge';\nimport { useCounterBadgeStyles } from './useCounterBadgeStyles';\nimport { renderBadge } from '../Badge/index';\nimport type { CounterBadgeProps } from './CounterBadge.types';\n\n/**\n * Define a styled CounterBadge, using the `useCounterBadge` hook.\n * {@docCategory CounterBadge}\n */\nexport const CounterBadge = React.forwardRef<HTMLElement, CounterBadgeProps>((props, ref) => {\n const state = useCounterBadge(props, ref);\n useCounterBadgeStyles(state);\n\n return renderBadge(state);\n});\n\nCounterBadge.displayName = 'CounterBadge';\n"]}
@@ -1,61 +0,0 @@
1
- import type { BadgeProps, BadgeState } from '../Badge/index';
2
- /**
3
- * {@docCategory CounterBadge}
4
- */
5
- export interface CounterBadgeProps extends Omit<BadgeProps, 'appearance' | 'shape'> {
6
- /**
7
- * A Badge can be circular or rounded
8
- * @defaultvalue circular
9
- */
10
- shape?: Extract<BadgeProps['shape'], 'rounded' | 'circular'>;
11
- /**
12
- * A Badge can be filled, ghost
13
- * @defaultvalue filled
14
- */
15
- appearance?: Extract<BadgeProps['appearance'], 'filled' | 'ghost'>;
16
- /**
17
- * Max number to be displayed
18
- * @defaultvalue 99
19
- */
20
- overflowCount?: number;
21
- /**
22
- * Value displayed by the Badge
23
- * @defaultvalue 0
24
- */
25
- count?: number;
26
- /**
27
- * If the badge should be shown when count is 0
28
- * @defaultvalue false
29
- */
30
- showZero?: boolean;
31
- /**
32
- * If a dot badge should be displayed
33
- * @defaultvalue false
34
- */
35
- dot?: boolean;
36
- }
37
- /**
38
- * {@docCategory CounterBadge}
39
- */
40
- export interface CounterBadgeState extends BadgeState {
41
- /**
42
- * Max number to be displayed
43
- * @defaultvalue 99
44
- */
45
- overflowCount: number;
46
- /**
47
- * Value displayed by the Badge
48
- * @defaultvalue 0
49
- */
50
- count: number;
51
- /**
52
- * If the badge should be shown when count is 0
53
- * @defaultvalue false
54
- */
55
- showZero: boolean;
56
- /**
57
- * If a dot badge should be displayed
58
- * @defaultvalue false
59
- */
60
- dot: boolean;
61
- }
@@ -1,5 +0,0 @@
1
- define(["require", "exports"], function (require, exports) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- });
5
- //# sourceMappingURL=CounterBadge.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CounterBadge.types.js","sourceRoot":"../src/","sources":["components/CounterBadge/CounterBadge.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BadgeProps, BadgeState } from '../Badge/index';\n\n/**\n * {@docCategory CounterBadge}\n */\nexport interface CounterBadgeProps extends Omit<BadgeProps, 'appearance' | 'shape'> {\n /**\n * A Badge can be circular or rounded\n * @defaultvalue circular\n */\n shape?: Extract<BadgeProps['shape'], 'rounded' | 'circular'>;\n\n /**\n * A Badge can be filled, ghost\n * @defaultvalue filled\n */\n appearance?: Extract<BadgeProps['appearance'], 'filled' | 'ghost'>;\n\n /**\n * Max number to be displayed\n * @defaultvalue 99\n */\n overflowCount?: number;\n\n /**\n * Value displayed by the Badge\n * @defaultvalue 0\n */\n count?: number;\n\n /**\n * If the badge should be shown when count is 0\n * @defaultvalue false\n */\n showZero?: boolean;\n\n /**\n * If a dot badge should be displayed\n * @defaultvalue false\n */\n dot?: boolean;\n}\n\n/**\n * {@docCategory CounterBadge}\n */\nexport interface CounterBadgeState extends BadgeState {\n /**\n * Max number to be displayed\n * @defaultvalue 99\n */\n overflowCount: number;\n\n /**\n * Value displayed by the Badge\n * @defaultvalue 0\n */\n count: number;\n\n /**\n * If the badge should be shown when count is 0\n * @defaultvalue false\n */\n showZero: boolean;\n\n /**\n * If a dot badge should be displayed\n * @defaultvalue false\n */\n dot: boolean;\n}\n"]}
@@ -1,4 +0,0 @@
1
- export * from './CounterBadge';
2
- export * from './CounterBadge.types';
3
- export * from './useCounterBadge';
4
- export * from './useCounterBadgeStyles';
@@ -1,9 +0,0 @@
1
- define(["require", "exports", "tslib", "./CounterBadge", "./CounterBadge.types", "./useCounterBadge", "./useCounterBadgeStyles"], function (require, exports, tslib_1, CounterBadge_1, CounterBadge_types_1, useCounterBadge_1, useCounterBadgeStyles_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- tslib_1.__exportStar(CounterBadge_1, exports);
5
- tslib_1.__exportStar(CounterBadge_types_1, exports);
6
- tslib_1.__exportStar(useCounterBadge_1, exports);
7
- tslib_1.__exportStar(useCounterBadgeStyles_1, exports);
8
- });
9
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/CounterBadge/index.ts"],"names":[],"mappings":";;;IAAA,8CAA+B;IAC/B,oDAAqC;IACrC,iDAAkC;IAClC,uDAAwC","sourcesContent":["export * from './CounterBadge';\nexport * from './CounterBadge.types';\nexport * from './useCounterBadge';\nexport * from './useCounterBadgeStyles';\n"]}