@pega/cosmos-react-demos 6.6.0 → 6.6.1

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

@@ -1,103 +0,0 @@
-import { useState, useMemo, useCallback, useRef, useContext } from 'react';
-import { FileInput, createUID, useAfterInitialEffect, Flex, Link } from '@pega/cosmos-react-core';
-import { FileServiceContext } from './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' : args.status} info={info || args.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
-            ? {
-                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,
-    info: '',
-    status: undefined,
-    required: false,
-    disabled: false,
-    showAdditionalInfo: false
-};
-FileInputDemo.argTypes = {
-    multiple: { control: { type: 'boolean' } },
-    sizeLimit: { control: { type: 'number' } },
-    label: { control: { type: 'text' } },
-    labelHidden: { control: { type: 'boolean' } },
-    info: { control: { type: 'text' } },
-    status: {
-        options: [undefined, 'success', 'warning', 'error', 'pending'],
-        control: { type: 'select' }
-    },
-    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 './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' : args.status}\n      info={info || args.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              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  info: '',\n  status: undefined,\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  info: { control: { type: 'text' } },\n  status: {\n    options: [undefined, 'success', 'warning', 'error', 'pending'],\n    control: { type: 'select' }\n  },\n  required: { control: { type: 'boolean' } },\n  disabled: { control: { type: 'boolean' } },\n  showAdditionalInfo: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/core/File/FileService.mock.d.ts

@@ -1,28 +0,0 @@
-import type { ReactNode, FunctionComponent, Dispatch, SetStateAction } from 'react';
-import type { FileUploadItemProps, OmitStrict } from '@pega/cosmos-react-core';
-export interface MockFileAttachmentResource {
-    id: string;
-    name: string;
-    category: string;
-    thumbnail?: string;
-    createDate?: number;
-    modifiedDate?: number;
-}
-export interface MockFileUploadItem extends Pick<MockFileAttachmentResource, 'id' | 'category'>, OmitStrict<FileUploadItemProps, 'id'> {
-    File: File;
-}
-export interface FileServiceContextValue {
-    files: (MockFileAttachmentResource | MockFileUploadItem)[];
-    setFiles: Dispatch<SetStateAction<FileServiceContextValue['files']>>;
-    attachFile: (file: MockFileUploadItem) => void;
-    cancelFile: (id: MockFileAttachmentResource['id']) => void;
-    deleteFile: (id: MockFileAttachmentResource['id']) => void;
-}
-export declare const FileServiceContext: import("react").Context<FileServiceContextValue>;
-export declare const mockCategories: ('HR' | 'Marketing' | 'Sales' | 'Accounting' | 'Engineering')[];
-export declare const mockAttachmentListRequest: () => Promise<MockFileAttachmentResource[]>;
-declare const Provider: FunctionComponent<{
-    children: ReactNode;
-}>;
-export default Provider;
-//# sourceMappingURL=FileService.mock.d.ts.map

package/jsx/core/File/FileService.mock.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FileService.mock.d.ts","sourceRoot":"","sources":["../../../src/core/File/FileService.mock.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAGpF,OAAO,KAAK,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAK/E,MAAM,WAAW,0BAA0B;IACzC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAKD,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,0BAA0B,EAAE,IAAI,GAAG,UAAU,CAAC,EACzD,UAAU,CAAC,mBAAmB,EAAE,IAAI,CAAC;IACvC,IAAI,EAAE,IAAI,CAAC;CACZ;AAKD,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,CAAC,0BAA0B,GAAG,kBAAkB,CAAC,EAAE,CAAC;IAC3D,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,uBAAuB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;IACrE,UAAU,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC/C,UAAU,EAAE,CAAC,EAAE,EAAE,0BAA0B,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC3D,UAAU,EAAE,CAAC,EAAE,EAAE,0BAA0B,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;CAC5D;AAKD,eAAO,MAAM,kBAAkB,kDAM7B,CAAC;AAuDH,eAAO,MAAM,cAAc,EAAE,CAAC,IAAI,GAAG,WAAW,GAAG,OAAO,GAAG,YAAY,GAAG,aAAa,CAAC,EAMzF,CAAC;AAEF,eAAO,MAAM,yBAAyB,QAAO,QAAQ,0BAA0B,EAAE,CA+BhF,CAAC;AAKF,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,CAwFxD,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/jsx/core/File/FileService.mock.jsx

@@ -1,139 +0,0 @@
-import { createContext, useState, useCallback, useMemo } from 'react';
-import { createUID, hasProp, useAfterInitialEffect } from '@pega/cosmos-react-core';
-export const FileServiceContext = createContext({
-    files: [],
-    setFiles: () => { },
-    attachFile: () => { },
-    cancelFile: () => { },
-    deleteFile: () => { }
-});
-const uploadsInProgress = {};
-const postFile = ({ file, onLoadStart, onProgress, onLoad }) => {
-    const xhr = new XMLHttpRequest();
-    const fd = new FormData();
-    uploadsInProgress[file.id] = xhr;
-    xhr.upload.onloadstart = () => {
-        onLoadStart(file, 0);
-    };
-    xhr.upload.onprogress = ({ lengthComputable, loaded, total }) => {
-        if (lengthComputable) {
-            onProgress(file, (loaded / total) * 100);
-        }
-    };
-    xhr.upload.onload = () => {
-        onLoad(file);
-    };
-    xhr.open('POST', 'http://cosmos.eng.pega.com/attachments');
-    xhr.setRequestHeader('Content-Type', 'multipart/form-data');
-    fd.append('attachments', file.File);
-    xhr.send(fd);
-    return xhr;
-};
-const getMockPriorDate = (h) => {
-    const d = new Date();
-    return d.setHours(d.getHours() - h);
-};
-export const mockCategories = [
-    'HR',
-    'Marketing',
-    'Sales',
-    'Accounting',
-    'Engineering'
-];
-export const mockAttachmentListRequest = () => {
-    return new Promise(resolve => {
-        setTimeout(() => {
-            resolve([
-                {
-                    id: createUID(),
-                    name: 'File.doc',
-                    category: mockCategories[0],
-                    createDate: getMockPriorDate(1)
-                },
-                {
-                    id: createUID(),
-                    name: 'File.ppt',
-                    category: mockCategories[1],
-                    createDate: getMockPriorDate(4)
-                },
-                {
-                    id: createUID(),
-                    name: 'File.xls',
-                    category: mockCategories[2],
-                    createDate: getMockPriorDate(30)
-                },
-                {
-                    id: createUID(),
-                    name: 'emptyFile',
-                    category: '',
-                    createDate: getMockPriorDate(144)
-                }
-            ]);
-        }, 1000);
-    });
-};
-const Provider = ({ children }) => {
-    const [files, setFiles] = useState([]);
-    const attachFile = useCallback((file) => {
-        if (files.some(f => f.id === file.id))
-            return;
-        setFiles(current => [file, ...current]);
-    }, [files]);
-    const cancelFile = useCallback((id) => {
-        if (uploadsInProgress[id]) {
-            uploadsInProgress[id].abort();
-            delete uploadsInProgress[id];
-        }
-        setFiles(current => current.filter(f => f.id !== id));
-    }, [uploadsInProgress]);
-    const deleteFile = useCallback(async (id) => {
-        const file = files.find(f => f.id === id);
-        fetch(`http://cosmos.eng.pega.com/attachments/${file.id}`, { method: 'DELETE' }).then(() => {
-            setFiles(current => current.filter(f => f.id !== file.id));
-        });
-    }, [files]);
-    const setProgress = useCallback((file, progress) => {
-        setFiles(current => current.map(f => {
-            if (file.id === f.id) {
-                f.progress = progress;
-            }
-            return f;
-        }));
-    }, []);
-    useAfterInitialEffect(() => {
-        files.forEach(file => {
-            if (!hasProp(file, 'File') || typeof file.progress === 'number')
-                return;
-            postFile({
-                file,
-                onLoadStart: setProgress,
-                onProgress: setProgress,
-                onLoad(loadedFile) {
-                    delete uploadsInProgress[loadedFile.id];
-                    setFiles(cur => {
-                        return cur.map(f => {
-                            if (f.id === loadedFile.id) {
-                                return {
-                                    ...loadedFile,
-                                    id: createUID(),
-                                    createDate: Date.now()
-                                };
-                            }
-                            return f;
-                        });
-                    });
-                }
-            });
-        });
-    }, [files.length, setProgress]);
-    const value = useMemo(() => ({
-        files,
-        setFiles,
-        attachFile,
-        cancelFile,
-        deleteFile
-    }), [files, attachFile, cancelFile, deleteFile]);
-    return <FileServiceContext.Provider value={value}>{children}</FileServiceContext.Provider>;
-};
-export default Provider;
-//# sourceMappingURL=FileService.mock.jsx.map

package/jsx/core/File/FileService.mock.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"FileService.mock.jsx","sourceRoot":"","sources":["../../../src/core/File/FileService.mock.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createContext, useState, useCallback, useMemo } from 'react';\nimport type { ReactNode, FunctionComponent, Dispatch, SetStateAction } from 'react';\n\nimport { createUID, hasProp, useAfterInitialEffect } from '@pega/cosmos-react-core';\nimport type { FileUploadItemProps, OmitStrict } from '@pega/cosmos-react-core';\n\n// -----------------------------------------------------------------------------\n// MockFileResourceObject\n// -----------------------------------------------------------------------------\nexport interface MockFileAttachmentResource {\n  id: string;\n  name: string;\n  category: string;\n  thumbnail?: string;\n  createDate?: number;\n  modifiedDate?: number;\n}\n\n// -----------------------------------------------------------------------------\n// MockFileSelectionObject\n// -----------------------------------------------------------------------------\nexport interface MockFileUploadItem\n  extends Pick<MockFileAttachmentResource, 'id' | 'category'>,\n    OmitStrict<FileUploadItemProps, 'id'> {\n  File: File;\n}\n\n// -----------------------------------------------------------------------------\n// FileServiceContextValue\n// -----------------------------------------------------------------------------\nexport interface FileServiceContextValue {\n  files: (MockFileAttachmentResource | MockFileUploadItem)[];\n  setFiles: Dispatch<SetStateAction<FileServiceContextValue['files']>>;\n  attachFile: (file: MockFileUploadItem) => void;\n  cancelFile: (id: MockFileAttachmentResource['id']) => void;\n  deleteFile: (id: MockFileAttachmentResource['id']) => void;\n}\n\n// -----------------------------------------------------------------------------\n// FileServiceContext\n// -----------------------------------------------------------------------------\nexport const FileServiceContext = createContext<FileServiceContextValue>({\n  files: [],\n  setFiles: () => {},\n  attachFile: () => {},\n  cancelFile: () => {},\n  deleteFile: () => {}\n});\n\n// -----------------------------------------------------------------------------\n// FilePostArg\n// -----------------------------------------------------------------------------\ninterface FilePostArg {\n  file: MockFileUploadItem;\n  onLoadStart: (file: MockFileUploadItem, progress: number) => void;\n  onProgress: (file: MockFileUploadItem, progress: number) => void;\n  onLoad: (file: MockFileUploadItem) => void;\n}\n\n// -----------------------------------------------------------------------------\n// uploadsInProgress\n// -----------------------------------------------------------------------------\nconst uploadsInProgress: Record<string, XMLHttpRequest> = {};\n\n// -----------------------------------------------------------------------------\n// postFile\n// -----------------------------------------------------------------------------\nconst postFile = ({ file, onLoadStart, onProgress, onLoad }: FilePostArg) => {\n  const xhr = new XMLHttpRequest();\n  const fd = new FormData();\n\n  uploadsInProgress[file.id] = xhr;\n\n  xhr.upload.onloadstart = () => {\n    onLoadStart(file, 0);\n  };\n\n  xhr.upload.onprogress = ({ lengthComputable, loaded, total }) => {\n    if (lengthComputable) {\n      onProgress(file, (loaded / total) * 100);\n    }\n  };\n\n  xhr.upload.onload = () => {\n    onLoad(file);\n  };\n\n  // This is a mock api used to demo upload progress\n  xhr.open('POST', 'http://cosmos.eng.pega.com/attachments');\n  xhr.setRequestHeader('Content-Type', 'multipart/form-data');\n  fd.append('attachments', file.File);\n  xhr.send(fd);\n\n  return xhr;\n};\n\n// Mock date generator\nconst getMockPriorDate = (h: number) => {\n  const d = new Date();\n  return d.setHours(d.getHours() - h);\n};\n\nexport const mockCategories: ('HR' | 'Marketing' | 'Sales' | 'Accounting' | 'Engineering')[] = [\n  'HR',\n  'Marketing',\n  'Sales',\n  'Accounting',\n  'Engineering'\n];\n\nexport const mockAttachmentListRequest = (): Promise<MockFileAttachmentResource[]> => {\n  return new Promise(resolve => {\n    setTimeout(() => {\n      resolve([\n        {\n          id: createUID(),\n          name: 'File.doc',\n          category: mockCategories[0],\n          createDate: getMockPriorDate(1)\n        },\n        {\n          id: createUID(),\n          name: 'File.ppt',\n          category: mockCategories[1],\n          createDate: getMockPriorDate(4)\n        },\n        {\n          id: createUID(),\n          name: 'File.xls',\n          category: mockCategories[2],\n          createDate: getMockPriorDate(30)\n        },\n        {\n          id: createUID(),\n          name: 'emptyFile',\n          category: '',\n          createDate: getMockPriorDate(144)\n        }\n      ]);\n    }, 1000);\n  });\n};\n\n// -----------------------------------------------------------------------------\n// Provider\n// -----------------------------------------------------------------------------\nconst Provider: FunctionComponent<{ children: ReactNode }> = ({ children }) => {\n  const [files, setFiles] = useState<FileServiceContextValue['files']>([]);\n\n  const attachFile = useCallback(\n    (file: MockFileUploadItem) => {\n      if (files.some(f => f.id === file.id)) return;\n      setFiles(current => [file, ...current]);\n    },\n    [files]\n  );\n\n  // Remove a file from the state array\n  const cancelFile = useCallback(\n    (id: MockFileUploadItem['id']) => {\n      if (uploadsInProgress[id]) {\n        uploadsInProgress[id].abort();\n        delete uploadsInProgress[id];\n      }\n      setFiles(current => current.filter(f => f.id !== id));\n    },\n    [uploadsInProgress]\n  );\n\n  // Mock an api request and remove a file from the state array\n  const deleteFile = useCallback(\n    async (id: MockFileUploadItem['id']) => {\n      const file = files.find(f => f.id === id) as MockFileAttachmentResource;\n      fetch(`http://cosmos.eng.pega.com/attachments/${file.id}`, { method: 'DELETE' }).then(() => {\n        setFiles(current => current.filter(f => f.id !== file.id));\n      });\n    },\n    [files]\n  );\n\n  const setProgress = useCallback((file: MockFileUploadItem, progress?: number) => {\n    setFiles(current =>\n      current.map(f => {\n        if (file.id === f.id) {\n          (f as MockFileUploadItem).progress = progress;\n        }\n        return f;\n      })\n    );\n  }, []);\n\n  useAfterInitialEffect(() => {\n    files.forEach(file => {\n      // Return if we have a mock attachment resource object or a File object that is currently uploading.\n      if (!hasProp(file, 'File') || typeof file.progress === 'number') return;\n\n      // For each File in the array, not uploaded yet, make a POST to the mock service.\n      postFile({\n        file,\n        onLoadStart: setProgress,\n        onProgress: setProgress,\n        onLoad(loadedFile) {\n          delete uploadsInProgress[loadedFile.id];\n\n          setFiles(cur => {\n            return cur.map(f => {\n              if (f.id === loadedFile.id) {\n                return {\n                  ...loadedFile,\n                  id: createUID(),\n                  createDate: Date.now()\n                };\n              }\n\n              return f;\n            });\n          });\n        }\n      });\n    });\n  }, [files.length, setProgress]);\n\n  const value: FileServiceContextValue = useMemo(\n    () => ({\n      files,\n      setFiles,\n      attachFile,\n      cancelFile,\n      deleteFile\n    }),\n    [files, attachFile, cancelFile, deleteFile]\n  );\n\n  return <FileServiceContext.Provider value={value}>{children}</FileServiceContext.Provider>;\n};\n\nexport default Provider;\n"]}

package/jsx/core/File/MockFileInput.d.ts

@@ -1,6 +0,0 @@
-import type { FunctionComponent } from 'react';
-import type { ForwardProps } from '@pega/cosmos-react-core/lib/types';
-import type { FileInputProps } from '@pega/cosmos-react-core';
-declare const MockFileInput: FunctionComponent<FileInputProps & ForwardProps>;
-export default MockFileInput;
-//# sourceMappingURL=MockFileInput.d.ts.map

package/jsx/core/File/MockFileInput.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MockFileInput.d.ts","sourceRoot":"","sources":["../../../src/core/File/MockFileInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAEtE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAI9D,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,cAAc,GAAG,YAAY,CAoBnE,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/jsx/core/File/MockFileInput.jsx

@@ -1,24 +0,0 @@
-import { useState } from 'react';
-import { FileInput, createUID } from '@pega/cosmos-react-core';
-const MockFileInput = () => {
-    const [fileStore, setFileStore] = useState([]);
-    const addedFilesHandler = (addedFiles) => {
-        addedFiles.forEach((file) => {
-            const id = createUID();
-            setFileStore([
-                ...fileStore,
-                {
-                    id,
-                    thumbnail: file.type.startsWith('image') ? URL.createObjectURL(file) : undefined,
-                    name: file.name,
-                    category: '',
-                    File: file,
-                    onCancel: () => { }
-                }
-            ]);
-        });
-    };
-    return <FileInput files={fileStore} onFilesAdded={addedFilesHandler} label='File input label'/>;
-};
-export default MockFileInput;
-//# sourceMappingURL=MockFileInput.jsx.map

package/jsx/core/File/MockFileInput.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"MockFileInput.jsx","sourceRoot":"","sources":["../../../src/core/File/MockFileInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAIjC,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAK/D,MAAM,aAAa,GAAqD,GAAG,EAAE;IAC3E,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAuB,EAAE,CAAC,CAAC;IACrE,MAAM,iBAAiB,GAAG,CAAC,UAAkB,EAAE,EAAE;QAC/C,UAAU,CAAC,OAAO,CAAC,CAAC,IAAU,EAAE,EAAE;YAChC,MAAM,EAAE,GAAG,SAAS,EAAE,CAAC;YACvB,YAAY,CAAC;gBACX,GAAG,SAAS;gBACZ;oBACE,EAAE;oBACF,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS;oBAChF,IAAI,EAAE,IAAI,CAAC,IAAI;oBACf,QAAQ,EAAE,EAAE;oBACZ,IAAI,EAAE,IAAI;oBACV,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC;iBACnB;aACF,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC,iBAAiB,CAAC,CAAC,KAAK,CAAC,kBAAkB,EAAG,CAAC;AACnG,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { useState } from 'react';\nimport type { FunctionComponent } from 'react';\n\nimport type { ForwardProps } from '@pega/cosmos-react-core/lib/types';\nimport { FileInput, createUID } from '@pega/cosmos-react-core';\nimport type { FileInputProps } from '@pega/cosmos-react-core';\n\nimport type { MockFileUploadItem } from './FileService.mock';\n\nconst MockFileInput: FunctionComponent<FileInputProps & ForwardProps> = () => {\n  const [fileStore, setFileStore] = useState<MockFileUploadItem[]>([]);\n  const addedFilesHandler = (addedFiles: File[]) => {\n    addedFiles.forEach((file: File) => {\n      const id = createUID();\n      setFileStore([\n        ...fileStore,\n        {\n          id,\n          thumbnail: file.type.startsWith('image') ? URL.createObjectURL(file) : undefined,\n          name: file.name,\n          category: '',\n          File: file,\n          onCancel: () => {}\n        }\n      ]);\n    });\n  };\n\n  return <FileInput files={fileStore} onFilesAdded={addedFilesHandler} label='File input label' />;\n};\n\nexport default MockFileInput;\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