| <!-- |
| ag-data-grid-search renders a search area for the grid. |
| The value of the search is provided to the ```dataSource's fetch``` function |
| as a ```search { keyword: <string> }``` object. |
| |
| Usage: |
| ``` |
| <ag-data-grid-search label="Search Contacts"></ag-data-grid-search> |
| ``` |
| @element ag-data-grid-search |
| --> |
| <link rel="import" href="../../polymer/polymer.html"> |
| <link rel="import" href="../../paper-input/paper-input.html"> |
| <polymer-element name="ag-data-grid-search" grid-search expects-grid-state attributes="label"> |
| <template> |
| <link rel="stylesheet" href="ag-data-grid-search.css"> |
| <paper-input committedValue="{{ value }}" id="search" label="{{ label }}"></paper-input> |
| </template> |
| <script> |
| /* |
| * Renders a search box inside the grid components |
| */ |
| Polymer('ag-data-grid-search', { |
| /** |
| * Label text for search box. |
| * @attribute label |
| * @type string |
| */ |
| label: '', |
| valueChanged: function() { |
| this.gridState.search.keyword = this.value; |
| } |
| }); |
| </script> |
| </polymer-element> |