npm - @pega/cosmos-react-cs - Versions diffs - 4.0.0-dev.1.2 → 4.0.0-dev.10.1 - Mend

@pega/cosmos-react-cs 4.0.0-dev.1.2 → 4.0.0-dev.10.1

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 (62) hide show

package/lib/components/Article/Article.d.ts CHANGED Viewed

@@ -22,7 +22,7 @@ export interface BaseArticleProps extends BaseProps, NoChildrenProp {
     /** Prop to check visibility of skeleton */
     skeletonize: boolean;
 }
-export declare type ArticleProps = (BaseArticleProps & {
+export type ArticleProps = (BaseArticleProps & {
     skeletonize?: false;
 }) | (Partial<BaseArticleProps> & {
     skeletonize: true;

package/lib/components/Article/Article.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
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;~~AAiDxD~~,QAAA,MAAM,OAAO,EAAE,iBAAiB,CAAC,YAAY,GAAG,YAAY,CAkE3D,CAAC;AAMF,eAAe,OAAO,CAAC"}
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,MAAM,MAAM,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"}

package/lib/components/Article/Article.js CHANGED Viewed

@@ -30,6 +30,9 @@ const StyledArticleContent = styled.div(props => {
     a {
       color: ${theme.components.link.color};
     }
+    * {
+      margin: unset;
+    }
   `;
 });
 StyledArticleContent.defaultProps = defaultThemeProp;
@@ -42,7 +45,7 @@ const Article = (props) => {
     const { meta, title, navigation, content, primaryActions, secondaryActions, footer, skeletonize, ...restProps } = props;
     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: {
                                     items: secondaryActions.map(({ text, ...rest }) => ({ ...rest, primary: text }))
-                                } }))] })] })), title ? (_jsx(Flex, { container: true, as: StyledArticleHeader, children: _jsx(Text, { variant: 'h3', 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] }));
+                                } }))] })] })), 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] }));
 };
 Article.defaultProps = {
     skeletonize: false

package/lib/components/Article/Article.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Article.js","sourceRoot":"","sources":["../../../src/components/Article/Article.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAEL,IAAI,EACJ,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,IAAI,EACJ,gBAAgB,EAIjB,MAAM,yBAAyB,CAAC;AAGjC,OAAO,eAAe,MAAM,mBAAmB,CAAC;AA4BhD,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;IAC9C,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IACxB,OAAO,GAAG,CAAA;kBACM,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;0BAChC,KAAK,CAAC,IAAI,CAAC,OAAO;gCACZ,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;GAExD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAA;;CAExC,CAAC;AAEF,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;IAC9C,MAAM,EACJ,KAAK,EACL,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;;;4BAGgB,OAAO;4BACP,OAAO;;;;;+BAKJ,OAAO;;;eAGvB,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK~~;;GAEvC~~,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AACrD,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,MAAM,GAAG;IACb,YAAY;IACZ,WAAW,EAAE,cAAc;CAC5B,CAAC;AAEF,MAAM,OAAO,GAAmD,CAAC,KAAmB,EAAE,EAAE;IACtF,MAAM,EACJ,IAAI,EACJ,KAAK,EACL,UAAU,EACV,OAAO,EACP,cAAc,EACd,gBAAgB,EAChB,MAAM,EACN,WAAW,EACX,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,oBAAoB,KAAM,SAAS,aACtF,CAAC,UAAU,IAAI,cAAc,IAAI,gBAAgB,CAAC,IAAI,CACrD,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC/C,KAAC,IAAI,IAAC,SAAS,QAAC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YAC9B,UAAU,GACN,EACP,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,aACtC,cAAc,EACd,gBAAgB,IAAI,CACnB,KAAC,UAAU,IACT,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAE,MAAM,CAAC,WAAW,EACxB,IAAI,EAAC,MAAM,EACX,QAAQ,QACR,IAAI,EAAE;oCACJ,KAAK,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;iCACjF,GACD,CACH,IACI,IACF,CACR,EACA,KAAK,CAAC,CAAC,CAAC,CACP,KAAC,IAAI,IAAC,SAAS,QAAC,EAAE,EAAE,mBAAmB,YACrC,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,KAAK,GAAQ,GAC5B,CACR,CAAC,CAAC,CAAC,CACF,WAAW,IAAI,KAAC,YAAY,IAAC,KAAK,EAAC,GAAG,GAAG,CAC1C,EACA,IAAI,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACzB,KAAC,IAAI,IAAC,SAAS,QAAC,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,YACjC,KAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,GAAI,GACpB,CACR,CAAC,CAAC,CAAC,CACF,WAAW,IAAI,CACb,MAAC,IAAI,IAAC,SAAS,mBACb,KAAC,YAAY,IAAC,KAAK,EAAC,GAAG,GAAG,EAC1B,KAAC,YAAY,IAAC,KAAK,EAAC,GAAG,GAAG,EAC1B,KAAC,YAAY,IAAC,KAAK,EAAC,GAAG,GAAG,IACrB,CACR,CACF,EACA,WAAW,CAAC,CAAC,CAAC,CACb,KAAC,oBAAoB,cACnB,KAAC,eAAe,KAAG,GACE,CACxB,CAAC,CAAC,CAAC,CACF,KAAC,oBAAoB,cAAE,OAAO,GAAwB,CACvD,EACA,MAAM,IACF,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,CAAC,YAAY,GAAG;IACrB,WAAW,EAAE,KAAK;CACnB,CAAC;AAEF,eAAe,OAAO,CAAC","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});\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='h3'>{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	+ {"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"]}

package/lib/components/CallControlPanel/AttachInteractionDialog.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import { FunctionComponent } from 'react';
-import { BannerProps, DialogProps } from '@pega/cosmos-react-core';
+import { BannerProps, FormDialogProps } from '@pega/cosmos-react-core';
 export interface MenuOption {
     id: string;
     label: string;
@@ -24,15 +24,20 @@ export interface AttachInteractionProps {
     }) => void;
     /** Callback invoked when closing the dialog. */
     onClose?: () => void;
+    /** Current selected reason */
+    defaultReason?: MenuOption['id'];
     /** Reason options. The field will be hidden if not passed. */
     reasonOptions: Readonly<MenuOption[]>;
+    /** Current selected interaction */
+    defaultInteraction?: MenuOption['id'];
     /** Interaction options. The fill will be hidden if not passed. */
     interactionOptions?: Readonly<MenuOption[]>;
     /** Region for messages: errors, notifications, etc. */
-    message?: Pick<BannerProps, 'id' | 'variant' | 'heading' | 'messages' | 'onDismiss'>;
+    message?: Pick<BannerProps, 'variant' | 'messages' | 'onDismiss'>;
 }
-export interface AttachInteractionDialogProps extends AttachInteractionProps {
-    target: DialogProps['target'];
+export interface AttachInteractionDialogProps extends AttachInteractionProps, Pick<FormDialogProps, 'target'> {
+    /** When invoked, sets the dialog target to null to close. Maintains interface support where onSubmit receives close arg. */
+    close: () => void;
 }
 export declare const StyledInteractionForm: import("styled-components").StyledComponent<import("react").FC<import("@pega/cosmos-react-core").FormProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 declare const AttachInteractionDialog: FunctionComponent<AttachInteractionDialogProps>;

package/lib/components/CallControlPanel/AttachInteractionDialog.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachInteractionDialog.d.ts","sourceRoot":"","sources":["../../../src/components/CallControlPanel/AttachInteractionDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAyB,MAAM,OAAO,CAAC;AAGjE,OAAO,~~EASL~~,WAAW,~~EACX~~,~~WAAW~~,~~EACZ~~,MAAM,yBAAyB,CAAC;AAEjC,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,qBAAqB;IACpC,yCAAyC;IACzC,QAAQ,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;IAC5B,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8CAA8C;IAC9C,mBAAmB,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;CACxC;AAED,MAAM,WAAW,sBAAsB;IACrC,iCAAiC;IACjC,OAAO,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,gBAAgB,EAAE,CAAC,IAAI,EAAE,qBAAqB,EAAE,GAAG,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACpF,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,8DAA8D;IAC9D,aAAa,EAAE,QAAQ,CAAC,UAAU,EAAE,CAAC,CAAC;IACtC,kEAAkE;IAClE,kBAAkB,CAAC,EAAE,QAAQ,CAAC,UAAU,EAAE,CAAC,CAAC;IAC5C,uDAAuD;IACvD,OAAO,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,~~IAAI,GAAG,~~SAAS,GAAG,~~SAAS,GAAG,~~UAAU,GAAG,WAAW,CAAC,CAAC;~~CACtF~~;AAED,MAAM,WAAW,~~4BAA6B~~,SAAQ,sBAAsB~~;IAC1E~~,~~MAAM~~,~~EAAE~~,~~WAAW,~~CAAC,QAAQ,CAAC,CAAC;~~CAC/B~~;AAED,eAAO,MAAM,qBAAqB,oNAUjC,CAAC;AAIF,QAAA,MAAM,uBAAuB,EAAE,iBAAiB,CAAC,4BAA4B,~~CAgG5E~~,CAAC;AAEF,eAAe,uBAAuB,CAAC"}
1	+ {"version":3,"file":"AttachInteractionDialog.d.ts","sourceRoot":"","sources":["../../../src/components/CallControlPanel/AttachInteractionDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAyB,MAAM,OAAO,CAAC;AAGjE,OAAO,EAQL,WAAW,EAEX,eAAe,EAChB,MAAM,yBAAyB,CAAC;AAEjC,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,qBAAqB;IACpC,yCAAyC;IACzC,QAAQ,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;IAC5B,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8CAA8C;IAC9C,mBAAmB,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;CACxC;AAED,MAAM,WAAW,sBAAsB;IACrC,iCAAiC;IACjC,OAAO,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,gBAAgB,EAAE,CAAC,IAAI,EAAE,qBAAqB,EAAE,GAAG,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACpF,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,8BAA8B;IAC9B,aAAa,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;IACjC,8DAA8D;IAC9D,aAAa,EAAE,QAAQ,CAAC,UAAU,EAAE,CAAC,CAAC;IACtC,mCAAmC;IACnC,kBAAkB,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;IACtC,kEAAkE;IAClE,kBAAkB,CAAC,EAAE,QAAQ,CAAC,UAAU,EAAE,CAAC,CAAC;IAC5C,uDAAuD;IACvD,OAAO,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,UAAU,GAAG,WAAW,CAAC,CAAC;CACnE;AAED,MAAM,WAAW,4BACf,SAAQ,sBAAsB,EAC5B,IAAI,CAAC,eAAe,EAAE,QAAQ,CAAC;IACjC,4HAA4H;IAC5H,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,eAAO,MAAM,qBAAqB,oNAUjC,CAAC;AAIF,QAAA,MAAM,uBAAuB,EAAE,iBAAiB,CAAC,4BAA4B,CA0G5E,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/lib/components/CallControlPanel/AttachInteractionDialog.js CHANGED Viewed

@@ -1,27 +1,30 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import styled, { css } from 'styled-components';
-import { defaultThemeProp, Flex, useI18n, Dialog, Form, Banner, ComboBox, TextArea } from '@pega/cosmos-react-core';
+import { defaultThemeProp, Flex, useI18n, Form, Banner, ComboBox, TextArea, FormDialog } from '@pega/cosmos-react-core';
 export const StyledInteractionForm = styled(Form)(({ theme: { base: { 'content-width': contentWidth } } }) => {
     return css `
       min-width: ${contentWidth.sm};
     `;
 });
 StyledInteractionForm.defaultProps = defaultThemeProp;
-const AttachInteractionDialog = ({ heading, reasonOptions, interactionOptions, message, onAddInteraction, onClose, target }) => {
+const AttachInteractionDialog = ({ heading, defaultReason, reasonOptions, defaultInteraction, interactionOptions, message, onAddInteraction, onClose, target, close }) => {
     const t = useI18n();
-    const [selectedReason, setSelectedReason] = useState();
-    const [selectedInteraction, setSelectedInteraction] = useState();
+    const initialReason = reasonOptions.find(reason => reason.id === defaultReason);
+    const initialInteraction = interactionOptions?.find(interaction => interaction.id === defaultInteraction);
+    const [selectedReason, setSelectedReason] = useState(initialReason);
+    const [selectedInteraction, setSelectedInteraction] = useState(initialInteraction);
     const [comments, setComments] = useState('');
-    const clearForm = () => {
+    const resetForm = () => {
         setComments('');
-        setSelectedInteraction(undefined);
-        setSelectedReason(undefined);
+        setSelectedInteraction(initialInteraction);
+        setSelectedReason(initialReason);
     };
-    return (_jsx(Dialog, { target: target, heading: heading, placement: 'top-end', onClose: () => {
+    return (_jsx(FormDialog, { target: target, heading: heading, onCancel: () => {
+            close();
             onClose?.();
-            clearForm();
-        }, onSubmit: ({ close }) => {
+            resetForm();
+        }, onSubmit: () => {
             onAddInteraction({
                 reasonId: selectedReason?.id,
                 comments,

package/lib/components/CallControlPanel/AttachInteractionDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachInteractionDialog.js","sourceRoot":"","sources":["../../../src/components/CallControlPanel/AttachInteractionDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,QAAQ,EAAe,MAAM,OAAO,CAAC;AACjE,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,gBAAgB,EAChB,IAAI,EACJ,OAAO,EACP,~~MAAM,EACN,~~IAAI,EACJ,MAAM,EACN,QAAQ,EACR,QAAQ,~~EAGT~~,MAAM,yBAAyB,CAAC;~~AAsCjC~~,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,IAAI,CAAC,CAC/C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,eAAe,EAAE,YAAY,EAAE,EACxC,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;mBACK,YAAY,CAAC,EAAE;KAC7B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,uBAAuB,GAAoD,CAAC,EAChF,OAAO,EACP,aAAa,EACb,kBAAkB,EAClB,OAAO,EACP,gBAAgB,EAChB,OAAO,EACP,MAAM,~~EACuB~~,EAAE,EAAE;IACjC,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,~~EAAc~~,CAAC;~~IACnE~~,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,QAAQ,~~EAAc~~,CAAC;~~IAC7E~~,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAE7C,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,WAAW,CAAC,EAAE,CAAC,CAAC;QAChB,sBAAsB,CAAC,~~SAAS~~,CAAC,CAAC;~~QAClC~~,iBAAiB,CAAC,~~SAAS~~,CAAC,CAAC;~~IAC/B~~,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,~~MAAM~~,~~IACL~~,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,~~SAAS~~,~~EAAC~~,~~SAAS~~,~~EACnB~~,~~OAAO~~,EAAE,~~GAAG,EAAE~~;~~YACZ~~,OAAO,EAAE,EAAE,CAAC;YACZ,SAAS,EAAE,CAAC;QACd,CAAC,EACD,QAAQ,EAAE,~~CAAC~~,EAAE~~,KAAK,EAAE,EAAE,EAAE~~;~~YACtB~~,gBAAgB,CACd;gBACE,QAAQ,EAAE,cAAc,EAAE,EAAE;gBAC5B,QAAQ;gBACR,mBAAmB,EAAE,mBAAmB,EAAE,EAAE;aAC7C,EACD,EAAE,KAAK,EAAE,CACV,CAAC;QACJ,CAAC,YAED,KAAC,qBAAqB,cACpB,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC7C,OAAO,IAAI,KAAC,MAAM,OAAK,OAAO,GAAI,EAElC,kBAAkB,IAAI,CACrB,KAAC,QAAQ,IACP,KAAK,EAAE,CAAC,CAAC,uCAAuC,CAAC,EACjD,QAAQ,EAAE;4BACR,KAAK,EAAE,mBAAmB;gCACxB,CAAC,CAAC,EAAE,EAAE,EAAE,mBAAmB,CAAC,EAAE,EAAE,IAAI,EAAE,mBAAmB,CAAC,KAAK,EAAE;gCACjE,CAAC,CAAC,SAAS;yBACd,EACD,IAAI,EAAE;4BACJ,KAAK,EAAE,kBAAkB,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;gCAChD,EAAE;gCACF,OAAO,EAAE,KAAK;gCACd,QAAQ,EAAE,EAAE,KAAK,mBAAmB,EAAE,EAAE;6BACzC,CAAC,CAAC;4BACH,WAAW,EAAE,EAAE,CAAC,EAAE,CAChB,sBAAsB,CAAC,kBAAkB,EAAE,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;yBAC/E,GACD,CACH,EAEA,aAAa,IAAI,CAChB,KAAC,QAAQ,IACP,KAAK,EAAE,CAAC,CAAC,kCAAkC,CAAC,EAC5C,QAAQ,EAAE;4BACR,KAAK,EAAE,cAAc;gCACnB,CAAC,CAAC,EAAE,EAAE,EAAE,cAAc,CAAC,EAAE,EAAE,IAAI,EAAE,cAAc,CAAC,KAAK,EAAE;gCACvD,CAAC,CAAC,SAAS;yBACd,EACD,IAAI,EAAE;4BACJ,KAAK,EAAE,aAAa,EAAE,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;gCAC5C,EAAE;gCACF,OAAO,EAAE,KAAK;gCACd,QAAQ,EAAE,EAAE,KAAK,cAAc,EAAE,EAAE;6BACpC,CAAC,CAAC;4BACH,WAAW,EAAE,EAAE,CAAC,EAAE,CAChB,iBAAiB,CAAC,aAAa,EAAE,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;yBACrE,GACD,CACH,EAED,KAAC,QAAQ,IACP,KAAK,EAAE,CAAC,CAAC,oCAAoC,CAAC,EAC9C,gBAAgB,QAChB,SAAS,EAAE,GAAG,EACd,KAAK,EAAE,QAAQ,EACf,QAAQ,EAAE,CAAC,CAAmC,EAAE,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GAC9E,IACG,GACe,~~GACjB~~,~~CACV~~,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,uBAAuB,CAAC","sourcesContent":["import { FunctionComponent, useState, ChangeEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n defaultThemeProp,\n Flex,\n useI18n,\n ~~Dialog,\n~~ Form,\n Banner,\n ComboBox,\n TextArea,\n BannerProps,\n ~~DialogProps~~\n} from '@pega/cosmos-react-core';\n\nexport interface MenuOption {\n id: string;\n label: string;\n}\n\nexport interface AttachInteractionData {\n /** Selected reason option identifier. /\n reasonId?: MenuOption['id'];\n /* Interaction comments. /\n comments?: string;\n /* Selected interaction option identifier. /\n interactionOptionId?: MenuOption['id'];\n}\n\nexport interface AttachInteractionProps {\n /* The heading of the dialog. /\n heading: string;\n /\n Callback invoked when 'Submit' action has been clicked.\n * Must call given 'close' function on success.\n /\n onAddInteraction: (data: AttachInteractionData, arg: { close: () => void }) => void;\n /* Callback invoked when closing the dialog. /\n onClose?: () => void;\n /* Reason options. The field will be hidden if not passed. /\n reasonOptions: Readonly<MenuOption[]>;\n /* Interaction options. The fill will be hidden if not passed. /\n interactionOptions?: Readonly<MenuOption[]>;\n /* Region for messages: errors, notifications, etc. */\n message?: Pick<BannerProps, '~~id' \| '~~variant' \| '~~heading' \| '~~messages' \| 'onDismiss'>;\n}\n\nexport interface AttachInteractionDialogProps extends AttachInteractionProps {\n target: ~~DialogProps['target']~~;\n}\n\nexport const StyledInteractionForm = styled(Form)(\n ({\n theme: {\n base: { 'content-width': contentWidth }\n }\n }) => {\n return css`\n min-width: ${contentWidth.sm};\n `;\n }\n);\n\nStyledInteractionForm.defaultProps = defaultThemeProp;\n\nconst AttachInteractionDialog: FunctionComponent<AttachInteractionDialogProps> = ({\n heading,\n reasonOptions,\n interactionOptions,\n message,\n onAddInteraction,\n onClose,\n target\n}: AttachInteractionDialogProps) => {\n const t = useI18n();\n\n const [selectedReason, setSelectedReason] = useState<MenuOption>();\n const [selectedInteraction, setSelectedInteraction] = useState<MenuOption>();\n const [comments, setComments] = useState('');\n\n const ~~clearForm~~ = () => {\n setComments('');\n setSelectedInteraction(~~undefined~~);\n setSelectedReason(~~undefined~~);\n };\n\n return (\n <~~Dialog~~\n target={target}\n heading={heading}\n ~~placement~~=~~'top-end'\n onClose=~~{() => {\n onClose?.();\n ~~clearForm~~();\n }}\n onSubmit={(~~{ close }~~) => {\n onAddInteraction(\n {\n reasonId: selectedReason?.id,\n comments,\n interactionOptionId: selectedInteraction?.id\n },\n { close }\n );\n }}\n >\n <StyledInteractionForm>\n <Flex container={{ direction: 'column', gap: 1 }}>\n {message && <Banner {...message} />}\n\n {interactionOptions && (\n <ComboBox\n label={t('call_panel_handover_interaction_label')}\n selected={{\n items: selectedInteraction\n ? { id: selectedInteraction.id, text: selectedInteraction.label }\n : undefined\n }}\n menu={{\n items: interactionOptions.map(({ id, label }) => ({\n id,\n primary: label,\n selected: id === selectedInteraction?.id\n })),\n onItemClick: id =>\n setSelectedInteraction(interactionOptions?.find(option => option.id === id))\n }}\n />\n )}\n\n {reasonOptions && (\n <ComboBox\n label={t('call_panel_handover_reason_label')}\n selected={{\n items: selectedReason\n ? { id: selectedReason.id, text: selectedReason.label }\n : undefined\n }}\n menu={{\n items: reasonOptions?.map(({ id, label }) => ({\n id,\n primary: label,\n selected: id === selectedReason?.id\n })),\n onItemClick: id =>\n setSelectedReason(reasonOptions?.find(option => option.id === id))\n }}\n />\n )}\n\n <TextArea\n label={t('call_panel_handover_comments_label')}\n displayCharCount\n maxLength={300}\n value={comments}\n onChange={(e: ChangeEvent<HTMLTextAreaElement>) => setComments(e.target.value)}\n />\n </Flex>\n </StyledInteractionForm>\n </~~Dialog~~>\n );\n};\n\nexport default AttachInteractionDialog;\n"]}
1	+ {"version":3,"file":"AttachInteractionDialog.js","sourceRoot":"","sources":["../../../src/components/CallControlPanel/AttachInteractionDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, useState, ChangeEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n defaultThemeProp,\n Flex,\n useI18n,\n Form,\n Banner,\n ComboBox,\n TextArea,\n BannerProps,\n FormDialog,\n FormDialogProps\n} from '@pega/cosmos-react-core';\n\nexport interface MenuOption {\n id: string;\n label: string;\n}\n\nexport interface AttachInteractionData {\n /** Selected reason option identifier. /\n reasonId?: MenuOption['id'];\n /* Interaction comments. /\n comments?: string;\n /* Selected interaction option identifier. /\n interactionOptionId?: MenuOption['id'];\n}\n\nexport interface AttachInteractionProps {\n /* The heading of the dialog. /\n heading: string;\n /\n Callback invoked when 'Submit' action has been clicked.\n * Must call given 'close' function on success.\n /\n onAddInteraction: (data: AttachInteractionData, arg: { close: () => void }) => void;\n /* Callback invoked when closing the dialog. /\n onClose?: () => void;\n /* Current selected reason /\n defaultReason?: MenuOption['id'];\n /* Reason options. The field will be hidden if not passed. /\n reasonOptions: Readonly<MenuOption[]>;\n /* Current selected interaction /\n defaultInteraction?: MenuOption['id'];\n /* Interaction options. The fill will be hidden if not passed. /\n interactionOptions?: Readonly<MenuOption[]>;\n /* Region for messages: errors, notifications, etc. /\n message?: Pick<BannerProps, 'variant' \| 'messages' \| 'onDismiss'>;\n}\n\nexport interface AttachInteractionDialogProps\n extends AttachInteractionProps,\n Pick<FormDialogProps, 'target'> {\n /* When invoked, sets the dialog target to null to close. Maintains interface support where onSubmit receives close arg. */\n close: () => void;\n}\n\nexport const StyledInteractionForm = styled(Form)(\n ({\n theme: {\n base: { 'content-width': contentWidth }\n }\n }) => {\n return css`\n min-width: ${contentWidth.sm};\n `;\n }\n);\n\nStyledInteractionForm.defaultProps = defaultThemeProp;\n\nconst AttachInteractionDialog: FunctionComponent<AttachInteractionDialogProps> = ({\n heading,\n defaultReason,\n reasonOptions,\n defaultInteraction,\n interactionOptions,\n message,\n onAddInteraction,\n onClose,\n target,\n close\n}: AttachInteractionDialogProps) => {\n const t = useI18n();\n\n const initialReason = reasonOptions.find(reason => reason.id === defaultReason);\n const initialInteraction = interactionOptions?.find(\n interaction => interaction.id === defaultInteraction\n );\n\n const [selectedReason, setSelectedReason] = useState<MenuOption \| undefined>(initialReason);\n const [selectedInteraction, setSelectedInteraction] = useState<MenuOption \| undefined>(\n initialInteraction\n );\n const [comments, setComments] = useState('');\n\n const resetForm = () => {\n setComments('');\n setSelectedInteraction(initialInteraction);\n setSelectedReason(initialReason);\n };\n\n return (\n <FormDialog\n target={target}\n heading={heading}\n onCancel={() => {\n close();\n onClose?.();\n resetForm();\n }}\n onSubmit={() => {\n onAddInteraction(\n {\n reasonId: selectedReason?.id,\n comments,\n interactionOptionId: selectedInteraction?.id\n },\n { close }\n );\n }}\n >\n <StyledInteractionForm>\n <Flex container={{ direction: 'column', gap: 1 }}>\n {message && <Banner {...message} />}\n\n {interactionOptions && (\n <ComboBox\n label={t('call_panel_handover_interaction_label')}\n selected={{\n items: selectedInteraction\n ? { id: selectedInteraction.id, text: selectedInteraction.label }\n : undefined\n }}\n menu={{\n items: interactionOptions.map(({ id, label }) => ({\n id,\n primary: label,\n selected: id === selectedInteraction?.id\n })),\n onItemClick: id =>\n setSelectedInteraction(interactionOptions?.find(option => option.id === id))\n }}\n />\n )}\n\n {reasonOptions && (\n <ComboBox\n label={t('call_panel_handover_reason_label')}\n selected={{\n items: selectedReason\n ? { id: selectedReason.id, text: selectedReason.label }\n : undefined\n }}\n menu={{\n items: reasonOptions?.map(({ id, label }) => ({\n id,\n primary: label,\n selected: id === selectedReason?.id\n })),\n onItemClick: id =>\n setSelectedReason(reasonOptions?.find(option => option.id === id))\n }}\n />\n )}\n\n <TextArea\n label={t('call_panel_handover_comments_label')}\n displayCharCount\n maxLength={300}\n value={comments}\n onChange={(e: ChangeEvent<HTMLTextAreaElement>) => setComments(e.target.value)}\n />\n </Flex>\n </StyledInteractionForm>\n </FormDialog>\n );\n};\n\nexport default AttachInteractionDialog;\n"]}

package/lib/components/CallControlPanel/Call.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Call.d.ts","sourceRoot":"","sources":["../../../src/components/CallControlPanel/Call.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAqC,MAAM,OAAO,CAAC;AAE7E,OAAO,EAGL,YAAY,EAQb,MAAM,yBAAyB,CAAC;AAajC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAgB1D,QAAA,MAAM,IAAI,EAAE,iBAAiB,CAAC,SAAS,GAAG,YAAY,~~CAwRrD~~,CAAC;AAEF,eAAe,IAAI,CAAC"}
1	+ {"version":3,"file":"Call.d.ts","sourceRoot":"","sources":["../../../src/components/CallControlPanel/Call.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAqC,MAAM,OAAO,CAAC;AAE7E,OAAO,EAGL,YAAY,EAQb,MAAM,yBAAyB,CAAC;AAajC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAgB1D,QAAA,MAAM,IAAI,EAAE,iBAAiB,CAAC,SAAS,GAAG,YAAY,CAiSrD,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/lib/components/CallControlPanel/Call.js CHANGED Viewed

@@ -53,7 +53,18 @@ const Call = ({ id: callId, startedAt, onHoldSince, slaConfig, participants, onP
                                             id: 'conference',
                                             primary: t('call_panel_conference_call_menu_item'),
                                             disabled: !onConferenceAction,
-                                            onClick: () => setDialogType('conference')
+                                            items: [
+                                                {
+                                                    id: 'conferenceCallWithInteraction',
+                                                    primary: t('call_panel_menu_item_call_with_interaction'),
+                                                    onClick: () => setDialogType('conferenceWithInteractions')
+                                                },
+                                                {
+                                                    id: 'conferenceCallOnly',
+                                                    primary: t('call_panel_menu_item_call_only'),
+                                                    onClick: () => setDialogType('conferenceCallOnly')
+                                                }
+                                            ]
                                         },
                                         {
                                             id: 'consult',
@@ -63,13 +74,11 @@ const Call = ({ id: callId, startedAt, onHoldSince, slaConfig, participants, onP
                                                 {
                                                     id: 'consultCallWithInteraction',
                                                     primary: t('call_panel_menu_item_call_with_interaction'),
-                                                    disabled: !onTransferAction,
                                                     onClick: () => setDialogType('consultWithInteractions')
                                                 },
                                                 {
                                                     id: 'consultCallOnly',
                                                     primary: t('call_panel_menu_item_call_only'),
-                                                    disabled: !onTransferAction,
                                                     onClick: () => setDialogType('consultCallOnly')
                                                 }
                                             ]
@@ -82,13 +91,11 @@ const Call = ({ id: callId, startedAt, onHoldSince, slaConfig, participants, onP
                                                 {
                                                     id: 'transferCallWithInteraction',
                                                     primary: t('call_panel_menu_item_call_with_interaction'),
-                                                    disabled: !onTransferAction,
                                                     onClick: () => setDialogType('transferWithInteractions')
                                                 },
                                                 {
                                                     id: 'transferCallOnly',
                                                     primary: t('call_panel_menu_item_call_only'),
-                                                    disabled: !onTransferAction,
                                                     onClick: () => setDialogType('transferCallOnly')
                                                 }
                                             ]
@@ -114,7 +121,8 @@ const Call = ({ id: callId, startedAt, onHoldSince, slaConfig, participants, onP
                     moreActionsButtonRef.current?.focus();
                 }, onSubmit: transferData => {
                     switch (dialogType) {
-                        case 'conference':
+                        case 'conferenceCallOnly':
+                        case 'conferenceWithInteractions':
                             onConferenceAction?.(callId, transferData);
                             break;
                         case 'consultCallOnly':

package/lib/components/CallControlPanel/Call.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Call.js","sourceRoot":"","sources":["../../../src/components/CallControlPanel/Call.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, useLayoutEffect, useRef, useState } from 'react';\n\nimport {\n Button,\n Flex,\n ForwardProps,\n Icon,\n registerIcon,\n Status,\n SummaryItem,\n Text,\n useI18n,\n MenuButton\n} from '@pega/cosmos-react-core';\nimport * as arrowUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-up.icon';\nimport * as micSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mic-solid.icon';\nimport * as micOffSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mic-off-solid.icon';\nimport * as playSoldIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/play-solid.icon';\nimport * as pauseSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/pause-solid.icon';\nimport * as phoneSplitSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/phone-split-solid.icon';\nimport * as phoneOutSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/phone-out-solid.icon';\nimport * as phoneHangupSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/phone-hangup-solid.icon';\n\nimport { DialPadDialog } from '../DialPad';\n\nimport { StyledHoldInfo, StyledCallContainer, StyledSLAProgress } from './CallControlPanel.styles';\nimport type { CallProps } from './CallControlPanel.types';\nimport StopWatch from './StopWatch';\nimport { calculateSla } from './utils';\nimport CallHandoverDialog from './CallHandover';\n\nregisterIcon(\n arrowUpIcon,\n micSolidIcon,\n micOffSolidIcon,\n playSoldIcon,\n pauseSolidIcon,\n phoneSplitSolidIcon,\n phoneOutSolidIcon,\n phoneHangupSolidIcon\n);\n\nconst Call: FunctionComponent<CallProps & ForwardProps> = ({\n id: callId,\n startedAt,\n onHoldSince,\n slaConfig,\n participants,\n onPauseToggle,\n muted,\n onMuteToggle,\n onDTMFPress,\n onConsultAction,\n onConferenceAction,\n onTransferAction,\n onMergeCall,\n onHandOffCall,\n onEndCall,\n transferOptions,\n interactionOptions\n}: CallProps & ForwardProps) => {\n const t = useI18n();\n const moreActionsButtonRef = useRef<HTMLButtonElement>(null);\n const inCallSince = startedAt instanceof Date ? startedAt.getUTCMilliseconds() : startedAt;\n const [slaLevel, setSlaLevel] = useState<number \| undefined>(undefined);\n const [dialogType, setDialogType] = useState<\n \| 'conference'\n \| 'transferWithInteractions'\n \| 'transferCallOnly'\n \| 'consultWithInteractions'\n \| 'consultCallOnly'\n \| undefined\n >();\n const [showDTMF, setShowDTMF] = useState(false);\n\n const { slaTimeout, slaDuration } = calculateSla(Date.now() - inCallSince, slaConfig);\n\n const calculateCurrentSlaLevel = (): void => {\n const { currentSlaLevel } = calculateSla(Date.now() - inCallSince, slaConfig);\n setSlaLevel(currentSlaLevel);\n };\n\n useLayoutEffect(() => {\n calculateCurrentSlaLevel();\n const slaDurationInMillis = slaDuration && slaDuration * 1000;\n\n const timer = setTimeout(() => {\n calculateCurrentSlaLevel();\n }, slaDurationInMillis);\n\n return () => clearTimeout(timer);\n }, [inCallSince, slaLevel]);\n\n return (\n <StyledCallContainer>\n <StyledSLAProgress\n determinate\n placement='local'\n slaDuration={slaDuration}\n slaLevel={slaLevel}\n />\n {participants.map((item, index) => {\n return (\n <SummaryItem\n container={\n index === 0\n ? {\n areas: '\"primary secondary actions\"',\n cols: 'auto minmax(0, 2fr) auto'\n }\n : {\n areas: '\"visual primary secondary actions\"',\n cols: 'auto auto minmax(0, 2fr) auto'\n }\n }\n overflowStrategy='ellipsis'\n visual={index !== 0 && <Icon name='arrow-up' />}\n primary={item.name}\n secondary={item.info && <Text variant='secondary'>{item.info}</Text>}\n key={item.id}\n actions={\n index === 0 ? (\n <Flex container={{ wrap: 'nowrap' }}>\n {slaConfig && (\n <Flex container={{ alignItems: 'center' }}>\n <StopWatch startTime={startedAt} timeout={slaTimeout} />\n </Flex>\n )}\n\n <Button\n icon\n variant='simple'\n disabled={onHoldSince !== undefined}\n onClick={() => onMuteToggle(callId)}\n label={t(\n muted ? 'call_panel_unmute_mic_menu_item' : 'call_panel_mute_mic_menu_item'\n )}\n >\n <Icon name={muted ? 'mic-solid' : 'mic-off-solid'} />\n </Button>\n\n <Button\n icon\n variant='simple'\n disabled={!onPauseToggle}\n onClick={() => onPauseToggle?.(callId)}\n label={t(\n onHoldSince !== undefined\n ? 'call_panel_resume_call_menu_item'\n : 'call_panel_pause_call_menu_item'\n )}\n >\n <Icon name={onHoldSince !== undefined ? 'play-solid' : 'pause-solid'} />\n </Button>\n {onHoldSince ? (\n <>\n {onMergeCall && (\n <Button\n icon\n variant='simple'\n onClick={() => onMergeCall(callId)}\n label={t('call_panel_merge_call_menu_item')}\n >\n <Icon name='phone-split-solid' />\n </Button>\n )}\n {onHandOffCall && (\n <Button\n icon\n variant='simple'\n onClick={() => onHandOffCall(callId)}\n label={t('call_panel_handoff_call_menu_item')}\n >\n <Icon name='phone-out-solid' />\n </Button>\n )}\n <Button\n icon\n variant='simple'\n key='hang_up'\n disabled={!onEndCall}\n onClick={() => onEndCall?.(callId)}\n label={t('call_panel_hangup_call_menu_item')}\n >\n <Icon name='phone-hangup-solid' />\n </Button>\n </>\n ) : (\n <MenuButton\n ref={moreActionsButtonRef}\n text={t('actions')}\n iconOnly\n icon='more'\n variant='simple'\n menu={{\n variant: 'flyout',\n items: [\n {\n id: 'conference',\n primary: t('call_panel_conference_call_menu_item'),\n disabled: !onConferenceAction,\n onClick: () => setDialogType('conference')\n },\n {\n id: 'consult',\n primary: t('call_panel_consult_call_menu_item'),\n disabled: !onConsultAction,\n items: [\n {\n id: 'consultCallWithInteraction',\n primary: t('call_panel_menu_item_call_with_interaction'),\n disabled: !onTransferAction,\n onClick: () => setDialogType('consultWithInteractions')\n },\n {\n id: 'consultCallOnly',\n primary: t('call_panel_menu_item_call_only'),\n disabled: !onTransferAction,\n onClick: () => setDialogType('consultCallOnly')\n }\n ]\n },\n {\n id: 'transfer',\n primary: t('call_panel_transfer_call_menu_item'),\n disabled: !onTransferAction,\n items: [\n {\n id: 'transferCallWithInteraction',\n primary: t('call_panel_menu_item_call_with_interaction'),\n disabled: !onTransferAction,\n onClick: () => setDialogType('transferWithInteractions')\n },\n {\n id: 'transferCallOnly',\n primary: t('call_panel_menu_item_call_only'),\n disabled: !onTransferAction,\n onClick: () => setDialogType('transferCallOnly')\n }\n ]\n },\n {\n id: 'dtmf',\n primary: t('call_panel_send_dtmf_menu_item'),\n disabled: !onDTMFPress,\n onClick: () => setShowDTMF(true)\n },\n {\n id: 'hang_up',\n primary: t('call_panel_hangup_call_menu_item'),\n disabled: !onEndCall,\n onClick: () => onEndCall?.(callId)\n }\n ]\n }}\n />\n )}\n </Flex>\n ) : (\n <Button\n icon\n variant='simple'\n key='hang_up'\n disabled={!item.onHangUp}\n onClick={() => item.onHangUp?.(callId, item.id)}\n label={t('call_panel_hangup_call_menu_item')}\n >\n <Icon name='phone-hangup-solid' />\n </Button>\n )\n }\n />\n );\n })}\n {onHoldSince !== undefined && (\n <Status as={StyledHoldInfo} variant='pending'>\n {\n t('call_panel_call_on_hold', [\n <StopWatch startTime={onHoldSince} />\n ]) as unknown as string\n }\n </Status>\n )}\n {dialogType && (\n <CallHandoverDialog\n target={moreActionsButtonRef.current}\n type={dialogType}\n transferOptions={transferOptions}\n interactionOptions={interactionOptions}\n onCancel={() => {\n setDialogType(undefined);\n moreActionsButtonRef.current?.focus();\n }}\n onSubmit={transferData => {\n switch (dialogType) {\n case 'conference':\n onConferenceAction?.(callId, transferData);\n break;\n case 'consultCallOnly':\n case 'consultWithInteractions':\n onConsultAction?.(callId, transferData);\n break;\n case 'transferCallOnly':\n case 'transferWithInteractions':\n onTransferAction?.(callId, transferData);\n break;\n default:\n }\n setDialogType(undefined);\n moreActionsButtonRef.current?.focus();\n }}\n />\n )}\n {showDTMF && (\n <DialPadDialog\n target={moreActionsButtonRef.current}\n onClose={() => setShowDTMF(false)}\n onDialButtonClick={(key: number) => onDTMFPress?.(callId, String.fromCharCode(key))}\n />\n )}\n </StyledCallContainer>\n );\n};\n\nexport default Call;\n"]}
1	+ {"version":3,"file":"Call.js","sourceRoot":"","sources":["../../../src/components/CallControlPanel/Call.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE7E,OAAO,EACL,MAAM,EACN,IAAI,EAEJ,IAAI,EACJ,YAAY,EACZ,MAAM,EACN,WAAW,EACX,IAAI,EACJ,OAAO,EACP,UAAU,EACX,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,WAAW,MAAM,iEAAiE,CAAC;AAC/F,OAAO,KAAK,YAAY,MAAM,kEAAkE,CAAC;AACjG,OAAO,KAAK,eAAe,MAAM,sEAAsE,CAAC;AACxG,OAAO,KAAK,YAAY,MAAM,mEAAmE,CAAC;AAClG,OAAO,KAAK,cAAc,MAAM,oEAAoE,CAAC;AACrG,OAAO,KAAK,mBAAmB,MAAM,0EAA0E,CAAC;AAChH,OAAO,KAAK,iBAAiB,MAAM,wEAAwE,CAAC;AAC5G,OAAO,KAAK,oBAAoB,MAAM,2EAA2E,CAAC;AAElH,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAEnG,OAAO,SAAS,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,kBAAkB,MAAM,gBAAgB,CAAC;AAEhD,YAAY,CACV,WAAW,EACX,YAAY,EACZ,eAAe,EACf,YAAY,EACZ,cAAc,EACd,mBAAmB,EACnB,iBAAiB,EACjB,oBAAoB,CACrB,CAAC;AAEF,MAAM,IAAI,GAAgD,CAAC,EACzD,EAAE,EAAE,MAAM,EACV,SAAS,EACT,WAAW,EACX,SAAS,EACT,YAAY,EACZ,aAAa,EACb,KAAK,EACL,YAAY,EACZ,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,SAAS,EACT,eAAe,EACf,kBAAkB,EACO,EAAE,EAAE;IAC7B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,oBAAoB,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAC7D,MAAM,WAAW,GAAG,SAAS,YAAY,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,kBAAkB,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IAC3F,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAqB,SAAS,CAAC,CAAC;IACxE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,EAQzC,CAAC;IACJ,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEhD,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,YAAY,CAAC,IAAI,CAAC,GAAG,EAAE,GAAG,WAAW,EAAE,SAAS,CAAC,CAAC;IAEtF,MAAM,wBAAwB,GAAG,GAAS,EAAE;QAC1C,MAAM,EAAE,eAAe,EAAE,GAAG,YAAY,CAAC,IAAI,CAAC,GAAG,EAAE,GAAG,WAAW,EAAE,SAAS,CAAC,CAAC;QAC9E,WAAW,CAAC,eAAe,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,eAAe,CAAC,GAAG,EAAE;QACnB,wBAAwB,EAAE,CAAC;QAC3B,MAAM,mBAAmB,GAAG,WAAW,IAAI,WAAW,GAAG,IAAI,CAAC;QAE9D,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE;YAC5B,wBAAwB,EAAE,CAAC;QAC7B,CAAC,EAAE,mBAAmB,CAAC,CAAC;QAExB,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,EAAE,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;IAE5B,OAAO,CACL,MAAC,mBAAmB,eAClB,KAAC,iBAAiB,IAChB,WAAW,QACX,SAAS,EAAC,OAAO,EACjB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,GAClB,EACD,YAAY,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;gBAChC,OAAO,CACL,KAAC,WAAW,IACV,SAAS,EACP,KAAK,KAAK,CAAC;wBACT,CAAC,CAAC;4BACE,KAAK,EAAE,6BAA6B;4BACpC,IAAI,EAAE,0BAA0B;yBACjC;wBACH,CAAC,CAAC;4BACE,KAAK,EAAE,oCAAoC;4BAC3C,IAAI,EAAE,+BAA+B;yBACtC,EAEP,gBAAgB,EAAC,UAAU,EAC3B,MAAM,EAAE,KAAK,KAAK,CAAC,IAAI,KAAC,IAAI,IAAC,IAAI,EAAC,UAAU,GAAG,EAC/C,OAAO,EAAE,IAAI,CAAC,IAAI,EAClB,SAAS,EAAE,IAAI,CAAC,IAAI,IAAI,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,YAAE,IAAI,CAAC,IAAI,GAAQ,EAEpE,OAAO,EACL,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CACZ,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,aAChC,SAAS,IAAI,CACZ,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,YACvC,KAAC,SAAS,IAAC,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,UAAU,GAAI,GACnD,CACR,EAED,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,QAAQ,EAAE,WAAW,KAAK,SAAS,EACnC,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,EACnC,KAAK,EAAE,CAAC,CACN,KAAK,CAAC,CAAC,CAAC,iCAAiC,CAAC,CAAC,CAAC,+BAA+B,CAC5E,YAED,KAAC,IAAI,IAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,eAAe,GAAI,GAC9C,EAET,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,QAAQ,EAAE,CAAC,aAAa,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,EAAE,CAAC,MAAM,CAAC,EACtC,KAAK,EAAE,CAAC,CACN,WAAW,KAAK,SAAS;oCACvB,CAAC,CAAC,kCAAkC;oCACpC,CAAC,CAAC,iCAAiC,CACtC,YAED,KAAC,IAAI,IAAC,IAAI,EAAE,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,GAAI,GACjE,EACR,WAAW,CAAC,CAAC,CAAC,CACb,8BACG,WAAW,IAAI,CACd,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,MAAM,CAAC,EAClC,KAAK,EAAE,CAAC,CAAC,iCAAiC,CAAC,YAE3C,KAAC,IAAI,IAAC,IAAI,EAAC,mBAAmB,GAAG,GAC1B,CACV,EACA,aAAa,IAAI,CAChB,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,MAAM,CAAC,EACpC,KAAK,EAAE,CAAC,CAAC,mCAAmC,CAAC,YAE7C,KAAC,IAAI,IAAC,IAAI,EAAC,iBAAiB,GAAG,GACxB,CACV,EACD,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAEhB,QAAQ,EAAE,CAAC,SAAS,EACpB,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,EAAE,CAAC,MAAM,CAAC,EAClC,KAAK,EAAE,CAAC,CAAC,kCAAkC,CAAC,YAE5C,KAAC,IAAI,IAAC,IAAI,EAAC,oBAAoB,GAAG,IAL9B,SAAS,CAMN,IACR,CACJ,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,IACT,GAAG,EAAE,oBAAoB,EACzB,IAAI,EAAE,CAAC,CAAC,SAAS,CAAC,EAClB,QAAQ,QACR,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAE;oCACJ,OAAO,EAAE,QAAQ;oCACjB,KAAK,EAAE;wCACL;4CACE,EAAE,EAAE,YAAY;4CAChB,OAAO,EAAE,CAAC,CAAC,sCAAsC,CAAC;4CAClD,QAAQ,EAAE,CAAC,kBAAkB;4CAC7B,KAAK,EAAE;gDACL;oDACE,EAAE,EAAE,+BAA+B;oDACnC,OAAO,EAAE,CAAC,CAAC,4CAA4C,CAAC;oDACxD,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,4BAA4B,CAAC;iDAC3D;gDACD;oDACE,EAAE,EAAE,oBAAoB;oDACxB,OAAO,EAAE,CAAC,CAAC,gCAAgC,CAAC;oDAC5C,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,oBAAoB,CAAC;iDACnD;6CACF;yCACF;wCACD;4CACE,EAAE,EAAE,SAAS;4CACb,OAAO,EAAE,CAAC,CAAC,mCAAmC,CAAC;4CAC/C,QAAQ,EAAE,CAAC,eAAe;4CAC1B,KAAK,EAAE;gDACL;oDACE,EAAE,EAAE,4BAA4B;oDAChC,OAAO,EAAE,CAAC,CAAC,4CAA4C,CAAC;oDACxD,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,yBAAyB,CAAC;iDACxD;gDACD;oDACE,EAAE,EAAE,iBAAiB;oDACrB,OAAO,EAAE,CAAC,CAAC,gCAAgC,CAAC;oDAC5C,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,iBAAiB,CAAC;iDAChD;6CACF;yCACF;wCACD;4CACE,EAAE,EAAE,UAAU;4CACd,OAAO,EAAE,CAAC,CAAC,oCAAoC,CAAC;4CAChD,QAAQ,EAAE,CAAC,gBAAgB;4CAC3B,KAAK,EAAE;gDACL;oDACE,EAAE,EAAE,6BAA6B;oDACjC,OAAO,EAAE,CAAC,CAAC,4CAA4C,CAAC;oDACxD,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,0BAA0B,CAAC;iDACzD;gDACD;oDACE,EAAE,EAAE,kBAAkB;oDACtB,OAAO,EAAE,CAAC,CAAC,gCAAgC,CAAC;oDAC5C,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,kBAAkB,CAAC;iDACjD;6CACF;yCACF;wCACD;4CACE,EAAE,EAAE,MAAM;4CACV,OAAO,EAAE,CAAC,CAAC,gCAAgC,CAAC;4CAC5C,QAAQ,EAAE,CAAC,WAAW;4CACtB,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC;yCACjC;wCACD;4CACE,EAAE,EAAE,SAAS;4CACb,OAAO,EAAE,CAAC,CAAC,kCAAkC,CAAC;4CAC9C,QAAQ,EAAE,CAAC,SAAS;4CACpB,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,EAAE,CAAC,MAAM,CAAC;yCACnC;qCACF;iCACF,GACD,CACH,IACI,CACR,CAAC,CAAC,CAAC,CACF,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAEhB,QAAQ,EAAE,CAAC,IAAI,CAAC,QAAQ,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,EAC/C,KAAK,EAAE,CAAC,CAAC,kCAAkC,CAAC,YAE5C,KAAC,IAAI,IAAC,IAAI,EAAC,oBAAoB,GAAG,IAL9B,SAAS,CAMN,CACV,IA7JE,IAAI,CAAC,EAAE,CA+JZ,CACH,CAAC;YACJ,CAAC,CAAC,EACD,WAAW,KAAK,SAAS,IAAI,CAC5B,KAAC,MAAM,IAAC,EAAE,EAAE,cAAc,EAAE,OAAO,EAAC,SAAS,YAEzC,CAAC,CAAC,yBAAyB,EAAE;oBAC3B,KAAC,SAAS,IAAC,SAAS,EAAE,WAAW,GAAI;iBACtC,CAAsB,GAElB,CACV,EACA,UAAU,IAAI,CACb,KAAC,kBAAkB,IACjB,MAAM,EAAE,oBAAoB,CAAC,OAAO,EACpC,IAAI,EAAE,UAAU,EAChB,eAAe,EAAE,eAAe,EAChC,kBAAkB,EAAE,kBAAkB,EACtC,QAAQ,EAAE,GAAG,EAAE;oBACb,aAAa,CAAC,SAAS,CAAC,CAAC;oBACzB,oBAAoB,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;gBACxC,CAAC,EACD,QAAQ,EAAE,YAAY,CAAC,EAAE;oBACvB,QAAQ,UAAU,EAAE;wBAClB,KAAK,oBAAoB,CAAC;wBAC1B,KAAK,4BAA4B;4BAC/B,kBAAkB,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;4BAC3C,MAAM;wBACR,KAAK,iBAAiB,CAAC;wBACvB,KAAK,yBAAyB;4BAC5B,eAAe,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;4BACxC,MAAM;wBACR,KAAK,kBAAkB,CAAC;wBACxB,KAAK,0BAA0B;4BAC7B,gBAAgB,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;4BACzC,MAAM;wBACR,QAAQ;qBACT;oBACD,aAAa,CAAC,SAAS,CAAC,CAAC;oBACzB,oBAAoB,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;gBACxC,CAAC,GACD,CACH,EACA,QAAQ,IAAI,CACX,KAAC,aAAa,IACZ,MAAM,EAAE,oBAAoB,CAAC,OAAO,EACpC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EACjC,iBAAiB,EAAE,CAAC,GAAW,EAAE,EAAE,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GACnF,CACH,IACmB,CACvB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import { FunctionComponent, useLayoutEffect, useRef, useState } from 'react';\n\nimport {\n Button,\n Flex,\n ForwardProps,\n Icon,\n registerIcon,\n Status,\n SummaryItem,\n Text,\n useI18n,\n MenuButton\n} from '@pega/cosmos-react-core';\nimport * as arrowUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-up.icon';\nimport * as micSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mic-solid.icon';\nimport * as micOffSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mic-off-solid.icon';\nimport * as playSoldIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/play-solid.icon';\nimport * as pauseSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/pause-solid.icon';\nimport * as phoneSplitSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/phone-split-solid.icon';\nimport * as phoneOutSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/phone-out-solid.icon';\nimport * as phoneHangupSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/phone-hangup-solid.icon';\n\nimport { DialPadDialog } from '../DialPad';\n\nimport { StyledHoldInfo, StyledCallContainer, StyledSLAProgress } from './CallControlPanel.styles';\nimport type { CallProps } from './CallControlPanel.types';\nimport StopWatch from './StopWatch';\nimport { calculateSla } from './utils';\nimport CallHandoverDialog from './CallHandover';\n\nregisterIcon(\n arrowUpIcon,\n micSolidIcon,\n micOffSolidIcon,\n playSoldIcon,\n pauseSolidIcon,\n phoneSplitSolidIcon,\n phoneOutSolidIcon,\n phoneHangupSolidIcon\n);\n\nconst Call: FunctionComponent<CallProps & ForwardProps> = ({\n id: callId,\n startedAt,\n onHoldSince,\n slaConfig,\n participants,\n onPauseToggle,\n muted,\n onMuteToggle,\n onDTMFPress,\n onConsultAction,\n onConferenceAction,\n onTransferAction,\n onMergeCall,\n onHandOffCall,\n onEndCall,\n transferOptions,\n interactionOptions\n}: CallProps & ForwardProps) => {\n const t = useI18n();\n const moreActionsButtonRef = useRef<HTMLButtonElement>(null);\n const inCallSince = startedAt instanceof Date ? startedAt.getUTCMilliseconds() : startedAt;\n const [slaLevel, setSlaLevel] = useState<number \| undefined>(undefined);\n const [dialogType, setDialogType] = useState<\n \| 'conferenceWithInteractions'\n \| 'conferenceCallOnly'\n \| 'transferWithInteractions'\n \| 'transferCallOnly'\n \| 'consultWithInteractions'\n \| 'consultCallOnly'\n \| undefined\n >();\n const [showDTMF, setShowDTMF] = useState(false);\n\n const { slaTimeout, slaDuration } = calculateSla(Date.now() - inCallSince, slaConfig);\n\n const calculateCurrentSlaLevel = (): void => {\n const { currentSlaLevel } = calculateSla(Date.now() - inCallSince, slaConfig);\n setSlaLevel(currentSlaLevel);\n };\n\n useLayoutEffect(() => {\n calculateCurrentSlaLevel();\n const slaDurationInMillis = slaDuration && slaDuration * 1000;\n\n const timer = setTimeout(() => {\n calculateCurrentSlaLevel();\n }, slaDurationInMillis);\n\n return () => clearTimeout(timer);\n }, [inCallSince, slaLevel]);\n\n return (\n <StyledCallContainer>\n <StyledSLAProgress\n determinate\n placement='local'\n slaDuration={slaDuration}\n slaLevel={slaLevel}\n />\n {participants.map((item, index) => {\n return (\n <SummaryItem\n container={\n index === 0\n ? {\n areas: '\"primary secondary actions\"',\n cols: 'auto minmax(0, 2fr) auto'\n }\n : {\n areas: '\"visual primary secondary actions\"',\n cols: 'auto auto minmax(0, 2fr) auto'\n }\n }\n overflowStrategy='ellipsis'\n visual={index !== 0 && <Icon name='arrow-up' />}\n primary={item.name}\n secondary={item.info && <Text variant='secondary'>{item.info}</Text>}\n key={item.id}\n actions={\n index === 0 ? (\n <Flex container={{ wrap: 'nowrap' }}>\n {slaConfig && (\n <Flex container={{ alignItems: 'center' }}>\n <StopWatch startTime={startedAt} timeout={slaTimeout} />\n </Flex>\n )}\n\n <Button\n icon\n variant='simple'\n disabled={onHoldSince !== undefined}\n onClick={() => onMuteToggle(callId)}\n label={t(\n muted ? 'call_panel_unmute_mic_menu_item' : 'call_panel_mute_mic_menu_item'\n )}\n >\n <Icon name={muted ? 'mic-solid' : 'mic-off-solid'} />\n </Button>\n\n <Button\n icon\n variant='simple'\n disabled={!onPauseToggle}\n onClick={() => onPauseToggle?.(callId)}\n label={t(\n onHoldSince !== undefined\n ? 'call_panel_resume_call_menu_item'\n : 'call_panel_pause_call_menu_item'\n )}\n >\n <Icon name={onHoldSince !== undefined ? 'play-solid' : 'pause-solid'} />\n </Button>\n {onHoldSince ? (\n <>\n {onMergeCall && (\n <Button\n icon\n variant='simple'\n onClick={() => onMergeCall(callId)}\n label={t('call_panel_merge_call_menu_item')}\n >\n <Icon name='phone-split-solid' />\n </Button>\n )}\n {onHandOffCall && (\n <Button\n icon\n variant='simple'\n onClick={() => onHandOffCall(callId)}\n label={t('call_panel_handoff_call_menu_item')}\n >\n <Icon name='phone-out-solid' />\n </Button>\n )}\n <Button\n icon\n variant='simple'\n key='hang_up'\n disabled={!onEndCall}\n onClick={() => onEndCall?.(callId)}\n label={t('call_panel_hangup_call_menu_item')}\n >\n <Icon name='phone-hangup-solid' />\n </Button>\n </>\n ) : (\n <MenuButton\n ref={moreActionsButtonRef}\n text={t('actions')}\n iconOnly\n icon='more'\n variant='simple'\n menu={{\n variant: 'flyout',\n items: [\n {\n id: 'conference',\n primary: t('call_panel_conference_call_menu_item'),\n disabled: !onConferenceAction,\n items: [\n {\n id: 'conferenceCallWithInteraction',\n primary: t('call_panel_menu_item_call_with_interaction'),\n onClick: () => setDialogType('conferenceWithInteractions')\n },\n {\n id: 'conferenceCallOnly',\n primary: t('call_panel_menu_item_call_only'),\n onClick: () => setDialogType('conferenceCallOnly')\n }\n ]\n },\n {\n id: 'consult',\n primary: t('call_panel_consult_call_menu_item'),\n disabled: !onConsultAction,\n items: [\n {\n id: 'consultCallWithInteraction',\n primary: t('call_panel_menu_item_call_with_interaction'),\n onClick: () => setDialogType('consultWithInteractions')\n },\n {\n id: 'consultCallOnly',\n primary: t('call_panel_menu_item_call_only'),\n onClick: () => setDialogType('consultCallOnly')\n }\n ]\n },\n {\n id: 'transfer',\n primary: t('call_panel_transfer_call_menu_item'),\n disabled: !onTransferAction,\n items: [\n {\n id: 'transferCallWithInteraction',\n primary: t('call_panel_menu_item_call_with_interaction'),\n onClick: () => setDialogType('transferWithInteractions')\n },\n {\n id: 'transferCallOnly',\n primary: t('call_panel_menu_item_call_only'),\n onClick: () => setDialogType('transferCallOnly')\n }\n ]\n },\n {\n id: 'dtmf',\n primary: t('call_panel_send_dtmf_menu_item'),\n disabled: !onDTMFPress,\n onClick: () => setShowDTMF(true)\n },\n {\n id: 'hang_up',\n primary: t('call_panel_hangup_call_menu_item'),\n disabled: !onEndCall,\n onClick: () => onEndCall?.(callId)\n }\n ]\n }}\n />\n )}\n </Flex>\n ) : (\n <Button\n icon\n variant='simple'\n key='hang_up'\n disabled={!item.onHangUp}\n onClick={() => item.onHangUp?.(callId, item.id)}\n label={t('call_panel_hangup_call_menu_item')}\n >\n <Icon name='phone-hangup-solid' />\n </Button>\n )\n }\n />\n );\n })}\n {onHoldSince !== undefined && (\n <Status as={StyledHoldInfo} variant='pending'>\n {\n t('call_panel_call_on_hold', [\n <StopWatch startTime={onHoldSince} />\n ]) as unknown as string\n }\n </Status>\n )}\n {dialogType && (\n <CallHandoverDialog\n target={moreActionsButtonRef.current}\n type={dialogType}\n transferOptions={transferOptions}\n interactionOptions={interactionOptions}\n onCancel={() => {\n setDialogType(undefined);\n moreActionsButtonRef.current?.focus();\n }}\n onSubmit={transferData => {\n switch (dialogType) {\n case 'conferenceCallOnly':\n case 'conferenceWithInteractions':\n onConferenceAction?.(callId, transferData);\n break;\n case 'consultCallOnly':\n case 'consultWithInteractions':\n onConsultAction?.(callId, transferData);\n break;\n case 'transferCallOnly':\n case 'transferWithInteractions':\n onTransferAction?.(callId, transferData);\n break;\n default:\n }\n setDialogType(undefined);\n moreActionsButtonRef.current?.focus();\n }}\n />\n )}\n {showDTMF && (\n <DialPadDialog\n target={moreActionsButtonRef.current}\n onClose={() => setShowDTMF(false)}\n onDialButtonClick={(key: number) => onDTMFPress?.(callId, String.fromCharCode(key))}\n />\n )}\n </StyledCallContainer>\n );\n};\n\nexport default Call;\n"]}

package/lib/components/CallControlPanel/CallControlPanel.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CallControlPanel.d.ts","sourceRoot":"","sources":["../../../src/components/CallControlPanel/CallControlPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAqC,MAAM,OAAO,CAAC;AAEzF,OAAO,EAQL,YAAY,EASb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAYtE,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,~~CA2J7E~~,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
1	+ {"version":3,"file":"CallControlPanel.d.ts","sourceRoot":"","sources":["../../../src/components/CallControlPanel/CallControlPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAqC,MAAM,OAAO,CAAC;AAEzF,OAAO,EAQL,YAAY,EASb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAYtE,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CAuJ7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/lib/components/CallControlPanel/CallControlPanel.js CHANGED Viewed

@@ -32,7 +32,7 @@ const CallControlPanel = forwardRef(({ heading, userStatus, message, draggable =
     return (_jsx(ContactsContext.Provider, { value: {
             contacts: contactsList,
             onFavoriteToggle
-        }, children: _jsxs(FloatingPanel, { ...restProps, ref: containerRef, draggable: draggable, visible: visible, heading: heading, actions: onAddCall ? [newCallButton] : undefined, children: [_jsxs(CardContent, { container: { itemGap: 2 }, children: [message && _jsx(Banner, { ...message }), interactionTransfer && (_jsx(Banner, { id: 'interaction-transfer', variant: 'info', heading: t('call_panel_interaction_transfer_heading'), onDismiss: interactionTransfer.onCancel, messages: [], action: _jsxs(Flex, { container: true, children: [_jsx(Button, { variant: 'simple', onClick: interactionTransfer.onCancel, children: t('cancel') }), _jsx(Button, { variant: 'primary', onClick: interactionTransfer.onComplete, children: t('call_panel_interaction_transfer_complete_button_label') })] }) })), userStatus ? (_jsxs(Flex, { as: StyledStatusRow, container: { alignItems: 'start', itemGap: 1 }, children: [_jsx(UserStatusIcon, { variant: 'dot', status: selectedStatusOption?.status }), _jsx(Flex, { item: { grow: 1 }, children: _jsx(ComboBox, { label: t('call_panel_agent_status'), labelHidden: true, selected: {
+        }, children: _jsxs(FloatingPanel, { ...restProps, ref: containerRef, draggable: draggable, visible: visible, heading: heading, actions: onAddCall ? [newCallButton] : undefined, children: [_jsxs(CardContent, { container: { itemGap: 2 }, children: [message && _jsx(Banner, { ...message }), interactionTransfer && (_jsxs(Flex, { container: { direction: 'column', gap: 1 }, children: [_jsx(Text, { variant: 'h4', as: 'span', children: t('call_panel_interaction_transfer_heading') }), _jsxs("div", { children: [_jsx(Button, { variant: 'secondary', onClick: interactionTransfer.onCancel, children: t('cancel') }), _jsx(Button, { variant: 'primary', onClick: interactionTransfer.onComplete, children: t('call_panel_interaction_transfer_complete_button_label') })] })] })), userStatus ? (_jsxs(Flex, { as: StyledStatusRow, container: { alignItems: 'start', itemGap: 1 }, children: [_jsx(UserStatusIcon, { variant: 'dot', status: selectedStatusOption?.status }), _jsx(Flex, { item: { grow: 1 }, children: _jsx(ComboBox, { label: t('call_panel_agent_status'), labelHidden: true, selected: {
                                             items: {
                                                 id: userStatus.status,
                                                 text: selectedStatusOption?.label || userStatus.status

package/lib/components/CallControlPanel/CallControlPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CallControlPanel.js","sourceRoot":"","sources":["../../../src/components/CallControlPanel/CallControlPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef, useState } from 'react';\n\nimport {\n CardContent,\n useI18n,\n registerIcon,\n Flex,\n ComboBox,\n Popover,\n useOuterEvent,\n ForwardProps,\n useConsolidatedRef,\n useEscape,\n Button,\n CardHeader,\n Icon,\n Text,\n Banner,\n hasProp\n} from '@pega/cosmos-react-core';\nimport * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';\n\nimport type { CallControlPanelProps } from './CallControlPanel.types';\nimport Call from './Call';\nimport StopWatch from './StopWatch';\nimport { StyledCalleePicker, StyledStatusRow } from './CallControlPanel.styles';\nimport { UserStatusIcon } from './CallControlPanelIcon';\nimport FloatingPanel, { FloatingPanelActionProps } from './FloatingPanel';\nimport { ContactsContext } from './ContactList';\nimport CalleePicker from './ContactList/CalleePicker';\nimport IncomingCall from './IncomingCall';\n\nregisterIcon(plusIcon);\n\nconst CallControlPanel: FunctionComponent<CallControlPanelProps & ForwardProps> = forwardRef(\n (\n {\n heading,\n userStatus,\n message,\n draggable = false,\n calls,\n onAddCall,\n contactsList,\n onFavoriteToggle,\n visible,\n interactionTransfer,\n ...restProps\n }: PropsWithoutRef<CallControlPanelProps>,\n ref: CallControlPanelProps['ref']\n ) => {\n const t = useI18n();\n const newCallButtonRef = useRef<HTMLButtonElement>(null);\n const [showPopover, setShowPopover] = useState(false);\n const containerRef = useConsolidatedRef(ref);\n const popoverRef = useRef<HTMLDivElement>(null);\n\n useOuterEvent('mousedown', [popoverRef], () => {\n setShowPopover(false);\n });\n\n useEscape(() => setShowPopover(false), popoverRef);\n\n const selectedStatusOption = userStatus?.statusOptions.find(s => s.id === userStatus.status);\n\n const newCallButton: FloatingPanelActionProps = {\n id: 'new-call',\n text: t('call_panel_make_new_call'),\n onClick: () => setShowPopover(true),\n icon: 'plus',\n ref: newCallButtonRef\n };\n\n return (\n <ContactsContext.Provider\n value={{\n contacts: contactsList,\n onFavoriteToggle\n }}\n >\n <FloatingPanel\n {...restProps}\n ref={containerRef}\n draggable={draggable}\n visible={visible}\n heading={heading}\n actions={onAddCall ? [newCallButton] : undefined}\n >\n <CardContent container={{ itemGap: 2 }}>\n {message && <Banner {...message} />}\n {interactionTransfer && (\n <Banner\n id='interaction-transfer'\n variant='info'\n heading={t('call_panel_interaction_transfer_heading')}\n onDismiss={interactionTransfer.onCancel}\n messages={[]}\n action={\n <Flex container>\n <Button variant='simple' onClick={interactionTransfer.onCancel}>\n {t('cancel')}\n </Button>\n <Button variant='primary' onClick={interactionTransfer.onComplete}>\n {t('call_panel_interaction_transfer_complete_button_label')}\n </Button>\n </Flex>\n }\n />\n )}\n {userStatus ? (\n <Flex as={StyledStatusRow} container={{ alignItems: 'start', itemGap: 1 }}>\n <UserStatusIcon variant='dot' status={selectedStatusOption?.status} />\n <Flex item={{ grow: 1 }}>\n <ComboBox\n label={t('call_panel_agent_status')}\n labelHidden\n selected={{\n items: {\n id: userStatus.status,\n text: selectedStatusOption?.label \|\| userStatus.status\n }\n }}\n menu={{\n items: userStatus.statusOptions.map(({ id, label, disabled }) => {\n return { id, primary: label, selected: id === userStatus.status, disabled };\n }),\n onItemClick: userStatus.onChange\n }}\n />\n </Flex>\n <StopWatch startTime={userStatus.inStatusSince} />\n </Flex>\n ) : undefined}\n\n {calls.map(callProps =>\n hasProp(callProps, 'onAcceptCall') ? (\n <IncomingCall key={callProps.id} {...callProps} />\n ) : (\n <Call key={callProps.id} {...callProps} />\n )\n )}\n </CardContent>\n {showPopover && (\n <Popover\n target={newCallButtonRef.current}\n ref={popoverRef}\n placement='top-end'\n modifiers={[\n {\n name: 'flip',\n options: {\n fallbackPlacements: ['bottom-end', 'left', 'right']\n }\n }\n ]}\n >\n <StyledCalleePicker>\n <CardHeader\n actions={\n <Button\n icon\n variant='simple'\n aria-label={t('close')}\n onClick={() => setShowPopover(false)}\n >\n <Icon name='times' />\n </Button>\n }\n >\n <Flex container={{ alignItems: 'center', itemGap: 1 }}>\n <Text variant='h3'>{t('call_panel_new_call_heading')}</Text>\n </Flex>\n </CardHeader>\n <CardContent container={{ itemGap: 2 }}>\n <CalleePicker\n variant='action'\n onSelection={phoneNumber => {\n onAddCall?.(phoneNumber);\n setShowPopover(false);\n }}\n />\n </CardContent>\n </StyledCalleePicker>\n </Popover>\n )}\n </FloatingPanel>\n </ContactsContext.Provider>\n );\n }\n);\n\nexport default CallControlPanel;\n"]}
1	+ {"version":3,"file":"CallControlPanel.js","sourceRoot":"","sources":["../../../src/components/CallControlPanel/CallControlPanel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef, useState } from 'react';\n\nimport {\n CardContent,\n useI18n,\n registerIcon,\n Flex,\n ComboBox,\n Popover,\n useOuterEvent,\n ForwardProps,\n useConsolidatedRef,\n useEscape,\n Button,\n CardHeader,\n Icon,\n Text,\n Banner,\n hasProp\n} from '@pega/cosmos-react-core';\nimport * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';\n\nimport type { CallControlPanelProps } from './CallControlPanel.types';\nimport Call from './Call';\nimport StopWatch from './StopWatch';\nimport { StyledCalleePicker, StyledStatusRow } from './CallControlPanel.styles';\nimport { UserStatusIcon } from './CallControlPanelIcon';\nimport FloatingPanel, { FloatingPanelActionProps } from './FloatingPanel';\nimport { ContactsContext } from './ContactList';\nimport CalleePicker from './ContactList/CalleePicker';\nimport IncomingCall from './IncomingCall';\n\nregisterIcon(plusIcon);\n\nconst CallControlPanel: FunctionComponent<CallControlPanelProps & ForwardProps> = forwardRef(\n (\n {\n heading,\n userStatus,\n message,\n draggable = false,\n calls,\n onAddCall,\n contactsList,\n onFavoriteToggle,\n visible,\n interactionTransfer,\n ...restProps\n }: PropsWithoutRef<CallControlPanelProps>,\n ref: CallControlPanelProps['ref']\n ) => {\n const t = useI18n();\n const newCallButtonRef = useRef<HTMLButtonElement>(null);\n const [showPopover, setShowPopover] = useState(false);\n const containerRef = useConsolidatedRef(ref);\n const popoverRef = useRef<HTMLDivElement>(null);\n\n useOuterEvent('mousedown', [popoverRef], () => {\n setShowPopover(false);\n });\n\n useEscape(() => setShowPopover(false), popoverRef);\n\n const selectedStatusOption = userStatus?.statusOptions.find(s => s.id === userStatus.status);\n\n const newCallButton: FloatingPanelActionProps = {\n id: 'new-call',\n text: t('call_panel_make_new_call'),\n onClick: () => setShowPopover(true),\n icon: 'plus',\n ref: newCallButtonRef\n };\n\n return (\n <ContactsContext.Provider\n value={{\n contacts: contactsList,\n onFavoriteToggle\n }}\n >\n <FloatingPanel\n {...restProps}\n ref={containerRef}\n draggable={draggable}\n visible={visible}\n heading={heading}\n actions={onAddCall ? [newCallButton] : undefined}\n >\n <CardContent container={{ itemGap: 2 }}>\n {message && <Banner {...message} />}\n {interactionTransfer && (\n <Flex container={{ direction: 'column', gap: 1 }}>\n <Text variant='h4' as='span'>\n {t('call_panel_interaction_transfer_heading')}\n </Text>\n <div>\n <Button variant='secondary' onClick={interactionTransfer.onCancel}>\n {t('cancel')}\n </Button>\n <Button variant='primary' onClick={interactionTransfer.onComplete}>\n {t('call_panel_interaction_transfer_complete_button_label')}\n </Button>\n </div>\n </Flex>\n )}\n {userStatus ? (\n <Flex as={StyledStatusRow} container={{ alignItems: 'start', itemGap: 1 }}>\n <UserStatusIcon variant='dot' status={selectedStatusOption?.status} />\n <Flex item={{ grow: 1 }}>\n <ComboBox\n label={t('call_panel_agent_status')}\n labelHidden\n selected={{\n items: {\n id: userStatus.status,\n text: selectedStatusOption?.label \|\| userStatus.status\n }\n }}\n menu={{\n items: userStatus.statusOptions.map(({ id, label, disabled }) => {\n return { id, primary: label, selected: id === userStatus.status, disabled };\n }),\n onItemClick: userStatus.onChange\n }}\n />\n </Flex>\n <StopWatch startTime={userStatus.inStatusSince} />\n </Flex>\n ) : undefined}\n\n {calls.map(callProps =>\n hasProp(callProps, 'onAcceptCall') ? (\n <IncomingCall key={callProps.id} {...callProps} />\n ) : (\n <Call key={callProps.id} {...callProps} />\n )\n )}\n </CardContent>\n {showPopover && (\n <Popover\n target={newCallButtonRef.current}\n ref={popoverRef}\n placement='top-end'\n modifiers={[\n {\n name: 'flip',\n options: {\n fallbackPlacements: ['bottom-end', 'left', 'right']\n }\n }\n ]}\n >\n <StyledCalleePicker>\n <CardHeader\n actions={\n <Button\n icon\n variant='simple'\n aria-label={t('close')}\n onClick={() => setShowPopover(false)}\n >\n <Icon name='times' />\n </Button>\n }\n >\n <Flex container={{ alignItems: 'center', itemGap: 1 }}>\n <Text variant='h3'>{t('call_panel_new_call_heading')}</Text>\n </Flex>\n </CardHeader>\n <CardContent container={{ itemGap: 2 }}>\n <CalleePicker\n variant='action'\n onSelection={phoneNumber => {\n onAddCall?.(phoneNumber);\n setShowPopover(false);\n }}\n />\n </CardContent>\n </StyledCalleePicker>\n </Popover>\n )}\n </FloatingPanel>\n </ContactsContext.Provider>\n );\n }\n);\n\nexport default CallControlPanel;\n"]}

package/lib/components/CallControlPanel/CallControlPanel.types.d.ts CHANGED Viewed

@@ -65,7 +65,7 @@ export interface IncomingCallProps {
     /** Callback fired when the user accept the call. */
     onAcceptCall: (id: CallProps['id']) => void;
 }
-export declare type UserAvailabilityStatus = 'available' | 'unavailable' | 'busy' | 'after_work' | 'logout';
+export type UserAvailabilityStatus = 'available' | 'unavailable' | 'busy' | 'after_work' | 'logout';
 export interface UserAvailabilityStatusOption {
     readonly id: string;
     readonly label: string;
@@ -99,7 +99,7 @@ export interface CallControlPanelProps extends BaseProps, NoChildrenProp {
     /**
      * Region for messages: errors, notifications, etc.
      */
-    message?: Pick<BannerProps, 'id' | 'variant' | 'heading' | 'messages' | 'onDismiss'>;
+    message?: Pick<BannerProps, 'variant' | 'messages' | 'onDismiss'>;
     /**
      * List of current calls. Having two or more not declared as "on hold" (onHoldSince defined) means there's
      * a conference call.

package/lib/components/CallControlPanel/CallControlPanel.types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CallControlPanel.types.d.ts","sourceRoot":"","sources":["../../../src/components/CallControlPanel/CallControlPanel.types.ts"],"names":[],"mappings":"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~~oBAAY~~,sBAAsB,GAAG,WAAW,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,QAAQ,CAAC;AAEpG,MAAM,WAAW,4BAA4B;IAC3C,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,MAAM,EAAE,sBAAsB,CAAC;IACxC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,MAAM,WAAW,qBAAsB,SAAQ,SAAS,EAAE,cAAc;IACtE,4BAA4B;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,UAAU,CAAC,EAAE;QACX,aAAa,EAAE,QAAQ,CAAC,4BAA4B,EAAE,CAAC,CAAC;QACxD,2BAA2B;QAC3B,MAAM,EAAE,4BAA4B,CAAC,IAAI,CAAC,CAAC;QAC3C,yDAAyD;QACzD,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;QAC7B;;;WAGG;QACH,QAAQ,EAAE,CAAC,KAAK,EAAE,4BAA4B,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;KAC/D,CAAC;IACF,+CAA+C;IAC/C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,~~IAAI,GAAG,~~SAAS,GAAG,~~SAAS,GAAG,~~UAAU,GAAG,WAAW,CAAC,CAAC;~~IACrF~~;;;OAGG;IACH,KAAK,EAAE,CAAC,SAAS,GAAG,iBAAiB,CAAC,EAAE,CAAC;IACzC;;;OAGG;IACH,SAAS,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C;;OAEG;IACH,mBAAmB,CAAC,EAAE,uBAAuB,CAAC;IAC9C,oCAAoC;IACpC,YAAY,EAAE,OAAO,EAAE,CAAC;IACxB,kEAAkE;IAClE,gBAAgB,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACnE,qCAAqC;IACrC,OAAO,CAAC,EAAE,kBAAkB,CAAC,SAAS,CAAC,CAAC;IACxC,uCAAuC;IACvC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}
1	+ {"version":3,"file":"CallControlPanel.types.d.ts","sourceRoot":"","sources":["../../../src/components/CallControlPanel/CallControlPanel.types.ts"],"names":[],"mappings":"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"}

package/lib/components/CallControlPanel/CallControlPanel.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CallControlPanel.types.js","sourceRoot":"","sources":["../../../src/components/CallControlPanel/CallControlPanel.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Ref } from 'react';\n\nimport type { BannerProps, BaseProps, NoChildrenProp } from '@pega/cosmos-react-core';\n\nimport type { FloatingPanelProps } from './FloatingPanel';\nimport { Contact } from './ContactList/ContactList.types';\nimport type { TransferData, TransferReasonOption } from './CallHandover';\n\nexport interface CallParticipant {\n /** Caller id. /\n id: string;\n /* Caller's name. /\n name: string;\n /* Additional caller's info. /\n info?: string;\n /* Callback fired when the user ends the call. /\n onHangUp?: (id: CallProps['id'], participantId: CallParticipant['id']) => void;\n}\n\nexport interface CallProps {\n /* Call identifier. /\n id: string;\n /* Timestamp when the call has begun. /\n startedAt: number \| Date;\n /* Timestamp when the call has been put on hold. /\n onHoldSince?: number \| Date;\n /* SLA configuration timeups. Array of numbers of seconds after which the particular SLA level\n * time is up.\n /\n slaConfig?: number[];\n /* Call participants. /\n participants: CallParticipant[];\n /* The flag whether the mic is muted on this call. /\n muted?: boolean;\n /* Callback fired when 'pause' icon has been clicked. /\n onPauseToggle?: (id: CallProps['id']) => void;\n /* Callback fired when 'mute' icon has been clicked. /\n onMuteToggle: (id: CallProps['id']) => void;\n /* Callback fired when 'Consult' action has been clicked. /\n onConsultAction?: (id: CallProps['id'], transferData: TransferData) => void;\n /* Callback fired when 'Conference' action has been clicked. /\n onConferenceAction?: (id: CallProps['id'], transferData: TransferData) => void;\n /* Callback fired when 'Merge call' action has been chosen. /\n onMergeCall?: (id: CallProps['id']) => void;\n /* Callback fired for every dial pad key press. /\n onDTMFPress?: (id: CallProps['id'], key: string) => void;\n /* Callback fired when 'Transfer' action has been clicked. /\n onTransferAction?: (id: CallProps['id'], transferData: TransferData) => void;\n /* Callback fired when 'Transfer' action has been clicked. /\n onHandOffCall?: (id: CallProps['id']) => void;\n /* Callback fired when the user ends the call. /\n onEndCall?: (id: CallProps['id']) => void;\n /\n Transfer reason options\n /\n transferOptions: Readonly<TransferReasonOption[]>;\n /\n Interaction options\n /\n interactionOptions?: Readonly<TransferReasonOption[]>;\n}\n\nexport interface IncomingCallProps {\n /* Call identifier. /\n id: string;\n /* Call participants. /\n participant: CallParticipant;\n /* Callback fired when the user ends the call. /\n onRejectCall?: (id: CallProps['id']) => void;\n /* Callback fired when the user accept the call. /\n onAcceptCall: (id: CallProps['id']) => void;\n}\n\nexport type UserAvailabilityStatus = 'available' \| 'unavailable' \| 'busy' \| 'after_work' \| 'logout';\n\nexport interface UserAvailabilityStatusOption {\n readonly id: string;\n readonly label: string;\n readonly status: UserAvailabilityStatus;\n readonly disabled?: boolean;\n}\n\nexport interface InteractionTransferData {\n onCancel: () => void;\n onComplete: () => void;\n}\n\nexport interface CallControlPanelProps extends BaseProps, NoChildrenProp {\n /* The heading rendered. /\n heading: string;\n /\n User availability statuses.\n /\n userStatus?: {\n statusOptions: Readonly<UserAvailabilityStatusOption[]>;\n /* User current status. /\n status: UserAvailabilityStatusOption['id'];\n /* Timestamp since the user is in the current status. /\n inStatusSince: number \| Date;\n /\n Callback fired when user changes their status.\n * @param value new chosen status.\n /\n onChange: (value: UserAvailabilityStatusOption['id']) => void;\n };\n /* If true, the component will be draggable /\n draggable?: boolean;\n /\n Region for messages: errors, notifications, etc.\n /\n message?: Pick<BannerProps, '~~id' \| '~~variant' \| '~~heading' \| '~~messages' \| 'onDismiss'>;\n /\n List of current calls. Having two or more not declared as \"on hold\" (onHoldSince defined) means there's\n * a conference call.\n /\n calls: (CallProps \| IncomingCallProps)[];\n /\n Callback fired on new call made by the user. 'Add call' button is not present if callback is not passed.\n * @param phoneNumber the number chosen.\n /\n onAddCall?: (phoneNumber: string) => void;\n /\n Intraction transfer popup options.\n /\n interactionTransfer?: InteractionTransferData;\n /* An array of contacts objects. /\n contactsList: Contact[];\n /* Callback fired on adding/removing contact to/from favorites /\n onFavoriteToggle: (phoneNumber: string, favorite: boolean) => void;\n /* Flag driving panel visibility. /\n visible?: FloatingPanelProps['visible'];\n /* Reference to the root component. */\n ref?: Ref<HTMLDivElement>;\n}\n"]}
1	+ {"version":3,"file":"CallControlPanel.types.js","sourceRoot":"","sources":["../../../src/components/CallControlPanel/CallControlPanel.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Ref } from 'react';\n\nimport type { BannerProps, BaseProps, NoChildrenProp } from '@pega/cosmos-react-core';\n\nimport type { FloatingPanelProps } from './FloatingPanel';\nimport { Contact } from './ContactList/ContactList.types';\nimport type { TransferData, TransferReasonOption } from './CallHandover';\n\nexport interface CallParticipant {\n /** Caller id. /\n id: string;\n /* Caller's name. /\n name: string;\n /* Additional caller's info. /\n info?: string;\n /* Callback fired when the user ends the call. /\n onHangUp?: (id: CallProps['id'], participantId: CallParticipant['id']) => void;\n}\n\nexport interface CallProps {\n /* Call identifier. /\n id: string;\n /* Timestamp when the call has begun. /\n startedAt: number \| Date;\n /* Timestamp when the call has been put on hold. /\n onHoldSince?: number \| Date;\n /* SLA configuration timeups. Array of numbers of seconds after which the particular SLA level\n * time is up.\n /\n slaConfig?: number[];\n /* Call participants. /\n participants: CallParticipant[];\n /* The flag whether the mic is muted on this call. /\n muted?: boolean;\n /* Callback fired when 'pause' icon has been clicked. /\n onPauseToggle?: (id: CallProps['id']) => void;\n /* Callback fired when 'mute' icon has been clicked. /\n onMuteToggle: (id: CallProps['id']) => void;\n /* Callback fired when 'Consult' action has been clicked. /\n onConsultAction?: (id: CallProps['id'], transferData: TransferData) => void;\n /* Callback fired when 'Conference' action has been clicked. /\n onConferenceAction?: (id: CallProps['id'], transferData: TransferData) => void;\n /* Callback fired when 'Merge call' action has been chosen. /\n onMergeCall?: (id: CallProps['id']) => void;\n /* Callback fired for every dial pad key press. /\n onDTMFPress?: (id: CallProps['id'], key: string) => void;\n /* Callback fired when 'Transfer' action has been clicked. /\n onTransferAction?: (id: CallProps['id'], transferData: TransferData) => void;\n /* Callback fired when 'Transfer' action has been clicked. /\n onHandOffCall?: (id: CallProps['id']) => void;\n /* Callback fired when the user ends the call. /\n onEndCall?: (id: CallProps['id']) => void;\n /\n Transfer reason options\n /\n transferOptions: Readonly<TransferReasonOption[]>;\n /\n Interaction options\n /\n interactionOptions?: Readonly<TransferReasonOption[]>;\n}\n\nexport interface IncomingCallProps {\n /* Call identifier. /\n id: string;\n /* Call participants. /\n participant: CallParticipant;\n /* Callback fired when the user ends the call. /\n onRejectCall?: (id: CallProps['id']) => void;\n /* Callback fired when the user accept the call. /\n onAcceptCall: (id: CallProps['id']) => void;\n}\n\nexport type UserAvailabilityStatus = 'available' \| 'unavailable' \| 'busy' \| 'after_work' \| 'logout';\n\nexport interface UserAvailabilityStatusOption {\n readonly id: string;\n readonly label: string;\n readonly status: UserAvailabilityStatus;\n readonly disabled?: boolean;\n}\n\nexport interface InteractionTransferData {\n onCancel: () => void;\n onComplete: () => void;\n}\n\nexport interface CallControlPanelProps extends BaseProps, NoChildrenProp {\n /* The heading rendered. /\n heading: string;\n /\n User availability statuses.\n /\n userStatus?: {\n statusOptions: Readonly<UserAvailabilityStatusOption[]>;\n /* User current status. /\n status: UserAvailabilityStatusOption['id'];\n /* Timestamp since the user is in the current status. /\n inStatusSince: number \| Date;\n /\n Callback fired when user changes their status.\n * @param value new chosen status.\n /\n onChange: (value: UserAvailabilityStatusOption['id']) => void;\n };\n /* If true, the component will be draggable /\n draggable?: boolean;\n /\n Region for messages: errors, notifications, etc.\n /\n message?: Pick<BannerProps, 'variant' \| 'messages' \| 'onDismiss'>;\n /\n List of current calls. Having two or more not declared as \"on hold\" (onHoldSince defined) means there's\n * a conference call.\n /\n calls: (CallProps \| IncomingCallProps)[];\n /\n Callback fired on new call made by the user. 'Add call' button is not present if callback is not passed.\n * @param phoneNumber the number chosen.\n /\n onAddCall?: (phoneNumber: string) => void;\n /\n Intraction transfer popup options.\n /\n interactionTransfer?: InteractionTransferData;\n /* An array of contacts objects. /\n contactsList: Contact[];\n /* Callback fired on adding/removing contact to/from favorites /\n onFavoriteToggle: (phoneNumber: string, favorite: boolean) => void;\n /* Flag driving panel visibility. /\n visible?: FloatingPanelProps['visible'];\n /* Reference to the root component. */\n ref?: Ref<HTMLDivElement>;\n}\n"]}

package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import { FunctionComponent } from 'react';
 import type { TransferData, TransferReasonOption } from './CallHandover.types';
-export declare type HandoverType = 'conference' | 'transferWithInteractions' | 'transferCallOnly' | 'consultWithInteractions' | 'consultCallOnly';
+export type HandoverType = 'conferenceWithInteractions' | 'conferenceCallOnly' | 'transferWithInteractions' | 'transferCallOnly' | 'consultWithInteractions' | 'consultCallOnly';
 export interface CallHandoverDialogProps {
     target: HTMLElement | null;
     type: HandoverType;

package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CallHandoverDialog.d.ts","sourceRoot":"","sources":["../../../../src/components/CallControlPanel/CallHandover/CallHandoverDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAgC,MAAM,OAAO,CAAC;AAkBxE,OAAO,KAAK,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAE/E,~~oBAAY~~,YAAY,GACpB,~~YAAY~~,~~GACZ~~,0BAA0B,GAC1B,kBAAkB,GAClB,yBAAyB,GACzB,iBAAiB,CAAC;AAEtB,MAAM,WAAW,uBAAuB;IACtC,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,IAAI,EAAE,YAAY,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IACvC,eAAe,EAAE,QAAQ,CAAC,oBAAoB,EAAE,CAAC,CAAC;IAClD,kBAAkB,CAAC,EAAE,QAAQ,CAAC,oBAAoB,EAAE,CAAC,CAAC;CACvD;AAED,QAAA,MAAM,kBAAkB,EAAE,iBAAiB,CAAC,uBAAuB,~~CAwHlE~~,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
1	+ {"version":3,"file":"CallHandoverDialog.d.ts","sourceRoot":"","sources":["../../../../src/components/CallControlPanel/CallHandover/CallHandoverDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAgC,MAAM,OAAO,CAAC;AAkBxE,OAAO,KAAK,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAE/E,MAAM,MAAM,YAAY,GACpB,4BAA4B,GAC5B,oBAAoB,GACpB,0BAA0B,GAC1B,kBAAkB,GAClB,yBAAyB,GACzB,iBAAiB,CAAC;AAEtB,MAAM,WAAW,uBAAuB;IACtC,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,IAAI,EAAE,YAAY,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IACvC,eAAe,EAAE,QAAQ,CAAC,oBAAoB,EAAE,CAAC,CAAC;IAClD,kBAAkB,CAAC,EAAE,QAAQ,CAAC,oBAAoB,EAAE,CAAC,CAAC;CACvD;AAED,QAAA,MAAM,kBAAkB,EAAE,iBAAiB,CAAC,uBAAuB,CAqIlE,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/lib/components/CallControlPanel/CallHandover/CallHandoverDialog.js CHANGED Viewed

@@ -14,25 +14,29 @@ const CallHandoverDialog = ({ target, type, onSubmit, onCancel, transferOptions,
     let dialogContent;
     let dialogHeading;
     switch (type) {
-        case 'conference':
+        case 'conferenceCallOnly':
             dialogHeading = t('call_panel_conference_heading');
             dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call', submitButtonText: t('call_panel_conference_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
             break;
+        case 'conferenceWithInteractions':
+            dialogHeading = t('call_panel_conference_call_and_interactions_heading');
+            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call+interaction', submitButtonText: t('call_panel_conference_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            break;
         case 'consultCallOnly':
-            dialogHeading = t('call_panel_consult_with_call_heading');
-            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call', submitButtonText: t('call_panel_consult_call_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            dialogHeading = t('call_panel_consult_heading');
+            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call', submitButtonText: t('call_panel_consult_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
             break;
         case 'consultWithInteractions':
-            dialogHeading = t('call_panel_consult_with_call_and_interactions_heading');
-            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call+interaction', submitButtonText: t('call_panel_consult_call_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            dialogHeading = t('call_panel_consult_call_and_interactions_heading');
+            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call+interaction', submitButtonText: t('call_panel_consult_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
             break;
         case 'transferCallOnly':
-            dialogHeading = t('call_panel_transfer_with_call_heading');
-            dialogContent = (_jsx(CallHandoverForm, { submitButtonText: t('call_panel_transfer_call_submit'), onCancel: onCancel, variant: 'call', onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            dialogHeading = t('call_panel_transfer_heading');
+            dialogContent = (_jsx(CallHandoverForm, { submitButtonText: t('call_panel_transfer_submit'), onCancel: onCancel, variant: 'call', onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
             break;
         case 'transferWithInteractions':
-            dialogHeading = t('call_panel_transfer_with_call_and_interactions_heading');
-            dialogContent = (_jsx(CallHandoverForm, { submitButtonText: t('call_panel_transfer_call_submit'), onCancel: onCancel, variant: 'call+interaction', onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            dialogHeading = t('call_panel_transfer_call_and_interactions_heading');
+            dialogContent = (_jsx(CallHandoverForm, { submitButtonText: t('call_panel_transfer_submit'), onCancel: onCancel, variant: 'call+interaction', onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
             break;
         default:
             dialogHeading = '';