@pega/cosmos-react-cs 5.0.0-dev.4.7 → 5.0.0-dev.4.8

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 (201) hide show
  1. package/package.json +3 -3
  2. package/lib/components/CTIPanel/CTIPanel.d.ts +0 -13
  3. package/lib/components/CTIPanel/CTIPanel.d.ts.map +0 -1
  4. package/lib/components/CTIPanel/CTIPanel.js +0 -12
  5. package/lib/components/CTIPanel/CTIPanel.js.map +0 -1
  6. package/lib/components/CTIPanel/index.d.ts +0 -2
  7. package/lib/components/CTIPanel/index.d.ts.map +0 -1
  8. package/lib/components/CTIPanel/index.js +0 -2
  9. package/lib/components/CTIPanel/index.js.map +0 -1
  10. package/lib/components/CallControlPanel/AttachInteractionDialog.d.ts +0 -47
  11. package/lib/components/CallControlPanel/AttachInteractionDialog.d.ts.map +0 -1
  12. package/lib/components/CallControlPanel/AttachInteractionDialog.js +0 -54
  13. package/lib/components/CallControlPanel/AttachInteractionDialog.js.map +0 -1
  14. package/lib/components/CallControlPanel/Call.d.ts +0 -6
  15. package/lib/components/CallControlPanel/Call.d.ts.map +0 -1
  16. package/lib/components/CallControlPanel/Call.js +0 -145
  17. package/lib/components/CallControlPanel/Call.js.map +0 -1
  18. package/lib/components/CallControlPanel/CallControlPanel.d.ts +0 -6
  19. package/lib/components/CallControlPanel/CallControlPanel.d.ts.map +0 -1
  20. package/lib/components/CallControlPanel/CallControlPanel.js +0 -61
  21. package/lib/components/CallControlPanel/CallControlPanel.js.map +0 -1
  22. package/lib/components/CallControlPanel/CallControlPanel.styles.d.ts +0 -16
  23. package/lib/components/CallControlPanel/CallControlPanel.styles.d.ts.map +0 -1
  24. package/lib/components/CallControlPanel/CallControlPanel.styles.js +0 -105
  25. package/lib/components/CallControlPanel/CallControlPanel.styles.js.map +0 -1
  26. package/lib/components/CallControlPanel/CallControlPanel.types.d.ts +0 -120
  27. package/lib/components/CallControlPanel/CallControlPanel.types.d.ts.map +0 -1
  28. package/lib/components/CallControlPanel/CallControlPanel.types.js +0 -2
  29. package/lib/components/CallControlPanel/CallControlPanel.types.js.map +0 -1
  30. package/lib/components/CallControlPanel/CallControlPanelIcon.d.ts +0 -15
  31. package/lib/components/CallControlPanel/CallControlPanelIcon.d.ts.map +0 -1
  32. package/lib/components/CallControlPanel/CallControlPanelIcon.js +0 -81
  33. package/lib/components/CallControlPanel/CallControlPanelIcon.js.map +0 -1
  34. package/lib/components/CallControlPanel/CallHandover/CallHandover.types.d.ts +0 -17
  35. package/lib/components/CallControlPanel/CallHandover/CallHandover.types.d.ts.map +0 -1
  36. package/lib/components/CallControlPanel/CallHandover/CallHandover.types.js +0 -2
  37. package/lib/components/CallControlPanel/CallHandover/CallHandover.types.js.map +0 -1
  38. package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.d.ts +0 -16
  39. package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.d.ts.map +0 -1
  40. package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.js +0 -56
  41. package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.js.map +0 -1
  42. package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.d.ts +0 -31
  43. package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.d.ts.map +0 -1
  44. package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.js +0 -60
  45. package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.js.map +0 -1
  46. package/lib/components/CallControlPanel/CallHandover/index.d.ts +0 -4
  47. package/lib/components/CallControlPanel/CallHandover/index.d.ts.map +0 -1
  48. package/lib/components/CallControlPanel/CallHandover/index.js +0 -4
  49. package/lib/components/CallControlPanel/CallHandover/index.js.map +0 -1
  50. package/lib/components/CallControlPanel/ContactList/CalleePicker.d.ts +0 -18
  51. package/lib/components/CallControlPanel/ContactList/CalleePicker.d.ts.map +0 -1
  52. package/lib/components/CallControlPanel/ContactList/CalleePicker.js +0 -54
  53. package/lib/components/CallControlPanel/ContactList/CalleePicker.js.map +0 -1
  54. package/lib/components/CallControlPanel/ContactList/ContactList.d.ts +0 -10
  55. package/lib/components/CallControlPanel/ContactList/ContactList.d.ts.map +0 -1
  56. package/lib/components/CallControlPanel/ContactList/ContactList.js +0 -129
  57. package/lib/components/CallControlPanel/ContactList/ContactList.js.map +0 -1
  58. package/lib/components/CallControlPanel/ContactList/ContactList.types.d.ts +0 -30
  59. package/lib/components/CallControlPanel/ContactList/ContactList.types.d.ts.map +0 -1
  60. package/lib/components/CallControlPanel/ContactList/ContactList.types.js +0 -2
  61. package/lib/components/CallControlPanel/ContactList/ContactList.types.js.map +0 -1
  62. package/lib/components/CallControlPanel/ContactList/index.d.ts +0 -3
  63. package/lib/components/CallControlPanel/ContactList/index.d.ts.map +0 -1
  64. package/lib/components/CallControlPanel/ContactList/index.js +0 -2
  65. package/lib/components/CallControlPanel/ContactList/index.js.map +0 -1
  66. package/lib/components/CallControlPanel/ExternalCTI.d.ts +0 -24
  67. package/lib/components/CallControlPanel/ExternalCTI.d.ts.map +0 -1
  68. package/lib/components/CallControlPanel/ExternalCTI.js +0 -48
  69. package/lib/components/CallControlPanel/ExternalCTI.js.map +0 -1
  70. package/lib/components/CallControlPanel/FloatingPanel.d.ts +0 -36
  71. package/lib/components/CallControlPanel/FloatingPanel.d.ts.map +0 -1
  72. package/lib/components/CallControlPanel/FloatingPanel.js +0 -72
  73. package/lib/components/CallControlPanel/FloatingPanel.js.map +0 -1
  74. package/lib/components/CallControlPanel/IncomingCall.d.ts +0 -6
  75. package/lib/components/CallControlPanel/IncomingCall.d.ts.map +0 -1
  76. package/lib/components/CallControlPanel/IncomingCall.js +0 -18
  77. package/lib/components/CallControlPanel/IncomingCall.js.map +0 -1
  78. package/lib/components/CallControlPanel/StopWatch.d.ts +0 -11
  79. package/lib/components/CallControlPanel/StopWatch.d.ts.map +0 -1
  80. package/lib/components/CallControlPanel/StopWatch.js +0 -28
  81. package/lib/components/CallControlPanel/StopWatch.js.map +0 -1
  82. package/lib/components/CallControlPanel/index.d.ts +0 -5
  83. package/lib/components/CallControlPanel/index.d.ts.map +0 -1
  84. package/lib/components/CallControlPanel/index.js +0 -3
  85. package/lib/components/CallControlPanel/index.js.map +0 -1
  86. package/lib/components/CallControlPanel/utils.d.ts +0 -7
  87. package/lib/components/CallControlPanel/utils.d.ts.map +0 -1
  88. package/lib/components/CallControlPanel/utils.js +0 -34
  89. package/lib/components/CallControlPanel/utils.js.map +0 -1
  90. package/lib/components/DialPad/DialPad.d.ts +0 -18
  91. package/lib/components/DialPad/DialPad.d.ts.map +0 -1
  92. package/lib/components/DialPad/DialPad.js +0 -30
  93. package/lib/components/DialPad/DialPad.js.map +0 -1
  94. package/lib/components/DialPad/DialPad.types.d.ts +0 -33
  95. package/lib/components/DialPad/DialPad.types.d.ts.map +0 -1
  96. package/lib/components/DialPad/DialPad.types.js +0 -2
  97. package/lib/components/DialPad/DialPad.types.js.map +0 -1
  98. package/lib/components/DialPad/DialPadDialog.d.ts +0 -9
  99. package/lib/components/DialPad/DialPadDialog.d.ts.map +0 -1
  100. package/lib/components/DialPad/DialPadDialog.js +0 -35
  101. package/lib/components/DialPad/DialPadDialog.js.map +0 -1
  102. package/lib/components/DialPad/DialPadKeyboard.d.ts +0 -12
  103. package/lib/components/DialPad/DialPadKeyboard.d.ts.map +0 -1
  104. package/lib/components/DialPad/DialPadKeyboard.js +0 -89
  105. package/lib/components/DialPad/DialPadKeyboard.js.map +0 -1
  106. package/lib/components/DialPad/DialPadKeyboard.styles.d.ts +0 -5
  107. package/lib/components/DialPad/DialPadKeyboard.styles.d.ts.map +0 -1
  108. package/lib/components/DialPad/DialPadKeyboard.styles.js +0 -76
  109. package/lib/components/DialPad/DialPadKeyboard.styles.js.map +0 -1
  110. package/lib/components/DialPad/KeyboardNavigation.d.ts +0 -6
  111. package/lib/components/DialPad/KeyboardNavigation.d.ts.map +0 -1
  112. package/lib/components/DialPad/KeyboardNavigation.js +0 -156
  113. package/lib/components/DialPad/KeyboardNavigation.js.map +0 -1
  114. package/lib/components/DialPad/index.d.ts +0 -4
  115. package/lib/components/DialPad/index.d.ts.map +0 -1
  116. package/lib/components/DialPad/index.js +0 -3
  117. package/lib/components/DialPad/index.js.map +0 -1
  118. package/lib/components/DialPad/utils.d.ts +0 -4
  119. package/lib/components/DialPad/utils.d.ts.map +0 -1
  120. package/lib/components/DialPad/utils.js +0 -7
  121. package/lib/components/DialPad/utils.js.map +0 -1
  122. package/lib/components/InteractionNotification/CountdownButton.d.ts +0 -15
  123. package/lib/components/InteractionNotification/CountdownButton.d.ts.map +0 -1
  124. package/lib/components/InteractionNotification/CountdownButton.js +0 -42
  125. package/lib/components/InteractionNotification/CountdownButton.js.map +0 -1
  126. package/lib/components/InteractionNotification/InteractionNotification.d.ts +0 -35
  127. package/lib/components/InteractionNotification/InteractionNotification.d.ts.map +0 -1
  128. package/lib/components/InteractionNotification/InteractionNotification.js +0 -110
  129. package/lib/components/InteractionNotification/InteractionNotification.js.map +0 -1
  130. package/lib/components/InteractionNotification/index.d.ts +0 -2
  131. package/lib/components/InteractionNotification/index.d.ts.map +0 -1
  132. package/lib/components/InteractionNotification/index.js +0 -2
  133. package/lib/components/InteractionNotification/index.js.map +0 -1
  134. package/lib/components/InteractionTimer/InteractionTimer.d.ts +0 -29
  135. package/lib/components/InteractionTimer/InteractionTimer.d.ts.map +0 -1
  136. package/lib/components/InteractionTimer/InteractionTimer.js +0 -90
  137. package/lib/components/InteractionTimer/InteractionTimer.js.map +0 -1
  138. package/lib/components/InteractionTimer/index.d.ts +0 -3
  139. package/lib/components/InteractionTimer/index.d.ts.map +0 -1
  140. package/lib/components/InteractionTimer/index.js +0 -2
  141. package/lib/components/InteractionTimer/index.js.map +0 -1
  142. package/lib/components/Picker/Picker.d.ts +0 -6
  143. package/lib/components/Picker/Picker.d.ts.map +0 -1
  144. package/lib/components/Picker/Picker.js +0 -109
  145. package/lib/components/Picker/Picker.js.map +0 -1
  146. package/lib/components/Picker/Picker.styles.d.ts +0 -12
  147. package/lib/components/Picker/Picker.styles.d.ts.map +0 -1
  148. package/lib/components/Picker/Picker.styles.js +0 -59
  149. package/lib/components/Picker/Picker.styles.js.map +0 -1
  150. package/lib/components/Picker/Picker.types.d.ts +0 -35
  151. package/lib/components/Picker/Picker.types.d.ts.map +0 -1
  152. package/lib/components/Picker/Picker.types.js +0 -2
  153. package/lib/components/Picker/Picker.types.js.map +0 -1
  154. package/lib/components/Picker/index.d.ts +0 -2
  155. package/lib/components/Picker/index.d.ts.map +0 -1
  156. package/lib/components/Picker/index.js +0 -2
  157. package/lib/components/Picker/index.js.map +0 -1
  158. package/lib/components/TaskManager/ConversationAI.d.ts +0 -6
  159. package/lib/components/TaskManager/ConversationAI.d.ts.map +0 -1
  160. package/lib/components/TaskManager/ConversationAI.js +0 -29
  161. package/lib/components/TaskManager/ConversationAI.js.map +0 -1
  162. package/lib/components/TaskManager/Dialogue.d.ts +0 -6
  163. package/lib/components/TaskManager/Dialogue.d.ts.map +0 -1
  164. package/lib/components/TaskManager/Dialogue.js +0 -30
  165. package/lib/components/TaskManager/Dialogue.js.map +0 -1
  166. package/lib/components/TaskManager/TaskManager.context.d.ts +0 -5
  167. package/lib/components/TaskManager/TaskManager.context.d.ts.map +0 -1
  168. package/lib/components/TaskManager/TaskManager.context.js +0 -3
  169. package/lib/components/TaskManager/TaskManager.context.js.map +0 -1
  170. package/lib/components/TaskManager/TaskManager.d.ts +0 -6
  171. package/lib/components/TaskManager/TaskManager.d.ts.map +0 -1
  172. package/lib/components/TaskManager/TaskManager.js +0 -68
  173. package/lib/components/TaskManager/TaskManager.js.map +0 -1
  174. package/lib/components/TaskManager/TaskManager.styles.d.ts +0 -37
  175. package/lib/components/TaskManager/TaskManager.styles.d.ts.map +0 -1
  176. package/lib/components/TaskManager/TaskManager.styles.js +0 -325
  177. package/lib/components/TaskManager/TaskManager.styles.js.map +0 -1
  178. package/lib/components/TaskManager/TaskManager.types.d.ts +0 -98
  179. package/lib/components/TaskManager/TaskManager.types.d.ts.map +0 -1
  180. package/lib/components/TaskManager/TaskManager.types.js +0 -2
  181. package/lib/components/TaskManager/TaskManager.types.js.map +0 -1
  182. package/lib/components/TaskManager/TaskManagerTabs.d.ts +0 -6
  183. package/lib/components/TaskManager/TaskManagerTabs.d.ts.map +0 -1
  184. package/lib/components/TaskManager/TaskManagerTabs.js +0 -186
  185. package/lib/components/TaskManager/TaskManagerTabs.js.map +0 -1
  186. package/lib/components/TaskManager/TaskPicker.d.ts +0 -19
  187. package/lib/components/TaskManager/TaskPicker.d.ts.map +0 -1
  188. package/lib/components/TaskManager/TaskPicker.js +0 -89
  189. package/lib/components/TaskManager/TaskPicker.js.map +0 -1
  190. package/lib/components/TaskManager/TaskView.d.ts +0 -6
  191. package/lib/components/TaskManager/TaskView.d.ts.map +0 -1
  192. package/lib/components/TaskManager/TaskView.js +0 -10
  193. package/lib/components/TaskManager/TaskView.js.map +0 -1
  194. package/lib/components/TaskManager/index.d.ts +0 -5
  195. package/lib/components/TaskManager/index.d.ts.map +0 -1
  196. package/lib/components/TaskManager/index.js +0 -4
  197. package/lib/components/TaskManager/index.js.map +0 -1
  198. package/lib/index.d.ts +0 -13
  199. package/lib/index.d.ts.map +0 -1
  200. package/lib/index.js +0 -14
  201. package/lib/index.js.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/InteractionTimer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAC7C,YAAY,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC"}
@@ -1,2 +0,0 @@
1
- export { default } from './InteractionTimer';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/InteractionTimer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC","sourcesContent":["export { default } from './InteractionTimer';\nexport type { InteractionTimerProps } from './InteractionTimer';\n"]}
@@ -1,6 +0,0 @@
1
- import { FunctionComponent } from 'react';
2
- import { ForwardProps } from '@pega/cosmos-react-core';
3
- import { PickerProps } from './Picker.types';
4
- declare const Picker: FunctionComponent<PickerProps & ForwardProps>;
5
- export default Picker;
6
- //# sourceMappingURL=Picker.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Picker.d.ts","sourceRoot":"","sources":["../../../src/components/Picker/Picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAcL,YAAY,EAGb,MAAM,yBAAyB,CAAC;AAOjC,OAAO,EAA8B,WAAW,EAAqB,MAAM,gBAAgB,CAAC;AAqF5F,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAiMxD,CAAC;AAEH,eAAe,MAAM,CAAC"}
@@ -1,109 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState } from 'react';
3
- import { Button, Flex, Icon, Menu, menuHelpers, EmptyState, SearchInput, Text, useI18n, Switch, useArrows, registerIcon, getFocusables, createStringMatcher, Grid } from '@pega/cosmos-react-core';
4
- import { DragDropList, DragDropManager } from '@pega/cosmos-react-dnd';
5
- import * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';
6
- import * as dragIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/drag.icon';
7
- import * as trashIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/trash.icon';
8
- import { StyledSelectedItemsWrapper, StyledSummaryItem, StyledDragHandle, StyledPickerContent, StyledSelectedItems } from './Picker.styles';
9
- registerIcon(timesIcon, dragIcon, trashIcon);
10
- const SelectedItem = ({ previewRef, dragRef, onRemoveSelection, id, primary, secondary }) => {
11
- const t = useI18n();
12
- return (_jsx("li", { children: _jsx(StyledSummaryItem, { ref: previewRef, visual: dragRef ? (_jsx(StyledDragHandle, { ref: dragRef, children: _jsx(Icon, { name: 'drag' }) })) : undefined, primary: primary, secondary: secondary, actions: _jsx(Button, { variant: 'simple', icon: true, "aria-label": t('delete_noun', [primary]), label: t('delete'), onClick: () => onRemoveSelection?.(id), children: _jsx(Icon, { name: 'trash' }) }) }) }));
13
- };
14
- const selectedItemRenderer = ({ dragRef, previewRef, data, onRemoveSelection }) => (_jsx(SelectedItem, { dragRef: dragRef, previewRef: previewRef, onRemoveSelection: onRemoveSelection, ...data }));
15
- const DraggableSelectedList = ({ selectedItems, onChange, itemRenderer }) => {
16
- return (_jsx(DragDropManager, { children: _jsx(DragDropList, { as: StyledSelectedItems, accept: 'picker-selection', items: selectedItems.map(item => ({
17
- id: item.id,
18
- type: 'picker-selection',
19
- data: item
20
- })), itemRenderer: itemRenderer, onChange: onChange }) }));
21
- };
22
- const Picker = forwardRef(function Picker({ items, multiSelect = false, onModeToggle, contextualLabel, reorderSelections = false, selections, onSelectionChange, handle }, ref) {
23
- const t = useI18n();
24
- const [searchInput, setSearchInput] = useState('');
25
- const filterRegex = createStringMatcher(searchInput);
26
- const searchEleRef = useRef(null);
27
- const selectedItemsWrapperRef = useRef(null);
28
- const switchRef = useRef(null);
29
- useImperativeHandle(handle, () => ({
30
- focusToggleSwitch: () => {
31
- switchRef.current?.focus();
32
- }
33
- }));
34
- const renderItems = useMemo(() => {
35
- return menuHelpers.mapTree(searchInput
36
- ? menuHelpers.flatten(items).filter(({ primary, items: childItems }) => {
37
- return filterRegex.test(primary) && !childItems?.length;
38
- })
39
- : items, item => {
40
- let selectable = false;
41
- if (!item.items) {
42
- selectable = true;
43
- }
44
- return {
45
- ...item,
46
- selected: selectable ? !!menuHelpers.getItem(selections, item.id) : undefined
47
- };
48
- });
49
- }, [selections, searchInput, items, filterRegex]);
50
- const removeSelectedItem = useCallback((uid) => {
51
- const itemToRemove = menuHelpers.getItem(selections, uid);
52
- onSelectionChange(selections.filter(item => item.id !== itemToRemove?.id));
53
- // 0 second timeout added because DOM needs to be up to date after list is updated before running query
54
- // setting the focus to the first element in the list on deletion and if empty then to search input
55
- setTimeout(() => {
56
- const focusable = getFocusables(selectedItemsWrapperRef);
57
- if (focusable.length > 0)
58
- focusable[0].focus();
59
- else
60
- searchEleRef.current?.focus();
61
- }, 0);
62
- }, [selections]);
63
- useArrows(selectedItemsWrapperRef, {
64
- selector: 'button',
65
- dir: 'up-down'
66
- }, [selections.length]);
67
- const selectedItems = useMemo(() => {
68
- return reorderSelections ? (_jsx(DraggableSelectedList, { selectedItems: selections, onChange: newItems => {
69
- onSelectionChange(newItems.map(({ type, data }) => ({
70
- ...data,
71
- type
72
- })));
73
- }, itemRenderer: props => selectedItemRenderer({ ...props, onRemoveSelection: removeSelectedItem }) })) : (_jsx(StyledSelectedItems, { children: selections.map(({ id, primary, secondary }) => (_jsx(SelectedItem, { id: id, primary: primary, secondary: secondary, onRemoveSelection: removeSelectedItem }, id))) }));
74
- }, [selections, reorderSelections, removeSelectedItem]);
75
- const searchAndSwitch = (_jsxs(Flex, { container: { direction: 'column', gap: 1, pad: [0.5, 1] }, children: [_jsx(SearchInput, { ref: searchEleRef, value: searchInput, onSearchChange: setSearchInput, placeholder: t('search_picker_items', [contextualLabel]), autoFocus: true }), onModeToggle && (_jsx(Switch, { label: t('select_multiple'), on: multiSelect, onChange: onModeToggle, ref: switchRef }))] }));
76
- const availableItems = (_jsx(Menu, { items: renderItems, role: 'listbox', onItemClick: (uid) => {
77
- const clickedItem = menuHelpers.getItem(renderItems, uid);
78
- const parentItem = clickedItem?.ancestors
79
- ? clickedItem.ancestors[0]
80
- : menuHelpers.getParentItem(renderItems, uid);
81
- if (!clickedItem)
82
- return;
83
- if (multiSelect) {
84
- searchEleRef.current?.focus();
85
- if (selections.find(item => item.id === uid)) {
86
- onSelectionChange(selections.filter(item => item.id !== clickedItem?.id));
87
- }
88
- else {
89
- let secondary;
90
- if (parentItem)
91
- secondary = menuHelpers.isItem(parentItem) ? parentItem.primary : parentItem.label;
92
- onSelectionChange([
93
- ...selections,
94
- {
95
- ...clickedItem,
96
- secondary
97
- }
98
- ]);
99
- }
100
- setSearchInput('');
101
- }
102
- else {
103
- onSelectionChange([clickedItem]);
104
- }
105
- }, focusControlEl: searchEleRef.current ?? undefined, emptyText: t('no_picker_items', [contextualLabel]), accent: filterRegex, mode: multiSelect ? 'multi-select' : 'action', arrowNavigationUnsupported: true, scrollAt: Infinity }));
106
- return (_jsxs(Grid, { as: StyledPickerContent, ref: ref, container: { autoFlow: 'column', autoCols: 'minmax(0, 1fr)' }, children: [_jsxs(Flex, { container: { direction: 'column', gap: 1 }, children: [searchAndSwitch, availableItems] }), multiSelect && (_jsxs(Flex, { as: StyledSelectedItemsWrapper, container: { direction: 'column' }, ref: selectedItemsWrapperRef, children: [_jsx(Text, { variant: 'h3', children: t('selected_picker_items', [contextualLabel]) }), selections.length > 0 ? (selectedItems) : (_jsx(EmptyState, { message: t('no_selected_picker_items', [contextualLabel]) }))] }))] }));
107
- });
108
- export default Picker;
109
- //# sourceMappingURL=Picker.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Picker.js","sourceRoot":"","sources":["../../../src/components/Picker/Picker.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useCallback,\n useImperativeHandle,\n useMemo,\n useRef,\n useState\n} from 'react';\n\nimport {\n Button,\n Flex,\n Icon,\n Menu,\n menuHelpers,\n EmptyState,\n SearchInput,\n Text,\n useI18n,\n Switch,\n useArrows,\n registerIcon,\n getFocusables,\n ForwardProps,\n createStringMatcher,\n Grid\n} from '@pega/cosmos-react-core';\nimport { MenuItemProps } from '@pega/cosmos-react-core/lib/components/Menu/Menu.types';\nimport { DragDropList, DragDropManager, ItemRendererProps } from '@pega/cosmos-react-dnd';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as dragIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/drag.icon';\nimport * as trashIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/trash.icon';\n\nimport { DraggableSelectedListProps, PickerProps, SelectedItemProps } from './Picker.types';\nimport {\n StyledSelectedItemsWrapper,\n StyledSummaryItem,\n StyledDragHandle,\n StyledPickerContent,\n StyledSelectedItems\n} from './Picker.styles';\n\nregisterIcon(timesIcon, dragIcon, trashIcon);\n\nconst SelectedItem = ({\n previewRef,\n dragRef,\n onRemoveSelection,\n id,\n primary,\n secondary\n}: SelectedItemProps) => {\n const t = useI18n();\n return (\n <li>\n <StyledSummaryItem\n ref={previewRef}\n visual={\n dragRef ? (\n <StyledDragHandle ref={dragRef}>\n <Icon name='drag' />\n </StyledDragHandle>\n ) : undefined\n }\n primary={primary}\n secondary={secondary}\n actions={\n <Button\n variant='simple'\n icon\n aria-label={t('delete_noun', [primary])}\n label={t('delete')}\n onClick={() => onRemoveSelection?.(id)}\n >\n <Icon name='trash' />\n </Button>\n }\n />\n </li>\n );\n};\n\nconst selectedItemRenderer = ({\n dragRef,\n previewRef,\n data,\n onRemoveSelection\n}: ItemRendererProps<MenuItemProps> & Pick<SelectedItemProps, 'onRemoveSelection'>) => (\n <SelectedItem\n dragRef={dragRef}\n previewRef={previewRef}\n onRemoveSelection={onRemoveSelection}\n {...data}\n />\n);\n\nconst DraggableSelectedList = ({\n selectedItems,\n onChange,\n itemRenderer\n}: DraggableSelectedListProps) => {\n return (\n <DragDropManager>\n <DragDropList\n as={StyledSelectedItems}\n accept='picker-selection'\n items={selectedItems.map(item => ({\n id: item.id,\n type: 'picker-selection',\n data: item\n }))}\n itemRenderer={itemRenderer}\n onChange={onChange}\n />\n </DragDropManager>\n );\n};\n\nconst Picker: FunctionComponent<PickerProps & ForwardProps> = forwardRef(function Picker(\n {\n items,\n multiSelect = false,\n onModeToggle,\n contextualLabel,\n reorderSelections = false,\n selections,\n onSelectionChange,\n handle\n }: PropsWithoutRef<PickerProps>,\n ref: PickerProps['ref']\n) {\n const t = useI18n();\n const [searchInput, setSearchInput] = useState('');\n const filterRegex = createStringMatcher(searchInput);\n const searchEleRef = useRef<HTMLInputElement>(null);\n const selectedItemsWrapperRef = useRef<HTMLDivElement>(null);\n const switchRef = useRef<HTMLInputElement>(null);\n\n useImperativeHandle(handle, () => ({\n focusToggleSwitch: () => {\n switchRef.current?.focus();\n }\n }));\n\n const renderItems = useMemo(() => {\n return menuHelpers.mapTree(\n searchInput\n ? menuHelpers.flatten(items).filter(({ primary, items: childItems }: MenuItemProps) => {\n return filterRegex.test(primary) && !childItems?.length;\n })\n : items,\n item => {\n let selectable = false;\n\n if (!item.items) {\n selectable = true;\n }\n\n return {\n ...item,\n selected: selectable ? !!menuHelpers.getItem(selections, item.id) : undefined\n };\n }\n );\n }, [selections, searchInput, items, filterRegex]);\n\n const removeSelectedItem = useCallback(\n (uid: string) => {\n const itemToRemove = menuHelpers.getItem(selections, uid);\n onSelectionChange(selections.filter(item => item.id !== itemToRemove?.id));\n // 0 second timeout added because DOM needs to be up to date after list is updated before running query\n // setting the focus to the first element in the list on deletion and if empty then to search input\n setTimeout(() => {\n const focusable = getFocusables(selectedItemsWrapperRef);\n if (focusable.length > 0) focusable[0].focus();\n else searchEleRef.current?.focus();\n }, 0);\n },\n [selections]\n );\n\n useArrows(\n selectedItemsWrapperRef,\n {\n selector: 'button',\n dir: 'up-down'\n },\n [selections.length]\n );\n\n const selectedItems = useMemo(() => {\n return reorderSelections ? (\n <DraggableSelectedList\n selectedItems={selections}\n onChange={newItems => {\n onSelectionChange(\n newItems.map(({ type, data }) => ({\n ...data,\n type\n })) as MenuItemProps[]\n );\n }}\n itemRenderer={props =>\n selectedItemRenderer({ ...props, onRemoveSelection: removeSelectedItem })\n }\n />\n ) : (\n <StyledSelectedItems>\n {selections.map(({ id, primary, secondary }) => (\n <SelectedItem\n key={id}\n id={id}\n primary={primary}\n secondary={secondary}\n onRemoveSelection={removeSelectedItem}\n />\n ))}\n </StyledSelectedItems>\n );\n }, [selections, reorderSelections, removeSelectedItem]);\n\n const searchAndSwitch = (\n <Flex container={{ direction: 'column', gap: 1, pad: [0.5, 1] }}>\n <SearchInput\n ref={searchEleRef}\n value={searchInput}\n onSearchChange={setSearchInput}\n placeholder={t('search_picker_items', [contextualLabel])}\n autoFocus\n />\n {onModeToggle && (\n <Switch\n label={t('select_multiple')}\n on={multiSelect}\n onChange={onModeToggle}\n ref={switchRef}\n />\n )}\n </Flex>\n );\n\n const availableItems = (\n <Menu\n items={renderItems}\n role='listbox'\n onItemClick={(uid: string) => {\n const clickedItem = menuHelpers.getItem(renderItems, uid);\n const parentItem = clickedItem?.ancestors\n ? clickedItem.ancestors[0]\n : menuHelpers.getParentItem(renderItems, uid);\n\n if (!clickedItem) return;\n if (multiSelect) {\n searchEleRef.current?.focus();\n\n if (selections.find(item => item.id === uid)) {\n onSelectionChange(selections.filter(item => item.id !== clickedItem?.id));\n } else {\n let secondary;\n if (parentItem)\n secondary = menuHelpers.isItem(parentItem) ? parentItem.primary : parentItem.label;\n\n onSelectionChange([\n ...selections,\n {\n ...clickedItem,\n secondary\n } as MenuItemProps\n ]);\n }\n setSearchInput('');\n } else {\n onSelectionChange([clickedItem]);\n }\n }}\n focusControlEl={searchEleRef.current ?? undefined}\n emptyText={t('no_picker_items', [contextualLabel])}\n accent={filterRegex}\n mode={multiSelect ? 'multi-select' : 'action'}\n arrowNavigationUnsupported\n scrollAt={Infinity}\n />\n );\n\n return (\n <Grid\n as={StyledPickerContent}\n ref={ref}\n container={{ autoFlow: 'column', autoCols: 'minmax(0, 1fr)' }}\n >\n <Flex container={{ direction: 'column', gap: 1 }}>\n {searchAndSwitch}\n {availableItems}\n </Flex>\n {multiSelect && (\n <Flex\n as={StyledSelectedItemsWrapper}\n container={{ direction: 'column' }}\n ref={selectedItemsWrapperRef}\n >\n <Text variant='h3'>{t('selected_picker_items', [contextualLabel])}</Text>\n\n {selections.length > 0 ? (\n selectedItems\n ) : (\n <EmptyState message={t('no_selected_picker_items', [contextualLabel])} />\n )}\n </Flex>\n )}\n </Grid>\n );\n});\n\nexport default Picker;\n"]}
@@ -1,12 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const StyledSelectedItemsWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
3
- export declare const StyledDragHandle: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
4
- export declare const StyledSummaryItem: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").SummaryItemProps & import("@pega/cosmos-react-core").ForwardProps> & {
5
- getTestIds: (testIdProp?: string | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["primary", "secondary", "visual", "actions"]>;
6
- }, import("styled-components").DefaultTheme, {}, never>;
7
- export declare const StyledSelectedItems: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;
8
- export declare const StyledCount: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<import("@pega/cosmos-react-core").CountProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>> & {
9
- getTestIds: (testIdProp?: string | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly []>;
10
- }, import("styled-components").DefaultTheme, {}, never>;
11
- export declare const StyledPickerContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
12
- //# sourceMappingURL=Picker.styles.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Picker.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Picker/Picker.styles.ts"],"names":[],"mappings":";AAMA,eAAO,MAAM,0BAA0B,yGAetC,CAAC;AAIF,eAAO,MAAM,gBAAgB,yGAK5B,CAAC;AAEF,eAAO,MAAM,iBAAiB;;uDAmB7B,CAAC;AAIF,eAAO,MAAM,mBAAmB,wGAW/B,CAAC;AAIF,eAAO,MAAM,WAAW;;uDAUvB,CAAC;AAIF,eAAO,MAAM,mBAAmB,yGAS/B,CAAC"}
@@ -1,59 +0,0 @@
1
- import styled, { css } from 'styled-components';
2
- import { defaultThemeProp, SummaryItem, Count, StyledFlex } from '@pega/cosmos-react-core';
3
- import { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';
4
- import { StyledModalContent } from '@pega/cosmos-react-core/lib/components/Modal/Modal.styles';
5
- export const StyledSelectedItemsWrapper = styled.div(({ theme: { base: { spacing, palette } } }) => {
6
- return css `
7
- width: 17.5rem;
8
- padding: ${spacing} 0 0 ${spacing};
9
- border-inline-start: 0.0625rem solid ${palette['border-line']};
10
- > h3 {
11
- padding: 0 0 ${spacing} ${spacing};
12
- }
13
- `;
14
- });
15
- StyledSelectedItemsWrapper.defaultProps = defaultThemeProp;
16
- export const StyledDragHandle = styled.div `
17
- cursor: move;
18
- > svg {
19
- display: block;
20
- }
21
- `;
22
- export const StyledSummaryItem = styled(SummaryItem)(({ theme: { base: { spacing, palette } }, visual }) => {
23
- return css `
24
- padding: ${spacing} 0;
25
- ${!visual &&
26
- css `
27
- padding-inline-start: ${spacing};
28
- `}
29
-
30
- &:not(:last-child) {
31
- border-bottom: 0.0625rem solid ${palette['border-line']};
32
- }
33
- `;
34
- });
35
- StyledSummaryItem.defaultProps = defaultThemeProp;
36
- export const StyledSelectedItems = styled.ul(({ theme: { base: { spacing } } }) => {
37
- return css `
38
- padding-inline-end: calc(0.25 * ${spacing});
39
- overflow-y: auto;
40
- `;
41
- });
42
- StyledSelectedItems.defaultProps = defaultThemeProp;
43
- export const StyledCount = styled(Count)(({ theme: { base: { spacing } } }) => {
44
- return css `
45
- margin-inline-start: calc(0.5 * ${spacing});
46
- `;
47
- });
48
- StyledCount.defaultProps = defaultThemeProp;
49
- export const StyledPickerContent = styled.div `
50
- &,
51
- & > ${StyledFlex}, ${StyledMenu} {
52
- overflow: auto;
53
- }
54
-
55
- ${StyledModalContent} & > ${StyledFlex} {
56
- max-height: 50vh;
57
- }
58
- `;
59
- //# sourceMappingURL=Picker.styles.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Picker.styles.js","sourceRoot":"","sources":["../../../src/components/Picker/Picker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC3F,OAAO,EAAE,UAAU,EAAE,MAAM,yDAAyD,CAAC;AACrF,OAAO,EAAE,kBAAkB,EAAE,MAAM,2DAA2D,CAAC;AAE/F,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAC,GAAG,CAClD,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,EAC3B,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;iBAEG,OAAO,QAAQ,OAAO;6CACM,OAAO,CAAC,aAAa,CAAC;;uBAE5C,OAAO,IAAI,OAAO;;KAEpC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,0BAA0B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3D,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAKzC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,WAAW,CAAC,CAClD,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,EAC3B,EACD,MAAM,EACP,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;iBACG,OAAO;QAChB,CAAC,MAAM;QACT,GAAG,CAAA;gCACuB,OAAO;OAChC;;;yCAGkC,OAAO,CAAC,aAAa,CAAC;;KAE1D,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,EAAE,CAC1C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;wCAC0B,OAAO;;KAE1C,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAC,CACtC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;wCAC0B,OAAO;KAC1C,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,WAAW,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE5C,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAA;;QAErC,UAAU,KAAK,UAAU;;;;IAI7B,kBAAkB,QAAQ,UAAU;;;CAGvC,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, SummaryItem, Count, StyledFlex } from '@pega/cosmos-react-core';\nimport { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';\nimport { StyledModalContent } from '@pega/cosmos-react-core/lib/components/Modal/Modal.styles';\n\nexport const StyledSelectedItemsWrapper = styled.div(\n ({\n theme: {\n base: { spacing, palette }\n }\n }) => {\n return css`\n width: 17.5rem;\n padding: ${spacing} 0 0 ${spacing};\n border-inline-start: 0.0625rem solid ${palette['border-line']};\n > h3 {\n padding: 0 0 ${spacing} ${spacing};\n }\n `;\n }\n);\n\nStyledSelectedItemsWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledDragHandle = styled.div`\n cursor: move;\n > svg {\n display: block;\n }\n`;\n\nexport const StyledSummaryItem = styled(SummaryItem)(\n ({\n theme: {\n base: { spacing, palette }\n },\n visual\n }) => {\n return css`\n padding: ${spacing} 0;\n ${!visual &&\n css`\n padding-inline-start: ${spacing};\n `}\n\n &:not(:last-child) {\n border-bottom: 0.0625rem solid ${palette['border-line']};\n }\n `;\n }\n);\n\nStyledSummaryItem.defaultProps = defaultThemeProp;\n\nexport const StyledSelectedItems = styled.ul(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n padding-inline-end: calc(0.25 * ${spacing});\n overflow-y: auto;\n `;\n }\n);\n\nStyledSelectedItems.defaultProps = defaultThemeProp;\n\nexport const StyledCount = styled(Count)(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n margin-inline-start: calc(0.5 * ${spacing});\n `;\n }\n);\n\nStyledCount.defaultProps = defaultThemeProp;\n\nexport const StyledPickerContent = styled.div`\n &,\n & > ${StyledFlex}, ${StyledMenu} {\n overflow: auto;\n }\n\n ${StyledModalContent} & > ${StyledFlex} {\n max-height: 50vh;\n }\n`;\n"]}
@@ -1,35 +0,0 @@
1
- import { ComponentType, Ref, RefCallback } from 'react';
2
- import { MenuItemProps, MenuProps } from '@pega/cosmos-react-core/lib/components/Menu/Menu.types';
3
- import { DraggableItem, ItemRendererProps } from '@pega/cosmos-react-dnd';
4
- export interface SwitchHandleValue {
5
- focusToggleSwitch: () => void;
6
- }
7
- export interface PickerProps extends Pick<MenuProps, 'items'> {
8
- /** contextual label for picker */
9
- contextualLabel: string;
10
- /** Enables single selection or multi selection view */
11
- multiSelect?: boolean;
12
- /** Enables drag and drop */
13
- reorderSelections?: boolean;
14
- /** Handles toggle changes */
15
- onModeToggle?: () => void;
16
- /** Holds selected items */
17
- selections: MenuItemProps[];
18
- /** callback for selection change */
19
- onSelectionChange: (selections: MenuItemProps[]) => void;
20
- /** Ref that can be used to access the imperative handle. */
21
- handle?: Ref<SwitchHandleValue>;
22
- /** ref for controlling toggle */
23
- ref?: Ref<HTMLDivElement>;
24
- }
25
- export interface DraggableSelectedListProps {
26
- selectedItems: MenuItemProps[];
27
- onChange: (items: DraggableItem<MenuItemProps>[]) => void;
28
- itemRenderer: ComponentType<ItemRendererProps<MenuItemProps>>;
29
- }
30
- export interface SelectedItemProps extends Pick<MenuItemProps, 'id' | 'primary' | 'secondary'> {
31
- onRemoveSelection: (id: MenuItemProps['id']) => void;
32
- dragRef?: RefCallback<HTMLElement>;
33
- previewRef?: RefCallback<HTMLElement>;
34
- }
35
- //# sourceMappingURL=Picker.types.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Picker.types.d.ts","sourceRoot":"","sources":["../../../src/components/Picker/Picker.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,GAAG,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAExD,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,wDAAwD,CAAC;AAClG,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE1E,MAAM,WAAW,iBAAiB;IAChC,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC;IAC3D,kCAAkC;IAClC,eAAe,EAAE,MAAM,CAAC;IACxB,uDAAuD;IACvD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,4BAA4B;IAC5B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,6BAA6B;IAC7B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,2BAA2B;IAC3B,UAAU,EAAE,aAAa,EAAE,CAAC;IAC5B,oCAAoC;IACpC,iBAAiB,EAAE,CAAC,UAAU,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IACzD,4DAA4D;IAC5D,MAAM,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAChC,iCAAiC;IACjC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,MAAM,WAAW,0BAA0B;IACzC,aAAa,EAAE,aAAa,EAAE,CAAC;IAC/B,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,aAAa,CAAC,EAAE,KAAK,IAAI,CAAC;IAC1D,YAAY,EAAE,aAAa,CAAC,iBAAiB,CAAC,aAAa,CAAC,CAAC,CAAC;CAC/D;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,aAAa,EAAE,IAAI,GAAG,SAAS,GAAG,WAAW,CAAC;IAC5F,iBAAiB,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IACrD,OAAO,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IACnC,UAAU,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;CACvC"}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=Picker.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Picker.types.js","sourceRoot":"","sources":["../../../src/components/Picker/Picker.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ComponentType, Ref, RefCallback } from 'react';\n\nimport { MenuItemProps, MenuProps } from '@pega/cosmos-react-core/lib/components/Menu/Menu.types';\nimport { DraggableItem, ItemRendererProps } from '@pega/cosmos-react-dnd';\n\nexport interface SwitchHandleValue {\n focusToggleSwitch: () => void;\n}\n\nexport interface PickerProps extends Pick<MenuProps, 'items'> {\n /** contextual label for picker */\n contextualLabel: string;\n /** Enables single selection or multi selection view */\n multiSelect?: boolean;\n /** Enables drag and drop */\n reorderSelections?: boolean;\n /** Handles toggle changes */\n onModeToggle?: () => void;\n /** Holds selected items */\n selections: MenuItemProps[];\n /** callback for selection change */\n onSelectionChange: (selections: MenuItemProps[]) => void;\n /** Ref that can be used to access the imperative handle. */\n handle?: Ref<SwitchHandleValue>;\n /** ref for controlling toggle */\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface DraggableSelectedListProps {\n selectedItems: MenuItemProps[];\n onChange: (items: DraggableItem<MenuItemProps>[]) => void;\n itemRenderer: ComponentType<ItemRendererProps<MenuItemProps>>;\n}\n\nexport interface SelectedItemProps extends Pick<MenuItemProps, 'id' | 'primary' | 'secondary'> {\n onRemoveSelection: (id: MenuItemProps['id']) => void;\n dragRef?: RefCallback<HTMLElement>;\n previewRef?: RefCallback<HTMLElement>;\n}\n"]}
@@ -1,2 +0,0 @@
1
- export { default } from './Picker';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC"}
@@ -1,2 +0,0 @@
1
- export { default } from './Picker';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export { default } from './Picker';\n"]}
@@ -1,6 +0,0 @@
1
- import { FunctionComponent } from 'react';
2
- import { ForwardProps } from '@pega/cosmos-react-core';
3
- import { ConversationAIProps } from './TaskManager.types';
4
- declare const ConversationAI: FunctionComponent<ConversationAIProps & ForwardProps>;
5
- export default ConversationAI;
6
- //# sourceMappingURL=ConversationAI.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ConversationAI.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/ConversationAI.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAiD,MAAM,OAAO,CAAC;AAEzF,OAAO,EAEL,YAAY,EASb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAU1D,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CAqEzE,CAAC;AAEF,eAAe,cAAc,CAAC"}
@@ -1,29 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { forwardRef, useState, useRef } from 'react';
3
- import { Flex, Button, useOuterEvent, useEscape, Icon, Text, EmptyState, useI18n, registerIcon } from '@pega/cosmos-react-core';
4
- import * as aiAssistIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/ai-assist.icon';
5
- import { StyledCountBadge, StyledEntityPopover, StyledContent, StyledHeader } from './TaskManager.styles';
6
- registerIcon(aiAssistIcon);
7
- const ConversationAI = forwardRef(function ConversationAI({ content, entityCount }, ref) {
8
- const t = useI18n();
9
- const [showPopover, setShowPopover] = useState(false);
10
- const buttonRef = useRef(null);
11
- const popoverRef = useRef(null);
12
- useOuterEvent('mousedown', [popoverRef, buttonRef], () => {
13
- if (showPopover)
14
- setShowPopover(false);
15
- });
16
- useEscape(() => {
17
- setShowPopover(false);
18
- });
19
- return (_jsxs("div", { ref: ref, children: [_jsxs(Button, { variant: 'simple', icon: true, onClick: () => {
20
- setShowPopover(cur => !cur);
21
- }, ref: buttonRef, "aria-label": t('show_detected_entities'), children: [_jsx(Icon, { name: 'ai-assist' }), _jsx(StyledCountBadge, { variant: 'default', children: entityCount })] }), _jsxs(StyledEntityPopover, { show: showPopover, target: buttonRef.current, placement: 'bottom-start', ref: popoverRef, arrow: true, children: [_jsxs(Flex, { container: {
22
- justify: 'between',
23
- alignItems: 'center'
24
- }, as: StyledHeader, children: [_jsx(Text, { variant: 'h3', children: t('ai_detected_entities') }), _jsx(Button, { variant: 'simple', onClick: () => {
25
- setShowPopover(false);
26
- }, icon: true, "aria-label": t('close_conversation'), children: _jsx(Icon, { name: 'times' }) })] }), _jsx(StyledContent, { children: entityCount === 0 || content === null ? (_jsx(EmptyState, { message: t('nothing_detected_yet'), item: { grow: 1 } })) : (content) })] })] }));
27
- });
28
- export default ConversationAI;
29
- //# sourceMappingURL=ConversationAI.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ConversationAI.js","sourceRoot":"","sources":["../../../src/components/TaskManager/ConversationAI.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,UAAU,EAAmB,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEzF,OAAO,EACL,IAAI,EAEJ,MAAM,EACN,aAAa,EACb,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,UAAU,EACV,OAAO,EACP,YAAY,EACb,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,YAAY,MAAM,kEAAkE,CAAC;AAGjG,OAAO,EACL,gBAAgB,EAChB,mBAAmB,EACnB,aAAa,EACb,YAAY,EACb,MAAM,sBAAsB,CAAC;AAE9B,YAAY,CAAC,YAAY,CAAC,CAAC;AAE3B,MAAM,cAAc,GAA0D,UAAU,CACtF,SAAS,cAAc,CACrB,EAAE,OAAO,EAAE,WAAW,EAAwC,EAC9D,GAA+B;IAE/B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAC/B,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAChC,aAAa,CAAC,WAAW,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE;QACvD,IAAI,WAAW;YAAE,cAAc,CAAC,KAAK,CAAC,CAAC;IACzC,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,cAAc,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,eAAK,GAAG,EAAE,GAAG,aACX,MAAC,MAAM,IACL,OAAO,EAAC,QAAQ,EAChB,IAAI,QACJ,OAAO,EAAE,GAAG,EAAE;oBACZ,cAAc,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;gBAC9B,CAAC,EACD,GAAG,EAAE,SAAS,gBACF,CAAC,CAAC,wBAAwB,CAAC,aAEvC,KAAC,IAAI,IAAC,IAAI,EAAC,WAAW,GAAG,EACzB,KAAC,gBAAgB,IAAC,OAAO,EAAC,SAAS,YAAE,WAAW,GAAoB,IAC7D,EAET,MAAC,mBAAmB,IAClB,IAAI,EAAE,WAAW,EACjB,MAAM,EAAE,SAAS,CAAC,OAAO,EACzB,SAAS,EAAC,cAAc,EACxB,GAAG,EAAE,UAAU,EACf,KAAK,mBAEL,MAAC,IAAI,IACH,SAAS,EAAE;4BACT,OAAO,EAAE,SAAS;4BAClB,UAAU,EAAE,QAAQ;yBACrB,EACD,EAAE,EAAE,YAAY,aAEhB,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,CAAC,CAAC,sBAAsB,CAAC,GAAQ,EACrD,KAAC,MAAM,IACL,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,GAAG,EAAE;oCACZ,cAAc,CAAC,KAAK,CAAC,CAAC;gCACxB,CAAC,EACD,IAAI,sBACQ,CAAC,CAAC,oBAAoB,CAAC,YAEnC,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,IACJ,EACP,KAAC,aAAa,cACX,WAAW,KAAK,CAAC,IAAI,OAAO,KAAK,IAAI,CAAC,CAAC,CAAC,CACvC,KAAC,UAAU,IAAC,OAAO,EAAE,CAAC,CAAC,sBAAsB,CAAC,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,GAAI,CACtE,CAAC,CAAC,CAAC,CACF,OAAO,CACR,GACa,IACI,IAClB,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { FunctionComponent, forwardRef, PropsWithoutRef, useState, useRef } from 'react';\n\nimport {\n Flex,\n ForwardProps,\n Button,\n useOuterEvent,\n useEscape,\n Icon,\n Text,\n EmptyState,\n useI18n,\n registerIcon\n} from '@pega/cosmos-react-core';\nimport * as aiAssistIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/ai-assist.icon';\n\nimport { ConversationAIProps } from './TaskManager.types';\nimport {\n StyledCountBadge,\n StyledEntityPopover,\n StyledContent,\n StyledHeader\n} from './TaskManager.styles';\n\nregisterIcon(aiAssistIcon);\n\nconst ConversationAI: FunctionComponent<ConversationAIProps & ForwardProps> = forwardRef(\n function ConversationAI(\n { content, entityCount }: PropsWithoutRef<ConversationAIProps>,\n ref: ConversationAIProps['ref']\n ) {\n const t = useI18n();\n const [showPopover, setShowPopover] = useState(false);\n const buttonRef = useRef(null);\n const popoverRef = useRef(null);\n useOuterEvent('mousedown', [popoverRef, buttonRef], () => {\n if (showPopover) setShowPopover(false);\n });\n\n useEscape(() => {\n setShowPopover(false);\n });\n\n return (\n <div ref={ref}>\n <Button\n variant='simple'\n icon\n onClick={() => {\n setShowPopover(cur => !cur);\n }}\n ref={buttonRef}\n aria-label={t('show_detected_entities')}\n >\n <Icon name='ai-assist' />\n <StyledCountBadge variant='default'>{entityCount}</StyledCountBadge>\n </Button>\n\n <StyledEntityPopover\n show={showPopover}\n target={buttonRef.current}\n placement='bottom-start'\n ref={popoverRef}\n arrow\n >\n <Flex\n container={{\n justify: 'between',\n alignItems: 'center'\n }}\n as={StyledHeader}\n >\n <Text variant='h3'>{t('ai_detected_entities')}</Text>\n <Button\n variant='simple'\n onClick={() => {\n setShowPopover(false);\n }}\n icon\n aria-label={t('close_conversation')}\n >\n <Icon name='times' />\n </Button>\n </Flex>\n <StyledContent>\n {entityCount === 0 || content === null ? (\n <EmptyState message={t('nothing_detected_yet')} item={{ grow: 1 }} />\n ) : (\n content\n )}\n </StyledContent>\n </StyledEntityPopover>\n </div>\n );\n }\n);\n\nexport default ConversationAI;\n"]}
@@ -1,6 +0,0 @@
1
- import { FunctionComponent } from 'react';
2
- import { ForwardProps } from '@pega/cosmos-react-core';
3
- import { DialogueProps } from './TaskManager.types';
4
- declare const Dialogue: FunctionComponent<DialogueProps & ForwardProps>;
5
- export default Dialogue;
6
- //# sourceMappingURL=Dialogue.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Dialogue.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/Dialogue.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAMlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAQ,YAAY,EAAkB,MAAM,yBAAyB,CAAC;AAE7E,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAQpD,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CAmE5D,CAAC;AAEH,eAAe,QAAQ,CAAC"}
@@ -1,30 +0,0 @@
1
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { forwardRef, useMemo, useImperativeHandle, useRef } from 'react';
3
- import { Flex, useTheme, Icon } from '@pega/cosmos-react-core';
4
- import { StyledTaskManagerBanner, StyledAgentScriptIcon, StyledIconWrap, StyledSymbol } from './TaskManager.styles';
5
- const Dialogue = forwardRef(function Dialogue({ icon, verbatimStatus, content, handle, ...restProps }, ref) {
6
- const nudgeSymbolRef = useRef(null);
7
- const { base: { animation: { timing } } } = useTheme();
8
- useImperativeHandle(handle, () => ({
9
- nudge: () => {
10
- if (!nudgeSymbolRef || !nudgeSymbolRef.current || verbatimStatus !== 'pending') {
11
- return;
12
- }
13
- return nudgeSymbolRef.current.animate?.([{ transform: 'translateX(-0.3rem)' }, { transform: 'translateX(0.3rem)' }], {
14
- duration: 50,
15
- iterations: 10,
16
- playbackRate: 1,
17
- direction: 'alternate',
18
- easing: timing.ease
19
- });
20
- }
21
- }));
22
- const iconWithStatus = useMemo(() => {
23
- return (_jsxs(Flex, { as: StyledIconWrap, container: { alignItems: 'center', justify: 'center' }, verbatimStatus: verbatimStatus, children: [_jsx(StyledAgentScriptIcon, { name: icon }), verbatimStatus && (_jsx(Flex, { as: StyledSymbol, container: { alignItems: 'center', justify: 'center', pad: 0.25 }, ref: nudgeSymbolRef, verbatimStatus: verbatimStatus, children: verbatimStatus === 'pending' ? _jsx(_Fragment, { children: "!" }) : _jsx(Icon, { name: 'check' }) }))] }));
24
- }, [icon, content, verbatimStatus]);
25
- return (_jsxs(Flex, { ...restProps, as: StyledTaskManagerBanner, container: {
26
- alignItems: 'center'
27
- }, "aria-live": 'assertive', ref: ref, children: [_jsx("div", { children: iconWithStatus }), _jsx("div", { children: content })] }));
28
- });
29
- export default Dialogue;
30
- //# sourceMappingURL=Dialogue.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Dialogue.js","sourceRoot":"","sources":["../../../src/components/TaskManager/Dialogue.tsx"],"names":[],"mappings":";AAAA,OAAO,EAEL,UAAU,EAEV,OAAO,EACP,mBAAmB,EACnB,MAAM,EACP,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,IAAI,EAAgB,QAAQ,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAG7E,OAAO,EACL,uBAAuB,EACvB,qBAAqB,EACrB,cAAc,EACd,YAAY,EACb,MAAM,sBAAsB,CAAC;AAE9B,MAAM,QAAQ,GAAoD,UAAU,CAAC,SAAS,QAAQ,CAC5F,EAAE,IAAI,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,SAAS,EAAkC,EACvF,GAAyB;IAEzB,MAAM,cAAc,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEpD,MAAM,EACJ,IAAI,EAAE,EACJ,SAAS,EAAE,EAAE,MAAM,EAAE,EACtB,EACF,GAAG,QAAQ,EAAE,CAAC;IAEf,mBAAmB,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC;QACjC,KAAK,EAAE,GAAG,EAAE;YACV,IAAI,CAAC,cAAc,IAAI,CAAC,cAAc,CAAC,OAAO,IAAI,cAAc,KAAK,SAAS,EAAE;gBAC9E,OAAO;aACR;YAED,OAAO,cAAc,CAAC,OAAO,CAAC,OAAO,EAAE,CACrC,CAAC,EAAE,SAAS,EAAE,qBAAqB,EAAE,EAAE,EAAE,SAAS,EAAE,oBAAoB,EAAE,CAAC,EAC3E;gBACE,QAAQ,EAAE,EAAE;gBACZ,UAAU,EAAE,EAAE;gBACd,YAAY,EAAE,CAAC;gBACf,SAAS,EAAE,WAAW;gBACtB,MAAM,EAAE,MAAM,CAAC,IAAI;aACpB,CACF,CAAC;QACJ,CAAC;KACF,CAAC,CAAC,CAAC;IAEJ,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,OAAO,CACL,MAAC,IAAI,IACH,EAAE,EAAE,cAAc,EAClB,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,EACtD,cAAc,EAAE,cAAc,aAE9B,KAAC,qBAAqB,IAAC,IAAI,EAAE,IAAI,GAAI,EACpC,cAAc,IAAI,CACjB,KAAC,IAAI,IACH,EAAE,EAAE,YAAY,EAChB,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,EAAE,EACjE,GAAG,EAAE,cAAc,EACnB,cAAc,EAAE,cAAc,YAE7B,cAAc,KAAK,SAAS,CAAC,CAAC,CAAC,kCAAM,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACzD,CACR,IACI,CACR,CAAC;IACJ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC;IAEpC,OAAO,CACL,MAAC,IAAI,OACC,SAAS,EACb,EAAE,EAAE,uBAAuB,EAC3B,SAAS,EAAE;YACT,UAAU,EAAE,QAAQ;SACrB,eACS,WAAW,EACrB,GAAG,EAAE,GAAG,aAER,wBAAM,cAAc,GAAO,EAC3B,wBAAM,OAAO,GAAO,IACf,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import {\n FunctionComponent,\n forwardRef,\n PropsWithoutRef,\n useMemo,\n useImperativeHandle,\n useRef\n} from 'react';\n\nimport { Flex, ForwardProps, useTheme, Icon } from '@pega/cosmos-react-core';\n\nimport { DialogueProps } from './TaskManager.types';\nimport {\n StyledTaskManagerBanner,\n StyledAgentScriptIcon,\n StyledIconWrap,\n StyledSymbol\n} from './TaskManager.styles';\n\nconst Dialogue: FunctionComponent<DialogueProps & ForwardProps> = forwardRef(function Dialogue(\n { icon, verbatimStatus, content, handle, ...restProps }: PropsWithoutRef<DialogueProps>,\n ref: DialogueProps['ref']\n) {\n const nudgeSymbolRef = useRef<HTMLDivElement>(null);\n\n const {\n base: {\n animation: { timing }\n }\n } = useTheme();\n\n useImperativeHandle(handle, () => ({\n nudge: () => {\n if (!nudgeSymbolRef || !nudgeSymbolRef.current || verbatimStatus !== 'pending') {\n return;\n }\n\n return nudgeSymbolRef.current.animate?.(\n [{ transform: 'translateX(-0.3rem)' }, { transform: 'translateX(0.3rem)' }],\n {\n duration: 50,\n iterations: 10,\n playbackRate: 1,\n direction: 'alternate',\n easing: timing.ease\n }\n );\n }\n }));\n\n const iconWithStatus = useMemo(() => {\n return (\n <Flex\n as={StyledIconWrap}\n container={{ alignItems: 'center', justify: 'center' }}\n verbatimStatus={verbatimStatus}\n >\n <StyledAgentScriptIcon name={icon} />\n {verbatimStatus && (\n <Flex\n as={StyledSymbol}\n container={{ alignItems: 'center', justify: 'center', pad: 0.25 }}\n ref={nudgeSymbolRef}\n verbatimStatus={verbatimStatus}\n >\n {verbatimStatus === 'pending' ? <>!</> : <Icon name='check' />}\n </Flex>\n )}\n </Flex>\n );\n }, [icon, content, verbatimStatus]);\n\n return (\n <Flex\n {...restProps}\n as={StyledTaskManagerBanner}\n container={{\n alignItems: 'center'\n }}\n aria-live='assertive'\n ref={ref}\n >\n <div>{iconWithStatus}</div>\n <div>{content}</div>\n </Flex>\n );\n});\n\nexport default Dialogue;\n"]}
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- import { TaskManagerContextProps } from './TaskManager.types';
3
- declare const _default: import("react").Context<TaskManagerContextProps>;
4
- export default _default;
5
- //# sourceMappingURL=TaskManager.context.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TaskManager.context.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManager.context.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;;AAE9D,wBAA0D"}
@@ -1,3 +0,0 @@
1
- import { createContext } from 'react';
2
- export default createContext({});
3
- //# sourceMappingURL=TaskManager.context.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TaskManager.context.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManager.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAItC,eAAe,aAAa,CAA0B,EAAE,CAAC,CAAC","sourcesContent":["import { createContext } from 'react';\n\nimport { TaskManagerContextProps } from './TaskManager.types';\n\nexport default createContext<TaskManagerContextProps>({});\n"]}
@@ -1,6 +0,0 @@
1
- import { FunctionComponent } from 'react';
2
- import { ForwardProps } from '@pega/cosmos-react-core';
3
- import { TaskManagerProps } from './TaskManager.types';
4
- declare const TaskManager: FunctionComponent<TaskManagerProps & ForwardProps>;
5
- export default TaskManager;
6
- //# sourceMappingURL=TaskManager.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TaskManager.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManager.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAA0D,MAAM,OAAO,CAAC;AAElG,OAAO,EAUL,YAAY,EAKb,MAAM,yBAAyB,CAAC;AAOjC,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAmBvD,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAiNnE,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -1,68 +0,0 @@
1
- import { createElement as _createElement } from "react";
2
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { forwardRef, useRef, useMemo, useState } from 'react';
4
- import { Flex, Icon, registerIcon, Text, Status, useI18n, Button, Grid, SummaryItem, useUID, useShortcut, registerAction } from '@pega/cosmos-react-core';
5
- import * as flagFinishIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/flag-finish.icon';
6
- import * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';
7
- import { StyledTaskManager, StyledTaskSummaryItem, StyledTaskMain } from './TaskManager.styles';
8
- import TaskManagerContext from './TaskManager.context';
9
- import TaskManagerTabs from './TaskManagerTabs';
10
- import TaskView from './TaskView';
11
- import Dialogue from './Dialogue';
12
- import ConversationAI from './ConversationAI';
13
- import TaskPicker from './TaskPicker';
14
- registerIcon(plusIcon, flagFinishIcon);
15
- registerAction({
16
- id: 'AddTask',
17
- defaultKeyBinding: 'Alt+A'
18
- }, {
19
- id: 'WrapUp',
20
- defaultKeyBinding: 'Alt+W'
21
- });
22
- const TaskManager = forwardRef(function TaskManager(props, ref) {
23
- const { tasks = [], onTaskLaunch, onTaskDismiss, addTask, wrapUp, main, banner, handle, conversationAI, ...restProps } = props;
24
- const t = useI18n();
25
- const taskManagerTabsRef = useRef(null);
26
- const hasActiveTask = tasks.filter(task => task.active).length > 0 || !!wrapUp?.active;
27
- const headingId = useUID();
28
- const wrapUpTabId = useUID();
29
- const wrapUpTabPanelId = useUID();
30
- const addTaskButtonRef = useRef(null);
31
- const [showPicker, setShowPicker] = useState(false);
32
- const ctx = useMemo(() => ({
33
- addTask,
34
- wrapUp,
35
- tasks,
36
- onTaskLaunch
37
- }), [addTask, wrapUp, tasks, onTaskLaunch]);
38
- useShortcut('AddTask', () => {
39
- if (addTask) {
40
- setShowPicker(true);
41
- }
42
- });
43
- useShortcut('WrapUp', () => {
44
- if (wrapUp && !wrapUp.disable)
45
- wrapUp.onClick();
46
- });
47
- return (_jsx(TaskManagerContext.Provider, { value: ctx, children: _jsxs(StyledTaskManager, { ...restProps, ref: ref, hasDrawer: hasActiveTask, hasTasks: !!tasks.length, children: [banner && (_jsx(Dialogue, { icon: banner.icon, content: banner.content, verbatimStatus: banner.verbatimStatus, handle: handle })), _jsxs(TaskView, { header: _jsx(Text, { variant: 'h2', id: headingId, children: t('task_manager_cases') }), actions: _jsxs(Flex, { container: {
48
- gap: 1
49
- }, children: [conversationAI && (_jsx(ConversationAI, { content: conversationAI.content, entityCount: conversationAI.entityCount })), _jsxs(Flex, { container: true, children: [wrapUp && (_jsxs(Button, { variant: 'secondary', disabled: wrapUp.disable, onClick: () => wrapUp.onClick(), children: [_jsx(Icon, { name: 'flag-finish' }), _jsx("span", { children: t('task_manager_wrap_up') })] })), addTask && (_jsxs(_Fragment, { children: [_jsxs(Button, { ref: addTaskButtonRef, variant: 'primary', onClick: () => setShowPicker(prev => !prev), children: [_jsx(Icon, { name: 'plus' }), _jsx("span", { children: t('task_manager_add_case') })] }), showPicker && addTaskButtonRef.current && (_jsx(TaskPicker, { target: addTaskButtonRef.current, items: addTask.items, onAdd: (selectedItems) => {
50
- addTask.onAdd(selectedItems);
51
- setShowPicker(false);
52
- }, onCancel: () => {
53
- setShowPicker(false);
54
- addTaskButtonRef.current?.focus();
55
- }, ref: addTask.ref }))] }))] })] }), children: [hasActiveTask && (_jsx(TaskManagerTabs, { ref: taskManagerTabsRef, "aria-labelledby": headingId, wrapUpTabId: wrapUpTabId, wrapUpTabPanelId: wrapUpTabPanelId })), hasActiveTask && (_jsxs(_Fragment, { children: [tasks
56
- .filter(task => !task.hideFromTab)
57
- .map(({ id, active }) => {
58
- return (_jsx(StyledTaskMain, { id: `tab-panel-${id}`, role: 'tabpanel', "aria-labelledby": `tab-${id}`, current: !!active, children: active ? main : null }, id));
59
- }), wrapUp?.showTab && (_jsx(StyledTaskMain, { id: wrapUpTabPanelId, role: 'tabpanel', "aria-labelledby": wrapUpTabId, current: !!wrapUp.active, children: wrapUp.active ? main : null }))] })), !hasActiveTask && (_jsx(Grid, { as: 'ul', container: true, children: tasks.map(({ name, id, status, isResolved, meta, icon, ...restTaskProps }) => {
60
- return (_createElement(SummaryItem, { ...restTaskProps, key: id, as: StyledTaskSummaryItem, primary: _jsx(Text, { variant: 'h4', children: name }), secondary: _jsxs(_Fragment, { children: [!status && meta && _jsx(Text, { variant: 'secondary', children: meta }), status && _jsx(Status, { variant: status.variant, children: status.text })] }), visual: _jsx(Icon, { name: icon }), actions: _jsxs(Flex, { container: { gap: 1 }, children: [!isResolved && (_jsx(Button, { variant: 'secondary', "aria-label": t('continue_label_a11y', [name]), onClick: () => {
61
- onTaskLaunch?.(id);
62
- }, children: t('continue_label') })), isResolved && (_jsx(Button, { variant: 'secondary', "aria-label": t('review_label_a11y', [name]), onClick: () => {
63
- onTaskLaunch?.(id);
64
- }, children: t('review_label') }))] }) }));
65
- }) }))] })] }) }));
66
- });
67
- export default TaskManager;
68
- //# sourceMappingURL=TaskManager.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TaskManager.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, PropsWithoutRef, forwardRef, useRef, useMemo, useState } from 'react';\n\nimport {\n Flex,\n Icon,\n registerIcon,\n Text,\n Status,\n useI18n,\n Button,\n Grid,\n SummaryItem,\n ForwardProps,\n useUID,\n MenuItemProps,\n useShortcut,\n registerAction\n} from '@pega/cosmos-react-core';\nimport * as flagFinishIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/flag-finish.icon';\nimport * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';\n\nimport { StyledTaskManager, StyledTaskSummaryItem, StyledTaskMain } from './TaskManager.styles';\nimport TaskManagerContext from './TaskManager.context';\nimport TaskManagerTabs from './TaskManagerTabs';\nimport { TaskManagerProps } from './TaskManager.types';\nimport TaskView from './TaskView';\nimport Dialogue from './Dialogue';\nimport ConversationAI from './ConversationAI';\nimport TaskPicker from './TaskPicker';\n\nregisterIcon(plusIcon, flagFinishIcon);\n\nregisterAction(\n {\n id: 'AddTask',\n defaultKeyBinding: 'Alt+A'\n },\n {\n id: 'WrapUp',\n defaultKeyBinding: 'Alt+W'\n }\n);\n\nconst TaskManager: FunctionComponent<TaskManagerProps & ForwardProps> = forwardRef(\n function TaskManager(props: PropsWithoutRef<TaskManagerProps>, ref: TaskManagerProps['ref']) {\n const {\n tasks = [],\n onTaskLaunch,\n onTaskDismiss,\n addTask,\n wrapUp,\n main,\n banner,\n handle,\n conversationAI,\n ...restProps\n } = props;\n const t = useI18n();\n const taskManagerTabsRef = useRef<HTMLDivElement>(null);\n const hasActiveTask = tasks.filter(task => task.active).length > 0 || !!wrapUp?.active;\n const headingId = useUID();\n const wrapUpTabId = useUID();\n const wrapUpTabPanelId = useUID();\n const addTaskButtonRef = useRef<HTMLButtonElement>(null);\n\n const [showPicker, setShowPicker] = useState(false);\n\n const ctx = useMemo(\n () => ({\n addTask,\n wrapUp,\n tasks,\n onTaskLaunch\n }),\n [addTask, wrapUp, tasks, onTaskLaunch]\n );\n\n useShortcut('AddTask', () => {\n if (addTask) {\n setShowPicker(true);\n }\n });\n\n useShortcut('WrapUp', () => {\n if (wrapUp && !wrapUp.disable) wrapUp.onClick();\n });\n\n return (\n <TaskManagerContext.Provider value={ctx}>\n <StyledTaskManager\n {...restProps}\n ref={ref}\n hasDrawer={hasActiveTask}\n hasTasks={!!tasks.length}\n >\n {banner && (\n <Dialogue\n icon={banner.icon}\n content={banner.content}\n verbatimStatus={banner.verbatimStatus}\n handle={handle}\n />\n )}\n <TaskView\n header={\n <Text variant='h2' id={headingId}>\n {t('task_manager_cases')}\n </Text>\n }\n actions={\n <Flex\n container={{\n gap: 1\n }}\n >\n {conversationAI && (\n <ConversationAI\n content={conversationAI.content}\n entityCount={conversationAI.entityCount}\n />\n )}\n <Flex container>\n {wrapUp && (\n <Button\n variant='secondary'\n disabled={wrapUp.disable}\n onClick={() => wrapUp.onClick()}\n >\n <Icon name='flag-finish' />\n <span>{t('task_manager_wrap_up')}</span>\n </Button>\n )}\n {addTask && (\n <>\n <Button\n ref={addTaskButtonRef}\n variant='primary'\n onClick={() => setShowPicker(prev => !prev)}\n >\n <Icon name='plus' />\n <span>{t('task_manager_add_case')}</span>\n </Button>\n {showPicker && addTaskButtonRef.current && (\n <TaskPicker\n target={addTaskButtonRef.current}\n items={addTask.items}\n onAdd={(selectedItems: MenuItemProps[]) => {\n addTask.onAdd(selectedItems);\n setShowPicker(false);\n }}\n onCancel={() => {\n setShowPicker(false);\n addTaskButtonRef.current?.focus();\n }}\n ref={addTask.ref}\n />\n )}\n </>\n )}\n </Flex>\n </Flex>\n }\n >\n {hasActiveTask && (\n <TaskManagerTabs\n ref={taskManagerTabsRef}\n aria-labelledby={headingId}\n wrapUpTabId={wrapUpTabId}\n wrapUpTabPanelId={wrapUpTabPanelId}\n />\n )}\n {hasActiveTask && (\n <>\n {tasks\n .filter(task => !task.hideFromTab)\n .map(({ id, active }) => {\n return (\n <StyledTaskMain\n id={`tab-panel-${id}`}\n key={id}\n role='tabpanel'\n aria-labelledby={`tab-${id}`}\n current={!!active}\n >\n {active ? main : null}\n </StyledTaskMain>\n );\n })}\n {wrapUp?.showTab && (\n <StyledTaskMain\n id={wrapUpTabPanelId}\n role='tabpanel'\n aria-labelledby={wrapUpTabId}\n current={!!wrapUp.active}\n >\n {wrapUp.active ? main : null}\n </StyledTaskMain>\n )}\n </>\n )}\n {!hasActiveTask && (\n <Grid as='ul' container>\n {tasks.map(({ name, id, status, isResolved, meta, icon, ...restTaskProps }) => {\n return (\n <SummaryItem\n {...restTaskProps}\n key={id}\n as={StyledTaskSummaryItem}\n primary={<Text variant='h4'>{name}</Text>}\n secondary={\n <>\n {!status && meta && <Text variant='secondary'>{meta}</Text>}\n {status && <Status variant={status.variant}>{status.text}</Status>}\n </>\n }\n visual={<Icon name={icon} />}\n actions={\n <Flex container={{ gap: 1 }}>\n {!isResolved && (\n <Button\n variant='secondary'\n aria-label={t('continue_label_a11y', [name])}\n onClick={() => {\n onTaskLaunch?.(id);\n }}\n >\n {t('continue_label')}\n </Button>\n )}\n {isResolved && (\n <Button\n variant='secondary'\n aria-label={t('review_label_a11y', [name])}\n onClick={() => {\n onTaskLaunch?.(id);\n }}\n >\n {t('review_label')}\n </Button>\n )}\n </Flex>\n }\n />\n );\n })}\n </Grid>\n )}\n </TaskView>\n </StyledTaskManager>\n </TaskManagerContext.Provider>\n );\n }\n);\n\nexport default TaskManager;\n"]}