@mattermost/compass-ui 0.1.0-alpha.6 → 0.1.0-alpha.7

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 (247) hide show
  1. package/dist/components/action-button/ActionButton.cjs.map +1 -1
  2. package/dist/components/action-button/ActionButton.d.ts +1 -0
  3. package/dist/components/action-button/ActionButton.d.ts.map +1 -1
  4. package/dist/components/action-button/ActionButton.js.map +1 -1
  5. package/dist/components/admin-panel/AdminPanel.cjs.map +1 -1
  6. package/dist/components/admin-panel/AdminPanel.d.ts +1 -0
  7. package/dist/components/admin-panel/AdminPanel.d.ts.map +1 -1
  8. package/dist/components/admin-panel/AdminPanel.js.map +1 -1
  9. package/dist/components/admin-panel-header/AdminPanelHeader.cjs.map +1 -1
  10. package/dist/components/admin-panel-header/AdminPanelHeader.d.ts +1 -0
  11. package/dist/components/admin-panel-header/AdminPanelHeader.d.ts.map +1 -1
  12. package/dist/components/admin-panel-header/AdminPanelHeader.js.map +1 -1
  13. package/dist/components/button/Button.cjs +1 -1
  14. package/dist/components/button/Button.cjs.map +1 -1
  15. package/dist/components/button/Button.d.ts +2 -2
  16. package/dist/components/button/Button.d.ts.map +1 -1
  17. package/dist/components/button/Button.js +24 -24
  18. package/dist/components/button/Button.js.map +1 -1
  19. package/dist/components/button/Button.module.css +1 -1
  20. package/dist/components/button/Button.module.scss.cjs +1 -1
  21. package/dist/components/button/Button.module.scss.js +13 -12
  22. package/dist/components/button/Button.module.scss.js.map +1 -1
  23. package/dist/components/card-button/CardButton.cjs +2 -0
  24. package/dist/components/card-button/CardButton.cjs.map +1 -0
  25. package/dist/components/card-button/CardButton.d.ts +20 -0
  26. package/dist/components/card-button/CardButton.d.ts.map +1 -0
  27. package/dist/components/card-button/CardButton.js +45 -0
  28. package/dist/components/card-button/CardButton.js.map +1 -0
  29. package/dist/components/card-button/CardButton.module.css +1 -0
  30. package/dist/components/card-button/CardButton.module.scss.cjs +2 -0
  31. package/dist/components/card-button/CardButton.module.scss.cjs.map +1 -0
  32. package/dist/components/card-button/CardButton.module.scss.js +13 -0
  33. package/dist/components/card-button/CardButton.module.scss.js.map +1 -0
  34. package/dist/components/card-button/CardButtonGroup.cjs +2 -0
  35. package/dist/components/card-button/CardButtonGroup.cjs.map +1 -0
  36. package/dist/components/card-button/CardButtonGroup.d.ts +13 -0
  37. package/dist/components/card-button/CardButtonGroup.d.ts.map +1 -0
  38. package/dist/components/card-button/CardButtonGroup.js +85 -0
  39. package/dist/components/card-button/CardButtonGroup.js.map +1 -0
  40. package/dist/components/card-button/CardButtonGroup.module.css +1 -0
  41. package/dist/components/card-button/CardButtonGroup.module.scss.cjs +2 -0
  42. package/dist/components/card-button/CardButtonGroup.module.scss.cjs.map +1 -0
  43. package/dist/components/card-button/CardButtonGroup.module.scss.js +7 -0
  44. package/dist/components/card-button/CardButtonGroup.module.scss.js.map +1 -0
  45. package/dist/components/card-button/index.cjs +2 -0
  46. package/dist/components/card-button/index.d.ts +5 -0
  47. package/dist/components/card-button/index.d.ts.map +1 -0
  48. package/dist/components/card-button/index.js +7 -0
  49. package/dist/components/card-button/index.js.map +1 -0
  50. package/dist/components/emoji-button/EmojiButton.cjs +2 -0
  51. package/dist/components/emoji-button/EmojiButton.cjs.map +1 -0
  52. package/dist/components/emoji-button/EmojiButton.d.ts +30 -0
  53. package/dist/components/emoji-button/EmojiButton.d.ts.map +1 -0
  54. package/dist/components/emoji-button/EmojiButton.js +35 -0
  55. package/dist/components/emoji-button/EmojiButton.js.map +1 -0
  56. package/dist/components/emoji-button/EmojiButton.module.css +1 -0
  57. package/dist/components/emoji-button/EmojiButton.module.scss.cjs +2 -0
  58. package/dist/components/emoji-button/EmojiButton.module.scss.cjs.map +1 -0
  59. package/dist/components/emoji-button/EmojiButton.module.scss.js +15 -0
  60. package/dist/components/emoji-button/EmojiButton.module.scss.js.map +1 -0
  61. package/dist/components/emoji-button/index.cjs +2 -0
  62. package/dist/components/emoji-button/index.cjs.map +1 -0
  63. package/dist/components/emoji-button/index.d.ts +3 -0
  64. package/dist/components/emoji-button/index.d.ts.map +1 -0
  65. package/dist/components/emoji-button/index.js +6 -0
  66. package/dist/components/emoji-popover/EmojiPopover.cjs +2 -0
  67. package/dist/components/emoji-popover/EmojiPopover.cjs.map +1 -0
  68. package/dist/components/emoji-popover/EmojiPopover.d.ts +34 -0
  69. package/dist/components/emoji-popover/EmojiPopover.d.ts.map +1 -0
  70. package/dist/components/emoji-popover/EmojiPopover.js +244 -0
  71. package/dist/components/emoji-popover/EmojiPopover.js.map +1 -0
  72. package/dist/components/emoji-popover/EmojiPopover.module.css +1 -0
  73. package/dist/components/emoji-popover/EmojiPopover.module.scss.cjs +2 -0
  74. package/dist/components/emoji-popover/EmojiPopover.module.scss.cjs.map +1 -0
  75. package/dist/components/emoji-popover/EmojiPopover.module.scss.js +27 -0
  76. package/dist/components/emoji-popover/EmojiPopover.module.scss.js.map +1 -0
  77. package/dist/components/{message-reactions → emoji-popover}/index.cjs +1 -1
  78. package/dist/components/emoji-popover/index.cjs.map +1 -0
  79. package/dist/components/emoji-popover/index.d.ts +3 -0
  80. package/dist/components/emoji-popover/index.d.ts.map +1 -0
  81. package/dist/components/emoji-popover/index.js +5 -0
  82. package/dist/components/emoji-popover/index.js.map +1 -0
  83. package/dist/components/global-banner/GlobalBanner.cjs.map +1 -1
  84. package/dist/components/global-banner/GlobalBanner.d.ts +1 -1
  85. package/dist/components/global-banner/GlobalBanner.d.ts.map +1 -1
  86. package/dist/components/global-banner/GlobalBanner.js.map +1 -1
  87. package/dist/components/global-header/GlobalHeader.module.css +1 -1
  88. package/dist/components/global-header/GlobalHeader.module.scss.cjs +1 -1
  89. package/dist/components/global-header/GlobalHeader.module.scss.js +16 -16
  90. package/dist/components/menu-group-heading/MenuGroupHeading.cjs +2 -0
  91. package/dist/components/menu-group-heading/MenuGroupHeading.cjs.map +1 -0
  92. package/dist/components/menu-group-heading/MenuGroupHeading.d.ts +11 -0
  93. package/dist/components/menu-group-heading/MenuGroupHeading.d.ts.map +1 -0
  94. package/dist/components/menu-group-heading/MenuGroupHeading.js +20 -0
  95. package/dist/components/menu-group-heading/MenuGroupHeading.js.map +1 -0
  96. package/dist/components/menu-group-heading/MenuGroupHeading.module.css +1 -0
  97. package/dist/components/menu-group-heading/MenuGroupHeading.module.scss.cjs +2 -0
  98. package/dist/components/menu-group-heading/MenuGroupHeading.module.scss.cjs.map +1 -0
  99. package/dist/components/menu-group-heading/MenuGroupHeading.module.scss.js +8 -0
  100. package/dist/components/menu-group-heading/MenuGroupHeading.module.scss.js.map +1 -0
  101. package/dist/components/menu-group-heading/index.cjs +2 -0
  102. package/dist/components/menu-group-heading/index.cjs.map +1 -0
  103. package/dist/components/menu-group-heading/index.d.ts +3 -0
  104. package/dist/components/menu-group-heading/index.d.ts.map +1 -0
  105. package/dist/components/menu-group-heading/index.js +5 -0
  106. package/dist/components/menu-group-heading/index.js.map +1 -0
  107. package/dist/components/menu-item/MenuItem.cjs.map +1 -1
  108. package/dist/components/menu-item/MenuItem.d.ts +2 -2
  109. package/dist/components/menu-item/MenuItem.d.ts.map +1 -1
  110. package/dist/components/menu-item/MenuItem.js.map +1 -1
  111. package/dist/components/message-separator/MessageSeparator.cjs +1 -1
  112. package/dist/components/message-separator/MessageSeparator.cjs.map +1 -1
  113. package/dist/components/message-separator/MessageSeparator.d.ts +1 -1
  114. package/dist/components/message-separator/MessageSeparator.js +1 -1
  115. package/dist/components/message-separator/MessageSeparator.js.map +1 -1
  116. package/dist/components/modal/Modal.cjs +1 -1
  117. package/dist/components/modal/Modal.cjs.map +1 -1
  118. package/dist/components/modal/Modal.d.ts +43 -11
  119. package/dist/components/modal/Modal.d.ts.map +1 -1
  120. package/dist/components/modal/Modal.js +56 -74
  121. package/dist/components/modal/Modal.js.map +1 -1
  122. package/dist/components/modal/Modal.module.css +1 -1
  123. package/dist/components/modal/Modal.module.scss.cjs +1 -1
  124. package/dist/components/modal/Modal.module.scss.js +12 -25
  125. package/dist/components/modal/Modal.module.scss.js.map +1 -1
  126. package/dist/components/modal/index.d.ts +1 -1
  127. package/dist/components/modal/index.d.ts.map +1 -1
  128. package/dist/components/modal-footer/ModalFooter.cjs +2 -0
  129. package/dist/components/modal-footer/ModalFooter.cjs.map +1 -0
  130. package/dist/components/modal-footer/ModalFooter.d.ts +29 -0
  131. package/dist/components/modal-footer/ModalFooter.d.ts.map +1 -0
  132. package/dist/components/modal-footer/ModalFooter.js +31 -0
  133. package/dist/components/modal-footer/ModalFooter.js.map +1 -0
  134. package/dist/components/modal-footer/ModalFooter.module.css +1 -0
  135. package/dist/components/modal-footer/ModalFooter.module.scss.cjs +2 -0
  136. package/dist/components/modal-footer/ModalFooter.module.scss.cjs.map +1 -0
  137. package/dist/components/modal-footer/ModalFooter.module.scss.js +17 -0
  138. package/dist/components/modal-footer/ModalFooter.module.scss.js.map +1 -0
  139. package/dist/components/modal-footer/index.cjs +2 -0
  140. package/dist/components/modal-footer/index.cjs.map +1 -0
  141. package/dist/components/modal-footer/index.d.ts +3 -0
  142. package/dist/components/modal-footer/index.d.ts.map +1 -0
  143. package/dist/components/modal-footer/index.js +5 -0
  144. package/dist/components/modal-footer/index.js.map +1 -0
  145. package/dist/components/modal-header/ModalHeader.cjs +2 -0
  146. package/dist/components/modal-header/ModalHeader.cjs.map +1 -0
  147. package/dist/components/modal-header/ModalHeader.d.ts +38 -0
  148. package/dist/components/modal-header/ModalHeader.d.ts.map +1 -0
  149. package/dist/components/modal-header/ModalHeader.js +74 -0
  150. package/dist/components/modal-header/ModalHeader.js.map +1 -0
  151. package/dist/components/modal-header/ModalHeader.module.css +1 -0
  152. package/dist/components/modal-header/ModalHeader.module.scss.cjs +2 -0
  153. package/dist/components/modal-header/ModalHeader.module.scss.cjs.map +1 -0
  154. package/dist/components/modal-header/ModalHeader.module.scss.js +19 -0
  155. package/dist/components/modal-header/ModalHeader.module.scss.js.map +1 -0
  156. package/dist/components/modal-header/index.cjs +2 -0
  157. package/dist/components/modal-header/index.cjs.map +1 -0
  158. package/dist/components/modal-header/index.d.ts +3 -0
  159. package/dist/components/modal-header/index.d.ts.map +1 -0
  160. package/dist/components/modal-header/index.js +5 -0
  161. package/dist/components/modal-header/index.js.map +1 -0
  162. package/dist/components/popover-notice/PopoverNotice.cjs.map +1 -1
  163. package/dist/components/popover-notice/PopoverNotice.d.ts +1 -1
  164. package/dist/components/popover-notice/PopoverNotice.d.ts.map +1 -1
  165. package/dist/components/popover-notice/PopoverNotice.js.map +1 -1
  166. package/dist/components/reaction-button/ReactionButton.cjs +2 -0
  167. package/dist/components/reaction-button/ReactionButton.cjs.map +1 -0
  168. package/dist/components/reaction-button/ReactionButton.d.ts +17 -0
  169. package/dist/components/reaction-button/ReactionButton.d.ts.map +1 -0
  170. package/dist/components/reaction-button/ReactionButton.js +42 -0
  171. package/dist/components/reaction-button/ReactionButton.js.map +1 -0
  172. package/dist/components/reaction-button/ReactionButton.module.css +1 -0
  173. package/dist/components/reaction-button/ReactionButton.module.scss.cjs +2 -0
  174. package/dist/components/reaction-button/ReactionButton.module.scss.cjs.map +1 -0
  175. package/dist/components/reaction-button/ReactionButton.module.scss.js +12 -0
  176. package/dist/components/reaction-button/ReactionButton.module.scss.js.map +1 -0
  177. package/dist/components/reaction-button/index.cjs +2 -0
  178. package/dist/components/reaction-button/index.cjs.map +1 -0
  179. package/dist/components/reaction-button/index.d.ts +3 -0
  180. package/dist/components/reaction-button/index.d.ts.map +1 -0
  181. package/dist/components/reaction-button/index.js +5 -0
  182. package/dist/components/reaction-button/index.js.map +1 -0
  183. package/dist/components/reactions-row/ReactionsRow.cjs +2 -0
  184. package/dist/components/reactions-row/ReactionsRow.cjs.map +1 -0
  185. package/dist/components/{message-reactions/MessageReactions.d.ts → reactions-row/ReactionsRow.d.ts} +5 -5
  186. package/dist/components/reactions-row/ReactionsRow.d.ts.map +1 -0
  187. package/dist/components/reactions-row/ReactionsRow.js +71 -0
  188. package/dist/components/reactions-row/ReactionsRow.js.map +1 -0
  189. package/dist/components/reactions-row/ReactionsRow.module.css +1 -0
  190. package/dist/components/reactions-row/ReactionsRow.module.scss.cjs +2 -0
  191. package/dist/components/reactions-row/ReactionsRow.module.scss.cjs.map +1 -0
  192. package/dist/components/reactions-row/ReactionsRow.module.scss.js +14 -0
  193. package/dist/components/reactions-row/ReactionsRow.module.scss.js.map +1 -0
  194. package/dist/components/reactions-row/index.cjs +2 -0
  195. package/dist/components/reactions-row/index.cjs.map +1 -0
  196. package/dist/components/reactions-row/index.d.ts +3 -0
  197. package/dist/components/reactions-row/index.d.ts.map +1 -0
  198. package/dist/components/reactions-row/index.js +5 -0
  199. package/dist/components/reactions-row/index.js.map +1 -0
  200. package/dist/components/right-sidebar-header/RightSidebarHeader.cjs.map +1 -1
  201. package/dist/components/right-sidebar-header/RightSidebarHeader.d.ts +1 -1
  202. package/dist/components/right-sidebar-header/RightSidebarHeader.d.ts.map +1 -1
  203. package/dist/components/right-sidebar-header/RightSidebarHeader.js.map +1 -1
  204. package/dist/components/section-notice/SectionNotice.cjs.map +1 -1
  205. package/dist/components/section-notice/SectionNotice.d.ts +1 -1
  206. package/dist/components/section-notice/SectionNotice.d.ts.map +1 -1
  207. package/dist/components/section-notice/SectionNotice.js.map +1 -1
  208. package/dist/components/tag/Tag.cjs.map +1 -1
  209. package/dist/components/tag/Tag.d.ts +1 -1
  210. package/dist/components/tag/Tag.d.ts.map +1 -1
  211. package/dist/components/tag/Tag.js.map +1 -1
  212. package/dist/components/text-input/TextInput.cjs.map +1 -1
  213. package/dist/components/text-input/TextInput.d.ts +1 -1
  214. package/dist/components/text-input/TextInput.d.ts.map +1 -1
  215. package/dist/components/text-input/TextInput.js.map +1 -1
  216. package/dist/components/thread-footer/ThreadFooter.module.css +1 -1
  217. package/dist/components/thread-footer/ThreadFooter.module.scss.cjs +1 -1
  218. package/dist/components/thread-footer/ThreadFooter.module.scss.js +19 -19
  219. package/dist/components/tooltip/Tooltip.cjs.map +1 -1
  220. package/dist/components/tooltip/Tooltip.d.ts +1 -1
  221. package/dist/components/tooltip/Tooltip.d.ts.map +1 -1
  222. package/dist/components/tooltip/Tooltip.js.map +1 -1
  223. package/dist/components/tour-point/TourPoint.module.css +1 -1
  224. package/dist/components/tour-point/TourPoint.module.scss.cjs +1 -1
  225. package/dist/components/tour-point/TourPoint.module.scss.js +28 -28
  226. package/dist/index.cjs +1 -1
  227. package/dist/index.css +23 -7
  228. package/dist/index.d.ts +8 -1
  229. package/dist/index.d.ts.map +1 -1
  230. package/dist/index.js +192 -175
  231. package/dist/index.js.map +1 -1
  232. package/package.json +25 -4
  233. package/dist/components/message-reactions/MessageReactions.cjs +0 -2
  234. package/dist/components/message-reactions/MessageReactions.cjs.map +0 -1
  235. package/dist/components/message-reactions/MessageReactions.d.ts.map +0 -1
  236. package/dist/components/message-reactions/MessageReactions.js +0 -85
  237. package/dist/components/message-reactions/MessageReactions.js.map +0 -1
  238. package/dist/components/message-reactions/MessageReactions.module.css +0 -1
  239. package/dist/components/message-reactions/MessageReactions.module.scss.cjs +0 -2
  240. package/dist/components/message-reactions/MessageReactions.module.scss.cjs.map +0 -1
  241. package/dist/components/message-reactions/MessageReactions.module.scss.js +0 -18
  242. package/dist/components/message-reactions/MessageReactions.module.scss.js.map +0 -1
  243. package/dist/components/message-reactions/index.d.ts +0 -3
  244. package/dist/components/message-reactions/index.d.ts.map +0 -1
  245. package/dist/components/message-reactions/index.js +0 -5
  246. /package/dist/components/{message-reactions → card-button}/index.cjs.map +0 -0
  247. /package/dist/components/{message-reactions → emoji-button}/index.js.map +0 -0
package/dist/index.js CHANGED
@@ -1,190 +1,207 @@
1
- import { default as a } from "./components/action-button/ActionButton.js";
1
+ import { default as r } from "./components/action-button/ActionButton.js";
2
2
  import { default as t } from "./components/admin-console-header/AdminConsoleHeader.js";
3
- import { default as s } from "./components/admin-console-sidebar/AdminConsoleSidebar.js";
4
- import { default as d } from "./components/admin-panel/AdminPanel.js";
3
+ import { default as d } from "./components/admin-console-sidebar/AdminConsoleSidebar.js";
4
+ import { default as u } from "./components/admin-panel/AdminPanel.js";
5
5
  import { default as p } from "./components/admin-panel-footer/AdminPanelFooter.js";
6
6
  import { default as n } from "./components/admin-panel-header/AdminPanelHeader.js";
7
7
  import { default as i } from "./components/attachment-card/AttachmentCard.js";
8
8
  import { default as M } from "./components/button/Button.js";
9
9
  import { default as T } from "./components/button/Button.module.scss.js";
10
- import { default as c } from "./components/channel-header-menu/ChannelHeaderMenu.js";
11
- import { default as g } from "./components/channel-info-msg-header/ChannelInfoMsgHeader.js";
12
- import { default as b } from "./components/channel-menu/ChannelMenu.js";
13
- import { default as A } from "./components/channel-category-menu/ChannelCategoryMenu.js";
14
- import { default as O } from "./components/channel-sidebar-item/ChannelSidebarItem.js";
15
- import { default as N, ChannelsSidebarCategory as _, ChannelsSidebarHeader as D, ChannelsSidebarNavigator as E } from "./components/channels-sidebar/ChannelsSidebar.js";
16
- import { applyChannelNameOverrides as G } from "./components/channels-sidebar/channelsSidebarModel.js";
17
- import { default as w } from "./components/channels-sidebar/ChannelsSidebar.module.scss.js";
18
- import { default as k } from "./components/checkbox/Checkbox.js";
19
- import { default as L } from "./components/chip/Chip.js";
20
- import { default as Z } from "./components/chip/ChipGroup.js";
21
- import { default as K } from "./components/combobox/Combobox.js";
22
- import { default as q } from "./components/date-range-picker/DateRangePicker.js";
23
- import { default as J } from "./components/divider/Divider.js";
24
- import { default as X } from "./components/dropdown/Dropdown.js";
25
- import { default as $ } from "./components/emoji/Emoji.js";
26
- import { default as re } from "./components/empty-state/EmptyState.js";
27
- import { default as oe } from "./components/error-message/ErrorMessage.js";
28
- import { default as fe } from "./components/feature-discovery-panel/FeatureDiscoveryPanel.js";
29
- import { default as le } from "./components/global-banner/GlobalBanner.js";
30
- import { default as ue } from "./components/global-header/GlobalHeader.js";
31
- import { default as me } from "./components/help-menu/HelpMenu.js";
32
- import { default as xe, SVG_SIZE_MAP as ie } from "./components/icon/Icon.js";
33
- import { ICON_BUTTON_ICON_SIZES as Me, default as Pe } from "./components/icon-button/IconButton.js";
34
- import { default as Ce } from "./components/illustration/Illustration.js";
35
- import { default as he } from "./components/image-preview/ImagePreview.js";
36
- import { default as ve } from "./components/tag/Tag.js";
37
- import { default as Ie } from "./components/link-preview/LinkPreview.js";
38
- import { default as Be } from "./components/mention-badge/MentionBadge.js";
39
- import { default as He } from "./components/menu-item/MenuItem.js";
40
- import { default as _e } from "./components/message-actions/MessageActions.js";
41
- import { default as Ee } from "./components/message-header/MessageHeader.js";
42
- import { default as Ge } from "./components/message-more-options-menu/MessageMoreOptionsMenu.js";
43
- import { default as we } from "./components/message-reactions/MessageReactions.js";
44
- import { default as ke } from "./components/message-separator/MessageSeparator.js";
45
- import { default as Le } from "./components/modal/Modal.js";
46
- import { default as Ze } from "./components/more-unreads-banner/MoreUnreadsBanner.js";
47
- import { default as Ke } from "./components/new-message-banner/NewMessageBanner.js";
48
- import { default as qe } from "./components/pagination-dots/PaginationDots.js";
49
- import { default as Je } from "./components/permalink-preview/PermalinkPreview.js";
50
- import { default as Xe } from "./components/pinned-saved-indicators/PinnedSavedIndicators.js";
51
- import { default as $e } from "./components/plus-menu/PlusMenu.js";
52
- import { default as rr, PopoverMenuDivider as ar, PopoverMenuGroup as or, PopoverMenuGroupTitle as tr, PopoverMenuScroll as fr, PopoverMenuTitle as sr } from "./components/popover-menu/PopoverMenu.js";
53
- import { default as dr } from "./components/popover-notice/PopoverNotice.js";
54
- import { DEFAULT_PRODUCT_SWITCHER_PRODUCTS as pr, default as mr } from "./components/product-switcher-menu/ProductSwitcherMenu.js";
55
- import { default as xr } from "./components/profile-popover/ProfilePopover.js";
56
- import { default as Sr } from "./components/progress-bar/ProgressBar.js";
57
- import { default as Pr } from "./components/radio/Radio.js";
58
- import { default as Cr } from "./components/right-sidebar-header/RightSidebarHeader.js";
59
- import { default as hr } from "./components/scrollbar/Scrollbar.js";
60
- import { default as vr } from "./components/search-input/SearchInput.js";
61
- import { default as Ir } from "./components/search-tip-banner/SearchTipBanner.js";
62
- import { default as Br, ShortcutTagGroup as Or } from "./components/shortcut-tag/ShortcutTag.js";
63
- import { default as Nr } from "./components/section-notice/SectionNotice.js";
64
- import { default as Dr } from "./components/select/Select.js";
65
- import { default as Rr } from "./components/spinner/Spinner.js";
66
- import { default as Ur } from "./components/status-badge/StatusBadge.js";
67
- import { default as yr } from "./components/switch/Switch.js";
68
- import { default as Fr } from "./components/tabs/Tabs.js";
69
- import { default as Vr } from "./components/team-avatar/TeamAvatar.js";
70
- import { default as jr } from "./components/team-menu/TeamMenu.js";
71
- import { default as Wr } from "./components/team-sidebar/TeamSidebar.js";
72
- import { default as zr } from "./components/text-area/TextArea.js";
73
- import { default as Qr } from "./components/text-input/TextInput.js";
74
- import { default as Yr } from "./components/thread-actions-menu/ThreadActionsMenu.js";
75
- import { default as ea } from "./components/thread-footer/ThreadFooter.js";
76
- import { default as aa } from "./components/thread-list-item/ThreadListItem.js";
77
- import { default as ta } from "./components/toast/Toast.js";
78
- import { default as sa } from "./components/tooltip/Tooltip.js";
79
- import { default as da } from "./components/tour-point/TourPoint.js";
80
- import { default as pa } from "./components/unread-badge/UnreadBadge.js";
81
- import { default as na } from "./components/user-avatar/UserAvatar.js";
82
- import { default as ia } from "./components/user-avatar-group/UserAvatarGroup.js";
83
- import { useControllable as Ma } from "./hooks/use-controllable.js";
84
- import { useExitAnimation as Ta } from "./hooks/use-exit-animation.js";
85
- import { useOutsideClose as ca } from "./hooks/use-outside-close.js";
86
- import { POPOVER_TRANSITION_MS as ga, usePopoverTransition as va } from "./hooks/use-popover-transition.js";
87
- import { toKebab as Ia } from "./utils/string.js";
10
+ import { default as c } from "./components/card-button/CardButton.js";
11
+ import { default as g } from "./components/card-button/CardButtonGroup.js";
12
+ import { default as I } from "./components/channel-header-menu/ChannelHeaderMenu.js";
13
+ import { default as A } from "./components/channel-info-msg-header/ChannelInfoMsgHeader.js";
14
+ import { default as E } from "./components/channel-menu/ChannelMenu.js";
15
+ import { default as _ } from "./components/channel-category-menu/ChannelCategoryMenu.js";
16
+ import { default as N } from "./components/channel-sidebar-item/ChannelSidebarItem.js";
17
+ import { default as G, ChannelsSidebarCategory as D, ChannelsSidebarHeader as U, ChannelsSidebarNavigator as w } from "./components/channels-sidebar/ChannelsSidebar.js";
18
+ import { applyChannelNameOverrides as F } from "./components/channels-sidebar/channelsSidebarModel.js";
19
+ import { default as j } from "./components/channels-sidebar/ChannelsSidebar.module.scss.js";
20
+ import { default as Z } from "./components/checkbox/Checkbox.js";
21
+ import { default as V } from "./components/chip/Chip.js";
22
+ import { default as W } from "./components/chip/ChipGroup.js";
23
+ import { default as z } from "./components/combobox/Combobox.js";
24
+ import { default as X } from "./components/date-range-picker/DateRangePicker.js";
25
+ import { default as $ } from "./components/divider/Divider.js";
26
+ import { default as oe } from "./components/dropdown/Dropdown.js";
27
+ import { default as ae } from "./components/emoji/Emoji.js";
28
+ import { EMOJI_BUTTON_EMOJI_SIZES as fe, default as de } from "./components/emoji-button/EmojiButton.js";
29
+ import { default as ue } from "./components/emoji-popover/EmojiPopover.js";
30
+ import { default as pe } from "./components/empty-state/EmptyState.js";
31
+ import { default as ne } from "./components/error-message/ErrorMessage.js";
32
+ import { default as ie } from "./components/feature-discovery-panel/FeatureDiscoveryPanel.js";
33
+ import { default as Me } from "./components/global-banner/GlobalBanner.js";
34
+ import { default as Te } from "./components/global-header/GlobalHeader.js";
35
+ import { default as ce } from "./components/help-menu/HelpMenu.js";
36
+ import { default as ge, SVG_SIZE_MAP as ve } from "./components/icon/Icon.js";
37
+ import { ICON_BUTTON_ICON_SIZES as be, default as Ae } from "./components/icon-button/IconButton.js";
38
+ import { default as Ee } from "./components/illustration/Illustration.js";
39
+ import { default as _e } from "./components/image-preview/ImagePreview.js";
40
+ import { default as Ne } from "./components/tag/Tag.js";
41
+ import { default as Ge } from "./components/link-preview/LinkPreview.js";
42
+ import { default as Ue } from "./components/mention-badge/MentionBadge.js";
43
+ import { default as ye } from "./components/menu-group-heading/MenuGroupHeading.js";
44
+ import { default as ke } from "./components/menu-item/MenuItem.js";
45
+ import { default as Le } from "./components/message-actions/MessageActions.js";
46
+ import { default as Je } from "./components/message-header/MessageHeader.js";
47
+ import { default as Ke } from "./components/message-more-options-menu/MessageMoreOptionsMenu.js";
48
+ import { default as qe } from "./components/reactions-row/ReactionsRow.js";
49
+ import { default as Qe } from "./components/reaction-button/ReactionButton.js";
50
+ import { default as Ye } from "./components/message-separator/MessageSeparator.js";
51
+ import { default as eo } from "./components/modal/Modal.js";
52
+ import { default as ro } from "./components/modal-footer/ModalFooter.js";
53
+ import { default as to } from "./components/modal-header/ModalHeader.js";
54
+ import { default as so } from "./components/more-unreads-banner/MoreUnreadsBanner.js";
55
+ import { default as lo } from "./components/new-message-banner/NewMessageBanner.js";
56
+ import { default as mo } from "./components/pagination-dots/PaginationDots.js";
57
+ import { default as xo } from "./components/permalink-preview/PermalinkPreview.js";
58
+ import { default as So } from "./components/pinned-saved-indicators/PinnedSavedIndicators.js";
59
+ import { default as Po } from "./components/plus-menu/PlusMenu.js";
60
+ import { default as Co, PopoverMenuDivider as co, PopoverMenuGroup as ho, PopoverMenuGroupTitle as go, PopoverMenuScroll as vo, PopoverMenuTitle as Io } from "./components/popover-menu/PopoverMenu.js";
61
+ import { default as Ao } from "./components/popover-notice/PopoverNotice.js";
62
+ import { DEFAULT_PRODUCT_SWITCHER_PRODUCTS as Eo, default as Oo } from "./components/product-switcher-menu/ProductSwitcherMenu.js";
63
+ import { default as Ho } from "./components/profile-popover/ProfilePopover.js";
64
+ import { default as Ro } from "./components/progress-bar/ProgressBar.js";
65
+ import { default as Do } from "./components/radio/Radio.js";
66
+ import { default as wo } from "./components/right-sidebar-header/RightSidebarHeader.js";
67
+ import { default as Fo } from "./components/scrollbar/Scrollbar.js";
68
+ import { default as jo } from "./components/search-input/SearchInput.js";
69
+ import { default as Zo } from "./components/search-tip-banner/SearchTipBanner.js";
70
+ import { default as Vo, ShortcutTagGroup as Ko } from "./components/shortcut-tag/ShortcutTag.js";
71
+ import { default as qo } from "./components/section-notice/SectionNotice.js";
72
+ import { default as Qo } from "./components/select/Select.js";
73
+ import { default as Yo } from "./components/spinner/Spinner.js";
74
+ import { default as er } from "./components/status-badge/StatusBadge.js";
75
+ import { default as rr } from "./components/switch/Switch.js";
76
+ import { default as tr } from "./components/tabs/Tabs.js";
77
+ import { default as dr } from "./components/team-avatar/TeamAvatar.js";
78
+ import { default as ur } from "./components/team-menu/TeamMenu.js";
79
+ import { default as pr } from "./components/team-sidebar/TeamSidebar.js";
80
+ import { default as nr } from "./components/text-area/TextArea.js";
81
+ import { default as ir } from "./components/text-input/TextInput.js";
82
+ import { default as Mr } from "./components/thread-actions-menu/ThreadActionsMenu.js";
83
+ import { default as Tr } from "./components/thread-footer/ThreadFooter.js";
84
+ import { default as cr } from "./components/thread-list-item/ThreadListItem.js";
85
+ import { default as gr } from "./components/toast/Toast.js";
86
+ import { default as Ir } from "./components/tooltip/Tooltip.js";
87
+ import { default as Ar } from "./components/tour-point/TourPoint.js";
88
+ import { default as Er } from "./components/unread-badge/UnreadBadge.js";
89
+ import { default as _r } from "./components/user-avatar/UserAvatar.js";
90
+ import { default as Nr } from "./components/user-avatar-group/UserAvatarGroup.js";
91
+ import { useControllable as Gr } from "./hooks/use-controllable.js";
92
+ import { useExitAnimation as Ur } from "./hooks/use-exit-animation.js";
93
+ import { useOutsideClose as yr } from "./hooks/use-outside-close.js";
94
+ import { POPOVER_TRANSITION_MS as kr, usePopoverTransition as jr } from "./hooks/use-popover-transition.js";
95
+ import { toKebab as Zr } from "./utils/string.js";
88
96
  export {
89
- a as ActionButton,
97
+ r as ActionButton,
90
98
  t as AdminConsoleHeader,
91
- s as AdminConsoleSidebar,
92
- d as AdminPanel,
99
+ d as AdminConsoleSidebar,
100
+ u as AdminPanel,
93
101
  p as AdminPanelFooter,
94
102
  n as AdminPanelHeader,
95
103
  i as AttachmentCard,
96
104
  M as Button,
97
- A as ChannelCategoryMenu,
98
- c as ChannelHeaderMenu,
99
- g as ChannelInfoMsgHeader,
100
- b as ChannelMenu,
101
- O as ChannelSidebarItem,
102
- N as ChannelsSidebar,
103
- _ as ChannelsSidebarCategory,
104
- D as ChannelsSidebarHeader,
105
- E as ChannelsSidebarNavigator,
106
- k as Checkbox,
107
- L as Chip,
108
- Z as ChipGroup,
109
- K as Combobox,
110
- pr as DEFAULT_PRODUCT_SWITCHER_PRODUCTS,
111
- q as DateRangePicker,
112
- J as Divider,
113
- X as Dropdown,
114
- $ as Emoji,
115
- re as EmptyState,
116
- oe as ErrorMessage,
117
- fe as FeatureDiscoveryPanel,
118
- le as GlobalBanner,
119
- ue as GlobalHeader,
120
- me as HelpMenu,
121
- Me as ICON_BUTTON_ICON_SIZES,
122
- xe as Icon,
123
- Pe as IconButton,
124
- Ce as Illustration,
125
- he as ImagePreview,
126
- Ie as LinkPreview,
127
- Be as MentionBadge,
128
- He as MenuItem,
129
- _e as MessageActions,
130
- Ee as MessageHeader,
131
- Ge as MessageMoreOptionsMenu,
132
- we as MessageReactions,
133
- ke as MessageSeparator,
134
- Le as Modal,
135
- Ze as MoreUnreadsBanner,
136
- Ke as NewMessageBanner,
137
- ga as POPOVER_TRANSITION_MS,
138
- qe as PaginationDots,
139
- Je as PermalinkPreview,
140
- Xe as PinnedSavedIndicators,
141
- $e as PlusMenu,
142
- rr as PopoverMenu,
143
- ar as PopoverMenuDivider,
144
- or as PopoverMenuGroup,
145
- tr as PopoverMenuGroupTitle,
146
- fr as PopoverMenuScroll,
147
- sr as PopoverMenuTitle,
148
- dr as PopoverNotice,
149
- mr as ProductSwitcherMenu,
150
- xr as ProfilePopover,
151
- Sr as ProgressBar,
152
- Pr as Radio,
153
- Cr as RightSidebarHeader,
154
- ie as SVG_SIZE_MAP,
155
- hr as Scrollbar,
156
- vr as SearchInput,
157
- Ir as SearchTipBanner,
158
- Nr as SectionNotice,
159
- Dr as Select,
160
- Br as ShortcutTag,
161
- Or as ShortcutTagGroup,
162
- Rr as Spinner,
163
- Ur as StatusBadge,
164
- yr as Switch,
165
- Fr as Tabs,
166
- ve as Tag,
167
- Vr as TeamAvatar,
168
- jr as TeamMenu,
169
- Wr as TeamSidebar,
170
- zr as TextArea,
171
- Qr as TextInput,
172
- Yr as ThreadActionsMenu,
173
- ea as ThreadFooter,
174
- aa as ThreadListItem,
175
- ta as Toast,
176
- sa as Tooltip,
177
- da as TourPoint,
178
- pa as UnreadBadge,
179
- na as UserAvatar,
180
- ia as UserAvatarGroup,
181
- G as applyChannelNameOverrides,
105
+ c as CardButton,
106
+ g as CardButtonGroup,
107
+ _ as ChannelCategoryMenu,
108
+ I as ChannelHeaderMenu,
109
+ A as ChannelInfoMsgHeader,
110
+ E as ChannelMenu,
111
+ N as ChannelSidebarItem,
112
+ G as ChannelsSidebar,
113
+ D as ChannelsSidebarCategory,
114
+ U as ChannelsSidebarHeader,
115
+ w as ChannelsSidebarNavigator,
116
+ Z as Checkbox,
117
+ V as Chip,
118
+ W as ChipGroup,
119
+ z as Combobox,
120
+ Eo as DEFAULT_PRODUCT_SWITCHER_PRODUCTS,
121
+ X as DateRangePicker,
122
+ $ as Divider,
123
+ oe as Dropdown,
124
+ fe as EMOJI_BUTTON_EMOJI_SIZES,
125
+ ae as Emoji,
126
+ de as EmojiButton,
127
+ ue as EmojiPopover,
128
+ pe as EmptyState,
129
+ ne as ErrorMessage,
130
+ ie as FeatureDiscoveryPanel,
131
+ Me as GlobalBanner,
132
+ Te as GlobalHeader,
133
+ ce as HelpMenu,
134
+ be as ICON_BUTTON_ICON_SIZES,
135
+ ge as Icon,
136
+ Ae as IconButton,
137
+ Ee as Illustration,
138
+ _e as ImagePreview,
139
+ Ge as LinkPreview,
140
+ Ue as MentionBadge,
141
+ ye as MenuGroupHeading,
142
+ ke as MenuItem,
143
+ Le as MessageActions,
144
+ Je as MessageHeader,
145
+ Ke as MessageMoreOptionsMenu,
146
+ Ye as MessageSeparator,
147
+ eo as Modal,
148
+ ro as ModalFooter,
149
+ to as ModalHeader,
150
+ so as MoreUnreadsBanner,
151
+ lo as NewMessageBanner,
152
+ kr as POPOVER_TRANSITION_MS,
153
+ mo as PaginationDots,
154
+ xo as PermalinkPreview,
155
+ So as PinnedSavedIndicators,
156
+ Po as PlusMenu,
157
+ Co as PopoverMenu,
158
+ co as PopoverMenuDivider,
159
+ ho as PopoverMenuGroup,
160
+ go as PopoverMenuGroupTitle,
161
+ vo as PopoverMenuScroll,
162
+ Io as PopoverMenuTitle,
163
+ Ao as PopoverNotice,
164
+ Oo as ProductSwitcherMenu,
165
+ Ho as ProfilePopover,
166
+ Ro as ProgressBar,
167
+ Do as Radio,
168
+ Qe as ReactionButton,
169
+ qe as ReactionsRow,
170
+ wo as RightSidebarHeader,
171
+ ve as SVG_SIZE_MAP,
172
+ Fo as Scrollbar,
173
+ jo as SearchInput,
174
+ Zo as SearchTipBanner,
175
+ qo as SectionNotice,
176
+ Qo as Select,
177
+ Vo as ShortcutTag,
178
+ Ko as ShortcutTagGroup,
179
+ Yo as Spinner,
180
+ er as StatusBadge,
181
+ rr as Switch,
182
+ tr as Tabs,
183
+ Ne as Tag,
184
+ dr as TeamAvatar,
185
+ ur as TeamMenu,
186
+ pr as TeamSidebar,
187
+ nr as TextArea,
188
+ ir as TextInput,
189
+ Mr as ThreadActionsMenu,
190
+ Tr as ThreadFooter,
191
+ cr as ThreadListItem,
192
+ gr as Toast,
193
+ Ir as Tooltip,
194
+ Ar as TourPoint,
195
+ Er as UnreadBadge,
196
+ _r as UserAvatar,
197
+ Nr as UserAvatarGroup,
198
+ F as applyChannelNameOverrides,
182
199
  T as btnStyles,
183
- w as channelsSidebarStyles,
184
- Ia as toKebab,
185
- Ma as useControllable,
186
- Ta as useExitAnimation,
187
- ca as useOutsideClose,
188
- va as usePopoverTransition
200
+ j as channelsSidebarStyles,
201
+ Zr as toKebab,
202
+ Gr as useControllable,
203
+ Ur as useExitAnimation,
204
+ yr as useOutsideClose,
205
+ jr as usePopoverTransition
189
206
  };
190
207
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mattermost/compass-ui",
3
- "version": "0.1.0-alpha.6",
3
+ "version": "0.1.0-alpha.7",
4
4
  "description": "Compass design system UI components for Mattermost products",
5
5
  "repository": {
6
6
  "type": "git",
@@ -139,6 +139,9 @@
139
139
  "components/button": [
140
140
  "./dist/components/button/index.d.ts"
141
141
  ],
142
+ "components/card-button": [
143
+ "./dist/components/card-button/index.d.ts"
144
+ ],
142
145
  "components/channel-category-menu": [
143
146
  "./dist/components/channel-category-menu/index.d.ts"
144
147
  ],
@@ -178,6 +181,12 @@
178
181
  "components/emoji": [
179
182
  "./dist/components/emoji/index.d.ts"
180
183
  ],
184
+ "components/emoji-button": [
185
+ "./dist/components/emoji-button/index.d.ts"
186
+ ],
187
+ "components/emoji-popover": [
188
+ "./dist/components/emoji-popover/index.d.ts"
189
+ ],
181
190
  "components/empty-state": [
182
191
  "./dist/components/empty-state/index.d.ts"
183
192
  ],
@@ -214,6 +223,9 @@
214
223
  "components/mention-badge": [
215
224
  "./dist/components/mention-badge/index.d.ts"
216
225
  ],
226
+ "components/menu-group-heading": [
227
+ "./dist/components/menu-group-heading/index.d.ts"
228
+ ],
217
229
  "components/menu-item": [
218
230
  "./dist/components/menu-item/index.d.ts"
219
231
  ],
@@ -226,15 +238,18 @@
226
238
  "components/message-more-options-menu": [
227
239
  "./dist/components/message-more-options-menu/index.d.ts"
228
240
  ],
229
- "components/message-reactions": [
230
- "./dist/components/message-reactions/index.d.ts"
231
- ],
232
241
  "components/message-separator": [
233
242
  "./dist/components/message-separator/index.d.ts"
234
243
  ],
235
244
  "components/modal": [
236
245
  "./dist/components/modal/index.d.ts"
237
246
  ],
247
+ "components/modal-footer": [
248
+ "./dist/components/modal-footer/index.d.ts"
249
+ ],
250
+ "components/modal-header": [
251
+ "./dist/components/modal-header/index.d.ts"
252
+ ],
238
253
  "components/more-unreads-banner": [
239
254
  "./dist/components/more-unreads-banner/index.d.ts"
240
255
  ],
@@ -271,6 +286,12 @@
271
286
  "components/radio": [
272
287
  "./dist/components/radio/index.d.ts"
273
288
  ],
289
+ "components/reaction-button": [
290
+ "./dist/components/reaction-button/index.d.ts"
291
+ ],
292
+ "components/reactions-row": [
293
+ "./dist/components/reactions-row/index.d.ts"
294
+ ],
274
295
  "components/right-sidebar-header": [
275
296
  "./dist/components/right-sidebar-header/index.d.ts"
276
297
  ],
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),p=require("../icon-button/IconButton.cjs"),c=require("../icon/Icon.cjs"),__x=require("@mattermost/compass-icons/components/check-circle-outline.js"),x=__x?.default??__x,__h=require("@mattermost/compass-icons/components/emoticon-plus-outline.js"),h=__h?.default??__h,s=require("./MessageReactions.module.scss.cjs"),N=[{emoji:"👍",count:1},{emoji:"😀",count:4},{emoji:"🙌",count:1}];function b({reactions:o=N,showAddReaction:r=!1,acknowledged:u=!1,acknowledgeCount:d=0,currentUserAcknowledged:l=!1,onAddReaction:m,onReactionClick:t,onAcknowledge:_,className:f="",...j}){const g=[s.default["message-reactions"],f].filter(Boolean).join(" ");return e.jsxs("div",{className:g,...j,children:[u&&e.jsxs("button",{type:"button",className:[s.default["message-reactions__ack"],l?s.default["message-reactions__ack--active"]:""].filter(Boolean).join(" "),onClick:_,"aria-pressed":l,"aria-label":"Acknowledge message",children:[e.jsx("span",{className:s.default["message-reactions__ack-icon"],"aria-hidden":!0,children:e.jsx(c.default,{size:"16",glyph:e.jsx(x,{})})}),l?e.jsx("span",{className:s.default["message-reactions__ack-count"],children:d}):e.jsx("span",{className:s.default["message-reactions__ack-label"],children:"Acknowledge"})]}),e.jsxs("div",{className:s.default["message-reactions__pills"],children:[o.map(({emoji:a,count:i,byCurrentUser:n})=>e.jsxs("button",{type:"button",className:[s.default["message-reactions__pill"],n?s.default["message-reactions__pill--mine"]:""].filter(Boolean).join(" "),onClick:()=>t==null?void 0:t(a),"aria-label":`${a} ${i} reaction${i!==1?"s":""}`,"aria-pressed":n,children:[e.jsx("span",{className:s.default["message-reactions__pill-emoji"],"aria-hidden":!0,children:a}),e.jsx("span",{className:s.default["message-reactions__pill-count"],children:i})]},a)),r&&e.jsx(p.default,{"aria-label":"Add reaction",className:s.default["message-reactions__add-reaction"],size:"x-small",onClick:m,icon:e.jsx(c.default,{size:"16",glyph:e.jsx(h,{})})})]})]})}exports.default=b;
2
- //# sourceMappingURL=MessageReactions.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"MessageReactions.cjs","sources":["../../../src/components/message-reactions/MessageReactions.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Icon from '@/components/icon/Icon';\nimport CheckCircleOutlineIcon from '@mattermost/compass-icons/components/check-circle-outline';\nimport EmoticonPlusOutlineIcon from '@mattermost/compass-icons/components/emoticon-plus-outline';\nimport styles from './MessageReactions.module.scss';\n\nexport interface ReactionItem {\n emoji: string;\n count: number;\n /** Whether the current user reacted with this emoji. */\n byCurrentUser?: boolean;\n}\n\nexport interface MessageReactionsProps extends HTMLAttributes<HTMLDivElement> {\n /** List of reactions to display. */\n reactions?: ReactionItem[];\n /** Whether to show the add-reaction button. Default: false. */\n showAddReaction?: boolean;\n /** Whether to show the acknowledge button. */\n acknowledged?: boolean;\n /** Acknowledge count. */\n acknowledgeCount?: number;\n /** Whether the current user has acknowledged. Default: false. */\n currentUserAcknowledged?: boolean;\n /** Called when add-reaction is clicked. */\n onAddReaction?: () => void;\n /** Called when a reaction pill is clicked. */\n onReactionClick?: (emoji: string) => void;\n /** Called when the acknowledge button is clicked. */\n onAcknowledge?: () => void;\n /** Optional CSS class name. */\n className?: string;\n}\n\nconst DEFAULT_REACTIONS: ReactionItem[] = [\n { emoji: '👍', count: 1 },\n { emoji: '😀', count: 4 },\n { emoji: '🙌', count: 1 },\n];\n\n/**\n * Message Reactions are the row of emoji pills below a message — the lightest weight way to\n * respond, applaud, or acknowledge without adding to the thread. The component handles the\n * count, the \"this is mine\" highlight, and the add-reaction affordance.\n */\nexport default function MessageReactions({\n reactions = DEFAULT_REACTIONS,\n showAddReaction = false,\n acknowledged = false,\n acknowledgeCount = 0,\n currentUserAcknowledged = false,\n onAddReaction,\n onReactionClick,\n onAcknowledge,\n className = '',\n ...rest\n}: MessageReactionsProps) {\n const rootClass = [styles['message-reactions'], className]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass} {...rest}>\n {/* Acknowledge button */}\n {acknowledged && (\n <button\n type=\"button\"\n className={[\n styles['message-reactions__ack'],\n currentUserAcknowledged\n ? styles['message-reactions__ack--active']\n : '',\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onAcknowledge}\n aria-pressed={currentUserAcknowledged}\n aria-label=\"Acknowledge message\"\n >\n <span className={styles['message-reactions__ack-icon']} aria-hidden>\n <Icon size=\"16\" glyph={<CheckCircleOutlineIcon />} />\n </span>\n {currentUserAcknowledged ? (\n <span className={styles['message-reactions__ack-count']}>\n {acknowledgeCount}\n </span>\n ) : (\n <span className={styles['message-reactions__ack-label']}>\n Acknowledge\n </span>\n )}\n </button>\n )}\n\n {/* Reaction pills */}\n <div className={styles['message-reactions__pills']}>\n {reactions.map(({ emoji, count, byCurrentUser }) => (\n <button\n key={emoji}\n type=\"button\"\n className={[\n styles['message-reactions__pill'],\n byCurrentUser ? styles['message-reactions__pill--mine'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={() => onReactionClick?.(emoji)}\n aria-label={`${emoji} ${count} reaction${count !== 1 ? 's' : ''}`}\n aria-pressed={byCurrentUser}\n >\n <span\n className={styles['message-reactions__pill-emoji']}\n aria-hidden\n >\n {emoji}\n </span>\n <span className={styles['message-reactions__pill-count']}>\n {count}\n </span>\n </button>\n ))}\n\n {/* Add reaction button */}\n {showAddReaction && (\n <IconButton\n aria-label=\"Add reaction\"\n className={styles['message-reactions__add-reaction']}\n size=\"x-small\"\n onClick={onAddReaction}\n icon={<Icon size=\"16\" glyph={<EmoticonPlusOutlineIcon />} />}\n />\n )}\n </div>\n </div>\n );\n}\n"],"names":["DEFAULT_REACTIONS","MessageReactions","reactions","showAddReaction","acknowledged","acknowledgeCount","currentUserAcknowledged","onAddReaction","onReactionClick","onAcknowledge","className","rest","rootClass","styles","jsxs","jsx","Icon","CheckCircleOutlineIcon","emoji","count","byCurrentUser","IconButton","EmoticonPlusOutlineIcon"],"mappings":"wZAmCMA,EAAoC,CACxC,CAAE,MAAO,KAAM,MAAO,CAAA,EACtB,CAAE,MAAO,KAAM,MAAO,CAAA,EACtB,CAAE,MAAO,KAAM,MAAO,CAAA,CACxB,EAOA,SAAwBC,EAAiB,CACvC,UAAAC,EAAYF,EACZ,gBAAAG,EAAkB,GAClB,aAAAC,EAAe,GACf,iBAAAC,EAAmB,EACnB,wBAAAC,EAA0B,GAC1B,cAAAC,EACA,gBAAAC,EACA,cAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CACL,EAA0B,CACxB,MAAMC,EAAY,CAACC,UAAO,mBAAmB,EAAGH,CAAS,EACtD,OAAO,OAAO,EACd,KAAK,GAAG,EAEX,OACEI,EAAAA,KAAC,MAAA,CAAI,UAAWF,EAAY,GAAGD,EAE5B,SAAA,CAAAP,GACCU,EAAAA,KAAC,SAAA,CACC,KAAK,SACL,UAAW,CACTD,EAAAA,QAAO,wBAAwB,EAC/BP,EACIO,EAAAA,QAAO,gCAAgC,EACvC,EAAA,EAEH,OAAO,OAAO,EACd,KAAK,GAAG,EACX,QAASJ,EACT,eAAcH,EACd,aAAW,sBAEX,SAAA,CAAAS,MAAC,OAAA,CAAK,UAAWF,EAAAA,QAAO,6BAA6B,EAAG,cAAW,GACjE,SAAAE,EAAAA,IAACC,EAAAA,QAAA,CAAK,KAAK,KAAK,MAAOD,EAAAA,IAACE,EAAA,CAAA,CAAuB,EAAI,EACrD,EACCX,EACCS,EAAAA,IAAC,OAAA,CAAK,UAAWF,UAAO,8BAA8B,EACnD,SAAAR,CAAA,CACH,QAEC,OAAA,CAAK,UAAWQ,EAAAA,QAAO,8BAA8B,EAAG,SAAA,aAAA,CAEzD,CAAA,CAAA,CAAA,EAMNC,EAAAA,KAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,0BAA0B,EAC9C,SAAA,CAAAX,EAAU,IAAI,CAAC,CAAE,MAAAgB,EAAO,MAAAC,EAAO,cAAAC,KAC9BN,EAAAA,KAAC,SAAA,CAEC,KAAK,SACL,UAAW,CACTD,EAAAA,QAAO,yBAAyB,EAChCO,EAAgBP,EAAAA,QAAO,+BAA+B,EAAI,EAAA,EAEzD,OAAO,OAAO,EACd,KAAK,GAAG,EACX,QAAS,IAAML,GAAA,YAAAA,EAAkBU,GACjC,aAAY,GAAGA,CAAK,IAAIC,CAAK,YAAYA,IAAU,EAAI,IAAM,EAAE,GAC/D,eAAcC,EAEd,SAAA,CAAAL,EAAAA,IAAC,OAAA,CACC,UAAWF,EAAAA,QAAO,+BAA+B,EACjD,cAAW,GAEV,SAAAK,CAAA,CAAA,QAEF,OAAA,CAAK,UAAWL,EAAAA,QAAO,+BAA+B,EACpD,SAAAM,CAAA,CACH,CAAA,CAAA,EApBKD,CAAA,CAsBR,EAGAf,GACCY,EAAAA,IAACM,EAAAA,QAAA,CACC,aAAW,eACX,UAAWR,EAAAA,QAAO,iCAAiC,EACnD,KAAK,UACL,QAASN,EACT,WAAOS,EAAAA,QAAA,CAAK,KAAK,KAAK,MAAOD,EAAAA,IAACO,IAAwB,CAAA,CAAI,CAAA,CAAA,CAC5D,CAAA,CAEJ,CAAA,EACF,CAEJ"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"MessageReactions.d.ts","sourceRoot":"","sources":["../../../src/components/message-reactions/MessageReactions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAO5C,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,wDAAwD;IACxD,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,qBAAsB,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC3E,oCAAoC;IACpC,SAAS,CAAC,EAAE,YAAY,EAAE,CAAC;IAC3B,+DAA+D;IAC/D,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,8CAA8C;IAC9C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,yBAAyB;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iEAAiE;IACjE,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,2CAA2C;IAC3C,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,8CAA8C;IAC9C,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,qDAAqD;IACrD,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAQD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,SAA6B,EAC7B,eAAuB,EACvB,YAAoB,EACpB,gBAAoB,EACpB,uBAA+B,EAC/B,aAAa,EACb,eAAe,EACf,aAAa,EACb,SAAc,EACd,GAAG,IAAI,EACR,EAAE,qBAAqB,2CA+EvB"}
@@ -1,85 +0,0 @@
1
- import { jsxs as i, jsx as a } from "react/jsx-runtime";
2
- import N from "../icon-button/IconButton.js";
3
- import t from "../icon/Icon.js";
4
- import __b from "@mattermost/compass-icons/components/check-circle-outline.js";const b=__b&&__b.default?__b.default:__b;
5
- import __j from "@mattermost/compass-icons/components/emoticon-plus-outline.js";const j=__j&&__j.default?__j.default:__j;
6
- import e from "./MessageReactions.module.scss.js";
7
- const k = [
8
- { emoji: "👍", count: 1 },
9
- { emoji: "😀", count: 4 },
10
- { emoji: "🙌", count: 1 }
11
- ];
12
- function A({
13
- reactions: r = k,
14
- showAddReaction: m = !1,
15
- acknowledged: p = !1,
16
- acknowledgeCount: _ = 0,
17
- currentUserAcknowledged: l = !1,
18
- onAddReaction: d,
19
- onReactionClick: o,
20
- onAcknowledge: g,
21
- className: f = "",
22
- ...h
23
- }) {
24
- const u = [e["message-reactions"], f].filter(Boolean).join(" ");
25
- return /* @__PURE__ */ i("div", { className: u, ...h, children: [
26
- p && /* @__PURE__ */ i(
27
- "button",
28
- {
29
- type: "button",
30
- className: [
31
- e["message-reactions__ack"],
32
- l ? e["message-reactions__ack--active"] : ""
33
- ].filter(Boolean).join(" "),
34
- onClick: g,
35
- "aria-pressed": l,
36
- "aria-label": "Acknowledge message",
37
- children: [
38
- /* @__PURE__ */ a("span", { className: e["message-reactions__ack-icon"], "aria-hidden": !0, children: /* @__PURE__ */ a(t, { size: "16", glyph: /* @__PURE__ */ a(b, {}) }) }),
39
- l ? /* @__PURE__ */ a("span", { className: e["message-reactions__ack-count"], children: _ }) : /* @__PURE__ */ a("span", { className: e["message-reactions__ack-label"], children: "Acknowledge" })
40
- ]
41
- }
42
- ),
43
- /* @__PURE__ */ i("div", { className: e["message-reactions__pills"], children: [
44
- r.map(({ emoji: s, count: n, byCurrentUser: c }) => /* @__PURE__ */ i(
45
- "button",
46
- {
47
- type: "button",
48
- className: [
49
- e["message-reactions__pill"],
50
- c ? e["message-reactions__pill--mine"] : ""
51
- ].filter(Boolean).join(" "),
52
- onClick: () => o == null ? void 0 : o(s),
53
- "aria-label": `${s} ${n} reaction${n !== 1 ? "s" : ""}`,
54
- "aria-pressed": c,
55
- children: [
56
- /* @__PURE__ */ a(
57
- "span",
58
- {
59
- className: e["message-reactions__pill-emoji"],
60
- "aria-hidden": !0,
61
- children: s
62
- }
63
- ),
64
- /* @__PURE__ */ a("span", { className: e["message-reactions__pill-count"], children: n })
65
- ]
66
- },
67
- s
68
- )),
69
- m && /* @__PURE__ */ a(
70
- N,
71
- {
72
- "aria-label": "Add reaction",
73
- className: e["message-reactions__add-reaction"],
74
- size: "x-small",
75
- onClick: d,
76
- icon: /* @__PURE__ */ a(t, { size: "16", glyph: /* @__PURE__ */ a(j, {}) })
77
- }
78
- )
79
- ] })
80
- ] });
81
- }
82
- export {
83
- A as default
84
- };
85
- //# sourceMappingURL=MessageReactions.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"MessageReactions.js","sources":["../../../src/components/message-reactions/MessageReactions.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport IconButton from '@/components/icon-button/IconButton';\nimport Icon from '@/components/icon/Icon';\nimport CheckCircleOutlineIcon from '@mattermost/compass-icons/components/check-circle-outline';\nimport EmoticonPlusOutlineIcon from '@mattermost/compass-icons/components/emoticon-plus-outline';\nimport styles from './MessageReactions.module.scss';\n\nexport interface ReactionItem {\n emoji: string;\n count: number;\n /** Whether the current user reacted with this emoji. */\n byCurrentUser?: boolean;\n}\n\nexport interface MessageReactionsProps extends HTMLAttributes<HTMLDivElement> {\n /** List of reactions to display. */\n reactions?: ReactionItem[];\n /** Whether to show the add-reaction button. Default: false. */\n showAddReaction?: boolean;\n /** Whether to show the acknowledge button. */\n acknowledged?: boolean;\n /** Acknowledge count. */\n acknowledgeCount?: number;\n /** Whether the current user has acknowledged. Default: false. */\n currentUserAcknowledged?: boolean;\n /** Called when add-reaction is clicked. */\n onAddReaction?: () => void;\n /** Called when a reaction pill is clicked. */\n onReactionClick?: (emoji: string) => void;\n /** Called when the acknowledge button is clicked. */\n onAcknowledge?: () => void;\n /** Optional CSS class name. */\n className?: string;\n}\n\nconst DEFAULT_REACTIONS: ReactionItem[] = [\n { emoji: '👍', count: 1 },\n { emoji: '😀', count: 4 },\n { emoji: '🙌', count: 1 },\n];\n\n/**\n * Message Reactions are the row of emoji pills below a message — the lightest weight way to\n * respond, applaud, or acknowledge without adding to the thread. The component handles the\n * count, the \"this is mine\" highlight, and the add-reaction affordance.\n */\nexport default function MessageReactions({\n reactions = DEFAULT_REACTIONS,\n showAddReaction = false,\n acknowledged = false,\n acknowledgeCount = 0,\n currentUserAcknowledged = false,\n onAddReaction,\n onReactionClick,\n onAcknowledge,\n className = '',\n ...rest\n}: MessageReactionsProps) {\n const rootClass = [styles['message-reactions'], className]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass} {...rest}>\n {/* Acknowledge button */}\n {acknowledged && (\n <button\n type=\"button\"\n className={[\n styles['message-reactions__ack'],\n currentUserAcknowledged\n ? styles['message-reactions__ack--active']\n : '',\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onAcknowledge}\n aria-pressed={currentUserAcknowledged}\n aria-label=\"Acknowledge message\"\n >\n <span className={styles['message-reactions__ack-icon']} aria-hidden>\n <Icon size=\"16\" glyph={<CheckCircleOutlineIcon />} />\n </span>\n {currentUserAcknowledged ? (\n <span className={styles['message-reactions__ack-count']}>\n {acknowledgeCount}\n </span>\n ) : (\n <span className={styles['message-reactions__ack-label']}>\n Acknowledge\n </span>\n )}\n </button>\n )}\n\n {/* Reaction pills */}\n <div className={styles['message-reactions__pills']}>\n {reactions.map(({ emoji, count, byCurrentUser }) => (\n <button\n key={emoji}\n type=\"button\"\n className={[\n styles['message-reactions__pill'],\n byCurrentUser ? styles['message-reactions__pill--mine'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={() => onReactionClick?.(emoji)}\n aria-label={`${emoji} ${count} reaction${count !== 1 ? 's' : ''}`}\n aria-pressed={byCurrentUser}\n >\n <span\n className={styles['message-reactions__pill-emoji']}\n aria-hidden\n >\n {emoji}\n </span>\n <span className={styles['message-reactions__pill-count']}>\n {count}\n </span>\n </button>\n ))}\n\n {/* Add reaction button */}\n {showAddReaction && (\n <IconButton\n aria-label=\"Add reaction\"\n className={styles['message-reactions__add-reaction']}\n size=\"x-small\"\n onClick={onAddReaction}\n icon={<Icon size=\"16\" glyph={<EmoticonPlusOutlineIcon />} />}\n />\n )}\n </div>\n </div>\n );\n}\n"],"names":["DEFAULT_REACTIONS","MessageReactions","reactions","showAddReaction","acknowledged","acknowledgeCount","currentUserAcknowledged","onAddReaction","onReactionClick","onAcknowledge","className","rest","rootClass","styles","jsxs","jsx","Icon","CheckCircleOutlineIcon","emoji","count","byCurrentUser","IconButton","EmoticonPlusOutlineIcon"],"mappings":";;;;;;AAmCA,MAAMA,IAAoC;AAAA,EACxC,EAAE,OAAO,MAAM,OAAO,EAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,EAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,EAAA;AACxB;AAOA,SAAwBC,EAAiB;AAAA,EACvC,WAAAC,IAAYF;AAAA,EACZ,iBAAAG,IAAkB;AAAA,EAClB,cAAAC,IAAe;AAAA,EACf,kBAAAC,IAAmB;AAAA,EACnB,yBAAAC,IAA0B;AAAA,EAC1B,eAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,GAA0B;AACxB,QAAMC,IAAY,CAACC,EAAO,mBAAmB,GAAGH,CAAS,EACtD,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAI,EAAC,OAAA,EAAI,WAAWF,GAAY,GAAGD,GAE5B,UAAA;AAAA,IAAAP,KACC,gBAAAU;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAW;AAAA,UACTD,EAAO,wBAAwB;AAAA,UAC/BP,IACIO,EAAO,gCAAgC,IACvC;AAAA,QAAA,EAEH,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,QACX,SAASJ;AAAA,QACT,gBAAcH;AAAA,QACd,cAAW;AAAA,QAEX,UAAA;AAAA,UAAA,gBAAAS,EAAC,QAAA,EAAK,WAAWF,EAAO,6BAA6B,GAAG,eAAW,IACjE,UAAA,gBAAAE,EAACC,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAD,EAACE,GAAA,CAAA,CAAuB,GAAI,GACrD;AAAA,UACCX,IACC,gBAAAS,EAAC,QAAA,EAAK,WAAWF,EAAO,8BAA8B,GACnD,UAAAR,EAAA,CACH,sBAEC,QAAA,EAAK,WAAWQ,EAAO,8BAA8B,GAAG,UAAA,cAAA,CAEzD;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAMN,gBAAAC,EAAC,OAAA,EAAI,WAAWD,EAAO,0BAA0B,GAC9C,UAAA;AAAA,MAAAX,EAAU,IAAI,CAAC,EAAE,OAAAgB,GAAO,OAAAC,GAAO,eAAAC,QAC9B,gBAAAN;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,MAAK;AAAA,UACL,WAAW;AAAA,YACTD,EAAO,yBAAyB;AAAA,YAChCO,IAAgBP,EAAO,+BAA+B,IAAI;AAAA,UAAA,EAEzD,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,UACX,SAAS,MAAML,KAAA,gBAAAA,EAAkBU;AAAA,UACjC,cAAY,GAAGA,CAAK,IAAIC,CAAK,YAAYA,MAAU,IAAI,MAAM,EAAE;AAAA,UAC/D,gBAAcC;AAAA,UAEd,UAAA;AAAA,YAAA,gBAAAL;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAWF,EAAO,+BAA+B;AAAA,gBACjD,eAAW;AAAA,gBAEV,UAAAK;AAAA,cAAA;AAAA,YAAA;AAAA,8BAEF,QAAA,EAAK,WAAWL,EAAO,+BAA+B,GACpD,UAAAM,EAAA,CACH;AAAA,UAAA;AAAA,QAAA;AAAA,QApBKD;AAAA,MAAA,CAsBR;AAAA,MAGAf,KACC,gBAAAY;AAAA,QAACM;AAAA,QAAA;AAAA,UACC,cAAW;AAAA,UACX,WAAWR,EAAO,iCAAiC;AAAA,UACnD,MAAK;AAAA,UACL,SAASN;AAAA,UACT,wBAAOS,GAAA,EAAK,MAAK,MAAK,OAAO,gBAAAD,EAACO,KAAwB,EAAA,CAAI;AAAA,QAAA;AAAA,MAAA;AAAA,IAC5D,EAAA,CAEJ;AAAA,EAAA,GACF;AAEJ;"}
@@ -1 +0,0 @@
1
- ._message-reactions_7zl3e_2{display:flex;align-items:center;flex-wrap:wrap;gap:var(--spacing-xs);padding:var(--spacing-xxxxs) 0}._message-reactions__pills_7zl3e_9{display:flex;align-items:center;flex-wrap:wrap;gap:var(--spacing-xxxs)}._message-reactions__pill_7zl3e_9{display:inline-flex;align-items:center;gap:var(--spacing-xxxs);padding:var(--spacing-xxxs) var(--spacing-xxs);border:none;border-radius:var(--radius-s);background-color:rgba(var(--center-channel-color-rgb),.08);cursor:pointer;transition:background-color var(--duration-quick) var(--ease-transition),box-shadow var(--duration-quick) var(--ease-transition)}._message-reactions__pill_7zl3e_9:hover{background-color:rgba(var(--center-channel-color-rgb),.12)}._message-reactions__pill_7zl3e_9:focus-visible{outline:2px solid var(--link-color);outline-offset:1px}._message-reactions__pill--mine_7zl3e_33{background-color:rgba(var(--link-color-rgb),.08);box-shadow:inset 0 0 0 1px var(--link-color)}._message-reactions__pill--mine_7zl3e_33:hover{background-color:rgba(var(--link-color-rgb),.12)}._message-reactions__pill--mine_7zl3e_33 ._message-reactions__pill-count_7zl3e_40{color:var(--link-color)}._message-reactions__pill-emoji_7zl3e_43{font-size:var(--font-size-200);line-height:var(--line-height-50)}._message-reactions__pill-count_7zl3e_40{font-family:var(--font-family-body);font-size:var(--font-size-75);font-weight:var(--font-weight-semibold);line-height:var(--line-height-75);color:rgba(var(--center-channel-color-rgb),.56)}@media(hover:hover)and (pointer:fine){._message-reactions__add-reaction_7zl3e_55{opacity:0;pointer-events:none;transition:opacity var(--duration-quick) var(--ease-transition)}._message-reactions_7zl3e_2:hover ._message-reactions__add-reaction_7zl3e_55,._message-reactions_7zl3e_2:focus-within ._message-reactions__add-reaction_7zl3e_55{opacity:1;pointer-events:auto}}._message-reactions__ack_7zl3e_65{display:inline-flex;align-items:center;gap:var(--spacing-xxxs);padding:var(--spacing-xxxs) var(--spacing-xxs);border:none;border-radius:var(--radius-s);background-color:rgba(var(--color-success-rgb),.12);color:var(--color-success);cursor:pointer;transition:background-color var(--duration-quick) var(--ease-transition)}._message-reactions__ack_7zl3e_65:hover{background-color:rgba(var(--color-success-rgb),.2)}._message-reactions__ack_7zl3e_65:focus-visible{outline:2px solid var(--color-success);outline-offset:1px}._message-reactions__ack--active_7zl3e_84{background-color:var(--color-success);color:var(--button-color)}._message-reactions__ack--active_7zl3e_84:hover{background-color:color-mix(in srgb,black 8%,var(--color-success))}._message-reactions__ack-icon_7zl3e_91{display:inline-flex;align-items:center}._message-reactions__ack-count_7zl3e_95,._message-reactions__ack-label_7zl3e_101{font-family:var(--font-family-body);font-size:var(--font-size-75);font-weight:var(--font-weight-semibold);line-height:var(--line-height-75)}