@pega/cosmos-react-demos 4.0.0-dev.8.0 → 4.0.0-dev.8.2

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.
@@ -1 +1 @@
1
- {"version":3,"file":"GalleryPage.stories.d.ts","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAS/C,wBAMU;AAEV,UAAU,eAAe;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,qBAAqB,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,eAAe,CAsC1D,CAAC"}
1
+ {"version":3,"file":"GalleryPage.stories.d.ts","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAS/C,wBAMU;AAEV,UAAU,eAAe;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,qBAAqB,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,eAAe,CA6B1D,CAAC"}
@@ -1,6 +1,6 @@
1
1
  import { action } from '@storybook/addon-actions';
2
2
  import { GalleryPage } from '@pega/cosmos-react-build';
3
- import { AppShellDemo } from '../AppShell/AppShell.stories';
3
+ import { SiteHeaderDemo } from '../SiteHeader/SiteHeader.stories';
4
4
  import { getOverviewCardData } from './GalleryPage.mocks';
5
5
  export default {
6
6
  title: 'Build/GalleryPage',
@@ -20,7 +20,7 @@ export const AppShellWithGalleryPage = (args) => {
20
20
  text: 'New application',
21
21
  onClick: action('Clicked New application button')
22
22
  }} onItemClick={action('Clicked interactive card')}/>);
23
- return (<AppShellDemo main={<GalleryPageDemo {...args}/>} appName='Compass App' text='Launchpad (Main)' showAppNameAndVersion showPreview showBranch/>);
23
+ return <SiteHeaderDemo main={<GalleryPageDemo {...args}/>}/>;
24
24
  };
25
25
  AppShellWithGalleryPage.args = {
26
26
  bannerHeading: 'Applications',
@@ -1 +1 @@
1
- {"version":3,"file":"GalleryPage.stories.jsx","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAE5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAE1D,eAAe;IACb,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACM,CAAC;AAUV,MAAM,CAAC,MAAM,uBAAuB,GAA2B,CAAC,IAAqB,EAAE,EAAE;IACvF,MAAM,eAAe,GAAG,CAAC,EACvB,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,iBAAiB,EACjB,qBAAqB,EACL,EAAE,EAAE,CAAC,CACrB,CAAC,WAAW,CACV,OAAO,CAAC,CAAC,aAAa,CAAC,CACvB,WAAW,CAAC,CAAC,iBAAiB,CAAC,CAC/B,KAAK,CAAC,CAAC;YACL,GAAG,EAAE,kGAAkG;YACvG,GAAG,EAAE,sBAAsB;SAC5B,CAAC,CACF,KAAK,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB,EAAE,CAAC,CACnD,UAAU,CAAC,CAAC;YACV,OAAO,EAAE,iBAAiB;YAC1B,WAAW,EAAE,qBAAqB;SACnC,CAAC,CACF,MAAM,CAAC,CAAC;YACN,IAAI,EAAE,iBAAiB;YACvB,OAAO,EAAE,MAAM,CAAC,gCAAgC,CAAC;SAClD,CAAC,CACF,WAAW,CAAC,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAChD,CACH,CAAC;IAEF,OAAO,CACL,CAAC,YAAY,CACX,IAAI,CAAC,CAAC,CAAC,eAAe,CAAC,IAAI,IAAI,CAAC,EAAG,CAAC,CACpC,OAAO,CAAC,aAAa,CACrB,IAAI,CAAC,kBAAkB,CACvB,qBAAqB,CACrB,WAAW,CACX,UAAU,EACV,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,uBAAuB,CAAC,IAAI,GAAG;IAC7B,aAAa,EAAE,cAAc;IAC7B,iBAAiB,EAAE,iCAAiC;IACpD,cAAc,EAAE,KAAK;IACrB,iBAAiB,EAAE,+BAA+B;IAClD,qBAAqB,EAAE,qEAAqE;CAC7F,CAAC;AAEF,uBAAuB,CAAC,QAAQ,GAAG;IACjC,aAAa,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAC5C,iBAAiB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAChD,cAAc,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAChD,iBAAiB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAChD,qBAAqB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CACrD,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\n\nimport { GalleryPage } from '@pega/cosmos-react-build';\n\nimport { AppShellDemo } from '../AppShell/AppShell.stories';\n\nimport { getOverviewCardData } from './GalleryPage.mocks';\n\nexport default {\n title: 'Build/GalleryPage',\n component: GalleryPage,\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\ninterface GalleryPageArgs {\n bannerHeading: string;\n bannerDescription: string;\n showEmptyState: boolean;\n emptyStateHeading: string;\n emptyStateDescription: string;\n}\n\nexport const AppShellWithGalleryPage: Story<GalleryPageArgs> = (args: GalleryPageArgs) => {\n const GalleryPageDemo = ({\n bannerHeading,\n bannerDescription,\n showEmptyState,\n emptyStateHeading,\n emptyStateDescription\n }: GalleryPageArgs) => (\n <GalleryPage\n heading={bannerHeading}\n description={bannerDescription}\n image={{\n src: 'https://www.pega.com/sites/default/files/styles/2560/public/media/images/2019-01/pega-logo_0.png',\n alt: 'Image for the banner'\n }}\n items={showEmptyState ? [] : getOverviewCardData()}\n emptyState={{\n heading: emptyStateHeading,\n description: emptyStateDescription\n }}\n action={{\n text: 'New application',\n onClick: action('Clicked New application button')\n }}\n onItemClick={action('Clicked interactive card')}\n />\n );\n\n return (\n <AppShellDemo\n main={<GalleryPageDemo {...args} />}\n appName='Compass App'\n text='Launchpad (Main)'\n showAppNameAndVersion\n showPreview\n showBranch\n />\n );\n};\n\nAppShellWithGalleryPage.args = {\n bannerHeading: 'Applications',\n bannerDescription: 'Edit or create new applications',\n showEmptyState: false,\n emptyStateHeading: 'Create your first application',\n emptyStateDescription: \"You're on your way to creating your first professional application.\"\n};\n\nAppShellWithGalleryPage.argTypes = {\n bannerHeading: { control: { type: 'text' } },\n bannerDescription: { control: { type: 'text' } },\n showEmptyState: { control: { type: 'boolean' } },\n emptyStateHeading: { control: { type: 'text' } },\n emptyStateDescription: { control: { type: 'text' } }\n};\n"]}
1
+ {"version":3,"file":"GalleryPage.stories.jsx","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAElE,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAE1D,eAAe;IACb,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACM,CAAC;AAUV,MAAM,CAAC,MAAM,uBAAuB,GAA2B,CAAC,IAAqB,EAAE,EAAE;IACvF,MAAM,eAAe,GAAG,CAAC,EACvB,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,iBAAiB,EACjB,qBAAqB,EACL,EAAE,EAAE,CAAC,CACrB,CAAC,WAAW,CACV,OAAO,CAAC,CAAC,aAAa,CAAC,CACvB,WAAW,CAAC,CAAC,iBAAiB,CAAC,CAC/B,KAAK,CAAC,CAAC;YACL,GAAG,EAAE,kGAAkG;YACvG,GAAG,EAAE,sBAAsB;SAC5B,CAAC,CACF,KAAK,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB,EAAE,CAAC,CACnD,UAAU,CAAC,CAAC;YACV,OAAO,EAAE,iBAAiB;YAC1B,WAAW,EAAE,qBAAqB;SACnC,CAAC,CACF,MAAM,CAAC,CAAC;YACN,IAAI,EAAE,iBAAiB;YACvB,OAAO,EAAE,MAAM,CAAC,gCAAgC,CAAC;SAClD,CAAC,CACF,WAAW,CAAC,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAChD,CACH,CAAC;IAEF,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,eAAe,CAAC,IAAI,IAAI,CAAC,EAAG,CAAC,EAAG,CAAC;AACjE,CAAC,CAAC;AAEF,uBAAuB,CAAC,IAAI,GAAG;IAC7B,aAAa,EAAE,cAAc;IAC7B,iBAAiB,EAAE,iCAAiC;IACpD,cAAc,EAAE,KAAK;IACrB,iBAAiB,EAAE,+BAA+B;IAClD,qBAAqB,EAAE,qEAAqE;CAC7F,CAAC;AAEF,uBAAuB,CAAC,QAAQ,GAAG;IACjC,aAAa,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAC5C,iBAAiB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAChD,cAAc,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAChD,iBAAiB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAChD,qBAAqB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CACrD,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\n\nimport { GalleryPage } from '@pega/cosmos-react-build';\n\nimport { SiteHeaderDemo } from '../SiteHeader/SiteHeader.stories';\n\nimport { getOverviewCardData } from './GalleryPage.mocks';\n\nexport default {\n title: 'Build/GalleryPage',\n component: GalleryPage,\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\ninterface GalleryPageArgs {\n bannerHeading: string;\n bannerDescription: string;\n showEmptyState: boolean;\n emptyStateHeading: string;\n emptyStateDescription: string;\n}\n\nexport const AppShellWithGalleryPage: Story<GalleryPageArgs> = (args: GalleryPageArgs) => {\n const GalleryPageDemo = ({\n bannerHeading,\n bannerDescription,\n showEmptyState,\n emptyStateHeading,\n emptyStateDescription\n }: GalleryPageArgs) => (\n <GalleryPage\n heading={bannerHeading}\n description={bannerDescription}\n image={{\n src: 'https://www.pega.com/sites/default/files/styles/2560/public/media/images/2019-01/pega-logo_0.png',\n alt: 'Image for the banner'\n }}\n items={showEmptyState ? [] : getOverviewCardData()}\n emptyState={{\n heading: emptyStateHeading,\n description: emptyStateDescription\n }}\n action={{\n text: 'New application',\n onClick: action('Clicked New application button')\n }}\n onItemClick={action('Clicked interactive card')}\n />\n );\n\n return <SiteHeaderDemo main={<GalleryPageDemo {...args} />} />;\n};\n\nAppShellWithGalleryPage.args = {\n bannerHeading: 'Applications',\n bannerDescription: 'Edit or create new applications',\n showEmptyState: false,\n emptyStateHeading: 'Create your first application',\n emptyStateDescription: \"You're on your way to creating your first professional application.\"\n};\n\nAppShellWithGalleryPage.argTypes = {\n bannerHeading: { control: { type: 'text' } },\n bannerDescription: { control: { type: 'text' } },\n showEmptyState: { control: { type: 'boolean' } },\n emptyStateHeading: { control: { type: 'text' } },\n emptyStateDescription: { control: { type: 'text' } }\n};\n"]}
@@ -0,0 +1,9 @@
1
+ import { Meta, Story } from '@storybook/react';
2
+ import { SiteHeaderProps } from '@pega/cosmos-react-build';
3
+ declare const _default: Meta<import("@storybook/react").Args>;
4
+ export default _default;
5
+ export interface SiteHeaderStoryProps {
6
+ main?: SiteHeaderProps['main'];
7
+ }
8
+ export declare const SiteHeaderDemo: Story<SiteHeaderStoryProps>;
9
+ //# sourceMappingURL=SiteHeader.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SiteHeader.stories.d.ts","sourceRoot":"","sources":["../../../src/build/SiteHeader/SiteHeader.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAc,eAAe,EAAE,MAAM,0BAA0B,CAAC;;AAGvE,wBAMU;AAEV,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;CAChC;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,oBAAoB,CAsCtD,CAAC"}
@@ -0,0 +1,36 @@
1
+ import { useState } from 'react';
2
+ import { action } from '@storybook/addon-actions';
3
+ import { SiteHeader } from '@pega/cosmos-react-build';
4
+ import { Card, CardContent, Flex, Text } from '@pega/cosmos-react-core';
5
+ export default {
6
+ title: 'Build/SiteHeader',
7
+ component: SiteHeader,
8
+ parameters: {
9
+ layout: 'fullscreen'
10
+ }
11
+ };
12
+ export const SiteHeaderDemo = (args) => {
13
+ const [searchText, setSearchText] = useState('');
14
+ return (<SiteHeader main={args.main || (<Flex container={{ justify: 'center', alignItems: 'center' }} style={{ minHeight: 'inherit' }}>
15
+ <Card>
16
+ <CardContent>
17
+ <Text variant='h2'>This is the main content</Text>
18
+ </CardContent>
19
+ </Card>
20
+ </Flex>)} brand={{
21
+ label: 'Launchpad',
22
+ logo: 'https://www.pega.com/themes/custom/pegawww_theme/images/pega-logo.svg',
23
+ href: '/',
24
+ onClick: e => {
25
+ e.preventDefault();
26
+ action('Navigated to root');
27
+ }
28
+ }} avatar={{
29
+ name: 'Cindy Turner'
30
+ }} search={{
31
+ value: searchText,
32
+ placeholder: 'Search',
33
+ onSearchChange: setSearchText
34
+ }}/>);
35
+ };
36
+ //# sourceMappingURL=SiteHeader.stories.jsx.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SiteHeader.stories.jsx","sourceRoot":"","sources":["../../../src/build/SiteHeader/SiteHeader.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,UAAU,EAAmB,MAAM,0BAA0B,CAAC;AACvE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAExE,eAAe;IACb,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,UAAU;IACrB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACM,CAAC;AAMV,MAAM,CAAC,MAAM,cAAc,GAAgC,CAAC,IAA0B,EAAE,EAAE;IACxF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAEjD,OAAO,CACL,CAAC,UAAU,CACT,IAAI,CAAC,CACH,IAAI,CAAC,IAAI,IAAI,CACX,CAAC,IAAI,CACH,SAAS,CAAC,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,CACvD,KAAK,CAAC,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,CAEhC;YAAA,CAAC,IAAI,CACH;cAAA,CAAC,WAAW,CACV;gBAAA,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,wBAAwB,EAAE,IAAI,CACnD;cAAA,EAAE,WAAW,CACf;YAAA,EAAE,IAAI,CACR;UAAA,EAAE,IAAI,CAAC,CACR,CACF,CACD,KAAK,CAAC,CAAC;YACL,KAAK,EAAE,WAAW;YAClB,IAAI,EAAE,uEAAuE;YAC7E,IAAI,EAAE,GAAG;YACT,OAAO,EAAE,CAAC,CAAC,EAAE;gBACX,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,MAAM,CAAC,mBAAmB,CAAC,CAAC;YAC9B,CAAC;SACF,CAAC,CACF,MAAM,CAAC,CAAC;YACN,IAAI,EAAE,cAAc;SACrB,CAAC,CACF,MAAM,CAAC,CAAC;YACN,KAAK,EAAE,UAAU;YACjB,WAAW,EAAE,QAAQ;YACrB,cAAc,EAAE,aAAa;SAC9B,CAAC,EACF,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useState } from 'react';\nimport { Meta, Story } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\n\nimport { SiteHeader, SiteHeaderProps } from '@pega/cosmos-react-build';\nimport { Card, CardContent, Flex, Text } from '@pega/cosmos-react-core';\n\nexport default {\n title: 'Build/SiteHeader',\n component: SiteHeader,\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\nexport interface SiteHeaderStoryProps {\n main?: SiteHeaderProps['main'];\n}\n\nexport const SiteHeaderDemo: Story<SiteHeaderStoryProps> = (args: SiteHeaderStoryProps) => {\n const [searchText, setSearchText] = useState('');\n\n return (\n <SiteHeader\n main={\n args.main || (\n <Flex\n container={{ justify: 'center', alignItems: 'center' }}\n style={{ minHeight: 'inherit' }}\n >\n <Card>\n <CardContent>\n <Text variant='h2'>This is the main content</Text>\n </CardContent>\n </Card>\n </Flex>\n )\n }\n brand={{\n label: 'Launchpad',\n logo: 'https://www.pega.com/themes/custom/pegawww_theme/images/pega-logo.svg',\n href: '/',\n onClick: e => {\n e.preventDefault();\n action('Navigated to root');\n }\n }}\n avatar={{\n name: 'Cindy Turner'\n }}\n search={{\n value: searchText,\n placeholder: 'Search',\n onSearchChange: setSearchText\n }}\n />\n );\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"GalleryPage.stories.d.ts","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAS/C,wBAMU;AAEV,UAAU,eAAe;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,qBAAqB,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,eAAe,CAsC1D,CAAC"}
1
+ {"version":3,"file":"GalleryPage.stories.d.ts","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAS/C,wBAMU;AAEV,UAAU,eAAe;IACvB,aAAa,EAAE,MAAM,CAAC;IACtB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,qBAAqB,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,eAAe,CA6B1D,CAAC"}
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { action } from '@storybook/addon-actions';
3
3
  import { GalleryPage } from '@pega/cosmos-react-build';
4
- import { AppShellDemo } from '../AppShell/AppShell.stories';
4
+ import { SiteHeaderDemo } from '../SiteHeader/SiteHeader.stories';
5
5
  import { getOverviewCardData } from './GalleryPage.mocks';
6
6
  export default {
7
7
  title: 'Build/GalleryPage',
@@ -21,7 +21,7 @@ export const AppShellWithGalleryPage = (args) => {
21
21
  text: 'New application',
22
22
  onClick: action('Clicked New application button')
23
23
  }, onItemClick: action('Clicked interactive card') }));
24
- return (_jsx(AppShellDemo, { main: _jsx(GalleryPageDemo, { ...args }), appName: 'Compass App', text: 'Launchpad (Main)', showAppNameAndVersion: true, showPreview: true, showBranch: true }));
24
+ return _jsx(SiteHeaderDemo, { main: _jsx(GalleryPageDemo, { ...args }) });
25
25
  };
26
26
  AppShellWithGalleryPage.args = {
27
27
  bannerHeading: 'Applications',
@@ -1 +1 @@
1
- {"version":3,"file":"GalleryPage.stories.js","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAE5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAE1D,eAAe;IACb,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACM,CAAC;AAUV,MAAM,CAAC,MAAM,uBAAuB,GAA2B,CAAC,IAAqB,EAAE,EAAE;IACvF,MAAM,eAAe,GAAG,CAAC,EACvB,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,iBAAiB,EACjB,qBAAqB,EACL,EAAE,EAAE,CAAC,CACrB,KAAC,WAAW,IACV,OAAO,EAAE,aAAa,EACtB,WAAW,EAAE,iBAAiB,EAC9B,KAAK,EAAE;YACL,GAAG,EAAE,kGAAkG;YACvG,GAAG,EAAE,sBAAsB;SAC5B,EACD,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB,EAAE,EAClD,UAAU,EAAE;YACV,OAAO,EAAE,iBAAiB;YAC1B,WAAW,EAAE,qBAAqB;SACnC,EACD,MAAM,EAAE;YACN,IAAI,EAAE,iBAAiB;YACvB,OAAO,EAAE,MAAM,CAAC,gCAAgC,CAAC;SAClD,EACD,WAAW,EAAE,MAAM,CAAC,0BAA0B,CAAC,GAC/C,CACH,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,IACX,IAAI,EAAE,KAAC,eAAe,OAAK,IAAI,GAAI,EACnC,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,kBAAkB,EACvB,qBAAqB,QACrB,WAAW,QACX,UAAU,SACV,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,uBAAuB,CAAC,IAAI,GAAG;IAC7B,aAAa,EAAE,cAAc;IAC7B,iBAAiB,EAAE,iCAAiC;IACpD,cAAc,EAAE,KAAK;IACrB,iBAAiB,EAAE,+BAA+B;IAClD,qBAAqB,EAAE,qEAAqE;CAC7F,CAAC;AAEF,uBAAuB,CAAC,QAAQ,GAAG;IACjC,aAAa,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAC5C,iBAAiB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAChD,cAAc,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAChD,iBAAiB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAChD,qBAAqB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CACrD,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\n\nimport { GalleryPage } from '@pega/cosmos-react-build';\n\nimport { AppShellDemo } from '../AppShell/AppShell.stories';\n\nimport { getOverviewCardData } from './GalleryPage.mocks';\n\nexport default {\n title: 'Build/GalleryPage',\n component: GalleryPage,\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\ninterface GalleryPageArgs {\n bannerHeading: string;\n bannerDescription: string;\n showEmptyState: boolean;\n emptyStateHeading: string;\n emptyStateDescription: string;\n}\n\nexport const AppShellWithGalleryPage: Story<GalleryPageArgs> = (args: GalleryPageArgs) => {\n const GalleryPageDemo = ({\n bannerHeading,\n bannerDescription,\n showEmptyState,\n emptyStateHeading,\n emptyStateDescription\n }: GalleryPageArgs) => (\n <GalleryPage\n heading={bannerHeading}\n description={bannerDescription}\n image={{\n src: 'https://www.pega.com/sites/default/files/styles/2560/public/media/images/2019-01/pega-logo_0.png',\n alt: 'Image for the banner'\n }}\n items={showEmptyState ? [] : getOverviewCardData()}\n emptyState={{\n heading: emptyStateHeading,\n description: emptyStateDescription\n }}\n action={{\n text: 'New application',\n onClick: action('Clicked New application button')\n }}\n onItemClick={action('Clicked interactive card')}\n />\n );\n\n return (\n <AppShellDemo\n main={<GalleryPageDemo {...args} />}\n appName='Compass App'\n text='Launchpad (Main)'\n showAppNameAndVersion\n showPreview\n showBranch\n />\n );\n};\n\nAppShellWithGalleryPage.args = {\n bannerHeading: 'Applications',\n bannerDescription: 'Edit or create new applications',\n showEmptyState: false,\n emptyStateHeading: 'Create your first application',\n emptyStateDescription: \"You're on your way to creating your first professional application.\"\n};\n\nAppShellWithGalleryPage.argTypes = {\n bannerHeading: { control: { type: 'text' } },\n bannerDescription: { control: { type: 'text' } },\n showEmptyState: { control: { type: 'boolean' } },\n emptyStateHeading: { control: { type: 'text' } },\n emptyStateDescription: { control: { type: 'text' } }\n};\n"]}
1
+ {"version":3,"file":"GalleryPage.stories.js","sourceRoot":"","sources":["../../../src/build/PageTemplates/GalleryPage.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAElE,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAE1D,eAAe;IACb,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACM,CAAC;AAUV,MAAM,CAAC,MAAM,uBAAuB,GAA2B,CAAC,IAAqB,EAAE,EAAE;IACvF,MAAM,eAAe,GAAG,CAAC,EACvB,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,iBAAiB,EACjB,qBAAqB,EACL,EAAE,EAAE,CAAC,CACrB,KAAC,WAAW,IACV,OAAO,EAAE,aAAa,EACtB,WAAW,EAAE,iBAAiB,EAC9B,KAAK,EAAE;YACL,GAAG,EAAE,kGAAkG;YACvG,GAAG,EAAE,sBAAsB;SAC5B,EACD,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB,EAAE,EAClD,UAAU,EAAE;YACV,OAAO,EAAE,iBAAiB;YAC1B,WAAW,EAAE,qBAAqB;SACnC,EACD,MAAM,EAAE;YACN,IAAI,EAAE,iBAAiB;YACvB,OAAO,EAAE,MAAM,CAAC,gCAAgC,CAAC;SAClD,EACD,WAAW,EAAE,MAAM,CAAC,0BAA0B,CAAC,GAC/C,CACH,CAAC;IAEF,OAAO,KAAC,cAAc,IAAC,IAAI,EAAE,KAAC,eAAe,OAAK,IAAI,GAAI,GAAI,CAAC;AACjE,CAAC,CAAC;AAEF,uBAAuB,CAAC,IAAI,GAAG;IAC7B,aAAa,EAAE,cAAc;IAC7B,iBAAiB,EAAE,iCAAiC;IACpD,cAAc,EAAE,KAAK;IACrB,iBAAiB,EAAE,+BAA+B;IAClD,qBAAqB,EAAE,qEAAqE;CAC7F,CAAC;AAEF,uBAAuB,CAAC,QAAQ,GAAG;IACjC,aAAa,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAC5C,iBAAiB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAChD,cAAc,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAChD,iBAAiB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAChD,qBAAqB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CACrD,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\n\nimport { GalleryPage } from '@pega/cosmos-react-build';\n\nimport { SiteHeaderDemo } from '../SiteHeader/SiteHeader.stories';\n\nimport { getOverviewCardData } from './GalleryPage.mocks';\n\nexport default {\n title: 'Build/GalleryPage',\n component: GalleryPage,\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\ninterface GalleryPageArgs {\n bannerHeading: string;\n bannerDescription: string;\n showEmptyState: boolean;\n emptyStateHeading: string;\n emptyStateDescription: string;\n}\n\nexport const AppShellWithGalleryPage: Story<GalleryPageArgs> = (args: GalleryPageArgs) => {\n const GalleryPageDemo = ({\n bannerHeading,\n bannerDescription,\n showEmptyState,\n emptyStateHeading,\n emptyStateDescription\n }: GalleryPageArgs) => (\n <GalleryPage\n heading={bannerHeading}\n description={bannerDescription}\n image={{\n src: 'https://www.pega.com/sites/default/files/styles/2560/public/media/images/2019-01/pega-logo_0.png',\n alt: 'Image for the banner'\n }}\n items={showEmptyState ? [] : getOverviewCardData()}\n emptyState={{\n heading: emptyStateHeading,\n description: emptyStateDescription\n }}\n action={{\n text: 'New application',\n onClick: action('Clicked New application button')\n }}\n onItemClick={action('Clicked interactive card')}\n />\n );\n\n return <SiteHeaderDemo main={<GalleryPageDemo {...args} />} />;\n};\n\nAppShellWithGalleryPage.args = {\n bannerHeading: 'Applications',\n bannerDescription: 'Edit or create new applications',\n showEmptyState: false,\n emptyStateHeading: 'Create your first application',\n emptyStateDescription: \"You're on your way to creating your first professional application.\"\n};\n\nAppShellWithGalleryPage.argTypes = {\n bannerHeading: { control: { type: 'text' } },\n bannerDescription: { control: { type: 'text' } },\n showEmptyState: { control: { type: 'boolean' } },\n emptyStateHeading: { control: { type: 'text' } },\n emptyStateDescription: { control: { type: 'text' } }\n};\n"]}
@@ -0,0 +1,9 @@
1
+ import { Meta, Story } from '@storybook/react';
2
+ import { SiteHeaderProps } from '@pega/cosmos-react-build';
3
+ declare const _default: Meta<import("@storybook/react").Args>;
4
+ export default _default;
5
+ export interface SiteHeaderStoryProps {
6
+ main?: SiteHeaderProps['main'];
7
+ }
8
+ export declare const SiteHeaderDemo: Story<SiteHeaderStoryProps>;
9
+ //# sourceMappingURL=SiteHeader.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SiteHeader.stories.d.ts","sourceRoot":"","sources":["../../../src/build/SiteHeader/SiteHeader.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAc,eAAe,EAAE,MAAM,0BAA0B,CAAC;;AAGvE,wBAMU;AAEV,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;CAChC;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,oBAAoB,CAsCtD,CAAC"}
@@ -0,0 +1,31 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useState } from 'react';
3
+ import { action } from '@storybook/addon-actions';
4
+ import { SiteHeader } from '@pega/cosmos-react-build';
5
+ import { Card, CardContent, Flex, Text } from '@pega/cosmos-react-core';
6
+ export default {
7
+ title: 'Build/SiteHeader',
8
+ component: SiteHeader,
9
+ parameters: {
10
+ layout: 'fullscreen'
11
+ }
12
+ };
13
+ export const SiteHeaderDemo = (args) => {
14
+ const [searchText, setSearchText] = useState('');
15
+ return (_jsx(SiteHeader, { main: args.main || (_jsx(Flex, { container: { justify: 'center', alignItems: 'center' }, style: { minHeight: 'inherit' }, children: _jsx(Card, { children: _jsx(CardContent, { children: _jsx(Text, { variant: 'h2', children: "This is the main content" }) }) }) })), brand: {
16
+ label: 'Launchpad',
17
+ logo: 'https://www.pega.com/themes/custom/pegawww_theme/images/pega-logo.svg',
18
+ href: '/',
19
+ onClick: e => {
20
+ e.preventDefault();
21
+ action('Navigated to root');
22
+ }
23
+ }, avatar: {
24
+ name: 'Cindy Turner'
25
+ }, search: {
26
+ value: searchText,
27
+ placeholder: 'Search',
28
+ onSearchChange: setSearchText
29
+ } }));
30
+ };
31
+ //# sourceMappingURL=SiteHeader.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SiteHeader.stories.js","sourceRoot":"","sources":["../../../src/build/SiteHeader/SiteHeader.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,UAAU,EAAmB,MAAM,0BAA0B,CAAC;AACvE,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAExE,eAAe;IACb,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,UAAU;IACrB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACM,CAAC;AAMV,MAAM,CAAC,MAAM,cAAc,GAAgC,CAAC,IAA0B,EAAE,EAAE;IACxF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAEjD,OAAO,CACL,KAAC,UAAU,IACT,IAAI,EACF,IAAI,CAAC,IAAI,IAAI,CACX,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,EACtD,KAAK,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,YAE/B,KAAC,IAAI,cACH,KAAC,WAAW,cACV,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,yCAAgC,GACtC,GACT,GACF,CACR,EAEH,KAAK,EAAE;YACL,KAAK,EAAE,WAAW;YAClB,IAAI,EAAE,uEAAuE;YAC7E,IAAI,EAAE,GAAG;YACT,OAAO,EAAE,CAAC,CAAC,EAAE;gBACX,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,MAAM,CAAC,mBAAmB,CAAC,CAAC;YAC9B,CAAC;SACF,EACD,MAAM,EAAE;YACN,IAAI,EAAE,cAAc;SACrB,EACD,MAAM,EAAE;YACN,KAAK,EAAE,UAAU;YACjB,WAAW,EAAE,QAAQ;YACrB,cAAc,EAAE,aAAa;SAC9B,GACD,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useState } from 'react';\nimport { Meta, Story } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\n\nimport { SiteHeader, SiteHeaderProps } from '@pega/cosmos-react-build';\nimport { Card, CardContent, Flex, Text } from '@pega/cosmos-react-core';\n\nexport default {\n title: 'Build/SiteHeader',\n component: SiteHeader,\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\nexport interface SiteHeaderStoryProps {\n main?: SiteHeaderProps['main'];\n}\n\nexport const SiteHeaderDemo: Story<SiteHeaderStoryProps> = (args: SiteHeaderStoryProps) => {\n const [searchText, setSearchText] = useState('');\n\n return (\n <SiteHeader\n main={\n args.main || (\n <Flex\n container={{ justify: 'center', alignItems: 'center' }}\n style={{ minHeight: 'inherit' }}\n >\n <Card>\n <CardContent>\n <Text variant='h2'>This is the main content</Text>\n </CardContent>\n </Card>\n </Flex>\n )\n }\n brand={{\n label: 'Launchpad',\n logo: 'https://www.pega.com/themes/custom/pegawww_theme/images/pega-logo.svg',\n href: '/',\n onClick: e => {\n e.preventDefault();\n action('Navigated to root');\n }\n }}\n avatar={{\n name: 'Cindy Turner'\n }}\n search={{\n value: searchText,\n placeholder: 'Search',\n onSearchChange: setSearchText\n }}\n />\n );\n};\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-demos",
3
- "version": "4.0.0-dev.8.0",
3
+ "version": "4.0.0-dev.8.2",
4
4
  "author": "Pegasystems",
5
5
  "license": "SEE LICENSE IN LICENSE",
6
6
  "repository": {
@@ -20,14 +20,14 @@
20
20
  "build": "tsc -b"
21
21
  },
22
22
  "dependencies": {
23
- "@pega/cosmos-react-build": "4.0.0-dev.8.0",
24
- "@pega/cosmos-react-condition-builder": "4.0.0-dev.8.0",
25
- "@pega/cosmos-react-core": "4.0.0-dev.8.0",
26
- "@pega/cosmos-react-cs": "4.0.0-dev.8.0",
27
- "@pega/cosmos-react-dnd": "4.0.0-dev.8.0",
28
- "@pega/cosmos-react-rte": "4.0.0-dev.8.0",
29
- "@pega/cosmos-react-social": "4.0.0-dev.8.0",
30
- "@pega/cosmos-react-work": "4.0.0-dev.8.0",
23
+ "@pega/cosmos-react-build": "4.0.0-dev.8.2",
24
+ "@pega/cosmos-react-condition-builder": "4.0.0-dev.8.2",
25
+ "@pega/cosmos-react-core": "4.0.0-dev.8.2",
26
+ "@pega/cosmos-react-cs": "4.0.0-dev.8.2",
27
+ "@pega/cosmos-react-dnd": "4.0.0-dev.8.2",
28
+ "@pega/cosmos-react-rte": "4.0.0-dev.8.2",
29
+ "@pega/cosmos-react-social": "4.0.0-dev.8.2",
30
+ "@pega/cosmos-react-work": "4.0.0-dev.8.2",
31
31
  "@types/emoji-mart": "^3.0.4",
32
32
  "@types/react": "^16.14.24 || ^17.0.38",
33
33
  "@types/react-dom": "^16.9.14 || ^17.0.11",