mirror of
https://github.com/invoke-ai/InvokeAI
synced 2024-08-30 20:32:17 +00:00
tidy(ui): clearer component names for inpaint mask
This commit is contained in:
parent
bedaca70a3
commit
9879999a65
@ -2,7 +2,7 @@
|
|||||||
import { Flex } from '@invoke-ai/ui-library';
|
import { Flex } from '@invoke-ai/ui-library';
|
||||||
import ScrollableContent from 'common/components/OverlayScrollbars/ScrollableContent';
|
import ScrollableContent from 'common/components/OverlayScrollbars/ScrollableContent';
|
||||||
import { ControlAdapterList } from 'features/controlLayers/components/ControlAdapter/ControlAdapterList';
|
import { ControlAdapterList } from 'features/controlLayers/components/ControlAdapter/ControlAdapterList';
|
||||||
import { IM } from 'features/controlLayers/components/InpaintMask/IM';
|
import { InpaintMask } from 'features/controlLayers/components/InpaintMask/InpaintMask';
|
||||||
import { IPAEntityList } from 'features/controlLayers/components/IPAdapter/IPAEntityList';
|
import { IPAEntityList } from 'features/controlLayers/components/IPAdapter/IPAEntityList';
|
||||||
import { LayerEntityList } from 'features/controlLayers/components/Layer/LayerEntityList';
|
import { LayerEntityList } from 'features/controlLayers/components/Layer/LayerEntityList';
|
||||||
import { RGEntityList } from 'features/controlLayers/components/RegionalGuidance/RGEntityList';
|
import { RGEntityList } from 'features/controlLayers/components/RegionalGuidance/RGEntityList';
|
||||||
@ -12,7 +12,7 @@ export const CanvasEntityList = memo(() => {
|
|||||||
return (
|
return (
|
||||||
<ScrollableContent>
|
<ScrollableContent>
|
||||||
<Flex flexDir="column" gap={2} data-testid="control-layers-layer-list">
|
<Flex flexDir="column" gap={2} data-testid="control-layers-layer-list">
|
||||||
<IM />
|
<InpaintMask />
|
||||||
<RGEntityList />
|
<RGEntityList />
|
||||||
<ControlAdapterList />
|
<ControlAdapterList />
|
||||||
<IPAEntityList />
|
<IPAEntityList />
|
||||||
|
@ -3,15 +3,15 @@ import { CanvasEntityContainer } from 'features/controlLayers/components/common/
|
|||||||
import { CanvasEntityEnabledToggle } from 'features/controlLayers/components/common/CanvasEntityEnabledToggle';
|
import { CanvasEntityEnabledToggle } from 'features/controlLayers/components/common/CanvasEntityEnabledToggle';
|
||||||
import { CanvasEntityHeader } from 'features/controlLayers/components/common/CanvasEntityHeader';
|
import { CanvasEntityHeader } from 'features/controlLayers/components/common/CanvasEntityHeader';
|
||||||
import { CanvasEntityTitle } from 'features/controlLayers/components/common/CanvasEntityTitle';
|
import { CanvasEntityTitle } from 'features/controlLayers/components/common/CanvasEntityTitle';
|
||||||
import { IMActionsMenu } from 'features/controlLayers/components/InpaintMask/IMActionsMenu';
|
import { InpaintMaskActionsMenu } from 'features/controlLayers/components/InpaintMask/InpaintMaskActionsMenu';
|
||||||
import { IMSettings } from 'features/controlLayers/components/InpaintMask/IMSettings';
|
import { InpaintMaskSettings } from 'features/controlLayers/components/InpaintMask/InpaintMaskSettings';
|
||||||
import { EntityIdentifierContext } from 'features/controlLayers/contexts/EntityIdentifierContext';
|
import { EntityIdentifierContext } from 'features/controlLayers/contexts/EntityIdentifierContext';
|
||||||
import type { CanvasEntityIdentifier } from 'features/controlLayers/store/types';
|
import type { CanvasEntityIdentifier } from 'features/controlLayers/store/types';
|
||||||
import { memo, useMemo } from 'react';
|
import { memo, useMemo } from 'react';
|
||||||
|
|
||||||
import { IMMaskFillColorPicker } from './IMMaskFillColorPicker';
|
import { InpaintMaskMaskFillColorPicker } from './InpaintMaskMaskFillColorPicker';
|
||||||
|
|
||||||
export const IM = memo(() => {
|
export const InpaintMask = memo(() => {
|
||||||
const entityIdentifier = useMemo<CanvasEntityIdentifier>(() => ({ id: 'inpaint_mask', type: 'inpaint_mask' }), []);
|
const entityIdentifier = useMemo<CanvasEntityIdentifier>(() => ({ id: 'inpaint_mask', type: 'inpaint_mask' }), []);
|
||||||
const { isOpen, onToggle } = useDisclosure({ defaultIsOpen: false });
|
const { isOpen, onToggle } = useDisclosure({ defaultIsOpen: false });
|
||||||
return (
|
return (
|
||||||
@ -21,13 +21,13 @@ export const IM = memo(() => {
|
|||||||
<CanvasEntityEnabledToggle />
|
<CanvasEntityEnabledToggle />
|
||||||
<CanvasEntityTitle />
|
<CanvasEntityTitle />
|
||||||
<Spacer />
|
<Spacer />
|
||||||
<IMMaskFillColorPicker />
|
<InpaintMaskMaskFillColorPicker />
|
||||||
<IMActionsMenu />
|
<InpaintMaskActionsMenu />
|
||||||
</CanvasEntityHeader>
|
</CanvasEntityHeader>
|
||||||
{isOpen && <IMSettings />}
|
{isOpen && <InpaintMaskSettings />}
|
||||||
</CanvasEntityContainer>
|
</CanvasEntityContainer>
|
||||||
</EntityIdentifierContext.Provider>
|
</EntityIdentifierContext.Provider>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
IM.displayName = 'IM';
|
InpaintMask.displayName = 'InpaintMask';
|
@ -3,7 +3,7 @@ import { CanvasEntityActionMenuItems } from 'features/controlLayers/components/c
|
|||||||
import { CanvasEntityMenuButton } from 'features/controlLayers/components/common/CanvasEntityMenuButton';
|
import { CanvasEntityMenuButton } from 'features/controlLayers/components/common/CanvasEntityMenuButton';
|
||||||
import { memo } from 'react';
|
import { memo } from 'react';
|
||||||
|
|
||||||
export const IMActionsMenu = memo(() => {
|
export const InpaintMaskActionsMenu = memo(() => {
|
||||||
return (
|
return (
|
||||||
<Menu>
|
<Menu>
|
||||||
<CanvasEntityMenuButton />
|
<CanvasEntityMenuButton />
|
||||||
@ -14,4 +14,4 @@ export const IMActionsMenu = memo(() => {
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
IMActionsMenu.displayName = 'IMActionsMenu';
|
InpaintMaskActionsMenu.displayName = 'InpaintMaskActionsMenu';
|
@ -8,7 +8,7 @@ import { memo, useCallback } from 'react';
|
|||||||
import type { RgbColor } from 'react-colorful';
|
import type { RgbColor } from 'react-colorful';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
export const IMMaskFillColorPicker = memo(() => {
|
export const InpaintMaskMaskFillColorPicker = memo(() => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const dispatch = useAppDispatch();
|
const dispatch = useAppDispatch();
|
||||||
const fill = useAppSelector((s) => s.canvasV2.inpaintMask.fill);
|
const fill = useAppSelector((s) => s.canvasV2.inpaintMask.fill);
|
||||||
@ -43,4 +43,4 @@ export const IMMaskFillColorPicker = memo(() => {
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
IMMaskFillColorPicker.displayName = 'IMMaskFillColorPicker';
|
InpaintMaskMaskFillColorPicker.displayName = 'InpaintMaskMaskFillColorPicker';
|
@ -1,8 +1,8 @@
|
|||||||
import { CanvasEntitySettings } from 'features/controlLayers/components/common/CanvasEntitySettings';
|
import { CanvasEntitySettings } from 'features/controlLayers/components/common/CanvasEntitySettings';
|
||||||
import { memo } from 'react';
|
import { memo } from 'react';
|
||||||
|
|
||||||
export const IMSettings = memo(() => {
|
export const InpaintMaskSettings = memo(() => {
|
||||||
return <CanvasEntitySettings>PLACEHOLDER</CanvasEntitySettings>;
|
return <CanvasEntitySettings>PLACEHOLDER</CanvasEntitySettings>;
|
||||||
});
|
});
|
||||||
|
|
||||||
IMSettings.displayName = 'IMSettings';
|
InpaintMaskSettings.displayName = 'InpaintMaskSettings';
|
Loading…
Reference in New Issue
Block a user