@pega/cosmos-react-cs 4.0.0-dev.9.1 → 4.0.0

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 (172) hide show
  1. package/lib/components/CallControlPanel/AttachInteractionDialog.d.ts.map +1 -1
  2. package/lib/components/CallControlPanel/AttachInteractionDialog.js +2 -6
  3. package/lib/components/CallControlPanel/AttachInteractionDialog.js.map +1 -1
  4. package/lib/components/CallControlPanel/Call.d.ts.map +1 -1
  5. package/lib/components/CallControlPanel/Call.js +16 -14
  6. package/lib/components/CallControlPanel/Call.js.map +1 -1
  7. package/lib/components/CallControlPanel/CallControlPanel.d.ts.map +1 -1
  8. package/lib/components/CallControlPanel/CallControlPanel.js +25 -22
  9. package/lib/components/CallControlPanel/CallControlPanel.js.map +1 -1
  10. package/lib/components/CallControlPanel/CallControlPanel.styles.js +1 -1
  11. package/lib/components/CallControlPanel/CallControlPanel.styles.js.map +1 -1
  12. package/lib/components/CallControlPanel/CallControlPanel.types.d.ts +10 -16
  13. package/lib/components/CallControlPanel/CallControlPanel.types.d.ts.map +1 -1
  14. package/lib/components/CallControlPanel/CallControlPanel.types.js.map +1 -1
  15. package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.d.ts +3 -1
  16. package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.d.ts.map +1 -1
  17. package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.js +8 -7
  18. package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.js.map +1 -1
  19. package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.d.ts +5 -1
  20. package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.d.ts.map +1 -1
  21. package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.js +8 -6
  22. package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.js.map +1 -1
  23. package/lib/components/CallControlPanel/ContactList/CalleePicker.js +1 -1
  24. package/lib/components/CallControlPanel/ContactList/CalleePicker.js.map +1 -1
  25. package/lib/components/CallControlPanel/ContactList/ContactList.js +1 -1
  26. package/lib/components/CallControlPanel/ContactList/ContactList.js.map +1 -1
  27. package/lib/components/CallControlPanel/ContactList/ContactList.types.d.ts +1 -1
  28. package/lib/components/CallControlPanel/ContactList/ContactList.types.d.ts.map +1 -1
  29. package/lib/components/CallControlPanel/ContactList/ContactList.types.js.map +1 -1
  30. package/lib/components/CallControlPanel/ExternalCTI.d.ts +1 -3
  31. package/lib/components/CallControlPanel/ExternalCTI.d.ts.map +1 -1
  32. package/lib/components/CallControlPanel/ExternalCTI.js +1 -1
  33. package/lib/components/CallControlPanel/ExternalCTI.js.map +1 -1
  34. package/lib/components/CallControlPanel/FloatingPanel.d.ts.map +1 -1
  35. package/lib/components/CallControlPanel/FloatingPanel.js +2 -2
  36. package/lib/components/CallControlPanel/FloatingPanel.js.map +1 -1
  37. package/lib/components/CallControlPanel/StopWatch.d.ts +3 -1
  38. package/lib/components/CallControlPanel/StopWatch.d.ts.map +1 -1
  39. package/lib/components/CallControlPanel/StopWatch.js.map +1 -1
  40. package/lib/components/CallControlPanel/index.d.ts +1 -1
  41. package/lib/components/CallControlPanel/index.d.ts.map +1 -1
  42. package/lib/components/CallControlPanel/index.js.map +1 -1
  43. package/lib/components/CallControlPanel/utils.d.ts.map +1 -1
  44. package/lib/components/CallControlPanel/utils.js +0 -1
  45. package/lib/components/CallControlPanel/utils.js.map +1 -1
  46. package/lib/components/DialPad/DialPad.d.ts.map +1 -1
  47. package/lib/components/DialPad/DialPad.js +1 -1
  48. package/lib/components/DialPad/DialPad.js.map +1 -1
  49. package/lib/components/DialPad/DialPad.types.d.ts +3 -3
  50. package/lib/components/DialPad/DialPad.types.d.ts.map +1 -1
  51. package/lib/components/DialPad/DialPadDialog.d.ts.map +1 -1
  52. package/lib/components/DialPad/DialPadDialog.js +1 -0
  53. package/lib/components/DialPad/DialPadDialog.js.map +1 -1
  54. package/lib/components/DialPad/DialPadKeyboard.d.ts +1 -1
  55. package/lib/components/DialPad/DialPadKeyboard.d.ts.map +1 -1
  56. package/lib/components/DialPad/DialPadKeyboard.js +1 -1
  57. package/lib/components/DialPad/DialPadKeyboard.js.map +1 -1
  58. package/lib/components/DialPad/KeyboardNavigation.js.map +1 -1
  59. package/lib/components/DialPad/index.d.ts +1 -1
  60. package/lib/components/DialPad/index.d.ts.map +1 -1
  61. package/lib/components/DialPad/index.js.map +1 -1
  62. package/lib/components/InteractionNotification/CountdownButton.d.ts +15 -0
  63. package/lib/components/InteractionNotification/CountdownButton.d.ts.map +1 -0
  64. package/lib/components/InteractionNotification/{AcceptButton.js → CountdownButton.js} +8 -10
  65. package/lib/components/InteractionNotification/CountdownButton.js.map +1 -0
  66. package/lib/components/InteractionNotification/InteractionNotification.d.ts +4 -4
  67. package/lib/components/InteractionNotification/InteractionNotification.d.ts.map +1 -1
  68. package/lib/components/InteractionNotification/InteractionNotification.js +52 -20
  69. package/lib/components/InteractionNotification/InteractionNotification.js.map +1 -1
  70. package/lib/components/InteractionTimer/InteractionTimer.d.ts +1 -1
  71. package/lib/components/InteractionTimer/InteractionTimer.d.ts.map +1 -1
  72. package/lib/components/InteractionTimer/InteractionTimer.js +23 -5
  73. package/lib/components/InteractionTimer/InteractionTimer.js.map +1 -1
  74. package/lib/components/InteractionTimer/index.d.ts +2 -1
  75. package/lib/components/InteractionTimer/index.d.ts.map +1 -1
  76. package/lib/components/InteractionTimer/index.js.map +1 -1
  77. package/lib/components/Picker/Picker.d.ts +6 -0
  78. package/lib/components/Picker/Picker.d.ts.map +1 -0
  79. package/lib/components/Picker/Picker.js +109 -0
  80. package/lib/components/Picker/Picker.js.map +1 -0
  81. package/lib/components/Picker/Picker.styles.d.ts +10 -0
  82. package/lib/components/Picker/Picker.styles.d.ts.map +1 -0
  83. package/lib/components/Picker/Picker.styles.js +59 -0
  84. package/lib/components/Picker/Picker.styles.js.map +1 -0
  85. package/lib/components/Picker/Picker.types.d.ts +35 -0
  86. package/lib/components/Picker/Picker.types.d.ts.map +1 -0
  87. package/lib/components/Picker/Picker.types.js.map +1 -0
  88. package/lib/components/Picker/index.d.ts +2 -0
  89. package/lib/components/Picker/index.d.ts.map +1 -0
  90. package/lib/components/Picker/index.js +2 -0
  91. package/lib/components/Picker/index.js.map +1 -0
  92. package/lib/components/TaskManager/ConversationAI.js +1 -1
  93. package/lib/components/TaskManager/ConversationAI.js.map +1 -1
  94. package/lib/components/TaskManager/Dialogue.d.ts.map +1 -1
  95. package/lib/components/TaskManager/Dialogue.js +1 -1
  96. package/lib/components/TaskManager/Dialogue.js.map +1 -1
  97. package/lib/components/TaskManager/TaskManager.d.ts.map +1 -1
  98. package/lib/components/TaskManager/TaskManager.js +42 -33
  99. package/lib/components/TaskManager/TaskManager.js.map +1 -1
  100. package/lib/components/TaskManager/TaskManager.styles.d.ts +6 -2
  101. package/lib/components/TaskManager/TaskManager.styles.d.ts.map +1 -1
  102. package/lib/components/TaskManager/TaskManager.styles.js +17 -3
  103. package/lib/components/TaskManager/TaskManager.styles.js.map +1 -1
  104. package/lib/components/TaskManager/TaskManager.types.d.ts +6 -4
  105. package/lib/components/TaskManager/TaskManager.types.d.ts.map +1 -1
  106. package/lib/components/TaskManager/TaskManager.types.js.map +1 -1
  107. package/lib/components/TaskManager/TaskManagerTabs.d.ts.map +1 -1
  108. package/lib/components/TaskManager/TaskManagerTabs.js +8 -9
  109. package/lib/components/TaskManager/TaskManagerTabs.js.map +1 -1
  110. package/lib/components/TaskManager/TaskPicker.d.ts +19 -0
  111. package/lib/components/TaskManager/TaskPicker.d.ts.map +1 -0
  112. package/lib/components/TaskManager/TaskPicker.js +89 -0
  113. package/lib/components/TaskManager/TaskPicker.js.map +1 -0
  114. package/lib/components/TaskManager/TaskView.d.ts.map +1 -1
  115. package/lib/components/TaskManager/TaskView.js +1 -1
  116. package/lib/components/TaskManager/TaskView.js.map +1 -1
  117. package/lib/components/TaskManager/index.d.ts +2 -2
  118. package/lib/components/TaskManager/index.d.ts.map +1 -1
  119. package/lib/components/TaskManager/index.js +1 -1
  120. package/lib/components/TaskManager/index.js.map +1 -1
  121. package/lib/index.d.ts +1 -4
  122. package/lib/index.d.ts.map +1 -1
  123. package/lib/index.js +1 -4
  124. package/lib/index.js.map +1 -1
  125. package/package.json +13 -15
  126. package/lib/components/Article/Article.d.ts +0 -32
  127. package/lib/components/Article/Article.d.ts.map +0 -1
  128. package/lib/components/Article/Article.js +0 -54
  129. package/lib/components/Article/Article.js.map +0 -1
  130. package/lib/components/Article/ArticleFooter.d.ts +0 -19
  131. package/lib/components/Article/ArticleFooter.d.ts.map +0 -1
  132. package/lib/components/Article/ArticleFooter.js +0 -40
  133. package/lib/components/Article/ArticleFooter.js.map +0 -1
  134. package/lib/components/Article/ArticleSkeleton.d.ts +0 -8
  135. package/lib/components/Article/ArticleSkeleton.d.ts.map +0 -1
  136. package/lib/components/Article/ArticleSkeleton.js +0 -15
  137. package/lib/components/Article/ArticleSkeleton.js.map +0 -1
  138. package/lib/components/Article/index.d.ts +0 -6
  139. package/lib/components/Article/index.d.ts.map +0 -1
  140. package/lib/components/Article/index.js +0 -3
  141. package/lib/components/Article/index.js.map +0 -1
  142. package/lib/components/ArticleList/ArticleList.d.ts +0 -17
  143. package/lib/components/ArticleList/ArticleList.d.ts.map +0 -1
  144. package/lib/components/ArticleList/ArticleList.js +0 -65
  145. package/lib/components/ArticleList/ArticleList.js.map +0 -1
  146. package/lib/components/ArticleList/ArticleListHeader.d.ts +0 -21
  147. package/lib/components/ArticleList/ArticleListHeader.d.ts.map +0 -1
  148. package/lib/components/ArticleList/ArticleListHeader.js +0 -68
  149. package/lib/components/ArticleList/ArticleListHeader.js.map +0 -1
  150. package/lib/components/ArticleList/ArticleSummary.d.ts +0 -14
  151. package/lib/components/ArticleList/ArticleSummary.d.ts.map +0 -1
  152. package/lib/components/ArticleList/ArticleSummary.js +0 -30
  153. package/lib/components/ArticleList/ArticleSummary.js.map +0 -1
  154. package/lib/components/ArticleList/SummarySkeleton.d.ts +0 -7
  155. package/lib/components/ArticleList/SummarySkeleton.d.ts.map +0 -1
  156. package/lib/components/ArticleList/SummarySkeleton.js +0 -9
  157. package/lib/components/ArticleList/SummarySkeleton.js.map +0 -1
  158. package/lib/components/ArticleList/index.d.ts +0 -7
  159. package/lib/components/ArticleList/index.d.ts.map +0 -1
  160. package/lib/components/ArticleList/index.js +0 -4
  161. package/lib/components/ArticleList/index.js.map +0 -1
  162. package/lib/components/InteractionNotification/AcceptButton.d.ts +0 -15
  163. package/lib/components/InteractionNotification/AcceptButton.d.ts.map +0 -1
  164. package/lib/components/InteractionNotification/AcceptButton.js.map +0 -1
  165. package/lib/components/TaskManager/Picker/Picker.d.ts +0 -14
  166. package/lib/components/TaskManager/Picker/Picker.d.ts.map +0 -1
  167. package/lib/components/TaskManager/Picker/Picker.js +0 -260
  168. package/lib/components/TaskManager/Picker/Picker.js.map +0 -1
  169. package/lib/components/TaskManager/Picker/Picker.types.d.ts +0 -28
  170. package/lib/components/TaskManager/Picker/Picker.types.d.ts.map +0 -1
  171. package/lib/components/TaskManager/Picker/Picker.types.js.map +0 -1
  172. /package/lib/components/{TaskManager/Picker → Picker}/Picker.types.js +0 -0
@@ -0,0 +1,89 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { forwardRef, useCallback, useEffect, useRef, useState } from 'react';
3
+ import styled, { css } from 'styled-components';
4
+ import { useI18n, useConsolidatedRef, useElement, useUID, useOuterEvent, Flex, Button, Icon, Text, useFocusTrap, useEvent, FormDialog, defaultThemeProp } from '@pega/cosmos-react-core';
5
+ import { StyledChildrenWrap, StyledDialogContent, StyledDialogHeader } from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.styles';
6
+ import Dialog from '@pega/cosmos-react-core/lib/components/Dialog/Dialog';
7
+ import { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';
8
+ import Picker from '../Picker';
9
+ export const StyledSingleTaskDialog = styled(Dialog)(() => {
10
+ return css `
11
+ ${StyledMenu} {
12
+ overflow: auto;
13
+ }
14
+ `;
15
+ });
16
+ export const StyledMultiTaskDialog = styled(FormDialog)(({ theme: { base: { spacing } } }) => {
17
+ return css `
18
+ ${StyledDialogContent},
19
+ ${StyledChildrenWrap} {
20
+ display: flex;
21
+ }
22
+
23
+ ${StyledDialogHeader} {
24
+ padding-inline: ${spacing};
25
+ }
26
+
27
+ ${StyledDialogContent} {
28
+ padding-inline: 0;
29
+ }
30
+
31
+ ${StyledMenu} {
32
+ overflow: auto;
33
+ }
34
+ `;
35
+ });
36
+ StyledMultiTaskDialog.defaultProps = defaultThemeProp;
37
+ const TaskPicker = forwardRef(function TaskPicker({ items, onAdd, onCancel, target, ...restProps }, ref) {
38
+ const t = useI18n();
39
+ const headingId = useUID();
40
+ const [selections, setSelections] = useState([]);
41
+ const [enableMultiSelect, setEnableMultiSelect] = useState(false);
42
+ const [pickerEl, setPickerEl] = useElement();
43
+ const pickerRef = useConsolidatedRef(ref, setPickerEl);
44
+ const initialRender = useRef(true);
45
+ const toggleHandleRef = useRef(null);
46
+ const onSelectionChange = (selectedItems) => {
47
+ setSelections(selectedItems);
48
+ };
49
+ useOuterEvent('mousedown', [target, pickerRef], () => {
50
+ onCancel?.();
51
+ });
52
+ const onModeToggle = () => {
53
+ setSelections([]);
54
+ setEnableMultiSelect(curr => !curr);
55
+ };
56
+ useEffect(() => {
57
+ if (!enableMultiSelect && selections?.length) {
58
+ onAdd(selections);
59
+ }
60
+ }, [selections, enableMultiSelect]);
61
+ useEffect(() => {
62
+ if (initialRender.current) {
63
+ initialRender.current = false;
64
+ }
65
+ else {
66
+ toggleHandleRef.current?.focusToggleSwitch();
67
+ }
68
+ }, [enableMultiSelect]);
69
+ const onKeydown = useCallback((e) => {
70
+ const { key } = e;
71
+ if (key === 'Escape') {
72
+ onCancel?.();
73
+ }
74
+ }, [onCancel]);
75
+ useFocusTrap(pickerRef, false, [onCancel, pickerEl, enableMultiSelect]);
76
+ useEvent('keydown', onKeydown, { dependencies: [pickerEl, enableMultiSelect] });
77
+ const pickerContent = (_jsx(Picker, { ...restProps, contextualLabel: t('task_manager_cases').toLowerCase(), items: items, multiSelect: enableMultiSelect, onModeToggle: onModeToggle, reorderSelections: true, selections: selections, onSelectionChange: onSelectionChange, handle: toggleHandleRef }));
78
+ return enableMultiSelect ? (_jsx(StyledMultiTaskDialog, { ...restProps, target: target, heading: t('add_cases'), ref: pickerRef, onCancel: () => {
79
+ onCancel();
80
+ }, onSubmit: {
81
+ text: t('add'),
82
+ disabled: !selections.length,
83
+ handler: () => {
84
+ onAdd(selections);
85
+ }
86
+ }, children: pickerContent })) : (_jsxs(Flex, { ...restProps, container: { direction: 'column', gap: 1 }, as: StyledSingleTaskDialog, target: target, labelledbyId: headingId, ref: pickerRef, children: [_jsxs(Flex, { container: { justify: 'between', alignItems: 'center', pad: 1 }, children: [_jsx(Text, { id: headingId, variant: 'h2', children: t('task_manager_add_case') }), _jsx(Button, { icon: true, variant: 'simple', onClick: onCancel, label: t('close'), "aria-label": t('close_noun', [t('task_manager_add_case')]), children: _jsx(Icon, { name: 'times' }) })] }), pickerContent] }));
87
+ });
88
+ export default TaskPicker;
89
+ //# sourceMappingURL=TaskPicker.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TaskPicker.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskPicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n useCallback,\n useEffect,\n useRef,\n useState\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n ForwardProps,\n useI18n,\n useConsolidatedRef,\n useElement,\n useUID,\n useOuterEvent,\n Flex,\n Button,\n Icon,\n Text,\n useFocusTrap,\n useEvent,\n MenuItemProps,\n FormDialog,\n defaultThemeProp,\n BaseProps,\n FormDialogProps\n} from '@pega/cosmos-react-core';\nimport {\n StyledChildrenWrap,\n StyledDialogContent,\n StyledDialogHeader\n} from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.styles';\nimport Dialog from '@pega/cosmos-react-core/lib/components/Dialog/Dialog';\nimport { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';\n\nimport { PickerProps, SwitchHandleValue } from '../Picker/Picker.types';\nimport Picker from '../Picker';\n\nexport interface TaskPickerProps extends BaseProps, Pick<PickerProps, 'items'> {\n /** Callback when add button is clicked */\n onAdd: (selections: MenuItemProps[]) => void;\n /** Callback when cancel button is clicked */\n onCancel: () => void;\n /** Target for the modal */\n target: FormDialogProps['target'];\n /** Picker reference . */\n ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledSingleTaskDialog: typeof Dialog = styled(Dialog)(() => {\n return css`\n ${StyledMenu} {\n overflow: auto;\n }\n `;\n});\n\nexport const StyledMultiTaskDialog = styled(FormDialog)(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n ${StyledDialogContent},\n ${StyledChildrenWrap} {\n display: flex;\n }\n\n ${StyledDialogHeader} {\n padding-inline: ${spacing};\n }\n\n ${StyledDialogContent} {\n padding-inline: 0;\n }\n\n ${StyledMenu} {\n overflow: auto;\n }\n `;\n }\n);\n\nStyledMultiTaskDialog.defaultProps = defaultThemeProp;\n\nconst TaskPicker: FunctionComponent<TaskPickerProps & ForwardProps> = forwardRef(\n function TaskPicker(\n { items, onAdd, onCancel, target, ...restProps }: PropsWithoutRef<TaskPickerProps>,\n ref: TaskPickerProps['ref']\n ) {\n const t = useI18n();\n const headingId = useUID();\n const [selections, setSelections] = useState<MenuItemProps[]>([]);\n const [enableMultiSelect, setEnableMultiSelect] = useState(false);\n const [pickerEl, setPickerEl] = useElement<HTMLDivElement>();\n const pickerRef = useConsolidatedRef(ref, setPickerEl);\n const initialRender = useRef(true);\n const toggleHandleRef = useRef<SwitchHandleValue>(null);\n\n const onSelectionChange = (selectedItems: MenuItemProps[]) => {\n setSelections(selectedItems);\n };\n\n useOuterEvent('mousedown', [target, pickerRef], () => {\n onCancel?.();\n });\n\n const onModeToggle = () => {\n setSelections([]);\n setEnableMultiSelect(curr => !curr);\n };\n\n useEffect(() => {\n if (!enableMultiSelect && selections?.length) {\n onAdd(selections);\n }\n }, [selections, enableMultiSelect]);\n\n useEffect(() => {\n if (initialRender.current) {\n initialRender.current = false;\n } else {\n toggleHandleRef.current?.focusToggleSwitch();\n }\n }, [enableMultiSelect]);\n\n const onKeydown = useCallback(\n (e: KeyboardEvent) => {\n const { key } = e;\n if (key === 'Escape') {\n onCancel?.();\n }\n },\n [onCancel]\n );\n\n useFocusTrap(pickerRef, false, [onCancel, pickerEl, enableMultiSelect]);\n\n useEvent('keydown', onKeydown, { dependencies: [pickerEl, enableMultiSelect] });\n\n const pickerContent = (\n <Picker\n {...restProps}\n contextualLabel={t('task_manager_cases').toLowerCase()}\n items={items}\n multiSelect={enableMultiSelect}\n onModeToggle={onModeToggle}\n reorderSelections\n selections={selections}\n onSelectionChange={onSelectionChange}\n handle={toggleHandleRef}\n />\n );\n\n return enableMultiSelect ? (\n <StyledMultiTaskDialog\n {...restProps}\n target={target}\n heading={t('add_cases')}\n ref={pickerRef}\n onCancel={() => {\n onCancel();\n }}\n onSubmit={{\n text: t('add'),\n disabled: !selections.length,\n handler: () => {\n onAdd(selections);\n }\n }}\n >\n {pickerContent}\n </StyledMultiTaskDialog>\n ) : (\n <Flex\n {...restProps}\n container={{ direction: 'column', gap: 1 }}\n as={StyledSingleTaskDialog}\n target={target}\n labelledbyId={headingId}\n ref={pickerRef}\n >\n <Flex container={{ justify: 'between', alignItems: 'center', pad: 1 }}>\n <Text id={headingId} variant='h2'>\n {t('task_manager_add_case')}\n </Text>\n <Button\n icon\n variant='simple'\n onClick={onCancel}\n label={t('close')}\n aria-label={t('close_noun', [t('task_manager_add_case')])}\n >\n <Icon name='times' />\n </Button>\n </Flex>\n {pickerContent}\n </Flex>\n );\n }\n);\n\nexport default TaskPicker;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"TaskView.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAiC,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAEtF,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAGpD,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CAa7D,CAAC;AAEF,eAAe,QAAQ,CAAC"}
1
+ {"version":3,"file":"TaskView.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAiC,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAEtF,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAGpD,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CAc5D,CAAC;AAEH,eAAe,QAAQ,CAAC"}
@@ -2,7 +2,7 @@ import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
2
2
  import { forwardRef } from 'react';
3
3
  import { Card, CardContent, CardHeader } from '@pega/cosmos-react-core';
4
4
  import { StyledStickyCardHeader } from './TaskManager.styles';
5
- const TaskView = forwardRef((props, ref) => {
5
+ const TaskView = forwardRef(function TaskView(props, ref) {
6
6
  const { header, actions, children, ...restProps } = props;
7
7
  return (_jsxs(Card, { ...restProps, ref: ref, children: [_jsxs(CardHeader, { as: StyledStickyCardHeader, children: [header, actions] }), _jsx(CardContent, { children: children })] }));
8
8
  });
@@ -1 +1 @@
1
- {"version":3,"file":"TaskView.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskView.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,UAAU,EAAmB,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,UAAU,EAAgB,MAAM,yBAAyB,CAAC;AAGtF,OAAO,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,MAAM,QAAQ,GAAoD,UAAU,CAC1E,CAAC,KAAqC,EAAE,GAAyB,EAAE,EAAE;IACnE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAC1D,OAAO,CACL,MAAC,IAAI,OAAK,SAAS,EAAE,GAAG,EAAE,GAAG,aAC3B,MAAC,UAAU,IAAC,EAAE,EAAE,sBAAsB,aACnC,MAAM,EACN,OAAO,IACG,EACb,KAAC,WAAW,cAAE,QAAQ,GAAe,IAChC,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { FunctionComponent, forwardRef, PropsWithoutRef } from 'react';\n\nimport { Card, CardContent, CardHeader, ForwardProps } from '@pega/cosmos-react-core';\n\nimport { TaskViewProps } from './TaskManager.types';\nimport { StyledStickyCardHeader } from './TaskManager.styles';\n\nconst TaskView: FunctionComponent<TaskViewProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<TaskViewProps>, ref: TaskViewProps['ref']) => {\n const { header, actions, children, ...restProps } = props;\n return (\n <Card {...restProps} ref={ref}>\n <CardHeader as={StyledStickyCardHeader}>\n {header}\n {actions}\n </CardHeader>\n <CardContent>{children}</CardContent>\n </Card>\n );\n }\n);\n\nexport default TaskView;\n"]}
1
+ {"version":3,"file":"TaskView.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskView.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,UAAU,EAAmB,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,UAAU,EAAgB,MAAM,yBAAyB,CAAC;AAGtF,OAAO,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,MAAM,QAAQ,GAAoD,UAAU,CAAC,SAAS,QAAQ,CAC5F,KAAqC,EACrC,GAAyB;IAEzB,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAC1D,OAAO,CACL,MAAC,IAAI,OAAK,SAAS,EAAE,GAAG,EAAE,GAAG,aAC3B,MAAC,UAAU,IAAC,EAAE,EAAE,sBAAsB,aACnC,MAAM,EACN,OAAO,IACG,EACb,KAAC,WAAW,cAAE,QAAQ,GAAe,IAChC,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { FunctionComponent, forwardRef, PropsWithoutRef } from 'react';\n\nimport { Card, CardContent, CardHeader, ForwardProps } from '@pega/cosmos-react-core';\n\nimport { TaskViewProps } from './TaskManager.types';\nimport { StyledStickyCardHeader } from './TaskManager.styles';\n\nconst TaskView: FunctionComponent<TaskViewProps & ForwardProps> = forwardRef(function TaskView(\n props: PropsWithoutRef<TaskViewProps>,\n ref: TaskViewProps['ref']\n) {\n const { header, actions, children, ...restProps } = props;\n return (\n <Card {...restProps} ref={ref}>\n <CardHeader as={StyledStickyCardHeader}>\n {header}\n {actions}\n </CardHeader>\n <CardContent>{children}</CardContent>\n </Card>\n );\n});\n\nexport default TaskView;\n"]}
@@ -1,5 +1,5 @@
1
1
  export { default } from './TaskManager';
2
2
  export { default as TaskView } from './TaskView';
3
- export { TaskManagerProps, TaskProps, TaskManagerTabsProps, TaskViewProps, DialogueProps } from './TaskManager.types';
4
- export { default as Picker } from './Picker/Picker';
3
+ export type { TaskManagerProps, TaskProps, TaskManagerTabsProps, TaskViewProps, DialogueProps } from './TaskManager.types';
4
+ export { default as TaskPicker } from './TaskPicker';
5
5
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EACL,gBAAgB,EAChB,SAAS,EACT,oBAAoB,EACpB,aAAa,EACb,aAAa,EACd,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,YAAY,EACV,gBAAgB,EAChB,SAAS,EACT,oBAAoB,EACpB,aAAa,EACb,aAAa,EACd,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC"}
@@ -1,4 +1,4 @@
1
1
  export { default } from './TaskManager';
2
2
  export { default as TaskView } from './TaskView';
3
- export { default as Picker } from './Picker/Picker';
3
+ export { default as TaskPicker } from './TaskPicker';
4
4
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/TaskManager/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AAQjD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC","sourcesContent":["export { default } from './TaskManager';\nexport { default as TaskView } from './TaskView';\nexport {\n TaskManagerProps,\n TaskProps,\n TaskManagerTabsProps,\n TaskViewProps,\n DialogueProps\n} from './TaskManager.types';\nexport { default as Picker } from './Picker/Picker';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/TaskManager/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AAQjD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC","sourcesContent":["export { default } from './TaskManager';\nexport { default as TaskView } from './TaskView';\nexport type {\n TaskManagerProps,\n TaskProps,\n TaskManagerTabsProps,\n TaskViewProps,\n DialogueProps\n} from './TaskManager.types';\nexport { default as TaskPicker } from './TaskPicker';\n"]}
package/lib/index.d.ts CHANGED
@@ -1,7 +1,3 @@
1
- export { default as Article } from './components/Article';
2
- export * from './components/Article';
3
- export { default as ArticleList } from './components/ArticleList';
4
- export * from './components/ArticleList';
5
1
  export { default as CallControlPanel } from './components/CallControlPanel';
6
2
  export * from './components/CallControlPanel';
7
3
  export { default as CTIPanel } from './components/CTIPanel';
@@ -11,6 +7,7 @@ export * from './components/DialPad';
11
7
  export { default as InteractionNotification } from './components/InteractionNotification';
12
8
  export { default as InteractionTimer } from './components/InteractionTimer';
13
9
  export * from './components/InteractionTimer';
10
+ export { default as Picker } from './components/Picker';
14
11
  export { default as TaskManager } from './components/TaskManager';
15
12
  export * from './components/TaskManager';
16
13
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,cAAc,0BAA0B,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,cAAc,+BAA+B,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,uBAAuB,EAAE,MAAM,sCAAsC,CAAC;AAC1F,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,cAAc,+BAA+B,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,cAAc,0BAA0B,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,cAAc,+BAA+B,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,uBAAuB,EAAE,MAAM,sCAAsC,CAAC;AAC1F,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,cAAc,+BAA+B,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,cAAc,0BAA0B,CAAC"}
package/lib/index.js CHANGED
@@ -1,8 +1,4 @@
1
1
  // This file is autogenerated. Any changes will be overwritten.
2
- export { default as Article } from './components/Article';
3
- export * from './components/Article';
4
- export { default as ArticleList } from './components/ArticleList';
5
- export * from './components/ArticleList';
6
2
  export { default as CallControlPanel } from './components/CallControlPanel';
7
3
  export * from './components/CallControlPanel';
8
4
  export { default as CTIPanel } from './components/CTIPanel';
@@ -12,6 +8,7 @@ export * from './components/DialPad';
12
8
  export { default as InteractionNotification } from './components/InteractionNotification';
13
9
  export { default as InteractionTimer } from './components/InteractionTimer';
14
10
  export * from './components/InteractionTimer';
11
+ export { default as Picker } from './components/Picker';
15
12
  export { default as TaskManager } from './components/TaskManager';
16
13
  export * from './components/TaskManager';
17
14
  //# sourceMappingURL=index.js.map
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,+DAA+D;AAC/D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,cAAc,0BAA0B,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,cAAc,+BAA+B,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,uBAAuB,EAAE,MAAM,sCAAsC,CAAC;AAC1F,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,cAAc,+BAA+B,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,cAAc,0BAA0B,CAAC","sourcesContent":["// This file is autogenerated. Any changes will be overwritten.\nexport { default as Article } from './components/Article';\nexport * from './components/Article';\nexport { default as ArticleList } from './components/ArticleList';\nexport * from './components/ArticleList';\nexport { default as CallControlPanel } from './components/CallControlPanel';\nexport * from './components/CallControlPanel';\nexport { default as CTIPanel } from './components/CTIPanel';\nexport * from './components/CTIPanel';\nexport { default as DialPad } from './components/DialPad';\nexport * from './components/DialPad';\nexport { default as InteractionNotification } from './components/InteractionNotification';\nexport { default as InteractionTimer } from './components/InteractionTimer';\nexport * from './components/InteractionTimer';\nexport { default as TaskManager } from './components/TaskManager';\nexport * from './components/TaskManager';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,+DAA+D;AAC/D,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,cAAc,+BAA+B,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,uBAAuB,EAAE,MAAM,sCAAsC,CAAC;AAC1F,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,cAAc,+BAA+B,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,cAAc,0BAA0B,CAAC","sourcesContent":["// This file is autogenerated. Any changes will be overwritten.\nexport { default as CallControlPanel } from './components/CallControlPanel';\nexport * from './components/CallControlPanel';\nexport { default as CTIPanel } from './components/CTIPanel';\nexport * from './components/CTIPanel';\nexport { default as DialPad } from './components/DialPad';\nexport * from './components/DialPad';\nexport { default as InteractionNotification } from './components/InteractionNotification';\nexport { default as InteractionTimer } from './components/InteractionTimer';\nexport * from './components/InteractionTimer';\nexport { default as Picker } from './components/Picker';\nexport { default as TaskManager } from './components/TaskManager';\nexport * from './components/TaskManager';\n"]}
package/package.json CHANGED
@@ -1,13 +1,14 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-cs",
3
- "version": "4.0.0-dev.9.1",
4
- "author": "Pegasystems",
5
- "license": "SEE LICENSE IN LICENSE",
3
+ "version": "4.0.0",
6
4
  "repository": {
7
5
  "type": "git",
8
6
  "url": "https://github.com/pegasystems/cosmos-react.git",
9
7
  "directory": "packages/cosmos-cs"
10
8
  },
9
+ "license": "SEE LICENSE IN LICENSE",
10
+ "author": "Pegasystems",
11
+ "sideEffects": false,
11
12
  "main": "lib/index.js",
12
13
  "types": "lib/index.d.ts",
13
14
  "files": [
@@ -15,13 +16,12 @@
15
16
  "README.md",
16
17
  "lib"
17
18
  ],
18
- "sideEffects": false,
19
19
  "scripts": {
20
20
  "build": "tsc -b"
21
21
  },
22
22
  "dependencies": {
23
- "@pega/cosmos-react-core": "4.0.0-dev.9.1",
24
- "@pega/cosmos-react-dnd": "4.0.0-dev.9.1",
23
+ "@pega/cosmos-react-core": "4.0.0",
24
+ "@pega/cosmos-react-dnd": "4.0.0",
25
25
  "@types/react": "^16.14.24 || ^17.0.38",
26
26
  "@types/react-dom": "^16.9.14 || ^17.0.11",
27
27
  "@types/styled-components": "^5.1.26",
@@ -31,16 +31,14 @@
31
31
  "styled-components": "^5.2.0"
32
32
  },
33
33
  "devDependencies": {
34
- "@storybook/addon-a11y": "^6.4.19",
35
- "@storybook/addon-actions": "^6.4.19",
36
- "@storybook/addon-storysource": "^6.4.19",
37
- "@storybook/addon-toolbars": "^6.4.19",
38
- "@storybook/addons": "^6.4.19",
39
- "@storybook/react": "^6.4.19",
40
- "@storybook/testing-react": "^1.2.4",
41
- "@storybook/theming": "^6.4.19",
34
+ "@storybook/addon-a11y": "^7.0.24",
35
+ "@storybook/addon-actions": "^7.0.24",
36
+ "@storybook/addon-storysource": "^7.0.24",
37
+ "@storybook/addon-toolbars": "^7.0.24",
38
+ "@storybook/react": "^7.0.24",
39
+ "@storybook/theming": "^7.0.24",
42
40
  "@testing-library/react": "^12.1.3",
43
41
  "@testing-library/user-event": "^13.5.0",
44
- "typescript": "~4.7.2"
42
+ "typescript": "~5.0.2"
45
43
  }
46
44
  }
@@ -1,32 +0,0 @@
1
- import { ReactElement, ReactNode, FunctionComponent } from 'react';
2
- import { MenuItemProps, BaseProps, ForwardProps, NoChildrenProp } from '@pega/cosmos-react-core';
3
- import ArticleFooter from './ArticleFooter';
4
- export interface BaseArticleProps extends BaseProps, NoChildrenProp {
5
- /** Navigation elements */
6
- navigation?: ReactNode;
7
- /** Primary actions which needs to be displayed with an icon */
8
- primaryActions?: ReactNode;
9
- /** Secondary actions that needs to be pushed under more icon */
10
- secondaryActions?: {
11
- id: MenuItemProps['id'];
12
- text: MenuItemProps['primary'];
13
- }[];
14
- /** Article title */
15
- title: string;
16
- /** Array of meta data rendered through MetaList component */
17
- meta?: (ReactElement | string)[];
18
- /** Article content */
19
- content: ReactNode;
20
- /** Footer */
21
- footer?: ReactElement<typeof ArticleFooter>;
22
- /** Prop to check visibility of skeleton */
23
- skeletonize: boolean;
24
- }
25
- export declare type ArticleProps = (BaseArticleProps & {
26
- skeletonize?: false;
27
- }) | (Partial<BaseArticleProps> & {
28
- skeletonize: true;
29
- });
30
- declare const Article: FunctionComponent<ArticleProps & ForwardProps>;
31
- export default Article;
32
- //# sourceMappingURL=Article.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Article.d.ts","sourceRoot":"","sources":["../../../src/components/Article/Article.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAGnE,OAAO,EACL,aAAa,EAOb,SAAS,EACT,YAAY,EACZ,cAAc,EACf,MAAM,yBAAyB,CAAC;AAEjC,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAG5C,MAAM,WAAW,gBAAiB,SAAQ,SAAS,EAAE,cAAc;IACjE,0BAA0B;IAC1B,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,+DAA+D;IAC/D,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,gEAAgE;IAChE,gBAAgB,CAAC,EAAE;QACjB,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;QACxB,IAAI,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;KAChC,EAAE,CAAC;IACJ,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,6DAA6D;IAC7D,IAAI,CAAC,EAAE,CAAC,YAAY,GAAG,MAAM,CAAC,EAAE,CAAC;IACjC,sBAAsB;IACtB,OAAO,EAAE,SAAS,CAAC;IACnB,aAAa;IACb,MAAM,CAAC,EAAE,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC;IAC5C,2CAA2C;IAC3C,WAAW,EAAE,OAAO,CAAC;CACtB;AAED,oBAAY,YAAY,GACpB,CAAC,gBAAgB,GAAG;IAAE,WAAW,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,GAC5C,CAAC,OAAO,CAAC,gBAAgB,CAAC,GAAG;IAAE,WAAW,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC;AAoDxD,QAAA,MAAM,OAAO,EAAE,iBAAiB,CAAC,YAAY,GAAG,YAAY,CAkE3D,CAAC;AAMF,eAAe,OAAO,CAAC"}
@@ -1,54 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import styled, { css } from 'styled-components';
3
- import { Flex, LineSkeleton, MenuButton, MetaList, Text, defaultThemeProp } from '@pega/cosmos-react-core';
4
- import ArticleSkeleton from './ArticleSkeleton';
5
- const StyledArticleWrapper = styled.div(props => {
6
- const { theme } = props;
7
- return css `
8
- background: ${theme.base.palette['primary-background']};
9
- padding: calc(1.5 * ${theme.base.spacing});
10
- border-radius: calc(0.5 * ${theme.base['border-radius']});
11
- max-height: inherit;
12
- `;
13
- });
14
- const StyledArticleHeader = styled.header `
15
- flex-shrink: 0;
16
- `;
17
- const StyledArticleContent = styled.div(props => {
18
- const { theme, theme: { base: { spacing } } } = props;
19
- return css `
20
- flex-grow: 1;
21
- overflow-y: auto;
22
- padding: 0 calc(1.5 * ${spacing});
23
- margin: 0 calc(-1.5 * ${spacing});
24
-
25
- /* TODO - We need to think of handling this such way RTE content is not impacted with the styles inside styles/GlobalStyle.tsx */
26
- ul,
27
- ol {
28
- padding-left: calc(3 * ${spacing});
29
- }
30
- a {
31
- color: ${theme.components.link.color};
32
- }
33
- * {
34
- margin: unset;
35
- }
36
- `;
37
- });
38
- StyledArticleContent.defaultProps = defaultThemeProp;
39
- StyledArticleWrapper.defaultProps = defaultThemeProp;
40
- const Locale = {
41
- // FIXME: TR
42
- moreActions: 'More actions'
43
- };
44
- const Article = (props) => {
45
- const { meta, title, navigation, content, primaryActions, secondaryActions, footer, skeletonize, ...restProps } = props;
46
- return (_jsxs(Flex, { container: { direction: 'column', gap: 1 }, as: StyledArticleWrapper, ...restProps, children: [(navigation || primaryActions || secondaryActions) && (_jsxs(Flex, { container: { gap: 1, alignItems: 'center' }, children: [_jsx(Flex, { container: true, item: { grow: 1 }, children: navigation }), _jsxs(Flex, { container: { alignItems: 'center' }, children: [primaryActions, secondaryActions && (_jsx(MenuButton, { variant: 'simple', text: Locale.moreActions, icon: 'more', iconOnly: true, menu: {
47
- items: secondaryActions.map(({ text, ...rest }) => ({ ...rest, primary: text }))
48
- } }))] })] })), title ? (_jsx(Flex, { container: true, as: StyledArticleHeader, children: _jsx(Text, { variant: 'h2', children: title }) })) : (skeletonize && _jsx(LineSkeleton, { width: 'l' })), meta && meta.length > 0 ? (_jsx(Flex, { container: true, item: { shrink: 0 }, children: _jsx(MetaList, { items: meta }) })) : (skeletonize && (_jsxs(Flex, { container: true, children: [_jsx(LineSkeleton, { width: 's' }), _jsx(LineSkeleton, { width: 's' }), _jsx(LineSkeleton, { width: 's' })] }))), skeletonize ? (_jsx(StyledArticleContent, { children: _jsx(ArticleSkeleton, {}) })) : (_jsx(StyledArticleContent, { children: content })), footer] }));
49
- };
50
- Article.defaultProps = {
51
- skeletonize: false
52
- };
53
- export default Article;
54
- //# sourceMappingURL=Article.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Article.js","sourceRoot":"","sources":["../../../src/components/Article/Article.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ReactElement, ReactNode, FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n MenuItemProps,\n Flex,\n LineSkeleton,\n MenuButton,\n MetaList,\n Text,\n defaultThemeProp,\n BaseProps,\n ForwardProps,\n NoChildrenProp\n} from '@pega/cosmos-react-core';\n\nimport ArticleFooter from './ArticleFooter';\nimport ArticleSkeleton from './ArticleSkeleton';\n\nexport interface BaseArticleProps extends BaseProps, NoChildrenProp {\n /** Navigation elements */\n navigation?: ReactNode;\n /** Primary actions which needs to be displayed with an icon */\n primaryActions?: ReactNode;\n /** Secondary actions that needs to be pushed under more icon */\n secondaryActions?: {\n id: MenuItemProps['id'];\n text: MenuItemProps['primary'];\n }[];\n /** Article title */\n title: string;\n /** Array of meta data rendered through MetaList component */\n meta?: (ReactElement | string)[];\n /** Article content */\n content: ReactNode;\n /** Footer */\n footer?: ReactElement<typeof ArticleFooter>;\n /** Prop to check visibility of skeleton */\n skeletonize: boolean;\n}\n\nexport type ArticleProps =\n | (BaseArticleProps & { skeletonize?: false })\n | (Partial<BaseArticleProps> & { skeletonize: true });\n\nconst StyledArticleWrapper = styled.div(props => {\n const { theme } = props;\n return css`\n background: ${theme.base.palette['primary-background']};\n padding: calc(1.5 * ${theme.base.spacing});\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n max-height: inherit;\n `;\n});\n\nconst StyledArticleHeader = styled.header`\n flex-shrink: 0;\n`;\n\nconst StyledArticleContent = styled.div(props => {\n const {\n theme,\n theme: {\n base: { spacing }\n }\n } = props;\n\n return css`\n flex-grow: 1;\n overflow-y: auto;\n padding: 0 calc(1.5 * ${spacing});\n margin: 0 calc(-1.5 * ${spacing});\n\n /* TODO - We need to think of handling this such way RTE content is not impacted with the styles inside styles/GlobalStyle.tsx */\n ul,\n ol {\n padding-left: calc(3 * ${spacing});\n }\n a {\n color: ${theme.components.link.color};\n }\n * {\n margin: unset;\n }\n `;\n});\n\nStyledArticleContent.defaultProps = defaultThemeProp;\nStyledArticleWrapper.defaultProps = defaultThemeProp;\n\nconst Locale = {\n // FIXME: TR\n moreActions: 'More actions'\n};\n\nconst Article: FunctionComponent<ArticleProps & ForwardProps> = (props: ArticleProps) => {\n const {\n meta,\n title,\n navigation,\n content,\n primaryActions,\n secondaryActions,\n footer,\n skeletonize,\n ...restProps\n } = props;\n\n return (\n <Flex container={{ direction: 'column', gap: 1 }} as={StyledArticleWrapper} {...restProps}>\n {(navigation || primaryActions || secondaryActions) && (\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Flex container item={{ grow: 1 }}>\n {navigation}\n </Flex>\n <Flex container={{ alignItems: 'center' }}>\n {primaryActions}\n {secondaryActions && (\n <MenuButton\n variant='simple'\n text={Locale.moreActions}\n icon='more'\n iconOnly\n menu={{\n items: secondaryActions.map(({ text, ...rest }) => ({ ...rest, primary: text }))\n }}\n />\n )}\n </Flex>\n </Flex>\n )}\n {title ? (\n <Flex container as={StyledArticleHeader}>\n <Text variant='h2'>{title}</Text>\n </Flex>\n ) : (\n skeletonize && <LineSkeleton width='l' />\n )}\n {meta && meta.length > 0 ? (\n <Flex container item={{ shrink: 0 }}>\n <MetaList items={meta} />\n </Flex>\n ) : (\n skeletonize && (\n <Flex container>\n <LineSkeleton width='s' />\n <LineSkeleton width='s' />\n <LineSkeleton width='s' />\n </Flex>\n )\n )}\n {skeletonize ? (\n <StyledArticleContent>\n <ArticleSkeleton />\n </StyledArticleContent>\n ) : (\n <StyledArticleContent>{content}</StyledArticleContent>\n )}\n {footer}\n </Flex>\n );\n};\n\nArticle.defaultProps = {\n skeletonize: false\n};\n\nexport default Article;\n"]}
@@ -1,19 +0,0 @@
1
- import { ReactNode, FunctionComponent } from 'react';
2
- import { BaseProps, ForwardProps } from '@pega/cosmos-react-core';
3
- export interface ArticleTag {
4
- /** Tag name */
5
- tagName: string;
6
- /** Tag id. If not set tagName is treated as id */
7
- id: string;
8
- }
9
- export interface ArticleFooterProps extends BaseProps {
10
- /** Article tags */
11
- tags?: ArticleTag[];
12
- /** Callback that triggers on click of tag */
13
- onTagClick?: (id: ArticleTag['id']) => void;
14
- /** Footer content */
15
- content?: ReactNode;
16
- }
17
- declare const ArticleFooter: FunctionComponent<ArticleFooterProps & ForwardProps>;
18
- export default ArticleFooter;
19
- //# sourceMappingURL=ArticleFooter.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ArticleFooter.d.ts","sourceRoot":"","sources":["../../../src/components/Article/ArticleFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAA2B,MAAM,OAAO,CAAC;AAG9E,OAAO,EAA+B,SAAS,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAG/F,MAAM,WAAW,UAAU;IACzB,eAAe;IACf,OAAO,EAAE,MAAM,CAAC;IAChB,kDAAkD;IAClD,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,mBAAmB;IACnB,IAAI,CAAC,EAAE,UAAU,EAAE,CAAC;IACpB,6CAA6C;IAC7C,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,UAAU,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC5C,qBAAqB;IACrB,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AA6BD,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CAyCvE,CAAC;AAEF,eAAe,aAAa,CAAC"}
@@ -1,40 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useCallback } from 'react';
3
- import styled, { css } from 'styled-components';
4
- import { Flex, Tag, defaultThemeProp } from '@pega/cosmos-react-core';
5
- import { StyledTag } from '@pega/cosmos-react-core/lib/components/Badges/Tag';
6
- const StyledArticleFooter = styled.div(({ theme }) => {
7
- return css `
8
- flex-shrink: 0;
9
- &::before {
10
- content: '';
11
- display: block;
12
- background: ${theme.base.palette['border-line']};
13
- height: 0.0625rem;
14
- margin-bottom: calc(2 * ${theme.base.spacing});
15
- }
16
- `;
17
- });
18
- StyledArticleFooter.defaultProps = defaultThemeProp;
19
- const StyledTags = styled.div(({ theme }) => {
20
- return css `
21
- padding: calc(0.25 * ${theme.base.spacing});
22
- margin: 0 calc(-0.5 * ${theme.base.spacing});
23
- & > ${StyledTag} {
24
- margin: calc(0.25 * ${theme.base.spacing});
25
- }
26
- `;
27
- });
28
- StyledTags.defaultProps = defaultThemeProp;
29
- const ArticleFooter = (props) => {
30
- const { content, tags, onTagClick, ...restProps } = props;
31
- const onTagClickHandler = useCallback((event) => {
32
- onTagClick?.(event.currentTarget.dataset.tagId);
33
- }, [onTagClick]);
34
- return (_jsxs(Flex, { as: StyledArticleFooter, container: {
35
- direction: 'column',
36
- gap: 2
37
- }, ...restProps, children: [content, tags && (_jsx(Flex, { container: { wrap: 'wrap' }, as: StyledTags, children: tags.map(tag => (_jsx(Tag, { tabIndex: 0, type: 'pill', variant: 'light', "data-tag-id": tag.id, onClick: onTagClickHandler, rel: 'tag', children: tag.tagName }, tag.id))) }))] }));
38
- };
39
- export default ArticleFooter;
40
- //# sourceMappingURL=ArticleFooter.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ArticleFooter.js","sourceRoot":"","sources":["../../../src/components/Article/ArticleFooter.tsx"],"names":[],"mappings":";AAAA,OAAO,EAA4C,WAAW,EAAE,MAAM,OAAO,CAAC;AAC9E,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,gBAAgB,EAA2B,MAAM,yBAAyB,CAAC;AAC/F,OAAO,EAAE,SAAS,EAAE,MAAM,mDAAmD,CAAC;AAkB9E,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACnD,OAAO,GAAG,CAAA;;;;;oBAKQ,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;;gCAErB,KAAK,CAAC,IAAI,CAAC,OAAO;;GAE/C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC1C,OAAO,GAAG,CAAA;2BACe,KAAK,CAAC,IAAI,CAAC,OAAO;4BACjB,KAAK,CAAC,IAAI,CAAC,OAAO;UACpC,SAAS;4BACS,KAAK,CAAC,IAAI,CAAC,OAAO;;GAE3C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,aAAa,GAAyD,CAC1E,KAAyB,EACzB,EAAE;IACF,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAE1D,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,KAA8B,EAAE,EAAE;QACjC,UAAU,EAAE,CAAC,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,KAAM,CAAC,CAAC;IACnD,CAAC,EACD,CAAC,UAAU,CAAC,CACb,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,IACH,EAAE,EAAE,mBAAmB,EACvB,SAAS,EAAE;YACT,SAAS,EAAE,QAAQ;YACnB,GAAG,EAAE,CAAC;SACP,KACG,SAAS,aAEZ,OAAO,EACP,IAAI,IAAI,CACP,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,UAAU,YAC9C,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CACf,KAAC,GAAG,IACF,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,OAAO,iBAEF,GAAG,CAAC,EAAE,EACnB,OAAO,EAAE,iBAAiB,EAC1B,GAAG,EAAC,KAAK,YAER,GAAG,CAAC,OAAO,IALP,GAAG,CAAC,EAAE,CAMP,CACP,CAAC,GACG,CACR,IACI,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { ReactNode, FunctionComponent, MouseEvent, useCallback } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Flex, Tag, defaultThemeProp, BaseProps, ForwardProps } from '@pega/cosmos-react-core';\nimport { StyledTag } from '@pega/cosmos-react-core/lib/components/Badges/Tag';\n\nexport interface ArticleTag {\n /** Tag name */\n tagName: string;\n /** Tag id. If not set tagName is treated as id */\n id: string;\n}\n\nexport interface ArticleFooterProps extends BaseProps {\n /** Article tags */\n tags?: ArticleTag[];\n /** Callback that triggers on click of tag */\n onTagClick?: (id: ArticleTag['id']) => void;\n /** Footer content */\n content?: ReactNode;\n}\n\nconst StyledArticleFooter = styled.div(({ theme }) => {\n return css`\n flex-shrink: 0;\n &::before {\n content: '';\n display: block;\n background: ${theme.base.palette['border-line']};\n height: 0.0625rem;\n margin-bottom: calc(2 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledArticleFooter.defaultProps = defaultThemeProp;\n\nconst StyledTags = styled.div(({ theme }) => {\n return css`\n padding: calc(0.25 * ${theme.base.spacing});\n margin: 0 calc(-0.5 * ${theme.base.spacing});\n & > ${StyledTag} {\n margin: calc(0.25 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledTags.defaultProps = defaultThemeProp;\n\nconst ArticleFooter: FunctionComponent<ArticleFooterProps & ForwardProps> = (\n props: ArticleFooterProps\n) => {\n const { content, tags, onTagClick, ...restProps } = props;\n\n const onTagClickHandler = useCallback(\n (event: MouseEvent<HTMLElement>) => {\n onTagClick?.(event.currentTarget.dataset.tagId!);\n },\n [onTagClick]\n );\n\n return (\n <Flex\n as={StyledArticleFooter}\n container={{\n direction: 'column',\n gap: 2\n }}\n {...restProps}\n >\n {content}\n {tags && (\n <Flex container={{ wrap: 'wrap' }} as={StyledTags}>\n {tags.map(tag => (\n <Tag\n tabIndex={0}\n type='pill'\n variant='light'\n key={tag.id}\n data-tag-id={tag.id}\n onClick={onTagClickHandler}\n rel='tag'\n >\n {tag.tagName}\n </Tag>\n ))}\n </Flex>\n )}\n </Flex>\n );\n};\n\nexport default ArticleFooter;\n"]}
@@ -1,8 +0,0 @@
1
- import { FunctionComponent } from 'react';
2
- import { BaseProps, ForwardProps } from '@pega/cosmos-react-core';
3
- export interface ArticleSkeletonProps extends BaseProps {
4
- }
5
- export declare const StyledArticleSkeleton: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
6
- declare const ArticleSkeleton: FunctionComponent<ArticleSkeletonProps & ForwardProps>;
7
- export default ArticleSkeleton;
8
- //# sourceMappingURL=ArticleSkeleton.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ArticleSkeleton.d.ts","sourceRoot":"","sources":["../../../src/components/Article/ArticleSkeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,EAKL,SAAS,EACT,YAAY,EACb,MAAM,yBAAyB,CAAC;AAEjC,MAAM,WAAW,oBAAqB,SAAQ,SAAS;CAAG;AAE1D,eAAO,MAAM,qBAAqB,yGAAe,CAAC;AAElD,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,GAAG,YAAY,CAqB3E,CAAC;AAEF,eAAe,eAAe,CAAC"}
@@ -1,15 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import styled from 'styled-components';
3
- import { Flex, LineSkeleton, ParagraphSkeleton } from '@pega/cosmos-react-core';
4
- export const StyledArticleSkeleton = styled.div ``;
5
- const ArticleSkeleton = (props) => {
6
- const numberOfLines = 18;
7
- return (_jsx(StyledArticleSkeleton, { ...props, "aria-disabled": 'true', children: _jsx(ParagraphSkeleton, { children: Array.from({ length: numberOfLines }, (_, i) => {
8
- const lines = i % 3 === 0 ? ['s', 'm'] : ['s', 's', 's'];
9
- return (_jsx(Flex, { container: { alignItems: 'center' }, children: lines.map((size, j) => (
10
- // eslint-disable-next-line react/no-array-index-key
11
- _jsx(LineSkeleton, { width: size }, j))) }, i));
12
- }) }) }));
13
- };
14
- export default ArticleSkeleton;
15
- //# sourceMappingURL=ArticleSkeleton.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ArticleSkeleton.js","sourceRoot":"","sources":["../../../src/components/Article/ArticleSkeleton.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EACL,IAAI,EACJ,YAAY,EAEZ,iBAAiB,EAGlB,MAAM,yBAAyB,CAAC;AAIjC,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAElD,MAAM,eAAe,GAA2D,CAC9E,KAA2B,EAC3B,EAAE;IACF,MAAM,aAAa,GAAG,EAAE,CAAC;IACzB,OAAO,CACL,KAAC,qBAAqB,OAAK,KAAK,mBAAgB,MAAM,YACpD,KAAC,iBAAiB,cACf,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;gBAC9C,MAAM,KAAK,GAAiC,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC;gBACvF,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,YACtC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC;oBACtB,oDAAoD;oBACpD,KAAC,YAAY,IAAC,KAAK,EAAE,IAAI,IAAO,CAAC,CAAI,CACtC,CAAC,IAJ4C,CAAC,CAK1C,CACR,CAAC;YACJ,CAAC,CAAC,GACgB,GACE,CACzB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\nimport styled from 'styled-components';\n\nimport {\n Flex,\n LineSkeleton,\n LineSkeletonProps,\n ParagraphSkeleton,\n BaseProps,\n ForwardProps\n} from '@pega/cosmos-react-core';\n\nexport interface ArticleSkeletonProps extends BaseProps {}\n\nexport const StyledArticleSkeleton = styled.div``;\n\nconst ArticleSkeleton: FunctionComponent<ArticleSkeletonProps & ForwardProps> = (\n props: ArticleSkeletonProps\n) => {\n const numberOfLines = 18;\n return (\n <StyledArticleSkeleton {...props} aria-disabled='true'>\n <ParagraphSkeleton>\n {Array.from({ length: numberOfLines }, (_, i) => {\n const lines: LineSkeletonProps['width'][] = i % 3 === 0 ? ['s', 'm'] : ['s', 's', 's'];\n return (\n <Flex container={{ alignItems: 'center' }} key={i}>\n {lines.map((size, j) => (\n // eslint-disable-next-line react/no-array-index-key\n <LineSkeleton width={size} key={j} />\n ))}\n </Flex>\n );\n })}\n </ParagraphSkeleton>\n </StyledArticleSkeleton>\n );\n};\n\nexport default ArticleSkeleton;\n"]}
@@ -1,6 +0,0 @@
1
- export { default } from './Article';
2
- export { default as ArticleFooter } from './ArticleFooter';
3
- export { ArticleTag } from './ArticleFooter';
4
- export { ArticleProps } from './Article';
5
- export { ArticleFooterProps } from './ArticleFooter';
6
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Article/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC"}
@@ -1,3 +0,0 @@
1
- export { default } from './Article';
2
- export { default as ArticleFooter } from './ArticleFooter';
3
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Article/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC","sourcesContent":["export { default } from './Article';\nexport { default as ArticleFooter } from './ArticleFooter';\nexport { ArticleTag } from './ArticleFooter';\nexport { ArticleProps } from './Article';\nexport { ArticleFooterProps } from './ArticleFooter';\n"]}
@@ -1,17 +0,0 @@
1
- import { FunctionComponent, ReactNode, ReactElement, Ref } from 'react';
2
- import { BaseProps, ForwardProps } from '@pega/cosmos-react-core';
3
- import ArticleListHeader from './ArticleListHeader';
4
- export interface ArticleListProps extends BaseProps {
5
- /** Search/filtering criteria for article list */
6
- header?: ReactElement<typeof ArticleListHeader>;
7
- /** Content for article list */
8
- children?: ReactNode;
9
- /** Prop to check visibility of skeleton */
10
- skeletonize: boolean;
11
- /** Footer for article list */
12
- footer?: ReactNode;
13
- ref?: Ref<HTMLDivElement>;
14
- }
15
- declare const ArticleList: FunctionComponent<ArticleListProps & ForwardProps>;
16
- export default ArticleList;
17
- //# sourceMappingURL=ArticleList.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ArticleList.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,SAAS,EACT,YAAY,EAEZ,GAAG,EAEJ,MAAM,OAAO,CAAC;AAGf,OAAO,EAAmC,SAAS,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAGnG,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AAGpD,MAAM,WAAW,gBAAiB,SAAQ,SAAS;IACjD,iDAAiD;IACjD,MAAM,CAAC,EAAE,YAAY,CAAC,OAAO,iBAAiB,CAAC,CAAC;IAChD,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,2CAA2C;IAC3C,WAAW,EAAE,OAAO,CAAC;IACrB,8BAA8B;IAC9B,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AA2DD,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CA0CnE,CAAC;AAIF,eAAe,WAAW,CAAC"}