@easyv/react-components 0.2.5 → 0.2.7
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/ColorsPicker/LinearColorPicker/LinearColorInput.js +17 -14
- package/dist/ColorsPicker/PureColorPicker/PureColorInput.js +22 -19
- package/dist/ColorsPicker/PuresColorPicker/PuresColorPanel.js +10 -3
- package/dist/ColorsPicker/style/index.less +7 -1
- package/dist/Select/index.less +0 -17
- package/package.json +1 -1
- package/dist/ColorsPicker/PuresColorPicker/PuresCards.d.ts +0 -10
|
@@ -23,20 +23,23 @@ export default function LinearColorInput(_ref) {
|
|
|
23
23
|
};
|
|
24
24
|
return /*#__PURE__*/_jsxs("div", {
|
|
25
25
|
className: "pure-color-picker",
|
|
26
|
-
children: [/*#__PURE__*/
|
|
27
|
-
className: "pure-color-picker-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
26
|
+
children: [/*#__PURE__*/_jsxs("div", {
|
|
27
|
+
className: "pure-color-picker-input-wrap",
|
|
28
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
29
|
+
className: "pure-color-picker-preview",
|
|
30
|
+
onClick: onTrigger,
|
|
31
|
+
children: /*#__PURE__*/_jsx(Preview, {
|
|
32
|
+
type: "linear",
|
|
33
|
+
shape: "square",
|
|
34
|
+
color: value,
|
|
35
|
+
size: 12
|
|
36
|
+
})
|
|
37
|
+
}), /*#__PURE__*/_jsx(Input, {
|
|
38
|
+
size: "small",
|
|
39
|
+
prefix: "#",
|
|
40
|
+
value: '线性渐变',
|
|
41
|
+
disabled: true
|
|
42
|
+
})]
|
|
40
43
|
}), !disabledOutAlpha && /*#__PURE__*/_jsx(BlurInput, {
|
|
41
44
|
size: "small",
|
|
42
45
|
suffix: "%",
|
|
@@ -26,25 +26,28 @@ export default function PureColorInput(_ref) {
|
|
|
26
26
|
};
|
|
27
27
|
return /*#__PURE__*/_jsxs("div", {
|
|
28
28
|
className: "pure-color-picker",
|
|
29
|
-
children: [/*#__PURE__*/
|
|
30
|
-
className: "pure-color-picker-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
29
|
+
children: [/*#__PURE__*/_jsxs("div", {
|
|
30
|
+
className: "pure-color-picker-input-wrap",
|
|
31
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
32
|
+
className: "pure-color-picker-preview",
|
|
33
|
+
onClick: onTrigger,
|
|
34
|
+
children: /*#__PURE__*/_jsx(Preview, {
|
|
35
|
+
type: "pure",
|
|
36
|
+
shape: "square",
|
|
37
|
+
color: value,
|
|
38
|
+
size: 12
|
|
39
|
+
})
|
|
40
|
+
}), /*#__PURE__*/_jsx(BlurInput, {
|
|
41
|
+
className: 'pure-color-picker-hex',
|
|
42
|
+
size: "small",
|
|
43
|
+
ref: hexRef,
|
|
44
|
+
prefix: "#",
|
|
45
|
+
value: hexString.slice(1).toUpperCase(),
|
|
46
|
+
validate: function validate(val) {
|
|
47
|
+
return /^#?([0-9a-fA-F])+/.test(val);
|
|
48
|
+
},
|
|
49
|
+
onChange: handleHexChange
|
|
50
|
+
})]
|
|
48
51
|
}), /*#__PURE__*/_jsx(BlurInput, {
|
|
49
52
|
size: "small",
|
|
50
53
|
suffix: "%",
|
|
@@ -8,13 +8,12 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
|
|
|
8
8
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
9
9
|
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
10
10
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
11
|
-
import { useState } from 'react';
|
|
11
|
+
import { useEffect, useRef, useState } from 'react';
|
|
12
12
|
import Panel from "../Panel";
|
|
13
13
|
import History from "../History";
|
|
14
14
|
import PuresCards from "./PuresCards";
|
|
15
15
|
import useHistory from "./useHistory";
|
|
16
16
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
17
|
-
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
18
17
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
19
18
|
export default function PuresColorPanel(_ref) {
|
|
20
19
|
var value = _ref.value,
|
|
@@ -28,6 +27,11 @@ export default function PuresColorPanel(_ref) {
|
|
|
28
27
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
29
28
|
updateKey = _useState4[0],
|
|
30
29
|
setUpdateKey = _useState4[1];
|
|
30
|
+
var panelRef = useRef(null);
|
|
31
|
+
useEffect(function () {
|
|
32
|
+
var _panelRef$current;
|
|
33
|
+
(_panelRef$current = panelRef.current) === null || _panelRef$current === void 0 ? void 0 : _panelRef$current.focus();
|
|
34
|
+
}, []);
|
|
31
35
|
useHistory({
|
|
32
36
|
value: value,
|
|
33
37
|
active: currentIndex
|
|
@@ -71,7 +75,10 @@ export default function PuresColorPanel(_ref) {
|
|
|
71
75
|
onChangeComplete === null || onChangeComplete === void 0 ? void 0 : onChangeComplete(newValue);
|
|
72
76
|
setUpdateKey(updateKey + 1);
|
|
73
77
|
};
|
|
74
|
-
return /*#__PURE__*/_jsxs(
|
|
78
|
+
return /*#__PURE__*/_jsxs("div", {
|
|
79
|
+
tabIndex: 1,
|
|
80
|
+
id: "pures-colors-panel",
|
|
81
|
+
ref: panelRef,
|
|
75
82
|
children: [/*#__PURE__*/_jsx(PuresCards, {
|
|
76
83
|
active: currentIndex,
|
|
77
84
|
value: value,
|
package/dist/Select/index.less
CHANGED
|
@@ -33,23 +33,6 @@
|
|
|
33
33
|
}
|
|
34
34
|
|
|
35
35
|
.arco-select-popup {
|
|
36
|
-
// 添加选中的样式后面的勾
|
|
37
|
-
li.arco-select-option-selected {
|
|
38
|
-
padding-right: 34px;
|
|
39
|
-
|
|
40
|
-
&::before {
|
|
41
|
-
content: '';
|
|
42
|
-
position: absolute;
|
|
43
|
-
right: 8px;
|
|
44
|
-
width: 24px;
|
|
45
|
-
height: 100%;
|
|
46
|
-
transform: scale(0.5);
|
|
47
|
-
mask: url('./check.svg') no-repeat center center;
|
|
48
|
-
mask-size: cover;
|
|
49
|
-
background-color: var(--color-text-1);
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
|
|
53
36
|
// 修改多选状态下的背景色
|
|
54
37
|
.arco-select-option-wrapper:hover {
|
|
55
38
|
background-color: var(--color-fill-1);
|
package/package.json
CHANGED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { ColorValueMap } from '../interface';
|
|
2
|
-
interface PuresCardsProps {
|
|
3
|
-
active: number;
|
|
4
|
-
value: ColorValueMap['pures'];
|
|
5
|
-
onAdd: () => void;
|
|
6
|
-
onDelete: () => void;
|
|
7
|
-
onSelect: (current: number) => void;
|
|
8
|
-
}
|
|
9
|
-
export default function PuresCards({ active, value, onAdd, onDelete, onSelect, }: PuresCardsProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
-
export {};
|