@fluentui/react-card 9.0.0-beta.1 → 9.0.0-beta.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (167) hide show
  1. package/CHANGELOG.json +640 -1
  2. package/CHANGELOG.md +158 -2
  3. package/README.md +3 -1
  4. package/Spec.md +523 -0
  5. package/assets/Card.png +0 -0
  6. package/assets/CardHeader.png +0 -0
  7. package/assets/CardPreview.png +0 -0
  8. package/assets/context-interaction-keyboard.png +0 -0
  9. package/assets/context-interaction-mouse.png +0 -0
  10. package/assets/context-narrator.png +0 -0
  11. package/assets/disabled-narrator.png +0 -0
  12. package/assets/disabled.png +0 -0
  13. package/assets/interactive-interaction-keyboard.png +0 -0
  14. package/assets/interactive-interaction-mouse.png +0 -0
  15. package/assets/interactive-narrator.png +0 -0
  16. package/assets/non-interactive-interaction-keyboard.png +0 -0
  17. package/assets/non-interactive-interaction-mouse.png +0 -0
  18. package/assets/non-interactive-narrator.png +0 -0
  19. package/assets/non-interactive-selectable-interaction-keyboard.png +0 -0
  20. package/assets/non-interactive-selectable-interaction-mouse.png +0 -0
  21. package/assets/selectable-interaction-keyboard.png +0 -0
  22. package/assets/selectable-interaction-mouse.png +0 -0
  23. package/assets/selectable-narrator.png +0 -0
  24. package/dist/react-card.d.ts +72 -127
  25. package/lib/Card.js.map +1 -1
  26. package/lib/CardFooter.js.map +1 -1
  27. package/lib/CardHeader.js.map +1 -1
  28. package/lib/CardPreview.js.map +1 -1
  29. package/lib/components/Card/Card.d.ts +1 -1
  30. package/lib/components/Card/Card.js +8 -8
  31. package/lib/components/Card/Card.js.map +1 -1
  32. package/lib/components/Card/Card.types.d.ts +9 -18
  33. package/lib/components/Card/Card.types.js.map +1 -1
  34. package/lib/components/Card/index.js.map +1 -1
  35. package/lib/components/Card/renderCard.d.ts +1 -1
  36. package/lib/components/Card/renderCard.js +8 -8
  37. package/lib/components/Card/renderCard.js.map +1 -1
  38. package/lib/components/Card/useCard.d.ts +3 -4
  39. package/lib/components/Card/useCard.js +23 -11
  40. package/lib/components/Card/useCard.js.map +1 -1
  41. package/lib/components/Card/useCardStyles.d.ts +8 -2
  42. package/lib/components/Card/useCardStyles.js +138 -25
  43. package/lib/components/Card/useCardStyles.js.map +1 -1
  44. package/lib/components/CardFooter/CardFooter.js +7 -7
  45. package/lib/components/CardFooter/CardFooter.js.map +1 -1
  46. package/lib/components/CardFooter/CardFooter.types.d.ts +8 -23
  47. package/lib/components/CardFooter/CardFooter.types.js.map +1 -1
  48. package/lib/components/CardFooter/index.js.map +1 -1
  49. package/lib/components/CardFooter/renderCardFooter.d.ts +1 -1
  50. package/lib/components/CardFooter/renderCardFooter.js +9 -9
  51. package/lib/components/CardFooter/renderCardFooter.js.map +1 -1
  52. package/lib/components/CardFooter/useCardFooter.d.ts +4 -9
  53. package/lib/components/CardFooter/useCardFooter.js +18 -17
  54. package/lib/components/CardFooter/useCardFooter.js.map +1 -1
  55. package/lib/components/CardFooter/useCardFooterStyles.d.ts +8 -2
  56. package/lib/components/CardFooter/useCardFooterStyles.js +18 -8
  57. package/lib/components/CardFooter/useCardFooterStyles.js.map +1 -1
  58. package/lib/components/CardHeader/CardHeader.js +7 -7
  59. package/lib/components/CardHeader/CardHeader.js.map +1 -1
  60. package/lib/components/CardHeader/CardHeader.types.d.ts +12 -39
  61. package/lib/components/CardHeader/CardHeader.types.js.map +1 -1
  62. package/lib/components/CardHeader/index.js.map +1 -1
  63. package/lib/components/CardHeader/renderCardHeader.d.ts +1 -1
  64. package/lib/components/CardHeader/renderCardHeader.js +13 -9
  65. package/lib/components/CardHeader/renderCardHeader.js.map +1 -1
  66. package/lib/components/CardHeader/useCardHeader.d.ts +4 -9
  67. package/lib/components/CardHeader/useCardHeader.js +35 -33
  68. package/lib/components/CardHeader/useCardHeader.js.map +1 -1
  69. package/lib/components/CardHeader/useCardHeaderStyles.d.ts +8 -2
  70. package/lib/components/CardHeader/useCardHeaderStyles.js +35 -9
  71. package/lib/components/CardHeader/useCardHeaderStyles.js.map +1 -1
  72. package/lib/components/CardPreview/CardPreview.js +7 -7
  73. package/lib/components/CardPreview/CardPreview.js.map +1 -1
  74. package/lib/components/CardPreview/CardPreview.types.d.ts +8 -23
  75. package/lib/components/CardPreview/CardPreview.types.js.map +1 -1
  76. package/lib/components/CardPreview/index.js.map +1 -1
  77. package/lib/components/CardPreview/renderCardPreview.d.ts +1 -1
  78. package/lib/components/CardPreview/renderCardPreview.js +9 -9
  79. package/lib/components/CardPreview/renderCardPreview.js.map +1 -1
  80. package/lib/components/CardPreview/useCardPreview.d.ts +4 -9
  81. package/lib/components/CardPreview/useCardPreview.js +18 -20
  82. package/lib/components/CardPreview/useCardPreview.js.map +1 -1
  83. package/lib/components/CardPreview/useCardPreviewStyles.d.ts +8 -2
  84. package/lib/components/CardPreview/useCardPreviewStyles.js +16 -11
  85. package/lib/components/CardPreview/useCardPreviewStyles.js.map +1 -1
  86. package/lib/index.d.ts +8 -4
  87. package/lib/index.js +5 -4
  88. package/lib/index.js.map +1 -1
  89. package/lib-commonjs/Card.js +1 -1
  90. package/lib-commonjs/Card.js.map +1 -1
  91. package/lib-commonjs/CardFooter.js +1 -1
  92. package/lib-commonjs/CardFooter.js.map +1 -1
  93. package/lib-commonjs/CardHeader.js +1 -1
  94. package/lib-commonjs/CardHeader.js.map +1 -1
  95. package/lib-commonjs/CardPreview.js +1 -1
  96. package/lib-commonjs/CardPreview.js.map +1 -1
  97. package/lib-commonjs/components/Card/Card.d.ts +1 -1
  98. package/lib-commonjs/components/Card/Card.js +9 -9
  99. package/lib-commonjs/components/Card/Card.js.map +1 -1
  100. package/lib-commonjs/components/Card/Card.types.d.ts +9 -18
  101. package/lib-commonjs/components/Card/Card.types.js.map +1 -1
  102. package/lib-commonjs/components/Card/index.js +1 -1
  103. package/lib-commonjs/components/Card/index.js.map +1 -1
  104. package/lib-commonjs/components/Card/renderCard.d.ts +1 -1
  105. package/lib-commonjs/components/Card/renderCard.js +11 -12
  106. package/lib-commonjs/components/Card/renderCard.js.map +1 -1
  107. package/lib-commonjs/components/Card/useCard.d.ts +3 -4
  108. package/lib-commonjs/components/Card/useCard.js +26 -13
  109. package/lib-commonjs/components/Card/useCard.js.map +1 -1
  110. package/lib-commonjs/components/Card/useCardStyles.d.ts +8 -2
  111. package/lib-commonjs/components/Card/useCardStyles.js +143 -28
  112. package/lib-commonjs/components/Card/useCardStyles.js.map +1 -1
  113. package/lib-commonjs/components/CardFooter/CardFooter.js +8 -8
  114. package/lib-commonjs/components/CardFooter/CardFooter.js.map +1 -1
  115. package/lib-commonjs/components/CardFooter/CardFooter.types.d.ts +8 -23
  116. package/lib-commonjs/components/CardFooter/CardFooter.types.js.map +1 -1
  117. package/lib-commonjs/components/CardFooter/index.js +1 -1
  118. package/lib-commonjs/components/CardFooter/index.js.map +1 -1
  119. package/lib-commonjs/components/CardFooter/renderCardFooter.d.ts +1 -1
  120. package/lib-commonjs/components/CardFooter/renderCardFooter.js +12 -14
  121. package/lib-commonjs/components/CardFooter/renderCardFooter.js.map +1 -1
  122. package/lib-commonjs/components/CardFooter/useCardFooter.d.ts +4 -9
  123. package/lib-commonjs/components/CardFooter/useCardFooter.js +21 -20
  124. package/lib-commonjs/components/CardFooter/useCardFooter.js.map +1 -1
  125. package/lib-commonjs/components/CardFooter/useCardFooterStyles.d.ts +8 -2
  126. package/lib-commonjs/components/CardFooter/useCardFooterStyles.js +21 -11
  127. package/lib-commonjs/components/CardFooter/useCardFooterStyles.js.map +1 -1
  128. package/lib-commonjs/components/CardHeader/CardHeader.js +8 -8
  129. package/lib-commonjs/components/CardHeader/CardHeader.js.map +1 -1
  130. package/lib-commonjs/components/CardHeader/CardHeader.types.d.ts +12 -39
  131. package/lib-commonjs/components/CardHeader/CardHeader.types.js.map +1 -1
  132. package/lib-commonjs/components/CardHeader/index.js +1 -1
  133. package/lib-commonjs/components/CardHeader/index.js.map +1 -1
  134. package/lib-commonjs/components/CardHeader/renderCardHeader.d.ts +1 -1
  135. package/lib-commonjs/components/CardHeader/renderCardHeader.js +16 -14
  136. package/lib-commonjs/components/CardHeader/renderCardHeader.js.map +1 -1
  137. package/lib-commonjs/components/CardHeader/useCardHeader.d.ts +4 -9
  138. package/lib-commonjs/components/CardHeader/useCardHeader.js +38 -37
  139. package/lib-commonjs/components/CardHeader/useCardHeader.js.map +1 -1
  140. package/lib-commonjs/components/CardHeader/useCardHeaderStyles.d.ts +8 -2
  141. package/lib-commonjs/components/CardHeader/useCardHeaderStyles.js +38 -12
  142. package/lib-commonjs/components/CardHeader/useCardHeaderStyles.js.map +1 -1
  143. package/lib-commonjs/components/CardPreview/CardPreview.js +8 -8
  144. package/lib-commonjs/components/CardPreview/CardPreview.js.map +1 -1
  145. package/lib-commonjs/components/CardPreview/CardPreview.types.d.ts +8 -23
  146. package/lib-commonjs/components/CardPreview/CardPreview.types.js.map +1 -1
  147. package/lib-commonjs/components/CardPreview/index.js +1 -1
  148. package/lib-commonjs/components/CardPreview/index.js.map +1 -1
  149. package/lib-commonjs/components/CardPreview/renderCardPreview.d.ts +1 -1
  150. package/lib-commonjs/components/CardPreview/renderCardPreview.js +12 -14
  151. package/lib-commonjs/components/CardPreview/renderCardPreview.js.map +1 -1
  152. package/lib-commonjs/components/CardPreview/useCardPreview.d.ts +4 -9
  153. package/lib-commonjs/components/CardPreview/useCardPreview.js +21 -23
  154. package/lib-commonjs/components/CardPreview/useCardPreview.js.map +1 -1
  155. package/lib-commonjs/components/CardPreview/useCardPreviewStyles.d.ts +8 -2
  156. package/lib-commonjs/components/CardPreview/useCardPreviewStyles.js +19 -14
  157. package/lib-commonjs/components/CardPreview/useCardPreviewStyles.js.map +1 -1
  158. package/lib-commonjs/index.d.ts +8 -4
  159. package/lib-commonjs/index.js +153 -5
  160. package/lib-commonjs/index.js.map +1 -1
  161. package/package.json +19 -22
  162. package/lib/common/isConformant.d.ts +0 -4
  163. package/lib/common/isConformant.js +0 -11
  164. package/lib/common/isConformant.js.map +0 -1
  165. package/lib-commonjs/common/isConformant.d.ts +0 -4
  166. package/lib-commonjs/common/isConformant.js +0 -22
  167. package/lib-commonjs/common/isConformant.js.map +0 -1
@@ -3,20 +3,34 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.useCardHeaderStyles = void 0;
6
+ exports.useCardHeaderStyles_unstable = exports.cardHeaderClassNames = exports.cardHeaderClassName = void 0;
7
7
 
8
- var react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
8
+ const react_1 = /*#__PURE__*/require("@griffel/react");
9
9
  /**
10
- * Styles for the root slot
10
+ * @deprecated Use `cardHeaderClassNames.root` instead.
11
11
  */
12
12
 
13
13
 
14
- var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
14
+ exports.cardHeaderClassName = 'fui-CardHeader';
15
+ exports.cardHeaderClassNames = {
16
+ root: 'fui-CardHeader',
17
+ image: 'fui-CardHeader__image',
18
+ content: 'fui-CardHeader__content',
19
+ header: 'fui-CardHeader__header',
20
+ description: 'fui-CardHeader__description',
21
+ action: 'fui-CardHeader__action'
22
+ };
23
+ /**
24
+ * Styles for the root slot
25
+ */
26
+
27
+ const useStyles = /*#__PURE__*/react_1.__styles({
15
28
  "root": {
16
29
  "mc9l5x": "f22iagw",
17
30
  "Beiy3e4": "f1063pyq",
18
31
  "Bt984gj": "f122n59",
19
- "rmohyg": "fsbu5mz",
32
+ "i8kkvl": "f4akndk",
33
+ "Belr9w4": "fe5j3v",
20
34
  "Bqenvij": "f1d2rq10"
21
35
  },
22
36
  "image": {
@@ -39,27 +53,39 @@ var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
39
53
  "Bn3e79g": "f1con4nn"
40
54
  }
41
55
  }, {
42
- "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".fsbu5mz{gap:12px;}", ".f1d2rq10{height:32px;}", ".f17fgpbq{min-width:24px;}", ".f1pha7fy{min-height:24px;}", ".f44c6la{max-width:32px;}", ".f17bzqcb{max-height:32px;}", ".fgn7ydb>*{min-width:inherit;}", ".f1jevvm1>*{min-height:inherit;}", ".fqihwjc>*{max-width:100%;}", ".f6x1sus>*{max-height:100%;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".fwk23hs{height:inherit;}", ".f1con4nn>*{height:50%;}"]
56
+ "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f4akndk{-webkit-column-gap:12px;column-gap:12px;}", ".fe5j3v{row-gap:12px;}", ".f1d2rq10{height:32px;}", ".f17fgpbq{min-width:24px;}", ".f1pha7fy{min-height:24px;}", ".f44c6la{max-width:32px;}", ".f17bzqcb{max-height:32px;}", ".fgn7ydb>*{min-width:inherit;}", ".f1jevvm1>*{min-height:inherit;}", ".fqihwjc>*{max-width:100%;}", ".f6x1sus>*{max-height:100%;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".fwk23hs{height:inherit;}", ".f1con4nn>*{height:50%;}"]
43
57
  });
44
58
  /**
45
59
  * Apply styling to the CardHeader slots based on the state
46
60
  */
47
61
 
48
62
 
49
- var useCardHeaderStyles = function (state) {
50
- var styles = useStyles();
51
- state.className = react_make_styles_1.mergeClasses(styles.root, state.className);
63
+ const useCardHeaderStyles_unstable = state => {
64
+ const styles = useStyles();
65
+ state.root.className = react_1.mergeClasses(exports.cardHeaderClassNames.root, styles.root, state.root.className);
52
66
 
53
67
  if (state.image) {
54
- state.image.className = react_make_styles_1.mergeClasses(styles.image, state.image.className);
68
+ state.image.className = react_1.mergeClasses(exports.cardHeaderClassNames.image, styles.image, state.image.className);
55
69
  }
56
70
 
57
71
  if (state.content) {
58
- state.content.className = react_make_styles_1.mergeClasses(styles.textContainer, state.content.className);
72
+ state.content.className = react_1.mergeClasses(exports.cardHeaderClassNames.content, styles.textContainer, state.content.className);
73
+ }
74
+
75
+ if (state.header) {
76
+ state.header.className = react_1.mergeClasses(exports.cardHeaderClassNames.header, state.header.className);
77
+ }
78
+
79
+ if (state.description) {
80
+ state.description.className = react_1.mergeClasses(exports.cardHeaderClassNames.description, state.description.className);
81
+ }
82
+
83
+ if (state.action) {
84
+ state.action.className = react_1.mergeClasses(exports.cardHeaderClassNames.action, state.action.className);
59
85
  }
60
86
 
61
87
  return state;
62
88
  };
63
89
 
64
- exports.useCardHeaderStyles = useCardHeaderStyles;
90
+ exports.useCardHeaderStyles_unstable = useCardHeaderStyles_unstable;
65
91
  //# sourceMappingURL=useCardHeaderStyles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CardHeader/useCardHeaderStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;AAGA;;AAEG;;;AACH,IAAM,SAAS,gBAAG,mBAAA,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,EAAlB;AAqCA;;AAEG;;;AACI,IAAM,mBAAmB,GAAG,UAAC,KAAD,EAAuB;AACxD,MAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,SAAN,GAAkB,mBAAA,CAAA,YAAA,CAAa,MAAM,CAAC,IAApB,EAA0B,KAAK,CAAC,SAAhC,CAAlB;;AAEA,MAAI,KAAK,CAAC,KAAV,EAAiB;AACf,IAAA,KAAK,CAAC,KAAN,CAAY,SAAZ,GAAwB,mBAAA,CAAA,YAAA,CAAa,MAAM,CAAC,KAApB,EAA2B,KAAK,CAAC,KAAN,CAAY,SAAvC,CAAxB;AACD;;AAED,MAAI,KAAK,CAAC,OAAV,EAAmB;AACjB,IAAA,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,mBAAA,CAAA,YAAA,CAAa,MAAM,CAAC,aAApB,EAAmC,KAAK,CAAC,OAAN,CAAc,SAAjD,CAA1B;AACD;;AAED,SAAO,KAAP;AACD,CAbM;;AAAM,OAAA,CAAA,mBAAA,GAAmB,mBAAnB","sourceRoot":""}
1
+ {"version":3,"sources":["components/CardHeader/useCardHeaderStyles.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;AAGA;;AAEG;;;AACU,OAAA,CAAA,mBAAA,GAAsB,gBAAtB;AACA,OAAA,CAAA,oBAAA,GAAwD;AACnE,EAAA,IAAI,EAAE,gBAD6D;AAEnE,EAAA,KAAK,EAAE,uBAF4D;AAGnE,EAAA,OAAO,EAAE,yBAH0D;AAInE,EAAA,MAAM,EAAE,wBAJ2D;AAKnE,EAAA,WAAW,EAAE,6BALsD;AAMnE,EAAA,MAAM,EAAE;AAN2D,CAAxD;AASb;;AAEG;;AACH,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,EAAlB;AAqCA;;AAEG;;;AACI,MAAM,4BAA4B,GAAI,KAAD,IAA4C;AACtF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,oBAAA,CAAqB,IAAlC,EAAwC,MAAM,CAAC,IAA/C,EAAqD,KAAK,CAAC,IAAN,CAAW,SAAhE,CAAvB;;AAEA,MAAI,KAAK,CAAC,KAAV,EAAiB;AACf,IAAA,KAAK,CAAC,KAAN,CAAY,SAAZ,GAAwB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,oBAAA,CAAqB,KAAlC,EAAyC,MAAM,CAAC,KAAhD,EAAuD,KAAK,CAAC,KAAN,CAAY,SAAnE,CAAxB;AACD;;AAED,MAAI,KAAK,CAAC,OAAV,EAAmB;AACjB,IAAA,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,oBAAA,CAAqB,OAAlC,EAA2C,MAAM,CAAC,aAAlD,EAAiE,KAAK,CAAC,OAAN,CAAc,SAA/E,CAA1B;AACD;;AAED,MAAI,KAAK,CAAC,MAAV,EAAkB;AAChB,IAAA,KAAK,CAAC,MAAN,CAAa,SAAb,GAAyB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,oBAAA,CAAqB,MAAlC,EAA0C,KAAK,CAAC,MAAN,CAAa,SAAvD,CAAzB;AACD;;AAED,MAAI,KAAK,CAAC,WAAV,EAAuB;AACrB,IAAA,KAAK,CAAC,WAAN,CAAkB,SAAlB,GAA8B,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,oBAAA,CAAqB,WAAlC,EAA+C,KAAK,CAAC,WAAN,CAAkB,SAAjE,CAA9B;AACD;;AAED,MAAI,KAAK,CAAC,MAAV,EAAkB;AAChB,IAAA,KAAK,CAAC,MAAN,CAAa,SAAb,GAAyB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,oBAAA,CAAqB,MAAlC,EAA0C,KAAK,CAAC,MAAN,CAAa,SAAvD,CAAzB;AACD;;AAED,SAAO,KAAP;AACD,CAzBM;;AAAM,OAAA,CAAA,4BAAA,GAA4B,4BAA5B","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { CardHeaderSlots, CardHeaderState } from './CardHeader.types';\n\n/**\n * @deprecated Use `cardHeaderClassNames.root` instead.\n */\nexport const cardHeaderClassName = 'fui-CardHeader';\nexport const cardHeaderClassNames: SlotClassNames<CardHeaderSlots> = {\n root: 'fui-CardHeader',\n image: 'fui-CardHeader__image',\n content: 'fui-CardHeader__content',\n header: 'fui-CardHeader__header',\n description: 'fui-CardHeader__description',\n action: 'fui-CardHeader__action',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n ...shorthands.gap('12px'),\n height: '32px',\n },\n image: {\n minWidth: '24px',\n minHeight: '24px',\n maxWidth: '32px',\n maxHeight: '32px',\n\n display: 'flex',\n alignItems: 'center',\n\n '> *': {\n minWidth: 'inherit',\n minHeight: 'inherit',\n maxWidth: '100%',\n maxHeight: '100%',\n },\n },\n\n textContainer: {\n display: 'flex',\n flexDirection: 'column',\n flexGrow: 1,\n height: 'inherit',\n\n '> *': {\n height: '50%',\n },\n },\n});\n\n/**\n * Apply styling to the CardHeader slots based on the state\n */\nexport const useCardHeaderStyles_unstable = (state: CardHeaderState): CardHeaderState => {\n const styles = useStyles();\n state.root.className = mergeClasses(cardHeaderClassNames.root, styles.root, state.root.className);\n\n if (state.image) {\n state.image.className = mergeClasses(cardHeaderClassNames.image, styles.image, state.image.className);\n }\n\n if (state.content) {\n state.content.className = mergeClasses(cardHeaderClassNames.content, styles.textContainer, state.content.className);\n }\n\n if (state.header) {\n state.header.className = mergeClasses(cardHeaderClassNames.header, state.header.className);\n }\n\n if (state.description) {\n state.description.className = mergeClasses(cardHeaderClassNames.description, state.description.className);\n }\n\n if (state.action) {\n state.action.className = mergeClasses(cardHeaderClassNames.action, state.action.className);\n }\n\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -5,22 +5,22 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.CardPreview = void 0;
7
7
 
8
- var React = /*#__PURE__*/require("react");
8
+ const React = /*#__PURE__*/require("react");
9
9
 
10
- var useCardPreview_1 = /*#__PURE__*/require("./useCardPreview");
10
+ const useCardPreview_1 = /*#__PURE__*/require("./useCardPreview");
11
11
 
12
- var renderCardPreview_1 = /*#__PURE__*/require("./renderCardPreview");
12
+ const renderCardPreview_1 = /*#__PURE__*/require("./renderCardPreview");
13
13
 
14
- var useCardPreviewStyles_1 = /*#__PURE__*/require("./useCardPreviewStyles");
14
+ const useCardPreviewStyles_1 = /*#__PURE__*/require("./useCardPreviewStyles");
15
15
  /**
16
16
  * Component to render image previews of documents or articles in a Card component.
17
17
  */
18
18
 
19
19
 
20
- exports.CardPreview = /*#__PURE__*/React.forwardRef(function (props, ref) {
21
- var state = useCardPreview_1.useCardPreview(props, ref);
22
- useCardPreviewStyles_1.useCardPreviewStyles(state);
23
- return renderCardPreview_1.renderCardPreview(state);
20
+ exports.CardPreview = /*#__PURE__*/React.forwardRef((props, ref) => {
21
+ const state = useCardPreview_1.useCardPreview_unstable(props, ref);
22
+ useCardPreviewStyles_1.useCardPreviewStyles_unstable(state);
23
+ return renderCardPreview_1.renderCardPreview_unstable(state);
24
24
  });
25
25
  exports.CardPreview.displayName = 'CardPreview';
26
26
  //# sourceMappingURL=CardPreview.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CardPreview/CardPreview.tsx"],"names":[],"mappings":";;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,IAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;;AACA,IAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,WAAA,gBAAqD,KAAK,CAAC,UAAN,CAAiB,UAAC,KAAD,EAAQ,GAAR,EAAW;AAC5F,MAAM,KAAK,GAAG,gBAAA,CAAA,cAAA,CAAe,KAAf,EAAsB,GAAtB,CAAd;AAEA,EAAA,sBAAA,CAAA,oBAAA,CAAqB,KAArB;AACA,SAAO,mBAAA,CAAA,iBAAA,CAAkB,KAAlB,CAAP;AACD,CALiE,CAArD;AAOb,OAAA,CAAA,WAAA,CAAY,WAAZ,GAA0B,aAA1B","sourceRoot":""}
1
+ {"version":3,"sources":["components/CardPreview/CardPreview.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,WAAA,gBAAqD,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAChG,QAAM,KAAK,GAAG,gBAAA,CAAA,uBAAA,CAAwB,KAAxB,EAA+B,GAA/B,CAAd;AAEA,EAAA,sBAAA,CAAA,6BAAA,CAA8B,KAA9B;AACA,SAAO,mBAAA,CAAA,0BAAA,CAA2B,KAA3B,CAAP;AACD,CALiE,CAArD;AAOb,OAAA,CAAA,WAAA,CAAY,WAAZ,GAA0B,aAA1B","sourcesContent":["import * as React from 'react';\nimport { useCardPreview_unstable } from './useCardPreview';\nimport { renderCardPreview_unstable } from './renderCardPreview';\nimport { useCardPreviewStyles_unstable } from './useCardPreviewStyles';\nimport type { CardPreviewProps } from './CardPreview.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Component to render image previews of documents or articles in a Card component.\n */\nexport const CardPreview: ForwardRefComponent<CardPreviewProps> = React.forwardRef((props, ref) => {\n const state = useCardPreview_unstable(props, ref);\n\n useCardPreviewStyles_unstable(state);\n return renderCardPreview_unstable(state);\n});\n\nCardPreview.displayName = 'CardPreview';\n"],"sourceRoot":"../src/"}
@@ -1,28 +1,13 @@
1
- import * as React from 'react';
2
- import type { ComponentPropsCompat, ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';
1
+ import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
2
+ export declare type CardPreviewSlots = {
3
+ root: Slot<'div'>;
4
+ logo?: Slot<'div'>;
5
+ };
3
6
  /**
4
- * CardPreview Props
7
+ * CardPreview props
5
8
  */
6
- export interface CardPreviewProps extends ComponentPropsCompat, React.HTMLAttributes<HTMLElement> {
7
- /**
8
- * Image slot
9
- */
10
- logo?: ShorthandPropsCompat<React.ImgHTMLAttributes<HTMLImageElement>>;
11
- }
12
- /**
13
- * Names of the shorthand properties in CardPreviewProps
14
- */
15
- export declare type CardPreviewShorthandProps = 'logo';
16
- /**
17
- * Names of CardPreviewProps that have a default value in useCardPreview
18
- */
19
- export declare type CardPreviewDefaultedProps = never;
9
+ export declare type CardPreviewProps = ComponentProps<CardPreviewSlots>;
20
10
  /**
21
11
  * State used in rendering CardPreview
22
12
  */
23
- export interface CardPreviewState extends ComponentStateCompat<CardPreviewProps, CardPreviewShorthandProps, CardPreviewDefaultedProps> {
24
- /**
25
- * Ref to the root element
26
- */
27
- ref: React.Ref<HTMLElement>;
28
- }
13
+ export declare type CardPreviewState = ComponentState<CardPreviewSlots>;
@@ -1 +1 @@
1
- {"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
1
+ {"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
 
7
- var tslib_1 = /*#__PURE__*/require("tslib");
7
+ const tslib_1 = /*#__PURE__*/require("tslib");
8
8
 
9
9
  tslib_1.__exportStar(require("./CardPreview"), exports);
10
10
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CardPreview/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA","sourceRoot":""}
1
+ {"version":3,"sources":["components/CardPreview/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './CardPreview';\nexport * from './CardPreview.types';\nexport * from './renderCardPreview';\nexport * from './useCardPreview';\nexport * from './useCardPreviewStyles';\n"],"sourceRoot":"../src/"}
@@ -2,4 +2,4 @@ import type { CardPreviewState } from './CardPreview.types';
2
2
  /**
3
3
  * Render the final JSX of CardPreview
4
4
  */
5
- export declare const renderCardPreview: (state: CardPreviewState) => JSX.Element;
5
+ export declare const renderCardPreview_unstable: (state: CardPreviewState) => JSX.Element;
@@ -3,27 +3,25 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.renderCardPreview = void 0;
6
+ exports.renderCardPreview_unstable = void 0;
7
7
 
8
- var tslib_1 = /*#__PURE__*/require("tslib");
8
+ const React = /*#__PURE__*/require("react");
9
9
 
10
- var React = /*#__PURE__*/require("react");
11
-
12
- var react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
13
-
14
- var useCardPreview_1 = /*#__PURE__*/require("./useCardPreview");
10
+ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
15
11
  /**
16
12
  * Render the final JSX of CardPreview
17
13
  */
18
14
 
19
15
 
20
- var renderCardPreview = function (state) {
21
- var _a = react_utilities_1.getSlotsCompat(state, useCardPreview_1.cardPreviewShorthandPropsCompat),
22
- slots = _a.slots,
23
- slotProps = _a.slotProps;
24
-
25
- return React.createElement(slots.root, tslib_1.__assign({}, slotProps.root), state.children, React.createElement(slots.logo, tslib_1.__assign({}, slotProps.logo)));
16
+ const renderCardPreview_unstable = state => {
17
+ const {
18
+ slots,
19
+ slotProps
20
+ } = react_utilities_1.getSlots(state);
21
+ return React.createElement(slots.root, { ...slotProps.root
22
+ }, slotProps.root.children, slots.logo && React.createElement(slots.logo, { ...slotProps.logo
23
+ }));
26
24
  };
27
25
 
28
- exports.renderCardPreview = renderCardPreview;
26
+ exports.renderCardPreview_unstable = renderCardPreview_unstable;
29
27
  //# sourceMappingURL=renderCardPreview.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CardPreview/renderCardPreview.tsx"],"names":[],"mappings":";;;;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,IAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;AAGA;;AAEG;;;AACI,IAAM,iBAAiB,GAAG,UAAC,KAAD,EAAwB;AACjD,MAAA,EAAA,GAAuB,iBAAA,CAAA,cAAA,CAAe,KAAf,EAAsB,gBAAA,CAAA,+BAAtB,CAAvB;AAAA,MAAE,KAAK,GAAA,EAAA,CAAA,KAAP;AAAA,MAAS,SAAS,GAAA,EAAA,CAAA,SAAlB;;AAEN,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,OAAA,CAAA,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,EACG,KAAK,CAAC,QADT,EAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,OAAA,CAAA,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CAFF,CADF;AAMD,CATM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB","sourceRoot":""}
1
+ {"version":3,"sources":["components/CardPreview/renderCardPreview.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,0BAA0B,GAAI,KAAD,IAA4B;AACpE,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAA2B,KAA3B,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,SAAS,CAAC,IAAV,CAAe,QADlB,EAEG,KAAK,CAAC,IAAN,IAAc,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAFjB,CADF;AAMD,CATM;;AAAM,OAAA,CAAA,0BAAA,GAA0B,0BAA1B","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { CardPreviewSlots, CardPreviewState } from './CardPreview.types';\n\n/**\n * Render the final JSX of CardPreview\n */\nexport const renderCardPreview_unstable = (state: CardPreviewState) => {\n const { slots, slotProps } = getSlots<CardPreviewSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {slotProps.root.children}\n {slots.logo && <slots.logo {...slotProps.logo} />}\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}
@@ -1,17 +1,12 @@
1
1
  import * as React from 'react';
2
- import type { CardPreviewProps, CardPreviewShorthandProps, CardPreviewState } from './CardPreview.types';
3
- /**
4
- * Array of all shorthand properties listed in CardPreviewShorthandProps
5
- */
6
- export declare const cardPreviewShorthandPropsCompat: CardPreviewShorthandProps[];
2
+ import type { CardPreviewProps, CardPreviewState } from './CardPreview.types';
7
3
  /**
8
4
  * Create the state required to render CardPreview.
9
5
  *
10
- * The returned state can be modified with hooks such as useCardPreviewStyles,
11
- * before being passed to renderCardPreview.
6
+ * The returned state can be modified with hooks such as useCardPreviewStyles_unstable,
7
+ * before being passed to renderCardPreview_unstable.
12
8
  *
13
9
  * @param props - props from this instance of CardPreview
14
10
  * @param ref - reference to root HTMLElement of CardPreview
15
- * @param defaultProps - (optional) default prop values provided by the implementing type
16
11
  */
17
- export declare const useCardPreview: (props: CardPreviewProps, ref: React.Ref<HTMLElement>, defaultProps?: CardPreviewProps | undefined) => CardPreviewState;
12
+ export declare const useCardPreview_unstable: (props: CardPreviewProps, ref: React.Ref<HTMLElement>) => CardPreviewState;
@@ -3,38 +3,36 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.useCardPreview = exports.cardPreviewShorthandPropsCompat = void 0;
6
+ exports.useCardPreview_unstable = void 0;
7
7
 
8
- var react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
9
- /**
10
- * Array of all shorthand properties listed in CardPreviewShorthandProps
11
- */
12
-
13
-
14
- exports.cardPreviewShorthandPropsCompat = ['logo'];
15
- var mergeProps = /*#__PURE__*/react_utilities_1.makeMergeProps({
16
- deepMerge: exports.cardPreviewShorthandPropsCompat
17
- });
8
+ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
18
9
  /**
19
10
  * Create the state required to render CardPreview.
20
11
  *
21
- * The returned state can be modified with hooks such as useCardPreviewStyles,
22
- * before being passed to renderCardPreview.
12
+ * The returned state can be modified with hooks such as useCardPreviewStyles_unstable,
13
+ * before being passed to renderCardPreview_unstable.
23
14
  *
24
15
  * @param props - props from this instance of CardPreview
25
16
  * @param ref - reference to root HTMLElement of CardPreview
26
- * @param defaultProps - (optional) default prop values provided by the implementing type
27
17
  */
28
18
 
29
- var useCardPreview = function (props, ref, defaultProps) {
30
- var state = mergeProps({
31
- ref: ref,
32
- logo: {
33
- as: 'div'
34
- }
35
- }, defaultProps && react_utilities_1.resolveShorthandProps(defaultProps, exports.cardPreviewShorthandPropsCompat), react_utilities_1.resolveShorthandProps(props, exports.cardPreviewShorthandPropsCompat));
36
- return state;
19
+
20
+ const useCardPreview_unstable = (props, ref) => {
21
+ const {
22
+ logo
23
+ } = props;
24
+ return {
25
+ components: {
26
+ root: 'div',
27
+ logo: 'div'
28
+ },
29
+ root: react_utilities_1.getNativeElementProps('div', {
30
+ ref,
31
+ ...props
32
+ }),
33
+ logo: react_utilities_1.resolveShorthand(logo)
34
+ };
37
35
  };
38
36
 
39
- exports.useCardPreview = useCardPreview;
37
+ exports.useCardPreview_unstable = useCardPreview_unstable;
40
38
  //# sourceMappingURL=useCardPreview.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CardPreview/useCardPreview.ts"],"names":[],"mappings":";;;;;;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACU,OAAA,CAAA,+BAAA,GAA+D,CAAC,MAAD,CAA/D;AAEb,IAAM,UAAU,gBAAG,iBAAA,CAAA,cAAA,CAAiC;AAAE,EAAA,SAAS,EAAE,OAAA,CAAA;AAAb,CAAjC,CAAnB;AAEA;;;;;;;;;AASG;;AACI,IAAM,cAAc,GAAG,UAC5B,KAD4B,EAE5B,GAF4B,EAG5B,YAH4B,EAGG;AAE/B,MAAM,KAAK,GAAG,UAAU,CACtB;AACE,IAAA,GAAG,EAAA,GADL;AAEE,IAAA,IAAI,EAAE;AAAE,MAAA,EAAE,EAAE;AAAN;AAFR,GADsB,EAKtB,YAAY,IAAI,iBAAA,CAAA,qBAAA,CAAsB,YAAtB,EAAoC,OAAA,CAAA,+BAApC,CALM,EAMtB,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B,OAAA,CAAA,+BAA7B,CANsB,CAAxB;AASA,SAAO,KAAP;AACD,CAfM;;AAAM,OAAA,CAAA,cAAA,GAAc,cAAd","sourceRoot":""}
1
+ {"version":3,"sources":["components/CardPreview/useCardPreview.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;;;;;;;AAQG;;;AACI,MAAM,uBAAuB,GAAG,CAAC,KAAD,EAA0B,GAA1B,KAA2E;AAChH,QAAM;AAAE,IAAA;AAAF,MAAW,KAAjB;AACA,SAAO;AACL,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,IAAI,EAAE;AAFI,KADP;AAML,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;AACjC,MAAA,GADiC;AAEjC,SAAG;AAF8B,KAA7B,CAND;AAUL,IAAA,IAAI,EAAE,iBAAA,CAAA,gBAAA,CAAiB,IAAjB;AAVD,GAAP;AAYD,CAdM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport type { CardPreviewProps, CardPreviewState } from './CardPreview.types';\n\n/**\n * Create the state required to render CardPreview.\n *\n * The returned state can be modified with hooks such as useCardPreviewStyles_unstable,\n * before being passed to renderCardPreview_unstable.\n *\n * @param props - props from this instance of CardPreview\n * @param ref - reference to root HTMLElement of CardPreview\n */\nexport const useCardPreview_unstable = (props: CardPreviewProps, ref: React.Ref<HTMLElement>): CardPreviewState => {\n const { logo } = props;\n return {\n components: {\n root: 'div',\n logo: 'div',\n },\n\n root: getNativeElementProps('div', {\n ref,\n ...props,\n }),\n logo: resolveShorthand(logo),\n };\n};\n"],"sourceRoot":"../src/"}
@@ -1,5 +1,11 @@
1
- import type { CardPreviewState } from './CardPreview.types';
1
+ import type { SlotClassNames } from '@fluentui/react-utilities';
2
+ import type { CardPreviewSlots, CardPreviewState } from './CardPreview.types';
3
+ /**
4
+ * @deprecated Use `cardPreviewClassNames.root` instead.
5
+ */
6
+ export declare const cardPreviewClassName = "fui-CardPreview";
7
+ export declare const cardPreviewClassNames: SlotClassNames<CardPreviewSlots>;
2
8
  /**
3
9
  * Apply styling to the CardPreview slots based on the state
4
10
  */
5
- export declare const useCardPreviewStyles: (state: CardPreviewState) => CardPreviewState;
11
+ export declare const useCardPreviewStyles_unstable: (state: CardPreviewState) => CardPreviewState;
@@ -3,21 +3,26 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.useCardPreviewStyles = void 0;
6
+ exports.useCardPreviewStyles_unstable = exports.cardPreviewClassNames = exports.cardPreviewClassName = void 0;
7
7
 
8
- var react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
8
+ const react_1 = /*#__PURE__*/require("@griffel/react");
9
9
  /**
10
- * Styles for the root slot
10
+ * @deprecated Use `cardPreviewClassNames.root` instead.
11
11
  */
12
12
 
13
13
 
14
- var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
14
+ exports.cardPreviewClassName = 'fui-CardPreview';
15
+ exports.cardPreviewClassNames = {
16
+ root: 'fui-CardPreview',
17
+ logo: 'fui-CardPreview__logo'
18
+ };
19
+ /**
20
+ * Styles for the root slot
21
+ */
22
+
23
+ const useStyles = /*#__PURE__*/react_1.__styles({
15
24
  "root": {
16
25
  "qhf8xq": "f10pi13n",
17
- "B6of3ja": "f1hu3pq6",
18
- "t21cq0": ["f8nhgx1", "f16yxz7i"],
19
- "jrapky": "f19f4twv",
20
- "Frg6f3": ["f16yxz7i", "f8nhgx1"],
21
26
  "Bb0eobv": "floiv14",
22
27
  "m1g0b5": "f1r7p6p5"
23
28
  },
@@ -29,23 +34,23 @@ var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
29
34
  "Bqenvij": "f1d2rq10"
30
35
  }
31
36
  }, {
32
- "d": [".f10pi13n{position:relative;}", ".f1hu3pq6{margin-top:0;}", ".f8nhgx1{margin-right:-12px;}", ".f16yxz7i{margin-left:-12px;}", ".f19f4twv{margin-bottom:0;}", ".floiv14>*{display:block;}", ".f1r7p6p5>*{width:100%;}", ".f1euv43f{position:absolute;}", ".f1gcvs1y{bottom:12px;}", ".f1t6tvco{left:12px;}", ".ffrfxm3{right:12px;}", ".f1szoe96{width:32px;}", ".f1d2rq10{height:32px;}"]
37
+ "d": [".f10pi13n{position:relative;}", ".floiv14>*{display:block;}", ".f1r7p6p5>*{width:100%;}", ".f1euv43f{position:absolute;}", ".f1gcvs1y{bottom:12px;}", ".f1t6tvco{left:12px;}", ".ffrfxm3{right:12px;}", ".f1szoe96{width:32px;}", ".f1d2rq10{height:32px;}"]
33
38
  });
34
39
  /**
35
40
  * Apply styling to the CardPreview slots based on the state
36
41
  */
37
42
 
38
43
 
39
- var useCardPreviewStyles = function (state) {
40
- var styles = useStyles();
41
- state.className = react_make_styles_1.mergeClasses('fluentui-react-card-preview', styles.root, state.className);
44
+ const useCardPreviewStyles_unstable = state => {
45
+ const styles = useStyles();
46
+ state.root.className = react_1.mergeClasses(exports.cardPreviewClassNames.root, styles.root, state.root.className);
42
47
 
43
48
  if (state.logo) {
44
- state.logo.className = react_make_styles_1.mergeClasses(styles.logo, state.logo.className);
49
+ state.logo.className = react_1.mergeClasses(exports.cardPreviewClassNames.logo, styles.logo, state.logo.className);
45
50
  }
46
51
 
47
52
  return state;
48
53
  };
49
54
 
50
- exports.useCardPreviewStyles = useCardPreviewStyles;
55
+ exports.useCardPreviewStyles_unstable = useCardPreviewStyles_unstable;
51
56
  //# sourceMappingURL=useCardPreviewStyles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/CardPreview/useCardPreviewStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;AAGA;;AAEG;;;AACH,IAAM,SAAS,gBAAG,mBAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAqBA;;AAEG;;;AACI,IAAM,oBAAoB,GAAG,UAAC,KAAD,EAAwB;AAC1D,MAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,SAAN,GAAkB,mBAAA,CAAA,YAAA,CAAa,6BAAb,EAA4C,MAAM,CAAC,IAAnD,EAAyD,KAAK,CAAC,SAA/D,CAAlB;;AAEA,MAAI,KAAK,CAAC,IAAV,EAAgB;AACd,IAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,mBAAA,CAAA,YAAA,CAAa,MAAM,CAAC,IAApB,EAA0B,KAAK,CAAC,IAAN,CAAW,SAArC,CAAvB;AACD;;AAED,SAAO,KAAP;AACD,CATM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourceRoot":""}
1
+ {"version":3,"sources":["components/CardPreview/useCardPreviewStyles.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;AAGA;;AAEG;;;AACU,OAAA,CAAA,oBAAA,GAAuB,iBAAvB;AACA,OAAA,CAAA,qBAAA,GAA0D;AACrE,EAAA,IAAI,EAAE,iBAD+D;AAErE,EAAA,IAAI,EAAE;AAF+D,CAA1D;AAKb;;AAEG;;AACH,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAmBA;;AAEG;;;AACI,MAAM,6BAA6B,GAAI,KAAD,IAA8C;AACzF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,qBAAA,CAAsB,IAAnC,EAAyC,MAAM,CAAC,IAAhD,EAAsD,KAAK,CAAC,IAAN,CAAW,SAAjE,CAAvB;;AAEA,MAAI,KAAK,CAAC,IAAV,EAAgB;AACd,IAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,qBAAA,CAAsB,IAAnC,EAAyC,MAAM,CAAC,IAAhD,EAAsD,KAAK,CAAC,IAAN,CAAW,SAAjE,CAAvB;AACD;;AAED,SAAO,KAAP;AACD,CATM;;AAAM,OAAA,CAAA,6BAAA,GAA6B,6BAA7B","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { CardPreviewSlots, CardPreviewState } from './CardPreview.types';\n\n/**\n * @deprecated Use `cardPreviewClassNames.root` instead.\n */\nexport const cardPreviewClassName = 'fui-CardPreview';\nexport const cardPreviewClassNames: SlotClassNames<CardPreviewSlots> = {\n root: 'fui-CardPreview',\n logo: 'fui-CardPreview__logo',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n position: 'relative',\n\n '> *': {\n display: 'block',\n width: '100%',\n },\n },\n\n logo: {\n position: 'absolute',\n bottom: '12px',\n left: '12px',\n width: '32px',\n height: '32px',\n },\n});\n\n/**\n * Apply styling to the CardPreview slots based on the state\n */\nexport const useCardPreviewStyles_unstable = (state: CardPreviewState): CardPreviewState => {\n const styles = useStyles();\n state.root.className = mergeClasses(cardPreviewClassNames.root, styles.root, state.root.className);\n\n if (state.logo) {\n state.logo.className = mergeClasses(cardPreviewClassNames.logo, styles.logo, state.logo.className);\n }\n\n return state;\n};\n"],"sourceRoot":"../src/"}
@@ -1,4 +1,8 @@
1
- export * from './Card';
2
- export * from './CardFooter';
3
- export * from './CardHeader';
4
- export * from './CardPreview';
1
+ export { Card, cardClassName, cardClassNames, renderCard_unstable, useCardStyles_unstable, useCard_unstable, } from './Card';
2
+ export type { CardCommons, CardProps, CardSlots, CardState } from './Card';
3
+ export { CardFooter, cardFooterClassName, cardFooterClassNames, renderCardFooter_unstable, useCardFooterStyles_unstable, useCardFooter_unstable, } from './CardFooter';
4
+ export type { CardFooterProps, CardFooterSlots, CardFooterState } from './CardFooter';
5
+ export { CardHeader, cardHeaderClassName, cardHeaderClassNames, renderCardHeader_unstable, useCardHeaderStyles_unstable, useCardHeader_unstable, } from './CardHeader';
6
+ export type { CardHeaderProps, CardHeaderSlots, CardHeaderState } from './CardHeader';
7
+ export { CardPreview, cardPreviewClassName, cardPreviewClassNames, renderCardPreview_unstable, useCardPreviewStyles_unstable, useCardPreview_unstable, } from './CardPreview';
8
+ export type { CardPreviewProps, CardPreviewSlots, CardPreviewState } from './CardPreview';
@@ -1,16 +1,164 @@
1
1
  "use strict";
2
+ /* eslint-disable deprecation/deprecation -- https://github.com/microsoft/fluentui/pull/21960#issuecomment-1068991851*/
2
3
 
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
7
+ exports.useCardPreview_unstable = exports.useCardPreviewStyles_unstable = exports.renderCardPreview_unstable = exports.cardPreviewClassNames = exports.cardPreviewClassName = exports.CardPreview = exports.useCardHeader_unstable = exports.useCardHeaderStyles_unstable = exports.renderCardHeader_unstable = exports.cardHeaderClassNames = exports.cardHeaderClassName = exports.CardHeader = exports.useCardFooter_unstable = exports.useCardFooterStyles_unstable = exports.renderCardFooter_unstable = exports.cardFooterClassNames = exports.cardFooterClassName = exports.CardFooter = exports.useCard_unstable = exports.useCardStyles_unstable = exports.renderCard_unstable = exports.cardClassNames = exports.cardClassName = exports.Card = void 0;
6
8
 
7
- var tslib_1 = /*#__PURE__*/require("tslib");
9
+ var Card_1 = /*#__PURE__*/require("./Card");
8
10
 
9
- tslib_1.__exportStar(require("./Card"), exports);
11
+ Object.defineProperty(exports, "Card", {
12
+ enumerable: true,
13
+ get: function () {
14
+ return Card_1.Card;
15
+ }
16
+ });
17
+ Object.defineProperty(exports, "cardClassName", {
18
+ enumerable: true,
19
+ get: function () {
20
+ return Card_1.cardClassName;
21
+ }
22
+ });
23
+ Object.defineProperty(exports, "cardClassNames", {
24
+ enumerable: true,
25
+ get: function () {
26
+ return Card_1.cardClassNames;
27
+ }
28
+ });
29
+ Object.defineProperty(exports, "renderCard_unstable", {
30
+ enumerable: true,
31
+ get: function () {
32
+ return Card_1.renderCard_unstable;
33
+ }
34
+ });
35
+ Object.defineProperty(exports, "useCardStyles_unstable", {
36
+ enumerable: true,
37
+ get: function () {
38
+ return Card_1.useCardStyles_unstable;
39
+ }
40
+ });
41
+ Object.defineProperty(exports, "useCard_unstable", {
42
+ enumerable: true,
43
+ get: function () {
44
+ return Card_1.useCard_unstable;
45
+ }
46
+ });
47
+
48
+ var CardFooter_1 = /*#__PURE__*/require("./CardFooter");
10
49
 
11
- tslib_1.__exportStar(require("./CardFooter"), exports);
50
+ Object.defineProperty(exports, "CardFooter", {
51
+ enumerable: true,
52
+ get: function () {
53
+ return CardFooter_1.CardFooter;
54
+ }
55
+ });
56
+ Object.defineProperty(exports, "cardFooterClassName", {
57
+ enumerable: true,
58
+ get: function () {
59
+ return CardFooter_1.cardFooterClassName;
60
+ }
61
+ });
62
+ Object.defineProperty(exports, "cardFooterClassNames", {
63
+ enumerable: true,
64
+ get: function () {
65
+ return CardFooter_1.cardFooterClassNames;
66
+ }
67
+ });
68
+ Object.defineProperty(exports, "renderCardFooter_unstable", {
69
+ enumerable: true,
70
+ get: function () {
71
+ return CardFooter_1.renderCardFooter_unstable;
72
+ }
73
+ });
74
+ Object.defineProperty(exports, "useCardFooterStyles_unstable", {
75
+ enumerable: true,
76
+ get: function () {
77
+ return CardFooter_1.useCardFooterStyles_unstable;
78
+ }
79
+ });
80
+ Object.defineProperty(exports, "useCardFooter_unstable", {
81
+ enumerable: true,
82
+ get: function () {
83
+ return CardFooter_1.useCardFooter_unstable;
84
+ }
85
+ });
12
86
 
13
- tslib_1.__exportStar(require("./CardHeader"), exports);
87
+ var CardHeader_1 = /*#__PURE__*/require("./CardHeader");
14
88
 
15
- tslib_1.__exportStar(require("./CardPreview"), exports);
89
+ Object.defineProperty(exports, "CardHeader", {
90
+ enumerable: true,
91
+ get: function () {
92
+ return CardHeader_1.CardHeader;
93
+ }
94
+ });
95
+ Object.defineProperty(exports, "cardHeaderClassName", {
96
+ enumerable: true,
97
+ get: function () {
98
+ return CardHeader_1.cardHeaderClassName;
99
+ }
100
+ });
101
+ Object.defineProperty(exports, "cardHeaderClassNames", {
102
+ enumerable: true,
103
+ get: function () {
104
+ return CardHeader_1.cardHeaderClassNames;
105
+ }
106
+ });
107
+ Object.defineProperty(exports, "renderCardHeader_unstable", {
108
+ enumerable: true,
109
+ get: function () {
110
+ return CardHeader_1.renderCardHeader_unstable;
111
+ }
112
+ });
113
+ Object.defineProperty(exports, "useCardHeaderStyles_unstable", {
114
+ enumerable: true,
115
+ get: function () {
116
+ return CardHeader_1.useCardHeaderStyles_unstable;
117
+ }
118
+ });
119
+ Object.defineProperty(exports, "useCardHeader_unstable", {
120
+ enumerable: true,
121
+ get: function () {
122
+ return CardHeader_1.useCardHeader_unstable;
123
+ }
124
+ });
125
+
126
+ var CardPreview_1 = /*#__PURE__*/require("./CardPreview");
127
+
128
+ Object.defineProperty(exports, "CardPreview", {
129
+ enumerable: true,
130
+ get: function () {
131
+ return CardPreview_1.CardPreview;
132
+ }
133
+ });
134
+ Object.defineProperty(exports, "cardPreviewClassName", {
135
+ enumerable: true,
136
+ get: function () {
137
+ return CardPreview_1.cardPreviewClassName;
138
+ }
139
+ });
140
+ Object.defineProperty(exports, "cardPreviewClassNames", {
141
+ enumerable: true,
142
+ get: function () {
143
+ return CardPreview_1.cardPreviewClassNames;
144
+ }
145
+ });
146
+ Object.defineProperty(exports, "renderCardPreview_unstable", {
147
+ enumerable: true,
148
+ get: function () {
149
+ return CardPreview_1.renderCardPreview_unstable;
150
+ }
151
+ });
152
+ Object.defineProperty(exports, "useCardPreviewStyles_unstable", {
153
+ enumerable: true,
154
+ get: function () {
155
+ return CardPreview_1.useCardPreviewStyles_unstable;
156
+ }
157
+ });
158
+ Object.defineProperty(exports, "useCardPreview_unstable", {
159
+ enumerable: true,
160
+ get: function () {
161
+ return CardPreview_1.useCardPreview_unstable;
162
+ }
163
+ });
16
164
  //# sourceMappingURL=index.js.map