@pega/cosmos-react-cs 2.1.5 → 2.1.6

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 (193) hide show
  1. package/package.json +3 -3
  2. package/lib/components/Article/Article.d.ts +0 -32
  3. package/lib/components/Article/Article.d.ts.map +0 -1
  4. package/lib/components/Article/Article.js +0 -51
  5. package/lib/components/Article/Article.js.map +0 -1
  6. package/lib/components/Article/ArticleFooter.d.ts +0 -19
  7. package/lib/components/Article/ArticleFooter.d.ts.map +0 -1
  8. package/lib/components/Article/ArticleFooter.js +0 -40
  9. package/lib/components/Article/ArticleFooter.js.map +0 -1
  10. package/lib/components/Article/ArticleSkeleton.d.ts +0 -8
  11. package/lib/components/Article/ArticleSkeleton.d.ts.map +0 -1
  12. package/lib/components/Article/ArticleSkeleton.js +0 -15
  13. package/lib/components/Article/ArticleSkeleton.js.map +0 -1
  14. package/lib/components/Article/index.d.ts +0 -6
  15. package/lib/components/Article/index.d.ts.map +0 -1
  16. package/lib/components/Article/index.js +0 -3
  17. package/lib/components/Article/index.js.map +0 -1
  18. package/lib/components/ArticleList/ArticleList.d.ts +0 -17
  19. package/lib/components/ArticleList/ArticleList.d.ts.map +0 -1
  20. package/lib/components/ArticleList/ArticleList.js +0 -65
  21. package/lib/components/ArticleList/ArticleList.js.map +0 -1
  22. package/lib/components/ArticleList/ArticleListHeader.d.ts +0 -20
  23. package/lib/components/ArticleList/ArticleListHeader.d.ts.map +0 -1
  24. package/lib/components/ArticleList/ArticleListHeader.js +0 -68
  25. package/lib/components/ArticleList/ArticleListHeader.js.map +0 -1
  26. package/lib/components/ArticleList/ArticleSummary.d.ts +0 -14
  27. package/lib/components/ArticleList/ArticleSummary.d.ts.map +0 -1
  28. package/lib/components/ArticleList/ArticleSummary.js +0 -30
  29. package/lib/components/ArticleList/ArticleSummary.js.map +0 -1
  30. package/lib/components/ArticleList/SummarySkeleton.d.ts +0 -7
  31. package/lib/components/ArticleList/SummarySkeleton.d.ts.map +0 -1
  32. package/lib/components/ArticleList/SummarySkeleton.js +0 -9
  33. package/lib/components/ArticleList/SummarySkeleton.js.map +0 -1
  34. package/lib/components/ArticleList/index.d.ts +0 -7
  35. package/lib/components/ArticleList/index.d.ts.map +0 -1
  36. package/lib/components/ArticleList/index.js +0 -4
  37. package/lib/components/ArticleList/index.js.map +0 -1
  38. package/lib/components/CSCaseView/CSCaseView.d.ts +0 -9
  39. package/lib/components/CSCaseView/CSCaseView.d.ts.map +0 -1
  40. package/lib/components/CSCaseView/CSCaseView.js +0 -16
  41. package/lib/components/CSCaseView/CSCaseView.js.map +0 -1
  42. package/lib/components/CSCaseView/index.d.ts +0 -3
  43. package/lib/components/CSCaseView/index.d.ts.map +0 -1
  44. package/lib/components/CSCaseView/index.js +0 -2
  45. package/lib/components/CSCaseView/index.js.map +0 -1
  46. package/lib/components/CallControlPanel/Call.d.ts +0 -6
  47. package/lib/components/CallControlPanel/Call.d.ts.map +0 -1
  48. package/lib/components/CallControlPanel/Call.js +0 -142
  49. package/lib/components/CallControlPanel/Call.js.map +0 -1
  50. package/lib/components/CallControlPanel/CallControlPanel.d.ts +0 -6
  51. package/lib/components/CallControlPanel/CallControlPanel.d.ts.map +0 -1
  52. package/lib/components/CallControlPanel/CallControlPanel.js +0 -68
  53. package/lib/components/CallControlPanel/CallControlPanel.js.map +0 -1
  54. package/lib/components/CallControlPanel/CallControlPanel.styles.d.ts +0 -15
  55. package/lib/components/CallControlPanel/CallControlPanel.styles.d.ts.map +0 -1
  56. package/lib/components/CallControlPanel/CallControlPanel.styles.js +0 -118
  57. package/lib/components/CallControlPanel/CallControlPanel.styles.js.map +0 -1
  58. package/lib/components/CallControlPanel/CallControlPanel.types.d.ts +0 -112
  59. package/lib/components/CallControlPanel/CallControlPanel.types.d.ts.map +0 -1
  60. package/lib/components/CallControlPanel/CallControlPanel.types.js +0 -2
  61. package/lib/components/CallControlPanel/CallControlPanel.types.js.map +0 -1
  62. package/lib/components/CallControlPanel/CallControlPanelIcon.d.ts +0 -19
  63. package/lib/components/CallControlPanel/CallControlPanelIcon.d.ts.map +0 -1
  64. package/lib/components/CallControlPanel/CallControlPanelIcon.js +0 -74
  65. package/lib/components/CallControlPanel/CallControlPanelIcon.js.map +0 -1
  66. package/lib/components/CallControlPanel/CallTransfer.d.ts +0 -19
  67. package/lib/components/CallControlPanel/CallTransfer.d.ts.map +0 -1
  68. package/lib/components/CallControlPanel/CallTransfer.js +0 -121
  69. package/lib/components/CallControlPanel/CallTransfer.js.map +0 -1
  70. package/lib/components/CallControlPanel/CalleePicker.d.ts +0 -20
  71. package/lib/components/CallControlPanel/CalleePicker.d.ts.map +0 -1
  72. package/lib/components/CallControlPanel/CalleePicker.js +0 -61
  73. package/lib/components/CallControlPanel/CalleePicker.js.map +0 -1
  74. package/lib/components/CallControlPanel/ContactsList.d.ts +0 -23
  75. package/lib/components/CallControlPanel/ContactsList.d.ts.map +0 -1
  76. package/lib/components/CallControlPanel/ContactsList.js +0 -88
  77. package/lib/components/CallControlPanel/ContactsList.js.map +0 -1
  78. package/lib/components/CallControlPanel/DTMFKeypad.d.ts +0 -11
  79. package/lib/components/CallControlPanel/DTMFKeypad.d.ts.map +0 -1
  80. package/lib/components/CallControlPanel/DTMFKeypad.js +0 -23
  81. package/lib/components/CallControlPanel/DTMFKeypad.js.map +0 -1
  82. package/lib/components/CallControlPanel/StopWatch.d.ts +0 -9
  83. package/lib/components/CallControlPanel/StopWatch.d.ts.map +0 -1
  84. package/lib/components/CallControlPanel/StopWatch.js +0 -28
  85. package/lib/components/CallControlPanel/StopWatch.js.map +0 -1
  86. package/lib/components/CallControlPanel/index.d.ts +0 -5
  87. package/lib/components/CallControlPanel/index.d.ts.map +0 -1
  88. package/lib/components/CallControlPanel/index.js +0 -4
  89. package/lib/components/CallControlPanel/index.js.map +0 -1
  90. package/lib/components/CallControlPanel/utils.d.ts +0 -7
  91. package/lib/components/CallControlPanel/utils.d.ts.map +0 -1
  92. package/lib/components/CallControlPanel/utils.js +0 -35
  93. package/lib/components/CallControlPanel/utils.js.map +0 -1
  94. package/lib/components/DialPad/DialPad.d.ts +0 -16
  95. package/lib/components/DialPad/DialPad.d.ts.map +0 -1
  96. package/lib/components/DialPad/DialPad.js +0 -33
  97. package/lib/components/DialPad/DialPad.js.map +0 -1
  98. package/lib/components/DialPad/DialPad.types.d.ts +0 -33
  99. package/lib/components/DialPad/DialPad.types.d.ts.map +0 -1
  100. package/lib/components/DialPad/DialPad.types.js +0 -2
  101. package/lib/components/DialPad/DialPad.types.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 -87
  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 -3
  115. package/lib/components/DialPad/index.d.ts.map +0 -1
  116. package/lib/components/DialPad/index.js +0 -2
  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/IntelligentGuidance/IntelligentGuidance.d.ts +0 -6
  123. package/lib/components/IntelligentGuidance/IntelligentGuidance.d.ts.map +0 -1
  124. package/lib/components/IntelligentGuidance/IntelligentGuidance.js +0 -75
  125. package/lib/components/IntelligentGuidance/IntelligentGuidance.js.map +0 -1
  126. package/lib/components/IntelligentGuidance/IntelligentGuidance.styles.d.ts +0 -9
  127. package/lib/components/IntelligentGuidance/IntelligentGuidance.styles.d.ts.map +0 -1
  128. package/lib/components/IntelligentGuidance/IntelligentGuidance.styles.js +0 -142
  129. package/lib/components/IntelligentGuidance/IntelligentGuidance.styles.js.map +0 -1
  130. package/lib/components/IntelligentGuidance/IntelligentGuidance.types.d.ts +0 -31
  131. package/lib/components/IntelligentGuidance/IntelligentGuidance.types.d.ts.map +0 -1
  132. package/lib/components/IntelligentGuidance/IntelligentGuidance.types.js +0 -2
  133. package/lib/components/IntelligentGuidance/IntelligentGuidance.types.js.map +0 -1
  134. package/lib/components/IntelligentGuidance/index.d.ts +0 -3
  135. package/lib/components/IntelligentGuidance/index.d.ts.map +0 -1
  136. package/lib/components/IntelligentGuidance/index.js +0 -2
  137. package/lib/components/IntelligentGuidance/index.js.map +0 -1
  138. package/lib/components/InteractionNotification/InteractionNotification.d.ts +0 -26
  139. package/lib/components/InteractionNotification/InteractionNotification.d.ts.map +0 -1
  140. package/lib/components/InteractionNotification/InteractionNotification.js +0 -78
  141. package/lib/components/InteractionNotification/InteractionNotification.js.map +0 -1
  142. package/lib/components/InteractionNotification/index.d.ts +0 -2
  143. package/lib/components/InteractionNotification/index.d.ts.map +0 -1
  144. package/lib/components/InteractionNotification/index.js +0 -2
  145. package/lib/components/InteractionNotification/index.js.map +0 -1
  146. package/lib/components/InteractionTimer/InteractionTimer.d.ts +0 -29
  147. package/lib/components/InteractionTimer/InteractionTimer.d.ts.map +0 -1
  148. package/lib/components/InteractionTimer/InteractionTimer.js +0 -72
  149. package/lib/components/InteractionTimer/InteractionTimer.js.map +0 -1
  150. package/lib/components/InteractionTimer/index.d.ts +0 -2
  151. package/lib/components/InteractionTimer/index.d.ts.map +0 -1
  152. package/lib/components/InteractionTimer/index.js +0 -2
  153. package/lib/components/InteractionTimer/index.js.map +0 -1
  154. package/lib/components/TaskManager/Picker/Picker.d.ts +0 -6
  155. package/lib/components/TaskManager/Picker/Picker.d.ts.map +0 -1
  156. package/lib/components/TaskManager/Picker/Picker.js +0 -171
  157. package/lib/components/TaskManager/Picker/Picker.js.map +0 -1
  158. package/lib/components/TaskManager/Picker/Picker.types.d.ts +0 -27
  159. package/lib/components/TaskManager/Picker/Picker.types.d.ts.map +0 -1
  160. package/lib/components/TaskManager/Picker/Picker.types.js +0 -2
  161. package/lib/components/TaskManager/Picker/Picker.types.js.map +0 -1
  162. package/lib/components/TaskManager/TaskManager.context.d.ts +0 -5
  163. package/lib/components/TaskManager/TaskManager.context.d.ts.map +0 -1
  164. package/lib/components/TaskManager/TaskManager.context.js +0 -3
  165. package/lib/components/TaskManager/TaskManager.context.js.map +0 -1
  166. package/lib/components/TaskManager/TaskManager.d.ts +0 -6
  167. package/lib/components/TaskManager/TaskManager.d.ts.map +0 -1
  168. package/lib/components/TaskManager/TaskManager.js +0 -76
  169. package/lib/components/TaskManager/TaskManager.js.map +0 -1
  170. package/lib/components/TaskManager/TaskManager.styles.d.ts +0 -20
  171. package/lib/components/TaskManager/TaskManager.styles.d.ts.map +0 -1
  172. package/lib/components/TaskManager/TaskManager.styles.js +0 -232
  173. package/lib/components/TaskManager/TaskManager.styles.js.map +0 -1
  174. package/lib/components/TaskManager/TaskManager.types.d.ts +0 -74
  175. package/lib/components/TaskManager/TaskManager.types.d.ts.map +0 -1
  176. package/lib/components/TaskManager/TaskManager.types.js +0 -2
  177. package/lib/components/TaskManager/TaskManager.types.js.map +0 -1
  178. package/lib/components/TaskManager/TaskManagerTabs.d.ts +0 -6
  179. package/lib/components/TaskManager/TaskManagerTabs.d.ts.map +0 -1
  180. package/lib/components/TaskManager/TaskManagerTabs.js +0 -159
  181. package/lib/components/TaskManager/TaskManagerTabs.js.map +0 -1
  182. package/lib/components/TaskManager/TaskView.d.ts +0 -6
  183. package/lib/components/TaskManager/TaskView.d.ts.map +0 -1
  184. package/lib/components/TaskManager/TaskView.js +0 -10
  185. package/lib/components/TaskManager/TaskView.js.map +0 -1
  186. package/lib/components/TaskManager/index.d.ts +0 -5
  187. package/lib/components/TaskManager/index.d.ts.map +0 -1
  188. package/lib/components/TaskManager/index.js +0 -4
  189. package/lib/components/TaskManager/index.js.map +0 -1
  190. package/lib/index.d.ts +0 -18
  191. package/lib/index.d.ts.map +0 -1
  192. package/lib/index.js +0 -19
  193. package/lib/index.js.map +0 -1
@@ -1,78 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { forwardRef } from 'react';
3
- import styled, { css } from 'styled-components';
4
- import { Button, Card, CardContent, CardHeader, Status, Text, SummaryItem, defaultThemeProp, Flex, StyledText, Avatar, FieldValueList, StyledFieldName, CardFooter, StyledFieldValueList, StyledButton, useI18n, useDirection } from '@pega/cosmos-react-core';
5
- import { StyledCardContent } from '@pega/cosmos-react-core/lib/components/Card/CardContent';
6
- import { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';
7
- import { StyledCardFooter } from '@pega/cosmos-react-core/lib/components/Card/CardFooter';
8
- const StyledInteractionNotification = styled(Card)(({ theme: { base } }) => {
9
- const { rtl } = useDirection();
10
- return css `
11
- position: fixed;
12
- inset-inline-end: 1rem;
13
- inset-block-start: 4rem;
14
- width: clamp(21.5rem, calc(100% - 2rem), 25rem);
15
- z-index: ${base['z-index'].modal};
16
- color: ${base.colors.white};
17
- animation: SlideIn calc(4 * ${base.animation.speed});
18
- padding: calc(0.75 * ${base.spacing}) 0;
19
-
20
- &:not(& &) {
21
- background-color: ${base.colors.slate['extra-dark']};
22
- }
23
-
24
- @keyframes SlideIn {
25
- 0% {
26
- ${rtl
27
- ? css `
28
- transform: translateX(calc(-100% - 1rem));
29
- `
30
- : css `
31
- transform: translateX(calc(100% + 1rem));
32
- `}
33
- }
34
-
35
- 100% {
36
- transform: translateX(0);
37
- }
38
- }
39
-
40
- ${StyledCardHeader} {
41
- ${StyledButton} {
42
- margin-inline-start: calc(2 * ${base.spacing});
43
- }
44
- }
45
-
46
- ${StyledCardContent} {
47
- margin: calc(2 * ${base.spacing}) 0;
48
-
49
- ${StyledText} {
50
- color: ${base.colors.white};
51
- white-space: nowrap;
52
- overflow: hidden;
53
- text-overflow: ellipsis;
54
- width: 100%;
55
- text-align: center;
56
- }
57
- }
58
-
59
- ${StyledCardFooter} {
60
- ${StyledFieldValueList} {
61
- border-top: solid 0.0625rem ${base.colors.gray.medium};
62
- padding-top: calc(2 * ${base.spacing});
63
- color: ${base.colors.white};
64
-
65
- ${StyledFieldName} {
66
- color: ${base.colors.white};
67
- }
68
- }
69
- }
70
- `;
71
- });
72
- StyledInteractionNotification.defaultProps = defaultThemeProp;
73
- const InteractionNotification = forwardRef(({ icon, title, primaryText, secondaryText, status, fields, onAccept }, ref) => {
74
- const t = useI18n();
75
- return (_jsxs(StyledInteractionNotification, { ref: ref, children: [_jsx(CardHeader, { actions: _jsx(Button, { variant: 'primary', onClick: onAccept, children: t('accept') }, void 0), children: _jsx(SummaryItem, { visual: _jsx(Avatar, { shape: 'circle', size: 'm', name: title, icon: icon }, void 0), primary: title }, void 0) }, void 0), _jsx(CardContent, { children: _jsxs(Flex, { container: { direction: 'column', alignItems: 'center', gap: 1 }, children: [_jsx(Text, { variant: 'h1', children: primaryText }, void 0), secondaryText && _jsx(Text, { variant: 'secondary', children: secondaryText }, void 0), _jsx(Status, { variant: status.variant, children: status.text }, void 0)] }, void 0) }, void 0), fields && fields.length !== 0 && (_jsx(CardFooter, { children: _jsx(FieldValueList, { variant: 'inline', fields: fields }, void 0) }, void 0))] }, void 0));
76
- });
77
- export default InteractionNotification;
78
- //# sourceMappingURL=InteractionNotification.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InteractionNotification.js","sourceRoot":"","sources":["../../../src/components/InteractionNotification/InteractionNotification.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Card,\n CardContent,\n CardHeader,\n Status,\n Text,\n SummaryItem,\n StatusProps,\n ForwardProps,\n defaultThemeProp,\n Flex,\n StyledText,\n Avatar,\n FieldValueList,\n StyledFieldName,\n CardFooter,\n StyledFieldValueList,\n StyledButton,\n useI18n,\n FieldValueListProps,\n useDirection,\n NoChildrenProp\n} from '@pega/cosmos-react-core';\nimport { StyledCardContent } from '@pega/cosmos-react-core/lib/components/Card/CardContent';\nimport { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';\nimport { StyledCardFooter } from '@pega/cosmos-react-core/lib/components/Card/CardFooter';\n\nexport interface InteractionNotificationProps extends NoChildrenProp {\n /** Ref to Component. */\n ref?: Ref<HTMLDivElement>;\n /** Name of the icon used in header. */\n icon: string;\n /** Interaction title. */\n title: string;\n /** Primary information of the notification. For example caller name . */\n primaryText: string;\n /** Secondary information of the notification. For example phone number of the caller */\n secondaryText?: string;\n /** Represents the current status of interaction. */\n status: { variant: StatusProps['variant']; text: string };\n /** Information structured as field values to be displayed below main section. */\n fields?: FieldValueListProps['fields'];\n /** Callback when accept button is clicked. */\n onAccept?: () => void;\n}\n\nconst StyledInteractionNotification = styled(Card)(({ theme: { base } }) => {\n const { rtl } = useDirection();\n return css`\n position: fixed;\n inset-inline-end: 1rem;\n inset-block-start: 4rem;\n width: clamp(21.5rem, calc(100% - 2rem), 25rem);\n z-index: ${base['z-index'].modal};\n color: ${base.colors.white};\n animation: SlideIn calc(4 * ${base.animation.speed});\n padding: calc(0.75 * ${base.spacing}) 0;\n\n &:not(& &) {\n background-color: ${base.colors.slate['extra-dark']};\n }\n\n @keyframes SlideIn {\n 0% {\n ${rtl\n ? css`\n transform: translateX(calc(-100% - 1rem));\n `\n : css`\n transform: translateX(calc(100% + 1rem));\n `}\n }\n\n 100% {\n transform: translateX(0);\n }\n }\n\n ${StyledCardHeader} {\n ${StyledButton} {\n margin-inline-start: calc(2 * ${base.spacing});\n }\n }\n\n ${StyledCardContent} {\n margin: calc(2 * ${base.spacing}) 0;\n\n ${StyledText} {\n color: ${base.colors.white};\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n width: 100%;\n text-align: center;\n }\n }\n\n ${StyledCardFooter} {\n ${StyledFieldValueList} {\n border-top: solid 0.0625rem ${base.colors.gray.medium};\n padding-top: calc(2 * ${base.spacing});\n color: ${base.colors.white};\n\n ${StyledFieldName} {\n color: ${base.colors.white};\n }\n }\n }\n `;\n});\n\nStyledInteractionNotification.defaultProps = defaultThemeProp;\n\nconst InteractionNotification: FunctionComponent<InteractionNotificationProps & ForwardProps> =\n forwardRef(\n (\n {\n icon,\n title,\n primaryText,\n secondaryText,\n status,\n fields,\n onAccept\n }: PropsWithoutRef<InteractionNotificationProps>,\n ref: InteractionNotificationProps['ref']\n ) => {\n const t = useI18n();\n\n return (\n <StyledInteractionNotification ref={ref}>\n <CardHeader\n actions={\n <Button variant='primary' onClick={onAccept}>\n {t('accept')}\n </Button>\n }\n >\n <SummaryItem\n visual={<Avatar shape='circle' size='m' name={title} icon={icon} />}\n primary={title}\n />\n </CardHeader>\n <CardContent>\n <Flex container={{ direction: 'column', alignItems: 'center', gap: 1 }}>\n <Text variant='h1'>{primaryText}</Text>\n {secondaryText && <Text variant='secondary'>{secondaryText}</Text>}\n <Status variant={status.variant}>{status.text}</Status>\n </Flex>\n </CardContent>\n {fields && fields.length !== 0 && (\n <CardFooter>\n <FieldValueList variant='inline' fields={fields} />\n </CardFooter>\n )}\n </StyledInteractionNotification>\n );\n }\n );\n\nexport default InteractionNotification;\n"]}
@@ -1,2 +0,0 @@
1
- export { default } from './InteractionNotification';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/InteractionNotification/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC"}
@@ -1,2 +0,0 @@
1
- export { default } from './InteractionNotification';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/InteractionNotification/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC","sourcesContent":["export { default } from './InteractionNotification';\n"]}
@@ -1,29 +0,0 @@
1
- import { FunctionComponent, Ref } from 'react';
2
- import { BaseProps, AsProp, ForwardProps, NoChildrenProp } from '@pega/cosmos-react-core';
3
- export interface InteractionTimerProps extends BaseProps, AsProp, NoChildrenProp {
4
- /** Name of the icon */
5
- icon: string;
6
- /** Ref to Component */
7
- ref?: Ref<HTMLDivElement>;
8
- /** Current Sla. This is used to display progress ring color. */
9
- sla?: 'goal' | 'deadline' | 'past-deadline';
10
- /** Progress % of the current stage
11
- * @default 0
12
- */
13
- progress?: number;
14
- /** Indicates if there are any unread notifications
15
- * @default false
16
- */
17
- hasNotifications?: boolean;
18
- /** Meta info */
19
- meta?: string;
20
- /** Aria label for screen readers. */
21
- ariaLabel?: string;
22
- }
23
- export declare const StyledInteractionTimerIconWrapper: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
24
- export declare const StyledInteractionTimerIcon: import("styled-components").StyledComponent<"svg", import("styled-components").DefaultTheme, {}, never>;
25
- export declare const StyledInteractionTimerMetaText: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
26
- export declare const StyledInteractionTimer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("@pega/cosmos-react-core").OmitStrict<InteractionTimerProps, "sla"> & Required<Pick<InteractionTimerProps, "sla">>, never>;
27
- declare const InteractionTimer: FunctionComponent<InteractionTimerProps & ForwardProps>;
28
- export default InteractionTimer;
29
- //# sourceMappingURL=InteractionTimer.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InteractionTimer.d.ts","sourceRoot":"","sources":["../../../src/components/InteractionTimer/InteractionTimer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAG5E,OAAO,EACL,SAAS,EACT,MAAM,EAKN,YAAY,EAIZ,cAAc,EACf,MAAM,yBAAyB,CAAC;AAEjC,MAAM,WAAW,qBAAsB,SAAQ,SAAS,EAAE,MAAM,EAAE,cAAc;IAC9E,uBAAuB;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,uBAAuB;IACvB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,gEAAgE;IAChE,GAAG,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,eAAe,CAAC;IAC5C;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,gBAAgB;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,iCAAiC,0GAAgB,CAAC;AAC/D,eAAO,MAAM,0BAA0B,yGAAe,CAAC;AACvD,eAAO,MAAM,8BAA8B,0GAAgB,CAAC;AAI5D,eAAO,MAAM,sBAAsB,gOAgElC,CAAC;AAIF,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CA4C7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
@@ -1,72 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { forwardRef } from 'react';
3
- import styled, { css } from 'styled-components';
4
- import { Flex, Icon, Text, Progress, defaultThemeProp, StyledProgressRing } from '@pega/cosmos-react-core';
5
- export const StyledInteractionTimerIconWrapper = styled.span ``;
6
- export const StyledInteractionTimerIcon = styled.svg ``;
7
- export const StyledInteractionTimerMetaText = styled.span ``;
8
- export const StyledInteractionTimer = styled.div(({ sla, hasNotifications, theme: { components: { 'interaction-timer': InteractionTimerTheme } }, theme }) => {
9
- return css `
10
- width: calc(8 * ${theme.base.spacing});
11
- flex-shrink: 0;
12
-
13
- ${StyledInteractionTimerIconWrapper} {
14
- font-size: 2.2rem;
15
- position: relative;
16
- display: inline-flex;
17
- padding: calc(0.3 * ${theme.base.spacing});
18
- ${hasNotifications &&
19
- css `
20
- &::after {
21
- position: absolute;
22
- background-color: ${InteractionTimerTheme['notification-indicator']};
23
- border-radius: 50%;
24
- content: '';
25
- top: 0;
26
- right: 0;
27
- width: 0.3rem;
28
- height: 0.3rem;
29
- }
30
- `}
31
- }
32
-
33
- ${StyledProgressRing} {
34
- circle {
35
- stroke-width: 1;
36
- stroke: ${sla
37
- ? InteractionTimerTheme.sla[sla].progress['secondary-color']
38
- : 'currentcolor'};
39
- }
40
- circle + circle {
41
- stroke: ${sla
42
- ? InteractionTimerTheme.sla[sla].progress['primary-color']
43
- : 'currentcolor'};
44
- }
45
- }
46
- ${StyledInteractionTimerIcon} {
47
- font-size: 1.5rem;
48
- margin: auto;
49
- position: absolute;
50
- display: inline-flex;
51
- top: 0;
52
- left: 0;
53
- bottom: 0;
54
- right: 0;
55
- width: 100%;
56
- align-items: center;
57
- justify-content: center;
58
- }
59
- ${StyledInteractionTimerMetaText} {
60
- color: inherit;
61
- }
62
- `;
63
- });
64
- StyledInteractionTimer.defaultProps = defaultThemeProp;
65
- const InteractionTimer = forwardRef(({ icon, progress = 0, hasNotifications = false, meta, sla, ariaLabel, ...restProps }, ref) => {
66
- return (_jsxs(Flex, { ...restProps, ref: ref, container: {
67
- direction: 'column',
68
- alignItems: 'center'
69
- }, sla: sla, hasNotifications: hasNotifications, as: StyledInteractionTimer, "aria-label": ariaLabel, children: [_jsxs(StyledInteractionTimerIconWrapper, { children: [_jsx(Icon, { name: icon, as: StyledInteractionTimerIcon }, void 0), _jsx(Progress, { variant: 'ring', minValue: 0, maxValue: 100, value: progress, placement: 'inline' }, void 0)] }, void 0), meta && (_jsx(Text, { variant: 'secondary', as: StyledInteractionTimerMetaText, children: meta }, void 0))] }, void 0));
70
- });
71
- export default InteractionTimer;
72
- //# sourceMappingURL=InteractionTimer.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InteractionTimer.js","sourceRoot":"","sources":["../../../src/components/InteractionTimer/InteractionTimer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA2C,MAAM,OAAO,CAAC;AAC5E,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAGL,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,QAAQ,EAER,gBAAgB,EAChB,kBAAkB,EAGnB,MAAM,yBAAyB,CAAC;AAuBjC,MAAM,CAAC,MAAM,iCAAiC,GAAG,MAAM,CAAC,IAAI,CAAA,EAAE,CAAC;AAC/D,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AACvD,MAAM,CAAC,MAAM,8BAA8B,GAAG,MAAM,CAAC,IAAI,CAAA,EAAE,CAAC;AAI5D,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAC9C,CAAC,EACC,GAAG,EACH,gBAAgB,EAChB,KAAK,EAAE,EACL,UAAU,EAAE,EAAE,mBAAmB,EAAE,qBAAqB,EAAE,EAC3D,EACD,KAAK,EACN,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;wBACU,KAAK,CAAC,IAAI,CAAC,OAAO;;;QAGlC,iCAAiC;;;;8BAIX,KAAK,CAAC,IAAI,CAAC,OAAO;UACtC,gBAAgB;QAClB,GAAG,CAAA;;;gCAGqB,qBAAqB,CAAC,wBAAwB,CAAC;;;;;;;;SAQtE;;;QAGD,kBAAkB;;;oBAGN,GAAG;QACX,CAAC,CAAC,qBAAqB,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,iBAAiB,CAAC;QAC5D,CAAC,CAAC,cAAc;;;oBAGR,GAAG;QACX,CAAC,CAAC,qBAAqB,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,eAAe,CAAC;QAC1D,CAAC,CAAC,cAAc;;;QAGpB,0BAA0B;;;;;;;;;;;;;QAa1B,8BAA8B;;;KAGjC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,gBAAgB,GAA4D,UAAU,CAC1F,CACE,EACE,IAAI,EACJ,QAAQ,GAAG,CAAC,EACZ,gBAAgB,GAAG,KAAK,EACxB,IAAI,EACJ,GAAG,EACH,SAAS,EACT,GAAG,SAAS,EAC2B,EACzC,GAAiC,EACjC,EAAE;IACF,OAAO,CACL,MAAC,IAAI,OACC,SAAS,EACb,GAAG,EAAE,GAAG,EACR,SAAS,EAAE;YACT,SAAS,EAAE,QAAQ;YACnB,UAAU,EAAE,QAAQ;SACrB,EACD,GAAG,EAAE,GAAG,EACR,gBAAgB,EAAE,gBAAgB,EAClC,EAAE,EAAE,sBAAsB,gBACd,SAAS,aAErB,MAAC,iCAAiC,eAChC,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,0BAA0B,WAAI,EACpD,KAAC,QAAQ,IACP,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,CAAC,EACX,QAAQ,EAAE,GAAG,EACb,KAAK,EAAE,QAAQ,EACf,SAAS,EAAC,QAAQ,WAClB,YACgC,EACnC,IAAI,IAAI,CACP,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,EAAC,EAAE,EAAE,8BAA8B,YACzD,IAAI,WACA,CACR,YACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n BaseProps,\n AsProp,\n Flex,\n Icon,\n Text,\n Progress,\n ForwardProps,\n defaultThemeProp,\n StyledProgressRing,\n PropsWithDefaults,\n NoChildrenProp\n} from '@pega/cosmos-react-core';\n\nexport interface InteractionTimerProps extends BaseProps, AsProp, NoChildrenProp {\n /** Name of the icon */\n icon: string;\n /** Ref to Component */\n ref?: Ref<HTMLDivElement>;\n /** Current Sla. This is used to display progress ring color. */\n sla?: 'goal' | 'deadline' | 'past-deadline';\n /** Progress % of the current stage\n * @default 0\n */\n progress?: number;\n /** Indicates if there are any unread notifications\n * @default false\n */\n hasNotifications?: boolean;\n /** Meta info */\n meta?: string;\n /** Aria label for screen readers. */\n ariaLabel?: string;\n}\n\nexport const StyledInteractionTimerIconWrapper = styled.span``;\nexport const StyledInteractionTimerIcon = styled.svg``;\nexport const StyledInteractionTimerMetaText = styled.span``;\n\ntype InteractionTimerPropsWithDefaults = PropsWithDefaults<InteractionTimerProps, 'sla'>;\n\nexport const StyledInteractionTimer = styled.div<InteractionTimerPropsWithDefaults>(\n ({\n sla,\n hasNotifications,\n theme: {\n components: { 'interaction-timer': InteractionTimerTheme }\n },\n theme\n }) => {\n return css`\n width: calc(8 * ${theme.base.spacing});\n flex-shrink: 0;\n\n ${StyledInteractionTimerIconWrapper} {\n font-size: 2.2rem;\n position: relative;\n display: inline-flex;\n padding: calc(0.3 * ${theme.base.spacing});\n ${hasNotifications &&\n css`\n &::after {\n position: absolute;\n background-color: ${InteractionTimerTheme['notification-indicator']};\n border-radius: 50%;\n content: '';\n top: 0;\n right: 0;\n width: 0.3rem;\n height: 0.3rem;\n }\n `}\n }\n\n ${StyledProgressRing} {\n circle {\n stroke-width: 1;\n stroke: ${sla\n ? InteractionTimerTheme.sla[sla].progress['secondary-color']\n : 'currentcolor'};\n }\n circle + circle {\n stroke: ${sla\n ? InteractionTimerTheme.sla[sla].progress['primary-color']\n : 'currentcolor'};\n }\n }\n ${StyledInteractionTimerIcon} {\n font-size: 1.5rem;\n margin: auto;\n position: absolute;\n display: inline-flex;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n width: 100%;\n align-items: center;\n justify-content: center;\n }\n ${StyledInteractionTimerMetaText} {\n color: inherit;\n }\n `;\n }\n);\n\nStyledInteractionTimer.defaultProps = defaultThemeProp;\n\nconst InteractionTimer: FunctionComponent<InteractionTimerProps & ForwardProps> = forwardRef(\n (\n {\n icon,\n progress = 0,\n hasNotifications = false,\n meta,\n sla,\n ariaLabel,\n ...restProps\n }: PropsWithoutRef<InteractionTimerProps>,\n ref: InteractionTimerProps['ref']\n ) => {\n return (\n <Flex\n {...restProps}\n ref={ref}\n container={{\n direction: 'column',\n alignItems: 'center'\n }}\n sla={sla}\n hasNotifications={hasNotifications}\n as={StyledInteractionTimer}\n aria-label={ariaLabel}\n >\n <StyledInteractionTimerIconWrapper>\n <Icon name={icon} as={StyledInteractionTimerIcon} />\n <Progress\n variant='ring'\n minValue={0}\n maxValue={100}\n value={progress}\n placement='inline'\n />\n </StyledInteractionTimerIconWrapper>\n {meta && (\n <Text variant='secondary' as={StyledInteractionTimerMetaText}>\n {meta}\n </Text>\n )}\n </Flex>\n );\n }\n);\n\nexport default InteractionTimer;\n"]}
@@ -1,2 +0,0 @@
1
- export { default, InteractionTimerProps } from './InteractionTimer';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/InteractionTimer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,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,EAAyB,MAAM,oBAAoB,CAAC","sourcesContent":["export { default, 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/TaskManager/Picker/Picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAML,YAAY,EASb,MAAM,yBAAyB,CAAC;AAOjC,OAAO,EAA8B,WAAW,EAAqB,MAAM,gBAAgB,CAAC;AAmI5F,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAiLzD,CAAC;AAEF,eAAe,MAAM,CAAC"}
@@ -1,171 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'react';
3
- import styled, { css } from 'styled-components';
4
- import { Button, Count, defaultThemeProp, Flex, registerIcon, Icon, Menu, menuHelpers, EmptyState, SearchInput, SummaryItem, Text, useI18n } from '@pega/cosmos-react-core';
5
- import { DragDropList, DragDropManager } from '@pega/cosmos-react-dnd';
6
- import * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';
7
- import * as dragIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/drag.icon';
8
- import * as trashIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/trash.icon';
9
- registerIcon(timesIcon, dragIcon, trashIcon);
10
- const StyledPickerHeader = styled.div(({ theme }) => {
11
- return css `
12
- padding-inline-start: calc(2 * ${theme.base.spacing});
13
- `;
14
- });
15
- StyledPickerHeader.defaultProps = defaultThemeProp;
16
- const StyledAddTasks = styled.div(({ theme }) => {
17
- return css `
18
- /* temporary remove height once list is replaced with flat list */
19
- height: calc(45 * 0.5rem);
20
- flex-basis: 50%;
21
- padding: 0 ${theme.base.spacing} ${theme.base.spacing};
22
- header {
23
- padding-top: 0;
24
- border-bottom: none;
25
- }
26
- `;
27
- });
28
- StyledAddTasks.defaultProps = defaultThemeProp;
29
- const StyledSelectedTasks = styled.div(({ theme }) => {
30
- return css `
31
- flex-basis: 50%;
32
- padding: 0 ${theme.base.spacing} ${theme.base.spacing};
33
- border-inline-start: 0.0625rem solid ${theme.base.palette['border-line']};
34
- > h3 {
35
- padding: 0 0 ${theme.base.spacing} ${theme.base.spacing};
36
- }
37
- `;
38
- });
39
- StyledSelectedTasks.defaultProps = defaultThemeProp;
40
- const StyledSummaryItem = styled(SummaryItem)(({ theme }) => {
41
- return css `
42
- padding: ${theme.base.spacing} 0;
43
- &:not(:last-child) {
44
- border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};
45
- }
46
- `;
47
- });
48
- StyledSummaryItem.defaultProps = defaultThemeProp;
49
- const StyledPickerFooter = styled.div(({ theme }) => {
50
- return css `
51
- border-top: 0.0625rem solid ${theme.base.palette['border-line']};
52
- padding: ${theme.base.spacing};
53
- `;
54
- });
55
- StyledPickerFooter.defaultProps = defaultThemeProp;
56
- const StyledDDList = styled.ul `
57
- height: 20rem;
58
- overflow-y: auto;
59
- `;
60
- const StyledPicker = styled.div `
61
- height: 100%;
62
- `;
63
- const StyledDragHandle = styled.div `
64
- cursor: move;
65
- > svg {
66
- display: block;
67
- }
68
- `;
69
- const StyledCount = styled(Count)(({ theme }) => {
70
- return css `
71
- margin-inline-start: calc(0.5 * ${theme.base.spacing});
72
- `;
73
- });
74
- StyledCount.defaultProps = defaultThemeProp;
75
- const SelectedItemRenderer = ({ dragRef, previewRef, data }) => {
76
- const t = useI18n();
77
- return (_jsx(StyledSummaryItem, { ref: previewRef, visual: _jsx(StyledDragHandle, { ref: dragRef, children: _jsx(Icon, { name: 'drag' }, void 0) }, void 0), primary: data?.primary, secondary: data?.secondary, actions: _jsx(Button, { variant: 'simple', icon: true, label: t('task_manager_delete_task'), onClick: () => data?.onRemoveItem(data.id), children: _jsx(Icon, { name: 'trash' }, void 0) }, void 0) }, void 0));
78
- };
79
- const DraggableSelectedList = ({ selectedItems, onChange, itemRenderer }) => {
80
- return (_jsx(DragDropManager, { children: _jsx(DragDropList, { as: StyledDDList, accept: 'string', items: selectedItems.map(item => ({
81
- id: item.id,
82
- type: 'string',
83
- data: item
84
- })), itemRenderer: itemRenderer, onChange: onChange }, void 0) }, void 0));
85
- };
86
- const Picker = forwardRef(({ id, items, emptyText, title, placeholder, onAdd, onCancel, ...restProps }, ref) => {
87
- const t = useI18n();
88
- const [initialItems, setItems] = useState(items);
89
- const [searchInput, setSearchInput] = useState('');
90
- const filterRegex = new RegExp(searchInput.replace(/[.*+\-?^${}()|[\]\\]/g, '\\$&'), 'i');
91
- const [selections, setSelections] = useState([]);
92
- const searchEleRef = useRef(null);
93
- useEffect(() => {
94
- setItems(items);
95
- }, [items]);
96
- const onKeydown = useCallback(({ key }) => {
97
- if (key === 'Escape')
98
- onCancel?.();
99
- }, [onCancel]);
100
- useEffect(() => {
101
- document.addEventListener('keydown', onKeydown);
102
- return () => {
103
- document.removeEventListener('keydown', onKeydown);
104
- };
105
- }, []);
106
- const renderItems = useMemo(() => {
107
- return menuHelpers.mapTree(searchInput
108
- ? menuHelpers
109
- .flatten(initialItems)
110
- .filter(({ primary, items: childItems }) => {
111
- return filterRegex.test(primary) && !childItems?.length;
112
- })
113
- : initialItems, item => {
114
- let selectable = false;
115
- if (!item.items) {
116
- selectable = true;
117
- }
118
- return {
119
- ...item,
120
- selected: selectable ? !!item.selected : undefined
121
- };
122
- });
123
- }, [searchInput, initialItems, filterRegex]);
124
- const removeTasks = useCallback((uid) => {
125
- setItems((cur) => menuHelpers.toggleSelected(cur, uid, 'multi-select'));
126
- setSelections(cur => {
127
- const itemToRemove = menuHelpers.getItem(cur, uid);
128
- return cur.filter(item => item.id !== itemToRemove?.id);
129
- });
130
- }, []);
131
- return (_jsxs(Flex, { as: StyledPicker, container: { direction: 'column' }, ref: ref, id: id, children: [_jsxs(Flex, { as: StyledPickerHeader, container: { justify: 'between', alignItems: 'center', pad: 1 }, children: [_jsx(Text, { variant: 'h3', children: t('add_tasks') }, void 0), _jsx(Button, { variant: 'simple', onClick: onCancel, "aria-label": t('task_picker_close'), icon: true, children: _jsx(Icon, { name: 'times' }, void 0) }, void 0)] }, void 0), _jsxs(Flex, { container: true, children: [_jsx(Flex, { as: StyledAddTasks, children: _jsx(Menu, { items: renderItems, onItemClick: (uid) => {
132
- const clickedItem = menuHelpers.getItem(renderItems, uid);
133
- const parentItem = menuHelpers.getParentItem(renderItems, uid);
134
- if (clickedItem) {
135
- setItems((cur) => menuHelpers.toggleSelected(cur, uid, 'multi-select'));
136
- if (selections.find(item => item.id === uid)) {
137
- setSelections(cur => cur.filter(item => item.id !== clickedItem?.id));
138
- }
139
- else {
140
- setSelections(cur => {
141
- let secondary;
142
- if (parentItem)
143
- secondary = menuHelpers.isItem(parentItem)
144
- ? parentItem.primary
145
- : parentItem.label;
146
- return [
147
- ...cur,
148
- {
149
- ...clickedItem,
150
- secondary,
151
- onRemoveItem: removeTasks
152
- }
153
- ];
154
- });
155
- }
156
- setSearchInput('');
157
- }
158
- }, focusControlEl: searchEleRef.current || undefined, emptyText: emptyText || t('no_items'), accent: filterRegex, ...restProps, mode: 'multi-select', header: _jsx(Flex, { container: { direction: 'column', gap: 1 }, children: _jsx(SearchInput, { ref: searchEleRef, value: searchInput, onSearchChange: setSearchInput, placeholder: placeholder || t('search_placeholder_default'), autoFocus: true }, void 0) }, void 0) }, void 0) }, void 0), _jsxs(Flex, { as: StyledSelectedTasks, container: { direction: 'column' }, children: [_jsx(Text, { variant: 'h3', children: t('selected_tasks') }, void 0), selections.length > 0 ? (_jsx(DraggableSelectedList, { selectedItems: selections, onChange: newItems => {
159
- setSelections(newItems.map(({ type, data }) => ({
160
- ...data,
161
- type
162
- })));
163
- }, itemRenderer: SelectedItemRenderer }, void 0)) : (_jsx(EmptyState, { message: t('no_selected_tasks') }, void 0))] }, void 0)] }, void 0), _jsxs(Flex, { as: StyledPickerFooter, container: { justify: 'between' }, children: [_jsx(Button, { onClick: onCancel, "aria-label": t('cancel'), children: "Cancel" }, void 0), _jsxs(Button, { variant: 'primary', disabled: !selections.length, onClick: () => {
164
- onAdd?.(selections);
165
- setItems(initialItems);
166
- }, "aria-label": t('task_manager_picker_add_label', [selections?.length], {
167
- count: selections?.length
168
- }), children: [t('add'), !!selections?.length && _jsx(StyledCount, { children: selections.length }, void 0)] }, void 0)] }, void 0)] }, void 0));
169
- });
170
- export default Picker;
171
- //# sourceMappingURL=Picker.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Picker.js","sourceRoot":"","sources":["../../../../src/components/TaskManager/Picker/Picker.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Count,\n defaultThemeProp,\n Flex,\n registerIcon,\n ForwardProps,\n Icon,\n Menu,\n menuHelpers,\n EmptyState,\n SearchInput,\n SummaryItem,\n Text,\n useI18n\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';\n\nregisterIcon(timesIcon, dragIcon, trashIcon);\n\nconst StyledPickerHeader = styled.div(({ theme }) => {\n return css`\n padding-inline-start: calc(2 * ${theme.base.spacing});\n `;\n});\nStyledPickerHeader.defaultProps = defaultThemeProp;\n\nconst StyledAddTasks = styled.div(({ theme }) => {\n return css`\n /* temporary remove height once list is replaced with flat list */\n height: calc(45 * 0.5rem);\n flex-basis: 50%;\n padding: 0 ${theme.base.spacing} ${theme.base.spacing};\n header {\n padding-top: 0;\n border-bottom: none;\n }\n `;\n});\nStyledAddTasks.defaultProps = defaultThemeProp;\n\nconst StyledSelectedTasks = styled.div(({ theme }) => {\n return css`\n flex-basis: 50%;\n padding: 0 ${theme.base.spacing} ${theme.base.spacing};\n border-inline-start: 0.0625rem solid ${theme.base.palette['border-line']};\n > h3 {\n padding: 0 0 ${theme.base.spacing} ${theme.base.spacing};\n }\n `;\n});\nStyledSelectedTasks.defaultProps = defaultThemeProp;\n\nconst StyledSummaryItem = styled(SummaryItem)(({ theme }) => {\n return css`\n padding: ${theme.base.spacing} 0;\n &:not(:last-child) {\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n }\n `;\n});\nStyledSummaryItem.defaultProps = defaultThemeProp;\n\nconst StyledPickerFooter = styled.div(({ theme }) => {\n return css`\n border-top: 0.0625rem solid ${theme.base.palette['border-line']};\n padding: ${theme.base.spacing};\n `;\n});\nStyledPickerFooter.defaultProps = defaultThemeProp;\n\nconst StyledDDList = styled.ul`\n height: 20rem;\n overflow-y: auto;\n`;\n\nconst StyledPicker = styled.div`\n height: 100%;\n`;\n\nconst StyledDragHandle = styled.div`\n cursor: move;\n > svg {\n display: block;\n }\n`;\n\nconst StyledCount = styled(Count)(({ theme }) => {\n return css`\n margin-inline-start: calc(0.5 * ${theme.base.spacing});\n `;\n});\n\nStyledCount.defaultProps = defaultThemeProp;\n\nconst SelectedItemRenderer = ({\n dragRef,\n previewRef,\n data\n}: ItemRendererProps<SelectedItemProps>) => {\n const t = useI18n();\n return (\n <StyledSummaryItem\n ref={previewRef}\n visual={\n <StyledDragHandle ref={dragRef}>\n <Icon name='drag' />\n </StyledDragHandle>\n }\n primary={data?.primary}\n secondary={data?.secondary}\n actions={\n <Button\n variant='simple'\n icon\n label={t('task_manager_delete_task')}\n onClick={() => data?.onRemoveItem(data.id)}\n >\n <Icon name='trash' />\n </Button>\n }\n />\n );\n};\n\nconst DraggableSelectedList = ({\n selectedItems,\n onChange,\n itemRenderer\n}: DraggableSelectedListProps) => {\n return (\n <DragDropManager>\n <DragDropList\n as={StyledDDList}\n accept='string'\n items={selectedItems.map(item => ({\n id: item.id,\n type: 'string',\n data: item\n }))}\n itemRenderer={itemRenderer}\n onChange={onChange}\n />\n </DragDropManager>\n );\n};\n\nconst Picker: FunctionComponent<PickerProps & ForwardProps> = forwardRef(\n (\n {\n id,\n items,\n emptyText,\n title,\n placeholder,\n onAdd,\n onCancel,\n ...restProps\n }: PropsWithoutRef<PickerProps>,\n ref: PickerProps['ref']\n ) => {\n const t = useI18n();\n\n const [initialItems, setItems] = useState<PickerProps['items']>(items);\n\n const [searchInput, setSearchInput] = useState('');\n\n const filterRegex = new RegExp(searchInput.replace(/[.*+\\-?^${}()|[\\]\\\\]/g, '\\\\$&'), 'i');\n const [selections, setSelections] = useState<SelectedItemProps[]>([]);\n const searchEleRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n setItems(items);\n }, [items]);\n\n const onKeydown = useCallback(\n ({ key }: KeyboardEvent) => {\n if (key === 'Escape') onCancel?.();\n },\n [onCancel]\n );\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, []);\n\n const renderItems = useMemo(() => {\n return menuHelpers.mapTree(\n searchInput\n ? menuHelpers\n .flatten(initialItems)\n .filter(({ primary, items: childItems }: MenuItemProps) => {\n return filterRegex.test(primary) && !childItems?.length;\n })\n : initialItems,\n item => {\n let selectable = false;\n if (!item.items) {\n selectable = true;\n }\n return {\n ...item,\n selected: selectable ? !!item.selected : undefined\n };\n }\n );\n }, [searchInput, initialItems, filterRegex]);\n\n const removeTasks = useCallback((uid: string) => {\n setItems((cur: PickerProps['items']) => menuHelpers.toggleSelected(cur, uid, 'multi-select'));\n setSelections(cur => {\n const itemToRemove = menuHelpers.getItem(cur, uid);\n return cur.filter(item => item.id !== itemToRemove?.id);\n });\n }, []);\n\n return (\n <Flex as={StyledPicker} container={{ direction: 'column' }} ref={ref} id={id}>\n <Flex\n as={StyledPickerHeader}\n container={{ justify: 'between', alignItems: 'center', pad: 1 }}\n >\n <Text variant='h3'>{t('add_tasks')}</Text>\n <Button variant='simple' onClick={onCancel} aria-label={t('task_picker_close')} icon>\n <Icon name='times' />\n </Button>\n </Flex>\n <Flex container>\n <Flex as={StyledAddTasks}>\n <Menu\n items={renderItems}\n onItemClick={(uid: string) => {\n const clickedItem = menuHelpers.getItem(renderItems, uid);\n const parentItem = menuHelpers.getParentItem(renderItems, uid);\n if (clickedItem) {\n setItems((cur: PickerProps['items']) =>\n menuHelpers.toggleSelected(cur, uid, 'multi-select')\n );\n if (selections.find(item => item.id === uid)) {\n setSelections(cur => cur.filter(item => item.id !== clickedItem?.id));\n } else {\n setSelections(cur => {\n let secondary;\n if (parentItem)\n secondary = menuHelpers.isItem(parentItem)\n ? parentItem.primary\n : parentItem.label;\n return [\n ...cur,\n {\n ...clickedItem,\n secondary,\n onRemoveItem: removeTasks\n } as SelectedItemProps\n ];\n });\n }\n setSearchInput('');\n }\n }}\n focusControlEl={searchEleRef.current || undefined}\n emptyText={emptyText || t('no_items')}\n accent={filterRegex}\n {...restProps}\n mode='multi-select'\n header={\n <Flex container={{ direction: 'column', gap: 1 }}>\n <SearchInput\n ref={searchEleRef}\n value={searchInput}\n onSearchChange={setSearchInput}\n placeholder={placeholder || t('search_placeholder_default')}\n autoFocus\n />\n </Flex>\n }\n />\n </Flex>\n <Flex as={StyledSelectedTasks} container={{ direction: 'column' }}>\n <Text variant='h3'>{t('selected_tasks')}</Text>\n\n {selections.length > 0 ? (\n <DraggableSelectedList\n selectedItems={selections}\n onChange={newItems => {\n setSelections(\n newItems.map(({ type, data }) => ({\n ...data,\n type\n })) as SelectedItemProps[]\n );\n }}\n itemRenderer={SelectedItemRenderer}\n />\n ) : (\n <EmptyState message={t('no_selected_tasks')} />\n )}\n </Flex>\n </Flex>\n <Flex as={StyledPickerFooter} container={{ justify: 'between' }}>\n <Button onClick={onCancel} aria-label={t('cancel')}>\n Cancel\n </Button>\n <Button\n variant='primary'\n disabled={!selections.length}\n onClick={() => {\n onAdd?.(selections);\n setItems(initialItems);\n }}\n aria-label={t('task_manager_picker_add_label', [selections?.length], {\n count: selections?.length\n })}\n >\n {t('add')}\n {!!selections?.length && <StyledCount>{selections.length}</StyledCount>}\n </Button>\n </Flex>\n </Flex>\n );\n }\n);\n\nexport default Picker;\n"]}
@@ -1,27 +0,0 @@
1
- import { ComponentType, Ref } from 'react';
2
- import { BaseProps, MenuProps } from '@pega/cosmos-react-core';
3
- import { MenuItemProps } from '@pega/cosmos-react-core/lib/components/Menu/Menu.types';
4
- import { DraggableItem, ItemRendererProps } from '@pega/cosmos-react-dnd';
5
- export interface PickerProps extends BaseProps, MenuProps {
6
- /** Unique id for picker */
7
- id?: string;
8
- /** Placeholder text */
9
- placeholder?: string;
10
- /** Callback when cancel button is clicked */
11
- onCancel?: () => void;
12
- /** Callback when add button is clicked */
13
- onAdd: (selections: SelectedItemProps[]) => void;
14
- /** Picker reference . */
15
- ref?: Ref<HTMLDivElement>;
16
- /** Title for the picker */
17
- title?: string;
18
- }
19
- export interface DraggableSelectedListProps {
20
- selectedItems: SelectedItemProps[];
21
- onChange: (items: DraggableItem<SelectedItemProps>[]) => void;
22
- itemRenderer: ComponentType<ItemRendererProps<SelectedItemProps>>;
23
- }
24
- export interface SelectedItemProps extends MenuItemProps {
25
- onRemoveItem: (id: MenuItemProps['id']) => void;
26
- }
27
- //# sourceMappingURL=Picker.types.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Picker.types.d.ts","sourceRoot":"","sources":["../../../../src/components/TaskManager/Picker/Picker.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,wDAAwD,CAAC;AACvF,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE1E,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,SAAS;IACvD,2BAA2B;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,uBAAuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,0CAA0C;IAC1C,KAAK,EAAE,CAAC,UAAU,EAAE,iBAAiB,EAAE,KAAK,IAAI,CAAC;IACjD,yBAAyB;IACzB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,2BAA2B;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AACD,MAAM,WAAW,0BAA0B;IACzC,aAAa,EAAE,iBAAiB,EAAE,CAAC;IACnC,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,iBAAiB,CAAC,EAAE,KAAK,IAAI,CAAC;IAC9D,YAAY,EAAE,aAAa,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC,CAAC;CACnE;AACD,MAAM,WAAW,iBAAkB,SAAQ,aAAa;IACtD,YAAY,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;CACjD"}
@@ -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/TaskManager/Picker/Picker.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ComponentType, Ref } from 'react';\n\nimport { BaseProps, MenuProps } from '@pega/cosmos-react-core';\nimport { MenuItemProps } from '@pega/cosmos-react-core/lib/components/Menu/Menu.types';\nimport { DraggableItem, ItemRendererProps } from '@pega/cosmos-react-dnd';\n\nexport interface PickerProps extends BaseProps, MenuProps {\n /** Unique id for picker */\n id?: string;\n /** Placeholder text */\n placeholder?: string;\n /** Callback when cancel button is clicked */\n onCancel?: () => void;\n /** Callback when add button is clicked */\n onAdd: (selections: SelectedItemProps[]) => void;\n /** Picker reference . */\n ref?: Ref<HTMLDivElement>;\n /** Title for the picker */\n title?: string;\n}\nexport interface DraggableSelectedListProps {\n selectedItems: SelectedItemProps[];\n onChange: (items: DraggableItem<SelectedItemProps>[]) => void;\n itemRenderer: ComponentType<ItemRendererProps<SelectedItemProps>>;\n}\nexport interface SelectedItemProps extends MenuItemProps {\n onRemoveItem: (id: MenuItemProps['id']) => void;\n}\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,EAA4D,MAAM,OAAO,CAAC;AAGpG,OAAO,EAeL,YAAY,EACb,MAAM,yBAAyB,CAAC;AAajC,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAOvD,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CA+NnE,CAAC;AAEF,eAAe,WAAW,CAAC"}