dtable-ui-component 5.2.7 → 5.2.9
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.
|
@@ -7,6 +7,46 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.UserSelectStyle = exports.Option = exports.MenuSelectStyle = exports.MenuList = exports.DropdownIndicator = exports.ClearIndicator = void 0;
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
var _reactSelect = require("react-select");
|
|
10
|
+
// DtableSelect is based on seatable-ui.css, so use the following content to override the default react-select style
|
|
11
|
+
const DEFAULT_CONTROL_STYLE = {
|
|
12
|
+
border: '1px solid rgba(0, 40, 100, 0.12) !important'
|
|
13
|
+
};
|
|
14
|
+
const FOCUS_CONTROL_STYLE = {
|
|
15
|
+
fontSize: '14px',
|
|
16
|
+
backgroundColor: '#ffffff',
|
|
17
|
+
borderColor: '#1991eb',
|
|
18
|
+
outline: '0',
|
|
19
|
+
boxShadow: '0 0 0 2px rgba(70, 127, 207, 0.25)'
|
|
20
|
+
};
|
|
21
|
+
const noneCallback = () => ({
|
|
22
|
+
display: 'none'
|
|
23
|
+
});
|
|
24
|
+
const controlCallback = (provided, state) => {
|
|
25
|
+
const {
|
|
26
|
+
isDisabled,
|
|
27
|
+
isFocused
|
|
28
|
+
} = state;
|
|
29
|
+
if (isFocused && !isDisabled) {
|
|
30
|
+
return {
|
|
31
|
+
...provided,
|
|
32
|
+
...FOCUS_CONTROL_STYLE,
|
|
33
|
+
'&:hover': {
|
|
34
|
+
...provided,
|
|
35
|
+
...FOCUS_CONTROL_STYLE
|
|
36
|
+
}
|
|
37
|
+
};
|
|
38
|
+
}
|
|
39
|
+
return {
|
|
40
|
+
...provided,
|
|
41
|
+
fontSize: '14px',
|
|
42
|
+
lineHeight: '1.5',
|
|
43
|
+
cursor: 'pointer',
|
|
44
|
+
...DEFAULT_CONTROL_STYLE,
|
|
45
|
+
'&:hover': {
|
|
46
|
+
...DEFAULT_CONTROL_STYLE
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
};
|
|
10
50
|
const UserSelectStyle = exports.UserSelectStyle = {
|
|
11
51
|
option: (provided, state) => {
|
|
12
52
|
const {
|
|
@@ -19,21 +59,10 @@ const UserSelectStyle = exports.UserSelectStyle = {
|
|
|
19
59
|
backgroundColor: isFocused ? '#f5f5f5' : '#fff'
|
|
20
60
|
};
|
|
21
61
|
},
|
|
22
|
-
control:
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
lineHeight: '1.5'
|
|
27
|
-
}),
|
|
28
|
-
indicatorSeparator: () => ({
|
|
29
|
-
display: 'none'
|
|
30
|
-
}),
|
|
31
|
-
dropdownIndicator: () => ({
|
|
32
|
-
display: 'none'
|
|
33
|
-
}),
|
|
34
|
-
clearIndicator: () => ({
|
|
35
|
-
display: 'none'
|
|
36
|
-
}),
|
|
62
|
+
control: controlCallback,
|
|
63
|
+
indicatorSeparator: noneCallback,
|
|
64
|
+
dropdownIndicator: noneCallback,
|
|
65
|
+
clearIndicator: noneCallback,
|
|
37
66
|
multiValue: provided => {
|
|
38
67
|
return {
|
|
39
68
|
...provided,
|
|
@@ -91,17 +120,12 @@ const MenuSelectStyle = exports.MenuSelectStyle = {
|
|
|
91
120
|
}
|
|
92
121
|
};
|
|
93
122
|
},
|
|
94
|
-
control:
|
|
95
|
-
...provided,
|
|
96
|
-
fontSize: '14px',
|
|
97
|
-
cursor: 'pointer',
|
|
98
|
-
lineHeight: '1.5'
|
|
99
|
-
}),
|
|
123
|
+
control: controlCallback,
|
|
100
124
|
menuPortal: base => ({
|
|
101
125
|
...base,
|
|
102
126
|
zIndex: 9999
|
|
103
127
|
}),
|
|
104
|
-
indicatorSeparator:
|
|
128
|
+
indicatorSeparator: noneCallback
|
|
105
129
|
};
|
|
106
130
|
const DropdownIndicator = props => {
|
|
107
131
|
return _reactSelect.components.DropdownIndicator && /*#__PURE__*/_react.default.createElement(_reactSelect.components.DropdownIndicator, props, /*#__PURE__*/_react.default.createElement("span", {
|
|
@@ -37,10 +37,13 @@ class RowExpandLinkFormatter extends _react.Component {
|
|
|
37
37
|
if (!displayColumn) {
|
|
38
38
|
return props.renderEmpty();
|
|
39
39
|
}
|
|
40
|
-
|
|
40
|
+
let {
|
|
41
41
|
type: displayColumnType,
|
|
42
42
|
data: displayColumnData
|
|
43
43
|
} = displayColumn;
|
|
44
|
+
if (displayColumnType === 'string') {
|
|
45
|
+
displayColumnType = _constants.CellType.TEXT;
|
|
46
|
+
}
|
|
44
47
|
const cellValue = (0, _utils.getFormulaArrayValue)(value, !(0, _utils.isArrayFormatColumn)(displayColumnType));
|
|
45
48
|
if (!Array.isArray(cellValue) || cellValue.length === 0) {
|
|
46
49
|
return props.renderEmpty();
|