Currently makeStyles and useTheme are simply reexported from @material-ui and only assume the base MUI Theme type. It would be nice if using these functions from @alteryx/ui would be typed with Alteryx's extended Theme type instead.
import { makeStyles, useTheme } from '@alteryx/ui'
const useStyles = makeStyles(theme => ({
foobar: {
// (TS) Property 'passive' does not exist on type 'TypeAction'
color: theme.palette.action.passive
}
}))
const MyComponent = (): JSX.Element => {
const theme = useTheme()
return (
// (TS) Property 'passive' does not exist on type 'TypeAction'
<div style={{ color: theme.palette.action.passive }} />
)
}
Currently, we have to specify the Alteryx Theme type every time.
import type { Theme as AyxTheme } from '@alteryx/ui'
import { makeStyles, useTheme } from '@alteryx/ui'
const useStyles = makeStyles((theme: AyxTheme) => ({ ... }))
const theme = useTheme<AyxTheme>()
Hey Pillow. Thanks for letting us know about this issue. We currently have that planned for a future update but we don't know when that will be released.
Currently
makeStyles
anduseTheme
are simply reexported from@material-ui
and only assume the base MUITheme
type. It would be nice if using these functions from@alteryx/ui
would be typed with Alteryx's extendedTheme
type instead.Currently, we have to specify the Alteryx
Theme
type every time.