How does UIViewRepresentable size itself in relation to the UIKit control inside it?

Question

I'm totally perplexed and unable find documentation on how to wrap a UIKit component and have it be sized correctly. Here's the simplest example, wrapping a UILabel:

public struct SwiftUIText: UIViewRepresentable {
    @Binding public var text: String

    public init(text: Binding<String>) {
        self._text = text
    }

    public func makeUIView(context: Context) -> UILabel {
        UILabel(frame: .zero)
    }

    public func updateUIView(_ textField: UILabel, context: Context) {
        textField.text = text
        textField.textColor = .white
        textField.backgroundColor = .black
    }
}

Nothing special, just a UILabel now ready for SwiftUI. I'll include it in a view:

    var body: some View {
        VStack {
            Text("Hello, World!!! \(text)")
                .font(.caption1Emphasized)

            SwiftUIText(text: $helperText)
        }
        .background(Color.green)
    }

The result is this screen. Notice how the Text at the top takes up just the size it needs, but SwiftUIText takes up all that vertical space. In other iterations of the code, I've seen it shrunken down and not taking up just a small amount of horizontal space.

Can someone explain how I can specify that my component should (A) use up all the width available to it and (B) only the height it needs?

Answer 1

Most simple and quick fix:

        SwiftUIText(text: $helperText).fixedSize()

Update:

        SwiftUIText(text: $helperText)
            .fixedSize(horizontal: false, vertical: true)