@pega/cosmos-react-demos 7.11.3 → 7.11.4-10

package/jsx/work/ConfigurableLayout/ConfigurableLayout.styles.js

@@ -1,11 +0,0 @@
-import styled, { css } from 'styled-components';
-export const StyledPlaceholder = styled.div(({ verticalPadding }) => {
-    return css `
-    background: white;
-    border: 0.0625rem black dashed;
-    text-align: center;
-    min-height: 100%;
-    padding: ${`${verticalPadding}rem`} 0;
-  `;
-});
-//# sourceMappingURL=ConfigurableLayout.styles.js.map

package/jsx/work/ConfigurableLayout/ConfigurableLayout.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ConfigurableLayout.styles.js","sourceRoot":"","sources":["../../../src/work/ConfigurableLayout/ConfigurableLayout.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,eAAe,EAA+B,EAAE,EAAE;IAC/F,OAAO,GAAG,CAAA;;;;;eAKG,GAAG,eAAe,KAAK;GACnC,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nexport const StyledPlaceholder = styled.div(({ verticalPadding }: { verticalPadding: number }) => {\n  return css`\n    background: white;\n    border: 0.0625rem black dashed;\n    text-align: center;\n    min-height: 100%;\n    padding: ${`${verticalPadding}rem`} 0;\n  `;\n});\n"]}

package/jsx/work/Confirmation/Confirmation.stories.d.ts

@@ -1,13 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-import type { ConfirmationProps } from '@pega/cosmos-react-work';
-declare const _default: import("@storybook/csf").ComponentAnnotations<import("@storybook/react/dist/types-a5624094").ReactRenderer, import("@storybook/csf").Args>;
-export default _default;
-export interface ConfirmationStoryProps {
-    title: ConfirmationProps['title'];
-    showDetails?: boolean;
-    detailsName?: string;
-    showWhatsNext?: boolean;
-    showTasks?: boolean;
-}
-export declare const ConfirmationDemo: StoryFn<ConfirmationStoryProps>;
-//# sourceMappingURL=Confirmation.stories.d.ts.map

package/jsx/work/Confirmation/Confirmation.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Confirmation.stories.d.ts","sourceRoot":"","sources":["../../../src/work/Confirmation/Confirmation.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAItD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;;AAOjE,wBAGU;AAEV,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,gBAAgB,EAAE,OAAO,CAAC,sBAAsB,CAyC5D,CAAC"}

package/jsx/work/Confirmation/Confirmation.stories.jsx

@@ -1,37 +0,0 @@
-import { useState } from 'react';
-import { Button, Flex } from '@pega/cosmos-react-core';
-import { Confirmation, DetailsList, Details } from '@pega/cosmos-react-work';
-import { mockData } from '../../core/FieldValueList/FieldValueList.mocks';
-import { TasksDemo } from '../Tasks/Tasks.stories';
-import { StyledFlex } from './Confirmation.styles';
-export default {
-    title: 'Work/Confirmation',
-    component: Confirmation
-};
-export const ConfirmationDemo = (args) => {
-    const [showConfirmation, setShowConfirmation] = useState(true);
-    const details = (<Details name={args.detailsName} columns={{
-            a: <DetailsList items={mockData}/>
-        }}/>);
-    return (<Flex as={StyledFlex} container={{ justify: 'center', alignItems: 'center' }}>
-      {showConfirmation && (<Confirmation title={args.title} details={args.showDetails ? details : undefined} whatsNext={args.showWhatsNext
-                ? ['Send references', 'Collect information on the case', 'Prepare a demonstration']
-                : undefined} tasks={args.showTasks ? (<TasksDemo showVisual={false} showViewSelector={false} count={3} openableTasks={false}/>) : undefined} onClose={() => setShowConfirmation(false)}/>)}
-      {!showConfirmation && (<Button onClick={() => setShowConfirmation(true)}>Show confirmation</Button>)}
-    </Flex>);
-};
-ConfirmationDemo.args = {
-    title: 'US-1337 confirmation',
-    showDetails: true,
-    detailsName: 'Case summary',
-    showWhatsNext: true,
-    showTasks: true
-};
-ConfirmationDemo.argTypes = {
-    title: { control: { type: 'text' } },
-    showDetails: { control: { type: 'boolean' } },
-    detailsName: { control: { type: 'text' } },
-    showWhatsNext: { control: { type: 'boolean' } },
-    showTasks: { control: { type: 'boolean' } }
-};
-//# sourceMappingURL=Confirmation.stories.jsx.map

package/jsx/work/Confirmation/Confirmation.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"Confirmation.stories.jsx","sourceRoot":"","sources":["../../../src/work/Confirmation/Confirmation.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGjC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAG7E,OAAO,EAAE,QAAQ,EAAE,MAAM,gDAAgD,CAAC;AAC1E,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAEnD,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,eAAe;IACb,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,YAAY;CAChB,CAAC;AAUV,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,IAA4B,EAAE,EAAE;IAChG,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAE/D,MAAM,OAAO,GAAG,CACd,CAAC,OAAO,CACN,IAAI,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CACvB,OAAO,CAAC,CAAC;YACP,CAAC,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,EAAG;SACpC,CAAC,EACF,CACH,CAAC;IAEF,OAAO,CACL,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,UAAU,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,CAC3E;MAAA,CAAC,gBAAgB,IAAI,CACnB,CAAC,YAAY,CACX,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,OAAO,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAChD,SAAS,CAAC,CACR,IAAI,CAAC,aAAa;gBAChB,CAAC,CAAC,CAAC,iBAAiB,EAAE,iCAAiC,EAAE,yBAAyB,CAAC;gBACnF,CAAC,CAAC,SAAS,CACd,CACD,KAAK,CAAC,CACJ,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CACf,CAAC,SAAS,CACR,UAAU,CAAC,CAAC,KAAK,CAAC,CAClB,gBAAgB,CAAC,CAAC,KAAK,CAAC,CACxB,KAAK,CAAC,CAAC,CAAC,CAAC,CACT,aAAa,CAAC,CAAC,KAAK,CAAC,EACrB,CACH,CAAC,CAAC,CAAC,SAAS,CACd,CACD,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC,EAC1C,CACH,CACD;MAAA,CAAC,CAAC,gBAAgB,IAAI,CACpB,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAC7E,CACH;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,gBAAgB,CAAC,IAAI,GAAG;IACtB,KAAK,EAAE,sBAAsB;IAC7B,WAAW,EAAE,IAAI;IACjB,WAAW,EAAE,cAAc;IAC3B,aAAa,EAAE,IAAI;IACnB,SAAS,EAAE,IAAI;CAChB,CAAC;AAEF,gBAAgB,CAAC,QAAQ,GAAG;IAC1B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACpC,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC7C,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAC1C,aAAa,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC/C,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CAC5C,CAAC","sourcesContent":["import { useState } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\n\nimport { Button, Flex } from '@pega/cosmos-react-core';\nimport { Confirmation, DetailsList, Details } from '@pega/cosmos-react-work';\nimport type { ConfirmationProps } from '@pega/cosmos-react-work';\n\nimport { mockData } from '../../core/FieldValueList/FieldValueList.mocks';\nimport { TasksDemo } from '../Tasks/Tasks.stories';\n\nimport { StyledFlex } from './Confirmation.styles';\n\nexport default {\n  title: 'Work/Confirmation',\n  component: Confirmation\n} as Meta;\n\nexport interface ConfirmationStoryProps {\n  title: ConfirmationProps['title'];\n  showDetails?: boolean;\n  detailsName?: string;\n  showWhatsNext?: boolean;\n  showTasks?: boolean;\n}\n\nexport const ConfirmationDemo: StoryFn<ConfirmationStoryProps> = (args: ConfirmationStoryProps) => {\n  const [showConfirmation, setShowConfirmation] = useState(true);\n\n  const details = (\n    <Details\n      name={args.detailsName}\n      columns={{\n        a: <DetailsList items={mockData} />\n      }}\n    />\n  );\n\n  return (\n    <Flex as={StyledFlex} container={{ justify: 'center', alignItems: 'center' }}>\n      {showConfirmation && (\n        <Confirmation\n          title={args.title}\n          details={args.showDetails ? details : undefined}\n          whatsNext={\n            args.showWhatsNext\n              ? ['Send references', 'Collect information on the case', 'Prepare a demonstration']\n              : undefined\n          }\n          tasks={\n            args.showTasks ? (\n              <TasksDemo\n                showVisual={false}\n                showViewSelector={false}\n                count={3}\n                openableTasks={false}\n              />\n            ) : undefined\n          }\n          onClose={() => setShowConfirmation(false)}\n        />\n      )}\n      {!showConfirmation && (\n        <Button onClick={() => setShowConfirmation(true)}>Show confirmation</Button>\n      )}\n    </Flex>\n  );\n};\n\nConfirmationDemo.args = {\n  title: 'US-1337 confirmation',\n  showDetails: true,\n  detailsName: 'Case summary',\n  showWhatsNext: true,\n  showTasks: true\n};\n\nConfirmationDemo.argTypes = {\n  title: { control: { type: 'text' } },\n  showDetails: { control: { type: 'boolean' } },\n  detailsName: { control: { type: 'text' } },\n  showWhatsNext: { control: { type: 'boolean' } },\n  showTasks: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/work/Confirmation/Confirmation.styles.d.ts

@@ -1,2 +0,0 @@
-export declare const StyledFlex: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-//# sourceMappingURL=Confirmation.styles.d.ts.map

package/jsx/work/Confirmation/Confirmation.styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Confirmation.styles.d.ts","sourceRoot":"","sources":["../../../src/work/Confirmation/Confirmation.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,yGAItB,CAAC"}

package/jsx/work/Confirmation/Confirmation.styles.js

@@ -1,7 +0,0 @@
-import styled from 'styled-components';
-export const StyledFlex = styled.div `
-  article {
-    width: 100%;
-  }
-`;
-//# sourceMappingURL=Confirmation.styles.js.map

package/jsx/work/Confirmation/Confirmation.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Confirmation.styles.js","sourceRoot":"","sources":["../../../src/work/Confirmation/Confirmation.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAInC,CAAC","sourcesContent":["import styled from 'styled-components';\n\nexport const StyledFlex = styled.div`\n  article {\n    width: 100%;\n  }\n`;\n"]}

package/jsx/work/Details/Details.stories.d.ts

@@ -1,10 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-declare const _default: import("@storybook/csf").ComponentAnnotations<import("@storybook/react/dist/types-a5624094").ReactRenderer, import("@storybook/csf").Args>;
-export default _default;
-interface DetailsDemoProps {
-    description?: string;
-    collapsible?: boolean;
-    showAdditionalInfo?: boolean;
-}
-export declare const DetailsDemo: StoryFn<DetailsDemoProps>;
-//# sourceMappingURL=Details.stories.d.ts.map

package/jsx/work/Details/Details.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Details.stories.d.ts","sourceRoot":"","sources":["../../../src/work/Details/Details.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;;AAOtD,wBAcU;AAEV,UAAU,gBAAgB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,WAAW,EAAE,OAAO,CAAC,gBAAgB,CA6XjD,CAAC"}

package/jsx/work/Details/Details.stories.jsx

@@ -1,214 +0,0 @@
-import { useMemo } from 'react';
-import { Flex, Link, FieldValueItem, useBreakpoint } from '@pega/cosmos-react-core';
-import { Details, DetailsContext, DetailsList } from '@pega/cosmos-react-work';
-import { TableDemo } from '../../core/Table/Table.stories';
-export default {
-    title: 'Work/Details',
-    component: Details,
-    args: {
-        description: 'Pellentesque pharetra justo augue, non maximus nulla venenatis et. Sed laoreet ultricies ullamcorper. Mauris ac nulla quis ipsum semper fringilla in eget risus. Fusce cursus sollicitudin nibh molestie volutpat.',
-        collapsible: false,
-        showAdditionalInfo: false
-    },
-    argTypes: {
-        description: { control: { type: 'text' } },
-        collapsible: { control: { type: 'boolean' } },
-        showAdditionalInfo: { control: { type: 'boolean' } }
-    }
-};
-export const DetailsDemo = (args) => {
-    const isNotMobile = useBreakpoint('sm');
-    const longestInlineLabel = 'Trim with a longer label';
-    const longestLabelLength = longestInlineLabel.split(' ').join('').length;
-    const ctx = useMemo(() => ({
-        mobileView: !isNotMobile,
-        longestLabelLength
-    }), [isNotMobile]);
-    return (<DetailsContext.Provider value={ctx}>
-      <Details name='Upper list' highlightedData={[
-            <FieldValueItem variant='stacked' name='Age' value='56'/>,
-            <FieldValueItem variant='stacked' name='Location' value='Berlin'/>,
-            <FieldValueItem variant='stacked' name='Make' value='Ford'/>,
-            <FieldValueItem variant='stacked' name='Model' value='F150'/>
-        ]} description={args.description} collapsible={args.collapsible} additionalInfo={args.showAdditionalInfo
-            ? {
-                content: (<Flex container={{ direction: 'column', alignItems: 'start', gap: 2 }}>
-                    <p>
-                      Lorem ipsum dolor sit amet, consectetur it, sed do tempor incididunt ut labore
-                      magna aliqua. Nibh praesent tristique magna sit amet. Nec tincidunt praesent
-                      semper feugiat nibh sed pulvinar proin gravida.
-                    </p>
-                    <p>
-                      Pharetra pharetra massa massa ultricies mi quis hendrerit dolor. Est velit
-                      egestas dui id ornare arcu odio ut. Varius sit amet mattis vulputate enim
-                      nulla aliquet porttitor lacus.
-                    </p>
-                    <Link href='/' target='_blank'>
-                      Neque vitae
-                    </Link>
-                  </Flex>)
-            }
-            : undefined} columns={{
-            a: (<>
-              <Details name='One Column' columns={{
-                    a: (<Details description='Two column with no headings.' columns={{
-                            a: (<Details columns={{
-                                    a: (<DetailsList items={[
-                                            { name: 'Year', value: '2021' },
-                                            { name: 'Owners', value: '2' }
-                                        ]}/>)
-                                }}/>),
-                            b: (<Details columns={{
-                                    a: (<DetailsList items={[
-                                            { name: 'Transmission', value: 'Automatic' },
-                                            { name: 'Drivetrain', value: 'AWD' }
-                                        ]}/>)
-                                }}/>)
-                        }}/>)
-                }} collapsible/>
-
-              <Details description='Two Column with some description and no top heading.' columns={{
-                    a: (<Details name='First Column' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Make', value: 'Ford' },
-                                    { name: 'Model', value: 'F150' }
-                                ]}/>)
-                        }}/>),
-                    b: (<Details name='Second Column' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Mileage', value: '78,500' },
-                                    { name: 'Trim', value: 'Lariat' }
-                                ]}/>)
-                        }}/>)
-                }}/>
-
-              <Details name='Three Column' description='Text telling you what you are looking at or why it is relevant.' columns={{
-                    a: (<Details name='First Column' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Make', value: 'Ford' },
-                                    { name: 'Model', value: 'F150' }
-                                ]}/>)
-                        }}/>),
-                    b: (<Details description='Column with no heading but some description.' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Mileage', value: '78,500' },
-                                    { name: longestInlineLabel, value: 'Lariat' }
-                                ]}/>)
-                        }}/>),
-                    c: (<Details name='Third Column' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Mileage', value: '78,500' },
-                                    { name: 'Trim', value: 'Lariat' }
-                                ]}/>)
-                        }}/>)
-                }}/>
-
-              <Details name='Wide Narrow' arrangement='wideNarrow' columns={{
-                    a: <Details name='Wide Column' columns={{ a: <TableDemo /> }}/>,
-                    b: (<Details name='Narrow Column' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Mileage', value: '78,500' },
-                                    { name: 'Trim', value: 'Lariat' }
-                                ]}/>)
-                        }}/>)
-                }}/>
-
-              <Details name='Narrow Wide' arrangement='narrowWide' columns={{
-                    a: (<Details name='Narrow Column' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Mileage', value: '78,500' },
-                                    { name: 'Trim', value: 'Lariat' }
-                                ]}/>)
-                        }}/>),
-                    b: <Details name='Wide Column' columns={{ a: <TableDemo /> }}/>
-                }}/>
-
-              <Details name='Table' columns={{ a: <TableDemo /> }}/>
-
-              <Details name='Nested List 1 Column' columns={{
-                    a: (<>
-                      <Details name='First Child' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Year', value: '2021' },
-                                    { name: 'Owners', value: '2' }
-                                ]}/>)
-                        }}/>
-
-                      <Details name='Second Child' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Transmission', value: 'Automatic' },
-                                    { name: 'Drivetrain', value: 'AWD' }
-                                ]}/>)
-                        }}/>
-                    </>)
-                }}/>
-
-              <Details columns={{
-                    a: (<>
-                      <DetailsList items={[
-                            {
-                                name: 'Description',
-                                variant: 'stacked',
-                                value: (<p>
-                                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
-                                commodo nulla vitae mi bibendum, a fringilla nisl efficitur.
-                                Praesent vitae nulla lobortis, finibus felis ultricies, fermentum
-                                mi. Nunc lorem ligula, placerat nec elit id, auctor pellentesque
-                                est. Pellentesque pharetra justo augue, non maximus nulla venenatis
-                                et. Sed laoreet ultricies ullamcorper. Mauris ac nulla quis ipsum
-                                semper fringilla in eget risus. Fusce cursus sollicitudin nibh
-                                molestie volutpat.
-                              </p>)
-                            },
-                            { name: 'Keys', value: '3' }
-                        ]}/>
-
-                      <Details name='Nested' columns={{
-                            a: (<>
-                              <DetailsList items={[
-                                    { name: 'First name', value: 'Howard' },
-                                    { name: 'Last name', value: 'Kennedy' }
-                                ]}/>
-
-                              <Details name='Further Nested List' columns={{
-                                    a: (<DetailsList items={[
-                                            { name: 'Color', value: 'Red' },
-                                            { name: 'Tires', value: 'Firestone all weather' }
-                                        ]}/>)
-                                }}/>
-                            </>)
-                        }}/>
-
-                      <Details name='Value comparison' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Open', value: '$405.00' },
-                                    { name: 'Close', value: '$401.00' },
-                                    { name: '52 week high', value: '$446.00' },
-                                    { name: '52 week low', value: '$335.00' },
-                                    { name: 'Total number of active shares', value: '567,000.00' }
-                                ]} valueComparison/>)
-                        }}/>
-
-                      <Details name='Collapsible' columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Open', value: '$405.00' },
-                                    { name: 'Close', value: '$401.00' },
-                                    { name: '52 week high', value: '$446.00' },
-                                    { name: '52 week low', value: '$335.00' },
-                                    { name: 'Total number of active shares', value: '567,000.00' }
-                                ]} valueComparison/>)
-                        }} collapsible/>
-
-                      <Details columns={{
-                            a: (<DetailsList items={[
-                                    { name: 'Age', value: '56' },
-                                    { name: 'Location', value: 'Berlin PA' }
-                                ]}/>)
-                        }}/>
-                    </>)
-                }}/>
-            </>)
-        }}/>
-    </DetailsContext.Provider>);
-};
-//# sourceMappingURL=Details.stories.jsx.map

package/jsx/work/Details/Details.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"Details.stories.jsx","sourceRoot":"","sources":["../../../src/work/Details/Details.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\n\nimport { Flex, Link, FieldValueItem, useBreakpoint } from '@pega/cosmos-react-core';\nimport { Details, DetailsContext, DetailsList } from '@pega/cosmos-react-work';\n\nimport { TableDemo } from '../../core/Table/Table.stories';\n\nexport default {\n  title: 'Work/Details',\n  component: Details,\n  args: {\n    description:\n      'Pellentesque pharetra justo augue, non maximus nulla venenatis et. Sed laoreet ultricies ullamcorper. Mauris ac nulla quis ipsum semper fringilla in eget risus. Fusce cursus sollicitudin nibh molestie volutpat.',\n    collapsible: false,\n    showAdditionalInfo: false\n  },\n  argTypes: {\n    description: { control: { type: 'text' } },\n    collapsible: { control: { type: 'boolean' } },\n    showAdditionalInfo: { control: { type: 'boolean' } }\n  }\n} as Meta;\n\ninterface DetailsDemoProps {\n  description?: string;\n  collapsible?: boolean;\n  showAdditionalInfo?: boolean;\n}\n\nexport const DetailsDemo: StoryFn<DetailsDemoProps> = (args: DetailsDemoProps) => {\n  const isNotMobile = useBreakpoint('sm');\n  const longestInlineLabel = 'Trim with a longer label';\n  const longestLabelLength = longestInlineLabel.split(' ').join('').length;\n\n  const ctx = useMemo(\n    () => ({\n      mobileView: !isNotMobile,\n      longestLabelLength\n    }),\n    [isNotMobile]\n  );\n\n  return (\n    <DetailsContext.Provider value={ctx}>\n      <Details\n        name='Upper list'\n        highlightedData={[\n          <FieldValueItem variant='stacked' name='Age' value='56' />,\n          <FieldValueItem variant='stacked' name='Location' value='Berlin' />,\n          <FieldValueItem variant='stacked' name='Make' value='Ford' />,\n          <FieldValueItem variant='stacked' name='Model' value='F150' />\n        ]}\n        description={args.description}\n        collapsible={args.collapsible}\n        additionalInfo={\n          args.showAdditionalInfo\n            ? {\n                content: (\n                  <Flex container={{ direction: 'column', alignItems: 'start', gap: 2 }}>\n                    <p>\n                      Lorem ipsum dolor sit amet, consectetur it, sed do tempor incididunt ut labore\n                      magna aliqua. Nibh praesent tristique magna sit amet. Nec tincidunt praesent\n                      semper feugiat nibh sed pulvinar proin gravida.\n                    </p>\n                    <p>\n                      Pharetra pharetra massa massa ultricies mi quis hendrerit dolor. Est velit\n                      egestas dui id ornare arcu odio ut. Varius sit amet mattis vulputate enim\n                      nulla aliquet porttitor lacus.\n                    </p>\n                    <Link href='/' target='_blank'>\n                      Neque vitae\n                    </Link>\n                  </Flex>\n                )\n              }\n            : undefined\n        }\n        columns={{\n          a: (\n            <>\n              <Details\n                name='One Column'\n                columns={{\n                  a: (\n                    <Details\n                      description='Two column with no headings.'\n                      columns={{\n                        a: (\n                          <Details\n                            columns={{\n                              a: (\n                                <DetailsList\n                                  items={[\n                                    { name: 'Year', value: '2021' },\n                                    { name: 'Owners', value: '2' }\n                                  ]}\n                                />\n                              )\n                            }}\n                          />\n                        ),\n                        b: (\n                          <Details\n                            columns={{\n                              a: (\n                                <DetailsList\n                                  items={[\n                                    { name: 'Transmission', value: 'Automatic' },\n                                    { name: 'Drivetrain', value: 'AWD' }\n                                  ]}\n                                />\n                              )\n                            }}\n                          />\n                        )\n                      }}\n                    />\n                  )\n                }}\n                collapsible\n              />\n\n              <Details\n                description='Two Column with some description and no top heading.'\n                columns={{\n                  a: (\n                    <Details\n                      name='First Column'\n                      columns={{\n                        a: (\n                          <DetailsList\n                            items={[\n                              { name: 'Make', value: 'Ford' },\n                              { name: 'Model', value: 'F150' }\n                            ]}\n                          />\n                        )\n                      }}\n                    />\n                  ),\n                  b: (\n                    <Details\n                      name='Second Column'\n                      columns={{\n                        a: (\n                          <DetailsList\n                            items={[\n                              { name: 'Mileage', value: '78,500' },\n                              { name: 'Trim', value: 'Lariat' }\n                            ]}\n                          />\n                        )\n                      }}\n                    />\n                  )\n                }}\n              />\n\n              <Details\n                name='Three Column'\n                description='Text telling you what you are looking at or why it is relevant.'\n                columns={{\n                  a: (\n                    <Details\n                      name='First Column'\n                      columns={{\n                        a: (\n                          <DetailsList\n                            items={[\n                              { name: 'Make', value: 'Ford' },\n                              { name: 'Model', value: 'F150' }\n                            ]}\n                          />\n                        )\n                      }}\n                    />\n                  ),\n                  b: (\n                    <Details\n                      description='Column with no heading but some description.'\n                      columns={{\n                        a: (\n                          <DetailsList\n                            items={[\n                              { name: 'Mileage', value: '78,500' },\n                              { name: longestInlineLabel, value: 'Lariat' }\n                            ]}\n                          />\n                        )\n                      }}\n                    />\n                  ),\n                  c: (\n                    <Details\n                      name='Third Column'\n                      columns={{\n                        a: (\n                          <DetailsList\n                            items={[\n                              { name: 'Mileage', value: '78,500' },\n                              { name: 'Trim', value: 'Lariat' }\n                            ]}\n                          />\n                        )\n                      }}\n                    />\n                  )\n                }}\n              />\n\n              <Details\n                name='Wide Narrow'\n                arrangement='wideNarrow'\n                columns={{\n                  a: <Details name='Wide Column' columns={{ a: <TableDemo /> }} />,\n                  b: (\n                    <Details\n                      name='Narrow Column'\n                      columns={{\n                        a: (\n                          <DetailsList\n                            items={[\n                              { name: 'Mileage', value: '78,500' },\n                              { name: 'Trim', value: 'Lariat' }\n                            ]}\n                          />\n                        )\n                      }}\n                    />\n                  )\n                }}\n              />\n\n              <Details\n                name='Narrow Wide'\n                arrangement='narrowWide'\n                columns={{\n                  a: (\n                    <Details\n                      name='Narrow Column'\n                      columns={{\n                        a: (\n                          <DetailsList\n                            items={[\n                              { name: 'Mileage', value: '78,500' },\n                              { name: 'Trim', value: 'Lariat' }\n                            ]}\n                          />\n                        )\n                      }}\n                    />\n                  ),\n                  b: <Details name='Wide Column' columns={{ a: <TableDemo /> }} />\n                }}\n              />\n\n              <Details name='Table' columns={{ a: <TableDemo /> }} />\n\n              <Details\n                name='Nested List 1 Column'\n                columns={{\n                  a: (\n                    <>\n                      <Details\n                        name='First Child'\n                        columns={{\n                          a: (\n                            <DetailsList\n                              items={[\n                                { name: 'Year', value: '2021' },\n                                { name: 'Owners', value: '2' }\n                              ]}\n                            />\n                          )\n                        }}\n                      />\n\n                      <Details\n                        name='Second Child'\n                        columns={{\n                          a: (\n                            <DetailsList\n                              items={[\n                                { name: 'Transmission', value: 'Automatic' },\n                                { name: 'Drivetrain', value: 'AWD' }\n                              ]}\n                            />\n                          )\n                        }}\n                      />\n                    </>\n                  )\n                }}\n              />\n\n              <Details\n                columns={{\n                  a: (\n                    <>\n                      <DetailsList\n                        items={[\n                          {\n                            name: 'Description',\n                            variant: 'stacked',\n                            value: (\n                              <p>\n                                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse\n                                commodo nulla vitae mi bibendum, a fringilla nisl efficitur.\n                                Praesent vitae nulla lobortis, finibus felis ultricies, fermentum\n                                mi. Nunc lorem ligula, placerat nec elit id, auctor pellentesque\n                                est. Pellentesque pharetra justo augue, non maximus nulla venenatis\n                                et. Sed laoreet ultricies ullamcorper. Mauris ac nulla quis ipsum\n                                semper fringilla in eget risus. Fusce cursus sollicitudin nibh\n                                molestie volutpat.\n                              </p>\n                            )\n                          },\n                          { name: 'Keys', value: '3' }\n                        ]}\n                      />\n\n                      <Details\n                        name='Nested'\n                        columns={{\n                          a: (\n                            <>\n                              <DetailsList\n                                items={[\n                                  { name: 'First name', value: 'Howard' },\n                                  { name: 'Last name', value: 'Kennedy' }\n                                ]}\n                              />\n\n                              <Details\n                                name='Further Nested List'\n                                columns={{\n                                  a: (\n                                    <DetailsList\n                                      items={[\n                                        { name: 'Color', value: 'Red' },\n                                        { name: 'Tires', value: 'Firestone all weather' }\n                                      ]}\n                                    />\n                                  )\n                                }}\n                              />\n                            </>\n                          )\n                        }}\n                      />\n\n                      <Details\n                        name='Value comparison'\n                        columns={{\n                          a: (\n                            <DetailsList\n                              items={[\n                                { name: 'Open', value: '$405.00' },\n                                { name: 'Close', value: '$401.00' },\n                                { name: '52 week high', value: '$446.00' },\n                                { name: '52 week low', value: '$335.00' },\n                                { name: 'Total number of active shares', value: '567,000.00' }\n                              ]}\n                              valueComparison\n                            />\n                          )\n                        }}\n                      />\n\n                      <Details\n                        name='Collapsible'\n                        columns={{\n                          a: (\n                            <DetailsList\n                              items={[\n                                { name: 'Open', value: '$405.00' },\n                                { name: 'Close', value: '$401.00' },\n                                { name: '52 week high', value: '$446.00' },\n                                { name: '52 week low', value: '$335.00' },\n                                { name: 'Total number of active shares', value: '567,000.00' }\n                              ]}\n                              valueComparison\n                            />\n                          )\n                        }}\n                        collapsible\n                      />\n\n                      <Details\n                        columns={{\n                          a: (\n                            <DetailsList\n                              items={[\n                                { name: 'Age', value: '56' },\n                                { name: 'Location', value: 'Berlin PA' }\n                              ]}\n                            />\n                          )\n                        }}\n                      />\n                    </>\n                  )\n                }}\n              />\n            </>\n          )\n        }}\n      />\n    </DetailsContext.Provider>\n  );\n};\n"]}

package/jsx/work/GenAICoach/GenAICoach.mocks.d.ts

@@ -1,22 +0,0 @@
-import type { GenAIMessageProps, UserMessageProps, MessageProps, CoachMessageProps } from '@pega/cosmos-react-work';
-export declare const coachOptionsMock: {
-    id: string;
-    primary: string;
-    secondary: string[];
-    selected: boolean;
-}[];
-export declare const genAICoachMessageMockData: GenAIMessageProps[];
-export declare const StyledCoachName: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const userMessageMockData: UserMessageProps;
-export declare const initialSuggestedMessagesMockData: MessageProps[];
-export declare const suggestionsMock: {
-    id: string;
-    label: string;
-    items: {
-        id: string;
-        primary: string;
-    }[];
-}[];
-export declare const starterMessageMock: CoachMessageProps;
-export declare const StyledContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-//# sourceMappingURL=GenAICoach.mocks.d.ts.map

package/jsx/work/GenAICoach/GenAICoach.mocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"GenAICoach.mocks.d.ts","sourceRoot":"","sources":["../../../src/work/GenAICoach/GenAICoach.mocks.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EACV,iBAAiB,EACjB,gBAAgB,EAChB,YAAY,EACZ,iBAAiB,EAClB,MAAM,yBAAyB,CAAC;AAEjC,eAAO,MAAM,gBAAgB;;;;;GAmB5B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,iBAAiB,EAyCxD,CAAC;AAEF,eAAO,MAAM,eAAe,yGAM1B,CAAC;AAIH,eAAO,MAAM,mBAAmB,EAAE,gBAIjC,CAAC;AAEF,eAAO,MAAM,gCAAgC,EAAE,YAAY,EAiB1D,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;GAmB3B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,iBAMhC,CAAC;AAEF,eAAO,MAAM,eAAe,yGAE3B,CAAC"}

package/jsx/work/GenAICoach/GenAICoach.mocks.js

@@ -1,124 +0,0 @@
-import styled, { css } from 'styled-components';
-import { action } from '@storybook/addon-actions';
-import { createUID, defaultThemeProp } from '@pega/cosmos-react-core';
-export const coachOptionsMock = [
-    {
-        id: createUID(),
-        primary: 'Pega GenAI™ Coach',
-        secondary: ['Description'],
-        selected: true
-    },
-    {
-        id: createUID(),
-        primary: 'Pega GenAI™ Coach 2',
-        secondary: ['Description'],
-        selected: false
-    },
-    {
-        id: createUID(),
-        primary: 'Pega GenAI™ Coach 3',
-        secondary: ['Description'],
-        selected: false
-    }
-];
-export const genAICoachMessageMockData = [
-    {
-        from: 'coach',
-        id: createUID(),
-        coachName: 'Pega Gen AI™ coach',
-        message: 'Good morning **Captain**. Welcome to the claims management application. I see there is a new claim by Natalie portman to process today. Shall we process?',
-        suggestions: [
-            {
-                id: createUID(),
-                message: 'How can I close this task?'
-            },
-            {
-                id: createUID(),
-                message: 'How can I create a case?'
-            },
-            {
-                id: createUID(),
-                message: 'How can I extend an application to mobile channel?'
-            },
-            {
-                id: createUID(),
-                message: "What's the process of establishing a REST connection?"
-            }
-        ],
-        onSend: ({ id, message }) => {
-            action(': message')(message, id);
-        }
-    },
-    {
-        from: 'coach',
-        id: createUID(),
-        coachName: 'Pega Gen AI™ coach',
-        message: 'Certainly! Here are the detailed steps for the sales team to focus on over the next week:\n\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\n 2. **Engage with the Client:**\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\n 3. **Determine the Sales Team:** \n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\n\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\n 2. **Engage with the Client:**\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\n 3. **Determine the Sales Team:** \n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\n\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\n 2. **Engage with the Client:**\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\n 3. **Determine the Sales Team:** \n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\n\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\n 2. **Engage with the Client:**\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\n 3. **Determine the Sales Team:** \n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\n\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\n 2. **Engage with the Client:**\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\n 3. **Determine the Sales Team:** \n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\n\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\n 2. **Engage with the Client:**\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\n 3. **Determine the Sales Team:** \n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\n\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\n 2. **Engage with the Client:**\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\n 3. **Determine the Sales Team:** \n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\n\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\n 2. **Engage with the Client:**\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\n 3. **Determine the Sales Team:** \n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\n\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\n 2. **Engage with the Client:**\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\n 3. **Determine the Sales Team:** \n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers.'
-    },
-    {
-        from: 'user',
-        id: 'user_message',
-        message: 'How can I initiate an **email conversation**?'
-    }
-];
-export const StyledCoachName = styled.div(({ theme }) => {
-    return css `
-    width: 25rem;
-    background-color: ${theme.base.palette['primary-background']};
-    padding: ${theme.base.spacing};
-  `;
-});
-StyledCoachName.defaultProps = defaultThemeProp;
-export const userMessageMockData = {
-    from: 'user',
-    id: 'user message',
-    message: 'How do I create a phone interaction?'
-};
-export const initialSuggestedMessagesMockData = [
-    {
-        id: createUID(),
-        message: 'What are the different types of rules instances?'
-    },
-    {
-        id: createUID(),
-        message: 'What are the different types of rules instances?'
-    },
-    {
-        id: createUID(),
-        message: 'What are the different types of rules instances?'
-    },
-    {
-        id: createUID(),
-        message: 'What are the different types of rules instances?'
-    }
-];
-export const suggestionsMock = [
-    {
-        id: 'Pega GenAI™ Coach suggestions',
-        label: 'Pega GenAI™ Coach suggestions',
-        items: [
-            {
-                id: createUID(),
-                primary: 'How well is the team following the sales methodology?'
-            },
-            {
-                id: createUID(),
-                primary: 'Are there any risks with this opportunity?​'
-            },
-            {
-                id: createUID(),
-                primary: 'How can I help the team progress this deal?​'
-            }
-        ]
-    }
-];
-export const starterMessageMock = {
-    id: createUID(),
-    from: 'coach',
-    coachName: 'Pega GenAI™ Coach',
-    message: "Hi, I am Sales Coach. I'm here to help you sharpen your sales skills and boost your performance. Whether you're a seasoned sales professional or just starting out, I can provide tips, strategies, and answers to your questions to help you close more deals and achieve your goals. To get started, you can either select a conversation starter from the options or type your question or topic manually. I'm here to support you every step of the way!"
-};
-export const StyledContainer = styled.div `
-  width: 25rem;
-`;
-//# sourceMappingURL=GenAICoach.mocks.js.map

package/jsx/work/GenAICoach/GenAICoach.mocks.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"GenAICoach.mocks.js","sourceRoot":"","sources":["../../../src/work/GenAICoach/GenAICoach.mocks.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { action } from '@storybook/addon-actions';\n\nimport { createUID, defaultThemeProp } from '@pega/cosmos-react-core';\nimport type {\n  GenAIMessageProps,\n  UserMessageProps,\n  MessageProps,\n  CoachMessageProps\n} from '@pega/cosmos-react-work';\n\nexport const coachOptionsMock = [\n  {\n    id: createUID(),\n    primary: 'Pega GenAI™ Coach',\n    secondary: ['Description'],\n    selected: true\n  },\n  {\n    id: createUID(),\n    primary: 'Pega GenAI™ Coach 2',\n    secondary: ['Description'],\n    selected: false\n  },\n  {\n    id: createUID(),\n    primary: 'Pega GenAI™ Coach 3',\n    secondary: ['Description'],\n    selected: false\n  }\n];\n\nexport const genAICoachMessageMockData: GenAIMessageProps[] = [\n  {\n    from: 'coach',\n    id: createUID(),\n    coachName: 'Pega Gen AI™ coach',\n    message:\n      'Good morning **Captain**. Welcome to the claims management application. I see there is a new claim by Natalie portman to process today. Shall we process?',\n    suggestions: [\n      {\n        id: createUID(),\n        message: 'How can I close this task?'\n      },\n      {\n        id: createUID(),\n        message: 'How can I create a case?'\n      },\n      {\n        id: createUID(),\n        message: 'How can I extend an application to mobile channel?'\n      },\n      {\n        id: createUID(),\n        message: \"What's the process of establishing a REST connection?\"\n      }\n    ],\n    onSend: ({ id, message }) => {\n      action(': message')(message, id);\n    }\n  },\n  {\n    from: 'coach',\n    id: createUID(),\n    coachName: 'Pega Gen AI™ coach',\n    message:\n      'Certainly! Here are the detailed steps for the sales team to focus on over the next week:\\n\\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\\n 2. **Engage with the Client:**\\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\\n 3. **Determine the Sales Team:** \\n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\\n\\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\\n 2. **Engage with the Client:**\\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\\n 3. **Determine the Sales Team:** \\n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\\n\\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\\n 2. **Engage with the Client:**\\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\\n 3. **Determine the Sales Team:** \\n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\\n\\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\\n 2. **Engage with the Client:**\\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\\n 3. **Determine the Sales Team:** \\n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\\n\\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\\n 2. **Engage with the Client:**\\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\\n 3. **Determine the Sales Team:** \\n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\\n\\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\\n 2. **Engage with the Client:**\\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\\n 3. **Determine the Sales Team:** \\n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\\n\\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\\n 2. **Engage with the Client:**\\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\\n 3. **Determine the Sales Team:** \\n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\\n\\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\\n 2. **Engage with the Client:**\\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\\n 3. **Determine the Sales Team:** \\n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers. Certainly! Here are the detailed steps for the sales team to focus on over the next week:\\n\\n1. **Identify Competition:** - Research Competitors: Conduct thorough research to identify the main competitors in the market offering similar Business Voice over IP (VoIP) solutions. This could involve using industry reports, online resources, and competitor analysis tools.\\n 2. **Engage with the Client:**\\n Schedule a meeting with the key contacts at Seagate to discuss their specific requirements and preferences for the Business Voice over IP (VoIP) solution. This meeting could be conducted in person or virtually, depending on the client availability.\\n 3. **Determine the Sales Team:** \\n Determine the key stakeholders within the sales team who will be involved in the proposal development and decision-making process. This could include sales representatives, solution architects, and sales managers.'\n  },\n  {\n    from: 'user',\n    id: 'user_message',\n    message: 'How can I initiate an **email conversation**?'\n  }\n];\n\nexport const StyledCoachName = styled.div(({ theme }) => {\n  return css`\n    width: 25rem;\n    background-color: ${theme.base.palette['primary-background']};\n    padding: ${theme.base.spacing};\n  `;\n});\n\nStyledCoachName.defaultProps = defaultThemeProp;\n\nexport const userMessageMockData: UserMessageProps = {\n  from: 'user',\n  id: 'user message',\n  message: 'How do I create a phone interaction?'\n};\n\nexport const initialSuggestedMessagesMockData: MessageProps[] = [\n  {\n    id: createUID(),\n    message: 'What are the different types of rules instances?'\n  },\n  {\n    id: createUID(),\n    message: 'What are the different types of rules instances?'\n  },\n  {\n    id: createUID(),\n    message: 'What are the different types of rules instances?'\n  },\n  {\n    id: createUID(),\n    message: 'What are the different types of rules instances?'\n  }\n];\n\nexport const suggestionsMock = [\n  {\n    id: 'Pega GenAI™ Coach suggestions',\n    label: 'Pega GenAI™ Coach suggestions',\n    items: [\n      {\n        id: createUID(),\n        primary: 'How well is the team following the sales methodology?'\n      },\n      {\n        id: createUID(),\n        primary: 'Are there any risks with this opportunity?​'\n      },\n      {\n        id: createUID(),\n        primary: 'How can I help the team progress this deal?​'\n      }\n    ]\n  }\n];\n\nexport const starterMessageMock: CoachMessageProps = {\n  id: createUID(),\n  from: 'coach',\n  coachName: 'Pega GenAI™ Coach',\n  message:\n    \"Hi, I am Sales Coach. I'm here to help you sharpen your sales skills and boost your performance. Whether you're a seasoned sales professional or just starting out, I can provide tips, strategies, and answers to your questions to help you close more deals and achieve your goals. To get started, you can either select a conversation starter from the options or type your question or topic manually. I'm here to support you every step of the way!\"\n};\n\nexport const StyledContainer = styled.div`\n  width: 25rem;\n`;\n"]}

package/jsx/work/GenAICoach/GenAICoach.stories.d.ts

@@ -1,19 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-declare const _default: import("@storybook/csf").ComponentAnnotations<import("@storybook/react/dist/types-a5624094").ReactRenderer, import("@storybook/csf").Args>;
-export default _default;
-interface GenAiCoachDemoProps {
-    showStarterMessage?: boolean;
-    showMessageLoading?: boolean;
-    showErrorInMessage?: boolean;
-    showError?: boolean;
-    guidedMode?: boolean;
-}
-export declare const GenAICoachDemo: StoryFn<GenAiCoachDemoProps>;
-interface GenAICoachMessageDemoProps {
-    from?: 'coach' | 'user';
-    showMessageLoading?: boolean;
-    showErrorInMessage?: boolean;
-    showSuggestions?: boolean;
-}
-export declare const GenAICoachMessageDemo: StoryFn<GenAICoachMessageDemoProps>;
-//# sourceMappingURL=GenAICoach.stories.d.ts.map

package/jsx/work/GenAICoach/GenAICoach.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"GenAICoach.stories.d.ts","sourceRoot":"","sources":["../../../src/work/GenAICoach/GenAICoach.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;;AAiBtD,wBAGU;AAEV,UAAU,mBAAmB;IAC3B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,cAAc,EAAE,OAAO,CAAC,mBAAmB,CA4FvD,CAAC;AAkBF,UAAU,0BAA0B;IAClC,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,qBAAqB,EAAE,OAAO,CAAC,0BAA0B,CA2BrE,CAAC"}