input list added, not finished

This commit is contained in:
Lucas Oliveira 2023-02-17 17:17:37 -03:00
commit 714bb260c6
6 changed files with 36 additions and 7 deletions

View file

@ -1,5 +1,5 @@
import { Bars3CenterLeftIcon, ChatBubbleBottomCenterTextIcon } from "@heroicons/react/24/outline";
import Input from "../../components/inputComponent";
import InputComponent from "../../components/inputComponent";
import { isValidConnection, nodeColors, snakeToNormalCase } from "../../utils";
import { Handle, Position } from "reactflow";
import Tooltip from "../../components/TooltipComponent";

View file

@ -1,6 +1,6 @@
import { Bars3CenterLeftIcon, ChatBubbleBottomCenterTextIcon } from "@heroicons/react/24/outline";
import { Handle, Position } from "reactflow";
import Input from "../../components/inputComponent";
import InputComponent from "../../components/inputComponent";
import { isValidConnection, nodeColors, snakeToNormalCase } from "../../utils";
import Tooltip from "../../components/TooltipComponent";

View file

@ -6,7 +6,7 @@ import {
snakeToNormalCase,
} from "../../../../utils";
import { useEffect, useRef, useState } from "react";
import Input from "../../../../components/inputComponent";
import InputComponent from "../../../../components/inputComponent";
import ToggleComponent from "../../../../components/toggleComponent";
export default function ParameterComponent({
@ -60,7 +60,7 @@ export default function ParameterComponent({
</Tooltip>
{left === true && type === "str" ? (
<div className="mt-2 w-full">
<Input
<InputComponent
value={data.node.template[name].value ?? ""}
onChange={(t) => {
data.node.template[name].value = t;

View file

@ -1,5 +1,5 @@
import { Bars3CenterLeftIcon, TrashIcon } from "@heroicons/react/24/outline";
import Input from "../../components/inputComponent";
import InputComponent from "../../components/inputComponent";
import {
isValidConnection,
nodeColors,
@ -43,7 +43,7 @@ export default function InputNode({ data }) {
</button>
</div>
<div className="w-full p-5 h-full">
<Input
<InputComponent
value=""
onChange={(e) => {
data.text = e;

View file

@ -1,6 +1,6 @@
import { useState } from "react";
export default function Input({value, onChange}){
export default function InputComponent({value, onChange}){
const [myValue, setMyValue] = useState(value ?? "");
return (
<>

View file

@ -0,0 +1,29 @@
import { useState } from "react";
var _ = require('lodash');
export default function InputListComponent({value, onChange}){
const [inputList, setInputList] = useState(value ?? []);
return (
<>
{inputList.map((i, idx) =>(
<input
type="text"
value={i}
className="block w-full form-input rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm"
placeholder="Type a text"
onChange={(e) => {
setInputList((old) => {
let newInputList = _.cloneDeep(old);
newInputList[idx] = e.target.value;
return newInputList;
});
onChange(inputList);
}}
/>
))}
</>
);
}