dtable-ui-component 5.2.2-alpha1 → 5.2.3-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/lib/CheckboxFormatter/index.js +27 -10
  2. package/lib/DTableFiltersPopover/widgets/department-select-filter/department-multiple-select-filter.js +1 -1
  3. package/lib/DTableFiltersPopover/widgets/department-select-filter/department-single-select-filter.js +1 -1
  4. package/lib/DTableFiltersPopover/widgets/filter-list/index.css +1 -0
  5. package/lib/Department-editor/department-multiple-select/index.css +3 -11
  6. package/lib/Department-editor/department-multiple-select/index.js +2 -2
  7. package/lib/Department-editor/department-single-select.js +2 -2
  8. package/lib/Department-editor/index.css +4 -13
  9. package/lib/DigitalSignFormatter/index.js +9 -4
  10. package/package.json +1 -1
package/lib/CheckboxFormatter/index.js CHANGED
@@ -8,22 +8,39 @@ exports.default = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
  var _classnames = _interopRequireDefault(require("classnames"));
10
10
  require("./index.css");
11
+ const DAFAULT_CHECKBOX_MARK_STYLE = {
12
+ type: 'check',
13
+ color: '#1DDD1D'
14
+ };
11
15
  class CheckboxFormatter extends _react.default.PureComponent {
12
16
  render() {
13
17
  let {
14
18
  value,
15
- containerClassName
19
+ containerClassName,
20
+ checkbox_style
16
21
  } = this.props;
17
- value = value === true ? true : false;
18
- let classname = (0, _classnames.default)('dtable-ui cell-formatter-container checkbox-formatter d-flex align-items-center justify-content-center', containerClassName);
19
- if (value) {
20
- return /*#__PURE__*/_react.default.createElement("div", {
21
- className: classname
22
- }, /*#__PURE__*/_react.default.createElement("span", {
23
- className: "dtable-font dtable-icon-check-mark checkbox-checked-mark"
24
- }));
22
+ if (!checkbox_style || !('type' in checkbox_style && 'color' in checkbox_style)) {
23
+ checkbox_style = DAFAULT_CHECKBOX_MARK_STYLE;
25
24
  }
26
- return null;
25
+ const currentValue = !!value;
26
+ let classname = (0, _classnames.default)('dtable-ui cell-formatter-container checkbox-formatter d-flex align-items-center justify-content-center', containerClassName);
27
+ if (!currentValue) return null;
28
+ return /*#__PURE__*/_react.default.createElement("div", {
29
+ className: classname
30
+ }, checkbox_style.type.startsWith('dtable-icon') ? /*#__PURE__*/_react.default.createElement("span", {
31
+ className: "dtable-font ".concat(checkbox_style.type, " checkbox-checked-mark"),
32
+ style: {
33
+ color: checkbox_style.color
34
+ }
35
+ }) : /*#__PURE__*/_react.default.createElement("svg", {
36
+ style: {
37
+ width: '16px',
38
+ height: '16px',
39
+ color: checkbox_style.color
40
+ }
41
+ }, /*#__PURE__*/_react.default.createElement("use", {
42
+ xlinkHref: "#".concat(checkbox_style.type)
43
+ })));
27
44
  }
28
45
  }
29
46
  CheckboxFormatter.defaultProps = {
package/lib/DTableFiltersPopover/widgets/department-select-filter/department-multiple-select-filter.js CHANGED
@@ -32,7 +32,7 @@ function DepartmentMultipleSelectFilter(props) {
32
32
  name
33
33
  } = option;
34
34
  return /*#__PURE__*/_react.default.createElement("div", {
35
- className: "department-item",
35
+ className: "dropdown-item d-flex align-items-center",
36
36
  key: index,
37
37
  onClick: event => selectDepartment(event, type)
38
38
  }, /*#__PURE__*/_react.default.createElement("input", {
package/lib/DTableFiltersPopover/widgets/department-select-filter/department-single-select-filter.js CHANGED
@@ -37,7 +37,7 @@ function DepartmentSingleSelectFilter(props) {
37
37
  name
38
38
  } = option;
39
39
  return /*#__PURE__*/_react.default.createElement("div", {
40
- className: "department-item",
40
+ className: "dropdown-item department-item d-flex align-items-center",
41
41
  key: index,
42
42
  onClick: event => onSelect(event, type)
43
43
  }, /*#__PURE__*/_react.default.createElement("div", {
package/lib/DTableFiltersPopover/widgets/filter-list/index.css CHANGED
@@ -301,6 +301,7 @@
301
301
  width: 100%;
302
302
  }
303
303
 
304
+ .dropdown-item .collaborator,
304
305
  .filters-list .option-group .option-group-content .collaborator {
305
306
  background-color: unset;
306
307
  }
package/lib/Department-editor/department-multiple-select/index.css CHANGED
@@ -1,10 +1,4 @@
1
1
  .departments-container.dtable-ui {
2
- position: absolute;
3
- background-color: #fff;
4
- border-radius: 3px;
5
- min-width: 12rem;
6
- height: 285px;
7
- box-shadow: 0 0 5px #ccc;
8
2
  top: -4px;
9
3
  left: -3px;
10
4
  width: calc(100% + 8px);
@@ -58,14 +52,12 @@
58
52
  cursor: pointer;
59
53
  }
60
54
 
61
- .departments-container.dtable-ui .department-item {
62
- padding: 4px 15px 4px 10px;
55
+ .departments-container.dtable-ui .dropdown-item {
56
+ padding-left: 10px;
63
57
  cursor: pointer;
64
- display: flex;
65
- align-items: center;
66
58
  }
67
59
 
68
- .departments-container.dtable-ui .department-item:hover {
60
+ .departments-container.dtable-ui .dropdown-item:hover {
69
61
  background: #f5f5f5;
70
62
  color: #212529;
71
63
  }
package/lib/Department-editor/department-multiple-select/index.js CHANGED
@@ -92,7 +92,7 @@ function DepartmentMultipleSelect(props) {
92
92
  return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
93
93
  key: id
94
94
  }, /*#__PURE__*/_react.default.createElement("div", {
95
- className: "department-item",
95
+ className: "dropdown-item d-flex align-items-center",
96
96
  onClick: event => onSelectDepartment(event, id)
97
97
  }, /*#__PURE__*/_react.default.createElement("input", {
98
98
  type: "checkbox",
@@ -123,7 +123,7 @@ function DepartmentMultipleSelect(props) {
123
123
  ref: departmentContainerRef,
124
124
  onClick: onStopPropagation,
125
125
  onMouseDown: onStopPropagation,
126
- className: "departments-container dtable-ui ".concat(classNamePrefix)
126
+ className: "dropdown-menu show departments-container dtable-ui ".concat(classNamePrefix)
127
127
  }, isShowSelectedDepartments && /*#__PURE__*/_react.default.createElement("div", {
128
128
  className: "selected-departments dtable-ui",
129
129
  onClick: onClick
package/lib/Department-editor/department-single-select.js CHANGED
@@ -146,7 +146,7 @@ class DepartmentSingleSelect extends _react.Component {
146
146
  return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
147
147
  key: id
148
148
  }, /*#__PURE__*/_react.default.createElement("div", {
149
- className: "department-item",
149
+ className: "dropdown-item department-item d-flex align-items-center",
150
150
  onClick: event => this.onSelectDepartment(event, id),
151
151
  style: itemStyle
152
152
  }, /*#__PURE__*/_react.default.createElement("div", {
@@ -250,7 +250,7 @@ class DepartmentSingleSelect extends _react.Component {
250
250
  }
251
251
  render() {
252
252
  return /*#__PURE__*/_react.default.createElement("div", {
253
- className: "department-editor-list dtable-ui",
253
+ className: "dropdown-menu department-editor-list dtable-ui show m-0 p-0",
254
254
  style: this.props.menuStyle || {},
255
255
  ref: ref => this.departmentsRef = ref,
256
256
  onClick: this.onStopPropagation,
package/lib/Department-editor/index.css CHANGED
@@ -1,14 +1,6 @@
1
1
  .dtable-ui.department-editor-list {
2
- position: absolute;
3
- left: 0;
4
- z-index: 1000;
5
- text-align: left;
6
- background-color: #fff;
7
- border-radius: 3px;
8
- min-width: 12rem;
9
2
  width: 300px;
10
3
  height: 285px;
11
- box-shadow: 0 0 5px #ccc;
12
4
  }
13
5
 
14
6
  .dtable-ui.department-editor-list .editor-department-container {
@@ -52,14 +44,13 @@
52
44
  display: initial !important;
53
45
  }
54
46
 
55
- .dtable-ui.department-editor-list .editor-department-container .department-item {
56
- padding: 4px 15px 4px 10px;
47
+ .dtable-ui.department-editor-list .editor-department-container .dropdown-item {
48
+ padding-left: 10px;
49
+ padding-right: 15px;
57
50
  cursor: pointer;
58
- display: flex;
59
- align-items: center;
60
51
  }
61
52
 
62
- .dtable-ui.department-editor-list .editor-department-container .department-item:hover {
53
+ .dtable-ui.department-editor-list .editor-department-container .dropdown-item:hover {
63
54
  background: #f5f5f5;
64
55
  color: #212529;
65
56
  }
package/lib/DigitalSignFormatter/index.js CHANGED
@@ -63,21 +63,26 @@ class DigitalSignFormatter extends _react.Component {
63
63
  isSample,
64
64
  renderItem
65
65
  } = this.props;
66
+ const className = (0, _classnames.default)('dtable-ui cell-formatter-container digital-sign-formatter', containerClassName);
66
67
  const signImages = this.getSignImages();
67
68
  if (signImages.length === 0) return null;
69
+ const {
70
+ isPreviewSignImage,
71
+ largeSignImageIndex
72
+ } = this.state;
68
73
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
69
- className: (0, _classnames.default)('dtable-ui cell-formatter-container digital-sign-formatter', containerClassName)
74
+ className: className
70
75
  }, /*#__PURE__*/_react.default.createElement(_imagesLazyLoad.default, {
71
76
  images: signImages,
72
77
  server: config.server,
73
78
  onImageClick: this.onClickSignImage,
74
79
  renderItem: renderItem
75
- })), this.state.isPreviewSignImage && /*#__PURE__*/_react.default.createElement(_ImagePreviewerLightbox.default, {
76
- wrapperClassName: "digital-sign-formatter-image-previewer",
80
+ })), isPreviewSignImage && /*#__PURE__*/_react.default.createElement(_ImagePreviewerLightbox.default, {
81
+ className: "digital-sign-formatter-image-previewer",
77
82
  readOnly: readOnly,
78
83
  server: isSample ? config.server : '',
79
84
  imageItems: signImages,
80
- imageIndex: this.state.largeSignImageIndex,
85
+ imageIndex: largeSignImageIndex,
81
86
  closeImagePopup: this.hideLargeSignImage,
82
87
  downloadImage: this.downloadImage,
83
88
  onViewOriginal: this.props.onViewOriginal,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "dtable-ui-component",
3
- "version": "5.2.2-alpha1",
3
+ "version": "5.2.3-alpha.1",
4
4
  "main": "./lib/index.js",
5
5
  "dependencies": {
6
6
  "@seafile/react-image-lightbox": "3.0.1",