feat(ui): restore resizable prompt boxes

The autosize proved to be unpopular. Changed back to resizable.
This commit is contained in:
psychedelicious 2024-01-11 23:44:20 +11:00
parent 98a44d7fa1
commit 59437a02c3
7 changed files with 11 additions and 20 deletions

View File

@ -24,8 +24,8 @@ export const InvAutosizeTextarea = memo(
ref={ref}
overflow="scroll"
w="100%"
resize="none"
minRows={3}
minH={20}
onPaste={stopPastePropagation}
onKeyUp={onKeyUpDown}
onKeyDown={onKeyUpDown}

View File

@ -23,6 +23,7 @@ export const InvTextarea = memo(
onPaste={stopPastePropagation}
onKeyUp={onKeyUpDown}
onKeyDown={onKeyUpDown}
minH={20}
{...rest}
/>
);

View File

@ -1,6 +1,6 @@
import { Box } from '@chakra-ui/layout';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvAutosizeTextarea } from 'common/components/InvAutosizeTextarea/InvAutosizeTextarea';
import { InvTextarea } from 'common/components/InvTextarea/InvTextarea';
import { AddEmbeddingButton } from 'features/embedding/AddEmbeddingButton';
import { EmbeddingPopover } from 'features/embedding/EmbeddingPopover';
import { usePrompt } from 'features/embedding/usePrompt';
@ -35,7 +35,7 @@ export const ParamNegativePrompt = memo(() => {
width={textareaRef.current?.clientWidth}
>
<Box pos="relative">
<InvAutosizeTextarea
<InvTextarea
id="negativePrompt"
name="negativePrompt"
ref={textareaRef}
@ -43,10 +43,7 @@ export const ParamNegativePrompt = memo(() => {
placeholder={t('parameters.negativePromptPlaceholder')}
onChange={onChange}
onKeyDown={onKeyDown}
minH="unset"
fontSize="sm"
minRows={2}
maxRows={5}
variant="darkFilled"
/>
<PromptOverlayButtonWrapper>

View File

@ -1,6 +1,6 @@
import { Box } from '@chakra-ui/layout';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvAutosizeTextarea } from 'common/components/InvAutosizeTextarea/InvAutosizeTextarea';
import { InvTextarea } from 'common/components/InvTextarea/InvTextarea';
import { ShowDynamicPromptsPreviewButton } from 'features/dynamicPrompts/components/ShowDynamicPromptsPreviewButton';
import { AddEmbeddingButton } from 'features/embedding/AddEmbeddingButton';
import { EmbeddingPopover } from 'features/embedding/EmbeddingPopover';
@ -58,16 +58,15 @@ export const ParamPositivePrompt = memo(() => {
width={textareaRef.current?.clientWidth}
>
<Box pos="relative">
<InvAutosizeTextarea
<InvTextarea
id="prompt"
name="prompt"
ref={textareaRef}
value={prompt}
placeholder={t('parameters.positivePromptPlaceholder')}
onChange={onChange}
minH={28}
onKeyDown={onKeyDown}
minRows={4}
maxRows={7}
variant="darkFilled"
/>
<PromptOverlayButtonWrapper>

View File

@ -1,6 +1,6 @@
import { Box } from '@chakra-ui/layout';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvAutosizeTextarea } from 'common/components/InvAutosizeTextarea/InvAutosizeTextarea';
import { InvTextarea } from 'common/components/InvTextarea/InvTextarea';
import { AddEmbeddingButton } from 'features/embedding/AddEmbeddingButton';
import { EmbeddingPopover } from 'features/embedding/EmbeddingPopover';
import { usePrompt } from 'features/embedding/usePrompt';
@ -45,7 +45,7 @@ export const ParamSDXLNegativeStylePrompt = memo(() => {
width={textareaRef.current?.clientWidth}
>
<Box pos="relative">
<InvAutosizeTextarea
<InvTextarea
id="prompt"
name="prompt"
ref={textareaRef}
@ -53,10 +53,7 @@ export const ParamSDXLNegativeStylePrompt = memo(() => {
placeholder={t('sdxl.negStylePrompt')}
onChange={onChange}
onKeyDown={onKeyDown}
minH="unset"
fontSize="sm"
minRows={2}
maxRows={5}
variant="darkFilled"
/>
<PromptOverlayButtonWrapper>

View File

@ -1,6 +1,6 @@
import { Box } from '@chakra-ui/layout';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvAutosizeTextarea } from 'common/components/InvAutosizeTextarea/InvAutosizeTextarea';
import { InvTextarea } from 'common/components/InvTextarea/InvTextarea';
import { AddEmbeddingButton } from 'features/embedding/AddEmbeddingButton';
import { EmbeddingPopover } from 'features/embedding/EmbeddingPopover';
import { usePrompt } from 'features/embedding/usePrompt';
@ -35,7 +35,7 @@ export const ParamSDXLPositiveStylePrompt = memo(() => {
width={textareaRef.current?.clientWidth}
>
<Box pos="relative">
<InvAutosizeTextarea
<InvTextarea
id="prompt"
name="prompt"
ref={textareaRef}
@ -43,10 +43,7 @@ export const ParamSDXLPositiveStylePrompt = memo(() => {
placeholder={t('sdxl.posStylePrompt')}
onChange={onChange}
onKeyDown={onKeyDown}
minH="unset"
fontSize="sm"
minRows={2}
maxRows={5}
variant="darkFilled"
/>
<PromptOverlayButtonWrapper>