@pega/cosmos-react-demos 5.0.0-dev.4.7 → 5.0.0-dev.4.9

package/jsx/core/File/FileInput.stories.jsx

@@ -1,97 +0,0 @@
-import { useState, useMemo, useCallback, useRef, useContext } from 'react';
-import { FileInput, createUID, useAfterInitialEffect, Flex, Link } from '@pega/cosmos-react-core';
-import { FileServiceContext } from '../../work/CaseView/FileService.mock';
-export default {
-    title: 'Core/File/Input',
-    component: FileInput
-};
-export const FileInputDemo = (args) => {
-    const { files, attachFile, cancelFile, deleteFile } = useContext(FileServiceContext);
-    const errCounts = useRef({ invalidType: 0, invalidSize: 0 });
-    const [hasError, setHasError] = useState(false);
-    const sizeLimit = args.sizeLimit || 100;
-    const onFilesAdded = useCallback((addedFiles) => {
-        errCounts.current = { invalidType: 0, invalidSize: 0 };
-        const newFiles = addedFiles.filter(f => {
-            let isValidSize = true;
-            if (f.size / 1000000 > sizeLimit) {
-                errCounts.current.invalidSize += 1;
-                isValidSize = false;
-            }
-            return isValidSize;
-        });
-        setHasError(newFiles.length < addedFiles.length);
-        newFiles.forEach((File) => {
-            const id = createUID();
-            attachFile({
-                id,
-                thumbnail: File.type.startsWith('image') ? URL.createObjectURL(File) : undefined,
-                name: File.name,
-                category: '',
-                File,
-                onCancel: () => {
-                    cancelFile(id);
-                }
-            });
-        });
-    }, [attachFile, deleteFile]);
-    useAfterInitialEffect(() => {
-        if (files.length === 0)
-            setHasError(false);
-    }, [files.length]);
-    const info = useMemo(() => {
-        return hasError
-            ? errCounts.current.invalidSize > 0 && (<div>{`File size must be less than ${sizeLimit}MB`}</div>)
-            : null;
-    }, [hasError]);
-    return (<FileInput label={args.label} labelHidden={args.labelHidden} multiple={args.multiple} status={hasError ? 'error' : undefined} info={info} required={args.required} disabled={args.disabled} onFilesAdded={onFilesAdded} files={files.map(file => {
-            return {
-                ...file,
-                onCancel: undefined,
-                onPreview: () => { },
-                onDownload: () => { },
-                onDelete: () => {
-                    deleteFile(file.id);
-                }
-            };
-            return file;
-        })} additionalInfo={args.showAdditionalInfo
-            ? {
-                heading: 'Additional Info',
-                content: (<Flex container={{ direction: 'column', alignItems: 'start', gap: 2 }}>
-                  <p>
-                    Lorem ipsum dolor sit amet, consectetur it, sed do tempor incididunt ut labore
-                    magna aliqua. Nibh praesent tristique magna sit amet. Nec tincidunt praesent
-                    semper feugiat nibh sed pulvinar proin gravida.
-                  </p>
-                  <p>
-                    Pharetra pharetra massa massa ultricies mi quis hendrerit dolor. Est velit
-                    egestas dui id ornare arcu odio ut. Varius sit amet mattis vulputate enim nulla
-                    aliquet porttitor lacus.
-                  </p>
-                  <Link href='/' target='_blank'>
-                    Neque vitae
-                  </Link>
-                </Flex>)
-            }
-            : undefined}/>);
-};
-FileInputDemo.args = {
-    multiple: true,
-    sizeLimit: 100,
-    label: 'File input label',
-    labelHidden: false,
-    required: false,
-    disabled: false,
-    showAdditionalInfo: false
-};
-FileInputDemo.argTypes = {
-    multiple: { control: { type: 'boolean' } },
-    sizeLimit: { control: { type: 'number' } },
-    label: { control: { type: 'text' } },
-    labelHidden: { control: { type: 'boolean' } },
-    required: { control: { type: 'boolean' } },
-    disabled: { control: { type: 'boolean' } },
-    showAdditionalInfo: { control: { type: 'boolean' } }
-};
-//# sourceMappingURL=FileInput.stories.jsx.map

package/jsx/core/File/FileInput.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"FileInput.stories.jsx","sourceRoot":"","sources":["../../../src/core/File/FileInput.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useState, useMemo, useCallback, useRef, useContext } from 'react';\n\nimport { FileInput, createUID, useAfterInitialEffect, Flex, Link } from '@pega/cosmos-react-core';\nimport type { FileInputProps } from '@pega/cosmos-react-core';\n\nimport { FileServiceContext } from '../../work/CaseView/FileService.mock';\n\nexport default {\n  title: 'Core/File/Input',\n  component: FileInput\n} as Meta;\n\ninterface FileInputStoryProps extends FileInputProps {\n  sizeLimit?: number;\n  showAdditionalInfo?: boolean;\n}\n\nexport const FileInputDemo: StoryFn<FileInputStoryProps> = (args: FileInputStoryProps) => {\n  const { files, attachFile, cancelFile, deleteFile } = useContext(FileServiceContext);\n  const errCounts = useRef({ invalidType: 0, invalidSize: 0 });\n  const [hasError, setHasError] = useState(false);\n\n  const sizeLimit = args.sizeLimit || 100;\n\n  // Fires anytime files are added to the input either through selection or drop\n  const onFilesAdded = useCallback(\n    (addedFiles: File[]) => {\n      errCounts.current = { invalidType: 0, invalidSize: 0 };\n\n      const newFiles = addedFiles.filter(f => {\n        let isValidSize = true;\n\n        if (f.size / 1000000 > sizeLimit) {\n          errCounts.current.invalidSize += 1;\n          isValidSize = false;\n        }\n\n        return isValidSize;\n      });\n\n      setHasError(newFiles.length < addedFiles.length);\n\n      newFiles.forEach((File: File) => {\n        const id = createUID();\n        attachFile({\n          id,\n          thumbnail: File.type.startsWith('image') ? URL.createObjectURL(File) : undefined,\n          name: File.name,\n          category: '',\n          File,\n          onCancel: () => {\n            cancelFile(id);\n          }\n        });\n      });\n    },\n    [attachFile, deleteFile]\n  );\n\n  useAfterInitialEffect(() => {\n    if (files.length === 0) setHasError(false);\n  }, [files.length]);\n\n  const info = useMemo(() => {\n    return hasError\n      ? errCounts.current.invalidSize > 0 && (\n          <div>{`File size must be less than ${sizeLimit}MB`}</div>\n        )\n      : null;\n  }, [hasError]);\n\n  return (\n    <FileInput\n      label={args.label}\n      labelHidden={args.labelHidden}\n      multiple={args.multiple}\n      status={hasError ? 'error' : undefined}\n      info={info}\n      required={args.required}\n      disabled={args.disabled}\n      onFilesAdded={onFilesAdded}\n      files={files.map(file => {\n        return {\n          ...file,\n          onCancel: undefined,\n          onPreview: () => {},\n          onDownload: () => {},\n          onDelete: () => {\n            deleteFile(file.id);\n          }\n        };\n\n        return file;\n      })}\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              heading: 'Additional Info',\n              content: (\n                <Flex container={{ direction: 'column', alignItems: 'start', gap: 2 }}>\n                  <p>\n                    Lorem ipsum dolor sit amet, consectetur it, sed do tempor incididunt ut labore\n                    magna aliqua. Nibh praesent tristique magna sit amet. Nec tincidunt praesent\n                    semper feugiat nibh sed pulvinar proin gravida.\n                  </p>\n                  <p>\n                    Pharetra pharetra massa massa ultricies mi quis hendrerit dolor. Est velit\n                    egestas dui id ornare arcu odio ut. Varius sit amet mattis vulputate enim nulla\n                    aliquet porttitor lacus.\n                  </p>\n                  <Link href='/' target='_blank'>\n                    Neque vitae\n                  </Link>\n                </Flex>\n              )\n            }\n          : undefined\n      }\n    />\n  );\n};\n\nFileInputDemo.args = {\n  multiple: true,\n  sizeLimit: 100,\n  label: 'File input label',\n  labelHidden: false,\n  required: false,\n  disabled: false,\n  showAdditionalInfo: false\n};\n\nFileInputDemo.argTypes = {\n  multiple: { control: { type: 'boolean' } },\n  sizeLimit: { control: { type: 'number' } },\n  label: { control: { type: 'text' } },\n  labelHidden: { control: { type: 'boolean' } },\n  required: { control: { type: 'boolean' } },\n  disabled: { control: { type: 'boolean' } },\n  showAdditionalInfo: { control: { type: 'boolean' } }\n};\n"]}

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

@@ -1,10 +0,0 @@
-export declare const StyledFlexContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    height?: number | undefined;
-    width?: number | undefined;
-}, never>;
-export declare const StyledFlexItem: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    inActive?: boolean | undefined;
-    noPadding?: boolean | undefined;
-    width?: number | undefined;
-}, never>;
-//# sourceMappingURL=Flex.styles.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Flex.styles.d.ts","sourceRoot":"","sources":["../../../src/core/Flex/Flex.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,mBAAmB;;;SAiB/B,CAAC;AAIF,eAAO,MAAM,cAAc;;;;SAwBzB,CAAC"}

package/jsx/core/Flex/Flex.styles.js

@@ -1,41 +0,0 @@
-import styled, { css } from 'styled-components';
-import { calculateFontSize, defaultThemeProp } from '@pega/cosmos-react-core';
-export const StyledFlexContainer = styled.div(({ height, theme, width }) => {
-    return css `
-      border: calc(0.5 * ${theme.base.spacing}) solid ${theme.base.colors.black};
-      background-color: ${theme.base.colors.blue.light};
-
-      ${height &&
-        css `
-        height: ${height}rem;
-      `}
-
-      ${width &&
-        css `
-        width: ${width}rem;
-      `}
-    `;
-});
-StyledFlexContainer.defaultProps = defaultThemeProp;
-export const StyledFlexItem = styled.div(({ inActive, noPadding, theme, width }) => {
-    const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);
-    return css `
-    border: calc(0.5 * ${theme.base.spacing}) solid ${theme.base.colors.black};
-    padding: ${noPadding ? '0' : `calc(4 * ${theme.base.spacing}) `};
-    text-align: center;
-    background-color: ${inActive ? theme.base.colors.white : theme.base.colors.orange.light};
-    color: ${theme.base.colors.black};
-
-    ${width &&
-        css `
-      width: ${width}rem;
-    `}
-
-    span {
-      font-size: ${fontSize.xl};
-      font-weight: ${theme.base['font-weight'].bold};
-    }
-  `;
-});
-StyledFlexItem.defaultProps = defaultThemeProp;
-//# sourceMappingURL=Flex.styles.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Flex.styles.js","sourceRoot":"","sources":["../../../src/core/Flex/Flex.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE9E,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAC3C,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3B,OAAO,GAAG,CAAA;2BACa,KAAK,CAAC,IAAI,CAAC,OAAO,WAAW,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;0BACrD,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK;;QAE9C,MAAM;QACR,GAAG,CAAA;kBACS,MAAM;OACjB;;QAEC,KAAK;QACP,GAAG,CAAA;iBACQ,KAAK;OACf;KACF,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAIrC,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3C,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IAEtF,OAAO,GAAG,CAAA;yBACa,KAAK,CAAC,IAAI,CAAC,OAAO,WAAW,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;eAC9D,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,YAAY,KAAK,CAAC,IAAI,CAAC,OAAO,IAAI;;wBAE3C,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK;aAC9E,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;MAE9B,KAAK;QACP,GAAG,CAAA;eACQ,KAAK;KACf;;;mBAGc,QAAQ,CAAC,EAAE;qBACT,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,IAAI;;GAEhD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { calculateFontSize, defaultThemeProp } from '@pega/cosmos-react-core';\n\nexport const StyledFlexContainer = styled.div<{ height?: number; width?: number }>(\n  ({ height, theme, width }) => {\n    return css`\n      border: calc(0.5 * ${theme.base.spacing}) solid ${theme.base.colors.black};\n      background-color: ${theme.base.colors.blue.light};\n\n      ${height &&\n      css`\n        height: ${height}rem;\n      `}\n\n      ${width &&\n      css`\n        width: ${width}rem;\n      `}\n    `;\n  }\n);\n\nStyledFlexContainer.defaultProps = defaultThemeProp;\n\nexport const StyledFlexItem = styled.div<{\n  inActive?: boolean;\n  noPadding?: boolean;\n  width?: number;\n}>(({ inActive, noPadding, theme, width }) => {\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n  return css`\n    border: calc(0.5 * ${theme.base.spacing}) solid ${theme.base.colors.black};\n    padding: ${noPadding ? '0' : `calc(4 * ${theme.base.spacing}) `};\n    text-align: center;\n    background-color: ${inActive ? theme.base.colors.white : theme.base.colors.orange.light};\n    color: ${theme.base.colors.black};\n\n    ${width &&\n    css`\n      width: ${width}rem;\n    `}\n\n    span {\n      font-size: ${fontSize.xl};\n      font-weight: ${theme.base['font-weight'].bold};\n    }\n  `;\n});\n\nStyledFlexItem.defaultProps = defaultThemeProp;\n"]}

package/jsx/core/Flex/FlexContainer.stories.d.ts

@@ -1,21 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-import type { FlexContainerProps } from '@pega/cosmos-react-core';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
-export default _default;
-interface FlexStoryProps {
-    direction?: FlexContainerProps['direction'];
-    gap?: FlexContainerProps['gap'];
-    pad?: FlexContainerProps['pad'];
-    wrap?: FlexContainerProps['wrap'];
-    justify?: FlexContainerProps['justify'];
-    alignItems?: FlexContainerProps['alignItems'];
-    alignContent?: FlexContainerProps['alignContent'];
-}
-export declare const Direction: StoryFn<FlexStoryProps>;
-export declare const GapAndPadding: StoryFn<FlexStoryProps>;
-export declare const Wrap: StoryFn<FlexStoryProps>;
-export declare const Justify: StoryFn<FlexStoryProps>;
-export declare const AlignItems: StoryFn<FlexStoryProps>;
-export declare const AlignContent: StoryFn<FlexStoryProps>;
-export declare const ResponsiveFlex: StoryFn;
-//# sourceMappingURL=FlexContainer.stories.d.ts.map

package/jsx/core/Flex/FlexContainer.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FlexContainer.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Flex/FlexContainer.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAGtD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;;AAIlE,wBAMU;AAEV,UAAU,cAAc;IACtB,SAAS,CAAC,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC5C,GAAG,CAAC,EAAE,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAChC,GAAG,CAAC,EAAE,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAChC,IAAI,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,CAAC;IAClC,OAAO,CAAC,EAAE,kBAAkB,CAAC,SAAS,CAAC,CAAC;IACxC,UAAU,CAAC,EAAE,kBAAkB,CAAC,YAAY,CAAC,CAAC;IAC9C,YAAY,CAAC,EAAE,kBAAkB,CAAC,cAAc,CAAC,CAAC;CACnD;AAED,eAAO,MAAM,SAAS,EAAE,OAAO,CAAC,cAAc,CAc7C,CAAC;AAaF,eAAO,MAAM,aAAa,EAAE,OAAO,CAAC,cAAc,CAcjD,CAAC;AAYF,eAAO,MAAM,IAAI,EAAE,OAAO,CAAC,cAAc,CAoBxC,CAAC;AAUF,eAAO,MAAM,OAAO,EAAE,OAAO,CAAC,cAAc,CAc3C,CAAC;AAaF,eAAO,MAAM,UAAU,EAAE,OAAO,CAAC,cAAc,CAoB9C,CAAC;AAaF,eAAO,MAAM,YAAY,EAAE,OAAO,CAAC,cAAc,CAyBhD,CAAC;AAaF,eAAO,MAAM,cAAc,EAAE,OAsB5B,CAAC"}

package/jsx/core/Flex/FlexContainer.stories.jsx

@@ -1,164 +0,0 @@
-import { Flex, Text } from '@pega/cosmos-react-core';
-import { StyledFlexContainer, StyledFlexItem } from './Flex.styles';
-export default {
-    title: 'Core/Flex/Container',
-    component: Flex,
-    parameters: {
-        layout: 'fullscreen'
-    }
-};
-export const Direction = (args) => {
-    return (<Flex container={{ direction: args.direction, pad: 2 }} as={StyledFlexContainer}>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 1</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 2</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 3</Text>
-      </Flex>
-    </Flex>);
-};
-Direction.args = {
-    direction: 'row'
-};
-Direction.argTypes = {
-    direction: {
-        options: ['row', 'column', 'row-reverse', 'column-reverse'],
-        control: { type: 'select' }
-    }
-};
-export const GapAndPadding = (args) => {
-    return (<Flex container={{ pad: args.pad, gap: args.gap }} as={StyledFlexContainer}>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 1</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 2</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 3</Text>
-      </Flex>
-    </Flex>);
-};
-GapAndPadding.args = {
-    pad: 1,
-    gap: 1
-};
-GapAndPadding.argTypes = {
-    pad: { control: { type: 'number' } },
-    gap: { control: { type: 'number' } }
-};
-export const Wrap = (args) => {
-    return (<Flex container={{ wrap: args.wrap, pad: 2 }} as={StyledFlexContainer} width={35}>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 1</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 2</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 3</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 4</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 5</Text>
-      </Flex>
-    </Flex>);
-};
-Wrap.args = {
-    wrap: 'nowrap'
-};
-Wrap.argTypes = {
-    wrap: { options: ['nowrap', 'wrap', 'wrap-reverse'], control: { type: 'select' } }
-};
-export const Justify = (args) => {
-    return (<Flex container={{ justify: args.justify, pad: 2 }} as={StyledFlexContainer}>
-      <StyledFlexItem>
-        <Text>Item 1</Text>
-      </StyledFlexItem>
-      <StyledFlexItem>
-        <Text>Item 2</Text>
-      </StyledFlexItem>
-      <StyledFlexItem>
-        <Text>Item 3</Text>
-      </StyledFlexItem>
-    </Flex>);
-};
-Justify.args = {
-    justify: 'start'
-};
-Justify.argTypes = {
-    justify: {
-        options: ['start', 'end', 'center', 'between', 'around', 'evenly'],
-        control: { type: 'select' }
-    }
-};
-export const AlignItems = (args) => {
-    return (<Flex container={{ alignItems: args.alignItems, pad: 2 }} as={StyledFlexContainer} height={15} width={30}>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 1</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem} noPadding>
-        <Text>Item 2</Text>
-      </Flex>
-      <Flex container={{ direction: 'column' }} item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 3 - First line</Text>
-        <Text>Item 3 - Second line</Text>
-      </Flex>
-    </Flex>);
-};
-AlignItems.args = {
-    alignItems: 'stretch'
-};
-AlignItems.argTypes = {
-    alignItems: {
-        options: ['stretch', 'start', 'end', 'center', 'baseline'],
-        control: { type: 'select' }
-    }
-};
-export const AlignContent = (args) => {
-    return (<Flex container={{ alignContent: args.alignContent, wrap: 'wrap', pad: 2 }} as={StyledFlexContainer} height={20} width={30}>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 1</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 2</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 3</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 4</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 5</Text>
-      </Flex>
-    </Flex>);
-};
-AlignContent.args = {
-    alignContent: 'stretch'
-};
-AlignContent.argTypes = {
-    alignContent: {
-        options: ['stretch', 'start', 'end', 'center', 'between', 'around'],
-        control: { type: 'select' }
-    }
-};
-export const ResponsiveFlex = () => {
-    return (<Flex container={{ pad: 1, gap: 6 }} xl={{ container: { gap: 12 } }} lg={{ container: { gap: 9 } }} md={{ container: { gap: 6 } }} sm={{ container: { gap: 3 } }} xs={{ container: { gap: 0 } }} as={StyledFlexContainer}>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 1</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 2</Text>
-      </Flex>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem}>
-        <Text>Item 3</Text>
-      </Flex>
-    </Flex>);
-};
-//# sourceMappingURL=FlexContainer.stories.jsx.map

package/jsx/core/Flex/FlexContainer.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"FlexContainer.stories.jsx","sourceRoot":"","sources":["../../../src/core/Flex/FlexContainer.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\n\nimport { Flex, Text } from '@pega/cosmos-react-core';\nimport type { FlexContainerProps } from '@pega/cosmos-react-core';\n\nimport { StyledFlexContainer, StyledFlexItem } from './Flex.styles';\n\nexport default {\n  title: 'Core/Flex/Container',\n  component: Flex,\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\ninterface FlexStoryProps {\n  direction?: FlexContainerProps['direction'];\n  gap?: FlexContainerProps['gap'];\n  pad?: FlexContainerProps['pad'];\n  wrap?: FlexContainerProps['wrap'];\n  justify?: FlexContainerProps['justify'];\n  alignItems?: FlexContainerProps['alignItems'];\n  alignContent?: FlexContainerProps['alignContent'];\n}\n\nexport const Direction: StoryFn<FlexStoryProps> = (args: FlexStoryProps) => {\n  return (\n    <Flex container={{ direction: args.direction, pad: 2 }} as={StyledFlexContainer}>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 1</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 2</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 3</Text>\n      </Flex>\n    </Flex>\n  );\n};\n\nDirection.args = {\n  direction: 'row'\n};\n\nDirection.argTypes = {\n  direction: {\n    options: ['row', 'column', 'row-reverse', 'column-reverse'],\n    control: { type: 'select' }\n  }\n};\n\nexport const GapAndPadding: StoryFn<FlexStoryProps> = (args: FlexStoryProps) => {\n  return (\n    <Flex container={{ pad: args.pad, gap: args.gap }} as={StyledFlexContainer}>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 1</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 2</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 3</Text>\n      </Flex>\n    </Flex>\n  );\n};\n\nGapAndPadding.args = {\n  pad: 1,\n  gap: 1\n};\n\nGapAndPadding.argTypes = {\n  pad: { control: { type: 'number' } },\n  gap: { control: { type: 'number' } }\n};\n\nexport const Wrap: StoryFn<FlexStoryProps> = (args: FlexStoryProps) => {\n  return (\n    <Flex container={{ wrap: args.wrap, pad: 2 }} as={StyledFlexContainer} width={35}>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 1</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 2</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 3</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 4</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 5</Text>\n      </Flex>\n    </Flex>\n  );\n};\n\nWrap.args = {\n  wrap: 'nowrap'\n};\n\nWrap.argTypes = {\n  wrap: { options: ['nowrap', 'wrap', 'wrap-reverse'], control: { type: 'select' } }\n};\n\nexport const Justify: StoryFn<FlexStoryProps> = (args: FlexStoryProps) => {\n  return (\n    <Flex container={{ justify: args.justify, pad: 2 }} as={StyledFlexContainer}>\n      <StyledFlexItem>\n        <Text>Item 1</Text>\n      </StyledFlexItem>\n      <StyledFlexItem>\n        <Text>Item 2</Text>\n      </StyledFlexItem>\n      <StyledFlexItem>\n        <Text>Item 3</Text>\n      </StyledFlexItem>\n    </Flex>\n  );\n};\n\nJustify.args = {\n  justify: 'start'\n};\n\nJustify.argTypes = {\n  justify: {\n    options: ['start', 'end', 'center', 'between', 'around', 'evenly'],\n    control: { type: 'select' }\n  }\n};\n\nexport const AlignItems: StoryFn<FlexStoryProps> = (args: FlexStoryProps) => {\n  return (\n    <Flex\n      container={{ alignItems: args.alignItems, pad: 2 }}\n      as={StyledFlexContainer}\n      height={15}\n      width={30}\n    >\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 1</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem} noPadding>\n        <Text>Item 2</Text>\n      </Flex>\n      <Flex container={{ direction: 'column' }} item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 3 - First line</Text>\n        <Text>Item 3 - Second line</Text>\n      </Flex>\n    </Flex>\n  );\n};\n\nAlignItems.args = {\n  alignItems: 'stretch'\n};\n\nAlignItems.argTypes = {\n  alignItems: {\n    options: ['stretch', 'start', 'end', 'center', 'baseline'],\n    control: { type: 'select' }\n  }\n};\n\nexport const AlignContent: StoryFn<FlexStoryProps> = (args: FlexStoryProps) => {\n  return (\n    <Flex\n      container={{ alignContent: args.alignContent, wrap: 'wrap', pad: 2 }}\n      as={StyledFlexContainer}\n      height={20}\n      width={30}\n    >\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 1</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 2</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 3</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 4</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 5</Text>\n      </Flex>\n    </Flex>\n  );\n};\n\nAlignContent.args = {\n  alignContent: 'stretch'\n};\n\nAlignContent.argTypes = {\n  alignContent: {\n    options: ['stretch', 'start', 'end', 'center', 'between', 'around'],\n    control: { type: 'select' }\n  }\n};\n\nexport const ResponsiveFlex: StoryFn = () => {\n  return (\n    <Flex\n      container={{ pad: 1, gap: 6 }}\n      xl={{ container: { gap: 12 } }}\n      lg={{ container: { gap: 9 } }}\n      md={{ container: { gap: 6 } }}\n      sm={{ container: { gap: 3 } }}\n      xs={{ container: { gap: 0 } }}\n      as={StyledFlexContainer}\n    >\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 1</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 2</Text>\n      </Flex>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem}>\n        <Text>Item 3</Text>\n      </Flex>\n    </Flex>\n  );\n};\n"]}

package/jsx/core/Flex/FlexItem.stories.d.ts

@@ -1,13 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-import type { FlexItemProps } from '@pega/cosmos-react-core';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
-export default _default;
-interface FlexStoryProps {
-    alignSelf?: FlexItemProps['alignSelf'];
-    grow?: FlexItemProps['grow'];
-    shrink?: FlexItemProps['shrink'];
-}
-export declare const AlignSelf: StoryFn<FlexStoryProps>;
-export declare const Grow: StoryFn<FlexStoryProps>;
-export declare const Shrink: StoryFn<FlexStoryProps>;
-//# sourceMappingURL=FlexItem.stories.d.ts.map

package/jsx/core/Flex/FlexItem.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FlexItem.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Flex/FlexItem.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAGtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;;AAI7D,wBAMU;AAEV,UAAU,cAAc;IACtB,SAAS,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;IACvC,IAAI,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;CAClC;AAED,eAAO,MAAM,SAAS,EAAE,OAAO,CAAC,cAAc,CAe7C,CAAC;AAaF,eAAO,MAAM,IAAI,EAAE,OAAO,CAAC,cAAc,CAcxC,CAAC;AAUF,eAAO,MAAM,MAAM,EAAE,OAAO,CAAC,cAAc,CAc1C,CAAC"}

package/jsx/core/Flex/FlexItem.stories.jsx

@@ -1,71 +0,0 @@
-import { Flex, Text } from '@pega/cosmos-react-core';
-import { StyledFlexContainer, StyledFlexItem } from './Flex.styles';
-export default {
-    title: 'Core/Flex/Item',
-    component: Flex,
-    parameters: {
-        layout: 'fullscreen'
-    }
-};
-export const AlignSelf = (args) => {
-    return (<Flex container={{ alignItems: 'start', pad: 2 }} as={StyledFlexContainer} height={10}>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem} inActive>
-        <Text>Item 1</Text>
-      </Flex>
-      <Flex item={{ grow: 1, alignSelf: args.alignSelf }} as={StyledFlexItem} noPadding>
-        <Text>Item 2</Text>
-      </Flex>
-      <Flex container={{ direction: 'column' }} item={{ grow: 1 }} as={StyledFlexItem} inActive>
-        <Text>Item 3 - First line</Text>
-        <Text>Item 3 - Second line</Text>
-      </Flex>
-    </Flex>);
-};
-AlignSelf.args = {
-    alignSelf: 'auto'
-};
-AlignSelf.argTypes = {
-    alignSelf: {
-        options: ['auto', 'start', 'end', 'baseline', 'center', 'stretch'],
-        control: { type: 'select' }
-    }
-};
-export const Grow = (args) => {
-    return (<Flex container={{ pad: 2 }} as={StyledFlexContainer}>
-      <Flex item={{ grow: 1 }} as={StyledFlexItem} inActive>
-        <Text>Grow: 1</Text>
-      </Flex>
-      <Flex item={{ grow: args.grow }} as={StyledFlexItem}>
-        <Text>Grow: {args.grow}</Text>
-      </Flex>
-      <Flex item={{ grow: 0 }} as={StyledFlexItem} inActive>
-        <Text>Grow: 0</Text>
-      </Flex>
-    </Flex>);
-};
-Grow.args = {
-    grow: 0
-};
-Grow.argTypes = {
-    grow: { control: { type: 'number' } }
-};
-export const Shrink = (args) => {
-    return (<Flex container={{ pad: 2 }} as={StyledFlexContainer} width={42}>
-      <Flex item={{ shrink: 1 }} as={StyledFlexItem} width={15} inActive>
-        <Text>Shrink: 1</Text>
-      </Flex>
-      <Flex item={{ shrink: args.shrink }} as={StyledFlexItem} width={15}>
-        <Text>Shrink: {args.shrink}</Text>
-      </Flex>
-      <Flex item={{ shrink: 0 }} as={StyledFlexItem} width={15} inActive>
-        <Text>Shrink: 0</Text>
-      </Flex>
-    </Flex>);
-};
-Shrink.args = {
-    shrink: 0
-};
-Shrink.argTypes = {
-    shrink: { control: { type: 'number' } }
-};
-//# sourceMappingURL=FlexItem.stories.jsx.map

package/jsx/core/Flex/FlexItem.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"FlexItem.stories.jsx","sourceRoot":"","sources":["../../../src/core/Flex/FlexItem.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\n\nimport { Flex, Text } from '@pega/cosmos-react-core';\nimport type { FlexItemProps } from '@pega/cosmos-react-core';\n\nimport { StyledFlexContainer, StyledFlexItem } from './Flex.styles';\n\nexport default {\n  title: 'Core/Flex/Item',\n  component: Flex,\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\ninterface FlexStoryProps {\n  alignSelf?: FlexItemProps['alignSelf'];\n  grow?: FlexItemProps['grow'];\n  shrink?: FlexItemProps['shrink'];\n}\n\nexport const AlignSelf: StoryFn<FlexStoryProps> = (args: FlexStoryProps) => {\n  return (\n    <Flex container={{ alignItems: 'start', pad: 2 }} as={StyledFlexContainer} height={10}>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem} inActive>\n        <Text>Item 1</Text>\n      </Flex>\n      <Flex item={{ grow: 1, alignSelf: args.alignSelf }} as={StyledFlexItem} noPadding>\n        <Text>Item 2</Text>\n      </Flex>\n      <Flex container={{ direction: 'column' }} item={{ grow: 1 }} as={StyledFlexItem} inActive>\n        <Text>Item 3 - First line</Text>\n        <Text>Item 3 - Second line</Text>\n      </Flex>\n    </Flex>\n  );\n};\n\nAlignSelf.args = {\n  alignSelf: 'auto'\n};\n\nAlignSelf.argTypes = {\n  alignSelf: {\n    options: ['auto', 'start', 'end', 'baseline', 'center', 'stretch'],\n    control: { type: 'select' }\n  }\n};\n\nexport const Grow: StoryFn<FlexStoryProps> = (args: FlexStoryProps) => {\n  return (\n    <Flex container={{ pad: 2 }} as={StyledFlexContainer}>\n      <Flex item={{ grow: 1 }} as={StyledFlexItem} inActive>\n        <Text>Grow: 1</Text>\n      </Flex>\n      <Flex item={{ grow: args.grow }} as={StyledFlexItem}>\n        <Text>Grow: {args.grow}</Text>\n      </Flex>\n      <Flex item={{ grow: 0 }} as={StyledFlexItem} inActive>\n        <Text>Grow: 0</Text>\n      </Flex>\n    </Flex>\n  );\n};\n\nGrow.args = {\n  grow: 0\n};\n\nGrow.argTypes = {\n  grow: { control: { type: 'number' } }\n};\n\nexport const Shrink: StoryFn<FlexStoryProps> = (args: FlexStoryProps) => {\n  return (\n    <Flex container={{ pad: 2 }} as={StyledFlexContainer} width={42}>\n      <Flex item={{ shrink: 1 }} as={StyledFlexItem} width={15} inActive>\n        <Text>Shrink: 1</Text>\n      </Flex>\n      <Flex item={{ shrink: args.shrink }} as={StyledFlexItem} width={15}>\n        <Text>Shrink: {args.shrink}</Text>\n      </Flex>\n      <Flex item={{ shrink: 0 }} as={StyledFlexItem} width={15} inActive>\n        <Text>Shrink: 0</Text>\n      </Flex>\n    </Flex>\n  );\n};\n\nShrink.args = {\n  shrink: 0\n};\n\nShrink.argTypes = {\n  shrink: { control: { type: 'number' } }\n};\n"]}

package/jsx/core/Form/Form.mocks.d.ts

@@ -1,14 +0,0 @@
-/// <reference types="react" />
-export declare const FormContent: ({ cols, heading, description, showActions }: {
-    cols: number;
-    showActions: boolean;
-    heading?: string | undefined;
-    description?: string | undefined;
-}) => import("react").JSX.Element | null;
-export declare const ReadOnlyFormContent: ({ cols, heading, description, showActions }: {
-    cols: number;
-    showActions: boolean;
-    heading?: string | undefined;
-    description?: string | undefined;
-}) => import("react").JSX.Element | null;
-//# sourceMappingURL=Form.mocks.d.ts.map

package/jsx/core/Form/Form.mocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Form.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Form/Form.mocks.tsx"],"names":[],"mappings":";AAkGA,eAAO,MAAM,WAAW;UAMhB,MAAM;iBACC,OAAO;;;wCAiMrB,CAAC;AAEF,eAAO,MAAM,mBAAmB;UAMxB,MAAM;iBACC,OAAO;;;wCAkKrB,CAAC"}