@qsxy/element-plus-react 1.0.0-next.1 → 1.0.0-next.11

package/dist/Progress/Progress.js

@@ -1,55 +1,59 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Progress/Progress.tsx
-var Progress_exports = {};
-__export(Progress_exports, {
-  default: () => Progress_default
-});
-module.exports = __toCommonJS(Progress_exports);
-var import_classnames = __toESM(require("classnames"));
-var import_react = __toESM(require("react"));
-var import_Icon = require("../Icon");
-var import_hooks = require("../hooks");
-var import_prefix = require("../hooks/prefix");
-var Progress = (props) => {
-  const { classPrefix = "progress", percentage, type, strokeWidth, textInside, status, indeterminate, duration, color, width, showText, strokeLinecap, format } = props;
-  const { b, m, e, be, bem, is } = (0, import_hooks.useClassNames)(classPrefix);
-  const backgroundColor = (0, import_react.useMemo)(() => {
-    var _a;
-    if (typeof color === "function") {
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _templateObject, _templateObject2, _templateObject3;
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+import classNames from 'classnames';
+import React, { useMemo } from 'react';
+import Icon from "../Icon/Icon";
+import { mergeDefaultProps } from "../Util";
+import { useClassNames } from "../hooks";
+import { namespace } from "../hooks/prefix";
+var Progress = function Progress(props) {
+  props = mergeDefaultProps({
+    type: 'line',
+    strokeWidth: 6,
+    duration: 3,
+    width: 126,
+    showText: true,
+    strokeLinecap: 'round'
+  }, props);
+  var _props = props,
+    _props$classPrefix = _props.classPrefix,
+    classPrefix = _props$classPrefix === void 0 ? 'progress' : _props$classPrefix,
+    percentage = _props.percentage,
+    type = _props.type,
+    strokeWidth = _props.strokeWidth,
+    textInside = _props.textInside,
+    status = _props.status,
+    indeterminate = _props.indeterminate,
+    duration = _props.duration,
+    color = _props.color,
+    width = _props.width,
+    showText = _props.showText,
+    strokeLinecap = _props.strokeLinecap,
+    format = _props.format;
+  var _useClassNames = useClassNames(classPrefix),
+    b = _useClassNames.b,
+    m = _useClassNames.m,
+    e = _useClassNames.e,
+    be = _useClassNames.be,
+    bem = _useClassNames.bem,
+    is = _useClassNames.is;
+  var backgroundColor = useMemo(function () {
+    if (typeof color === 'function') {
       return color(percentage);
-    } else if (typeof color === "string") {
+    } else if (typeof color === 'string') {
       return color;
     } else if (color instanceof Array) {
-      const span = 100 / color.length;
-      const seriesColors = color.map((seriesColor, index) => {
-        if (typeof seriesColor === "string") {
+      var _colors;
+      var span = 100 / color.length;
+      var seriesColors = color.map(function (seriesColor, index) {
+        if (typeof seriesColor === 'string') {
           return {
             color: seriesColor,
             percentage: (index + 1) * span
@@ -57,138 +61,169 @@ var Progress = (props) => {
         }
         return seriesColor;
       });
-      const colors = seriesColors.sort((x, y) => x.percentage - y.percentage);
-      for (const item of colors) {
-        if (item.percentage > percentage) {
-          return item.color;
+      var colors = seriesColors.sort(function (x, y) {
+        return x.percentage - y.percentage;
+      });
+      var _iterator = _createForOfIteratorHelper(colors),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var item = _step.value;
+          if (item.percentage > percentage) {
+            return item.color;
+          }
         }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
       }
-      return (_a = colors[colors.length - 1]) == null ? void 0 : _a.color;
+      return (_colors = colors[colors.length - 1]) === null || _colors === void 0 ? void 0 : _colors.color;
     }
     return null;
   }, [color, percentage]);
-  const text = (0, import_react.useMemo)(() => {
+  var text = useMemo(function () {
+    var _props$children5;
     if (!textInside) {
-      if (status === "success" && percentage === 100) {
-        return props.children ?? /* @__PURE__ */ import_react.default.createElement(import_Icon.Icon, { name: "circle-check", prefix: "far" });
+      if (status === 'success' && percentage === 100) {
+        var _props$children;
+        return (_props$children = props.children) !== null && _props$children !== void 0 ? _props$children : /*#__PURE__*/React.createElement(Icon, {
+          name: "circle-check",
+          prefix: "far"
+        });
       }
-      if (status === "warning") {
-        return props.children ?? /* @__PURE__ */ import_react.default.createElement(import_Icon.Icon, { name: "circle-exclamation", prefix: "fas" });
+      if (status === 'warning') {
+        var _props$children2;
+        return (_props$children2 = props.children) !== null && _props$children2 !== void 0 ? _props$children2 : /*#__PURE__*/React.createElement(Icon, {
+          name: "circle-exclamation",
+          prefix: "fas"
+        });
       }
-      if (status === "exception") {
-        return props.children ?? /* @__PURE__ */ import_react.default.createElement(import_Icon.Icon, { name: "circle-xmark", prefix: "fas" });
+      if (status === 'exception') {
+        var _props$children3;
+        return (_props$children3 = props.children) !== null && _props$children3 !== void 0 ? _props$children3 : /*#__PURE__*/React.createElement(Icon, {
+          name: "circle-xmark",
+          prefix: "fas"
+        });
       }
     }
     if (format) {
-      return props.children ?? /* @__PURE__ */ import_react.default.createElement("span", null, format(percentage));
+      var _props$children4;
+      return (_props$children4 = props.children) !== null && _props$children4 !== void 0 ? _props$children4 : /*#__PURE__*/React.createElement("span", null, format(percentage));
     }
-    return props.children ?? /* @__PURE__ */ import_react.default.createElement("span", null, percentage, "%");
+    return (_props$children5 = props.children) !== null && _props$children5 !== void 0 ? _props$children5 : /*#__PURE__*/React.createElement("span", null, percentage, "%");
   }, [format, percentage, props.children, status, textInside]);
-  const bar = (0, import_react.useMemo)(
-    () => /* @__PURE__ */ import_react.default.createElement("div", { className: b`bar` }, /* @__PURE__ */ import_react.default.createElement("div", { className: be("bar", "outer"), style: { height: strokeWidth } }, /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        className: (0, import_classnames.default)(be("bar", "inner"), { [bem("bar", "inner", "indeterminate")]: indeterminate }),
-        style: { width: `${percentage}%`, animationDuration: `${duration}s`, backgroundColor }
-      },
-      showText && textInside && /* @__PURE__ */ import_react.default.createElement("div", { className: be("bar", "innerText") }, props.children ?? /* @__PURE__ */ import_react.default.createElement("span", null, text))
-    ))),
-    [b, props.children, be, strokeWidth, bem, indeterminate, percentage, duration, backgroundColor, showText, textInside, text]
-  );
-  const relativeStrokeWidth = (0, import_react.useMemo)(() => (strokeWidth / width * 100).toFixed(1), [strokeWidth, width]);
-  const radius = (0, import_react.useMemo)(() => {
-    if (type === "circle" || type === "dashboard") {
-      return Number.parseInt(`${50 - Number.parseFloat(relativeStrokeWidth) / 2}`, 10);
+  var bar = useMemo(function () {
+    var _props$children6;
+    return /*#__PURE__*/React.createElement("div", {
+      className: b(_templateObject || (_templateObject = _taggedTemplateLiteral(["bar"])))
+    }, /*#__PURE__*/React.createElement("div", {
+      className: be('bar', 'outer'),
+      style: {
+        height: strokeWidth
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      className: classNames(be('bar', 'inner'), _defineProperty({}, bem('bar', 'inner', 'indeterminate'), indeterminate)),
+      style: {
+        width: "".concat(percentage, "%"),
+        animationDuration: "".concat(duration, "s"),
+        backgroundColor: backgroundColor
+      }
+    }, showText && textInside && /*#__PURE__*/React.createElement("div", {
+      className: be('bar', 'innerText')
+    }, (_props$children6 = props.children) !== null && _props$children6 !== void 0 ? _props$children6 : /*#__PURE__*/React.createElement("span", null, text)))));
+  }, [b, props.children, be, strokeWidth, bem, indeterminate, percentage, duration, backgroundColor, showText, textInside, text]);
+  var relativeStrokeWidth = useMemo(function () {
+    return (strokeWidth / width * 100).toFixed(1);
+  }, [strokeWidth, width]);
+  var radius = useMemo(function () {
+    if (type === 'circle' || type === 'dashboard') {
+      return Number.parseInt("".concat(50 - Number.parseFloat(relativeStrokeWidth) / 2), 10);
     } else {
       return 0;
     }
   }, [relativeStrokeWidth, type]);
-  const trackPath = (0, import_react.useMemo)(() => {
-    const r = radius;
-    const isDashboard = type === "dashboard";
-    return `
-          M 50 50
-          m 0 ${isDashboard ? "" : "-"}${r}
-          a ${r} ${r} 0 1 1 0 ${isDashboard ? "-" : ""}${r * 2}
-          a ${r} ${r} 0 1 1 0 ${isDashboard ? "" : "-"}${r * 2}
-          `;
+  var trackPath = useMemo(function () {
+    var r = radius;
+    var isDashboard = type === 'dashboard';
+    return "\n          M 50 50\n          m 0 ".concat(isDashboard ? '' : '-').concat(r, "\n          a ").concat(r, " ").concat(r, " 0 1 1 0 ").concat(isDashboard ? '-' : '').concat(r * 2, "\n          a ").concat(r, " ").concat(r, " 0 1 1 0 ").concat(isDashboard ? '' : '-').concat(r * 2, "\n          ");
   }, [radius, type]);
-  const perimeter = (0, import_react.useMemo)(() => 2 * Math.PI * radius, [radius]);
-  const rate = (0, import_react.useMemo)(() => props.type === "dashboard" ? 0.75 : 1, [props.type]);
-  const strokeDashoffset = (0, import_react.useMemo)(() => {
-    const offset = -1 * perimeter * (1 - rate) / 2;
-    return `${offset}px`;
+  var perimeter = useMemo(function () {
+    return 2 * Math.PI * radius;
+  }, [radius]);
+  var rate = useMemo(function () {
+    return props.type === 'dashboard' ? 0.75 : 1;
+  }, [props.type]);
+  var strokeDashoffset = useMemo(function () {
+    var offset = -1 * perimeter * (1 - rate) / 2;
+    return "".concat(offset, "px");
   }, [perimeter, rate]);
-  const trailPathStyle = (0, import_react.useMemo)(
-    () => ({
-      strokeDasharray: `${perimeter * rate}px, ${perimeter}px`,
-      strokeDashoffset
-    }),
-    [perimeter, rate, strokeDashoffset]
-  );
-  const circlePathStyle = (0, import_react.useMemo)(
-    () => ({
-      strokeDasharray: `${perimeter * rate * (props.percentage / 100)}px, ${perimeter}px`,
-      strokeDashoffset,
-      transition: "stroke-dasharray 0.6s ease 0s, stroke 0.6s ease"
-    }),
-    [perimeter, props.percentage, rate, strokeDashoffset]
-  );
-  const stroke = (0, import_react.useMemo)(() => {
-    let ret;
+  var trailPathStyle = useMemo(function () {
+    return {
+      strokeDasharray: "".concat(perimeter * rate, "px, ").concat(perimeter, "px"),
+      strokeDashoffset: strokeDashoffset
+    };
+  }, [perimeter, rate, strokeDashoffset]);
+  var circlePathStyle = useMemo(function () {
+    return {
+      strokeDasharray: "".concat(perimeter * rate * (props.percentage / 100), "px, ").concat(perimeter, "px"),
+      strokeDashoffset: strokeDashoffset,
+      transition: 'stroke-dasharray 0.6s ease 0s, stroke 0.6s ease'
+    };
+  }, [perimeter, props.percentage, rate, strokeDashoffset]);
+  var stroke = useMemo(function () {
+    var ret;
     if (props.color) {
       ret = backgroundColor;
     } else {
       switch (props.status) {
-        case "success":
-          ret = "#13ce66";
+        case 'success':
+          ret = '#13ce66';
           break;
-        case "exception":
-          ret = "#ff4949";
+        case 'exception':
+          ret = '#ff4949';
           break;
-        case "warning":
-          ret = "#e6a23c";
+        case 'warning':
+          ret = '#e6a23c';
           break;
         default:
-          ret = "#20a0ff";
+          ret = '#20a0ff';
       }
     }
     return ret;
   }, [backgroundColor, props.color, props.status]);
-  const circle = (0, import_react.useMemo)(
-    () => /* @__PURE__ */ import_react.default.createElement("div", { className: b`circle`, style: { width, height: width } }, /* @__PURE__ */ import_react.default.createElement("svg", { viewBox: "0 0 100 100" }, /* @__PURE__ */ import_react.default.createElement(
-      "path",
-      {
-        className: be("circle", "track"),
-        d: trackPath,
-        stroke: `var(--${import_prefix.globalKey}-fill-color-light, #e5e9f2)`,
-        strokeWidth: relativeStrokeWidth,
-        fill: "none",
-        style: trailPathStyle
-      }
-    ), /* @__PURE__ */ import_react.default.createElement(
-      "path",
-      {
-        className: be("circle", "path"),
-        d: trackPath,
-        stroke,
-        fill: "none",
-        strokeLinecap,
-        strokeWidth: percentage ? relativeStrokeWidth : 0,
-        style: circlePathStyle
+  var circle = useMemo(function () {
+    return /*#__PURE__*/React.createElement("div", {
+      className: b(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["circle"]))),
+      style: {
+        width: width,
+        height: width
       }
-    ))),
-    [b, width, be, trackPath, relativeStrokeWidth, trailPathStyle, stroke, strokeLinecap, percentage, circlePathStyle]
-  );
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(b(), m(type), is(status), props.className), style: props.style }, type === "line" && bar, (type === "circle" || type === "dashboard") && circle, showText && !textInside && /* @__PURE__ */ import_react.default.createElement("div", { className: e`text` }, text));
-};
-Progress.defaultProps = {
-  type: "line",
-  strokeWidth: 6,
-  duration: 3,
-  width: 126,
-  showText: true,
-  strokeLinecap: "round"
+    }, /*#__PURE__*/React.createElement("svg", {
+      viewBox: "0 0 100 100"
+    }, /*#__PURE__*/React.createElement("path", {
+      className: be('circle', 'track'),
+      d: trackPath,
+      stroke: "var(--".concat(namespace, "-fill-color-light, #e5e9f2)"),
+      strokeWidth: relativeStrokeWidth,
+      fill: "none",
+      style: trailPathStyle
+    }), /*#__PURE__*/React.createElement("path", {
+      className: be('circle', 'path'),
+      d: trackPath,
+      stroke: stroke,
+      fill: "none",
+      strokeLinecap: strokeLinecap,
+      strokeWidth: percentage ? relativeStrokeWidth : 0,
+      style: circlePathStyle
+    })));
+  }, [b, width, be, trackPath, relativeStrokeWidth, trailPathStyle, stroke, strokeLinecap, percentage, circlePathStyle]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(b(), m(type), is(status), props.className),
+    style: props.style
+  }, type === 'line' && bar, (type === 'circle' || type === 'dashboard') && circle, showText && !textInside && /*#__PURE__*/React.createElement("div", {
+    className: e(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["text"])))
+  }, text));
 };
-Progress.displayName = "Progress";
-var Progress_default = Progress;
+Progress.displayName = 'Progress';
+export default Progress;

package/dist/Progress/index.js

@@ -1,39 +1 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Progress/index.ts
-var Progress_exports = {};
-__export(Progress_exports, {
-  Progress: () => import_Progress.default
-});
-module.exports = __toCommonJS(Progress_exports);
-var import_Progress = __toESM(require("./Progress"));
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Progress
-});
+export { default as Progress } from "./Progress";

package/dist/Progress/typings.d.ts

@@ -1,18 +1,30 @@
 import { BaseProps, NativeProps } from '../types/common';
 export interface PropgressProps extends BaseProps, NativeProps {
+    /** 百分比，必填 */
     percentage: number;
+    /** 进度条类型 */
     type?: 'line' | 'circle' | 'dashboard';
+    /** 进度条的宽度 */
     strokeWidth?: number;
+    /** 进度条显示文字内置在进度条内（仅 type 为 'line' 时可用） */
     textInside?: boolean;
+    /** 进度条当前状态 */
     status?: 'success' | 'exception' | 'warning';
+    /** 是否为动画进度条 */
     indeterminate?: boolean;
+    /** 控制动画进度条速度 */
     duration?: number;
+    /** 进度条背景色 进度条背景色 （会覆盖 status 状态颜色） */
     color?: string | ((percentage: number) => string) | {
         color: string;
         percentage: number;
     }[];
+    /** 环形进度条画布宽度（只在 type 为 circle 或 dashboard 时可用） */
     width?: number;
+    /** 是否显示进度条文字内容 */
     showText?: boolean;
+    /** circle/dashboard 类型路径两端的形状 */
     strokeLinecap?: 'butt' | 'round' | 'square';
+    /** 指定进度条文字内容 */
     format?: (percentage: number) => string;
 }

package/dist/Progress/typings.js

@@ -1,17 +1 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Progress/typings.ts
-var typings_exports = {};
-module.exports = __toCommonJS(typings_exports);
+export {};