diff --git a/.travis.yml b/.travis.yml
index e8dc4abd8..cac5dc22a 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -3,9 +3,6 @@ node_js:
- "node"
script:
- - npm run -s build
- npm run -s lint
- - npm run -s test
-
-after_success:
- - npm run coverage
+ - npm run -s coverage
+ - npm run -s build
diff --git a/src/MUIDataTable.js b/src/MUIDataTable.js
index d875c7fd7..0af45c254 100644
--- a/src/MUIDataTable.js
+++ b/src/MUIDataTable.js
@@ -16,6 +16,20 @@ const defaultTableStyles = {
display: "block",
overflowX: "auto",
},
+ caption: {
+ position: "absolute",
+ left: "-1000px",
+ },
+ liveAnnounce: {
+ border: "0",
+ clip: "rect(0 0 0 0)",
+ height: "1px",
+ margin: "-1px",
+ overflow: "hidden",
+ padding: "0",
+ position: "absolute",
+ width: "1px",
+ },
};
class MUIDataTable extends React.Component {
@@ -47,6 +61,7 @@ class MUIDataTable extends React.Component {
state = {
open: false,
+ announceText: null,
data: [],
displayData: [],
page: 0,
@@ -211,8 +226,12 @@ class MUIDataTable extends React.Component {
}
}
+ const orderLabel = columns[index].sort === "asc" ? "ascending" : "descending";
+ const announceText = `Table now sorted by ${columns[index].name} : ${orderLabel}`;
+
return {
columns: columns,
+ announceText: announceText,
displayData: this.sortTable(displayData, index, order),
};
});
@@ -299,7 +318,7 @@ class MUIDataTable extends React.Component {
render() {
const { className, classes, title } = this.props;
- const { data, displayData, columns, page, filterData, filterList, searchText } = this.state;
+ const { announceText, data, displayData, columns, page, filterData, filterList, searchText } = this.state;
const rowsPerPage = this.state.rowsPerPage ? this.state.rowsPerPage : this.options.rowsPerPage;
@@ -324,7 +343,8 @@ class MUIDataTable extends React.Component {
toggleViewColumn={this.toggleViewColumn}
/>
-
(this.tableRef = el)}>
+ (this.tableRef = el)} tabIndex={"0"} role={"grid"} aria-readonly={"true"}>
+ {title}
+ (this.announceRef = el)}>
+ {announceText}
+
)}
diff --git a/src/MUIDataTableHead.js b/src/MUIDataTableHead.js
index 524ca8b16..17dd34955 100644
--- a/src/MUIDataTableHead.js
+++ b/src/MUIDataTableHead.js
@@ -103,7 +103,6 @@ class MUIDataTableHead extends React.Component {
key={index}
index={index}
classes={cellStyles}
- sortAria={activeColumn === index ? column.sort : null}
sortDirection={column.sort}
toggleSort={this.handleToggleColumn}
options={options}>
diff --git a/src/MUIDataTableHeadCell.js b/src/MUIDataTableHeadCell.js
index 66c28f54e..9d10e6a65 100644
--- a/src/MUIDataTableHeadCell.js
+++ b/src/MUIDataTableHeadCell.js
@@ -13,8 +13,6 @@ class MUIDataTableHeadCell extends React.Component {
options: PropTypes.object.isRequired,
/** Current sort direction */
sortDirection: PropTypes.string,
- /** Current aria-sort direction */
- sortAria: PropTypes.string,
/** Callback to trigger column sort */
toggleSort: PropTypes.func.isRequired,
};
@@ -24,10 +22,13 @@ class MUIDataTableHeadCell extends React.Component {
};
render() {
- const { children, classes, index, options, sortDirection, sortAria } = this.props;
+ const { children, classes, index, options, sortDirection } = this.props;
+
+ let sortName = "descending";
+ if (sortDirection === "desc" || sortDirection === null) sortName = "ascending";
return (
-
+
{options.sort ? (
-
+
{children}
) : (
- children
+ {children}
)}
);
diff --git a/src/MUIDataTablePagination.js b/src/MUIDataTablePagination.js
index ec8ef8ff5..41a0f1fdc 100644
--- a/src/MUIDataTablePagination.js
+++ b/src/MUIDataTablePagination.js
@@ -14,12 +14,12 @@ const defaultPaginationStyles = {
"@media screen and (max-width: 400px)": {
toolbar: {
"& span:nth-child(2)": {
- display: "none"
- }
+ display: "none",
+ },
},
selectRoot: {
- marginRight: "8px"
- }
+ marginRight: "8px",
+ },
},
};
@@ -61,7 +61,7 @@ class MUIDataTablePagination extends React.Component {
classes={{
caption: paginationStyles.caption,
toolbar: paginationStyles.toolbar,
- selectRoot: paginationStyles.selectRoot
+ selectRoot: paginationStyles.selectRoot,
}}
count={count}
rowsPerPage={rowsPerPage}
diff --git a/src/MUIDataTableToolbar.js b/src/MUIDataTableToolbar.js
index 2381ac00a..5ede1ce00 100644
--- a/src/MUIDataTableToolbar.js
+++ b/src/MUIDataTableToolbar.js
@@ -292,12 +292,12 @@ class MUIDataTableToolbar extends React.Component {
name="MUIDataTableToolbar"
styles={getStyle(options, "table.toolbar")}>
{toolbarStyles => (
-
+
{showSearch === true ? (
) : (
-
+
{title}
diff --git a/src/MUIDataTableViewCol.js b/src/MUIDataTableViewCol.js
index 42d813f0a..83925661f 100644
--- a/src/MUIDataTableViewCol.js
+++ b/src/MUIDataTableViewCol.js
@@ -24,7 +24,7 @@ class MUIDataTableViewCol extends React.Component {
const { classes, columns, options, viewColStyles } = this.props;
return (
-
+
Show Columns