@pega/cosmos-react-demos 2.0.0

package/lib/core/Badges/Alert.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, Story } from '@storybook/react';
+import { AlertProps } from '@pega/cosmos-react-core';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const AlertBadge: Story<AlertProps>;
+//# sourceMappingURL=Alert.stories.d.ts.map

package/lib/core/Badges/Alert.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Badges/Alert.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAS,UAAU,EAAE,MAAM,yBAAyB,CAAC;;AAE5D,wBAGU;AAEV,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,UAAU,CAExC,CAAC"}

package/lib/core/Badges/Alert.stories.jsx

@@ -0,0 +1,15 @@
+import { Alert } from '@pega/cosmos-react-core';
+export default {
+    title: 'Core/Badges/Alert',
+    component: Alert
+};
+export const AlertBadge = (args) => {
+    return <Alert variant={args.variant}/>;
+};
+AlertBadge.args = {
+    variant: 'success'
+};
+AlertBadge.argTypes = {
+    variant: { options: ['success', 'urgent'], control: { type: 'select' } }
+};
+//# sourceMappingURL=Alert.stories.jsx.map

package/lib/core/Badges/Alert.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.stories.jsx","sourceRoot":"","sources":["../../../src/core/Badges/Alert.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAc,MAAM,yBAAyB,CAAC;AAE5D,eAAe;IACb,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,KAAK;CACT,CAAC;AAEV,MAAM,CAAC,MAAM,UAAU,GAAsB,CAAC,IAAgB,EAAE,EAAE;IAChE,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,EAAG,CAAC;AAC1C,CAAC,CAAC;AAEF,UAAU,CAAC,IAAI,GAAG;IAChB,OAAO,EAAE,SAAS;CACnB,CAAC;AAEF,UAAU,CAAC,QAAQ,GAAG;IACpB,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;CACzE,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Alert, AlertProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Badges/Alert',\n  component: Alert\n} as Meta;\n\nexport const AlertBadge: Story<AlertProps> = (args: AlertProps) => {\n  return <Alert variant={args.variant} />;\n};\n\nAlertBadge.args = {\n  variant: 'success'\n};\n\nAlertBadge.argTypes = {\n  variant: { options: ['success', 'urgent'], control: { type: 'select' } }\n};\n"]}

package/lib/core/Badges/Count.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, Story } from '@storybook/react';
+import { CountProps } from '@pega/cosmos-react-core';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const CountBadge: Story<CountProps>;
+//# sourceMappingURL=Count.stories.d.ts.map

package/lib/core/Badges/Count.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Count.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Badges/Count.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAS,UAAU,EAAE,MAAM,yBAAyB,CAAC;;AAE5D,wBAGU;AAEV,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,UAAU,CAExC,CAAC"}

package/lib/core/Badges/Count.stories.jsx

@@ -0,0 +1,20 @@
+import { Count } from '@pega/cosmos-react-core';
+export default {
+    title: 'Core/Badges/Count',
+    component: Count
+};
+export const CountBadge = (args) => {
+    return <Count variant={args.variant}>{args.children}</Count>;
+};
+CountBadge.args = {
+    children: 3,
+    variant: 'default'
+};
+CountBadge.argTypes = {
+    children: { control: { type: 'number' } },
+    variant: {
+        options: ['default', 'interactive', 'inverted', 'urgent'],
+        control: { type: 'select' }
+    }
+};
+//# sourceMappingURL=Count.stories.jsx.map

package/lib/core/Badges/Count.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Count.stories.jsx","sourceRoot":"","sources":["../../../src/core/Badges/Count.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAc,MAAM,yBAAyB,CAAC;AAE5D,eAAe;IACb,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,KAAK;CACT,CAAC;AAEV,MAAM,CAAC,MAAM,UAAU,GAAsB,CAAC,IAAgB,EAAE,EAAE;IAChE,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,CAAC;AAC/D,CAAC,CAAC;AAEF,UAAU,CAAC,IAAI,GAAG;IAChB,QAAQ,EAAE,CAAC;IACX,OAAO,EAAE,SAAS;CACnB,CAAC;AAEF,UAAU,CAAC,QAAQ,GAAG;IACpB,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IACzC,OAAO,EAAE;QACP,OAAO,EAAE,CAAC,SAAS,EAAE,aAAa,EAAE,UAAU,EAAE,QAAQ,CAAC;QACzD,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;KAC5B;CACF,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Count, CountProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Badges/Count',\n  component: Count\n} as Meta;\n\nexport const CountBadge: Story<CountProps> = (args: CountProps) => {\n  return <Count variant={args.variant}>{args.children}</Count>;\n};\n\nCountBadge.args = {\n  children: 3,\n  variant: 'default'\n};\n\nCountBadge.argTypes = {\n  children: { control: { type: 'number' } },\n  variant: {\n    options: ['default', 'interactive', 'inverted', 'urgent'],\n    control: { type: 'select' }\n  }\n};\n"]}

package/lib/core/Badges/Selection.stories.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const SelectableBadge: () => JSX.Element;
+//# sourceMappingURL=Selection.stories.d.ts.map

package/lib/core/Badges/Selection.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Selection.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Badges/Selection.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;;AAIxC,wBAGU;AAEV,eAAO,MAAM,eAAe,mBAE3B,CAAC"}

package/lib/core/Badges/Selection.stories.jsx

@@ -0,0 +1,9 @@
+import { Selectable } from '@pega/cosmos-react-core';
+export default {
+    title: 'Core/Badges/Selectable',
+    component: Selectable
+};
+export const SelectableBadge = () => {
+    return <Selectable id='selectable'>Selectable</Selectable>;
+};
+//# sourceMappingURL=Selection.stories.jsx.map

package/lib/core/Badges/Selection.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Selection.stories.jsx","sourceRoot":"","sources":["../../../src/core/Badges/Selection.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAErD,eAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,UAAU;CACd,CAAC;AAEV,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,EAAE;IAClC,OAAO,CAAC,UAAU,CAAC,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;AAC7D,CAAC,CAAC","sourcesContent":["import { Meta } from '@storybook/react';\n\nimport { Selectable } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Badges/Selectable',\n  component: Selectable\n} as Meta;\n\nexport const SelectableBadge = () => {\n  return <Selectable id='selectable'>Selectable</Selectable>;\n};\n"]}

package/lib/core/Badges/Status.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, Story } from '@storybook/react';
+import { StatusProps } from '@pega/cosmos-react-core';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const StatusBadge: Story<StatusProps>;
+//# sourceMappingURL=Status.stories.d.ts.map

package/lib/core/Badges/Status.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Status.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Badges/Status.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAU,WAAW,EAAE,MAAM,yBAAyB,CAAC;;AAE9D,wBAGU;AAEV,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,WAAW,CAE1C,CAAC"}

package/lib/core/Badges/Status.stories.jsx

@@ -0,0 +1,18 @@
+import { Status } from '@pega/cosmos-react-core';
+export default {
+    component: Status,
+    title: 'Core/Badges/Status'
+};
+export const StatusBadge = (args) => {
+    return <Status variant={args.variant}>{args.variant}</Status>;
+};
+StatusBadge.args = {
+    variant: 'success'
+};
+StatusBadge.argTypes = {
+    variant: {
+        options: ['success', 'urgent', 'warn', 'pending', 'info'],
+        control: { type: 'select' }
+    }
+};
+//# sourceMappingURL=Status.stories.jsx.map

package/lib/core/Badges/Status.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Status.stories.jsx","sourceRoot":"","sources":["../../../src/core/Badges/Status.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAe,MAAM,yBAAyB,CAAC;AAE9D,eAAe;IACb,SAAS,EAAE,MAAM;IACjB,KAAK,EAAE,oBAAoB;CACpB,CAAC;AAEV,MAAM,CAAC,MAAM,WAAW,GAAuB,CAAC,IAAiB,EAAE,EAAE;IACnE,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC,CAAC;AAChE,CAAC,CAAC;AAEF,WAAW,CAAC,IAAI,GAAG;IACjB,OAAO,EAAE,SAAS;CACnB,CAAC;AAEF,WAAW,CAAC,QAAQ,GAAG;IACrB,OAAO,EAAE;QACP,OAAO,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,CAAC;QACzD,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;KAC5B;CACF,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Status, StatusProps } from '@pega/cosmos-react-core';\n\nexport default {\n  component: Status,\n  title: 'Core/Badges/Status'\n} as Meta;\n\nexport const StatusBadge: Story<StatusProps> = (args: StatusProps) => {\n  return <Status variant={args.variant}>{args.variant}</Status>;\n};\n\nStatusBadge.args = {\n  variant: 'success'\n};\n\nStatusBadge.argTypes = {\n  variant: {\n    options: ['success', 'urgent', 'warn', 'pending', 'info'],\n    control: { type: 'select' }\n  }\n};\n"]}

package/lib/core/Badges/Tag.stories.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const TagBadge: () => JSX.Element;
+//# sourceMappingURL=Tag.stories.d.ts.map

package/lib/core/Badges/Tag.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Badges/Tag.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;;AAIxC,wBAGU;AAEV,eAAO,MAAM,QAAQ,mBAEpB,CAAC"}

package/lib/core/Badges/Tag.stories.jsx

@@ -0,0 +1,9 @@
+import { Tag } from '@pega/cosmos-react-core';
+export default {
+    title: 'Core/Badges/Tag',
+    component: Tag
+};
+export const TagBadge = () => {
+    return <Tag>#PegaCosmos</Tag>;
+};
+//# sourceMappingURL=Tag.stories.jsx.map

package/lib/core/Badges/Tag.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.stories.jsx","sourceRoot":"","sources":["../../../src/core/Badges/Tag.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAE9C,eAAe;IACb,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,GAAG;CACP,CAAC;AAEV,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,EAAE;IAC3B,OAAO,CAAC,GAAG,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;AAChC,CAAC,CAAC","sourcesContent":["import { Meta } from '@storybook/react';\n\nimport { Tag } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Badges/Tag',\n  component: Tag\n} as Meta;\n\nexport const TagBadge = () => {\n  return <Tag>#PegaCosmos</Tag>;\n};\n"]}

package/lib/core/Banner/Banner.stories.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const SuccessBanner: () => JSX.Element;
+export declare const ErrorBanner: () => JSX.Element;
+export declare const WarningBanner: () => JSX.Element;
+export declare const InfoBanner: () => JSX.Element;
+export declare const ShownInForm: () => JSX.Element;
+export declare const ShownInCaseView: {
+    (): JSX.Element;
+    parameters: {
+        layout: string;
+    };
+};
+export declare const ShownInAppShell: {
+    (): JSX.Element;
+    parameters: {
+        layout: string;
+    };
+};
+//# sourceMappingURL=Banner.stories.d.ts.map

package/lib/core/Banner/Banner.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Banner/Banner.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;;AAOxC,wBAGU;AAEV,eAAO,MAAM,aAAa,mBAiBzB,CAAC;AAEF,eAAO,MAAM,WAAW,mBAcvB,CAAC;AAEF,eAAO,MAAM,aAAa,mBAazB,CAAC;AAEF,eAAO,MAAM,UAAU,mBAkBtB,CAAC;AA0DF,eAAO,MAAM,WAAW,mBA6DvB,CAAC;AAKF,eAAO,MAAM,eAAe;;;;;CAiB3B,CAAC;AASF,eAAO,MAAM,eAAe;;;;;CAsB3B,CAAC"}

package/lib/core/Banner/Banner.stories.jsx

@@ -0,0 +1,125 @@
+import { useState, useCallback, useReducer } from 'react';
+import { Banner, Button, Form, Input, Link } from '@pega/cosmos-react-core';
+import { AppShellDemo } from '@pega/cosmos-react-demos/lib/core/AppShell/AppShell.stories';
+import { CaseViewDemo } from '@pega/cosmos-react-demos/lib/work/CaseView/CaseView.stories';
+export default {
+    title: 'Core/Banner',
+    component: Banner
+};
+export const SuccessBanner = () => {
+    const [showBanner, setShowBanner] = useState(true);
+    return (<>
+      {!showBanner && <Button onClick={() => setShowBanner(true)}>Open banner</Button>}
+      {showBanner && (<Banner id='success' variant='success' onDismiss={() => setShowBanner(false)} heading='2 items uploaded successfully' messages={['pega_data.json', 'business-earnings.xlsx']}/>)}
+    </>);
+};
+export const ErrorBanner = () => {
+    return (<Banner id='error' variant='urgent' heading='Error' action={<div>
+          <Button variant='link'>Try again</Button>
+        </div>} messages={['Your request failed to send!', 'Please review your request and try again']}/>);
+};
+export const WarningBanner = () => {
+    return (<Banner id='warning' variant='warning' action={<div>
+          <Button variant='link'>Why this matters</Button>
+        </div>} messages={['Your submission is missing some important documents.']}/>);
+};
+export const InfoBanner = () => {
+    const [showBanner, setShowBanner] = useState(true);
+    return (<>
+      {!showBanner && <Button onClick={() => setShowBanner(true)}>Open banner</Button>}
+      {showBanner && (<Banner id='info' variant='info' onDismiss={() => setShowBanner(false)} messages={[
+                'US-123456 is currently being modified by Jane Smith and may not be edited simultaneously.'
+            ]}/>)}
+    </>);
+};
+const demoFields = [
+    {
+        name: 'field-1',
+        label: 'Field 1',
+        info: 'Hint: type exact label text above',
+        value: '',
+        validator: (value) => value === 'Field 1'
+    },
+    {
+        name: 'field-2',
+        label: 'Field 2',
+        info: 'Hint: type exact label text above',
+        value: '',
+        validator: (value) => value === 'Field 2'
+    },
+    {
+        name: 'field-3',
+        label: 'Field 3',
+        info: 'Hint: type exact label text above',
+        value: '',
+        validator: (value) => value === 'Field 3'
+    }
+];
+const formActions = (<>
+    <Button name='Cancel' variant='secondary'>
+      Cancel
+    </Button>
+    <Button name='Submit' type='submit' variant='primary'>
+      Submit
+    </Button>
+  </>);
+const fieldReducer = (fields, inputEl) => {
+    return fields.map(field => {
+        if (inputEl.name === field.name) {
+            field.value = inputEl.value;
+        }
+        return field;
+    });
+};
+export const ShownInForm = () => {
+    const [fields, setField] = useReducer(fieldReducer, demoFields);
+    const [banner, setBanner] = useState();
+    const onSubmit = useCallback((e) => {
+        e.preventDefault();
+        const errorFields = fields.filter(field => !field.validator(field.value));
+        let heading = 'Wow, great job!';
+        let variant = 'success';
+        let messages = fields.map(f => `${f.name} was typed perfectly`);
+        let bannerAction;
+        if (errorFields.length > 0) {
+            heading = "I'm sorry you're having trouble";
+            variant = 'urgent';
+            messages = errorFields.map(f => `${f.name} was not typed correctly`);
+            bannerAction = (<Link href='https://community.pega.com/support' target='_blank'>
+          Visit Pega support for assistance
+        </Link>);
+        }
+        setBanner(<Banner {...{
+            heading,
+            variant,
+            messages,
+            id: 'formBanner',
+            action: bannerAction,
+            onDismiss() {
+                setBanner(false);
+            }
+        }}/>);
+    }, []);
+    return (<Form banners={banner} actions={formActions} onSubmit={onSubmit} style={{ margin: 'auto', padding: '2.5rem', maxWidth: '37.5rem' }}>
+      {fields.map((field) => {
+            return (<Input key={field.name} autoComplete='off' name={field.name} label={field.label} info={field.info} value={field.value} onChange={(e) => setField(e.target)}/>);
+        })}
+    </Form>);
+};
+export const ShownInCaseView = () => {
+    const [hasBanner, setHasBanner] = useState(true);
+    return (<CaseViewDemo banners={hasBanner && (<Banner id='case-view-error' heading='Waring' onDismiss={() => setHasBanner(false)} variant='warning' messages={['Your submission is missing some important documents.']}/>)}/>);
+};
+ShownInCaseView.parameters = {
+    layout: 'fullscreen'
+};
+export const ShownInAppShell = () => {
+    const [hasBanner, setHasBanner] = useState([]);
+    return (<AppShellDemo banners={hasBanner && (<Banner id='app-shell-banner-success' heading='2 items uploaded successfully' onDismiss={() => setHasBanner([])} variant='success' messages={['pega_data.json', 'business-earnings.xlsx']} action={<Link target='_blank' href='https://www.pega.com'>
+                Link Here!
+              </Link>}/>)}/>);
+};
+ShownInAppShell.parameters = {
+    layout: 'fullscreen'
+};
+//# sourceMappingURL=Banner.stories.jsx.map

package/lib/core/Banner/Banner.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.stories.jsx","sourceRoot":"","sources":["../../../src/core/Banner/Banner.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta } from '@storybook/react';\nimport { useState, useCallback, FormEvent, useReducer } from 'react';\n\nimport { Banner, Button, Form, Input, Link } from '@pega/cosmos-react-core';\nimport { AppShellDemo } from '@pega/cosmos-react-demos/lib/core/AppShell/AppShell.stories';\nimport { CaseViewDemo } from '@pega/cosmos-react-demos/lib/work/CaseView/CaseView.stories';\n\nexport default {\n  title: 'Core/Banner',\n  component: Banner\n} as Meta;\n\nexport const SuccessBanner = () => {\n  const [showBanner, setShowBanner] = useState(true);\n\n  return (\n    <>\n      {!showBanner && <Button onClick={() => setShowBanner(true)}>Open banner</Button>}\n      {showBanner && (\n        <Banner\n          id='success'\n          variant='success'\n          onDismiss={() => setShowBanner(false)}\n          heading='2 items uploaded successfully'\n          messages={['pega_data.json', 'business-earnings.xlsx']}\n        />\n      )}\n    </>\n  );\n};\n\nexport const ErrorBanner = () => {\n  return (\n    <Banner\n      id='error'\n      variant='urgent'\n      heading='Error'\n      action={\n        <div>\n          <Button variant='link'>Try again</Button>\n        </div>\n      }\n      messages={['Your request failed to send!', 'Please review your request and try again']}\n    />\n  );\n};\n\nexport const WarningBanner = () => {\n  return (\n    <Banner\n      id='warning'\n      variant='warning'\n      action={\n        <div>\n          <Button variant='link'>Why this matters</Button>\n        </div>\n      }\n      messages={['Your submission is missing some important documents.']}\n    />\n  );\n};\n\nexport const InfoBanner = () => {\n  const [showBanner, setShowBanner] = useState(true);\n\n  return (\n    <>\n      {!showBanner && <Button onClick={() => setShowBanner(true)}>Open banner</Button>}\n      {showBanner && (\n        <Banner\n          id='info'\n          variant='info'\n          onDismiss={() => setShowBanner(false)}\n          messages={[\n            'US-123456 is currently being modified by Jane Smith and may not be edited simultaneously.'\n          ]}\n        />\n      )}\n    </>\n  );\n};\n\n// -----------------------------------------------------------------------------\n// Form story\n// -----------------------------------------------------------------------------\ninterface DemoFormField {\n  name: string;\n  label: string;\n  info: string;\n  value: string;\n  validator: (value: string) => boolean;\n}\n\nconst demoFields = [\n  {\n    name: 'field-1',\n    label: 'Field 1',\n    info: 'Hint: type exact label text above',\n    value: '',\n    validator: (value: string) => value === 'Field 1'\n  },\n  {\n    name: 'field-2',\n    label: 'Field 2',\n    info: 'Hint: type exact label text above',\n    value: '',\n    validator: (value: string) => value === 'Field 2'\n  },\n  {\n    name: 'field-3',\n    label: 'Field 3',\n    info: 'Hint: type exact label text above',\n    value: '',\n    validator: (value: string) => value === 'Field 3'\n  }\n];\n\nconst formActions = (\n  <>\n    <Button name='Cancel' variant='secondary'>\n      Cancel\n    </Button>\n    <Button name='Submit' type='submit' variant='primary'>\n      Submit\n    </Button>\n  </>\n);\n\n// Handles setting of state for all fields\nconst fieldReducer = (fields: DemoFormField[], inputEl: any) => {\n  return fields.map(field => {\n    if (inputEl.name === field.name) {\n      field.value = inputEl.value;\n    }\n    return field;\n  });\n};\n\nexport const ShownInForm = () => {\n  const [fields, setField] = useReducer(fieldReducer, demoFields);\n  const [banner, setBanner] = useState<any>();\n\n  const onSubmit = useCallback((e: FormEvent) => {\n    e.preventDefault();\n    const errorFields = fields.filter(field => !field.validator(field.value));\n    let heading = 'Wow, great job!';\n    let variant: 'success' | 'urgent' = 'success';\n    let messages = fields.map(f => `${f.name} was typed perfectly`);\n    let bannerAction;\n\n    if (errorFields.length > 0) {\n      heading = \"I'm sorry you're having trouble\";\n      variant = 'urgent';\n      messages = errorFields.map(f => `${f.name} was not typed correctly`);\n      bannerAction = (\n        <Link href='https://community.pega.com/support' target='_blank'>\n          Visit Pega support for assistance\n        </Link>\n      );\n    }\n\n    setBanner(\n      <Banner\n        {...{\n          heading,\n          variant,\n          messages,\n          id: 'formBanner',\n          action: bannerAction,\n          onDismiss() {\n            setBanner(false);\n          }\n        }}\n      />\n    );\n  }, []);\n\n  return (\n    <Form\n      banners={banner}\n      actions={formActions}\n      onSubmit={onSubmit}\n      style={{ margin: 'auto', padding: '2.5rem', maxWidth: '37.5rem' }}\n    >\n      {fields.map((field: DemoFormField) => {\n        return (\n          <Input\n            key={field.name}\n            autoComplete='off'\n            name={field.name}\n            label={field.label}\n            info={field.info}\n            value={field.value}\n            onChange={(e: InputEvent) => setField(e.target as any)}\n          />\n        );\n      })}\n    </Form>\n  );\n};\n\n// -----------------------------------------------------------------------------\n// CaseView story\n// -----------------------------------------------------------------------------\nexport const ShownInCaseView = () => {\n  const [hasBanner, setHasBanner] = useState(true);\n  return (\n    <CaseViewDemo\n      banners={\n        hasBanner && (\n          <Banner\n            id='case-view-error'\n            heading='Waring'\n            onDismiss={() => setHasBanner(false)}\n            variant='warning'\n            messages={['Your submission is missing some important documents.']}\n          />\n        )\n      }\n    />\n  );\n};\n\nShownInCaseView.parameters = {\n  layout: 'fullscreen'\n};\n\n// -----------------------------------------------------------------------------\n// AppShell story\n// -----------------------------------------------------------------------------\nexport const ShownInAppShell = () => {\n  const [hasBanner, setHasBanner] = useState([]);\n  return (\n    <AppShellDemo\n      banners={\n        hasBanner && (\n          <Banner\n            id='app-shell-banner-success'\n            heading='2 items uploaded successfully'\n            onDismiss={() => setHasBanner([])}\n            variant='success'\n            messages={['pega_data.json', 'business-earnings.xlsx']}\n            action={\n              <Link target='_blank' href='https://www.pega.com'>\n                Link Here!\n              </Link>\n            }\n          />\n        )\n      }\n    />\n  );\n};\n\nShownInAppShell.parameters = {\n  layout: 'fullscreen'\n};\n"]}

package/lib/core/Boolean/BooleanDisplay.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, Story } from '@storybook/react';
+import { BooleanDisplayProps } from '@pega/cosmos-react-core';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const BooleanDisplayDemo: Story<BooleanDisplayProps>;
+//# sourceMappingURL=BooleanDisplay.stories.d.ts.map

package/lib/core/Boolean/BooleanDisplay.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BooleanDisplay.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Boolean/BooleanDisplay.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAkB,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;;AAE9E,wBAGU;AAEV,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,mBAAmB,CAIzD,CAAC"}

package/lib/core/Boolean/BooleanDisplay.stories.jsx

@@ -0,0 +1,19 @@
+import { BooleanDisplay } from '@pega/cosmos-react-core';
+export default {
+    title: 'Core/Boolean',
+    component: BooleanDisplay
+};
+export const BooleanDisplayDemo = (args) => {
+    return (<BooleanDisplay value={args.value} trueLabel={args.trueLabel} falseLabel={args.falseLabel}/>);
+};
+BooleanDisplayDemo.args = {
+    value: true,
+    trueLabel: 'Yes',
+    falseLabel: 'No'
+};
+BooleanDisplayDemo.argTypes = {
+    value: { control: { type: 'boolean' } },
+    trueLabel: { control: { type: 'text' } },
+    falseLabel: { control: { type: 'text' } }
+};
+//# sourceMappingURL=BooleanDisplay.stories.jsx.map

package/lib/core/Boolean/BooleanDisplay.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"BooleanDisplay.stories.jsx","sourceRoot":"","sources":["../../../src/core/Boolean/BooleanDisplay.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAuB,MAAM,yBAAyB,CAAC;AAE9E,eAAe;IACb,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,cAAc;CAClB,CAAC;AAEV,MAAM,CAAC,MAAM,kBAAkB,GAA+B,CAAC,IAAyB,EAAE,EAAE;IAC1F,OAAO,CACL,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,EAAG,CAC9F,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAkB,CAAC,IAAI,GAAG;IACxB,KAAK,EAAE,IAAI;IACX,SAAS,EAAE,KAAK;IAChB,UAAU,EAAE,IAAI;CACjB,CAAC;AAEF,kBAAkB,CAAC,QAAQ,GAAG;IAC5B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IACvC,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACxC,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CAC1C,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { BooleanDisplay, BooleanDisplayProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Boolean',\n  component: BooleanDisplay\n} as Meta;\n\nexport const BooleanDisplayDemo: Story<BooleanDisplayProps> = (args: BooleanDisplayProps) => {\n  return (\n    <BooleanDisplay value={args.value} trueLabel={args.trueLabel} falseLabel={args.falseLabel} />\n  );\n};\n\nBooleanDisplayDemo.args = {\n  value: true,\n  trueLabel: 'Yes',\n  falseLabel: 'No'\n};\n\nBooleanDisplayDemo.argTypes = {\n  value: { control: { type: 'boolean' } },\n  trueLabel: { control: { type: 'text' } },\n  falseLabel: { control: { type: 'text' } }\n};\n"]}

package/lib/core/Breadcrumbs/Breadcrumbs.stories.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const BreadcrumbsDemo: () => JSX.Element;
+export declare const ContainedBreadcrumbs: () => JSX.Element;
+//# sourceMappingURL=Breadcrumbs.stories.d.ts.map

package/lib/core/Breadcrumbs/Breadcrumbs.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumbs.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Breadcrumbs/Breadcrumbs.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;;AAMxC,wBAGU;AAEV,eAAO,MAAM,eAAe,mBAU3B,CAAC;AAEF,eAAO,MAAM,oBAAoB,mBAchC,CAAC"}

package/lib/core/Breadcrumbs/Breadcrumbs.stories.jsx

@@ -0,0 +1,29 @@
+import { Breadcrumbs, Card } from '@pega/cosmos-react-core';
+import { StyledCard } from './Breadcrumbs.styles';
+export default {
+    title: 'Core/Breadcrumbs',
+    component: Breadcrumbs
+};
+export const BreadcrumbsDemo = () => {
+    const crumbs = [
+        { id: 'Plan information', primary: 'Plan information', href: '#plan-information' },
+        { id: 'View benefit', primary: 'View benefit', href: '#view-benefit' },
+        { id: 'Benefit usage', primary: 'Benefit usage', href: '#benefit-usage' },
+        { id: 'Plan claims', primary: 'Plan claims', href: '#plan-claims' },
+        { id: 'View benefit claims', primary: 'View benefit claims' }
+    ];
+    return <Breadcrumbs path={crumbs}/>;
+};
+export const ContainedBreadcrumbs = () => {
+    const crumbs = [
+        { id: 'Plan information', primary: 'Plan information', href: '#plan-information' },
+        { id: 'View benefit', primary: 'View benefit', href: '#view-benefit' },
+        { id: 'Benefit usage', primary: 'Benefit usage', href: '#benefit-usage' },
+        { id: 'Plan claims', primary: 'Plan claims', href: '#plan-claims' },
+        { id: 'View benefit claims', primary: 'View benefit claims' }
+    ];
+    return (<Card as={StyledCard}>
+      <Breadcrumbs path={crumbs}/>
+    </Card>);
+};
+//# sourceMappingURL=Breadcrumbs.stories.jsx.map

package/lib/core/Breadcrumbs/Breadcrumbs.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumbs.stories.jsx","sourceRoot":"","sources":["../../../src/core/Breadcrumbs/Breadcrumbs.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE5D,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,eAAe;IACb,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,WAAW;CACf,CAAC;AAEV,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,EAAE;IAClC,MAAM,MAAM,GAAG;QACb,EAAE,EAAE,EAAE,kBAAkB,EAAE,OAAO,EAAE,kBAAkB,EAAE,IAAI,EAAE,mBAAmB,EAAE;QAClF,EAAE,EAAE,EAAE,cAAc,EAAE,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,eAAe,EAAE;QACtE,EAAE,EAAE,EAAE,eAAe,EAAE,OAAO,EAAE,eAAe,EAAE,IAAI,EAAE,gBAAgB,EAAE;QACzE,EAAE,EAAE,EAAE,aAAa,EAAE,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,cAAc,EAAE;QACnE,EAAE,EAAE,EAAE,qBAAqB,EAAE,OAAO,EAAE,qBAAqB,EAAE;KAC9D,CAAC;IAEF,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,EAAG,CAAC;AACvC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,EAAE;IACvC,MAAM,MAAM,GAAG;QACb,EAAE,EAAE,EAAE,kBAAkB,EAAE,OAAO,EAAE,kBAAkB,EAAE,IAAI,EAAE,mBAAmB,EAAE;QAClF,EAAE,EAAE,EAAE,cAAc,EAAE,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,eAAe,EAAE;QACtE,EAAE,EAAE,EAAE,eAAe,EAAE,OAAO,EAAE,eAAe,EAAE,IAAI,EAAE,gBAAgB,EAAE;QACzE,EAAE,EAAE,EAAE,aAAa,EAAE,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,cAAc,EAAE;QACnE,EAAE,EAAE,EAAE,qBAAqB,EAAE,OAAO,EAAE,qBAAqB,EAAE;KAC9D,CAAC;IAEF,OAAO,CACL,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,UAAU,CAAC,CACnB;MAAA,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,EAC5B;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Meta } from '@storybook/react';\n\nimport { Breadcrumbs, Card } from '@pega/cosmos-react-core';\n\nimport { StyledCard } from './Breadcrumbs.styles';\n\nexport default {\n  title: 'Core/Breadcrumbs',\n  component: Breadcrumbs\n} as Meta;\n\nexport const BreadcrumbsDemo = () => {\n  const crumbs = [\n    { id: 'Plan information', primary: 'Plan information', href: '#plan-information' },\n    { id: 'View benefit', primary: 'View benefit', href: '#view-benefit' },\n    { id: 'Benefit usage', primary: 'Benefit usage', href: '#benefit-usage' },\n    { id: 'Plan claims', primary: 'Plan claims', href: '#plan-claims' },\n    { id: 'View benefit claims', primary: 'View benefit claims' }\n  ];\n\n  return <Breadcrumbs path={crumbs} />;\n};\n\nexport const ContainedBreadcrumbs = () => {\n  const crumbs = [\n    { id: 'Plan information', primary: 'Plan information', href: '#plan-information' },\n    { id: 'View benefit', primary: 'View benefit', href: '#view-benefit' },\n    { id: 'Benefit usage', primary: 'Benefit usage', href: '#benefit-usage' },\n    { id: 'Plan claims', primary: 'Plan claims', href: '#plan-claims' },\n    { id: 'View benefit claims', primary: 'View benefit claims' }\n  ];\n\n  return (\n    <Card as={StyledCard}>\n      <Breadcrumbs path={crumbs} />\n    </Card>\n  );\n};\n"]}

package/lib/core/Breadcrumbs/Breadcrumbs.styles.d.ts

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

package/lib/core/Breadcrumbs/Breadcrumbs.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumbs.styles.d.ts","sourceRoot":"","sources":["../../../src/core/Breadcrumbs/Breadcrumbs.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,UAAU,6GAYrB,CAAC"}

package/lib/core/Breadcrumbs/Breadcrumbs.styles.js

@@ -0,0 +1,12 @@
+import styled, { css } from 'styled-components';
+import { defaultThemeProp } from '@pega/cosmos-react-core';
+export const StyledCard = styled.article(props => {
+    const { theme: { base: { spacing } } } = props;
+    return css `
+    width: 20rem;
+    height: max-content;
+    padding: ${spacing};
+  `;
+});
+StyledCard.defaultProps = defaultThemeProp;
+//# sourceMappingURL=Breadcrumbs.styles.js.map

package/lib/core/Breadcrumbs/Breadcrumbs.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumbs.styles.js","sourceRoot":"","sources":["../../../src/core/Breadcrumbs/Breadcrumbs.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;IAC/C,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;;;eAGG,OAAO;GACnB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\n\nexport const StyledCard = styled.article(props => {\n  const {\n    theme: {\n      base: { spacing }\n    }\n  } = props;\n\n  return css`\n    width: 20rem;\n    height: max-content;\n    padding: ${spacing};\n  `;\n});\n\nStyledCard.defaultProps = defaultThemeProp;\n"]}

package/lib/core/Button/Button.stories.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { Meta, Story } from '@storybook/react';
+import { ButtonProps } from '@pega/cosmos-react-core';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const ButtonVariants: Story<ButtonProps>;
+export declare const DisabledButtons: () => JSX.Element;
+export declare const IconButtons: Story<ButtonProps>;
+export declare const LoadingButtons: Story<ButtonProps>;
+export declare const ButtonAsLink: () => JSX.Element;
+export declare const BareButtonDemo: Story<ButtonProps>;
+//# sourceMappingURL=Button.stories.d.ts.map

package/lib/core/Button/Button.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Button/Button.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAU,WAAW,EAAsB,MAAM,yBAAyB,CAAC;;AAMlF,wBAMU;AAEV,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,WAAW,CAM7C,CAAC;AAeF,eAAO,MAAM,eAAe,mBAoB3B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,WAAW,CAoB1C,CAAC;AAUF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,WAAW,CAM7C,CAAC;AAYF,eAAO,MAAM,YAAY,mBAMxB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,WAAW,CAM7C,CAAC"}

package/lib/core/Button/Button.stories.jsx

@@ -0,0 +1,103 @@
+import { Button, Icon, registerIcon } from '@pega/cosmos-react-core';
+import * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';
+import BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';
+registerIcon(plusIcon);
+export default {
+    title: 'Core/Button',
+    component: Button,
+    parameters: {
+        layout: 'centered'
+    }
+};
+export const ButtonVariants = (args) => {
+    return (<Button variant={args.variant} compact={args.compact}>
+      Click me
+    </Button>);
+};
+ButtonVariants.args = {
+    variant: 'primary',
+    compact: false
+};
+ButtonVariants.argTypes = {
+    variant: {
+        options: ['primary', 'secondary', 'simple', 'link', 'text'],
+        control: { type: 'select' }
+    },
+    compact: { control: { type: 'boolean' } }
+};
+export const DisabledButtons = () => {
+    return (<>
+      <Button variant='primary' disabled>
+        Primary disabled
+      </Button>
+      <Button variant='secondary' disabled>
+        Secondary disabled
+      </Button>
+      <Button variant='simple' disabled>
+        Simple disabled
+      </Button>
+      <Button variant='link' disabled>
+        Link disabled
+      </Button>
+      <Button variant='text' disabled>
+        Text disabled
+      </Button>
+    </>);
+};
+export const IconButtons = ({ compact }) => {
+    return (<>
+      <Button variant='primary' label='Icon button primary' icon compact={compact}>
+        <Icon name='plus'/>
+      </Button>
+      <Button variant='secondary' label='Icon button secondary' icon compact={compact}>
+        <Icon name='plus'/>
+      </Button>
+      <Button variant='simple' label='Icon button simple' icon compact={compact}>
+        <Icon name='plus'/>
+      </Button>
+      <Button variant='link' label='Icon button link' icon compact={compact}>
+        <Icon name='plus'/>
+      </Button>
+      <Button variant='text' label='Icon button text' icon compact={compact}>
+        <Icon name='plus'/>
+      </Button>
+    </>);
+};
+IconButtons.args = {
+    compact: false
+};
+IconButtons.argTypes = {
+    compact: { control: { type: 'boolean' } }
+};
+export const LoadingButtons = (args) => {
+    return (<Button variant={args.variant} icon={args.icon} label='Loading' loading>
+      {args.icon ? <Icon name='plus'/> : 'Loading'}
+    </Button>);
+};
+LoadingButtons.args = {
+    variant: 'primary',
+    icon: false
+};
+LoadingButtons.argTypes = {
+    variant: { options: ['primary', 'secondary'], control: { type: 'select' } },
+    icon: { control: { type: 'boolean' } }
+};
+export const ButtonAsLink = () => {
+    return (<Button variant='primary' href='https://www.pega.com' target='_blank'>
+      Go to pega.com
+    </Button>);
+};
+export const BareButtonDemo = (args) => {
+    return (<BareButton disabled={args.disabled} href={args.href || undefined}>
+      Click me
+    </BareButton>);
+};
+BareButtonDemo.args = {
+    disabled: false,
+    href: ''
+};
+BareButtonDemo.argTypes = {
+    disabled: { control: { type: 'boolean' } },
+    href: { control: { type: 'text' } }
+};
+//# sourceMappingURL=Button.stories.jsx.map

package/lib/core/Button/Button.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.stories.jsx","sourceRoot":"","sources":["../../../src/core/Button/Button.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Button, ButtonProps, Icon, registerIcon } from '@pega/cosmos-react-core';\nimport * as plusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/plus.icon';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\n\nregisterIcon(plusIcon);\n\nexport default {\n  title: 'Core/Button',\n  component: Button,\n  parameters: {\n    layout: 'centered'\n  }\n} as Meta;\n\nexport const ButtonVariants: Story<ButtonProps> = (args: ButtonProps) => {\n  return (\n    <Button variant={args.variant} compact={args.compact}>\n      Click me\n    </Button>\n  );\n};\n\nButtonVariants.args = {\n  variant: 'primary',\n  compact: false\n};\n\nButtonVariants.argTypes = {\n  variant: {\n    options: ['primary', 'secondary', 'simple', 'link', 'text'],\n    control: { type: 'select' }\n  },\n  compact: { control: { type: 'boolean' } }\n};\n\nexport const DisabledButtons = () => {\n  return (\n    <>\n      <Button variant='primary' disabled>\n        Primary disabled\n      </Button>\n      <Button variant='secondary' disabled>\n        Secondary disabled\n      </Button>\n      <Button variant='simple' disabled>\n        Simple disabled\n      </Button>\n      <Button variant='link' disabled>\n        Link disabled\n      </Button>\n      <Button variant='text' disabled>\n        Text disabled\n      </Button>\n    </>\n  );\n};\n\nexport const IconButtons: Story<ButtonProps> = ({ compact }: ButtonProps) => {\n  return (\n    <>\n      <Button variant='primary' label='Icon button primary' icon compact={compact}>\n        <Icon name='plus' />\n      </Button>\n      <Button variant='secondary' label='Icon button secondary' icon compact={compact}>\n        <Icon name='plus' />\n      </Button>\n      <Button variant='simple' label='Icon button simple' icon compact={compact}>\n        <Icon name='plus' />\n      </Button>\n      <Button variant='link' label='Icon button link' icon compact={compact}>\n        <Icon name='plus' />\n      </Button>\n      <Button variant='text' label='Icon button text' icon compact={compact}>\n        <Icon name='plus' />\n      </Button>\n    </>\n  );\n};\n\nIconButtons.args = {\n  compact: false\n};\n\nIconButtons.argTypes = {\n  compact: { control: { type: 'boolean' } }\n};\n\nexport const LoadingButtons: Story<ButtonProps> = (args: ButtonProps) => {\n  return (\n    <Button variant={args.variant} icon={args.icon} label='Loading' loading>\n      {args.icon ? <Icon name='plus' /> : 'Loading'}\n    </Button>\n  );\n};\n\nLoadingButtons.args = {\n  variant: 'primary',\n  icon: false\n};\n\nLoadingButtons.argTypes = {\n  variant: { options: ['primary', 'secondary'], control: { type: 'select' } },\n  icon: { control: { type: 'boolean' } }\n};\n\nexport const ButtonAsLink = () => {\n  return (\n    <Button variant='primary' href='https://www.pega.com' target='_blank'>\n      Go to pega.com\n    </Button>\n  );\n};\n\nexport const BareButtonDemo: Story<ButtonProps> = (args: ButtonProps) => {\n  return (\n    <BareButton disabled={args.disabled} href={args.href || undefined}>\n      Click me\n    </BareButton>\n  );\n};\n\nBareButtonDemo.args = {\n  disabled: false,\n  href: ''\n};\n\nBareButtonDemo.argTypes = {\n  disabled: { control: { type: 'boolean' } },\n  href: { control: { type: 'text' } }\n};\n"]}

package/lib/core/Card/Card.stories.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { Meta, Story } from '@storybook/react';
+import { CardFooterProps } from '@pega/cosmos-react-core';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const SimpleCard: () => JSX.Element;
+export declare const FullCard: Story<CardFooterProps>;
+//# sourceMappingURL=Card.stories.d.ts.map

package/lib/core/Card/Card.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Card/Card.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAML,eAAe,EAIhB,MAAM,yBAAyB,CAAC;;AAIjC,wBAMU;AAEV,eAAO,MAAM,UAAU,mBAatB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,eAAe,CAwC3C,CAAC"}