@kdcloudjs/kdesign 1.8.3 → 1.8.5
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.
- package/dist/kdesign-complete.less +25 -7
- package/dist/kdesign.css +25 -8
- package/dist/kdesign.css.map +1 -1
- package/dist/kdesign.js +11 -10
- package/dist/kdesign.js.map +1 -1
- package/dist/kdesign.min.css +3 -3
- package/dist/kdesign.min.js +3 -3
- package/dist/kdesign.min.js.map +1 -1
- package/es/base-data/base-data.js +1 -1
- package/es/color-picker/color-picker-panel.js +3 -2
- package/es/color-picker/style/index.css +19 -2
- package/es/color-picker/style/index.less +19 -1
- package/es/popper/index.d.ts +1 -0
- package/es/popper/index.js +3 -4
- package/es/popper/style/index.css +4 -4
- package/es/popper/style/index.less +4 -4
- package/es/select/select.js +2 -2
- package/es/style/core/reset.less +2 -2
- package/es/style/index.css +1 -1
- package/lib/base-data/base-data.js +1 -1
- package/lib/color-picker/color-picker-panel.js +3 -2
- package/lib/color-picker/style/index.css +19 -2
- package/lib/color-picker/style/index.less +19 -1
- package/lib/popper/index.d.ts +1 -0
- package/lib/popper/index.js +3 -4
- package/lib/popper/style/index.css +4 -4
- package/lib/popper/style/index.less +4 -4
- package/lib/select/select.js +2 -2
- package/lib/style/core/reset.less +2 -2
- package/lib/style/index.css +1 -1
- package/package.json +1 -1
|
@@ -200,7 +200,7 @@ var InternalBaseData = function InternalBaseData(props, ref) {
|
|
|
200
200
|
var _a;
|
|
201
201
|
var inputDom = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input;
|
|
202
202
|
if (!inputDom) return;
|
|
203
|
-
if (inputDom.scrollWidth - inputDom.offsetWidth > 0) {
|
|
203
|
+
if (inputDom.scrollWidth - inputDom.offsetWidth > 0 && inputValue) {
|
|
204
204
|
setShowTotal(true);
|
|
205
205
|
} else {
|
|
206
206
|
setShowTotal(false);
|
|
@@ -14,8 +14,9 @@ import Color from 'color';
|
|
|
14
14
|
import { ChromePicker } from 'react-color';
|
|
15
15
|
import devWarning from '../_utils/devwarning';
|
|
16
16
|
import { useOnClickOutside } from '../_utils/hooks';
|
|
17
|
+
import { isIE } from '../_utils/ieUtil';
|
|
17
18
|
var ColorPickerPanel = function ColorPickerPanel(props) {
|
|
18
|
-
var _classNames, _context;
|
|
19
|
+
var _classNames, _classNames2, _context;
|
|
19
20
|
var setCorrectColorValue = props.setCorrectColorValue,
|
|
20
21
|
setInputColorValue = props.setInputColorValue,
|
|
21
22
|
setAlpha = props.setAlpha,
|
|
@@ -61,7 +62,7 @@ var ColorPickerPanel = function ColorPickerPanel(props) {
|
|
|
61
62
|
var panelContainerCls = classNames("".concat(colorPickerPrefixCls, "-panel-container"));
|
|
62
63
|
var panelInputCls = classNames("".concat(colorPickerPrefixCls, "-panel-container-input"));
|
|
63
64
|
var transparentCls = classNames("".concat(colorPickerPrefixCls, "-panel-container-transparent"));
|
|
64
|
-
var colorDivContainerCls = classNames("".concat(colorPickerPrefixCls, "-panel-colorDivContainer"),
|
|
65
|
+
var colorDivContainerCls = classNames("".concat(colorPickerPrefixCls, "-panel-colorDivContainer"), (_classNames2 = {}, _defineProperty(_classNames2, "".concat(colorPickerPrefixCls, "-panel-colorDivContainer-unset-color"), (presetColor === null || presetColor === void 0 ? void 0 : presetColor.length) === 0), _defineProperty(_classNames2, "".concat(colorPickerPrefixCls, "-panel-colorDivContainer-ie11"), isIE), _classNames2));
|
|
65
66
|
var colorLiClick = function colorLiClick(index, colorValue) {
|
|
66
67
|
var formatArr = colorFormat(colorValue, alpha);
|
|
67
68
|
var formatValue = toLowerCase(formatArr[valOfCorrespondingType(currentColorType)].value);
|
|
@@ -314,8 +314,8 @@
|
|
|
314
314
|
}
|
|
315
315
|
.kd-color-picker-pop .kd-color-picker-panel-container-transparent {
|
|
316
316
|
-webkit-box-flex: 0;
|
|
317
|
-
-ms-flex: 0
|
|
318
|
-
flex: 0
|
|
317
|
+
-ms-flex: 0 1 60px;
|
|
318
|
+
flex: 0 1 60px;
|
|
319
319
|
height: 28px;
|
|
320
320
|
margin-left: 8px;
|
|
321
321
|
text-align: center;
|
|
@@ -328,6 +328,23 @@
|
|
|
328
328
|
grid-row-gap: 8px;
|
|
329
329
|
margin-top: 12px;
|
|
330
330
|
}
|
|
331
|
+
.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-ie11 {
|
|
332
|
+
display: -webkit-box;
|
|
333
|
+
display: -ms-flexbox;
|
|
334
|
+
display: flex;
|
|
335
|
+
-ms-flex-wrap: wrap;
|
|
336
|
+
flex-wrap: wrap;
|
|
337
|
+
}
|
|
338
|
+
.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-ie11 li {
|
|
339
|
+
margin-right: 8px;
|
|
340
|
+
margin-top: 8px;
|
|
341
|
+
}
|
|
342
|
+
.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-ie11 li:nth-child(12n) {
|
|
343
|
+
margin-right: 0;
|
|
344
|
+
}
|
|
345
|
+
.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-ie11 li:nth-child(-n+12) {
|
|
346
|
+
margin-top: 0;
|
|
347
|
+
}
|
|
331
348
|
.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-unset-color {
|
|
332
349
|
margin-top: 0;
|
|
333
350
|
}
|
|
@@ -257,7 +257,7 @@
|
|
|
257
257
|
}
|
|
258
258
|
|
|
259
259
|
&-transparent {
|
|
260
|
-
flex: 0
|
|
260
|
+
flex: 0 1 60px;
|
|
261
261
|
height: 28px;
|
|
262
262
|
margin-left: 8px;
|
|
263
263
|
text-align: center;
|
|
@@ -272,6 +272,24 @@
|
|
|
272
272
|
grid-row-gap: 8px;
|
|
273
273
|
margin-top: 12px;
|
|
274
274
|
|
|
275
|
+
&-ie11 {
|
|
276
|
+
display: flex;
|
|
277
|
+
flex-wrap: wrap;
|
|
278
|
+
|
|
279
|
+
li {
|
|
280
|
+
margin-right: 8px;
|
|
281
|
+
margin-top: 8px;
|
|
282
|
+
|
|
283
|
+
&:nth-child(12n) {
|
|
284
|
+
margin-right: 0;
|
|
285
|
+
}
|
|
286
|
+
|
|
287
|
+
&:nth-child(-n+12) {
|
|
288
|
+
margin-top: 0;
|
|
289
|
+
}
|
|
290
|
+
}
|
|
291
|
+
}
|
|
292
|
+
|
|
275
293
|
&-unset-color {
|
|
276
294
|
margin-top: 0;
|
|
277
295
|
}
|
package/es/popper/index.d.ts
CHANGED
|
@@ -24,6 +24,7 @@ export declare type PopperProps = {
|
|
|
24
24
|
placement?: PlacementType;
|
|
25
25
|
tip?: any;
|
|
26
26
|
trigger?: TriggerType | Array<TriggerType>;
|
|
27
|
+
strategy?: 'fixed' | 'absolute';
|
|
27
28
|
clickToClose?: boolean;
|
|
28
29
|
onTrigger?: (trigger: TriggerType) => void;
|
|
29
30
|
onVisibleChange?: (visible: boolean) => void;
|
package/es/popper/index.js
CHANGED
|
@@ -124,6 +124,8 @@ export var Popper = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
124
124
|
trigger = _props$trigger === void 0 ? 'click' : _props$trigger,
|
|
125
125
|
_props$placement = props.placement,
|
|
126
126
|
placement = _props$placement === void 0 ? 'top' : _props$placement,
|
|
127
|
+
_props$strategy = props.strategy,
|
|
128
|
+
strategy = _props$strategy === void 0 ? 'absolute' : _props$strategy,
|
|
127
129
|
visible = props.visible,
|
|
128
130
|
_props$arrowSize = props.arrowSize,
|
|
129
131
|
arrowSize = _props$arrowSize === void 0 ? 4.25 : _props$arrowSize,
|
|
@@ -210,7 +212,6 @@ export var Popper = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
210
212
|
onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(nextOpen);
|
|
211
213
|
}
|
|
212
214
|
if (!nextOpen && _Object$keys(subPopupRefs.current || {}).length) {
|
|
213
|
-
console.log('triggerOpenSub', subPopupRefs.current);
|
|
214
215
|
_Object$values(subPopupRefs.current).forEach(function (d) {
|
|
215
216
|
if (typeof (d === null || d === void 0 ? void 0 : d.triggerOpen) === 'function' && (d === null || d === void 0 ? void 0 : d.visible)) {
|
|
216
217
|
d === null || d === void 0 ? void 0 : d.triggerOpen(false);
|
|
@@ -263,7 +264,6 @@ export var Popper = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
263
264
|
};
|
|
264
265
|
var onClick = function onClick(e) {
|
|
265
266
|
var _a, _b;
|
|
266
|
-
e.stopPropagation();
|
|
267
267
|
onTriggerInner(!visibleInner, 'click');
|
|
268
268
|
(_b = (_a = referenceElement === null || referenceElement === void 0 ? void 0 : referenceElement.props) === null || _a === void 0 ? void 0 : _a.onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
|
|
269
269
|
};
|
|
@@ -361,7 +361,6 @@ export var Popper = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
361
361
|
var domReference = getRealDom(referenceRef, referenceElement);
|
|
362
362
|
var isReference = domReference ? domReference === e.target || ((_c = domReference === null || domReference === void 0 ? void 0 : domReference.contains) === null || _c === void 0 ? void 0 : _c.call(domReference, e.target)) : false;
|
|
363
363
|
var isTarget = trigger === 'contextMenu' ? isPopper : isPopper || isReference;
|
|
364
|
-
console.log('clickOutside', children, e.target, isPopper, isReference, subPopupRefs.current);
|
|
365
364
|
if (clickToClose && !isTarget && !isSubPopper(e)) {
|
|
366
365
|
triggerOpen(false, 'clickOutside', 0);
|
|
367
366
|
}
|
|
@@ -421,7 +420,7 @@ export var Popper = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
421
420
|
var popperOptionsInner = {
|
|
422
421
|
placement: placementInner,
|
|
423
422
|
modifiers: popperModifiers,
|
|
424
|
-
strategy:
|
|
423
|
+
strategy: strategy
|
|
425
424
|
};
|
|
426
425
|
useEnhancedEffect(function () {
|
|
427
426
|
var _a, _b;
|
|
@@ -130,7 +130,7 @@
|
|
|
130
130
|
transform: rotate(45deg);
|
|
131
131
|
}
|
|
132
132
|
.kd-popper[data-popper-placement^='top'] .arrow {
|
|
133
|
-
bottom: calc(
|
|
133
|
+
bottom: calc(1.1 * var(--arrowSize));
|
|
134
134
|
}
|
|
135
135
|
.kd-popper[data-popper-placement^='top'] .arrow::before {
|
|
136
136
|
left: calc(-1 * var(--arrowSize));
|
|
@@ -138,7 +138,7 @@
|
|
|
138
138
|
border-left-color: transparent;
|
|
139
139
|
}
|
|
140
140
|
.kd-popper[data-popper-placement^='bottom'] .arrow {
|
|
141
|
-
top: calc(-0.
|
|
141
|
+
top: calc(-0.8 * var(--arrowSize));
|
|
142
142
|
}
|
|
143
143
|
.kd-popper[data-popper-placement^='bottom'] .arrow::before {
|
|
144
144
|
left: calc(-1 * var(--arrowSize));
|
|
@@ -146,7 +146,7 @@
|
|
|
146
146
|
border-right-color: transparent;
|
|
147
147
|
}
|
|
148
148
|
.kd-popper[data-popper-placement^='left'] .arrow {
|
|
149
|
-
right: calc(
|
|
149
|
+
right: calc(1.1 * var(--arrowSize));
|
|
150
150
|
}
|
|
151
151
|
.kd-popper[data-popper-placement^='left'] .arrow::before {
|
|
152
152
|
top: calc(-1 * var(--arrowSize));
|
|
@@ -154,7 +154,7 @@
|
|
|
154
154
|
border-bottom-color: transparent;
|
|
155
155
|
}
|
|
156
156
|
.kd-popper[data-popper-placement^='right'] .arrow {
|
|
157
|
-
left: calc(-0.
|
|
157
|
+
left: calc(-0.8 * var(--arrowSize));
|
|
158
158
|
}
|
|
159
159
|
.kd-popper[data-popper-placement^='right'] .arrow::before {
|
|
160
160
|
top: calc(-1 * var(--arrowSize));
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
}
|
|
30
30
|
|
|
31
31
|
&[data-popper-placement^='top'] .arrow {
|
|
32
|
-
bottom: calc(
|
|
32
|
+
bottom: calc(1.1 * var(--arrowSize));
|
|
33
33
|
|
|
34
34
|
&::before {
|
|
35
35
|
left: calc(-1 * var(--arrowSize));
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
}
|
|
40
40
|
|
|
41
41
|
&[data-popper-placement^='bottom'] .arrow {
|
|
42
|
-
top: calc(-0.
|
|
42
|
+
top: calc(-0.8 * var(--arrowSize));
|
|
43
43
|
|
|
44
44
|
&::before {
|
|
45
45
|
left: calc(-1 * var(--arrowSize));
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
}
|
|
50
50
|
|
|
51
51
|
&[data-popper-placement^='left'] .arrow {
|
|
52
|
-
right: calc(
|
|
52
|
+
right: calc(1.1 * var(--arrowSize));
|
|
53
53
|
|
|
54
54
|
&::before {
|
|
55
55
|
top: calc(-1 * var(--arrowSize));
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
}
|
|
60
60
|
|
|
61
61
|
&[data-popper-placement^='right'] .arrow {
|
|
62
|
-
left: calc(-0.
|
|
62
|
+
left: calc(-0.8 * var(--arrowSize));
|
|
63
63
|
|
|
64
64
|
&::before {
|
|
65
65
|
top: calc(-1 * var(--arrowSize));
|
package/es/select/select.js
CHANGED
|
@@ -162,12 +162,12 @@ var InternalSelect = function InternalSelect(props, ref) {
|
|
|
162
162
|
if (options && options.length) {
|
|
163
163
|
arr.push({
|
|
164
164
|
value: obj === null || obj === void 0 ? void 0 : obj.value,
|
|
165
|
-
label: (obj === null || obj === void 0 ? void 0 : obj.label) || (obj === null || obj === void 0 ? void 0 : obj.value)
|
|
165
|
+
label: getOptionLabel(obj) || (obj === null || obj === void 0 ? void 0 : obj.label) || (obj === null || obj === void 0 ? void 0 : obj.value)
|
|
166
166
|
});
|
|
167
167
|
} else {
|
|
168
168
|
arr.push({
|
|
169
169
|
value: (_a = obj.props) === null || _a === void 0 ? void 0 : _a.value,
|
|
170
|
-
label: (_b = obj.props) === null || _b === void 0 ? void 0 : _b.children
|
|
170
|
+
label: getOptionLabel(obj) || ((_b = obj.props) === null || _b === void 0 ? void 0 : _b.children)
|
|
171
171
|
});
|
|
172
172
|
}
|
|
173
173
|
} else {
|
package/es/style/core/reset.less
CHANGED
|
@@ -24,8 +24,8 @@ input,
|
|
|
24
24
|
textarea,
|
|
25
25
|
select,
|
|
26
26
|
button {
|
|
27
|
-
font-family: '
|
|
28
|
-
'WenQuanYi Micro Hei', sans-serif;
|
|
27
|
+
font-family: 'Roboto', 'San Francisco', 'Helvetica Neue', Helvetica, Arial, 'PingFang SC', 'Hiragina Sans GB',
|
|
28
|
+
'WenQuanYi Micro Hei', 'microsoft yahei ui', 'microsoft yahei', sans-serif;
|
|
29
29
|
}
|
|
30
30
|
|
|
31
31
|
body {
|
package/es/style/index.css
CHANGED
|
@@ -1687,7 +1687,7 @@ input,
|
|
|
1687
1687
|
textarea,
|
|
1688
1688
|
select,
|
|
1689
1689
|
button {
|
|
1690
|
-
font-family: '
|
|
1690
|
+
font-family: 'Roboto', 'San Francisco', 'Helvetica Neue', Helvetica, Arial, 'PingFang SC', 'Hiragina Sans GB', 'WenQuanYi Micro Hei', 'microsoft yahei ui', 'microsoft yahei', sans-serif;
|
|
1691
1691
|
}
|
|
1692
1692
|
body {
|
|
1693
1693
|
-webkit-box-sizing: border-box;
|
|
@@ -212,7 +212,7 @@ var InternalBaseData = function InternalBaseData(props, ref) {
|
|
|
212
212
|
var _a;
|
|
213
213
|
var inputDom = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input;
|
|
214
214
|
if (!inputDom) return;
|
|
215
|
-
if (inputDom.scrollWidth - inputDom.offsetWidth > 0) {
|
|
215
|
+
if (inputDom.scrollWidth - inputDom.offsetWidth > 0 && inputValue) {
|
|
216
216
|
setShowTotal(true);
|
|
217
217
|
} else {
|
|
218
218
|
setShowTotal(false);
|
|
@@ -23,12 +23,13 @@ var _color = _interopRequireDefault(require("color"));
|
|
|
23
23
|
var _reactColor = require("react-color");
|
|
24
24
|
var _devwarning = _interopRequireDefault(require("../_utils/devwarning"));
|
|
25
25
|
var _hooks = require("../_utils/hooks");
|
|
26
|
+
var _ieUtil = require("../_utils/ieUtil");
|
|
26
27
|
function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
27
28
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
28
29
|
/* eslint-disable */
|
|
29
30
|
|
|
30
31
|
var ColorPickerPanel = function ColorPickerPanel(props) {
|
|
31
|
-
var _classNames, _context;
|
|
32
|
+
var _classNames, _classNames2, _context;
|
|
32
33
|
var setCorrectColorValue = props.setCorrectColorValue,
|
|
33
34
|
setInputColorValue = props.setInputColorValue,
|
|
34
35
|
setAlpha = props.setAlpha,
|
|
@@ -74,7 +75,7 @@ var ColorPickerPanel = function ColorPickerPanel(props) {
|
|
|
74
75
|
var panelContainerCls = (0, _classnames.default)("".concat(colorPickerPrefixCls, "-panel-container"));
|
|
75
76
|
var panelInputCls = (0, _classnames.default)("".concat(colorPickerPrefixCls, "-panel-container-input"));
|
|
76
77
|
var transparentCls = (0, _classnames.default)("".concat(colorPickerPrefixCls, "-panel-container-transparent"));
|
|
77
|
-
var colorDivContainerCls = (0, _classnames.default)("".concat(colorPickerPrefixCls, "-panel-colorDivContainer"), (0, _defineProperty2.default)(
|
|
78
|
+
var colorDivContainerCls = (0, _classnames.default)("".concat(colorPickerPrefixCls, "-panel-colorDivContainer"), (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "".concat(colorPickerPrefixCls, "-panel-colorDivContainer-unset-color"), (presetColor === null || presetColor === void 0 ? void 0 : presetColor.length) === 0), (0, _defineProperty2.default)(_classNames2, "".concat(colorPickerPrefixCls, "-panel-colorDivContainer-ie11"), _ieUtil.isIE), _classNames2));
|
|
78
79
|
var colorLiClick = function colorLiClick(index, colorValue) {
|
|
79
80
|
var formatArr = (0, _colorFormat.colorFormat)(colorValue, alpha);
|
|
80
81
|
var formatValue = (0, _convertLetters.toLowerCase)(formatArr[(0, _colorFormat.valOfCorrespondingType)(currentColorType)].value);
|
|
@@ -314,8 +314,8 @@
|
|
|
314
314
|
}
|
|
315
315
|
.kd-color-picker-pop .kd-color-picker-panel-container-transparent {
|
|
316
316
|
-webkit-box-flex: 0;
|
|
317
|
-
-ms-flex: 0
|
|
318
|
-
flex: 0
|
|
317
|
+
-ms-flex: 0 1 60px;
|
|
318
|
+
flex: 0 1 60px;
|
|
319
319
|
height: 28px;
|
|
320
320
|
margin-left: 8px;
|
|
321
321
|
text-align: center;
|
|
@@ -328,6 +328,23 @@
|
|
|
328
328
|
grid-row-gap: 8px;
|
|
329
329
|
margin-top: 12px;
|
|
330
330
|
}
|
|
331
|
+
.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-ie11 {
|
|
332
|
+
display: -webkit-box;
|
|
333
|
+
display: -ms-flexbox;
|
|
334
|
+
display: flex;
|
|
335
|
+
-ms-flex-wrap: wrap;
|
|
336
|
+
flex-wrap: wrap;
|
|
337
|
+
}
|
|
338
|
+
.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-ie11 li {
|
|
339
|
+
margin-right: 8px;
|
|
340
|
+
margin-top: 8px;
|
|
341
|
+
}
|
|
342
|
+
.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-ie11 li:nth-child(12n) {
|
|
343
|
+
margin-right: 0;
|
|
344
|
+
}
|
|
345
|
+
.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-ie11 li:nth-child(-n+12) {
|
|
346
|
+
margin-top: 0;
|
|
347
|
+
}
|
|
331
348
|
.kd-color-picker-pop .kd-color-picker-panel-colorDivContainer-unset-color {
|
|
332
349
|
margin-top: 0;
|
|
333
350
|
}
|
|
@@ -257,7 +257,7 @@
|
|
|
257
257
|
}
|
|
258
258
|
|
|
259
259
|
&-transparent {
|
|
260
|
-
flex: 0
|
|
260
|
+
flex: 0 1 60px;
|
|
261
261
|
height: 28px;
|
|
262
262
|
margin-left: 8px;
|
|
263
263
|
text-align: center;
|
|
@@ -272,6 +272,24 @@
|
|
|
272
272
|
grid-row-gap: 8px;
|
|
273
273
|
margin-top: 12px;
|
|
274
274
|
|
|
275
|
+
&-ie11 {
|
|
276
|
+
display: flex;
|
|
277
|
+
flex-wrap: wrap;
|
|
278
|
+
|
|
279
|
+
li {
|
|
280
|
+
margin-right: 8px;
|
|
281
|
+
margin-top: 8px;
|
|
282
|
+
|
|
283
|
+
&:nth-child(12n) {
|
|
284
|
+
margin-right: 0;
|
|
285
|
+
}
|
|
286
|
+
|
|
287
|
+
&:nth-child(-n+12) {
|
|
288
|
+
margin-top: 0;
|
|
289
|
+
}
|
|
290
|
+
}
|
|
291
|
+
}
|
|
292
|
+
|
|
275
293
|
&-unset-color {
|
|
276
294
|
margin-top: 0;
|
|
277
295
|
}
|
package/lib/popper/index.d.ts
CHANGED
|
@@ -24,6 +24,7 @@ export declare type PopperProps = {
|
|
|
24
24
|
placement?: PlacementType;
|
|
25
25
|
tip?: any;
|
|
26
26
|
trigger?: TriggerType | Array<TriggerType>;
|
|
27
|
+
strategy?: 'fixed' | 'absolute';
|
|
27
28
|
clickToClose?: boolean;
|
|
28
29
|
onTrigger?: (trigger: TriggerType) => void;
|
|
29
30
|
onVisibleChange?: (visible: boolean) => void;
|
package/lib/popper/index.js
CHANGED
|
@@ -139,6 +139,8 @@ var Popper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
139
139
|
trigger = _props$trigger === void 0 ? 'click' : _props$trigger,
|
|
140
140
|
_props$placement = props.placement,
|
|
141
141
|
placement = _props$placement === void 0 ? 'top' : _props$placement,
|
|
142
|
+
_props$strategy = props.strategy,
|
|
143
|
+
strategy = _props$strategy === void 0 ? 'absolute' : _props$strategy,
|
|
142
144
|
visible = props.visible,
|
|
143
145
|
_props$arrowSize = props.arrowSize,
|
|
144
146
|
arrowSize = _props$arrowSize === void 0 ? 4.25 : _props$arrowSize,
|
|
@@ -225,7 +227,6 @@ var Popper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
225
227
|
onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(nextOpen);
|
|
226
228
|
}
|
|
227
229
|
if (!nextOpen && (0, _keys.default)(subPopupRefs.current || {}).length) {
|
|
228
|
-
console.log('triggerOpenSub', subPopupRefs.current);
|
|
229
230
|
(0, _values.default)(subPopupRefs.current).forEach(function (d) {
|
|
230
231
|
if (typeof (d === null || d === void 0 ? void 0 : d.triggerOpen) === 'function' && (d === null || d === void 0 ? void 0 : d.visible)) {
|
|
231
232
|
d === null || d === void 0 ? void 0 : d.triggerOpen(false);
|
|
@@ -278,7 +279,6 @@ var Popper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
278
279
|
};
|
|
279
280
|
var onClick = function onClick(e) {
|
|
280
281
|
var _a, _b;
|
|
281
|
-
e.stopPropagation();
|
|
282
282
|
onTriggerInner(!visibleInner, 'click');
|
|
283
283
|
(_b = (_a = referenceElement === null || referenceElement === void 0 ? void 0 : referenceElement.props) === null || _a === void 0 ? void 0 : _a.onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
|
|
284
284
|
};
|
|
@@ -376,7 +376,6 @@ var Popper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
376
376
|
var domReference = getRealDom(referenceRef, referenceElement);
|
|
377
377
|
var isReference = domReference ? domReference === e.target || ((_c = domReference === null || domReference === void 0 ? void 0 : domReference.contains) === null || _c === void 0 ? void 0 : _c.call(domReference, e.target)) : false;
|
|
378
378
|
var isTarget = trigger === 'contextMenu' ? isPopper : isPopper || isReference;
|
|
379
|
-
console.log('clickOutside', children, e.target, isPopper, isReference, subPopupRefs.current);
|
|
380
379
|
if (clickToClose && !isTarget && !isSubPopper(e)) {
|
|
381
380
|
triggerOpen(false, 'clickOutside', 0);
|
|
382
381
|
}
|
|
@@ -436,7 +435,7 @@ var Popper = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
436
435
|
var popperOptionsInner = {
|
|
437
436
|
placement: placementInner,
|
|
438
437
|
modifiers: popperModifiers,
|
|
439
|
-
strategy:
|
|
438
|
+
strategy: strategy
|
|
440
439
|
};
|
|
441
440
|
useEnhancedEffect(function () {
|
|
442
441
|
var _a, _b;
|
|
@@ -130,7 +130,7 @@
|
|
|
130
130
|
transform: rotate(45deg);
|
|
131
131
|
}
|
|
132
132
|
.kd-popper[data-popper-placement^='top'] .arrow {
|
|
133
|
-
bottom: calc(
|
|
133
|
+
bottom: calc(1.1 * var(--arrowSize));
|
|
134
134
|
}
|
|
135
135
|
.kd-popper[data-popper-placement^='top'] .arrow::before {
|
|
136
136
|
left: calc(-1 * var(--arrowSize));
|
|
@@ -138,7 +138,7 @@
|
|
|
138
138
|
border-left-color: transparent;
|
|
139
139
|
}
|
|
140
140
|
.kd-popper[data-popper-placement^='bottom'] .arrow {
|
|
141
|
-
top: calc(-0.
|
|
141
|
+
top: calc(-0.8 * var(--arrowSize));
|
|
142
142
|
}
|
|
143
143
|
.kd-popper[data-popper-placement^='bottom'] .arrow::before {
|
|
144
144
|
left: calc(-1 * var(--arrowSize));
|
|
@@ -146,7 +146,7 @@
|
|
|
146
146
|
border-right-color: transparent;
|
|
147
147
|
}
|
|
148
148
|
.kd-popper[data-popper-placement^='left'] .arrow {
|
|
149
|
-
right: calc(
|
|
149
|
+
right: calc(1.1 * var(--arrowSize));
|
|
150
150
|
}
|
|
151
151
|
.kd-popper[data-popper-placement^='left'] .arrow::before {
|
|
152
152
|
top: calc(-1 * var(--arrowSize));
|
|
@@ -154,7 +154,7 @@
|
|
|
154
154
|
border-bottom-color: transparent;
|
|
155
155
|
}
|
|
156
156
|
.kd-popper[data-popper-placement^='right'] .arrow {
|
|
157
|
-
left: calc(-0.
|
|
157
|
+
left: calc(-0.8 * var(--arrowSize));
|
|
158
158
|
}
|
|
159
159
|
.kd-popper[data-popper-placement^='right'] .arrow::before {
|
|
160
160
|
top: calc(-1 * var(--arrowSize));
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
}
|
|
30
30
|
|
|
31
31
|
&[data-popper-placement^='top'] .arrow {
|
|
32
|
-
bottom: calc(
|
|
32
|
+
bottom: calc(1.1 * var(--arrowSize));
|
|
33
33
|
|
|
34
34
|
&::before {
|
|
35
35
|
left: calc(-1 * var(--arrowSize));
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
}
|
|
40
40
|
|
|
41
41
|
&[data-popper-placement^='bottom'] .arrow {
|
|
42
|
-
top: calc(-0.
|
|
42
|
+
top: calc(-0.8 * var(--arrowSize));
|
|
43
43
|
|
|
44
44
|
&::before {
|
|
45
45
|
left: calc(-1 * var(--arrowSize));
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
}
|
|
50
50
|
|
|
51
51
|
&[data-popper-placement^='left'] .arrow {
|
|
52
|
-
right: calc(
|
|
52
|
+
right: calc(1.1 * var(--arrowSize));
|
|
53
53
|
|
|
54
54
|
&::before {
|
|
55
55
|
top: calc(-1 * var(--arrowSize));
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
}
|
|
60
60
|
|
|
61
61
|
&[data-popper-placement^='right'] .arrow {
|
|
62
|
-
left: calc(-0.
|
|
62
|
+
left: calc(-0.8 * var(--arrowSize));
|
|
63
63
|
|
|
64
64
|
&::before {
|
|
65
65
|
top: calc(-1 * var(--arrowSize));
|
package/lib/select/select.js
CHANGED
|
@@ -174,12 +174,12 @@ var InternalSelect = function InternalSelect(props, ref) {
|
|
|
174
174
|
if (options && options.length) {
|
|
175
175
|
arr.push({
|
|
176
176
|
value: obj === null || obj === void 0 ? void 0 : obj.value,
|
|
177
|
-
label: (obj === null || obj === void 0 ? void 0 : obj.label) || (obj === null || obj === void 0 ? void 0 : obj.value)
|
|
177
|
+
label: getOptionLabel(obj) || (obj === null || obj === void 0 ? void 0 : obj.label) || (obj === null || obj === void 0 ? void 0 : obj.value)
|
|
178
178
|
});
|
|
179
179
|
} else {
|
|
180
180
|
arr.push({
|
|
181
181
|
value: (_a = obj.props) === null || _a === void 0 ? void 0 : _a.value,
|
|
182
|
-
label: (_b = obj.props) === null || _b === void 0 ? void 0 : _b.children
|
|
182
|
+
label: getOptionLabel(obj) || ((_b = obj.props) === null || _b === void 0 ? void 0 : _b.children)
|
|
183
183
|
});
|
|
184
184
|
}
|
|
185
185
|
} else {
|
|
@@ -24,8 +24,8 @@ input,
|
|
|
24
24
|
textarea,
|
|
25
25
|
select,
|
|
26
26
|
button {
|
|
27
|
-
font-family: '
|
|
28
|
-
'WenQuanYi Micro Hei', sans-serif;
|
|
27
|
+
font-family: 'Roboto', 'San Francisco', 'Helvetica Neue', Helvetica, Arial, 'PingFang SC', 'Hiragina Sans GB',
|
|
28
|
+
'WenQuanYi Micro Hei', 'microsoft yahei ui', 'microsoft yahei', sans-serif;
|
|
29
29
|
}
|
|
30
30
|
|
|
31
31
|
body {
|
package/lib/style/index.css
CHANGED
|
@@ -1687,7 +1687,7 @@ input,
|
|
|
1687
1687
|
textarea,
|
|
1688
1688
|
select,
|
|
1689
1689
|
button {
|
|
1690
|
-
font-family: '
|
|
1690
|
+
font-family: 'Roboto', 'San Francisco', 'Helvetica Neue', Helvetica, Arial, 'PingFang SC', 'Hiragina Sans GB', 'WenQuanYi Micro Hei', 'microsoft yahei ui', 'microsoft yahei', sans-serif;
|
|
1691
1691
|
}
|
|
1692
1692
|
body {
|
|
1693
1693
|
-webkit-box-sizing: border-box;
|