input list added, not finished
This commit is contained in:
parent
ddb648dcbf
commit
714bb260c6
6 changed files with 36 additions and 7 deletions
|
|
@ -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";
|
||||
|
|
|
|||
|
|
@ -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";
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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 (
|
||||
<>
|
||||
|
|
|
|||
29
space_flow/src/components/inputListComponent/index.tsx
Normal file
29
space_flow/src/components/inputListComponent/index.tsx
Normal 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);
|
||||
}}
|
||||
/>
|
||||
))}
|
||||
|
||||
</>
|
||||
);
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue