innov
/
bee-table
1
0
Fork 0
Code Issues Pull Requests 3 Projects Releases Wiki Activity

merge

This commit is contained in:
wanghaoo 2019-03-01 17:01:55 +08:00
parent cc75618b97 6c8af4fcab
commit 7494cca7ad
10 changed files with 1301 additions and 1191 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
CHANGELOG.md
View File

@ -1,5 +1,5 @@
<a name="1.6.44"></a> <a name="2.0.0"></a>
## [1.6.44](https://github.com/tinper-bee/bee-table/compare/v1.6.43...v1.6.44) (2019-02-26) # [2.0.0](https://github.com/tinper-bee/bee-table/compare/v1.6.43...v2.0.0) (2019-03-01)
@ -294,7 +294,7 @@
<a name="1.5.1"></a> <a name="1.5.1"></a>
## [1.5.1](https://github.com/tinper-bee/bee-table/compare/v1.5.0...v1.5.1) (2018-11-19) ## [1.5.1](https://github.com/tinper-bee/bee-table/compare/v1.5.0...v1.5.1) (2018-11-18)

20
build/Table.css
View File

@ -180,21 +180,21 @@
.u-table td { .u-table td {
border-bottom: 1px solid rgb(233,233,233); } border-bottom: 1px solid rgb(233,233,233); }
.u-table td a { .u-table td a {
color: rgb(30,136,229); } color: rgb(245, 60, 50); }
.u-table td a:hover { .u-table td a:hover {
color: rgb(66,165,245); } color: rgb(230, 0, 18); }
.u-table td a:active { .u-table td a:active {
color: rgb(21,101,192); } color: rgb(230, 0, 18); }
.u-table tr:hover td .uf-eye { .u-table tr:hover td .uf-eye {
visibility: visible !important; } visibility: visible !important; }
.u-table tr tr a { .u-table tr tr a {
color: rgb(30,136,229); } color: rgb(245, 60, 50); }
.u-table tr tr a:hover { .u-table tr tr a:hover {
color: rgb(66,165,245); } color: rgb(230, 0, 18); }
.u-table tr tr a:active { .u-table tr tr a:active {
color: rgb(21,101,192); } color: rgb(230, 0, 18); }
.u-table tr.tr-row-hover { .u-table tr.tr-row-hover {
background: rgb(227,242,253); } background: rgb(235, 236, 240); }
.u-table th, .u-table th,
.u-table td { .u-table td {
padding: 12px 8px; padding: 12px 8px;
@ -205,7 +205,7 @@
.u-table tr.filterable th .filterContext { .u-table tr.filterable th .filterContext {
height: 35px; } height: 35px; }
.u-table-row-hover { .u-table-row-hover {
background: rgb(227,242,253); } background: rgb(235, 236, 240); }
.u-table-scroll { .u-table-scroll {
overflow: auto; } overflow: auto; }
.u-table-bordered table { .u-table-bordered table {
@ -285,7 +285,7 @@
.u-table-row-collapsed:after, .u-table-expanded-row-collapsed:after { .u-table-row-collapsed:after, .u-table-expanded-row-collapsed:after {
content: "+"; } content: "+"; }
.u-table-row.selected { .u-table-row.selected {
background: rgb(227,242,253); } background: rgb(235, 236, 240); }
.u-table tr.u-table-expanded-row { .u-table tr.u-table-expanded-row {
background: #f7f7f7; } background: #f7f7f7; }
.u-table tr.u-table-expanded-row:hover { .u-table tr.u-table-expanded-row:hover {
@ -401,7 +401,7 @@
.u-table-thead .th-drag { .u-table-thead .th-drag {
cursor: move; } cursor: move; }
.u-table-thead .th-drag:hover { .u-table-thead .th-drag:hover {
background: rgb(227,242,253); } background: rgb(235, 236, 240); }
.u-table-thead .th-drag-hover { .u-table-thead .th-drag-hover {
background: #ccc; } background: #ccc; }
.u-table-thead-th { .u-table-thead-th {

244
build/lib/dragColumn.js
View File

@ -1,7 +1,7 @@
'use strict'; 'use strict';
Object.defineProperty(exports, "__esModule", { Object.defineProperty(exports, "__esModule", {
value: true value: true
}); });
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
@ -36,137 +36,137 @@ var cloneDeep = require('lodash.clonedeep');
function dragColumn(Table) { function dragColumn(Table) {
return function (_Component) { return function (_Component) {
_inherits(DragColumn, _Component); _inherits(DragColumn, _Component);
function DragColumn(props) { function DragColumn(props) {
_classCallCheck(this, DragColumn); _classCallCheck(this, DragColumn);
var _this = _possibleConstructorReturn(this, _Component.call(this, props)); var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_this.setColumOrderByIndex = function (_column) { _this.setColumOrderByIndex = function (_column) {
_column.forEach(function (da, i) { _column.forEach(function (da, i) {
da.dragIndex = i; da.dragIndex = i;
da.drgHover = false; da.drgHover = false;
}); });
return _column; return _column;
}; };
_this.onDrop = function (event, data) { _this.onDrop = function (event, data) {
var dragSource = data.dragSource, var dragSource = data.dragSource,
dragTarg = data.dragTarg; dragTarg = data.dragTarg;
var columns = _this.state.columns; var columns = _this.state.columns;
var sourceIndex = -1, var sourceIndex = -1,
targetIndex = -1; targetIndex = -1;
sourceIndex = columns.findIndex(function (da, i) { sourceIndex = columns.findIndex(function (da, i) {
return da.key == dragSource.key; return da.key == dragSource.key;
}); });
targetIndex = columns.findIndex(function (da, i) { targetIndex = columns.findIndex(function (da, i) {
return da.key == dragTarg.key; return da.key == dragTarg.key;
}); });
// for (let index = 0; index < columns.length; index++) { // for (let index = 0; index < columns.length; index++) {
// const da = columns[index]; // const da = columns[index];
// if(da.key === dragSource.key){ // if(da.key === dragSource.key){
// columns[index] = dragTargColum; // columns[index] = dragTargColum;
// } // }
// if(da.key === dragTarg.key){ // if(da.key === dragTarg.key){
// columns[index] = dragSourceColum; // columns[index] = dragSourceColum;
// } // }
// } // }
// 向前移动 // 向前移动
if (targetIndex < sourceIndex) { if (targetIndex < sourceIndex) {
targetIndex = targetIndex + 1; targetIndex = targetIndex + 1;
}
columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
_this.setState({
columns: cloneDeep(columns)
});
if (_this.props.onDrop) {
_this.props.onDrop(event, data, columns);
}
};
_this.getTarget = function (evt) {
return evt.target || evt.srcElement;
};
_this.state = {
columns: _this.setColumOrderByIndex(props.columns)
};
return _this;
} }
columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
_this.setState({ DragColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
columns: cloneDeep(columns) if (nextProps.columns != this.props.columns) {
this.setState({
columns: this.setColumOrderByIndex(nextProps.columns)
});
}
};
DragColumn.prototype.cloneDeep = function cloneDeep(obj) {
if ((typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) !== 'object' || Object.keys(obj).length === 0) {
return obj;
}
var resultData = {};
return this.recursion(obj, resultData);
};
DragColumn.prototype.recursion = function (_recursion) {
function recursion(_x) {
return _recursion.apply(this, arguments);
}
recursion.toString = function () {
return _recursion.toString();
};
return recursion;
}(function (obj) {
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
for (key in obj) {
if (_typeof(obj[key]) == 'object' && Object.keys(obj[key].length > 0)) {
data[key] = recursion(obj[key]);
} else {
data[key] = obj[key];
}
}
return data;
}); });
if (_this.props.onDrop) {
_this.props.onDrop(event, data, columns);
}
};
_this.getTarget = function (evt) { DragColumn.prototype.render = function render() {
return evt.target || evt.srcElement; var _props = this.props,
}; data = _props.data,
dragborder = _props.dragborder,
draggable = _props.draggable,
className = _props.className,
columns = _props.columns,
onDragStart = _props.onDragStart,
onDragEnter = _props.onDragEnter,
onDragOver = _props.onDragOver,
onDrop = _props.onDrop,
others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className', 'columns', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDrop']);
_this.state = { var key = new Date().getTime();
columns: _this.setColumOrderByIndex(props.columns) return _react2["default"].createElement(Table, _extends({}, others, {
}; columns: this.state.columns,
return _this; data: data,
} className: className + ' u-table-drag-border',
onDragStart: this.onDragStart,
onDragOver: this.onDragOver,
onDrop: this.onDrop,
onDragEnter: this.onDragEnter,
draggable: draggable,
dragborder: dragborder
// dragborder={false}
, dragborderKey: key
}));
};
DragColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) { return DragColumn;
if (nextProps.columns != this.props.columns) { }(_react.Component);
this.setState({
columns: this.setColumOrderByIndex(nextProps.columns)
});
}
};
DragColumn.prototype.cloneDeep = function cloneDeep(obj) {
if ((typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) !== 'object' || Object.keys(obj).length === 0) {
return obj;
}
var resultData = {};
return this.recursion(obj, resultData);
};
DragColumn.prototype.recursion = function (_recursion) {
function recursion(_x) {
return _recursion.apply(this, arguments);
}
recursion.toString = function () {
return _recursion.toString();
};
return recursion;
}(function (obj) {
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
for (key in obj) {
if (_typeof(obj[key]) == 'object' && Object.keys(obj[key].length > 0)) {
data[key] = recursion(obj[key]);
} else {
data[key] = obj[key];
}
}
return data;
});
DragColumn.prototype.render = function render() {
var _props = this.props,
data = _props.data,
dragborder = _props.dragborder,
draggable = _props.draggable,
className = _props.className,
columns = _props.columns,
onDragStart = _props.onDragStart,
onDragEnter = _props.onDragEnter,
onDragOver = _props.onDragOver,
onDrop = _props.onDrop,
others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className', 'columns', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDrop']);
var key = new Date().getTime();
return _react2["default"].createElement(Table, _extends({}, others, {
columns: this.state.columns,
data: data,
className: className + ' u-table-drag-border',
onDragStart: this.onDragStart,
onDragOver: this.onDragOver,
onDrop: this.onDrop,
onDragEnter: this.onDragEnter,
draggable: draggable,
dragborder: dragborder
// dragborder={false}
, dragborderKey: key
}));
};
return DragColumn;
}(_react.Component);
} }
module.exports = exports['default']; module.exports = exports['default'];

80
build/lib/util.js
View File

@ -1,7 +1,7 @@
'use strict'; 'use strict';
Object.defineProperty(exports, "__esModule", { Object.defineProperty(exports, "__esModule", {
value: true value: true
}); });
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
@ -20,29 +20,29 @@ exports.ObjectAssign = ObjectAssign;
*/ */
function sortBy(arr, prop, desc) { function sortBy(arr, prop, desc) {
var props = [], var props = [],
ret = [], ret = [],
i = 0, i = 0,
len = arr.length; len = arr.length;
if (typeof prop == 'string') { if (typeof prop == 'string') {
for (; i < len; i++) { for (; i < len; i++) {
var oI = arr[i]; var oI = arr[i];
(props[i] = new String(oI && oI[prop] || ''))._obj = oI; (props[i] = new String(oI && oI[prop] || ''))._obj = oI;
}
} else if (typeof prop == 'function') {
for (; i < len; i++) {
var _oI = arr[i];
(props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
}
} else {
throw '参数类型错误';
} }
props.sort(); } else if (typeof prop == 'function') {
for (i = 0; i < len; i++) { for (; i < len; i++) {
ret[i] = props[i]._obj; var _oI = arr[i];
(props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
} }
if (desc) ret.reverse(); } else {
return ret; throw '参数类型错误';
}
props.sort();
for (i = 0; i < len; i++) {
ret[i] = props[i]._obj;
}
if (desc) ret.reverse();
return ret;
}; };
/** /**
@ -51,11 +51,11 @@ function sortBy(arr, prop, desc) {
* @param {} property * @param {} property
*/ */
function compare(property) { function compare(property) {
return function (a, b) { return function (a, b) {
var value1 = a[property]; var value1 = a[property];
var value2 = b[property]; var value2 = b[property];
return value1 - value2; return value1 - value2;
}; };
} }
/** /**
@ -63,17 +63,17 @@ function compare(property) {
* @param {*} obj 要拷贝的对象 * @param {*} obj 要拷贝的对象
*/ */
function ObjectAssign(obj) { function ObjectAssign(obj) {
var b = obj instanceof Array; var b = obj instanceof Array;
var tagObj = b ? [] : {}; var tagObj = b ? [] : {};
if (b) { if (b) {
//数组 //数组
obj.forEach(function (da) { obj.forEach(function (da) {
var _da = {}; var _da = {};
_extends(_da, da); _extends(_da, da);
tagObj.push(_da); tagObj.push(_da);
}); });
} else { } else {
_extends(tagObj, obj); _extends(tagObj, obj);
} }
return tagObj; return tagObj;
} }

4
demo/index.js
View File

File diff suppressed because one or more lines are too long

264
dist/demo.css vendored
View File

@ -2156,13 +2156,13 @@
color: rgb(255,255,255) !important; } color: rgb(255,255,255) !important; }
.bg-primary { .bg-primary {
background-color: rgb(30,136,229) !important; } background-color: rgb(245, 60, 50) !important; }
.bg-primary-contrast { .bg-primary-contrast {
background-color: rgb(255,255,255) !important; } background-color: rgb(255,255,255) !important; }
.bg-primary-dark { .bg-primary-dark {
background-color: rgb(21,101,192) !important; } background-color: rgb(230, 0, 18) !important; }
.bg-accent { .bg-accent {
background-color: rgb(67,160,71) !important; } background-color: rgb(67,160,71) !important; }
@ -2171,13 +2171,13 @@
background-color: rgb(255,255,255) !important; } background-color: rgb(255,255,255) !important; }
.text-primary { .text-primary {
color: rgb(30,136,229) !important; } color: rgb(245, 60, 50) !important; }
.text-primary-contrast { .text-primary-contrast {
color: rgb(255,255,255) !important; } color: rgb(255,255,255) !important; }
.text-primary-dark { .text-primary-dark {
color: rgb(21,101,192) !important; } color: rgb(230, 0, 18) !important; }
.text-accent { .text-accent {
color: rgb(67,160,71) !important; } color: rgb(67,160,71) !important; }
@ -5980,8 +5980,8 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
/* Navlayout */ /* Navlayout */
.u-button { .u-button {
background: rgb(224,224,224); background: rgb(224,224,224);
border: none; border: 1px solid rgb(224,224,224);
border-radius: 4px; border-radius: 3px;
color: rgb(0,0,0); color: rgb(0,0,0);
position: relative; position: relative;
min-width: 72px; min-width: 72px;
@ -6003,13 +6003,16 @@ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu,
.u-button::-moz-focus-inner { .u-button::-moz-focus-inner {
border: 0; } border: 0; }
.u-button:hover { .u-button:hover {
background-color: rgb(238,238,238); } background-color: rgb(238,238,238);
border-color: rgb(238,238,238); }
.u-button:active { .u-button:active {
background-color: rgb(189,189,189); } background-color: rgb(189,189,189);
border-color: rgb(189,189,189); }
.u-button.colored { .u-button.colored {
color: rgb(30,136,229); } color: rgb(245, 60, 50); }
.u-button.colored:focus:not(:active) { .u-button.colored:focus:not(:active) {
background-color: rgb(189,189,189); } background-color: rgb(238,238,238);
border-color: rgb(189,189,189); }
.u-button.disable { .u-button.disable {
-webkit-box-shadow: none; -webkit-box-shadow: none;
filter: alpha(opacity=65); filter: alpha(opacity=65);
@ -6029,7 +6032,7 @@ input.u-button[type="submit"] {
width: 38px; width: 38px;
padding: 0; padding: 0;
line-height: normal; line-height: normal;
border: 1px solid rgb(189,189,189); } border: 1px solid rgb(165, 173, 186); }
.u-button-floating.colored { .u-button-floating.colored {
background: rgb(67,160,71); background: rgb(67,160,71);
color: rgb(255,255,255); color: rgb(255,255,255);
@ -6055,63 +6058,114 @@ input.u-button[type="submit"] {
background-color: #e6e6e6; background-color: #e6e6e6;
border-color: #adadad; } border-color: #adadad; }
.u-button-primary { .u-button-border {
color: rgb(255,255,255); color: rgb(0,0,0);
background-color: rgb(30,136,229); border: 1px solid rgb(165, 173, 186);
border: 1px rgb(30,136,229) solid; } background: rgb(255,255,255); }
.u-button-primary.focus, .u-button-primary:focus, .u-button-primary:hover { .u-button-border:hover {
background-color: rgb(66,165,245); color: rgb(0,0,0);
border-color: rgb(66,165,245); } background-color: rgb(238,238,238);
.u-button-primary.active, .u-button-primary:active { border-color: rgb(165, 173, 186); }
background-color: rgb(21,101,192); .u-button-border:active {
border-color: rgb(21,101,192); } color: rgb(0,0,0);
background-color: rgb(189,189,189);
border-color: rgb(165, 173, 186); }
.u-button-border:focus:not(:active) {
color: rgb(0,0,0);
background-color: rgb(238,238,238);
border-color: rgb(165, 173, 186); }
.u-button-danger { .u-button.u-button-primary {
color: rgb(255,255,255);
background-color: rgb(245, 60, 50);
border: 1px rgb(245, 60, 50) solid; }
.u-button.u-button-primary.focus, .u-button.u-button-primary:focus, .u-button.u-button-primary:hover {
background-color: rgb(230, 0, 18);
border-color: rgb(230, 0, 18); }
.u-button.u-button-primary.active, .u-button.u-button-primary:active {
background-color: rgb(230, 0, 18);
border-color: rgb(230, 0, 18); }
.u-button.u-button-secondary {
color: rgb(0,0,0);
background-color: rgb(224,224,224);
border: 1px rgb(224,224,224) solid; }
.u-button.u-button-secondary.focus, .u-button.u-button-secondary:focus, .u-button.u-button-secondary:hover {
background-color: rgb(238,238,238);
border-color: rgb(238,238,238); }
.u-button.u-button-secondary.active, .u-button.u-button-secondary:active {
background-color: rgb(189,189,189);
border-color: rgb(189,189,189); }
.u-button.u-button-danger {
color: rgb(255,255,255); color: rgb(255,255,255);
background-color: rgb(244,67,54); background-color: rgb(244,67,54);
border: 1px rgb(244,67,54) solid; } border: 1px rgb(244,67,54) solid; }
.u-button-danger.focus, .u-button-danger:focus, .u-button-danger:hover { .u-button.u-button-danger.focus, .u-button.u-button-danger:focus, .u-button.u-button-danger:hover {
background-color: rgb(229,115,115); background-color: rgb(229,115,115);
border-color: rgb(229,115,115); } border-color: rgb(229,115,115); }
.u-button-danger.active, .u-button-danger:active { .u-button.u-button-danger.active, .u-button.u-button-danger:active {
background-color: rgb(211,47,47); background-color: rgb(211,47,47);
border-color: rgb(211,47,47); } border-color: rgb(211,47,47); }
.u-button-info { .u-button.u-button-info {
color: rgb(255,255,255); color: rgb(255,255,255);
background-color: rgb(0,188,212); background-color: rgb(0,188,212);
border: 1px rgb(0,188,212) solid; } border: 1px rgb(0,188,212) solid; }
.u-button-info.focus, .u-button-info:focus, .u-button-info:hover { .u-button.u-button-info.focus, .u-button.u-button-info:focus, .u-button.u-button-info:hover {
background-color: rgb(77,208,225); background-color: rgb(77,208,225);
border-color: rgb(77,208,225); } border-color: rgb(77,208,225); }
.u-button-info.active, .u-button-info:active { .u-button.u-button-info.active, .u-button.u-button-info:active {
background-color: rgb(0,151,167); background-color: rgb(0,151,167);
border-color: rgb(0,151,167); } border-color: rgb(0,151,167); }
.u-button-warning { .u-button.u-button-warning {
color: rgb(255,255,255); color: rgb(255,255,255);
background-color: rgb(255,152,0); background-color: rgb(255,152,0);
border: 1px rgb(255,152,0) solid; } border: 1px rgb(255,152,0) solid; }
.u-button-warning.focus, .u-button-warning:focus, .u-button-warning:hover { .u-button.u-button-warning.focus, .u-button.u-button-warning:focus, .u-button.u-button-warning:hover {
background-color: rgb(255,183,77); background-color: rgb(255,183,77);
border-color: rgb(255,183,77); } border-color: rgb(255,183,77); }
.u-button-warning.active, .u-button-warning:active { .u-button.u-button-warning.active, .u-button.u-button-warning:active {
background-color: rgb(245,124,0); background-color: rgb(245,124,0);
border-color: rgb(245,124,0); } border-color: rgb(245,124,0); }
.u-button-success { .u-button.u-button-success {
color: rgb(255,255,255); color: rgb(255,255,255);
background-color: rgb(76,175,80); background-color: rgb(76,175,80);
border: 1px rgb(76,175,80) solid; } border: 1px rgb(76,175,80) solid; }
.u-button-success.focus, .u-button-success:focus, .u-button-success:hover { .u-button.u-button-success.focus, .u-button.u-button-success:focus, .u-button.u-button-success:hover {
background-color: rgb(129,199,132); background-color: rgb(129,199,132);
border-color: rgb(129,199,132); } border-color: rgb(129,199,132); }
.u-button-success.active, .u-button-success:active { .u-button.u-button-success.active, .u-button.u-button-success:active {
background-color: rgb(56,142,60); background-color: rgb(56,142,60);
border-color: rgb(56,142,60); } border-color: rgb(56,142,60); }
.u-button.u-button-dark {
color: rgb(255,255,255);
background-color: rgb(97,97,97);
border: 1px rgb(97,97,97) solid; }
.u-button.u-button-dark.focus, .u-button.u-button-dark:focus, .u-button.u-button-dark:hover {
background-color: rgb(117,117,117);
border-color: rgb(117,117,117); }
.u-button.u-button-dark.active, .u-button.u-button-dark:active {
background-color: rgb(66,66,66);
border-color: rgb(66,66,66); }
.u-button.u-button-light {
color: rgb(97,97,97);
background-color: rgb(255,255,255);
border: 1px rgb(255,255,255) solid; }
.u-button.u-button-light.focus, .u-button.u-button-light:focus, .u-button.u-button-light:hover {
background-color: rgb(238,238,238);
border-color: rgb(238,238,238); }
.u-button.u-button-light.active, .u-button.u-button-light:active {
background-color: rgb(189,189,189);
border-color: rgb(189,189,189); }
.u-button-border.u-button-success { .u-button-border.u-button-success {
color: rgb(76,175,80); color: rgb(76,175,80);
background-color: #fff;
border: 1px rgb(76,175,80) solid; } border: 1px rgb(76,175,80) solid; }
.u-button-border.u-button-success.focus, .u-button-border.u-button-success:focus, .u-button-border.u-button-success:hover { .u-button-border.u-button-success.focus, .u-button-border.u-button-success:focus, .u-button-border.u-button-success:hover {
background-color: rgb(129,199,132); background-color: rgb(129,199,132);
@ -6124,6 +6178,7 @@ input.u-button[type="submit"] {
.u-button-border.u-button-warning { .u-button-border.u-button-warning {
color: rgb(255,152,0); color: rgb(255,152,0);
background-color: #fff;
border: 1px rgb(255,152,0) solid; } border: 1px rgb(255,152,0) solid; }
.u-button-border.u-button-warning.focus, .u-button-border.u-button-warning:focus, .u-button-border.u-button-warning:hover { .u-button-border.u-button-warning.focus, .u-button-border.u-button-warning:focus, .u-button-border.u-button-warning:hover {
background-color: rgb(255,183,77); background-color: rgb(255,183,77);
@ -6136,6 +6191,7 @@ input.u-button[type="submit"] {
.u-button-border.u-button-danger { .u-button-border.u-button-danger {
color: rgb(244,67,54); color: rgb(244,67,54);
background-color: #fff;
border: 1px rgb(244,67,54) solid; } border: 1px rgb(244,67,54) solid; }
.u-button-border.u-button-danger.focus, .u-button-border.u-button-danger:focus, .u-button-border.u-button-danger:hover { .u-button-border.u-button-danger.focus, .u-button-border.u-button-danger:focus, .u-button-border.u-button-danger:hover {
background-color: rgb(229,115,115); background-color: rgb(229,115,115);
@ -6148,6 +6204,7 @@ input.u-button[type="submit"] {
.u-button-border.u-button-info { .u-button-border.u-button-info {
color: rgb(0,188,212); color: rgb(0,188,212);
background-color: #fff;
border: 1px rgb(0,188,212) solid; } border: 1px rgb(0,188,212) solid; }
.u-button-border.u-button-info.focus, .u-button-border.u-button-info:focus, .u-button-border.u-button-info:hover { .u-button-border.u-button-info.focus, .u-button-border.u-button-info:focus, .u-button-border.u-button-info:hover {
background-color: rgb(77,208,225); background-color: rgb(77,208,225);
@ -6159,29 +6216,56 @@ input.u-button[type="submit"] {
border-color: rgb(0,151,167); } border-color: rgb(0,151,167); }
.u-button-border.u-button-primary { .u-button-border.u-button-primary {
color: rgb(30,136,229); color: rgb(245, 60, 50);
border: 1px rgb(30,136,229) solid; } background-color: #fff;
border: 1px rgb(245, 60, 50) solid; }
.u-button-border.u-button-primary.focus, .u-button-border.u-button-primary:focus, .u-button-border.u-button-primary:hover { .u-button-border.u-button-primary.focus, .u-button-border.u-button-primary:focus, .u-button-border.u-button-primary:hover {
background-color: rgb(66,165,245); background-color: rgb(230, 0, 18);
border-color: rgb(66,165,245); border-color: rgb(230, 0, 18);
color: #fff; } color: #fff; }
.u-button-border.u-button-primary.active, .u-button-border.u-button-primary:active { .u-button-border.u-button-primary.active, .u-button-border.u-button-primary:active {
color: #fff; color: #fff;
background-color: rgb(21,101,192); background-color: rgb(230, 0, 18);
border-color: rgb(21,101,192); } border-color: rgb(230, 0, 18); }
.u-button-border { .u-button-border.u-button-secondary {
color: rgb(0,0,0); color: rgb(224,224,224);
border: 1px solid #d9d9d9; background-color: #fff;
background-color: #fff; } border: 1px rgb(224,224,224) solid; }
.u-button-border.u-button-secondary.focus, .u-button-border.u-button-secondary:focus, .u-button-border.u-button-secondary:hover {
background-color: rgb(238,238,238);
border-color: rgb(238,238,238);
color: #fff; }
.u-button-border.u-button-secondary.active, .u-button-border.u-button-secondary:active {
color: #fff;
background-color: rgb(189,189,189);
border-color: rgb(189,189,189); }
.u-button-border:hover, .u-button-border:focus { .u-button-border.u-button-dark {
color: rgb(0,0,0); color: rgb(97,97,97);
background: rgb(238,238,238); } background-color: #fff;
border: 1px rgb(97,97,97) solid; }
.u-button-border.u-button-dark.focus, .u-button-border.u-button-dark:focus, .u-button-border.u-button-dark:hover {
background-color: rgb(117,117,117);
border-color: rgb(117,117,117);
color: #fff; }
.u-button-border.u-button-dark.active, .u-button-border.u-button-dark:active {
color: #fff;
background-color: rgb(66,66,66);
border-color: rgb(66,66,66); }
.u-button-border:active { .u-button-border.u-button-light {
color: #fff; color: rgb(97,97,97);
background: rgb(189,189,189); } background-color: #fff;
border: 1px rgb(255,255,255) solid; }
.u-button-border.u-button-light.focus, .u-button-border.u-button-light:focus, .u-button-border.u-button-light:hover {
background-color: rgb(238,238,238);
border-color: rgb(238,238,238);
color: #fff; }
.u-button-border.u-button-light.active, .u-button-border.u-button-light:active {
color: #fff;
background-color: rgb(189,189,189);
border-color: rgb(189,189,189); }
.u-button-icon { .u-button-icon {
border-radius: 50%; border-radius: 50%;
@ -6192,16 +6276,20 @@ input.u-button[type="submit"] {
width: 32px; width: 32px;
padding: 0; padding: 0;
line-height: normal; line-height: normal;
border: 1px solid rgb(189,189,189); } border: 1px solid rgb(165, 173, 186); }
.u-button-lg { .u-button-lg {
padding: 8px 15px; padding: 8px 15px;
font-size: 14px; } font-size: 14px; }
.u-button-xg { .u-button-xg {
padding: 10px 18px; padding: 10.5px 18px;
font-size: 16px; } font-size: 16px; }
.u-button-md {
padding: 4px 13px;
font-size: 14px; }
.u-button-sm { .u-button-sm {
padding: 3px 5px; padding: 3px 5px;
font-size: 12px; } font-size: 12px; }
@ -6263,7 +6351,7 @@ input.u-button[type="submit"] {
font-size: 14px; font-size: 14px;
background-color: #fff; background-color: #fff;
background-clip: padding-box; background-clip: padding-box;
border: 1px solid rgb(224,224,224); border: 1px solid rgb(165, 173, 186);
border-radius: 6px; border-radius: 6px;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); } box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); }
.u-popconfirm-dark { .u-popconfirm-dark {
@ -6287,27 +6375,27 @@ input.u-button[type="submit"] {
left: -10px; left: -10px;
margin-top: -11px; margin-top: -11px;
border-left-width: 0; border-left-width: 0;
border-right-color: rgb(224,224,224); } border-right-color: rgb(165, 173, 186); }
.u-popconfirm.left > .arrow { .u-popconfirm.left > .arrow {
top: 50%; top: 50%;
right: -10px; right: -10px;
margin-top: -11px; margin-top: -11px;
border-right-width: 0; border-right-width: 0;
border-left-color: rgb(224,224,224); } border-left-color: rgb(165, 173, 186); }
.u-popconfirm.top > .arrow { .u-popconfirm.top > .arrow {
left: 50%; left: 50%;
margin-left: -11px; margin-left: -11px;
border-bottom-width: 0; border-bottom-width: 0;
border-top-color: rgb(224,224,224); border-top-color: rgb(165, 173, 186);
bottom: -10px; } bottom: -10px; }
.u-popconfirm.bottom > .arrow { .u-popconfirm.bottom > .arrow {
left: 50%; left: 50%;
margin-left: -11px; margin-left: -11px;
border-top-width: 0; border-top-width: 0;
border-bottom-color: rgb(224,224,224); border-bottom-color: rgb(165, 173, 186);
top: -11px; } top: -11px; }
.u-popconfirm > .arrow { .u-popconfirm > .arrow {
@ -6458,7 +6546,7 @@ input.u-button[type="submit"] {
.u-button { .u-button {
background: rgb(224,224,224); background: rgb(224,224,224);
border: 1px solid rgb(224,224,224); border: 1px solid rgb(224,224,224);
border-radius: 4px; border-radius: 3px;
color: rgb(0,0,0); color: rgb(0,0,0);
position: relative; position: relative;
min-width: 72px; min-width: 72px;
@ -6486,7 +6574,7 @@ input.u-button[type="submit"] {
background-color: rgb(189,189,189); background-color: rgb(189,189,189);
border-color: rgb(189,189,189); } border-color: rgb(189,189,189); }
.u-button.colored { .u-button.colored {
color: rgb(30,136,229); } color: rgb(245, 60, 50); }
.u-button.colored:focus:not(:active) { .u-button.colored:focus:not(:active) {
background-color: rgb(238,238,238); background-color: rgb(238,238,238);
border-color: rgb(189,189,189); } border-color: rgb(189,189,189); }
@ -6554,14 +6642,14 @@ input.u-button[type="submit"] {
.u-button.u-button-primary { .u-button.u-button-primary {
color: rgb(255,255,255); color: rgb(255,255,255);
background-color: rgb(30,136,229); background-color: rgb(245, 60, 50);
border: 1px rgb(30,136,229) solid; } border: 1px rgb(245, 60, 50) solid; }
.u-button.u-button-primary.focus, .u-button.u-button-primary:focus, .u-button.u-button-primary:hover { .u-button.u-button-primary.focus, .u-button.u-button-primary:focus, .u-button.u-button-primary:hover {
background-color: rgb(66,165,245); background-color: rgb(230, 0, 18);
border-color: rgb(66,165,245); } border-color: rgb(230, 0, 18); }
.u-button.u-button-primary.active, .u-button.u-button-primary:active { .u-button.u-button-primary.active, .u-button.u-button-primary:active {
background-color: rgb(21,101,192); background-color: rgb(230, 0, 18);
border-color: rgb(21,101,192); } border-color: rgb(230, 0, 18); }
.u-button.u-button-secondary { .u-button.u-button-secondary {
color: rgb(0,0,0); color: rgb(0,0,0);
@ -6693,17 +6781,17 @@ input.u-button[type="submit"] {
border-color: rgb(0,151,167); } border-color: rgb(0,151,167); }
.u-button-border.u-button-primary { .u-button-border.u-button-primary {
color: rgb(30,136,229); color: rgb(245, 60, 50);
background-color: #fff; background-color: #fff;
border: 1px rgb(30,136,229) solid; } border: 1px rgb(245, 60, 50) solid; }
.u-button-border.u-button-primary.focus, .u-button-border.u-button-primary:focus, .u-button-border.u-button-primary:hover { .u-button-border.u-button-primary.focus, .u-button-border.u-button-primary:focus, .u-button-border.u-button-primary:hover {
background-color: rgb(66,165,245); background-color: rgb(230, 0, 18);
border-color: rgb(66,165,245); border-color: rgb(230, 0, 18);
color: #fff; } color: #fff; }
.u-button-border.u-button-primary.active, .u-button-border.u-button-primary:active { .u-button-border.u-button-primary.active, .u-button-border.u-button-primary:active {
color: #fff; color: #fff;
background-color: rgb(21,101,192); background-color: rgb(230, 0, 18);
border-color: rgb(21,101,192); } border-color: rgb(230, 0, 18); }
.u-button-border.u-button-secondary { .u-button-border.u-button-secondary {
color: rgb(224,224,224); color: rgb(224,224,224);
@ -7090,10 +7178,10 @@ input.u-button[type="submit"] {
.u-checkbox input[disabled] { .u-checkbox input[disabled] {
cursor: not-allowed; } cursor: not-allowed; }
.u-checkbox input[type='checkbox']:focus + .u-checkbox-label:before { .u-checkbox input[type='checkbox']:focus + .u-checkbox-label:before {
border-color: #1e88e5; } border-color: rgb(245, 60, 50); }
.u-checkbox.is-checked .u-checkbox-label:before { .u-checkbox.is-checked .u-checkbox-label:before {
box-shadow: inset 0 0 0 10px rgb(30,136,229); box-shadow: inset 0 0 0 10px rgb(245, 60, 50);
border-color: rgb(30,136,229); } border-color: rgb(245, 60, 50); }
.u-checkbox.is-checked .u-checkbox-label:after { .u-checkbox.is-checked .u-checkbox-label:after {
color: #fff; color: #fff;
content: "\e658"; content: "\e658";
@ -7135,8 +7223,8 @@ input.u-button[type="submit"] {
font-size: 14px; } font-size: 14px; }
.u-checkbox.u-checkbox-indeterminate .u-checkbox-label:before { .u-checkbox.u-checkbox-indeterminate .u-checkbox-label:before {
box-shadow: inset 0 0 0 10px #1e88e5; box-shadow: inset 0 0 0 10px rgb(245, 60, 50);
border-color: #1e88e5; } border-color: rgb(245, 60, 50); }
.u-checkbox.u-checkbox-success.is-checked .u-checkbox-label:before { .u-checkbox.u-checkbox-success.is-checked .u-checkbox-label:before {
box-shadow: inset 0 0 0 10px rgb(76,175,80); box-shadow: inset 0 0 0 10px rgb(76,175,80);
@ -7811,7 +7899,7 @@ ul {
white-space: nowrap; } white-space: nowrap; }
.u-select-dropdown .u-select-dropdown-menu-item:hover, .u-select-dropdown .u-select-dropdown-menu-item:hover,
.u-select-dropdown .u-select-dropdown-menu-item-active { .u-select-dropdown .u-select-dropdown-menu-item-active {
background-color: rgb(227,242,253); } background-color: rgb(235, 236, 240); }
.u-select-dropdown .u-select-dropdown-menu-item-disabled { .u-select-dropdown .u-select-dropdown-menu-item-disabled {
color: #ccc; color: #ccc;
cursor: not-allowed; } cursor: not-allowed; }
@ -8621,21 +8709,21 @@ ul {
.u-table td { .u-table td {
border-bottom: 1px solid rgb(233,233,233); } border-bottom: 1px solid rgb(233,233,233); }
.u-table td a { .u-table td a {
color: rgb(30,136,229); } color: rgb(245, 60, 50); }
.u-table td a:hover { .u-table td a:hover {
color: rgb(66,165,245); } color: rgb(230, 0, 18); }
.u-table td a:active { .u-table td a:active {
color: rgb(21,101,192); } color: rgb(230, 0, 18); }
.u-table tr:hover td .uf-eye { .u-table tr:hover td .uf-eye {
visibility: visible !important; } visibility: visible !important; }
.u-table tr tr a { .u-table tr tr a {
color: rgb(30,136,229); } color: rgb(245, 60, 50); }
.u-table tr tr a:hover { .u-table tr tr a:hover {
color: rgb(66,165,245); } color: rgb(230, 0, 18); }
.u-table tr tr a:active { .u-table tr tr a:active {
color: rgb(21,101,192); } color: rgb(230, 0, 18); }
.u-table tr.tr-row-hover { .u-table tr.tr-row-hover {
background: rgb(227,242,253); } background: rgb(235, 236, 240); }
.u-table th, .u-table th,
.u-table td { .u-table td {
padding: 12px 8px; padding: 12px 8px;
@ -8646,7 +8734,7 @@ ul {
.u-table tr.filterable th .filterContext { .u-table tr.filterable th .filterContext {
height: 35px; } height: 35px; }
.u-table-row-hover { .u-table-row-hover {
background: rgb(227,242,253); } background: rgb(235, 236, 240); }
.u-table-scroll { .u-table-scroll {
overflow: auto; } overflow: auto; }
.u-table-bordered table { .u-table-bordered table {
@ -8729,7 +8817,7 @@ ul {
.u-table-row-collapsed:after, .u-table-expanded-row-collapsed:after { .u-table-row-collapsed:after, .u-table-expanded-row-collapsed:after {
content: "+"; } content: "+"; }
.u-table-row.selected { .u-table-row.selected {
background: rgb(227,242,253); } background: rgb(235, 236, 240); }
.u-table tr.u-table-expanded-row { .u-table tr.u-table-expanded-row {
background: #f7f7f7; } background: #f7f7f7; }
.u-table tr.u-table-expanded-row:hover { .u-table tr.u-table-expanded-row:hover {
@ -8800,8 +8888,8 @@ ul {
background-clip: padding-box; background-clip: padding-box;
-moz-user-select: -moz-none; -moz-user-select: -moz-none;
-webkit-user-select: none; -webkit-user-select: none;
/* /*
Introduced in IE 10. Introduced in IE 10.
*/ */
-ms-user-select: none; -ms-user-select: none;
user-select: none; } user-select: none; }
@ -8844,7 +8932,7 @@ ul {
.u-table-thead .th-drag { .u-table-thead .th-drag {
cursor: move; } cursor: move; }
.u-table-thead .th-drag:hover { .u-table-thead .th-drag:hover {
background: rgb(227,242,253); } background: rgb(235, 236, 240); }
.u-table-thead .th-drag-hover { .u-table-thead .th-drag-hover {
background: #ccc; } background: #ccc; }
.u-table-thead-th { .u-table-thead-th {

2
dist/demo.css.map vendored
View File

File diff suppressed because one or more lines are too long

1860
dist/demo.js vendored
View File

File diff suppressed because one or more lines are too long

6
dist/demo.js.map vendored
View File

File diff suppressed because one or more lines are too long

6
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "bee-table", "name": "bee-table",
"version": "1.6.45.beta.1", "version": "2.0.0",
"description": "Table ui component for react", "description": "Table ui component for react",
"keywords": [ "keywords": [
"react", "react",
@ -46,7 +46,7 @@
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0" "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0"
}, },
"dependencies": { "dependencies": {
"bee-button": "^2.0.2", "bee-button": "^2.0.4",
"bee-datepicker": "latest", "bee-datepicker": "latest",
"bee-dnd": "^1.0.2", "bee-dnd": "^1.0.2",
"bee-dropdown": "1.0.3", "bee-dropdown": "1.0.3",
@ -80,7 +80,7 @@
"bee-form": "1.1.10", "bee-form": "1.1.10",
"bee-input-group": "latest", "bee-input-group": "latest",
"bee-layout": "latest", "bee-layout": "latest",
"bee-pagination": "latest", "bee-pagination": "1.1.18",
"bee-panel": "^1.2.12", "bee-panel": "^1.2.12",
"bee-popconfirm": "^1.0.2", "bee-popconfirm": "^1.0.2",
"bee-tools": "latest", "bee-tools": "latest",