ui: Combine mask and coherence under Compositing

This commit is contained in:
blessedcoolant 2023-08-30 04:51:32 +12:00
parent 52c2397498
commit 98e905ee48
10 changed files with 66 additions and 54 deletions

View File

@ -506,12 +506,13 @@
"hiresStrength": "High Res Strength",
"imageFit": "Fit Initial Image To Output Size",
"codeformerFidelity": "Fidelity",
"compositingSettingsHeader": "Compositing Settings",
"maskAdjustmentsHeader": "Mask Adjustments",
"maskBlur": "Mask Blur",
"maskBlurMethod": "Mask Blur Method",
"maskBlur": "Blur",
"maskBlurMethod": "Blur Method",
"coherencePassHeader": "Coherence Pass",
"coherenceSteps": "Coherence Pass Steps",
"coherenceStrength": "Coherence Pass Strength",
"coherenceSteps": "Steps",
"coherenceStrength": "Strength",
"seamLowThreshold": "Low",
"seamHighThreshold": "High",
"scaleBeforeProcessing": "Scale Before Processing",

View File

@ -0,0 +1,57 @@
import { Divider, Flex, Text } from '@chakra-ui/react';
import IAICollapse from 'common/components/IAICollapse';
import { PropsWithChildren, memo } from 'react';
import { useTranslation } from 'react-i18next';
import ParamCanvasCoherenceSteps from './CoherencePass/ParamCanvasCoherenceSteps';
import ParamCanvasCoherenceStrength from './CoherencePass/ParamCanvasCoherenceStrength';
import ParamMaskBlur from './MaskAdjustment/ParamMaskBlur';
import ParamMaskBlurMethod from './MaskAdjustment/ParamMaskBlurMethod';
const ParamCompositingSettingsCollapse = () => {
const { t } = useTranslation();
return (
<IAICollapse label={t('parameters.compositingSettingsHeader')}>
<Flex sx={{ flexDirection: 'column', gap: 2 }}>
<CompositingSettingsWrapper>
<Text fontSize="sm" fontWeight="bold">
{t('parameters.maskAdjustmentsHeader')}
</Text>
<ParamMaskBlur />
<ParamMaskBlurMethod />
</CompositingSettingsWrapper>
<Divider />
<CompositingSettingsWrapper>
<Text fontSize="sm" fontWeight="bold">
{t('parameters.coherencePassHeader')}
</Text>
<ParamCanvasCoherenceSteps />
<ParamCanvasCoherenceStrength />
</CompositingSettingsWrapper>
</Flex>
</IAICollapse>
);
};
const CompositingSettingsWrapper = memo((props: PropsWithChildren) => (
<Flex
sx={{
flexDir: 'column',
gap: 2,
bg: 'base.100',
px: 4,
pt: 2,
pb: 4,
borderRadius: 'base',
_dark: {
bg: 'base.750',
},
}}
>
{props.children}
</Flex>
));
CompositingSettingsWrapper.displayName = 'CompositingSettingsWrapper';
export default memo(ParamCompositingSettingsCollapse);

View File

@ -1,21 +0,0 @@
import { Flex } from '@chakra-ui/react';
import IAICollapse from 'common/components/IAICollapse';
import { memo } from 'react';
import { useTranslation } from 'react-i18next';
import ParamMaskBlur from './ParamMaskBlur';
import ParamMaskBlurMethod from './ParamMaskBlurMethod';
const ParamMaskAdjustmentCollapse = () => {
const { t } = useTranslation();
return (
<IAICollapse label={t('parameters.maskAdjustmentsHeader')}>
<Flex sx={{ flexDirection: 'column', gap: 2 }}>
<ParamMaskBlur />
<ParamMaskBlurMethod />
</Flex>
</IAICollapse>
);
};
export default memo(ParamMaskAdjustmentCollapse);

View File

@ -1,21 +0,0 @@
import { Flex } from '@chakra-ui/react';
import IAICollapse from 'common/components/IAICollapse';
import { memo } from 'react';
import { useTranslation } from 'react-i18next';
import ParamCanvasCoherenceSteps from './ParamCanvasCoherenceSteps';
import ParamCanvasCoherenceStrength from './ParamCanvasCoherenceStrength';
const ParamCanvasCoherencePassCollapse = () => {
const { t } = useTranslation();
return (
<IAICollapse label={t('parameters.coherencePassHeader')}>
<Flex sx={{ flexDirection: 'column', gap: 2, paddingBottom: 2 }}>
<ParamCanvasCoherenceSteps />
<ParamCanvasCoherenceStrength />
</Flex>
</IAICollapse>
);
};
export default memo(ParamCanvasCoherencePassCollapse);

View File

@ -1,8 +1,7 @@
import ParamDynamicPromptsCollapse from 'features/dynamicPrompts/components/ParamDynamicPromptsCollapse';
import ParamLoraCollapse from 'features/lora/components/ParamLoraCollapse';
import ParamCompositingSettingsCollapse from 'features/parameters/components/Parameters/Canvas/Compositing/ParamCompositingSettingsCollapse';
import ParamInfillAndScalingCollapse from 'features/parameters/components/Parameters/Canvas/InfillAndScaling/ParamInfillAndScalingCollapse';
import ParamMaskAdjustmentCollapse from 'features/parameters/components/Parameters/Canvas/MaskAdjustment/ParamMaskAdjustmentCollapse';
import ParamCanvasCoherencePassCollapse from 'features/parameters/components/Parameters/Canvas/SeamPainting/ParamCanvasCoherencePassCollapse';
import ParamControlNetCollapse from 'features/parameters/components/Parameters/ControlNet/ParamControlNetCollapse';
import ParamNoiseCollapse from 'features/parameters/components/Parameters/Noise/ParamNoiseCollapse';
import ParamSeamlessCollapse from 'features/parameters/components/Parameters/Seamless/ParamSeamlessCollapse';
@ -20,9 +19,8 @@ export default function SDXLUnifiedCanvasTabParameters() {
<ParamLoraCollapse />
<ParamDynamicPromptsCollapse />
<ParamNoiseCollapse />
<ParamMaskAdjustmentCollapse />
<ParamInfillAndScalingCollapse />
<ParamCanvasCoherencePassCollapse />
<ParamCompositingSettingsCollapse />
<ParamSeamlessCollapse />
</>
);

View File

@ -1,9 +1,8 @@
import ParamDynamicPromptsCollapse from 'features/dynamicPrompts/components/ParamDynamicPromptsCollapse';
import ParamLoraCollapse from 'features/lora/components/ParamLoraCollapse';
import ParamAdvancedCollapse from 'features/parameters/components/Parameters/Advanced/ParamAdvancedCollapse';
import ParamCompositingSettingsCollapse from 'features/parameters/components/Parameters/Canvas/Compositing/ParamCompositingSettingsCollapse';
import ParamInfillAndScalingCollapse from 'features/parameters/components/Parameters/Canvas/InfillAndScaling/ParamInfillAndScalingCollapse';
import ParamMaskAdjustmentCollapse from 'features/parameters/components/Parameters/Canvas/MaskAdjustment/ParamMaskAdjustmentCollapse';
import ParamCanvasCoherencePassCollapse from 'features/parameters/components/Parameters/Canvas/SeamPainting/ParamCanvasCoherencePassCollapse';
import ParamControlNetCollapse from 'features/parameters/components/Parameters/ControlNet/ParamControlNetCollapse';
import ParamPromptArea from 'features/parameters/components/Parameters/Prompt/ParamPromptArea';
import ParamSeamlessCollapse from 'features/parameters/components/Parameters/Seamless/ParamSeamlessCollapse';
@ -20,9 +19,8 @@ const UnifiedCanvasParameters = () => {
<ParamLoraCollapse />
<ParamDynamicPromptsCollapse />
<ParamSymmetryCollapse />
<ParamMaskAdjustmentCollapse />
<ParamInfillAndScalingCollapse />
<ParamCanvasCoherencePassCollapse />
<ParamCompositingSettingsCollapse />
<ParamSeamlessCollapse />
<ParamAdvancedCollapse />
</>