Hi all
I am trying a write a binding for Material ui Grid API https://material-ui.com/api/grid/ and generate the genType tsx to be used in the other typescript parts
I stumbled upon the type which have the following values
false
| ‘auto’
| true
| 1
| 2
| 3
| 4
| 5
| 6
| 7
| 8
| 9
| 10
| 11
| 12
I tried to follow the bs-materialui guidelines to come up with the type like this
module Xs: {
type t
let _false: t
let auto: t
let _true: t
let _1: t
let _2: t
let _3: t
let _4: t
let _5: t
let _6: t
let _7: t
let _8: t
let _9: t
let _10: t
let _11: t
let _12: t
} = {
@unboxed
type rec t = Any('a): t
let _false = Any(false)
let auto = Any(“auto”)
let _true = Any(true)
let _1 = Any(1)
let _2 = Any(2)
let _3 = Any(3)
let _4 = Any(4)
let _5 = Any(5)
let _6 = Any(6)
let _7 = Any(7)
let _8 = Any(8)
let _9 = Any(9)
let _10 = Any(10)
let _11 = Any(11)
let _12 = Any(12)
}
module Component: {
type t
let string: string => t
let callback: (unit => React.element) => t
let element: React.element => t
} = {
@unboxed
type rec t = Any('a): t
let string = (v: string) => Any(v)
let callback = (v: unit => React.element) => Any(v)
let element = (v: React.element) => Any(v)
}
type alignContent = [#Stretch | #Center | #Flex_Start | #Flex_End | #Space_Between | #Space_Around]
module Grid = {
type spacing = [#V0 | #V1 | #V2 | #V3 | #V4 | #V5 | #V6 | #V7 | #V8 | #V9 | #V10]
@genType.import(("@material-ui/core", “Grid”)) @react.component
external make: (
~className: string=?,
~component: Component.t,
~alignContent: @bs.string
[
| @bs.as(“stretch”)
#Stretch
| @bs.as(“center”)
#Center
| @bs.as(“flex-start”)
#Flex_Start
| @bs.as(“flex-end”)
#Flex_End
| @bs.as(“space-between”)
#Space_Between
| @bs.as(“space-around”)
#Space_Around
]=?,
~container: bool=?,
~spacing: @bs.int
[
| @bs.as(0)
#V0
| @bs.as(1)
#V1
| @bs.as(2)
#V2
| @bs.as(3)
#V3
| @bs.as(4)
#V4
| @bs.as(5)
#V5
| @bs.as(6)
#V6
| @bs.as(7)
#V7
| @bs.as(8)
#V8
| @bs.as(9)
#V9
| @bs.as(10)
#V10
]=?,
~item: bool=?,
~children: React.element=?,
~xs: Xs.t=?,
~key: string=?,
~id: string=?,
) => React.element = “Grid”
}
I have the following error from the ts compiler.
Types of property ‘xs’ are incompatible.
Type ‘Xs_t’ is not assignable to type ‘boolean | “auto” | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | undefined’.
Type ‘Xs_t’ is not assignable to type ‘12’.
I am using the
bs-platform: 8.4.2,
Material ui: 4.11.0
Nextjs: 10.0.1
Please guide me