- {label}
-
+ {label}
+
{description}
From 4975b1a704ff00163e53a2f2dc4091cce9c6f101 Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Tue, 18 Jul 2023 20:35:20 +1200
Subject: [PATCH 04/12] style: Minor updates to the visual look of the nodes
---
.../src/features/nodes/components/IAINode/IAINodeHeader.tsx | 6 +++---
.../src/features/nodes/components/InvocationComponent.tsx | 2 +-
.../web/src/features/nodes/components/NodeEditor.tsx | 4 ++--
.../web/src/features/nodes/components/NodeWrapper.tsx | 2 +-
invokeai/frontend/web/src/theme/theme.ts | 4 ++--
5 files changed, 9 insertions(+), 9 deletions(-)
diff --git a/invokeai/frontend/web/src/features/nodes/components/IAINode/IAINodeHeader.tsx b/invokeai/frontend/web/src/features/nodes/components/IAINode/IAINodeHeader.tsx
index 226aaed7be..7b56bc95b4 100644
--- a/invokeai/frontend/web/src/features/nodes/components/IAINode/IAINodeHeader.tsx
+++ b/invokeai/frontend/web/src/features/nodes/components/IAINode/IAINodeHeader.tsx
@@ -20,8 +20,8 @@ const IAINodeHeader = (props: IAINodeHeaderProps) => {
justifyContent: 'space-between',
px: 2,
py: 1,
- bg: 'base.300',
- _dark: { bg: 'base.700' },
+ bg: 'base.100',
+ _dark: { bg: 'base.900' },
}}
>
@@ -30,7 +30,7 @@ const IAINodeHeader = (props: IAINodeHeaderProps) => {
sx={{
fontWeight: 600,
color: 'base.900',
- _dark: { color: 'base.100' },
+ _dark: { color: 'base.200' },
}}
>
{title}
diff --git a/invokeai/frontend/web/src/features/nodes/components/InvocationComponent.tsx b/invokeai/frontend/web/src/features/nodes/components/InvocationComponent.tsx
index 608f98d6d2..4c031afaff 100644
--- a/invokeai/frontend/web/src/features/nodes/components/InvocationComponent.tsx
+++ b/invokeai/frontend/web/src/features/nodes/components/InvocationComponent.tsx
@@ -59,7 +59,7 @@ export const InvocationComponent = memo((props: NodeProps) => {
flexDirection: 'column',
borderBottomRadius: 'md',
py: 2,
- bg: 'base.200',
+ bg: 'base.150',
_dark: { bg: 'base.800' },
}}
>
diff --git a/invokeai/frontend/web/src/features/nodes/components/NodeEditor.tsx b/invokeai/frontend/web/src/features/nodes/components/NodeEditor.tsx
index 2be98b1cb9..8c0480774c 100644
--- a/invokeai/frontend/web/src/features/nodes/components/NodeEditor.tsx
+++ b/invokeai/frontend/web/src/features/nodes/components/NodeEditor.tsx
@@ -1,9 +1,9 @@
-import 'reactflow/dist/style.css';
import { Box } from '@chakra-ui/react';
import { ReactFlowProvider } from 'reactflow';
+import 'reactflow/dist/style.css';
-import { Flow } from './Flow';
import { memo } from 'react';
+import { Flow } from './Flow';
const NodeEditor = () => {
return (
diff --git a/invokeai/frontend/web/src/features/nodes/components/NodeWrapper.tsx b/invokeai/frontend/web/src/features/nodes/components/NodeWrapper.tsx
index dc5a94c267..882c6efd69 100644
--- a/invokeai/frontend/web/src/features/nodes/components/NodeWrapper.tsx
+++ b/invokeai/frontend/web/src/features/nodes/components/NodeWrapper.tsx
@@ -1,9 +1,9 @@
import { Box, useToken } from '@chakra-ui/react';
import { NODE_MIN_WIDTH } from 'app/constants';
+import { useAppSelector } from 'app/store/storeHooks';
import { PropsWithChildren } from 'react';
import { DRAG_HANDLE_CLASSNAME } from '../hooks/useBuildInvocation';
-import { useAppSelector } from 'app/store/storeHooks';
type NodeWrapperProps = PropsWithChildren & {
selected: boolean;
diff --git a/invokeai/frontend/web/src/theme/theme.ts b/invokeai/frontend/web/src/theme/theme.ts
index 03d1f640ac..42a5a12c3f 100644
--- a/invokeai/frontend/web/src/theme/theme.ts
+++ b/invokeai/frontend/web/src/theme/theme.ts
@@ -13,13 +13,13 @@ import { popoverTheme } from './components/popover';
import { progressTheme } from './components/progress';
import { no_scrollbar } from './components/scrollbar';
import { selectTheme } from './components/select';
+import { skeletonTheme } from './components/skeleton';
import { sliderTheme } from './components/slider';
import { switchTheme } from './components/switch';
import { tabsTheme } from './components/tabs';
import { textTheme } from './components/text';
import { textareaTheme } from './components/textarea';
import { tooltipTheme } from './components/tooltip';
-import { skeletonTheme } from './components/skeleton';
export const theme: ThemeOverride = {
config: {
@@ -74,7 +74,7 @@ export const theme: ThemeOverride = {
'0px 0px 0px 1px var(--invokeai-colors-base-150), 0px 0px 0px 4px var(--invokeai-colors-accent-400)',
dark: '0px 0px 0px 1px var(--invokeai-colors-base-900), 0px 0px 0px 4px var(--invokeai-colors-accent-400)',
},
- nodeSelectedOutline: `0 0 0 2px var(--invokeai-colors-base-500)`,
+ nodeSelectedOutline: `0 0 0 2px var(--invokeai-colors-accent-450)`,
},
colors: InvokeAIColors,
components: {
From ab2343da5120027fdd593c104138aeb233bbec21 Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Tue, 18 Jul 2023 20:51:08 +1200
Subject: [PATCH 05/12] fix: Hotkeys 'g' and 'o' not resizing the canvas
---
.../frontend/web/src/app/components/GlobalHotkeys.ts | 9 +++++++++
1 file changed, 9 insertions(+)
diff --git a/invokeai/frontend/web/src/app/components/GlobalHotkeys.ts b/invokeai/frontend/web/src/app/components/GlobalHotkeys.ts
index c4660416bf..de8601b593 100644
--- a/invokeai/frontend/web/src/app/components/GlobalHotkeys.ts
+++ b/invokeai/frontend/web/src/app/components/GlobalHotkeys.ts
@@ -1,7 +1,9 @@
import { createSelector } from '@reduxjs/toolkit';
import { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
+import { requestCanvasRescale } from 'features/canvas/store/thunks/requestCanvasScale';
import { shiftKeyPressed } from 'features/ui/store/hotkeysSlice';
+import { activeTabNameSelector } from 'features/ui/store/uiSelectors';
import {
setActiveTab,
toggleGalleryPanel,
@@ -35,6 +37,7 @@ const globalHotkeysSelector = createSelector(
const GlobalHotkeys: React.FC = () => {
const dispatch = useAppDispatch();
const { shift } = useAppSelector(globalHotkeysSelector);
+ const activeTabName = useAppSelector(activeTabNameSelector);
useHotkeys(
'*',
@@ -51,6 +54,9 @@ const GlobalHotkeys: React.FC = () => {
useHotkeys('o', () => {
dispatch(toggleParametersPanel());
+ if (activeTabName === 'unifiedCanvas') {
+ dispatch(requestCanvasRescale());
+ }
});
useHotkeys(['shift+o'], () => {
@@ -59,6 +65,9 @@ const GlobalHotkeys: React.FC = () => {
useHotkeys('g', () => {
dispatch(toggleGalleryPanel());
+ if (activeTabName === 'unifiedCanvas') {
+ dispatch(requestCanvasRescale());
+ }
});
useHotkeys(['shift+g'], () => {
From f803d5cf1e660a88a4850d548e7abace8303237a Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Tue, 18 Jul 2023 21:00:43 +1200
Subject: [PATCH 06/12] fix: Shift O and Shift G not resizing the canvas
correctly
---
.../web/src/app/components/GlobalHotkeys.ts | 21 +++++++++++++------
1 file changed, 15 insertions(+), 6 deletions(-)
diff --git a/invokeai/frontend/web/src/app/components/GlobalHotkeys.ts b/invokeai/frontend/web/src/app/components/GlobalHotkeys.ts
index de8601b593..9827e7f2b3 100644
--- a/invokeai/frontend/web/src/app/components/GlobalHotkeys.ts
+++ b/invokeai/frontend/web/src/app/components/GlobalHotkeys.ts
@@ -16,10 +16,11 @@ import React, { memo } from 'react';
import { isHotkeyPressed, useHotkeys } from 'react-hotkeys-hook';
const globalHotkeysSelector = createSelector(
- (state: RootState) => state.hotkeys,
- (hotkeys) => {
+ [(state: RootState) => state.hotkeys, (state: RootState) => state.ui],
+ (hotkeys, ui) => {
const { shift } = hotkeys;
- return { shift };
+ const { shouldPinParametersPanel, shouldPinGallery } = ui;
+ return { shift, shouldPinGallery, shouldPinParametersPanel };
},
{
memoizeOptions: {
@@ -36,7 +37,9 @@ const globalHotkeysSelector = createSelector(
*/
const GlobalHotkeys: React.FC = () => {
const dispatch = useAppDispatch();
- const { shift } = useAppSelector(globalHotkeysSelector);
+ const { shift, shouldPinParametersPanel, shouldPinGallery } = useAppSelector(
+ globalHotkeysSelector
+ );
const activeTabName = useAppSelector(activeTabNameSelector);
useHotkeys(
@@ -54,24 +57,30 @@ const GlobalHotkeys: React.FC = () => {
useHotkeys('o', () => {
dispatch(toggleParametersPanel());
- if (activeTabName === 'unifiedCanvas') {
+ if (activeTabName === 'unifiedCanvas' && shouldPinParametersPanel) {
dispatch(requestCanvasRescale());
}
});
useHotkeys(['shift+o'], () => {
dispatch(togglePinParametersPanel());
+ if (activeTabName === 'unifiedCanvas') {
+ dispatch(requestCanvasRescale());
+ }
});
useHotkeys('g', () => {
dispatch(toggleGalleryPanel());
- if (activeTabName === 'unifiedCanvas') {
+ if (activeTabName === 'unifiedCanvas' && shouldPinGallery) {
dispatch(requestCanvasRescale());
}
});
useHotkeys(['shift+g'], () => {
dispatch(togglePinGalleryPanel());
+ if (activeTabName === 'unifiedCanvas') {
+ dispatch(requestCanvasRescale());
+ }
});
useHotkeys('1', () => {
From 3ffca5490e71f51c40a2c6e154a9372596302b28 Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Tue, 18 Jul 2023 22:20:28 +1200
Subject: [PATCH 07/12] fix: Brush opacity hotkeys not working
---
.../IAICanvasToolbar/IAICanvasToolChooserOptions.tsx | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/invokeai/frontend/web/src/features/canvas/components/IAICanvasToolbar/IAICanvasToolChooserOptions.tsx b/invokeai/frontend/web/src/features/canvas/components/IAICanvasToolbar/IAICanvasToolChooserOptions.tsx
index 794b8ba795..158e2954af 100644
--- a/invokeai/frontend/web/src/features/canvas/components/IAICanvasToolbar/IAICanvasToolChooserOptions.tsx
+++ b/invokeai/frontend/web/src/features/canvas/components/IAICanvasToolbar/IAICanvasToolChooserOptions.tsx
@@ -139,7 +139,7 @@ const IAICanvasToolChooserOptions = () => {
);
useHotkeys(
- ['shift+BracketLeft'],
+ ['Shift+BracketLeft'],
() => {
dispatch(
setBrushColor({
@@ -156,7 +156,7 @@ const IAICanvasToolChooserOptions = () => {
);
useHotkeys(
- ['shift+BracketRight'],
+ ['Shift+BracketRight'],
() => {
dispatch(
setBrushColor({
From f970e3792f6b081190e64ef81bcd28af28eed330 Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Tue, 18 Jul 2023 22:20:45 +1200
Subject: [PATCH 08/12] fix: Snap to grid hotkey not working
---
.../components/IAICanvasToolbar/IAICanvasBoundingBox.tsx | 6 ++++++
1 file changed, 6 insertions(+)
diff --git a/invokeai/frontend/web/src/features/canvas/components/IAICanvasToolbar/IAICanvasBoundingBox.tsx b/invokeai/frontend/web/src/features/canvas/components/IAICanvasToolbar/IAICanvasBoundingBox.tsx
index 3421749658..3086e001c2 100644
--- a/invokeai/frontend/web/src/features/canvas/components/IAICanvasToolbar/IAICanvasBoundingBox.tsx
+++ b/invokeai/frontend/web/src/features/canvas/components/IAICanvasToolbar/IAICanvasBoundingBox.tsx
@@ -11,6 +11,7 @@ import {
setIsMouseOverBoundingBox,
setIsMovingBoundingBox,
setIsTransformingBoundingBox,
+ setShouldSnapToGrid,
} from 'features/canvas/store/canvasSlice';
import { uiSelector } from 'features/ui/store/uiSelectors';
import Konva from 'konva';
@@ -20,6 +21,7 @@ import { Vector2d } from 'konva/lib/types';
import { isEqual } from 'lodash-es';
import { useCallback, useEffect, useRef, useState } from 'react';
+import { useHotkeys } from 'react-hotkeys-hook';
import { Group, Rect, Transformer } from 'react-konva';
const boundingBoxPreviewSelector = createSelector(
@@ -91,6 +93,10 @@ const IAICanvasBoundingBox = (props: IAICanvasBoundingBoxPreviewProps) => {
const scaledStep = 64 * stageScale;
+ useHotkeys('N', () => {
+ dispatch(setShouldSnapToGrid(!shouldSnapToGrid));
+ });
+
const handleOnDragMove = useCallback(
(e: KonvaEventObject) => {
if (!shouldSnapToGrid) {
From e6bfc382a59d250df9466ae8fb05eb2d70580edf Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Tue, 18 Jul 2023 22:25:26 +1200
Subject: [PATCH 09/12] cleanup: Removed unused hotkeys from hotkeys modal
---
.../system/components/HotkeysModal/HotkeysModal.tsx | 12 +-----------
1 file changed, 1 insertion(+), 11 deletions(-)
diff --git a/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx b/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx
index 4a7f4292eb..ac8c684949 100644
--- a/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx
+++ b/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx
@@ -15,7 +15,7 @@ import {
ModalOverlay,
useDisclosure,
} from '@chakra-ui/react';
-import { cloneElement, ReactElement } from 'react';
+import { ReactElement, cloneElement } from 'react';
import { useTranslation } from 'react-i18next';
import HotkeysModalItem from './HotkeysModalItem';
@@ -65,11 +65,6 @@ export default function HotkeysModal({ children }: HotkeysModalProps) {
desc: t('hotkeys.pinOptions.desc'),
hotkey: 'Shift+O',
},
- {
- title: t('hotkeys.toggleViewer.title'),
- desc: t('hotkeys.toggleViewer.desc'),
- hotkey: 'Z',
- },
{
title: t('hotkeys.toggleGallery.title'),
desc: t('hotkeys.toggleGallery.desc'),
@@ -109,11 +104,6 @@ export default function HotkeysModal({ children }: HotkeysModalProps) {
desc: t('hotkeys.setParameters.desc'),
hotkey: 'A',
},
- {
- title: t('hotkeys.restoreFaces.title'),
- desc: t('hotkeys.restoreFaces.desc'),
- hotkey: 'Shift+R',
- },
{
title: t('hotkeys.upscale.title'),
desc: t('hotkeys.upscale.desc'),
From 5d635c722189090b6e69a449ff0f17d644ba4dae Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Tue, 18 Jul 2023 22:27:36 +1200
Subject: [PATCH 10/12] cleanup: Remove console hotkey from modal (no console
anymore)
---
.../system/components/HotkeysModal/HotkeysModal.tsx | 6 ------
1 file changed, 6 deletions(-)
diff --git a/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx b/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx
index ac8c684949..4da46fdac9 100644
--- a/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx
+++ b/invokeai/frontend/web/src/features/system/components/HotkeysModal/HotkeysModal.tsx
@@ -80,12 +80,6 @@ export default function HotkeysModal({ children }: HotkeysModalProps) {
desc: t('hotkeys.changeTabs.desc'),
hotkey: '1-5',
},
-
- {
- title: t('hotkeys.consoleToggle.title'),
- desc: t('hotkeys.consoleToggle.desc'),
- hotkey: '`',
- },
];
const generalHotkeys = [
From 112937f1f8ce7140f6c6fc14315626cf8a164979 Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Tue, 18 Jul 2023 22:44:36 +1200
Subject: [PATCH 11/12] reqs: Update compel to 2.0.0
---
pyproject.toml | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/pyproject.toml b/pyproject.toml
index 67df6108b8..fd6064f985 100644
--- a/pyproject.toml
+++ b/pyproject.toml
@@ -38,7 +38,7 @@ dependencies = [
"albumentations",
"click",
"clip_anytorch", # replacing "clip @ https://github.com/openai/CLIP/archive/eaa22acb90a5876642d0507623e859909230a52d.zip",
- "compel==2.0.0rc2",
+ "compel==2.0.0",
"controlnet-aux>=0.0.6",
"timm==0.6.13", # needed to override timm latest in controlnet_aux, see https://github.com/isl-org/ZoeDepth/issues/26
"datasets",
From bd4eaa455a7c390a8bacf3d95d442be4b8b1e102 Mon Sep 17 00:00:00 2001
From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com>
Date: Tue, 18 Jul 2023 23:58:07 +1200
Subject: [PATCH 12/12] fix: Update text to Badge in ModelListItem
---
.../ModelManagerPanel/ModelListItem.tsx | 17 ++++++++---------
1 file changed, 8 insertions(+), 9 deletions(-)
diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/ModelManager/subpanels/ModelManagerPanel/ModelListItem.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/ModelManager/subpanels/ModelManagerPanel/ModelListItem.tsx
index 24842d8eb2..224b0ac003 100644
--- a/invokeai/frontend/web/src/features/ui/components/tabs/ModelManager/subpanels/ModelManagerPanel/ModelListItem.tsx
+++ b/invokeai/frontend/web/src/features/ui/components/tabs/ModelManager/subpanels/ModelManagerPanel/ModelListItem.tsx
@@ -1,5 +1,5 @@
import { DeleteIcon } from '@chakra-ui/icons';
-import { Flex, Text, Tooltip } from '@chakra-ui/react';
+import { Badge, Flex, Text, Tooltip } from '@chakra-ui/react';
import { makeToast } from 'app/components/Toaster';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import IAIAlertDialog from 'common/components/IAIAlertDialog';
@@ -98,15 +98,14 @@ export default function ModelListItem(props: ModelListItemProps) {
onClick={handleSelectModel}
>
-
{
@@ -114,7 +113,7 @@ export default function ModelListItem(props: ModelListItemProps) {
model.base_model as keyof typeof modelBaseTypeMap
]
}
-
+
{model.model_name}