@para-ui/core 3.0.53 → 3.0.55

package/DragVerify/index.d.ts

@@ -1,36 +0,0 @@
-/**
- * @author linhd
- * @date 2023/2/14 10:24
- * @description 滑块验证
- */
-import React, { FunctionComponent } from 'react';
-import './index.scss';
-export interface DragVerifyImgProps {
-    /** 背景图 */
-    sourceImage?: string;
-    /** 移动图 */
-    newImage?: string;
-    /** Y轴位置 */
-    y?: number;
-    [name: string]: any;
-}
-export interface DragVerifyProps {
-    /** 类名 */
-    className?: string;
-    /** 样式 */
-    style?: React.CSSProperties;
-    width?: number | string;
-    /** 图片高 */
-    height?: number | string;
-    /** 刷新 */
-    refresh?: any;
-    /** 获取图片接口 */
-    getImgInfo: () => (Promise<DragVerifyImgProps> | DragVerifyImgProps);
-    /** 提交校验接口 xPos: x轴坐标，imgInfo：图片信息
-     *  true 通过
-     *  false 不通过
-     * */
-    verify: (xPos: number, imgInfo: DragVerifyImgProps) => Promise<boolean> | boolean;
-}
-export declare const DragVerify: FunctionComponent<DragVerifyProps>;
-export default DragVerify;

package/DragVerify/index.js

@@ -1,385 +0,0 @@
-import { _ as _slicedToArray } from '../_verture/slicedToArray-76060636.js';
-import { r as regenerator } from '../_verture/index-beef914f.js';
-import { a as __awaiter } from '../_verture/tslib.es6-55ed4bd2.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useState, useRef, useEffect } from 'react';
-import clsx from 'clsx';
-import DoubleRight from '@para-ui/icons/DoubleRight';
-import CloseIcon from '@para-ui/icons/Close';
-import Check from '@para-ui/icons/Check';
-import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
-import { u as useFormatMessage } from '../_verture/useFormatMessage-703f8b20.js';
-import { Loading } from '../Loading/index.js';
-import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
-import '../_verture/unsupportedIterableToArray-cb478f24.js';
-import '@para-ui/core/GlobalContext';
-import '@para-ui/icons/LoadingF';
-
-var en = {
-  tryAgain: 'Try again',
-  swipe: 'Swipe right to fill puzzle'
-};
-
-var zh = {
-  tryAgain: '再试一次',
-  swipe: '向右滑动填充拼图'
-};
-
-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.paraui-v3-drag-verify {\n  width: 100%;\n  position: relative;\n}\n.paraui-v3-drag-verify > svg {\n  position: absolute;\n  right: 4px;\n  top: 4px;\n  z-index: 10;\n  cursor: pointer;\n  display: none;\n}\n.paraui-v3-drag-verify > .slider-img {\n  position: relative;\n  border-radius: 4px;\n  overflow: hidden;\n  line-height: 0;\n  min-height: 60px;\n}\n.paraui-v3-drag-verify > .slider-img .slider-img-bg {\n  width: 100%;\n  height: auto;\n  border-radius: 4px;\n}\n.paraui-v3-drag-verify > .slider-img .slider-img-move {\n  position: absolute;\n  left: 0;\n  height: auto;\n}\n.paraui-v3-drag-verify > .slider-move {\n  position: relative;\n  text-align: center;\n  line-height: 32px;\n  height: 32px;\n  margin-top: 12px;\n}\n.paraui-v3-drag-verify > .slider-move > .slider-move-bg {\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0;\n  background-color: rgba(171, 176, 185, 0.12);\n  height: 32px;\n  border-radius: 4px;\n  border: 1px solid rgba(171, 176, 185, 0.2);\n}\n.paraui-v3-drag-verify > .slider-move > .slider-move-mask {\n  position: absolute;\n  left: 0;\n  top: 0;\n  height: 32px;\n  width: 2px;\n  border-bottom-left-radius: 4px;\n  border-top-left-radius: 4px;\n}\n.paraui-v3-drag-verify > .slider-move > .slider-move-mask > .slider-move-box {\n  position: absolute;\n  top: 0;\n  left: -1px;\n  width: 32px;\n  height: 32px;\n  background: #fff;\n  cursor: pointer;\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border: 1px solid rgba(171, 176, 185, 0.2);\n}\n.paraui-v3-drag-verify > .slider-move > .slider-move-mask > .slider-move-box:hover .svg-right {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-drag-verify > .slider-move > .slider-move-mask > .slider-move-box .svg-right {\n  display: inline-block;\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-drag-verify > .slider-move > .slider-move-mask > .slider-move-box .svg-close {\n  display: none;\n}\n.paraui-v3-drag-verify > .slider-move > .slider-move-mask > .slider-move-box .svg-check {\n  display: none;\n}\n.paraui-v3-drag-verify > .slider-move > .slider-move-text {\n  color: rgba(46, 55, 67, 0.4);\n  font-size: 14px;\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-move > .slider-move > .slider-move-mask {\n  border: 1px solid rgb(54, 102, 214);\n  border-width: 1px 0 1px 1px;\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-move > .slider-move > .slider-move-mask > .slider-move-box {\n  background-color: rgb(54, 102, 214);\n  border-top: 1px solid rgb(54, 102, 214);\n  border-bottom: 1px solid rgb(54, 102, 214);\n  top: -1px;\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-move > .slider-move > .slider-move-mask > .slider-move-box > .svg-right {\n  color: #fff;\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-error > .slider-move > .slider-move-mask {\n  border: 1px solid rgb(235, 96, 84);\n  border-width: 1px 0 1px 1px;\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-error > .slider-move > .slider-move-mask > .slider-move-box {\n  background-color: rgb(235, 96, 84);\n  border-top: 1px solid rgb(235, 96, 84);\n  border-bottom: 1px solid rgb(235, 96, 84);\n  top: -1px;\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-error > .slider-move > .slider-move-mask > .slider-move-box > .svg-close {\n  display: inline-block;\n  color: #fff;\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-error > .slider-move > .slider-move-mask > .slider-move-box > .svg-right {\n  display: none;\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-error > .slider-move > .slider-move-mask > .slider-move-box > .svg-check {\n  display: none;\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-success > .slider-move > .slider-move-mask {\n  border: 1px solid rgb(83, 195, 27);\n  border-width: 1px 0 1px 1px;\n  background-color: rgba(83, 195, 27, 0.05);\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-success > .slider-move > .slider-move-mask > .slider-move-box {\n  background-color: rgb(83, 195, 27);\n  border-top: 1px solid rgb(83, 195, 27);\n  border-bottom: 1px solid rgb(83, 195, 27);\n  top: -1px;\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-success > .slider-move > .slider-move-mask > .slider-move-box .svg-close {\n  display: none;\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-success > .slider-move > .slider-move-mask > .slider-move-box .svg-right {\n  display: none;\n}\n.paraui-v3-drag-verify.paraui-v3-drag-verify-success > .slider-move > .slider-move-mask > .slider-move-box .svg-check {\n  display: inline-block;\n  color: #fff;\n}";
-styleInject(css_248z);
-
-var DragVerify = function DragVerify(props) {
-  var className = props.className,
-    style = props.style,
-    refresh = props.refresh,
-    getImgInfo = props.getImgInfo,
-    verify = props.verify,
-    width = props.width,
-    height = props.height;
-  var intl = useFormatMessage('DragVerify', localeJson);
-  var _useState = useState(),
-    _useState2 = _slicedToArray(_useState, 2),
-    refreshCom = _useState2[0],
-    setRefreshCom = _useState2[1];
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    loading = _useState4[0],
-    setLoading = _useState4[1];
-  var refDom = useRef(null);
-  var constData = useRef({
-    getImgInfo: getImgInfo,
-    verify: verify
-  });
-  var prefixCls = $prefixCls + '-drag-verify';
-  constData.current.getImgInfo = getImgInfo;
-  constData.current.verify = verify;
-  useEffect(function () {
-    reset();
-    getImgInfoReq();
-    return function () {
-      clearTimeout(constData.current.timerError);
-      clearTimeout(constData.current.timerSuccess);
-    };
-  }, [refresh, refreshCom]);
-  /** 获取图片信息 */
-  var getImgInfoReq = function getImgInfoReq() {
-    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee() {
-      var result;
-      return regenerator.wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            constData.current.padding = true;
-            setLoading(true);
-            _context.next = 4;
-            return constData.current.getImgInfo();
-          case 4:
-            result = _context.sent;
-            constData.current.imgInfo = result;
-            initImg();
-          case 7:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee);
-    }));
-  };
-  /** 校验滑块 */
-  var sliderPosiCheck = function sliderPosiCheck(x, callback) {
-    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee2() {
-      var result;
-      return regenerator.wrap(function _callee2$(_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
-          case 0:
-            _context2.next = 2;
-            return constData.current.verify(x, constData.current.verify);
-          case 2:
-            result = _context2.sent;
-            callback(result);
-          case 4:
-          case "end":
-            return _context2.stop();
-        }
-      }, _callee2);
-    }));
-  };
-  /** 初始化图片 */
-  var initImg = function initImg() {
-    var _a;
-    if (!refDom.current) return;
-    // 背景图
-    var imgBg = document.createElement('img');
-    imgBg.setAttribute('src', (_a = constData.current.imgInfo) === null || _a === void 0 ? void 0 : _a.sourceImage);
-    imgBg.style.display = 'none';
-    // 滑动的图片
-    var imgMove = document.createElement('img');
-    constData.current.imgMove = imgMove;
-    imgMove.className = 'slider-img-move';
-    imgMove.style.display = 'none';
-    var sliderImgEle = refDom.current.querySelector('.slider-img');
-    var refreshEle = refDom.current.querySelector('.refresh');
-    if (!sliderImgEle || !refreshEle) return;
-    refreshEle.style.display = 'none';
-    sliderImgEle.innerHTML = '';
-    sliderImgEle.append(imgBg);
-    imgBg.onload = function () {
-      var _a;
-      imgBg.style.display = 'inline-block'; // 必须先显示图片,要不然ie10获取不到图片
-      imgMove.setAttribute('src', (_a = constData.current.imgInfo) === null || _a === void 0 ? void 0 : _a.newImage);
-      var a = imgBg.width;
-      imgBg.className = 'slider-img-bg';
-      imgBg.style.display = 'inline-block';
-      if (!refDom.current) return;
-      var sliderImgEle = refDom.current.querySelector('.slider-img');
-      var sliderImgEleRect = sliderImgEle === null || sliderImgEle === void 0 ? void 0 : sliderImgEle.getBoundingClientRect();
-      var b = sliderImgEleRect.width;
-      constData.current.imgScale = a / b;
-      sliderImgEle === null || sliderImgEle === void 0 ? void 0 : sliderImgEle.append(imgMove);
-      imgMove.onload = function () {
-        var _a;
-        constData.current.padding = false;
-        imgMove.style.display = 'inline-block'; // 必须先显示图片,要不然ie10获取不到图片
-        refreshEle.style.display = 'inline-block';
-        imgMove.width = imgMove.width / constData.current.imgScale;
-        imgMove.style.top = ((_a = constData.current.imgInfo) === null || _a === void 0 ? void 0 : _a.y) / constData.current.imgScale + 'px';
-        setLoading(false);
-      };
-    };
-    registerEvents(imgBg, imgMove);
-  };
-  /** 注册事件 */
-  var registerEvents = function registerEvents(imgBg, imgMove) {
-    var sliderBox = refDom.current;
-    if (!sliderBox) return;
-    var moveDom = sliderBox.querySelector('.slider-move-box'); // 滑块
-    var moveProgress = sliderBox.querySelector('.slider-move-mask'); // 滑动距离元素
-    var moveSliderEle = sliderBox.querySelector('.slider-move'); // 进度条的宽
-    var sliderText = sliderBox.querySelector('.slider-move-text'); // 互动轨道显示的文字
-    var moveSliderRect = moveSliderEle.getBoundingClientRect();
-    var moveDomRect = moveDom.getBoundingClientRect();
-    var moveDomWidth = moveDomRect.width; // 移动箭头的框
-    var moveSliderWidth = moveSliderRect.width; // 进度条的宽
-    moveDom.onmousedown = function (e) {
-      if (constData.current.padding) return;
-      sliderBox.classList.add(prefixCls + '-move');
-      document.onmousemove = function (event) {
-        var moveW = event.pageX - e.pageX; // 鼠标移动的距离
-        if (moveW < 0) moveW = 0;
-        if (moveW + moveDomWidth > imgBg.width) moveW = imgBg.width - moveDomWidth;
-        moveDom.style.left = moveW - 1 + 'px';
-        // 加一防止滑块与进度条之间有间隙
-        moveProgress.style.width = (moveW < 2 ? 2 : moveW) + 'px';
-        // 进度条走过的比例
-        var ratio = moveW / (moveSliderWidth - moveDomWidth);
-        var imgMoveWidth = (imgBg.width - imgMove.width) * ratio;
-        imgMove.style.left = imgMoveWidth + 'px';
-        sliderText.innerHTML = '';
-      };
-      // 鼠标抬起
-      document.onmouseup = function () {
-        document.onmousemove = null;
-        document.onmouseup = null;
-        sliderBox.classList.remove(prefixCls + '-move');
-        constData.current.padding = true;
-        var X = parseFloat(imgMove.style.left);
-        var handX = X * constData.current.imgScale;
-        sliderPosiCheck(handX, function (result) {
-          if (!result) {
-            // 错误
-            sliderBox.classList.add(prefixCls + '-error');
-            constData.current.timerError = setTimeout(function () {
-              constData.current.padding = false;
-              reset();
-              sliderText.innerHTML = intl({
-                id: 'tryAgain'
-              }); // 再试一次
-              getImgInfoReq();
-            }, 1000);
-            return;
-          }
-          sliderBox.classList.add(prefixCls + '-success');
-          /*constData.current.timerSuccess = setTimeout(() => {
-              //constData.current.padding = false;
-              //sliderBox.classList.remove(prefixCls + '-success');
-          }, 1000);*/
-        });
-      };
-    };
-  };
-  /** 复位 */
-  var reset = function reset() {
-    var sliderBox = refDom.current;
-    if (!sliderBox) return;
-    sliderBox.classList.remove(prefixCls + '-success');
-    sliderBox.classList.remove(prefixCls + '-error');
-    var moveDom = sliderBox.querySelector('.slider-move-box'); // 滑块
-    var moveProgress = sliderBox.querySelector('.slider-move-mask'); // 滑动距离元素
-    var sliderText = sliderBox.querySelector('.slider-move-text'); // 互动轨道显示的文字
-    sliderText.innerHTML = intl({
-      id: 'swipe'
-    }); // 再试一次
-    moveDom.style.left = '-1px';
-    moveProgress.style.width = '0px';
-    if (constData.current.imgMove) constData.current.imgMove.style.left = '0px';
-  };
-  /* 刷新 */
-  var clickRefresh = function clickRefresh() {
-    setRefreshCom(Math.random());
-  };
-  /* 处理标签内容 */
-  var handStyle = function handStyle() {
-    var obj = {};
-    if (width) {
-      var widthHand = width;
-      if (typeof width === 'number') widthHand = width + 'px';
-      obj.width = widthHand;
-    }
-    if (height) {
-      var heightHand = height;
-      if (typeof height === 'number') heightHand = height + 'px';
-      obj.height = heightHand;
-    }
-    return obj;
-  };
-  var makeCls = function makeCls() {
-    return clsx(prefixCls, className);
-  };
-  return jsxs("div", Object.assign({
-    className: makeCls(),
-    style: style,
-    ref: refDom
-  }, {
-    children: [jsxs("svg", Object.assign({
-      onClick: clickRefresh,
-      className: 'refresh',
-      width: "26.529",
-      height: "26.017",
-      viewBox: "0 0 26.529 26.017"
-    }, {
-      children: [jsxs("defs", {
-        children: [jsxs("filter", Object.assign({
-          id: "a",
-          x: "0",
-          y: "0",
-          width: "26.529",
-          height: "17",
-          filterUnits: "userSpaceOnUse"
-        }, {
-          children: [jsx("feOffset", {
-            dy: "1"
-          }), jsx("feGaussianBlur", {
-            stdDeviation: "1",
-            result: "b"
-          }), jsx("feFlood", {}), jsx("feComposite", {
-            operator: "in",
-            in2: "b"
-          }), jsx("feComposite", {
-            in: "SourceGraphic"
-          })]
-        })), jsxs("filter", Object.assign({
-          id: "c",
-          x: "0",
-          y: "9.017",
-          width: "26.529",
-          height: "17",
-          filterUnits: "userSpaceOnUse"
-        }, {
-          children: [jsx("feOffset", {
-            dy: "1"
-          }), jsx("feGaussianBlur", {
-            stdDeviation: "1",
-            result: "d"
-          }), jsx("feFlood", {}), jsx("feComposite", {
-            operator: "in",
-            in2: "d"
-          }), jsx("feComposite", {
-            in: "SourceGraphic"
-          })]
-        }))]
-      }), jsxs("g", Object.assign({
-        style: {
-          opacity: 0.7,
-          isolation: 'isolate'
-        },
-        transform: "translate(-286.735 -95.991)"
-      }, {
-        children: [jsx("g", Object.assign({
-          transform: "translate(288 96)"
-        }, {
-          children: jsx("rect", {
-            style: {
-              fill: 'none'
-            },
-            width: "24",
-            height: "24"
-          })
-        })), jsxs("g", Object.assign({
-          transform: "translate(289.735 97.991)"
-        }, {
-          children: [jsx("g", Object.assign({
-            style: {
-              filter: 'url(#a)'
-            },
-            transform: "matrix(1, 0, 0, 1, -3, -2)"
-          }, {
-            children: jsx("path", {
-              style: {
-                fill: '#FFFFFF'
-              },
-              d: "M577.409,536.791a1,1,0,0,0,1-1A8,8,0,0,1,592.817,531h0c.077.1.149.207.22.312l-1.911-.765a1,1,0,1,0-.743,1.856l3.7,1.483a1,1,0,0,0,1.3-.557l1.482-3.7a1,1,0,1,0-1.857-.744l-.448,1.12c-.048-.067-.093-.137-.143-.2h0a10,10,0,0,0-18.009,5.989A1,1,0,0,0,577.409,536.791Z",
-              transform: "translate(-573.41 -523.79)"
-            })
-          })), jsx("g", Object.assign({
-            style: {
-              filter: 'url(#c)'
-            },
-            transform: "matrix(1, 0, 0, 1, -3, -2)"
-          }, {
-            children: jsx("path", {
-              style: {
-                fill: '#FFFFFF'
-              },
-              d: "M595.938,534.808a1,1,0,0,0-1,1,8,8,0,0,1-14.409,4.79h0c-.076-.1-.148-.206-.219-.312l1.911.765a1,1,0,0,0,.743-1.857l-3.7-1.482a1,1,0,0,0-1.3.557l-1.482,3.7a1,1,0,0,0,1.856.743l.449-1.12c.047.067.093.136.142.2h0a10,10,0,0,0,18.009-5.989A1,1,0,0,0,595.938,534.808Z",
-              transform: "translate(-573.41 -523.79)"
-            })
-          }))]
-        }))]
-      }))]
-    })), jsx("div", {
-      className: "slider-img",
-      style: handStyle()
-    }), jsxs("div", Object.assign({
-      className: "slider-move"
-    }, {
-      children: [jsx("div", {
-        className: "slider-move-bg"
-      }), jsx("div", Object.assign({
-        className: "slider-move-mask"
-      }, {
-        children: jsxs("div", Object.assign({
-          className: "slider-move-box"
-        }, {
-          children: [jsx(DoubleRight, {
-            className: 'svg-right'
-          }), jsx(CloseIcon, {
-            className: 'svg-close'
-          }), jsx(Check, {
-            className: 'svg-check'
-          })]
-        }))
-      })), jsx("span", Object.assign({
-        className: "slider-move-text"
-      }, {
-        children: intl({
-          id: 'swipe'
-        })
-      }))]
-    })), loading && jsx(Loading, {})]
-  }));
-};
-
-export { DragVerify, DragVerify as default };

package/DragVerify/lang/en_US.d.ts

@@ -1,5 +0,0 @@
-declare const _default: {
-    tryAgain: string;
-    swipe: string;
-};
-export default _default;

package/DragVerify/lang/index.d.ts

@@ -1,11 +0,0 @@
-declare const _default: {
-    zh: {
-        tryAgain: string;
-        swipe: string;
-    };
-    en: {
-        tryAgain: string;
-        swipe: string;
-    };
-};
-export default _default;

package/DragVerify/lang/zh_CN.d.ts

@@ -1,5 +0,0 @@
-declare const _default: {
-    tryAgain: string;
-    swipe: string;
-};
-export default _default;

package/Drawer/index.d.ts

@@ -1,11 +0,0 @@
-/**
- * @author Hanz
- * @date 2021/8/9 下午3:46
- * @description drawer
- */
-import { FunctionComponent } from 'react';
-import { DrawerProps } from './interface';
-import './index.scss';
-export declare const Drawer: FunctionComponent<DrawerProps>;
-export type { DrawerProps };
-export default Drawer;