Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): remove chakra as direct dependency

Browse Source 
Moved a number of things to `@invoke-ai/ui` to support this.

Unfortunately, the bundle size has increased a bit. I will work on that later.
This commit is contained in:
psychedelicious
2024-01-23 22:56:11 +11:00
committed by Kent Keirsey
parent 1178fd8bd3
commit 52b24e01e2
14 changed files with 730 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
invokeai/frontend/web/src/features/system/components/AboutModal/AboutModal.tsx
View File

@ -1,11 +1,10 @@
import { ExternalLinkIcon } from '@chakra-ui/icons';
import {
ExternalLink,
Flex,
Grid,
GridItem,
Heading,
Image,
Link,
Modal,
ModalBody,
ModalCloseButton,
@ -103,23 +102,21 @@ const AboutModal = ({ children }: AboutModalProps) => {
{appVersion && <Text>{`v${appVersion?.version}`}</Text>}
<Grid templateColumns="repeat(2, 1fr)" gap="3">
<GridItem>
<Link fontSize="sm" href={githubLink} isExternal>
{t('common.githubLabel')}
<ExternalLinkIcon mx="2px" />
</Link>
<ExternalLink
href={githubLink}
label={t('common.githubLabel')}
/>
</GridItem>
<GridItem>
<Link fontSize="sm" href={discordLink} isExternal>
{t('common.discordLabel')}
<ExternalLinkIcon mx="2px" />
</Link>
<ExternalLink
href={discordLink}
label={t('common.discordLabel')}
/>
</GridItem>
</Grid>
<Heading fontSize="large">{t('common.aboutHeading')}</Heading>
<Text fontSize="sm">{t('common.aboutDesc')}</Text>
<Link isExternal href={websiteLink} fontSize="sm">
{websiteLink} <ExternalLinkIcon mx="2px" />
</Link>
<ExternalLink href={websiteLink} label={websiteLink} />
</Flex>
</GridItem>
</Grid>

5
invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx
View File

@ -1,4 +1,3 @@
import { CloseIcon } from '@chakra-ui/icons';
import {
Divider,
Flex,
@ -30,6 +29,7 @@ import {
useState,
} from 'react';
import { useTranslation } from 'react-i18next';
import { PiXBold } from 'react-icons/pi';
import HotkeyListItem from './HotkeyListItem';
@ -103,7 +103,8 @@ const HotkeysModal = ({ children }: HotkeysModalProps) => {
size="sm"
variant="ghost"
aria-label={t('hotkeys.clearSearch')}
icon={<CloseIcon boxSize={3} />}
boxSize={4}
icon={<PiXBold />}
/>
</InputRightElement>
)}