react-mention-input 1.1.17 → 1.1.18

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.
@@ -27,6 +27,7 @@ interface MentionInputProps {
27
27
  name: string;
28
28
  }[];
29
29
  userSelectListName: string[];
30
+ tags: string[];
30
31
  images?: File[];
31
32
  imageUrl?: string | null;
32
33
  }) => void;
@@ -38,26 +38,33 @@ import React, { useState, useRef } from "react";
38
38
  import ReactDOM from "react-dom";
39
39
  import "./MentionInput.css";
40
40
  var MentionInput = function (_a) {
41
- var _b, _c;
42
- var users = _a.users, _d = _a.placeholder, placeholder = _d === void 0 ? "Type a message... (or drag & drop an image)" : _d, containerClassName = _a.containerClassName, inputContainerClassName = _a.inputContainerClassName, inputClassName = _a.inputClassName, sendBtnClassName = _a.sendBtnClassName, suggestionListClassName = _a.suggestionListClassName, suggestionItemClassName = _a.suggestionItemClassName, imgClassName = _a.imgClassName, imgStyle = _a.imgStyle, attachedImageContainerClassName = _a.attachedImageContainerClassName, attachedImageContainerStyle = _a.attachedImageContainerStyle, sendButtonIcon = _a.sendButtonIcon, attachmentButtonIcon = _a.attachmentButtonIcon, onSendMessage = _a.onSendMessage, _e = _a.suggestionPosition, suggestionPosition = _e === void 0 ? 'bottom' : _e, onImageUpload = _a.onImageUpload;
43
- var _f = useState(""), inputValue = _f[0], setInputValue = _f[1]; // Plain text
44
- var _g = useState([]), suggestions = _g[0], setSuggestions = _g[1];
45
- var _h = useState(false), showSuggestions = _h[0], setShowSuggestions = _h[1];
46
- var _j = useState(null), selectedImage = _j[0], setSelectedImage = _j[1];
47
- var _k = useState(null), imageUrl = _k[0], setImageUrl = _k[1];
48
- var _l = useState(false), isUploading = _l[0], setIsUploading = _l[1];
49
- var _m = useState(false), isDraggingOver = _m[0], setIsDraggingOver = _m[1];
41
+ var _b;
42
+ var users = _a.users, _c = _a.placeholder, placeholder = _c === void 0 ? "Type a message... (or drag & drop an image)" : _c, containerClassName = _a.containerClassName, inputContainerClassName = _a.inputContainerClassName, inputClassName = _a.inputClassName, sendBtnClassName = _a.sendBtnClassName, suggestionListClassName = _a.suggestionListClassName, suggestionItemClassName = _a.suggestionItemClassName, imgClassName = _a.imgClassName, imgStyle = _a.imgStyle, attachedImageContainerClassName = _a.attachedImageContainerClassName, attachedImageContainerStyle = _a.attachedImageContainerStyle, sendButtonIcon = _a.sendButtonIcon, attachmentButtonIcon = _a.attachmentButtonIcon, onSendMessage = _a.onSendMessage, _d = _a.suggestionPosition, suggestionPosition = _d === void 0 ? 'bottom' : _d, onImageUpload = _a.onImageUpload;
43
+ var _e = useState(""), inputValue = _e[0], setInputValue = _e[1]; // Plain text
44
+ var _f = useState([]), suggestions = _f[0], setSuggestions = _f[1];
45
+ var _g = useState(false), showSuggestions = _g[0], setShowSuggestions = _g[1];
46
+ var _h = useState(null), selectedImage = _h[0], setSelectedImage = _h[1];
47
+ var _j = useState(null), imageUrl = _j[0], setImageUrl = _j[1];
48
+ var _k = useState(false), isUploading = _k[0], setIsUploading = _k[1];
49
+ var _l = useState(false), isDraggingOver = _l[0], setIsDraggingOver = _l[1];
50
50
  var inputRef = useRef(null);
51
51
  var suggestionListRef = useRef(null);
52
52
  var caretOffsetRef = useRef(0);
53
53
  var userSelectListRef = useRef([]); // Only unique names
54
54
  var userSelectListWithIdsRef = useRef([]); // Unique IDs with names
55
+ var tagsListRef = useRef([]); // Store hashtags
55
56
  var fileInputRef = useRef(null);
56
57
  var highlightMentionsAndLinks = function (text) {
57
58
  // Regular expression for detecting links
58
59
  var linkRegex = /(https?:\/\/[^\s]+)/g;
60
+ // Regular expression for detecting hashtags
61
+ var hashtagRegex = /#[\w]+/g;
59
62
  // Highlight links
60
63
  var highlightedText = text.replace(linkRegex, '<a href="$1" target="_blank" rel="noopener noreferrer" class="link-highlight">$1</a>');
64
+ // Highlight hashtags
65
+ highlightedText = highlightedText.replace(hashtagRegex, function (match) {
66
+ return "<span class=\"hashtag-highlight\">".concat(match, "</span>");
67
+ });
61
68
  // Highlight mentions manually based on `userSelectListRef`
62
69
  userSelectListRef === null || userSelectListRef === void 0 ? void 0 : userSelectListRef.current.forEach(function (userName) {
63
70
  var mentionPattern = new RegExp("@".concat(userName, "(\\s|$)"), "g");
@@ -128,8 +135,17 @@ var MentionInput = function (_a) {
128
135
  else {
129
136
  setShowSuggestions(false);
130
137
  }
131
- // Only apply highlighting if we have mentions or links to highlight
132
- if (userSelectListRef.current.length > 0 || plainText.match(/(https?:\/\/[^\s]+)/g)) {
138
+ // Extract and store hashtags
139
+ var hashtagMatches = plainText.match(/#[\w]+/g);
140
+ if (hashtagMatches) {
141
+ var uniqueTags = Array.from(new Set(hashtagMatches));
142
+ tagsListRef.current = uniqueTags;
143
+ }
144
+ else {
145
+ tagsListRef.current = [];
146
+ }
147
+ // Only apply highlighting if we have mentions, hashtags, or links to highlight
148
+ if (userSelectListRef.current.length > 0 || plainText.match(/(https?:\/\/[^\s]+)/g) || plainText.match(/#[\w]+/g)) {
133
149
  var currentHTML = inputRef.current.innerHTML;
134
150
  var htmlWithHighlights = highlightMentionsAndLinks(plainText);
135
151
  // Only update if the highlighted HTML is different to avoid cursor jumping
@@ -317,6 +333,7 @@ var MentionInput = function (_a) {
317
333
  messageHTML: messageHTML,
318
334
  userSelectListWithIds: userSelectListWithIdsRef.current,
319
335
  userSelectListName: userSelectListRef.current,
336
+ tags: tagsListRef.current,
320
337
  images: selectedImage ? [selectedImage] : [],
321
338
  imageUrl: imageUrl
322
339
  });
@@ -327,6 +344,7 @@ var MentionInput = function (_a) {
327
344
  setImageUrl(null);
328
345
  userSelectListRef.current = [];
329
346
  userSelectListWithIdsRef.current = [];
347
+ tagsListRef.current = [];
330
348
  }
331
349
  }
332
350
  };
@@ -336,7 +354,6 @@ var MentionInput = function (_a) {
336
354
  handleSendMessage(); // Trigger the same function as the Send button
337
355
  }
338
356
  };
339
- console.log(inputValue, (_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.innerText.trim(), "inputValue====");
340
357
  return (React.createElement("div", { className: "mention-container ".concat(containerClassName || "") },
341
358
  imageUrl && selectedImage && (React.createElement("div", { className: "image-preview-card ".concat(attachedImageContainerClassName || ""), style: attachedImageContainerStyle },
342
359
  React.createElement("img", { src: imageUrl, alt: "Preview", className: imgClassName || "", style: imgStyle }),
@@ -348,7 +365,7 @@ var MentionInput = function (_a) {
348
365
  React.createElement("button", { onClick: function () { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, className: "attachment-button", type: "button", "aria-label": "Attach image" },
349
366
  React.createElement("span", { className: "attachment-icon" }, attachmentButtonIcon || "📷")),
350
367
  React.createElement("div", { className: "mention-input-wrapper" },
351
- (!inputValue || !inputRef.current || ((_c = inputRef.current) === null || _c === void 0 ? void 0 : _c.innerText.trim()) === "") && (React.createElement("span", { className: "placeholder" }, placeholder)),
368
+ (!inputValue || !inputRef.current || ((_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.innerText.trim()) === "") && (React.createElement("span", { className: "placeholder" }, placeholder)),
352
369
  React.createElement("div", { ref: inputRef, contentEditable: true, suppressContentEditableWarning: true, className: "mention-input ".concat(inputClassName || ""), onInput: handleInputChange, onKeyDown: handleKeyDown, onFocus: function () { return document.execCommand('styleWithCSS', false, 'false'); } })),
353
370
  React.createElement("button", { onClick: handleSendMessage, className: "send-button ".concat(sendBtnClassName || ""), "aria-label": "Send message" }, sendButtonIcon || "➤"),
354
371
  React.createElement("input", { type: "file", ref: fileInputRef, accept: "image/*", onChange: handleImageSelect, style: { display: 'none' } }),
@@ -10,6 +10,7 @@ interface ShowMessageCardProps {
10
10
  commentKey?: string;
11
11
  imgSrcKey?: string;
12
12
  imageUrlKey?: string;
13
+ objectNameKey?: string;
13
14
  containerClassName?: string;
14
15
  containerStyle?: CSSProperties;
15
16
  cardClassName?: string;
@@ -32,6 +33,8 @@ interface ShowMessageCardProps {
32
33
  attachedImageStyle?: CSSProperties;
33
34
  attachedImageContainerClassName?: string;
34
35
  attachedImageContainerStyle?: CSSProperties;
36
+ objectNameClassName?: string;
37
+ objectNameStyle?: CSSProperties;
35
38
  renderItem?: (element: MessageCardProps) => ReactNode;
36
39
  }
37
40
  export declare const ShowMessageCard: React.FC<ShowMessageCardProps>;
@@ -13,9 +13,12 @@ import React, { useState } from "react";
13
13
  import "./ShowMessageCard.css";
14
14
  export var ShowMessageCard = function (_a) {
15
15
  var data = _a.data, _b = _a.nameKey, nameKey = _b === void 0 ? "name" : _b, _c = _a.dateKey, dateKey = _c === void 0 ? "date" : _c, _d = _a.commentKey, commentKey = _d === void 0 ? "comment" : _d, _e = _a.imgSrcKey, imgSrcKey = _e === void 0 ? "imgSrc" : _e, _f = _a.imageUrlKey, imageUrlKey = _f === void 0 ? "imageUrl" : _f, // Default key for attached image
16
- containerClassName = _a.containerClassName, containerStyle = _a.containerStyle, cardClassName = _a.cardClassName, cardStyle = _a.cardStyle, headerClassName = _a.headerClassName, headerStyle = _a.headerStyle, imgClassName = _a.imgClassName, imgStyle = _a.imgStyle, infoClassName = _a.infoClassName, infoStyle = _a.infoStyle, nameClassName = _a.nameClassName, nameStyle = _a.nameStyle, dateClassName = _a.dateClassName, dateStyle = _a.dateStyle, bodyClassName = _a.bodyClassName, bodyStyle = _a.bodyStyle, commentClassName = _a.commentClassName, commentStyle = _a.commentStyle, attachedImageClassName = _a.attachedImageClassName, attachedImageStyle = _a.attachedImageStyle, attachedImageContainerClassName = _a.attachedImageContainerClassName, attachedImageContainerStyle = _a.attachedImageContainerStyle, renderItem = _a.renderItem;
16
+ _g = _a.objectNameKey, // Default key for attached image
17
+ objectNameKey = _g === void 0 ? "objectName" : _g, // Default key for object identifier
18
+ containerClassName = _a.containerClassName, containerStyle = _a.containerStyle, cardClassName = _a.cardClassName, cardStyle = _a.cardStyle, headerClassName = _a.headerClassName, headerStyle = _a.headerStyle, imgClassName = _a.imgClassName, imgStyle = _a.imgStyle, infoClassName = _a.infoClassName, infoStyle = _a.infoStyle, nameClassName = _a.nameClassName, nameStyle = _a.nameStyle, dateClassName = _a.dateClassName, dateStyle = _a.dateStyle, bodyClassName = _a.bodyClassName, bodyStyle = _a.bodyStyle, commentClassName = _a.commentClassName, commentStyle = _a.commentStyle, attachedImageClassName = _a.attachedImageClassName, attachedImageStyle = _a.attachedImageStyle, attachedImageContainerClassName = _a.attachedImageContainerClassName, attachedImageContainerStyle = _a.attachedImageContainerStyle, objectNameClassName = _a.objectNameClassName, objectNameStyle = _a.objectNameStyle, renderItem = _a.renderItem;
19
+ console.log(data, "data==");
17
20
  // State to manage initials for images that fail to load
18
- var _g = useState({}), initialsState = _g[0], setInitialsState = _g[1];
21
+ var _h = useState({}), initialsState = _h[0], setInitialsState = _h[1];
19
22
  // Handle image load failure
20
23
  var handleImageError = function (id) {
21
24
  setInitialsState(function (prevState) {
@@ -32,21 +35,38 @@ export var ShowMessageCard = function (_a) {
32
35
  .join("");
33
36
  return initials;
34
37
  };
38
+ // Helper function to extract hashtags and mentions from text
39
+ var extractTagsAndMentions = function (text) {
40
+ var plainText = text.replace(/<[^>]*>/g, ''); // Remove HTML tags to get plain text
41
+ var hashtags = plainText.match(/#[\w]+/g) || [];
42
+ var mentions = plainText.match(/@[\w\s-]+/g) || [];
43
+ return {
44
+ hashtags: Array.from(new Set(hashtags)), // Remove duplicates
45
+ mentions: Array.from(new Set(mentions.map(function (mention) { return mention.trim(); }))) // Remove duplicates and trim
46
+ };
47
+ };
35
48
  return (React.createElement("div", { className: "message-card-container ".concat(containerClassName || ""), style: containerStyle }, data.map(function (item, index) {
36
49
  if (renderItem !== undefined) {
37
50
  // Use custom render function if provided
38
51
  return (React.createElement(React.Fragment, { key: item.id || index }, renderItem(item)));
39
52
  }
40
53
  var showInitials = initialsState[item.id || index] || !item[imgSrcKey]; // Decide whether to show initials
54
+ // Extract tags and mentions from the comment
55
+ var _a = extractTagsAndMentions(item[commentKey] || ''), hashtags = _a.hashtags, mentions = _a.mentions;
41
56
  return (React.createElement("div", { key: item.id || index, className: "message-card ".concat(cardClassName || ""), style: cardStyle },
42
57
  React.createElement("div", { className: "message-card-header ".concat(headerClassName || ""), style: headerStyle },
43
- showInitials ? (React.createElement("div", { className: "message-card-initials ".concat(imgClassName || ""), style: imgStyle }, getInitials(item[nameKey]))) : (React.createElement("img", { src: item[imgSrcKey], alt: item[nameKey], className: "message-card-img ".concat(imgClassName || ""), style: imgStyle, onError: function () { return handleImageError(item.id || index); } })),
44
- React.createElement("div", { className: "message-card-info ".concat(infoClassName || ""), style: infoStyle },
45
- React.createElement("h3", { className: "message-card-name ".concat(nameClassName || ""), style: nameStyle }, item[nameKey]),
46
- React.createElement("p", { className: "message-card-date ".concat(dateClassName || ""), style: dateStyle }, item[dateKey]))),
58
+ React.createElement("div", { className: "message-card-header-left" },
59
+ showInitials ? (React.createElement("div", { className: "message-card-initials ".concat(imgClassName || ""), style: imgStyle }, getInitials(item[nameKey]))) : (React.createElement("img", { src: item[imgSrcKey], alt: item[nameKey], className: "message-card-img ".concat(imgClassName || ""), style: imgStyle, onError: function () { return handleImageError(item.id || index); } })),
60
+ React.createElement("div", { className: "message-card-info ".concat(infoClassName || ""), style: infoStyle },
61
+ React.createElement("h3", { className: "message-card-name ".concat(nameClassName || ""), style: nameStyle }, item[nameKey]),
62
+ React.createElement("p", { className: "message-card-date ".concat(dateClassName || ""), style: dateStyle }, item[dateKey]))),
63
+ item[objectNameKey] && (React.createElement("div", { className: "message-card-item-name ".concat(objectNameClassName || ""), style: objectNameStyle }, item[objectNameKey]))),
47
64
  React.createElement("div", { className: "message-card-body ".concat(bodyClassName || ""), style: bodyStyle },
48
65
  React.createElement("p", { className: "message-card-comment ".concat(commentClassName || ""), style: commentStyle, dangerouslySetInnerHTML: { __html: item[commentKey] } }),
49
66
  (item === null || item === void 0 ? void 0 : item[imageUrlKey]) && (React.createElement("div", { className: "message-card-attached-image-container ".concat(attachedImageContainerClassName || ""), style: attachedImageContainerStyle },
50
- React.createElement("img", { src: item[imageUrlKey], alt: "Attached", className: "message-card-attached-image ".concat(attachedImageClassName || ""), style: attachedImageStyle }))))));
67
+ React.createElement("img", { src: item[imageUrlKey], alt: "Attached", className: "message-card-attached-image ".concat(attachedImageClassName || ""), style: attachedImageStyle }))),
68
+ (hashtags.length > 0 || mentions.length > 0) && (React.createElement("div", { className: "message-card-tags" },
69
+ hashtags.map(function (tag, tagIndex) { return (React.createElement("span", { key: "hashtag-".concat(tagIndex), className: "tag-chip hashtag-chip" }, tag)); }),
70
+ mentions.map(function (mention, mentionIndex) { return (React.createElement("span", { key: "mention-".concat(mentionIndex), className: "tag-chip mention-chip" }, mention)); }))))));
51
71
  })));
52
72
  };
package/dist/demo.js CHANGED
@@ -16,14 +16,14 @@ var Demo = function () {
16
16
  name: 'John Doe',
17
17
  date: '2 hours ago',
18
18
  comment: 'Updated the status to Draft. Need <span class="mention-highlight">@team-leads</span> review before proceeding. <span class="hashtag-highlight">#urgent</span> <span class="hashtag-highlight">#review</span>',
19
- itemName: '26may_item001 (A)',
19
+ objectName: '26may_item001 (A)',
20
20
  },
21
21
  {
22
22
  id: 2,
23
23
  name: 'Mike Johnson',
24
24
  date: '1 day ago',
25
25
  comment: 'Revision A completed successfully. Ready for next phase. <span class="hashtag-highlight">#milestone</span>',
26
- itemName: '26may_item001 (A)',
26
+ objectName: '26may_item001 (A)',
27
27
  }
28
28
  ]), messages = _a[0], setMessages = _a[1];
29
29
  // Sample users for mentions
@@ -45,7 +45,7 @@ var Demo = function () {
45
45
  imageUrl: messageData.imageUrl,
46
46
  tags: messageData.tags,
47
47
  mentions: messageData.userSelectListName,
48
- itemName: 'new_item001 (A)', // You can customize this or make it dynamic
48
+ objectName: 'new_item001 (A)', // You can customize this or make it dynamic
49
49
  };
50
50
  setMessages(__spreadArray(__spreadArray([], messages, true), [newMessage], false));
51
51
  };
@@ -10,7 +10,7 @@ interface ShowMessageCardProps {
10
10
  commentKey?: string;
11
11
  imgSrcKey?: string;
12
12
  imageUrlKey?: string;
13
- itemNameKey?: string;
13
+ objectNameKey?: string;
14
14
  containerClassName?: string;
15
15
  containerStyle?: CSSProperties;
16
16
  cardClassName?: string;
@@ -33,8 +33,8 @@ interface ShowMessageCardProps {
33
33
  attachedImageStyle?: CSSProperties;
34
34
  attachedImageContainerClassName?: string;
35
35
  attachedImageContainerStyle?: CSSProperties;
36
- itemNameClassName?: string;
37
- itemNameStyle?: CSSProperties;
36
+ objectNameClassName?: string;
37
+ objectNameStyle?: CSSProperties;
38
38
  renderItem?: (element: MessageCardProps) => ReactNode;
39
39
  }
40
40
  export declare const ShowMessageCard: React.FC<ShowMessageCardProps>;
@@ -13,9 +13,10 @@ import React, { useState } from "react";
13
13
  import "./ShowMessageCard.css";
14
14
  export var ShowMessageCard = function (_a) {
15
15
  var data = _a.data, _b = _a.nameKey, nameKey = _b === void 0 ? "name" : _b, _c = _a.dateKey, dateKey = _c === void 0 ? "date" : _c, _d = _a.commentKey, commentKey = _d === void 0 ? "comment" : _d, _e = _a.imgSrcKey, imgSrcKey = _e === void 0 ? "imgSrc" : _e, _f = _a.imageUrlKey, imageUrlKey = _f === void 0 ? "imageUrl" : _f, // Default key for attached image
16
- _g = _a.itemNameKey, // Default key for attached image
17
- itemNameKey = _g === void 0 ? "name" : _g, // Default key for item identifier
18
- containerClassName = _a.containerClassName, containerStyle = _a.containerStyle, cardClassName = _a.cardClassName, cardStyle = _a.cardStyle, headerClassName = _a.headerClassName, headerStyle = _a.headerStyle, imgClassName = _a.imgClassName, imgStyle = _a.imgStyle, infoClassName = _a.infoClassName, infoStyle = _a.infoStyle, nameClassName = _a.nameClassName, nameStyle = _a.nameStyle, dateClassName = _a.dateClassName, dateStyle = _a.dateStyle, bodyClassName = _a.bodyClassName, bodyStyle = _a.bodyStyle, commentClassName = _a.commentClassName, commentStyle = _a.commentStyle, attachedImageClassName = _a.attachedImageClassName, attachedImageStyle = _a.attachedImageStyle, attachedImageContainerClassName = _a.attachedImageContainerClassName, attachedImageContainerStyle = _a.attachedImageContainerStyle, itemNameClassName = _a.itemNameClassName, itemNameStyle = _a.itemNameStyle, renderItem = _a.renderItem;
16
+ _g = _a.objectNameKey, // Default key for attached image
17
+ objectNameKey = _g === void 0 ? "objectName" : _g, // Default key for object identifier
18
+ containerClassName = _a.containerClassName, containerStyle = _a.containerStyle, cardClassName = _a.cardClassName, cardStyle = _a.cardStyle, headerClassName = _a.headerClassName, headerStyle = _a.headerStyle, imgClassName = _a.imgClassName, imgStyle = _a.imgStyle, infoClassName = _a.infoClassName, infoStyle = _a.infoStyle, nameClassName = _a.nameClassName, nameStyle = _a.nameStyle, dateClassName = _a.dateClassName, dateStyle = _a.dateStyle, bodyClassName = _a.bodyClassName, bodyStyle = _a.bodyStyle, commentClassName = _a.commentClassName, commentStyle = _a.commentStyle, attachedImageClassName = _a.attachedImageClassName, attachedImageStyle = _a.attachedImageStyle, attachedImageContainerClassName = _a.attachedImageContainerClassName, attachedImageContainerStyle = _a.attachedImageContainerStyle, objectNameClassName = _a.objectNameClassName, objectNameStyle = _a.objectNameStyle, renderItem = _a.renderItem;
19
+ console.log(data, "data==");
19
20
  // State to manage initials for images that fail to load
20
21
  var _h = useState({}), initialsState = _h[0], setInitialsState = _h[1];
21
22
  // Handle image load failure
@@ -59,7 +60,7 @@ export var ShowMessageCard = function (_a) {
59
60
  React.createElement("div", { className: "message-card-info ".concat(infoClassName || ""), style: infoStyle },
60
61
  React.createElement("h3", { className: "message-card-name ".concat(nameClassName || ""), style: nameStyle }, item[nameKey]),
61
62
  React.createElement("p", { className: "message-card-date ".concat(dateClassName || ""), style: dateStyle }, item[dateKey]))),
62
- item[itemNameKey] && (React.createElement("div", { className: "message-card-item-name ".concat(itemNameClassName || ""), style: itemNameStyle }, item[itemNameKey]))),
63
+ item[objectNameKey] && (React.createElement("div", { className: "message-card-item-name ".concat(objectNameClassName || ""), style: objectNameStyle }, item[objectNameKey]))),
63
64
  React.createElement("div", { className: "message-card-body ".concat(bodyClassName || ""), style: bodyStyle },
64
65
  React.createElement("p", { className: "message-card-comment ".concat(commentClassName || ""), style: commentStyle, dangerouslySetInnerHTML: { __html: item[commentKey] } }),
65
66
  (item === null || item === void 0 ? void 0 : item[imageUrlKey]) && (React.createElement("div", { className: "message-card-attached-image-container ".concat(attachedImageContainerClassName || ""), style: attachedImageContainerStyle },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-mention-input",
3
- "version": "1.1.17",
3
+ "version": "1.1.18",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "scripts": {
@@ -8,7 +8,9 @@
8
8
  "build": "tsc && npm run copy-css",
9
9
  "copy-css": "copyfiles -u 1 src/**/*.css dist",
10
10
  "dev": "vite",
11
- "demo": "vite"
11
+ "demo": "vite",
12
+ "prepublishOnly": "npm run build",
13
+ "version": "npm run build && git add -A dist"
12
14
  },
13
15
  "keywords": [
14
16
  "mention",
package/tsconfig.json CHANGED
@@ -3,13 +3,26 @@
3
3
  "target": "ES5",
4
4
  "sourceMap": false,
5
5
  "module": "ESNext",
6
- "moduleResolution": "node",
6
+ "moduleResolution": "bundler",
7
7
  "jsx": "react",
8
- "lib": ["dom", "es6"], // Ensure karein ki 'es6' included ho
8
+ "lib": ["dom", "es6"],
9
9
  "declaration": true,
10
10
  "outDir": "./dist",
11
11
  "strict": true,
12
- "esModuleInterop": true
13
- }
14
-
12
+ "esModuleInterop": true,
13
+ "allowSyntheticDefaultImports": true,
14
+ "skipLibCheck": true
15
+ },
16
+ "include": [
17
+ "src/**/*"
18
+ ],
19
+ "exclude": [
20
+ "node_modules",
21
+ "dist",
22
+ "demo.tsx",
23
+ "main.tsx",
24
+ "vite.config.ts",
25
+ "**/*.test.*",
26
+ "**/*.spec.*"
27
+ ]
15
28
  }