@para-ui/core 4.0.0-beta → 4.0.0-rc.1

package/Selector/index.js

@@ -1,6 +1,6 @@
 import { _ as _toConsumableArray } from '../_verture/toConsumableArray-8f4c9589.js';
 import { _ as _slicedToArray } from '../_verture/slicedToArray-a8206399.js';
-import { r as regenerator } from '../_verture/index-d63bd287.js';
+import { r as regenerator } from '../_verture/index-232d890b.js';
 import { a as __awaiter, _ as __rest } from '../_verture/tslib.es6-55ed4bd2.js';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { useState, useRef, useEffect, Fragment as Fragment$1 } from 'react';
@@ -21,7 +21,7 @@ import Refresh from '@para-ui/icons/Refresh';
 import { ArrayToObject, Get, Post, Cancel } from '@paraview/lib';
 import { u as useGlobalProps } from '../_verture/useGlobalProps-1b846a65.js';
 import '../_verture/unsupportedIterableToArray-cb478f24.js';
-import '../_verture/typeof-b240b062.js';
+import '../_verture/typeof-c310ee4a.js';
 import '../Label/index.js';
 import '../Help/index.js';
 import '../Tooltip/index.js';
@@ -72,7 +72,7 @@ var localeJson = {
   en: en
 };
 
-var css_248z$3 = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-selector-node {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  cursor: pointer;\n}\n.paraui-v4-selector-node:hover {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-selector-node > .selector-node-left {\n  display: flex;\n  align-items: center;\n  flex: 1;\n  overflow: hidden;\n  padding-right: 10px;\n}\n.paraui-v4-selector-node > .selector-node-left > .selector-node-radio {\n  margin-right: 8px;\n  display: flex;\n  align-items: center;\n  padding: 0;\n}\n.paraui-v4-selector-node > .selector-node-left > .selector-node-radio .radio-box {\n  top: 0;\n}\n.paraui-v4-selector-node > .selector-node-left > .selector-node-check {\n  margin-right: 8px;\n  display: flex;\n  align-items: center;\n  padding: 0;\n}\n.paraui-v4-selector-node > .selector-node-left > .selector-node-check .checkbox-box {\n  top: 0;\n}\n.paraui-v4-selector-node > .selector-node-left > .node-img {\n  display: inline-block;\n  width: 30px;\n  height: 30px;\n  margin-right: 8px;\n}\n.paraui-v4-selector-node > .selector-node-left > .node-img img {\n  width: 30px;\n  height: 30px;\n  border-radius: 50%;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-branch {\n  height: 30px;\n  padding: 0 10px;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-branch.paraui-v4-selector-node-img {\n  height: 44px;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-branch > .selector-node-left > .main-title {\n  font-size: 14px;\n  color: rgb(29, 33, 38);\n  white-space: nowrap;\n  height: 20px;\n  line-height: 20px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-branch > .selector-node-left > .sub-title {\n  margin-left: 8px;\n  font-size: 14px;\n  color: rgb(161, 168, 179);\n  white-space: nowrap;\n  height: 20px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-branch > .selector-node-left > .tag {\n  margin-left: 8px;\n  background-color: rgba(46, 101, 230, 0.1);\n  color: rgb(46, 101, 230);\n  border-radius: 2px;\n  font-size: 12px;\n  padding: 0px 6px;\n  white-space: nowrap;\n  height: 17px;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf {\n  padding: 0px 10px;\n  height: 44px;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf > .selector-node-left > .title-box {\n  flex: 1;\n  overflow: hidden;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf > .selector-node-left > .title-box > .main-title-box {\n  display: flex;\n  white-space: nowrap;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf > .selector-node-left > .title-box > .main-title-box > .main-title {\n  font-size: 14px;\n  color: rgb(29, 33, 38);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf > .selector-node-left > .title-box > .main-title-box > .tag {\n  margin-left: 8px;\n  background-color: rgba(46, 101, 230, 0.1);\n  color: rgb(46, 101, 230);\n  border-radius: 2px;\n  font-size: 12px;\n  padding: 1px 6px;\n  white-space: nowrap;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf > .selector-node-left > .title-box > .sub-title {\n  font-size: 12px;\n  color: rgb(161, 168, 179);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v4-selector-node > .selector-node-right {\n  display: flex;\n  align-items: center;\n  height: 100%;\n}\n.paraui-v4-selector-node > .selector-node-right > .detail {\n  font-size: 14px;\n  color: rgb(46, 101, 230);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-v4-selector-node > .selector-node-right > .detail:hover {\n  background-color: rgba(212, 218, 227, 0.4);\n}\n.paraui-v4-selector-node > .selector-node-right > .line {\n  border-left: 1px solid rgb(213, 224, 250);\n  margin: 0 8px;\n  content: \"\";\n  display: inline-block;\n  height: 12px;\n}\n.paraui-v4-selector-node > .selector-node-right > .lower-child {\n  font-size: 14px;\n  color: rgb(46, 101, 230);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-v4-selector-node > .selector-node-right > .lower-child:hover {\n  background-color: rgb(234, 236, 241);\n}\n.paraui-v4-selector-node > .selector-node-right > .close {\n  display: flex;\n  align-items: center;\n  color: rgb(46, 101, 230);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-v4-selector-node > .selector-node-right > .close:hover > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-selector-node > .selector-node-right > .close > svg {\n  font-size: 16px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-edit > .selector-node-right > .detail, .paraui-v4-selector-node.paraui-v4-selector-node-edit > .selector-node-right > .lower-child {\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-edit > .selector-node-right > .detail:hover, .paraui-v4-selector-node.paraui-v4-selector-node-edit > .selector-node-right > .lower-child:hover {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-disabled {\n  cursor: not-allowed;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-disabled.paraui-v4-selector-node-branch > .selector-node-left > .main-title {\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-disabled.paraui-v4-selector-node-leaf > .selector-node-left > .title-box > .main-title-box > .main-title {\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-disabled > .selector-node-right > .lower-child {\n  cursor: not-allowed;\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-disabled-child > .selector-node-right > .lower-child {\n  cursor: not-allowed;\n  color: rgb(161, 168, 179);\n}\n\n.paraui-v4-selector-detail .selector-detail-popover-content.selector-detail-popover-content-loading {\n  min-width: 100px;\n  min-height: 50px;\n}";
+var css_248z$3 = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-selector-node {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  cursor: pointer;\n}\n.paraui-v4-selector-node:hover {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-selector-node > .selector-node-left {\n  display: flex;\n  align-items: center;\n  flex: 1;\n  overflow: hidden;\n  padding-right: 10px;\n}\n.paraui-v4-selector-node > .selector-node-left > .selector-node-radio {\n  margin-right: 8px;\n  display: flex;\n  align-items: center;\n  padding: 0;\n}\n.paraui-v4-selector-node > .selector-node-left > .selector-node-radio .radio-box {\n  top: 0;\n}\n.paraui-v4-selector-node > .selector-node-left > .selector-node-check {\n  margin-right: 8px;\n  display: flex;\n  align-items: center;\n  padding: 0;\n}\n.paraui-v4-selector-node > .selector-node-left > .selector-node-check .checkbox-box {\n  top: 0;\n}\n.paraui-v4-selector-node > .selector-node-left > .node-img {\n  display: inline-block;\n  width: 30px;\n  height: 30px;\n  margin-right: 8px;\n}\n.paraui-v4-selector-node > .selector-node-left > .node-img img {\n  width: 30px;\n  height: 30px;\n  border-radius: 50%;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-branch {\n  height: 30px;\n  padding: 0 10px;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-branch.paraui-v4-selector-node-img {\n  height: 44px;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-branch > .selector-node-left > .main-title {\n  font-size: 14px;\n  color: rgb(29, 33, 38);\n  white-space: nowrap;\n  height: 20px;\n  line-height: 20px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-branch > .selector-node-left > .sub-title {\n  margin-left: 8px;\n  font-size: 14px;\n  color: rgb(161, 168, 179);\n  white-space: nowrap;\n  height: 20px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-branch > .selector-node-left > .tag {\n  margin-left: 8px;\n  background-color: rgba(46, 101, 230, 0.1);\n  color: rgb(46, 101, 230);\n  border-radius: 2px;\n  font-size: 12px;\n  padding: 0px 6px;\n  white-space: nowrap;\n  height: 20px;\n  line-height: 20px;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf {\n  padding: 0px 10px;\n  height: 44px;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf > .selector-node-left > .title-box {\n  flex: 1;\n  overflow: hidden;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf > .selector-node-left > .title-box > .main-title-box {\n  display: flex;\n  align-items: center;\n  white-space: nowrap;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf > .selector-node-left > .title-box > .main-title-box > .main-title {\n  font-size: 14px;\n  color: rgb(29, 33, 38);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf > .selector-node-left > .title-box > .main-title-box > .tag {\n  margin-left: 8px;\n  background-color: rgba(46, 101, 230, 0.1);\n  color: rgb(46, 101, 230);\n  border-radius: 2px;\n  font-size: 12px;\n  padding: 0px 6px;\n  white-space: nowrap;\n  height: 20px;\n  line-height: 20px;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-leaf > .selector-node-left > .title-box > .sub-title {\n  font-size: 12px;\n  color: rgb(161, 168, 179);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v4-selector-node > .selector-node-right {\n  display: flex;\n  align-items: center;\n  height: 100%;\n}\n.paraui-v4-selector-node > .selector-node-right > .detail {\n  font-size: 14px;\n  color: rgb(46, 101, 230);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-v4-selector-node > .selector-node-right > .detail:hover {\n  background-color: rgba(212, 218, 227, 0.4);\n}\n.paraui-v4-selector-node > .selector-node-right > .line {\n  border-left: 1px solid rgb(213, 224, 250);\n  margin: 0 8px;\n  content: \"\";\n  display: inline-block;\n  height: 12px;\n}\n.paraui-v4-selector-node > .selector-node-right > .lower-child {\n  font-size: 14px;\n  color: rgb(46, 101, 230);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-v4-selector-node > .selector-node-right > .lower-child:hover {\n  background-color: rgb(234, 236, 241);\n}\n.paraui-v4-selector-node > .selector-node-right > .close {\n  display: flex;\n  align-items: center;\n  color: rgb(46, 101, 230);\n  white-space: nowrap;\n  padding: 0 4px;\n  cursor: pointer;\n  height: 24px;\n  line-height: 24px;\n  border-radius: 2px;\n}\n.paraui-v4-selector-node > .selector-node-right > .close:hover > svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-selector-node > .selector-node-right > .close > svg {\n  font-size: 16px;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-edit > .selector-node-right > .detail, .paraui-v4-selector-node.paraui-v4-selector-node-edit > .selector-node-right > .lower-child {\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-edit > .selector-node-right > .detail:hover, .paraui-v4-selector-node.paraui-v4-selector-node-edit > .selector-node-right > .lower-child:hover {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-disabled {\n  cursor: not-allowed;\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-disabled.paraui-v4-selector-node-branch > .selector-node-left > .main-title {\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-disabled.paraui-v4-selector-node-leaf > .selector-node-left > .title-box > .main-title-box > .main-title {\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-disabled > .selector-node-right > .lower-child {\n  cursor: not-allowed;\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-selector-node.paraui-v4-selector-node-disabled-child > .selector-node-right > .lower-child {\n  cursor: not-allowed;\n  color: rgb(161, 168, 179);\n}\n\n.paraui-v4-selector-detail .selector-detail-popover-content.selector-detail-popover-content-loading {\n  min-width: 100px;\n  min-height: 50px;\n}";
 styleInject(css_248z$3);
 
 var SelectorNode = function SelectorNode(props) {
@@ -170,7 +170,7 @@ var SelectorNode = function SelectorNode(props) {
   var handImg = function handImg() {
     if (!img) return null;
     var imgDom = img;
-    if (typeof img === "string") imgDom = jsx("img", {
+    if (typeof img === 'string') imgDom = jsx("img", {
       src: img
     });
     return jsx("span", Object.assign({
@@ -182,13 +182,13 @@ var SelectorNode = function SelectorNode(props) {
   /** 处理选择框 */
   var handSelectDom = function handSelectDom() {
     if (selectMode === 'radio') return jsx(Radio, {
-      size: "small",
+      size: 'small',
       className: 'selector-node-radio',
       checked: checked,
       disabled: disabled
     });
     if (selectMode === 'check') return jsx(Checkbox, {
-      size: "small",
+      size: 'small',
       className: 'selector-node-check',
       checked: checked,
       disabled: disabled,
@@ -212,7 +212,7 @@ var SelectorNode = function SelectorNode(props) {
       content: handDetailDom(),
       trigger: 'hover',
       placement: 'bottomRight',
-      overlayClassName: $prefixCls + '-selector-detail',
+      overlayClassName: "".concat($prefixCls, "-selector-detail"),
       onVisibleChange: onVisibleChange
     }, {
       children: jsx("span", Object.assign({
@@ -295,13 +295,13 @@ var SelectorNode = function SelectorNode(props) {
   };
   /** 处理className */
   var handClass = function handClass() {
-    var str = $prefixCls + '-selector-node';
+    var str = "".concat($prefixCls, "-selector-node");
     str += " ".concat($prefixCls, "-selector-node-").concat(useCase);
     str += " ".concat($prefixCls, "-selector-node-").concat(nodeMode);
     if (disabled) str += " ".concat($prefixCls, "-selector-node-disabled");
     if (disabledChild) str += " ".concat($prefixCls, "-selector-node-disabled-child");
     if (img) str += " ".concat($prefixCls, "-selector-node-img");
-    if (className) str += ' ' + className;
+    if (className) str += " ".concat(className);
     return str;
   };
   return jsxs("div", Object.assign({
@@ -337,7 +337,7 @@ var SelectorNode = function SelectorNode(props) {
   }));
 };
 
-var css_248z$2 = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-selector-main {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n}\n.paraui-v4-selector-main > .selectot-main-search {\n  margin-bottom: 16px;\n  border-bottom: 1px solid rgb(234, 236, 241);\n}\n.paraui-v4-selector-main > .selectot-main-search .text-field-content {\n  border: none;\n}\n.paraui-v4-selector-main > .selector-main-box {\n  position: relative;\n  width: 100%;\n  height: 100%;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .nav-box {\n  padding: 0 10px;\n  margin-bottom: 4px;\n  margin-top: 10px;\n  line-height: 0;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list-no-data {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding-bottom: 16px;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list {\n  overflow-y: hidden;\n  display: flex;\n  flex-direction: column;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-all-check {\n  position: relative;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-all-check + .selector-group-title.selector-group-title-first {\n  margin-top: 4px;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content {\n  overflow-y: hidden;\n  position: relative;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content:before {\n  content: \"\";\n  position: absolute;\n  height: 30px;\n  width: 100%;\n  pointer-events: none;\n  top: 0;\n  left: 0;\n  z-index: 1;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content:after {\n  content: \"\";\n  position: absolute;\n  height: 30px;\n  width: 100%;\n  pointer-events: none;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content.selector-main-list-scroll-top:after {\n  box-shadow: inset 0px -10px 10px -8px rgba(0, 0, 0, 0.05);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content.selector-main-list-scroll-middle:before {\n  box-shadow: inset 0px 10px 10px -8px rgba(0, 0, 0, 0.05);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content.selector-main-list-scroll-middle:after {\n  box-shadow: inset 0px -10px 10px -8px rgba(0, 0, 0, 0.05);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content.selector-main-list-scroll-bottom:before {\n  box-shadow: inset 0px 10px 10px -8px rgba(0, 0, 0, 0.05);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content > .selector-main-list-content-box {\n  height: 100%;\n  overflow-y: auto;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content > .selector-main-list-content-box > .selector-group-title {\n  padding: 0 12px;\n  margin-top: 16px;\n  margin-bottom: 4px;\n  font-size: 14px;\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content > .selector-main-list-content-box > .selector-group-title.selector-group-title-first {\n  margin-top: 0;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-more {\n  padding: 0 10px;\n  cursor: pointer;\n  font-size: 14px;\n  color: rgb(46, 101, 230);\n  line-height: 30px;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-more:hover {\n  color: rgb(87, 131, 235);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content.selector-main-search-content {\n  /*position: absolute;\n  left: 0;\n  top: 0;*/\n  width: 100%;\n  height: 100%;\n  background-color: white;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content.selector-main-content-all-check > .selector-main-list > .selector-main-list-content {\n  max-height: calc(100% - 30px);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content.selector-main-content-load-more > .selector-main-list > .selector-main-list-content {\n  max-height: calc(100% - 30px);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content.selector-main-content-all-check.selector-main-content-load-more > .selector-main-list > .selector-main-list-content {\n  max-height: calc(100% - 30px - 30px);\n}\n.paraui-v4-selector-main.paraui-v4-selector-main-show-search > .selector-main-box {\n  height: calc(100% - 49px);\n}\n.paraui-v4-selector-main.paraui-v4-selector-main-show-search > .selector-main-box > .selector-main-content.selector-main-list-box {\n  display: none;\n}\n.paraui-v4-selector-main.paraui-v4-selector-main-search > .selector-main-box {\n  height: calc(100% - 49px);\n}\n.paraui-v4-selector-main.paraui-v4-selector-main-search > .selector-main-box .selector-main-content .nav-box {\n  margin-top: 0;\n}";
+var css_248z$2 = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-selector-main {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n}\n.paraui-v4-selector-main > .selectot-main-search {\n  margin-bottom: 16px;\n  border-bottom: 1px solid rgb(234, 236, 241);\n}\n.paraui-v4-selector-main > .selectot-main-search .text-field-content {\n  border: none;\n  height: 32px;\n}\n.paraui-v4-selector-main > .selectot-main-search .text-field-content .text-field-content-within-input {\n  height: 32px !important;\n}\n.paraui-v4-selector-main > .selectot-main-search .text-field-content .text-field-content-within-input .text-field-label-placeholder {\n  line-height: 32px !important;\n}\n.paraui-v4-selector-main > .selector-main-box {\n  position: relative;\n  width: 100%;\n  height: 100%;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .nav-box {\n  padding: 0 6px;\n  margin-bottom: 4px;\n  margin-top: 10px;\n  line-height: 0;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list-no-data {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding-bottom: 16px;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list {\n  overflow-y: hidden;\n  display: flex;\n  flex-direction: column;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-all-check {\n  position: relative;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-all-check + .selector-group-title.selector-group-title-first {\n  margin-top: 4px;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content {\n  overflow-y: hidden;\n  position: relative;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content:before {\n  content: \"\";\n  position: absolute;\n  height: 30px;\n  width: 100%;\n  pointer-events: none;\n  top: 0;\n  left: 0;\n  z-index: 1;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content:after {\n  content: \"\";\n  position: absolute;\n  height: 30px;\n  width: 100%;\n  pointer-events: none;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content.selector-main-list-scroll-top:after {\n  box-shadow: inset 0px -10px 10px -8px rgba(0, 0, 0, 0.05);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content.selector-main-list-scroll-middle:before {\n  box-shadow: inset 0px 10px 10px -8px rgba(0, 0, 0, 0.05);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content.selector-main-list-scroll-middle:after {\n  box-shadow: inset 0px -10px 10px -8px rgba(0, 0, 0, 0.05);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content.selector-main-list-scroll-bottom:before {\n  box-shadow: inset 0px 10px 10px -8px rgba(0, 0, 0, 0.05);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content > .selector-main-list-content-box {\n  height: 100%;\n  overflow-y: auto;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content > .selector-main-list-content-box > .selector-group-title {\n  padding: 0 12px;\n  margin-top: 16px;\n  margin-bottom: 4px;\n  font-size: 14px;\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-content > .selector-main-list-content-box > .selector-group-title.selector-group-title-first {\n  margin-top: 0;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-more {\n  padding: 0 10px;\n  cursor: pointer;\n  font-size: 14px;\n  color: rgb(46, 101, 230);\n  line-height: 30px;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content > .selector-main-list > .selector-main-list-more:hover {\n  color: rgb(87, 131, 235);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content.selector-main-search-content {\n  /*position: absolute;\n  left: 0;\n  top: 0;*/\n  width: 100%;\n  height: 100%;\n  background-color: white;\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content.selector-main-content-all-check > .selector-main-list > .selector-main-list-content {\n  max-height: calc(100% - 30px);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content.selector-main-content-load-more > .selector-main-list > .selector-main-list-content {\n  max-height: calc(100% - 30px);\n}\n.paraui-v4-selector-main > .selector-main-box > .selector-main-content.selector-main-content-all-check.selector-main-content-load-more > .selector-main-list > .selector-main-list-content {\n  max-height: calc(100% - 30px - 30px);\n}\n.paraui-v4-selector-main.paraui-v4-selector-main-show-search > .selector-main-box {\n  height: calc(100% - 49px);\n}\n.paraui-v4-selector-main.paraui-v4-selector-main-show-search > .selector-main-box > .selector-main-content.selector-main-list-box {\n  display: none;\n}\n.paraui-v4-selector-main.paraui-v4-selector-main-search > .selector-main-box {\n  height: calc(100% - 49px);\n}\n.paraui-v4-selector-main.paraui-v4-selector-main-search > .selector-main-box .selector-main-content .nav-box {\n  margin-top: 0;\n}";
 styleInject(css_248z$2);
 
 var SelectorMainContent = function SelectorMainContent(props) {
@@ -493,7 +493,7 @@ var SelectorMainContent = function SelectorMainContent(props) {
   /** 全选 */
   var handAllCheck = function handAllCheck() {
     // 只存在复选框模式
-    if (!isAllCheck || selectMode !== "check") return null;
+    if (!isAllCheck || selectMode !== 'check') return null;
     var checkJson = handAllCheckFunc();
     var onAllCheckCom = function onAllCheckCom() {
       var bol = true;
@@ -657,7 +657,7 @@ var SelectorMainContent = function SelectorMainContent(props) {
         className: "selector-main-list-no-data"
       }, {
         children: jsx(Empty, Object.assign({}, emptyProps, {
-          size: (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.size) || "small"
+          size: (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.size) || 'small'
         }))
       }));
     }
@@ -680,9 +680,9 @@ var SelectorMainContent = function SelectorMainContent(props) {
   };
   var handClass = function handClass() {
     var str = 'selector-main-content';
-    if (className) str += ' ' + className;
+    if (className) str += " ".concat(className);
     if (disabled) str += ' selector-main-content-disabled';
-    if (isAllCheck && selectMode === "check") str += ' selector-main-content-all-check';
+    if (isAllCheck && selectMode === 'check') str += ' selector-main-content-all-check';
     if (loadMore) str += ' selector-main-content-load-more';
     return str;
   };
@@ -897,8 +897,8 @@ var SelectorMain = function SelectorMain(props) {
   };
   // 处理class
   var handClass = function handClass() {
-    var str = $prefixCls + '-selector-main';
-    if (className) str += ' ' + className;
+    var str = "".concat($prefixCls, "-selector-main");
+    if (className) str += " ".concat(className);
     if (selectMode === 'check') str += " ".concat($prefixCls, "-selector-main-select");
     if (showSearch) str += " ".concat($prefixCls, "-selector-main-show-search");
     if (search) str += " ".concat($prefixCls, "-selector-main-search");
@@ -1121,10 +1121,10 @@ var SelectorData = function SelectorData(props) {
     }));
   };
   var handClass = function handClass() {
-    var str = $prefixCls + '-selector-data';
+    var str = "".concat($prefixCls, "-selector-data");
     if (layout) str += " ".concat($prefixCls, "-selector-data-").concat(layout);
     if (disabled === true) str += " ".concat($prefixCls, "-selector-data-disabled");
-    if (className) str += ' ' + className;
+    if (className) str += " ".concat(className);
     return str;
   };
   return jsx("div", Object.assign({
@@ -2130,7 +2130,7 @@ var Selector = function Selector(props) {
   // 处理className
   var handClass = function handClass() {
     var str = "".concat($prefixCls, "-selector");
-    if (className) str += ' ' + className;
+    if (className) str += " ".concat(className);
     if (layout) str += " ".concat($prefixCls, "-selector-").concat(layout);
     if (selectMode) str += " ".concat($prefixCls, "-selector-").concat(selectMode);
     if (disabled === true) str += " ".concat($prefixCls, "-selector-disabled");

package/Selector/interface.d.ts

@@ -1,6 +1,6 @@
-import React, { ReactNode } from "react";
-import { EmptyProps } from "../Empty";
-import { ReqFuncProps } from "./util";
+import React, { ReactNode } from 'react';
+import { EmptyProps } from '../Empty';
+import { ReqFuncProps } from './util';
 /** 搜索方法 */
 export interface SearchFuncProps {
     page?: number;
@@ -385,7 +385,7 @@ export interface SelectorProps {
      * @param item 当前节点数据
      * @param bol true列表数据, false展示数据
      * */
-    detailRender?: (item: SelectorAnyJson, bol: boolean) => (Promise<ReactNode> | ReactNode);
+    detailRender?: (item: SelectorAnyJson, bol: boolean) => Promise<ReactNode> | ReactNode;
     /** 是否全选, 只存在复选框的时候 */
     isAllCheck?: boolean;
     /** 禁用 */
@@ -417,7 +417,7 @@ export interface SelectorProps {
      * @param val 搜索框的值
      * @return [] 返回平铺数组
      * */
-    onSearch?: (val: string, reqParams: SearchFuncProps) => (Promise<SearchReqDataProps> | SearchReqDataProps);
+    onSearch?: (val: string, reqParams: SearchFuncProps) => Promise<SearchReqDataProps> | SearchReqDataProps;
     /** 刷新事件 */
     onRefresh?: () => void;
     /** 选择事件 返回true不触发onChange事件
@@ -425,7 +425,7 @@ export interface SelectorProps {
      *  bol 选中/不选中
      *  isAllCheck 全选
      * */
-    onSelect?: (item: SelectorAnyJson | SelectorAnyJson[], bol: boolean, isAllCheck: boolean) => (Promise<boolean | void> | (boolean | void));
+    onSelect?: (item: SelectorAnyJson | SelectorAnyJson[], bol: boolean, isAllCheck: boolean) => Promise<boolean | void> | (boolean | void);
     /** 改变事件 val绑定值, node处理过的数据 rowData原始数据 */
     onChange?: (val: Record<string, any>[] | Record<string, any> | null, node: Record<string, any>, rowData: Record<string, any>) => void;
     [name: string]: any;

package/SelectorPicker/index.d.ts

@@ -4,10 +4,10 @@
  * @description 选择器选择
  */
 import React, { ReactNode } from 'react';
-import { HelperTextDetailProps } from "../HelperText";
-import { LabelTooltipProps } from "../Label";
-import { SelectorProps } from "../Selector/interface";
-import { TooltipProps } from "../Tooltip";
+import { HelperTextDetailProps } from '../HelperText';
+import { LabelTooltipProps } from '../Label';
+import { SelectorProps } from '../Selector/interface';
+import { TooltipProps } from '../Tooltip';
 import './index.scss';
 export interface SelectorPickerProps extends HelperTextDetailProps {
     /** className */

package/SelectorPicker/index.js

@@ -29,8 +29,8 @@ import 'rc-dropdown';
 import '../_verture/usePopupContainer-87febeb9.js';
 import 'dayjs';
 import '@paraview/lib';
-import '../_verture/index-d63bd287.js';
-import '../_verture/typeof-b240b062.js';
+import '../_verture/index-232d890b.js';
+import '../_verture/typeof-c310ee4a.js';
 import '../Radio/index.js';
 import '../Checkbox/index.js';
 import '../Loading/index.js';
@@ -65,7 +65,7 @@ var localeJson = {
   en: en
 };
 
-var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2022/8/2 5:57 PM\n* @description\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-selector-picker {\n  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n  font-size: 14px;\n  font-weight: 400;\n  width: 100%;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n  padding: 0 38px 0 10px;\n  border: 1px solid rgb(212, 218, 227);\n  border-radius: 4px;\n  background-color: rgb(255, 255, 255);\n  cursor: pointer;\n  transition: 0.3s;\n  padding-right: 40px;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper:hover {\n  border-color: rgb(87, 131, 235);\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper:hover > .selector-picker-arrow > svg {\n  color: rgb(87, 131, 235);\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  width: 100%;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  overflow: hidden;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item {\n  display: inline-block;\n  background-color: rgb(234, 236, 241);\n  border-radius: 4px;\n  padding: 0 10px;\n  color: rgb(29, 33, 38);\n  margin-right: 4px;\n  vertical-align: top;\n  max-width: 100%;\n  white-space: nowrap;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item.check-select-content-item-more {\n  cursor: pointer;\n  color: rgb(29, 33, 38);\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item.check-select-content-item-more > span {\n  max-width: none;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > span {\n  color: rgb(29, 33, 38);\n  display: inline-block;\n  height: 100%;\n  vertical-align: top;\n  max-width: calc(100% - 20px);\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > svg {\n  cursor: pointer;\n  margin-left: 8px;\n  color: rgb(29, 33, 38);\n  font-size: 16px;\n  position: relative;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > svg:hover {\n  color: rgb(87, 131, 235);\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check.check-select-content-item-noclose > span {\n  max-width: none;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  font-size: 14px;\n  line-height: 1.429;\n  color: rgb(29, 33, 38);\n  word-break: break-all;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-placeholder {\n  flex: 1;\n  color: rgb(161, 168, 179);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-arrow {\n  position: absolute;\n  right: 10px;\n  top: 0;\n  z-index: 2;\n  line-height: 0;\n  width: 18px;\n  height: 18px;\n  transition: all 0.3s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-arrow > svg {\n  font-size: 18px;\n  color: rgb(92, 101, 115);\n  transition: all 0.3s;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-clear {\n  position: absolute;\n  right: 10px;\n  top: 0;\n  z-index: 2;\n  line-height: 0;\n  opacity: 0;\n  transition: all 0.3s;\n  width: 18px;\n  height: 18px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-clear > svg {\n  font-size: 16px;\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-clear:hover > svg {\n  color: rgb(87, 131, 235);\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-focused > .selector-picker-wrapper {\n  border-color: rgb(46, 101, 230);\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-focused > .selector-picker-wrapper > .selector-picker-arrow svg {\n  transform: rotate(180deg);\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-disabled > .selector-picker-wrapper {\n  background-color: rgb(247, 248, 250);\n  cursor: not-allowed;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-disabled > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > span {\n  max-width: 100%;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-disabled > .selector-picker-wrapper:hover {\n  border-color: rgb(212, 218, 227);\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-disabled > .selector-picker-wrapper:hover > .selector-picker-arrow > svg {\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-error > .selector-picker-wrapper {\n  border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-clear > .selector-picker-wrapper:hover > .selector-picker-arrow {\n  opacity: 0;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-clear > .selector-picker-wrapper:hover > .selector-picker-clear {\n  opacity: 1;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-clear.paraui-v4-selector-picker-disabled > .selector-picker-wrapper:hover > .selector-picker-arrow {\n  opacity: 1;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-wrap > .selector-picker-wrapper {\n  min-height: 32px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  min-height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  padding-bottom: 3px;\n  height: 100%;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  min-height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper {\n  height: 32px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item {\n  margin-top: 3px;\n  height: 24px;\n  line-height: 24px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > svg {\n  top: 3px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  padding: 5px 0;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-placeholder {\n  height: 30px;\n  line-height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-arrow {\n  top: 6px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-clear {\n  top: 6px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-wrap > .selector-picker-wrapper {\n  min-height: 28px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  min-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  padding-bottom: 3px;\n  height: 100%;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  min-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper {\n  height: 28px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item {\n  margin-top: 3px;\n  height: 20px;\n  line-height: 20px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > svg {\n  top: 2px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  padding: 3px 0;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-placeholder {\n  height: 26px;\n  line-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-arrow {\n  top: 4px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-clear {\n  top: 4px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-wrap > .selector-picker-wrapper {\n  min-height: 28px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  min-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  padding-bottom: 3px;\n  height: 100%;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  min-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper {\n  height: 28px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item {\n  margin-top: 3px;\n  height: 20px;\n  line-height: 20px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > svg {\n  top: 2px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  padding: 3px 0;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-placeholder {\n  height: 26px;\n  line-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-arrow {\n  top: 4px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-clear {\n  top: 4px;\n}\n\n.paraui-v4-selector-picker-dropdown .paraui-v4-selector {\n  border: 0;\n}\n.paraui-v4-selector-picker-dropdown .selector-picker-dropdown-content {\n  max-height: 300px;\n  overflow: auto;\n}\n\n.paraui-v4-selector-more-popover {\n  /*// 小\n  &.paraui-v4-selector-more-popover-small {\n    & .select-more {\n      & > .select-more-title {\n        line-height: 28px;\n      }\n\n      & > .select-more-content {\n        & > .select-more-content-item {\n          line-height: 28px;\n        }\n      }\n    }\n  }\n\n  // 中\n  &.paraui-v4-selector-more-popover-medium {\n    & .select-more {\n      & > .select-more-title {\n        line-height: 32px;\n      }\n\n      & > .select-more-content {\n        & > .select-more-content-item {\n          line-height: 32px;\n        }\n      }\n    }\n  }\n\n  // 大\n  &.paraui-v4-selector-more-popover-large {\n    & .select-more {\n      & > .select-more-title {\n        line-height: 36px;\n      }\n\n      & > .select-more-content {\n        & > .select-more-content-item {\n          line-height: 36px;\n        }\n      }\n    }\n  }*/\n}\n.paraui-v4-selector-more-popover .select-more {\n  width: 290px;\n  padding: 4px 0;\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-title {\n  font-size: 14px;\n  padding: 0 10px;\n  color: rgb(161, 168, 179);\n  line-height: 30px;\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content {\n  max-height: 320px;\n  overflow: auto;\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content > .select-more-content-item {\n  padding: 0 10px;\n  display: flex;\n  justify-content: space-around;\n  align-items: center;\n  line-height: 30px;\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content > .select-more-content-item:hover {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content > .select-more-content-item > span {\n  width: calc(100% - 25px);\n  display: inline-block;\n  font-size: 14px;\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content > .select-more-content-item > svg {\n  font-size: 18px;\n  position: relative;\n  cursor: pointer;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content > .select-more-content-item > svg:hover {\n  background-color: rgb(234, 236, 241);\n  color: rgb(87, 131, 235);\n  border-radius: 2px;\n}";
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2022/8/2 5:57 PM\n* @description\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-selector-picker {\n  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n  font-size: 14px;\n  font-weight: 400;\n  width: 100%;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n  padding: 0 38px 0 10px;\n  border: 1px solid rgb(212, 218, 227);\n  border-radius: 4px;\n  background-color: rgb(255, 255, 255);\n  cursor: pointer;\n  transition: 0.3s;\n  padding-right: 40px;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper:hover {\n  border-color: rgb(87, 131, 235);\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper:hover > .selector-picker-arrow > svg {\n  color: rgb(87, 131, 235);\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  width: 100%;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  overflow: hidden;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item {\n  display: inline-block;\n  background-color: rgb(234, 236, 241);\n  border-radius: 4px;\n  padding: 0 10px;\n  color: rgb(29, 33, 38);\n  margin-right: 4px;\n  vertical-align: top;\n  max-width: 100%;\n  white-space: nowrap;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item.check-select-content-item-more {\n  cursor: pointer;\n  color: rgb(29, 33, 38);\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item.check-select-content-item-more > span {\n  max-width: none;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > span {\n  color: rgb(29, 33, 38);\n  display: inline-block;\n  height: 100%;\n  vertical-align: top;\n  max-width: calc(100% - 20px);\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > svg {\n  cursor: pointer;\n  margin-left: 8px;\n  color: rgb(29, 33, 38);\n  font-size: 16px;\n  position: relative;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > svg:hover {\n  color: rgb(87, 131, 235);\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check.check-select-content-item-noclose > span {\n  max-width: none;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  font-size: 14px;\n  line-height: 1.429;\n  color: rgb(29, 33, 38);\n  word-break: break-all;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-placeholder {\n  flex: 1;\n  color: rgb(161, 168, 179);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-arrow {\n  position: absolute;\n  right: 10px;\n  top: 0;\n  z-index: 2;\n  line-height: 0;\n  width: 18px;\n  height: 18px;\n  transition: all 0.3s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-arrow > svg {\n  font-size: 18px;\n  color: rgb(92, 101, 115);\n  transition: all 0.3s;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-clear {\n  position: absolute;\n  right: 10px;\n  top: 0;\n  z-index: 2;\n  line-height: 0;\n  opacity: 0;\n  transition: all 0.3s;\n  width: 18px;\n  height: 18px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-clear > svg {\n  font-size: 16px;\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-selector-picker > .selector-picker-wrapper > .selector-picker-clear:hover > svg {\n  color: rgb(87, 131, 235);\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-focused > .selector-picker-wrapper {\n  border-color: rgb(46, 101, 230);\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-focused > .selector-picker-wrapper > .selector-picker-arrow svg {\n  transform: rotate(180deg);\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-disabled > .selector-picker-wrapper {\n  background-color: rgb(247, 248, 250);\n  cursor: not-allowed;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-disabled > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > span {\n  max-width: 100%;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-disabled > .selector-picker-wrapper:hover {\n  border-color: rgb(212, 218, 227);\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-disabled > .selector-picker-wrapper:hover > .selector-picker-arrow > svg {\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-error > .selector-picker-wrapper {\n  border-color: rgb(244, 66, 66) !important;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-clear > .selector-picker-wrapper:hover > .selector-picker-arrow {\n  opacity: 0;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-clear > .selector-picker-wrapper:hover > .selector-picker-clear {\n  opacity: 1;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-clear.paraui-v4-selector-picker-disabled > .selector-picker-wrapper:hover > .selector-picker-arrow {\n  opacity: 1;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-wrap > .selector-picker-wrapper {\n  min-height: 32px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  min-height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  padding-bottom: 3px;\n  height: 100%;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  min-height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper {\n  height: 32px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item {\n  margin-top: 3px;\n  height: 24px;\n  line-height: 24px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > svg {\n  top: 3px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  padding: 5px 0;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-placeholder {\n  height: 30px;\n  line-height: 30px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-arrow {\n  top: 6px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-large > .selector-picker-wrapper > .selector-picker-clear {\n  top: 6px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-wrap > .selector-picker-wrapper {\n  min-height: 28px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  min-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  padding-bottom: 3px;\n  height: 100%;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  min-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper {\n  height: 28px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item {\n  margin-top: 3px;\n  height: 20px;\n  line-height: 20px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > svg {\n  top: 2px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  padding: 3px 0;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-placeholder {\n  height: 26px;\n  line-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-arrow {\n  top: 4px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-medium > .selector-picker-wrapper > .selector-picker-clear {\n  top: 4px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-wrap > .selector-picker-wrapper {\n  min-height: 28px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  min-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  padding-bottom: 3px;\n  height: 100%;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-wrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  min-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper {\n  height: 28px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small.paraui-v4-selector-picker-nowrap > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item {\n  margin-top: 3px;\n  height: 20px;\n  line-height: 20px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-check > .check-select-content-item > svg {\n  top: 2px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-wrapper-content > .selector-picker-wrapper-content-radio {\n  padding: 3px 0;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-placeholder {\n  height: 26px;\n  line-height: 26px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-arrow {\n  top: 4px;\n}\n.paraui-v4-selector-picker.paraui-v4-selector-picker-small > .selector-picker-wrapper > .selector-picker-clear {\n  top: 4px;\n}\n\n.paraui-v4-selector-picker-dropdown .paraui-v4-selector {\n  border: 0;\n}\n.paraui-v4-selector-picker-dropdown .selector-picker-dropdown-content {\n  max-height: 300px;\n  overflow: auto;\n}\n\n.paraui-v4-selector-more-popover {\n  /*// 小\n  &.paraui-v4-selector-more-popover-small {\n    & .select-more {\n      & > .select-more-title {\n        line-height: 28px;\n      }\n\n      & > .select-more-content {\n        & > .select-more-content-item {\n          line-height: 28px;\n        }\n      }\n    }\n  }\n\n  // 中\n  &.paraui-v4-selector-more-popover-medium {\n    & .select-more {\n      & > .select-more-title {\n        line-height: 32px;\n      }\n\n      & > .select-more-content {\n        & > .select-more-content-item {\n          line-height: 32px;\n        }\n      }\n    }\n  }\n\n  // 大\n  &.paraui-v4-selector-more-popover-large {\n    & .select-more {\n      & > .select-more-title {\n        line-height: 36px;\n      }\n\n      & > .select-more-content {\n        & > .select-more-content-item {\n          line-height: 36px;\n        }\n      }\n    }\n  }*/\n}\n.paraui-v4-selector-more-popover .select-more {\n  width: 290px;\n  padding: 4px 0;\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-title {\n  font-size: 14px;\n  padding: 0 10px;\n  color: rgb(161, 168, 179);\n  line-height: 30px;\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content {\n  max-height: 320px;\n  overflow: auto;\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content > .select-more-content-item {\n  padding: 0 10px;\n  display: flex;\n  justify-content: space-around;\n  align-items: center;\n  line-height: 30px;\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content > .select-more-content-item:hover {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content > .select-more-content-item > span {\n  width: calc(100% - 25px);\n  display: inline-block;\n  font-size: 14px;\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content > .select-more-content-item > svg {\n  font-size: 18px;\n  position: relative;\n  cursor: pointer;\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-selector-more-popover .select-more > .select-more-content > .select-more-content-item > svg:hover {\n  color: rgb(46, 101, 230);\n  border-radius: 2px;\n}";
 styleInject(css_248z);
 
 //下拉选择器
@@ -125,7 +125,7 @@ var SelectorPicker = function SelectorPicker(props) {
   var constData = useRef({
     list: []
   });
-  var prefixCls = $prefixCls + '-selector-picker';
+  var prefixCls = "".concat($prefixCls, "-selector-picker");
   constData.current.value = value;
   constData.current.valueCom = valueCom;
   constData.current.openMore = openMore;
@@ -148,10 +148,10 @@ var SelectorPicker = function SelectorPicker(props) {
     if (!overLine && multiple) {
       window.addEventListener('resize', changeSize);
     } else {
-      window.removeEventListener("resize", changeSize);
+      window.removeEventListener('resize', changeSize);
     }
     return function () {
-      window.removeEventListener("resize", changeSize);
+      window.removeEventListener('resize', changeSize);
     };
   }, [overLine, multiple]);
   useEffect(function () {
@@ -229,7 +229,7 @@ var SelectorPicker = function SelectorPicker(props) {
     return jsx("div", Object.assign({
       className: 'selector-picker-dropdown-content',
       style: {
-        width: (refDom && refDom.current ? refDom.current.offsetWidth : 0) + 'px'
+        width: "".concat(refDom && refDom.current ? refDom.current.offsetWidth : 0, "px")
       }
     }, {
       children: jsx(Selector, Object.assign({}, handSelectorProps()))
@@ -284,7 +284,7 @@ var SelectorPicker = function SelectorPicker(props) {
           }, {
             children: [jsx("span", {
               children: jsx(AutoTips, Object.assign({
-                placement: "top-start"
+                placement: 'top-start'
               }, {
                 children: renderVal || val
               }))
@@ -318,7 +318,7 @@ var SelectorPicker = function SelectorPicker(props) {
       className: 'selector-picker-wrapper-content-radio'
     }, {
       children: overLine ? resultVal : jsx(AutoTips, Object.assign({
-        placement: "top-start"
+        placement: 'top-start'
       }, {
         children: resultVal
       }))
@@ -386,7 +386,7 @@ var SelectorPicker = function SelectorPicker(props) {
           }, {
             children: [jsx("span", {
               children: jsx(AutoTips, Object.assign({
-                placement: "top-start"
+                placement: 'top-start'
               }, {
                 children: renderVal || val
               }))
@@ -404,7 +404,7 @@ var SelectorPicker = function SelectorPicker(props) {
   var handleClassMorePopover = function handleClassMorePopover() {
     var str = "".concat($prefixCls, "-selector-more-popover ").concat($prefixCls, "-scrollbar-small");
     if (size) str += " ".concat($prefixCls, "-selector-more-popover-").concat(size);
-    if (morePopoverClassName) str += ' ' + morePopoverClassName;
+    if (morePopoverClassName) str += " ".concat(morePopoverClassName);
     return str;
   };
   /** 多选超出popover */
@@ -428,7 +428,7 @@ var SelectorPicker = function SelectorPicker(props) {
       placement: 'bottomLeft',
       trigger: ['click'],
       onVisibleChange: onVisibleChange,
-      overlayClassName: $prefixCls + '-selector-picker-dropdown',
+      overlayClassName: "".concat($prefixCls, "-selector-picker-dropdown"),
       getPopupContainer: getPopupContainer
     }, {
       children: disabledTooltip ? jsx(Tooltip, Object.assign({

package/SingleBox/index.d.ts

@@ -5,8 +5,8 @@
  */
 import React, { FunctionComponent, ReactNode } from 'react';
 import { TextFieldProps } from '../TextField';
-import { LabelTooltipProps } from "../Label";
-import { HelperTextDetailProps } from "../HelperText";
+import { LabelTooltipProps } from '../Label';
+import { HelperTextDetailProps } from '../HelperText';
 import './index.scss';
 export interface SingleBoxProps extends HelperTextDetailProps {
     /** 样式class */

package/SingleBox/index.js

@@ -148,7 +148,7 @@ var SingleBox = function SingleBox(props) {
     var handLabelClass = function handLabelClass() {
       var str = 'single-box-label';
       if (labelTooltip && labelTooltip.className) {
-        str += ' ' + labelTooltip.className;
+        str += " ".concat(labelTooltip.className);
       }
       return str;
     };
@@ -162,8 +162,8 @@ var SingleBox = function SingleBox(props) {
   };
   /** 处理class */
   var handClass = function handClass() {
-    var str = $prefixCls + '-single-box';
-    if (className) str += ' ' + className;
+    var str = "".concat($prefixCls, "-single-box");
+    if (className) str += " ".concat(className);
     if (size) str += " ".concat($prefixCls, "-single-box-").concat(size);
     if (disabled) str += " ".concat($prefixCls, "-single-box-disabled");
     return str;

package/Slider/interface.d.ts

@@ -3,7 +3,7 @@
  * @date 2021/11/5 下午4:05
  * @description
  */
-import React from "react";
+import React from 'react';
 export type TooltipPlacement = 'top' | 'left' | 'right' | 'bottom' | 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight' | 'leftTop' | 'leftBottom' | 'rightTop' | 'rightBottom';
 interface SliderRange {
     draggableTrack?: boolean;

package/Status/index.d.ts

@@ -3,20 +3,22 @@
  * @date 2022/11/8 5:53 PM
  * @description 状态组件
  */
-import React, { FC, ReactNode } from "react";
-import "./index.scss";
-type iconType = "success" | "error";
+import React, { FC, ReactNode } from 'react';
+import './index.scss';
+type iconType = 'success' | 'error';
 export interface StatusProps {
     /** 文本 **/
     text?: ReactNode;
     /** 状态 */
-    status?: "info" | "success" | "warning" | "error" | "completed";
+    status?: 'info' | 'success' | 'warning' | 'error' | 'completed';
     /** 自定义状态图标 **/
     icon?: ReactNode | iconType;
     /** cls */
     className?: string;
     /** style */
     style?: React.CSSProperties;
+    /** 自定义状态颜色 */
+    color?: string;
 }
 export declare const Status: FC<StatusProps>;
 export default Status;

package/Status/index.js

@@ -3,31 +3,33 @@ import clsx from 'clsx';
 import { $ as $prefixCls } from '../_verture/constant-0d9802f7.js';
 import CloseCircleF from '@para-ui/icons/CloseCircleF';
 import CompleteIcon from '@para-ui/icons/CheckCircleF';
+import { t as tinycolor } from '../_verture/tinycolor-ece3542d.js';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
 
-var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/11/8 6:32 PM\n* @description 状态\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-status {\n  display: inline-flex;\n  align-items: center;\n}\n.paraui-v4-status .status-ink {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  width: 10px;\n  height: 10px;\n}\n.paraui-v4-status .status-ink:before {\n  content: \" \";\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n}\n.paraui-v4-status .status-icon {\n  display: inline-flex;\n  font-size: 500;\n}\n.paraui-v4-status .status-icon svg {\n  font-size: 500;\n}\n.paraui-v4-status .status-icon .status-icon-success {\n  color: rgb(19, 191, 76);\n}\n.paraui-v4-status .status-icon .status-icon-error {\n  color: rgb(244, 66, 66);\n}\n.paraui-v4-status .status-text {\n  margin-left: 4px;\n  font-size: 14px;\n  color: rgba(29, 33, 38, 0.9);\n}\n.paraui-v4-status-info .status-ink {\n  background: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-status-info .status-ink:before {\n  background-color: rgb(46, 101, 230);\n}\n.paraui-v4-status-success .status-ink {\n  background-color: rgba(19, 191, 76, 0.1);\n}\n.paraui-v4-status-success .status-ink:before {\n  background-color: rgb(19, 191, 76);\n}\n.paraui-v4-status-warning .status-ink {\n  background-color: rgba(255, 147, 38, 0.1);\n}\n.paraui-v4-status-warning .status-ink:before {\n  background-color: rgb(255, 147, 38);\n}\n.paraui-v4-status-error .status-ink {\n  background-color: rgba(244, 66, 66, 0.1);\n}\n.paraui-v4-status-error .status-ink:before {\n  background-color: rgb(244, 66, 66);\n}\n.paraui-v4-status-completed .status-ink {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-status-completed .status-ink:before {\n  background-color: rgb(161, 168, 179);\n}";
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/11/8 6:32 PM\n* @description 状态\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-status {\n  display: inline-flex;\n  align-items: center;\n}\n.paraui-v4-status .status-ink {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  width: 10px;\n  height: 10px;\n}\n.paraui-v4-status .status-ink .status-radius {\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n}\n.paraui-v4-status .status-icon {\n  display: inline-flex;\n  font-size: 16px;\n}\n.paraui-v4-status .status-icon svg {\n  font-size: 16px;\n}\n.paraui-v4-status .status-icon .status-icon-success {\n  color: rgb(19, 191, 76);\n}\n.paraui-v4-status .status-icon .status-icon-error {\n  color: rgb(244, 66, 66);\n}\n.paraui-v4-status .status-text {\n  margin-left: 4px;\n  font-size: 14px;\n  color: rgba(29, 33, 38, 0.9);\n}\n.paraui-v4-status-info .status-ink {\n  background: rgba(46, 101, 230, 0.1);\n}\n.paraui-v4-status-info .status-ink .status-radius {\n  background-color: rgb(46, 101, 230);\n}\n.paraui-v4-status-success .status-ink {\n  background-color: rgba(19, 191, 76, 0.1);\n}\n.paraui-v4-status-success .status-ink .status-radius {\n  background-color: rgb(19, 191, 76);\n}\n.paraui-v4-status-warning .status-ink {\n  background-color: rgba(255, 147, 38, 0.1);\n}\n.paraui-v4-status-warning .status-ink .status-radius {\n  background-color: rgb(255, 147, 38);\n}\n.paraui-v4-status-error .status-ink {\n  background-color: rgba(244, 66, 66, 0.1);\n}\n.paraui-v4-status-error .status-ink .status-radius {\n  background-color: rgb(244, 66, 66);\n}\n.paraui-v4-status-completed .status-ink {\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-status-completed .status-ink .status-radius {\n  background-color: rgb(161, 168, 179);\n}";
 styleInject(css_248z);
 
 //状态
 var Status = function Status(props) {
   var text = props.text,
     _props$status = props.status,
-    status = _props$status === void 0 ? "info" : _props$status,
+    status = _props$status === void 0 ? 'info' : _props$status,
     icon = props.icon,
     className = props.className,
-    style = props.style;
+    style = props.style,
+    color = props.color;
   //cls
   var makeCls = clsx("".concat($prefixCls, "-status"), className, status && !icon && "".concat($prefixCls, "-status-").concat(status));
   // render Icon
   var renderIcon = function renderIcon() {
     if (icon) {
-      if (typeof icon === "string") {
+      if (typeof icon === 'string') {
         switch (icon) {
-          case "success":
+          case 'success':
             return jsx(CompleteIcon, {
               className: "status-icon-".concat(icon)
             });
-          case "error":
+          case 'error':
             return jsx(CloseCircleF, {
               className: "status-icon-".concat(icon)
             });
@@ -47,9 +49,19 @@ var Status = function Status(props) {
       className: "status-icon"
     }, {
       children: renderIcon()
-    })) : jsx("span", {
-      className: "status-ink"
-    }), jsx("span", Object.assign({
+    })) : jsx("div", Object.assign({
+      className: "status-ink",
+      style: {
+        backgroundColor: color ? tinycolor(color).setAlpha(0.1).toRgbString() : undefined
+      }
+    }, {
+      children: jsx("span", {
+        className: 'status-radius',
+        style: {
+          backgroundColor: color ? color : undefined
+        }
+      })
+    })), jsx("span", Object.assign({
       className: "status-text"
     }, {
       children: text

package/Stepper/index.d.ts

@@ -3,9 +3,9 @@
  * @date 2022/6/7 下午4:02
  * @description stepper
  */
-import React from "react";
-import RcSteps from "rc-steps";
-import "./index.scss";
+import React from 'react';
+import RcSteps from 'rc-steps';
+import './index.scss';
 type StepItem = string | {
     label?: React.ReactNode;
     icon?: React.ReactNode;
@@ -20,7 +20,7 @@ export interface StepperProps {
     /** 发生err的步骤 */
     errorStep?: number;
     /** 指定步骤条方向 */
-    direction?: "horizontal" | "vertical";
+    direction?: 'horizontal' | 'vertical';
     style?: React.CSSProperties;
     /**
      * 步骤条数据
@@ -40,7 +40,7 @@ export interface StepProps {
     /** 点击步骤时触发 */
     onClick?: React.MouseEventHandler<HTMLElement>;
     /** 步骤状态 */
-    status?: "wait" | "process" | "finish" | "error";
+    status?: 'wait' | 'process' | 'finish' | 'error';
     /** 禁用点击 */
     disabled?: boolean;
     /** 标题 */