File size: 1,138 Bytes
8a37e0a |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
import { Flex } from '@invoke-ai/ui-library';
import { ToggleMetadataViewerButton } from 'features/gallery/components/ImageViewer/ToggleMetadataViewerButton';
import { ToggleProgressButton } from 'features/gallery/components/ImageViewer/ToggleProgressButton';
import type { ReactNode } from 'react';
import { memo } from 'react';
import CurrentImageButtons from './CurrentImageButtons';
type Props = {
closeButton?: ReactNode;
};
export const ViewerToolbar = memo(({ closeButton }: Props) => {
return (
<Flex w="full" px={2} gap={2} bg="base.750" borderTopRadius="base" h={12}>
<Flex flex={1} justifyContent="center">
<Flex marginInlineEnd="auto" alignItems="center">
<ToggleProgressButton />
<ToggleMetadataViewerButton />
</Flex>
</Flex>
<Flex flex={1} justifyContent="center" alignItems="center">
<CurrentImageButtons />
</Flex>
<Flex flex={1} justifyContent="center">
<Flex marginInlineStart="auto" alignItems="center">
{closeButton}
</Flex>
</Flex>
</Flex>
);
});
ViewerToolbar.displayName = 'ViewerToolbar';
|