File size: 916 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
import type { TextProps } from '@invoke-ai/ui-library';
import { Text } from '@invoke-ai/ui-library';
import { memo } from 'react';
import { useTranslation } from 'react-i18next';

import { DROP_SHADOW } from './common';

type Props = TextProps & {
  type: 'first' | 'second';
};

export const ImageComparisonLabel = memo(({ type, ...rest }: Props) => {
  const { t } = useTranslation();
  return (
    <Text
      position="absolute"
      bottom={4}
      insetInlineEnd={type === 'first' ? undefined : 4}
      insetInlineStart={type === 'first' ? 4 : undefined}
      textOverflow="clip"
      whiteSpace="nowrap"
      filter={DROP_SHADOW}
      color="base.50"
      transitionDuration="0.2s"
      transitionProperty="common"
      {...rest}
    >
      {type === 'first' ? t('gallery.viewerImage') : t('gallery.compareImage')}
    </Text>
  );
});

ImageComparisonLabel.displayName = 'ImageComparisonLabel';