Fluentui: Add type for data property on ISelectableOption

Created on 13 Oct 2020  路  6Comments  路  Source: microsoft/fluentui

Describe the feature that you would like added

I would like to be able to provide my own type to the data property on the ISelectableOption interface

What component or utility would this be added to

The ISelectableOption interface in packages\react-internal\src\utilitiesselectableOption\SelectableOption.types.ts

Have you discussed this feature with our team, and if so, who

No

Additional context/screenshots

Community Candidate Selection Fluent UI react In PR Feature

Most helpful comment

@JustSlone and @ashwinGokhale I think that we can make this happen. Having IDropdownOption<T = any> is a great solution to preserve backwards compatibility while still allowing it to be typed.

All 6 comments

@ashwinGokhale Thanks for filing an issue!

@dzearing / @JustSlone as FYI for this contribution

@ashwinGokhale Can you elaborate on the motivation or the problem this would solve? Are there any trade offs that are worth mentioning or alternative solutions to consider?

@JustSlone

We have an internal UI framework based on fluent and we have a certain component based on the fluent dropdown. When we provide options to our custom dropdown, we need to use the data property, but since we use Typescript, we would also like to strongly type the data property. The props in our custom component extends from IDropdownOption, which extends from ISelectableOption. In order to do this, we can pass a generic type from
ICustomDropdownOption<T = any> extends IDropdownOption<T> --> IDropdownOption<T = any> extends ISelectableOption<T> --> ISelectableOption<T = any>.
I think by keeping the default value of the generic as any, we can avoid breaking changes while also providing the option to strongly type the dropdown options.

Thanks for the explanation
Tagging and assigning to @joschect to look into feasibility here.

@ashwinGokhale if the proposed change looks reasonable, are you willing to submit at PR for it?

@JustSlone and @ashwinGokhale I think that we can make this happen. Having IDropdownOption<T = any> is a great solution to preserve backwards compatibility while still allowing it to be typed.

Hi @joschect and @JustSlone I have created a PR for this last week: https://github.com/microsoft/fluentui/pull/15488. Please take a look when you get a chance.

Was this page helpful?
0 / 5 - 0 ratings