@rh-support/components 2.6.46 → 2.6.49

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 (11) hide show
  1. package/lib/esm/Functional/CaseContactsSelectorExternal.d.ts +2 -0
  2. package/lib/esm/Functional/CaseContactsSelectorExternal.d.ts.map +1 -1
  3. package/lib/esm/Functional/CaseContactsSelectorExternal.js +71 -14
  4. package/lib/esm/OwnerTypeaheadDropdown/OwnerTypeaheadDropdown.d.ts +2 -0
  5. package/lib/esm/OwnerTypeaheadDropdown/OwnerTypeaheadDropdown.d.ts.map +1 -1
  6. package/lib/esm/OwnerTypeaheadDropdown/OwnerTypeaheadDropdown.js +8 -2
  7. package/lib/esm/TypeaheadDropdown/TypeaheadDropdown.d.ts +4 -0
  8. package/lib/esm/TypeaheadDropdown/TypeaheadDropdown.d.ts.map +1 -1
  9. package/lib/esm/TypeaheadDropdown/TypeaheadDropdown.js +20 -5
  10. package/lib/esm/index.js +1 -1
  11. package/package.json +5 -5
package/lib/esm/Functional/CaseContactsSelectorExternal.d.ts CHANGED
@@ -27,9 +27,11 @@ interface IProps extends IDClassNameProps {
27
27
  allowCustomEmailAdd?: boolean;
28
28
  isInvalid?: boolean;
29
29
  groupContactsAndEmails?: boolean;
30
+ maxSelections?: number;
30
31
  onNew?: (query: string) => void;
31
32
  canAddNew?: (options: ITypeaheadDropdownGroupOrOption[], query: string) => boolean;
32
33
  getCreateNewText?: (query: string) => string;
34
+ noOptionsFoundMessage?: string | ((filter: string) => string);
33
35
  onContactEnriched?: (contact: IContact) => void;
34
36
  contactFilter?: (contact: IContact) => boolean;
35
37
  }
package/lib/esm/Functional/CaseContactsSelectorExternal.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"CaseContactsSelectorExternal.d.ts","sourceRoot":"","sources":["../../../src/Functional/CaseContactsSelectorExternal.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yCAAyC,CAAC;AACxF,OAAO,EAAE,0BAA0B,EAAE,MAAM,qCAAqC,CAAC;AACjF,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAClE,OAAO,EAAuB,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AACjF,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAexD,OAAO,KAA4D,MAAM,OAAO,CAAC;AAGjF,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AAEzF,MAAM,MAAM,oBAAoB,GAAG,QAAQ,GAAG,0BAA0B,CAAC;AACzE,UAAU,MAAO,SAAQ,gBAAgB;IACrC,qBAAqB,EAAE,MAAM,CAAC;IAC9B,6GAA6G;IAC7G,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,QAAQ,EAAE,CAAC,QAAQ,GAAG,0BAA0B,CAAC,EAAE,CAAC;IACpD,QAAQ,EAAE,CAAC,gBAAgB,EAAE,CAAC,QAAQ,GAAG,0BAA0B,CAAC,EAAE,KAAK,IAAI,CAAC;IAChF,kBAAkB,EAAE,QAAQ,CAAC;IAC7B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,QAAQ,EAAE,CAAC;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,MAAM,KAAA,EAAE,KAAK,KAAA,EAAE,GAAG,KAAA,KAAK,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAC/D,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,YAAY,CAAC,EAAE,6BAA6B,EAAE,CAAC;IAC/C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IAEjC,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,+BAA+B,EAAE,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;IACnF,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC7C,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,KAAK,IAAI,CAAC;IAChD,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,KAAK,OAAO,CAAC;CAClD;AAED,eAAO,MAAM,kBAAkB,KAAK,CAAC;AAErC,eAAO,MAAM,uBAAuB,QAAyB,CAAC;AAE9D,eAAO,MAAM,oBAAoB,GAAI,MAAM,oBAAoB,KAAG,IAAI,IAAI,0BAEzE,CAAC;AAMF,QAAA,MAAM,oBAAoB,GAAI,MAAM,oBAAoB,KAAG,MAa1D,CAAC;AAEF,iBAAS,4BAA4B,CAAC,KAAK,EAAE,MAAM,qBA+UlD;AAED,OAAO,EAAE,4BAA4B,EAAE,oBAAoB,EAAE,CAAC"}
1
+ {"version":3,"file":"CaseContactsSelectorExternal.d.ts","sourceRoot":"","sources":["../../../src/Functional/CaseContactsSelectorExternal.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,6BAA6B,EAAE,MAAM,yCAAyC,CAAC;AACxF,OAAO,EAAE,0BAA0B,EAAE,MAAM,qCAAqC,CAAC;AACjF,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAElE,OAAO,EAAuB,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AACjF,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAgBxD,OAAO,KAA4D,MAAM,OAAO,CAAC;AAIjF,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AAEzF,MAAM,MAAM,oBAAoB,GAAG,QAAQ,GAAG,0BAA0B,CAAC;AACzE,UAAU,MAAO,SAAQ,gBAAgB;IACrC,qBAAqB,EAAE,MAAM,CAAC;IAC9B,6GAA6G;IAC7G,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,QAAQ,EAAE,CAAC,QAAQ,GAAG,0BAA0B,CAAC,EAAE,CAAC;IACpD,QAAQ,EAAE,CAAC,gBAAgB,EAAE,CAAC,QAAQ,GAAG,0BAA0B,CAAC,EAAE,KAAK,IAAI,CAAC;IAChF,kBAAkB,EAAE,QAAQ,CAAC;IAC7B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,QAAQ,EAAE,CAAC;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,MAAM,KAAA,EAAE,KAAK,KAAA,EAAE,GAAG,KAAA,KAAK,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAC/D,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,YAAY,CAAC,EAAE,6BAA6B,EAAE,CAAC;IAC/C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,+BAA+B,EAAE,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;IACnF,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC7C,qBAAqB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC;IAC9D,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,KAAK,IAAI,CAAC;IAChD,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,KAAK,OAAO,CAAC;CAClD;AAED,eAAO,MAAM,kBAAkB,KAAK,CAAC;AAErC,eAAO,MAAM,uBAAuB,QAAyB,CAAC;AAE9D,eAAO,MAAM,oBAAoB,GAAI,MAAM,oBAAoB,KAAG,IAAI,IAAI,0BAEzE,CAAC;AAMF,QAAA,MAAM,oBAAoB,GAAI,MAAM,oBAAoB,KAAG,MAa1D,CAAC;AAEF,iBAAS,4BAA4B,CAAC,KAAK,EAAE,MAAM,qBAyZlD;AAED,OAAO,EAAE,4BAA4B,EAAE,oBAAoB,EAAE,CAAC"}
package/lib/esm/Functional/CaseContactsSelectorExternal.js CHANGED
@@ -8,15 +8,18 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
8
8
  });
9
9
  };
10
10
  import { useApolloClient } from '@apollo/client/react';
11
+ import { Alert, AlertVariant, Button, ButtonVariant, Skeleton } from '@patternfly/react-core';
11
12
  import { buildAccountWhereForContacts, GET_ACCOUNT_CONTACTS, getApiResourceObject, isEmailValid, } from '@rh-support/utils';
12
13
  import debounce from 'lodash/debounce';
13
14
  import differenceBy from 'lodash/differenceBy';
14
15
  import filter from 'lodash/filter';
15
16
  import isArray from 'lodash/isArray';
16
17
  import isEmpty from 'lodash/isEmpty';
18
+ import isNumber from 'lodash/isNumber';
17
19
  import map from 'lodash/map';
18
20
  import sortBy from 'lodash/sortBy';
19
21
  import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
22
+ import { useTranslation } from 'react-i18next';
20
23
  import { OwnerTypeaheadDropdown } from '../OwnerTypeaheadDropdown';
21
24
  export const CONTACTS_PAGE_SIZE = 10;
22
25
  export const DEFAULT_CONTACTS_OFFSET = CONTACTS_PAGE_SIZE - 1;
@@ -42,6 +45,8 @@ const getHydraContactLabel = (user) => {
42
45
  return label ? label : '';
43
46
  };
44
47
  function CaseContactsSelectorExternal(props) {
48
+ var _a;
49
+ const { t } = useTranslation();
45
50
  const apolloClient = useApolloClient();
46
51
  const { customEmails, contactSsoUsername, isInvalid, groupContactsAndEmails, selected } = props;
47
52
  const [filteredContacts, setFilteredContacts] = useState([]);
@@ -49,21 +54,24 @@ function CaseContactsSelectorExternal(props) {
49
54
  const [hasNextPage, setHasNextPage] = useState(false);
50
55
  const [endCursor, setEndCursor] = useState(null);
51
56
  const [isLoadingMore, setIsLoadingMore] = useState(false);
57
+ const [hasCompletedInitialLoad, setHasCompletedInitialLoad] = useState(false);
58
+ const showContactsLoadStates = !!props.multiple || isNumber(props.maxSelections);
52
59
  const mapContactEdges = (edges, accountNumber) => edges
53
60
  .filter(({ node }) => { var _a; return (_a = node.SSOUserName__c) === null || _a === void 0 ? void 0 : _a.value; })
54
61
  .map(({ node }) => {
55
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
62
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
56
63
  return ({
57
64
  id: node.Id,
58
65
  ssoUsername: node.SSOUserName__c.value,
59
66
  firstName: (_b = (_a = node.FirstName) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '',
60
67
  lastName: (_d = (_c = node.LastName) === null || _c === void 0 ? void 0 : _c.value) !== null && _d !== void 0 ? _d : '',
61
68
  fullNameCustom: (_f = (_e = node.Name) === null || _e === void 0 ? void 0 : _e.value) !== null && _f !== void 0 ? _f : '',
62
- manageSupportCases: (_h = (_g = node.ManageSupportCases__c) === null || _g === void 0 ? void 0 : _g.value) !== null && _h !== void 0 ? _h : true,
63
- isInternal: (_k = (_j = node.IsInternal__c) === null || _j === void 0 ? void 0 : _j.value) !== null && _k !== void 0 ? _k : false,
64
- isOrgAdmin: (_m = (_l = node.IsOrgAdmin__c) === null || _l === void 0 ? void 0 : _l.value) !== null && _m !== void 0 ? _m : false,
65
- phone: (_p = (_o = node.Phone) === null || _o === void 0 ? void 0 : _o.value) !== null && _p !== void 0 ? _p : '',
66
- defaultCaseGroup: (_r = (_q = node.DefaultCaseGroup__c) === null || _q === void 0 ? void 0 : _q.value) !== null && _r !== void 0 ? _r : null,
69
+ email: (_h = (_g = node.Email) === null || _g === void 0 ? void 0 : _g.value) !== null && _h !== void 0 ? _h : '',
70
+ manageSupportCases: (_k = (_j = node.ManageSupportCases__c) === null || _j === void 0 ? void 0 : _j.value) !== null && _k !== void 0 ? _k : true,
71
+ isInternal: (_m = (_l = node.IsInternal__c) === null || _l === void 0 ? void 0 : _l.value) !== null && _m !== void 0 ? _m : false,
72
+ isOrgAdmin: (_p = (_o = node.IsOrgAdmin__c) === null || _o === void 0 ? void 0 : _o.value) !== null && _p !== void 0 ? _p : false,
73
+ phone: (_r = (_q = node.Phone) === null || _q === void 0 ? void 0 : _q.value) !== null && _r !== void 0 ? _r : '',
74
+ defaultCaseGroup: (_t = (_s = node.DefaultCaseGroup__c) === null || _s === void 0 ? void 0 : _s.value) !== null && _t !== void 0 ? _t : null,
67
75
  accountNumber,
68
76
  });
69
77
  });
@@ -76,7 +84,7 @@ function CaseContactsSelectorExternal(props) {
76
84
  and: [
77
85
  base,
78
86
  {
79
- or: [{ Name: { like: term } }, { SSOUserName__c: { like: term } }],
87
+ or: [{ Name: { like: term } }, { SSOUserName__c: { like: term } }, { Email: { like: term } }],
80
88
  },
81
89
  ],
82
90
  };
@@ -128,8 +136,10 @@ function CaseContactsSelectorExternal(props) {
128
136
  setEndCursor(pageInfo.endCursor);
129
137
  }
130
138
  }
131
- catch (_a) {
132
- setContactList(getApiResourceObject([]));
139
+ catch (e) {
140
+ if (currentSearchQuery.current === query) {
141
+ setContactList(getApiResourceObject([], false, true, e === null || e === void 0 ? void 0 : e.message));
142
+ }
133
143
  }
134
144
  });
135
145
  // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -139,6 +149,22 @@ function CaseContactsSelectorExternal(props) {
139
149
  debouncedSearch.cancel();
140
150
  searchContacts('');
141
151
  };
152
+ const loadAccountContacts = () => __awaiter(this, void 0, void 0, function* () {
153
+ setContactList(getApiResourceObject([], true));
154
+ setHasNextPage(false);
155
+ setEndCursor(null);
156
+ try {
157
+ const { contacts, pageInfo } = yield fetchContactsPage();
158
+ setContactList(getApiResourceObject(contacts));
159
+ setHasNextPage(pageInfo.hasNextPage);
160
+ setEndCursor(pageInfo.endCursor);
161
+ setHasCompletedInitialLoad(true);
162
+ }
163
+ catch (e) {
164
+ setContactList(getApiResourceObject([], false, true, e === null || e === void 0 ? void 0 : e.message));
165
+ setHasCompletedInitialLoad(true);
166
+ }
167
+ });
142
168
  useEffect(() => {
143
169
  const { selectedAccountNumber, loggedInUserRights, isExportingPDF } = props;
144
170
  const isNonOrgAdminSameAccount = loggedInUserRights.isExternal() && loggedInUserRights.isNonOrgAdminWithSameAccount(selectedAccountNumber);
@@ -146,6 +172,7 @@ function CaseContactsSelectorExternal(props) {
146
172
  return;
147
173
  }
148
174
  let cancelled = false;
175
+ setHasCompletedInitialLoad(false);
149
176
  const fetchAccountContacts = () => __awaiter(this, void 0, void 0, function* () {
150
177
  setContactList(getApiResourceObject([], true));
151
178
  try {
@@ -154,11 +181,13 @@ function CaseContactsSelectorExternal(props) {
154
181
  setContactList(getApiResourceObject(contacts));
155
182
  setHasNextPage(pageInfo.hasNextPage);
156
183
  setEndCursor(pageInfo.endCursor);
184
+ setHasCompletedInitialLoad(true);
157
185
  }
158
186
  }
159
187
  catch (e) {
160
188
  if (!cancelled) {
161
189
  setContactList(getApiResourceObject([], false, true, e.message));
190
+ setHasCompletedInitialLoad(true);
162
191
  }
163
192
  }
164
193
  });
@@ -169,6 +198,8 @@ function CaseContactsSelectorExternal(props) {
169
198
  // eslint-disable-next-line react-hooks/exhaustive-deps
170
199
  }, [apolloClient, props.selectedAccountNumber, props.salesforceAccountId, props.isExportingPDF]);
171
200
  useEffect(() => {
201
+ if (props.multiple)
202
+ return;
172
203
  if (contactList.isFetching || isEmpty(contactList.data) || isEmpty(selected))
173
204
  return;
174
205
  const currentOwner = selected[0];
@@ -185,7 +216,7 @@ function CaseContactsSelectorExternal(props) {
185
216
  : props.onChange && props.onChange([matchedContact]);
186
217
  }
187
218
  // eslint-disable-next-line react-hooks/exhaustive-deps
188
- }, [contactList.data, contactList.isFetching]);
219
+ }, [contactList.data, contactList.isFetching, props.multiple]);
189
220
  const displayedContacts = useMemo(() => {
190
221
  var _a;
191
222
  let contacts = (_a = contactList.data) !== null && _a !== void 0 ? _a : [];
@@ -215,8 +246,11 @@ function CaseContactsSelectorExternal(props) {
215
246
  };
216
247
  const isNonOrgAdminSameAccountDisabled = props.loggedInUserRights.isExternal() &&
217
248
  props.loggedInUserRights.isNonOrgAdminWithSameAccount(props.selectedAccountNumber);
218
- const isDisabled = isNonOrgAdminSameAccountDisabled || props.isUpdating || contactList.isFetching || props.isDisabled;
219
- const isLoading = props.isUpdating || contactList.isFetching;
249
+ const isDisabled = isNonOrgAdminSameAccountDisabled ||
250
+ props.isUpdating ||
251
+ props.isDisabled ||
252
+ (!showContactsLoadStates && contactList.isFetching);
253
+ const isOverMaxSelections = !!props.maxSelections && ((_a = selected === null || selected === void 0 ? void 0 : selected.length) !== null && _a !== void 0 ? _a : 0) > props.maxSelections;
220
254
  const getCustomEmails = useCallback(() => {
221
255
  return sortBy((customEmails || []).map((item) => (Object.assign(Object.assign({}, item), { ssoUsername: item.emailAddress, firstName: item.emailAddress, lastName: item.emailAddress }))), 'emailAddress');
222
256
  }, [customEmails]);
@@ -253,7 +287,17 @@ function CaseContactsSelectorExternal(props) {
253
287
  setFilteredContacts(allOptions);
254
288
  return;
255
289
  }
256
- const localFiltered = filter(allOptions, (option) => getHydraContactLabel(option.contact).toLowerCase().includes(query.toLowerCase()));
290
+ const term = query.toLowerCase();
291
+ const localFiltered = filter(allOptions, (option) => {
292
+ const contact = option.contact;
293
+ const label = getHydraContactLabel(contact).toLowerCase();
294
+ const email = (contact.email || '').toLowerCase();
295
+ const name = (contact.fullNameCustom || `${contact.firstName || ''} ${contact.lastName || ''}`)
296
+ .trim()
297
+ .toLowerCase();
298
+ const sso = (contact.ssoUsername || '').toLowerCase();
299
+ return label.includes(term) || email.includes(term) || name.includes(term) || sso.includes(term);
300
+ });
257
301
  setFilteredContacts(localFiltered);
258
302
  debouncedSearch(query);
259
303
  };
@@ -294,6 +338,19 @@ function CaseContactsSelectorExternal(props) {
294
338
  useEffect(() => {
295
339
  setFilteredContacts(allOptions);
296
340
  }, [displayedContacts, customEmails, allOptions, selected]);
297
- return (React.createElement(OwnerTypeaheadDropdown, { id: props.id || '', hasClearButton: true, multiple: !!props.multiple, contactSsoUsername: contactSsoUsername, groupContactsAndEmails: groupContactsAndEmails, selected: !isEmpty(props.selected) ? props.selected : [], options: filteredContacts, placeholder: props.placeholder || 'Search by name or username', "data-tracking-id": "external-case-contact-selector", isDisabled: isDisabled, status: isInvalid ? 'danger' : undefined, onChipRemoved: onChipRemoved, onClearQuery: onClearQuery, onOpenChange: onDropdownOpenChange, onQueryUpdated: onQueryUpdated, onSelect: onCustomerContactSelect, canAddNew: canAddNew, getCreateNewText: props === null || props === void 0 ? void 0 : props.getCreateNewText, isLoading: isLoading || isLoadingMore, onHandleLoadMore: loadMoreContacts, isShowMoreOptionVisible: hasNextPage }));
341
+ // Initial-load skeleton only (not every debounced search) — matches the design placeholder under the field.
342
+ const showLoadingSkeleton = showContactsLoadStates &&
343
+ contactList.isFetching &&
344
+ !isLoadingMore &&
345
+ !contactList.isError &&
346
+ !hasCompletedInitialLoad;
347
+ const showLoadError = showContactsLoadStates && contactList.isError && !contactList.isFetching;
348
+ return (React.createElement(React.Fragment, null,
349
+ React.createElement(OwnerTypeaheadDropdown, { id: props.id || '', hasClearButton: true, multiple: !!props.multiple, contactSsoUsername: contactSsoUsername, groupContactsAndEmails: groupContactsAndEmails, selected: !isEmpty(props.selected) ? props.selected : [], options: filteredContacts, placeholder: props.placeholder || 'Search by name or username', "data-tracking-id": "external-case-contact-selector", isDisabled: isDisabled, status: isInvalid || isOverMaxSelections || showLoadError ? 'danger' : undefined, maxSelections: props.maxSelections, onChipRemoved: onChipRemoved, onClearQuery: onClearQuery, onOpenChange: onDropdownOpenChange, onQueryUpdated: onQueryUpdated, onSelect: onCustomerContactSelect, canAddNew: canAddNew, getCreateNewText: props === null || props === void 0 ? void 0 : props.getCreateNewText, noOptionsFoundMessage: props.noOptionsFoundMessage, isLoading: props.isUpdating || isLoadingMore || (!showContactsLoadStates && contactList.isFetching), onHandleLoadMore: loadMoreContacts, isShowMoreOptionVisible: hasNextPage }),
350
+ showLoadingSkeleton && (React.createElement(Skeleton, { height: "5rem", width: "100%", className: "pf-v6-u-mt-sm", screenreaderText: t('Loading contacts') })),
351
+ showLoadError && (React.createElement(Alert, { className: "non-bold-alert pf-v6-u-mt-sm", isInline: true, variant: AlertVariant.danger, component: "span", title: React.createElement(React.Fragment, null,
352
+ t("We couldn't load contacts."),
353
+ ' ',
354
+ React.createElement(Button, { variant: ButtonVariant.link, isInline: true, onClick: loadAccountContacts }, t('Try again.'))) }))));
298
355
  }
299
356
  export { CaseContactsSelectorExternal, getHydraContactLabel };
package/lib/esm/OwnerTypeaheadDropdown/OwnerTypeaheadDropdown.d.ts CHANGED
@@ -7,6 +7,8 @@ export interface IOwnerSelectorProps extends IOwnerSelectorExtends {
7
7
  options: IOwnerOption[];
8
8
  contactSsoUsername: string;
9
9
  groupContactsAndEmails?: boolean;
10
+ /** Chips beyond this count are marked invalid (red). */
11
+ maxSelections?: number;
10
12
  onSelect: (contacts: IContact[]) => void;
11
13
  onChipRemoved?: (contact: IContact) => void;
12
14
  isLoading?: boolean;
package/lib/esm/OwnerTypeaheadDropdown/OwnerTypeaheadDropdown.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"OwnerTypeaheadDropdown.d.ts","sourceRoot":"","sources":["../../../src/OwnerTypeaheadDropdown/OwnerTypeaheadDropdown.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAKlE,OAAO,KAAkB,MAAM,OAAO,CAAC;AAKvC,OAAO,EAGH,uBAAuB,EAE1B,MAAM,wCAAwC,CAAC;AAGhD,MAAM,MAAM,qBAAqB,GAAG,IAAI,CACpC,uBAAuB,EACvB,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,kBAAkB,GAAG,yBAAyB,GAAG,eAAe,GAAG,OAAO,CACnH,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,qBAAqB;IAC9D,QAAQ,EAAE,QAAQ,EAAE,CAAC;IACrB,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,QAAQ,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,IAAI,CAAC;IACzC,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IACxC,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACrC;AAED,MAAM,WAAW,YAAY;IACzB,OAAO,EAAE,QAAQ,CAAC;IAClB,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B;AAcD,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,mBAAmB,qBAkIhE"}
1
+ {"version":3,"file":"OwnerTypeaheadDropdown.d.ts","sourceRoot":"","sources":["../../../src/OwnerTypeaheadDropdown/OwnerTypeaheadDropdown.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAMlE,OAAO,KAAkB,MAAM,OAAO,CAAC;AAKvC,OAAO,EAGH,uBAAuB,EAE1B,MAAM,wCAAwC,CAAC;AAGhD,MAAM,MAAM,qBAAqB,GAAG,IAAI,CACpC,uBAAuB,EACvB,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,kBAAkB,GAAG,yBAAyB,GAAG,eAAe,GAAG,OAAO,CACnH,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,qBAAqB;IAC9D,QAAQ,EAAE,QAAQ,EAAE,CAAC;IACrB,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,wDAAwD;IACxD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,IAAI,CAAC;IACzC,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IACxC,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACrC;AAED,MAAM,WAAW,YAAY;IACzB,OAAO,EAAE,QAAQ,CAAC;IAClB,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B;AAcD,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,mBAAmB,qBAsIhE"}
package/lib/esm/OwnerTypeaheadDropdown/OwnerTypeaheadDropdown.js CHANGED
@@ -12,6 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
12
12
  import filter from 'lodash/filter';
13
13
  import find from 'lodash/find';
14
14
  import isEmpty from 'lodash/isEmpty';
15
+ import isNumber from 'lodash/isNumber';
15
16
  import map from 'lodash/map';
16
17
  import React, { useMemo } from 'react';
17
18
  import { useTranslation } from 'react-i18next';
@@ -28,8 +29,13 @@ function getTypeaheadOptionsFromContacts(contacts, caseContactSsoUsername) {
28
29
  }
29
30
  export function OwnerTypeaheadDropdown(props) {
30
31
  var _a;
31
- const { contactSsoUsername, groupContactsAndEmails, options, selected, onSelect, onToggleClosed, onChipRemoved } = props, restProps = __rest(props, ["contactSsoUsername", "groupContactsAndEmails", "options", "selected", "onSelect", "onToggleClosed", "onChipRemoved"]);
32
- const selectedTypeaheadOptions = useMemo(() => getTypeaheadOptionsFromContacts(selected, contactSsoUsername), [selected, contactSsoUsername]);
32
+ const { contactSsoUsername, groupContactsAndEmails, options, selected, onSelect, onToggleClosed, onChipRemoved, maxSelections } = props, restProps = __rest(props, ["contactSsoUsername", "groupContactsAndEmails", "options", "selected", "onSelect", "onToggleClosed", "onChipRemoved", "maxSelections"]);
33
+ const selectedTypeaheadOptions = useMemo(() => {
34
+ const optionsFromContacts = getTypeaheadOptionsFromContacts(selected, contactSsoUsername);
35
+ if (!isNumber(maxSelections))
36
+ return optionsFromContacts;
37
+ return optionsFromContacts.map((option, index) => index >= maxSelections ? Object.assign(Object.assign({}, option), { color: 'red', variant: 'filled' }) : option);
38
+ }, [selected, contactSsoUsername, maxSelections]);
33
39
  const { t } = useTranslation();
34
40
  const { visibleItems, hasMoreItems: hasMoreItemsLocal, onHandleLoadMore: onHandleLoadMoreLocal, resetVisibleItems, } = useProgressiveLoading(options, PAGE_SIZE);
35
41
  const useServerPagination = !!props.onHandleLoadMore;
package/lib/esm/TypeaheadDropdown/TypeaheadDropdown.d.ts CHANGED
@@ -25,12 +25,15 @@ export interface ITypeaheadDropdownProps {
25
25
  onNew?: (query: string) => void;
26
26
  canAddNew?: (options: ITypeaheadDropdownGroupOrOption[], query: string) => boolean;
27
27
  getCreateNewText?: (query: string) => string;
28
+ noOptionsFoundMessage?: string | ((filter: string) => string);
28
29
  }
29
30
  export interface ITypeaheadDropdownOption {
30
31
  value: any;
31
32
  label: string;
32
33
  group?: string;
33
34
  disableDelete?: boolean;
35
+ color?: LabelProps['color'];
36
+ variant?: LabelProps['variant'];
34
37
  }
35
38
  export interface ITypeaheadDropdownGroup {
36
39
  groupLabel: string;
@@ -39,5 +42,6 @@ export interface ITypeaheadDropdownGroup {
39
42
  export type ITypeaheadDropdownGroupOrOption = ITypeaheadDropdownOption | ITypeaheadDropdownGroup;
40
43
  export declare const VIEW_MORE_OPTION_VALUE = "view-more-option-value";
41
44
  export declare const ADD_NEW_OPTION_VALUE = "new-option-value";
45
+ export declare const NO_RESULTS_OPTION_VALUE = "no-results-option-value";
42
46
  export declare function TypeaheadDropdown(props: ITypeaheadDropdownProps): React.JSX.Element;
43
47
  //# sourceMappingURL=TypeaheadDropdown.d.ts.map
package/lib/esm/TypeaheadDropdown/TypeaheadDropdown.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TypeaheadDropdown.d.ts","sourceRoot":"","sources":["../../../src/TypeaheadDropdown/TypeaheadDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIH,UAAU,EAWb,MAAM,wBAAwB,CAAC;AAOhC,OAAO,KAAsC,MAAM,OAAO,CAAC;AAM3D,MAAM,WAAW,uBAAuB;IACpC,QAAQ,EAAE,wBAAwB,EAAE,CAAC;IACrC,OAAO,EAAE,+BAA+B,EAAE,CAAC;IAC3C,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;IACtD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAE5B,QAAQ,EAAE,CAAC,OAAO,EAAE,wBAAwB,EAAE,KAAK,IAAI,CAAC;IACxD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC3D,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,wBAAwB,KAAK,IAAI,CAAC;IAC3D,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IACxC,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,+BAA+B,EAAE,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;IACnF,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CAChD;AAED,MAAM,WAAW,wBAAwB;IACrC,KAAK,EAAE,GAAG,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,uBAAuB;IACpC,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,wBAAwB,EAAE,CAAC;CACvC;AAED,MAAM,MAAM,+BAA+B,GAAG,wBAAwB,GAAG,uBAAuB,CAAC;AACjG,eAAO,MAAM,sBAAsB,2BAA2B,CAAC;AAC/D,eAAO,MAAM,oBAAoB,qBAAqB,CAAC;AA2BvD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,uBAAuB,qBA6V/D"}
1
+ {"version":3,"file":"TypeaheadDropdown.d.ts","sourceRoot":"","sources":["../../../src/TypeaheadDropdown/TypeaheadDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIH,UAAU,EAWb,MAAM,wBAAwB,CAAC;AAOhC,OAAO,KAAsC,MAAM,OAAO,CAAC;AAM3D,MAAM,WAAW,uBAAuB;IACpC,QAAQ,EAAE,wBAAwB,EAAE,CAAC;IACrC,OAAO,EAAE,+BAA+B,EAAE,CAAC;IAC3C,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;IACtD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAE5B,QAAQ,EAAE,CAAC,OAAO,EAAE,wBAAwB,EAAE,KAAK,IAAI,CAAC;IACxD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC3D,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,wBAAwB,KAAK,IAAI,CAAC;IAC3D,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAC;IACxC,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,+BAA+B,EAAE,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;IACnF,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC7C,qBAAqB,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC;CACjE;AAED,MAAM,WAAW,wBAAwB;IACrC,KAAK,EAAE,GAAG,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;CACnC;AAED,MAAM,WAAW,uBAAuB;IACpC,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,wBAAwB,EAAE,CAAC;CACvC;AAED,MAAM,MAAM,+BAA+B,GAAG,wBAAwB,GAAG,uBAAuB,CAAC;AACjG,eAAO,MAAM,sBAAsB,2BAA2B,CAAC;AAC/D,eAAO,MAAM,oBAAoB,qBAAqB,CAAC;AACvD,eAAO,MAAM,uBAAuB,4BAA4B,CAAC;AA2BjE,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,uBAAuB,qBA+W/D"}
package/lib/esm/TypeaheadDropdown/TypeaheadDropdown.js CHANGED
@@ -11,6 +11,7 @@ import { usePrevious } from '../hooks/usePrevious';
11
11
  import { useSelectKeyboardNavigator } from '../hooks/useSelectKeyboardNavigator';
12
12
  export const VIEW_MORE_OPTION_VALUE = 'view-more-option-value';
13
13
  export const ADD_NEW_OPTION_VALUE = 'new-option-value';
14
+ export const NO_RESULTS_OPTION_VALUE = 'no-results-option-value';
14
15
  const VIEW_MORE_OPTION = { label: 'View more', value: VIEW_MORE_OPTION_VALUE };
15
16
  const ADD_NEW_OPTION = { label: 'Create new option', value: ADD_NEW_OPTION_VALUE };
16
17
  function isDropdownGroup(option) {
@@ -34,7 +35,7 @@ function flattenOptions(options) {
34
35
  }
35
36
  export function TypeaheadDropdown(props) {
36
37
  var _a;
37
- const { color, options, selected, hasClearButton, id, isDisabled, multiple, placeholder, isShowMoreOptionVisible, defaultIsOpen, inputAriaControls, status, onSelect, onBlur, onToggleClosed, onClearQuery, onChipRemoved, onQueryUpdated, onHandleLoadMore, onOpenChange, onNew, canAddNew, getCreateNewText, isLoading, } = props;
38
+ const { color, options, selected, hasClearButton, id, isDisabled, multiple, placeholder, isShowMoreOptionVisible, defaultIsOpen, inputAriaControls, status, onSelect, onBlur, onToggleClosed, onClearQuery, onChipRemoved, onQueryUpdated, onHandleLoadMore, onOpenChange, onNew, canAddNew, getCreateNewText, noOptionsFoundMessage, isLoading, } = props;
38
39
  const { t } = useTranslation();
39
40
  const [isOpen, setIsOpen] = useState(defaultIsOpen !== null && defaultIsOpen !== void 0 ? defaultIsOpen : false);
40
41
  const [query, setQuery] = useState(!multiple ? (!isEmpty(selected) ? selected[0].label : '') : '');
@@ -129,6 +130,9 @@ export function TypeaheadDropdown(props) {
129
130
  !!onHandleLoadMore && onHandleLoadMore(event);
130
131
  return;
131
132
  }
133
+ if (value === NO_RESULTS_OPTION_VALUE) {
134
+ return;
135
+ }
132
136
  if (value === ADD_NEW_OPTION_VALUE) {
133
137
  !!onNew && onNew(query);
134
138
  setQuery('');
@@ -156,10 +160,13 @@ export function TypeaheadDropdown(props) {
156
160
  const toggle = (toggleRef) => {
157
161
  return (React.createElement(MenuToggle, { isFullWidth: true, variant: "typeahead", onClick: handleToggle, innerRef: toggleRef, isExpanded: isOpen, isDisabled: isDisabled, status: status },
158
162
  React.createElement(TextInputGroup, { isPlain: true },
159
- React.createElement(TextInputGroupMain, { value: query, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : t(`Search by name or username`), innerRef: inputRef, onChange: updateQuery, onClick: handleInputToggle, onKeyDown: onInputKeyDown, isExpanded: isOpen, "aria-controls": inputAriaControls, role: "combobox" }, !!multiple && (React.createElement(LabelGroup, { "aria-label": "Current selections" }, selected.map((option, index) => (React.createElement(Label, { key: index, variant: "outline", onClick: haltEvent, color: color !== null && color !== void 0 ? color : 'blue', isDisabled: isDisabled || (option === null || option === void 0 ? void 0 : option.disableDelete), onClose: (ev) => {
160
- haltEvent(ev);
161
- !!onChipRemoved && onChipRemoved(option);
162
- } }, option.label)))))),
163
+ React.createElement(TextInputGroupMain, { value: query, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : t(`Search by name or username`), innerRef: inputRef, onChange: updateQuery, onClick: handleInputToggle, onKeyDown: onInputKeyDown, isExpanded: isOpen, "aria-controls": inputAriaControls, role: "combobox" }, !!multiple && (React.createElement(LabelGroup, { "aria-label": "Current selections" }, selected.map((option, index) => {
164
+ var _a, _b, _c;
165
+ return (React.createElement(Label, { key: index, variant: (_a = option.variant) !== null && _a !== void 0 ? _a : 'outline', onClick: haltEvent, color: (_c = (_b = option.color) !== null && _b !== void 0 ? _b : color) !== null && _c !== void 0 ? _c : 'blue', isDisabled: isDisabled || (option === null || option === void 0 ? void 0 : option.disableDelete), onClose: (ev) => {
166
+ haltEvent(ev);
167
+ !!onChipRemoved && onChipRemoved(option);
168
+ } }, option.label));
169
+ })))),
163
170
  React.createElement(TextInputGroupUtilities, null,
164
171
  query && hasClearButton && !isDisabled && (React.createElement(Button, { icon: React.createElement(TimesCircleIcon, null), "aria-label": "Clear input value", variant: "plain", onClick: handleClearQuery, isDisabled: isDisabled })),
165
172
  isLoading && React.createElement(Spinner, { size: "sm" })))));
@@ -193,6 +200,14 @@ export function TypeaheadDropdown(props) {
193
200
  if (!!canAddNew && canAddNew(options, query)) {
194
201
  optionElements.push(getOptionElement(ADD_NEW_OPTION, currentIndex));
195
202
  }
203
+ if (optionElements.length === 0 && !!query.trim() && !isLoading) {
204
+ const message = typeof noOptionsFoundMessage === 'function'
205
+ ? noOptionsFoundMessage(query)
206
+ : noOptionsFoundMessage || t('No results found');
207
+ // Avoiding isDisabled 'No results found' as PF mutes disabled option text too much for this empty state.
208
+ optionElements.push(React.createElement(SelectOption, { key: NO_RESULTS_OPTION_VALUE, value: NO_RESULTS_OPTION_VALUE },
209
+ React.createElement("span", { className: "pf-v6-u-text-color-regular" }, message)));
210
+ }
196
211
  return optionElements;
197
212
  };
198
213
  /**
package/lib/esm/index.js CHANGED
@@ -36,4 +36,4 @@ export * from './TagsSelector';
36
36
  export * from './SingleSelectDropdown';
37
37
  export * from './OwnerTypeaheadDropdown';
38
38
  export * from './CaseLabelLoadErrorModal';
39
- // dummy change for publish
39
+ // dummy change
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rh-support/components",
3
- "version": "2.6.46",
3
+ "version": "2.6.49",
4
4
  "description": "Contains all reusabel components for support app",
5
5
  "author": "Vikas Rathee <vrathee@redhat.com>",
6
6
  "license": "ISC",
@@ -61,9 +61,9 @@
61
61
  "@patternfly/react-core": "6.2.1",
62
62
  "@patternfly/react-icons": "6.2.1",
63
63
  "@patternfly/react-table": "6.2.1",
64
- "@rh-support/types": "2.0.31",
65
- "@rh-support/user-permissions": "2.6.43",
66
- "@rh-support/utils": "2.6.42",
64
+ "@rh-support/types": "2.0.33",
65
+ "@rh-support/user-permissions": "2.6.46",
66
+ "@rh-support/utils": "2.6.45",
67
67
  "dompurify": "^2.2.6",
68
68
  "js-worker-search": "^1.4.1",
69
69
  "lazysizes": "^5.3.2",
@@ -103,5 +103,5 @@
103
103
  "defaults and supports es6-module",
104
104
  "maintained node versions"
105
105
  ],
106
- "gitHead": "f93a43376534c539511491878802f207d215360c"
106
+ "gitHead": "dd818edf4098c866388b59af94b99d889a004681"
107
107
  }