diff options
author | madelinegr <mgriswold99@gmail.com> | 2019-03-04 17:43:13 -0500 |
---|---|---|
committer | madelinegr <mgriswold99@gmail.com> | 2019-03-04 17:43:13 -0500 |
commit | 604c79c214ac37059346139024aa199bb47cd877 (patch) | |
tree | e82d2f613fe0596f50a201a7eecddfcf7410db58 /src/client/views/ContextMenu.tsx | |
parent | 9b63097989d7a1bfb803b27935959945aacfae5f (diff) | |
parent | 77dc4aa8b5033d8c7896809d1417ed8305de1421 (diff) |
mer conf
Diffstat (limited to 'src/client/views/ContextMenu.tsx')
-rw-r--r-- | src/client/views/ContextMenu.tsx | 14 |
1 files changed, 13 insertions, 1 deletions
diff --git a/src/client/views/ContextMenu.tsx b/src/client/views/ContextMenu.tsx index 9459d45f8..fcb934860 100644 --- a/src/client/views/ContextMenu.tsx +++ b/src/client/views/ContextMenu.tsx @@ -12,6 +12,8 @@ export class ContextMenu extends React.Component { @observable private _pageX: number = 0; @observable private _pageY: number = 0; @observable private _display: string = "none"; + @observable private _searchString: string = ""; + private ref: React.RefObject<HTMLDivElement>; @@ -45,6 +47,8 @@ export class ContextMenu extends React.Component { this._pageX = x this._pageY = y + this._searchString = ""; + this._display = "flex" } @@ -62,10 +66,18 @@ export class ContextMenu extends React.Component { render() { return ( <div className="contextMenu-cont" style={{ left: this._pageX, top: this._pageY, display: this._display }} ref={this.ref}> - {this._items.map(prop => { + <input className="contextMenu-item" type="text" placeholder="Search . . ." value={this._searchString} onChange={this.onChange}></input> + {this._items.filter(prop => { + return prop.description.toLowerCase().indexOf(this._searchString.toLowerCase()) !== -1; + }).map(prop => { return <ContextMenuItem {...prop} key={prop.description} /> })} </div> ) } + + @action + onChange = (e: React.ChangeEvent<HTMLInputElement>) => { + this._searchString = e.target.value; + } }
\ No newline at end of file |