@veltdev/react 1.0.52 → 1.0.53

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.
@@ -1,37 +1,17 @@
1
1
  import React from 'react';
2
2
  export interface IVeltCommentsProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> {
3
3
  streamViewContainerId?: string;
4
- /**
5
- * @deprecated
6
- */
7
- pinHighlighterClass?: string;
8
- /**
9
- * @deprecated
10
- */
11
- textHighlighterClass?: string;
12
4
  autoCategorize?: boolean;
13
- /**
14
- * @deprecated Use `onSignIn` instead
15
- */
16
- signIn?: Function;
17
5
  onSignIn?: Function;
18
6
  onUpgrade?: Function;
19
7
  textMode?: boolean;
20
8
  popoverMode?: boolean;
21
9
  popoverTriangleComponent?: boolean;
22
- /**
23
- * @deprecated Use `floatingMode` instead
24
- */
25
- floatingCommentsMode?: boolean;
26
10
  floatingCommentDialog?: boolean;
27
11
  moderatorMode?: boolean;
28
12
  streamMode?: boolean;
29
13
  signInButton?: boolean;
30
14
  upgradeButton?: boolean;
31
- /**
32
- * @deprecated Use `attachments` instead
33
- */
34
- allowAttachments?: boolean;
35
15
  attachments?: boolean;
36
16
  /**
37
17
  * Pass `all` to allow all type of recordings.
@@ -41,32 +21,12 @@ export interface IVeltCommentsProps extends React.DetailedHTMLProps<React.HTMLAt
41
21
  */
42
22
  recordings?: string;
43
23
  reactions?: boolean;
44
- /**
45
- * @deprecated Use `deviceInfo` instead
46
- */
47
- showDeviceInfo?: boolean;
48
24
  deviceInfo?: boolean;
49
- /**
50
- * @deprecated Use `commentIndex` instead
51
- */
52
- showCommentIndex?: boolean;
53
25
  commentIndex?: boolean;
54
26
  dialogOnHover?: boolean;
55
27
  dialogOnTargetElementClick?: boolean;
56
- /**
57
- * @deprecated Use `priority` instead
58
- */
59
- showPriority?: boolean;
60
28
  priority?: boolean;
61
- /**
62
- * @deprecated Use `status` instead
63
- */
64
- showStatus?: boolean;
65
29
  status?: boolean;
66
- /**
67
- * @deprecated Use `resolveButton` instead
68
- */
69
- showResolveButton?: boolean;
70
30
  resolveButton?: boolean;
71
31
  inboxMode?: boolean;
72
32
  suggestionMode?: boolean;
@@ -76,46 +36,19 @@ export interface IVeltCommentsProps extends React.DetailedHTMLProps<React.HTMLAt
76
36
  minimap?: boolean;
77
37
  persistentCommentMode?: boolean;
78
38
  ghostComments?: boolean;
79
- /**
80
- * @deprecated Use `ghostCommentsIndicator` instead
81
- */
82
- ghostCommentsMessage?: boolean;
83
39
  ghostCommentsIndicator?: boolean;
84
40
  commentsOnDom?: boolean;
85
41
  commentTool?: boolean;
86
42
  sidebarButtonOnCommentDialog?: boolean;
87
43
  scrollToComponent?: boolean;
44
+ userMentions?: boolean;
88
45
  allowedElementIds?: string[];
89
- /**
90
- * @deprecated Use `onCommentAdd` instead
91
- */
92
- commentAdded?: Function;
93
46
  onCommentAdd?: Function;
94
47
  onCustomPinInject?: Function;
95
48
  onCommentUpdate?: Function;
96
- /**
97
- * @deprecated Use `onCommentAccept` instead
98
- */
99
- commentAccepted?: Function;
100
49
  onCommentAccept?: Function;
101
- /**
102
- * @deprecated Use `onCommentReject` instead
103
- */
104
- commentRejected?: Function;
105
50
  onCommentReject?: Function;
106
51
  onSidebarButtonOnCommentDialogClick?: Function;
107
- /**
108
- * @deprecated Use `customStatus` instead
109
- */
110
- customStatuses?: {
111
- id: string;
112
- color: string;
113
- name: string;
114
- type: 'default' | 'ongoing' | 'terminal';
115
- lightColor?: string;
116
- svg?: string;
117
- iconUrl?: string;
118
- }[];
119
52
  customStatus?: {
120
53
  id: string;
121
54
  color: string;
@@ -125,29 +58,12 @@ export interface IVeltCommentsProps extends React.DetailedHTMLProps<React.HTMLAt
125
58
  svg?: string;
126
59
  iconUrl?: string;
127
60
  }[];
128
- /**
129
- * @deprecated Use `customPriority` instead
130
- */
131
- customPriorities?: {
132
- id: string;
133
- color: string;
134
- name: string;
135
- lightColor?: string;
136
- }[];
137
61
  customPriority?: {
138
62
  id: string;
139
63
  color: string;
140
64
  name: string;
141
65
  lightColor?: string;
142
66
  }[];
143
- /**
144
- * @deprecated Use `customCategory` instead
145
- */
146
- customCategories?: {
147
- id: string;
148
- color: string;
149
- name: string;
150
- }[];
151
67
  customCategory?: {
152
68
  id: string;
153
69
  color: string;
@@ -1,4 +1,31 @@
1
1
  import React from 'react';
2
+ declare class FilterTypeConfig {
3
+ name?: string;
4
+ enable?: boolean;
5
+ multiSelection?: boolean;
6
+ enableGrouping?: boolean;
7
+ }
8
+ declare class CommentSidebarFilterConfig {
9
+ location?: FilterTypeConfig;
10
+ people?: FilterTypeConfig;
11
+ priority?: FilterTypeConfig;
12
+ category?: FilterTypeConfig;
13
+ commentType?: FilterTypeConfig;
14
+ }
15
+ declare class CommentSidebarGroupConfig {
16
+ enable?: boolean;
17
+ name?: string;
18
+ }
19
+ declare class CommentSidebarFilters {
20
+ location?: Location[];
21
+ people?: {
22
+ userId?: string;
23
+ email?: string;
24
+ }[];
25
+ priority?: string[];
26
+ status?: string[];
27
+ category?: string[];
28
+ }
2
29
  export interface IVeltCommentsSidebarProps {
3
30
  embedMode?: boolean;
4
31
  /**
@@ -8,6 +35,9 @@ export interface IVeltCommentsSidebarProps {
8
35
  urlNavigation?: boolean;
9
36
  pageMode?: boolean;
10
37
  currentLocationSuffix?: boolean;
38
+ filterConfig?: CommentSidebarFilterConfig;
39
+ groupConfig?: CommentSidebarGroupConfig;
40
+ filters?: CommentSidebarFilters;
11
41
  /**
12
42
  * @deprecated Use `onSidebarOpen` instead
13
43
  */
@@ -1 +1 @@
1
- export declare const VELT_SDK_VERSION = "1.0.62";
1
+ export declare const VELT_SDK_VERSION = "1.0.63";
package/esm/index.js CHANGED
@@ -86,7 +86,7 @@ var loadVelt = function (callback, version, staging) {
86
86
  }
87
87
  };
88
88
 
89
- var VELT_SDK_VERSION = '1.0.62';
89
+ var VELT_SDK_VERSION = '1.0.63';
90
90
 
91
91
  var SnippylyProvider = function (props) {
92
92
  var apiKey = props.apiKey, user = props.user, config = props.config, documentId = props.documentId, language = props.language, translations = props.translations, autoTranslation = props.autoTranslation, onClientLoad = props.onClientLoad, children = props.children;
@@ -170,15 +170,12 @@ var SnippylyCommentBubble = function (props) {
170
170
  };
171
171
 
172
172
  var SnippylyComments = function (props) {
173
- var autoCategorize = props.autoCategorize, streamViewContainerId = props.streamViewContainerId, pinHighlighterClass = props.pinHighlighterClass, textHighlighterClass = props.textHighlighterClass, signIn = props.signIn, onSignIn = props.onSignIn, onUpgrade = props.onUpgrade, textMode = props.textMode, popoverMode = props.popoverMode, popoverTriangleComponent = props.popoverTriangleComponent, floatingCommentsMode = props.floatingCommentsMode, floatingCommentDialog = props.floatingCommentDialog, moderatorMode = props.moderatorMode, streamMode = props.streamMode, signInButton = props.signInButton, upgradeButton = props.upgradeButton, allowAttachments = props.allowAttachments, attachments = props.attachments, recordings = props.recordings, reactions = props.reactions, showDeviceInfo = props.showDeviceInfo, deviceInfo = props.deviceInfo, showCommentIndex = props.showCommentIndex, commentIndex = props.commentIndex, dialogOnHover = props.dialogOnHover, dialogOnTargetElementClick = props.dialogOnTargetElementClick, showPriority = props.showPriority, priority = props.priority, inboxMode = props.inboxMode, suggestionMode = props.suggestionMode, mobileMode = props.mobileMode, inlineCommentMode = props.inlineCommentMode, privateCommentMode = props.privateCommentMode, minimap = props.minimap, persistentCommentMode = props.persistentCommentMode, ghostComments = props.ghostComments, ghostCommentsMessage = props.ghostCommentsMessage, ghostCommentsIndicator = props.ghostCommentsIndicator, commentsOnDom = props.commentsOnDom, commentTool = props.commentTool, sidebarButtonOnCommentDialog = props.sidebarButtonOnCommentDialog, scrollToComponent = props.scrollToComponent, allowedElementIds = props.allowedElementIds, commentAdded = props.commentAdded, onCommentAdd = props.onCommentAdd, onCommentUpdate = props.onCommentUpdate, commentAccepted = props.commentAccepted, onCommentAccept = props.onCommentAccept, commentRejected = props.commentRejected, onCommentReject = props.onCommentReject, onSidebarButtonOnCommentDialogClick = props.onSidebarButtonOnCommentDialogClick, customStatuses = props.customStatuses, customStatus = props.customStatus, customPriorities = props.customPriorities, customPriority = props.customPriority, customCategories = props.customCategories, customCategory = props.customCategory, showStatus = props.showStatus, status = props.status, showResolveButton = props.showResolveButton, resolveButton = props.resolveButton, darkMode = props.darkMode, onCustomPinInject = props.onCustomPinInject, children = props.children;
173
+ var autoCategorize = props.autoCategorize, streamViewContainerId = props.streamViewContainerId, onSignIn = props.onSignIn, onUpgrade = props.onUpgrade, textMode = props.textMode, popoverMode = props.popoverMode, popoverTriangleComponent = props.popoverTriangleComponent, floatingCommentDialog = props.floatingCommentDialog, moderatorMode = props.moderatorMode, streamMode = props.streamMode, signInButton = props.signInButton, upgradeButton = props.upgradeButton, attachments = props.attachments, recordings = props.recordings, reactions = props.reactions, deviceInfo = props.deviceInfo, commentIndex = props.commentIndex, dialogOnHover = props.dialogOnHover, dialogOnTargetElementClick = props.dialogOnTargetElementClick, priority = props.priority, inboxMode = props.inboxMode, suggestionMode = props.suggestionMode, mobileMode = props.mobileMode, inlineCommentMode = props.inlineCommentMode, privateCommentMode = props.privateCommentMode, minimap = props.minimap, persistentCommentMode = props.persistentCommentMode, ghostComments = props.ghostComments, ghostCommentsIndicator = props.ghostCommentsIndicator, commentsOnDom = props.commentsOnDom, commentTool = props.commentTool, sidebarButtonOnCommentDialog = props.sidebarButtonOnCommentDialog, scrollToComponent = props.scrollToComponent, userMentions = props.userMentions, allowedElementIds = props.allowedElementIds, onCommentAdd = props.onCommentAdd, onCommentUpdate = props.onCommentUpdate, onCommentAccept = props.onCommentAccept, onCommentReject = props.onCommentReject, onSidebarButtonOnCommentDialogClick = props.onSidebarButtonOnCommentDialogClick, customStatus = props.customStatus, customPriority = props.customPriority, customCategory = props.customCategory, status = props.status, resolveButton = props.resolveButton, darkMode = props.darkMode, onCustomPinInject = props.onCustomPinInject, children = props.children;
174
174
  var ref = useRef();
175
175
  useEffect(function () {
176
176
  if (ref.current) {
177
177
  var element = ref.current;
178
178
  element.addEventListener('onSignIn', function (event) {
179
- if (signIn) {
180
- signIn(event === null || event === void 0 ? void 0 : event.detail);
181
- }
182
179
  if (onSignIn) {
183
180
  onSignIn(event === null || event === void 0 ? void 0 : event.detail);
184
181
  }
@@ -189,9 +186,6 @@ var SnippylyComments = function (props) {
189
186
  }
190
187
  });
191
188
  element.addEventListener('onCommentAdd', function (event) {
192
- if (commentAdded) {
193
- commentAdded(event === null || event === void 0 ? void 0 : event.detail);
194
- }
195
189
  if (onCommentAdd) {
196
190
  onCommentAdd(event === null || event === void 0 ? void 0 : event.detail);
197
191
  }
@@ -202,17 +196,11 @@ var SnippylyComments = function (props) {
202
196
  }
203
197
  });
204
198
  element.addEventListener('onCommentAccept', function (event) {
205
- if (commentAccepted) {
206
- commentAccepted(event === null || event === void 0 ? void 0 : event.detail);
207
- }
208
199
  if (onCommentAccept) {
209
200
  onCommentAccept(event === null || event === void 0 ? void 0 : event.detail);
210
201
  }
211
202
  });
212
203
  element.addEventListener('onCommentReject', function (event) {
213
- if (commentRejected) {
214
- commentRejected(event === null || event === void 0 ? void 0 : event.detail);
215
- }
216
204
  if (onCommentReject) {
217
205
  onCommentReject(event === null || event === void 0 ? void 0 : event.detail);
218
206
  }
@@ -229,11 +217,11 @@ var SnippylyComments = function (props) {
229
217
  });
230
218
  }
231
219
  }, []);
232
- return (React.createElement("velt-comments", { ref: ref, "auto-categorize": [true, false].includes(autoCategorize) ? (autoCategorize ? 'true' : 'false') : undefined, "data-stream-view-container-id": streamViewContainerId, "pin-highlighter-class": pinHighlighterClass, "text-highlighter-class": textHighlighterClass, "text-mode": [true, false].includes(textMode) ? (textMode ? 'true' : 'false') : undefined, "popover-mode": [true, false].includes(popoverMode) ? (popoverMode ? 'true' : 'false') : undefined, "popover-triangle-component": [true, false].includes(popoverTriangleComponent) ? (popoverTriangleComponent ? 'true' : 'false') : undefined, "floating-comments-mode": [true, false].includes(floatingCommentsMode) ? (floatingCommentsMode ? 'true' : 'false') : undefined, "floating-comment-dialog": [true, false].includes(floatingCommentDialog) ? (floatingCommentDialog ? 'true' : 'false') : undefined, "moderator-mode": [true, false].includes(moderatorMode) ? (moderatorMode ? 'true' : 'false') : undefined, "stream-mode": [true, false].includes(streamMode) ? (streamMode ? 'true' : 'false') : undefined, "sign-in-button": [true, false].includes(signInButton) ? (signInButton ? 'true' : 'false') : undefined, "upgrade-button": [true, false].includes(upgradeButton) ? (upgradeButton ? 'true' : 'false') : undefined, "allow-attachments": [true, false].includes(allowAttachments) ? (allowAttachments ? 'true' : 'false') : undefined, attachments: [true, false].includes(attachments) ? (attachments ? 'true' : 'false') : undefined, recordings: recordings, reactions: [true, false].includes(reactions) ? (reactions ? 'true' : 'false') : undefined, "show-device-info": [true, false].includes(showDeviceInfo) ? (showDeviceInfo ? 'true' : 'false') : undefined, "device-info": [true, false].includes(deviceInfo) ? (deviceInfo ? 'true' : 'false') : undefined, "show-comment-index": [true, false].includes(showCommentIndex) ? (showCommentIndex ? 'true' : 'false') : undefined, "comment-index": [true, false].includes(commentIndex) ? (commentIndex ? 'true' : 'false') : undefined, "dialog-on-hover": [true, false].includes(dialogOnHover) ? (dialogOnHover ? 'true' : 'false') : undefined, "dialog-on-target-element-click": [true, false].includes(dialogOnTargetElementClick) ? (dialogOnTargetElementClick ? 'true' : 'false') : undefined, "show-priority": [true, false].includes(showPriority) ? (showPriority ? 'true' : 'false') : undefined, priority: [true, false].includes(priority) ? (priority ? 'true' : 'false') : undefined, "show-status": [true, false].includes(showStatus) ? (showStatus ? 'true' : 'false') : undefined, status: [true, false].includes(status) ? (status ? 'true' : 'false') : undefined, "show-resolve-button": [true, false].includes(showResolveButton) ? (showResolveButton ? 'true' : 'false') : undefined, "resolve-button": [true, false].includes(resolveButton) ? (resolveButton ? 'true' : 'false') : undefined, "inbox-mode": [true, false].includes(inboxMode) ? (inboxMode ? 'true' : 'false') : undefined, "suggestion-mode": [true, false].includes(suggestionMode) ? (suggestionMode ? 'true' : 'false') : undefined, "mobile-mode": [true, false].includes(mobileMode) ? (mobileMode ? 'true' : 'false') : undefined, "inline-comment-mode": [true, false].includes(inlineCommentMode) ? (inlineCommentMode ? 'true' : 'false') : undefined, "private-comment-mode": [true, false].includes(privateCommentMode) ? (privateCommentMode ? 'true' : 'false') : undefined, minimap: [true, false].includes(minimap) ? (minimap ? 'true' : 'false') : undefined, "persistent-comment-mode": [true, false].includes(persistentCommentMode) ? (persistentCommentMode ? 'true' : 'false') : undefined, "ghost-comments": [true, false].includes(ghostComments) ? (ghostComments ? 'true' : 'false') : undefined, "ghost-comments-message": [true, false].includes(ghostCommentsMessage) ? (ghostCommentsMessage ? 'true' : 'false') : undefined, "ghost-comments-indicator": [true, false].includes(ghostCommentsIndicator) ? (ghostCommentsIndicator ? 'true' : 'false') : undefined, "comments-on-dom": [true, false].includes(commentsOnDom) ? (commentsOnDom ? 'true' : 'false') : undefined, "comment-tool": [true, false].includes(commentTool) ? (commentTool ? 'true' : 'false') : undefined, "sidebar-button-on-comment-dialog": [true, false].includes(sidebarButtonOnCommentDialog) ? (sidebarButtonOnCommentDialog ? 'true' : 'false') : undefined, "scroll-to-component": [true, false].includes(scrollToComponent) ? (scrollToComponent ? 'true' : 'false') : undefined, "allowed-element-ids": JSON.stringify(allowedElementIds), "custom-statuses": JSON.stringify(customStatuses), "custom-status": JSON.stringify(customStatus), "custom-priorities": JSON.stringify(customPriorities), "custom-priority": JSON.stringify(customPriority), "custom-categories": JSON.stringify(customCategories), "custom-category": JSON.stringify(customCategory), "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined }, children));
220
+ return (React.createElement("velt-comments", { ref: ref, "auto-categorize": [true, false].includes(autoCategorize) ? (autoCategorize ? 'true' : 'false') : undefined, "data-stream-view-container-id": streamViewContainerId, "text-mode": [true, false].includes(textMode) ? (textMode ? 'true' : 'false') : undefined, "popover-mode": [true, false].includes(popoverMode) ? (popoverMode ? 'true' : 'false') : undefined, "popover-triangle-component": [true, false].includes(popoverTriangleComponent) ? (popoverTriangleComponent ? 'true' : 'false') : undefined, "floating-comment-dialog": [true, false].includes(floatingCommentDialog) ? (floatingCommentDialog ? 'true' : 'false') : undefined, "moderator-mode": [true, false].includes(moderatorMode) ? (moderatorMode ? 'true' : 'false') : undefined, "stream-mode": [true, false].includes(streamMode) ? (streamMode ? 'true' : 'false') : undefined, "sign-in-button": [true, false].includes(signInButton) ? (signInButton ? 'true' : 'false') : undefined, "upgrade-button": [true, false].includes(upgradeButton) ? (upgradeButton ? 'true' : 'false') : undefined, attachments: [true, false].includes(attachments) ? (attachments ? 'true' : 'false') : undefined, recordings: recordings, reactions: [true, false].includes(reactions) ? (reactions ? 'true' : 'false') : undefined, "device-info": [true, false].includes(deviceInfo) ? (deviceInfo ? 'true' : 'false') : undefined, "comment-index": [true, false].includes(commentIndex) ? (commentIndex ? 'true' : 'false') : undefined, "dialog-on-hover": [true, false].includes(dialogOnHover) ? (dialogOnHover ? 'true' : 'false') : undefined, "dialog-on-target-element-click": [true, false].includes(dialogOnTargetElementClick) ? (dialogOnTargetElementClick ? 'true' : 'false') : undefined, priority: [true, false].includes(priority) ? (priority ? 'true' : 'false') : undefined, status: [true, false].includes(status) ? (status ? 'true' : 'false') : undefined, "resolve-button": [true, false].includes(resolveButton) ? (resolveButton ? 'true' : 'false') : undefined, "inbox-mode": [true, false].includes(inboxMode) ? (inboxMode ? 'true' : 'false') : undefined, "suggestion-mode": [true, false].includes(suggestionMode) ? (suggestionMode ? 'true' : 'false') : undefined, "mobile-mode": [true, false].includes(mobileMode) ? (mobileMode ? 'true' : 'false') : undefined, "inline-comment-mode": [true, false].includes(inlineCommentMode) ? (inlineCommentMode ? 'true' : 'false') : undefined, "private-comment-mode": [true, false].includes(privateCommentMode) ? (privateCommentMode ? 'true' : 'false') : undefined, minimap: [true, false].includes(minimap) ? (minimap ? 'true' : 'false') : undefined, "persistent-comment-mode": [true, false].includes(persistentCommentMode) ? (persistentCommentMode ? 'true' : 'false') : undefined, "ghost-comments": [true, false].includes(ghostComments) ? (ghostComments ? 'true' : 'false') : undefined, "ghost-comments-indicator": [true, false].includes(ghostCommentsIndicator) ? (ghostCommentsIndicator ? 'true' : 'false') : undefined, "comments-on-dom": [true, false].includes(commentsOnDom) ? (commentsOnDom ? 'true' : 'false') : undefined, "comment-tool": [true, false].includes(commentTool) ? (commentTool ? 'true' : 'false') : undefined, "sidebar-button-on-comment-dialog": [true, false].includes(sidebarButtonOnCommentDialog) ? (sidebarButtonOnCommentDialog ? 'true' : 'false') : undefined, "scroll-to-component": [true, false].includes(scrollToComponent) ? (scrollToComponent ? 'true' : 'false') : undefined, "user-mentions": [true, false].includes(userMentions) ? (userMentions ? 'true' : 'false') : undefined, "allowed-element-ids": JSON.stringify(allowedElementIds), "custom-status": JSON.stringify(customStatus), "custom-priority": JSON.stringify(customPriority), "custom-category": JSON.stringify(customCategory), "dark-mode": [true, false].includes(darkMode) ? (darkMode ? 'true' : 'false') : undefined }, children));
233
221
  };
234
222
 
235
223
  var SnippylyCommentsSidebar = function (props) {
236
- var embedMode = props.embedMode, enableUrlNavigation = props.enableUrlNavigation, urlNavigation = props.urlNavigation, pageMode = props.pageMode, currentLocationSuffix = props.currentLocationSuffix, openSidebar = props.openSidebar, onSidebarOpen = props.onSidebarOpen, onSidebarCommentClick = props.onSidebarCommentClick, onCommentClick = props.onCommentClick;
224
+ var embedMode = props.embedMode, enableUrlNavigation = props.enableUrlNavigation, urlNavigation = props.urlNavigation, pageMode = props.pageMode, currentLocationSuffix = props.currentLocationSuffix, filterConfig = props.filterConfig, groupConfig = props.groupConfig, filters = props.filters, openSidebar = props.openSidebar, onSidebarOpen = props.onSidebarOpen, onSidebarCommentClick = props.onSidebarCommentClick, onCommentClick = props.onCommentClick;
237
225
  var ref = useRef();
238
226
  useEffect(function () {
239
227
  if (ref.current) {
@@ -256,7 +244,7 @@ var SnippylyCommentsSidebar = function (props) {
256
244
  });
257
245
  }
258
246
  }, []);
259
- return (React.createElement("velt-comments-sidebar", { ref: ref, "embed-mode": [true, false].includes(embedMode) ? (embedMode ? 'true' : 'false') : undefined, "enable-url-navigation": [true, false].includes(enableUrlNavigation) ? (enableUrlNavigation ? 'true' : 'false') : undefined, "url-navigation": [true, false].includes(urlNavigation) ? (urlNavigation ? 'true' : 'false') : undefined, "page-mode": [true, false].includes(pageMode) ? (pageMode ? 'true' : 'false') : undefined, "current-location-suffix": [true, false].includes(currentLocationSuffix) ? (currentLocationSuffix ? 'true' : 'false') : undefined }));
247
+ return (React.createElement("velt-comments-sidebar", { ref: ref, "embed-mode": [true, false].includes(embedMode) ? (embedMode ? 'true' : 'false') : undefined, "enable-url-navigation": [true, false].includes(enableUrlNavigation) ? (enableUrlNavigation ? 'true' : 'false') : undefined, "url-navigation": [true, false].includes(urlNavigation) ? (urlNavigation ? 'true' : 'false') : undefined, "page-mode": [true, false].includes(pageMode) ? (pageMode ? 'true' : 'false') : undefined, "current-location-suffix": [true, false].includes(currentLocationSuffix) ? (currentLocationSuffix ? 'true' : 'false') : undefined, "filter-config": filterConfig ? JSON.stringify(filterConfig) : undefined, "group-config": groupConfig ? JSON.stringify(groupConfig) : undefined, filters: filters ? JSON.stringify(filters) : undefined }));
260
248
  };
261
249
 
262
250
  var SnippylyCommentTool = function (props) {