@easyv/react-components 0.2.4 → 0.2.6

package/dist/ColorsPicker/LinearColorPicker/LinearColorInput.js

@@ -23,20 +23,23 @@ export default function LinearColorInput(_ref) {
   };
   return /*#__PURE__*/_jsxs("div", {
     className: "pure-color-picker",
-    children: [/*#__PURE__*/_jsx("div", {
-      className: "pure-color-picker-preview",
-      onClick: onTrigger,
-      children: /*#__PURE__*/_jsx(Preview, {
-        type: "linear",
-        shape: "square",
-        color: value,
-        size: 12
-      })
-    }), /*#__PURE__*/_jsx(Input, {
-      size: "small",
-      prefix: "#",
-      value: '线性渐变',
-      disabled: true
+    children: [/*#__PURE__*/_jsxs("div", {
+      className: "pure-color-picker-input-wrap",
+      children: [/*#__PURE__*/_jsx("div", {
+        className: "pure-color-picker-preview",
+        onClick: onTrigger,
+        children: /*#__PURE__*/_jsx(Preview, {
+          type: "linear",
+          shape: "square",
+          color: value,
+          size: 12
+        })
+      }), /*#__PURE__*/_jsx(Input, {
+        size: "small",
+        prefix: "#",
+        value: '线性渐变',
+        disabled: true
+      })]
     }), !disabledOutAlpha && /*#__PURE__*/_jsx(BlurInput, {
       size: "small",
       suffix: "%",

package/dist/ColorsPicker/LinearColorPicker/LinearColorPanel.js

@@ -14,13 +14,12 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 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; }
 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; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import Panel from "../Panel";
 import History from "../History";
 import LinearPointsBar from "./LinearPointsBar";
 import useHistory from "./useHistory";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export default function LinearColorPanel(_ref) {
   var _value$stops$currentI;
@@ -38,6 +37,11 @@ export default function LinearColorPanel(_ref) {
   useHistory({
     value: value
   });
+  var panelRef = useRef(null);
+  useEffect(function () {
+    var _panelRef$current;
+    (_panelRef$current = panelRef.current) === null || _panelRef$current === void 0 ? void 0 : _panelRef$current.focus();
+  }, []);
   var handleChange = function handleChange(color, complete) {
     var newStops = _toConsumableArray(value.stops);
     newStops[currentIndex].color = color;
@@ -68,7 +72,10 @@ export default function LinearColorPanel(_ref) {
       return prev + 1;
     });
   };
-  return /*#__PURE__*/_jsxs(_Fragment, {
+  return /*#__PURE__*/_jsxs("div", {
+    tabIndex: 0,
+    id: "linear-colors-panel",
+    ref: panelRef,
     children: [/*#__PURE__*/_jsx(LinearPointsBar, {
       active: currentIndex,
       value: value,

package/dist/ColorsPicker/PureColorPicker/PureColorInput.js

@@ -26,25 +26,28 @@ export default function PureColorInput(_ref) {
   };
   return /*#__PURE__*/_jsxs("div", {
     className: "pure-color-picker",
-    children: [/*#__PURE__*/_jsx("div", {
-      className: "pure-color-picker-preview",
-      onClick: onTrigger,
-      children: /*#__PURE__*/_jsx(Preview, {
-        type: "pure",
-        shape: "square",
-        color: value,
-        size: 12
-      })
-    }), /*#__PURE__*/_jsx(BlurInput, {
-      className: 'pure-color-picker-hex',
-      size: "small",
-      ref: hexRef,
-      prefix: "#",
-      value: hexString.slice(1).toUpperCase(),
-      validate: function validate(val) {
-        return /^#?([0-9a-fA-F])+/.test(val);
-      },
-      onChange: handleHexChange
+    children: [/*#__PURE__*/_jsxs("div", {
+      className: "pure-color-picker-input-wrap",
+      children: [/*#__PURE__*/_jsx("div", {
+        className: "pure-color-picker-preview",
+        onClick: onTrigger,
+        children: /*#__PURE__*/_jsx(Preview, {
+          type: "pure",
+          shape: "square",
+          color: value,
+          size: 12
+        })
+      }), /*#__PURE__*/_jsx(BlurInput, {
+        className: 'pure-color-picker-hex',
+        size: "small",
+        ref: hexRef,
+        prefix: "#",
+        value: hexString.slice(1).toUpperCase(),
+        validate: function validate(val) {
+          return /^#?([0-9a-fA-F])+/.test(val);
+        },
+        onChange: handleHexChange
+      })]
     }), /*#__PURE__*/_jsx(BlurInput, {
       size: "small",
       suffix: "%",

package/dist/ColorsPicker/PuresColorPicker/PuresColorPanel.js

@@ -8,13 +8,12 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 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; }
 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; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import Panel from "../Panel";
 import History from "../History";
 import PuresCards from "./PuresCards";
 import useHistory from "./useHistory";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export default function PuresColorPanel(_ref) {
   var value = _ref.value,
@@ -28,6 +27,11 @@ export default function PuresColorPanel(_ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     updateKey = _useState4[0],
     setUpdateKey = _useState4[1];
+  var panelRef = useRef(null);
+  useEffect(function () {
+    var _panelRef$current;
+    (_panelRef$current = panelRef.current) === null || _panelRef$current === void 0 ? void 0 : _panelRef$current.focus();
+  }, []);
   useHistory({
     value: value,
     active: currentIndex
@@ -71,7 +75,10 @@ export default function PuresColorPanel(_ref) {
     onChangeComplete === null || onChangeComplete === void 0 ? void 0 : onChangeComplete(newValue);
     setUpdateKey(updateKey + 1);
   };
-  return /*#__PURE__*/_jsxs(_Fragment, {
+  return /*#__PURE__*/_jsxs("div", {
+    tabIndex: 1,
+    id: "pures-colors-panel",
+    ref: panelRef,
     children: [/*#__PURE__*/_jsx(PuresCards, {
       active: currentIndex,
       value: value,

package/dist/ColorsPicker/style/index.less

@@ -318,8 +318,14 @@
     font-size: 12px;
   }
 
+  .pure-color-picker-input-wrap {
+    display: flex;
+    gap: 8px;
+    flex: 2;
+  }
+
   .pure-color-picker-alpha {
-    width: 64px;
+    flex: 1;
     flex-shrink: 0;
     font-size: 12px;
   }

package/dist/Select/index.less

@@ -36,18 +36,6 @@
   // 添加选中的样式后面的勾
   li.arco-select-option-selected {
     padding-right: 34px;
-
-    &::before {
-      content: '';
-      position: absolute;
-      right: 8px;
-      width: 24px;
-      height: 100%;
-      transform: scale(0.5);
-      mask: url('./check.svg') no-repeat center center;
-      mask-size: cover;
-      background-color: var(--color-text-1);
-    }
   }
 
   // 修改多选状态下的背景色

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@easyv/react-components",
-  "version": "0.2.4",
+  "version": "0.2.6",
   "description": "a react component library base on arco design",
   "license": "MIT",
   "module": "dist/index.js",

package/dist/ColorsPicker/LinearColorPicker/LinearPointsBar.d.ts

@@ -1,10 +0,0 @@
-import { ColorValueMap } from '../interface';
-interface LinearPointsBarProps {
-    active: number;
-    value: ColorValueMap['linear'];
-    onSelect: (current: number) => void;
-    onChange?: (value: ColorValueMap['linear']) => void;
-    onChangeComplete?: (value: ColorValueMap['linear']) => void;
-}
-export default function LinearPointsBar({ active, value, onSelect, onChange, onChangeComplete, }: LinearPointsBarProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/ColorsPicker/PanelContainer.d.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from 'react';
-interface PanelContainerProps {
-    children: ReactNode;
-}
-export default function PanelContainer({ children }: PanelContainerProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/ColorsPicker/PuresColorPicker/PuresCards.d.ts

@@ -1,10 +0,0 @@
-import { ColorValueMap } from '../interface';
-interface PuresCardsProps {
-    active: number;
-    value: ColorValueMap['pures'];
-    onAdd: () => void;
-    onDelete: () => void;
-    onSelect: (current: number) => void;
-}
-export default function PuresCards({ active, value, onAdd, onDelete, onSelect, }: PuresCardsProps): import("react/jsx-runtime").JSX.Element;
-export {};