diff --git a/packages/graph-editor/src/hooks/useIsValidConnection.ts b/packages/graph-editor/src/hooks/useIsValidConnection.ts index 0e0818f6..61ab465a 100644 --- a/packages/graph-editor/src/hooks/useIsValidConnection.ts +++ b/packages/graph-editor/src/hooks/useIsValidConnection.ts @@ -36,14 +36,16 @@ export const useIsValidConnection = ({ } const strippedVariadic = stripVariadic(connection.targetHandle!); - + let targetType = target?.inputs[strippedVariadic].type!; - const sourceType = source?.outputs[connection.sourceHandle!].type!; + let sourceType = source?.outputs[connection.sourceHandle!].type!; - //Check if the target is variadic - if (target.inputs[strippedVariadic].variadic) { + if (target.inputs[strippedVariadic].type.items) { targetType = target.inputs[strippedVariadic].type.items; } + if (source.outputs[connection.sourceHandle!].type.items) { + sourceType = source.outputs[connection.sourceHandle!].type.items; + } const canConvert = canConvertSchemaTypes(sourceType, targetType); diff --git a/packages/nodes-design-tokens/src/nodes/flatten.ts b/packages/nodes-design-tokens/src/nodes/flatten.ts index cd8c4e18..63a4d2db 100644 --- a/packages/nodes-design-tokens/src/nodes/flatten.ts +++ b/packages/nodes-design-tokens/src/nodes/flatten.ts @@ -11,7 +11,7 @@ export default class FlattenNode extends Node { super(props); this.addInput("tokens", { type: { - ...createVariadicSchema(TokenSetSchema), + ...createVariadicSchema(TokenSchema), default: [], }, variadic: true, diff --git a/packages/nodes-design-tokens/src/ui/controls/index.tsx b/packages/nodes-design-tokens/src/ui/controls/index.tsx index cf2d040d..c7a72e32 100644 --- a/packages/nodes-design-tokens/src/ui/controls/index.tsx +++ b/packages/nodes-design-tokens/src/ui/controls/index.tsx @@ -3,10 +3,13 @@ import { TokenArrayField } from "./tokenSet.js" import { TokenField } from "./token.js" import { VariadicTokenSet } from "./variadicTokenSet.js" import { variadicMatcher } from "@tokens-studio/graph-editor" -import type { Port } from "@tokens-studio/graph-engine" +import type { Input, Port } from "@tokens-studio/graph-engine" export const controls = [{ - matcher: (port: Port) => port.type.type === 'array' && port.type.items?.$id === TOKEN, + matcher: (port: Port) => { + const inputPort = port as Input; + return inputPort.type.type === 'array' && inputPort.type.items?.$id === TOKEN && !inputPort.variadic + }, component: TokenArrayField, }, {