@pega/cosmos-react-demos 6.6.0 → 6.6.2

package/jsx/work/Assignments/Assignments.stories.jsx

@@ -1,64 +0,0 @@
-import { useState } from 'react';
-import { MetaList, Text, Link, DateTimeDisplay, Avatar } from '@pega/cosmos-react-core';
-import { Assignments, tasksHelpers as helpers } from '@pega/cosmos-react-work';
-import { AIButtonFormDemo } from '../../core/AIButton/AIButton.stories';
-import viewGroups from '../Tasks/Tasks.mocks';
-export default {
-    title: 'Work/Assignments',
-    component: Assignments
-};
-export const AssignmentsDemo = (args) => {
-    const [hasOpenTask, setHasOpenTask] = useState(false);
-    const [open, setOpen] = useState(true);
-    const activeView = helpers.getSelectedView(viewGroups);
-    const activeViewTaskCount = args.count ?? activeView?.count ?? 0;
-    const taskArray = Array.from({
-        length: args.count ?? activeViewTaskCount
-    }, (_, i) => {
-        const dueIn = 86400000 * i;
-        return {
-            id: `${i}`,
-            name: `Task ${i + 1}`,
-            processName: i % 2 ? 'Demo process' : undefined,
-            avatar: <Avatar name='James Gregory'/>,
-            meta: (<MetaList items={[
-                    <Text variant='secondary'>
-                Due <DateTimeDisplay variant='relative' value={Date.now() + dueIn}/>
-              </Text>,
-                    <Link href='#demo'>Parent case link</Link>
-                ]}/>),
-            additionalActions: [
-                {
-                    id: '1',
-                    text: 'Action 1'
-                },
-                {
-                    id: '2',
-                    text: 'Action 2'
-                }
-            ],
-            onOpen: args.openableTasks !== false
-                ? () => {
-                    setHasOpenTask(true);
-                }
-                : undefined,
-            content: hasOpenTask ? (<AIButtonFormDemo onCancel={() => setHasOpenTask(false)} onSubmit={() => setHasOpenTask(false)}/>) : null
-        };
-    });
-    return (<Assignments count={activeViewTaskCount} items={taskArray} collapsed={args.collapsed !== false ? open : undefined} onToggleCollapsed={args.collapsed !== false
-            ? () => {
-                setOpen(cur => !cur);
-            }
-            : undefined}/>);
-};
-AssignmentsDemo.args = {
-    openableTasks: true,
-    count: undefined,
-    collapsed: true
-};
-AssignmentsDemo.argTypes = {
-    count: { control: { type: 'number' } },
-    openableTasks: { control: { type: 'boolean' } },
-    collapsed: { control: { type: 'boolean' } }
-};
-//# sourceMappingURL=Assignments.stories.jsx.map

package/jsx/work/Assignments/Assignments.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"Assignments.stories.jsx","sourceRoot":"","sources":["../../../src/work/Assignments/Assignments.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\n\nimport { MetaList, Text, Link, DateTimeDisplay, Avatar } from '@pega/cosmos-react-core';\nimport { Assignments, tasksHelpers as helpers } from '@pega/cosmos-react-work';\nimport type { AssignmentsProps, TaskItemProps } from '@pega/cosmos-react-work';\n\nimport { AIButtonFormDemo } from '../../core/AIButton/AIButton.stories';\nimport viewGroups from '../Tasks/Tasks.mocks';\n\nexport default {\n  title: 'Work/Assignments',\n  component: Assignments\n} as Meta;\n\ninterface AssignmentsStoryProps {\n  collapsed?: boolean;\n  count?: AssignmentsProps['count'];\n  openableTasks?: boolean;\n}\n\nexport const AssignmentsDemo: StoryFn<AssignmentsStoryProps> = (args: AssignmentsStoryProps) => {\n  const [hasOpenTask, setHasOpenTask] = useState(false);\n  const [open, setOpen] = useState(true);\n\n  const activeView = helpers.getSelectedView(viewGroups);\n  const activeViewTaskCount = args.count ?? activeView?.count ?? 0;\n\n  const taskArray: TaskItemProps[] = Array.from(\n    {\n      length: args.count ?? activeViewTaskCount\n    },\n    (_, i) => {\n      const dueIn = 86400000 * i;\n\n      return {\n        id: `${i}`,\n        name: `Task ${i + 1}`,\n        processName: i % 2 ? 'Demo process' : undefined,\n        avatar: <Avatar name='James Gregory' />,\n        meta: (\n          <MetaList\n            items={[\n              <Text variant='secondary'>\n                Due <DateTimeDisplay variant='relative' value={Date.now() + dueIn} />\n              </Text>,\n              <Link href='#demo'>Parent case link</Link>\n            ]}\n          />\n        ),\n        additionalActions: [\n          {\n            id: '1',\n            text: 'Action 1'\n          },\n          {\n            id: '2',\n            text: 'Action 2'\n          }\n        ],\n        onOpen:\n          args.openableTasks !== false\n            ? () => {\n                setHasOpenTask(true);\n              }\n            : undefined,\n        content: hasOpenTask ? (\n          <AIButtonFormDemo\n            onCancel={() => setHasOpenTask(false)}\n            onSubmit={() => setHasOpenTask(false)}\n          />\n        ) : null\n      };\n    }\n  );\n\n  return (\n    <Assignments\n      count={activeViewTaskCount}\n      items={taskArray}\n      collapsed={args.collapsed !== false ? open : undefined}\n      onToggleCollapsed={\n        args.collapsed !== false\n          ? () => {\n              setOpen(cur => !cur);\n            }\n          : undefined\n      }\n    />\n  );\n};\n\nAssignmentsDemo.args = {\n  openableTasks: true,\n  count: undefined,\n  collapsed: true\n};\n\nAssignmentsDemo.argTypes = {\n  count: { control: { type: 'number' } },\n  openableTasks: { control: { type: 'boolean' } },\n  collapsed: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/work/CaseView/Attachments.mocks.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export declare const AttachmentsMock: () => import("react").JSX.Element;
-//# sourceMappingURL=Attachments.mocks.d.ts.map

package/jsx/work/CaseView/Attachments.mocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Attachments.mocks.d.ts","sourceRoot":"","sources":["../../../src/work/CaseView/Attachments.mocks.tsx"],"names":[],"mappings":";AAmfA,eAAO,MAAM,eAAe,mCAkI3B,CAAC"}

package/jsx/work/CaseView/Attachments.mocks.jsx

@@ -1,397 +0,0 @@
-import { useState, useCallback, useContext, useEffect, useRef, useMemo, forwardRef } from 'react';
-import { Button, FileInput, FileVisual, Progress, Modal, Text, SummaryList, ViewAll, getKindFromMimeType, getMimeTypeFromFile, Flex, Input, ComboBox, createUID, useModalManager, useModalContext, useToaster, DateTimeDisplay, MetaList, FormDialog } from '@pega/cosmos-react-core';
-import { loadingTimeoutMS } from '../../core/Progress/Progress.mocks';
-import { FileServiceContext, mockAttachmentListRequest, mockCategories } from '../../core/File/FileService.mock';
-const getSummaryListItemProps = ({ ref, file, editFile, cancelFile, deleteFile }) => {
-    let actions;
-    let visual;
-    if ('progress' in file && typeof file.progress === 'number' && file.progress < 100) {
-        visual = <Progress value={file.progress} placement='inline' variant='ring'/>;
-        actions = [
-            {
-                id: 'Cancel',
-                text: 'Cancel',
-                icon: 'times',
-                onClick: () => {
-                    cancelFile(file.id);
-                }
-            }
-        ];
-    }
-    else {
-        visual = (<FileVisual type={getKindFromMimeType(getMimeTypeFromFile(file.name) ?? '')} thumbnail={file.thumbnail}/>);
-        actions = [
-            {
-                id: 'Edit',
-                text: 'Edit',
-                icon: 'pencil',
-                onClick: () => {
-                    editFile?.(file);
-                }
-            },
-            {
-                id: 'Download',
-                text: 'Download',
-                icon: 'download',
-                onClick: () => { }
-            },
-            {
-                id: 'Delete',
-                text: 'Delete',
-                icon: 'trash',
-                onClick: () => {
-                    deleteFile(file.id);
-                }
-            }
-        ];
-    }
-    return {
-        ref,
-        id: file.id,
-        visual,
-        primary: file.name,
-        contextualLabel: file.name,
-        secondary: (<Text variant='secondary'>
-        {'progress' in file && typeof file.progress === 'number' && file.progress < 100 ? (`Uploading…${Math.floor(file.progress)}%`) : (<MetaList items={[
-                    file.category,
-                    <>
-                Uploaded{' '}
-                <DateTimeDisplay variant='relative' value={file.createDate}/>
-              </>
-                ]}/>)}
-      </Text>),
-        actions
-    };
-};
-const EditDialog = forwardRef(function EditDialog({ file, target, onSubmit, onCancel }, ref) {
-    const [name, setName] = useState(file.name);
-    const [error, setError] = useState('');
-    const [loading, setLoading] = useState(false);
-    const [categories, setCategories] = useState(() => {
-        return [
-            { id: createUID(), primary: 'No category', selected: false },
-            ...mockCategories.map(category => {
-                return {
-                    id: createUID(),
-                    primary: category,
-                    selected: file.category === category
-                };
-            })
-        ];
-    });
-    const selectedCategory = useMemo(() => {
-        const sc = categories.find(c => c.selected);
-        return sc
-            ? {
-                items: {
-                    id: sc.id,
-                    text: sc.primary
-                }
-            }
-            : undefined;
-    }, [categories]);
-    return (<FormDialog ref={ref} heading='Edit attachment' target={target} progress={loading ? 'Updating attachment...' : undefined} placement='bottom-start' onCancel={onCancel} onSubmit={() => {
-            if (error)
-                return;
-            setLoading(true);
-            setTimeout(() => {
-                onSubmit({
-                    name,
-                    category: !selectedCategory || selectedCategory.items.text === 'No category'
-                        ? ''
-                        : selectedCategory.items.text
-                });
-                setLoading(false);
-            }, loadingTimeoutMS);
-        }}>
-      <Flex container={{ direction: 'column', gap: 2 }}>
-        <Input label='Name' placeholder='Enter name…' value={name} info={error} status={error ? 'error' : undefined} autoFocus required onChange={(e) => {
-            setName(e.target.value);
-            if (error && e.target.value) {
-                setError('');
-            }
-        }} onBlur={() => {
-            if (!name) {
-                setError('Name is required.');
-            }
-        }}/>
-        <ComboBox label='Category' placeholder='Choose…' selected={selectedCategory} menu={{
-            mode: 'single-select',
-            items: categories,
-            onItemClick: id => {
-                setCategories(cur => {
-                    return cur.map(category => {
-                        return {
-                            ...category,
-                            selected: category.id === id
-                        };
-                    });
-                });
-            }
-        }}/>
-      </Flex>
-    </FormDialog>);
-});
-const AttachmentsModal = ({ defaultMode }) => {
-    const [mode, setMode] = useState(defaultMode);
-    const { push: pushToaster } = useToaster();
-    const { dismiss } = useModalContext();
-    const { files, setFiles, cancelFile, attachFile, deleteFile } = useContext(FileServiceContext);
-    const [search, setSearch] = useState('');
-    const [viewAllLoading, setViewAllLoading] = useState(true);
-    const [addNewLoading, setAddNewLoading] = useState(false);
-    const [newFiles, setNewFiles] = useState([]);
-    const attachSelected = useCallback(() => {
-        newFiles.forEach(attachFile);
-        dismiss();
-    }, [newFiles, attachFile]);
-    const listItemEls = useRef([]);
-    const [editFileIndex, setEditFileIndex] = useState(-1);
-    const editDialogTargetLi = useMemo(() => {
-        return editFileIndex !== undefined ? listItemEls.current[editFileIndex] : undefined;
-    }, [editFileIndex, listItemEls]);
-    const menuButton = useMemo(() => editDialogTargetLi
-        ? editDialogTargetLi.querySelector('button[aria-haspopup="menu"]')
-        : null, [editDialogTargetLi]);
-    const handleDialogClose = useCallback(() => {
-        if (!editDialogTargetLi)
-            return;
-        setEditFileIndex(-1);
-        menuButton?.focus();
-    }, [menuButton, editDialogTargetLi]);
-    const handleKeydown = useCallback((e) => {
-        if (e.key === 'Escape') {
-            setEditFileIndex(-1);
-        }
-    }, []);
-    const editDialogRef = useRef(null);
-    useEffect(() => {
-        if (mode === 'viewAll') {
-            const timeout = setTimeout(() => {
-                setViewAllLoading(false);
-            }, 1000);
-            return () => {
-                clearTimeout(timeout);
-            };
-        }
-    }, [mode]);
-    useEffect(() => {
-        if (!editDialogTargetLi)
-            return;
-        document.addEventListener('keydown', handleKeydown);
-        return () => {
-            document.removeEventListener('keydown', handleKeydown);
-        };
-    }, [editDialogTargetLi]);
-    useEffect(() => {
-        listItemEls.current = [];
-    }, [mode]);
-    const onFilesAdded = useCallback((newlyAddedFiles) => {
-        setNewFiles(current => [
-            ...newlyAddedFiles.map((file, i) => {
-                const id = createUID();
-                return {
-                    id,
-                    name: file.name,
-                    category: '',
-                    File: file,
-                    ref: (el) => {
-                        listItemEls.current[i] = el;
-                    },
-                    onEdit: () => {
-                        setEditFileIndex(i);
-                    },
-                    onCancel: () => {
-                        setNewFiles(c => c.filter(f => f.id !== id));
-                    }
-                };
-            }),
-            ...current
-        ]);
-    }, [files]);
-    const actions = mode === 'addNew' ? (<>
-        <Button onClick={dismiss} disabled={addNewLoading}>
-          Cancel
-        </Button>
-        <Button type='submit' variant='primary' onClick={() => {
-            setAddNewLoading(true);
-            setTimeout(() => {
-                attachSelected();
-                setAddNewLoading(false);
-            }, loadingTimeoutMS);
-        }} disabled={newFiles.length === 0 || addNewLoading}>
-          Upload files
-        </Button>
-      </>) : null;
-    const content = mode === 'addNew' ? (<FileInput multiple label='Select files to upload' onFilesAdded={onFilesAdded} files={newFiles.map(f => ({ ...f, meta: f.category || undefined }))}/>) : (<ViewAll loading={viewAllLoading} items={(search ? files.filter(f => f.name.includes(search)) : files).map((file, i) => {
-            return getSummaryListItemProps({
-                ref: (el) => {
-                    listItemEls.current[i] = el;
-                },
-                file,
-                editFile: () => {
-                    setEditFileIndex(i);
-                },
-                cancelFile: id => {
-                    const canceledFile = files.find(f => f.id === id);
-                    cancelFile(id);
-                    pushToaster({ content: `Cancelled uploading ${canceledFile.name}` });
-                },
-                deleteFile: async (id) => {
-                    const deletedFile = files.find(f => f.id === id);
-                    await deleteFile(id);
-                    pushToaster({ content: `${deletedFile.name} deleted` });
-                }
-            });
-        })} actions={[
-            {
-                id: 'addNewFile',
-                text: 'Add files',
-                onClick: () => {
-                    setMode('addNew');
-                }
-            },
-            {
-                id: 'addNewLink',
-                text: 'Add links',
-                onClick: () => {
-                    setMode('addNew');
-                }
-            }
-        ]} searchInputProps={{ onSearchChange: value => setSearch(value) }}/>);
-    return (<Modal as={mode === 'addNew' ? 'form' : undefined} heading={mode === 'addNew' ? 'Add attachments' : 'Attachments'} actions={actions} progress={addNewLoading ? { message: 'Adding attachments...' } : undefined} onRequestDismiss={() => {
-            return !editDialogTargetLi;
-        }} onSubmit={mode === 'addNew'
-            ? (e) => {
-                e.preventDefault();
-            }
-            : undefined}>
-      <>
-        {content}
-        {editDialogTargetLi && menuButton && (<EditDialog ref={editDialogRef} target={menuButton} file={mode === 'addNew' ? newFiles[editFileIndex] : files[editFileIndex]} onCancel={handleDialogClose} onSubmit={({ name, category }) => {
-                handleDialogClose();
-                if (mode === 'addNew') {
-                    setNewFiles(cur => {
-                        return cur.map((file, i) => {
-                            if (i === editFileIndex) {
-                                return {
-                                    ...file,
-                                    name,
-                                    category
-                                };
-                            }
-                            return file;
-                        });
-                    });
-                }
-                else {
-                    setFiles(cur => cur.map((file, i) => {
-                        if (i === editFileIndex) {
-                            return {
-                                ...file,
-                                name,
-                                category
-                            };
-                        }
-                        return file;
-                    }));
-                }
-            }}/>)}
-      </>
-    </Modal>);
-};
-export const AttachmentsMock = () => {
-    const { push: pushToaster } = useToaster();
-    const { create: createModal } = useModalManager();
-    const [loading, setLoading] = useState(true);
-    const { files, setFiles, cancelFile, deleteFile } = useContext(FileServiceContext);
-    const listItemEls = useRef([]);
-    const [editFileIndex, setEditFileIndex] = useState(-1);
-    const editDialogTargetLi = useMemo(() => {
-        return editFileIndex !== undefined ? listItemEls.current[editFileIndex] : undefined;
-    }, [editFileIndex, listItemEls]);
-    const menuButton = useMemo(() => editDialogTargetLi
-        ? editDialogTargetLi.querySelector('button[aria-haspopup="menu"]')
-        : null, [editDialogTargetLi]);
-    const handleDialogClose = useCallback(() => {
-        if (!editDialogTargetLi)
-            return;
-        setEditFileIndex(-1);
-        menuButton?.focus();
-    }, [menuButton, editDialogTargetLi]);
-    const handleKeydown = useCallback((e) => {
-        if (e.key === 'Escape') {
-            setEditFileIndex(-1);
-        }
-    }, []);
-    const editDialogRef = useRef(null);
-    useEffect(() => {
-        let mounted = true;
-        (async () => {
-            const attachments = await mockAttachmentListRequest();
-            if (mounted) {
-                setLoading(false);
-                setFiles(attachments);
-            }
-        })();
-        return () => {
-            mounted = false;
-        };
-    }, []);
-    useEffect(() => {
-        if (!editDialogTargetLi)
-            return;
-        document.addEventListener('keydown', handleKeydown);
-        return () => {
-            document.removeEventListener('keydown', handleKeydown);
-        };
-    }, [editDialogTargetLi]);
-    return (<>
-      <SummaryList icon='paper-clip' name='Attachments' headingTag='h3' loading={loading} count={!loading && Array.isArray(files) ? files.length : undefined} actions={[
-            {
-                text: 'Add',
-                id: 'addNew',
-                icon: 'plus',
-                onClick() {
-                    createModal(AttachmentsModal, { defaultMode: 'addNew' });
-                }
-            }
-        ]} items={files.slice(0, 3).map((file, i) => {
-            return getSummaryListItemProps({
-                ref: (el) => {
-                    listItemEls.current[i] = el;
-                },
-                file,
-                editFile: () => {
-                    setEditFileIndex(i);
-                },
-                cancelFile: id => {
-                    const canceledFile = files.find(f => f.id === id);
-                    cancelFile(id);
-                    pushToaster({ content: `Cancelled uploading ${canceledFile.name}` });
-                },
-                deleteFile: async (id) => {
-                    const deletedFile = files.find(f => f.id === id);
-                    await deleteFile(id);
-                    pushToaster({ content: `${deletedFile.name} deleted` });
-                }
-            });
-        })} onViewAll={() => {
-            createModal(AttachmentsModal, { defaultMode: 'viewAll' });
-        }}/>
-      {editDialogTargetLi && menuButton && (<EditDialog ref={editDialogRef} target={menuButton} file={files[editFileIndex]} onCancel={handleDialogClose} onSubmit={({ name, category }) => {
-                handleDialogClose();
-                setFiles(cur => cur.map((file, i) => {
-                    if (i === editFileIndex) {
-                        return {
-                            ...file,
-                            name,
-                            category
-                        };
-                    }
-                    return file;
-                }));
-            }}/>)}
-    </>);
-};
-//# sourceMappingURL=Attachments.mocks.jsx.map

package/jsx/work/CaseView/Attachments.mocks.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"Attachments.mocks.jsx","sourceRoot":"","sources":["../../../src/work/CaseView/Attachments.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useCallback, useContext, useEffect, useRef, useMemo, forwardRef } from 'react';\nimport type { FormEvent, Ref, ChangeEvent, FC, PropsWithoutRef } from 'react';\n\nimport {\n  Button,\n  FileInput,\n  FileVisual,\n  Progress,\n  Modal,\n  Text,\n  SummaryList,\n  ViewAll,\n  getKindFromMimeType,\n  getMimeTypeFromFile,\n  Flex,\n  Input,\n  ComboBox,\n  createUID,\n  useModalManager,\n  useModalContext,\n  useToaster,\n  DateTimeDisplay,\n  MetaList,\n  FormDialog\n} from '@pega/cosmos-react-core';\nimport type { Action, SummaryListItem, FormDialogProps } from '@pega/cosmos-react-core';\n\nimport { loadingTimeoutMS } from '../../core/Progress/Progress.mocks';\nimport {\n  FileServiceContext,\n  mockAttachmentListRequest,\n  mockCategories\n} from '../../core/File/FileService.mock';\nimport type {\n  FileServiceContextValue,\n  MockFileAttachmentResource,\n  MockFileUploadItem\n} from '../../core/File/FileService.mock';\n\n// ---------------------------------------------------------------------------------------------------------------------\n// getSummaryListItemProps\n// ---------------------------------------------------------------------------------------------------------------------\nconst getSummaryListItemProps = ({\n  ref,\n  file,\n  editFile,\n  cancelFile,\n  deleteFile\n}: {\n  ref: Ref<HTMLLIElement>;\n  file: MockFileAttachmentResource | MockFileUploadItem;\n  editFile?: (file: MockFileAttachmentResource) => void;\n  cancelFile: FileServiceContextValue['cancelFile'];\n  deleteFile: FileServiceContextValue['deleteFile'];\n}): SummaryListItem => {\n  let actions: Action[];\n  let visual: JSX.Element;\n\n  if ('progress' in file && typeof file.progress === 'number' && file.progress < 100) {\n    visual = <Progress value={file.progress} placement='inline' variant='ring' />;\n    actions = [\n      {\n        id: 'Cancel',\n        text: 'Cancel',\n        icon: 'times',\n        onClick: () => {\n          cancelFile(file.id);\n        }\n      }\n    ];\n  } else {\n    visual = (\n      <FileVisual\n        type={getKindFromMimeType(getMimeTypeFromFile(file.name) ?? '')}\n        thumbnail={(file as MockFileAttachmentResource).thumbnail}\n      />\n    );\n    actions = [\n      {\n        id: 'Edit',\n        text: 'Edit',\n        icon: 'pencil',\n        onClick: () => {\n          editFile?.(file);\n        }\n      },\n      {\n        id: 'Download',\n        text: 'Download',\n        icon: 'download',\n        onClick: () => {}\n      },\n      {\n        id: 'Delete',\n        text: 'Delete',\n        icon: 'trash',\n        onClick: () => {\n          deleteFile(file.id);\n        }\n      }\n    ];\n  }\n\n  return {\n    ref,\n    id: file.id,\n    visual,\n    primary: file.name,\n    contextualLabel: file.name,\n    secondary: (\n      <Text variant='secondary'>\n        {'progress' in file && typeof file.progress === 'number' && file.progress < 100 ? (\n          `Uploading…${Math.floor(file.progress)}%`\n        ) : (\n          <MetaList\n            items={[\n              file.category,\n              <>\n                Uploaded{' '}\n                <DateTimeDisplay\n                  variant='relative'\n                  value={(file as MockFileAttachmentResource).createDate}\n                />\n              </>\n            ]}\n          />\n        )}\n      </Text>\n    ),\n    actions\n  };\n};\n\n// ---------------------------------------------------------------------------------------------------------------------\n// Attachment edit Dialog\n// ---------------------------------------------------------------------------------------------------------------------\ninterface EditDialogProps {\n  file: MockFileAttachmentResource;\n  target: FormDialogProps['target'];\n  onSubmit: (fields: { name: string; category: string }) => void;\n  onCancel: () => void;\n  ref: Ref<HTMLDivElement>;\n}\n\nconst EditDialog: FC<EditDialogProps> = forwardRef(function EditDialog(\n  { file, target, onSubmit, onCancel }: PropsWithoutRef<EditDialogProps>,\n  ref: EditDialogProps['ref']\n) {\n  const [name, setName] = useState(file.name);\n  const [error, setError] = useState('');\n  const [loading, setLoading] = useState(false);\n\n  const [categories, setCategories] = useState(() => {\n    return [\n      { id: createUID(), primary: 'No category', selected: false },\n      ...mockCategories.map(category => {\n        return {\n          id: createUID(),\n          primary: category,\n          selected: file.category === category\n        };\n      })\n    ];\n  });\n\n  const selectedCategory = useMemo(() => {\n    const sc = categories.find(c => c.selected);\n    return sc\n      ? {\n          items: {\n            id: sc.id,\n            text: sc.primary\n          }\n        }\n      : undefined;\n  }, [categories]);\n\n  return (\n    <FormDialog\n      ref={ref}\n      heading='Edit attachment'\n      target={target}\n      progress={loading ? 'Updating attachment...' : undefined}\n      placement='bottom-start'\n      onCancel={onCancel}\n      onSubmit={() => {\n        if (error) return;\n        setLoading(true);\n        setTimeout(() => {\n          onSubmit({\n            name,\n            category:\n              !selectedCategory || selectedCategory.items.text === 'No category'\n                ? ''\n                : selectedCategory.items.text\n          });\n          setLoading(false);\n        }, loadingTimeoutMS);\n      }}\n    >\n      <Flex container={{ direction: 'column', gap: 2 }}>\n        <Input\n          label='Name'\n          placeholder='Enter name…'\n          value={name}\n          info={error}\n          status={error ? 'error' : undefined}\n          autoFocus\n          required\n          onChange={(e: ChangeEvent<HTMLInputElement>) => {\n            setName(e.target.value);\n            if (error && e.target.value) {\n              setError('');\n            }\n          }}\n          onBlur={() => {\n            if (!name) {\n              setError('Name is required.');\n            }\n          }}\n        />\n        <ComboBox\n          label='Category'\n          placeholder='Choose…'\n          selected={selectedCategory}\n          menu={{\n            mode: 'single-select',\n            items: categories,\n            onItemClick: id => {\n              setCategories(cur => {\n                return cur.map(category => {\n                  return {\n                    ...category,\n                    selected: category.id === id\n                  };\n                });\n              });\n            }\n          }}\n        />\n      </Flex>\n    </FormDialog>\n  );\n});\n\n// ---------------------------------------------------------------------------------------------------------------------\n// AttachmentsModal\n// ---------------------------------------------------------------------------------------------------------------------\ninterface AttachmentsModalProps {\n  defaultMode: 'viewAll' | 'addNew';\n}\n\nconst AttachmentsModal = ({ defaultMode }: AttachmentsModalProps) => {\n  const [mode, setMode] = useState(defaultMode);\n\n  const { push: pushToaster } = useToaster();\n  const { dismiss } = useModalContext();\n  const { files, setFiles, cancelFile, attachFile, deleteFile } = useContext(FileServiceContext);\n\n  const [search, setSearch] = useState('');\n  const [viewAllLoading, setViewAllLoading] = useState(true);\n  const [addNewLoading, setAddNewLoading] = useState(false);\n  const [newFiles, setNewFiles] = useState<MockFileUploadItem[]>([]);\n\n  const attachSelected = useCallback(() => {\n    newFiles.forEach(attachFile);\n    dismiss();\n  }, [newFiles, attachFile]);\n\n  const listItemEls = useRef<HTMLLIElement[]>([]);\n  const [editFileIndex, setEditFileIndex] = useState<number>(-1);\n\n  const editDialogTargetLi = useMemo(() => {\n    return editFileIndex !== undefined ? listItemEls.current[editFileIndex] : undefined;\n  }, [editFileIndex, listItemEls]);\n\n  const menuButton = useMemo(\n    () =>\n      editDialogTargetLi\n        ? editDialogTargetLi.querySelector<HTMLButtonElement>('button[aria-haspopup=\"menu\"]')\n        : null,\n    [editDialogTargetLi]\n  );\n\n  const handleDialogClose = useCallback(() => {\n    if (!editDialogTargetLi) return;\n    setEditFileIndex(-1);\n    menuButton?.focus();\n  }, [menuButton, editDialogTargetLi]);\n\n  const handleKeydown = useCallback((e: KeyboardEvent) => {\n    if (e.key === 'Escape') {\n      setEditFileIndex(-1);\n    }\n  }, []);\n\n  const editDialogRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (mode === 'viewAll') {\n      const timeout = setTimeout(() => {\n        setViewAllLoading(false);\n      }, 1000);\n\n      return () => {\n        clearTimeout(timeout);\n      };\n    }\n  }, [mode]);\n\n  useEffect(() => {\n    if (!editDialogTargetLi) return;\n    document.addEventListener('keydown', handleKeydown);\n    return () => {\n      document.removeEventListener('keydown', handleKeydown);\n    };\n  }, [editDialogTargetLi]);\n\n  useEffect(() => {\n    // Since the component is performing double duty we need to empty out ref elements from a prior render mode.\n    listItemEls.current = [];\n  }, [mode]);\n\n  const onFilesAdded = useCallback(\n    (newlyAddedFiles: File[]) => {\n      setNewFiles(current => [\n        ...newlyAddedFiles.map((file, i) => {\n          const id = createUID();\n          return {\n            id,\n            name: file.name,\n            category: '',\n            File: file,\n            ref: (el: HTMLLIElement) => {\n              listItemEls.current[i] = el;\n            },\n            onEdit: () => {\n              setEditFileIndex(i);\n            },\n            onCancel: () => {\n              setNewFiles(c => c.filter(f => f.id !== id));\n            }\n          };\n        }),\n        ...current\n      ]);\n    },\n    [files]\n  );\n\n  // Actions for the modal\n  const actions =\n    mode === 'addNew' ? (\n      <>\n        <Button onClick={dismiss} disabled={addNewLoading}>\n          Cancel\n        </Button>\n        <Button\n          type='submit'\n          variant='primary'\n          // Normally this would trigger a submit event but we are preventing that in the Modal's onSubmit.\n          onClick={() => {\n            setAddNewLoading(true);\n            setTimeout(() => {\n              attachSelected();\n              setAddNewLoading(false);\n            }, loadingTimeoutMS);\n          }}\n          disabled={newFiles.length === 0 || addNewLoading}\n        >\n          Upload files\n        </Button>\n      </>\n    ) : null;\n\n  // Content for the modal\n  const content =\n    mode === 'addNew' ? (\n      <FileInput\n        multiple\n        label='Select files to upload'\n        onFilesAdded={onFilesAdded}\n        files={newFiles.map(f => ({ ...f, meta: f.category || undefined }))}\n      />\n    ) : (\n      <ViewAll\n        loading={viewAllLoading}\n        items={(search ? files.filter(f => f.name.includes(search)) : files).map((file, i) => {\n          return getSummaryListItemProps({\n            ref: (el: HTMLLIElement) => {\n              listItemEls.current[i] = el;\n            },\n            file,\n            editFile: () => {\n              setEditFileIndex(i);\n            },\n            cancelFile: id => {\n              const canceledFile = files.find(f => f.id === id) as MockFileUploadItem;\n              cancelFile(id);\n              pushToaster({ content: `Cancelled uploading ${canceledFile.name}` });\n            },\n            deleteFile: async id => {\n              const deletedFile = files.find(f => f.id === id) as MockFileAttachmentResource;\n              await deleteFile(id);\n              pushToaster({ content: `${deletedFile.name} deleted` });\n            }\n          });\n        })}\n        actions={[\n          {\n            id: 'addNewFile',\n            text: 'Add files',\n            onClick: () => {\n              setMode('addNew');\n            }\n          },\n          {\n            id: 'addNewLink',\n            text: 'Add links',\n            onClick: () => {\n              setMode('addNew');\n            }\n          }\n        ]}\n        searchInputProps={{ onSearchChange: value => setSearch(value) }}\n      />\n    );\n\n  return (\n    <Modal\n      as={mode === 'addNew' ? 'form' : undefined}\n      heading={mode === 'addNew' ? 'Add attachments' : 'Attachments'}\n      actions={actions}\n      progress={addNewLoading ? { message: 'Adding attachments...' } : undefined}\n      onRequestDismiss={() => {\n        return !editDialogTargetLi;\n      }}\n      onSubmit={\n        mode === 'addNew'\n          ? (e: FormEvent) => {\n              e.preventDefault();\n            }\n          : undefined\n      }\n    >\n      <>\n        {content}\n        {editDialogTargetLi && menuButton && (\n          <EditDialog\n            ref={editDialogRef}\n            target={menuButton}\n            file={mode === 'addNew' ? newFiles[editFileIndex] : files[editFileIndex]}\n            onCancel={handleDialogClose}\n            onSubmit={({ name, category }) => {\n              handleDialogClose();\n\n              // TS kept from easily consolidating like:\n              // const setter = mode === 'addNew' ? setNewFiles : setFiles;\n              // Could not avoid map's file param as \"any\".\n              if (mode === 'addNew') {\n                setNewFiles(cur => {\n                  return cur.map((file, i) => {\n                    if (i === editFileIndex) {\n                      return {\n                        ...file,\n                        name,\n                        category\n                      };\n                    }\n\n                    return file;\n                  });\n                });\n              } else {\n                setFiles(cur =>\n                  cur.map((file, i) => {\n                    if (i === editFileIndex) {\n                      return {\n                        ...file,\n                        name,\n                        category\n                      };\n                    }\n\n                    return file;\n                  })\n                );\n              }\n            }}\n          />\n        )}\n      </>\n    </Modal>\n  );\n};\n\n// ---------------------------------------------------------------------------------------------------------------------\n// Attachments mock\n// ---------------------------------------------------------------------------------------------------------------------\nexport const AttachmentsMock = () => {\n  const { push: pushToaster } = useToaster();\n  const { create: createModal } = useModalManager();\n  const [loading, setLoading] = useState(true);\n  const { files, setFiles, cancelFile, deleteFile } = useContext(FileServiceContext);\n\n  const listItemEls = useRef<HTMLLIElement[]>([]);\n  const [editFileIndex, setEditFileIndex] = useState<number>(-1);\n\n  const editDialogTargetLi = useMemo(() => {\n    return editFileIndex !== undefined ? listItemEls.current[editFileIndex] : undefined;\n  }, [editFileIndex, listItemEls]);\n\n  const menuButton = useMemo(\n    () =>\n      editDialogTargetLi\n        ? editDialogTargetLi.querySelector<HTMLButtonElement>('button[aria-haspopup=\"menu\"]')\n        : null,\n    [editDialogTargetLi]\n  );\n\n  const handleDialogClose = useCallback(() => {\n    if (!editDialogTargetLi) return;\n    setEditFileIndex(-1);\n    menuButton?.focus();\n  }, [menuButton, editDialogTargetLi]);\n\n  const handleKeydown = useCallback((e: KeyboardEvent) => {\n    if (e.key === 'Escape') {\n      setEditFileIndex(-1);\n    }\n  }, []);\n\n  const editDialogRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    let mounted = true;\n\n    (async () => {\n      const attachments = await mockAttachmentListRequest();\n\n      // Avoids: Warning: Can't perform a React state update on an unmounted component.\n      if (mounted) {\n        setLoading(false);\n        setFiles(attachments);\n      }\n    })();\n\n    return () => {\n      mounted = false;\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!editDialogTargetLi) return;\n    document.addEventListener('keydown', handleKeydown);\n    return () => {\n      document.removeEventListener('keydown', handleKeydown);\n    };\n  }, [editDialogTargetLi]);\n\n  return (\n    <>\n      <SummaryList\n        icon='paper-clip'\n        name='Attachments'\n        headingTag='h3'\n        loading={loading}\n        count={!loading && Array.isArray(files) ? files.length : undefined}\n        actions={[\n          {\n            text: 'Add',\n            id: 'addNew',\n            icon: 'plus',\n            onClick() {\n              createModal(AttachmentsModal, { defaultMode: 'addNew' as const });\n            }\n          }\n        ]}\n        items={files.slice(0, 3).map((file, i) => {\n          return getSummaryListItemProps({\n            ref: (el: HTMLLIElement) => {\n              listItemEls.current[i] = el;\n            },\n            file,\n            editFile: () => {\n              setEditFileIndex(i);\n            },\n            cancelFile: id => {\n              const canceledFile = files.find(f => f.id === id) as MockFileUploadItem;\n              cancelFile(id);\n              pushToaster({ content: `Cancelled uploading ${canceledFile.name}` });\n            },\n            deleteFile: async id => {\n              const deletedFile = files.find(f => f.id === id) as MockFileAttachmentResource;\n              await deleteFile(id);\n              pushToaster({ content: `${deletedFile.name} deleted` });\n            }\n          });\n        })}\n        onViewAll={() => {\n          createModal(AttachmentsModal, { defaultMode: 'viewAll' as const });\n        }}\n      />\n      {editDialogTargetLi && menuButton && (\n        <EditDialog\n          ref={editDialogRef}\n          target={menuButton}\n          file={files[editFileIndex]}\n          onCancel={handleDialogClose}\n          onSubmit={({ name, category }) => {\n            handleDialogClose();\n            setFiles(cur =>\n              cur.map((file, i) => {\n                if (i === editFileIndex) {\n                  return {\n                    ...file,\n                    name,\n                    category\n                  };\n                }\n\n                return file;\n              })\n            );\n          }}\n        />\n      )}\n    </>\n  );\n};\n"]}