@para-ui/core 3.0.55 → 3.0.56

package/Popover/index.js

@@ -0,0 +1,59 @@
+import { _ as __rest } from '../_verture/tslib.es6-55ed4bd2.js';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import React__default from 'react';
+import { Tooltip } from '../Tooltip/index.js';
+import { $ as $prefixCls, a as $rcPrefixCls } from '../_verture/constant-66aa48a1.js';
+import { u as usePopupContainer } from '../_verture/usePopupContainer-87febeb9.js';
+import clsx from 'clsx';
+import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
+import '../_verture/slicedToArray-76060636.js';
+import '../_verture/unsupportedIterableToArray-cb478f24.js';
+import 'rc-tooltip';
+import 'rc-tooltip/lib/placements';
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/6/7 上午11:06\n* @description\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-popover {\n  color: rgb(46, 55, 67);\n  font-size: 14px;\n  font-variant: tabular-nums;\n  line-height: 1.5715;\n  list-style: none;\n  font-feature-settings: \"tnum\";\n  position: absolute;\n  top: 0;\n  left: 0;\n  z-index: 1500;\n  font-weight: 400;\n  white-space: normal;\n  text-align: left;\n  cursor: auto;\n  user-select: text;\n}\n.paraui-v3-popover::after {\n  position: absolute;\n  background: rgba(255, 255, 255, 0.01);\n  content: \"\";\n}\n.paraui-v3-popover.component-popover-hidden {\n  display: none;\n}\n.paraui-v3-popover .component-popover-inner {\n  background-color: rgb(255, 255, 255);\n  background-clip: padding-box;\n  border-radius: 4px;\n  box-shadow: 0px 2px 8px 0px rgba(171, 176, 185, 0.4);\n}\n.paraui-v3-popover .component-popover-title {\n  margin: 0;\n  padding: 0 24px;\n  color: rgb(46, 55, 67);\n  font-weight: 700;\n  border-bottom: 1px solid #f0f0f0;\n  min-height: 44px;\n  display: flex;\n  align-items: center;\n}\n.paraui-v3-popover .component-popover-inner-content {\n  color: rgb(46, 55, 67);\n}\n.paraui-v3-popover .component-popover-buttons {\n  margin-bottom: 4px;\n  text-align: right;\n}\n.paraui-v3-popover .component-popover-buttons button {\n  margin-left: 8px;\n}\n.paraui-v3-popover .component-popover-arrow {\n  position: absolute;\n  display: none;\n  width: 16px;\n  height: 16px;\n  overflow: hidden;\n  background: transparent;\n  pointer-events: none;\n}\n.paraui-v3-popover .component-popover-arrow-content {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  display: block;\n  width: 11.3137085px;\n  height: 11.3137085px;\n  margin: auto;\n  background-color: rgb(255, 255, 255);\n  content: \"\";\n  border-radius: 0 0 4px;\n  pointer-events: none;\n}\n.paraui-v3-popover .component-popover-arrow-content::before {\n  position: absolute;\n  top: -11.3137085px;\n  left: -11.3137085px;\n  width: 33.9411255px;\n  height: 33.9411255px;\n  background: rgb(255, 255, 255) -10px -10px no-repeat;\n  content: \"\";\n  -webkit-clip-path: path(\"M 9.849242404917499 24.091883092036785 A 5 5 0 0 1 13.384776310850237 22.627416997969522 L 20.627416997969522 22.627416997969522 A 2 2 0 0 0 22.627416997969522 20.627416997969522 L 22.627416997969522 13.384776310850237 A 5 5 0 0 1 24.091883092036785 9.849242404917499 L 23.091883092036785 9.849242404917499 L 9.849242404917499 23.091883092036785 Z\");\n}\n.paraui-v3-popover.component-popover-placement-top .component-popover-arrow, .paraui-v3-popover.component-popover-placement-topLeft .component-popover-arrow, .paraui-v3-popover.component-popover-placement-topRight .component-popover-arrow {\n  bottom: -0.6862915px;\n}\n.paraui-v3-popover.component-popover-placement-top .component-popover-arrow-content, .paraui-v3-popover.component-popover-placement-topLeft .component-popover-arrow-content, .paraui-v3-popover.component-popover-placement-topRight .component-popover-arrow-content {\n  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.07);\n  transform: translateY(-1px) rotate(45deg);\n}\n.paraui-v3-popover.component-popover-placement-top .component-popover-arrow {\n  left: 50%;\n  transform: translateX(-50%);\n}\n.paraui-v3-popover.component-popover-placement-topLeft .component-popover-arrow {\n  left: 16px;\n}\n.paraui-v3-popover.component-popover-placement-topRight .component-popover-arrow {\n  right: 16px;\n}\n.paraui-v3-popover.component-popover-placement-right .component-popover-arrow, .paraui-v3-popover.component-popover-placement-rightTop .component-popover-arrow, .paraui-v3-popover.component-popover-placement-rightBottom .component-popover-arrow {\n  left: -0.6862915px;\n}\n.paraui-v3-popover.component-popover-placement-right .component-popover-arrow-content, .paraui-v3-popover.component-popover-placement-rightTop .component-popover-arrow-content, .paraui-v3-popover.component-popover-placement-rightBottom .component-popover-arrow-content {\n  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.07);\n  transform: translateX(1px) rotate(135deg);\n}\n.paraui-v3-popover.component-popover-placement-right .component-popover-arrow {\n  top: 50%;\n  transform: translateY(-50%);\n}\n.paraui-v3-popover.component-popover-placement-rightTop .component-popover-arrow {\n  top: 12px;\n}\n.paraui-v3-popover.component-popover-placement-rightBottom .component-popover-arrow {\n  bottom: 12px;\n}\n.paraui-v3-popover.component-popover-placement-bottom .component-popover-arrow, .paraui-v3-popover.component-popover-placement-bottomLeft .component-popover-arrow, .paraui-v3-popover.component-popover-placement-bottomRight .component-popover-arrow {\n  top: -0.6862915px;\n}\n.paraui-v3-popover.component-popover-placement-bottom .component-popover-arrow-content, .paraui-v3-popover.component-popover-placement-bottomLeft .component-popover-arrow-content, .paraui-v3-popover.component-popover-placement-bottomRight .component-popover-arrow-content {\n  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.06);\n  transform: translateY(1px) rotate(-135deg);\n}\n.paraui-v3-popover.component-popover-placement-bottom .component-popover-arrow {\n  left: 50%;\n  transform: translateX(-50%);\n}\n.paraui-v3-popover.component-popover-placement-bottomLeft .component-popover-arrow {\n  left: 16px;\n}\n.paraui-v3-popover.component-popover-placement-bottomRight .component-popover-arrow {\n  right: 16px;\n}\n.paraui-v3-popover.component-popover-placement-left .component-popover-arrow, .paraui-v3-popover.component-popover-placement-leftTop .component-popover-arrow, .paraui-v3-popover.component-popover-placement-leftBottom .component-popover-arrow {\n  right: -0.6862915px;\n}\n.paraui-v3-popover.component-popover-placement-left .component-popover-arrow-content, .paraui-v3-popover.component-popover-placement-leftTop .component-popover-arrow-content, .paraui-v3-popover.component-popover-placement-leftBottom .component-popover-arrow-content {\n  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.07);\n  transform: translateX(-1px) rotate(-45deg);\n}\n.paraui-v3-popover.component-popover-placement-left .component-popover-arrow {\n  top: 50%;\n  transform: translateY(-50%);\n}\n.paraui-v3-popover.component-popover-placement-leftTop .component-popover-arrow {\n  top: 12px;\n}\n.paraui-v3-popover.component-popover-placement-leftBottom .component-popover-arrow {\n  bottom: 12px;\n}\n\n.component-popover-zoom-big-enter,\n.component-popover-zoom-big-appear {\n  animation-duration: 0.2s;\n  animation-fill-mode: both;\n  animation-play-state: paused;\n}\n\n.component-popover-zoom-big-leave {\n  animation-duration: 0.2s;\n  animation-fill-mode: both;\n  animation-play-state: paused;\n}\n\n.component-popover-zoom-big-enter.component-popover-zoom-big-enter-active,\n.component-popover-zoom-big-appear.component-popover-zoom-big-appear-active {\n  animation-name: componentPopoverZoomBigIn;\n  animation-play-state: running;\n}\n\n.component-popover-zoom-big-leave.component-popover-zoom-big-leave-active {\n  animation-name: componentPopoverZoomBigOut;\n  animation-play-state: running;\n  pointer-events: none;\n}\n\n.component-popover-zoom-big-enter,\n.component-popover-zoom-big-appear {\n  transform: scale(0);\n  opacity: 0;\n  animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);\n}\n\n.component-popover-zoom-big-enter-prepare,\n.component-popover-zoom-big-appear-prepare {\n  transform: none;\n}\n\n.component-popover-zoom-big-leave {\n  animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);\n}\n\n@keyframes componentPopoverZoomBigIn {\n  0% {\n    transform: scale(0.8);\n    opacity: 0;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n@keyframes componentPopoverZoomBigOut {\n  0% {\n    transform: scale(1);\n  }\n  100% {\n    transform: scale(0.8);\n    opacity: 0;\n  }\n}";
+styleInject(css_248z);
+
+//popover
+var Popover = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
+  var title = props.title,
+    content = props.content,
+    restProps = __rest(props, ["title", "content"]);
+  var wrapRef = React__default.useRef();
+  var getPopupContainer = usePopupContainer(wrapRef, props.getPopupContainer);
+  //浮层
+  var getOverlay = function getOverlay(prefixCls) {
+    if (!title && !content) return null;
+    return jsxs(Fragment, {
+      children: [title && jsx("div", Object.assign({
+        className: "".concat(prefixCls, "-title")
+      }, {
+        children: title
+      })), jsx("div", Object.assign({
+        className: "".concat(prefixCls, "-inner-content")
+      }, {
+        children: content
+      }))]
+    });
+  };
+  var prefixCls = "".concat($rcPrefixCls, "-popover");
+  return jsx(Tooltip, Object.assign({}, restProps, {
+    isPopover: true,
+    prefixCls: prefixCls,
+    overlayClassName: clsx("".concat($prefixCls, "-popover"), props.overlayClassName),
+    ref: wrapRef,
+    title: getOverlay(prefixCls),
+    transitionName: "".concat($rcPrefixCls, "-popover-zoom-big"),
+    getPopupContainer: getPopupContainer
+  }));
+});
+Popover.displayName = 'Popover';
+Popover.defaultProps = {
+  placement: 'bottom',
+  trigger: 'click',
+  mouseEnterDelay: 0.1,
+  mouseLeaveDelay: 0.1,
+  arrow: false
+};
+
+export { Popover, Popover as default };

package/Progress/Line.d.ts

@@ -0,0 +1,47 @@
+/**
+ * @author jill
+ * @date 2022/3/10 18:25
+ * @description 线性进度条
+ */
+import * as React from "react";
+import { ProgressProps, StringGradients, DirectionType } from "./index";
+interface LineProps extends ProgressProps {
+    direction?: DirectionType;
+    children: React.ReactNode;
+}
+/**
+* 转换 百分比 到 样式格式
+ * {
+ *     "0%": "#afc163",
+ *     "75%": "#009900",
+ *     "50%": "green", // ====> '#afc163 0%, #66FF00 25%, #00CC00 50%, #009900 75%, #ffffff 100%'
+ *     "25%": "#66FF00",
+ *     "100%": "#ffffff"
+ *   }
+* @param gradients 渐变的参数
+* @return {string} 样式值
+*/
+export declare const sortGradient: (gradients: StringGradients) => string;
+/**
+* 转换传进来 渐变的参数 为css样式
+ * {
+ *     "0%": "#afc163",
+ *     "25%": "#66FF00",
+ *     "50%": "#00CC00", // ====>  linear-gradient(to right, #afc163 0%, #66FF00 25%,
+ *     "75%": "#009900", //        #00CC00 50%, #009900 75%, #ffffff 100%)
+ *     "100%": "#ffffff"
+ *   }
+ *
+ *   {
+ *     "from": "#afc163",
+ *     "to": "#66FF00",// ====>  linear-gradient(to right, #afc163, #66FF00)
+ *   }
+ *
+* @param {string} strokeColor 颜色值
+* @return   返回 backgroundImage 的样式值
+*/
+export declare const handleGradient: (strokeColor: any, directionConfig: DirectionType) => {
+    backgroundImage: string;
+};
+declare const Line: React.FC<LineProps>;
+export default Line;

package/Progress/Steps.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @author jill
+ * @date 2022/3/10 18:25
+ * @description 进度条的步骤条
+ */
+import * as React from "react";
+import { ProgressProps } from "./index";
+interface StepsProps extends ProgressProps {
+    /** 一共有多少步 **/
+    steps: number;
+    /** 进度条高亮部分颜色配置 **/
+    strokeColor?: string;
+    /** 进度条轨道部分颜色配置 **/
+    trailColor?: string;
+}
+declare const Steps: React.FC<StepsProps>;
+export default Steps;

package/Progress/index.d.ts

@@ -0,0 +1,83 @@
+/**
+ * @author jill
+ * @date 2022/3/10 18:25
+ * @description 进度条
+ */
+import React, { FunctionComponent } from "react";
+import "./index.scss";
+/** 进度条类型 **/
+declare enum ProgressTypes {
+    "line" = 0,
+    "circle" = 1,
+    "dashboard" = 2
+}
+export type ProgressType = typeof ProgressTypes[number];
+/** 进度条状态 **/
+declare enum ProgressStatuses {
+    "normal" = 0,
+    "exception" = 1,
+    "active" = 2,
+    "success" = 3
+}
+/** 渐变进度条入参格式 两种 **/
+export type StringGradients = {
+    [percentage: string]: string;
+};
+type FromToGradients = {
+    from: string;
+    to: string;
+};
+type ColorStringGradients = [string, StringGradients];
+export type ProgressGradient = {
+    direction?: string;
+} & (StringGradients | FromToGradients);
+/** 进度条渐变方向 **/
+export type DirectionType = "ltr" | "rtl" | undefined;
+/** 成功的进度条的配置 **/
+export interface SuccessProps {
+    /** 进度条值 **/
+    percent: number;
+    /** 进度条颜色 **/
+    strokeColor?: string;
+}
+export interface ProgressProps {
+    /** 自定义样式名 **/
+    className?: string;
+    /** 样式 */
+    style?: React.CSSProperties;
+    /** 类型，可选 line circle dashboard **/
+    type?: ProgressType;
+    /** 百分比 **/
+    percent?: number | number[];
+    /** 内容的模板函数 **/
+    format?: (percent?: number | number[], successPercent?: number) => React.ReactNode;
+    /** 状态，可选：success exception normal active(仅限 line) **/
+    status?: typeof ProgressStatuses[number];
+    /** 是否显示进度数值或状态图标 **/
+    showInfo?: boolean;
+    /** 进度条线的宽度，单位 px **/
+    strokeWidth?: number;
+    /** 进度条的样式 **/
+    strokeLinecap?: "butt" | "square" | "round";
+    /** 进度条的色彩 **/
+    strokeColor?: string | ({
+        direction?: string;
+    } & (StringGradients | FromToGradients | ColorStringGradients));
+    /** 未完成的分段的颜色 **/
+    trailColor?: string;
+    /** 圆形进度条画布宽度，单位 px **/
+    width?: number;
+    /** 成功进度条相关配置 **/
+    success?: SuccessProps;
+    /** 仪表盘进度条缺口角度，可取值 0 ~ 295 **/
+    gapDegree?: number;
+    /** 仪表盘进度条缺口位置 **/
+    gapPosition?: "top" | "bottom" | "left" | "right";
+    /** 进度条总共步数 **/
+    steps?: number;
+    /** 渐变颜色的方向 **/
+    direction?: DirectionType;
+    children?: React.ReactNode;
+}
+export declare const Progress: FunctionComponent<ProgressProps>;
+export default Progress;

package/Progress/index.js

@@ -0,0 +1,323 @@
+import { _ as __rest } from '../_verture/tslib.es6-55ed4bd2.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Circle } from 'rc-progress';
+import CompleteIcon from '@para-ui/icons/CheckCircleF';
+import CloseCircleFilled from '@para-ui/icons/CloseCircleF';
+import Check from '@para-ui/icons/Check';
+import CloseIcon from '@para-ui/icons/Close';
+import { a as $rcPrefixCls, $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
+import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
+
+var Steps = function Steps(props) {
+  var steps = props.steps,
+    _props$percent = props.percent,
+    percent = _props$percent === void 0 ? 0 : _props$percent,
+    _props$strokeWidth = props.strokeWidth,
+    strokeWidth = _props$strokeWidth === void 0 ? 8 : _props$strokeWidth,
+    strokeColor = props.strokeColor,
+    trailColor = props.trailColor,
+    children = props.children;
+  /** 计算出应该高亮多少步 **/
+  var current = typeof percent === "number" ? Math.round(steps * (percent / 100)) : 1;
+  var styledSteps = [];
+  for (var i = 0; i < steps; i += 1) {
+    styledSteps.push(jsx("div", {
+      className: i <= current - 1 ? "steps-item steps-item-active" : "steps-item",
+      style: {
+        backgroundColor: i <= current - 1 ? strokeColor : trailColor,
+        width: 14,
+        height: strokeWidth
+      }
+    }, i));
+  }
+  return jsxs("div", Object.assign({
+    className: "steps-outer"
+  }, {
+    children: [styledSteps, children]
+  }));
+};
+
+/**
+* 判断进度条传的百分比参数是否规范
+* @param {number | undefined} progress 方法入参说明
+* @return {numner} 百分比值
+*/
+function validProgress(progress) {
+  if (!progress || progress < 0) {
+    return 0;
+  }
+  if (progress > 100) {
+    return 100;
+  }
+  return progress;
+}
+
+/**
+* 转换 百分比 到 样式格式
+ * {
+ *     "0%": "#afc163",
+ *     "75%": "#009900",
+ *     "50%": "green", // ====> '#afc163 0%, #66FF00 25%, #00CC00 50%, #009900 75%, #ffffff 100%'
+ *     "25%": "#66FF00",
+ *     "100%": "#ffffff"
+ *   }
+* @param gradients 渐变的参数
+* @return {string} 样式值
+*/
+var sortGradient = function sortGradient(gradients) {
+  var tempArr = [];
+  Object.keys(gradients).forEach(function (key) {
+    // 拿到百分比的数字
+    var formattedKey = parseFloat(key.replace(/%/g, ""));
+    // 进行序列化
+    if (!isNaN(formattedKey)) {
+      tempArr.push({
+        key: formattedKey,
+        value: gradients[key]
+      });
+    }
+  });
+  // 排序 从小到大
+  tempArr = tempArr.sort(function (a, b) {
+    return a.key - b.key;
+  });
+  return tempArr.map(function (_ref) {
+    var key = _ref.key,
+      value = _ref.value;
+    return "".concat(value, " ").concat(key, "%");
+  }).join(", ");
+};
+/**
+* 转换传进来 渐变的参数 为css样式
+ * {
+ *     "0%": "#afc163",
+ *     "25%": "#66FF00",
+ *     "50%": "#00CC00", // ====>  linear-gradient(to right, #afc163 0%, #66FF00 25%,
+ *     "75%": "#009900", //        #00CC00 50%, #009900 75%, #ffffff 100%)
+ *     "100%": "#ffffff"
+ *   }
+ *
+ *   {
+ *     "from": "#afc163",
+ *     "to": "#66FF00",// ====>  linear-gradient(to right, #afc163, #66FF00)
+ *   }
+ *
+* @param {string} strokeColor 颜色值
+* @return   返回 backgroundImage 的样式值
+*/
+var handleGradient = function handleGradient(strokeColor, directionConfig) {
+  var _strokeColor$from = strokeColor.from,
+    from = _strokeColor$from === void 0 ? "#3D66F8" : _strokeColor$from,
+    _strokeColor$to = strokeColor.to,
+    to = _strokeColor$to === void 0 ? "#4F93F0" : _strokeColor$to,
+    _strokeColor$directio = strokeColor.direction,
+    direction = _strokeColor$directio === void 0 ? directionConfig === "rtl" ? "to left" : "to right" : _strokeColor$directio,
+    rest = __rest(strokeColor, ["from", "to", "direction"]);
+  // 剩余参数有值说明除了from to direction 还传了 另外的参数
+  if (Object.keys(rest).length !== 0) {
+    var sortedGradients = sortGradient(rest);
+    return {
+      backgroundImage: "linear-gradient(".concat(direction, ", ").concat(sortedGradients, ")")
+    };
+  }
+  return {
+    backgroundImage: "linear-gradient(".concat(direction, ", ").concat(from, ", ").concat(to, ")")
+  };
+};
+var Line = function Line(props) {
+  var directionConfig = props.direction,
+    percent = props.percent,
+    strokeWidth = props.strokeWidth,
+    strokeColor = props.strokeColor,
+    strokeLinecap = props.strokeLinecap,
+    trailColor = props.trailColor;
+  /** 进度条高亮部分的颜色样式  **/
+  var backgroundProps = strokeColor && typeof strokeColor !== "string" ? handleGradient(strokeColor, directionConfig) : {
+    background: strokeColor
+  };
+  /** 进度条轨道部分的颜色样式 **/
+  var trailStyle = trailColor ? {
+    backgroundColor: trailColor
+  } : undefined;
+  /** 进度条百分比的样式 **/
+  var percentStyle = Object.assign({
+    width: "".concat(validProgress(percent), "%"),
+    height: strokeWidth || 8,
+    borderRadius: strokeLinecap === "square" ? 0 : ""
+  }, backgroundProps);
+  return jsx("div", Object.assign({
+    className: "trail-bar",
+    style: trailStyle
+  }, {
+    children: jsx("div", {
+      className: "active-bar",
+      style: percentStyle
+    })
+  }));
+};
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer {\n  display: flex;\n  margin-right: 8px;\n  margin-bottom: 8px;\n}\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer .progress-inner {\n  width: 100%;\n  /*.component-progress-line {\n    height: 10px;\n    width: 100%;\n  }*/\n}\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer .progress-inner .steps-outer {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer .progress-inner .steps-outer .steps-item {\n  flex-shrink: 0;\n  min-width: 2px;\n  margin-right: 2px;\n  background: #f3f3f3;\n  transition: all 0.3s;\n}\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer .progress-inner .steps-outer .steps-item-active {\n  background-color: rgb(54, 102, 214);\n}\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer .progress-inner .trail-bar {\n  position: relative;\n  display: inline-block;\n  width: 100%;\n  overflow: hidden;\n  vertical-align: middle;\n  background-color: rgba(171, 176, 185, 0.2);\n  border-radius: 100px;\n}\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer .progress-inner .trail-bar .active-bar {\n  position: relative;\n  background-color: rgb(54, 102, 214);\n  border-radius: 100px;\n  transition: all 0.4s cubic-bezier(0.08, 0.82, 0.17, 1) 0s;\n}\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer .progress-text {\n  min-width: 40px;\n  font-size: 14px;\n  font-weight: 500;\n  text-align: left;\n  color: rgb(54, 102, 214);\n  margin-left: 12px;\n  white-space: nowrap;\n  vertical-align: middle;\n  word-break: normal;\n  display: flex;\n  align-items: center;\n}\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer .progress-text svg {\n  width: 14px;\n  height: 14px;\n  position: relative;\n  top: 2px;\n}\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer .progress-text svg.success {\n  color: rgb(83, 195, 27) !important;\n}\n.paraui-v3-progress.paraui-v3-progress-line .progress-outer .progress-text svg.error {\n  color: rgb(235, 96, 84) !important;\n}\n.paraui-v3-progress.paraui-v3-progress-circle, .paraui-v3-progress.paraui-v3-progress-dashboard {\n  display: inline-block;\n  position: relative;\n  margin: 0 5px;\n}\n.paraui-v3-progress.paraui-v3-progress-circle .progress-outer .progress-text, .paraui-v3-progress.paraui-v3-progress-dashboard .progress-outer .progress-text {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: 100%;\n  margin: 0;\n  padding: 0;\n  color: rgb(54, 102, 214);\n  font-size: 1em;\n  line-height: 1;\n  white-space: normal;\n  text-align: center;\n  transform: translate(-50%, -50%);\n}\n.paraui-v3-progress.paraui-v3-progress-circle .progress-outer .progress-text svg, .paraui-v3-progress.paraui-v3-progress-dashboard .progress-outer .progress-text svg {\n  width: 2em;\n  height: 2em;\n}\n.paraui-v3-progress.paraui-v3-progress-circle .progress-outer .progress-text svg.success, .paraui-v3-progress.paraui-v3-progress-dashboard .progress-outer .progress-text svg.success {\n  color: rgb(83, 195, 27) !important;\n}\n.paraui-v3-progress.paraui-v3-progress-circle .progress-outer .progress-text svg.error, .paraui-v3-progress.paraui-v3-progress-dashboard .progress-outer .progress-text svg.error {\n  color: rgb(235, 96, 84) !important;\n}\n.paraui-v3-progress.paraui-v3-progress-success-status .progress-text {\n  color: rgb(83, 195, 27) !important;\n}\n.paraui-v3-progress.paraui-v3-progress-exception-status .progress-text {\n  color: rgb(235, 96, 84) !important;\n}\n.paraui-v3-progress.paraui-v3-progress-active-status .active-bar:before {\n  position: absolute;\n  inset: 0;\n  background: #fff;\n  border-radius: 10px;\n  opacity: 0;\n  -webkit-animation: progress-active 2.4s cubic-bezier(0.23, 1, 0.32, 1) infinite;\n  animation: progress-active 2.4s cubic-bezier(0.23, 1, 0.32, 1) infinite;\n  content: \"\";\n}\n\n@keyframes progress-active {\n  0% {\n    transform: translateX(-100%) scaleX(0);\n    opacity: 0.1;\n  }\n  20% {\n    transform: translateX(-100%) scaleX(0);\n    opacity: 0.5;\n  }\n  100% {\n    transform: translateX(0) scaleX(1);\n    opacity: 0;\n  }\n}";
+styleInject(css_248z);
+
+/** 进度条类型 **/
+var ProgressTypes;
+(function (ProgressTypes) {
+  ProgressTypes[ProgressTypes["line"] = 0] = "line";
+  ProgressTypes[ProgressTypes["circle"] = 1] = "circle";
+  ProgressTypes[ProgressTypes["dashboard"] = 2] = "dashboard";
+})(ProgressTypes || (ProgressTypes = {}));
+/** 进度条状态 **/
+var ProgressStatuses;
+(function (ProgressStatuses) {
+  ProgressStatuses[ProgressStatuses["normal"] = 0] = "normal";
+  ProgressStatuses[ProgressStatuses["exception"] = 1] = "exception";
+  ProgressStatuses[ProgressStatuses["active"] = 2] = "active";
+  ProgressStatuses[ProgressStatuses["success"] = 3] = "success";
+})(ProgressStatuses || (ProgressStatuses = {}));
+/** 每个类型对应的进度条默认颜色 **/
+var strokeColorMap = {
+  success: "rgba(83, 195, 27, 1)",
+  exception: "rgba(235, 96, 84, 1)",
+  normal: "rgba(54, 102, 214, 1)",
+  active: "rgba(54, 102, 214, 1)"
+};
+var Progress = function Progress(props) {
+  var _props$type = props.type,
+    type = _props$type === void 0 ? "line" : _props$type,
+    className = props.className,
+    style = props.style;
+    props.children;
+    var status = props.status,
+    _props$width = props.width,
+    width = _props$width === void 0 ? 132 : _props$width,
+    _props$showInfo = props.showInfo,
+    showInfo = _props$showInfo === void 0 ? true : _props$showInfo,
+    format = props.format,
+    success = props.success,
+    _props$percent = props.percent,
+    percent = _props$percent === void 0 ? 0 : _props$percent,
+    steps = props.steps,
+    direction = props.direction,
+    strokeColor = props.strokeColor,
+    _props$gapDegree = props.gapDegree,
+    gapDegree = _props$gapDegree === void 0 ? 75 : _props$gapDegree,
+    otherProps = __rest(props, ["type", "className", "style", "children", "status", "width", "showInfo", "format", "success", "percent", "steps", "direction", "strokeColor", "gapDegree"]);
+  /**
+   * 处理class
+   * @return {string}
+   */
+  var classString = function classString() {
+    var str = "".concat($prefixCls, "-progress ").concat($prefixCls, "-progress-").concat(type || "default");
+    // 添加成功状态的class
+    if (isSuccessStatus) str += " ".concat($prefixCls, "-progress-success-status");
+    // 添加错误状态下的class
+    if (status === "exception") str += " ".concat($prefixCls, "-progress-exception-status");
+    // 添加active状态下的class
+    if (status === "active") str += " ".concat($prefixCls, "-progress-active-status");
+    if (className) str += " " + className;
+    return str;
+  };
+  /**
+   * 处理进度条颜色
+   * @return {string}
+   */
+  var strokeColorVal = function strokeColorVal() {
+    // 如果传了成功进度条的配置
+    if (strokeColor) return strokeColor;
+    if (success && success.percent < percent) {
+      return [success.strokeColor || strokeColorMap["success"], strokeColorMap["normal"]];
+    }
+    return isSuccessStatus ? strokeColorMap["success"] : strokeColorMap[status || "normal"];
+  };
+  /**
+   * 处理进度条的值
+   * @return {string}
+   */
+  var renderPercent = function renderPercent() {
+    if (success && success.percent < percent && typeof percent === "number") {
+      return [success.percent, percent - success.percent];
+    }
+    return percent;
+  };
+  /** 标记是不是成功状态 **/
+  var isSuccessStatus = percent && percent === 100 && !status || status === "success";
+  /** style值 **/
+  var renderStyle = type === "circle" || type === "dashboard" ? {
+    width: width,
+    height: width
+  } : {};
+  /**
+   * 处理描述信息
+   * @return {string | ReactNode}
+   */
+  var renderLabel = function renderLabel() {
+    if (format) return format(percent);
+    if (isSuccessStatus) return type === "circle" ? jsx(Check, {
+      className: "success"
+    }) : jsx(CompleteIcon, {
+      className: "success"
+    });
+    if (status === "exception") return type === "circle" ? jsx(CloseIcon, {
+      className: "error"
+    }) : jsx(CloseCircleFilled, {
+      className: "error"
+    });
+    return validProgress(percent) + "%";
+  };
+  /** 默认进度条  **/
+  var renderLineProgress = steps ? jsx(Steps, Object.assign({
+    steps: steps,
+    strokeColor: strokeColorVal(),
+    percent: renderPercent()
+  }, otherProps, {
+    children: showInfo && jsx("div", Object.assign({
+      className: "progress-text"
+    }, {
+      children: renderLabel()
+    }))
+  })) : jsx(Line, Object.assign({
+    strokeColor: strokeColorVal(),
+    percent: renderPercent(),
+    direction: direction
+  }, otherProps, {
+    children: " "
+  }));
+  /** 圆形进度条 **/
+  var renderCircleProgress = jsx(Circle, Object.assign({
+    strokeWidth: 6,
+    trailWidth: 6,
+    strokeColor: strokeColorVal(),
+    percent: renderPercent(),
+    prefixCls: "".concat($rcPrefixCls, "-progress")
+  }, otherProps));
+  /** 仪表盘 **/
+  var renderDashboardProgress = jsx(Circle, Object.assign({
+    strokeWidth: 6,
+    trailWidth: 6,
+    gapPosition: "bottom",
+    gapDegree: gapDegree,
+    strokeColor: strokeColorVal(),
+    percent: renderPercent()
+  }, otherProps));
+  return jsx("div", Object.assign({
+    className: classString(),
+    style: style
+  }, {
+    children: jsxs("div", Object.assign({
+      className: "progress-outer"
+    }, {
+      children: [jsx("div", Object.assign({
+        className: "progress-inner",
+        style: renderStyle
+      }, {
+        children: type === "dashboard" ? renderDashboardProgress : type === "circle" ? renderCircleProgress : renderLineProgress
+      })), showInfo && !steps && jsx("div", Object.assign({
+        className: "progress-text"
+      }, {
+        children: renderLabel()
+      }))]
+    }))
+  }));
+};
+
+export { Progress, Progress as default };

package/Progress/utils.d.ts

@@ -0,0 +1,6 @@
+/**
+* 判断进度条传的百分比参数是否规范
+* @param {number | undefined} progress 方法入参说明
+* @return {numner} 百分比值
+*/
+export declare function validProgress(progress: number | number[] | undefined): number | number[];

package/Querying/images/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+export declare const LargeSearch: () => JSX.Element;
+export declare const SmallSearch: () => JSX.Element;

package/Querying/index.d.ts

@@ -0,0 +1,26 @@
+/**
+ * @author Hanz
+ * @date 2022/4/2 上午10:45
+ * @description
+ */
+import React, { FC } from "react";
+import './index.scss';
+export interface QueryingProps {
+    /** cls */
+    className?: string;
+    /** style */
+    style?: React.CSSProperties;
+    /** 尺寸 */
+    size?: 'large' | 'small';
+    /** 图片样式 */
+    imageStyle?: React.CSSProperties;
+    /** 图片 */
+    image?: React.ReactNode;
+    /** 描述 */
+    description?: React.ReactNode;
+    /** 自定义节点 */
+    customQuerying?: React.ReactNode;
+    [name: string]: any;
+}
+declare const Querying: FC<QueryingProps>;
+export default Querying;