mirror of
https://github.com/invoke-ai/InvokeAI
synced 2024-08-30 20:32:17 +00:00
Merge branch 'main' into feat/ruff
This commit is contained in:
commit
ab1ec3720a
@ -583,6 +583,7 @@
|
||||
"strength": "Image to image strength",
|
||||
"Threshold": "Noise Threshold",
|
||||
"variations": "Seed-weight pairs",
|
||||
"vae": "VAE",
|
||||
"width": "Width",
|
||||
"workflow": "Workflow"
|
||||
},
|
||||
|
@ -1,9 +1,12 @@
|
||||
import { Box, ChakraProps } from '@chakra-ui/react';
|
||||
import { memo } from 'react';
|
||||
import { ChakraProps, Flex } from '@chakra-ui/react';
|
||||
import { memo, useCallback } from 'react';
|
||||
import { RgbaColorPicker } from 'react-colorful';
|
||||
import { ColorPickerBaseProps, RgbaColor } from 'react-colorful/dist/types';
|
||||
import IAINumberInput from './IAINumberInput';
|
||||
|
||||
type IAIColorPickerProps = ColorPickerBaseProps<RgbaColor>;
|
||||
type IAIColorPickerProps = ColorPickerBaseProps<RgbaColor> & {
|
||||
withNumberInput?: boolean;
|
||||
};
|
||||
|
||||
const colorPickerStyles: NonNullable<ChakraProps['sx']> = {
|
||||
width: 6,
|
||||
@ -11,17 +14,84 @@ const colorPickerStyles: NonNullable<ChakraProps['sx']> = {
|
||||
borderColor: 'base.100',
|
||||
};
|
||||
|
||||
const sx = {
|
||||
const sx: ChakraProps['sx'] = {
|
||||
'.react-colorful__hue-pointer': colorPickerStyles,
|
||||
'.react-colorful__saturation-pointer': colorPickerStyles,
|
||||
'.react-colorful__alpha-pointer': colorPickerStyles,
|
||||
gap: 2,
|
||||
flexDir: 'column',
|
||||
};
|
||||
|
||||
const numberInputWidth: ChakraProps['w'] = '4.2rem';
|
||||
|
||||
const IAIColorPicker = (props: IAIColorPickerProps) => {
|
||||
const { color, onChange, withNumberInput, ...rest } = props;
|
||||
const handleChangeR = useCallback(
|
||||
(r: number) => onChange({ ...color, r }),
|
||||
[color, onChange]
|
||||
);
|
||||
const handleChangeG = useCallback(
|
||||
(g: number) => onChange({ ...color, g }),
|
||||
[color, onChange]
|
||||
);
|
||||
const handleChangeB = useCallback(
|
||||
(b: number) => onChange({ ...color, b }),
|
||||
[color, onChange]
|
||||
);
|
||||
const handleChangeA = useCallback(
|
||||
(a: number) => onChange({ ...color, a }),
|
||||
[color, onChange]
|
||||
);
|
||||
return (
|
||||
<Box sx={sx}>
|
||||
<RgbaColorPicker {...props} />
|
||||
</Box>
|
||||
<Flex sx={sx}>
|
||||
<RgbaColorPicker
|
||||
color={color}
|
||||
onChange={onChange}
|
||||
style={{ width: '100%' }}
|
||||
{...rest}
|
||||
/>
|
||||
{withNumberInput && (
|
||||
<Flex>
|
||||
<IAINumberInput
|
||||
value={color.r}
|
||||
onChange={handleChangeR}
|
||||
min={0}
|
||||
max={255}
|
||||
step={1}
|
||||
label="Red"
|
||||
w={numberInputWidth}
|
||||
/>
|
||||
<IAINumberInput
|
||||
value={color.g}
|
||||
onChange={handleChangeG}
|
||||
min={0}
|
||||
max={255}
|
||||
step={1}
|
||||
label="Green"
|
||||
w={numberInputWidth}
|
||||
/>
|
||||
<IAINumberInput
|
||||
value={color.b}
|
||||
onChange={handleChangeB}
|
||||
min={0}
|
||||
max={255}
|
||||
step={1}
|
||||
label="Blue"
|
||||
w={numberInputWidth}
|
||||
/>
|
||||
<IAINumberInput
|
||||
value={color.a}
|
||||
onChange={handleChangeA}
|
||||
step={0.1}
|
||||
min={0}
|
||||
max={1}
|
||||
label="Alpha"
|
||||
w={numberInputWidth}
|
||||
isInteger={false}
|
||||
/>
|
||||
</Flex>
|
||||
)}
|
||||
</Flex>
|
||||
);
|
||||
};
|
||||
|
||||
|
@ -245,6 +245,7 @@ const IAICanvasToolChooserOptions = () => {
|
||||
}}
|
||||
>
|
||||
<IAIColorPicker
|
||||
withNumberInput={true}
|
||||
color={brushColor}
|
||||
onChange={(newColor) => dispatch(setBrushColor(newColor))}
|
||||
/>
|
||||
|
@ -31,6 +31,7 @@ const ImageMetadataActions = (props: Props) => {
|
||||
recallCfgScale,
|
||||
recallModel,
|
||||
recallScheduler,
|
||||
recallVaeModel,
|
||||
recallSteps,
|
||||
recallWidth,
|
||||
recallHeight,
|
||||
@ -72,6 +73,10 @@ const ImageMetadataActions = (props: Props) => {
|
||||
recallScheduler(metadata?.scheduler);
|
||||
}, [metadata?.scheduler, recallScheduler]);
|
||||
|
||||
const handleRecallVaeModel = useCallback(() => {
|
||||
recallVaeModel(metadata?.vae);
|
||||
}, [metadata?.vae, recallVaeModel]);
|
||||
|
||||
const handleRecallSteps = useCallback(() => {
|
||||
recallSteps(metadata?.steps);
|
||||
}, [metadata?.steps, recallSteps]);
|
||||
@ -219,6 +224,11 @@ const ImageMetadataActions = (props: Props) => {
|
||||
onClick={handleRecallScheduler}
|
||||
/>
|
||||
)}
|
||||
<ImageMetadataItem
|
||||
label={t('metadata.vae')}
|
||||
value={metadata.vae?.model_name ?? 'Default'}
|
||||
onClick={handleRecallVaeModel}
|
||||
/>
|
||||
{metadata.steps && (
|
||||
<ImageMetadataItem
|
||||
label={t('metadata.steps')}
|
||||
|
@ -36,6 +36,7 @@ import {
|
||||
setRefinerStart,
|
||||
setRefinerSteps,
|
||||
} from 'features/sdxl/store/sdxlSlice';
|
||||
import { isNil } from 'lodash-es';
|
||||
import { useCallback } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { ImageDTO } from 'services/api/types';
|
||||
@ -65,8 +66,10 @@ import {
|
||||
setSeed,
|
||||
setSteps,
|
||||
setWidth,
|
||||
vaeSelected,
|
||||
} from '../store/generationSlice';
|
||||
import {
|
||||
isValidBoolean,
|
||||
isValidCfgScale,
|
||||
isValidControlNetModel,
|
||||
isValidHeight,
|
||||
@ -86,8 +89,8 @@ import {
|
||||
isValidSeed,
|
||||
isValidSteps,
|
||||
isValidStrength,
|
||||
isValidVaeModel,
|
||||
isValidWidth,
|
||||
isValidBoolean,
|
||||
} from '../types/parameterSchemas';
|
||||
|
||||
const selector = createSelector(
|
||||
@ -306,6 +309,25 @@ export const useRecallParameters = () => {
|
||||
[dispatch, parameterSetToast, parameterNotSetToast]
|
||||
);
|
||||
|
||||
/**
|
||||
* Recall vae model
|
||||
*/
|
||||
const recallVaeModel = useCallback(
|
||||
(vae: unknown) => {
|
||||
if (!isValidVaeModel(vae) && !isNil(vae)) {
|
||||
parameterNotSetToast();
|
||||
return;
|
||||
}
|
||||
if (isNil(vae)) {
|
||||
dispatch(vaeSelected(null));
|
||||
} else {
|
||||
dispatch(vaeSelected(vae));
|
||||
}
|
||||
parameterSetToast();
|
||||
},
|
||||
[dispatch, parameterSetToast, parameterNotSetToast]
|
||||
);
|
||||
|
||||
/**
|
||||
* Recall steps with toast
|
||||
*/
|
||||
@ -757,6 +779,7 @@ export const useRecallParameters = () => {
|
||||
positive_prompt,
|
||||
negative_prompt,
|
||||
scheduler,
|
||||
vae,
|
||||
seed,
|
||||
steps,
|
||||
width,
|
||||
@ -798,6 +821,13 @@ export const useRecallParameters = () => {
|
||||
if (isValidScheduler(scheduler)) {
|
||||
dispatch(setScheduler(scheduler));
|
||||
}
|
||||
if (isValidVaeModel(vae) || isNil(vae)) {
|
||||
if (isNil(vae)) {
|
||||
dispatch(vaeSelected(null));
|
||||
} else {
|
||||
dispatch(vaeSelected(vae));
|
||||
}
|
||||
}
|
||||
|
||||
if (isValidSeed(seed)) {
|
||||
dispatch(setSeed(seed));
|
||||
@ -932,6 +962,7 @@ export const useRecallParameters = () => {
|
||||
recallCfgScale,
|
||||
recallModel,
|
||||
recallScheduler,
|
||||
recallVaeModel,
|
||||
recallSteps,
|
||||
recallWidth,
|
||||
recallHeight,
|
||||
|
Loading…
Reference in New Issue
Block a user