@para-ui/core 3.0.20 → 3.0.21

package/CheckboxGroup/index.d.ts

@@ -16,6 +16,8 @@ export interface CheckboxGroupProps extends HelperTextDetailProps {
     className?: string;
     /** style */
     style?: React.CSSProperties;
+    /** 间距 只有在横向布局的时候生效 */
+    spacing?: string;
     /** 标题 */
     label?: ReactNode;
     /** 帮组提示信息 */

package/CheckboxGroup/index.js

@@ -22,6 +22,8 @@ var CheckboxGroup = function CheckboxGroup(props) {
   var _props$label = props.label,
       label = _props$label === void 0 ? '' : _props$label,
       labelTooltip = props.labelTooltip,
+      _props$spacing = props.spacing,
+      spacing = _props$spacing === void 0 ? '28px' : _props$spacing,
       _props$size = props.size,
       size = _props$size === void 0 ? 'large' : _props$size,
       _props$row = props.row,
@@ -100,6 +102,20 @@ var CheckboxGroup = function CheckboxGroup(props) {
     }
 
     return null;
+  };
+  /**
+   * @description 处理单选框每一项样式
+   * */
+
+
+  var handStyleItem = function handStyleItem(item, index) {
+    var obj = Object.assign({}, item.style);
+
+    if (spacing && row && list.length !== index + 1) {
+      obj.marginRight = spacing;
+    }
+
+    return obj;
   }; // 处理class
 
 
@@ -122,6 +138,7 @@ var CheckboxGroup = function CheckboxGroup(props) {
     }, {
       children: list.map(function (item, index) {
         return /*#__PURE__*/createElement(Checkbox, Object.assign({}, item, {
+          style: handStyleItem(item, index),
           checked: valueCom.indexOf(item[id]) !== -1,
           size: size,
           disabled: Boolean(disabled || item.disabled),

package/Form/index.js

@@ -3,7 +3,7 @@ import { _ as _slicedToArray } from '../_verture/slicedToArray-d7722f4b.js';
 import { jsx } from 'react/jsx-runtime';
 import { DeepClone } from '@paraview/lib';
 import React__default from 'react';
-import { F as FormItem, v as validate } from '../_verture/index-35fb8f69.js';
+import { F as FormItem, v as validate } from '../_verture/index-b4f57a63.js';
 import { $ as $prefixCls } from '../_verture/constant-bf34e6fa.js';
 import '../TextField/index.js';
 import '../_verture/typeof-498dd2b1.js';

package/FormItem/index.js

@@ -1,6 +1,6 @@
 import 'react/jsx-runtime';
 import 'react';
-export { F as default } from '../_verture/index-35fb8f69.js';
+export { F as default } from '../_verture/index-b4f57a63.js';
 import 'clsx';
 import '../Label/index.js';
 import '../_verture/constant-bf34e6fa.js';

package/HelperText/index.d.ts

@@ -6,8 +6,12 @@
 import React, { FunctionComponent, ReactNode } from 'react';
 import './index.scss';
 export interface HelperTextDetailProps {
-    /** 没有错误的时候,不渲染 */
-    hideErrorDom?: boolean;
+    /**
+     * true 没有错误的时候,不渲染
+     * false 都渲染
+     * null 不渲染,直接返回null
+     * */
+    hideErrorDom?: boolean | null;
     /** 是否显示错误 */
     error?: boolean;
     /** 错误提示 */

package/HelperText/index.js

@@ -12,7 +12,8 @@ var HelperText = function HelperText(props) {
       error = _props$error === void 0 ? false : _props$error,
       _props$hideErrorDom = props.hideErrorDom,
       hideErrorDom = _props$hideErrorDom === void 0 ? false : _props$hideErrorDom,
-      helperText = props.helperText; // 不存在错误,且没有错误隐藏错误dom
+      helperText = props.helperText;
+  if (hideErrorDom === null) return null; // 不存在错误,且没有错误隐藏错误dom
 
   if (!error && hideErrorDom) return null; // 处理class
 

package/InputLang/index.js

@@ -30,8 +30,9 @@ import '@para-ui/core/GlobalContext';
 import '../Dropdown/index.js';
 import 'rc-dropdown';
 import '../_verture/usePopupContainer-874d101b.js';
-import '@para-ui/icons/Plus';
 import '@para-ui/icons/Delete';
+import '@para-ui/icons/PlusCircleF';
+import '../_verture/useFormatMessage-f4452258.js';
 
 var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n/**\n* @author linhd\n* @date 2022/8/12 5:28 PM\n* @description 全局css前缀\n*/\n.paraui-v3-input-lang {\n  display: inline-block;\n  width: 100%;\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}\n.paraui-v3-input-lang .input-lang-text-field > .text-field-content > .text-field-content-after {\n  cursor: pointer;\n}\n.paraui-v3-input-lang .input-lang-text-field > .text-field-content > .text-field-content-after .lang-list-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.paraui-v3-input-lang-popover > .component-popover-content > .component-popover-inner {\n  padding: 12px;\n  width: 300px;\n  line-height: 0;\n}\n.paraui-v3-input-lang-popover > .component-popover-content > .component-popover-inner .input-lang-multi-box {\n  padding-bottom: 0;\n}";
 styleInject(css_248z);

package/Menu/index.js

@@ -1147,7 +1147,7 @@ var FooterExpansion = function FooterExpansion(props) {
   }));
 };
 
-var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n/**\n* @author linhd\n* @date 2022/8/12 5:28 PM\n* @description 全局css前缀\n*/\n.paraui-v3-vertical-menu {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\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}\n.paraui-v3-vertical-menu > .menu-logo {\n  width: 100%;\n  display: inline-block;\n  padding: 24px 16px 0 16px;\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}\n.paraui-v3-vertical-menu > .menu-logo.menu-logo-shrink {\n  padding: 24px 0 0;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list {\n  overflow: hidden;\n  height: 100%;\n  padding: 40px 16px;\n  position: relative;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-top {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 40px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-top > svg {\n  cursor: pointer;\n  transform: rotate(180deg);\n  font-size: 18px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-top > svg:hover {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box {\n  height: 100%;\n  overflow: hidden;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll {\n  transition: all 0.3s;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item {\n  margin-bottom: 8px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item:last-child {\n  margin-bottom: 0;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content {\n  height: 40px;\n  line-height: 40px;\n  cursor: pointer;\n  display: flex;\n  border-radius: 4px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-icon {\n  width: 20px;\n  margin-right: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-icon > svg {\n  font-size: 16px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-label {\n  font-size: 14px;\n  width: 100%;\n  white-space: nowrap;\n  font-weight: 400;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-arrow {\n  width: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-arrow > svg {\n  font-size: 16px;\n  transition: all 0.3s;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-arrow > .opacity-pos-svg {\n  opacity: 0;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .li-collapse > div > div > .vertical-menu-list-item:first-child {\n  margin-top: 8px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-open > .vertical-menu-list-item-content > .menu-item-arrow > svg {\n  transform: rotate(180deg);\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-bottom {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: 40px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-bottom > svg {\n  cursor: pointer;\n  font-size: 18px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-bottom > svg:hover {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu > .footer-expansion {\n  display: flex;\n  align-items: center;\n  width: 100%;\n  padding-bottom: 20px;\n  white-space: nowrap;\n  height: 40px;\n}\n.paraui-v3-vertical-menu > .footer-expansion > svg {\n  font-size: 20px;\n  cursor: pointer;\n  margin-left: 20px;\n}\n.paraui-v3-vertical-menu > .footer-expansion > .version {\n  margin-left: 12px;\n  font-size: 14px;\n}\n.paraui-v3-vertical-menu > .footer-expansion.footer-expansion-shrink {\n  justify-content: center;\n}\n.paraui-v3-vertical-menu > .footer-expansion.footer-expansion-shrink > svg {\n  margin: 0;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list {\n  padding: 44px 0px;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box {\n  height: 100%;\n  overflow: hidden;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  cursor: pointer;\n  margin-bottom: 8px;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink:last-child {\n  margin-bottom: 0;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink:after {\n  content: \"\";\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n  z-index: 1;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span {\n  width: 40px;\n  height: 40px;\n  line-height: 40px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span > svg {\n  position: relative;\n  font-size: 20px;\n}\n\n.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  padding: 0;\n  box-shadow: none;\n}\n.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content {\n  width: auto;\n  height: 32px;\n  line-height: 32px;\n}\n.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon {\n  display: none;\n}\n.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow {\n  display: none;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper {\n  padding-left: 8px;\n  z-index: 1500;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  box-shadow: 0px 2px 8px 0px rgba(171, 176, 185, 0.4);\n  border-radius: 4px;\n  padding: 8px 0;\n  max-height: 268px;\n  overflow-y: auto;\n  overflow-x: hidden;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item {\n  position: relative;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content {\n  width: 200px;\n  height: 36px;\n  line-height: 36px;\n  padding: 0px 12px;\n  display: flex;\n  cursor: pointer;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:after, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:after {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  z-index: 1;\n  content: \"\";\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon {\n  width: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin-right: 12px;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg {\n  font-size: 20px;\n  position: relative;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg:after, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg:after {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  content: \"\";\n  z-index: 1;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label {\n  font-size: 14px;\n  width: 100%;\n  font-weight: 400;\n  white-space: nowrap;\n  text-align: left;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow {\n  width: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg {\n  font-size: 20px;\n  transition: all 0.3s;\n  position: relative;\n  transform: rotate(270deg);\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg:after, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg:after {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  content: \"\";\n  z-index: 1;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > .opacity-pos-svg, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > .opacity-pos-svg {\n  opacity: 0;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item .vertical-menu-item-popper, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item .vertical-menu-item-popper {\n  position: absolute;\n  transform: none !important;\n  left: 100% !important;\n  top: -8px;\n}\n\n.paraui-v3-vertical-menu-deep {\n  background-color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-deep > .menu-logo {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .menu-logo svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .scroll-top > svg, .paraui-v3-vertical-menu-deep > .vertical-menu-list > .scroll-bottom > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content:hover {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-icon > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-arrow > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content, .paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-deep > .footer-expansion > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .footer-expansion > svg:hover {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-deep > .footer-expansion > .version {\n  color: rgba(255, 255, 255, 0.6);\n}\n.paraui-v3-vertical-menu-deep.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink:hover > span {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-deep.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-select > span {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-deep.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-hover > span {\n  background-color: rgb(34, 62, 103);\n}\n\n.paraui-v3-vertical-menu-light {\n  background: linear-gradient(180deg, rgb(241, 241, 244), rgb(243, 243, 243));\n}\n.paraui-v3-vertical-menu-light > .menu-logo {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .menu-logo svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .scroll-top > svg, .paraui-v3-vertical-menu-light > .vertical-menu-list > .scroll-bottom > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content:hover {\n  background-color: white;\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content:hover > .menu-item-icon > svg {\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content:hover > .menu-item-label {\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content:hover > .menu-item-arrow > svg {\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-icon > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-label {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-arrow > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content {\n  background-color: white;\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content:hover > .menu-item-icon > svg, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content:hover > .menu-item-icon > svg {\n  color: rgba(54, 102, 214, 0.8);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content:hover > .menu-item-label, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content:hover > .menu-item-label {\n  color: rgba(54, 102, 214, 0.8);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content:hover > .menu-item-arrow > svg, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content:hover > .menu-item-arrow > svg {\n  color: rgba(54, 102, 214, 0.8);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content > .menu-item-icon > svg, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content > .menu-item-icon > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content > .menu-item-label, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content > .menu-item-label {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content > .menu-item-arrow > svg, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content > .menu-item-arrow > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .footer-expansion > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light > .footer-expansion > svg:hover {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .footer-expansion > .version {\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink:hover > span {\n  background-color: white;\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-select > span {\n  background-color: white;\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-select > span > svg {\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-hover > span {\n  background-color: white;\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-hover > span > svg {\n  color: rgb(28, 41, 60);\n}\n\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  background-color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover {\n  background-color: transparent;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover {\n  background-color: transparent;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  background-color: rgb(28, 41, 60);\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover {\n  background-color: rgba(171, 176, 185, 0.12);\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  background-color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover {\n  background-color: transparent;\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover {\n  background-color: transparent;\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  background-color: white;\n  color: rgb(46, 55, 67);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover {\n  background-color: rgba(171, 176, 185, 0.12);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-icon > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-icon > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-arrow > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-arrow > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg {\n  color: rgb(46, 55, 67);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label {\n  color: rgb(46, 55, 67);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg {\n  color: rgb(46, 55, 67);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-icon > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-icon > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-label {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-arrow > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-arrow > svg {\n  color: rgb(54, 102, 214);\n}";
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n/**\n* @author linhd\n* @date 2022/8/12 5:28 PM\n* @description 全局css前缀\n*/\n.paraui-v3-vertical-menu {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\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}\n.paraui-v3-vertical-menu > .menu-logo {\n  width: 100%;\n  display: inline-block;\n  padding: 24px 16px 0 16px;\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}\n.paraui-v3-vertical-menu > .menu-logo.menu-logo-shrink {\n  padding: 24px 0 0;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list {\n  overflow: hidden;\n  height: 100%;\n  padding: 40px 16px;\n  position: relative;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-top {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 40px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-top > svg {\n  cursor: pointer;\n  transform: rotate(180deg);\n  font-size: 18px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-top > svg:hover {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box {\n  height: 100%;\n  overflow: hidden;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll {\n  transition: all 0.3s;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item {\n  margin-bottom: 8px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item:last-child {\n  margin-bottom: 0;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content {\n  height: 40px;\n  line-height: 40px;\n  cursor: pointer;\n  display: flex;\n  border-radius: 4px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-icon {\n  width: 20px;\n  margin-right: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-icon > svg {\n  font-size: 16px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-label {\n  font-size: 14px;\n  width: 100%;\n  white-space: nowrap;\n  font-weight: 400;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-arrow {\n  width: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-arrow > svg {\n  font-size: 16px;\n  transition: all 0.3s;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-arrow > .opacity-pos-svg {\n  opacity: 0;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .li-collapse > div > div > .vertical-menu-list-item:first-child {\n  margin-top: 8px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-open > .vertical-menu-list-item-content > .menu-item-arrow > svg {\n  transform: rotate(180deg);\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-bottom {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: 40px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-bottom > svg {\n  cursor: pointer;\n  font-size: 18px;\n}\n.paraui-v3-vertical-menu > .vertical-menu-list > .scroll-bottom > svg:hover {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu > .footer-expansion {\n  display: flex;\n  align-items: center;\n  width: 100%;\n  padding-bottom: 20px;\n  white-space: nowrap;\n  height: 40px;\n}\n.paraui-v3-vertical-menu > .footer-expansion > svg {\n  font-size: 20px;\n  cursor: pointer;\n  margin-left: 20px;\n}\n.paraui-v3-vertical-menu > .footer-expansion > .version {\n  margin-left: 12px;\n  font-size: 14px;\n}\n.paraui-v3-vertical-menu > .footer-expansion.footer-expansion-shrink {\n  justify-content: center;\n}\n.paraui-v3-vertical-menu > .footer-expansion.footer-expansion-shrink > svg {\n  margin: 0;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list {\n  padding: 44px 0px;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box {\n  height: 100%;\n  overflow: hidden;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  cursor: pointer;\n  margin-bottom: 8px;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink:last-child {\n  margin-bottom: 0;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink:after {\n  content: \"\";\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  left: 0;\n  top: 0;\n  z-index: 1;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span {\n  width: 40px;\n  height: 40px;\n  line-height: 40px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n}\n.paraui-v3-vertical-menu.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span > svg {\n  position: relative;\n  font-size: 20px;\n}\n\n.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  padding: 0;\n  box-shadow: none;\n}\n.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content {\n  width: auto;\n  height: 32px;\n  line-height: 32px;\n}\n.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon {\n  display: none;\n}\n.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow {\n  display: none;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper {\n  padding-left: 8px;\n  z-index: 1500;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  box-shadow: 0px 2px 8px 0px rgba(171, 176, 185, 0.4);\n  border-radius: 4px;\n  padding: 8px 0;\n  max-height: 268px;\n  overflow-y: auto;\n  overflow-x: hidden;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item {\n  position: relative;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content {\n  width: 200px;\n  height: 36px;\n  line-height: 36px;\n  padding: 0px 12px;\n  display: flex;\n  cursor: pointer;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:after, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:after {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  z-index: 1;\n  content: \"\";\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon {\n  width: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin-right: 12px;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg {\n  font-size: 20px;\n  position: relative;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg:after, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg:after {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  content: \"\";\n  z-index: 1;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label {\n  font-size: 14px;\n  width: 100%;\n  font-weight: 400;\n  white-space: nowrap;\n  text-align: left;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow {\n  width: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg {\n  font-size: 20px;\n  transition: all 0.3s;\n  position: relative;\n  transform: rotate(270deg);\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg:after, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg:after {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  content: \"\";\n  z-index: 1;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > .opacity-pos-svg, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > .opacity-pos-svg {\n  opacity: 0;\n}\n.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item .vertical-menu-item-popper, .paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item .vertical-menu-item-popper {\n  position: absolute;\n  transform: none !important;\n  left: 100% !important;\n  top: -8px;\n}\n\n.paraui-v3-vertical-menu-deep {\n  background-color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-deep > .menu-logo {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .menu-logo svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .scroll-top > svg, .paraui-v3-vertical-menu-deep > .vertical-menu-list > .scroll-bottom > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content:hover {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-icon > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-arrow > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content, .paraui-v3-vertical-menu-deep > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-deep > .footer-expansion > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep > .footer-expansion > svg:hover {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-deep > .footer-expansion > .version {\n  color: rgba(255, 255, 255, 0.6);\n}\n.paraui-v3-vertical-menu-deep.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink:hover > span {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-deep.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-deep.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-select > span {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-deep.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-hover > span {\n  background-color: rgb(34, 62, 103);\n}\n\n.paraui-v3-vertical-menu-light {\n  background: linear-gradient(180deg, rgb(241, 241, 244), rgb(243, 243, 243));\n}\n.paraui-v3-vertical-menu-light > .menu-logo {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .menu-logo svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .scroll-top > svg, .paraui-v3-vertical-menu-light > .vertical-menu-list > .scroll-bottom > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content:hover {\n  background-color: white;\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content:hover > .menu-item-icon > svg {\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content:hover > .menu-item-label {\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content:hover > .menu-item-arrow > svg {\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-icon > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-label {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item > .vertical-menu-list-item-content > .menu-item-arrow > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content {\n  background-color: white;\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content:hover > .menu-item-icon > svg, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content:hover > .menu-item-icon > svg {\n  color: rgba(54, 102, 214, 0.8);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content:hover > .menu-item-label, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content:hover > .menu-item-label {\n  color: rgba(54, 102, 214, 0.8);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content:hover > .menu-item-arrow > svg, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content:hover > .menu-item-arrow > svg {\n  color: rgba(54, 102, 214, 0.8);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content > .menu-item-icon > svg, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content > .menu-item-icon > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content > .menu-item-label, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content > .menu-item-label {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-last > .vertical-menu-list-item-content > .menu-item-arrow > svg, .paraui-v3-vertical-menu-light > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item.vertical-menu-list-item-select-retract > .vertical-menu-list-item-content > .menu-item-arrow > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .footer-expansion > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light > .footer-expansion > svg:hover {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-light > .footer-expansion > .version {\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink:hover > span {\n  background-color: white;\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink > span > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-select > span {\n  background-color: white;\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-select > span > svg {\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-hover > span {\n  background-color: white;\n  color: rgb(28, 41, 60);\n}\n.paraui-v3-vertical-menu-light.paraui-v3-vertical-menu-shrink > .vertical-menu-list > .vertical-menu-list-box > .vertical-menu-list-box-srcoll .vertical-menu-list-item-shrink.vertical-menu-list-item-shrink-hover > span > svg {\n  color: rgb(28, 41, 60);\n}\n\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  background-color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover {\n  background-color: transparent;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover {\n  background-color: transparent;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  background-color: rgb(28, 41, 60);\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content, .paraui-v3-vertical-menu-item-popper-deep.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content {\n  background-color: rgb(34, 62, 103);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  background-color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover {\n  background-color: transparent;\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label {\n  color: white;\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper-tooltip.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content.menu-item-popper-content-item-hover {\n  background-color: transparent;\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content {\n  background-color: white;\n  color: rgb(46, 55, 67);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover {\n  background-color: rgba(171, 176, 185, 0.12);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-icon > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-icon > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-label {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-arrow > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content:hover > .menu-item-arrow > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-icon > svg {\n  color: rgb(46, 55, 67);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-label {\n  color: rgb(46, 55, 67);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item > .menu-item-popper-content-item-content > .menu-item-arrow > svg {\n  color: rgb(46, 55, 67);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-icon > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-icon > svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-label, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-label {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper .paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-arrow > svg, .paraui-v3-vertical-menu-item-popper-light.paraui-v3-vertical-menu-item-popper.paraui-v3-vertical-menu-item-popper > .menu-item-popper-content > .menu-item-popper-content-item.menu-item-popper-content-item-select > .menu-item-popper-content-item-content > .menu-item-arrow > svg {\n  color: rgb(54, 102, 214);\n}";
 styleInject(css_248z);
 
 var Menu = function Menu(props) {

package/MultiBox/index.d.ts

@@ -20,6 +20,8 @@ export interface MultiBoxProps extends HelperTextDetailProps {
     style?: React.CSSProperties;
     /** 大小 */
     size?: 'small' | 'medium' | 'large';
+    /** 中间符号 */
+    separator?: ReactNode;
     /** 标题 */
     label?: ReactNode;
     /** 帮组提示信息 */
@@ -40,12 +42,17 @@ export interface MultiBoxProps extends HelperTextDetailProps {
     value?: any[];
     /** 替换字段 */
     replaceFields?: ReplaceFieldsProps;
+    /** 没有错误的时候,不渲染 */
+    hideErrorDom?: boolean;
+    /** 错误提示 */
+    helperText?: ReactNode | Record<string, ReactNode>[];
     /** 改变值 */
     onChange?: (val: any[]) => void;
     /** 键值索引匹配 */
     fetchSuggestionsKey?: (val: string, cb: (data: any[]) => void) => void;
     /** 值索引匹配 */
     fetchSuggestionsValue?: (val: string, cb: (data: any[]) => void) => void;
+    [name: string]: any;
 }
 export declare const MultiBox: FunctionComponent<MultiBoxProps>;
 export default MultiBox;

package/MultiBox/index.js

@@ -6,9 +6,10 @@ import { useState, useEffect } from 'react';
 import { TextField } from '../TextField/index.js';
 import Label from '../Label/index.js';
 import HelperText from '../HelperText/index.js';
-import Plus from '@para-ui/icons/Plus';
 import Delete from '@para-ui/icons/Delete';
+import PlusCircleF from '@para-ui/icons/PlusCircleF';
 import { $ as $prefixCls } from '../_verture/constant-bf34e6fa.js';
+import { u as useFormatMessage } from '../_verture/useFormatMessage-f4452258.js';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
 import '../_verture/tslib.es6-55ed4bd2.js';
 import '@paraview/lib';
@@ -30,7 +31,20 @@ import '../_verture/usePopupContainer-874d101b.js';
 import '../Help/index.js';
 import '@para-ui/icons/Help';
 
-var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n/**\n* @author linhd\n* @date 2022/8/12 5:28 PM\n* @description 全局css前缀\n*/\n.paraui-v3-multi-box {\n  display: inline-block;\n  width: 100%;\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}\n.paraui-v3-multi-box > .multi-box-content {\n  line-height: 0;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item {\n  padding-bottom: 15px;\n  display: flex;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input {\n  width: calc(100% - 30px);\n  display: flex;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > .multi-box-text-field {\n  width: calc(50% - 10px);\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > span {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .single-box-content-item-svg {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 30px;\n  cursor: pointer;\n}\n.paraui-v3-multi-box > .multi-box-add {\n  text-align: center;\n  border: 1px dashed;\n  border-color: rgba(171, 176, 185, 0.4);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 4px;\n  cursor: pointer;\n  background-color: rgb(255, 255, 255);\n}\n.paraui-v3-multi-box > .multi-box-add > svg {\n  font-size: 24px;\n}\n.paraui-v3-multi-box > .multi-box-add:hover {\n  border-color: rgb(54, 102, 214);\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-small > .multi-box-add {\n  height: 28px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-medium > .multi-box-add {\n  height: 32px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-large > .multi-box-add {\n  height: 36px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-content > .multi-box-content-item > .single-box-content-item-svg {\n  cursor: not-allowed;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-content > .multi-box-content-item > .single-box-content-item-svg > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-add {\n  border-color: rgba(171, 176, 185, 0.4);\n  cursor: not-allowed;\n  background-color: rgba(171, 176, 185, 0.12);\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-add > svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-add:hover {\n  border-color: rgba(171, 176, 185, 0.4);\n  color: rgba(46, 55, 67, 0.7);\n}";
+var en = {
+  add: 'Newly Added'
+};
+
+var zh = {
+  add: '新增'
+};
+
+var localeJson = {
+  zh: zh,
+  en: en
+};
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n/**\n* @author linhd\n* @date 2022/8/12 5:28 PM\n* @description 全局css前缀\n*/\n.paraui-v3-multi-box {\n  width: 100%;\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}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item {\n  display: flex;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input {\n  flex: 1;\n  display: flex;\n  align-items: center;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > .multi-box-text-field:first-child {\n  margin-right: 12px;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > .multi-box-text-field {\n  flex: 1;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > .multi-box-separator {\n  padding-bottom: 20px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100%;\n  margin: 0 12px;\n  line-height: 1;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .opera-box {\n  display: flex;\n  align-items: center;\n  margin-left: 12px;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .opera-box > .del-box {\n  cursor: pointer;\n  border-radius: 4px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .opera-box > .del-box:hover {\n  background-color: rgba(171, 176, 185, 0.12);\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .opera-box > .del-box:hover svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .opera-box > .del-box svg {\n  font-size: 24px;\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-multi-box > .multi-box-add {\n  text-align: center;\n  border: 1px dashed;\n  border-color: rgba(171, 176, 185, 0.4);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 4px;\n  cursor: pointer;\n  background-color: rgba(171, 176, 185, 0.12);\n  color: rgb(54, 102, 214);\n  font-size: 14px;\n}\n.paraui-v3-multi-box > .multi-box-add > svg {\n  font-size: 16px;\n  color: rgb(54, 102, 214);\n  margin-right: 8px;\n}\n.paraui-v3-multi-box > .multi-box-add:hover {\n  border-color: rgba(54, 102, 214, 0.4);\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-separator > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > .multi-box-text-field:first-child {\n  margin-right: 0;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-small > .multi-box-add {\n  height: 28px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-small > .multi-box-content > .multi-box-content-item > .opera-box {\n  height: 28px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-small > .multi-box-content > .multi-box-content-item > .opera-box > .del-box {\n  width: 28px;\n  height: 28px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-medium > .multi-box-add {\n  height: 32px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-medium > .multi-box-content > .multi-box-content-item > .opera-box {\n  height: 32px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-medium > .multi-box-content > .multi-box-content-item > .opera-box > .del-box {\n  width: 32px;\n  height: 32px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-large > .multi-box-add {\n  height: 36px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-large > .multi-box-content > .multi-box-content-item > .opera-box {\n  height: 36px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-large > .multi-box-content > .multi-box-content-item > .opera-box > .del-box {\n  width: 36px;\n  height: 36px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-content > .multi-box-content-item > .opera-box > .del-box {\n  cursor: not-allowed;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-content > .multi-box-content-item > .opera-box > .del-box:hover {\n  background-color: transparent;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-content > .multi-box-content-item > .opera-box > .del-box:hover svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-content > .multi-box-content-item > .opera-box > .del-box svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-add {\n  border-color: rgba(171, 176, 185, 0.4);\n  cursor: not-allowed;\n  background-color: rgba(171, 176, 185, 0.12);\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-add > svg {\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-add:hover {\n  border-color: rgba(171, 176, 185, 0.4);\n  color: rgba(46, 55, 67, 0.4);\n}";
 styleInject(css_248z);
 
 var MultiBox = function MultiBox(props) {
@@ -53,6 +67,8 @@ var MultiBox = function MultiBox(props) {
       _props$error = props.error,
       error = _props$error === void 0 ? false : _props$error,
       hideErrorDom = props.hideErrorDom,
+      _props$separator = props.separator,
+      separator = _props$separator === void 0 ? ':' : _props$separator,
       _props$helperText = props.helperText,
       helperText = _props$helperText === void 0 ? '' : _props$helperText,
       value = props.value,
@@ -60,6 +76,9 @@ var MultiBox = function MultiBox(props) {
       onChange = props.onChange,
       fetchSuggestionsKey = props.fetchSuggestionsKey,
       fetchSuggestionsValue = props.fetchSuggestionsValue;
+  var isError = helperText && typeof helperText === 'string' ? true : false;
+  var isErrorArr = helperText instanceof Array;
+  var intl = useFormatMessage('MultiBox', localeJson);
 
   var _useState = useState([]),
       _useState2 = _slicedToArray(_useState, 2),
@@ -86,8 +105,30 @@ var MultiBox = function MultiBox(props) {
       setReplaceFieldsCom(json);
     }
   }, [replaceFields]);
+  /** 处理错误 */
+
+  var handError = function handError(index, name) {
+    var obj = {
+      error: false,
+      helperText: ''
+    };
+
+    if (isErrorArr) {
+      var errorItem = helperText[index];
+
+      if (errorItem && errorItem[name]) {
+        obj = {
+          error: true,
+          helperText: errorItem[name]
+        };
+      }
+    }
+
+    return obj;
+  };
   /** 增加 */
 
+
   var add = function add() {
     if (disabled) return;
     valueCom.push({});
@@ -141,6 +182,65 @@ var MultiBox = function MultiBox(props) {
       className: handLabelClass()
     }));
   };
+  /** 处理内容每一项 */
+
+
+  var handContentItem = function handContentItem(item, index) {
+    return jsxs("div", Object.assign({
+      className: "multi-box-content-item-input"
+    }, {
+      children: [jsx(TextField, Object.assign({
+        className: 'multi-box-text-field',
+        size: size,
+        disabled: disabled,
+        placeholder: placeholderKey,
+        value: item[replaceFieldsCom.key || '']
+      }, handError(index, replaceFieldsCom.key || ''), {
+        onChange: changeValue(replaceFieldsCom.key || '', index),
+        fetchSuggestions: fetchSuggestionsKey ? fetchSuggestions('key') : undefined,
+        onSelect: selectValue(replaceFieldsCom.key || '', index)
+      })), separator && jsx("span", Object.assign({
+        className: 'multi-box-separator'
+      }, {
+        children: separator
+      })), jsx(TextField, Object.assign({
+        className: 'multi-box-text-field',
+        size: size,
+        disabled: disabled,
+        placeholder: placeholderValue,
+        value: item[replaceFieldsCom.value || '']
+      }, handError(index, replaceFieldsCom.value || ''), {
+        onChange: changeValue(replaceFieldsCom.value || '', index),
+        fetchSuggestions: fetchSuggestionsValue ? fetchSuggestions('value') : undefined,
+        onSelect: selectValue(replaceFieldsCom.value || '', index)
+      }))]
+    }));
+  };
+  /** 处理内容 */
+
+
+  var handContent = function handContent() {
+    return jsx("div", Object.assign({
+      className: "multi-box-content"
+    }, {
+      children: valueCom.map(function (item, index) {
+        return jsxs("div", Object.assign({
+          className: "multi-box-content-item"
+        }, {
+          children: [handContentItem(item, index), jsx("div", Object.assign({
+            className: "opera-box"
+          }, {
+            children: jsx("span", Object.assign({
+              className: "del-box",
+              onClick: del(index)
+            }, {
+              children: jsx(Delete, {})
+            }))
+          }))]
+        }), index);
+      })
+    }));
+  };
   /** 模糊匹配 */
 
 
@@ -173,6 +273,7 @@ var MultiBox = function MultiBox(props) {
     if (size) str += " ".concat($prefixCls, "-multi-box-").concat(size);
     if (error) str += " ".concat($prefixCls, "-multi-box-error");
     if (disabled) str += " ".concat($prefixCls, "-multi-box-disabled");
+    if (separator) str += " ".concat($prefixCls, "-multi-box-separator");
     return str;
   };
 
@@ -180,57 +281,19 @@ var MultiBox = function MultiBox(props) {
     className: handClass(),
     style: style
   }, {
-    children: [handLabel(), jsx("div", Object.assign({
-      className: "multi-box-content"
-    }, {
-      children: valueCom.map(function (item, index) {
-        return jsxs("div", Object.assign({
-          className: "multi-box-content-item"
-        }, {
-          children: [jsxs("div", Object.assign({
-            className: "multi-box-content-item-input"
-          }, {
-            children: [jsx(TextField, {
-              className: 'multi-box-text-field',
-              size: size,
-              disabled: disabled,
-              placeholder: placeholderKey,
-              value: item[replaceFieldsCom.key || ''],
-              hideErrorDom: true,
-              onChange: changeValue(replaceFieldsCom.key || '', index),
-              fetchSuggestions: fetchSuggestionsKey ? fetchSuggestions('key') : undefined,
-              onSelect: selectValue(replaceFieldsCom.key || '', index)
-            }), jsx("span", {
-              children: ":"
-            }), jsx(TextField, {
-              className: 'multi-box-text-field',
-              size: size,
-              disabled: disabled,
-              placeholder: placeholderValue,
-              value: item[replaceFieldsCom.value || ''],
-              hideErrorDom: true,
-              onChange: changeValue(replaceFieldsCom.value || '', index),
-              fetchSuggestions: fetchSuggestionsValue ? fetchSuggestions('value') : undefined,
-              onSelect: selectValue(replaceFieldsCom.value || '', index)
-            })]
-          })), jsx("span", Object.assign({
-            className: "single-box-content-item-svg"
-          }, {
-            children: jsx(Delete, {
-              onClick: del(index)
-            })
-          }))]
-        }), index);
-      })
-    })), jsx("div", Object.assign({
+    children: [handLabel(), handContent(), jsxs("div", Object.assign({
       className: "multi-box-add",
       onClick: add
     }, {
-      children: jsx(Plus, {})
+      children: [jsx(PlusCircleF, {}), jsx("span", {
+        children: intl({
+          id: 'add'
+        })
+      })]
     })), jsx(HelperText, {
       className: "multi-box-error-text",
-      error: error,
-      helperText: helperText,
+      error: isError,
+      helperText: isError ? helperText : undefined,
       hideErrorDom: hideErrorDom
     })]
   }));

package/MultiBox/lang/en_US.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    add: string;
+};
+export default _default;

package/MultiBox/lang/index.d.ts

@@ -0,0 +1,9 @@
+declare const _default: {
+    zh: {
+        add: string;
+    };
+    en: {
+        add: string;
+    };
+};
+export default _default;

package/MultiBox/lang/zh_CN.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    add: string;
+};
+export default _default;