| <!-- |
| ag-data-grid-column |
| |
| Usage: |
| ag-data-grid-column defines a column of data and provides the template to render |
| the cells for that column. |
| a variable named ```item``` is in scope for the cell renderer template that refers |
| to the JavaScript object, as defined by the dataSource, being rendered currently. |
| ``` |
| <ag-data-grid-column |
| label="Name" |
| key="name" |
| sortable |
| primary |
| wrap |
| minFlex="3" |
| flex="4" |
| priority="3" |
| align="center"/> |
| |
| <template> |
| <div>{{ item.name }}</div> |
| </template> |
| |
| </ag-data-grid-column> |
| ``` |
| @element ag-data-grid-column |
| --> |
| <link rel="import" href="../../polymer/polymer.html"> |
| <polymer-element name="ag-data-grid-column" grid-column attributes="label sortable key primary wrap flex minFlex priority align"> |
| <script> |
| Polymer('ag-data-grid-column', { |
| /** |
| * Label text for the column |
| * @attribute label |
| * @type string |
| * @default '' |
| */ |
| label: '', |
| |
| /** |
| * number specifying how flexible the width of the column is |
| * compared to other columns. For instance for a grid with three columns |
| * flex values of 1, 3, 1. means the middle column needs to be three times |
| * as wide as the other two. |
| * Flex value of 0 means the column should not be displayed. |
| * Flex values for all the columns can add up to any value. |
| * @attribute flex |
| * @type integer |
| * @default 1 |
| */ |
| flex: 1, |
| |
| /** |
| * minimum Flex value that this column can be reduced to by the responsive data grid |
| * Defaults to 1 meaning column can be reduced to 1 flex as available space shrinks. |
| * @attribute minFlex |
| * @type integer |
| * @default 1 |
| */ |
| minFlex: 1, |
| |
| /** |
| * specifies the importance of this column. Responsive grid uses this number |
| * to decide which columns to reduce/hide when available space shrinks. |
| * Lower number means more important. |
| * @attribute priority |
| * @type integer |
| * @default 1 |
| */ |
| priority: 1, |
| |
| /** |
| * whether this column is sortable |
| * @attribute sortable |
| * @type boolean |
| * @default false |
| */ |
| sortable: false, |
| |
| /** |
| * whether this the primary column of the grid. |
| * Normally there is a single column that other columns are dependents on |
| * @attribute primary |
| * @type boolean |
| * @default false |
| */ |
| primary: false, |
| |
| |
| /** |
| * whether text inside the cells of this columns are allowed to wrap. |
| * @attribute wrap |
| * @type boolean |
| * @default false |
| */ |
| wrap: false, |
| |
| /** |
| * Key that will be pass as sort.key to fetch() function of your data source. |
| * @attribute key |
| * @type string |
| * @default '' |
| */ |
| key: '', |
| |
| /** |
| * How the text context of the column is aligned horizontally. |
| * Default to left aligned, can be center, right |
| * @attribute align |
| * @type string |
| * @default 'left' |
| */ |
| align: 'left' |
| }); |
| </script> |
| </polymer-element> |
