import { merge } from "lodash" ; import { makeStyles } from ".." ; export type ListGridTemplate = string [ ] | Record < string , string [ ] > ; export const useGridTemplateStyles = makeStyles < { width : ListGridTemplate ; } , "root" > ( ( ) => ( { root : ( { width } ) => { if ( width instanceof Array ) { return { gridTemplateColumns : width . join ( " " ) } ; } const x = Object . entries ( width ) . map ( ( [ breakpoint , value ] ) => ( { [ breakpoint ] : { gridTemplateColumns : value . join ( " " ) } } ) ) ; return { ... merge ( { } , ... x ) } ; } } ) , { name : "ListGrid" } ) ; export const useStyles = makeStyles ( ( ) => ( { row : { alignItems : "center" , display : "grid" } , cell : { boxSizing : "content-box" , flex : 1 } , body : { margin : 0 , padding : 0 } } ) , { name : "BaseList" } ) ;