@para-ui/core 4.0.0-rc.4 → 4.0.0-rc.6

package/TimePicker/index.js

@@ -5,32 +5,31 @@ import DatePicker from '../DatePicker/index.js';
 import { Tooltip } from '../Tooltip/index.js';
 import 'rc-picker/es/generate/dayjs';
 import '../Button/index.js';
-import '../_verture/typeof-adeedc13.js';
-import '../_verture/slicedToArray-a8206399.js';
-import '../_verture/unsupportedIterableToArray-cb478f24.js';
 import 'clsx';
 import '@para-ui/icons/LoadingF';
 import '@para-ui/icons/Down';
-import '../_verture/constant-0d9802f7.js';
+import '../_verture/constant-5317fc89.js';
 import '../_verture/style-inject.es-300983ab.js';
-import '../_verture/index-e9007d6a.js';
+import '../_verture/index-da9097d3.js';
 import 'rc-dropdown';
-import '../_verture/usePopupContainer-87febeb9.js';
+import '../_verture/usePopupContainer-635f66f4.js';
 import 'dayjs';
 import '@paraview/lib';
-import '../_verture/useFormatMessage-703f8b20.js';
+import '../_verture/useFormatMessage-eb13cf56.js';
 import '@para-ui/core/GlobalContext';
 import '../AutoTips/index.js';
 import 'rc-tooltip';
 import 'rc-tooltip/lib/placements';
 import '@para-ui/icons/Forbid';
 import '../Tag/index.js';
-import '../_verture/defineProperty-1d116156.js';
 import '@para-ui/icons/Close';
 import '@para-ui/icons/EditOutline';
-import '../_verture/toConsumableArray-8f4c9589.js';
+import '../_verture/toConsumableArray-c7a8028f.js';
+import '../_verture/slicedToArray-75fa4188.js';
+import '../_verture/typeof-adeedc13.js';
 import '../_verture/tinycolor-ece3542d.js';
 import '@para-ui/icons/Plus';
+import '../_verture/defineProperty-1d116156.js';
 import 'rc-picker';
 import '@para-ui/icons/CloseCircleF';
 import '@para-ui/icons/Calendar';
@@ -43,25 +42,27 @@ import '@para-ui/icons/Help';
 import '../HelperText/index.js';
 import '@para-ui/icons/SortRight';
 
-var InternalTimePicker = DatePicker.TimePicker,
-  InternalRangePicker = DatePicker.RangePicker;
+const {
+  TimePicker: InternalTimePicker,
+  RangePicker: InternalRangePicker
+} = DatePicker;
 //time range
-var RangePicker = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
-  return jsx(InternalRangePicker, Object.assign({}, props, {
-    dropdownClassName: props.popupClassName,
-    picker: "time",
-    mode: undefined,
-    ref: ref
-  }));
-});
-var TimePicker = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
-  var addon = props.addon,
-    renderExtraFooter = props.renderExtraFooter,
-    popupClassName = props.popupClassName,
-    disabled = props.disabled,
-    disabledTooltip = props.disabledTooltip,
+const RangePicker = /*#__PURE__*/React__default.forwardRef((props, ref) => jsx(InternalRangePicker, Object.assign({}, props, {
+  dropdownClassName: props.popupClassName,
+  picker: "time",
+  mode: undefined,
+  ref: ref
+})));
+const TimePicker = /*#__PURE__*/React__default.forwardRef((props, ref) => {
+  const {
+      addon,
+      renderExtraFooter,
+      popupClassName,
+      disabled,
+      disabledTooltip
+    } = props,
     restProps = __rest(props, ["addon", "renderExtraFooter", "popupClassName", "disabled", "disabledTooltip"]);
-  var internalRenderExtraFooter = React__default.useMemo(function () {
+  const internalRenderExtraFooter = React__default.useMemo(() => {
     if (renderExtraFooter) {
       return renderExtraFooter;
     }
@@ -70,8 +71,8 @@ var TimePicker = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
     }
     return undefined;
   }, [addon, renderExtraFooter]);
-  var renderPicker = function renderPicker() {
-    var component = jsx(InternalTimePicker, Object.assign({}, restProps, {
+  const renderPicker = () => {
+    const component = jsx(InternalTimePicker, Object.assign({}, restProps, {
       disabled: disabled,
       picker: "time",
       dropdownClassName: popupClassName,

package/Timeline/index.js

@@ -1,15 +1,14 @@
-import { _ as _defineProperty } from '../_verture/defineProperty-1d116156.js';
 import { _ as __rest } from '../_verture/tslib.es6-55ed4bd2.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React__default from 'react';
 import clsx from 'clsx';
-import { a as $rcPrefixCls, $ as $prefixCls } from '../_verture/constant-0d9802f7.js';
+import { _ as _defineProperty } from '../_verture/defineProperty-1d116156.js';
+import { a as $rcPrefixCls, $ as $prefixCls } from '../_verture/constant-5317fc89.js';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
 import '../_verture/typeof-adeedc13.js';
 
 //TimelineItem
 var TimelineItem = function TimelineItem(props) {
-  var _clsx, _clsx2;
   var className = props.className,
     color = props.color,
     dot = props.dot,
@@ -21,9 +20,9 @@ var TimelineItem = function TimelineItem(props) {
     restProps = __rest(props, ["className", "color", "dot", "pending", "position", "label", "children"]);
   var prefixCls = "".concat($rcPrefixCls, "-timeline");
   //item cls
-  var itemClassName = clsx((_clsx = {}, _defineProperty(_clsx, "".concat(prefixCls, "-item"), true), _defineProperty(_clsx, "".concat(prefixCls, "-item-pending"), pending), _clsx), className);
+  var itemClassName = clsx(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-item"), true), "".concat(prefixCls, "-item-pending"), pending), className);
   //dot cls
-  var dotClassName = clsx((_clsx2 = {}, _defineProperty(_clsx2, "".concat(prefixCls, "-item-head"), true), _defineProperty(_clsx2, "".concat(prefixCls, "-item-head-custom"), !!dot), _defineProperty(_clsx2, "".concat(prefixCls, "-item-head-").concat(color), color), _clsx2));
+  var dotClassName = clsx(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-item-head"), true), "".concat(prefixCls, "-item-head-custom"), !!dot), "".concat(prefixCls, "-item-head-").concat(color), color));
   return jsxs("li", Object.assign({}, restProps, {
     className: itemClassName
   }, {
@@ -53,38 +52,36 @@ var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/6/9 下
 styleInject(css_248z);
 
 //Timeline
-var Timeline = function Timeline(props) {
-  var _clsx;
-  var _props$pending = props.pending,
-    pending = _props$pending === void 0 ? null : _props$pending,
-    pendingDot = props.pendingDot,
-    children = props.children,
-    className = props.className,
-    _props$reverse = props.reverse,
-    reverse = _props$reverse === void 0 ? false : _props$reverse,
-    _props$mode = props.mode,
-    mode = _props$mode === void 0 ? 'left' : _props$mode,
-    align = props.align,
-    data = props.data,
+const Timeline = props => {
+  const {
+      pending = null,
+      pendingDot,
+      children,
+      className,
+      reverse = false,
+      mode = 'left',
+      align,
+      data
+    } = props,
     restProps = __rest(props, ["pending", "pendingDot", "children", "className", "reverse", "mode", "align", "data"]);
-  var prefixCls = "".concat($prefixCls, "-timeline");
-  var innerMode = align !== null && align !== void 0 ? align : mode; //时间轴和内容相对位置
-  var pendingNode = typeof pending === 'boolean' ? null : pending; //是否有幽灵节点
+  const prefixCls = "".concat($prefixCls, "-timeline");
+  const innerMode = align !== null && align !== void 0 ? align : mode; //时间轴和内容相对位置
+  const pendingNode = typeof pending === 'boolean' ? null : pending; //是否有幽灵节点
   //pending节点项
-  var pendingItem = pending ? jsx(TimelineItem, Object.assign({
+  const pendingItem = pending ? jsx(TimelineItem, Object.assign({
     pending: !!pending,
     dot: pendingDot
   }, {
     children: pendingNode
   })) : null;
-  var timeLineItems = React__default.Children.toArray(children);
+  const timeLineItems = React__default.Children.toArray(children);
   timeLineItems.push(pendingItem);
   if (reverse) {
     //取反
     timeLineItems.reverse();
   }
   //position cls
-  var getPositionCls = function getPositionCls(ele, idx) {
+  const getPositionCls = (ele, idx) => {
     var _a, _b, _c;
     if (innerMode === 'alternate') {
       if (((_a = ele === null || ele === void 0 ? void 0 : ele.props) === null || _a === void 0 ? void 0 : _a.position) === 'right') return "".concat($rcPrefixCls, "-timeline-item-right");
@@ -98,43 +95,49 @@ var Timeline = function Timeline(props) {
     return '';
   };
   //实际渲染项
-  var truthyItems = timeLineItems.filter(function (item) {
-    return !!item;
-  });
-  var itemsCount = React__default.Children.count(truthyItems);
-  var lastCls = "".concat($rcPrefixCls, "-timeline-item-last");
-  var items = React__default.Children.map(truthyItems, function (ele, idx) {
-    var pendingClass = idx === itemsCount - 2 ? lastCls : '';
-    var readyClass = idx === itemsCount - 1 ? lastCls : '';
+  const truthyItems = timeLineItems.filter(item => !!item);
+  const itemsCount = React__default.Children.count(truthyItems);
+  const lastCls = "".concat($rcPrefixCls, "-timeline-item-last");
+  const items = React__default.Children.map(truthyItems, (ele, idx) => {
+    const pendingClass = idx === itemsCount - 2 ? lastCls : '';
+    const readyClass = idx === itemsCount - 1 ? lastCls : '';
     return /*#__PURE__*/React__default.cloneElement(ele, {
       className: clsx([ele.props.className, !reverse && !!pending ? pendingClass : readyClass, getPositionCls(ele, idx)])
     });
   });
   //label
-  var hasLabelItem = timeLineItems.some(function (item) {
+  const hasLabelItem = timeLineItems.some(item => {
     var _a;
     return !!((_a = item === null || item === void 0 ? void 0 : item.props) === null || _a === void 0 ? void 0 : _a.label);
   });
   //classname
-  var makeCls = clsx(prefixCls, (_clsx = {}, _defineProperty(_clsx, "".concat(prefixCls, "-pending"), !!pending), _defineProperty(_clsx, "".concat(prefixCls, "-reverse"), !!reverse), _defineProperty(_clsx, "".concat(prefixCls, "-").concat(innerMode), !!innerMode && !hasLabelItem), _defineProperty(_clsx, "".concat(prefixCls, "-label"), hasLabelItem), _clsx), className);
+  const makeCls = clsx(prefixCls, {
+    ["".concat(prefixCls, "-pending")]: !!pending,
+    ["".concat(prefixCls, "-reverse")]: !!reverse,
+    ["".concat(prefixCls, "-").concat(innerMode)]: !!innerMode && !hasLabelItem,
+    ["".concat(prefixCls, "-label")]: hasLabelItem
+  }, className);
   //渲染items
-  var renderItems = function renderItems() {
+  const renderItems = () => {
     if (!(data === null || data === void 0 ? void 0 : data.length)) return items;
-    var itemsCount = data.length;
-    var lastCls = "".concat($rcPrefixCls, "-timeline-item-last");
-    return data.map(function (item, idx) {
-      var dotIcon = item.dotIcon,
-        content = item.content,
-        _item$disabled = item.disabled,
-        disabled = _item$disabled === void 0 ? false : _item$disabled,
-        className = item.className,
-        label = item.label;
-      var pendingClass = idx === itemsCount - 2 ? lastCls : '';
-      var readyClass = idx === itemsCount - 1 ? lastCls : '';
+    const itemsCount = data.length;
+    const lastCls = "".concat($rcPrefixCls, "-timeline-item-last");
+    return data.map((item, idx) => {
+      const {
+        dotIcon,
+        content,
+        disabled = false,
+        className,
+        label
+      } = item;
+      const pendingClass = idx === itemsCount - 2 ? lastCls : '';
+      const readyClass = idx === itemsCount - 1 ? lastCls : '';
       return jsx(TimelineItem, Object.assign({
         label: innerMode === 'double' && label,
         dot: dotIcon,
-        className: clsx([className, _defineProperty({}, "".concat($rcPrefixCls, "-timeline-item-disabled"), disabled), !reverse && !!pending ? pendingClass : readyClass, getPositionCls(null, idx)])
+        className: clsx([className, {
+          ["".concat($rcPrefixCls, "-timeline-item-disabled")]: disabled
+        }, !reverse && !!pending ? pendingClass : readyClass, getPositionCls(null, idx)])
       }, {
         children: content
       }), idx);

package/Title/index.js

@@ -1,13 +1,11 @@
-import { _ as _slicedToArray } from '../_verture/slicedToArray-a8206399.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useRef, useState, useEffect } from 'react';
 import clsx from 'clsx';
 import AutoTips from '../AutoTips/index.js';
-import { $ as $prefixCls } from '../_verture/constant-0d9802f7.js';
+import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
 import Help from '../Help/index.js';
 import { Collapse } from '../Collapse/index.js';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
-import '../_verture/unsupportedIterableToArray-cb478f24.js';
 import '../Tooltip/index.js';
 import '../_verture/tslib.es6-55ed4bd2.js';
 import 'rc-tooltip';
@@ -21,46 +19,46 @@ import '@para-ui/icons/Right';
 var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/8/11 2:55 PM\n* @description 标题\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-title-collapse {\n  border-bottom: none;\n}\n.paraui-v4-title-collapse > .component-collapse-item {\n  border-top: none;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header {\n  flex-direction: row-reverse;\n  justify-content: space-between;\n  padding: 0;\n  padding-right: 16px;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header .paraui-v4-title-content {\n  max-width: calc(100% - 32px);\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header .collapse-svg-box {\n  color: rgb(92, 101, 115);\n  margin-right: 0;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header:hover {\n  position: relative;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header:hover > div {\n  z-index: 1;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header:hover > .collapse-svg-box:hover svg {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header:hover .title-link:hover {\n  color: rgb(87, 131, 235);\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-header:hover::after {\n  position: absolute;\n  background-color: rgb(247, 248, 250);\n  content: \"\";\n  width: 100%;\n  height: calc(100% + 4px);\n  left: -10px;\n  border-radius: 4px;\n}\n.paraui-v4-title-collapse > .component-collapse-item > .component-collapse-content > .component-collapse-content-box {\n  padding-left: 0px;\n  padding-right: 0px;\n  padding-bottom: 0;\n}\n\n.paraui-v4-title .paraui-v4-title-content {\n  display: flex;\n  align-items: center;\n  line-height: 20px;\n}\n.paraui-v4-title .paraui-v4-title-content .title-ink {\n  width: 4px;\n  height: 14px;\n  background-color: rgb(46, 101, 230);\n  border-radius: 2px;\n}\n.paraui-v4-title .paraui-v4-title-content .title-icon {\n  display: inline-flex;\n}\n.paraui-v4-title .paraui-v4-title-content .title-text {\n  margin-left: 8px;\n  font-size: 14px;\n  font-weight: 700;\n  color: rgb(29, 33, 38);\n  display: flex;\n  align-items: center;\n  white-space: nowrap;\n}\n.paraui-v4-title .paraui-v4-title-content .title-text .paraui-v4-help {\n  line-height: 11px;\n  font-size: 14px;\n  margin-left: 4px;\n}\n.paraui-v4-title .paraui-v4-title-content .title-subtext {\n  margin-left: 10px;\n  font-size: 14px;\n  font-weight: 400;\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-title .paraui-v4-title-content .title-link {\n  margin-left: 10px;\n  text-decoration: none;\n  outline: none;\n  font-size: 14px;\n  font-weight: 400;\n  white-space: nowrap;\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-title .paraui-v4-title-content .title-link:hover {\n  color: rgb(87, 131, 235);\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-large .title-icon svg {\n  font-size: 30px;\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-large .title-text {\n  font-size: 18px;\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-medium .title-icon svg {\n  font-size: 24px;\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-medium .title-text {\n  font-size: 16px;\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-small .title-icon svg {\n  font-size: 20px;\n}\n.paraui-v4-title .paraui-v4-title-content.paraui-v4-title-content-small .title-text {\n  margin-left: 4px;\n}";
 styleInject(css_248z);
 
-var Panel = Collapse.Panel;
-var MARGIN_WIDTH = 20 + 12;
+const {
+  Panel
+} = Collapse;
+const MARGIN_WIDTH = 20 + 12;
 //标题
-var Title = function Title(props) {
-  var title = props.title,
-    subTitle = props.subTitle,
-    collapseContent = props.collapseContent,
-    icon = props.icon,
-    link = props.link,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 'medium' : _props$size,
-    className = props.className,
-    collapseClassName = props.collapseClassName,
-    titleTooltip = props.titleTooltip,
-    titoleTooltipIcon = props.titoleTooltipIcon,
-    placement = props.placement,
-    arrow = props.arrow,
-    style = props.style;
-  var titleTextRef = useRef(null);
-  var linkTextRef = useRef(null);
-  var _useState = useState('calc(100% - 20px)'),
-    _useState2 = _slicedToArray(_useState, 2),
-    descWith = _useState2[0],
-    setDescWith = _useState2[1];
+const Title = props => {
+  const {
+    title,
+    subTitle,
+    collapseContent,
+    icon,
+    link,
+    size = 'medium',
+    className,
+    collapseClassName,
+    titleTooltip,
+    titoleTooltipIcon,
+    placement,
+    arrow,
+    style
+  } = props;
+  const titleTextRef = useRef(null);
+  const linkTextRef = useRef(null);
+  const [descWith, setDescWith] = useState('calc(100% - 20px)');
   //cls
-  var makeCls = clsx("".concat($prefixCls, "-title-content"), className, icon && "".concat($prefixCls, "-title-content-").concat(size));
-  var calcDescWidth = function calcDescWidth(titleWidth, linkWidth) {
-    var width = titleWidth + linkWidth + MARGIN_WIDTH;
+  const makeCls = clsx("".concat($prefixCls, "-title-content"), className, icon && "".concat($prefixCls, "-title-content-").concat(size));
+  const calcDescWidth = (titleWidth, linkWidth) => {
+    const width = titleWidth + linkWidth + MARGIN_WIDTH;
     setDescWith("calc(100% - ".concat(width, "px)"));
   };
-  useEffect(function () {
+  useEffect(() => {
     var _a, _b;
-    var titleWidth = ((_a = titleTextRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 0;
-    var linkWidth = ((_b = linkTextRef.current) === null || _b === void 0 ? void 0 : _b.offsetWidth) || 0;
+    const titleWidth = ((_a = titleTextRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 0;
+    const linkWidth = ((_b = linkTextRef.current) === null || _b === void 0 ? void 0 : _b.offsetWidth) || 0;
     calcDescWidth(titleWidth, linkWidth);
   }, [title, subTitle, link, collapseContent]);
-  var cloCls = function cloCls() {
+  const cloCls = () => {
     return clsx("".concat($prefixCls, "-title-collapse"), collapseClassName);
   };
-  var titleContent = function titleContent() {
+  const titleContent = () => {
     return jsxs("div", Object.assign({
       className: makeCls,
       style: style

package/ToggleButton/index.js

@@ -1,28 +1,26 @@
-import { _ as _defineProperty } from '../_verture/defineProperty-1d116156.js';
 import { _ as __rest } from '../_verture/tslib.es6-55ed4bd2.js';
 import { jsx } from 'react/jsx-runtime';
 import { useRef } from 'react';
 import { Button } from '../Button/index.js';
+import { _ as _defineProperty } from '../_verture/defineProperty-1d116156.js';
 import { UUID } from '@paraview/lib';
 import clsx from 'clsx';
-import { $ as $prefixCls } from '../_verture/constant-0d9802f7.js';
+import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
 import AutoTips from '../AutoTips/index.js';
 import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
-import '../_verture/typeof-adeedc13.js';
-import '../_verture/slicedToArray-a8206399.js';
-import '../_verture/unsupportedIterableToArray-cb478f24.js';
 import '@para-ui/icons/LoadingF';
 import '../Tooltip/index.js';
 import 'rc-tooltip';
 import 'rc-tooltip/lib/placements';
 import '@para-ui/icons/Forbid';
 import '@para-ui/icons/Down';
-import '../_verture/index-e9007d6a.js';
+import '../_verture/index-da9097d3.js';
 import 'rc-dropdown';
-import '../_verture/usePopupContainer-87febeb9.js';
+import '../_verture/usePopupContainer-635f66f4.js';
 import 'dayjs';
-import '../_verture/useFormatMessage-703f8b20.js';
+import '../_verture/useFormatMessage-eb13cf56.js';
 import '@para-ui/core/GlobalContext';
+import '../_verture/typeof-adeedc13.js';
 
 var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/11/23 上午9:50\n* @description\n*/\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.paraui-v4-toggle-button.paraui-v4-button-text {\n  color: rgb(29, 33, 38);\n}\n.paraui-v4-toggle-button.paraui-v4-button-text:hover {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-toggle-button.paraui-v4-button-text:hover[disabled] {\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-toggle-button-wrap {\n  display: inline-block;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio.paraui-v4-toggle-button-selected {\n  border-color: rgb(46, 101, 230);\n  color: rgb(255, 255, 255);\n  background-color: rgb(46, 101, 230);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio.paraui-v4-toggle-button-selected:hover {\n  border-color: rgb(46, 101, 230);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio:hover {\n  border-color: rgb(87, 131, 235);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio[disabled] {\n  color: rgb(161, 168, 179);\n  background-color: rgb(255, 255, 255);\n  border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio[disabled]:hover {\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-radio[disabled].paraui-v4-toggle-button-selected {\n  color: rgb(92, 101, 115);\n  background-color: rgb(247, 248, 250);\n  border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check::before {\n  content: \" \";\n  position: absolute;\n  bottom: 0;\n  right: 0;\n  border: 8px solid rgb(212, 218, 227);\n  border-top-color: transparent;\n  border-left-color: transparent;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check::after {\n  content: \" \";\n  width: 8px;\n  height: 8px;\n  background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABHNCSVQICAgIfAhkiAAAAM5JREFUOE/NkQENwjAURFcFIAEHgIM5YCgAHCABFBAUAA5wABI2CTgABeUd+V06BqFkCeEnl6X9d7d/vy7rWK6jPvu9gfe+z9QnsHDOlV9NgHhk4gpxrvjJBogL+DtwATkG12QDxEvIG3AzcRmW/5gAgsaR+1S54peht+c8s7vxc7+OAFHCIVhBWkfLUm6VliazRsUGAzoy6YEz0LaDeItYMVrVWCJ/nVuUmHhArPuX1XoFTI4wJ8au+NYb/ziBCJZdJqoiPFfyBO+I/2twBz0qQBFvrubpAAAAAElFTkSuQmCC\");\n  background-size: 8px 8px;\n  background-repeat: no-repeat;\n  position: absolute;\n  bottom: 1px;\n  right: 1px;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check:hover {\n  border-color: rgb(87, 131, 235);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check:hover::before {\n  border-color: rgb(87, 131, 235);\n  border-top-color: transparent;\n  border-left-color: transparent;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check.paraui-v4-toggle-button-selected {\n  border-color: rgb(46, 101, 230);\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check.paraui-v4-toggle-button-selected::before {\n  border-color: rgb(46, 101, 230);\n  border-top-color: transparent;\n  border-left-color: transparent;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check[disabled] {\n  color: rgb(161, 168, 179);\n  background-color: rgb(255, 255, 255);\n  border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check[disabled]::before {\n  border-color: rgb(212, 218, 227);\n  border-top-color: transparent;\n  border-left-color: transparent;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check[disabled]:hover {\n  color: rgb(161, 168, 179);\n  background-color: rgb(255, 255, 255);\n  border: 1px solid rgb(212, 218, 227);\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check[disabled]:hover::before {\n  border-color: rgb(212, 218, 227);\n  border-top-color: transparent;\n  border-left-color: transparent;\n}\n.paraui-v4-toggle-button.paraui-v4-toggle-button-check[disabled].paraui-v4-toggle-button-selected {\n  color: rgb(92, 101, 115);\n  background-color: rgb(247, 248, 250);\n}\n.paraui-v4-toggle-button .toggle-button-text {\n  display: inline-block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.paraui-v4-toggle-button-disabled.paraui-v4-toggle-button {\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-toggle-button-disabled.paraui-v4-toggle-button:hover {\n  color: rgb(92, 101, 115);\n}\n.paraui-v4-toggle-button .toggle-button-badge {\n  position: absolute;\n  right: 0;\n  bottom: 16px;\n}\n.paraui-v4-toggle-button .toggle-button-badge > div {\n  position: absolute;\n  top: 0;\n  right: 0;\n  border: 8px solid rgb(46, 101, 230);\n  border-top-color: transparent;\n  border-left-color: transparent;\n}\n.paraui-v4-toggle-button .toggle-button-badge > svg {\n  position: absolute;\n  top: 7px;\n  right: 1px;\n  color: #fff;\n  font-weight: 600;\n  width: 8px;\n  height: 8px;\n}\n\n.paraui-v4-togglebutton-group {\n  display: flex;\n  flex-flow: row wrap;\n}\n.paraui-v4-togglebutton-group .toggle-button-item {\n  margin: 0 10px;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button {\n  margin: 0;\n  padding: 0 16px;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button[disabled] {\n  color: rgb(161, 168, 179);\n  background-color: transparent;\n  border: 0;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button[disabled]:hover {\n  color: rgb(161, 168, 179);\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button ~ .paraui-v4-toggle-button::before {\n  position: absolute;\n  left: 0;\n  top: 50%;\n  transform: translateY(-50%);\n  content: \"\";\n  width: 1px;\n  height: 14px;\n  background-color: rgb(212, 218, 227);\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected {\n  color: rgb(46, 101, 230);\n  border: 0;\n  font-weight: 700;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected:hover {\n  color: rgb(46, 101, 230);\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected[disabled] {\n  color: rgb(92, 101, 115);\n  background-color: transparent;\n  border: 0;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected[disabled]:hover {\n  background-color: transparent;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected:first-child:before {\n  display: none;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected:not(:first-child)::before {\n  position: absolute;\n  left: 0;\n  top: 50%;\n  transform: translateY(-50%);\n  content: \"\";\n  width: 1px;\n  height: 14px;\n  background-color: rgb(212, 218, 227);\n  border: 0;\n}\n.paraui-v4-togglebutton-group-text .paraui-v4-toggle-button-selected::after {\n  display: none;\n}";
 styleInject(css_248z);
@@ -110,30 +108,32 @@ var ToggleButtonGroup = function ToggleButtonGroup(props) {
 };
 
 //切换按钮
-var ToggleButton = function ToggleButton(props) {
-  var _clsx;
-  var className = props.className,
-    style = props.style,
-    children = props.children,
-    _props$disabled = props.disabled,
-    disabled = _props$disabled === void 0 ? false : _props$disabled,
-    toolTipTitle = props.toolTipTitle,
-    _props$selected = props.selected,
-    selected = _props$selected === void 0 ? false : _props$selected,
-    _props$exclusive = props.exclusive,
-    exclusive = _props$exclusive === void 0 ? false : _props$exclusive,
-    value = props.value;
-    props.autoToolTipOverflow;
-    var width = props.width,
-    onClick = props.onClick,
+const ToggleButton = props => {
+  const {
+      className,
+      style,
+      children,
+      disabled = false,
+      toolTipTitle,
+      selected = false,
+      exclusive = false,
+      value,
+      autoToolTipOverflow = true,
+      width,
+      onClick
+    } = props,
     restProps = __rest(props, ["className", "style", "children", "disabled", "toolTipTitle", "selected", "exclusive", "value", "autoToolTipOverflow", "width", "onClick"]);
   // const [hasTip, setHasTip] = useState<boolean>(false);
-  var id = useRef(UUID()).current;
-  var prefixCls = "".concat($prefixCls, "-toggle-button");
+  const id = useRef(UUID()).current;
+  const prefixCls = "".concat($prefixCls, "-toggle-button");
   //className
-  var makeCls = clsx(prefixCls, className, (_clsx = {}, _defineProperty(_clsx, "".concat(prefixCls, "-").concat(exclusive ? 'radio' : 'check'), (restProps === null || restProps === void 0 ? void 0 : restProps.variant) !== 'text'), _defineProperty(_clsx, "".concat(prefixCls, "-selected"), selected), _defineProperty(_clsx, "".concat(prefixCls, "-disabled"), disabled), _clsx));
+  const makeCls = clsx(prefixCls, className, {
+    ["".concat(prefixCls, "-").concat(exclusive ? 'radio' : 'check')]: (restProps === null || restProps === void 0 ? void 0 : restProps.variant) !== 'text',
+    ["".concat(prefixCls, "-selected")]: selected,
+    ["".concat(prefixCls, "-disabled")]: disabled
+  });
   //点击事件
-  var handleClick = function handleClick(evt) {
+  const handleClick = evt => {
     if (onClick) onClick(evt, value);
   };
   return jsx(Button, Object.assign({
@@ -141,7 +141,7 @@ var ToggleButton = function ToggleButton(props) {
     variant: 'outlined'
   }, restProps, {
     style: Object.assign({
-      width: width
+      width
     }, style),
     className: makeCls,
     disabled: disabled,