nop renderField usage with MuiFieldSelect results in typescript error
Closed this issue · 4 comments
Mattwmaster58 commented
Describe the bug
Based on this example, I thought it would be possible to do something like this:
import type {Config} from '@react-awesome-query-builder/mui'; // for TS example
import {MuiWidgets} from '@react-awesome-query-builder/mui';
import {MuiConfig} from '@react-awesome-query-builder/mui';
import React from 'react';
const {MuiFieldSelect} = MuiWidgets;
const config: Config = {
...MuiConfig,
settings: {
renderField: (props) => <MuiFieldSelect {...props} />,
},
}
But I get a TS error on MuiFieldSelect
:
TS2322: Type '{ key?: Key | null | undefined; items?: FieldItems | undefined; setField?: ((fieldPath: string) => void) | undefined; selectedKey?: string | Empty; selectedKeys?: string[] | Empty; ... 10 more ...; groupId?: string | undefined; }' is not assignable to type 'FieldProps<Config>'. Types of property 'items' are incompatible. Type 'FieldItems | undefined' is not assignable to type 'FieldItems'. Type 'undefined' is not assignable to type 'FieldItem[]'
Additional context
If the MUI package uses the MuiFieldSelect component, shouldn't this work?
ukrbublik commented
Can't reproduce your type issue.
Do you use version 6.2.0?
You need to extend settings from MuiConfig.settings
:
settings: {
...MuiConfig.settings,
renderField: (props) => <MuiFieldSelect {...props} />,
},
Do you see same error after this fix?
Mattwmaster58 commented
Yes, using version v6.2.0. Same error after spreading settings. Here is my tsconfig.json. You can clone that whole repo and yarn install + start and should get the same error.
ukrbublik commented
Got it. The reason is strictNullChecks: true
(which is by default).
ukrbublik commented
Fixed in 6.3.0