@pega/cosmos-react-demos 2.0.0 → 2.1.3

package/jsx/core/Configuration/Configuration.stories.jsx

@@ -0,0 +1,125 @@
+import { useState } from 'react';
+import styled from 'styled-components';
+import { Button, Configuration, MenuButton, resetToInitial } from '@pega/cosmos-react-core';
+import { FormContent } from '@pega/cosmos-react-demos/lib/core/Form/Form.mocks';
+export default {
+    title: 'Core/Configuration',
+    component: Configuration
+};
+export const ThemedForm = (args) => {
+    const themes = {
+        default: {},
+        theme1: {
+            base: {
+                palette: {
+                    interactive: '#AC75F0'
+                }
+            },
+            components: {
+                button: {
+                    'border-radius': 1
+                },
+                'form-control': {
+                    'background-color': '#80008033',
+                    'border-color': 'purple'
+                },
+                input: {
+                    height: '50px'
+                }
+            }
+        }
+    };
+    return (<Configuration theme={themes[args.theme]}>
+      <FormContent cols={1} showActions={false}/>
+    </Configuration>);
+};
+ThemedForm.args = {
+    theme: 'default'
+};
+ThemedForm.argTypes = {
+    theme: { options: ['default', 'theme1'], control: { type: 'select' } }
+};
+const buttonStyles = {
+    width: '100%'
+};
+const StyledFieldset = styled.fieldset `
+  padding: 1rem 5%;
+  margin: 1rem 0;
+`;
+const BoldSpan = styled.span `
+  font-weight: bold;
+`;
+const FlipFlop = ({ flipFlop, first, second }) => {
+    return flipFlop ? (<>
+      <BoldSpan>{first}</BoldSpan>&nbsp;→ {second}
+    </>) : (<>
+      {first} ←&nbsp;<BoldSpan>{second}</BoldSpan>
+    </>);
+};
+export const ThemingHierarchy = () => {
+    const [redOrOrange, setRedOrOrange] = useState(true);
+    const [greenOrPurple, setGreenOrPurple] = useState(true);
+    return (<StyledFieldset style={{ margin: 0, textAlign: 'center' }}>
+      <legend>Initial Theme</legend>
+      <Button style={buttonStyles} variant='primary'>
+        Base interactive
+      </Button>
+      <StyledFieldset>
+        <legend>Override Interactive to</legend>
+        <Configuration theme={{
+            base: {
+                palette: {
+                    interactive: redOrOrange ? 'red' : 'darkorange'
+                }
+            }
+        }}>
+          <Button style={buttonStyles} variant='primary' onClick={() => setRedOrOrange(val => !val)}>
+            <FlipFlop flipFlop={redOrOrange} first='Red' second='Orange'/>
+          </Button>
+          <StyledFieldset>
+            <legend>Override Button Primary BG to</legend>
+            <Configuration theme={{
+            components: {
+                button: { color: greenOrPurple ? 'green' : 'purple' }
+            }
+        }}>
+              <Button style={buttonStyles} variant='primary' onClick={() => setGreenOrPurple(val => !val)}>
+                <FlipFlop flipFlop={greenOrPurple} first='Green' second='Purple'/>
+              </Button>
+              <Button style={{ ...buttonStyles, marginTop: '1rem' }} variant='secondary'>
+                Secondary still inherits interactive
+              </Button>
+              <StyledFieldset>
+                <legend>Reset Button BG</legend>
+                <Configuration theme={{
+            components: { button: { color: resetToInitial } }
+        }}>
+                  <Button style={buttonStyles} variant='primary'>
+                    Inherited from interactive
+                  </Button>
+                  <StyledFieldset>
+                    <legend>Reset Interactive</legend>
+                    <Configuration theme={{ base: { palette: { interactive: resetToInitial } } }}>
+                      <Button style={buttonStyles} variant='primary'>
+                        Inherited from base
+                      </Button>
+                    </Configuration>
+                  </StyledFieldset>
+                </Configuration>
+              </StyledFieldset>
+            </Configuration>
+          </StyledFieldset>
+        </Configuration>
+      </StyledFieldset>
+    </StyledFieldset>);
+};
+export const OverridableActionMenu = () => {
+    const sharedActions = [{ id: '1', primary: 'Action 1', onClick: () => { } }];
+    return (<>
+      <MenuButton text='Cosmos MenuButton' menu={{ items: sharedActions }}/>
+      <Configuration overrideMap={{}}>
+        <MenuButton text='Mock PIMC MenuButton' menu={{ items: sharedActions }}/>
+      </Configuration>
+    </>);
+};
+//# sourceMappingURL=Configuration.stories.jsx.map

package/jsx/core/Configuration/Configuration.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Configuration.stories.jsx","sourceRoot":"","sources":["../../../src/core/Configuration/Configuration.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\nimport styled from 'styled-components';\n\nimport {\n  Button,\n  Configuration,\n  MenuButton,\n  resetToInitial,\n  DefaultSettableTheme\n} from '@pega/cosmos-react-core';\nimport { FormContent } from '@pega/cosmos-react-demos/lib/core/Form/Form.mocks';\n\nexport default {\n  title: 'Core/Configuration',\n  component: Configuration\n} as Meta;\n\nexport const ThemedForm: Story<{ theme: 'default' | 'theme1' }> = (args: {\n  theme: 'default' | 'theme1';\n}) => {\n  const themes: Record<string, DefaultSettableTheme> = {\n    default: {},\n    theme1: {\n      base: {\n        palette: {\n          interactive: '#AC75F0'\n        }\n      },\n      components: {\n        button: {\n          'border-radius': 1\n        },\n        'form-control': {\n          'background-color': '#80008033',\n          'border-color': 'purple'\n        },\n        input: {\n          height: '50px'\n        }\n      }\n    }\n  };\n\n  return (\n    <Configuration theme={themes[args.theme]}>\n      <FormContent cols={1} showActions={false} />\n    </Configuration>\n  );\n};\n\nThemedForm.args = {\n  theme: 'default'\n};\n\nThemedForm.argTypes = {\n  theme: { options: ['default', 'theme1'], control: { type: 'select' } }\n};\n\nconst buttonStyles = {\n  width: '100%'\n};\n\nconst StyledFieldset = styled.fieldset`\n  padding: 1rem 5%;\n  margin: 1rem 0;\n`;\n\nconst BoldSpan = styled.span`\n  font-weight: bold;\n`;\n\nconst FlipFlop = ({\n  flipFlop,\n  first,\n  second\n}: {\n  flipFlop: boolean;\n  first: string;\n  second: string;\n}) => {\n  return flipFlop ? (\n    <>\n      <BoldSpan>{first}</BoldSpan>&nbsp;→ {second}\n    </>\n  ) : (\n    <>\n      {first} ←&nbsp;<BoldSpan>{second}</BoldSpan>\n    </>\n  );\n};\n\nexport const ThemingHierarchy = () => {\n  const [redOrOrange, setRedOrOrange] = useState(true);\n  const [greenOrPurple, setGreenOrPurple] = useState(true);\n\n  return (\n    <StyledFieldset style={{ margin: 0, textAlign: 'center' }}>\n      <legend>Initial Theme</legend>\n      <Button style={buttonStyles} variant='primary'>\n        Base interactive\n      </Button>\n      <StyledFieldset>\n        <legend>Override Interactive to</legend>\n        <Configuration\n          theme={{\n            base: {\n              palette: {\n                interactive: redOrOrange ? 'red' : 'darkorange'\n              }\n            }\n          }}\n        >\n          <Button\n            style={buttonStyles}\n            variant='primary'\n            onClick={() => setRedOrOrange(val => !val)}\n          >\n            <FlipFlop flipFlop={redOrOrange} first='Red' second='Orange' />\n          </Button>\n          <StyledFieldset>\n            <legend>Override Button Primary BG to</legend>\n            <Configuration\n              theme={{\n                components: {\n                  button: { color: greenOrPurple ? 'green' : 'purple' }\n                }\n              }}\n            >\n              <Button\n                style={buttonStyles}\n                variant='primary'\n                onClick={() => setGreenOrPurple(val => !val)}\n              >\n                <FlipFlop flipFlop={greenOrPurple} first='Green' second='Purple' />\n              </Button>\n              <Button style={{ ...buttonStyles, marginTop: '1rem' }} variant='secondary'>\n                Secondary still inherits interactive\n              </Button>\n              <StyledFieldset>\n                <legend>Reset Button BG</legend>\n                <Configuration\n                  theme={{\n                    components: { button: { color: resetToInitial } }\n                  }}\n                >\n                  <Button style={buttonStyles} variant='primary'>\n                    Inherited from interactive\n                  </Button>\n                  <StyledFieldset>\n                    <legend>Reset Interactive</legend>\n                    <Configuration theme={{ base: { palette: { interactive: resetToInitial } } }}>\n                      <Button style={buttonStyles} variant='primary'>\n                        Inherited from base\n                      </Button>\n                    </Configuration>\n                  </StyledFieldset>\n                </Configuration>\n              </StyledFieldset>\n            </Configuration>\n          </StyledFieldset>\n        </Configuration>\n      </StyledFieldset>\n    </StyledFieldset>\n  );\n};\n\nexport const OverridableActionMenu = () => {\n  const sharedActions = [{ id: '1', primary: 'Action 1', onClick: () => {} }];\n\n  return (\n    <>\n      <MenuButton text='Cosmos MenuButton' menu={{ items: sharedActions }} />\n      <Configuration overrideMap={{}}>\n        <MenuButton text='Mock PIMC MenuButton' menu={{ items: sharedActions }} />\n      </Configuration>\n    </>\n  );\n};\n"]}

package/jsx/core/Currency/Currency.stories.d.ts

@@ -0,0 +1,11 @@
+import { Meta, Story } from '@storybook/react';
+import { CurrencyDisplayProps, CurrencyInputProps } from '@pega/cosmos-react-core';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const CurrencyInputDemo: Story<CurrencyInputProps>;
+interface CurrencyDisplayStoryProps extends CurrencyDisplayProps {
+    showGroupSeparators: boolean;
+    showDecimal: boolean;
+}
+export declare const CurrencyDisplayDemo: Story<CurrencyDisplayStoryProps>;
+//# sourceMappingURL=Currency.stories.d.ts.map

package/jsx/core/Currency/Currency.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Currency.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Currency/Currency.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAEL,oBAAoB,EAEpB,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;;AAEjC,wBAGU;AAEV,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,kBAAkB,CAsBvD,CAAC;AAmCF,UAAU,yBAA0B,SAAQ,oBAAoB;IAC9D,mBAAmB,EAAE,OAAO,CAAC;IAC7B,WAAW,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,yBAAyB,CAchE,CAAC"}

package/jsx/core/DateTime/DateTime.stories.d.ts

@@ -0,0 +1,20 @@
+import { Meta, Story } from '@storybook/react';
+import { DateInputProps, DateTimeInputProps, DateRangeInputProps, DayOfWeekInputProps, DurationInputProps, MonthInputProps, QuarterInputProps, TimeInputProps, WeekInputProps } from '@pega/cosmos-react-core';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const DateInputDemo: Story<DateInputProps>;
+export declare const MonthInputDemo: Story<MonthInputProps>;
+export declare const WeekInputDemo: Story<WeekInputProps>;
+export declare const QuarterInputDemo: Story<QuarterInputProps>;
+export declare const DayOfWeekInputDemo: Story<DayOfWeekInputProps & {
+    min?: never;
+    max?: never;
+}>;
+export declare const TimeInputDemo: Story<TimeInputProps>;
+export declare const DateTimeInputDemo: Story<DateTimeInputProps>;
+export declare const DateRangeInputDemo: Story<DateRangeInputProps>;
+export declare const DurationInputDemo: Story<DurationInputProps & {
+    min?: never;
+    max?: never;
+}>;
+//# sourceMappingURL=DateTime.stories.d.ts.map

package/jsx/core/DateTime/DateTime.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTime.stories.d.ts","sourceRoot":"","sources":["../../../src/core/DateTime/DateTime.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAEL,cAAc,EAEd,kBAAkB,EAElB,mBAAmB,EAEnB,mBAAmB,EAEnB,kBAAkB,EAGlB,eAAe,EAEf,iBAAiB,EAEjB,cAAc,EAEd,cAAc,EACf,MAAM,yBAAyB,CAAC;;AAEjC,wBAqBU;AAEV,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,cAAc,CAe/C,CAAC;AAWF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,eAAe,CAcjD,CAAC;AAMF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,cAAc,CAc/C,CAAC;AAMF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,iBAAiB,CAcrD,CAAC;AAMF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,mBAAmB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC;IAAC,GAAG,CAAC,EAAE,KAAK,CAAA;CAAE,CAaxF,CAAC;AAWF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,cAAc,CAiB/C,CAAC;AAeF,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,kBAAkB,CAkBvD,CAAC;AAiBF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,mBAAmB,CAezD,CAAC;AAiBF,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,kBAAkB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC;IAAC,GAAG,CAAC,EAAE,KAAK,CAAA;CAAE,CAiBtF,CAAC"}

package/jsx/core/DateTime/DateTimeDisplay.stories.d.ts

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

package/jsx/core/DateTime/DateTimeDisplay.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimeDisplay.stories.d.ts","sourceRoot":"","sources":["../../../src/core/DateTime/DateTimeDisplay.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAEL,oBAAoB,EAEpB,oBAAoB,EACrB,MAAM,yBAAyB,CAAC;;AAEjC,wBAEU;AAEV,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,oBAAoB,CAE3D,CAAC;AAYF,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,oBAAoB,CAS3D,CAAC"}

package/jsx/core/DateTime/DateTimeDisplay.stories.jsx

@@ -0,0 +1,47 @@
+import { DateTimeDisplay, DurationDisplay } from '@pega/cosmos-react-core';
+export default {
+    title: 'Core/DateTime'
+};
+export const DurationDisplayDemo = (args) => {
+    return <DurationDisplay value={args.value} significantUnits={args.significantUnits}/>;
+};
+DurationDisplayDemo.args = {
+    value: 462553844,
+    significantUnits: 4
+};
+DurationDisplayDemo.argTypes = {
+    value: { control: { type: 'number' } },
+    significantUnits: { options: [1, 2, 3, 4], control: { type: 'select' } }
+};
+export const DateTimeDisplayDemo = (args) => {
+    return (<DateTimeDisplay value={args.value} variant={args.variant} format={args.format} clockFormat={args.clockFormat}/>);
+};
+DateTimeDisplayDemo.args = {
+    value: new Date(),
+    variant: 'date',
+    format: 'short',
+    clockFormat: undefined
+};
+DateTimeDisplayDemo.argTypes = {
+    value: { control: { type: 'date' } },
+    variant: {
+        options: [
+            'date',
+            'datetime',
+            'time',
+            'week',
+            'month',
+            'year',
+            'monthyear',
+            'quarteryear',
+            'relative'
+        ],
+        control: { type: 'select' }
+    },
+    format: { options: ['short', 'long', 'numeric'], control: { type: 'select' } },
+    clockFormat: {
+        options: [undefined, 12, 24],
+        control: { type: 'inline-radio' }
+    }
+};
+//# sourceMappingURL=DateTimeDisplay.stories.jsx.map

package/jsx/core/DateTime/DateTimeDisplay.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimeDisplay.stories.jsx","sourceRoot":"","sources":["../../../src/core/DateTime/DateTimeDisplay.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,eAAe,EAEf,eAAe,EAEhB,MAAM,yBAAyB,CAAC;AAEjC,eAAe;IACb,KAAK,EAAE,eAAe;CACf,CAAC;AAEV,MAAM,CAAC,MAAM,mBAAmB,GAAgC,CAAC,IAA0B,EAAE,EAAE;IAC7F,OAAO,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,gBAAgB,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC,EAAG,CAAC;AACzF,CAAC,CAAC;AAEF,mBAAmB,CAAC,IAAI,GAAG;IACzB,KAAK,EAAE,SAAS;IAChB,gBAAgB,EAAE,CAAC;CACpB,CAAC;AAEF,mBAAmB,CAAC,QAAQ,GAAG;IAC7B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IACtC,gBAAgB,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;CACzE,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAgC,CAAC,IAA0B,EAAE,EAAE;IAC7F,OAAO,CACL,CAAC,eAAe,CACd,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CACtB,MAAM,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CACpB,WAAW,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,EAC9B,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,mBAAmB,CAAC,IAAI,GAAG;IACzB,KAAK,EAAE,IAAI,IAAI,EAAE;IACjB,OAAO,EAAE,MAAM;IACf,MAAM,EAAE,OAAO;IACf,WAAW,EAAE,SAAS;CACvB,CAAC;AAEF,mBAAmB,CAAC,QAAQ,GAAG;IAC7B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACpC,OAAO,EAAE;QACP,OAAO,EAAE;YACP,MAAM;YACN,UAAU;YACV,MAAM;YACN,MAAM;YACN,OAAO;YACP,MAAM;YACN,WAAW;YACX,aAAa;YACb,UAAU;SACX;QACD,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;KAC5B;IACD,MAAM,EAAE,EAAE,OAAO,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IAC9E,WAAW,EAAE;QACX,OAAO,EAAE,CAAC,SAAS,EAAE,EAAE,EAAE,EAAE,CAAC;QAC5B,OAAO,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE;KAClC;CACF,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport {\n  DateTimeDisplay,\n  DateTimeDisplayProps,\n  DurationDisplay,\n  DurationDisplayProps\n} from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/DateTime'\n} as Meta;\n\nexport const DurationDisplayDemo: Story<DurationDisplayProps> = (args: DurationDisplayProps) => {\n  return <DurationDisplay value={args.value} significantUnits={args.significantUnits} />;\n};\n\nDurationDisplayDemo.args = {\n  value: 462553844,\n  significantUnits: 4\n};\n\nDurationDisplayDemo.argTypes = {\n  value: { control: { type: 'number' } },\n  significantUnits: { options: [1, 2, 3, 4], control: { type: 'select' } }\n};\n\nexport const DateTimeDisplayDemo: Story<DateTimeDisplayProps> = (args: DateTimeDisplayProps) => {\n  return (\n    <DateTimeDisplay\n      value={args.value}\n      variant={args.variant}\n      format={args.format}\n      clockFormat={args.clockFormat}\n    />\n  );\n};\n\nDateTimeDisplayDemo.args = {\n  value: new Date(),\n  variant: 'date',\n  format: 'short',\n  clockFormat: undefined\n};\n\nDateTimeDisplayDemo.argTypes = {\n  value: { control: { type: 'date' } },\n  variant: {\n    options: [\n      'date',\n      'datetime',\n      'time',\n      'week',\n      'month',\n      'year',\n      'monthyear',\n      'quarteryear',\n      'relative'\n    ],\n    control: { type: 'select' }\n  },\n  format: { options: ['short', 'long', 'numeric'], control: { type: 'select' } },\n  clockFormat: {\n    options: [undefined, 12, 24],\n    control: { type: 'inline-radio' }\n  }\n};\n"]}

package/jsx/core/DateTime/DateTimePicker.stories.d.ts

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

package/jsx/core/DateTime/DateTimePicker.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimePicker.stories.d.ts","sourceRoot":"","sources":["../../../src/core/DateTime/DateTimePicker.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAc,eAAe,EAAc,eAAe,EAAE,MAAM,yBAAyB,CAAC;;AAEnG,wBAEU;AAEV,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,eAAe,CAcjD,CAAC;AAgBF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,eAAe,CAIjD,CAAC"}

package/jsx/core/Drawer/Drawer.stories.d.ts

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

package/jsx/core/Drawer/Drawer.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Drawer/Drawer.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAwB,WAAW,EAAwB,MAAM,yBAAyB,CAAC;;AAIlG,wBAWU;AAEV,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,WAAW,CAuD9C,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,WAAW,CAuD7C,CAAC"}

package/jsx/core/Drawer/Drawer.styles.d.ts

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

package/jsx/core/Drawer/Drawer.styles.d.ts.map

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

package/jsx/core/Drawer/Drawer.styles.js

@@ -0,0 +1,11 @@
+import styled, { css } from 'styled-components';
+import { defaultThemeProp } from '@pega/cosmos-react-core';
+export const StyledDrawerContent = styled.div(props => {
+    const { theme: { base } } = props;
+    return css `
+    height: 100%;
+    background-color: ${base.palette['primary-background']};
+  `;
+});
+StyledDrawerContent.defaultProps = defaultThemeProp;
+//# sourceMappingURL=Drawer.styles.js.map

package/jsx/core/Drawer/Drawer.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.styles.js","sourceRoot":"","sources":["../../../src/core/Drawer/Drawer.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,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;IACpD,MAAM,EACJ,KAAK,EAAE,EAAE,IAAI,EAAE,EAChB,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;;wBAEY,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;GACvD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\n\nexport const StyledDrawerContent = styled.div(props => {\n  const {\n    theme: { base }\n  } = props;\n\n  return css`\n    height: 100%;\n    background-color: ${base.palette['primary-background']};\n  `;\n});\n\nStyledDrawerContent.defaultProps = defaultThemeProp;\n"]}

package/jsx/core/Email/EmailDisplay.stories.d.ts

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

package/jsx/core/Email/EmailDisplay.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmailDisplay.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Email/EmailDisplay.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAgB,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;;AAE1E,wBAGU;AAEV,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,iBAAiB,CAErD,CAAC"}

package/jsx/core/EmojiPicker/EmojiPicker.stories.d.ts

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

package/jsx/core/EmojiPicker/EmojiPicker.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmojiPicker.stories.d.ts","sourceRoot":"","sources":["../../../src/core/EmojiPicker/EmojiPicker.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAI/C,OAAO,EAA6B,gBAAgB,EAAe,MAAM,yBAAyB,CAAC;;AAEnG,wBAaU;AAEV,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,gBAAgB,CAkBnD,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,gBAAgB,CAmB1D,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,gBAAgB,CA0BlD,CAAC"}

package/jsx/core/EmptyState/EmptyState.stories.d.ts

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

package/jsx/core/EmptyState/EmptyState.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.stories.d.ts","sourceRoot":"","sources":["../../../src/core/EmptyState/EmptyState.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAc,eAAe,EAAE,MAAM,yBAAyB,CAAC;;AAEtE,wBAMU;AAEV,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,eAAe,CAEjD,CAAC"}

package/jsx/core/ErrorState/ErrorState.stories.d.ts

@@ -0,0 +1,9 @@
+import { Meta, Story } from '@storybook/react';
+import { ErrorStateProps } from '@pega/cosmos-react-core';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+interface ErrorStateStoryProps extends ErrorStateProps {
+    displayRetry?: boolean;
+}
+export declare const ErrorStateDemo: Story<ErrorStateStoryProps>;
+//# sourceMappingURL=ErrorState.stories.d.ts.map

package/jsx/core/ErrorState/ErrorState.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorState.stories.d.ts","sourceRoot":"","sources":["../../../src/core/ErrorState/ErrorState.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAE/C,OAAO,EAAc,eAAe,EAAE,MAAM,yBAAyB,CAAC;;AAEtE,wBAMU;AAEV,UAAU,oBAAqB,SAAQ,eAAe;IACpD,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,oBAAoB,CAEtD,CAAC"}

package/jsx/core/ExpandCollapse/ExpandCollapse.stories.d.ts

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

package/jsx/core/ExpandCollapse/ExpandCollapse.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpandCollapse.stories.d.ts","sourceRoot":"","sources":["../../../src/core/ExpandCollapse/ExpandCollapse.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAA0B,mBAAmB,EAAc,MAAM,yBAAyB,CAAC;;AAIlG,wBAaU;AAEV,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,mBAAmB,CAoC7D,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,mBAAmB,CAyC/D,CAAC"}

package/jsx/core/ExpandCollapse/ExpandCollapse.styles.d.ts

@@ -0,0 +1,4 @@
+export declare const StyledRegion: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    innerRegion?: boolean | undefined;
+}, never>;
+//# sourceMappingURL=ExpandCollapse.styles.d.ts.map

package/jsx/core/ExpandCollapse/ExpandCollapse.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpandCollapse.styles.d.ts","sourceRoot":"","sources":["../../../src/core/ExpandCollapse/ExpandCollapse.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,YAAY;;SAcvB,CAAC"}

package/jsx/core/ExpandCollapse/ExpandCollapse.styles.js

@@ -0,0 +1,17 @@
+import styled, { css } from 'styled-components';
+import { defaultThemeProp } from '@pega/cosmos-react-core';
+export const StyledRegion = styled.div(({ innerRegion, theme }) => {
+    return css `
+    background-color: ${theme.base.palette[innerRegion ? 'primary-background' : 'secondary-background']};
+    padding: calc(4 * ${theme.base.spacing});
+    display: flex;
+    justify-content: center;
+
+    button {
+      height: max-content;
+      align-self: center;
+    }
+  `;
+});
+StyledRegion.defaultProps = defaultThemeProp;
+//# sourceMappingURL=ExpandCollapse.styles.js.map

package/jsx/core/ExpandCollapse/ExpandCollapse.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpandCollapse.styles.js","sourceRoot":"","sources":["../../../src/core/ExpandCollapse/ExpandCollapse.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,YAAY,GAAG,MAAM,CAAC,GAAG,CAA4B,CAAC,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3F,OAAO,GAAG,CAAA;wBACY,KAAK,CAAC,IAAI,CAAC,OAAO,CACpC,WAAW,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,sBAAsB,CAC5D;wBACmB,KAAK,CAAC,IAAI,CAAC,OAAO;;;;;;;;GAQvC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\n\nexport const StyledRegion = styled.div<{ innerRegion?: boolean }>(({ innerRegion, theme }) => {\n  return css`\n    background-color: ${theme.base.palette[\n      innerRegion ? 'primary-background' : 'secondary-background'\n    ]};\n    padding: calc(4 * ${theme.base.spacing});\n    display: flex;\n    justify-content: center;\n\n    button {\n      height: max-content;\n      align-self: center;\n    }\n  `;\n});\n\nStyledRegion.defaultProps = defaultThemeProp;\n"]}

package/jsx/core/FieldGroup/FieldGroup.stories.d.ts

@@ -0,0 +1,11 @@
+import { Meta, Story } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+interface FieldGroupStoryProps {
+    firstGroupName: string;
+    firstGroupCollapsible: boolean;
+    secondGroupName: string;
+    secondGroupCollapsible: boolean;
+}
+export declare const FieldGroupDemo: Story<FieldGroupStoryProps>;
+//# sourceMappingURL=FieldGroup.stories.d.ts.map

package/jsx/core/FieldGroup/FieldGroup.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldGroup.stories.d.ts","sourceRoot":"","sources":["../../../src/core/FieldGroup/FieldGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAY/C,wBAGU;AAEV,UAAU,oBAAoB;IAC5B,cAAc,EAAE,MAAM,CAAC;IACvB,qBAAqB,EAAE,OAAO,CAAC;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,sBAAsB,EAAE,OAAO,CAAC;CACjC;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,oBAAoB,CAmCtD,CAAC"}

package/jsx/core/FieldGroup/FieldGroupList.mocks.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import { FieldGroupListItemProps } from '@pega/cosmos-react-core';
+declare type FieldGroupReducerPayload = {
+    action: 'add';
+} | {
+    action: 'delete';
+    id: string;
+};
+export interface FieldMeta {
+    label: string;
+    type: 'text' | 'date' | 'file' | 'select' | 'textarea';
+}
+export interface GroupMeta {
+    label: string;
+    fields: FieldMeta[];
+}
+export declare const fieldGroupReducer: (groupMeta: GroupMeta, FieldRenderer: (props: FieldMeta) => JSX.Element | null) => (items: FieldGroupListItemProps[], payload: FieldGroupReducerPayload) => FieldGroupListItemProps[];
+export declare const DemoFieldRenderer: ({ label, type }: FieldMeta) => JSX.Element | null;
+export declare const demoGroupMeta: GroupMeta;
+export {};
+//# sourceMappingURL=FieldGroupList.mocks.d.ts.map

package/jsx/core/FieldGroup/FieldGroupList.mocks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldGroupList.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/FieldGroup/FieldGroupList.mocks.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAa,uBAAuB,EAAS,MAAM,yBAAyB,CAAC;AAEpF,aAAK,wBAAwB,GACzB;IACE,MAAM,EAAE,KAAK,CAAC;CACf,GACD;IACE,MAAM,EAAE,QAAQ,CAAC;IACjB,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAEN,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;CACxD;AAED,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,SAAS,EAAE,CAAC;CACrB;AAED,eAAO,MAAM,iBAAiB,cAChB,SAAS,yBAAyB,SAAS,KAAK,WAAW,GAAG,IAAI,aAErE,uBAAuB,EAAE,WACvB,wBAAwB,KAChC,uBAAuB,EAoBzB,CAAC;AAEJ,eAAO,MAAM,iBAAiB,oBAAqB,SAAS,uBAM3D,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,SAQ3B,CAAC"}

package/jsx/core/FieldGroup/FieldGroupList.mocks.jsx

@@ -0,0 +1,36 @@
+import { createUID, Input } from '@pega/cosmos-react-core';
+export const fieldGroupReducer = (groupMeta, FieldRenderer) => (items, payload) => {
+    switch (payload.action) {
+        case 'add':
+            return [
+                ...items,
+                {
+                    name: `${groupMeta.label} ${items.length + 1}`,
+                    id: createUID(),
+                    children: groupMeta.fields.map(props => <FieldRenderer {...props} key={props.label}/>)
+                }
+            ];
+        case 'delete':
+            return items
+                .filter(group => group.id !== payload.id)
+                .map((group, i) => ({ ...group, name: `${groupMeta.label} ${i + 1}` }));
+        default:
+            return items;
+    }
+};
+export const DemoFieldRenderer = ({ label, type }) => {
+    if (type === 'text') {
+        return <Input label={label}/>;
+    }
+    return null;
+};
+export const demoGroupMeta = {
+    label: 'Applicant',
+    fields: [
+        {
+            type: 'text',
+            label: 'Applicant name'
+        }
+    ]
+};
+//# sourceMappingURL=FieldGroupList.mocks.jsx.map

package/jsx/core/FieldGroup/FieldGroupList.mocks.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldGroupList.mocks.jsx","sourceRoot":"","sources":["../../../src/core/FieldGroup/FieldGroupList.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAA2B,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAqBpF,MAAM,CAAC,MAAM,iBAAiB,GAC5B,CAAC,SAAoB,EAAE,aAAuD,EAAE,EAAE,CAClF,CACE,KAAgC,EAChC,OAAiC,EACN,EAAE;IAC7B,QAAQ,OAAO,CAAC,MAAM,EAAE;QACtB,KAAK,KAAK;YACR,OAAO;gBACL,GAAG,KAAK;gBACR;oBACE,IAAI,EAAE,GAAG,SAAS,CAAC,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;oBAC9C,EAAE,EAAE,SAAS,EAAE;oBACf,QAAQ,EAAE,SAAS,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,EAAG,CAAC;iBACxF;aACF,CAAC;QAEJ,KAAK,QAAQ;YACX,OAAO,KAAK;iBACT,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,OAAO,CAAC,EAAE,CAAC;iBACxC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,EAAE,IAAI,EAAE,GAAG,SAAS,CAAC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;QAE5E;YACE,OAAO,KAAK,CAAC;KAChB;AACH,CAAC,CAAC;AAEJ,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,EAAa,EAAE,EAAE;IAC9D,IAAI,IAAI,KAAK,MAAM,EAAE;QACnB,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,EAAG,CAAC;KAChC;IAED,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAc;IACtC,KAAK,EAAE,WAAW;IAClB,MAAM,EAAE;QACN;YACE,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,gBAAgB;SACxB;KACF;CACF,CAAC","sourcesContent":["import { createUID, FieldGroupListItemProps, Input } from '@pega/cosmos-react-core';\n\ntype FieldGroupReducerPayload =\n  | {\n      action: 'add';\n    }\n  | {\n      action: 'delete';\n      id: string;\n    };\n\nexport interface FieldMeta {\n  label: string;\n  type: 'text' | 'date' | 'file' | 'select' | 'textarea';\n}\n\nexport interface GroupMeta {\n  label: string;\n  fields: FieldMeta[];\n}\n\nexport const fieldGroupReducer =\n  (groupMeta: GroupMeta, FieldRenderer: (props: FieldMeta) => JSX.Element | null) =>\n  (\n    items: FieldGroupListItemProps[],\n    payload: FieldGroupReducerPayload\n  ): FieldGroupListItemProps[] => {\n    switch (payload.action) {\n      case 'add':\n        return [\n          ...items,\n          {\n            name: `${groupMeta.label} ${items.length + 1}`,\n            id: createUID(),\n            children: groupMeta.fields.map(props => <FieldRenderer {...props} key={props.label} />)\n          }\n        ];\n\n      case 'delete':\n        return items\n          .filter(group => group.id !== payload.id)\n          .map((group, i) => ({ ...group, name: `${groupMeta.label} ${i + 1}` }));\n\n      default:\n        return items;\n    }\n  };\n\nexport const DemoFieldRenderer = ({ label, type }: FieldMeta) => {\n  if (type === 'text') {\n    return <Input label={label} />;\n  }\n\n  return null;\n};\n\nexport const demoGroupMeta: GroupMeta = {\n  label: 'Applicant',\n  fields: [\n    {\n      type: 'text',\n      label: 'Applicant name'\n    }\n  ]\n};\n"]}

package/jsx/core/FieldGroup/FieldGroupList.stories.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").FunctionComponent<import("@pega/cosmos-react-core").FieldGroupListProps & import("@pega/cosmos-react-core").ForwardProps>;
+};
+export default _default;
+export declare const ExpensesDemo: () => JSX.Element;
+export declare const InsuranceDemo: () => JSX.Element;
+export declare const FieldGroupListDemo: () => JSX.Element;
+//# sourceMappingURL=FieldGroupList.stories.d.ts.map

package/jsx/core/FieldGroup/FieldGroupList.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldGroupList.stories.d.ts","sourceRoot":"","sources":["../../../src/core/FieldGroup/FieldGroupList.stories.tsx"],"names":[],"mappings":";;;;;AAyBA,wBAGE;AAiDF,eAAO,MAAM,YAAY,mBAiDxB,CAAC;AAiCF,eAAO,MAAM,aAAa,mBAkDzB,CAAC;AAEF,eAAO,MAAM,kBAAkB,mBAwB9B,CAAC"}