Implemented only one node with both types
This commit is contained in:
parent
876a691004
commit
369ce5feb5
2 changed files with 108 additions and 118 deletions
|
|
@ -46,17 +46,15 @@ export default function ParameterComponent({
|
||||||
const { reactFlowInstance } = useContext(typesContext);
|
const { reactFlowInstance } = useContext(typesContext);
|
||||||
let disabled =
|
let disabled =
|
||||||
reactFlowInstance?.getEdges().some((e) => e.targetHandle === id) ?? false;
|
reactFlowInstance?.getEdges().some((e) => e.targetHandle === id) ?? false;
|
||||||
let disabledSource =
|
|
||||||
reactFlowInstance?.getEdges().some((e) => e.sourceHandle !== id && e.source === data.id) ?? false;
|
|
||||||
const { save } = useContext(TabsContext);
|
const { save } = useContext(TabsContext);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
ref={ref}
|
ref={ref}
|
||||||
className={"w-full flex flex-wrap justify-between items-center dark:text-white mt-1 px-5 py-2 " + (!left ? (disabledSource ? "bg-gray-100 dark:bg-gray-700 text-gray-500": "bg-gray-50 dark:bg-gray-800") : "bg-gray-50 dark:bg-gray-800")}
|
className="w-full flex flex-wrap justify-between items-center bg-gray-50 dark:bg-gray-800 dark:text-white mt-1 px-5 py-2"
|
||||||
>
|
>
|
||||||
<>
|
<>
|
||||||
<div className="text-sm truncate">
|
<div className={"text-sm truncate w-full " + (left ? "" : "text-end")}>
|
||||||
{title}
|
{title}
|
||||||
<span className="text-red-600">{required ? " *" : ""}</span>
|
<span className="text-red-600">{required ? " *" : ""}</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -78,8 +76,8 @@ export default function ParameterComponent({
|
||||||
isValidConnection(connection, reactFlowInstance)
|
isValidConnection(connection, reactFlowInstance)
|
||||||
}
|
}
|
||||||
className={classNames(
|
className={classNames(
|
||||||
left ? "-ml-0.5 " : ("-mr-0.5 " + (disabledSource ? "pointer-events-none border-gray-400 " : "")),
|
left ? "-ml-0.5 " : "-mr-0.5 ",
|
||||||
"w-3 h-3 rounded-full border-2 bg-white dark:bg-gray-800",
|
"w-3 h-3 rounded-full border-2 bg-white dark:bg-gray-800"
|
||||||
)}
|
)}
|
||||||
style={{
|
style={{
|
||||||
borderColor: color,
|
borderColor: color,
|
||||||
|
|
|
||||||
|
|
@ -71,7 +71,7 @@ export default function GenericNode({
|
||||||
<div key={idx}>
|
<div key={idx}>
|
||||||
{idx === 0 ? (
|
{idx === 0 ? (
|
||||||
<div className="px-5 py-2 mt-2 dark:text-white text-center">
|
<div className="px-5 py-2 mt-2 dark:text-white text-center">
|
||||||
Inputs:
|
Inputs
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<></>
|
<></>
|
||||||
|
|
@ -100,26 +100,18 @@ export default function GenericNode({
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
{data.node.base_classes.map((c, idx) => (
|
|
||||||
<div key={idx}>
|
|
||||||
{idx === 0 ? (
|
|
||||||
<div className="px-5 py-2 mt-2 dark:text-white text-center">
|
<div className="px-5 py-2 mt-2 dark:text-white text-center">
|
||||||
Outputs:
|
Output
|
||||||
</div>
|
</div>
|
||||||
) : (
|
|
||||||
<></>
|
|
||||||
)}
|
|
||||||
<ParameterComponent
|
<ParameterComponent
|
||||||
data={data}
|
data={data}
|
||||||
color={nodeColors[types[c]] ?? nodeColors.unknown}
|
color={nodeColors[types[data.type]] ?? nodeColors.unknown}
|
||||||
title={c}
|
title={data.node.base_classes.join(" | ")}
|
||||||
tooltipTitle={`Type: ${c}`}
|
tooltipTitle={`Type: ${data.node.base_classes.join(" | ")}`}
|
||||||
id={[data.type, data.id, c].join("|")}
|
id={[data.type, data.id, ...data.node.base_classes].join("|")}
|
||||||
type={c}
|
type={data.node.base_classes.join("|")}
|
||||||
left={false}
|
left={false}
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</>
|
</>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue