@pega/cosmos-react-cs 4.0.0-dev.14.2 → 4.0.0-dev.15.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 (59) hide show
  1. package/lib/components/CallControlPanel/CallControlPanel.d.ts.map +1 -1
  2. package/lib/components/CallControlPanel/CallControlPanel.js +19 -18
  3. package/lib/components/CallControlPanel/CallControlPanel.js.map +1 -1
  4. package/lib/components/CallControlPanel/FloatingPanel.d.ts.map +1 -1
  5. package/lib/components/CallControlPanel/FloatingPanel.js +1 -1
  6. package/lib/components/CallControlPanel/FloatingPanel.js.map +1 -1
  7. package/lib/components/InteractionNotification/CountdownButton.d.ts +15 -0
  8. package/lib/components/InteractionNotification/CountdownButton.d.ts.map +1 -0
  9. package/lib/components/InteractionNotification/{AcceptButton.js → CountdownButton.js} +4 -4
  10. package/lib/components/InteractionNotification/CountdownButton.js.map +1 -0
  11. package/lib/components/InteractionNotification/InteractionNotification.d.ts +4 -4
  12. package/lib/components/InteractionNotification/InteractionNotification.d.ts.map +1 -1
  13. package/lib/components/InteractionNotification/InteractionNotification.js +52 -9
  14. package/lib/components/InteractionNotification/InteractionNotification.js.map +1 -1
  15. package/lib/components/Picker/Picker.d.ts +6 -0
  16. package/lib/components/Picker/Picker.d.ts.map +1 -0
  17. package/lib/components/Picker/Picker.js +109 -0
  18. package/lib/components/Picker/Picker.js.map +1 -0
  19. package/lib/components/Picker/Picker.styles.d.ts +8 -0
  20. package/lib/components/Picker/Picker.styles.d.ts.map +1 -0
  21. package/lib/components/Picker/Picker.styles.js +59 -0
  22. package/lib/components/Picker/Picker.styles.js.map +1 -0
  23. package/lib/components/Picker/Picker.types.d.ts +35 -0
  24. package/lib/components/Picker/Picker.types.d.ts.map +1 -0
  25. package/lib/components/Picker/Picker.types.js.map +1 -0
  26. package/lib/components/Picker/index.d.ts +2 -0
  27. package/lib/components/Picker/index.d.ts.map +1 -0
  28. package/lib/components/Picker/index.js +2 -0
  29. package/lib/components/Picker/index.js.map +1 -0
  30. package/lib/components/TaskManager/TaskManager.d.ts.map +1 -1
  31. package/lib/components/TaskManager/TaskManager.js +27 -11
  32. package/lib/components/TaskManager/TaskManager.js.map +1 -1
  33. package/lib/components/TaskManager/TaskManager.types.d.ts +2 -2
  34. package/lib/components/TaskManager/TaskManager.types.d.ts.map +1 -1
  35. package/lib/components/TaskManager/TaskManager.types.js.map +1 -1
  36. package/lib/components/TaskManager/TaskPicker.d.ts +19 -0
  37. package/lib/components/TaskManager/TaskPicker.d.ts.map +1 -0
  38. package/lib/components/TaskManager/TaskPicker.js +89 -0
  39. package/lib/components/TaskManager/TaskPicker.js.map +1 -0
  40. package/lib/components/TaskManager/index.d.ts +1 -1
  41. package/lib/components/TaskManager/index.d.ts.map +1 -1
  42. package/lib/components/TaskManager/index.js +1 -1
  43. package/lib/components/TaskManager/index.js.map +1 -1
  44. package/lib/index.d.ts +1 -0
  45. package/lib/index.d.ts.map +1 -1
  46. package/lib/index.js +1 -0
  47. package/lib/index.js.map +1 -1
  48. package/package.json +3 -3
  49. package/lib/components/InteractionNotification/AcceptButton.d.ts +0 -15
  50. package/lib/components/InteractionNotification/AcceptButton.d.ts.map +0 -1
  51. package/lib/components/InteractionNotification/AcceptButton.js.map +0 -1
  52. package/lib/components/TaskManager/Picker/Picker.d.ts +0 -10
  53. package/lib/components/TaskManager/Picker/Picker.d.ts.map +0 -1
  54. package/lib/components/TaskManager/Picker/Picker.js +0 -261
  55. package/lib/components/TaskManager/Picker/Picker.js.map +0 -1
  56. package/lib/components/TaskManager/Picker/Picker.types.d.ts +0 -28
  57. package/lib/components/TaskManager/Picker/Picker.types.d.ts.map +0 -1
  58. package/lib/components/TaskManager/Picker/Picker.types.js.map +0 -1
  59. /package/lib/components/{TaskManager/Picker → Picker}/Picker.types.js +0 -0
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,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,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 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 Picker } from './components/Picker';\nexport { default as TaskManager } from './components/TaskManager';\nexport * from './components/TaskManager';\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-cs",
3
- "version": "4.0.0-dev.14.2",
3
+ "version": "4.0.0-dev.15.0",
4
4
  "author": "Pegasystems",
5
5
  "license": "SEE LICENSE IN LICENSE",
6
6
  "repository": {
@@ -20,8 +20,8 @@
20
20
  "build": "tsc -b"
21
21
  },
22
22
  "dependencies": {
23
- "@pega/cosmos-react-core": "4.0.0-dev.14.2",
24
- "@pega/cosmos-react-dnd": "4.0.0-dev.14.2",
23
+ "@pega/cosmos-react-core": "4.0.0-dev.15.0",
24
+ "@pega/cosmos-react-dnd": "4.0.0-dev.15.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",
@@ -1,15 +0,0 @@
1
- import { FunctionComponent, MouseEventHandler } from 'react';
2
- import { NoChildrenProp } from '@pega/cosmos-react-core';
3
- export interface AcceptButtonProps extends NoChildrenProp {
4
- /** Start time of incoming Interaction. */
5
- startTime: Date | number;
6
- /** The time the user has to accept the call in seconds. */
7
- timeout: number;
8
- /** Callback invoked when timeout ends. */
9
- onTimerEnd?: () => void;
10
- /** Callback invoked when user clicks the button. */
11
- onClick: MouseEventHandler;
12
- }
13
- declare const AcceptButton: FunctionComponent<AcceptButtonProps>;
14
- export default AcceptButton;
15
- //# sourceMappingURL=AcceptButton.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"AcceptButton.d.ts","sourceRoot":"","sources":["../../../src/components/InteractionNotification/AcceptButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAQ,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAGxF,OAAO,EAOL,cAAc,EACf,MAAM,yBAAyB,CAAC;AAIjC,MAAM,WAAW,iBAAkB,SAAQ,cAAc;IACvD,0CAA0C;IAC1C,SAAS,EAAE,IAAI,GAAG,MAAM,CAAC;IACzB,2DAA2D;IAC3D,OAAO,EAAE,MAAM,CAAC;IAChB,0CAA0C;IAC1C,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,oDAAoD;IACpD,OAAO,EAAE,iBAAiB,CAAC;CAC5B;AAUD,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAkDtD,CAAC;AAEF,eAAe,YAAY,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"AcceptButton.js","sourceRoot":"","sources":["../../../src/components/InteractionNotification/AcceptButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,IAAI,EAAqB,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxF,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,OAAO,EACP,IAAI,EACJ,kBAAkB,EAClB,MAAM,EACN,MAAM,EACN,gBAAgB,EAEjB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAa3D,MAAM,kBAAkB,GAAG,MAAM,CAAC,MAAM,CAAC,CACvC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;WACT,KAAK,CAAC,IAAI,CAAC,OAAO;GAC1B,CACF,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,YAAY,GAAyC,IAAI,CAC7D,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,UAAU,EAAE,OAAO,EAAqB,EAAE,EAAE;IACjE,MAAM,SAAS,GAAG,OAAO,GAAG,IAAI,CAAC;IACjC,MAAM,KAAK,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC;IAChC,MAAM,OAAO,GAAG,KAAK,GAAG,SAAS,CAAC;IAClC,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;IAE3E,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAExD,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,aAAa,GAAG,MAAM,EAAE,CAAC;IAE/B,SAAS,CACP,GAAG,EAAE;QACH,IAAI,SAAiB,CAAC;QAEtB,IAAI,WAAW,GAAG,CAAC,EAAE;YACnB,SAAS,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;gBACjC,cAAc,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;YACvC,CAAC,EAAE,IAAI,CAAC,CAAC;SACV;aAAM;YACL,UAAU,EAAE,EAAE,CAAC;SAChB;QAED,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IACvC,CAAC;IACD,uDAAuD;IACvD,4FAA4F;IAC5F,mFAAmF;IACnF,CAAC,WAAW,CAAC,CACd,CAAC;IAEF,MAAM,KAAK,GAAG,WAAW,GAAG,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;IAErE,OAAO,CACL,8BACE,MAAC,kBAAkB,IAAC,OAAO,EAAC,SAAS,sBAAmB,aAAa,EAAE,OAAO,EAAE,OAAO,aACpF,CAAC,CAAC,QAAQ,CAAC,EACZ,KAAC,IAAI,mBAAa,MAAM,YAAE,KAAK,GAAQ,IACpB,EACrB,KAAC,kBAAkB,mBAAa,MAAM,EAAC,EAAE,EAAE,aAAa,YACrD,WAAW,GAAG,CAAC;oBACd,CAAC,CAAC,CAAC,CAAC,4BAA4B,EAAE,CAAC,gBAAgB,CAAC,EAAE;wBAClD,KAAK,EAAE,gBAAgB;qBACxB,CAAC;oBACJ,CAAC,CAAC,CAAC,CAAC,0BAA0B,CAAC,GACd,IACpB,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { FunctionComponent, memo, MouseEventHandler, useEffect, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n useI18n,\n Text,\n VisuallyHiddenText,\n useUID,\n Button,\n defaultThemeProp,\n NoChildrenProp\n} from '@pega/cosmos-react-core';\n\nimport { formatDuration } from '../CallControlPanel/utils';\n\nexport interface AcceptButtonProps extends NoChildrenProp {\n /** Start time of incoming Interaction. */\n startTime: Date | number;\n /** The time the user has to accept the call in seconds. */\n timeout: number;\n /** Callback invoked when timeout ends. */\n onTimerEnd?: () => void;\n /** Callback invoked when user clicks the button. */\n onClick: MouseEventHandler;\n}\n\nconst StyledAcceptButton = styled(Button)(\n ({ theme }) => css`\n gap: ${theme.base.spacing};\n `\n);\n\nStyledAcceptButton.defaultProps = defaultThemeProp;\n\nconst AcceptButton: FunctionComponent<AcceptButtonProps> = memo(\n ({ startTime, timeout, onTimerEnd, onClick }: AcceptButtonProps) => {\n const timeoutMs = timeout * 1000;\n const start = Number(startTime);\n const endTime = start + timeoutMs;\n const [msRemaining, setMsRemaining] = useState(() => endTime - Date.now());\n\n const secondsRemaining = Math.round(msRemaining / 1000);\n\n const t = useI18n();\n const descriptionId = useUID();\n\n useEffect(\n () => {\n let timeoutId: number;\n\n if (msRemaining > 0) {\n timeoutId = window.setTimeout(() => {\n setMsRemaining(endTime - Date.now());\n }, 1000);\n } else {\n onTimerEnd?.();\n }\n\n return () => clearTimeout(timeoutId);\n },\n // Omitting onTimerEnd as an effect trigger on purpose.\n // An unstable function definition in the prop causes the effect to run more than necessary.\n // The proper definition will be captured and used with any changes to msRemaining.\n [msRemaining]\n );\n\n const timer = msRemaining > 0 ? formatDuration(msRemaining) : '0:00';\n\n return (\n <>\n <StyledAcceptButton variant='primary' aria-describedby={descriptionId} onClick={onClick}>\n {t('accept')}\n <Text aria-hidden='true'>{timer}</Text>\n </StyledAcceptButton>\n <VisuallyHiddenText aria-hidden='true' id={descriptionId}>\n {msRemaining > 0\n ? t('interaction_time_remaining', [secondsRemaining], {\n count: secondsRemaining\n })\n : t('interaction_time_expired')}\n </VisuallyHiddenText>\n </>\n );\n }\n);\n\nexport default AcceptButton;\n"]}
@@ -1,10 +0,0 @@
1
- import { FunctionComponent } from 'react';
2
- import { ForwardProps } from '@pega/cosmos-react-core';
3
- import { PickerProps } from './Picker.types';
4
- export declare const StyledSelectedTasks: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
5
- export declare const StyledSummaryItem: import("styled-components").StyledComponent<FunctionComponent<import("@pega/cosmos-react-core").SummaryItemProps & ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
6
- export declare const StyledDDList: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;
7
- export declare const StyledDragHandle: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
8
- declare const Picker: FunctionComponent<PickerProps & ForwardProps>;
9
- export default Picker;
10
- //# 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,EAKL,YAAY,EAmBb,MAAM,yBAAyB,CAAC;AAcjC,OAAO,EAA8B,WAAW,EAAqB,MAAM,gBAAgB,CAAC;AAI5F,eAAO,MAAM,mBAAmB,yGAS9B,CAAC;AAIH,eAAO,MAAM,iBAAiB,wLAO5B,CAAC;AAIH,eAAO,MAAM,YAAY,wGAKvB,CAAC;AAIH,eAAO,MAAM,gBAAgB,yGAK5B,CAAC;AAiGF,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CA6SzD,CAAC;AAEF,eAAe,MAAM,CAAC"}
@@ -1,261 +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, Icon, Menu, menuHelpers, EmptyState, SearchInput, SummaryItem, Text, useI18n, Switch, useArrows, useConsolidatedRef, useElement, registerIcon, getFocusables, FormDialog, useUID, useOuterEvent, createStringMatcher } 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
- import Dialog from '@pega/cosmos-react-core/lib/components/Dialog/Dialog';
10
- import { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';
11
- import { StyledChildrenWrap, StyledDialogContent, StyledDialogHeader } from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.styles';
12
- registerIcon(timesIcon, dragIcon, trashIcon);
13
- export const StyledSelectedTasks = styled.div(({ theme }) => {
14
- return css `
15
- width: 17.5rem;
16
- padding: ${theme.base.spacing} 0 0 ${theme.base.spacing};
17
- border-inline-start: 0.0625rem solid ${theme.base.palette['border-line']};
18
- > h3 {
19
- padding: 0 0 ${theme.base.spacing} ${theme.base.spacing};
20
- }
21
- `;
22
- });
23
- StyledSelectedTasks.defaultProps = defaultThemeProp;
24
- export const StyledSummaryItem = styled(SummaryItem)(({ theme }) => {
25
- return css `
26
- padding: ${theme.base.spacing} 0;
27
- &:not(:last-child) {
28
- border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};
29
- }
30
- `;
31
- });
32
- StyledSummaryItem.defaultProps = defaultThemeProp;
33
- export const StyledDDList = styled.ul(({ theme }) => {
34
- return css `
35
- padding-inline-end: calc(0.25 * ${theme.base.spacing});
36
- overflow-y: auto;
37
- `;
38
- });
39
- StyledDDList.defaultProps = defaultThemeProp;
40
- export const StyledDragHandle = styled.div `
41
- cursor: move;
42
- > svg {
43
- display: block;
44
- }
45
- `;
46
- const StyledCount = styled(Count)(({ theme }) => {
47
- return css `
48
- margin-inline-start: calc(0.5 * ${theme.base.spacing});
49
- `;
50
- });
51
- StyledCount.defaultProps = defaultThemeProp;
52
- const StyledSingleTaskDialog = styled(Dialog)(() => {
53
- return css `
54
- ${StyledMenu} {
55
- overflow: auto;
56
- }
57
- `;
58
- });
59
- const StyledMultiTaskDialog = styled(FormDialog)(({ theme }) => {
60
- return css `
61
- ${StyledDialogContent},
62
- ${StyledChildrenWrap} {
63
- display: flex;
64
- }
65
-
66
- ${StyledDialogHeader} {
67
- padding-inline: ${theme.base.spacing};
68
- }
69
-
70
- ${StyledDialogContent} {
71
- padding-inline: 0;
72
- }
73
-
74
- ${StyledMenu} {
75
- overflow: auto;
76
- }
77
- `;
78
- });
79
- StyledMultiTaskDialog.defaultProps = defaultThemeProp;
80
- const SelectedItemRenderer = ({ dragRef, previewRef, data }) => {
81
- const t = useI18n();
82
- return (_jsx("li", { children: _jsx(StyledSummaryItem, { ref: previewRef, visual: _jsx(StyledDragHandle, { ref: dragRef, children: _jsx(Icon, { name: 'drag' }) }), primary: data.primary, secondary: data.secondary, actions: _jsx(Button, { variant: 'simple', icon: true, "aria-label": t('delete_noun', [data.primary]), label: t('delete'), onClick: () => data.onRemoveSelection?.(data.id), children: _jsx(Icon, { name: 'trash' }) }) }) }));
83
- };
84
- const DraggableSelectedList = ({ selectedItems, onChange, itemRenderer }) => {
85
- return (_jsx(DragDropManager, { children: _jsx(DragDropList, { as: StyledDDList, accept: 'string', items: selectedItems.map(item => ({
86
- id: item.id,
87
- type: 'string',
88
- data: item
89
- })), itemRenderer: itemRenderer, onChange: onChange }) }));
90
- };
91
- const Picker = forwardRef(({ items, emptyText, title, placeholder, onAdd, onCancel, target, ...restProps }, ref) => {
92
- const t = useI18n();
93
- const headingId = useUID();
94
- const [initialItems, setItems] = useState(items);
95
- const [searchInput, setSearchInput] = useState('');
96
- const [multiSelect, setMultiSelect] = useState(false);
97
- const filterRegex = createStringMatcher(searchInput);
98
- const [selections, setSelections] = useState([]);
99
- const searchEleRef = useRef(null);
100
- const selectedTasksWrapperRef = useRef(null);
101
- const [pickerEl, setPickerEl] = useElement();
102
- const pickerRef = useConsolidatedRef(ref, setPickerEl);
103
- const toggle = useRef(null);
104
- const initialRender = useRef(true);
105
- const initializePicker = () => {
106
- setItems(items);
107
- setSelections([]);
108
- setMultiSelect(false);
109
- };
110
- useOuterEvent('mousedown', [target, pickerRef], () => {
111
- initializePicker();
112
- onCancel?.();
113
- });
114
- useEffect(() => {
115
- setItems(items);
116
- }, [items]);
117
- useEffect(() => {
118
- if (initialRender.current) {
119
- initialRender.current = false;
120
- }
121
- else {
122
- toggle.current?.focus();
123
- }
124
- }, [multiSelect]);
125
- const onKeydown = useCallback((e) => {
126
- const { key } = e;
127
- if (key === 'Escape') {
128
- initializePicker();
129
- onCancel?.();
130
- }
131
- else if (key === 'Tab' && pickerEl) {
132
- const focusableContent = getFocusables(pickerRef);
133
- if (!focusableContent || focusableContent.length < 2)
134
- return;
135
- const firstFocusableElement = focusableContent[0];
136
- const lastFocusableElement = focusableContent[focusableContent.length - 1];
137
- if (e.shiftKey) {
138
- if (document.activeElement === firstFocusableElement) {
139
- lastFocusableElement.focus();
140
- e.preventDefault();
141
- }
142
- }
143
- else if (document.activeElement === lastFocusableElement) {
144
- firstFocusableElement.focus();
145
- e.preventDefault();
146
- }
147
- }
148
- // when focus is in the list setting the tabindex of first element as -1 and on focusing out the tabindex to be 0
149
- const focusEl = selectedTasksWrapperRef.current;
150
- if (!focusEl)
151
- return;
152
- const focusable = Array.from(focusEl.querySelectorAll('button'));
153
- if (focusable.length === 0)
154
- return;
155
- if (focusEl.contains(document.activeElement))
156
- focusable[0].tabIndex = -1;
157
- else if (focusable[0].tabIndex === -1)
158
- focusable[0].tabIndex = 0;
159
- }, [onCancel, pickerEl, multiSelect]);
160
- useEffect(() => {
161
- document.addEventListener('keydown', onKeydown);
162
- return () => {
163
- document.removeEventListener('keydown', onKeydown);
164
- };
165
- }, [pickerEl, multiSelect]);
166
- const renderItems = useMemo(() => {
167
- return menuHelpers.mapTree(searchInput
168
- ? menuHelpers
169
- .flatten(initialItems)
170
- .filter(({ primary, items: childItems }) => {
171
- return filterRegex.test(primary) && !childItems?.length;
172
- })
173
- : initialItems, item => {
174
- let selectable = false;
175
- if (!item.items) {
176
- selectable = true;
177
- }
178
- return {
179
- ...item,
180
- selected: selectable ? !!item.selected : undefined
181
- };
182
- });
183
- }, [searchInput, items, filterRegex]);
184
- const removeTasks = useCallback((uid) => {
185
- setItems((cur) => menuHelpers.toggleSelected(cur, uid, 'multi-select'));
186
- setSelections(cur => {
187
- const itemToRemove = menuHelpers.getItem(cur, uid);
188
- return cur.filter(item => item.id !== itemToRemove?.id);
189
- });
190
- // 0 second timeout added because DOM needs to be up to date after list is updated before running query
191
- // setting the focus to the first element in the list on deletion and if empty then to search input
192
- setTimeout(() => {
193
- const focusable = getFocusables(selectedTasksWrapperRef);
194
- if (focusable.length > 0)
195
- focusable[0].focus();
196
- else
197
- searchEleRef.current.focus();
198
- }, 0);
199
- }, []);
200
- const toggleSelectedRegion = () => {
201
- setMultiSelect(curr => !curr);
202
- };
203
- useArrows(selectedTasksWrapperRef, {
204
- selector: 'button',
205
- dir: 'up-down'
206
- }, [selections.length]);
207
- const searchAndSwitch = (_jsxs(Flex, { container: { direction: 'column', gap: 1, pad: [0, 1] }, children: [_jsx(SearchInput, { ref: searchEleRef, value: searchInput, onSearchChange: setSearchInput, placeholder: placeholder || t('search_placeholder_default'), autoFocus: true }), _jsx(Switch, { label: t('select_multiple'), on: multiSelect, onChange: toggleSelectedRegion, ref: toggle })] }));
208
- const taskMenu = (_jsx(Menu, { items: renderItems, role: 'listbox', onItemClick: (uid) => {
209
- const clickedItem = menuHelpers.getItem(renderItems, uid);
210
- const parentItem = clickedItem?.ancestors
211
- ? clickedItem.ancestors[0]
212
- : menuHelpers.getParentItem(renderItems, uid);
213
- if (clickedItem) {
214
- if (multiSelect) {
215
- searchEleRef.current?.focus();
216
- setItems((cur) => menuHelpers.toggleSelected(cur, uid, 'multi-select'));
217
- if (selections.find(item => item.id === uid)) {
218
- setSelections(cur => cur.filter(item => item.id !== clickedItem?.id));
219
- }
220
- else {
221
- setSelections(cur => {
222
- let secondary;
223
- if (parentItem)
224
- secondary = menuHelpers.isItem(parentItem)
225
- ? parentItem.primary
226
- : parentItem.label;
227
- return [
228
- ...cur,
229
- {
230
- ...clickedItem,
231
- secondary,
232
- onRemoveSelection: removeTasks
233
- }
234
- ];
235
- });
236
- }
237
- setSearchInput('');
238
- }
239
- else {
240
- onAdd([clickedItem]);
241
- }
242
- }
243
- }, focusControlEl: searchEleRef.current || undefined, emptyText: emptyText || t('no_items'), accent: filterRegex, mode: multiSelect ? 'multi-select' : 'action', arrowNavigationUnsupported: true, scrollAt: Infinity }));
244
- return multiSelect ? (_jsx(StyledMultiTaskDialog, { ...restProps, target: target, heading: t('add_tasks'), ref: pickerRef, onCancel: () => {
245
- initializePicker();
246
- onCancel();
247
- }, onSubmit: {
248
- text: t('add'),
249
- disabled: !selections.length,
250
- handler: () => {
251
- onAdd(selections);
252
- }
253
- }, children: _jsxs(Flex, { container: true, children: [_jsxs(Flex, { container: { direction: 'column', gap: 1 }, children: [searchAndSwitch, taskMenu] }), _jsxs(Flex, { as: StyledSelectedTasks, container: { direction: 'column' }, ref: selectedTasksWrapperRef, children: [_jsx(Text, { variant: 'h3', children: t('selected_tasks') }), selections.length > 0 ? (_jsx(DraggableSelectedList, { selectedItems: selections, onChange: newItems => {
254
- setSelections(newItems.map(({ type, data }) => ({
255
- ...data,
256
- type
257
- })));
258
- }, itemRenderer: SelectedItemRenderer })) : (_jsx(EmptyState, { message: t('no_selected_tasks') }))] })] }) })) : (_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_task') }), _jsx(Button, { icon: true, variant: 'simple', onClick: onCancel, label: t('close'), "aria-label": t('close_noun', [t('task_manager_add_task')]), children: _jsx(Icon, { name: 'times' }) })] }), searchAndSwitch, taskMenu] }));
259
- });
260
- export default Picker;
261
- //# 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 ForwardProps,\n Icon,\n Menu,\n menuHelpers,\n EmptyState,\n SearchInput,\n SummaryItem,\n Text,\n useI18n,\n Switch,\n useArrows,\n useConsolidatedRef,\n useElement,\n registerIcon,\n getFocusables,\n FormDialog,\n useUID,\n useOuterEvent,\n createStringMatcher\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';\nimport Dialog from '@pega/cosmos-react-core/lib/components/Dialog/Dialog';\nimport { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';\nimport {\n StyledChildrenWrap,\n StyledDialogContent,\n StyledDialogHeader\n} from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.styles';\n\nimport { DraggableSelectedListProps, PickerProps, SelectedItemProps } from './Picker.types';\n\nregisterIcon(timesIcon, dragIcon, trashIcon);\n\nexport const StyledSelectedTasks = styled.div(({ theme }) => {\n return css`\n width: 17.5rem;\n padding: ${theme.base.spacing} 0 0 ${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});\n\nStyledSelectedTasks.defaultProps = defaultThemeProp;\n\nexport const 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});\n\nStyledSummaryItem.defaultProps = defaultThemeProp;\n\nexport const StyledDDList = styled.ul(({ theme }) => {\n return css`\n padding-inline-end: calc(0.25 * ${theme.base.spacing});\n overflow-y: auto;\n `;\n});\n\nStyledDDList.defaultProps = defaultThemeProp;\n\nexport const 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 StyledSingleTaskDialog = styled(Dialog)(() => {\n return css`\n ${StyledMenu} {\n overflow: auto;\n }\n `;\n});\n\nconst StyledMultiTaskDialog = styled(FormDialog)(({ theme }) => {\n return css`\n ${StyledDialogContent},\n ${StyledChildrenWrap} {\n display: flex;\n }\n\n ${StyledDialogHeader} {\n padding-inline: ${theme.base.spacing};\n }\n\n ${StyledDialogContent} {\n padding-inline: 0;\n }\n\n ${StyledMenu} {\n overflow: auto;\n }\n `;\n});\n\nStyledMultiTaskDialog.defaultProps = defaultThemeProp;\n\nconst SelectedItemRenderer = ({\n dragRef,\n previewRef,\n data\n}: ItemRendererProps<SelectedItemProps>) => {\n const t = useI18n();\n\n return (\n <li>\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 aria-label={t('delete_noun', [data.primary])}\n label={t('delete')}\n onClick={() => data.onRemoveSelection?.(data.id)}\n >\n <Icon name='trash' />\n </Button>\n }\n />\n </li>\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 items,\n emptyText,\n title,\n placeholder,\n onAdd,\n onCancel,\n target,\n ...restProps\n }: PropsWithoutRef<PickerProps>,\n ref: PickerProps['ref']\n ) => {\n const t = useI18n();\n const headingId = useUID();\n\n const [initialItems, setItems] = useState<PickerProps['items']>(items);\n\n const [searchInput, setSearchInput] = useState('');\n const [multiSelect, setMultiSelect] = useState(false);\n\n const filterRegex = createStringMatcher(searchInput);\n const [selections, setSelections] = useState<SelectedItemProps[]>([]);\n const searchEleRef = useRef<HTMLInputElement>(null);\n\n const selectedTasksWrapperRef = useRef<HTMLDivElement>(null);\n const [pickerEl, setPickerEl] = useElement<HTMLDivElement>();\n const pickerRef = useConsolidatedRef(ref, setPickerEl);\n const toggle = useRef<HTMLInputElement>(null);\n const initialRender = useRef(true);\n\n const initializePicker = () => {\n setItems(items);\n setSelections([]);\n setMultiSelect(false);\n };\n\n useOuterEvent('mousedown', [target, pickerRef], () => {\n initializePicker();\n onCancel?.();\n });\n\n useEffect(() => {\n setItems(items);\n }, [items]);\n\n useEffect(() => {\n if (initialRender.current) {\n initialRender.current = false;\n } else {\n toggle.current?.focus();\n }\n }, [multiSelect]);\n\n const onKeydown = useCallback(\n (e: KeyboardEvent) => {\n const { key } = e;\n if (key === 'Escape') {\n initializePicker();\n onCancel?.();\n } else if (key === 'Tab' && pickerEl) {\n const focusableContent = getFocusables(pickerRef);\n\n if (!focusableContent || focusableContent.length < 2) return;\n\n const firstFocusableElement = focusableContent[0];\n const lastFocusableElement = focusableContent[focusableContent.length - 1];\n\n if (e.shiftKey) {\n if (document.activeElement === firstFocusableElement) {\n lastFocusableElement.focus();\n e.preventDefault();\n }\n } else if (document.activeElement === lastFocusableElement) {\n firstFocusableElement.focus();\n e.preventDefault();\n }\n }\n\n // when focus is in the list setting the tabindex of first element as -1 and on focusing out the tabindex to be 0\n const focusEl = selectedTasksWrapperRef.current;\n if (!focusEl) return;\n\n const focusable = Array.from(focusEl.querySelectorAll('button'));\n if (focusable.length === 0) return;\n\n if (focusEl.contains(document.activeElement)) focusable[0].tabIndex = -1;\n else if (focusable[0].tabIndex === -1) focusable[0].tabIndex = 0;\n },\n [onCancel, pickerEl, multiSelect]\n );\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, [pickerEl, multiSelect]);\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\n if (!item.items) {\n selectable = true;\n }\n\n return {\n ...item,\n selected: selectable ? !!item.selected : undefined\n };\n }\n );\n }, [searchInput, items, 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 // 0 second timeout added because DOM needs to be up to date after list is updated before running query\n // setting the focus to the first element in the list on deletion and if empty then to search input\n setTimeout(() => {\n const focusable = getFocusables(selectedTasksWrapperRef);\n if (focusable.length > 0) focusable[0].focus();\n else searchEleRef.current!.focus();\n }, 0);\n }, []);\n\n const toggleSelectedRegion = () => {\n setMultiSelect(curr => !curr);\n };\n\n useArrows(\n selectedTasksWrapperRef,\n {\n selector: 'button',\n dir: 'up-down'\n },\n [selections.length]\n );\n\n const searchAndSwitch = (\n <Flex container={{ direction: 'column', gap: 1, pad: [0, 1] }}>\n <SearchInput\n ref={searchEleRef}\n value={searchInput}\n onSearchChange={setSearchInput}\n placeholder={placeholder || t('search_placeholder_default')}\n autoFocus\n />\n <Switch\n label={t('select_multiple')}\n on={multiSelect}\n onChange={toggleSelectedRegion}\n ref={toggle}\n />\n </Flex>\n );\n\n const taskMenu = (\n <Menu\n items={renderItems}\n role='listbox'\n onItemClick={(uid: string) => {\n const clickedItem = menuHelpers.getItem(renderItems, uid);\n const parentItem = clickedItem?.ancestors\n ? clickedItem.ancestors[0]\n : menuHelpers.getParentItem(renderItems, uid);\n\n if (clickedItem) {\n if (multiSelect) {\n searchEleRef.current?.focus();\n\n setItems((cur: PickerProps['items']) =>\n menuHelpers.toggleSelected(cur, uid, 'multi-select')\n );\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 onRemoveSelection: removeTasks\n } as SelectedItemProps\n ];\n });\n }\n setSearchInput('');\n } else {\n onAdd([clickedItem]);\n }\n }\n }}\n focusControlEl={searchEleRef.current || undefined}\n emptyText={emptyText || t('no_items')}\n accent={filterRegex}\n mode={multiSelect ? 'multi-select' : 'action'}\n arrowNavigationUnsupported\n scrollAt={Infinity}\n />\n );\n\n return multiSelect ? (\n <StyledMultiTaskDialog\n {...restProps}\n target={target}\n heading={t('add_tasks')}\n ref={pickerRef}\n onCancel={() => {\n initializePicker();\n onCancel();\n }}\n onSubmit={{\n text: t('add'),\n disabled: !selections.length,\n handler: () => {\n onAdd(selections);\n }\n }}\n >\n <Flex container>\n <Flex container={{ direction: 'column', gap: 1 }}>\n {searchAndSwitch}\n {taskMenu}\n </Flex>\n\n <Flex\n as={StyledSelectedTasks}\n container={{ direction: 'column' }}\n ref={selectedTasksWrapperRef}\n >\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 </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_task')}\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_task')])}\n >\n <Icon name='times' />\n </Button>\n </Flex>\n {searchAndSwitch}\n {taskMenu}\n </Flex>\n );\n }\n);\n\nexport default Picker;\n"]}
@@ -1,28 +0,0 @@
1
- import { ComponentType, Ref } from 'react';
2
- import { BaseProps, FormDialogProps, 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
- target: FormDialogProps['target'];
19
- }
20
- export interface DraggableSelectedListProps {
21
- selectedItems: SelectedItemProps[];
22
- onChange: (items: DraggableItem<SelectedItemProps>[]) => void;
23
- itemRenderer: ComponentType<ItemRendererProps<SelectedItemProps>>;
24
- }
25
- export interface SelectedItemProps extends MenuItemProps {
26
- onRemoveSelection?: (id: MenuItemProps['id']) => void;
27
- }
28
- //# 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,eAAe,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAChF,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,EAAE,MAAM,IAAI,CAAC;IACrB,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;IACf,MAAM,EAAE,eAAe,CAAC,QAAQ,CAAC,CAAC;CACnC;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,iBAAiB,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;CACvD"}
@@ -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, FormDialogProps, 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 target: FormDialogProps['target'];\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 onRemoveSelection?: (id: MenuItemProps['id']) => void;\n}\n"]}