Hello! Is there a way to use PropTypes in Kotlin JS React? Or some other way / workaround to enforce...

# javascript

[Rafał Kuźmiński]

Hello! Is there a way to use PropTypes in Kotlin JS React? Or some other way / workaround to enforce some properties to be passed to component?
I could do a function decorating component, but I have no idea how to create lambda which would use both ChildrenBuilder AND my Properties:

So we got example component:

external interface ExampleProps : Props {
    var optionalProp: String?
    var mandatoryProp: String
}

val Example = FC<ExampleProps> { props ->

}

Decorator:

fun ChildrenBuilder.ExampleDecorator(mandatory: String, prop: ChildrenBuilder.(props: ExampleProps) -> Unit) {
    Example {
        prop(this)
        mandatoryProp = mandatory
    }
}

and usage:

val usage = FC<Props> {

    Example {
        // Here this is ChildrenBuilder & ExampleProps & Props
    }

    ExampleDecorator("abc") {
        // Here it is ExampleProps and this is ChildrenBuilder 
    }
    
}

As you can see, in ExampleDecorator ExampleProps is not in "this" but in "it". How can I change this to create same receiver type as React?

[turansky]

First rule of ChildrenBuilder - don’t use ChildrenBuilder directly 🙂

[Rafał Kuźmiński]

Is there a reason? And how in other way can I create such a decorator?

[turansky]

If it’s only about mandatory fields - it’s recommended to use default component creation instead

[Rafał Kuźmiński]

What do you mean by default component creation? Can you provide some example with mandatory fields?