@linktr.ee/messaging-react 3.29.1 → 3.29.2-rc-1785808571

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@linktr.ee/messaging-react",
3
- "version": "3.29.1",
3
+ "version": "3.29.2-rc-1785808571",
4
4
  "description": "React messaging components built on messaging-core for web applications",
5
5
  "type": "module",
6
6
  "main": "dist/index.cjs",
@@ -50,7 +50,7 @@
50
50
  },
51
51
  "dependencies": {
52
52
  "@linktr.ee/component-library": "11.8.6",
53
- "@linktr.ee/messaging-core": "^2.2.0",
53
+ "@linktr.ee/messaging-core": "2.3.0-rc-1785808571",
54
54
  "@linktr.ee/messaging-taxonomy": "^0.5.0",
55
55
  "@phosphor-icons/react": "^2.1.10",
56
56
  "culori": "^4.0.2"
@@ -51,7 +51,7 @@ const createMockChannel = async (
51
51
  type: msg.type ?? ('regular' as const),
52
52
  created_at: minutesAgo(messages.length - index),
53
53
  updated_at: minutesAgo(messages.length - index),
54
- html: `<p>${msg.text}</p>`,
54
+ html: msg.html ?? `<p>${msg.text}</p>`,
55
55
  attachments: msg.attachments ?? [],
56
56
  latest_reactions: [],
57
57
  own_reactions: [],
@@ -114,6 +114,7 @@ interface TemplateProps {
114
114
  messages: Array<{
115
115
  id: string
116
116
  text: string
117
+ html?: string
117
118
  user: StoryUser
118
119
  type?: 'regular' | 'system'
119
120
  attachments?: Array<Record<string, unknown>>
@@ -238,6 +239,24 @@ Default.args = {
238
239
  ],
239
240
  }
240
241
 
242
+ export const MentionContrast: StoryFn<TemplateProps> = Template.bind({})
243
+ MentionContrast.args = {
244
+ messages: [
245
+ {
246
+ id: 'msg-1',
247
+ text: 'Hi @Creator, could you take a look at this?',
248
+ html: '<p>Hi <span class="str-chat__message-mention">@Creator</span>, could you take a look at this?</p>',
249
+ user: storyUsers.visitor,
250
+ },
251
+ {
252
+ id: 'msg-2',
253
+ text: 'Sure thing, @Visitor — I will check it now.',
254
+ html: '<p>Sure thing, <span class="str-chat__message-mention">@Visitor</span> — I will check it now.</p>',
255
+ user: storyUsers.creator,
256
+ },
257
+ ],
258
+ }
259
+
241
260
  // MES-1036: "✓✓ Delivered" appears below only the most recent *sent*
242
261
  // message. Every mock message carries status: 'received', and stream's
243
262
  // MessageList derives `lastOwnMessage`, so the indicator lands on the last
package/src/styles.css CHANGED
@@ -970,6 +970,11 @@
970
970
  word-break: break-word;
971
971
  }
972
972
 
973
+ /* Keep mentions readable by inheriting the message bubble's ink color. */
974
+ .str-chat__message-text-inner .str-chat__message-mention {
975
+ color: inherit;
976
+ }
977
+
973
978
  .str-chat__message
974
979
  .str-chat__message-inner
975
980
  .str-chat__message-bubble