[Select] new itemDisabled prop #2580
Conversation
`moveActiveIndex` is now recursive and wraps around when reaching top/bottom of list
SelectExample option to disable films before year 2000Preview: documentation | landing | table |
| initialContent={initialContent} | ||
| noResults={<MenuItem disabled={true} text="No results." />} | ||
| onItemSelect={this.handleValueChange} | ||
| popoverProps={{ minimal }} | ||
| > | ||
| <Button rightIcon="caret-down" text={film ? film.title : "(No selection)"} disabled={disabled} /> | ||
| <Button | ||
| icon="film" |
moveActiveIndex => getNextActiveItem returns TPreview: documentation | landing | table |
required index paramPreview: documentation | landing | table |
| @@ -106,4 +120,6 @@ export class SelectExample extends React.PureComponent<IExampleProps, ISelectExa | |||
| this.setState(state => ({ ...state, [prop]: checked })); | |||
| }; | |||
| } | |||
|
|
|||
| private isItemDisabled = (film: IFilm) => this.state.disableItems && film.year < 2000; | |||
There was a problem hiding this comment.
this works because no films were ever produced prior to Jan 1, 1990 😜
| return undefined; | ||
| } else if (this.isItemDisabled(filteredItems[nextActiveIndex], nextActiveIndex)) { | ||
| // keep on moving in given direction if this item is disabled. | ||
| return this.getNextActiveItem(direction, nextActiveIndex, startIndex); |
There was a problem hiding this comment.
seems a little weird to use recursion on an unbounded list when iterating would suffice
There was a problem hiding this comment.
i found recursion to be the simplest code change here (tho i then went ham on the refactor 🤷♂️)
There was a problem hiding this comment.
will refactor to use a loop
|
I'll note that if you select shawshank then disable items from 1990's, it remains selected. I don't think that's necessarily a bug, but it does mean that if you change the selection, you can't revert to shawshank. |
|
that's an artifact of the example implementation. selection is purely controlled by the parent. |
half the line count!
break recursion with a do/whilePreview: documentation | landing | table |
Changes proposed in this pull request:
itemDisabled: keyof T | (T => boolean)prop allows disabling items in the list!