jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Refactor: Adjust window size for textInput and textOutput text area

Browse source
This commit is contained in:
igorrCarvalho 2024-03-07 20:47:39 -03:00
commit dcc78c2134
4 changed files with 10 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/frontend/src/components/IOInputField/index.tsx
View file

@ -7,6 +7,7 @@ import { Textarea } from "../ui/textarea";
export default function IOInputField({ export default function IOInputField({
inputType, inputType,
inputId, inputId,
left,
}: IOInputProps): JSX.Element | undefined { }: IOInputProps): JSX.Element | undefined {
const nodes = useFlowStore((state) => state.nodes); const nodes = useFlowStore((state) => state.nodes);
const setNode = useFlowStore((state) => state.setNode); const setNode = useFlowStore((state) => state.setNode);
@ -17,7 +18,7 @@ export default function IOInputField({
case "TextInput": case "TextInput":
return ( return (
<Textarea <Textarea
className="w-full" className={`w-full ${left ? "" : " h-full"}`}
placeholder={"Enter text..."} placeholder={"Enter text..."}
value={node.data.node!.template["input_value"].value} value={node.data.node!.template["input_value"].value}
onChange={(e) => { onChange={(e) => {

3
src/frontend/src/components/IOOutputView/index.tsx
View file

@ -6,6 +6,7 @@ import { Textarea } from "../ui/textarea";
export default function IOOutputView({ export default function IOOutputView({
outputType, outputType,
outputId, outputId,
left,
}: IOOutputProps): JSX.Element | undefined { }: IOOutputProps): JSX.Element | undefined {
const nodes = useFlowStore((state) => state.nodes); const nodes = useFlowStore((state) => state.nodes);
const setNode = useFlowStore((state) => state.setNode); const setNode = useFlowStore((state) => state.setNode);
@ -17,7 +18,7 @@ export default function IOOutputView({
case "TextOutput": case "TextOutput":
return ( return (
<Textarea <Textarea
className="w-full custom-scroll" className={`w-full custom-scroll ${left ? "" : " h-full"}`}
placeholder={"Empty"} placeholder={"Empty"}
// update to real value on flowPool // update to real value on flowPool
value={ value={

4
src/frontend/src/components/IOview/index.tsx
View file

@ -197,6 +197,7 @@ export default function IOView({ children, open, setOpen, disable }: {
<div className=""> <div className="">
{input && ( {input && (
<IOInputField <IOInputField
left={true}
inputType={input.type} inputType={input.type}
inputId={input.id} inputId={input.id}
/> />
@ -265,6 +266,7 @@ export default function IOView({ children, open, setOpen, disable }: {
<div className=""> <div className="">
{output && ( {output && (
<IOOutputView <IOOutputView
left={true}
outputType={output.type} outputType={output.type}
outputId={output.id} outputId={output.id}
/> />
@ -303,11 +305,13 @@ export default function IOView({ children, open, setOpen, disable }: {
(input) => input.id === selectedViewField.id (input) => input.id === selectedViewField.id
) ? ( ) ? (
<IOInputField <IOInputField
left={false}
inputType={selectedViewField.type!} inputType={selectedViewField.type!}
inputId={selectedViewField.id!} inputId={selectedViewField.id!}
/> />
) : ( ) : (
<IOOutputView <IOOutputView
left={false}
outputType={selectedViewField.type!} outputType={selectedViewField.type!}
outputId={selectedViewField.id!} outputId={selectedViewField.id!}
/> />

2
src/frontend/src/types/components/index.ts
View file

@ -670,10 +670,12 @@ export type dropdownButtonPropsType = {
export type IOInputProps = { export type IOInputProps = {
inputType: string; inputType: string;
inputId: string; inputId: string;
left?: boolean;
}; };
export type IOOutputProps = { export type IOOutputProps = {
outputType: string; outputType: string;
outputId: string; outputId: string;
left?: boolean;
}; };
export type IOFileInputProps = { export type IOFileInputProps = {