@pega/cosmos-react-cs 4.0.0-dev.12.1 → 4.0.0-dev.14.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.
- package/lib/components/CallControlPanel/Call.d.ts.map +1 -1
- package/lib/components/CallControlPanel/Call.js +14 -12
- package/lib/components/CallControlPanel/Call.js.map +1 -1
- package/lib/components/CallControlPanel/CallControlPanel.d.ts.map +1 -1
- package/lib/components/CallControlPanel/CallControlPanel.js +7 -5
- package/lib/components/CallControlPanel/CallControlPanel.js.map +1 -1
- package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.d.ts.map +1 -1
- package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.js +1 -0
- package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.js.map +1 -1
- package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.d.ts +1 -1
- package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.d.ts.map +1 -1
- package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.js +4 -4
- package/lib/components/CallControlPanel/CallHandover/CallHandoverForm.js.map +1 -1
- package/lib/components/CallControlPanel/utils.d.ts.map +1 -1
- package/lib/components/CallControlPanel/utils.js +0 -1
- package/lib/components/CallControlPanel/utils.js.map +1 -1
- package/lib/components/DialPad/DialPadDialog.d.ts.map +1 -1
- package/lib/components/DialPad/DialPadDialog.js +1 -0
- package/lib/components/DialPad/DialPadDialog.js.map +1 -1
- package/lib/components/DialPad/KeyboardNavigation.js.map +1 -1
- package/lib/components/InteractionTimer/InteractionTimer.d.ts.map +1 -1
- package/lib/components/InteractionTimer/InteractionTimer.js +22 -4
- package/lib/components/InteractionTimer/InteractionTimer.js.map +1 -1
- package/lib/components/TaskManager/Picker/Picker.d.ts +0 -4
- package/lib/components/TaskManager/Picker/Picker.d.ts.map +1 -1
- package/lib/components/TaskManager/Picker/Picker.js +90 -89
- package/lib/components/TaskManager/Picker/Picker.js.map +1 -1
- package/lib/components/TaskManager/TaskManager.d.ts.map +1 -1
- package/lib/components/TaskManager/TaskManager.js +15 -22
- package/lib/components/TaskManager/TaskManager.js.map +1 -1
- package/lib/components/TaskManager/TaskManager.types.d.ts +4 -2
- package/lib/components/TaskManager/TaskManager.types.d.ts.map +1 -1
- package/lib/components/TaskManager/TaskManager.types.js.map +1 -1
- package/lib/components/TaskManager/TaskManagerTabs.d.ts.map +1 -1
- package/lib/components/TaskManager/TaskManagerTabs.js +4 -4
- package/lib/components/TaskManager/TaskManagerTabs.js.map +1 -1
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TaskManager.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n PropsWithoutRef,\n forwardRef,\n useRef,\n useEffect,\n MouseEvent\n} from 'react';\n\nimport {\n Flex,\n Icon,\n registerIcon,\n Text,\n Status,\n useI18n,\n useConsolidatedRef,\n useElement,\n Button,\n Grid,\n SummaryItem,\n ForwardProps,\n useUID\n} from '@pega/cosmos-react-core';\nimport * as flagFinishIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/flag-finish.icon';\nimport * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';\n\nimport { StyledTaskManager, StyledTaskSummaryItem, StyledTaskMain } from './TaskManager.styles';\nimport TaskManagerContext from './TaskManager.context';\nimport TaskManagerTabs from './TaskManagerTabs';\nimport { TaskManagerProps } from './TaskManager.types';\nimport TaskView from './TaskView';\nimport Picker from './Picker/Picker';\nimport { SelectedItemProps } from './Picker/Picker.types';\nimport Dialogue from './Dialogue';\nimport ConversationAI from './ConversationAI';\n\nregisterIcon(plusIcon, flagFinishIcon);\n\nconst TaskManager: FunctionComponent<TaskManagerProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<TaskManagerProps>, ref: TaskManagerProps['ref']) => {\n const {\n tasks = [],\n onTaskLaunch,\n onTaskDismiss,\n addTask,\n wrapUp,\n main,\n banner,\n handle,\n conversationAI,\n ...restProps\n } = props;\n const t = useI18n();\n const taskManagerTabsRef = useRef<HTMLDivElement>(null);\n const consolidatedRef = useConsolidatedRef(ref);\n const hasActiveTask = tasks.filter(task => task.active).length > 0 || !!wrapUp?.active;\n const headingId = useUID();\n\n const [addTaskEl, setAddTaskEl] = useElement<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (taskManagerTabsRef.current && consolidatedRef.current) {\n consolidatedRef.current.style.minHeight = `${taskManagerTabsRef.current.scrollHeight}px`;\n } else if (consolidatedRef.current) {\n consolidatedRef.current.style.minHeight = '0';\n }\n }, [tasks, addTask]);\n\n return (\n <TaskManagerContext.Provider\n value={{\n addTask,\n wrapUp,\n tasks,\n onTaskLaunch\n }}\n >\n <StyledTaskManager\n {...restProps}\n ref={consolidatedRef}\n hasDrawer={hasActiveTask}\n hasTasks={!!tasks.length}\n >\n {banner && (\n <Dialogue\n icon={banner.icon}\n content={banner.content}\n verbatimStatus={banner.verbatimStatus}\n handle={handle}\n />\n )}\n <TaskView\n header={\n <Text variant='h2' id={headingId}>\n {t('task_manager_tasks')}\n </Text>\n }\n actions={\n <Flex\n container={{\n gap: 1\n }}\n >\n {conversationAI && (\n <ConversationAI\n content={conversationAI.content}\n entityCount={conversationAI.entityCount}\n />\n )}\n <Flex container>\n {wrapUp && (\n <Button\n variant='secondary'\n disabled={wrapUp.disable}\n onClick={wrapUp?.onClick && (() => wrapUp.onClick())}\n >\n <Icon name='flag-finish' />\n <span>{t('task_manager_wrap_up')}</span>\n </Button>\n )}\n {addTask && (\n <>\n <Button\n variant='primary'\n onClick={(e: MouseEvent<HTMLButtonElement>) =>\n setAddTaskEl(!addTaskEl ? e.currentTarget : null)\n }\n >\n <Icon name='plus' />\n <span>{t('task_manager_add_task')}</span>\n </Button>\n {addTaskEl && (\n <Picker\n target={addTaskEl}\n scrollAt={10}\n emptyText={t('task_manager_search_results_empty_text')}\n items={addTask?.items}\n onAdd={(selectedItems: SelectedItemProps[]) => {\n if (addTask.onAdd) {\n addTask?.onAdd(selectedItems);\n }\n setAddTaskEl(null);\n }}\n onCancel={() => {\n setAddTaskEl(null);\n }}\n ref={addTask.ref}\n placeholder={t('search_tasks')}\n />\n )}\n </>\n )}\n </Flex>\n </Flex>\n }\n >\n {hasActiveTask && (\n <TaskManagerTabs ref={taskManagerTabsRef} aria-labelledby={headingId} />\n )}\n {hasActiveTask &&\n tasks.map(({ id, active }) => {\n return (\n <StyledTaskMain\n id={`tab-panel-${id}`}\n key={id}\n role='tabpanel'\n aria-labelledby={`tab-${id}`}\n current={!!active}\n >\n {active ? main : null}\n </StyledTaskMain>\n );\n })}\n {!hasActiveTask && (\n <Grid as='ul' container>\n {tasks.map(({ name, id, status, isResolved, meta, icon, ...restTaskProps }) => {\n return (\n <SummaryItem\n {...restTaskProps}\n key={id}\n as={StyledTaskSummaryItem}\n primary={<Text variant='h4'>{name}</Text>}\n secondary={\n <>\n {!status && meta && <Text variant='secondary'>{meta}</Text>}\n {status && <Status variant={status.variant}>{status.text}</Status>}\n </>\n }\n visual={<Icon name={icon} />}\n actions={\n <Flex container={{ gap: 1 }}>\n {!isResolved && (\n <Button\n variant='secondary'\n aria-label={t('continue_label_a11y', [name])}\n onClick={() => {\n onTaskLaunch?.(id);\n }}\n >\n {t('continue_label')}\n </Button>\n )}\n {isResolved && (\n <Button\n variant='secondary'\n aria-label={t('review_label_a11y', [name])}\n onClick={() => {\n onTaskLaunch?.(id);\n }}\n >\n {t('review_label')}\n </Button>\n )}\n </Flex>\n }\n />\n );\n })}\n </Grid>\n )}\n </TaskView>\n </StyledTaskManager>\n </TaskManagerContext.Provider>\n );\n }\n);\n\nexport default TaskManager;\n"]}
|
|
1
|
+
{"version":3,"file":"TaskManager.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, PropsWithoutRef, forwardRef, useRef, MouseEvent, useMemo } from 'react';\n\nimport {\n Flex,\n Icon,\n registerIcon,\n Text,\n Status,\n useI18n,\n useElement,\n Button,\n Grid,\n SummaryItem,\n ForwardProps,\n useUID\n} from '@pega/cosmos-react-core';\nimport * as flagFinishIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/flag-finish.icon';\nimport * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';\n\nimport { StyledTaskManager, StyledTaskSummaryItem, StyledTaskMain } from './TaskManager.styles';\nimport TaskManagerContext from './TaskManager.context';\nimport TaskManagerTabs from './TaskManagerTabs';\nimport { TaskManagerProps } from './TaskManager.types';\nimport TaskView from './TaskView';\nimport Picker from './Picker/Picker';\nimport { SelectedItemProps } from './Picker/Picker.types';\nimport Dialogue from './Dialogue';\nimport ConversationAI from './ConversationAI';\n\nregisterIcon(plusIcon, flagFinishIcon);\n\nconst TaskManager: FunctionComponent<TaskManagerProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<TaskManagerProps>, ref: TaskManagerProps['ref']) => {\n const {\n tasks = [],\n onTaskLaunch,\n onTaskDismiss,\n addTask,\n wrapUp,\n main,\n banner,\n handle,\n conversationAI,\n ...restProps\n } = props;\n const t = useI18n();\n const taskManagerTabsRef = useRef<HTMLDivElement>(null);\n const hasActiveTask = tasks.filter(task => task.active).length > 0 || !!wrapUp?.active;\n const headingId = useUID();\n const wrapUpTabId = useUID();\n const wrapUpTabPanelId = useUID();\n\n const [addTaskEl, setAddTaskEl] = useElement<HTMLButtonElement>(null);\n\n const ctx = useMemo(\n () => ({\n addTask,\n wrapUp,\n tasks,\n onTaskLaunch\n }),\n [addTask, wrapUp, tasks, onTaskLaunch]\n );\n\n return (\n <TaskManagerContext.Provider value={ctx}>\n <StyledTaskManager\n {...restProps}\n ref={ref}\n hasDrawer={hasActiveTask}\n hasTasks={!!tasks.length}\n >\n {banner && (\n <Dialogue\n icon={banner.icon}\n content={banner.content}\n verbatimStatus={banner.verbatimStatus}\n handle={handle}\n />\n )}\n <TaskView\n header={\n <Text variant='h2' id={headingId}>\n {t('task_manager_tasks')}\n </Text>\n }\n actions={\n <Flex\n container={{\n gap: 1\n }}\n >\n {conversationAI && (\n <ConversationAI\n content={conversationAI.content}\n entityCount={conversationAI.entityCount}\n />\n )}\n <Flex container>\n {wrapUp && (\n <Button\n variant='secondary'\n disabled={wrapUp.disable}\n onClick={wrapUp?.onClick && (() => wrapUp.onClick())}\n >\n <Icon name='flag-finish' />\n <span>{t('task_manager_wrap_up')}</span>\n </Button>\n )}\n {addTask && (\n <>\n <Button\n variant='primary'\n onClick={(e: MouseEvent<HTMLButtonElement>) =>\n setAddTaskEl(!addTaskEl ? e.currentTarget : null)\n }\n >\n <Icon name='plus' />\n <span>{t('task_manager_add_task')}</span>\n </Button>\n {addTaskEl && (\n <Picker\n target={addTaskEl}\n emptyText={t('task_manager_search_results_empty_text')}\n items={addTask?.items}\n onAdd={(selectedItems: SelectedItemProps[]) => {\n if (addTask.onAdd) {\n addTask?.onAdd(selectedItems);\n }\n setAddTaskEl(null);\n }}\n onCancel={() => {\n setAddTaskEl(null);\n }}\n ref={addTask.ref}\n placeholder={t('search_tasks')}\n />\n )}\n </>\n )}\n </Flex>\n </Flex>\n }\n >\n {hasActiveTask && (\n <TaskManagerTabs\n ref={taskManagerTabsRef}\n aria-labelledby={headingId}\n wrapUpTabId={wrapUpTabId}\n wrapUpTabPanelId={wrapUpTabPanelId}\n />\n )}\n {hasActiveTask && (\n <>\n {tasks.map(({ id, active }) => {\n return (\n <StyledTaskMain\n id={`tab-panel-${id}`}\n key={id}\n role='tabpanel'\n aria-labelledby={`tab-${id}`}\n current={!!active}\n >\n {active ? main : null}\n </StyledTaskMain>\n );\n })}\n {wrapUp?.showTab && (\n <StyledTaskMain\n id={wrapUpTabPanelId}\n role='tabpanel'\n aria-labelledby={wrapUpTabId}\n current={!!wrapUp.active}\n >\n {wrapUp.active ? main : null}\n </StyledTaskMain>\n )}\n </>\n )}\n {!hasActiveTask && (\n <Grid as='ul' container>\n {tasks.map(({ name, id, status, isResolved, meta, icon, ...restTaskProps }) => {\n return (\n <SummaryItem\n {...restTaskProps}\n key={id}\n as={StyledTaskSummaryItem}\n primary={<Text variant='h4'>{name}</Text>}\n secondary={\n <>\n {!status && meta && <Text variant='secondary'>{meta}</Text>}\n {status && <Status variant={status.variant}>{status.text}</Status>}\n </>\n }\n visual={<Icon name={icon} />}\n actions={\n <Flex container={{ gap: 1 }}>\n {!isResolved && (\n <Button\n variant='secondary'\n aria-label={t('continue_label_a11y', [name])}\n onClick={() => {\n onTaskLaunch?.(id);\n }}\n >\n {t('continue_label')}\n </Button>\n )}\n {isResolved && (\n <Button\n variant='secondary'\n aria-label={t('review_label_a11y', [name])}\n onClick={() => {\n onTaskLaunch?.(id);\n }}\n >\n {t('review_label')}\n </Button>\n )}\n </Flex>\n }\n />\n );\n })}\n </Grid>\n )}\n </TaskView>\n </StyledTaskManager>\n </TaskManagerContext.Provider>\n );\n }\n);\n\nexport default TaskManager;\n"]}
|
|
@@ -28,12 +28,14 @@ export interface TaskManagerProps extends BaseProps, NoChildrenProp {
|
|
|
28
28
|
};
|
|
29
29
|
/** Selected task content */
|
|
30
30
|
main?: ReactNode;
|
|
31
|
-
ref?: Ref<HTMLDivElement>;
|
|
32
31
|
handle?: Ref<HandleValue>;
|
|
33
32
|
/** Conversation icon on TaskManager Header */
|
|
34
33
|
conversationAI?: Pick<ConversationAIProps, 'content' | 'entityCount'>;
|
|
34
|
+
ref?: Ref<HTMLDivElement>;
|
|
35
35
|
}
|
|
36
36
|
export interface TaskManagerTabsProps {
|
|
37
|
+
wrapUpTabId: string;
|
|
38
|
+
wrapUpTabPanelId: string;
|
|
37
39
|
ref?: Ref<HTMLDivElement>;
|
|
38
40
|
}
|
|
39
41
|
export interface TaskManagerTabProps {
|
|
@@ -56,8 +58,8 @@ export interface DialogueProps extends BaseProps {
|
|
|
56
58
|
content: string;
|
|
57
59
|
/** Type of banner icon */
|
|
58
60
|
verbatimStatus?: 'pending' | 'spoken';
|
|
59
|
-
ref?: Ref<HTMLDivElement>;
|
|
60
61
|
handle?: Ref<HandleValue>;
|
|
62
|
+
ref?: Ref<HTMLDivElement>;
|
|
61
63
|
}
|
|
62
64
|
export interface ConversationAIProps extends BaseProps {
|
|
63
65
|
/** Content */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TaskManager.types.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManager.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EACL,SAAS,EACT,QAAQ,EACR,aAAa,EACb,cAAc,EACd,WAAW,EACZ,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAEpD,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,SAAS,GAAG,SAAS,CAAC;CACpC;AAED,MAAM,WAAW,gBAAiB,SAAQ,SAAS,EAAE,cAAc;IACjE,oBAAoB;IACpB,KAAK,CAAC,EAAE,SAAS,EAAE,CAAC;IACpB,qCAAqC;IACrC,YAAY,CAAC,EAAE,CAAC,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC7C,4FAA4F;IAC5F,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC9C,uBAAuB;IACvB,OAAO,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,OAAO,GAAG,OAAO,GAAG,KAAK,CAAC,CAAC;IACvD,kCAAkC;IAClC,MAAM,CAAC,EAAE,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,SAAS,GAAG,gBAAgB,CAAC,CAAC;IACpE,uCAAuC;IACvC,MAAM,CAAC,EAAE;QACP,qDAAqD;QACrD,OAAO,EAAE,OAAO,CAAC;QACjB,yCAAyC;QACzC,OAAO,EAAE,MAAM,IAAI,CAAC;QACpB,sCAAsC;QACtC,MAAM,CAAC,EAAE,OAAO,CAAC;QACjB,uDAAuD;QACvD,OAAO,CAAC,EAAE,OAAO,CAAC;KACnB,CAAC;IACF,4BAA4B;IAC5B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,
|
|
1
|
+
{"version":3,"file":"TaskManager.types.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManager.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TaskManager.types.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManager.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ReactNode, Ref } from 'react';\n\nimport {\n BaseProps,\n IconName,\n MenuItemProps,\n NoChildrenProp,\n StatusProps\n} from '@pega/cosmos-react-core';\n\nimport { PickerProps } from './Picker/Picker.types';\n\nexport interface HandleValue {\n nudge: () => Animation | undefined;\n}\n\nexport interface TaskManagerProps extends BaseProps, NoChildrenProp {\n /** List of tasks */\n tasks?: TaskProps[];\n /** Callback when task is launched */\n onTaskLaunch?: (id: TaskProps['id']) => void;\n /** Callback when task is dismissed. Applicable only when task is not launched previously */\n onTaskDismiss?: (id: TaskProps['id']) => void;\n /** Add task utility */\n addTask?: Pick<PickerProps, 'items' | 'onAdd' | 'ref'>;\n /** Banner for the task manager */\n banner?: Pick<DialogueProps, 'icon' | 'content' | 'verbatimStatus'>;\n /** Shows wrap up action when passed */\n wrapUp?: {\n /** Determines if wrap up button should be enabled */\n disable: boolean;\n /** Callback when wrap up is performed */\n onClick: () => void;\n /** Determines if wrap up is active */\n active?: boolean;\n /** Determines if wrap up tab should be shown or not */\n showTab?: boolean;\n };\n /** Selected task content */\n main?: ReactNode;\n
|
|
1
|
+
{"version":3,"file":"TaskManager.types.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManager.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ReactNode, Ref } from 'react';\n\nimport {\n BaseProps,\n IconName,\n MenuItemProps,\n NoChildrenProp,\n StatusProps\n} from '@pega/cosmos-react-core';\n\nimport { PickerProps } from './Picker/Picker.types';\n\nexport interface HandleValue {\n nudge: () => Animation | undefined;\n}\n\nexport interface TaskManagerProps extends BaseProps, NoChildrenProp {\n /** List of tasks */\n tasks?: TaskProps[];\n /** Callback when task is launched */\n onTaskLaunch?: (id: TaskProps['id']) => void;\n /** Callback when task is dismissed. Applicable only when task is not launched previously */\n onTaskDismiss?: (id: TaskProps['id']) => void;\n /** Add task utility */\n addTask?: Pick<PickerProps, 'items' | 'onAdd' | 'ref'>;\n /** Banner for the task manager */\n banner?: Pick<DialogueProps, 'icon' | 'content' | 'verbatimStatus'>;\n /** Shows wrap up action when passed */\n wrapUp?: {\n /** Determines if wrap up button should be enabled */\n disable: boolean;\n /** Callback when wrap up is performed */\n onClick: () => void;\n /** Determines if wrap up is active */\n active?: boolean;\n /** Determines if wrap up tab should be shown or not */\n showTab?: boolean;\n };\n /** Selected task content */\n main?: ReactNode;\n handle?: Ref<HandleValue>;\n /** Conversation icon on TaskManager Header */\n conversationAI?: Pick<ConversationAIProps, 'content' | 'entityCount'>;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface TaskManagerTabsProps {\n wrapUpTabId: string;\n wrapUpTabPanelId: string;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface TaskManagerTabProps {\n active?: boolean;\n variant?: string;\n}\nexport interface TaskViewProps extends BaseProps {\n /** Task header */\n header: ReactNode;\n /** Task specific actions */\n actions?: ReactNode;\n /** Task form content */\n children: ReactNode;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface DialogueProps extends BaseProps {\n /** Icon for the banner */\n icon: IconName;\n /** Banner content */\n content: string;\n /** Type of banner icon */\n verbatimStatus?: 'pending' | 'spoken';\n handle?: Ref<HandleValue>;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface ConversationAIProps extends BaseProps {\n /** Content */\n content: ReactNode;\n /** Number of entities captured */\n entityCount: number;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface TaskManagerContextProps\n extends Pick<TaskManagerProps, 'tasks' | 'addTask' | 'onTaskLaunch' | 'wrapUp'> {}\n\nexport interface TaskProps {\n /** Unique id for tasks list */\n id: string;\n /** Name of the task */\n name: string;\n /** Meta info of the task ex: Queued task */\n meta?: string;\n /** Secondary information to show with the task name. Eg: CaseId. */\n secondary?: MenuItemProps['secondary'];\n /** Name of the icon (to be selected from default Pega icon set) */\n icon: string;\n /** Determines to show the task in tab. */\n hideFromTab?: boolean;\n /** Determines the active task */\n active?: boolean;\n /** Determines if a task is resolved */\n isResolved?: boolean;\n /** Represents the current status of task(like resolved-completed, InProgress etc) */\n status?: {\n /** Status text */\n text: string;\n /** Status variant */\n variant: StatusProps['variant'];\n };\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TaskManagerTabs.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManagerTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAYlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAa,YAAY,EAA4B,MAAM,yBAAyB,CAAC;AAW5F,OAAO,EAAE,oBAAoB,EAAa,MAAM,qBAAqB,CAAC;AAEtE,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,GAAG,YAAY,
|
|
1
|
+
{"version":3,"file":"TaskManagerTabs.d.ts","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManagerTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAYlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAa,YAAY,EAA4B,MAAM,yBAAyB,CAAC;AAW5F,OAAO,EAAE,oBAAoB,EAAa,MAAM,qBAAqB,CAAC;AAEtE,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,GAAG,YAAY,CA2P3E,CAAC;AAEF,eAAe,eAAe,CAAC"}
|
|
@@ -5,7 +5,7 @@ import { cap, Flex } from '@pega/cosmos-react-core';
|
|
|
5
5
|
import { useDirection, useI18n } from '@pega/cosmos-react-core/lib/hooks';
|
|
6
6
|
import { StyledTaskManagerTabs, StyleTaskName, StyledTasksTabList, StyledTaskManagerTab, StyledOverflowTabMenu } from './TaskManager.styles';
|
|
7
7
|
import TaskManagerContext from './TaskManager.context';
|
|
8
|
-
const TaskManagerTabs = forwardRef((
|
|
8
|
+
const TaskManagerTabs = forwardRef(({ wrapUpTabId, wrapUpTabPanelId, ...restProps }, ref) => {
|
|
9
9
|
const { wrapUp, tasks = [], onTaskLaunch } = useContext(TaskManagerContext);
|
|
10
10
|
const [tabs, setTabs] = useState(tasks);
|
|
11
11
|
const [isOverflowing, setIsOverflowing] = useState(false);
|
|
@@ -152,8 +152,8 @@ const TaskManagerTabs = forwardRef((props, ref) => {
|
|
|
152
152
|
}
|
|
153
153
|
}
|
|
154
154
|
};
|
|
155
|
-
return (_jsx(Flex, { container: { gap: 1 }, as: StyledTaskManagerTabs, ref: ref, children: (tasks.length > 0 || wrapUp?.showTab) && (_jsxs(_Fragment, { children: [_jsxs(StyledTasksTabList, { role: 'tablist', ref: tabListRef, ...
|
|
156
|
-
return (_createElement(StyledTaskManagerTab, { ...
|
|
155
|
+
return (_jsx(Flex, { container: { gap: 1 }, as: StyledTaskManagerTabs, ref: ref, children: (tasks.length > 0 || wrapUp?.showTab) && (_jsxs(_Fragment, { children: [_jsxs(StyledTasksTabList, { role: 'tablist', ref: tabListRef, ...restProps, children: [tabs.map(({ id, active = false, icon, meta, name, ...tabRestProps }, i) => {
|
|
156
|
+
return (_createElement(StyledTaskManagerTab, { ...tabRestProps, ref: tabRefs[i], key: id, onClick: () => onTaskLaunch?.(id), "aria-selected": active, "aria-controls": `tab-panel-${id}`, id: `tab-${id}`, role: 'tab', tabIndex: active ? 0 : -1, onKeyUp: (e) => {
|
|
157
157
|
changeTabFocus(e, i);
|
|
158
158
|
}, onKeyDown: (e) => {
|
|
159
159
|
const { key } = e;
|
|
@@ -167,7 +167,7 @@ const TaskManagerTabs = forwardRef((props, ref) => {
|
|
|
167
167
|
}
|
|
168
168
|
}, active: active },
|
|
169
169
|
_jsx(Flex, { container: { justify: 'start', gap: 1, alignItems: 'center' }, children: _jsx(StyleTaskName, { children: name }) })));
|
|
170
|
-
}), wrapUp?.showTab && (_jsx(StyledTaskManagerTab, { onClick: wrapUp.onClick, variant: 'wrap-up', "aria-selected": wrapUp.active, role: 'tab', active: wrapUp.active, tabIndex: wrapUp.active ? 0 : -1, onKeyUp: (e) => {
|
|
170
|
+
}), wrapUp?.showTab && (_jsx(StyledTaskManagerTab, { onClick: wrapUp.onClick, variant: 'wrap-up', "aria-selected": wrapUp.active, "aria-controls": wrapUpTabPanelId, id: wrapUpTabId, role: 'tab', active: wrapUp.active, tabIndex: wrapUp.active ? 0 : -1, onKeyUp: (e) => {
|
|
171
171
|
changeTabFocus(e);
|
|
172
172
|
}, onKeyDown: (e) => {
|
|
173
173
|
const { key } = e;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TaskManagerTabs.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManagerTabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n forwardRef,\n useContext,\n createRef,\n RefObject,\n KeyboardEvent,\n useMemo,\n PropsWithoutRef,\n useRef,\n useEffect,\n useState,\n useLayoutEffect\n} from 'react';\n\nimport { cap, Flex, ForwardProps, MenuItemProps, MenuProps } from '@pega/cosmos-react-core';\nimport { useDirection, useI18n } from '@pega/cosmos-react-core/lib/hooks';\n\nimport {\n StyledTaskManagerTabs,\n StyleTaskName,\n StyledTasksTabList,\n StyledTaskManagerTab,\n StyledOverflowTabMenu\n} from './TaskManager.styles';\nimport TaskManagerContext from './TaskManager.context';\nimport { TaskManagerTabsProps, TaskProps } from './TaskManager.types';\n\nconst TaskManagerTabs: FunctionComponent<TaskManagerTabsProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<TaskManagerTabsProps>, ref: TaskManagerTabsProps['ref']) => {\n const { wrapUp, tasks = [], onTaskLaunch } = useContext(TaskManagerContext);\n\n const [tabs, setTabs] = useState<TaskProps[]>(tasks);\n const [isOverflowing, setIsOverflowing] = useState(false);\n\n // Used to keep a reference for every tab in order to focus them with key presses\n const tabRefs: RefObject<HTMLLIElement>[] = tasks.map(() => createRef<HTMLLIElement>());\n const wrapUpRef = useRef<HTMLLIElement>(null);\n const tabListRef = useRef<HTMLUListElement>(null);\n\n const { rtl, end: endDirection, start: startDirection } = useDirection();\n const t = useI18n();\n\n const tasksMenu = useMemo(() => {\n const openTasks = tasks.filter(task => !task.isResolved);\n const openTasksMenuItems: MenuItemProps[] = openTasks.map(\n ({ name, secondary, id, active }) => {\n return {\n primary: name,\n secondary,\n id,\n selected: !!active,\n onClick: idx => {\n onTaskLaunch?.(idx);\n }\n };\n }\n );\n if (wrapUp?.showTab) {\n openTasksMenuItems.push({\n primary: t('task_manager_wrap_up'),\n secondary: [],\n id: '',\n selected: !!wrapUp.active,\n onClick: () => {\n wrapUp?.onClick();\n }\n });\n }\n\n const resolvedTasks = tasks.filter(task => task.isResolved);\n const resolvedTasksMenuItems: MenuItemProps[] = resolvedTasks.map(\n ({ id, name, secondary, active }) => {\n return {\n primary: name,\n secondary,\n id,\n selected: !!active,\n onClick: () => {\n onTaskLaunch?.(id);\n }\n };\n }\n );\n const taskCategories: MenuProps['items'] = [];\n if (openTasksMenuItems.length > 0) {\n taskCategories.push({ id: 'open_tasks', label: t('open_tasks'), items: [] });\n taskCategories\n .find(category => category.id === 'open_tasks')\n ?.items?.push(...openTasksMenuItems);\n }\n if (resolvedTasksMenuItems.length > 0) {\n taskCategories.push({ id: 'resolved_tasks', label: t('resolved_tasks'), items: [] });\n taskCategories\n .find(category => category.id === 'resolved_tasks')\n ?.items?.push(...resolvedTasksMenuItems);\n }\n return taskCategories;\n }, [tasks]);\n\n const checkAndUpdateIsOverflowing = () => {\n if (tabListRef.current) {\n const value = tabListRef.current.scrollWidth > tabListRef.current.clientWidth;\n if (value !== isOverflowing) {\n setIsOverflowing(value);\n return value;\n }\n }\n return isOverflowing;\n };\n\n useEffect(() => {\n setTabs(tasks.filter(task => !task.hideFromTab));\n }, [tasks]);\n\n useEffect(() => {\n const resizeObserver = new ResizeObserver(() => {\n checkAndUpdateIsOverflowing();\n });\n if (tabListRef?.current) resizeObserver.observe(tabListRef?.current as Element);\n return () => {\n resizeObserver.disconnect();\n };\n }, [checkAndUpdateIsOverflowing]);\n\n useLayoutEffect(() => {\n if (!checkAndUpdateIsOverflowing()) return;\n const activeTabRef = [...tabRefs, wrapUpRef].find(\n tab => tab?.current?.getAttribute('aria-selected') === 'true'\n );\n\n if (activeTabRef && activeTabRef.current && tabListRef.current) {\n const activeTabRect = activeTabRef.current.getBoundingClientRect();\n const tabListWidth = tabListRef.current.clientWidth;\n\n // Check if it is not in view\n if (activeTabRect.left <= 0 || activeTabRect.right >= tabListWidth) {\n tabListRef.current.scrollLeft = rtl\n ? -(tabListWidth - (activeTabRef.current.offsetLeft + activeTabRect.width))\n : activeTabRef.current.offsetLeft;\n }\n }\n }, [tasks, wrapUp]);\n\n const changeTabFocus = (event: KeyboardEvent, index?: number): void => {\n let activeIndex = index;\n if (tabs.length) {\n const { key } = event;\n\n if (key === `Arrow${cap(endDirection)}`) {\n event.preventDefault();\n let nextIndex;\n if (wrapUpRef?.current === event.currentTarget) {\n nextIndex = 0;\n } else {\n if (index === tabs.length - 1 && wrapUp?.showTab) {\n wrapUpRef?.current?.focus();\n return;\n }\n nextIndex = index! + 1 < tabs.length ? index! + 1 : 0;\n }\n activeIndex = nextIndex;\n const nextTab = tabRefs[nextIndex]?.current;\n nextTab?.focus();\n } else if (key === `Arrow${cap(startDirection)}`) {\n event.preventDefault();\n let prevIndex;\n if (wrapUpRef?.current === event.currentTarget) {\n prevIndex = tabs.length - 1;\n } else {\n if (index === 0 && wrapUp?.showTab) {\n wrapUpRef?.current?.focus();\n return;\n }\n prevIndex = index === 0 ? tabs.length - 1 : index! - 1;\n }\n const prevTab = tabRefs[prevIndex]?.current;\n activeIndex = prevIndex;\n prevTab?.focus();\n } else if (key === 'Enter' || key === ' ') {\n event.preventDefault();\n if (wrapUpRef?.current === event.currentTarget) {\n wrapUp?.onClick();\n return;\n }\n onTaskLaunch?.(tabs[activeIndex!].id);\n }\n }\n };\n\n return (\n <Flex container={{ gap: 1 }} as={StyledTaskManagerTabs} ref={ref}>\n {(tasks.length > 0 || wrapUp?.showTab) && (\n <>\n <StyledTasksTabList role='tablist' ref={tabListRef} {...props}>\n {tabs.map(({ id, active = false, icon, meta, name, ...restProps }, i) => {\n return (\n <StyledTaskManagerTab\n {...restProps}\n ref={tabRefs[i]}\n key={id}\n onClick={() => onTaskLaunch?.(id)}\n aria-selected={active}\n aria-controls={`tab-panel-${id}`}\n id={`tab-${id}`}\n role='tab'\n tabIndex={active ? 0 : -1}\n onKeyUp={(e: KeyboardEvent) => {\n changeTabFocus(e, i);\n }}\n onKeyDown={(e: KeyboardEvent) => {\n const { key } = e;\n if (\n key === 'ArrowRight' ||\n key === 'ArrowDown' ||\n key === 'ArrowLeft' ||\n key === 'ArrowUp' ||\n key === 'Enter' ||\n key === ' '\n ) {\n e.preventDefault();\n }\n }}\n active={active}\n >\n <Flex container={{ justify: 'start', gap: 1, alignItems: 'center' }}>\n <StyleTaskName>{name}</StyleTaskName>\n </Flex>\n </StyledTaskManagerTab>\n );\n })}\n {wrapUp?.showTab && (\n <StyledTaskManagerTab\n onClick={wrapUp.onClick}\n variant='wrap-up'\n aria-selected={wrapUp.active}\n role='tab'\n active={wrapUp.active}\n tabIndex={wrapUp.active ? 0 : -1}\n onKeyUp={(e: KeyboardEvent) => {\n changeTabFocus(e);\n }}\n onKeyDown={(e: KeyboardEvent) => {\n const { key } = e;\n if (\n key === 'ArrowRight' ||\n key === 'ArrowDown' ||\n key === 'ArrowLeft' ||\n key === 'ArrowUp'\n ) {\n e.preventDefault();\n }\n }}\n ref={wrapUpRef}\n >\n <span>{t('task_manager_wrap_up')}</span>\n </StyledTaskManagerTab>\n )}\n </StyledTasksTabList>\n <StyledOverflowTabMenu\n menu={{\n items: tasksMenu,\n mode: 'single-select'\n }}\n icon='caret-down'\n iconOnly\n variant='simple'\n text={t('task_manager_overflow_menu')}\n />\n </>\n )}\n </Flex>\n );\n }\n);\n\nexport default TaskManagerTabs;\n"]}
|
|
1
|
+
{"version":3,"file":"TaskManagerTabs.js","sourceRoot":"","sources":["../../../src/components/TaskManager/TaskManagerTabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n forwardRef,\n useContext,\n createRef,\n RefObject,\n KeyboardEvent,\n useMemo,\n PropsWithoutRef,\n useRef,\n useEffect,\n useState,\n useLayoutEffect\n} from 'react';\n\nimport { cap, Flex, ForwardProps, MenuItemProps, MenuProps } from '@pega/cosmos-react-core';\nimport { useDirection, useI18n } from '@pega/cosmos-react-core/lib/hooks';\n\nimport {\n StyledTaskManagerTabs,\n StyleTaskName,\n StyledTasksTabList,\n StyledTaskManagerTab,\n StyledOverflowTabMenu\n} from './TaskManager.styles';\nimport TaskManagerContext from './TaskManager.context';\nimport { TaskManagerTabsProps, TaskProps } from './TaskManager.types';\n\nconst TaskManagerTabs: FunctionComponent<TaskManagerTabsProps & ForwardProps> = forwardRef(\n (\n { wrapUpTabId, wrapUpTabPanelId, ...restProps }: PropsWithoutRef<TaskManagerTabsProps>,\n ref: TaskManagerTabsProps['ref']\n ) => {\n const { wrapUp, tasks = [], onTaskLaunch } = useContext(TaskManagerContext);\n\n const [tabs, setTabs] = useState<TaskProps[]>(tasks);\n const [isOverflowing, setIsOverflowing] = useState(false);\n\n // Used to keep a reference for every tab in order to focus them with key presses\n const tabRefs: RefObject<HTMLLIElement>[] = tasks.map(() => createRef<HTMLLIElement>());\n const wrapUpRef = useRef<HTMLLIElement>(null);\n const tabListRef = useRef<HTMLUListElement>(null);\n\n const { rtl, end: endDirection, start: startDirection } = useDirection();\n const t = useI18n();\n\n const tasksMenu = useMemo(() => {\n const openTasks = tasks.filter(task => !task.isResolved);\n const openTasksMenuItems: MenuItemProps[] = openTasks.map(\n ({ name, secondary, id, active }) => {\n return {\n primary: name,\n secondary,\n id,\n selected: !!active,\n onClick: idx => {\n onTaskLaunch?.(idx);\n }\n };\n }\n );\n if (wrapUp?.showTab) {\n openTasksMenuItems.push({\n primary: t('task_manager_wrap_up'),\n secondary: [],\n id: '',\n selected: !!wrapUp.active,\n onClick: () => {\n wrapUp?.onClick();\n }\n });\n }\n\n const resolvedTasks = tasks.filter(task => task.isResolved);\n const resolvedTasksMenuItems: MenuItemProps[] = resolvedTasks.map(\n ({ id, name, secondary, active }) => {\n return {\n primary: name,\n secondary,\n id,\n selected: !!active,\n onClick: () => {\n onTaskLaunch?.(id);\n }\n };\n }\n );\n const taskCategories: MenuProps['items'] = [];\n if (openTasksMenuItems.length > 0) {\n taskCategories.push({ id: 'open_tasks', label: t('open_tasks'), items: [] });\n taskCategories\n .find(category => category.id === 'open_tasks')\n ?.items?.push(...openTasksMenuItems);\n }\n if (resolvedTasksMenuItems.length > 0) {\n taskCategories.push({ id: 'resolved_tasks', label: t('resolved_tasks'), items: [] });\n taskCategories\n .find(category => category.id === 'resolved_tasks')\n ?.items?.push(...resolvedTasksMenuItems);\n }\n return taskCategories;\n }, [tasks]);\n\n const checkAndUpdateIsOverflowing = () => {\n if (tabListRef.current) {\n const value = tabListRef.current.scrollWidth > tabListRef.current.clientWidth;\n if (value !== isOverflowing) {\n setIsOverflowing(value);\n return value;\n }\n }\n return isOverflowing;\n };\n\n useEffect(() => {\n setTabs(tasks.filter(task => !task.hideFromTab));\n }, [tasks]);\n\n useEffect(() => {\n const resizeObserver = new ResizeObserver(() => {\n checkAndUpdateIsOverflowing();\n });\n if (tabListRef?.current) resizeObserver.observe(tabListRef?.current as Element);\n return () => {\n resizeObserver.disconnect();\n };\n }, [checkAndUpdateIsOverflowing]);\n\n useLayoutEffect(() => {\n if (!checkAndUpdateIsOverflowing()) return;\n const activeTabRef = [...tabRefs, wrapUpRef].find(\n tab => tab?.current?.getAttribute('aria-selected') === 'true'\n );\n\n if (activeTabRef && activeTabRef.current && tabListRef.current) {\n const activeTabRect = activeTabRef.current.getBoundingClientRect();\n const tabListWidth = tabListRef.current.clientWidth;\n\n // Check if it is not in view\n if (activeTabRect.left <= 0 || activeTabRect.right >= tabListWidth) {\n tabListRef.current.scrollLeft = rtl\n ? -(tabListWidth - (activeTabRef.current.offsetLeft + activeTabRect.width))\n : activeTabRef.current.offsetLeft;\n }\n }\n }, [tasks, wrapUp]);\n\n const changeTabFocus = (event: KeyboardEvent, index?: number): void => {\n let activeIndex = index;\n if (tabs.length) {\n const { key } = event;\n\n if (key === `Arrow${cap(endDirection)}`) {\n event.preventDefault();\n let nextIndex;\n if (wrapUpRef?.current === event.currentTarget) {\n nextIndex = 0;\n } else {\n if (index === tabs.length - 1 && wrapUp?.showTab) {\n wrapUpRef?.current?.focus();\n return;\n }\n nextIndex = index! + 1 < tabs.length ? index! + 1 : 0;\n }\n activeIndex = nextIndex;\n const nextTab = tabRefs[nextIndex]?.current;\n nextTab?.focus();\n } else if (key === `Arrow${cap(startDirection)}`) {\n event.preventDefault();\n let prevIndex;\n if (wrapUpRef?.current === event.currentTarget) {\n prevIndex = tabs.length - 1;\n } else {\n if (index === 0 && wrapUp?.showTab) {\n wrapUpRef?.current?.focus();\n return;\n }\n prevIndex = index === 0 ? tabs.length - 1 : index! - 1;\n }\n const prevTab = tabRefs[prevIndex]?.current;\n activeIndex = prevIndex;\n prevTab?.focus();\n } else if (key === 'Enter' || key === ' ') {\n event.preventDefault();\n if (wrapUpRef?.current === event.currentTarget) {\n wrapUp?.onClick();\n return;\n }\n onTaskLaunch?.(tabs[activeIndex!].id);\n }\n }\n };\n\n return (\n <Flex container={{ gap: 1 }} as={StyledTaskManagerTabs} ref={ref}>\n {(tasks.length > 0 || wrapUp?.showTab) && (\n <>\n <StyledTasksTabList role='tablist' ref={tabListRef} {...restProps}>\n {tabs.map(({ id, active = false, icon, meta, name, ...tabRestProps }, i) => {\n return (\n <StyledTaskManagerTab\n {...tabRestProps}\n ref={tabRefs[i]}\n key={id}\n onClick={() => onTaskLaunch?.(id)}\n aria-selected={active}\n aria-controls={`tab-panel-${id}`}\n id={`tab-${id}`}\n role='tab'\n tabIndex={active ? 0 : -1}\n onKeyUp={(e: KeyboardEvent) => {\n changeTabFocus(e, i);\n }}\n onKeyDown={(e: KeyboardEvent) => {\n const { key } = e;\n if (\n key === 'ArrowRight' ||\n key === 'ArrowDown' ||\n key === 'ArrowLeft' ||\n key === 'ArrowUp' ||\n key === 'Enter' ||\n key === ' '\n ) {\n e.preventDefault();\n }\n }}\n active={active}\n >\n <Flex container={{ justify: 'start', gap: 1, alignItems: 'center' }}>\n <StyleTaskName>{name}</StyleTaskName>\n </Flex>\n </StyledTaskManagerTab>\n );\n })}\n {wrapUp?.showTab && (\n <StyledTaskManagerTab\n onClick={wrapUp.onClick}\n variant='wrap-up'\n aria-selected={wrapUp.active}\n aria-controls={wrapUpTabPanelId}\n id={wrapUpTabId}\n role='tab'\n active={wrapUp.active}\n tabIndex={wrapUp.active ? 0 : -1}\n onKeyUp={(e: KeyboardEvent) => {\n changeTabFocus(e);\n }}\n onKeyDown={(e: KeyboardEvent) => {\n const { key } = e;\n if (\n key === 'ArrowRight' ||\n key === 'ArrowDown' ||\n key === 'ArrowLeft' ||\n key === 'ArrowUp'\n ) {\n e.preventDefault();\n }\n }}\n ref={wrapUpRef}\n >\n <span>{t('task_manager_wrap_up')}</span>\n </StyledTaskManagerTab>\n )}\n </StyledTasksTabList>\n <StyledOverflowTabMenu\n menu={{\n items: tasksMenu,\n mode: 'single-select'\n }}\n icon='caret-down'\n iconOnly\n variant='simple'\n text={t('task_manager_overflow_menu')}\n />\n </>\n )}\n </Flex>\n );\n }\n);\n\nexport default TaskManagerTabs;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-cs",
|
|
3
|
-
"version": "4.0.0-dev.
|
|
3
|
+
"version": "4.0.0-dev.14.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.
|
|
24
|
-
"@pega/cosmos-react-dnd": "4.0.0-dev.
|
|
23
|
+
"@pega/cosmos-react-core": "4.0.0-dev.14.0",
|
|
24
|
+
"@pega/cosmos-react-dnd": "4.0.0-dev.14.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",
|
|
@@ -41,6 +41,6 @@
|
|
|
41
41
|
"@storybook/theming": "^6.4.19",
|
|
42
42
|
"@testing-library/react": "^12.1.3",
|
|
43
43
|
"@testing-library/user-event": "^13.5.0",
|
|
44
|
-
"typescript": "~
|
|
44
|
+
"typescript": "~5.0.2"
|
|
45
45
|
}
|
|
46
46
|
}
|