Spaces:
Running
Running
File size: 2,520 Bytes
be095f5 d7ccb5f 8fe4e41 be095f5 d7ccb5f 8fe4e41 be095f5 8fe4e41 be095f5 8fe4e41 686fa90 8fe4e41 686fa90 8fe4e41 686fa90 8fe4e41 9a36487 be095f5 8fe4e41 be095f5 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 |
const BOOLEAN = "<class 'bool'>";
function ParamName({ name }: { name: string }) {
return (
<span className="param-name bg-base-200">{name.replace(/_/g, " ")}</span>
);
}
interface NodeParameterProps {
name: string;
value: any;
meta: any;
onChange: (value: any, options?: { delay: number }) => void;
}
export default function NodeParameter({
name,
value,
meta,
onChange,
}: NodeParameterProps) {
return (
// biome-ignore lint/a11y/noLabelWithoutControl: Most of the time there is a control.
<label className="param">
{meta?.type?.format === "collapsed" ? (
<>
<ParamName name={name} />
<button className="collapsed-param">⋯</button>
</>
) : meta?.type?.format === "textarea" ? (
<>
<ParamName name={name} />
<textarea
className="textarea textarea-bordered w-full"
rows={6}
value={value}
onChange={(evt) => onChange(evt.currentTarget.value, { delay: 2 })}
onBlur={(evt) => onChange(evt.currentTarget.value, { delay: 0 })}
/>
</>
) : meta?.type?.enum ? (
<>
<ParamName name={name} />
<select
className="select select-bordered w-full"
value={value || meta.type.enum[0]}
onChange={(evt) => onChange(evt.currentTarget.value)}
>
{meta.type.enum.map((option: string) => (
<option key={option} value={option}>
{option}
</option>
))}
</select>
</>
) : meta?.type?.type === BOOLEAN ? (
<div className="form-control">
<label className="label cursor-pointer">
<input
className="checkbox"
type="checkbox"
checked={value}
onChange={(evt) => onChange(evt.currentTarget.checked)}
/>
{name.replace(/_/g, " ")}
</label>
</div>
) : (
<>
<ParamName name={name} />
<input
className="input input-bordered w-full"
value={value || ""}
onChange={(evt) => onChange(evt.currentTarget.value, { delay: 2 })}
onBlur={(evt) => onChange(evt.currentTarget.value, { delay: 0 })}
onKeyDown={(evt) =>
evt.code === "Enter" &&
onChange(evt.currentTarget.value, { delay: 0 })
}
/>
</>
)}
</label>
);
}
|